.main_visual { 
    height: 100vh; 
    width: 100%; 
    overflow-x: hidden; 
    position: relative; 
}
.main_visual .swiper { 
    width: 100%; 
    height: 100%; 
}
.main_visual .swiper-slide { 
    background-position: center; 
    background-size: cover; 
    display: flex; 
    align-items: flex-end; 
    justify-content: flex-start; 
}
.main_visual .swiper-slide.slide1 { 
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), url('../img/main_img01.jpg'); 
}
.main_visual .swiper-slide.slide2 { 
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), url('../img/main_img02.jpg'); 
}
.main_visual .swiper-slide.slide3 { 
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), url('../img/main_img03.jpg'); 
}
.main_visual .swiper-slide.slide4 { 
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), url('../img/main_img04.jpg'); 
}
.main_visual .swiper-slide.slide5 { 
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), url('../img/main_img08.jpg'); 
}
.main_visual .swiper-slide.slide6 { 
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), url('../img/main_img06.jpg'); 
}
.main_visual .swiper-slide.slide7 { 
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), url('../img/main_img05.jpg'); 
}
.main_visual .swiper-slide.slide8 { 
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), url('../img/main_img05.jpg'); 
}
.main_visual .swiper-slide.video-slide, 
.main_visual .swiper-slide.youtube-slide { 
    background-image: none; 
}

.main_visual .swiper-slide .visual-tit { 
    color: #fff; 
    text-align: left; 
    position: absolute; 
    bottom: 150px; 
    left: 150px; 
    z-index: 2; 
    padding: 0 20px; 
}
.main_visual .swiper-slide .title { 
    font-weight: 500; 
    line-height: 1.5; 
    font-size: 3.5vw; 
font-family: 'YESMyoungjo-Regular';
text-shadow: 2px 2px 5px #000;
text-shadow: 1px 1px 10px #000;
}
.main_visual .swiper-slide .description { 
    font-size: 1.5vw; 
    color: #fff; 
    opacity: 1;
text-shadow: 1px 1px 2px #000;
text-shadow: 1px 1px 5px #000;
}
.video-background { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
}
.video-slide::before, 
.youtube-slide::before { 
    content: ''; 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background: rgba(0, 0, 0, 0); 
    z-index: 1; 
}
.main_visual .nav-and-scroll { 
    position: absolute; 
    bottom: 50px; 
    right: 150px; 
    display: flex; 
    align-items: center; 
    z-index: 100; 
}
.main_visual .nav-buttons { 
    display: flex; 
    margin-right: 10px; 
}
.main_visual .swiper-button-next, 
.main_visual .swiper-button-prev { 
    position: relative; 
    width: 80px; 
    height: 80px; 
    border-radius: 50%; 
    border: 1px solid rgba(255, 255, 255, 0.2); 
    background-color: transparent; 
    transition: all ease 0.3s; 
    margin: 0 5px; 
}
.main_visual .swiper-button-prev { 
    background: url('../img/main_arrow01.png') no-repeat center; 
}
.main_visual .swiper-button-next { 
    background: url('../img/main_arrow02.png') no-repeat center; 
}
.main_visual .swiper-button-prev::after, 
.main_visual .swiper-button-next::after { 
    content: ''; 
}
.main_visual .swiper-button-prev:hover, 
.main_visual .swiper-button-next:hover { 
    border-color: #fff; 
}
.main_visual .scroll_move { 
    width: 80px; 
    height: 80px; 
    display: flex; 
    justify-content: center; 
    align-items: center; 
    border-radius: 50%; 
    background-color: rgba(255, 255, 255, 0.2); 
    animation: moveUpDown 2s infinite; 
}
.main_visual .scroll_move .scroll_icon { 
    font-size: 30px; 
    color: #fff; 
    line-height: 1; 
    animation: bounce_frames 0.5s alternate infinite cubic-bezier(0.5, 0.05, 1, 0.5); 
}
@keyframes moveUpDown { 
    0%, 100% { 
        transform: translateY(0); 
    } 
    50% { 
        transform: translateY(-10px); 
    } 
}
@keyframes bounce_frames { 
    from { 
        transform: translateY(0); 
    } 
    to { 
        transform: translateY(5px); 
    } 
}

/* 애니메이션 스타일 */
@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translate3d(-40px, 0, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}
.main_visual .swiper-slide .title,
.main_visual .swiper-slide .description {
    opacity: 0;
    animation-duration: 1s;
    animation-fill-mode: both;
}

