@charset "utf-8";
/*
************************************************************************
 ボックス
************************************************************************
*/
.grid
{
	display: flex;
	flex-wrap: wrap;
	margin:0 -1em;
}
.grid > *
{
	margin:1em;
	flex:0 0 calc(100% - 2em);
}
.grid > *.col-01 {flex: 0 0 calc(  8.33333% - 2em);}
.grid > *.col-02 {flex: 0 0 calc( 16.66666% - 2em);}
.grid > *.col-03 {flex: 0 0 calc( 25.00000% - 2em);}
.grid > *.col-04 {flex: 0 0 calc( 33.33333% - 2em);}
.grid > *.col-05 {flex: 0 0 calc( 41.66666% - 2em);}
.grid > *.col-06 {flex: 0 0 calc( 50.00000% - 2em);}
.grid > *.col-07 {flex: 0 0 calc( 58.33333% - 2em);}
.grid > *.col-08 {flex: 0 0 calc( 66.66666% - 2em);}
.grid > *.col-09 {flex: 0 0 calc( 75.00000% - 2em);}
.grid > *.col-10 {flex: 0 0 calc( 83.33333% - 2em);}
.grid > *.col-11 {flex: 0 0 calc( 91.66666% - 2em);}
.grid > *.col-12 {flex: 0 0 calc(100.00000% - 2em);}
.grid > *.grid-center{align-self:center;}
.grid > *.order-1{order:1;}
.grid > *.order-2{order:2;}
.grid > *.col-shrink{flex:0 1 auto;}
.grid > *.col-grow{flex:1 0 auto;}


.grid.input-form
{
	display: flex;
	flex-wrap: wrap;
	margin:0 -0.25em;
}
.grid.input-form > *
{
	margin:0.25em;
	flex:0 0 calc(100% - 0.5em);
}
.grid.input-form > *.col-01 {flex: 0 0 calc(  8.33333% - 0.5em);}
.grid.input-form > *.col-02 {flex: 0 0 calc( 16.66666% - 0.5em);}
.grid.input-form > *.col-03 {flex: 0 0 calc( 25.00000% - 0.5em);}
.grid.input-form > *.col-04 {flex: 0 0 calc( 33.33333% - 0.5em);}
.grid.input-form > *.col-05 {flex: 0 0 calc( 41.66666% - 0.5em);}
.grid.input-form > *.col-06 {flex: 0 0 calc( 50.00000% - 0.5em);}
.grid.input-form > *.col-07 {flex: 0 0 calc( 58.33333% - 0.5em);}
.grid.input-form > *.col-08 {flex: 0 0 calc( 66.66666% - 0.5em);}
.grid.input-form > *.col-09 {flex: 0 0 calc( 75.00000% - 0.5em);}
.grid.input-form > *.col-10 {flex: 0 0 calc( 83.33333% - 0.5em);}
.grid.input-form > *.col-11 {flex: 0 0 calc( 91.66666% - 0.5em);}
.grid.input-form > *.col-12 {flex: 0 0 calc(100.00000% - 0.5em);}
.grid.input-form > *.grid-center{align-self:center;}
.grid.input-form > *.order-1{order:1;}
.grid.input-form > *.order-2{order:2;}
.grid.input-form > *.col-shrink{flex:0 1 auto;}
.grid.input-form > *.col-grow{flex:1 0 auto;}

.scroll
{
	overflow-x:scroll;
}
.scroll::-webkit-scrollbar {
    width: 3px;
    height: 3px;
}
.scroll::-webkit-scrollbar-track {
    background-color: #EFEFEF;
}
.scroll::-webkit-scrollbar-thumb {
	background:var(--brand-color-grd);
}

.scroll-y
{
	overflow-y:scroll;
}
.scroll-y::-webkit-scrollbar {
    width: 3px;
    height: 3px;
}
.scroll-y::-webkit-scrollbar-track {
    background-color: #EFEFEF;
}
.scroll-y::-webkit-scrollbar-thumb {
	background:var(--brand-color-grd);
}

.cast
{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;

	margin:-0.5em;
}
.cast .cast-item
{
	margin:0.5em;
	flex:0 0 calc(20% - 1em);
}
.cast .cast-item .thumbnail
{
	width:100%;
	padding-top:100%;

	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	background-color: #EEEEEE;
	border:1px solid #CCCCCC;
}
.cast .cast-item .role,
.cast .cast-item .actor
{
	font-size: 0.9em;
	color: #666666;
}

.live_movie_tag iframe
{
	width:100%;
	min-height:460px;
}

/* ################################################################################################ */
/* ## TAB                        ################################################################## */
/* ################################################################################################ */
@media screen and (max-width:1040px) {
}

/* ################################################################################################ */
/* ## スマホサイト用スタイル ###################################################################### */
/* ################################################################################################ */
@media screen and (max-width:640px) {
	.grid > *.col-01 {flex: 0 0 calc( 50.00000% - 2em);}
	.grid > *.col-02 {flex: 0 0 calc( 50.00000% - 2em);}
	.grid > *.col-03 {flex: 0 0 calc( 50.00000% - 2em);}
	.grid > *.col-04 {flex: 0 0 calc( 50.00000% - 2em);}
	.grid > *.col-05 {flex: 0 0 calc( 50.00000% - 2em);}
	.grid > *.col-06 {flex: 0 0 calc(100.00000% - 2em);}
	.grid > *.col-07 {flex: 0 0 calc(100.00000% - 2em);}
	.grid > *.col-08 {flex: 0 0 calc(100.00000% - 2em);}
	.grid > *.col-09 {flex: 0 0 calc(100.00000% - 2em);}
	.grid > *.col-10 {flex: 0 0 calc(100.00000% - 2em);}
	.grid > *.col-11 {flex: 0 0 calc(100.00000% - 2em);}
	.grid > *.col-12 {flex: 0 0 calc(100.00000% - 2em);}
	
	.grid > *.order-1{order:0;}
	.grid > *.order-2{order:0;}

	.grid > *.sp-col-01 {flex: 0 0 calc(  8.33333% - 2em);}
	.grid > *.sp-col-02 {flex: 0 0 calc( 16.66666% - 2em);}
	.grid > *.sp-col-03 {flex: 0 0 calc( 25.00000% - 2em);}
	.grid > *.sp-col-04 {flex: 0 0 calc( 33.33333% - 2em);}
	.grid > *.sp-col-05 {flex: 0 0 calc( 41.66666% - 2em);}
	.grid > *.sp-col-06 {flex: 0 0 calc( 50.00000% - 2em);}
	.grid > *.sp-col-07 {flex: 0 0 calc( 58.33333% - 2em);}
	.grid > *.sp-col-08 {flex: 0 0 calc( 66.66666% - 2em);}
	.grid > *.sp-col-09 {flex: 0 0 calc( 75.00000% - 2em);}
	.grid > *.sp-col-10 {flex: 0 0 calc( 83.33333% - 2em);}
	.grid > *.sp-col-11 {flex: 0 0 calc( 91.66666% - 2em);}
	.grid > *.sp-col-12 {flex: 0 0 calc(100.00000% - 2em);}
	
	.cast .cast-item
	{
		margin:0.5em;
		flex:0 0 calc(33.33333% - 1em);
	}
}