﻿body {
    -webkit-text-size-adjust: 100%;
}

.schedule_list_detail_title p {
    font-size: 12px;
}

@media (max-width: 750px) {
    h1 {
        padding: 39px 0px 2px;
        font-size: 26px !important;
        width: 50%;
    }
    /* h2 {
        display:flex; align-items: center;
    } */
    /* h2 span {
        flex-shrink: 0;
    } */

    .inner {
        max-width: 100%;
        box-sizing: border-box;
        left: 0;
    }

    main .inner {
        padding: 0 24px;
    }

    footer .inner {
        min-width: 100%;
    }

    footer .inner .f_wrap .cw,
    footer .inner .f_wrap .pp {
        margin: 35px 0px 10px 0;
        position: absolute;
    }

    footer .inner .f_wrap .pp {
        left: auto;
        right: 0;
    }

    footer .inner .f_wrap .cw {
        display: block;
        position: relative;
        margin-bottom: 0;
    }

    footer .inner .f_wrap .cw p {
        padding: 10px 0;
        direction: ltr;
    }

    footer .inner .f_wrap .cw ul li.x-icon {
        left: 0px;
    }
    footer .inner .f_wrap .pp {
        margin: 5px 0px 30px 20px;
        position: relative;
        display: block;
        top: 0;
        left: 0;
        right:inherit;
        grid-area: auto;
        justify-self: start;
    }
    .navinnter span {
        display: none;
    }
    .subnav {
        display: block;
        background: var(--color_774_bg_blue);
        position: relative;
        margin: 0;
    }
    .subnav li {
        width: 100%;
        padding: 0;
        background: var(--color_774_bg_blue);
        border-bottom: var(--brw, 1px) solid #d4d0e4;
    }
    .subnav a {
    }

    /*-------------------------/*-------------------------*/
    /*  header          
    /*-------------------------/*-------------------------*/
    header .inner {
        max-width: 100%;
        padding: 0px 28px;
        box-sizing: border-box;
        position: relative;
    }

    #comp-head-title {
        width: 126px;
        height: 20px;
        margin: 22px 0px 23px;
    }

    nav {
        display: block;
        background: var(--color_774_bg_blue);
        height: 100vh;
        width: 0;
        position: absolute;
        overflow: hidden;
        transition: all .4s ease-in-out;
        z-index: 999;
        animation: fadeOutAnime .4s ease-out forwards;
    }

    nav.openNav {
        animation: fadeUpAnime .4s ease-in forwards;
        opacity: 0;
    }

    @keyframes fadeOutAnime {
        0% {
            width: 100vw;
            opacity: 1;
            left: 0;
        }

        100% {
            width: 0;
            opacity: 0;
            left: 100vw;
        }
    }

    @keyframes fadeUpAnime {
        0% {
            width: 0;
            opacity: 0;
            left: 100vw;
        }

        100% {
            width: 100vw;
            opacity: 1;
            left: 0;
        }
    }

    nav ul {
        display: block;
        width: 60%;
        margin: 67px auto 0;
    }

    .navinnter {
        display: none;
        width: 100vw;
        position: fixed;
        left: 0;
        z-index: -9999;
    }

    nav.openNav .navinnter {
        z-index: 9999;
    }

    nav a {
        width: 100%;
        display: inline-block;
        text-align: center;
        border: none;
        box-sizing: border-box;
        padding: 21px 0;
        font-size: 16px;
        border-bottom: var(--brw, 1px) solid #d4d0e4;
    }

    /*-------------------------/*-------------------------*/
    /*  #MENU_AS_CONTAINER_TOGGLE          
    /*-------------------------/*-------------------------*/
    #MENU_AS_CONTAINER_TOGGLE {
        width: 29px;
        height: 24px;
        position: absolute;
        right: 21px;
        top: 19px;
        z-index: 9999;
    }

    #MENU_AS_CONTAINER_TOGGLE {
        --rd: 0px;
        --shd: none;
        --bg: 255, 255, 255;
        --borderwidth: 0px;
        --bordercolor: var(--color_11);
        --alpha-bordercolor: 1;
        --rdOpen: 0px;
        --shdOpen: none;
        --bgOpen: 255, 255, 255;
        --borderwidthOpen: 0px;
        --bordercolorOpen: var(--color_11);
        --lineColor: var(--color_21);
        --alpha-lineColor: 1;
        --lineColorOpen: var(--color_21);
        --alpha-lineColorOpen: 1;
        --boxShadowToggleOn-shd: none;
        --boxShadowToggleOn-shdOpen: none;
        --alpha-bg: 0;
        --alpha-bgOpen: 0;
        --alpha-bordercolorOpen: 0;
    }

    [data-mesh-id=SITE_HEADERinlineContent-gridContainer]>[id="MENU_AS_CONTAINER_TOGGLE"] {
        position: relative;
        margin: 12px 0px 12px calc((100% - 320px) * 0.5);
        left: 280px;
        grid-area: 1 / 1 / 2 / 2;
        justify-self: start;
        align-self: start;
    }

    .dgPk4k,
    .dgPk4k.qQAcOx {
        align-items: center;
        box-sizing: border-box;
        display: flex;
        height: 100%;
        justify-content: center;
        width: 100%;
    }

    .dgPk4k {
        background-color: rgba(var(--bg, var(--color_11)), var(--alpha-bg, 1));
        border: solid var(--borderwidth, 0) rgba(var(--bordercolor, var(--color_11)), var(--alpha-bordercolor, 1));
        border-radius: var(--rd, 0);
        box-shadow: var(--shd, 0 0 0 rgba(0, 0, 0, .6));
        transition: all .5s;
    }

    .a9Lpus {
        height: 27px;
        margin: auto;
        position: relative;
        width: 28px;
    }

    .UBzAay {
        background-color: rgba(var(--lineColor, var(--color_11)), var(--alpha-lineColor, 1));
        border-radius: 20px;
        height: 3px;
        left: 0;
        position: absolute;
        transition: all .25s ease-in-out;
        width: 100%;
    }

    .BDFUUv,
    .jAmyzP {
        bottom: 1px;
    }

    .jAmyzP {
        margin: auto;
        top: 0;
    }

    .openMenu .dgPk4k {
        background-color: rgba(var(--bgOpen, var(--color_11)), var(--alpha-bgOpen, 1));
        border-color: rgba(var(--bordercolorOpen, var(--color_11)), var(--alpha-bordercolorOpen, 1));
        border-radius: var(--rdOpen, 0);
        border-style: solid;
        border-width: var(--borderwidthOpen, 0);
        box-shadow: var(--shdOpen, 0 0 0 rgba(0, 0, 0, .6));
    }

    .openMenu .a9Lpus .htSWpZ {
        transform: translateY(11px) translateY(-50%) rotate(-45deg);
    }

    .openMenu .a9Lpus .UBzAay {
        background-color: rgba(var(--lineColorOpen, var(--color_11)), var(--alpha-lineColorOpen, 1));
    }

    .openMenu .a9Lpus .jAmyzP {
        opacity: 0;
    }

    .openMenu .BDFUUv {
        bottom: 3px;
    }

    .openMenu .a9Lpus .UBzAay {
        background-color: rgba(var(--lineColorOpen, var(--color_11)), var(--alpha-lineColorOpen, 1));
    }

    .openMenu .a9Lpus .BDFUUv {
        transform: translateY(-13px) translateY(50%) rotate(45deg);
    }

    .openMenu .a9Lpus .UBzAay {
        background-color: rgba(var(--lineColorOpen, var(--color_11)), var(--alpha-lineColorOpen, 1));
    }

    /*-------------------------/*-------------------------*/
    /*  #talent_wrap          
    /*-------------------------/*-------------------------*/
    #talent_wrap .schedule_list {
        width: 100%;
        margin: 100px auto;
        display: none;
    }

    .schedule_slide_inner {
        width: calc(100% * 3);
        position: relative;
        left: -100%;
    }

    .schedule_slide_inner .schedule_list {
        width: 100%;
        display: inline-block;
        padding: 0px 27px 0px;
        margin: 0px;
    }

    #nav_icon_wrap {
        top: 50px;
        right: 20px;
    }

    .schedule_list_date {
        text-align: center;
    }

    .schedule_list_date_line {
        width: calc(70% - 12px);
    }

    .schedule_list_detail_date {
        font-size: 12px !important;
    }

    .schedule_list a {
        padding: 20px 10px 12px;
    }

    .schedule_list_detail_name {
        font-size: 1.3em;
        transform: translate(0, 0);
    }

    .schedule_list_detail_icon {
        margin-right: 8px;
    }

    .schedule_list_date_text {
        font-family: futura-pt-bold;
        font-weight: bold;
        font-size: 24px !important;
        padding-bottom: 15px;
    }

    footer .inner .f_wrap {
        padding: 0 20px;
        box-sizing: border-box;
    }

    /*-------------------------/*-------------------------*/
    /*  slide_button_inner          
    /*-------------------------/*-------------------------*/
    .slide_button_inner {
        font-size: 16px !important;
        letter-spacing: 0.07em;
        position: absolute;
        top: 2px;
        transform: translate(0, 0);
        transform: rotate(0);
        cursor: pointer;
        font-family: 'Didact Gothic', sans-serif;
        width: 10%;
    }

    .slide_button_date {
        display: none;
    }

    .slide_button_text {
        display: none;
    }

    .slide_button_date.sp {
        display: block;
        font-size: 13px !important;
    }

    .slide_button_arrow {
        transform: rotate(-90deg);
    }

    .slide_button_inner.is-before {}

    .slide_button_inner.is-after {
        right: 0;
    }

    .is-before .slide_button_arrow svg {
        width: 43px;
        position: relative;
        bottom: 0;
        transform: rotate(90deg);
        margin-bottom: 10px;
    }

    .is-after .slide_button_arrow svg {
        width: 43px;
        position: relative;
        bottom: 0;
        transform: rotate(90deg);
        margin-bottom: 10px;
    }

    #slide_button {
        height: auto;
        z-index: 10;
    }

    .slide_button_inner.is-before {
        left: 1px;
    }

    .slide_button_inner.is-after {
        right: 6px;
    }

    .schedule_list_grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 15px;
        row-gap: 25px;
    }

    #talent_date {
        display: none;
    }

    #talent_wrap .schedule_list_date_line {
        width: calc(100% - 12px);
    }

    #talent_wrap .schedule_list_date #talent_name {
        padding-left: 26px;
        position: relative;
        font-weight: 600;
    }

    #talent_wrap .schedule_list_date #talent_name:before {
        display: block;
        content: "";
        width: 21px;
        height: 21px;
        background: url(../images/icon_talent_name.svg);
        background-size: cover;
        position: absolute;
        left: 0;
        top: 55%;
        transform: translate(0, -50%);
    }

    .schedule_list_detail_date {
        width: 59%;
    }

    .is-live .schedule_list_detail_date:before {
        height: 103%;
    }

    .schedule_list .schedule_list_detail {
        box-sizing: border-box;
        width: 100%;
    }
}

@media (max-width: 400px) {
    .is-live .schedule_list_detail_date {
        padding: 5px 5px 4px 49px;
    }
}

@media (max-width: 360px) {
    #MENU_AS_CONTAINER_TOGGLE {
        width: 25px;
        height: 24px;
        position: absolute;
        right: 18px;
        top: 17px;
        z-index: 9999;
    }

    header .inner {
        max-width: 100%;
        padding: 0px 24px;
        box-sizing: border-box;
        position: relative;
    }

    .openMenu .BDFUUv {
        bottom: 0;
    }


    .a9Lpus {
        height: 24px;
        margin: auto;
        position: relative;
        width: 28px;
    }

    .UBzAay {
        background-color: rgba(var(--lineColor, var(--color_11)), var(--alpha-lineColor, 1));
        border-radius: 27%;
        height: 3px;
        left: 0;
        position: absolute;
        transition: all .25s ease-in-out;
        width: 100%;
    }

    #comp-head-title {
        width: 109px;
        height: 20px;
        margin: 19px 0px;
    }

    .is-live .schedule_list_detail_date {
        padding: 5px 5px 4px 49px;
    }

    .schedule_list_detail_date {
        font-size: 11px !important;
    }
}