@charset "UTF-8";
/* 日本語 */
#main_rn {
  padding-bottom: 0;
}
@media screen and (min-width: 768px) {
  #main_rn {
    padding-top: calc(var(--headerHeight) * 1px);
  }
}
@media screen and (max-width: 767px) {
  #main_rn {
    padding-top: 0;
  }
}

.topicPathWrap {
  position: relative;
  z-index: 1000;
  background-color: #fff;
}
@media screen and (min-width: 768px) {
  .topicPathWrap {
    position: absolute;
    inset: calc(var(--headerHeight) * 1px) 0 auto;
  }
}

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

img {
  display: inline-block;
}

@media screen and (min-width: 768px) {
  #footer {
    position: relative;
    z-index: 1;
  }
}

.hakata-wrapper {
  font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', 'Meiryo', sans-serif;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.75;
  color: #fff;
  position: relative;
}
@media screen and (min-width: 768px) {
  .hakata-wrapper {
    padding-top: 4.5rem;
  }
}

.hakata-content {
  position: relative;
  z-index: 1;
}
@media screen and (min-width: 768px) {
  .hakata-content {
    max-width: 39rem;
    margin-inline: auto;
    box-shadow: 0 0.4rem 0.4rem 0 rgba(0, 0, 0, 0.25);
  }
}

.l-section {
  position: relative;
  padding-block: 8rem;
}

.section-decoration img,
.section-banner img {
  display: block;
  width: 100%;
}

.l-inner {
  position: relative;
  z-index: 1;
  padding-inline: 2rem;
}

.c-text-lead {
  position: relative;
  padding-inline: 5rem;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
.c-text-lead::before,
.c-text-lead::after {
  content: '';
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  width: 4rem;
  height: 1rem;
  -webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iMTAiIHZpZXdCb3g9IjAgMCA0MCAxMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gPHBhdGggZD0iTTkuNjAzNiA0LjgwMThDNS43ODUzIDUuMzQzOTEgNS4zNDM5MSA1Ljc4NTMgNC44MDE4IDkuNjAzNkM0LjI1OTY5IDUuNzg1MyAzLjgxODI5IDUuMzQzOTEgMCA0LjgwMThDMy44MTgyOSA0LjI1OTY5IDQuMjU5NjkgMy44MTgyOSA0LjgwMTggMEM1LjM0MzkxIDMuODE4MjkgNS43ODUzIDQuMjU5NjkgOS42MDM2IDQuODAxOFoiIGZpbGw9IiNGN0VDRjciLz4gPHJlY3QgeD0iMTYuNjMyOCIgeT0iNC40NDA2MSIgd2lkdGg9IjIzLjAzNTkiIGhlaWdodD0iMC43OTQzNDIiIGZpbGw9IndoaXRlIiBmaWxsLW9wYWNpdHk9IjAuNSIvPiA8L3N2Zz4=) no-repeat center/contain;
  mask: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iMTAiIHZpZXdCb3g9IjAgMCA0MCAxMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gPHBhdGggZD0iTTkuNjAzNiA0LjgwMThDNS43ODUzIDUuMzQzOTEgNS4zNDM5MSA1Ljc4NTMgNC44MDE4IDkuNjAzNkM0LjI1OTY5IDUuNzg1MyAzLjgxODI5IDUuMzQzOTEgMCA0LjgwMThDMy44MTgyOSA0LjI1OTY5IDQuMjU5NjkgMy44MTgyOSA0LjgwMTggMEM1LjM0MzkxIDMuODE4MjkgNS43ODUzIDQuMjU5NjkgOS42MDM2IDQuODAxOFoiIGZpbGw9IiNGN0VDRjciLz4gPHJlY3QgeD0iMTYuNjMyOCIgeT0iNC40NDA2MSIgd2lkdGg9IjIzLjAzNTkiIGhlaWdodD0iMC43OTQzNDIiIGZpbGw9IndoaXRlIiBmaWxsLW9wYWNpdHk9IjAuNSIvPiA8L3N2Zz4=) no-repeat center/contain;
  background: currentColor;
}
.c-text-lead::before {
  left: 0;
}
.c-text-lead::after {
  right: 0;
  rotate: 180deg;
}

