@charset "utf-8";


/*ヘッダースタイル*/
.header__inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
height: 100%;
max-width: 3000px;
padding-top: 0px;
position: relative;
padding-bottom: 0px;
transition: all 0.3s;
/*z-index: 1;*/
}
@media screen and (max-width: 767px) {
.header__inner {
padding-top: 0px;
}
}
/*ロゴ以外のメニューの位置調整*/
.header__inner .gmenu {
margin-top: 80px;
transition: all 0.3s;
}
@media screen and (max-width: 1020px) {
.header__inner .gmenu {
display: none;
}
}
/*.js-megaMenu a {
	color: #FFFFFF;
	font-weight: 500;
	font-size: 15px;
	text-align: center;
	text-decoration: none;
	margin-bottom: 0px;
	padding-top: 0px;
	line-height: 3em;
	padding-bottom: 50px;
}*/

.header__inner .gmenu a {
	color: #FFFFFF;
	/*font-weight: 500;
	font-size: 15px;*/
	text-align: center;
	text-decoration: none;
	line-height: 3em;
	position: relative;
	z-index: 1;
}
/*.header__inner .gmenu a span {
	font-size: 12px;
	color: #EEEEEE;
	line-height: 1em;
	font-weight: 300;
	position: absolute;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%);
	z-index: -1;
}*/
.header__inner .gmenu a span {
	font-size: 12px;
	color: #EEEEEE;
	line-height: 1em;
	font-weight: 300;
	position: absolute;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 0;
}


/*診療概要と治療方法のspanの代わり*/
.header__inner .m_onayami a,.header__inner .m_treatment a {
position: relative;
}
.header__inner .m_onayami > a::before {
content: "ONAYAMI";
font-size: 12px;
	color: #EEEEEE;
	line-height: 1em;
	font-weight: 300;
	position: absolute;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%);
	z-index: -1;
}
.header__inner .m_treatment > a::before {
content: "TREATMENT";
font-size: 12px;
	color: #EEEEEE;
	line-height: 1em;
	font-weight: 300;
	position: absolute;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%);
	z-index: -1;
}




.header__inner a {
color: #FFFFFF;
font-weight: 500;
}
.header__nav {
padding-top: 0px;
padding-bottom: 0px;
}
.header__navList {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
line-height: 60px;
}
.header__navItemLink {
position: relative;
display: inline-block;
z-index: 1;
padding-top: 0;
padding-right: 25px;
padding-left: 25px;
font-size: 15px;
font-weight: 500;
transition: all 0.3s;
padding-bottom: 30px;
}
.header__navItemLink::after {
	visibility: hidden;
	content: "";
	position: absolute;
	right: 0;
	left: 0;
	-webkit-transform: scaleX(1);
	transform: scaleX(1);
	-webkit-transform-origin: 0 50%;
	transform-origin: 0 50%;
	-webkit-transition: .3s;
	transition: .3s;
	bottom: -15px;
	opacity: 0;
	z-index: 1;
	/*width: 80%;*/
	margin-left: auto;
	margin-right: auto;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background-color: #FFFFFF;
}

/*現在地とhoverの設定*/
.header__navItemLink:hover::after,.megaMenu__link.is-active::after {
visibility: visible;
-webkit-transform: scaleX(1);
transform: scaleX(1);
opacity: 1;
bottom: 0px;
}


/* メガメニュースタイル */
.megaMenu__link.is-active::after {
/*-webkit-transform: scale(1, 1);
transform: scale(1, 1);*/
}
.megaMenu__link.is-active + .megaMenu__content {
opacity: 1;
visibility: visible;
}

/*メガメニューの下層コンテンツを表示する位置*/
.megaMenu__content {
opacity: 0;
visibility: hidden;
position: absolute;
top: 160px;
left: 0;
width: 100%;
/*background-color: #EDEDED;*/
-webkit-transition: opacity 0.3s, visibility 0.3s;
transition: opacity 0.3s, visibility 0.3s;
z-index: 0;
}

.megaMenu__inner {
	/*width: 100%;*/
	max-width: 1200px;
	/*margin-top: 120px;*/
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 0;
	padding-top: 20px;
	padding-right: 20px;
	padding-left: 20px;
	padding-bottom: 20px;
}

.megaMenu__title {
padding-left: 20px;
}

