﻿@charset "UTF-8";

.style a {
    display: block;
}

.style img {
    width: 100%;
    height: auto;
}

.style .pc_only {
    display: block !important;
}

.style .sp_only {
    display: none !important;
}

.style .fadeIn {
    opacity: 0;
    visibility: hidden;
    transform: translate(0, 0px);
    transition: all 0.3s;
}

.style .fadeIn.scrollIn {
    opacity: 1;
    visibility: visible;
    transform: translate(0, 0);
    transition-delay: 0.3s;
}

.style .inner {
    max-width: 1920px;
    width: 120rem;
    margin: 0 auto;
    padding-top: 20px;
    font-feature-settings: "falt";
    color: #000;
}

.style .inner-bd {
    max-width: 1920px;
    margin: 0 auto;
}

.style .breadcrumbs ul li {
    vertical-align: top;
}

.style .breadcrumbs ul li:not(:last-child)::after {
    vertical-align: top;
}

.style h1 {
    width: 31rem;
    margin: 14rem auto 4rem auto;
}


@font-face {
    font-family: 'Felix Titling';
    src: url('../fonts/FELIXTI.TTF') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
  }
  
.style .top_text {
    font-family: 'Felix Titling', serif;
    font-size: 8.5rem;
    text-align: center;
    margin-top: 10rem;
}

.style .staff_text {
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-style: normal;
    font-size: 2rem;
    text-align: center;
    margin-top: 4rem;
    line-height: 2;
}

.style .blog {
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-style: normal;
    text-align: center;
    line-height: 2;
    font-size: 1.6rem;
}

.style .blog .text1 {
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-style: normal;
    text-align: center;
    line-height: 2;
    font-size: 1.6rem;
    margin-top: 2rem;
}


.style .speaker {
  font-family: 'Source Code Pro', monospace;
  font-weight: 300;
  
  /* バリアブルフォント特有の微調整が必要な場合 */
  font-variation-settings: 'wght' 300;
  font-size: 1.7rem;
  text-align: center;
  letter-spacing: 0;
}

.style .speaker_shop {
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-style: normal;
    font-size: 1.7rem;
    text-align: center;
    margin-top: 1.5rem;
    text-align: center;
    font-weight: 300;
}

.vertical-line {
    border-left: 1px solid #000; /* 黒い太さ2pxの左線 */
    height: 30rem;              /* 必要であれば高さを指定 */
    margin-left: 60.5rem;
    margin-top: 8rem;
}

.style .item-area {
    margin: 0 auto 7rem auto;
}

.style .flex_01 {
    display: flex;
    flex-wrap: wrap;
    width: 115rem;
    gap: 3rem;
    margin: 10rem auto 0;
}

.style .item-area .box01 {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
}

.style .item-area .box01 figure {
    width: 56rem;
}

.style .item-area .box01 figure .img-mgbtm {
    margin-bottom: 1.8rem;
}

.style .item-area .box01 figure figcaption {
    min-height: 11rem;
}

.style .item-area .box01 figure figcaption a {
    display: inline;
    letter-spacing: 0.1em;
    line-height: 1.6;
    text-align: left;
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1.3rem;
    color: #000;
}

.style .item-area .box01 div {
    margin-top: 6.2rem;
}

.style .item-area .box01 div h2 {
    letter-spacing: 0.1em;
    font-family: "Yu Mincho","游明朝","YuMincho","游明朝体","Hiragino Mincho ProN","ヒラギノ明朝 ProN","Hiragino Mincho Pro","ヒラギノ明朝 Pro",'Noto Serif JP', serif,sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 2.2rem;
}

.style .item-area .box01 div p {
    margin-top: 2.3rem;
    text-align: left;
}


.style .staff1_text {
    text-align: left;
    line-height: 1.8;
    font-size: 1.6rem;
    margin-left: 6rem;
    margin-top: -12rem;
}

.style .staff2_text {
    text-align: left;
    line-height: 1.8;
    font-size: 1.6rem;
    margin-top: 3rem;
    margin-left: 6rem;
}


