@charset 'utf-8';

/*
Theme Name: kanda-family
Author: minoru kubota
Version: 1.0
*/

/*
---------------------------------------

reset

---------------------------------------
*/

html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a,abbr,acronym,address,big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt,var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video {
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
	margin:0;
	padding:0;
}

body {
	height: 100%;
	width: 100%;
	margin: 0;
	padding: 0;
	position: relative;
}

input, textarea {
	margin: 0;
	padding: 0;
}

input:focus, textarea:focus {
	outline: 0;
}

img {
	max-width: 100%;
	height: auto;
	border: none;
}

ol, ul {
	list-style: none;
}

table {
	width:100%;
	border-collapse: collapse;
	border-spacing:0;
}

table th {
	font-weight:normal;
}

caption, th {
	text-align: left;
}

a:focus {
	outline:none;
}

p,dd,li,address{
	font-style:normal;
}

body small {
	font-size: 1.1rem;
}

.sp {
	display: none !important;
}

.inview {
	opacity: 0;
	visibility: hidden;
	transform: translateY( 4rem );
	transition: all .8s;
}

.inview.show {
	opacity: 1;
	visibility: visible;
	transform: none;
}


/*
---------------------------------------

link

---------------------------------------
*/

a {
	color: var( --base-clor );
	text-decoration: none;
	transition: all .2s;
}

a:hover {
	color: var( --base-clor );
	text-decoration: none;
}


/*
---------------------------------------

clear

---------------------------------------
*/

