@charset "UTF-8";
body * {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
}

body * img {
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

.pc {
  display: block;
}

.sp {
  display: none;
}

.header-wrap {
  position: sticky;
  top: 0;
  z-index: 10;
}

.header-wrap .header-l_wrap {
  display: none;
  justify-content: space-between;
  align-items: center;
  background-color: #f4ff01;
  z-index: 100;
  position: relative;
  width: 100%;
}

.header-wrap .header-l_wrap h1 {
  background-color: #000;
  padding: 0.52083vw 1.04167vw 0;
}

.header-wrap .header-l_wrap h1 img {
  width: 14.58333vw;
}

.header-wrap .header-l_wrap .header-flex {
  display: flex;
  justify-content: flex-end;
  margin-right: 1.5625vw;
  width: 220px;
  z-index: 9999;
}

.header-wrap .header-l_wrap .header-flex li {
  position: relative;
  font-size: clamp(14px, 1.04167vw, 20px);
  font-weight: bold;
}

.header-wrap .header-l_wrap .header-flex li:first-child::after {
  position: absolute;
  left: 60;
  top: 0;
  content: "";
  width: 2px;
  height: 100%;
  background: #000;
  border-radius: 3px;
  transform: rotate(25deg);
  margin-left: 1.04167vw;
  display: none;
}

.header-wrap .header-l_wrap .header-flex li :last-child(3) {
  color: #052ced;
}

.header-wrap .header-l_wrap .header-flex a {
  text-decoration: none;
  color: #000;
}

.header-wrap .header-l_wrap .header-flex label {
  font-size: clamp(12px, 1.04167vw, 20px);
  color: #052ced;
}

.header-wrap .header-l_wrap .header-flex label span {
  font-weight: bold;
}

.header-wrap .header-l_wrap .header-flex .active {
  color: #7d7d7d;
  font-size: clamp(20px, 1.5625vw, 40px);
}

.header-wrap .header-l_wrap .header-flex a:hover {
  text-decoration: underline;
}

.header-wrap #menu-btn-check:checked ~ .menu-btn span {
  background-color: rgba(255, 255, 255, 0);
  /*メニューオープン時は真ん中の線を透明にする*/
}

.header-wrap #menu-btn-check:checked ~ .menu-btn span::before {
  bottom: 0;
  transform: rotate(45deg);
}

.header-wrap #menu-btn-check:checked ~ .menu-btn span::after {
  top: 0;
  transform: rotate(-45deg);
}

.header-wrap #menu-btn-check {
  display: none;
}

.header-wrap .menu-content ul {
  width: 78.125vw;
  margin: 0 auto;
}

.header-wrap .menu-content ul .margin-bottom-120 {
  margin-bottom: 6.25vw;
}

.header-wrap .menu-content ul .margin-bottom-50 {
  margin-bottom: 1.5625vw;
}

.header-wrap .menu-content ul .margin-bottom-75 {
  margin-bottom: 3.90625vw;
}

.header-wrap .menu-content ul li {
  list-style: none;
}

.header-wrap .menu-content ul li a {
  display: inline;
  width: 100%;
  font-size: clamp(20px, 2.86458vw, 55px);
  box-sizing: border-box;
  font-weight: bold;
  text-decoration: none;
  position: relative;
  color: #000;
}

.header-wrap .menu-content .menu-content-sub {
  display: flex;
  width: 56.51042vw;
  justify-content: space-between;
  margin: 0;
}

.header-wrap .menu-content .menu-content-sub li a {
  font-size: clamp(12px, 1.04167vw, 20px);
  font-weight: bold;
  margin-bottom: 3.64583vw;
  display: flex;
  align-items: center;
}

.header-wrap .menu-content .menu-content-sub li a span {
  display: block;
  margin-left: 0.52083vw;
  font-weight: bold;
}

.header-wrap .menu-content .menu-content-sub li a img {
  width: 3.90625vw;
}

.header-wrap .menu-content ul li a::before {
  content: "";
  width: 7px;
  height: 7px;
  transform: rotate(45deg);
  position: absolute;
  right: 11px;
  top: 16px;
}

.header-wrap .menu-content {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 100%;
  /*leftの値を変更してメニューを画面外へ*/
  z-index: 80;
  background-color: #efff00;
  transition: all 0.5s;
  /*アニメーション設定*/
}

.header-wrap #menu-btn-check:checked ~ .menu-content {
  left: 0;
  /*メニューを画面内へ*/
}

.header-wrap .menu-content-top {
  padding-top: 11.45833vw;
  letter-spacing: 0.05em;
}

