@charset "UTF-8"; /* 文字コード指定（削除不可） */
@-ms-view-port{ width:device-width; }
@-webkit-view-port{ width:device-width; initial-scale:1.0; }
@view-port{ width:device-width; initial-scale:1.0; }
@import url("decoration.css");

/*====================================================
【テンプレート】esto - ver.1.0.0
【配布元】alevirita  http://a-c.2-d.jp/
【サポート】emアットマークa-c.2-d.jp
=====================================================*/

@font-face { font-family:"游明朝M"; src: local("Yu Mincho Medium"); font-weight:500; }
@font-face{ font-family:"游ゴシックM"; src: local("Yu Gothic Medium"); font-weight:500; }
html,pre,code,input,select,textarea,table,kbd,samp,tt{ font-size:100%; }
html{ line-height:1.4; font-family:Sans-serif; }::before,::after{ line-height:1.2; box-sizing:border-box; }
div>ins,div>del{ display:block; }ol,ul{ list-style-position:outside; }
html,body,li,dt,dd,li address,li form{ margin:0; padding:0; }
p,form,ol,ul,dl,address,blockquote,pre{ margin:1em 5px; padding:0; }
li ol,li ul,li dl,dd ol,dd ul,dd dl,dd form,td form{ margin-top:.35em; margin-bottom:.35em; }
li,dd{ margin-left:2em; }fieldset+fieldset,dd+dt{ margin-top:.5em; }i{ margin-right:.2em; }
code,dfn,kbd,samp,var{ margin:0 .1em; }table{ margin:1em auto; border-collapse:collapse; }
th,td{ vertical-align:top; text-align:left; padding:.3em .5em; border:1px solid; }
button,input,select,textarea{ line-height:normal; text-transform:none; }
table,iframe,button,input,select,textarea,legend,div{ box-sizing:border-box; }
li address,li form{ display:inline; border:none; background:transparent none; color:inherit; }
address,dfn,em,cite,kbd{ font-style:normal; }em,strong,caption,th,dfn,kbd kbd,b{ font-weight:700; }
em em,strong strong{ font-size:120%; }sub,sup{ line-height:1; }del{ text-decoration:line-through; opacity:.5; }
a{ font:inherit; font-size:inherit; background-color:transparent; }a:not([href]):hover{ color:inherit; }
a:link{ text-decoration:underline; }a:hover{ text-decoration:none; }
abbr[title],acronym[title]{ border-bottom:none; text-decoration:underline; text-decoration:underline dotted; }
pre{ line-height:1.3; border:1px dashed; padding:8px; overflow:auto; }
q{ quotes:"\201c" "\201d" "\2018" "\2019" "\201c" "\201d"; }
q::before{ content:open-quote; font-family:"ＭＳ Ｐ明朝",Serif; }
q::after{ content:close-quote; font-family:"ＭＳ Ｐ明朝",Serif; }
q,blockquote,cite{ font-family:YuMincho,"游明朝M","游明朝","Hiragino ProN W3","ＭＳ Ｐ明朝",Serif; }
code{ font-family:Consolas,"Courier New",Osaka-mono,MeiryoUI,monospace; font-weight:500; }
pre,samp,kbd { font-family:monospace, monospace; }
var{ font-family:Georgia,"Hiragino ProN W3","ＭＳ Ｐ明朝",Serif; font-style:italic; margin-right:.2em; }
q,blockquote,textarea[disabled],button[disabled],input[disabled]{ cursor:default; }
abbr[title],acronym[title],ins[title],del[title],q[title],span[title]{ cursor:help; }
[type="button"],[type="reset"],[type="submit"],button,[type="radio"],[type="checkbox"],[type="file"]{ cursor:pointer; }
input[type="checkbox"],input[type="radio"],input[type="image"]{ padding:0; border:none; }
table,iframe,object,input[type="text"],input[type="password"],textarea,legend,img{ max-width:100%; }
img{ height:auto; margin:1px 0; border:none; vertical-align:middle; }p img{ vertical-align:text-bottom; }
textarea,iframe,pre{ max-height:75vh; }fieldset{ border:1px solid; margin:0 2px; padding:.35em .625em .75em; border-radius:5px; }
legend{ color:inherit; display:table; padding:0 .5em; white-space:normal; }
button,input,select,textarea{ vertical-align:text-bottom; margin:.12em 0; }
input[type="text"],input[type="password"]{ padding:.2em .5em; }input[type="radio"],input[type="checkbox"]{ margin:0 .2em; vertical-align:middle; }textarea{ overflow:auto; padding:.5em; line-height:1.3; }
li input,li textarea,li select,li button,dt input,dt textarea,dt select,dt button{ vertical-align:middle; }
hr{ box-sizing:content-box; background:transparent; height:0; overflow:visible; }
h1,h2,h3,h4,h5,h6{ margin:1em 0 .3em; font-weight:800; line-height:1.3; }
h1{ font-size:170%; }h2{ font-size:150%; }h3{ font-size:135%; }h4{ font-size:115%; }h5,h6{ font-size:100%; }
#PAGETOP::after{ content:""; display:block; clear:both; }#MENU h2,#FOOTER h2{ display:none; }
div.text hr{ border-width:4px 0 0; border-style:double; margin:2em 0; }
#PAN{ list-style-type:decimal; }
#PAN>li,li[id^="MENU"],li[id^="FOOTER"]{ box-sizing:border-box; word-wrap:break-word; overflow-wrap:break-word; line-height:1.3; }
li.menu-on a{ pointer-events:none; cursor:default; color:inherit; text-decoration:none; }
ul.modori{ border:none; background:transparent none; margin-left:20%; margin-bottom:0; text-align:right; }
ul.modori li{ display:inline-block; margin-left:1em; }
@media (max-width:30rem){ *{ word-wrap:break-word; overflow-wrap:break-word; } }
@media (max-width:480px){ table{ width:100%; table-layout:fixed; word-wrap:break-word; } }
@media only screen and (max-width:25rem){ li,dd{ margin-left:1.5em; }ol{ list-style-position:inside; } }

