@charset "UTF-8";
/*------------------------------------*/
/* バナー、パンフレット等の画像リスト       */
/* パンフレット基準サイズ：w240 h340      */
/* スクエアバナー基準サイズ：w336 h280     */
/*------------------------------------*/

.boxList1 ul {
	display:-webkit-flex;
	display:flex;
	flex-wrap:wrap;
	-webkit-flex-wrap:wrap;
	justify-content:space-between;
	-webkit-justify-content:space-between;
	align-items:flex-start;
	-webkit-align-items:flex-start;
}

.boxList1 ul li{
	margin-bottom: 2em;
}

/*--------------------------------*/
.boxList2 ul {
	display:-webkit-flex;
	display:flex;
	flex-wrap:wrap;
	-webkit-flex-wrap:wrap;
	justify-content:space-around;
	-webkit-justify-content:space-around;
	align-items:flex-start;
	-webkit-align-items:flex-start;
}

.boxList2 ul li{
	margin-bottom: 2em;
}

.boxList2 ul li a {
	color: #333;
	text-decoration: none;
}

.boxList2 ul li a img{
	display: block;
	margin-bottom:5px;
}

.boxList2 ul li a span.caption{
	display: inline-block;
	font-size: 80%;
	line-height: 1.4!important;
}

/*---------------------------------*/
.boxList3 ul {
	display:-webkit-flex;
	display:flex;
	flex-wrap:wrap;
	-webkit-flex-wrap:wrap;
	justify-content:flex-start;
	-webkit-justify-content: flex-start;
	align-items: stretch;
	-webkit-align-items: stretch;
}

.boxList3 ul li{
	margin-bottom: 2em;
}

.boxList3 ul li a {
	color: #333;
	text-decoration: none;
}

.boxList3 ul li a img{
	display: block;
	margin-bottom:5px;
}

.boxList3 ul li a span.caption{
	display: inline-block;
	font-size: 80%;
	line-height: 1.4!important;
}

@media screen and (max-width: 767px){

.boxList1 ul {
	display:-webkit-flex;
	display:flex;
	flex-wrap:wrap;
	-webkit-flex-wrap:wrap;
	justify-content:space-between;
	-webkit-justify-content:space-between;
	align-items:flex-start;
	-webkit-align-items:flex-start;
}

.boxList1 ul li{
	width:48%;
	margin-bottom: 1.5em;
}
}

/*------------------------------------*/
/* バナー、PC3 SP2              */
/*------------------------------------*/

.boxList1 ul.img3x2 li{
	width: 290px;
	margin-bottom: 2em;
}

@media screen and (max-width: 767px){
.boxList1 ul.img3x2 li{
	width: 48%;
	margin-bottom: 1.5em;
}
}
/*------------------------------------*/
/* パンフレット、PC4 SP2              */
/*------------------------------------*/

.boxList1 ul.img4x2 li{
	width: 220px;
	margin-bottom: 2em;
}

.boxList1 ul.img4x2 li a {
	color: #333;
	text-decoration: none;
}

.boxList1 ul.img4x2 li a img{
	display: block;
	width: 100%;
	margin-bottom:5px;
}


@media screen and (max-width: 767px){

.boxList1 ul.img4x2 li{
	width:48%;
	margin-bottom: 1.5em;
}

.boxList1 ul.img4x2 li a img{
	width: 100%;
	max-width: 240px;
}

}

/*------------------------------------*/
/* パンフレット、PC4 SP4              */
/*------------------------------------*/

.boxList1 ul.img4x4 li{
	width: 240px;
	margin-bottom: 2em;
}

.boxList1 ul.img4x4 li a {
	color: #333;
	text-decoration: none;
}

.boxList1 ul.img4x4 li a img{
	display: block;
	width: 100%;
	margin-bottom:5px;
}