.megaMenu__titleLink {
position: relative;
font-size: 20px;
-webkit-transition: opacity 0.3s;
transition: opacity 0.3s;
}
.megaMenu__titleLink:hover, .megaMenu__titleLink:focus {
opacity: 0.7;
}
.megaMenu__titleLink::before {
content: "";
position: absolute;
top: 50%;
left: -14px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
display: block;
height: 12px;
width: 8px;
}

.megaMenu__list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}

.megaMenu__item {
padding-left: 20px;
}

.megaMenu__itemLink {
position: relative;
font-size: 18px;
font-weight: 500;
-webkit-transition: opacity 0.3s;
transition: opacity 0.3s;
}
.megaMenu__itemLink:hover, .megaMenu__itemLink:focus {
opacity: 0.7;
}
.megaMenu__itemLink::before {
content: "";
position: absolute;
top: 50%;
left: -14px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
display: block;
background-color: #ffffff;
width: 8px;
height: 8px;
border-radius: 50%;
}

.megaMenu__subItemLink {
position: relative;
font-weight: 500;
-webkit-transition: opacity 0.3s;
transition: opacity 0.3s;
}
.megaMenu__subItemLink:hover, .megaMenu__subItemLink:focus {
opacity: 0.7;
}
.megaMenu__subItemLink::before {
content: "";
position: absolute;
top: 50%;
left: -14px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
display: block;
background-color: #ffffff;
width: 4px;
height: 4px;
border-radius: 50%;
}



