@charset "utf-8";


/**************************************************50
 * difference
 **************************************************/
#difference{
	text-align: center;
}
#difference .box{
	background-color: #FDF9DB;
}
#diff h3{
	background-color: #FD695F;
	color: #FFFFFF;
	margin-bottom: 0.5em;
}
#diff{
}
#difference .box .words{
}
#difference .box .words figcaption{
	background-color: #FFFFFF;
}
#difference .box .words figcaption:after{
	border-color: #FFFFFF transparent transparent transparent;
}
@media screen and (max-width:767px){
	#difference{
		margin-bottom: 3.125%;
	}
	#difference .box{
		padding-top: -webkit-calc(0.8333333333333333% + 0.5em);
		padding-top: calc(0.8333333333333333% + 0.5em);
		padding-bottom: 3.333333333333333%;
	}
	#difference .box #diff{
		padding: 0 3.333333333333333%;
		text-align: left;
	}
	#diff h3{
		text-align: center;
	}
	#diff h3:not(:first-child){
		margin-top: 1.5em;
	}
}
@media screen and (min-width:768px){
	#difference{
		margin-bottom: 50px;
	}
	#difference .box{
	}
	#difference .box #diff{
		padding: 0 50px;
	}
	#diff h3:not(:first-child){
		margin-top: 2.5em;
	}
}
@media screen and (min-width:768px) and (max-width:1023px){
	#difference .box{
		padding: 50px 50px;
	}
}
@media screen and (min-width:1024px){
	#difference .box{
		padding: 50px 100px;
	}
}


/**************************************************50
 * treatments
 **************************************************/
#treatments{
	text-align: center;
}
#treatments .box{
}
#treatment{
}
#treatment > p{
}
#treatment .ex{
	background-color: #FDF9DB;
	position: relative;
}
#treatment .ex .ex_title{
	background-color: #FD695F;
	border-radius: 1000px;
	color: #FFFFFF;
	display: inline-block;
	padding: 0 2em;
	position: absolute;
	top: 0;
	left: 0;
}
#treatment .ex strong{
}
#treatment .ex strong:not(.blue){
	background-color: #FD695F;
	color: #FFFFFF;
	display: inline-block;
	line-height: 1.75;
	margin: 0 0.25em;
	padding: 0 0.5em;
	vertical-align: baseline;
}
#treatment_list{
	background-color: #DFF5F8;
}
#treatment_list h3{
}
#treatment_list h3 span{
	border-bottom: 1px solid #000000;
	display: inline-block;
	line-height: 1.25;
	padding: 0.125em 0;
}
#treatment_list h4{
	background-color: #9D8BAB;
	border-radius: 1000px;
	color: #FFFFFF;
	font-weight: 500;
	line-height: 1.25;
	position: relative;
}
#treatment_list h4 span{
	background: url("https://tobita.biz/images/user/icon/fan/pink.svg") center center no-repeat;
	background-size: contain;
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	-ms-transform: translate(-50%, 50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-align: center;
}
#treatment_list p{
	text-align: left;
}
@media screen and (max-width:767px){
	#treatments{
		margin-bottom: 3.125%;
	}
	#treatments .box{
		padding-top: -webkit-calc(0.8333333333333333% + 0.5em);
		padding-top: calc(0.8333333333333333% + 0.5em);
	}
	#treatments .box > *:last-child{
		border-radius: 0 0 10px 10px;
		padding-bottom: 3.333333333333333%;
	}
	#treatments #treatment{
		padding: 0 3.333333333333333%;
	}
	#treatment{
	}
	#treatment > p{
		text-align: left;
	}
	#treatment .ex{
		margin: 1.5em 0 0.5em;
		padding: 2em 1em 0.5em;
		text-align: center !important;
	}
	#treatment .ex .ex_title{
		font-size: 112.5%;
		-ms-transform: translate(-12.5%, -25%) rotate(340deg);
		-webkit-transform: translate(-12.5%, -25%) rotate(340deg);
		transform: translate(-12.5%, -25%) rotate(340deg);
	}
	#treatment .ex strong{
	}
	#treatment .ex strong:not(.blue){
	}
	#treatment_list{
		margin-top: 3.333333333333333%;
		padding-top: 3.333333333333333%;
		padding-left: 3.333333333333333%;
		padding-right: 3.333333333333333%;
	}
	#treatment_list h3{
		font-size: 137.5%;
	}
	#treatment_list h4{
		font-size: 125%;
		margin: -webkit-calc(1.785714285714286% + 0.5em) 0 0 1.5625em;
		margin: calc(1.785714285714286% + 0.5em) 0 0 1.5625em;
		padding: 0.375em 1em 0.375em 2.0625em;
		text-align: left;
	}
	#treatment_list h4 span{
		line-height: 1.75;
		height: 2.0625em;
		width: 3.75em;
	}
	#treatment_list p{
		margin-top: 0.5em;
		padding-left: 3em;
	}
}
@media screen and (min-width:768px){
	#treatments{
		margin-bottom: 50px;
	}
	#treatments .box{
		padding-top: 50px;
	}
	#treatments .box > *:last-child{
		border-radius: 0 0 20px 20px;
		padding-bottom: 50px;
	}
	#treatment{
	}
	#treatment > p{
	}
	#treatment .ex{
		display: inline-block;
		margin: 2.5em 20px 1.5em;
		padding: 1.5em 6em;
		min-width: 580px;
	}
	#treatments #treatment .ex:after{
		background-image: url("https://tobita.biz/images/user/concierge.webp");
		background-position: center center;
		background-repeat: no-repeat;
		background-size: contain;
		content: "";
		display: block;
		height: 280px;
		pointer-events: none;
		position: absolute;
		top: 50%;
		right: 0;
		-ms-transform: translate(50%, -50%);
		-webkit-transform: translate(50%, -50%);
		transform: translate(50%, -50%);
		width: 208px;
	}
	#treatment .ex .ex_title{
		font-size: 125%;
		-ms-transform: translate(-25%, -25%) rotate(340deg);
		-webkit-transform: translate(-25%, -25%) rotate(340deg);
		transform: translate(-25%, -25%) rotate(340deg);
	}
	#treatment .ex:after{
	}
	#treatment .ex strong{
	}
	#treatment .ex strong:not(.blue){
	}
	#treatment_list{
		margin-top: 50px;
		padding-top: 50px;
	}
	#treatment_list h3{
		font-size: 175%;
	}
	#treatment_list h4{
		font-size: 150%;
		margin: 50px 0.5em 0;
		padding: 0.375em 2.5em;
		text-align: center;
	}
	#treatment_list h4 span{
		line-height: 2;
		height: 2.75em;
		width: 5em;
	}
	#treatment_list p{
		margin-top: 1em;
		padding: 0 4.5em;
	}
}
@media screen and (min-width:768px) and (max-width:1023px){
	#treatments #treatment{
		padding-left: 50px;
		padding-right: 50px;
	}
	#treatment_list{
		padding-left: 50px;
		padding-right: 50px;
	}
}
@media screen and (min-width:1024px){
	#treatments #treatment{
		padding-left: 100px;
		padding-right: 100px;
	}
	#treatment_list{
		padding-left: 100px;
		padding-right: 100px;
	}
}


