@charset "UTF-8";
/*
Theme Name: サンプル
Author: 株式会社メックコミュニケーションズ
Author URI: https://www.mec-com.co.jp
Date: 2023-05-01
*/

/*parts
-----------------------------------------------------------------------------------------*/
body{
/*特色*/
	--color_A:#d8efce;/*メインカラー（薄い緑）*/
	--color_B:#95cb88;/*メインカラー濃（濃い緑）*/
	--color_C:#ECA84A;/*アクセントカラー（オレンジ）*/
	--color_D:#FFFBEB;/*薄いアクセントカラー（灰色）*/
	--color_red:#FF0000;/*赤*/
/*em*/
	--color_notice:var(--color_red);
/*テキストリンク*/
	--color_link:#006deb;
/*-------------------------base*/
/*text*/
	--tx_sen:var(--color_A);
	--tx_waku:var(--color_A);
	--tx_kiji:var(--color_A);
	--tx_belt:var(--color_A);
	--tx_line:var(--color_A);
	--tx_bar:var(--color_A);
	--tx_maru:var(--color_B);
/*ya*/
	--ya_tri:var(--color_A);
	--ya_sen:var(--color_A);
	--ya_maru:var(--color_A);
/*btn*/
	--btn:var(--color_B);
/*list*/
	--list_line:#000;
	--list_box:#FFF;
	--list_mark:var(--color_red);
/*sitemap*/
	--sitemap:var(--color_A);
	--sitemap_ya:var(--color_A);
/*parts*/
	--flow_no:var(--color_A);
	--dtbox_tx:#FFF;
	--dtbox_bg:var(--color_A);
	--tab_btn:var(--color_A);
/*etc*/
	--sya:var(--color_A);
}
/*-------------------------------------------------------------------------------------------------特色border_color*/
body .sen_A{border-color:var(--color_A);}
body .sen_B{border-color:var(--color_B);}
body .sen_C{border-color:var(--color_C);}
body .sen_red{border-color:var(--color_red);}
/*-------------------------------------------------------------------------------------------------特色bg*/
.bg_A{background-color:var(--color_A);}
.bg_B{background-color:var(--color_B);}
.bg_C{background-color:var(--color_C);}
.bg_D{background-color:var(--color_D);}
.bg_red{background-color:var(--color_red);}
/*-------------------------------------------------------------------------------------------------特色text_color*/
.tx_A{color:var(--color_A);}
.tx_B{color:var(--color_B);}
.tx_C{color:var(--color_C);}
.tx_red{color:var(--color_tx);}
/*-------------------------------------------------------------------------------------------------特色ya*/
.ya_red::before{border-color:var(--color_red);background-color:var(--color_red);}
.ya_A::before{border-color:var(--color_A);background-color:var(--color_A);}
.ya_B::before{border-color:var(--color_B);background-color:var(--color_B);}
.ya_C::before{border-color:var(--color_C);background-color:var(--color_C);}
/*-------------------------------------------------------------------------------------------------img_position*/
body .img_r{float:right;margin:5px 0 5px 40px}
body .img_l{float:left;margin:5px 40px 5px 0}
body .img_c{text-align:center;margin:30px auto}
@media screen and (max-width:1024px){
body .img_r,
body .img_l,
body .img_c{float:none;text-align:center;margin:15px auto;}
}
/*-------------------------------------------------------------------------------------------------imgbox*/
.imgbox{display:flex;flex-direction:row-reverse;gap:40px;}
.imgbox figure{flex-shrink:0;}
@media screen and (max-width:1024px){
	.imgbox{flex-direction:column;gap:15px;}
	.imgbox figure{margin:0 auto;}
}
/*-------------------------------------------------------------------------------------------------scnone*/
body.scroll .scnone{display:none}
@media print, screen and (min-width:768px){
	body.scroll .pc_scnone{display:none;}
}
@media screen and (max-width:767px){
	body.scroll .sp_scnone{display:none;}
}
/*-------------------------------------------------------------------------------------------------title*/
/*-------------------------title1*/
.title1{
	font-size:3.4rem;
	line-height:1.5;
	font-weight:bold;
	position:relative;
}
@media screen and (max-width: 767px) {.title1{font-size:2.6rem;}}
/*-------------------------title2*/
.title2{
	font-size:2.8rem;
	line-height:1.5;
	font-weight:bold;
	position:relative;
}
@media screen and (max-width: 767px) {.title2{font-size:2.2rem;}}
/*-------------------------title3*/
.title3{
	font-size:2.4rem;
	line-height:1.5;
	font-weight:bold;
	position:relative;
}
@media screen and (max-width: 767px) {.title3{font-size:2rem;}}
/*-------------------------title4*/
.title4{
	font-size:2rem;
	line-height:1.5;
	font-weight:bold;
}
@media screen and (max-width: 767px) {.title4{font-size:1.8rem;}}
/*-------------------------btn*/
.btn{
	justify-content:center;
}
/*-------------------------dtbox*/
.dtbox dt{
	border-radius:5px;
}


