@charset "utf-8";
/* =========================
kv
============================*/
.kv {
    width: 100%;
    height: 100vh;      
    position: relative;
    overflow: hidden;   
}

.kv video {
    width: 100%;
    height: 100%;
    object-fit: cover;  
    position: absolute;
    top: 0;
    left: 0;
}

.kv_img {
    position: absolute;
    top: 56%; 
    left: 50%;
    transform: translate(-50%, -50%); 
    width: 100%;
    height: 90vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 10;
}

.kv_img img {
    width: auto;     
    height: auto;   
    max-width: 90%;   
    max-height: 80vh;
    display: block;
    margin: 0 auto; 
    padding: 0 20px;
    object-fit: contain;

}

.kv_img img:first-child {
    width: 100%;      
    max-width: 930px; 
    height: auto; 
    display: block;      
    margin: 0 auto 20px; 
    padding: 0 20px;

}

.kv_img img:nth-child(2) {
    display: none;
}

/* scrolldown */
.scrolldown {
    position: absolute;
    bottom: 3vh; 
    left: 50%;
    transform: translateX(-50%);
    z-index: 20;
    color: #fff;
    font-size: max(10px, 1.5vh); 
    font-weight: 700;
    letter-spacing: 0.1em;
}

.scrolldown span {
    display: block;
    padding-bottom: 6vh; 
    position: relative;
}

/* 線のベース（背景） */
.scrolldown span::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 2px;
    height: 5.5vh; 
    background: rgba(255, 255, 255, 0.3); 
}

/* 動く線 */
.scrolldown span::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 2px;
    height: 5.5vh; 
    background: #fff; 
    animation: scroll-line 2s cubic-bezier(0.7, 0, 0.3, 1) infinite;
}

@keyframes scroll-line {
    0% {
        transform: scale(1, 0);
        transform-origin: 0 0;
    }
    35% {
        transform: scale(1, 1);
        transform-origin: 0 0;
    }
    35.1% {
        transform: scale(1, 1);
        transform-origin: 0 100%;
    }
    70%, 100% {
        transform: scale(1, 0);
        transform-origin: 0 100%;
    }
}

@media screen and (max-width: 767px) {
    .scrolldown {
        bottom: 15px;
    }
}

@media screen and (min-width: 1025px) {
    .kv_img img {
        max-width: 930px; 
        max-height: 85vh; 
    }
}

/* SP　767px */
@media screen and (max-width: 767px) {
    .kv_img img:nth-child(2) {
        width: auto;     
        max-width: 90%; 
        max-height: 70vh;
        display: block;       
        margin: 0 auto; 
        padding: 0 20px;
    }

    .kv_img img:nth-child(1) {
        display: none;
    }

    .kv_img {
        top: 50%;
    }
}

/* =========================
about
============================*/
.about {
    max-width: 1280px;
    margin: 0 auto;
    padding: 100px 20px 0;
}

.about_topic {
    font-size: 4rem;
    font-weight: 700;
    text-align: center;
    padding-bottom: 50px;
}

.youtube {
    width: 100%;
    max-width: 663px;
    aspect-ratio: 16 / 9;
    margin: 0 auto;
    padding-bottom: 20px;
}

.youtube iframe {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 20px;
}

.about_inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: center;
}

.about_innerSP {
    display: none;
}

.about_inner p {
    line-height: 3;
    text-align: center;
}

.about_kagamida,
.about_rena {
    max-width: 361px;
}

.about_kagamida img,
.about_rena img {
    width: 100%;       
    height: auto;      
    display: block;
}

/* iPad　1249px */
@media screen and (max-width: 1249px) {
    .youtube {
        padding-bottom: 50px;
    }

    .about_inner {
        display: none;
    }

    .about_innerSP {
        display: block;
        text-align: center;
        line-height: 3;
    }

    .about__photo {
        display: flex;
        justify-content: center;
        gap: 100px;
    }

    .youtube {
        width: 100%;
        max-width: 663px;
        aspect-ratio: 16 / 9;
        margin: 0 auto;
        padding-bottom: 20px;
    }

    .youtube iframe {
        width: 100%;
        height: 100%;
        border: none;
        border-radius: 20px;
    }
}

