@charset "UTF-8";
/*
 intro.css
*/

body .d-main {
    width: 100%;
    background: #47515b;
}

body .intro-area{
	background: url(../images/intro/bg-top.jpg) no-repeat center top;
	background-size: contain;
	color: #ffffff;
	padding-top: calc(50 / 1000 * 100%);
	margin: 0 auto;
}



h2.d-box-title{
	width: 385px;
    height: 116px;
    background-image: url(../images/intro/title.png);
	background-repeat: no-repeat;
    background-size: contain;
	background-position: center;
	font-size: 0;
    margin: 0 auto 50px;
}


.intro-article-body{
	width: 90%;
    margin: 10% auto 0;
}


.intro-top-text {
	width: 100%;
	height: 0;
	margin-left: auto;
	margin-right: auto;
	padding-top: calc(391 / 773 * 100%);
	margin-bottom: calc(100 / 1000 * 100%);
	background-image: url(../images/intro/intro-text-pc.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	font-size: 0;
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
}

.intro-text-aria{
	width: 100%;
	background: url(../images/intro/bg-bottom.jpg) no-repeat center top #47515b;
	background-size: cover;
	color: #ffffff;
	font-size: 18px;
	padding-top: 5%;
	padding-bottom: 10%;
}

.intro-text-aria .intro-inner{
	width: 85%;
	margin: 0 auto;
}

.intro-text-aria p{
    margin: 0;
	padding: 0 0 5% 0;
    font-size: 1.8rem;
    line-height: 3;
}

.intro-text-aria p span{
    letter-spacing: -0.15em;
}
	
/* ---------------------------------
 SP（〜600px）
--------------------------------- */
@media only screen and (max-width: 600px) {

body .intro-area{
	background-size: 130%;
}


body h2.d-box-title {
	padding: 10% !important;
	width: 100%;
	height: auto;
    margin: 30px auto 50px;
}

.intro-article-body{
	width: 90%;
    margin: 10% auto 0;
}


.intro-text-aria{
	padding-top: 10%;
	background-size: 180%;
}

body .intro-top-text {
	width: 100%;
	height: 0;
	margin-left: auto;
	margin-right: auto;
	padding-top: calc(496 / 540 * 100%);
	background-image: url(../images/intro/intro-text-sp.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	font-size: 0;
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
}

.intro-text-aria .intro-inner{
	margin: 0 auto;
	width: 90%
	
}

.intro-text-aria .intro-inner p{
	font-size: 1.4rem;
    line-height: 2.2;
}


}

/* ------------------------------------------------------------------
 SP 〜 tablet（〜992px）
------------------------------------------------------------------ */
@media screen and (max-width: 992px) {
}

/* ---------------------------------
 PC（993px〜）
--------------------------------- */
@media screen and (min-width: 993px) {
}