@charset "utf-8";
/*
	/* ==========================================================
  story / ストーリー&キーワード
========================================================== */
.page {
	padding: 46px 40px 20px;
}
.about-main {
	position: absolute;
	width: 920px;
	height: 710px;
}
h3 {
    background: url(../images/story/h3.png) no-repeat center top;
    width: 920px;
    height: 22px;
    margin: 0 auto 20px;
    padding-top: 40px;
    text-indent: 100%;
    overflow: hidden;
    white-space: nowrap;
}
@media screen and (max-width: 670px){
	h3 {
    display: none;
}
}
.introduction {
	position: relative;
	z-index: 2;
	margin-bottom: 50px;
	padding-top: 630px;
	text-align: center;
	line-height: 1.75;
}
.introduction p {
	font-size: 16px;
	margin-bottom: 32px;
}
.keyword-info dl {
	overflow: hidden;
}
.keyword-info dd {
	margin: 20px 40px 0 0;
}
.keyword-info dt.bg_pink {
	background: url(../images/story/bg_pink.jpg) no-repeat left top;
	height: 200px;
	padding: 23px 40px 30px 30px;
	float: left;
}
.keyword-info dt.bg_purple {
	background: url(../images/story/bg_purple.jpg) no-repeat left top;
	height: 200px;
	padding: 23px 45px 30px 18px;
	float: left;
	margin-left: 10px;
}
@media screen and (max-width: 670px) {
	.page {
		padding: 10px 10px 50px;
	}
	.about-main {
		position: relative;
		width: auto;
		height: auto;
	}
	.about-main {
		position: relative;
		width: auto;
		height: auto;
	}
	.about-main img {
		width: 100%;
		height: auto;
	}
	.introduction {
		padding-top: 0;
		margin-top: -30px;
	}
	.introduction p {
		font-size: 14px;
	}
	.keyword-info dt.bg_pink,
	.keyword-info dt.bg_purple {
		background: none;
		float: none;
		height: inherit;
		margin: 0;
		padding: 0;
		text-align: center;
	}
	.keyword-info dt img {
		width: 100%;
		height: auto;
	}
	.keyword-info dd {
    margin: 10px 0 20px;
	}
}