@charset "utf-8";
@font-face {
font-family:'GmarketSansMedium';
src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
font-weight:normal;
font-style:normal;
}
@font-face {
font-family:'GmarketSansBold';
src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
font-weight:normal;
font-style:normal;
}

/* 메인 배너 미사용으로 header에 임시 배경색 적용 */
.header{background:#000!important;}

/* CSS Document */
button{display:inline-block;background:transparent;font-size:inherit;font-weight:normal;font-family:inherit;color:inherit;cursor:pointer;}
.clearfix:after {display:block;visibility:hidden;clear:both;content:".";overflow:hidden;width:0;height:0;font-size:0;line-height:0;}
.clearfix {display:inline-block;}
* html .clearfix {height:1%;}
.clearfix {display:block;}
.clear {clear:both;}
.hide {display:none;}
.skip,.blind{position:absolute;width:1px;height:1px;margin:0;padding:0;background:none;font-size:3px;color:transparent;line-height:0;}
.hidden_txt{overflow:hidden;position:absolute;width:0;height:0;background:transparent;font-size:0;line-height:0;text-indent:-9999px;border:none !important;background:transparent !important;}


.mainW .gnb{display: none!important}
.mainW .mainMenu{display: flex;color: #FFFFFF;position: absolute;right: 218px;top: 29px;align-items: center;}
.mainW .mainMenu .mgnb{font-size: 30px; display: flex}
.mainW .mainMenu .mgnb li{margin-right: 30px;font-weight: 700;}
.mainW .d-day{display: flex;align-items: center;margin-right: 30px;}
.mainW .ddaytit{ text-transform: capitalize;  margin-right: 10px;   text-align: right;   font-weight: 700;}
.mainW .ddaym .bc{display: inline-block; width: 40px;height: 60px; /*background: #231f20;*/font-weight: 700;font-size: 40px;text-align: center;margin-right: 5px;line-height: 60px;}
.mainW .ddaym .w1 { width:40px}
.mainW .ddaym .w2 { width:60px}
.mainW .ddaym .w3 { width:80px}
.mainW .ddaym .bcm{ font-weight: 700;   font-size: 50px;   margin-right: 5px;}
.mainW .ddaym{display: flex;align-items: center;}
.header-nav-wrapper .mainW .ddaym .bc{ color: #fff;}
.navbar-fixed-top .mainW .ddaym .bc{color:#222;}
/*main gnb 미디어쿼리*/
@media (max-width:1600px){
	.mainW .mainMenu .mgnb{font-size:20px}
}

@media (max-width:1400px){
	.ddaytit{display: none;}
	.mainW .mainMenu .mgnb li{margin-right:2vmin;}
}


/*공통*/
.section_title {font-weight:700; font-size: 36px ; letter-spacing: -2px;}
.sec_tit_h3{ font-weight:600; font-size: 30px ;}
.sec_tit_h5{font-weight:600; font-size: 20px ; word-break: keep-all; line-height: 1.4; }
.tab_container { width:100%;}
.tab_content { display: none !important; }
.tab_content.active { display: block !important; }
.swiper-button-prev, .swiper-button-next{width:100%; height:100%; left:auto; right:auto; top:0;}
.swiper_btn{position:relative; display: flex; flex-flow:row nowrap; gap:5px; z-index: 5;}
.swiper_btn li{position: relative; width:36px; aspect-ratio: 1/1; border-radius: 30px;}
.swiper_btn li:has(.swiper-button-prev){background:#ddd;}
.swiper_btn li:has(.swiper-button-next){background:#222; }
.swiper_btn li .swiper-button-prev{ color:#222;}
.swiper_btn li .swiper-button-next{ color:#fff;}
.swiper_btn li:has(.btn_more){box-sizing: border-box; border:1px solid #ddd; background: #fff; text-align: center; align-content: center;}
.swiper_btn li .btn_more{width:28px;}
@media (max-width:700px){
	.section_title {font-size: 26px; }
	.sec_tit_h3{font-size: 24px; }
	.sec_tit_h5{ font-size:15px; line-height: 1.1;}
	.swiper_btn li{width:32px;}
}

/*프로그램*/
.program_section {padding:80px 0 70px; position: relative; overflow: hidden;}
.main_tit_wrap{display: flex; justify-content: space-between; align-items: center; margin-bottom:20px;}
.pro_tit{display: flex; align-items: center; column-gap: 10px;}
.pro_tit .section_title{margin-bottom:0;}
.program_tab {display:flex; gap:0; list-style:none; padding:0; margin-left:auto; margin-right:10px; }
.program_tab li {color:#222; font-weight:400; font-size: 17px ;  margin:0 12px 0 0; cursor:pointer; padding:0 12px 8px 12px; position:relative; background:none; border-bottom:2px solid transparent; transition:.2s;}
.program_tab li[rel="tab1"].active {font-weight:700; border-bottom:2px solid #222; color:#111;}

/* 우측 밖에서 슬라이드
.program_section .tab_container{ overflow: hidden; margin-left:calc( (100% - 1400px) / 2 ); max-width:2000px; width: 98%; }*/
.program_section .tab_container{max-width:1700px; width:100%; margin:0 auto ; padding-left:0.5px; overflow: hidden; position: relative;}
.program_section .tab_container:before,
.program_section .tab_container:after{display: inline-block; content:""; position:absolute; z-index: 2; width:130px; height:55px;background:radial-gradient(#ffffffd4 20%, #ffffff00 80%);  }
.program_section .tab_container:before{bottom:30px; left:-60px;  }
.program_section .tab_container:after{bottom:30px; right:-60px; }
.program_item .pro_img{box-sizing: border-box; border:1px solid #e9e9e9; border-radius:16px 16px 8px 8px; overflow:hidden;  box-shadow:0 2px 8px rgba(0,0,0,0.04); width:100%; aspect-ratio: 1/1;}
.program_item img {width:100%; height:100%; object-fit:cover; transition:.2s;}
.program_item:hover img {transform:scale(1.03); }
.program_info {background:#fff; box-sizing: border-box; text-align: center; padding:24px 30px; border-radius:8px 8px 16px 16px; border:1px solid #e9e9e9; transition:.2s; box-shadow:0 0 60px 0 rgba(0,0,0,.08);}
.program_item:hover .program_info{box-shadow:0 8px 24px rgba(0,0,0,0.10);}
.program_info sup {display:inline-block;  margin-bottom:5px; color:#676767;  font-size:14px; line-height: 1.1; font-weight:600; min-height:30px; align-content: center; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.program_info h5 {margin-bottom:4px; min-height:56px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.program_info p {font-size:14px; color:#c0c0c0; margin-top:20px;}
.pro_bar_wrap{z-index: 5; position:relative; max-width:1400px; width:98%; /*margin:30px auto 0 200px;*/ margin:50px auto 0; display: grid; grid-template-columns: calc(100% - 330px) 320px; column-gap: 10px; align-items: center; justify-content: space-between;}
.pro_btn{display: flex;}
.pro_btn a[class*="down"]{display:inline-block; padding:9px 15px; border-radius:20px;}
.pro_btn .probook_down{ background:linear-gradient(90deg,#fd487c 20%,#fd992c 80%); color:#fff; }
.pro_btn .procal_down{border:1px solid #fd487c; color:#fd487c;}
.pro_bar_wrap .swiper-pagination-progressbar{height:3px; position: relative; width:100%; background:#f8f8f8; border-radius: 20px;}
.pro_bar_wrap .swiper-pagination-progressbar-fill{background:linear-gradient(90deg,#fd487c 20%,#fd992c 80%); border-radius: 20px;}
@media (max-width:1400px){
	.program_section .tab_container{margin-left:1%;}
	.pro_bar_wrap{ margin:30px auto 0 1%;}
}
@media (max-width:1024px) {
  	.tabs li { padding:0 8px  8px;}
  	.program_tab {margin:10px 0;}

	.main_tit_wrap {display: grid; grid-template-columns: repeat(2, 1fr);}
	.main_tit_wrap .swiper_btn {justify-self: flex-end;}
	.program_section{padding:50px 0 }
	.program_item .pro_img{aspect-ratio: 1/0.9;}
	.program_info{padding:16px 30px;}
	.program_info sup{font-size:12px;}
	.program_info h5{font-size:18px; margin-top:-5px;}
	.program_info p{margin-top:5px;}
}
@media (max-width:720px) {	
	.program_tab li{font-size:15px;}
	.program_info h5{min-height:50px; font-size: 15px; line-height: 1.2;}
	.pro_bar_wrap{display: flex; flex-flow:column wrap; justify-content: center;}
	.pro_bar_wrap .swiper-pagination-progressbar{display: none;}
	.pro_btn{width: 98%;}
	.pro_btn li{flex:1;}
	.pro_btn a[class*="down"]{width:100%; box-sizing: border-box; text-align: center;}
	.pro_tit{order:1;}
	.main_tit_wrap .swiper_btn{order:2;}
	.program_tab{order:3; grid-column: 1/5; width:100%; border-bottom:1px solid #ddd;}
	.program_tab li{flex:1; margin:10px 0 0 0;}
	
}

/*프로그램 swiper 로딩시 이미지만 크게 보이는 문제 수정*/
.spin_wrap{position:relative;}
.spin_wrap:not(.swiper-initialized) .swiper-slide img {   display: none;}
.spin_wrap.swiper-initialized .swiper-slide img {  display: block;}
.spin_wrap:not(.swiper-initialized) .swiper-wrapper {  visibility: hidden;}
.loading-spinner { position: absolute; top: 200px; left: 50%; transform: translate(-50%, -50%);   z-index: 10;  width: 50px; height: 50px; border: 5px solid #f3f3f3; border-top: 5px solid var(--main-color);  border-radius: 50%;
  animation: spin 1s linear infinite;
}
.spin_wrap.swiper-initialized .loading-spinner { display: none;}
@keyframes spin {
  	0% { transform: translate(-50%, -50%) rotate(0deg); }
  	100% { transform: translate(-50%, -50%) rotate(360deg); }
}

/*공지사항*/
.notice_section {padding:60px 0;  background:#fafafa; position:relative; overflow: hidden;}
.notice_swiper,
.news_swiper {margin-top:20px; padding-bottom:40px; overflow: hidden;}
.notice_item {min-height:150px; background:#fff; border:1px solid #f1f1f1; border-radius:12px; padding:30px; box-shadow:0 2px 8px rgba(0,0,0,0.04); transition:.2s;}
.notice_item:hover {box-shadow:0 8px 24px rgba(0,0,0,0.10);}
.notice_date {font-size:14px; color:#b6b6b6;}
.notice_item h5 { line-height: 1.4; font-size:18px; margin:8px 0 16px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.notice_item p {line-height: 1.5; font-size:16px; color:#888; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }

.news_container{margin-top: 15px; border-top: 1px solid #e9e9e9; padding-top: 40px;}
@media (max-width:700px) {
	.notice_section{padding:50px 0 20px;}
	.notice_swiper, .news_swiper{margin-top:0px;}
	.notice_item{min-height: 115px;}
	.notice_item h5 { font-size:16px; }
	.notice_item h5{line-height: 1.2; margin:8px 0;}
	.notice_item p{-webkit-line-clamp: 2; line-height: 1.2; font-size:15px; }
}

/*비디오*/
.video_section {margin:60px auto; overflow: hidden;}
.video_item .vid_img{width: 100%; aspect-ratio:16/9 ; }
.video_item img {width:100%; height:100%; object-fit:cover; border-radius:12px; transition:.2s;}
.video_item img:hover {filter:brightness(0.8);}
.video_item h5 {margin-top:10px; word-break: keep-all;}
@media (max-width:700px) {
	.video_section{margin:60px auto 0;}
}


/*sns*/
.sns_section {margin:40px auto 80px; border-top:1px solid #ededed; padding-top:40px;}
.sns_list {display:grid; grid-template-columns:repeat(4,1fr); grid-template-rows:repeat(2,1fr); gap:14px; justify-items:center; align-items:center;}
.sns_item{width:100%; border:1px solid #ddd; box-sizing: border-box; aspect-ratio: 310 / 415; background: #ddd; border-radius:12px; overflow: hidden;}
.sns_item img {width:100%; height:100%; object-fit:cover; transition:.2s;}
.sns_item img:hover {transform:scale(1.08);}
@media (max-width:700px) {
  .sns_section{display: flex; flex-flow:column wrap; margin:40px auto 50px;}
  .sori_letter .container, .letter_tit{flex-flow:column; justify-content: center;}
  .letter_tit{gap:5px;}
  .sns_list{gap:0;}
}

/*소리레터*/
.sori_letter{padding:28px 0; background:linear-gradient(90deg,#fd487c 20%,#fd992c 80%); color:#fff; }
.sori_letter .container{display: flex; justify-content: space-between; align-items: center;}
.letter_tit{display: flex; align-items: center; gap:15px;}
.letter_btn {background:#fff; color:#fd487c; border:none; border-radius:20px; padding:7px 28px; font-size:16px; font-weight:700; cursor:pointer; transition:.2s;}
.letter_btn:hover {background:#ffe3e3;}
.letter_sns{display: flex; gap:10px;}
.swiper-button-next, .swiper-button-prev {color:#e91e63;}
@media (max-width:700px) {
  .letter_tit{gap:5px;}
  .letter_sns{gap:5px; margin-top:5px;}
  .letter_sns li img{width:32px;}
  .letter_btn{font-size:14px;}
}

/*협력사*/
.foot_banner {padding:28px 0;}
.foot_banner ul{text-align: center; display: flex; align-items: center; justify-content: space-between;}
.foot_banner ul:after{display:none}