.clearfix:after {
	content: '.';
	display: block;
	height: 0;
	font-size: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {
	min-height:1px;
}

* html .clearfix {
	height: 1px;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}

.clear,
.both,
.clearboth {
	clear: both;
}

*:first-child+html .clearfix { zoom: 1; } /* IE7 */


/*
----------------------------------------

form

----------------------------------------
*/

input[type=text],
input[type=search],
input[type=tel],
input[type=number],
input[type=url],
input[type=email],
input[type=password],
input[type=date],
textarea, select {
	display: inline-block;
	width: 100%;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	font-size: 1.8rem;
	border: solid 1px #ccc;
	padding: 10px 15px;
	box-sizing: border-box;
	text-align: left;
}

input[type=email],
input[type=tel],
input.l {
	width: 80%;
	margin: 0;
}

textarea {
	margin: 0 !important;
	width: 100% !important;
	height: 20rem !important;
}


/*
---------------------------------------

table

---------------------------------------
*/

table {
	width: 100%;
	table-layout: fixed;
	border-collapse: separate;
	border-spacing: 1px;
	background: var( --base-clor );
	border-radius: 1rem;
}

table th,
table td {
	background: #fff;
	padding: 1rem 1.5rem;
	text-align: center;
	line-height: 1.5;
}

table tr:first-child th:first-child,
table tr:first-child td:first-child {
	border-radius: 1rem 0 0 0;
}

table tr:first-child th:last-child,
table tr:first-child td:last-child {
	border-radius: 0 1rem 0 0;
}

table tr:last-child th:first-child,
table tr:last-child td:first-child {
	border-radius: 0 0 0 1rem;
}

table tr:last-child th:last-child,
table tr:last-child td:last-child {
	border-radius: 0 0 1rem 0;
}

/*
---------------------------------------

h1-h6

---------------------------------------
*/

h1,h2,h3,h4,h5,h6 {
	font-weight: normal;
}

.ttl-01 {
	border-bottom: solid 1px var( --gray-color );
	margin-bottom: 4rem;
	position: relative;
}

.ttl-01 .ttl {
	display: inline-block;
	min-width: 22rem;
	text-align: center;
	letter-spacing: 4px;
	line-height: 1.5;
	border-bottom: solid .4rem var( --accent-color );
	padding: 0 1rem .5rem;
}

.ttl-01 .en {
	font-size: 2rem;
}

.ttl-01 .en::first-letter {
	color: var( --accent-color );
}

.ttl-01 .en.bg {
	position: absolute;
	right: 0;
	bottom: 0;
	font-size: 6.4rem;
	font-weight: 300;
	line-height: 1;
	text-align: right;
	transform: translateY( 18% );
}

.ttl-01 .jp {
	font-size: 2.8rem;
	font-weight: 300;
}

.ttl-01 .jp:first-letter {
	color: var( --accent-color );
}

.ttl-02 h2,
.ttl-02 h3 {
	font-size: 2.4rem;
	letter-spacing: 4px;
	border-left: solid .6rem #B7D79E;
	padding-left: 1.6rem;
	margin: 4rem 0 2rem;
}

.ttl-03 {
	color: var( --main-color );
	background: var( --main-light-color );
	font-size: 2.2rem;
	text-align: center;
	margin-top: 4rem;
}

.pate-ttl {
	padding-bottom: 1.5rem;
	margin-bottom: 1rem;
	border-bottom: solid 1px var( --gray-color );
}

.pate-ttl .jp {
	font-size: 2.8rem;
	line-height: 1.5;
}

.main-img {
	margin: 0 3rem;
	border-radius: 8rem 0 8rem 0;
}

.main-img .wrap {
	max-width: 1600px;
}

.page .main-img {
	margin-top: -6rem;
	line-height: .5;
}

.page .main-img img {
	width: 100%;
	max-height: 480px;
	object-fit: cover;
}


/*
---------------------------------------

btn

---------------------------------------
*/

.btn-01 {
	text-align: center;
	margin: 7rem 0;
}

.btn-01 a {
	display: inline-block;
	margin: 0 auto;
	width: 1040px;
	max-width: 100%;
	font-size: 3.4rem;
	text-align: center;
	padding: 4rem;
	border: solid 1px transparent;
	background-color: #fff;
	background-image: url( assets/img/common/2x/link-img.png );
	background-position: right 2rem bottom 2rem;
	background-size: 88px;
	background-repeat: no-repeat;
}


/*
---------------------------------------

list

---------------------------------------
*/

.list-circle {
	margin: 10px 0 30px 0;
	font-size: 1.6rem;
}

.list-circle li:before {
	content: '';
	display: inline-block;
	width: .8rem;
	height: .8rem;
	border: solid 2px #ff9800;
	margin-right: 5px;
	border-radius: 50%;
}

.contact-list {
	display: table;
	table-layout: fixed;
	width: 100%;
	height: 140px;
	background: #e6e6e6;
	border-collapse: separate;
	border-spacing: 5px;
	margin:  30px auto;
}

.contact-list li {
	display: table-cell;
	background: #fff;
	vertical-align: middle;
}


/*
---------------------------------------

flex

---------------------------------------
*/

.flex {
	-js-display: flex;
	display: -ms-flex;
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
}


/*
---------------------------------------

layout

---------------------------------------
*/

html[lang=ja] {
	margin-top: 0 !important;
}

html{
	font-size: 62.5%;
}

body {
	font-family: "M PLUS 1p", sans-serif;
	font-weight: 300;
	font-size: 1.6rem;
	text-align: center;
	font-feature-settings: 'palt';
	color: var( --base-clor );
	position: relative;
	-webkit-text-size-adjust: 100%;
}

body * {
	box-sizing: border-box;
}

.wrap {
	max-width: 1060px;
	padding: 0 3rem;
	margin: 0 auto;
	text-align: left;
}

#wrapper {
}

#contents {
	text-align: left;
	line-height: 2;
}

strong {
	font-weight: normal;
	color: var( --main-color );
}

.en {
	font-family: Gill Sans, Gill Sans MT, "Open Sans", sans-serif;
}

#wpadminbar {
	top: auto !important;
	bottom: 0;
}

:root {
	--base-clor: #535D5C;
	--main-color: #70AF3E;
	--accent-color: #E96087;
	--main-light-color: #F0F7EB;
	--gray-color: #4D4D4D;
}


/*
---------------------------------------

header

---------------------------------------
*/

#wrapper > header {
	padding: 4.5rem 0;
}

#wrapper > header .wrap {
	max-width: 1600px;
	padding: 0 28rem;
	position: relative;
	text-align: center;
}

#wrapper > header .logo {
	line-height: .5;
	margin-right: auto;
}

#wrapper > header .logo a {
	display: block;
}

.contact-btn-wrap {
	position: absolute;
	top: 50%;
	right: 3rem;
	transform: translateY( -50% );
}

.contact-btn-wrap > div + div {
	margin-top: 1.5rem;
}

.contact-btn-wrap a {
	display: block;
	border: solid 1px var( --main-color );
	border-radius: 1.5rem;
	overflow: hidden;
	position: relative;
	padding: 2rem 2rem 1rem;
}

