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

html { font-size: 62.5%; }
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body{
    color: #3e3a39;
    font-family: 'Noto Sans JP', sans-serif;
    line-height: 1.6;
    overflow-x: hidden;
	margin: 0 auto;
	font-size: 1.6rem;
	text-align: center;
}
img{
	vertical-align: bottom;
	width: 100%;
}
a{
    text-decoration: none;
}
a:hover{
	opacity: 0.8;
}
section, div{
	margin: 0 auto;
	padding: 0;
}
ul{
	list-style: none;
}

#wrapper{
	margin: 0 auto;
	width: 100%;
	max-width: 640px;
	box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.1);
	overflow: hidden;
}
#wrapper .inner_box{
	width: 92%;
	margin: 0 auto;
}
.contents{
	margin: 0 auto;
}
.coupon{
	position: relative;
}
.coupon .btn_copy{
	position: absolute;
	width: 14%;
	top:34%;
	right:8%;
    cursor: pointer;
}
.coupon .btn_ios{
	position: absolute;
	width: 39%;
	bottom: 9.5%;
	left: 8%;
}
.coupon .btn_google{
	position: absolute;
	width: 43%;
	bottom: 9.5%;
	right: 8.5%;
}
.coupon #dateInfo, .coupon #dateInfo2, .coupon #dateInfo3{
	position: absolute;
	width: 100%;
	right: 0;
	left: 0;
	margin: -40.5% auto;
	font-size: 1.8rem;
	font-weight: bold;
	color: #082d59;
}
#symptoms{
	margin: 2.5em auto 4.5em;
}
#symptoms .inner_box{
	width: 84%;
}
#recommend, #emblem, #reason, #flow, #doctor, #subject, #voice{
	margin: 3em auto;
}
#price{
	margin: 3em auto 3em;
}
#example{
	margin: 3em auto 4em;
}
#example h2{
	width: 64%;
	margin: 0 auto 2em;
}
.slider_parent {
  position: relative;
  overflow: hidden;
}

.slider_parent .slider {
  display: flex;
}

.text_scroll {
  animation: scroll 40s linear infinite;
}
.slider_second{
	margin-top: 2em;
}
.text_scroll_reverse {
  animation: scroll 40s linear infinite;
  animation-direction: reverse !important; 
}

.logos {
  flex-shrink: 0;
}
.logos li img{
	height: 50px;
}
.slider_parent ul li {
  margin-left: 10px;
  margin-right: 10px;
}

.slider_parent ul li {
  display: inline-block;
}

.slider_parent ul {
  padding: 0;
  margin: 0;
  display: flex;
}

.slider_parent ul li > a img {
  transition: 0.4s;
}
.slider_parent ul li > a img {
  max-width: 100% !important;
}

.step_slider {
  max-width: 100%;
  margin: 0 auto;
}
.slick-slide {
  margin: 0 5px;
}
.slick-slide img {
  width: 100%;
  height: auto;
}
.slick-prev, .slick-next {
  z-index: 1;
}
.slick-prev:before, .slick-next:before {
  color: #44C5DE;
}
.slick-slide {
  transition: all ease-in-out .3s;
  opacity: .2;
}
.slick-active {
  opacity: 1;
}
.slick-current {
  opacity: 1;
}
.slick-next{
	right: 2px;
	width: 50px;
	height: 50px;
}
.slick-prev{
	left: 2px;
	width: 50px;
	height: 50px;
}

.thumb {
  margin: 20px 0 0;
}
.thumb .slick-slide {
  cursor: pointer;
}
.thumb .slick-slide:hover {
  opacity: .7;
}
.slick-next:before, .slick-prev:before{
	font-size: 50px;
}






#flow .step_comme{
	margin-top: 2em;
}
@keyframes scroll {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media only screen and (max-width: 991px) {
  .slider_parent ul li {
    margin-left: 5px;
    margin-right: 5px;
  }
  .slider_parent ul li img {
    height: 50px;
    width: auto;
  }
  .text_scroll {
    animation: scroll 30s linear infinite;
  }
}
#flow .need{
	width: 88%;
	margin: 4em auto 3em
}
#media{
	margin-bottom: 3em;
}
#voice{
	margin-bottom: 0;
}
#faq{
	margin: 3em auto;
}
#faq h2{
	margin: 4em auto 3em;
	width: 90%;
}
#FAQ-area{
	text-align: left;
	width: 100%;
}
#FAQ-area dt{
	display: flex;
	background-color: #00accf;
	padding: 1.2em 0 1.5em 1em;
	width: 100%;
	color: #FFFFFF;
	font-size: 1.8rem;
    cursor: pointer;
	position: relative;
	justify-content: flex-start;
	align-items: center;
	border-bottom: 1px dashed #7CDAEA;
	font-weight: 700;
}
#FAQ-area dl .q_10{
	border-bottom: none;
}
#FAQ-area dt .icon_q{
	width: 6%;
}
#FAQ-area dt .text_q{
	width: 82%;
	margin-left: 1em;
}
#FAQ-area dt .yaji{
}
#FAQ-area dt::after{
	content: "";
	display: block;
	position: absolute;
	top: 35%;
	right: 1.5em;
	width: 20px;
	height: 20px;
	border-top: 2px solid #FFF;
	border-right: 2px solid #FFF;
	transform: rotate(45deg);
}
#FAQ-area dt.is-active{
	border-bottom: none;
}
#FAQ-area dt.is-active::after{
    transform: rotate(135deg);
	transition: .3s;
}
#FAQ-area dd{
    display: none;
	padding: 1em;
}
#FAQ-area dd .a_box{
	display: flex;
}
#FAQ-area dd .a_box .icon_a{
	width: 6%;
}
#FAQ-area dd .a_box .text_a{
	width: 90%;
	margin-left: 1em;
}
#FAQ-area p{
	display: block;
}
#contact{
	position: relative;
}
#contact .btn_line{
	position: absolute;
	width: 90%;
	bottom: 14%;
	left: 5%;
}

