@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}

#wrapper{position:relative;overflow:hidden;}
/* header */
#header {position:relative;/* z-index:90; */}
#header .contain{height:100px;/* max-width:1900px; */max-width:100%;transition:.3s;}
#header .sitelogo {position:absolute; top:28px; left:30px; z-index:2;transition:.3s;}
#header .sitelogo a {display:block;}
#header .sitelogo a img{transition:.3s;}
#header .sitelogo.main{left:50%;top:36px;margin-left:-145px;}
#main #header .sitelogo.sub{display:none;}

#main #header{height:150px;}
#main #header .contain{max-width:1460px;height:150px;}
#header .btn-menu{display:block;position: absolute;right:30px;top:50%;margin-top:-17px;width:40px;height:35px;background:url('../images/common/menu.png')no-repeat 100% 50%/contain;font-size:0;transition:.1s;}
#main #header.active .contain{/* max-width:1900px; */max-width:100%;height:100px;}
#main #header.active .btn-menu{background-image:url('../images/common/menu-close.png');}
#main #header.active .sitelogo.main{left:30px;top:28px;margin-left:0;}
#main #header.active .sitelogo.main a img{height:44px;}
#main #header.active #gnb{display:block;padding-right:100px;}

#sub #gnb{display:block;}
#sub .sitelogo.main{display:none;}
#sub .btn-menu{display:none;}

#gnb{display:none;position:relative;z-index:1;}
#gnb>ul {display:flex; justify-content:flex-end;margin:0 -35px;} 
#gnb>ul>li {position:relative; text-align:center; padding:0 35px;}
#gnb>ul>li>a:after{content:'';width:18px;height:21px;background:url('../images/common/gnb-arr.png')no-repeat 50% 50%/contain;position: absolute;left:50%;margin-left:-9px;top:70px;opacity:0;transition:.3s;}
#gnb>ul>li>a{position:relative; display:inline-block; color:#121212; font-size:18px;line-height:100px;}
#gnb>ul>li:hover>a:after{opacity:1;}

#gnb .submenu {display:none; position:absolute; left:50%;top:100px; width:190px; transform:translateX(-50%); background:rgba(255,255,255,.9);text-align:center;border:1px solid #1e1e1e;}
#gnb .submenu>ul {padding:30px 5px;}
#gnb .submenu>ul>li{margin-bottom:20px;}
#gnb .submenu>ul>li:last-child{margin-bottom:0;}
#gnb .submenu>ul>li>a{display:inline-block;font-size:18px;line-height:1.3em;position:relative;transition:.3s;letter-spacing:0;transition:.3s;color: #121212;}
#gnb .submenu>ul>li>a:after{content:'';width:0;height:1px;background-color: #121212;position: absolute;left:50%;bottom:0;opacity:0;transition:.3s;}
#gnb .submenu>ul>li>a:hover:after{width:100%;left:0;opacity:1;}


.contain {position:relative; max-width:1260px; padding-left:30px; padding-right:30px; margin:0 auto;}
#contArea {max-width:1260px; padding-left:30px; padding-right:30px; margin:0 auto;}
#contArea.wide {max-width:100%; padding-left:0; padding-right:0;}