/* sp　767px */
@media screen and (max-width: 767px) {
    .about {
        padding: 60px 16px 0;
    }

    .about_topic {
        font-size: 2.4rem;
        padding-bottom: 30px;
    }

    .youtube {
        width: 100vw;        
        max-width: none;       
        margin-left: calc(50% - 50vw); 
        margin-right: calc(50% - 50vw);
        padding-bottom: 30px;
    }

    .youtube iframe {
        border-radius: 0;       
    }

    .about_innerSP {
        line-height: 2.5;
    }

    .about_innerSP p {
        padding: 0 5px 20px;
    }
}

/* =========================
news
============================*/
.news {
   background-color: #F79428;
    position: relative;
    overflow: hidden;
    padding: 80px 0 250px;
    width: 100%;
}

.news_decoRight {
    position: absolute;
    top: 0;
    right: 0; 
    width: 300px;
    z-index: 1;
    transform: translate(30%, -30%); 
    /* transform: translate(25%, -25%);  */
    animation: rotate-right 10s linear infinite; 
}

.news_decoLeft {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 300px;
    z-index: 1;
    transform: translate(-30%, 30%); 
    /* transform: translate(-25%, 25%); */
    animation: rotate-left 10s linear infinite; 
}

.news_decoRight img,
.news_decoLeft img {
    width: 100%;
    height: auto;
}

.news_decoRight {
    
}

.news_decoLeft {
    
}

@keyframes rotate-right {
    from { transform: translate(25%, -25%) rotate(0deg); }
    to { transform: translate(25%, -25%) rotate(360deg); }
}

@keyframes rotate-left {
    from { transform: translate(-25%, 25%) rotate(0deg); }
    to   { transform: translate(-25%, 25%) rotate(-360deg); }
}

.news__wrapper {
    position: relative;
    z-index: 10; 
    max-width: 1025px;
    margin: 0 auto;
    padding: 0 20px;
}

.news__list {
    display: flex;
    justify-content: space-around;
}

.news__item {
    width: 212px;
}

.news__item img {
    border-radius: 20px;
    padding-bottom: 10px;
}

.detail__box {
    display: flex;
    justify-content: space-between;
    padding: 0 5px 10px 0;
    border-bottom: solid 2px #FFFFFF;
    margin-bottom: 10px;
    text-align: center;
}

.detail__box p {
    background-color: #FFFFFF;
    padding: 2px 20px;
    border-radius: 50px;
    font-weight: 600;
    color: #F79428;
}

.detail__box time,
.news_detail {
    font-weight: 600;
    color: #FFFFFF;
}

/* .btn {
    position: relative; 
    z-index: 20;       
    text-align: center; 
}

.btn a {
    color: #FFFFFF;   
    text-decoration: none;
    font-weight: 600;
    border: 2px solid #FFFFFF;
    padding: 10px 30px;
    border-radius: 50px;
    display: inline-block;
    transition: all 0.5s;
}

.btn a:hover {
    background-color: #FFFFFF;
    color: #F79428; 
} */

/* iPad　1024px */
@media screen and (max-width: 1024px) {
    .news {
        padding: 60px 0 200px;
    }

    .news__wrapper {
        position: relative;
        width: 100%;
        max-width: 768px;
        padding: 0 20px; 
    }

    .news_decoRight {
        width: 250px;       
    }

    .news_decoLeft {
        width: 250px;
    }

    .news__list {
        display: block;
    }

    .news__item {
        display: flex;
        width: 100%;       
        max-width: 728px;  
        margin: 0 auto;    
        gap: 20px;        
        align-items: center;
        padding-bottom: 20px;
    }

    .news__img {
       max-width: 300px;
    }

    .news__item img {
        padding-bottom: 0px;
    }

    .detail__box {
        padding-bottom: 20px;
    }
}

