﻿@charset "utf-8";

/*==共通レイアウト==*/

/*==========================================
 body
===========================================*/
* { 
    margin: 0px; 
    padding: 0px; 
}
html {height: 100%;  margin:0px;}
body {
  width: 100%;
  height: 100%;
  margin:0px;
  background-color:#000;/*#f5f5f5;*/
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  color:#000;
  box-sizing: border-box;

}
nav,#news,#twitter,h3,h4,h6,.news_cate,.game_cate01,#menu_m,#nav_02,#storyBox,#contents_menu,#contents_menu02,#world_text,#news_t,.chara_text,#chara_name_m,#chara_cv,.cd_t01,.cd_l01,.dorama_list,.dorama_list02,#kasi,.kasi_song,#dlhanbai {font-family: "Sawarabi Mincho"; }

a {
  color:#000;
  text-decoration:none;
}
a:hover {
  color:#333;
  text-decoration:underline;
}
div#stage {
    width:100%;
    background-color:#000;
	background-image: url("../img/cd_bg02.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
	margin:0;

}

div#stage .et {height: 100%;}

.pcbr {display:block;}
.mbr {display:none;}

/*----900以下------*/
@media screen and (max-width: 900px) {
	div#stage {
		background-image: url("../img/cd_bg02.png");
		background-position: center center;
		background-repeat: no-repeat;
		background-attachment: fixed;
		background-size: cover;
		height: auto;
	}
	.pcbr {display:none;}
	.mbr {display:block;}
}


#stage_bg{
	width:100%;

}



#contents_bg {
	width:100%;
	height: auto;
	background:url("../img/bg/dust.png");
	background-color:rgba(0,0,0,0.2);
	background-size: cover;
	background-repeat: repeat;
	background-attachment: fixed;
	background-blend-mode:lighten;
}

#contents_02 {
	width: 913px;
	/*background: rgba(245,240,222,0.8);*/
	text-align:center;
	margin: auto;
	height: 100%;

}
#contents_title {
	position: absolute;  
    right: 0;  
    top: -57px;
}

@media screen and (max-width: 900px) {
	#contents_02 {
		width: 95%;

	}
}

/*==========================================
ヘッダーのスタイル
===========================================*/
.header img{
	width: 100%;

	height: auto;
	margin: 0;
	padding: 0;
}
.haader_menu {
	position: sticky;
	top: 0;
	z-index: 999;
}
ul.h_menu{
	list-style: none;
	background-color: #000;
	margin-top: -5px;
	padding: 20px;
	color: #fff;
	z-index: 999;
	display: flex;
	align-items:center;

}

.menu1 {
	flex: 1;
	text-align: center;
	letter-spacing: 2px;	
}
li.menu1 {
	border-right: 1px solid #d9c9ff;
}
li.menu1:last-child {
	border: none;
}
.menu1 a {
	color: #d9c9ff;
}
.menu1 a:hover {
	color: #ffcc5e;
	text-decoration: none;
}
.pan {
	font-size: 12px;
	text-align: left;
	padding-left: 10px;
	color: #4a4a4a;
}
.pan a{
	color: #793bff;
}
/*----900以下------*/
@media screen and (max-width: 900px) {
	ul.h_menu{
		padding: 10px 0;
	}
	.menu1 {
		font-size: 12px;
	}
}

/*==========================================
 フッターのスタイル
===========================================*/
footer {
	width: 100%;
    /*border-top: solid 3px #3870ff;*/
    background:#000;
    color: #6b6045;

	bottom:0;
	/*bottom:-20px;*/
	font-family: "Sawarabi Gothic"; 
	font-size:0.8em;
	line-height:1.4em;

}
footer div small {font-size: 0.6em;}
footer a {color:#ddd;}
footer a:hover {
	color:#6b8cc2;
	text-decoration:none;
}
#footer_bottom {
	width: 100%;
	/*background-color: #ececec;*/
	margin: auto;
	text-align: center;
	padding: 20px 0;
	vertical-align:top;



}

