/********************************************************
■ 기본
********************************************************/
html{font-size:20px;}
body{font-size:1rem}
.tablet{display:none;}
.mob{display:none;}
#wrap{position:relative; line-height:1.5; overflow:hidden; font-size: .9rem;}
#wrap img { border:none; max-width:100%;}
#wrap i{vertical-align:middle;}

/*세팅*/
:root{
	--main-color: #40060b;
	--yellow:#F09A0F;
}
@media (max-width:1030px){
	html{font-size:17px;}
    body{font-size:1rem}
	#wrap{font-size:1rem;}
	.tablet{display:block;} /*태블릿 부터 바뀜*/
	.web{display:none;} /*태블릿*/
}

@media (max-width:767px){
	html,body,#wrap{height:auto;}
	html{font-size:16px;}
    body{font-size:1rem; position:relative;}	
	.mob{display:block;}
}

@media (max-width:767px){
	html,body,#wrap{height:auto;}
	html{font-size:15px;}
    body{font-size:1rem; position:relative;}
	.web{display:none;}
	.mob{display:block;}
}


/********************************************************
■ 헤더
********************************************************/
#header{position: fixed; top:0; left: 0; width:100%;  z-index:101; background:rgba(255,255,255,0.84); -webkit-transition:all .3s;transition:all .3s;}
#header h1{position:absolute; left:0; top:48%; transform:translateY(-50%); z-index:25;}
#header h1 a{display: block;}
#header h1 img{height: 3.5rem; }
#header .header_inner{position:relative; width:1500px; margin:0 auto; height:5.5rem; }
#header .header_inner:after{content:""; display:block; clear:both;}


/*-----네비게이션-----*/
#header .header_inner #nav {text-align: right;}
#header .header_inner #nav ul {clear:both;  position:relative; box-sizing:border-box;height:100%;}
#header .header_inner #nav ul li { display:inline-block;width: auto; float:none; vertical-align:top;position:relative;}
#header .header_inner #nav ul li {position:relative; }
#header .header_inner #nav ul li a{text-align:center;  display:inline-block; height:5.5rem; line-height:5.5rem; color:#000; font-weight:400; text-transform: uppercase; position:relative;width:7.35rem; text-align:center; transition: all .2s; -webkit-transition: all .2s; }

#header .header_inner #nav ul li ul {z-index: 10;display:none; position: absolute; width:100%;  left:0;  top:5.5rem; text-align:center; background:#DFDFDF;  height:auto; 	}
#header .header_inner #nav ul li ul li {display:block;margin:0; line-height:1.5;}
#header .header_inner #nav ul li ul li a{display:block;color:#000; font-size:0.8rem; padding:0.75rem 0; height:auto; font-weight: 400; line-height:1.5; transition: all .2s; -webkit-transition: all .2s;}
#header .header_inner #nav ul li ul li a:hover{background:#fff; }
#header .header_inner #nav ul li.on > div > a{background:#F09A0F}
#header .header_inner #nav ul li ul li ul{display:none !important;}


/*-----사이트맵 버튼-----*/
#header .btn-gnb-menu{display:none; position:absolute; right:1rem; top:0; width:5rem; height:5.5rem; cursor:pointer; z-index:9999;text-align:center; -webkit-transition: all 0.25s; transition: all 0.25s;}
#header .btnAll {position:relative; display:block; width:1.6rem; height:1.15rem; margin:0 auto; top:50%;  transform:translateY(-50%);outline: none; z-index:9999;}
#header .btnAll span { display: inline-block; width: 100%; height: 2px; right:0; position: absolute; background-color: #000; -webkit-transition: all 0.25s; transition: all 0.25s; }
#header .btnAll > span:nth-child(1) { top: 0; }
#header .btnAll > span:nth-child(2) { top: 0.5rem;  }
#header .btnAll > span:nth-child(3) { top: 1rem; }
#header.open .btnAll > span{}
#header.open .btnAll > span:nth-child(1) { top: 0.5rem; -webkit-transform: rotate(-135deg); transform: rotate(-135deg); width: 1.5rem;}
#header.open .btnAll > span:nth-child(2) { top: 0; opacity: 0; width: 1.5rem;}
#header.open .btnAll > span:nth-child(3) { top: 0.5rem; -webkit-transform: rotate(135deg); transform: rotate(135deg); width: 1.5rem;}


/* 헤더 오버스크롤 */
#header.over,
#header.scroll{box-shadow: 1.2px 3.8px 22.8px 1.2px rgb(0 0 0 / 4%);}
#header.over .header_inner #nav ul li a,
#header.scroll .header_inner #nav ul li a,
#header.over a,
#header.scroll a{color:#444;}

