/* キービジュアル  ------------------------------------------------------------*/

#header {
	position: relative;
	width: 100%;
	height: 100%;
}
#header img {
	vertical-align: bottom;
}
#slogan img {
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	top: 50%;
	width: 70%;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
	color: #fff;
	line-height: 1.2;
	text-align: center;
}
/** サブメニュー **/
.submenu {
	border-bottom: 1px solid #333333;
}
.submenu ul {
	text-align: center;
}
.submenu .select {
	opacity: 0.5;
}
/** //サブメニュー **/

/** サブメニュー以下メイン **/
#main {
	width: 100%;
	text-align: center;
	margin-bottom: 5%;
}
#main .subtitle img {
	height: 3vh;
	width: auto;
	margin-top: 5%;
}
#main .subtitle_text {
	height: 3vh;
	width: auto;
	margin-top: 5%;
	margin-bottom: 3%;
	font-weight: bold;
	font-size: 2vw;
}
#main .wave img {
	width: 5%;
	margin: 0;
}
#main .textbox {
	width: 100%;
	text-align: center;
}
#main .textbox .contents {
	display: inline-block;
	border: solid 1px #000;
	width: 70%;
	padding: 5% 0;
	margin: 5% 0;
	font-size: 2vw;
}
#main .blocks {
	width: 100%;
	text-align: center;
}
#main .blocks .two {
	display: inline-block;
	width: 70%;
	text-align: center;
}
#main .blocks .two .cell {
	text-align: center;
	width: 48%;
	margin: 1%;
}
#main .blocks .three {
	display: inline-block;
	width: 70%;
	text-align: center;
}
#main .blocks .three .cell {
	text-align: center;
	width: 30%;
	margin: 1%;
}
#main .blocks .three .cell p {
	font-size: 1.5vw;
}
#main .blocks .three_x {
	display: inline-block;
	width: 70%;
	text-align: center;
}
#main .blocks .three_x .cell {
	display: inline-block;
	width: 40%;
	margin: 1%;
}
#main .blocks .three_x .cell_x {
	display: inline-block;
	width: 5%;
	margin: 1%;
}
/** 使用例 **/

#main .blocks_outline {
	display: inline-block;
	text-align: center;
	border: solid 1px #000;
	width: 70%;
	position: relative;
}
#main .blocks_outline h1 {
	position: absolute;
	padding: 0 2vw;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
 -webkit- transform: translateY(-50%) translateX(-50%);
	margin: auto;
	font-weight: bold;
	font-size: 2vw;
	background-color: #fff;
	color: #555555;
}
#main .blocks_outline .blocks .two {
	display: inline-block;
	width: 100%;
	text-align: center;
}
#main .blocks_outline .blocks .two .cell {
	display: inline-block;
	text-align: center;
	width: 48%;
}
#main .blocks_outline .blocks .three_x {
	display: inline-block;
	width: 100%;
	text-align: center;
}
#main .blocks_outline .blocks .three_x .cell {
	display: inline-block;
	width: 40%;
	margin: 1%;
}
#main .blocks_outline .blocks .three_x .cell_x {
	display: inline-block;
	width: 5%;
	margin: 1%;
	vertical-align: top;
}


	

/** //サブメニュー以下メイン **/

/** レスポンシブ対応 **/
@media only screen and (min-width : 600px ) {
.submenu li {
	display: inline-block;
	font-size: 1.5vw;
	margin: 2% 1%;
}
#main .text {
	display: inline-block;
	margin: 2% 0;
	font-size: 1.6vw;
	width: 70%;
	text-align: center;
}
#main .blocks .two .cell {
	float: left;
}
#main .top_score img {
	width: 30%;
}
#main .blocks .three .cell {
	float: left;
	font-size: 1.2vw;
	border: 1px solid #999;
}
#main .blocks .three .cell img {
	margin-bottom: 0;
}
.br-pc {
	display: inline-block;
	}
.br-sp {
	display: none;
}
.alert {
	font-size: 1vw;
	text-align: right;
	margin: 0 0;
}
#main .chart img {
	width: 50%;
	margin-top: 5%;
}
}
@media only screen and (max-width : 599px ) {
.submenu li {
	display: inline-block;
	font-size: 2.5vw;
	margin: 2% 1%;
}
#main .text {
	display: inline-block;
	font-size: 3.5vw;
	text-align: left;
	width: 90%;
}
#main .blocks .two .cell {
	width: 100%;
}
#main .top_score img {
	width: 60%;
}
#main .blocks .three {
	width: 80%;
}
#main .blocks .three .cell {
	width: 100%;
	margin-bottom: 20px;
	font-size: 4vw;
	border: 1px solid #999;
}
#main .blocks_outline .blocks .two {
	width: 80%;
}
#main .blocks_outline .blocks .two .cell {
	width: 100%;
}
#main .blocks_outline .blocks .three_x {
	width: 80%;
}
#main .blocks_outline .blocks .three_x .cell {
	width: 100%;
}
#main .blocks_outline .blocks .three_x .cell_x {
	width: 10%;
}
#main .subtitle_text {
	font-weight: bold;
	font-size: 4vw;
}
#main .blocks .three .cell img {
	margin-bottom: 0;
}
.br-pc {
	display: none;
}
.br-sp {
	display: block;
}
.alert {
	font-size: 2vw;
	text-align: right;
	margin: 0 0;
}
#main .chart img {
	width: 80%;
	margin-top: 5%;
}
}