﻿@charset "utf-8";
/* CSS Document */

/* パソコンで見たときは"pc"のclassがついた画像が表示される */	
/* ここからがリセットスタイルシートになります。
-------------------------------------------------------------- */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td figcaption figure {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
/*フォーカスとは、ブラウザの画面上でマウスをクリックし、入力状態にあるまでの動作を指します*/
:focus {/* remember to define focus styles! */
	outline: 0;
}
body {/*行の高さをフォントサイズと同じにしています*/
	line-height: 1;
}
ol, ul {
	list-style: none;
}
table {/* 隣接するセルのボーダーを結合し、間隔を0に指定しています */
	border-collapse: collapse;
	border-spacing: 0;
}
caption, th, td {/*captionとはテーブル（表）にキャプションをつける。キャプションとは、主に図版や写真について説明のために付け加えられた文字情報のことである。*/
	font-weight: normal;
	text-align: left;
}
blockquote:before, blockquote:after, q:before, q:after {/*blockquote要素、q要素の前後にコンテンツを追加しないように指定しています*/
	content: "";
}
blockquote, q {/*引用符の表示が出ないようにしています*/
	quotes: "" "";
}
a img {
	border: 0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {/*html5の新しいタグをブロック要素として表示される。*/
	display: block;
}
/* reset.cssに下記を追加 */
header, footer, main, nav, article, aside, section {
	display: block;
}
/* ここまでがリセットスタイルシートになります。
-------------------------------------------------------------- */
body, td, th {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.wf-roundedmplus1c {
	font-family: "Rounded Mplus 1c";
}
html {
	margin: 0px;
	padding: 0px;
	height: 100%;
	width: 100%;
}
body {
	margin: 0px;
	padding: 0px;
}
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	zoom: 1;
}
a {
	font-weight: bold;
	text-transform: none;
	color: #09C;
}
a:hover {
	color: #F60;
	text-decoration: underline;
}
figure {
	margin: 0;
	padding: 0;
}
figcaption {
	padding: .5em;
	font-size: .9em;
	color: #867164;
	text-align: center;
}
body {
	background-image: url(images/bg_main.png);
}
/*=======================================================*/
/*　　　　　　　　　header                               */
/*=======================================================*/

header {
	box-sizing: border-box;
	width: 100%;
	margin: 0px;
	min-height: 10vh; /*最小の高さ*/
	background-image: url(images/bg_header_l.png), url(images/bg_header_r.png), url(images/bg_header.png);
	background-position: top left, top right, bottom center;
	background-repeat: no-repeat, no-repeat, repeat-x;
	background-size: 20% auto, 20% auto, auto;
	padding-bottom: 20px;
	padding-top: 15px;
}
.header {
	width: 60%;
	margin-inline: auto;
	display: flex;
	justify-content: space-around;
	margin-bottom: 50px;
	box-sizing: border-box;
}
.logo {
	box-sizing: border-box;
	text-align: center;
}
.tori_r {
	box-sizing: border-box;
	text-align: center;
	padding-top: 20px;
	width: 10%;
}
.tori_l {
	box-sizing: border-box;
	text-align: center;
	padding-top: 20px;
	width: 10%;
}
.logo img {
	max-width: 500px;
	width: 100%;
	height: auto;
}
.tori_r img, .tori_l img {
	max-width: 100%;
	height: auto;
}
/*=======================================================*/
/*　　　　　　　　 footer                                */
/*=======================================================*/
footer {
	background-image: url(images/bg_footer.png);
	background-repeat: repeat-x;
	background-position: top center;
}
#footer {
	background-image: url(images/footer_img1.png);
	background-position: top center;
	background-repeat: no-repeat;
	background-size: contain;
	padding: 160px 1em 30px 1em;
	width: min(100%, 700px);
	margin-inline: auto;
	text-align: center;
	color: #006666;
	font-size: 14px;
	box-sizing: border-box;
}
 @media screen and (max-width:768px) {
.header {
	width: 90%;
}
.logo {
	text-align: center;
	width: 80%;
	margin-inline: auto;
}
.tori_r {
	text-align: center;
	width: 15%;
	margin-top: 50px;
}
.tori_l {
	text-align: center;
	width: 15%;
	margin-top: 50px;
}
}
 @media screen and (max-width:480px) {
header {
	background-image: url(images/bg_header_l.png), url(images/bg_header_r.png), url(images/bg_header_sp.png);
	background-position: top left, top right, bottom center;
	background-repeat: no-repeat, no-repeat, repeat-x;
	background-size: 30% auto, 30% auto, auto;
	padding-bottom: 10px;
	padding-top: 10px;
}
.header {
	width: 100%;
	margin-inline: auto;
	display: flex;
	justify-content: space-around;
	margin-bottom: 20px;
	box-sizing: border-box;
}
.tori_r, .tori_l {
	display: none;
}
.logo {
	padding-top: 20px;
	text-align: center;
	width: 80%;
	margin-inline: auto;
}
.logo img {
	max-width: 100%;
	height: auto;
}
#footer {
	background-image: url(images/footer_img2.png);
	background-position: top 15px center;
}
}
/*=======================================================*/
/*　　　　　　　　　ナビゲーション                       */
/*=======================================================*/

