@charset "UTF-8";
/* --------------------------------------------------------------------------------------------- */
/*	全体の設定
/* --------------------------------------------------------------------------------------------- */
body, h1, h2, h3, h4, h5, h6, p, div, dt, dd, dl, img, input, form, ul, li, span, iframe {
	margin: 0px;
	padding: 0px;
vertical-align: bottom;
}
html {
  scroll-behavior: smooth;
}
.grecaptcha-badge { visibility: hidden; }
.br_sp,
.br_sp3,
.pc { 
display:none;
}
.br_sp2 { 
display: block;
clear: both;
min-height: 1px;
}

a.anchor{
    display: block;
    padding-top: 200px;
    margin-top: -200px;
}
.anchor{
    display: block;
    padding-top: 200px;
    margin-top: -200px;
}
.fixed {
    position: fixed;
    top: 0;
    padding: 20px 0 0 0;
    width: 100%;
    z-index: 1000;
background-color: rgba(255,255,255,0.9);
  -webkit-transition: all .4s ease 0s,background .6s ease .2s;
  transition: all .4s ease 0s,background .6s ease .2s;
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
  }
body {
font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
letter-spacing: .5px;
	color: var(--maincolor);
font-size: 18px;
line-height:1.8em;
}
html, body {
    overflow-x: hidden;
    width: 100%;
    margin: 0;
    padding: 0;
}
a {
 text-decoration: none;
filter:alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
-webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  	}

a:hover {
filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
	}