/*Mega　サービス2*/
.mg_service2 {
display: grid;
gap: 10px;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.mg_service2 .item {
}
.mg_service2 .item a {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	height: 4em;
	background-color: #FFFFFF;
	transition: all 0.3s;
	border-radius: 10px;
	font-weight: 300;
}
.mg_service2 p {
font-weight: 300;
font-size: 13px;
color: #444444;
line-height: 1.5em;
text-align: center;
}
.mg_service2 .item a:hover p {
color: #FFFFFF;
}
.mg_service2 .item a:hover {
text-decoration: none;
background-color: rgba(77,152,94,1.00);
}
@media screen and (max-width: 767px) {
.mg_service2 {
gap: 5px;
grid-template-columns: 1fr;
}
.mg_service2 .item a {
height: 4em;
}
.mg_service2 p {
font-size: 3.5vw;
}
}





/* ---------------------------------------------------------------- *
ブロックエディタ　投稿ページ用の設定
* ---------------------------------------------------------------- */
/*.post {
_zoom: 1;
overflow: hidden;
margin-top: 0px;
margin-right: 0px;
margin-left: 0px;
margin-bottom: 50px;
clear: both;
padding: 0px;
}
.post h1.blog_t{
font-size: 24px;
padding-top: 10px;
padding-bottom: 10px;
font-weight: bold;
margin-bottom: 10px;
border-bottom: 1px solid #989898;
}
.post div.date {
margin-bottom: 30px;
font-size: 14px;
color: #98998;
line-height: 1.5em;
text-align: right;
}
.post p {
margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
.post {
margin-bottom: 20px;
}
.post h1.blog_t{
font-size: 18px;
}
.post div.date {
margin-bottom: 15px;
font-size: 13px;
}
}*/

/*==================================================
機能編 7-1-47	矢印が右に移動して背景がつく 
===================================*/

.btnarrow5{
/*矢印の基点とするためrelativeを指定*/
position: relative;
/*ボタンの形状*/
/*border: 1px solid #555;*/
padding: 8px 30px;
display: inline-block;
text-align: center;
text-decoration: none;
color: #333;
outline: none;
/*アニメーションの指定*/
transition: all .2s linear;
font-size: 13px;
background:#EEE;
}
.btnarrow5.wtv{
color: #FFF;
background:#333;
}
.btnarrow5:hover{
background:#DDDDDD;
/*color:#fff;*/
}
.btnarrow5.wtv:hover{
background:#444444;
}
/*矢印と下線の形状*/
.btnarrow5::before{
content:"";
/*絶対配置で下線の位置を決める*/
position: absolute;
top:49%;
right:-28px;
/*下線の形状*/
width:30px;
height:1px;
background:#000;
/*アニメーションの指定*/
transition: all .2s linear;
}
.btnarrow5.wtv::before,.btnarrow5.wtv::after{
background:#FFF;
}
.btnarrow5::after{
content:"";
/*絶対配置で矢印の位置を決める*/
position: absolute;
top: 24%;
right: -21px;
/*矢印の形状*/
width:1px;
height:12px;
background:#000;
transform:skewX(45deg);
/*アニメーションの指定*/
transition: all .2s linear;
}

/*hoverした際の移動*/
.btnarrow5:hover::before{
right:-32px;
}

.btnarrow5:hover::after{
right:-25px;
}
@media screen and (max-width: 767px) {
.btnarrow5{
padding: 8px 15px;
font-size: 12px;
}
.btnarrow5::before{
top:50%;
right:-25px;
}
}



/* 4-1 ふわっ（下から） */

.fadeUp{
animation-name: fadeUpAnime;
animation-duration:0.7s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeUpAnime{
from {
opacity: 0;
transform: translateY(50px);
}

to {
opacity: 1;
transform: translateY(0);
}
}

/* 4-1 ふわっ（上から）*/

.fadeDown{
animation-name: fadeDownAnime;
animation-duration:0.7s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeDownAnime{
from {
opacity: 0;
transform: translateY(-50px);
}

to {
opacity: 1;
transform: translateY(0);
}
}


/* 左から */

.fadeLeft{
animation-name:fadeLeftAnime;
animation-duration:0.7s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeLeftAnime{
from {
opacity: 0;
transform: translateX(-50px);
}

to {
opacity: 1;
transform: translateX(0);
}
}


/* 右から */

.fadeRight{
animation-name:fadeRightAnime;
animation-duration:0.7s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeRightAnime{
from {
opacity: 0;
transform: translateX(50px);
}

to {
opacity: 1;
transform: translateX(0);
}
}


/* スクロールをしたら出現する要素にはじめに透過0を指定　*/

.fadeInTrigger,
.fadeUpTrigger,
.fadeDownTrigger,
.fadeLeftTrigger,
.fadeRightTrigger{
opacity: 0;
}


/*==================================================
ボンッ、ヒュッ
===================================*/

/* 拡大 */
.zoomIn{
animation-name:zoomInAnime;
animation-duration:0.7s;
animation-fill-mode:forwards;
}

@keyframes zoomInAnime{
from {
transform: scale(0.6);
opacity: 0;
}

to {
transform: scale(1);
opacity: 1;
}
}

/* 縮小 */
.zoomOut{
animation-name:zoomOutAnime;
animation-duration:0.7s;
animation-fill-mode:forwards;
}

@keyframes zoomOutAnime{
from {
transform: scale(1.2);
opacity: 0;
}

to {
transform:scale(1);
opacity: 1;
}
}

/* スクロールをしたら出現する要素にはじめに透過0を指定　*/

.zoomInTrigger,
.zoomOutTrigger{
opacity: 0;
}


/*== 4-6　じわっ（ぼかしから出現） ==*/

.blur{
animation-name: blurAnime;
animation-duration:1s;
animation-fill-mode:forwards;
}
@keyframes blurAnime{
from {
filter: blur(10px);
transform: scale(1.02);
opacity: 0;
}
to {
filter: blur(0);
transform: scale(1);
opacity: 1;
}
}

/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.blurTrigger{
opacity: 0;
}



/*スクロールトリガー*/
/*TXTエフェクト　背景が流れる*/
.txbg .bg-wrap {
position: relative;
display: inline-block;
margin-top: 5px;
/*font-size: 30px;*/
}
.txbg.is-active .bg-wrap::before {
animation: txbg 4s cubic-bezier(0.22, 1, 0.36, 1) forwards;
background-color: rgba(0,0,0,0.70);
content: '';
position: absolute;
top: 0;
left: 0;
z-index: 1;
width: 100%;
height: 100%;
transform-origin: left center;
}
.txbg .bg-wrap .inn {
color: #fff;
display: inline-block;
/*font-size: 36px;*/
font-weight: bold;
padding: 5px 15px;
position: relative;
z-index: 1;
}

@keyframes txbg {
0% {
opacity: 0;
transform: scaleX(0) translateX(-5%);
}
30% {
transform: scaleX(1) translateX(0);
}
100% {
transform: scaleX(1) translateX(0);
}
30%, 100% {
opacity: 1;
}
}













/*Not Found*/
.NotF{
width: 100%;
margin-top: 0px;
margin-bottom: 0px;
clear: both;
padding-top: 100px;
padding-bottom: 100px;
position: relative;
text-align: center;
}
.NotF h1{
font-size: 55px;
font-weight: bold;
padding-bottom: 50px;
color: #444444!important;
line-height: 1.3em;
}
.NotF h1 span{
font-size: 25px;
font-weight: bold;
display: block;
color: #989898;
}
.NotF p{
font-size: 16px;
color: #444444;
}
.NotF p.btn a{
padding-top: 10px;
padding-bottom: 10px;
display: block;
margin-top: 50px;
background-color: #2D2D2D;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
/*-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;*/
color: #FFFFFF;
}
.NotF p.btn{
width: 30%;
margin-left: auto;
margin-right: auto;
}
.NotF p.btn a:hover{
background-color: #989898;
}
@media screen and (max-width: 767px) {
.NotF{
padding-top: 10%;
padding-bottom: 10%;
}
.NotF h1{
font-size: 35px;
padding-bottom: 30px;
line-height: 1.3em;
}
.NotF h1 span{
font-size: 17px;
}
.NotF p{
font-size: 14px;
text-align: left;
}
.NotF p br{
display: none;
}
.NotF p.btn{
width: 80%;
text-align: center;
}
}

/*ユーチューブ*/
.youtube {
width: 100%;
padding-top: 56.25%;
position: relative;
top: 0;
left: 0;
}
.youtube iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}




/*ブログナビ*/
#event_nav {
overflow: hidden;
}

#event_nav ul {
position: relative;
left: 50%;
float: left;
}

#event_nav ul li {
position: relative;
left: -50%;
float: left;
padding-top: 10px;
padding-bottom: 10px;
margin-bottom: 10px;
}
#event_nav ul li i.fa{
margin-left: 10px;
}
#event_nav ul li a{
color: #000000;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 30px;
padding-right: 30px;
margin-right: 10px;
margin-left: 10px;
margin-top: 0px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
border-radius: 0px;
font-size: 12px;
}
#event_nav ul li.blog a{
background-color: #E7E0AA;
}
#event_nav ul li.news a{
background-color: #99CDFF;
}
#event_nav ul li.works a{
background-color: #8EC21F;
}
/*
#event_nav ul{
}
#event_nav ul li{
float: left;
margin-right: 10px;
margin-left: 10px;
margin-bottom: 20px;
}
#event_nav ul li i.fa{
margin-left: 10px;
}
#event_nav ul li a{
color: #000000;
background-color: #E7E0AA;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 20px;
padding-right: 20px;
}
*/
@media screen and (max-width: 767px) {
#event_nav ul li a{
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
margin-right: 10px;
margin-left: 10px;
margin-top: 0px;
}
}