nav {
	width: 100%;
}
nav > ul {
	width: min(100% - 2em, 1200px);
	margin-inline: auto;
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
	align-content: flex-start;
	padding-top: 10px;
	padding-bottom: 10px;
}
nav > ul li {
	width: calc(100% / 7 - 20px);
	height: auto;
	display: block;
	text-align: center;
	align-self: center;
}
nav ul li img {
	max-width: 100%;
	height: auto;
}
/*ナビボタン*のアニメーション*/

nav a:hover img {
	transform: scale(1.1, 1.1);
	transition-duration: 0.5s;
}
nav img {
	transition-duration: 0.5s;
	cursor: pointer;
	max-width: 100%;
	height: auto;
}
/*ドロップダウンメニュー*/


.dropmenu {
 *zoom: 1;
	list-style-type: none;
	margin: 5px auto 30px;
	padding: 0;
}
.dropmenu:before, .dropmenu:after {
	content: "";
	display: table;
}
.dropmenu:after {
	clear: both;
}
.dropmenu li {
	position: relative;
	width: calc(100% / 7 - 20px);
	float: left;
	margin: 0;
	margin-bottom: 10px;
	padding: 0;
	text-align: center;
	box-sizing: border-box;
}
.dropmenu li a {
	display: block;
	margin: 0;
	margin-bottom: 10px;
	padding: 3px 0;
	/*background: #8a9b0f;*/
	color: #614D41;
	font-size: 13px;
	line-height: 1;
	text-decoration: none;
}
.dropmenu li ul {
	list-style: none;
	position: absolute;
	z-index: 9999;
	top: 100%;
	left: 0;
	margin: 0;
	padding: 0;
}
.dropmenu li ul li {
	width: 100%;
	margin-bottom: 3px;
	font-family: "Zen Maru Gothic", serif;
}
.dropmenu li ul li a {
	padding: 10px 10px;
	text-align: left;
	background-color: #A6E1CB;
	border-radius: 10px;
}
.dropmenu li ul li a:hover {
	background-color: #E6EEB5;
}
.dropmenu li:hover > a {
/* background: #6e7c0c;*/
}
.dropmenu > li a:hover {
/*transform: scale(1.2, 1.2);
	transition-duration: 0.5s;*/
}
nav img {
	transition-duration: 0.5s;
	cursor: pointer;
	max-width: 100%;
}
.dropmenu li ul li {
	overflow: hidden;
	height: 0;
	transition: .2s;
}
.dropmenu li:hover ul li {
	overflow: visible;
	height: 38px;
}
/*-----------------------------------*/
/*　　　     SP用ナビ　　 　　　  　 */
/*-----------------------------------*/

/*=======================================================================*/

#sp_navi {
	display: none;
	z-index: 9999;
}
/* ++++ トグルボタン ++++ */
	
#navTgl {
	display: none;
}
label {
	cursor: pointer;
	position: fixed;
	top: 0;
	right: 0;
}
.open {
	z-index: 9998;
	box-sizing: border-box;
	width: 70px;
	height: 60px;
	transition: background .5s, transform .5s cubic-bezier(0.76, 0.52, 0.29, 1.25);
	box-sizing: border-box;
	background-color: #3EB0E8;/*トグルカラー*/
	border-radius: 0 0 0 50px;
}
.open::before, .open::after {
	content: "";
}
.open span, .open::before, .open::after {
	content: "";
	position: absolute;
	top: calc(50% - 1px);
	left: 40%;
	width: 40%;
	border-bottom: 2px solid white;
　/*トグルボタンのサイズとカラー*/
 transition: transform .5s cubic-bezier(0.76, 0.52, 0.29, 1.25);
}
.open::before {
	transform: translateY(-8px);
}
.open::after {
	transform: translateY(8px);
}
.close {
	z-index: 9997;
	width: 100%;
	height: 100%;
	pointer-events: none;
	transition: background .5s;
}
.active + .open span {
	transform: scaleX(0);
}
.active + .open::before {
	transform: rotate(45deg);
}
.active + .open::after {
	transform: rotate(-45deg);
}
.active ~ .close {
	background-color: rgba(255,255,255,0.9); /*背景色*/
}
/* ++++ ドロワーメニュー ++++ */
.menu {
	z-index: 9997;
	position: fixed;
	overflow: auto;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 60px 6% 6% 6%;
	margin: 0;
	box-sizing: border-box;
	transform: translateX(-100%);
	transition: transform .5s cubic-bezier(0.33, 1.01, 0.33, 0.97);
}
.active ~ .menu {
	transform: none;
}
 @media screen and (max-width:1000px) {
/*TB SP ナビゲーション*/
#sp_navi {
	display: block;
	width: 100%;
	z-index: 9999;
}
.pc_nav {
	display: none;
	width: 100%;
	float: none;
}
.menu ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
}
.menu li {
	margin-bottom: 5px;
}
.menu li ul li {
	width: 80%;
	margin-bottom: 5px;
	font-family: "Zen Maru Gothic", serif;
	text-align: left;
	display: block;
	color: #614D41;
	font-size: 14px;
	line-height: 1;
	text-decoration: none;
}
.menu li ul li a {
	width: 80%;
	padding: 13px 15px;
	text-align: left;
	background-color: #C9F1EC;
	border-radius: 5px;
	display: block;
}
.submenu_sp li ul li a {
	text-decoration: none;
}
.menu ul li {
	width: calc(100% / 3 - 10px);
	width : -webkit-calc(100% / 3 - 10px);
}
}
 @media screen and (max-width:480px) {
.menu ul {
	margin-inline: auto;
	box-sizing: border-box;
}
.menu ul li {
	box-sizing: border-box;
	width: min(80%, 250px);
	margin-inline: auto;
	/*width: calc(100% / 2 - 10px);
	width : -webkit-calc(100% / 2 - 10px);*/
	margin-bottom: 5px;
	text-align: center;
}
}
/**=======================================================**/