.style .flex_02 {
    display: flex;
    flex-wrap: wrap;
    width: 89rem;
    gap: 3rem;
    margin: 10rem auto 0;
}
.style .item-area .box02 {
    display: flex;
}

.style .item-area .box02 figure {
    width: 43rem;
}

.style .item-area .box02 figure .img-mgbtm {
    margin-bottom: 1.8rem;
}

.style .item-area .box02 figure figcaption {
    min-height: 11rem;
}

.style .item-area .box02 figure figcaption a {
    display: inline;
    letter-spacing: 0.1em;
    line-height: 1.6;
    text-align: left;
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1.3rem;
    color: #000;
}

.style .item-area .box02 div {
    margin: 3.4rem 0 0 10rem;
}

.style .item-area .box02 div h2 {
    letter-spacing: 0.1em;
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 3.2rem;
}

.style .item-area .box02 div p {
    margin-top: 2rem;
    text-align: left;
}

.style .item-area .box02_1 figure {
    width: 43rem;
}

.style .item-area .box02_1 figure .img-mgbtm {
    margin-top: 12rem;
    margin-bottom: 1.8rem;
}

.style .item-area .box02_1 figure figcaption {
    min-height: 11rem;
}

.style .item-area .box02_1 figure figcaption a {
    display: inline;
    letter-spacing: 0.1em;
    line-height: 1.6;
    text-align: left;
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1.3rem;
    color: #000;
}

.style .flex_03 {
    display: flex;
    flex-wrap: wrap;
    width: 89rem;
    gap: 3rem;
    margin: 10rem auto 0;
}
.style .item-area .box03 {
    display: flex;
}

.style .item-area .box03 figure {
    width: 43rem;
}

.style .item-area .box03 figure .img-mgbtm {
    margin-bottom: 1.8rem;
}

.style .item-area .box03 figure figcaption {
    min-height: 11rem;
}

.style .item-area .box03 figure figcaption a {
    display: inline;
    letter-spacing: 0.1em;
    line-height: 1.6;
    text-align: left;
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1.3rem;
    color: #000;
}

.style .item-area .box03 div {
    margin: 3.4rem 0 0 10rem;
}

.style .item-area .box03 div h2 {
    letter-spacing: 0.1em;
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 3.2rem;
}

.style .item-area .box03 div p {
    margin-top: 2rem;
    text-align: left;
}

.style .staff3_text {
    text-align: left;
    line-height: 1.8;
    font-size: 1.6rem;
    margin-top: -8rem;
    margin-left: 6rem;
}

.style .flex_04 {
    display: flex;
    flex-wrap: wrap;
    width: 101rem;
    gap: 5rem;
    margin: 10rem auto 0 6.5rem;
}
.style .item-area .box04 {
    display: flex;
}

.style .item-area .box04 figure {
    width: 53rem;
}

.style .item-area .box04 figure .img-mgbtm {
    margin-bottom: 1.8rem;
    margin-top: 5rem;
}

.style .item-area .box04 figure figcaption {
    min-height: 11rem;
}

.style .item-area .box04_1 figure {
    width: 43rem;
}

.style .item-area .box04_1 figure .img-mgbtm {
    margin-bottom: 1.8rem;
}

.style .item-area .box04_1 figure figcaption {
    min-height: 11rem;
}

.style .item-area .box04_1 figure figcaption a {
    display: inline;
    letter-spacing: 0.1em;
    line-height: 1.6;
    text-align: left;
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1.3rem;
    color: #000;
}

.style .item-area .box04 div {
    margin: 3.4rem 0 0 10rem;
}

.style .item-area .box04 div h2 {
    letter-spacing: 0.1em;
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 3.2rem;
}

.style .item-area .box04 div p {
    margin-top: 2rem;
    text-align: left;
}

.style .staff4_text {
    text-align: left;
    line-height: 1.8;
    font-size: 1.6rem;
    margin-top: -8rem;
    margin-left: 6rem;
}

.style .staff5_text {
    text-align: left;
    line-height: 1.8;
    font-size: 1.6rem;
    margin-top: -8.2rem;
    margin-left: 6rem;
}

