@import"https://fonts.googleapis.com/css2?family=EB+Garamond&family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&display=swap";

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin-block-start: 0;
    margin-block-end: 0;
    font-weight: unset
}

h2{
    font-size: min(3svw,43.83px);
    font-family:'NotoSerifJP-Regular';
    margin-top: min(3.42svw, 50px);
    margin-bottom: min(3.42svw, 50px);
}

h3{
    font-size: min(2svw,29.224px);
    padding-top: min(1.712svw, 25px);
    padding-bottom: min(0.68svw,10px);
}

h4{
    font-size: min(1svw,26.3px);
}

.boldText{
    font: 600 20px 'NotoSerifJP-Bold';
    line-height: 1.6;
}

@media only screen and (max-width: 640px) {
    h2{
        font-size: 5svw;
    }
    
    h3{
        font-size: 5svw;
    }
    
    h4{
        font-size: 3.5svw;
    }
}

hr.border {
    margin-block-start: 40px;
    margin-block-end: 40px;
    aspect-ratio: 1280 / 79;
    background-image: url(../assets/border.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    border: 0
}

.yflip {
    transform: rotate(.5turn)
}

.only-sp {
    display: none
}

@media only screen and (max-width: 768px) {
    .only-pc {
        display: none
    }

    .only-sp {
        display: unset
    }
}

@font-face {
    font-family: 'NotoSansJP-Regular';
    src: url('../fonts/NotoSansJP-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'NotoSerifJP-Regular';
    src: url('../fonts/NotoSerifJP-Regular.ttf') format('truetype');
}
@font-face {
    font-family: 'NotoSerifJP-Bold';
    src: url('../fonts/NotoSerifJP-Bold.ttf') format('truetype');
}

body {
    margin: 0;
    padding: 0;
    width: 100%;
    font: 600 18px 'NotoSerifJP-Regular';
    background-color: #fff;
    background-image: url(../assets/background.jpg);
    background-size: 100%;
    background-repeat: repeat;
    color: #000;
    font-feature-settings: "palt";
}

button{
    margin: 0;
    padding: 0;
    font: 600 18px 'NotoSerifJP-Regular';
    font-feature-settings: "palt";
}

#app {
    display: grid;
    place-items: center;
    text-align: center;
    width: 100%;
    overflow-x: hidden
}

.simplebar-content {
    position: relative
}

article {
    width: 100%;
    margin: 0 auto;
    padding: 0 0px;
    position: relative;
    background-image: url(../assets/background-petal.png);
    background-size: 80%;
    background-repeat: no-repeat;
    background-position: bottom;
}

#hero {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    position: relative;
    overflow: hidden;
    background-color: #000;
    background-image: url(../assets/hero-background.jpg);
    background-size: 100%;
    background-repeat: repeat
}

#hero-graphic {
    position: relative;
    width: 75%;
    display: flex;
    flex-direction: column;
    justify-content: end;
    align-items: center;
    aspect-ratio: 768 / 1212;
    margin: 0 auto;
    overflow: hidden
}

@media only screen and (max-width: 640px) {
    #hero-graphic {
        width: 100%
    }

    .boldText{
        font: 600 13px 'NotoSerifJP-Bold';
        line-height: 1.6;
    }
}

@keyframes anim-white-start {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

#hero-white {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(180deg, #fef5ee, #fef5ee 65%, #fef5ee00 75%, #fef5ee00);
    opacity: 0;
    animation: 2s ease .75s anim-white-start forwards
}

.hero-image {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%
}

@keyframes anim-book-start {
    0% {
        opacity: 0;
        filter: blur(8px);
        transform: translateY(16px)
    }

    to {
        opacity: 1;
        filter: blur(0px);
        transform: translateY(0)
    }
}

@media (prefers-reduced-motion) {
    @keyframes anim-book-start {
        0% {
            opacity: 0
        }

        to {
            opacity: 1
        }
    }
}

.hero-book {
    opacity: 0;
    animation: 2s ease .5s anim-book-start forwards
}

