*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box
}

:where([hidden]:not([hidden='until-found'])) {
  display: none !important
}
/*

:where(html) {
  -webkit-text-size-adjust: none;
  color-scheme: dark light;
  tab-size: 2;
  scrollbar-gutter: stable
}
*/
:where(html:has(dialog:modal[open])) {
  overflow: clip
}
@media (prefers-reduced-motion:no-preference) {
  :where(html: focus-within) {
    scroll-behavior: smooth
  }
}

:where(body) {
  line-height: 1.5;
  font-family: system-ui, sans-serif;
  -webkit-font-smoothing: antialiased
}
:where(button) {
  all: unset
}
:where(input, button, textarea, select) {
  font: inherit;
  color: inherit
}
:where(textarea) {
  resize: vertical;
  resize: block
}
:where(button, label, select, summary, [role='button'], [role='option']) {
  cursor: pointer
}
:where(:disabled) {
  cursor: not-allowed
}
:where(label:has(>input:disabled), label:has(+input:disabled)) {
  cursor: not-allowed
}
:where(a) {
  color: inherit;
  text-underline-offset: .2ex
}
:where(ul, ol) {
  list-style: none
}
:where(img, svg, video, canvas, audio, iframe, embed, object) {
  display: block
}
:where(img, picture, svg, video) {
  max-inline-size: 100%;
  block-size: auto
}
:where(p, h1, h2, h3, h4, h5, h6) {
  overflow-wrap: break-word
}
:where(h1, h2, h3) {
  line-height: calc(1em + 0.5rem);
}
:where(hr) {
  border: none;
  border-block-start: 1px solid;
  color: inherit;
  block-size: 0;
  overflow: visible
}
:where(dialog) {
  border: none;
  background: none;
  inset: unset;
  max-width: unset;
  max-height: unset
}
:where(dialog:not([open])) {
  display: none !important
}
:where(:focus-visible) {
  outline: 3px solid CanvasText;
  box-shadow: 0 0 0 5px Canvas;
  outline-offset: 1px
}
:where(:focus-visible, :target) {
  scroll-margin-block: 8vh
}
:where(.visually-hidden:not(:focus-within, :active)) {
  clip-path: inset(50%) !important;
  height: 1px !important;
  width: 1px !important;
  overflow: hidden !important;
  position: absolute !important;
  white-space: nowrap !important;
  border: 0 !important
}


html {
  font-size: 62.5%;
}
body {
  font-family: "M PLUS Rounded 1c", serif;
  font-weight: 400;
  font-style: normal;
  color: #333333;
}
.text {
  transform: rotate(0.05deg);
}
.t-right {
  text-align: right;
}
.t-left {
  text-align: left;
}
.t-center {
  text-align: center;
}
.red {
  color: #D62246;
  font-weight: 800;
}
.blue {
  color: #456990;
  font-weight: 800;
}
p {
  line-height: 1.8;
}

/*--- 上 ----------*/

.mgT0  { margin-top:  0px !important; }
.mgT5  { margin-top:  5px !important; }
.mgT10 { margin-top: 10px !important; }
.mgT15 { margin-top: 15px !important; }
.mgT20 { margin-top: 20px !important; }
.mgT25 { margin-top: 25px !important; }
.mgT30 { margin-top: 30px !important; }
.mgT40 { margin-top: 40px !important; }
.mgT50 { margin-top: 50px !important; }
.pdT0  { padding-top: 0px !important; }
.pdT5  { padding-top: 5px !important; }
.pdT10 { padding-top:10px !important; }
.pdT15 { padding-top:15px !important; }
.pdT20 { padding-top:20px !important; }
.pdT25 { padding-top:25px !important; }
.pdT30 { padding-top:30px !important; }
.pdT40 { padding-top:40px !important; }
.pdT50 { padding-top:50px !important; }


/*--- 右 ----------*/

.mgR0  { margin-right:  0px !important; }
.mgR10 { margin-right: 10px !important; }
.mgR15 { margin-right: 15px !important; }
.mgR20 { margin-right: 20px !important; }
.mgR25 { margin-right: 25px !important; }
.mgR30 { margin-right: 30px !important; }
.mgR40 { margin-right: 40px !important; }
.mgR50 { margin-right: 50px !important; }
.pdR5  { padding-right: 5px !important; }
.pdR10 { padding-right:10px !important; }
.pdR15 { padding-right:15px !important; }
.pdR20 { padding-right:20px !important; }
.pdR25 { padding-right:25px !important; }
.pdR30 { padding-right:30px !important; }
.pdR40 { padding-right:40px !important; }
.pdR50 { padding-right:50px !important; }


/*--- 左 ----------*/

