@charset "UTF-8";
/* CSS Document */

html   { 
                font-size: 62.5%; 
        }

body {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 1.8rem;
  line-height: 1.65;
  color:#5B5259;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
  word-break: break-all;
}
img{
	width: 100%;
}

@media screen and (max-width: 500px) {
  body {
    font-size: 1.6rem;
    line-height: 1.4;
  }
}
@media screen and (min-width: 500px) {
	#werapper500{
		width: 100%;
		max-width: 500px;
		margin: 0 auto;
		background-color: #fff;
		box-shadow:0px 15px 30px 20px rgba(196, 189, 222, 0.374);
	}}
@media screen and (min-width: 500px) {
	body{
		background-image: url("../img/BG.jpg");
		background-repeat: no-repeat;
		background-attachment: fixed
	}
	}
	/*wrapper*/
.wrapper90{
	width: 90%;
	margin: 0 auto;
}
.wrapper90-2{
	width: 90%;
	margin: 0 auto;
}

.wrapper80{
	width: 80%;
	margin: 0 auto;
}
	/*margin*/
  .padding-1{
		padding: 1rem 0 0 0;
	}
	.margin-1{
		margin: 1rem 0 1rem 0;
	}
	.margin-t1{
		margin-top: 1rem 0 1rem 0;
	}
	.margin-2{
		margin: 2rem 0 2rem 0;
	}
  .margin-4{
		margin: 4rem 0 4rem 0;
	}
/*テキスト*/
.attention-text{
	font-size: 9px;
}

/*コンテンツ*/
.top{
  background-color: #D0EEFB;
}

.main1{
  background-color: #FCE4EF;
  padding-bottom: 1rem;
}


.main2{
  background-color: #D9EAF9;
  padding-bottom: 1rem;
}
.main4{
  background-color: #F8F2F5;
  padding-bottom: 1rem;
}
.main5{
  background-color: #FAFBFC;
  padding-bottom: 1rem;
}
.main6{
  background-color: #D9EAF9;
  padding-bottom: 1rem;
}
.wbox{
  width: 90%;
  background-color:#fff;
  margin: 0 auto;
  padding: 1rem;
}
.main7{
  background-color: #F9FBFC;
  padding-bottom: 1rem;
}

.main10{
  background-color: #D9EAF9;
  padding-bottom: 1rem;
}

.main11{
  background-color: #FFE4E6;
  
}

.main12{
  background-color: #EFE8E4;
  
}


.main15{
  background-color: #7E94D9;
  font-family: "Shippori Mincho", serif;
  color: #616161;
  padding-bottom: 5rem;
  
}
.clinic-t1{
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  display: block;
}
.clinic-t2{
  color:#7E94D9;
  font-weight: bold;
}
.border{
  border-bottom: 1px solid #B6B6B6;
}


/*footer*/
footer{
  background-color: #9AC6EF;
  color: #fff;
  font-size: 1.2rem;
margin: 0 auto;
text-align: center;
padding-top: 3rem;
padding-bottom: 50%;
}
.footer small{
  font-size: 9px;
}
.privacy{
	font-size: 9px;
}
.privacy a{
  margin: 1rem;
}

/* スライドイン左から */

/* 左からふわっとJQ */
.fadeInLeft {
  -webkit-animation-name: fadeInLeftAnime;
          animation-name: fadeInLeftAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
@-webkit-keyframes fadeInLeftAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100px);
            transform: translateX(-100px); 
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@keyframes fadeInLeftAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100px);
            transform: translateX(-100px); 
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
.fadeInLeftTrigger {
  opacity: 0;
}

/* 右からふわっとJQ */
.fadeInRight {
  -webkit-animation-name: fadeInRightAnime;
          animation-name: fadeInRightAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
@-webkit-keyframes fadeInRightAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100px);
            transform: translateX(100px); 
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0); 
  }
}
@keyframes fadeInRightAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100px);
            transform: translateX(100px); 
  }
  100% {
    opacity: 1; 
    -webkit-transform: translateX(0);
            transform: translateX(0); 
  }
}
.fadeInRightTrigger {
  opacity: 0; 
}

/* 下からふわっとJQ */