@keyframes anim-character-start {
    0% {
        opacity: 0;
        filter: blur(8px);
        transform: translateY(16px)
    }

    to {
        opacity: 1;
        filter: blur(0px);
        transform: translateY(0)
    }
}

@media (prefers-reduced-motion) {
    @keyframes anim-character-start {
        0% {
            opacity: 0
        }

        to {
            opacity: 1
        }
    }
}

.hero-character {
    opacity: 0;
    animation: 2s ease 1s anim-character-start forwards
}

@keyframes anim-petal-start {
    0% {
        opacity: 0;
        filter: blur(8px);
        transform: translateY(16px)
    }

    to {
        opacity: 1;
        filter: blur(0px);
        transform: translateY(0)
    }
}

@media (prefers-reduced-motion) {
    @keyframes anim-petal-start {
        0% {
            opacity: 0
        }

        to {
            opacity: 1
        }
    }
}

@keyframes anim-petal-loop {
    0% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(4px)
    }

    to {
        transform: translateY(0)
    }
}

@media (prefers-reduced-motion) {
    @keyframes anim-petal-loop {}
}

.hero-petal1 {
    opacity: 0;
    animation: 2s ease 1.5s anim-petal-start forwards, 4s cubic-bezier(.5, 0, .5, 1) 3.5s infinite anim-petal-loop
}

.hero-petal2 {
    opacity: 0;
    animation: 2s ease 2s anim-petal-start forwards, 4s cubic-bezier(.5, 0, .5, 1) 4s infinite anim-petal-loop
}

#dateandtime{
    width: 95%;
    margin-top: 3svw;
    margin-bottom: 4.5svw;
}
/**/
#textR{
    width: 86%;
    max-width: 620px;
    margin: min(10.2svw, 120px) auto 0;
    border: #8c0b0b 1px solid;
    padding: 4%;
    color: #8c0b0b;
    font-weight: bold;
    font-size: min(2.4svw, 16px);
    line-height: 1.3;
    background: rgba(255, 255, 255, 0.7);
    }
#titelR{
    font-size: 160%;
}

/*開催日時 ------------------------ */
#dateandtime img{
    width: 100%;
    max-width: 1221px;
}

.hero-container {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: end;
    align-items: center
}

#titleBox{ width: 55%;}
#title {
    padding-bottom: 32px;
    color: #fff;
    width: 100%;
    aspect-ratio: 290 / 150;
    position: relative;
    z-index: 1
}

#about {
    margin-block-start: 80px
}

#concept {
    font-size: 2rem;
    letter-spacing: -.04em;
    margin-block-end: 32px;
    word-break: keep-all;
    overflow-wrap: break-word
}

@media only screen and (max-width: 768px) {
    #concept {
        font-size: 1.5rem
    }
}

.navgation{
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    padding-top: min(10.2svw, 120px);
    padding-bottom: min(1.712svw, 25px);
}

.nav_button{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: min(40svw, 535.5px);
    border: none;
    background: url(../assets/button_container.png);
    background-size: cover;
    aspect-ratio: 267.7 / 76.5;
    background-color: #00000000;
    color: #000;
    font-size: min(3svw, 36px);
    font-family:'NotoSerifJP-Regular';
    cursor: pointer;
    margin: 0 0 7% 0;
    transition: transform 0.5s;
}

.nav_button_AdvanceTrialversion{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: min(40svw, 535.4px);
    border: none;
    background: url(../assets/button_container2.png);
    background-size: cover;
    aspect-ratio: 267.7 / 86.7;
    background-color: #00000000;
    color: #000;
    font-size: min(3svw, 36px);
    font-family:'NotoSerifJP-Regular';
    cursor: pointer;
    margin: 0 auto 7%;
    transition: transform 0.5s;
}

.nav_button_worldEntrance{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: min(80svw, 960px);
    border: none;
    background: url(../assets/button_container3.png);
    background-size: cover;
    aspect-ratio: 267.7 / 86.7;
    background-color: #00000000;
    color: #000;
    font-size: min(4svw, 50px);
    font-family:'NotoSerifJP-Regular';
    cursor: pointer;
    margin: 0 auto;
    transition: transform 0.5s;
}

