@charset "utf-8";

/*Font Awesomeの読み込み
---------------------------------------------------------------------------*/
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css");




/*opa1のキーフレーム設定（汎用的）
---------------------------------------------------------------------------*/
@keyframes opa1 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}


/*全体の設定
---------------------------------------------------------------------------*/
body * {box-sizing: border-box;}
body {
	background-color:#eae5dc;		/*ページ全体の背景色*/
	}
html,body {
	height: 100%;
	font-size: 13px;	/*基準となるフォントサイズ。*/
	}

	/*画面幅900px以上の追加指定*/
	@media screen and (min-width:900px) {

	html, body {
		font-size: 13px;	/*基準となるフォントサイズ。*/
	}

	}/*追加指定ここまで*/


body {
	margin: 0;padding:0;
	font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, "メイリオ", "Osaka", "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;	/*フォント種類（ゴシック）*/
	-webkit-text-size-adjust: none;
	background: ;	/*背景色*/
	color: #777;		/*文字色*/
	line-height: 2;		/*行間*/
}


/*h1全般の設定*/

h1 {
  color: #777;
  text-shadow: 0 0 5px white;
  padding: 0px 10px;
  border-left: solid 7px #e4e58d;
  background: -webkit-repeating-linear-gradient(-45deg, #f3f6c9, #f3f6c9 3px,#faf8f4 3px, #faf8f4 7px);
  background: repeating-linear-gradient(-45deg, #f3f6c9, #f3f6c9 3px,#faf8f4 3px, #faf8f4 7px);
}

/*h2全般の設定*/

h2 {
  color: #777;
  text-shadow: 0 0 5px white;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0px 10px;
  border-left: solid 0px #;
  background: -webkit-repeating-linear-gradient(-45deg, #f3f6c9, #f3f6c9 3px,#fff 3px, #fff 7px);
  background: repeating-linear-gradient(-45deg, #f3f6c9, #f3f6c9 3px,#fff 3px, #fff 7px);
}


/*table全般の設定*/

table {
}

.radius-table{
background-color: #e4e58d;
border-style:   hidden;
    border-radius: 15px;
    border-spacing: 0;
    border: none;
}
.radius-table tr>*{
    padding: 10px 10px;
    border: none;
    }
.radius-table tr:first-child>*:first-child{
    border-radius: 15px 0 0 0;
}
.radius-table tr:first-child>*:last-child{
    border-radius: 0 15px 0 0;
}
.radius-table tr:last-child>*:first-child{
    border-radius: 0 0 0 15px;
}
.radius-table tr:last-child>*:last-child{
    border-radius: 0 0 15px 0;
}


.radius-table01 tr>*{
    padding: 15px 15px;
    border: none;
    border-right: 1px solid #999;
    border-bottom: 1px solid #999;
    border-left: 1px solid #999;
    border-top: 1px solid #999;
}
.radius-table01 tr:first-child>*:first-child{
    border-radius: 15px 15px 15px 15px;
}
.radius-table01 tr:first-child>*:last-child{
    border-radius: 15px 15px 15px 15px;
}
.radius-table01 tr:last-child>*:first-child{
    border-radius: 15px 15px 15px 15px;
}
.radius-table01 tr:last-child>*:last-child{
    border-radius: 15px 15px 15px 15px;
}


/*画像全般の設定*/
img {border: none;max-width: 100%;height: auto;vertical-align: middle;}

/*videoタグ*/
video {max-width: 100%;}

/*iframeタグ*/
iframe {width: 100%;}

/*他*/
input {font-size: 1rem;}
section + section {
	margin-top: 3rem;
}

/*リンクテキスト全般の設定
---------------------------------------------------------------------------*/
a {
	color: #777;	/*文字色*/
	transition: 0.3s;	/*hoverまでにかける時間。0.3秒。*/
}

/*マウスオン時*/
a:hover {
	filter: brightness(1.1);	/*少しだけ明るくする*/
}


/*コンテナー（サイト全体を囲むブロック）
---------------------------------------------------------------------------*/
#container {
	height: 100%;
	display: flex;	/*flexボックスを使う指定*/
	flex-direction: column;	/*子要素を縦並びにする*/
	justify-content: space-between;	/*並びかたの種類の指定*/
	max-width: 900px;	/*サイトの最大幅。これ以上広がらない。*/
	margin: 0 ;
}


/*コンテンツ
---------------------------------------------------------------------------*/
#contents {
	flex: 1;
	padding: 3vw;	/*コンテンツ内の余白*/
}

/*コンテンツ内のulとol*/
#contents ul,#contents ol {
	margin-left: 2rem;
}

p.header {text-align:center;}

/*mainブロック設定
---------------------------------------------------------------------------*/



.list-menu {
  border-top: 1px solid #b2d65c;
  border-bottom: 1px solid #b2d65c;
  list-style-type: disc;
  margin: 10px 0;
  padding: 11px 20px 20px 35px;
}
.list-menu li {
  margin-top: 0px;
}



ul.cp_list {
	line-height: 2.2;
	padding:0.5em;
  list-style-type:none;
}
ul.cp_list li {
	line-height: 2.2;
	position:relative;
  padding: 0em 0.3em 0em 1.5em;
}
ul.cp_list li::before,
ul.cp_list li::after {
  position: absolute;
  content: '';
  display: flex;
  justify-content: center;
  align-items: center;
}
ul.cp_list li::after {
  top: 0.45em;
  left: 0em;
  width: 15px;
  height: 15px;
  background-color: #b2d65c;
  border-radius: 25%;
}
ul.cp_list li::before {
  top: 0.5em;
  left: 0.8em;
  height: 0;
  width: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 8px solid #b2d65c;
}

/*箇条書き設定
---------------------------------------------------------------------------*/
/*mainブロックの設定*/
main {
	margin: 0 0;	/*ブロックの外側（上下、左右）に空けるスペース*/
	columns:900px auto;
}

/*main-contents-partsの設定*/
.main-contents-parts {
	margin-bottom: 30px;		/*ボックスの下に空けるスペース。sub-contents-partsとの間の余白です。*/
	float:center;			/*カラムを中央寄せにする*/
}

	/*画面幅900px以上の追加指定*/
	@media screen and (min-width:900px) {

	/*カラムで使う為の指定*/
	main.column-parts {
		display: flex;	/*flexボックスを使う指定*/
		justify-content: space-between;	/*並びかたの種類の指定*/
		gap: 2rem;						/*main-contents-partsとsub-contents-partsの間のマージン的な隙間*/
	}
	/*main-contents-partsの設定*/
	.main-contents-parts {
		margin-bottom: 0;
		order: 2;			/*並び順。数字の小さい順番に表示されます。*/
		flex: 1;

	}
	
	/*.sub-contents-parts*/
	.sub-contents-parts {
	width: 200px auto;	/*幅*/
	}

	/*1つ目のsub-contents*/
	.sub-contents-parts:nth-child(2) {
		order: 1;	/*並び順。数字の小さい順番に表示されます。*/
	}
	
	/*2つ目のsub-contents*/
	.sub-contents-parts:nth-child(3) {
		order: 3;	/*並び順。数字の小さい順番に表示されます。３番目という意味なので一番右側に表示されます。*/
	}
	
	p.detail {text-align:center;}

	}/*追加指定ここまで*/
	
	


	/*画面幅900px以上の追加指定*/
	@media screen and (min-width:900px) {}
		

/*フッター設定
---------------------------------------------------------------------------*/
footer small {font-size: 100%;}
footer {
	font-size: 0.7rem;		/*文字サイズ。bodyのfont-sizeの70%です。*/
	background: #eee;		/*背景色*/
	text-align: center;		/*内容をセンタリング*/
	padding: 20px;			/*ボックス内の余白*/
}

/*リンクテキスト*/
footer a {color: inherit;text-decoration: none;}

/*著作部分*/
footer .pr {display: block;}


/*PAGE TOP（↑）設定
---------------------------------------------------------------------------*/
.pagetop-show {display: block;}

/*ボタンの設定*/
.pagetop a {
	display: block;text-decoration: none;text-align: center;z-index: 99;
	position: fixed;	/*スクロールに追従しない(固定で表示)為の設定*/
	right: 20px;		/*右からの配置場所指定*/
	bottom: 20px;		/*下からの配置場所指定*/
	color: #fff;		/*文字色*/
	font-size: 1.5rem;	/*文字サイズ*/
	background: rgba(0,0,0,0.2);	/*背景色。0,0,0は黒の事で0.2は色が20%出た状態。*/
	width: 60px;		/*幅*/
	line-height: 60px;	/*高さ*/
	border-radius: 50%;	/*円形にする*/
}


/*その他
---------------------------------------------------------------------------*/
.clearfix::after {content: "";display: block;clear: both;}
.color-check, .color-check a {color: #ff0000 !important;}
.l {text-align: left !important;}
.c {text-align: center !important;}
.r {text-align: right !important;}
.ws {width: 95%;display: block;}
.wl {width: 95%;display: block;}
.mb0 {margin-bottom: 0px !important;}
.mb30 {margin-bottom: 30px !important;}
.look {display: inline-block;padding: 0px 10px;background: #eee;border: 1px solid #ccc; border-radius: 3px;margin: 5px 0; word-break: break-all;}
.small {font-size: 0.75em;}
.large {font-size: 2em; letter-spacing: 0.1em;}
.pc {display: none;}
.dn {display: none !important;}
.block {display: block !important;}

	/*画面幅900px以上の追加指定*/
	@media screen and (min-width:900px) {

	.ws {width: 48%;display: inline;}
	.sh {display: none;}
	.pc {display: block;}

	}/*追加指定ここまで*/