/*=======================================================*/
/*　　　　　　　　　TOPに戻る                            */
/*=======================================================*/

/*jquery トップに戻る　*/
#page-top {
	position: fixed;
	bottom: 20px;
	right: 5px;
	font-size: 77%;
	z-index: 998;
}
#page-top img {
	max-width: 100%;
	height: auto;
}
#page-top a {
	text-decoration: none;
	color: #fff;
	width: 100px;
	text-align: center;
	display: block;
}
#page-top a:hover {
	text-decoration: none;
	opacity: 0.5;
}
/*=======================================================*/
/*　　　　　　　　　全ページ共通                         */
/*=======================================================*/

/*mainとboxエリア*/

main {
	height: 100%;
	min-height: 80vh; /*最小の高さ*/
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}
.txt_box {
	/*width: 90%;*/
	margin-inline: auto;
	line-height: 135%;
	color: #663300;
}
.box {
	/*width: 90%;*/
	margin-inline: auto;
}
/*リンクのホバー*//*
a:hover {
	opacity: 0.6;
}
*/


/*-------------見出し-----------------*/


h2 {
	box-sizing: border-box;
	width: min(100% - 2em, 600px);
	padding: 1em;
	margin: 1em auto 1em auto;
	font-size: 1.7em;
	color: #15B393;
	letter-spacing: 0.1em;
	display: block;
	text-align: center;
	background-image: url(images/bg_h2.png);
	background-repeat: no-repeat;
	background-position: bottom center;
	font-family: "Zen Maru Gothic", serif;
	font-style: normal;
	font-weight: 900;
	position: relative;
}
.h2img {
	position: absolute;
	left: 0;
	bottom: 10px;
	max-width: 20%;
	height: auto;
}
/*----PDFリンク----*/
.pdf {
	width: min(100% - 2em, 800px);
	margin-inline: auto;
	box-sizing: border-box;
}
.pdf li {
	width: 100%;
	box-sizing: border-box;
	margin-bottom: 1em;
	background-color: #E0EAF1;
	border-radius: 15px;
	padding: 0.5em 1em 0.5em 1em;
}
.pdf li a {
	text-decoration: none;
	display: block;
	color: #009966;
	width: 100%;
	padding: 0.5em 2em 0.5em 2em;
	box-sizing: border-box;
	border-radius: 15px;
}
.pdf li ::before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f15b";
	margin-right: 1em;
	color: #98D1E4
}
/* マウスオーバー時 */
.pdf li:hover {
	color: #0066CC;
	background-color: #CFEFDF;
	cursor: pointer;
}
/*-------テキストの修飾-----------------*/


.txt_r {
	text-align: right;
}
.txt_l {
	text-align: left;
}
/*--------リンクエリアの設定（エリア全体をリンク）-------------*/

.link-item {
	position: relative;
	width: 100%;
	height: 100%;
}
.link-item a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: block;
}
/*--------------リスト----------------*/
.liststyle ul {
	padding-top: 1em;
	margin-bottom: 1em;
}
.liststyle ul li {
	/*display: flex;
	align-items: baseline;
	justify-content:left;*/
	margin-bottom: .5em;
	text-indent: -1em;
　
}
.liststyle ul li:before {
	content: "\f621"; /*アイコン番号*/
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	margin-right: 5px;
	color: #FEBEAB;
　/*色*/
}
/* olのスタイル */
.liststyle ol {
	padding-top: 1em;
	margin-bottom: 1em;
	list-style: none; /* デフォルトの数字を非表示に */
	counter-reset: li;
}
/* ol内のliのスタイル */
.liststyle ol li {
	position: relative;
	font-size: 16px;
	padding-left: 1.5em;
	line-height: 1.5;
}
/* 2つ目以降のliにmargin-topを指定 */
.liststyle ol li:not(:first-child) {
	margin-top: 0.5em;
}
/* 数字のスタイル */
.liststyle ol li::before {
	counter-increment: li;
	content: counter(li);
	position: absolute;
	left: 0;
	top: 2px; /* 数字のY軸線上の位置を調整 */
	display: block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: #63BDED;
	font-size: 12px;
	color: #fff;
	line-height: 20px;
	text-align: center;
}
 @media only screen and (max-width: 480px) {
h2 {
	box-sizing: border-box;
	width: min(100% - 2em, 600px);
	padding: 1em;
	margin: 1em auto 1em auto;
	font-size: 1.3em;
	color: #15B393;
	letter-spacing: 0;
	display: block;
	text-align: center;
	background-image: url(images/bg_h2.png);
	background-repeat: no-repeat;
	background-position: bottom center;
	font-family: "Zen Maru Gothic", serif;
	font-style: normal;
	font-weight: 900;
	position: relative;
}
.h2img {
	position: absolute;
	left: 0;
	bottom: 10px;
	max-width: 30%;
	height: auto;
}
}
/*=======================================================*/
/*　　　　　　レスポンシブテーブル                       */
/*=======================================================*/



