/* ------------------------------------------------------
骨盤ケアの三原則
--------------------------------------------------------*/
#howto-care-up,
#howto-care-better{
	background:#FFF;
}
#body-muscle-care,
#howto-care-lecturer{
	border-bottom:100px solid #FFF;
}
#care-3principles .split-image > span img,
#care-up .split-image > span img,
#care-better .split-image > span img{
	border:none;
	border-radius:0;
}
#care-support .split-image > span img{
	border-radius:0;
}


/* 妊娠中からの骨盤ケア＝胎児ケア */
#care-3principles .split-image > span{
	padding:0 20% 5%;
	background:none;
	border:none;
	border-radius:0;
}
@media only screen and (max-width:680px){
	#care-3principles .split-image > span{
		padding:0 15% 5%;
	}
}
@media only screen and (max-width:530px){
	#care-3principles .split-image > span{
		padding:0 10% 5%;
	}
}
@media only screen and (max-width:420px){
	#care-3principles .split-image > span{
		padding:0 5% 5%;
	}
}
@media only screen and (min-width:992px){
	#care-3principles .split-image > span{
		padding:0 10% 5%;
	}
}
@media only screen and (min-width:1200px){
	#care-3principles .split-image{
		margin-bottom:0;
	}
	#care-3principles .split-image > span{
		padding:0 15% 5%;
	}
}


/* 三原則 */
.care-item{
	margin-top:50px;
}
.care-item .item-ttl{
	margin-bottom:15px;
	color:#EB8400; /* 蜜柑色 */
	font-size:1.5rem;
	font-weight:bold;
	line-height:1.5;
}
.care-item .item-ttl::before{
	padding-right:.25em;
	content:"\f10c";
	font-family:FontAwesome;
}
.product.product-box{
	overflow:hidden;
	margin:25px 0;
}
.item-ttl + .product.product-box{
	margin-top:0;
}
.product.product-box .pull-left{
	width:64px;
	height:64px;
	padding:2px;
	font-size:54px; /* imgサイズの高さからpadding引く */
	line-height:0;
	text-align:center;
	border:1px solid #DCDCDC; /* ゲインズボロ */;
	background:#FFF;
	transition:background-color 400ms, background-color 400ms;
}
.product.product-box .pull-left > img{
	width:100%;
	vertical-align:middle;
}
.product.product-box .product-body{
	float:right;
	width:calc(100% - 84px);
	margin-top:3px;
}
.product.product-box .product-heading{
	margin-bottom:5px;
	color:#7C745F; /* あくいろ */
	font-size:1.6rem;
	line-height:1.4;
	font-weight:bold;
	letter-spacing:1px;
}
.product.product-box .product-heading a{
	color:#7C745F; /* あくいろ */
}
.product.product-box .product-heading a::after{
	padding-left:.25em;
	content:"\f101";
	font-family:FontAwesome;
}


/* 三原則「あげる」 */
#care-up .split-image > span{
	padding:10% 3%;
}
@media only screen and (min-width:631px) and (max-width:991px){
	#care-up .split-image > span{
		padding:10% 7%;
	}
}


/* 三原則「ささえる」 */
#care-support .split-image > span{
	padding:5% 32% 0;
}
@media only screen and (min-width:631px) and (max-width:991px){
	#care-support .split-image > span{
		padding:5% 35% 0;
	}
}


/* 三原則「ととのえる」 */
body.care-maternity #care-better .split-image > span{
	padding:10% 3% 10% 5%;
}
body.care-way #care-better .split-image > span{
	padding:10% 3% 10% 8%;
}

@media only screen and (min-width:631px) and (max-width:991px){
	body.care-maternity #care-better .split-image > span{
		padding:10% 8% 10% 10%;
	}
	body.care-way #care-better .split-image > span{
		padding:10% 8% 10% 12%;
	}
}


/* メイン画像（_pc：W1920px＝100%, _sp：W991px＝100%） */
#howto-care #introducion::before{ /* 「次のコンテンツへ」と流用しているため、このままの数値で */
	background:url(/toco-belt/images/main-image/img_howto_care_sp.webp) no-repeat 0 0 / 100%;
}
@media only screen and (min-width:992px){
	#howto-care #introducion::before{
		background-image:url(/toco-belt/images/main-image/img_howto_care_pc.webp);
	}
}


/* 次のコンテンツへ（W900px＝100%） */
#howto-care.care-maternity #next-content.banner a{ /* m骨盤高位 */
	background:url(/toco-belt/images/next-bnr/bnr_howto.webp) no-repeat 60% 83% / 110%;
}
#howto-care.care-way  #next-content.banner a{ /* w骨盤高位 */
	background:url(/toco-belt/images/next-bnr/bnr_howto_w.webp) no-repeat 20% 80% / 105%;
}
@media only screen and (max-width:630px){
	#howto-care.care-maternity #next-content.banner a{
		background-position:60% 90%;
		background-size:120%;
	}
	#howto-care.care-way  #next-content.banner a{
		background-position:40% 80%;
		background-size:115%;
	}
}
@media only screen and (max-width:420px){
	#howto-care.care-maternity #next-content.banner a{
		background-position:60% 93%;
		background-size:128%;
	}
	#howto-care.care-way  #next-content.banner a{
		background-position:30% 85%;
		background-size:125%;
	}
}