@media screen and (max-width: 768px) {
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
  .header-wrap {
    position: inherit;
  }
  .header-wrap .header-l_wrap {
    background-color: #000;
    padding: 2vw 0;
    position: fixed;
    width: 100%;
    z-index: 50;
  }
  .header-wrap .menu-content .menu-content-top {
    margin-left: 8vw;
  }
  .header-wrap .menu-content .menu-content-top li {
    font-size: clamp(16px, 6.66667vw, 50px);
  }
  .header-wrap .menu-content .menu-content-top li .menu-content-sub li a {
    font-size: clamp(16px, 4vw, 30px);
    margin-bottom: 4vw;
  }
  .header-wrap .menu-content .menu-content-top li .menu-content-sub li a span {
    margin-left: 2.66667vw;
  }
  .header-wrap .menu-content .menu-content-top li .menu-content-sub li a img {
    width: 14vw;
  }
  .header-wrap .menu-btn {
    position: fixed;
    top: 1.33333vw;
    right: 10px;
    display: flex;
    height: 8vw;
    width: 8vw;
    justify-content: center;
    align-items: center;
    z-index: 90;
  }
  .header-wrap .menu-btn span,
  .header-wrap .menu-btn span:before,
  .header-wrap .menu-btn span:after {
    content: "";
    display: block;
    height: 1px;
    width: 25px;
    border-radius: 3px;
    background-color: #efff00;
    position: absolute;
  }
  .header-wrap .menu-btn span:before {
    bottom: 8px;
  }
  .header-wrap .menu-btn span:after {
    top: 8px;
  }
  .header-wrap .margin-bottom-120 {
    margin-bottom: 10.66667vw;
  }
  .header-wrap .margin-bottom-50 {
    margin-bottom: 5.33333vw;
  }
  .header-wrap .menu-content-sub {
    flex-direction: column;
  }
  .header-wrap .active2::before,
  .header-wrap .active2::after {
    background-color: #000 !important;
  }
}

.footer-l_wrap .footer-background {
  background-color: #efff00;
  padding: 8.59375vw 0 7.8125vw;
}

.footer-l_wrap .footer-l_wrap-flex {
  display: flex;
  justify-content: space-between;
  max-width: 1500px;
  margin: 0 auto;
}

.footer-l_wrap .footer-l_wrap-flex .footer-contact {
  width: 50%;
  text-align: center;
}

.footer-l_wrap .footer-l_wrap-flex .footer-online {
  width: 50%;
  text-align: center;
}

.footer-l_wrap .footer-l_wrap-flex .contact-color {
  font-size: clamp(30px, 3.38542vw, 65px);
  background-color: #052ced;
  color: #efff00;
  font-weight: bold;
  width: fit-content;
  margin: 0 auto;
  padding: 0.26042vw;
}

.footer-l_wrap .footer-l_wrap-flex .online-color {
  font-size: clamp(30px, 3.38542vw, 65px);
  background-color: #ff0062;
  color: #efff00;
  font-weight: bold;
  width: fit-content;
  margin: 0 auto;
  padding: 0.26042vw;
}

.footer-l_wrap .footer-l_wrap-flex .contact-color-under {
  font-size: clamp(16px, 1.45833vw, 28px);
  background-color: #052ced;
  color: #efff00;
  font-weight: bold;
  width: fit-content;
  margin: 0 auto 3.64583vw;
  padding: 0.41667vw 0;
}

.footer-l_wrap .footer-l_wrap-flex .online-color-under {
  font-size: clamp(16px, 1.45833vw, 28px);
  background-color: #ff0062;
  color: #efff00;
  font-weight: bold;
  width: fit-content;
  margin: 0 auto 3.64583vw;
  padding: 0.41667vw 0;
}

.footer-l_wrap .footer-l_wrap-flex .contact-description,
.footer-l_wrap .footer-l_wrap-flex .online-description {
  font-size: clamp(16px, 1.14583vw, 22px);
  line-height: 1.77273;
  letter-spacing: 0.05em;
  margin-bottom: 3.38542vw;
}

.footer-l_wrap .footer-l_wrap-flex .online-description {
  margin-bottom: 1.30208vw;
}

.footer-l_wrap .footer-l_wrap-flex .contact-img {
  width: 2.1875vw;
  margin-bottom: 0.625vw;
  margin: 0 auto;
}

.footer-l_wrap .footer-l_wrap-flex .online-img {
  width: 5.46875vw;
  margin-bottom: 0.625vw;
  margin: 0 auto 0.78125vw;
}