/* sp　767px */
@media screen and (max-width: 767px) {
    .news {
        padding: 60px 0 140px;
    }

    .news_decoRight {
        width: 150px; 
        top: -30px;
        right: -30px;
        transform: none; 
        animation: rotate-right-sp 10s linear infinite;
    }

    .news_decoLeft {
        width: 150px;
        bottom: -30px;
        left: -30px;
        transform: none;
        animation: rotate-left-sp 10s linear infinite;
    }

    .news__item {
        border-bottom: dotted 1px #FFFFFF;
        padding: 15px 0;
    }

   .news__item:last-child {
        border-bottom: none; 
    }

    @keyframes rotate-right-sp {
     from { transform: rotate(0deg); }
        to { transform: rotate(360deg); }
    }

    @keyframes rotate-left-sp {
     from { transform: rotate(0deg); }
     to { transform: rotate(-360deg); }
    }
}




/* =========================
other
============================*/
.other {
    max-width: 1025px;
    padding: 300px 20px 300px;
    margin: 0 auto;
    text-align: center;
}

.free {
    font-weight: 700;
}

.soon {
    font-size: 4.5rem;
    font-weight: 700;
}


/* sp　767px */
@media screen and (max-width: 767px) {
    .soon {
    font-size: 2.5rem;
    font-weight: 700;
}
}
/* =========================
address
============================*/
.address {
    background-color: #FFDDB8;
}

.address_wrap {
    width: 100%;
    max-width: 1025px;
    padding: 80px 20px 100px;
    margin: 0 auto;
}

.map__inner {
    width: 100%;
    height: auto;
    max-width: 977px;
    padding-bottom: 30px;
}

.map__inner iframe {
    width: 100%;
    height: 375px;
    border: none;
    border-radius: 20px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.20);
}

.address__inner {
    display: grid;
    grid-template-columns: 50% 46%;
    justify-content: space-between;
    padding-bottom: 30px;
}

.location__detail p:nth-of-type(1),
.bus__detail p:nth-of-type(1),
.car__detail p:nth-of-type(1) {
    font-size: 2.4rem;
    font-weight: 700;
    padding-bottom: 10px;
}

.bus__detail p:nth-of-type(2),
.car__detail p:nth-of-type(2),
.car__detail p:nth-of-type(3) {
    padding-bottom: 5px;
}

.car__inner {
    display: grid;
    grid-template-columns: 50% 46%;
    justify-content: space-between;
    align-items: center;
}

.car__map {
    width: 100%;
    height: auto;
    max-width: 492px;
}

.car__map img {
    border-radius: 20px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.20);
}

/* iPad　1024px */
@media screen and (max-width: 1024px) {
    .address_wrap {
    padding: 60px 20px 60px;
}

    .address__inner {
        display: block;
        padding: 0 0 50px 5px;
    }

    .location__detail {
        padding-bottom: 40px;
    }

    .car__inner {
        display: block;    
    }

    .car__map {
        max-width: 768px;
        margin: 0 auto;
        padding-bottom: 30px;
    }

    .car__detail {
        padding-left: 5px;
    }
}

/* sp　767px */
@media screen and (max-width: 767px) {
    .map__inner {
        width: 100vw;          
        max-width: none;       
        margin-left: calc(50% - 50vw); 
        margin-right: calc(50% - 50vw);
    }
    .map__inner iframe {
        border-radius: 0;      
        height: 300px;        
    }

    .car__map {
        width: 100vw;
        max-width: none;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        padding-bottom: 20px;  
    }

    .car__map img {
        width: 100%;
        border-radius: 0;       
    }

    .location__detail p:nth-of-type(1),
    .bus__detail p:nth-of-type(1),
    .car__detail p:nth-of-type(1) {
    font-size: 1.8rem;
    font-weight: 700;
    padding-bottom: 10px;
    }
}

/* =========================
operation
============================*/
.operation {
    background-color: #A68155;
}

.operation__wrap {
    max-width: 1025px;
    padding: 80px 20px 100px;
    margin: 0 auto;
    text-align: center;
    color: #FFFFFF;
    line-height: 2;
}



/* iPad　1024px */
@media screen and (max-width: 1024px) {
    .operation__wrap {
        padding: 60px 20px 60px;
    }
}