.c-title-section {
  margin-bottom: 4rem;
  text-align: center;
}
.c-title-section > span {
  position: relative;
  display: block;
  margin-inline: auto;
}
.c-title-section .en {
  width: 27rem;
  padding-block: 0.8rem;
  font-family:
    'Montserrat',
    'Noto Sans JP',
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    'Segoe UI',
    sans-serif;
  font-size: 4.8rem;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  white-space: nowrap;
  border-block: 1px solid;
}
.c-title-section .jp {
  margin-top: 0.4rem;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 1.6rem;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.22;
}
.c-title-section .jp::before,
.c-title-section .jp::after {
  content: '';
  position: absolute;
  inset: 50% auto auto 0;
  translate: 0 calc(-50% + 0.1rem);
  width: 1.2rem;
  height: 1.2rem;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDEzIDEzIiBmaWxsPSJub25lIj4gICA8ZyBjbGlwLXBhdGg9InVybCgjY2xpcDBfMjAzXzE2NTE2KSI+ICAgICA8cGF0aCBkPSJNMTIuMDkgNi4wNDVDNy4yODMxNCA2LjcyNzQ2IDYuNzI3NDYgNy4yODMxNCA2LjA0NSAxMi4wOUM1LjM2MjU0IDcuMjgzMTQgNC44MDY4NiA2LjcyNzQ2IDAgNi4wNDVDNC44MDY4NiA1LjM2MjU0IDUuMzYyNTQgNC44MDY4NiA2LjA0NSAwQzYuNzI3NDYgNC44MDY4NiA3LjI4MzE0IDUuMzYyNTQgMTIuMDkgNi4wNDVaIiBmaWxsPSJ3aGl0ZSIgZmlsbC1vcGFjaXR5PSIwLjYiLz4gICA8L2c+ICAgPGRlZnM+ICAgICA8Y2xpcFBhdGggaWQ9ImNsaXAwXzIwM18xNjUxNiI+ICAgICAgIDxyZWN0IHdpZHRoPSIxMi4wOSIgaGVpZ2h0PSIxMi4wOSIgZmlsbD0id2hpdGUiLz4gICAgIDwvY2xpcFBhdGg+ICAgPC9kZWZzPiA8L3N2Zz4=) no-repeat center/contain;
}
.c-title-section .jp::after {
  inset-inline: auto 0;
}

.c-video button {
  position: relative;
  display: block;
  width: 100%;
}
.c-video button::before,
.c-video button::after {
  content: '';
  display: inline-block;
  position: absolute;
  z-index: 1;
  inset: 50% auto auto 50%;
  translate: -50% -50%;
}
.c-video button::before {
  width: 4.8rem;
  height: 4.8rem;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(0.3rem);
  -webkit-backdrop-filter: blur(0.3rem);
}
.c-video button::after {
  width: 1.4rem;
  height: 1.4rem;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNSIgaGVpZ2h0PSIxNSIgdmlld0JveD0iMCAwIDE1IDE1IiBmaWxsPSJub25lIj4gICA8cGF0aCBkPSJNMS41NTQ4MSAwLjEyNjg3TDEzLjgwMyA2LjQwNDI4QzE0LjQ2NTcgNi43NDM3NSAxNC40NjU3IDcuNTU2MjUgMTMuODAzIDcuODk1NzJMMS41NTQ4MSAxNC4xNzMyQzAuODcyNTMxIDE0LjUyMzcgMCAxNC4xMDY0IDAgMTMuNDI3NFYwLjg3MjU5MUMwIDAuMTkzNjUxIDAuODcyNTMxIC0wLjIyMzczIDEuNTU0ODEgMC4xMjY4N1oiIGZpbGw9IndoaXRlIi8+IDwvc3ZnPg==) no-repeat center/contain;
  translate: calc(-50% + 0.2rem) -50%;
}
.c-video button img {
  width: 100%;
  height: auto;
  display: block;
}
.c-video__content {
  display: none;
}

.modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.8rem;
  background-color: rgba(0, 0, 0, 0.8);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 0.2s ease,
    visibility 0.2s ease;
}
.modal-overlay.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.modal-overlay.is-open .modal-content {
  opacity: 1;
}

.modal-content {
  width: min(100%, 80rem);
  aspect-ratio: 16/9;
  background-color: #000;
  border-radius: 0.4rem;
  overflow: hidden;
  opacity: 0;
  transition: opacity 0.2s ease;
}
.modal-content video,
.modal-content iframe {
  display: block;
  width: 100%;
  height: 100%;
}

.js-fadein {
  opacity: 0;
  translate: 0 2rem;
  transition:
    opacity 0.4s ease,
    translate 0.4s ease;
}
.js-fadein.is-inview {
  opacity: 1;
  translate: 0 0;
}

.js-jumpin {
  opacity: 0;
  translate: 0 2rem;
  scale: 0.8;
  transition:
    opacity 0.45s ease-out,
    translate 0.45s cubic-bezier(0.34, 1.6, 0.64, 1),
    scale 0.45s cubic-bezier(0.34, 1.6, 0.64, 1);
  will-change: opacity, translate, scale;
}
.js-jumpin.is-inview {
  opacity: 1;
  translate: 0 0;
  scale: 1;
}

