@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 {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
/* アクセシブルなフォーカス */
:focus {
	outline: 0;
}
body {/*行の高さをフォントサイズ×1.5にしています*/
	line-height: 1.5;
}
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, main, nav {/*html5の新しいタグをブロック要素として表示される。*/
	display: block;
}
/* ここまでがリセットスタイルシートになります。
-------------------------------------------------------------- */
html {
	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;
}
a {
	font-weight: bold;
	text-transform: none;
	color: #0085CC;
}
a:hover {
	color: #F60;
	text-decoration: underline;
}
figure {
	margin: 0;
	padding: 0;
}
figcaption {
	padding: 0.5em;
	font-size: .9em;
	color: #867164;
	text-align: center;
}
*, *::before, *::after {
	box-sizing: border-box;
}
img {
	max-width: 100%;
	height: auto;
}
 @media only screen and (max-width: 480px) {
body {
	font-size: 18px;
}
}
/*=======================================================
  header
=======================================================*/
header {
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	min-height: 10vh;
	background-color: #D0F2FD;
	background-image: url(images/header_hata_r.png), url(images/header_hata_l.png), url(images/bg_header_btm.png);
	background-position: top left, top right, bottom -2px center;
	background-repeat: no-repeat, no-repeat, repeat-x;
	background-size: 30% auto, 30% auto, contain;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
}
.header_logo {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 20px 1em 80px 1em;
}
/*=======================================================
  footer
=======================================================*/
footer {
	width: 100%;
	text-align: center;
	box-sizing: border-box;
	padding: 1em;
	padding-top: 50px;
	background-image: url(images/footer_bg.png);
	background-repeat: repeat-x;
}
#footer {
	padding-top: 30px;
	color: #fff;
	font-family: "Kosugi Maru", sans-serif;
}
.site-footer {
	position: relative;
	overflow: hidden;      /* はみ出した新幹線を隠す *//* background-color: #f5f5f5;   お好みで */
}
/* 新幹線を走らせるレーン */
.shinkansen-wrap {
	position: relative;
	width: 100%;
	height: 40px;          /* 画像高さ29pxより少し余裕を持たせる */
}
/* 新幹線本体 */
.shinkansen {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	height: 29px;          /* 元画像の高さに合わせる（必要なら） */
	width: auto;
	max-width: 801px;
	/* 右→左に走るアニメーション */
	animation: shinkansen-run 10s linear infinite; /* スピードを制御（PC） */
}

/* 右の外側から左の外側へ */
@keyframes shinkansen-run {
 0% {
 left: 100%;           /* 画面右の外からスタート */
}
 80% {
 left: -900px;         /* 画像幅ぶん左の外へ抜ける */
}
 100% {
 left: -900px;         /* 画像幅ぶん左の外へ抜ける */
}
}
 @media (max-width: 768px) {
.shinkansen-wrap {
	height: 30px; /* 少し低めのレーン */
}
.shinkansen {
	height: 20px; /* スマホ用に少し小さく */
	max-width: 553px;
	width: auto;
	top: 50%;
	transform: translateY(-50%);
	animation: shinkansen-run 8s linear infinite; /* スピードを制御（タブレット） */
}
 @keyframes shinkansen-run {
 0% {
 left: 100%;           /* 画面右の外からスタート */
}
 80% {
 left: -600px;         /* 画像幅ぶん左の外へ抜ける */
}
 100% {
 left: -600px;         /* 画像幅ぶん左の外へ抜ける */
}
}
}
 @media (max-width: 480px) {
.shinkansen {
	height: 20px;      /* 高さだけ指定 */
	width: auto;       /* 横幅は自動で比率維持 */
	max-width: 553px;
	top: 60%;
	animation: shinkansen-run 6s linear infinite; /* スピードを制御（スマホ） */
}
}
/* =======================================================
  ナビゲーション
======================================================= */
#navi1 {
	width: 100%;
}
#navi1 .menu {
	display: flex;
	gap: 20px;
	list-style: none;
	padding: 20px 20px;
	margin: 0;
	justify-content: center;
}
#navi1 li {
}
#navi1 li a {
	display: flex;
	flex-direction: column; /* PCで縦並び */
	align-items: center;
	gap: 4px;
	text-decoration: none;
	color: #5a4f46;
	font-size: .9em;
	transition: 0.3s ease;
	padding: 5px;
	font-family: "Kosugi Maru", sans-serif;
}
/* ハンバーガーボタン（初期は非表示） */
#navi1 .menu-btn {
	display: none;
	border: none;
	background: none;
	cursor: pointer;
	outline: none;
	-webkit-tap-highlight-color: transparent;
}
/* ハンバーガーの3本線 */
#navi1 .menu-btn span {
	display: block;
	width: 28px;
	height: 3px;
	margin: 5px 0;
	background-color: #FFFFFF;
	border-radius: 3px;
	transition: 0.3s;
}
 @media (max-width:1000px) {
.header_logo {
	width: 90%;
	margin: 0 auto;
	padding-top: 20px;
	text-align: center;
}
#navi1 {
	width: min(100%, 800px);
	margin-inline: auto;
}
#navi1 li a {
	font-size: .7em;
	padding: 3px;
}
}
@media (max-width: 768px) {
.header_logo {
	width: 90%;
	padding-top: 30px;
	padding-bottom: 50px;
}
header {
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	min-height: 10vh;
	background-color: #D0F2FD;
	background-image: url(images/header_hata_r.png), url(images/header_hata_l.png), url(images/bg_header_btmsp.png);
	background-position: top left, top right, bottom -4px center;
	background-repeat: no-repeat, no-repeat, repeat-x;
	background-size: 40% auto, 40% auto, contain;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
	margin-bottom: 30px;
}
footer {
	width: 100%;
	text-align: center;
	box-sizing: border-box;
	padding: 1em;
	padding-top: 50px;
	background-image: url(images/footer_bgsp.png);
	background-repeat: repeat-x;
}
}
@media (max-width: 480px) {
.header_logo {
	width: 90%;
	padding-top: 50px;
	padding-bottom: 30px;
}
}




