@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200..900&display=swap');
@font-face{font-family: 'Shilla_CultureB-Bold'; src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2206-02@1.0/Shilla_CultureB-Bold.woff2') format('woff2'); font-weight: 700; font-style: normal;}

:root {
   --main-color: #015965;
}
:root {
   --sub-color: #33b6aa;
}

/* 그누보드 팝업레이어 */
#hd_pop{width: 100%; z-index: 999999;}

@media screen and (max-width: 1024px){
/* 그누보드 팝업레이어 */
    .hd_pops{top: 80px!important; left: 10px!important; width: auto!important; max-width: calc(100% - 20px);}
    .hd_pops_con{width: auto!important; height: auto!important; min-width: 100px; min-height: 100px;}
}

/* 등록된 게시글 노노 */
.none{width: 100%!important; float: inherit!important; margin-right: 0!important; text-align: center!important; padding: 260px 0!important; color: #333; box-shadow: none!important; display: block!important; font-size: 22px; font-weight: 700; border: none!important; background: url('../img/no_notice_bg.png') no-repeat center center / cover; }

@media screen and (max-width: 1000px){
    .none{padding: 100px 0!important; font-size: 14px;}
}

*{letter-spacing: -0.3px; word-break: keep-all!important;}
.inner{width: 1240px; margin: auto;}

@media (max-width: 1280px){
    .inner{width: calc(100% - 40px);}
}

/* 상단 */
.head{position: fixed; top: 0; right: 0; left: 0; height: 100px; z-index: 9999; transition: all .3s;}
.head .logo{display: block; width: 80px; position: absolute; top: 50%; transform: translateY(-50%); left: 100px;  transition: all .3s;}
.head .logo img{max-width: 100%;}
.head .logo .on{display: none;}

.head .menu .gnb{position: absolute; top: 50%; transform: translateY(-50%); left: 180px; font-size: 0; text-align: center; display: block;}
.head .menu .gnb>li{display: inline-block; margin-left: 90px; position: relative;}
.head .menu .gnb>li>a{display: block; line-height: 100px; font-size: 18px; color: #fff; font-weight: 400; position: relative;}
.head .menu .gnb>li>a>img{max-width: 15px; position: absolute; top: 50%; transform: translateY(-50%); right: 0; transition: all 0.3s; display: none;}

.head .menu .sub{position: absolute; top: 100%; left: 50%; transform: translateX(-50%);background: var(--main-color); z-index: -10; text-align: center; opacity: 0; visibility: hidden; display: none; width: 200px;  padding: 20px 0;}
.head .menu .sub>li+li{margin-top: 15px;}
.head .menu .sub>li>a{display: block; font-size: 16px; font-weight: 500; color: rgba(255,255,255,0.4);}

.head .menu .usr{position: absolute; top: 50%; transform: translateY(-50%); right: 100px;}
.head .menu .usr a{font-size: 16px; color: #fff; display: inline-block; margin-left: 30px;}
.head .menu .usr a:nth-of-type(1){margin-left: 20px;}
.head .menu .usr a img{max-width: 20px; margin-right: 5px;}
.head .menu .usr a .on{display: none;}

.head .menu .lang_select{display: inline-block; vertical-align: top;}
.head .menu .lang_select select{font-size: 16px; color: #fff; background: rgba(0,0,0,0); font-family: inherit; /* 폰트 상속 */
    border-radius: 0px; /* iOS 둥근모서리 제거 */
    -webkit-appearance: none; /* 네이티브 외형 감추기 */
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    margin: 0;
    overflow: visible;
    text-transform: none;
    vertical-align: middle; padding: 0 10px; cursor: pointer;}
.head .menu .lang_select select:focus{outline: none !important;      /* 외곽선 제거 */
  box-shadow: none !important;   /* 크롬/엣지 기본 블루 그림자 제거 */
  border-color: rgba(0,0,0,0) !important; border: none!important /* 클릭 시 border 색상 고정 */}
.head .menu .lang_select img{max-width: 20px; margin-right: -5px;}
.head .menu .lang_select .on{display: none;}
/* 드롭다운 옵션 */
select option {
  color: #333;            /* 옵션 텍스트 */
  background-color: #fff; /* 옵션 배경 */
    padding: 10px;
}


/* 상단 햄버거버튼 */
.bt_menu{position: absolute; text-indent: -9999px; top: 50%; transform: translateY(-50%); right: 20px; width: 20px; height: 16px; z-index: 11; display: none;}
.bt_menu span{position: absolute; left: 50%; transform: translateX(-50%); width: 100%; height: 2px; background: #fff; display: block; transition: all 0.3s;}
.bt_menu span:nth-child(1){top: 0px;}
.bt_menu span:nth-child(2){top: 50%; transform: translate(-50%, -50%);}
.bt_menu span:nth-child(3){bottom: 0px;}

.bt_menu.on span{background: var(--main-color);}
.bt_menu.on span:nth-child(1){transform : translateX(-50%) translateY(7px) rotate(-315deg)}
.bt_menu.on span:nth-child(2){opacity : 0;}
.bt_menu.on span:nth-child(3){transform : translateX(-50%) translateY(-7px) rotate(315deg);}

/* 상단 효과 */
.head.on{border-bottom: 1px solid #ddd; background: #fff;}
.head.on::before{border-bottom: 1px solid #ddd;}
.head.on .logo img.basic{display: none;}
.head.on .logo img.on{display: block;}
.head.on .menu .gnb>li>a{color: #333; font-weight: 500;}
.head.on .menu .usr a{color: #666; font-weight: 500;}
.head.on .menu .usr a .basic{display: none;}
.head.on .menu .usr a .on{display: inline-block;}
.head.on .menu .lang_select .basic{display: none;}
.head.on .menu .lang_select .on{display: inline-block;}
.head.on .menu .lang_select select{color: #666;}
.head.on .bt_menu span{background: var(--main-color);}


/* 상단 hover */
@media (min-width: 1024px){
    .head .menu .gnb>li:hover>a{color: var(--main-color);}
    .head .menu .gnb>li:hover .sub{opacity: 1; display: block; visibility: visible;}
    .head .menu .sub>li>a:hover{color: #fff; text-decoration: underline;}
    .head.on .menu .usr a:hover{color: var(--main-color);}
}

/* 상단 모바일 */
.head .menu.on{left: 0; right: 0;}
.head .menu.on li.on>a{color: var(--main-color);}
.head .menu.on li.on>a>img{transform: translateY(-50%) rotate(180deg);}

/* 탑버튼 */
.top_btn{position: fixed; bottom: 20px; right: 20px; width: 70px; height: 70px; border-radius: 50%; border: 2px solid #019692; color: #019692; font-size: 14px; flex-direction: column; align-items: center; justify-content: center; font-weight: 600; background: #fff; z-index: 999; display: none; cursor: pointer;}

/* 반응형 */
@media screen and (max-width: 1440px){
    .head .logo{left: 20px;}
    .head .menu .gnb{left: 100px;}
    .head .menu .gnb>li{margin-left: 60px;}
    .head .menu .usr{right: 20px;}

}
@media screen and (max-width: 1024px){
    .head{height: 70px;}
    .head .logo{width: 50px;}

    .head.on{height: 60px;}
    .head.on .logo{width: 40px;}

    .bt_menu{display: block;}

    .head .menu{position: fixed; top: 0; bottom: 0; left: 100%; right: -100%; background: #fff; transition: all 0.3s; z-index: 10; padding: 90px 20px 0; overflow: hidden; overflow-y: auto;}
    .head .menu .gnb{position: relative; top: auto; left: auto; right: auto; transform: inherit; text-align: left;}
    .head .menu .gnb>li{display: block; margin-left: 0;}
    .head .menu .gnb>li>a{line-height: 55px; font-weight: 600; color: #333;}
    .head .menu .gnb>li.more>a{pointer-events: none;}
    .head .menu .gnb>li>a>img{display: block;}

    .head .menu .sub{position: relative; top: auto; left: auto; right: auto; height: auto; box-shadow: none; visibility: visible; z-index: 0; padding: 15px 20px; text-align: left; opacity: 1; margin-bottom: 15px; transform: inherit; width: 100%;}
    .head .menu .sub>li>a{color: #fff;}

    .head .menu .usr{right: auto; transform: inherit; top: 27px; left: 20px; padding-right: 60px;}
    .head .menu .usr a img{max-width: 16px; margin-right: 2px;}
    .head .menu .usr a{color: #999!important; font-weight: 500; font-size: 14px;}
    .head .menu .usr a:nth-of-type(2){margin-left: 0;}
    .head .menu .usr a .basic{display: none;}
    .head .menu .usr a .on{display: inline-block;}
    .head .menu .usr .br{display: block; height: 10px;}

    .head .menu .lang_select img{max-width: 16px;}
    .head .menu .lang_select .basic{display: none;}
    .head .menu .lang_select .on{display: inline-block;}
    .head .menu .lang_select select{color: #999!important; font-weight: 500; font-size: 14px;}
}
@media screen and (max-width: 768px){
    .top_btn{width: 40px; height: 40px; font-size: 0; border: 1px solid #019692;}
    .top_btn img{max-width: 40%;}
}


/* 타이틀 */
.idx_txt{margin-bottom: 40px;}
.idx_txt h1{font-size: 34px; line-height: 1.3; color: #333;}
.idx_txt .color{color: var(--main-color);}
.idx_txt p{font-size: 18px; margin-top: 15px; color: #666; line-height: 1.3;}

/* 반응형 */
@media screen and (max-width: 1280px){
    .idx_txt{margin-bottom: 30px;}
    .idx_txt h1{font-size: 28px;}
    .idx_txt p{font-size: 16px;}
}
@media screen and (max-width: 1024px){
    .idx_txt h1{font-size: 25px;}
    .idx_txt p{margin-top: 10px;}
}
@media screen and (max-width: 768px){
    .idx_txt{margin-bottom: 20px;}
    .idx_txt h1{font-size: 22px;}
    .idx_txt p{font-size: 14px; margin-top: 5px;}
}

/* 슬라이드 화살표 */
.inx_arrow{width: 45px; height: 45px; border-radius: 50%; background: #fff; box-shadow: 0 0 5px rgba(0,0,0,0.2); margin-top: 0; transform: translateY(-50%);}
.inx_arrow::after{font-size: 15px; font-weight: bold; color: var(--main-color);}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{opacity: 0.5;}

/* 슬라이드 페이징 */
.inx_pag{width: 100%; margin-top: 20px; display: none; position: relative;}
.inx_pag span{margin: 0 2.5px; background: #ddd; opacity: 1;}
.inx_pag .swiper-pagination-bullet-active{background: var(--main-color); width: 20px; border-radius: 50px;}

@media screen and (max-width: 1440px){
    .inx_pag{display: block;}
    .inx_arrow{display: none;}
}


/* 메인 비주얼 */
.main_visual{position: relative; width:100vw; height:100dvh; overflow:hidden; color:#fff;}

/* 메인(배경) */
.main_visual .hero-main,
.main_visual .hero-main .swiper-slide{width:100%;height:100%}
.main_visual .hero-main .swiper-slide{background-image:var(--bg); background-size:cover;background-position:center;background-repeat:no-repeat; backface-visibility:hidden;transform:translateZ(0);}

/* 고정 상단 센터 */
.main_visual .hero-fixed-top{position:absolute; left:0; right:0; top:150px; z-index:5; text-align:center; display: none;}
.main_visual .hero-fixed-top h2{font-size: 24px; opacity: 0.9; font-weight: 500; font-family: "Noto Serif KR", serif; line-height: 1.3;}
.main_visual .fix_img{position: absolute; top: 150px; right: 100px; z-index: 99; width: 760px;}

/* 좌하(슬라이드 연동) */
.main_visual .hero-lb{position:absolute; left: 100px; bottom: 150px; z-index:5; max-width:40vw; text-shadow:0 2px 12px rgba(0,0,0,.4);}
.main_visual .hero-lb h3{font-size: 68px;line-height: 1.18;font-family: 'Shilla_CultureB-Bold';}
.main_visual .hero-lb p{margin-top: 20px; font-size: 20px; line-height: 1.3; font-weight: 300;  text-shadow: 2px 2px 5px rgba(0, 0, 0, 3);}
.main_visual .hero-lb a{display: inline-block; margin-top: 20px; font-size: 16px; opacity: 0.6; text-decoration: underline;}

/* hover */
@media (min-width: 1024px){
    .main_visual .hero-lb a:hover{opacity: 0.9;}
}

/* 우하 썸네일 래퍼 */
.hero-thumbs-wrap{position: absolute; right: 0; bottom: 150px; z-index: 6; max-width: calc(45vw + 90px);}

/* 슬라이드 폭을 컨텐츠만큼(auto)로, 줄 세우기 */
.hero-thumbs .swiper-wrapper{ align-items: center; }
.hero-thumbs .swiper-slide{
  width: auto !important;   /* ← 핵심 */
  flex: 0 0 auto;           /* 줄 바꿈/늘어남 방지 */
}

/* 썸네일 컨테이너 */
.hero-thumbs{position: relative; padding-left: 90px; overflow: hidden; /* 컨테이너 안에서만 자연스럽게 페이드 */ /* 좌측 70px 투명 → 내용 보임, 나머지는 그대로 */ -webkit-mask-image: linear-gradient(to right, transparent 0, black 90px, black calc(100% - 0px)); mask-image: linear-gradient(to right, transparent 0, black 90px, black calc(100% - 0px)); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;}

/* 깜빡임 방지 포인트: 'slidesPerView'를 고정 숫자로 쓰고, 슬라이드 width는 고정.
   활성 효과는 슬라이드 내부에서만 변화(레이아웃 재계산 X) */
.hero-thumbs .swiper-slide{position: relative;}

.hero-thumbs .thumb-img{
  width:150px; height:150px;
  border-radius:999px; overflow:hidden;
  background-size:cover; background-position:center;
  transition: width .35s ease, height .35s ease, transform .35s ease;
  border:3px solid #D9D2CA; cursor:pointer;
  margin:0;
}
.hero-thumbs .swiper-slide-thumb-active .thumb-img{width: 250px;}

.hero-thumbs .thumb-caption{
  opacity:0; transition:opacity .35s ease, transform .35s ease;
  color:#fff; margin-top:12px; font-size:16px; text-align:center; width: 100%; position: absolute; bottom: -50px; left: 0;
}
.hero-thumbs .swiper-slide-thumb-active .thumb-caption{ opacity:1; transform:none }

.hero-thumbs .thumb-title{font-weight:700; font-size:14px; line-height:1.25}
.hero-thumbs .thumb-desc{margin-top:2px; font-size:12px; opacity:.9}

/* 반응형 */
@media screen and (max-width: 1640px){
    .main_visual .fix_img{width: 45%;}
}
@media screen and (max-width: 1440px){
    .main_visual .hero-fixed-top h2{font-size: 1.53vw;}
    .main_visual .hero-lb h3{font-size: 4.17vw;}
    .main_visual .hero-lb p{font-size: 1.25vw;}
    .main_visual .fix_img{right: 40px; top: 20%;}
}
@media screen and (max-width: 1280px){
    .main_visual .hero-fixed-top h2{font-size: 1.72vw;}
    .main_visual .hero-lb{left: 0; padding: 0 20px; bottom: 100px; max-width: 45vw;}
    .main_visual .hero-lb h3{font-size: 4.30vw;}
    .main_visual .hero-lb p{font-size: 1.25vw;}
    .main_visual .hero-lb a{font-size: 1.25vw;}

    .hero-thumbs-wrap{bottom: 100px; max-width: 52vw;}
    .hero-thumbs .thumb-img{width: 120px; height: 120px;}
    .hero-thumbs .swiper-slide-thumb-active .thumb-img{width: 200px;}
    .hero-thumbs .thumb-caption{margin-top: 0.94vw; font-size: 1.25vw;}

    .main_visual .fix_img{top: 25%; right: auto; left: 20px; width: 50%;}
}
@media screen and (max-width: 1024px){
    .main_visual .hero-fixed-top{top: 9.77vw;}
    .main_visual .hero-fixed-top h2{font-size: 1.95vw;}

    .main_visual .hero-lb h3{font-size: 4.88vw;}
    .main_visual .hero-lb p{font-size: 1.56vw;}
    .main_visual .hero-lb a{font-size: 1.56vw;}

    .main_visual .hero-lb{bottom: auto; top: 65%; transform: translateY(-50%); left: 0; max-width: 100%;}
    .hero-thumbs-wrap{max-width: calc(100% + 40px); left: 0; bottom: 3.91vw;}
    .hero-thumbs{padding-left: 20px; mask-image: none;}
    .hero-thumbs .swiper-slide-thumb-active .thumb-caption{font-size: 1.56vw;}

    .main_visual .fix_img{top: 20%;}
}
@media screen and (max-width: 768px){
    .main_visual .hero-fixed-top{top: 13.02vw;}
    .main_visual .hero-fixed-top h2{font-size: 2.60vw;}
    .main_visual .fix_img{top: 17%; right: auto; left: 20px; width: 80%;}

    .main_visual .hero-lb h3{font-size: 6.51vw;}
    .main_visual .hero-lb p{font-size: 2.34vw;}
    .main_visual .hero-lb a{font-size: 2.08vw;}

    .hero-thumbs .swiper-slide-thumb-active .thumb-caption{font-size: 2.08vw;}
}
@media screen and (max-width: 480px){
    .main_visual .hero-fixed-top{top: 25.00vw;}
    .main_visual .hero-fixed-top h2{font-size: 3.75vw;}

    .main_visual .hero-lb{top: 60%;}
    .main_visual .hero-lb h3{font-size: 10.42vw;}
    .main_visual .hero-lb p{font-size: 3.75vw;}
    .main_visual .hero-lb p br{display: none;}
    .main_visual .hero-lb a{font-size: 3.33vw; opacity: 1;}

    .hero-thumbs-wrap{bottom: 10.67vw;}
    .hero-thumbs .thumb-img{width: 100px; height: 100px;}
    .hero-thumbs .swiper-slide-thumb-active .thumb-img{width: 150px;}
    .hero-thumbs .swiper-slide-thumb-active .thumb-caption{font-size: 3.33vw; margin-top: 1.67vw;}

}


/* 예약일 검색 */
.date_sch .input_box{display: flex; font-size: 16px; margin-top: -35px; z-index: 999; position: relative;}
.date_sch .input_box input{font-family: inherit; /* 폰트 상속 */
    border-radius: 0px; /* iOS 둥근모서리 제거 */
    -webkit-appearance: none; /* 네이티브 외형 감추기 */
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    margin: 0;
    overflow: visible;
    text-transform: none;
    vertical-align: middle;}
.date_sch .input_box input{background: #fff; width: 100%; height: 70px; line-height: 70px; padding: 0 20px; border: 1px solid #ddd;}
.date_sch .input_box input[type="date"]:valid{color:#cacaca;}
.date_sch .input_box input::placeholder{color: #cacaca;}
.date_sch .input_box .date{width: 250px;}
.date_sch .input_box .txt{width: calc(100% - 500px); margin-left: -1px;}
.date_sch .input_box button{background: var(--main-color); line-height: 70px; color: #fff; width: 250px;}

/* 예약일 키워드 */
.date_sch .keyword{margin-top: 20px; display: flex; align-items: flex-start;}
.date_sch .keyword p{font-size: 16px; color: var(--main-color); font-weight: 600; line-height: 27px;}
.date_sch .keyword ul{font-size: 0; margin-left: 20px;}
.date_sch .keyword ul li{border: 1px solid #ddd; border-radius: 50px; display: inline-block; margin-right: 10px; margin-bottom: 10px; overflow: hidden;}
.date_sch .keyword ul li a{font-size: 16px; font-weight: 300; color: #999; padding: 0 20px; line-height: 27px; display: block;}

/* 반응형 hover */
@media (min-width: 1024px){
    .date_sch .keyword ul li:hover a{color: #fff; background: var(--main-color); border-color: var(--main-color); transition: 0.3s; text-decoration: inherit;}
}

/* 반응형 */
@media screen and (max-width: 1024px){
    .date_sch .input_box{margin-top: -25px; margin: 20px 0 15px;}
    .date_sch .input_box input{height: 50px; line-height: 50px;}
    .date_sch .input_box .date{width: 25%;}
    .date_sch .input_box .txt{width: 50%;}
    .date_sch .input_box button{line-height: 50px; width: 25%;}

    .date_sch .keyword{margin-top: 0;}
    .date_sch .keyword p{font-size: 14px; line-height: 24px;}
    .date_sch .keyword ul{margin-left: 15px;}
    .date_sch .keyword ul li{margin-right: 5px; margin-bottom: 5px;}
    .date_sch .keyword ul li a{font-size: 14px; line-height: 24px; padding: 0 15px;}
}
@media screen and (max-width: 768px){
    .date_sch .input_box{flex-direction: column;}
    .date_sch .input_box input{height: 40px; line-height: 40px; padding: 0 15px; font-size: 14px;}
    .date_sch .input_box .date{width: 100%;}
    .date_sch .input_box .txt{width: 100%; margin-left: 0; margin-top: -1px;}
    .date_sch .input_box button{line-height: 40px; width: 100%; font-size: 14px;}

    .date_sch .keyword{flex-direction: column;}
    .date_sch .keyword p{width: 100%; line-height: inherit;}
    .date_sch .keyword ul{margin-left: 0; margin-top: 10px;}
    .date_sch .keyword ul li a{padding: 0 10px;}
}

/*퀵메뉴*/
.quick_menu{font-size: 0; margin-top: 80px; text-align: center; display: none;}
.quick_menu li{display: inline-block; width: calc(100% / 6); vertical-align: top;}
.quick_menu li a{display: inline-block;}
.quick_menu li .icon{width: 100px; height: 100px; background: #f7f7f7; border-radius: 50%; position: relative; margin: auto;}
.quick_menu li .icon img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 40%;}
.quick_menu li p{margin-top: 20px; font-size: 16px; font-weight: 500; color: #333;}

/* hover */
@media (min-width: 1024px){
    .quick_menu li:hover .icon{background: #fff; box-shadow: 0 0 10px rgba(1,89,101,0.2); transition: 0.5s;}
    .quick_menu li:hover p{color: var(--main-color); transition: 0.3s; text-decoration: underline;}
}

/* 반응형 */
@media screen and (max-width: 1024px){
    .quick_menu{margin-top: 60px;}
    .quick_menu li .icon{width: 80px; height: 80px;}
    .quick_menu li p{margin-top: 15px; font-size: 14px;}
}
@media screen and (max-width: 768px){
    .quick_menu{margin-top: 30px;}
    .quick_menu li{width: calc(100% / 3);}
    .quick_menu li:nth-child(1){margin-bottom: 30px;}
    .quick_menu li:nth-child(2){margin-bottom: 30px;}
    .quick_menu li:nth-child(3){margin-bottom: 30px;}
    .quick_menu li .icon{width: 70px; height: 70px;}
    .quick_menu li p{margin-top: 10px; font-size: 14px; line-height: 1.3;}
    .quick_menu li p .br{display: block;}
}


/* 주요 프로그램 */
.program{margin-top: 80px;}
.program .tab_list{margin-top: 25px; font-size: 0;}
.program .tab_list li{font-size: 16px; font-weight: 300; color: #999; border: 1px solid #ddd; line-height: 27px; padding: 0 20px; border-radius: 50px; display: inline-block; cursor: pointer; margin-right: 10px; margin-bottom: 10px;}
.program  .tab_list li+li{margin-left: 0!important;}
.program .tab_list li.on{color: #fff; background: var(--main-color); border-color: var(--main-color);}

/* 반응형 hover */
@media (min-width: 1024px){
    .program .tab_list li:hover{color: #fff; background: var(--main-color); border-color: var(--main-color); transition: 0.3s;}
}

/* 주요 프로그램 슬라이드 */
.program .pro_box{position: relative; display: none;}
.program #pro_box1{display: block;}
.program .pro_box .pro_slide{overflow: hidden;}
.program .pro_box .pro_slide .swiper-slide{padding: 0 15px 20px; border: 1px solid #eaeaea; height: 480px;}
.program .pro_box .pro_slide .img{width: 100%; object-fit: cover; overflow: hidden;}
.program .pro_box .pro_slide .img img{aspect-ratio: 1.396;}
.program .pro_box .pro_slide .txt{margin-top: 15px;}
.program .pro_box .pro_slide .txt h2{background: var(--main-color); color: #fff; font-size: 12px; line-height: 22px; padding: 0 10px; border-radius: 5px; display: inline-block; font-weight: 500; margin-right: 5px;}
.program .pro_box .pro_slide .txt h1{margin-top: 15px; font-size: 20px; font-weight: 600; color: #333; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.program .pro_box .pro_slide .txt p{margin-top: 10px; font-size: 14px; line-height: 1.3; color: #666; display: -webkit-box;        /* Flexbox 비슷하게 박스 처리 */
  -webkit-line-clamp: 3;       /* 보여줄 줄 수 */
  -webkit-box-orient: vertical;/* 세로 방향 */
  overflow: hidden;            /* 넘치는 내용 숨김 */
  text-overflow: ellipsis;     /* 일부 브라우저에서 필요 */ height: 3lh;}
.program .pro_box .pro_slide .info{position: absolute; bottom: 20px; left: 20px; width: calc(100% - 40px);}
.program .pro_box .pro_slide .info dl{display: flex; align-items: flex-start; font-size: 14px; margin-top: 7px;}
.program .pro_box .pro_slide .info dl dt{font-weight: 500; color: var(--main-color); width: 60px;}
.program .pro_box .pro_slide .info dl dt img{width: 17px; display: inline-block; vertical-align: middle; margin-right: 2px; position: relative; top: -1px;}
.program .pro_box .pro_slide .info dl dd{color: #333; width: calc(100% - 60px);}

/* 주요 프로그램 화살표 */
.program .pro_box .pro_next{right: -60px;}
.program .pro_box .pro_prev{left: -60px;}


/* hover */
@media (min-width: 1024px){
    .program .pro_box .pro_slide .swiper-slide:hover .txt h1{color: var(--main-color);}
    .program .pro_box .pro_slide .swiper-slide:hover .txt p{color: var(--main-color);}
    .program .pro_box .pro_slide .swiper-slide:hover .info dd{color: var(--main-color);}
}

/* 반응형 */
@media screen and (max-width: 1280px){
    .program{margin-top: 60px;}
    .program .pro_box .pro_slide .txt h1{font-size: 18px; margin-top: 10px;}
    .program .pro_box .pro_slide .swiper-slide{height: 510px;}
}
@media screen and (max-width: 1024px){
    .program .tab_list{margin-top: 20px;}
    .program .tab_list li{font-size: 14px;}
    .program .pro_box .pro_slide .swiper-slide{height: 550px;}
}
@media screen and (max-width: 768px){
    .program{margin-top: 30px;}
    .program .tab_list{margin-top: 15px;}
    .program .tab_list li{padding: 0 10px; margin-right: 5px; margin-bottom: 5px;}
    .program .pro_box .pro_slide .txt h1{font-size: 16px;}
    .program .pro_box .pro_slide .txt p{margin-top: 5px; -webkit-line-clamp: 2; height: 2lh;}
    .program .pro_box .pro_slide .swiper-slide{height: auto;}
    .program .pro_box .pro_slide .info{position: relative; bottom: auto; left: auto; margin-top: 20px; width: 100%;}
}

/* SNS */
.sns_sct{margin-top: 150px; display: flex;}
.sns_sct .idx_txt{width: 30%; padding-right: 5%; margin-bottom: 0;}
.sns_sct .idx_txt .sns_icon{margin-top: 50px;}
.sns_sct .idx_txt .sns_icon a{width: 25px; display: inline-block; margin-right: 20px;}
.sns_sct .idx_txt .sns_icon a img{max-width: 100%;}

/* SNS 슬라이드 */
.sns_sct .sns_box{width: 70%; position: relative;}
.sns_sct .sns_slide{overflow: hidden;}
.sns_sct .sns_slide .swiper-slide{display: block; position: relative;}
.sns_sct .sns_slide .swiper-slide .img{object-fit: cover; overflow: hidden;}
.sns_sct .sns_slide .swiper-slide .img img{aspect-ratio: 0.7;}
.sns_sct .sns_slide .swiper-slide .txt{opacity: 0; visibility: hidden; position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; background: rgba(0,0,0,0.5); color: #fff; padding: 20px; transition: all 0.5s;}
.sns_sct .sns_slide .swiper-slide .txt p{font-size: 14px; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; height: 2.6;}
.sns_sct .sns_slide .swiper-slide .txt span{font-size: 14px; margin-top: 10px; display: inline-block; opacity: 0.8;}

/* SNS 슬라이드 화살표 */
.sns_sct .sns_box .sns_next{right: -22.5px;}
.sns_sct .sns_box .sns_prev{left: -22.5px;}

/* 반응형 hover */
@media (min-width: 1024px){
    .sns_sct .sns_slide .swiper-slide:hover .txt{opacity: 1; visibility: visible;}
}

/* 반응형 */
@media screen and (max-width: 1280px){
    .sns_sct{margin-top: 90px;}
}
@media screen and (max-width: 1024px){
    .sns_sct{display: block;}
    .sns_sct .idx_txt{width: 100%; padding-right: 0; margin-bottom: inherit;}
    .idx_txt h1 br{display: none;}
    .sns_sct .idx_txt .sns_icon{margin-top: 10px;}
    .sns_sct .idx_txt .sns_icon a{width: 20px; margin-right: 10px;}

    .sns_sct .sns_box{width: 100%; margin-top: 30px;}
    .sns_sct .sns_slide .swiper-slide .txt{opacity: 1; visibility: visible; padding: 15px;}
}
@media screen and (max-width: 768px){
    .sns_sct{margin-top: 60px;}
    .sns_sct .sns_box{margin-top: 20px;}
}

/* 공지사항 */
.notice_sct{margin-top: 150px;}
.notice_sct .ns_row{display: flex;}
.notice_sct .ns_con{width: calc(100% / 2 - 10px); position: relative;}
.notice_sct .ns_con:first-of-type{margin-right: 20px;}
.notice_sct .ns_con .ns_list .none {background: url('../img/no_faq_bg.png') no-repeat center center / cover;}
.notice_sct .ns_con h1{font-size: 20px; font-weight: 600; color: #333;}
.idx_more{z-index: 9; font-size: 14px; font-weight: 500; color: var(--main-color);}
.notice_sct .ns_con .idx_more{position: absolute; top: 3px; right: 0;}
.notice_sct .ns_con .ns_list{margin-top: 20px;}
.notice_sct .ns_con .ns_list li{border-top: 1px solid #666; padding: 30px 20px;}
/* .notice_sct .ns_con .ns_list li:last-of-type{padding-bottom: 0!important;} */ /*노게시물 배경으로 삭제*/
.notice_sct .ns_con .ns_list li h2{font-size: 20px; font-weight: 600; color: #333; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.notice_sct .ns_con .ns_list li p{font-size: 14px; color: #999; line-height: 1.3; margin-top: 15px;overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.notice_sct .ns_con .ns_list li span{font-size: 14px; color: #999; display: inline-block; margin-top: 20px;}

/* hover */
@media (min-width: 1024px){
    .notice_sct .ns_con .ns_list li:hover h2{color: var(--main-color);}
    .notice_sct .ns_con .ns_list li:hover p{color: var(--main-color);}
    .notice_sct .ns_con .ns_list li:hover span{color: var(--main-color);}
}

/* 반응형 */
@media screen and (max-width: 1280px){
    .notice_sct{margin-top: 90px;}
    .notice_sct .ns_con h1{font-size: 18px;}
    .notice_sct .ns_con .ns_list li h2{font-size: 18px;}
}
@media screen and (max-width: 1024px){
    .notice_sct .ns_row{display: block;}
    .notice_sct .ns_con{width: 100%;}
    .notice_sct .ns_con:first-of-type{margin-right: 0; margin-bottom: 30px;}
}

@media screen and (max-width: 768px){
    .notice_sct{margin-top: 60px;}
    .notice_sct .ns_con h1{font-size: 16px;}
    .idx_more{font-size: 12px;}
    .notice_sct .ns_con .ns_list{margin-top: 10px;}
    .notice_sct .ns_con .ns_list li{padding: 15px 0;}
    .notice_sct .ns_con .ns_list li h2{font-size: 16px;}
    .notice_sct .ns_con .ns_list li p{margin-top: 5px;}
    .notice_sct .ns_con .ns_list li span{margin-top: 10px;}
}

/* FAQ */
.faq_sct{margin-top: 150px; background: #f9f9f9; padding: 100px 0;}
.faq_sct .idx_txt{position: relative;}
.faq_sct .idx_txt .idx_more{position: absolute; top: 20px; right: 0;}
.faq_sct .faq_list{font-size: 0; border-top: none;}
.faq_sct .faq_list li{position: relative; border: 1px solid #f5f5f5; display: inline-block; width: 100%; background: #fff; vertical-align: top;}
.faq_sct .faq_list li + li{margin-top: 10px;}
.faq_sct .faq_list li a{padding: 20px 20px 20px 55px; display: block;}
.faq_sct .faq_list li span{color: var(--main-color); font-size: 24px; font-weight: bold; position: absolute; top: 20px; left: 20px;}
.faq_sct .faq_list li h2{font-size: 16px; font-weight: 600; line-height: 1.3; color: #333; white-space: nowrap;      /* 줄바꿈 안 함 */
  overflow: hidden;         /* 넘치는 내용 숨김 */
  text-overflow: ellipsis;  /* 말줄임표(...) 표시 */}
.faq_sct .faq_list li p{font-size: 14px; line-height: 1.3; color: #666; margin-top: 10px; display: -webkit-box;        /* Flexbox 비슷하게 박스 처리 */
  -webkit-line-clamp: 2;       /* 보여줄 줄 수 */
  -webkit-box-orient: vertical;/* 세로 방향 */
  overflow: hidden;            /* 넘치는 내용 숨김 */
  text-overflow: ellipsis;     /* 일부 브라우저에서 필요 */}
.faq_sct .faq_list .none {background:url('../img/no_faq_bg.png') no-repeat center center / cover;}




.faq_sct .inner{display: flex; align-items: flex-start; justify-content: space-between;}
    .faq_sct .faq_left{width: calc(100% - 430px);}
    .faq_sct .faq_right{width: 400px; background: var(--sub-color); position: relative; overflow: hidden; padding: 30px; color: #fff;}
    .faq_sct .faq_right h1{font-size: 25px;}
    .faq_sct .faq_right p{margin-top: 10px; font-size: 16px; line-height: 1.3;}
    .faq_sct .faq_right .faq_logo{position: absolute; top: 5%; right: -23%; opacity: 0.05; max-width: 80%;}
    .faq_sct .faq_right ul{margin-top: 20px; z-index: 9; position: relative;}
    .faq_sct .faq_right ul li{border: 1px solid rgba(255,255,255,0.4);}
    .faq_sct .faq_right ul li+li{margin-top: 10px;}
    .faq_sct .faq_right ul a{display: block; padding: 20px; position: relative;}
    .faq_sct .faq_right ul h2{font-size: 18px; padding-right: 50px;}
    .faq_sct .faq_right ul span{display: block; margin-top: 5px; font-size: 14px; padding-right: 50px;}
    .faq_sct .faq_right ul .arrow{width: 30px; height: 30px; border-radius: 50%; background: rgba(255,255,255,0.2); position: absolute; top: 10px; right: 10px;}
    .faq_sct .faq_right ul .arrow img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 40%;}
    
    .faq_sct .none_img{padding: 160px 0!important;}
    
    /* hover */
    @media (min-width: 1024px){
        .faq_sct .faq_right ul li:hover{transition: 0.4s; background: #fff;}
        .faq_sct .faq_right ul li:hover h2{color: #333;}
        .faq_sct .faq_right ul li:hover span{color: #666;}
        .faq_sct .faq_right ul li:hover .arrow{background: var(--sub-color);}
    }

    /* 반응형 */
    @media screen and (max-width: 1280px){
        .faq_sct .faq_right h1{font-size: 20px;}
        .faq_sct .faq_right p{margin-top: 5px; font-size: 14px;}
        .faq_sct .faq_right p br{display: none;}
        .faq_sct .faq_right ul h2{font-size: 16px;}
        .faq_sct .faq_right ul span{font-size: 14px;}
    }
    @media screen and (max-width: 1024px){
        .faq_sct .inner{display: block;}
        .faq_sct .faq_left{width: 100%;}
        .faq_sct .faq_right{width: 100%; margin-top: 20px;}
    }
    @media screen and (max-width: 480px){
        .faq_sct .faq_right{padding: 20px;}
        .faq_sct .faq_right h1{font-size: 18px;}
        .faq_sct .faq_right p br{display: block;}
        .faq_sct .faq_right ul{margin-top: 10px;}
        .faq_sct .faq_right ul a{padding: 15px;}
    }



/* hover */
@media (min-width: 1024px){
    .faq_sct .faq_list li:hover{box-shadow: 0 0 10px rgba(1,89,101,0.2); transition: 0.5s;}
    .faq_sct .faq_list li:hover h2{color: var(--main-color);}
}

/* 반응형 */
@media screen and (max-width: 1280px){
    .faq_sct{margin-top: 90px; padding: 70px 0;}
}
@media screen and (max-width: 768px){
    .faq_sct{margin-top: 60px; padding: 40px 0;}
    .faq_sct .idx_txt .idx_more{top: 12px;}
    .faq_sct .faq_list li+li{margin-top: 5px;}
    .faq_sct .faq_list li a{padding: 15px 15px 15px 45px;}
    .faq_sct .faq_list li span{font-size: 20px; top: 15px; left: 15px;}
    .faq_sct .faq_list li h2{white-space: inherit; overflow: visible; text-overflow: inherit;}
    .faq_sct .faq_list li p{margin-top: 5px;}
}

/* 파트너사 */
.partner{margin-top: 150px;}
.partner .swiper-slide a{display: block; height: 50px; position: relative;}
.partner_slide img{max-width: 57%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

/* 하단 */
.foot{background: var(--main-color); padding: 50px 0; margin-top: 20px; color: #fff; font-size: 16px;}
.foot .inner{position: relative;}
.foot h2{font-weight: 500;}
.foot .ft_info{margin-top: 30px; font-size: 0;}
.foot .ft_info li{display: inline-block; font-size: 14px; margin-right: 20px; margin-bottom: 10px; font-weight: 300;}
.foot .ft_info li:last-of-type{margin-bottom: 0;}
.foot .ft_info li span{font-weight: 600; margin-right: 5px;}
.foot .ft_sns{position: absolute; top: 0; right: 0; display: flex;}
.foot .ft_sns li{margin-left: 10px;}
.foot p{font-size: 14px; font-weight: 300; margin-top: 30px;}

/* 반응형 */
@media screen and (max-width: 1280px){
    .partner{margin-top: 90px;}
}
@media screen and (max-width: 768px){
    .partner{margin-top: 60px;}
    .partner_slide img{max-width: 65%;}
    .foot{margin-top: 10px;}
    .foot .ft_info li{margin-bottom: 5px;}
    .foot .ft_sns{position: relative; margin-top: 20px;}
    .foot .ft_sns li{margin-left: 0; margin-right: 10px;}
}
