@charset "utf-8";

.wrap { background: #f7f0eb;}
.menu-btn { display: none !important;}


#kv .txt { padding: 50px 0; background: #dc938d;}
#kv .txt p { color: #fff; font-size: clamp(18px, 3.6vw, 36px); font-weight: 500; letter-spacing: 0.15rem; line-height: 1.2; text-align: center;}
#kv .txt p span { display: block; font-size: clamp(40px, 8.0vw, 90px); letter-spacing: 0rem;}
#kv .txt p span em { font-size: clamp(50px, 9.0vw, 100px); letter-spacing: 0.2rem;}
#kv .txt p img { width: 92%; max-width: 940px;}
#kv .inner-kv { width: 100%; max-width: 1280px; margin: 0 auto;}
#kv picture { text-align: center;}
#kv picture img { width: 100%;}
@media (max-width: 801px) {
	#kv .txt { padding: 30px 0;}
}
@media (max-width: 481px) {
	#kv .txt { padding: 20px 0;}
	#kv .txt p { font-size: 12px;}
	#kv .txt p span { font-size: 26px;}
	#kv .txt p span em { font-size: 30px;}
}


#cashback .inner-sct { padding: 50px 0px;}
#cashback .box { width: 100%; max-width: 1180px; margin: 0 auto 50px; padding: 50px 40px; background: #fff; border-radius: 16px;}
#cashback .ttl { margin-bottom: 50px; padding: 12px 0; background: #dc938d; border-radius: 50px;}
#cashback .ttl.mb- { margin-bottom: 25px;}
#cashback .ttl h2 { color: #fff; font-size: 24px; font-weight: 700; text-align: center;}

#cashback .note { text-align: center;}
#cashback .note ul { display: inline-block; text-align: left;}
#cashback .note ul li { color: #c1bfbf; font-size: 12px;}
#cashback .note ul.disc { padding-left: 0.5em;}
#cashback .note ul.disc li::marker { content: '・';}
#cashback .note ul span { color: #dc938d;}
@media (max-width: 801px) {
	#cashback .inner-sct { padding: 30px 0px; background: #fff;}
	#cashback .box { margin: 0 auto; padding: 30px; border-radius: 0px;}
	#cashback .ttl { margin-bottom: 30px;}
}
@media (max-width: 481px) {
	#cashback .inner-sct { padding: 20px 0px 40px;}
	#cashback .box { padding: 24px 18px;}
	#cashback .ttl { margin-bottom: 20px; padding: 4px 0;}
	#cashback .ttl.mb- { margin-bottom: 12px;}
	#cashback .ttl h2 { font-size: 14px;}
	#cashback .note ul li { font-size: 10px;}
}


#cashback .guide { margin-bottom: 80px;}
#cashback .guide p { color: #dc938d; font-size: clamp(18px,2.2vw,24px); font-weight: 700; letter-spacing: 0.1rem; text-align: center;}
#cashback .guide p span { font-size: clamp(21px,3.2vw,32px);}
#cashback .guide p br.sp { display: none;}
@media (max-width: 801px) {
	#cashback .guide p br.sp { display: block;}
}
@media (max-width: 641px) {
	#cashback .guide { margin-bottom: 40px;}
	#cashback .guide p { font-size: 13px; letter-spacing: 0.05rem;}
	#cashback .guide p span { font-size: 18px;}
}


#cashback .feature { margin-bottom: 50px; padding: 50px; border-radius: 16px; background: url('../img/cashback/bg-1.jpg') no-repeat 50% 0 / cover;}
#cashback .feature h3 { color: #dc938d; font-size: clamp(20px,4.2vw,42px); font-weight: 700; line-height: 1.4; text-align: center;}
#cashback .feature h3 span { display: inline-block; margin-right: 8px;}
#cashback .feature h3 sub { font-size: 12px; vertical-align: baseline;}
#cashback .feature .spacer { padding-top: 20px;}
#cashback .feature ol { width: 60%; max-width: 560px; margin-bottom: 40px;}
#cashback .feature ol li { position: relative; padding: 40px 0 20px;}
#cashback .feature ol li img.badge { position: absolute; left: -20px; top: 0; width: 100px; z-index: 2;}
#cashback .feature ol li dl { position: relative; padding: 18px 20px 30px; background: #fbe7dd; border-radius: 10px; z-index: 1;}
#cashback .feature ol li dl dt { position: relative; margin-bottom: 15px; padding-left: 120px;
 color: #dc938d; font-size: 24px; font-weight: 700; letter-spacing: 0.1rem; line-height: 1.4;
}
#cashback .feature ol li dl dt span { position: absolute; left: 72px; top: 0; font-size: 38px; line-height: 1;}
#cashback .feature ol li dl dt sub { font-size: 12px; vertical-align: baseline;}
#cashback .feature ol li dl dt br { display: none;}
#cashback .feature ol li dl dd { color: #716050; font-size: 18px; letter-spacing: 0.05rem; line-height: 1.85;}
#cashback .feature ol li:nth-child(3) dl dd { line-height: 1.6;}
#cashback .feature ol li dl dd span.ruby { position: relative; display: inline-block; line-height: 1;}
#cashback .feature ol li dl dd span.ruby span.rt { position: absolute; right: 0; bottom: -12px; font-size: 12px; line-height: 1;}
#cashback .feature ol li dl dd sub { font-size: 12px;}
@media (max-width: 801px) {
	#cashback .feature { margin-bottom: 0px; padding: 50px 30px 120px; border-radius: 0px; background: url('../img/cashback/bg-1@sp.jpg') no-repeat 50% 0 / 100% auto;}
	#cashback .feature h3 span { display: block; margin: 0 auto; font-size: 5.0vw; letter-spacing: 1.0rem;}
	#cashback .feature .spacer { width: 100%; padding-top: 100%;}
	#cashback .feature ol { width: 100%; margin: 0 auto 20px;}
	#cashback .feature ol li { position: relative; padding: 30px 0 16px;}
	#cashback .feature ol li img.badge { width: 80px;}
	#cashback .feature ol li dl dt { margin-bottom: 12px;}
	#cashback .feature ol li dl dt span { font-size: 32px;}
	#cashback .feature ol li dl dt br { display: block;}
	#cashback .feature ol li dl dd { font-size: 16px;}
	#cashback .feature ol li dl dd span.ruby span.rt { bottom: -9px; font-size: 10px;}
	#cashback .feature ol li dl dd br.pc { display: none;}
}
@media (max-width: 481px) {
	#cashback .feature { padding: 20px 30px 60px;}
	#cashback .feature h3 { font-size: 18px;}
	#cashback .feature h3 span { font-size: 28px; letter-spacing: 0.8rem;}
	#cashback .feature h3 sub { font-size: 10px;}
	#cashback .feature ol li { position: relative; padding: 20px 0 12px;}
	#cashback .feature ol li img.badge { width: 50px; left: -12px;}
	#cashback .feature ol li dl { padding: 12px 20px 20px}
	#cashback .feature ol li dl dt { margin-bottom: 8px; padding-left: 60px; font-size: 15px; letter-spacing: 0.05rem;}
	#cashback .feature ol li dl dt span { left: 25px; font-size: 24px;}
	#cashback .feature ol li dl dt sub { font-size: 10px;}
	#cashback .feature ol li dl dd { font-size: 12px; letter-spacing: 0rem; line-height: 2.0;}
}