.re_table {
　/*border-collapse: collapse;*//*隣接するポーターラインを重ねる*/
}
.re_table th, .re_table td {
/*border: 1px solid #999999;
	padding: 8px;*/
}
.re_table th {
	text-align: left;
}
 @media only screen and (max-width: 768px) {
.re_table tr, .re_table th, .re_table td {
	display: block;
	width: auto;
}
.re_table tr:first-child {
/*border-top: 1px solid #999999;*/
}
.re_table th, .re_table td {
/*border-top: none;*/
}
}
/*レスポンシブテーブルここまで*/





/*=======================================================*/
/*　　　　　　　　　写真の表示　　                       */
/*=======================================================*/

/*アルバム　横4枚*/
.album4 {
	width: min(100% - 2em, 1200px);
	margin-inline: auto;
	box-sizing: border-box;
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}
.album4 li {
	width: calc(100% / 4 - 20px);
	margin-bottom: 1em;
	text-align: center;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
}
.album4 li img {
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 300px;
	margin-bottom: 10px;
	border-radius: 1em;
	box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
}
.album4 li figure {
	width: 100%;
}
.album4 li figcaption {
 font-size;
0.8em;
	color: #13B363;
	box-sizing: border-box;
	width: 100%;
	padding: 10px;
	text-align: center;
	box-sizing: border-box;
}
/*アルバム　横3枚*/
.album3 {
	width: min(100% - 2em, 1200px);
	margin-inline: auto;
	box-sizing: border-box;
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}
.album3 li {
	width: calc(100% / 3 - 10px);
	margin-bottom: 1em;
	text-align: center;
	box-sizing: border-box;
}
.album3 li img {
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 300px;
	margin-bottom: 10px;
	border-radius: 1em;
	box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
}
.album3 li figcaption, .album2 li figcaption {
 font-size;
0.8em;
	color: #009999;
	box-sizing: border-box;
	width: 100%;
	padding: 0 5px;
	text-align: center;
}
/*アルバム　横2枚*/	
.album2 {
	width: min(100% - 2em, 1000px);
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	margin-right: auto;
	margin-left: auto;
}
.album2 li {
	width: calc(100% / 2 - 10px);
	margin-bottom: 1em;
	text-align: center;
}
.album2 li img {
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 300px;
	margin-bottom: 10px;
	border-radius: 1em;
	box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
}
.album2 li p {
 font-size;
0.8em;
	color: blue;
	box-sizing: border-box;
	width: 100%;
	padding: 5px 10px 5px 10px;
	text-align: center;
}
 @media screen and (max-width:768px) {
.album4 li {
	width: calc(100% / 2 - 20px);
	margin-bottom: 1em;
}
album3 li {
	width: calc(100% / 2 - 10px);
	margin-bottom: 1em;
}
}
 @media screen and (max-width:480px) {
.album2 li {
	box-sizing: border-box;
	width: 100%;
	height: autot;
	padding: 10px;
	margin-bottom: 1em;
}
.album3 li, .album4 li {
	box-sizing: border-box;
	width: 100%;
	height: auto;
	padding: 10px;
	margin-bottom: 1em;
}
}
/*写真の表示ここまで*/



/*=======================================================*/
/*　　　　　　　　　Flex-box                             */
/*=======================================================*/


/*左右の端による配置 ※左右いっぱいにしたいときはこちら*/	
.flexboxb {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
}
/*均等割り付け*/	
.flexboxa {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	align-items: stretch;
}
/*左揃え*/	
.flexboxc {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: stretch;
}
/*中のbox*/		
.inbox2 {
	width: calc(100% / 2 - 10px);
	margin-bottom: 10px;
}
.inbox3 {
	width: calc(100% / 3 - 10px);
	margin-bottom: 10px;
}
.inbox4 {
	width: calc(100% / 4 - 10px);
	margin-bottom: 10px;
}
 @media screen and (max-width:768px) {
.inbox2 {
	width: 100%;
}
.inbox3 {
	width: calc(100% / 2 - 10px);
}
.inbox4 {
	width: calc(100% / 2 - 10px);
}
}
 @media screen and (max-width:480px) {
.inbox2 {
	width: 100%;
}
.inbox3 {
	width: 100%;
}
.inbox4 {
	width: 100%;
}
}
/*=======================================================
　　　　　　　　PCスマホ表示の切り替

 　　　　　　 .pc　.sp　タブレット以下切り替え
 
 　　　　　　 .pc2 .sp2　スマホ以下で切り替え          
       
=======================================================*/




/*-- PC版表示CSS   --*/


.pc, .pc2 {
	display: block;
}
.sp, .sp2 {
	display: none;
}


