/* --------------------------------------------------
 * 
 * .indextopdeco
 * 
 * --------------------------------------------------
 */



.indextopdeco{
	position:absolute;
	top:0;
	margin-left:265px;

	}

@media screen and (max-width: 768px) {
.indextopdeco{
	margin-left:280px;

	 }




}
@media screen and (max-width: 700px) {
.indextopdeco img{
	width:100%;
	height:auto;
	margin:0;
	}

}
@media screen and (max-width: 499px) {

.indextopdeco {
	display:none;
	}
	

}


/* --------------------------------------------------
 * 
 * .main-area
 * 
 * --------------------------------------------------
 */





 .main-area {
	 padding:0;
/*     
	 margin-top:65px;
	 margin-left:-37px;
     */


	 }
 .main-area h2{
	 margin-top:0;
	 margin-bottom:0;
	 padding:0;
	 clear:both;
	 }
 .main-area h3{
/* 	 margin-bottom:56px;*/
/*	margin-bottom:4.66667%;
     */
	 margin-top:0;
	 margin-bottom:0;
	 padding:0;
	 clear:both;
	 }
/*
@media screen and (min-width: 1200px) { 
 .main-area h3{
	margin-bottom:56px;
}
}
	
*/	
	
	
.main-area h2 img, 
.main-area h3 img {
	margin: 0 auto;
	text-align: center;
}


@media screen and (max-width: 800px) {
 .main-area {
	 margin-left:0;
	 }

}

/*
@media screen and (max-width: 640px) {
 .main-area {
	 margin-top:0;
	 }

.main-area h3 {
	background-image:url(/commons/img/index/main-msg-s.png);
	background-position:top center;
	background-repeat:no-repeat;
	

        height:0;
        padding-top:21.403%; 
        background-size:contain;
    }
	 
.main-area h3 img {
	display:none;
}

}
*/
/* 122px÷570px×100=21.403...% */

/* --------------------------------------------------
 * 
 * .index-itemmenu-box
 * 
 * --------------------------------------------------
 */

.index-itemmenu-box {
	padding: 0;
	text-align:center;
	margin: 0 auto;
	max-width: 900px;
	box-sizing: border-box;
}
.index-itemmenu-box-inner {
	margin: 0 auto 5vh;
}
.index-itemmenu-box-inner ul{
    display: flex;
    justify-content: space-between;

} 
.index-itemmenu-box-inner ul li{
    padding-left:1.5%;
    padding-right:1.5%;
    box-sizing: border-box;
} 
.index-itemmenu-box-inner ul li:first-child{
    padding-left:0;
} 
.index-itemmenu-box-inner ul li:last-child{
    padding-right:0;
} 

