@charset "utf-8";


/**************************************************50
 * system
 **************************************************/
/* -- banner -- */
#system_bnr{
}
#system_bnr > li{
	margin-bottom: 20px;
	text-align: center;
}
#system_bnr > li img{
	width: 100%;
}

#system{
}
.title_corse{
	font-size: 200%;
	padding: 0 20px;
	margin-top: 100px;
	margin-bottom: 30px;
	text-align: center;
}
#health_title{
	background-color: #EBE1F8;
	color: #B18AE2;
}
#erogenous_title{
	background-color: #DAE1F7;
	color: #6482DD;
}
#health .blue_soft,
#health .system_amount_course > li > span,
#health .system_option ul > li b,
#health .system_cast_discount ul > li{
	color: #B18AE2;
}
#health .system_cast_discount ul > li{
	border: 1px solid #B18AE2;
}
#erogenous .blue_soft,
#erogenous .system_amount_course > li > span,
#erogenous .system_option ul > li b,
#erogenous .system_cast_discount ul > li{
	color: #6482DD;
}
#erogenous .system_cast_discount ul > li{
	border: 1px solid #6482DD;
}
#other{
	background-color: #6482DD;
	color: #FFFFFF;
}

/* -- summary -- */
.system_summary{
	margin-bottom: 30px;
}

/* -- corse -- */
.system_course{
	margin-top: 30px;
	text-align: center;
}
.system_course a{
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	border-radius: 100px;
	color: #FFFFFF;
	display: inline-block;
	font-size: 125%;
	margin: 20px 10px 0;
	position: relative;
	text-decoration: none;
	transition: opacity 0.2s ease-out 0s;
	width: 300px;
}
.system_course a[href$="health"]{
	background-color: #B18AE2;
}
.system_course a[href$="erogenous"]{
	background-color: #6482DD;
}
.system_course a:hover{
	opacity: 0.7;
}
.system_course a:after{
	content: "\F140";
	font-size: 150%;
	line-height: 1;
	position: absolute;
	top: 50%;
	right: 0.25em;
	-ms-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

/* -- amount -- */
[class^="system_amount_"]{
	margin-bottom: 30px;
}
[class^="system_amount_"]#course_free,
[class^="system_amount_"]#course_free_other{
	display: inline-block;
}
[class^="system_amount_"]:after{
	clear: both;
	content: "";
	display: block;
}
[class^="system_amount_"] > li{
	border-collapse: separate;
	border-spacing: 0;
	display: table;
	float: left;
	line-height: 1;
	margin-bottom: 20px;
	table-layout: fixed;
}
[class^="system_amount_"] > li > span{
	display: table-cell;
	font-size: 137.5%;
	padding-right: 10px;
}
[class^="system_amount_"] > li > b{
	display: table-cell;
	position: relative;
	text-align: right;
}
[class^="system_amount_"] > li > b:before{
	content: "￥";
}
.system_amount_course > li{
	margin-right: 50px;
	width: 250px;
}
.system_amount_course > li > span{
	color: #6482DD;
	text-align: right;
	width: 90px;
}
.system_amount_course > li > b{
	font-size: 250%;
}
.system_amount_course > li > b:before{
	font-size: 75%;
}
.system_amount_other > li{
	margin-right: 45px;
	width: 260px;
}
.system_amount_other > li > span{
	color: #282792;
	width: 130px;
}
.system_amount_other > li > b{
	font-size: 187.5%;
	width: 4.8em;
}
[class^="system_amount_"] + hr{
	margin: -30px 0 20px;
}

/* -- postscript -- */
.system_postscript{
	margin-top: -30px;
	margin-bottom: 50px;
}
.system_postscript > div{
	border: 1px solid #FF0000;
	margin-top: 10px;
}
.system_postscript > div h3{
	background-color: #FF0000;
	color: #FFFFFF;
	font-size: 150%;
	height: 46px;
	line-height: 46px;
	padding: 0 20px;
}
.system_postscript > div p{
	padding: 10px 15px;
}
.system_postscript > div p strong{
	color: #FF0000;
}

/* -- cast_discount -- */
.system_cast_discount{
	margin-bottom: 30px;
}
.system_cast_discount ul{
}
.system_cast_discount ul > li{
	border: 1px solid #282792;
	color: #282792;
	display: inline-block;
	font-size: 150%;
	margin-bottom: 20px;
	padding: 10px;
	text-align: center;
	vertical-align: top;
	width: 290px;
}
.system_cast_discount ul > li:not(:nth-child(3n+1)){
	margin-left: 25px;
}
.system_cast_discount ul > li b{
	margin-right: 1em;
}
.system_cast_discount ul > li span{
}
.system_cast_discount + .list_note{
	margin-top: -30px;
	margin-bottom: 30px;
}

/* -- option -- */
.system_option{
	padding: 0 20px;
}
.system_option:after{
	clear: both;
	content: "";
	display: block;
}
.system_option ul{
	float: left;
	margin-right: 25px;
	margin-bottom: 20px;
	width: 325px;
}
.system_option ul > li{
	border: 1px solid #282792;
	border-collapse: separate;
	border-spacing: 15px 0;
	color: #282792;
	display: table;
	height: 52px;
	width: 100%;
}
.system_option ul > li + li{
	margin-top: -1px;
}
.system_option ul > li > b{
	display: table-cell;
	vertical-align: middle;
}
.system_option ul > li > span{
	display: table-cell;
	text-align: right;
	vertical-align: middle;
	width: 6em;
}
.system_option + .list_note{
	margin-bottom: 50px;
	padding: 0 20px;
}