@media screen and (max-width: 767px){

.boxList1 ul.img4x4 li{
	width:24%;
	margin-bottom: .5em;
}

.boxList1 ul.img4x4 li a img{
	width: 100%;
	max-width: 240px;
}

}


/*------------------------------------*/
/* パンフレット、PC6 SP3              */
/*------------------------------------*/

.boxList1 ul.img6x3 li{
	width: 15%;
	max-width: 240px;
	margin-right: 5px;
	margin-bottom: 2em;
}

.boxList1 ul.img6x3 li:last-child{
	margin-right: 0;
}

.boxList1 ul.img6x3 li a {
	color: #333;
	text-decoration: none;
}

.boxList1 ul.img6x3 li a img{
	display: block;
	width: 100%;
	margin-bottom:5px;
}


@media screen and (max-width: 767px){


.boxList1 ul.img6x3 li{
	width:32%;
	margin-right: 0;
	margin-bottom: 1.5em;
}

.boxList1 ul.img6x3 li a img{
	width: 100%;
	max-width: 240px;
}

}


/*------------------------------------*/
/* キャプション                         */
/*------------------------------------*/
.boxList1 ul.img4x2 li a span.caption1,
.boxList1 ul.img4x4 li a span.caption1,
.boxList1 ul.img3x2 li a span.caption1{
	display: block;
	font-size: 95%;
	line-height: 1.4!important;
}

.boxList1 ul.img4x2 li a span.caption2,
.boxList1 ul.img4x4 li a span.caption2,
.boxList1 ul.img3x2 li a span.caption2{
	display: block;
	font-size: 80%;
	line-height: 1.4!important;
}

@media screen and (max-width: 767px){
.boxList1 ul.img4x4 li a span.caption1{
	display: none;
}

.boxList1 ul.img4x4 li a span.caption2{
	display: none;
}

}

/*------------------------------------*/
/* パンフレット羅列型（w240）、PC4 SP2              */
/*------------------------------------*/

.boxList3 ul.img4x2 li{
	width: 240px;
	margin-right: 13px;
	margin-bottom: 2em;
}

.boxList3 ul.img4x2 li:nth-child(4n) {
	margin-right: 0;
}

.boxList3 ul.img4x2 li a {
	color: #333;
	text-decoration: none;
}

.boxList3 ul.img4x2 li a img{
	display: block;
	width: 100%;
	margin-bottom:5px;
}


@media screen and (max-width: 767px){

.boxList3 ul.img4x2 li{
	width:48%;
	margin-right: 4%;
	margin-bottom: 1.5em;
}

.boxList3 ul.img4x2 li:nth-child(even) {
	margin-right: 0;
}

.boxList3 ul.img4x2 li a img{
	width: 100%;
	max-width: 240px;
}

}

/*------------------------------------*/
/* パンフレット羅列型、PC4 SP4              */
/*------------------------------------*/

.boxList3 ul.img4x4 li{
	width: 180px;
	margin-right: 13px;
	margin-bottom: 2em;
}

.boxList3 ul.img4x4 li:nth-child(4n) {
	margin-right: 0;
}

.boxList3 ul.img4x4 li a {
	color: #333;
	text-decoration: none;
}

.boxList3 ul.img4x4 li a img{
	display: block;
	width: 100%;
	margin-bottom:5px;
}


@media screen and (max-width: 767px){

.boxList3 ul.img4x4 li{
	width:24%;
	margin-right: 1%;
	margin-bottom: .5em;
}

.boxList3 ul.img4x4 li a img{
	width: 100%;
	max-width: 240px;
}

}

/*------------------------------------*/
/* パンフレット羅列型、PC6 SP3              */
/*------------------------------------*/

.boxList3 ul.img6x3 li{
	width: 160px;
	margin-right: 8px;
	margin-bottom: 2em;
}

.boxList3 ul.img6x3 li:nth-child(6n){
	margin-right: 0;
}

.boxList3 ul.img6x3 li a {
	color: #333;
	text-decoration: none;
}

