@charset "utf-8";

/* ==================================================================

    admission.css

=================================================================== */

/* --------------------------------
■共通
-------------------------------- */

/* ◇ accent
-------------------------------- */
.contents .accent{
    background-image: url("../../images/information/accent.jpg");
}
 

/* --------------------------------
■facility
-------------------------------- */ 
main {
    overflow-x: hidden
}
#facility .flex_box {
    justify-content: space-between;
    align-items: flex-start;
    gap: 48px 0;
}
#facility .flex_box > li {
    max-width: 598px;
}
#facility .flex_box > li figure p.image {
    margin-bottom: 0.8em;
}
#facility .flex_box > li figure img {
    max-width: 100%;
    height: auto;
}
#facility .flex_box > li figcaption  dt {
    font-size: 2.0rem;
    margin-bottom: 12px;
}
#facility .flex_box > li figcaption  dd {
    font-size: 1.5rem;
}
#facility .view {
    margin-top: 72px;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    width: 100vw
}

@media only screen and
(max-width : 767px) {
    #facility .view {
        margin-top: 7vw;
    }
    #facility .view iframe {
        max-width: 100%;
        aspect-ratio: 1 / 1;
        height: auto;
    }
}


/* --------------------------------
■training_vehicle
-------------------------------- */ 

/* --------------------------------
■swiper
-------------------------------- */ 
#training_vehicle .swiper {
    margin-left: calc(((100vw - 100%) / 2) * -1)!important;
    margin-right: calc(((100vw - 100%) / 2) * -1)!important;
    padding: 0 calc((100vw - 100%) / 2)!important;
}
#training_vehicle .swiper-slide {
    max-width: 872px;
}
#training_vehicle .swiper-slide img {
    max-width: 100%;
    height: auto;
}
#training_vehicle .swiper-pagination {
    position: relative;
    margin-top: 32px;
}
#training_vehicle .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 6px);
}
#training_vehicle .swiper-pagination-bullet:hover {
    opacity: 0.8;
}
#training_vehicle .swiper-pagination-bullet-active {
    background: #B72B2F;
}
#training_vehicle .swiper-container {
    position: relative;
}
#training_vehicle .swiper-button-prev,
#training_vehicle .swiper-button-next {
    height: 30px;
    width: 30px;
    top: calc(50% - 20px);
}
#training_vehicle .swiper-button-prev,
#training_vehicle .swiper-button-next {
    height: 62px;
    width: 62px;
}
#training_vehicle .swiper-button-prev {
    left: 50%;
    transform: translateX(calc(-50% - 432px));
    -webkit-transform: translateX(calc(-50% - 432px));
    -ms-transform: translateX(calc(-50% - 432px));
}
#training_vehicle .swiper-button-next {
    right: 50%;
    transform: translateX(calc(-50% + 498px));
    -webkit-transform: translateX(calc(-50% + 498px));
    -ms-transform: translateX(calc(-50% + 498px));
}
#training_vehicle .swiper-button-prev::after,
#training_vehicle .swiper-button-next::after {
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    margin: auto;
    width: 62px;
    height: 62px;
}
#training_vehicle .swiper-button-prev::after {
    background-image: url(../../images/information/arrow-left.svg);
}
#training_vehicle .swiper-button-next::after {
    background-image: url(../../images/information/arrow-right.svg);
}
#training_vehicle .swiper-button-prev:hover::after,
#training_vehicle .swiper-button-next:hover::after {
    opacity: 0.8;
}

@media only screen and
(max-width : 767px) {
    #training_vehicle .swiper-pagination {
        margin-top: 20px;
    }
    #training_vehicle .swiper-button-prev,
    #training_vehicle .swiper-button-next {
        height: 30px;
        width: 30px;
        transform: none;
    }
    #training_vehicle .swiper-button-prev {
        left: var(--swiper-navigation-sides-offset, 10px);
        right: auto;
    }
    #training_vehicle .swiper-button-next {
        right: var(--swiper-navigation-sides-offset, 10px);
        left: auto;
    }
    #training_vehicle .swiper-button-prev::after,
    #training_vehicle .swiper-button-next::after {
        height: 30px;
        width: 30px;
    }
}