.mgL0  { margin-left:  0px !important; }
.mgL10 { margin-left: 10px !important; }
.mgL15 { margin-left: 15px !important; }
.mgL20 { margin-left: 20px !important; }
.mgL25 { margin-left: 25px !important; }
.mgL30 { margin-left: 30px !important; }
.mgL40 { margin-left: 40px !important; }
.mgL50 { margin-left: 50px !important; }
.pdL5  { padding-left: 5px !important; }
.pdL10 { padding-left:10px !important; }
.pdL15 { padding-left:15px !important; }
.pdL20 { padding-left:20px !important; }
.pdL25 { padding-left:25px !important; }
.pdL30 { padding-left:30px !important; }
.pdL40 { padding-left:40px !important; }
.pdL50 { padding-left:50px !important; }


/*--- 下 ----------*/

.mgB0  { margin-bottom:  0px !important; }
.mgB5  { margin-bottom:  5px !important; }
.mgB10 { margin-bottom: 10px !important; }
.mgB15 { margin-bottom: 15px !important; }
.mgB20 { margin-bottom: 20px !important; }
.mgB25 { margin-bottom: 25px !important; }
.mgB30 { margin-bottom: 30px !important; }
.mgB40 { margin-bottom: 40px !important; }
.mgB50 { margin-bottom: 50px !important; }
.mgB60 { margin-bottom: 60px !important; }
.mgB70 { margin-bottom: 70px !important; }
.mgB80 { margin-bottom: 80px !important; }
.pdB5  { padding-bottom: 5px !important; }
.pdB10 { padding-bottom:10px !important; }
.pdB15 { padding-bottom:15px !important; }
.pdB20 { padding-bottom:20px !important; }
.pdB25 { padding-bottom:25px !important; }
.pdB30 { padding-bottom:30px !important; }
.pdB40 { padding-bottom:40px !important; }
.pdB50 { padding-bottom:50px !important; }

.IMG_kadomaru{
border-radius:10px;;
}

.background {
  background-image: url("../images/back.webp");
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
  text-align: center;
  overflow: hidden;
  position: relative;
}
.contents {
  margin: 0 auto 50px;
  width: 375px;
  max-width: 375px;
  text-align: center;
}
.contents img {
  width: 100%;
  max-width: 375px;
}
@media screen and (max-width: 519px) {
.contents {
  margin: 0 auto 50px;
  width: 100%;
  max-width: 100%;
  text-align: center;
}
.contents img {
  width: 100%;
  max-width: 100%;
}
}



.mgB00 {
  margin-bottom: 0 !important;
}
.pdB00 {
  padding-bottom: 0 !important;
}
.Left {
  position: fixed;
  top: 18%;
  right: calc(70%);
  max-width: 380px;
}
.right {
  position: fixed;
  top: 18%;
  left: calc(70%);
  max-width: 380px;
}
@media screen and (max-width: 1366px) {
  .Left {
    display: none;
  }
  .right {
    display: none;
  }
}
.Left p.tel {
  font-size: 3.2rem;
  font-weight: 800;
  color: #8190B5;
  margin-top: 30px;
}
.Left p.tel a {
  text-decoration: none;
}
.Left p.tel i {
  margin-right: 10px;
}
dl.ClinicInfo {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  max-width: 373px;
  margin: 40px auto 0;
  border: none;
}
dl.ClinicInfo dt {
  width: 30%;
  padding: 5px;
  margin-bottom: 10px;
  background-color: #8190B5;
  border-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.4rem;
  color: #FFF;
  transform: rotate(0.05deg);
}
dl.ClinicInfo dd {
  width: 70%;
  padding: 5px;
  margin-bottom: 10px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: 1.4rem;
  transform: rotate(0.05deg);
}
.SNS {
  display: flex;
  justify-content: space-between;
  font-size: 4.0rem;
  width: 100%;
  max-width: 180px;
  margin: 30px auto;
  color: #8190B5;
}
.SNS.three {
  max-width: 150px;
  padding-top: 30px;
  padding-bottom: 30px;
}
/*========= ナビゲーションのためのCSS ===============*/
/*アクティブになったエリア*/
#g-nav.panelactive {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 99;
  top: 0;
  width: 100%;
  height: 100vh;
}
/*丸の拡大*/
.circle-bg {
  position: fixed;
  z-index: 3;
  /*丸の形*/
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: #E9EBF4;
  /*丸のスタート位置と形状*/
  transform: scale(0); /*scaleをはじめは0に*/
  right: -50px;
  top: -50px;
  transition: all .6s; /*0.6秒かけてアニメーション*/
}
.circle-bg.circleactive {
  transform: scale(50); /*クラスが付与されたらscaleを拡大*/
}
/*ナビゲーションの縦スクロール*/
#g-nav-list {
  display: none; /*はじめは表示なし*/
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
#g-nav.panelactive #g-nav-list {
  display: block; /*クラスが付与されたら出現*/
}
/*ナビゲーション*/
#g-nav ul.navi {
}
/*背景が出現後にナビゲーションを表示*/
#g-nav.panelactive ul.navi {
display: block;
    margin: 50px auto 20px;
    width: 350px;
}
/* 背景が出現後にナビゲーション li を表示※レイアウトによって調整してください。不必要なら削除*/
#g-nav.panelactive ul.navi li {
  animation-name: gnaviAnime;
  animation-duration: 1s;
  animation-delay: .2s; /*0.2 秒遅らせて出現*/
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes gnaviAnime {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*リストのレイアウト設定*/
#g-nav ul.navi li {
  text-align: center;
  list-style: none;
}
#g-nav ul.navi li a {
  color: #333;
  text-decoration: none;
  padding: 10px;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 1.8rem;
  text-align: left;
  border-radius: 5px;
  background-image: url(../images/listpoint01.webp);
  background-repeat: no-repeat;
  background-position: 0px 18px;
  width: 100%;
  max-width: 350px;
  transform: rotate(0.05deg);
  padding: 15px 15px 15px 30px;
  text-decoration: none;
  margin-bottom: 10px;
  border-bottom: #BDC4D9 dashed 2px;
}
#g-nav ul.navi li.Button a {
  color: #333;
  text-decoration: none;
  padding: 10px;
  display: flex;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 1.8rem;
  text-align: left;
  border-radius: 5px;
  background-image: none;
  background-repeat: no-repeat;
  background-position: 0px 18px;
  width: 100%;
  max-width: 380px;
  transform: rotate(0.05deg);
  padding: 15px 15px 15px 30px;
  text-decoration: none;
  margin-bottom: 20px;
  border-bottom: none;
}

