@charset "UTF-8";
/*
 intro.css（ファイル名変更可）
 本サイト各ページ用CSS
*/

.d-box-body{
	background-image: url("../images/intro/bg.jpg");
	background-repeat: repeat;
	background-position: center top;
	background-size: contain;
	width: 100%;
	margin: 1.3% auto 15%;
	padding: 4% 0 10%;
	min-height: 500px;
	-webkit-transform: skewY(-10deg);
	-moz-transform: skewY(-10deg);
	-o-transform: skewY(-10deg);
}

#intro.d-area {
	margin: 30px auto 60px;
}


.intro-inner .d-box-body .intro-overview{
	color: #ffffff;
	-webkit-transform: skewY(10deg);
	-moz-transform: skewY(10deg);
	-o-transform: skewY(10deg);
}

.intro-inner h2.d-box-title{
	margin-left: auto;
	margin-right: 2%;
	width: 100%;
	max-width: 386px;
	height: auto;
	max-height: 112px;
	padding-top: calc(112 / 1000 * 100%);
	background-image: url("../images/intro/title.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: right;
	overflow: hidden;
	font-size: 0;
	position: relative;
	z-index: 100;
}


#intro-top{
	margin: 0 auto;
	width: 100%;
	max-width: 834px;
	height: auto;
	max-height: 1624px;
	padding-top: calc(1624 / 1000 * 100%);
	background-image: url("../images/intro/intro-top.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center top;
	overflow: hidden;
	font-size: 0;
}

#intro-2nd{
	margin: 5% auto;
	width: 100%;
	max-width: 834px;
	height: auto;
	max-height: 706px;
	padding-top: calc(706 / 1000 * 100%);
	background-image: url("../images/intro/intro-2nd.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center top;
	overflow: hidden;
	font-size: 0;
}

#intro-3rd{
	margin: 0 auto;
	width: 100%;
	max-width: 582px;
	height: auto;
	max-height: 223px;
	padding-top: calc(223 / 1000 * 100%);
	background-image: url("../images/intro/intro-3rd.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center top;
	overflow: hidden;
	font-size: 0;
}


/* ---------------------------------
 SP（〜600px）
--------------------------------- */
@media only screen and (max-width: 600px) {
#intro.d-area {
	margin: 0 auto 60px;
}

#intro-top{
	padding-top: calc(1614 / 600 * 65%);
	}
	
#intro-2nd{
	padding-top: calc(706 / 600 * 65%);
	}

#intro-3rd{
	padding-top: calc(223 / 600 * 65%);
	}
	
}

/* ------------------------------------------------------------------
 SP 〜 tablet（〜992px）
------------------------------------------------------------------ */
@media screen and (max-width: 992px) {
}

/* ---------------------------------
 PC（993px〜）
--------------------------------- */
@media screen and (min-width: 993px) {
}