@charset "UTF-8";
/* CSS Document */
/* common
-------------------------------------------------- */
body {
	font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "Hiragino Sans", "sans-serif";
}
section .inner {
	position: relative;
	font-size:10px;
}
section .note {
	text-align: right;
	font-size: 0.625rem;
	color: #1f2774;
	line-height: 1.4;
}
@media only screen and (max-width: 640px) {
/*---- 	for-sp  ----*/
	body { font-size:8px;}
	section .note {
		text-align: left;
	}
}


/* on / off
-------------------------------------------------- */
.sec--ttl { 
	position:relative;
	margin-bottom: 3em;
	padding-bottom: 4.5em;
	background: url("../../img/product/shapemoist/moist_c/img_dot.png") center bottom no-repeat;
	background-size:auto 12px;
}
.sec--ttl h2 img {
	display: block;
	margin:0 auto;
} 
@media only screen and (min-width: 641px) {
	/*---- 	for-tb ----*/
	.tb, .pc {
		display: block;
	}
	.sp, .onlypc {
		display: none;
	}
	section .inner {
		margin: 0 auto;
		max-width: 1024px;
	}
	.sec--ttl h2 img { height:31px; width:auto;}
}
@media only screen and (min-width: 641px) and (max-width: 979px) {
	/*---- 	for-tb ----*/
	/*img { width:100%; height:auto;}*/
	section .inner {
		margin: 0 2%;
	}
}
@media print, screen and (min-width: 980px) {
	/*---- for-pc ----*/
	.onlypc {
		display: block;
	}
	.tb, .sp {
		display: none;
	}
}
@media only screen and (max-width: 640px) {
	/*---- 	for-sp  ----*/
	.sp {
		display: block;
	}
	.tb, .pc {
		display: none;
	}
	
	.sec--ttl {
		margin-bottom:2.5em;
		padding-bottom:2.3em;
	}
	.sec--ttl img { height:25px; width:auto;}
	
	section .inner {
		margin: 0 4%;
	}
}


/* moist--kv
-------------------------------------------------- */
@media only screen and (min-width: 641px) {
	/*---- 	for-tb ----*/
	.moist--kv .inner {
		max-width: 1366px;
		text-align: center;
	}
	.moist--kv .inner img {
		width: 100%;
		height: auto;
	}
}
@media only screen and (min-width: 641px) and (max-width: 979px) {
	/*---- 	for-tb ----*/
	.moist--kv .inner {
		margin: 0 auto;
	}
}
@media print, screen and (min-width: 980px) {
	/*---- for-pc ----*/
}
@media only screen and (max-width: 640px) {
	/*---- 	for-sp  ----*/
	.moist--kv .inner {
		margin: 0 auto;
	}
}


/* .moist--award
-------------------------------------------------- */
.moist--award {
	text-align: center;
	background: url("../../img/product/shapemoist/moist_c/bg_award.jpg") center no-repeat;
	background-size: cover;
}
@media only screen and (min-width: 641px) {
	/*---- 	for-tb ----*/
	.moist--award .inner {
		padding: 2.225rem 0 2rem;
	}
	.moist--award .award--ttl {
		margin: 0 auto 1.5rem;
		text-align:center;
	}
	.moist--award .award--ttl img { display: block; width:auto; height:185px; margin:0 auto;}
	.moist--award .ul--award01 {
		display: flex;
		justify-content: center;
		align-items: flex-end;
		margin-bottom: 2.5rem;
	}
	.moist--award .ul--award01 li {
		width:20%;
		padding: 0 1.5rem;
	}
	.moist--award .ul--award01 li:nth-child(1) { width:18.155%;}
	.moist--award .ul--award01 li img { width:100%;}
}
@media only screen and (min-width: 641px) and (max-width: 979px) {
	/*---- 	for-tb ----*/
	.moist--award .award--ttl {
		margin: 0 8.5% 1.5rem;
	}
	.moist--award .award--ttl img {
		width: 100%;
		height: auto;
	}
}
@media print, screen and (min-width: 980px) {
	/*---- for-pc ----*/
	.moist--award .inner {
		padding: 3.625rem 0 2rem;
	}
}
@media only screen and (max-width: 640px) {
	/*---- 	for-sp  ----*/
	.moist--award {
		padding: 2rem 0 2rem;
		background-size: cover;
	}
	.award--ttl {
		margin: 0 2.2% 20px;
	}
	.ul--award01 {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		margin: 0 auto 2rem;
		align-items: flex-end;
	}
	.ul--award01 li {
		width: 38%;
		padding: 0 3% 1rem;
	}
	.ul--award01 li:nth-child(1) {
		/*width:100%;*/
	}
	.ul--award01 li:nth-child(1) img { /*width:38%;*/}
}


