@charset "utf-8";
/* ============== 共通 =================== */
#contents {
	background: #fffddd;
	padding: 0;
	color: #333333;
	text-align: center;
	font-size: 14px;
	line-height: 1.6;
}
#contents * {
	box-sizing: border-box;
}
#contents a {
	color: #0099cc;
	text-decoration: underline;
	transition: .3s;
}
#contents a:hover {
	opacity: 0.7;
}
.end_txt {
	margin: 20px auto -20px;
	font-weight: bold;
	color: #FF0004;
	font-size: 180%;
	text-align: center;
}
.display-sp {
	display: none;
}
.display-pc {
	display: block;
}
.ly-block {
	width: 90%;
	max-width: 850px;
	margin: 40px auto;
}
/* ============== MV =================== */
.mv {
	background: #e83743;
}
.mv h2 {
	position: relative;
	z-index: 0;
}
.mv h2::after {
	content: "";
	display: block;
	width: 100%;
	height: 29px;
	background: #142445;
	position: absolute;
	bottom: 0;
	z-index: -1;
}
.mv img {
	margin: 0 auto;
	width: 100%;
	max-width: 980px;
}
.mv_term {
	background: #d61518;
	padding: 1rem 0;
	text-align: center;
}
.mv_term img {
	margin: 0 auto;
	max-width: 500px;
	vertical-align: middle;
}
/* ========== btn ============= */
.btn_wrap {
	text-align: center;
}
.btn {
	display: inline-block;
	max-width: 476px;
}
.btn_note {
	margin-top: 1rem;
}
/* ============== att =================== */
.att {
	background: #fff;
	border: 2px solid #e4e1af;
	border-radius: 10px;
	padding: 3% 3% 4%;
	text-align: left;
	line-height: 1.7;
}
.att_item + .att_item {
	margin-top: 30px;
}
.att_item_ttl {
	margin-bottom: 15px;
	font-size: 20px;
	font-weight: bold;
	position: relative;
	padding-left: 1.4em;
	line-height: 1.3;
}
.att_item_ttl::before {
	content: "";
	display: block;
	position: absolute;
	background: #d61518;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}
.att_item_inner p {
	margin-top: 10px;
}
.att_item_inner p + p {
	margin-top: 0;
}
.att_item_img {
	margin: 20px auto;
	text-align: center;
}
.att_list-style {
	margin-top: 10px;
	padding-left: 1em;
	text-indent: -1em
}
.att_list-style li > ul, .att_list-style li > ol {
	margin-left: 1em;
	margin-bottom: 5px;
}
.att_list-style li > ol.att_list-style01 {
	margin-left: 0;
}
.att_list-style01 li {
	text-indent: -3.5rem;
	padding-left: 2.5rem;
}
.att_small-unit {
	margin: 5px auto 10px;
}
.att_small-unit dt {
	font-weight: bold;
	text-indent: 0;
	margin-left: -0.5em;
}
.att_item_note {
	font-size: 12px;
	color: #909090;
}
.att_item_em {
	color: #ff0505;
}
.att_square-box {
	border: 1px solid #ff0505;
	padding: 10px 15px;
	margin: 5px auto;
	color: #ff0505;
}
.att_square-box dd ol {
	padding-left: 2.1em;
	text-indent: -2.5em;
}
@media screen and (max-width: 980px) {
	.mv_img::after {
		content: none;
	}
}
/******************** SP *********************/
@media screen and (max-width: 767px) {
	.display-pc {
		display: none;
	}
	.display-sp {
		display: block;
	}
	.end_txt {
		margin: 3% auto -3%;
		font-size: 150%;
	}
	.ly-block {
		width: calc(100% - 28px);
		max-width: 100%;
		margin: 6% auto;
	}
	/* .container-wrap .content-wrap { */
	/* font-size: 1.3rem; */
	/* width: 100%; */
	/* } */
	/* ========== mv ============= */
	.mv {
		background: url(https://pntc.sslcs.cdngc.net/cdn/campaign/joshin_2209/img/mv_sp.png) 0 0 no-repeat;
		background-size: contain;
		padding-top: 95.07%;
	}
	.mv h2::after {
		content: none;
	}
	.mv_term {
		padding: 10px;
	}
	.mv_term img {
		max-width: none;
		width: 100%;
	}
	/* ========== btn ============= */
	.btn {
		width: 90%;
		max-width: 100%;
	}
	.btn img:hover {
		opacity: 1;
		transform: none;
	}
	.btn_note {
		margin-top: 3%;
		line-height: 1.6;
		text-align: left;
		padding-left: 1em;
		text-indent: -1em;
	}
	/* ============== att =================== */
	.att {
		padding: 6% 5%;
		/*↓差し引く余白は任意 横幅いっぱいにする場合は記述不要*/
		width: calc(100% - 30px);
	}
	.att_item + .att_item {
		margin-top: 8%;
	}
	.att_item_ttl {
		font-size: 1.8rem;
		padding-left: 1.3em;
		margin-bottom: 5px;
	}
	/*「●」タイプのリスト用*/
	.att_item_ttl::before {
		width: 18px;
		height: 18px;
		transform: none;
		top: 0.05em;
	}
	.att_item_inner p, .att_list-style {
		margin-top: 5px;
	}
	/* ============== pagetop =================== */
	.container-wrap.fixed #pagetop .inner p a {
		margin: 0 auto !important;
	}
}