#g-nav p.text{
font-size: 1.4rem;
}
#g-nav dl.ClinicInfo {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  max-width: 373px;
  margin: 20px auto 0;
  border: none;
}
#g-nav dl.ClinicInfo dt {
  width: 30%;
  padding: 5px;
  margin-bottom: 10px;
  background-color: #8190B5;
  border-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.4rem;
  color: #FFF;
  transform: rotate(0.05deg);
}
#g-nav dl.ClinicInfo dd {
  width: 70%;
  padding: 5px;
  margin-bottom: 10px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: 1.4rem;
  transform: rotate(0.05deg);
}
#g-nav .SNS {
  display: flex;
  justify-content: space-between;
  font-size: 4.0rem;
  width: 100%;
  max-width: 180px;
  margin: 10px auto;
  color: #BFC6DA;
}
#g-nav .SNS.three {
  max-width: 160px;
  padding-top: 10px;
  padding-bottom: 10px;
}
#g-nav p.tel{
    font-size: 3.2rem;
    font-weight: 800;
    color: #8190B5;
    margin-top: 30px;
}
/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9; /*ボタンを最前面に*/
  cursor: pointer;
  width: 50px;
  height: 50px;
  margin-top: 4px;
}
/*×に変化*/
.openbtn span {
  display: inline-block;
  transition: all .4s;
  position: absolute;
  /*z-index: 9;*/
  left: 14px;
  height: 3px;
  border-radius: 2px;
  background-color: #BDC4D9;
  width: 45%;
}
.openbtn span:nth-of-type(1) {
  top: 15px;
}
.openbtn span:nth-of-type(2) {
  top: 23px;
}
.openbtn span:nth-of-type(3) {
  top: 31px;
}
.openbtn.active span:nth-of-type(1) {
  top: 18px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 30%;
}
.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}
.openbtn.active span:nth-of-type(3) {
  top: 30px;
  left: 18px;
  transform: translateY(-6px) rotate(45deg);
  width: 30%;
}
.HeaderBox {
  width: 100%;
  max-width: 375px;
  margin: 0 auto;
  background: #FFF;
  text-align: left;
  position: fixed;
  z-index: 9999;
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  height: 60px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.17);
}
@media screen and (max-width: 519px) {
.HeaderBox {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  background: #FFF;
  text-align: left;
  position: fixed;
  z-index: 9999;
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  height: 60px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.17);
}
}