/* moist--intro
-------------------------------------------------- */
.moist--intro {
	background:#fff484;
}
.moist--intro .btn--buy,
.buy--mid {
	position: relative;
	margin: 0 16.3265%;
}
.buy--mid {
	margin: 0 8.3265%;
}
.moist--intro .btn--buy::before,
.buy--mid::before {
	content: '';
	width: 32px;
	height: 1px;
	position: absolute;
	right: -25px;
	top: 50%;
	margin-top: -2px;
	background:#01a9e3;
}
.moist--intro .buy--text::before { height: 0;}
.moist--intro .buy--text {
	padding: .5em;
	font-size:1.5em;
	text-align: center;
	line-height: 2;
}


.buy-tooltip {
	position: relative;
}
.dark-tooltip.north.medium .tip {
	border-width: 0 37px 11px 37px;
	margin-left: -37px;
	margin-top: -11px;
}
.dark-tooltip.dark {
	text-align: center;
	background: #1f2774;
}
.dark-tooltip.dark.north .tip {
	border-color: transparent transparent #1f2774 transparent;
}
.dark-tooltip p {
	text-align: center;
}
.dark-tooltip .buy-list {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 290px;
}
.dark-tooltip.medium {
	padding: 18px 15px;
	border-radius: 10px;
}
.dark-tooltip .buy-list li {
	width: 47.5%;
	padding: 0;
	float: none;
	border-radius: 0;
	background: none;
	margin: 12px 0 0;
}
.buy-list li:nth-child(2) {
	margin-bottom: 0;
}
.dark-tooltip .second {
	margin-top: 15px;
	padding-top: 15px;
	border-top: 1px solid #fff;
}
.dark-tooltip .buy-list li a {
	padding: 0;
	background: none;
}

.moist--intro .sec--ttl {
	max-width:505px;
	height:auto;
	margin:0 auto 0.5em;
	background:none;
}
.moist--intro .sec--ttl img { width:100%; height:auto;}

.item--ul01 {}
.item--ul01 li {
	padding:10px 10px 20px 20px;
	background:#fff;
	-moz-box-shadow: 0px 0px 10px 3px rgba(211, 197, 55, 0.5);
	-webkit-box-shadow: 0px 0px 10px 3px rgba(211, 197, 55, 0.5);
	-ms-box-shadow: 0px 0px 10px 3px rgba(211, 197, 55, 0.5);
	box-shadow: 0px 0px 10px 3px rgba(211, 197, 55, 0.5);
}
.item--ul01 li .li--inner {
	display:flex;
	justify-content: space-between;
	margin-bottom: 1.8em;
}
.item--photo { 
	width:47%;
	padding:2em 1.8em 2em 0;
}
.item--icn { width:70%; margin-bottom:1em;}
.item--genle {
	margin-bottom:1em;
	font-size:1.7em;
	color: #7a7a7a;
}
.item--name {
	margin-bottom:0.5em;
	font-size:2.8em;
	line-height: 1.2;
}
.item--price {
	margin-bottom:1.1em;
	font-size:1.5em;
}
.item--sencitive {}
.item--sencitive img {
	height:24px; width:auto;
}

@media only screen and (min-width: 641px) {
/*---- 	for-tb ----*/
	.moist--intro {
		padding:5.5em 0 5em;
	}
	
	.item--ul01 {
		display:flex;
		justify-content: space-between;
		margin:0 -20px;
	}
	.item--ul01 li {
		width:45.63257%;
	}

}
@media only screen and (min-width: 641px) and (max-width: 979px) {
/*---- 	for-tb ----*/

}
@media print, screen and (min-width: 980px) {
/*---- for-pc ----*/

}
@media only screen and (max-width: 640px) {
/*---- 	for-sp  ----*/

}
@media only screen and (max-width: 640px) {
/*---- 	for-sp  ----*/
	
	.moist--intro { padding:5em 0 2.5em;}
	.moist--intro .sec--ttl { margin:0 5% 2.4em; padding-bottom:0;}
	
	.item--ul01 li { font-size:8px;}
	.item--ul01 li:nth-child(1) {
		margin-bottom:3.8em;
	}
	
	.moist--intro .btn--buy {
		margin:2.4em 8% 0;
	}
	
	.item--sencitive {}
	.item--sencitive img {
		height:18px; width:auto;
	}
	
	.moist--intro .buy--text {
		margin-top:.2em;
		padding: 0;
		font-size:1.8em;
		text-align: center;
		line-height: 2;
	}
}




/* moist--intro02
-------------------------------------------------- */
@media only screen and (min-width: 641px) {
/*---- 	for-tb ----*/
}
@media only screen and (min-width: 641px) and (max-width: 979px) {
/*---- 	for-tb ----*/
}
@media print, screen and (min-width: 980px) {
/*---- for-pc ----*/
}
@media only screen and (max-width: 640px) {
/*---- 	for-sp  ----*/
}