.boxList3 ul.img6x3 li a img{
	display: block;
	width: 100%;
	margin-bottom:5px;
}


@media screen and (max-width: 767px){


.boxList3 ul.img6x3 li{
	width:32%;
	margin-right: 1%;
	margin-bottom: 1em;
}

.boxList3 ul.img6x3 li:nth-child(3n){
	margin-right: 0;
}

.boxList3 ul.img6x3 li a img{
	width: 100%;
	max-width: 240px;
}

}


/*------------------------------------*/
/* パンフレット羅列型キャプション          */
/*------------------------------------*/
.boxList3 ul.img4x2 li a span.caption1,
.boxList3 ul.img4x4 li a span.caption1{
	display: block;
	font-size: 95%;
	line-height: 1.4!important;
}

.boxList3 ul.img4x2 li a span.caption2,
.boxList3 ul.img4x4 li a span.caption2{
	display: block;
	font-size: 80%;
	line-height: 1.4!important;
}

@media screen and (max-width: 767px){
.boxList3 ul.img4x4 li a span.caption1{
	display: none;
}

.boxList3 ul.img4x4 li a span.caption2{
	display: none;
}

}

/*----------------------------------------*/
/* スクエアバナー 2*1　画像w336px h280       */
/*---------------------------------------*/

.boxList2 ul.img-sq2x1 li{
	width: 336px;
	margin-bottom: 2em;
}

.boxList2 ul.img-sq2x1 li a {
	color: #333;
	text-decoration: none;
}

.boxList2 ul.img-sq2x1 li a img{
	display: block;
	width: 100%;
	margin-bottom:5px;
}

@media screen and (max-width: 767px){
	.boxList2 ul.img-sq2x1 li{
		width: 100%;
		margin-bottom: 2em;
	}
}

/*----------------------------------------*/
/* スクエアバナー 3*1　画像w336px h280       */
/*---------------------------------------*/

.boxList2 ul.img-sq3x1 li{
	width: 300px;
	margin-bottom: 2em;
}

.boxList2 ul.img-sq3x1 li a {
	color: #333;
	text-decoration: none;
}

.boxList2 ul.img-sq3x1 li a img{
	display: block;
	width: 100%;
	margin-bottom:5px;
}


@media screen and (max-width: 767px){
	.boxList2 ul.img-sq3x1 li{
		width: 100%;
		margin-bottom: 2em;
	}
}


/*----------------------------------------*/
/* スクエアバナー 3*2　画像w336px h280       */
/*---------------------------------------*/

.boxList2 ul.img-sq3x2 li{
	width: 300px;
	margin-bottom: 2em;
}

.boxList2 ul.img-sq3x2 li a {
	color: #333;
	text-decoration: none;
}

.boxList2 ul.img-sq3x2 li a img{
	display: block;
	width: 100%;
	margin-bottom:5px;
}

@media screen and (max-width: 767px){
	.boxList2 ul.img-sq3x2 li{
		width: 45%;
		margin-bottom: 2em;
	}
	
	.boxList2 ul.img-sq3x2 li:nth-child(n+3) {
		display: none;
	}
}

/*----------------------------------------*/
/* スクエアバナー 3*3　画像w336px h280       */
/*---------------------------------------*/

.boxList1 ul.img-sq3x3 li{
	width: 300px;
	margin-bottom: 2em;
}

.boxList1 ul.img-sq3x3 li a {
	color: #333;
	text-decoration: none;
}

.boxList1 ul.img-sq3x3 li a img{
	display: block;
	width: 100%;
	margin-bottom:5px;
}

@media screen and (max-width: 767px){

	.boxList1 ul.img-sq3x3 li{
		width: 45%;
		margin-bottom: 2em;
	}

	.boxList1 ul.img-sq3x3 li:nth-child(3n+1){
		width: 100%;
		margin-bottom: 2em;
	}
}


