@charset "UTF-8";
:root {
  --hover-transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  --clip-path-transition: clip-path cubic-bezier(0.86, 0, 0.07, 1);
  --color-black: #1a1311;
  --color-gold: #1a1311;
  --color-pink: #d8005c;
  --color-rightPink: #fdf3f4;
  --color-rightPink2: #ffebed;
  --color-beige: #f9f7f4;
  --color-rightBeige: #f8f8f8;
  --color-gray: #707070;
  --color-rightGray: #c1c1c1;
  --color-rightGray2: #e0e0e0;
  --color-semiRightGray: #ededed;
  --color-blue: #51b1c6;
  --color-red: #ff0000;
  --font-din: "din-2014", sans-serif;
  --font-serif: "Noto Serif JP", serif;
  --font-sansSerif: "Noto Sans JP", sans-serif;
}

::-moz-selection {
  color: #fff;
  background-color: var(--color-pink);
}

::selection {
  color: #fff;
  background-color: var(--color-pink);
}

/* ブレークポイント */
@media screen and (min-width: 768px) {
  .--sp {
    display: none;
  }
}

.--pc {
  display: none;
}
@media screen and (min-width: 769px) {
  .--pc {
    display: block;
  }
}

/* ルートの文字サイズを10pxに設定 */
html {
  font-size: 62.5%;
  scroll-behavior: smooth;
  scroll-padding-top: 60px;
}
@media screen and (min-width: 768px) {
  html {
    scroll-padding-top: 136px;
  }
}

body {
  font-size: 1.5rem;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 300;
  letter-spacing: 0;
  margin: 0;
  line-height: 1.666;
  color: var(--color-black);
  background-color: #fff;
}
@media screen and (min-width: 768px) {
  body {
    font-size: 1.6rem;
    line-height: 1.875;
  }
}

