/*--------------------------------------
共通設定
--------------------------------------*/
.wrpProductContents{
	background-image: url(/hythiol/zh-Hans/products/hc2/img/sp/bg_main.png);
}

.wrpProductContents section{
	padding: 0 calc(24/375*100vw);
}


.wrpCts{
	width: 100%;
}

.wrpMainContents section{
	padding: 0 calc(24/375*100vw);
}

section .ctsInner{
	padding: 0;
}

.wrpContents .txt{
	font-size: 12px;
}

.txtEx{
	margin-top: 8px;
}

body sup{
	font-size: 55%
}

/*--------------------------------------
mainVisual
--------------------------------------*/
.sectionMainVisual{
	overflow: hidden;
}

.mainVisual::before{
	display: none;
}

/*--------------------------------------
sectionConcern
--------------------------------------*/
.sectionConcern {
	padding-bottom:40px;
}

.sectionConcern h2 {
	font-size: 24px;
}

.sectionConcern .concernBox {
	width: 264px;
	margin: 0 auto;
}

.sectionConcern .concernBox .txtEx {
	line-height: calc(36/24);
	max-width: 230px;
	margin: 16px auto 0;
}

.sectionConcern .concernImg{
	max-width: 375px;
	margin: 0 auto;
	padding-top: 40px;
}

/*--------------------------------------
sectionProduct
--------------------------------------*/
.wrpProductContents .sectionProduct{
	padding: 47px 0 48px;
}

.sectionProduct .ctsInner{
	padding: 0;
	grid-template-columns: min(128px,calc(128/375*100%)) min(220px,calc(220/375*100%));
	justify-content: center;
	align-items: center;
	gap: 11px;
}

.sectionProduct .image{
	grid-area: 1 / 1 / 2 / 2;
	width: 93px;
	display: block;
	margin-left: auto;
}

.sectionProduct .ctsHeading{
	grid-area: 1 / 2 / 2 / 3;
	margin-bottom: auto;
	margin-top: 16px;
}

.sectionProduct .ctsHeading h2{
	font-size: 14px;
	margin-bottom: 13px;
}

.sectionProduct .ctsHeading p{
	width: 179px;
	margin-top: 17px;
}

.sectionProduct .detail{
	grid-area: 2 / 1 / 3 / 3;
	width: 100%;
	max-width: 348px;
	margin: 0 auto;
}

.sectionProduct .detail .text{
	max-width: 348px;
	margin: -7px auto 0;
	text-align: center;
}

.sectionProduct .txtEx{
	max-width: 284px;
	margin-top: 16px;
	margin-right: auto;
	margin-left: auto;
}

.effect .ctsBody .image+.txtEx+.text_center {
	font-size: 10px;
	margin-top: 8px;
}

/*--------------------------------------
sectionTurnover
--------------------------------------*/
.wrpMainContents .sectionTurnover{
	padding-top: 39px;
	padding-bottom: 40px;
}

.sectionTurnover .ctsHeading h2{
	font-weight: 700;
	font-size: 20px;
}

.sectionTurnover .txtEx{
	width: calc(278/375*100vw);
	margin: 8px auto 0;
}

.sectionTurnover .turnoverVideo{
	width: calc(278/375*100vw);
	margin: 15px auto 0;
}

/*--------------------------------------
sectionEffect
--------------------------------------*/
.wrpProductContents .sectionEffect{
	padding-bottom: 80px;
	margin-bottom: 0;
}

.sectionEffect .ctsInner{
	padding: 0;
}

.sectionEffect .max{
	max-width: 327px;
	margin: 0 auto;
}

.sectionEffect .ctsHeading h2{
	font-size: 17px;
}

.sectionEffect .ctsHeading h2 span{
	font-size: 23px;
}

.sectionEffect .image{
	margin-top: 18px;
}

.sectionEffect .txtEx{
	margin-top: 16px;
}

/*--------------------------------------
sectionPoint
--------------------------------------*/
.wrpMainContents .sectionPoint{
	padding: 0 0 80px;
}

.sectionPoint .wrpCts{
	padding: 0 calc(24/375*100vw);
	box-sizing: border-box;
}

.sectionPoint .ctsHeading{
	padding: 24px 0;
	box-shadow: 0 0 calc(6 / 375* 100vw) rgba(0, 0, 0, 0.16);
}

.sectionPoint .ctsHeading h2{
	font-size: 28px;
	line-height: calc(34/28);
}

.sectionPoint .boxPoint:nth-child(n+2){
	margin-top: 32px;
}

.sectionPoint .boxPoint{
	margin-top: 40px;
}

.sectionPoint .number{
	max-width: 260px;
	height: 41px;
	font-size: 17px;
	top: -41px;
}

.sectionPoint .boxPointCts{
	padding: 32px min(20px, calc(20/375*100vw)) 32px;
}

