@charset "utf-8";
body{-webkit-text-size-adjust:none; }
.no_CJK{font-family: 'Noto Serif KR', sans-serif;}
.roboto{font-family: 'Roboto';}
.montserrat{font-family: 'Montserrat', sans-serif;}

/* header */
#header{width:100%; overflow:hidden; position:fixed; z-index:1000; text-align:center; transition:all 0.2s; -ms-transition:all 0.2s; -webkit-transition:all 0.2s; -o-transition:all 0.2s; -moz-transition:all 0.2s;}
#header:before{position:absolute; left:0; top:90px; width:100%; height:100%; background:#fff; content:""; display:block;}
#header a.logo{display:inline-block; position:absolute; left:80px; top:20px;}
#header a.logo img.on{display:none}
#header a.logo img.off{display:block}
#header .all_menu_btn{cursor:pointer; display:inline-block; position:absolute; right:80px; top:30px;}
#header .all_menu_btn span{display:block; width:22px; height:2px; background:#fff; margin:5px 0; transition:all 0.2s; -ms-transition:all 0.2s; -webkit-transition:all 0.2s; -o-transition:all 0.2s; -moz-transition:all 0.2s;}
#header .all_menu_btn.on span:nth-of-type(1){width:1px; transform:translate(11px, 8px); -ms-transform:translate(11px, 8px); -webkit-transform:translate(11px, 8px); -o-transform:translate(11px, 8px); -moz-transform:translate(11px, 8px);}
#header .all_menu_btn.on span:nth-of-type(2){transform:rotate(-45deg); -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -otransform:rotate(-45deg); -moz-transform:rotate(-45deg);}
#header .all_menu_btn.on span:nth-of-type(3){transform:rotate(45deg) translate(-5px,-5px); -ms-transform:rotate(45deg) translate(-5px,-5px); -webkit-transform:rotate(45deg) translate(-5px,-5px); -o-transform:rotate(45deg) translate(-5px,-5px); -moz-transform:rotate(45deg) translate(-5px,-5px);}
#header .gnb{display:inline-block; vertical-align:top; position:relative; z-index:2; font-size:0; letter-spacing:-4px;}
#header .gnb > ul > li{display:inline-block; vertical-align:top;}
#header .gnb > ul > li > a{font-size:18px; padding:32px 60px 31px; box-sizing:border-box; display:block; position:relative; color:#fff; letter-spacing:-0.025em; font-weight:500;}
#header .gnb > ul > li > a:before{content:""; width:0; height:3px; background:#e6007e; position:absolute; left:50%; bottom:0; transform:translateX(-50%); -ms-transform:translateX(-50%); -webkit-transform:translateX(-50%); -o-transform:translateX(-50%); -moz-transform:translateX(-50%); transition:all 0.2s; -ms-transition:all 0.2s; -webkit-transition:all 0.2s; -o-transition:all 0.2s; -moz-transition:all 0.2s; }
#header .gnb > ul > li ul.depth02{display:none; padding:20px 0 40px;}
#header .gnb > ul > li ul.depth02 li a{display:block; padding:10px 0; font-size:18px; color:#666; letter-spacing:-0.025em; font-weight:300;}
#header .gnb > ul > li ul.depth02 > li ul.depth03 li{line-height:11px;}
#header .gnb > ul > li ul.depth02 > li ul.depth03 li a{display:block; padding:10px 0; font-size:15px; color:#666; letter-spacing:-0.025em; font-weight:200;}
#header .gnb > ul > li ul.depth02 > li ul.depth03 li a:hover {text-decoration:underline;}
#header:hover{background:#fff;}
#header:hover a.logo img.off{display:none;}
#header:hover a.logo img.on{display:block;}
#header:hover .gnb > ul > li a{color:#666;}
#header:hover .all_menu_btn span{background:#222;}
#header .gnb > ul > li:hover a{color:#222; font-weight:500;}
#header .gnb > ul > li:hover a:before{width:100%;}
#header .gnb > ul > li ul.depth02 li:hover a{color:#444; font-weight:500;}


#wrap.main #header{}
#wrap.main #header.on{background:#fff;  border-bottom:1px solid #d7d7e0;}
#wrap.main #header.on a.logo img.off{display:none;}
#wrap.main #header.on a.logo img.on{display:block;}
#wrap.main #header.on .gnb > ul > li a{color:#666;}
#wrap.main #header.on .all_menu_btn span{background:#222;}

/*#wrap.sub #header{border-bottom:1px solid #d7d7e0;}*/
#wrap.sub #header.on{background:#fff; border-bottom:1px solid #d7d7e0;}
#wrap.sub #header.on a.logo img.off{display:none;}
#wrap.sub #header.on a.logo img.on{display:block;}
#wrap.sub #header.on .gnb > ul > li a{color:#666;}
#wrap.sub #header.on .all_menu_btn span{background:#222;}



