@charset "utf-8";
/*------------------------------------------------------------
	書式設定
------------------------------------------------------------*/
/* テキストの位置 */
.taLeft { text-align: left !important; }
.taCenter { text-align: center !important; }
.taRight { text-align: right !important; }

/* フォントの大きさ（プラス） */
.fsP1 { font-size: 1.08em !important; }
.fsP2 { font-size: 1.16em !important; }
.fsP3 { font-size: 1.24em !important; }
.fsP4 { font-size: 1.32em !important; }
.fsP5 { font-size: 1.4em !important; }

/* フォントの大きさ（マイナス） */
.fsM1 { font-size: 0.92em !important; }
.fsM2 { font-size: 0.84em !important; }
.fsM3 { font-size: 0.76em !important; }
.fsM4 { font-size: 0.68em !important; }
.fsM5 { font-size: 0.6em !important; }

/* フォントの太さ */
.fwNormal { font-weight: normal !important; }
.fwBold { font-weight: bold !important; }

/*------------------------------------------------------------
	微調整用クラス（※多用しないこと）
------------------------------------------------------------*/
.mt0 { margin-top: 0 !important; }
.mb0 { margin-bottom: 0 !important; }
.mb5 { margin-bottom: 5px !important; }
.mb10 { margin-bottom: 10px !important; }
.t_center{ text-align:center !important;}

/*------------------------------------------------------------
	汎用スタイル
------------------------------------------------------------*/
	* html .clearfix {
		zoom: 1;
	}

	*+html .clearfix {
		zoom: 1;
	}

.clearfix:after {
	height: 0;
	visibility: hidden;
	content: ".";
	display: block;
	clear: both;
}

/*------------------------------------------------------------
	リンク・インプットをタップ時のクラス
------------------------------------------------------------*/
a.tapCtrl, input.tapCtrl,
.tapCtrl a, .tapCtrl input {
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.tap {

}

.floatL {
	float: left !important;
}

.floatR {
	float: right !important;
}

img {
	vertical-align: top;
}

dl img,
li img {
	display: block;
	vertical-align: baseline;
}

/*------------------------------------------------------------
	pageTop
------------------------------------------------------------*/
.pageTop {
	text-align: right;
}

.pageTop a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
}

/*------------------------------------------------------------
	h2
------------------------------------------------------------*/
#conts h2 {
	margin-bottom: 5px;
}

#conts h2 .spImg {
	display: none;
}

/*------------------------------------------------------------
	comSection
------------------------------------------------------------*/
#conts .comSection {
	margin: 0 9px;
}

/*------------------------------------------------------------
	comMenuUl
------------------------------------------------------------*/
#conts .comMenuUl {
	margin: -20px -20px 61px 0;
	width: 650px;
	overflow: hidden;
	zoom: 1;
}

#conts .comMenuUl li {
	margin: 20px 20px 0 0;
	float: left;
	width: 110px;
}

#conts .comMenuUl li a {
	padding: 10px 10px 9px;
	color: #18b8ee;
	cursor: pointer;
	display: block;
	text-align: center;
	text-decoration: none;
	border: 1px solid #18B8EE;
}

#conts .comMenuUl li a span {
	display: inline-block;
	line-height: 1.1;
}

#conts .comMenuUl li a .bigSpan {
	padding-left: 12px;
	background: url(../img/icon01.gif) no-repeat left 4px;
}

#conts .comMenuUl li a .litSpan {
	padding-left: 10px;
	font-size: 10px;
	display: block;
}

#conts .comMenuUl li a:hover span {
	color: #6AD1F4;
}

#conts .comMenuUl li a:hover .bigSpan {
	opacity: 0.7;
	filter: alpha(opacity=70);
	background: url(../img/icon01.gif) no-repeat left 4px;
}

/*------------------------------------------------------------
	comImgBox
------------------------------------------------------------*/
#conts .comImgBox {
	margin: 0 0 39px 12px;
}

#conts .comImgBox01 {
	margin-bottom: 28px;
}