/* =======================================================
   PC（769px?）
======================================================= */
@media (min-width: 769px) {
#navi1 ul.menu {
	display: flex;
}
/* PCの hover アニメーション */
#navi1 li a {
	transition-duration: 0.3s;
}
#navi1 li a:hover {
	/* ふわっと浮く */
	transform: translateY(-10px);
	color: #00CC99;
}
}

/* =======================================================
   スマホ（?768px）
======================================================= */
@media (max-width: 768px) {
#navi1 li a {
	font-size: .8em;
	　padding: 3px;
}
/* メニュー本体 */
#navi1 ul.menu {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 9998;
	flex-direction: column;
	background-color: #F1FAFC;
	border-radius: 0;
	box-shadow: 0 2px 6px rgba(0,0,0,0.08);
	/* ▼ アニメーション用の初期値 */
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	transition: max-height 0.35s ease, opacity 0.35s ease;
}
/* 開いたときのアニメーション */
#navi1.open ul.menu {
	max-height: 100%; /* メニューの高さより少し大きめに */
	opacity: 1;
	padding-top: 60px;
}
/* メニュー本体をグリッドに変更 */
#navi1 ul.menu {
	display: grid;
	grid-template-columns: repeat(4, 1fr); /* 1行に４つ */
	gap: 10px 0; /* 上下の余白 */
	padding-top: 60px;
}
/* メニュー項目 */
#navi1 li a {
	flex-direction: column; /* アイコン＋文字は縦のまま */
	padding: 12px 16px;
	min-height: 80px;
}
#navi1 li a:hover {
	background-color: transparent;
	color: #3CC;
	padding: 12px 16px;
}
/* ハンバーガーボタン */
#navi1 .menu-btn {
	display: block;
	position: fixed;/*fixedにすると固定されるabsoluteで固定なし*/
	top: 10px;
	right: 10px;
	z-index: 9999;
	background-color: #0286C6; /* 単色水色 */
	padding: 10px;
	border-radius: 50%; /* 丸ボタン */
	box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}
/* 開いたときのアニメーション（×に変形） */
#navi1.open .menu-btn span:nth-child(1) {
	transform: translateY(8px) rotate(45deg);
}
#navi1.open .menu-btn span:nth-child(2) {
	opacity: 0;
}
#navi1.open .menu-btn span:nth-child(3) {
	transform: translateY(-8px) rotate(-45deg);
}

/* メニュー本体（閉じているとき） */
#navi1 ul.menu {
  pointer-events: none; 
}

/* 開いたときだけクリック可能にする */
#navi1.open ul.menu {
  pointer-events: auto; /* ← 開いたときだけ有効 */
}



}
 @media (max-width: 480px) {
/* メニュー本体をグリッドに変更 */
#navi1 ul.menu {
	display: grid;
	grid-template-columns: repeat(2, 1fr); /* 1行に2つ */
	gap: 10px 0; /* 上下の余白 */
	padding-top: 60px;
}
}
/*=======================================================
  TOPに戻る
=======================================================*/
#page-top {
	position: fixed;
	bottom: 20px;
	right: 10px;
	z-index: 997;
}
#page-top img {
	max-width: 100%;
	height: auto;
}
#page-top a {
	text-decoration: none;
	text-align: center;
	display: block;
}
#page-top a:hover {
	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;
}
.img_box {
	margin-inline: auto;
}
.box {
	/*width: 90%;*/
	margin-inline: auto;
}
/*リンクのホバー
a:hover {
	opacity: 0.6;
}
*/


/*-------------見出し-----------------*/


