@charset "utf-8";


/*
 * mainview
 */

/* @smartphone */
@media screen and (max-width: 767px) {
#mainview {
	position: relative;
}
	/* image */
	#mainview figure {
		position: relative;
		display: block;
		padding-top: 47.2%;
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
	}
	.page01 #mainview figure { background-image: url(../img/sp/01/mainview_img.jpg); }
	.page02 #mainview figure { background-image: url(../img/sp/02/mainview_img.jpg); }
	.page03 #mainview figure { background-image: url(../img/sp/03/mainview_img.jpg); }
	.page04 #mainview figure { background-image: url(../img/sp/04/mainview_img.jpg); }
	.page05 #mainview figure { background-image: url(../img/sp/05/mainview_img.jpg); }
	/* article */
	#mainview .article {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		padding-top: 7.467%;
	}
		#mainview .article p {
			padding-top: 6.933%;
			font-size: 12px;
			font-size: 3.2vw;
			color: #fff;
			line-height: 1.1;
			text-align: center;
		}
		#mainview .article h2 {
			padding-top: 2.5%;
			font-size: 22px;
			font-size: 5.867vw;
			color: #fff;
			line-height: 1.44;
			text-align: center;
		}
}

/* @monitor */
@media screen and (min-width: 768px) {
#mainview {
	position: relative;
	background-color: #f3f3f3;
}
#mainview .sp {
	display: none;
}
	/* image */
	#mainview figure {
		display: block;
		padding-top: 37.847%;
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
	}
	.page01 #mainview figure { background-image: url(../img/01/mainview_img.jpg); }
	.page02 #mainview figure { background-image: url(../img/02/mainview_img.jpg); }
	.page03 #mainview figure { background-image: url(../img/03/mainview_img.jpg); }
	.page04 #mainview figure { background-image: url(../img/04/mainview_img.jpg); }
	.page05 #mainview figure { background-image: url(../img/05/mainview_img.jpg); }
	/* article */
	#mainview .article {
		display: block;
		max-width: 1440px;
		margin: 0 auto;
	}
		#mainview .article p {
			padding-top: 6.818%;
			font-size: 18px;
			/*color: #fff;*/
			line-height: 1.1;
			text-align: center;
		}
		#mainview .article h2 {
			padding-top: 20px;
			padding-bottom: 6.818%;
			font-size: 30px;
			/*color: #fff;*/
			line-height: 1.1;
			text-align: center;
		}
}





/*
 * contents
 */

/* @smartphone */
@media screen and (max-width: 767px) {
#contents {
	margin-top: 2%;
}
	/* article */
	#contents .article {

	}
		/* item */
		#contents .item {
			
		}
			#contents .item figure {
				padding-top: 50%;
				background-repeat: no-repeat;
				background-position: center;
				background-size: cover;
			}
			.page01 #contents .item.contents1 figure { background-image: url(../img/sp/01/contents_img01.jpg); }
			.page01 #contents .item.contents2 figure { background-image: url(../img/sp/01/contents_img02.jpg); }
			.page01 #contents .item.contents3 figure { background-image: url(../img/sp/01/contents_img03.jpg); }
			.page01 #contents .item.contents4 figure { background-image: url(../img/sp/01/contents_img04.jpg); }
			.page02 #contents .item.contents1 figure { background-image: url(../img/sp/02/contents_img01.jpg); }
			.page02 #contents .item.contents2 figure { background-image: url(../img/sp/02/contents_img02.jpg); }
			.page02 #contents .item.contents3 figure { background-image: url(../img/sp/02/contents_img03.jpg); }
			.page02 #contents .item.contents4 figure { background-image: url(../img/sp/02/contents_img04.jpg); }
			.page03 #contents .item.contents1 figure { background-image: url(../img/sp/03/contents_img01.jpg); }
			.page03 #contents .item.contents2 figure { background-image: url(../img/sp/03/contents_img02.jpg); }
			.page03 #contents .item.contents3 figure { background-image: url(../img/sp/03/contents_img03.jpg); }
			.page03 #contents .item.contents4 figure { background-image: url(../img/sp/03/contents_img04.jpg); }
			.page04 #contents .item.contents1 figure { background-image: url(../img/sp/04/contents_img01.jpg); }
			.page04 #contents .item.contents2 figure { background-image: url(../img/sp/04/contents_img02.jpg); }
			.page04 #contents .item.contents3 figure { background-image: url(../img/sp/04/contents_img03.jpg); }
			.page04 #contents .item.contents4 figure { background-image: url(../img/sp/04/contents_img04.jpg); }
			.page05 #contents .item.contents1 figure { background-image: url(../img/sp/05/contents_img01.jpg); }
			.page05 #contents .item.contents2 figure { background-image: url(../img/sp/05/contents_img02.jpg); }
			.page05 #contents .item.contents3 figure { background-image: url(../img/sp/05/contents_img03.jpg); }
			.page05 #contents .item.contents4 figure { background-image: url(../img/sp/05/contents_img04.jpg); }
			#contents .item .content {
				padding: 0 10%;
				padding-top: 6%;
				padding-bottom: 14%;
			}
				#contents .item .content h3 {
					font-size: 21px;
					font-size: 5.6vw;
					color: #2d2d2d;
					text-align: left;
				}
				#contents .item .content p {
					padding-top: 4.4%;
					font-size: 13px;
					font-size: 3.467vw;
					color: #2d2d2d;
					line-height: 1.538;
					text-align: justify;
				}
}

