@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@500;700&family=Roboto:wght@700&display=swap');
* {
		margin: 0;
		padding: 0;
}
.scratch_container img {
		width: 100%;
		height: auto;
		vertical-align: top;
}
body {
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 500;
		color: #333;
}
.scratch_container {
		overflow: hidden;
}
.scratch_fv {
		box-sizing: border-box;
		padding: 20px 40px 40px;
		background: url("../images/scratch_bg_1.png") repeat 0 0;
		position: relative;
		z-index: 5;
}
.scratch_fv::before {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: url("../images/scratch_fv_bg_pc.png") no-repeat center top;
		background-size: 1500px;
}
.scratch_fv .fv_star {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-size: 1500px;
		background-repeat: no-repeat;
		background-position: center top;
		z-index: 1;
		display: none;
}
.scratch_fv .fv_star1 {
		background-image: url("../images/scratch_fv_bg_star1-pc.png");
}
.scratch_fv .fv_star2 {
		background-image: url("../images/scratch_fv_bg_star2-pc.png");
}
.scratch_fv .fv_star3 {
		background-image: url("../images/scratch_fv_bg_star3-pc.png");
}
.scratch_fv_inner {
		max-width: 800px;
		margin: 0 auto;
		position: relative;
}
.scratch_fv_main {
		position: relative;
		z-index: 5;
}
.scratch_fv_main div {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
}
.scratch_fv_inner .fv_garland_l, .scratch_fv_inner .fv_garland_r {
		width: 528px;
		position: absolute;
		z-index: -1;
}
.scratch_fv_inner .fv_garland_l {
		transform-origin: right top;
}
.scratch_fv_inner .fv_garland_r {
		transform-origin: left top;
}
.scratch_fv_inner .fv_garland_l {
		top: -22px;
		left: -330px;
}
.scratch_fv_inner .fv_garland_r {
		top: -22px;
		right: -330px;
}
.scratch_fv_inner .fv_ribbon_wrap {
		position: absolute;
		top: 280px;
		width: 1700px;
		left: -480px;
		z-index: 3;
}
.fv_ribbon_wrap .fv_ribbon_upper, .fv_ribbon_wrap .fv_ribbon_bottom {
		position: absolute;
		top: 0;
		left: 0;
}
/* ================= */
.scratch_introduction {
		background: #D34A42;
		padding: 60px 30px;
		position: relative;
		z-index: 0
}
.scratch_introduction::after {
		content: '';
		display: block;
		position: absolute;
		bottom: -50px;
		left: 0;
		width: 100%;
		height: 60px;
		background: url("../images/scratch_introduction_hr.png") no-repeat bottom;
		background-size: 3500px;
}
.scratch_introduction_col {
		background: #fff;
		border-radius: 40px;
		box-sizing: border-box;
		max-width: 1190px;
		margin: 0 auto;
		padding: 30px 30px 40px;
		text-align: center;
}
.scratch_introduction_col p {
		line-height: 2.0;
		color: #D34A42;
		font-size: 20px;
}
.scratch_introduction_logo {
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 0 0 15px;
}
.logo_presented {
		font-family: 'Roboto', sans-serif;
		font-size: 20px;
		font-weight: 700;
		margin-right: 15px;
		transform: translateY(10px)
}
.logo_fc {
		width: 230px;
}
.scratch_present {
		min-height: 460px;
		background: url("../images/scratch_bg_2.png") repeat 0 0;
		background-size: 3500px;
		padding: 120px 30px 170px;
}
.scratch_present_inner {
		max-width: 1190px;
		margin: 0 auto 80px;
		position: relative;
}
.scratch_present_col {
		background: #fff;
		border-radius: 30px;
		box-sizing: border-box;
		padding: 170px 100px 60px;
		position: relative;
		z-index: 5
}
.scratch_present_col .week_hd {
		position: absolute;
		top: 55px;
		left: -20px;
}
.week_hd_ttl {
		width: 400px;
		height: 70px;
		background: #F3773E;
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
		text-align: center;
		font-size: 36px;
		font-weight: 800;
		position: relative;
}
.week_hd_ttl.widthFree {
		width: auto !important;
		padding-right: 45px;
		padding-left: 30px;
		font-size: 24px;
}
.week_hd_ttl span {
		font-size: 120%;
		margin-right: 4px;
}
.week_hd_ttl::before {
		content: '';
		display: block;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 0 20px 20px 0;
		border-color: transparent #AD4F24 transparent transparent;
		position: absolute;
		bottom: -20px;
		left: 0;
}
.week_hd_ttl::after {
		content: '';
		display: block;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 35px 20px 35px 0;
		border-color: transparent #fff transparent transparent;
		position: absolute;
		top: 0;
		right: 0;
}
.scratch_present_lead {
		color: #F3773E;
		font-size: 18px;
		line-height: 1.8;
		margin: 0 0 40px;
}
.scratch_present_box {
		margin-bottom: 20px;
}
.scratch_btn_center {
		display: flex;
		justify-content: center;
}
.scratch_btn {
		width: 630px;
		font-weight: 800;
}
.scratch_btn a {
		width: 100%;
		height: 120px;
		box-sizing: border-box;
		border: 2px solid #D34A42;
		background: #D34A42;
		color: #fff;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 30px;
		text-decoration: none;
		border-radius: 60px;
		transition: background 0.2s;
		position: relative;
}
.scratch_btn a::after {
		content: '';
		display: block;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 14px 0 14px 14px;
		border-color: transparent transparent transparent #fff;
		position: absolute;
		right: 80px;
		top: calc(50% - 10px);
}
@media (hover: hover) {
		.scratch_btn a:hover {
				background: #fff;
				color: #D34A42;
		}
		.scratch_btn a:hover::after {
				border-color: transparent transparent transparent #D34A42;
		}
}
.scratch_present_inner .scratch_present_corner_r, .scratch_present_inner .scratch_present_corner_l {
		position: absolute;
		z-index: 5;
}
.scratch_present_inner .scratch_present_corner_r {
		width: 380px;
		top: -180px;
		right: -130px;
}
.scratch_present_inner .scratch_present_corner_l {
		width: 280px;
		bottom: 300px;
		left: -90px;
}
.scratch_present_corner_r div, .scratch_present_corner_l div {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
}
.scratch_terms {
		background: url("../images/scratch_bg_3.png") repeat 0 0;
		background-size: 3500px;
		position: relative;
		top: -80px;
		padding: 120px 40px 180px;
}
.scratch_terms_inner {
		background: #fff;
		border-radius: 40px;
		box-sizing: border-box;
		max-width: 1190px;
		margin: 0 auto;
		padding: 80px 40px;
		position: relative;
}
.scratch_terms_inner::before {
		content: '';
		display: block;
		position: absolute;
		background: url("../images/scratch_terms_corner_bg1.png") no-repeat 0 0;
		background-size: 100%;
		width: 370px;
		height: 205px;
		top: -80px;
		left: -110px;
		transition: opacity 0.4s;
		opacity: 0;
		z-index: 5;
}
.scratch_terms_inner.active::before {
		opacity: 1;
}
.scratch_terms_inner::after {
		content: '';
		display: block;
		position: absolute;
		background: url("../images/scratch_terms_corner_bg2-2.png") no-repeat 0 0;
		background-size: 100%;
		width: 140px;
		height: 215px;
		bottom: 10px;
		right: -150px;
		transition: opacity 0.4s;
		opacity: 0;
}
.scratch_terms_inner.bgActive::after {
		opacity: 1;
}
.scratch_terms_col, .scratch_notes_col {
		max-width: 940px;
		box-sizing: border-box;
		margin: 0 auto;
		padding: 40px;
		border-radius: 8px;
}
.scratch_terms_col {
		margin-bottom: 60px;
		border: 2px solid #307055;
		background: #eaf2ed;
		color: #307055;
		position: relative;
}
.scratch_terms_col::before, .scratch_notes_col::before {
		content: '';
		display: block;
		position: absolute;
		top: -2px;
		left: calc(50% - 100px);
		width: 200px;
		height: 20px;
}
.scratch_terms_col::before {
		background: #eaf2ed;
}
.scratch_notes_col::before {
		background: #fff;
}
.scratch_notes_col {
		border: 2px solid #307055;
		background: #fff;
		color: #307055;
		position: relative;
}
.scratch_notes_col::after {
		content: '';
		display: block;
		position: absolute;
		background: url("../images/scratch_terms_corner_bg2-1.png") no-repeat 0 0;
		background-size: 100%;
		width: 150px;
		height: 220px;
		bottom: -120px;
		right: -120px;
		transition: opacity 0.4s;
		opacity: 0;
}
.scratch_notes_col.active::after {
		opacity: 1;
}
.scratch_term_hd_wrap, .scratch_notes_hd_wrap {
		position: relative;
		top: -73px;
		margin-bottom: -50px;
}
.scratch_term_hd span {
		position: relative;
		display: inline-block;
		z-index: 5;
}
.scratch_term_hd, .scratch_notes_hd {
		font-size: 40px;
		font-weight: 700;
		letter-spacing: 0.03em;
		text-align: center;
}
.scratch_terms_dl_gr_center {
		display: flex;
		justify-content: center;
}
.scratch_terms_col dl {
		display: flex;
		align-items: center;
		padding: 10px 0;
}
.scratch_terms_col dt {
		margin-right: 10px;
		display: flex;
		align-items: center;
}
.scratch_terms_col dd {
		display: flex;
		align-items: center;
}
.scratch_terms_dt {
		background: #307055;
		color: #fff;
		font-size: 20px;
		padding: 3px 10px;
		border-radius: 4px;
		font-family: YakuHanJP_Noto, 'Roboto', "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
		font-weight: 700;
}
.scratch_terms_dt span {
		font-size: 120%;
}
.scratch_terms_col p {
		font-size: 28px;
		font-family: YakuHanJP_Noto, 'Roboto', "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
		font-weight: 700;
}
.scratch_terms_col p span {
		font-size: 80%;
}
.scratch_notes_iframe {
		height: 400px;
		padding-right: 20px;
		overflow: auto;
		color: #333;
		line-height: 1.8;
		font-size: 14px;
}
.scratch_notes_iframe p, .scratch_notes_iframe div, .scratch_notes_iframe a, .scratch_notes_iframe li {
		word-break: break-all;
		line-height: 1.8;
		font-size: 14px;
}
.scratch_footer {
		background: url("../images/scratch_bg_4.png") repeat 0 0;
		background-size: 3500px;
		position: relative;
		top: -150px;
		padding: 80px 0px;
		margin-bottom: -150px;
}
.scratch_footer_inner {
		max-width: 1450px;
		margin: 0 auto;
}
/* ============== */
.scratch_option {
		background: url("../images/scratch_bg_5.png") repeat 0 0;
		background-size: 3500px;
		position: relative;
		top: -140px;
		padding: 130px 40px 180px;
		min-height: 600px;
		margin-bottom: -160px;
}
.scratch_option_body {
		min-height: 200px;
}
.scratch_option_body p {
		line-height: 1.8;
		margin-bottom: 1em;
}
.scratch_option_body a {
		color: #F3773E;
		text-decoration: underline;
}
.scratch_option_figure {
		margin: 2em 0;
}
.scratch_option_figure img {
		width: 100%;
		height: auto;
}
@media (hover: hover) {
		.scratch_option_body a:hover {
				color: #F3773E;
				text-decoration: none !important;
		}
}