@media screen and (max-width: 640px) { 
.index-itemmenu-box {
    padding-left:5%;
    padding-right:5%;
}
.index-itemmenu-box-inner ul{
    flex-wrap: wrap;
    align-items: baseline;

} 
.index-itemmenu-box-inner ul li{
    width: 50%;
    padding-left:5%; 
    padding-right:5%;
    margin-top: 5vh;
} 
.index-itemmenu-box-inner ul li:nth-child(odd){
    padding-left: 0;
 }    
 .index-itemmenu-box-inner ul li:nth-child(even){
    padding-right: 0;
 } 

    
}
/*

.index-itemmenu-box {
	padding: 0;
	text-align:center;
	margin: 0 auto;
	max-width: 900px;
	box-sizing: border-box;
}
.index-itemmenu-box-inner ul{
	margin: 0 auto 25px;
	text-align: justify;
	text-justify: distribute-all-lines;
}
.index-itemmenu-box-inner ul:after {
	content:"";
	display: inline-block;
	width: 100%;
	line-height:0;
	height: 0;
}

.index-itemmenu-box-inner ul li{
	display: inline-block;
	vertical-align:middle;
}

.index-itemmenu-box-inner ul li img{
	max-width: 167px;
	width: 100%;
	height: auto;
}
@media screen and (max-width: 900px) { 
.index-itemmenu-box-inner ul{
	text-align: center;
	margin-top: -15px;
}
.index-itemmenu-box-inner ul li{
	margin-top: 15px;
}
	
.index-itemmenu-box-inner ul:first-of-type li{
	width: 32%;
}
.index-itemmenu-box-inner ul:last-of-type li{
	width: 24%;
	min-height: 270px;
}
	
}	
@media screen and (max-width: 700px) { 
	
.index-itemmenu-box-inner ul:first-of-type li{
	width: 47.5%;
}
.index-itemmenu-box-inner ul:first-of-type li.index-itemmenu-box-center{
	width: 100%;
}
.index-itemmenu-box-inner ul:last-of-type li{
	width: 47.5%;
	min-height:auto;
}
	
}	
@media screen and (max-width: 400px) { 
.index-itemmenu-box-inner ul li{
		padding-left: 1px;
		padding-right: 1px;
	}
.index-itemmenu-box-inner ul:first-of-type li.index-itemmenu-box-center{
	width: 47.5%;
	margin-left: 23.75%;
	margin-right: 23.75%;
	box-sizing: border-box;
}

	
}	

@media screen and (max-width: 640px) { 
.index-itemmenu-box{
	margin-left: 3.5%;
	margin-right: 3.5%;
	}

}	*/
.item-info h1,
.index-itemmenu-box-inner h4 {
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", "YuMincho", "Sawarabi Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	color: #1e50a5;
	padding: 2% 0;
	margin: 0 auto;
	text-align: center;
	letter-spacing: 0.25em;
/*	letter-spacing: 0.5em;*/
	font-size: 1.5em;
	font-weight: bold;
}
.item-info h1:before,
.index-itemmenu-box-inner h4:before{
	content: "";
	background-image: url(/commons/img/index/line.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: contain;
	max-width: 960px;
	display: block;
	height: 15px;
	width: 100%;
	margin-bottom: 5px;

}
.item-info h1:after,
.index-itemmenu-box-inner h4:after{
	content: "";
	background-image: url(/commons/img/index/line.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: contain;
	max-width: 940px;
	display: block;
	height: 15px;
	width: 100%;
	margin-top: 5px;

}


.item-info h1.lineg,
.index-itemmenu-box-inner h4.lineg {
	color: #008944;
}
.item-info h1.lineg:before,
.index-itemmenu-box-inner h4.lineg:before{
	background-image: url(/commons/img/index/line_g.png);

}
.item-info h1.lineg:after,
.index-itemmenu-box-inner h4.lineg:after{
	background-image: url(/commons/img/index/line_g.png);
}

.index-itemmenu-box-inner h4.lineg {
    margin-top:5vh;

}



.zenseibun{
	display:block;
	text-align: center;
	margin: 22px auto auto;
	}
/*
.zenseibun a img.img-responsive-overwrite{
	max-width: 138px;
}
*/
/* --------------------------------------------------
 * 
 * sample
 * 
 * --------------------------------------------------
 */

.index-sample-entry{
	 max-width:940px;
	 min-height:190px;
/*	 overflow:hidden;*/
	 margin:52px auto 48px;
	 padding:0;
	 box-sizing:border-box;
	 text-align:center;

 	 }

.index-sample-entry img.sample-annnai{
	width:100%;
	height:auto;
	margin:0;
	max-width:940px;
	}
.index-sample-entry img.sample-annnai:last-of-type{
	display: none;
	}

 @media screen and (max-width: 939px) {
.index-sample-entry{
	padding-left:1%;
	padding-right:1%;
}
}
 @media screen and (max-width: 799px) {
.index-sample-entry{
	 margin:7% auto 0;
}
}
 @media screen and (max-width: 599px) {
.index-sample-entry{
	 margin:7% auto 10%;
}
.index-sample-entry img.sample-annnai:first-of-type{
	display: none;
	}
.index-sample-entry img.sample-annnai:last-of-type{
	display: block;
	}
}

@media screen and (max-width: 480px) {
.index-sample-entry{
	 margin:7% auto 0%;
}

}

/*
.index-itemmenu-box-inner ul li a+span.zenseibun{
	display: none;
}*/

/* --------------------------------------------------
 * 
 * index-banner-entry
 * 
 * --------------------------------------------------
 */

.index-banner-entry{
	 max-width:940px;
/*	 min-height:190px;
	 overflow:hidden;*/
	 margin:52px auto 48px;
	 padding:0;
	 box-sizing:border-box;
	 text-align:center;

 	 }

.index-banner-entry img.banner-annnai{
	width:100%;
	height:auto;
	margin:0;
	max-width:940px;
	}
.index-banner-entry img.banner-annnai:last-of-type{
	display: none;
	}

 @media screen and (max-width: 939px) {
.index-banner-entry{
	padding-left:1%;
	padding-right:1%;
}
}
 @media screen and (max-width: 799px) {
.index-banner-entry{
	 margin:-2% auto 2%;
/*	 margin:-2% auto -2%;*/
}
}
 @media screen and (max-width: 639px) {
.index-banner-entry{
	 margin:-3.5% auto 3%;
/*	 margin:-2% auto -2%;*/
}
}


 @media screen and (max-width: 599px) {
.index-banner-entry{
	 margin:-5% auto 2%;
}
.index-banner-entry img.banner-annnai:first-of-type{
	display: none;
	}
.index-banner-entry img.banner-annnai:last-of-type{
	display: block;
	}	 
	 
	 
}

@media screen and (max-width: 480px) {
.index-banner-entry{
	 margin:5% auto 2%;
}

}
@media screen and (max-width: 399px) {
.index-banner-entry{
	 margin:0 auto 0;
}
}
@media screen and (max-width: 349px) {
.index-banner-entry{
	 margin:-5% auto 2%;
}
}
@media screen and (max-width: 299px) {
.index-banner-entry{
	 margin:-10% auto 2%;
}
}



/* --------------------------------------------------
 * 
 * banner
 * 
 * --------------------------------------------------
 */

.index-banner{
	 max-width:940px;
	 min-height:190px;
/*	 overflow:hidden;*/
	 margin:-2% auto 48px;
	 padding:0;
	 box-sizing:border-box;
	 text-align:center;

 	 }



.index-banner img.indexbnr{
	width:100%;
	height:auto;
	margin:0;
	max-width:940px;
	}
 @media screen and (max-width: 939px) {
.index-banner{
	padding-left:1%;
	padding-right:1%;

}
}
 @media screen and (max-width: 939px) {
.index-banner{
	padding-left:1px;
	padding-right:1px;
}


}
 @media screen and (max-width: 799px) {
.index-banner{
	 margin:-2% auto -2%;
}
}
 @media screen and (max-width: 599px) {
.index-banner{
	 margin:-5% auto -5%;
}
}
@media screen and (max-width: 480px) {
.index-banner{
	 margin:-5% auto -15%;
}

}
@media screen and (max-width: 399px) {
.index-banner{
	 margin:-25% auto -25%;
}
}
@media screen and (max-width: 330px) {
.index-banner{
	 margin:-40% auto -35%;
}
}








/* --------------------------------------------------
 * 
 * .index-menu
 * 
 * --------------------------------------------------
 */

 .index-menu{

	text-align:center;
	margin: 0 auto;
	}

 .index-menu .index-menu-inner{
	 margin-bottom:50px;
	}

 .index-menu .index-menu-inner {
	padding: 0;
	text-align:center;
	margin: 0 auto;
	box-sizing: border-box;
	max-width: 940px;
}
 .index-menu .index-menu-inner.second{
	max-width: 960px;
	 margin-bottom: 25px;
}
 .index-menu .index-menu-inner ul{
	margin: 0 auto 0;
	text-align: justify;
	text-justify: distribute-all-lines;
}
 .index-menu .index-menu-inner ul:after {
	content:"";
	display: inline-block;
	width: 100%;
	line-height:0;
	height: 0;
}

 .index-menu .index-menu-inner ul li{
	display: inline-block;
	vertical-align:middle;
	margin-top: 15px;
	 width: 24.5%;
}

.index-menu-inner ul li img{
	max-width: 222px;
	width: 100%;
	height: auto;
}
.index-menu-inner.second ul li img{
	max-width: 234px;
	width: 100%;
	height: auto;
}

	
 @media screen and (max-width: 939px) {
 .index-menu .index-menu-inner {
	padding-left:1%;
	padding-right:1%;
}
}
@media screen and (max-width: 900px) { 

 .index-menu .index-menu-inner ul{
	text-align: center;
}
 .index-menu .index-menu-inner ul li{
	width: 24%;
}
}

@media screen and (max-width: 640px) { 
	
 .index-menu .index-menu-inner ul li{
	width: 47.5%;
}
	
}	







/* --------------------------------------------------
 * 
 * news-area
 * 
 * --------------------------------------------------
 */

 
 .indexnews-area{
	 width:100%;
	 position:relative;
	 }



.indexnewsbox{
	margin:0 auto;
	text-align:center;
	width:100%;
	display:table;
	 z-index:998;


	}

.indexnewsbox > div{
	display:table-cell;
}

.indexnewsbox .indexnewscenter{
	background-color: rgba(255,255,255, 0.4);
 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);

	width:1200px;
	 height:256px;
	 text-align:center;
	 margin:0;
	 padding:0;

 	 background-image:url(/commons/img/index/News.png);
	 background-repeat:no-repeat;
	 background-position:center 30px;

}



.indexnewsbox .indexnewsright,
.indexnewsbox .indexnewsleft{
	width:auto;
	background-color: rgba(255,255,255, 0.4);
 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);


	}






 
