@charset "utf-8";

/* *****************************************************************************
   タブレット用のスタイル記述
***************************************************************************** */
@media screen and (min-width: 0px) and (max-width: 768px) {

	/* -----------------------------------------------------------------------------
	 Header
	----------------------------------------------------------------------------- */
	header {
		height: 50px;
	}

	header a {
		text-decoration: none !important;
	}

	header > .inner {
		width: 100%;
		box-shadow: 0px 3px 10px 0px rgba(204,204,204,0.20);
	}

	header > .inner > .logo {
		padding: 0 50px 0 10px;
		white-space: nowrap;font-size: .8em;
		font-weight: 300;color: #515151;
	}
	/*header > .inner > .logo a{
		white-space: nowrap;
			}*/
	header > .inner > .logo img{
		height: 30px;
		vertical-align: middle;
		margin-right: 5px;
	}

	header > .inner > navi{
		box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
		opacity: 0;
	}
	header > .inner > navi > ul {
		display: block;
	}

	header > .inner > navi > ul > li {
		padding-left: 0;
    	text-indent: 0;
	}

	header > .inner > navi > ul > li a {
		font-size: .95em;
		color: #515151;
		margin: 0;
		padding: 5px 20px;
		display: block;
		width: 100%;
		height: 100%;
	}

	header > .inner > navi > .translation {
		padding: 5px 20px;
		display: block;
	}


	/* bt-menu */
	#bt-menu {
		position: absolute;
		top: 0;
		right: 0;
		width: 50px;
		height: 50px;
		background-color: #fff;
		z-index: 10;
		cursor: pointer;
	}

	#bt-menu span {
		position: absolute;
		top: 24px;
		right: 10px;
		width: 30px;
		height: 2px;
		background-color: #aaa;
		transition: .3s;
	}

	#bt-menu span::before {
		position: absolute;
		top: -10px;
		right: 0;
		content: "";
		width: 30px;
		height: 2px;
		background-color: #aaa;
		display: block;
		transition: .3s;
	}

	#bt-menu span::after {
		position: absolute;
		top: 10px;
		right: 0;
		content: "";
		width: 30px;
		height: 2px;
		background-color: #aaa;
		display: block;
		transition: .3s;
	}

	#bt-menu.open span {
		background-color: transparent;
		transition: .3s;
	}

	#bt-menu.open span::before {
		top: 0;
		-moz-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
		transition: .3s;
	}

	#bt-menu.open span::after {
		top: 0;
		-moz-transform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg);
		transition: .3s;
	}


	/* style1 */
	header.style1 {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		background-color: #fff;
		z-index: 999;
	}

	header.style1 > .inner > .logo {
		height: 50px;
		vertical-align: middle;
		display: table-cell;
	}

	header.style1 > .inner > navi {
		position: absolute;
		top: 50px;
		right: 0;
		padding: 5px 0 10px;
		background-color: #fff;
	}

	/* style2 */

	/* powered by Sangyo Navi */
	.powered {
		display: block;
		font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
		font-size: 12px;
		color: #bbb;
		text-align: right;
		margin: 5px 10px 0;
		padding: 3px 5px 0;
		border-top: 1px solid #ddd;
	}


	/* -----------------------------------------------------------------------------
	 Top Contents
	----------------------------------------------------------------------------- */
	#top-contents {
		/* max-width: 1200px; */
		width: 100%;
		margin: 0 auto;
		position: relative;
	}

	#top-contents .slider img {
		width: 100%;
		height: 80vw;
	}

	#top-contents .slider {
		position: relative;
		z-index: 1;
	}

	#top-contents .layer1 {
		position: absolute;
		/*top: 0;
		left: 0;*/
		z-index: 5;
	}

	#top-contents .layer2 {
		position: absolute;
		/*top: 20%;
		right: 5%;*/
		z-index: 7;
	}

	#top-contents .layer3 {
		position: absolute;
		bottom: 5%;
		right: 5%;
		width: 50%;
		z-index: 9;
	}
	#top-contents .layer3 img{
		width: 100%;
	}



	/* -----------------------------------------------------------------------------
	 Breadcrumb
	----------------------------------------------------------------------------- */
	#breadcrumb {
		font-size:0.85em;
		max-width:1200px;
		margin:0 auto;
		padding:15px 10px;
		text-align:left;
		background-color: #fff;
	}

	#breadcrumb .login {
		width:120px;
		text-align:right;
		float:right;
	}

	#breadcrumb .login img {
		margin-right:5px;
		vertical-align:top;
	}

	#breadcrumb .login a {
		color:#515151;
		text-decoration:none;
	}
	#breadcrumb .login a:hover {
		color:#E32828;
		text-decoration:none;
	}

	#breadcrumb .bc {

	}

	#breadcrumb .bc img {
		width:14px;
		vertical-align:top;
	}

	#breadcrumb .bc a {
		color:#515151;
		text-decoration:none;
	}
	#breadcrumb .bc a:hover {
		color:#E32828;
		text-decoration:none;
	}


	/* -----------------------------------------------------------------------------
	 contents
	----------------------------------------------------------------------------- */
	main .contents {
		background-color: #fff;
		overflow: hidden;
	}

	main .contents.fixed {
		background-color: transparent;
	}

	main .contents .fixed-bg {
		position: fixed;
		top: 0;
		left: 0;
		width:100%;
		height:100vh;
		z-index:-1;
	}

	.w1024 {
		height: auto !important;
		margin: 40px 10px;
	}

	main .contents:first-child .w1024 {
		margin-top: 0;
	}

	.w1024.bg {
		background-color: #fff;
		padding:20px;
	}

	.layer {
		position: static;
		width: auto !important;
		width: 100% !important;
	}

	.contents section {
		margin-bottom: 40px;
	}







	/* -----------------------------------------------------------------------------
	 Footer
	----------------------------------------------------------------------------- */
	footer {
		position: relative;
		font-size: 0.92em;
		padding: 50px 0 30px;
		background-color: #ff8a32;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}

	footer .pagetop a {
		position: absolute;
		top: -30px;
		left: 50%;
		width: 50px;
		height: 50px;
		margin-left: -25px;
		border: 2px solid #fff;
		background-color: #ff8a32;
		text-decoration: none;
		border-radius: 50%;
		-moz-border-radius: 50%;
		-webkit-border-radius: 50%;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		display: block;
	}

	footer .pagetop a::before {
		color: #fff;
		font-size: 20px;
		content: "▲";
		margin-top: 14px;
		text-align: center;
		line-height: 1em;
		display: block;
	}

	footer .inner {
		margin: 0 10px;
	}

	footer .pagetop a span {
		display: none;
	}

	footer .login {
		margin: 40px auto 0;
		text-align:center;
		display: block;
	}

	footer .login img {
		margin-right:5px;
		vertical-align:middle;
	}

	footer .login a {
		color:#fff;
		text-decoration:none;
		display: inline-block;
	}
	footer.login a:hover {
		color:#E32828;
		text-decoration:none;
	}

	footer .copy {
		color: #fff;
		margin-top: 20px;
		text-align: center;
	}


	/* -----------------------------------------------------------------------------
	 parts
	----------------------------------------------------------------------------- */
	/*parts-txt-img 	*/
	/* parts-img-box */
	

	/* parts-table */
	
	/* parts-sns */
	


	/* -----------------------------------------------------------------------------
	 財団カスタマイズ
	----------------------------------------------------------------------------- */

	/* parts-txt-img2 */
	
	/* 3分割 */
	
	/* 4分割 */
	

	/* fukidashi */
	
	/* flow 横 */
	
	/* 会社概要 */
	.cpn_tbl table th,
	.cpn_tbl table td{
		display: block;
	}
	.cpn_tbl table th{
		border-bottom: none;
		padding: 7px 0 0 5px;
	}

	/* お問合せ */
	.contact{
		flex-direction: column;
		margin: 0;
	}
	.contact .left,
	.contact .right{
		width: 100%;
	}
	.contact .left:after{
		width: 0;
	}
	.contact .left a{
		font-size: calc(1.5em + 2vw);
	}
	.contact .right{
		margin-top: 20px;
	}

	/* 横問合せボタン */
	.cv_btn_area {
		right: auto;
		left: 0;
		top: auto;
		bottom: 0;
		width: 100%;
		overflow: hidden;
	}
	.cv_btn_area .btn {
		align-items: flex-end;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;width: auto;
	}
	.cv_btn_area .btn a {
		height: 20px;
		font-size: 13px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 15px 0px;
		border-radius: 0;
		text-align: center;
		width: 100%;
  
	}
	.cv_btn_area .btn a i {
		display: inline-block;
		height: auto;
		width: 30px;
		margin-bottom: 0;
		margin-right: 10px;
	}
	.cv_btn_area .btn a br {
		display: none;
	}
.cv_btn_area .btn a:nth-child(1) {
   padding: 15px 0px;}
	.fix_contact_text .inblock{margin-right: 1em}

	/* レスポンシブ出し分け */
	.for-pc{
		display: none;
	}



	/* -----------------------------------------------------------------------------
	 個別設定
	----------------------------------------------------------------------------- */
	.w1024 {margin: 40px 15px;}
	#top-contents .slider img {
		height: 60vw;/*2000*1200*/
		}