.hakata-wrapper .pcbg {
  display: none;
}
@media screen and (min-width: 768px) {
  .hakata-wrapper .pcbg {
    display: block;
    position: fixed;
    inset: 0;
    width: 100%;
    min-width: 1180px;
    height: 100vh;
    background: linear-gradient(170deg, #ceb4d6 10%, #f8d1e2 36%, #8ecad1 100%);
    overflow: hidden;
  }
}
@media screen and (min-width: 768px) and (any-hover: none) {
  .hakata-wrapper .pcbg {
    height: var(--windwo-inner-height);
    min-height: calc(100lvh + var(--headerHeight) * 1px);
  }
}
@media screen and (min-width: 768px) {
  .hakata-wrapper .pcbg-left,
  .hakata-wrapper .pcbg-right {
    width: calc((100% - 39rem) / 2);
    height: 100%;
    position: absolute;
    inset: 0 auto 0 0;
    display: grid;
    place-items: center;
  }
  .hakata-wrapper .pcbg-left::before,
  .hakata-wrapper .pcbg-right::before {
    content: '';
    display: inline-block;
    position: absolute;
    inset: -4%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    will-change: transform;
    transform-origin: 50% 50%;
    animation: float 3.2s ease-in-out infinite alternate;
  }
  @keyframes float {
    0% {
      transform: translate(0, 0) scale(1.04) rotate(0deg);
    }
    100% {
      transform: translate(0.4rem, 2.4rem) scale(1.07) rotate(0.25deg);
    }
  }
  .hakata-wrapper .pcbg-left::after,
  .hakata-wrapper .pcbg-right::after {
    content: '';
    display: inline-block;
    position: absolute;
    inset: 0 1.2rem 0 auto;
    background: #fff;
    width: 1px;
    height: 100%;
  }
}
@media screen and (min-width: 768px) and (prefers-reduced-motion: reduce) {
  .hakata-wrapper .pcbg-left::before,
  .hakata-wrapper .pcbg-right::before {
    animation: none;
  }
}
@media screen and (min-width: 768px) {
  .hakata-wrapper .pcbg-left {
    padding-left: 2rem;
  }
  .hakata-wrapper .pcbg-left::before {
    background-image: url(/navi/hakata-bijinkakeikaku/assets/images/pcbg-decoration-left.png);
    background-position: left center;
  }
}
@media screen and (min-width: 768px) {
  .hakata-wrapper .pcbg-right {
    left: auto;
    right: 0;
  }
  .hakata-wrapper .pcbg-right::before {
    background-image: url(/navi/hakata-bijinkakeikaku/assets/images/pcbg-decoration-right.png);
    animation-delay: -1.8s;
  }
  .hakata-wrapper .pcbg-right::after {
    inset: 0 auto 0 1.2rem;
  }
}
@media screen and (min-width: 768px) {
  .hakata-wrapper .pcbg-inner {
    position: relative;
    z-index: 1;
  }
}
@media screen and (min-width: 768px) {
  .hakata-wrapper .pcbg-menu {
    width: clamp(20.44rem, 32.4444444444vh, 29.2rem);
    margin-inline: auto clamp(8.12rem, 12.8888888889vh, 11.6rem);
    padding-bottom: clamp(5.6rem, 8.8888888889vh, 8rem);
  }
}
@media screen and (min-width: 768px) {
  .hakata-wrapper .pcbg-logo img {
    width: 100%;
  }
}
@media screen and (min-width: 768px) {
  .hakata-wrapper .pcbg-anchor > * + * {
    margin-top: clamp(0.7rem, 1.1111111111vh, 1rem);
  }
  .hakata-wrapper .pcbg-anchor__link {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: clamp(3.36rem, 5.3333333333vh, 4.8rem);
    padding-inline: clamp(0.56rem, 0.8888888889vh, 0.8rem);
    border-radius: clamp(0.28rem, 0.4444444444vh, 0.4rem);
    font-size: clamp(1.12rem, 1.7777777778vh, 1.6rem);
    text-shadow: 0 0 clamp(0.28rem, 0.4444444444vh, 0.4rem) rgba(0, 0, 0, 0.1);
    transition: opacity 0.2s ease;
  }
}
@media screen and (min-width: 768px) and (any-hover: hover) {
  .hakata-wrapper .pcbg-anchor__link:hover {
    opacity: 0.8;
  }
}
@media screen and (min-width: 768px) {
  .hakata-wrapper .pcbg-anchor__link::before {
    position: absolute;
    inset: 50% clamp(1.05rem, 1.6666666667vh, 1.5rem) auto auto;
    translate: 0 -50%;
    content: '';
    width: clamp(0.42rem, 0.6666666667vh, 0.6rem);
    height: clamp(0.42rem, 0.6666666667vh, 0.6rem);
    -webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2IiBoZWlnaHQ9IjYiIHZpZXdCb3g9IjAgMCA2IDYiIGZpbGw9Im5vbmUiPiAgIDxwYXRoIGQ9Ik0wLjYwOTgzNyAwLjA0OTc2MTdMNS40MTM5MSAyLjUxMTkzQzUuNjczODIgMi42NDUwOCA1LjY3MzgyIDIuOTYzNzYgNS40MTM5MSAzLjA5NjkxTDAuNjA5ODM3IDUuNTU5MUMwLjM0MjIzIDUuNjk2NiAwIDUuNTMyOTEgMCA1LjI2NjU3VjAuMzQyMjUzQzAgMC4wNzU5NTUgMC4zNDIyMyAtMC4wODc3NTI4IDAuNjA5ODM3IDAuMDQ5NzYxN1oiIGZpbGw9InVybCgjcGFpbnQwX2xpbmVhcl8yMDNfOTM2MCkiIGZpbGwtb3BhY2l0eT0iMC44Ii8+ICAgPGRlZnM+ICAgICA8bGluZWFyR3JhZGllbnQgaWQ9InBhaW50MF9saW5lYXJfMjAzXzkzNjAiIHgxPSIwIiB5MT0iMi44MDQ0MyIgeDI9IjUuNjA4ODQiIHkyPSIyLjgwNDQzIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+ICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiM3M0FDRTUiLz4gICAgICAgPHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjNzNBQ0U1IiBzdG9wLW9wYWNpdHk9IjAuOCIvPiAgICAgPC9saW5lYXJHcmFkaWVudD4gICA8L2RlZnM+IDwvc3ZnPg==) no-repeat center/contain;
    mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2IiBoZWlnaHQ9IjYiIHZpZXdCb3g9IjAgMCA2IDYiIGZpbGw9Im5vbmUiPiAgIDxwYXRoIGQ9Ik0wLjYwOTgzNyAwLjA0OTc2MTdMNS40MTM5MSAyLjUxMTkzQzUuNjczODIgMi42NDUwOCA1LjY3MzgyIDIuOTYzNzYgNS40MTM5MSAzLjA5NjkxTDAuNjA5ODM3IDUuNTU5MUMwLjM0MjIzIDUuNjk2NiAwIDUuNTMyOTEgMCA1LjI2NjU3VjAuMzQyMjUzQzAgMC4wNzU5NTUgMC4zNDIyMyAtMC4wODc3NTI4IDAuNjA5ODM3IDAuMDQ5NzYxN1oiIGZpbGw9InVybCgjcGFpbnQwX2xpbmVhcl8yMDNfOTM2MCkiIGZpbGwtb3BhY2l0eT0iMC44Ii8+ICAgPGRlZnM+ICAgICA8bGluZWFyR3JhZGllbnQgaWQ9InBhaW50MF9saW5lYXJfMjAzXzkzNjAiIHgxPSIwIiB5MT0iMi44MDQ0MyIgeDI9IjUuNjA4ODQiIHkyPSIyLjgwNDQzIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+ICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiM3M0FDRTUiLz4gICAgICAgPHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjNzNBQ0U1IiBzdG9wLW9wYWNpdHk9IjAuOCIvPiAgICAgPC9saW5lYXJHcmFkaWVudD4gICA8L2RlZnM+IDwvc3ZnPg==) no-repeat center/contain;
  }
  .hakata-wrapper .pcbg-anchor__link::after {
    content: '';
    width: clamp(1.54rem, 2.4444444444vh, 2.2rem);
    height: clamp(1.54rem, 2.4444444444vh, 2.2rem);
    background-color: #fff;
    border-radius: 50%;
  }
  .hakata-wrapper .pcbg-anchor__link.-blue {
    background: linear-gradient(90deg, rgba(87, 145, 203, 0.8) 0%, rgba(115, 172, 229, 0.8) 100%);
  }
  .hakata-wrapper .pcbg-anchor__link.-blue::before {
    background-color: rgba(115, 172, 229, 0.8);
  }
  .hakata-wrapper .pcbg-anchor__link.-cyan {
    background: linear-gradient(90deg, rgba(67, 172, 183, 0.8) 0%, rgba(97, 186, 196, 0.8) 100%);
  }
  .hakata-wrapper .pcbg-anchor__link.-cyan::before {
    background-color: rgba(97, 186, 196, 0.8);
  }
  .hakata-wrapper .pcbg-anchor__link.-purple {
    background: linear-gradient(90deg, rgba(179, 119, 198, 0.9) 0%, rgba(188, 140, 203, 0.9) 100%);
  }
  .hakata-wrapper .pcbg-anchor__link.-purple::before {
    background-color: rgba(188, 140, 203, 0.9);
  }
  .hakata-wrapper .pcbg-anchor__link.-pink {
    background: linear-gradient(90deg, #df9ab7 0%, #e8adc6 100%);
  }
  .hakata-wrapper .pcbg-anchor__link.-pink::before {
    background-color: #e8adc6;
  }
}
@media screen and (min-width: 768px) {
  .hakata-wrapper .pcbg-banner {
    width: clamp(17.64rem, 28vh, 25.2rem);
    margin-inline: clamp(6.44rem, 10.2222222222vh, 9.2rem) auto;
    padding-bottom: clamp(2.8rem, 4.4444444444vh, 4rem);
  }
  .hakata-wrapper .pcbg-banner > * + * {
    margin-top: clamp(0.7rem, 1.1111111111vh, 1rem);
  }
  .hakata-wrapper .pcbg-banner a {
    display: grid;
    width: 100%;
    padding: clamp(0.56rem, 0.8888888889vh, 0.8rem);
    border-radius: clamp(0.56rem, 0.8888888889vh, 0.8rem);
    background: rgba(255, 255, 255, 0.3);
  }
  .hakata-wrapper .pcbg-banner a img {
    transition: opacity 0.2s ease;
    border-radius: 0.4rem;
  }
}
@media screen and (min-width: 768px) and (any-hover: hover) {
  .hakata-wrapper .pcbg-banner a:hover img {
    opacity: 0.8;
  }
}