/*-- スマホ版表示CSS  --*/


@media screen and (max-width: 768px) {
.pc {
	display: none;
}
.sp {
	display: block;
}
}
 @media screen and (max-width: 480px) {
.pc2 {
	display: none;
}
.sp2 {
	display: block;
}
}
/*=========================================================================================================================================================*/

/*----------------ここより下各ページ---------------------------*/

/*=========================================================================================================================================================*/
.contents {
	width: min(100% - 2em, 1200px);
	margin-inline: auto;
}
/*------------------------
　　　　HOME 
-------------------------*/

#top {
	padding-top: 50px;
	width: min(100%, 1600px);
	margin-inline: auto;
	margin-bottom: 50px;
	box-sizing: border-box;
	background-image: url(images/top_bg1.png), url(images/top_bg2.png), url(images/top_bg3.png), url(images/top_bg4.png);
	background-position: top 3% left 3%, bottom left 3%, top 3% right 3%, bottom right 3%;
	background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
}
.top {
	text-align: center;
	box-sizing: border-box;
	padding: 10px;
	position: relative;
	width: min(100% - 2em, 1100px);
	margin-inline: auto;
}
.top img {
	max-width: 100%;
	height: auto;
}
.sideimg1 {
	position: absolute;
	top: 65%;
	left: 5%;
}
.sideimg2 {
	position: absolute;
	top: 50%;
	right: 3%;
}
.top_copy {
	position: absolute;
	top: 12%;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	text-align: center;
	width: 70%;
}
/*-----おしらせ//トピックスボード-----*/


#news {
	margin-inline: auto;
	width: min(100% - 2em, 1000px);
	margin-bottom: 5em;
}
#news iframe {
	background-color: #FFF;
	height: 500px;
	margin-right: auto;
	margin-left: auto;
	width: 100%;
	border-radius: 2vw 0 0 2vw;       /* 角丸の指定 */
	border: 5px solid #BFE8DE;
	box-sizing: border-box;
}
/*----各種リンク----*/

.link {
	width: min(100% - 2em, 1000px);
	margin-inline: auto;
	margin-bottom: 50px;
}
.link a:hover img {
	transform: scale(1.1, 1.1);
	transition-duration: 0.5s;
}
.link img {
	transition-duration: 0.5s;
	cursor: pointer;
	max-width: 90%;
	height: auto;
}
.link li {
	text-align: center;
}
/*---基本情報----*/
#kihon {
	margin-bottom: 5em;
}
#kihon .flexboxb {
	width: min(100% - 2em, 600px);
	margin-inline: auto;
	margin-bottom: 50px;
}
.mark {
	box-sizing: border-box;
	width: 30%;
	text-align: center;
}
.mark img {
	max-width: 100%;
	height: auto;
}
.add {
	box-sizing: border-box;
	width: 70%;
	font-family: "Kosugi Maru", sans-serif;
	font-weight: 400;
	font-style: normal;
	color: #746A5C;
	line-height: 170%;
	text-align: center;
}
/*.address {
	box-sizing: border-box;
	width: 60%;
	padding: 10px;
	border-right: #999999 dotted 3px;
	
	}*/
.tel {
	box-sizing: border-box;
	font-size: 1.3em;
	line-height: 200%;
}
.add1 {
	font-size: 1.3em;
	margin-bottom: .5em;
}
.add2 {
	font-size: 2em;
	margin-bottom: .5em;
}
.map {
	width: min(100% - 2em, 1200px);
	margin-inline: auto;
}
.map iframe {
	border-radius: 1em;
	width: 100%;
	height: 450px;
	border-radius: 1em;
}


/*インスタリンク*/

.fixed-card-btn {
	position: fixed;
	right: 0px;
	bottom: 200px;
	display: inline-block;
	padding: 10px;
	padding-top: 15px;
	background-color: rgba(255,255,255,0.8); /* しろ*/
	color: #666;
	text-decoration: none;
	box-shadow: 0 3px 5px rgba(0,0,0,0.15);
	transition: transform 0.15s ease, opacity 0.15s ease;
	z-index: 999;
	width:80px;
	box-sizing: border-box;
	border: #FF3399 1px solid;
	border-right: none;
}

.fixed-card-btn:hover {
   opacity: 0.7;
   text-decoration: none;
   color: rgba(255,51,153,1);
}


