/*header*/
.hd{position: fixed;top: 0;left: 0;width: 100%;z-index: 999;/*pointer-events: none;*/background-color: #fff;height: 7%; transition: 0.3s;}
.hd .logo{float: left;margin-left: 180px;margin-top: 10px;position: relative;z-index: 1;pointer-events: all;transition: 1.2s;width: 10%;}

.hd .main-menu-wrap{float: left;position: relative;z-index: 1;pointer-events: none;transition: 1.2s;height: 0;}

.hd .main-menu-wrap > ul > li > a{pointer-events: all;display: block;font-family: 'Didact Gothic', sans-serif;}
.hd .menu-btn{float: right;margin-top: 10px;margin-right: 190px;cursor: pointer;text-align: center;position: relative;z-index: 1;pointer-events: all;transition: 1.2s; border:none;}
.hd .menu-btn .ico-wrap{width: 25px;height: 25px; position: relative;/* border: 1px solid #ccc; */}
.hd .menu-btn .ico-wrap .line{width: 20px;height: 2px;background-color: #636363;display: block;position: absolute;top: calc(50% - 0.5px);left: calc(50% - 10px);transition: 0.8s;}
.hd .menu-btn .ico-wrap .line1{transform: translateY(-6px);}
.hd .menu-btn .ico-wrap .line3{transform: translateY(6px);}
.hd .menu-btn p{font-size: 10px;margin-top: 0;color: #3d3d3d;transition: 1.2s;font-family: 'Didact Gothic', sans-serif;font-weight: bold;}
.hd .white-box{z-index: 0;position: absolute;top: 0;right: 0;background-color: white;transform: scaleY(0);transition: 0.8s;transform-origin: top;}
.hd img{width: 100%; display: block;}


.hd .rev-btn{float: right;margin-top: 20px;margin-right: 20px;/* line-height: 2.65; */font-size: 17px;vertical-align: middle;color: #3d3d3d;font-family: 'Didact Gothic', sans-serif;}
.hd .rev-btn a{font-size: 10.3px;margin-top: 0;color: #818181;text-align: center;line-height: 0;}
.hd .rev-btn .icon {display:block;width: 100%; }
.reser_btn{position:relative; z-index:99;}

/*menu*/
.main-menu-wrap{margin-top: 10px;margin-left: 10%;text-align: center;}
.main-menu-wrap > ul > li{/* float: none; */display: inline-grid;padding: 0 15px;width: 19%;}
.main-menu-wrap a{color: #2e2e2e;font-size: 14px;transition: 0.8s;letter-spacing: 3px;font-weight: 900;}
/*.main-menu-wrap a:hover {border-bottom: 1px solid #ccc;}*/
.main-menu-wrap .sub-menu{opacity: 0;pointer-events: none;transition: 0.8s;margin-top: 6px;width: 100%;/* background: #fff; */}
.main-menu-wrap .sub-menu a{font-size: 13.5px;left: 0;right: 0;margin: auto;font-weight: 400;letter-spacing: 0px;}


.m-sns-wrap{display:none;}

.hd .main-menu-wrap > ul > li:nth-child(1) {/* margin-right:10px; */}

 .sub-menu .split {width: 44%;float: left;margin: 0px 3px 0;}  .sub-menu .split li { padding: 0 0 5px 0px !important; } 
 .sub-menu .split_bbg {width:100%;} 
 
/*hd_ani*/

.hd.click .main-menu-wrap a{color: #333; transition-delay: 0.6s;}
.hd.click .main-menu-wrap .sub-menu{opacity: 1;pointer-events: all;transform: rotate(0.03deg);transition-delay: 0.3s;background: none;}
.hd.click .white-box{transform: scaleY(1);width: 100% !important;height: 210px;}
.hd.click  .menu-btn .ico-wrap .line1{transform: rotate(45deg);}
.hd.click  .menu-btn .ico-wrap .line2{opacity: 0;}
.hd.click  .menu-btn .ico-wrap .line3{transform: rotate(-45deg);}
.hd.click .menu-btn p{color: #333;}

/*.hd.fixed .main-menu-wrap a{color: #333;}
.hd.fixed .menu-btn p{color: #333; margin-top: 5px;}
.hd.fixed{height: 90px; background-color: white;}
.hd.fixed .logo{margin-top: 15px; width: 160px;}
.hd.fixed .main-menu-wrap{margin-top: 30px;}
.hd.fixed .menu-btn{margin-top: 5px;}*/

.ico-mo{display: none;}

/* footer */
.top-btn{width: 4%;/*height: -2px;*/position: absolute;right: 0%;bottom: 50px;font-size: 15px;color: #838383;z-index: 10;cursor:pointer}


footer { padding: 15px 0px 20px 0px; background:#f8f8f8; border-top:none !important;}
.footer_com {max-width:1300px;padding-right: 15px;padding-left: 15px;margin-right: auto;margin-left: auto;position: relative;text-align:center;color:#565656;font-family: 'Pretendard-Light';}
.footer_com a{color:#7e7e7e;}
.bg-dark { background: #292929;}
.col-md-3 {width: 29%;float:left;margin:2% 2% 2.5% 2%;}
.widget .title {font-size: 14px;line-height: 24px;font-weight: 700;text-transform: uppercase;letter-spacing: 5px;margin-bottom: 12px;font-family: 'Didact Gothic', sans-serif;color: #8f8f8f;}

.widget ul li{font-size: 13px;line-height: 1.8;letter-spacing:-0.2px;font-family: 'Pretendard-Regular';}
.fottop{  display: block; text-align: center; width: 5%; float:right; font-size:20px;  margin: 1px auto 15px;}  

hr {display: block; height: 1px;  border: 0;  border-top: 1px solid #ccc;  margin: 0.5em 0;padding: 0;}

.info-fot .sub {font-size: 12px;display: flow-root;width: 100%;}


.info-fot .sub a b:before {content: "";display: inline-block;background-image: url("http://hi-web.co.kr/web/img/hi_web_s.png");vertical-align: middle;width: 20px;height: 20px;background-size: cover;background-position: center;margin: 0 1px 4px 4px;}


/* media */
@media all and (max-width : 1600px){
.main-menu-wrap{margin-left: 2%;}
.main-menu-wrap .sub-menu{margin-top:0;}
}

@media all and (max-width : 1440px){
.main-menu-wrap{margin-left: 52px;}	
.hd{height:8%;}	
.main-menu-wrap{ margin-top: 0;}
/*.footer_com{max-width:1080px;}*/

.hd .logo{margin-left:105px;width: 12%;margin-top: 5px;} .hd .menu-btn{margin-right:105px;margin-top: 5px;}


}

@media all and (max-width : 1360px){
.hd .rev-btn{margin-top:10px;}
.hd .menu-btn{margin-top:1px;}
.main-menu-wrap a{font-size:13px;}

.hd .logo{margin-top:6px;}
}

@media all and (min-width : 1025px){
	
    .hd .main-menu-wrap > ul > li > a{line-height: 40px;}
    .hd .main-menu-wrap::after{content: "";display: block;/* background-color: #818181; */width: calc(100% + 25px);position: absolute;top: 40px;right: 0;height: 1px;pointer-events: all;}
    .hd .main-menu-wrap > ul > li .sub-menu{position: relative;z-index: 1;}
    .hd .main-menu-wrap > ul > li .sub-menu li{position: relative;z-index: 1;/* width: 100%; *//* text-align: center; */padding: 0 17px;/* margin: auto; */padding-bottom: 5px;}
    .hd .main-menu-wrap > ul > li.hover .sub-menu{opacity: 1; pointer-events: all;}
    .hd .main-menu-wrap > ul > li{position: relative;}
    .hd .main-menu-wrap > ul > li .sub-menu::after{display: block;content: "";width: 115%;height: 100%;background-color: white;position: absolute;top: 0;/* left: 0; */transform: scaleY(0) translateX(-20px);z-index: 0;transition: 0.3s;transform-origin: top;pointer-events: all;opacity: 1;margin-left: 8px;}
    .hd .main-menu-wrap > ul > li.hover .sub-menu::after{transform: scaleY(1) translateX(-20px);}
    .hd .main-menu-wrap > ul > li.hover .sub-menu a{color: #333;}
    .hd .main-menu-wrap > ul > li.hover .sub-menu{pointer-events: all;}
    .hd .main-menu-wrap > ul > li .sub-menu li{opacity: 0;line-height: 2;}
    .hd .main-menu-wrap > ul > li.hover .sub-menu li{opacity: 1;}
    .hd.click .main-menu-wrap > ul > li .sub-menu li{opacity: 1;}
	
	
}

@media all and (max-width : 1025px){	
	.top-btn{display:none !important;}
	.widget .title{margin:12px auto 0px;}
	.footer_com{width:100%;}
	.col-md-3{width:100%; float:inherit; margin:0%;} .rowinfo{margin-top:15px;}
	.widget ul li{font-size:11px;}
	
	.sub-menu .split{width:auto; float:none; display: inline-block;}
}

@media all and (max-width : 1215px){
    .hd .logo{/* width: 165px; */ /* margin-left: 25px; */}
}


@media all and (max-width : 1025px){ 
	/*.hd {background:none;}*/
	
	.hd .white-box{background:none; height:0 !important}
    .hd .main-menu-wrap{opacity: 0; visibility: hidden; pointer-events: none; margin-right: 0; margin-top: 0px; margin-left:0; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background-color: white; padding-top: 110px; z-index: 0; transition: 1.2s;}  
    .main-menu-wrap .sub-menu{margin-top: 10px;}
    .hd .main-menu-wrap > ul > li{width: 17.3333%;padding: 0;margin-bottom: 15px;}
    .main-menu-wrap a{font-size: 17px;}
    .main-menu-wrap .sub-menu li{line-height: 1.8;}
    .main-menu-wrap .sub-menu a{font-size: 14px; line-height: 1.8;}
    .hd .main-menu-wrap .sub-menu{min-height: 300px; margin-bottom: 50px;}
    .hd.fixed .main-menu-wrap{margin-top: 0;}
    .hd.click .main-menu-wrap{opacity: 1; visibility: visible; pointer-events: all; }
    .hd.click .main-menu-wrap .sub-menu{transition-delay: 0.1s;}

	/*.hd .menu-btn {background:#fff; padding:5px 10px; border-radius:50px; border: 1px solid #ccc; margin-right:35px;}
	.hd .rev-btn {background:#fff;padding: 9px 5px 1px;border-radius:50px;border: 1px solid #ccc;margin-top:1px; margin-right:5px;}*/
	
	.hd{height:13%;} .hd .menu-btn{margin-top: 15px;width: 50px;height: 50px;background: #fff;border-radius: 50px;margin-right: 10px;} .hd .rev-btn{margin-top:35px;}
	.hd .menu-btn .ico-wrap{margin: auto;}
	.hd .logo{margin-left:10px; margin-top: 15px;width: 45%;} .hd img{ width: 100%;}
	
	.ico-mo{display: block;}
	.hd .rev-btn{display: block;}
	
	.m-sns-wrap{display: block; width: 100%; /* position: fixed; */  margin-top: 30px; text-align: center;}
    .m-sns-wrap img{width: 15px; display: inline-block; margin-right: 5px; transform: translateY(2px);}
    .m-sns-wrap li{display: inline-block; margin: 0 5px;}
    .m-sns-wrap li a{font-size: 11px; font-family: "timesNow",sans-serif; font-weight: 300;}
	
	.mo-menu{display: none;}
    
}


@media all and (max-width: 950px){
	.hd{height:7%;background: #fff;}
	#header {border-bottom: none;}
	.down{border-bottom: 1px solid #eaeaea !important;}
	.hd .rev-btn{ margin-top:20px;} .hd .menu-btn{margin-top: 5px;margin-right: 10px;}
	.hd .main-menu-wrap{padding-top: 55px;}
}


@media all and (max-width: 850px){
	.hd .rev-btn{margin-top: 25px;margin-right: 10px;line-height: 0;} .hd .menu-btn{/* margin-top:25px; */}
	.hd .main-menu-wrap > ul > li{width:100%;}
	.hd .main-menu-wrap .sub-menu{margin-bottom:0;min-height: 10px;margin-top:0;}
	.main-menu-wrap .sub-menu li{display:inline-block; padding:0 7px;}
}

@media all and (max-width: 555px){
	.hd{height:10%;}
	
	.hd .menu-btn{/* margin-right:35px; */} 
	.hd .menu-btn{ /* margin-top:7px; */} .hd .rev-btn {/* margin-top:16px; */}
	.main-menu-wrap .sub-menu a{font-size:12px;}
	
	.foot-banner{height:200px; background-size:100%; background-attachment:inherit;}
	.foot-banner .slide-tit{top: 15%;}
	.foot-banner .slide-tit strong img{width: 25%; margin: 10px auto 5px;}
	.res_box{font-size: 12px;}.foot-banner a {width: 180px;}

	
}

@media all and (max-width: 450px){
	.hd{height: 7%;}
	.hd .main-menu-wrap{padding-top: 80px;}	
	.hd .logo{/* width: 30%; */margin-top: 10px;}
	.hd .menu-btn{margin-top: 10px;}
	
}
@media all and (max-width: 375px){
	.hd{height: 8%;}
}

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

}