@charset "utf-8";
/*
001: Page Block
002: Page Title Block
003: Page Content Block
004: Page Content Title Block
005: Calendar Block
006: Therapist Block
007: Loadmore Block
*/
/*---------------------------------------
	001: Page Block
---------------------------------------*/
#section1 {
	height						: 100vh;
	height						: 360px;
}
#section1:before {
	display						: block;
	position					: fixed;
	top							: 0;
	width						: 100%;
	height						: 100%;
	z-index						: -1;
	content						: "";
}


/*---------------------------------------
	002: Page Title Block
---------------------------------------*/
#page_title_block {
	display						: -ms-flexbox;
	display						: flex;
	-ms-flex-wrap				: wrap;
	flex-wrap					: wrap;
	position					: relative;
}
#page_title_box {
	position					: absolute;
	top							: 160px;
	left						: 10px;
	right						: 0;
}
h1#main_title {
	display						: inline-block;
	font-family					: 'Frank Ruhl Libre', serif;
	font-size					: 40px;
	font-size					: 4.0rem;
	font-weight					: 300;
	color						: #FFF;
	margin-bottom				: 20px;
}
h1#main_title::before {
	position					: absolute;
	top							: 55px;
	left						: 0;
	width						: 70px;
	height						: 2px;
	background					: #FFF;
	content						: "";
}
p#sub_title {
	font-size					: 12px;
	font-size					: 1.2rem;
	color						: #EEE;
}


/*---------------------------------------
	003: Page Content Block
---------------------------------------*/
#section2 {
	position					: relative;
	background-image			: url(../images/bg/bg_page_top.png), url(../images/bg/bg_page_bottom.png), url(../images/bg/section_one.jpg);
	background-position			: right top, left bottom, center top;
	background-repeat			: no-repeat, no-repeat, repeat;
	background-size				: 280px, 280px, auto;
	padding-top					: 30px;
	padding-bottom				: 30px;
}
article#content_block {
	display						: -ms-flexbox;
	display						: flex;
	-ms-flex-wrap				: wrap;
	flex-wrap					: wrap;
	padding-left				: 0;
	padding-right				: 0;
}


/*---------------------------------------
	004: Page Content Title Block
---------------------------------------*/
h2#content_title {
    font-size						: 13px;
    font-size						: 1.3rem;
    font-weight						: 400;
    letter-spacing					: 2px;
	color							: #727285;
    margin-top						: 0;
    margin-bottom					: 25px
}
h2#content_title::after {
    display							: block;
    font-family						: 'Frank Ruhl Libre', serif;
    font-size						: 22px;
    font-size						: 2.2rem;
	color							: #525263;
    text-transform					: uppercase;
    letter-spacing					: 3px;
    margin-top						: 7px;
    content							: attr(data-title)
}
h2#content_title:before {
    position						: absolute;
    left							: 10px;
    top								: 55px;
    width							: 70px;
    height							: 2px;
	background						: #525263;
    content							: ""
}


