@charset "UTF-8";
@media (min-width: 1280px) {
  body:not(:has(#news)) .new_header {
    background-color: #fff !important;
  }
}
body:not(:has(#news)) .new_header h1 svg path,
body:not(:has(#news)) .new_header h1 svg polygon {
  fill: #002F7B !important;
}

.new_header {
  padding: 18px 5%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  z-index: 50;
}
@media (min-width: 1280px) {
  .new_header {
    width: 100%;
    padding: 40px 0;
    position: fixed;
    left: 0;
    top: 0;
    justify-content: center;
    transition: background-color 0.9s;
    padding: 30px 0;
  }
  .new_header ~ * {
    width: 1000px;
    margin: 0 auto;
  }
}
.new_header h1 {
  width: 125px;
}
@media (min-width: 768px) {
  .new_header h1 {
    width: 200px;
  }
}
.new_header .navBtn div {
  display: none;
  background-color: #fff;
  width: 100vw;
  margin-left: calc(50% - 50vw);
}
@media (min-width: 1280px) {
  .new_header .navBtn div {
    display: none;
    position: fixed;
    height: auto;
    left: 50%;
    transform: translateX(-50%);
    top: 98px;
  }
  .new_header .navBtn div ul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}
.new_header .navBtn div ul {
  padding-block: 20px;
  padding-left: calc(5% + 40px);
}
@media (min-width: 1280px) {
  .new_header .navBtn div ul {
    padding-left: 0;
    width: 100%;
  }
}
.new_header .navBtn div ul li a {
  display: block;
  padding: min(5%, 25px) 0;
  color: #002F7C;
}
@media (min-width: 1280px) {
  .new_header .navBtn div ul li:first-of-type ~ li {
    margin-left: 0;
  }
}
.new_header .navBtn span.active::before {
  transform: rotate(45deg);
}
.new_header nav {
  display: none;
  background: #29C2DB;
  width: 100%;
  height: 100vh;
  overflow-y: scroll;
  scrollbar-width: none;
  z-index: 9999;
  position: fixed;
  top: 0;
  left: 0;
}
@media (min-width: 1280px) {
  .new_header nav {
    background: none;
    display: block !important;
    width: 800px;
    height: auto;
    position: relative;
    overflow: visible;
  }
}
@media (min-width: 1280px) {
  .new_header nav ul {
    display: flex;
  }
}
.new_header nav > ul {
  width: 100%;
  box-sizing: border-box;
  margin-top: min(14vw, 100px);
  padding: 0 5%;
}
@media (min-width: 768px) {
  .new_header nav > ul {
    font-size: 1.25rem;
  }
}
@media (min-width: 1280px) {
  .new_header nav > ul {
    margin: 0;
    padding: 0;
    font-size: 1rem;
    align-items: center;
    justify-content: flex-end;
    gap: 30px;
  }
}
@media (min-width: 1280px) {
  .new_header nav > ul > li {
    border-bottom: none;
  }
  .new_header nav > ul > li :first-of-type ~ li {
    margin-left: 30px;
  }
}
.new_header nav > ul > li:last-of-type img {
  width: 10vw;
}
@media (min-width: 768px) {
  .new_header nav > ul > li:last-of-type img {
    width: 8vw;
  }
}
@media (min-width: 1280px) {
  .new_header nav > ul > li:last-of-type img {
    width: 30px;
  }
}
.new_header nav > ul > li > a,
.new_header nav > ul > li span {
  padding: min(5%, 25px) 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 25px;
}
@media (min-width: 1280px) {
  .new_header nav > ul > li > a,
  .new_header nav > ul > li span {
    height: 100%;
    padding: 0;
    font-weight: 700;
    flex-wrap: wrap;
    z-index: 9999;
    position: relative;
    gap: 0;
  }
}
.new_header nav > ul > li > a::before,
.new_header nav > ul > li span::before {
  content: "";
  display: block;
  width: 0.5rem;
  height: 0.5rem;
  margin-left: 10px;
  border-bottom: 1px solid #FFFFFF;
  border-right: 1px solid #FFFFFF;
  transition: transform 0.5s;
  transform: rotate(-45deg);
}
@media (min-width: 1280px) {
  .new_header nav > ul > li > a::before,
  .new_header nav > ul > li span::before {
    border: none;
    width: 100%;
    height: 3px;
    margin: 0;
    position: absolute;
    bottom: -28px;
    transform: rotate(0);
  }
}
@media (min-width: 1280px) {
  .new_header nav > ul > li > a {
    color: #002F7B;
  }
}
@media (min-width: 1280px) {
  .new_header nav > ul > li > span {
    cursor: pointer;
    color: #002F7B;
  }
}
.new_header nav > ul > li :last-of-type a:after {
  display: none;
  background-color: #fff;
  width: 100vw;
  margin-left: calc(50% - 50vw);
}

#new_header .navBtn > div ul a:hover {
  color: #29C2DB;
}

#new_header .navBtn > div ul a:hover:after {
  border-color: #333333;
}

#new_header.Fixed h1,
#new_header.Fixed nav {
  z-index: 9999;
  position: relative;
}

#new_header.Fixed nav > ul > li > a:after,
#new_header.Fixed nav > ul > li > span:after {
  bottom: -27px;
}

