@charset "UTF-8";

/* ▼810px以上の場合に適用
--------------------------------------------------------------------- */
@media only screen and (min-width: 811px) {

	#Sp_header {
		display: none;
	}

	#Sp_footer {
		display: none;
	}

}

/* ▼810px以下の場合に適用（ipad以下）
---------------------------------------------------------------------- */
@media only screen and (max-width: 810px) {

	#Wrapper {
		display: none;
	}

	.Cmn_Content {
		background: #fff;
		padding:20px 10px;
	}

	#Top-Wrapper {
		display: none;
	}

	#Navi {
		display: none;
	}

	#Sp_header {
		background:#82D7FF;
		padding:0 10px 10px;
	}

	/*---ナビ---*/
	nav{
		background: #117aae;
		background: -moz-linear-gradient( #117aae 0%, #1790ce 100%);
		background: -webkit-gradient(linear, left top, left bottom, from(#117aae), to(#1790ce));
		background: -webkit-linear-gradient( #117aae 0%, #1790ce 100%);
		background: -o-linear-gradient( #117aae 0%, #1790ce 100%);
		background: linear-gradient( #117aae 0%, #1790ce 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=#117aae, endColorstr=#1790ce,GradientType=0 );
	}

	nav ul{
		width:100%;
		display:table;
		margin:0 auto;
		border-right:solid 1px #fff;
		border-top:solid 1px #fff;
	}

	nav li{
		display:table-cell;
		float:left;
		width:50%;
		height:36px;
		line-height:1;
		vertical-align:middle;
		border-left:solid 1px #fff;
		border-bottom:solid 1px #fff;
		padding-top:2px;
	}

	nav li a{
		width:100%;
		height:36px;
		display:inline-block;
		font-size:14px;
		color:#fff;
		text-align:center;
		text-decoration:none;
		border-left:solid 1px #fff;
		padding:10px 0 0 0;
		border:none;
		transition:.3s;
	}

	nav li a:hover{
		color:#043262;
	}

	nav li a.last{border:none;}

	/* --------------------------------------------------------
		トップページ
	-------------------------------------------------------- */
	.Top_Content {
		background: #fff;
		padding:20px 10px;
	}

	/* --------------------------------------------------------
		Footer
	-------------------------------------------------------- */
	#Footer-Wrap {
		display: none;
	}

	#Sp_footer {
		background:#82D7FF;
		padding:10px 10px 20px;
		margin:0;
		/*height:170px;*/
	}


}

/* ▼428px以上の場合に適用
--------------------------------------------------------------------- */
@media only screen and (min-width: 429px) {

	.Sp_Cont {
		display: none;
	}

}

/* ▼428px以下の場合に適用（ipad以下）
---------------------------------------------------------------------- */
@media only screen and (max-width: 428px) {

	.Sp_None {
		display: none;
	}

	/* --------------------------------------------------------
		トップページ
	-------------------------------------------------------- */
	/*---左右コンテンツ---*/
	.Top-L-Cont {
		width: 100%;
		margin-bottom:20px;
	}

	.Top-R-Cont {
		width: 100%;
	}

	/* --------------------------------------------------------
		共通
	-------------------------------------------------------- */
	h2 {
		clear: both;
		font-size:22px;
		color:#00CCCD;
		font-weight:bold;
		line-height:1em;
	}

	h3 {
		clear: both;
		font-size:16px;
		color:#00CCCD;
		font-weight:bold;
		border:1px solid #ccc;
		padding:6px 0px 6px 10px;
	}

	/*---左右コンテンツ---*/
	.L-Cont {
		width: 100%;
		margin-bottom:20px;
	}

	.R-Cont {
		width: 100%;
	}

	/* !Margin ------------------------------------------------------------------ */
	.mt20 { margin-top:20px !important;}
	.mt40 { margin-top:20px !important;}
	.mt60 { margin-top:30px !important;}
	.mt80 { margin-top:30px !important;}

	/* !Width ------------------------------------------------------------------- */
	.w70per { width: 100% !important;}

}