@charset "UTF-8";
/* CSS Document */

body  {
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height:1.5em;
	font-size:16px;
	color:#000;
	/*text-align:center; */
	background-color:  #e9cf5f!important; 
	 background-image:url("img/bg_chara_tate2.png"), repeating-linear-gradient(-45deg,#eede8e,#eede8e 7px,transparent 0, transparent 14px);
	
	background-repeat: repeat;background-size:300px,100%;
	/*
	background-image: linear-gradient(45deg, #eede8e 25%, transparent 25%, transparent 50%, #eede8e 50%, #eede8e 75%, transparent 75%, transparent);background-size: 50px 50px;background-color: #e9cf5f;*/
	
	}
	
	
	/* animate delay*/
.animate__delay-01s {animation-delay: calc(var(--animate-delay) * 0.1);}
.animate__delay-02s {animation-delay: calc(var(--animate-delay) * 0.2);}
.animate__delay-03s {animation-delay: calc(var(--animate-delay) * 0.3);}
.animate__delay-04s {animation-delay: calc(var(--animate-delay) * 0.4);}
.animate__delay-05s {animation-delay: calc(var(--animate-delay) * 0.5);}
.animate__delay-06s {animation-delay: calc(var(--animate-delay) * 0.6);}
.animate__delay-07s {animation-delay: calc(var(--animate-delay) * 0.7);}
.animate__delay-08s {animation-delay: calc(var(--animate-delay) * 0.8);}
.animate__delay-09s {animation-delay: calc(var(--animate-delay) * 0.9);}


.noto-sans-jp-<uniquifier> {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}


.noto-serif-jp-<uniquifier> {
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}


.noto-sans-<uniquifier> {
  font-family: "Noto Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}

.m-plus-2-<uniquifier> {
  font-family: "M PLUS 2", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

@media print {
.noprint{
  display:none;}
#fp-wrap{ display:none;}
	}
#fp-bhp .cx-gam-ad{overflow:hidden;}

#photo img, .photo, #archive img {/*pointer-events: none;*/
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-moz-touch-callout:none;
	-moz-user-select:none;
	touch-callout:none;
	user-select:none;}
	
	
img{ /* SPの長押し禁止 */
	    -webkit-touch-callout:none;
	    -webkit-user-select:none;
	    -moz-touch-callout:none;
	    -moz-user-select:none;
	    user-select:none;
	}

#fp-contents a:link {
	color:#FFF;
	text-decoration: none;
}
#fp-contents a:visited {
	color:#FF0;
	text-decoration: none;
}
#fp-contents a:hover {
	color:#ffe500;
	text-decoration:underline;
}
#fp-contents a:active {
	color:#666;
	text-decoration:underline;
}
.fclear{ clear:both;}


ul.navi2025{ margin:0 auto; z-index: 100;height: 50px; position: fixed;  width: fit-content;right: 0; bottom: 65%; } 
ul.navi2025::after { content: " "; display: block; clear: both;}

ul.navi2025 li{ border-bottom:#FFF solid 1px; padding:12px 10px 14px;list-style:none; background-color: rgba(0,0,0,0.6);}
ul.navi2025 li:hover{background-color: rgba(0,0,0,0.8);}
ul.navi2025 li:nth-of-type(1){/*width:221px;*/ padding: 5px 0 2px;}
ul.navi2025 li:nth-of-type(1) img{width: 80px;}
/*
ul.navi2025 li:nth-of-type(2){width:145px;}
ul.navi2025 li:nth-of-type(3){width:145px;}
ul.navi2025 li:nth-of-type(4){width:115px;}*/
ul.navi2025 li:last-child{ border-bottom:none; padding: 10px 5px;}
ul.navi2025 li:last-child img{ width: 120px;}
ul.navi2025 li img:hover{opacity: 0.7;}

ul.navi2025 li{font-size: 20px;font-family: "Noto Sans JP", sans-serif; font-weight: 700;}
ul.navi2025 li a{ color: #fff;}
ul.navi2025 li a:hover{
  text-decoration: none;
  text-shadow: 2px 3px 3px rgba(255, 229, 0, 0.6);}

#chara-page ul.navi2025 li{ padding:12px 10px 14px; width: 110px;}
#chara-page ul.navi2025 li:nth-of-type(1){/*width:221px;*/ padding: 5px 10px 2px;}

#fp-contents{ text-align: center;}

.mw1000,
.mw600{display: none}
.no600{}


#content{width:90%;max-width: 1100px;margin: 0 auto 100px;background: rgba(255,255,255,0.5);
}

#top-area{width: 100%; /*background:#ffe500;*/ padding-top: 15px;}
#top-area::after { content: " "; display: block; clear: both;}

#top-area h1{ font-family: 'Noto Sans JP', sans-serif; font-weight: 900; font-size: 26px; letter-spacing: 0.1em; 
padding: 15px 0; text-align: center;background-color: rgba(255,255,255,0.8); width:100%;}