/* moist--checklist
-------------------------------------------------- */
.moist--checklist {
	padding: 6.25em 0 5.25em;
	background:#fff484 url("../../img/product/shapemoist/moist_c/bg_checklist.png") center bottom no-repeat;
	background-size:cover;
}
.moist--checklist .inner {}
.moist--checklist .sub--ttl {
	margin:0 auto 4em;
}
.moist--checklist .sub--ttl img {
	display:block;
	height:25px; 
	width:auto;
	margin:0 auto;
}

.checklist--inner ul {
	position:relative;
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin:0 auto 6em;
}
.checklist--inner ul li {}

.checklist--inner ul::before {
	content:"";
	position:absolute;
	right:-38px;
	top:-126px;
	width:195px;
	height:83px;
	background: url("../../img/product/shapemoist/moist_c/icn_check_list.png") center center no-repeat;
	background-size:100% auto;
}

.check--txt01 {
	text-align: center;
}
.check--txt01 img {
	display:block;
	width:214px;
	margin:0 auto 5em;
}

.checklist--inner p {
	text-align: center;
}
.checklist--inner p img {
	max-width:550px;
	margin:0 auto;
}
@media only screen and (min-width: 641px) and (max-width: 979px) {
/*---- 	for-tb ----*/
}
@media only screen and (min-width: 480px) and (max-width: 768px) {
/*---- 	for-ipad ----*/
	.checklist--inner ul {
		max-width:80%;
	}
	.checklist--inner ul::after {
		right: 0;
		right: -11%;
    	bottom: -66px;
		width:88px;
		height:142px;
		background-size: 100% auto;
	}
}
@media only screen and (min-width: 641px) and (max-width: 979px) {
/*---- 	for-tb ----*/
}
@media print, screen and (min-width: 980px) {
/*---- for-pc ----*/
}
@media only screen and (max-width: 640px) {
/*---- 	for-sp  ----*/
	.moist--checklist {
		padding:3.8em 0 2.5em;
		background-size: 120% 100%;
	}
	
	.moist--checklist .sec--ttl .sub--ttl img {
		max-width:74%;
		margin-bottom: 2rem;
	}
	.checklist--inner ul {
		display:block;
		width:90%;
		max-width: none;
		margin:0 auto 3rem;
	}
	.checklist--inner ul li {
		width:100%;
		margin-bottom:1.1rem;
	}
	.checklist--inner ul li img {
		width:100%; height: auto;
	}
	.checklist--inner ul::after { width:0;}
	
	.checklist--inner ul::before {
		right: -4.8%;
   		top: -25px;
		width:90px;
		height:38px;
		background: url("/img/product/shapemoist/lotion_milk_2021/icn_check_list.png") center center no-repeat;
		background-size:cover;
	}
	
	.check--txt01 img {
		width:45%;
		margin:0 auto 5em;
	}
}


/* btn追加　21/10/09
-------------------------------------------------- */
.buy--mid {
	margin-top:25px;
}
.buy--mid {}
@media only screen and (min-width: 641px) {
/*---- 	for-tb ----*/
}
@media only screen and (min-width: 641px) and (max-width: 979px) {
	/*---- 	for-tb ----*/
}
@media print, screen and (min-width: 980px) {
	/*---- for-pc ----*/
}
@media only screen and (max-width: 640px) {
	/*---- 	for-sp  ----*/
}


/* moist--point
-------------------------------------------------- */
.moist--point {
	padding:3em 0 6em;
	background:#fff484;
}
@media only screen and (min-width: 641px) {
/*---- 	for-tb ----*/
	.ul--point01 {
		display:flex;
		justify-content: space-between;
		margin: 2em 0 0;
	}
	.ul--point01 li {
		width:50%;
	}
}
@media only screen and (min-width: 641px) and (max-width: 979px) {
	/*---- 	for-tb ----*/
}
@media print, screen and (min-width: 980px) {
/*---- for-pc ----*/
	.ul--point01 {
		margin:2em -20px 0;
	}
}
@media only screen and (max-width: 640px) {
/*---- 	for-sp  ----*/
	.moist--point { padding-top:1.2em;}
	.moist--point .inner { margin:0 0;}
}



/* 
-------------------------------------------------- */
@media only screen and (min-width: 641px) {
/*---- 	for-tb ----*/
	.moist--ans .inner,
	.moist--more .inner {
		max-width: 1366px;
    	text-align: center;
	}
}
@media only screen and (min-width: 641px) and (max-width: 979px) {
/*---- 	for-tb ----*/
}
@media print, screen and (min-width: 980px) {
/*---- for-pc ----*/
}
@media only screen and (max-width: 640px) {
/*---- 	for-sp  ----*/
	.moist--ans .inner,
	.moist--more .inner {
		width: 100%;
    	margin:0 ;
	}
	.moist--ans {
		margin-top:-74%;
		background: #fff484;
	}
	.moist--more .inner { padding-bottom:2.5em;}
	
	
}