/*home
-----------------------------------------------------------------------------------------*/
/*-------------------------pageimg*/
.pageimg{
	height:400px;
	background:url(images/pageimg.jpg) center;
	background-size:cover;
	display:flex;
	justify-content:center;
	align-items:center;
}
.pageimg h1{
	background:rgba(255,255,255,0.8);
	font-size:30px;
	font-family:serif;
	font-weight:bold;
	padding:20px 30px;
}
/*-------------------------greeting*/
.greeting{
	padding-top:30px;
	padding-bottom:60px;
}
.greeting h2{
	text-align:center;
	color:#754C24;
	font-weight:bold;
	font-size:3.6rem;
	margin-bottom:0.5em;
}
@media print, screen and (min-width: 768px) {
.greeting figure{
	position:absolute;
	right:50px;
	top:-120px;
	border-radius:100%;
	overflow:hidden;
}
}
@media screen and (max-width: 767px) {
.greeting figure img{
	min-width:100%;
}
.greeting figure{
	width:min(40vw, 240px);
	height:min(40vw, 240px);
	margin:0 auto 20px auto;
	border-radius:100%;
	overflow:hidden;
}
}
/*-------------------------staff_items*/
.staff_items{
	background:#F2F1E9;
	padding-top:60px;
	padding-bottom:60px;
	text-align:left;
}
.staff_items h2{
	font-size:24px;
	font-weight:bold;
}
.staff_items ul{
	display:flex;
	gap:30px;
}
.staff_items li{
	width:320px;
	background:#FFF;
	padding:20px;
	display:flex;
	flex-direction:column;
}
.staff_items figure{
	margin:-20px -20px 20px -20px;
}
.staff_items figure + p{
	font-size:16px;
	line-height:1.75;
	margin-bottom:0.5em;
}
.staff_items p.name{
	font-weight:bold;
	margin-top:auto;
	text-align:right;
}
@media screen and (max-width: 767px) {
.staff_items ul{
	flex-direction:column;
}
.staff_items li{
	width:100%;
}
.staff_items img{
	min-width:100%;
}
}