.indexnewsbox .indexnewscenter ul{
	 margin:95px auto 0;
	 text-align:center;

	 }

.mobile .indexnewsbox .indexnewscenter ul{
	padding-left:2%;
	padding-right:2%;

}
.indexnewsbox .indexnewscenter ul li{
	  margin-bottom:25px;

  }








/* --------------------------------------------------
 * 
 * .lp
 * 
 * --------------------------------------------------
 */

/*
.index-itemmenu-box .all-item{
	margin-bottom:4.58333%;
}

.index-itemmenu-box .kodawari{
	margin-bottom:3.66667%;
}
*/
.index-itemmenu-box .mutenka{
	margin-bottom:7vh;
}
/*    
@media screen and (min-width: 1200px) { 

.index-itemmenu-box .all-item{
	margin-bottom:55px;
}

.index-itemmenu-box .kodawari{
	margin-bottom:44px;
}

.index-itemmenu-box .mutenka{
	margin-bottom:73px;
}
	
	
	
}	
        */
.index-itemmenu-box .ranking img,
.index-itemmenu-box .all-item img,
.index-itemmenu-box .kodawari img,
.index-itemmenu-box .mutenka img{
	text-align: center;
	margin: 0 auto;
	width: 100%;
	height: auto;
}
.index-itemmenu-box .ranking img,
.index-itemmenu-box .mutenka img,
.index-itemmenu-box .kodawari img,
.index-itemmenu-box .all-item img{
	max-width: 900px;
}
/*
.index-itemmenu-box .kodawari img,
.index-itemmenu-box .mutenka img{
	width: 95%;
}

*/
@media screen and (max-width: 900px) {

.ranking{
    padding-left: 2.5%;
    padding-right: 2.5%;
}
    
}
@media screen and (max-width: 640px) {
.index-itemmenu-box .kodawari{

}
.index-itemmenu-box .mutenka img,
.index-itemmenu-box .kodawari img{
    width: 112%;
    margin-left: -6%;
    margin-right: -6%;
}
}




