@charset "UTF-8";
/*--------------------
共通設定
----------------------*/
img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom; }

a {
  text-decoration: none;
  color: #000000; }
  a.disabled {
    pointer-events: none;
    text-decoration: none; }

.bold {
  font-family: "bold";
  font-weight: 700; }

ul, ol {
  list-style: none; }

.pc {
  display: block; }
  @media screen and (max-width: 1500px) {
    .pc {
      display: none; } }

.sp {
  display: none; }
  @media screen and (max-width: 1500px) {
    .sp {
      display: block; } }

html, body {
  overflow-x: hidden;
  height: 100svh; }

.fs-l-page {
  overflow: visible; }

.wrapper {
  margin: 0 auto !important; }

main {
  max-width: 100%; }

.mainBox {
  margin: 0 auto !important; }

footer {
  position: relative;
  z-index: 9999; }

html.lenis, html.lenis body {
  height: auto; }

.fadeIn {
  opacity: 0;
  transition: opacity 1.5s; }
  .fadeIn.visible {
    opacity: 1; }

.fp-warning, .fp-watermark a {
  display: none; }

/*--------------------------------------------*/
#loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 9999;
  transition: opacity 0.5s ease, visibility 0.5s; }
  #loading.loaded {
    opacity: 0;
    visibility: hidden;
    pointer-events: none; }
  #loading .swiper {
    height: 100%; }
    #loading .swiper .swiper-wrapper {
      transition-timing-function: linear; }
      #loading .swiper .swiper-wrapper img {
        width: 100%;
        height: 100%;
        object-fit: cover; }
  #loading .txtBox {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 9999; }
    #loading .txtBox .top {
      position: absolute;
      top: 5%;
      left: 5%;
      max-width: 100px; }
    #loading .txtBox .center {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      max-width: 400px; }
      @media screen and (max-width: 1000px) {
        #loading .txtBox .center {
          width: 80%; } }
    #loading .txtBox .bottom {
      position: absolute;
      bottom: 5%;
      left: 5%;
      max-width: 800px; }
      @media screen and (max-width: 1000px) {
        #loading .txtBox .bottom {
          width: 80%;
          left: 50%;
          transform: translateX(-50%); } }
    #loading .txtBox .anime {
      filter: blur(10px);
      animation: blurOut 1.5s ease-out forwards; }

@keyframes blurOut {
  from {
    filter: blur(5px); }
  to {
    filter: blur(0px); } }