.nav_button_newRegistration{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: min(40svw, 535.4px);
    border: none;
    background: url(../assets/button_Space.png);
    background-size: cover;
    aspect-ratio: 267.7 / 86.7;
    background-color: #00000000;
    color: #000;
    font-size: min(3svw, 36px);
    font-family:'NotoSerifJP-Regular';
    line-height: 1.1;
    cursor: pointer;
    margin: 0 auto 2%;
    transition: transform 0.5s;
}

.messageText{
    display: block;
    width: min(82svw, 600px);
    font-size: min(2.4svw, 16px);
    text-align: center;
    line-height: 1.3;
    margin: 0 auto;
}

.nav_button_header,.nav_button_header{
    width: 93%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.nav_button_header img,.nav_button_content,.nav_button_header img{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.nav_button_content{
    position: relative;
}
.nav_button_content::after{
    content: '';
    transform: scale(0.8);
    position: absolute;
    right: min(2.053svw,30px);
    background: url(../assets/triangle.png);
    background-size: contain;
    content: "";
    background-repeat: no-repeat;
    display: inline-block;
    width: min(1.98svw,29px);
    height: min(1.02svw,15px);
    position:absolute;
}
.nav_button_content2{ display: block; position: relative;}
.nav_button_content2 span{
    display: block;
    font-size: 58%;
    background: #074d89;
    width: 53%;
    margin: 0 auto;
    color: #fff;
    padding: 0 0 0.6% 0;
}

.nav_button_content2::after{
    content: '';
    background: url(../assets/triangle2.png);
    top: 0;
    bottom: 0;
    margin: auto;
    background-size: cover;
    transform: rotate(270deg);
    position: absolute;
}
.nav_button_content3{ display: block; color:position: relative;}
.nav_button_content3 span{
    display: block;
    font-size: min(1.6svw, 20px);
    background: #8c0b0b;
    /*background: #a7a7a7;/*/
    width: 30%;
    margin: 0 auto;
    color: #fff;
    padding: 0 0 0.6% 0;
}
.nav_button_content3::after{
    content: '';
    background: url(../assets/triangle3.png);
    top: 0;
    bottom: 0;
    margin: auto;
    background-size: cover;
    transform: rotate(270deg);
    position: absolute;
}
.nav_button_content4{
    background: linear-gradient(180deg, rgba(155, 0, 220, 1) 10%, rgba(181, 2, 219, 1) 90%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    position: relative;
}
.nav_button_content4::after{
    content: '';
    background: url(../assets/triangle4.png);
    top: 0;
    bottom: 0;
    margin: auto;
    background-size: cover;
    transform: rotate(270deg);
    position: absolute;
}

.top_section{
    display: flex;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0px;
    z-index: 2;
    pointer-events: none;
}

.top_container{
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
}

.top_button{
    width: min(15svw, 219px);
    height: min(15svw, 219px);
    background-image: url(../assets/button_top.png);
    background-size: 100%;
    border: none;
    background-color: #00000000;
    opacity: 0;
    transition: opacity 0.8s;
    pointer-events: painted;
    cursor: pointer;
}

.top_button_text{
    transform: translate(max(-0.547svw, -8px),max(-1.027svw,-15px));
    color: #fff;
    font-size: min(1.23svw,18px);
}


@media only screen and (max-width: 640px) {

    .nav_container{
        flex-direction: column;
    }

    .nav_button{
        width: min(80svw, 876px);
        font-size: 4svw;
        position:relative;
    }

    .nav_button_content::after{
        content: '';
        width: 4svw;
        height: 2svw;
        position:absolute;
    }

    .nav_button_AdvanceTrialversion{
        width: min(82svw, 876px);
        font-size: 4svw;
    }
    .nav_button_worldEntrance{
        width: min(82svw, 876px);
        font-size: 4svw;
    }
    .nav_button_newRegistration{
        width: min(82svw, 876px);
        font-size: 4svw;
    }

    .top_button{
        width: min(30svw, 438px);
        height: min(30svw, 438px);
    }

    .top_button_text{
        transform: translate(-1.5svw,-2svw);
        font-size: 2.5svw;
    }
}

#description {
    font-weight: 700;
    font-family: Noto Sans JP, serif;
    line-height: 1.5;
    word-break: break-all
}

.navgation { width: 82%; margin: 0 auto;}
/*.messageText{
    width: min(78svw, 535.4px);
    font-size: min(2.2svw, 15px);
}*/

@media only screen and (max-width: 768px) {
    #description {
        text-align: left
    }
}

#bg-petal-container {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: start;
    width: 100%;
    height: 0
}
#subbackground{
    display: flex;
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.368);
    top: 0px;
    align-content: center;
    justify-content: center;
    align-items: center;
    z-index: 0;
    opacity:0;
    background-image: url(../assets/event_content_background_pc.png);
    background-repeat: round;
    background-size: contain;
    transition: opacity 0s;
}