/* --------------------------------------------------
 * 
 * .lp .item-info
 * 
 * --------------------------------------------------
 */

.item-info{
	margin-bottom:2.25%;

}
	

	.items{
		display: block;
		width:100%;
		max-width: 900px;
		margin-top: 25px;
	}
	.items+.items{
		margin-top: 50px;
	}

/*
.items:after{
	content: "";
	background-image: url(/commons/img/index/line.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: contain;
	max-width: 940px;
	display: block;
	height: 15px;
	width: 100%;
	margin-top: 5px;

}
.items.haircare:after{
	content: "";
	background-image: url(/commons/img/index/line_g.png);
}

*/

.items.bodycare:last-of-type:after{
	content: "";
	background-image: none;
}




.index-itemmenu-box:last-of-type .items:last-of-type{
		margin-bottom: 15%;
	}
	
 @media screen and (max-width: 900px) {
	.items{
	padding-left: 1%;
	padding-right:1%;
	}
	}	
	
	
	

	.contents-box .image-box img{
		max-width: 430px;
		width: 100%;
		height: auto;
	}
	
	
	 @media screen and (max-width: 640px) {
	.contents-box .image-box{
		margin-bottom: 5%;
	}
	}	
	
	
	
.items .detail-box dl dt {
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", "YuMincho", "Sawarabi Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	color: #002b96;
	font-size: 28px;
	/*	font-size:2.3em;*/
	line-height: 1.5;
	text-align: left;
/*	margin-bottom:2.41667%;*/
	margin-bottom:29px;
/*	letter-spacing: .25em;*/
	letter-spacing: 0;
}
.items .detail-box dl dt img{
	max-width: 425px;
	width: 100%;
	height: auto;
}


