﻿@media screen and (min-width:769px) {

.br-sp, .sp_tel{
	display:none;
}
.sp_logo,.sp_footimg,.sp{
	display:none;
}


}

@media screen and (max-width:768px) {
/*--------------- 非表示コンテンツ ---------------*/

#twitter, .pc, .pagetop{
	display:none;
}

/*--------------- 全体の設定 　---------------*/
body{
	font-size:1.4rem;
}
#top h2{
font-size:2.3rem;
}

.center{
	font-size:1.4rem;
	line-height:2.8rem;
}

/*---------------- オープニング ------------------*/
#splash{
	display:none;
}
/*--------------- ハンバーガーメニュー ---------------*/
#navbtn{
	display:block;
	width:50px;
	height:50px;
	border-radius:10px;
	background:#a5d4e7;
	position:absolute;
	top:5px;
	right:5px;
	z-index:100;
}
#navbtn span{
	width:40px;
	height:2px;
	background:#fdf9e7;
	position:absolute;
	transition:all 0.5s ease;
}
#navbtn span:nth-child(1){
	left:5px;
	top:11px;
}
#navbtn span:nth-child(2){
	left:5px;
	top:23px;
}
#navbtn span:nth-child(3){
	left:5px;
	top:35px;

}
#navbtn.open{
	background:#fdf9e6;
}
#navbtn.open span{
	background:#a5d4e7;
}
.open span:nth-child(1){ 
	transform:translateY(12px) rotate(45deg);
}
.open span:nth-child(2){
	opacity:0;
}
.open span:nth-child(3){
	transform:translateY(-12px)
	rotate(-45deg);
}
/*--------------- スマホ	navメニュー ---------------*/
nav{
	transition:all 1s;
	width:100%;
	height:100%;
	position:fixed;
	top:-100%;
	left:0;
	background:#fdf9e6;
	text-align:center;
	overflow:hidden;
	padding:0;
	margin:0;
}


.opennav{
	transform:translateY(100%); 
}

.sp_logo{
	display:block;
	position:relative;
	left:0;
	top:0;
}
.sp_logo img{
	width:45vw;
	min-width:180px;
	height:auto;
	position:absolute;
	left:5px;
	top:5px;
}


header nav ul{
	display:flex;
	flex-direction:column;
	margin:0;
	margin-top:max(60px,11vw);
	padding:0;
	width:100%;
	justify-content:center;
	align-items:center;

	
}
header nav ul li{
	margin:0;
	padding:0;
	margin-left:30px;
	margin-right:30px;
	width:calc(100% - 60px);
	height:10vh;
	line-height: 10vh; /* 行の高さ(heightと同じ値にする) */
	min-height:40px;
	/*縦方向の中央ぞろえ1行ver*/
	display: grid;
 	place-items: center;
	border-bottom:2px solid #a5d4e7;
	font-size:2rem;
}

nav ul li:nth-child(n+2),nav .seishin,nav .service,nav .recruit,nav .contact{
	margin-left:30px;
	width:calc(100% - 60px);
	padding:0;
}

nav ul li a,.nav_text{
	width:100%;
	position:relative;
	text-align:center;
}


header nav ul li.medical{
	margin-top:10px;
	border-bottom:none;
}

.medical a{
	font-weight:700;
	display:block;
	width:100%;
	height:70%;
	padding:0;
	margin:0;
	color:#fff;
	/*縦方向の中央ぞろえ1行ver*/
	display: grid;
 	place-items: center;
	line-height: 1.4rem; /* 行の高さ(heightと同じ値にする) */
	background:#a5d4e7;
	border-radius:30px;
}

/* ボタンのテキスト */
.nav_text:nth-child(2) {
	display:none;
}
nav .seishin,nav .service,nav .recruit,nav .contact{
	width:calc(100% - 4rem);

}
.hurigana:hover .nav_text:nth-child(1) {
	top: 0;
}


ul#top_right{
	position:absolute;
	top:0;
	right:0;
	margin:0;
	list-style:none;
	text-align:left;
}
ul#top_right a{
	transition: 0.5s;
}