.fixed-card-btn {
  display: flex;
  align-items: center;
  flex-direction:column;
  gap: 8px;
}
.fixed-card-btn p{
	text-align: center;
	font-size: 12px;
     font-family: "M PLUS 1p", sans-serif;
	 line-height:130%;
	 

}
.fixed-card-btn .icon {
  width:50%;
  height: auto;
  margin-bottom: 10px;
}



 @media screen and (max-width: 768px) {
#top {
	padding-top: 20px;
	width: 100%;
	margin-bottom: 50px;
	box-sizing: border-box;
	background-image: url(images/top_bg1.png), url(images/top_bg2.png), url(images/top_bg3.png), url(images/top_bg4.png);
	background-position: top left 3%, bottom left 3%, top right 3%, bottom right 3%;
	background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
	background-size: 20% auto, 20% auto, 20% auto, 20% auto;
}
.sideimg1 {
	width: 15%;
	position: absolute;
	top: 70%;
	left: 2%;
}
.sideimg2 {
	width: 15%;
	position: absolute;
	top: 30%;
	right: 2%;
}
}
 @media screen and (max-width: 480px) {
.top {
	text-align: center;
	box-sizing: border-box;
	padding: 5px;
	position: relative;
	width: 100%;
	margin-inline: auto;
}
.sideimg1 {
	width: 15%;
	position: absolute;
	top: 60%;
	left: 2%;
}
.sideimg2 {
	width: 15%;
	position: absolute;
	top: 20%;
	right: 2%;
}
#news {
	margin-inline: auto;
	width: 100%;
	margin-bottom: 3em;
}
.mark {
	box-sizing: border-box;
	width: min(100%, 200px);
	margin-inline: auto;
	text-align: center;
	margin-bottom: 3em;
}
.add {
	box-sizing: border-box;
	width: 100%;
	font-family: "Kosugi Maru", sans-serif;
	font-weight: 400;
	font-style: normal;
	color: #746A5C;
	line-height: 170%;
	text-align: center;
}
.add1 {
	font-size: 1em;
	margin-bottom: .5em;
}
.add2 {
	font-size: 1.5em;
	margin-bottom: .5em;
}
}
/*------------------------
　　　　園のご案内
-------------------------*/
/*----概要----*/

#gaiyo {
	padding-top: 50px;
	margin-bottom: 50px;
	background-image: url(images/bg_gaiyo.png);
	background-position: bottom center;
	background-repeat: no-repeat;
}
#gaiyo table {
	box-sizing: border-box;
	width: min(100% - 2em, 600px);
	margin-inline: auto;
	line-height: 1.3em;
}
#gaiyo .re_table tr {
	border-bottom: dotted 3px #76C9B8;
}
#gaiyo .re_table th {
	white-space: nowrap;
	padding-right: 1em;
	color: #339999;
	font-family: "Zen Maru Gothic", serif;
	font-size: 1.2em;
	font-weight: bold;
	padding-top: .5em;
}
#gaiyo .re_table td {
	padding-top: .5em;
	padding-bottom: 1em;
	color: #514237;
}
#gaiyo table h3 {
	color: #2C8F9A;
}
/*-----保育目標-----*/


#moku {
	padding-top: 50px;
	width: min(100% - 2em, 800px);
	margin-inline: auto;
	margin-bottom: 50px;
}
#moku .copy1 {
	font-size: 2em;
	color: #339966;
	font-family: "RocknRoll One", sans-serif;
	text-align: center;
	margin-bottom: 2em;
	display: block;
}
#moku .copy2 {
	margin-bottom: 2em;
	text-align: center;
}
#moku .copy2 img {
	max-width: 100%;
	height: auto;
}
#moku ul {
	width: min(100% - 2em, 600px);
	margin-inline: auto;
	font-size: 1.2em;
	font-family: "Kosugi Maru", sans-serif;
	background-color: #D6EFE1;
	background-image: url(images/bg_moku.png);
	padding: 1em;
	border-radius: 30px;
}
#moku ul li {
	margin-bottom: 1em;
	color: #714250;
	padding: 10px 0 10px 1.7em;
	background-image: url(images/icon01.png);
	background-repeat: no-repeat;
	background-position: left top 7px;
	background-size: 1.5em auto;
	border-bottom-width: 2px;
	border-bottom-style: dotted;
	border-bottom-color: #82B5A6;
	line-height: 150%;
}
/*-----園の特色----*/
#toku {
	margin-bottom: 5em;
	padding-top: 50px;
}
#toku .copy1 {
	font-size: 2em;
	color: #FF958C;
	font-family: "RocknRoll One", sans-serif;
	text-align: center;
	margin-bottom: 2em;
	display: block;
}
#toku .contents {
	width: min(100% - 2em, 1400px);
	margin-inline: auto;
	background-image: url(images/img_niji.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: contain;
}
#toku .box {
	width: min(100%, 1000px);
	margin-bottom: 10px;
	box-sizing: border-box;
	padding: 1em;
	background-color: rgba(255,255,255,.8);
	border-radius: 20px;
	line-height: 135%;
	color: #663300;
}
#toku .box h3 {
	font-size: 1.2em;
	padding-bottom: 0.5em;
	padding-left: 1em;
	border-bottom: dotted 2px #339999;
	font-family: "Kosugi Maru", sans-serif;
	color: #339999;
	margin-bottom: 1em;
}
#toku .album3 {
	padding-top: 20px;
}
@media screen and (max-width:1000px) {
#gaiyo {
	background-image: none;
}
}
 @media screen and (max-width:768px) {
}
 @media screen and (max-width:480px) {
}
/*------------------------
　　　　園の生活
-------------------------*/
/*----デイリー----*/
#daily {
	width: min(100% - 2em, 1200px);
	margin-inline: auto;
	margin-bottom: 150px;
}
#daily h2 {
	margin-bottom: 100px;
}
.day1 {
	border-radius: 30px;
	border-image-slice: 30 fill;
	border-image-width: 30px;
	border-image-outset: 0;
	border-image-repeat: round;
	border-image-source: url(images/waku01.png);
	position: relative;
}
.day2 {
	border-radius: 30px;
	border-image-slice: 30 fill;
	border-image-width: 30px;
	border-image-outset: 0;
	border-image-repeat: round;
	border-image-source: url(images/waku02.png);
	position: relative;
}
.day1, .day2 {
	width: calc(100% / 2 - 20px);
	box-sizing: border-box;
	background-color: #fff;
	padding-top: 50px;
	position: relative;
}
.day1 h3, .day2 h3 {
	position: absolute;
	top : -60px;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}
