/* popup_notice */
	.popup_notice{width: 400px;height: 476px;position: absolute;top: 200px;right: 10%;z-index: 9;background: #292C2F url('/images/common/popup_notice.png') center center no-repeat;	background-size:100% auto ;}
	.popup_notice .text{width: 360px;height: 165px;margin: 180px auto 0;display: flex; align-items: center; justify-content:center; }
	.popup_notice .date{width: 360px;height: 44px;margin: 8px auto 0;line-height: 44px;color: #fff;text-align: center;}
	.popup_notice .date > strong{color: #FFDD00;}

	@media (max-width:992px){
		.popup_notice{right: 2%;}
	}

	@media (max-width:768px){
		.popup_notice{width: 100%;height: 376px;position:static;background-size:auto 100% ;padding-top: 144px;margin-bottom: 2px;}
		.popup_notice .text{width: 260px;height: 130px;margin: 0 auto;}
		.popup_notice .date{width: 300px;height: 34px;margin: 0 auto;line-height: 34px;padding-top: 4px;}
	}

/* popup */
    .popup_wrap{position:absolute;top:200px;right:calc(10% + 410px);z-index:10;}
    .popup_wrap > .popup_common{width:372px;height: 440px;display:none;}

    .popup_wrap_grid{position:absolute;top:130px;right:10px;display: flex;gap:6px; flex-wrap:wrap; z-index:9;}
    .popup_wrap_grid > .popup_common{width:400px;height: 600px;display:none;}

    .popup_common img{width:100%;height: 100%;}

    .popup_close{height:36px;line-height:36px;display: flex;justify-content:space-between;padding: 0 8px;background-color: #000;}
    .popup_close > a{color:#fff; font-size:14px;}
    .popup_close > a:hover{color: #C3AD98;}

    .swiper-slide > a{display: inline-block;width:372px;height: 440px;}
    .swiper-slide > a > img{width:100%;height: 100%;}
    .swiper-pagination-bullet {width: 20px !important;height: 20px !important;text-align: center;line-height: 20px;font-size: 12px;color: #000;opacity: 1;background: rgba(0, 0, 0, 0.2);}
    .swiper-pagination-bullet-active {color: #fff;background: #007aff;}
    .swiper-button-next, .swiper-button-prev{color: rgba(255,255,255,.3) !important;}

    @media (max-width:992px){
        .popup_wrap{right:calc(2% + 410px);}
    }

    @media (max-width:768px){
        .mobile_wrap{position: absolute;top: 70px;left: 0;width: 90%;left: 5%;z-index:10;}
        .popup_wrap{position: static;}
        .popup_wrap > .popup_common{width:100%;}
        .popup_wrap_grid{position: relative;min-height: 376px;top: 0px;}
        .popup_wrap_grid > .popup_common{position: absolute;width: 100%;}
        .popup_common img{width:100%;height: auto;}
        .popup_common,
        .swiper-slide > a{width:100%;height:384px;}
    }
	


/* common*/
section.section{padding: 120px 0;}
body{background-color: #fff !important;}
.quick-menu{display: none;}

.main-btn-wrap{text-align: center;margin-top: 80px;}
.main-title{text-align: center;margin-bottom: 80px;}
.main-title div:first-child{font-size: 40px;font-family: 'Noto Serif KR';color: #333;font-weight: 200;text-transform: uppercase;}
.main-title div:last-child{font-size: 20px;}
.bg-color{background-color: var(--bg-color);}

.btn-more{color: #fff;background-color: var(--main-color);text-transform: uppercase;padding:14px 40px;position: relative;}
.btn-more:hover{background-color: #0f532f;color: #fff;}
.btn-course{background-color: #fff;border-color: #ddd; border-radius: 10px;}
.btn-course:hover{background-color: #eee;border-color: #ccc;}

@media (max-width: 1200px) {
    section.section{padding: 100px 0;}
}

@media (max-width: 768px) {
    section.section{padding: 50px 0;}
    .main-btn-wrap{margin-top: 40px;}
    .main-title{margin-bottom: 40px;padding: 0 14px;}
    .section{padding: 50px 0;}
    .facility .main-title{margin: 0 !important;}
    .facility .main-btn-wrap{margin: 0 !important;}
    .main-title div:first-child{font-size: 36px;}
    .main-title div:last-child{font-size: 16px;}
}

/* Hero Section */
#hero.hero {padding: 0;margin: 0;width: 100%;height: 100vh;position: relative;overflow: hidden;display: block;line-height: 0;}
.hero_text{position: absolute;top: 60%;left: 10%;z-index:8;color: #fff;font-weight: 100;animation-name: fadeUpAniMainText; animation-duration: 6s; animation-fill-mode: forwards; animation-iteration-count: infinite;}
.hero_text > div:nth-child(1){font-size: 2.3rem;font-family: 'Noto Serif KR';line-height: 1.2;}
.hero_text > div:nth-child(2){font-size: 1.5rem;padding-top: 40px;line-height: 1.5;}

/* Hero Video Styles */
#hero video {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;object-fit: cover;display: block;margin: 0;padding: 0;}

@media (max-width: 768px) {
  #hero video {width: 100%;height: 100%;object-fit: cover;}
  .hero_text{left: 10px;top: 70%;}
		.hero_text > div:nth-child(1){font-size: 1.5rem;line-height: 2rem;letter-spacing: -0.05em;}
		.hero_text > div:nth-child(2){font-size: 14px;padding-top: 20px;}

}

/* Hero Carousel Styles - Only for #hero-carousel */
#hero-carousel.carousel {width: 100%;height: 100vh;padding: 0;margin: 0;background-color: var(--background-color);position: relative;}
#hero-carousel .carousel-inner {width: 100%;height: 100vh;position: relative;}
#hero-carousel .carousel-item {width: 100%;height: 100vh;position: relative;overflow: hidden;}
#hero-carousel .carousel-item img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: block;object-fit: cover;object-position: center;z-index: 1;}
#hero-carousel .carousel-item:before {content: "";background: var(--background-color);position: absolute;inset: 0;z-index: 2;}
.hero .carousel-container {position: absolute;inset: 90px 64px 64px 64px;display: flex;justify-content: center;align-items: center;flex-direction: column;z-index: 3;color: #fff;}

@keyframes fadeInUp {
  from {opacity: 0;transform: translate3d(0, 100%, 0);}
  to {opacity: 1;transform: translate3d(0, 0, 0);}
}

@keyframes fadeInDown {
  from {opacity: 0;transform: translate3d(0, -100%, 0);}
  to {opacity: 1;transform: translate3d(0, 0, 0);}
}

/* scroll down */
.scrolldown_icon{position: absolute;bottom: 50px;left:50%; transform:translateX(-50%);z-index:7;}
.sceoll-container {display: flex;justify-content: center;align-items: center;width: 10rem;height:10rem;overflow: hidden;pointer-events: none;}
.chevron {position: absolute;width: 2.1rem;height: 0.48rem;opacity: 0;transform: scale(0.3);-webkit-animation: move-chevron 3s ease-out infinite;animation: move-chevron 3s ease-out infinite;}
.chevron:first-child {-webkit-animation: move-chevron 3s ease-out 1s infinite;animation: move-chevron 3s ease-out 1s infinite;}
.chevron:nth-child(2) {-webkit-animation: move-chevron 3s ease-out 2s infinite;animation: move-chevron 3s ease-out 2s infinite;}
.chevron:before,
.chevron:after {content: "";position: absolute;top: 0;height: 100%;width: 50%;background: #fff;}
.chevron:before {left: 0;transform: skewY(30deg);}
.chevron:after {right: 0;width: 50%;transform: skewY(-30deg);}

@-webkit-keyframes move-chevron {
  25% {opacity: 1;}
  33.3% {opacity: 1;transform: translateY(2.28rem);}
  66.6% {opacity: 1;transform: translateY(3.12rem);}
  100% {opacity: 0;transform: translateY(4.8rem) scale(0.5);}
}

@keyframes move-chevron {
  25% {opacity: 1;}
  33.3% {opacity: 1;transform: translateY(2.28rem);}
  66.6% {opacity: 1;transform: translateY(3.12rem);}
  100% {opacity: 0;transform: translateY(4.8rem) scale(0.5);}
}

@media (max-width:768px){
  .scrolldown_icon{display: none;}
} 

/* course */
.course{background-color: #F3F4F3;}
.course-img{width: 100%;height: 590px;background: url('/images/main-course.jpg') center center no-repeat;background-size: cover;border: 4px solid #fff;}
.course-img-text{position: absolute;bottom: 20px;left: 20px;width: 90%;color: #fff;}
.course-img-text > div:nth-child(1){font-size: 30px;font-family: 'Noto Serif KR';}

.course-list{display: flex;gap: 20px;margin-bottom: 20px;}
.course-list > a{display: block;flex:1;background-color: #fff;height: 286px;padding: 35px;line-height: 1.2;border: 1px solid #fff;transition: border-color 0.1s ease;}
html:not(.no-js) .course-list > a[data-aos^=flip]{transition-property: transform, border-color;}
.course-list > a > div:nth-child(1){font-size: 34px;margin-bottom: 70px;}
.course-list > a > div:nth-child(2){display: flex;align-items: center;justify-content: space-between;font-size: 20px;}
.course-list > a > div:nth-child(2) i{color: #ddd;font-size: 40px;transition: all 0.3s ease;}
.course-list > a > div:nth-child(3){font-size: 14px;margin-top: 20px;}
.course-list > a:hover{border-color: #eee;}
.course-list > a:hover > div:nth-child(2) i{color: var(--sub-color);}

.course-logo{background-color: #0B3022;width: 100%;height: 280px;display: flex;align-items: center;justify-content: center;}

/* clubhouse */
.clubhouse{background-color: #0B3022;color: #eee;padding: 100px 0 150px;}
.clubhouse ul > li:nth-child(1)::before{content: 'SOCIAL HERITAGE';font-size: 14px;font-family: 'pretendard';color: var(--main-color);position: absolute;left: 0;top: -20px;letter-spacing: 0.3rem;}
.clubhouse ul > li:nth-child(1){font-size: 56px;line-height: 1.2;font-family: 'Noto Serif KR';position: relative;margin-bottom: 50px;margin-top: 100px;}
.clubhouse ul > li:nth-child(2){line-height: 1.7;color: rgba(255,255,255,0.7);margin-bottom: 200px;}

.clubhouse-img1{width:528px;height: 670px;background: url('/images/club-intro.jpg') center center no-repeat;background-size: cover;}
.clubhouse-img2{width: 300px;height: 300px;background: url('/images/facil-restaurant_01.jpg') center center no-repeat;background-size: cover;position: absolute;right: 0;bottom: -60px;border: 8px solid #0B3022;}



/* contact */
section.contact{width: 100%;height: 500px;position: relative;}
.main-contact-info{color: #fff;position: absolute;top: 50px;left: 50px;z-index:2;background-color: var(--sub-color);padding: 50px 70px;}
.main-contact-info a{color: #fff;}
.main-contact-info > div:nth-child(1){font-size: 32px;margin-bottom: 30px;line-height: 1.2;font-weight: 200;}

@media (max-width: 1200px){
    .clubhouse-img1{width: 100%;}
    .main-contact-info{padding: 30px 30px;}
    .main-contact-info > div:nth-child(1){font-size: 26px;}
}

@media (max-width: 992px){
    .course-img{height: 300px;}
    .clubhouse ul > li:nth-child(1){margin-top: 0;}
    .clubhouse ul > li:nth-child(2){margin-bottom: 50px;}
    .clubhouse .row > div:nth-child(1){margin-bottom: 100px;}
}

@media (max-width: 768px){
    .course-img-text > div:nth-child(1){font-size: 18px;}
    .course-img-text > div:nth-child(2){font-size: 14px;}
    .course-list{display: block;gap: 0px;margin-bottom: 0px;}
    .course-list > a{height: auto;}
    .course-list > a > div:nth-child(1){margin-bottom: 20px;}
    .course-logo{height: auto;padding: 14px;}

    .clubhouse ul > li:nth-child(1){font-size: 40px;}
    .clubhouse ul > li:nth-child(2){font-size: 14px;}
    .clubhouse-img1{height: 400px;}
    .clubhouse-img2{width: 200px;height: 200px;}

    section.contact{height: auto;}
    .main-contact-info{position: static;top: 0;left: 0;width: 100%;}
}