/*background
-----------------------------------------------------------------------------------------*/
.background_01{background: url(images/background_01.jpg) center;background-size:cover}
.background_w{background-color:rgba(255, 255, 255, 0.7)}
.background_k{background-color:rgba(0, 0, 0, 0.5);color:#fff}

/*frame_section-----------------------------------------------------------------------------------------*/
.frame_section{
	max-width:1100px;
	margin: 0 auto;
	text-align:left;
}
@media screen and (max-width: 739px){
	.frame_section {padding:0px 20px;}
}

/*imgtextarea
-----------------------------------------------------------------------------------------*/
.imgtextarea {
	max-width:1100px;
	margin: 0 auto;
	padding-top:70px;
	padding-bottom:20px;
}
@media screen and (max-width: 739px){
	.imgtextarea {padding-top:30px;margin-top:20px;}
}
/*-------------------------flexbox*/
.contents-wrap {
	display: flex;
	justify-content: space-between;
	margin-bottom: 50px;
}
.contents-wrap:nth-child(odd) {
	flex-direction: row-reverse;
}
.contents-text {
	width: 60%; /*flex: 2;*/
}
.contents-img {
	width: 35%; /*flex: 1;*/
}
.contents-text h2 {
	margin-bottom: 1.5rem;
	font-size: 24px;
	/*font-weight:bold;*/
	/*text-align:left;*/
}
.contents-text p {
	text-align:left;
}
.contents-img img {
	display: block;
	width: 100%;
	height: auto;
}
@media screen and (max-width: 739px){
	.contents-wrap,
	.contents-wrap:nth-child(odd)  {
		flex-direction: column;
	}
	.contents-text,
	.contents-img {
		width: 100%; /*flex: 1;*/
		padding: 10px 20px;
	}
	/*.contents-text {
		padding: 20px;
	}*/
	.contents-text h2 {
		/*text-align: center;*/
		font-size:20px;
		margin-bottom:10px;
	}
	.contents-text p {
		font-size:14px;
		line-height:1.75;
	}
	.contents-wrap{
		margin-bottom:15px;
	}
}
/*-------------------------btn*/
a.imgtextarea_btn {
	position: relative;
	display: block;
	width: 200px;
	padding: 0.2em;
	text-align: center;
	text-decoration: none;
	color: #FFF;
	background: #ECA84A;
	transition: .4s;
	margin:10px auto 0 auto;
}
a.imgtextarea_btn:hover {
	background-color:#F4CB92;
}
@media screen and (max-width: 739px){
	a.imgtextarea_btn {line-height: 30px;}
}

/*box-list
-----------------------------------------------------------------------------------------*/
.box-list{
	display: flex;
	flex-wrap:wrap;
	justify-content:space-around;
	align-content:flex-start;
	gap: 25px;
	margin-top:70px;
	margin-bottom:70px;
}
.box-list .waku_2,.waku_3,.waku_4{
	padding: 20px;
	border: 1px solid rgba(0, 0, 0, 0.3);
}
/*-- PCの表示列2列 --*/
.box-list .waku_2{
	width:530px;
}
/*-- PCの表示列3列 --*/
.box-list .waku_3{
	width:350px;
}
/*-- PCの表示列4列 --*/
.box-list .waku_4{
	width:250px;
}
/*-------------------------box-list list*/
.box-list ul li {
	font-size: inherit;
	margin-left: 1em;
	font-size: 16px;
}
.box-list ul li::before{
	margin-left: -1em;
	display: inline-block;
	content: '';
	width: 1em;
	height: 1em;
	background: rgba(39,171,217,1);
	border-radius: 50%;
	transform: scale(0.8) translateY(0.1em);
	margin-right: 5px;
}
.box-list .tx {
	margin-top:10px;
}
@media screen and (max-width: 739px){
	.box-list{display: block;margin-top:30px;margin-bottom:30px;}
	.box-list .waku_2{width:100%;margin-bottom:15px;}
	.box-list .waku_3{width:100%;margin-bottom:15px;}
	.box-list .waku_4{width:100%;margin-bottom:15px;}
	.box-list ul li {font-size:14px;line-height:1.75;}
	.box-list .tx{font-size:14px;line-height:1.75;}
}
/*-------------------------box-list btn*/
a.box-list_btn {
	position: relative;
	display: block;
	width: 200px;
	padding: 0.2em;
	text-align: center;
	text-decoration: none;
	color: #FFF;
	background: #CC0000;
	transition: .4s;
	margin:20px auto 0 auto;
}
a.box-list_btn:hover {
	background-color:#E06666;
}
@media screen and (max-width: 739px){
	a.box-list_btn {line-height: 30px;font-size:14px;}
}
/*見出し
-----------------------------------------------------------------------------------------*/
/*-------------------------左寄せ基本 title00-l*/
.title00-l{
	font-weight:bold;
	font-size:20px;
	text-align:left;
}
@media screen and (max-width: 739px){
	a.box-list_btn {line-height: 30px;}
}
/*-------------------------右寄せ基本 title00-r*/
.title00-r{
	font-weight:bold;
	font-size:20px;
	text-align:right;
}
/*-------------------------左寄せ基本 title00-c*/
.title00-c{
	font-weight:bold;
	font-size:20px;
	text-align:center;
}
/*-------------------------中央寄せ下線 title01*/
.title01{
	font-weight:bold;
	font-size:20px;
	text-align:center;
}
.title01::after {
	content: "";
	display: block;
	width: 5em;
	margin: 0 auto;
	height: 0.2em;
	border-bottom: 2px solid #27acd9;
	margin-bottom:20px;
}
/*-------------------------斜め線中央見出し title02*/
/*中央寄せ*/
.title02{
	display: flex;
	flex-wrap: nowrap;
	justify-content: center; 
	align-items: center;
	border:0;
	font-weight:bold;
	font-size:20px;
	margin-bottom: 15px;
}
/*短い左右線*/
.title02::before,
.title02::after {
	content: '';
	width: 25px;
	height: 2px;
	background-color:#27acd9;
/*Lightning見出しデザイン設定のCSS対策*/
	position: unset;
	border: unset;
	margin-left: unset;
	margin-right:unset;
	flex-grow: unset;
}
.title02::before{
	margin-right:14px;
	transform: rotate(60deg);
}
.title02::after {
	margin-left:14px;   
	transform: rotate(-60deg);
}
/*-------------------------中央寄せ短い左右線 title03*/
/*中央寄せ*/
.title03{
	display: flex;
	flex-wrap: nowrap;
	justify-content: center; 
	align-items: center;
	border:0;
	font-weight:bold;
	font-size:20px;
	margin-bottom: 15px;
}
/*短い左右線*/
.title03:before,
.title03:after {
	content: '';
	width: 20px;
	height: 2px;
	background-color:#27acd9;
	 /*Lightning見出しデザイン設定のCSS対策*/
	position: unset;
	border: unset;
	margin-left: unset;
	margin-right:unset;
	flex-grow: unset;
}
.title03:before{
	margin-right:14px;
}
.title03:after {
	margin-left:14px;
}
/*-------------------------背景文字重ね title04*/
.title04{
	position: relative;
	z-index:1;
	font-weight:bold;
	font-size:20px;
	margin-bottom: 20px;
	margin-top:10px;
	text-align:center;
}
/*背景の文字部分*/
.title04::before {
	position: absolute;
	 /*上下中央寄せ*/
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
	color: rgba(0,0,0,0.1);
	font-size: 4rem;
	z-index: -1;
	width:300px;
}
@media screen and (max-width: 739px){
	.title04::before {font-size:2rem;}
}
/*背景の文字変更 必要数コピーして作成する*/
.bgtx01 .title04::before {
	content: '01';
}
.bgtx02 .title04::before {
	content: '02';
}
.bgtx03 .title04::before {
	content: 'STUDY';
}
/*-------------------------1文字目大きく title05*/
.title05 {
	border-bottom: solid 2px #d8efce;
	font-weight:bold;
	font-size:20px;
	padding-bottom:5px;
	margin-bottom: 15px;
	text-align:left;
}
.title05:first-letter {
	color: #95cb88;
	font-size:160%;
}
/*-------------------------吹き出し風 title06*/
/*見出し部分*/
.title06 {
	position:relative;
	padding-bottom:0.5rem;
	border-bottom:1px solid #000;
	font-weight:bold;
	font-size:20px;
	margin-bottom: 25px;
	text-align:center;
}
/*吹き出し部分*/
.title06::before{
	content:'';
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%) skew(-25deg);
	height: 15px;
	width: 15px;
	border-right: 1px solid #000;
	background-color: #fff !important;
	/*Lightning見出しデザイン設定のCSS対策*/
	border-left: none;
	border-top: unset;
	border-bottom: unset;
}

