@charset "utf-8";

@import url(./basic.css);
@import url(./size.css);
@import url(./all.min.css);
@import url(./lightbox.css);

html {scroll-padding-top: 80px;}

body{font-size:16px;color:#4e4449;font-family:"Noto Sans JP", serif;line-height:2.0rem;margin:0px;padding:0px;font-feature-settings: "palt";letter-spacing:0.1vw;}

.wbasic380{width:380px;margin:0 auto;}
.wbasic400{width:400px;margin:0 auto;}
.wbasic480{width:480px;margin:0 auto;}
.wbasic480_16{width:480px;margin:0 auto;}
.wbasic640{width:640px;margin:0 auto;}
.wbasic640_100{width:640px;margin:0 auto;}
.wbasic820{width:820px;margin:0 auto;}
.wbasic{width:1000px;margin:0 auto;}
.wbasic1000{width: 1000px;margin:0 auto;}
.wbasic1200{width:1200px;margin:0 auto;}

/*.bg_blue01{background:#efffff;padding:60px 0;}*/
.bgbox_green{background-color:#00a73b;height:32px;}
.bgbox_green a{color:#fff;}

/*==================================================
スライダーのためのcss
===================================*/
.slider {/*横幅94%で左右に余白を持たせて中央寄せ*/
    width:94%;
    margin:0 auto;
}

.slider img {
    width:60vw;/*スライダー内の画像を60vwにしてレスポンシブ化*/
    height:auto;
}

.slider .slick-slide {
	transform: scale(0.8);/*左右の画像のサイズを80%に*/
	transition: all .5s;/*拡大や透過のアニメーションを0.5秒で行う*/
	opacity: 0.5;/*透過50%*/
}

.slider .slick-slide.slick-center{
	transform: scale(1);/*中央の画像のサイズだけ等倍に*/
	opacity: 1;/*透過なし*/
}

/*矢印の設定*/

/*戻る、次へ矢印の位置*/
.slick-prev, 
.slick-next {
    position: absolute;/*絶対配置にする*/
    top: 42%;
    cursor: pointer;/*マウスカーソルを指マークに*/
    outline: none;/*クリックをしたら出てくる枠線を消す*/
    border-top: 2px solid #4e4449;/*矢印の色*/
    border-right: 2px solid #4e4449;/*矢印の色*/
    height: 15px;
    width: 15px;
}

.slick-prev {/*戻る矢印の位置と形状*/
    left: -1.5%;
    transform: rotate(-135deg);
}

.slick-next {/*次へ矢印の位置と形状*/
    right: -1.5%;
    transform: rotate(45deg);
}

/*ドットナビゲーションの設定*/

.slick-dots {
    text-align:center;
	margin:20px 0 0 0;
}

.slick-dots li {
    display:inline-block;
	margin:0 5px;
}

.slick-dots button {
    color: transparent;
	font-size: 0;
    line-height: 0;
    outline: none;
    width:8px;/*ドットボタンのサイズ*/
    height:8px;/*ドットボタンのサイズ*/
    display:block;
    border-radius:50%;
    background:#ccc;/*ドットボタンの色*/
}

.slick-dots .slick-active button{
    background:#4e4449;/*ドットボタンの現在地表示の色*/
}

/*==================================================
スライダーのためのcss
===================================*/
.slider02 img {
    width:auto;/*スライダー内の画像を横幅100%に*/
    height:160px;
	margin:0 auto;
}

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/

.slider02 .slick-slide {
    margin:0 10px;/*スライド左右の余白調整*/
}

@media screen and (min-width: 768px) { /* forPC */
.pcNone{display:none;}
.br-sp{display:none;}}

/********* header *********/
header{height:80px}
/*========= 現在地表示のためのCSS ===============*/
@media screen and (min-width: 1024px) { /* forpc*/
.pcNone1024{display:none;}
#header{
z-index: 999;
position: fixed;/*header固定*/
height:80px;/*Headerの高さ設定*/
width:100%;
display: flex;
justify-content: flex-end;
align-items: flex-end;
background:#fff;
padding: 0 10px;
border-top:1px solid #00a73b;
}
.logo a{position:absolute;top:2%;left:16%;}
.flower{position:absolute;top:20%;left:28%;}
nav ul{display: flex;}
/*下の階層のulや矢印の基点にするためliにrelativeを指定*/
nav ul li.head{position: relative;color:#4e4449;font-size:0.9rem;padding:0px 12px 16px 12px;}
nav ul li a{
display: block;
text-decoration: none;
color:#4e4449;
font-size:0.9rem;
padding:0px 12px 16px 12px;
transition:all 0.3s;}
nav ul #g-navi li a:hover{color:#00a73b;}
nav ul #g-navi li a:visited{color:#4e4449;}
/*========= ナビゲーションドロップダウンのためのCSS ===============*/

/*2階層目以降は横並びにしない*/
nav ul ul{display: block;}
nav ul li li a{padding:6px 20px 6px 20px;}

/*==矢印の設定*/

/*2階層目を持つliの矢印の設定*/
nav ul li.has-child::before{
	content:'';
	position: absolute;
	left:15px;
	top:25px;
	width:6px;
	height:6px;
	border-top: 2px solid #4e4449;
    border-right:2px solid #4e4449;
    transform: rotate(135deg);
}

/*== 2・3階層目の共通設定 */

/*下の階層を持っているulの指定*/
nav li.has-child ul{
    /*絶対配置で位置を指定*/
	position: absolute;
	left:0;
	top:42px;
	z-index: 4;
    /*形状を指定*/
	background:#00a73b;;
	width:160px;
    /*はじめは非表示*/
	visibility: hidden;
	opacity: 0;
    /*アニメーション設定*/
	transition: all .3s;
}

/*hoverしたら表示*/
nav li.has-child:hover > ul,
nav li.has-child ul li:hover > ul,
nav li.has-child:active > ul,
nav li.has-child ul li:active > ul{
  visibility: visible;
  opacity: 1;
}

/*ナビゲーションaタグの形状*/
nav li.has-child ul li a{
	color: #fff;
	border-bottom:solid 1px rgba(255,255,255,0.6);
}

nav li.has-child ul li:last-child > a{
 border-bottom:none;
 }

nav li.has-child ul li a:hover,
nav li.has-child ul li a:active{
	background:#a7d397;
}


/*==3階層目*/

/*3階層目の位置*/
nav li.has-child ul ul{
	top:0;
	left:182px;
	background:#66ADF5;
}

nav li.has-child ul ul li a:hover,
nav li.has-child ul ul li a:active{
	background:#448ED3;
}}

/* main */
article {
margin:0 auto;
/*width: 1000px;*/
min-height: 400px;
height:auto !important;
height:400px;
}

strong{color:#df6c31;font-weight:600;}
.pBas{font-size:1.0rem;line-height:1.8rem;margin-bottom:40px;}
.pBas_b0{font-size:1.0rem;line-height:1.8rem;margin-bottom:0px;}
.pBas_b10{font-size:1.0rem;line-height:1.8rem;margin-bottom:10px;}
.pBas_b20{font-size:1.0rem;line-height:1.8rem;margin-bottom:20px;}
.pBas_b30{font-size:1.0rem;line-height:1.8rem;margin-bottom:30px;}
.pBas_b80{font-size:1.0rem;line-height:1.8rem;margin-bottom:80px;}
.pBasC{font-size:1.0rem;line-height:1.8rem;margin-bottom:40px;text-align:center;}

.h1{font-size:2.0rem;text-align:center;padding:10px 0px;margin-bottom:60px;line-height:2.8rem;}
.h1page {font-size:2.8rem;
    display: inline-block;
    position: relative;
    margin: calc(3.5em / 2) 0 calc(3.5em / 4) calc(3.5em / 2);
    color: #4e4449;
   /*padding:10px 0px;*/margin-bottom:60px;line-height:3.6rem;}

.h1page::before {
    position: absolute;
    bottom: calc(-3.5em / 4);
    left: calc(-3.5em / 2);
    z-index: -1;
    width: 3.5em;
    height:3.5em;
    border-radius: 50%;
    background: #a7d397;
    content: '';
}
.h1page_01 {font-size:2.8rem;
    display: inline-block;
    position: relative;
    margin: calc(3.5em / 2) 0 calc(3.5em / 4) calc(3.5em / 2);
    color: #4e4449;
   /*padding:10px 0px;*/margin-bottom:60px;line-height:3.6rem;}

.h1page_01::before {
    position: absolute;
    bottom: calc(-3.5em / 4);
    left: calc(-3.5em / 2);
    z-index: -1;
    width: 3.5em;
    height:3.5em;
    border-radius: 50%;
    background: #a7d397;
    content: '';
}
.h1page_02 {font-size:2.8rem;
    display: inline-block;
    position: relative;
    margin: calc(3.5em / 2) 0 calc(3.5em / 4) calc(3.5em / 2);
    color: #4e4449;
   /*padding:10px 0px;*/margin-bottom:60px;line-height:3.6rem;}

.h1page_02::before {
    position: absolute;
    bottom: calc(-3.5em / 4);
    left: calc(-3.5em / 2);
    z-index: -1;
    width: 3.5em;
    height:3.5em;
    border-radius: 50%;
    background: #a7d397;
    content: '';
}
.h1page_03 {font-size:2.8rem;
    display: inline-block;
    position: relative;
    margin: calc(3.5em / 2) 0 calc(3.5em / 4) calc(3.5em / 2);
    color: #4e4449;
   /*padding:10px 0px;*/margin-bottom:60px;line-height:3.6rem;}

.h1page_03::before {
    position: absolute;
    bottom: calc(-3.5em / 4);
    left: calc(-3.5em / 2);
    z-index: -1;
    width: 3.5em;
    height:3.5em;
    border-radius: 50%;
    background: #a7d397;
    content: '';
}
.h1page_04 {font-size:2.8rem;
    display: inline-block;
    position: relative;
    margin: calc(3.5em / 2) 0 calc(3.5em / 4) calc(3.5em / 2);
    color: #4e4449;
   /*padding:10px 0px;*/margin-bottom:60px;line-height:3.6rem;}

.h1page_04::before {
    position: absolute;
    bottom: calc(-3.5em / 4);
    left: calc(-3.5em / 2);
    z-index: -1;
    width: 3.5em;
    height:3.5em;
    border-radius: 50%;
    background: #a7d397;
    content: '';
}
.h2 {font-size:1.6rem;color:#00a73b;border-left:4px solid #00a73b;padding:8px 0 12px 20px;margin-bottom:20px;}
.h2info {font-size:1.6rem;color:#00a73b;border-left:4px solid #00a73b;padding:10px 0px 0px 20px; margin-bottom:30px;}
.h2top{font-size:2.0rem;text-align:center;padding:10px 0px;margin-bottom:60px;line-height:2.8rem;}
.h2topG{font-size:2.0rem;color:#00a73b;text-align:center;padding:10px 0px;margin-bottom:40px;line-height:2.8rem;}
.h2topG_b20{font-size:2.0rem;color:#00a73b;text-align:center;padding:10px 0px;margin-bottom:20px;line-height:2.8rem;}
.h2flGt{color:#00a73b;font-size:0.8rem;margin-bottom:8px;}
.h3{position: relative;display: inline-block;
padding:0.4em 0 0.2em 0.4em;
margin-bottom:40px;
font-size:1.4rem;}
.h3:before {
  content: '';
  position: absolute;
  left:0%;
  bottom: -15px;/*線の上下位置*/
  display: inline-block;
  width:240px;/*線の長さ*/
  height: 4px;/*線の太さ*/
  -webkit-transform: translateX(-0%);
  transform: translateX(-0%);/*位置調整*/
  background-color: #00a73b;/*線の色*/
}
.h3num{position: relative;font-size:1.8rem;line-height:2.4rem;margin-bottom:20px;}
.h3num::before {
	content: attr(data-number);
	display: inline-block;
	margin-right: 20px;
	color:#f8b856;
	font-size: 30px;
	/*border-bottom: 1px solid #ff6600;*/
}
.h4 {
display: inline;
font-size:1.4rem;
color:#a36b21;
background-image: linear-gradient(rgba(0,0,0,0) 70%, rgb(247,220,141) 70%);
}
.h5{
padding: .75em .75em;
background-color:#00afcc;
margin-bottom:50px;
font-size:28px;
color:#fff;
text-align:center;}
.h6{
padding:3px;
margin-bottom:10px;}
.checkbox > *{
position:relative;
padding-left:3em;
font-size:1.0em;}
.checkbox > *::before,
.checkbox > *::after {
content: '';
position:absolute;
line-height:0;
top:0;
right:0;
bottom:0;
left:0;}
.checkbox > *::before { /* チェックボックス */
width:1.0em;
height:1.0em;
background-color:#fff;
border:solid 1px #000;
margin-top:0.45em;
margin-left:0.8em;}
.checkbox > *::after { /* チェック */
border-left:0;
border-top:0;
border-bottom:0.2em solid #d70010;
border-right:0.2em solid #d70010;
transform: rotate(42deg);
width:0.6em;
height:1.0em;
margin-top:0.0em;
left: 1.2em;}
.checkbox > *.nocheck::after{ /* チェックなし */
border:0;
margin:0;}

.news-list{
  list-style: none outside;
  margin: 0;
  padding: 0;
}
.news-list .item a{
  display: flex;
  flex-wrap: wrap;
  flex-wrap: nowrap;
  text-decoration: none;
  color:#4e4449;
  border-bottom: 1px solid #4e4449;
  padding: 20px 20px;
}
.news-list .item:first-child a{
  border-top: 1px solid #4e4449;
}
.news-list .item .date{
  margin: 0;
  min-width: 140px;
  font-size:1.0rem;
  color: #4e4449;
  padding: 0 20px 0 0;
}
.news-list .item .category{
  margin: 0;
  min-width: 150px;
  padding: 0 20px 0 0;
}
.news-list .item .category span{
  background:#00a73b;
  color: #FFF;
  text-align: center;
  display: inline-block;
  padding: 5px 20px;
  font-size: 12px;
  line-height: 1;
}
.news-list .item .newstitle{
  margin: 0;
  width: 100%;
}
.news-list .item a:hover .newstitle{
  color:#00a73b;
}

.linkbtn-box {position: relative;}
.linkbtn{
position: absolute;
right: 0;
padding:0.8em 0em 0.8em 0em;/*アイコン分のスペース*/
line-height:1.2rem;/*行高*/
font-size:1.0rem;
width:120px;
text-align:center;
border:1px solid #4e4449;}
/*.linkbtn:before{
font-family: FontAwesome;/*忘れずに*/
/*content:"\f105";/*アイコンのユニコード*/
/*position:absolute;/*絶対位置*/
/*font-size:1.4em;/*サイズ*/
/*left:0em;/*アイコンの位置*/
/*top:0.3em;/*アイコンの位置*/
/*color:#1c1c1c; /*アイコン色}*/
a .linkbtn {color:#4e4449;}
a:hover .linkbtn{
background-color:#00a73b;border:none;color:#fff;}

/* footer */
footer{padding:0;border-top:1px solid #4e4449;}

/* pagetop */
#pagetop{position:fixed;bottom:20px;right:20px;font-size:20px;opacity:1;}
#pagetop a{text-decoration:none;color:#fff;width:60px;text-align:center;display:block;border-radius:30px;padding:15px;background-color:#00a73b;}
#pagetop a:hover {opacity:0.8;}

/* crear */
.clearfix{overflow:hidden;zoom: 1;}
.clearfix:after {content: ".";display:block;height:0px;clear:both;visibility:hidden;}

@media screen and (max-width: 767px) { /* forSMP */
.spNone{display:none;}
.br-pc{display:none;}
header{height:120px;margin-bottom:0px;}
.logo a{position:absolute;top:2%;left:25%;}
.slider {width:100%;margin:0 auto;}
.slider img {width:100vw;height:auto;}
.slick-prev,.slick-next {height:15px;width:15px;border-top:0px solid #4e4449;border-right:0px solid #4e4449;}
.pBas,.pBas_b0{}
.pBasC{text-align:left;}
.h1,.h2top,.h2topG,.h2topG_b20{font-size:1.6rem;line-height:2.4rem;margin-bottom:40px;}
.h1page {margin: calc(2em / 2) 0 calc(3.5em / 4) calc(2em / 2);}
.h1page::before {bottom: calc(-1em / 4);left: calc(-3.5em / 2);}
.h1page_02 {margin: calc(0.8em / 2) 0 calc(3.5em / 4) calc(2em / 2);}
.h1page_02::before {bottom: calc(-1em / 4);left: calc(-2em / 2);}
.h1page_03 {margin: calc(2em / 2) 0 calc(3.5em / 4) calc(2em / 2);}
.h1page_03::before {bottom: calc(-1em / 4);left: calc(-2em / 2);}
.h1page_04 {margin: calc(4em / 2) 0 calc(3.5em / 4) calc(2em / 2);}
.h1page_04::before {bottom: calc(-2.5em / 4);left: calc(-2em / 2);}
.h2{font-size:1.48rem;line-height:2.0rem;padding:8px 0 12px 16px;}
.h3{font-size:1.4rem;line-height:2.0rem;}
.h4{font-size:1.2rem;}
#pagetop{bottom:10px;right:6px;font-size:14px;opacity:1;z-index:4;}
#pagetop a{width:40px;text-align:center;display:block;border-radius:0px;padding:10px;background-color:#00a73b;}
.news-list .item a{
  flex-wrap: wrap;
}
.news-list .item .date{
  min-width: 100px;
}
.news-list .item .title{
  margin-top: 10px;
}
article{float: none;width: auto;}
}
@media (min-width: 768px) and (max-width: 1023px) {
header{height:120px;margin-bottom:0px;}
.logo a{position:absolute;top:2%;left:38%;}
.h1,.h2top,.h2topG,.h2topG_b20{font-size:1.8rem;}}
@media screen and (max-width: 1023px) { /* forSMP */
.spNone1023{display:none;}
.wbasic380,.wbasic400,.wbasic480_16,.wbasic640,.wbasic820,.wbasic,.wbasic1200{width:100%;padding:0 16px;}
.wbasic480,.wbasic640_100,.wbasic1000{width:100%;}
/*ボタン外側※レイアウトによってpositionや形状は適宜変更してください*/
.openbtn{
display : block;
position: fixed;/*ボタン内側の基点となるためrelativeを指定*/
cursor: pointer;
right: 16px;
top   : 12px;
width: 42px;
height:42px;
z-index : 999;
text-align: center;}

/*ボタン内側*/
.openbtn span{
display: inline-block;
transition: all .4s;/*アニメーションの設定*/
position: absolute;
left: 6px;
height: 4px;
border-radius: 5px;
background: #00a73b;
width:36px;
}
.openbtn span:nth-of-type(1) {top:10px;}
.openbtn span:nth-of-type(2) {top:20px;}
.openbtn span:nth-of-type(3) {top:30px;}
.openbtn span:nth-of-type(3)::after {
content:"Menu";/*3つ目の要素のafterにMenu表示を指定*/
position: absolute;
top:0px;
left:2px;
color:#00a73b;
font-size: 0.6rem;
text-transform: uppercase;
font-weight: 600;
}
/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
top: 14px;
left: 18px;
transform: translateY(6px) rotate(-45deg);
width: 30%;}
.openbtn.active span:nth-of-type(2) {opacity: 0;}
.openbtn.active span:nth-of-type(3){
top: 26px;
left: 18px;
transform: translateY(-6px) rotate(45deg);
width: 30%;}
.openbtn.active span:nth-of-type(3)::after {
content:"Close";/*3つ目の要素のafterにClose表示を指定*/
transform: translateY(0) rotate(-45deg);
top:2px;
left:4px;}
	
#g-nav{
/*position:fixed;にし、z-indexの数値を大きくして前面へ*/
position:fixed;
z-index: 3;
/*ナビのスタート位置と形状*/
top:-120%;
left:0;
width:100%;
height: 100vh;/*ナビの高さ*/
background:#f7f6f5;
opacity: 0.9;
/*動き*/
transition: all 0.6s;}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive{top: 0;}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list{
/*ナビの数が増えた場合縦スクロール*/
position: fixed;
z-index: 999; 
width: 100%;
height: 100vh;/*表示する高さ*/
overflow: auto;
-webkit-overflow-scrolling: touch;}

/*ナビゲーション*/
#g-nav ul {
/*ナビゲーション天地中央揃え*/
position: absolute;
z-index:3;
top:50%;
left:50%;
transform: translate(-50%,-50%);}
/*リストのレイアウト設定*/
#g-nav li{
list-style: none;
text-align: center; }
#g-nav li a{
color:#00a73b;
text-decoration: none;
padding:4px;
display: block;
text-transform: uppercase;
font-size:1.1rem;
font-weight: bold;}
#g-nav #g-nav-list li .bgbox_green a{
color:#fff;
text-decoration: none;
background:#00a73b;
padding:4px;
display: block;
text-transform: uppercase;
font-size:1.1rem;
font-weight: bold;}
	
/*メニューをページ下部に固定*/
#sp-fixed-menu{
position: fixed;
width:100%;
bottom:0px;
opacity:0.9;
z-index:99;}
/*メニューを横並びにする*/
#sp-fixed-menu ul{
display:flex;
list-style:none;
padding:0;
margin:0;
width:100%;}
#sp-fixed-menu li{
justify-content:center;
align-items:center;
width:25%;
padding:0;
margin:0;
line-height:22px;
border-right:1px solid #fff;}
#sp-fixed-menu li+ li{border-left: 0;}
#sp-fixed-menu li i{}
#sp-fixed-menu li span{font-size:1.0em;font-weight:600;}
#sp-fixed-menu li:first-child{background:#df0428;}
#sp-fixed-menu li:nth-child(2){background: #fabf13;}
#sp-fixed-menu li:nth-child(3){background: #5ab651;}
#sp-fixed-menu li:last-child{background: #00a9e4;}
/*ボタンを調整*/
#sp-fixed-menu li a{color:#fff;text-align:center;display:block;width:100%;padding:8px;}
}