/* ※サイト全ページ共通-ここから-※ */

*{margin: 0; padding: 0; border: none;
    box-sizing: border-box; /*余白や線を幅や高さに含める*/
  font-family: "Klee One", serif;
  font-weight: 400;
  font-style: normal;}

:root{--base: #89c3eb;
			--gray001: dimgray;
			--tan001: tan;
      }
			
body{background-color: #fff;}

/* 白抜き背景色 */
#new,#info,#titlebox,.pset,.tabs{background-color: #fff;}
/* 白抜き背景色　ここまで */

/* メインカラー　背景色 */
body,.head001,#sidebox{background-color: var(--base);}
/* メインカラー　背景色　ここまで */

/* 右寄せ、中央寄せ、左寄せ */
.text-migi{text-align: right;}
.text-naka{text-align: center;}
.text-hidari{text-align: left;}
/* 右寄せ、中央寄せ、左寄せ ここまで　*/

/* 新着リスト　*/
.newlist{list-style-position: inside;color: var(--gray001);}
.newlist li{border-bottom: 1px dashed;}

/* 点滅アニメーションの定義 */
@keyframes blinking {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}

/* 点滅アニメーションを適用 */
.blink {
	color: red;
  animation: blinking 1s ease-in-out infinite alternate;
}

/* 新着リスト ここまで　*/

/* 角丸　*/
#info,.pset,.tabs{
	border-radius: 10px;
}
/* 角丸 ここまで　*/



#container{max-width: 1000px; margin: 0 auto;}



/* タブ切り替え　*/
.tabs {max-width: 720px;
}


/* 視覚的に非表示（visually-hidden） */
.tabs input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  border: 0;
  white-space: nowrap;
}

/* フォーカス状態（キーボード操作時） */
#tab1:focus-visible ~ .tabs-inner label[for="tab1"],
#tab2:focus-visible ~ .tabs-inner label[for="tab2"],
#tab3:focus-visible ~ .tabs-inner label[for="tab3"] {
  outline: 2px solid #A59AC9;
  outline-offset: 2px;
}

.tab-labels {
  display: flex;
}

.tab-label {
  flex: 1;
  text-align: center;
  padding: 10px;
  cursor: pointer;
  border-bottom: 3px solid #E5E5E5;
  transition: all 0.3s;
}

.tab-label:hover {
  opacity: 0.7;
}

.tab-contents > div {
  display: none;
  padding: 15px;
}

/* チェックされたタブのラベルのスタイル */
#tab1:checked ~ .tabs-inner label[for="tab1"],
#tab2:checked ~ .tabs-inner label[for="tab2"],
#tab3:checked ~ .tabs-inner label[for="tab3"] {
  border-bottom-color: #A59AC9;
}

/* チェックされたタブの内容を表示 */
#tab1:checked ~ .tabs-inner .content-tab1,
#tab2:checked ~ .tabs-inner .content-tab2,
#tab3:checked ~ .tabs-inner .content-tab3 {
  display: block;
}

/* タブ切り替え ここまで　*/

/* タブ中身 　*/
.pictbox{max-width: 100%; height: 360px; background-image: url(topga20261113001.JPG);
	background-size: cover;
	background-position: center;
}

.danraku{margin: 10px; overflow-wrap: break-word;}
.newlist a,.kyocho{color: var(--base); font-weight: bold;}
/* タブ中身 ここまで　*/




/* パソコン表示　*/
/* フォント強調　*/
.bigbun{font-size: 30px;}
.chubun{font-size: 24px;}
.subtie{font-size: 24px;
	color: #010079;
  text-shadow: 0 0 5px white;
  border-left: solid 7px #010079;
  background: repeating-linear-gradient(-45deg, #cce7ff, #cce7ff 3px,#e9f4ff 3px, #e9f4ff 7px);
}
/* フォント強調 ここまで　*/

/* 余白　*/
#titlebox{margin: 0; padding: 10px;
text-align: center;}
#info,#new,.pset,.tabs{margin: 0; padding: 20px;}
/* 余白 ここまで　*/
/* ヘッダー　*/
.head001{width: 100%; height: 20px;}
header{ display: flex;
	flex-direction: column;
}

/* ヘッダー横並びタグ　
header{ display: flex;
flex-direction: row;
} 
ヘッダー横並びタグ ここまで　*/

/* ヘッダー ここまで　*/

    #container{
        display: flex;
				gap: 10px;
    }
    #sidebox{
        width: 300px;
				display: flex;
				flex-direction: column;
				gap: 10px;
    }
    #mainbox{
        flex: 1;
        order: 2;
				display: flex;
				flex-direction: column;
				gap: 10px;
    }
/* パソコン表示　ここまで　*/

/* スマホ表示設定　*/
@media screen and (max-width: 430px) {
/* フォント強調　*/
.bigbun{font-size: 24px;}
.chubun{font-size: 20px;}
.subtie{font-size: 20px;}
/* フォント強調 ここまで　*/

/* flex解除　*/
#container,#mainbox,#sidebox{
        display: block;
    }
/* flex解除　ここまで　*/

/* 余白　*/
#titlebox{margin: 0; padding: 8px;
text-align: center;}

#info,.tabs,.pset{display: block; margin: 0 0 10px 0;}

#sidebox{
        width: 100%;
    }

#info,#new,.pset,.tabs{padding: 10px;}
/* 余白 ここまで　*/

.tabs {width: 100%;
}


	img {
width: 100% ;
}

}
/* スマホ表示設定 ここまで　*/



/* メインボックス */
/* ※サイト全ページ共通-ここまで-※ */