/*カード
-----------------------------------------------------------------------------------------*/
.card-list{
	display: flex;
	flex-wrap:wrap;
	justify-content:space-around;
	align-content:flex-start;
	gap: 25px;
	margin-top:70px;
	margin-bottom:70px;
}
@media screen and (max-width: 739px){
	.card-list{margin-top:50px;margin-bottom:30px;gap:20px;}
}
/*-------------------------カード共通*/
.card_2 li{
/*-- PCの表示列2列 --*/
	width: 530px;
	height: auto;
}
.card_3 li{
/*-- PCの表示列3列 --*/
	width: 350px;
	height: auto;
}
/*-- PCの表示列4列 --*/
.card_4 li{
	width: 250px;
	height: auto;
}
.card__textbox{
	width: 100%;
	height: auto;
	padding: 20px 18px;
	background: #ffffff;
	box-sizing: border-box;
}
.card__textbox > * + *{
	margin-top: 10px;
}
.card__titletext{
	font-size: 20px;
	font-weight: bold;
	line-height: 1.5;
	color: #000;
}
.card__overviewtext{
	font-size: 16px;
	line-height: 1.75;
	color: #000;
}
@media screen and (max-width: 739px){
	.card_2 li,.card_3 li,.card_4 li{width:100%;}
	.card__overviewtext{font-size:14px;line-height:1.75;}
}
/*-------------------------card-list_btn*/
a.card-list_btn {
	position: relative;
	display: block;
	width: 180px;
	padding: 0.2em;
	text-align: center;
	text-decoration: none;
	color: #FFF;
	background: #CC0000;
	transition: .4s;
	margin:20px auto 0 auto;
}
a.card-list_btn:hover {
	background-color:#E06666;
}
@media screen and (max-width: 739px){
	a.card-list_btn {line-height: 30px;font-size:14px;}
}
/*-------------------------card01*/
.card01{
	position:relative;
	box-shadow: 0px 0px 12px rgba(0,0,0,0.3);
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all  0.4s ease;
}
.card01:hover {
	top:1px;
	box-shadow:0px 0px 3px rgba(0,0,0,0.2);
}
/*-------------------------card02*/
.card02{
	overflow: hidden;
	border-radius: 15px;
	position:relative;
	box-shadow: 0px 0px 12px rgba(0,0,0,0.3);
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all  0.4s ease;
}
.card02:hover {
	top:1px;
	box-shadow:0px 0px 3px rgba(0,0,0,0.2);
}
/*-------------------------card03*/
.card03{
  position: relative;

}
.card03 .card__textbox{
	margin-top:-50px;
	width:87%;
	margin: -44px auto 0;
	border-radius:15px;
	background-color:#eef8fc;
	position: relative;
	z-index:19;
}
.card__titletext{
	text-align:center;
	color: #000;
}
.card03 figure img{
	border-radius:15px;
}
/*-------------------------card04*/
.card04{
	position: relative;
	padding-top:20px;

}
.card04 .card__textbox{
	width:100%;
	border-radius:15px;
	background-color:#FFF;
}
.card04 figure img{
	border-radius:100%;
	width:60%;
	height:60%;
	text-align:center;
	margin: auto;
	display: block;
}
@media screen and (max-width: 739px){
	.card04 .card__textbox {padding:20px 0px;}
	.card04 figure img{width:75%;height:75%;}
}
/*-------------------------card05*/
.card05{
	position:relative;
	border:solid 1px #ccc;
	padding-top:20px;
	margin:20px auto;  /*ボックス外側の余白*/
}
.card05 .card__titletext{
    position:absolute;
    top:-17px;  /*上からのタイトルの位置*/
    left:10px;   /*左からのタイトルの位置*/
    padding:0 7px;  /*内側の余白*/
    background:#fff;  /*背景色*/
}
.card05 .card__textbox{
	background-color:#fff;
}
.card05 figure img{
	text-align:center;
	margin: auto;
	display: block;
	padding:5px 20px 0;
}

