@charset "UTF-8";

/* ===============================
	style
================================ */
em {
	color: #e6000d;
	font-weight: bold;
	font-style: normal;
}

.table {
	display: table;
	width: 100%;
}

.tableCell {
	display: table-cell;
	vertical-align: middle;
}

/* Youtube 動画 */
.youtube {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}

.youtube iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}


	article {
		background: url(../images/bg-main.png) repeat left top;
	}
	#top {
		font-weight: 500;
	}
	.btnDetail {
		display: block;
		width: 250px;
		padding: 4px 70px 4px 20px;
		border: solid 2px #e6000d;
		font-size: 1.4rem;
		line-height: 1.4;
		font-weight: 500;
		color: #e6000d;
		text-decoration: none;
		border-radius: 0.8em;
		background: url(../images/arrow-detail.png) no-repeat right 15px top 6px
	}
	.btnDetail:hover {
		opacity: 0.6;
	}

/* ===============================
	PC/Tab setting
================================ */
@media print , screen and (min-width: 481px) {
	.mts {
		margin-top: 40px;
	}
	.mtm {
		margin-top: 50px;
	}
	article {
		font-size: 1.6rem;
		line-height: 2;
	}
	#mainSlider {
		height: 550px;
	}
	#top {
		padding-top: 80px;
		padding-bottom: 80px;
		text-align: center;
	}
	.subTtl {
		background: #e6000d;
		color: #fff;
		padding-top: 2.2rem;
		padding-bottom: 2.2rem;
	}
	.subTtl h2 {
		padding-left: 170px;
		font-size: 3rem;
		line-height: 1.6;
		font-weight: 100;
		letter-spacing: -0.1rem;
		position: relative;
	}
	.subTtl h2 span {
		letter-spacing: -1rem;
	}
	.subTtl h2:AFTER {
		content: '';
		display: block;
		width: 130px;
		height: 130px;
		background: url(../images/hatena.png) no-repeat left center;
		background-size: 100% auto;
		position: absolute;
		bottom: 0;
		left: 0;
	}
	.sub .inBox {
		padding-top: 100px;
		padding-bottom: 100px;
		padding-left: 100px;
		padding-right: 100px;
	}
	.left {
		float: left;
	}
	.right {
		float: right;
	}
	.imgBox {
		margin-top: 4em;
	}
	.img320 .text {
		width: 440px;
		padding-right: 20px;
	}
	.img320 .fitImg {
		width: 320px;
	}
	.img290 .text {
		width: 470px;
		padding-left: 50px;
	}
	.img290 .fitImg {
		width: 290px;
	}
	.youtubeBox {
		width: 680px;
		margin: 80px auto 0;
	}
	.btnDetail {
		font-size: 1.4rem;
		line-height: 1.4;
		margin-top: 2em;
	}
	#sub01 .ttl {
		padding: 0.2em 0;
		background: #e6000d;
		color: #fff;
		text-align: center;
	}
	#sub01 .left {
		width: 50%;
		margin-top: 4px;
		padding-right: 2px;
	}
	#sub01 .right {
		width: 50%;
		margin-top: 4px;
		padding-left: 2px;
	}
	#sub03 h2 {
		text-indent: -0.5rem;
		letter-spacing: -0.1rem;
	}
	#sub03 .ttl {
		font-size: 1.2em;
		font-weight: bold;
		margin-top: 2em;
	}
	#sub04 .text {
		width: 380px;
	}
	#sub04 .outImg {
		position: relative;
	}
	#sub04 .outImg .fitImg {
		width: 380px;
		position: absolute;
		top: -30px;
		left: -40px;
	}
	#sub04 .outImg img {
		position: relative;
	}
	#sub04 .pcClearfix {
		margin-top: 100px;
	}
	#sub05 h3 {
		margin-top: 50px;
		margin-bottom: 50px;
		font-size: 2.4rem;
		line-height: 2;
		font-weight: 200;
		padding-left: 180px;
		border-bottom: solid 12px #f9dad8;
		position: relative;
	}
	#sub05 h3.hurdle1:AFTER {
		content: '';
		display: block;
		width: 110px;
		height: 42px;
		background: url(../images/hurdle1.png) no-repeat left bottom;
		position: absolute;
		bottom: 0;
		left: 45px;
	}
	#sub05 h3.hurdle2:AFTER {
		content: '';
		display: block;
		width: 110px;
		height: 42px;
		background: url(../images/hurdle2.png) no-repeat left bottom;
		position: absolute;
		bottom: 0;
		left: 45px;
	}
	#sub05 h3.hurdle3:AFTER {
		content: '';
		display: block;
		width: 110px;
		height: 42px;
		background: url(../images/hurdle3.png) no-repeat left bottom;
		position: absolute;
		bottom: 0;
		left: 45px;
	}
	#sub05 .anime {
		width: 320px;
		height: 237px;
		background-color: #fff;
	}
	#sub06 h3 {
		margin-top: 70px;
		padding-left: 18px;
		font-size: 1.6rem;
		line-height: 1.2;
		border-left: solid 12px #e6000d;
		position: relative;
	}
	#sub06 h3 em {
		font-size: 2.2rem;
		line-height: 1.8;
		font-weight: bold;
		color: #000;
		display: block;
	}
	#sub06 .anime {
		width: 320px;
		height: 205px;
		background-color: #fff;
	}
	#sub07 .outImg {
		position: relative;
	}
	#sub07 .outImg .fitImg {
		width: 380px;
		position: absolute;
		top: -30px;
		left: -40px;
	}
	#sub07 .outImg img {
		position: relative;
	}
	#sub07 .right.text {
		width: 420px;
		padding-left: 40px;
	}
	#profile {
		padding-bottom: 100px;
	}
	#profile .inBox {
		width: 840px;
		padding: 20px 40px 20px 290px;
		margin: 0 auto;
		background: #e6000d;
		color: #fff;
		font-size: 1.4rem;
		line-height: 1.6;
		border-radius: 0.2em;
		position: relative;
	}
	#profile .inBox:AFTER {
		content: '';
		display: block;
		width: 220px;
		height: 240px;
		background: url(../images/profile.png) no-repeat left center;
		background-size: 100% auto;
		position: absolute;
		bottom: -26px;
		left: 50px;
	}
}

