/*-------------------------------------------------------------------
	
	レイアウト

-------------------------------------------------------------------*/
.right {
	text-align: right;
	}
.left {
	text-align: left;
	}
.center {
	margin:0 auto!important;
	}
.center_text {
	text-align:center;
	}
.f_left {
	float:left;
}
.f_right {
	float: right;
}
.font-b {
	font-weight: bold;
}

.font-40 {
	font-size: 4.0rem;
	line-height: 1.4;
	font-weight: bold;
}

.font-38 {
	font-size: 3.8rem;
	line-height: 1.4;
	font-weight: bold;
}

.font-30 {
	font-size: 3.0rem;
	line-height: 1.4;
	font-weight: bold;
}

.font-24 {
	font-size: 2.4rem;
	line-height: 1.4;
	font-weight: bold;
}
.font-22 {
	font-size: 2.2rem;
	line-height: 1.4;
	font-weight: bold;
}
.font-20 {
	font-size: 2rem;
	line-height: 1.2;
	font-weight: bold;
}
.font-18 {
	font-size: 1.8rem;
	line-height: 1.6;
	font-weight: bold;
}
.font-16 {
	font-size: 1.6rem;
	line-height: 1.8;
}
.font-14 {
	font-size: 1.4rem;
	line-height: 1.8;
}
.font-12 {
	font-size: 1.2rem;
	line-height: 1.4;
}

.bg-white {
	background-color:#fff;
}
.bg-blue {
	background-color:#384ca9;
}
.bg-blue-2 {
	background-color:#ddf2ff;
}





.f-bk {
	color:#000;
}
.f-white {
	color:#fff;
}
.f-navy {
	color: #384ca9;
}
.f-pink {
	color:#dc4d96;
}