/*---------------------------------------
	005: Calendar Block
---------------------------------------*/
#calendar_block {
	position					: relative;
	margin-bottom				: 15px
}
ul#calendar_list {
	display						: none
}
#tinynav1 {
	display						: block;
	width						: 100%;
	font-size					: 16px;
	font-size					: 1.6rem;
	outline						: 0;
	text-indent					: .01px;
	text-overflow				: '';
	background-image			: -webkit-linear-gradient(left, #525263, #727288);
	background-image			: -o-linear-gradient(left, #525263, #727288);
	background-image			: linear-gradient(right, #525263, #727288);
	vertical-align				: middle;
	appearance					: none;
	-webkit-appearance			: none;
	-moz-appearance				: none;
	height						: 60px;
	line-height					: 60px;
	border						: 0;
	color						: #FFF;
	border-radius				: 0;
	padding-left				: 15px
}


/*---------------------------------------
	006: Therapist Block
---------------------------------------*/
#therapist_block {
	display						: -ms-flexbox;
	display						: flex;
	-ms-flex-wrap				: wrap;
	flex-wrap					: wrap;
}
article.therapist_box {
	color						: #000420;
	text-align					: center;
	margin-bottom				: 20px;
	z-index						: 4;
}
article.therapist_box a {
	color						: #000420;
	text-decoration				: none;
}
article.therapist_box:nth-child(even) {
	padding-right				: 0;
}
article.therapist_box:nth-child(odd) {
	padding-left				: 0;
}
article.therapist_box .inner {
	background					: #FFF;
	box-shadow					: 0 1px 3px rgba(0,0,0,0.2);
	padding-right				: 0;
	padding-left				: 0;
	overflow					: hidden;
}
article.therapist_box .therapist_img {
	position					: relative;
	overflow					: hidden;
}
article.therapist_box .therapist_img img {
	width						: 100%;
	height						: auto;
}
article.therapist_box .therapist_img:before {
	display						: block;
	padding-top					: 120%;
	content						: ""
}
article.therapist_box .therapist_img img,
article.therapist_box .therapist_img:after {
	display						: block;
	position					: absolute;
	top							: 0;
	width						: 100%
}
.therapist_img:after {
	display						: block;
	position					: absolute;
	top							: 0;
	left						: 0;
	width						: 100%;
	height						: 100%;
	background					: rgba(82,82,99,0.6);
	opacity						: 0;
	transition					: .5s;
	content						: "";
}
article.therapist_meta {
	padding						: 0;
}
article.therapist_box .inner:hover .therapist_img:after {
	opacity						: 1;
}
/* Therapist Lank */
article.therapist_box .label {
	position					: absolute;
	top							: 20px;
	left						: -14px;
	font-family					: 'Noto Serif JP', "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	font-size					: 10px;
	font-size					: 1rem;
	font-weight					: 400;
	text-align					: center;
	color						: #FFF;
	width						: 100px;
	transform					: skew(40deg, -40deg);
	z-index						: 2;
}
article.therapist_box .new {
	background					: rgba(234, 18, 100, 0.8);
}
article.therapist_box .new:before {
	content						: "New";
}
article.therapist_box .silver {
	background					: rgba(97, 97, 97, 0.8);
}
article.therapist_box .silver:before {
	content						: "Silver";
}
article.therapist_box .gold {
	background					: rgba(237, 209, 90, 0.8);
}
article.therapist_box .gold:before {
	content						: "Gold";
}
article.therapist_box .platinum {
	background					: rgba(20, 77, 164, 0.8);
}
article.therapist_box .platinum:before {
	content						: "Platinum";
}
article.therapist_box .diamond {
	background					: rgba(40, 40, 40, 0.8);
}
article.therapist_box .diamond:before {
	content						: "Diamond";
}
/*SPコース対応状況*/
article.therapist_box .sp_possible,
article.therapist_box .sp_impossible,
article.therapist_box .bt_possible,
article.therapist_box .bt_impossible {
	position					: absolute;
	font-family					: 'Noto Serif JP', "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	font-size					: 10px;
	font-size					: 1rem;
	font-weight					: 400;
	text-align					: center;
	color						: #FFF;
	width						: 80px;
	padding						: 5px 10px;
	z-index						: 2;
}
article.therapist_box .sp_possible {
	bottom						: 38px;
	left						: 10px;
	background					: rgba(242,133,139,0.8);
}
article.therapist_box .sp_possible:before {
	content						: "SP対応可";
}
article.therapist_box .sp_impossible {
	bottom						: 38px;
	left						: 10px;
	background					: rgba(218,218,218,0.8);
}
article.therapist_box .sp_impossible:before {
	content						: "SP不可";
}
/*出張可否*/
article.therapist_box .bt_possible {
	bottom						: 10px;
	left						: 10px;
	background					: rgba(131,177,253,0.8);
}
article.therapist_box .bt_possible:before {
	content						: "出張可";
}
article.therapist_box .bt_impossible {
	bottom						: 10px;
	left						: 10px;
	background					: rgba(218,218,218,0.8);
}
article.therapist_box .bt_impossible:before {
	content						: "出張不可";
}
article.therapist_box h3.name {
	font-size					: 15px;
	font-size					: 1.5rem;
	font-weight					: 400;
	overflow					: hidden;
	text-overflow				: ellipsis;
	white-space					: nowrap;
	width						: 100%;				/*消すと横幅いっぱい*/
	padding-top					: 8px;
	padding-bottom				: 3px;
	margin-left					: auto;
	margin-right				: auto;
	margin-bottom				: 0;
}
article.therapist_box .style {
	font-size					: 12px;
	font-size					: 1.2rem;
	padding-top					: 0;
	padding-bottom				: 8px;
	border-bottom				: 1px solid #ebebeb;
}
article.therapist_box .style span {
	color						: #999;
	font-size					: 11px;
	font-size					: 1.1rem
}
article.therapist_box .schedule {
	font-size					: 17px;
	font-size					: 1.7rem;
	font-weight					: 500;
	color						: #333;
	width						: 100%;				/*消すと横幅いっぱい*/
	margin						: 0 auto;
	border-radius				: 30px;
	margin-bottom				: 15px
}
article.therapist_box .comment {
	font-size					: 12px;
	font-size					: 1.2rem;
	text-align					: left;
	display						: -webkit-box;
	-webkit-box-orient			: vertical;
	-webkit-line-clamp			: 2;
	overflow					: hidden;
	margin						: 0;
	padding						: 0 10px 0 10px;
	margin-bottom				: 10px;
}
article.therapist_box .more {
	display						: inline-block;
	position					: absolute;
	left						: 50%;
	top							: 50%;
	font-size					: 10px;
	font-size					: 1rem;
	color						: #fff;
	text-align					: center;
	width						: 100px;
	border						: 1px solid #fff;
	transition					: .6s;
	transform					: translate(-50%, -50%);
	padding						: 6px 3px;
	opacity						: 0;
	z-index						: 1;
}
article.therapist_box:hover .more,
article.therapist_box:hover .therapist_img:after {
	opacity						: 1
}


/*---------------------------------------
	007: Loadmore Block
---------------------------------------*/
#loadmore {
	display						: inline-block;
	position					: relative;
	font-size					: 16px;
	font-size					: 1.6rem;
	text-align					: center;
	text-decoration				: none;
	color						: #FFF;
    background					: #525263;
	width						: 100%;
	height						: 60px;
	line-height					: 60px;
	-moz-transition				: all 0.6s;
	-o-transition				: all 0.6s;
	-webkit-transition			: all 0.6s;
	transition					: all 0.6s;
	overflow					: hidden;
	z-index						: 0;
}
#loadmore:hover {
	color						: #fff;
}
#loadmore::after {
	position					: absolute;
	top							: 24px;
	right						: 10px;
	background					: url("../images/svg/view/arrow.svg") no-repeat right center / 12px 12px;
	width						: 12px;
	height						: 12px;
	content						: '';
	z-index						: 2;
}
#loadmore::before {
	position					: absolute;
	top							: 0;
	left						: 0;
	width						: 120%;
	height						: 100%;
	background					: #727288;
	transform-origin			: left top;
	transform					: skewX(-30deg) scale(0, 1);
	transition					: transform .3s;
	content						: '';
	z-index						: -1;
}
#loadmore:hover::before {
	transform-origin			: left top;
	transform					: skewX(-30deg) scale(1, 1);
}




