@charset "UTF-8";

.result-wrap {
  max-width: 1000px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

/* 見出し周り */
.result-header {
  text-align: center;
  padding: 60px 20px 40px;
}

.result-header h2 {
  font-size: 2.2rem;
  letter-spacing: 0.25em;
  margin: 0 0 25px;
  font-weight: 600;
  color: #333;
}

.result-header p {
  font-size: 1.2rem;
  margin: 0 0 50px;
  color: #333;
  line-height: 1.5em;
}

@media (max-width: 700px) {
  .result-header {
    padding: 24px 12px 16px;
  }

  .result-header h2 {
    font-size: 1.6rem;
    letter-spacing: 0.08em;
    line-height: 1;
    margin: 0 0 8px;
  }

  .result-header p {
    font-size: 1rem;
    margin: 0 0 16px;
  }
}

/* 3つのボタン */
.result-links {
  max-width: 1000px;
  margin: 0 auto 40px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 20px;
}

.result-links a {
  width: 270px;
  padding: 18px 8px;
  font-size: 1.4rem;
  font-weight: 700;
  text-decoration: none;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: .3s;
}

.result-links a:hover {
  opacity: .6;
}

.btn-junior {
  border: 3px solid #59a3d8;
  color: #59a3d8;
}

.btn-high {
  border: 3px solid #5fb57a;
  color: #5fb57a;
}

.btn-univ {
  border: 3px solid #e07ab3;
  color: #e07ab3;
}

@media (max-width: 700px) {
  .result-links {
    max-width: 100%;
    gap: 4px;
    margin: 0 auto 12px;
  }

  .result-links a {
    flex: 1 1 100%;
    max-width: 100%;
    width: 100%;
    padding: 8px 4px;
    margin: 0;
  }
}

/* セクションボックス（中学／高校／大学） */
.box-junior,
.box-high,
.box-univ {
  width: 100%;
  padding: 40px 30px;
  border-radius: 4px;
}

.box-junior {
  background: #e8f0fc;
}

.box-high {
  background: #ecf7ef;
}

.box-univ {
  background: #fdeaf4;
}

@media (max-width: 700px) {
  .box-junior,
  .box-high,
  .box-univ {
    padding: 16px 12px;
  }
}

/* ボックス見出し */
.box-title {
  display: flex;
  align-items: center;
  gap: 20px;
}

.bar {
  width: 6px;
  height: 50px;
  display: inline-block;
}

.bar-junior {
  background: #1f57c8;
}

.bar-high {
  background: #4ca56b;
}

.bar-univ {
  background: #d6419a;
}

.title-text {
  font-size: 2.4rem;
  font-weight: 700;
}

.title-junior {
  color: #1f57c8;
}

.title-high {
  color: #4ca56b;
}

.title-univ {
  color: #d6419a;
}

@media (max-width: 700px) {
  .bar {
    height: 26px;
  }

  .title-text {
    font-size: 1.4rem;
  }
}

/* テーブル全体 */
.result-table {
  width: 100%;
  border-collapse: collapse;
}

.result-table tr {
  display: flex;
  flex-wrap: wrap;
}

.result-table td {
  flex: 1;
  min-width: 300px;
  padding: 14px 0;
  color: #333;
}

/* 行ごとの文字サイズ（PC） */
.row-big td {
  font-size: 55px;
  font-weight: bold;
}

.row-mid td {
  font-size: 45px;
}

.row-head td {
  flex-basis: 100%;
  padding: 20px 0;
  font-size: 30px;
  font-weight: bold;
}

@media (max-width: 700px) {
 .row-head td{
    font-size:20px;
    padding:8px 0;
  }
}

@media (max-width: 700px) {
  .result-table td {
    padding: 2px 0;
  }
.row-big td {
    font-size: 20px;
    line-height: 1.15;
  }
  .row-mid td {
    font-size: 18px;
    line-height: 1.15;
  }
}

.red td,
.red {
  color: #e73d2b;
}

.note-small {
  font-size: 30px;
}

.note-mid {
  font-size: 40px;
}

.section-head {
  font-size: 30px;
  font-weight: bold;
  margin: 10px 0 0;
  color: #333;
}

.section-head + .result-table {
  margin-top: -20px;
}

@media (max-width:700px){
  .note-small {
    font-size:20px;
  }
  .note-mid{
    font-size:18px;
  }
}

.result-table .note {
  font-size: 24px;
  line-height: 1.2;
}

@media (max-width:700px){
  .result-table .note {
    font-size: 16px;
    line-height: 1.2;
  }
}