
/* title */
.section_title {
    position: relative;
    padding: 3vw 0 1vw;
    font-size: 7.46vw;
    line-height: 1.4;
}
.section_title:before {
    content: '';
    position: absolute;
    left:0;
    top: 0;
    display: block;
    width: 13.33vw;
    border-top: 3.99px solid #c3002c;
}



/* ------------
 * usp
 */
.usp {
    position: relative;
}
.usp#safety {
    margin-top: 10vw;
}
    .usp .section_title {
        margin: 0 4vw;
        font-size: 5.73vw;
    }
    .usp_wrap {
        position: relative;
        margin-top: 2vw;
        padding: 0 4vw 4vw;
    }
    .usp_wrap:before {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 80vw;
        background-color: #eee;
    }

/* body */
.usp_body {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}
    /* movie */
    .usp_movie {
        position: relative;
        z-index: 1;
        width: 100%;
        height: 100%;
    }
        .usp_movie__wrap {
            position: relative;
            width: 100%;
            height: 100%;
            overflow: hidden;
        }
            .usp_movie video {
                position: relative;
                width: 100%;
                height: 100%;
            }
            .usp_movie__play {
                position: absolute;
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
                background-image: url(../IMAGES/common/icon_play.png);
                background-repeat: no-repeat;
                background-size: auto 20vw;
                background-position: center;
                opacity: 0.5;
                /* history */
                display: none;
            }
            .switch_sound {
                position: absolute;
                right: 4vw;
                bottom: 4vw;
                width: 8vw;
                height: 8vw;
                display: none;
                background-image: url(../IMAGES/common/icon_volume_on.png);
                background-repeat: no-repeat;
                background-size: contain;
            }
            .switch_sound.mute {
                background-image: url(../IMAGES/common/icon_volume_off.png);
            }
        .usp_movie__caption {
            margin-top: 1vw;
            font-size: 2.93vw;
        }

    /* image */
    .usp_image_01 {
        position: relative;
        width: 100%;
        aspect-ratio: 1 / 1;
        background-image: url(../IMAGES/comfortable/movie_poster.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }
    .usp_image_02 {
        position: relative;
        width: 100%;
        aspect-ratio: 16 / 9;
        background-image: url(../IMAGES/safety/main_sp.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }

/* aside */
.usp_aside {

}
    .usp_lead {
        position: relative;
        margin: 5.6vw -4vw 0;
        padding-bottom: 2vw;
    }
    .usp_lead:before {
        content: '';
        position: absolute;
        left: 0;
        top: 3vw;
        height: 4vw;
        background-color: #fff;
    }
    #comfortable .usp_lead:before {
        width: 75vw;
    }
    #safety .usp_lead:before {
        width: 68vw;
    }
        .usp_lead span {
            position: relative;
            display: block;
            font-size: 4.4vw;
            text-align: center;
            letter-spacing: .15em;
        }
    .usp_menu {
        position: relative;
        display: flex;
        flex-wrap: wrap;
        gap: 2vw;
        justify-content: space-between;
        margin-top: 2vw;
        /* padding: 2vw; */
    }
        .usp_item {
            position: relative;
            width: calc(50% - 1vw);
            aspect-ratio: 250 / 115;
            background-repeat: no-repeat;
            background-size: contain;
            background-position: center;
            box-shadow: 0 0 2.5vw rgba(0,0,0,0.1);
        }
        #comfortable .usp_item:nth-child(1) {
            background-image: url(../IMAGES/comfortable/menu_01.jpg);
        }
        #comfortable .usp_item:nth-child(2) {
            background-image: url(../IMAGES/comfortable/menu_02.jpg);
        }
        #comfortable .usp_item:nth-child(3) {
            background-image: url(../IMAGES/comfortable/menu_03.jpg);
        }
        #comfortable .usp_item:nth-child(4) {
            background-image: url(../IMAGES/comfortable/menu_04.jpg);
        }
        #safety .usp_item:nth-child(1) {
            background-image: url(../IMAGES/safety/menu_01.jpg);
        }
        #safety .usp_item:nth-child(2) {
            background-image: url(../IMAGES/safety/menu_02.jpg);
        }
        #safety .usp_item:nth-child(3) {
            background-image: url(../IMAGES/safety/menu_03.jpg);
        }
        #safety .usp_item:nth-child(4) {
            background-image: url(../IMAGES/safety/menu_04.jpg);
        }