/* @monitor */
@media screen and (min-width: 768px) {
#contents {
	/*background-color: #f3f3f3;*/
}
#contents .sp {
	display: none;
}
	/* article */
	#contents .article {
		/*max-width: 1440px;*/
		/*margin: 0 auto;*/
	}
		/* item */
		#contents .item {
			clear: both;
			background-color: #fff;
		}
			#contents .item figure {
				width: 50%;
				padding-top: 33.333%;
				background-repeat: no-repeat;
				background-position: center;
				background-size: cover;
				float: left;
			}
			#contents .item:nth-child(even) figure {
				float: right;
			}
			.page01 #contents .item.contents1 figure { background-image: url(../img/01/contents_img01.jpg); }
			.page01 #contents .item.contents2 figure { background-image: url(../img/01/contents_img02.jpg); }
			.page01 #contents .item.contents3 figure { background-image: url(../img/01/contents_img03.jpg); }
			.page01 #contents .item.contents4 figure { background-image: url(../img/01/contents_img04.jpg); }
			.page02 #contents .item.contents1 figure { background-image: url(../img/02/contents_img01.jpg); }
			.page02 #contents .item.contents2 figure { background-image: url(../img/02/contents_img02.jpg); }
			.page02 #contents .item.contents3 figure { background-image: url(../img/02/contents_img03.jpg); }
			.page02 #contents .item.contents4 figure { background-image: url(../img/02/contents_img04.jpg); }
			.page03 #contents .item.contents1 figure { background-image: url(../img/03/contents_img01.jpg); }
			.page03 #contents .item.contents2 figure { background-image: url(../img/03/contents_img02.jpg); }
			.page03 #contents .item.contents3 figure { background-image: url(../img/03/contents_img03.jpg); }
			.page03 #contents .item.contents4 figure { background-image: url(../img/03/contents_img04.jpg); }
			.page04 #contents .item.contents1 figure { background-image: url(../img/04/contents_img01.jpg); }
			.page04 #contents .item.contents2 figure { background-image: url(../img/04/contents_img02.jpg); }
			.page04 #contents .item.contents3 figure { background-image: url(../img/04/contents_img03.jpg); }
			.page04 #contents .item.contents4 figure { background-image: url(../img/04/contents_img04.jpg); }
			.page05 #contents .item.contents1 figure { background-image: url(../img/05/contents_img01.jpg); }
			.page05 #contents .item.contents2 figure { background-image: url(../img/05/contents_img02.jpg); }
			.page05 #contents .item.contents3 figure { background-image: url(../img/05/contents_img03.jpg); }
			.page05 #contents .item.contents4 figure { background-image: url(../img/05/contents_img04.jpg); }
			#contents .item .content {
				width: 50%;
				padding: 0 8.611%;
				float: right;
			}
			#contents .item:nth-child(even) .content {
				float: left;
			}
				#contents .item .content h3 {
					font-size: 23px;
					color: #2d2d2d;
					text-align: left;
				}
				#contents .item .content p {
					padding-top: 15px;
					font-size: 13px;
					color: #2d2d2d;
					line-height: 2;
					text-align: justify;
				}
}