#daily table {
	width: min(100% - 10px);
	margin-inline: auto;
	margin-bottom: 2em;
}
#daily table tr {
	border-bottom: #D6D7CA dotted 3px;
}
#daily table th {
	padding: 1em;
	text-align: right;
	font-family: "M PLUS Rounded 1c", sans-serif;
	font-weight: 900;
	font-size: 1.3em;
}
.day1 th {
	color: #F59A50;
}
.day2 th {
	color: #84D273;
}
#daily table td {
	padding: 1em;
	line-height: 150%;
	font-family: "Kosugi Maru", sans-serif;
	color: #74635F;
}
.dayimg1, .dayimg2, .dayimg3, .dayimg4 {
	position: absolute;
	width: 30%;
	max-width: 100px;
	text-align: right;
}
.dayimg1 img, .dayimg2 img, .dayimg3 img, .dayimg4 img {
	max-width: 100%;
	height: auto;
}
.day1 .dayimg1 {
	top: 15%;
	right: 10%;
}
.day1 .dayimg2 {
	top: 60%;
	right: 10%;
}
.day1 .dayimg3 {
	top: 80%;
	right: 10%;
}
.day2 .dayimg1 {
	top: 20%;
	right: 10%;
}
.day2 .dayimg2 {
	top: 55%;
	right: 10%;
}
.day2 .dayimg3 {
	top: 75%;
	right: 10%;
}
/*----年間行事----*/

#year {
	width: min(100% - 2em, 1400px);
	margin-inline: auto;
	margin-bottom: 50px;
}
.ybox {
	background-color: #fff;
	box-sizing: border-box;
	padding: 1em;
	padding-top: 10px;
	border-radius: 15px;
}
.ybox2 {
	background-color: #fff;
	box-sizing: border-box;
	padding: 1em;
	border-radius: 15px;
	width: 100%
}
.ybox h3 {
	width: 100%;
	height: 50px;
	box-sizing: border-box;
	text-align: center;
	font-size: 1.5em;
	font-family: "Yusei Magic", sans-serif;
	margin-bottom: 1em;
}
.y1 ul li:before {
	content: "\f0c8"; /*アイコン番号*/
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	margin-right: 5px;
	color: #FB99CC;
　/*色*/
}
.y2 ul li:before {
	content: "\f0c8"; /*アイコン番号*/
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	margin-right: 5px;
	color: #81C7E4;
　/*色*/
}
.y3 ul li:before {
	content: "\f0c8"; /*アイコン番号*/
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	margin-right: 5px;
	color: #EFD065;
　/*色*/
}
#year ul li {
	display: flex;
	align-items: baseline;
	　　justify-content: center;
	margin-bottom: 0.7em;
	color: #4F453E;
	line-height: 135%;
}
.y1 {
	background-color: #FEEFF7;
	background-image: url(images/bg_y1.gif);
	background-position: top center;
}
.y1 h3 {
	color: #DE5082;
}
.y2 {
	background-color: #EAF5F7;
	background-image: url(images/bg_y2.gif);
	background-position: top center;
}
.y2 h3 {
	color: #3399CC;
}
.y3 {
	background-color: #F0F7E8;
	background-image: url(images/bg_y3.gif);
	background-position: top center;
}
.y3 h3 {
	color: #CC6666;
}
.ybox {
	width: calc(100% / 4 - 20px);
	margin-bottom: 20px;
}
.ybox2 {
	width: calc(100% / 2 - 20px);
	margin-bottom: 20px;
	background-color: inherit;
}
.ycopy {
	display: flex;
	justify-content: center;
	align-items: center;
	color: #53B972;
	font-size: 1.2em;
	font-family: "Mochiy Pop One", sans-serif;
	line-height: 150%;
}
/*.yphoto figcaption {
	width:80%;
	margin-inline:auto;
	box-sizing: border-box;
	line-height: 200%;
	background-image: url(images/bg_cap.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 100% auto;
	box-sizing: border-box;
	}
*/
@media screen and (max-width:1000px) {
.ybox {
	width: calc(100% / 3 - 10px);
}
}
 @media screen and (max-width:768px) {
.day1, .day2 {
	width: 100%;
	margin-bottom: 20px;
	box-sizing: border-box;
}
.day1 {
	margin-bottom: 100px;
}
.ybox {
	width: calc(100% / 2 - 10px);
}
}
 @media screen and (max-width:480px) {
#daily {
	width: 100%;
	margin-inline: auto;
	margin-bottom: 50px;
}
#daily table th {
	padding: .5em;
	text-align: right;
	font-family: "M PLUS Rounded 1c", sans-serif;
	font-weight: 900;
	font-size: 1em;
}
.ybox, .ybox2 {
	width: 100%;
}
.dayimg1, .dayimg2, .dayimg3, .dayimg4 {
	position: absolute;
	width: 25%;
	text-align: right;
}
}
/*------------------------
　　　支援センター
-------------------------*/
#shien {
	padding-top: 50px;
}
#shien h1 {
	text-align: center;
}
#shien h2 {
	text-align: left;
	width: 100%;
	background-image: none;
	font-size: 1.2em;
	color: #007D52;
	border-bottom: solid 5px #28BF70;
	background-color: #E0EFCB;
	background-image: url(images/bg_shien_h2.png);
}
#shien .contents {
	margin-bottom: 2em;
	line-height: 135%;
}
#shien h1 img {
	max-width: 100%;
	height: auto;
}
#shien .shien {
	width: min(100% - 2em, 1000px);
	margin-inline: auto;
	margin-bottom: 50px;
}
#shien .info {
	width: min(100%, 700px);
	margin-inline: auto;
	margin-bottom: 1em;
	padding: 1em;
	color: #663300;
}
#shien .info {
	box-sizing: border-box;
	background-color: #FDEADF;
	border-radius: 20px;
	line-height: 150%;
}
#shien .info .add {
	width: min(100%, 500px);
	margin-inline: auto;
	padding-top: 20px;
	font-size: 1.3em;
}
.sns {
	margin-bottom: 30px;
	padding-top: 20px;
}
.sns ul {
	width: min(100%, 600px);
	margin-inline: auto;
	box-sizing: border-box;
}
.sns li {
	box-sizing: border-box;
	width: calc(100% / 3 - 5px);
	text-align: center;
}
.sns li a:hover {
	opacity: 0.7;
}
.sns li img {
	box-sizing: border-box;
	max-width: 100%;
	height: auto;
}
.button {
	padding: 10px;
}
.button a {
	color: #fff;
	font-size: 1em;
	font-weight: bold;
	background: #64B76F;
	padding: 18px 30px;
	border-radius: 6px;
	display: inline-block;
	transition: .3s;
	text-decoration: none;
}
.button a:hover {
	transform: scale(1.1);
}
/*----------------------タブレット以下での表示------------------------------------*/
.------sp_w768------------------------- {
}
@media screen and (max-width:768px) {
}
 @media screen and (max-width:480px) {
.------sp_w480------------------------- {
}
body {
	font-size: 18px;
}
#shien .shien {
	width: min(100% - 1em);
	margin-inline: auto;
	margin-bottom: 50px;
}
#shien .info .add {
	width: min(100%, 500px);
	margin-inline: auto;
	padding-top: 20px;
	font-size: 1.2em;
}
}
/*==========================フォント===========================================*/