.background1{
    opacity: 1 !important;
}

#event_overview{
    padding-top: min(1.712svw, 25px);
    padding-bottom: min(10.27svw, 90px);
    width: 100%;
    background-image: url(../assets/background-petal.png),url(../assets/background.jpg);
    background-size: 80%,100%;
    background-repeat: repeat-y,repeat;
    background-position: 50% 0%,top;
}

.event_overview_text{
    width: 95%;
    object-fit: contain;
}

#art-container {
    display: flex;
    position: relative;
    margin: 0 auto;
    width: min(80svw,1168px);
    background-image: url(../assets/art.jpg);
    background-size: cover;
    aspect-ratio: 768 / 1153;
    border-radius: 2svw;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.event_overview_header{
    margin-top: min(10svw,146.1px);
    width: 80%;
    text-shadow:0px 0px 0.5svw white,
    0px 0px 0.5svw white,
    0px 0px 0.5svw white,
    0px 0px 0.5svw white,
    0px 0px 0.5svw white,
    0px 0px 0.5svw white;
}

.event_overview_header img{
    width: 100%;
}

/*イベント概要 -------------------------------- */
.event_overview_text{
    line-height: 3svw;
    font-size: min(1.3svw,18.98px);
    text-shadow:0px 0px 0.5svw white,
    0px 0px 0.5svw white,
    0px 0px 0.5svw white,
    0px 0px 0.5svw white,
    0px 0px 0.5svw white,
    0px 0px 0.5svw white;
}

.event_overview_footer{
    width: 80%;
    margin-top: min(6.85svw, 100px);
}

.event_overview_footer img{
    width: 100%;
}

#event_overview_PV{
    margin: min(10.2svw, 120px) auto 0;
    width: 88%;
    max-width: 1000px;
    position: relative;
}

.event_overview_PV_frame{
    width: min(60%,730px);
}
.youtubebox {
    width: 100%;
    aspect-ratio: 16 / 9;
  }

  .youtubebox iframe {
    width: 100%;
    height: 100%;
  }
  .pvFrame{
        position: absolute;
        top: -9%;
        left: 0;
        right: 0;
        width: 100%;
        max-width: 1009px;
        pointer-events: none;
    }

        .nav_buttonNone {
            display: inline-block;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            width:auto;
            border: none;
            background:none;
            background-size:auto;
            aspect-ratio:unset;
            background-color:unset;
            color: #000000;
            font-size:unset;
            font-family: 'NotoSerifJP-Regular';
            cursor: pointer;
            margin: auto;
            transition:none;
            text-decoration: underline;
            text-indent: initial;
        }
        .nav_buttonNone:hover{
            transform:none!important;
        }

