@charset "utf-8";/**/




/* Top Page */
#qArea {
	margin-top: 10%;
	padding: 10% 0;
	background: #F3FFFE;
}

.qaBox li{
	margin:0 10%;
}

.qaBox .flickarrow_q1  ul{
	background-image:url(../../cleansing/image/flick_arrow_bg_q4.webp);
	background-repeat: no-repeat;
	background-position: center;
    background-size: 100%;
    margin: 5% 2% 0;
}

.qaBox .flickarrow_q2 , .flickarrow_q3  ul{
	background-image:url(../../cleansing/image/flick_arrow_bg_q2_3.webp);
	background-repeat: no-repeat;
	background-position: center;
    background-size: 100%;
    margin: 5% 2% 0;
}

.qaBox .flickarrow_q4 ul{
	background-image:url(../../cleansing/image/flick_arrow_bg_q1.webp);
	background-repeat: no-repeat;
	background-position: center;
    background-size: 100%;
    margin: 5% 2% 0;
}

#qalert{
	margin: 0 7%;
    color: #dc4961;
    text-indent: -1em;
    padding-left: 1em;
	    text-align: left;
}
#qContainer li {
	padding: 3% 0;
}

/* クレンジング誘導先ページ */

.cleansing202601{
text-align: center;
color: #232321;
margin: 0 auto;
max-width: 720px;
}
.cleansing202601 .cleansing_top{
background-size: cover;
padding: 10% 0 10%;
}

/***** メイン商品背景 出し分け *****/

.cleansing_top{
	    background-position: center 30%;
}



.cleansing_oi01 .cleansing_top,.cleansing_oi02 .cleansing_top{
background-image: url(../../cleansing/image/bg_oil.webp);

}

.cleansing_ba .cleansing_top{
background-image: url(../../cleansing/image/bg_ba.webp);
	
}
.cleansing_cr .cleansing_top{
background-image: url(../../cleansing/image/bg_cr.webp);
}
.cleansing_ho .cleansing_top{
background-image: url(../../cleansing/image/bg_ho.webp);
}
.cleansing_mi .cleansing_top{
background-image: url(../../cleansing/image/bg_mi.webp);
}

/***** メイン商材タイトル 出し分け *****/
.cleansing202601 .maintitle{
margin-bottom: 7%;
}

/***** メイン商材タイトル 出し分け *****/
.cleansing_itemname{
margin: 5%;
}
.cleansing_btn a:hover, .cleansing_btn_sub a:hover{
opacity: 0.85;
}
.cleansing_btn, .cleansing_btn_sub{
margin: 0 auto;
}
.cleansing_btn_sub{
width: 30%;
}
.subitem_img{
width: 60%;
margin: 0 auto;
padding: 3% 0 2%;
}

.cleansing202601 .name{
font-size: 1.3em;
margin-bottom: 3%;
}

.cleansing202601 .attention{
padding: 3% 3% 0;
text-align: right;
}

/***** 下部ボタンエリア 出し分け *****/
.btn_area{
margin-top: 5%;
padding: 4% 0;
background-color: #F3FFFE;
}
.btn_area .retry, .btn_area .skingate{
margin-bottom: 7%;
}
.cleansing202601 .reccommend{
padding: 5%;
}
.btn_area .retry,
.btn_area .skingate{
	width: 50%;
	margin: 0 auto;
	}


/*****商品大きさ調整 *****/
.cleansing_oi01 img{
	max-width: 50%;
}

.size{
	text-align: center;
}
.size img{
		max-width: 25%;
}
	.question{
		width: 70%;	
	}

/* ふわっとアニメ */
/* 動作を適用する箇所 */
.fuwatAnime { 
-webkit-animation-fill-mode:both; 
-ms-animation-fill-mode:both; 
animation-fill-mode:both; 
-webkit-animation-duration:2s; /* �A�j������ */
-ms-animation-duration:2s; 
animation-duration:2s; 
-webkit-transition-delay: 0.5s;/* �J�n���� */
-ms-transition-delay: 0.5s;
transition-delay: 0.5s;
-webkit-animation-name: fuwatAnime; /* �A�j���� */
-ms-animation-name: fuwatAnime; 
animation-name: fuwatAnime; visibility: visible !important; }

.fuwatAnime2 { 
-webkit-animation-fill-mode:both; 
-ms-animation-fill-mode:both; 
animation-fill-mode:both; 
-webkit-animation-duration:2.5s; /* �A�j������ */
-ms-animation-duration:2.5s; 
animation-duration:2.5s; 
-webkit-transition-delay: 1.5s;/* �J�n���� */
-ms-transition-delay: 1.5s;
transition-delay: 1.5s;
-webkit-animation-name: fuwatAnime2; /* �A�j���� */
-ms-animation-name: fuwatAnime2; 
animation-name: fuwatAnime2; visibility: visible !important; }

.fadeIn_r_Anime { 
-webkit-animation-fill-mode:both; 
-ms-animation-fill-mode:both; 
animation-fill-mode:both; 
-webkit-animation-duration:1.5s; /* �A�j������ */
-ms-animation-duration:1.5s; 
animation-duration:1.5s; 
-webkit-transition-delay: 0.0s;/* �J�n���� */
-ms-transition-delay: 0.0s;
transition-delay: 0.0s;
-webkit-animation-name: fadeIn_r_Anime; /* �A�j���� */
-ms-animation-name: fadeIn_r_Anime; 
animation-name: fadeIn_r_Anime; visibility: visible !important; }