.contact-btn-wrap a:hover {
	background: var( --main-light-color );
}

.contact-btn-wrap a::before {
	content: '';
	height: .6rem;
	background: var( --main-color );
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
}

.contact-btn-wrap a .num {
	font-size: 2.2rem;
	font-weight: 400;
	color: var( --main-color );
	padding-left: 2rem;
	background: url( assets/img/2x/icon-tel.png ) left center / 14px no-repeat;
}

#g-nav-wrap {
	max-width: 1120px;
}

#g-nav {
	padding: 2rem;
	border-radius: 2rem;
	background: #fff;
	position: relative;
	z-index: 9999;
}

#g-nav .flex {
	width: 100%;
	justify-content: space-around;
	gap: 1rem;
}

#g-nav li {
	flex: 1;
	text-align: center;
}

#g-nav .en {
	display: inline-block;
	padding: .5rem 2rem;
	background: url( assets/img/2x/nav-img.png ) left center / 14px no-repeat;
}

#g-nav .jp {
	font-size: 2rem;
	color: var( --main-color );
}

#sp-btn {
	display: none;
	position: fixed;
	top: 0;
	right: 0;
	cursor: pointer;
}

#sp-btn > div {
	width: 60px;
	height: 60px;
	background: var( --main-color );
	position: relative;
}

#sp-btn span {
	display: inline-block;
	box-sizing: border-box;
	transition: all .5s;
}

#sp-btn span {
	position: absolute;
	left: 15px;
	right: 15px;
	height: 2px;
	background: #fff;
}

#sp-btn span:nth-of-type(1) {
	top: 20px;
}

#sp-btn span:nth-of-type(2) {
	top: 29px;
}

#sp-btn span:nth-of-type(3) {
	top: 38px;
}

#g-nav-wrap.active #sp-btn span:nth-of-type(1) {
	-webkit-transform: translateY(9px) rotate(-45deg);
	transform: translateY(9px) rotate(-45deg);
}
#g-nav-wrap.active #sp-btn span:nth-of-type(2) {
	opacity: 0;
}
#g-nav-wrap.active #sp-btn span:nth-of-type(3) {
	-webkit-transform: translateY(-9px) rotate(45deg);
	transform: translateY(-9px) rotate(45deg);
}

.list-01 li {
	padding-left: 1.6rem;
	position: relative;
}

.list-01 li::before {
	content: '';
	width: 8px;
	height: 8px;
	background: var( --main-color );
	border-radius: 50%;
	position: absolute;
	top: 1.2rem;
	left: 0;
}

.list-01.square li::before {
	width: 6px;
	height: 6px;
	background: transparent;
	border: solid 1px var( --main-color );
	border-radius: 0;
}

.dl-01 dt {
	padding-left: 2rem;
	position: relative;
	color: var( --main-color );
	font-weight: bold;
	text-align: left;
}

.dl-01 dt::before {
	content: '';
	width: 12px;
	height: 12px;
	background: var( --main-color );
	border-radius: 50%;
	position: absolute;
	top: 1rem;
	left: 0;
}

.dl-01 dd {
	padding-left: 1.6rem;
	margin-bottom: 1rem;
	text-align: left;
}

.dl-01 dd .list-01 li {
	padding-left: 1.2rem;
}

.dl-01 dd .list-01 li::before {
	width: 4px;
	height: 4px;
	background: var( --gray-color );
	top: 1.4rem;
}

.dl-01 dd .note {
	font-size: 1.4rem;
}

.bg-color {
	background: var( --main-light-color );
}

.bg-01 {
	background: url( assets/img/2x/bg-01.png ) left bottom / 701px no-repeat;
}

.bg-02 {
	background: url( assets/img/2x/bg-02.png ) right top / 578px no-repeat;
}

.bg-03 {
	background:
		url( assets/img/2x/bg-01.png ),
		url( assets/img/2x/bg-02.png );
	background-position:
		left bottom,
		right top;
	background-size:
		701px,
		578px;
	background-repeat: no-repeat;
}


/*
---------------------------------------

information

---------------------------------------
*/

#information #contents {
	padding-top: 6rem;
}

#information footer {
	background: transparent;
}


/*
---------------------------------------

main-contents

---------------------------------------
*/

