@charset "UTF-8";
/* CSS Document */
body,html{
	margin:0;
	padding:0;
	background-color:#ffffff;
	color:#555555;
	/* font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif; */
}
h1{
	margin-top:0px;
	margin-bottom:0px;
	color:#333333;
	letter-spacing:4px;
}
h2{
	 margin-bottom:8px;
}
h3{
	 margin-bottom:2px;
}
p span{
	display: inline-block;
}
#container{
	width:500px;
	height:100%;
	margin:0 auto;
	text-align:center;
	background-color:#f9f6f6;
}
.large_only{
	display:none;
}

.doctor-box-r{
	padding-left:32px;padding-right:32px;
}

#time_table{
	width:auto;
}

/* ラージサイズ */
@media screen and (min-width: 500px) {
  #container{
  	width:950px;
  	height:100%;
  	margin:0 auto;
  	text-align:center;
  	background-color:#f9f6f6;
  }
  #head_subtitle{
	display:inline;
	padding-left:8px;
  }
  .doctor-box-l{
	float:left;width:36%;
  }
  .doctor-box-r{
	float:right;width:52%;
	padding-left:0;padding-right:0;
  }
  #time_table{
	width:550px;
  }
  .large_only{
	display:inline;
  }
} /* ラージサイズ end */

/*--- その他 ---*/
.telnum{
	font-size: x-large;
	text-decoration: none;
	color:#333333;
}
.phone{
	letter-spacing:1px;
}
/*--- ヘッダ ---*/
#head_main{
	margin-bottom:32px;
	background:url(../img/bg2.jpg) round top left;
}
.head_relative{
	margin:0 auto;
	position: relative;
	max-width: 640px;
	width:100%;
}
/*--- リンク ---*/
.body_link{
	max-width:780px;
	margin:0px auto;
	padding:8px 16px 8px 16px;
}
.body_link_bg{
	background-color: #ffffff;
	padding:10px;
	text-align: left;
	border-radius:10px;
}
.body_link_flex{
	margin:8px auto;
	width:100%;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-flex-direction: row;
	flex-direction: row;
	justify-content:center;
	align-items:center;
}
.body_link_th{
	background-color:#eae5e2;
	padding:10px 20px;
	border-radius:10px;
}
/*--- アクセス ---*/
.body_access{
	margin:8px auto 0px;
	background-color:#f5f4f0;
	padding:4px 0px 16px 0px;
}
/*--- footer ---*/
.foot_flex{
	width:100%;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-flex-direction: row;
	flex-direction: row;
	justify-content:center;
	margin:0 auto;
	padding:32px 0 0 0;
	background:url(../img/bg2.jpg) repeat top left;
}
#foot_f50l{
	flex-basis:340px;
	padding:8px;
	text-align:right;
	color:#f9f6f6;
}
#foot_f50l p{
	text-align:left;
	color:#555555;
}
#foot_f50r{
	flex-basis:auto;
	padding:8px 8px 8px 32px;
	text-align:left;
	color:#f9f6f6;
}

#foot_f50r div{
	font-weight:bolder;
}
/*---　オンライン予約ボタン　---*/
a.btn-online{
	display: inline-block;
	width: 200px;
	text-align: center;
	text-decoration: none;
	letter-spacing:1px;
	outline: none;
	color:#442220;
	background-color: #cfbdbb;
	padding: 6px 0;
	border-radius:10px;
	font-weight: bold;
}
a.btn-online::before,
a.btn-online::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
a.btn-online,
a.btn-online::before,
a.btn-online::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}
a.btn-online:hover {
	 background-color: rgba(142,210,218,1);
}


#time_table th{
	background-color:#3bc2c6;
	color:#FFFFFF;
	padding:5px;
	text-align:center;
	}
#time_table td{
	background-color:#efefef;
	padding:5px;
	text-align:center;
	}