img {
 border: 0;
 vertical-align: bottom;
}
.clearfix:after {
	content: "."; 
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.clearfix {
	min-height: 1px;
overflow:hidden;
}

* html .clearfix {
	height: 1px;
	/*¥*//*/
	height: auto;
	overflow: hidden;
	/**/
}
.t_130 {
	font-size: 130%;
}
.t_80 {
	font-size: 80%;
}
.item {
  text-align: center;
  color: #fff;
  margin: 0px 0px 0px 0px;
  width:100%;
}

.tb,
.pc_{
	display: none;
}
.sp img,
.tb img,
.pc_ img {
	width: 100%;
}



.container,
.container2 {
padding: 0px 6%;
box-sizing:border-box;
width:100%;
}

img {
	vertical-align: bottom;
}


/* 初期状態：透明(fade用) ＋ 上に配置(slide-down用) */
[data-aos="fade-slide"] {
    opacity: 0;
    transform: translateY(-50px); /* 上に50pxずらしておく */
    transition-property: transform, opacity;
}

/* 画面に入った時：不透明 ＋ 元の位置(0)へ */
[data-aos="fade-slide"].aos-animate {
    opacity: 1;
    transform: translateY(0);
}


@media screen and (min-width: 768px) {
.sp,
.pc_{
	display: none;
}
.tb{
	display: block;
}
.pc {
		display: block;
	}
.sf {
		display: none;
	}
.clearfix2:after {
	content: "."; 
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.clearfix2 {
	min-height: 1px;
overflow:hidden;
}

* html .clearfix2 {
	height: 1px;
	/*¥*//*/
	height: auto;
	overflow: hidden;
	/**/
}
.br_sp { 
display: block;
}
.br_sp2 { 
display:none;
}
}
@media screen and (min-width: 1200px) {
.sp,
.tb{
	display: none;
}
.pc_{
	display: block;
}
	

	
.br_sp3 { 
display: block;
clear: both;
min-height: 1px;
}

.container,
.container2 {
	width:1200px;
	margin: 0px auto;
	padding: 0;
	text-align:center;
}
}
	
	
/* --------------------------------------------------------------------------------------------- */
/*	ヘッダ
/* --------------------------------------------------------------------------------------------- */

h1 a {
	background: url(../img/logo.png) no-repeat;
	background-size: 143px 50px;
  display: block;
  width: 143px;
  height: 50px;
  margin: 10px 3% 25px 4%;
  float: left;
}
h1 a span {
display: none;
}
@media screen and (min-width: 768px) {
h1 a {
	background-size: 171px 60px;
  display: block;
  width: 171px;
  height: 60px;
  margin: 15px 20px 30px 4%;
}
}
@media screen and (min-width: 1024px) {
h1 a {
	background-size: 200px 70px;
  display: block;
  width: 200px;
  height: 95px;
  margin: 15px 0px 25px 25px;
}
}



/* --------------------------------------------------------------------------------------------- */
/*	 お問い合わせ
/* --------------------------------------------------------------------------------------------- */
.toi {
	background: url(../img/top/toi.jpg) no-repeat bottom;
	background-size: 150%;
width:100%;
text-align: center;
	padding: 8% 0;
	color: #FFF;
}
.toi h4 {
	font-weight: normal;
	font-size: 150%;
	margin: 0 0 10px 0;
}
.toi_b {
	background: #FFF;
	padding: 3px 0 10px 0;
	width: 280px;
	margin: 0 auto 10px auto;
}
.toi p {
	font-size: 80%;
	line-height: 1.5;
  display: flex;
  justify-content: center; /* 横の中央 */
  align-items: center;     /* 縦の中央（これが重要！） */
}
.toi p a {
	color: #FFF;
}
@media screen and (min-width: 768px) {
.toi {
	background-size: 100%;
	padding: 6% 0;
}
}
@media screen and (min-width: 1024px) {
.toi p {
	font-size: 100%;
	line-height: 1.8;
}}


	
	
/* --------------------------------------------------------------------------------------------- */
/*	 プラン
/* --------------------------------------------------------------------------------------------- */
.plan {
  box-sizing: border-box;
  width: 100%;
  text-align: center;
  padding: 10% 15% 8% 15%;
  background: #381b03;
  overflow: hidden;
}
.plan_p {
  box-sizing: border-box;
  width: 100%;
  text-align: center;
  padding: 10% 15% 8% 15%;
  overflow: hidden;
}
.plan h4 {color: #FFF;
	font-weight: normal;
	font-size: 150%;
	margin: 0 0 20px 0;
}
.plan_box {
 line-height:1.4em;
 font-size:100%;
	text-align: left;
	width: 100%;
	margin: 0 0 8% 0;
}
.plan_box a {
  display: block;
  height: 100%;
}
.plan_box img {
	width: 98%;
	margin: 0 auto 10px auto;
}
.plan_box a h5 {
 color: #FFF;
 font-weight: normal;
 font-size:100%;
	-webkit-filter: opacity(100%);
	filter: opacity(100%);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.plan_box a p {
 color: #FFF;
 font-size:80%;
 margin: 0px 3px 0px 0px;
 font-weight: normal;
	-webkit-filter: opacity(100%);
	filter: opacity(100%);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.plan_box a img {
	-webkit-filter: opacity(100%);
	filter: opacity(100%);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.plan_box a:hover h5,
.plan_box a:hover p,
.plan_box a:hover img {
	-webkit-filter: opacity(50%);
	filter: opacity(50%);
	text-decoration: none;
}
.plan_box a.color-alt h5,
.plan_box a.color-alt p {
    color: var(--maincolor);
}
@media screen and (min-width: 768px) {
.plan,
.plan_p {
    padding: 6%;
    display: flex; /* 親をFlexにして横並びに */
    align-items: flex-start;
  }
.plan h4 {
	font-weight: normal;
	writing-mode: vertical-rl;
	font-size: 150%;
	padding: 0 2% 0 0;
	border-right: 1px solid #FFF;
	float: left;
	width:8%;
	box-sizing: border-box;
}
.plan_box0 {
	width:88%;
    display: flex;
    flex-wrap: wrap; /* 折り返しを許可 */
    justify-content: flex-start;
    padding-left: 2%;
}
.plan_container {
    width: 92%;
    display: flex;
    flex-wrap: wrap; /* 折り返しを許可 */
    justify-content: flex-start;
    padding-left: 2%;
	margin: auto;
  }
.plan_box {
	width: 31%; /* 3段並び */
    margin: 0 1% 4% 1%; /* 余白を調整 */
    display: flex;
}
.plan_box a {
    display: flex;
    flex-direction: column;
    text-align: left;
  }
.plan_box img {
	width: 100%;
    height: auto;
    margin: 0 0 10px 0;
}
}	
@media screen and (min-width: 1024px) {
.plan,
.plan_p {
margin: 0px auto;
padding: 80px 5%;
width: 100%;
box-sizing: border-box;
}
.plan_container {
    width: 100%;
  }
}	
@media screen and (min-width: 1200px) {
.plan_container {
    width: 90%;
	padding-left: 0;
	margin: auto;
  }
}
@media screen and (min-width: 1500px) {
.plan0 {
width: 1400px;
margin: 0px auto;
}
}

/* --------------------------------------------------------------------------------------------- */
/*	 お知らせ
/* --------------------------------------------------------------------------------------------- */
.news {
box-sizing:border-box;
width:70%;
text-align: center;
	margin: 10% 15% 8% 15%;
	overflow: hidden;
}
.news h4 {
	font-weight: normal;
	font-size: 150%;
	margin: 0 0 20px 0;
}
.news_box {
 line-height:1.4em;
 font-size:100%;
	text-align: left;
	width: 100%;
	margin: 0 0 8% 0;display: flex;
}
.news_box a {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
}
.news_box img {
	width: 98%;
	margin: 0 auto 5px auto;
}
.news_box a span {
 color: var(--maincolor);
 font-weight: normal;
 font-size:80%;
	-webkit-filter: opacity(100%);
	filter: opacity(100%);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.news_box a h5 {
 color: var(--maincolor);
 margin: 0px 3px 0px 0px;
 font-weight: normal;
	-webkit-filter: opacity(100%);
	filter: opacity(100%);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.news_box a img {
	-webkit-filter: opacity(100%);
	filter: opacity(100%);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.news_box a:hover h5,
.news_box a:hover span,
.news_box a:hover img {
	-webkit-filter: opacity(50%);
	filter: opacity(50%);
	text-decoration: none;
}

@media screen and (min-width: 768px) {
.news {
	margin: 6%;
    padding: 0;
    width: 88%;
    display: flex; /* 横並びの親 */
    align-items: flex-start;
	}
.news h4 {
	font-weight: normal;
	writing-mode: vertical-rl;
	font-size: 150%;
	padding: 0 2% 0 0;
	border-right: 1px solid var(--maincolor);
	float: left;
	width:8%;
	box-sizing: border-box;
}
.news_container {
    width: 92%;
    display: flex;
    flex-wrap: wrap; /* 4つで折り返し */
    padding-left: 2%;
	margin: auto;
  }
.news_box0 {
	width:88%;
    display: flex;
    flex-wrap: wrap; /* 折り返しを許可 */
    justify-content: flex-start;
    padding-left: 2%;
}
.news_box {
	width: 23%;
	margin: 0 1% 4% 1%; /* 左右に1%ずつ、下に余白 */
    display: flex; /* box自体の高さを揃える */
}
.news_box img {
	width: 100%;
	height: auto;
	margin: 0 0 5px 0;
}

}
@media screen and (min-width: 1024px) {
.news {
margin: 0px auto;
padding: 80px 0;
width: 90%;
}
.news_container {
    width: 100%;
	margin: 0px auto;
  }
}	
@media screen and (min-width: 1200px) {
.news_container {
    width: 90%;
	padding-left: 0;
	margin: auto;
  }
}
@media screen and (min-width: 1500px) {
.news {
width: 1400px;
}
}


/* --------------------------------------------------------------------------------------------- */
/*	フッタ
/* --------------------------------------------------------------------------------------------- */
#footer{
	width: 100%;
	margin: 0px;
	background: var(--themecolor);
}
.footer_box{
	padding: 30px 0 30px 0;
	text-align:center;
}
#footer h4 a {
	background: url(../img/logo2.png) no-repeat center;
	background-size: 150px 42px;
  display: block;
  width: 150px;
  height: 42px;
  margin: 0px auto 7px auto;
}
#footer h4 a span {
display: none;
}
#footer h5 {
	font-weight: normal;
	font-size: 100%;
line-height:1.6em;
  margin: 15px auto 0 auto;
}
#footer address {
	font-style: normal;
	font-size: 80%;
line-height:1.6em;
  margin: 5px auto 0 auto;
}
#footer address a {
	color:var(--maincolor);
}

#footer p {
	font-style: normal;
	font-size: 70%;
line-height:1.6em;
  margin: 10px auto 0 auto;
}
.f_t {
	font-size:120%;
}

.footer_r {
	display: none;
}
.img_cover {
	overflow: hidden;
	position: relative;
	width: 100%;
	margin-bottom: -10px;
}
.img_cover img {
	width: 100%;
}

.pagetop {
    display: none;
    position: fixed;
    bottom: 20px;
    left: 20px;
z-index: 5;
}
.pagetop a {
    display: block;
    background-color: #EEE0C4;
    text-align: center;
    color: var(--maincolor);
    font-size: 12px;
	line-height: 1;
    text-decoration: none;
    padding: 12px 15px 15px 15px;
    filter:alpha(opacity=60);
    -moz-opacity: 0.6;
    opacity: 0.6;
}
.pagetop a:hover {
    display: block;
    background-color: #FFF;
    text-align: center;
    color: var(--maincolor);
    text-decoration: none;
}

.pop {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 20px;
}

.pop img {
	width: 130px;
}
.pop a,
.language a {
    display: block;
}
.pop a img,
.language a img {
	transition: 1s;
}
.pop a:hover img,
.language a:hover img {
opacity: .6;
}
.t_b01 {
    display: none;
}
.sf_f {
	margin: 15px 0 0 0;
	font-size: 90%;
}
.sf_f a {
	color: #FFF;
}

@media screen and (min-width: 768px) {
.footer_box {
	padding: 30px 6%;
	margin: 0px auto;
}
#footer h5 {
	font-weight: normal;
	font-size: 100%;
line-height:1.6em;
  margin: 0;
}
#footer address {
	font-style: normal;
	font-size: 80%;
line-height:1.6em;
  margin: 5px 0 0 0;
}
#footer p {
	font-style: normal;
	font-size: 80%;
