@charset "utf-8";
/*-------------------------*/
/*Reset*/
html{margin:0; padding:0; border:0; overflow-y:scroll;}
*{border:0; box-sizing: border-box; margin:0; padding:0;}
body{background: #cdbcf2 url("../img/bg.webp?250610") fixed repeat-y top center / 100%;line-height:1; -webkit-text-size-adjust:100%; width:100%;}
h1,h2,h3,h4,h5,h6,p,span,table,a,img,dl,dt,dd,ul,li,ol,iframe,nav,small{
margin:0;	padding:0; font-size:100%;font-weight:normal; background:transparent;
vertical-align:baseline; border:none;}
img{vertical-align:top;}
ol, ul{list-style:none; list-style-type:none;}

/*-- Link --*/
a:link{color:#fff; text-decoration:none;}
a:visited{color:#fff; text-decoration:none;}
a:hover{color:#f00; text-decoration:none;}
.onlyPc{}
.onlySp{display: none;}
/*-------------------------*/
.KaiseiDecol_R{
font-family: "kaisei-decol", sans-serif;
font-weight: 400;
font-style: normal;
}
.KaiseiDecol_B{
font-family: "kaisei-decol", sans-serif;
font-weight: 700;
font-style: normal;
}
.ModeMinALarge_Std_L{
font-family: "mode-mincho-a-large-std", sans-serif;
font-weight: 300;
font-style: normal;
}
/*-------------------------*/

/*-- Pan_box ----------------------*/
#pan_box{
background: #cdbcf2;/* #f3d024 */
color: black;
font-size: 0.8em;
min-height: 24px;
padding: 8px 0 8px 10px;
width: 100%;
}
#pan_box .in{
margin:0 auto;
width:1260px;
}
#pan_box a{
color: black;
text-decoration:none;
}
#pan_box a:hover{color:#fff;}

#sns_button_pc{margin: 15px auto;min-height: 50px;}
#sns_button_pc .btn_sns img{height: 50px;width: 50px;margin: 0 5px;}

/*-- SNS ----------------------*/
.sns{
width:30%;
height:40px;
margin: 20px auto;
display:flex;
justify-content:space-between;
flex-wrap:wrap;
}
.sns a{
display:block;
width:40px;
height:40px;
margin:0 !important;
}
.sns img{
width:40px !important;
height:40px !important;
margin:0 !important;
}

/*-- left_side / right side  -------------------*/
#left_side {
float: none;
width: 900px;
}
#right_side{
float: none;
margin: 0 0 0 20px;
}

a img:hover{
opacity: 0.6;
}
#title img {
width: 100%;
}
#stream {
padding: 2% 0;
text-align: center;
width: 100%;
}
#stream ul{
display: flex;
margin: 0 auto;
max-width: 1200px;
}
#stream ul li{
flex-basis: 45%;
margin: 0 2.5%;
}
#stream ul li img{
width: 100%;
}
#wrapper {
color: #6a5656;
font-family: Arial, Helvetica, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "sans-serif";
/* float: left; */
margin: 0 auto;
/* width: 960px; */
width: 100%;
}
#main {
display: flex;
margin: 0 auto;
width: 1200px;
}
#main section{
background-color: white;
background-image: url(../img/bg-tl.png), url(../img/bg-tr.png),url(../img/bg-bl.png),url(../img/bg-br.png);
background-position: top -4px left -4px,top -4px right -4px,bottom -4px left -4px,bottom -4px right -4px;
background-repeat: no-repeat;
border: #d6bc46 solid 4px;
box-shadow: 0px 5px 15px 0px rgba(69, 65, 9, 0.6);
font-family: "mode-mincho-a-large-std", sans-serif;
font-weight: 300;
font-style: normal;
font-size: min(1.2em, 3.0vw);
line-height: 1.5;
margin: 0 auto 5%;
min-height: 350px;
padding: 5%;
text-align: center;
}
#main section h2{
background: linear-gradient(0deg, #292c29 0%, #626262 65%, #3b3b3b 66%, #1f1f1f 100%);
color: transparent;
-webkit-background-clip: text;background-clip: text;
-webkit-text-fill-color: transparent;text-fill-color: transparent;
font-family: "kaisei-decol", sans-serif;
font-weight: 700;
font-size: min(2.2em, 4.0vw);
font-style: normal;
margin: -2% 0 3%;
}
#main section img{
width: 100%;
}
#sns_button_pc {
margin: 15px auto;
min-height: 50px;
text-align: center;
}
/* #episode --------------------------------  */
#episode .time {
background: linear-gradient(transparent 65%, #efd8ff 65%);
display: inline;
font-size: 120%;
margin: 0 auto;
padding: 0 1%;
}
#episode .subtitle {
font-size: 120%;
font-weight: bold;
margin: 2% auto;
}
#episode .photo,
#episode .photo img{
width: 100%;
}
#episode .text {
margin: 2% 0 0 0;
text-align: left;
}
#episode #log {
background: #662d91;
border-radius: 8px;
box-sizing: border-box;
color: white;
font-size: min(1.2em, 3.0vw);
font-family: "mode-mincho-a-large-std", sans-serif;
font-weight: bold;
margin: 3% auto 0;
padding: 1.5% 2% 2% 2%;
width: 60%;
}
#episode #log option.logDef {
text-align: center !important;
}
#episode #log option {
font-size: 80%;
text-align: left;
}