/*-------------------------card06*/
.card06{
	position:relative;
	border-radius:1px solid eef8fc;
}
.card06 .card__textbox{
	background-color:#eef8fc;
}
.card06 figure img{
	text-align:center;
	margin: auto;
	display: block;
}
.card06 a.card-list_btn {
	width: 100%;
	margin:0;
	padding:10px 0;
}

/*sns-icon
-----------------------------------------------------------------------------------------*/
.sns-icon {
	max-width:1100px;
	margin: 0 auto;
	padding-top:20px;
	padding-bottom:20px;
}
.sns-icon img {
	width:48px;
	height:48px;
}
.sns-icon ul {
	display: flex;
	justify-content: flex-end;
	/*ブランドごとにアイソレーション（不可侵領域）が決められているため変更する場合は要注意。アイコンサイズを大きくする場合はここも大きく。*/
	gap:24px;
	list-style-type: none;
}
@media screen and (max-width: 739px){
	.sns-icon {padding:15px 20px;}
	.sns-icon img {width:32px;height:32px;}
	/*ブランドごとにアイソレーション（不可侵領域）が決められているため変更する場合は要注意。アイコンサイズを大きくする場合はここも大きく。*/
	.sns-icon ul {gap:16px;}
}

/*submenu
-----------------------------------------------------------------------------------------*/
.submenu {
	margin:0 auto;
	margin-top:-70px;/*画像サイズによってマイナスマージンを変更して表示位置を調整*/
	position:relative;
	z-index: 900;
	width:1000px;
}
.submenu_hover a:hover{filter: brightness(120%);} /*暗くしたい場合は100%以下にする*/
@media screen and (max-width: 739px){
	.submenu {margin-top:-50px;padding:0px 20px 0px;width:auto;}/*スマホの時メイン画像と重ねたくない場合はマイナスマージンをとる*/
}

