@charset "UTF-8";
/* =Reset
-------------------------------------------------------------- */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;word-wrap:break-word;overflow-wrap:break-word;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display: block;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal;}
li{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:inherit;}
q:before,q:after{content:'';}
abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:super;}
sub{vertical-align:text-bottom;}
input,textarea,select,button{font-family:inherit;font-size:inherit;font-weight:inherit;}
input,textarea,select,button{font-size:100%;}
legend{color:#000;}
img {vertical-align:top;}
input[type="radio"],input[type="checkbox"] {vertical-align: -2px;}
label {cursor: pointer;}
/* =Common
-------------------------------------------------------------- */
body {
	text-align: center;
	line-height: 1;
	-webkit-text-size-adjust: 100%;
}
img {
	max-width: 100%;
	height: auto;
}
input[type="submit"], input[type="reset"] {
	appearance: none;
	cursor: pointer;
}
/* clearfix */
.cf:before, .cf:after {content:"";display:table;}
.cf:after {clear:both;}
.clr {clear: both;}
/* =Styles 
-------------------------------------------------------------- */
html {
	font-size: 2.6667vw;
}
body {
	/* win：游明朝、mac：ヒラギノ明朝、iPhone：ヒラギノ明朝 */
	font-family: 'Yu Mincho', 'Hiragino Mincho ProN', YuMincho, serif;
	color: #535151;
}
.noto {
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
}
.num {
	font-family: "Lato";
	font-optical-sizing: auto;
	font-style: normal;
	font-feature-settings: "tnum";
}
a {
	text-decoration: none;
	color: #fff;
}
:root {
	--black: #535151;
	--line: #827364;
	--red: #D26E6E;
	--light-beige: #F7F3ED;
	--deep-beige: #EDE6DB;
	--txt-gray: #9E9E9E;
}
.line {
	position: relative;
}
.line::before,
.line::after {
	content: '';
	position: absolute;
}
.line::before {
	width: 0.4rem;
	height: 0.4rem;
	border-radius: 50%;
}
.line::after {
	width: 0.1rem;
}
.container img {
	width: 100%;
}
.main {
	position: relative;
}
.bg_fixed,
.bg_fixed .nav,
.bg_fixed .bg_item_3 {
	display: none;
}
.bg_fixed .bg_item_1 {
	opacity: 0;
	transform: translateY(-2%);
	transition: transform .8s, opacity 1.7s;
}
.bg_fixed .bg_item_2 {
	opacity: 0;
	transform: translateY(2%);
	transition: transform .8s, opacity 1.7s;
}
.bg_fixed .bg_item_1.active,
.bg_fixed .bg_item_2.active {
	transform: translateY(0);
	opacity: 1;
}
@media (min-width: 768px) {
	.fixed_btn  {
		display: none;
	}
	.main,
	.modal_contents_wrap {
		max-width: 375px;
		margin: 0 auto;
	}
	.bg_fixed {
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	.bg_fixed .logo {
		position: absolute;
		top: 85px;
		left: 5.7%;
		width: 99px;
		z-index: 1;
	}
}
@media ( min-width: 768px ) {
	.bg_fixed .bg_item_1 {
		position: absolute;
		top: 0;
		right: 0;
		width: 100%;
		max-width: 93.75%;
		height: 530px;
		background: url(../../images/hapr_cp16_1/fixed_img_right_2.png)no-repeat left bottom/cover;
	}
	.bg_fixed .cta {
		position: absolute;
		bottom: 45px;
		left: calc(52.5% + 188px);
	}
	.bg_fixed .cta a {	
		display: block;
		width: 20.9vw;
		height: 21.9vw;
		background: url(../../images/hapr_cp16_1/cta_2.png)no-repeat center/contain;
	}
}
@media ( min-width: 1000px ) {
	.bg_fixed .bg_item_1 {
		max-width: 85%;
	}
	.bg_fixed .bg_item_2 {
		position: absolute;
		left: 0;
		bottom: 0;
		width: 607px;
		height: 534px;
		background: url(../../images/hapr_cp16_1/fixed_img_left_2.png)no-repeat left top/contain;
	}
	.bg_fixed .bg_item_3 {
		display: block;
		position: absolute;
		top: clamp(300px, 23vw, 350px);
		left: calc(50% + 216px);
		width: clamp(238px, 23.9167vw ,348px);
	}
	.bg_fixed .cta {
		left: calc(55% + 188px);
		bottom: min(6.1038vh, 60px);
	}
	.bg_fixed .cta a {
		width: 209px;
		height: 219px;
	}
}
@media ( min-width: 1201px ) {
	.bg_fixed .bg_item_1 {
		max-width: 70%;
	}
	.bg_fixed .cta {
		left: calc(58.33% + 188px);
	}
}
@media (min-width: 1460px) {
	.bg_fixed .nav {
		display: block;
		position: absolute;
		top: 17.75%;
		left: 15.625%;
		z-index: 2;
	}
	.bg_fixed .nav ul li {
		position: relative;
		text-align: left;
		padding-left: 31px;
	}
	.bg_fixed .nav ul li.active::before {
		content: '';
		position: absolute;
		top: 50%;
		left: 0;
		width: 23px;
		height: 8px;
		transform: translateY(-50%);
		background: url(../../images/hapr_cp16_1/nav_icon.svg)no-repeat center/contain;
	}
	.bg_fixed .nav ul li + li {
		margin-top: 10px;
	}
	.bg_fixed .nav ul li a {
		color: #AD9B8A;
		display: block;
		font-size: 18px;
		line-height: 1.6;
		letter-spacing: 0.08em;
	}
	.bg_fixed .nav ul li.active a {
		color: var(--line);
		font-weight: bold;
	}
	.bg_fixed .bg_item_1 {
		width: min(69.2708vw,1330px);
		height: clamp(500px,35.9375vw,690px);
		background: url(../../images/hapr_cp16_1/fixed_img_right_1.png)no-repeat bottom left/cover;
	}
	.bg_fixed .bg_item_2 {
		width: min(42.8125vw,822px);
		height: clamp(534px,28.6458vw,550px);
		background: url(../../images/hapr_cp16_1/fixed_img_left_1.png)no-repeat left 80% top/cover;
		z-index: 1;
	}
	.bg_fixed .cta {
		bottom: 0;
		left: calc(59.42% + 188px);
	}
	.bg_fixed .cta::before {
		content: '';
		position: absolute;
		bottom: 0;
		right: -230px;
		width: 1124px;
		height: 146px;
		background: url(../../images/hapr_cp16_1/bg_cta.png)no-repeat bottom center/cover;
	}
	.bg_fixed .cta a {
		position: relative;
		display: block;
		width: 340px;
		height: 168px;
		background: url(../../images/hapr_cp16_1/cta_1.png)no-repeat center/contain;
	}
}
@media ( min-height: 600px ) and ( max-height: 900px ){
	.bg_fixed .bg_item_1 {
		max-height: 45vh;
	}
	.bg_fixed .bg_item_2 {
		max-height: 50vh;
	}
	.bg_fixed .bg_item_3 {
		top: 20.3459vh;
	}
}
.fv {
	position: relative;
	padding-top: 88.8%;
	background: url(../../images/hapr_cp16_1/fv.jpg)no-repeat center center/contain;
}
.fv .logo {
	position: absolute;
	top: 1.5rem;
	left: 1.1rem;
	width: 2.6rem;
}
.offer {
	color: #fff;
	padding: 1.5rem 0 2.6rem;
	background: url(../../images/hapr_cp16_1/bg_offer.jpg) no-repeat center center/100%;
}
.offer .caption {
	font-size: 2.4rem;
	line-height: 1.5;
	letter-spacing: 0.03em;
	font-weight: bold;
	margin-bottom: 0.4rem;
}
.offer .caption span {
	position: relative;
}
.offer .caption span::before {
	content: 'ハップアール';
	position: absolute;
	top: -1.2em;
	left: 0;
	right: 0;
	margin: 0 auto;
	font-size: 1.0rem;
	letter-spacing: 0.1em;
}
.offer .btn {
	width: 32.0rem;
	margin: 0 auto 0.8rem;
}
.offer .btn .box {
	position: relative;
	display: block;
	color: var(--red);
	font-size: 1.4rem;
	line-height: 1.2;
	padding: 0.5rem 0;
	background: #fff;
	border-radius: 7.0rem;
}
.offer .btn .box::before {
	content: '';
	position: absolute;
	top: -2.3rem;
	left: -2rem;
	width: 4.9rem;
	height: 6.1rem;
	background: url(../../images/hapr_cp16_1/btn_item.png) no-repeat center center/cover;
}
.offer .btn .box .circle {
	display: inline-block;
	position: relative;
	width: 1.2rem;
	height: 1.2rem;
	margin: 0 0.2em;
	background: var(--red);
	border-radius: 50%;
}
.offer .btn .box .circle::after {
	content: '&';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #fff;
	font-size: 0.8rem;
}
.offer .btn .box .large {
	font-size: 1.6rem;
}
.offer .note {
	font-size: 1.0rem;
	line-height: 1.5;
	color: #fff;
	text-align: left;
	padding-left: 5.5rem;
}
.scrub {
	position: relative;
	color: #fff;
	padding: 3.5rem 0 4.5rem;
	background: url(../../images/hapr_cp16_1/bg_scrub_2.jpg)no-repeat var(--light-beige) top center/100%;
}
.offer + .scrub {
	padding: 2.6rem 0 4.1rem;
	background: url(../../images/hapr_cp16_1/bg_scrub.jpg)no-repeat var(--light-beige) top center/100%;
}
.scrub .text_wrap {
	text-align: left;
	padding-left: 3.7rem;
}
.scrub .text_wrap .text {
	font-size: 1.7rem;
	line-height: 1.6;
	letter-spacing: 0.08em;
	margin: 0 0 1.3rem;
}
.scrub .text_wrap .text span {
	font-size: 0.8rem;
}
.scrub .text_wrap .note {
	font-size: 1.0rem;
	line-height: 1.5;
}
.scrub .img {
	position: absolute;
	top: 1.3rem;
	right: 2.4rem;
	width: 8.5rem;
}
.offer + .scrub .img {
	top: 0;
}
.worry {
	background: var(--light-beige);
}
.worry .vertical_text_area {
	display: flex;
	flex-direction: row-reverse;
	text-align: left;
	opacity: 1;
	transition: opacity .2s;
}
.worry .vertical_text_area.hidden {
	opacity: 0;
}
.worry .vertical_text_area .sec_ttl {
	position: relative;
	color: var(--line);
	font-size: 2.2rem;
	font-weight: bold;
	writing-mode: vertical-rl;
	letter-spacing: 0.35em;
	line-height: 1.35;
	padding: 3.2rem 0 0 0;
	margin: 0 3.8rem 0 3.2rem;
}
.worry .vertical_text_area .sec_ttl::before,
.worry .vertical_text_area .sec_ttl::after {
	left: 0;
	right: 0;
	margin: 0 auto;
	background: var(--line);
}
.worry .vertical_text_area .sec_ttl::before {
	top: -1.2rem;
}
.worry .vertical_text_area .sec_ttl::after {
	top: -1rem;
	height: 3.5rem;
	transform: translateX(0.05rem);
}
.worry .vertical_text_area .wrap {
	position: relative;
	flex: 1 1 auto;
	padding: 1.7rem 0 1.5rem;
}
.worry .vertical_text_area .main_text_wrap {
	display: flex;
	flex-direction: row-reverse;
	opacity: 0;
	filter: blur(2px);
}
.worry .vertical_text_area .main_text_wrap span {
	display: inline-block;
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: 0.3em;
	writing-mode: vertical-lr;
	margin-right: 2.3rem;
}
.worry .vertical_text_area .main_text_wrap .small {
	font-size: 1.2rem;
}
.worry .vertical_text_area .main_text_wrap .main_1 {
	padding-top: 4.4rem;
}
.worry .vertical_text_area .main_text_wrap .main_2 {
	padding-top: 8.7rem;
}
.worry .vertical_text_area .main_text_wrap .main_3 {
	padding-top: 6.6rem;
}
.worry .vertical_text_area .main_text_wrap .main_4 {
	padding-top: 3.6rem;
}
.worry .vertical_text_area .main_text_wrap .main_5 {
	padding-top: 7.5rem;
	letter-spacing: 0.25em;
}
.worry .vertical_text_area .sub_texts {
	color: var(--line);
	line-height: 1.3;
	letter-spacing: 0.3em;
}
.worry .vertical_text_area .sub_texts span {
	position: absolute;
	writing-mode: vertical-lr;
	opacity: 0.3;
}
.worry .vertical_text_area .sub_texts .sub_1 {
	font-size: 1.3rem;
	top: 17.5rem;
	right: 0;
}
.worry .vertical_text_area .sub_texts .sub_2 {
	font-size: 1.0rem;
	top: 1.3rem;
	right: 7.0rem;
}
.worry .vertical_text_area .sub_texts .sub_3 {
	font-size: 2.6rem;
	top: 25.5rem;
	left: 10.0rem;
	opacity: 0.2;
}
.worry .vertical_text_area .sub_texts .sub_4 {
	font-size: 2.0rem;
	top: 3.9rem;
	left: 0;
}
.worry .scroll_text_area {
	position: relative;
}
.worry .scroll_text_area .bg {
	position: sticky;
	top: calc((100vh - 45.6rem)/2);
	width: 100%;
	height: 45.6rem;
	background: url(../../images/hapr_cp16_1/bg_worry_scroll_area.jpg) no-repeat center center/contain;
	z-index: 1;
}
.worry .scroll_text_area .bg::after {
	content: '';
	position: absolute;
	right: 1.9rem;
	bottom: -2.3rem;
	width: 18.9rem;
	height: 9.2rem;
	background: url(../../images/hapr_cp16_1/bg_item_1.png) no-repeat center center/contain;
	z-index: 1;
}
.worry .scroll_text_area .in {
	position: relative;
}
.worry .scroll_text_area  #scroll_area {
	position: relative;
	margin-top: -45.6rem;
	z-index: 1;
}
.worry .scroll_text_area  #scroll_area .box {
	height: 100vh;
}
.worry .scroll_text_area  #scroll_area span {
	position: sticky;
	top: calc((100vh - 45.6rem)/2);
	font-size: 1.6rem;
	line-height: 1.7;
	letter-spacing: 0.01em;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 45.6rem;
	transition: opacity 0.2s ease;
}
/* .worry .scroll_text_area {
	position: relative;
	background: url(../../images/hapr_cp16_1/bg_worry_scroll_area.jpg) no-repeat center center/100%;
}
.worry .scroll_text_area::after {
	content: '';
	position: absolute;
	right: 1.9rem;
	bottom: -2.3rem;
	width: 18.9rem;
	height: 9.2rem;
	background: url(../../images/hapr_cp16_1/bg_item_1.png) no-repeat center center/contain;
	z-index: 1;
}
.worry .scroll_text_area .in {
	position: relative;
	height: 45.6rem;
	overflow: auto;
}
.worry .scroll_text_area .in::-webkit-scrollbar {
	display: none;
}
.worry .scroll_text_area .in span {
	font-size: 1.6rem;
	line-height: 1.7;
	letter-spacing: 0.01em;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 45.6rem;
	transition: opacity 0.2s ease;
} */
/* .feature */
.feature {
	padding: 0 0 8.0rem;
	background: url(../../images/hapr_cp16_1/bg_feature.jpg)no-repeat var(--light-beige) bottom center/100%;
}
.feature .wrap {
	position: relative;
	padding: 2.9rem 0 0;
	background: var(--light-beige);
}
.feature .wrap .sec_ttl {
	width: 6.5rem;
	margin: 0 3.9rem 2.8rem auto;
}
.feature .wrap .sec_ttl img{
	width: 100%;
}
.feature .wrap .img {
	position: absolute;
	top: 10.0rem;
	left: 0;
	width: 60%;
}
.feature .contents {
	width: 33.5rem;
	padding: 3.3rem 0 4.0rem;
	margin: 0 auto;
	background: #fff;
	box-sizing: border-box;
}
.feature .contents.line::before,
.feature .contents.line::after {
	background: var(--black);
}
.feature .contents.line::before {
	top: 16.5rem;
	left: 1.9rem;
}
.feature .contents.line::after {
	top: -1rem;
	left: 2.0rem;
	height: 17.7rem;
	transform: translateX((0.050rem));
}
.feature .contents .text {
	font-size: 1.4rem;
	text-align: left;
	line-height: 1.6;
	letter-spacing: 0.02em;
	font-feature-settings: "palt";
	padding-left: 3.6rem;
}
.feature .contents .text .bg {
	background: #F7F3ED;
}
.feature .contents .text .color {
	color: var(--red);
}
.feature .contents .text .small {
	font-size: 1.0rem;
}
.feature .contents .img {
	width: 30.3rem;
	margin: 2.1rem auto;
}
.feature .contents .text.bottom {
	font-size: 1.2rem;
	letter-spacing: 0.05em;
	width: 26.0rem;
	margin: 0 0 1.5rem;
}
.feature .contents .notes {
	color: var(--txt-gray);
	font-size: 1.0rem;
	line-height: 1.6;
	letter-spacing: 0.05em;
	text-align: right;
}
.feature .contents .notes li:first-child {
	padding-right: 2.0rem;
}
.feature .contents .notes li:last-child {
	padding-right: 2.5rem;
}
/* .aparin */
.aparin {
	margin-top: -1px;
}
.aparin .top {
	padding: 4.4rem 0 2.2rem;
	background: var(--deep-beige);
}
.aparin .top .wrap {
	display: flex;
	justify-content: space-between;
	padding: 0 0 0 4.0rem;
	margin: 0 0 4.6rem;
}
.aparin .top .wrap .sec_ttl {
	flex: 0 0 5.9rem;
}
.aparin .top .wrap .sec_ttl img {
	width: 100%;
}
.aparin .top .wrap .contents {
	flex: 0 1 22.7rem;
}
.aparin .top .wrap .contents .img {
	margin: 0 0 2.0rem;
}
.aparin .top .text_wrap {
	text-align: left;
	font-feature-settings: "palt";
}
.aparin .text_wrap.line::before,
.aparin .text_wrap.line::after {
	background: var(--black);
}
.aparin .text_wrap .color {
	color: var(--red);
}
.aparin .text_wrap .small {
	font-size: 1.0rem;
}
.aparin .top .wrap .contents .text_wrap {
	font-size: 1.4rem;
	line-height: 1.6;
	letter-spacing: 0.04em;
	padding: 1.5rem 2.9rem 1.8rem 0;
}
.aparin .top .wrap .contents .text_wrap.line::before {
	right: 1.5rem;
	bottom: 0;
}
.aparin .top .wrap .contents .text_wrap.line::after {
	right: 1.6rem;
	bottom: 0;
	height: 19.6rem;
	transform: translateX(-0.05rem);
}
.aparin .top .wrap .contents .text_wrap .text + .text {
	margin-top: 0.9rem;
}
.aparin .top .contents_2 .img {
	width: 30.5rem;
	margin: 0 auto 2.0rem;
}
.aparin .top .contents_2 .text_wrap {	
	padding: 1.6rem 0 2.2rem 7.6rem;
}
.aparin .top .contents_2 .text_wrap.line::before {
	left: 5.4rem;
	bottom: 0;
}
.aparin .top .contents_2 .text_wrap.line::after {
	left: 5.5rem;
	top: 0;
	height: 100%;
	transform: translateX(0.050rem);
}
.aparin .top .contents_2 .text_wrap .text {
	font-size: 1.4rem;
	line-height: 1.6;
	letter-spacing: 0.05em;
}
.aparin .top .contents_2 .text_wrap .text + .text {
	margin-top: 0.9rem;
}
.aparin .top .contents_2 .text_wrap .notes {
	color: var(--txt-gray);
	font-size: 1.0rem;
	line-height: 1.6;
	letter-spacing: 0.05em;
	margin-top: 1.1rem;
}
.aparin .bottom {
	position: relative;
	padding: 6.9rem 0 9.9rem;
	background: url(../../images/hapr_cp16_1/bg_aparin_bottom.jpg)no-repeat top/100% 100%;
}
.aparin .bottom .img {
	width: 34.9rem;
	margin: 0 auto 3.2rem 0;
}
.aparin .bottom .text_wrap {
	text-align: left;
	line-height: 1.6;
	padding: 0 0 0 3.3rem;
}
.aparin .bottom dl {
	color: #fff;
	letter-spacing: 0.08em;
	margin: 0 0 1.2rem;
}
.aparin .bottom dl dt {
	font-size: 2.0rem;
	margin-bottom: 1.6rem;
}
.aparin .bottom dl dd {
	font-size: 1.4rem;
}
.aparin .bottom dl dd p + p {
	margin-top: 1.0rem;
}
.aparin .bottom dl dd p .small {
	font-size: 1.0rem;
}
.aparin .bottom dl dd p .bg {
	background: #A69381;
}
.aparin .bottom .notes {
	color: #fff;
	font-size: 1.0rem;
	line-height: 1.6;
	letter-spacing: 0.05em;
	text-align: left;
}
/* .product */
.product {
	padding: 4.5rem 0 0;
	background: var(--light-beige);
	margin-top: -1px;
}
.product .in {
	padding: 0 2.0rem 6.6rem;
}
.product .ttl_wrap {
	display: flex;
	justify-content: center;
	gap: 0 1.1rem;
	margin: 0 0 3.5rem;
}
.product .ttl_wrap .term {
	flex: 0 0 7.8rem;
}
.product .ttl_wrap .sec_ttl {
	text-align: left;
	padding-top: 1.2rem;
}
.product .ttl_wrap .sec_ttl .block {
	display: block;
	color: var(--line);
	font-size: 2.2rem;
	font-weight: bold;
	letter-spacing: 0.1em;
	line-height: 1.7;
}
.product .ttl_wrap .sec_ttl .ruby {
	position: relative;
}
.product .ttl_wrap .sec_ttl .ruby::before {
	content: 'ハップアール';
	position: absolute;
	top: -1.2em;
	left: 0;
	right: 0;
	margin: 0 auto;
	font-size: 1.2rem;
	text-align: center;
}
.product .ttl_wrap .sec_ttl .sub {
	display: inline-block;
	color: #fff;
	font-size: 1.2rem;
	line-height: 1.7;
	letter-spacing: 0.06em;
	background: var(--red);
	padding: 0 0.4rem;
}
.product .item_list .item_contents {
	position: relative;
	border: 0.1rem solid var(--txt-gray);
	padding: 0 0 4.9rem;
}
.product .item_list .item_contents + .item_contents {
	margin-top: 4.0rem;
}
.product .item_list .item_contents .head {
	display: flex;
	justify-content: center;
	align-items: flex-start;
}
.product .item_list .item_contents .head .pick_up {
	font-size: 1.4rem;
	flex: 0 0 13.5rem;
	padding: 0.9rem 0 0.7rem;
	border-right: 0.1rem solid var(--txt-gray);
	border-bottom: 0.1rem solid var(--txt-gray);
}
.product .item_list .item_contents .head .pick_up .large {
	font-size: 2.2rem;
}
.product .item_list .item_contents .head .pick_up .small {
	font-size: 1.0rem;
}
.product .item_list .item_contents .head .item_num {
	font-size: 1.4rem;
	padding: 0.4rem 0;
	flex: 1 1 auto;
	border-bottom: 0.1rem solid var(--txt-gray);
}
.product .item_list .item_contents .options {
	position: absolute;
	top: 4.5rem;
	right: -1rem;
}
.product .item_list .item_contents .options li {
	color: var(--red);
	font-size: 1.4rem;
	line-height: 1.2;
	letter-spacing: 0.09em;
	padding: 0.5rem 0 0.4rem;
	width: 8.5rem;
	height: 2.6rem;
	border: 0.1rem solid var(--red);
	background: #fff;
	box-sizing: border-box;
}
.product .item_list .item_contents .options li + li {
	margin-top: 0.5rem;
}
.product .item_list .item_contents.item_1 .item_img {
	padding: 2.0rem 0 2.2rem;
}
.product .item_list .item_contents.item_2 .item_img {
	padding: 5.1rem 0 2.2rem;
}
.product .item_list .item_contents.item_3 .item_img {
	padding: 5.4rem 0 2.4rem;
}
.product .item_list .item_contents .text_wrap .item_name {
	font-size: 1.8rem;
	line-height: 1.5;
	letter-spacing: 0.08em;
}
.product .item_list .item_contents .text_wrap .capacity {
	margin: 0 0 1.6rem;
}
.product .item_list .item_contents .text_wrap .capacity span {
	display: inline-block;
	color: #fff;
	font-size: 1.2rem;
	line-height: 1.5;
	padding: 0 1.0rem;
	background: #DCADAD;
}
.product .item_list .item_contents .text_wrap .capacity span + span {
	margin-top: 0.5rem;
}
.product .item_list .item_contents .text_wrap .text {
	font-size: 1.2rem;
	line-height: 1.7;
	text-align: left;
	padding-left: 1.4rem;
	padding-right: 1.4rem;
	margin-bottom: 1.1rem;
}
.product .item_list .item_contents .text_wrap .text .small {
	font-size: 1.0rem;
}
.product .item_list .item_contents .text_wrap .notes {
	color: var(--txt-gray);
	font-size: 1.0rem;
	text-align: left;
	line-height: 1.5;
	letter-spacing: 0.08em;
	padding-left: 1.4rem;
	margin: 0 0 4.7rem;
}
.product .item_list .item_contents .recommend {
	width: 27.0rem;
	margin: 0 auto 4.8rem;
}
.product .item_list .item_contents .recommend dt {
	position: relative;
	font-size: 1.6rem;
	font-weight: bold;
	letter-spacing: 0.08em;
	padding: 0 0 0.9rem;
	border-bottom: 0.1rem solid var(--black);
}
.product .item_list .item_contents .recommend dt::before,
.product .item_list .item_contents .recommend dt::after {	
	content: '';
	position: absolute;
	bottom: -0.2rem;
	width: 0.4rem;
	height: 0.4rem;
	background: var(--black);
	transform: translateY(0.050rem);
	border-radius: 50%;
}
.product .item_list .item_contents .recommend dt::before {
	left: 0;
}
.product .item_list .item_contents .recommend dt::after {
	right: 0;
}
.product .item_list .item_contents .recommend dd {
	text-align: left;
	padding: 0.5rem 0 0;
}
.product .item_list .item_contents .recommend dd ul li {
	position: relative;
	font-size: 1.4rem;
	line-height: 1.7;
	letter-spacing: 0.015em;
	padding-left: 1em;
}
.product .item_list .item_contents .recommend dd ul li::before {
	content: '';
	position: absolute;
	top: 0.42em;
	left: 0;
	width: 1.0rem;
	height: 1.0rem;
	background: url(../../images/hapr_cp16_1/check_icon.svg)no-repeat center center/contain;
}
.product .item_list .item_contents .recommend dd ul li + li {
	margin-top: 0.4rem;
}
.product .item_list .item_contents .recommend dd ul li .small {
	font-size: 1.0rem;
}
.product .item_list .item_contents .recommend dd ul li .border {
	border-bottom: 0.1rem solid #F1CECE;
}
.product .item_list .item_contents .recommend dd .note {
	font-size: 1.0rem;
	line-height: 1.5;
	letter-spacing: 0.08em;
	margin-top: 0.6rem;
}
.product .item_list .item_contents .box {
	color: #fff;
	width: 31.0rem;
	padding: 2.2rem 0 2.5rem;
	margin: 0 0 5.0rem -2.1rem;
	background: #8C94A6;
}
.product .item_list .item_contents .box dl dt {
	font-size: 1.6rem;
	letter-spacing: 0.08em;
	line-height: 1.4;
	width: 26.8rem;
	padding: 0 0 1.1rem;
	margin: 0 auto;
	border-bottom: 0.1rem solid #fff;
}
.product .item_list .item_contents .box dl dd {
	display: flex;
	gap: 0 0.7rem;
	padding: 1.0rem 0 0 0.8rem;
}
.product .item_list .item_contents .box dl dd .img {
	flex: 0 0 9.1rem;
}
.product .item_list .item_contents .box dl dd .text_wrap p {
	font-size: 1.4rem;
	line-height: 1.5;
	letter-spacing: 0.08em;
	text-align: left;
	margin: 0 0 0.7rem;
}
.product .item_list .item_contents .box dl dd .text_wrap span {
	display: inline-block;
	color: #8C94A6;
	font-size: 1.2rem;
	line-height: 1.5;
	padding: 0.1rem 0.9rem;
	background: #fff;
}
.product .item_list .item_contents .price_wrap {
	display: flex;
	flex-wrap: wrap;
	text-align: left;
	margin: 0 0 3.6rem;
}
.product .item_list .item_contents.item_1 .price_wrap {
	gap: 0 0.6rem;
	padding: 0 1.5rem 0 1.3rem;
}
.product .item_list .item_contents.item_2 .price_wrap {
	gap: 0 0.3rem;
	padding: 0 1.2rem;
}
.product .item_list .item_contents .price_wrap .item_name {
	font-size: 1.7rem;
	line-height: 1.5;
}
.product .item_list .item_contents .price_wrap .wrap .capacity {
	display: inline-block;
	color: #fff;
	font-size: 1.0rem;
	line-height: 1.5;
	padding: 0 0.3rem;
	margin: 0 0 0.4rem;
	background: #DCADAD;
}
.product .item_list .item_contents .price_wrap .wrap .price {
	font-size: 1.4rem;
}
.product .item_list .item_contents .price_wrap .wrap .price .num {
	font-size: 3.4rem;
}
.product .item_list .item_contents .btn_wrap {
	margin: 0 0 2.8rem;
}
.product .item_list .item_contents .btn_wrap .btn {
	position: relative;
	width: 28.3rem;
	margin: 0 auto;
}
.product .item_list .item_contents .btn_wrap .btn .hukidashi {
	position: absolute;
	top: -1.3rem;
	left: 50%;
	color: var(--red);
	font-size: 1.2rem;
	line-height: 1.5;
	letter-spacing: 0.08em;
	width: 14.1rem;
	transform: translateX(-50%);
	background: #fff;
	border-radius: 6.0rem;
}
.product .item_list .item_contents .btn_wrap .btn .hukidashi::after {
	content: '';
	position: absolute;
	bottom: calc(max(-0.6rem) + 0.1rem);
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 1.0rem;
	height: 0.6rem;
	clip-path: polygon(100% 0, 0 0, 50% 100%);
	background: #fff;
}
.product .item_list .item_contents .btn_wrap .btn a {
	display: block;
	color: #fff;
	font-weight: bold;
	font-size: 1.6rem;
	line-height: 1.5;
	letter-spacing: 0.08em;
	padding: 1.3rem 0;
	background: var(--red);
	border-radius: 7.0rem;
	text-align: center;
}
.product .item_list .item_contents .btn_wrap .btn::before {
	content: '';
	position: absolute;
}
.product .item_list .item_contents.item_1 .btn_wrap .btn::before {
	top: -2.2rem;
	left: 2.1rem;
	width: 4.1rem;
	height: 8.6rem;
	background: url(../../images/hapr_cp16_1/btn_img_1.png) no-repeat center center/cover;
}
.product .item_list .item_contents.item_2 .btn_wrap .btn::before {
	top: -2.4rem;
	left: 2.9rem;
	width: 2.4rem;
	height: 8.7rem;
	background: url(../../images/hapr_cp16_1/btn_img_2.png) no-repeat center center/cover;
}
.product .item_list .item_contents.item_3 .btn_wrap .btn::before {
	top: -1.5rem;
	left: 0.2rem;
	width: 5.3rem;
	height: 7.1rem;
	background: url(../../images/hapr_cp16_1/btn_img_3.png) no-repeat center center/cover;
}
.product .item_list .item_contents .btn_wrap .note {
	font-size: 1.0rem;
	line-height: 1.5;
	letter-spacing: 0.08em;
	color: var(--txt-gray);
	text-align: right;
	padding-right: 2.6rem;
	margin-top: 0.6rem;
}
.product .item_list .item_contents .campaign .text {
	font-size: 1.2rem;
	line-height: 1.3;
	letter-spacing: 0.04em;
	margin: 0 0 0.3rem;
}
.product .item_list .item_contents .campaign .btn {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--red);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: 0.04em;
	width: 24.2rem;
	height: 4.4rem;
	padding: 0;
	margin: 0 auto;
	border: none;
	background: url(../../images/hapr_cp16_1/campaign_btn_frame.svg)no-repeat center/100% 100%;
	cursor: pointer;
}
.product .item_list .item_contents .box_2 {
	color: #fff;
	width: 34.0rem;
	padding: 2.5rem 2.0rem 2.8rem;
	margin: 0 0 5.0rem -2.1rem;
	background: #8C94A6;
	box-sizing: border-box;
}
.product .item_list .item_contents .box_2 .wrap {
	display: flex;
	justify-content: space-between;
	margin: 0 0 2.1rem;
}
.product .item_list .item_contents .box_2 .wrap dl {
	display: flex;
	flex-direction: column;
	position: relative;
	width: 14.5rem;
}
.product .item_list .item_contents .box_2 .wrap dl dt {
	color: #8C94A6;
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: 0.08em;
	padding: 1.0rem 0;
	background: #fff;
}
.product .item_list .item_contents .box_2 .wrap dl dt span {
	position: absolute;
	color: #fff;
	top: -3rem;
	left: 0;
	right: 0;
	font-size: 1.2rem;
	line-height: 1.2;
	width: 12rem;
	padding: 0.5rem 0;
	margin: 0 auto;
	background: var(--red);
	border-radius: 7rem;
}
.product .item_list .item_contents .box_2 .wrap dl dd {
	position: relative;
	flex: 1 1 auto;
	padding: 1.4rem 0 1.1rem;
	border: 0.1rem solid #fff;
	border-top: none;
}
.product .item_list .item_contents .box_2 .wrap dl dd::before,
.product .item_list .item_contents .box_2 .wrap dl dd::after {
	content: '';
	position: absolute;
	bottom: -0.2rem;
	width: 0.3rem;
	height: 0.3rem;
	background: #fff;
	border-radius: 50%;
}
.product .item_list .item_contents .box_2 .wrap dl dd::before {
	left: -0.2rem;
}
.product .item_list .item_contents .box_2 .wrap dl dd::after {
	right: -0.2rem;
}
.product .item_list .item_contents .box_2 .wrap dl dd .img {
	width: 7.8rem;
	margin: 0 auto 1.0rem;
}
.product .item_list .item_contents .box_2 .wrap dl dd .text {
	font-size: 1.2rem;
	line-height: 1.3;
	letter-spacing: 0.02em;
	padding: 0 0 0 0.4rem;
	text-align: left;
}
.product .item_list .item_contents .box_2 .wrap dl dd .text .small {
	font-size: 1.0rem;
	line-height: 1.3;
	letter-spacing: 0.02em;
}
.product .item_list .item_contents .box_2 .wrap dl dd .bg {
	display: block;
	color: #8C94A6;
	font-size: 1.0rem;
	line-height: 1.5;
	padding: 0.1rem;
	margin-top: 0.5rem;
	background: #fff;
}
.product .item_list .item_contents .box_2 .notes {
	text-align: left;
}
.product .item_list .item_contents .box_2 .notes li {
	font-size: 1.0rem;
	line-height: 1.15;
	letter-spacing: 0.08em;
	text-indent: -1em;
	padding-left: 1em;
}
.product .item_list .item_contents .box_2 .notes li + li {
	margin-top: 0.5rem;
}
.product .item_list .item_contents.item_3 .price_wrap .item_name {
	padding-left: 1.2rem;
}
.product .item_list .item_contents.item_3 .price_wrap .capacity {
	padding: 0 1.0rem;
	margin-left: 1.2rem;
}
.product .item_list .item_contents.item_3 .price_wrap .special {
	display: flex;
	align-items: center;
	gap: 0 0.4rem;
	padding: 0 2.0rem;
	margin-top: 1.0rem;
}
.product .item_list .item_contents.item_3 .price_wrap .special .text {
	font-size: 1.4rem;
}
.product .item_list .item_contents.item_3 .price_wrap .special .text .border {
	position: relative;
}
.product .item_list .item_contents.item_3 .price_wrap .special .text .border::after {
	content: '';
	position: absolute;
	top: 44%;
	left: 0;
	width: 100%;
	height: 0.1rem;
	background: var(--black);
	transform: rotate(10deg);
	transform-origin: center;
}
.product .item_list .item_contents.item_3 .price_wrap .special .text .num {
	font-size: 2.0rem;
}
.product .item_list .item_contents.item_3 .price_wrap .special .circle {
	flex: 0 0 4.5rem;
}
.product .item_list .item_contents.item_3 .price_wrap .price {
	text-align: center;
}
.product .item_list .item_contents.item_3 .btn_wrap .hukidashi {
	left: 52.5%;
	letter-spacing: 0.04em;
	width: 17.8rem;
}
.product .cleansing {
	position: relative;
	padding: 9.2rem 0 11.0rem;
	background: var(--deep-beige)
}
.product .cleansing::before {
	content: '';
	position: absolute;
	top: -0.1rem;
	left: 0;
	width: 100%;
	height: 3.5rem;
	background: url(../../images/hapr_cp16_1/bg_cleansing_top.jpg) no-repeat top center/ 100% auto;
}
.product .cleansing::after {
	content: '';
	position: absolute;
	bottom: -0.1rem;
	left: 0;
	width: 100%;
	height: 6.0rem;
	background: url(../../images/hapr_cp16_1/bg_cleansing_bottom.jpg) no-repeat bottom center/ 100% auto;
}
.product .cleansing .wrap {
	display: flex;
	flex-direction: row-reverse;
	gap: 0 4.8rem;
	padding: 0 4.2rem 0 0;
	margin: 0 0 5.9rem;
}
.product .cleansing .wrap .sec_ttl {
	flex: 0 0 5.9rem;
}
.product .cleansing .wrap .contents {
	padding: 4.5rem 0 0;
}
.product .cleansing .wrap .contents .img {
	margin: 0 0 1.9rem;
}
.product .cleansing .wrap .contents .text_wrap {
	position: relative;
	font-size: 1.4rem;
	line-height: 1.6;
	letter-spacing: 0.07em;
	text-align: left;
	padding: min(4vw,2vw) 0 1.8rem 3.9rem;
}
.product .cleansing .wrap .contents .text_wrap::before,
.product .cleansing .wrap .contents .text_wrap::after {
	background: var(--black);
}
.product .cleansing .wrap .contents .text_wrap::before {
	left: 1.8rem;
	bottom: 0;
}
.product .cleansing .wrap .contents .text_wrap::after {
	left: 1.9rem;
	top: 0;
	height: 100%;
	transform: translateX(0.050rem);
}
.product .cleansing .wrap .contents .text_wrap .text + .text {
	margin-top: 1.0rem;
}
.product .cleansing .wrap .contents .text_wrap .text .small {
	font-size: 1.0rem;
}
.product .cleansing .wrap .contents .text_wrap .note {
	color: var(--txt-gray);
	font-size: 1.0rem;
	line-height: 1.6;
	margin-top: 1.1rem;
}
.product .cleansing .item_list {
	padding: 0 2.0rem;
}
.product .cleansing .item_list .item_contents .not {
	position: absolute;
	top: -0.8rem;
	left: -0.8rem;
	color: #fff;
	font-size: 1.4rem;
	line-height: 1.2;
	letter-spacing: 0.08em;
	padding: 0.6rem 1.5rem;
	background: var(--line);
	z-index: 1;
}
.product .cleansing .item_list .item_contents .item_img {
	position: relative;
	padding: 3.5rem 0 2.8rem;
}
.product .cleansing .item_list .item_contents .item_img::after {
	content: '';
	position: absolute;
	right: 2.8rem;
	bottom: 0.4rem;
	width: 9.3rem;
	height: 9.3rem;
	background: url(../../images/hapr_cp16_1/cleansing_cream.png)no-repeat center/cover;
}
.product .cleansing .item_list .item_contents .notes {
	margin: 0 0 1.5rem;
}
.product .cleansing .item_list .item_contents .price_wrap {
	justify-content: center;
	margin: 0 0 2.6rem;
}
.product .cleansing .item_list .item_contents .price_wrap .price {
	font-size: 1.4rem;
	text-align: center;
}
.product .cleansing .item_list .item_contents .price_wrap .price .num {
	font-size: 3.4rem;
}
.product .cleansing .item_list .item_contents .btn_wrap {
	margin: 0;
}
.product .cleansing .item_list .item_contents .btn_wrap .btn::before {
	top: -2.4rem;
	left: 2.5rem;
	width: 3.3rem;
	height: 8.6rem;
	background: url(../../images/hapr_cp16_1/item_cleansing.png)no-repeat center/cover;
}
/* .skincare */
.skincare {
	position: relative;
	padding: 4.5rem 0 10.0rem;
	background: #9AA28F;
}
.skincare::after {
	content: '';
	position: absolute;
	bottom: -0.1rem;
	left: 0;
	width: 100%;
	height: 10.0rem;
	background: url(../../images/hapr_cp16_1/bg_skincare_bottom.jpg) no-repeat bottom center/ 100% auto;
}
.skincare .wrap {
	display: flex;
	gap: 0 3.5rem;
	padding-left: 2.7rem;
}
.skincare .wrap .sec_ttl {
	flex: 0 0 8.8rem;
}
.skincare .wrap .contents {
	flex: 0 1 22.5rem;
	margin: 0 0 4.8rem;
}
.skincare .wrap .contents .img {
	margin: 0 0 2.0rem;
}
.skincare .wrap .contents .text_wrap {
	color: #fff;
	text-align: left;
	padding: 0.3rem 2.7rem 1.7rem 0;
}
.skincare .wrap .contents .text_wrap::before,
.skincare .wrap .contents .text_wrap::after {
	background: #fff;
}
.skincare .wrap .contents .text_wrap::before {
	right: 1.7rem;
	bottom: 0;
}
.skincare .wrap .contents .text_wrap::after {
	top: 0;
	right: 1.9rem;
	height: 100%;
	transform: translateX(0.050rem);
}
.skincare .wrap .contents .text_wrap .text {
	font-size: 1.4rem;
	line-height: 1.6;
	letter-spacing: 0.02em;
}
.skincare .skincare_list {
	padding: 0 3.5rem;
}
.skincare .skincare_list li {
	position: relative;
	padding: 3.7rem 0;
	background: #fff;
}
.skincare .skincare_list li + li {
	margin-top: 4.0rem;
}
.skincare .skincare_list li .list_num {
	position: absolute;
	top: 0;
	left: 0;
	color: #9AA28F;
	font-size: 1.6rem;
	letter-spacing: 0.08em;
	line-height: 1.5;
	text-align: left;
	padding: 0.2rem 0 0 0.4rem;
	width: 4.9rem;
	height: 4.9rem;
	background: var(--deep-beige);
	clip-path: polygon(0 0, 0% 100%, 100% 0);
	box-sizing: border-box;
}
.skincare .skincare_list li .caption {
	font-size: 1.8rem;
	line-height: 1.5;
	letter-spacing: 0.08em;
}
.skincare .skincare_list li .caption .small {
	font-size: 1.0rem;
}
.skincare .skincare_list li.list_1 .caption {
	margin: 0 0 0.9rem;
}
.skincare .skincare_list li.list_2 .caption {
	font-feature-settings: "palt";
	margin: 0 0 1.9rem;
}
.skincare .skincare_list li.list_1 .img {
	margin: 0 0 1.4rem;
}
.skincare .skincare_list li.list_2 .img {
	margin: 0 0 1.3rem;
	padding: 0 2.0rem;
}
.skincare .skincare_list li.list_3 .img {
	margin: 0 0 2.1rem;
}
.skincare .skincare_list li .text_wrap {
	font-size: 1.2rem;
	line-height: 1.6;
	letter-spacing: 0.05em;
	text-align: left;
	padding: 0 2.0rem;
}
.skincare .skincare_list li .text_wrap .text + .text {
	margin-top: 1.1rem;
}
.skincare .skincare_list li .text_wrap .text .bg {
	background: var(--light-beige);
}
.skincare .skincare_list li .text_wrap .text .small {
	font-size: 1.0rem;
}
.skincare .skincare_list li .text_wrap .note {
	color: var(--txt-gray);
	font-size: 1.0rem;
	line-height: 1.6;
	letter-spacing: 0.05em;
	text-align: right;
	margin-top: 0.7rem;
}
.skincare .skincare_list li.list_1 dl {
	position: relative;
	padding: 2.1rem 0 2.0rem 0;
	margin: 1.7rem 2.0rem 0 1.9rem;
	background-image: url(../../images/hapr_cp16_1/line_circle_top.png), url(../../images/hapr_cp16_1/line_circle_bottom.png);
	background-position: top center, bottom center;
	background-repeat: no-repeat;
	background-size: 100% auto;
}
.skincare .skincare_list li.list_1 dl dt {
	color: #fff;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 1.4;
	letter-spacing: 0.05em;
	width: 19.5rem;
	padding: 0.3rem 0 0.2rem;
	margin: 0 0  1.2rem -2.9rem;
	background: var(--red);
}
.skincare .skincare_list li.list_1 dl dd {
	text-align: left;
}
.skincare .skincare_list li.list_1 dl dd .text {
	font-size: 1.2rem;
	line-height: 1.4;
}
.skincare .skincare_list li.list_1 dl dd .text + .text {
	margin-top: 0.4rem;
}
.skincare .skincare_list li.list_1 dl dd .text .small {
	font-size: 1.0rem;
}
.skincare .skincare_list li.list_1 dl dd .note {
	color: var(--txt-gray);
	font-size: 1.0rem;
	line-height: 1.6;
	letter-spacing: 0.05em;
	text-align: right;
	margin-top: 0.9rem;
}
.skincare .skincare_list li.list_1 dl dd .item_img {
	position: absolute;
	top: 2.1rem;
	right: 1.0rem;
	width: 5.2rem;
}
/* .support */
.support {
	padding: 4.7rem 0 5rem;
	background: var(--line);
}
.support .wrap {
	position: relative;
	padding: 0 2.6rem 0 0;
}
.support .wrap .sec_ttl {
	position: absolute;
	top: 0;
	right: 2.6rem;
	width: 6.5rem;
}
.support .wrap .contents {
	padding: 3rem 0 0;
}
.support .wrap .contents .img {
	width: 25.7rem;
	margin: 0 0 2rem;
}
.support .wrap .contents .text_wrap {
	color: #fff;
	padding: 1.6rem 0 0 5.5rem;
}
.support .wrap .contents .text_wrap::before,
.support .wrap .contents .text_wrap::after {
	background: #fff;
}
.support .wrap .contents .text_wrap::before {
	left: 3.3rem;
	bottom: 1.2rem;
}
.support .wrap .contents .text_wrap::after {
	top: 0;
	left: 3.4rem;
	height: 14.9rem;
	transform: translateX(0.05rem);
}
.support .wrap .contents .text_wrap .text {
	font-size: 1.4rem;
	line-height: 1.6;
	letter-spacing: 0.08em;
	text-align: left;
	margin: 0 0 2.8rem;
}
.support .wrap .contents .text_wrap .strong {
	font-size: 1.8rem;
	line-height: 1.6;
	letter-spacing: 0.08em;
}
/* .media */
.media .media_slider_area {
	color: #fff;
	padding: 10rem 0 8rem;
	background: url(../../images/hapr_cp16_1/bg_media.jpg)no-repeat center/100% 100%;
}
.media .head {
	font-size: 2.2rem;
	line-height: 1.6;
	letter-spacing: 0.02em;
	margin: 0 0 1.2rem;
}
.media .media_slider_area .swiper {
	width: 64.533%;
	padding: 0 0 3.5rem;
	margin: 0 auto;
}
.media .media_slider_area .swiper-slide dl + dl {
	margin-top: 1.5rem;
}
.media .media_slider_area .swiper-slide.slide_4 dl + dl {
	margin-top: 0.8rem;
}
.media .media_slider_area .swiper-slide dl dt {
	color: #8D99A1;
	font-size: 1.2rem;
	line-height: 1.6;
	letter-spacing: 0.02em;
	padding: 0.05rem 0;
	background: #fff;
}
.media .media_slider_area .swiper-slide dl dd {
	font-size: 1.4rem;
	line-height: 1.4;
	letter-spacing: 0.02em;
	border: 0.1rem solid #fff;
	border-top: none;
	box-sizing: border-box;
}
.media .media_slider_area .swiper-slide dl dd {
	padding: 0.3rem 0 0.2rem;
}
.media .media_slider_area .swiper-slide dl dd:has(br) {
	padding: 1rem 0 0.9rem;
}
.media .media_slider_area .swiper .swiper-scrollbar {
	left: 0;
	right: 0;
	bottom: 0.3rem;
	width: 49.586%;
	height: 0.1rem;
	margin: 0 auto;
	background: #C0C0C0;
	transform: translateY(0.05rem);
}
.media .media_slider_area .swiper .swiper-scrollbar .swiper-scrollbar-drag {
	opacity: 1;
	background: #fff;
}
.media .media_slider_area .swiper .swiper-button-prev,
.media .media_slider_area .swiper .swiper-button-next {
	top: initial;
	bottom: 0;
	width: 1rem;
	height: 0.6rem;
}
.media .media_slider_area .swiper .swiper-button-prev::after,
.media .media_slider_area .swiper .swiper-button-next::after {
	content: '';
}
.media .media_slider_area .swiper .swiper-button-prev {
	left: 3.1rem;
	background: url(../../images/hapr_cp16_1/icon_left.svg)no-repeat center/contain;
}
.media .media_slider_area .swiper .swiper-button-next {
	right: 3.1rem;
	background: url(../../images/hapr_cp16_1/icon_right.svg)no-repeat center/contain;
}
.media .insta {
	padding: 7.1rem 0 0;
	background: var(--light-beige);
}
/* .voice  */
.voice .contens_1 {
	padding: 6.4rem 3.5rem 8rem;
	background: var(--light-beige);
}
.voice .contens_1 .caption {
	color: var(--line);
	font-size: 2.2rem;
	line-height: 1.5;
	letter-spacing: 0.1em;
	margin: 0 0 2.5rem;
}
.voice .contens_1 .caption .small,
.voice .contens_2 .caption .small {
	font-size: 1rem;
}
.voice .contens_1 .list li + li {
	margin-top: 3rem;
}
.voice .contens_1 .note {
	color: var(--txt-gray);
	font-size: 1rem;
	line-height: 1.15;
	letter-spacing: 0.05em;
	padding-left: 2.1em;
	text-indent: -2.1em;
	text-align: left;
	width: 19rem;
	margin: 1.6rem 0 0 auto;
	box-sizing: border-box;
}
.voice .contens_2 {
	padding: 11.3rem 2rem 10.2rem;
	background: url(../../images/hapr_cp16_1/bg_voice.jpg)no-repeat center/100% 100%;
}
.voice .contens_2 .caption {
	color: #868686;
	font-size: 2.2rem;
	line-height: 1.5;
	margin: 0 0 2.3rem;
}
.voice .contens_2 .list li + li {
	margin-top: 2rem;
}
.voice .contens_2 .list li:nth-child(odd) {
	text-align: right;
}
.voice .contens_2 .list li:nth-child(even) {
	text-align: left;
}
.voice .contens_2 .list li span {
	display: inline-block;
	font-size: 1.2rem;
	line-height: 1.5;
	letter-spacing: 0.05em;
	text-align: left;
	padding: 1rem;
	background: #fff;
}
.voice .contens_2 .note {
	color: var(--txt-gray);
	font-size: 1rem;
	line-height: 1.15;
	letter-spacing: 0.05em;
	padding-left: 2.1em;
	text-indent: -2.1em;
	text-align: left;
	margin: 1.5rem 0 0;
}
/* .product.bottom  */
.product.bottom {
	position: relative;
	padding: 5.8rem 0 8.2rem;
}
.product.bottom::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 8.4rem;
	background: url(../../images/hapr_cp16_1/bg_product_bottom.jpg)no-repeat bottom center/contain;
}
.product.bottom .item_contents .text_wrap .capacity {
	margin: 0 0 0.2rem;
}
.product.bottom .item_contents .text_wrap .capacity + .price {
	font-size: 1.4rem;
	line-height: 1.5;
	letter-spacing: 0.03em;
}
.product.bottom .item_contents .text_wrap .capacity + .price .num {
	font-size: 3.4rem;
}
.product.bottom .item_list .item_contents .box {
	margin-bottom: 6.5rem;
}
.product.bottom .item_list .item_contents.item_2 .box {
	margin-top: 3.3rem;
}
.product.bottom .item_list .item_contents.item_3 .text_wrap .price_wrap {
	margin-bottom: 4.9rem;
}
.product.bottom .item_list .item_contents.item_3 .text_wrap .price_wrap .special .text {
	font-size: 1.2rem;
	padding-left: 0;
}
.product.bottom .item_list .item_contents .box_2 {
	margin-bottom: 7.5rem;
}
/* .faq */
.faq {
	position: relative;
	padding: 6.6rem 0 7rem;
	background: var(--deep-beige);
}
.faq .in {
	padding: 0 2rem;
}
.faq .sec_ttl {
	width: 4.7rem;
	margin: 0 auto 3.6rem;
}
.faq .faq_list .q {
	text-align: left;
	border-top: 0.1rem solid #D6D6D6;
}
.faq .faq_list .q:last-child {
	border-bottom: 0.1rem solid #D6D6D6;
}
.faq .faq_list .q > dt {
	position: relative;
	font-size: 1.6rem;
	line-height: 1.5;
	padding: 1.5rem 0 1.5rem 1rem;
	cursor: pointer;
}
.faq .faq_list .q > dt::before,
.faq .faq_list .q > dt::after {
	content: '';
	position: absolute;
	background: var(--black);
}
.faq .faq_list .q > dt::before {
	top: 1.6em;
	right: 1rem;
	width: 1rem;
	height: 0.1rem;
}
.faq .faq_list .q > dt::after {
	top: 1.3em;
	right: 1.4rem;
	width: 0.1rem;
	height: 1rem;
	transform: translateX(-0.05rem);
}
.faq .faq_list .q > dt.active::after {
	content: none;
}
.faq .faq_list .q > dt span {
	position: relative;
	display: block;
	letter-spacing: 0.05em;
	padding: 0 3.8rem 0 1.9rem;
}
.faq .faq_list .q > dt span::before {
	content: '';
	position: absolute;
	top: 0.32em;
	left: 0;
	width: 1.2rem;
	height: 1.4rem;
	background: url(../../images/hapr_cp16_1/icon_q.svg)no-repeat center/contain;
}
.faq .faq_list .q > dd {
	display: none;
	font-size: 1.4rem;
	line-height: 1.5;
	letter-spacing: 0.05em;
	padding: 0 0 2rem;
}
.faq .faq_list .q > dd .small,
.faq .faq_list .q > dd .note {
	font-size: 1rem;
}
.faq .faq_list .q > dd .note {
	display: block;
	color: var(--txt-gray);
}
.faq .faq_list .q > dd p + p {
	margin-top: 0.6rem;
}
.faq .faq_list .q > dd dl + dl {
	margin-top: 0.8rem;
}
.pagetop {
	position: absolute;
	right: 2rem;
	bottom: 1.6rem;
	width: 2.1rem;
}
/* .footer */
.footer {
	position: relative;
	color: #fff;
	padding: 3rem 0 7rem;
	background: var(--line);
}
.footer .logo {
	position: absolute;
	top: 3rem;
	right: 3.6rem;
	width: 5.2rem;
}
.footer .link {
	padding-left: 3.4rem;
	margin: 0 0 3.6rem;
}
.footer .link li {
	font-size: 1.4rem;
	line-height: 1.5;
	text-align: left;
}
.footer .link li a {
	display: inline-block;
}
.footer .copyright {
	font-size: 1rem;
	line-height: 1.5;
}
/* .fixed_btn */
.fixed_btn {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 1rem;
	margin: 0 auto;
	z-index: 1;
}
.fixed_btn a {
	position: relative;
	display: block;
	color: #fff;
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.5;
	letter-spacing: 0.08em;
	width: 75.46%;
	padding: 1.3rem 0;
	margin: 0 auto;
	background: var(--red);
	border-radius: 9rem;
}
.fixed_btn a::before {
	content: '';
	position: absolute;
	top: -0.7rem;
	left: 2.3rem;
	width: 4.1rem;
	height: 5.4rem;
	background: url(../../images/hapr_cp16_1/btn_fixed_item.png)no-repeat center/contain;
}
/* .modal_wrap */
.modal_shadow {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(83, 81, 81, 0.7);
	z-index: 3;
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s, visibility .3s;
}
.modal_shadow.show,
.modal_contents_wrap.show {
	opacity: 1;
	visibility: visible;
}
.modal_contents_wrap {
	position: fixed;
	top: 0;
	width: 100%;
	height: 100%;
	margin: 0 auto;
	padding: 3.2rem 1rem 2.8rem;
	box-sizing: border-box;
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s, visibility .3s;
	z-index: 5;
}
.modal_contents_wrap .in {
	position: relative;
	height: 100%;	
	overflow: auto;
	box-sizing: border-box;
	scrollbar-width: none;         /* Firefox用 */
	-ms-overflow-style: none;      /* IE10+用 */
}
.modal_contents_wrap .in > .contents_wrap {
	background: var(--light-beige);
}
.modal_contents_wrap .in::-webkit-scrollbar {
	display: none;
}
.modal_contents_wrap .close {
	position: absolute;
	top: 0.9rem;
	right: 1.2rem;
	width: 2rem;
	cursor: pointer;
}
.modal_contents_wrap .contents_head {
	padding: 2rem 0 1.6rem;
	background: var(--red);
}
.modal_contents_wrap .contents_head span {
	display: block;
	color: var(--red);
	font-size: 1.6rem;
	line-height: 1.5;
	letter-spacing: 0.05em;
	width: 26.7rem;
	margin: 0 auto 0.7rem;
	background: var(--light-beige);
	border-radius: 7rem;
}
.modal_contents_wrap .contents_head p {
	color: #fff;
	font-size: 1.4rem;
	line-height: 1.4;
	letter-spacing: 0.05em;
}
.modal_contents_wrap .contents {
	padding: 0 0 6.9rem;
}
.modal_contents_wrap .contents .ttl {
	text-align: center;
	padding-top: 1.2rem;
	margin: 0 0 2.7rem;
}
.modal_contents_wrap .contents .ttl .block {
	display: block;
	color: var(--line);
	font-size: 2.2rem;
	font-weight: bold;
	letter-spacing: 0.1em;
	line-height: 1.7;
}
.modal_contents_wrap .contents .ttl .ruby {
	position: relative;
}
.modal_contents_wrap .contents .ttl .ruby::before {
	content: 'ハップアール';
	position: absolute;
	top: -1.1em;
	left: 0;
	right: 0;
	margin: 0 auto;
	font-size: 1.2rem;
	text-align: center;
}
.modal_contents_wrap .contents .ttl .sub {
	display: inline-block;
	color: #fff;
	font-size: 1.2rem;
	line-height: 1.7;
	letter-spacing: 0.06em;
	background: var(--red);
	padding: 0 0.4rem;
}
.modal_contents_wrap .contents .head_text_wrap {
	text-align: left;
	padding: 0 0 0 2.4rem;
	margin: 0 0 4rem;
}
.modal_contents_wrap .contents .head_text_wrap .text {
	font-size: 1.4rem;
	line-height: 1.5;
	letter-spacing: 0.04em;
}
.modal_contents_wrap .contents .head_text_wrap .text .small {
	font-size: 1rem;
}
.modal_contents_wrap .contents .campaign_term,
.modal_contents_wrap .contents .campaign_contents,
.modal_contents_wrap .contents .campaign_amazon,
.modal_contents_wrap .contents .disclaimer {
	padding: 0 2.3rem 0 2.4rem;
}
.modal_contents_wrap .contents .campaign_term > dt,
.modal_contents_wrap .contents .campaign_contents > dt,
.modal_contents_wrap .contents .campaign_amazon > dt,
.modal_contents_wrap .contents .disclaimer > dt {
	font-size: 1.8rem;
	line-height: 1.5;
	letter-spacing: 0.03em;
	text-align: left;
	padding: 0 0 0.5rem;
	border-bottom: 0.1rem solid var(--txt-gray);
}
.modal_contents_wrap .contents .campaign_term {
	margin: 0 0 4.2rem;
}
.modal_contents_wrap .contents .campaign_term dt {
	margin: 0 0 0.7rem;
}
.modal_contents_wrap .contents .campaign_term dd {
	font-size: 1.4rem;
	line-height: 1.5;
	letter-spacing: 0.05em;
	text-align: left;
}
.modal_contents_wrap .contents .campaign_contents > dt {
	margin: 0 0 2.4rem;
}
.modal_contents_wrap .contents .campaign_contents .campaign_num_contents {
	position: relative;
	background: var(--deep-beige);
}
.modal_contents_wrap .contents .campaign_contents .campaign_num_contents .campaign_num {
	position: absolute;
	top: -0.4rem;
	left: -0.4rem;
	color: #fff;
	font-size: 1.4rem;
	line-height: 1.5;
	letter-spacing: 0.05em;
	width: 11.6rem;
	padding: 0.2rem 0 0.1rem;
	background: var(--line);
}
.modal_contents_wrap .contents .campaign_contents .campaign_num_contents .text {
	font-size: 1.4rem;
	line-height: 1.4;
	letter-spacing: 0.02em;
	text-align: left;
}
.modal_contents_wrap .contents .campaign_contents .campaign_num_contents .text .note {
	display: block;
	color: var(--txt-gray);
	font-size: 1rem;
	line-height: 1.5;
	letter-spacing: 0.05em;
	margin-top: 0.3rem;
}
.modal_contents_wrap .contents .campaign_contents .campaign_num_contents .img {
	position: absolute;
}
.modal_contents_wrap .contents .campaign_contents .campaign_num_contents.num_1 {
	padding: 3.8rem 0 1.7rem 0.9rem;
	margin: 0 0 2.3rem;
}
.modal_contents_wrap .contents .campaign_contents .campaign_num_contents.num_1 .img {
	top: 1.1rem;
	right: 1.9rem;
	width: 7.9rem;
}
.modal_contents_wrap .contents .campaign_contents .campaign_num_contents.num_2 {
	padding: 3.8rem 0 1.8rem 0.9rem;
	margin: 0 0 3.1rem;
}
.modal_contents_wrap .contents .campaign_contents .campaign_num_contents.num_2 .img {
	right: 1.1rem;
	bottom: 1.4rem;
	width: 9.8rem;
}
.modal_contents_wrap .contents .campaign_contents .product.modal {
	padding: 0;
}
.modal_contents_wrap .contents .campaign_contents .product.modal .price {
	font-size: 1.4rem;
	line-height: 1.5;
	letter-spacing: 0.03em;
}
.modal_contents_wrap .contents .campaign_contents .product.modal .item_contents {
	padding: 0 0 3.9rem;
}
.modal_contents_wrap .contents .campaign_contents .product.modal .item_contents .capacity {
	margin: 0 0 0.2rem;
}
.modal_contents_wrap .contents .campaign_contents .product.modal .item_contents .price .num {
	font-size: 2.6rem;
}
.modal_contents_wrap .contents .campaign_contents .product.modal .item_contents.item_1 .notes {
	text-align: center;
	padding: 0;
	margin: 0.7rem 0 0;
}
.modal_contents_wrap .contents .campaign_contents .product.modal .item_contents.item_2 .notes {
	padding: 0 0.5rem;
	margin: 1rem 0 0;
}
.modal_contents_wrap .contents .campaign_contents .product.modal .item_contents.item_2 .notes li {
	padding-left: 1.1em;
	text-indent: -1.1em;
}
.modal_contents_wrap .contents .campaign_contents .product.modal .item_contents.item_2 .notes li + li {
	margin-top: 0.5rem;
}
.modal_contents_wrap .contents .campaign_contents .product.modal .item_contents.item_3 .price_wrap {
	justify-content: center;
	margin: 0;
}
.modal_contents_wrap .contents .campaign_contents .product.modal .item_contents.item_3 .price_wrap .special,
.modal_contents_wrap .contents .campaign_contents .product.modal .item_contents.item_3 .price_wrap .special .text {
	padding: 0;
}
.modal_contents_wrap .contents .campaign_contents .product.modal .item_contents.item_3 .price_wrap .special .text {
	font-feature-settings: 'palt';
}
.modal_contents_wrap .contents .campaign_contents .campaign_num_contents.num_3 {
	padding: 3.7rem 0 1.8rem 0.9rem;
	margin: 4.5rem 0 3.2rem;
}
.modal_contents_wrap .contents .campaign_contents .campaign_num_contents.num_3 .text .small {
	font-size: 1.2rem;
}
.modal_contents_wrap .contents .campaign_contents .campaign_num_contents.num_3 .img {
	right: 2.1rem;
	bottom: 2.4rem;
	width: 7.4rem;
}
.modal_contents_wrap .contents .campaign_amazon {
	margin: 4.6rem 0 0;
}
.modal_contents_wrap .contents .campaign_amazon > dt {
	margin: 0 0 0.8rem;
}
.modal_contents_wrap .contents .campaign_amazon dt .small {
	font-size: 1.2rem;
	font-feature-settings: 'palt';
}
.modal_contents_wrap .contents .campaign_amazon dd,
.modal_contents_wrap .contents .disclaimer dd {
	font-size: 1.4rem;
	line-height: 1.3;
	letter-spacing: 0.04em;
	text-align: left;
}
.modal_contents_wrap .contents .campaign_amazon dd ul li,
.modal_contents_wrap .contents .disclaimer dd ul li {
	padding-left: 1em;
	text-indent: -1em;
}
.modal_contents_wrap .contents .campaign_amazon dd ul li + li,
.modal_contents_wrap .contents .disclaimer dd ul li + li {
	margin-top: 0.5rem;
}
.modal_contents_wrap .contents .campaign_amazon dd .other > dt {
	margin: 2.2rem 0 0.4em;
}
.modal_contents_wrap .contents .disclaimer {
	margin: 4.2rem 0 6.2rem;
}
.modal_contents_wrap .contents .disclaimer > dt {
	margin: 0 0 1rem;
}
.modal_contents_wrap .contents .disclaimer dd dl {
	line-height: 1.5;
	letter-spacing: 0.05em;
}
.modal_contents_wrap .contents .disclaimer dd dl + dl {
	margin-top: 1rem;
}
.modal_contents_wrap .contents .btn_wrap .btn {
	position: relative;
	width: 80%;
	margin: 0 auto;
}
.modal_contents_wrap .contents .btn_wrap .btn .hukidashi {
	position: absolute;
	top: -1.3rem;
	left: 50%;
	color: var(--line);
	font-size: 1.2rem;
	line-height: 1.5;
	letter-spacing: 0.08em;
	padding: 0.1rem 0;
	width: 16.1rem;
	transform: translateX(-50%);
	background: #fff;
	border-radius: 6.0rem;
}
.modal_contents_wrap .contents .btn_wrap .btn .hukidashi::after {
	content: '';
	position: absolute;
	bottom: calc(max(-0.6rem) + 0.1rem);
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 1.0rem;
	height: 0.6rem;
	clip-path: polygon(100% 0, 0 0, 50% 100%);
	background: #fff;
}
.modal_contents_wrap .contents .btn_wrap .btn a {
	display: block;
	color: #fff;
	font-weight: bold;
	font-size: 1.6rem;
	line-height: 1.5;
	letter-spacing: 0.08em;
	padding: 1.3rem 0;
	background: var(--line);
	border-radius: 7.0rem;
	text-align: center;
}
/***************************************************
 * Generated by SVG Artista on 6/27/2025, 12:51:07 PM
 * MIT license (https://opensource.org/licenses/MIT)
 * W. https://svgartista.net
 **************************************************/