.fadeUp {
  -webkit-animation-name: fadeUpAnime;
          animation-name: fadeUpAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
@-webkit-keyframes fadeUpAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
            transform: translateY(100px); 
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
}}
@keyframes fadeUpAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
            transform: translateY(100px); 
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0); 
  }
}
.fadeUpTrigger {
  opacity: 0; 
}
/*-------CTA------*/
.cv_btn {
 padding: 2rem auto 2rem auto;
 margin: 0 auto;
   width: 90%;
}
.cv_btn img {
  animation: anime1 0.6s ease 0s infinite alternate;
  transform-origin: center;
}
@keyfram
 anime1 {
  from {
    transform: scale(0.9,0.9);
  }
  to {
    transform: scale(1,1);
  }
}
/*-------追従CTA------*/
.in_fixed_bottom {
  position: fixed;
  left: 50%;
    transform: translate(-50%, 0%);
    -webkit-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
  width: 100%;
  max-width: 500px;
  background:linear-gradient(rgba(255,255,255,0) 0,rgba(255,255,255,.9) 15%,#fff 60%);
  box-sizing: border-box;
  padding: 24px;
  z-index: 9;
}
.in_fixed_bottom[aria-expanded=false] {
  bottom: -200px;
  transition: .1s;
}
.in_fixed_bottom[aria-expanded=true] {
  bottom: 0%;
  transition: .5s;
}

.kiran-img {
  position :relative;
  overflow :hidden;
  }
  .kiran {
  height:100%;
  width:30px;
  position:absolute;
  top:-180px;
  left:0;
  background-color: #ffffff2c;
  opacity:0;
  transform: rotate(45deg);
  animation: reflection 2s ease-in-out infinite;
  -webkit-transform: rotate(45deg);
  -webkit-animation: reflection 2s ease-in-out infinite;
  -moz-transform: rotate(45deg);
  -moz-animation: reflection 2s ease-in-out infinite;
  -ms-transform: rotate(45deg);
  -ms-animation: reflection 2s ease-in-out infinite;
  -o-transform: rotate(45deg);
  -o-animation: reflection 2s ease-in-out infinite;
  }
  @keyframes reflection {
  0% { transform: scale(0) rotate(45deg); opacity: 0; }
  30% { transform: scale(0) rotate(45deg); opacity: 0.5; }
  31% { transform: scale(4) rotate(45deg); opacity: 1; }
  100% { transform: scale(50) rotate(45deg); opacity: 0; }
  }
  @-webkit-keyframes reflection {
  0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
  30% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
  31% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
  }
  @-moz-keyframes reflection {
  0% { -moz-transform: scale(0) rotate(45deg); opacity: 0; }
  30% { -moz-transform: scale(0) rotate(45deg); opacity: 0.5; }
  31% { -moz-transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -moz-transform: scale(50) rotate(45deg); opacity: 0; }
  }

  /*アコーディオン全体*/
.accordion-area{
  list-style: none;
  width: 96%;
  max-width: 900px;
  margin:30px auto;
}

.accordion-area li{
  margin: 10px 0;
}

.accordion-area section {
border: 0.1px solid #B787A5;
background-color: #B787A5;
font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-style: normal;
}

/*アコーディオンタイトル*/
.title {
  position: relative;/*+マークの位置基準とするためrelative指定*/
  cursor: pointer;
  font-size:1.4rem;
  color: #fff;
  font-weight: normal;
  padding: 3% ;
  transition: all .5s ease;

}

/*アイコンの＋と×*/
.title::after{
  content: "";
    display: inline-block;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 2rem;
    background: url(../img/icon_accordion.png) no-repeat center / contain;
    width: 1.25rem;
    height: 1.25rem;
    -webkit-transition: 0.3s;
    transition: 0.3s;
  
}
.title::after.open{
  -webkit-transform: translateY(-50%) rotate(-45deg);
  transform: translateY(-50%) rotate(-45deg);
}

.iconq{
  width: 2.5rem;
  height: 2.25rem;
}
.titleq{
font-size:2rem;
margin-right: 0.5rem;
}
/*
.title::before{
  content: "";
  display: inline-block;
  background: url(../img/iconQ.png) no-repeat center / contain;
  width: 2.5rem;
  height: 2.25rem;
  -ms-flex-negative: 0;
  flex-shrink: 0;}　*/
  

/*　closeというクラスがついたら形状変化　*/

.title.close::after{
transform: rotate(-45deg);
}

/*アコーディオンで現れるエリア*/
.box {
  display: none;/*はじめは非表示*/
  background: #ffffff;
  color: #747059;
  padding: 3%;
}

.box p::before{
  content: "";
  display: inline-block;
  background: url(../img/iconA.png) no-repeat center / contain;
  width: 2.5rem;
  height: 2.25rem;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}