.hakata-content .fv {
  padding-block: 1.8rem 1.2rem;
  min-height: 58.2rem;
  background: linear-gradient(-140deg, #ceb4d6 13.07%, #f8d1e2 25.86%, #8ecad1 77.68%);
}
.hakata-content .fv-title {
  margin-bottom: 1.6rem;
  text-align: center;
}
.hakata-content .fv-title img {
  width: 18.8rem;
}
.hakata-content .fv-media__thumbnail {
  clip-path: inset(0 0 1px 0);
}
.hakata-content .fv-media__copy {
  position: absolute;
  inset: auto 0.8rem 1.2rem auto;
  width: 19rem;
}
.hakata-content .fv-info {
  position: relative;
  max-width: 25.4rem;
  min-height: 14.2rem;
  margin-inline: auto;
}
.hakata-content .fv-info::before {
  content: '';
  display: inline-block;
  position: absolute;
  inset: 0 auto auto 50%;
  width: 100%;
  aspect-ratio: 250/28;
  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjUyIiBoZWlnaHQ9IjI5IiB2aWV3Qm94PSIwIDAgMjUyIDI5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPiA8cGF0aCBkPSJNODAuNzY4NiAyNS44NTgzTDY2LjQwNjIgMjQuNjAyIiBzdHJva2U9IndoaXRlIiBzdHJva2Utb3BhY2l0eT0iMC41IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4gPHBhdGggZD0iTTE4NS41MjYgMTkuOTU5OEwxNzEuMzI4IDIyLjQ2MjgiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS1vcGFjaXR5PSIwLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPiA8cGF0aCBkPSJNMC41IDUuNzY2M0MxOS4wNDQ4IDE0LjU2MjggMzguNzk4NyAyMC41NDE5IDU5LjEwODkgMjMuNTA2MSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLW9wYWNpdHk9IjAuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtZGFzaGFycmF5PSI2LjkyIDYuOTIiLz4gPHBhdGggZD0iTTg5LjAxOTUgMjYuMjYxQzExMy44MTMgMjkuNDc1MiAxMzguOTU0IDI4Ljg1NDYgMTYzLjU1OCAyNC40MjA3IiBzdHJva2U9IndoaXRlIiBzdHJva2Utb3BhY2l0eT0iMC41IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1kYXNoYXJyYXk9IjYuOTIgNi45MiIvPiA8cGF0aCBkPSJNMTkzLjAwNCAxNy45ODRDMTkzLjAwNCAxNy45ODQgMjMyLjExNCA5LjI0MjA1IDI1MC45NzkgMC41MDAxMjIiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS1vcGFjaXR5PSIwLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLWRhc2hhcnJheT0iNi45MiA2LjkyIi8+IDwvc3ZnPg==)
    no-repeat center/contain;
  translate: -50%;
}
.hakata-content .fv-info__item {
  position: absolute;
  transform-origin: top center;
  animation: fv-sway 4.8s ease-in-out;
  will-change: rotate;
}
.hakata-content .fv-info__item a {
  display: grid;
}
.hakata-content .fv-info__item:first-child {
  top: 0.8rem;
  left: 2.4rem;
  width: 8.6rem;
}
.hakata-content .fv-info__item:nth-child(2) {
  top: 0.6rem;
  right: 0;
  width: 12.8rem;
  animation-delay: 0.15s;
}
.hakata-content .fv-lead {
  display: grid;
  max-width: calc(100% - 1.6rem);
}
.hakata-content .fv-lead img {
  width: 27.6rem;
}