@media (min-width: 1280px) {
  #wrap::before {
    content: "";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: -1;
    background-color: rgba(242, 242, 242, 0.7);
    backdrop-filter: blur(7px) brightness(0.95) saturate(1.3);
    transition: opacity 0.3s;
  }
}

@media (min-width: 1280px) {
  #new_header:has(.navBtn div.active) {
    background-color: #DADF00;
    z-index: 50;
  }
}

@media (min-width: 1280px) {
  #wrap:has(.navBtn div.active)::before {
    opacity: 1;
    z-index: 10;
  }
}

@media (min-width: 1280px) {
  #new_header.Fixed {
    background-color: #DADF00 !important;
    z-index: 50;
  }
}

@media (min-width: 1280px) {
  #new_header.Fixed-w {
    background-color: #fff !important;
  }
}

.pagePattern02 header #new_header {
  background: rgba(51, 51, 51, 0.7);
}

#index header {
  height: min(166.66vw, max(48.95vw, 625px)) !important;
}
@media (min-width: 1024px) {
  #index header {
    height: min(166.66vw, max(48.95vw, 550px)) !important;
  }
}

#index header #bgSlider {
  height: min(166.66vw, max(48.95vw, 625px)) !important;
}
@media (min-width: 1024px) {
  #index header #bgSlider {
    height: min(166.66vw, max(48.95vw, 550px)) !important;
  }
}

@media (min-width: 1280px) {
  #index header #bgSlider {
    z-index: auto;
  }
}

#index header #logo .st0 {
  fill: #002F7B !important;
}

.fv_new {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media (min-width: 1024px) {
  .fv_new {
    bottom: max(-8.34vw, -160px);
  }
}
.fv_new .fv_box {
  width: min(83%, max(32.55vw, 312.5px));
  max-width: 100%;
  margin-inline: auto;
  pointer-events: none;
  height: 430px;
}
@media (min-width: 1024px) {
  .fv_new .fv_box {
    height: 44.92vw;
  }
}
.fv_new img {
  width: 550px;
  max-width: none;
  bottom: -50px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
@media (min-width: 1024px) {
  .fv_new img {
    width: min(53.71vw, 1053px);
  }
}
.fv_new::before {
  content: "";
  display: block;
  background: url(../img/index/header/loop_img01.png) repeat-x;
  background-size: min(356vw, max(140.62vw, 1335px));
  background-position: 25%;
  height: min(73.33vw, max(28.38vw, 275px));
  width: 100vw;
  position: absolute;
  top: -140px;
  margin-inline: calc(50% - 50vw);
  z-index: -2;
  --time: 120s;
  animation: loop01 var(--time) linear infinite;
}
@media (min-width: 1024px) {
  .fv_new::before {
    top: max(-8.34vw, -160px);
    animation: loop01 calc(var(--time) * 1.8) linear infinite;
  }
}
.fv_new::after {
  content: "";
  display: block;
  background: url(../img/index/header/loop_img02.png) repeat-x;
  background-size: min(356vw, max(140.62vw, 1335px));
  background-position: 75%;
  height: min(73.33vw, max(28.38vw, 275px));
  width: 100vw;
  position: absolute;
  top: 0;
  margin-inline: calc(50% - 50vw);
  z-index: -1;
  --time: 232s;
  animation: loop02 var(--time) linear infinite;
}
@media (min-width: 1024px) {
  .fv_new::after {
    top: min(6.25vw, 120px);
    animation: loop02 calc(var(--time) * 1.8) linear infinite;
  }
}

@keyframes loop01 {
  0% {
    background-position: 25% 0;
  }
  100% {
    background-position: calc(25% - min(356vw, max(140.62vw, 1335px))) 0;
  }
}
@keyframes loop02 {
  0% {
    background-position: 75% 0;
  }
  100% {
    background-position: calc(75% + min(356vw, max(140.62vw, 1335px))) 0;
  }
}
#news {
  background-color: #fff;
  width: min(100% - 40px, 464px);
  margin-inline: auto;
  border-radius: clamp(1rem, 1.25vw, 1.5rem);
  position: absolute;
  z-index: 5;
  left: 50%;
  bottom: 38px;
  transform: translateX(-50%);
  padding-inline: 26px;
  padding-block: 16px 18px;
}
@media (min-width: 1024px) {
  #news {
    padding-inline: 28px;
    padding-block: 20px 22px;
    left: auto;
    transform: none;
    right: 24px;
  }
}
@media (min-width: 1280px) {
  #news {
    bottom: 70px;
    right: 74px;
  }
}
#news::after {
  content: "";
  display: block;
  background: url(../img/index/header/fukidashi.png) no-repeat;
  background-size: 100%;
  width: 47.5px;
  height: 27.5px;
  position: absolute;
  bottom: -27px;
  right: 72px;
}
@media (min-width: 1024px) {
  #news::after {
    width: 52px;
    height: 30px;
    bottom: -29.5px;
    right: 75px;
  }
}
#news strong {
  font-size: 25px;
  font-weight: 900;
  color: #002F7B;
  line-height: 1;
}
@media (min-width: 1024px) {
  #news strong {
    font-size: 28px;
  }
}
#news dl {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 14px;
  padding-top: 12px;
}
@media (min-width: 1024px) {
  #news dl {
    padding-top: 16px;
  }
}
#news dl dt {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  font-size: 14px;
}
@media (min-width: 1024px) {
  #news dl dt {
    font-size: 16px;
    gap: 10px;
  }
}
#news dl dt::before {
  content: "●";
  color: #DADF00;
}
#news dl dt time {
  color: #002F7B;
}
#news dl dd a {
  color: #002F7B;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: 14px;
}
@media (min-width: 1024px) {
  #news dl dd a {
    font-size: 16px;
  }
}
@media (min-width: 1024px) {
  #news dl dd a:hover {
    opacity: 0.6;
    transition: opacity 0.3s;
  }
}