.HeaderBox.HeaderBoxbg {
  background: none;
  box-shadow: none;
}
.HeaderBox.HeaderBoxbg .Logo {
  display: none;
}
.Logo {
  width: 100%;
  padding-left: 10px;
  padding-top: 7px
}
.Logo img {
  max-width: 137px;
}
/*==================================================
スライダーのためのcss
===================================*/
.slider {
  padding: 50px 20px;
  position: relative;
  z-index: 1;
  /*↑z-indexの値をh1のz-indexの値よりも小さくして背景に回す*/
  /*height: 100vh;*/ /*スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/
  background-image: url("../images/slide01bg.webp");
  clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%);
}
.slider-item {
  width: 100%; /*各スライダー全体の横幅を画面の高さいっぱい（100%）にする*/
  height: 200px; /*各スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/
  background-repeat: no-repeat; /*背景画像をリピートしない*/
  background-position: center; /*背景画像の位置を中央に*/
  background-size: cover; /*背景画像が.slider-item全体を覆い表示*/
}
/*矢印の設定*/
/*戻る、次へ矢印の位置*/
.slick-prev, .slick-next {
  position: absolute; /*絶対配置にする*/
  z-index: 1;
  top: 37%;
  cursor: pointer; /*マウスカーソルを指マークに*/
  outline: none; /*クリックをしたら出てくる枠線を消す*/
  border-top: 2px solid #FFF; /*矢印の色*/
  border-right: 2px solid #FFF; /*矢印の色*/
  height: 12px;
  width: 12px;
}
.slick-prev { /*戻る矢印の位置と形状*/
  left: 2.5%;
  transform: rotate(-135deg);
}
.slick-next { /*次へ矢印の位置と形状*/
  right: 2.5%;
  transform: rotate(45deg);
}
/*ドットナビゲーションの設定*/
.slick-dots {
  position: relative;
  z-index: 1;
  text-align: center;
  margin: 40px 0 0 0;
}
.slick-dots li {
  display: inline-block;
  margin: 0 5px;
}
.slick-dots button {
  color: transparent;
  outline: none;
  width: 8px!important; /*ドットボタンのサイズ*/
  height: 8px!important; /*ドットボタンのサイズ*/
  display: block;
  border-radius: 50%;
  background: #FFF; /*ドットボタンの色*/
}
.slick-dots .slick-active button {
  background: #33658A; /*ドットボタンの現在地表示の色*/
}
/*==================================================
スライダー02のためのcss
===================================*/
.instagramBox {
  border-radius: 5px;
  background: url("../images/instagram_bg.webp") no-repeat top;
  background-size: auto;
  padding: 50px 0;
}
.instagramBox h2 {
  border-radius: 5px;
  background: url("../images/instagram_hl.webp") no-repeat top center;
  background-size: 40px;
  padding: 50px 0;
  font-size: 2.1rem;
  line-height: 1.524;
  color: #333;
  font-weight: 100;
}
.slider02 img {
  width: 100%; /*スライダー内の画像を横幅100%に*/
  height: auto;
}
/*slickのJSで書かれるタグ内、スライド左右の余白調整*/
.slider02 .slick-slide {
  margin: 0 10px; /*スライド左右の余白調整*/
}
/*==================================================
パーツ
===================================*/
.WhiteBox {
  border-radius: 5px;
  background-color: #FFF;
  padding: 20px;
  text-align: left;
  font-size: 1.4rem;
}
.WhiteBoxPLR0 {
  border-radius: 5px;
  background-color: #FFF;
  padding: 20px 0;
  text-align: left;
  font-size: 1.4rem;
}
.WhiteBoxPLRB0mgB0 {
  border-radius: 5px;
  background-color: #FFF;
  padding: 20px 0 0;
  margin-bottom: 0;
  text-align: left;
  font-size: 1.4rem;
}
.GrayBox {
  border-radius: 5px;
  background-color: #FCFCFD;
  padding: 30px 20px;
  text-align: left;
  font-size: 1.4rem;
}
.BlueBox {
  border-radius: 5px;
  background-color: #edeff7;
  padding: 10px 20px;
  text-align: left;
  font-size: 1.4rem;
  margin-top: 50px;
}

.BlueBox02 {
  border-radius: 5px;
  background-color: #fff;
  border: 2px solid #edeff7;
  padding: 10px 20px;
  text-align: left;
  font-size: 1.4rem;
  margin-top: 50px;
}

.BlueBoxpd10 {
  border-radius: 5px;
  background-color: #edeff7;
  padding: 10px 10px;
  text-align: left;
  font-size: 1.4rem;
  margin-top: 50px;
}

.Whiteborder{
border: 1px solid #FFF;
border-radius: 5px;
padding: 20px;
}

.WhiteBoxR20 {
  border-radius: 20px;
  background-color: #FFF;
  padding:30px 20px 20px;
  text-align: left;
  font-size: 1.4rem;
  margin-bottom: 50px;
}

.addBG {
  background: url("../images/contents_bg01.webp") no-repeat top left;
  background-size: 375px;
  background-color: #FFF;
}
.addBG02 {
  background: url("../images/contents_bg04.webp") no-repeat top left;
  background-size: 375px;
  background-color: #FFF;
}
@media screen and (max-width: 519px) {
.addBG02 {
  background-size: 100%;
}
}


