@charset "UTF-8";

/*** The new CSS reset - version 1.11.3 (last updated 25.8.2024) ***/
*:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) {
  all: unset;
  display: revert;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

a,
button {
  cursor: revert;
}

ol,
ul,
menu,
summary {
  list-style: none;
}

ol {
  counter-reset: revert;
}

img {
  max-inline-size: 100%;
  max-block-size: 100%;
}

table {
  border-collapse: collapse;
}

input,
textarea {
  -webkit-user-select: auto;
}

textarea {
  white-space: revert;
}

meter {
  -webkit-appearance: revert;
  appearance: revert;
}

:where(pre) {
  all: revert;
  box-sizing: border-box;
}

::placeholder {
  color: unset;
}

:where([hidden]) {
  display: none;
}

:where([contenteditable]:not([contenteditable=false])) {
  -moz-user-modify: read-write;
  -webkit-user-modify: read-write;
  overflow-wrap: break-word;
  -webkit-line-break: after-white-space;
  -webkit-user-select: auto;
}

:where([draggable=true]) {
  -webkit-user-drag: element;
}

:where(dialog:modal) {
  all: revert;
  box-sizing: border-box;
}

::-webkit-details-marker {
  display: none;
}

/* Global */
html,
body {
  width: 100%;
  font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  font-size: 14px;
  color: #012e40;
  scroll-padding-top: 51px;
  background-color: #fff;
  scroll-behavior: smooth;
}

a {
  color: #012e40;
  text-decoration: none;
}

@media screen and (max-width: 768px) {
  .spNone {
    display: none !important;
  }
}
@media screen and (min-width: 769px) {
  html,
  body {
    font-size: 16px;
    scroll-padding-top: 150px;
  }
  .pcNone {
    display: none !important;
  }
}
/* Header */
.header {
  position: sticky;
  top: 0;
  z-index: 10;
  background-color: #fff;
  border-bottom: 1px solid #012e40;
}
.header--content {
  display: flex;
  justify-content: space-between;
  height: 50px;
}
.header--logo {
  margin: 11px auto 10px 10px;
}
.header--logo img {
  width: 44px;
  height: 30px;
}
.header--inquiry-btn, .header--menu-btn {
  width: 50px;
  height: 50px;
}
.header--inquiry-btn p, .header--menu-btn p {
  font-size: 10px;
  font-weight: bold;
  text-align: center;
}
.header--inquiry-btn:hover, .header--menu-btn:hover {
  cursor: pointer;
}
.header--inquiry-btn {
  margin-inline-start: auto;
  background: #ffed4c url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2221%22%20fill%3D%22none%22%3E%3Cg%20fill%3D%22%23012E40%22%20clip-path%3D%22url(%23a)%22%3E%3Cpath%20d%3D%22M0%201.417v18.06l9.03-9.187L0%201.417Zm22.47%208.873%209.03%209.188V1.418l-9.03%208.872ZM29.977%200H1.575L15.75%2013.965%2029.977%200Z%22%2F%3E%3Cpath%20d%3D%22M15.75%2016.905%2010.5%2011.76%201.417%2021h28.665L21%2011.76l-5.25%205.145Z%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22a%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M0%200h31.5v21H0z%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E") no-repeat center 10px;
}
.header--inquiry-btn p a {
  display: block;
  width: 100%;
  height: 100%;
  padding-block-start: 33px;
}
.header--menu-btn {
  position: relative;
  padding-block-start: 33px;
  color: #fff;
  background-color: #012e40;
}
.header--menu-btn span {
  position: absolute;
  top: 18px;
  left: 9px;
  display: block;
  width: 32px;
  height: 4px;
  background-color: #fff;
  transition: all 0.2s 0s ease;
}
.header--menu-btn span::before, .header--menu-btn span::after {
  position: absolute;
  left: 0;
  display: block;
  width: 32px;
  height: 4px;
  content: "";
  background-color: #fff;
}
.header--menu-btn span::before {
  top: -9px;
}
.header--menu-btn span::after {
  top: 9px;
}
.header--menu-btn.active span {
  rotate: 45deg;
}
.header--menu-btn.active span::before {
  top: 0;
  rotate: -90deg;
}
.header--menu-btn.active span::after {
  display: none;
}

@media screen and (min-width: 769px) {
  .header--content {
    align-items: center;
    width: 1240px;
    height: auto;
    padding: 10px 20px;
    margin-inline: auto;
  }
  .header--logo {
    margin: 0 auto 0 0;
  }
  .header--logo img {
    width: 88px;
    height: 60px;
  }
  .header--tel {
    margin-inline-end: 12px;
  }
  .header--tel__num {
    font-size: 22px;
    font-weight: bold;
  }
  .header--tel__num::before {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-inline-end: 5px;
    vertical-align: text-bottom;
    content: "";
    background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2230%22%20height%3D%2231%22%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22%23012E40%22%20d%3D%22m28.474%2023.3-5.205-3.404a2.403%202.403%200%200%200-3.252.651c-1.201%201.451-2.652%203.853-8.107-1.601-5.455-5.455-3.103-6.956-1.652-8.157a2.403%202.403%200%200%200%20.651-3.253L7.506%202.332C7.056%201.682%206.456.63%205.054.83%203.653%201.03%200%203.082%200%207.586S3.553%2017.595%208.407%2022.45c4.854%204.854%2010.359%208.357%2014.812%208.357%204.454%200%206.606-4.004%206.756-5.005.15-1-.85-2.051-1.501-2.502Z%22%2F%3E%3C%2Fsvg%3E") no-repeat 0 0;
    background-size: contain;
  }
  .header--tel__time {
    font-size: 11px;
  }
  .header--inquiry a {
    display: block;
    width: 240px;
    padding: 14px 0;
    margin-inline: auto;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    background: #ffed4c;
    border: 3px solid #012e40;
    border-radius: 40px;
    transition: color 0.2s 0s ease, background-color 0.2s 0s ease;
  }
  .header--inquiry a:hover {
    color: #ffed4c;
    background-color: #012e40;
  }
}
/* Navigation */
.navigation {
  position: fixed;
  top: 50px;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
}
.navigation.visible {
  z-index: 3;
  max-height: 100vh;
  overflow-y: auto;
  background: #012e40;
}
.navigation--inquiry {
  padding: 20px;
  background: linear-gradient(180deg, #012e40 0%, #0377a6 100%);
}
.navigation--content li:nth-child(odd) {
  background-color: #fff;
}
.navigation--content li:nth-child(even) {
  background-color: #d9f6fb;
}
.navigation--content li a {
  position: relative;
  display: block;
  padding: 13px 20px;
  font-size: 16px;
}
.navigation--content li a::after {
  position: absolute;
  top: 50%;
  right: 20px;
  display: block;
  width: 8px;
  height: 12px;
  margin-block-start: -6px;
  content: "";
  background-color: #012e40;
  clip-path: polygon(0 0, 0% 100%, 100% 50%);
}

@media screen and (min-width: 769px) {
  .navigation {
    position: relative;
    top: 0;
    z-index: inherit;
    max-height: 50px;
    background-color: #012e40;
    opacity: 1;
  }
  .navigation--content {
    display: flex;
    gap: 55px;
    justify-content: space-between;
    width: 1240px;
    padding-inline: 120px;
    margin-inline: auto;
  }
  .navigation--content li:nth-child(odd), .navigation--content li:nth-child(even) {
    background-color: transparent;
  }
  .navigation--content li a {
    padding: 8px 0;
    font-size: 14px;
    color: #fff;
    text-align: center;
  }
  .navigation--content li a:hover {
    text-decoration: underline;
  }
  .navigation--content li a::after {
    display: none;
  }
}
/* Button */
.inquiry-btn a,
.download-btn a {
  display: block;
  width: 300px;
  padding: 10px 0;
  margin-inline: auto;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  background: #ffed4c;
  border: 3px solid #012e40;
  border-radius: 60px;
}
.inquiry-btn a span,
.download-btn a span {
  display: block;
  font-size: 12px;
}

.download-btn a {
  background: #fff;
}

@media screen and (min-width: 769px) {
  .inquiry-btn a,
  .download-btn a {
    width: 440px;
    padding: 12px 0;
    font-size: 30px;
    transition: color 0.2s 0s ease, background-color 0.2s 0s ease;
  }
  .inquiry-btn a span,
  .download-btn a span {
    font-size: 18px;
    font-weight: normal;
  }
  .inquiry-btn a:hover {
    color: #ffed4c;
    background-color: #012e40;
  }
  .download-btn a:hover {
    color: #fff;
    background-color: #012e40;
  }
}
/* Tel */
.tel-box {
  margin-block-start: 8px;
  font-weight: bold;
  color: #fff;
  text-align: center;
}
.tel-box__num {
  font-size: 28px;
  letter-spacing: 2.8px;
}
.tel-box__num a[href^=tel] {
  color: inherit;
}
.tel-box__num::before {
  display: inline-block;
  width: 30px;
  height: 30px;
  margin-inline-end: 10px;
  vertical-align: text-bottom;
  content: "";
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2230%22%20height%3D%2231%22%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22m28.474%2023.074-5.205-3.403a2.403%202.403%200%200%200-3.252.65c-1.201%201.452-2.652%203.854-8.107-1.6-5.455-5.455-3.103-6.957-1.652-8.158a2.403%202.403%200%200%200%20.651-3.252L7.506%202.106c-.45-.65-1.05-1.701-2.452-1.501C3.653.805%200%202.857%200%207.361c0%204.503%203.553%2010.008%208.407%2014.862%204.854%204.854%2010.359%208.357%2014.812%208.357%204.454%200%206.606-4.003%206.756-5.004.15-1.001-.85-2.052-1.501-2.502Z%22%2F%3E%3C%2Fsvg%3E") no-repeat 0 0;
  background-size: contain;
}
.tel-box__time {
  margin-block-start: 5px;
  font-size: 12px;
}

@media screen and (min-width: 769px) {
  .tel-box__num {
    font-size: 36px;
    letter-spacing: 3.6px;
  }
  .tel-box__num::before {
    vertical-align: unset;
  }
}
/* Footer */
.footer {
  background-color: #fff;
}
.footer--content {
  padding: 40px 20px;
}
.footer--content--logo {
  display: flex;
  gap: 20px;
  align-items: center;
  font-size: 16px;
  font-weight: bold;
}
.footer--content--logo img {
  width: 120px;
}
.footer--content--office li {
  margin-block-start: 10px;
}
.footer--content--office li strong {
  display: block;
  font-weight: bold;
}
.footer--copy {
  background-color: #d9f6fb;
}
.footer--copy--content {
  display: flex;
  flex-direction: column;
  gap: 15px;
  padding: 20px;
  font-size: 12px;
  text-align: center;
}
.footer--copy a {
  font-size: 16px;
  text-decoration: underline;
}

@media screen and (min-width: 769px) {
  .footer {
    max-width: 1440px;
    margin-inline: auto;
  }
  .footer--content {
    width: 1240px;
    padding: 80px 20px;
    margin-inline: auto;
  }
  .footer--content--logo {
    font-size: 30px;
    font-weight: normal;
  }
  .footer--content--logo img {
    width: 88px;
  }
  .footer--content--office li {
    margin-block-start: 20px;
  }
  .footer--content--office li strong {
    display: inline;
    font-weight: normal;
  }
  .footer--copy {
    background-color: #d9f6fb;
  }
  .footer--copy--content {
    flex-direction: row;
    justify-content: space-between;
    width: 1240px;
    margin-inline: auto;
    font-size: 16px;
  }
}
/* Page Top Button */
#page-top {
  position: fixed;
  right: 20px;
  bottom: 20px;
}
#page-top a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  background-color: #fff;
  border: 3px solid #012e40;
  border-radius: 80px;
  opacity: 0;
  transition: background-color 0.2s 0s ease, path 0.2s 0s ease, opacity 0.2s 0s ease;
}
#page-top a svg {
  width: 21px;
  height: 12px;
}
#page-top a:hover {
  background-color: #012e40;
}
#page-top a:hover path {
  stroke: #fff;
}
#page-top.visible a {
  opacity: 1;
}

@media screen and (min-width: 769px) {
  #page-top a {
    width: 80px;
    height: 80px;
  }
  #page-top a svg {
    width: 31px;
    height: 17px;
  }
}