<@charset "UTF-8";>
html {
	font-size: 100%;
}
body {
	font-family: 'Quicksand';
	background-color: #fafafa;
	/* background: #fff; */
	font-weight: bold;
}
.container { margin: 150px auto; max-width: 960px; }
table {
	border-collapse: collapse;
}

td, th {
	border: 1px solid #bbb;
	padding: 0.2em;
}

thead tr,
tbody tr:nth-child(even) {
	background-color: #ECF0F1;
}

.text {
	/* font-size: 50px; */
	font-weight: bold;
	color: #4169e1;
  }

main{
	height: calc( 100vh - 48px);	/*全体の高さだよ＊任意の高さに変更してね*/
	display: flex;					/*親です！宣言*/
	flex-direction: column;			/*カラム*/
}
main section{ padding: 0px ; }
.headBlock{
	background:#fafafa;
}
.contentsBlock{
	flex: 1;						/*横幅いっぱいに伸ばすので*/
	overflow: auto;					/*スクロールします宣言*/
  background:#DDEBF7;
}

//aタグにデフォルトで指定されているCSS
a:link {
 color: #0000EE;
 text-decoration: underline;
}

a:visited {
 color: #551A8B;
 text-decoration: underline;
}

a:hover {}

a:active {
 color: #FF0000;
 text-decoration: underline;
}

.play {
	font-size: 10px;
	position: relative;
	width: 1.4em;
	height: 1.4em;
	border: 0.1em solid #39a9d6;
	border-radius: 100%;
  display: inline-block; _display: inline;
}
/* マーク */
.play::before {
	content: "";
	position: absolute;
	top: 0.3em;
	left: 0.5em;
	width: 0;
	height: 0;
	border-top: 0.4em solid transparent;
	border-left: 0.6em solid #39a9d6;
	border-bottom: 0.4em solid transparent;
}

.linkpage1 {
  display: inline-block; _display: inline;
}
.linkpage2 {
  color: #FF0000;
  font-weight: bold;
  display: inline-block; _display: inline;
}
.btn_1 {
	display: inline-block; _display: inline;
}
.btn_2 {
	display: inline-block; _display: inline;
}
.btn_3 {
	display: inline-block; _display: inline;
}
.btn_4 {
	display: inline-block; _display: inline;
}
.btn_5 {
	display: inline-block; _display: inline;
}
.btn_7 {
	display: inline-block; _display: inline;
}
.btn_8 {
	display: inline-block; _display: inline;
}
.btn_9 {
	display: inline-block; _display: inline;
}
.bottom     {   vertical-align: bottom;         }

.clearfix {
	clear: both;
  }
  
  label {
	float: left;
	width: 10%;
	line-height: 1.5;
  }
  
.rate-value, .pitch-value {
	/*
	float: right;
	width: 5%;
	line-height: 1.5;
	*/
	display: inline-block; _display: inline;
  }
  
  #rate, #pitch {
	width: 50%;
	/*
	float: right;
	width: 30%;
	*/
  }
.b-radius {
	margin-top: 10px;
	padding-top: 10px;
	width: 320px; /* ボックスの横幅を指定 */
	height: 90px; /* ボックスの高さを指定 */
	border: 2px solid #0000ff; /* 境界線を実線で指定 */
	text-align: center; /* テキストを中央寄せに指定 */
	border-radius: 10px; /* ボックスの四つ角を丸くする */
}
.c-radius {
	margin-top: 10px;
	padding-top: 10px;
	width: 1100px; /* ボックスの横幅を指定 */
	height:340px; /* ボックスの高さを指定 */
	border: 2px solid #F00; /* 境界線を実線で指定 */
	text-align: left; /* テキストを中央寄せに指定 */
	border-radius: 10px; /* ボックスの四つ角を丸くする */
}
.d-radius {
	margin-top: 10px;
	padding-top: 10px;
	width: 1100px; /* ボックスの横幅を指定 */
	height:340px; /* ボックスの高さを指定 */
	border: 2px solid #090; /* 境界線を実線で指定 */
	text-align: left; /* テキストを中央寄せに指定 */
	border-radius: 10px; /* ボックスの四つ角を丸くする */
}
.e-radius {
	margin-top: 10px;
	padding-top: 10px;
	width: 1100px; /* ボックスの横幅を指定 */
	height:820px; /* ボックスの高さを指定 */
	border: 2px solid rgb(57, 4, 247); /* 境界線を実線で指定 */
	text-align: left; /* テキストを中央寄せに指定 */
	border-radius: 10px; /* ボックスの四つ角を丸くする */
}