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

@media screen and (max-width:599px){
	
	.pc{display: none;}
	.sp{display: initial}
	
	section,.wrap_s,.wrap_l{width: 100%;}
	.pc_fix > p{margin-right: 5px;}
	.pc_fix > .tel{font-size: 1rem;}
	.pc_fix > .tel a{display: block;padding: 15px 20px 10px;}
	.pc_fix > .tel a img{display: block;margin: 0 auto 8px;}
	
	.top .cover{display: none;}
	header .mv{border-width: 28px 0 0;height: 560px;}
	header .logo{width: calc(100% - 50px);}
    
    header .mv ul,header .mv ul li{height: 100%;}
	
	nav .gnav .logo{margin-bottom: 30px;}
	nav .gnav .logo img{width: 80vw;}
	nav .gnav ul{padding: 0 25px;margin-bottom: 30px;}
	nav .gnav li{flex-basis: calc(100%/2 - 1px);margin-bottom: 2px;}
	nav .gnav li a{padding: 20px;}
	nav input:checked ~ label span:after{width: 50px;}
	
	.top h2{font-size: 1.62em;}
	
	.top main{margin-top: 560px;}
	.top .news article{display: block;padding: 0 25px;}
	.top .news ul{margin-bottom: 30px;}
	.top .news li:not(:last-child){margin-bottom: 10px;}
	.top .news li span{padding-right: 10px; margin-right: 10px;}
	.top .news article > p a{margin: auto;border-radius: 0;padding: 5px 0;}
	.top .news article > p a:before,.top .news article > p a:after{content: "";display: block; width: 100%;height: 1px;background: #fff;}
	.top .news article > p a:before{margin-bottom: 10px;}
	.top .news article > p a:after{margin-top: 10px;}
	
	.top .information article{display: block;padding: 40px 25px;}
	.top .information article .left{display: none;}
	.top .information table{width: 100%;margin-bottom: 30px;}
	.top .information th:first-child,.top .information th, .top .information td{font-size: 1rem;}
	.top .information td:first-child{font-size: 1.07em;}
	.top .information th, .top .information td{padding: 5px;}
	.top .information .btn{margin-top: 20px;}
	.top .philosophy{padding: 40px 5vw;}
	.top .philosophy article{width: 100%;padding: 50px 30px;}
	/*.top .philosophy h2 + p{text-align: left;line-height: 1.8;}*/
    .top .philosophy p{text-align: left;line-height: 1.8;}
	.top .philosophy article p br:not([class]){content: "";display: block;border-bottom: 1px solid #967022;margin: 10px 0;}
    
	
	.top .first{padding: 38px 25px;}
	.top .first ul{display: block;}
	.top .first ul li{width: 100%;flex-direction: row;justify-content: flex-start;padding: 10px 25px;}
	.top .first ul li p:nth-child(1){margin-right: 20px;flex-shrink: 0;}
	.top .first ul li p:nth-child(2){writing-mode:horizontal-tb;margin: 0;flex-shrink: 1;}
	.top .first ul li p:nth-child(3){margin-left: auto;margin-top: 0;}
	.top .first ul li:not(:last-child){margin-bottom: 20px;}
	.top .first ul li:not(:last-child):after{content: none;}
	
	.top .clinic_bg{width: 100%;height: 300px;background: url(../img/index/webp/clinic_img-sp.webp)no-repeat center;}
	.no-webp.top .clinic_bg{ background: url(../img/index/clinic_img-sp.jpg)no-repeat center; }
	
	.top .concept article .box01,
	.top .concept article .box02,
	.top .concept article .box03,
	.top .concept article .box04,
	.top .concept article .box05{width: calc(100% - 15px);height: 210px; position: static;margin-bottom: 15px;}
	.top .concept article .in a{padding: 20px; box-sizing: border-box; height: 210px;}
	.top .concept article .in .txt p,.top .concept article .in .more{display: none;}
	.top .concept article .in:before, .top .concept article .in:after{content: none;}
	.top .concept article .in .txt{height: 100%; justify-content: center;}
	.top .concept article .in .txt h3{margin: 0;font-size: 1.14em;}
	.top .concept article:nth-child(3),.top .concept article:nth-child(4){margin-top: 0;}
	
	.top .concept article .in .para{display:none;}
	
	.top .concept article .box01{background: url("../img/index/webp/concept_img01_sp.webp")no-repeat;background-size: cover;}
	.no-webp.top .concept article .box01{ background: url("../img/index/concept_img01_sp.jpg")no-repeat;background-size: cover; }
	.top .concept article .box02{background: url("../img/index/webp/concept_img02_sp.webp")no-repeat;background-size: cover;margin-left: auto;clip-path: polygon(50px 0%, 100% 0, 100% 100%, 0 100%, 0 50px);}
	.no-webp.top .concept article .box02{ background: url("../img/index/concept_img02_sp.jpg")no-repeat;background-size: cover; }
	.top .concept article .box03{background: url("../img/index/webp/concept_img03_sp.webp")no-repeat;background-size: cover; margin-right: auto; margin-left: 0;}
	.no-webp.top .concept article .box03{ background: url("../img/index/concept_img03_sp.jpg")no-repeat;background-size: cover; }
	.top .concept article .box04{background: url("../img/index/webp/concept_img04_sp.webp")no-repeat;background-size: cover;margin-left: auto;clip-path: polygon(50px 0%, 100% 0, 100% 100%, 0 100%, 0 50px);}
	.no-webp.top .concept article .box04{ background: url("../img/index/concept_img04_sp.jpg")no-repeat;background-size: cover;}
	.top .concept article .box05{background: url("../img/index/webp/concept_img05_sp.webp")no-repeat;background-size: cover;margin-left: 0;}
	.no-webp.top .concept article .box05{ background: url("../img/index/concept_img05_sp.jpg")no-repeat;background-size: cover;}
	.top .treatment ul li{margin: 10px;}
	.top .treatment ul li a{background: #fff;width: 40vw;height: 40vw;}
	.top .treatment ul li a img{width: 20vw;}
	.top .ortho{padding: 50px 25px;background: url(../img/index/webp/bg_invisa-sp.webp) no-repeat center #4d4d4d;}
	.no-webp.top .ortho{ background: url(../img/index/bg_invisa-sp.jpg) no-repeat center #4d4d4d; }
	/*.top .ortho h2 + p{margin-bottom: 30px;}*/
    	.top .ortho p{margin-bottom: 30px;}
	.top .ortho .in{display: block;padding: 0;}
	.top .ortho .in .box{width: 100%;height: auto;margin-bottom: 20px;}
	.top .ortho .in .box img[src*="_sp"]{display: block;}
	.top .ortho .in .box img:not([src*="_sp"]){display: none;}
	.top .ortho .in .box h3{width: 165px; background: rgba(255,255,255,.9); writing-mode: horizontal-tb;top: 50%;left: 50%;transform: translate(-50%,-50%);padding: 10px;}
	
	.top .doctor{padding: 40px 0;}
	.top .doctor .in{display: block;padding: 0 25px;margin-bottom: 30px;}
	.top .doctor:before{height: 300px;background-size: 120%; background-position: top right;}
	/*.top .doctor h2{margin-bottom: 180px;}*/
    .top .doctor h2{margin-bottom: 20px;}
	.top .doctor .in .photo{margin-right: 0;text-align: center;margin-bottom: 30px;}
	.top .doctor .in .photo img{max-width: none; width: 45vw;}
	
	footer{display: flex;flex-wrap: wrap;}
	footer > *{flex-basis: 100%;}
	footer .foot ul{display: table;}
	
	footer .tit{order: 0;}
	footer .logo{order: 1;}
	footer .map{order: 2;}
	footer .wrap_l{order: 3;}
	footer .foot{order: 4;}
	
	footer .logo{text-align: left;margin-bottom: 20px;padding: 0 25px;}
	footer .logo img[src*="_c"]{display: none;}
	footer .logo img[src*="_l"]{display: inline;}
	footer .wrap_l{flex-wrap: wrap;padding: 0 25px;}
	footer .wrap_l .left,footer .wrap_l .right{flex-basis: 100%;}
	footer .map {padding: 0 25px;margin: 0;margin-bottom: 20px;}
	footer .map iframe{height: 300px;}
	footer .foot{display: block; text-align: center; margin-left: 0;padding: 20px 25px;}
	
	footer article .left p{padding-left: 25px;}
	footer article .left p span{margin-left: -25px;}
	footer article .left p:nth-child(1),footer article .left p:nth-child(2){background: url("../img/common/line_dot.png")repeat-x bottom;background-size: 6px;padding-bottom: 10px;margin-bottom: 10px;}
	footer .wrap_l .left{margin-bottom: 20px;}
	footer .right .yoyaku{width: 100%;}
	footer .foot .copy{font-size: 3.2vw;padding: 30px 0px 0px;}
    .tit {width: 100%;margin: 10px auto;}
	.tit h1,.tit h2{display: block; color: #967022;font-size: 1em;text-align: center;margin-bottom: 0;}

}

@media screen and (max-width:360px){
	nav .gnav li a{padding: 10px;}
	.btn,.top .news article > p a{width: 250px;}
	.top .concept .btn a{font-size: 0.9em;padding: 20px 10px;}
	.top .treatment ul li h3{font-size: 0.9em;}
	footer .right .tel{font-size: 10.5vw;}
}