.d_clear{clear:both} /*pc*/ @media all and (min-width:1200px) { #header .bg{position:absolute;left:0;top:0;width:100%;height:100%; opacity:0;transition:.5s} #header .lnb_btn{display:none} #d_lnb{width:40%; float:right; height:85px;} #d_lnb ul{position:relative;} #d_lnb li{position:relative;float:left;text-align:center; border-bottom:none; width:33%; max-width:160px;} #d_lnb li.tail span {border-radius:50px; padding:5px 10px; border:1px solid #fff;} #d_lnb li > a{color:#fff; display:block; line-height:80px; text-transform:uppercase; text-indent:0; padding:0; } body.scroll #d_lnb li > a{color:#fff} body.scroll #d_lnb li:hover a{color:#fff} #d_lnb li > ul > li {color:#000 !important;} #d_lnb li > a{position:relative;} /*#d_lnb li > a:before{content:''; display:block; position:absolute; z-index:-1; bottom:0; top:0; left:0px; width:100%; height:100%; transform: scaleX(0); transform-origin: left; transition: .1s ease-in;}*/ #d_lnb li:hover a:before{transform:scaleX(1); transition: .3s ease-out;} #d_lnb li > a:hover, #d_lnb li.on > a{font-weight:600; color:#fff; /*background:#0060ca;*/} #d_lnb li.on .sub{display:block !important} #d_lnb li .sub{position:absolute;width:100%; background:rgba(0,0,0,.5); display:none;top:80px;margin-top:-5px; padding:0; opacity:1; overflow:hidden; z-index:1;} /*#d_lnb li .sub:before{content:''; width:30px; height:3px;background:#ed0d69; left:50%; margin-left:-15px; top:0; z-index:10; position:absolute}*/ #d_lnb li .sub dl{padding:0px; text-align:center; } #d_lnb li .sub dd{/*border-top:1px solid #ddd*/ } #d_lnb li .sub dd:first-child{border-top:none} #d_lnb li .sub dd a{position:relative; display:block;padding:10px 15px;color:#fff !important; line-height:20px; z-index:1;} #d_lnb li .sub dd a:before{content:''; display:block; position:absolute; z-index:-1; bottom:0; top:0; left:0px; width:100%; height:100%; background:#07913a; transform: scaleX(0); transform-origin: left; transition: .1s ease-in;} #d_lnb li .sub dd:hover a:before{transform:scaleX(1); transition: .3s ease-out;} #hs1 .con2{position:relative; max-width:1400px; margin:0 auto; border-bottom:0;} #hs1 .con2 h1{float:none;text-align:left; position:relative; top:12px; left:20px; float:left; width:20%;} #hs1 .con2 h1 a {width:210px; height:60px; text-indent:-999999px; display:block; background:url(../img/logo.png) no-repeat center center; background-size:100% !important;} body.scroll #hs1 .con2 h1 a {background:url(../img/logo_b.png) no-repeat center center;} #hs1 .con2 #d_lnb{position:relative; left:0 !important; background:none; overflow:visible; text-align:center;} #hs1 .con2 #d_lnb ul{width:80%; display:block; float:left;; background:none; /*padding-right:150px*/; padding:0} .conSearch input{min-width:200px;} .conSearch form{max-width:100%;} body.scroll #header .bg{opacity:1;transition:.5s; } .d_container{margin:0 auto; max-width:1600px;} body.pc{min-width:1200px} /* body.scroll #header .bg{background:#414141;opacity:1;transition:.5s}*/ body.scroll #hs1{display:none;} #header{position:fixed;z-index:999;width:100%; max-width:2000px; margin:0 auto; } body.scroll #header:before{display:none} .mainwrap #header .bg{border-bottom:0 } #header .bg{position:absolute;left:0;top:0;width:100%;height:100%; transition:0.6s; opacity:1; border-bottom:1px solid rgba(255,255,255,0.1) } body.lnb_over #header .bg{border-bottom:1px solid #dcdcdc; opacity:1; } body.lnb_over #header .bg{transition:0.6s} #hs1{position:relative; overflow:hidden; display:none} body.lnb_over #hs1{background:#2f3438 } #hs1 .d_container{position:relative; border:1px solid #dcdcdc; border-color:rgba(255,255,255,0.2); border-width:0 0 0 1px;} #d_gnb{overflow:hidden;} #d_gnb li{display:block; float:left; font-size:0.9em; font-weight:500; color:#ccc; position:relative;} #d_gnb li.d2 span{display:inline-block; margin-right:20px;} #d_gnb li.d2 span img{width:18px; margin-right:10px;} #d_gnb li.d3{padding-right:20px;} #d_gnb li.d4{margin-left:0; padding-left:0; border-left:0;} #d_gnb li.d4 a{background:#17484e; padding:10px 20px; color:#ffffff; } #d_gnb li.d4 a:before{font-family: 'FontAwesome'; font-size:11px; display:inline-block; content:"\f2bb"; color:#ffffff; padding-right:10px} /*#d_gnb li span:before{font-family:'FontAwesome'; color:#ccc; font-size:18px; content:'\f0ac'; padding-right:10px;}*/ #d_gnb li a{display:block;height:100%;text-align:center; color:#ccc; font-size:14px; border-right:1px solid #dcdcdc; border-color:rgba(255,255,255,0.6); } #d_gnb li a{position:relative; display:block; padding:13px 25px} #d_gnb li:first-child a{padding-left:50px;} #d_gnb li.d1:before{font-family: 'FontAwesome'; font-size:14px; display:inline-block; content:"\f011"; position:absolute; left:20px; top:13px} #hs2{/*background:#fff;*/ position:relative; width:100%} #hs2 h1{float:left; width:25%; max-width:415px; position:relative; z-index:2; padding-left:20px;} #hs2 h1 a{position:absolute;} #hs2 h1 span{position:absolute; right:0; font-size:13px; font-weight:600; line-height:55px} /*#hs2 h1 a {display:block; padding:0; text-indent:-999999px} #hs2 h1 a{width:100%; height:57px; background:url(../img/logo.png) no-repeat center left; background-size:100% !important} body.scroll #hs2 h1 a, body.lnb_over #hs2 h1 a{background:url(../img/logo_b.png) no-repeat center center !important; background-size:100% !important}*/ #hs2 h1 a {display:block; padding:0; padding:15px 0} #hs2 h1 a img {width:100%; max-width:415px; vertical-align:middle} #d_lnb_bg{position:absolute;left:0;top:89px; width:100%; background:rgba(0,0,0,0.6); height:0;overflow:visible !important; z-index:0;} body.lnb_over #d_lnb_bg{background:rgba(0,0,0,0.6); border-bottom:1px solid #dcdcdc; border-color:rgba(255,255,255,0.3)} #d_lnb_bg .location{position:absolute;left:0;width:100%;height:15px;bottom:-15px;display:none; } #d_lnb_bg > .d_container{overflow:hidden;height:100%} #d_lnb_bg .thumb{padding:40px 40px} /*body.lnb_over #d_lnb_bg{min-height:200px}*/ body.lnb_over #d_lnb_bg .location{display:block} body.lnb_over #header{background:rgba(0,0,0,0.6); } /*body.lnb_over #d_lnb_bg{height:190px !important}*/ body.scroll #header{background:rgba(0,0,0,0.6)} } /*mobile*/ @media all and (max-width:1199px) { .ver_pc{display:none !important;} .ver_mobile {display:block !important;} .conSearch{padding:30px 0; border-bottom:0;} .conSearch form{max-width:80%; position:relative; margin: 0 auto;} .conSearch input{border:none; background:none; border-bottom:2px solid #ff209e; line-height:24px; font-size:0.85em; width:100%; padding:0.750em 0; } .conSearch button{border:none; background:none; position:absolute; right:0;} .conSearch button:before{content:'\f002'; font-family:'FontAwesome'; color:#ff209e; font-size:20px;} #header{/*background:#212020;*/position:fixed;z-index:99;width:100%;height:50px; min-width:320px;} #header .bg{position:absolute;left:0;top:0;width:100%;height:100%;background:url('../images/common/trans_bg.png');opacity:0;transition:.5s} #header .lnb_btn{position:absolute;z-index:2;right:3%;top:6px;cursor:pointer;width:35px;height:50px;} #header .lnb_btn a{display:block; position:relative; width:100%; height:100%;} #header .lnb_btn span { /* line in the center */ position: absolute; top: 50%; right: 0px; -webkit-transition: background 0.3s 0.3s; -moz-transition: background 0.3s 0.3s; transition: background 0.3s 0.3s; } #header .lnb_btn span::before, #header .lnb_btn span::after { /* other 2 lines */ content: ''; right: 0; /* Force Hardware Acceleration in WebKit */ -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform-origin: 0% 50%; -moz-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; -o-transform-origin: 0% 50%; transform-origin: 0% 50%; -webkit-transition: -webkit-transform 0.3s 0.3s; -moz-transition: -moz-transform 0.3s 0.3s; transition: transform 0.3s 0.3s; } #header .lnb_btn span::before { /* menu icon top line */ top: -8px; width:30px; } #header .lnb_btn span::after { /* menu icon bottom line */ top: 8px; width:30px; } #header .lnb_btn span, #header .lnb_btn span::before, #header .lnb_btn span::after { /* hide line in the center */ background:#fff; width:100%; height:3px; position:absolute; display:block; } body.lnb_on #header .lnb_btn span::before { -webkit-transform: translateX(8px) translateY(0px) rotate(45deg); -moz-transform: translateX(8px) translateY(0px) rotate(45deg); -ms-transform: translateX(8px) translateY(0px) rotate(45deg); -o-transform: translateX(8px) translateY(0px) rotate(45deg); transform: translateX(8px) translateY(0px) rotate(45deg); } body.lnb_on #header .lnb_btn span::after { -webkit-transform: translateX(8px) translateY(8px) rotate(-45deg); -moz-transform: translateX(8px) translateY(8px) rotate(-45deg); -ms-transform: translateX(8px) translateY(8px) rotate(-45deg); -o-transform: translateX(8px) translateY(8px) rotate(-45deg); transform: translateX(8px) translateY(8px) rotate(-45deg); } body.lnb_on #header .lnb_btn span{background:#fff; height:0;} body.lnb_on #header .lnb_btn span:before, body.lnb_on #header .lnb_btn span::after{background:#3e3a39} #d_lnb .log {padding:20px 20px;} #d_lnb .log h2{font-size:1.1em; border-left:3px solid #ffffff; line-height:100%; padding-left:17px; text-transform:uppercase; font-weight:700; color:#ffffff; margin-bottom:15px} #d_lnb .log ul{padding:0; border:0} #d_lnb .log ul li{padding:0; border:0; font-size:11px; margin-bottom:7px;} #d_lnb .log ul li:last-child{padding:0; margin:0} #d_lnb .log ul li a{padding:15px 20px; text-indent:0; /*border:1px solid #ffffff; border-color:rgba(255,255,255,0.3)*/ background:#004da1; border-radius:10px;} #header{position:fixed;z-index:9999;width:100%;height:65px; top:0; /*box-shadow:1px 1px 1px 0 #777*/} #header .bg{position:absolute;left:0;top:0;width:100%;height:100%;opacity:1;transition:.5s} #hs2 h1 span{display:none} body.mo{} body.lnb_on{overflow:hidden} body.lnb_on #d_lnb_mask{position:fixed;left:0;top:0;width:100%;height:100%;z-index:990; background:rgba(0,0,0,0.6)} #d_gnb{position:fixed;left:-100%;top:0;height:0px;width:80%; max-width:250px; z-index:991; } #d_gnb ul{ background:#393939; overflow:hidden;} #d_gnb li{line-height:70px; position:relative; padding:0 30px; font-size:16px; letter-spacing:0;} #d_gnb li a{display:inline-block; border:1px solid #ffffff; color:#ffffff; line-height:35px; padding:0 20px; border-radius:500px} #d_gnb li a:before{content:''; display:inline-block; width:15px; height:15px; background:#ffffff; margin-bottom:3px; margin-right:8px; vertical-align:middle; background:url(../img/ic_map.png) no-repeat center center; background-size:cover !important; } #d_gnb ul{background:#17484e} #d_gnb li.d2{background:#969696} #d_gnb .close{position:absolute;right:-50px;top:0px;width:50px;height:50px;cursor:pointer} #d_gnb .close span{display:inline-block; position:absolute; top:55%; right:5px;} #d_gnb .close span:before, #d_gnb .close span:after{content:''; display:inline-block; width:34px; height:2px; background:#ffffff; position:absolute; right:5px;} #d_gnb .close span:after{top:-11px} #d_gnb .close span:before { -webkit-transform: translateX(4px) translateY(-5px) rotate(45deg); -moz-transform: translateX(4px) translateY(-5px) rotate(45deg); -ms-transform: translateX(4px) translateY(-5px) rotate(45deg); -o-transform: translateX(4px) translateY(-5px) rotate(45deg); transform: translateX(4px) translateY(-5px) rotate(45deg); } #d_gnb .close span:after { -webkit-transform: translateX(4px) translateY(6px) rotate(-45deg); -moz-transform: translateX(4px) translateY(6px) rotate(-45deg); -ms-transform: translateX(4px) translateY(6px) rotate(-45deg); -o-transform: translateX(4px) translateY(6px) rotate(-45deg); transform: translateX(4px) translateY(6px) rotate(-45deg); } #hs2{position:relative;padding:13px 0 13px; text-align:center; height:70px; transition:0.5s;} #hs2 h1{position:absolute; width:170px; top:0; left:0; margin:0 auto; padding:18px 25px; display:inline-block;} #hs2 h1 a{margin:0 auto; display:block;} body.lnb_on #hs2 {background:#fff; } body.scroll #hs2 {background:rgba(255,255,255,0.8); border-bottom:0} body.scroll #hs2 h1{ padding:10px 19px; /* margin-left:0; left:auto; right:0; */ transition:0.5s} #d_lnb_bg{display:none} #d_lnb_btn{position:absolute;left:3%;top:23px;cursor:pointer} #d_lnb{position:fixed;left:-100%;top:70px;width:100%; max-width:100%; height:100%;overflow:auto;background:#ffffff;z-index:991} #d_lnb h2{position:relative;text-align:center;color:#333;padding:20px 0;border-bottom:1px solid #c8c8c8} #d_lnb h2 .close{position:absolute;right:10px;top:10px;cursor:pointer} #d_lnb h2 .close img {max-width:65px;} #d_lnb ul{height:100%;overflow:auto; text-align:left; background:#ffffff;} #d_lnb li > a{ display:block;padding:15px 30px; font-weight:500; letter-spacing:0; color:#3e3a39; position:relative; border-bottom:1px solid #ddd;} #d_lnb li > a:hover {background:#07913a; color:#fff;} #d_lnb li.tail{position:relative; left:0px} #d_lnb li.on > a:before{content:''; position:absolute; top:0; bottom:0; right:50px; margin:auto; background:#ffffff; background:rgba(255,255,255,0.3); width:1px; height:100%; } #d_lnb li.on > a{background:#07913a; color:#fff; font-weight:600; position:relative; border:1px solid #ffffff; border-width:1px 0px; border-color:rgba(255,255,255,0.3)} #d_lnb li.on > a:after{content:''; position:absolute; top:0; bottom:0; right:0px; margin:auto; margin-right:20px; transition:0.6s; width:6px; height:6px; border-radius:500px; background:#ffffff} /*#d_lnb li.tail a{color:#baaf9d}*/ #d_lnb li.tail .location{display:none} #d_lnb li.tail{} #d_lnb li.tail a{ } #d_lnb li.tail a:before{position:relative; width:auto; height:auto; display:inline-block; background:none; font-size:18px !important;} #d_lnb li.tail a.ic_blog:before{font-size:20px !important} #d_lnb li .sub{background:#07913a;display:none; transition:0.6s;} #d_lnb li.on .sub{display:block;height:auto !important; padding:10px 0px ; border-bottom:1px solid #ffffff; border-color:rgba(255,255,255,0.3)} #d_lnb li .sub dl{position:relative;} #d_lnb li .sub dd a{display:block;padding:6px 30px; color:#ffffff; font-weight:500;} #d_lnb li .sub dd a:hover{font-weight:500} .icon-bar {display: block; margin-top: 4px; width: 40px;height: 3px; background: #ffffff;} #d_lnb li.lag{display:none} }