@charset "UTF-8";
html {
  position: relative;
}
html::before {
  content: "";
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.87);
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  opacity: 0;
  transition: 0.3s;
  z-index: 1039;
}
html:has(.header.open) {
  overflow: hidden;
}
html:has(.header.open)::before {
  opacity: 1;
}

html, body {
  min-width: 0;
}
html:has(.header) main, body:has(.header) main {
  padding-top: 60px;
}

/*------------------------------------------------------
    header
-------------------------------------------------------*/
.header {
  width: 100%;
  height: 60px;
  background: rgba(48, 48, 48, 0.5);
  -webkit-backdrop-filter: blur(7px);
          backdrop-filter: blur(7px);
  font-size: 1rem;
  font-family: "Noto Sans JP", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1040;
}
.header__inner {
  width: calc(100% - 40px);
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  grid-gap: 10px;
  position: relative;
}
@media screen and (min-width: 1024px) {
  .header__inner {
    width: 100%;
    max-width: 100%;
    padding: 0 0 0 20px;
  }
}
@media screen and (min-width: 1280px) {
  .header__inner {
    padding-left: 40px;
  }
}
.header__sitelogo {
  width: 155px;
  flex-shrink: 0;
}
.header__sitelogo a {
  display: flex;
  align-items: center;
}
.header__sitelogo img {
  width: 100%;
  display: block;
}
@media screen and (min-width: 1200px) {
  .header__sitelogo {
    width: 170px;
  }
}
.header__navWrap {
  width: 100%;
}
@media screen and (max-width: 1023px) {
  .header__navWrap {
    height: calc(100vh - 60px);
    position: fixed;
    top: 60px;
    left: 0;
    overflow-y: scroll;
    opacity: 0;
    pointer-events: none;
    transition: 0.3s;
  }
  .header__navWrap.visible {
    opacity: 1;
    pointer-events: auto;
  }
}
@media screen and (min-width: 1024px) {
  .header__navWrap {
    height: 100%;
  }
}
.header__gnav li {
  font-weight: 700;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.header__gnav li.line a, .header__gnav li.contact a {
  color: #fff;
}
.header__gnav li.line:hover, .header__gnav li.contact:hover {
  background-color: #fff;
}
.header__gnav li.line:hover a, .header__gnav li.contact:hover a {
  opacity: 1;
}
.header__gnav li.line {
  background-color: #06C755;
  border: 2px solid #06C755;
}
.header__gnav li.line:hover a {
  color: #06C755;
}
.header__gnav li.contact {
  background-color: #0E3741;
  border: 2px solid #0E3741;
}
.header__gnav li.contact:hover a {
  color: #0E3741;
}
@media screen and (max-width: 1023px) {
  .header__gnav {
    width: 200px;
    padding: 50px 0 0;
    margin: 0 auto;
    display: grid;
    grid-gap: 20px;
  }
  .header__gnav li {
    padding: 10px 20px;
    font-size: 14px;
    line-height: 1.2143;
  }
  .header__gnav li.line, .header__gnav li.contact {
    width: 200px;
    height: 50px;
  }
  .header__gnav li.line {
    margin-top: 10px;
  }
}
@media screen and (min-width: 1024px) {
  .header__gnav {
    height: 100%;
    display: flex;
    justify-content: flex-end;
  }
  .header__gnav li {
    width: auto;
    padding: 0 15px;
    font-size: 13px;
  }
  .header__gnav li.line, .header__gnav li.contact {
    width: 140px;
    padding: 0;
    border: 0;
    font-size: 12px;
  }
  .header__gnav a {
    color: #fff;
  }
}
@media screen and (min-width: 1200px) {
  .header__gnav li {
    width: 100px;
    padding: 0;
    font-size: 14px;
  }
  .header__gnav li.line, .header__gnav li.contact {
    width: 160px;
  }
}
@media screen and (min-width: 1440px) {
  .header__gnav li {
    width: 120px;
  }
  .header__gnav li.line, .header__gnav li.contact {
    width: 200px;
    font-size: 14px;
  }
}
.header__spToggler {
  width: 60px;
  height: 60px;
  padding: 0;
  margin: 0 -20px 0 0;
  background: #0E3741;
  border: 0;
  line-height: 1;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  grid-gap: 6.5px;
  flex-shrink: 0;
  position: relative;
}
.header__spToggler:focus {
  outline: 0;
  box-shadow: none;
}
.header__spToggler span {
  width: 27px;
  height: 1px;
  margin: 0 auto;
  background: #fff;
  border-radius: 1px;
  display: block;
  transition: 0.3s;
}
.header__spToggler.open span {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  transform: rotate(45deg);
}
.header__spToggler.open span + span {
  transform: rotate(-45deg);
}
.header__spToggler.open span + span + span {
  transform: scale(0);
}
@media screen and (min-width: 1024px) {
  .header__spToggler {
    display: none !important;
  }
}

/*------------------------------------------------------
  main
-------------------------------------------------------*/
.breadcrumbArea {
  width: 100%;
  padding: 10px 0;
  font-size: 12px;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .breadcrumbArea {
    padding: 15px 0;
  }
}
.breadcrumbArea__inner {
  display: flex;
  align-items: center;
  grid-gap: 0 12px;
}
.breadcrumbArea__inner > span {
  flex-shrink: 0;
}
.breadcrumbArea__inner > span:last-child {
  flex-shrink: inherit;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.breadcrumbArea__inner > span.sep {
  width: 10px;
  height: 10px;
  background: url('data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10" fill="none"><path d="M3.50078 0.5L2.80078 1.25L6.50078 5L2.80078 8.75L3.50078 9.5L8.00078 5L3.50078 0.5Z" fill="%231C1C1C"/></svg>') center/contain no-repeat;
  color: transparent;
  display: block;
  flex-shrink: 0;
}

.ctaBlk {
  width: 100%;
  padding-bottom: 60px;
}
@media screen and (min-width: 768px) {
  .ctaBlk {
    padding-bottom: 120px;
  }
}
.ctaBlk__inner {
  width: calc(100% - 20px);
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
@media screen and (min-width: 768px) {
  .ctaBlk__inner {
    width: calc(100% - 40px);
    max-width: 1200px;
  }
}
.ctaBlk__ttl {
  width: 100%;
  padding: 40px 20px;
  background: #0C2C41 url(../img/common/cta_bg.jpg) right 86% center/110% no-repeat;
  border-radius: 10px;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.5;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
.ctaBlk__ttl::after {
  content: "";
  width: 100%;
  height: 100%;
  background-color: #1D839D;
  mix-blend-mode: multiply;
  display: block;
  opacity: 0.7;
  position: absolute;
  top: 0;
  left: 0;
}
@media screen and (min-width: 768px) {
  .ctaBlk__ttl {
    padding: 96px 20px;
    background-size: 80%;
    background-position: right 22% top 20%;
    font-size: 28px;
  }
}
.ctaBlk__ttl_link {
  width: 100%;
  padding-bottom: 10px;
  color: #fff;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  position: relative;
  z-index: 1;
}
.ctaBlk__ttl_link::before {
  content: "";
  width: 100%;
  height: 1px;
  background-color: #fff;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
}
.ctaBlk__ttl_link::after {
  content: "→";
  width: 32px;
  height: 32px;
  background: #fff url('data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" width="27" height="27" viewBox="0 0 27 27" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M17.1716 9.46456L20.3536 12.6465C20.5488 12.8418 20.5488 13.1584 20.3536 13.3536L17.1716 16.5356C16.9763 16.7309 16.6597 16.7309 16.4645 16.5356C16.2692 16.3404 16.2692 16.0238 16.4645 15.8285L18.7929 13.5001H7V12.5001H18.7929L16.4645 10.1717C16.2692 9.97641 16.2692 9.65982 16.4645 9.46456C16.6597 9.2693 16.9763 9.2693 17.1716 9.46456Z" fill="%231D839D"/></svg>') center/contain no-repeat;
  border-radius: 50%;
  color: transparent;
  display: block;
  transition: background-color 0.3s ease;
}
.ctaBlk__ttl_link:hover {
  opacity: 1;
}
.ctaBlk__ttl_link:hover::before {
  animation: cta_line 0.3s linear;
}
@keyframes cta_line {
  0% {
    width: 0;
    opacity: 0;
  }
  100% {
    width: 100%;
    opacity: 1;
  }
}
.ctaBlk__ttl_link:hover::after {
  background: #16B8C8 url('data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" width="27" height="27" viewBox="0 0 27 27" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M17.1716 9.46456L20.3536 12.6465C20.5488 12.8418 20.5488 13.1584 20.3536 13.3536L17.1716 16.5356C16.9763 16.7309 16.6597 16.7309 16.4645 16.5356C16.2692 16.3404 16.2692 16.0238 16.4645 15.8285L18.7929 13.5001H7V12.5001H18.7929L16.4645 10.1717C16.2692 9.97641 16.2692 9.65982 16.4645 9.46456C16.6597 9.2693 16.9763 9.2693 17.1716 9.46456Z" fill="%23fff"/></svg>') center/contain no-repeat;
}
@media screen and (min-width: 576px) {
  .ctaBlk__ttl_link {
    width: auto;
    grid-gap: 83px;
  }
}
@media screen and (min-width: 768px) {
  .ctaBlk__ttl_link {
    padding-bottom: 16px;
    grid-gap: 74px;
  }
}

/*------------------------------------------------------
    footer
-------------------------------------------------------*/
.footer {
  width: 100%;
  padding: 40px 0 30px;
  background-color: #0E3741;
  color: #fff;
  font-size: 1rem;
  font-family: "Noto Sans JP", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
@media screen and (min-width: 768px) {
  .footer {
    padding: 77px 0 29px;
  }
}
.footer__inner {
  width: calc(100% - 40px);
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
@media screen and (min-width: 768px) {
  .footer__inner {
    max-width: 1200px;
  }
}
.footer__bnrBlk {
  width: 100%;
}
.footer__bnrBlk_list {
  width: 100%;
  padding-bottom: 40px;
  border-bottom: 1px solid #3E5F67;
  display: grid;
  grid-gap: 30px;
}
@media screen and (min-width: 768px) {
  .footer__bnrBlk_list {
    max-width: 100%;
    padding-bottom: 60px;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 20px;
  }
}
@media screen and (min-width: 1024px) {
  .footer__bnrBlk_list {
    grid-gap: 30px;
  }
}
.footer__bnrBlk_list .listItem {
  width: 100%;
  max-width: 400px;
  margin: 0 auto;
  display: block;
}
.footer__bnrBlk_list .listItem:hover {
  opacity: 1;
}
.footer__bnrBlk_list .listItem:hover .listItem__img img {
  transform: scale(1.1);
}
.footer__bnrBlk_list .listItem__img {
  width: 100%;
  padding-top: 60.597%;
  position: relative;
  overflow: hidden;
}
.footer__bnrBlk_list .listItem__img img {
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  -o-object-fit: cover;
     object-fit: cover;
  transition: 0.3s;
}
@media screen and (min-width: 768px) {
  .footer__bnrBlk_list .listItem__img {
    padding-top: 60.5263%;
  }
}
@media screen and (min-width: 768px) {
  .footer__bnrBlk_list .listItem {
    max-width: 100%;
    margin: 0;
  }
}
.footer__mainBlk {
  width: 100%;
  margin: 40px 0 60px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  grid-gap: 50px;
}
@media screen and (min-width: 768px) {
  .footer__mainBlk {
    margin: 60px 0 108px;
    flex-direction: row;
    justify-content: space-between;
  }
}
.footer__mainBlk_logosWrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  grid-gap: 20px;
}
@media screen and (min-width: 768px) {
  .footer__mainBlk_logosWrap {
    grid-gap: 32px;
    flex-shrink: 0;
  }
}
.footer__mainBlk_logosWrap_logo {
  width: 154px;
}
@media screen and (min-width: 768px) {
  .footer__mainBlk_logosWrap_logo {
    width: 170px;
  }
}
.footer__mainBlk_logosWrap_snsList {
  display: flex;
  align-items: center;
  grid-gap: 24px;
}
.footer__mainBlk_logosWrap_snsList img {
  width: 31px;
}
.footer__mainBlk_logosWrap_snsList img.youtube {
  width: 36px;
}
@media screen and (min-width: 1024px) {
  .footer__mainBlk_logosWrap_snsList img {
    width: 38px;
  }
  .footer__mainBlk_logosWrap_snsList img.youtube {
    width: 38px;
  }
}
.footer__mainBlk_navWrap {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  grid-gap: 40px;
}
@media screen and (min-width: 768px) {
  .footer__mainBlk_navWrap {
    width: auto;
    flex-direction: row;
    grid-gap: 30px;
  }
}
@media screen and (min-width: 1024px) {
  .footer__mainBlk_navWrap {
    grid-gap: 60px;
  }
}
@media screen and (min-width: 1200px) {
  .footer__mainBlk_navWrap {
    padding-right: 70px;
    grid-gap: 100px;
  }
}
.footer__mainBlk_navWrap_nav {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  grid-gap: 28px;
}
@media screen and (min-width: 768px) {
  .footer__mainBlk_navWrap_nav {
    width: 220px;
    grid-gap: 20px;
  }
}
@media screen and (min-width: 1024px) {
  .footer__mainBlk_navWrap_nav {
    width: 311px;
  }
}
.footer__mainBlk_navWrap_navTtl {
  width: 100%;
  padding-bottom: 5px;
  border-bottom: 1px solid #fff;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.2;
}
.footer__mainBlk_navWrap_navListWrap {
  display: contents;
}
.footer__mainBlk_navWrap_navList {
  width: 100%;
  line-height: 1.1875;
  display: grid;
  grid-gap: 20px;
}
.footer__mainBlk_navWrap_navList a {
  color: #fff;
}
.footer__mainBlk_navWrap_navList a.disabled {
  opacity: 0.6;
}
@media screen and (min-width: 768px) {
  .footer__mainBlk_navWrap_navList {
    grid-gap: 16px;
  }
}
.footer__copyright {
  font-size: 12px;
  font-weight: 700;
  line-height: 1.9;
  text-align: center;
}