/*floating_ban
-----------------------------------------------------------------------------------------*/
.floating_ban{
	position:fixed;
	right:0;
	top:300px;
	z-index:999;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	text-orientation: upright;
	letter-spacing: 0.2em;
}
.floating_ban a{
	display:inline-block;
	background:#f7a100;
	color:#FFF;
	font-size:18px;
	font-weight:bold;
	line-height:1.1;
	padding:20px 20px 15px 20px;
	border-radius:20px 0 0 20px;
}
.floating_ban a:hover{
	background:#F78500;
}
.floating_ban a:before{
	position: relative;
	display: inline-block;
	content: "";
	width: 24px;
	height: 24px;
	margin-bottom: 10px;
	background: url("images/float_btn_icon.svg") no-repeat;
}
@media screen and (max-width: 739px){
.floating_ban{
	bottom:0;
	top:initial;
	z-index:999;
	width:100%;
	-ms-writing-mode: initial;
	writing-mode: initial;
	text-orientation: initial;
}
.floating_ban a{
	display:block;
	line-height:30px;
	padding:10px 15px;
	border-radius:15px 15px 0 0;
	margin:0 10px;/*marginをとると横幅いっぱいに広がる*/
}
.floating_ban a:before{
	vertical-align: middle;
	padding-right:10px;
	margin-bottom:0px;
}
}

/*frame
-----------------------------------------------------------------------------------------*/
.frame{
	max-width:1200px;
	margin:0 auto;
	text-align:left;
	position:relative;
	padding:0 50px;
}
.frame::after {
	display: block;
	clear: both;
	content: "";
}
@media screen and (max-width: 767px) {.frame{padding:0 20px;}}
/*-------------------------clearfix*/
.clearfix::after{
	display: block;
	clear: both;
	content: "";
}

/*診療時間テーブルth文字センター
-----------------------------------------------------------------------------------------*/
#info .data table th{
	text-align:center;	
}

/*テーブルth、tdのpadding、背景
-----------------------------------------------------------------------------------------*/
table th, table td {
	padding:20px;
}
@media screen and (max-width: 767px) {
	table th, table td {padding:12px 8px;}
}
table th {
	background-color:var(--color_A);
	font-family: 'Kiwi Maru', serif;
}

/*-------------------------flowサイズ微調整*/
.flow_no{
	width:1.8em;
	line-height:1.8em;
}

/*背景ライン画像
-----------------------------------------------------------------------------------------*/
.background_line01{
	background: url(images/bg_line01.png) center;
	background-size:cover;height:80px;
}
.background_line02{
	background: url(images/bg_line02.png) center;
	background-size:cover;height:80px;
}
@media screen and (max-width: 739px){
	.background_line01,
	.background_line02
	{height:40px;}
}

/*w-fullのサイズを追加
-----------------------------------------------------------------------------------------*/
body .w-full{width:100vw;position:relative;left:50%;margin-left:-50vw;}
@media print, screen and (max-width:1200px) and (min-width: 768px){body .w-full{width:1200px;margin-left:-600px;}}
@media screen and (max-width: 767px) {body .w-full{min-width:375px;margin-left:-50vw;}}
@media screen and (max-width: 375px) {body .w-full{margin-left:-187px;}}
	