/*インデント*/
p.indent-1 {
padding-left:1em;
text-indent:-1em;
}


/*ナンバリング*/
.list_num {
_zoom: 1;
overflow: hidden;
clear: both;
margin-right: auto;
margin-bottom: 20px;
margin-left: auto;
width: 100%;
margin-top: 20px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding-top: 50px;
padding-bottom: 30px;
background-color: rgba(241,241,241,0.60);
}
.list_num ol {
counter-reset: my-counter;
list-style: none;
padding: 0px;
margin-right: auto;
margin-left: auto;
max-width: 900px;
}
.list_num ol li {
margin-bottom: 20px;
padding-left: 0px;
position: relative;
padding-right: 0px;
float: left;
width: 46%;
margin-left: 2%;
margin-right: 2%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.list_num ol li:before {
content: counter(my-counter);
counter-increment: my-counter;
background-color: #0F4C97;
color: #ffffff;
display: block;
float: left;
line-height: 30px;
margin-left: 0px;
text-align: center;
height: 30px;
width: 30px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
border-radius: 0px;
margin-right: 10px;
}
.list_num ol li h3 {
font-size: 16px;
font-weight: bold;
}
.list_num ol li p {
}
.list_num ol li h3.indent {
margin-bottom: 10px;
position: relative;
font-size: 18px;
font-weight: bold;
padding-left:3em;
text-indent:0em;
}

@media screen and (max-width: 767px) {
.list_num {
margin-bottom: 20px;
padding-top: 25px;
padding-right: 25px;
padding-left: 25px;
padding-bottom: 15px;
}
.list_num ol li {
margin-bottom: 20px;
float: none;
width: 100%;
margin-left: 0%;
margin-right: 0%;
}
.list_num ol li h3.indent {
font-size: 14px;
padding-top: 2px;
line-height: 1.8em;
}
}


.list_num2 {
_zoom: 1;
overflow: hidden;
clear: both;
margin-right: auto;
margin-bottom: 40px;
margin-left: auto;
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
padding-top: 50px;
padding-right: 50px;
padding-left: 50px;
box-sizing: border-box;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
padding-bottom: 30px;
background-color: rgba(241,241,241,0.60);
}
.list_num2 ol {
counter-reset: my-counter;
list-style: none;
padding: 0px;
margin-bottom: 10px;
clear: both;
}
.list_num2 ol li {
margin-bottom: 15px;
padding-left: 0px;
position: relative;
float: left;
width: 50%;
margin-left: 0%;
margin-right: 0%;
}
.list_num2 ol li:before {
content: counter(my-counter);
counter-increment: my-counter;
background-color: #0F4C97;
color: #FFFFFF;
display: block;
float: left;
line-height: 30px;
margin-left: 0px;
text-align: center;
height: 30px;
width: 30px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
margin-right: 10px;
}
.list_num2 ol li p.indent {
padding-left:40px;
text-indent:0px;
}
.list_num2 ol li p strong{
font-weight: bold;
}
@media screen and (max-width: 767px) {
.list_num2 {
margin-bottom: 20px;
padding-top: 25px;
padding-right: 25px;
padding-left: 25px;
padding-bottom: 15px;
}
.list_num2 ol li {
margin-bottom: 15px;
padding-left: 0px;
position: relative;
float: left;
width: 100%;
margin-left: 0%;
margin-right: 0%;
}
}


.list_num3 {
clear: both;
margin-right: auto;
margin-bottom: 50px;
margin-left: auto;
width: 100%;
margin-top: 20px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.list_num3 ol {
counter-reset: my-counter;
list-style: none;
padding: 0px;
margin: 0px;
}
.list_num3 ol li.number {
margin-bottom: 15px;
padding-left: 0px;
position: relative;
}
.list_num3 ol li.number:before {
content: counter(my-counter);
counter-increment: my-counter;
background-color: #E7E7E7;
display: block;
float: left;
line-height: 30px;
margin-left: 0px;
text-align: center;
height: 30px;
width: 30px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
margin-right: 10px;
}
.list_num3 ol li.number.az:before {
content: counter(my-counter,lower-alpha);
counter-increment: my-counter;
background-color: #E7E7E7;
display: block;
float: left;
line-height: 30px;
margin-left: 0px;
text-align: center;
height: 30px;
width: 30px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
margin-right: 10px;
}
.list_num3 ol li.number.az2:before {
content: counter(my-counter,upper-alpha);
counter-increment: my-counter;
background-color: #E7E7E7;
display: block;
float: left;
line-height: 30px;
margin-left: 0px;
text-align: center;
height: 30px;
width: 30px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
margin-right: 10px;
}
.list_num3 ol li p.indent {
padding-left:40px;
text-indent:0px;
}
@media screen and (max-width: 767px) {

}

/*ドット*/
.list_dot {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin-top: 0px;
padding: 30px;
background-color: #FEF9E5;
margin-bottom: 50px;
}
.list_dot ul {
list-style: none;
padding-top: 0px;
padding-bottom: 0px;
margin: 0px;
padding-left: 20px;
}
.list_dot ul li {
font-size: 14px;
margin-bottom: 5px;
list-style-type: none;
position: relative;
float: left;
padding-right: 50px;
line-height: 2em;
}
.list_dot ul li::after {
display: block;
content: '';
position: absolute;
top: 0.5em;
left: -1.3em;
width: 12px;
height: 12px;
background-color: #FABE00;
border-radius: 100%;
}
.list_dot ul:after {
height: 0;
visibility: hidden;
content: ".";
display: block;
clear: both;
}
@media screen and (max-width: 767px) {
.list_dot {
margin-right: auto;
margin-left: auto;
padding: 20px;
}
.list_dot ul li {
float: none;
padding-right: 0px;
font-size: 13px;
}
}



/*外部リンク　アイコン設定*/
i.fa-external-link {
margin-left: 10px;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
a:hover i.fa-external-link{
margin-left: 15px;
color: #FF0004;
}

/*reCAPTCHA　ロゴの場所を変更*/
.grecaptcha-badge {
bottom: 0px !important;
}




/*アウトライン*/
.flex_Line {
_zoom: 1;
overflow: hidden;
clear: both;
margin-top: 0;
margin-right: 0;
margin-left: 0;
padding: 0;
margin-bottom: 100px;
border: 1px solid #DDDDDD;
}
.flex_Line ul {
list-style: none;
padding: 0px;
margin: 0px;
}
.flex_Line li{
display: flex;
display: -webkit-flex;
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding-top: 10px;
padding-bottom: 10px;
margin: 0;
border-bottom: 1px solid #DDDDDD;
}
.flex_Line li:last-child {
border-bottom: none;
}
.flex_Line h2{
padding-left: 20px;
border-right: 1px solid #DDDDDD;
}
.flex_Line p{
padding-top: 0;
padding-right: 0;
padding-bottom: 0!important;
padding-left: 20px!important;
}
.flex_Line li .txt{
width: 22%;
margin: 0;
padding: 0;
font-weight: bold;
}
.flex_Line li .txt2{
margin: 0;
padding: 0;
width: 78%;
}

@media screen and (max-width: 767px) {
.flex_Line {
margin-bottom: 50px;
}
.flex_Line h2{
padding-left: 10px;
font-size: 3vw;
}
.flex_Line p{
font-size: 3vw;
padding-left: 10px!important;
}
}



/*==================================================
機能編 5-1-20　クリックしたら円形背景が拡大（右上から）
===================================*/

/*アクティブになったエリア*/
#g-nav.panelactive{
/*position:fixed;にし、z-indexの数値を大きくして前面へ*/
position:fixed;
z-index: 10;
/*z-index: 999;*/
top: 0;
width:100%;
height: 100vh;
}

/*丸の拡大*/
.circle-bg{
position: fixed;
z-index: 3;
/*丸の形*/
width: 100px;
height: 100px;
border-radius: 50%;
background-color: #EFEFEF;
/*丸のスタート位置と形状*/
transform: scale(0);/*scaleをはじめは0に*/
right: -20px;
top: -20px;
transition: all .5s;/*0.6秒かけてアニメーション*/
}

.circle-bg.circleactive{
transform: scale(50);/*クラスが付与されたらscaleを拡大*/
}

/*ナビゲーションの縦スクロール*/
#g-nav-list{
display: none;/*はじめは表示なし*/
/*ナビの数が増えた場合縦スクロール*/
position: fixed;
z-index: 10;
/*z-index: 999;*/
width: 100%;
height: 100vh;
overflow: auto;
-webkit-overflow-scrolling: touch;
}

#g-nav.panelactive #g-nav-list{
display: block; /*クラスが付与されたら出現*/
}

