@charset "utf-8";

/* 要素 */

/* ボディ */
/* 文字指定 */
body {
  font-family: 'Hiragino Kaku Gothic Pro', sans-serif;
  line-height: 1.7;
}

/* ヘッダー */
/* ボタン横並び */
header {
  padding: 5px 0;
  position: fixed;
  width: 100%;
  height: 75px;
}

/* 見出し */
h1 {
  text-align: center;
  margin-top: 5px;
  font-size: 2.2em;
}

h2 {
  text-align: center;
  margin-top: 3px;
  font-size: 1.75em;
}

h3 {
  margin: 20px 0 6px 14px;
  font-size: 1.4em;
}

h4 {
  margin: 20px 0 10px 12px;
  font-size: 1.2em;
}

h5 {
  margin: 10px 0 8px 14px;
  font-size: 1.1em;
}

section {
  padding-top: 90px;
}

/* 本文 */
p {
  margin: 0 15px 12px 15px;
  font-size: 1em;
  overflow-wrap: break-word;
}

/* 表 */
table {
  font-size: 0.9em;
}

/* 閉じたり開いたりするボタン */
summary {
  cursor: pointer;
}

/* ボタン */
button {
  width: 200px;
  padding:0;
  margin:0;
  background:none;
  border:0;
  font-size:0;
  line-height:0;
  overflow:visible;
  cursor:pointer;
}

/*フッター */
/* 背景：黒 */
footer {
  background-color: black;
  text-align: center;
  padding: 13px 0;
  margin-top: 10px;
}
/* 文字色：白 */
footer p {
  color: #fff;
  font-size: 0.75rem;
}

/* 画像 */
img {
  width: 100%;
}

/* アイディ */
/* 背景色（通常） */
#wrapperPink {
  background: linear-gradient(#aed4ff,#fdd1d9);
  overflow:hidden;
}

/* 背景色（ラーニングマップ） */
#wrapperMathLearningMap {
  background: linear-gradient(#f7fcff, #e8f7f5);
  overflow:hidden;
}

/* 背景色（マスナビ） */
#wrapperMathNav {
  background: linear-gradient(#f7fbff, #e3f1ff);
  overflow:hidden;
}

/* 背景色（サポート教材室） */
#wrapperMathAids {
  background: linear-gradient(#f8fff9, #e4f8e8);
  overflow:hidden;
}

/* 背景色（ポケドリ） */
#wrapperMathQes {
  background: linear-gradient(#f9fdff, #dff2ff);
  overflow:hidden;
}

/* 背景色（マスプリ） */
#wrapperMathPrint {
  background: linear-gradient(#fff9fc, #fde7ef);
  overflow:hidden;
}

/* 背景色（シークレットワークショップ） */
#wrapperSecretMathPage {
  background: linear-gradient(#e8f3ff, #c9dcff);
  overflow:hidden;
}

/* 背景色（Excel） */
#wrapperGreen {
  background: linear-gradient(#f3fef7,#befcd4);
  overflow:hidden;
}

/* 上部のボタン */
#g_navi ul {
  display: flex;
  margin: 0 auto;
  padding: 0 3%;
  width: 94%;
  list-style-type: none;
}
#g_navi ul li {
  position: relative;
  width: 150px;
}
#g_navi ul li:first-child::before {
  position: absolute;
  display: block;
  content: "";
  top: 25%;
  left: 0px;
  width: 1px;
  height: 50%;
}
#g_navi ul li::after {
  position: absolute;
  display: block;
  content: "";
  top: 25%;
  right: 0px;
  width: 1px;
  height: 50%;
}
#g_navi ul li a {
  display: block;
  padding: 17px 10px;
  color: #fff;
  text-align: center;
  text-decoration: none;
}

.title_pc {
  width: 100%;
  display: block;
}

.title_mobile{
  display: none;
}

/* 以下スマホ（840pxより大きい場合） */
@media screen and (min-width: 840px) {
  
  h3 { 
    font-size: 1.6em;
  }
  h4 {
    font-size: 1.3em; 
  }
  p {
    font-size: 1.05em;
    line-height: 1.8;
  }

}

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

  section {
    padding-top: 12%;
  }

  .title_pc {
    display: none;
  }

  .title_mobile{
    width: 100%;
    display: block;
  }

}