/*------------------------------------*/
/* スクエアバナーキャプション          */
/*------------------------------------*/
.img-sq2x1 li a span.caption1,
.img-sq3x1 li a span.caption1,
.img-sq3x2 li a span.caption1,
.img-sq3x3 li a span.caption1{
	display: block;
	font-size: 95%;
	line-height: 1.4!important;
}

.img-sq2x1 li a span.caption2,
.img-sq3x1 li a span.caption2,
.img-sq3x2 li a span.caption2,
.img-sq3x3 li a span.caption2{
	display: block;
	font-size: 80%;
	line-height: 1.4!important;
}


/*------------------------------------*/
/* パンフレット紹介型　画像w240px         */
/*------------------------------------*/

.imgBox,
.imgBox > a{
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	align-items: stretch;
	-webkit-align-items: stretch;

	margin-bottom: 30px;
}

.imgBox.imgLeft.imgMiddle .imgArea,
.imgBox.imgLeft.imgMiddle a .imgArea{
	width: 240px;
}

.imgBox.imgLeft.imgMiddle .txtArea,
.imgBox.imgLeft.imgMiddle a .txtArea{
	width: 640px;
}

.imgBox.imgRight.imgMiddle .imgArea,
.imgBox.imgRight.imgMiddle a .imgArea{
	-webkit-order: 2;
	order: 2;
	width: 240px;
}

.imgBox.imgRight.imgMiddle .txtArea,
.imgBox.imgRight.imgMiddle a .txtArea{
	-webkit-order: 1;
	order: 1;
	width: 640px;
}

.imgBox.imgLeft.imgSmall .imgArea,
.imgBox.imgLeft.imgSmall a .imgArea{
	width: 240px;
}

.imgBox.imgLeft.imgSmall .txtArea,
.imgBox.imgLeft.imgSmall a .txtArea{
	width: 640px;
}

.imgBox.imgRight.imgSmall .imgArea,
.imgBox.imgRight.imgSmall a .imgArea{
	-webkit-order: 2;
	order: 2;
	width: 240px;
}

.imgBox.imgRight.imgSmall .txtArea,
.imgBox.imgRight.imgSmall a .txtArea{
	-webkit-order: 1;
	order: 1;
	width:640px;
}

.imgBox .imgArea img,
.imgBox a .imgArea img { width: 100%; }

.imgBox.imgLeft.imgMiddle a,
.imgBox.imgRight.imgMiddle a,
.imgBox.imgLeft.imgSmall a,
.imgBox.imgRight.imgSmall a {
	text-decoration: none;
}

@media screen and (max-width: 767px){

.imgBox.imgLeft.imgMiddle .imgArea,
.imgBox.imgLeft.imgMiddle a .imgArea{
	width: 32%;
}

.imgBox.imgLeft.imgMiddle a .txtArea,
.imgBox.imgLeft.imgMiddle .txtArea{
	width: 65%;
}

.imgBox.imgRight.imgMiddle .imgArea,
.imgBox.imgRight.imgMiddle a .imgArea{
	-webkit-order: 2;
	order: 2;
	width: 32%;
}

.imgBox.imgRight.imgMiddle .txtArea,
.imgBox.imgRight.imgMiddle a .txtArea{
	-webkit-order: 1;
	order: 1;
	width: 65%;
}

.imgBox.imgLeft.imgSmall .imgArea,
.imgBox.imgLeft.imgSmall a .imgArea{
	width: 18%;
}

.imgBox.imgLeft.imgSmall .txtArea,
.imgBox.imgLeft.imgSmall a .txtArea{
	width: 79%;
}

.imgBox.imgRight.imgSmall .imgArea,
.imgBox.imgRight.imgSmall a .imgArea{
	-webkit-order: 2;
	order: 2;
	width: 18%;
}

.imgBox.imgRight.imgSmall .txtArea,
.imgBox.imgRight.imgSmall a .txtArea{
	-webkit-order: 1;
	order: 1;
	width: 79%;
}

}
