@charset "utf-8";
/* Top */
.main{background: url(../imgs/top/bg-main.jpg) no-repeat top left/ cover;}

/* MV */
.mv{position: relative; background: #000; line-height: 0; overflow: hidden;}
.mv:after{content: ''; display: block; padding-bottom: 50%;}

#mvVideo{width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2;}
#mvVideo video{width: 100%; height: 100%; object-fit: cover; object-position: center;}

#mvSlider{width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1;}
#mvSlider div{height: 100%;}
.mvSlide img{width: 100%; height: 100%; object-fit: cover; object-position: center;}

.mv-txt{position: absolute; top: 0; left: 0; width: 100%; height: 100%; text-align: center; font-family: "Josefin Sans", sans-serif; color: #fff; z-index: 5;
display: flex; justify-content: center; align-items: center; align-content: center; flex-wrap: wrap;}
.mv-txt h2{font-size: min(2.5vw, 45px); font-weight: 400; line-height: 1; margin: 0 0 30px; width: 100%;}
.mv-txt h3{font-size: min(8vw, 150px); font-weight: 700; line-height: 1; width: 100%;}

@media (max-width: 767px) {
    .mv:after{padding-bottom: 128%;}
        
    .mv-txt h2{font-size: min(3.3vw, 25px); margin: 0 0 1em;}
    .mv-txt h3{font-size: min(9.7vw, 75px);}
}

/* Info */
.info{display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 0.2%;}
.info .item{width: 49.9%; position: relative; background: #bddfeb; padding: 0 0 105px}
.info .item-inner{width: 90%; margin: 0 auto;}
.info .m-tit{margin: 0 0 10px;}
.info .ui-button{position: absolute; bottom: 30px; left: 0; right: 0; margin: 0 auto;}

@media (min-width: 1024px) {
    .info .item-inner{max-width: 650px;}
}

@media (max-width: 1023px) {
    .info{padding: 20px 0 0;}
    .info .item{width: 100%; padding: 0 0 25px;}
    .info .item:not(:last-child){margin: 0 0 20px;}
    .info .item img{width: 100%;}    
    .info .ui-button{position: static; margin: 25px auto 0;}
}

/* Project */
.project .soon{font-size: min(6.5vw,5.4rem); line-height: 1; text-align: center; width: 100%; background: #fff; color: #ccc; font-weight: 600; padding: 4em 0; box-shadow: 0px 0px 30px 0px rgba(0, 77, 209, 0.1); font-family: "Josefin Sans", sans-serif;}

.project .item h4{font-size: clamp(14px, 1.3vw, 16px); color: #004dd1; margin: 20px 0; letter-spacing: 0.05em; font-family: "Josefin Sans", sans-serif;}
.project .item h5{font-size: clamp(18px, 1.6vw, 20px); letter-spacing: 0.05em; font-family: "Josefin Sans", sans-serif; font-weight: 600; line-height: 1;}
.project .item p{font-size: clamp(12px, 1.1vw, 14px); letter-spacing: 0.05em;}
.project .custom-nav{display: flex; align-items: center; justify-content: center; gap: 30px;}
.project .custom-nav button{background: #fff; border-radius: 50%; border: 1px solid #004dd1; width: 40px; height: 40px; flex-shrink: 0; cursor: pointer; position: relative;}
.project .custom-nav .arrow{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.project .custom-nav .arrow::before{border-color: #004dd1;}
.project .custom-nav button:hover{background: #004dd1; color: #fff;}
.project .custom-nav button:hover .arrow::before{border-color: #fff;}
.project .custom-counter{font-size: clamp(18px, 2vw, 24px); color: #004dd1; font-weight: 600;}

@media (max-width: 767px) {
    .project .custom-nav button{width: 30px; height: 30px;}
}

/* About */
.about{display: flex; flex-wrap: wrap; justify-content: space-between;}
.about-img{width: 54.5932%;}
.about-img img{height: 100%; object-fit: cover;}
.about-txt{border: 1px solid #004dd1; margin: 0 10px; display: flex; flex-direction: column; justify-content: center; padding: 30px 50px;}
.about-txt .ui-button{margin: 30px 0 0;}
.about-txt .m-tit{margin: 0 0 20px; text-align: left;}

@media (min-width: 1024px) {
    .about-txt{flex: 1;}
}

@media (max-width: 1023px) {
    .about-img{width: 100%;}
    .about-txt{width: calc(100% - 40px); margin: 30px auto 0; padding: 30px 15px;}
    .about-txt .m-tit{text-align: center;}
    .about-txt .inner{max-width: 100%;}
    .about-txt .ui-button{margin: 15px auto 0;}
}

/* News */
.news .item{background: #fff; padding: 30px; margin: 0 0 5px;}
.news .item:last-child{margin: 0;}
.news .item .date{margin: 0 0 5px; font-family: "Josefin Sans", sans-serif;}
.news .ui-button{margin: 30px auto 0;}

@media (max-width: 767px) {    
    .news .item{padding: 15px;}
}

/* Faq */
.faq-inner{background: url(../imgs/top/bg-faq.jpg) no-repeat center/cover; padding: 60px 40px; display: flex; justify-content: space-between; align-items: center;}

@media (max-width: 767px) {    
    .faq-inner{padding: 30px 20px;}
}