.mv_sub {
    background-image: url(../image/about_mv.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.mv_sub_title span {
    text-transform: uppercase;
}

/* MESSAGE */
.message {
    position: relative;
    padding-top: 75px;
    padding-bottom: 90px;
}

.message::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    z-index: -20;
    display: block;
    width: 2.6vw;
    height: 800px;
    background: #309a35;
}

.illust_cracker {
    position: absolute;
    top: 38%;
    right: 0;
    z-index: 100;
    max-width: 220px;
    width: 20%;
}

.illust_ahijo {
    position: absolute;
    top: 80%;
    left: 10%;
    z-index: 40;
    max-width: 370px;
    width: 30%;
}

.message_box {
    margin-left: 2%;
    width: 60%;
}


.message_group {
    margin-top: 2%;
}

.message_subtitle {
    margin-top: 8%;
    margin-bottom: 6%;
    text-transform: uppercase;
    font-size: min(2.5vw, 28px);
}

.message_text {
    font-size: min(1.5vw, 16px);
    line-height: 2.2;
}

.yoshida_group {
    display: flex;
    justify-content: space-between;
}

.message_image_first {
    z-index: -10;
    display: block;
    margin-left: calc(50% - 50vw);
    max-width: 678px;
    width: 55%;
}

.message_image_second {
    position: absolute;
    top: 57%;
    left: 0;
    z-index: -10;
    max-width: 255px;
    width: 20%;
}

.message_image_third {
    display: block;
    margin-right: calc(50% - 50vw);
    max-width: 462px;
    width: 35%;
}

.message_text {
    position: relative;
    z-index: 100;
}

.master_group {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.master_box {
    margin-right: 4%;
    margin-left: 20%;
    width: 60%;
}

.master_text {
    margin-top: 20px;
}

.master_name {
    margin-top: 20px;
    text-align: end;
    font-weight: 500;
    font-size: min(1.8vw, 20px);
    font-family: 'Noto Sans JP',
        sans-serif;
}

.yoshidamasahiko {
    position: absolute;
    right: 15%;
    bottom: -5;
    z-index: 50;
    max-width: 352px;
}

.master_br {
    display: none;
}

/* スワイパー */

.swiper-wrapper {
    display: flex;
    width: 100%;
    transition-timing-function: linear;
}

.first_swiper {
    margin-top: 60px;
}

.second_swiper {
    margin-top: 10px;
}

.swiper-slide {
    width: 100%;
    height: auto;
}

/* COMMITMENT */
.commitment {
    position: relative;
    padding: 80px 0;
}

.commitment::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    display: block;
    width: 3%;
    height: 670px;
    background: #309a35;
}

.commitment_title {
    position: absolute;
    top: 40%;
    right: 0;
    height: 1044px;
    font-size: 128px;
    font-size: min(8vw, 128px);
    line-height: .6;

    writing-mode: vertical-rl;
}

/* ピザ */

.illust_smollbear {
    position: absolute;
    top: 100px;
    right: 0;
    z-index: 30;
    max-width: 254px;
    width: 20%;
}

.commitment_subtitle {
    margin-bottom: 40px;
    font-size: min(2.5vw, 28px);
}

.pizza_group {
    margin-top: 65px;
    margin-bottom: 18%;
    padding-top: 80px;
    width: 100%;
    height: 830px;
    background-image: url(../image/pizza_back.jpg);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

.pizza_wrapper {
    margin-left: 10%;
}

.pizza_text {
    width: 60%;
    font-size: min(1.5vw, 16px);
}

.pizza_first_image {
    position: absolute;
    top: 320px;
    right: 0;
    max-width: 400px;
    width: 25%;
}

.pizza_second_image {
    position: absolute;
    top: 414px;
    left: 38%;
    z-index: 50;
    max-width: 1000px;
    width: 65%;
}

.pizza_third_image {
    position: relative;
    z-index: 40;
    margin-top: 83px;
    max-width: 492px;
    width: 40%;
}

/* パスタ */

.pasta_group {
    position: relative;
}

.pasta_wrapper {
    display: flex;
    justify-content: space-between;
}

.pasta_box {
    position: relative;
    z-index: 50;
    margin-top: 5%;
    margin-left: 8%;
    width: 55%;
}

.pasta_text {
    font-size: min(1.5vw, 16px);
}



.fresh_chewy {
    position: absolute;
    top: -30px;
    left: 22%;
    z-index: 50;
    max-width: 411px;
    width: 30%;
}

.pasta_first_image::before {
    content: '';
    position: absolute;
    bottom: -37%;
    left: 90%;
    min-width: 278px;
    max-width: 278px;
    width: 60%;
    height: 60%;
    background-image: url(../image/pasta_2.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.pasta_first_image::after {
    content: '';
    position: absolute;
    top: 25px;
    left: 25px;
    z-index: -10;
    display: block;
    min-width: 480px;
    max-width: 720px;
    width: 100%;
    height: 100%;
    background: #309a35;
}

.pasta_first_image {
    position: relative;
    margin-left: calc(50% - 50vw);
    min-width: 480px;
    max-width: 720px;
    width: 65%;
}

/* サングリア */

.illust_bread {
    position: absolute;
    top: -50%;
    max-width: 215px;
    width: 20%;
}

.fruity_wine {
    position: absolute;
    top: -47px;
    left: 38%;
    z-index: 30;
    max-width: 393px;
    width: 30%;
}

.sangria_wrapper {
    position: relative;
    display: flex;
    align-items: flex-start;
    margin-top: 260px;
}

.sangria_box {
    margin-right: 5%;
    margin-left: 10%;
    max-width: 600px;
}

.sangria_first_image {
    display: block;
    max-width: 360px;
    width: 30%;
}

.sangria_second_image {
    display: block;
    display: block;
    margin-top: -70px;
    margin-right: 2%;
    padding-left: 18px;
    max-width: 293px;
    width: 20%;
}

.sangria_group {
    position: relative;
}

.sangria_group::after {
    content: '';
    position: absolute;
    position: absolute;
    top: 25px;
    right: 0;
    right: 0;
    z-index: -10;
    display: block;
    width: 16%;
    height: 100%;
    background: #309a35;
}

.sangria_text {
    font-size: min(1.5vw, 16px);
}

.commitment_button {
    margin-top: 90px;
}

/* 店内の様子 */
.seat {
    position: relative;
    z-index: -20;
    padding-top: 80px;
    padding-bottom: 80px;
    background-image: url(../image/backtexture.jpg);
    background-repeat: repeat;
}

.seat_wrapper {
    margin-top: 60px;
}

.seat_name {
    display: flex;
}

.seat_kind {
    width: 90px;
}

.seat_box {
    display: flex;
    color: #fff;
}

.seat_wrapper::before {
    content: '';
    position: absolute;
    top: 60px;
    left: 0;
    max-width: 260px;
    width: 20%;
    height: 262px;
    background-image: url(../image/illust_flypan.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.seat_group {
    margin-left: 5%;
    max-width: 450px;
    font-size: min(1.5vw, 16px);
}

.seat_text {
    margin-top: 20px;
}

.seat_image_first {
    max-width: 552px;
    width: 50%;
}

.seat_second_image {
    margin-top: 30px;
    max-width: 552px;
    width: 50%;
}

.seat_third_image {
    position: relative;
    margin-top: -50px;
    margin-left: 2.6%;
    max-width: 552px;
    width: 50%;
}


@media(max-width:768px) {
    .mv_sub {
        background-image: url(../image/about_sp_mv.jpg);
    }

    /* メッセージ */

    .message {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .message_title {
        font-size: 50px;
        line-height: 1;
    }

    .message_subtitle {
        margin-top: 40px;
        margin-bottom: 35px;
        font-size: 20px;
    }

    .message_box {
        margin-left: 0;
        width: 100%;
    }

    .message_title,
    .message_subtitle {
        text-align: center;
    }

    .message_group {
        width: 100%;
    }

    .yoshida_group {
        display: flex;
        flex-direction: column-reverse;
    }

    .master_group {
        flex-direction: column;
        margin-right: auto;
        margin-left: auto;
    }

    .master_box {
        margin-right: 0;
        margin-left: 0;
        width: 100%;
    }

    .message_text {
        margin-right: auto;
        margin-left: auto;
        max-width: 500px;
        font-size: 16px;
    }

    .message_image_first {
        position: static;
        margin: 0 0 0 -50px;
        margin-top: 28px;
        width: calc(70% + 50px);
    }

    .message_image_second {
        top: 30%;
        right: 0;
        left: auto;
        width: 25%;
    }

    .message_image_third {
        margin-left: auto;
        width: 55%;
    }


    .illust_cracker {
        top: 26%;
    }

    .master_box {
        margin-right: auto;
        margin-left: auto;
        max-width: 500px;
    }

    .master_name {
        position: absolute;
        margin-top: 10%;
        text-align: left;
        font-size: 18px;
    }

    .illust_ahijo {
        top: auto;
        bottom: 0;
        left: 0;
    }

    .yoshidamasahiko {
        position: absolute;
        right: auto;
        bottom: 14%;
        left: 12%;
        max-width: 352px;
    }

    .first_swiper {
        margin-top: 10px;
    }

    .second_swiper {
        margin-top: 7px;
    }

    /* こだわりメニュー */

    .commitment {
        padding: 50px 0;
    }

    .commitment_subtitle {
        margin-bottom: 40px;
        font-size: 20px;
    }

    .pizza_wrapper {
        margin-left: auto;
    }

    .pizza_group {
        margin-top: 30px;
        margin-bottom: 26%;
        padding-top: 42px;
    }

    .commitment_subtitle {
        margin-bottom: 28px;
        text-align: center;
    }

    .pizza_text {
        margin-right: auto;
        margin-left: auto;
        max-width: 500px;
        width: 100%;
        font-size: 16px;
    }

    .pizza_first_image {
        top: 17%;
        right: 0;
        width: 25%;
    }

    .pizza_second_image {
        top: 17%;
        left: 26%;
    }

    .pizza_group {
        height: 600px;
    }

    /* パスタ */

    .pasta_group {
        margin-top: 50px;
    }

    .pasta_wrapper {
        flex-direction: column-reverse;
    }

    .pasta_box {
        margin: 0 auto;
        margin-top: 0;
        max-width: 500px;
        width: 100%;
        font-size: 16px;
    }

    .pasta_text {
        font-size: 16px;
    }

    .pasta_first_image {
        margin-top: 45px;
        min-width: auto;
        width: 80%;
    }

    .pasta_first_image::after {
        top: 15px;
        left: 15px;
        min-width: auto;
    }

    .pasta_first_image::before {
        min-width: auto;
        width: 65%;
        height: 65%;
    }

    .pasta_first_image::after {
        min-width: auto;
    }

    .fresh_chewy {
        top: 37%;
        left: 46%;
        width: 36%;
    }

    /* サングリア */
    .sangria_wrapper {
        flex-direction: column;
        margin-top: 23%;
    }

    .sangria_text {
        font-size: 16px;
    }

    .sangria_box {
        margin-right: auto;
        margin-left: auto;
        width: 93%;
    }

    .sangria_first_image {
        margin-top: 79px;
        margin-left: 5%;
        width: 48%;
    }

    .sangria_second_image {
        position: absolute;
        top: 39%;
        right: 7%;
        z-index: 20;
        margin-top: auto;
        margin-right: auto;
        padding-left: 0;
        width: 37%;
    }

    .sangria_group::after {
        top: 60%;
        width: 30%;
        height: 46%;
    }

    .illust_bread {
        top: -15%;
        width: 20%;
    }

    .fruity_wine {
        top: 32%;
        left: 20%;
        width: 36%;
    }

    /* 店内の様子 */
    .seat {
        padding-top: 50px;
        padding-bottom: 50px;
    }


    .seat_wrapper {
        margin-top: 40px;
    }

    .seat_box {
        align-items: center;
        flex-direction: column;
    }

    .seat_group {
        margin-top: 28px;
        margin-left: 0;
        max-width: 500px;
        font-size: 16px;
    }


    .seat_image_first {
        margin: 0 auto;
        max-width: 552px;
        width: 100%;
    }

    .seat_second_image {
        width: 100%;
    }

    .seat_third_image {
        margin-top: 10px;
        margin-left: 0;
        width: 100%;
    }
}

@media(max-width:500px) {
    .master_name {
        position: absolute;
        bottom: 15%;
        text-align: left;
        font-size: 18px;
    }

    .master_br {
        display: block;
    }

    .master_name {
        bottom: 13%;
    }

    .yoshidamasahiko {
        bottom: 7%;
        left: 4%;
        max-width: 235px;
    }

    .message_image_second {
        top: 36%;
    }

    .illust_cracker {
        top: 3%;
    }

    .second_swiper {
        margin-top: 5px;
    }

    .pizza_group {
        margin-bottom: 140px;
        height: 500px;
    }

    .pizza_first_image {
        top: 460px;
    }

    .pizza_second_image {
        top: 470px;
        right: 30px;
        width: 70%;
    }

    .pizza_third_image {
        margin-top: 50px;
    }

    .pasta_first_image {
        margin-top: 20px;
    }

    .fresh_chewy {
        top: 230px;
        width: 40%;
    }

    .sangria_wrapper {
        margin-top: 28%;
    }

    .sangria_first_image {
        margin-top: 45px;
    }

    .sangria_second_image {
        top: 55%;
        right: 7%;
    }

    .fruity_wine {
        top: 59%;
    }

    .commitment_button {
        margin-top: 70px;
    }
}