/*---------- 共通 -------------*/

/*img*/
/*title*/
/*button*/

/*横問合せボタン　２つ*/
#fix_contact_btn a,
#fix_contact_btn form{	
	height: auto;
	border-right: 1px solid #fff;

}
#fix_contact_btn a:last-child{
	border-right: none;
}
/*header*/
/*footer*/
footer{
	background-color: var(--bgbrw-color);
	border-top: 1px solid var(--grn-color);
	padding-bottom: 80px;
}
.footer-info,
footer .login a,
footer .copy{
	color: #7f7f7f;
}
/*.footer-info img{
	width: 200px;
}*/
footer .pagetop a{
	background-color: var(--grn-color);
}
footer .pagetop a:hover{
	background-color: #595959;
}

/*---------- top -------------*/
/*#top-contents .layer1{
	top: 12%;
	left: 3%;
	width: 40vw;
	height: 40vw;
}*/
/*---------- con1 -------------*/
	.con1 {background-position: right -10vw bottom;}
.feature-box{
	flex-wrap: wrap;
	justify-content: space-around;
}
	.feature-area {padding: 0}

/* point */
.point-h3 .em{display: block;}
.point-item .txt{font-size: 1.1em;}


	/*---------- con2 -------------*/
	.point-hdg {
		font-size: 1.5rem;}
	.tab-none{display: none;}
	.campaign-area{
	padding: 30px;
}

	.campain-bdy {
		padding: 1.5em 1em;}
