@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"], button {
	appearance: none;
	cursor: pointer;
}

/* =Styles 
-------------------------------------------------------------- */
body {
	font-family: YuGothic, -apple-system, BlinkMacSystemFont, 'Yu Gothic Medium', 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	color: var(--black);
	background: #fff;
	max-width: 750px;
	margin: 0 auto;
}
.serif {
	font-family: 'Yu Mincho', 'Hiragino Mincho ProN', YuMincho, serif;
}

.jost {
	font-family: "Jost", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-style: normal;
}
a {
	text-decoration: none;
	color: #000;
}
.inner {
	padding: 0 min(4.6667vw, 35px);
}
:root {
	--black: #46454a;
    --gray: #6a6974;
	--gray2: #828187;
    --lightgray: #aaa9b2;
	--pink: #ea7684;
	--pink2: #d19595;
	
}

/*-----------------------------------
common
-----------------------------------*/
/* フェードイン(初期値) */
.js-fadeUp {
  opacity: 0; /* 最初は非表示 */
  transform: translateY(30px); /* 下に30pxの位置から */
  transition: opacity .8s, transform .8s; /* 透過率と縦方向の移動を0.8秒 */
}
/* フェードイン(スクロールした後) */
.js-fadeUp.is-inview {
  opacity: 1; /* 表示領域に入ったら表示 */
  transform: translateY(0); /* 30px上に移動する */
  transition-delay: .5s; /* フェード開始を0.5秒遅らせる */
}
.sup {
	display: inline-block;
	font-size: min(2.1333vw, 16px);
	font-weight: 500;
	color: var(--lightgray);
	vertical-align: top;
}
ul.notes li {
	text-align: left;
	text-indent: -1em;
	padding-left: 1em;
	font-size: min(2.6667vw, 20px);
	line-height: 1.2;
	color: var(--lightgray);
}
.sec_in {
	padding: 0 min(4vw, 30px);
}
.bdr_txt {
	position: relative;
}
.bdr_txt::after {
	content: "";
	background: var(--black);
	width: 2px;
	height: min(11.3333vw, 85px);
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	transform: scale(1,0); /* 線のY軸の長さを0 */
	transition: transform 1.5s ease 0.3s;
	transform-origin: left top; /* 要素の座標の原点を設定*/	
}
.bdr_txt.is-active::after{
	transform: scale(1,1); /* 線のx軸の長さを1 */
}
.bdr_txt.v2::after {
	bottom: auto;
	top: 0;
}

/*-----------------------------------
.fix_bnr
-----------------------------------*/
.fix_bnr {
	display: none;
	position: fixed;
	z-index: 100;
    background: rgba(255,255,255,0.7);
	bottom: 0;
	left: 0;
	width: 100%;
}
.fix_bnr .bnr_in {
	width: min(100vw, 750px);
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	padding: min(3.0667vw, 23px) min(4vw, 30px) min(2vw, 15px);
	position: relative;
	box-sizing: border-box;
}
.fix_bnr .bnr_in::before {
	content: "";
	background: #dbafc4;
	width: calc(100% - min(6.4vw, 48px));
	height: min(0.2667vw, 2px);
	position: absolute;
	top: 0;
	left: 0;
}
.fix_bnr .bnr_in .close_btn {
	background: rgba(255,255,255,0.7) url("img/btn_close.png") no-repeat center center / min(2.6667vw, 20px) auto;
	width: min(6.4vw, 48px);
	height: min(6.4vw, 48px);
	position: absolute;
	top: max(-6.4vw, -48px);
	right: 0;
	border-top: min(0.2667vw, 2px) solid #dbafc4;
	border-left: min(0.2667vw, 2px) solid #dbafc4;
}
.fix_bnr .bnr_in .item_box p {
	text-align: center;
	color: var(--gray2);
	font-size: min(2.8vw, 21px);
	font-weight: 700;
	position: relative;
	margin: 0 0 max(-4.2666vw, -32px);
	white-space: nowrap;
	text-align: left;
	line-height: 1.5;
}
.fix_bnr .bnr_in .item_box p .sup {
	font-size: min(1.333vw, 10px);
}
.fix_bnr .bnr_in .item_box .img_box {
	width: min(36.9333vw, 277px);
	margin: 0 auto;
}
.fix_bnr .bnr_in .txt_box .price_wrap {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0 min(0.666vw, 5px);
	margin: 0 0 min(1.6vw, 12px);
}
.fix_bnr .bnr_in .txt_box .price {
	color: var(--pink);
	font-weight: 700;
}
.fix_bnr .bnr_in .txt_box .price .num {
	font-size: min(11.0667vw, 83px);
	font-family: 'Century Gothic', "Jost", sans-serif;
}
.fix_bnr .bnr_in .txt_box .price .num span {
	font-family: YuGothic, -apple-system, BlinkMacSystemFont, 'Yu Gothic Medium', 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
	margin: 0 0 0 max(-1.3333vw, -10px);
}
.fix_bnr .bnr_in .txt_box .price .yen {
	position: relative;
	font-size: min(6.4vw, 48px);
}
.fix_bnr .bnr_in .txt_box .price .yen::after {
	content: "(税込)";
	font-size: min(1.8667vw, 14px);
	width: 3em;
	height: 1em;
	position: absolute;
	top: max(-1.333vw, -10px);
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
}
.fix_bnr .bnr_in .txt_box .free span {
	display: inline-block;
	color: var(--pink);
	font-size: min(2.6667vw, 20px);
	font-weight: bold;
	line-height: 1.1;
	letter-spacing: 0.05em;
	padding: min(1.6vw, 12px) min(1.3333vw, 10px) min(0.8vw, 6px);
	border: min(0.2667vw, 2px) solid var(--pink);
}
.fix_bnr .bnr_in .btn {
	display: block;
	background: var(--pink);
	color: #fff;
	font-size: min(4vw, 30px);
	font-weight: 700;
	letter-spacing: 0.05em;
	padding: min(3.3333vw, 25px) 0;
	border-radius: min(5.3333vw, 40px);
	position: relative;
}
.fix_bnr .bnr_in .btn::after {
	content: '';
	width: min(2.6667vw, 20px);
	height: min(2.6667vw, 20px);
	border: 0;
	border-top: solid min(0.4vw, 3px) #fff;
	border-right: solid min(0.4vw, 3px) #fff;
	transform: rotate(45deg);
	position: absolute;
	top: 0;
	right: min(4vw, 30px);
	bottom: 0;
	margin: auto;
}

