@charset "utf-8"; 
html, body{width: 100%;}
body {width:100%; min-width: 1180px;}
table {width:100%; border-spacing:0; border-collapse:collapse;}
li {list-style:none;}

#wrapper{overflow-x: auto;}
@media (max-width: 1200px){
#wrapper {
    width: 1303px;
	}
}

#container{}

/*gnb*/
#header {width: 100%;}
.header.active{background: #fff; border-bottom: 1px solid #e7e7e7;}
#header div.headerWrap {position:relative; margin:0 auto; padding: 25px 0 10px; z-index:20; width:1300px; text-align: center;}
#header div.headerWrap .f_right{position: absolute; right: 37px; top: 26px; float: none;}
/* depth 1  */
#gnb {position:relative; margin:0 auto; width:100%;text-align: center; height: 90px;}
#gnb > span.bg {display:none;position:absolute;top:0px;z-index:-1;width:100%;height:170px;border-bottom:solid 2px #e7e7e7;background:#fff;}
#gnb > span.bg span {display:block;position:relative;}
#gnb:hover span.bg {display:block;}
#gnb > ul{display: inline-block;  width:1300px;}
#gnb > ul:after {clear:both; display:block;content:"";}
#gnb > ul > li {position:relative; float:left; width:14%;}
#gnb > ul > li:first-child:after{display:none;}
#gnb > ul > li > a {display:block; height:90px; line-height:24px; font-weight:400; font-size:16px; color:#1b1b1b; box-sizing:border-box; text-transform: uppercase; padding-top: 25px;}
.header.active #gnb > ul > li > a{color: #000;}
#gnb > ul > li > a:hover,
#gnb > ul > li > a:focus,
#gnb > ul > li > a:active,
#gnb > ul > li.hover > a {color:#1194ed; text-decoration:none;}
#gnb.open > ul > li:active > ul,
#gnb.open > ul > li:focus > ul,
#gnb.open > ul > li:hover > ul{display:block;}

/* depth 2 */
#gnb > ul > li > ul {display:none;  width:100%; padding-top:1rem; background:#fff; height:260px; border-top:1px solid #e7e7e7; box-sizing:border-box; z-index: 99999999;}
#gnb > ul:hover li ul {display:block;}
#gnb > ul > li:first-child > ul:before{content:"";position: absolute; z-index: -1; left:-1000%;  top: -1px; content: ""; display: block; border-top:1px solid #e7e7e7; box-sizing:border-box; background:#fff; height: 260px; padding-bottom:3px;width: 3000%; box-shadow:10px 10px 10px rgba(0,0,0,0.3); left: -2095%;}
#gnb > ul > li ul:after{position:absolute; top:0; left:0; content:""; display:block; width:1px; height:260px; background:#e7e7e7;}
#gnb > ul > li:first-child ul:after{display:none;}
#gnb > ul > li > ul > li {line-height:24px;}
#gnb > ul > li > ul > li > a {display:block; line-height:30px; font-size: 13px; letter-spacing: -0.4px; text-align:center; text-align:center;}
#gnb > ul > li > ul > li > a:hover {color: #1194ed; font-weight: 500;}
  
#content{margin: 0 auto; width: 100%; position: relative;}
#visual { width: 100%; margin: 0 auto;  transition: opacity 0.3s ease, transform 0.3s ease;}
.swiper { width: 100%; height: 788px; }
.swiper-slide { display: flex; align-items: center; justify-content: center; font-size: 24px; color: white; }
.bg1 { background:url("../images/slide/slide01.jpg") no-repeat center; }
.bg2 { background:url("../images/slide/slide02.jpg") no-repeat center; }

.bg1-1 { background:url("../images/slide/slide01-01.jpg") no-repeat center; }
.bg2-1 { background:url("../images/slide/slide02-02.jpg") no-repeat center; }
.slideTitle{position: absolute; top: 108px; z-index: 1; left: 50%; transform: translate(-50%,0);}

.slidePrev, .slideNext{opacity: 0; transform: translateX(-30px); transition: opacity 0.4s ease-out, transform 0.4s ease-out; pointer-events: none; /* 숨겨진 동안 클릭 방지 */}
#visual:hover .slidePrev{display: flex; background: #0000009c; padding: 10px ; border-radius: 14px; height: 65px !important; width: 65px !important; color: #fff; opacity: 1; transform: translateX(0); pointer-events: auto; /* 보일 때 클릭 가능 */}
#visual:hover .slideNext{display: flex; background: #0000009c; padding: 10px ; border-radius: 14px; height: 65px !important; width: 65px !important; color: #fff; opacity: 1; transform: translateX(0); pointer-events: auto; /* 보일 때 클릭 가능 */}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after{color: #fff;}
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after{color: #fff;}

/*count*/
.specific-countdown{position: absolute;top: 441px; z-index: 1111; background: linear-gradient(90deg, #01439996, #00a8e494, #136bb694); padding: 10px 30px; border-radius: 57px; left: 50%; transform: translate(-50%, 10px); border: 2px solid #fff; padding: 18px 30px;}
.number{font-family: 'GmarketSansBold'; color: #fff; font-size: 27px; margin-right: 10px;}
.label{color: #fff; margin-right: 14px; font-family: 'GmarketSansLight';}

.count{position: absolute; top: 738px; z-index: 111; left: 50%; transform: translate(-50%,-90%);}
.countlist{display: flex; gap:11px;}
.countlist li{padding: 22px 30px; border-radius: 12px; width: 402px; background: #ffffffcc;}
.countlist li.ing{background: linear-gradient(45deg, #09b8b6, #1193ee); color: #fff;}
.countlist li h3{font-size: 19px; font-family: 'GmarketSansBold'; border-top: 1px solid #e5e5e5; padding-top: 18px; margin-top: 7px; margin-bottom: 0;}
.countlist li>div{display: flex; align-items: self-end; justify-content: space-between;}
.countlist li>div>p{letter-spacing: -0.5px;}

.countdown{background: #fff; padding: 10px 30px; border-radius: 26px;}
.ing{background: linear-gradient(45deg, #09b8b6, #1193ee); color: #fff !important;}
.countdown>div{}
.countdown>div>span{font-family: 'GmarketSansBold'; font-size: 18px; color: #081c6b; font-size: 20px;}
.countdown>div>span>font{font-size: 23px; margin-left: 2px; margin-right: 2px;}
.ing>div>span{color: #fff;}

#sec_box{width: 1303px; margin: 0 auto;}
.sec2{display: flex; justify-content:space-between; padding: 55px 30px; gap:37px; align-items: end;}
div.newsBox{width: 56%;}
div.newsBox h1{margin: 0; font-size: 1.75rem; font-family: 'GmarketSansBold'; margin-bottom: 39px;}
.newslist{position: relative;}
.newslist .slick-list{overflow: hidden; height: 71px !important;}
.newslist li{display: flex; justify-content: space-between; align-items: center; font-size: 14px; letter-spacing: -0.3px; margin-bottom: 13px; padding-bottom: 7px; position: relative; padding-left: 19px; border-bottom: 2px solid #f5f5f5;}
.newslist li::after{position: absolute; display: block; content: ""; width: 7px; height: 7px; background: #b4b4b4; border-radius: 90px; left: 0;}
.newslist li span{color: #918d8d; font-size: 1em;}
.slick-prev:before,.slick-next:before{display: none;}
.newslist>.slick-prev{top: -47px; left: 581px; background: url("../images/main/down-arrow.png") no-repeat; width: 43px; height: 42px;}
.newslist>.slick-next{top: -47px; right: 0; background: url("../images/main/up-arrow.png") no-repeat; width: 43px; height: 42px;}

div.downBox{width: 44%;}
.downloadList{display: flex; align-items: center; justify-content: space-between; gap:14px;}
.downloadList li{width: 50%; height: 143px;}
.downloadList li a{display: block; text-align: center; border: 2px solid #e7e7e7; padding: 28px 0; border-radius: 21px; font-size: 1.06em; font-family: 'GmarketSansBold'; height: 143px;}
.downIcon{margin-bottom: 10px; transition: .3s ease;}
.downloadList li a:hover .downIcon{padding-top: 10px; margin-bottom: 0;}

/*pl*/
#plBox{background: url("../images/main/plbg.jpg")no-repeat center; width: 100%; height: 345px;}
#plBox .plDiv{width: 1303px; margin: 0 auto;}
#plBox .plDiv h1{margin: 0; font-size: 1.75rem; font-family: 'GmarketSansBold'; margin-bottom: 39px; padding-top: 38px; color: #fff; text-align: center;}
.plList{display: flex; gap:10px; position: relative; justify-content: center;}
.plList .slick-list{width: 1114px; overflow: hidden;}
.plList  .slick-track{display: flex; gap:10px;}
.plList li{display: flex; align-items: center; gap:10px; background: #fff; width: 33.333% !important; padding: 14px 14px 0; border-radius: 25px;}
.plList li div img{display: block;}
.plList li div p.Tit{color: #051761; font-family: 'GmarketSansBold'; font-size: 17px;}
.plList li div p.name{font-family: 'GmarketSansBold'; margin-top: 17px;}
.plList li div p.name span.aff{color: #6a6a6a; font-style: italic; display: block; font-size: 11px;}

.plList>.slick-prev{top: 50%; left: 0; background: url("../images/main/pl-left.png") no-repeat; width: 47px; height: 81px;}
.plList>.slick-next{top: 50%; right: 0; background: url("../images/main/pl-right.png") no-repeat; width: 47px; height: 81px;}

/*org*/
.orgBox{width: 1303px; margin: 0 auto; display: flex; gap:74px;}
.org{ gap:10px; padding: 24px 30px;}
.org h1{margin: 0; font-family: 'GmarketSansBold'; font-size: 1.2em; margin-bottom: 15px;}
.orList{display: flex; gap:10px 30px; align-items: center; flex-wrap: wrap;}
.orList li{display: flex; gap:10px;}
.orList li img{display: block;}


/*footer*/
footer{border-top: 2px solid #eeeeee; padding: 33px 0;}
.footerInner{width: 1303px; margin: 0 auto; text-align: center;}
.footerInner h1{margin-top: 0; font-family: 'GmarketSansBold'; font-size: 1.2em; text-align: center; margin-bottom: 6px;}
.footerInner p{font-size: 0.88em; text-align: center;}
.footerInner span{display: inline-block; margin-left: 15px; margin-right: 15px;}
.alink{color: #063884;}
.alink:hover{text-decoration: underline; text-underline-offset: 6px;}