@charset "utf-8";

/* background fixed 사용시 버그 대응용 * 한 번 스크롤로 페이지 전체 넘김을 할 때는 html스타일에서 height속성 제거하기 */
/* html {overflow: hidden; height: 100%;} */
/* body {overflow: auto; height: 100%;} */

/* ******************** 공용 ******************** */
a:link {color:#666;}
a:visited {color:#666;}
a:hover {color:#000;}
a:active {color:#000;}
/*.gotop {z-index:900; position:fixed; width:85px; height:85px; border-radius:100px; bottom:40px; right:40px; background:url(/images/common/top-btn.png) no-repeat 50% #fff; box-shadow:0 0 20px rgba(0,0,0,.15) !important; cursor:pointer;}
.gotop:hover {background:url(/images/common/top-btn-w.png) no-repeat 50% var(--base); box-shadow:0 0 20px rgba(0,0,0,0) !important;}*/

html {font-size:10px; -webkit-text-size-adjust:none;}
body {font-family:'NEXON' !important; font-size:1.6rem; line-height:1.8; color:#22242b; font-weight:400; overflow-x:hidden;}
body * {box-sizing:border-box;}

a:focus, button:focus, input:focus, select:focus, textarea:focus {
    outline: 2px solid #005fcc!important; 
    outline-offset: 2px!important;       
    border-radius: 4px;        
}

.scroll-y::-webkit-scrollbar {height:3px; width:6px;}
.scroll-y::-webkit-scrollbar-thumb {background-color:#999; border-radius:5px;}
.scroll-y::-webkit-scrollbar-track {background-color:#ccc; border-radius:5px;}

#google_translate_element {position:relative; width:100%; z-index:99999; padding-left:30px; border-bottom:1px solid #dbdbdb;}
#google_translate_element select {height:19px; border:1px solid #999; border-radius:3px; padding-left:3px; background-position: calc(100% - 3px) center !important;}
.trans_off {position:absolute; right:20px; top:0px; z-index:99999; cursor:pointer; background:transparent; border:0; padding-top:6px; font-family:unset; font-size:revert; line-height: normal;}
.VIpgJd-ZVi9od-ORHb {position:absolute; left:-9999px;}

.term_wrap .checkWrap { text-align:right; font-size :16px; margin-top : 15px; transform : rotate(0.05deg);}
.term_wrap .checkWrap input[type='checkbox'] + label { padding: 3px 0 0 30px;
    padding-left: 30px; background: url(/images/common/i-check.png) no-repeat left center / 20px; cursor: pointer; }
.term_wrap .checkWrap input[type='checkbox']:checked + label { background: url(/images/common/i-check-on.png) no-repeat left center / 20px; }

/* 일반 레이어팝업 */
.layer {position:fixed; left:0; top:0; width:100%; height:100%; display:none; justify-content: center; align-items:center; padding: 2vw; background:rgba(0, 0, 0, .7); opacity: 0; z-index:-1;}
.layer.on {z-index:99999; opacity:1; display:flex;}

/* 로그인/회원가입 레이어팝업 */
.layer.login_pop .wrap {display:none; max-width: 600px; width:100%; overflow:visible; border-radius:10px; height:auto; position: relative; background:#fff; padding:50px; text-align:center; max-height:90vh;}
.layer.login_pop .wrap span.mark {color:red;}
.layer.login_pop .wrap.on {display:block;}
.layer.login_pop .wrap .face {border:1px solid var(--border2); padding:20px 20px 30px 20px; border-radius:20px;}
.layer.login_pop .wrap img.logo {width:100px; display:block; margin:0 auto;}
.layer.login_pop .wrap h2 {font-size:30px; font-weight:600; transform:var(--textRotate);}
.layer.login_pop .wrap h3 {display:inline-block; font-size:20px; margin:10px 0 0px; font-weight:600; transform:var(--textRotate); padding:10px 15px; border-top:1px solid var(--border1); border-bottom:1px solid var(--border1);}
.layer.login_pop .wrap button.close {position:absolute; top:15px; right:15px; cursor:pointer;  background:transparent url(/images/common/i-close.png) no-repeat center/15px; width:30px; height:30px; text-indent:-9999px; z-index:99999;}
.layer.login_pop .loginBtnWrap {margin-top:30px; display:flex; justify-content:center; gap:10px; flex-wrap:wrap;}
.layer.login_pop .loginBtnWrap a {display:inline-block; padding:10px 50px 10px 50px; border:1px solid var(--border1); color:#333; border-radius:10px; font-weight:600; transform:var(--textRotate); transition:all 0.3s;}
.layer.login_pop .loginBtnWrap a.kakao {background:url(/images/common/i-kakao.png) no-repeat 10% center / 30px; padding:10px 50px 10px 80px;}
.layer.login_pop .loginBtnWrap a.naver {background:url(/images/common/i-naver.png) no-repeat 10% center / 30px; padding:10px 50px 10px 80px;}
.layer.login_pop .loginBtnWrap a:hover {background-color:#666; color:#fff; border:1px solid #666;}
.layer.login_pop .loginBtnWrap a.agree {background-color:#666; color:#fff; border:1px solid #666;}
.layer.login_pop .loginBtnWrap a.agree.on {background-color:var(--green); border:1px solid var(--green);}

.layer.login_pop h5.tit {position:relative; padding-bottom:10px;font-weight:600;font-size:18px; color:#000; padding-left:15px; transform:var(--textRotate); text-align:left;}
.layer.login_pop h5.tit:before {content:""; display:block; width:3px; height:20px; background:#003964; position:absolute; left:0; top:6px; box-sizing: border-box;}
.layer.login_pop .agree {font-size:1.4rem;}
.layer.login_pop input[type="checkbox"] {position:absolute; left:-9999px;}
.layer.login_pop .term_wrap+.term_wrap {margin-top:20px;}
.layer.login_pop .term_wrap .form {display:flex; width:100%; gap:30px; justify-content: center; border:1px solid var(--border1); padding:20px; border-radius:20px; margin-bottom:30px;}
.layer.login_pop .term_wrap .form .birth select {max-width:100px; width:100px; }
.layer.login_pop .term_wrap .form dl {display:flex; align-items:center; gap:20px;}
.layer.login_pop .term_wrap .form dt {white-space:nowrap; font-weight:600; transform:var(--textRotate);}
.layer.login_pop .term_wrap .form dd {display:flex; width:100%}
.layer.login_pop .term_wrap .form dd span+span {margin-left:5px;}
.term_wrap .inner {border:1px solid var(--border1); border-radius:10px; text-align:left; }
.layer.login_pop .term_wrap .inner {height:150px;}
.term_wrap .inner pre {padding:10px;}
.term_wrap .scroll-y {overflow-y:auto;}

.layer.login_pop .inputWrap form {display:block; text-align:left; margin-top:20px;}
.layer.login_pop .inputWrap form .hidden {position:absolute; left:-9999px;}
.layer.login_pop .inputWrap form fieldset.flex {display:flex; align-items:center; gap:10px}
.layer.login_pop .inputWrap form fieldset.flex label {width:100px; font-weight:600; transform:var(--textRotate);}
.layer.login_pop .inputWrap form fieldset.flex input, .layer.login_pop .inputWrap form fieldset.flex select {width:calc(100% - 110px);}
.layer.login_pop .inputWrap form fieldset legend {font-weight:600; transform:var(--textRotate); margin-bottom:10px;}
.layer.login_pop .inputWrap form fieldset+fieldset {margin-top:15px;}

/* 로그인/회원가입 레이어팝업 */
.login-modal.show .wrap {display:none; width:100%; overflow:visible; border-radius:10px; height:auto; position: relative; background:#fff; padding:50px; text-align:center; max-height:90vh;}
.login-modal.show .wrap span.mark {color:red; background-color: #FFF;}
.login-modal.show .wrap.on {display:block;}
.login-modal.show .wrap .face {border:1px solid var(--border2); padding:20px 20px 30px 20px; border-radius:20px;}
.login-modal.show .wrap img.logo {width:100px; display:block; margin:0 auto;}
.login-modal.show .wrap h2 {font-size:30px; font-weight:600; transform:var(--textRotate);}
.login-modal.show .wrap h3 {display:inline-block; font-size:20px; margin:10px 0 0px; font-weight:600; transform:var(--textRotate); padding:10px 15px; border-top:1px solid var(--border1); border-bottom:1px solid var(--border1);}
.login-modal.show .loginBtnWrap {margin-top:30px; display:flex; justify-content:center; gap:10px; flex-wrap:wrap;}
.login-modal.show .loginBtnWrap a {display:inline-block; padding:10px 50px 10px 50px; border:1px solid var(--border1); color:#333; border-radius:10px; font-weight:600; transition:all 0.3s;}
.login-modal.show .loginBtnWrap a.kakao {background:url(/images/common/i-kakao.png) no-repeat 10% center / 30px; padding:10px 50px 10px 80px;}
.login-modal.show .loginBtnWrap a.naver {background:url(/images/common/i-naver.png) no-repeat 10% center / 30px; padding:10px 50px 10px 80px;}
.login-modal.show .loginBtnWrap a:hover {background-color:#666; color:#fff; border:1px solid #666;}
.login-modal.show .loginBtnWrap a.agree {background-color:#666; color:#fff; border:1px solid #666;}
.login-modal.show .loginBtnWrap a.agree.on {background-color:var(--green); border:1px solid var(--green);}

.login-modal.show .modal-header > button {position:absolute; top:15px; right:8px; cursor:pointer;  background:transparent url(/images/common/i-close.png) no-repeat center/15px; width:30px; height:30px; text-indent:-9999px; z-index:99999;}
.login-modal.show h5.tit {position:relative; padding-bottom:10px;font-weight:600;font-size:18px; color:#000; padding-left:15px; transform:var(--textRotate); text-align:left;}
.login-modal.show h5.tit:before {content:""; display:block; width:3px; height:20px; background:#003964; position:absolute; left:0; box-sizing: border-box;}
.login-modal.show .agree {font-size:1.4rem;}
.login-modal.show input[type="checkbox"] {position:absolute; left:-9999px;}
.login-modal.show .term_wrap+.term_wrap {margin-top:20px;}
.login-modal.show .term_wrap .form {display:flex; width:100%; gap:30px; justify-content: center; border:1px solid var(--border1); padding:20px; border-radius:20px; margin-bottom:30px;}
.login-modal.show .term_wrap .form .birth select {max-width:100px; width:100px; }
.login-modal.show .term_wrap .form dl {display:flex; align-items:center; gap:20px;}
.login-modal.show .term_wrap .form dt {white-space:nowrap; font-weight:600; transform:var(--textRotate);}
.login-modal.show .term_wrap .form dd {display:flex; width:100%}
.login-modal.show .term_wrap .form dd span+span {margin-left:5px;}
.login-modal.show .term_wrap .inner {height:150px;}

.login-modal.show form .inputWrap {display:block; text-align:left; margin-top:20px;}
.login-modal.show form .inputWrap .hidden {position:absolute; left:-9999px;}
.login-modal.show form .inputWrap fieldset.flex {display:flex; align-items:center; gap:10px}
.login-modal.show form .inputWrap fieldset.flex label {width:100px; font-weight:600; transform:var(--textRotate);}
.login-modal.show form .inputWrap fieldset.flex input, .login-modal.show .inputWrap form fieldset.flex select {width:calc(100% - 110px);}
.login-modal.show form .inputWrap fieldset legend {font-weight:600; transform:var(--textRotate); margin-bottom:10px;}
.login-modal.show form .inputWrap fieldset+fieldset {margin-top:15px;}

.checkWrap input[type='checkbox'] + label {padding: 3px 30px;
    padding-left: 30px; background: url(/images/common/i-check3.png) no-repeat left center / 20px; cursor: pointer; font-size:15px;}
.checkWrap input[type='checkbox']:checked + label { background: url(/images/common/i-check4-on.png) no-repeat left center / 20px; }
input:focus,select:focus,textarea:focus {outline:none !important; border:2px solid #333!important; background-color:#fff !important;}
/* ---------- 19-11-21 form css ::start ---------- */
.layer.login_pop input[type="text"],
.layer.login_pop input[type="password"],
.layer.login_pop input[type="number"],
.layer.login_pop select,
.layer.login_pop textarea {
	border:1px solid #ddd; border-radius:5px;
	height:40px; padding:6px 15px;
	font-size:15px; line-height:1; color:#333;
	background-color:#fff;
	width:100%;
	-webkit-appearance: none; /*모바일에서 입체효과 없애기*/
	-moz-appearance: none;
	appearance: none;
}
.layer.login_pop select {cursor: pointer;
    padding: 8px 20px;
    background-image: url(/images/common/select_arrow.png);
    background-repeat: no-repeat;
    background-position: 90% 50%;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    clear: left !important;}
.layer.login_pop input::-webkit-input-placeholder {color:#666 !important;} /*크롬,사파리*/
.layer.login_pop input::-moz-placeholder {color:#666 !important;} /*파폭*/
.layer.login_pop input::-ms-input-placeholder {color:#666 !important;} /*ie*/
.checkWrap input[type="checkbox"] {}
select::-ms-expand {display: none;} /* IE 10, 11의 네이티브 화살표 숨기기 */
select::focus {outline:none}
input[type='text'] {-webkit-appearance: none;}
input[readonly] {background-color:#ececec!important;}
input[disabled] {background-color:#ececec!important;}
textarea {resize:none;}
input[readonly]:hover {background-color:#ececec!important;outline:none!important;}
input[readonly]::focus {background-color:#ececec!important; outline:none!important;}


:root{
	--base:#3B7E44;
	--pink:#ec6ca5;
	--red:#fc6666;
	--amethyst:#cc2666;
	--yellow:#ffea00;
	--blue:#3b5bb9;
	--blue2:#193996;
	--blue3:#3d57a5;
	--yellow:#fff834;
	--subblue:#346ac2;
	--green:#0ea88e;
	--textRotate:rotate(0.03deg);
	--border1:#dbdce7;
	--border2:#dedede;
	--border3:#e6e6e6;
	--border4:#d1d5e8;
	--bgc1:#f2f3f8;
}
.f_green {color:var(--green);}
.f_nexenB {font-family: 'Nexen_B' !important;}
select::-ms-expand {display: none;} /* IE 10, 11의 네이티브 화살표 숨기기 */
select::focus {outline:none}
input[type='text'] {-webkit-appearance: none;}
input[readonly] {background-color:#ececec!important;}
input[disabled] {background-color:#ececec!important;}
textarea {resize:none;}
input[readonly]:hover {background-color:#ececec!important;outline:none!important;}
input[readonly]::focus {background-color:#ececec!important; outline:none!important;}

.menuBox {position:relative; width:50px; height:50px;}

.w1400 {max-width:1400px; margin:0 auto!important;}


/* 탭 스킵메뉴 */

#skipHead {z-index:9999; position:fixed; width:100%; height:65px; top:-100px; left:0; list-style:none; margin:0; padding:0; transition:all 0.3s;}
#skipHead a:focus, #skip a:active {position:fixed; padding:8px 0; width:100%; top:0; text-align: center; color:#fff; background:#003964; overflow:visible; clip:unset;}

#skipFoot {z-index:9999; position:fixed; width:100%; height:auto; bottom:-100px; left:0; transition:all 0.3s;}
#skipFoot a:focus, #skipFoot a:active {position:fixed; padding:20px 0; width:100%; bottom:0; text-align: center; color:#fff; background:#273447; overflow:visible; clip:unset;}

/* 서브페이지 상단 제목  */
.contents_box {background:#fff; border-bottom:1px solid #ddd;}
.contents_box .sub-inner {max-width:1400px; margin:0 auto; padding:100px 0;}
.contents_box.calcul_sub .sub-inner {padding:20px 0 100px;}
.contents_box.mapcase .sub-inner {max-width:none;}
.contents_box.mapcase .cont-inner {max-width:1400px; margin:0 auto;}
.contents_box .subTit {display:flex; justify-content:space-between; align-items:center; padding-bottom:20px; border-bottom:1px solid var(--border3);}
.contents_box .subTit h2 {position:relative; font-size:30px; transform:var(--textRotate); padding-left:13px;}
.contents_box .subTit h2:before {content:""; display:block; position:absolute; height:30px; width:5px; background:#ccc; border-radius:10px; left:0; top:0; }
.contents_box .subTit .channel {display:flex; font-size:14px; color:#999;}
.contents_box .subTit .channel li {position:relative;}
.contents_box .subTit .channel li.home a {display:block; position:absolute; width:27px; height:27px; background:url(/images/common/lnb_i-home.png) center center / 11px no-repeat; border-radius:50%; border:1px solid #dddee8; left:-33px; top:-2px;}
.contents_box .subTit .channel li+li {padding-left:35px;}
.contents_box .subTit .channel li+li:before {content:""; display:block; background:url(/images/common/lnb_right.png) center center / 6px no-repeat; width:6px; height:10px; position:absolute; left:16px; top:6px;}

footer .footer-family { position: relative; float: right; }
footer .footer-family>button { position: relative; display: block; font-size: 14px; width: 200px; height:40px; line-height:40px; padding-left:20px; border: 1px solid #ddd; color:#000; border-radius:5px; background:#fff; text-align:left;}
footer .footer-family>button::after { position: absolute; top: 50%; right: 0; display: block; content: ''; background: url("/images/common/arrow_down.png")no-repeat 92% 40%; width: 100%; height: 10px; transform:translateY(-35%);}
footer .footer-family>button.on::after { background: url(/images/common/arrow_up.png) no-repeat 92% 40%; }
footer .footer-family ul { display: none; position: absolute; top: -241px; left: 0; width: 100%; background-color: #fff; border: 1px solid #e5e5e5; }
footer .footer-family ul li a { display: block; font-size: 14px; width: 100%; line-height: 20px; padding: 10px 25px; opacity: 0.7; color:#000;}
footer .footer-family ul li:hover a { background-color: #efefef; opacity: 1;}

span.star_exp {display:inline-block; transform:translateY(-4px);}

/* ******************** 데스크탑 (1600~) ******************** */
nav.pc .gnb>ul>li>a {font-size:20px; padding:3px 20px;}

@media (max-width: 1600px) { 
	nav.pc .gnb>ul>li>a {font-size:18px; padding:3px 10px;}
}

/* ******************** 데스크탑 (1400~) ******************** */
@media (min-width: 1400px) {
	/*body {margin-top:27px;}*/

	.mobile {display:none !important;}
	
	header {width:100%; position:absolute; z-index:999; top:0px;}
	header .head {width:90%; margin:0 auto; position:relative;}
	header .head h1 {position:absolute; z-index:99999; left:0; top:25px;}
	header aside {position:absolute; right:0; top:38px; z-index:999;}
	header aside>* {float:left;}
	header aside .lang {padding-left:85px; transform:translateY(-5px);}
	header aside .lang>a {padding-right:27px; font-size:12px; display:block; border:2px solid #fff; color:#fff; padding:5px 20px; border-radius:5px; font-weight:800; transform:var(--textRotate);}
	header.sub aside .lang>a {border:2px solid #1a2e4d; color:#1a2e4d;}
	header aside .lang>a img {margin-left:10px;}
	header aside .lang ul li a {display:block; border:2px solid #fff; text-align:center; background:#fff; color:#000; padding:5px 20px; border-radius:5px; font-weight:800;         transform:var(--textRotate);}
	header aside .lang ul li a:hover {border:2px solid #1a2e4d; color:#fff; background:#1a2e4d;}
	header.sub aside .lang ul li a {border:2px solid #1a2e4d; text-align:center; color:#1a2e4d;}
	header aside .lang ul {display:none;}
	header aside .lang>a.on+ul {display:block;}
	header aside .lang ul a {color:#fff; font-size:12px;}
	header aside .lang ul a:hover {border-bottom:1px solid #fff;}
	header.sub aside .lang ul li a:hover {color:#fff;}
	header aside .sideBtn {}
	header aside .sideBtn a {margin-left:20px; color : #fff; font-size : 14px; font-weight :400; }
	header aside .sideBtn a.loginBtn {display:block; color:#fff; font-weight:600; font-size:1.6rem; transform:var(--textRotate);}
	header.sub aside .sideBtn a.loginBtn {color:#000;}
	header.sub {position:relative; background:#fff; top:0;}
	.headerH {height:100px;}
	
	/*gnb*/
	nav.mobile {visibility:hidden;}
	nav.pc {z-index:99; position:absolute; display:block; width:100%; overflow:hidden;}
	nav.pc:hover {border-bottom:0;/*box-shadow:0px 5px 5px rgba(0,0,0,.08) !important;*/}
	nav.pc .navbg {
		position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0);
		transition:all .3s ease !important; -webkit-transition:all .3s ease !important; -moz-transition:all .3s ease !important;
		
	}
	nav.pc.on .navbg {background:rgba(255,255,255,0.95); box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; }
	nav.pc .navbg .dep1 { display : none; position: absolute;
    width: 100%; height: 100px; }
	nav.pc.on .navbg .dep1 { display : block; border-bottom: 1px solid #ededef; transition : all 2s ease;}
	nav.pc .navbg .dep2 {position:absolute; height:100%; background-color:#fff;}

	nav.pc .wrap {z-index:1300; position:relative; display:block; max-width:1400px; height:100px; margin:0 auto;}

	nav.pc .gnb {/*padding-left:270px;*/ position:relative; width: 100%; max-width:1400px; max-width:100%; margin:0 auto; letter-spacing:0;}
	nav.pc .gnb a.on {color:#1165BA;}
	nav.pc .gnb > ul { display : flex; justify-content:flex-end; max-width:90%; margin:0 auto;
    padding-right:300px; padding-left:180px;}
	nav.pc .gnb>ul>li {position:relative; padding-top:32px;}
		nav.pc .gnb>ul>li>a {display:block; position : relative; color:#fff; font-weight:600; transform:rotate(0.03deg); transition:all 0.3s; border-radius:2rem;}
	nav.pc.sub .gnb>ul>li>a {color:#000;}
	nav.pc.on .gnb>ul>li>a:hover span {}
	nav.pc.on .gnb>ul>li.on>a, nav.pc.on .gnb>ul>li.on>a span {background:#1165BA; color:#fff!important;}
	nav.pc .gnb>ul>li>a:after { position: absolute; content:""; display: block; border-bottom: 3px solid #303241; transition: width 250ms ease-out; left: auto; right: 0; width: 0;}
	nav.pc .gnb>ul>li:hover>a {color:#fff!important; background:#1165BA;}
	
	/*nav.pc.on .gnb>ul>li.on>a:after{border-color:#000;}*/
	/* nav.pc .gnb>ul>li>a:hover {color:#fff;} */
	nav.pc .gnb>ul>li>ul {
		position:absolute; top:90px; left:0; width:100% !important; padding: 50px 0 50px 20px;
		transition:all .3s ease !important; -webkit-transition:all .3s ease !important; -moz-transition:all .3s ease !important;
	}
	nav.pc.on .gnb>ul>li>ul {top:80px;}
	nav.pc .gnb>ul>li>ul>li>a {position: relative;display: inline-block; color: #000; letter-spacing:-.5px; font-size:16px; transform:var(--textRotate);}
	nav.pc .gnb>ul>li>ul>li>a span {font-size:14px; color:#999; padding-left:5px;}
	nav.pc .gnb>ul>li>ul>li.on>a span {color:#1165BA;}
	nav.pc .gnb>ul>li>ul>li>a:hover {color:#1165BA!important;}
	nav.pc .gnb>ul>li>ul>li>a:hover span {color:#1165BA;}
	/*nav.pc .gnb>ul>li>ul>li>a:after { position: absolute; content:""; display: block; border-bottom: 2px solid #1165BA; transition: width 250ms ease-out; left: auto; right: 0; width: 0;}*/
	nav.pc .gnb>ul>li>ul>li>a:hover:before, nav.pc .gnb>ul>li>ul>li.on>a:before { position: absolute; content:""; display: block; width: 5px; height : 5px; border-radius:50%; left:-10px; top:40%; background:#1165BA!important }
	nav.pc .gnb>ul>li>ul>li>a:hover:after,
	nav.pc .gnb>ul>li>ul>li.on>a:after{width: 100%; left: 0; right: auto;}
	nav.pc .gnb>ul>li>ul>li+li a {margin-top:15px;}
	
	nav.pc .gnb>ul>li>ul>li.on a {color:#1165BA!important;}
	
	
	header .gnb_wrap h1.logo a img {height: 50px;}
	
	nav.pc .gnb a.loginBtn {position: absolute;
        top: 40px;
        right: 0;
        color: #fff;
        font-weight: 600;
        transform: var(--textRotate);}

	@keyframes wider {
	  from {transform:scaleX(0)}
	  to {transform:scaleX(1)}
	}

	.loca_ul {float:right !important; display:flex; color:#1d1d1d; font-size:15px; line-height:60px;}
	.loca_ul li {position:relative; margin-left:30px; }
	.loca_ul li:before {content:""; width:6px; height:10px; position:absolute; left:-17px; top:24px; background:url(/images/common/loca-arrow.png) no-repeat left center;}
	.loca_ul li:first-child:before {content:none;}
	.loca_ul img {margin-bottom:4px;}
	
	/* lnb */
	.lnb { height:146px; width:100%; top:0;
		/*background-attachment:fixed;*/ background-position:center top; background-repeat:no-repeat; background-size:cover; border-bottom:1px solid #ddd;
	}
	.lnb.on {margin-top:0; opacity:1;}
	.lnb .cover {position:absolute; left:0; top:0; right:0; bottom:0; background:rgba(0,0,0,.0); z-index : 2;}
	.lnb.on .cover {background:rgba(0,0,0,0);}
	.lnb-wrap {position:relative; height:100%;}
	.lnb-wrap > img { position : absolute; top:0; width : 100%; }
	.lnb .lnb-wrap:before {content:""; display:block; width:100%; height:5px; background:#91B696; position:absolute; top:0; }
	.lnb-wrap .titwrap { position : absolute; left : 50%; top :48%; transform : translate(-50%,-50%); z-index : 5;}
	.lnb-wrap .titwrap .tit { font-size:50px; font-weight:800; text-align : center; color : #fff;  }
	.lnb-wrap .titwrap .tit>p {line-height:1;}
	.lnb-menu {width:100%; z-index:99;}
	.lnb-menu.fixOn {position:fixed; top:0; box-shadow:0 5px 10px rgba(0,0,0,.1); background:#fff;}
	.lnb-menu.fixOn > .box {border-bottom:0;}
	.lnb-menu > .box {display:flex; position: relative; max-width: 1400px;
    margin: 0 auto; padding:50px 0 20px; justify-content:space-between; align-items:flex-end;}
	.lnb-menu > .box:before {content:""; display:block; width:150%; height:5px; background:#173288; position:absolute; left:0; top:0;}
	.lnb-menu > .box:after {display:none;}
	.lnb-menu .box .left {display:flex; position:relative;}
	.lnb-menu .box .left p {color:#000; font-size:30px; font-weight:400; text-align : center; transform:var(--textRotate); line-height:1; padding-right:65px; position:relative;}
	.lnb-menu .box .left p.on {position:absolute; top:50%; transform:translateY(-50%); color:#2145bf; font-size:26px; line-height:1;}
	.lnb-menu .box .left ul { display : flex; justify-content:center; gap:30px; }
	.lnb-menu.fixOn .box .left ul { margin-top : 0;}
	.lnb-menu .box .left .slogan {display:block; position:absolute; left:0; color:#666; font-size:14px; bottom:0; transform:var(--textRotate);}
	.lnb-menu .box .right .channel {display:flex; align-items:center;}
	.lnb-menu .box .right .channel li {font-size:14px; color:#333; font-weight:600; transform:var(--textRotate); line-height:1; }
	.lnb-menu .box .right .channel li:first-child {font-size:12px; text-transform:uppercase; border:1px solid #ddd; padding:8px 10px; border-radius:2rem;}
	.lnb-menu .box .right .channel li+li {padding-left:28px;}
	.lnb-menu .box .right .channel li+li:before {content:""; display:block; width:8px; height:16px; background:url(/images/common/arrow_right.png) no-repeat center; position:absolute; left:9px; top:-2px;}
	/*.lnb-menu .box a.lnb_gotop { display : none; text-align : center; top:50%; transform:translateY(-50%); color : #7c829d; font-weight : 400; background : url(/images/common/gotop_arrow.png) no-repeat 0 7px; padding : 0 20px; position: absolute;
    right: 0; }*/
	.lnb-menu.fixOn .box a.lnb_gotop { display : block; }
	.lnb-menu .box ul li+li:before {content:''; display:none; width:1px; height:12px; background:#b2b2b2; position:absolute; left:0; top:0;}
	.lnb-menu .box ul li a { line-height:1; display:block; color:#000; font-size:24px; font-weight : 800; transform:var(--textRotate);}
	.lnb-menu .box ul li.on a {color:var(--base); border-bottom:2px solid var(--base);}
	.lnb-menu.fixOn .box ul li a { border-radius : 0;}
	.lnb .site_loca { display : flex; justify-content : space-between; padding-top : 100px;} 
	.lnb .site_loca:after { content : ""; display : block; border-bottom : 1px solid #dfe1e9; width : 100%; position : absolute; bottom : -149px; left : 0; z-index : -1; }
	.lnb .site_loca p { font-size : 24px; font-weight : 800; color : #2145bf; padding-bottom : 10px; border-bottom : 1px solid #2145bf;}
	.lnb .site_loca ul { display : flex; position : relative; margin-top : 5px; }
	.lnb .site_loca ul:before { content : ""; display : block; width : 13px; height : 12px; background : url(/images/common/i-home.png) no-repeat; position : absolute; left : -20px; top : 4px; }
	.lnb .site_loca ul li { font-size : 14px; color : #7b8190; font-weight : 500; position : relative; transform: rotate(0.03deg);}
	.lnb .site_loca ul li:nth-child(1) { margin-right : 35px;  }
	.lnb .site_loca ul li:nth-child(1):after { content : ""; display : block; width : 6px; height : 10px; position : absolute; background : url(/images/common/site_arrow.png) no-repeat; right : -21px; top : 6px; }
	
	/* lnb-bar */
	.lnb-bar {position:absolute; top:215px; left:0; width:100%; height:60px; z-index:99;}
	.lnb-bar .lnb-wrap {display:flex; align-items:center; position:relative; height:100%; width: 100%; max-width : 1400px; margin : 0 auto; background:#fff; border-radius:3rem; overflow: hidden; border:1px solid #ddd; box-shadow:rgba(100, 100, 111, 0.2) 0px 5px 4px}
	/*.lnb .lnb-wrap>* {float:left;}*/
	.lnb-bar .lnb-wrap:after {clear:both; content:''; display:block;}
	.lnb-bar .lnb-wrap a {font-size:16px; color:#000;}
	.lnb-bar .lnb-wrap h3 {background:var(--green); color:#fff; font-weight:500; height:100%; padding:20px 30px; box-sizing:border-box; font-size:18px;}
	.lnb-bar .lnb-wrap .home {display:block; width:20px; height:100%; font-weight:300; background:url(../images/common/i-home.png)center no-repeat; margin-right: 20px;}	
	.lnb-bar .lnb-wrap .lnb-depth {position:relative; padding:0 50px;}
	.lnb-bar .lnb-wrap .lnb-depth .onmenu {display:block; font-size:16px; font-weight:400; color:#000; cursor:pointer; line-height:60px; background:url(../images/common/lnb_arrow.png)100% center no-repeat}
	.lnb-bar .lnb-wrap .lnb-depth.dep2 .onmenu { color : var(--base); background:url(../images/common/lnb_arrow2.png)100% center no-repeat; }
	.lnb-bar .lnb-wrap .lnb-depth>ul {display:flex; width:100%; gap:60px;}
	.lnb-bar .lnb-wrap .lnb-depth>ul li{position:relative;}
	.lnb-bar .lnb-wrap .lnb-depth>ul li+li:before {content:""; display:block; width:2px; height:20px; border-radius:50%; background:#ddd; position:absolute; left:-30px; top:50%; transform:translateY(-50%);}
	.lnb-bar .lnb-wrap .lnb-depth>ul li:last-child {border-bottom:none;}
	.lnb-bar .lnb-wrap .lnb-depth>ul li a {display:block; padding:7.5px 0; font-weight:500; color:#000; text-align:center; font-weight:600; transform:var(--textRotate);}
	.lnb-bar .lnb-wrap .lnb-depth>ul li:hover a { color : #1165BA; }
	.lnb-bar .lnb-wrap .lnb-depth>ul li.on a {position:relative; color:#1165BA;}
	.lnb-bar .lnb-wrap .lnb-depth>ul li.on a:after {content:""; display:block; position:absolute; width:100%; height:2px; background:#1165BA;}
	.lnb-bar .lnb-wrap .lnb-depth.on>ul { display:block;}
	.lnb-bar #gotop {position:absolute; right:16px; top:6px; display:block; width:44px; height:44px; font-size : 12px; background:url(/images/icon/i-gotop.png) no-repeat center top 16px; text-align : center; opacity:1 !important;
	font-weight : 500; color:#fff; text-indent:-9999px;}

	.lnb-bar.fixOn {position:fixed; width:100%; z-index:1000 !important; top:0 !important; box-shadow:rgba(100, 100, 111, 0.2) 0px 5px 4px; background:#fff;}
	.lnb-bar.fixOn .lnb-wrap {border-radius:0; box-shadow:none; border:0;}

	/* footer::롤링배너 */
	.footRoll {display:flex; align-items: center; padding:30px 0; height:125px; background:#fff; border-top:1px solid #eaeaea; border-bottom:1px solid #eaeaea;}
	.rollArea {position:relative; width:1400px; margin:0 auto; line-height: 35px; font-weight:600; color:#000; font-size:14px;}
	.rollWrap {width:1340px; overflow:hidden; float: right;}
	.rollWrap ul {width:8200px;}
	.rollWrap ul li {display:inline-block; padding:0 70px; text-align:center; position:relative; z-index:2;}
	.rollWrap ul li a {display:block;}
	.rollWrap ul li a img {width:100%; max-height:40px;}
	.rollBtn {display:flex; justify-content: space-between; position:absolute; top:0; width:100%;}
	.rollBtn a {display:block; width:35px; height:35px; background:url(/images/common/i-arrow-w.png)center no-repeat;}
	.rollBtn a.prev {}
	.rollBtn a.next {background-image:url(/images/common/i-arrow-w.png); transform: rotate(180deg);}
	
		
	footer {width:100vw; background:#fff;padding:29px 0;}
	footer .footer_logo {}
	footer .left {display:flex; align-items:center; gap:40px;}
	footer .footer_logo a{display:block;}
	footer .footer_logo p {font-size:16px; font-weight:600; transform:var(--textRotate); color:#fff;}
	footer address{font-size:14px;color:#000; display: flex; flex-direction: column; align-items: flex-start; letter-spacing: 0px; line-height:1.5;}
	footer address>*{font-size:inherit;}
	footer .left address p span {margin-right:20px;}
	footer .left address p span a {color:#000;}
	footer .ft_bx {position:relative; width:90%; margin:0 auto; display:flex; gap:20px; justify-content:space-between;}
	footer .ft_bx .termWrap {text-align:left;}
	footer .ft_bx .termWrap a {color:#000; font-weight:600; display:inline-block; transform:var(--textRotate); font-size:14px;}
	footer .ft_bx .termWrap a+a {padding-left:40px;}
	footer .ft_bx .termWrap a+a:before {content:""; width:1px; height:14px; background:#fff; opacity:0.5; position:absolute; left:18px; top:5px;}
	footer .f-gotop {display:none;}
    footer .footer_logo a img {height:40px;}
	footer .right {text-align:left; display:flex; gap:20px; align-items:center;}
	footer .right .info {color:#fff;}
	footer .right .info dl {display:flex; gap:30px; line-height:1; margin-bottom:7px;}

	footer .right .info dl dt {font-size:24px; font-weight:600; transform:var(--textRotate);}
	footer .right .info dl dt img {width:25px; margin-right:10px;}
	footer .right .info dl dd {font-size:24px; font-weight:600;}
	footer .right .info span {display:inline-block; position:relative;}
	footer .right .info span+span {padding-left:30px;}
	footer .right .info span+span:before {content:""; display:block; height:15px; width:1px; background:#fff; position:absolute; left:15px; top:6px;}
	footer .right .linkWrap a {display:inline-block; background:#fff; color:#000; padding:5px 30px 5px 15px; border-radius:10px; font-weight:600; transform:var(--textRotate); background:#fff url(/images/common/i-arrow_rightB.png) no-repeat 85% center / 6px;}
	footer .right .linkWrap a+a {margin-left:5px;}
	
	
}

/* ************************ 태블릿 이하(~1399) ************************ */
@media (max-width: 1399px) {
	html,body {width:100%;}
	.pc {display:none !important;}
	
	.gnb>ul>li>ul {display:none;}
	nav .gnb>ul>li {min-height:auto;}

    .gotop {width: 55px; height: 55px; bottom: 20px;}
	

	/*헤더*/
	header {position:absolute; left:0; top:0; width:100%; z-index:999; height:60px; background:ease-gradient(to bottom, rgba(0,0,0,.7), transparent);}
	header .head {}
	header .head .gnbView {position:absolute; right:10px; top:0; width:60px; height:60px; background:url(/images/common/i-menu.png)center /22px no-repeat ;}
	header .head.sub .gnbView {background:url(/images/common/i-menuGray.png)center /22px no-repeat ;}
	header .head .gnbView img {}
	header .head h1 {display:inline-block;}
	header .head h1 a {height:60px; display:flex; align-items:center; padding-left:15px;}
	header .head h1 a img {height:40px;}
	.headerH {height:60px;}
	
	/*gnb*/
	nav.mobile {z-index:9999; position:fixed; top:0; width:50%; min-width:320px; height:100%; overflow:hidden; box-shadow:0 !important; background:#fff;}
	nav.mobile .closeWrap {position:relative; height:60px;border-bottom: 1px solid rgba(0,0,0,.15); overflow:hidden; font-weight : 500;}
	nav.mobile .closeWrap .gnbClose {display:block; width:60px; height:60px; background:url(/images/common/i-close.png) center no-repeat; background-size:20px; border-left:1px solid rgba(0,0,0,.15); float:right;}
	nav.mobile .closeWrap .loginBtn {display:block; position:absolute; color:#000; font-weight:600; transform:var(--textRotate); transform:var(--textRotate) translateY(-50%); top:50%;
    left:20px;}
    nav.mobile .closeWrap .lang {display:flex; position:absolute; left:160px; top:50%; transform:translateY(-50%);}
	nav.mobile .closeWrap .lang a {display:inline-block; font-size:12px; color:#fff; color:#1a2e4d; padding:3px 10px; font-weight:800; transform:var(--textRotate); border:2px solid #1a2e4d;}
	nav.mobile .closeWrap .lang a.kor {border-radius:5px 0 0 5px;}
	nav.mobile .closeWrap .lang a.eng {border-radius:0 5px 5px 0;}
	nav.mobile .closeWrap .lang a.on {background:#1a2e4d; color:#fff;}
	nav.mobile .closeWrap .lang a.kor.on {border-right:0;}
	nav.mobile .closeWrap .lang a.eng.on {border-left:0;}
	nav.mobile .closeWrap .link {float:left; padding:0 20px;line-height:60px; font-size:12px;}
	nav.mobile .closeWrap .link+.link {padding-left:0;}
	.gnbCover {z-index:9998; position:fixed; left:0; top:0; display:none; width:100%; height:100%; background:rgba(0,0,0,.5);}

	nav.mobile .gnb {position:relative; width:100%; height:100%; overflow-y:auto; text-align:left !important; font-weight : 400;}
	nav.mobile .gnb * {width:100% !important;}
	/* nav.mobile .gnb .home {display:block; width:100%; background-color:#f0f0f0; padding:12px 20px; border-bottom:1px solid #333;} */
	nav.mobile .gnb>ul>li {clear:both; position:relative; border-bottom:1px solid #e5e5e5;}
	nav.mobile .gnb>ul>li>a {display:block; padding:15px; font-size:17px; transform: var(--textRotate); color:#000; font-weight:600;}
	nav.mobile .gnb>ul>li>a span {font-size:14px; color:#999; padding-left:5px;}
	nav.mobile .gnb>ul>li.on {border-color:#1165BA;}
	nav.mobile .gnb>ul>li.on>a {background:#1165BA; color:#fff;}
	nav.mobile .gnb>ul>li.on>a span {color:#fff;}
	nav.mobile .gnb>ul>li>ul {display:none;}
	nav.mobile .gnb>ul>li>ul>li {position:relative;border-top: 1px solid #eee;}
	nav.mobile .gnb>ul>li>ul>li a {display:block; padding:15px 30px; font-size:16px; color:#000; letter-spacing:-.8px;background:#fff; position:relative; transform:var(--textRotate);}
	nav.mobile .gnb>ul>li>ul>li.on a:before {content:""; display:block; width:5px; height:5px; background:#1165BA; border-radius:50%; position:absolute; top:26px; left:18px; }
	nav.mobile .gnb>ul>li>ul>li a span {font-size:14px; color:#999; padding-left:5px;}
	nav.mobile .gnb>ul>li>ul>li:last-child a {border-color:#e0e0e0;}
	nav.mobile .gnb>ul>li>ul>li a:hover {color:#000; background-color:#f5f5f5;}
	nav.mobile .gnb>ul>li>ul>li.on a {color:#1165BA;}
	nav.mobile .gnb>ul>li>ul>li.on a span {color:#1165BA;}
	nav.mobile .gnb>.side {display:none;}


	.lnb {width:100%; /*background-attachment:fixed;*/ background-position:center top; background-repeat:no-repeat; background-size:cover;}
	.lnb-wrap {position:relative; height:100%; }
	.lnb-wrap:before {content:""; display:block; width:100%; height:5px; background:#173288; position:absolute; top:0;}
	.lnb-wrap:after {content:""; display:block; width:170px; height:5px; background:#91B696; position:absolute; top:0; left:0;}
	.lnb-menu > .box {display:flex; position:relative; margin:0 auto; padding:30px 30px 20px; justify-content:space-between; align-items:center; border-bottom: 1px solid #ddd;         flex-wrap:wrap; row-gap:10px;}
	.lnb-menu > .box:before, .lnb-menu > .box:after {display:none;}
	.lnb-menu .box .left {display:flex; position:relative;}
	.lnb-menu .box .left p {color:#000; font-size:24px; font-weight:400; text-align:left; transform:var(--textRotate); line-height:1; position:relative;}
	.lnb-menu .box .left p.on {position:absolute; top:50%; transform:translateY(-50%); color:#2145bf; font-size:26px; line-height:1;}
	.lnb-menu .box .left ul { display : flex; justify-content:center; gap:30px; }
	.lnb-menu.fixOn .box .left ul { margin-top : 0;}
	.lnb-menu .box .left .slogan {display:block; position:absolute; left:0; color:#666; font-size:14px; bottom:0; transform:var(--textRotate);}
	.lnb-menu .box .right .channel {display:flex; align-items:center; flex-wrap:wrap; row-gap:10px;}
	.lnb-menu .box .right .channel li {font-size:14px; color:#333; font-weight:600; transform:var(--textRotate); line-height:1; }
	.lnb-menu .box .right .channel li:first-child {font-size:12px; text-transform:uppercase; border:1px solid #ddd; padding:8px 10px; border-radius:2rem;}
	.lnb-menu .box .right .channel li+li {padding-left:28px;}
	.lnb-menu .box .right .channel li+li:before {content:""; display:block; width:8px; height:16px; background:url(/images/common/arrow_right.png) no-repeat center; position:absolute; left:9px; top:-2px;}
	
	
	/* 컨텐츠 */
	.contents_box {border-radius: 50px 50px 0 0; padding:80px 30px;}
	.contents_box.mapcase {padding:80px 0;}
	.contents_box.mapcase .cont-inner {padding:0 30px;}
	.contents_box.calcul_sub {padding:0px 30px;}
	.contents_box.calcul_sub .sub-inner {padding:20px 0 80px;}
	.contents {padding-top:330px !important;padding-bottom:50px !important;}
    .sub-visual {position: relative;width:100%; height: 330px; position: absolute; top: 0; left: 0; z-index: -1; display: flex; align-items: center; justify-content: center; text-align: center;}
    .sub-visual .cover {position: absolute; top: 0; left: 0; width:100%; height: 100%; background: rgba(0,0,0,.4);}
    .sub-visual.intro {background: #000 url(/images/include/lnb-intro.jpg) center top -230px no-repeat; background-size: cover; background-repeat: no-repeat; background-position: center;}
    .sub-visual.business {background: #000 url(/images/include/lnb-business.jpg) center top -230px no-repeat; background-size: cover; background-repeat: no-repeat; background-position: center;}
    .sub-visual.perform {background: #000 url(/images/include/lnb-perform.jpg) center top -230px no-repeat; background-size: cover; background-repeat: no-repeat; background-position: center;}
    .sub-visual.contact {background: #000 url(/images/include/lnb-contact.jpg) center top -230px no-repeat; background-size: cover; background-repeat: no-repeat; background-position: center;}
    .sub-visual-wrap {color: #fff; position: relative; margin-top: 50px;}
    .sub-visual-text h2 {
        font-size: 50px;
        margin-bottom: 25px;
        font-weight: 600;
    }
    .sub-visual-text p {
        line-height: 1.3;
    }

	/* footer::롤링배너 */
	.footRoll {padding:20px; height:80px; background:#fff; border-top:1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5;}
	.rollArea {position:relative; width:100%; font-size:14px; display:flex; align-items: center;}
	.rollArea span {display:block; margin-right:10px;}
	.rollWrap {overflow:hidden;}
	.rollWrap ul {width:3000px;}
	.rollWrap ul li {display:inline-block; padding:0 20px; text-align:center;}
	.rollWrap ul li a {display:block;}
	.rollWrap ul li a img {height:30px;}
	.rollBtn {display: flex;}
	.rollBtn a {display:block; width:35px; height:35px; /*position:absolute; top:0;*/ background:url(/images/common/i-arrow-w.png)center no-repeat;}
	.rollBtn a.prev {margin-right:5px;}
	.rollBtn a.next {/*left:40px;*/ background-image:url(/images/common/i-arrow-w.png); transform: rotate(180deg);}
	
	
	footer{background:#fff;text-align:center;padding:30px;text-align:left; width:100%;}
	footer .footer_logo{margin-bottom: 10px;}
	footer .footer_logo a{display:block;}
    footer .footer_logo a img {height:40px;}
	footer address{color:#000; font-size: 14px; margin-top:10px!important;}
	footer address a b {color:#fff;}
    footer address p span a {color:#fff;}
	footer address>*{font-size:inherit;}
	footer .ft_bx {position:relative; display:flex; flex-direction:column; gap:10px;}
	footer .ft_bx .left {}
	footer .ft_bx .left .footer_logo {display:flex; align-items:center; gap:25px;}
	footer .ft_bx .left .footer_logo p {color:#fff; font-size:16px; font-weight:600; transform:var(--textRotate);}
	footer .f-gotop {display:none;}
	footer .right {display:flex; align-items:center; flex-wrap:wrap; gap:20px; row-gap:10px;}
	footer .right a {display:inline-block; color:#000; font-weight:600; transform:var(--textRotate); font-size:14px;}
	footer .ft_bx .termWrap a {color:#000; font-weight: 600; display:inline-block; transform:var(--textRotate); font-size: 14px;}
	footer .ft_bx .termWrap a+a {padding-left:40px;}
	footer .ft_bx .termWrap a+a:before {content:""; width:1px; height:14px; background:#fff; opacity:0.5; position:absolute; left:18px; top:5px;}
	footer .right .info dl {color:#fff; display:flex; gap:30px;}
	footer .right .info dl dt {font-size:20px; font-weight:600; transform:var(--textRotate);}
	footer .right .info dl dt img {width:30px; margin-right:10px;}
	footer .right .info dl dd {font-weight:600; font-size:20px; transform:var(--textRotate);}
	footer .right .info span {color:#fff; display:inline-block;}
	footer .right .info span+span {padding-left:20px; position:relative;}
	footer .right .info span+span:before {content:""; position:absolute; height:15px; width:1px; background:#fff; top:7px; left:9px;}
	footer .right .linkWrap {margin-top:5px;}
	footer .right .linkWrap a {display:inline-block; background:#fff; color:#000; padding:5px 30px 5px 15px; border-radius:10px; font-weight:600; transform:var(--textRotate); background:#fff url(/images/common/i-arrow_rightB.png) no-repeat 85% center / 6px;}
	footer .right .linkWrap a+a {margin-left:5px;}
	
	/* 서브페이지 상단 제목  */
	.lnb-wrap .titwrap { position : absolute; left : 50%; top :48%; transform : translate(-50%,-50%); z-index : 5;}
	.lnb-wrap .titwrap .tit {font-size:30px; font-weight:800; text-align : center; color : #fff; transform:var(--textRotate); }
	.lnb-wrap .titwrap .tit>p {line-height:1;}
	.contents_box .sub-inner {padding:0;}
	.contline {border-top:1px solid var(--border2);}
	.contents_box .subTit {border-bottom:0;}
	.contents_box .subTit h2 {font-size:24px;}
	.contents_box .subTit h2:before {height:22px;}
    
	.gotop {right:20px;}
	.gotop a {display:inline-block; text-indent:-999999px;}
	
	/* 로그인 팝업 */
	.loginPopup {display:none; position:fixed; left:50%; top:50%; transform:translate(-50%, -50%); width:300px; padding:20px; background-color:#fff;
    box-shadow:0 0 10px rgba(0, 0, 0, 0.5); z-index:99999; border-radius:1.5rem;}
	.popupOverlay {display:none; position:fixed; left:0; top:0; width:100%; height:100%;
    background-color: rgba(0, 0, 0, 0.5); z-index: 9999;}
	
	.loginPopup h3 {text-align:center; padding-bottom:15px; transform:var(--textRotate);}
	.loginPopup form label {display:none;}
	.loginPopup form > div+div {margin-top:10px;}
	.loginPopup form input {height: 40px; width:100%; border: 1px solid var(--border1);
    border-radius: 10px; padding: 0 10px;}
	.loginPopup form input::placeholder {font-size:14px; color:#000;}
	.loginPopup form button {height: 40px; width:100%; border-radius: 10px; background: var(--blue2); font-size: 14px; color:#fff; cursor:pointer; margin-top:10px;}
	
	
}

/* ************************ 모바일 ************************ */
@media (max-width: 767px) {
	html {font-size:58.5936%;}

	.lnb {}
	header .gnb_wrap h1.logo a img {height:40px;}
	.contents_box {border-radius:30px 30px 0 0;}
	.lnb-wrap .titwrap .tit {font-size:24px;}
	
    .contents {overflow: hidden; padding:0 20px; padding-top:240px !important; padding-bottom: 60px !important;}
    .sub-visual {height: 240px;}
    .sub-visual-text h2 {font-size: 33px; margin-bottom: 10px;}
    .sub-visual-text p {font-size: 14px;}

    footer address span {display: block;}
	.contents_box {padding:50px 30px;}
	.contents_box.mapcase {padding:50px 0;}
    .contents_box .subTit {flex-wrap: wrap; gap:20px;}
    .contents_box .subTit h2 {font-size:20px; width: 100%; order: 1;}
	.contents_box .subTit h2:before {height:19px;}
	.contents_box .subTit .channel {width: 100%; justify-content:flex-end; flex-wrap:wrap;}
	.contents_box .subTit .channel li+li {padding-left: 25px;}
	.contents_box .subTit .channel li+li:before {left:10px;}
	.contents_box.calcul_sub {padding:0px 20px 50px;}
	.contents_box.calcul_sub .sub-inner {padding:20px 0 0px;}
	
	.layer.login_pop .wrap {padding:30px 20px;}
	.layer.login_pop .wrap.step1 {padding:50px 20px;}
	.layer.login_pop .wrap.step1 button.close {top:10px;}
	header .gnb_wrap .layer.login_pop { }
	.layer.login_pop .inputWrap form {height:55vh; overflow:auto; padding:10px;}
}

/* ************************ 모바일 ************************ */
@media (max-width: 500px) { 
.contents_box {padding:40px 20px;}
.contents_box.mapcase {padding:40px 0;}
.contents_box.mapcase .cont-inner {padding:0 20px;}
.lnb-menu > .box {display:block; padding:25px 20px 15px;}
.lnb-menu .box .right {margin-top:10px;}
.layer.login_pop .inputWrap form fieldset.flex label {width:70px;}
.layer.login_pop .inputWrap form fieldset.flex input, .layer.login_pop .inputWrap form fieldset.flex select {width: calc(100% - 80px);}
.layer.login_pop .term_wrap .inner {height:120px;}
nav.mobile .closeWrap .lang {left:140px;} 
}