@charset "UTF-8";

/* -------------------------------------------
当院について　院内紹介/スタッフ紹介/料金表/採用　共通
-------------------------------------------*/
/* 共通 */
.aboutttl {
  position: relative;
  display: block;
  padding: 0;
  margin: 0;
  height: 350px;
  background-color: #222529;
  color: #FFFFFF;
  text-align: center;
}
.aboutttl h1 {
  position: relative;
  display:block;
  text-align: center;
  font-size:2em;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  letter-spacing: 0.3rem;
  padding: 220px 0 0 0;
}

.aboutcol{
  padding: 50px 0 50px 0;
}
.aboutcol h2{
  font-family: 'Noto Serif JP', serif;
  font-weight: 300;
  font-size: 2.5em;
  letter-spacing: 0.3rem;
  padding: 30px 0 80px 0;
}
.aboutcol h3{
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 1.3em;
  letter-spacing: 0.3rem;
  line-height: 2rem;
  padding: 0;
}
.aboutcol p{
  padding: 0 0 2rem 0;
}


.aboutcol .telno {
    display: inline;
}
.aboutcol .reserve {
    display: inline;
}
.aboutcol .telno a::before{
  content: '';
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("../img/common/telmark.svg");
  background-size: contain;
  vertical-align: middle;
  margin: 0 10px 3px 0;
}
.aboutcol .reserve a::before{
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url("../img/common/reservemark.svg");
  background-size: contain;
  vertical-align: middle;
  margin: 0 10px 3px 0;
}

.aboutcol .telno a:link,
.aboutcol .reserve a:link{
    display: block;
    padding: 10px 10px 12px 10px;
    margin-bottom: 1rem;
    text-decoration: none;
	font-size: 1.5em;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
	background-color: #444444;
	color: #fff;
	border: solid 1px #606060;
}
.aboutcol .telno a:hover,
.aboutcol .reserve a:hover{
    text-decoration: none;
	background-color: #444444;
	color: #fff;
	border: solid 1px #606060;
	filter: opacity(60%);
	transition : 1s;
}
.aboutcol .telno a:visited,
.aboutcol .reserve a:visited{
    text-decoration: none;
	background-color: #444444;
	color: #fff;
	border: solid 1px #606060;
}


@media(min-width: 768px){
  a[href^="tel:"]{
    pointer-events: none;
  }
}


@media screen and (max-width: 640px) {
.aboutcol h2{
  font-size: 1.8em;
  padding: 10px 0 50px 0;
}
.aboutcol h3 {
	text-align: center;
}
}


/* -------------------------------------------
院内紹介
-------------------------------------------*/
.aboutclinicslider{
  position: relative;
}
.aboutclinicslider #slider {
    width: 100%;
    height: 300px;
}

.processcol{
	background-image: linear-gradient(180deg, rgba(216,241,196,1.00),rgba(133,174,104,1.00));		  
	padding: 50px 0 80px 0;
	}
.processcol h2{
	color: #74B257;	
}
.processcol h4{
	font-size: 1.5em;
	color: #74B257;	
	font-family: 'Noto Serif JP', serif;
}
.processcol p{
	margin-bottom: 0.2rem;	
}
.processcol span{
	font-size: 1.5em;
	display: block;
	margin-bottom: 0.2rem;
}
.processcol .bi-chevron-double-down{
	color: #74B257;	
}

area {
  cursor: pointer; /* マウスカーソルをポインターに変更 */
}
.fmap {
  position: relative;
  background: url("../img/about/fmapflower.jpg") no-repeat center top;
  background-size:contain;
  width: 100%;
  height: auto;
  margin: 0 auto;
}

.modal-content {
	font-family: 'Noto Sans JP', sans-serif;
	background-color:rgba(0,0,0,0.50);/* モーダルの白背景を黒の透過にする */
	margin: 0 auto; 
}
.modal-content h4 {
	font-size: 1.2em;
	}
.modal-content p {
	font-weight: 300;
	}

.fmap .img-fluid {
  max-width: 100%;
  height: auto;
}

.equipmentcol{
	background-image: linear-gradient(180deg, rgba(236,234,228,1.00),rgba(255,255,255,1.00));		  
	padding: 50px 0 80px 0;
	}
.equipmentcol h2,
.equipmentcol h3{
	color: #9A9071;	
}
@media screen and (max-width: 767px) {
.aboutclinicslider #slider {
    width: 100%;
    height: 150px;
}
}

