@charset "utf-8";
/* *******************************************************
 * filename : layout.css
 * description : 전체 레이아웃 CSS
 * date : 2022-06-03
******************************************************** */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;500;600;700&display=swap'); /*  Montserrat */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC&display=swap');
@font-face {
	font-family:'Myriad Pro';
	src:url('../data/fonts/MyriadPro-Regular.otf');
	font-weight:400;
}

/* ========================================================
 * SETTING
======================================================== */
:root{ 
	--theme-red-color: #e0002a;
	--theme-orange-color: #ef8009;
	--area-box-width: 1680px;
	--area-width: 1600px;
	--area-padding: 7.4rem;
	--area-margin: 12rem;
	--header-height: 120px;
	--header-util-width : 12.1rem;
	--sub-visual-height: 62.9rem;
	--sub-menu-height: 79px;
	--full-height: 100vh;
	--custom-transiton1: all 0.4s cubic-bezier(.7, 0, .2, 1);
	--custom-transiton2: all 0.8s cubic-bezier(.7, .1, .2, 1);
	--font-family1: 'Montserrat','Noto Sans KR', 'Noto Sans SC', "돋움", Dotum, Arial, sans-serif;
	--font-family2: 'Noto Sans KR', "나눔고딕", NanumGothic, "Nanum Gothic","돋움", Dotum, Arial, sans-serif;
	--font-family3: 'Myriad Pro', 'Noto Sans KR', "나눔고딕", NanumGothic, "Nanum Gothic","돋움", Dotum, Arial, sans-serif;
}
/* html:not(.is-mobile) *::-webkit-scrollbar {
	width: 15px;
	height: 15px;
}
html:not(.is-mobile) *::-webkit-scrollbar-track {
	background-color: #f1f1f1;
}
html:not(.is-mobile) *::-webkit-scrollbar-thumb {
	background-color: #c1c1c1;
} */
::selection {
    background: var(--theme-red-color);   
    color: #fff;
}
::-moz-selection {
    background: var(--theme-red-color);    
    color: #fff;
}

/* ========================================================
 * LAYOUT
======================================================== */
html{font-size:10px; /* scroll-behavior:smooth; */ }
body, table, th, td, button, select, input, textarea {
	font-family:var(--font-family1);
	color:#555;
	-webkit-text-size-adjust:none;
	word-break:keep-all;
}
body { background-color:#fff; }
table, th, td{word-break:break-word;}
#wrap {overflow:hidden; width:100%; min-width:360px; position:relative; }

/* ========================================================
 * 공통클래스
======================================================== */
.area{ max-width:var(--area-width); margin:0px auto;}
.area-box{ max-width:var(--area-box-width); margin:0px auto;}
.area-box-padding{padding:0 var(--area-padding); box-sizing:border-box;}
.full-height{height:var(--full-height);}
/* Fullpage Layout */
.fullpage-html{overflow:hidden; height:100%;}
.fullpage-html #wrap{position:static;}
/* br tag */
.m-br{display:none;}
.display-m{display:none;}

/* popup 있을 시 뒷 배경 */
.pop-bg {position:fixed; width:100%; height:100%; background: rgba(0,0,0,0.8); z-index:11000;}

/* ========================================================
 * HEADER
======================================================== */
#header{position:absolute; height:var(--header-height); top:0; left:0; width:100%; z-index:999;}
#headerInnerWrap{position:absolute; top:0px; left:0px; width:100%; height:var(--header-height); z-index:9999; transition:var(--custom-transiton2);}
#headerInner{position:relative; display:flex; align-items:center; /* justify-content:space-between; */ height:var(--header-height); margin:0px auto; }
.gnb-navigation-wrapper {text-align:center;}
#header .logo{position:relative; z-index:100; }
#header .logo a{display:block; }
#header .logo img{display:block; vertical-align:top;}
#header .kor-logo {margin-left:3rem; margin-top:1rem; /* animation:fadein; animation-delay:2s; */ opacity:1; transition:var(--custom-transiton1); transition-delay:0.3s;}
#header.gnb-open .kor-logo {opacity:0; transition-delay:0s;}
/* .kor-logo2 {position:absolute; top:16rem; left:0;} */
.kor-logo2 {position: relative; float:left; top:160px;}
.kor-logo3 {/* position:absolute; z-index:100; bottom:15rem; left:50%; transform:translateX(-50%); opacity:0; transition:var(--custom-transiton2); transition-delay:1.5s; */ opacity:0; transition:var(--custom-transiton2); transition-delay:1.5s;}

/*@keyframes fadein {
	from {
		opacity:0;
	}
	to {
		opacity:1;
	}
}*/

/* -------- Header :: GNB(PC) -------- */
.gnb-overlay-bg{position:fixed; top:0; left:0; width:100%; height:100%; visibility:hidden; opacity:0;filter:Alpha(opacity=0); background:rgba(0,0,0,0.5); z-index:9997;  -webkit-transition:all 0.3s; transition:all 0.3s; }	/* gnb overlay BG */
.gnb-overlay-bg.open{visibility:visible; opacity:1.0;filter:Alpha(opacity=100);}
#gnb{position:absolute; text-align:center; top:0; right:0px; width:100%; z-index:99;}
#gnb > ul{width:63.05%; display:flex; justify-content:flex-end; box-sizing:border-box;}
#gnb > ul > li{position:relative; float:left; width:15rem; word-break:keep-all; transition:var(--custom-transiton2)}
#gnb > ul > li.gnb1{width:13.2rem;}
#gnb > ul > li.gnb2{width:15.8rem;}
/* #gnb > ul > li.gnb3{width:14.2rem;} */
#gnb > ul > li.gnb3{width:12.6rem;}
#gnb > ul > li.gnb4{width:13.4rem;}
#gnb > ul > li:last-child{margin-right:-17.5rem}
#gnb > ul > li .gnb-menu-tit{
	position:relative; 
	z-index:100; 
	display:block; 
	line-height:var(--header-height); 
	text-align:center; 
	color:#fff; 
	font-size:1.8rem; 
	letter-spacing:-0.025em; 
	font-weight:500; 
	transition:var(--custom-transiton1);
}
#gnb > ul > li .gnb-menu-tit a {display:inline-block; color:#fff; width:100%;}
#gnb > ul > li > a i{position:relative; top:1px; margin-left:0.7rem}
/* GNB :: 메뉴오픈 */
#header.gnb-open #gnb > ul > li{width:25%}
#header.gnb-open #gnb > ul > li:last-child{margin-right:0}
#header.gnb-open #gnb > ul > li .gnb-menu-tit{color:#000;}
#header.gnb-open #gnb > ul > li .gnb-menu-tit a {color:#000;}
#header.gnb-open #gnb > ul > li.on > .gnb-menu-tit{color:var(--theme-red-color);}
#header.gnb-open #gnb > ul > li.on > .gnb-menu-tit a {color:var(--theme-red-color);}