/* ===============================
	Mobile setting
================================ */
@media screen and (max-width: 480px) {
	img {
		width: 100%;
	}
	.mts {
		margin-top: 3rem;
	}
	.mtm {
		margin-top: 4rem;
	}
	#top {
		padding-top: 4rem;
		padding-bottom: 9rem;
	}
	.subTtl {
		background: #e6000d;
		color: #fff;
		padding-top: 3rem;
		padding-bottom: 2rem;
	}
	.subTtl h2 {
		font-size: 1.6rem;
		line-height: 1.6;
		position: relative;
		text-align: center;
		letter-spacing: -0.1rem;
	}
	.subTtl h2 span {
		letter-spacing: -1rem;
	}
	.subTtl h2:AFTER {
		content: '';
		display: block;
		width: 25%;
		padding-bottom: 25%;
		background: url(../images/hatena.png) no-repeat left center;
		background-size: 100% auto;
		position: absolute;
		top: -9rem;
		left: 50%;
		margin-left: -12.5%;
	}
	.sub .inBox {
		padding-top: 4rem;
		padding-bottom: 10rem;
	}
	.imgBox {
		margin-top: 2rem;
	}
	.youtubeBox {
		margin-top: 4rem;
	}
	.pcClearfix .fitImg {
		margin-top: 2rem;
	}
	.btnDetail {
		font-size: 1.2rem;
		line-height: 1.4;
		margin: 3rem auto 0;
	}
	#sub01 .ttl {
		padding: 0.8em 0;
		font-size: 1.2rem;
		background: #e6000d;
		color: #fff;
		text-align: center;
	}
	#sub01 .right {
		margin-top: 1rem;
	}
	#sub03 .ttl {
		font-weight: bold;
		margin-top: 2rem;
		margin-bottom: 0.2em;
	}
	#sub04 .pcClearfix {
		margin-top: 2rem;
	}
	#sub05 h3 {
		padding-left: 24%;
		padding-bottom: 0.2em;
		margin-top: 4rem;
		margin-bottom: 3rem;
		font-size: 1.8rem;
		line-height: 1.2;
		font-weight: 200;
		border-bottom: solid 4px #f9dad8;
		position: relative;
	}
	#sub05 h3.hurdle1:AFTER {
		content: '';
		display: block;
		width: 20%;
		padding-bottom: 10%;
		background: url(../images/hurdle1.png) no-repeat left bottom;
		background-size: contain;
		position: absolute;
		bottom: 0;
		left: 0;
	}
	#sub05 h3.hurdle2:AFTER {
		content: '';
		display: block;
		width: 20%;
		padding-bottom: 10%;
		background: url(../images/hurdle2.png) no-repeat left bottom;
		background-size: contain;
		position: absolute;
		bottom: 0;
		left: 0;
	}
	#sub05 h3.hurdle3:AFTER {
		content: '';
		display: block;
		width: 20%;
		padding-bottom: 10%;
		background: url(../images/hurdle3.png) no-repeat left bottom;
		background-size: contain;
		position: absolute;
		bottom: 0;
		left: 0;
	}
	#sub06 h3 {
		margin-top: 4rem;
		padding-left: 1.2rem;
		padding-top: 0.2em;
		font-size: 1.4rem;
		line-height: 1.2;
		border-left: solid 10px #e6000d;
		position: relative;
	}
	#sub06 h3 em {
		font-size: 2.2rem;
		line-height: 1.2;
		font-weight: bold;
		color: #000;
		display: block;
	}
	#profile .baseWidth {
		padding-right: 0;
		padding-left: 0;
	}
	#profile .inBox {
		padding: 6rem 2rem 4rem;
		background: #e6000d;
		color: #fff;
		font-size: 1.4rem;
		line-height: 1.6;
		position: relative;
	}
	#profile .inBox:AFTER {
		content: '';
		display: block;
		width: 34%;
		padding-bottom: 40%;
		background: url(../images/profile.png) no-repeat left center;
		background-size: 100% auto;
		position: absolute;
		top: -8.4rem;
		left: 50%;
		margin-left: -17%;
	}
	.spM1em {
		margin-top: 1em;
	}
}