.m-plus-rounded-1c-regular {
	font-family: "M PLUS Rounded 1c", sans-serif;
	font-weight: 400;
	font-style: normal;
}
.kiwi-maru-regular {
	font-family: "Kiwi Maru", serif;
	font-weight: 400;
	font-style: normal;
}
.yusei-magic-regular {
	font-family: "Yusei Magic", sans-serif;
	font-weight: 400;
	font-style: normal;
}
.yomogi-regular {
	font-family: "Yomogi", cursive;
	font-weight: 400;
	font-style: normal;
}
.stick-regular {
	font-family: "Stick", sans-serif;
	font-weight: 400;
	font-style: normal;
}
.mochiy-pop-one-regular {
	font-family: "Mochiy Pop One", sans-serif;
	font-weight: 400;
	font-style: normal;
}
.kosugi-maru-regular {
	font-family: "Kosugi Maru", sans-serif;
	font-weight: 400;
	font-style: normal;
}
.rocknroll-one-regular {
	font-family: "RocknRoll One", sans-serif;
	font-weight: 400;
	font-style: normal;
}
.zen-maru-gothic-regular {
	font-family: "Zen Maru Gothic", serif;
	font-weight: 400;
	font-style: normal;
}
.m-plus-1p-regular {
	font-family: "M PLUS 1p", sans-serif;
	font-weight: 400;
	font-style: normal;
}
/*=========================アニメーション===========================================*/

.fuwafuwa01 {
	animation: fuwafuwa01 2s infinite;
}
@keyframes fuwafuwa01 {
 0%, 100% {
 transform: translate(0, 0);
}
 50% {
 transform: translate(0, 15px);
}
}
.fuwafuwa02 {
	animation: fuwafuwa02 2s infinite;
}
@keyframes fuwafuwa02 {
 0%, 100% {
 transform: translate(0, 0);
}
 50% {
 transform: translate(0, -15px);
}
}
.fuwafuwa03 {
	animation: fuwafuwa03 3s infinite;
}
@keyframes fuwafuwa03 {
 0%, 100% {
 transform: translate(0, 0);
}
 50% {
 transform: translate(0, 20px);
}
}
.yurayura {
	transform-origin: center bottom;
	animation: yurayura 3s linear infinite;
}
 @keyframes yurayura {
 0%, 100% {
 transform: rotate(10deg);
}
 50% {
 transform: rotate(-10deg);
}
}