/* #cast --------------------------------  */
#cast img{
box-shadow: 0px 5px 15px 0px rgba(69, 65, 9, 0.6);
margin: 1% auto;
max-width: 80%;
}

/*-- footer/PC  -------------------*/
footer{
background: #333;
clear: both;
font-size: 0.9em;
line-height: 1.5em;
margin-top: 30px;
min-height: 640px;
text-align: center;
}
footer .mx_copyright{
color:#fff;
padding: 8px 0;
}
footer .mx_copyright a{
color:#fff;
text-decoration:underline;
}
footer a{
color: #d00;
text-decoration: none;
}

/* 動画囲いタグ ----------------------　<div class="video-container"></div> */
.video-container {
padding: 56.25% 0 0;
position: relative;
width: 100%;
}
.video-container iframe{
height: 100% !important;
position: absolute;
right: 0;
top: 0;
width: 100% !important;
}

/*-- google翻訳 ----------------------*/
.skiptranslate.goog-te-gadget,
a.goog-logo-link{color:#fff !important;}

/*-- ローディング ----------------------*/
#loader{background-color:#fff; position:fixed;width:100%;height:100%;z-index: 100;}/*背景*/
.loader,.loader:before,.loader:after {
background: #aaa;
-webkit-animation: load1 1s infinite ease-in-out;
animation: load1 1s infinite ease-in-out;
height: 4em;
width: 1em;
top: 50%;
}
.loader {
color: #ccc;
text-indent: -9999em;
margin: auto;
position: relative;
font-size: 11px;
-webkit-transform: translateZ(0);-ms-transform: translateZ(0);transform: translateZ(0);
-webkit-animation-delay: -0.16s;animation-delay: -0.16s;
position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
}
.loader:before,.loader:after {
position: absolute;
top: 0;
content: '';
}
.loader:before {
left: -1.5em;
-webkit-animation-delay: -0.32s;animation-delay: -0.32s;
}
.loader:after {
left: 1.5em;
}
@-webkit-keyframes load1 {
	0%,80%,100% {
	box-shadow: 0 0;
	height: 4em;
	}
	40% {
	box-shadow: 0 -2em;
	height: 5em;
	}
	}
	@keyframes load1 {
	0%,80%,100% {
	box-shadow: 0 0;
	height: 4em;
	}
	40% {
	box-shadow: 0 -2em;
	height: 5em;
	}
}
/*--------------------------------------------------------*/

/* PC  -------------------------------------------------- */
@media screen and (min-width:1000px) {
	#sns_button_sp{
	display: none;
	}
}
/*TAB -------------------------------------------------- */
@media screen and (max-width:1000px) {
	/*-- Pan_box ----------------------*/
	#pan_box{
	box-sizing: border-box;
	padding: 3px 2%;
	font-size: 0.8em;
	line-height: 24px;
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	text-align: left;
	width: 100%;
	}
	#pan_box .in{
	color: black;
	height: 24px;
	width: 520px;
	}
	#pan_box a{
	color: black;
	font-weight: normal;
	text-decoration:none;
	}
	#pan_box a:hover{
	color: black;
	}
	#main {
	display: block;
	margin: 0 auto;
	width: 90%;
	}
	#stream ul {
	display: block;
	margin: 0 auto;
	width: 95%;
	}
	#stream ul li{
	margin: 0 2.5% 2%;
	}
	#main section {
	background-size: 25%;
	min-height: auto;
	padding: 10%;
	word-break: auto-phrase;
	}
	#episode #log{
	margin: 5% auto;
	width: 100%;
	}
	#about .text{
	text-align: left;
	}
	#cast img{
	max-width: 100%;
	}
	#sns_button_pc{
	display: none;
	}

	/*-- left_side / right side  -------------------*/
	#left_side {
	float: none;
	width: 100%;
	}
	#right_side{
	float: none;
	margin: 0 0 0 20px;
	}

	/*-- SNS -----------------------*/
	#sns_button_sp{
	padding: 15px 0;
	text-align: center;
	}
	#sns_button_sp .btn_sns{
	margin: 0 2px;
	}
	#sns_button_sp .btn_sns img{
	height: 50px; width: 50px;
	}
}
/* SP  ------------------------------------------------
@media screen and (max-width:600px) {
}-- */