/**************************************************
* layout.css
**************************************************/

.progress-container .progress-bar { position:absolute; bottom:-1px; z-index:9; width:100%; height:0px; background-color:#d29e75; }

/* gnb_all */
#gnb_all { display:block; z-index:99999999; position:absolute; width:100vw; height:0; top:-90px; border:0 none; opacity:0; visibility:hidden; background:#fff; transform:translateY(-100%); transition:all 1s 0.2s ease; }
#gnb_all.open { height:100vh; opacity:1; visibility:visible; transform:translateY(0%); transition:all 0.7s ease; }

.gnb-top { width:1810px; margin:0 auto; position:relative; height:6rem; }
.gnb-top .gnb_close_btn { position:fixed; float:right; right:5%; top:6%; background:none; border:0; cursor:pointer; }
.gnb-top .gnb_logo { position:relative; width:165px; left:3%; margin-top:3%; background:none; border:0; cursor:pointer; }
.gnb-top .login-wrap { position:fixed; left:4%; top:7%; }
.gnb-top .login-wrap li { display:inline-block; padding:0 7px; position:relative; }
.gnb-top .login-wrap li + li:before { content:""; display:inline-block; width:1px; height:12px; background-color:#ddd; position:absolute; left:0; top:50%; margin-top:-5px; margin-left:-2px;}
.gnb-top .login-wrap a { color:#000; font-size:18px; }
.gnb-top .login-wrap a:hover { color:#4268E3; text-decoration:none; }

@media only screen and (max-width:1680px){
	.gnb-top { width:96%;}
}

.gnb-inner { width:1710px; height:680px; margin:0 auto; margin-top:20px; padding:50px 0; background:#F5F5F5; opacity:0; visibility:hidden;  transform:translateY(-100%); transition:all 0.6s 0.2s ease; box-sizing:border-box; }
#gnb_all.open .gnb-inner { opacity:1; visibility:visible; transform:translateY(0%); transition:all 0.6s ease; }
.gnb-inner .gnb-allmenu-imgbox { display:none; position:relative; width:210px; margin-right:5%; text-align:center; }
.gnb-inner .gnb-allmenu-imgbox .imgbox { position:relative; margin-top:5rem;}
.gnb-inner .gnb-allmenu-imgbox .imgbox .img { position:absolute; left:0; top:0; }
.gnb-inner .gnb-allmenu-imgbox .txtbox { position:absolute; left:0; right:0; bottom:7rem; }
.gnb-inner .gnb-allmenu-imgbox .txtbox p { margin-top:15px; color:#000; font-size:1.875rem; }

@media only screen and (max-width:1680px){
	.gnb-inner { width:96%;}
}


.gnb-inner .gnb-allmenu-list { margin-left:0px; height:270px; padding-left:20px; border-left:0px #fff solid; }
.gnb-inner .gnb-allmenu-list li a { font-weight:500;color:#000; }
.gnb-inner .gnb-allmenu-list .gnb-menu-txt { width:20%; }
.gnb-inner .gnb-allmenu-list .menu-txt01 { position:relative; display:inline-block; font-size:19px; font-weight:500; }
.gnb-inner .gnb-allmenu-list .menu-line { width:50px; height:30px; border-bottom:1px #999 solid; }

@media only screen and (max-width:1680px){
	.gnb-inner .gnb-allmenu-list .menu-txt01 { font-size:17px;}
}
@media only screen and (max-width:1440px){
	.gnb-inner .gnb-allmenu-list .menu-txt01 { font-size:15px;}
}

.gnb-inner .gnb-allmenu-list .gnb-allmenu-depth1 { /*display:flex;*/  float:left; width:20%; height:270px; text-align:left; position:relative; margin-bottom:40px; padding-left:20px; border-right:1px #bbb solid; box-sizing:border-box; }
.gnb-inner .gnb-allmenu-list .gnb-allmenu-depth1:nth-last-child(4) { border-right:none; }
.gnb-inner .gnb-allmenu-list .on .gnb-menu-txt { color:#4268E3; }
.gnb-inner .gnb-allmenu-list .gnb-allmenu-depth2 { /*display:flex; flex-wrap: wrap; */ margin-top:30px; }
.gnb-inner .gnb-allmenu-list .gnb-allmenu-depth2 li { }

.gnb-inner .gnb-allmenu-list .gnb-allmenu-depth2 li a { display:block; height:30px; line-height:30px; font-size:16px; color:#444; letter-spacing:-0.02em;}
.gnb-inner .gnb-allmenu-list .on .gnb-allmenu-depth2 li a { transition:all 0.3s ease;  }
.gnb-inner .gnb-allmenu-list .gnb-allmenu-depth2 li:hover a { color:#4268E3; font-weight:400; text-decoration:none; transition:all 0.3s ease; }

 .gnb-inner .gnb-allmenu-list .gnb-allmenu-depth2 li a.f-col1 { color:#4268E3; font-weight:400;}
 .gnb-inner .gnb-allmenu-list .gnb-allmenu-depth2 li a.f-col2 { color:#00f6ff;font-weight:400; }
 .gnb-inner .gnb-allmenu-list .gnb-allmenu-depth2 li a.f-col3 { color:#00990e;font-weight:400; }

/*
.gnb-inner .gnb-allmenu-list .gnb-allmenu-depth1-7 .gnb-allmenu-depth2 li:nth-child(3) a:after { content:""; display:inline-block; width:16px; height:11px; margin-left:3px; background:url("../img/icon-youtube.png") no-repeat center/ 100% auto; vertical-align:middle; }
.gnb-inner .gnb-allmenu-list .gnb-allmenu-depth1-7.on .gnb-allmenu-depth2 li:nth-child(3) a:after { background:url("../img/icon-youtube-active.png") no-repeat center/ 100% auto; }
.gnb-inner .gnb-allmenu-list .gnb-allmenu-depth1-7 .gnb-allmenu-depth2 li:nth-child(3):hover a:after { background:url("../img/icon-youtube-hover.png") no-repeat center/ 100% auto; }
*/

.gnb-inner .gnb-allmenu-list .on ul { opacity:1; visibility:visible; z-index:10; }

.gnb-allmenu-depth1 .gnb-menu-txt .menu-txt01::after { content:''; position:absolute; bottom:-31px; left:0; width:100%; border-bottom:2px solid #fff; -webkit-transform-origin:left top; -ms-transform-origin:left top; transform-origin:left top; -webkit-transform:scale(0, 1); -ms-transform:scale(0, 1); transform:scale(0, 1); -webkit-transition:transform 0.4s cubic-bezier(1, 0, 0, 1); transition:transform 0.4s cubic-bezier(0, 0, 0, 1); }
.gnb-allmenu-depth1:hover .gnb-menu-txt .menu-txt01::after { -webkit-transform-origin:left top; -ms-transform-origin:left top; transform-origin:left top; -webkit-transform:scale(1, 1); -ms-transform:scale(1, 1); transform:scale(1, 1) }

.gnb-inner .img { opacity:0; -webkit-clip-path:polygon(0 0, 0 0, 0 100%, 0 100%); clip-path:polygon(0 0, 0 0, 0 100%, 0 100%); -webkit-transition:clip-path 1.1s cubic-bezier(.19, 1, .22, 1), opacity 1.1s ease 167ms, -webkit-clip-path 1.1s cubic-bezier(.19, 1, .22, 1); transition:clip-path 1.1s cubic-bezier(.19, 1,.22,1), opacity 1.1s ease 167ms, -webkit-clip-path 1.1s cubic-bezier(.19, 1, .22, 1); }
.gnb-inner.img01 .img01 { opacity:1; -webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); }
.gnb-inner.img02 .img02 { opacity:1; -webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); }
.gnb-inner.img03 .img03 { opacity:1; -webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); }
.gnb-inner.img04 .img04 { opacity:1; -webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); }
.gnb-inner.img05 .img05 { opacity:1; -webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); }
.gnb-inner.img06 .img06 { opacity:1; -webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); }
.gnb-inner.img07 .img07 { opacity:1; -webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); }
.gnb-inner.img08 .img08 { opacity:1; -webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); }