h2 {
	font-size: 2em;
	width: 100%;
}
h2 {
	position: relative;
	margin: 1em auto;
	text-align: center;
	font-family: "Kosugi Maru", sans-serif;
	letter-spacing: 0.1em;
	font-weight: 600;
	color: #336699;
	margin-bottom: 2em;
}
h2::after {
	content: "";
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: -1.5em; /* 文字との距離 */
	background-image: url(images/h2_img1.png);
	background-repeat: no-repeat;
	background-position: center;
	width: min(100%, 300px);
	height: 50px;
	background-size: 100% auto;
}
/* 旗のライン1---はやぷさ */
.h2_hayabusa {
	position: relative;
	margin: 1em auto;
	text-align: center;
	font-family: "Kosugi Maru", sans-serif;
	letter-spacing: 0.1em;
	font-weight: 600;
	color: #336699;
	margin-bottom: 2em;
}
.h2_hayabusa::after {
	content: "";
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: -1.5em; /* 文字との距離 */
	background-image: url(images/h2_img1.png);
	background-repeat: no-repeat;
	background-position: center;
	width: min(100%, 300px);
	height: 50px;
	background-size: 100% auto;
}
/* 旗のライン1---北海道新幹線 */
.h2_hkid {
	position: relative;
	margin: 1em auto;
	text-align: center;
	font-family: "Kosugi Maru", sans-serif;
	letter-spacing: 0.1em;
	font-weight: 600;
	color: #336699;
	margin-bottom: 2em;
}
.h2_hkid::after {
	content: "";
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: -1.5em; /* 文字との距離 */
	background-image: url(images/h2_img2.png);
	background-repeat: no-repeat;
	background-position: center;
	width: min(100%, 300px);
	height: 50px;
	background-size: 100% auto;
}
/*----PDFリンク----*/
.pdf {
	width: min(100%, 800px);
	margin-inline: auto;
}
.pdf li {
	list-style: none;
	margin-bottom: 1em;
}
.pdf li a {
	display: flex;
	align-items: center;
	gap: 1em;
	width: 100%;
	box-sizing: border-box;
	padding: 1em;
	background-color: #66CCCC;
	border-radius: 15px;
	text-decoration: none;
	color: #FFFFFF;
	font-family: "Kosugi Maru", sans-serif;
}
/* アイコン */
.pdf li a::before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f15b";
	color: #FFFFFF;
	font-size: 1.5em;
	flex-shrink: 0;
}
/* hover */
.pdf li a:hover {
	background-color: #CFEFDF;
	color: #0066CC;
	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;
}
/*--------------------------------
  UL（アイコンリスト）
--------------------------------*/
.liststyle ul {
	padding-top: 1em;
	margin-bottom: 1em;
	list-style: none;
	padding-left: 2em; /* ← ol と揃える基準 */
}
.liststyle ul li {
	position: relative;
	margin-bottom: .5em;
	padding-left: 0.1em; /*  アイコンと文字の距離 */
}
.liststyle ul li::before {
	content: "\f0c8";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #E6378E;
	position: absolute;
	left: -1.3em;
	top: 0em;
	font-size: 1em;
}
/*--------------------------------
  OL（番号付きリスト）
--------------------------------*/
.liststyle ol {
	padding-top: 1em;
	margin-bottom: 1em;
	list-style: none;
	counter-reset: li;
	padding-left: 1.5em; /* ← ul と揃える基準 */
}
.liststyle ol li {
	position: relative;
	padding-left: .5em; /* 番号と文字の距離 */
	line-height: 1.5;
}
.liststyle ol li:not(:first-child) {
	margin-top: 0.5em;
}
.liststyle ol li::before {
	counter-increment: li;
	content: counter(li);
	position: absolute;
	left: -1.3em;
	top: 0.1em;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: #42BB9F;
	font-size: 12px;
	color: #fff;
	line-height: 20px;
	text-align: center;
}
/*--------------------------------
  テーブル
--------------------------------*/
.liststyle table {
	border-collapse: separate;
	border-spacing: 3px;
	margin-bottom: 1em;
	margin-top: 1em;
}
.liststyle table th {
	background-color: #E4F3F5;
	padding: 10px;
	color: #006699;
	font-weight: bold;
}
.liststyle table td {
	background-color: #F9F7F4;
	padding: 10px;
	color: #333333;
}
.liststyle h3 {
	font-size: 1.2em;
	margin-bottom: .5em;
	color: #E04195;
	font-family: "Kosugi Maru", sans-serif;
}
 @media only screen and (max-width: 480px) {
.liststyle table {
	width: 100%;
	box-sizing: border-box;
	border-spacing: 0;
}
.liststyle table th, .liststyle table td {
	display: block;
	width: 100%;
	box-sizing: border-box;
}
h2 {
	font-size: 1.5em;
}
}
/*=======================================================*/
/*　　　　　　レスポンシブテーブル                       */
/*=======================================================*/



.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;*/
}
}
/*レスポンシブテーブルここまで*/





/*=======================================================*/
/*　　　　　　　　　写真の表示　　                       */
/*=======================================================*/


/*アルバム　横3枚*/
.album3 {
	width: min(100% - 2em, 1200px);
	margin: 0 auto 1em auto;
	box-sizing: border-box;
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}
.album3 li {
	width: calc(100% / 3 - 10px);
	margin-bottom: .5em;
	text-align: center;
	box-sizing: border-box;
}
.album3 li img {
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 300px;
	margin-bottom: 2px;
	border-radius: 10px;
}
.album3 figcaption {
	font-size: 0.8em;
	color: #003399;
	box-sizing: border-box;
	width: 100%;
	padding: 2px;
	text-align: center;
}
.album3 figure {
	margin-bottom: 1em;
}
/*アルバム　横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;
}
.album2 figcaption {
	font-size: 0.8em;
	color: #663300;
	box-sizing: border-box;
	width: 100%;
	padding: 2px;
	text-align: center;
}
 @media screen and (max-width:768px) {
.album3 li {
	width: calc(100% / 2 - 10px);
	margin-bottom: .5em;
}
}
 @media screen and (max-width:480px) {
.album2 li {
	box-sizing: border-box;
	width: 100%;
	height: autot;
	padding: 10px;
	margin-bottom: .5em;
}
.album3 li {
	box-sizing: border-box;
	width: 100%;
	height: auto;
	padding: 10px;
	margin-bottom: .5em;
}
}
/*写真の表示ここまで*/



/*=======================================================*/
/*　　　　　　　　　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;
}
/*中の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) {
.inboxy {
	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;
}
.bg_wave {
	background-image: url(images/bg_wave_top.png), url(images/bg_wave_btm.png);
	background-position: center top -2px, center bottom -2px;
	background-repeat: repeat-x, repeat-x;
	padding-top: 60px;
	padding-bottom: 100px;
}
.bg_wave2 {
	background-image: url(images/bg_wave_top.png), url(images/bg_wave_btm2.png);
	background-position: center top -2px, center bottom -2px;
	background-repeat: repeat-x, repeat-x;
	padding-top: 60px;
	padding-bottom: 100px;
}
 @media screen and (max-width: 768px) {
.bg_wave {
	background-image: url(images/bg_wave_top.png), url(images/bg_wave_btm.png);
	background-position: center top -2px, center bottom -2px;
	background-repeat: no-repeat, no-repeat;
	background-size: 100% auto, 100% auto;
	padding-top: 60px;
	padding-bottom: 100px;
}
.bg_wave2 {
	background-image: url(images/bg_wave_top.png), url(images/bg_wave_btm2.png);
	background-position: center top -2px, center bottom -2px;
	background-repeat: no-repeat, no-repeat;
	background-size: 100% auto, 100% auto;
	padding-top: 60px;
	padding-bottom: 100px;
}
}
/*-----------------------------------
　　　　TOPページ　index.html
------------------------------------*/