/*ナビゲーション*/
/*#g-nav ul {
opacity: 0;
position: absolute;
z-index: 999;
top:50%;
left:50%;
transform: translate(-50%,-50%);
}
#g-nav.panelactive ul {
opacity:1;
}*/

/* 背景が出現後にナビゲーション li を表示※レイアウトによって調整してください。不必要なら削除*/
#g-nav.panelactive ul li{
animation-name:gnaviAnime;
animation-duration:1s;
animation-delay:.2s;/*0.2 秒遅らせて出現*/
animation-fill-mode:forwards;
opacity:0;
}
@keyframes gnaviAnime{
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}




/*==================================================
5-2-6 3本線が回転して×に
===================================*/

/*ボタン外側*/
.openbtn{
	position: fixed;
	background-color: #4D985F;
	top: 20px;
	right: 25px;
	z-index: 9000;
	cursor: pointer;
	width: 52px;
	height: 52px;
	overflow: hidden;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
}
@media screen and (max-width: 767px) {
.openbtn{
top:15px;
right: 10px;    
/*width: 40px;
height: 40px;*/
}
}

/*ボタン内側*/
.openbtn span{
display: inline-block;
transition: all .4s;
position: absolute;
left: 15px;
height: 2px;
border-radius: 0px;
background: #FFF;
}