/* modal */
.usp_modal {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 1;
    display: none;
    background-color: rgba(255,255,255,0.7);
    padding: 4vw;
}
.usp_modal.active {
    display: flex;
    align-items: center;
}
    .usp_modal__wrap {
        position: relative;
        width: 100%;
        background-color: #eee;
    }

/* modal: close */
.usp_modal__close {
    position: absolute;
    right: 3.4vw;
    top: 2ch;
    z-index: 1;
    width: 8vw;
    height: 8vw;
    background-image: url(../IMAGES/common/icon_close.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 5vw;
}

/* modal: swiper */
.usp_swiper {
    position: relative;
}
.usp_swiper .swiper-next,
.usp_swiper .swiper-prev {
    position: absolute;
    bottom: 3vw;
    z-index: 100;
    width: 8vw;
    height: 8vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 5.33vw;
}
.usp_swiper .swiper-next {
    left: 60vw;
    background-image: url(../IMAGES/common/icon_next.svg);
}
.usp_swiper .swiper-next.swiper-button-disabled {
    opacity: .2;
    pointer-events: none;
}
.usp_swiper .swiper-prev {
    right: 60vw;
    background-image: url(../IMAGES/common/icon_prev.svg);
}
.usp_swiper .swiper-prev.swiper-button-disabled {
    opacity: .2;
    pointer-events: none;
}
.swiper-pagination {
    position: absolute;
    left: 0;
    bottom: 4.5vw;
    z-index: 1;
    font-size: 3.2vw;
    text-align: center;
}
.swiper-pagination * {
    font-family: ShinGoPro-Light,sans-serif !important;
}

/* modal: slide */
.swiper-slide {
    padding-bottom: 14.8vw;
}
    .usp_modal__item {

    }
        .usp_modal__catch {
            display: flex;
            width: 100%;
            height: 12.8vw;
            align-items: center;
            padding: 0 4vw;
            font-size: 3.73vw;
            color: #7e7e7e;
        }
        .usp_modal__image {
            display: block;
            aspect-ratio: 710 / 400;
            background-repeat: no-repeat;
            background-size: cover;
            background-position: center;
        }
        .usp_modal__summary {
            padding: 4vw 4vw 0;
            font-size: 3.73vw;
        }
        .usp_modal__title {
            display: flex;
            gap: 0 4vw;
            justify-content: space-between;
            width: 100%;
            padding: 2vw 4vw 0;
        }
            .usp_modal__title dt {
                font-size: 3.2vw;
            }
            .usp_modal__title dd {
                width: 23vw;
            }
            .usp_modal__title dd span {
                display: block;
                width: 23vw;
                padding: 0.4vw 1vw;
                border: 1px solid #ccc;
                font-size: 2.66vw;
                white-space: nowrap;
                text-align: center;
            }

/* modal: comfortable */
#comfortable .swiper-slide:nth-child(1) .usp_modal__image {
    background-image: url(../IMAGES/comfortable/slide_01.jpg);
}
#comfortable .swiper-slide:nth-child(2) .usp_modal__image {
    background-image: url(../IMAGES/comfortable/slide_02.jpg);
}
#comfortable .swiper-slide:nth-child(3) .usp_modal__image {
    background-image: url(../IMAGES/comfortable/slide_03.jpg);
}
#comfortable .swiper-slide:nth-child(4) .usp_modal__image {
    background-image: url(../IMAGES/comfortable/slide_04.jpg);
}
/* modal: safety */
#safety .swiper-slide:nth-child(1) .usp_modal__image {
    background-image: url(../IMAGES/safety/slide_01.jpg);
}
#safety .swiper-slide:nth-child(2) .usp_modal__image {
    background-image: url(../IMAGES/safety/slide_02.jpg);
}
#safety .swiper-slide:nth-child(3) .usp_modal__image {
    background-image: url(../IMAGES/safety/slide_03.jpg);
}
#safety .swiper-slide:nth-child(4) .usp_modal__image {
    background-image: url(../IMAGES/safety/slide_04.jpg);
}

