@charset "utf-8";
/* CSS Document */
/* ======================================================
  Foundation
========================================================= */
*, *::before, *::after {
  box-sizing: border-box;
  outline: none;
}
body {
  margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
  padding: 0;
  margin: 0;
  font-size: 1rem;
  line-height: 1;
}
ul, ol {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 1rem;
  line-height: 1;
}
img {
  height: auto;
  max-width: 100%;
  vertical-align: top;
}
/* ======================================================
  Layout
========================================================= */
/* main
--------------------------------------------------------- */
.l-main {
  margin-bottom: clamp(6.525rem, 17.4vw, 12.3rem);
  color: #000;
  font-family: 'Noto Sans JP', sans-serif;
}
/* -------------------------------------
  bx-tit
------------------------------------- */
.bx-tit {
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  width: min(71.720vw, 584px);
  margin: clamp(5.5500rem, 14.800vw, 7.8rem) auto 0;
}
/* headline
-------------------------------- */
.bx-tit h2 {
  margin-top: clamp(5.025rem, 13.400vw, 6.7rem);
}
@media only screen and (min-width: 961px) {
  .bx-tit h2 {
    margin-top: 2.7rem;
  }
}
/* description
-------------------------------- */
.description {
  font-size: clamp(1.8rem, 4.800vw, 3rem);
  font-weight: 700;
  text-align: center;
  text-indent: 0.1em;
  line-height: 1.5;
  letter-spacing: 0.1em;
}
@media only screen and (min-width: 961px) {
  .description {
    text-indent: 0.3em;
    letter-spacing: 0.3em;
  }
}
/* -------------------------------------
  intro
------------------------------------- */
.intro {
  margin-top: clamp(9.187rem, 24.500vw, 12.25rem);
  background: linear-gradient(#f2f2f2 0%, #f2f2f2 68.36%, #fff 68.36%, #fff 100%);
}
@media only screen and (min-width: 961px) {
  .intro {
    margin-top: 6.279rem;
    background: linear-gradient(#f2f2f2 0%, #f2f2f2 77%, #fff 77%, #fff 100%);
  }
}
/* bx-intro
-------------------------------- */
.bx-intro {
  width: clamp(33.15rem, 88.400vw, 100.4rem);
  padding-top: clamp(3rem, 8vw, 6.409rem);
  margin: 0 auto;
}
/*---- list ----*/
.bx-intro ul {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 11px;
  margin-top: clamp(1.5rem, 4vw, 6.64rem);
  line-height: 1.5;
}
@media only screen and (min-width: px) {
  .bx-intro ul {
    gap: 11px;
  }
}
.bx-intro ul li {
  display: flex;
  width: calc((100% - 11px * 2) / 3);
}
@media only screen and (min-width: 961px) {
  .bx-intro ul li {
    width: calc((100% - 11px * 5) / 6);
  }
}
.bx-intro ul li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  color: #000;
  padding: clamp(1.05rem, 2.800vw, 1.8rem) 0 0;
  font-size: clamp(1.2rem, 3.200vw, 1.8rem);
  font-weight: 700;
  background: #fff;
  border: 1px solid #a4a4a4;
  box-shadow: 3px 3px 4px rgba(0, 0, 0, 0.16);
  text-decoration: none;
  transition: .35s;
}
.bx-intro ul li a:is(:hover, :focus) {
  box-shadow: none;
  transform: translate(3px,3px);
}
.bx-intro ul li a.active {
  color: #000;
  border: 1px solid #000;
}
.bx-intro ul li a.active:is(:hover, :focus) {
  box-shadow: 3px 3px 4px rgba(0, 0, 0, 0.16);
  transform: translate(0);
}
.bx-intro ul li a div:first-child {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 clamp(0.75rem, 2vw, 1.2rem);
}
.bx-intro ul li a div:nth-child(2) {
  padding: 0 clamp(0.75rem, 2vw, 1.2rem);
  margin: 5px 0 12px;
}
.bx-intro ul li a div:nth-child(2) span {
  display: block;
  margin-top: 3px;
  font-size: 1.2rem;
  font-weight: normal;
  line-height: 1.3;
}
.bx-intro ul li a div:last-child {
  display: flex;
  justify-content: center;
  position: relative;
  width: 100%;
  padding: 4px 15px 7px;
  margin-top: auto;
  color: #fff;
  font-size: 1rem;
  font-weight: normal;
  background: #505050;
}
.bx-intro ul li a div:last-child::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 11px;
  height: 6px;
  width: 6px;
  background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%229.192%22%20height%3D%229.192%22%20viewBox%3D%220%200%209.192%209.192%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_401%22%20data-name%3D%22%E3%83%91%E3%82%B9%20401%22%20d%3D%22M-3304.3%2C1289.5v6h6%22%20transform%3D%22translate(-3244.065%20-1415.84)%20rotate(-135)%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-width%3D%221%22%2F%3E%3C%2Fsvg%3E') no-repeat 50% 50% / cover;
  transform: translateY(-50%);
}
/* -------------------------------------
  comic
------------------------------------- */
.comic {
  width: clamp(33.15rem, 88.400vw, 100.4rem);
  margin: clamp(4.8rem, 12.800vw, 7.7rem) auto 0;
}
@media only screen and (min-width: 961px) {
  .comic {
    display: flex;
    flex-direction: row-reverse;
    border: 1px solid #dcdcdc;
  }
}
/* bk-comic
-------------------------------- */
@media only screen and (min-width: 961px) {
  .bk-comic {
    width: 50%;
  }
  .bk-comic:first-child {
    padding: 38px 43px;
  }
  .bk-comic:last-child {
    padding: 42px 41px;
    border-right: 1px solid #dcdcdc;
  }
}
/* headline
-------------------------------- */
.comic h2 {
  margin-bottom: 12px;
  font-size: clamp(2.8rem, 7.466vw, 3.4rem);
  font-weight: 700;
  text-align: center;
  line-height: 1.39;
}
@media only screen and (min-width: 961px) {
  .comic h2 {
    margin-bottom: 0;
    line-height: 1.76;
  }
}
/* modal-comic
-------------------------------- */
.modal-comic img {
  width: 100%;
}
@media only screen and (min-width: 961px) {
  .modal-comic img {
    width: auto;
  }
}
/* btn
-------------------------------- */
/*---- btn-pc ----*/
.btn-pc {
  display: none;
}
@media only screen and (min-width: 961px) {
  .btn-pc {
    display: block;
    margin-top: 6.1rem;
  }
  .btn-pc a {
    display: flex;
    align-items: center;
    height: 6.2rem;
    width: 28.8rem;
    padding: 0 1.83rem 0 4.5rem;
    margin: 0 auto;
    color: #47aee9;
    font-size: 2.4rem;
    background: #fff;
    border: 1px solid #47aee9;
    border-radius: 3.1rem;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.16);
    text-indent: 0.01em;
    text-decoration: none;
    transition: .35s;
    letter-spacing: 0.01em;
  }
  .btn-pc a::after {
    content: '';
    height: 2.9rem;
    width: 2.9rem;
    margin-left: auto;
    background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22%E7%9F%A2%E5%8D%B0%E3%83%9C%E3%82%BF%E3%83%B3_%E5%8F%B31%22%20data-name%3D%22%E7%9F%A2%E5%8D%B0%E3%83%9C%E3%82%BF%E3%83%B3%20%E5%8F%B31%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2229%22%20height%3D%2229%22%20viewBox%3D%220%200%2029%2029%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_269%22%20data-name%3D%22%E3%83%91%E3%82%B9%20269%22%20d%3D%22M14.5%2C0A14.5%2C14.5%2C0%2C1%2C0%2C29%2C14.5%2C14.5%2C14.5%2C0%2C0%2C0%2C14.5%2C0Zm7.266%2C14.692-6.91%2C6.574a1.669%2C1.669%2C0%2C0%2C1-2.3-2.418l2.817-2.679H8.7a1.669%2C1.669%2C0%2C1%2C1%2C0-3.338h6.672l-2.817-2.68a1.669%2C1.669%2C0%2C1%2C1%2C2.3-2.417l6.91%2C6.573a.266.266%2C0%2C0%2C1%2C0%2C.385Z%22%20fill%3D%22%2347aee9%22%2F%3E%3C%2Fsvg%3E');
  }
  .btn-pc a:is(:hover, :focus) {
    color: #47aee9;
    box-shadow: none;
    transform: translate(2px,3px);
  }
}
/*---- btn-sp ----*/
.btn-sp {
  display: block;
  margin-top: 2.2rem;
}
.btn-sp a {
  display: flex;
  align-items: center;
  height: 5rem;
  width: 23rem;
  padding: 0 1.46rem 0 3.6rem;
  margin: 0 auto;
  color: #47aee9;
  font-size: 1.9rem;
  background: #fff;
  border: 1px solid #47aee9;
  border-radius: 2.5rem;
  box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.16);
  text-indent: 0.01em;
  text-decoration: none;
  letter-spacing: 0.01em;
}
.btn-sp a::after {
  content: '';
  height: 2.3rem;
  width: 2.3rem;
  margin-left: auto;
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22%E7%9F%A2%E5%8D%B0%E3%83%9C%E3%82%BF%E3%83%B3_%E5%8F%B31%22%20data-name%3D%22%E7%9F%A2%E5%8D%B0%E3%83%9C%E3%82%BF%E3%83%B3%20%E5%8F%B31%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223.16%22%20height%3D%2223.16%22%20viewBox%3D%220%200%2023.16%2023.16%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_269%22%20data-name%3D%22%E3%83%91%E3%82%B9%20269%22%20d%3D%22M11.58%2C0A11.58%2C11.58%2C0%2C1%2C0%2C23.16%2C11.58%2C11.58%2C11.58%2C0%2C0%2C0%2C11.58%2C0Zm5.8%2C11.733-5.518%2C5.25a1.333%2C1.333%2C0%2C0%2C1-1.837-1.931l2.249-2.14H6.948a1.333%2C1.333%2C0%2C1%2C1%2C0-2.666h5.329l-2.249-2.14a1.333%2C1.333%2C0%2C1%2C1%2C1.837-1.93l5.518%2C5.25a.212.212%2C0%2C0%2C1%2C0%2C.307Z%22%20fill%3D%22%2347aee9%22%2F%3E%3C%2Fsvg%3E');
}
@media only screen and (min-width: 961px) {
  .btn-sp {
    display: none;
  }
}
/* -------------------------------------
  meeting
------------------------------------- */
.meeting {
  width: clamp(33.15rem, 88.400vw, 100.4rem);
  margin: clamp(6.3rem, 16.800vw, 8.4rem) auto 0;
}
@media only screen and (min-width: 961px) {
  .meeting {
    margin-top: 6.709rem;
  }
}
/* headline
-------------------------------- */
.meeting h2 {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: 88%;
  margin: 0 auto;
  font-size: clamp(2.7rem, 7.200vw, 5rem);
  font-weight: 700;
  text-align: center;
  line-height: 1.3;
}
@media only screen and (min-width: 961px) {
  .meeting h2 {
    flex-wrap: nowrap;
    width: auto;
  }
}
.meeting h2 .ttl {
  height: clamp(2.78rem, 7.416vw, 6.193rem);
  width: clamp(12.87rem, 34.324vw, 28.662rem);
  margin-right: min(2.200vw, 1.4rem);
  font-size: 0;
  background: url("../img/ttl.svg") no-repeat 50% 50% / cover;
}
.meeting h2 .fs {
  margin-top: .5em;
  font-size: clamp(1.65rem, 4.400vw, 3.6rem);
}
.meeting h2 .lf {
  display: block;
}
@media only screen and (min-width: 961px) {
  .meeting h2 .lf {
    display: inline;
  }
}
.meeting h3 {
  font-size: 2.8rem;
  text-align: center;
  line-height: 1.4;
}
.meeting h3 span {
  display: block;
  font-size: 2rem;
}
/* paragraph
-------------------------------- */
.meeting p {
  margin-top: 2.2rem;
  font-size: 1.6rem;
  line-height: 1.75;
}
/* list
-------------------------------- */
.meeting ol {
  display: flex;
  flex-direction: column;
  gap: clamp(4.279rem, 11.400vw, 5.7rem);
  margin-top: clamp(4.65rem, 12.400vw, 7.8rem);
}
@media only screen and (min-width: 961px) {
  .meeting ol {
    flex-direction: row;
    gap: 40px;
  }
}
.meeting ol li {
  counter-increment: number 0;
  position: relative;
  padding: 3.8rem 2.4rem 3.45rem;
  background: #fff;
  border: 1px solid #dcdcdc;
}
@media only screen and (min-width: 961px) {
  .meeting ol li {
    width: calc((100% - 40px * 2) / 3);
  }
}
.meeting ol li::before {
  display: flex;
  justify-content: center;
  align-items: center;
  counter-increment: number;
  content: counter(number)"";
  position: absolute;
  top: -2.4rem;
  left: 50%;
  height: 4.8rem;
  width: 5.6rem;
  color: #fff;
  font-size: 3rem;
  font-weight: 500;
  background: #222;
  transform: translateX(-50%);
}
.meeting ol li img {
  width: 100%;
}
/* -------------------------------------
  price
------------------------------------- */
.price {
  width: clamp(33.15rem, 88.400vw, 100.4rem);
  margin: clamp(4.279rem, 11.400vw, 8.4rem) auto 0;
}
/* headline
-------------------------------- */
.price h2 {
  margin-bottom: clamp(4.35rem, 11.600vw, 7.5rem);
  font-size: clamp(2.7rem, 7.200vw, 5rem);
  font-weight: 700;
  text-align: center;
  text-indent: .2em;
  line-height: 1.5;
  letter-spacing: .2em;
}
@media only screen and (min-width: 961px) {
  .price h2 {
    text-indent: .5em;
    letter-spacing: .5em;
  }
}
/* inner-price
-------------------------------- */
.inner-price {
  display: flex;
  flex-direction: column;
  gap: clamp(3.679rem, 9.800vw, 4.9rem);
}
@media only screen and (min-width: 961px) {
  .inner-price {
    flex-direction: row;
    gap: 40px;
  }
}
/* bx-price
-------------------------------- */
.bx-price {
  position: relative;
  padding: clamp(4.58rem, 12.200vw, 6.1rem) clamp(1.5rem, 4vw, 4.45rem) clamp(3.34rem, 9.900vw, 4.95rem);
  background: #fff;
  border: 1px solid #dcdcdc;
}
@media only screen and (min-width: 961px) {
  .bx-price {
    width: calc((100% - 40px) / 2);
  }
}
/*---- headline ----*/
.bx-price h3 {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: calc(100% - 2.4rem);
  left: 50%;
  height: 2.1818em;
  padding: 0 1.6rem;
  color: #fff;
  font-size: clamp(1.65rem, 4.400vw, 2.2rem);
  font-weight: 500;
  background: #222;
  transform: translateX(-50%);
  line-height: 1.27;
  white-space: nowrap;
}
/*---- list ----*/
.bx-price ul {
  display: flex;
  flex-direction: column;
  gap: clamp(1.2rem, 3.200vw, 1.6rem);
  font-size: clamp(1.2rem, 3.200vw, 1.6rem);
  font-weight: 500;
  line-height: 1.5;
}
.bx-price ul li {
  display: flex;
}
.bx-price ul li::before {
  flex-shrink: 0;
  content: '';
  height: clamp(1.2rem, 3.200vw, 1.6rem);
  width: clamp(1.2rem, 3.200vw, 1.6rem);
  margin: .3rem .6875em 0 0;
  background: #666;
  border-radius: 50%;
}
/*---- table ----*/
.bx-price table {
  width: 100%;
  margin-top: 1.35rem;
  font-size: clamp(1rem, 2.800vw, 1.4rem);
  border-collapse: collapse;
  border-spacing: 0;
}
.bx-price table caption {
  margin-bottom: .2em;
  font-size: 1.2rem;
  text-align: right;
}
.bx-price th {
  padding: 3px;
  font-weight: 400;
  text-align: center;
  vertical-align: top;
  white-space: nowrap;
}
.bx-price thead th {
  color: #fff;
  background: #7c7c7c;
}
.bx-price thead th:not(:first-child) {
  border-left: 1px solid #1a1311;
}
.bx-price tbody th {
  position: relative;
  background: #f3f3f3;
  border-bottom: 1px solid #1a1311;
}
.bx-price th span {
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  padding-bottom: .15em;
  font-size: 1rem;
  transform: translateY(-50%);
}
.bx-price .add {
  width: 15em;
}
@media only screen and (min-width: 560px) {
  .bx-price .add {
    width: auto;
  }
}
.bx-price td {
  padding: 3px;
  border-bottom: 1px solid #1a1311;
  border-left: 1px solid #1a1311;
  text-align: center;
  vertical-align: top;
}
.bx-price td div {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  height: 1.7em;
  width: 10.6em;
  margin: .5em auto 0;
  color: #fff;
  font-size: 1rem;
  background: #c71818;
}
.bx-price td div::before {
  content: '';
  position: absolute;
  bottom: calc(100% - 2px);
  left: 50%;
  height: 0;
  width: 0;
  border-style: solid;
  border-width: 0 5px 9px 5px;
  border-color: transparent transparent #C71818 transparent;
}
/* -------------------------------------
  system
------------------------------------- */
.system {
  width: clamp(33.15rem, 88.400vw, 100.4rem);
  margin: clamp(4.13rem,11vw,8.7rem) auto 0;
}
/* headline
-------------------------------- */
.system h2 {
  margin-bottom: calc(clamp(3.45rem, 9.200vw, 7.5rem) - 2.2rem);
  font-size: clamp(2.7rem, 7.200vw, 5rem);
  font-weight: 700;
  text-align: center;
  text-indent: .2em;
  line-height: 1.5;
  letter-spacing: .2em;
}
@media only screen and (min-width: 961px) {
  .system h2 {
    text-indent: .5em;
    letter-spacing: .5em;
  }
}
/* inner-system
-------------------------------- */
.inner-system {
  display: flex;
  flex-direction: column;
}
@media only screen and (min-width: 961px) {
  .inner-system {
    flex-direction: row;
    gap: 40px;
  }
}
/*---- bx-system ----*/
.bx-system {
  position: relative;
  background: #fff;
}
@media only screen and (min-width: 961px) {
  .bx-system {
    width: calc((100% - 40px) / 2);
  }
}
/*headline*/
.bx-system h3 {
  margin-top: 2.2rem;
  font-size: 2.2rem;
  font-weight: 700;
}
/*list*/
.bx-system ul {
  display: flex;
  flex-direction: column;
  gap: clamp(1.2rem, 3.200vw, 1.6rem);
  margin: clamp(1.2rem, 3.200vw, 1.6rem) 0 0 2.5rem;
  font-size: clamp(1.2rem, 3.200vw, 1.6rem);
  font-weight: 500;
  line-height: 1.5;
}
.bx-system ul li {
  display: flex;
}
.bx-system ul .wrap {
  flex-wrap: wrap;
}
.bx-system ul li::before {
  flex-shrink: 0;
  content: '';
  height: clamp(1.2rem, 3.200vw, 1.6rem);
  width: clamp(1.2rem, 3.200vw, 1.6rem);
  margin: .4rem .6875em 0 0;
  background: #666;
  border-radius: 50%;
}
.bx-system ul li span {
  width: 100%;
  margin-left: calc(clamp(1.2rem, 3.200vw, 1.6rem) + .6875em);
  font-size: clamp(1rem,2.666vw,1.2rem);
}
/* -------------------------------------
  service
------------------------------------- */
.service {
  width: clamp(33.15rem, 88.400vw, 100.4rem);
  margin: clamp(4.13rem,11vw,8.7rem) auto 0;
}
/* headline
-------------------------------- */
.service h2 {
  margin-bottom: clamp(4.35rem, 11.600vw, 7.5rem);
  font-size: clamp(2.7rem, 7.200vw, 5rem);
  font-weight: 700;
  text-align: center;
  text-indent: .2em;
  line-height: 1.5;
  letter-spacing: .2em;
}
@media only screen and (min-width: 961px) {
  .service h2 {
    text-indent: .5em;
    letter-spacing: .5em;
  }
}
/* list
-------------------------------- */
.service-bx ul {
  display: flex;
  flex-wrap: wrap;
  gap: min(6vw,30px) clamp(2.1rem,5.600vw,3.2rem);
  margin-top: clamp(2.25rem,6vw,6.5rem);
}
.service-bx ul li {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: calc((100% - clamp(2.1rem,5.600vw,3.2rem)) / 2);
  background: #fff;
  text-align: center;
}
.service-bx ul li a {
  display: block;
  height: 100%;
  width: 100%;
  color: #333;
  border: 1px solid #dcdcdc;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
  text-decoration: none;
  transition: .3s;
}
.service-bx ul li a:is(:hover, :focus) {
  color: #333;
  box-shadow: none;
  transform: translate(3px,3px);
}
.service-bx ul li div:first-child {
  padding: clamp(1.5rem,4vw,2.0rem) clamp(1.5rem,4vw,2.0rem) 0;
}
@media only screen and (min-width: 961px) {
  .service-bx ul li div:first-child {
    padding: 20px 17px 0;
  }
}
.service-bx ul li div:last-child {
  padding: 0 clamp(1.5rem,4vw,2.0rem) clamp(1.5rem,4vw,2.0rem);
  margin-top: 1.2rem;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.5;
}
@media only screen and (min-width: 961px) {
  .service-bx ul li div:last-child {
    padding: 0 20px 17px;
  }
}
/* -------------------------------------
  contact
------------------------------------- */
.contact {
  width: clamp(33.15rem, 88.400vw, 100.4rem);
  margin: clamp(4.13rem,11vw,8.7rem) auto 0;
}
/* headline
-------------------------------- */
.contact h2 {
  margin-bottom: clamp(4.35rem, 11.600vw, 7.5rem);
  font-size: clamp(2.7rem, 7.200vw, 5rem);
  font-weight: 700;
  text-align: center;
  text-indent: .2em;
  line-height: 1.5;
  letter-spacing: .2em;
}
@media only screen and (min-width: 961px) {
  .contact h2 {
    text-indent: .5em;
    letter-spacing: .5em;
  }
}
/* contact-btn
-------------------------------- */
.contact-btn {
  width: clamp(321px,85.600vw,916px);
  margin: clamp(2.7750rem,7.400vw,5.5rem) auto 0;
}
.contact-btn a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
  height: 3.928em;
  padding: 0 min(9rem,12rem);
  color: #fff;
  font-size: clamp(1.633rem,4.6vw,3.2rem);
  font-weight: 700;
  background: #0084b2;
  border-radius: 999px;
  box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.16);
  text-align: center;
  text-decoration: none;
  line-height: 1.47;
}
.contact-btn a::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 1em;
  height: clamp(4.8531rem,12.944vw,6.133rem);
  width: clamp(3.4484rem,9.198vw,8.631rem);
  background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2261.333%22%20height%3D%2286.315%22%20viewBox%3D%220%200%2061.333%2086.315%22%3E%20%3Cg%20id%3D%22%E3%83%A1%E3%83%BC%E3%83%AB%E3%83%9C%E3%83%83%E3%82%AF%E3%82%B9%E3%82%A2%E3%82%A4%E3%82%B3%E3%83%B31%22%20transform%3D%22translate(-74.092)%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_399%22%20data-name%3D%22%E3%83%91%E3%82%B9%20399%22%20d%3D%22M120.327%2C229.491l18.055%2C6.782v-5.229l-18.055-6.781Z%22%20transform%3D%22translate(-38.441%20-186.456)%22%20fill%3D%22%23fff%22%2F%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_400%22%20data-name%3D%22%E3%83%91%E3%82%B9%20400%22%20d%3D%22M135.425%2C43.61V22.51a18.474%2C18.474%2C0%2C0%2C0-1.277-6.543%2C26%2C26%2C0%2C0%2C0-5.75-8.821%2C25.112%2C25.112%2C0%2C0%2C0-8.958-5.958A17.482%2C17.482%2C0%2C0%2C0%2C113.306%2C0a12.028%2C12.028%2C0%2C0%2C0-6.043%2C1.523l-.069.041L79.251%2C20.786a10.138%2C10.138%2C0%2C0%2C0-3.785%2C3.969%2C12.4%2C12.4%2C0%2C0%2C0-1.373%2C5.886V52.065l28.143%2C10.571v3.349a34.364%2C34.364%2C0%2C0%2C0-4.689%2C1.007%2C25.054%2C25.054%2C0%2C0%2C0-3.828%2C1.451%2C13.829%2C13.829%2C0%2C0%2C0-4.32%2C3.089%2C7.693%2C7.693%2C0%2C0%2C0-1.325%2C2.039%2C5.844%2C5.844%2C0%2C0%2C0%2C.042%2C4.829%2C7.693%2C7.693%2C0%2C0%2C0%2C1.218%2C1.863%2C12.509%2C12.509%2C0%2C0%2C0%2C3.276%2C2.585A25.407%2C25.407%2C0%2C0%2C0%2C99.562%2C85.4a40.313%2C40.313%2C0%2C0%2C0%2C8.717.917%2C41.04%2C41.04%2C0%2C0%2C0%2C7.674-.7%2C30.576%2C30.576%2C0%2C0%2C0%2C4.953-1.363A20.912%2C20.912%2C0%2C0%2C0%2C124.03%2C82.8a11.971%2C11.971%2C0%2C0%2C0%2C3.505-2.912%2C7.186%2C7.186%2C0%2C0%2C0%2C1.06-1.854%2C5.831%2C5.831%2C0%2C0%2C0-.027-4.272%2C7.21%2C7.21%2C0%2C0%2C0-.96-1.684%2C10.861%2C10.861%2C0%2C0%2C0-2.623-2.412%2C21.171%2C21.171%2C0%2C0%2C0-5.606-2.564%2C34.354%2C34.354%2C0%2C0%2C0-5.4-1.165V58.363Zm-57.31%2C5.846V30.641a8.767%2C8.767%2C0%2C0%2C1%2C.939-4.153%2C6.211%2C6.211%2C0%2C0%2C1%2C2.4-2.5l.068-.039%2C1.948-1.341a9.8%2C9.8%2C0%2C0%2C1%2C1.949-.191%2C13.984%2C13.984%2C0%2C0%2C1%2C4.888.961%2C20.564%2C20.564%2C0%2C0%2C1%2C5.358%2C3.045%2C24.038%2C24.038%2C0%2C0%2C1%2C6.128%2C7.109%2C17%2C17%2C0%2C0%2C1%2C2.35%2C8.157V58.564h-1.782Zm39.3%2C21.082a21.783%2C21.783%2C0%2C0%2C1%2C3.361%2C1.208%2C13.455%2C13.455%2C0%2C0%2C1%2C1.927%2C1.079%2C6.588%2C6.588%2C0%2C0%2C1%2C1.765%2C1.669%2C3.068%2C3.068%2C0%2C0%2C1%2C.379.752%2C2.146%2C2.146%2C0%2C0%2C1%2C.116.691%2C2.292%2C2.292%2C0%2C0%2C1-.217.947%2C3.8%2C3.8%2C0%2C0%2C1-.619.932%2C8.527%2C8.527%2C0%2C0%2C1-2.243%2C1.741%2C21.262%2C21.262%2C0%2C0%2C1-5.808%2C2.109%2C36.143%2C36.143%2C0%2C0%2C1-7.8.817%2C36.7%2C36.7%2C0%2C0%2C1-6.88-.627%2C26.476%2C26.476%2C0%2C0%2C1-4.278-1.172%2C16.761%2C16.761%2C0%2C0%2C1-2.509-1.161%2C8.041%2C8.041%2C0%2C0%2C1-2.356-1.915%2C3.416%2C3.416%2C0%2C0%2C1-.51-.878%2C2.2%2C2.2%2C0%2C0%2C1-.151-.793%2C2.236%2C2.236%2C0%2C0%2C1%2C.154-.8%2C3.412%2C3.412%2C0%2C0%2C1%2C.43-.77%2C6.81%2C6.81%2C0%2C0%2C1%2C1.583-1.478%2C16.309%2C16.309%2C0%2C0%2C1%2C4.272-2.016%2C28.849%2C28.849%2C0%2C0%2C1%2C4.2-1v4.262a5.064%2C5.064%2C0%2C0%2C0%2C.5%2C2.227%2C4.838%2C4.838%2C0%2C0%2C0%2C.951%2C1.318%2C5.458%2C5.458%2C0%2C0%2C0%2C1.982%2C1.226%2C6.62%2C6.62%2C0%2C0%2C0%2C2.245.384%2C6.953%2C6.953%2C0%2C0%2C0%2C2.141-.338%2C6.32%2C6.32%2C0%2C0%2C0%2C1.5-.718%2C5.407%2C5.407%2C0%2C0%2C0%2C1.761-1.88%2C5.52%2C5.52%2C0%2C0%2C0%2C.675-2.7V69.813A30.275%2C30.275%2C0%2C0%2C1%2C117.416%2C70.538Zm-11.66%2C3.593V63.959l.06.023.893-.614%2C3.751-2.581V73.652a2.343%2C2.343%2C0%2C0%2C1-.215%2C1.031%2C1.859%2C1.859%2C0%2C0%2C1-.368.517%2C2.4%2C2.4%2C0%2C0%2C1-.855.535%2C3.181%2C3.181%2C0%2C0%2C1-1.113.2%2C2.978%2C2.978%2C0%2C0%2C1-.9-.132%2C2.271%2C2.271%2C0%2C0%2C1-.535-.246%2C1.525%2C1.525%2C0%2C0%2C1-.513-.534A1.762%2C1.762%2C0%2C0%2C1%2C105.755%2C74.131ZM106.912%2C58.5V40.853h-.024a18.354%2C18.354%2C0%2C0%2C0-1.216-5.5%2C25.412%2C25.412%2C0%2C0%2C0-5.62-8.617%2C24.465%2C24.465%2C0%2C0%2C0-8.729-5.807%2C17.994%2C17.994%2C0%2C0%2C0-3.94-1.011L109.4%2C4.778a7.892%2C7.892%2C0%2C0%2C1%2C3.91-.946%2C13.306%2C13.306%2C0%2C0%2C1%2C4.656.923%2C19.9%2C19.9%2C0%2C0%2C1%2C5.192%2C2.952%2C23.4%2C23.4%2C0%2C0%2C1%2C5.971%2C6.927%2C19.042%2C19.042%2C0%2C0%2C1%2C1.688%2C3.972%2C14.009%2C14.009%2C0%2C0%2C1%2C.589%2C3.9V41.65Z%22%20fill%3D%22%23fff%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E') no-repeat 50% 50% / contain;
  transform: translateY(-50%);
  transition: .3s;
}
.contact-btn a:is(:hover, :focus) {
  color: #fff;
  background: #00526e;
}
.contact-btn a span {
  display: block;
  font-size: clamp(1.2rem,3.200vw,2.9rem);
}/* ======================================================
  Utility
========================================================= */
/* font
--------------------------------------------------------- */
/* -------------------------------------
  font-size
------------------------------------- */
.f12 {
  font-size: 1.2rem !important;
}
.f14 {
  font-size: 1.4rem !important;
}
.f16 {
  font-size: 1.6rem !important;
}
/* -------------------------------------
  font-color
------------------------------------- */
.f-yellow {
  color: #fff100;
}
.f-red {
  color: #c71818;
}
/* ======================================================
  State
========================================================= */
/* modal
--------------------------------------------------------- */
.modal-comic img {
  cursor: pointer;
}
#modal-window-image {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  cursor: pointer;
  z-index: 9999;
}
#modal-window-image img {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 98%;
  height: auto;
}
@media (min-width: 960px) {
  #modal-window-image img {
    width: auto;
    height: 98%;
  }
}
.mod {
  overflow: hidden;
}