/* GNB :: 2차 전체메뉴 */
#gnbBg{
	overflow:hidden; position:absolute; left:0; top:0; width:100%; height:0; background:#fff; z-index:98;
	opacity:0;filter:Alpha(opacity=0);
	-webkit-transition:height 0.3s ease-in-out, opacity 0.2s ease-in-out;
	transition:height 0.3s ease-in-out, opacity 0.2s ease-in-out;
}
#gnbBg:after{position:absolute; top:var(--header-height); left:0; right:0; height:2px; background-color:#eee; content:"";}
#gnb.total-menu > ul > li .gnb-2dep{
	position:absolute; 
	top:var(--header-height); 
	left:0px; 
	z-index:99;
	width:100%; 
	text-align:left; 
	border-right:1px solid #eee;
	opacity:0;filter:Alpha(opacity=0);
	height:0;
	-webkit-transition: all 0.2s 0s;
    transition: all 0.2s 0s;
	visibility:hidden;
}
#gnb.total-menu > ul > li:first-child .gnb-2dep{border-left:1px solid #eee;}
#gnb.total-menu > ul > li .gnb-2dep:before {
	content:""; position:absolute; left:0; top:0px; width:0; left:50%; height:3px; background-color:var(--theme-red-color); 
	-webkit-transition:var(--custom-transiton1); transition:var(--custom-transiton1); z-index:10;
}
#gnb.total-menu > ul > li .gnb-2dep ul{height:100%; box-sizing:border-box; padding:3rem 0px; background-color:transparent; transition:all 0.3s}
#gnb.total-menu > ul > li .gnb-2dep ul li{position:relative;}
#gnb.total-menu > ul > li .gnb-2dep ul li a{ display:block;  padding:0.7rem 15px; text-align:center; color:#333; font-size:1.6rem; letter-spacing:-0.075em; font-weight:400; line-height:1.3; -webkit-transition:all 0.2s;-moz-transition:all 0.2s;-o-transition:all 0.2s;-ms-transition:all 0.2s;transition:all 0.2s}
#gnb.total-menu > ul > li .gnb-2dep ul li a:hover,
#gnb.total-menu > ul > li .gnb-2dep ul li a:focus{color:var(--theme-red-color);}
#gnb.total-menu > ul > li.on .gnb-2dep ul li a:hover,
#gnb.total-menu > ul > li.on .gnb-2dep ul li a:focus{color:#111; font-weight: 500;}
#gnb.total-menu > ul > li:hover .gnb-2dep:before,
#gnb.total-menu > ul > li.on .gnb-2dep:before {width:100%; left:0;}
#gnb.total-menu > ul > li.on .gnb-2dep ul{background-color: #f2f2f2;}