.header .header__inner {
  padding: 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.header .header__inner .header__inner__logo a {
  -webkit-transition: 0.2s opacity cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: 0.2s opacity cubic-bezier(0.075, 0.82, 0.165, 1);
}
.header .header__inner .header__inner__logo a:hover {
  opacity: 0.7;
}
.header .header__inner .header__inner__logo a img {
  width: 224px;
}
.header .header__inner .header__inner__link {
  color: #000;
  font-size: 14px;
}
.header .header__inner .header__inner__link:hover {
  text-decoration: none;
}

.kakomiWrap {
  background-color: var(--color-rightPink);
  padding: 40px 20px;
}
@media screen and (min-width: 768px) {
  .kakomiWrap {
    padding: 80px 20px 70px;
  }
}
.kakomiWrap .kakomi {
  background-color: #fff;
}

.form {
  max-width: 600px;
  margin: 0 auto;
}
.form .form__col2 {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  grid-gap: 10px;
}
@media screen and (min-width: 768px) {
  .form .form__col2 {
    -ms-grid-columns: 1fr 10px 1fr;
    grid-template-columns: 1fr 1fr;
  }
}
.form .form__col3 {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  grid-gap: 10px;
}
@media screen and (min-width: 768px) {
  .form .form__col3 {
    -ms-grid-columns: 1fr 10px 1fr 10px 1fr;
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.form .note {
  font-size: 12px;
}

/*インプット type="text"*/
.input-group {
  position: relative;
}

.input {
  padding: 16px;
  font-size: 16px;
  color: var(--color-black);
  -webkit-transition: border 150ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: border 150ms cubic-bezier(0.4, 0, 0.2, 1);
  width: 100%;
  border: 1px solid #dddddd;
  border-radius: 10px;
  background-color: #f4f4f4;
  font-family: var(--font-serif);
}

.user-label {
  position: absolute;
  left: 15px;
  color: var(--color-black);
  pointer-events: none;
  -webkit-transform: translateY(1em);
          transform: translateY(1em);
  -webkit-transition: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  line-height: 1;
  font-size: 18px;
  font-weight: 500;
  font-family: var(--font-serif);
}

.input:focus,
input:valid {
  outline: none;
  border: 1px solid var(--color-pink);
  background-color: #fff;
}

.input:focus ~ label,
input:valid ~ label {
  -webkit-transform: translateY(-50%) scale(0.8);
          transform: translateY(-50%) scale(0.8);
  background-color: #fff;
  padding: 0 0.2em;
  color: var(--color-pink);
}

/*セレクト*/
.selectbox-002 {
  position: relative;
}

.selectbox-002 {
  -webkit-transition: border 150ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: border 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

.selectbox-002::before,
.selectbox-002::after {
  position: absolute;
  content: "";
  pointer-events: none;
}

.selectbox-002::before {
  right: 1px;
  width: 50px;
  height: calc(100% - 2px);
  top: 0;
  bottom: 0;
  margin: auto;
  display: inline-block;
  border-radius: 0 10px 10px 0;
  background-color: #fff;
  content: "";
  border-left: 1px solid #dddddd;
  -webkit-transition: border 150ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: border 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

.selectbox-002::after {
  position: absolute;
  top: 54%;
  right: 25px;
  -webkit-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 12px 8px 0 8px;
  border-color: #8b8b8b transparent transparent transparent;
  content: "";
}

.selectbox-002 select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  padding: 0.4em 3.6em 0.4em 0.8em;
  border: solid 1px #ddd;
  border-radius: 1rem;
  padding: 16px;
  font-size: 16px;
  cursor: pointer;
  width: 100%;
  background-color: #f4f4f4;
  font-family: var(--font-serif);
  color: var(--color-black);
}
.selectbox-002 select:hover {
  border-color: var(--color-pink);
}

.selectbox-002 select option:first-child {
  font-size: 18px;
  font-weight: 500;
  font-family: var(--font-serif);
}

.btn[type=submit] {
  background-color: var(--color-pink);
  font-family: var(--font-serif);
  font-size: 18px;
  color: #fff;
  border: none;
  padding: 16px 0;
  max-width: 256px;
  width: 100%;
  -webkit-transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  cursor: pointer;
  display: block;
  margin: 35px auto 0;
  border-radius: 100px;
}
@media screen and (min-width: 768px) {
  .btn[type=submit] {
    margin: 65px auto 0;
  }
}
.btn[type=submit]:hover {
  color: #d8005c;
  background-color: #ededed;
}

.module .newsList {
  list-style-type: none;
  padding: 0;
  font-size: 1.4rem;
}
@media screen and (min-width: 768px) {
  .module .newsList {
    font-size: 1.5rem;
  }
}
.module .newsList .newsList__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 16px;
}

footer {
  text-align: center;
}
footer .footer__inner {
  background-color: #f9f7f4;
  padding: 35px 20px;
}
footer .footer__inner .footer__logo {
  text-align: center;
  margin-bottom: 20px;
}
footer .footer__inner .footer__txt strong {
  font-weight: 500;
  font-family: var(--font-serif);
  font-size: 18px;
}
footer .footer__inner .footer__txt a {
  color: var(--color-pink);
}
footer .footer__inner .footer__txt a:hover {
  text-decoration: none;
}
footer .footer__copy {
  background-color: var(--color-gold);
  color: #fff;
  text-align: center;
  padding: 10px;
  width: 100%;
  display: block;
}

/* ===========================================
 * .exam-table
 * ======================================== */
.module .exam-tablesWrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 40px;
}
@media screen and (min-width: 768px) {
  .module .exam-tablesWrap {
    gap: 80px;
  }
}
.module .exam-tablesWrap .exam-table {
  font-size: 12px;
}
@media screen and (min-width: 768px) {
  .module .exam-tablesWrap .exam-table {
    font-size: 18px;
  }
}
.module .exam-tablesWrap .exam-table tbody tr th {
  padding: 1em 1.25em;
  width: 100px;
  line-height: 1.5;
}
.module .exam-tablesWrap .exam-table tbody tr td {
  padding: 1em 1.25em;
  line-height: 1.5;
}
.module .exam-tablesWrap .exam-table tbody tr td .note li {
  font-weight: 100;
}
.module .exam-tablesWrap hr {
  margin: 24px 0;
}

/* ===========================================
 * 関連するお知らせ
 * ======================================== */
.newsList {
  padding: 0;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
/* ===========================================
 * ID="examBadges"を非表示
 * ======================================== */
#examBadges {
  display: none;
}

.loading-message {
  text-align: center;
  margin-top: 15px;
  color: #d8005c;
  -webkit-animation: blink-animation 1.5s infinite;
          animation: blink-animation 1.5s infinite;
  font-size: 14px;
}

@-webkit-keyframes blink-animation {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink-animation {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
  100% {
    opacity: 1;
  }
}