/*------------ slickの設定 -----------*/



/* 矢印 */
.slick01 .slick-arrow {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-color: #F99;
	cursor: pointer;
	border: none;
	outline: none;
	font-size: 0;
	position: absolute;
	top: 50%;
	z-index: 1;
	filter: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.16));
}
.slick01 .slick-arrow::before {
	content: '';
	display: block;
	width: 20px;
	height: 20px;
	border: 3px solid #fff;
	border-width: 3px 3px 0 0;
	position: absolute;
	top: 15px;
	transform: rotate(45deg);
}
.slick01 .slick-next {
	right: 20%;
}
.slick01 .slick-prev {
	left: 20%;
}
.slick01 .slick-next::before {
	left: 10px;
}
.slick01 .slick-prev::before {
	border-width: 0 0 3px 3px;
	right: 10px;
}
/* ドット */
.dots01 .slick-dots {
	text-align: center;
}
.dots01 .slick-dots li {
	display: inline-block;
}
.dots01 .slick-dots button {
	display: block;
	width: 10px;
	height: 10px;
	margin: 6px;
	font-size: 0;
	padding: 0;
	border: 0;
	outline: none;
	cursor: pointer;
	background-color: #3366CC;
	border-radius: 50%;
}
.dots01 .slick-dots .slick-active button {
	background-color: #00CCFF;
}
.dots01 {
	position: absolute;
	bottom: 20px; /* ドットの位置をもう少し下に移動 */
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	z-index: 99;
}
/*----- スライドショー -----*/
.ssbg {
	background-image: url(images/bg_ss01.png), url(images/bg_ss02.png);
	background-repeat: no-repeat, no-repeat;
	background-position: center top, center bottom;
}
#ss {
	margin: 0 auto 100px auto;
	position: relative;
	width: min(100% - 2em, 1400px);   /* スライドショー全体の最大幅 */
	text-align: center;
	margin: 0 auto 100px auto;
	position: relative;
}
#ss ul {
}
#ss li img {
	width: 98%;
	margin-inline: auto;
	height: 55vw;
	max-height: 800px;
	object-fit: cover;
}
/* イラスト重ね */
.slide_illust, .slide_illust2, .slide_illust3, .slide_illust4 {
	position: absolute;
	z-index: 98;
	pointer-events: none;
}
.slide_illust {
	width: 100%;
	margin-inline: auto;
	top: -2px;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}
.slide_illust2 {
	max-width: 15%;
	left: 0;
	bottom: 0;
}
.slide_illust3 {
	max-width: 15%;
	right: 0;
	bottom: 0;
}
.slide_illust4 {
	text-align: center;
	width: 80%;
	top: 10%;
	left: 50%;
	transform: translateX(-50%);
}


/*=== スライドショーレスポンシブ設定 ===*/

@media screen and (max-width: 768px) {
#ss {
	margin-bottom: 20px;
}
#ss .slider img {
	width: 100%;
	height: auto;
}
#ss li img {
	height: 55vw;
}
.slide_illust4 {
	width: 70%;
	top: 10%;
	left: 50%;
	transform: translateX(-50%);
}
}
@media screen and (max-width: 480px) {
#ss {
	margin-bottom: 20px;
}
#ss .slider img {
	border-radius: 1em;
	width: 90%;
	height: auto;
}
#ss li img {
	height: 55vw;
}
.slide_illust4 {
	width: 70%;
	top: 10%;
	left: 50%;
	transform: translateX(-50%);
}
}
/* ------   更新情報-------- */
#news {
	background-color: #DFF4FD;
}
#news .contents {
	width: min(100% - 2em, 1000px);
	margin-inline: auto;
	background-color: #FFFFFF;
	padding: 10px;
	border-radius: 30px;
	box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.3);
}
#news .news-list {
	list-style: none;
	margin: 0 auto;
	padding: 0;
	width: 96%;
}
#news .news-list li {
	display: flex;
	gap: 1em;
	padding: 12px 0;
	border-bottom: 1px solid #e8e4df;
	color: #5a4f46;
	line-height: 1.6;
}
/* 日付：固定幅で揃える */
#news .news-list .date {
	width: 110px;
	flex-shrink: 0;
	color: #E95892;
	font-weight: bold;
}
/* 内容 */
#news .news-list .text {
	flex: 1;
	word-break: break-word;
}
/*---- 基本情報 ----*/
#kihon {
	margin-bottom: 30px;
	box-sizing: border-box;
	background-image: url(images/bg_img01.png);
	background-position: center center;
	background-repeat: repeat-x;
}
.add {
	width: 60%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
#kihon .img_box {
	width: 35%;
	text-align: center;
}
#kihon .img_box img {
	border-radius: 30px;
	width: 100%;
	max-width: 500px;
	height: auto;
}
#kihon table {
	width: min(100%, 600px);
	margin: 0 auto;
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid #e5e2dd;
	border-radius: 10px;
	overflow: hidden;
	background: #fff;
	font-size: 1rem;
	line-height: 1.5;
}
/* セル */
#kihon th, #kihon td {
	padding: 12px 14px;
	border-bottom: 1px solid #f0ede9;
	color: #5a4f46;
	font-family: "Kosugi Maru", sans-serif;
}
/* 見出しセル */
#kihon th {
	background-color: #E9F8F5;
	font-weight: bold;
	color: #006699;
}
/* 最終行のボーダー消し */
#kihon tr:last-child td {
	border-bottom: none;
}
/*---- Googleマップ ----*/
#map {
	margin-bottom: 50px;
}
#map iframe {
	width: 100%;
	height: 450px;
}
.map_info {
	width: min(100% - 2em, 600px);
	margin: 1em auto;
	background-color: #DFF4FD;
	border-radius: 20px;
	line-height: 1.5em;
	color: #666666;
	font-family: "Kosugi Maru", sans-serif;
	padding: 1em;
}
.map_info h3 {
	padding: 0.3em;
	border-bottom: 3px solid #FF1A5f;
	color: #336699;
	font-family: "Kosugi Maru", sans-serif;
	font-size: 1.2em;
	margin-bottom: 1em;
}
#map .map_info dl dt {
	display: inline-block;
	color: #009999;
	margin-bottom: 0.5em;
}
#map .map_info dl dd {
	display: inline-block;
	color: #666666;
	margin-bottom: 1em;
	padding-left: 1em;
}


