@charset "Shift_JIS";

/*============================================


全般的なスタイル

============================================*/
* {
	margin:0; padding:0; 	/*全要素のマージン・パディングをリセット*/
	color:#000000;		/*文字色*/

} 

body {
	background-color:#FFFFFF;	/*ページ全体の背景色*/
	text-align:center;		/*IE6以下でセンタリングするための対策*/
}

.wf-hannari { font-family: "Hannari"; }
.wf-kokoro { font-family: "Kokoro"; }
.wf-roundedmplus1c { font-family: "M PLUS Rounded 1c"; }

div#pagebody {
	width:800px; margin:0 auto;	/*内容全体をセンタリング*/
	background-color:#ffffff;	/*内容全体の背景色*/
}


div#header {
   font-size: 11px;
   text-align:right;
   text-decoration: none;
   width: 800px;
}

ul {
   list-style: none;
   text-align:center;
   margin; 0;
   padding: 0.2em 0;
}

li {
   display: inline;
   white-space: nowrap;
}

li a {
   text-decoration: none;
   padding: 0.2em 2em;
}



div#content {
   width: 800px;
}




/*================================


"Hannari","Kokoro","M PLUS Rounded 1c"

================================*/

div#daihyo {
   font-size: 18px;
   text-align:left;
   width: 800px;
}



div#footer {
   text-align: right;
}


/* spacer */

#i1 {
   float: left;
}


table#dayori {
   border: none;
   border-collapse: collapse;
   margin: 2em auto;
}

th,td#dayori {
   padding: 0.2em 0.5em;
   border-top: 2px solid #ff6600;
   border-bottom: 2px solid #ff6600;
   border-left: none;
   border-right: none;
   empty-cells: show;
}

thead#dayori {
   color: #000000;
   background: #ffcc99;
}

th,td a {
   text-decoration: none;
}

.c1 {
   font-family: "DF行書体","HG行書体",cursive;
   font-size: 20px;
   padding: 0 100px 50px;
   text-align: right;
}

.c2 {
   font-size: 18px;
   line-height: 34px;
   padding: 40px 85px;
   text-align:left;
}

.c3 {
   font-size: 12px;
   line-height: 20px;
   text-align:left;
}


.c4 {
   font-size: 11px;
   padding: 50px 0 0;
}

.c5 {
   font-size: 14px;
   line-height: 25px;
   padding: 40px 80px;
   text-align:left;
}

.c6 {
   font-size: 12px;
   line-height: 20px;
   padding: 40px 80px;
   text-align:center;
}

.c7 {
   font-size: 12px;
   text-align:left;
}

.c8 {
   font-size: 11px;
   text-align:left;
}

.c9 {
   font-size: 11px;
   text-align:right;
}


.gallery-container {
  display: grid;
  /* 4列のグリッドを基本にする例 */
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  grid-auto-rows: 150px; /* 1マスの高さ */
  grid-auto-flow: dense; /* 隙間を自動で埋める魔法のプロパティ */
  gap: 10px;
}

.gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* 縦横比が違っても枠内に綺麗に収める */
  border-radius: 5px;
}

/* 個別のサイズ指定 */
.gallery-item.wide {
  grid-column: span 2; /* 2列分使う */
}

.gallery-item.tall {
  grid-row: span 2; /* 2行分使う */
}

.gallery-item.big {
  grid-column: span 2;
  grid-row: span 2;
}