.myReservation {
	max-width: 840px;
	margin: 0 auto;
}

.myReservation .lead {
	margin-bottom: 30px;
	text-align: center;
	color: #736357;
}

.myReservation .contact {
	background-color: #fff;
	border-radius: 20px;
	max-width: 740px;
	padding: 20px 50px;
	margin: 0 auto 30px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.myReservation .contact .tel {
	margin-bottom: 5px;
	font-family: "A1明朝", "游明朝体", "Yu Mincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "メイリオ", Meiryo, serif;
	font-size: 26px;
	font-size: 2.6rem;
	color: #534741;
	line-height: 1.5;
	letter-spacing: 0;
}

.myReservation .contact .tel a {
	text-decoration: none;
}

.myReservation .contact .tel .fa {
	margin-right: 5px;
	-webkit-transform: rotate(-95deg);
	-ms-transform: rotate(-95deg);
	transform: rotate(-95deg);
	color: #e8a8b5;
	font-size: 22px;
}

.myReservation .contact .time span + span:before {
	content: "\FF0F";
}

.myReservation .caution {
	max-width: 740px;
	margin: 0 auto;
}

.myReservation .caution li {
	background-image: url(../img/common/icon_flower_color03.png);
	background-position: left 0.2em;
	background-size: 21px auto;
	background-repeat: no-repeat;
	padding: 0 0 0 30px;
	color: #736357;
}

.myReservation .caution li:not(:last-child) {
	margin-bottom: 10px;
}

.myBlock {
	background-color: #fff;
	border-radius: 10px;
	border: solid 1px #489aca;
	margin: 0 0 70px;
}

.myBlock_color02 {
	border-color: #469c77;
}

.myBlock .header {
	background-color: #e9f4fa;
	border-radius: 10px 10px 0 0;
	padding: 20px;
	position: relative;
}

.myBlock .header.myBlock_color03 {
	background-color: #efe8d3;
}

.myBlock .header:before,
.myBlock .header:after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	width: 112px;
	height: 55px;
}

.myBlock .header:before {
	background-image: url(../img/common/deco05_01.png);
	left: 28px;
}

.myBlock .header:after {
	background-image: url(../img/common/deco05_01.png);
	right: 28px;
}

.myBlock .header .title {
	font-weight: bold;
	text-align: center;
	font-size: 23px;
	font-size: 2.3rem;
	color: #736357;
}

.myBlock .header .title .sub {
	font-weight: normal;
	font-size: 16px;
	font-size: 1.6rem;
}

.myBlock_color02 .header {
	background-color: #e9f6ed;
}

.myBlock .body {
	padding: 36px;
}

.myBlock table {
	table-layout: fixed;
}

.myBlock table th,
.myBlock table td {
	padding: 26px;
}

.myBlock table th {
	width: 24%;
	border-right: dotted 1px #808080;
}

.myBlock table th .title {
	color: #489aca;
	font-size: 20px;
	font-size: 2rem;
}

.myBlock table td p + ul {
	margin-top: 20px;
}

.myBlock table tr:not(:last-child) th,
.myBlock table tr:not(:last-child) td {
	border-bottom: dotted 1px #808080;
}

.myBlock .list {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.myBlock .list li {
	width: 24%;
	position: relative;
	padding-left: 20px;
	margin-bottom: 20px;
	font-size: 20px;
	font-size: 2rem;
}

.myBlock .list li:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	height: 0;
	width: 0px;
	margin: auto;
	border: 8px solid transparent;
	border-left: 10px solid #469c77;
}

.myGallery {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	max-width: 980px;
	margin: 0 auto;
}

.myGallery li {
	width: 31.8%;
	margin-top: 30px;
}

.myGallery li:nth-child(1),
.myGallery li:nth-child(2),
.myGallery li:nth-child(3) {
	margin-top: 0;
}

@media only screen and (max-width: 600px) {

.myReservation .contact {
	border-radius: 10px;
	padding: 15px;
	display: block;
	text-align: center;
}

.myReservation .contact .tel {
	font-size: 22px;
	font-size: 2.2rem;
}

.myReservation .contact .time span {
	display: block;
}

.myReservation .contact .time span + span:before {
	display: none;
}

.myReservation .caution li {
	background-size: 18px auto;
	padding-left: 24px;
}

.myBlock {
	border-radius: 5px;
	margin-bottom: 40px;
}

.myBlock .header {
	padding: 15px 10px;
	border-radius: 5px 5px 0 0;
}

.myBlock .header:before,
.myBlock .header:after {
	display: none;
}

.myBlock .header .title {
	font-size: 18px;
	font-size: 1.8rem;
}

.myBlock .header .title .sub {
	display: block;
	font-size: 12px;
	font-size: 1.2rem;
}

.myBlock .body {
	padding: 15px;
}

.myBlock table th,
.myBlock table td {
	padding: 10px;
}

.myBlock table th {
	width: 33%;
}

.myBlock table th .title {
	font-size: 14px;
	font-size: 1.4rem;
}

.myBlock .list li {
	width: 48%;
	padding-left: 15px;
	font-size: 13px;
	font-size: 1.3rem;
}

.myBlock .list li:before {
	border-width: 5px;
	border-left-width: 6px;
}

.myGallery li {
	width: 48%;
	margin-top: 15px;
}

.myGallery li:nth-child(3) {
	margin-top: 15px;
}

}

.tel .fa-mobile,
.tel .fa-mobile-phone{
  transform: rotate(0deg) !important;
  display: inline-block !important;
}


/* 箇条書き（caution）の上に区切り線 */
.myReservation .contact .caution{
  margin-top: 14px;       /* 上の余白 */
  padding-top: 14px;      /* 線とリストの間 */
  border-top: 1px solid #ccc;
}

