#wrap {overflow: hidden;}
.inr{ position: relative; margin: 0 auto; max-width: 87.5rem; width: 95.72916667%; height: 100%; z-index: 2; }
.wrapper{margin: 0 auto; max-width: 87.5rem; width: 1400px; }
.area_subVisual .wrapper, #footer .inr {width: 1400px;}
@media(max-width:1400px){
	.area_subVisual .wrapper, #footer .inr {width: 95.72916667%; }
	.wrapper{width: 95.72916667%; }
	
}
/* header */
:root{
	--header_height: 5rem;
}
#header{z-index:99; position:relative; width:100%; color: var(--black); height: var(--header_height); }
#header .inr{ display: flex; justify-content: space-between; align-items: center; max-width: 1740px;}
#header button{ background: none }
#header h1{ display: inline-block; position:relative; }
#header h1 a{ display: block; font-size: 0; }
#header h1 img{ height: calc( var(--header_height) * .566 ); min-height: 20px; font-size: 1rem; }

#header nav{ display: flex; align-items: center; position: relative; height: 100%;}
#header .gnb{ position:relative; height: 100%; }
#header .gnb > li{display:inline-block; position: relative; height: 100%; pointer-events: auto; }
#header .gnb > li > a{ display:flex; align-items: center; height:100%; padding:0 2.1vw; font-size:var(--font_size18); font-weight:500 }
#header .gnb > li:hover > a{ color: var(--primary); }
#header .gnb > li > .sub_menu{ visibility: hidden; position:absolute; top: 100%; min-width: 120px; width: max-content; left: 50%; transform: translateX(-50%); background:#fff; border:1px solid #ddd; z-index:99; opacity: 0; }
#header .gnb li:hover .sub_menu{ visibility: visible; top: 100%; opacity: 1; }
#header .gnb .sub_menu li a{ display: block; padding:14px; color:#333; border-top:1px solid #ddd; font-size:14px; text-align:center }
#header .gnb .sub_menu li a:hover{ background: var(--primary); color: #fff; }
#header .gnb .sub_menu li:first-child a{border-top:0 }
/* 
#header{z-index:99; position:absolute; width:100%; height:80px; transition:0.3s; background: #fff;}
#header .inr{position:relative; max-width:1740px; margin:0 auto;}
#header h1{position:absolute; left:0; top:36px;}
#header h1 a{display:block; width:183px; height:47px; background:url(../images/common/logo.jpg) no-repeat 50% 0; background-size:100%; font-size:0;}

#header .gnb{position:absolute; right:250px; top:0;}
#header .gnb > li{position: relative; display:inline-block;}
#header .gnb > li > a{display:block; line-height:80px; height:80px; padding:0 38px; color:#444; font-size:18px; font-weight:500;}
#header .gnb > li > .sub_menu{display:none; position:absolute; left:0; top:80px; width:100% !important; background:#fff; border:1px solid #ddd; z-index:99;}
#header .gnb li:hover .sub_menu{display:block; background:#fff; top:80px; width:100%; animation: submenu 0.3s 1 linear;}
#header .gnb .sub_menu{animation: submenu 0.3s 1 linear; transition: ease all .2s;}
#header .gnb .sub_menu li a{display: block; padding:14px 0; color:#333; border-top:1px solid #ddd; font-size:14px; text-align:center; transition:0.4s;}
#header .gnb .sub_menu li a:hover{background:#598e35; color:#fff;}
#header .gnb .sub_menu li:first-child a{border-top:0;}

#header .area_util{position:absolute; right:0; top:25px;}
#header .area_util span{display:inline-block; width:40px; height:40px; margin-right:6px; background:#111 url(../images/common/icon_call.svg) no-repeat 50% / 15px; border-radius:50%; }
#header .area_util div{display:inline-block; color:#fff;}
#header .area_util div a{color:#fff; font-weight:bold; font-size:20px;} */

/* mobile-menu */
#header .area_util button{ background: var(--primary); width: 3rem; height: 3rem; border-radius: 50%;}