.items.haircare .detail-box dl dt {
	color: #008944;
}
	
.items .detail-box dl dt.adj {
	letter-spacing: -.05em;
}
	
.items .detail-box dl dd {
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", "YuMincho", "Sawarabi Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	color: #3c3c3c;
	font-size: 15px;
	/*	font-size:2.3em;*/
	line-height: 1.65;
	text-align: left;
/*	margin-bottom:3.16667%;*/
	margin-bottom:38px;
}



	.detail-box h1,
	.detail-box h2{
		font-size:15px;
		color: #2b66b1;
	line-height: 1.5;
	text-align: left;
	margin-bottom:5px;
/*	margin-bottom:.83333%;*/
}

.haircare .detail-box h1,
.haircare .detail-box h2{
		color: #00968f;
}

	.detail-box h1+ul{
	margin-bottom:5px;
/*	margin-bottom:.83333%;*/
}
	.detail-box h2+p,
	.detail-box h1+ul li{
	color: #3c3c3c;
	font-size: 13px;
	/*	font-size:2.3em;*/
	line-height: 1.5;
	text-align: left;
	margin-bottom:3.5px;
/*	margin-bottom:.83333%;*/
	}
	
.kouri{
	font-size:11px;
	
}

@media screen and (max-width: 640px) {
	.contents-box{
        padding-left: 1.5%;
        padding-right: 1.5%;
	}
    
.items .detail-box dl dd {
	font-size: 4vw;
}

	.detail-box h1,
	.detail-box h2{
	font-size: 4vw;
}

	.detail-box h1+ul li{
	font-size: 4vw;
	} 
	.detail-box h2+p{
	font-size: 3vw;
	} 
    
    
}


	
	
	
	.items .voice-box{
		display: block;
		width:100%;
	}	
@media screen and (min-width: 640px) { 
	.contents-box{
		display: table;
		table-layout: fixed;
		width: 100%;
	}
	.contents-box .image-box{
		display: table-cell;
		width: 47.778%;
		vertical-align: middle;
		
	}
	.contents-box .detail-box{
		display: table-cell;
		width: 47.66666%;
		vertical-align: top;
/*	padding-left: 41px;*/
		padding-left: 4.55555%;
		box-sizing: border-box;
	}
	
    
	
	
}
	
	

	.voice-box > a{
		display: block;
		max-width: 900px;
		width: 100%;
		height: auto;
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", "YuMincho", "Sawarabi Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
		color: #FFF;
		background-color: #7ebfde;
		font-size: 21px;
		padding: 14px 2.5% 13px;
		border-radius: 6px;
		margin-top: 3.33333%;
		border: none;
		outline: none;


	}	