#cashback .item { position: relative; padding: 30px 0; border-radius: 10px;}
#cashback .item.shampoo { background: linear-gradient(#fadcdc,#fff);}
#cashback .item.treatment { background: linear-gradient(#f7dece,#fff);}
#cashback .item .badge { position: absolute; right: 30px; top: 40px; width: 160px;}
#cashback .item .badge img { width: 100%;}
#cashback .item figure { width: 50%; text-align: center;}
#cashback .item figure img { width: 50%; max-width: 170px;}
#cashback .item .name { position: absolute; left: 0; top: 0; width: 100%; padding-top: 150px; padding-left: 38%;}
#cashback .item .name p { color: #dc938d; font-size: clamp(21px,3.2vw,32px); font-weight: 700;}
@media (max-width: 801px) {
	#cashback .item { padding: 50px 0;}
	#cashback .item .badge { position: absolute; right: auto; left: 60px; top: 40px;}
	#cashback .item figure { width: 55%; margin: 0 0 0 auto;}
	#cashback .item .name { padding-left: 60px; padding-top: 200px;}
	#cashback .item .name p { line-height: 1.4;}
	#cashback .item .name p span.sp { display: block;}
}
@media (max-width: 481px) {
	#cashback .item { padding: 25px 0;}
	#cashback .item .badge { left: 40px; top: 30px; width: 100px;}
	#cashback .item .name { padding-left: 40px; padding-top: 130px;}
	#cashback .item .name p { font-size: 16px;}
}


#cashback .period dl { text-align: center;}
#cashback .period dl.mb { margin-bottom: 16px;}
#cashback .period dl dt,
#cashback .period dl dd { font-size: clamp(18px,2.2vw,24px); font-weight: 700; letter-spacing: 0.05rem;}
#cashback .period dl dt { margin-bottom: 6px; color: #dc938d;}
@media (max-width: 801px) {
	#cashback .period dl.mb { margin-bottom: 12px;}
}
@media (max-width: 481px) {
	#cashback .period dl dt,
	#cashback .period dl dd { font-size: 13px; line-height: 1.2;}
}