/* lineup--moist_c
-------------------------------------------------- */
.lineup--moist_c {
	background: #fff484;
}
.ttl--moist_c_lineup {}
.ul--lineup--moist_c {
	display: flex;
}
.ul--lineup--moist_c li {
	font-weight: 500;
	text-align: center;
	background: #fff;
	-moz-box-shadow: 5px 5px 16px 0px rgba(211, 197, 55, 0.55);
	-webkit-box-shadow: 5px 5px 16px 0px rgba(211, 197, 55, 0.55);
	-ms-box-shadow: 5px 5px 16px 0px rgba(211, 197, 55, 0.55);
	box-shadow: 5px 5px 16px 0px rgba(211, 197, 55, 0.55);
}
.moist_c--photo {}
.moist_c--genre {
	color: #7a7a7a;
	font-size:1.1em;
}
.moist_c--name { 
	padding:.5em 0;
	font-weight: bold;
	line-height: 1.3;	
}
.moist_c--price {}
.moist_c--sencitive {
	margin:.7em 7% .8em;
}
.moist_c--btn a {
	display: block;
	margin:0 7% 1.4em;
	padding:1.4em 2em 1.4em 1em;
	font-size:12px;
	font-weight: 700;
	color: #fff;
	background:url("../../img/product/shapemoist/moist-c-lineup/bg_btn_sp.png") center center no-repeat;
	background-size: 100% auto;
}
@media only screen and (min-width: 641px) {
	/*---- 	for-tb ----*/
	.lineup--moist_c {
		padding: 0 0 4.55em;
	}
	.ttl--moist_c_lineup {
		max-width:566px;
		margin:0 auto 1.2em;
	}
	.ul--lineup--moist_c {
		justify-content: space-between;
		max-width:1180px;
		margin:0 auto;
	}
	.ul--lineup--moist_c li {
		width:18.5%;
	}
	.ul--lineup--moist_c li:nth-child(3) .moist_c--photo,
	.ul--lineup--moist_c li:nth-child(4) .moist_c--photo,
	.ul--lineup--moist_c li:nth-child(5) .moist_c--photo { padding-top:3.7%;}
	.moist_c--photo {}
	.moist_c--genre {}
	.moist_c--name {}
	.moist_c--price { font-size:13px;}
	.moist_c--sencitive {}
	.moist_c--sencitive .icn {}
	.moist_c--sencitive .txt {}
}
@media print, screen and (min-width: 980px) {
	/*---- for-pc ----*/
}
@media only screen and (max-width: 640px) {
	/*---- 	for-sp  ----*/
	.lineup--moist_c {}
	.ttl--moist_c_lineup {}
	.ul--lineup--moist_c {
		justify-content: center;
		flex-wrap: wrap;
		margin:0 5.3% 0;
	}
	.ul--lineup--moist_c li {
		width:47.761194%;
		margin:0 0 3em 4.477%;
		background: #fff;
	}
	.ul--lineup--moist_c li:nth-child(odd) { margin-left: 0;}
	.moist_c--photo {}
	.moist_c--genre {
		font-size:11px;
	}
	.moist_c--name {
		font-size:3.4vw;
	}
	.moist_c--price {
		font-size:10px;
	}
	.moist_c--sencitive {}
	.moist_c--sencitive .icn {}
	.moist_c--sencitive .txt {}
}


/* 
-------------------------------------------------- */
@media only screen and (min-width: 641px) and (max-width: 979px) {
	/*---- 	for-tb ----*/
}
@media only screen and (min-width: 641px) and (max-width: 979px) {
	/*---- 	for-tb ----*/
}
@media print, screen and (min-width: 980px) {
	/*---- for-pc ----*/
}
@media only screen and (max-width: 640px) {
	/*---- 	for-sp  ----*/
}


/* 
-------------------------------------------------- */
@media only screen and (min-width: 641px) and (max-width: 979px) {
	/*---- 	for-tb ----*/
}
@media only screen and (min-width: 641px) and (max-width: 979px) {
	/*---- 	for-tb ----*/
}
@media print, screen and (min-width: 980px) {
	/*---- for-pc ----*/
}
@media only screen and (max-width: 640px) {
	/*---- 	for-sp  ----*/
}


/* 
-------------------------------------------------- */
@media only screen and (min-width: 641px) and (max-width: 979px) {
	/*---- 	for-tb ----*/
}
@media only screen and (min-width: 641px) and (max-width: 979px) {
	/*---- 	for-tb ----*/
}
@media print, screen and (min-width: 980px) {
	/*---- for-pc ----*/
}
@media only screen and (max-width: 640px) {
	/*---- 	for-sp  ----*/
}