@charset "utf-8";

/* 要素 */
/* 表 */
table {
  border-collapse: collapse; /* 枠線を重ねて1本にする */
  margin-left: 10px;
}

th, td {
  border: 1px solid black; /* 基本の枠線 */
  padding: 5px;
}

td {
  text-align: left;
}

/* リスト */
li {
  margin-top: 3px;
  margin-bottom: 3px;
}

/* キャプション */
figure {
  overflow:hidden;
  margin: 5px;
}

#textToCopy {
  border: 2px solid black;
  background-color: white;
  display: inline-block;
  width: fit-content;
  padding: 5px 10px;
}

/* コピーボタン */
#copyBtn {
  padding-left: 10px;
}

/* クラス */
/* QRコード */
.qr {
  width: 250px;
}

/* 表の列の右側に2重線を引く */
.double-border-right1 {
  border-right: 3px double black; /* 太さ3pxの二重線 */
  padding: 3px;
  width: 125px;
}

/* 表の幅125px */
.width125 {
  width: 125px;
}

/* 中央揃え */
.cntr {
  text-align: center;
}

/* 内部余白3px */
.lineHight {
  line-height: 1.8;
}

/* 枠 */
.white-frame {
  border: 2px solid black;
  display: inline-block;
  width: fit-content;
  margin-left: 10px;
  padding: 5px;
  background-color: white;
}

/* メニューアイコン */
.menuIcon {
  height: 60px;
  width: auto;
  flex-shrink: 0;
  scroll-snap-align: start;
}

.iconScroll li {
  list-style: none;
  flex-shrink: 0;
  width: auto !important;
}

.titleImage {
  display: block;
  margin-top: 10px;
}

/* アイコン */
.sectionIcon {
  width: 25px;
}

.smallIcon {
  width: 22px;
}

.indexIcon {
  width: 20px;
  vertical-align: middle;
}

/* 目次用 */
.index {
  border: 2px dashed black;
  display: inline-block;
  width: fit-content;
  padding: 3px;
  margin-left: 10px;
}

/* アルファベット 筆記体 */
.alpha {
  font-family: "HG行書体", "HG行書体B", "HG行書体E", "Klee One", serif;
  letter-spacing: 0.02em;
  font-size: 1.15em; /* ← 筆記体だけ少し大きく */
  line-height: 1.1;  /* ← 行間が広がりすぎるのを防ぐ */
  margin-left: 0.1em;
  margin-right: 0.1em;
}

/* 数学用 */
.fitaly {
  font-style: italic;
  font-size: 16px;
}

.italy {
  font-style: italic;
}

.fcurs {
  font-style: cursive;
  font-size: 16px;
}

.lcurs {
  font-style: cursive;
  font-size: 20px;
}

.curs {
  font-style: cursive;
}

.fsize {
  font-size: 18px;
}

@media screen and (max-width: 840px) {
  
}

/* 以下スマホ（500pxより小さくなった場合） */
@media screen and (max-width: 500px) {

  th, td {
    border: 1px solid black; /* 基本の枠線 */
    padding: 3px;
    font-size: 15px;
  }
  
  .qr {
    width: 50vw;
  }

  .menuIcon {
    height: 40px;
    width: auto;
    flex-shrink: 0;
    margin: 0;
  }

  .iconScroll li {
    width: auto !important;
    list-style: none;
    flex-shrink: 0;
    line-height: 0;
    margin: 0;
    padding: 0;
  }
}