@charset "UTF-8";

#logo {
    display: none;
}

/* ==================================
MainVisual Section
================================== */


.mv {
    margin-bottom: 0;
    padding: 0;
}

.mv.contentPane:last-child {
    padding-bottom: 0;
}

.mv .contentArea {
    max-width: 100%;
    width: 100vw;
    overflow: hidden;
    padding: 0;
}

.mv .contentArea .inner {
    max-width: var(--content-area-inner-width);
    margin: auto;
}

.mv .wrap_mv {
    position: relative;
}




.mv .wrap_mv .mv_bg {
    background: url(../img/top/bg_mv01.webp);
    background-size: cover;
    height: 100%;
}

.mv .wrap_mv .mv_bg_gradation_red {
    background-image: radial-gradient(#cf0027, #cf0027bf 50%, transparent);
}

.mv .wrap_mv .mv_bg_gradation_black {
    background-image: linear-gradient(0deg, #00000099, transparent 70% 100%);
}

.mv .mv_catchphrase {
    max-width: 700px;
    margin: auto;
    padding: 20px 15px;
}

.mv .mv_catchphrase img {
    animation: slideIn 1s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}



@media screen and (max-width: 750px) {
    .mv .mv_catchphrase img {
        margin-left: -6%;
    }
}

@keyframes slideIn {
    0% {
        transform: translateY(180px);
        opacity: 0;
    }

    100% {
        transform: translateY(0);
    }

    40%,
    100% {
        opacity: 1;
    }
}

.mv .mv_slider #scrollLoop {
    touch-action: pan-y;
}

.mv .mv_slider .loop-container {
    height: 40vh;
    overflow: hidden;
    width: 100vw;
    position: relative;
}

.mv .mv_slider .loop-scroll {
    display: flex;
    will-change: transform;
    touch-action: none;
    cursor: grab;

}

.mv .mv_slider .loop-scroll:active {
    cursor: grabbing;
}

.mv .mv_slider .loop-scroll img {
    flex-shrink: 0;
    height: 40vh;
    width: auto;
}



.mv .mv_slider .controls {
    position: absolute;
    bottom: 10px;
    right: 10px;
    z-index: 10;
}

.mv .mv_slider .controls button {
    padding: 0.5em 1em;
    margin-right: 1em;
    cursor: pointer;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    color: #fff;
    border: 2px solid #FFFFFF;
    cursor: pointer;
    background: none;
    margin-left: 2em;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #000000CC;
}

.mv .mv_slider .controls button img {
    height: 30px;
    width: 30px;
}

.mv .mv_slider .controls button:focus-visible {
    background: #CF0027CC;
}

@media (hover: hover) {
    .mv .mv_slider .controls button:hover {
        background: #CF0027CC;
    }
}


.mv .wrap_eventTitle {
    background-color: var(--theme-color-dark);
    padding-top: clamp(1.25rem, 0.967rem + 1.29vw, 1.875rem);
}

.mv .wrap_eventTitle h1 {
    margin-bottom: 0;
}

.mv .wrap_eventTitle .inner {
    padding: 0 clamp(5px, 3%, 20px);
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 20px 16px;
    grid-template-rows: auto;
    grid-template-areas:
        "eventName eventName eventName eventName"
        "eventDate eventNote eventNote eventNote";
}

.mv .wrap_eventTitle .eventName {
    grid-area: eventName;
}

.mv .wrap_eventTitle .eventDate {
    grid-area: eventDate;
    display: flex;
    justify-content: center;
    align-items: center;
}

.mv .wrap_eventTitle .eventNote {
    grid-area: eventNote;
    border: 3px solid #FFFFFF;
    font-size: clamp(1.3rem, 1.12rem + 0.82vw, 2.1rem);
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.4;
}

.mv .wrap_eventTitle .eventNote p:last-child {
    margin-bottom: 0;
}

@media screen and (min-width: 650px) {
    .mv .wrap_eventTitle .inner {
        padding: 0 clamp(5px, 3%, 20px);
        grid-template-columns: 32% 66%;
        grid-template-rows: 1fr 1fr;
        gap: 22px 22px;
        grid-template-areas:
            "eventDate eventName"
            "eventDate eventNote";
    }
}

/*media*/


/* ==================================
News Section
================================== */
.news.contentPane {
    background-color: var(--theme-color-dark);
    padding: clamp(25px, 10%, 40px) 0;
}

.news .wrap_newsList {
    background: #222222;
    display: flex;
}

.news .wrap_newsList h2 {
    font-size: clamp(1.6rem, 1.398rem + 0.92vw, 2.5rem);
    padding: clamp(0.625rem, 0.415rem + 0.96vw, 1.563rem);
    display: flex;
    justify-content: center;
    align-items: center;
    border-right: 2px solid var(--theme-color-dark);
    margin-bottom: 0;
}

.news .wrap_newsList .news-list {
    list-style: none;
    width: 100%;
}

.news .wrap_newsList .news-list>li {
    padding: clamp(0.625em, 0.415rem + 0.96vw, 1.563em);
}

.news .wrap_newsList .news-list>li:not(:last-child) {
    border-bottom: 2px solid var(--theme-color-dark);
}

.news .wrap_newsList .news-list .date {
    font-size: clamp(1.1rem, 1.033rem + 0.31vw, 1.4rem);
    line-height: 1;
    margin-bottom: 0.5em;
}

.news .wrap_newsList .news-list .date.new::after {
    content: 'NEW';
    display: inline-block;
    background: var(--theme-color);
    color: #FFFFFF;
    font-size: clamp(1.1rem, 1.078rem + 0.1vw, 1.2rem);
    padding: 5px;
    margin-left: 5px;

}

.news .news-list .flexBox {
    display: flex;
    gap: 30px;
    flex-direction: column;
}

.news .news-list .flexBox .cItem.img {
    max-width: 400px;
    order: 2;
}

/* ==================================
Special Broadcast  Section
================================== */
.special-broadcast.contentPane {
    background-color: var(--theme-color-dark);
    padding: 0 clamp(5px, 3%, 20px) clamp(25px, 10%, 40px);
}

.special-broadcast .contentArea {
    padding: 0;
}


.special-broadcast .gridBox {
    width: 100%;
    border-top: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
    padding: 2em 0;
    display: grid;
    row-gap: 30px;
    grid-template-columns: auto;
    grid-template-rows: auto;
    grid-template-areas:
        "title"
        "img"
        "btn";
}

.special-broadcast .gridBox .cItem.title {
    grid-area: title;
    text-align: center;
}

.special-broadcast .gridBox .cItem.title h2 {
    margin-bottom: 0;
    font-family: var(--fontFamily-sub);
}

.special-broadcast .gridBox .cItem.title .date {
    display: inline-block;
    border: 2px solid #FFFFFF;
    margin-bottom: 1em;
    font-weight: 700;
    line-height: 1;
    padding: 0.2em;

}

.special-broadcast .gridBox .cItem.title .date p:last-child {
    margin-bottom: 0;
    padding: 0.5em;
}

.special-broadcast .gridBox .cItem.img {
    grid-area: img;
    text-align: left;
}

.special-broadcast .gridBox .cItem.btn {
    grid-area: btn;
    max-width: 600px;
    margin: auto;
    display: flex;
    gap: 20px;
    flex-direction: column;
}


@media screen and (min-width: 600px) {
    .special-broadcast .gridBox .cItem.btn {
        flex-direction: row;
        gap: 50px;
    }
}

.special-broadcast .gridBox .cItem.btn .liveLinkButton {
    font-size: 1.8rem;
    background-color: var(--theme-color);
    font-weight: bold;
    /* padding: 0.8em 3em; */
    padding: 0;
    color: var(--theme-font-color-light);
    text-decoration: none;
    text-align: center;
    width: 100%;
    padding-left: 50px;
    min-height: 50px;
}

.special-broadcast .gridBox .cItem.btn .liveLinkButton .inner {
    background: var(--theme-border-color-dark-gray);
    padding: 0.8em;
}


.special-broadcast .gridBox .cItem.btn .liveLinkButton:focus-visible {
    opacity: 1;
}

.special-broadcast .gridBox .cItem.btn .liveLinkButton:focus-visible .inner {
    background: #EEEEEE;
    color: var(--theme-color);
}



@media (any-hover: hover) {
    .special-broadcast .gridBox .cItem.btn .liveLinkButton:any-link:hover {
        opacity: 1;
    }

    .special-broadcast .gridBox .cItem.btn .liveLinkButton:any-link:hover .inner {
        background: #EEEEEE;
        color: var(--theme-color);
    }
}



/* ==================================
outline  Section
================================== */
.outline {
    text-align: center;
}

.outline .wrap_eventInfo {
    max-width: 800px;
    margin: auto;
}

.outline .catchphrase {
    font-family: var(--fontFamily-sub);
    font-size: clamp(1.9rem, 0.245rem + 7.52vw, 5.7rem);
    text-align: center;
    margin-bottom: 0.7em;
}

.outline .infoTable {
    margin-bottom: 3em;
}


.outline .wrap_regLink {
    background: #000000;
    padding: clamp(20px, 0.684rem + 2.57vw, 30px) clamp(5px, 3%, 20px);
    margin-top: 80px;
}

.outline .regLink {
    max-width: 400px;
}

.outline .speech-bubble {
    margin-top: -50px;
}

.outline h3 {}


.outline .apply-schedule {
    border: 3px solid #FFFFFF;
}

.outline .apply-schedule tr {
    border-bottom: 3px solid #FFFFFF;
}

.outline .apply-schedule th,
.outline .apply-schedule td {
    background: none;
    text-align: center;
}

.outline .apply-schedule th {
    height: 100%;
    font-size: clamp(2rem, 1.608rem + 1.78vw, 2.9rem);
    padding-bottom: 0;
}

.outline .apply-schedule th .wrap_title {
    background: var(--theme-color-dark);
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.2em;
    min-height: 85px;

}

.outline .apply-schedule .wrap_title .note {
    background: #FFFFFF;
    color: var(--theme-color);
    font-size: clamp(1.3rem, 1.169rem + 0.59vw, 1.6rem);
    margin-right: 1em;
    padding: 0.1em 0.2em;
}

.outline .apply-schedule .wrap_title .eventName {
    font-size: clamp(1.2rem, 1.113rem + 0.4vw, 1.4rem);
    display: block;

}

.outline .apply-schedule .status {
    font-size: clamp(2.5rem, 2.282rem + 0.99vw, 3rem);
    margin-bottom: 0;
    font-weight: 700;
}


/* ==================================
Event Section
================================== */

.event .wrap_eventList {
    display: flex;
    flex-wrap: wrap;
    text-align: center;
    border-top: 3px solid #FFFFFF;
    border-left: 3px solid #FFFFFF;
}

.event section {
    width: 100%;
}

.event .wrap_eventList .cItem {
    width: 100%;
    border-right: 3px solid #FFFFFF;
    border-bottom: 3px solid #FFFFFF;
    padding: clamp(15px, -0.052rem + 4.5vw, 50px);
    display: grid;
    row-gap: 30px;
    grid-template-columns: auto;
    grid-template-rows: auto;
    grid-template-areas:
        "title"
        "img"
        "txt";
}

.event .wrap_eventList .cItem .title {
    grid-area: title;
}

.event .wrap_eventList .cItem .txt {
    grid-area: txt;
    text-align: left;
}

.event .wrap_eventList .cItem .img {
    grid-area: img;
    max-width: 600px;
    margin: auto;
}

.event .wrap_eventList .cItem .title .subNotion {
    background: #FFFFFF;
    color: var(--theme-color);
    display: inline-block;
    padding: 0.3em 0.7em;
    margin-bottom: 1rem;
    font-size: clamp(1.4rem, 1.355rem + 0.21vw, 1.5rem);
    font-weight: 700;
}

.event .wrap_eventList .cItem .title .subNotion p:last-child {
    margin-bottom: 0;
}

.event .wrap_eventList .cItem .title .catchphrase {
    font-size: clamp(1.4rem, 1.129rem + 1.23vw, 2rem);
    font-family: var(--fontFamily-sub);
    margin-bottom: 0.5em;

}

.event .wrap_eventList .cItem .title h3 {
    font-size: clamp(3rem, 2.095rem + 4.11vw, 5rem);
    margin-bottom: 0;
}

.event .wrap_eventList .conference .title .sub {
    font-size: clamp(2.1rem, 1.602rem + 2.26vw, 3.2rem);
}



/* ==================================
benefit Section
================================== */
.benefit .wrap_benefitInfo {
    display: flex;
    flex-direction: column;
    gap: 6px;
    text-align: center;
}

.benefit .wrap_benefitInfo .cItem {
    padding: clamp(15px, -0.052rem + 4.5vw, 50px);
    background: var(--theme-color-dark);
    flex: 1;
}

.benefit .wrap_benefitInfo .cItem .txt {
    text-align: left;
}

.benefit .wrap_benefitInfo .cItem .title>.catchphrase {
    font-family: var(--fontFamily-sub);
    margin-bottom: 0.2em;

}

.benefit .wrap_benefitInfo .img {
    margin-bottom: 2em;
}

.benefit .wrap_benefitInfo .img img {
    max-width: 500px;
    margin: auto;
    filter: drop-shadow(0px 0px 24px rgba(255, 255, 255, 0.5));
}

.benefit .speech-bubble {
    margin-bottom: 0.5em;
}

.benefit .speech-bubble>.inner,
.benefit .speech-bubble>.inner::before {
    background-color: var(--theme-color);
    color: var(--theme-font-color);
    font-size: clamp(1.4rem, 1.182rem + 0.99vw, 1.9rem);
}

/* ==================================
Time Table Section
================================== */



/* ==================================
Guide book Section
================================== */

.guide-book .coming_soon {
    font-size: 2rem;
    text-align: center;
    min-height: 40vh;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 3px solid #FFFFFF;
}

.guide-book  .wrap_guidemap {
    border: 3px solid #FFFFFF;
    padding: clamp(15px, -0.052rem + 4.5vw, 50px);
    width: 100%;
    text-align: center;
}

.guide-book .catchphrase {
    font-family: var(--fontFamily-sub);
    font-size: clamp(2.1rem, 1.24rem + 3.91vw, 4rem);
    margin-bottom: 0.2em;
    line-height: 1.4;
}

.guide-book p:last-child {
    margin-bottom: 1.5em;
}

.guide-book picture {
    max-width: 800px;
    margin: 0 auto;
    display: block;
    margin-bottom: 2em;
}

.guide-book picture img {
    filter: drop-shadow(0px 0px 16px rgba(0, 0, 0, 0.3));
}


/* ==================================
linkedcampaign Section
================================== */
.linkedcampaign .wrap_linkedcampaignList {
    display: flex;
    flex-wrap: wrap;
    text-align: center;
    border-top: 3px solid #FFFFFF;
    border-left: 3px solid #FFFFFF;

}

.linkedcampaign section {
    width: 100%;
}

.linkedcampaign .wrap_linkedcampaignList .cItem {
    border-right: 3px solid #FFFFFF;
    border-bottom: 3px solid #FFFFFF;
    padding: clamp(15px, -0.052rem + 4.5vw, 50px);
    width: 100%;
}

.linkedcampaign .wrap_linkedcampaignList .cItem h3 {
    font-family: var(--fontFamily-sub);
    font-size: clamp(2.1rem, 1.24rem + 3.91vw, 4rem);
}

.linkedcampaign .wrap_linkedcampaignList .cItem .img {
    margin-bottom: 2em;
}

.linkedcampaign .wrap_linkedcampaignList .cItem .img img {
    max-width: 750px;
    margin: auto;
}


.linkedcampaign .wrap_linkedcampaignList .cItem .subNotion {
    background: #FFFFFF;
    color: var(--theme-color);
    display: inline-block;
    padding: 0.3em;
    margin-bottom: 1rem;
    font-size: clamp(1.4rem, 1.355rem + 0.21vw, 1.5rem);
}

.linkedcampaign .wrap_linkedcampaignList .cItem .subNotion p:last-child {
    margin-bottom: 0;
    font-weight: 700;
}


.linkedcampaign .niconico .txt,
.linkedcampaign .niconico .minimini {
    text-align: left;
}

.linkedcampaign .liveBtnBox {
    display: flex;
    flex-direction: column;
    gap: 1em;
    max-width: 500px;
    margin: 0 auto clamp(15px, -0.052rem + 4.5vw, 50px);
}

/*-- KEKコラボ --*/
.linkedcampaign .kek_collab {
    display: flex;
    gap: 2em;
    border-top: 1px solid #FFFFFF;
    padding-top: clamp(15px, -0.052rem + 4.5vw, 50px);
    flex-direction: column;
}

.linkedcampaign .kek_collab h4 {
    font-family: var(--fontFamily-sub);
    text-align: center;
}

.linkedcampaign .wrap_linkedcampaignList .cItem .kek_collab .img {
    order: 2;
}

.linkedcampaign .wrap_linkedcampaignList .cItem .kek_collab .img img {
    max-width: 350px;
}

.linkedcampaign .wrap_linkedcampaignList .cItem .kek_collab .link {
    text-align: center;
}





/*-- ミニミニ一般公開 --*/
.linkedcampaign .minimini .linkButtonBox {
    max-width: 500px;
    margin: auto;
}





/* ==================================
Access Section
================================== */
.access section,
.access div.section {
    background: #FFFFFF;
    color: var(--theme-font-color-dark);
    margin-bottom: 2em;
    padding: clamp(15px, -0.052rem + 4.5vw, 50px);
}

.access section a,
.access div.section a {
    color: var(--theme-color);
}

.access section a.rectButton,
.access div.section a.rectButton {
    color: #FFFFFF;
}

.access section .lineHeading,
.access div.section .lineHeading {
    border-color: var(--theme-color);
}

.access .flexBox {
    display: flex;
    flex-direction: column;
    gap: 50px;
}

.access .flexBox .leftItem,
.access .flexBox .rightItem {
    width: 100%;
}

.access .flexBox .rightItem img {
    max-width: 400px;
    margin: auto;
}


.access .cItem:not(:last-child) {
    margin-bottom: 4em;
}

.access .accessAddressMapLink {
    display: flex;
    flex-direction: column;
}

.access .accessAddress {
    text-align: center;
}

.access .accessAddressMapLink .name {
    font-weight: 700;
    margin-bottom: 1em;
}

.access .accessMap img {
    max-width: 800px;
    margin: auto;
}

/* ==================================
Q＆A（FAQ） Section
================================== */
summary {
    /* display: list-item;以外を指定してデフォルトの三角形アイコンを消します */
    display: block;

    /* Safariで表示されるデフォルトの三角形アイコンを非表示にします */
    &::-webkit-details-marker {
        display: none;
    }
}

.faqAccordion {
    margin-bottom: 3em;
}

.faqAccordion details {
    background: var(--theme-color-dark-gray);
    margin-bottom: 2px;

}

.faqAccordion summary {
    /* Chrome、Safari以外でデフォルトの矢印を消す */
    list-style: none;
    display: flex;
    font-weight: bold;
    cursor: pointer;
}

.faqAccordion summary::-webkit-details-marker {
    display: none;
    /* デフォルトの矢印を消す */
}

.faqAccordion .answer {
    display: flex;
    background: #FFFFFF;
    color: var(--theme-font-color-dark);
}

.faqAccordion .question .inner,
.faqAccordion .answer .inner {
    padding: 1rem;
    flex-shrink: 2;
    width: 100%;
    text-align: left;
}

.faqAccordion .answer .inner {
    padding-right: 40px;
    background: #FFFFFF;
}

.faqAccordion .answer .inner>*:last-child {
    margin-bottom: 0;
}

.faqAccordion .question::before,
.faqAccordion .answer::before {
    display: block;
    padding: 10px;
    font-weight: bold;
    min-width: 35px;
    text-align: center;
}

.faqAccordion summary::before {
    content: 'Q';
    background: var(--theme-color-dark);
}

.faqAccordion .answer::before {
    content: 'A';
    background: #DCDCDC;
    color: var(--theme-font-color-dark);
}

.faqAccordion .question::after {
    content: '';
    display: block;
    background: url(../img/common/icon-faq-plus.svg) no-repeat center center;
    width: 40px;

}

.faqAccordion details[open] .question::after {
    background: url(../img/common/icon-faq-minus.svg) no-repeat center center;
}

.faqAccordion table.reception_hours .table_heading {
    background: #DCDCDC;
}





@media (any-hover: hover) {
    .faqAccordion .question:where(summary):hover {
        background: #EEEEEE;
        color: var(--theme-color);
        transition: 0.3s;
    }

    .faqAccordion .question:where(summary):hover::before {
        color: #FFFFFF;
        background: var(--theme-color-dark-gray);
        transition: 0.3s;
    }

}



.faqAccordion details a {
    color: var(--theme-color);
}