.top-area_left{  width:590px; margin:0; padding:0 20px 20px; float: left;}
.top-area_right{ width: 32%; margin:0 0 0 20px; padding:0 5% 20px 0; float:left;}

#slide_show img {
	max-width: 100%;
	height: auto;
	width /***/: auto;
}
@media screen and (max-width: 1200px){
.top-area_left{ padding:0 0px 20px;}
.top-area_right{ width: 31%;padding:0 3% 20px 0;}
}

@media screen and (max-width: 1100px){
#content{width:100%;}
ul.navi2025{display: none;}
.ulnavipc ul#navi{display: none;}

}

@media screen and (max-width: 1000px){
.mw1000{display: inline-block}

#top-area h1{margin: 0 auto;width:590px;}

.top-area_left{  width:90%; margin:0 auto; padding:0px; float: none;}
.top-area_right{ width: 90%; margin:0 auto; padding:20px; float:none;}
#slide_show{margin: 0 auto;}
}

@media screen and (max-width: 900px){
}

@media screen and (max-width: 700px){
.top-area_left,
.top-area_right{  width:90%; padding:0 0px 20px;}
}

@media screen and (max-width: 600px){
.no600{display: none;}
.mw600{display: inline-block}

#slide_show{width: 90%;}
#top-area{width: 100%; /*background:#ffe500;*/ padding-top:0px;}
#top-area h1{width:90%;padding: 20px 0; }
.top-area_left,
.top-area_right{  width:100%; padding:0 0px 20px;}
}

@media screen and (max-width: 550px){
#top-area h1{width:85%;letter-spacing: 0;font-size: 19px; text-align: left; padding: 20px 0 15px 5%;}

}

.next::after { content: " "; display: block; clear: both;}
.next{width:590px; margin:0px auto; padding:5px 0 10px 0;background-color: rgba(255,255,255,0.9);}

.next h2{font-family: 'Noto Sans JP', sans-serif; font-weight: 900; font-size:30px;
background:url("img/h2_bg2025.png") no-repeat; background-size: 580px;
background-position: left center;
width:600px; height:50px; text-align:left; padding:25px 0 0 55px; margin:0 auto;}
/*.next h2 span{display: none;}*/

.next .text_box::after { content: " "; display: block; clear: both;}

.next .text_box{ float:left; width: 275px; padding:5px 0px 20px; /*min-height: 490px;*/ font-size: 15px; font-weight: bold;}
.next .next_photo{float:right; width: 300px;margin:0 15px 0 0;}


.next .text_box span{font-size:12px; }
.next .text_box h4{font-size:13px; margin:10px auto 5px; font-weight: bold; color: #000;}
.next .text_box h4:first-child{font-size:16px; }

.next .text_box ul { list-style: none; margin:0px;}
.next .text_box ul li:nth-child(odd){ margin: 10px 0 0;}
.next .text_box ul li:nth-child(even){ font-size:12px !important; line-height: 16px;}


.next img.photo{margin:0px 10px 13px 10px; width:290px; padding:0;}
/*margin-bottomは15pxか5pか10px　通常は13px、解説員が2人の場合は8px*/
/*通常はmargin-bottom 8px*/
/*次回休み、解説員3人、写真が3枚の時は、margin-bottomは16px*/
/*総集編　写真２枚の時はmargin-bottomは6px*/


@media screen and (max-width: 600px){
.next{width:90%;}
.next h2{background-size: 87%;width:100%;padding:10px 0 0 35px;font-size:22px;background-position: left 10px;}
.next h2 span{display: inline-block; font-size: 19px;}

.next .text_box{float:none; width: 90%;margin:-10px auto 0;  font-size: 18px; font-weight: bold; min-height:inherit;}
.next .text_box span{font-size:14px; }

.next .text_box ul li:nth-child(odd){ margin: 10px 0 0; font-weight: bold;}
.next .text_box ul li:nth-child(even){ font-size:14px !important; line-height: 17px; font-weight: bold;}

.next .next_photo{float:none; width: 100%;margin:0 auto; }

.next img.photo{margin:5px auto; width:90%;}

}



.next hr{ margin:18px 20px; border-top:dotted 2px; border-bottom:none;}



#cast2024{width:100%; margin:10px auto ; padding:0 0 20px; margin-left: 3px;}

#cast2024 hr{background:#ffe500;border: none; border-top: 5px solid #000;border-bottom: 10px solid #000; color: #000; font-size: 25px; text-align: center; margin: 25px 0;
font-family: 'Noto Sans JP', sans-serif; font-weight: 900;height: 50px;}

