@charset "UTF-8";
@chatset 'utf-8';
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: no-repeat transparent;
  color: inherit;
  font: inherit;
  font-size: 100%;
  text-align: inherit;
  text-decoration: none;
  text-underline-offset: 2px;
  vertical-align: baseline;
  touch-action: manipulation; }
  *:not(:focus-visible) {
    outline: 0; }
  *:focus-visible {
    outline-offset: 4px; }
  *::before, *::after {
    box-sizing: inherit;
    vertical-align: inherit; }

html {
  font-size: 10px; }
  html.-init * {
    transition: none !important; }
    html.-init *::before, html.-init *::after {
      transition: inherit !important; }

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  overflow: hidden scroll;
  font-smoothing: antialiased;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -mox-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  font-feature-settings: 'palt';
  word-break: break-word;
  word-wrap: break-word;
  hyphens: none; }

img,
svg,
video,
embed,
canvas,
object,
iframe {
  max-width: 100%;
  height: auto;
  vertical-align: bottom; }

svg {
  fill: currentColor; }

ul,
ol,
li {
  list-style: none inside; }

sup {
  vertical-align: super; }

sub {
  vertical-align: sub; }

[href],
summary,
button,
select,
input[type='button'],
input[type='checkbox'],
input[type='color'],
input[type='date'],
input[type='datetime-local'],
input[type='file'],
input[type='month'],
input[type='radio'],
input[type='range'],
input[type='reset'],
input[type='submit'],
input[type='time'],
input[type='week'],
label[for],
label:has(input) {
  -webkit-tap-highlight-color: transparent;
  cursor: pointer; }

input,
button,
select,
textarea {
  appearance: none; }

textarea {
  resize: vertical; }

summary::marker, summary::-webkit-details-marker {
  display: none;
  content: none; }

video:not([control]) {
  pointer-events: none; }