@media only screen{

html{ -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }

	/* ★見出し基礎 */
h1,#KIZI h2{ margin-top:0; }
#HEADER h1,#KIZI h2{ margin-bottom:0; }
h2,h3,h4,h5,h6{ padding:.25em 5px; }
p+h3,ul+h3,ol+h3,dl+h3,blockquote+h3,table+h3,form+h3,address+h3,pre+h3,p+h4,ul+h4,ol+h4,dl+h4,blockquote+h4,table+h4,form+h4,address+h4,pre+h4,p+h5,ul+h5,ol+h5,dl+h5,blockquote+h5,table+h5,form+h5,address+h5,pre+h5,p+h6,ul+h6,ol+h6,dl+h6,blockquote+h6,table+h6,form+h6,address+h6,pre+h6{ margin-top:2.5rem; }
h1 a:link,h1 a:visited{ text-decoration:none; color:inherit; }
h1 a:hover,h1 a:focus{ text-decoration:underline; }

	/* ★リスト要素 */
#MENU>h2+ul,#FOOTER>h2+ul{ margin:0; }
dt{ margin-bottom:.15em; padding:.05em .5em; background-color:rgba(0,0,0,.1); }
dd+dt	{ margin-top: .8em; }

	/* ★フォーム */
fieldset{ border-color:#CCC; }
input[readonly],
textarea[readonly]{ -webkit-appearance:none; -moz-appearance:none; appearance:none; border:1px solid #CCC; }
input[readonly]:focus,textarea[readonly]:focus{ outline:none; box-shadow:none; }
button { overflow:visible; }

	/* ★追加削除 */
ins{ border:solid #FFAA25; border-width:0 0 2px; text-decoration:none; }
div>ins{ position:relative; margin:1em 0; padding:.25em 10px 1.25em; border-width:0 2px 0 0;  }
div>ins::after{ content:"追加"; position:absolute; bottom:0; right:10px;
	color:#FFAA25; font-size:.8em; font-weight:600; font-family:Helvetica,Arial,Sans-Serif; }
body>ins[datetime]::after,
div>ins[datetime]::after{ content:"追加：" attr(datetime); }

	/* ★画像 */
img[align="right"]{ margin-left:10px; } img[align="left"]{ margin-right:10px; }
a img{ margin:2px 1px; padding:2px; max-width:calc(100%-8px); color:#333; background:#FFF; }
a:link img{ border:1px solid; border-color:#CCC #999 #999 #CCC; }
a:visited img{ border:1px solid; border-color:#999 #CCC #CCC #999; background:#EEE; }
a:hover img,
a:focus img{ border-color:#DDD #555 #555 #DDD; background:#FFF; }

a img.link,a.link img,.link a img,ul.modori a img{ max-width:100%; padding:0; border:none; background:transparent none; }
a.link:link,a.link:visited{ border:none; }
li[id^="MENU"] a img{ margin:0; padding:0; border:none; max-width:100%; }

	/* ★テーブル */
table,caption,th,td{ border:solid #222; }
table { border-width:2px 1px; background:#FFF; color:#000; text-shadow:none; }
caption{ padding:.25em .5em; background-color:#000; color:#FFF; text-align:left;
	border-radius:10px 10px 0 0; border-width:1px 1px 0; }
caption a:link,
caption a:visited{ color:#fff; }
caption a:hover{ color:#999; }
th,td{ border-width:3px 1px; border-style:double solid; }
thead th,thead td,tfoot th,tfoot td{ background-color:#CCC; }
tbody th{ background-color:#EEE; }
td:empty{ background-color:#F5F5F5; }

	/* ★引用文 */
blockquote,q{ color:#0E5D4D; text-indent:0; }
q{ margin:0 .2em; background:linear-gradient(to bottom, transparent 60%, hsla(129,40%, 92%,.5) 0%); }
blockquote q{ }
q q{ background:none; border:none; }
blockquote{ position:relative; margin-left:.5em; padding:.8em .5em .5em 1.5em; background:hsla(129,40%, 92%,.5);  }
blockquote::before{ display:inline-block; content:"\201C"; font-family:Georgia,Times,Serif; font-size:6em; 
	line-height:1; position:absolute; top:-.15em; left:-.1em; color:#AFCDA6; }
blockquote[title]::after{ content:attr(title); display:block; margin-left:5%; text-align:right; 
	font-size:smaller; font-family:Sans-serif; color:#AFCDA6; }
blockquote ul,blockquote ol,blockquote dl,blockquote p,blockquote pre{ margin:.5em 0; }

	/* ★その他ブロック要素 */
address{ padding:.5em .8em; border:solid #F7E6F2; border-width:1px 0; background:#FFF8FD; color:#000; }
li address{ font-style:oblique; }
pre{ padding:.6em 0; border:solid #F0E5D9; border-width:10px 15px; border-radius:10px; 
	background:#F0E5D9; color:#000; word-wrap:normal; text-shadow:none; }
hr{ display:none; }
div.text hr{ display:block; border-color:#DDD; }

	/* ★その他インライン要素 */
code{ color:#652109; }
pre code{ margin:0; padding:0; }
em{ text-shadow:1px 1px 0 rgba(0,0,0,.15); }
strong{ color:#F91919; text-shadow:0 0 2px yellow; }
kbd{ padding:.1em .25em; border:1px dotted #999; background:#FFFEDA; color:#000; }
kbd kbd{ padding:0; border:none; }
samp{ padding:0 .2em; background-color:#E4F1FE; color:#000; }

	/* ▼基礎 */
html
{
	font-size:15px;
	font-family: -apple-system, 'BlinkMacSystemFont', Meiryo, 'メイリオ','MS PGothic', "ＭＳ Ｐゴシック", Sans-serif;
	line-height: 1.6;
	margin:0; padding:0;
	background-color:#EEE;
	color:#000;
}

	/* ▼リンク色 */
a:link	{ color: #3222FF; }
a:visited	{ color: #9968A7; }
a:hover,
a:focus	{ color: #333; }
a:active	{ color: #FF2DB1; }

	/* ▼見出しデザイン */
h1,h2,h3,h4,h5,h6{ font-weight:500; color:#3A9002;
	font-family: "Lucida Sans Unicode", Verdana, Osaka, "Meiryo", "メイリオ", Sans-serif; }
h1{ font-weight:800; }
h2{ margin:0; padding:.2em; letter-spacing:.1em;  }
h3,h4{ text-shadow:2px 2px rgba(0,0,0,.15); }
h3{ border-bottom:1px dashed #68B969; }
h5{ margin-left:2.5em; margin-right:8%; }
h6{ margin-left:8%; margin-right:2em; text-align:right; }

	/* ▼レイアウト */
#PAGETOP{ margin:1vh 1vw; padding:0 0 2em;  }
#HEADER,
#KIZI{ margin-bottom:1em; background:#FFF; border:1px solid #000; }
#HEADER{ position:relative; padding:1em 2vw; }
#HEADER::before{ content:""; display:block; }
#HEADER>h1,#PAN{ text-align:center; }
#PAN{ margin:0; padding:0 0 10px; display:flex; flex-flow:row wrap; align-items:baseline; justify-content:center; }
#PAN li{ list-style:none; margin:0; display:inline; }
#PAN li+li::before{ content:">"; padding:0 .3em; color:#888; }
#MENU{ clear:both; margin:0 1vw 1em; }
#MENU>ul:first-of-type{ display:flex; flex-flow:row wrap; align-items:baseline; justify-content:center; margin:0 -1vw; background:#FFF; border:1px solid #000; }
li[id^="MENU"]{ list-style:none; flex-grow:1; display:inline-block;margin:0; padding:5px; vertical-align:middle; }
li[id^="MENU"]>a{ display:block; margin:-5px; padding:15px 1em; color:#555; transition:background .3s; 
	min-width:4em; text-align:center; text-decoration:none; font-weight:700; }
li[id^="MENU"]>a:hover,
li[id^="MENU"]>a:focus{ text-decoration:underline; background:#EEE;  }
#MENU li.menu-on a{ text-decoration:underline; }
li[id^="MENU"] li{ list-style: none; margin: 0; text-align: center }
#KIZI h2{ padding: 1em 20px .3em; margin-top:1em; border-top:1px solid #999; }
#KIZI>h2:first-child{ margin-top:0; border:none; }
div.text{ position:relative; margin:0; padding:40px 60px; z-index:1; }
div.text::before,
div.text::after{ content:""; display:block; position:absolute; }
div.text::before{ top:22px; left:22px; right:22px; bottom:22px; background:#FFF;border:1px solid #000; z-index:-5; }
div.text::after{ top:15px; left:15px; right:15px; bottom:15px; background:#eee;
	border:1px solid #222; box-shadow:1px 1px #CCC, -1px -1px #CCC, 2px 2px #CCC,-2px -2px #CCC;  z-index:-10; }
#FOOTER{ padding-top:.5em; }
#FOOTER>ul:first-of-type{ text-align:center; }
li[id^="FOOTER"]{ display:inline-block; list-style:none; margin:0 .5em; padding:.2em 0; }

/*=====================
  ★カスタマイズ
=======================*/

	/* ▼FOOTER戻りリンク */
	/* 上部に戻るが【#FOOTER01】じゃない場合は【#FOOTER01】を4箇所書き換え */
	/* 不要な場合は以下 ～ここまで の行まで削除 */
#FOOTER{ position:relative; padding-top:2.5em; }
#FOOTER01{ position:absolute; top:0; left:0; right:0; text-align:center; }
#FOOTER01 a{ padding:.2em 1em; background:#AAA; color:#FFF; text-decoration:none; }
#FOOTER01 a:hover,
#FOOTER01 a:focus{ background-color:#BBB; }
	/* ▲FOOTER戻りリンクここまで */

	/* ▼アイキャッチ */
#HEADER::before
{
	padding-top: calc( 600 / 1500 * 100% ); /*【600】画像縦幅 【1500】画像横幅（両方単位無用） */
	background-image:url(esto/img.jpg); /* 画像URL */
	background-position:50% 0%; 
	background-size:cover;
	border:10px solid #FFF;
	box-shadow:0 1px #999; 
	margin:-1em -2vw 1em;
}
div.text::after{ background:url(esto/img.jpg) repeat 50% 50%; } /* 画像URL */
	/* ▲アイキャッチここまで */

}
@media only screen and ( max-width:669px ) /* ★スマフォサイズ以下 */
{
	html{ font-size:16px; line-height:1.6; }
	div.text{ padding:25px 30px; }

	/* ▼INDEX以外メニューを下に */
	body:not(#INDEX) #PAGETOP{ display:flex; flex-direction:column; }
	body:not(#INDEX) #MENU{ order:1;  }
	body:not(#INDEX) #FOOTER{ order:2; }
}
@media only screen and ( min-width:670px ) /* ★ファブレットサイズ以上 */
{

	#PAGETOP{ 
		/* ▼最大横幅 */
		max-width:920px; 
		
		/* ▼全体寄せ位置 */
		margin-left: auto;
		margin-right: auto; 
	}
}
@media only screen and ( min-width : 960px ) /* ★PCサイズ以上 */
{
}
	/* ▼擬似フレーム */
@media only screen and ( min-width:670px ) and ( min-height:25em )
{
	html{ padding-top: 4em;  /* 【4em】メニュー高さ分の余白 */ }
	*{ scroll-margin-top: 4em; /* 同上 */ }
	#MENU>ul:first-of-type{ margin:0; position:fixed; top:0; left:0; right:0; border-width:0 0 1px; z-index:5; text-align:center; }
	li[id^="MENU"]{ flex-grow:0; }
}
	/* ▲擬似フレームここまで */

	/* ▼INDEX以外アイキャッチなし */
@media only screen and ( max-height: 420px )
{
    body:not(#INDEX) #HEADER::before{ display:none; !important; }
}