.main_visual .swiper-slide-active .title {
    animation-name: fadeInLeft;
    animation-delay: 0.5s;
}
.main_visual .swiper-slide-active .description {
    animation-name: fadeInLeft;
    animation-delay: 1s;
}

@media screen and (max-width: 768px) {
    .main_visual .swiper-slide .title { font-size: 8vw; }
    .main_visual .swiper-slide .description { font-size: 3.5vw; word-break: keep-all; line-height: 1.65 }
    .main_visual .nav-and-scroll { bottom: 10px; right: 10px; }
    .main_visual .swiper-button-next, .main_visual .swiper-button-prev, .main_visual .scroll_move { width: 50px; height: 50px; }
    .main_visual .scroll_move .scroll_icon { font-size: 16px; }
    .main_visual .swiper-slide .visual-tit { bottom: 100px; left: 20px; }
}

@media screen and (max-width: 480px) {
    .main_visual .nav-buttons { display: none }
    .main_visual .swiper-slide .visual-tit { bottom: 50px; left: 10px; }
}





.section02 { width: 100% ;}
.section02 .inner {flex-direction: row; display: flex;/* display: inline-flex; */ flex-wrap: wrap; justify-content: space-between; align-items: stretch;max-width: 1500px; margin: 0 auto; padding: 0 20px; }
.section02 .left {display:block;  width: 100%; max-width: 800px;}
.section02 .left h2 { font-size: 30px; font-weight: bold; line-height: 1.2; }
.section02 .right {display:block;  width: 100%; max-width: 800px;}
.section02 .righth2 { font-size: 30px; font-weight: bold; line-height: 1.2; }
@media screen and (max-width: 768px)  {
	.section02 .left {margin-top: 30px;} 
}
@media screen and (min-width: 1200px) {
    .section02 { padding: 80px 0; }
    .section02 .left { width: 45%; }
    .section02 .right { width: 45%; }
    .section02 .left h2 { font-size: 25px; }
    .section02 .right h2 { font-size: 25px; }
}


@media (max-width: 768px) {
    .section02 { width: 100% ;padding-bottom: 0px}
}

.section03 { position: relative; height: 700px; display: flex; color: white; overflow: hidden; margin: 0 0 0 0 }
.section03 .background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center; filter: brightness(0.9); transition: opacity 1.5s ease; }
.section03 #background1 { z-index: 1; }
.section03 #background2 { z-index: 2; opacity: 0; }
.section03 .content-wrapper { position: relative; z-index: 3; display: flex; flex-direction: column; justify-content: center; padding: 0 0 0 18%; width: 70%; overflow: hidden; }
.section03 .content { transition: transform 0.75s ease, clip-path 0.75s ease; }
.section03 .content.fade-out { transform: translateY(-20px); clip-path: inset(0 0 100% 0); }
.section03 .content.fade-in { transform: translateY(0); clip-path: inset(0 0 0 0); }
.section03 .title { font-family: 'YESMyoungjo-Regular';font-size: 55px; margin-bottom: 0.5em; }
.section03 .description { font-size: 30px; max-width: 600px; opacity: 0.8;  line-height: 1.6; word-break: keep-all}
.section03 .menu { position: absolute; right: 0; top: 0; height: 100%; width: 25%; padding: 1em; display: flex; flex-direction: column; justify-content: center; z-index: 4; overflow-y: auto; }
.section03 .menu-item { display: flex; align-items: center; cursor: pointer; transition: background-color 0.3s ease; padding: 0.8em 2.1em; white-space: nowrap; font-size: 20px; opacity: 0.8 }
.section03 .menu-item:hover { opacity: 1}
.section03 .menu-item img { width: 24px; height: 24px; margin-right: 0.5em; }
.section03 .menu-item.active {  opacity: 1 }
.section03 .icons { position: absolute; top: 1em; right: 1em; display: flex; gap: 1em; z-index: 5; }
.section03 .icon { width: 24px; height: 24px; background-color: white; border-radius: 50%; }