#contents .accordion.open{
display:flex;
}
	
/*pagetopと重なってしまうので表示位置を調整　★★★floating_banを使わない時はコメントアウトする！！★★★ */
/*@media screen and (max-width: 739px){
	#pagetop a{bottom:60px;}
}*/

/*faqの矢印文字サイズ調整
-----------------------------------------------------------------------------------------*/
.faq .ya_b::before {
	font-size: 16px;
	color:var(--color_A);
}
@media screen and (max-width: 739px){
	.faq p {font-size:14px;line-height:1.75;}
}

/*グラスモーフィズム追加
-----------------------------------------------------------------------------------------*/
.glass{
	background: rgba( 255, 255, 255, 0.5 );
	-webkit-box-shadow: 0 4px 20px rgba(0,113,118, 0.1); /* 影、背景色に近いものを設定するとより馴染む */
  box-shadow: 0 4px 20px rgba(0,113,118 0.1); /* 影、背景色に近いものを設定するとより馴染む*/
	backdrop-filter: blur( 9.5px );/*要素の背後の領域に、ぼかしや色変化のようなグラフィック効果を適用、数字が大きくなるとよくぼける*/
	-webkit-backdrop-filter: blur( 9.5px );/*要素の背後の領域に、ぼかしや色変化のようなグラフィック効果を適用、数字が大きくなるとよくぼける*/
	border: 1px solid rgba( 255, 255, 255, 0.25 );
}

/*グラデーション背景追加
-----------------------------------------------------------------------------------------*/
.gradation {
	 background-image: linear-gradient(90deg, rgba(253, 219, 146, 1), rgba(209, 253, 254, 1));
}