/*=== index.htmlレスポンシブ設定 ===*/



@media screen and (max-width: 768px) {
/*#kihon 基本情報*/	
.add {
	width: 100%;
	text-align: center;
	margin-bottom: 20px;
}
#kihon {
	background-image: none;
}
#kihon .img_box {
	width: 100%;
}
}

/*---------- スマホ対応（480px以下）-------------*/

@media screen and (max-width: 480px) {
/* #news お知らせ　スマホ対応 */
#news .news-list li {
	flex-direction: column;
	padding: 10px 0;
}
#news .news-list .date {
	width: auto;
	margin-bottom: 0px;
}
/*#kihon 基本情報スマホ対応*/

#kihon table, #kihon thead, #kihon tbody, #kihon th, #kihon td, #kihon tr {
	display: block;
	width: 100%;
}
#kihon tr {
	margin-bottom: 0rem;
	border-bottom: 1px solid #e5e2dd;
}
#kihon tr:last-child {
	border-bottom: none;
}
#kihon th {
	background-color: #EDF7FC;
	color: #339999;
	font-size: 1em;
	padding-bottom: 4px;
	border-bottom: none;
}
#kihon td {
	padding-top: 5px;
	border-bottom: none;
	background: none !important;
}
}
/*----------------------------------

　　　　教育について　education.html

-----------------------------------*/
#about {
}
/*-----保育目標-----*/
#moku {
	margin-bottom: 3em;
}
#moku h3 {
	width: 100%;
	text-align: center;
	font-size: 2em;
	margin-bottom: 1em;
	font-family: "Kosugi Maru", sans-serif;
	font-weight: 900;
}
.moku1 h3 {
	color: #549FD8;
}
.moku2 h3 {
	color: #FF6699;
}
.moku3 h3 {
	color: #FFCC33;
}
.moku1, .moku2, .moku3 {
	width: calc(100% / 3 - 20px);
	text-align: center;
	padding: 1em;
	border-radius: 20px;
	text-align: center;
	font-family: "Kosugi Maru", sans-serif;
	color: #736B57;
}
.moku1 {
	background-color: #ECF5FB;
}
.moku2 {
	background-color: #FFF0F4;
}
.moku3 {
	background-color: #FDF8EA;
}
#moku p {
	margin-bottom: 30px;
}
#moku img {
	max-width: 300px;
	width: 100%;
}
#moku figure {
	width: 100%;
	box-sizing: border-box;
	padding: 10px;
}
/*-----とねり伊藤幼稚園とは-----*/
#toneri {
	background-color: #BFE8FF;
}
#toneri .contents {
	width: min(100% - 2em, 1000px);
	line-height: 1.5;
}
#toneri h2 {
	margin-bottom: 100px;
}
#toneri .contents ul li {
	margin-bottom: 1em;
	padding: 1em;
	font-family: "Kosugi Maru", sans-serif;
	color: #645F51;
	border-radius: 10px;
}
#toneri ul li:nth-child(odd) {
	background-color: #F7FBFF; /* 薄いピンク（奇数） */
}
#toneri ul li:nth-child(even) {
	background-color: #FFFFF4; /* クリーム（偶数） */
}
#toneri .bgimg1 {
	background-image: url(images/bg_kumo.png);
	background-position: center top;
	background-repeat: no-repeat;
}
/*-----園について----*/
#about {
	margin-bottom: 150px;
	background-image: url(images/bg_img02.png);
	background-position: top center;
}
#about .contents {
	display: flex;
	flex-wrap: wrap;
	border-radius: 30px;
	overflow: hidden; /* 角丸を子要素に反映させる */
	border: 1px solid #ccc;
	margin-bottom: 2em;
	background-color: #FFFFFF;
	width: min(100% - 2em, 1000px);
}
/* 見出し */
#about .contents h3 {
	width: 100%;
	background-color: #55A5EC;
	color: #fff;
	padding: 1em;
	margin: 0;
	border-radius: 30px 30px 0 0;
	font-size: 1.2em;
	font-family: "Kosugi Maru", sans-serif;
}
/* テキスト側 */
#about .txt_box {
	width: 70%;
	padding: 15px;
	box-sizing: border-box;
}
/* 画像側 */
#about .img_box {
	width: 30%;
	padding: 1em;
	text-align: center;
}
#about .img_box img {
	display: block;
	max-width: 300px;
	border-radius: 10px;
	width: 100%;
	margin: auto;
}

/*=== 教育について　education.htmlレスポンシブ設定 ===*/