line-height:1.6em;
  margin: 5px 0 0 0;
}
.pop img {
	width: 200px;
}
}
@media screen and (min-width: 1024px) {

a[href^="tel:"] {
    pointer-events: none;
}
.footer_box{
	padding: 30px 25px 60px 25px;
}
#footer h4 a {
  margin: 0px 0 7px 0;
}
.footer_l{
	width:400px;
	float: left;
	text-align: left;
}
.footer_r{
	width:600px;
	float: right;
	display: block;
}
.footer_r a {
	margin: 0 1em 0 0;
	font-size: 90%;
	color: var(--maincolor);
}
.pop img {
	width: 230px;
}
}




/* --------------------------------------------------------------------------------------------- */
/*	ボタン
/* --------------------------------------------------------------------------------------------- */
.btn{
    /*矢印の基点とするためrelativeを指定*/
	position: relative;
    /*ボタンの形状*/
	text-decoration: none;
	display: inline-block;
	color:var(--maincolor);
    padding: 10px 30px 2px 0px;
    outline: none;
    /*アニメーションの指定*/
    transition: ease .2s;
	border-bottom: 1px var(--maincolor) solid;
	font-size: 90%;
	float: right;
}
.tr_b {
	letter-spacing: normal !important;
	margin: 25px auto 0 auto;
	text-align: center;
}