:root {
  --black: #000000;
  --white: #ffffff;
  --red: #E61E1E;
  --blue: #0064D2;
  --orange: #FA9628;
  --teal: #50BEBE;
  --cyan: #64AFE1;
  --gray: #A0A0A5;
  --yellow: #FAD737;
  --lavender: #AF8CC8;
  --darkOrange: #B94B00;
  --darkTeal: #007580;
  --darkCyan: #265C80;
  --darkGray: #505054;
  --darkYellow: #916E00;
  --darkLavender: #644080; }

body {
  background-color: #ffffff;
  color: #000000;
  font-family: "Noto Sans JP","font_name_W3","FP-ヒラギノUD角ゴ StdN W3","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
  line-height: 1.75;
  -webkit-print-color-adjust: exact; }
  @media all and (min-width: 768px) {
    body {
      font-size: 1.6rem; } }
  @media not all and (min-width: 768px) {
    body {
      font-size: 1.4rem; } }
.button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 300px;
  min-height: 50px;
  padding: 10px 40px;
  border-radius: 5px;
  background-color: #004589;
  color: #ffffff;
  font-weight: bold;
  text-align: center; }
  .button[href]::after {
    display: block;
    width: 14px;
    height: 14px;
    margin-top: auto;
    margin-left: auto;
    margin-bottom: auto;
    border-top: solid 2px currentColor;
    border-left: solid 2px currentColor;
    content: "";
    rotate: 135deg; }
  @media (hover) {
    .button[href] {
      transition: background .5s; }
      .button[href]:hover, .button[href]:focus {
        background-color: #0064D2; }
        .button[href]:hover::after, .button[href]:focus::after {
          animation: button 1s infinite; }
    @keyframes button {
      from {
        translate: 0; }
      50% {
        opacity: 1; }
      to {
        opacity: 0;
        translate: 100%; } } }
  .button[href^="#"]::after {
    position: relative;
    top: -4px;
    rotate: 225deg; }
  @media (hover) {
    .button[href^="#"]:hover::after, .button[href^="#"]:focus::after {
      animation: button--type2 1s infinite; }
    @keyframes button--type2 {
      from {
        translate: 0; }
      50% {
        opacity: 1; }
      to {
        opacity: 0;
        translate: 0 25%; } } }
  .button > span {
    margin-left: auto; }
.container {
  width: 100%;
  max-width: 1240px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px; }
.grid {
  display: grid; }

[style*='--gridX:'] {
  grid-template-columns: var(--gridX); }

[style*='--gridY:'] {
  grid-template-rows: var(--gridY); }

[style*="--gap:"] {
  gap: var(--gap); }

@media all and (min-width: 768px) {
  [style*='--gridX\\@pc\:'] {
    grid-template-columns: var(--gridX\@pc); }

  [style*='--gridY\\@pc\:'] {
    grid-template-rows: var(--gridY\@pc); }

  [style*="--gap\\@pc\:"] {
    gap: var(--gap\@pc); } }
@media not all and (min-width: 768px) {
  [style*='--gridX\\@sp\:'] {
    grid-template-columns: var(--gridX\@sp); }

  [style*='--gridY\\@sp\:'] {
    grid-template-rows: var(--gridY\@sp); }

  [style*="--gap\\@sp\:"] {
    gap: var(--gap\@sp); } }
.heading--lv2 {
  color: #004589;
  font-weight: bold;
  line-height: 1.5; }
  @media all and (min-width: 768px) {
    .heading--lv2 {
      font-size: 3.2rem; } }
  @media not all and (min-width: 768px) {
    .heading--lv2 {
      font-size: 2.4rem; } }
  .heading--lv2:has(> .small) {
    line-height: 1.25; }
  @media all and (min-width: 768px) {
    .heading--lv2 > .small {
      font-size: 2.4rem; } }
  @media not all and (min-width: 768px) {
    .heading--lv2 > .small {
      font-size: 1.8rem; } }

.heading--lv3 {
  font-weight: bold;
  line-height: 1.5; }
  @media all and (min-width: 768px) {
    .heading--lv3 {
      font-size: 2.4rem; } }
  @media not all and (min-width: 768px) {
    .heading--lv3 {
      font-size: 2rem; } }

.heading--lv4 {
  font-weight: bold;
  line-height: 1.5; }
  @media all and (min-width: 768px) {
    .heading--lv4 {
      font-size: 2rem; } }
  @media not all and (min-width: 768px) {
    .heading--lv4 {
      font-size: 1.8rem; } }
.kv {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: start;
  position: relative;
  width: 100%;
  max-width: 1220px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 10px;
  padding-right: 10px;
  background-color: #ffffff;
  background-size: 0; }
  @media all and (min-width: 768px) {
    .kv {
      padding-top: 20px;
      height: 250px;
      font-size: 1.8rem; } }
  @media not all and (min-width: 768px) {
    .kv {
      min-height: 200px;
      padding-bottom: 20px;
      font-size: 1.4rem; } }
  @media all and (min-width: 768px) {
    .kv[style*="--bgi"] {
      padding-right: calc(50vw + 10px); } }
  @media all and (min-width: 1220px) {
    .kv[style*="--bgi"] {
      padding-right: 620px; } }
  .kv[style*="--bgi"]::before {
    background-image: inherit;
    background-size: cover;
    background-position: center center;
    content: ""; }
    @media not all and (min-width: 768px) {
      .kv[style*="--bgi"]::before {
        position: relative;
        left: -10px;
        right: -10px;
        width: calc(100% + 20px);
        aspect-ratio: 1.618; } }
    @media all and (min-width: 768px) {
      .kv[style*="--bgi"]::before {
        position: absolute;
        top: 0;
        right: calc(50% - 50vw);
        bottom: 0;
        width: 50vw; } }
  @media all and (min-width: 768px) {
    .kv[style*="--bgi"]::after {
      position: absolute;
      top: 0;
      right: 25%;
      bottom: 0;
      width: 25%;
      background-image: linear-gradient(90deg, #ffffff, transparent 100%);
      content: ""; } }

.kv__title {
  position: relative;
  z-index: 1;
  font-weight: bold;
  line-height: 1.25; }
  @media not all and (min-width: 768px) {
    .kv__title {
      margin-top: 20px;
      font-size: 2.4rem; } }
  @media all and (min-width: 768px) {
    .kv__title {
      font-size: 3.2rem;
      white-space: nowrap; } }
  @media all and (min-width: 1200px) {
    .kv__title {
      font-size: 4rem; } }
  .kv__title ~ * {
    position: relative;
    z-index: 1;
    margin-top: 15px; }
.list {
  display: table;
  width: 100%;
  overflow: auto;
  border-spacing: var(--gap); }
  .list[style*="--list:"] > li::before {
    padding-right: 0.5em;
    content: var(--list); }
  .list > li {
    display: table-row; }
    .list > li::before {
      display: table-cell;
      width: 0;
      white-space: nowrap; }
  .list.-number {
    counter-reset: listNumber; }
    .list.-number[style*="--list:"] > li::before {
      padding-right: 0.5em;
      content: var(--list) counter(listNumber) "."; }
    .list.-number:not([style*="--list:"]) > li::before {
      content: counter(listNumber) "."; }
    .list.-number > li {
      counter-increment: listNumber; }
    .list.-number[style*='--startnum:'] {
      counter-reset: listNumber -1;
      counter-increment: listNumber var(--startnum); }
    .list.-number > li::before {
      content: var(--list) counter(listNumber) "."; }
@media all and (min-width: 768px) {
  .srOnly\@pc {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important; } }
@media not all and (min-width: 768px) {
  .srOnly\@sp {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important; } }
.srOnly {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important; }

@media all and (min-width: 768px) {
  .srOnly--focusable\@pc:not(:focus):not(:focus-within) {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important; } }
@media not all and (min-width: 768px) {
  .srOnly--focusable\@sp:not(:focus):not(:focus-within) {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important; } }
.srOnly--focusable:not(:focus):not(:focus-within) {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important; }
.stretchedLink::before {
  position: absolute;
  inset: 0;
  content: ''; }
.stretchedLink:focus-visible {
  outline-width: 0; }
  .stretchedLink:focus-visible::before {
    outline: inherit;
    outline-width: unset;
    outline-offset: inherit; }
.table > table {
  width: 100%;
  border-collapse: collapse; }
  .table > table > thead > tr > th,
  .table > table > thead > tr > td {
    border: 1px solid #595757;
    vertical-align: middle; }
  .table > table > thead > tr > th {
    border-bottom: 0;
    background-color: #E7E7E8;
    text-align: center;
    line-height: 1.25; }
    @media not all and (min-width: 768px) {
      .table > table > thead > tr > th {
        padding: 5px 10px; } }
    @media all and (min-width: 768px) {
      .table > table > thead > tr > th {
        padding: 10px 20px; } }
  .table > table > tbody > tr > th,
  .table > table > tbody > tr > td {
    vertical-align: middle; }
    @media all and (min-width: 768px) {
      .table > table > tbody > tr > th,
      .table > table > tbody > tr > td {
        min-height: 50px;
        border: 1px solid #595757; } }
  .table > table > tbody > tr > th {
    background-color: #E7E7E8;
    text-align: left; }
    @media not all and (min-width: 768px) {
      .table > table > tbody > tr > th {
        padding: 5px 10px; } }
    @media all and (min-width: 768px) {
      .table > table > tbody > tr > th {
        width: 220px;
        padding: 10px 20px; } }
  .table > table > tbody > tr > td {
    line-height: 1.5; }
    @media not all and (min-width: 768px) {
      .table > table > tbody > tr > td {
        padding-left: 10px;
        padding-right: 10px; } }
    @media all and (min-width: 768px) {
      .table > table > tbody > tr > td {
        padding: 10px 20px; } }
  @media all and (min-width: 768px) {
    .table > table > tbody > tr:nth-of-type(even) > td {
      background-color: #FAFAFA; } }
@media not all and (min-width: 768px) {
  .table.-vertical > table > tbody {
    display: grid;
    gap: 20px; } }
@media not all and (min-width: 768px) {
  .table.-vertical > table > tbody > tr {
    display: grid;
    gap: 10px; } }
@media not all and (min-width: 768px) {
  .table:has(thead) {
    overflow: auto;
    margin-left: -20px;
    padding-left: 20px;
    padding-bottom: 20px; } }
@media not all and (min-width: 768px) {
  .table:has(thead) > table {
    white-space: nowrap; } }
.table:has(thead) > table > thead > tr > th {
  padding: 10px; }
@media not all and (min-width: 768px) {
  .table:has(thead) > table > tbody > tr > th,
  .table:has(thead) > table > tbody > tr > td {
    border: 1px solid #595757; } }
.table:has(thead) > table > tbody > tr > th {
    /*
padding: 10px;*/ }

.table__note {
  display: table-row; }
  @media not all and (min-width: 768px) {
    .table__note {
      font-size: 1.2rem; } }
  @media all and (min-width: 768px) {
    .table__note {
      font-size: 1.4rem; } }
  .table__note[data-before]::before {
    display: table-cell;
    content: attr(data-before); }
.text__link[href] {
  color: #0064D2;
  text-decoration: underline; }
  @media (hover) {
    .text__link[href]:hover, .text__link[href]:focus {
      opacity: .7;
      text-decoration: none; } }
.skiplink[href] {
  position: fixed;
  top: 12px;
  left: 0;
  right: 0;
  z-index: 300;
  background-color: #0064D2;
  font-size: 1.4rem; }
  .skiplink[href]:focus {
    display: flex;
    place-items: center;
    width: fit-content;
    min-width: 48px;
    height: fit-content;
    min-height: 48px;
    margin-left: auto;
    margin-right: auto;
    padding: 6px 10px;
    border-radius: 4px;
    color: #ffffff;
    line-height: 1;
    font-weight: bold;
    white-space: nowrap; }
    @media (hover) {
      .skiplink[href]:focus {
        transition: background 0.5s; }
        .skiplink[href]:focus:hover {
          background-color: #004c9f; }
        .skiplink[href]:focus:active {
          background-color: #00336c; } }
  .skiplink[href]::after {
    width: 0.5em;
    height: 0.5em;
    margin-left: 0.5em;
    border-top: 2px solid currentColor;
    border-left: 2px solid currentColor;
    content: ''; }
  .skiplink[href][href^='#']::after {
    top: -2px;
    rotate: 225deg; }
  .skiplink[href]:not([href^='#'])::after {
    rotate: 135deg; }
.header {
  display: grid;
  position: sticky;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  max-width: 1270px;
  margin-left: auto;
  margin-right: auto;
  background-color: #ffffff; }
  @media all and (min-width: 768px) {
    .header {
      grid-template-columns: 246px auto 1fr;
      grid-template-rows: 64px 1fr;
      column-gap: 40px;
      padding-left: 10px;
      padding-right: 10px; } }
  @media not all and (min-width: 768px) {
    .header {
      --size: 46px;
      grid-template-columns: 246px auto; } }
  .header::before {
    position: absolute;
    inset: 0 calc(50% - 50vw);
    z-index: -1;
    background-color: inherit;
    content: ""; }

.header__noscript {
  grid-area: 4/4/5/1;
  position: relative;
  z-index: -1;
  padding: 20px; }
  @media all and (min-width: 768px) {
    .header__noscript {
      margin-left: -10px;
      margin-right: -10px; } }
  @media not all and (min-width: 768px) {
    .header__noscript {
      grid-column: 1/4; } }
  .header__noscript::before {
    position: absolute;
    inset: 0 calc(50% - 50vw);
    z-index: -1;
    width: 100vw;
    background-color: #efefef;
    content: ""; }

.header__logo {
  display: block; }
  @media all and (min-width: 768px) {
    .header__logo {
      padding-top: 9px;
      padding-bottom: 9px;
      outline-offset: -6px; } }
  @media not all and (min-width: 768px) {
    .header__logo {
      outline-offset: -4px; } }

@media all and (min-width: 768px) {
  .header__identifier {
    display: flex;
    align-items: center;
    height: 48px;
    margin-top: auto;
    margin-bottom: auto;
    font-size: 1.6rem; } }
@media not all and (min-width: 768px) {
  .header__identifier {
    display: none; } }

@media all and (min-width: 768px) {
  .header__check {
    display: none; } }
@media not all and (min-width: 768px) {
  .header__check {
    display: block;
    z-index: 100;
    width: var(--size);
    aspect-ratio: 1;
    margin-left: auto;
    outline-offset: -4px;
    transition: background 0.5s; } }

@media all and (min-width: 768px) {
  .header__check + label[for='header__check'] {
    display: none; } }
@media not all and (min-width: 768px) {
  .header__check + label[for='header__check']::after {
    position: fixed;
    inset: var(--size) 0 0;
    opacity: 0.7;
    background-color: #000000;
    background-color: #000;
    content: '';
    transition: 0.5s;
    transition-property: opacity, visibility;
    will-change: opacity, visibility; }
    .header__check:not(:checked) + label[for='header__check']::after {
      opacity: 0;
      visibility: hidden; } }
@media not all and (min-width: 768px) {
  .header__check + label[for='header__check'] > span {
    --sizeX: 24px;
    --sizeY: 2px;
    display: block;
    position: absolute;
    top: calc((var(--size) - var(--sizeY)) / 2);
    right: calc((var(--size) - var(--sizeX)) / 2);
    width: var(--sizeX);
    height: var(--sizeY);
    background-color: currentColor;
    transition: rotate 0.5s, background 0.5s;
    will-change: rotate, background; }
    .header__check + label[for='header__check'] > span::before, .header__check + label[for='header__check'] > span::after {
      display: inherit;
      position: inherit;
      left: 0;
      right: 0;
      height: inherit;
      margin: inherit;
      background: inherit;
      transition: rotate 0.5s;
      will-change: rotate;
      content: ''; }
    .header__check + label[for='header__check'] > span::before {
      top: calc((var(--sizeY) + 6px) * -1); }
    .header__check + label[for='header__check'] > span::after {
      top: calc((var(--sizeY) + 6px) * 1); }
    .header__check:checked + label > span {
      background: transparent;
      rotate: 360deg; }
      .header__check:checked + label > span:before, .header__check:checked + label > span::after {
        background-color: currentColor; }
      .header__check:checked + label > span::before {
        top: 0;
        rotate: -45deg; }
      .header__check:checked + label > span::after {
        top: 0;
        rotate: 45deg; } }

.header__nav {
  display: grid; }
  @media all and (min-width: 768px) {
    .header__nav {
      grid-template-columns: inherit;
      grid-area: 2/4/2/1;
      z-index: -1;
      margin-top: -64px; } }
  @media not all and (min-width: 768px) {
    .header__nav {
      display: flex;
      flex-direction: column;
      position: fixed;
      inset: var(--size) 0 0;
      width: 100%;
      height: fit-content;
      max-height: calc(100vh - var(--size) * 2);
      overflow: hidden auto;
      transition: opacity 0.5s, visibility 0.5s; } }
  @media not all and (min-width: 768px) {
    .header__check:not(:checked) ~ .header__nav {
      opacity: 0;
      visibility: hidden;
      pointer-events: none; } }

@media all and (min-width: 768px) {
  .header__navList--main {
    display: flex;
    gap: 15px;
    grid-area: 2/5/2/1;
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 10px;
    padding-right: 10px;
    color: #ffffff; } }
@media not all and (min-width: 768px) {
  .header__navList--main {
    border-top: 1px solid #D8D8D8;
    background-color: #efefef;
    color: #000000; } }
@media all and (min-width: 768px) {
  .header__navList--main::before {
    position: absolute;
    inset: 0 calc(50% - 50vw);
    z-index: -1;
    background-color: #004589;
    content: ''; } }
@media all and (min-width: 768px) {
  .header__navList--main > li {
    position: relative; } }

.header__navMainLink {
  outline-offset: -4px; }
  @media all and (min-width: 768px) {
    .header__navMainLink {
      display: flex;
      align-items: center;
      height: 60px;
      padding: 10px 5px;
      font-size: 1.6rem; } }
  @media all and (min-width: 1200px) {
    .header__navMainLink {
      padding-left: 30px;
      padding-right: 30px; } }
  @media not all and (min-width: 768px) {
    .header__navMainLink {
      display: flex;
      align-items: center;
      position: relative;
      height: 48px;
      overflow: hidden;
      padding: 10px;
      padding-right: 40px;
      border-bottom: 1px solid #D8D8D8;
      font-size: 1.4rem;
      white-space: nowrap;
      text-overflow: ellipsis; } }
  @media all and (min-width: 768px) and (hover) {
    .header__navMainLink[href], .header__navMainLink[aria-expanded] {
      transition: background .5s; } }
  @media not all and (min-width: 768px) {
    .header__navMainLink[href]::before, .header__navMainLink[aria-expanded]::before {
      display: block;
      position: absolute;
      top: 0;
      right: 23px;
      bottom: 0;
      width: 13px;
      height: 13px;
      margin-top: auto;
      margin-bottom: auto;
      border-top: 2px solid currentColor;
      border-left: 2px solid currentColor;
      content: '';
      transition: transform 0.5s; } }
  @media not all and (min-width: 768px) {
    .header__navMainLink[href][aria-expanded='false']::before, .header__navMainLink[aria-expanded][aria-expanded='false']::before {
      transform: translate(3px, -3px) rotate3d(1, 0, 0, 180deg) rotate(45deg); } }
  @media not all and (min-width: 768px) {
    .header__navMainLink[href][aria-expanded='true'], .header__navMainLink[aria-expanded][aria-expanded='true'] {
      transition: background .5s;
      background-color: #D8D8D8; } }
  @media not all and (min-width: 768px) {
    .header__navMainLink[href][aria-expanded='true']::before, .header__navMainLink[aria-expanded][aria-expanded='true']::before {
      transform: translate(3px, 3px) rotate3d(1, 0, 0, 0deg) rotate(45deg); } }
  @media all and (min-width: 768px) and (hover) {
    .header__navMainLink[href] {
      transition: background .5s; } }
  @media not all and (min-width: 768px) {
    .header__navMainLink[href]::before {
      display: block;
      position: absolute;
      top: 0;
      right: 23px;
      bottom: 0;
      width: 13px;
      height: 13px;
      margin-top: auto;
      margin-bottom: auto;
      border-top: 2px solid currentColor;
      border-left: 2px solid currentColor;
      content: '';
      transition: transform 0.5s; } }
  @media not all and (min-width: 768px) {
    .header__navMainLink[href][href]:not([aria-expanded])::before {
      rotate: 135deg; } }
  @media all and (min-width: 768px) and (hover) {
    .header__navMainLink[href]:hover, .header__navMainLink[href]:focus {
      background-color: #0AA35C;
      text-decoration: underline; } }
  .header__navMainLink[aria-current='page'] {
    font-weight: bold; }
    @media all and (min-width: 768px) {
      .header__navMainLink[aria-current='page'] {
        background-color: #0AA35C; } }
    @media not all and (min-width: 768px) {
      .header__navMainLink[aria-current='page'] {
        color: #0AA35C; } }

@media all and (min-width: 768px) {
  .header__navDropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: fit-content;
    background-color: #0AA35C;
    color: #ffffff;
    transition: opacity 0.5s; } }
@media not all and (min-width: 768px) {
  .header__navDropdown {
    overflow: hidden;
    background-color: #ffffff;
    transition: height 0.5s, visibility 0.5s; } }
@media not all and (min-width: 768px) {
  .header__navDropdown[aria-hidden='true'] {
    height: 0;
    visibility: hidden; } }
@media not all and (min-width: 768px) {
  .header__navDropdown:not([aria-hidden='true']) {
    height: var(--open); } }
@media not all and (min-width: 768px) {
  .header__navDropdown > li + li {
    border-top: solid 1px #D8D8D8; } }
@media all and (min-width: 768px) {
  .header__navList--main > *:not(:hover):not(:focus-within) .header__navDropdown {
    opacity: 0;
    pointer-events: none; } }

.header__navDropdownLink {
  display: flex;
  align-items: center;
  position: relative;
  height: 50px;
  overflow: hidden;
  outline-offset: -4px;
  white-space: nowrap;
  text-overflow: ellipsis; }
  @media all and (min-width: 768px) {
    .header__navDropdownLink {
      padding-left: 60px;
      padding-right: 60px;
      color: #ffffff;
      font-weight: bold; } }
  @media not all and (min-width: 768px) {
    .header__navDropdownLink {
      padding-left: 40px;
      padding-right: 40px; } }
  .header__navDropdownLink[href]::before {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    width: 13px;
    height: 13px;
    margin-top: auto;
    margin-bottom: auto;
    content: '';
    rotate: 135deg; }
    @media all and (min-width: 768px) {
      .header__navDropdownLink[href]::before {
        right: 20px;
        border-top: 2px solid currentColor;
        border-left: 2px solid currentColor; } }
    @media not all and (min-width: 768px) {
      .header__navDropdownLink[href]::before {
        right: 23px;
        border-top: 2px solid #555555;
        border-left: 2px solid #555555; } }
  .header__navDropdownLink[aria-current='page'] {
    font-weight: bold; }
    @media not all and (min-width: 768px) {
      .header__navDropdownLink[aria-current='page'] {
        color: #0AA35C; } }

.header__navList--sub {
  display: grid;
  grid-template-columns: auto auto;
  font-size: 1.4rem; }
  @media all and (min-width: 768px) {
    .header__navList--sub {
      gap: 6px 0;
      grid-area: 1/4/2/5;
      align-content: center;
      height: 64px;
      padding-top: 4px;
      padding-bottom: 4px; } }
  @media not all and (min-width: 768px) {
    .header__navList--sub {
      gap: 30px 0;
      padding: 15px 20px;
      background-color: #004589;
      color: #ffffff;
      font-weight: bold; } }
  .header__navList--sub::before {
    content: ""; }
  @media not all and (min-width: 768px) {
    .header__navList--sub > * {
      display: flex;
      justify-content: center;
      font-weight: bold; } }
  .header__navList--sub > *:first-of-type {
    display: flex;
    order: -1; }
    @media all and (min-width: 768px) {
      .header__navList--sub > *:first-of-type {
        justify-content: end; } }
    @media not all and (min-width: 768px) {
      .header__navList--sub > *:first-of-type {
        justify-content: center;
        border-right: solid 1px currentColor; } }
    @media all and (min-width: 768px) {
      .header__navList--sub > *:first-of-type::after {
        width: 1px;
        height: 100%;
        margin-left: 10px;
        margin-right: 10px;
        background-color: #cfcfd2;
        content: ""; } }
  @media all and (min-width: 768px) {
    .header__navList--sub > *:nth-of-type(even) {
      display: flex;
      justify-content: end; } }
  @media not all and (min-width: 768px) {
    .header__navList--sub > *:nth-of-type(even) {
      border-right: solid 1px currentColor; } }
  @media all and (min-width: 768px) {
    .header__navList--sub > *:nth-of-type(even)::after {
      width: 1px;
      height: 100%;
      margin-left: 10px;
      margin-right: 10px;
      background-color: #cfcfd2;
      content: ""; } }

.header__navSubLink {
  display: block;
  width: fit-content;
  padding-top: 4px;
  padding-bottom: 4px;
  line-height: 1; }
  @media (hover) {
    .header__navSubLink:hover, .header__navSubLink:focus {
      color: #0064D2;
      text-decoration: underline; } }
  @media not all and (min-width: 768px) {
    .header__navSubLink[aria-current='page'] {
      text-decoration: underline; } }
  @media all and (min-width: 768px) {
    .header__navSubLink[aria-current='page'] {
      color: #0064D2; } }
.footer {
  position: relative;
  width: 100%;
  max-width: 1200px;
  margin-top: auto;
  margin-left: auto;
  margin-right: auto;
  padding: 20px 10px;
  background-color: #004589;
  color: #ffffff; }
  @media all and (min-width: 768px) {
    .footer {
      display: flex;
      align-items: center;
      gap: 20px;
      font-size: 1.2rem; } }
  @media not all and (min-width: 768px) {
    .footer {
      padding-top: 25px;
      padding-bottom: 10px;
      font-size: 1.4rem; } }
  .footer::before {
    position: absolute;
    inset: 0 calc(50% - 50vw);
    z-index: -1;
    background-color: inherit;
    content: ""; }

.footer__backlink {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  z-index: 200;
  width: 50px;
  height: 50px;
  background-color: rgba(0, 82, 137, 0.6);
  border-radius: 10px;
  color: #ffffff;
  transition: background 0.5s, opacity 0.5s, visibility 0.5s; }
  @media all and (min-width: 768px) {
    .footer__backlink {
      right: 20px;
      bottom: 85px; } }
  @media not all and (min-width: 768px) {
    .footer__backlink {
      right: 10px;
      bottom: 10px; } }
  .footer__backlink:not(.-visible) {
    opacity: 0;
    visibility: hidden; }
  .footer__backlink.-visible {
    opacity: 1;
    visibility: visible; }
  .footer__backlink::before {
    display: block;
    width: 20px;
    height: 20px;
    content: "";
    border-top: solid 3px currentColor;
    border-left: solid 3px currentColor;
    rotate: 45deg;
    translate: 0 25%; }

@media (hover) {
  .footer__subLink:hover, .footer__subLink:focus {
    text-decoration: underline; } }

.footer__sub {
  display: flex; }
  @media all and (min-width: 768px) {
    .footer__sub {
      gap: 10px 24px; } }
  @media not all and (min-width: 768px) {
    .footer__sub {
      justify-content: space-around;
      align-items: center;
      gap: 10px; } }

@media all and (min-width: 768px) {
  .footer__identifier {
    display: none; } }
@media not all and (min-width: 768px) {
  .footer__identifier {
    display: block;
    width: fit-content;
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
    font-size: 1.6rem;
    line-height: 1; } }

@media all and (min-width: 768px) {
  .footer__copyright {
    margin-left: auto; } }
@media not all and (min-width: 768px) {
  .footer__copyright {
    display: block;
    margin-top: 10px;
    font-size: 1.2rem; } }
.breadcrumb {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 1230px;
  height: 50px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 10px;
  padding-right: 10px;
  overflow: auto;
  font-size: 1.2rem;
  white-space: nowrap; }
  @media not all and (min-width: 768px) {
    .breadcrumb:not(:focus-within) {
      position: absolute !important;
      width: 1px !important;
      height: 1px !important;
      padding: 0 !important;
      margin: -1px !important;
      overflow: hidden !important;
      clip: rect(0, 0, 0, 0) !important;
      white-space: nowrap !important;
      border: 0 !important; } }
  .breadcrumb > li {
    text-transform: uppercase; }
    .breadcrumb > li + li {
      position: relative;
      padding-left: 2em; }
      .breadcrumb > li + li::before {
        position: absolute;
        top: 0;
        left: 0.5em;
        content: '＞'; }
  .breadcrumb [href] {
    color: #0064D2; }
    @media (hover) {
      .breadcrumb [href]:hover, .breadcrumb [href]:focus {
        text-decoration: underline; } }
    .breadcrumb [href][rel='home']::before {
      width: 20px;
      height: 20px;
      display: block;
      background-image: url("../img/common/creadcrumb--home.svg");
      background-size: 100% auto;
      background-position: center;
      content: ""; }
[class*="top__heading--"] {
  font-weight: bold;
  line-height: 1.5; }
  [class*="top__heading--"] + p {
    text-align: center; }
    @media all and (min-width: 768px) {
      [class*="top__heading--"] + p {
        margin-top: 10px; } }
    @media not all and (min-width: 768px) {
      [class*="top__heading--"] + p {
        margin-top: 5px; } }

@media all and (min-width: 768px) {
  .top__heading--lv2 {
    font-size: 3.2rem; } }
@media not all and (min-width: 768px) {
  .top__heading--lv2 {
    font-size: 2rem; } }

@media all and (min-width: 768px) {
  .top__heading--lv3 {
    font-size: 2.4rem; } }
@media not all and (min-width: 768px) {
  .top__heading--lv3 {
    font-size: 1.8rem; } }
.top__kv {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  margin-left: auto;
  margin-right: auto;
  background-size: 0; }
  @media all and (min-width: 768px) {
    .top__kv {
      height: 690px; } }
  @media not all and (min-width: 768px) {
    .top__kv {
      height: 380px; } }
  .top__kv::before {
    position: absolute;
    inset: 0;
    z-index: -1;
    max-width: 1345px;
    margin-left: auto;
    margin-right: auto;
    background-image: inherit;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    content: ""; }
    @media all and (min-width: 768px) {
      .top__kv::before {
        background-image: url(../img/top__kvBg@pc.jpg.webp); } }
    @media not all and (min-width: 768px) {
      .top__kv::before {
        background-image: url(../img/top__kvBg@sp.jpg.webp); } }
  .top__kv > img {
    opacity: .9;
    width: 65%;
    max-width: 850px;
    background-color: rgba(255, 255, 255, 0.9); }
    @media not all and (min-width: 768px) {
      .top__kv > img {
        padding: 10px 24px; } }

.top__intro {
  width: 100%;
  max-width: 890px;
  margin-left: auto;
  margin-right: auto;
  text-align: center; }
  @media all and (min-width: 768px) {
    .top__intro {
      margin-top: 40px; } }
  @media not all and (min-width: 768px) {
    .top__intro {
      margin-top: 20px; } }

@media all and (min-width: 768px) {
  .top__interview {
    margin-top: 120px; } }
@media not all and (min-width: 768px) {
  .top__interview {
    margin-top: 60px; } }

.top__interviewImage {
  display: block;
  text-align: center; }
  @media all and (min-width: 768px) {
    .top__interviewImage {
      margin-top: 60px; } }
  @media not all and (min-width: 768px) {
    .top__interviewImage {
      margin-top: 30px; } }

@media all and (min-width: 768px) {
  .top__link {
    margin-top: 120px; } }
@media not all and (min-width: 768px) {
  .top__link {
    margin-top: 60px; } }

.top__linkList {
  display: grid; }
  @media all and (min-width: 768px) {
    .top__linkList {
      grid-template-columns: repeat(3, 1fr);
      gap: 40px; } }
  @media not all and (min-width: 768px) {
    .top__linkList {
      gap: 20px; } }

.top__linkItem {
  position: relative;
  z-index: 1;
  background-size: 0; }
  .top__linkItem.-topmessage {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
    overflow: hidden;
    background-color: #228EAA;
    color: #ffffff;
    font-weight: bold; }
    @media all and (min-width: 768px) {
      .top__linkItem.-topmessage {
        grid-column: 1/4;
        min-height: 330px;
        padding: 50px;
        padding-right: calc(50% + 45px); } }
    @media not all and (min-width: 768px) {
      .top__linkItem.-topmessage {
        padding: 40px 20px;
        padding-right: 65px; } }
    .top__linkItem.-topmessage::before {
      background-image: inherit;
      background-repeat: no-repeat;
      content: ""; }
      @media all and (min-width: 768px) {
        .top__linkItem.-topmessage::before {
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          width: 50%;
          background-size: 20%, cover;
          background-position: left, center; } }
      @media not all and (min-width: 768px) {
        .top__linkItem.-topmessage::before {
          margin: -40px -65px 30px -20px;
          aspect-ratio: 345/150;
          background-size: 0, cover;
          background-position: left, top; } }
    .top__linkItem.-topmessage::after {
      position: absolute;
      left: 0;
      z-index: -1;
      aspect-ratio: 1;
      border-radius: 50%;
      background-color: rgba(24, 49, 72, 0.3);
      content: "";
      mix-blend-mode: overlay; }
      @media all and (min-width: 768px) {
        .top__linkItem.-topmessage::after {
          top: 0;
          height: 200%;
          translate: -50% -50%; } }
      @media not all and (min-width: 768px) {
        .top__linkItem.-topmessage::after {
          bottom: -20px;
          height: 100%;
          translate: -50% 0; } }
  .top__linkItem.-company {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
    overflow: hidden;
    background-color: #4AB9E4;
    color: #333;
    font-weight: bold; }
    @media all and (min-width: 768px) {
      .top__linkItem.-company {
        grid-column: 1/4;
        min-height: 280px;
        padding: 50px;
        padding-right: calc(50% + 45px); } }
    @media not all and (min-width: 768px) {
      .top__linkItem.-company {
        padding: 40px 20px 20px;
        padding-right: 65px; } }
    .top__linkItem.-company::before {
      background-image: inherit;
      background-position: left, center;
      background-repeat: no-repeat;
      content: ""; }
      @media all and (min-width: 768px) {
        .top__linkItem.-company::before {
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          width: 50%;
          background-size: 20%, cover; } }
      @media not all and (min-width: 768px) {
        .top__linkItem.-company::before {
          margin: -40px -65px 10px -20px;
          aspect-ratio: 345/120;
          background-size: 0, cover; } }
    .top__linkItem.-company::after {
      position: absolute;
      left: 0;
      z-index: -1;
      aspect-ratio: 1;
      border-radius: 50%;
      background-color: rgba(24, 49, 72, 0.3);
      mix-blend-mode: overlay;
      content: ""; }
      @media all and (min-width: 768px) {
        .top__linkItem.-company::after {
          top: 80px;
          height: 200%;
          translate: -50% -50%; } }
      @media not all and (min-width: 768px) {
        .top__linkItem.-company::after {
          bottom: 30px;
          height: 100%;
          translate: -50% 0; } }
  .top__linkItem:not(.-topmessage):not(.-company) {
    padding: 15px 40px 25px;
    background-color: #C9E8F1; }
    .top__linkItem:not(.-topmessage):not(.-company)::before {
      display: block;
      aspect-ratio: 1;
      margin-left: auto;
      margin-right: auto;
      background-image: inherit;
      background-repeat: no-repeat;
      background-position: center;
      content: ""; }
      @media all and (min-width: 768px) {
        .top__linkItem:not(.-topmessage):not(.-company)::before {
          max-width: 220px; } }
      @media not all and (min-width: 768px) {
        .top__linkItem:not(.-topmessage):not(.-company)::before {
          max-width: 170px; } }

.top__linkItemTitle {
  font-weight: bold; }
  @media all and (min-width: 768px) {
    .top__linkItemTitle {
      font-size: 2.4rem; } }
  @media not all and (min-width: 768px) {
    .top__linkItemTitle {
      font-size: 1.8rem; } }
  .top__linkItemTitle > [href]::after {
    display: block;
    position: absolute;
    top: 0;
    right: 20px;
    bottom: 0;
    width: 28px;
    height: 28px;
    margin-top: auto;
    margin-bottom: auto;
    border-top: solid 4px currentColor;
    border-left: solid 4px currentColor;
    content: "";
    rotate: 135deg; }
    .top__linkItem.-topmessage [href] {
      outline-offset: -4px; }

    @media all and (min-width: 768px) {
      .top__linkItem.-topmessage .top__linkItemTitle > [href]::after, .top__linkItem.-company .top__linkItemTitle > [href]::after {
        right: calc(50% + 20px); } }
    @media not all and (min-width: 768px) {
      .top__linkItem.-topmessage .top__linkItemTitle > [href]::after, .top__linkItem.-company .top__linkItemTitle > [href]::after {
        top: auto;
        bottom: 25%;
        width: 20px;
        height: 20px; } }

    .top__linkItem.-company .top__linkItemTitle > [href]::after {
      color: #004589; }

    .top__linkItem:not(.-topmessage):not(.-company) .top__linkItemTitle > [href]::after {
      border-color: #004589; }
  @media (hover) {
    .top__linkItemTitle > [href]:hover, .top__linkItemTitle > [href]:focus {
      text-decoration: underline; }
      .top__linkItemTitle > [href]:hover::after, .top__linkItemTitle > [href]:focus::after {
        animation: top__linkItem 1.5s infinite; }
    @keyframes top__linkItem {
      from {
        translate: 0; }
      50% {
        opacity: 1; }
      to {
        opacity: 0;
        translate: 50%; } } }
  .top__linkItem:not(.-topmessage):not(.-company) .top__linkItemTitle {
    text-align: center; }

.top__companydata {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 60px;
  background-position: center center; }
  @media all and (min-width: 768px) {
    .top__companydata {
      margin-top: 60px;
      padding-top: 120px;
      padding-bottom: 120px; } }
  @media not all and (min-width: 768px) {
    .top__companydata {
      margin-top: 30px;
      padding-bottom: 60px; } }
  .top__companydata .button {
    position: relative;
    z-index: 1; }

.top__companydataList {
  display: grid;
  position: relative;
  z-index: 1; }
  @media all and (min-width: 768px) {
    .top__companydataList {
      grid-template-columns: repeat(2, 1fr);
      gap: 60px;
      margin-top: 60px;
      padding: 60px 50px 0; } }
  @media not all and (min-width: 768px) {
    .top__companydataList {
      gap: 30px;
      margin-top: 30px;
      padding: 30px 20px; } }
  .top__companydataList::before {
    position: absolute;
    z-index: -1;
    background-color: #ffffff;
    content: ""; }
    @media all and (min-width: 768px) {
      .top__companydataList::before {
        inset: 0 0 -150px; } }
    @media not all and (min-width: 768px) {
      .top__companydataList::before {
        inset: 0 0 -110px; } }
  .top__companydataList > li {
    text-align: center; }

@media all and (min-width: 768px) {
  .top__entry {
    padding-top: 120px;
    padding-bottom: 190px; } }
@media not all and (min-width: 768px) {
  .top__entry {
    padding-top: 60px;
    padding-bottom: 140px; } }

.top__entryList {
  display: grid;
  gap: 50px 30px;
  max-width: 930px;
  margin-left: auto;
  margin-right: auto; }
  @media all and (min-width: 768px) {
    .top__entryList {
      grid-template-columns: repeat(2, 1fr);
      margin-top: 60px; } }
  @media not all and (min-width: 768px) {
    .top__entryList {
      margin-top: 30px; } }

.top__entryItem {
  display: block;
  padding: 20px 50px;
  color: #ffffff;
  background-size: 0; }
  .top__entryItem.-newgraduates {
    background-color: #228EAA; }
  .top__entryItem.-midcareer {
    background-color: #0AA35C; }
  .top__entryItem::after {
    display: block;
    max-width: 250px;
    aspect-ratio: 250/105;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
    background-image: inherit;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% auto;
    content: ""; }
  .top__entryItem[href] {
    position: relative; }
    .top__entryItem[href]::before {
      display: block;
      position: absolute;
      top: 0;
      right: 20px;
      bottom: 0;
      margin-top: auto;
      margin-bottom: auto;
      border-top: solid 4px currentColor;
      border-left: solid 4px currentColor;
      content: "";
      rotate: 135deg; }
      @media all and (min-width: 768px) {
        .top__entryItem[href]::before {
          width: 28px;
          height: 28px; } }
      @media not all and (min-width: 768px) {
        .top__entryItem[href]::before {
          width: 20px;
          height: 20px; } }
    @media (hover) {
      .top__entryItem[href]:hover, .top__entryItem[href]:focus {
        text-decoration: underline; }
        .top__entryItem[href]:hover::before, .top__entryItem[href]:focus::before {
          animation: top__entryItem 1.5s infinite; }
      @keyframes top__entryItem {
        from {
          translate: 0; }
        50% {
          opacity: 1; }
        to {
          opacity: 0;
          translate: 50%; } } }

.top__entryItemTitle {
  display: block;
  font-weight: bold;
  text-align: center; }
  @media all and (min-width: 768px) {
    .top__entryItemTitle {
      font-size: 2.4rem; } }
  @media not all and (min-width: 768px) {
    .top__entryItemTitle {
      font-size: 1.8rem; } }
  .top__entryItemTitle[data-subtitle]::after {
    display: block;
    font-size: 1.4rem;
    content: attr(data-subtitle); }
    @media not all and (min-width: 768px) {
      .top__entryItemTitle[data-subtitle]::after {
        margin-top: 5px; } }
.topmessage {
  position: relative;
  background-color: #ffffff;
  background-image: url(../img/company/topmessage.jpg.webp);
  background-position: bottom center;
  background-size: contain; }
  @media all and (min-width: 768px) {
    .topmessage {
      margin-top: 120px;
      margin-bottom: 120px;
      padding: 60px 50px; } }
  @media not all and (min-width: 768px) {
    .topmessage {
      margin-top: 60px;
      margin-bottom: 60px;
      padding: 30px 20px; } }
  .topmessage::before {
    position: absolute;
    left: calc(50% - 50vw);
    right: calc(50% - 50vw);
    z-index: -1;
    background-color: #F7F7F7;
    content: ""; }
    @media all and (min-width: 768px) {
      .topmessage::before {
        top: -120px;
        bottom: -120px; } }
    @media not all and (min-width: 768px) {
      .topmessage::before {
        top: -60px;
        bottom: -60px; } }

.topmessage__text {
  display: grid;
  text-align: center; }
  @media all and (min-width: 768px) {
    .topmessage__text {
      gap: 2em;
      padding-top: 60px;
      padding-bottom: 60px;
      font-size: 1.8rem; } }
  @media not all and (min-width: 768px) {
    .topmessage__text {
      gap: 1em;
      padding-top: 30px;
      padding-bottom: 30px;
      font-size: 1.6rem; } }
.companydata {
  display: grid;
  position: relative;
  background-color: #ffffff; }
  @media all and (min-width: 768px) {
    .companydata {
      grid-template-columns: repeat(2, 1fr);
      gap: 60px;
      margin-top: 120px;
      margin-bottom: 120px;
      padding: 50px; } }
  @media not all and (min-width: 768px) {
    .companydata {
      gap: 30px;
      margin-top: 60px;
      margin-bottom: 60px;
      padding: 30px 20px; } }
  .companydata::before {
    position: absolute;
    left: calc(50% - 50vw);
    right: calc(50% - 50vw);
    z-index: -1;
    background-color: #F7F7F7;
    content: ""; }
    @media all and (min-width: 768px) {
      .companydata::before {
        top: -120px;
        bottom: -120px; } }
    @media not all and (min-width: 768px) {
      .companydata::before {
        top: -60px;
        bottom: -60px; } }
  .companydata > li {
    text-align: center; }
.interview__cardList {
  display: grid; }
  @media all and (min-width: 768px) {
    .interview__cardList {
      grid-template-columns: repeat(2, 1fr);
      row-gap: 40px;
      margin-right: 40px;
      padding-top: 60px; } }
  @media all and (min-width: 1000px) {
    .interview__cardList {
      grid-template-columns: repeat(3, 1fr);
      padding-top: 90px; } }
  @media not all and (min-width: 768px) {
    .interview__cardList {
      margin-right: 20px;
      padding-top: 40px;
      padding-bottom: 40px; } }
  @media all and (min-width: 768px) {
    .interview__cardList > * {
      margin-right: -40px; } }
  @media not all and (min-width: 768px) {
    .interview__cardList > * {
      margin-right: -20px; } }

.interview__card {
  position: relative; }

.interview__cardImage {
  clip-path: polygon(20% 0, 100% 0, 80% 100%, 0% 100%); }
  .interview__cardImage > img {
    width: 100%; }

.interview__cardBody {
  background-color: #F5F9FB; }
  @media all and (min-width: 768px) {
    .interview__cardBody {
      padding: 30px; } }
  @media not all and (min-width: 768px) {
    .interview__cardBody {
      margin-right: 20px;
      padding: 20px; } }
  @media all and (min-width: 768px) {
    .interview__cardList > *:nth-of-type(odd) .interview__cardBody {
      margin-right: 40px; }
    .interview__cardList > *:nth-of-type(even) .interview__cardBody {
      margin-left: 40px; } }
  @media all and (min-width: 1000px) {
    .interview__cardList > *:nth-of-type(3n+1) .interview__cardBody {
      margin-right: 40px; }
    .interview__cardList > *:nth-of-type(3n+2) .interview__cardBody {
      margin-left: 30px;
      margin-right: 50px; }
    .interview__cardList > *:nth-of-type(3n) .interview__cardBody {
      margin-left: 40px; } }

.interview__cardTitle {
  padding-bottom: 10px;
  font-weight: bold; }
  @media all and (min-width: 768px) {
    .interview__cardTitle {
      font-size: 1.8rem; } }
  @media not all and (min-width: 768px) {
    .interview__cardTitle {
      font-size: 1.6rem; } }
  .interview__cardTitle[data-ruby]::after {
    display: block;
    content: attr(data-ruby); }
.interview__q {
  background-size: cover;
  background-position: top center;
  counter-increment: q; }
  @media all and (min-width: 768px) {
    .interview__q {
      padding-top: 80px;
      padding-bottom: 60px; } }
  @media not all and (min-width: 768px) {
    .interview__q {
      padding-top: 40px;
      padding-bottom: 40px; } }

.interview__qHead {
  display: flex;
  align-items: end;
  gap: 20px;
  font-weight: bold; }
  @media all and (min-width: 768px) {
    .interview__qHead {
      font-size: 2.4rem; } }
  @media not all and (min-width: 768px) {
    .interview__qHead {
      font-size: 1.8rem; } }
  .interview__qHead::before {
    display: flex;
    justify-content: center;
    align-items: center;
    aspect-ratio: 1;
    border-radius: 50%;
    background-color: #0AA35C;
    color: #ffffff;
    font-weight: bold;
    content: "Q" counter(q); }
    @media all and (min-width: 768px) {
      .interview__qHead::before {
        width: 80px;
        font-size: 3.2rem; } }
    @media not all and (min-width: 768px) {
      .interview__qHead::before {
        width: 60px;
        font-size: 2.4rem; } }

.interview__qBody {
  display: grid;
  width: 100%;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 10px; }
  @media all and (min-width: 768px) {
    .interview__qBody {
      gap: 40px; } }
  @media not all and (min-width: 768px) {
    .interview__qBody {
      gap: 30px; } }
  @media all and (min-width: 768px) {
    .interview__q:nth-of-type(odd) .interview__qBody {
      grid-template-columns: 1fr min(53%, 570px); } }

  @media all and (min-width: 768px) {
    .interview__q:nth-of-type(even) .interview__qBody {
      grid-template-columns: min(53%, 570px) 1fr; } }
  @media all and (min-width: 768px) {
    .interview__qBody > [class*="heading"] {
      grid-area: 1 / 1 / 2 / 3; } }

@media all and (min-width: 768px) {
  .interview__q:nth-of-type(even) .interview__qBodyImage {
    order: -1; } }

@media all and (min-width: 768px) {
  .interview__schedule {
    padding-top: 120px;
    padding-bottom: 140px;
    background-size: cover;
    background-position: 75% bottom; } }
@media not all and (min-width: 768px) {
  .interview__schedule {
    padding-top: 40px;
    padding-bottom: 60px;
    background-position: right top; } }

.interview__scheduleHead {
  color: #004589;
  font-weight: bold;
  text-align: center; }
  @media all and (min-width: 768px) {
    .interview__scheduleHead {
      font-size: 3.2rem; } }
  @media not all and (min-width: 768px) {
    .interview__scheduleHead {
      font-size: 2.4rem; } }

@media all and (min-width: 768px) {
  .interview__scheduleBody {
    margin-top: 60px;
    padding-right: 24%; } }
@media not all and (min-width: 768px) {
  .interview__scheduleBody {
    margin-top: 30px; } }
.interview__scheduleBody > li {
  display: grid;
  grid-template-columns: 110px 1fr;
  align-items: start;
  position: relative; }
  @media all and (min-width: 768px) {
    .interview__scheduleBody > li {
      column-gap: 50px; } }
  @media not all and (min-width: 768px) {
    .interview__scheduleBody > li {
      column-gap: 10px; } }

.interview__scheduleBodyTime {
  display: flex;
  align-items: center;
  grid-area: 1 / 1 / 3 / 2;
  color: #004589; }
  .interview__scheduleBodyTime::after {
    display: block;
    width: 50px;
    height: 50px;
    margin-left: 20px;
    background-image: url(../img/work/interview__scheduleBodyTime.svg);
    background-size: 1100px 50px;
    content: ""; }
  .interview__scheduleBodyTime[datetime="08:00"]::after {
    background-position: 0px; }
  .interview__scheduleBodyTime[datetime="08:30"]::after {
    background-position: -50px; }
  .interview__scheduleBodyTime[datetime="09:00"]::after {
    background-position: -100px; }
  .interview__scheduleBodyTime[datetime="09:30"]::after {
    background-position: -150px; }
  .interview__scheduleBodyTime[datetime="10:00"]::after {
    background-position: -200px; }
  .interview__scheduleBodyTime[datetime="10:30"]::after {
    background-position: -250px; }
  .interview__scheduleBodyTime[datetime="11:00"]::after {
    background-position: -300px; }
  .interview__scheduleBodyTime[datetime="11:30"]::after {
    background-position: -350px; }
  .interview__scheduleBodyTime[datetime="12:00"]::after {
    background-position: -400px; }
  .interview__scheduleBodyTime[datetime="12:30"]::after {
    background-position: -450px; }
  .interview__scheduleBodyTime[datetime="13:00"]::after {
    background-position: -500px; }
  .interview__scheduleBodyTime[datetime="13:30"]::after {
    background-position: -550px; }
  .interview__scheduleBodyTime[datetime="14:00"]::after {
    background-position: -600px; }
  .interview__scheduleBodyTime[datetime="14:30"]::after {
    background-position: -650px; }
  .interview__scheduleBodyTime[datetime="15:00"]::after {
    background-position: -700px; }
  .interview__scheduleBodyTime[datetime="15:30"]::after {
    background-position: -750px; }
  .interview__scheduleBodyTime[datetime="16:00"]::after {
    background-position: -800px; }
  .interview__scheduleBodyTime[datetime="16:30"]::after {
    background-position: -850px; }
  .interview__scheduleBodyTime[datetime="17:00"]::after {
    background-position: -900px; }
  .interview__scheduleBodyTime[datetime="17:30"]::after {
    background-position: -950px; }
  .interview__scheduleBodyTime[datetime="18:00"]::after {
    background-position: -1000px; }
  .interview__scheduleBodyTime[datetime="18:30"]::after {
    background-position: -1050px; }
  .interview__scheduleBody > li:not(:last-of-type)::before {
    position: absolute;
    top: 60px;
    bottom: 10px;
    width: 2px;
    background-color: #004589;
    content: ""; }
    @media all and (min-width: 768px) {
      .interview__scheduleBody > li:not(:last-of-type)::before {
        left: 84px; } }
    @media not all and (min-width: 768px) {
      .interview__scheduleBody > li:not(:last-of-type)::before {
        left: 78px; } }

.interview__scheduleBodyTitle {
  display: flex;
  align-items: center;
  grid-area: 1 / 2 / 2 / 3;
  min-height: 50px;
  font-size: 2rem;
  font-weight: bold; }
  .interview__scheduleBodyTitle + * {
    min-height: 60px;
    grid-area: 2 / 2 / 3 / 3; }

.interview__message {
  padding-bottom: 60px;
  background-position: top center; }
  @media all and (min-width: 768px) {
    .interview__message {
      padding-top: 120px; } }
  @media not all and (min-width: 768px) {
    .interview__message {
      padding-top: 50px; } }
  .interview__message > .container {
    background-color: #ffffff; }
    @media all and (min-width: 768px) {
      .interview__message > .container {
        padding: 50px; } }
    @media not all and (min-width: 768px) {
      .interview__message > .container {
        padding: 30px 20px; } }

.interview__messageHead {
  font-weight: bold;
  text-align: center; }
  @media all and (min-width: 768px) {
    .interview__messageHead {
      font-size: 2.4rem; } }
  @media not all and (min-width: 768px) {
    .interview__messageHead {
      font-size: 2rem; } }

.interview__messageBody {
  display: grid;
  margin-top: 10px; }
  @media all and (min-width: 768px) {
    .interview__messageBody {
      gap: 40px;
      grid-template-columns: 1fr min(53%, 570px); } }
  @media not all and (min-width: 768px) {
    .interview__messageBody {
      gap: 30px; } }
  @media all and (min-width: 768px) {
    .interview__messageBody > [class*="heading"] {
      grid-area: 1/1/1/3; } }

@media all and (min-width: 768px) {
  .interview__others {
    padding-top: 120px;
    padding-bottom: 120px; } }
@media not all and (min-width: 768px) {
  .interview__others {
    padding-top: 60px;
    padding-bottom: 60px; } }

.interview__othersHead {
  text-align: center;
  font-weight: bold;
  text-transform: uppercase; }
  @media all and (min-width: 768px) {
    .interview__othersHead {
      font-size: 2.4rem; } }
  @media not all and (min-width: 768px) {
    .interview__othersHead {
      font-size: 2rem; } }

.interview__othersBody {
  margin-top: 10px; }

.interview__othersBodyList {
  display: grid;
  row-gap: 20px;
  margin-right: 20px; }
  @media all and (min-width: 768px) {
    .interview__othersBodyList {
      grid-template-columns: repeat(5, 1fr);
      margin-top: 60px; } }
  @media not all and (min-width: 768px) {
    .interview__othersBodyList {
      grid-template-columns: repeat(2, 1fr);
      margin-top: 30px; } }
  .interview__othersBodyList > li {
    margin-right: -20px;
    clip-path: polygon(20% 0, 100% 0, 80% 100%, 0% 100%); }

.interview__othersBodyItem {
  display: block;
  position: relative;
  overflow: hidden;
  background-size: 0; }
  .interview__othersBodyItem::before {
    display: block;
    background-image: inherit;
    background-size: cover;
    aspect-ratio: 1;
    content: ''; }
  @media (hover) {
    .interview__othersBodyItem[href] {
      transition: opacity .5s; }
      .interview__othersBodyItem[href]:hover, .interview__othersBodyItem[href]:focus {
        opacity: .7; } }
  .interview__othersBodyItem > span {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    padding: 5px 20px;
    padding-right: 33%; }
    .interview__othersBodyItem > span::before {
      position: absolute;
      inset: 0;
      z-index: -1;
      background-color: rgba(255, 255, 255, 0.8);
      content: ""; }
    .interview__othersBodyItem > span::after {
      display: block;
      position: absolute;
      top: 0;
      right: 25%;
      bottom: 0;
      width: 14px;
      height: 14px;
      margin-top: auto;
      margin-bottom: auto;
      border-top: solid 2px #004589;
      border-left: solid 2px #004589;
      content: "";
      rotate: 135deg; }
.faq__item {
  position: relative;
  border-radius: 10px;
  background-color: var(--White);
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.16); }
  .faq__item > summary {
    position: relative; }
    @media not all and (min-width: 768px) {
      .faq__item > summary {
        padding: 10px 40px; } }
    @media all and (min-width: 768px) {
      .faq__item > summary {
        padding: 20px 90px; } }
    .faq__item > summary::before {
      display: flex;
      justify-content: center;
      align-items: center;
      position: absolute;
      top: 0;
      left: 0;
      bottom: 0;
      margin-top: auto;
      margin-bottom: auto;
      color: #004589;
      font-weight: bold;
      line-height: 1;
      content: 'Q'; }
      @media not all and (min-width: 768px) {
        .faq__item > summary::before {
          width: 40px;
          font-size: 2.4rem; } }
      @media all and (min-width: 768px) {
        .faq__item > summary::before {
          width: 90px;
          font-size: 3.8rem; } }
    .faq__item > summary > span::before, .faq__item > summary > span::after {
      display: block;
      position: absolute;
      top: 0;
      bottom: 0;
      height: 2px;
      margin-top: auto;
      margin-bottom: auto;
      background-color: #004589;
      transition: rotate 0.5s;
      content: ''; }
      @media not all and (min-width: 768px) {
        .faq__item > summary > span::before, .faq__item > summary > span::after {
          right: 12px;
          width: 16px; } }
      @media all and (min-width: 768px) {
        .faq__item > summary > span::before, .faq__item > summary > span::after {
          right: 32px;
          width: 26px; } }
    .faq__item > summary > span::after {
      rotate: 90deg; }
    .faq__item[open] > summary > span::before, .faq__item[open] > summary > span::after {
      rotate: 180deg; }
    .faq__item > summary + * {
      position: relative; }
      @media not all and (min-width: 768px) {
        .faq__item > summary + * {
          padding: 10px 40px; } }
      @media all and (min-width: 768px) {
        .faq__item > summary + * {
          padding: 20px 90px; } }
      .faq__item > summary + *::before {
        display: flex;
        justify-content: center;
        position: absolute;
        left: 0;
        bottom: 0;
        margin-top: auto;
        margin-bottom: auto;
        color: #0AA35C;
        font-weight: bold;
        line-height: 1;
        content: 'A'; }
        @media not all and (min-width: 768px) {
          .faq__item > summary + *::before {
            top: 10px;
            width: 40px;
            font-size: 2.4rem; } }
        @media all and (min-width: 768px) {
          .faq__item > summary + *::before {
            top: 20px;
            width: 90px;
            font-size: 3.8rem; } }
  .faq__item + * {
    margin-top: 30px; }
[style*='--bgc:'] {
  background-color: var(--bgc) !important; }

@media all and (min-width: 768px) {
  [style*='--bgc\\@pc\:'] {
    background-color: var(--bgc\@pc) !important; } }
@media not all and (min-width: 768px) {
  [style*='--bgc\\@sp\:'] {
    background-color: var(--bgc\@sp) !important; } }
[style*='--bgi:']:not([data-bglazy]),
[style*='--bgi:'][data-bglazy='true'] {
  background-image: var(--bgi) !important; }

@media all and (min-width: 768px) {
  [style*='--bgi\\@pc\:']:not([data-bglazy]),
  [style*='--bgi\\@pc\:'][data-bglazy='true'] {
    background-image: var(--bgi\@pc) !important; } }
@media not all and (min-width: 768px) {
  [style*='--bgi\\@sp\:']:not([data-bglazy]),
  [style*='--bgi\\@sp\:'][data-bglazy='true'] {
    background-image: var(--bgi\@sp) !important; } }
[style*='--c:'] {
  color: var(--c) !important; }

@media all and (min-width: 768px) {
  [style*='--c\\@pc\:'] {
    color: var(--c\@pc) !important; } }
@media not all and (min-width: 768px) {
  [style*='--c\\@sp\:'] {
    color: var(--c\@sp) !important; } }
@media all and (min-width: 768px) {
  .dI\@pc {
    display: inline !important; } }
@media not all and (min-width: 768px) {
  .dI\@sp {
    display: inline !important; } }
.dI {
  display: inline !important; }

@media all and (min-width: 768px) {
  .dIb\@pc {
    display: inline-block !important; } }
@media not all and (min-width: 768px) {
  .dIb\@sp {
    display: inline-block !important; } }
.dIb {
  display: inline-block !important; }

@media all and (min-width: 768px) {
  .dN\@pc {
    display: none !important; } }
@media not all and (min-width: 768px) {
  .dN\@sp {
    display: none !important; } }
.dN {
  display: none !important; }
@media all and (min-width: 768px) {
  .fwB\@pc {
    font-weight: bold !important; } }
@media not all and (min-width: 768px) {
  .fwB\@sp {
    font-weight: bold !important; } }
.fwB {
  font-weight: bold !important; }

@media all and (min-width: 768px) {
  .fwN\@pc {
    font-weight: normal !important; } }
@media not all and (min-width: 768px) {
  .fwN\@sp {
    font-weight: normal !important; } }
.fwN {
  font-weight: normal !important; }
@media all and (min-width: 768px) {
  .ta\@pc {
    text-align: left !important; } }
@media not all and (min-width: 768px) {
  .ta\@sp {
    text-align: left !important; } }
.ta {
  text-align: left !important; }

@media all and (min-width: 768px) {
  .taC\@pc {
    text-align: center !important; } }
@media not all and (min-width: 768px) {
  .taC\@sp {
    text-align: center !important; } }
.taC {
  text-align: center !important; }

@media all and (min-width: 768px) {
  .taR\@pc {
    text-align: right !important; } }
@media not all and (min-width: 768px) {
  .taR\@sp {
    text-align: right !important; } }
.taR {
  text-align: right !important; }
[style*='--m:'] {
  margin: var(--m) !important; }

[style*='--mx:'] {
  margin-left: var(--mx) !important;
  margin-right: var(--mx) !important; }

[style*='--my:'] {
  margin-top: var(--my) !important;
  margin-bottom: var(--my) !important; }

[style*='--mt:'] {
  margin-top: var(--mt) !important; }

[style*='--ml:'] {
  margin-left: var(--ml) !important; }

[style*='--mr:'] {
  margin-right: var(--mr) !important; }

[style*='--mb:'] {
  margin-bottom: var(--mb) !important; }

@media all and (min-width: 768px) {
  [style*='--m\\@pc\:'] {
    margin: var(--m\@pc) !important; }

  [style*='--mx\\@pc\:'] {
    margin-left: var(--mx\@pc) !important;
    margin-right: var(--mx\@pc) !important; }

  [style*='--my\\@pc\:'] {
    margin-top: var(--my\@pc) !important;
    margin-bottom: var(--my\@pc) !important; }

  [style*='--mt\\@pc\:'] {
    margin-top: var(--mt\@pc) !important; }

  [style*='--ml\\@pc\:'] {
    margin-left: var(--ml\@pc) !important; }

  [style*='--mr\\@pc\:'] {
    margin-right: var(--mr\@pc) !important; }

  [style*='--mb\\@pc\:'] {
    margin-bottom: var(--mb\@pc) !important; } }
@media not all and (min-width: 768px) {
  [style*='--m\\@sp\:'] {
    margin: var(--m\@sp) !important; }

  [style*='--mx\\@sp\:'] {
    margin-left: var(--mx\@sp) !important;
    margin-right: var(--mx\@sp) !important; }

  [style*='--my\\@sp\:'] {
    margin-top: var(--my\@sp) !important;
    margin-bottom: var(--my\@sp) !important; }

  [style*='--mt\\@sp\:'] {
    margin-top: var(--mt\@sp) !important; }

  [style*='--ml\\@sp\:'] {
    margin-left: var(--ml\@sp) !important; }

  [style*='--mr\\@sp\:'] {
    margin-right: var(--mr\@sp) !important; }

  [style*='--mb\\@sp\:'] {
    margin-bottom: var(--mb\@sp) !important; } }
[style*='--p:'] {
  padding: var(--p) !important; }

[style*='--px:'] {
  padding-left: var(--px) !important;
  padding-right: var(--px) !important; }

[style*='--py:'] {
  padding-top: var(--py) !important;
  padding-bottom: var(--py) !important; }

[style*='--pt:'] {
  padding-top: var(--pt) !important; }

[style*='--pl:'] {
  padding-left: var(--pl) !important; }

[style*='--pr:'] {
  padding-right: var(--pr) !important; }

[style*='--pb:'] {
  padding-bottom: var(--pb) !important; }

@media all and (min-width: 768px) {
  [style*='--p\\@pc\:'] {
    padding: var(--p\@pc) !important; }

  [style*='--px\\@pc\:'] {
    padding-left: var(--px\@pc) !important;
    padding-right: var(--px\@pc) !important; }

  [style*='--py\\@pc\:'] {
    padding-top: var(--py\@pc) !important;
    padding-bottom: var(--py\@pc) !important; }

  [style*='--pt\\@pc\:'] {
    padding-top: var(--pt\@pc) !important; }

  [style*='--pl\\@pc\:'] {
    padding-left: var(--pl\@pc) !important; }

  [style*='--pr\\@pc\:'] {
    padding-right: var(--pr\@pc) !important; }

  [style*='--pb\\@pc\:'] {
    padding-bottom: var(--pb\@pc) !important; } }
@media not all and (min-width: 768px) {
  [style*='--p\\@sp\:'] {
    padding: var(--p\@sp) !important; }

  [style*='--px\\@sp\:'] {
    padding-left: var(--px\@sp) !important;
    padding-right: var(--px\@sp) !important; }

  [style*='--py\\@sp\:'] {
    padding-top: var(--py\@sp) !important;
    padding-bottom: var(--py\@sp) !important; }

  [style*='--pt\\@sp\:'] {
    padding-top: var(--pt\@sp) !important; }

  [style*='--pl\\@sp\:'] {
    padding-left: var(--pl\@sp) !important; }

  [style*='--pr\\@sp\:'] {
    padding-right: var(--pr\@sp) !important; }

  [style*='--pb\\@sp\:'] {
    padding-bottom: var(--pb\@sp) !important; } }
[style*='--order:'] {
  order: var(--order) !important; }

@media all and (min-width: 768px) {
  [style*='--order\\@pc\:'] {
    order: var(--order\@pc) !important; } }
@media not all and (min-width: 768px) {
  [style*='--order\\@sp\:'] {
    order: var(--order\@sp) !important; } }
[style*='--w:'] {
  width: var(--w) !important; }

@media all and (min-width: 768px) {
  [style*='--w\\@pc\:'] {
    width: var(--w\@pc) !important; } }
@media not all and (min-width: 768px) {
  [style*='--w\\@sp\:'] {
    width: var(--w\@sp) !important; } }
[style*='--h:'] {
  height: var(--h) !important; }

@media all and (min-width: 768px) {
  [style*='--h\\@pc\:'] {
    height: var(--h\@pc) !important; } }
@media not all and (min-width: 768px) {
  [style*='--h\\@sp\:'] {
    height: var(--h\@sp) !important; } }