ul.point01 {
  list-style: none;
}
ul.point01 li {
  background: url("../images/listpoint01.webp") no-repeat 0 0;
  background-size: auto 20px;
  padding-left: 30px;
}
.more {
  color: #456990;
  font-weight: 800;
  padding-right: 30px;
  background: url("../images/listpoint01.webp") no-repeat right 0;
  background-size: auto 20px;
}
.Left h2 {
  width: 100%;
  max-width: 320px;
  margin: 0 auto;
  text-align: center;
}
.artmake_logo {
  margin: 20px auto 0;
  max-width: 208px;
}
.Left p {
  font-size: 1.4rem;
}
.right .RightMenu {
  display: flex;
  flex-wrap: wrap;
  font-size: 1.6rem;
}
.right .RightMenu li {
  display: flex;
  width: 100%;
  text-align: left;
  margin-bottom: 20px;
}
.right .RightMenu li a {
  border-radius: 5px;
  background-color: #FFF;
  background-image: url("../images/listpoint01.webp");
  background-repeat: no-repeat;
  background-position: 15px 17px;
  width: 100%;
  max-width: 380px;
  transform: rotate(0.05deg);
  padding: 15px 15px 15px 46px;
  text-decoration: none;
  box-shadow: 0 0 8px rgba(69, 105, 144, 0.3);
}
.right .RightMenu li a:hover {
  background-color: #EDEFF7;
}
.Button, button {
  margin: 0 auto;
  width: 330px;
  display: block;
}
.Button a, button.formaction {
  background: #FFE66D;
  background-size: auto 20px;
  border-radius: 5px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 30px auto 50px;
  max-width: 280px;
  padding: 10px 25px;
  color: #333;
  transition: 0.3s ease-in-out;
  font-weight: 800;
  border-bottom: 2px solid #cccccc;
  font-size: 1.6rem;
  text-decoration: none;
}
.Button a:hover, button.formaction:hover {
  background: #8190B5;
  color: #FFF;
}
.Button a span, button.formaction span {
  background: url("../images/listpoint02.webp") no-repeat;
  background-size: 20px;
  display: block;
  width: 20px;
  height: 20px;
  margin-left: 10px;
}

.Button02 {
  margin: 0 auto;
  width: 330px;
  display: block;
}
.Button02 a {
  background: #FFF;
  background-size: auto 20px;
  border-radius: 5px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 30px auto 50px;
  max-width: 280px;
  padding: 10px 25px;
  color: #333;
  transition: 0.3s ease-in-out;
  font-weight: 800;
  border-bottom: 2px solid #cccccc;
  font-size: 1.6rem;
  text-decoration: none;
}
.Button02 a:hover {
  background: #8190B5;
  color: #FFF;
}
.Button02 a span {
  background: url("../images/listpoint02.webp") no-repeat;
  background-size: 20px;
  display: block;
  width: 20px;
  height: 20px;
  margin-left: 10px;
}

.Button03 {
  margin: 0 auto;
  display: block;
}
.Button03 a {
  background: #FFF;
  background-size: auto 20px;
  border-radius: 5px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 30px auto 15px;
  max-width: 280px;
  padding: 10px 25px;
  color: #333;
  transition: 0.3s ease-in-out;
  font-weight: 800;
  border-bottom: 2px solid #cccccc;
  font-size: 1.6rem;
  text-decoration: none;
}
.Button03 a:hover {
  background: #8190B5;
  color: #FFF;
}
.Button03 a span {
  background: url("../images/listpoint02.webp") no-repeat;
  background-size: 20px;
  display: block;
  width: 20px;
  height: 20px;
  margin-left: 10px;
}