footer .footer_box{
	padding: 4% 0 4%;
	color: #424242;
}

footer .footer_link{
	display: flex;
    justify-content: center;
    width: 54%;
    margin: 0 auto;
}
footer .footer_link li{
	margin: 40px auto 20px;
	font-size: 1.2rem;
}
footer .footer_link li a{
	color: #424242;
}
footer .footer_link li a:visited{
	color: #424242;
}
footer .footer_link li:first-child{
	margin-right: 20px;
}
footer .copy{
	font-size: 1.0rem;
}
footer .footer_logo{
	padding-bottom: 25%;
	background: #f5f8fb;
}
.footer-banner {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	width: 80%;
	border-radius: 30px;
	max-width: 520px;
	height: 126px;
	padding: 0px;
	z-index: 999;
	background-color: rgba(159, 219, 244, .85);
	margin-bottom: 1%
}
.footer-banner img{
	display: block;
}
.footer-banner a {
	max-width: 640px;
}
.footer-banner .cv_banner{
	margin: 0 auto;
	position: relative;
	max-width: 640px;
	width: 100%;
}
.footer-banner .cv_banner .fb_text{
	width: 68%;
	margin: 1em auto 0.3em;
}
.footer-banner .cv_banner .btn_copy_2{
	width: 30%;
	margin: 0 auto 0.2em;
	cursor: pointer;
}
.footer-banner .cv_banner .btn_copy_2:hover{
	opacity: 0.8;
}
.footer-banner .cv_box{
	display: flex;
	justify-content: space-between;
	width: 100%;
	margin: 0 auto 0.5em;
}
.footer-banner .btn_ios_2{
	width: 34%;
	margin-left: 14%;
}
.footer-banner .btn_google_2{
	width: 38%;
	margin-right: 12%;
}





@media(min-width:751px){
    .cp200_sp{
        display: none !important;
    }
}
@media(max-width:640px){
	#wrapper{
		box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
	}
	.contents{
	}

	img{
		width: 100%;
	}
	.coupon #dateInfo, .coupon #dateInfo2, .coupon #dateInfo3{
		margin: -40.5% auto;
		font-size: 2.8vw;
	}
	#symptoms{
		margin: 4vw auto 12vw;
	}
	#symptoms .inner_box{
		width: 90%;
	}
	#recommend, #emblem, #reason, #flow, #doctor, #subject, #voice{
		margin: 10vw auto 0;
	}
	#price{
		margin: 8vw auto 8vw;
	}
	#example{
		margin: 10vw auto 12vw;
	}
	#example h2{
		width: 70%;
		margin: 0 auto 7vw;
	}
	.slider_second{
		margin-top: 7vw;
	}
	.slider_parent ul li img {
		height: 9vw;
	  }
	#flow .need {
		width: 92%;
		margin: 11vw auto 10vw;
	}
	.slick-next{
		right: -2vw;
	}
	.slick-prev{
		left: -2vw;
	}
	.slick-next::before, .slick-prev::before{
		font-size: calc(10px + 8vw)
	}

	#faq{
		margin: 10vw auto;
	}
	#faq .inner_box{
		width: 100%
	}
	#faq h2{
		margin: 12vw auto 10vw;
		width: 90%;
	}
	#FAQ-area dt{
		padding: 1.2em 0 1.5em 2vw;
		font-size: 3.6vw;
	}
	#FAQ-area dt .icon_q{
		width: 6%;
	}
	#FAQ-area dt .text_q{
		width: 77%;
		margin-left: 1em;
	}
	#FAQ-area dt .yaji{
	}
	#FAQ-area dt::after{
		top: 35%;
		right: 5.5vw;
		width: 4vw;
		height: 4vw;
		border-top: 2px solid #FFF;
		border-right: 2px solid #FFF;
	}
	#FAQ-area dd{
		display: none;
		padding: 2vw;
		font-size: 3.4vw;
	}
	footer .footer_box{
		padding:2vw 0 calc(40% - 2vw);

	}
	footer .contact_ttl{
		font-size:3.6vw;
		font-weight: 500;
		margin-bottom: 5%;
	}
	footer .contact_area{
		width: 90%
	}
	footer .contact_area a{
		width: 70%;
		margin: 2% auto;
	}

	footer .footer_link{
		display: flex;
		justify-content:center;
		width: 70%;
		margin: 0 auto;
	}
	footer .footer_link li{
		margin: 5% auto;
		font-size: 2.8vw;
	}
	footer .footer_link li:first-child{
		margin-right: 2%;
	}
	footer .copy{
		font-size: 2.4vw;
	}
	.footer-banner {
		width: 96%;
		border-radius: calc(10px + 2vw);
		max-width: 560px;
		height: auto;
	}
	.footer-banner .cv_banner .fb_text{
		width: 70%;
		margin: 0.5em auto 0.3em;
	}
	.footer-banner .cv_banner .btn_copy_2{
		width: 40%;
		margin: 0 auto 0.2em;
	}
	.footer-banner .cv_box{
		display: flex;
		justify-content: space-between;
		width: 100%;
		margin: 0 auto 0.5em;
	}
	.footer-banner .btn_ios_2{
		width: 39%;
		margin-left: 9%;
	}
	.footer-banner .btn_google_2{
		width: 42.5%;
		margin-right: 8%;
	}
	
}