@media only screen and (max-width: 640px) {
    /*コンテンツ背景*/
    #subbackground{
        background-image: url(../assets/event_content_background.png);
    }

    /*タイトル ---------------------*/
    #titleBox{ width: 78%;}
    #title {
        padding-bottom: 14px;
    }

    /*開催日 -----------------------*/
    #dateandtime img{ width: 80%;}

    #art-container {
        width: 90%;
    }

    .navgation{ width: 100%; font-size: 6svw;}
    .nav_button_worldEntrance{ width: min(96svw, 876px); font-size: 6svw;}
    .nav_button_content3 span{ width: 46%; font-size: min(2.6svw, 20px);}

    .event_overview_header{
        width: 90%;
        text-shadow:0px 0px 1svw white,
        0px 0px 1svw white,
        0px 0px 1svw white,
        0px 0px 1svw white,
        0px 0px 1svw white,
        0px 0px 1svw white;
    }

    .event_overview_text{
        font-size: 3.6svw;
        line-height: 7svw;
        text-shadow:0px 0px 1svw white,
        0px 0px 1svw white,
        0px 0px 1svw white,
        0px 0px 1svw white,
        0px 0px 1svw white,
        0px 0px 1svw white;
    }

    .event_overview_footer{
        width: 90%;
    }
}

#event_content{
    width: 100%;
    background-repeat: round;
    background-size: contain;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    padding-top: min(3.42svw, 50px);
}

.event_content_header{
    max-width: 973px;
    margin-top: min(6.849svw,100px);
    width: 66.5%;
    color: white;
}

.event_content_header img{
    width: 100%;
}

.event_content_container{
    margin-top: min(3.42svw, 50px);
    margin-bottom: min(3.42svw, 50px);
    max-width: 906px;
    width: 62%;
}

.event_content_container_header,.event_content_container_header img,.event_content_container_footer,.event_content_container_footer img{
    width: 100%;
    display: grid;
}

.event_content_container_frame{
    background-size: contain;
    background-image: url(../assets/event_content_frame_content.png);
    display: flex;
    align-items: center;
    flex-direction: column;
}

.event_content_container_frame_br{
    width: 100%;
    display: flex;
    justify-content: center;
}
.event_content_container_frame_br img{
    width: 30%;
}

.event_content_container_headline{
    line-height: min(2.6svw,43.8px);
    font-size: min(1.5svw,21.9px);
    font-weight: 700;
    font-family: "Noto Sans JP", sans-serif;
    margin: 1.8svw 0 0 0;
    width: 92%;
}

.event_content_container_image{
    margin-top: min(3.42svw,50px);
    width: 100%;
    display: flex;
    justify-content: center;
}

.event_content_container_image img{
    transform: translateX(1px);
    width: 96%;
}

.event_content_container_about{
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: -2svw;
    flex-direction: column;
    align-items: center;
}

.event_content_container_about_box{
    width: 90%;
    border-radius: 0.5svw;
    background-color: white;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.event_content_container_about_box h4{
    margin-top: min(1.5svw,21.9px);
    margin-bottom: min(1.5svw,21.9px);
    font-family: "Noto Sans JP", sans-serif;
    font-size: 1.6svw;
}

.event_content_container_about_box>div{
    width: 97%;
    font-size: min(1svw,21.9px);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    margin-bottom: min(3svw,43.8px);
}

.event_content_container_about_box div div{
    font-family: "Noto Sans JP", sans-serif;
    font-size: 400;
    transform: translateX(min(1.5svw,21.9px));
    text-indent: max(-1.0svw,-21.9px);
    line-height: min(1.8svw, 43.8px);
    margin: 0.8svw 0 0 0;
}
.cancel{
    text-indent:0!important;
    margin: 0.8svw 0 0 max(-1.5svw, -21.9px) !important;
}

.event_content_footer{
    max-width: 973px;
    margin-top: min(3.42svw, 50px);
    margin-bottom: min(10.27svw,150px);
    width: 66.5%;
}

.event_content_footer img{
    width: 100%;
}

.cont_Mtop{ margin:4svw 0 0 0!important;}


@media only screen and (max-width: 640px) {
    .event_content_header{
        width: 90%;
    }

    .event_content_container{
        width: 90%;
    }

    .event_content_container_frame_br img {
        width: 50%;
    }

    .event_content_container_headline {
        line-height: 6svw;
        font-size: 2.8svw;
        font-weight: 700;
    }

    .event_content_container_about{
        margin-top: -3svw;
    }
    .event_content_container_about_box h4 {
        font-size: 3.4svw;
        margin-top: 3svw;
        margin-bottom: 2svw;
    }

    .event_content_container_about_box div {
        font-size: 3svw;
    }
    .event_content_container_about_box{
        border-radius: 2svw;
    }
    .event_content_container_about_box div div {
        transform: translateX(2.1svw);
        text-indent: -2.1svw;
        line-height: min(4.8svw, 43.8px);
    }

    .event_content_footer{
        width: 90%;
    }
    .cancel{
        margin: 0.8svw 0 1.8svw  max(-1.5svw, -21.9px) !important;
    }
    .tlp{ letter-spacing: 0.005em;}
    .tlp2{ letter-spacing: -0.08em;}
    .tlp3{ letter-spacing: -0.1em;}
}

#event_content_detail,#event_DateAndTime_detail,#warning,#enviroment,#FAQ{
    width: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    width: 100%;
    background-image: url(../assets/background.jpg);
}

