@charset "utf-8";

/* ************************ 공용 ************************ */

:root {
	--blue:#1d4bd0;
	--blue2:#003876;
	--blue3:#002059;
	--blue4:#1b5bce;
	--blue5:#0070c0;
    --brown:#b38c45;
    --brown2:#ebc176;
    --border1:#e5e5e5;
    --border2:#e5eaf0;
    --border3:#e7e9ec;
    --f_noto:'NEXONLv2Gothic';
    --f_neo:'NEXEN-TIRE';
    --ani:all .3s;
	--textRotate:rotate(0.1deg);
}


.c_blue {color:var(--blue);}
.c_blue2 {color:var(--blue2);}
.c_blue3 {color:var(--blue3);}
.c_brown {color:var(--brown);}
.c_red {color:#f00;}
.f_noto {font-family:var(--f_noto);}
.f_neo {font-family:var(--f_neo);}


html {overflow-x:hidden;}
body {max-width:100%; min-width:320px; font-family:'NEXONLv2Gothic', 'NEXEN-TIRE', 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);} */


/* ************************ 데스크탑 (1025~) ************************ */
@media screen and (min-width: 1025px), print {

	.mobile {display:none;}
	.w1200 {width:1200px; margin:0 auto; max-width:100%;}
	.w1300 {width:1300px; margin:0 auto; max-width:100%;}

	/*헤더**/
	header {z-index:999; position:absolute; width:100%; top:0; left:0; background:ease-gradient(to bottom, rgba(0,0,0,.7), transparent);}
	header .head {position:relative;}
	header .head .logo {position:absolute; z-index:999; left:0; top:0;}
	header .head .logo a {height:100px; display:flex; align-items:center;}
	header .head .logo a img {margin-top:20px;}
	
	header .head aside {position:absolute; right:0; top:10px; z-index:999;}
	header .head aside a {height:100px; display:flex;align-items:center; font-size:14px;}
	
	.headerH {height:100px;}
	
	/*gnb*/
	nav.mobile {visibility:hidden;}
	nav.pc {z-index:99; position:absolute; display:block; width:100%; overflow:hidden;}
	nav.pc:hover {background:#fff; box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;}
	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:100px;}
	nav.pc.on .navbg .dep1 {display:block; border-bottom:1px solid transparent; transition:all 2s ease;}
	nav.pc .navbg .dep2 {display:none; position:absolute;
    width:100%; height:0;}
	nav.pc.on .navbg .dep2 {display:block; position:absolute; height:100%; background-color:#fff;}
	
	nav.pc .gnb {}
	nav.pc .gnb ul.dep1 {height:100px; display:flex; gap:5vw; justify-content:center; align-items:center; padding-top:25px; padding-left:240px}
	nav.pc .gnb ul.dep1>li {position:relative;}
	nav.pc .gnb ul.dep1>li>a {display:block; color:#fff; font-size:18px; font-weight:700; border-bottom:3px solid transparent;}
	nav.pc.on .gnb ul.dep1>li>a {color:#000;}
	nav.pc .gnb ul.dep1>li:hover>a {color:var(--blue)!important;}
	/*nav.pc .gnb ul.dep1>li.on>a {color:var(--blue); border-color:var(--blue);}*/
	
	
	nav.pc .gnb ul.dep2 {position:absolute; top:50px; left:0; padding:0px 0 40px; height:150px; }	
	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:500; color:#000;}
	nav.pc .gnb ul.dep2>li>a:after { position: absolute; content:""; display: block; border-bottom: 2px solid var(--blue); transition: width 250ms ease-out; left: auto; right: 0; width: 0; bottom:2px;}
	nav.pc .gnb ul.dep2>li>a:hover:after,
	nav.pc .gnb ul.dep2>li.on>a:after{width: 100%; left: 0; right: auto;}
	nav.pc .gnb ul.dep2>li+li {padding-top:5px;}
	nav.pc .gnb ul.dep2>li:hover>a {color:var(--blue);}
	nav.pc .gnb ul.dep2>li.on>a {color:var(--blue); }
	
	nav.pc .navbg {position:absolute; width:100%; height:100%;}
	nav.pc .navbg .dep1 {height:100%;}
	nav.pc .navbg .dep2 {width:100%; background:#fff;}
	
	
	/* lnb */
	.lnb {position:relative;}
	
	.lnb-img {height:400px; background:url(../images/common/sub_bg01.webp)center /cover no-repeat; color:#fff; position:relative;}
	.lnb-img:before {content:""; display:block; width:100%; height:100%; position:absolute; z-index:1; background:rgba(0,0,0,0.3);}
	.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:150px; left:50%; transform:translateX(-50%); z-index:2;}
	
	.lnb-img-txt h2 {font-size:48px; letter-spacing:-1px; font-weight:300; line-height:1.2; text-align:center;}
	.lnb-img-txt h2 span {display:block; color:#f5cb7f;}
	.lnb-img-txt h2 b {font-weight:900;}
	.lnb-img-txt ul {display:flex; font-weight:500; align-items:center; justify-content:center; font-size:18px;}
	.lnb-img-txt ul li:first-child {position:relative; padding-left:30px;}
	.lnb-img-txt ul li:first-child:before {content:""; display:block; position:absolute; background:url(../images/common/i-home.png) no-repeat center; width:17px; height:16px; left:0; top:3px; }
	.lnb-img-txt ul li+li { position:relative;  margin-left:30px;}
	.lnb-img-txt ul li+li:before {content:""; display:block; position:absolute; width:7px; height:12px; background:url(../images/common/lnb_page_load.png); left: -18px; top: 8px;}
	
	.lnb-menu { position:absolute; left:50%; top:300px; background:#fff; z-index:9; transform:translateX(-50%); border-radius:20px; border-top-left-radius:22px; border-bottom-left-radius:22px; box-shadow: 0 7px 7px rgba(0,0,0,.05); width:100%; max-width:1300px;}
	.lnb-menu.fixOn {position:fixed; top:0; width:100%; border-radius:0; box-shadow: 0 7px 7px rgba(0,0,0,.05); max-width:none;}
	.lnb-menu-wrap {display:flex; position:relative; max-width:1300px; margin:0 auto;}
	.lnb-menu-wrap p {line-height:70px; width:180px; background:var(--blue); color:#fff; font-size:18px; letter-spacing:-1px; font-weight:700; text-align:center; border-top-left-radius:20px; border-bottom-left-radius:20px;}
	.lnb-menu.fixOn p {border-radius:0;}
	.lnb-menu-wrap ul {padding-left:30px; display:flex;}
	.lnb-menu-wrap ul li {padding:0 30px; line-height:70px; display:flex; align-items:center; position:relative;}
	.lnb-menu-wrap ul li+li:before {width:1px; height:13px; background:#b3bdce; position:absolute; left:0; top:27px; content:''; display:block;}
	.lnb-menu-wrap ul li a {font-size:18px; font-weight:700; line-height:1.6; color:#000;display:block; }
	.lnb-menu-wrap ul li:hover a {border-color:var(--blue4); }
	.lnb-menu-wrap ul li.on a {border-color:var(--blue4); color:var(--blue4);}
	.lnb-menu-wrap>a {
		padding:0 50px 0 30px; border-radius:100px; font-size:12px; font-weight:700;
		color:#000; position:absolute; right:0; top:50%; transform:translateY(-50%); display:block; line-height:33px;
	}
	.lnb-menu-wrap>a.home {right:75px; background:#fff url(../images/common/i-home.svg)13px center /12px no-repeat;}
	.lnb-menu-wrap>a.gotop {background:#fff url(../images/common/i-gotop.png)15px center no-repeat;}
	
	
	
	
	/*컨텐츠*/
	.contents {padding:100px 0;}
	.contents.intro {padding:100px 0 20px;}
	.main_contents > div {max-width:1300px; margin:0 auto;}
	
	
	/*footer*/
	footer {position:relative; padding:50px 0px; background:#f1f3f4; color:#000; font-size:14px; z-index:2;}
	footer .footer-wrap {display:flex; position:relative; justify-content:space-between;}
	footer .footer-wrap:before, footer .footer-wrap:after {display:none !important;}
	footer .footer-info {position:relative;}
	footer .footer-info .footer-address {padding:15px 0px 0px;}
	footer address span {margin-right:10px;}
	footer p span {margin-right:10px;}
	footer .copy {margin-top:3px;}
	footer .footer-wrap .footer_btn {position:relative; width:315px; margin-top:10px;}
	footer .footer-wrap .footer_btn > a {display:block; position:relative; padding:12px 50px 12px 20px; border:1px solid #dee0ec; color:#000; white-space:nowrap;
    font-size:14px; border-radius:5px; background-color:#fff; clear:both; order:1; }
	footer .footer-wrap .footer_btn ul {display:none; z-index:99; position:absolute; bottom:75px; width:100%; border:1px solid #e5e5e5; border-bottom:none; border-top-left-radius:5px; border-top-right-radius:5px;}
	footer .footer-wrap .footer_btn ul li a {display:block; background:#fff; padding:10px 20px; }
	footer .footer-wrap .footer_btn ul li a:hover {background:#8b8b8b; color:#fff;}
	footer .footer-wrap .footer_btn ul li:first-child a{border-top-left-radius:5px; border-top-right-radius:5px;}
	footer .footer-wrap .footer_btn ul li:last-child a {border-bottom:1px solid #e5e5e5;}
	footer .footer-wrap .footer_btn ul li+li a {border-top:1px solid #e5e5e5;}
	footer .footer-wrap .footer_btn > a i {position:absolute; right:20px; top:36%; transition:all 0.3s; font-size:14px; color:#7f7f7f; font-weight:800;}
	footer .footer-wrap .footer_btn > a i.on {transform:rotate(180deg);}

	footer .footer-wrap .footer_btn a:last-child {margin-right:0;}
	footer .footer-wrap .footer_btn a:last-child:after {display:none;}
	
	/*컨텐츠*/
	.contents {}
	

}


/* ************************ 태블릿 이하(~1024) ************************ */
@media screen and (max-width: 1024px) {

	.pc {display:none !important;}

	/*헤더*/
	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:0; top:0; width:60px; height:60px; background:url(../images/common/icon_gnbView.png)center /22px no-repeat ;}
	header .head .gnbView img {}
	header .head .logo {}
	header .head .logo a {height:70px; display:flex; align-items:center; padding-left:20px;}
	header .head .logo a img {height:30px;}

	.headerH {height:60px;}
	
	/*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: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 : 500;}
	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 20px; font-size:17px;}
	nav.mobile .gnb>ul>li.on {border-color:var(--blue);}
	nav.mobile .gnb>ul>li.on>a {background:var(--blue); 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:#000; letter-spacing:-.8px;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(--blue4);}
	nav.mobile .gnb>.side {display:none;}
	
	nav.mobile .gnb ul.dep3 {display:none;}
	
	
	
	/* lnb */
	.lnb {}
	
	.lnb-img {height:250px; background:url(../images/common/sub_bg01.webp)center /cover no-repeat; color:#fff; position:relative; }
	.lnb-img:before {content:""; display:block; width:100%; height:100%; position:absolute; z-index:1; background:rgba(0,0,0,0.3);}
	.lnb-img-wrap {display:flex; height:100%; position:relative; align-items:center; justify-content:right;}
	.lnb-img-wrap img {position:absolute; left:20px; bottom:0; width:200px;}
	
	.lnb-img-txt {position:absolute; top:100px; left:50%; transform:translateX(-50%); z-index:2;}
	
	.lnb-img-txt h2 {font-size:32px; letter-spacing:-1px; font-weight:300; line-height:1.2; text-align:center;}
	.lnb-img-txt h2 span {display:block; color:#f5cb7f;}
	.lnb-img-txt h2 b {font-weight:900;}
	.lnb-img-txt ul {display:flex; font-weight:500; align-items:center; justify-content:center;font-size:16px;}
	.lnb-img-txt ul li:first-child {position:relative; padding-left:30px;}
	.lnb-img-txt ul li:first-child:before {content:""; display:block; position:absolute; background:url(../images/common/i-home.png) no-repeat center; width:17px; height:16px; left:0; top:3px; }
	.lnb-img-txt ul li+li { position:relative; font-size:16px; margin-left:30px;}
	.lnb-img-txt ul li+li:before {content:""; display:block; position:absolute; width:7px; height:12px; background:url(../images/common/lnb_page_load.png); left:-18px; top:50%;
    transform:translateY(-50%);}
	
	
	.lnb-tit {padding:60px 20px 0;}
	.lnb-tit-wrap {position:relative;}
	.lnb-tit-wrap h3 {padding-left:25px; font-size:30px; color:#000; letter-spacing:-1px; font-weight:400; border-left:7px solid var(--blue2);}
	.lnb-tit-wrap ul {position:absolute; right:0; bottom:0; display:flex;line-height:1;}
	.lnb-tit-wrap ul li {font-size:15px;}
	.lnb-tit-wrap ul li+li {margin-left:12px; padding-left:17px; background:url(../images/common/lnb-arrow.png)0 center no-repeat;}
	
	/*컨텐츠*/
	.contents {padding:70px 30px;}
	.contents.intro { }
	
	
	
	/*footer*/
    footer {padding:50px 20px 50px; background: #f1f3f4; border-top:1px solid var(--border3);}
	footer .footer-wrap { position:relative;}
	footer .footer-wrap h2 { text-align:center;}
	footer .footer-logo {width:50px; margin:0 auto;}
	footer .footer-logo img {height:60px;}
	footer .footer-address {text-align:center; margin-top:14px; font-size:14px; font-weight:600; letter-spacing:-.5px; color:#000; font-weight:400;}
	footer .footer-address span {display:inline-block;}
	footer #gotop {
		background:#f5f5f5; border-radius:100px; border:1px solid var(--border1); line-height:52px; width:54px; text-align:center;
		position:fixed; right:20px; bottom:20px; font-size:12px; color:#000; display:block;
	}
	footer .footer-wrap .footer_btn {position:relative; width:315px; margin-top:20px; left:50%; transform:translate(-50%);}
	footer .footer-wrap .footer_btn > a {display:block; position:relative; padding:12px 50px 12px 20px; border:1px solid #dee0ec; color:#000; white-space:nowrap;
    font-size:14px; border-radius:5px; background-color:#fff; clear:both; order:1; }
	footer .footer-wrap .footer_btn ul {z-index:99; position:absolute; width:100%; border:1px solid #e5e5e5; border-bottom:none; border-top-left-radius:5px; border-top-right-radius:5px; bottom:45px; display:none;}
	footer .footer-wrap .footer_btn ul li a {display:block; background:#fff; padding:10px 20px; }
	footer .footer-wrap .footer_btn ul li a:hover {background:#8b8b8b; color:#fff;}
	footer .footer-wrap .footer_btn ul li:first-child a{border-top-left-radius:5px; border-top-right-radius:5px;}
	footer .footer-wrap .footer_btn ul li:last-child a {border-bottom:1px solid #e5e5e5;}
	footer .footer-wrap .footer_btn ul li+li a {border-top:1px solid #e5e5e5;}
	footer .footer-wrap .footer_btn > a i {position:absolute; right:20px; top:36%; transition:all 0.3s; font-size:14px; color:#7f7f7f; font-weight:800;}
	footer .footer-wrap .footer_btn > a i.on {transform:rotate(180deg);}

	footer .footer-wrap .footer_btn a:last-child {margin-right:0;}
	footer .footer-wrap .footer_btn a:last-child:after {display:none;}
	
	
	
	
	
	
	
}


/* ************************ 모바일 (0~767) ************************ */
@media screen and (max-width: 767px) {
    body {}
	
	
	
	/* lnb */
	.lnb {}
	.lnb-img {height:200px;}
	.lnb-img-wrap {}
	.lnb-img-txt {top:80px;}
	.lnb-img-txt h2 {font-size:28px;}
	
	
	/*컨텐츠*/
	.contents {padding:50px 20px;}
	
	
	/*footer*/
	footer {padding:20px; font-size:14px !important;}
	footer span {font-size:14px !important;}
	footer .footer-logo {display:none;}
	footer .footer-address {margin-top:20px;}
	
	
	
	
	
	
	
	
	
	
	


}