.qa {
  font-size: 1.4rem;
  text-align: left;
  box-shadow: 0 0 8px rgba(69, 105, 144, 0.3);
  margin-bottom: 20px;
  border-radius: 5px;
  background-color: #FFF;
}
.qa .q {
  padding: 15px 40px 15px 15px;
  position: relative;
  cursor: pointer;
  border-radius: 5px;
}
.qa .q:before {
  position: absolute;
  content: "";
  display: block;
  width: 10px;
  height: 2px;
  background-color: #BFC6DA;
  right: 15px;
  top: 50%;
  transform: translate(0, -50%);
}
.qa .q:after {
  position: absolute;
  content: "";
  display: block;
  width: 10px;
  height: 2px;
  background-color: #BFC6DA;
  right: 15px;
  top: 50%;
  transform: translate(0, -50%) rotate(90deg);
}
.qa .q.active:after {
  display: none;
}
.qa .q h3 {
  font-size: 1.4rem;
  text-wrap: none;
  color: #456990;
  text-indent: -1.0em;
  padding-left: 1.0em;
  transform: rotate(0.05deg);
}
.qa .q h3:before {
  content: "Q. ";
  color: #D62246;
  transform: rotate(0.05deg);
}
.qa .a {
  background-color: #EDEFF7;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  display: none;
  padding: 15px;
}
.qa .a p {
  font-size: 1.4rem;
  text-wrap: none;
  color: #456990;
  text-indent: -1.0em;
  padding-left: 1.0em;
  transform: rotate(0.05deg);
}
.qa .a p:before {
  content: "A. ";
  color: #33658A;
  font-weight: 800;
  transform: rotate(0.05deg);
}
.HL01 {
  font-size: 21px;
  font-size: 2.1rem;
  position: relative;
  padding: 1.5rem;
  text-align: center;
  margin-bottom: 30px;
  font-weight: 400;
  line-height: 2.1;
  transform: rotate(0.05deg);
  text-shadow: -1px -1px 2px #FFF, -1px 0px 2px #FFF, -1px 1px 2px #FFF, 0px -1px 2px #FFF, 0px 1px 2px #FFF, 1px -1px 2px #FFF, 1px 0px 2px #FFF, 1px 1px 2px #FFF;
  font-weight: 400;
}
.HL01 span {
  font-size: 12px;
  font-size: 1.2rem;
  display: block;
  color: #BFC6DA;
  transform: rotate(0.05deg);
  margin-top: 10px;
}
.HL01:before {
  position: absolute;
  bottom: 5px;
  left: calc(50% - 40px);
  width: 80px;
  height: 1px;
  content: '';
  border-radius: 3px;
  background: #BFC6DA;
}
.flow_design {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 20px;
}
.flow {
  padding-left: 0;
  width:100%;
}
.flow > li {
  list-style-type: none;
  position: relative;
  padding-left: 30px;
}
.flow > li:not(:last-child) {
  padding-bottom: 10px;
}
.flow > li .icon {
  width: 1.5em;
  height: 1.5em;
  line-height: 1em;
  text-align: center;
  border-radius: 100vh;
  display: inline-block;
  background: #BFC6DA;
  color: #fff;
  position: absolute;
  left: 0;
}
.flow > li:not(:last-child)::before {
  content: '';
  background: #BFC6DA;
  width: 2px;
  height: 100%;
  position: absolute;
  top: calc(50% - 0px);
  left: 8px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}
.flow > li dl dt {
  font-size: 0.875em;
  font-weight: 600;
  color: #33658A;
}
.flow > li dl dd {
  margin-left: 0;
  margin-top: 10px;
}
.FlowWrap {
  display: flex;
  justify-content: space-around;
  margin-bottom: 10px
}
.FlowIMG {
  margin-right: 20px;
  flex-basis: 70px;
}
.FlowText {
  width: calc(100% - 90px)
}
.FlowText h3 {
  color: #456990;
  font-size: 1.4rem;
  margin-bottom: 10px;
  transform: rotate(0.05deg);
}
.FlowText p {
  font-size: 1.2rem;
  transform: rotate(0.05deg);
}
iframe.map {
  margin-bottom: 20px;
}
dl.ClinicInfoAcess {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  max-width: 373px;
  margin: 20px auto 0;
  border: none;
}
dl.ClinicInfoAcess dt {
  width: 30%;
  padding: 5px;
  margin-bottom: 10px;
  background-color: #BFC6DA;
  border-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.4rem;
  color: #FFF;
  transform: rotate(0.05deg);
}
dl.ClinicInfoAcess dd {
  width: 70%;
  padding: 5px;
  margin-bottom: 10px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: 1.4rem;
  transform: rotate(0.05deg);
}
.hl02 {
  background-color: #33658A;
  color: #FFF;
  font-size: 1.2rem !important;
  padding: 0.5em 1.0em;
  border-radius: 5px;
}
.IMG {
  margin-bottom: 40px;
}
.IMG img{
width: 100%;
}

.IMGmgB30 {
  margin-bottom: 30px;
}
.IMGmgB30wauto img {
width: auto;
margin: 0 auto 30px;
}