.footer-l_wrap .footer-l_wrap-flex .contact-img,
.footer-l_wrap .footer-l_wrap-flex .online-img {
  max-width: 100%;
}

.footer-l_wrap .footer-l_wrap-flex .address-info p,
.footer-l_wrap .footer-l_wrap-flex .address-kaji-roku p {
  margin-bottom: 1.04167vw;
}

.footer-l_wrap .footer-l_wrap-flex .address-info p a,
.footer-l_wrap .footer-l_wrap-flex .address-kaji-roku p a {
  font-size: clamp(12px, 1.14583vw, 22px);
  padding-bottom: 0.26042vw;
  color: #052ced;
  border-bottom: 1px solid #052ced;
}

.footer-l_wrap .footer-l_wrap-flex .address-info p {
  margin-top: 0.52083vw;
}

.footer-l_wrap .footer-l_wrap-flex .privacy-policy {
  padding-bottom: 0.26042vw;
  border-bottom: solid 1px #052ced;
  display: inline-block;
  color: #052ced;
}

.footer-l_wrap .footer-l_wrap-flex .address-kaji-roku p a {
  font-size: clamp(12px, 1.14583vw, 22px);
}

.footer-l_wrap .footer-img {
  max-width: 100%;
}

.footer-l_wrap .footer-img img {
  width: 100%;
}

.footer-l_wrap .footer-img {
  background-image: url(../images/pc-footer.jpg);
  background-repeat: no-repeat;
  text-align: center;
  padding: 1.30208vw 0 1.30208vw;
  background-size: 100% 100%;
}

.footer-l_wrap .footer-img small {
  color: #fafafa;
  font-size: clamp(12px, 0.78125vw, 15px);
}

@media screen and (max-width: 768px) {
  .footer-l_wrap .footer-l_wrap-flex {
    flex-direction: column;
    align-items: center;
    padding: 0 6.66667vw;
  }
  .footer-l_wrap .footer-l_wrap-flex .footer-contact,
  .footer-l_wrap .footer-l_wrap-flex .footer-online {
    width: 100%;
  }
  .footer-l_wrap .footer-l_wrap-flex .contact-color,
  .footer-l_wrap .footer-l_wrap-flex .online-color {
    font-size: clamp(12px, 8vw, 60px);
    letter-spacing: 0.05em;
    line-height: 0.86667;
    padding: 1.06667vw 1.33333vw;
  }
  .footer-l_wrap .footer-l_wrap-flex .contact-color-under,
  .footer-l_wrap .footer-l_wrap-flex .online-color-under {
    font-size: clamp(12px, 5.33333vw, 40px);
    letter-spacing: 0.05em;
    line-height: 1.75;
    padding: 0 1.33333vw;
    margin-bottom: 10.66667vw;
  }
  .footer-l_wrap .footer-l_wrap-flex .contact-description,
  .footer-l_wrap .footer-l_wrap-flex .online-description {
    letter-spacing: 0.01em;
    line-height: 1.33333;
    font-size: clamp(12px, 3.73333vw, 28px);
  }
  .footer-l_wrap .footer-l_wrap-flex .contact-img {
    margin-bottom: 4vw;
    width: 100%;
  }
  .footer-l_wrap .footer-l_wrap-flex .contact-img .pc-mail {
    width: 9.33333vw;
  }
  .footer-l_wrap .footer-l_wrap-flex .online-img {
    width: 100%;
    margin-bottom: 4vw;
  }
  .footer-l_wrap .footer-l_wrap-flex .online-img .active2::after {
    width: 21.33333vw;
  }
  .footer-l_wrap .footer-l_wrap-flex .address-info p,
  .footer-l_wrap .footer-l_wrap-flex .address-kaji-roku p {
    margin-bottom: 13.33333vw;
  }
  .footer-l_wrap .footer-l_wrap-flex .address-info p a,
  .footer-l_wrap .footer-l_wrap-flex .address-kaji-roku p a {
    font-size: clamp(12px, 5.33333vw, 40px);
    padding-bottom: 0.66667vw;
  }
  .footer-l_wrap .footer-l_wrap-flex .privacy-policy {
    margin-bottom: 23.33333vw;
    padding-bottom: 1.33333vw;
    border-bottom: solid 1px #052ced;
    font-size: clamp(12px, 4vw, 30px);
  }
  .footer-l_wrap .footer-img {
    height: 9.33333vw;
    text-align: center;
    padding-top: 2.66667vw;
  }
  .footer-l_wrap .footer-img small {
    color: #fafafa;
    font-size: clamp(12px, 3.2vw, 24px);
  }
}
