@import url("https://fonts.googleapis.com/css2?family=Comfortaa:wght@500;700&family=Zen+Maru+Gothic:wght@500;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200");
/**************************************************************************************
▼　記事の画像枠設定
・一部の画像枠を消したいときは、
<img src="画像のアドレス" class="emoji" />で消えると思います。

・そもそも枠はいらないという人は
初めから
.EntryText img.emoji{
	background-color: transparent;
	padding         : 0;
	border          : 0px #ffffff none;}
までを削除

**************************************************************************************/

/*
.EntryText img{
	margin          : 0 5px 0 0;
	padding         : 7px;
	border-top      : 1px #EEEEEE solid;
	border-right    : 1px #CCCCCC solid;
	border-bottom   : 1px #CCCCCC solid;
	border-left     : 1px #EEEEEE solid;}

.EntryText img.emoji{
	background-color: transparent;
	padding         : 0;
	border          : 0px #ffffff none;}
*/

/**************************************************************************************

■ 全ブロックの共通設定

**************************************************************************************/

* {
	margin          : 0px;
	padding         : 0px;
}
body {
	color           : #494340;
	text-align      : center;
	font-family     : "Yu Gothic", Meiryo, "Hiragino Kaku Gothic ProN", sans-serif;
	/* font: 500 1.6rem/2.65rem "Yu Gothic", Meiryo, "Hiragino Kaku Gothic ProN", sans-serif; */
	background-color: #69b076;
}
a:link,
a:visited,
a:active{
	color           : var(--theme-color2-default);
	text-decoration : none;
}
a:hover {
	color           : var(--white);
	background-color: var(--theme-color2-default);
}
textarea{
	font-size       : small;
}
/******** ▼ 外枠 ********************************************/
#MainBlock {
	width           : 800px;
	text-align      : left;
	margin          : 0 auto;
	padding-top     : 30px;
}


/**************************************************************************************

■ ヘッダーのデザイン

**************************************************************************************/
#TopBlock{
	text-align		: center;
}
.TopTitle{
	font-family     : "Comfortaa", "Zen Maru Gothic", "Yu Gothic", Meiryo, "Hiragino Kaku Gothic ProN", sans-serif;
	padding         : 5px 0;
	font-size       : 40px;
}
.TopTitle a:visited{
	color			: var(--white);
}
.TopExplanation{
	font-size       : x-small;
	margin          : 5px 0 50px 0;
}
#TopMenu{
	text-align		: center;
}
#TopMenu select{
	background-color: var(--white);
}

/**************************************************************************************

■ エントリーのデザイン

**************************************************************************************/
/******** パンくず ****************************************/
.Pan{  
	height          : 15px;
	text-align      : right;
	padding-right   : 10px;
}  
.Pan li{
	display         : inline;
	line-height     : 15px;
	list-style-type : none;
	padding-left    : 12px;
}  
.Pan li a{
	color           : var(--menu-color);
	background      : url(//bfile.shinobi.jp/4417/11_li02.gif) no-repeat right 5px;
	padding-right   : 10px;
	text-decoration : none;
} 
.Pan li a:hover{
	color           : var(--white);
	background-color: var(--theme-color2-default);
}
/******** ▼ タイトル・枠 ************************************/
#EntryBlock{
}
.EntryInnerBlock{
	border          : none;
	background-color: #ffffff;
	margin          : 20px 0;
	padding         : 20px;
	border-radius	: 2.5rem;
}
.EntryTitle{
	font-family     : "Comfortaa", "Zen Maru Gothic", "Yu Gothic", Meiryo, "Hiragino Kaku Gothic ProN", sans-serif;
	padding-bottom  : 5px;
	border-bottom   : 2px solid #F2F2F2;
	font-size       : 18px;
	letter-spacing  : 0.2em;
}
/******** ▼ 日付など ****************************************/
.EntryBottom{
	text-align      : right;
	font-size       : small;
	list-style-type : none;
}
.EntryBottom li{
	display         : inline;
	margin-left     : 1em;
}
/******** ▼ 本文 ********************************************/
.EntryText{
	line-height     : 1.6;
	margin          : 0 0 3em 0;
}
.EntryPsText{
	padding-top     : 1.5em;
}
.EntryPsLink{
	margin          : 1.5em 0 0 0;
}
/******** ▼ ナビ ********************************************/
.EntryNavi{
	list-style-type : none;
}
.EntryNavi li{
	background      : url(//bfile.shinobi.jp/4417/11_li01.gif)  no-repeat 0% 7px;
	padding         : 2px 0 2px 12px;
}
#NaviBlock{
	padding         : 2em 0;
	text-align      : center;
}
#NaviBlock ul{
	font-weight     : bold;
	list-style-type : none;
}
#NaviBlock li{
	background-color: #E1E1E1;
	padding         : 2px 5px;
	margin          : 5px;
	display         : inline;
}
#NaviBlock a{
	color           : var(--menu-color);
	font-weight     : normal;
}
#NaviBlock a:hover{
	color           : var(--white);
	background-color: var(--theme-color2-default);
}