/* caption */
#safety .caution {
    margin: 6vw 4vw 0;
    font-size: 3.2vw;
    line-height: 1.55;
}
#safety .caption {
    margin: 2.5vw 4vw 0;
}
    #safety .caption dl {

    }
        #safety .caption dt {
            position: relative;
            display: flex;
            padding: 1vw 10vw 1vw 3vw;
            align-items: center;
            background-color: #eee;
            border: 1px solid #eee;
            cursor: pointer;
        }
        #safety .caption dt:before {
            content: '';
            position: absolute;
            right: 3.2vw;
            top: 50%;
            display: block;
            width: 4.5vw;
            height: 4.5vw;
            margin-top: -2.25vw;
            background-image: url(../IMAGES/common/icon_open.png);
            background-repeat: no-repeat;
            background-position: center;
            background-size: contain;
        }
            #safety .caption dt span {
                font-size: 3.73vw;
                line-height: 1.4;
            }
        #safety .caption dt.active {
            background-color: #fff;
        }
        #safety .caption dt.active:before {
            background-image: url(../IMAGES/common/icon_close.png);
        }
        #safety .caption dd {
            display: none;;
            padding-top: 4vw;
        }
            #safety .caption ul {

            }
                #safety .caption li {
                    font-size: 3.2vw;
                    line-height: 1.75;
                }



/* ------------
 * lineup
 */
#lineup {
    margin-top: 10vw;
    padding: 0 4vw;
}
/* body */
.lineup_body {
    display: flex;
    flex-wrap: wrap;
    gap: 4vw 2vw;
    margin-top: 2vw;
}
    .lineup_item {
        position: relative;
        display: block;
        width: calc(50% - 1vw);
        color: #343434;
    }
        .lineup_image {
            display: block;
            aspect-ratio: 16 / 9;
            background-repeat: no-repeat;
            background-size: cover;
        }
        .lineup_item:nth-child(1) .lineup_image {
            background-image: url(../IMAGES/lineup/lineup_01.jpg);
        }
        .lineup_item:nth-child(2) .lineup_image {
            background-image: url(../IMAGES/lineup/lineup_02.jpg);
        }
        .lineup_item:nth-child(3) .lineup_image {
            background-image: url(../IMAGES/lineup/lineup_03.jpg);
        }
        .lineup_item:nth-child(4) .lineup_image {
            background-image: url(../IMAGES/lineup/lineup_04.jpg);
            border: .99px solid #ccc;
        }
        .lineup_item dl {
            margin-top: 1.2vw;
        }
            .lineup_item dt {
                padding-top: .4vw;
                font-size: 3.73vw;
                line-height: 1.3;
            }
            .lineup_item dd {
                position: relative;
                display: inline-block;
                margin-top: .4vw;
                font-size: 3.2vw;
                padding-right: 4.8vw;
            }
            .lineup_item dd:after {
                content: '';
                position: absolute;
                right: 0;
                top: 50%;
                display: block;
                width: 1.6vw;
                height: 2.4vw;
                margin-top: -1.2vw;
                background-image: url(../IMAGES/common/link_red.png);
                background-repeat: no-repeat;
                background-position: right;
                background-size: auto 2.4vw;
            }



/* ------------
 * bodycolor
 */
#bodycolor {
    aspect-ratio: 1 / 1.4;
    background-color: #555;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 10vw;
    font-size: 8vw;
    color: #fff;
}