.campain-box{
	flex-direction: column;
	  justify-content: center;
}
.campain-item{
	width: 100%;
	max-width: 500px;
	margin: auto;
}
	.con2 .half {
  padding: 0 15px;
}
	.campain-h3 {font-size: 2.2em;}

.therapist-item {
	width: 100%;}
/*---------- con3 -------------*/
.info-area{
	flex-direction: column;
	justify-content: center;
}
.cpn_tbl,
.cpn_tbl table,
.info-img{width: 100%;}
.cpn_tbl table{margin: 20px auto;}
.info-img{text-align: center; margin-bottom: 20px;}
.info-area .info-img {
  width: 500px;max-width: 100%;
}
/*---------- con4 -------------*/
	.contact-box{
		flex-direction: column;
		justify-content: center;
	}
	.contact-box li{
		width: 90%;
		max-width: 450px;
		margin: 0 auto 1em;
	}
/*---------- con5 -------------*/
.contact-box {
	margin: 0;}
	.link-tel .lnk_btn a {
		padding: 0 ;}
	.contact-box li.link-tel .lnk_btn {margin-top:0 }
	.parts-h1 {margin-bottom: 0}

}

/* *****************************************************************************
   600px以下
***************************************************************************** */
@media screen and (max-width: 600px) {
	#top-contents .slider img {
		height: 90vw;
		/*min-height: 500px;高さ500px固定*/
		object-position: 70% center;
		object-fit: cover;
	}
	#top-contents .slider div:nth-child(1) img{object-position: 60% 100%;}
	#top-contents .slider div:nth-child(2) img{object-position: 50% 100%;}
	#top-contents .slider div:nth-child(7) img{object-position: 80% 100%;}

	#top-contents .layer1{
		/*top: 70%;
		transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
		left: 0;
		border-radius: 0;
		width:auto;
		height: auto;
		display: flex;
		flex-direction: column;
		padding: 1em 1.5em;
		background-color: rgba(30,23,2,0.40);*/
		 width: 50vw;
  height: 50vw;
  padding: 1vw;
  top: 16vw;
  left: 3vw;}
  
	.layer1 h1{
		font-size:3.2vw;
		/*margin-top: auto;
		font-size: 1.2em;*/
	}
	.layer1 h1 .em{font-size: 1.15em;}
 .layer1 h2{
  font-size: 6.2vw;
		/*font-size: 1em;
		color: #fff;*/
	}
	/*#top-contents .layer1 h2 .line2{
		display: block;
	}*/
	.layer1 h3{font-size: 3.65vw;padding-left: 2.7em;}
	.layer1 h3 .inblock {
		font-size: .7em;top: -.9em;}
	#top-contents .layer2{width: 20vw;}
	
	
	.con1 .parts-img img{width:80%}
	
	.point-hdg{font-size: 1.2rem;}
	.point-item .txt{padding: 30px 25px}
	
	.feature-item {
		width: 195px;height: 195px;font-size: 1.20em;}
	.intro{font-size: 1.05em;}
	
	.therapist-box{
        flex-direction: column;
  	    justify-content: center;
		padding: 0;
}
.con-chatch{font-size: 1.4em;}
.intro{font-size: 1.1em;}
	
	.campain-h3{line-height: 1.3}
	.campain-h3::before, .campain-h3::after {height: 1.9em;}
	.campain-h3::before{margin-right: 40px}
	.campain-h3::after{margin-left: 40px}
	