.style .flex_05 {
    display: flex;
    flex-wrap: wrap;
    width: 91rem;
    gap: 5rem;
    margin: 10rem auto 0;
}
.style .item-area .box05 {
    display: flex;
}

.style .item-area .box05 figure {
    width: 43rem;
}

.style .item-area .box05 figure .img-mgbtm {
    margin-top: 5rem;
    margin-bottom: 1.8rem;
}

.style .item-area .box05 figure figcaption {
    min-height: 11rem;
}

.style .item-area .box05 figure figcaption a {
    display: inline;
    letter-spacing: 0.1em;
    line-height: 1.6;
    text-align: left;
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1.3rem;
    color: #000;
}

.style .item-area .box05 div {
    margin: 3.4rem 0 0 10rem;
}

.style .item-area .box05 div h2 {
    letter-spacing: 0.1em;
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 3.2rem;
}

.style .item-area .box05 div p {
    margin-top: 2rem;
    text-align: left;
}


.style .item-area .box05_1 figure {
    width: 43rem;
}

.style .item-area .box05_1 figure .img-mgbtm {
    margin-bottom: 1.8rem;
}

.style .item-area .box05_1 figure figcaption {
    min-height: 11rem;
}

.style .item-area .box05_1 figure figcaption a {
    display: inline;
    letter-spacing: 0.1em;
    line-height: 1.6;
    text-align: left;
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1.3rem;
    color: #000;
}

.style .item-area .box06 {
    display: flex;
}

.style .item-area .box06 figure {
    width: 104rem;
    margin: 9rem auto 0;
}

.style .item-area .box06 figure .img-mgbtm {
    margin-bottom: 1.8rem;
}

.style .item-area .box06 figure figcaption {
    min-height: 11rem;
}

.style .item-area .box06 div {
    margin: 3.4rem 0 0 10rem;
}

.style .item-area .box06 div h2 {
    letter-spacing: 0.1em;
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 3.2rem;
}

.style .item-area .box06 div p {
    margin-top: 2rem;
    text-align: left;
}

.style .shop_text {
    text-align: left;
    line-height: 1.8;
    font-size: 1.6rem;
    margin-top: -3.5rem;
    margin-left: 6rem;
}

.style .event_text {
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-style: normal;
    text-align: left;
    line-height: 1.6;
    font-size: 2rem;
    width: fit-content;
    margin: 10rem auto 0;
    font-weight: 600;
    letter-spacing: 0;
}

.style .event_text .space {
    font-family: "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-style: normal;
    text-align: left;
    line-height: 4;
    font-size: 2rem;
    width: fit-content;
    margin: 10rem auto 0;
    font-weight: 600;
    letter-spacing: 0;
}

.style .item-area .box00 {
    margin: 0 auto;
    width: 16.7rem;
    margin-top: 14.5rem;
}

.box00 img {
    width: 4.5rem;
}

.style .item-area .box00_1 {    
    margin: 0 auto;
    width: 22.8rem;
    margin-top: -6rem;
    font-size: 1.2rem;
}

.style .item-area .box00_1 p {
    width: fit-content;
    text-align: center;
    letter-spacing: .1px;
} 

.style .item-area .box09 {
    display: flex;
    justify-content: center;
    margin-top: -3rem;
    margin-bottom: 15rem;
}

.style .item-area .box09 figure {
    width: 24rem;
    margin-top: -2.7rem;
    margin-left: 0rem;
}

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

.style .btn-area {
    display: flex;
    margin: 10rem auto 17rem auto;
}

.style .btn-area a {
    margin: 0 auto;
    padding: 1.2rem 4.4rem;
    letter-spacing: 0.1em;
    font-family: 'Nunito', sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 1.4rem;
    border: 1px solid #19191E;
    color: #19191E;
}