#conts .comImgBox .photoBox {
	width: 315px;
	float: right;
}

#conts .comImgBox .photoBox .litPhotoUl {
	margin: 17px -8px 0 0;
	width: 324px;
	overflow: hidden;
	zoom: 1;
}

#conts .comImgBox .photoBox li {
	margin-right: 8px;
	float: left;
}

#conts .comImgBox .textBox {
	margin-top: -2px;
	width: 293px;
	float: left;
}

#conts .comImgBox .textBox p {
	line-height: 1.8;
}

@media all and (min-width: 0) and (max-width: 640px)  {
	/*------------------------------------------------------------
		h2
	------------------------------------------------------------*/
	#conts h2 {
		margin-bottom: 0;
	}
	
	#conts h2 img {
		width: 100%;
	}
	
	#conts h2 .spImg {
		display: block;
	}
	
	#conts h2 .pcImg {
		display: none;
	}
	
	/*------------------------------------------------------------
		comSection
	------------------------------------------------------------*/
	#conts .comSection {
		margin: 0 8px;
	}
	
	/*------------------------------------------------------------
		comMenuUl
	------------------------------------------------------------*/
	#conts .comMenuUl {
		margin: 0 0 25px 0;
		width: auto;
	}
	
	#conts .comMenuUl li {
		margin: 10px 5px 0 0;
		width: 23%;
		font-size: 6px;
		height: 26px;
	}
	
	#conts .comMenuUl li a {
		padding: 5px;
		height: 14px;
	}
	
	#conts .comMenuUl li a .bigSpan {
		padding-left: 8px;
		background: url(../img/icon01.gif) no-repeat left 2px;
		background-size: 3px 4px;
	}
	
	#conts .comMenuUl li a .litSpan {
		font-size: 5px;
	}
	
	/*------------------------------------------------------------
		comImgBox
	------------------------------------------------------------*/
	#conts .comImgBox {
		margin: 0 0 20px;
	}
	
	#conts .comImgBox .photoBox {
		margin-bottom: 15px;
		width: auto;
		float: none;
	}
	
	#conts .comImgBox .photoBox img {
		width: 100%;
	}
	
	#conts .comImgBox .photoBox .litPhotoUl {
		margin: 10px 0 0;
		width: 100%;
	}
	
	#conts .comImgBox .photoBox .litPhotoUl li {
		margin-right: 2%;
		width: 32%;
	}
	
	#conts .comImgBox .photoBox .litPhotoUl li img {
		width: 100%;
	}
	
	#conts .comImgBox .photoBox .litPhotoUl li:last-child {
		margin-right: 0;
	}
	
	#conts .comImgBox .textBox {
		width: auto;
		float: none;
	}
	
	#conts .comImgBox .textBox p {
		font-size: 6px;
		line-height: 1.7;
	}
}


@media all and (min-width: 641px) and (max-width: 1024px) {
	/*------------------------------------------------------------
		h2
	------------------------------------------------------------*/
	#conts h2  img {
		width: 100%;
	}
	
	/*------------------------------------------------------------
		comMenuUl
	------------------------------------------------------------*/
	#conts .comMenuUl {
		margin: 0 0 30px 0;
		width: auto;
	}
	
	#conts .comMenuUl li {
		margin: 10px 10px 0 0;
		width: 18%;
		height: 52px;
	}
	
	#conts .comMenuUl li a {
		padding: 10px 2px 9px;
		height: 31px;
	}
	
	#conts .comImgBox .photoBox {
		width: 50%;
	}
	
	#conts .comImgBox .photoBox img {
		width: 100%;
	}
	
	#conts .comImgBox .photoBox .litPhotoUl {
		margin: 17px 0 0;
		width: auto;
	}
	
	#conts .comImgBox .photoBox li {
		margin-right: 2%;
		width: 32%;
	}
	
	#conts .comImgBox .photoBox li:last-child {
		margin-right: 0;
	}
	
	#conts .comImgBox .textBox {
		width: 48%;
	}
}