.event_content_detail_header,.event_DateAndTime_detail_header,.warning_header{
    max-width: 973px;
    margin-top: min(6.849svw, 100px);
    width: 66.5%;
}

.event_content_detail_header img,.event_DateAndTime_detail_header img,.warning_header img{
    width: 100%;
}

.event_content_detail_container{
    margin-top: min(3.04svw, 50px);
    margin-bottom: min(3.04svw, 50px);
    max-width: 906px;
    width: 62%;
    background-color: white;
    display: flex;
    flex-direction: column;
    align-items: center;
    border: #deceb9 1px solid;

}

.event_content_detail_container_title{
    width: 100%;
    display: flex;
    height: 0;
}

.event_content_detail_container_title h3{
    font-size: min(4svw,56.8px);
    z-index: 2;
    transform: translate(max(-1.36svw,-20px),max(-4.1svw,-70px));
    text-align: left;
    line-height: min(4svw,56.8px);
}

.event_content_detail_container_image,.event_content_detail_container_image img{
    width: 100%;
}

.event_content_detail_container_text{
    width: 90%;
    font-size: min(1.5svw,21.918px);
    line-height: min(2.4svw, 43.8px);
    text-align: left;
    margin-top: min(1.64svw,24px);
}

.event_content_detail_container_text_detail{
    width: 92%;
    font-size: min(1svw,14.612px);
    text-align: left;
}

.applicationmethod{
    width: 90%;
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 1px solid black;
    border-radius: min(1svw,15px);
    margin-top: 2.5svw;
    margin-bottom: 4svw;
    padding-bottom: 1.5svw;
}

.applicationmethod_title{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    margin-top: min(2.05svw,30px);
}

.applicationmethod_title_border{
    position: absolute;
    width: min(50svw,730.6px);
    border-bottom: 1px solid black;
}

.applicationmethod_title_text{
    padding-right: 0.9svw;
    padding-left: 0.9svw;
    z-index: 2;
    background-color: white;
}

.applicationmethod_text,.applicationmethod_period{
    width: 87%;
    text-align: left;
    font-size: min(1.1svw,16px);
    line-height: min(2.05svw,30px);
}

.applicationmethod_supplement{
    width: 87%;
    text-align: left;
    font-size: min(0.9svw,13.15px);
    /*text-indent: max(-0.9svw,-13.15px);
    transform: translateX(min(0.9svw,13.15px));
    margin-top: min(1.02svw,15px);
    margin-bottom: min(1.02svw, 15px);*/
}

.event_content_detail_footer,.event_DateAndTime_detail_footer,.warning_footer{
    max-width: 973px;
    margin-top: min(3.42svw,50px);
    margin-bottom: min(6.85svw,100px);
    width: 66.5%;
}

.event_content_detail_footer img,.event_DateAndTime_detail_footer img,.warning_footer img{
    width: 100%;
}