#main-contents {
	width: 70%;
}

.single-column #main-contents {
	width: 100%;
}

#main-contents .cat-list {
	display: inline-block;
	margin-right: 5px;
}

#main-contents .cat-list li {
	display: inline-block;
	margin-right: 5px;
}

#main-contents .cat-list li a {
	display: inline-block;
	padding: 0 10px;
	border: solid 1px var( --main-color );
	background: var( --main-color );
	font-size: 1.4rem;
	text-decoration: none;
	color: #fff;
	transition: all .4s;
}

#main-contents .cat-list li a:hover {
	background: #fff;
	color: var( --main-color );
}

#main-contents .post-header {
	border-bottom: solid 1px var( --main-color );
	padding-bottom: 2rem;
	margin-bottom: 3rem;
}

#main-contents .post-header h1 {
	font-size: 2.8rem;
	line-height: 1.5;
	margin-top: 1rem
}

#main-contents .photo {
	text-align: center;
}

#main-contents img {
	max-width: 100%;
	height: auto;
}

.search-ans {
	background: #f3f3f3;
	padding: 10px 20px;
	margin-bottom: 30px;
}

.post a {
	display: inline-block;
	line-height: 1.5;
	border-bottom: solid 1px var( --base-clor );
}

.post .more-link {
	display: block;
	text-align: center;
	width: 16rem;
	margin: 60px 0 0 auto;
	padding: 5px 0;
	background: #f3f3f3;
	border-radius: 4px;
	text-decoration: none;
	position: relative;
	transition: all .4s;
}

.post .more-link:after {
	content: '';
	width: 0;
	height: 0;
	border: solid 4px transparent;
	border-left: solid 4px #333;
	position: absolute;
	right: 1rem;
	top: 50%;
	margin-top: -4px;
	transition: all .4s;
}

.post .more-link:hover {
	background: #000;
	color: #fff;
}

.post-contents .more-link:hover:after {
	border-left: solid 4px #fff;
}

.post-contents p {
	margin-bottom: 3rem;
}

.post-contents h2 {
	font-size: 2.4rem;
	line-height: 1.5;
	padding: 0 0 1rem;
	margin-bottom: 2rem;
	border-bottom: dashed 1px var( --main-color );
}

.post-contents h3 {
	font-size: 2.2rem;
	line-height: 1.5;
	margin-bottom: 2rem;
	padding-left: 1.5rem;
	border-left: solid 5px var( --main-color );
}

.post-contents h4 {
	font-size: 2rem;
	line-height: 1.5;
	margin-bottom: 2rem;
}

.post-contents ul,
.post-contents ol {
	margin-bottom: 40px;
}

.post-contents ul li {
	list-style: disc;
	margin-left: 30px;
}

.post-contents ol li {
	list-style: decimal;
	margin-left: 30px;
}

.post-contents blockquote {
	background: var( --main-light-color );
	padding: 30px 40px 10px;
	margin-bottom: 30px;
	border-radius: 12px;
}

.post-contents blockquote p,
.post-contents blockquote ul,
.post-contents blockquote ol {
	margin-bottom: 20px;
}

.post-list .post {
	padding: 3rem 0;
	border-bottom: dashed 1px var( --gray-color );
	align-items: flex-start;
}

.post-list .post h3 {
	font-size: 2.4rem;
}

.post-list .post time {
	display: inline-block;
	margin-bottom: 1rem;
}

.post-list .post a {
	text-decoration: none;
}

.post-nav {
	margin-top: 40px;
	padding-top: 40px;
	border-top: dashed 1px #898989;
	justify-content: space-between;
	align-items: center;
}

.post-nav .prev {
	width: 30%;
}

.post-nav .back {
	width: 40%;
	text-align: center;
	margin: 0 auto;
	padding: 0 20px;
}

.post-nav .back a {
	display: inline-block;
	border: solid 1px var( --main-color );
	padding: 10px 20px;
	transition: all .2s;
}

.post-nav .back a:hover {
	color: #fff;
	background: var( --main-color );
}

.post-nav .next {
	width: 30%;
	text-align: right;
}

#main-contents .post-list .post h2 {
	line-height: 1.5;
	margin: 5px 0;
}

#main-contents .post-list .post h2 a {
	font-size: 3.4rem;
	color: var( --main-color );
}