.openbtn span:nth-of-type(1) {
top:18px;	
width: 38%;
}

.openbtn span:nth-of-type(2) {
top:25px;
/*width: 35%;*/
width: 38%;
}

.openbtn span:nth-of-type(3) {
top:32px;
/*width: 20%;*/
width: 38%;
}

/*activeクラスが付与されると線が回転して×になる*/

.openbtn.active span:nth-of-type(1) {
top: 19px;
left: 17px;
transform: translateY(6px) rotate(-135deg);
width: 38%;
}

.openbtn.active span:nth-of-type(2) {
opacity: 0;
}

.openbtn.active span:nth-of-type(3){
top: 31px;
left: 17px;
transform: translateY(-6px) rotate(135deg);
width: 38%;
}



/* アニメーションの開始を遅らせるCSS*/

.delay-time05{
animation-delay: 0.5s;
}

.delay-time1{
animation-delay: 1s;
}

.delay-time15{
animation-delay: 1.5s;
}

.delay-time2{
animation-delay: 2s;
}

.delay-time25{
  animation-delay: 2.5s;
}




/*flex流れ*/
.flex_flow {
margin-top: 0;
padding: 0;
width: 100%;
margin-left: auto;
margin-right: auto;
margin-bottom: 100px;
}
.flex_flow ul {
list-style: none;
padding: 0px;
margin: 0px;
}
.flex_flow li{
	display: flex;
	display: -webkit-flex;
	width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding-top: 25px;
	padding-bottom: 25px;
	border-bottom: 1px solid #CCCCCC;
	line-height: 2em;
}
.flex_flow li:first-child {
border-top: 1px solid #CCCCCC;
}
.flex_flow li .txt{
width: 15%;
}
.flex_flow li .txt h3{
	font-weight: 500;
	font-size: 20px;
	color: #2A7B3C;
}
.flex_flow li .txt2{
width: 85%;
}
@media screen and (max-width: 767px) {
.flex_flow {
margin-bottom: 50px;
}
.flex_flow li{
	padding-top: 20px;
	padding-bottom: 20px;
}
.flex_flow li .txt{
width: 20%;
}
.flex_flow li .txt h3{
font-size: 3.8vw;
}
.flex_flow li .txt2{
width: 80%;
}
}