#container2 dl{
	clear:both;
	display:block;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-color: #dddddd;
	margin:0;
	padding:6px 0 7px 0;
	line-height:125%;
	}
#container2 dl:after {/* firefox背景色表示用 */
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}

#container2 dt{
	margin:0;
	padding:0 1em 0 0;
	width:8em;
	float:left;
	text-align:center;
	border-width: 1px;
	border-style: none solid none none;
	border-color: #3bc2c6;
	}
#container2 dd{
	margin:0 0 0 9em;
	padding:0 0 0 1em;
}

#container2 dd table{
}
#container2 dd table th{
	padding:5px;
	text-align:center;
}
#container2 dd table td{
	padding:5px;
	text-align:center;
	line-height:125%;
}


.img-frame{
   position: relative;
   width: 320px;
   height: 220px;
   overflow: hidden;
   margin: 0 auto;
  clip-path: inset(0 round 20px 20px 20px 20px);
}
.img-01, .img-02, .img-03, .img-04, .img-05{
   position: absolute;
   top:0;
   left:0;
   width: 100%;
   height: 100%;
   background-size: cover;
   background-repeat: no-repeat;
}
.img-01{
   background-image: url('../img/img_01.jpg');
   animation: slide-animation-01 40s infinite;
}
.img-02{
   background-image: url('../img/img_02.jpg');
   animation: slide-animation-02 40s infinite;
}
.img-03{
   background-image: url('../img/img_03.jpg');
   animation: slide-animation-03 40s infinite;
}
.img-04{
   background-image: url('../img/img_04.jpg');
   animation: slide-animation-04 40s infinite;
}
.img-05{
   background-image: url('../img/img_05.jpg');
   animation: slide-animation-05 40s infinite;
}
@keyframes slide-animation-01 {
   0% {opacity: 1; transform: scale(1.0);}
  10% {opacity: 1;}
  20% {opacity: 0; transform: scale(1.3);}
  30% {opacity: 0;}
  40% {opacity: 0;}
  50% {opacity: 0;}
  60% {opacity: 0;}
  70% {opacity: 0;}
  80% {opacity: 0;}
  90% {opacity: 0;}
 100% {opacity: 0;}
}
@keyframes slide-animation-02 {
   0% {opacity: 0;}
  10% {opacity: 0; transform: scale(1.2);}
  20% {opacity: 1;}
  30% {opacity: 1;}
  40% {opacity: 0; transform: scale(1.0);}
  50% {opacity: 0;}
  60% {opacity: 0;}
  70% {opacity: 0;}
  80% {opacity: 0;}
  90% {opacity: 0;}
 100% {opacity: 0;}
}
@keyframes slide-animation-03 {
   0% {opacity: 0;}
  10% {opacity: 0;}
  20% {opacity: 0;}
  30% {opacity: 0;}
  40% {opacity: 1;}
  50% {opacity: 1;}
  60% {opacity: 0;}
  70% {opacity: 0;}
  80% {opacity: 0;}
  90% {opacity: 0;}
 100% {opacity: 0;}
}
@keyframes slide-animation-04 {
   0% {opacity: 0;}
  10% {opacity: 0;}
  20% {opacity: 0;}
  30% {opacity: 0;}
  40% {opacity: 0;}
  50% {opacity: 0;}
  60% {opacity: 1;}
  70% {opacity: 1;}
  80% {opacity: 0;}
  90% {opacity: 0;}
 100% {opacity: 0;}
}
@keyframes slide-animation-05 {
   0% {opacity: 0;}
  10% {opacity: 0;}
  20% {opacity: 0;}
  30% {opacity: 0;}
  40% {opacity: 0;}
  50% {opacity: 0;}
  60% {opacity: 0;}
  70% {opacity: 0; transform: scale(1.0);}
  80% {opacity: 1;}
  90% {opacity: 1;}
 100% {opacity: 0; transform: scale(1.1);}
}