@charset "utf-8";

/* ************************* 레이아웃 정의 ***************************** */
.sub-visual {position:fixed; width:100%; height:700px; top:0;}

.contents .part1 {text-align:center; height:100vh; position:relative; padding-top:130px; transition:all 1s ease;}
.contents .sub-toptext {display:flex; flex-direction:column; justify-content:center; align-items:center; height:calc(100% - 85px);}

.sub-visual .sub-visual-wrap { position :absolute; display:table; width:1400px; height:100%; left :50%; transform :translateX(-50%); }
.sub-visual .sub-visual-text {display:flex; flex-direction:column; justify-content:center; height:100%;}
.sub-visual .sub-visual-text h2 {font-size:40px; padding-top:0px; font-weight:600; letter-spacing:-.5px; color:#000; text-align :center; z-index :5;}

.sub-top-visual {z-index:-1; position:fixed; width:100%; height:100vh; top:0; left:0; background-size:cover; background-repeat:norepeat; transform:scale(1.2); transition:all 2s ease !important;}
.sub-top-visual.active {transform:scale(1);}
.sub-top-visual .cover {position:absolute; background:rgba(0,0,0,0.7); width:100%; height:100%; }
.sub-top-visual.association .cover {background:rgba(0,0,0,0.5);}
.sub-top-visual.company {background:url(/assets/user/images/common/bg_hompage_company.webp); background-position:50%;}
.sub-top-visual.welfare {background:url(/assets/user/images/common/bg_hompage_welfare.webp);}
.sub-top-visual.association {background:url(/assets/user/images/common/bg_hompage_association.webp); background-position:top;}
.sub-top-visual.card .cover {background:rgba(0,0,0,0.5);}
.sub-top-visual.lab {background:url(/assets/user/images/common/bg_hompage_lab.webp); background-position:top;}
.sub-top-visual.kids {background:url(/assets/user/images/common/bg_hompage_kids.webp); background-position:20%;}
.sub-top-visual.shop {background:url(/assets/user/images/common/bg_hompage_shop.webp); background-position:top;}
.sub-top-visual.dev {background:url(/assets/user/images/common/bg_hompage_dev.webp); background-position:50%;}
.sub-top-visual.brochure {background:url(/assets/user/images/common/bg_print_brochure.webp); background-position:right top;}
.sub-top-visual.catalog {background:url(/assets/user/images/common/bg_print_catalog.webp); background-position:top;}
.sub-top-visual.card {background:url(/assets/user/images/common/bg_print_card.webp); background-position:top;}
.sub-top-visual.domain {background:url(/assets/user/images/common/bg_service_domain.webp); background-position:top;}
.sub-top-visual.domain .cover {background:rgba(0,0,0,0.6);}
.sub-top-visual.hosting {background:url(/assets/user/images/common/bg_service_hosting.webp); background-position:top;}
.sub-top-visual.hosting .cover {background:rgba(0,0,0,0.5);}
.sub-top-visual.ebook {background:url(/assets/user/images/common/bg_service_ebook.webp); background-position:top;}
.sub-top-visual.ebook .cover {background:rgba(0,0,0,0.6);}
.sub-top-visual.customer {background:url(/assets/user/images/common/bg_customer_inquiry.webp); background-position:top;}
.sub-top-visual.about {background:url(/assets/user/images/common/bg_intro.webp); background-position:top;}
.sub-top-visual.about .cover {background:rgba(0,0,0,0.6);}

.sub-toptext {}
.sub-toptext h1 {color:#fff; text-align:center; font-size:64px; line-height:1.1;}
.sub-toptext > p.sub-tit {font-size:64px; line-height:1.1; color:#fff; font-weight:700; margin-top:0;}
.sub-toptext > p.sub-tit .empha {color:var(--base4);}
.sub-toptext > p {font-size:17px; font-weight:500; color:rgba(255,255,255,0.5); text-align:center; position:relative; margin-top:30px;}
.site-route {display:flex; justify-content:space-between; align-items:center; color:#fff; height:85px; transform:scale(.9); transition:1s ease; opacity:0;}
.site-route.active {transform:scale(1); opacity:1;}
.site-route>p {font-weight:700; font-size:24px; position:relative; height:100%; display:flex; align-items:center; justify-content:center; border-top:5px solid var(--base1); box-sizing:border-box;}
.site-route ul {display:flex; align-items:center; font-size:12px; font-weight:300;}
.site-route ul li {position:relative;}
.site-route ul li:first-child {}
.site-route ul li img {transform:translateY(-2px)}
.site-route ul li+li {padding-left:35px;}
.site-route ul li+li:before {content:""; display:block; width:1px; height:8px;  position:absolute; top:5px; left:16px; background:rgba(255,255,255,0.5); transform:rotate(-45deg);}
.contents .site-routeWrap {border-top:1px solid rgba(255,255,255,0.15); position:absolute;
    width:100%; bottom:0;}

.black_header_Bg {height:120px; background:#000;}

/*footer*/
footer {position:relative; padding:100px 0 70px; background:var(--bg1); color:#666; font-size:14px; z-index:5; font-weight:600; border-top:1px solid var(--border1);}
footer .f_btnWrap {display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
footer .f_btnWrap article {color:#fff; padding:50px; border-radius:20px; display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between;}

footer .f_btnWrap article dt {font-size:32px;}
footer .f_btnWrap article dd {opacity:0.7; margin-top:10px; font-weight:300; font-size:17px;}
footer .f_btnWrap article:nth-child(1) {background:var(--blue) url(/assets/user/images/common/footer_btn_icon01.svg) no-repeat 90% 80% / 60px;}
footer .f_btnWrap article:nth-child(2) {background:var(--blue2) url(/assets/user/images/common/footer_btn_icon02.svg) no-repeat 90% 78% / 60px;}
footer .f_btnWrap article:nth-child(3) {background:var(--base2) url(/assets/user/images/common/footer_btn_icon03.svg) no-repeat 88% 78% / 36px;}
footer .f_btnWrap article .white_btn {display:inline-block; padding:15px 40px; background:#fff; color:#000; font-size:17px; font-weight:400; border-radius:10px; margin-top:15px; transition:all 0.2s;}
footer .f_btnWrap article .white_btn:hover {background:var(--base4); color:#000;}
footer .footer-info {margin-top:50px;}
footer .footer-info .top {display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:20px;}
footer .footer-info .top .logoWrap {display:flex; align-items:center; gap:50px; flex-wrap:wrap;
row-gap:15px;}
footer .footer-info .top .logoWrap img {width:194px;}
footer .footer-info .top .logoWrap > div {display:flex;}
footer .footer-info .top .logoWrap a {color:var(--base2); font-weight:500; font-size:16px;}
footer .footer-info .top .logoWrap .privacy_btn {color:var(--base2); font-weight:500; font-size:16px; position:relative;}
footer .footer-info .top .logoWrap .privacy_btn {padding-left:20px; margin-left:20px; background:transparent;}
footer .footer-info .top .logoWrap .privacy_btn:before {content:""; display:block; width:1px; height:12px; background:var(--border); position:absolute; left:0; top:7px;}
footer .footer-info .top .callnum {display:flex; gap:15px; align-items:center; color:var(--base2);}
footer .footer-info .top .callnum p {font-size:17px;}
footer .footer-info .top .callnum a {font-size:40px; font-weight:700; line-height:1;}
footer .footer-info .top .callnum .icon {display:block; width:50px; height:50px; border-radius:50%; background:var(--base1) url(/assets/user/images/common/i-callW.png) no-repeat center;}
footer .footer-info .bottom {margin-top:30px; font-size:15px;}
footer .footer-info .bottom ul:first-child {display:flex;}
footer .footer-info .bottom ul:first-child li {position:relative; }
footer .footer-info .bottom ul:first-child li a {color:var(--base1); font-weight:500;}
footer .footer-info .bottom ul:first-child li+li {margin-left:20px; padding-left:20px;}
footer .footer-info .bottom ul:first-child li+li:before {content:""; display:block; width:1px; height:12px; background:var(--border); position:absolute; left:0; top:7px;}
footer .footer-info .bottom li {font-weight:400; color:var(--gray1);}
footer .footer-info .bottom li strong {font-weight:500; color:var(--base2); padding-right:10px;}
footer .footer-info .bottom > p {margin-top:20px; font-size:15px; font-weight:400; color:var(--gray1);}
footer .footer-info .bottom ul:nth-child(2) li strong {padding-right:10px;}
footer .footer-info address {display:flex; flex-direction:column; font-weight:400; color: var(--gray1);}
footer .footer-info address strong {padding-right:10px; font-weight:500; color:var(--base2);}
footer .footer-info address+small {color: var(--gray1);}
footer .footer-info .bottom_toggle {display:none;} 


/* 개인정보취급방침 팝업 */ 
.privacyPopup {display:none; position:fixed; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; max-width:700px; padding:30px!important; background-color:#fff; z-index:99999; border-radius:20px; text-align:left; overflow:hidden; box-sizing:border-box;}
.privacyPopOverlay {display:none; position:fixed; left:0; top:0; width:100%; height:100%;
background-color:rgba(0, 0, 0, 0.5); z-index:9999;}
.privacyPopup .closeBtn {position:absolute; right:25px; top:25px; font-weight:800; font-size:18px; z-index:99; background:url(/assets/user/images/common/icon_close.png) no-repeat center / 20px; width:25px; height:25px;}
.privacyPopup .txt {display:block; word-break:keep-all; color:#000; transform:var(--textRotate);}
.privacyPopup .txt h3 {font-size:24px; margin-bottom:20px;}
.privacyPopup .txt pre {background:#fff; font-family:'Pretendard'; padding-right:15px;} 
.privacyPopup .term_bx {border:1px solid #e5e5e5; padding:20px; border-radius:10px; background:#fff; padding-right:15px;}
.privacyPopup .inner_scroll {height:200px; overflow:auto;}


/* ************************ 데스크탑 (1249~) ************************ */
@media screen and (min-width:1249px), print {

	html,body {min-width:1200px;}
	.mobile {display:none !important;}
	
	
	/*헤더**/
	header {z-index:999; position:absolute; width:100%; min-width:1200px; top:0; left:0; height:120px; background:ease-gradient(to bottom, rgba(0,0,0,.7), transparent); transform:scale(.9); transition:1s ease; opacity:0;}
	header.active {transform:scale(1); opacity:1;}
	header .head {width:90vw; margin:0 auto; position:relative;}
	header .head a.logo {position:absolute; z-index:99999; left:0; top:45px;}
	header .head h1 a {}
	header .head h1 a img {}

	header aside {position:absolute; right:0; top:36px; z-index:999; overflow:hidden;}
	header aside>* {float:left;}
	header aside .lang {}
	header aside .lang>a {padding-right:27px; font-size:12px; display:block; background:url(/assets/user/images/common/lang_arrow.png)100% 50% no-repeat; color:#fff;}
	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 aside .sideBtn {display:flex; gap:10px; overflow:hidden;}
	header aside .sideBtn a.inquire {display:inline-block; background-color:var(--base1); width:140px; height:50px; text-align:center; line-height:50px; color:#fff; border-radius:3rem;}
	header aside .sideBtn a.call {display:flex;
	  justify-content:flex-start;
	  align-items:center;
	  width:50px;
	  height:50px;
	  border-radius:3rem;
	  background-color:#fff;
	  position:relative;
	  overflow:hidden;
	  transition:width 0.5s ease;
	  padding:0 14px;
	  box-shadow:0 2px 5px rgba(0,0,0,0.1);
	}
	header aside .sideBtn a.call img {width:24px; height:24px; transition:transform 0.3s;}
	header aside .sideBtn a.call .call-number {
	  white-space:nowrap;
	  margin-left:10px;
	  opacity:0;
	  transition:opacity 0.3s ease;
	  font-size:17px;
	  color:#333;
	  font-weight:500;
	}
	header aside .sideBtn a.call:hover {width:150px;}
	header aside .sideBtn a.call:hover .call-number {opacity:1;}

	/*gnb*/
	nav.mobile {visibility:hidden;}
	nav.pc {z-index:99; position:absolute; display:block; width:100%; overflow:hidden; height:120px;}
	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,1); }
	nav.pc .navbg .dep1 { display :none; position:absolute;
    width:100%; height:120px; }
	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:120px; margin:0 auto;}

	nav.pc .gnb {position:relative; width:100%; max-width:90vw; margin:0 auto; letter-spacing:0;}
	nav.pc .gnb a.on {color:var(--blue);}
	nav.pc .gnb > ul { display:flex; justify-content:center;  }
	nav.pc .gnb>ul>li {position:relative; padding-top:45px; padding-right:3.2vw;}
	nav.pc .gnb>ul>li:last-child {padding-right:0!important;}
	nav.pc .gnb>ul>li>a {display:block; position :relative; color:#fff; font-size:22px; font-weight:600;}
	nav.pc.sub .gnb>ul>li>a {color:#fff;}
	nav.pc .gnb>ul>li>a span {font-size:14px; font-weight:400; padding-left:5px;}
	nav.pc.on .gnb>ul>li>a span {color:#999;}
	nav.pc.on .gnb>ul>li>a:hover span {color:var(--base1);}
	nav.pc.on .gnb>ul>li.on>a, nav.pc.on .gnb>ul>li.on>a span {color:var(--base1)!important;}
	nav.pc .gnb>ul>li>a:after { position:absolute; content:""; display:block; border-bottom:3px solid var(--blue); transition:width 250ms ease-out; left:auto; right:0; width:0;}
	nav.pc .gnb>ul>li>a:hover {color:var(--base1)!important;}
	
	
	/*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:70px 0;
		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:90px;}
	nav.pc .gnb>ul>li>ul>li>a {position:relative;display:inline-block; color:#333; letter-spacing:-.5px; white-space:nowrap;}
	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:var(--base1);}
	nav.pc .gnb>ul>li>ul>li>a:hover {color:var(--base1)!important;}
	nav.pc .gnb>ul>li>ul>li>a:hover span {color:var(--base1);}
	nav.pc .gnb>ul>li>ul>li>a:after { position:absolute; content:""; display:block; border-bottom:1px solid var(--base1); transition:width 250ms ease-out; left:auto; right:0; width:0;}
	nav.pc .gnb>ul>li>ul>li+li a {margin-top:12px;}	
	nav.pc .gnb>ul>li>ul>li.on a {color:var(--base1)!important;}
	
	@keyframes wide {
	  from {transform:scaleX(0);}
	  to {transform:scaleX(1);}
	}

	/* lnb */
	.lnb {position:sticky; top:630px; left:0; width:100%; height:70px; border-bottom:1px solid #ededed; border-top:1px solid rgba(255, 255, 255, 0.15); z-index:33;}
	.lnb .lnb-wrap {display:flex; align-items:center; position:relative; height:100%; width:100%; max-width :1400px; margin :0 auto; overflow:hidden;}
	/*.lnb .lnb-wrap>* {float:left;}*/
	.lnb .lnb-wrap:after {clear:both; content:''; display:block;}
	.lnb .lnb-wrap a {font-size:16px; color:#000;}
	.lnb .lnb-wrap h3 {background:var(--green); color:#fff; font-weight:500; height:100%; padding:20px 30px; box-sizing:border-box; font-size:18px;}
	.lnb .lnb-wrap .home {display:block; width:40px; height:40px; font-weight:300; background:#fff url(/assets/user/images/common/i-home.png)no-repeat center / 15px; border-radius:50%; border:1px solid #efefef;}	
	.lnb .lnb-wrap .lnb-depth {position:relative; padding-left:20px;}
	.lnb .lnb-wrap .lnb-depth .onmenu {display:block; font-size:16px; font-weight:400; color:#000; cursor:pointer; line-height:60px; background:url(/assets/user/images/common/lnb_arrow.png)100% center no-repeat}
	.lnb .lnb-wrap .lnb-depth.dep2 .onmenu { color :var(--base); background:url(/assets/user/images/common/lnb_arrow2.png)100% center no-repeat; }
	.lnb .lnb-wrap .lnb-depth>ul {display:flex; width:100%; gap:60px; height:70px; align-items:center;}
	.lnb .lnb-wrap .lnb-depth>ul li{position:relative;}
	.lnb .lnb-wrap .lnb-depth>ul li+li:before {content:""; display:block; width:1px; height:18px; background:#ddd; position:absolute; left:-30px;         top:50%; transform:translateY(-50%);}
	.lnb .lnb-wrap .lnb-depth>ul li:last-child {border-bottom:none;}
	.lnb .lnb-wrap .lnb-depth>ul li a {display:block; padding:21.5px 0; font-weight:600; color:#000; text-align:center; font-size:18px;}
	.lnb .lnb-wrap .lnb-depth>ul li:hover a { color :var(--base3); }
	.lnb .lnb-wrap .lnb-depth>ul li.on a {position:relative; color:var(--base3);}
	.lnb .lnb-wrap .lnb-depth>ul li.on a:after {content:""; display:block; position:absolute; width:100%; height:3px; background:var(--base3); bottom:1px;}
	.lnb .lnb-wrap .lnb-depth.on>ul { display:block;}

	.lnb.fixOn {position:fixed; width:100%; z-index:1000 !important; top:0 !important; box-shadow:0 3px 3px rgba(0,0,0,.05); background:#f9f9f9}
	.lnb.fixOn .lnb-wrap {border-radius:0;}
	
	/*컨텐츠*/
	.contents {color:#666; position:relative; z-index:0;}
	
	.contents-wrap {padding:80px 0!important; margin:0px auto!important; max-width:100%;}
	.w90vw {width:90vw; margin:0 auto!important; max-width:100%;}
	
	
	.fixMenu {position:fixed; right:10px; z-index:999; text-align:center; top:50%; transform:translateY(-50%);}
	.fixMenu .goTop {
		position:fixed; bottom:5vh; right:10px;
		display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px;
		width:50px; height:70px; border-radius:100px; background:var(--blue);
		font-size:12px; color:#fff; line-height:1; transition:all .3s ease !important;
		transform:translateX(70px); opacity:0; box-shadow:-10px 20px 20px rgba(0,0,0,.4);
	}
	.fixMenu .goTop:before {content:""; width:7px; height:7px; border:3px solid #fff; border-left:0; border-bottom:0; transform:rotate(-45deg);}
	.fixMenu .goTop:hover {height:100px; gap:10px; background:var(--base1);}
	.fixMenu .goTop.active {transform:translateX(0); opacity:1;}
	
	
	
	/* ************************** ani / pc에서만 사용 ************************** */
	.ani>* {transition:all 0.7s ease !important;}

	.ani-slide-down {transform:translateY(5vh); transition:all .7s ease; opacity:0;}
	.ani-slide-down.active {transform:translateY(0); opacity:1;}
	.ani-slide-down>* {transform:translateY(3vh);}
	.ani-slide-down.active>* {transform:translateY(0);}

	.ani-slide-left {transform:translateX(-5%); transition:all .7s ease; opacity:0;}
	.ani-slide-left.active {transform:translateX(0); opacity:1;}
	.ani-slide-left>* {transform:translateX(-3%);}
	.ani-slide-left.active>* {transform:translateX(0);}
	
	.ani-slide-right {transform:translateX(5%); transition:all .7s ease; opacity:0;}
	.ani-slide-right.active {transform:translateX(0); opacity:1;}
	.ani-slide-right>* {transform:translateX(3%);}
	.ani-slide-right.active>* {transform:translateX(0);}

	.ani-curtain-left {clip-path:inset(0 100% 0 0); transition:all 1s ease;}
	.ani-curtain-left.active {clip-path:inset(-10%);}
	.ani-curtain-left>* {transform:translateX(5%);}
	.ani-curtain-left.active>* {transform:translateX(0);}
	
	.ani-scale-up {transform:scale(0.9); transition:all .7s ease; opacity:0;}
	.ani-scale-up.active {transform:scale(1); opacity:1;}
	.ani-scale-up>* {transform:scale(0.8);}
	.ani-scale-up.active>* {transform:scale(1);}
	
	.ani-scale-down {transform:scale(1.1); transition:all .7s ease; opacity:0;}
	.ani-scale-down.active {transform:scale(1); opacity:1;}
	.ani-scale-down>* {transform:scale(1.4);}
	.ani-scale-down.active>* {transform:scale(1);}

	.delay1 {transition-delay:0.15s;}
	.delay2 {transition-delay:0.3s;}
	.delay3 {transition-delay:0.45s;}
	.delay4 {transition-delay:0.6s;}
	.delay5 {transition-delay:0.75s;}
	.delay6 {transition-delay:0.9;}
	.delay7 {transition-delay:1.05s;}
	.delay8 {transition-delay:1.2;}
	.delay9 {transition-delay:1.35;}
	.delay10 {transition-delay:1.5;}
	

	/* aniTxt set */
	.aniTxt {display:flex; flex-wrap:wrap; position:relative; flex-direction:row; text-indent:-99999px;}
	.aniTxt.center {justify-content:center;}
	.aniTxt>span {overflow:hidden; display:block; perspective:1.7vw; opacity:0; text-indent:0;}
	.aniTxt>span>span {display:block; transition:.5s ease;  transform:translateY(100%);}
	.aniTxt>span.on {opacity:1;}
	.aniTxt>span.on>span {transform:translateY(0);}
	.aniTxt .empty{display:inline-block;}
	.aniTxt .empty span{white-space:pre;}
	
	/* 서브 상단 텍스트 애니 */	
	.part1.active {height:700px;}
	
	.sub-toptext>* {opacity:0; transform:translateY(5vh); transition:all 1s ease;}
	.sub-toptext .sub-tit {transition-delay:0.2s;}
	.sub-toptext .sub-tit+p {transition-delay:0.4s;}
	.sub-toptext.active>* {opacity:1; transform:translateY(0);}
}


/* ************************ 태블릿 이하(~1249) ************************ */
@media screen and (max-width:1249px) {

	.pc {display:none !important;}	
	.w90vw {padding:0 30px!important; max-width:100%;}
	
	/*헤더*/
	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 {padding:20px;}
	header .head .gnbView {position:absolute; right:0; top:0; width:60px; height:60px; background:url(/assets/user/images/common/menu.png)center /22px no-repeat ;}
	header .head .gnbView img {}
	header .head a {display:inline-block;}
	.black_header_Bg {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; right:-1000px;}
	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(/assets/user/images/common/icon_close.png)center no-repeat; background-size:20px; border-left:1px solid rgba(0,0,0,.15); float:right;}
	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:20px; font-size:17px;}
	nav.mobile .gnb>ul>li>a span {font-size:14px; color:#999; padding-left:5px;}
	nav.mobile .gnb>ul>li.on {border-color:var(--base1);}
	nav.mobile .gnb>ul>li.on>a {background:var(--base1); 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 40px; font-size:15px; color:var(--base2); letter-spacing:-.8px;background:#fff;}
	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:var(--base1); font-weight:700;}
	nav.mobile .gnb>ul>li>ul>li.on a span {color:var(--base1);}
	nav.mobile .gnb>.side {display:none;}
	
	header .closeWrap a.inquire {display:inline-block; background-color:var(--base1); width:100px; height:40px; text-align:center; line-height:40px; color:#fff; border-radius:3rem; margin:10px;}
	header .closeWrap a.call {display:flex; justify-content:center; align-items:center; width:40px; height:40px; border-radius:50%; position:absolute; top:10px; left:120px; background:var(--base2);}

	.sub-toptext h1 {font-size:45px;}
	.sub-toptext > p.sub-tit {font-size:45px;}
	.sub-toptext > p {font-size:16px;}
	.site-route {height:65px;}
	.site-route>p {font-size:20px; border-top:3px solid var(--base1);}
	
	/* footer */
	footer {padding:50px 0 35px;}
	footer .f_btnWrap article {padding:40px;}
	footer .f_btnWrap article dt {font-size:24px;}
	footer .f_btnWrap article dd {font-size:16px;}
	footer .f_btnWrap article .white_btn {padding:12px 35px; font-size:16px;}
	footer .footer-info .top .callnum a {font-size:32px;}
	footer .footer-info .top .callnum .icon {width:40px; height:40px; background:var(--base1) url(/assets/user/images/common/i-callW.png) no-repeat center / 17px;}
	footer .footer-info .top .logoWrap > div a {font-size:15px;}
	/* lnb */
	.lnb {
		position:relative; height:30vh; opacity:0;
		background-position:center; background-repeat:no-repeat; background-size:cover;
	}
	.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);}
	.lnb.on .cover {background:rgba(0,0,0,.4);}
	.lnb-wrap {position:relative; height:100%;}
	.lnb-wrap .titwrap {position:absolute; width:100%; bottom:7vh; font-weight:500; color:#fff; text-align:center;}
	.lnb-wrap .titwrap .tit {font-size:22px; letter-spacing:-1px;}
	.lnb-wrap .titwrap p {font-size:14px;}
	

	/*컨텐츠*/
	.contents {position:relative; color:#666;}
	.contents-wrap {width:100%; padding:60px 20px 60px; max-width:100%;}
	.contents .wrapper {width:100%; padding:50px 0;}
	/*.contents h2 {font-size:24px; font-weight:500; letter-spacing:-1px; line-height:1.2; color:#323c5b;}*/
	.contents .part1 {padding-top:60px; height:60vh;}
	

	.sub-visual {position:relative; width:100%; height:20vh; margin-top:60px;}
	/*.sub-visual .cover { display :block; position :absolute; background :rgba(0,0,0,.4); width :100%; height :100%; top:0; }*/
	.sub-visual .sub-visual-wrap { position :absolute; display:table; width:100%; height:100%; left :50%; transform :translateX(-50%);}
	.sub-visual .sub-visual-text {display:flex; flex-direction:column; justify-content:center; height:100%; padding-top:15px;}
	.sub-visual .sub-visual-text h2 {font-size:30px; font-weight:600; letter-spacing:-.5px; color:#000; text-align:center; z-index :5;}
	.sub-visual .sub-visual-text p {font-size:18px; font-weight:400; color:#000;
    text-align:center; position:relative; margin-top:20px;}
	.sub-visual .sub-visual-text p:before {content:""; display:block; width:40px; height:2px; background:var(--base2); position:absolute; top:-7px; left:50%; transform:translateX(-50%);}
	.sub-visual {background:url(/assets/user/images/common/lnb_bg.png) no-repeat; background-size:cover; background-position:center;} 
	
	.contents-wrap {padding:50px 20px 50px!important;}
	.subpart .titWrap * {text-align:left !important;}
	.subpart .titWrap > p:before {left:0 !important; transform:translateX(0) !important;}
}
/* ************************ 모바일 (0~991) ************************ */
@media screen and (max-width:991px) {
	footer .footer-info {margin-top:30px;}	
	footer .footer-info .bottom {margin-top:20px;}
	footer .f_btnWrap {grid-template-columns:1fr;}
	footer .f_btnWrap article {padding:30px;}
	footer .f_btnWrap article dt {font-size:20px;}
	footer .footer-info .top .logoWrap img {width:150px;}
}


/* ************************ 모바일 (0~767) ************************ */
@media screen and (max-width:767px) {
    body { font-family:'NEXON Lv2 Gothic'; font-size:16px;}
	
	
	/*header {height:50px;} 
	header .head h1 a {height:50px;}*/
	header .head a img {height:20px;} 
	.sub-visual {height:120px;}
    .sub-visual .sub-visual-text h2 {font-size:24px;}
	.sub-visual .sub-visual-text p {font-size:16px;}
	.sub-visual .sub-visual-text p:before {top:-8px;}
	.contents-wrap {padding:40px 20px 50px!important;}
	/*footer*/
  
	.site-route {gap:15px;}
	.sub-toptext h1 {font-size:30px;}
	.sub-toptext > p.sub-tit {font-size:30px;}
	.site-route {height:60px;}
	.site-route>p {font-size:18px;}
	.site-route ul {display:none;}
	footer {padding:30px 0 20px;}
	footer .footer-info .top {gap:10px;}
	footer .footer-info .bottom {font-size:14px; margin-top:5px;}
	footer .footer-info .bottom > p {margin-top:20px; font-size:14px;}
	footer .footer-info .bottom ul:first-child {flex-direction:column;}
	footer .footer-info .bottom ul:first-child li+li {padding-left:0; margin-left:0;}
	footer .footer-info .top .callnum a {font-size:24px;}
	footer .footer-info .bottom ul:first-child li+li:before {display:none;}
	footer .footer-info .bottom_toggle {display:block; margin-top:15px; padding-right:20px; background:url(/assets/user/images/common/select_arrow.png) no-repeat right center/11px; color:#666;}
	footer .footer-info .bottom_toggle+.bottom {display:none;}
	.contents .sub-toptext {height:calc(100% - 65px); padding:0 20px;}
	
	.privacyPopup {width:95%;}
	.privacyPopup .txt h3 {font-size:20px;}
}

/* ************************ 모바일 (0~500) ************************ */
@media screen and (max-width:500px) { 
	.w90vw {padding:0 20px !important; max-width:100%;}
	.contents .site-routeWrap {padding-bottom:10px;} 
	.site-route {height:auto; flex-wrap:wrap; gap:0px;}
	.site-route ul {padding-top:10px;}
	.site-route>p {padding-top:10px;}
	.sub-toptext h1 {font-size:24px;}
	.sub-toptext > p.sub-tit {font-size:24px;}

	footer .f_btnWrap article dt {font-size:18px;}
	footer .f_btnWrap article dd {font-size:16px;}
	footer .f_btnWrap article:nth-child(1) {background-size:50px;}
	footer .f_btnWrap article:nth-child(2) {background-size:50px;}
	footer .f_btnWrap article:nth-child(3) {background-size:33px;}
	footer .f_btnWrap article .white_btn {padding:8px 30px;}
	footer .footer-info .bottom ul:nth-child(2) li strong {display:block;}

	.contents .part1 {height:600px;}
}