.haircare .voice-box > a{
		background-color: #63bbc3;

}

.voice-box > a:visited {
	text-decoration: none
}
	.voice-box > a.hover,
	.voice-box > a:hover{
		text-decoration: none;
	
	}
.voice-box > a:active {
	text-decoration: none
}
.voice-box > a:focus {
	text-decoration: none
}
	
		.voice-box > a:after {
  content: "";
			position: relative;
			top: 5px;
}

	.voice-box > a[aria-expanded="false"]:after {
  content: url("/commons/img/lp/y.png");
}

	.voice-box > a[aria-expanded="true"]:after {
  content: url("/commons/img/lp/y2.png");
}
.haircare .voice-box > a[aria-expanded="false"]:after {
  content: url("/commons/img/lp/y3.png");
}

.haircare .voice-box > a[aria-expanded="true"]:after {
  content: url("/commons/img/lp/y4.png");
}
	
	
	.voicelist ol{
		text-align:left;
		background: #FFF;
		border-radius: 0 0 6px 6px;
	}	
	
	.voicelist ol li{
	color: #3c3c3c;
	font-size: 15px;
	/*	font-size:2.3em;*/
	line-height: 1.5;
		padding: 15px 5%;
	text-align: left;
	margin-bottom:.83333%;
		border-bottom: 1px solid #63bbc3;
	}

	.voicelist ol li:last-of-type{
		border-bottom: none;
}
@media screen and (min-width: 1200px) { 
.item-info{
	margin-bottom:27px;

}

	.voice-box > a{
		margin-top: 40px;

		
	}	
	.voicelist ol li{
		padding: 30px 30px;
	}
	
	
	
	
}

@media screen and (max-width: 640px) { 
	.voice-box{
		margin-top: 5vh;

		
	}	
    }	

/*	
@media screen and (max-width: 640px) { 
.items .detail-box dl dt {
	letter-spacing: 0;
}
}	

@media screen and (max-width: 480px) { 
	.voicelist ol{
		padding-top: 5%;
	}	
	}

	*/	
	
	
	.pagetop{
		margin: 25px 15px 35px 0;
		font-size:15px;
		text-align:right;
		
	}
	.pagetop a{
        color: #008944;
	}

.pagebottom{
		margin: 25px auto;
	text-align: center;
		font-size:15px;
	display: block;
	
}




/* --------------------------------------------------
 * 
 * .202106
 * 
 * --------------------------------------------------
 */



.howto-box > span,
.itempoint-box > span {
    display: block;
    max-width: 900px;
    width: 100%;
    height: auto;
    font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", "YuMincho", "Sawarabi Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
    color: #FFF;
    background-color: #33aba5;
    font-size: 21px;
    padding: 10px 2.5% 10px;
    border-radius: 6px;
    margin-top: 3.33333%;
    border: none;
    outline: none;
}
.howtolist .inner,
.itempointlist ol {
    text-align: left;
    background: #FFF;
    border-radius: 0 0 6px 6px;
    padding: 20px 3.5%;
}

.itempointlist ol li:last-of-type {
    border-bottom: none;
}

.itempointlist ol li {
    color: #3c3c3c;
    font-size: 15px;
/*    font-size: 2.3em;*/
    line-height: 1.5;

    text-align: left;
 /*   margin-bottom: .43333%;
    border-bottom: 1px solid ##63bbc3;*/
}
.itempointlist ol li + li{
    margin-top: 15px;
}
.itempointlist ol li strong{
    color: #33aba5;
    display: block;
}
@media screen and (max-width: 640px) {
    .howto-box,
    .itempoint-box{
    margin-top: 5vh;
}
.itempointlist ol li{
    font-size: 4vw;
}	



}



/* --------------------------------------------------
 * 
 * .202106 lineupitemlright
 * 
 * --------------------------------------------------
 */


.each-howto-body{
	clear:both;
	padding:10px 0 0 0;
/*	margin:10px 0 -25px;*/
	width:100%;
	box-sizing:border-box;
	}