.post-list .more {
	text-align: right;
	margin-top: 5px;
}

#main-contents .post-list .more a {
	display: inline-block;
	border: solid 1px var( --main-color );
	color: var( --main-color );
	padding: 0 20px;
	margin-top: 2rem;
	transition: all .2s;
}

#main-contents .post-list .more a:hover {
	background: var( --main-color );
	color: #fff;
}

.pagination ul {
	-js-display: flex;
	display: -ms-flex;
	display: -webkit-flex;
	display: flex;
	justify-content: center;
	align-items: center;
}

.pagination li {
	margin: 0 5px;
}

.pagination a,
.pagination span {
	display: inline-block;
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	border: solid 1px var( --main-color );
	border-radius: 5px;
	color: var( --main-color );
	transition: all .2s;
}

.pagination a:hover,
.pagination .current {
	background: var( --main-color );
	color: #fff;
}


/*
---------------------------------------

sidebar

---------------------------------------
*/

#sidebar {
	width: 30%;
	padding-left: 6rem;
}

#sidebar .side-wrap {
	position: sticky;
	top: 4rem;
}

#sidebar h2 {
	font-size: 2rem;
	border-bottom: solid 1px var( --gray-color );
	padding-bottom: .5rem;
}

#sidebar ul {
	margin-bottom: 40px;
}

#sidebar li {
	border-bottom: dashed 1px var( --gray-color );
}

#sidebar li a {
	display: block;
	padding: 1.5rem 1.5rem 1.5rem 3.5rem;
	position: relative;
}

#sidebar li a:hover {
	background: var( --main-light-color );
}

#sidebar li a::before {
	content: '■';
	color: var( --main-color );
	position: absolute;
	top: 1.5rem;
	left: 1rem;
}


/*
---------------------------------------

footer

---------------------------------------
*/

footer .flex {
	justify-content: space-between;
	padding: 6rem 0 4rem;
}

footer .flex .logo {
	padding-right: 4rem;
	margin-right: auto;
}

.copyright {
	background: var( --main-color );
	color: #fff;
	padding: 1rem 0;
}

.copyright .wrap {
	text-align: center;
}

#page-top {
	position: fixed;
	right: 20px;
	bottom: 20px;
}

#page-top a {
	-js-display: flex;
	display: -ms-flex;
	display: -webkit-flex;
	display: flex;
	justify-content: center;
	align-items: center;
	background: url( assets/img/common/btn-bg.png ) center center / contain no-repeat;
	color: #fff;
	width: 80px;
	height: 80px;
	padding: 20px;
	transition: all .4s;
}

#page-top a:hover {
}


/*
---------------------------------------

home

---------------------------------------
*/

#home .main-img {
	height: 64vh;
	background: url( assets/img/2x/fv-img.png ) center center / cover no-repeat;
	/* padding: 8rem 6rem; */
	padding: 6rem;
	margin-bottom: -6rem;
}

#home .main-img img {
	/* max-height: 32vh; */
	max-height: 24rem;
}

#home .info-box {
	padding: 8rem 0;
}

#home .info-box .ttl-01 .ttl {
	min-width: 20rem;
}

#home .info-box .ttl-01 .jp {
	font-size: 2.4rem;
	font-weight: 300;
}


#home .info-box .info-cont {
	gap: 4rem;
}

#home .info-box .info-cont .cont {
	flex: 1;
}

#home .news + .news {
	margin-top: .5rem;
}

#home .news a {
	display: block;
	align-items: center;
}

#home .news .flex {
	flex-wrap: nowrap;
}

#home .news .time {
	width: 14rem;
	font-size: 1.8rem;
}

#home .news h3 {
	width: calc( 100% - 14rem );
	font-size: 1.8rem;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#home .info-box table {
	margin-bottom: 1rem;
}

#home .info-box table th:first-child {
	width: 40%;
}

#home .about-box {
	position: relative;
	padding: 8rem 0;
}

#home .about-box .cont-wrap {
	gap: 2rem;
	align-items: center;
}

#home .about-box .img {
	flex: 1;
}

#home .about-box .img img {
	width: 100%;
}

#home .about-box .txt {
	flex: 1;
	padding-left: 2rem;
}

#home .about-box .txt h3 {
	font-size: 2.8rem;
	line-height: 1.5;
	letter-spacing: 4px;
	margin-bottom: 2rem;
}