/*ブロックエディタ　追加CSS*/
.B_editor h1 {
font-size: 40px;
padding-bottom: 0.5em;
}
.B_editor h2 {
font-size: 30px;
padding-bottom: 0.5em;
}
.B_editor h3 {
font-size: 20px;
padding-bottom: 0.5em;
}
.B_editor h4 {
font-size: 16px;
padding-bottom: 0.5em;
}
.B_editor p {
margin: 0 0 1em;
font-size: 14px;
line-height: 2.2em;
}
.wp-block-image {
margin:0 0 2em;
}
.wp-block-audio {
margin:0 0 2em;
}
.wp-block-embed {
margin:0 0 2em;
}
.wp-block-table {
margin:0 0 2em;
}
.wp-block-video {
margin:0 0 2em;
}
.wp-block-media-text {
margin:0 0 2em;
}
.wp-block-gallery {
margin:0 0 2em;
}
.B_editor ul {
list-style: none;
padding-top: 0px;
padding-bottom: 0px;
margin-bottom: 1em;
padding-left: 25px;
}
.B_editor ul li {
font-size: 14px;
list-style-type: none;
position: relative;
padding-bottom: 10px;
}
.B_editor ul li::after {
display: block;
content: '';
position: absolute;
top: 0.8em;
left: -1.5em;
width: 10px;
height: 10px;
background-color: #000000;
border-radius: 100%;
}
.B_editor ul:after {
height: 0;
visibility: hidden;
content: ".";
display: block;
clear: both;
}
.wp-block-button__link {
color: #fff!important;
}
.wp-block-file__button {
color: #fff!important;
}
.B_editor a {
	text-decoration: underline;
	color: #004ADE;
}

@media screen and (max-width: 767px) {
.B_editor ul li {
font-size: 3.5vw;
}
.B_editor ul li::after {
top: 0.7em;
}
.has-x-large-font-size {
font-size: 6.8vw !important;
padding-bottom: 0.5em;
}
.has-large-font-size {
font-size: 5.3vw!important;
padding-bottom: 0.5em;
}
.B_editor h1 {
	font-size: 6.8vw;
	padding-bottom: 0.5em;
	line-height: 1.5em;
}
.B_editor h2 {
font-size: 5.3vw;
padding-bottom: 0.5em;
line-height: 1.5em;
}
.B_editor h3 {
font-size: 4.4vw;
padding-bottom: 0.5em;
line-height: 1.6em;
}
.B_editor h4 {
font-size: 3.5vw;
padding-bottom: 0.5em;
line-height: 1.8em;
}
.B_editor p {
font-size: 3.3vw;
line-height: 2em;
}
}