/*==========================================
サントラ部分
===========================================*/
#sound_t01 {
	color: #fff;/*文字色*/
	border: solid 1px #000;/*線色*/
	padding: 1em;/*文字周りの余白*/
	border-radius: 1px;/*角丸*/
	background: rgba(0,0,0,0.9);
	font-size:1.3em;
	letter-spacing:0.2em;
	font-family: "Sawarabi Mincho";
	line-height:32px;
}
.youtube {
  position: relative;
  width: 95%;
  padding-top: 56.25%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 95%;
  height: 100%;
}

.list_t {
	color: #fff;/*文字色*/
	padding: 0.5em;/*文字周りの余白*/
	display: inline-block;/*おまじない*/
	line-height: 1.3;/*行高*/
	background: #000;/*背景色*/
	vertical-align: middle;/*上下中央*/
	border-radius: 25px 0px 0px 25px;/*左側の角を丸く*/
	width:90%;
	font-weight: bold;
	margin:10px;
}
.list_t:before {
	content: '●';
	color: white;
	margin-right: 8px;
}



.cd_t01 {
	background: #282828;/*背景色*/
    padding: 0.7em;/*文字まわり（上下左右）の余白*/
	color:#fff;
	margin:0 10px 10px 10px;
	text-align:left;
	font-size:1.1em;

	letter-spacing: 3px;
}
.cd_t01 a {color:#fff;}
.cd_t02 {
	background: rgba(26,18,75,0.8);/*背景色*/
    padding: 0.3em 1em; /*文字まわり（上下左右）の余白*/
	color:#fff;
	margin:10px;
	text-align:left;
	font-size:1.1em;

	font-family: "Sawarabi Gothic"; 
}
.cd_t03 {
	background: rgba(0,0,0,0.8);/*背景色*/
    padding: 0.4em;/*文字まわり（上下左右）の余白*/
	color:#fff;
	margin:0;
	text-align:left;
	font-size:1em;

}

#cd_left {
	width:650px;
	margin: auto;
}
#cd_left img{width: 650px;}
#cdImg {
	text-align:center;
	width:650px;
}
#cdImg a {color:#c24141;font-weight:bold;}
#cdImg a:hover {color:#5741c2;}
#cd_right {
    width:650px;
	text-align:center;
	margin:auto;
	font-family: "Sawarabi Gothic"; 
	color:#2e2e2e;
	padding:0 20px;
}
#cd_list {
    text-align:left;
	line-height:1.5em;
	padding-top:40px;
}
#cd_list02 {
    text-align:left;
	line-height:1.5em;
	padding-top:10px;
}
.cd_hatubai {
	padding:20px 0;
	border-top: #000 solid 1px;
	margin:20px 10px 0 0;
}
#t_list {
	margin:20px;
	display:flex;
	justify-content: center;
}
#t_list ul li {
	list-style:none;
}
.track_list,.track_list02 {
	width:45%;
	text-align:left;
	font-size:1.1em;
}
/*.track_list{float:left;}
.track_list02{float:right;}*/
.cd_l01 {
	width:95%;	
	border-bottom: #000 solid 1px;
	padding:15px;
	font-weight:bold;
	color:#434343;
	line-height:1.5em;
}
#sound_contents {
    background: url("../img/cd/001_bg.png");
	/*background: rgba(0,0,0,0.5);*/
	position: relative;
	border-radius:0 0 10px 10px;
	padding-top: 10px;

}
/*#sound_contents img{max-width:600px;}*/

.dorama_list,.dorama_list02 {
	width:45%;
	text-align:left;
	font-size:1.1em;
	border:1px splid #000;
	line-height:1.2em;
}
.dorama_list{float:left;}
.dorama_list02{float:right;}