/**************************************************************************************

■ プラグインのデザイン

**************************************************************************************/
#Plugin{
	visibility      : hidden;
	filter          : alpha(opacity:80);
	opacity         : 0.8;
	right           : 100px;
	top             : 50px;
	width           : 220px;
	background-color: #98d98e;
}
.PluginBlock{
	position        : absolute;
}
.PluginClose{
	margin          : 10px;
	text-align      : right;
}
.PluginClose a{
	font-size       : small;
	font-weight     : bold;
	letter-spacing  : 0.2em;
	background-color: #ffffff;
	padding         : 2px 5px;
}
.PluginInnerBlock{
	margin          : 0 10px 30px 10px;
}
.PluginTitle{
	color           : #ffffff;
	font-size       : 15px;
	letter-spacing  : 0.1em;
	border-bottom   : 2px solid #3C3C3C;
	padding-bottom  : 5px;
}
.PlaginExplanation{font-size : small;}

.PlaginData{
	color           : #ffffff;
	font-size       : small;
	line-height     : 1.6;
	margin-top      : 5px;
}
/******** ▼ 内部設定 ****************************************/
.plugin_data {
	text-align      : left;
	border-bottom   : 1px dashed #3C3C3C;
	padding         : 5px 0 5px 0;
}
.plugin_data_date {
	font-size       : small;
	text-align      : right;
}


/**************************************************************************************

■ コメント
■ トラックバック

**************************************************************************************/
/******** ▼ タイトル・枠 ************************************/
.CtBlock{
	border          : none;
	background-color: #ffffff;
	margin          : 20px 0;
	padding         : 20px;
	border-radius	: 2.5rem;
}
.CtInnerBlock{
	margin-bottom   : 20px;
}
.CtTitle{
	font-family     : "Comfortaa", "Zen Maru Gothic", "Yu Gothic", Meiryo, "Hiragino Kaku Gothic ProN", sans-serif;
	padding-bottom  : 5px;
	border-bottom   : 2px solid #F2F2F2;
	font-size       : 20px;
	letter-spacing  : 0.2em;
	margin-bottom   : 10px;
}
.CtTitle_2{
	padding         : 3px 0 5px 0;
	font-size       : 15px;
}
/******** ▼ 日付など ****************************************/
.CtTop{
	font-size       : x-small;
	color           : #2E86BA;
	list-style-type : none;
}
.CtTop li{
	display         : inline;
	margin-right    : 1em;
}
/******** ▼ 本文 ********************************************/
.CtText{
	line-height     : 1.6;
	margin          : 0.5em 0;
}
.CtRsBlock{
	background-color: #F2F2F2;
	margin-left     : 5em;
	padding         : 1em;
}
/******** ▼ フォーム ****************************************/
.CtBlock input,
.CtBlock textarea{
	background-color: transparent;
	border          : 1px solid #E1E1E1;
}


/**************************************************************************************

■ フッターのデザイン

**************************************************************************************/
#FooterBlock{
	text-align      : center;
	clear           : both;
	font-size       : x-small;
	padding-top     : 10px;
}
.FooterCp{
	margin-bottom   : 10px;
}
.FooterCp a{
	color           : var(--menu-color);
}
.FooterCp a:hover{
	color           : var(--white);
	background-color: var(--theme-color2-default);
}
.FooterCm{
	margin-top      : 5px;
}


/**************************************************************************************

■ カレンダー・検索用デザイン

**************************************************************************************/
/******** ▼ カレンダー日付移動用テーブル*********************/
.CalendarMoveTable {
	margin          : 0 auto;
	text-align      : center;
	width           : 190px;
}
.CalendarMoveTr {
	text-align: center;
}
/******** ▼ カレンダー表示用テーブ***************************/
.CalendarTable {
	margin          : 0 auto;
	text-align      : center;
	width           : 190px;
}
.CalendarTable a{font-weight     : bold;}

