﻿@charset "utf-8";
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}:where([hidden]:not([hidden='until-found'])){display:none!important}:where(html){-webkit-text-size-adjust:none;color-scheme:dark light;tab-size:2}@media (prefers-reduced-motion:no-preference){:where(html:focus-within){scroll-behavior:smooth}}:where(body){line-height:1.5;font-family:system-ui,sans-serif;-webkit-font-smoothing:antialiased}:where(button){all:unset}:where(input,button,textarea,select){font:inherit;color:inherit}:where(textarea){resize:vertical;resize:block}:where(button,label,select,summary,[role='button'],[role='option']){cursor:pointer}:where(:disabled){cursor:not-allowed}:where(label:has(>input:disabled),label:has(+input:disabled)){cursor:not-allowed}:where(a){color:inherit;text-underline-offset:.2ex}:where(ul,ol){list-style:none}:where(img,svg,video,canvas,audio,iframe,embed,object){display:block}:where(img,picture,svg,video){max-inline-size:100%;block-size:auto}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(h1,h2,h3){line-height:calc(1em + 0.5rem);text-wrap:balance}:where(hr){border:none;border-block-start:1px solid;color:inherit;block-size:0;overflow:visible}:where(:focus-visible){outline:3px solid CanvasText;box-shadow:0 0 0 5px Canvas;outline-offset:1px}:where(:focus-visible,:target){scroll-margin-block:8vh}:where(.visually-hidden:not(:focus-within,:active)){clip-path:inset(50%)!important;height:1px!important;width:1px!important;overflow:hidden!important;position:absolute!important;white-space:nowrap!important;border:0!important}

