@charset "utf-8";
/* layout.css는 전체적인 레이아웃 스타일을 정의합니다. */ 

#skipToContent a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skipToContent a:focus, 
#skipToContent a:active {width:200px;height:50px;background:#21272e;color:#fff;font-size:14px;font-weight:bold;text-align:center;text-decoration:none;line-height:50px;outline-color:#f37736;}

.only-desktop-tablet {display:block;}
.only-desktop {display:block;}
.only-tablet {display:none;}
.only-mobile {display:none;}

#wrapper {}
/* position:relative; overflow:hidden; */


/* header */
#header {position:fixed; top:0; left:0; width:100%; z-index:100; transition:.3s;}
#header .contain {max-width:1780px; z-index:90;position:relative;display:flex; justify-content:space-between; align-items:center; height:var(--header-height);}

.header {position:relative;z-index:90;}
.sitelogo a {display:block; background-image:url(/images/common/logo.png); width:265px; height:20px; background-repeat:no-repeat; background-size:contain;}
#gnb {display: flex; width: 100%; margin-left: 95px;}
#gnb>ul {display:flex; text-align:center;} 
#gnb>ul>li {position:relative; padding: 0 40px;}
#gnb>ul>li:first-child {padding-left: 120px;}
#gnb>ul>li:hover::after {content:''; position:absolute; width:100%; height:3px; background-color:var(--color-primary); left:0; bottom:-3px;}
#gnb>ul>li>a {position:relative; display:flex; align-items:center; justify-content:center; color:#fff; text-transform: uppercase; font-size:var(--font-size-20); font-weight:600; letter-spacing:-.02em; line-height:1.4em; height:var(--header-height);}
/* #gnb>ul>li>a:after {content:""; position:absolute; bottom:-1px; left:50%; transform:translateX(-50%); width:0; height:2px; background:var(--color-primary); transition:.2s;} */
#gnb .submenu {position: absolute; left: 0; width: 100%; height: 0; overflow: hidden;}
#gnb .submenu>ul {padding:20px 40px;}
#gnb .submenu>ul>li>a {display:block; padding:7.5px 0; color:#505050; line-height:1.33em; font-size:var(--font-size-16);}
#gnb .submenu>ul>li>a:hover {color:var(--color-primary);}
.submenu-bg {display:none; position:absolute; width:100%; left:0; background:rgba(255,255,255,.8); border-top:1px solid #ddd;  z-index:-1;}

#header .right {display: flex; align-items: center;}

.language {position:relative; margin-right:70px;}
.language .lang {display:flex; align-items:center; font-weight:600; line-height:1.4em; letter-spacing:-.03em; color:#fff;}
.language .lang:before {content:''; margin-right:7px;width:17px; height:16px; background:url('../images/common/lang-ico.png') no-repeat 50% 50% /contain;}
.language .lang:after {content:""; margin-left:10px; margin-top:-4px; width:6px; height:6px; border-right:2px solid #fff; border-bottom:2px solid #fff; transform:rotate(45deg);}
.language.active .lang:after {transform:rotate(-135deg); margin-top:2px;}
.language .list {display:none; position:absolute; left:50%; transform:translateX(-50%); margin-left:5px; z-index:55; top:35px; width:60px;}
.language .list li {padding:2px 0;}
.language .list li a {display:flex; align-items:center; justify-content:center; height:24px; text-align:center;background:var(--color-primary); border-color:var(--color-primary); color:#fff; border-radius:12px; font-size:var(--font-size-14); font-weight:600; letter-spacing:-.03em; line-height:1.33em; }

#header:hover {background-color:#fff;}
#header:hover .sitelogo a {background-image:url(/images/common/logo-on.png);}
#header:hover #gnb>ul>li {padding: 0 120px;}
#header:hover #gnb>ul>li>a {color:#2c2c2c;}
#header:hover .language .lang {color:#242424;}
#header:hover .language .lang:before {background: url(../images/common/lang-ico-on.png) no-repeat 50% 50% / contain;}
#header:hover .language .lang:after {border-right: 2px solid #242424; border-bottom: 2px solid #242424;}

#header.header-fixed {background:#fff; }
#header.header-fixed .sitelogo a {background-image:url(/images/common/logo-on.png);}
#header.header-fixed #gnb>ul>li> a {color:#242424;}
#header.header-fixed #gnb>ul>li.active>a:after {width:60px;}
#header.header-fixed .language .lang {color:#242424;}
#header.header-fixed .language .lang:before {background: url(../images/common/lang-ico-on.png) no-repeat 50% 50% / contain;}
#header.header-fixed .language .lang:after {border-right: 2px solid #242424; border-bottom: 2px solid #242424;}

#main.fp-viewing-page5 .sitelogo a {background-image:url(/images/common/logo-on.png);}
#main.fp-viewing-page5 #gnb>ul>li>a {color:#242424;}
#main.fp-viewing-page5 .language .lang {color:#242424;}
#main.fp-viewing-page5 .language .lang:before {background: url(../images/common/lang-ico-on.png) no-repeat 50% 50% / contain;}
#main.fp-viewing-page5 .language .lang:after {border-right: 2px solid #242424; border-bottom: 2px solid #242424;}

/* 전체메뉴 */
.btn-all-menu {display:block; width:50px; height:51px; background:url('/images/common/menu-icon.png') no-repeat 50% 50% / contain;}

.allmenu {padding-top:var(--header-height);position:fixed; top:0; left:0; width:100%; height:100%; background:url('/images/common/all-menu-bg.jpg') no-repeat 50% 50% /cover; transform:translateY(-100%); transition:.2s linear; z-index:99; color:#fff;}
.allmenu .contain {max-width:1460px; display:flex; align-items:center;height:100%;}
.allmenu .nav {flex:1 1 auto; min-width:0; width:1%;position:relative; border-right:1px solid rgba(255,255,255,0.6);height:100%; display:flex; align-items:center;}
.allmenu .nav > ul > li {margin-bottom:40px;font-size:var(--font-size-60); font-weight:700; letter-spacing:-.03em; line-height:1.4em; color:#ccc; text-transform: uppercase;}
.allmenu .nav > ul > li:hover > a {color:#fff;}
.allmenu .nav .submenu {margin-top:10px;}
.allmenu .nav .submenu .cnt {display:none;}
.allmenu .nav .submenu ul {display:flex;}
.allmenu .nav .submenu ul li {position:relative; padding:0 20px;font-size:var(--font-size-20); font-weight:400; letter-spacing:-.03em; line-height:1.4em; color:#ccc;}
.allmenu .nav .submenu ul li:after {content:''; position:absolute; right:0; top:50%; margin-top:-8px; width:1px; height:16px; background:rgba(255,255,255,0.3);}
.allmenu .nav .submenu ul li:last-child:after {display:none;}
.allmenu .nav .submenu ul li:first-child {padding-left:0;}
.allmenu .nav .submenu ul li:hover a {color:#fff; text-decoration: underline;}
.allmenu .comp-info {width:500px; display:flex; justify-content:flex-end;}
.allmenu .comp-info .logo {margin-bottom:50px;}
.allmenu .comp-info .con {display:flex;}
.allmenu .comp-info .con dl + dl {margin-left:55px;}
.allmenu .comp-info .con dl dt {margin-bottom:4px;font-weight:600; letter-spacing:-.03em; line-height:1.4em; color:#c4cce0;}
.allmenu .comp-info .con dl dd {font-size:var(--font-size-15);font-weight:500; letter-spacing:-.03em; line-height:1.4em; color:#f2f2f2;}


/* all-menu-opened 클릭 */
html.all-menu-opened {overflow:hidden;}
html.all-menu-opened #header {background:transparent !important; box-shadow:none;}
html.all-menu-opened .sitelogo a {display:none;}
html.all-menu-opened #gnb {display:none;}
html.all-menu-opened .language {display:none;}
html.all-menu-opened .btn-all-menu {background-image:url('/images/common/close.png') !important;}
html.all-menu-opened .allmenu {transform:translateY(0);}
html.all-menu-opened #fp-nav {display: none;}

/* for mobile */
.btn-m-menu {display:none; width:40px; height:40px; background:url('/images/common/menu-icon.png') no-repeat 50% 50% / contain;}

.mobile-navigation {display:none; position:fixed; top:0; right:0; width:300px; height:100%; overflow:auto; transition:.2s linear; -ms-transform:translateX(100%); transform:translateX(100%); background:#fff; z-index:102;}
.mobile-navigation .home {display:flex; align-items:center; height:80px; padding:0 20px; color:#242424; font-size:19px; font-weight:700; line-height:1.5em;}
.mobile-navigation .home a {display: flex;}
.mobile-navigation .home img {height:15px;}
.mobile-navigation .nav-menu>ul {border-top:1px solid #ddd;}
.mobile-navigation .nav-menu>ul>li {border-bottom:1px solid #ddd;}
.mobile-navigation .nav-menu>ul>li>a {position:relative; padding:10px 48px 10px 20px; display:block; color:#242424; font-size:19px; font-weight:700; line-height:1.5em;}
.mobile-navigation .nav-menu>ul>li>a:after {content:""; position:absolute; top:50%; right:20px; transform:translateY(-75%) rotate(45deg); width:11px; height:11px; border-right:2px solid #505050; border-bottom:2px solid #505050;}
.mobile-navigation .nav-menu>ul>li.active>a {color:#fff; background:var(--color-primary);}
.mobile-navigation .nav-menu>ul>li.active>a:after {transform:translateY(-35%) rotate(-135deg); border-color:#fff;}
.mobile-navigation .nav-menu .submenu {display:none; background:#f8f8f8; color:#454545; font-size:16px; font-weight:400; line-height:1.5em;}
.mobile-navigation .nav-menu .submenu .cnt {display:none;}
.mobile-navigation .nav-menu .submenu ul li {border-top:1px solid #e5e5e5;}
.mobile-navigation .nav-menu .submenu ul li a {display:block; padding:12px 20px;}
.mobile-navigation .nav-menu .submenu ul li a:hover {color:var(--color-primary);}
.mobile-navigation .nav-menu .submenu ul li p {padding:12px 20px;}

.mobile-navigation .nav-menu .submenu>ul>li li a {color:#898989; position:relative;}

.mobile-navigation .close {position:absolute; top:25px; right:15px; width:26px; height:26px; text-indent:-9999em; overflow:hidden;}
.mobile-navigation .close:before,
.mobile-navigation .close:after {content:" "; position:absolute; top:12px; left:0; width:100%; height:3px; background:#242424; border-radius:3px;}
.mobile-navigation .close:before {transform:rotate(45deg);}
.mobile-navigation .close:after {transform:rotate(-45deg);}
.mobile-overlay {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.6; z-index:101;}

html.menu-opened {overflow:hidden;}
html.menu-opened .mobile-navigation {-ms-transform:translateX(0); transform:translateX(0);}
html.menu-opened .mobile-overlay {display:block;}
html.all-menu-opened #header {background: transparent !important; border-bottom: 1px solid rgba(255, 255, 255, 0.6);}


/* .mobile-navigation {display:none; position:fixed; top:0; right:0; width:300px; height:100%; overflow:auto; transition:.2s linear; -ms-transform:translateX(100%); transform:translateX(100%); background:#fff; z-index:102;}
.mobile-navigation .home {display:flex; align-items:center; height:80px; padding:0 20px; color:#242424; font-size:19px; font-weight:700; line-height:1.5em;}
.mobile-navigation .home img {height:30px;}
.mobile-navigation .nav-menu>ul {border-top:1px solid #ddd;}
.mobile-navigation .nav-menu>ul>li {border-bottom:1px solid #ddd;}
.mobile-navigation .nav-menu>ul>li>a {position:relative; padding:10px 48px 10px 20px; display:block; color:#242424; font-size:19px; font-weight:700; line-height:1.5em;}
.mobile-navigation .nav-menu>ul>li>a:after {content:""; position:absolute; top:50%; right:20px; transform:translateY(-75%) rotate(45deg); width:11px; height:11px; border-right:2px solid #505050; border-bottom:2px solid #505050;}
.mobile-navigation .nav-menu>ul>li.active>a {color:#fff; background:var(--color-primary);}
.mobile-navigation .nav-menu>ul>li.active>a:after {transform:translateY(-35%) rotate(-135deg); border-color:#fff;}
.mobile-navigation .nav-menu .submenu {display:none; background:#f8f8f8; color:#454545; font-size:16px; font-weight:400; line-height:1.5em;}
.mobile-navigation .nav-menu .submenu ul li {border-top:1px solid #e5e5e5;}
.mobile-navigation .nav-menu .submenu ul li a {display:block; padding:12px 20px;}
.mobile-navigation .nav-menu .submenu ul li a:hover {color:var(--color-primary);}
.mobile-navigation .close {position:absolute; top:25px; right:15px; width:26px; height:26px; text-indent:-9999em; overflow:hidden;}
.mobile-navigation .close:before,
.mobile-navigation .close:after {content:" "; position:absolute; top:12px; left:0; width:100%; height:3px; background:#242424; border-radius:3px;}
.mobile-navigation .close:before {transform:rotate(45deg);}
.mobile-navigation .close:after {transform:rotate(-45deg);}
.mobile-overlay {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.6; z-index:101;}

html.menu-opened {overflow:hidden;}
html.menu-opened .mobile-navigation {-ms-transform:translateX(0); transform:translateX(0);}
html.menu-opened .mobile-overlay {display:block;} */

/* main */
#main #contain .contain {max-width:1460px;}

.page1 .contain,
.page2 .contain,
.page3 .contain,
.page4 .contain {position: relative; height: 100%;}
.main-sec .main-txt {padding: 0 30px; position:absolute; bottom:10%; left:0; width:100%; z-index:2;}
.section .sec-tit {text-transform: uppercase; font-weight:800;font-size:var(--font-size-70); letter-spacing:-.03em; line-height:1.3em;  color:#fff;}
.section .sec-txt {font-size:var(--font-size-24); font-weight:800; letter-spacing:-.03em; line-height:1.67em;  color:#fff;}
.main-sec .more {display: flex; align-items: center; margin-top: 75px; font-size:var(--font-size-18); font-weight:600; letter-spacing:-.03em; line-height:1.67em;  color:#fff;}
.main-sec .more .img {margin-left: 30px; background-image: url(/images/main/more.png); width: 80px; height: 60px; background-repeat: no-repeat; background-size: contain;}
.main-sec .more:hover .img {background-image: url(/images/main/more-on.png);}

.main-visual {overflow:hidden;}
.main-visual .item {height:100vh;}
.main-visual .item>.img {transition:5s; transform:scale(1); position: relative; height: 100%; padding-bottom:100vh; overflow: hidden;}
.main-visual .item>.img img {position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.main-visual .slick-slide.active .item>.img {transform:scale(1.06);}
.main-visual .caption {position:absolute; bottom:10%; left:0; width:100%; z-index:2; transition:1.2s; transform:translateY(50px); -ms-transform:translateY(50px); -webkit-transform:translateY(50px); opacity:0;}
.main-visual .contain {position:relative; display:flex; justify-content:space-between; align-items:flex-start; }
.main-visual .active .caption {transform:translateY(0); opacity:1;}

.main-visual .more {display: flex; align-items: center; margin-top: 75px; font-size:var(--font-size-18); font-weight:600; letter-spacing:-.03em; line-height:1.67em;  color:#fff; /* transition:1.2s; transform:translateY(50px); -ms-transform:translateY(50px); -webkit-transform:translateY(50px);opacity:0; */}
.main-visual .more .img {margin-left: 30px; background-image: url(/images/main/more.png); width: 80px; height: 60px; background-repeat: no-repeat; background-size: contain;}
.main-visual .more:hover .img {background-image: url(/images/main/more-on.png);}

.scroll_down {position:absolute; bottom:3%; right:3%; z-index:10; animation-name:scroll_down_motion; animation-duration:2s; animation-timing-function:linear; animation-iteration-count:infinite;}
@-webkit-keyframes scroll_down_motion {
    0% {
        bottom:3%;
    }
    50% {
        bottom:5%;
    }
    100% {
        bottom:3%;
    }
}

.page1 {background-image: url(/images/main/biz-bg.jpg); background-position: 50%; background-repeat: no-repeat; background-size: cover; width: 100%; height: 100%;}

.page2 {background-image: url(/images/main/biz-bg2.jpg); background-position: 50%; background-repeat: no-repeat; background-size: cover; width: 100%; height: 100%;}

.page3 {background-image: url(/images/main/biz-bg3.jpg); background-position: 50%; background-repeat: no-repeat; background-size: cover; width: 100%; height: 100%;}


.sec-txt2 {font-size:var(--font-size-24); font-weight:600; letter-spacing:.1em; line-height:1.67em;  color:var(--color-primary);}

.page4 {background-image: url(/images/main/biz-bg4-2.jpg); background-position: 50%; background-repeat: no-repeat; background-size: cover; width: 100%; height: 100%;}
.page4 .tit-wrap {height: 100%;}
.page4 .contain {height: 100%;position: relative; }
.page4-img {height: 100%;}
.page4 .img {text-align: center; height: 100%; display: inline-flex; align-items: center; justify-content: center;}
.page4 .main-txt {display: flex; justify-content: space-between; align-items: flex-end;}
.page4 .main-txt .map-txt{color: rgba(255, 255, 255, .5); font-size: 12px; letter-spacing: 0; line-height: 1.2em; margin-bottom: 10px;}

.slide_side {position: relative; left:50%; transform: translateX(-50%); z-index:10; animation-name:slide_side_motion; animation-duration:2s; animation-timing-function:linear; animation-iteration-count:infinite;}
@-webkit-keyframes slide_side_motion {
    0% {
        left:50%;
    }
    50% {
        left:53%;
    }
    100% {
        left:50%;
    }
}

.page5 .main-txt {padding: 0; position: static;}
.page5 .more {margin-top:0;}
.page5 .sec-tit {color: #000;}
.page5 .sec-txt {color: #454545; font-size: var(--font-size-20); letter-spacing: -.03em; line-height: 1.2em; font-weight: 400;}
.page5 .more { color:#242424;}
.page5 .more .img {background-image: url(/images/main/more2.png);}
.page5 .more:hover .img {background-image: url(/images/main/more2-on.png);}
.page5 .items {margin-top: 55px;}
.page5 .items .slick-list {margin: 0 -15px;}
.page5 .items .slick-slide {padding: 0 15px;}
.page5 .items .item .img {position:relative; padding-bottom:62.78%; margin-bottom:25px; border-radius: 20px; overflow:hidden;}
.page5 .items .item .img img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.page5 .items .item h3 {font-size: var(--font-size-22); font-weight: 600; letter-spacing: -.03em; line-height: 1.2em; color: #242424;}
.page5 .items .item .txt {margin: 20px 0; font-size: var(--font-size-16); letter-spacing: -.03em; line-height: 1.5em;}
.page5 .items .item .date {font-size: var(--font-size-15); letter-spacing: -.03em; line-height: 1.5em; color: #ababab;}
.page5 .items .slick-arrow {position: absolute; z-index: 1; top: 50%; transform: translateY(-50%); width: 60px; height: 60px; background-color: #fff; border: 1px solid #ddd; border-radius: 100%; background-position: 50%; background-repeat: no-repeat; font-size: 0;}
.page5 .items .slick-prev {left: -7%; background-image: url(/images/main/arrow.png);}
.page5 .items .slick-next {right: -7%; background-image: url(/images/main/arrow2.png);}
.page5 .items .slick-arrow:hover {border-color: var(--color-primary); background-color: var(--color-primary);}
.page5 .items .slick-prev:hover {background-image: url(/images/main/arrow-on.png);}
.page5 .items .slick-next:hover {background-image: url(/images/main/arrow2-on.png);}

.page6 {background-image: url(/images/main/biz-bg6.jpg); background-position: 50%; background-repeat: no-repeat; background-size: cover; width: 100%; height: 100%;}
.page6 .main-txt {position: static; text-align: center;}
.page6 .sec-tit {font-size: var(--font-size-60); font-weight: 500;}
.page6 .sec-tit strong {font-weight: 800;}
.page6 .sec-txt {margin-top: 20px;font-size: var(--font-size-20); font-weight: 400;}
.page6 .more {justify-content: center; margin-top: 50px;}
.page6 .more p {display: inline-flex; align-items: center; justify-content: space-between; padding: 0 40px; width: 200px; height: 60px; border-radius: 30px; border: 1px solid #fff; }
.page6 .more:hover p {background-color:var(--color-primary) ; border: 1px solid var(--color-primary);}


/* sub */
#contArea {max-width:1460px; padding-left:30px; padding-right:30px; margin:0 auto;}
#contArea.wide {max-width:100%; padding-left:0; padding-right:0;}

.contain {width:100%; max-width:1460px; padding-left:30px; padding-right:30px; margin:0 auto;}

.real-cont {min-height:300px; padding:120px 0;}
.real-cont.ty2 {padding-bottom:0px;}

.sub-title h1 {margin:75px 0 90px; text-align:center; width:auto; font-size:38px; line-height:1.35em; color:#242424; letter-spacing:-.03em;}

.sub-visual {position:relative; height:530px; color:#fff; overflow:hidden; background:#333;}
.sub-visual .bg {position:absolute; top:0; left:0; width:100%; height:100%; overflow:hidden; transition:2s; opacity:1; transform:scale(1.1); background-repeat:no-repeat; background-position:50% 0; background-size:cover;}
.sub-visual .inner {position:absolute; top:50%; left:0; width:100%; transform:translateY(-50%);}
.sub-visual .t1 {display:none; position: relative; margin-bottom: 12px; padding-left: 40px; font-size:var(--font-size-16); font-weight:600; letter-spacing:-.03em; line-height:1.33em;}
.sub-visual .t1::before {content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 30px; height: 1px ; background-color: #fff;}
.sub-visual .t2 {font-size:var(--font-size-70); font-weight:800; letter-spacing:-.03em; line-height:1.33em;}
.sub-visual .bg1 {background-image:url("/images/sub/sv1.jpg");}
.sub-visual .bg2 {background-image:url("/images/sub/sv2.jpg");}
.sub-visual .bg3 {background-image:url("/images/sub/sv3.jpg");}
.sub-visual .bg4 {background-image:url("/images/sub/sv4.jpg");}
.loaded .sub-visual .bg {transform:scale(1); opacity:1;}

.lnb-wrap {border-bottom: 1px solid #ddd;}
.lnb {margin:0 auto; max-width:1400px;}
.lnb ul {height:80px; width:100%; margin: 0 -20px;}
.lnb li {width:auto; padding: 0 20px;}
.lnb li a {position: relative; padding: 0 10px; font-size:18px; line-height:1.33em; letter-spacing:-.04em; color:#898989;}
.lnb li.active a {color:var(--color-primary);}
.lnb li.active a::after {content: ''; position: absolute; left: 0; bottom: 0px; width: 100%; height: 2px; background-color: var(--color-primary);}
.lnb li a {display:inline-flex; align-items:center; justify-content:center; width:100%; height:100%;text-align:center;}

/* footer */
@font-face {
    font-family: 'Paperlogy-6SemiBold';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-6SemiBold.woff2') format('woff2');
    font-weight: 800;
    font-style: normal;
}

#footer {position:relative; padding:60px 0 100px; background:#000000;}
#footer .contain {max-width:1460px;}
#footer span {display:inline-block;}
#footer a:hover {text-decoration:underline;}
#footer address {font-style:normal;}

#footer .top {display: flex; justify-content: space-between; align-items: flex-start;}
#footer .top address {margin-top: 45px;}
#footer .top address dl {display: block; }
#footer .top address dt {font-family: 'Paperlogy-6SemiBold'; font-weight: 500; color: #fff; width: 105px;}
#footer .top address dd {font-size: var(--font-size-15); letter-spacing: -.02em; line-height: 1.2em; color: rgba(255, 255, 255, 0.6);}
#footer .top address dd span {margin-right: 35px;}
#footer .top address .copyright {font-size:var(--font-size-15); letter-spacing: -.02em; line-height: 1.2em; color: rgba(255, 255, 255, 0.6);}
#footer .top .f-nav {display: flex; margin: 0 -32px;}
#footer .top .f-nav li {text-align: center; }
#footer .top .f-nav>li {padding: 0 32px;}
#footer .top .f-nav>li>a {text-transform: uppercase; font-size: var(--font-size-16); font-weight: 600; letter-spacing: -.02em; line-height: 1.2em; color: #fff;}
#footer .top .f-nav>li ul li a {font-size:var(--font-size-15); letter-spacing: -.02em; line-height: 1.2em; color: rgba(255, 255, 255, 0.6);}

#footer .btm {margin-top: 55px; display: flex; align-items: center; justify-content: space-between;}
#footer .btm .foot-links {margin: 0 -15px;}
#footer .btm .foot-links a {padding: 0 15px; font-size:var(--font-size-15); font-weight: 600; letter-spacing: -.02em; line-height: 1.2em; color: #fff;}

#footer .right {display: flex; flex-direction: column; align-items: flex-end;}
#footer .family {position:relative; max-width:200px; width:100%; margin-top: 90px;}
#footer .family .tit {display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid #686868; line-height:35px; position:relative; color:#fff}
#footer .family .tit:after {content:''; display:block;width:0; height:0; border-top:8px solid #fff; border-right:6px solid transparent; border-left:6px solid transparent;}
#footer .family .tit.active:after {transform:rotate(-180deg);}
#footer .family .family-open {background:#2d2e34; display:none; position:absolute; bottom:37px; width:100%; left:0; z-index: 1;}
#footer .family .family-open ul {overflow-y: scroll; max-height: 240px;}
#footer .family .family-open a {text-transform: uppercase; display:inline-flex; align-items: center; width: 100%; line-height: 1.5em; min-height:60px; padding:0 20px; color: #7a7c81;}
#footer .family .family-open a:hover {text-decoration:none; color:#e73e11;background-color: #242424;}
#footer .family .family-open.active {display:block;}

/* quick */
.quick {position:absolute; top: -37px; right: 60px; z-index:90;}
.quick .goto {display:block; position:relative; width:74px; height:74px; background:var(--color-primary) url("../images/common/top.png") 50% 48% no-repeat; border-radius: 10px;}