/*fontベースカラー
-----------------------------------------------------------------------------------------*/
body {color:#333333;}

/*--------------------------------------------------------------------------------------------------------------------------------------------margin_top*/
@media screen and (max-width: 767px){
body .pc_mt-50{margin-top:-50px}
	body .pc_mt-60{margin-top:-60px}
	body .pc_mt-70{margin-top:-70px}
	body .pc_mt-80{margin-top:-80px}
	body .pc_mt-90{margin-top:-90px}
	body .pc_mt-100{margin-top:-100px}
	body .pc_mt-110{margin-top:-110px}
	body .pc_mt-120{margin-top:-120px}
	body .pc_mt-130{margin-top:-130px}
}

/*フォントカラーフォントウェイト
-----------------------------------------------------------------------------------------*/
.body{color:#333;}
#topics .title{color:#333;}
.topics li a .kiji{color:#333;}
.card__titletext{color:#333;}
.card__titletext{font-weight:normal;}
#topics article section h1{font-weight:normal;}
.title1,
.title2,
.title3,
.title4{font-weight:normal;}
#kanren h3{font-weight:normal;}
#topics .list h2{font-weight:normal;}
#message h1{font-weight:normal;}
#message .profile figcaption{font-weight:normal;}
#message .profile dt{font-weight:normal;}
.item h1{font-weight:normal;}
#info .access h2{font-weight:normal;}
#sitemap h1{font-weight:normal;}
#siteinfo h1{font-weight:normal;}

/*table text-align-center
-----------------------------------------------------------------------------------------*/
.table-center table td{text-align:center;}
.table-center table th{text-align:center;}

/*font
-----------------------------------------------------------------------------------------*/
body {
  font-family:'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Meiryo, メイリオ, '遊ゴシック Medium', '遊ゴシック体', 'Yu Gothic', YuGothic, 'MS PGothic', Osaka, arial, sans-serif;
}

/*indent
-----------------------------------------------------------------------------------------*/
.ind-1{
	padding-left:1em;
	text-indent:-1em;
}

/*ul dot fontsize
-----------------------------------------------------------------------------------------*/
@media print, screen and (min-width:768px){
	.dot li{font-size:16px;}
}
@media screen and (max-width:767px){
	.dot li{font-size:16px;}
}

/*googlefont
-----------------------------------------------------------------------------------------*/
.gf{
	font-family: "Kiwi Maru", serif;
	font-weight: 400;
	font-style: normal;
}

/*padding追加
-----------------------------------------------------------------------------------------*/
body .pa25{padding:25px}
@media print, screen and (min-width:768px){
	body .pc_pa25{padding:25px}
}

/*text_decoratinon none
-----------------------------------------------------------------------------------------*/
#contents article .tx_none a{text-decoration:none;}

/*text_decoratinon none
-----------------------------------------------------------------------------------------*/
.kage{
	box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all  0.4s ease;
}

/*マイナスマージン追加
-----------------------------------------------------------------------------------------*/
@media print, screen and (min-width: 768px) {
	.pc_mt-100{margin-top:-100px}
	.pc_mt-70{margin-top:-70px}
	.pc_mt-60{margin-top:-60px}
	.pc_mt-50{margin-top:-50px}
	.pc_mt-40{margin-top:-40px}
	.pc_mt-30{margin-top:-30px}
}
@media screen and (max-width: 767px){
	.sp_mt-70{margin-top:-70px;}
	.sp_mt-50{margin-top:-50px;}
	.sp_mt-25{margin-top:-25px;}
}

/*table_center
-----------------------------------------------------------------------------------------*/
.table_center {text-align:center;}

/*tx_deco追加
-----------------------------------------------------------------------------------------*/
.tx_deco_yoyaku,
.tx_deco_yoyaku li{
	line-height:1.5;
	background:url(images/deco_yoyaku.svg) left top 0.125em no-repeat;
	background-size:1.25em;
	padding-left:1.6em;
	/*margin-bottom:0.5em;*/
}
ul.tx_deco_yoyaku{
	background:none;
	padding:0;
	margin:0;
}

.tx_deco_tel,
.tx_deco_tel li{
	line-height:1.5;
	background:url(images/deco_tel.svg) left top 0.125em no-repeat;
	background-size:1.25em;
	padding-left:1.6em;
	/*margin-bottom:0.5em;*/
}
ul.tx_deco_tel{
	background:none;
	padding:0;
	margin:0;
}

.tx_deco_yoyaku_tel,
.tx_deco_yoyaku_tel li{
	line-height:1.5;
	background:url(images/deco_yoyaku_tel.svg) left top 0.125em no-repeat;
	background-size:1.25em;
	padding-left:1.6em;
	/*margin-bottom:0.5em;*/
}
ul.tx_deco_yoyaku_tel{
	background:none;
	padding:0;
	margin:0;
}

.tx_deco_yoyaku_tel2,
.tx_deco_yoyaku_tel2 li{
	line-height:1.5;
	background:url(images/deco_yoyaku_tel2.svg) left top 0.125em no-repeat;
	background-size:1.25em;
	padding-left:1.6em;
	/*margin-bottom:0.5em;*/
}
ul.tx_deco_yoyaku_tel2{
	background:none;
	padding:0;
	margin:0;
}

/*gallery
-----------------------------------------------------------------------------------------*/
.gallery{
	display: flex;
	/*justify-content: center;*/
	flex-wrap: wrap;
	gap:20px;
}
.gallery img{
 	flex-grow: 1;
	object-fit: cover;
	height: 290px;/*ここで画像の高さを揃える*/
	/*border-radius: 10px;角丸の調整*/
}
.g-img{
	overflow:hidden;
	position:relative;
}
.g-img .caption{
	font-size:16px;
	color:#fff;
	padding:20px;
	position:absolute;
	/*bottom:0;文字を画像内の下に表示したい場合↓topをコメントアウトしてこちらを表示させる*/
	top: 0;
}
.g-img .mask{
	width:100%;
	height:100%;
	/*border-radius:10px;角丸の調整*/
	position: absolute;
	top:0;
	left:0;
	opacity: 0;
	background-color: rgba(0,0,0,0.6);/* マスクは半透明 */
	-webkit-transition:	all 0.2s ease;
	transition: all 0.2s ease;
}
.g-img:hover .mask{
	opacity: 1;/* マスクを表示する */
}
@media screen and (max-width: 739px) {
	.gallery img{width:100%;height:auto;}
}

@media screen and (max-width: 739px) {
	.gallery img {
		width: 100%;
		height: auto;
	}
}