#cashback .entry { }
#cashback .entry ol li { position: relative; margin-bottom: 50px; padding-left: 100px; font-size: clamp(18px,2.2vw,24px); font-weight: 700; letter-spacing: 0.05rem; line-height: 1.4;}
#cashback .entry ol li img { width: 80px; position: absolute; left: 0; top: 0%; border-radius: 100px;}
#cashback .entry ol li:nth-child(2) img,
#cashback .entry ol li:nth-child(3) img { top: 50%; transform: translateY(-50%);}
#cashback .entry ol li span { color: #dc938d;}
#cashback .entry ol li a { position: relative;
 display: block; width: 80%; max-width: 480px; margin: 50px auto 0; padding: 12px 0; background: #fbe7dd; border-radius: 10px;
 color: #dc938d; font-family: "Noto Sans JP","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;
 font-size: clamp(18px,2.2vw,24px); text-align: center;
}
#cashback .entry ol li a:after { content: ''; display: block; width: 18px; height: 18px; border-top: solid 4px #dc938d; border-right: solid 4px #dc938d; 
 position: absolute; right: 20px; top: 50%; transform: translateY(-50%) rotate(45deg);
}
#cashback .entry ol li a:hover { opacity: 0.8; text-decoration: none;}
#cashback .entry ol li br.sp { display: none;}
#cashback .entry ol li ul { padding-top: 20px; padding-left: 0.5em;}
#cashback .entry ol li ul li { margin-bottom: 0px; padding-left: 0px; color: #c1bfbf; font-size: 12px;font-family: "Noto Sans JP","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;}
#cashback .entry ol li ul li::marker { content: '・';}
@media (max-width: 801px) {
	#cashback .entry ol li { margin-bottom: 30px; padding: 6px 0; padding-left: 80px;}
	#cashback .entry ol li img { width: 60px; top: 2px;}
	#cashback .entry ol li:nth-child(2) img,
	#cashback .entry ol li:nth-child(3) img { top: 2px; transform: translateY(0%);}
	#cashback .entry ol li br.pc { display: none;}
	#cashback .entry ol li br.sp { display: block;}
	#cashback .entry ol li a { margin: 30px 0 0; border-radius: 50px;}
	#cashback .entry ol li ul { padding-top: 12px;}
	#cashback .entry ol li ul li { padding: 0px;}
	#cashback .entry ol li a:after { width: 12px; height: 12px; border-width: 3px;}
}
@media (max-width: 481px) {
	#cashback .entry ol li { margin-bottom: 18px; padding: 4px 0; padding-left: 50px; font-size: 13px; letter-spacing: 0;}
	#cashback .entry ol li img { width: 40px;}
	#cashback .entry ol li a { margin: 15px 0 0; padding: 8px 0; font-size: 12px;}
	#cashback .entry ol li ul li { font-size: 10px;}
	#cashback .entry ol li a:after { width: 8px; height: 8px; right: 15px;}
}


#cashback .back p { margin-bottom: 40px; font-size: clamp(18px,2.2vw,24px); font-weight: 700; letter-spacing: 0.05rem; line-height: 1.8; text-align: center;}
#cashback .back p span { color: #dc938d;}
#cashback .back p br.sp { display: none;}
#cashback .back dl { width: 92%; max-width: 700px; margin: 0 auto 40px; padding: 20px 0; border-radius: 10px; background: #fbe7dd; text-align: center;}
#cashback .back dl dt,
#cashback .back dl dd { font-size: clamp(18px,2.2vw,24px); font-weight: 700; letter-spacing: 0.05rem;}
@media (max-width: 801px) {
	#cashback .back p br.sp { display: block;}
}
@media (max-width: 481px) {
	#cashback .back p { margin-bottom: 20px; font-size: 13px; letter-spacing: 0;}
	#cashback .back dl { margin: 0 auto 20px; padding: 12px 0; border-radius: 5px;}
	#cashback .back dl dt,
	#cashback .back dl dd { font-size: 13px;}
}


#cashback .caution {}
#cashback .caution p { margin-bottom: 30px; font-size: clamp(18px,2.2vw,24px); font-weight: 700; letter-spacing: 0.05rem; line-height: 1.8; text-align: center;}
#cashback .caution ul { padding: 0 20px;}
#cashback .caution ul li { font-size: 18px; line-height: 1.8;}
#cashback .caution ul li::marker { content: '・';}
#cashback .caution ul li span { color: #dc938d;}
@media (max-width: 801px) {
	#cashback .caution ul li { font-size: 16px;}
}
@media (max-width: 481px) {
	#cashback .caution p { margin-bottom: 16px; font-size: 14px;}
	#cashback .caution ul { padding: 0 12px;}
	#cashback .caution ul li { font-size: 11px;}
}


#cashback .contact {}
#cashback .contact dl { margin-bottom: 30px; text-align: center;}
#cashback .contact dl dt,
#cashback .contact dl dd { font-size: clamp(18px,2.2vw,24px); font-weight: 700; letter-spacing: 0.05rem;}
#cashback .contact dl dt { color: #dc938d;}
#cashback .contact ul.date { margin-bottom: 20px; text-align: center;}
#cashback .contact ul.date li { font-size: clamp(18px,2.2vw,24px); font-weight: 700;}
#cashback .contact ul.date li span { font-size: 18px;}
@media (max-width: 481px) {
	#cashback .contact dl { margin-bottom: 12px;}
	#cashback .contact dl dt,
	#cashback .contact dl dd { font-size: 14px;}
	#cashback .contact ul.date li { font-size: 13px}
	#cashback .contact ul.date li span{ font-size: 11px}
}