@charset "utf-8";

:root {
    --hearder:90px;
	--color:#005128;
	--colorS:#55af81;
	--bdrcolor:#ddd;
	--bnround:1.25rem;
}

.skip_info {display:block; position:absolute; overflow:hidden; width:1px; height:1px; font-size:0; line-height:0; text-indent:100%;}

.innerwrap {max-width:1400px; margin:0 auto;}

/* header */ 
header {background:#fff; height:var(--hearder); position:relative; z-index:30;}
header .innerwrap {max-width:1800px; padding:0 20px; display:flex; justify-content:space-between; align-items:center;}
header h1 {font-size:0;}
header h1 img {max-width:225px;}

/* gnb */
.gnb {width:100%; max-width:1200px; margin:0 auto;}
.gnb .map-1 {display:flex; justify-content:center;}
.gnb .map-1 .map-1-item {position:relative; width:18%; padding:0 3px;}
.gnb .map-1 .map-1-item:nth-child(4) {width:22%;}
.gnb .map-1 .map-1-item:nth-child(5), .gnb .map-1 .map-1-item:nth-child(6) {width:12%;}
.gnb .map-1 .map-1-item > a {display:flex; justify-content:center; align-items:center; font-size:1.063rem; font-weight:500; height:var(--hearder); line-height:1.2; text-align:center;}
.gnb .map-2 {display:none; overflow:hidden; position:absolute; left:0; top:90px; width:100%; height:250px; padding-top:10px; transition:background-color 0.3s; -webkit-transition:background-color 0.3s; -moz-transition:background-color 0.3s; z-index:40;}
.gnb .map-1 .map-1-item:hover .map-2, .map-1 .map-1-item:focus .map-2 {background:#f7f7f7;}
.gnb .map-1 .map-1-item:hover .map-2 li a span {font-weight:bold;}
.gnb .map-2 .map-2-item {padding:6px 10px; text-align:center;}
.gnb .map-2 .map-2-item a {color:#333;}
.gnb .map-2 .map-2-item a span {font-size:16px;}
.gnb .map-2 .map-2-item a:hover span, .map-2 .map-2-item a:focus span {text-decoration:underline;}
.gnb_bg {display:none; position:absolute; top:var(--hearder); left:0; width:100%; background:#fff; z-index:30;}
.black_bg {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.5); z-index:20;}

/* togglebutton */
.spinner-master input[type=checkbox] {display:none;}
#togglemenu + label {display:block; width:26px; height:18px; position:absolute; right:20px; top:20px; z-index:20; cursor:pointer;}
#togglemenu + label span {display:block; background:#111; width:100%; height:2px; position:absolute; left:calc(50% - 10px); transition:all .3s;}
#togglemenu + label span:nth-child(1) {top:0;}
#togglemenu + label span:nth-child(2) {top:calc(50% - 1px);}
#togglemenu + label span:nth-child(3) {bottom:0;}
#togglemenu:checked + label {position:fixed;}
#togglemenu:checked + label span {top:calc(50% - 1px);}
#togglemenu:checked + label span:nth-child(1) {transform:rotate(45deg);}
#togglemenu:checked + label span:nth-child(2) {opacity:0;}
#togglemenu:checked + label span:nth-child(3) {transform:rotate(-45deg);}

/* footer */
#footer {background:#2d2d2d; color:rgba(255,255,255,0.7); font-size:0.875rem; position:relative; padding:50px 0 80px; text-align:center;}
address p > span {display:inline-block; margin:3px 7px;}
#footer .copyright {margin-top:20px;}
.designby {color:rgba(255,255,255,0.5); font-weight:300; font-style:italic; margin-top:20px;}

.move-top {display:none; width:40px; height:40px; background-color:#bbb; border-radius:100%; opacity:.6;}
.move-top-fix {display:block; position:fixed; bottom:10px; right:10px;}

@media all and (min-width:1025px) {
header h1 {margin-right:20px;}

header nav {display:flex; justify-content:space-between; align-items:center; flex:1;}
.togglemenu, #m_nav {display:none;}

/* tmenu */
.tmenu {display:flex; justify-content:flex-end;}
.tmenu a {display:inline-block; background:#2d2d2d; border:1px solid transparent; border-radius:50rem; color:#fff; font-size:12px; width:65px; padding:2px 0; text-align:center;}
.tmenu a + a {margin-left:3px;}
.tmenu a:last-child {background:#fff; border-color:#2d2d2d; color:#2d2d2d;}
}

@media screen and (max-width:1440px) {
.innerwrap {padding-left:20px; padding-right:20px;}
}

@media screen and (max-width:1280px) {
.gnb .map-1 .map-1-item > a {font-size:1rem;}
}

@media screen and (max-width:1024px) {
:root {
    --hearder:58px;
	--bnround:0.875rem;
}

header .innerwrap {height:var(--hearder);}
header h1 img {max-width:170px;}

.gnb, .tmenu {display:none;}

#allmenu {width:100%; height:100%; position:fixed; top:0; right:-100%; background:#f6f6f6; z-index:9; overflow:auto; display:flex; flex-direction:column; transition:all .3s ease-in-out;}
#allmenu.sitemap_open {right:0;}
.sitemap_open .tmenu {display:flex;}

/* tmenu */
.tmenu {display:flex; align-items:center; background:#fff; height:var(--hearder); flex:0 0 var(--hearder); padding:10px 20px; position:sticky; top:0; z-index:1;}
.tmenu a {font-size:1rem; font-weight:500; position:relative;}
.tmenu a + a {margin-left:10px;}
.tmenu a + a::before {content:''; display:inline-block; background:#ddd; width:1px; height:10px; margin-right:10px;}

#m_nav {padding:20px;}
#m_nav .map-1 {float:none; width:100%; text-align:left; margin:0;}
#m_nav .map-1 > li {float:inherit; width:100%; text-align:left; position:relative;}
#m_nav .map-1 > li > a {padding:20px 0 20px 15px; border-bottom:1px solid #ccc; display:block; color:#2d2d2d; font-size:18px;}
#m_nav .map-1 > li > i {display:block; position:absolute; right:15px; top:25px; color:#2d2d2d }
#m_nav .map-1 .map-2 {background-color:#e3e3e3; margin:0; display:none;}
#m_nav .map-1 .map-2 li {height:auto; margin:0; border-bottom:1px solid #C9C9C9;}
#m_nav .map-1 .map-2 li a {display:block; font-size:16px; padding:15px 0 15px 15px;}
}