#home .about-box .txt p {
	line-height: 2.5;
}

#home .medical-box {
	padding: 8rem 0;
}

#home .medical-box .ttl-txt {
	margin-bottom: 2rem;
}

.medical-list .flex {
	justify-content: space-around;
}

.medical-list .icon {
	line-height: .5;
	margin-bottom: 1.5rem;
}

.medical-list li {
	width: 48%;
	font-size: 2rem;
	line-height: 1.5;
	text-align: center;
	letter-spacing: 4px;
	margin: 3rem 0;
}

.medical-list li a {
	display: inline-block;
}

.medical-list li .note {
	font-size: 1.6rem;
}

.medical-list li:nth-child( 3n ) span,
.medical-list li:last-child span {
	border-right: solid 1px #9E9E9F;
}

#home .feature-box {
	padding:10rem 0;
}

#home .feature-list .flex {
	gap: 2rem;
}

#home .feature-list .flex li {
	width: calc( ( 100% - 2rem ) / 2 );
	background: #fff;
	border: solid 2px #B9D8A0;
	padding: 4px;
}

#home .feature-list .flex li .flex {
	height: 120px;
	justify-content: center;
	align-items: center;
	font-size: 2.4rem;
	line-height: 1.5;
	text-align: center;
	border: solid 1px #B9D8A0;
}

#home .feature-box .ttl-02 + p {
	padding-left: 2.4rem;
}

#home .feature-box .txt > p {
	padding-left: 2.4rem;
}

#home .feature-box .list-01 {
	padding-left: 2.4rem;
	margin-top: 1rem;
}

#home .feature-box .list-01 li::before {
	background: #B7D79E;
}

#home .feature-box .note {
	display: inline-block;
	font-size: 1.4rem;
	line-height: 1.5;
	padding-left: 1em;
	text-indent: -1em;
}

#home .medical-cont .cont-wrap {
	gap: 0 3rem;
	margin-top: 3rem;
}

#home .medical-cont .cont-wrap .txt {
	width: 60%;
}

#home .medical-cont .cont-wrap .img {
	width: calc( 40% - 3rem );
	text-align: center;
}

#home .notice {
	margin: 3rem 0;
}

.modal-ttl {
	display: block;
	background: #fff;
	border: solid 2px var( --main-color );
	padding: 4px;
}

.modal-ttl > .flex {
	height: 120px;
	justify-content: center;
	align-items: center;
	font-size: 2.4rem;
	line-height: 1.5;
	text-align: center;
	border: solid 1px var( --main-color );
}

body .remodal {
	max-width: 900px;
}

.remodal .modal-ttl > .flex {
	height: 60px;
}

.modal-cont {
	text-align: left;
	line-height: 2;
	margin-top: 2rem;
}

.modal-cont > * {
	margin-top: 1em;
}

.modal-cont h3 {
	color: #74AC3F;
}

.modal-cont .ttl {
	padding-left: 1em;
	position: relative;
}

.modal-cont .ttl::before {
	content: '□';
	position: absolute;
	top: 0;
	left: -4px;
}

#home .access-box {
	padding: 8rem 0 0;
}

#home .access-box .map iframe {
	width: 100%;
	height: 60rem;
	max-height: 50vh;
}

#home footer {
	background: #fff;
}

#home footer .flex {
	padding-top: 4rem;
}


/*
---------------------------------------

information

---------------------------------------
*/

#about .doctor-box {
	padding: 8rem 0 0;
}

#about .doctor-box .doctor-info {
	margin: 6rem 0;
	flex-direction: row-reverse;
}

#about .doctor-box .doctor-info .img {
	width: 320px;
	text-align: right;
	padding-left: 2rem;
}

#about .doctor-box .doctor-info .txt {
	width: calc( 100% - 320px );
}

#about .doctor-box .doctor-info h3 {
	font-size: 2.4rem;
	line-height: 1.5;
	border-bottom: dashed 1px var( --gray-color );
	padding-bottom: .8rem;
	margin-bottom: 2rem;
}

#about .doctor-box .doctor-info h3 span {
	font-size: .7em;
}

#about .doctor-box .doctor-info .list-01 {
	margin-bottom: 1rem;
}

