.sec-title .display-md{font-weight: bold;color:#fff;}
.sec-title .display-lg{font-weight: bold;color:#fff;}
.sec-title h5{font-weight:400;color:#fff;margin-bottom: 0 !important;opacity: .6 !important;}
.sec-title .title{display:flex;align-items:center;justify-content: space-between;}

a{transition: .2s;}
.main-btn {color:#999999;font-size:14px;font-weight: bold;display: inline-flex;align-items: center;}
.main-btn > span{padding-top:1px;line-height: 1;}
.main-btn i{color:#fff;font-size:12px;margin-left:8px;display: flex;align-items: center;justify-content: center;}
.main-btn:hover{color:#fff;}


.overflow-wrapper {overflow: hidden;width: 100%;}


/***************** section *****************/
.section{background-repeat: no-repeat;background-position: center;background-size: cover;}
.main-sec{height:100vh;}
.main-sec .container{display:flex;flex-flow: column;z-index: 1;position: relative;}
/*.main-sec .container::after{content: '';clear: both;display: block;}*/

#sec03{background-image: url("../img/main/section3.jpg");}
#sec04{background-image: url("../img/main/section4.jpg");}
#sec05{background-image: url("../img/main/section5.jpg");}

@media(max-width:1200px){
    .main-sec{height:100%;}

    .sec-title .title{flex-flow: column;align-items: flex-start;}
    .sec-title .title a{margin-top:3px;}

    .section,.fp-tableCell{height:100% !important;}
}




/***************** sec01 *****************/

#sec01 {pointer-events:none;padding: 0;position: relative;background-color: #000;width: 100%;height:auto;max-height:100vh;overflow: hidden;}
#sec01,#sec01 .fp-tableCell{ height:100vh !important;}

.video-bg {position: absolute;top: 0;left: 0;width: 100%;height: 100%;overflow: hidden;z-index: 0;}
.video-bg iframe {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 100vw;height: 56.25vw;min-height: 100vh;min-width: 177.78vh;pointer-events: none;}


/*.video-overlay {position: relative;z-index: 1;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;color: white;text-align: center;}*/

.scroll-line {position: absolute;left: 50%;bottom: 0;transform: translateX(-50%);display: flex;align-items: center;flex-direction: column;z-index:100;justify-content: center;transition: opacity 0.3s;opacity: 0;animation: scrollopc 0.9s 1s forwards;}
.scroll-line p {font-size:0.85rem;color: #fff;margin-bottom: 0.5rem;}
.scroll-line .line {position: relative;width: 0.1rem;height: clamp(4rem, calc(1.8vw + 3.5rem), 8rem);background-color: rgba(255, 255, 255, 0.7);overflow: hidden;z-index:100;}
.scroll-line .line::before {content: '';position: absolute;left: 0;top: 0;width: 0.2rem;height: clamp(1rem, 1.2944983819vw + 0.5145631068rem, 3rem);background-color: #fff;animation: scrolldown 2s ease-in infinite;}
@keyframes scrollopc { 0% {opacity: 0;} 100% {opacity: 1;} }
@keyframes scrolldown { 0% {top: -20%;} 100% {top: 120%;} }


@media(max-width:1920px){

}


/***************** sec02 *****************/
#sec02 { position: relative; width: 100%; height: 100vh; background-color: #000; }
.studio-map { width: 100%;position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); height: 100%; display: flex; align-items: center; justify-content: center; }
.image-container {position: relative;width: 100%;min-width: 960px;height: 100%; background-color: #000; }
.main-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.main-image.base { z-index: 1; transition: opacity 0.5s ease-in-out; }
.main-image.hover { z-index: 2; transition: opacity 0.5s ease-in-out; pointer-events: none; }

.image-container {
    pointer-events: auto;
}



@media (max-width: 1200px) {
    #sec02 {height: auto !important;}
    #sec02 .main-sec{padding-bottom:0;width:100%;overflow: hidden;}
    #sec02 .sec-title{text-align: left;margin-bottom: 0 !important;}
    #sec02 .container{margin-bottom: -8rem !important;z-index: 11;}

    .studio-map {overflow-x: scroll; z-index: 10;position: relative;bottom: 0;left: 0;transform: none;right: 0;top: 0;align-items: flex-start;justify-content: flex-start;}
    .image-container{overflow: hidden;}
    .image-container::after {content: "";position: absolute;top: 0;left: 0;width: 500%;height: 30%;background: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, .4) 50%, rgba(0, 0, 0, 0) 100%);pointer-events: none;z-index: 1;}

    .main-image{position: relative;top: 0;right: 0;left: 0;bottom: 0;}
    .main-image.hover{display:none;}
}




/***************** sec03 *****************/
.wrapper { display: flex; flex-direction: column; margin: auto; max-width: 100vw; }
body #sec03 .container{height:auto;}
.sec03-pt-wrap { position: relative; padding: 0; }
.sec03-swiper { width: 100%; height: 600px; overflow: hidden; }
.swiper-wrapper { transition-timing-function: linear !important; }
.swiper-slide { width: 716px; height: 500px; opacity: 1; }
.sec03-img { width: 716px; height: 500px; }
.sec03-img img { width: 100%; height: 100%; object-fit: cover; }

.sec03_contents{margin-top:30px;text-align: center;}
.sec03_contents h6{color:#fff;font-weight:normal;margin-bottom:0 !important;transition:0.3s;}

@media screen and (max-width:1920px) {
    .sec03-img, .swiper-slide { width: 536px; height: 375px; }
    .sec03_contents{margin-top: 20px; }
}

@media screen and (max-width:1600px) {
    .sec03-img, .swiper-slide { width: 358px; height: 250px; }
}
@media screen and (max-width: 1200px) {
    .sec03-swiper { height: auto; padding-bottom: 50px; }
    .sec03_contents { margin-top: 16px; }
}
@media screen and (max-width: 768px) {
    .sec03-img, .swiper-slide { width: 536px; height: 375px; }
    .sec03_contents { margin-top: 14px; }
}
@media screen and (max-width: 480px) {
    .sec03-img, .swiper-slide { width: 358px; height: 250px; }
}



/***************** sec04 *****************/
.sec04_pt_wrap { width: 100%; height: 100%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; }
.sec04_pt { width: 100%; cursor: pointer; }
.sec04_box { width: 100%; display: flex; flex-direction: column; }
.sec04_thumbnail {position: relative;overflow: hidden;display: flex;align-items: center;justify-content: center;height: 0;padding-bottom: 150%;max-height: none;transition: 0.4s;}
.sec04_thumbnail img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;}
.sec04_contents { margin-top: 30px; text-align: center;}
.sec04_contents h6 { color: #fff; font-weight: normal; transition: 0.3s; margin-bottom: 0 !important; }
.hover_effect:hover { transform: scale(1.03); }
.sec04_pt:hover .sec04_contents h6 { color: var(--secondary); }

@media screen and (max-width: 1920px) {
    .sec04_thumbnail {padding-bottom:110%;}
    .sec04_contents { margin-top: 20px; }
}

@media screen and (max-width: 1600px) {
    .sec04_thumbnail {padding-bottom:90%;}
}
@media screen and (max-width: 1200px) {
    .sec04_pt_wrap { grid-template-columns: repeat(2, 1fr); gap: 20px; }
    .sec04_thumbnail { max-height: 350px;padding-bottom:150%; }
    .sec04_pt_wrap { gap: 20px; }
    .sec04_contents { margin-top: 16px; }

}

@media screen and (max-width: 768px) {
    .sec04_pt_wrap { gap: 15px; }
    .sec04_thumbnail { max-height: 280px; }
    .sec04_contents { margin-top: 14px; }
}




/***************** sec05 *****************/
.sec05_pt_wrap{width:100%;height:100%;display:flex;justify-content: space-between;}

.sec05-pt.pt-lf{padding-right:30px;}
.sec05-pt.pt-rt{min-width:900px;}
.sec05-pt ul li{margin-bottom:5px;}
.sec05-pt h4{color:#fff;font-weight:bold;}
.sec05-pt h6{color:#fff;font-weight: normal;margin-bottom:0 !important;}


.sec05-pt.pt-rt iframe{height:100%;}

@media screen and (max-width:1300px) {
    .sec05-pt.pt-rt { min-width: 700px; }
    .sec05-pt.pt-lf { padding-right: 25px; }
}

@media screen and (max-width:1300px) {

    .sec05-pt.pt-rt { min-width: 550px; }
    .sec05-pt.pt-lf { padding-right: 20px; }
    .sec05-pt.pt-rt{ min-height: 500px; }
}

@media screen and (max-width:950px) {
    .sec05_pt_wrap { flex-direction: column; }
    .sec05-pt.pt-rt { min-width: 100%; margin-top: 30px; }
    .sec05-pt.pt-lf { padding-right: 0; width: 100%; }
    .sec05-pt.pt-rt,.sec05-pt.pt-rt iframe{ min-height: 400px; }
    .two-button { display: flex; justify-content: space-between; gap: 10px; }
    .two-button a { max-width: 100%; }
}


@media screen and (max-width:768px) {
    .sec05-pt.pt-rt,.sec05-pt.pt-rt iframe{ min-height: 300px; }
    .sec05-pt h4 {}
    .sec05-pt ul li { margin-bottom: 3px; }
    .sec05-pt ul.mb-7 { margin-bottom: 1rem !important; }
}

@media screen and (max-width:480px) {
    .sec05-pt.pt-rt,.sec05-pt.pt-rt iframe{ min-height: 250px; }
    .sec05-pt h4 { }
    .two-button { flex-direction: column; gap: 8px; }
    .two-button a { width: 100%; max-width: 100%; }
}