/*
 * reason
 */

/* @smartphone */
@media screen and (max-width: 767px) {
#reason {
	background-color: #ececec;
}
	/* header */
	#reason .header {
		padding: 11.733% 0;
	}
		#reason h2 {
			font-size: 23px;
			font-size: 6.133vw;
			color: #373737;
			line-height: 1.1;
			text-align: center;
		}
	/* article */
	#reason .article {

	}
		/* item */
		#reason .item {
			position: relative;
			margin-top: 1.333%;
			padding-top: 40%;
			background-color: #000;
		}
		#reason .item:first-child {
			margin-top: 0;
		}
			#reason .item figure {
				position: absolute;
				left: 0;
				top: 0;
				right: 0;
				bottom: 0;
				background-repeat: no-repeat;
				background-position: center;
				background-size: cover;
				opacity: 0.5;
			}
			#reason .item.reason1 figure { background-image: url(../../img/sp/reason_img01.jpg); }
			#reason .item.reason2 figure { background-image: url(../../img/sp/reason_img02.jpg); }
			#reason .item.reason3 figure { background-image: url(../../img/sp/reason_img03.jpg); }
			#reason .item.reason4 figure { background-image: url(../../img/sp/reason_img04.jpg); }
			#reason .item.reason5 figure { background-image: url(../../img/sp/reason_img05.jpg); }
			#reason .item .content {
				position: absolute;
				left: 0;
				top: 0;
				right: 0;
				bottom: 0;
				padding-top: 8%;
				text-align: center;
			}
				#reason .item p {
					font-size: 12px;
					font-size: 3.2vw;
					color: #fff;
				}
				#reason .item h3 {
					margin-top: 1.6%;
					font-size: 22px;
					font-size: 5.867vw;
					color: #fff;
					line-height: 1.5;
				}
				#reason .item a {
					position: absolute;
					left: 0;
					top: 0;
					right: 0;
					bottom: 0;
					display: block;
				}
					#reason .item a span {
						display: none;
					}
}

/* @monitor */
@media screen and (min-width: 768px) {
#reason {
	clear: both;
	background-color: #f3f3f3;
}
	/* header */
	#reason .header {
		max-width: 1440px;
		margin: 0 auto;
	}
		#reason h2 {
			padding-top: 5%;
			padding-bottom: 5%;
			font-size: 33px;
			color: #373737;
			line-height: 1.1;
			letter-spacing: 0.1em;
			text-align: center;
		}
	/* article */
	#reason .article {
		max-width: 1440px;
		margin: 0 auto;
		padding-bottom: 5%;
	}
		/* item */
		#reason .item {
			width: 20%;
			margin-left: 2%;
			float: left;
		}
		#reason .item:first-child {
			margin-left: 7%;
		}
			#reason .item figure {
				width: 100%;
				padding-top: 66.667%;
				background-repeat: no-repeat;
				background-position: center;
				background-size: cover;
			}
			#reason .item.reason1 figure { background-image: url(../img/reason_img01.jpg); }
			#reason .item.reason2 figure { background-image: url(../img/reason_img02.jpg); }
			#reason .item.reason3 figure { background-image: url(../img/reason_img03.jpg); }
			#reason .item.reason4 figure { background-image: url(../img/reason_img04.jpg); }
			#reason .item.reason5 figure { background-image: url(../img/reason_img05.jpg); }
			#reason .item .content {
				width: 100%;
			}
				#reason .item p {
					margin-top: 17px;
					font-size: 12px;
					color: #2d2d2d;
				}
				#reason .item h3 {
					margin-top: 3px;
					font-size: 15px;
					color: #2d2d2d;
				}
					#reason .item h3 .sp {
						display: none;
					}
				#reason .item a {
					display: inline-block;
					margin-top: 14px;
					color: #373737;
					text-decoration: none;
				}
					#reason .item a span {
						border-bottom: 1px solid #000;
						font-size: 10px;
						line-height: 1.1;
					}
}