@charset "UTF-8";

/* ------------------common------------------ */
    :root {
        /* --ticket: #EE4E0F; */
        --ticket: #EE6A28;
        --offWhite:#FEF4DD;
        --white:#FFFFFF;
        --baseBright:#08B0BF;
        --basePale:#D3EDE5;
        --baseDarken:#076E97;
        --daisouko:#FF8633;
        --seishun:#00B8FF;
        --dondoko:#71D331;
        --mononoke:#9d67d0;
        --majo:#e076d7;
        --anchor:#FEF4DD;
        --red:#f10101;
    }
/* テキスト位置調整 */
    .ta-c{
        text-align: center;
    }
    .ti-1{
        text-indent: 1em;
    }
    .ti-0{
        text-indent: 0;
    }
    .ti_pl-1{
        padding-left: 1em;
        text-indent: -1em;
    }
/* ウェイト調整 */
    .bd{
        font-weight: bold;
    }
/* リンクに下線を追加 */
    a.link{
        text-decoration: underline!important;
    }
/* 余白調整 */
    .mr-1{
        margin-right: 1em!important;
    }
    .mt-1{
        margin-top: 1em!important;
    }
    .mt-2{
        margin-top: 2em!important;
    }
    .mb-1{
    margin-bottom: 1em!important;
    }
    .mb-4{
        margin-bottom: 4em!important;
    }
    .pl-1{
        padding-left: 1em!important;
    }
    .pl-2{
        padding-left: 2em!important;
    }
/* スマホ・PC表示の切り替え */
    .br_sp{
        display: none;
    }
    @media screen and (max-width: 767px) {
        .br_sp{
        display: block;
        }
    }
    .br_pc{
        display: block;
    }
    @media screen and (max-width: 767px) {
        .br_pc{
        display: none;
        }
    }
/* 高さの設定 */
    @media (max-width: 767px) {
        .h_3{
            height: 3em;
        }
    }
/* 各エリアのカラー */
    .col-ore{
        color: var(--daisouko)!important;
    }
    .col-bl{
        color: var(--seishun)!important;
    }
    .col-gr{
        color: var(--dondoko)!important;
    }
    .col-pur{
        color: var(--mononoke)!important;
    }
    .col-pink{
        color: var(--majo)!important;
    }
    /* 赤 */
    .red{
        color:var(--red)!important;
    }
/* 魔女の谷のアイコンの大きさを調整 */
    .majo{
        transform: scale(1.1, 1.1);
        margin-top: 5px;
    }
    @media (max-width: 767px) {
        .majo{
            margin-top: 2px;
        }
    }

/* 画像+キャプションのflexbox一旦commonに追記 */
.tableBox{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex	;
	flex-wrap: wrap;
	gap: 2em;
	text-align: center;
	font-size: 0.8em;
}
.tableBox .tableBox-item figcaption{
	margin-top: 0.75em;
}
.tableBox-item{
	max-width: 520px;
	width: 100%;
}
@media screen and (max-width: 1098px) {
	.tableBox-item{
		max-width: 100%;
		width: auto;
	}
}
@media screen and (max-width: 767px) {
	.tableBox{
		font-size: 0.85em;
	}
}
/* チケットボタンの非活性 */
#ticket .entrybtn-red.off{
    cursor: default;
    margin-bottom: 0;
}
#ticket .entrybtn-red.off .front{
    background-color:#969696;
    border: none;
}
#ticket .entrybtn-red.off:hover{
    transform: unset;
}
#ticket .entrybtn-red.off:before{
    display: none;
}