#about .doctor-box .doctor-info .list-01 li::before {
	border-radius: 0;
	border-color: var( --accent-color );
	background: var( --accent-color );
}

#about .medical-box {
	padding: 6rem 0 10rem;
}

#about .medical-box .cont {
	padding: 6rem 0;
	border-bottom: dashed 1px var( --gray-color );
}

#about .medical-box .cont .icon {
	width: 240px;
	padding-right: 2rem;
}

#about .medical-box .cont .txt {
	width: calc( 100% - 240px );
}

#about .medical-box .cont .ttl {
	display: inline-block;
	font-size: 2.4rem;
	font-weight: 300;
	letter-spacing: 4px;
	line-height: 1.5;
	background: var( --main-light-color );
	padding: .4rem 2rem .4rem 4rem;
	margin-bottom: 2rem;
	position: relative;
}

#about .medical-box .cont .ttl::before {
	content: '';
	width: 8px;
	height: 8px;
	background: var( --main-color );
	position: absolute;
	top: calc( 50% - 4px );
	left: 2rem;
}

#about .medical-box .cont .ttl .note {
	font-size: 1.6rem;
}

#about .medical-box .cont-wrap {
	gap: 3rem;
}

#about .medical-box .cont-wrap .read {
	width: calc( 62% - 3rem );
}

#about .medical-box .cont-wrap .read .note {
	color: #3B8AFF;
}

#about .medical-box .cont-wrap .img {
	width: 38%;
}

#about .medical-box .other-wrap {
	padding: 6rem 0 0;
}

#about .recommend-box .list-01 {
	gap: 2rem;
	margin: 2rem 0 4rem;
}

#about .recommend-box .list-01 li {
	width: calc( ( 100% - 2rem ) / 2 );
	border: solid 1px var( --main-color );
	text-align: center;
	padding: 1rem;
}

#about .recommend-box .list-01 li::before {
	position: relative;
	top: 0;
	display: inline-block;
	width: 6px;
	height: 6px;
	vertical-align: middle;
	margin-right: 8px;
	background: var( --main-color );
}

#about .recommend-box .lisk .ttl-03 {
	color: #B28247;
	background: #E8E4CB;
}

#about .recommend-box .lisk .list-01 li {
	border-color: #B28247;
}

#about .recommend-box .lisk .list-01 li::before {
	background: #B28247;
}

#about .cosme-ttl::before {
	display: none;
}

#about .cosme-ttl .ttl-03 {
	font-weight: bold;
	color: #E96287;
	background: #FCEDF4;
	border-radius: 2.2rem;
	margin-left: 1.2rem;
	margin-bottom: 2rem;
}

#about .cosme-h {
	color: #E96287;
}

#about .cosme-h::before {
	background: #E96287;
}

#about .cosme-cont .img {
	text-align: center;
}

#about .cosme-cont .ttl-03 {
	color: #E96287;
	background: #FCEDF4;
}

#about .cosme-cont .list-01 li {
	border-color: #E96287;
}

#about .cosme-cont .list-01 li::before {
	background: #E96287;
}

#hospital {
	padding: 6rem 0;
}

#hospital .img-wrap .img {
	line-height: .5;
	margin-bottom: 2rem;
}

#hospital .img-wrap img {
	width: 100%;
}

#hospital .img-wrap .flex {
	gap: 2rem 6rem;
}

#hospital .img-wrap .flex .img {
	width: calc( ( 100% - 6rem ) / 2 );
}

#hospital .img-wrap .flex .img figcaption {
	line-height: 2;
	padding-left: 1.2rem;
	margin-top: .5rem;
	position: relative;
}

#hospital .img-wrap .flex .img figcaption::before {
	content: '';
	width: 6px;
	height: 6px;
	background: var( --main-color );
	position: absolute;
	top: calc( 50% - 3px );
	left: 0;
}


/*
----------------------------------------

767

----------------------------------------
*/

@media screen and ( min-width: 767px ) {

	#g-nav a:hover {
		color: var( --main-color );
	}

	#wrapper > header .logo a:hover {
		opacity: .7;
	}

	.btn-01 a:hover {
		border: solid 1px var( --main-color );
	}

	#home .info-box .web-yoyaku a:hover {
		background: #E8F4EF url( assets/img/common/2x/yoyaku-bg.png ) left 2rem top 2rem / 33px no-repeat;
	}

}