/*** ▼ 曜日表示部分 のデザイン *************************/
.CalendarWdayTr {
	text-align      : center;
}
/**** ▼ 曜日表示部分、日曜日 ***************************/
.CalendarWdaySun {
	color           : #e3b0a2;
}
/**** ▼ 曜日表示部分、土曜日 ***************************/
.CalendarWdaySat {
	color           : #A2C2E3;
}
/**** ▼ 日付表示部分<tr> *******************************/
.CalendarTr {
	text-align      : center;
}

/**** ▼ 検索用デザイン **********************************/
.box{
	font-size       : small;
	width: 120px;}
.btn{
	color			: var(--theme-color2-default);
	font-size       : small;}
.btn2{
	color			: var(--white);
	font-size       : small;}
.btn2:hover{
	color			: var(--theme-color2-default);}
.left {
	text-align      : left;}
.center {
	text-align      : center;}
.right {
	text-align      : right;}




/* --------------------------------------------------
  Template by espace（https://espace.i-ra.site/）
  Copyright: 2020 espace.

  利用規約を遵守の上、ご利用ください。
  二次配布、販売は禁止しています。
  --------------------------------------------------*/

:root {
  --white: #fbfaf5;
  --text-color: #494340;
  --text-point-color: var(--white);
  --menu-color: #ffec47;
  --bg-color1: var(--theme-color1-light);
  --bg-color2: var(--theme-color1-more-light);
  --theme-color1-more-light: #98d98e;
  --theme-color1-light: #98d98e;
  --theme-color1-default: #69b076;
  --theme-color2-default: #ec6800;
  --theme-color3-default: #f08300;
  --animation: 0.7s;
}

/* 見出し */
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family     : "Comfortaa", "Zen Maru Gothic", "Yu Gothic", Meiryo, "Hiragino Kaku Gothic ProN", sans-serif;
}
h2 {
  font-size: xx-large;
}
h3 {
  font-size: x-large;
}
h4,
h5 {
  font-size: large;
}
h3::after,
h4::after,
h5::after {
  content: "";
  display: block;
  block-size: 2px;
  border-radius: 12px;
  inline-size: 20rem;
  background: #98d98e;
}



/* リスト */
ul .description, ol .description {
  margin-inline-start: 10px;
}
ul .description::before, ol .description::before {
  content: "…";
  margin-inline-end: 10px;
}

ul li.next {
  list-style: none;
}
ul li.next::before {
  content: "→";
  margin-inline-end: 5px;
  font-size: 120%;
}
ul.small {
  list-style: none;
  padding-inline-start: 0;
}
ul.small li {
  display: inline;
}
ul.small li::before {
  color: var(--text-point-color);
}
ul.small li:not(:first-child):not(.next)::before {
  content: ":";
  margin-block: 0;
  margin-inline: 2px 5px;
  font-weight: 900;
}
ul.small li.next::before {
  margin-block: 0;
  margin-inline: 2px 7px;
}

