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

body{ color: #313131;
background-color:#fff;-webkit-touch-callout: none;
background-color:#d4ffe6;

font-family: "Roboto", sans-serif;font-weight: 700;  font-style: normal;}

@media print {
	#no_print{display:none; width:640px;}
	#fp-wrap{ display:none;}}

/*img {pointer-events: none;}*/

img{ /* SPの長押し禁止 */
	    -webkit-touch-callout:none;
	    -webkit-user-select:none;
	    -moz-touch-callout:none;
	    -moz-user-select:none;
	    user-select:none;
	}


.fclear{clear:both;}
a img:hover{opacity: 0.8;}

.pc{}
.sp,
.br500,
.br768{ display:none;}

.share{ display:none;}


#main-content{ width: 1200px; margin: 0 auto; text-align: center;}

@media screen and (max-width: 1200px){
	#main-content{  width: 100%; margin: 0;}
}

@media screen and (max-width: 600px){
body{font-weight: bold; }
.pc{ display:none;}
.sp{ display:inline-block;}
.share{ display:inline; position:fixed; left:2%; bottom:8%; z-index:99; width:80px; }
	}

@media screen and (max-width: 500px){
.br500{ display:inline-block;}
}

.date{ display:none;}


.mplusr{font-family: 'M PLUS Rounded 1c', sans-serif;}
.smincho{font-family: 'Shippori Mincho', serif;}
.mplus{font-family:  'M PLUS 1p', sans-serif;}


/*タイムテーブル　タイトル*/
#t-table{ text-align: center; background-color:rgba(255,255,255,1); width: 80%; margin: 0 auto 10%; padding-bottom: 40px;}

img.logo{ width: 500px;}


h1{ background-color:#00a4ed;
width: 100%; text-align: center; padding: 2px 0px 0px; margin: 0px auto; font-size: 60px;
font-family: "Roboto", sans-serif;font-weight: 700;  font-style: normal; color: #fff;
line-height: 115%;
}

h2{ color: #313131; margin: 30px auto ; text-align: left; display: inline-block;font-family: "Roboto", sans-serif;font-weight: 700;  font-style: normal; 
}

.home{
	text-align:center;
	margin:50px 0;
}

.home a{
	display:inline-block;
	color:#394A63;
	text-decoration:none;
	font-size:16px;
	font-weight:700;
	padding-bottom:4px;
	border-bottom:2px solid #394A63;
	transition:.25s ease;
}

.home a:hover{
	color:#1998e3;
	border-color:#1998e3;
}

@media screen and (max-width: 768px){
#t-table{width: 96%; }
img.logo{ width: 70%;}

	h1{ line-height: 140%;font-size: 44px;}
	h2{ font-size: 14px ; margin: 20px 15px;}

}

.gohome{
	position:fixed;
	left:20px;
	bottom:20px;
	z-index:999;

	display:flex;
	align-items:center;
	gap:8px;

	padding:14px 18px;

	background:#394A63;
	color:#fff;
	text-decoration:none;
	font-size:15px;
	font-weight:700;
	letter-spacing:.03em;

	border-radius:999px;
	box-shadow:0 8px 24px rgba(0,0,0,.18);

	opacity:0;
	visibility:hidden;
	transform:translateY(20px);

	transition:
		opacity .35s ease,
		transform .35s ease,
		visibility .35s ease,
		background .25s ease,
		box-shadow .25s ease;
}

/* 表示 */
.gohome.show{
	opacity:1;
	visibility:visible;
	transform:translateY(0);
}

.gohome:hover{
	background:#4A5E7D;
	transform:translateY(-3px);
	box-shadow:0 12px 28px rgba(0,0,0,.22);
}

@media(max-width:767px){

	.gohome{
		left:14px;
		bottom:14px;
		padding:12px 16px;
		font-size:14px;
	}

}

/*楽曲リスト　タイムテーブル*/
.slist{ display: block;text-align: center; vertical-align: top;}
.slist ul.main{text-align: left; display: inline-block; width: 75%; margin: 0 auto;}
.slist ul.main:first-child{ margin-top: 30px;}

.slist ul.main > li { background-repeat: no-repeat; padding:10px 10px 10px 25px;background-image: url("img26s/list-line_mizu.png");
 background-size: 4px; border-bottom: dotted 1px #00a4ed; background-position: 3px 15px; font-size: 18px; font-weight: bold;word-break: keep-all; overflow-wrap: break-word;
color: #313131;}


/*.slist ul li:nth-child(odd){background-image: url("img23s/mark.png");}
.slist ul li:nth-child(even){background-image: url("img23s/mark2.png");}*/

.slist ul.main > li:first-child{ background-image: none; padding-left: 0; text-align: left;font-size: 22px; color: #00a4ed;font-weight: bold;}
.slist ul.main > li:nth-of-type(2){ border-top: dotted 1px #00a4ed; }
.slist ul.main > li:last-child{ background-image: none; padding-left: 0; text-align: right; font-size: 14px; font-weight: normal; border-bottom: none; color: #00a4ed;}

.slist ul.main > li span{font-size: 16px !important;}


.best { width: fit-content; background-color: #394A63; color: #fff; letter-spacing: 0.05em;
margin:20px 0 20px;text-align: left;padding:15px 10px 10px; 
font-size: 17px !important; font-weight: bold;}

.best-title{
	display:inline-block;
	margin:0 0 0 10px;
	padding:5px 15px;
	font-size:2rem;
	font-weight:800;
	color:#fff;
	background-color: #18b4ff;
	border-bottom:1px solid #fff; border-radius: 30px;
}

.best ul li{color: #fff;padding:10px 10px 10px 25px; border-bottom: dotted 1.5px rgba(209,251,255,0.6);background-image: url("img26s/list-line_mizu.png"); background-repeat: no-repeat;background-size: 3.5px;background-position: 7px 16px; font-size: 18px; font-weight: bold;word-break: keep-all; overflow-wrap: break-word;}
.best ul li:first-child{/*border-top: dotted 1.5px rgba(209,251,255,0.6);*/ margin-top: 5px;}
.best ul li:last-child{border-bottom: none;padding:10px 10px 5px 25px; }
 .best ul > li span{}

 
 @media screen and (max-width: 1200px){
.slist ul.main{width: 85%; }
}


@media screen and (max-width: 1050px){
#t-table{ width: 90%;}
.slist ul.main{ width: 90%;}
 .best{margin:30px 0 30px 9%;}


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

 .best{margin:30px 0 30px 5%;}

.slist ul.main li{ font-size: 16px !important;background-position: 8px 13px; }
.slist ul.main > li:first-child{ font-size: 22px !important;}

}

@media screen and (max-width: 768px){
#t-table{ width: 95%;}
.br768{display: inline-block;}

}


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

h2 span{display: inline-block; margin-left: 1em;}

	.slist ul.main {width: 95%;}
	.slist ul.main li{ font-size: 15px !important;padding:10px 8px 10px 12px;background-position: 0px 11px; }
 .slist ul.main li span{font-size: 12px !important;}
 
  .best{margin:30px auto;}
.slist ul.main .best ul li{font-size: 14px!important;}

.masuda{letter-spacing: -0.07em;}
.masuda span{display: inline-block; margin: 0 -5px; font-size: 0.7em!important;}


}