@media only screen and (max-width: 640px) {

    .event_content_detail_header, .event_DateAndTime_detail_header, .warning_header {
        width: 90%;
    }

    .event_content_detail_container {
        width: 90%;
    }

    .event_content_detail_container_title h3 {
        font-size: 5svw;
        transform: translate(-2svw, -5svw);
        line-height: 5svw;
    }

    .event_content_detail_container_text {
        font-size: 3.6svw;
        line-height: min(6.4svw, 43.8px);
        margin-top: min(4.64svw, 24px);
    }

    .event_content_detail_container_text_detail {
        font-size: 3.6svw;
    }

    .applicationmethod{ margin-top: 6.5svw;    padding-bottom: 3.5svw;}
    .applicationmethod_title {margin-top: min(4.05svw, 30px);}
    .applicationmethod_title_border{ width: min(72svw, 740.6px);}
    .applicationmethod_text, .applicationmethod_period {
        font-size: 3svw;
        line-height: min(4.6svw, 30px);
    }

    .applicationmethod_supplement {
        font-size: 2.8svw;
        text-indent: -2.8svw;
        transform: translateX(2.8svw);
    }

    .event_content_detail_footer, .event_DateAndTime_detail_footer, .warning_footer {
        width: 90%;
    }
}

#event_DateAndTime_detail{
    background-size: 100%;
    background-image: url(../assets/event_dateandtime_background.png),url(../assets/background.jpg);
}

.event_DateAndTime_detail_container{
    max-width: 973px;
    padding: min(3.08svw,45px);
}

.event_DateAndTime_detail_container_box{
    display: flex;
    margin-top: min(2svw,30px);
    align-items: baseline;
    margin-bottom: min(2.342svw, 10px);
}

.event_DateAndTime_detail_container_index{
    font-size: min(1.2svw,17.53px);
    width: min(14svw,193.3px);
    color: white;
    line-height: 1.2;
    background-color: black;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1% 0;
}

.event_DateAndTime_detail_container_text{
    font-size: min(1.3svw,18.99px);
    margin-left: 1svw;
    text-align: left;
    line-height: 2svw;
    width: min(46.59svw, 764px);
}

.event_DateAndTime_detail_container_text_supplement{
    /*margin-top: 1svw;*/
    font-size: min(1svw,14.612px);
    line-height: 1.5svw;
}

#warning{
    background-image: none;
}

.warning_container{
    margin-top: min(3.42svw,50px);
    margin-bottom: min(3.42svw,50px);
    width: min(65svw,949px);
    text-align: left;
    font-size: min(1.8svw,18px);
    line-height: min(2.5svw,32px);
    padding: 0;
}
.warning_container li{
    list-style:none;
    text-indent: max(-3svw, -25.8px);
    padding-left: min(3svw, 25.8px);
    /*line-height: min(3svw, 32px);*/
}

#enviroment{
    background-image: none;
}

.enviroment_container{
    margin-top: min(3.42svw,50px);
    margin-bottom: min(3.42svw,50px);
    width: min(50svw,730.6px);
    font-size: min(1.8svw, 18px);
    text-align: left;
    line-height: min(3svw, 32px);
}
@media only screen and (max-width: 640px) {
    .event_DateAndTime_detail_container_text_supplement{
        font-size: min(3svw, 14.612px);
        line-height: 1.5svw;
    }
}
#FAQ{
    background-image: none;
}

.FAQ_container{
    width: min(60svw,876px);
    margin: 0 0 0.6svw 0;
}

.FAQ_container_index{
    display: flex;
    justify-content: space-between;
    margin-top: min(0.68svw,10px);
    padding-bottom: min(0.68svw,10px);
    border-bottom: 1px solid black;
    align-items: center;
}

.FAQ_container_number{
    font-size: min(2svw,29.224px);
    width: min(3svw,43.8px);
}

.FAQ_container_title{
    font-size: min(2svw,29.224px);
    display: flex;
    width: min(54svw,788.4px);
    margin-left: min(1.4svw, 18.6px);
    text-align: left;
}

.FAQ_container_triangle{
    transform: rotateX('0deg');
    width: min(2svw,29.2px);
    display: flex;
    align-items: center;
    transition: all 0.5s ease-in-out;
}

.FAQ_container_triangle img {
    width: 100%;
}

.FAQ_container_content{
    display: grid;
    grid-template-rows: 0fr;
    font-size: min(1.5svw,21.9px);
    text-align: left;
    overflow: hidden;
    transition: all 0.5s ease-in-out;
}