@media only screen and (min-width: 768px) {
/*---------------------------------------
	001: Page Block
---------------------------------------*/
#section1 {
	height						: 100vh;
	height						: 500px;
}
#section1:before {
	content						: "";
	position					: fixed;
	top							: 0;
	display						: block;
	z-index						: -1;
	width						: 100%;
	height						: 100%;
}


/*---------------------------------------
	002: Page Title Block
---------------------------------------*/
#page_title_block {
	display						: -ms-flexbox;
	display						: flex;
	-ms-flex-wrap				: wrap;
	flex-wrap					: wrap;
	position					: relative;
}
#page_title_box {
	position					: absolute;
	top							: 220px;
	left						: 10px;
	right						: 0;
}
h1#main_title {
	display						: block;
	font-family					: 'Frank Ruhl Libre', serif;
	font-size					: 58px;
	font-size					: 5.8rem;
	color						: #FFF;
	font-weight					: 300;
    letter-spacing				: 2px;
	margin-bottom				: 20px;
}
h1#main_title::before {
	position					: absolute;
	top							: 73px;
	left						: 0;
	width						: 70px;
	height						: 2px;
    background					: #FFF;
	content						: "";
}
p#sub_title {
	font-size					: 13px;
	font-size					: 1.3rem;
	color						: #EEE;
}