@media (max-width: 768px) {
    .section03 { padding-bottom: 120px; /* 메뉴 높이만큼 여백 추가 */ }
    .section03 .title { font-size: 32px; margin-bottom: 0.5em; }
    .section03 .content-wrapper { width: 100%; height: 380px; padding: 5%; text-align: center; background-color: rgba(0, 0, 0, 0); }
    .section03 .description { max-width: 100%; }
	.section03 .background {height: 380px; }
	.section03 #background2 {background-size:200%;}
    .section03 .menu { bottom: 130px; left: 0; top: auto; width: 100%; height: auto; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; padding: 0.5em; overflow-y: auto; z-index: 10; /* 다른 요소들 위에 나타나도록 z-index 높임 */ }
    .section03 .menu-item {margin:2px 0;background:rgba(0,0,0,1); flex: 0 0 100%;box-sizing: border-box; justify-content: center; padding: 0.8em 0.5em; }
    .section03 .menu-item img { margin-right: 0.3em; }
}




.section01 { width: 100%; padding: 50px 0;background-color:#f9f8f4; }
.section01 .inner { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; max-width: 1600px; margin: 0 auto; padding: 0 20px; }
.section01 ul.m_nav {width:100%;margin:0 auto;}
.section01 ul.m_nav li {width:25.33%;margin:0 4%;float:left;text-align:center;background-color:#fff;padding:50px 0;box-shadow:8px 8px 5px rgb(230,228,221);}
.section01 ul.m_nav li img {width:60%;margin-bottom:20px;}
.section01 ul.m_nav li h2 {font-family: 'YESMyoungjo-Regular'; font-size: 30px; font-weight: bold; line-height: 1.5; }
.section01 ul.m_nav li p { font-size: 16px; color: #555; line-height: 1.65; }
.section01 .left { width: 100%; max-width: 600px; margin-bottom: 30px; }
.section01 .left h2 { font-size: 36px; font-weight: bold; line-height: 1.2; }
.section01 .right { width: 100%; max-width: 800px; }
.section01 .right p { font-size: 16px; color: #555; line-height: 1.65; }
@media screen and (max-width: 768px)  {
    .section01 { padding: 80px 0; }
    .section01 .left, .section01 .right { width: calc(50% - 20px); margin-bottom: 0; }
    .section01 .left h2 { font-size: 48px; }
    .section01 .right p { font-size: 17px; }
	.section01 ul.m_nav {width:100%;}
	.section01 ul.m_nav li {width:100%;margin:2% 0;}
}
@media screen and (min-width: 1200px) {
    .section01 { padding: 100px 0 50px 0; }
    .section01 .left { width: 40%; }
    .section01 .right { width: 55%; }
    .section01 .left h2 { font-size: 60px; }
    .section01 .right p { font-size: 18px; }
}


.section04 { width: 100%; padding: 20px 0 80px 0;background: url('../img/month_bg.jpg') no-repeat center; }
.section04 .inner {width:100%;overflow: hidden; padding:0 4%;}
.section04 .header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 40px; padding: 0 20px }
.section04 .title { font-size: 50px; font-weight: bold;  }
.section04 .model { font-size: 25px; color: #555; }
.section04 .info { text-align: left }
.section04 .info dl { margin-bottom: 20px; }
.section04 .info dt { font-size: 18px; font-weight: bold; margin-bottom: 10px; }
.section04 .info dd { font-size: 18px; margin-bottom: 10px; color: #555}
.section04 .info dt:first-child { font-size: 19px; }
.section04 .info dt strong { font-weight: bold; }
.section04 .pension_roll-swiper { width: 100%; height: 457px; position: relative; }
.section04 .pension_roll-swiper .swiper-slide { width: 100%; }
.section04 .pension_roll-swiper .swiper-slide img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; }
.section04 .pension_roll-nav { position: absolute; bottom: 20px; right: 20px; display: flex; align-items: center; z-index: 10; }
.section04 .pension_roll-pagination { font-size: 18px; margin-right: 20px; color: #fff }
.section04 .pension_roll-pagination .current-slide { font-weight: 700; color: #fff }
.section04 .pension_roll-pagination .total-slides { font-weight: 500; color: #fff }
.section04 .pension_roll-buttons button { background: none; border: none; font-size: 24px; cursor: pointer; padding: 0 10px; color: #fff }
.section04 .pension_roll-buttons button i { color: #fff }
  
@media (max-width: 768px) { 
 .section04 .header { flex-direction: column; align-items: flex-start; } 
 .section04 .info { text-align: left; margin-top: 20px; }
	.section04 {background: url('../img/month_bg.jpg') no-repeat bottom center #f9f8f4;}
 }


   


.section05 { width: 100%; overflow: hidden; } 
.section05 .container { max-width: 1600px; margin: 0 auto; padding: 0 20px; } 
.section05 .top { display: flex; justify-content: space-between; margin-bottom: 50px; } 
.section05 .top .left { width: 45%; } 
.section05 .top .left span { font-size: 14px; display: block; margin-bottom: 50px; } 
.section05 .top .left h2 { font-size: 50px; font-weight: bold; margin: 0; font-family: "Playfair Display", serif; } 
.section05 .top .right { width: 50%; } 
.section05 .top .right p { margin: 0; max-width: 490px; color: #555; line-height: 1.65; font-size: 18px; word-break: keep-all; } 
.section05 .top .right span { display: block; font-weight: 700; padding: 100px 0 20px 0; color: #1a1a1a; font-size: 25px; } 
.section05 .img_roll { width: 100%; height: 800px; position: relative; } 
.section05 .swiper-container { width: 100%; height: 100%; } 
.section05 .swiper-slide { width: 100%; height: 800px; overflow: hidden; } 
.section05 .swiper-slide img { width: 100%; height: 100%; object-fit: cover; } 
.section05 .bottom { position: relative; height: 300px; } 
.section05 .recruit-box { position: absolute; top: -150px; left: 0; width: 45%; height: 300px; background-color: white; display: flex; align-items: center; padding: 0 50px 0 320px; box-sizing: border-box; z-index: 2; } 
.section05 .recruit-box h3 { font-size: 24px; margin: 0; margin-right: 100px; } 
.section05 .recruit-box p { margin: 0; font-size: 18px; color: #555; max-width: 500px; line-height: 1.65; word-break: keep-all; } 
.section05 .swiper-pagination { position: absolute; right: 50px; bottom: 20px; width: auto; display: flex; flex-direction: row; justify-content: flex-end; } 
.section05 .swiper-pagination-bullet { margin: 0 5px; } 

@media (max-width: 1024px) { 
    .section05 .top .left h2 { font-size: 44px; } 
    .section05 .top .right p { font-size: 16px; } 
    .section05 .img_roll, .section05 .swiper-slide { height: 600px; } 
    .section05 .recruit-box { width: 60%; padding: 0 40px 0 200px; } 
    .section05 .recruit-box h3 { margin-right: 50px; } 
}

@media (max-width: 768px) { 
    .section05 .top { flex-direction: column; } 
    .section05 .top .left, .section05 .top .right { width: 100%; } 
    .section05 .top .left h2 { font-size: 36px; margin-bottom: 30px; } 
    .section05 .top .right span { padding: 30px 0 20px 0; font-size: 20px; } 
    .section05 .img_roll, .section05 .swiper-slide { height: 400px; } 
    .section05 .bottom { height: auto; } 
    .section05 .recruit-box { position: relative; top: 0; width: 100%; height: auto; flex-direction: column; align-items: flex-start; padding: 30px; } 
    .section05 .recruit-box h3 { margin: 0 0 20px 0; } 
    .section05 .recruit-box p { font-size: 16px; } 
}








.section06 { width: 100%; padding: 0; }
.section06 .container { max-width: 1600px; margin: 0 auto; padding:0; display: flex; flex-wrap: wrap; }
.section06 .house-image { flex: 3; max-width: 40%; padding-right: 20px; }
.section06 .house-image img { width: 100%; height: auto; object-fit: cover; }
.section06 .content { flex: 2; max-width: 60%; padding-left: 280px; display: flex; flex-direction: column; justify-content: center; }
.section06 h2 { font-size: 50px; margin-bottom: 20px;    font-family: "Playfair Display", serif; max-width: 450px }
.section06 p { margin-bottom: 30px; font-size: 18px; color: #555; line-height: 1.65; word-break: keep-all; max-width: 560px; }
.section06 .features { display: flex; flex-wrap: wrap; margin: -10px; /* Negative margin to counteract padding */ }
.section06 .feature { width: calc(50% - 20px); padding: 20px; display: flex; align-items: center; }
.section06 .feature-icon { margin-right: 10px; }
.section06 .feature-icon img { width: 24px; height: 24px; }
.section06 .feature span { flex: 1;  font-size: 18px}

@media (max-width: 1200px) { 
    .section06 .house-image, .section06 .content { flex: 100%; max-width: 100%; padding: 0; } 
    .section06 .house-image { margin-bottom: 20px; } 
}

@media (max-width: 768px) { 
    .section06 h2 { font-size: 32px; } 
    .section06 .feature { width: 100%; } 
}




.section07 { width: 100%; overflow: hidden; }
.section07 .room { display: flex; width: 100%; }
.section07 .left-side { width: 60%; position: relative; overflow: hidden; }
.section07 .right-side { width: 40%; padding: 60px; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center;  background-color: #252525}
.section07 .logo { position: absolute; top: 20px; left: 20px; z-index: 10; color: #fff; font-weight: bold; }
.section07 .swiper-section07 { width: 100%; height: 100%; }
.section07 .swiper-section07 .swiper-slide img { width: 100%; height: 100%; object-fit: cover; }
.section07 .pagination-section07 { position: absolute; bottom: 20px; left: 20px; z-index: 10; }
.section07 .dots-section07 { display: flex; }
.section07 .dot-section07 { width: 10px; height: 10px; background: rgba(255, 255, 255, 0.5); border-radius: 50%; margin-right: 10px; cursor: pointer; }
.section07 .dot-section07.active { background: #fff; }
.section07 .side-nav-section07 { position: absolute; bottom: 20px; right: 20px; z-index: 10; }
.section07 .swiper-button-prev-section07, .swiper-button-next-section07 { background: none; border: none; color: #fff; font-size: 24px; cursor: pointer; }
.section07 #room-info-section07 h2 { margin-bottom: 20px; font-size: 50px; color: #fff;     font-family: "Playfair Display", serif; }
.section07 #room-info-section07 p { margin-bottom: 60px; font-size: 18px; color: #fff; opacity: 0.8 }
.section07 .room-details { margin-bottom: 30px; }
.section07 .room-details div { display: flex; justify-content: space-between; margin-bottom: 10px; color: #fff; font-size: 18px }
.section07 .learn-more { align-self: flex-start; padding: 10px 0px; color: #fff; border: none; cursor: pointer; background-color: transparent;}

@media (max-width: 768px) { 
    .section07 .room { flex-direction: column; }
    .section07 .left-side, .section07 .right-side { width: 100%; }
    .section07 .right-side { padding: 20px; }
}









/*.section08 { width: 100%; padding: 150px 0}
.section08 .image-container { width: 100%; height: 40vw; max-height: 640px; position: relative; overflow: hidden; }
.section08 .swiper { width: 100%; height: 100%; }
.section08 .swiper-slide img { width: 100%; height: 100%; object-fit: cover; }
.section08 .content-wrapper { display: flex; position: relative; margin-top: -120px; }
.section08 .content-box { background-color: rgba(96, 108, 56, 0.8); color: white; padding: 20px; width: 300px; height: 283px; display: flex; flex-direction: column; justify-content: flex-end; margin-left: 50px; z-index: 1; }
.section08 .content-box h2 { font-size: 24px; margin-bottom: 50px; font-family: "Playfair Display", serif;}
.section08 .side-content { background-color: rgba(255, 255, 255, 0.8); padding: 150px 20px 20px; width: calc(100% - 400px); max-width: 800px; margin-left: 50px; align-self: flex-end; }
.section08 .side-content p { font-size: 18px; margin: 20px 0 10px; color: #555; line-height: 1.65; word-break: keep-all }
.section08 .read-more { color: #606c38; text-decoration: none; display: inline-block; margin-top: 10px; font-weight: bold; }
.section08 .swiper-custom-nav { position: absolute; bottom: 50px; right: 50px; display: flex; align-items: center; color: white; z-index: 10; }
.section08 .swiper-custom-fraction { margin: 0 10px; display: flex; align-items: baseline; }
.section08 .swiper-custom-current { font-size: 24px; font-weight: bold; }
.section08 .swiper-custom-separator { font-size: 16px; margin: 0 2px; }
.section08 .swiper-custom-total { font-size: 16px; margin-left: 5px; }
.section08 .swiper-button-prev, .section07 .swiper-button-next { position: static; width: 30px; height: 30px; margin: 0; color: #fff; }
.section08 .swiper-button-prev:after, .section07 .swiper-button-next:after { font-size: 18px; }

@media (max-width: 1024px) { 
	.section08 .content-wrapper { flex-direction: column; margin-top: 0; } 
    .section08 .content-box { width: calc(100% - 40px); height: auto; margin-left: 20px; margin-right: 20px; margin-top: -80px; } 
    .section08 .side-content { width: calc(100% - 40px); max-width: none; margin-left: 20px; margin-right: 20px; margin-top: 20px; }
    .section08 .swiper-custom-nav { bottom: 20px; right: 20px; } 
}

*/