.WrapPLR20 {
  padding: 0 20px;
}
.Timetabele {
  width: 100%;
  padding: 0;
  border-collapse: collapse;
  margin-bottom: 20px;
}
.Timetabele td {
  color: #456990;
  padding: 1.0em 0.5em;
  font-size: 1.4rem;
  transform: rotate(0.05deg);
  border-bottom: 1px solid #BFC6DA;
  color: #BFC6DA;
}
.Timetabele th {
  color: #456990;
  padding: 1.0em 0.5em;
  font-size: 1.4rem;
  transform: rotate(0.05deg);
  border-bottom: 1px solid #BFC6DA;
}
.hl03 {
  margin-top: 20px;
  position: relative;
  padding: 1.2rem;
  text-align: center;
  font-size: 2.1rem;
  font-weight: 200;
  margin-bottom: 30px;
  color: #456990;
}
.hl03:before {
  position: absolute;
  bottom: -10px;
  left: calc(50% - 30px);
  width: 60px;
  height: 4px;
  content: '';
  border-radius: 3px;
  background: #BFC6DA;
}
.TelBox p.tel {
  text-align: center;
  font-size: 3.2rem;
  font-weight: 800;
  color: #33658A;
}
.TelBox p.tel a {
  text-decoration: none;
  text-align: center;
}
.TelBox p.tel i {
  margin-right: 10px;
}
.FooterMenuBox {
  background: #E9ECF2;
  padding: 30px 20px;
}
.CopyRight {
  font-size: 1.0rem;
  text-align: center;
  margin-top: 20px;
}
.FooterMenuBox h3 {
  text-align: center;
  margin: 0 auto 30px;
  padding-bottom: 30px;
  border-bottom: 2px solid #FFF;
}
/*リストのレイアウト設定*/
.FooterMenuBox li {
  text-align: center;
  list-style: none;
}
.FooterMenuBox li a {
  color: #333;
  text-decoration: none;
  padding: 10px;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 1.4rem;
  text-align: left;
  border-radius: 5px;
  background-image: url(../images/listpoint01.webp);
  background-repeat: no-repeat;
  background-position: 0px 15px;
  width: 100%;
  max-width: 380px;
  transform: rotate(0.05deg);
  padding: 15px 15px 15px 30px;
  text-decoration: none;
  margin-bottom: 10px;
}
.FooterMenuBox li.Button a {
  color: #333;
  text-decoration: none;
  padding: 10px;
  display: flex;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 1.8rem;
  text-align: left;
  border-radius: 5px;
  background-image: none;
  background-repeat: no-repeat;
  background-position: 0px 18px;
  width: 100%;
  max-width: 380px;
  transform: rotate(0.05deg);
  padding: 15px 15px 15px 30px;
  text-decoration: none;
  margin-bottom: 20px;
  border-bottom: none;
}
.HospitalBox {
  background: url("../images/contents_bg02.webp") no-repeat;
  background-size: 100%;
  padding: 50px 0px 1px;
  border-radius: 5px;
}
.HospitalBox h2 {
  font-size: 2.1rem;
  line-height: 1.7;
  color: #FFF;
  font-weight: 400;
  margin-bottom: 30px;
}
.HospitalBox p {
  font-size: 1.4rem;
  text-align: left;
  color: #FFF;
}

.AttentionBox {
  background: url("../images/contents_bg03.webp") no-repeat center;
  background-size: 100%;
  padding: 50px 0px 1px;
  border-radius: 5px;
}
.AttentionBox h2 {
  font-size: 2.1rem;
  line-height: 1.7;
  color: #FFF;
  font-weight: 400;
  margin-bottom: 30px;
  border: 1px solid #FFF;
  background: rgba(71,39,7,0.30)
}
.AttentionBox p {
  font-size: 1.4rem;
  text-align: left;
  color: #333;
}


.hl04 {
  font-size: 2.1rem;
  font-weight: 400;
  text-align: center;
  margin: 50px auto 30px;
  color: #33658A;
}
.hl04 span {
  display: block;
  max-width: 210px;
  margin: 0 auto 30px;
  font-size: 1.2rem;
  color: #FFF;
  background-color: #33658A;
  border-radius: 5px;
}
.hl04 span.white {
  display: block;
  max-width: 210px;
  margin: 0 auto 30px;
  font-size: 1.2rem;
  color:#33658A ;
  background-color: #FFF;
  border-radius: 5px;
  border: 1px solid #33658A;
}

.hl05 {
  display: block;
  text-align: center;
  max-width: 210px;
  margin: 0 auto 20px;
  font-size: 1.2rem;
  font-weight: 400;
  color: #FFF;
  background-color: #33658A;
  border-radius: 5px;
  transform: rotate(0.05deg);
  padding: 0.4em;
}
.hl06 {
  position: relative;
  display: inline-block;
  padding: 0 55px;
  text-align: center!important;
}

.hl06:before, .hl06:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 45px;
  height: 2px;
  border-top: solid 1px black;
  border-bottom: solid 1px black;
}

.hl06:before {
  left:0;
}
.hl06:after {
  right: 0;
}

.hl07 {
  padding: 0.5rem 1rem;
  background: #edeff7;
  color: #33658A;
  margin-bottom: 20px;
  border-radius: 5px;
  text-align: center;
}