@media screen and (max-width: 768px) {
.moku1, .moku2, .moku3 {
	width: min(100%, 500px);
	margin: .5em auto;
	text-align: center;
	padding: 1em;
	border-radius: 20px;
	text-align: center;
	font-family: "Kosugi Maru", sans-serif;
	color: #736B57;
}
/* テキスト側 */
#about .txt_box {
	width: 100%;
	padding: 15px;
	box-sizing: border-box;
}
/* 画像側 */
#about .img_box {
	width: 100%;
	padding: 1em;
	text-align: center;
}
}
@media screen and (max-width: 480px) {
}
/*----------------------------------
　　　
　　　園の生活　life.html

　　　　　一日の流れ　#daily
-----------------------------------*/
#daily {
}
.bg_img2 {
	background-image: url(images/bg_img02.png);
	background-position: center top;
}
#daily .contents {
	width: min(100% - 2em, 800px);
	margin-inline: auto;
	margin-bottom: 2em;
}
.timeline {
	position: relative;
	margin-top: 30px;
}
/*縦に走るライン*/
.timeline::before {
	content: "";
	position: absolute;
	left: 92px;
	top: 0;
	width: 8px;
	height: 100%;
	background-color: #52C0AD;
	border-radius: 5px;
}
.item {
	display: flex;
	align-items: flex-start;
	margin-bottom: 25px;
	position: relative;
}
.time {
	width: 80px;
	font-size: 1.2em;
	font-weight: bold;
	color: #F955AB;
	font-family: "M PLUS 1p", sans-serif;
}
.dot {
	width: 32px;
	height: 32px;
	background-color: #52C0AD;
	border-radius: 50%;
	margin-right: 20px;
	margin-top: 0px;
	position: relative;
	z-index: 1;
}
.card {
	background-color: #EBF8F5;
	padding: 10px;
	padding-right: 20%;
	border-radius: 10px;
	flex: 1;
	font-family: "Kosugi Maru", sans-serif;
}
.title {
	font-size: 16px;
	color: #009999;
	margin-bottom: 5px;
}
.desc {
	font-size: 14px;
	color: #666;
}
.timeline .img_box {
	position: absolute;
	width: 20%;
	height: 100%;
	top: 0;
	left: 80%;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	align-items: center;
}
.timeline .img_box img {
	max-height: 24%;
	width: auto;
}
.daily_photo {
	background-color: #CAECE4;
	padding-top: 100px;
}


/*=== 一日の流れ レスポンシブ設定 ===*/

@media (max-width: 768px) {
}

/* 480px以下：スマホ向け微調整 */
@media (max-width: 480px) {
/*縦に走るライン*/
.timeline::before {
	content: "";
	position: absolute;
	left: 62px;
	top: 0;
	width: 6px;
	height: 100%;
	background-color: #52C0AD;
	border-radius: 2px;
}
.item {
	display: flex;
	align-items: flex-start;
	margin-bottom: 25px;
	position: relative;
}
.time {
	width: 55px;
	font-size: 16px;
	font-weight: bold;
	color: #F955AB;
}
.dot {
	width: 20px;
	height: 20px;
	background-color: #52C0AD;
	border-radius: 50%;
	margin-right: 20px;
	margin-top: 0px;
	position: relative;
	z-index: 1;
}
}
/*------------------------

　　　　年間行事 #year

-------------------------*/
#year {
}
/* 全体のレイアウト */
.event.contents {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	justify-content: space-between;
	padding: 40px 0;
}
/* 各月のボックス */
.ybox {
	background-color: #ECF0F2;
	border-radius: 14px;
	padding: 16px;
	width: calc(25% - 15px); /* PC：4つ並び */
	box-shadow: 0 2px 6px rgba(0,0,0,0.05);
	position: relative;
	margin-bottom: 40px;
	padding-top: 30px;
	color: #006699;
	font-family: "Kosugi Maru", sans-serif;
}
/* タイトル */
.ybox h3 {
	position: absolute;
	top: -30px;
	left: 50%;
	transform: translateX(-50%);
	width: 60%;
	height: auto;
	text-align: center;
}
.ybox h3 img {
}
/* 行事リスト */
.ybox ul {
	margin: 1em auto;
}
.ybox ul li {
	line-height: 1.3;
	margin-bottom: .7em;
}
/* 毎月の行事 */
.monthly {
	width: 100%;
	background: #eef4f7;
	border-radius: 14px;
	padding: 20px;
	margin-top: 30px;
	box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}
.monthly h3 {
	font-size: 1.3rem;
	margin-bottom: 10px;
	color: #4a6b7c;
}
/*--年間行事写真--*/
.year_photo {
	background-color: #79CDFB;
	padding-top: 100px;
}



/*=== 年間行事 レスポンシブ設定 ===*/
/* タブレット：2列 */
@media (max-width: 768px) {
.ybox {
	width: calc(50% - 10px);
}
}

/* スマホ：1列 */
@media (max-width: 480px) {
.ybox {
	width: 100%;
}
}
/*----------------------------------

　　　　入園について nyuen.html

-----------------------------------*/
#nyuen {
	background-image: url(images/bg_kimo2.png);
	background-position: center top;
	background-repeat: no-repeat;
}
#nyuen section {
	width: min(100% - 2em, 900px);
	margin: 1em auto;
	border-radius: 20px;
	overflow: hidden; /* 角丸を子要素に反映させる */
	border: 1px solid #ccc;
	margin-bottom: 2em;
	background-color: #FFFFFF;
}
/* 見出し */
#nyuen section h3 {
	width: 100%;
	background-color: #46BDF0;
	color: #fff;
	padding: 1em;
	margin: 0;
	font-size: 1.2em;
	font-family: "Kosugi Maru", sans-serif;
}
/*テキスト部分*/
#nyuen .txt_box {
	padding: 1em;
	line-height: 1.5em;
	color: #666666;
	margin-bottom: 1em;
}
#nyuen .contents .pdf{
	padding:1em;
}
/*=== 入園についてnyuen.html レスポンシブ設定 ===*/