.therapist-txt,
.therapist-img{width: 100%;}
.therapist-img img{width:95%;max-width: 580px;}
.therapist-txt{margin-bottom: 1em;}
	/*price-table*/
	.price-table table thead,
	.price-table table tbody td.nbsp{
		display:none;
	  }
	.price-table table {
		width: 100%; 
	  }
	.price-table table tbody th,
	.price-table table tbody td {
		display: block;
		width: 100%;
		border-bottom:none;
	  }
	.price-table table tbody th{
		background: var(--dark-color);
		color:#fff;
		font-weight:bold;
		text-align: center;
	  }
	.price-table table td:before{
		content: attr(data-label);
		/*font-size: .8rem;*/
		font-weight:400;
		/*color: #999;*/
		display:inline-block;
	  }
	  .price-table table tr:last-child{
		border-bottom: solid 1px #ccc;
	  }
	/*.therapist-item{padding: 1.5rem;}*/
	.therapist-area{padding: 0}
	.therapist-txt div li{font-size: 1.2rem;line-height: 1.3;padding-top: .6em}
	.therapist-txt div li span{font-size: 1.05rem;}
	.therapist-txt h5{font-size: 1.2rem;width: 5.5em;height: 5.5em;line-height: 5.5em}
	.therapist-txt div{width: calc(97% - 6.6rem)}
	.cv_btn_area .btn a {flex-direction: column;}
	.cv_btn_area .btn a i{margin-right: 0;}
	footer {
		 padding-bottom: 90px;}
}