.btn_menu{position:relative; z-index:90; width:30px; height:30px; box-sizing: border-box }
.btn_menu span{ display:block; margin: auto; width:40%; height:3px; background: #fff; }
.btn_menu span:nth-child(1),
.btn_menu span:nth-child(3){ width: 48%; }
.btn_menu span + span{margin-top:4px }

.menu_top p{margin-top:10px; color:#949494;}
#header .m_gnb_top h1{float:none; padding:20px; }
.m_area_util{margin-top:40px;overflow:hidden;  padding:20px; box-sizing:border-box; background:#4c4c4c;}
.m_area_util a{display:inline-block; width: 49%; height:31px; box-sizing: border-box; padding:5px 0; margin:2px 0px; border:1px solid #fff; vertical-align:middle; color:#fff; text-align:center; font-size:14px;}
.m_gnb{overflow-y:auto; position:fixed; top:0px; right:-100%; width:280px; height:100%; background:#fff; transition:all 0.5s ease-out 0s;z-index:999;}
.m_gnb .header {height: 4em;}
.m_gnb > ul > li > a{display:block; position:relative; padding:15px 25px; border-bottom: 1px solid #eaeaea; color:#424242; transition:all 0.3s ease 0s;}
.m_gnb > ul > li > a.open:before{content:''; display:block; position:absolute; top:25px; right:10px; width:11px; height:7px; background:url(../images/common/menu_button.svg) no-repeat 50% 0; transition:all 0.4s ease 0s; background-size:100%;}
.m_gnb > ul > li > a.active{}
.m_gnb > ul > li > a.active:before{transform:rotate(180deg);}
.m_gnb > ul > li > ul{display:none; background:#efefef; }
.m_gnb > ul > li > ul > li{border-bottom:1px solid #dedede;}
.m_gnb > ul > li > ul > li > a{position:relative; display:block; padding:15px 25px; font-size:14px; color:#333; }

.m_gnb .btn_close{opacity: 0; display: block; position:absolute; top:30px; right:-100%; width:24px; height:23px; font-size:0px; transition:0.8s;}
.m_gnb.active{right:0px;}
.m_gnb.active .btn_close{opacity:1; right:15px;}
.m_gnb_top{box-sizing:border-box; background:#00469b;}
.m_gnb_top p{background:#ddd;}
.m_gnb > ul{}
.m_gnb .btn_close:before{content: ''; display:block; position:absolute; top:9px; left:0px;  width:100%; height:1px; background:#333; transform:rotate(45deg);}
.m_gnb .btn_close:after{content: ''; display:block; position:absolute; top:9px; left:0px; width:100%; height:1px; background:#333; bottom: 9px; transform:rotate(-45deg);}


.area_util_m{padding:20px 20px; margin-top:100px; background:#598e35;}
.area_util_m span{display:inline-block; width:40px; height:40px; margin-right:6px; background:#111 url(../images/common/icon_call.svg) no-repeat 50% / 15px; border-radius:50%; }
.area_util_m div{display:inline-block; color:#fff;}
.area_util_m div a{color:#fff; font-weight:bold; font-size:17px;}

.cover{position: fixed; width: 100%; height:100%; left:0; top:0; background:rgba(0, 0, 0, 0.8); z-index:995; display:none;}
.cover.active{display:block;}


@media(prefers-reduced-motion: no-preference){
	#header .gnb > li > .sub_menu{ transition: .3s; }
	.m_gnb{ transition-duration: .5s; }
	.m_gnb .btn_close{ transition: .8s; }
	.cover{ transition: .4s; }
}
@media(min-width:1280px){
	.area_util{ margin-left: 40px; }
}
@media(max-width:768px){
	:root{
        --header_height: 4.0625rem;
	}
	#header .gnb{ display: none; }
}

/* footer */
#footer{ background: #333333; border-bottom: 1px solid #fff; font-size: 14px; font-weight: 500; color: #e7e7e7; padding: 60px 0; }
.footer_head { border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
.footer_head .inr {display: flex; align-items: center; gap: 2em; border-bottom: 1px solid rgba(255, 255, 255, 0.15); padding-bottom: 20px;}
.footer_head h1 a {font-size: var(--font_size20); opacity: 0.6;}
.footer_head span {font-size: var(--font_size16); opacity: 0.6;}
#footer .address span{ display: inline-block; position: relative; margin-right: 2em; }
#footer .address span:last-child::before{ display: none; }
#footer .address i{ margin-right: 0.88235294em; font-size: 1.21428571em; color: #fff; }
#footer .address p{ margin-top: 4em; text-transform: uppercase; color: rgba(208, 208, 208, 0.8); }
address {display: flex; align-items: center;}
address h2 {margin-right: 40px; font-size: var(--font_size16); font-weight: 500;}
address div {opacity: 0.6;}
address:first-child {margin: 30px 0 10px}

.top_btn{ display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 2px; position: absolute; top: -2.5em; right: 0; width: 4.6em; height: 4.6em; box-sizing: border-box; background: #fff; text-align: center; color: var(--primary); font-size: 12px; font-weight: 800; border-radius: 50%;}
.top_btn-svg{ width: 1.16666667em; aspect-ratio: 14/8;}
@media(min-width:1280px){
	#footer .address span{ margin-right: 2em; }
}
@media (max-width:1279px){
	#footer .address span{ margin-right: 2em; }
	#footer .address span::before{ display: none; }
}
@media(max-width:767px){
	.top_btn{ font-size: 10px; }
}
@media(max-width:420px){
	.top_btn{ top: -5em;}
	.footer_head .inr {flex-direction: column; align-items: flex-start; gap: 0;}
	.footer_head h1 {margin-bottom: 10px;}
	.footer_head h1 a{font-size: 18px;}
	address {flex-direction: column; align-items: flex-start;}
}