@keyframes fv-sway {
  0% {
    rotate: 0deg;
  }
  7% {
    rotate: 3.2deg;
  }
  14% {
    rotate: -2.7deg;
  }
  22% {
    rotate: 2.4deg;
  }
  30% {
    rotate: -2deg;
  }
  40% {
    rotate: 1.7deg;
  }
  50% {
    rotate: -1.4deg;
  }
  62% {
    rotate: 1.1deg;
  }
  74% {
    rotate: -0.8deg;
  }
  86% {
    rotate: 0.5deg;
  }
  94% {
    rotate: -0.3deg;
  }
  100% {
    rotate: 0deg;
  }
}
.hakata-content .about {
  position: relative;
  padding-block: 7.2rem 20.8rem;
  background: url(/navi/hakata-bijinkakeikaku/assets/images/about-bg.jpg) no-repeat center top/cover;
  overflow: hidden;
}
.hakata-content .about-description {
  text-align: center;
  text-shadow: 0 0 0.4rem rgba(0, 0, 0, 0.25);
  font-weight: 700;
  line-height: 2.14;
}
.hakata-content .about-description p + p {
  margin-top: 1lh;
}
.hakata-content .about-lead {
  margin-top: 6.4rem;
  padding-inline: 6.2rem;
}
.hakata-content .about-lead::before,
.hakata-content .about-lead::after {
  width: 5rem;
  height: 1.2rem;
}
.hakata-content .about-lead img {
  width: 22rem;
}
.hakata-content .about-illust {
  position: absolute;
}
.hakata-content .about-illust.-tower {
  width: 7.6rem;
  inset: 0.4rem auto auto -2.4rem;
}
.hakata-content .about-illust.-ramen {
  width: 8.8rem;
  inset: 26rem -2.2rem auto auto;
}
.hakata-content .about-illust.-pot {
  width: 10.8rem;
  inset: auto auto 26.4rem -3.4rem;
}
.hakata-content .about-illust.-building {
  width: 21rem;
  inset: auto -3.8rem 3.6rem auto;
}
.hakata-content .about-decoration {
  position: absolute;
  width: 10.2rem;
}
.hakata-content .about-decoration.-top {
  inset: 9.1rem -3.6rem auto auto;
}
.hakata-content .about-decoration.-middle {
  inset: 26rem auto auto -4.8rem;
}
.hakata-content .about-decoration.-bottom {
  inset: auto -2.8rem 23.8rem auto;
}