@media screen and (max-width: 768px) {
}
@media screen and (max-width: 480px) {
}
/*----------------------------------

　　　　子育て支援 shien.html

-----------------------------------*/
#shien {
}
.shien_info {
	width: min(100% - 2em, 1000px);
	margin: 1em auto;
	padding: 1em;
	padding-bottom: 120px;
	background-image: url(images/bg_shieninfo.png);
	background-position: center bottom;
	background-repeat: repeat-x;
	background-color: #E9FAF7;
	border-radius: 20px;
	margin-bottom: 50px;
	color: #27A58B;
	font-family: "Kosugi Maru", sans-serif;
}
.shienbg {
	background-image: url(images/bg_wave_top.png), url(images/bg_wave_btm2.png), linear-gradient(to bottom, #B7F3F4, #DAF4FA);
	background-position: center top -2px, center bottom -2px, center;
	background-repeat: repeat-x, no-repeat-x, no-repeat;
	background-size: auto, auto, 100% 100%;
	padding-top: 100px;
	padding-bottom: 100px;
}
#shien section {
	width: min(100% - 2em, 1200px);
	margin: 1em auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
	overflow: hidden; /* 角丸を子要素に反映させる */
	border: 1px solid #ccc;
	margin-bottom: 2em;
	background-color: #FFFFFF;
	border-radius: 30px;
}
#shien section h3 {
	margin-bottom: 20px;
	width: 100%;
	padding: 1em;
	box-sizing: border-box;
	text-align: center;
	font-size: 1.3em;
	font-family: "Kosugi Maru", sans-serif;
	font-weight: bold;
	color: #fff;
	background-color: #42B9B3;
}
#shien .box_l {
	width: 70%;
	padding: 1em;
}
#shien .img_box {
	width: 30%;
	text-align: center;
	padding: 10px;
}
#shien .img_box img {
	margin: auto;
	border-radius: 10px;
	text-align: center;
}
#shien .pdf {
	padding: 20px 0;
}
	
	
	
/*=== 子育て支援 shien.html レスポンシブ設定 ===*/

@media screen and (max-width: 768px) {
#shien .box_l {
	width: 100%;
	padding: 1em;
}
#shien .img_box {
	width: 100%;
	text-align: center;
	padding: 10px;
}
#shien .img_box img {
	margin: auto;
	border-radius: 10px;
	width: 100%;
	height: auto;
	max-width: 400px;
	text-align: center;
}
#shien .pdf {
	padding: 10px 0;
}
}
@media screen and (max-width: 480px) {
.shienbg {
	background-image: url(images/bg_wave_top.png), url(images/bg_wave_btm2.png), linear-gradient(to bottom, #B7F3F4, #DAF4FA);
	background-position: center top -2px, center bottom -2px, center;
	background-repeat: repeat-x, no-repeat-x, no-repeat;
	background-size: 100% auto, auto, 100% 100%;
	padding-top: 100px;
	padding-bottom: 100px;
}
	
}
/*----------------------------------

　　　　さくらんぼ組 sakuranbo.html

-----------------------------------*/
#sakuranbo {
	background-image: url(images/bg_img02.png);
	background-position: center center;
	background-repeat: no-repeat;
}
#sakuranbo h1 {
	text-align: center;
	margin: 2em auto;
}
#sakuranbo .info {
	width: min(100% - 2em, 1000px);
	margin-inline: auto;
	margin-bottom: 2em;
	padding: 1em;
	padding-bottom:50px;
	border-radius: 30px;
	font-family: "Kosugi Maru", sans-serif;
	line-height: 1.5;
	background-color: #EAF8FB;
	display: flex;
	flex-wrap: wrap;
	align-content: space-between;
	background-image:url(images/sakuranbo2.png);
	background-position:bottom center;
	background-repeat: repeat-x;
}
#sakuranbo .info .txt_box {
	width: 90%;
	margin:1em auto;
	line-height: 1.5em;
	color: #0066CC;
}
#sakuranbo .info .img_box {
	width: 30%;
	padding: 10px;
	text-align: center;
}
#sakuranbo h2, #expression h2 {
	font-size: 1.6em;
	line-height: 2em;
}
/*自由表現*/

#expression {
	background-image: url(images/bg_wave_top.png), url(images/bg_wave_btm2.png), linear-gradient(to bottom, #FFEEF2, #DAF4FA);
	background-position: center top -2px, center bottom -2px, center;
	background-repeat: repeat-x, repeat-x, no-repeat;
	background-size: auto, auto, 100% 100%;
	padding-top: 60px;
	padding-bottom: 100px;
}
#expression .info {
	width: min(100% - 2em, 1000px);
	margin-inline: auto;
	margin-bottom: 2em;
	padding: 1em;
	border-radius: 30px;
	font-family: "Kosugi Maru", sans-serif;
	line-height: 1.5;
	color: #666666;
}
#expression .info h3 {
	width: 100%;
	margin-bottom:1em;	
	text-align: center;
}
.expression_time .txt_box {
	width: min(100% - 2em, 1000px);
	margin-inline: auto;
	margin-bottom: 2em;
	border-radius: 30px;
	font-family: "Kosugi Maru", sans-serif;
	line-height: 1.5;
	background-color: #fff;
	color: #666666;
	margin-bottom: 2em;
	overflow: hidden; /* 角丸を子要素に反映させる */
	border: 1px solid #ccc;
}
.expression_time .txt_box h3 {
	background-color: #E66A96;
	padding: .7em 1em;
	font-size: 1.1em;
	color: #fff;
	font-family: "Kosugi Maru", sans-serif;
	font-weight: bold;
}
.expression_time .txt_box .inner {
	padding: 1em;
}
/*=== さくらんぼ組 sakuranbo.html レスポンシブ設定 ===*/

