@import url('https://fonts.googleapis.com/css2?family=Kosugi+Maru&display=swap');

.kosugi-maru-regular {
  font-family: "Kosugi Maru", sans-serif;
  font-weight: 400;
  font-style: normal;
}


/* レスポンシブ対応フォントサイズ */
html {
  font-size: clamp(1rem, calc(1rem + 1vw), 1.3rem);
}


/* URL下線なし */
a {
  text-decoration: none;
}


/* 文章強調系 */
.highlighted {
  background: linear-gradient(transparent 75%, #CC0808 60%); 
}

.highlighted-blue {
 background: linear-gradient(transparent 75%, #55A9DC 60%); 
}


.bold {
  font-weight: bold;
}








/* 冒頭警告 */
.attention {
  color: #ffffff;
  margin: 0 auto;              /* 中央寄せ */
  padding: 20px;
  text-align: center;
  font-size: x-large;
}

.attention2 {
  color: #ffffff;
  margin: 0 auto;              /* 中央寄せ */
  padding: 20px;
  text-align: center;
}




/* サイト全体の背景 */
body {
  background-color: #000000;   /* 外側の黒 */
  font-family: "Kosugi Maru", sans-serif;
  margin: 0;
  padding: 0;
  font-size: clamp(15px, 1vw + 0.6rem, 17px);  
}

/* コンテンツ部分（白背景の箱） */
main {
  background-color: #ffffff;   /* 中の白 */
  width: 95%;                  /* 常に画面幅の90% */
  margin: 0 auto;              /* 中央寄せ */
  padding: 20px;
  box-sizing: border-box;      /* padding込みで幅計算 */
  max-width: 1200px;           /* 広すぎ防止のため上限 */
  box-shadow: 0 0 0 4px #ffffff inset,  
              0 0 0 8px #000000 inset,   
              0 0 0 10px #ffffff inset,  
              0 0 0 12px #000000 inset;
  border-radius: 10px;
  margin-bottom: 50px;  /* mainの下に余白を作る */
}


/* yesno */
.index-yes-no{
  display:flex;
  margin:0;
  justify-content: space-evenly;
} 

.yes {
  background-color: #CC0808; 
  width: 40%;                  /* 常に画面幅の90% */
  margin: 0 auto;              /* 中央寄せ */
  padding: 20px;
  box-sizing: border-box;      /* padding込みで幅計算 */
  max-width: 1200px;           /* 広すぎ防止のため上限 */
  box-shadow: 0 0 0 5px #ffffff inset,   
              0 0 0 8px #CC0808 inset,  
              0 0 0 10px #ffffff inset;
  border-radius: 10px;
  text-align: center;
  font-size: x-large;
}

.no {
  background-color: #55A9DC; 
  width: 40%;                  /* 常に画面幅の90% */
  margin: 0 auto;              /* 中央寄せ */
  padding: 20px;
  box-sizing: border-box;      /* padding込みで幅計算 */
  max-width: 1200px;           /* 広すぎ防止のため上限 */
  box-shadow: 0 0 0 5px #ffffff inset,   
              0 0 0 8px #55A9DC inset,  
              0 0 0 10px #ffffff inset;
  border-radius: 10px;
  text-align: center;
  font-size: x-large;
}


/* <a> 要素で href が href="/TOP/topindex.php" と一致するもの */
a[href="/TOP/topindex.php"]
{
  color: #ffffff;
}

a[href="https://kids.yahoo.co.jp/"]
{
  color: #ffffff;
}