.sp_tel{
	display: flex;
	width:50px;
	height:50px;
	border-radius:10px;
	background:#efc3bd;
	position:absolute;
	top:5px;
	right:60px;
	z-index:100;
	line-height:45px;
	justify-content:center;
	align-items: center;
}
.sp_tel a,.sp_tel img{
	width:35px;
	height:35px;
}


.sp_footimg{
	position:absolute;
	bottom:0px;
	text-align:center;
	width:100%;
	background:url(../img/mobile/green_sm.png) no-repeat;
	background-size:100%;
	background-position: center 30px;

}

.sp_footimg img{
	width:70vw;
	margin-bottom:10vw;
}

/*--------------- ヘッダー---------------*/

.head{
	width:100%;
	overflow:hidden;
}


header{
	height:14vw;
	min-height:60px;
	width:100%;
	z-index:50;
	orverflow:visible;
	position: fixed;
	top:0:
	left:0;
}

header #logo {
	width:fit-content;
	margin:10px;
	padding:0;
}

header #logo img {
	width:40vw;
	min-width:180px;
	height:auto;
}

.head_line{
	position: fixed;
	top:max(calc(13vw - 1px),59px);
}

img.head_line{
	width:150%;
	margin-left:-25%;
}



/*--------------- メインヴィジュアル ---------------*/
#top_img{
	height:100vw;
	min-height:450px;
	width:100%;
	top:calc(55px);
}


.slider img {
	height:100vw;
	min-height:450px;
	width:100%;
}

.content_topline{
	z-index:5;
	bottom:50px;
}


/*--------------- わたしたちにできること ---------------*/

.niji1 img{
	width:60vw;
	height:auto;
	max-width:1000px;
}

#about_us {
	background:url(../img/sky_suisai_top.png) no-repeat;
	background-size:1200px calc(150px + 170vw);
	background-position:center 280px;
	padding-top:50px;
}
#about_us .huan{
	margin-top:270px;
	width:100%;
	height:auto;
	max-height:none;
	display:flex;
	flex-direction: column;
}
.cloud1, .cloud2, .cloud3 {
	width:70%;
	height:40vw;
	/*縦方向の中央ぞろえ1行ver*/
	display: grid;
 	place-items: center;
	text-align:center;
	font-weight:700;
	position:static;
}

.cloud1 {
	margin-left:30%;
}

.cloud2 {

}
.cloud3 {
	margin-left:30%
}

.pictures{
	width:100%;
	max-width:none;
	display:block;
	position:relative;
	height:100vw;
}
.photo_left{
	position: absolute;
	top:0;
	left:0;
	width:70%;
	padding-right:0;
	background-size:min(450px,68%);
	background-position: -20px 40px;
	padding-bottom:40px;
}
.photo_left img{
	width:90%;
	height:auto;
}
.photo_right{
	position: absolute;
	top:50vw;
	right:0;
	width:60%;
	height:auto;
	padding-top:0;
	padding-left:0;
	height:auto;
	background-size:min(400px,70%);
	background-position: 80px 30px;
	padding-bottom:0px;
}
.photo_right img{
	width:90%;
}

/*　虹グラデボタン　ここから*/
#about_us .btn{
	width:calc(100% - 60px);
	max-width:600px;
	height:60px;
	margin:20px auto 50px auto;

}
#about_us .btn a{
	height:100%;
	width:100%;
	max-width:596px;
}

/*　虹グラデボタン　ここまで*/


/*--------------- お知らせ ---------------*/
#topic{
	max-width:1100px;
	width:100%;
	margin:0 auto 0 auto;
	text-align:center;
	position:relative;
}
.news{
	width:95vw;
	max-width:none;
	margin:0 auto 100px auto;
	padding:50px 0 60px 0;
	flex-direction:colmun;
	justify-content:center;
	font-size:1.4rem;
}

.news dt{
	margin:0;
	padding:10px 0 0 0;
	width:90%;
	border-bottom:none;
}
.news dd{
	margin:0 0 0 2px;
	padding:0 0 10px 0;
	width:90%;
}