/*-----------------------------------
.fv
-----------------------------------*/
.fv {
	position: relative;
	padding: min(5.3333vw, 40px) 0;
	background: #f0e8ec;
}
.fv::before {
	content: "";
	background: url("img/fv_item.png") no-repeat 0 0 / contain;
	width: 100%;
	height: min(156.9333vw, 1177px);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
.fv .inner {
	position: relative;
	z-index: 2;
}
.fv .logo {
	width: min(15.7333vw, 118px);
	margin: 0 auto min(4vw, 30px);
}
.fv .measures {
	display: flex;
	justify-content: space-between;
	padding: 0 min(4vw, 30px);
	margin: 0 0 min(6.6667vw, 50px)
}
.fv .measures li {
	background: #fff;
	color: var(--gray);
	font-size: min(3.7333vw, 28px);
	font-weight: 700;
	padding: min(1.2vw, 9px) min(2vw, 15px) min(1.0667vw, 8px);
}
.fv .measures li .sup {
    margin: max(-0.4vw, -3px) 0 0 min(0.4vw, 3px);
}
.fv .catch {
	text-align: right;
	margin: 0 min(4vw, 30px) 0 0;
}
.fv .catch img {
	width: min(19.2vw, 144px);
}
.fv .information {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin: max(-6.6667vw, -50px) 0 0;
}
.fv .information .img_box img {
	width: min(31.6vw, 237px);
}
.fv .information .txt {
	background: rgba(255,255,255,0.7);
	color: var(--gray);
	font-size: min(3.4133vw, 25.6px);
	font-weight: 700;
	line-height: 1.3;
	padding: 10px;
}
.fv .information .txt .sup {
    margin: 0 min(0.4vw, 3px) 0 0;
}

/*-----------------------------------
.first_cta
-----------------------------------*/
.first_cta {
	background: #f0e8ec;
	padding: min(8.8vw, 66px) 0 min(6vw, 45px);
 }
.first_cta .ttl {
	font-size: min(4.6667vw, 35px);
	font-weight: 700;
	margin: 0 0 min(3.4667vw, 26px);
}
.first_cta .ttl .sup {
    margin: 0 min(0.4vw, 3px) 0 0;
}
.first_cta .product {
	margin-bottom: min(2vw, 15px);
}
.first_cta .product dt {
	color: var(--gray2);
	font-size: min(3.7333vw, 28px);
	font-weight: 700;
	margin: 0 0 min(5.3333vw, 40px);
}
.first_cta .product dd {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
.first_cta .product dd .img_box {
	width: min(45.7333vw, 343px);
	padding-bottom: min(2.3vw, 13px);
}
.first_cta .product dd .txt_box ul {
	display: flex;
	justify-content: space-between;
	gap: 0 min(2vw, 15px);
	margin: 0 0 min(2.666vw, 20px) min(2vw, 15px);
}
.first_cta .product dd .txt_box ul li {
	width: min(20.666vw, 155px);
	box-sizing: border-box;
	font-size: min(3.333vw, 25px);
	font-weight: 700;
	border: min(0.1333vw, 1px) solid #68666a;
	padding: min(1.0667vw, 8px) min(2.6667vw, 20px) min(0.8vw, 6px);
}
.first_cta .product dd .txt_box .note {
	display: block;
	text-align: left;
	color: var(--gray2);
	font-size: min(2.9333vw, 22px);
	font-weight: 700;
	margin: 0 0 0 min(1.3333vw, 10px);
}
.first_cta .product dd .txt_box .price {
	text-align: left;
	color: var(--pink);
	font-weight: 700;
	text-align: right;
}
.first_cta .product dd .txt_box .price .num {
	font-size: min(13.333vw, 100px);
	font-family: 'Century Gothic', "Jost", sans-serif;
}
.first_cta .product dd .txt_box .price .num span {
	font-family: YuGothic, -apple-system, BlinkMacSystemFont, 'Yu Gothic Medium', 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
	margin: 0 0 0 max(-1.3333vw, -10px);
}
.first_cta .product dd .txt_box .price .yen {
	position: relative;
	font-size: min(8vw, 60px);
}
.first_cta .product dd .txt_box .price .yen::after {
	content: "(税込)";
	font-size: min(2.4vw, 18px);
	width: 3em;
	height: 1em;
	position: absolute;
	top: max(-2vw, -10px);
	left: 54%;
	transform: translateX(-50%);
	white-space: nowrap;
}
.first_cta .product_detail {
	color: #5b5a68;
	border: min(0.133vw, 1px) solid var(--lightgray);
	font-size: min(2.666vw, 20px);
	line-height: 1.25;
	padding: min(1.7333vw, 13px) 0 min(1.333vw, 10px);
	margin-bottom: min(4vw, 30px);
}
.first_cta .product_detail p {
	text-align: left;
	display: inline-block;
}
.first_cta .btn {
	display: block;
	background: var(--pink);
	color: #fff;
	font-size: min(5.3333vw, 40px);
	font-weight: 700;
	letter-spacing: 0.05em;
	padding: min(4.6667vw, 35px) 0;
	border-radius: min(7.3333vw, 55px);
	margin: 0 0 min(4.6667vw, 35px);
	position: relative;
}
.first_cta .btn::after {
	content: '';
	width: min(2.6667vw, 20px);
	height: min(2.6667vw, 20px);
	border: 0;
	border-top: solid min(0.6667vw, 5px) #fff;
	border-right: solid min(0.6667vw, 5px) #fff;
	transform: rotate(45deg);
	position: absolute;
	top: 0;
	right: min(5.6vw, 42px);
	bottom: 0;
	margin: auto;
}

/*-----------------------------------
.sec01
-----------------------------------*/
.sec01 {
	padding: min(14vw, 105px) 0 min(12.6667vw, 95px);
}
.sec01 .sec_ttl {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0 min(8.6667vw, 65px);
	margin: 0 0 min(6.6667vw, 50px);
}
.sec01 .sec_ttl .circle {
	display: inline-block;
	position: relative;
	font-family: Arial, Helvetica, "sans-serif";
	font-size: min(3.7333vw, 38px);
	letter-spacing: 0.1em;
	color: var(--gray2);
}
.circle-svg {
	position: absolute;
	top: 50%;
	left: 50%;
	width: min(17.3333vw, 130px);
	height: min(17.3333vw, 130px);
	transform: translate(-50%, -50%);
}
.circle-svg circle {
	fill: none;
	stroke: var(--gray2);
	stroke-width: 1;
	stroke-dasharray: 301.59; /* 円周 = 2πr = 2×3.14×48 */
	stroke-dashoffset: 301.59;
	transition: stroke-dashoffset 1.2s ease;
}
.circle.is-active .circle-svg circle {
	stroke-dashoffset: 0;
}
.sec01 .sec_ttl .circle::after {
	content: "";
	background: #fffbfa;
	width: min(4vw, 30px);
	height: min(4.6667vw, 35px);
	position: absolute;
	top: 50%;
	right: max(-4.8vw, -36px);
	transform: translateY(-50%);
}
.sec01 .sec_ttl p {
	color: var(--gray2);
	font-size: min(4.6667vw, 35px);
	font-weight: 700;
	white-space: nowrap;
	position: relative;
}
.sec01 .sec_ttl p::before {
	content: "";
	background: var(--gray2);
	width: min(4.5333vw, 34px);
	height: min(0.1333vw, 1px);
	position: absolute;
	top: 50%;
	left: max(-5.8667vw, -44px);
	transform: translateY(-50%);
}
.sec01 .sec_ttl p span {
	display: block;
	margin: 0 0 0 -0.5em;
}
.sec01 .intro {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0 min(7.3333vw, 55px);
	margin: 0 0 min(10.6667vw, 80px);
}
.sec01 .intro .txt_box {
	writing-mode: vertical-rl;
	font-size: min(5.3333vw, 40px);
	line-height: 1.55;
	text-align: left;
}
.sec01 .intro .txt_box span {
	display: block;
	margin: -0.5em 0 0;
}
.sec01 .intro .img_box {
	width: min(46.6667vw, 350px);
}
.sec01 .txt {
	font-size: min(4vw, 30px);
	font-weight: 500;
	line-height: 1.83;
}

/*-----------------------------------
.sec02 .fact
-----------------------------------*/
.sec02 {
	overflow-x: hidden;
	background: #fcf5e8;
	padding: min(26vw, 195px) 0 0;
	position: relative;
	overflow-y: hidden;
}
.sec02::after {
	content: "";
	background: url("img/arw01.svg") no-repeat 0 0 / contain;
	width: min(36.8vw, 276px);
	height: min(18.4vw, 138px);
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
}
.sec02::before {
	content: "";
	background: url("img/why_img02.png") no-repeat 0 0 / contain;
	width: min(100vw, 750px);
	height: min(155.4667vw, 1166px);
	position: absolute;
	top: min(53.3333vw, 400px);
	left: 50%;
	transform: translateX(-50%);
}
.sec02 .inner {
	position: relative;
	z-index: 1;
}
.sec02 .bdr_txt {
	font-size: min(4.4vw, 33px);
	line-height: 1.66;
	padding: 0 0 min(14.6667vw, 110px);
	margin: 0 0 min(5.3333vw, 40px);
}
.sec02 .bdr_txt p {
	margin: 0 0 min(5.3333vw, 40px);
}
.sec02 .bdr_txt span {
	display: block;
	font-weight: 700;
}
.sec02 .fact .skin_condition .bdr_txt ul.notes {
	margin: 0 auto;
	display: inline-block;
}
.sec02 .sec_ttl {
	font-size: min(4.9333vw, 37px);
	font-weight: 700;
	margin: 0 0 min(100vw, 750px);
	white-space: nowrap;
}
.sec02 .notes.title_after {
	margin: 0 max(-4vw, -30px) min(5.3333vw, 40px) auto;
}
.sec02 .notes.title_after li {
	text-align: right;
}
.sec02 .sec_ttl .main {
	display: block;
	font-size: min(6vw, 45px);
	padding: min(3.3333vw, 25px) 0 0;
}
.sec02 .fact {
	padding: 0 0 min(12vw, 90px);
	position: relative;
}
.sec02 .fact::before {
	content: "";
	background: url("img/fact_img.png") no-repeat 0 0 / contain;
	width: min(33.2vw, 249px);
	height: min(107.6vw, 807px);
	position: absolute;
	top: max(-10.666vw, -80px);
	right: max(-8.6667vw, -65px);
}
.sec02 .fact::after {
	content: "";
	background: url("img/amino_acid_deco.png") no-repeat 0 0 / contain;
	width: min(90.4vw, 678px);
	height: min(71.8667vw, 539px);
	position: absolute;
	bottom: max(-6vw, -45px);
	left: 0;
}
.sec02 .sub_ttl {
	font-family: Arial, Helvetica, "sans-serif";
	text-align: left;
	color: var(--gray2);
	font-size: min(2.9333vw, 22px);
	padding: 0 0 min(2vw, 15px);
	margin: 0 0 min(6.6667vw, 50px);
	position: relative;
}
.sec02 .sub_ttl::after {
	content: "";
	background: var(--gray2);
	width: min(26.9333vw, 202px);
	height: min(0.1333vw, 1px);
	position: absolute;
	bottom: 0;
	left: 0;
	transform: scale(0,1); /* 線のx軸の長さを0 */
	transition: transform 1.5s ease 0.3s;
	transform-origin: left top; /* 要素の座標の原点を設定*/	
}
.sec02 .sub_ttl.is-active::after{
	transform: scale(1,1); /* 線のx軸の長さを1 */
}
.sec02 .ttl_txt {
	text-align: left;
	font-size: min(8vw, 60px);
	font-weight: 700;
	line-height: 1.4;
	margin: min(16vw, 120px) 0 min(8vw, 60px);
}
.sec02 .ttl_txt span {
	display: block;
	margin: 0 0 0 -0.5em;
}
.sec02 .txt {
	text-align: left;
	font-size: min(4vw, 30px);
	line-height: 1.66;
}
.sec02 .txt + .txt {
	margin: 1em 0 0;
}
.sec02 .fact .skin_condition .bdr_box {
	background: #f1ece2;
	margin: min(12vw, 90px) max(-4vw, -30px) min(2vw, 15px);
	padding: min(6vw, 45px) min(4vw, 30px) min(4vw, 30px);
	border: min(0.1333vw, 1px) solid var(--gray2);
}
.sec02 .fact .skin_condition .condition_wrap {
	display: flex;
	justify-content: space-between;
	margin: 0 0 min(2.6667vw, 20px);
}
.sec02 .fact .skin_condition .ttl {
	color: var(--gray2);
	font-size: min(3.7333vw, 28px);
	font-weight: 700;
	margin: 0 0 min(5.3333vw, 40px);
}
.sec02 .fact .skin_condition .condition dt {
	color: #fff;
	font-size: min(3.0667vw, 23px);
	background: var(--gray2);
	padding: min(1.6vw, 12px) 0 min(1.3333vw, 10px);
	margin: 0 0 min(2.9333vw, 22px);
}
.sec02 .fact .skin_condition .condition dd p {
	font-size: min(3.2vw, 24px);
	line-height: 1.4;
	margin: 0 0 min(3.3333vw, 25px);
}
.sec02 .fact .skin_condition .condition:nth-child(1) dd .img_box {
	width: min(39.4667vw, 296px);
}
.sec02 .fact .skin_condition .condition:nth-child(2) dd .img_box {
	width: min(39.2vw, 294px);
}
.sec02 .fact .skin_condition .note {
	display: block;
	text-align: right;
	color: var(--lightgray);
	font-size: min(2.6667vw, 20px);
}
.sec02 .fact .skin_condition ul.notes {
	margin: 0 max(-4vw, -30px) min(8vw, 60px);
}
.sec02 .fact .circle_img {
	width: min(67.4667vw, 506px);
	margin: 0 auto min(9.3333vw, 70px);
}

/*-----------------------------------
.sec02 .answer
-----------------------------------*/
.sec02 .answer {
	padding: 0 0 min(10.9333vw, 82px);
}
.sec02 .answer .sub_ttl {
	text-align: right;
}
.sec02 .answer .sub_ttl::after {
	left: auto;
	right: 0;
	transform-origin: right top; /* 要素の座標の原点を設定*/	
}
.sec02 .answer .ttl_txt {
	text-align: right;
}
.sec02 .answer .ttl_txt span {
	font-size: min(6.4vw, 48px);
}
.sec02 .answer .txt {
	text-align: right;
	margin: 0 0 min(5.3333vw, 40px);
}
.sec02 .answer ul.notes.ta_r {
	margin: 0 0 min(8.6667vw, 65px);
}
.sec02 .answer ul.notes.ta_r li {
	text-align: right;
}
.sec02 .answer .img_box_right {
	width: min(91.3333vw, 685px);
	margin: 0 max(-8.6667vw, -65px) min(10.6667vw, 80px) 0;
}
.sec02 .answer .img_box {
	margin: 0 0 min(8.6667vw, 65px);
}
.sec02 .answer .recap {
	font-size: min(4vw, 30px);
	font-weight: 700;
	margin: 0 0 min(6.4vw, 48px);
}
.sec02 .answer .recap .bdr {
	display: inline-block;
	font-size: min(5.3333vw, 40px);
	padding: min(3.6vw, 27px) 0 min(2.2667vw, 17px);
	position: relative;
}
.sec02 .answer .recap .bdr::after {
	content: "";
	background: var(--lightgray);
	width: 100%;
	height: 1.5px;
	position: absolute;
	bottom: 0;
	left: 0;
	transform: scale(0,1.5); /* 線のx軸の長さを0 */
	transition: transform 1.5s ease 0.3s;
	transform-origin: left top; /* 要素の座標の原点を設定*/	
}
.sec02 .answer .recap .bdr.is-active::after{
	transform: scale(1,1); /* 線のx軸の長さを1 */
}
.sec02 .answer ul.notes.inline_b {
	display: inline-block;
	margin: 0 auto;
}

/*-----------------------------------
.sec03
-----------------------------------*/
.sec03 {
	background: #fae9e2 url("img/voice_bg.png") no-repeat center 0 / 100% auto;
	padding: min(17.333vw, 130px) 0 min(22.6667vw, 170px);
	position: relative;
}
.sec03::before,
.sec03::after {
	content: "";
	width: 100%;
	height: min(5.7333vw, 43px);
	position: absolute;
	left: 0;
}
.sec03::before {
	background: url("img/voide_bg_top.png") no-repeat 0 0 / contain;
	top: 0;
}
.sec03::after {
	background: url("img/voide_bg_btm.png") no-repeat 0 0 / contain;
	bottom: max(-0.1333vw, -1px);
}
.sec03 .sec_ttl {
	font-family: Arial, Helvetica, "sans-serif";
	color: var(--pink2);
	font-size: min(9.3333vw, 70px);
	margin: 0 0 min(14.9333vw, 112px);
}
.sec03 .voice_wrap {
	display: flex;
	flex-direction: column;
	gap: min(8.8vw, 66px) 0;
	margin: 0 0 min(8.6667vw, 65px);
}
.sec03 .voice {
	background: rgba(255,255,255,0.7);
	border: min(0.1333vw, 1px) solid var(--pink2);
	padding: min(8.6667vw, 65px) min(6.6667vw, 50px) min(4vw, 30px);
}
.sec03 .voice dt {
	color: var(--pink2);
	font-size: min(4.8vw, 36px);
	font-weight: 700;
	margin: 0 0 min(6vw, 45px);
}
.sec03 .voice dd .txt {
	text-align: left;
	font-size: min(4vw, 30px);
	line-height: 1.4;
	margin-bottom: min(2.666vw, 20px);
}
.sec03 .voice dd .name {
	text-align: right;
	color: var(--lightgray);
	font-size: min(3.3333vw, 25px);
}

/*-----------------------------------
.sec04
-----------------------------------*/
.sec04 {
	padding: min(14.6667vw, 110px) 0 0;
}
.sec04 .sec_ttl {
	font-size: min(5.3333vw, 40px);
	font-weight: 700;
	line-height: 1.5;
	margin: 0 0 min(12vw, 90px);
}
.sec04 .sec_ttl span {
	display: block;
	font-size: min(4vw, 30px);
	margin: 0 0 0.5em;
}
.sec04 .additives_free {
	padding: 0 0 min(10vw, 75px);
}
.sec04 .additives_free dt {
	display: inline-block;
	font-size: min(4.6667vw, 35px);
	font-weight: 700;
	padding: 0 0 min(2.6667vw, 20px);
	border-bottom: min(0.1333vw, 1px) solid var(--black);
	margin: 0 0 min(6.4vw, 48px);
}
.sec04 .additives_free dd .img_box {
	margin: 0 0 min(10.6667vw, 80px);
}
.sec04 .additives_free dd .check {
	text-align: left;
	margin: 0 0 min(5.3333vw, 40px);
}
.sec04 .additives_free dd .check li {
	font-size: min(4.6667vw, 35px);
	background: url("img/icon_check.png") no-repeat 0 center / min(4.1333vw, 31px) auto;
	padding: 0 0 0 min(6.1333vw, 46px);
}
.sec04 .additives_free dd .check li + li {
	margin: min(5.3333vw, 40px) 0 0;
}
.sec04 .additives_free dd .notes {
	margin: 0 max(-4vw, -30px);
	letter-spacing: -0.03em;
}
.sec04 .catch {
	position: relative;
}
.sec04 .catch p span {
	font-weight: 700;
	background-color: rgba(255,255,255,0.65);
	color: #5b5a68;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
}
.sec04 .catch p.txt01 span {
	top: min(18vw, 135px);
	font-size: min(3.7333vw, 28px);
	padding: min(1.3333vw, 10px) min(1.8667vw, 14px);
}
.sec04 .catch p.txt02 span {
	top: min(27.4667vw, 206px);
	font-size: min(5.3333vw, 40px);
	padding: min(1.3333vw, 10px) min(1.6vw, 12px);
}

/*-----------------------------------
.cta
-----------------------------------*/
.cta {
	background: #e8cccc;
	padding: min(4.6667vw, 35px) 0;
 }
.cta .sec_in {
	background: #fff;
	padding: min(7.3333vw, 55px) min(4vw, 30px) min(6.6667vw, 50px);
}
.cta .bdr {
	display: inline-block;
	color: var(--gray2);
	font-size: min(3.6667vw, 27.5px);
	font-weight: 700;
	padding: min(1.4667vw, 11px) min(4.2667vw, 32px);
	border: min(0.2667vw, 2px) solid #bcbcbf;
	margin: 0 auto min(6vw, 45px);
}
.cta .ttl {
	font-size: min(4vw, 30px);
	font-weight: 700; 
	margin: 0 0 min(3.4667vw, 26px);
}
.cta .ttl .sup {
    margin: 0 min(0.4vw, 3px) 0 0;
}
.cta .product dt {
	color: var(--gray2);
	font-size: min(3.7333vw, 28px); 
	font-weight: 700;
	margin: 0 0 min(5.3333vw, 40px);
}
.cta .product dd .img_box {
	width: min(82.666vw, 620px);
}
.cta .product dd .set_contents {
	color: #5b5a68;
	font-size: min(2.6667vw, 20px);
	margin: 0 0 min(6vw, 45px);
}
.cta .product dd .txt_box {
	display: flex;
	align-items: flex-end;
	justify-content: space-evenly;
}
.cta .product dd .txt_box .note {
	display: block;
	color: var(--gray2);
	font-size: min(3.6vw, 27px);
	font-weight: 700;
	margin: 0 0 min(3.7333vw, 28px);
	letter-spacing: 0.06em;
	width: min(22vw, 165px);
	padding-bottom: min(3.4vw, 23px);
	line-height: 1.24;
	text-align: center;
}
.cta .product dd .txt_box .note .mini {
	font-size: min(2.5333vw, 19px);
	letter-spacing: -0.08em;
}
.cta .product dd .txt_box .price_wrap {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0 min(0.666vw, 5px);
	margin: 0 0 min(4.6667vw, 35px);
}
.cta .product dd .txt_box .price {
	color: var(--pink);
	font-weight: 700;
}
.cta .product dd .txt_box .price .num {
	font-size: min(14vw, 105px);
	font-family: 'Century Gothic', "Jost", sans-serif;
}
.cta .product dd .txt_box .price .num span {
	font-family: YuGothic, -apple-system, BlinkMacSystemFont, 'Yu Gothic Medium', 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
	margin: 0 0 0 max(-1.3333vw, -10px);
}
.cta .product dd .txt_box .price .yen {
	position: relative;
	font-size: min(8.8vw, 66px);
}
.cta .product dd .txt_box .price .yen::after {
	content: "(税込)";
	font-size: min(2.5333vw, 19px);
	width: 3em;
	height: 1em;
	position: absolute;
	top: max(-1.8vw, -15px);
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
}
.cta .product dd .txt_box .free span {
	display: inline-block;
	color: var(--pink);
	font-size: min(3.4vw, 26px);
	font-weight: bold;
	line-height: 1.1;
	letter-spacing: 0.05em;
	padding: min(1.6vw, 12px);
	border: min(0.2667vw, 2px) solid var(--pink);
}
.cta .product_detail {
	color: #5b5a68;
	border: min(0.133vw, 1px) solid var(--lightgray);
	font-size: min(2.666vw, 20px);
	line-height: 1.25;
	padding: min(1.7333vw, 13px) 0 min(1.333vw, 10px);
	margin-bottom: min(4vw, 30px);
	margin-top: max(-9.333vw, -70px);
}
.cta .product_detail p {
	text-align: left;
	display: inline-block;
}
.cta .note {
	display: inline-block;
	font-size: min(4vw, 30px);
	font-weight: 700;
	margin: 0 auto min(3.7333vw, 28px);
}
.cta .btn {
	display: block;
	background: var(--pink);
	color: #fff;
	font-size: min(5.3333vw, 40px);
	font-weight: 700;
	letter-spacing: 0.05em;
	padding: min(6vw, 45px) 0;
	border-radius: min(8.6667vw, 65px);
	margin: 0 0 min(4.6667vw, 35px);
	position: relative;
}
.cta .btn::after {
	content: '';
	width: min(2.6667vw, 20px);
	height: min(2.6667vw, 20px);
	border: 0;
	border-top: solid min(0.6667vw, 5px) #fff;
	border-right: solid min(0.6667vw, 5px) #fff;
	transform: rotate(45deg);
	position: absolute;
	top: 0;
	right: min(5.6vw, 42px);
	bottom: 0;
	margin: auto;
}
.cta .notes li {
	text-align: center;
}

/*-----------------------------------
.sec05
-----------------------------------*/
.sec05 {
	padding: min(16vw, 120px) 0 min(13.3333vw, 100px);
	background: url("img/how_to_bg.jpg") no-repeat center 0 / cover;
}
.sec05 .bdr_txt {
	font-size: min(4.4vw, 33px);
	font-weight: 700;
	padding: 0 0 min(24vw, 180px);
	margin: 0 0 min(5.6vw, 42px);
}
.sec05 .sec_ttl {
	display: inline-block;
	font-size: min(6vw, 45px);
	padding: min(1.8667vw, 14px) min(2.8vw, 21px) min(1.4667vw, 11px);
	border: 1px solid var(--black);
	letter-spacing: 0.1em;
	margin: 0 0 min(8vw, 60px);
	position: relative
}
.sec05 .sec_ttl::after {
	content: "";
	background: #f2eeed;
	width: min(2.6667vw, 20px);
	height: min(2.6667vw, 20px);
	position: absolute; 
	top: max(-0.2667vw, -2px);
	right: max(-0.2667vw, -2px);
}
.sec05 .describe_wrap {
	margin: 0 0 min(10.6667vw, 80px);
}
.sec05 .describe + .describe {
	margin: min(10.4vw, 78px) 0 0;
}
.sec05 .describe dt {
	font-size: min(4vw, 30px);
	font-weight: 700;
	line-height: 1.66;
	margin: 0 0 min(5.3333vw, 40px);
}
.sec05 .describe dt span {
	display: block;
}
.sec05 .describe dt .mgn {
	margin: 0 0 0.75em;
}
.sec05 .describe dt .emphasis {
	font-size: min(5.3333vw, 40px);
}
.sec05 .describe dd {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 0 min(4.6667vw, 35px);
}
.sec05 .describe:nth-child(2) dd {
	flex-direction: row-reverse;
}
.sec05 .describe dd .img_box {
	flex: 0 0 min(38vw, 285px);
}
.sec05 .describe:nth-child(2) dd .img_box {
	flex: 0 0 min(46vw, 345px);
	margin: 0 max(-8.6667vw, -65px) 0 0;
}
.sec05 .describe dd .txt_box {
	flex: 1 1 auto;
	text-align: left;
}
.sec05 .describe dd .txt_box p {
	font-size: min(4vw, 30px);
	line-height: 1.66;
}
.sec05 .describe dd .note {
	display: block;
	text-align: left;
	color: var(--lightgray);
	font-size: min(2.6667vw, 20px);
}
.sec05 .describe dd .img_box .note {
	padding: min(1.3333vw, 10px) 0 0 min(5.3333vw, 40px);
}
.sec05 .describe dd .txt_box .note {
	padding: min(1.3333vw, 10px) 0 0;
}
.sec05 .bdr_txt.v2 {
	font-size: min(4vw, 30px);
	font-weight: 700;
	line-height: 1.66;
	padding: min(18.6667vw, 140px) 0 0;
	margin: 0 0 min(2vw, 15px);
}
.sec05 .bdr_txt.v2 span {
	display: block;
}
.sec05 .bdr_txt.v2 .mgn {
	margin: 0 0 0.75em;
}
.sec05 .bdr_txt.v2 .emphasis {
	font-size: min(5.3333vw, 40px);
}
.conclusion .img_box.mgn {
	margin: 0 max(-4vw, -30px) min(5.3333vw, 40px);
}
.conclusion .txt {
	font-size: min(4vw, 30px);
	font-weight: 700;
	line-height: 1.66;
	margin: 0 0 min(10.6667vw, 80px);
}
.conclusion .txt span {
	display: block;
	font-size: min(5.3333vw, 40px);
}
.conclusion .result {
	display: flex;
	justify-content: space-between;
}
.conclusion .result .img_box {
	flex: 0 0 min(56vw, 420px);
	margin: 0 0 0 max(-8.6667vw, -65px);
}
.conclusion .result .txt_box {
	position: relative;
	flex: 1 1 auto;
}
.conclusion .result .txt_box p {
	writing-mode: vertical-rl;
	font-size: min(4.6667vw, 35px);
	font-weight: 700;
    line-height: 1.3;
    text-align: left;
	letter-spacing: 0.35em;
	position: absolute;
    top: 0;
    right: 0;
}
.conclusion .result .txt_box p .emphasis {
	display: block;
	font-size: min(9.3333vw, 70px);
}
.conclusion .result .txt_box p .f45 {
	display: block;
	font-size: min(6vw, 45px);
}
.conclusion .result .txt_box .note {
	display: block;
	color: var(--lightgray);
	font-size: min(2.6667vw, 20px);
	position: absolute;
	bottom: 0;
	right: max(-4vw, -30px);
}
.conclusion .result .txt_box p .sup {
	margin: -0.5em -0.5em 0 0;
	writing-mode: horizontal-tb;
	display: inline-block;
    transform: rotate(0deg);
    letter-spacing: 0;
}

/*-----------------------------------
.sec06
-----------------------------------*/
.trial_set {
	position: relative;
	margin: 0 0 min(14vw, 105px);
}
.trial_set .ttl {
	font-family: Arial, Helvetica, "sans-serif";
	font-size: min(3.7333vw, 28px);
	font-weight: 700;
	letter-spacing: 0.1em;
	padding: 0 0 min(2.6667vw, 20px);
	border-bottom: min(0.2667vw, 2px) solid var(--black);
	position: absolute;
	top: min(13.3333vw, 100px);
	left: 50%;
	transform: translateX(-50%);
}
.sec06 {
	background: #f4ecf0;
	padding: 0 0 min(22.1333vw, 166px);
	position: relative;
}
.sec06::after {
	content: "";
	background: url("img/sec06_bg_btm.png") no-repeat 0 0 / 100% auto;
	width: 100%;
	height: min(5.7333vw, 43px);
	position: absolute;
	bottom: 0;
	left: 0;
}
.sec06 .sec_ttl {
	font-size: min(4vw, 30px);
	font-weight: 700;
	letter-spacing: -0.01em;
	margin: 0 0 min(4.6667vw, 35px);
}
.sec06 .sec_ttl .emphasis {
	display: block;
	font-family: Arial, Helvetica, "sans-serif";
	font-size: min(6.6667vw, 50px);
	margin: min(2.6667vw, 20px) 0 0;
	letter-spacing: 0.1em;
}
.sec06 .note {
	display: block;
	color: var(--lightgray);
	font-size: min(2.6667vw, 20px);
	margin: 0 0 min(10.6667vw, 80px);
}
.sec06 .step_wrap {
	display: flex;
	flex-direction: column;
	gap: min(13.3333vw, 100px) 0;
}
.sec06 .step {
	display: flex;
}
.sec06 .step:nth-child(even) {
	flex-direction: row-reverse;
}
.sec06 .step:nth-child(odd) {
	margin: 0 0 0 max(-4vw, -30px);
}
.sec06 .step:nth-child(even) {
	margin: 0 max(-4vw, -30px) 0 0;
}
.sec06 .step > dt {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: min(7.3333vw, 55px) 0;
	position: relative;
}
.sec06 .step:nth-child(odd) > dt {
	padding: 0 min(2.9333vw, 22px) 0 0;
	margin: 0 min(5.3333vw, 40px) 0 0;
}
.sec06 .step:nth-child(even) > dt {
	padding: 0 0 0 min(2.9333vw, 22px);
	margin: 0 0 0 min(5.3333vw, 40px);
}
.sec06 .step > dt::after {
	content: "";
	background: var(--pink2);
	width: min(0.1333vw, 1px);
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	transform: scale(1,0); /* 線のx軸の長さを0 */
	transition: transform 2.5s ease 0.3s;
	transform-origin: left top; /* 要素の座標の原点を設定*/	
}
.sec06 .step:nth-child(even) > dt::after {
	left: 0;
}
.sec06 .step > dt.is-active::after{
	transform: scale(1,1); /* 線のx軸の長さを1 */
}
.sec06 .step > dt .icon {
	width: min(14.2667vw, 107px);
}
.sec06 .step > dt p {
    writing-mode: vertical-rl;
	color: var(--pink2);
	font-size: min(6vw, 45px);
	font-weight: 700;
	letter-spacing: 0.2em;
	white-space: nowrap;
}
.sec06 .step > dt p .sup {
	color: var(--pink2);
	writing-mode: horizontal-tb;
    display: inline-block;
    transform: rotate(0deg);
	letter-spacing: 0;
}
.sec06 .step > dd .product .movie_wrap {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	margin: 0 auto min(5.3333vw, 40px);
	position: relative;
}
.sec06 .step:nth-child(4) > dd .product .movie_wrap {
	align-items: flex-start;
}
.sec06 .step > dd .product .movie_wrap .icon_img {
	position: absolute;
	top:  min(48vw, 360px);
	left: max(-2.666vw, -20px);
	width:  min(19.333vw, 145px);
	height:  min(20.8vw, 156px);
}
.sec06 .step > dd .product .movie_box {
    width: min(42.6667vw, 320px);
    height: min(42.6667vw, 320px);
    max-width: 100vh;
    max-height: 100vh;
    position: relative;
    border-radius: 50%;
    overflow: hidden;
}
.sec06 .step:nth-child(4) > dd .product .movie_box {
	margin-top: min(4vw, 30px);
}
.sec06 .step > dd .product .movie_box video {
    width: min(96vw, 720px);
    height: min(96vw, 720px);
    object-fit: cover;
    position: absolute;
	transform: translateY(-50%) translateX(-50%);
	border-radius: 50%;
}
.sec06 .step:nth-child(1) > dd .product .movie_box video {
    width: min(80vw, 600px);
    height: min(80vw, 600px);
	top: 60%;
	left: 40%;
}
.sec06 .step:nth-child(2) > dd .product .movie_box video {
	top: 80%;
	left: 70%;
}
.sec06 .step:nth-child(3) > dd .product .movie_box video {
    width: min(120vw, 900px);
    height: min(120vw, 900px);
	top: 90%;
	left: 80%;
}
.sec06 .step:nth-child(4) > dd .product .movie_box video {
	top: 85%;
	left: 30%;
}
.sec06 .step > dd .product .img_box {
	margin: 0 auto;
	z-index: 2;
}
.sec06 .step:nth-child(1) > dd .product .img_box {
	width: min(26.1333vw, 196px);
	margin: 0 0 0 max(-8vw, -60px);
}
.sec06 .step:nth-child(2) > dd .product .img_box {
	width: min(29.8667vw, 224px);
	margin: 0 0 0 max(-6.4vw, -48px);
}
.sec06 .step:nth-child(3) > dd .product .img_box {
	width: min(29.3333vw, 220px);
	margin: 0 0 0 max(-4vw, -30px);
}
.sec06 .step:nth-child(4) > dd .product .img_box {
	width: min(15.7333vw, 118px);
	margin: 0 0 0 max(-4vw, -30px);
}
.sec06 .step > dd .product {
	margin: 0 0 min(5.3333vw, 40px);
}
.sec06 .step > dd .product span {
	display: block;
	color: var(--gray2);
	font-size: min(3.3333vw, 25px);
	font-weight: 700;
}
.sec06 .step > dd .product .cat {
	display: inline-block;
	padding: min(0.6667vw, 5px) min(0.9333vw, 7px);
	border: min(0.1333vw, 1px) solid var(--gray2);
	margin: 0 0 min(2vw, 15px);
}
.sec06 .step > dd .description dt {
	font-size: min(4.666vw, 33px);
	font-weight: 700;
	line-height: 1.52;
	margin: 0 0 min(4.4vw, 40px);
}
.sec06 .step > dd .description dd .txt_box {
	margin: 0 0 min(6vw, 45px);
}
.sec06 .step > dd .description dd .txt_box p {
	text-align: left;
	font-size: min(3.6vw, 27px);
	line-height: 1.85;
	letter-spacing: -0.05em;
}
.sec06 .step > dd .description dd .txt_box .notes {
	margin: 0.5em 0 0;
	letter-spacing: -0.05em;
}
.sec06 .step > dd .description dd .img_box {
	margin: 0 0 min(1.3333vw, 10px);
	
}
.sec06 .step > dd .description dd .img_box .note {
	margin:min(1.3333vw, 10px) 0 0;
	text-align: right;
}
.sec06 .step > dd .description dd .bdr_box {
	padding: min(1.8667vw, 14px) 0 min(1.7333vw, 13px);
	border: min(0.1333vw, 1px) solid var(--gray2);
}
.sec06 .step > dd .description dd .bdr_box p {
	color: var(--gray2);
	font-size: min(2.9333vw, 22px);
	font-weight: 700;
	line-height: 1.27;
}
.sec06 .step > dd .description dd .bdr_box .note {
	margin: 0.5em 0 0;
}
.sec06 .step > dd .description dd .note.v2 {
	text-align: left;
	margin: 0.5em 0 0;
}

/*-----------------------------------
.sec07
-----------------------------------*/
.sec07 {
	padding: min(15.3333vw, 115px) 0 min(10.6667vw, 80px);
}
.sec07 .sec_ttl {
	margin: 0 0 min(10.6667vw, 80px);
}
.sec07 .sec_ttl span {
	display: inline-block;
	color: #d195b7;
	font-family: Arial, Helvetica, "sans-serif";
	font-size: min(3.7333vw, 28px);
	font-weight: 700;
	letter-spacing: 0.1em;
	padding: 0 0 min(2.6667vw, 20px);
	border-bottom: min(0.2667vw, 2px) solid #d195b7;
}
.sec07 .bdr_box {
	display: inline-block;
	position: relative;
	padding: min(7.8667vw, 59px) min(9.2vw, 69px);
	font-size: min(4vw, 30px);
	font-weight: 700;
	color: var(--gray2);
	line-height: 1.5;
	margin: 0 0 min(9.3333vw, 70px);
}
.sec07 .bdr_box::before,
.sec07 .bdr_box::after {
	content: "";
	background: #fff;
	width: min(3.2vw, 24px);
	height: min(0.5333vw, 4px);
	position: absolute;
	z-index: 2;
}
.sec07 .bdr_box::before {
	top: max(-0.2667vw, -2px);
	right: min(10.6667vw, 80px);
}
.sec07 .bdr_box::after {
	bottom: max(-0.2667vw, -2px);
	left: min(24.8vw, 186px);
}
.sec07 .bdr_box .border {
	position: absolute;
	background-color: var(--gray2);
}
.sec07 .bdr_box .border.top,
.sec07 .bdr_box .border.bottom {
	height: min(0.1333vw, 1px);
	width: 0;
}
.sec07 .bdr_box .border.left,
.sec07 .bdr_box .border.right {
	width: min(0.1333vw, 1px);
	height: 0;
}
/* 配置 */
.sec07 .bdr_box .border.top {
	top: 0;
	left: 0;
}
.sec07 .bdr_box.is-active .border.top {
	animation: draw-top 1.0s forwards 0.5s;
}
.sec07 .bdr_box .border.right {
	top: 0;
	right: 0;
}
.sec07 .bdr_box.is-active .border.right {
	animation: draw-right 1.0s forwards 1.0s;
}
.sec07 .bdr_box .border.bottom {
	bottom: 0;
	right: 0;
}
.sec07 .bdr_box.is-active .border.bottom {
	animation: draw-bottom 1.0s forwards 1.5s;
}
.sec07 .bdr_box .border.left {
	bottom: 0;
	left: 0;
}
.sec07 .bdr_box.is-active .border.left {
	animation: draw-left 1.0s forwards 2.0s;
}
/* アニメーション定義 */
@keyframes draw-top {
	from { width: 0; }
	to { width: 100%; }
}
@keyframes draw-right {
	from { height: 0; }
	to { height: 100%; }
}
@keyframes draw-bottom {
	from { width: 0; }
	to { width: 100%; }
}
@keyframes draw-left {
	from { height: 0; }
	to { height: 100%; }
}

.sec07 .catch {
	font-size: min(4.9333vw, 37px);
	font-weight: 700;
	line-height: 1.5;
	margin: 0 0 min(5.3333vw, 40px);
}
.sec07 .catch.v2 {
	margin: 0 0 min(8vw, 60px);
}
.sec07 .catch .emphasis {
	display: block;
	font-size: min(6vw, 45px);
	padding: min(1.3333vw, 10px) 0 0;
}
.sec07 .reference {
	display: inline-block;
	color: #5b5a68;
	font-size: min(2.4vw, 18px);
	margin: 0 0 min(8vw, 60px);
}
.sec07 .amino_acid_wrap {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 0 0 min(4vw, 30px);
}
.sec07 .amino_acid {
	width: min(43.3333vw, 325px);
	background: url("img/amino_acid_bg.jpg") no-repeat 0 0 / cover;
	padding: min(6.6667vw, 50px) min(2.6667vw, 20px) min(7.3333vw, 55px);
	box-sizing: border-box;
}
.sec07 .amino_acid dt {
	height: min(19.3333vw, 145px);
	margin: 0 auto min(5.3333vw, 40px);
}
.sec07 .amino_acid dt:nth-child(3),
.sec07 .amino_acid dt:nth-child(4) {
	height: min(22vw, 165px);
}
.sec07 .asw01 .amino_acid:nth-child(1) dt {
	width: min(18.6667vw, 140px);
}
.sec07 .asw01 .amino_acid:nth-child(2) dt {
	width: min(19.3333vw, 145px);
}
.sec07 .asw02 .amino_acid:nth-child(1) dt {
	width: min(19.2vw, 144px);
}
.sec07 .asw02 .amino_acid:nth-child(2) dt {
	width: min(16.6667vw, 125px);
}
.sec07 .notes {
	display: inline-block;
	margin: 0.5em auto min(8.6667vw, 65px);
}
.sec07 .amino_acid dd .name {
	display: block;
	color: var(--gray2);
	font-size: min(3.7333vw, 28px);
	font-weight: 700;
	margin: 0 0 min(3.3333vw, 25px);
}
.sec07 .amino_acid dd ul li {
	text-align: left;
	text-indent: -1em;
	padding-left: 1em;
	color: var(--gray2);
	font-size: min(3.3333vw, 25px);
	line-height: 1.44;
}
.sec07 .amino_acid dd ul li.ls {
	letter-spacing: -0.15em;
}
.sec07 .amino_acid dd ul li .sup {
	text-indent: 0;
	padding-left: 0;
}
.sec07 .many_more .ttl {
	font-size: min(4.6667vw, 35px);
	font-weight: 700;
	line-height: 1.48;
	margin: 0 0 min(8vw, 60px);
}
.sec07 .many_more .list_box {
	padding: min(8vw, 60px) min(4vw, 30px) min(5.3333vw, 40px);
	border: min(0.2667vw, 2px) solid #ddd;
}
.sec07 .many_more .list_box .list_ttl {
	display: block;
	color: #5b5a68;
	font-size: min(4vw, 30px);
	font-weight: 700;
	margin: 0 0 min(6.6667vw, 50px);
}
.sec07 .many_more .list_box ul li:nth-child(1) {
	width: min(74.4vw, 558px);
	margin: 0 auto min(8vw, 60px);
}
.sec07 .many_more .list_box ul li:nth-child(2) {
	width: min(73.7333vw, 553px);
	margin: 0 auto min(6vw, 45px);
}
.sec07 .many_more .list_box ul li:nth-child(3) {
	width: min(75.0667vw, 563px);
	margin: 0 auto min(5.3333vw, 40px);
}
.sec07 .many_more .list_box ul li:nth-child(4) {
	width: min(76.1333vw, 571px);
	margin: 0 auto min(3.3333vw, 25px);
}
.sec07 .many_more .list_box ul li:nth-child(5) {
	width: min(80.6667vw, 605px);
	margin: 0 auto;
}
.sec07 .many_more .list_box.other {
	position: relative;
	padding: min(6vw, 45px) min(4vw, 30px) min(5.3333vw, 40px);
	margin: min(16.8vw, 126px) 0 0;
}
.sec07 .many_more .list_box.other::before {
	content: "+";
	font-size: min(10.6667vw, 80px);
	font-weight: 700;
	color: var(--gray2);
	width: 1em;
	height: 1em;
	position: absolute;
	top: max(-14.6667vw, -110px);
	left: 50%;
	transform: translateX(-50%);
}
.sec07 .many_more .list_box.other .img_box {
	width: min(73.4667vw, 551px);
	margin: 0 auto;
}
.sec07 .many_more .note {
	display: block;
	text-align: right;
	color: var(--lightgray);
	font-size: min(2.6667vw, 20px);
	margin: 0.5em 0 min(8vw, 60px);
}
.sec07 .notes.w540 {
	width: min(72vw, 540px);
	margin: 0 auto;
}

/*-----------------------------------
.sec08
-----------------------------------*/
.sec08 {
	background: #fae9e2;
	padding: min(13.3333vw, 100px) 0 0;
}
.sec08 .sec_ttl {
	font-size: min(6.6667vw, 50px);
	font-weight: 700;
	line-height: 1.5;
	margin: 0 0 min(6.6667vw, 50px);
}
.sec08 .note {
	display: block;
	color: var(--lightgray);
	font-size: min(2.6667vw, 20px);
	margin: 0 0 min(10vw, 75px);
}
.sec08 .img_box {
	margin: 0 max(-4.6667vw, -35px);
}

/*-----------------------------------
.attention
-----------------------------------*/
.attention {
	padding: min(10.6667vw, 80px) 0 min(12vw, 90px);
}
.attention .sec_ttl {
	color: var(--gray2);
	font-size: min(3.4667vw, 26px);
	font-weight: 700;
	margin: 0 0 min(9.3333vw, 70px);
}
.attention .sec_ttl .en {
	display: block;
	color: #e6c5c5;
	font-family: 'Century Gothic', "Jost", sans-serif;
	font-weight: 400;
	margin: min(2.6667vw, 20px) 0 0;
}
.attention .dl_wrap {
	border-top: min(0.1333vw, 1px) solid #d0d0d0;
}
.attention .dl_wrap dl {
	border-bottom: min(0.1333vw, 1px) solid #d0d0d0;
	text-align: left;
}
.attention .dl_wrap dl dt {
	font-size: min(4vw, 30px);
	padding: min(4vw, 30px);
	position: relative;
}
.attention .dl_wrap dl dt::after {
    content: '';
    width: min(2.6667vw, 20px);
    height: min(2.6667vw, 20px);
    border: 0;
    border-top: solid min(0.6667vw, 5px) #b1b1b1;
    border-right: solid min(0.6667vw, 5px) #b1b1b1;
    transform: rotate(135deg);
    position: absolute;
    top: 0;
    right: min(5.6vw, 42px);
    bottom: 0;
    margin: auto;
	transition: all 0.2s ease;
}
.attention .dl_wrap dl dt.active::after {
    transform: rotate(315deg);
}
.attention .dl_wrap dl dd {
	display: none;
	font-size: min(3.7333vw, 28px);
	line-height: 1.7;
	padding: min(4vw, 30px);
	position: relative;
}
.attention .dl_wrap dl dd .ttl {
	display: block;
	font-weight: 700;
}

/*-----------------------------------
.footer
-----------------------------------*/
.footer {
	background: var(--gray2);
	padding: min(6.6667vw, 50px) 0;
	color: #fff;
}
.footer .link_txt {
	display: block;
	color: #fff;
	font-size: min(3.0667vw, 23px);
	line-height: 1.73;
}
.footer .copy {
	color: #fff;
	font-size: min(2.4vw, 18px);
	margin: min(5.3333vw, 40px) 0 0;
}