@media screen and (max-width: 900px) {
	#sound_t01 {font-size:1em;}
	#t_list {display:block;}
	#cd_right {width:95%;}
	#cd_left {width:95%;}
	#cd_list {width:95%;}
	.track_list,.track_list02 {width:98%; font-size:1em;}
	#sound_contents img{width:95%;}
	#cd_left {
		width:100%;
	}
	#cd_left img{width:90%;}
	#cdImg {
		width:100%;
	}
}

#kasi {
	font-weight:bold;
}
.kasi_t {
	font-size:1.5em;
	color:#584c9f;
	font-weight:bold;
	border-bottom: 2px solid #584c9f;
	margin:20px 20px 5px 20px;
	padding-bottom:10px;
	text-align:left;
	font-family: "Sawarabi Mincho";
}
.kasi_uta {
	color:#584c9f;
	text-align:right;
	font-size:1.2em;
	margin:0 20px 20px 20px;
	font-family: "Sawarabi Mincho";
}
.kasi_song {
	padding:20px;
	font-size:1.2em;
	line-height:1.4em;
	font-weight:bold;
}
#official_bnr {text-align:center;}
#official_bnr img{max-width: 80%;}

@media screen and (max-width: 900px) {
	.kasi_t {font-size:1.4em;}
	.kasi_uta {font-size:0.8em;}
	.uta_dusc2 {display:none;}
	.kasi_song {font-size:1em;}
	#official_bnr img{max-width: 90%;}
}
/*-オフ通-*/
#offbox {
    width:650px;
	text-align:center;
	margin:auto;
	font-family: "Sawarabi Gothic"; 
	color:#2e2e2e;
	padding:0 20px;
    text-align:left;
	line-height:1.5em;
}
#offbox a{color:#c99914;}
.offbox_in {
	border:2px dashed #584c9f;
	padding:15px;
}
.offbox_in ul {
	padding-left:20px;
}
.nekoposu {
	font-weight:bold;
	color:#584c9f;
}
#sound_t02 {
	color: #fff;/*文字色*/
	border: solid 1px #000;/*線色*/
	padding: 1em;/*文字周りの余白*/
	border-radius: 1px;/*角丸*/
	background: rgba(26,18,75,0.8);/*背景色*/
	font-size:1.1em;
	letter-spacing:0.2em;
	font-family: "Sawarabi Mincho";
	line-height:32px;
}
@media screen and (max-width: 900px) {
	#offbox {
        width:95%;
	    padding:0;
	}
	
}

/*追加：表*/
.cdgaiyou {
	width: 100%;
	}
	
	.cdgaiyou th,
	.cdgaiyou td {
	border: 1px solid #ccc;
	padding:10px 20px;
	}
	
	.cdgaiyou th {
	font-weight: bold;
	background-color: #dedede; 
	width: 180px;
	}
	
	@media screen and (max-width: 767px) {
		table,tbody {width: 100%;}
		.cdgaiyou th,
		.cdgaiyou td {
			display: block; /* デフォルト値に指定 */
			border-bottom: 1px solid #ccc;
			color: #000;
		}
		.cdgaiyou th {width: auto;}
		table.cdgaiyou {width: 100%;}

	}
/*追加・ムービー*/
.myboxfont a {color: #7f46b5;}
.myboxfont a:hover {color: #ffc464;}
@media screen and (max-width:650px) {
	.mybox{
		width: 98%;
		font-size: 12px;
		line-height: 18px;
	}
	.soundimg img{width: 100%;}
	.moviearea {width: 100%;}
	video {
		width: 90%; /* 動画をレスポンシブ化 */
		max-width: 640px; /* 動画の最大幅 */
		height: auto;
	 }
}

.disc_box {
	display:flex;
	 justify-content: center;
}
del {
    color: #f00;
}
span {
    color: #000;
}
ruby {
    ruby-position:over;
	ruby-position: under;
}
rt {
  font-size: 1em;
  color:red;
}