@charset "utf-8";

/* ************************ 공용 ************************ */

:root {
	--red:#8d1829;
    --f_nexon:'NEXONLv2Gothic';
    --f_nexen:'NEXENTIRE';
    --ani:all .3s;
	--textRotate:rotate(0.1deg);
}


.c_red {color:var(--red);}
.f_nexon {font-family:var(--f_nexon);}
.f_nexen {font-family:var(--f_nexen);}


html {overflow-x:hidden;}
body {max-width:100%; min-width:320px; font-family:'NEXONLv2Gothic', sans-serif !important; font-size:16px; font-weight:400; line-height:1.6; color:#666; word-break:keep-all;}
button {cursor:pointer;}

a {color:inherit; transition:var(--ani); -webkit-transition:var(--ani); -moz-transition:var(--ani);}
h1, h2, h3, h4 {transform:var(--textRotate);}


/* ************************ 데스크탑 (992~) ************************ */
@media screen and (min-width: 992px), print {

	.mobile {display:none !important;}
	.w1400 {width:1400px; margin:0 auto; max-width:100%;}

	/*헤더**/
	header {z-index:999; position:absolute; width:100%; top:0; left:0;}
	header .head {position:relative;}
	header .head .wrap {position:relative; max-width:1400px; height:120px; margin:0 auto;}
	header .head .logo {position:absolute; z-index:999; left:0; top:0;}
	header .head .logo a {display:block; height:120px; padding-top:44px;}
	header .head .logo a img {height:55px;}
	
	header .head aside {position:absolute; right:0; top:0px; z-index:999; display:flex; height:120px; padding-top:50px;}
	header .head aside a {width:50px; height:50px; display:block; background:#1f2024 url(../images/common/i-all-menu.png) no-repeat center; border-radius:50%; border:2px solid #1f2024; transition:background 0s;}
	header .head aside a.open {background:url(../images/common/arrow-down.png)no-repeat center;}
	
	/*gnb*/
	nav.mobile {visibility:hidden;}
	nav.pc {z-index:99; visibility:hidden; position:absolute; display:block; width:100%; overflow:hidden;}
	nav.pc.on {border-top:1px solid #e7ebfa; box-shadow:0px 10px 10px 0px rgba(0,0,0,0.2);}
	nav.pc .navbg {position:absolute; left:0; top:0; width:100%; height:100%;}
	nav.pc .navbg .dep1 {height:100%; background-color:#fff;}
	nav.pc .navbg .dep2 {height:100%; background-color:#fff; }
	
	nav.pc .gnb {position:relative; max-width:1400px; margin:0 auto;}
	nav.pc .gnb ul.dep1 {display:flex; justify-content:space-between; align-items:center; background:#fff; padding-top:47px; margin-right:18vw;}
	nav.pc .gnb ul.dep1>li {position:relative;}
	nav.pc .gnb ul.dep1>li>a {display:block; color:#000; font-size:22px; font-weight:500; transform:var(--textRotate);}
	nav.pc .gnb ul.dep1>li:hover>a {color:var(--red);}
	nav.pc .gnb ul.dep2 {position:absolute; top:30px; left:0; padding-top:14px;}
	nav.pc .gnb ul.dep2>li {}
	nav.pc .gnb ul.dep2>li>a {position:relative; display:inline-block; border-bottom:1px solid transparent; white-space:nowrap; transform:var(--textRotate); font-weight:400; color:#666;}
	nav.pc .gnb ul.dep2>li+li {padding-top:5px;}
	nav.pc .gnb ul.dep2>li:hover>a {color:var(--red);}
	nav.pc .gnb ul.dep2>li.on>a {color:var(--red);}
	nav.pc .gnb .side {position:absolute; right:0; top:47px;}
	nav.pc .gnb .side ul li+li {margin-top:19px;}
	nav.pc .gnb .side ul li a {position:relative; display:inline-block; cursor:text; line-height:35px; padding-left:42px; color:#000;}
	nav.pc .gnb .side ul li a:before {position:absolute; display:block; content:''; width:35px; height:35px; border-radius:50%; left:0;}
	nav.pc .gnb .side ul li:nth-child(1) a:before {background:#999 url(../images/common/i-call.png)no-repeat center;}
	nav.pc .gnb .side ul li:nth-child(2) a:before {background:#999 url(../images/common/i-msg.png)no-repeat center;}
	
	/* lnb */
	.lnb {position:relative;}
	.lnb-img {margin-top:120px; height:350px; color:#fff; position:relative; background:url(../images/common/sub-bg.webp)no-repeat center/cover;}
	.lnb-img-wrap {display:flex; height:100%; position:relative; align-items:center; justify-content:right;}
	.lnb-img-wrap img {position:absolute; left:150px; bottom:0;}
	
	.lnb-img-txt {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); z-index:2;}
	.lnb-img-txt h2 {font-size:48px; font-weight:500; line-height:1; text-align:center;}
	.lnb-img-txt ul {display:flex; font-weight:500; align-items:center; justify-content:center; font-size:16px; margin-top:20px;}
	.lnb-img-txt ul li:first-child {position:relative; padding-right:20px;}
	.lnb-img-txt ul li:first-child:before {content:""; display:block; position:absolute; background:url(../images/common/arrow-right.png)no-repeat right center; width:17px; height:16px; right:0; top:3px;}
	.lnb-img-txt ul li+li {position:relative; margin-left:20px;}
	
	.lnb-menu {position:absolute; top:470px; left:0; width:100%; height:70px; background:#fff; z-index:1; box-shadow:0 5px 5px rgba(0,0,0,.05);}
	.lnb-menu.fixOn {position:fixed !important; width:100%; z-index:1000 !important; top:0 !important; box-shadow:0 3px 3px rgba(0,0,0,.05);}
	.lnb-menu .lnb-wrap {position:relative; height:100%; max-width:1400px; width:100%; margin:0 auto;}
	.lnb-menu .lnb-wrap>* {float:left;}
	.lnb-menu>ul>li {border-right:1px solid #e5e5e5;}
	.lnb-menu>ul>li.home a {display:block; width:60px; height:70px; border-left:1px solid #eaeaea; background:var(--red) url(../images/common/i-home-w.png)center/24px no-repeat;}
	.lnb-menu>ul>#gotop {position:absolute; top:0px; right:0; border:0;}
	.lnb-menu>ul>#gotop a {display:none;}
	.lnb-menu.fixOn>ul>#gotop a {display:block; font-size:12px; font-weight:500; color:#333; line-height:60px; background:url(../images/common/arrow-up.png)no-repeat right 5px center/9px; padding-right:20px;}
	.lnb-menu>ul>li.menu {position:relative; width:320px;}
	.lnb-menu>ul>li.menu>a {padding:0 40px 0 20px; display:block; line-height:70px; background:url(../images/common/i-more.png)no-repeat right 20px center; font-weight:500; color:#000; width:320px;}
	.lnb-menu>ul>li.menu.dep-2 {position:relative; width:320px;}
	.lnb-menu>ul>li.dep-2>a {color:var(--red);}
	.lnb-menu>ul>li.menu ul {display:none; width:100%; position:absolute; left:0; top:70px; background:#fff; box-shadow:0 5px 10px rgba(0,0,0,.1); border-top:1px solid #eaeaea;}
	.lnb-menu>ul>li.menu:hover ul {display:block;}
	.lnb-menu>ul>li.menu ul li+li {border-top:1px solid #e5e5e5;}
	.lnb-menu>ul>li.menu ul li a {display:block; padding:0 20px; line-height:44px;}
	.lnb-menu>ul>li.menu ul li a:hover {color:var(--red);}
	
	.subTitle {margin-top:170px;}
	.subTitle .subTitle-wrap {width:100%; text-align:center;}
	.subTitle .subTitle-wrap h3 {font-size:40px; font-weight:700; color:#000; line-height:1.2;}
	
	/*footer*/
	footer {position:relative; background:#fff; color:#666; font-size:14px;}
	footer .footer-top {background:#2e2e2e; height:100px;}
	footer .footer-top>div {position:relative;}
	footer .footer-top ul {display:flex; align-items:center; height:100px; gap:5vw;}
	footer .footer-top a {display:inline-block;}
	footer .footer-top #gotop {display:block; width:45px; height:45px; position:absolute; right:0; top:28px; border-radius:50%; background:#2e2e2e url(../images/common/arrow-up-w.png)no-repeat center; border:1px solid rgba(255,255,255,0.3);}
	footer .footer-bottom {position:relative; max-width:1400px; width:100%; margin:0 auto; display:flex; padding:40px 0px; justify-content:space-between;}
	footer .footer-bottom .footer-info {position:relative;}
	footer .footer-bottom .footer-info p:first-child {font-weight:500; color:#000;}
	footer .footer-bottom .footer-info p>a {margin-left:25px;}
	footer .footer-bottom .footer-info span {margin-left:15px;}
	footer .footer-bottom .footer-info span a {font-weight:500; color:#000;}
	footer .footer-bottom .logo {}
	footer .footer-bottom .logo img {}

}

/* ************************ 노트북(~1440) ************************ */
@media screen and (max-width: 1440px) {
	.main {padding:100px 20px 0;}
	header .head .logo a {padding-left:20px;}
	header .head aside {padding-right:20px;}
	footer .footer-top>div {padding:0 20px;}
	footer .footer-top a img {max-width:100%;}
	footer .footer-bottom {padding:40px 20px;}
	footer .footer-top #gotop {right:20px;}
}


/* ************************ 태블릿 이하(~991) ************************ */
@media screen and (max-width: 991px) {

	.pc {display:none !important;}

	/*헤더*/
	header {position:absolute; left:0; top:0; width:100%; z-index:999; height:60px; background:#fff;}
	header .head {position:relative; border-bottom:1px solid #e7ebfa;}
	header .head .logo a {height:60px; display:inline-block; line-height:56px; padding-left:20px;}
	header .head .logo a img {height:35px;}
	header .head .gnbView {position:absolute; right:0; top:0; width:60px; height:60px; background:url(../images/common/icon_allmenu.png)center /22px no-repeat;}

	/*gnb*/
	nav.mobile {z-index:9999; position:fixed; top:0; width:50%; min-width:320px; height:100%; overflow:hidden; background:#fff;}
	nav.mobile .closeWrap {position:relative; height:60px; border-bottom:1px solid rgba(0,0,0,.15); overflow:hidden; font-weight:700;}
	nav.mobile .closeWrap .gnbClose {display:block; width:60px; height:60px; background:#fff url(../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:13px;}
	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>ul>li {clear:both; position:relative; border-bottom:1px solid #e5e5e5;}
	nav.mobile .gnb>ul>li>a {display:block; padding:15px 20px; font-size:17px; font-weight:500;}
	nav.mobile .gnb>ul>li.on {border-color:var(--red);}
	nav.mobile .gnb>ul>li.on>a {background:var(--red); 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:#444; background:#fff;}
	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(--red);}
	nav.mobile .gnb>.side {display:none;}
	
	nav.mobile .gnb ul.dep3 {display:none;}
	
	
	/* lnb */
	.lnb {position:relative;}
	.lnb-img {margin-top:60px; height:250px; color:#fff; position:relative; background:url(../images/common/sub-bg.webp)no-repeat center/cover;}
	.lnb-img-wrap {display:flex; height:100%; position:relative; align-items:center; padding:0 20px;}
	.lnb-img-wrap img {position:absolute; left:150px; bottom:0;}
	
	.lnb-img-txt {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); z-index:2; width:100%;}
	.lnb-img-txt h2 {font-size:38px; font-weight:500; line-height:1; text-align:center;}
	.lnb-img-txt ul {display:flex; font-weight:500; align-items:center; justify-content:center; font-size:16px; margin-top:20px;}
	.lnb-img-txt ul li:first-child {position:relative; padding-right:20px;}
	.lnb-img-txt ul li:first-child:before {content:""; display:block; position:absolute; background:url(../images/common/arrow-right.png)no-repeat right center; width:17px; height:16px; right:0; top:3px;}
	.lnb-img-txt ul li+li {position:relative; margin-left:20px;}
	
	.subTitle {margin-top:90px;}
	.subTitle .subTitle-wrap {width:100%; text-align:center;}
	.subTitle .subTitle-wrap h3 {font-size:38px; font-weight:700; color:#000; line-height:1.2;}
	
	/*footer*/
	footer {position:relative; background:#fff; color:#666; font-size:14px;}
	footer .footer-top {background:#2e2e2e; height:100px;}
	footer .footer-top>div {position:relative; padding:0 20px;}
	footer .footer-top ul {display:flex; align-items:center; height:100px; gap:5vw;}
	footer .footer-top a {display:inline-block;}
	footer .footer-top a img {max-width:100%;}
	footer .footer-top #gotop {display:none !important;}
	footer .footer-bottom {position:relative; max-width:1400px; width:100%; margin:0 auto; display:flex; padding:40px 20px; flex-direction:column-reverse; gap:20px; align-items: center; text-align:center;}
	footer .footer-bottom .footer-info {position:relative;}
	footer .footer-bottom .footer-info p:first-child {font-weight:500; color:#000;}
	footer .footer-bottom .footer-info p>a {display:block; margin-left:25px;}
	footer .footer-bottom .footer-info span {margin-left:15px; white-space:nowrap;}
	footer .footer-bottom .footer-info span a {font-weight:500; color:#000;}
	footer .footer-bottom .logo {}
	footer .footer-bottom .logo img {}

	
}


/* ************************ 모바일 (0~767) ************************ */
@media screen and (max-width: 767px) {
	
	/* lnb */
	.lnb-img {height:200px;}
	.lnb-img-txt h2 {font-size:34px;}
	
	.subTitle {}
	.subTitle .subTitle-wrap h3 {font-size:32px;}
	
	/*footer*/
	footer .footer-top {height:auto;}
	footer .footer-top>div {padding:20px;}
	footer .footer-top ul {height:auto; flex-direction:column;}
	
	
}