.each-howto-body h1:before{
	
    background-image: url("https://www.cow-mutenka-body.jp/commons/img/page/lineup/item/i.png");
	background-position: 0 0;
    background-repeat: no-repeat;
    content: "";
    display: inline-block;
    height: 3px;
    margin-left: 0;
    margin-right: 3px;
    vertical-align: middle;
    width: 20px;
	
	
}

.each-howto-body h1{
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", "YuMincho", "Sawarabi Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	font-size: 21px;
	text-align: left;
	margin-bottom: 35px;
	font-weight: bold;
	
}

/*
@media screen and (max-width: 640px) {

.each-howto-body{
	padding:65px 15px 0 15px;
	}

}
@media screen and (max-width: 360px) {
.each-howto-body{
	padding:75px 5px 0 5px;
	}
	
.each-howto-body{
		padding-left: 5px;
		padding-right: 5px;
	}

		}

*/
/* ++++++++++++++++++++++++++++++++++++++

*/

.each-howto-body p{
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", "YuMincho", "Sawarabi Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	margin:0;
	padding:0;
	
	font-size:1.5em;
	line-height: 1.5;
	text-align:left;
}

.each-howto-body .howto-number{
	margin-top:15px;
	}


.each-howto-body .howto-number dl{
	margin-bottom:50px;
	}		
.each-howto-body .howto-number dl dt {
font-size:18px;

	text-align:left;
color: #33aba5;
    display: flex;
	}

.each-howto-body .howto-number dl:nth-of-type(1) dt:before,
.each-howto-body .howto-number dl:nth-of-type(2) dt:before,
.each-howto-body .howto-number dl:nth-of-type(3) dt:before,
.each-howto-body .howto-number dl:nth-of-type(4) dt:before{

	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", "YuMincho", "Sawarabi Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
    
display: inline-block;
width: 1.5em;
height: 1.5em;
border-radius: 50%;
background-color: #33aba5;
color: #fff;
vertical-align: middle;
text-align: center;
line-height: 1.5;
margin-right:5px;
/*letter-spacing: 0.15em;*/
}

	
.each-howto-body .howto-number dl:nth-of-type(1) dt:before {
	content:"1";
}
.each-howto-body .howto-number dl:nth-of-type(2) dt:before {
	content:"2";
}
.each-howto-body .howto-number dl:nth-of-type(3) dt:before {
	content:"3";
}
.each-howto-body .howto-number dl:nth-of-type(4) dt:before {
	content:"4";
}

.each-howto-body .howto-number dl dd {
	margin-top:5px;
	margin-bottom:15px;
text-align: left;
line-height: 1.5;
font-size: 15px;
width:75%;
	}


@media screen and (max-width: 640px) {
.each-howto-body .howto-number dl dt {
font-size: 4vw;
	}
.each-howto-body .howto-number dl dd {
font-size: 4vw;
    width: 100%;
	}
    
    
}



.each-howto-body.howto-item-shampoo .howto-number dl{
	margin-bottom:0;
	}		
	
.each-howto-body.howto-item-shampoo .howto-number dl:nth-of-type(1),
.each-howto-body.howto-item-shampoo .howto-number dl:nth-of-type(2),
.each-howto-body.howto-item-shampoo .howto-number dl:nth-of-type(3){
	min-height:100px;
	margin-bottom:30px;
	background-repeat:no-repeat;
	background-position:95% top;
	}	
	