body{font-size:18px;font-family: 'Zen Kaku Gothic Antique', sans-serif;color:#060223;letter-spacing: 0.1em;}
a:hover img {opacity:0.7;filter:Alpha(opacity=70);}

.wrap{width:800px;margin:0 auto;}
.width-m{width:100%;}
.width90{width:90%;margin:0 auto;}
.width80{width:80%;margin:0 auto;}

@media (max-width: 799px) {
.wrap{width:100%;}
}

.fv{margin:0 auto 40px;background:#fff;}

.con01{width:800px;background: url(../img/02_02bg.webp) no-repeat 0 bottom;margin:0 auto;padding:0 0 40px;}
.ex{width:90%;margin:0 auto;padding:20px 0;background:#fff;border-radius: 30px;}
.ex img{width:80%;margin:0 auto;}
.ex p{width:80%;margin:20px auto;font-size:0.6em;}

@media (max-width: 799px) {
.con01{width:100%;}
}

.con02 {
	background-color:#f1f0f5;
  background-image:
    linear-gradient(to right, #9d9d81 1px, transparent 1px),  /* 左線 */
    linear-gradient(to bottom, #9d9d81 1px, transparent 1px), /* 上線 */
    linear-gradient(to top, #9d9d81 1px, transparent 1px);    /* 下線 */
  background-repeat: no-repeat;
  background-position:
    30px top,
    left 30px,
    left bottom 30px;
  background-size:
    1px 100%,  /* 左線の幅と高さ */
    100% 1px,  /* 上線の幅と高さ */
    100% 1px;  /* 下線の幅と高さ */
}
.con02 img{padding:50px 0;}
.con02 p{padding:0 50px;}
.con03 {
	background-color:#f1f0f5;
	padding:20px 0;
}
.specialist{background: #F6F9F9 url(../img/specialist_bg.webp) no-repeat center top;padding:40px 0;}
.sp_txt{padding:2.0rem;}
.specialist h2{font-family: "Shippori Mincho", sans-serif;font-weight: 700;font-size:2.0em;line-height: 1.3;letter-spacing: 0.05em;}
.specialist h2 span{color:#7E6A12;}
.specialist h4{font-size:0.6em;}
.specialist p{padding:1.0rem 0;}
.clinic{padding:1.0rem;text-align:right;}


.con05{background:#E9EFF1;padding-bottom:40px;}
.con05 h2{padding:20px;font-weight: normal;text-align:center;}
.con05 h2 span{color:#BE7800;}
.con05-txt{padding:20px 40px 40px;font-size:0.9em;}
.merit{width:94%;margin:0 auto;padding:0;background:#fff;border-radius:28px;}
.merit-title{background:#7076AF;padding:2.0rem;text-align:center;color:#fff;border-radius:28px 28px 0 0;}
.merit-title h3{font-weight: normal;}
.merit-title h1{font-size:1.6em;padding:5px 0;}
.merit ul{margin:0;padding:2.0rem;list-style-type: none;display:flex;flex-direction:column;}
.merit li{display:flex;align-items: center;background:#e2e2ec;font-size:0.9em;margin:5px 0;}
.merit li h4{width: fit-content;background:#b58500;border-radius: 30px;color:#fff;font-weight: normal;padding:2px 10px;}
.merit li h3{color:#474f8e;font-size:1.8em;padding:5px 0;}
.merit-img{width:140px;}

@media (max-width: 799px) {
.specialist h2{font-size:1.8em;}
.merit ul{padding:1.0rem;}
.merit-img{width:32%;}
.merit li{font-size:0.7em;padding-right:5px;}
.merit li h3{font-size:1.4em;padding:2px 0;}
.merit li h4{font-size:0.8em;}
}

.con07{background:#E5EFF0;padding-bottom:40px;}
.con07 h2{
	margin-top:-150px;
	padding:10px;
	text-align:center;
	font-size:1.8em;
}
.con07 h2 span{background: linear-gradient(transparent 50%, #EEE89E 50%);}

.con07_link{width:80%;margin:0 auto 40px;list-style-type: none;display:flex;flex-wrap: wrap;}
.con07_link li{width:48%;margin:10px 1%;}
.con07_link li a{
	display:block;
	padding:20px 20px 0;
	font-size:1.4em;
	text-decoration:none;
	font-weight: bold;
	background:#fff;
	border:2px solid #7B7999;
	border-radius: 20px;
	text-align:center;
}

@media (max-width: 799px) {
.con07_link li a{font-size:1.0em;}
}
.swiper{width:85% !important;}
.swiper-slide{background:#fff;border-radius: 20px;margin-bottom:40px;}
.swiper-slide p{padding:0 10% 50px;font-size:0.6em;}
.swiper-pagination {bottom: 56px !important;}
.swiper-button-next, .swiper-button-prev {color: #060223 !important;}
.swiper-pagination-bullet-active {background: #060223 !important;}

@media (max-width: 799px) {
.swiper-slide p{font-size:0.5em;}
}

/* リンクボタン矢印　*/
.cp_arrows {
  position: relative;
  display: flex;
  height: 40px;
  justify-content: center;
  align-items: center;
}
.cp_arrows .cp_arrow {/*矢印を配置するベースの設定*/
  position: absolute;
  top: 50%;/*着地点(cp_arrowsの高さの50%)*/
  left: 50%;
  transform: translateX(-50%);
  width: 45px;
  height: 10px;
  opacity: 0;
}
.cp_arrows .cp_arrow:first-child {
  animation: arrow-move08 2s ease-in-out infinite;
}
.cp_arrows .cp_arrow:nth-child(2)  {
  animation: arrow-move08 2s 1s ease-in-out infinite;
}
.cp_arrows .cp_arrow:before,
.cp_arrows .cp_arrow:after {/*矢印全体の設定*/
  position: absolute;
  content: '';
  top: 0;
  width: 22px;
  height: 3px;
  background: #060223;
}
.cp_arrows .cp_arrow:before {/*矢印左の線の位置と傾斜*/
  left: 3px;
  transform: rotate(30deg);
}
.cp_arrows .cp_arrow:after {/*矢印左の線の位置と傾斜*/
  right: 3px;
  transform: rotate(-30deg);
}
@keyframes arrow-move08 {
    0% { opacity: 0; top: 30%;/*スタート地点(cp_arrowsの高さの40%)*/}
   70% { opacity: 1;}
  100% { opacity: 0;}
}



.con08{width:800px;background:#F3EFFB;padding-bottom:40px;}
.con08 ul li{width:90%;margin:20px auto;background: linear-gradient(180deg,#F3EFFB 0%,#F3EFFB 36px,#fff 36px,#fff 100%); box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.3);}
.con08 ul li h3{
	color:#6E75D5;
	padding:10px 0;
	text-align:center;
	font-size:1.8em;
}
.con08 ul li p{padding:10px 30px 40px;font-size:0.8em;}
.con_btn{text-align:center;margin: 0 auto;padding:0 0 40px;width: fit-content;}
.con_btn a{display:block;background:#6E75D5;color:#fff;text-align:center;padding:10px 3.0em;text-decoration:none;border-radius:10px;}
.con_btn a:hover{background:#999EE1;}
.con_cnt{text-align:center;}
.con_cnt h4{width: fit-content;margin:0 auto;background:#9995E6;color:#fff;padding:5px 2.0em;}
.con_cnt h4 span{text-decoration:underline;}

@media (max-width: 799px) {
.con08{width:100%;}
.con08 ul li h3{font-size:1.4em;}
}

/* 共通-見出し */
.con_title{background:#54485E;color:#fff;text-align:center;padding:20px 0;}
.con_title h3{font-size:0.9em;font-weight: normal;}
.con_title h2{font-size:1.4em;padding:10px 0;
  align-items: center;
  display: flex;
}
.con_title h2::before,
.con_title h2::after {
  background-color: #fff;
  content: "";
  flex-grow: 1;
  height: 1px;
}
.con_title h2::before {
  margin-right: 20px;
}
.con_title h2::after {
  margin-left: 20px;
}
.con_txt{padding:1em;font-size:0.8em;}



/* よくあるご質問 */
.qa_accordion {
width:90%;
margin: 3em auto;
}
.toggle {
display: none;
}
.option {
position: relative;
margin-bottom: 1em;
}
.qa_title,
.qa_content {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: translateZ(0);
transition: all 0.3s;
}
.qa_title {
padding: 1em 1.5em 1em 1em;
display: block;
color: #fff;
background:#7076AF;
font-weight: bold;
}
.qa_title::after,
.qa_title::before {
content: "";
position: absolute;
right: 1.25em;
top: 1.25em;
width: 2px;
height: 0.75em;
background-color: #fff;
transition: all 0.3s;
}
.qa_title::after {
transform: rotate(90deg);
}
.qa_content {
background:#F1F0F5;
max-height: 0;
overflow: hidden;
}
.qa_content dl{
margin: 0;
padding: 0.5em 1em 1em;
font-size: 0.9em;
line-height: 1.5;
}
.toggle:checked + .qa_title + .qa_content {
max-height: 500px;
transition: all 1.5s;
}
.toggle:checked + .qa_title::before {
transform: rotate(90deg) !important;
}
.qa_content dl{
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;
	flex-wrap: wrap;
	align-items: stretch;	
	width: 100%;
}
.qa_content dl dt{
	padding: 0 2px;
	width: 30px;
	font-weight: bold;
	font-size:1.2em;
	color:#7076AF;
}
.qa_title span{font-size:0.8em;}
.qa_content dl dd{
	padding: 5px;
	width: calc(100% - 30px);
	font-size:0.9em;
}

@media (max-width: 799px) {
.qa_title {padding: 1em 2em 1em 1em;}
.con_txt {padding: 2em;}
}

/* 料金表　*/

.price-box{width:90%;margin:0 auto;background:#F1F0F5;border-radius: 20px;margin-bottom:20px;padding:1em;}
.price-box ul{list-style-type: none;display:flex;flex-wrap: wrap;margin:10px 0;padding:0;}
.price-box ul li{background:#fff;border-radius: 20px;margin: 3px 5px 0 0;padding:3px 1em;font-size:0.8em;}
.price-box h4{font-size:1.4em;margin: 0;}
.price-box p{font-size:0.8em;}
.price-line{text-align:right;font-weight: bold;}
.gua{background:#060223;padding:5px 1em;color:#fff;}
.pra{font-size:1.8em;}

@media (max-width: 799px) {
.price-box h4 {font-size: 1.2em;}
.price-line{font-size: 0.8em;}
.gua {padding:3px 0.8em;}
}

/* お支払方法　*/

.payment{padding:40px 0;}
.payment ul{width:80%;margin:0 auto;padding:20px;background:#F4F3F1;display: flex;flex-wrap: wrap; align-content:flex-start;}
.payment li{width:18%;margin:1%;font-size:0.6em;text-align:center;}
.payment li img{width:80px;}
.notes{width:80%;margin:0 auto;padding:5px 0;font-size:0.5em;}



/* クリニック案内　*/

.info-title{width:94%;margin:20px auto 0;background:#F1F0F5;padding:1.0em;}
.info-title h4{font-size:1.6em;}
.info-title h4 span{font-size:0.8em;}
.info-box{width:94%;margin:0 auto;padding:1.0em;}
.info-box h5{text-align:center;font-size:1.4em;padding:30px 0;}
dl.info-time{
  display: -webkit-flex;
    display: -moz-flex;
    display: flex;
	flex-wrap: wrap;
	align-items: stretch;	
	width: 100%;
font-size:0.9em;
	padding:5px 0;
}

dl.info-time dt{
	padding: 2px;
	width: 150px;
	font-weight: bold;
}
dl.info-time dd{
	padding: 2px;
	width: calc(100% - 150px);
}
.info-box ul{display: flex;flex-wrap: wrap;}
dl.info-doctor{
  display: -webkit-flex;
    display: -moz-flex;
    display: flex;
	flex-wrap: wrap;
	align-items: stretch;	
	width: 100%;
font-size:0.9em;
	padding:8px 0;
}

dl.info-doctor dt{
	padding: 0 20px 0 0;
	width: 180px;
}
dl.info-doctor dd{
	width: calc(100% - 180px);
font-size:0.9em;
}
dl.info-doctor dd h6{font-size:1.4em;}

.info-tel-sp{display:none;}

.info-line{width:80%;margin:20px auto;padding:1em;background:#F1F9F4;display: flex;font-size:0.7em;}
.info-line img{width:50%;margin-right:20px;}
.info-line a{font-size:1.4em;}
.footer{text-align:center;font-size:0.5em;padding-bottom:180px;}


@media (max-width: 799px) {
dl.info-time{flex-direction: column;}
dl.info-time dt {width:100%;font-weight: bold;}
dl.info-time dd{width:100%;}
dl.info-doctor{flex-direction: column;margin:0 0 20px;}
dl.info-doctor dt {width:45%;margin:0 auto;font-weight: bold;}
dl.info-doctor dd{width:100%;}
dl.info-doctor dd h6{text-align:center;}
.info-tel-pc{display:none;}
.info-tel-sp{display:block;}
.info-line{width:100%;font-size:0.6em;flex-direction: column;text-align:center;}
.info-line img{width:65%;margin:0 auto;}
.footer{text-align:center;font-size:0.5em;padding-bottom:150px;}
}



/* 下部固定ボタン　*/


#fixed_btn{width:800px;margin:5px auto 0;position: fixed;left: 50%;transform: translate(-50%);bottom:0;z-index:5;}
.fix_btn img{width:460px !important;margin:5px auto 0;}
.tel-pc{width:100%;background:#59518e;}
#fixed_btn_sp ul{display:none;}

@media (max-width: 799px) {
.tel-pc{display:none;}
#fixed_btn_sp ul{display: flex;justify-content: center;width:100%;background:#59518e;}

#fixed_btn_sp{display: block;width:100%;}
#fixed_btn_sp ul{display: flex;justify-content: center;width:100%;background:#59518e;}

#fixed_btn_sp ul li img{max-width:100%;}
.fix_btn img{width:90%;margin:0 auto;}


#fixed_btn{width:100%;}

}


/* ダークモード　*/

@media (prefers-color-scheme: dark) {
.info{background:#777;}
.info-time,
.info-box h5,
.info-doctor{color: #eee;}
.footer{color: #fff;}
}