/*--------------- 営業時間 ---------------*/
.niji2{
	position:absolute;
	top:-15vw;
	right:0;
	z-index:1;
}
.niji2 img{
	width:50vw;
	height:auto;
	max-width:1000px;
}
#biz_hours .inner{
	max-width:none;
}

.biz_flex_box{
	width:100%;
	max-width:none;
	margin:20px auto 100px auto;
	font-size:max(3vw,1.4rem);
	flex-direction:column-reverse;
	text-align:center;
	align-items: center; /* columnで縦並び時のみ、align-itemsで子要素センタリング可能*/
}
.biz_flex_box p{
	height:calc(50px + 6vw);
}
.biz_flex_box div:first-child{
	width:calc(100% - 60px);
	margin:0;
	text-align:center;
}
.biz_flex_box div:last-child {
	width:calc(100% - 60px);
	padding-left:0;
	margin:0;
	padding-bottom:20px;
}
.biz_pic{
	width:60vw;
	max-width:none;

}
.biz_flex_box p:first-child{
	margin-bottom:0px;
}
.biz_flex_box .eigyou01{
	font-size:2.2rem;
}
.biz_flex_box .eigyou02{
	font-size:2rem;
}
.biz_hours{
	font-size:2.2rem;
}
.biz_hours .sm{
	font-size:2rem;
}

.biz_tel{
	font-size:max(4.5vw,2.3rem);
}
p.hours{
	margin-top:20px;
	display:flex;
	align-items: flex-end;
	font-size:max(4.5vw,2.4rem);
	height:50px;
	text-align:center;
}
p.hours img{
	width:20%;
	padding-bottom:10px;
	margin:0;
}
p.hours span{
	display:block;
	margin:0 10px;
	width:60%;
}
p.hours span .number{
	display:inline;
	margin:0;
	font-size:max(5vw,3.6rem);
}


/*　虹グラデボタン　ここから*/
#biz_hours .mail_btn{
	height:45px;
	padding: 3px;
	margin:20px auto 0 auto;
}

#biz_hours .mail_btn a{
	font-size:max(3vw,1.2rem);

}

/*　虹グラデボタン　ここまで*/

/*--------------- フッター ---------------*/
.suisai_bottom{
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	object-fit: cover; 
	height:calc(1200px + 100vw);
	z-index:0;
}

.foot_pic{
	top:calc(-50px - 6vw);
	z-index:10;
}
.foot_pic img{
	width:90vw;
	height:auto;
}

footer{
	background:url(../img/green_suisai.png) top 3vw center no-repeat;
	background-size:cover;
	position:relative;
	z-index:1;
	padding-top:50px;
}

footer .sns img{
	width:max(45px,7vw);
	height:auto;
}

footer .sns a {
	margin:5vw;
}

footer .link{
	display:flex;
	flex-direction:column;
}

footer .link a{
	margin:0;
	width:calc(100% - 80px);
	max-width:100%;
	margin:8px 40px;
	font-size:2rem;
}

#sitemap {
	flex-direction:column;　/*並びを縦方向へ*/
	max-width:100%;
	justify-content:flex-start;  /*flex内コンテナの垂直配置を上ぞろえに（height指定しないと効かない）*/
/*	align-items:flex-start;      縦軸での位置を指定（direction:columnだときかないのでここでは不要）*/
	margin:0 auto;
	height:200px;
}
#sitemap li{
	line-height:50px;
	margin:0;
	font-size:min(3.5vw,1.8rem);
	text-align:left;
}

#sitemap li:nth-child(-n+4){
	margin-left:14vw;
}

#foot{
	font-size:1.2rem;
}


.slick-dots li button:before{
	font-size:15px!important;
	color: #fff;
	opacity: .4;
}
.slick-dots li{
	width:30px!important;
	top:calc(-1 * (80px + 5vw));
}
.slick-dots li.slick-active button:before
{
    opacity: 1;
    color: #fff;
}

}