/* -------------------------------------------
スタッフ紹介
-------------------------------------------*/
.philosophydescription{
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  min-height: 300px;
  padding: 50px 15% 20px 15%;
  margin: 0 auto;
  background: url("../img/about/m-philosophy.png") no-repeat center top / cover;
}
.philosophydescription h2{
  font-family: 'Noto Serif JP', serif;
  font-weight: 300;
  font-size: 2em;
  letter-spacing: 0.3rem;
  line-height: 1.8em;
  padding: 0 0 30px 0;
  color: #fff;
}
.philosophydescription h2 span{
	display: block;
  font-weight: 200;
  font-size: 0.5em;
  line-height: 1.8em;
  color: #C2BCA9;
}
.philosophydescription p{
  font-family: 'Noto Serif JP', serif;
  font-weight: 300;
  font-size: 1em;
  padding: 0 0 30px 0;
  color: #fff;
}
.philosophydescription p span{
  display: block;
  font-weight: 200;
  font-size: 0.9em;
  line-height: 1.5em;  
	padding: 20px 0 0 0;
  color: #C2BCA9;
}

.profile{
	position: relative;
	background: url("../img/about/profilebgt.jpg") no-repeat right top / 100%;
	min-height: 300px;
}
.profilebottom{
	background: url("../img/about/profilebgb.jpg") no-repeat left bottom / cover;
	min-height: 300px;
	padding: 0;
	margin: 0;
}

.profile h3{
  font-family: 'Noto Serif JP', serif;
  font-size: 2.4em;	
  text-align: center;
  line-height: 1.5;
}
.profile h3 span.title{
  display: block;
  color: #68C9B6;
  font-size: 0.5em;	
}
.profile h3 span.en{
  display: block;
  color: #C2BCA9;
  font-size: 0.5em;	
}
.profile h4{
  font-family: 'Noto Serif JP', serif;
  color: #7F5E69;	  
  font-size: 1.2em;	
  margin-top: 3em;
  border-bottom: 1px solid #494949;
  display: inline-block;
  padding-bottom: 10px;
  margin-bottom: 20px;
}

.profile ul li{
	list-style: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 300;
}

.activities h2{
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 500;
	font-size: 1.3em;	
	letter-spacing: 0;
	padding: 1.5rem;
	text-align: center;
}

.activities h3{
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 500;
	font-size: 1em;	
	letter-spacing: 0;
	color: #7F5E69;
}

.activities p{
	font-size: 0.8em;	
	letter-spacing: 0;
	line-height: 1.5em;
}




/* -------------------------------------------
採用情報
-------------------------------------------*/

.recruitcol{
	background-image: linear-gradient(180deg, rgba(234,247,250,1.00),rgba(249,253,255,1.00));		  
	padding: 50px 0 80px 0;
	}

.positionshead dl {	
	display: flex;
	flex-flow: row wrap;
	width: 100%;
	font-size:1.2em;
	font-family: 'Noto Serif JP', serif;  
	letter-spacing: 0.3rem;
	color: #19A9C0;
}
.positionshead dt {
	flex-basis: 50%;
	vertical-align: middle;
	padding: 10px;
	text-align: center;
	font-weight: 500;
}
.positionshead dd {
	flex-basis: 30%;
	vertical-align: middle;
	padding: 10px;
	text-align: center;
	font-weight: 500;
}
.positionshead dd.salary {
	flex-basis: 20%;
}

.positionscont dl {	
	display: flex;
	flex-flow: row wrap;
	width: 100%;
	border-bottom: 1px solid #ccc;
}
.positionscont dt {
	flex-basis: 50%;
	vertical-align: middle;
	padding: 10px;
	font-size:1.1em;
	font-weight: 500;
	border-top: 1px solid #ccc;
}
.positionscont dd {
	flex-basis: 30%;
	vertical-align: middle;
	padding: 10px 10px 0 10px;
	text-align: center;
	font-weight: 300;
	border-top: 1px solid #ccc;
}
.positionscont dd.salary {
	flex-basis: 20%;
}

 .recruitcol ul {
	list-style: none;
	 line-height: 1.5;
}
 .recruitcol li {
	position: relative;
	 padding-left: 1em;
	 padding-bottom: 5px;
}
.recruitcol li:before {
	position: absolute;
	content: "⚫︎";
    margin-right:5px;
    top:0;
    left:0;
    color: #19A9C0;
}

@media screen and (max-width: 767px) {
.positionshead dl {
	flex-flow: column;
	padding: 0;
	text-align: left;
}
.positionshead dt {
	padding: 0;
}
.positionshead dd {
	border-top: 1px solid #EBEBEB;
	padding: 0;
}
	
.positionscont dl {
	flex-flow: column;
	padding: 30px 0 0 0;
}
.positionscont dt {
	padding: 5px 10px 5px 5px;
}
.positionscont dd {
	border-top: 1px solid #EBEBEB;
}
.positionscont span.sp {
display: inline;
}
}