@charset "utf-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
/* CSS Document */

body {
	/* 画像ファイルの指定 */
	background-image: url("../images/header/body_bg.jpg");
	
	/* 画像を常に上部左右の中央に配置 */
	background-position: top center;
	
	/* 画像をタイル状に繰り返し表示しない */
	background-repeat: no-repeat;
	
	/* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
	background-attachment: scroll;
	
	/* 表示するコンテナの大きさに基づいて、背景画像を調整 */
	background-size: contain;
	
	/* 背景画像が読み込まれる前に表示される背景のカラー */
	background-color: #fff;
	
	color: #333;
	font-size: 1.6rem;
	font-family: 'Noto Sans Japanese', sans-serif;
	font-feature-settings: "palt";
	-webkit-font-smoothing: antialiased;
 	-moz-osx-font-smoothing: grayscale;
	}
body a:hover{
	opacity: 0.6;
}

header{
	/* 画像ファイルの指定 */
	background-image: url(../images/header/header_bg.jpg);
	
	/* 画像を常に上部左右の中央に配置 */
	background-position: top center;
	
	/* 画像をタイル状に繰り返し表示しない */
	background-repeat: no-repeat;
	
	/* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
	background-attachment: scroll;
	
	/* 表示するコンテナの大きさに基づいて、背景画像を調整 */
	background-size: cover;
	
	/* 背景画像が読み込まれる前に表示される背景のカラー */
	background-color: #fff;
}
footer{
	color: #fff;
	background-color: #769164;
}
.headerlogo {
	text-align: center;
	width: 100%;
	height:auto;
	margin: 0 auto 1% auto;
}
.box{
	display: inline-block;
	width: 100%;
	margin: 0 auto;
	padding: 0.2em 0;
}
.freedial {
	color: #669933;
	text-align: center;
	font-size: clamp(3.5rem,3.5rem,4rem);
	font-family: 'Roboto', sans-serif;
	font-weight: 1000;
}
.open {
	display: inline-block;
	width: 100%;
	margin: 0 auto;
	padding: 0;
}
.open1 {
	margin: 0 auto;
	padding: 0;
	font-size: 1.5rem;
	color: #583822;
	font-weight: 500;
	letter-spacing: 0.01em;
	text-align: center;
}
.top{
	width: 100%;
	margin: auto;
	padding: 1rem 0rem;
}
.row{
	text-align: center;
	margin: auto;
}
.row:before, .row:after {
	content: "";
	display:  table;
}
.row:after {
	clear: both;
}
.col{
	width: 100%;
	text-align: center;
}
.col1{
	width: 80%;
	max-width: 340px;
	text-align: center;
	vertical-align:top;
	margin: 0 1% 1.5em auto;
	display: inline-block;
	border: solid 1px #aaa;
	border-radius: 2px;
}
.col2{
	width: 100%;
	text-align: left;
}
.col3{
	width: 80%;
	margin: auto;
	text-align: center;
}
.col4{
	width: 80%;
	max-width: 340px;
	text-align: center;
	vertical-align:top;
	margin: 0 1% 1em auto;
	display: inline-block;
	border-radius: 2px;
}
.col4 a:first-of-type{
	border: none;
}
.menu {
	display: inline-block;
	text-align: center;
	margin: 0 auto 0.5em;
	margin-top:0.2em;
	padding: 0 1em;
	font-size: 1rem;
	font-weight: 600;
	letter-spacing: 0.03em;
	border-style: solid;
	border-color: #583822;
	border-width: 0 1px;
}
.samuneiru {
	margin: 0.3em auto;
	text-align: center;
	width: 80%;
}
.samune {
	margin: 1em auto;
}
/*　別ファイルメモに詳細注意事項あり「トップスライダー注意事項.txt」　*/
/* 1.親スタイルリセットとペース設定 ++++++++++ */
.slider-box p, .slider-box div, .loop-box ul, .loop-box li {
  box-sizing: border-box; margin: 0 !important; padding: 0 !important;
}
/* 2.ベースBOXの設定 +++++++++++++++++++++ */
.slider-box {
  box-sizing: border-box;
  overflow: hidden;
  width: 100%; /* 画面又は親要素に対するサイズ - 変更可 */
   /* background: #000;背景色 - 変更可・削除可 */
   /* border: solid 5px #ccc;囲み線 - 変更可・削除可 */
  margin: 10px auto 0; /* Box外の余白 - 変更可 */
  padding: 0; /* 上端からスライダーまでの距離 - 変更可・削除可 */
}
/* 3.チェックボックスを利用した停止・再生などの設定 +++++++++++++++++ */
.slider-check {
  display: none;
}
.slider-check:checked ~ .loop-box > .loop {
  animation-play-state: paused;
}
.slider-label {
  display: block;
  cursor: pointer;
  color: #aaa; /* 文字色 - 変更可 */
  font-size: clamp(12px,3.5vw,18px); /* 文字サイズ - 変更可 */
   /* line-height: 2;ボタン部分の高さ - 変更可 */
  text-align: center;  
}
.slider-label::before {
   /* content: "\025a0  STOP";停止テキスト - 変更可 */
  } 