.ListCheck{
margin-bottom: 0px;
padding-bottom: 10px;
margin-top: 50px;
}

.ListCheck li{
margin-bottom: 15px;
border-bottom: 2px dashed #456990;
padding-bottom: 15px;
padding-left: 15px;
transform: rotate(0.05deg);
position: relative;
}
.fa-ul{
margin-left: 0px!important;
}
.fa-li{
margin-left: 25px!important;
padding-right: 25px!important;
color: #d62246;
}
.fs21Blue{
font-size: 1.8rem;
color: #456990;
}

.ListYellow{
max-width: 210px;
margin: -10px auto 0px;
list-style:disc;
}

ul.ListYellow{
 list-style: none;
 transform: rotate(0.05deg);
}

ul.ListYellow li{
  display: flex; /* 点とリストを横並びに */
  align-items: center; /* 垂直方向に中央揃い */
  margin-bottom: 5px;
}

ul.ListYellow li::before{
 content: "⚫︎"; /* 記号(黒丸)を挿入 */
 color: #ffe66d; /* 好きな色にする */
 font-size: 1.0em; /* 黒丸の大きさに差異があるので調整 */
 margin-right: 1em; /* 余白 */
 transform: rotate(0.05deg);
}

.TwoBlock{
display: flex;
justify-content: space-between;
margin-top: 30px;
}
.TwoBlock li{
max-width: 120px;
}
.Yen{
font-size: 3.2rem;
font-weight: 800;
color: #33658a;
}
.Yen span{
font-size: 1.8rem;
padding-right: 3px;
}
.Yen small{
font-size: 1.0rem;
}

.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
}

.breadcrumb li:not(:last-of-type)::after {
  content: "»";
  margin: 0 .6em; /* 記号の左右の余白 */
  color: #777; /* 記号の色 */
}


.triangle {
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
  border-top: 17px solid #ffffff;
  border-bottom: 0;
  margin: 0 auto;
}


table.fee {
  border-collapse: collapse;
  margin: 0 auto 40px;
  padding: 0;
  width: 100%;
  table: fixed;
}

table.fee tr {
  background-color: #edeff7;
  padding: .35em;
  border-bottom: 2px solid #fff;
}
table.fee th,
table.fee td {
  padding: 1em 10px 1em 1em;
  border-right: 2px solid #fff;
}
table.fee th {
  font-size: .85em;
}
table.fee thead tr{
  background-color: #167F92;
  color:#fff;
}
table.fee tbody th {
    background: #8190B5;
    color: #fff;
}
.txt{
   text-align: left;
   font-size: .85em;
}
.price{
  text-align: right;
  color: #167F92;
  font-weight: bold;
}
.non{
  background:#fff
}

/*========================
　smartphone　bottom menu
　========================*/


.mini-text{font-size:10px;}/*文字大きさ*/
@media(min-width: 768px){
    .bottom-menu{display:none; }
}
ul.bottom-menu {
    position: fixed;
    left:0;
    bottom:0;
    width: 100%;
    height:60px;/*高さ*/
    margin:0;
    padding:0;
    background-color:#edeff7;/*背景色*/
    border-top:2px solid #33658A;/*バーの上の線*/
    z-index:30;}

ul.bottom-menu li {
    float:left;
    width:33.3%;
    background-color:#edeff7;/*背景色*/
    list-style-type:none;
    text-align:center;
    font-size:25px;/*アイコンのサイズ*/}

.bottom-menu li a {
    display: block;
    color:#33658A;/*アイコン＆文字の色*/
    padding-top:10px;
    padding-bottom:5px;
    line-height:10px;
    text-decoration:none;}

.bottom-menu li a:hover {
    color:#a9a9a9;/*マウスオーバー時の色*/}

/* === 展開メニュー === */

ul.menu-second-level {
    visibility: hidden;
    opacity: 0;
    z-index:1;}

ul.menu-second-level li a{
    border-top:1px dashed #a9a9a9;/*展開の枠点線*/
        font-size:15px;/*展開メニューの文字サイズ*/
        line-height:30px;/*文字の縦幅*/}

.menu-second-level li a:hover {
    height:100%;
    background: lightgrey;/*マウスオーバーの色*/}

li.menu-width-max ul.menu-second-level {
    position: absolute;
    bottom: 47px;/*高さ*/
    left: 0;
    box-sizing: border-box;
    width: 100%;
    padding:0;}

li.menu-width-max:hover ul.menu-second-level {
    bottom: 47px;/*高さ*/
    visibility: visible;
    opacity: 1;}

li.menu-width-max ul.menu-second-level li {
    float: left;
    width: 100%;
    border: none;}