.fadeIn_l_Anime { 
-webkit-animation-fill-mode:both; 
-ms-animation-fill-mode:both; 
animation-fill-mode:both; 
-webkit-animation-duration:1.5s; /* �A�j������ */
-ms-animation-duration:1.5s; 
animation-duration:1.5s; 
-webkit-transition-delay: 0.0s;/* �J�n���� */
-ms-transition-delay: 0.0s;
transition-delay: 0.0s;
-webkit-animation-name: fadeIn_l_Anime; /* �A�j���� */
-ms-animation-name: fadeIn_l_Anime; 
animation-name: fadeIn_l_Anime; visibility: visible !important; }

.fadeIn_ru_Anime { 
-webkit-animation-fill-mode:both; 
-ms-animation-fill-mode:both; 
animation-fill-mode:both; 
-webkit-animation-duration:1.5s; /* �A�j������ */
-ms-animation-duration:1.5s; 
animation-duration:1.5s; 
-webkit-transition-delay: -0.5s;/* �J�n���� */
-ms-transition-delay: -0.5s;
transition-delay: -0.5s;
-webkit-animation-name: fadeIn_ru_Anime; /* �A�j���� */
-ms-animation-name: fadeIn_ru_Anime; 
animation-name: fadeIn_ru_Anime; visibility: visible !important; }

.fadeIn_lu_Anime { 
-webkit-animation-fill-mode:both; 
-ms-animation-fill-mode:both; 
animation-fill-mode:both; 
-webkit-animation-duration:1.5s; /* �A�j������ */
-ms-animation-duration:1.5s; 
animation-duration:1.5s; 
-webkit-transition-delay: -0.5s;/* �J�n���� */
-ms-transition-delay: -0.5s;
transition-delay: -0.5s;
-webkit-animation-name: fadeIn_lu_Anime; /* �A�j���� */
-ms-animation-name: fadeIn_lu_Anime; 
animation-name: fadeIn_lu_Anime; visibility: visible !important; }

/* 動作内容 */
@-webkit-keyframes fuwatAnime {
 0% { opacity: 0; -webkit-transform: translateY(-150px);  }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@-webkit-keyframes fuwatAnime2 {
 0% { opacity: 0; -webkit-transform: translateY(-200px); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@-webkit-keyframes fadeIn_r_Anime {
 0% { opacity: 0; -webkit-transform: translateX(300px); }
 100% { opacity: 1; -webkit-transform: translateX(0); width:720px; }
}
@-webkit-keyframes fadeIn_l_Anime {
 0% { opacity: 0; -webkit-transform: translateX(-300px); }
 100% { opacity: 1; -webkit-transform: translateX(0); width:720px; }
}
@-webkit-keyframes fadeIn_ru_Anime {
 0% { opacity: 0; -webkit-transform: translateX(300px) translateY(200px); }
 100% { opacity: 1; -webkit-transform: translateX(0); width:720px; }
}
@-webkit-keyframes fadeIn_lu_Anime {
 0% { opacity: 0; -webkit-transform: translateX(-300px) translateY(200px); }
 100% { opacity: 1; -webkit-transform: translateX(0); width:720px; }
}


@keyframes fuwatAnime {
 0% { opacity: 0; -webkit-transform: translateY(-150px); -ms-transform: translateY(-150px); transform: translateY(-150px); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}
@keyframes fuwatAnime2 {
 0% { opacity: 0; -webkit-transform: translateY(-200px); -ms-transform: translateY(-200px); transform: translateY(-200px); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}
@keyframes fadeIn_r_Anime {
 0% { opacity: 0.5;/* ���� */ -webkit-transform: translateX(300px) ; -ms-transform: translateX(300px); transform: translateX(300px);/*X���i�E���Ɂj������300px */}
100% { opacity: 1;/* �s���� */ -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); width: ; }
}
@keyframes fadeIn_l_Anime{
 0% { opacity: 0.5; -webkit-transform: translateX(-300px); -ms-transform: translateX(-300px); transform: translateX(-300px);}
 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); width: ; }
}
@keyframes fadeIn_ru_Anime {
 0% { opacity: 0.5; -webkit-transform: translateX(300px) translateY(200px); -ms-transform: translateX(300px) translateY(200px); transform: translateX(300px) translateY(200px);}
100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); width: ; }
}
@keyframes fadeIn_lu_Anime{
 0% { opacity: 0.5; -webkit-transform: translateX(-300px) translateY(200px); -ms-transform: translateX(-300px) translateY(200px); transform: translateX(-300px) translateY(200px);}
 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); width: ; }
}

@media screen and (max-width:768px){
	
	/* Top Page */
	#qalert{
		font-size: 0.85em;
	}

	.cleansing202601 .maintitle{
	padding: 0 5%;
	}

	.cleansing_btn_sub,.cleansing_btn{
	width: 60%;
	}
	.subitem_img{
	width: 75%;
	margin-top: 1%;
	}
	.cleansing202601 .name{
	font-size: 1.0em;
	margin: 2% 5% 4%;
	}
	.cleansing202601 .attention{
	font-size: 0.5em;
	}

	.btn_area{
	padding: 12% 8% 4%;
	}

	.cleansing202601 .reccommend{
		width: 90%;
	}
	

/*****商品大きさ調整 *****/
.cleansing_oi01 img{
	max-width: 100%;
}
.size img{
	max-width: 38%;
}

	
}