.slider-check:checked ~ div > .slider-label::before {
   /* content: "\025b6  MOVE";再生テキスト - 変更可 */
}
/* 4.スライダー本体とアニメーションの基本設定 ++++++++++++++ */
.loop-box{
  position: relative;
  width: 100%;
  overflow: hidden; 
}
.loop-box, .loop-box ul {
  height: 200px; /* スライダーの高さ - 変更注意 */
}
.loop-box ul {
  position: absolute; left: 0; top: 0;
  display: flex; 
  justify-content: space-between;
   /* background: #000;スライダーの背景色 - 変更可 */
  list-style: none;
  max-width: 10000%; 
  min-width: 100%;
  width: calc(200px * 2.5 * 2); /* 画像の横幅×枚数 - 変更注意・変更可・変更注意 */
  animation: 45s linear infinite; /* アニメーション設定 - 変更可 */
}
.loop-box li {
  display: flex;
  align-items: center; 
  justify-content: center;
  color: #aaa;
  width: calc(100% / 2); /* li の幅を均等にする - 削除可・変更注意 */
}
.loop-box img {
  height: auto;
  width: 100%;
}
/* 5.アニメーション個別設定 ++++++++++ */
.loop-box ul.loop1 {
  animation-name: loop1;
}
.loop-box ul.loop2 {
  animation-name: loop2;
}
@keyframes loop1 {
  0% {transform: translateX(0); }
  49.99999% {transform: translateX(-100%); }
  50% {transform: translateX(100%); }
}
@keyframes loop2 {
  0% {transform: translateX(100%); }
  100%{transform: translateX(-100%); }
}
.moji {
	font-size: 70%;
}
.text-center {
	text-align: left;
	font-size: 0.8em;
	font-weight: 500;
	padding: 0.1em 0.5em;
	margin: 0.2em;
}
.newstext {
	padding: 0.2em;
}
.day {
	font-size: clamp(11px,2vw,15px);
	color: #74A80E;
}
.article {
	font-size: clamp(12px,3vw,16px);
	border-style: solid;
	border-color: #669933;
	border-width: 0 0 1px 0; 
	padding-bottom: 0.5em;
}
.blink {
	color: red;
	-webkit-animation: blink 0.2s ease infinite;
	animation: blink 1s ease infinite;
}
@-webkit-keyframes blink {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes blink {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

.overlap1 {
	position: relative;
}
.overlap1 p {
	color: white;
	position: absolute;
	background-color: orangered;
	box-shadow: 1px 1px 2px 0 #949494;
	font-size: 50%;
	font-weight: 500;
	letter-spacing: 0.05em;
	margin: 16px 0;
	padding: 0 5px;
}
.overlap2 {
	position: relative;
}
.overlap2 p {
	position: absolute;
	background-color: #88cc43;
	box-shadow: 1px 1px 2px 0 #949494;
	font-size: 50%;
	font-weight: 500;
	letter-spacing: 0.05em;
	margin: 16px 0;
	padding: 0 5px;
}
.overlap3 {
	position: relative;
}
.overlap3 p {
	position: absolute;
	background-color: yellow;
	box-shadow: 1px 1px 2px 0 #949494;
	font-size: 50%;
	font-weight: 500;
	letter-spacing: 0.05em;
	margin: 16px 0;
	padding: 0 5px;
}

.itemimg{
	padding: 0;
	margin: 0;
}
.gomamugi_box {
	font-size: 15px;
	background-color: #fff;
	color: #303030;
	line-height: 0.1em;
	margin: 0 0.5em;
	padding: 0 0.3em 0.8em 0.1em;
}
.read {
	text-align: center;
	font-size: 1.4em;
	font-weight: 500;
	padding-bottom: 0.5em;
}
.itemname {
	text-align: center;
	font-size: 1.8em;
	font-weight: 600;
	padding-bottom: 0.4em;
}
.suppon {
	text-align: center;
	font-size: 1.6em;
	font-weight: 600;
	padding-bottom: 0.4em;
}
.hutoji {
	font-size: 1.6em;
	font-weight: 800;
	color: orangered;
}
.en {
	font-size: clamp(8px,1.5vw,12px);
	color: orangered;
	font-weight: 600;
}
.kakomi {
	padding: 0 0.2em;
	border: 1px;
	border-style: solid;
	border-color: #333;
	margin: 0 0.5em 0 0;
}
.itembtn{
	font-size: clamp(16px,3vw,18px);
	font-weight: 500;
	letter-spacing: 0.1em;
	width: 90%;
	text-align: center;
	display: inline-block;
  	padding: 1.2em 0em;
	margin: 1rem 5%;
  	text-decoration: none;
  	background-color: #693;/*ボタン色*/
  	color: #fff;
  	border-bottom: solid 2px #259409;
  	border-radius: 3px;
}
.itembtn:active {
  	/*ボタンを押したとき*/
  	-webkit-transform: translateY(4px);
  	transform: translateY(4px);/*下に動く*/
  	box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
  	border-bottom: none;
}
.teikibtn{
	font-size: clamp(16px,3vw,18px);
	font-weight: 500;
	letter-spacing: 0.1em;
	width: 90%;
	text-align: center;
	display: inline-block;
  	padding: 1.2em 0em;
	margin: 0 5% 1rem;
	text-decoration: none;
  	background-color: #f77559;/*ボタン色*/
  	color: #fff;
  	border-bottom: solid 2px #B85858;
  	border-radius: 3px;
}
.teikibtn:active {
  	/*ボタンを押したとき*/
  	-webkit-transform: translateY(4px);
  	transform: translateY(4px);/*下に動く*/
  	box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
  	border-bottom: none;
}
.title{
	font-size: clamp(16px,5vw,22px);
	font-weight: 700;
	margin-bottom: 0.5rem;
}
.title::after{
	content: '';
	display: inline-block;
	width: 100%;
	min-width: 700px;
	height: 6px;
	background: url("../images/common/bar.png") no-repeat;
	background-size: contain;
	vertical-align: 10px;
}

.guide_list {
	margin: auto;
	margin-right: 0.5em;
	margin-bottom: 1em;
	padding: 1em 1em 0.25em;
	text-align: center;
	vertical-align:top;
	display: inline-block;
	width: 15%;
	min-width: 250px;
	max-width: 280px;
	background: #fff;
}
.bg_paper{
	background: url("../images/common/bg.jpg");
	background-size: cover;
}
.wrapper{
	width: 90%;
	min-width: 350px;
	margin: auto;
	padding: 2em 0;
}
.center {
	margin: auto;
	text-align: center;
}
.sub {
	font-size: clamp(12px,5vw,24px);
	letter-spacing: 0.05em;
	padding: 0.5em;
}

.guideimg {
	max-width: 30%;
}

.guidep {
	font-size: clamp(13px,4vw,15px);
	text-align: left;
	margin-bottom: 1em;
}

.content_text {
	margin-top: 6px;
	font-size: 1rem;
}
.content_text:before {
    position: relative;
 	content:"\f054";
	font-family: 'FontAwesome';
	color: #ccc;
	margin-right: 2px;
}
.bg_green {
	background: #f0f6da;
}
.item_link{
	font-size: 1rem;
	padding-right: 2em;
	padding-left: 0.2em;
	min-width: 340px;
	display: inline-block;
}
.text_hed:before {
    position: relative;
 	content:"\f054";
	font-family: 'FontAwesome';
	color: #693;
	margin-right: 2px;
}
.item_link li{
	margin-bottom: 0.3em;
}
.bg_illustration{
	background: url("../images/common/about_bg.jpg") no-repeat top center;
}
.info_item {
	display: inline-block;
	width: 45%;
	min-width: 330px;
	max-width: 450px;
	padding: 1em;
	margin-bottom: 2em;	
	background: #fff;
	border: solid 1px #669933;
	font-size: clamp(12px,3.5vw,18px);
	vertical-align: top;
	text-align: center;
}
.info_item h3{
	color: #669933;
	font-size: clamp(10px,5vw,26px);
	font-weight: 600;
	text-align: center;
	letter-spacing: 0.01em;
}
.info_item dl{
	text-align: center;
	margin: auto;
}
.info_no{
	font-size: clamp(25px,11vw,42px);
	font-family: 'Roboto', sans-serif;
	font-weight: 900;
	color: #444;
	text-align: center;
	padding: 0.5em 0;
}
.info_no::before{
	content: '';
	display: inline-block;
	width: 55px;
	height: 37px;
	background: url("../images/common/freedial.png") no-repeat;
	background-size: contain;
	vertical-align: -2px;
	margin-right: 10px;
}

.info_kakomi {
	display: inline-block;
	padding-right: 0 1em;
	border: solid 1px;
	margin: 0 0.5em 0 0;
}

.info_bold {
	display: inline-block;
	font-weight: 800;
}
.infoheight{
	height: 3.5em;
}
.info_attention {
	margin: 0.5em 0 0 0;
	font-size: 1rem;
}

.address_area {
	padding-top: 3%;
	margin: auto;
	text-align: center;
	font-size: clamp(15px,16px,17px);
}

.address_item {
	margin: 0 3% 6% 3%;
	display: inline-block;
	vertical-align:top;
	max-width: 500px;
}

.btn-top{
	width: 80px;
	height: 80px;
	position: fixed;
	right: 0;
	bottom: 0;
	opacity: 0.7;
	z-index: 100%;
}

.footer{
	color: #ffffff;
	background-color: #91A683;
}

.inner02 {
	width:90%;
	margin: auto;
	text-align: center;
	font-size: clamp(11px,3vw,15px);
	font-weight: 400;
	padding: 2em 1em 2.5em 0;
}

.space {
	margin: 2% 0.5%;
	width: 24%;
	min-width: 98px;
	max-width: 123px;
}
.info_logo {
	margin: 0 auto 0.6em auto;
}

.inner {
	width: 90%;
	min-width: 350px;
	margin: auto;
	padding: 2em 0;
}
.bottom {
	padding-bottom: 0.5em;
}

.bottom2 {
	padding-bottom: 1em;
}
.kazu {
	font-size: 1.2em;
	font-weight: 400;
	text-align: center;
}

.footer-nav {
	margin-bottom: 2em;
}

.guide0 {
	width: 24%;
	min-width: 290px;
	margin: auto;
}

.news {
	width: 90%;
	min-width: 350px;
	padding: 2.5rem 0 3rem;
	margin: auto;
}

.content_col {
	display: inline-block;
	text-align: center;
	margin: auto;
	margin-top:0.5em;
}

.box2 {
	text-align: center;
	margin: auto;
	width: 100%;
	padding: 0.8em 0;
}

.wrap {
	overflow: hidden;
}

.widthbox {
	padding: 0% 3%;
}
.right1 {
	margin-right: 3em;
}