.mincho {
	font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

@media (min-width:768px){
.background-pc {
  background-image: url('../imgs/fixed-image.jpg');
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
}
.shadow {
   0 0 2px rgba(0,0,0,0.2);
}	
	}

.bg-note {
  background-image: url('../imgs/bg-note.gif');
  background-size: contain;
  background-position: top;
}


/*マージン設定　----------------------------------------------------------*/
.mb15 {
	margin-bottom:15px;
	}
.mb20 {
	margin-bottom:20px;
	}
.mb30 {
	margin-bottom:30px;
	}
.mb40 {
	margin-bottom:40px;
	}
.mb60 {
	margin-bottom:60px;
	}
.mb100 {
	margin-bottom:100px;
	}
.mt20 {
	margin-top:20px;
	}
.mt40 {
	margin-top:40px;
	}
.mt50 {
	margin-top:50px;
	}
.mt60 {
	margin-top:60px;
	}
.mt80 {
	margin-top:80px;
	}
.mt100 {
	margin-top:100px;
	}
.pt05 {
	padding-top:5px;
	}
.pt10 {
	padding-top:10px;
	}
.pt20 {
	padding-top:20px;
	}
.pt30 {
	padding-top:30px;
	}
.pt40 {
	padding-top:40px;
	}
.pt60 {
	padding-top:60px;
	}
.pt80 {
	padding-top:80px;
	}
.pt100 {
	padding-top:100px;
	}
.pt160 {
	padding-top:160px;
	}
.pb05 {
	padding-bottom:5px;
	}
.pb10 {
	padding-bottom:10px;
	}
.pb20 {
	padding-bottom:20px;
	}
.pb30 {
	padding-bottom:30px;
	}
.pb40 {
	padding-bottom:40px;
	}
.pb60 {
	padding-bottom:60px;
	}
.pb100 {
	padding-bottom:100px;
	}
.pr15 {
	padding-right:15px;
	}
.pl15 {
	padding-left:15px;
	}
.ml30 {
	margin-left:30px;
	}
.ml40 {
	margin-left:40px;
	}



/*　治療の流れ　*/
.flow_design02 {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flow_design02 ul {
  padding: 0;
}

.flow_design02 li {
  list-style-type: none;
}

.flow_design02 dd {
  margin-left: 0;
}

.flow02 > li {
  padding: 40px 10px;;
}

.flow02 > li:not(:last-child) {
  border-bottom: 3px solid #384ca9;
  position: relative;
}

.flow02 > li:not(:last-child)::before,
.flow02 > li:not(:last-child)::after {
  content: "";
  border: solid transparent;
  position: absolute;
  top: 100%;
  left: 15%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

.flow02 > li:not(:last-child)::before {
  border-width: 22px;
  border-top-color: #384ca9;
}

.flow02 > li:not(:last-child)::after {
  border-width: 18px;
  border-top-color: #fff;
}

.flow02 > li dl {
  margin: 0;
}

.flow02 > li dl dt {
  font-size: 1.3em;
  font-weight: 600;
  border-bottom: 1px solid #384ca9;
  margin-bottom: 0.5em;
  padding-bottom: 0.5em;
  display: flex;
}

.flow02 > li dl dt .icon02 {
  font-size: 0.6em;
  color: #fff;
  background: #384ca9;
  padding: 5px 10px;
  display: inline-block;
  margin-right: 0.5em;
}
    

/*　アイコン　*/
.icon-text {

  background: url("../imgs/icon.png") no-repeat 0 0; /* アイコン画像のURLと位置 */
  padding-left: 25px; /* アイコン画像のサイズとテキストとの距離を調整 */
}

.icon-text::after {
  content: " "; /* スペース */
  display: inline-block; /* スペースを空けるためのブロック要素 */
  width: 5px; /* スペースの幅 */
  height: 1px; /* スペースの高さを調整 */
}
/*　画像指定　*/
.img-fluid {
	width:100%;
	height:auto;
	vertical-align: bottom!important;
	}


/*　SP/PC 個別設定　*/
@media only screen and (min-width:768px) {
.title {
	font-size: 36px;
	font-weight: bold;
	line-height: 1.6;
}
.title-2 {
	font-size: 22px;
	line-height: 1.6;
	letter-spacing: 0.1em;
}
.space {
	padding: 100px 0;
	}
.footerlogo{
	width: 90px;
	}
}

@media only screen and (max-width:767px) {
.title {
	font-size: 24px;
	line-height: 1.4;
	letter-spacing: 0.1em;
	font-weight: bold;
}
.title-2 {
	font-size: 18px;
	font-weight: bold;
	line-height: 1.4;
	letter-spacing: 0.1em;
}
.space {
	padding: 70px 0;
	}
.footerlogo{
	width: 20%;
	}
}

/*以下コンテンツ----------------------------------------------------------*/

/*　メイン　*/
.container-main {
    max-width: 650px;
	margin: 0 auto;
  }
.container-main-2 {
    max-width: 650px;
	padding-left: 30px;
	padding-right: 30px;
	margin: 0 auto;
  }
}

@media only screen and (max-width:767px)  {
  .container-main {
    width: 100%;
	margin: 0 auto;
  }
  .container-main-2 {
    width: 100%;
	margin: 0 auto;
	padding: 0 15px; 
  }

}

/*　上下線　見出し　*/
.head01 {
    padding: 0.8rem 0;
    margin-bottom: 0.2rem;
    border-bottom: 1px solid #384ca9;
}


/* FAQ区切り線リセットCSS */
.hr2 {
  height: 0;
  margin: 0;
  padding: 0;
  border: 0;title
}
.hr2 {
  border-top: 1px solid#989898;
}


/* Google Map */
iframe {
  width: 100%;
  aspect-ratio: 16/9;
}




/*----------------------フェードイン・スクロールで表示 */
.element {
  /* 最初は非表示 */
  transform: translateY(20px);
  opacity: 0;
  visibility: hidden;
  transition: transform 2s, opacity 2s, visibility 2s;
}
/* フェードイン時に入るクラス */
.is-fadein {
  transform: translateX(0);
  opacity: 1;
  visibility: visible;
}


/* スクロール　フェードイン表示 */
/*1.フェードインアニメーションの指定*/
.scrollanime {opacity: 0;} /*一瞬表示されるのを防ぐ*/
.fadeInDown {
    animation-name: fadeInDown;
    animation-duration: 2s;
    animation-fill-mode: forwards;
}
@keyframes fadeInDown {
    0% {
        opacity: 0;         
    }
    100% {
    opacity: 1.5;
    transform: translate(0);
    }
}
 
/*2.上下の動きを指定*/
.updown {transform: translateY(-50px);}
.downup {transform: translateY(50px);}
 
/*3.左右の動きを指定*/
.sect02{overflow: hidden;} /*横スクロールバーを隠す*/
.slide-right {transform: translateX(200px);}
.slide-left {transform: translateX(-200px);}