.FAQ_open{
    grid-template-rows: 1fr;
}

.FAQ_container_content div{
    padding-top: min(0.68svw,10px);
    overflow: hidden;
}

@media only screen and (max-width: 640px) {

    .event_DateAndTime_detail_container_index {
        font-size: 3.6svw;
        width: 60svw;
        margin: 0 0 1svw 0;
    }

    .event_DateAndTime_detail_container_text {
        width: 80svw;
        font-size: 3.6svw;
        line-height: 6svw;
    }

    .event_DateAndTime_detail_container_box{
        flex-direction: column;
        margin-bottom: min(5.342svw, 25px);
    }

    .event_DateAndTime_detail_container_text_supplement{
        line-height: 4.5svw;
        margin-top: 3svw;
    }
    .warning_container{
        width: 87svw;
        font-size: 2.6svw;
        line-height: 3.8svw!important;
    }

    .warning_container li{
        text-indent: -4.4svw;
        padding-left: 4.4svw;
    }

    .enviroment_container {
        width: 84svw;
        font-size: 2.6svw;
        line-height: 3.8svw;
    }

    .FAQ_container{
        width: 84svw;
    }
    
    .FAQ_container_number{
        width: 6svw;
        font-size: 4svw;
    }
    
    .FAQ_container_title{
        width: 68svw;
        font-size: 2.8svw;
    }
    
    .FAQ_container_triangle{
        width: 6svw;
        width: 4svw;
    }

    .FAQ_container_content{
        font-size: 2.5svw;
    }
}

#service ul{
    list-style: none;
    padding: 0;
}

#service ul li{
    padding-bottom: min(1.4svw,20.4px);
}

#service a{
    text-decoration: none;
    font-size: min(1.4svw,20.4px);
    color: black;
}

@media only screen and (max-width: 640px) {

    #service ul li{
        padding-bottom: 4svw;
    }

    #service a{
        font-size: 4svw;
    }
}

#bg-petal {
    position: absolute;
    top: -0%;
    width: 110%;
    z-index: -1
}

#art {
    position: relative;
    display: block;
    width: 100%;
    border-radius: 16px
}

#date {
    font: 400 2.5rem EB Garamond, "Noto Serif JP", serif;
    margin-block-end: 20px
}

#date .number {
    font-size: 1.2em
}

#stay-tuned {
    font-size: 1.5rem
}

#footer {
    margin-block-start: 60px;
    margin-block-end: 60px
}

#banners {
    margin-block-start: 20px;
    margin-block-end: 20px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 20px
}

.fadeIn{
    opacity: 0;
}

.is-active{
    animation: 0.5s ease-out 0.5s blurslush forwards;
}

.is-end{
    opacity: 1;
    -ms-filter: blur(0svw);
    filter: blur(0svw);
}

@keyframes blurslush {
    from {
        opacity: 0;
        transform: translateY(0.5svw);
        -ms-filter: blur(1svw);
        filter: blur(1svw);
    }
    to {
        opacity: 1;
        transform: translateY(0svw);
        -ms-filter: blur(0svw);
        filter: blur(0svw);
    }
}

.nav_button:hover{
    transform: scale(1.2);
}
.nav_button_newRegistration:hover{
    transform: scale(1.2);
}
.nav_button_AdvanceTrialversion:hover{
    transform: scale(1.2);
}
.nav_button_worldEntrance:hover{
    transform: scale(1.2);
}
@media only screen and (max-width: 640px) {
    .nav_button:hover{
        transform: scale(1);
    }
    .nav_button_newRegistration:hover{
        transform: scale(1);
    }
    .nav_button_AdvanceTrialversion:hover{
        transform: scale(1);
    }
    .nav_button_worldEntrance:hover{
        transform: scale(1);
    }
}

@media only screen and (max-width: 768px) {
    #banners {
        flex-direction: column
    }
}

.banner {
    display: inline-block
}

.banner img {
    max-width: 100%
}

.copyright {
    margin-block-start: 60px;
    font-size: .75rem
}