.each-howto-body.howto-item-shampoo .howto-number dl:nth-of-type(1){
	background-image:url(https://www.cow-mutenka-body.jp/commons/img/page/howto/shampoo/illust_01.png);
	}
.each-howto-body.howto-item-shampoo .howto-number dl:nth-of-type(2){
	background-image:url(https://www.cow-mutenka-body.jp/commons/img/page/howto/shampoo/illust_02.png);
	}
.each-howto-body.howto-item-shampoo .howto-number dl:nth-of-type(3){
	background-image:url(https://www.cow-mutenka-body.jp/commons/img/page/howto/shampoo/illust_03.png);
	}

@media screen and (max-width: 640px) {
.each-howto-body.howto-item-shampoo .howto-number dl:nth-of-type(1),
.each-howto-body.howto-item-shampoo .howto-number dl:nth-of-type(2),
.each-howto-body.howto-item-shampoo .howto-number dl:nth-of-type(3){
	background-position:center bottom;
	padding-bottom:90px;
	min-height:auto;
	}
	}

/*----------- トリートメント　----------
--------------------------------*/
.each-howto-body.howto-item-treatment-smoothness p,
.each-howto-body.howto-item-treatment-wetness p{
    font-size: 15px;
    margin-bottom: 5vh;
	}


.each-howto-body.howto-item-treatment-smoothness .howto-number dl,
.each-howto-body.howto-item-treatment-wetness .howto-number dl{
	margin-bottom:0;
	}		
.each-howto-body.howto-item-treatment-smoothness .howto-number dl:nth-of-type(1),
.each-howto-body.howto-item-treatment-smoothness .howto-number dl:nth-of-type(2),
.each-howto-body.howto-item-treatment-wetness .howto-number dl:nth-of-type(1),
.each-howto-body.howto-item-treatment-wetness .howto-number dl:nth-of-type(2){
	min-height:100px;
	margin-bottom:30px;
	background-repeat:no-repeat;
	background-position:95% top;
	}	
	
.each-howto-body.howto-item-treatment-smoothness .howto-number dl:nth-of-type(1),
.each-howto-body.howto-item-treatment-wetness .howto-number dl:nth-of-type(1){
	background-image:url(https://www.cow-mutenka-body.jp/commons/img/page/howto/treatment/illust_01.png);
	}
.each-howto-body.howto-item-treatment-smoothness .howto-number dl:nth-of-type(2),
.each-howto-body.howto-item-treatment-wetness .howto-number dl:nth-of-type(2){
	background-image:url(https://www.cow-mutenka-body.jp/commons/img/page/howto/treatment/illust_02.png);
	}

	


	

@media screen and (max-width: 640px) {
.each-howto-body.howto-item-treatment-smoothness p,
.each-howto-body.howto-item-treatment-wetness p{
    font-size: 4vw;
	}
    
.each-howto-body.howto-item-treatment-smoothness .howto-number dl:nth-of-type(1),
.each-howto-body.howto-item-treatment-smoothness .howto-number dl:nth-of-type(2),
.each-howto-body.howto-item-treatment-wetness .howto-number dl:nth-of-type(1),
.each-howto-body.howto-item-treatment-wetness .howto-number dl:nth-of-type(2){
	background-position:center bottom;

	padding-bottom:90px;
	min-height:auto;
	}	
	

	
	
	}


/* --------------------------------------------------
 * 
 * 
 * 
 * --------------------------------------------------
 */
.each-howto-body .howto-note-box{
    margin-top: 5vh;
    margin-bottom: 5vh;
    
}

.each-howto-body .howto-note-box dl{
	background-color:#d6eeed;
	width:100%;	
	padding-bottom:2px;
/*	margin-bottom:-25px;*/
	border-radius:3px;
	
	}
/*
@media screen and (max-width: 640px) {
.each-howto-body .howto-note-box dl{
	width:100%;	
	}
		}
*/
	
.each-howto-body .howto-note-box dl dt{
		color:#33aba5;
			letter-spacing: 0.15em;
			text-align:center;
			padding-top:5px;
			font-size:1.5em;
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", "YuMincho", "Sawarabi Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	font-weight:normal;
	

}
/*
.android .each-howto-body .howto-note-box dl dt{
	font-family: HanaMinA;
	}
*/
.each-howto-body .howto-note-box dl dd{
	margin:5px;
	padding:30px;
	background-color:#FFFFFF;
	text-align:left;
	line-height:1.5;
			font-size:15px;

}


@media screen and (max-width: 640px) {
.each-howto-body .howto-note-box dl dt{
			letter-spacing: -.05em;
	

}
.each-howto-body .howto-note-box dl dd{
font-size: 4vw;
	}

    
}