#cast2024::after,
.member_ph::after
{ content: " "; display: block; clear: both;}

.member_ph{width: fit-content; margin: 0 auto;}

#cast2024 h2{/*background:#ffe500;*/ background-color: rgba(255,229,0,0.8); border-top: 10px solid #000;border-bottom: 10px solid #000; color: #000; font-size: 28px; text-align: center; margin: 25px 0;
font-family: 'Noto Sans JP', sans-serif; font-weight: 900; padding: 25px 0;}
#cast2024 h2 span{font-size: 35px;}

#cast2024 .cast img{width: 250px; border-radius:50%;}
#cast2024 .cast{width:300px; float: left; }
#cast2024 .cast:nth-child(odd){margin: 3px 13px 15px 0px;}
#cast2024 .cast:nth-child(even){margin: 3px 0px 15px 13px;}
/*#cast2024 .cast:nth-of-type(3),
#cast2024 .cast:nth-of-type(5){margin: 3px 0px 15px 13px;}
#cast2024 .cast:nth-of-type(4),
#cast2024 .cast:nth-of-type(6){margin: 3px 13px 15px 0px;}*/


#cast2024 .commentator{width:300px; float: left; margin-left: 3px;}
#cast2024 .commentator:nth-of-type(4){clear: left;}

#cast2024 .cast1{width:300px; float: left; margin-left: 3px;}
#cast2024 .cast2{width:300px; float: right; margin-right: 3px;}
#cast2024 .cast3{width:300px; float: none; margin:0 auto; clear: both;}

#cast2024 .commentator img{width:250px; border-radius:50%;}
#cast2024 p{font-size:18px; text-align: center; font: bold; margin: -35px auto 25px; background-color: #fff;width: fit-content;padding: 40px 15px 10px; 
border-radius: 0px 0px 15px 15px; }
#cast2024 span{font-size: 13px; line-height: 16px; display: inline-block; margin-bottom: 5px;}


@media screen and (max-width: 1000px){
#cast2024 .commentator:nth-of-type(3){clear: left; margin-left: 25%;}
#cast2024 .commentator:nth-of-type(4){clear: inherit;}
}

@media screen and (max-width:700px){
#cast2024 .cast,
#cast2024 .commentator{width:250px;}

#cast2024 .cast img,
#cast2024 .commentator img{width:225px;}
}

@media screen and (max-width:600px){
#cast2024 .cast,
#cast2024 .commentator{width:190px;}

#cast2024 .cast img,
#cast2024 .commentator img{width:170px;}

#cast2024 .cast:nth-child(odd),
#cast2024 .cast:nth-child(even){margin: 0 0 0 3px;}

#cast2024 p{font-size:18px; font-weight: bold;}
}




#middle-area{width: 100%;}
#middle-area::after { content: " "; display: block; clear: both;}

.middle-area_left,
.middle-area_center,
.middle-area_right{width: 30%; float: left; margin: 0 0.5%;}


#popup{
	width:90%; max-width: 1000px;
	margin:0 auto;
	background-color:#FFF;
	padding:15px 8px 25px 8px;
	text-align:center;
}
#popup img{
	-webkit-touch-callout:inherit;
	-webkit-user-select:inherit;
	-moz-touch-callout:inherit;
	-moz-user-select:inherit;
	touch-callout:inherit;
	user-select:inherit;}
	
	
#popup img{ /* SPの長押し禁止 */
	    -webkit-touch-callout:inherit;
	    -webkit-user-select:inherit;
	    -moz-touch-callout:inherit;
	    -moz-user-select:inherit;
	    user-select:inherit;
	}
	
#popup p.text{margin:30px auto; font-size:19px;font-family: "Noto Sans JP", sans-serif; font-weight: 700; line-height: 2; text-align: center;}
#popup p.text span{font-size: 14px; display: inline-block;}
@media screen and (max-width:600px){
#popup p.text span{ text-align: left;}
}

.virtual_photo{margin:10px auto 20px; width: 400px;}
.v-dl img{width: 100%;}
