/* common */
#wrap {position: relative; width: 100%; overflow: hidden;}

.container {width: 100%; max-width: 1400px; margin-left: auto; margin-right: auto; position: relative;}
.container:after {content: ''; display: table; clear: both;}
.hidden {position: absolute; left: -10000px; top: auto; height: 1px; overflow: hidden;}


/* Footer */
.footer { clear: both;background-color: #222; color: #fff; padding: 60px 20px;}
.footer-logo { margin-bottom: 40px;}
.logo-text { display: inline-block; color: #f9f871; font-size: 24px; font-weight: 600; letter-spacing: 1px;font-family: 'Montserrat';}
.footer-content { display: grid;  grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: 30px;}
.col-title { color: #f9f871; font-size: 15px; font-weight: 600; margin-bottom: 10px; letter-spacing: 0.5px;font-family: 'Montserrat';}
/* 텍스트 및 링크 스타일 */
.footer-col p { line-height: 150%; opacity: 0.8;font-weight: 100;}
.footer-col ul li { line-height: 150%;font-weight: 100;}
.footer-col ul li a { color: #fff; text-decoration: none; opacity: 0.8; transition: 0.3s;}
.footer-col ul li a:hover { opacity: 1; color: #f9f871;}




.dib {display: inline-block;}
.db {display: block;}


.imgPc {display: block !important; max-width:100%; margin: 0 auto;}
.imgMo {display: none !important;}


.mt0 {margin-top: 0px !important;}
.mt10 {margin-top: 10px !important;}
.mt20 {margin-top: 20px !important;}
.mt30 {margin-top: 30px !important;}
.mt40 {margin-top: 40px !important;}
.mt50 {margin-top: 50px !important;}
.mt60 {margin-top: 60px !important;}
.mb60 {margin-bottom: 60px !important;}
.pb0 {padding-bottom: 0 !important;}
.tal {text-align: left !important;}
.tar {text-align: right !important;}
.tac {text-align: center !important;}
.fl { float: left !important;}
.fr { float: right !important;}
.cr { clear: both;}


#skip {position: relative; z-index: 3000;}
#skip a {position: absolute; top: -30px; left: 0; width: 138px; border: 1px solid #4ec53d; background: #333; text-align: center; }
#skip a:active,
#skip a:focus{top:0;text-decoration:none;z-index:1000}
#skip a span {display: inline-block; padding: 2px 6px 0 0; font-size: 13px; line-height: 26px; color: #fff; letter-spacing: -1px; white-space: nowrap;}
/*탭메뉴 focus 시 라인 생셩*/
a:focus-visible, 
button:focus-visible {outline: none; border:1px dashed rgba(252,247,127,0.5); border-radius:7px; }



/****************************************************************************************/
/****************************************************************************************/
/*Media Query*/
/****************************************************************************************/
/****************************************************************************************/



@media (max-width:768px) {

	.imgPc {display: none !important;}
	.imgMo {display: block !important; max-width:100%; margin: 0 auto;}
	.container {padding-left: 15px; padding-right: 15px;}

}

@media (max-width:991px) {

	#ftTop {margin: 0 -15px;}
	.ftNav {display: none;}
	#ftBt p {font-size: 9pt;}
	#ftBt p span {display: block;}
	#ftBt p.ftCpy {font-size: 8pt;}

}



/* GNB */
@media (min-width:1401px) {	


	#gb {position:absolute;width: 100%; z-index:100; margin-top: 50px; /*background: rgba(255,255,255,1);*/}
	#gbTop {height:85px;}
	.gbtLogo { position: absolute;left: 0;top: 15px;z-index: 100;}
	.gbtLogo a {display:block; height: 45px; line-height: 45px; font-size: 22px; color: #fff; font-weight: 600;}
	.gbtLogo a span:hover { scale: calc(1.03);-webkit-transition: all 0.3s; transition: all 0.3s;}
	.gbtLogo a:after {content: ''; display: table; clear: both;}
	.gbtLogo a span {display:inline-block; width: 200px; font-family: 'Montserrat'; color: #FCF97F;font-size: 24px;}
	.gbtMenu {float:left; margin-right: 30px;}
	.gbtMenu:after {content:""; display:table; clear:both;}
	.gbtMenu li {float:left; padding:0 10px; position:relative;}
	.gbtMenu li:first-child {padding-left:0;}
	.gbtMenu li:last-child {padding-right:0;}
	.gbtMenu li:after {content:""; display:block; width:1px; height:12px; background: rgba(0,0,0,0.12); position:absolute; right:-1px; top:50%; margin-top:-6px;}
	.gbtMenu li:last-child:after {display:none;}
	.gbtMenu li a {}
	.gbtSns {float: left;}
	.gbtSns:after {content: ''; display: table; clear: both;}
	.gbtSns li {float:left; margin-right: 10px; position:relative;}
	.gbtSns li:last-child {margin-right: 0;}
	.gbtSns li a {padding-left: 23px;}
	.gbtSns li a.gbtIs {background:url('../img/common/gnb_sns_instagram.png')no-repeat left center;}
	.gbtSns li a.gbtFb {background:url('../img/common/gnb_sns_facebook.png')no-repeat left center;}
	.gbtMo {display:none;}
	.gbbSns {display: none;}
	#gbBot {height:100%; position:relative;}
	#gbBot .container {display: flex; justify-content: center; align-items:center;margin-left: 3%;}
	.gbbMenu {position:relative; padding: 0 0;}
	.gbbMenu:after {content:""; display:table; clear:both;}
	.gbbMenu > li {float:left; position: relative;}
	.gbbMenu > li.gbbMo {display: none;}
	.gbbMenu > li > a {display: block; text-align: center; height: 85px; line-height: 85px; font-size: 17px; font-weight: 700; color: rgba(255,255,255,1); position: relative;
		padding: 0 35px;text-transform: uppercase;font-family: 'Montserrat';}
	.gbbMenu > li > a:after {content: ''; display: block;width: 70px; height: 8px; background: rgba(252,247,127,1); position: absolute; left: 50%; right: 50%;transform: translate(-50%, -50%); top: -70px; -webkit-transition: all 0.3s; transition: all 0.3s;}
	.gbbMenu > li > a:hover:after,
	.gbbMenu > li > a.current:after {left: 0; top: 35px; }
	.gbbMenu > li > a > span {display:none;}
	.gbbMenu > li > ul { position: absolute; left: 0; right: 0; top: 100%; height: 0px; overflow: hidden; z-index: 1; -webkit-transition: all 0.3s; transition: all 0.3s;padding-top: 30px;display: block !important;}
	/* hover 시 색상변화 */
	.gbbMenu > li:hover > a:after { position: absolute; left: 50%; right: 50%;transform: translate(-50%, -50%); background: rgba(255,255,18,0.5); color: #FCF97F; }
	.gbbMenu > li:hover > a {color: #FCF97F;}
	.gbbMenu > li > ul > li {padding:0 0;}
	.gbbMenu > li > ul > li > a {display:block; text-align:center; font-weight: 400; color: #fff;padding: 9px 10px 8px 15px;position: relative;}
	.gbbMenu > li > ul > li > a:hover { color: rgba(255,255,255,1);background:linear-gradient(to right, rgba(252,247,127,1), rgba(32,127,255,0.1));border-radius: 2px;}
	.gbbMenu.on > li > ul,
	.gbbMenu.on > .gbbBg,
	.gbbMenu:hover > li > ul,
	.gbbMenu:hover > .gbbBg {height:200px;}
	.gbbBg {position: absolute; top: 100%; left: -1000px; right: -1000px; height: 0px; background: rgba(11,18,63,0.55); overflow:hidden; -webkit-transition: all 0.3s; transition: all 0.3s;}
	.gbbBg:before,
	.gbbBg:after {content:""; position:absolute; display:block; height:0px; left:0; right:0; background:#dadada;}
	.gbbBg:before {top:0;}
	.gbbBg:after {bottom:0;}
	#gb.sub {background: #fff;}
	#gb.sub .gbtLogo a {color: #000;}
	#gb.sub .gbtLogo a span {background:url('../img/common/gnb_logo.png')no-repeat center center;}
	#gb.sub .gbbMenu > li > a {color: #000;}
	#gb.sub .gbbMenu > li > a:hover,
	#gb.sub .gbbMenu > li > a.current {color: #3e82e7;}
	#gb.sub .gbbMenu > li > a:after {background: #3e82e7;}

}




@media (max-width:1400px) {


	#gb {position:relative; z-index:100;background: #0b133f;}
	#gbTop {border-bottom:solid 0px #dadada; position: relative; z-index: 101; height: 57px;}
	.gbtLogo {width:160px; height: 56px;line-height: 56px; float: left;}
	.gbtLogo a {display:block; height:100%; font-family: 'Montserrat' !important; color: #FCF97F; font-size: 20px;}
	.gbtLogo a span { font-family: 'Montserrat' !important;}
	.gbtMo {display:block; width:57px; height:56px; padding:18px; float: right; margin-right: -15px; cursor:pointer; background: none;}
	.gbtMo span {text-indent: -9999px; overflow: hidden; height: 0; width: 0; display: block;}
	.gbtMo em {display: block; height: 2px; background: #fff; margin-bottom: 2px; position: relative; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
	.gbtMo em:last-child {margin-bottom: 0;}
	.gbtMo.on {background: none;}
	.gbtMo.on em:nth-child(2) {opacity:0;}
	.gbtMo.on em:nth-child(3) {margin-bottom:6px; margin-left:0px; transform:rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);}
	.gbtMo.on em:nth-child(4) {margin-top:-8px; margin-left:0px; transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);}
	.gbtMenu {display: none;}
	#gbBot {position: fixed; top: 57px; bottom: 0; left: 0; right: 0; z-index:100; background: #fff; visibility: hidden; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
	#gbBot.on {visibility: visible;}
	#gbBot .container {padding-left: 0; padding-right: 0; height: 100%;}
	.gbbMenu {overflow:hidden; height: 0; overflow-y:scroll; -webkit-overflow-scrolling: touch; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out; position: relative;}
	.gbbMenu > li {position:relative; text-align:left; z-index:1; border-bottom:solid 1px #ddd;}
	.gbbMenu > li > a {display:block; height:50px; line-height:50px; font-size:13pt; padding:0 15px; font-weight:700;text-transform: uppercase;}
	.gbbMenu > li > span {display:block; position:absolute; left:0; right:0; top:0; height:50px; cursor:pointer;}
	.gbbMenu > li > span:after {content:""; display:block; width:15px; height:8px; position:absolute; right:15px; top:50%; margin-top:-4px; background:url('../img/common/gnb_mobile_arrow.png')no-repeat center bottom; background-size:100% auto;}
	.gbbMenu > li > span.on:after {background-position:center top !important;}
	.gbbMenu > li > ul {display:none; background:#f5f5f5;}
	.gbbMenu > li > ul > li {border-top:solid 1px #ddd;}
	.gbbMenu > li > ul > li > a {display:block; padding:0 25px; height:40px; line-height:40px; font-size:11pt;}
	.gbbMenu > li > ul > li > a br {display:none;}
	.gbbMenu.on {height:100%;}
	html.on,
	body.on {display:block; height:100%; overflow:hidden;}
	.gbbBg {display:none;}
	.gbbMenu > li.gbbMo {background: #f5f5f5; padding: 8px 10px;}
	.gbbMenu > li.gbbMo dl {display: block; text-align: right;}
	.gbbMenu > li.gbbMo dl:after {content: ''; display: table; clear: both;}
	.gbbMenu > li.gbbMo a {display: block; height: 36px; line-height: 36px;  position: relative; padding: 0 15px; font-weight: 500; font-size: 11pt; border-radius: 25px 25px 25px 25px; -moz-border-radius: 25px 25px 25px 25px; -webkit-border-radius: 25px 25px 25px 25px; letter-spacing: -0.075em;}
	.gbbMenu > li.gbbMo dl dt {float: left;}
	.gbbMenu > li.gbbMo dl dt a {background: #fff; border: solid 1px #ddd; line-height: 34px;}
	.gbbMenu > li.gbbMo dl dd {display: inline-block;}
	.gbbMenu > li.gbbMo dl dd a {background: #454c52; color: #fff;}
	.gbbMenu > li.gbbSns {text-align: center; border-bottom: none; padding: 15px 0;}
	.gbbMenu > li.gbbSns span {display: none;}
	.gbbMenu > li.gbbSns > a {display: inline-block; margin: 0 10px; padding-left: 23px; height: 20px; line-height: 20px; padding-right: 0; font-size: 10pt; font-weight: 400; white-space: nowrap;}
	.gbbMenu > li.gbbSns > a.gbtIs {background:url('../img/common/gnb_sns_instagram.png')no-repeat left center;}
	.gbbMenu > li.gbbSns > a.gbtFb {background:url('../img/common/gnb_sns_facebook.png')no-repeat left center;}
	
	.container { width: 100%;}

}


@media (max-width:1350px) {	
	.container {padding-left: 15px; padding-right: 15px;}
}




/* 반응형 모바일 대응 */
@media (max-width: 768px) {


	#header { position: fixed;width: 100%;height: 55px;left: 0;top: 0;z-index: 100;}
    .footer-content {
        grid-template-columns: 1.5fr 1fr; /* 모바일에서는 한 줄씩 */
        gap: 40px;
    }
    .footer-logo {
        text-align: center;
    }
    .logo-text {
        font-size: 20px;
    }
}


@media (max-width:480px) {	
	
	.footer-content {
        grid-template-columns: 1fr; /* 모바일에서는 한 줄씩 */
        gap: 20px;
    }

}