/* -- costs -- */
.system_cost{
	padding: 0 20px;
}
.system_cost:after{
	clear: both;
	content: "";
	display: block;
}
.system_cost > div{
	float: left;
	margin-right: 20px;
	margin-bottom: 30px;
	width: 200px;
}
.system_cost > div h4{
	background-color: #282792;
	color: #FFFFFF;
	font-size: 125%;
	height: 40px;
	line-height: 40px;
	margin-bottom: 10px;
	text-align :center;
}
.system_cost > div h4:not(.cost_free):before{
	content: "￥";
}
.system_cost > div h4.cost_free{
	background-color: #FF0000;
}
.system_cost + .list_note{
	margin-bottom: 50px;
	padding: 0 20px;
}
#system_business_hote{
	border: 1px solid #282792;
	margin: 0 20px 50px;
	padding: 20px;
}
#system_business_hote h3{
	color: #282792;
	font-size: 150%;
}
#system_business_hote h3:before,
#system_business_hote h3:after{
	content: "＊＊＊";
	font-size: 75%;
}
#system_business_hote h4{
	font-size: 125%;
	margin-top: 20px;
}
#system_business_hote h4:before,
#system_business_hote h4:after{
	content: "\F156\F156";
	font-size: 80%;
}

/* -- home -- */
#system_home{
	font-size: 137.5%;
	line-height: 1.2;
	margin-bottom: 50px;
	padding: 0 20px;
}

/* -- area -- */
#system_area{
	font-size: 137.5%;
	line-height: 1.2;
	margin-bottom: 50px;
	padding: 0 20px;
}

/* -- payment -- */
#system_payment{
	margin-top: 100px;
	margin-bottom: 50px;
	text-align: center;
}
#system_payment figure{
}
#system_payment figure h2{
	margin-bottom: 10px;
}
#system_payment figure figcaption{
}

/* -- notes -- */
#notes{
	margin-top: 100px;
}
#system_notes{
}
#system_notes h3{
	font-size: 112.5%;
}
#system_notes [class^="list_"]{
	font-size: 87.35%;
}
#system_notes .list_square{
	margin-top: 1em;
}
#system_notes .list_square > li:before{
	color: #FF0000;
}


/**************************************************50
 * point
 **************************************************/
#point{
}
[id^="point_"]{
}
[id^="point_"] + [id^="point_"]{
	margin-top: 50px;
}
[id^="point_"] h2{
}
[id^="point_"] > strong{
	color: #282792;
	display: block;
	font-size: 150%;
	margin-top: 20px;
}
[id^="point_"] > strong:before{
	content: "\F70A";
}
[id^="point_"] > p{
	margin-top: 0.5em;
}
[id^="point_"] p b{
	color: #333333;
}
[id^="point_"] p strong{
	color: #ED1C24;
}
[id^="point_"] [class^="list_"]{
}
#point_earn{
}
#point_earn_ex{
}
#point_earn_ex > li{
	margin-top: 0.5em;
	position: relative;
}
#point_earn_ex > li:before{
	content: "\F40A";
	font-size: 150%;
	line-height: 1;
	position: absolute;
	top: 50%;
	left: 174px;
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
#point_earn_ex > li span{
	display: inline-block;
	text-align: right;
	vertical-align: baseline;
	width: 3.25em;
}
#point_earn_ex > li  > span{
	color: #282792;
	font-weight: bold;
}
#point_earn_ex > li p{
	background-color: #F7931E;
	color: #FFFFFF;
	height: 26px;
	line-height: 26px;
	position: absolute;
	top: 50%;
	left: 198px;
	-ms-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	text-align: center;
	width: 8.5em;
}
#point_use{
}
#point_use picture{
}
#point_use picture img{
}
#point_use h3{
	font-size: 125%;
	margin-top: 20px;
	margin-bottom: 10px;
	color: #282792;
}
#point_use table{
	background-color: #666666;
	border-collapse: separate;
	border-spacing: 1px;
	margin-bottom: 10px;
	table-layout: fixed;
	text-align: center;
}
#point_use table tr th{
	background-color: #A395F2;
	color: #FFFFFF;
	padding: 0.5em;
	width: 12em;
}
#point_use table tr th span{
	display: inline-block;
	text-align: right;
	vertical-align: baseline;
	width: 3.5em;
}
#point_use table tr td{
	background-color: #F2F1FC;
	color: #7A07D1;
	padding: 0.5em;
	width: 12em;
}
#point_use table tr td span{
	display: inline-block;
	text-align: right;
	vertical-align: baseline;
	width: 3.5em;
}
#point_available{
	text-align: center;
}
#point_available a{
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	border: 3px solid #6482DD;
	color: #6482DD;
	display: inline-block;
	height: 86px;
	line-height: 1;
	padding-top: 14px;
	text-decoration: none;
	transition: background-color 0.2s ease-out 0s;
	width: 526px;
}
#point_available a:hover{
	background-color: #6482DD;
	color: #FFFFFF;
}
#point_available a span{
	display: block;
	font-size: 87.5%;
	margin-bottom: 6px;
}
#point_available a b{
	display: block;
	font-size: 200%;
}