/* all_menu */
.all_menu{display:none; position:fixed; width:100%; height:100%; left:0; top:0; z-index:1001; background:rgba(44,30,79,1)}
.all_menu .all_menu_btn{cursor:pointer; display:inline-block; position:absolute; right:80px; top:30px;}
.all_menu .all_menu_btn span{display:block; width:22px; height:2px; background:#fff; margin:5px 0; transition:all 0.2s; -ms-transition:all 0.2s; -webkit-transition:all 0.2s; -o-transition:all 0.2s; -moz-transition:all 0.2s;}
.all_menu .all_menu_btn span:nth-of-type(1){width:1px; transform:translate(11px, 8px); -ms-transform:translate(11px, 8px); -webkit-transform:translate(11px, 8px); -o-transform:translate(11px, 8px); -moz-transform:translate(11px, 8px);}
.all_menu .all_menu_btn span:nth-of-type(2){transform:rotate(-45deg); -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -otransform:rotate(-45deg); -moz-transform:rotate(-45deg);}
.all_menu .all_menu_btn span:nth-of-type(3){transform:rotate(45deg) translate(-5px,-5px); -ms-transform:rotate(45deg) translate(-5px,-5px); -webkit-transform:rotate(45deg) translate(-5px,-5px); -o-transform:rotate(45deg) translate(-5px,-5px); -moz-transform:rotate(45deg) translate(-5px,-5px);}
.all_menu .all_menu_btn span.on:nth-of-type(1){transform:none; width:22px;}
.all_menu .all_menu_btn span.on:nth-of-type(2){transform:none;}
.all_menu .all_menu_btn span.on:nth-of-type(3){transform:none;}

.all_menu .center{width:100%; text-align:center; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%);}
.all_menu .center p{font-size:18px; color:#fff; font-weight:200; margin:10px auto 0;}
.all_menu .center .list > ul{ margin:0 auto; font-size:0; letter-spacing:-4px;}
.all_menu .center .list  > ul > li{min-height:350px; margin-top:60px;  padding:0 40px; box-sizing:border-box; display:inline-block; vertical-align:top; }
.all_menu .center .list  > ul > li:nth-of-type(3n){border-right:0;}
.all_menu .center .list  > ul > li > a{text-align:left; display:block; font-size:30px; color:#fff; letter-spacing:-0.025em; font-weight:500;}
.all_menu .center .list  > ul > li > ul.depth02{padding:20px 0;}
.all_menu .center .list  > ul > li > ul.depth02 li a{display:block; padding:8px 0; font-size:18px; color:#fff; letter-spacing:-0.025em; font-weight:200; text-align:left;}

.all_menu .center .list  > ul > li > ul.depth02 li > ul.depth03 li {line-height:16px;}
.all_menu .center .list  > ul > li > ul.depth02 li > ul.depth03 li a{display:block; padding:5px 0; font-size:14px; color:#d1ced7; letter-spacing:-0.025em; font-weight:200; text-align:left;}

@media all and (max-height:1000px){
	.all_menu .center .list  > ul > li{min-height:200px; margin-top:30px;}
}
@media all and (max-width:800px){
	.all_menu .center .list > ul{width:93.75%;}
	.all_menu .center .list > ul > li{width:50%; min-height:250px; margin-top:30px;}
}

/* footer */
#footer:after{clear:both; content:""; display:block; height:0; visibility:hidden; border:5px solid red;}
#footer{padding:50px 0 70px; background:#272727; clear:both; content:""; display:block;}
#footer a.ft_logo{float:left; display:block;}
#footer .text{float:left; padding-left:15px; padding-top:13px;}
#footer .text ul.text_ul:after{clear:both; content:""; display:block; height:0; visibility:hidden}
#footer .text ul.text_ul li{display:inline-block; vertical-align:top; font-size:15px; line-height:22px; color:#cecece; letter-spacing:-0.05em; padding:0 10px; position:relative;}
#footer .text ul.text_ul li:before{content:""; display:block; width:1px; height:12px; background:#525252; position:absolute; right:0; top:50%; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -moz-transform:translateY(-50%);}
#footer .text ul.text_ul li:last-child:before{display:none}
#footer .text ul.text_ul li:first-child{padding-left:0;}
#footer .text .copy{font-size:13px; color:#818181; letter-spacing:0.01em; font-weight:100; margin-top:20px;}
#footer .inner .right_btn{position:absolute; right:0; top:0; font-size:0; margin-top:13px}
#footer .inner .right_btn a{display:block; border:1px solid #b5b5b5; width:120px; height:33px; line-height:33px; box-sizing:border-box; text-align:center; font-size:12px; color:#737373; letter-spacing:0.025em; background:#fff; margin-bottom:10px;}
#footer .inner .right_btn select{-webkit-appearance: none; -webkit-border-radius: 0; display:block; padding:0 20px; border:1px solid #939393; width:228px; height:44px; line-height:44px; box-sizing:border-box; text-align:center; font-size:15px; color:#d4d4d4; letter-spacing:-0.025em; background:#fff url('../img/scroll_arrow.png')no-repeat center right 15px; background-color:#272727;}
#footer .inner .right_btn select::-ms-expand { display:none; }



@media all and (max-width:1500px){
	/* header */
	#header a.logo{left:20px;}
	#header .all_menu_btn{right:20px;}
	#header .gnb > ul > li > a{padding:32px 40px 31px}

	/* all_menu */
	.all_menu .all_menu_btn{right:20px;}
}
@media all and (max-width:1200px){
	/* header */
	#header .gnb > ul > li > a{padding:32px 30px 31px}

}
@media all and (max-width:1000px){

	body{overflow-x:hidden !important}
	/* header */
	#header{height:90px;}
	#header .gnb{display:none}

}



@media all and (max-width:1200px){
	#footer .inner .right_btn{position:static; margin-top:20px; text-align:center;}
}

@media all and (max-width:1000px){
	#footer{text-align:center;}
	#footer a.ft_logo{float:none; margin-bottom:20px; display:inline-block; vertical-align:top;}
	#footer .text{float:none; padding:0;}
	#footer .inner .right_btn a{display:inline-block; vertical-align:top; margin:0 3px}
	#footer .inner .right_btn select{display:inline-block; vertical-align:top; margin:0 3px}

}

/* sub_common */
.sub_common{width:100%; max-width:2560px; margin:0 auto; position:relative; overflow:hidden}
.sub_common > img{width:2560px; display:block; position:relative; left:50%; transform:translateX(-50%); -ms-transform:translateX(-50%); -webkit-transform:translateX(-50%); -o-transform:translateX(-50%); -moz-transform:translateX(-50%);}
.sub_common .center_text{text-align:center; position:absolute; left:50%; top:60%; width:100%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%)}
.sub_common .center_text h2{font-size:50px; color:#fff; font-weight:bold; letter-spacing:-0.025em;}
.sub_common .center_text ul{margin-top:15px; text-align:center;}
.sub_common .center_text ul li{display:inline-block; padding:0 35px; vertical-align:top; font-size:18px; color:#fff; letter-spacing:-0.025em; font-weight:300; position:relative;}
.sub_common .center_text ul li:before{content:">"; display:block; position:absolute; right:0; top:50%; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -moz-transform:translateY(-50%);}
.sub_common .center_text ul li:last-child:before{display:none;}
.sub_common .center_text ul li a{display:block; font-size:18px; color:#fff; letter-spacing:-0.025em; font-weight:300;}

@media all and (max-width:1000px){
	.sub_common > img{width:1920px;}
}



/* 2depth */

.gu_tab_depth3{position: relative;text-align: center;margin:0 auto 44px;z-index:2;border-bottom:1px solid #e5e5e5;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
.gu_tab_depth3 ul{font-size: 0;width: 100%;height: 59px;-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; position:relative;}
.gu_tab_depth3 ul li{display: inline-block;position: relative;vertical-align: top;margin: 0 14px;height: 72px;}
.gu_tab_depth3 ul li a{display: inline-block;position: relative;font-family: "SDGothic",sans-serif;color:#8b8ba2;font-size: 18px; font-weight:500;padding: 22px 30px 20px; line-height:1;}
.gu_tab_depth3 ul li a:before{content: '';position: absolute;bottom: 0;left: 0;right: 0;width: 100%;height: 0;background: #e6007e;
    -webkit-transition: height 0.3s;
    -moz-transition: height 0.3s;
    -ms-transition: height 0.3s;
    -o-transition: height 0.3s;
    transition: height 0.3s;
}
.gu_tab_depth3 ul li.on a{color: #000}
.gu_tab_depth3 ul li.on a:before{height: 2px}
.gu_tab_depth3 ul li a:hover{color: #000}

.gu_tab_depth3:before{content: ''; position: absolute; top: 0; left: 0; width: 20px; height: 48px; z-index: 9;pointer-events:none;
    background: -webkit-linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0));
    background: -moz-linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0));
    background: -ms-linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0));
    background: -o-linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0));
    background: linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0));}
.gu_tab_depth3:after{content: ''; position: absolute; top: 0; right: 0; width: 20px; height: 48px; z-index: 9;pointer-events:none;
    background: -webkit-linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0));
    background: -moz-linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0));
    background: -ms-linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0));
    background: -o-linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0));
    background: linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0));}