/* GNB :: 2차메뉴 Over (높이변경) */
#gnb.open #gnbBg{height:calc(var(--header-height) + 30.5rem); opacity:1;filter:Alpha(opacity=100);}
#gnb.open > ul > li .gnb-2dep{
	height:30.4rem; opacity:1.0;filter:Alpha(opacity=100);
	visibility:visible;
	-webkit-transition: height 0.5s ease-in-out, opacity 0.5s ease-in-out 0.2s;
    transition: height 0.5s ease-in-out, opacity 0.5s ease-in-out 0.2s;
}

/* -------- Header :: active -------- */
.index-wrapper #headerInnerWrap{transform:translateY(calc(-1 * var(--header-height)));}
.index-wrapper .header-util-box{transform:translateY(-100%);}
.index-wrapper .header-qrcode-box{transform:translateX(calc(100% + 16px));}
.index-wrapper #headerInnerWrap.active,
.index-wrapper .header-util-box.active{transform:translateY(0)}
.index-wrapper .header-qrcode-box.active{transform:translateX(0)}

/* -------- Header :: GNB(Mobile) -------- */
.nav-open-btn{display:none;}
#gnbM{display:none}

/* ========================================================
 * UTIL BOX
======================================================== */
.header-util-box{position:fixed; top:0; right:0; width:var(--header-util-width); height:16.7rem; z-index:10000; background: #25457f; transition:var(--custom-transiton2);}
/* ****************** 사이트맵버튼, 언어선택 ********************** */
/* Header :: 사이트맵버튼 */
.sitemap-line-btn{position:absolute; top:0; left:0; width:var(--header-util-width);; height:var(--header-util-width);; display:flex; flex-direction:column; justify-content: center; box-sizing:border-box; z-index:1111; }
.sitemap-line-btn .line{display:block; width:4.9rem; height:1px; background-color:#fff; margin: 6px auto; -webkit-transition: var(--custom-transiton1); transition: var(--custom-transiton1)}
.sitemap-line-btn:hover .line.line1,
.sitemap-line-btn:focus .line.line1{transform:translateY(-5px)}
.sitemap-line-btn:hover .line.line2,
.sitemap-line-btn:focus .line.line2{transform:translateY(5px)}
.sitemap-line-btn .sitemap-txt{position:absolute; height:1em; overflow:hidden; top:50%; left:0; right:0; text-align:center; color:#fff; font-size:12px; margin-top:-7px;  }
.sitemap-line-btn .sitemap-txt em{display:block; transition:var(--custom-transiton1); transform:translateY(110%);}
.sitemap-line-btn:not(.open):not(.close):hover .sitemap-txt em,
.sitemap-line-btn:not(.open):not(.close):focus .sitemap-txt em{transform:translateY(0%);}
/* active */
.sitemap-line-btn.open .line.line1{animation: sitemap_top_line_on_ani .5s linear forwards;}
.sitemap-line-btn.open .line.line2{animation: sitemap_bottom_line_on_ani .5s linear forwards;}
.sitemap-line-btn.close .line.line1{animation: sitemap_top_line_off_ani .5s linear forwards;}
.sitemap-line-btn.close .line.line2{animation: sitemap_bottom_line_off_ani .5s linear forwards;}
@keyframes sitemap_top_line_on_ani {
    0% {
        transform: translateY(-5px) rotate(0);
    }

    30%,50% {
        transform: translateY(6px) rotate(0)
    }

    100% {
        transform: translateY(6px) rotate(-45deg);
    }
}
@keyframes sitemap_bottom_line_on_ani {
    0% {
        transform: translateY(5px) rotate(0);
    }

    30%,50% {
        transform: translateY(-6px) rotate(0)
    }

    100% {
        transform: translateY(-6px) rotate(45deg);
    }
}
@keyframes sitemap_top_line_off_ani {
    0% {
        transform: translateY(6px) rotate(-45deg);
    }

    30%, 50% {
        transform: translateY(6px) rotate(0)
    }
    100% {
        transform: translateY(0) rotate(0);
    }
}
@keyframes sitemap_bottom_line_off_ani {
    0% {
        transform: translateY(-6px) rotate(45deg);
    }

    30%, 50% {
        transform: translateY(-6px) rotate(0)
    }
    100% {
        transform: translateY(0) rotate(0);
    }
}

/* Header :: 언어선택 */
.header-lang-list {position:relative; text-align:center; padding-top:var(--header-util-width);}
.header-lang-list li{margin-top:1.5rem}
.header-lang-list li:first-child{margin-top:0}
.header-lang-list li a{display:block; position:relative; opacity:0.47; font-size:1.3rem; font-weight:600; color:#fff; transition:var(--custom-transiton1);}
.header-lang-list li.cur a,
.header-lang-list li a:hover{opacity:1.0;}

/* ****************** QR 코드 ********************** */
.header-qrcode-box{position:fixed; top:18rem; right:0; width:var(--header-util-width); z-index:12; transition:var(--custom-transiton2) }
.header-qrcode-box .qrcode-over-btn-box{display:block; width:7.6rem; height:7.6rem; margin:0px auto; background-color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:1.3rem; color:#000; font-weight:600;}
.header-qrcode-box .qrcode-over-btn-box .qr-tit{margin-top:1rem;}
.header-qrcode-box .qrcode-over-btn-box i{font-size:1.846em;}
.header-qrcode-box .qrcode-img-box{position:absolute; right:calc(100% - 1.2rem); top:0; display:none;}
@media all and ( min-width: 1281px ){
	.header-qrcode-box:hover .qrcode-img-box,
	.header-qrcode-box .qrcode-over-btn-box:focus + .qrcode-img-box{display:block;}
}

/* ****************** 문의버튼 ********************** */
/* Header :: 문의버튼 */
.header-inquiry-box{position:fixed; top:0; right:0; width:var(--header-util-width); height:100vh; visibility:hidden; transition:var(--custom-transiton2);}
.header-inquiry-box .inquiry-bg{position:absolute; top:21.7rem; left:0; right:0; background-color:#436812; height:0; }
.header-inquiry-box .inquiry-btn{position:absolute; display:flex; align-items:center; justify-content:center; bottom:0px; left:0px; width:100%; height:22.7rem; z-index:1; transition:var(--custom-transiton1); opacity:0; transform:translateY(-30px); transition:var(--custom-transiton2); transition-delay:0s}
.header-inquiry-box .inquiry-btn .inquiry-btn-inner{display:block; width:20rem; text-align:center; transform:rotate(90deg); color:#f2f2f2; font-size:1.8rem; font-weight:600; margin:0 -3rem;}
.header-inquiry-box .inquiry-btn .inquiry-btn-inner i{position:relative; top:0.1rem; ;font-size:1.33em; margin-right:0.5em}
.header-inquiry-box .inquiry-btn .inquiry-btn-inner .txt{position:relative;}
.header-inquiry-box .inquiry-btn .inquiry-btn-inner .txt:before{position:absolute; bottom:-4px; left:0px; width:100%; height:3px; background-color:#fff; content:""; transition:var(--custom-transiton1); transform-origin:100% 0; transform:scaleX(0); transition-property: transform}
.header-inquiry-box .inquiry-btn:hover .inquiry-btn-inner .txt:before{transform:scaleX(1); transform-origin:0 0;}
/* active */
.header-inquiry-box.active{z-index:9999; visibility:visible;}
.header-inquiry-box.active .inquiry-bg{height:100%;}
.header-inquiry-box.active .inquiry-btn{transform:translateY(0); opacity:1; transition-delay:0.15s}

/* ========================================================
 * FOOTER
======================================================== */
/* -------- FOOTER :: 레이아웃 -------- */
#footer{background-color:#fff; border-top:1px solid #eaeaea; padding:7.7rem 0 6.5rem;}
#footerInner{position:relative; padding-bottom:3.7rem}
.footer-left-con{float:left; width:50%; display:flex; }
.footer-right-con{float:right; width:50%; display:flex; justify-content:flex-end;}

/* Footer :: TOP버튼 */
.to-top-btn{
	position:fixed; 
	bottom:-100px; right:15px; 
	display:block; 
	width:46px; height:46px; 
	background-color:#fff; 
	text-align:center; 
	color:var(--theme-red-color); 
	z-index:99;
	border:1px solid #eee;
	box-sizing:border-box;
	opacity:0;filter:Alpha(opacity=0);
	transition:var(--custom-transiton1);
	border-radius:50%;
}
.to-top-btn.bottom-fixed{bottom:15px; opacity:1.0;filter:Alpha(opacity=100);}
.to-top-btn i{display:inline-block; font-size:16px; line-height:46px; transition:all 0.3s}
.to-top-btn:hover i{transform:translateY(-3px)}

/* SubPage TOP버튼 */
#footer .sub-top-btn {right:22px;}
#footer .sub-top-btn.bottom-fixed {bottom:85px;} 


/* -------- FOOTER :: 상단 -------- */
/* Footer :: 푸터로고 */
.foot-logo{display:block; margin-right:10rem;}

/* Footer :: 정보 */
.footer-address{letter-spacing:-0.5px;}
.footer-address .footer-address-txt{color:#494949; font-size:1.6rem; line-height:1.4; margin:0 -8px; margin-top:8px; font-weight:500;}
.footer-address .footer-address-txt:first-child { margin-top:0; font-weight:400;}
.footer-address p{display:inline-block; vertical-align:middle; position:relative; margin:0 8px;}
.footer-address p:before{position:absolute; top:50%; left:-8px; width:1px; height:10px; margin-top:-5px; background-color:#ccc; content:"";}
.footer-address p:first-child:before{display:none;}
/* Footer :: Copyright */
.footer-copyright{font-size:1.3rem; font-weight:500; color: #494949; margin-top:1.7rem}

/* Footer :: 푸터메뉴 */
.foot-menu{display:flex; width:calc(100% - 40rem);}
.foot-menu li{position:relative; /* width:18.7rem; */ width:50%; margin-left:-1px; box-sizing:border-box; }
.foot-menu li a {overflow:hidden; position:relative; display:flex; justify-content:space-between; align-items:center; height:5rem; padding:0 2.4rem; color:#000; font-size:1.5rem; letter-spacing:-0.065em; border:1px solid #dedede; box-sizing:border-box;}
.foot-menu li a i {position:relative; font-size:11px; transition:var(--custom-transiton1)}
.foot-menu li a span{position:relative;}
.foot-menu li a b{position:relative; color:var(--theme-red-color); font-weight:400;}
/*.foot-menu li:last-child a {padding:0 3.6rem;}*/

/* Footer :: 패밀리사이트 */
.family-site-box{/* position:absolute; top:20px; right:0;*/ position:relative; width:24rem; margin-left:2rem; text-align:left; letter-spacing:-0.25px;}
.family-site-box .family-site-open-btn{display:block; width:100%; height:5rem; padding:0 3rem; text-align:left; font-size:1.3rem; border:1px solid #dedede;  color:#000; font-weight:500; box-sizing:border-box; transition:var(--custom-transiton1)}
.family-site-box .family-site-open-btn:after{position:absolute; right:17px; top:50%; transform:translateY(-50%); font-size:14px; font-family: 'xeicon'; content:"\e942";}
.family-site-box.open .family-site-open-btn:after{content:"\e945";}
.family-site-box .family-site-open-btn em{position:relative;}
.family-site-list{position:absolute; bottom:100%; left:0px; width:100%;  padding:10px 0; background-color:#fff; border:1px solid #dedede; border-bottom:0;  z-index:11; display:none; box-sizing:border-box;}
.family-site-list a{display:block; padding:10px 30px; color:#333; font-size:12px;}
.family-site-list a:hover{color:#000; text-decoration:underline;}

@media all and (min-width:801px){
	.foot-menu li a:before{position:absolute; top:0px; left:0px; width:100%; height:100%; background-color:#f2f2f2; content:""; transform:scaleX(0); transform-origin:0 0; transition:var(--custom-transiton1) }
	.foot-menu li a:hover:before{transform:scaleX(1); }
	.foot-menu li a:hover i{transform:translateX(3px)}
	.family-site-box .family-site-open-btn:before{position:absolute; top:0px; left:0px; width:100%; height:100%; background-color:#f2f2f2; content:""; transform:scaleX(0); transform-origin:0 0; transition:var(--custom-transiton1)}
	.family-site-box .family-site-open-btn:hover:before{transform:scaleX(1); }
}

/* Footer :: 마크 */
.footer-mark-list{position:absolute; right:0; bottom:0;}

/* ========================================================
 * SUB LAYOUT
======================================================== */
/*  SUB LAYOUT :: 비주얼 */
#visual{position:relative; width:100%; height:var(--sub-visual-height); }
#visual .visual-img-con{
	position:absolute; 
	top:0px; 
	left:0px; 
	width:100%;
	height:var(--sub-visual-height);
	overflow:hidden; 
}
#visual .visual-img-inner{
	width:100%; 
	height:100%; 
	background-size:cover !important; 
	-webkit-transform: scale(1.1,1.1); 
	transform: scale(1.1,1.1); 
	-webkit-transition:transform 5000ms ease-in-out; 
	transition:transform 5000ms ease-in-out; 
}
#visual .visual-txt-con{
	position:relative; 
	z-index:1;
	display:table; 
	width:100%; 
	height:100%; 
	color:#fff;
	box-sizing: border-box; 
}
#visual .visual-txt-container{
	position:relative; 
	width:100%; 
}
#visual .visual-tit{
	font-weight:500; 
	font-size:7.6rem; 
	letter-spacing:-0.075em;
}
#visual .visual-sub-txt{
	font-size:2.8rem; 
	color:rgba(255,255,255,0.5);
	font-weight:300; 
	padding-top:1em;
	line-height:1.2;
}
#visual .hidden-item{font-weight:inherit;}
#visual .visual-sub-txt .hidden-item{transition-delay:0.1s}
#visual .location{
	opacity:0;filter:Alpha(opacity=0);
    -webkit-transform: translateY(30px); 
     transform: translateY(30px);
	-webkit-transition-delay:0.5s;
	transition-delay:0.5s;
	-webkit-transition:opacity 1.0s, transform 1.0s;
	transition:opacity 1.0s, transform 1.0s;
}

/* SUB LAYOUT :: 상단효과 active */
#visual.active .visual-img-inner{
    -webkit-transform: scale(1.0,1.0) rotate(0.002deg);
     transform: scale(1.0,1.0) rotate(0.002deg);
}
#visual.active .hidden-box .hidden-item{
	opacity:1.0;
	transform:translateY(0) rotate(0);
}
#visual.active .location{
	opacity:1.0;filter:Alpha(opacity=100);
    -webkit-transform: translateY(0px); 
     transform: translateY(0px);
}
/* SUB LAYOUT :: 위치정보(location) */
.location{overflow:hidden; position:absolute; left:0; right:0; bottom: 5rem;}
.location ul{display:flex; justify-content:flex-end}
.location li{display:inline-block; vertical-align:middle; color:#fff; font-size:1.4rem; letter-spacing:-0.025em;}
.location li a{color:inherit;}
.location li i{font-size:18px; margin-top:-2px;}
.location li:before{font-family: 'xeicon'; display:inline-block;content: "\e93f"; position:relative; top:-1px; vertical-align:middle; margin:0px 10px 0 8px; color:#fff; font-size:12px; opacity:0.5;filter:Alpha(opacity=50);}
.location li:first-child:before{display:none;}

/* SUB LAYOUT :: 서브메뉴(스타일2) */
#topMenu{position:relative; width:100%; height:calc(var(--sub-menu-height) + 1px); } /* (+1 border height)*/
#topMenu .side-menu-inner{text-align:center; width:100%; height:var(--sub-menu-height); border-bottom:1px solid #ddd; background-color: #f7f7f7; }
#topMenu .side-menu-inner ul{display:flex; align-items:center; justify-content:center;}
#topMenu .side-menu-inner ul li{
	float:left;
	width: 14.25%; 
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	 box-sizing: border-box; 
	-webkit-transition:all 0.4s; 
	transition:all 0.4s;
}
#topMenu .side-menu-inner ul li > a{
	display:block; 
	display:table; 
	position:relative;
	width:100%;
	height:var(--sub-menu-height);
	line-height:1.2; 
	color:#000;
	font-size:1.85rem; 
	letter-spacing:-0.065em; 
	font-weight:400; 
	word-break:keep-all;
	-webkit-transition:all 0.4s; 
	transition:all 0.4s;
}
#topMenu .side-menu-inner ul li > a:before{
	position:absolute;
	bottom:0px;
	left:50%;
	width:0;
	height:2px;
	background-color:#1f86ca;
	content:"";
	-webkit-transition:all 0.4s;
	transition:all 0.4s;
}
#topMenu .side-menu-inner ul li > a > span{display:table-cell; vertical-align:middle; padding:0 15px; }
#topMenu .side-menu-inner ul li > a:hover:before, 
#topMenu .side-menu-inner ul li.on > a:before{width:100%; width:calc(100% + 1px); margin-left:-50%;}
#topMenu .side-menu-inner ul li:hover > a, 
#topMenu .side-menu-inner ul li.on > a{color:#1f86ca;}

/* SUB LAYOUT :: 모바일메뉴(공통)  */
#topMenuM{display:none;}

/*  SUB LAYOUT :: 컨텐츠 레이아웃 */
#content:not(.wide){padding:0rem 0}
#content.wide{padding:0rem 0 0 0}

/*  SUB LAYOUT :: 상단정보 (공통) */
#contentInfoCon{position:relative; margin:0 auto 5rem; text-align:center; }
#contentInfoCon .content-tit{color:#000; font-size:5rem; font-weight:700; letter-spacing:-0.035em;margin-top: 80px;}
#contentInfoCon .content-tit2{color:#000; font-size:2.5rem; font-weight:600; margin-top: 80px;line-height:30px;}
#contentInfoCon .content-tit2 span{color:#000; font-size:2.0rem; font-weight:500; margin-top: 80px;}
#contentInfoCon .content-tit3{color:#000; font-size:3rem; font-weight:600; margin-top: 20px;line-height:5px;}
#contentInfoCon .content-tit3 span{color:#000; font-size:3rem; font-weight:500; margin-top: 20px;}



/* SUB LAYOUT :: 서브메뉴 Fixed (공통) */
@media all and (min-width:1025px){
	.fixed-sub-menu.top-fixed .side-menu-inner{position:fixed; top:0px; left:0px; z-index:999;}
}

/* ========================================================
 * 사이트맵
======================================================== */
/* 사이트맵 :: 레이아웃 */
.cm-sitemap-wrapper{position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:-1; opacity:0;filter:Alpha(opacity=0); visibility:hidden; }
.cm-sitemap-wrapper:before{position:absolute; top:0px; right:0px; width:100%; height:100%; background-color:#000; content:""; opacity:0; transition:opacity 0.2s ease;}
.cm-sitemap-container{position:absolute; width:100%; height:100%;/* overflow-y:auto; */ }
.cm-sitemap-container .sitemap-bg{position:absolute; right:0; top:0px; width:100%; height:100%; background:#fff; /* transition:var(--custom-transiton2); */ transform:translate(calc(100% + 6vw),0) rotate(0.001deg) }
.cm-sitemap-area-con{position:relative; box-sizing:border-box; margin-right:var(--header-util-width); }
.cm-sitemap-area-con .bg{position:absolute; top:0px; left:0px; width:100%; height:100%; background-color:#fff; transform:scaleX(0); transform-origin:100% 0; /* transition:var(--custom-transiton2); transition-property:transform; transition-delay:0.1s;*/ }
/* 사이트맵 :: 왼쪽 */
.sitemap-left-con{position:relative; float:left; height:100vh; width:36.8%; display:flex; flex-direction:column; justify-content:space-between; flex:1; padding:23rem 6.6vw 11.2245vh;  box-sizing:border-box; }
.sitemap-left-con .bg{transform-origin:100% 0;}
.sitemap-left-con .sitemap-logo{position:absolute; top:3rem; left:6.6vw}
.sitemap-left-con .sitemap-logo img{height:4.6rem}
.sitemap-slogan-txt-con,
.sitemap-footer-info-con{position:relative; /* transition:var(--custom-transiton2); */}
.sitemap-slogan-txt-con .sitemap-slogan{font-size:3.8rem; letter-spacing:-0.075em; line-height:1.32; font-weight:600; color:#000; margin-bottom:4rem;}
.sitemap-slogan-txt-con .sitemap-slogan-txt{font-size:2.5rem; color:#000; letter-spacing:-0.04em; font-weight:500;}
.sitemap-slogan-txt-con .hidden-box .hidden-item{transition:none;}
.sitemap-footer-info-con .sitemap-familysite-box{width:13rem; margin-left:0}
.sitemap-footer-info-con .sitemap-familysite-box .family-site-open-btn{height:3.5rem; font-size:1.3rem; border:0; padding:0; font-weight:500;}
.sitemap-footer-info-con .sitemap-familysite-box .family-site-open-btn:before{display:none;}
.sitemap-footer-info-con .sitemap-familysite-box .family-site-open-btn:after{right:0.1rem}
.sitemap-footer-info-con .sitemap-familysite-box .family-site-open-btn em{font-weight:inherit}
.sitemap-footer-info-con .sitemap-familysite-box .family-site-list{border:1px solid #000; padding:0; }
.sitemap-footer-info-con .sitemap-familysite-box .family-site-list a{padding:1rem; font-size:1.1rem;}
.sitemap-footer-info-con .sitemap-familysite-box .family-site-list a:hover{background-color:#f2f2f2; text-decoration:none;}
.sitemap-footer-info-con .sitemap-copyright{color:#494949; font-size:1.25rem; font-weight:400; margin-top:1rem;}

/* 사이트맵 :: 사이트맵영역 */
.sitemap-right-con{position:relative; float:right; height:100vh; width:63.2%; box-sizing:border-box; /* padding:18.4694vh 6rem 11.2245vh 6.875vw; */ /* padding:10.4694vh 6rem 10.2245vh 6.875vw; */ flex:1; /*추가*/display:flex; align-items:center; justify-content:center; }
.sitemap-right-con .bg{background-color:#f7f7f7; }
.sitemap-list-con{position:relative; /*추가*/ width:80%; }
.sitemap-list-con > .sitemap-item{display:flex; margin-bottom:7rem; opacity:0; transform:translateX(-50px); }
.sitemap-list-con > .sitemap-item:last-child{margin-bottom:0}
.sitemap-list-con > .sitemap-item .sitemap-item-tit{width:26.2rem; font-size:2.9rem; font-weight:600; letter-spacing:-0.075em; color:#000; transition:var(--custom-transiton1);}
.sitemap-list-con > .sitemap-item:hover .sitemap-item-tit{color:var(--theme-red-color)}
.sitemap-list-con > .sitemap-item .sitemap-2dep-list{/* display:flex; flex-wrap:wrap; width:calc(100% - 26.2rem) */ width:30vw;}
.sitemap-list-con > .sitemap-item .sitemap-2dep-list li{position:relative; float:left; margin-left:2.2917vw; padding:0.5rem 0 2rem;}
.sitemap-list-con > .sitemap-item .sitemap-2dep-list li:before{position:absolute; top:0.8rem; left:-2.3rem; content:"/"; font-family:var(--font-family2); color:#bababa; font-weight:300;}
.sitemap-list-con > .sitemap-item .sitemap-2dep-list li:first-child{margin-left:0;}
.sitemap-list-con > .sitemap-item .sitemap-2dep-list li:first-child:before{display:none;}
.sitemap-list-con > .sitemap-item-01 .sitemap-2dep-list li:nth-child(6){clear:both; margin-left:0}
.sitemap-list-con > .sitemap-item-01 .sitemap-2dep-list li:nth-child(6):before{display:none;}
.sitemap-list-con > .sitemap-item .sitemap-2dep-list li a{position:relative; display:block; font-size:min(0.9896vw,1.9rem); font-weight:500; letter-spacing:-0.075em; color:#1c1c1c; transition:var(--custom-transiton1); }
.sitemap-list-con > .sitemap-item .sitemap-2dep-list li a:before{position:absolute; bottom:-5px; left:0px; width:100%; height:3px; background-color:var(--theme-red-color); transition:var(--custom-transiton1); transform-origin:100% 0; transform:scaleX(0); transition-property: transform; content:"";}
.sitemap-list-con > .sitemap-item .sitemap-2dep-list li a:hover{color:var(--theme-red-color); }
.sitemap-list-con > .sitemap-item .sitemap-2dep-list li a:hover:before{transform:scaleX(1); transform-origin:0 0;}
.sitemap-list-con > .sitemap-item .sitemap-2dep-list li a i{position:relative; top:1px; margin-left:1rem; color:var(--theme-red-color)}
.sitemap-footer-menu{/* position:absolute; display:flex; bottom:11.2245vh; right:10rem */ margin-bottom:3rem;}
/* .sitemap-footer-menu li{margin-left:1.8rem} */
.sitemap-footer-menu li a{color:#000; font-size:1.8rem; letter-spacing:-0.075em;}
.sitemap-footer-menu li a b{font-weight:400; color:var(--theme-red-color)}
/* 사이트맵 :: open */
.cm-sitemap-wrapper.open{
	opacity:1.0;filter:Alpha(opacity=100); 
	visibility:visible; 
	z-index:9998; 
}
.cm-sitemap-wrapper.open:before{opacity: 0.5}
.cm-sitemap-wrapper.open .sitemap-bg{transform:translate(0,0) rotate(0.001deg) }
.cm-sitemap-wrapper.open .cm-sitemap-inner-con{opacity:1.0; transition-delay:0.4s}
.cm-sitemap-wrapper.open .splitting .char{transform:translateY(0); transition-delay:0.3s}
.cm-sitemap-wrapper.open .sitemap-left-con{opacity:1;}
.cm-sitemap-wrapper.open .sitemap-left-con .bg{transform:scaleX(1)}
.cm-sitemap-wrapper.open .sitemap-footer-info-con,
.cm-sitemap-wrapper.open .sitemap-slogan-txt-con{transform:translateY(0px); opacity:1;}
.cm-sitemap-wrapper.open .sitemap-right-con .bg{transform:scaleX(1)}
.cm-sitemap-wrapper.open .sitemap-right-con .sitemap-list-con{opacity:1; transform:translateX(0)}
/* 사이트맵 :: 닫기버튼 */
.sitemap-close-btn{display:none; width:var(--header-util-width); height:var(--header-util-width); position:fixed; top:0px; right:0px; z-index:10001; font-size:0; text-indent:-9999px}
/* ========================================================
 * MODAL LAYERPOPUP
======================================================== */
/* modal layer */
.modal-fixed-pop-wrapper{display:none; overflow-y:scroll; overflow-x:hidden;  position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:99999; background:#000; background:rgba(0,0,0,0.8);}
.modal-fixed-pop-inner{position:absolute; display:table; width:100%; height:100%; text-align:center;}
.modal-inner-box{ position:relative; display:table-cell; vertical-align:middle;}
.modal-loading{position:absolute; top:50%; left:50%; margin:-25px 0 0 -25px; z-index:10000;}
.modal-inner-content{text-align:left;}
.loading {
  display: inline-block;
  width: 50px;
  height: 50px;
  border: 8px solid rgba(255,255,255,.3);
  border-radius: 50%;
  border-top-color: #fff;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
}
@keyframes spin {
  to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@-webkit-keyframes spin {
  to { -webkit-transform: rotate(360deg); transform: rotate(360deg);  }
}
/* modal layer content */
.footer-modal-content{position:relative; width:96%; max-width:1000px; margin:20px auto; }
.footer-modal-content h1{font-size:24px; font-weight:600; letter-spacing:-0.5px; text-align:center; padding:0 50px 20px; color:#fff;}
.modal-close-btn{position:absolute; top:-6px; right:-6px; color:#fff; }
.modal-close-btn i{font-size:38px;}
.modal-close-btn i:hover {color:#fff}
.footer-inner-box{padding:30px; background-color:#fff; }
.footer-inner{padding:20px; height:400px; overflow-y:auto; overflow-x:hidden; border:1px solid #ddd; }