/*---------------------------------------
	003: Page Content Block
---------------------------------------*/
#section2 {
	position						: relative;
	background-image				: url(../images/bg/bg_page_top.png), url(../images/bg/bg_page_bottom.png), url(../images/bg/section_one.jpg);
	background-position				: right top, left bottom, center top;
	background-repeat				: no-repeat, no-repeat, repeat;
	background-size					: 600px, 600px, auto;
	padding-top						: 60px;
	padding-bottom					: 60px;
}


/*---------------------------------------
	006: Therapist Block
---------------------------------------*/
#therapist_block {
	display						: -ms-flexbox;
	display						: flex;
	-ms-flex-wrap				: wrap;
	flex-wrap					: wrap;
	padding-right				: 0;
	padding-left				: 0;
}
article.therapist_box:nth-child(even) {
	padding-right				: 10px;
}
article.therapist_box:nth-child(odd) {
	padding-left				: 10px;
}
}




@media only screen and (max-width: 991px) {
/*---------------------------------------
	006: Calendar Block
---------------------------------------*/
#calendar_block:after {
	position					: absolute;
	top							: 25px;
	right						: 30px;
	content						: "";
	display						: inline-block;
	width						: 0;
	height						: 0;
	margin-right				: 0px;
	margin-left					: 0px;
	border						: transparent solid 10px;
	border-top-color			: #FFF;
	vertical-align				: middle;
	z-index						: 2;
}
}




@media only screen and (min-width: 992px) {
/*---------------------------------------
	005: Calendar Block
---------------------------------------*/
#tinynav1,
.tinynav_label,
.schedule_select {
	display						: none
}
#calendar_block:before,
#calendar_block:after{
	content						: "";
	display						: block;
	height						: 1px;
	background-image			: -webkit-linear-gradient(left, #525263, #727288);
	background-image			: -o-linear-gradient(left, #525263, #727288);
	background-image			: linear-gradient(right, #525263, #525263);
}
ul#calendar_list {
	display						: block;
	border-left					: 1px solid #525263;
/*
	border-right				: 1px solid #b5e6fc;
*/
	margin-bottom				: 0;
	margin-left					: 0;
	margin-right				: 0;
	padding						: 0;
}
ul#calendar_list li {
	float						: left;
	font-size					: 16px;
	font-size					: 1.6rem;
	text-align					: center;
	width						: 16.666%;
	border-right				: 1px solid #525263;
}
ul#calendar_list li:last-child {
	border-right				: none;
}
ul#calendar_list li a {
	display						: block;
	font-weight					: 400;
	color						: #525263;
	padding						: 15px 0
}
ul#calendar_list:after,
ul#calendar_list:before {
	content						: " ";
	display						: table
}
ul#calendar_list:after {
	clear						: both
}
ul#calendar_list li a:hover,
ul#calendar_list li.active a {
	background-image			: -webkit-linear-gradient(left, #525263, #727288);
	background-image			: -o-linear-gradient(left, #525263, #727288);
	background-image			: linear-gradient(right, #525263, #727288);
	color						: #FFF;
	-moz-transition				: all 0.3s;
	-o-transition				: all 0.3s;
	-webkit-transition			: all 0.3s;
	transition					: all 0.3s;
}
ul#calendar_list li.sun a {
	color						: #c00 !important
}
ul#calendar_list li.sat a {
	color						: #03c !important
}
ul#calendar_list li:last-child {
	display						: none
}
}