@media screen and (max-width: 767px) {
    .style .pc_only {
        display: none !important;
    }

    .style .sp_only {
        display: block !important;
    }

    .style .inner {
        max-width: none;
        width: 100%;
        padding-top: calc(40* (100vw / 750));
        overflow-x: hidden;
    }

    .style .inner-bd {
        max-width: none;
        width: calc(710* (100vw / 750));
    }

    .style h1 {
        width: calc(240 * (100vw / 750));
        margin: calc(100 * (100vw / 750)) auto calc(30 * (100vw / 750)) auto;
    }

    .style .item-area {
        width: calc(710* (100vw / 750));
        margin: 0 auto calc(166* (100vw / 750)) auto;
    }
    
    .style .top_text {
        font-size: calc(52 * (100vw / 750));
        margin-top: calc(70 * (100vw / 750));
    }

    .style .staff_text {
        font-size: calc(22 * (100vw / 750));
        margin-top: calc(35 * (100vw / 750));
        line-height: 2;
        letter-spacing: -0.05em;
        font-family: "Hiragino Sans", "San Francisco", "Roboto", sans-serif;
    }

    .style .blog {
        line-height: 2;
        font-size: calc(20*(100vw/750));

        letter-spacing: 0;
        font-family: "Hiragino Sans", "San Francisco", "Roboto", sans-serif;
    }

    .style .blog .text1 {
        line-height: 2;
        font-size: calc(16*(100vw/750));
        margin-top: calc(20*(100vw/750));

        letter-spacing: 0;
        font-family: "Hiragino Sans", "San Francisco", "Roboto", sans-serif;
    }


    .style .speaker {
        font-size: calc(16*(100vw/750));
    }

    .style .speaker_shop {
        font-size: calc(16 * (100vw / 750));
        margin-top: calc(10 * (100vw / 750));

        letter-spacing: 0;
        font-family: "Hiragino Sans", "San Francisco", "Roboto", sans-serif;
        font-weight: 300;
    }

    .vertical-line {
        border-left: 1px solid #000;
        height: calc(245 * (100vw / 750));
        margin-left: calc(375 * (100vw / 750));
        margin-top: calc(-100 * (100vw / 750));
    }

    .style .flex_01 {
        display: flex;
        flex-wrap: wrap;
        width: calc(690*(100vw/750));
        gap: calc(20*(100vw/750));
        margin: calc(100 * (100vw / 750)) auto 0;
    }

    .style .item-area .box01 {
        display: flex;
        flex-direction: row-reverse;
        justify-content: space-between;
    }

    .style .item-area .box01 figure {
        width: calc(335*(100vw/750));
    }

    .style .item-area .box01 figure .img-mgbtm {
        margin-bottom: calc(18* (100vw / 750));
    }

    .style .item-area .box01 figure figcaption {
        min-height: unset;
        text-align: center;
        width: calc(350 * (100vw / 750));
    }

    .style .item-area .box01 figure figcaption a {
        letter-spacing: calc(5*(100vw/750));
        font-size: calc(10*(100vw/750));

        letter-spacing: 0;
        font-family: "Hiragino Sans", "San Francisco", "Roboto", sans-serif;
    }

    .style .item-area .box01 div {
        margin-top: calc(0*(100vw/750));
    }

    .style .item-area .box01 div p {
        margin-top: calc(0*(100vw/750));
        text-align: left;
    }

    .style .staff1_text {
        text-align: left;
        line-height: 2;
        font-size: calc(13 * (100vw / 750));
        margin-left: calc(40 * (100vw / 750));
        margin-top: calc(-160 * (100vw / 750));
    }
    

    .style .staff2_text {
        text-align: left;
        line-height: 2;
        font-size: calc(13 * (100vw / 750));
        margin-left: calc(40 * (100vw / 750));
        margin-top: calc(25 * (100vw / 750));
    }


    .style .flex_02 {
        display: flex;
        flex-wrap: wrap;
        width: calc(580 * (100vw / 750));
        gap: calc(20 * (100vw / 750));
        margin: calc(80 * (100vw / 750)) auto 0;
    }
    .style .item-area .box02 {
        display: flex;
    }

    .style .item-area .box02 figure {
        width: calc(280*(100vw/750));
    }

    .style .item-area .box02 figure .img-mgbtm {
        margin-bottom: calc(10*(100vw/750));
    }

    .style .item-area .box02 figure figcaption {
        min-height: unset;
        width: calc(350 * (100vw / 750));
    }

    .style .item-area .box02 figure figcaption a {
        letter-spacing: calc(0*(100vw/750));
        font-size: calc(11*(100vw/750));
        line-height: 0;

        letter-spacing: 0;
        font-family: "Hiragino Sans", "San Francisco", "Roboto", sans-serif;
    }

    .style .item-area .box02 div {
        margin: calc(0*(100vw/750)) 0 0 calc(0*(100vw/750));
    }

    .style .item-area .box02 div p {
        margin-top: calc(0*(100vw/750));
        text-align: left;
    }

    .style .item-area .box02_1 figure {
        width: calc(280*(100vw/750));
    }

    .style .item-area .box02_1 figure .img-mgbtm {
        margin-bottom: calc(18*(100vw/750));
        margin-top: calc(85 * (100vw / 750));
    }

    .style .item-area .box02_1 figure figcaption {
        min-height: unset;
        margin-top: calc(-5 * (100vw / 750));
        width: calc(350 * (100vw / 750));
    }

    .style .item-area .box02_1 figure figcaption a {
        letter-spacing: calc(0*(100vw/750));
        font-size: calc(11*(100vw/750));

        letter-spacing: 0;
        font-family: "Hiragino Sans", "San Francisco", "Roboto", sans-serif;
    }

    .style .flex_03 {
        display: flex;
        flex-wrap: wrap;
        width: calc(580 * (100vw / 750));
        gap: calc(20 * (100vw / 750));
        margin: calc(-10 * (100vw / 750)) auto 0;
    }

    .style .item-area .box03 {
        display: flex;
    }

    .style .item-area .box03 figure {
        width: calc(280*(100vw/750));
    }

    .style .item-area .box03 figure .img-mgbtm {
        margin-bottom: calc(18*(100vw/750));
        margin-top: calc(85 * (100vw / 750));
    }

    .style .item-area .box03 figure figcaption {
        min-height: unset;
        margin-top: calc(-5 * (100vw / 750));
        width: calc(350 * (100vw / 750));
    }

    .style .item-area .box03 figure figcaption a {
        letter-spacing: calc(0*(100vw/750));
        font-size: calc(11*(100vw/750));

        letter-spacing: 0;
        font-family: "Hiragino Sans", "San Francisco", "Roboto", sans-serif;
    }

    .style .item-area .box03 div {
        margin: calc(0*(100vw/750)) 0 0 calc(0*(100vw/750));
    }


    .style .item-area .box03 div p {
        margin-top: calc(0*(100vw/750));
        text-align: left;
    }


    .style .staff3_text {
        text-align: left;
        line-height: 2;
        font-size: calc(13 * (100vw / 750));
        margin-left: calc(40 * (100vw / 750));
        margin-top: calc(-125 * (100vw / 750));
    }


    .style .flex_04 {
        display: flex;
        flex-wrap: wrap;
        width: calc(660*(100vw/750));
        gap: calc(40*(100vw/750));
        margin: calc(60 * (100vw / 750)) auto 0;
    }
    .style .item-area .box04 {
        display: flex;
    }

    .style .item-area .box04 figure {
        width: calc(320 * (100vw / 750));
    }


    .style .item-area .box04 figure .img-mgbtm {
        margin-bottom: calc(18*(100vw/750));
        margin-top: calc(50 * (100vw / 750));
    }

    .style .item-area .box04 figure figcaption {
        min-height: unset;
        margin-top: calc(-5 * (100vw / 750));
        width: calc(350 * (100vw / 750));
    }


    .style .item-area .box04_1 figure {
        width: calc(280*(100vw/750));
    }

    .style .item-area .box04_1 figure .img-mgbtm {
        margin-bottom: calc(18*(100vw/750));
    }

    .style .item-area .box04_1 figure figcaption {
        min-height: unset;
        margin-top: calc(-5 * (100vw / 750));
        width: calc(350 * (100vw / 750));
    }

    .style .item-area .box04_1 figure figcaption a {
        letter-spacing: calc(0*(100vw/750));
        font-size: calc(11*(100vw/750));

        letter-spacing: 0;
        font-family: "Hiragino Sans", "San Francisco", "Roboto", sans-serif;
    }

    .style .item-area .box04 div {
        margin: calc(0*(100vw/750)) 0 0 calc(0*(100vw/750));
    }

    .style .item-area .box04 div p {
        margin-top: calc(0*(100vw/750));
        text-align: left;
    }

    .style .staff4_text {
        text-align: left;
        line-height: 2;
        font-size: calc(13 * (100vw / 750));
        margin-left: calc(40 * (100vw / 750));
        margin-top: calc(-120 * (100vw / 750));
    }

    .style .flex_05 {
        display: flex;
        flex-wrap: wrap;
        width: calc(580 * (100vw / 750));
        gap: calc(20 * (100vw / 750));
        margin: calc(50 * (100vw / 750)) auto 0;
    }
    .style .item-area .box05 {
        display: flex;
    }

    .style .item-area .box05 figure {
        width: calc(280*(100vw/750));
    }

    .style .item-area .box05 figure .img-mgbtm {
        margin-bottom: calc(10*(100vw/750));
        margin-top: calc(28 * (100vw / 750));
    }

    .style .item-area .box05 figure figcaption {
        min-height: unset;
        width: calc(310 * (100vw / 750));
    }

    .style .item-area .box05 figure figcaption a {
        letter-spacing: calc(0*(100vw/750));
        font-size: calc(11*(100vw/750));
        line-height: 0;

        letter-spacing: 0;
        font-family: "Hiragino Sans", "San Francisco", "Roboto", sans-serif;
    }

    .style .item-area .box05 div {
        margin: calc(0*(100vw/750)) 0 0 calc(0*(100vw/750));
    }

    .style .item-area .box05 div p {
        margin-top: calc(0*(100vw/750));
        text-align: left;
    }

    .style .item-area .box05_1 figure {
        width: calc(280*(100vw/750));
    }

    .style .item-area .box05_1 figure .img-mgbtm {
        margin-bottom: calc(18*(100vw/750));
    }

    .style .item-area .box05_1 figure figcaption {
        min-height: unset;
        margin-top: calc(-5 * (100vw / 750));
        width: calc(350 * (100vw / 750));
    }

    .style .item-area .box05_1 figure figcaption a {
        letter-spacing: calc(0*(100vw/750));
        font-size: calc(11*(100vw/750));

        letter-spacing: 0;
        font-family: "Hiragino Sans", "San Francisco", "Roboto", sans-serif;
    }

    .style .staff5_text {
        text-align: left;
        line-height: 2;
        font-size: calc(13 * (100vw / 750));
        margin-left: calc(40 * (100vw / 750));
        margin-top: calc(-120 * (100vw / 750));

        letter-spacing: 0;
        font-family: "Hiragino Sans", "San Francisco", "Roboto", sans-serif;
    }


    .style .item-area .box06 {
        display: flex;
    }

    .style .item-area .box06 figure {
        width: calc(600 * (100vw / 750));
        margin: calc(70 * (100vw / 750)) auto 0;
    }

    .style .item-area .box06 figure .img-mgbtm {
        margin-bottom: calc(18*(100vw/750));
    }


    .style .shop_text {
        text-align: left;
        line-height: 1.8;
        font-size: calc(13 * (100vw / 750));
        margin-left: calc(40 * (100vw / 750));
        margin-top: calc(-140 * (100vw / 750));

        letter-spacing: 0;
        font-family: "Hiragino Sans", "San Francisco", "Roboto", sans-serif;
    }

    .style .event_text {
        text-align: left;
        line-height: 1.8;
        width: fit-content;
        letter-spacing: 0;
        font-size: calc(15 * (100vw / 750));
        margin: calc(70 * (100vw / 750)) auto 0;

        letter-spacing: 0;
        font-family: "Hiragino Sans", "San Francisco", "Roboto", sans-serif;
    }

    .style .event_text .space {
        text-align: left;
        line-height: 4;
        width: fit-content;
        letter-spacing: 0;
        font-size: calc(15 * (100vw / 750));
        margin: calc(70 * (100vw / 750)) auto 0;

        letter-spacing: 0;
        font-family: "Hiragino Sans", "San Francisco", "Roboto", sans-serif;
    }

    .style .item-area .box00 {
        margin: 0 auto;
        width: calc(200* (100vw / 750));
        margin-top: calc(110 * (100vw / 750));
    }
    
    .box00 img {
        width: calc(55* (100vw / 750));
    }
    
    .style .item-area .box00_1 {    
        margin: 0 auto;
        width: calc(280* (100vw / 750));
        margin-top: calc(-150* (100vw / 750));
    }
    
    .style .item-area .box00_1 p {
        width: fit-content;
        text-align: center;
        font-size: calc(15* (100vw / 750));
        letter-spacing: .1px;
    }

    .style .item-area .box09 {
        display: flex;
        justify-content: center;
        margin-top: calc(-150* (100vw / 750));
        margin-bottom: calc(-50* (100vw / 750));
    }
    
    .style .item-area .box09 figure {
        width: calc(270* (100vw / 750));
        margin-top: calc(0* (100vw / 750));
        margin-left: calc(0* (100vw / 750));
    }


    .style .btn-area {
        margin: calc(0* (100vw / 750)) auto calc(160* (100vw / 750)) auto;
    }
    
    .style .btn-area a {
        padding: calc(22* (100vw / 750)) calc(82* (100vw / 750));
        font-size: calc(23* (100vw / 750));
    }
}

    /* fade in */
    .fade {
        animation: fadein 1.5s ease 0s 1 normal;
        -webkit-animation: fadein 1.5s ease 0s 1 normal;
    }

    @keyframes fadein {
        from {
        opacity: 0;
        transform: translateY(50px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
        }
        @-webkit-keyframes fadein {
            from {
            opacity: 0;
            transform: translateY(50px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    .imgFade.fadeT {
        opacity: 0;
        transform: translateY(50px);
    }

    .imgFade.fadeD {
        opacity: 0;
        transform: translateY(-100px);
    }


    .imgFade.fadeR {
        opacity: 0;
        transform: translateX(50px);
    }

    .imgFade.fadeL {
        opacity: 0;
        transform: translateX(-50px);
    }

    .imgAnim.fadeT {
        -webkit-animation-name: imgAnim;
        animation-name: imgAnim;
        -webkit-animation-duration: 1.4s;
        animation-duration: 1.4s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }

    .imgAnim.fadeR {
        -webkit-animation-name: imgAnim;
        animation-name: imgAnim;
        -webkit-animation-duration: 1.4s;
        animation-duration: 1.4s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }

    .imgAnim.fadeL {
        -webkit-animation-name: imgAnim;
        animation-name: imgAnim;
        -webkit-animation-duration: 1.4s;
        animation-duration: 1.4s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }

    @keyframes imgAnim {
        0% {
            opacity: 0;
        }

        100% {
            opacity: 1;
            -webkit-transform: translate(0);
            transform: translate(0);
        }
    }

    /* ▽ animation ▽ */
    .js_imgFadeIn {
        opacity: 0;
        transition: transform 1s ease-in-out, opacity 1s ease-in-out;
    }

    .imgAnimated {
        opacity: 1;
    }

    .style .item-area .li picture:nth-child(2),
    .style .item-area .li picture:nth-child(3) {
        animation-delay: 0.3s;
    }

    .fade {
        animation: fadein 1.5s ease 0s 1 normal;
        -webkit-animation: fadein 1.5s ease 0s 1 normal;
    }

    @keyframes fadein {
        from {
        opacity: 0;
        transform: translateY(50px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
        }
        @-webkit-keyframes fadein {
            from {
            opacity: 0;
            transform: translateY(50px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    .imgFade.fadeT {
        opacity: 0;
        transform: translateY(50px);
    }

    .imgFade.fadeR {
        opacity: 0;
        transform: translateX(50px);
    }

    .imgFade.fadeL {
        opacity: 0;
        transform: translateX(-50px);
    }

    .imgFade.fadeD {
        opacity: 0;
        transform: translateY(-100px);
    }

    .imgAnim.fadeT {
        -webkit-animation-name: imgAnim;
        animation-name: imgAnim;
        -webkit-animation-duration: 1.4s;
        animation-duration: 1.4s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }

    .imgAnim.fadeR {
        -webkit-animation-name: imgAnim;
        animation-name: imgAnim;
        -webkit-animation-duration: 1.4s;
        animation-duration: 1.4s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }

    .imgAnim.fadeL {
        -webkit-animation-name: imgAnim;
        animation-name: imgAnim;
        -webkit-animation-duration: 1.4s;
        animation-duration: 1.4s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }

    .imgAnim.fadeD {
        -webkit-animation-name: imgAnim;
        animation-name: imgAnim;
        -webkit-animation-duration: 1.4s;
        animation-duration: 1.4s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }

    @keyframes imgAnim {
        0% {
            opacity: 0;
        }

        100% {
            opacity: 1;
            -webkit-transform: translate(0);
            transform: translate(0);
        }
    }

    @-webkit-keyframes fadeInUp {
        from {
        opacity: 0;
        -webkit-transform: translate3d(0, 50px, 0);
        transform: translate3d(0, 50px, 0);
        }
    
        to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        }
    }
    
    @keyframes fadeInUp {
        from {
        opacity: 0;
        -webkit-transform: translate3d(0, 50px, 0);
        transform: translate3d(0, 50px, 0);
        }
    
        to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        }
    }
    
    .fadeInUp {
        -webkit-animation-name: fadeInUp;
        animation-name: fadeInUp;
    }
    
    @-webkit-keyframes fadeInUpBig {
        from {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0);
        }
    
        to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        }
    }
    
        @keyframes fadeInUpBig {
            from {
            opacity: 0;
            -webkit-transform: translate3d(0, 2000px, 0);
            transform: translate3d(0, 2000px, 0);
            }
        
            to {
            opacity: 1;
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
            }
        }
        
        .fadeInUpBig {
            -webkit-animation-name: fadeInUpBig;
            animation-name: fadeInUpBig;
        }

    .imgFade.fadeT {
        opacity: 0;
        transform: translateY(50px);
    }

    .imgFade.fadeR {
        opacity: 0;
        transform: translateX(50px);
    }

    .imgFade.fadeL {
        opacity: 0;
        transform: translateX(-50px);
    }

    .imgAnim.fadeT {
        -webkit-animation-name: imgAnim;
        animation-name: imgAnim;
        -webkit-animation-duration: 1.4s;
        animation-duration: 1.4s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }
    
    .animated {
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
      }

      @media (print), (prefers-reduced-motion) {
        .animated {
          -webkit-animation: unset !important;
          animation: unset !important;
          -webkit-transition: none !important;
          transition: none !important;
        }
      }



/* ===============================================### 
アニメーション設定
###=============================================== */
/* PC用の設定 */
.staff_0430 .js-line-animation {
    position: relative;
    width: 100%;
    height: 270px; /* 線を表示するための領域を確保 */
    margin: 4rem 0; /* 前後の余白 */
}

.staff_0430 .js-line-animation.show::after {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 1px; /* 線の太さ */
    height: 0;
    background-color: #000; /* 線の色（一旦黒） */
    animation: line-anime 1.8s ease forwards;
    animation-delay: 0.5s;
}

@keyframes line-anime {
    0% { height: 0; }
    100% { height: 270px; } /* 伸ばしたい長さ（pxやremで指定） */
}

/* スマホ用の設定 */
@media screen and (max-width: 767px) {
    .staff_0430 .js-line-animation {
        height: calc(240*(100vw/750)); /* スマホ用の領域 */
        margin-top: calc(-100*(100vw/750)); 
        margin-bottom: calc(40*(100vw/750));
    }
    @keyframes line-anime {
        0% { height: 0; }
        100% { height: calc(240*(100vw/750)); } /* スマホ用の長さ */
    }
}