dl dd {
  margin-block: 0 20px;
  margin-inline: 0;
  padding-block: 0 20px;
  padding-inline: 40px 0;
  border-block-end: 2px solid var(--white);
}
dl dd:last-of-type {
  margin-block-end: 0;
  padding-block-end: 0;
  border-block-end: 0;
}
dl.inline {
  display: flex;
  flex-wrap: wrap;
  inline-size: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
dl.inline dt, dl.inline dd {
  vertical-align: top;
  margin-block: 0 20px;
  margin-inline: 0;
  padding-block: 0 20px;
  padding-inline: 0;
}
dl.inline dt:last-of-type, dl.inline dd:last-of-type {
  margin-block-end: 0;
  padding-block-end: 0;
}
dl.inline dt {
  inline-size: 200px;
  padding-block: 0 10px;
  padding-inline: 0 30px;
  border-block-end: 2px solid var(--white);
}
dl.inline dt:last-of-type {
  border-block-end: 0;
}
dl.inline dd {
  inline-size: calc(100% - 200px);
}
dl.border {
  padding-block: 20px;
  padding-inline: 25px;
  border: 2px solid var(--white);
  border-radius: 2.5rem;
}
/* フォーム */
input,
select,
textarea,
button,
button::after,
button::before {
  transition: all var(--animation);
}

.form-inline > *, .form-block > * {
  margin-bottom: 5px;
  padding-bottom: 0;
}

.form-block > *:not(:last-child) {
  margin-bottom: 5px;
}
.form-block dl dt, .form-block dl dd {
  border-bottom: 0;
}
.form-block dl.inline dt {
  width: 130px;
}
.form-block dl.inline dd {
  width: calc(100% - 130px);
}
.form-block > *, .form-block dl dd > * {
  width: 100%;
}

.required::after {
  content: "*";
  color: var(--theme-color2-default);
}

/* ボタン */
input, textarea, select,
button:not(.manu-toggler):not(.env-button):not(#envReset), input[type=submit], input[type=button] {
  border-radius: 2.5rem;
  padding: 10px 10px;
}

input, textarea, select {
  border: 2px solid var(--white);
  background: var(--white);
}
input:hover, input:focus, textarea:hover, textarea:focus, select:hover, select:focus {
  border: 2px solid var(--theme-color2-default);
}

button:not(.manu-toggler):not(.env-button):not(#envReset), input[type=submit], input[type=button] {
  border: 2px solid var(--white);
  background: transparent;
  font-weight: 700;
  border-color : #E1E1E1;
}
button:not(.manu-toggler):not(.env-button):not(#envReset),not(.btn2), input[type=submit], input[type=button] {
  color: var(--theme-color2-default);
}
button:not(.manu-toggler):not(.env-button):not(#envReset):hover, input[type=submit]:hover, input[type=button]:hover {
  background: var(--white);
  border-color: var(--theme-color2-default);
}



/* リンク */
main a:not(.ic-sns),
footer a:not(.ic-sns) {
  position: relative;
  /* chara-setでecs-list-btn-imgを使用した時、文字が絵の下に来てしまうのでコメントアウト */
  /* display: inline-block; */
  display: inline-flex;
  color: var(--theme-color2-default);
}
main a:not(.ic-sns)::before,
footer a:not(.ic-sns)::before {
  content: "";
  position: absolute;
  top: -10px;
  left: -10px;
  display: block;
  width: calc(100% + 20px);
  height: calc(100% + 20px);
  border: 2px solid var(--white);
  border-radius: 30px;
  opacity: 0.2;
  transform: scale(0);
  transition: all var(--animation);
}
main a:not(.ic-sns):not(.ebs-link-btn):hover::before,
footer a:not(.ic-sns):not(.ebs-link-btn):hover::before {
  opacity: 1;
  transform: scale(1);
}
/* 装飾 */
b, em, strong {
  font-weight: bold;
}

em {
  font-style: normal;
  background: linear-gradient(transparent 50%, var(--theme-color3-default) 50%);
}

strong {
  background: var(--theme-color3-default);
}

hr {
  margin-block: 150px;
  margin-inline: auto;
  inline-size: 90px;
  border: 0;
  border-block-end: 10px dotted var(--white);
}


.scrollbox {
  overflow-y: auto;
  max-block-size: 14rem;
}
.scrollbox::-webkit-scrollbar {
  inline-size: 10px;
}
.scrollbox::-webkit-scrollbar-track {
  background-color: transparent;
}
.scrollbox::-webkit-scrollbar-thumb {
  background-color: var(--theme-color1-default);
  border-radius: 5px;
}
.scrollbox > *:first-child {
  margin-block-start: 0;
  padding-block-start: 0;
}
.scrollbox > *:last-child {
  margin-block-start: 0;
  padding-block-start: 0;
}

.onlyrow {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.material-symbols-rounded {
  vertical-align: middle;
  font-size: 1.6rem;
  line-height: 2.65rem;
  font-weight: 500;
}

.column {
  display: grid;
  grid-template-columns: 1fr;
  gap: 25px;
  margin-block: 2.5rem;
  margin-inline: auto;
}
.column > * {
  margin: 0 !important;
}
.column.column-2 {
  grid-template-columns: repeat(2, 1fr);
}
.column.column-3 {
  grid-template-columns: repeat(3, 1fr);
}

.text-left {
  text-align: left;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.text-bold {
  font-weight: bold;
}
.text-small {
  font-size: smaller;
}
.text-large {
  font-size: larger;
}






/**************************************************************************************

■ コードのデザイン
参考：https://0forest.com/blog/css-blockquote/
https://catnose.me/learning/html/code/

**************************************************************************************/
/* pre{
  position:relative;
  border-left:2px solid var(--theme-color1-default);
  border-right:2px solid var(--theme-color1-default);
  padding:20px;
  background:var(--bg-color1);
}
 */
pre {
  margin: 1em 0; /* ブロック前後の余白 */
  padding: 0em; /* ブロック内の余白 */
  border-radius: 10px; /* 角丸 */
  background: var(--theme-color1-more-light); /* 背景色 */
  color: text-color; /* 文字色 */
  overflow-x: auto; /* ⭐ */
  -webkit-overflow-scrolling: touch; /* ⭐ */
}

code {
  background: #25292f; /* 背景色 */
  color: #fff; /* 文字色 */
}