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

@media screen and (max-width:1300px){
	.bg01 .cost table{width: 100%;}
	.bg01 .cost table + p{width: 100%; margin: -40px auto 40px;}
}

@media screen and (max-width:599px){
	
	.pc{display: none;}
	.sp{display: initial;}
	
	section{width: 100%;}
	
	h2{font-size: 7vw;}
	
	header{padding: 90px 45px 70px;}
	header .logo{
		width: 17vw;
		top: 20px;
		left: 20px;}
	
	.type ul li{
		width: 40%;
		margin: 20px 10px;}
	
	.invisa_pre{padding: 45px 20px;}
	.invisa_pre p:last-child em{
		display: block;
		font-size: 7vw;}
	
	.invisa{padding: 50px 20px;}
	.invisa h2 + p.min{font-size: 5.7vw;}
	.invisa .point{display: block;}
	.invisa .point .merit{margin-bottom: 40px;}
	.invisa .point .demerit ul li:last-child{margin-top: 10px;}
	
	.invisa .diff {padding: 70px 15px 40px;}
	.invisa .diff h3{font-size: 5vw;}
	.invisa .diff .wrap{
		width: 100%;
		overflow: scroll;}
	.invisa .diff table{white-space: nowrap;}
	.invisa .diff table img{max-width: none;}
	.invisa .diff table tr:not(:first-child) th {
		padding: 10px 5px;
		font-size: 0.875em;}
	.invisa .diff table tr th,
	.invisa .diff table tr td {padding: 10px 10px;}
	
	.invisa .itero{
		display: block;
		margin-bottom: 50px;}
	.invisa .itero .txt{margin-left: 0;}
	.invisa .itero h3{font-size: 5vw;}
	.invisa .itero ul{padding: 0; margin: 0;}
	.invisa .itero li{font-size: 5vw;}
	
	.invisa .movie{padding: 20px 10px;}
	.invisa .movie .movie_box iframe{
		width: 100%;
		height: 100%;}
	
	.invisa .last{font-size: 4vw;}
	
	.notice{padding: 40px 20px;}
	.notice .notice_in{display: block;}
	.notice .notice_in .txt{margin: 0;}
	.notice .notice_in .txt p br{display: none;}
	
	.notice_nex{
		padding: 50px 20px 40px;
		font-size: 7vw;}
	.notice_nex strong{
		display: block;
		margin-right: 0;}
	
	.bg01{padding: 60px 10px 120px;}
	.bg01:after{height: 110px;}
	
	.bg01 .flow,
	.bg01 .cost,
	.bg01 .plan{padding: 60px 40px 40px;}
	
	.bg01 .flow .flow_in{margin-top: 50px;}
	.bg01 .flow .box{display: block;}
	.bg01 .flow .box .num{
		font-size: 6vw;
		margin:0 auto 20px;
		width: 20vw;
		height: 20vw;}
	.bg01 .flow .box .txt{margin:0 0 20px;}
	.bg01 .flow .box .txt h3{text-align: center;}
	.bg01 .flow .box .photo{
		text-align: center;
		margin-bottom: 30px;}
	
	.bg01 .cost table{margin-bottom: 30px; width: 100%;}
	.bg01 .cost table tr,
	.bg01 .cost table th,
	.bg01 .cost table td{
		display: block;
		text-align: center;}
	.bg01 .cost table th,
	.bg01 .cost table td{padding: 20px 5px;}
	.bg01 .cost table tr:not(:first-child) th{text-align: center;}
	.bg01 .cost table td.fee{
		text-align: center;
		font-size: 5.5vw;}
	
	.bg01 .cost table td{
		border-left: 1px solid #6e5f00;
		border-top: 1px dashed #6e5f00;}
	
	.bg01 .cost table + p{width: 100%; margin: -3vw auto 5vw;}
	
	.bg01 .plan .plan_list{display: block;}
	.bg01 .plan table{
		width: 100%;
		min-width: auto;
		margin: 20px auto 0;}
	
	.qa{padding: 80px 20px;}
	.qa .qa_in{display: block;}
	.qa .qa_in .box{padding: 0;}
	.qa .qa_in .box:nth-child(2){
		border-width: 1px 0;
		margin: 30px 0;
		padding: 20px 0;}
	
	.reason .reason_in{
		display: block;
		padding: 0 20px;}
	
	.reason .reason_in .box{
		margin-bottom: 50px;}
	.reason .reason_in .box p:not([class]) img{width: 100%;}
	
	.dr_wrap .bg{height: 380px;}
	.dr_wrap .bg img{object-position: right;}
	.dr{
		width: 95%;
		padding: 60px 30px;}
	.dr .box_top{display: block;}
	.dr .box_top .photo{
		margin-right: 0;
		margin-bottom: 10px;
		text-align: center;}
	.dr .dox_bottom{display: block;}
	.dr .dox_bottom > div:first-child{margin-bottom: 30px;}
	
	.clinic_in{display: block;}
	.clinic_in .logo{
		text-align: center;
		margin-bottom: 30px;}
	.clinic_in table tr,
	.clinic_in table th,
	.clinic_in table td{
		display: block;
		text-align: left;}
	.clinic_in table th{border: none;}
	.clinic_in table td{
		padding-top: 0;
		border-bottom: 1px solid;}
	.philosophy{padding: 30px 20px;}
	.philosophy .box{width: 100%;}
	
	.philosophy .box p br{display: none;}
	
	.consultation{padding: 70px 10px 40px;}
	.consul_in{
		padding: 50px 25px;
		width: 100%;}
	.consul_in li{display: block;}
	.consul_in li:not(:last-child){margin-bottom: 10px;}
	
	.cv_form table{width: 100%;}
	.cv_form th{
		min-width: auto;
		padding: 20px 5px;}
	.cv_form td{min-width: auto;}
	.cv_form th,
	.cv_form td{display: block;}
	
	.cv_form input[type="text"],
	.cv_form input[type="tel"],
	.cv_form input[type="mail"]{border: 1px solid #ccc;}
	.cv_form td{padding: 0 10px 10px;}
	.cv_form textarea{border: 1px solid #ccc;}
	
	.consul_in .tel{width: 100%;}
	.consul_in .tel .tit{
		position: static;
		transform: none;}
	.consul_in .selfphoto h3{
		position: static;
		transform: none;
		margin-bottom: 20px;}
	.consul_in .selfphoto{padding: 20px 15px;}
	
	.cv_btn{
		width: 10vw;
		top: 10px;}
	.cv_btn:nth-of-type(2){top: 200px;}
	
	.thanks .consultation{
		height: 100%;
		padding: 200px 10px 40px;}
	.news-area.wrap{width: 95%; margin: 0 auto 30px;}
	.news-area dl.emergency dd{padding: 15px;}
	.bg01 .plan h2 + p.campaign {line-height: 180%;}
	
	/* 20201014追加 compare--------------------------------*/
	.compare{padding: 30px 20px;}
	.compare .box{
		width: 100%;
		padding: 50px 30px 60px;}
	.compare .pre{
		display: table;
		position: relative;
		margin: 0 auto 20px;}
	.compare .pre:before,
	.compare .pre:after{
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		margin: 0;}
	.compare .pre:before{left: -20px;}
	.compare .pre:after{right: -20px;}
	
	.compare h2{
		font-size: 6.5vw;
		width: 100%;
		margin: 0 auto 30px;}
	.compare ul{
		width: 100%;
		font-size: 4.8vw;
		letter-spacing: 0.15em;}
	
	.compare ul li p{padding: 0 0 0 9vw;}
	.compare ul li p:before{
		width: 6vw;
		height: 6vw;}
    
    .small{
        font-size: 0.8em!important;
    }
    .float-btn.sp{ display: flex; position: fixed; bottom: 0; left: 0; width: 100%; z-index: 1001;margin: 0 auto; }
    .float-btn li{ background: #6e6002; width: 100%; height: 14.666vw; display: flex; justify-content: center; align-items: center; position: relative; font-size: 4.666vw; color: #fff; }
    .float-btn li + li{ border-left: solid 1px #fff; }
    .float-btn li span{ padding-left: 4.666vw; background-repeat: no-repeat; }
    .float-btn li:nth-of-type(1) span{ background-image: url("../img/icon-tel.png"); background-position: top 50% left 0; background-size: 2.666vw; }
    .float-btn li a.linkwrap{width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0; z-index: 10;}
	
	.news-area .btn a{color: #6e5f00; border: 1px soli #6e5f00; text-align: center;}
	
	.news-area .btn.width a{color: #6e5f00; border: 1px soli #6e5f00; text-align: center; width: 75vw}
	
	
		.bg01 .cost table td.zero{
		text-align: center;
		font-size: 4.5vw;}
}