/*사이트맵*/
#header #navi{background:#fff; position:fixed; top:0; right:-100%; width:70%; height:100%; padding-top:0; overflow:hidden; overflow-y:scroll;  z-index:20; transition:right 0.45s;}
#header.open #navi{transition:right 0.45s; right:0px;}
.divblind2{position:fixed; right:-100%; top:0;background:#141414;opacity:.65; width:100%;height:100%; z-index:10; transition:right 0.35s;}
.divblind2.open{transition:right 0.45s; right:0px;}

#menuAll .mobile_top{width:100%; height:auto; position:relative;margin-top: 4rem;  background: #fff; display: flex; flex-direction: column;     border-top: 1px solid #ddd;}
#menuAll .mobile_top .mbtop{width: 100%; height:100%; }
#menuAll .mobile_top .mbtop > li{ position:relative; border-bottom: 1px solid rgba(0, 0, 0, .1);}
#menuAll .mobile_top .mbtop > li > a{position:relative; display:block; color:#333; font-size:1.1rem; line-height:1; font-weight: 600; padding:1rem 2rem; transition: all .5s; -webkit-transition: all .5s;}
#menuAll .mobile_top .mbtop > li > a:after{ content :"\e941"; display : block; position : absolute; right:1.5rem;  top:0.75rem; font-size:1.2rem; font-family:'xeicon'; font-weight:500; color:#333; transition: all 0.2s ease-out 0s; }
#menuAll .mobile_top .mbtop > li.open_li{position:relative;}
#menuAll .mobile_top .mbtop > li.open_li > a{background:#F09A0F;}
#menuAll .mobile_top .mbtop > li.open_li > a:after{ transform: rotate(180deg );}

/*2차*/
#menuAll .mobile_top .mbtop > li ul {display:none;  background-color:#DFDFDF; position:relative; }
#menuAll .mobile_top .mbtop > li ul.on{display:block;}
#menuAll .mobile_top .mbtop > li ul li {}
#menuAll .mobile_top .mbtop > li ul li a { display:block; font-size:1rem; color:#333; padding:0.75rem 3rem;}	
#menuAll .mobile_top .mbtop > li ul li a:hover{background:#fff;}
#menuAll .mobile_top .mbtop > li ul li.on a{background:#fff;}
/*3차*/
#menuAll .mobile_top .mbtop > li ul li ul{display:none !important;}


@media (max-width:1500px){
	#header h1{left:2rem;}
	#header .header_inner{width:100%; }
}
@media (max-width:1030px){
	/*헤더*/
	#header h1 img{height:2.75rem;}
	#header .header_inner {height: 4rem;}
	#header .header_inner #nav {display: none;}

	/*-----사이트맵 버튼-----*/
	#header .btn-gnb-menu{display:block; width: 4rem; height: 4rem;}


}


/********************************************************
■ 푸터
********************************************************/
#footer{clear:both; padding:3rem 0; color:#fff; font-size:.8rem; background: #000; z-index:1;}
#footer .inn{position:relative; max-width:1200px; margin:0 auto; display:flex; gap:0 3rem;}
#footer h4 img{height:2.35rem;}
#footer .copy{color:#b8b8b8;}
#footer .address{flex:1;}
#footer .more{display:block; width:7.4rem; height:2rem; line-height:2rem; text-align:center; border:1px solid #afafaf;transition: all 0.2s ease-out 0s; }
#footer .more:hover{background:var(--yellow); color:#000; border-color:var(--yellow);}

/*팝업 롤링 추가*/
.layerPopup {position:absolute;top:230px;left:10rem; width:450px; background:#fff;line-height:auto;z-index:99999;border:10px solid #15334F;box-shadow:0 0 4px rgba(0,0,0,0.2); padding-bottom:40px;}
.layerPopWrap{position:relative; width:100%; height:100%;}
.layerPopup ul li img{width:100%;}

@media (max-width:1300px){
	#footer .inn{padding:0 1.5rem; }
	#footer .address{padding-right:7.4rem; }

}

@media (max-width:1030px){
	/*팝업 롤링 추가*/
	.layerPopup {left:50% !important;  transform:translateX(-50%);}
	
	#footer .inn{ display:block; }
	#footer .more{position:absolute; right:1.5rem; top:0px;}
	#footer .address{padding-right:0;  margin-top:1rem;}

}
@media (max-width:767px){
	#footer{font-size:.7rem;}
	#footer .inn{ padding:0 2.5rem;}
	#footer .inn em{display:block; font-size:0;}
	#footer .inn p + p{margin-top:1rem;}
	#footer .copy{margin-top:0.25rem !important;}
	#footer .more{position:relative; margin-top:1rem; right:auto; top:auto;}



	.mobile_dim{width: 100%; height:100%; position: absolute; top: 0; left: 0; margin: 0; z-index: 1039; display: inline-block; background: rgba(0,0,0,0.5);}
	.layerPopup img{width:100% !important;}
	.layerPopup {left:5% !important;  transform:translateX(0%); width:90% !important; height:auto !important; top:130px;}
	.chkvsb{font-size:0.7rem !important;}
}