/* main */ 
.vis-section{position:relative;/* padding-bottom:40px; */}
.vis-section .contain{max-width:1460px;/* height:calc(100vh - 150px - 40px);height:790px; */}
.vis-section .title{display:flex;justify-content:center;align-items:center;position: absolute;left:30px;top:-72px;width:260px;height:72px;font-size: clamp(1.5rem, 0.9167rem + 1.2153vw, 2.375rem);line-height:1.2em;background-color: #121212;border-radius:24px 24px 0 0;color: #fff;letter-spacing:-.01em;}
.main-visual{position:relative; overflow:hidden;/* border:8px solid #000; */border-radius:0 24px 24px 24px;/* height:100%; */}
.main-visual:after{content:'';width:100%;height:100%;border:8px solid #121212;position: absolute;left:0;top:0;border-radius:0 24px 24px 24px;}
/* .main-visual .items,
.main-visual .items .slick-list,
.main-visual .items .slick-track,
.main-visual .items .slick-slide,
.main-visual .items .slick-slide > div,
.main-visual .items .slick-slide .item,
.main-visual .items .slick-slide .item .main-video{height:100%;} */
.main-visual .item {position:relative;/*  height:calc(100vh - 150px - 40px); */display:block !important;}
.main-visual .item .main-video{width:auto;height:auto;padding-bottom:56.215%;position:relative;overflow:hidden;}
/* .main-visual .main-video{height:100%;overflow:hidden;position: relative;width:100%;}
.main-visual .main-video video{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;} */

.section .contain{max-width:1460px;}
.sec1{padding:150px 0;color: #121212;letter-spacing:-.01em;}
.sec1 .top-wrap{display:flex;align-items:flex-end;margin-bottom:80px;}
.sec1 .top-wrap .left{min-width:0;width:1%;flex:1 1 auto;}
.sec1 .top-wrap .left .txt{display:inline-block;font-size: clamp(1.25rem, -0.0658rem + 5.2632vw, 6.25rem);line-height:1.2em;margin-right:40px;;}
.sec1 .top-wrap .left .txt .arr{position:relative;padding-right:95px;}
.sec1 .top-wrap .left .txt .arr:after{content:'';width:64px;height:65px;background:url('../images/main/sec1-arr.png')no-repeat 100% 50%/contain;position: absolute;right:0;top:27px;}
.sec1 .top-wrap .right{text-align:right;}
.sec1 .top-wrap .right .tt{position:relative;line-height:1.4em;font-size: clamp(0.875rem, 0.6118rem + 1.0526vw, 1.875rem);font-weight:800;}
.sec1 .top-wrap .right .tt:before{content:'';width:346px;height:346px;background:url('../images/main/sec1-circle.jpg')no-repeat 50% 50%/contain;position: absolute;right:0;top:-330px;
-webkit-animation-name: spin;
-webkit-animation-duration:20s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;

-moz-animation-name: spin;
-moz-animation-duration:20s;
-moz-animation-iteration-count: infinite;
-moz-animation-timing-function: linear;

-ms-animation-name: spin;
-ms-animation-duration: 20s;
-ms-animation-iteration-count: infinite;
-ms-animation-timing-function: linear;

animation-name: spin;
animation-duration: 20s;
animation-iteration-count: infinite;
animation-timing-function: linear;}

@-ms-keyframes spin { 
	from { 
		-ms-transform: rotate(0deg); 
	} to { 
		-ms-transform: rotate(360deg); 
	}
}
@-moz-keyframes spin { 
	from { 
		-moz-transform: rotate(0deg); 
	} to { 
		-moz-transform: rotate(360deg); 
	}
}
@-webkit-keyframes spin { 
	from { 
		-webkit-transform: rotate(0deg); 
	} to { 
		-webkit-transform: rotate(360deg); 
	}
}
@keyframes spin { 
	from { 
		transform: rotate(0deg); 
	} to { 
		transform: rotate(360deg); 
	}
}

.sec1 .btm-tt{text-align:center;line-height:1.09em;font-size: clamp(1.5rem, 0.0855rem + 5.6579vw, 6.875rem);letter-spacing:-.02em;}
.sec1 .btm-tt span{display:inline-block;padding:0 18px;background-color: #001ca7;color: #fff;border-radius:8px;}

.sec2 .tit-wrap{margin-bottom:20px;}
.sec2 .tit-wrap .contain{display:flex;justify-content:space-between;align-items:center;}
.section .sec-tit{color: #121212;font-size: clamp(1.5rem, 1.2368rem + 1.0526vw, 2.5rem);line-height:1.3em;}
.section .btn-more{display:flex;justify-content:center;align-items:center;width:170px;height:56px;border:2px solid #111;border-radius:8px;color: #111;font-size: clamp(0.875rem, 0.7083rem + 0.3472vw, 1.125rem);line-height:1.2em;transition:.3s;}
.section .btn-more:hover{background-color: #111;color: #fff;}
.main-casting {position:relative;overflow:hidden;}
.main-casting ul li a{display:block;width:600px;}
.main-casting ul li a .pic {position:relative; height:0; padding-bottom:66.669%; overflow:hidden;}
.main-casting ul li a .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}

.sec3{padding:150px 0;}
.sec3 .contain{display:flex;}
.sec3 .tit-wrap{margin-right:60px;}
.sec3 .tit-wrap .sec-tit{margin-bottom:50px;}
.sec3 .main-insta{min-width:0;width:1%;flex:1 1 auto;}
.sec3 .main-insta .slick-list{margin:0 -3px;}
.sec3 .main-insta .item{padding:0 3px;}
.sec3 .main-insta .item .pic {position:relative; height:0; padding-bottom:100%; overflow:hidden;}
.sec3 .main-insta .item .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}

.sec4{padding-bottom:150px;}
.sec4 .con{position:relative;}
/* .sec4 .bg-txt{text-align:center;opacity:.1;font-size: clamp(5rem, -5.4167rem + 21.7014vw, 20.625rem);line-height:1.2em;} */
.sec4 .con .wrap{position: absolute;left:0;top:50%;width:100%;transform:translateY(-50%);}
.sec4 .con .wrap ul{display:flex;margin:0 -10px;}
.sec4 .con .wrap ul li{width:25%;padding:0 10px;}
.sec4 .con .wrap ul li a{display:flex;justify-content:center;align-items:center;width:230px;height:80px;margin:0 auto;border:2px solid #121212;border-radius:8px;transition:.3s;font-size: clamp(0.9375rem, 0.6908rem + 0.9868vw, 1.875rem);line-height:1.2em;font-weight:800;padding-top:5px;color: #000;letter-spacing:-.01em;background-color: #fff;}
.sec4 .con .wrap ul li a:hover{border-color: #001ca7;color: #001ca7;margin-top:-20px;}



/* sub page */
.sub-visual{overflow:hidden;padding:20px 0 30px;border-top:1px solid #121212;border-bottom:1px solid #121212;}
.sub-visual .txt-sld{position:relative;}
.sub-visual .txt-sld .slick-list{margin:0 -32%;}
.sub-visual .txt-sld .item{padding:0 32%;}
.sub-visual .txt-sld .item p{font-size:11.4583vw;color: #121212;line-height:1em;white-space:nowrap;}

.sub-visual.loc .txt-sld .slick-list{margin:0 -51%;}
.sub-visual.loc .txt-sld .item{padding:0 51%;}

.sub-visual.aca .txt-sld .slick-list{margin:0 -51%;}
.sub-visual.aca .txt-sld .item{padding:0 51%;}



.real-cont {padding:0 0 150px;}
.real-cont.type2{padding-bottom:0;}

/* footer */
#footer{background-color:#111;padding:40px 0;}
#footer .contain{display:flex;/* max-width:1900px; */max-width:100%;}
#footer .foot-info{min-width:0;width:1%;flex:1 1 auto;}
#footer .foot-info .row{margin-bottom:5px;}
#footer .foot-info .row:last-child{margin-bottom:0;}
#footer .foot-info .row .tit{margin-bottom:3px;font-weight:600;color: #fff;line-height:1.3em;}
#footer .foot-info .row address{font-style:normal;}
#footer .foot-info .row address dl{display:flex;font-size: clamp(0.8125rem, 0.7961rem + 0.0658vw, 0.875rem);line-height:1.4em;color: #fff;opacity:.5;margin-bottom:3px;}
#footer .foot-info .row address dl:last-child{margin-bottom:0;}
#footer .foot-info .row address dl.type2{margin-bottom:20px;}
#footer .foot-info .row address dl dt{width:80px;}
#footer .foot-info .row address dl dd{min-width:0;width:1%;flex:1 1 auto;}
#footer .foot-right{display:flex;flex-direction:column;justify-content:space-between;padding-top:10px;}
#footer .foot-right .wrap{margin-bottom:20px;}
#footer .foot-right .foot-menu{margin-bottom:40px;}
#footer .foot-right .foot-menu ul{display:flex;justify-content:flex-end;margin:0 -20px;}
#footer .foot-right .foot-menu ul li{position:relative;padding:0 20px;}
#footer .foot-right .foot-menu ul li:after{content:'';width:1px;height:10px;background-color: #fff;position: absolute;right:0;top:8px;}
#footer .foot-right .foot-menu ul li:last-child:after{display:none;}
#footer .foot-right .foot-menu ul li a{position:relative;display:inline-block;padding-left:22px;line-height:1.2em;color:#fff;font-size: clamp(0.8125rem, 0.7796rem + 0.1316vw, 0.9375rem);}
#footer .foot-right .foot-menu ul li a:before{content:'';position: absolute;left:0;top:1px;width:17px;height:17px;background:url('../images/common/link.png')no-repeat 0 50%/contain;}
#footer .foot-right .foot-logo{text-align:right;}
#footer .foot-right .copy{text-align:right;color: #878787;font-size: clamp(0.75rem, 0.7336rem + 0.0658vw, 0.8125rem);line-height:1.2em;}

/* .scroll-top{position: fixed;right:30px;bottom:30px;display:block;width:64px;height:64px;border:2px solid #121212;background:#fff url('../images/common/top.png')no-repeat 50% 50%/18px;z-index:100;box-shadow:7px 7px 15px rgba(0,0,0,.1);font-size:0;border-radius:50%;} */
.quick{position: fixed;right:30px;bottom:30px;z-index:100;}
.quick ul li{margin-bottom:15px;}
.quick ul li:last-child{margin-bottom:0;}
.quick ul li a{display:flex;position:relative;justify-content:center;align-items:center;width:64px;height:64px;background-color: #001ca7;box-shadow:7px 7px 15px rgba(0,0,0,.1);font-size:0;border-radius:50%;}
.quick ul li a.scroll-top{border:2px solid #121212;background-color: #fff;}
.quick ul li a.txt-a:before{content:'';width:174px;height:72px;background:url('../images/common/q-inq-txt2.png')no-repeat 100% 50%/contain;position: absolute;right:-10px;top:-72px;}


/* for mobile */
.only-mobile {display:none;}
.btn-m-menu {display:none;position: absolute;right:30px;top:50%;margin-top:-15px;width:40px;height:30px;background:url('../images/common/menu.png')no-repeat 100% 50%/contain;font-size:0;transition:.1s;}
.mobile-navigation .close {display:block;position: absolute;right:20px;top:20px;width:20px;height:20px;background:url('../images/common/menu-close.png')no-repeat 100% 50%/contain;font-size:0;transition:.1s;}
.mobile-navigation {position:fixed; top:0; right:0; padding:20px 0; width:400px; height:100%; overflow:auto; transition:.3s ease-in-out; -ms-transform:translateX(100%); transform:translateX(100%); background:#fff; z-index:202;}
.mobile-navigation .home {margin-bottom:20px; padding-left:15px;}
.mobile-navigation .home img {height:23px;}
.mobile-navigation .nav-menu>ul{margin-top:30px;}
.mobile-navigation .nav-menu>ul>li {border-bottom:1px solid #121212;}
.mobile-navigation .nav-menu>ul>li>a {position:relative; padding:12px 15px; display:block; color:#121212; font-size:18px; font-weight:500; line-height:1.3em;}
.mobile-navigation .nav-menu>ul>li a:after{content:""; position:absolute; top:50%; right:15px; transform:translateY(-75%) rotate(45deg); width:10px; height:10px; border-right:2px solid #121212; border-bottom:2px solid #121212;}
.mobile-navigation .nav-menu>ul>li.active>a {color:#001ca7}
.mobile-navigation .nav-menu>ul>li.active>a:after {transform:translateY(-35%) rotate(-135deg); border-color:#001ca7;}
.mobile-navigation .nav-menu .submenu {display:none; margin:-1px 0 0 0; padding:0 15px 15px;}
.mobile-navigation .nav-menu .submenu>ul:after {content:"";display:block;clear:both;}
.mobile-navigation .nav-menu .submenu>ul>li>a {display:block; position:relative; padding:5px 15px; color:#121212; font-size:16px; font-weight:400; line-height:1.3em;}
.mobile-navigation .nav-menu .submenu>ul>li>a:after {display:block; content:"";position:absolute; top:14px; left:5px; width:4px; height:4px; background:#dfdfdf; border-radius:50%; transition:.3s ease-in-out;}
.mobile-navigation .nav-menu .submenu>ul>li>a:hover{color:#001ca7}
.mobile-navigation .nav-menu .submenu>ul>li>a:hover:after {background:#001ca7}


.mobile-overlay {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.6; z-index:201;}

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