/* WEB予約（PCは横並びで右にボタン） */
.myReservation .contact-web .tel{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  flex-wrap: nowrap;         /* PCでは折り返さない */
}

.myReservation .contact-web .reserveLabel{
  margin-left: 8px;
  font-weight: 700;
  white-space: nowrap;
}

/* ボタンは右側に固定 */
.myReservation .contact-web .tel a.modBtn01{
  margin-left: auto;
  white-space: nowrap;
}

/* スマホは縦並び */
@media (max-width: 768px){
  .myReservation .contact-web .tel{
    display: block;
  }
  .myReservation .contact-web .tel a.modBtn01{
    display: block;
    width: 100%;
    text-align: center;
    margin-top: 10px;
  }
}

/* PC：WEB予約 と ボタンの間隔を調整 */
@media (min-width: 769px){
  .contact-web .reserveRow{
    gap: 32px;                 /* 全体の間隔を広げる */
  }

  /* ボタンを右端に寄せたい場合（おすすめ） */
  .contact-web .reserveRow a.modBtn01{
    margin-left: auto;
  }

  /* 左側（WEB予約）とボタンの距離をもう少しだけ増やすなら */
  .contact-web .reserveLeft{
    margin-right: 12px;
  }
}

/* WEB予約：PCは横並びで間隔を調整 */
.contact-web .reserveRow{
  display: flex;
  align-items: center;
  justify-content: space-between; /* 左と右を離す */
  gap: 24px;
}

.contact-web .reserveLeft{
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

/* スマホは縦並び */
@media (max-width: 768px){
  .contact-web .reserveRow{
    display: block;
  }
  .contact-web a.modBtn01{
    display: block;
    width: 100%;
    text-align: center;
    margin-top: 10px;
  }
}

/* WEB予約：左（WEB予約）- 中（注記）- 右（ボタン） */
.contact-web .reserveRow{
  display: flex;
  align-items: center;
  gap: 24px;
}

.contact-web .reserveLeft{
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
}

/* 真ん中の注記：間に“挟まる” */
.contact-web .reserveNote{
  flex: 1;              /* ここがミソ：間を埋める */
  text-align: center;
  white-space: nowrap;
  font-size: 14px;
  opacity: 0.9;
}

/* ボタン：右に寄せて固定 */
.contact-web .reserveRow a.modBtn01{
  white-space: nowrap;
}

/* スマホ：縦並び（注記は必要なら表示/非表示を選べる） */
@media (max-width: 768px){
  .contact-web .reserveRow{
    display: block;
  }

  .contact-web .reserveRow a.modBtn01{
    display: block;
    width: 100%;
    text-align: center;
    margin-top: 10px;
  }
}

/* ① WEB予約 の文字をもう少し小さく */
.contact-web .reserveLabel{
  font-size: 20px;   /* 例：小さめに。18〜22pxで微調整OK */
}

/* ② 注意事項（caution）を左寄せにする */
.myReservation .caution{
  text-align: left;
}

/* contactカードがスマホ用で text-align:center になっているので、そこも打ち消す */
.myReservation .contact .caution{
  text-align: left;
}

/* 来院時の案内ブロック */
.myReservation .arrivalGuide{
  max-width: 740px;
  margin: 0 auto 18px;
  padding-top: 14px;
  border-top: 1px solid #ccc; /* 既存の区切り線と統一 */
  text-align: left;           /* 左寄せ */
}

.myReservation .arrivalTitle{
  margin: 0 0 10px 0;
  font-weight: 700;
  color: #534741;
}

.myReservation .arrivalList{
  margin: 0;
  padding: 0;
  list-style: none;
}

.myReservation .arrivalList li{
  color: #736357;
  line-height: 1.8;
}

.myReservation .arrivalList li + li{
  margin-top: 8px;
}

.myReservation .arrivalDot{
  display: inline-block;
  margin-right: 6px;
  color: #736357;
}

/* 「ご来院されたら」：周りとフォントを揃える */
.myReservation .arrivalTitle{
  text-align: center;
  font-family: "A1明朝", "游明朝体", "Yu Mincho", "ヒラギノ明朝 Pro W3",
               "Hiragino Mincho Pro", "メイリオ", Meiryo, serif;
  font-weight: normal;   /* 太字が不要ならnormal */
  font-size: 20px;       /* お好みで18〜22px */
  color: #534741;
  letter-spacing: 0;
}

/* 来院案内：中身は左寄せ、タイトルは中央（すでに設定済みならOK） */
.myReservation .arrivalGuide{
  max-width: 740px;
  margin: 0 auto 18px;
  padding-top: 14px;
  border-top: 1px solid #ccc;
}

.myReservation .arrivalList{
  text-align: left;
}

/* ラベル（託児のある/なし）を強調 */
.myReservation .arrivalTag{
  display: inline-block;
  margin-right: 10px;
  font-weight: 700;
  color: #534741;
  white-space: nowrap;
}

/* 本文は折り返しやすく */
.myReservation .arrivalText{
  display: inline;
}

/* dotList：花→中点に置換（改行しても文頭がズレない） */
.myReservation ul.caution.dotList li{
  background-image: none;     /* 花を消す */
  padding-left: 30px;         /* 元のインデントは維持（重要） */
  position: relative;         /* ::beforeの基準 */
}

/* 花の位置に中点を“配置”する */
.myReservation ul.caution.dotList li::before{
  content: "・";
  position: absolute;
  left: 0;                    /* 花の開始位置相当 */
  top: 0.15em;                /* 位置微調整（必要なら 0.1〜0.3em） */
  color: #736357;
  font-size: 20px;            /* 中点を見やすく（好みで調整） */
  line-height: 1;
}



/*# sourceMappingURL=maps/refre.css.map */