.sectionPoint .ttl{
	margin: 0 auto 16px;
	width: fit-content;
	white-space: nowrap;
	font-size: min(17px, calc(17/375*100vw));
}

.sectionPoint .image{
	margin: 16px auto 0;
}

.sectionPoint .video{
	margin-top: 22px;
}

.sectionPoint .videoTtl{
	font-size: 16px;
	margin-bottom: 9px;
}

/* 各ポイント */
.sectionPoint .boxPoint01 .image{
	max-width: 253px;
}

.sectionPoint .boxPoint01 .image + .txtEx{
	text-align: center;
}

.sectionPoint .boxPoint02 .boxPointCts{
	padding: 32px min(14px, calc(14/375*100vw)) 32px;
}

.sectionPoint .boxPoint02 .image{
	max-width: 223px;
}

/*--------------------------------------
sectionSilky
--------------------------------------*/
.wrpMainContents .sectionSilky{
	padding: 36px 0 32px;
}

.box_silky {
	display: grid;
	align-items: center;
	justify-content: center;
	grid-template-columns: min(65px, calc(65/375*100%)) min(251px, calc(251/375*100%));
	gap: 16px min(10px, calc(10/375*100%));
}

.box_silky .image{
	grid-area: 1 / 1 / 2 / 2;
}

.box_silky .fukidashi_wrap{
	grid-area: 1 / 2 / 2 / 3;
	margin-bottom: auto;
	margin-top: 8px;
}

.box_silky h4 :nth-child(1){
	font-size: 18px;
	font-weight: 700;
	color: #DE0067;
	line-height: calc(13/18);
	white-space: nowrap;
	margin-bottom: 9px;
}

.box_silky h4 :nth-child(1)::after{
	content: "";
	display: block;
	width: 160px;
	height: 11px;
	background-image: url('/hythiol/zh-Hans/products/hc2/img/sp/ttl_silky_effect.png');
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	margin-top: 5px;
	margin-left: 3px;
}

.box_silky h4 :nth-child(2){
	font-size: 18px;
	font-weight: 700;
	line-height: calc(23/15);
	letter-spacing: .1em;
}

.box_silky .txt_wrap{
	grid-area: 2 / 1 / 3 / 3;
	max-width: 285px;
	margin: 0 auto;
}

.box_silky .fukidashi {
	margin-bottom: 8px;
}

.box_silky .lead {
	margin-bottom: 10px;
}

.fukidashi {
	margin-bottom: 16px;
	padding-bottom: 24px;
}

.fukidashi::after {
	width: 180px;
}

/*--------------------------------------
sectionSize
--------------------------------------*/
.wrpMainContents .sectionSize{
    padding-top: 40px;
    padding-bottom: 40px;
}

.sectionSize .ctsHeading h2{
    font-size: 20px;
    white-space: nowrap;
}

.box_products .ctsHeading h2{
    font-size: 20px;
    font-weight: 600;
    margin-top: 0;
}

.box_products .ctsHeading h2 span{
    font-size: 26px;
}

.box_products>*:last-child {
    text-align: center;
    margin-top: 24px;
    display: block;
}

.box_products>*:last-child img {
    max-width: 333px;
}

.box_products::before {
    width: 300px;
    bottom: -64px;
    right: 0;
    left: 0;
    margin-left: auto;
    margin-right: auto;
}

.box_shine {
    margin-bottom: 36px;
}

.box_shine>*:last-child {
    margin-top: 20px;
}

.box_shine p {
    text-align: center;
    font-size: 16px;
    margin-bottom: 10px;
}

/*--------------------------------------
buy_wrap
--------------------------------------*/
.buy_ttl {
	position: relative;
	font-size: calc(16 / 375 * 100vw);
	margin-bottom: calc(16 / 375 * 100vw);
	margin-top: calc(24 / 375 * 100vw);
}

.buy_ttl::before,
.buy_ttl::after {
	width: 10%;
	height: 4px;
}

.buy_wrap {
	padding: 0 calc(24/375*100vw);
	padding-top: calc(16 / 375 * 100vw);
	padding-bottom: calc(20 / 375 * 100vw);
}

.buy_wrap .buy_img {
	margin-bottom: calc(16 / 375 * 100vw);
}

.box_cm .buy_ttl::before,
.box_cm .buy_ttl::after {
	width: 32%;
}

.particle01 {
	width: 171px;
	top: 12%;
}

.particle02 {
	width: 189.5px;
	top: 33%;
}

.particle03 {
	width: 187px;
	top: 44%;
}

.particle04 {
	width: 232.5px;
	top: 53%;
}

.particle05 {
	width: 248.5px;
	top: 68%;
}

.particle06 {
	width: 189.5px;
	top: 82%;
}

.mb_sp_20{
	margin-bottom: 20px;
}