/**************************************************50
 * earnable
 **************************************************/
#earnable{
	text-align: center;
}
#earnable .box{
}
#earn{
}
#earn ul{
	background-color: #FD908E;
	color: #FFFFFF;
	display: inline-block;
	text-align: left;
}
#earn ul > li{
	padding-left: 1em;
	text-indent: -1em;
}
#earn ul > li:before{
	content: "\F070B";
	font-family: "Material Design Icons";
	text-indent: 0;
}
#earn > strong{
	background-color: #FD695F;
	border-radius: 1000px;
	color: #FFFFFF;
	display: inline-block;
	line-height: 1.25;
	margin: 0.5em 1em;
	padding: 0.375em 1.5em;
}
#earn > strong span{
	color: #FFF376;
	text-decoration: none !important;
}
#earn .ts_green{
	color: #FFFFFF;
	text-shadow: #00BA01 2px 0px 0px, #00BA01 -2px 0px 0px, #00BA01 0px -2px 0px, #00BA01 0px 2px 0px, #00BA01 2px 2px 0px, #00BA01 -2px 2px 0px, #00BA01 2px -2px 0px, #00BA01 -2px -2px 0px, #00BA01 1px 2px 0px, #00BA01 -1px 2px 0px, #00BA01 1px -2px 0px, #00BA01 -1px -2px 0px, #00BA01 2px 1px 0px, #00BA01 -2px 1px 0px, #00BA01 2px -1px 0px, #00BA01 -2px -1px 0px, #00BA01 1px 1px 0px, #00BA01 -1px 1px 0px, #00BA01 1px -1px 0px, #00BA01 -1px -1px 0px;
}
@media screen and (max-width:767px){
	#earnable{
		margin-bottom: 3.125%;
	}
	#earnable .box{
		padding-top: -webkit-calc(0.8333333333333333% + 0.5em);
		padding-top: calc(0.8333333333333333% + 0.5em);
		padding-bottom: 3.333333333333333%;
	}
	#earnable #earn{
		padding: 0 3.333333333333333%;
	}
	#earn ul{
		margin-bottom: 0.5em;
		padding: 0.5em 1.5em;
	}
	#earn ul:not(:first-child){
		margin-top: 0.5em;
	}
	#earn > strong{
		font-size: 112.5%;
	}
}
@media screen and (min-width:768px){
	#earnable{
		margin-bottom: 50px;
	}
	#earnable .box{
		padding-top: 50px;
		padding-bottom: 50px;
	}
	#earn{
	}
	#earn ul{
		margin-bottom: 1.5em;
		padding: 1.25em 3em;
	}
	#earn ul:not(:first-child){
		margin-top: 1.5em;
	}
	#earn > strong{
		font-size: 125%;
	}
}
@media screen and (min-width:768px) and (max-width:1023px){
	#earnable #earn{
		padding-left: 50px;
		padding-right: 50px;
	}
}
@media screen and (min-width:1024px){
	#earnable #earn{
		padding-left: 50px;
		padding-right: 50px;
	}
}