@charset "utf-8";


/* layout */
html, body { height:100%;}
body { color:#686868; letter-spacing:-.05em; -webkit-text-size-adjust:none; -webkit-font-smoothing:antialiased;}
#wrap {	position:relative; width:100%; min-width:320px;height:100%; font-size:1.6rem; }
.inner {	width:100%; max-width:1600px;	position:relative;	margin-left:auto;	margin-right:auto;}
.w-inner {	width:100%; max-width:1720px;	position:relative;	margin-left:auto;	margin-right:auto;}
.s-inner {	width:100%; max-width:1640px;	position:relative;	margin-left:auto;	margin-right:auto;}


/* 타블렛 가로 */
@media all and (max-width:1720px){
	.w-inner{width: 94%;}
}
@media all and (max-width:1599px) {	
	.inner {width:94%;}
	.s-inner {width:94%;}
}

/* header */
#header{position: fixed; left: 0; top: 0; width: 100%; height: 130px; z-index: 999;  transition: .3s ease-in-out;}
#header:hover{background-color: #fff; border-bottom: 1px solid #eee;}
#header.onn{background-color: #fff; border-bottom: 1px solid #eee;}
#header .w-inner{height: 100%; display: flex; align-items: center; justify-content: space-between;}
#header .w-inner #logo{}
#header .w-inner #logo a{display: block; width: 219px; height: 42px; background: url(/images/common/logo.png) no-repeat center center / 100%;}
#header:hover .w-inner #logo a{ background: url(/images/common/f_logo.png) no-repeat center center / 100%;}
#header.onn .w-inner #logo a{ background: url(/images/common/f_logo.png) no-repeat center center / 100%;}
#header .w-inner .pcGnb{}
#header .w-inner .pcGnb > ul{display: flex; gap:0 48px;}
#header .w-inner .pcGnb > ul > li{position: relative;}
#header .w-inner .pcGnb > ul > li > a{font-size: var(--fz16); color: #fff; line-height: 130px; display: block;}
#header:hover .w-inner .pcGnb > ul > li > a{color: #212121;}
#header.onn .w-inner .pcGnb > ul > li > a{color: #212121;}
#header .w-inner .pcGnb > ul > li:hover > a{color: #ed1c24;}
#header .w-inner .pcGnb > ul > li > ul{display:none;}
#header .w-inner .pcGnb > ul > li:hover > ul{display:block; position: absolute; background-color: #ed1c24; width: 200px; left: 50%; transform: translateX(-50%);}
#header .w-inner .pcGnb > ul > li > ul > li{text-align: center; transition: .2s; background-color: transparent; position: relative;}
#header .w-inner .pcGnb > ul > li > ul > li:not(:last-child){border-bottom: 1px solid rgba(255,255,255,0.15);}
#header .w-inner .pcGnb > ul > li > ul > li:hover{background-color: #c9282e;}
#header .w-inner .pcGnb > ul > li > ul > li > a{color: #fff; font-size: var(--fz16); padding: 10px 5px; display: block;}
#header .w-inner .pcGnb > ul > li > ul > li > ul{display:none;}
#header .w-inner .pcGnb > ul > li > ul > li:hover > ul{display:block; position: absolute; left: 200px; background-color: #c9282e; width: 200px; top: 0;}
#header .w-inner .pcGnb > ul > li > ul > li > ul > li{background-color: transparent;}
#header .w-inner .pcGnb > ul > li > ul > li > ul > li:not(:last-child){border-bottom: 1px solid rgba(255,255,255,0.1);}
#header .w-inner .pcGnb > ul > li > ul > li > ul > li:hover{background-color: #a3292d;}
#header .w-inner .pcGnb > ul > li > ul > li > ul > li > a{color: #fff; font-size: var(--fz16); padding: 10px 5px; display: block;}
#header .w-inner .menuToggle{display: none;}
.moGnb{display: none;}

@media all and (max-width:976px){
	#header{height: 70px;}
	#header.on{background-color: #fff;}
	#header .w-inner #logo a{width: 172px; height: 34px;}
	#header.on .w-inner #logo a{ background: url(/images/common/f_logo.png) no-repeat center center / 100%;}
	#header.on .w-inner .pcGnb > ul > li > a{color: #212121;}
	#header .w-inner .pcGnb{display: none;}
	#header .w-inner .menuToggle{display: block; cursor: pointer;}
	#header .w-inner .menuToggle span{color: #fff;}
	#header:hover .w-inner .menuToggle span{color: #212121;}
	#header.on .w-inner .menuToggle span{color: #212121;}

	.moGnb{position: fixed; top: 0; width: 100%; z-index: 99; top: -300%; transition: .5s; border-top: 1px solid #eee; display: block;}
	.moGnb.on{ top: 70px;}
	.moGnb > ul{background-color: #fff; cursor: pointer;}
	.moGnb > ul > li{}
	.moGnb > ul > li:not(:last-child){border-bottom: 1px solid #eee;}
	.moGnb > ul > li > a{font-size: var(--fz18); font-weight: 500; padding: 12px 20px; display: block; position: relative; color: #212121;}
	.moGnb > ul > li > a.on::after{content: '↓'; font-family: 'SUIT', sans-serif; position: absolute; right: 3%; top: 50%; transform: translateY(-50%); font-weight: 500;}
	.moGnb > ul > li > ul{display:none;}
	.moGnb > ul > li > ul > li{position: relative;}
	.moGnb > ul > li > ul > li:not(:last-child){border-bottom: 1px solid #e8e8e8;}
	.moGnb > ul > li > ul > li > a{display: block; padding: 12px 30px; background-color: #f3f3f3; font-size: var(--fz15); position: relative;}
	.moGnb > ul > li > ul > li > a.on::after{content: '↓'; font-family: 'SUIT', sans-serif; position: absolute; right: 3%; top: 50%; transform: translateY(-50%); font-weight: 500;}
	.moGnb > ul > li > ul > li > ul{display:none; border-top: 1px solid #ddd;}
	.moGnb > ul > li > ul > li > ul > li{}
	.moGnb > ul > li > ul > li > ul > li:not(:last-child){border-bottom: 1px solid #ddd;}
	.moGnb > ul > li > ul > li > ul > li > a{display: block; padding: 12px 40px; font-size: var(--fz15); background-color: #eee;}
}


/* footer */
footer{height: 200px; padding-top: 60px;}
footer .inner{height: 100%; display:flex;}
footer .inner .f_logo{margin-right: 80px;}
footer .inner .f_logo img{max-width: 100%;}
footer .inner .info{}
footer .inner .info span{font-size: var(--fz14); color: #686868; opacity: 0.7; display: inline-block; margin-right: 25px; line-height: 1.8em;}
footer .inner .info .copy{font-size: var(--fz13); color: #686868; opacity: 0.4; margin-top: 25px; font-family: 'Poppins', sans-serif;}

@media all and (max-width:976px){
	footer{height: auto; padding-bottom: 40px; padding-top: 40px;}
	footer .inner{flex-direction: column;}
	footer .inner .f_logo{margin-right: 0; text-align: center; margin-bottom: 20px;}
	footer .inner .f_logo img{max-width: 196px;}
	footer .inner .info{text-align: center;}
	footer .inner .info br{display: none;}
	footer .inner .info span{margin-right: 0; margin: 0 12px;}
	footer .inner .info .copy{margin-top: 15px;}
}