.hakata-content .highlight {
  background: linear-gradient(210deg, #f9e7ff -3.13%, #bb8bca 25.7%);
}
.hakata-content .highlight .c-title-section .en {
  letter-spacing: -0.04em;
}
.hakata-content .highlight-item + .highlight-item {
  position: relative;
  margin-top: 3.2rem;
  padding-top: 3.2rem;
}
.hakata-content .highlight-item + .highlight-item::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  background-image: radial-gradient(circle, currentColor 0.05rem, transparent 0.05rem);
  background-size: 0.6rem 1px;
  background-repeat: repeat-x;
}
.hakata-content .highlight-item__title {
  margin-bottom: 2.4rem;
  font-size: 2rem;
}
.hakata-content .highlight-card {
  background: rgba(0, 0, 0, 0.1);
  padding: 2rem 1.8rem;
}
.hakata-content .highlight-card + .highlight-card {
  margin-top: 3.2rem;
}
.hakata-content .highlight-card.-cyan dt {
  background: linear-gradient(290deg, #4cafbb 70%, #bde4e9 98%);
}
.hakata-content .highlight-card.-pink dt {
  background: linear-gradient(290deg, #cf8ba9 70%, #e6b5cb 96%);
}
.hakata-content .highlight-card.-purple dt {
  background: linear-gradient(290deg, #ac87b8 70%, #dfc8e7 96%);
}
.hakata-content .highlight-card dt {
  min-height: 3.6rem;
  display: grid;
  place-items: center;
  font-weight: 700;
  letter-spacing: 0.06em;
}
.hakata-content .highlight-card dd {
  margin-top: 1rem;
}
.hakata-content .highlight-card dd img {
  width: 100%;
  clip-path: inset(0 0 1px 0);
}
.hakata-content .highlight-card dd p {
  margin-top: 1rem;
  font-weight: 700;
  text-align: justify;
}
.hakata-content .highlight-decoration {
  position: absolute;
  inset: 0 0 auto;
  display: block;
  width: 100%;
  height: auto;
  filter: blur(15px);
}

.hakata-content .movie {
  z-index: 1;
  height: initial;
  overflow: initial;
  background: linear-gradient(206deg, #b0e1e7 1.29%, #61bac4 14.13%);
}
.hakata-content .movie:not(:has(.movie-item.-pink)) .movie-info {
  margin-bottom: 0;
}
.hakata-content .movie__inner {
  position: static;
  left: auto;
  top: auto;
  height: auto;
  width: auto;
}
.hakata-content .movie-info {
  position: relative;
  margin-block: 6.4rem;
  padding: 1.8rem 2rem;
}
.hakata-content .movie-info::before,
.hakata-content .movie-info::after {
  content: '';
  display: inline-block;
  position: absolute;
  z-index: 1;
  inset: 0 auto auto 2rem;
  width: 32rem;
  height: 3.2rem;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMjEiIGhlaWdodD0iMzQiIHZpZXdCb3g9IjAgMCAzMjEgMzQiIGZpbGw9Im5vbmUiPiAgIDxwYXRoIGQ9Ik0wLjQyOTY4OCAzMy45MjE5VjAuMzcyMzE0SDMyMC44NDgiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIvPiA8L3N2Zz4=) no-repeat center/contain;
}
.hakata-content .movie-info::after {
  inset: auto 2rem 0 auto;
  rotate: 180deg;
}
.hakata-content .movie-info p {
  position: relative;
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
.hakata-content .movie-info p::before,
.hakata-content .movie-info p::after {
  content: '';
  display: inline-block;
  position: absolute;
  top: 50%;
  left: -2rem;
  translate: 0 calc(-50% + 1px);
  width: 1.2rem;
  height: 1.2rem;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDEzIDEzIiBmaWxsPSJub25lIj4gICA8cGF0aCBkPSJNMTIuMDkgNi4wNDVDNy4yODMxNCA2LjcyNzQ2IDYuNzI3NDYgNy4yODMxNCA2LjA0NSAxMi4wOUM1LjM2MjU0IDcuMjgzMTQgNC44MDY4NiA2LjcyNzQ2IDAgNi4wNDVDNC44MDY4NiA1LjM2MjU0IDUuMzYyNTQgNC44MDY4NiA2LjA0NSAwQzYuNzI3NDYgNC44MDY4NiA3LjI4MzE0IDUuMzYyNTQgMTIuMDkgNi4wNDVaIiBmaWxsPSJ3aGl0ZSIgZmlsbC1vcGFjaXR5PSIwLjYiLz4gPC9zdmc+) no-repeat center/contain;
}
.hakata-content .movie-info p::after {
  left: auto;
  right: -2rem;
}
.hakata-content .movie-item {
  padding-block: 3.2rem;
}
.hakata-content .movie-item + .movie-item {
  margin-top: 6.4rem;
}
.hakata-content .movie-item.-purple {
  background-color: #decfe3;
}
.hakata-content .movie-item.-purple .movie-item__media {
  background-color: #cbb6d2;
}
.hakata-content .movie-item.-purple .movie-item__button {
  background: linear-gradient(160deg, #f1c8db -3%, #ac87b8 50%);
}
.hakata-content .movie-item.-purple .movie-item__button::before {
  background-color: #ac87b8;
}
.hakata-content .movie-item.-pink {
  background-color: #ecd1dd;
}
.hakata-content .movie-item.-pink .movie-item__title::before {
  background-color: #cf8ba9;
}
.hakata-content .movie-item.-pink .movie-item__media {
  background-color: #d6b8c5;
}
.hakata-content .movie-item.-pink .movie-item__button {
  background: linear-gradient(160deg, #e6b5cb 0%, #cf8ba9 50%);
}
.hakata-content .movie-item.-pink .movie-item__button::before {
  background-color: #cf8ba9;
}
.hakata-content .movie-item__head {
  padding-inline: 2rem;
  padding-bottom: 2rem;
}
.hakata-content .movie-item__head > img {
  width: 100%;
  height: auto;
  display: block;
}
.hakata-content .movie-item__title {
  position: relative;
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1.3;
  min-height: 5rem;
  text-align: center;
}
.hakata-content .movie-item__title::before {
  content: '';
  display: inline-block;
  position: absolute;
  inset: auto 0 0;
  width: 100%;
  height: 100%;
  -webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzNTIiIGhlaWdodD0iNTAiIHZpZXdCb3g9IjAgMCAzNTIgNTAiIGZpbGw9Im5vbmUiPiAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMzUyIDEzLjU2NjlDMjM2Ljc4MyAtNC41MjIzMSAxMTUuMjE3IC00LjUyMjMxIDAgMTMuNTY2OUM2LjA3OTE2IDE5LjA0MDQgMTIuMDE4NyAyNC41NTYzIDE3LjgxODUgMzAuMTA5OEMxNi4yNDEyIDM2Ljc0MyAxNC44MTE4IDQzLjM3NjIgMTMuNTM4NSA1MEMxMTkuODkxIDMzLjMwMTUgMjMyLjEwOSAzMy4zMDE1IDMzOC40NjIgNTBDMzM3LjE4OCA0My4zNzE1IDMzNS43NjcgMzYuNzQzIDMzNC4xODEgMzAuMTA5OEMzMzkuOTgxIDI0LjU1MTUgMzQ1LjkyMSAxOS4wNDA0IDM1MiAxMy41NjY5WiIgZmlsbD0iI0FDODdCOCIvPiA8L3N2Zz4=) no-repeat center/contain;
  mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzNTIiIGhlaWdodD0iNTAiIHZpZXdCb3g9IjAgMCAzNTIgNTAiIGZpbGw9Im5vbmUiPiAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMzUyIDEzLjU2NjlDMjM2Ljc4MyAtNC41MjIzMSAxMTUuMjE3IC00LjUyMjMxIDAgMTMuNTY2OUM2LjA3OTE2IDE5LjA0MDQgMTIuMDE4NyAyNC41NTYzIDE3LjgxODUgMzAuMTA5OEMxNi4yNDEyIDM2Ljc0MyAxNC44MTE4IDQzLjM3NjIgMTMuNTM4NSA1MEMxMTkuODkxIDMzLjMwMTUgMjMyLjEwOSAzMy4zMDE1IDMzOC40NjIgNTBDMzM3LjE4OCA0My4zNzE1IDMzNS43NjcgMzYuNzQzIDMzNC4xODEgMzAuMTA5OEMzMzkuOTgxIDI0LjU1MTUgMzQ1LjkyMSAxOS4wNDA0IDM1MiAxMy41NjY5WiIgZmlsbD0iI0FDODdCOCIvPiA8L3N2Zz4=) no-repeat center/contain;
  background-color: #ac87b8;
}
.hakata-content .movie-item__title > span {
  position: relative;
  display: inline-block;
  translate: 0 0.4rem;
}
.hakata-content .movie-item__title > span::before,
.hakata-content .movie-item__title > span::after {
  content: '';
  display: inline-block;
  position: absolute;
  top: 1.2rem;
  left: -2rem;
  width: 1.2rem;
  height: 1.2rem;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDEzIDEzIiBmaWxsPSJub25lIj4gICA8cGF0aCBkPSJNMTIuMDkgNi4wNDVDNy4yODMxNCA2LjcyNzQ2IDYuNzI3NDYgNy4yODMxNCA2LjA0NSAxMi4wOUM1LjM2MjU0IDcuMjgzMTQgNC44MDY4NiA2LjcyNzQ2IDAgNi4wNDVDNC44MDY4NiA1LjM2MjU0IDUuMzYyNTQgNC44MDY4NiA2LjA0NSAwQzYuNzI3NDYgNC44MDY4NiA3LjI4MzE0IDUuMzYyNTQgMTIuMDkgNi4wNDVaIiBmaWxsPSJ3aGl0ZSIgZmlsbC1vcGFjaXR5PSIwLjYiLz4gPC9zdmc+) no-repeat center/contain;
}
.hakata-content .movie-item__title > span::after {
  left: auto;
  right: -2rem;
}
.hakata-content .movie-item__media {
  padding: 1.6rem 2rem;
}
.hakata-content .movie-item__media .media-txt {
  position: relative;
  margin-bottom: 1rem;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.2;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
.hakata-content .movie-item__media .media-txt::before,
.hakata-content .movie-item__media .media-txt::after {
  content: '';
  display: inline-block;
  position: absolute;
  top: 50%;
  left: -1.8rem;
  translate: 0 calc(-50% + 1px);
  width: 1px;
  height: 2rem;
  background-color: #fff;
  rotate: -40deg;
}
.hakata-content .movie-item__media .media-txt::after {
  left: auto;
  right: -1.6rem;
  rotate: 40deg;
}
.hakata-content .movie-item__content {
  margin-top: 2rem;
}
.hakata-content .movie-item__content > * + * {
  margin-top: 1.2rem;
}
.hakata-content .movie-item__button {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.4rem;
  align-items: center;
  max-width: 27rem;
  min-height: 4.8rem;
  padding-inline: 2.8rem;
  margin-inline: auto;
  border-radius: 99px;
  font-size: 1.6rem;
  text-align: center;
  color: #fff;
}
.hakata-content .movie-item__button::before {
  content: '';
  display: inline-block;
  position: absolute;
  z-index: 1;
  inset: 50% 1.6rem auto auto;
  translate: 0 calc(-50% - 1px);
  width: 1.6rem;
  height: 1.6rem;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCIgdmlld0JveD0iMCAwIDE4IDE4IiBmaWxsPSJub25lIj4gICA8cGF0aCBkPSJNNyAzSDFWMTdIMTVWMTEiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+ICAgPHBhdGggZD0iTTkgOUwxNiAyIiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPiAgIDxwYXRoIGQ9Ik0xMSAxSDE3VjciIHN0cm9rZT0id2hpdGUiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+IDwvc3ZnPg==) no-repeat center/contain;
}
.hakata-content .movie-decoration {
  position: absolute;
  inset: -8.2rem 0 auto;
  width: 100%;
  height: auto;
}

.hakata-content .member {
  background: linear-gradient(188deg, #ffe3ef -0.76%, #e8aec7 11.4%);
}
.hakata-content .member-description {
  text-align: center;
  font-size: 1.6rem;
}
.hakata-content .member-list {
  margin-top: 3.2rem;
  max-width: 32rem;
  margin-inline: auto;
}
.hakata-content .member-list > * + * {
  margin-top: 3.2rem;
}
.hakata-content .member-card {
  position: relative;
  padding: 1.2rem 2rem 3.2rem;
}
.hakata-content .member-card > * {
  position: relative;
  z-index: 1;
}
.hakata-content .member-card::before {
  content: '';
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  height: 22.4rem;
}
.hakata-content .member-card.-purple {
  background-color: #bc99c7;
}
.hakata-content .member-card.-purple::before {
  inset: -1.4rem 2.2rem auto auto;
  width: 18.8rem;
  background-image: url(/navi/hakata-bijinkakeikaku/assets/images/member-bg-purple.png);
}
.hakata-content .member-card.-pink {
  background-color: #d899b5;
}
.hakata-content .member-card.-pink::before {
  inset: -2rem auto auto 2rem;
  width: 22rem;
  background-image: url(/navi/hakata-bijinkakeikaku/assets/images/member-bg-pink.png);
}
.hakata-content .member-card.-pink .member-card__catch {
  inset: 6rem auto auto 3.6rem;
}
.hakata-content .member-card.-cyan {
  background-color: #449fa9;
}
.hakata-content .member-card.-cyan::before {
  inset: -2rem 2.8rem auto auto;
  width: 20rem;
  background-image: url(/navi/hakata-bijinkakeikaku/assets/images/member-bg-cyan.png);
}
.hakata-content .member-card.-cyan .member-card__catch {
  inset: 8.4rem 3.8rem auto auto;
}
.hakata-content .member-card:nth-child(even) .member-card__name {
  inset: auto auto 1.2rem 0rem;
}
.hakata-content .member-card:nth-child(even) .member-card__photo {
  text-align: right;
}
.hakata-content .member-card:nth-child(even) .member-card__en {
  inset: -2.4rem auto auto -1.2rem;
}
.hakata-content .member-card:nth-child(even) .member-card__comment::before {
  inset: -1.8rem 3.2rem auto auto;
}
.hakata-content .member-card__name {
  position: absolute;
  inset: auto 0 1.2rem auto;
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 1.2;
  text-shadow: 0 0 0.4rem rgba(0, 0, 0, 0.25);
}
.hakata-content .member-card__photo img {
  width: 17.6rem;
}
.hakata-content .member-card__en {
  position: absolute;
  inset: -2.4rem -1.2rem auto auto;
  writing-mode: vertical-rl;
  font-family:
    'Montserrat',
    'Noto Sans JP',
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    'Segoe UI',
    sans-serif;
  font-size: 2.2rem;
  font-weight: 300;
  line-height: 1.3;
}
.hakata-content .member-card__catch {
  position: absolute;
  inset: 9.6rem 2rem auto auto;
}
.hakata-content .member-card__catch img {
  width: 10.4rem;
  rotate: -10deg;
}
.hakata-content .member-card__info {
  margin-top: 3.2rem;
}
.hakata-content .member-card__comment {
  position: relative;
  padding: 1rem;
  background-color: #fff;
  text-align: justify;
  color: #333;
}
.hakata-content .member-card__comment::before {
  content: '';
  position: absolute;
  inset: -1.8rem auto auto 3.2rem;
  width: 2.2rem;
  height: 2rem;
  background-color: #fff;
  clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
}
.hakata-content .member-card__profile {
  margin-top: 1.2rem;
  font-size: 1.2rem;
  line-height: 1.3;
}
.hakata-content .member-card__profile > * + * {
  margin-top: 1.2rem;
}
.hakata-content .member-card__profile ul li::before {
  content: '・';
}
.hakata-content .member-card__sns {
  margin-top: 4.2rem;
  display: flex;
  gap: 4rem;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.hakata-content .member-card__sns img {
  width: 6rem;
}
.hakata-content .member-decoration {
  position: absolute;
  inset: 0 0 auto;
  width: 100%;
  height: auto;
}