/* 矢印が右に移動 */

.btnarrow1::after{
    content: '';
    /*絶対配置で矢印の位置を決める*/
	position: absolute;
    top:50%;
    right: 10px;
    /*矢印の形状*/
    width: 7px;
    height: 7px;
    border-top: 1px solid var(--maincolor);
    border-right: 1px solid var(--maincolor);
    transform: rotate(45deg);
    /*アニメーションの指定*/
    transition: all .3s;
}

/*hoverした際の移動*/
.btnarrow1:hover::after,
.btnarrow2:hover::after,
.btnarrow3:hover::after {
    right: 5px;
}
.btn2{
    /*矢印の基点とするためrelativeを指定*/
	position: relative;
    /*ボタンの形状*/
	text-decoration: none;
	display: inline-block;
	color:#FFF;
    padding: 10px 30px 2px 0px;
    outline: none;
    /*アニメーションの指定*/
    transition: ease .2s;
	border-bottom: 1px #FFF solid;
	font-size: 90%;
	float: right;
}
.btnarrow2::after{
    content: '';
    /*絶対配置で矢印の位置を決める*/
	position: absolute;
    top:50%;
    right: 10px;
    /*矢印の形状*/
    width: 7px;
    height: 7px;
    border-top: 1px solid #FFF;
    border-right: 1px solid #FFF;
    transform: rotate(45deg);
    /*アニメーションの指定*/
    transition: all .3s;
}
.btn3{
    /*矢印の基点とするためrelativeを指定*/
	position: relative;
    /*ボタンの形状*/
	text-decoration: none;
	display: inline-block;
	color:var(--maincolor);
    padding: 10px 30px 2px 0px;
    outline: none;
    /*アニメーションの指定*/
    transition: ease .2s;
	font-size: 90%;
}
.btnarrow3::after{
    content: '';
    /*絶対配置で矢印の位置を決める*/
	position: absolute;
    top:50%;
    right: 10px;
    /*矢印の形状*/
    width: 7px;
    height: 7px;
    border-top: 1px solid var(--maincolor);
    border-right: 1px solid var(--maincolor);
    transform: rotate(45deg);
    /*アニメーションの指定*/
    transition: all .3s;
}