.svg-elem-1 {
  fill: transparent;
  -webkit-transition: fill 0.5s cubic-bezier(0.47, 0, 0.745, 0.715) 0.1s;
          transition: fill 0.5s cubic-bezier(0.47, 0, 0.745, 0.715) 0.1s;
}
svg.active .svg-elem-1 {
  fill: rgb(130, 115, 100);
}
.svg-elem-2 {
  fill: transparent;
  -webkit-transition: fill 0.5s cubic-bezier(0.47, 0, 0.745, 0.715) 0.2s;
          transition: fill 0.5s cubic-bezier(0.47, 0, 0.745, 0.715) 0.2s;
}
svg.active .svg-elem-2 {
  fill: rgb(130, 115, 100);
}
.svg-elem-3 {
  fill: transparent;
  -webkit-transition: fill 0.5s cubic-bezier(0.47, 0, 0.745, 0.715) 0.3s;
          transition: fill 0.5s cubic-bezier(0.47, 0, 0.745, 0.715) 0.3s;
}
svg.active .svg-elem-3 {
  fill: rgb(130, 115, 100);
}
.svg-elem-4 {
  fill: transparent;
  -webkit-transition: fill 0.5s cubic-bezier(0.47, 0, 0.745, 0.715) 0.4s;
          transition: fill 0.5s cubic-bezier(0.47, 0, 0.745, 0.715) 0.4s;
}
.active .svg-elem-4 {
  fill: rgb(130, 115, 100);
}
/* 吸着図アニメーション ここから */
.apaani {
  position: relative;
  overflow: hidden;
}
.apaani img {
  width: 100%;
}
.apaani__el {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.apaani__bg {
  position: relative;
  height: auto;
}
.apaani__test {
  opacity: 0;/* 0  */
}
.apaani__txt {
  overflow: hidden;
  height: 0;
  -webkit-transition: height 2s linear;
  transition: height 2s linear;
}
.apaani__txt1 {
  -webkit-transition-delay: 0s;
          transition-delay: 0s;
}
.apaani__txt2 {
  -webkit-transition-delay: 2.5s;
          transition-delay: 2.5s;
}
.apaani__txt4 {
  -webkit-transition-delay: 3.0s;
          transition-delay: 3.0s;
}
.apaani__txt3 {
  -webkit-transition-delay: 3.0s;
          transition-delay: 3.0s;
}
.apaani__txt img {
  position: absolute;
  left: 0;
  top: 0;
}
.apaani.is-run .apaani__txt {
  height: 100%;
}
.apaani.is-run-end .apaani__txt {
  height: 0;
  -webkit-transition: none;
  transition: none;
}
.apaani__old {
  height: auto;
  -webkit-transition: left 1s, top 1s;
  transition: left 1s, top 1s;
}
.apaani__old img {
  display: block;
  -webkit-transform-origin: center center;
          transform-origin: center center;
  -webkit-transition: -webkit-transform 1s;
  transition: -webkit-transform 1s;
  transition: transform 1s;
  transition: transform 1s, -webkit-transform 1s;
}
.apaani__old1 {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}
.apaani__old1 img {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}
.apaani__old2 {
  -webkit-transition-delay: 0.8s;
          transition-delay: 0.8s;
}
.apaani__old2 img {
  -webkit-transition-delay: 0.8s;
          transition-delay: 0.8s;
}
.apaani__old3 {
  -webkit-transition-delay: 0.9s;
          transition-delay: 0.9s;
}
.apaani__old3 img {
  -webkit-transition-delay: 0.9s;
          transition-delay: 0.9s;
}
.apaani__old4 {
  -webkit-transition-delay: 1.2s;
          transition-delay: 1.2s;
}
.apaani__old4 img {
  -webkit-transition-delay: 1.2s;
          transition-delay: 1.2s;
}
.apaani__old5 {
  -webkit-transition-delay: 1.3s;
          transition-delay: 1.3s;
}
.apaani__old5 img {
  -webkit-transition-delay: 1.3s;
          transition-delay: 1.3s;
}
.apaani__old6 {
  -webkit-transition-delay: 1.5s;
          transition-delay: 1.5s;
}
.apaani__old6 img {
  -webkit-transition-delay: 1.5s;
          transition-delay: 1.5s;
}
.apaani__old7 {
  -webkit-transition-delay: 1.6s;
          transition-delay: 1.6s;
}
.apaani__old7 img {
  -webkit-transition-delay: 1.6s;
          transition-delay: 1.6s;
}
.apaani__old8 {
  -webkit-transition-delay: 1.8s;
          transition-delay: 1.8s;
}
.apaani__old8 img {
  -webkit-transition-delay: 1.8s;
          transition-delay: 1.8s;
}
.apaani__old1 {
  left: 11.5%;
  top: 60.5%;
}
.apaani__old1 img {
  -webkit-transform: translate(-50%, -50%) rotate(4deg);
          transform: translate(-50%, -50%) rotate(4deg);
}
.apaani__old2 {
  left: 48%;
  top: 63.5%;
}
.apaani__old2 img {
  -webkit-transform: translate(-50%, -50%) rotate(5deg);
          transform: translate(-50%, -50%) rotate(5deg);
}
.apaani__old3 {
  left: 64%;
  top: 64%;
}
.apaani__old3 img {
  -webkit-transform: translate(-50%, -50%) rotate(190deg);
          transform: translate(-50%, -50%) rotate(190deg);
}
.apaani__old4 {
  left: 75%;
  top: 61%;
}
.apaani__old4 img {
  -webkit-transform: translate(-50%, -50%) rotate(2deg);
          transform: translate(-50%, -50%) rotate(2deg);
}
.apaani__old5 {
  left: 24%;
  top: 60.5%;
}
.apaani__old5 img {
  -webkit-transform: translate(-50%, -50%) rotate(0deg);
          transform: translate(-50%, -50%) rotate(0deg);
}
.apaani__old6 {
  left: 58.3%;
  top: 59.3%;
}
.apaani__old6 img {
  -webkit-transform: translate(-50%, -50%) rotate(-6deg);
          transform: translate(-50%, -50%) rotate(-6deg);
}
.apaani__old7 {
  left: 39%;
  top: 60.5%;
}
.apaani__old7 img {
  -webkit-transform: translate(-50%, -50%) rotate(0deg);
          transform: translate(-50%, -50%) rotate(0deg);
}
.apaani__old8 {
  left: 81%;
  top: 59.5%;
}
.apaani__old8 img {
  -webkit-transform: translate(-50%, -50%) rotate(0deg);
          transform: translate(-50%, -50%) rotate(0deg);
}
.apaani.is-run .apaani__old1 {
  left: 14.5%;
  top: 29%;
}
.apaani.is-run .apaani__old1 img {
  -webkit-transform: translate(-50%, -50%) rotate(50deg);
          transform: translate(-50%, -50%) rotate(50deg);
}
.apaani.is-run .apaani__old2 {
  left: 50.5%;
  top: 23%;
}
.apaani.is-run .apaani__old2 img {
  -webkit-transform: translate(-50%, -50%) rotate(70deg);
          transform: translate(-50%, -50%) rotate(70deg);
}
.apaani.is-run .apaani__old3 {
  left: 61.5%;
  top: 30%;
}
.apaani.is-run .apaani__old3 img {
  -webkit-transform: translate(-50%, -50%) rotate(163deg);
          transform: translate(-50%, -50%) rotate(163deg);
}
.apaani.is-run .apaani__old4 {
  left: 65.5%;
  top: 15%;
}
.apaani.is-run .apaani__old4 img {
  -webkit-transform: translate(-50%, -50%) rotate(-116deg);
          transform: translate(-50%, -50%) rotate(-116deg);
}
.apaani.is-run .apaani__old5 {
  left: 23.5%;
  top: 31.5%;
}
.apaani.is-run .apaani__old5 img {
  -webkit-transform: translate(-50%, -50%) rotate(0deg);
          transform: translate(-50%, -50%) rotate(0deg);
}
.apaani.is-run .apaani__old6 {
  left: 58%;
  top: 28.5%;
}
.apaani.is-run .apaani__old6 img {
  -webkit-transform: translate(-50%, -50%) rotate(0deg);
          transform: translate(-50%, -50%) rotate(0deg);
}
.apaani.is-run .apaani__old7 {
  left: 30%;
  top: 25.5%;
}
.apaani.is-run .apaani__old7 img {
  -webkit-transform: translate(-50%, -50%) rotate(-81deg);
          transform: translate(-50%, -50%) rotate(-81deg);
}
.apaani.is-run .apaani__old8 {
  left: 65%;
  top: 25%;
}
.apaani.is-run .apaani__old8 img {
  -webkit-transform: translate(-50%, -50%) rotate(-49deg);
          transform: translate(-50%, -50%) rotate(-49deg);
}
.apaani.is-run-end .apaani__old {
  -webkit-transition: none;
  transition: none;
}
.apaani.is-run-end .apaani__old img {
  -webkit-transition: none;
  transition: none;
}
.apaani.is-run-end .apaani__old1 {
  left: 11.5%;
  top: 60.5%;
}
.apaani.is-run-end .apaani__old1 img {
  -webkit-transform: translate(-50%, -50%) rotate(4deg);
          transform: translate(-50%, -50%) rotate(4deg);
}
.apaani.is-run-end .apaani__old2 {
  left: 48%;
  top: 63.5%;
}
.apaani.is-run-end .apaani__old2 img {
  -webkit-transform: translate(-50%, -50%) rotate(5deg);
          transform: translate(-50%, -50%) rotate(5deg);
}
.apaani.is-run-end .apaani__old3 {
  left: 64%;
  top: 64%;
}
.apaani.is-run-end .apaani__old3 img {
  -webkit-transform: translate(-50%, -50%) rotate(190deg);
          transform: translate(-50%, -50%) rotate(190deg);
}
.apaani.is-run-end .apaani__old4 {
  left: 75%;
  top: 61%;
}
.apaani.is-run-end .apaani__old4 img {
  -webkit-transform: translate(-50%, -50%) rotate(2deg);
          transform: translate(-50%, -50%) rotate(2deg);
}
.apaani.is-run-end .apaani__old5 {
  left: 24%;
  top: 60.5%;
}
.apaani.is-run-end .apaani__old5 img {
  -webkit-transform: translate(-50%, -50%) rotate(0deg);
          transform: translate(-50%, -50%) rotate(0deg);
}
.apaani.is-run-end .apaani__old6 {
  left: 58.3%;
  top: 59.3%;
}
.apaani.is-run-end .apaani__old6 img {
  -webkit-transform: translate(-50%, -50%) rotate(-6deg);
          transform: translate(-50%, -50%) rotate(-6deg);
}
.apaani.is-run-end .apaani__old7 {
  left: 39%;
  top: 60.5%;
}
.apaani.is-run-end .apaani__old7 img {
  -webkit-transform: translate(-50%, -50%) rotate(0deg);
          transform: translate(-50%, -50%) rotate(0deg);
}
.apaani.is-run-end .apaani__old8 {
  left: 81%;
  top: 59.5%;
}
.apaani.is-run-end .apaani__old8 img {
  -webkit-transform: translate(-50%, -50%) rotate(0deg);
          transform: translate(-50%, -50%) rotate(0deg);
}
/* 吸着図アニメーション ここまで */