@media screen and (max-width: 768px) {
	#sakuranbo .info .txt_box {
	width: 100%;
	line-height: 1.5em;
	color: #0066CC;
}
#sakuranbo .info .img_box {
	width: 100%;
	padding: 10px;
	text-align: center;
}

}
@media screen and (max-width: 480px) {
#expression .info {
	padding: 0;	
}
#expression {
	background-image: url(images/bg_wave_top.png), url(images/bg_wave_btm2.png), linear-gradient(to bottom, #FFEEF2, #DAF4FA);
	background-position: center top -2px, center bottom -2px, center;
	background-repeat: repeat-x, repeat-x, no-repeat;
	background-size: 100% auto, auto, 100% 100%;
	padding-top: 60px;
	padding-bottom: 100px;
}

}
/*----------------------------------

　　　　ブログ blog.html

-----------------------------------*/

#blog {
	width: min(100% - 2em, 1200px);
	margin-inline: auto;
	margin-bottom: 50px;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: flex-start;
	padding-top: 50px;
	gap: 20px;
	box-sizing: border-box;
}
/* グラデーションの背景*/
.blog_bg {
	background-image: url(images/bg_wave_top.png), url(images/bg_wave_btm2.png), linear-gradient(to bottom, #DAF4FA, #A8DEFF);
	background-position: center top -2px, center bottom -2px, center;
	background-repeat: repeat-x, repeat-x, no-repeat;
	background-size: auto, auto, 100% 100%;
	padding-top: 60px;
	padding-bottom: 100px;
}
/*category*/
#category {
	width: 25%;
	background-color: #EAFDF9;
	border-radius: 20px;
	overflow: hidden;
}
/*ブログ記事スペース*/
#blog_main {
	width: 75%;
	box-sizing: border-box;
}
/* カテゴリー詳細 */
#category h3 {
	text-align: center;
	font-size: 1.2em;
	font-weight: bold;
	padding: 1em;
	color: #fff;
	background-color: #56C0B9;
	border-bottom: solid 5px #BB77F2;
	font-family: "Kosugi Maru", sans-serif;
}
#category ul {
	box-sizing: border-box;
	padding: 1em;
}
#category li {
	box-sizing: border-box;
	margin-bottom: 1em;
	border-bottom: 2px #A0DEDD dotted;
}
#category li a {
	color: #307AB8;
	text-decoration: none;
}
#category li a:hover {
	color: #FF6699;
}
/* ブログ記事詳細 */
.blogbox {
	background-color: #FFF;
	border-radius: 1em;
	margin-bottom: 2em;
	padding-bottom: 2em;
	overflow: hidden;
}
.blogbox h3 {
	font-size: 1.2em;
	font-weight: bold;
	padding: 1em;
	color: #fff;
	background-color: #56C0B9;
	border-bottom: solid 5px #BB77F2;
	font-family: "Kosugi Maru", sans-serif;
}
.blog_date {
	text-align: right;
	font-size: 0.85em;
	padding: 0.5em;
	color: #EE5B84;
}
.blog_txt {
	margin-inline: auto;
	width: min(100% - 2em);
	line-height: 1.5em;
	margin-bottom: 1em;
	color: #3D7270
}
/* 写真 */
.blog_photo {
	margin-inline: auto;
	width: 100%;
}
.blogbox .blog_photo img {
	border-radius: 5px;
}
/* PDF */
#blog .pdf {
	width: min(100% - 2em, 600px);
	margin: 1em auto;
}
/* YouTube */
.movie {
	margin-inline: auto;
	width: min(100% - 2em);
}
.youtube {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}
.youtube iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
}
/*===============================
        Pager（ページャー）
===============================*/

.pager {
	width: 100%;
	margin: 3em 0;
}
.pagination {
	display: flex;
	justify-content: center;
	gap: 0.5em;
	padding: 0;
	list-style: none;
}
/* 各ボタン */
.pagination li {
	width: 50px;
	height: 50px;
	background-color: #AEE3F5; /*ボタン背景色水色 */
	border-radius: 12px;
	position: relative;
	/*box-shadow: 2px 2px 4px rgba(0,0,0,0.15);*/
	transition: 0.2s ease;
}
/* リンク */
.pagination li a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	font-size: 1.1em;
}
/* アクティブ（現在のページ） */
.pagination li a.active {
	background-color: #7CC7E8;
	border-radius: 12px;
}
/* ホバー */
.pagination li:hover {
	background-color: #D6F3FF;
	transform: translateY(-2px);
}
.pagination li:hover a {
	color: #0077A8;
}
/* 前へ・次へ */
.pagination li.pre, .pagination li.next {
	width: 60px;
}

/*=== blog.htmlレスポンシブ設定 ===*/
@media screen and (max-width: 767px) {
.pagination li {
	display: none;
}
.pagination li.pre, .pagination li.next {
	display: flex;
	width: 40%;
	height: 50px;
}
.pagination li.pre a span::after {
	content: "";
}
.pagination li.next a span::before {
	content: "";
}
}
/*---------------------- タブレット以下 ----------------------*/

@media screen and (max-width: 768px) {
#blog {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
}
#category {
	width: 100%;
	margin-bottom: 2em;
}
#blog_main {
	width: 100%;
}
}

/*---------------------- スマートフォン ----------------------*/

@media screen and (max-width: 480px) {
	
.blog_bg {
	background-image: url(images/bg_wave_top.png), url(images/bg_wave_btm2.png), linear-gradient(to bottom, #DAF4FA, #A8DEFF);
	background-position: center top -2px, center bottom -2px, center;
	background-repeat: repeat-x, repeat-x, no-repeat;
	background-size:100% auto, auto, 100% 100%;
	padding-top: 60px;
	padding-bottom: 100px;
}
	
	
}
/*=====================フォントライブラリ================================*/

.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);
}
}