#contactBtn {
  background: transparent;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
  overflow: hidden;
  position: fixed;
  top: 290px;
  right: 0;
  z-index: 10;
}

#contactBtn a {
  width: min(5.2vw, 100px);
  height: min(15.88vw, 305px);
  transition: 0.5s;
}

#contactBtn a:hover {
  opacity: 0.8;
}

#cta_nav {
  margin-top: 5%;
  padding: 0 5%;
  display: flex;
  flex-direction: column;
  gap: 3vw;
}
@media (min-width: 1280px) {
  #cta_nav {
    display: none;
  }
}
#cta_nav a {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  padding-block: min(5%, 18px);
}
#cta_nav a span {
  color: #002F7B;
  font-weight: 500;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
#cta_nav a span::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#cta_nav a.mail {
  background-color: #DADF00;
}
#cta_nav a.mail span::before {
  background: url(../img/index/header/mail.png) no-repeat;
  background-size: 100%;
  width: 35px;
  height: 27px;
  left: -55px;
}
#cta_nav a.tel {
  background-color: #fff;
}
#cta_nav a.tel span::before {
  background: url(../img/index/header/tel.png) no-repeat;
  background-size: 100%;
  width: 27px;
  height: 42.5px;
  left: -51px;
}

#btm_contact {
  width: 100%;
  height: 60px;
  position: sticky;
  bottom: 0;
  left: 0;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  z-index: 800;
}
@media (min-width: 1280px) {
  #btm_contact {
    display: none;
  }
}
#btm_contact li {
  width: 50%;
}
#btm_contact li a {
  height: 60px;
  color: #002F7B;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  padding-inline: 25px;
}
#btm_contact li a::before {
  content: "";
  display: block;
}
#btm_contact li a p {
  font-weight: 500;
}
#btm_contact li a p:has(wbr) {
  word-break: keep-all;
}
#btm_contact li.mail {
  background-color: #DADF00;
}
#btm_contact li.mail a::before {
  background: url(../img/index/header/mail.png) no-repeat;
  background-size: 100%;
  width: 35px;
  height: 27px;
  min-width: 35px;
  min-height: 27px;
}
#btm_contact li.tel {
  background-color: #29C2DB;
}
#btm_contact li.tel a::before {
  background: url(../img/index/header/tel.png) no-repeat;
  background-size: 100%;
  width: 26.5px;
  height: 41.5px;
  min-width: 26.5px;
  min-height: 41.5px;
}