/*--------------------------------------------*/
.lp_wrapper {
  margin: 0 0 0 auto;
  padding: 0;
  letter-spacing: 0;
  font-size: 16px;
  text-align: center;
  font-family: "ja";
  letter-spacing: 0;
  font-weight: 400;
  font-style: normal;
  width: fit-content;
  max-width: 550px;
  display: flex;
  height: 100vh;
  height: calc(var(--vh, 1vh) * 100);
  min-height: calc(var(--vh, 1vh) * 100);
  height: -webkit-fill-available;
  min-height: -webkit-fill-available;
  /* lp_main */ }
  @media screen and (max-width: 1500px) {
    .lp_wrapper {
      height: 100svh; } }
  @media screen and (max-width: 650px) {
    .lp_wrapper {
      width: 100%;
      max-width: none;
      display: block;
      padding: 0; } }
  .lp_wrapper header {
    flex: 1;
    height: 100vh;
    position: relative;
    z-index: 10; }
    @media screen and (max-width: 650px) {
      .lp_wrapper header {
        display: none; } }
    .lp_wrapper header .bg {
      position: fixed;
      top: 0;
      left: 0;
      height: 100%;
      z-index: 1;
      overflow: hidden;
      min-height: 100px; }
      @media screen and (max-width: 650px) {
        .lp_wrapper header .bg {
          display: none; } }
      .lp_wrapper header .bg .inner {
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0;
        width: 100%;
        height: 100%; }
        .lp_wrapper header .bg .inner.bg__box01 {
          opacity: 1;
          background: #2f231e; }
        .lp_wrapper header .bg .inner.bg__box02 {
          background: #a0a0a0; }
        .lp_wrapper header .bg .inner.bg__box03 {
          background: #87a5be; }
        .lp_wrapper header .bg .inner.bg__box04 {
          background: #1b5658; }
        .lp_wrapper header .bg .inner.bg__box05 {
          background: #a59bb4; }
        .lp_wrapper header .bg .inner.bg__box06 {
          background: #a59173; }
        .lp_wrapper header .bg .inner.bg__box07 {
          background: #cd5f8c; }
        .lp_wrapper header .bg .inner.bg__box08 {
          background: #595757; }
        .lp_wrapper header .bg .inner.bg__box09 {
          background: #b9c8be; }
        .lp_wrapper header .bg .inner img {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          width: auto;
          height: 80%;
          aspect-ratio: 1 / 1;
          object-fit: contain;
          border-radius: 3%; }
          @media screen and (max-width: 1500px) {
            .lp_wrapper header .bg .inner img {
              width: 80%;
              height: auto; } }
    .lp_wrapper header .txt {
      position: absolute;
      aspect-ratio: 1 / 1;
      width: auto;
      height: 80%;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 2; }
      @media screen and (max-width: 1500px) {
        .lp_wrapper header .txt {
          width: 80%;
          height: auto; } }
      .lp_wrapper header .txt .logo {
        position: absolute;
        top: 5%;
        left: -5%; }
        .lp_wrapper header .txt .logo img {
          max-width: 100px; }
      .lp_wrapper header .txt .pc_txt {
        position: absolute;
        top: 10%;
        right: -5%; }
        @media screen and (max-width: 1000px) {
          .lp_wrapper header .txt .pc_txt {
            display: none; } }
        .lp_wrapper header .txt .pc_txt ul {
          list-style: none; }
          .lp_wrapper header .txt .pc_txt ul li {
            text-align: right;
            margin-bottom: 1.5em; }
            @media screen and (max-width: 1500px) {
              .lp_wrapper header .txt .pc_txt ul li {
                margin-bottom: 1.0em; } }
            .lp_wrapper header .txt .pc_txt ul li h3 {
              font-family: "gotham", sans-serif;
              font-size: 0.8em;
              font-weight: 400;
              color: #ffffff;
              letter-spacing: 1px; }
            .lp_wrapper header .txt .pc_txt ul li a {
              font-family: "gotham", sans-serif;
              color: #ffffff;
              font-size: 0.7em;
              position: relative;
              display: block;
              padding: 0 .5em;
              line-height: 2.0;
              font-weight: 300; }
              @media screen and (max-width: 1500px) {
                .lp_wrapper header .txt .pc_txt ul li a {
                  line-height: 1.8; } }
              .lp_wrapper header .txt .pc_txt ul li a::after, .lp_wrapper header .txt .pc_txt ul li a::before {
                content: "";
                width: 2px;
                height: 2px;
                border-radius: 50%;
                background: #ffffff;
                position: absolute;
                top: 50%;
                transform: translateY(-50%); }
              .lp_wrapper header .txt .pc_txt ul li a::before {
                margin-left: -.4em; }
              .lp_wrapper header .txt .pc_txt ul li a::after {
                margin-left: .3em; }
      .lp_wrapper header .txt .catchcopy {
        position: absolute;
        bottom: -7%;
        left: 50%;
        transform: translateX(-50%);
        width: 100%; }
  .lp_wrapper .lp_main {
    width: 100%;
    height: 100vh;
    aspect-ratio: 1 / 2;
    flex-shrink: 0;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
    opacity: 0;
    transform: translateY(20px);
    /* 少し下から浮き上がらせる演出（お好みで） */
    transition: opacity 1.2s ease, transform 1.2s ease;
    /* ふわっとさせる時間 */
    pointer-events: none; }
    @media screen and (max-width: 1500px) {
      .lp_wrapper .lp_main {
        height: 100dvh; } }
    .lp_wrapper .lp_main.is-show {
      opacity: 1;
      transform: translateY(0);
      pointer-events: auto;
      margin: 0; }
    @media screen and (max-width: 650px) {
      .lp_wrapper .lp_main {
        margin: 0 auto; } }
    .lp_wrapper .lp_main .color-section {
      width: 100%;
      height: 100vh;
      position: relative; }
      @media screen and (max-height: 700px) and (max-width: 650px) {
        .lp_wrapper .lp_main .color-section {
          height: auto !important;
          min-height: 880px; } }
      .lp_wrapper .lp_main .color-section::before {
        position: absolute;
        content: "";
        width: 90%;
        height: 94%;
        background: #ffffff;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        border-radius: 1em;
        z-index: 1; }
        @media screen and (max-height: 700px) and (max-width: 650px) {
          .lp_wrapper .lp_main .color-section::before {
            height: calc(780px);
            top: 10%;
            transform: translate(-50%, -5%); } }
      @media screen and (max-width: 650px) {
        .lp_wrapper .lp_main .color-section::after {
          content: "";
          width: 1000%;
          height: 1000%;
          position: relative;
          top: 0;
          left: -100%;
          z-index: -1; }
        .lp_wrapper .lp_main .color-section.box--01::after {
          background: #2f231e; }
        .lp_wrapper .lp_main .color-section.box--02::after {
          background: #2f231e; }
        .lp_wrapper .lp_main .color-section.box--03::after {
          background: #a0a0a0; }
        .lp_wrapper .lp_main .color-section.box--04::after {
          background: #87a5be; }
        .lp_wrapper .lp_main .color-section.box--05::after {
          background: #1b5658; }
        .lp_wrapper .lp_main .color-section.box--06::after {
          background: #a59bb4; }
        .lp_wrapper .lp_main .color-section.box--07::after {
          background: #a59173; }
        .lp_wrapper .lp_main .color-section.box--08::after {
          background: #cd5f8c; }
        .lp_wrapper .lp_main .color-section.box--09::after {
          background: #595757; } }
      .lp_wrapper .lp_main .color-section.box--01 {
        background: #2f231e; }
      .lp_wrapper .lp_main .color-section.box--02 {
        background: #2f231e; }
        @media screen and (max-width: 650px) {
          .lp_wrapper .lp_main .color-section.box--02 {
            background: #a0a0a0; } }
      .lp_wrapper .lp_main .color-section.box--03 {
        background: #a0a0a0; }
        @media screen and (max-width: 650px) {
          .lp_wrapper .lp_main .color-section.box--03 {
            background: #87a5be; } }
      .lp_wrapper .lp_main .color-section.box--04 {
        background: #87a5be; }
        @media screen and (max-width: 650px) {
          .lp_wrapper .lp_main .color-section.box--04 {
            background: #1b5658; } }
      .lp_wrapper .lp_main .color-section.box--05 {
        background: #1b5658; }
        @media screen and (max-width: 650px) {
          .lp_wrapper .lp_main .color-section.box--05 {
            background: #a59bb4; } }
      .lp_wrapper .lp_main .color-section.box--06 {
        background: #a59bb4; }
        @media screen and (max-width: 650px) {
          .lp_wrapper .lp_main .color-section.box--06 {
            background: #a59173; } }
      .lp_wrapper .lp_main .color-section.box--07 {
        background: #a59173; }
        @media screen and (max-width: 650px) {
          .lp_wrapper .lp_main .color-section.box--07 {
            background: #cd5f8c; } }
      .lp_wrapper .lp_main .color-section.box--08 {
        background: #cd5f8c; }
        @media screen and (max-width: 650px) {
          .lp_wrapper .lp_main .color-section.box--08 {
            background: #595757; } }
      .lp_wrapper .lp_main .color-section.box--09 {
        background: #595757;
        height: 100vh !important; }
        @media screen and (max-width: 650px) {
          .lp_wrapper .lp_main .color-section.box--09 {
            background: #b9c8be; } }
        .lp_wrapper .lp_main .color-section.box--09::before {
          display: none; }
      .lp_wrapper .lp_main .color-section.active.box--01 {
        background: #2f231e; }
      .lp_wrapper .lp_main .color-section.active.box--02 {
        background: #a0a0a0; }
      .lp_wrapper .lp_main .color-section.active.box--03 {
        background: #87a5be; }
      .lp_wrapper .lp_main .color-section.active.box--04 {
        background: #1b5658; }
      .lp_wrapper .lp_main .color-section.active.box--05 {
        background: #a59bb4; }
      .lp_wrapper .lp_main .color-section.active.box--06 {
        background: #a59173; }
      .lp_wrapper .lp_main .color-section.active.box--07 {
        background: #cd5f8c; }
      .lp_wrapper .lp_main .color-section.active.box--08 {
        background: #595757; }
      .lp_wrapper .lp_main .color-section.active.box--09 {
        background: #b9c8be; }
      @media screen and (max-width: 650px) {
        .lp_wrapper .lp_main .color-section.active::after {
          content: "";
          width: 1000%;
          height: 1000%;
          position: relative;
          top: 0;
          left: -100%;
          z-index: -1; }
        .lp_wrapper .lp_main .color-section.active.box--01::after {
          background: #2f231e; }
        .lp_wrapper .lp_main .color-section.active.box--02::after {
          background: #a0a0a0; }
        .lp_wrapper .lp_main .color-section.active.box--03::after {
          background: #87a5be; }
        .lp_wrapper .lp_main .color-section.active.box--04::after {
          background: #1b5658; }
        .lp_wrapper .lp_main .color-section.active.box--05::after {
          background: #a59bb4; }
        .lp_wrapper .lp_main .color-section.active.box--06::after {
          background: #a59173; }
        .lp_wrapper .lp_main .color-section.active.box--07::after {
          background: #cd5f8c; }
        .lp_wrapper .lp_main .color-section.active.box--08::after {
          background: #595757; }
        .lp_wrapper .lp_main .color-section.active.box--09::after {
          background: #b9c8be; } }
      .lp_wrapper .lp_main .color-section .innerBox {
        position: absolute;
        z-index: 2;
        width: 100%;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        max-height: 94%;
        overflow: hidden; }
        @media screen and (max-height: 700px) and (max-width: 650px) {
          .lp_wrapper .lp_main .color-section .innerBox {
            position: relative;
            /* absoluteから通常フローに戻す */
            top: 0;
            left: 0;
            transform: none;
            height: 780px !important;
            max-height: none;
            padding: 40px 0;
            /* 上下にゆとりを持たせる */
            max-height: none; } }
        .lp_wrapper .lp_main .color-section .innerBox h2 {
          font-family: "gotham", sans-serif;
          font-weight: 400;
          font-size: min(1.2em, 4.5vw);
          text-align: left;
          letter-spacing: .1em; }
        .lp_wrapper .lp_main .color-section .innerBox .line {
          width: fit-content;
          margin-top: 2.0em; }
          @media screen and (max-width: 650px) {
            .lp_wrapper .lp_main .color-section .innerBox .line {
              margin: 1.0em 0; } }
        .lp_wrapper .lp_main .color-section .innerBox .box {
          width: 87%;
          padding: 2.0em 0; }
          @media screen and (max-height: 700px) and (max-width: 650px) {
            .lp_wrapper .lp_main .color-section .innerBox .box {
              height: 780px !important;
              display: block;
              /* flexによる縦方向の無理な引き伸ばしを解除 */ } }
          .lp_wrapper .lp_main .color-section .innerBox .box a {
            display: block;
            position: relative; }
        .lp_wrapper .lp_main .color-section .innerBox .vertical {
          font-size: min(0.8em, 2.9vw);
          padding-left: 3.0em; }
          .lp_wrapper .lp_main .color-section .innerBox .vertical span {
            writing-mode: vertical-rl;
            white-space: pre;
            display: inline-block;
            font-size: 100%; }
      .lp_wrapper .lp_main .color-section .dot {
        position: absolute;
        width: 1.0em;
        aspect-ratio: 1 / 1;
        z-index: 10; }
        .lp_wrapper .lp_main .color-section .dot::before {
          position: absolute;
          top: 0;
          left: 0;
          content: "";
          width: 100%;
          height: 100%;
          scale: .8;
          background: #ffffff;
          border-radius: 50%; }
        .lp_wrapper .lp_main .color-section .dot::after {
          content: "";
          display: block;
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          border-radius: 50%;
          border: 0.06em solid #ffffff;
          box-sizing: border-box;
          animation: focus_dot 1.7s infinite; }
      .lp_wrapper .lp_main .color-section.box--01 {
        background: #2f231e; }
        .lp_wrapper .lp_main .color-section.box--01 .box {
          width: 87%;
          padding: 2.0em 0;
          margin: 0 0 0 auto; }
          @media screen and (max-width: 650px) {
            .lp_wrapper .lp_main .color-section.box--01 .box {
              margin-top: 10%; } }
          .lp_wrapper .lp_main .color-section.box--01 .box a {
            display: block;
            position: relative; }
        .lp_wrapper .lp_main .color-section.box--01 h2 {
          margin: 0 auto 2.0em; }
        .lp_wrapper .lp_main .color-section.box--01 .right {
          margin-bottom: 5%; }
          .lp_wrapper .lp_main .color-section.box--01 .right .dot {
            top: 38%;
            left: 70%; }
        .lp_wrapper .lp_main .color-section.box--01 .left {
          display: flex;
          align-items: center; }
          .lp_wrapper .lp_main .color-section.box--01 .left a {
            width: 60%; }
            .lp_wrapper .lp_main .color-section.box--01 .left a .dot {
              top: 50%;
              left: 67%; }
          .lp_wrapper .lp_main .color-section.box--01 .left .vertical {
            width: 40%;
            padding-left: 3.0em; }
            .lp_wrapper .lp_main .color-section.box--01 .left .vertical span {
              letter-spacing: .5em; }
      .lp_wrapper .lp_main .color-section.box--02 .innerBox {
        height: 100%; }
      .lp_wrapper .lp_main .color-section.box--02 .box {
        margin: 0 auto;
        padding: 3.0em 0;
        width: 80%;
        height: 100%;
        display: flex;
        justify-content: space-between;
        flex-direction: column; }
        .lp_wrapper .lp_main .color-section.box--02 .box .center {
          margin-bottom: 5%; }
          .lp_wrapper .lp_main .color-section.box--02 .box .center .dot {
            top: 40%;
            left: 10%; }
            .lp_wrapper .lp_main .color-section.box--02 .box .center .dot.right {
              top: 17%;
              left: 75%; }
        .lp_wrapper .lp_main .color-section.box--02 .box .vertical {
          text-align: right;
          margin-bottom: 1.0em; }
          .lp_wrapper .lp_main .color-section.box--02 .box .vertical span {
            letter-spacing: .1em; }
      .lp_wrapper .lp_main .color-section.box--03 .innerBox {
        height: 100%; }
      .lp_wrapper .lp_main .color-section.box--03 .box {
        margin: 0 auto;
        padding: 2.0em 0;
        width: 82%;
        height: 100%;
        display: flex;
        justify-content: space-between;
        flex-direction: column;
        position: relative; }
        .lp_wrapper .lp_main .color-section.box--03 .box .ttl_flex {
          display: flex;
          justify-content: space-between;
          align-items: flex-start;
          margin-bottom: 1.5%; }
          .lp_wrapper .lp_main .color-section.box--03 .box .ttl_flex h2 {
            margin-bottom: 3.0em;
            padding-right: 1.0em; }
          .lp_wrapper .lp_main .color-section.box--03 .box .ttl_flex .left {
            width: 40%; }
            .lp_wrapper .lp_main .color-section.box--03 .box .ttl_flex .left .dot {
              top: 23%;
              left: 7%; }
        .lp_wrapper .lp_main .color-section.box--03 .box .fixed {
          position: absolute;
          width: 53%;
          z-index: 4;
          top: 12%;
          left: -10%; }
          .lp_wrapper .lp_main .color-section.box--03 .box .fixed .dot {
            top: 37%;
            left: 17%; }
        .lp_wrapper .lp_main .color-section.box--03 .box .center {
          margin-bottom: 5%; }
          .lp_wrapper .lp_main .color-section.box--03 .box .center.flex {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 2%; }
            .lp_wrapper .lp_main .color-section.box--03 .box .center.flex p {
              width: 75%;
              text-align: center;
              padding: 0;
              margin-top: 65%; }
            .lp_wrapper .lp_main .color-section.box--03 .box .center.flex a {
              width: auto; }
            .lp_wrapper .lp_main .color-section.box--03 .box .center.flex.half a {
              width: calc(100%/2 - 1%); }
            .lp_wrapper .lp_main .color-section.box--03 .box .center.flex .dot.dot1 {
              top: 64%;
              left: 70%; }
            .lp_wrapper .lp_main .color-section.box--03 .box .center.flex .dot.left {
              top: 56%;
              left: 27%; }
            .lp_wrapper .lp_main .color-section.box--03 .box .center.flex .dot.right {
              top: 21%;
              left: 10%; }
          .lp_wrapper .lp_main .color-section.box--03 .box .center .dot {
            top: 40%;
            left: 10%; }
            .lp_wrapper .lp_main .color-section.box--03 .box .center .dot.right {
              top: 30%;
              left: 70%; }
        .lp_wrapper .lp_main .color-section.box--03 .box .vertical {
          text-align: right;
          margin-bottom: 1.0em; }
          .lp_wrapper .lp_main .color-section.box--03 .box .vertical span {
            letter-spacing: 0.5em; }
      .lp_wrapper .lp_main .color-section.box--04 .innerBox {
        height: 100%; }
      .lp_wrapper .lp_main .color-section.box--04 .box {
        margin: 0 auto;
        padding: 3.0em 0;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: space-between;
        flex-direction: column;
        position: relative; }
        .lp_wrapper .lp_main .color-section.box--04 .box h2 {
          text-align: center;
          margin: 3.0em auto;
          padding-right: 1.0em; }
        .lp_wrapper .lp_main .color-section.box--04 .box .flex {
          display: flex;
          align-items: stretch;
          justify-content: space-between;
          flex-wrap: wrap; }
          .lp_wrapper .lp_main .color-section.box--04 .box .flex a {
            width: 30%;
            margin-bottom: 2%; }
            .lp_wrapper .lp_main .color-section.box--04 .box .flex a:nth-child(2), .lp_wrapper .lp_main .color-section.box--04 .box .flex a:nth-child(5) {
              width: 36%; }
            .lp_wrapper .lp_main .color-section.box--04 .box .flex a img {
              width: 100%;
              height: 100%;
              object-fit: cover; }
            .lp_wrapper .lp_main .color-section.box--04 .box .flex a .dot.dot_1 {
              top: 10%;
              left: 5%; }
            .lp_wrapper .lp_main .color-section.box--04 .box .flex a .dot.dot_2 {
              top: 35%;
              left: 7%; }
            .lp_wrapper .lp_main .color-section.box--04 .box .flex a .dot.dot_3 {
              top: 10%;
              left: 85%; }
            .lp_wrapper .lp_main .color-section.box--04 .box .flex a .dot.dot_4 {
              top: 37%;
              left: 80%; }
            .lp_wrapper .lp_main .color-section.box--04 .box .flex a .dot.dot_5 {
              top: 55%;
              left: 80%; }
            .lp_wrapper .lp_main .color-section.box--04 .box .flex a .dot.dot_6 {
              top: 20%;
              left: 10%; }
        .lp_wrapper .lp_main .color-section.box--04 .box .vertical {
          width: 90%;
          text-align: right;
          margin-bottom: 1.0em; }
          .lp_wrapper .lp_main .color-section.box--04 .box .vertical span {
            letter-spacing: 0.5em; }
        .lp_wrapper .lp_main .color-section.box--04 .box .line {
          margin-left: 10%; }
      .lp_wrapper .lp_main .color-section.box--05 .innerBox {
        height: 100%; }
      .lp_wrapper .lp_main .color-section.box--05 .box {
        width: 100%;
        padding: 5.0em 0 0; }
      .lp_wrapper .lp_main .color-section.box--05 h2 {
        margin-left: 10%;
        margin-bottom: 2.0em; }
      .lp_wrapper .lp_main .color-section.box--05 .center {
        margin-bottom: 3%; }
        .lp_wrapper .lp_main .color-section.box--05 .center .dot {
          top: 18%;
          left: 35%; }
      .lp_wrapper .lp_main .color-section.box--05 .flex {
        width: 80%;
        margin: 0 auto;
        display: flex;
        align-items: flex-start;
        justify-content: flex-end; }
        .lp_wrapper .lp_main .color-section.box--05 .flex a {
          width: 68%; }
          .lp_wrapper .lp_main .color-section.box--05 .flex a .dot {
            top: 31%;
            left: 62%; }
        .lp_wrapper .lp_main .color-section.box--05 .flex .right {
          width: 36%;
          display: flex;
          flex-direction: column;
          align-items: flex-end;
          justify-content: space-between; }
          .lp_wrapper .lp_main .color-section.box--05 .flex .right a {
            width: 110%; }
            .lp_wrapper .lp_main .color-section.box--05 .flex .right a .dot {
              top: 45%;
              left: 66%; }
          .lp_wrapper .lp_main .color-section.box--05 .flex .right .vertical {
            text-align: right;
            margin-bottom: 100px; }
            .lp_wrapper .lp_main .color-section.box--05 .flex .right .vertical span {
              letter-spacing: .5em; }
      .lp_wrapper .lp_main .color-section.box--05 .line {
        margin-left: 10%;
        position: absolute;
        bottom: 3.0em; }
      .lp_wrapper .lp_main .color-section.box--06 .innerBox {
        height: 100%; }
      .lp_wrapper .lp_main .color-section.box--06 .box {
        width: 75%;
        padding: 3em 0 0;
        margin: 0 auto; }
      .lp_wrapper .lp_main .color-section.box--06 h2 {
        margin-bottom: 2.0em; }
      .lp_wrapper .lp_main .color-section.box--06 .center {
        width: 80%;
        margin: 0 auto; }
        .lp_wrapper .lp_main .color-section.box--06 .center a {
          margin-bottom: 3%; }
        .lp_wrapper .lp_main .color-section.box--06 .center .dot {
          top: 45%;
          left: 78%; }
        .lp_wrapper .lp_main .color-section.box--06 .center .dot1 {
          top: 30%;
          left: 25%; }
        .lp_wrapper .lp_main .color-section.box--06 .center .dot2 {
          top: 60%;
          left: 7%; }
      .lp_wrapper .lp_main .color-section.box--06 .vertical {
        position: absolute;
        top: 50%;
        right: 10%;
        transform: translateY(-50%); }
        .lp_wrapper .lp_main .color-section.box--06 .vertical span {
          letter-spacing: .5em; }
      .lp_wrapper .lp_main .color-section.box--06 .line {
        position: absolute;
        bottom: 2.0em; }
      .lp_wrapper .lp_main .color-section.box--07 .innerBox {
        height: 100%; }
      .lp_wrapper .lp_main .color-section.box--07 .box {
        width: 100%;
        padding: 3em 0 0; }
      .lp_wrapper .lp_main .color-section.box--07 h2 {
        text-align: center;
        margin-bottom: 1.5em; }
      .lp_wrapper .lp_main .color-section.box--07 .flex {
        display: flex;
        align-items: flex-start;
        justify-content: space-between; }
        .lp_wrapper .lp_main .color-section.box--07 .flex .left {
          display: flex;
          flex-direction: column;
          align-items: center;
          width: 60%; }
          .lp_wrapper .lp_main .color-section.box--07 .flex .left a:nth-child(2) {
            width: 70%;
            margin-top: 6%; }
        .lp_wrapper .lp_main .color-section.box--07 .flex .vertical {
          padding-left: 0;
          padding-right: 12%; }
          .lp_wrapper .lp_main .color-section.box--07 .flex .vertical span {
            letter-spacing: .5em; }
      .lp_wrapper .lp_main .color-section.box--07 .fixed {
        position: absolute;
        right: 0;
        top: 35%;
        width: 45%; }
      .lp_wrapper .lp_main .color-section.box--07 .line {
        position: absolute;
        bottom: 2.0em;
        left: 10%;
        text-align: left; }
        .lp_wrapper .lp_main .color-section.box--07 .line p {
          margin-top: 1em;
          font-size: min(0.7em, 2.8vw); }
      .lp_wrapper .lp_main .color-section.box--08 .innerBox {
        height: 100%; }
      .lp_wrapper .lp_main .color-section.box--08 .box {
        width: 85%;
        height: 96%;
        display: flex;
        justify-content: space-between;
        flex-direction: column;
        margin: 0 auto;
        padding: 4em 0 0; }
      .lp_wrapper .lp_main .color-section.box--08 .ttl {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        width: 90%;
        margin: 0 auto; }
        .lp_wrapper .lp_main .color-section.box--08 .ttl .vertical {
          padding: 0; }
          .lp_wrapper .lp_main .color-section.box--08 .ttl .vertical span {
            letter-spacing: .2em;
            text-align: left; }
      .lp_wrapper .lp_main .color-section.box--08 .flex {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap; }
        .lp_wrapper .lp_main .color-section.box--08 .flex a {
          width: calc(100%/2 - 1%);
          margin-bottom: 2%; }
        .lp_wrapper .lp_main .color-section.box--08 .flex .dot.dot_1 {
          top: 55%;
          left: 15%; }
        .lp_wrapper .lp_main .color-section.box--08 .flex .dot.dot_2 {
          top: 60%;
          left: 68%; }
        .lp_wrapper .lp_main .color-section.box--08 .flex .dot.dot_3 {
          top: 60%;
          left: 20%; }
        .lp_wrapper .lp_main .color-section.box--08 .flex .dot.dot_4 {
          top: 40%;
          left: 74%; }
      .lp_wrapper .lp_main .color-section.box--08 .fixed {
        position: absolute;
        right: 0;
        top: 35%;
        width: 45%; }
      .lp_wrapper .lp_main .color-section.box--08 .line {
        margin-left: 5%; }
      .lp_wrapper .lp_main .color-section.box--09 .innerBox {
        height: 85% !important; }
      .lp_wrapper .lp_main .color-section.box--09 .box {
        height: 55% !important;
        padding: 0;
        width: 80%;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-direction: column; }
      .lp_wrapper .lp_main .color-section.box--09 .credit {
        color: #ffffff;
        letter-spacing: 1px;
        font-size: min(0.8em, 2.9vw);
        padding: 3.0em 0;
        border: solid #ffffff;
        border-width: 1px 0;
        width: 100%; }
      .lp_wrapper .lp_main .color-section.box--09 .sns {
        display: flex;
        align-items: center;
        justify-content: space-between;
        max-width: 200px;
        margin: 0 auto;
        width: 100%; }
        .lp_wrapper .lp_main .color-section.box--09 .sns a {
          display: block; }
          .lp_wrapper .lp_main .color-section.box--09 .sns a img {
            max-width: 18px;
            vertical-align: middle; }
      .lp_wrapper .lp_main .color-section.box--09 .anello {
        position: relative;
        z-index: 999; }
        .lp_wrapper .lp_main .color-section.box--09 .anello img {
          max-width: 120px; }

@keyframes focus_dot {
  0% {
    opacity: 0;
    scale: 0.8; }
  10% {
    opacity: 1; }
  30% {
    opacity: 1; }
  100% {
    opacity: 0;
    scale: 1.2; } }