.screen {
  position: relative;
  text-transform: uppercase;
  transition: all 1s ease-out; }

.screen.left {
  clip-path: inset(0 100% 0 0); }

.screen.left.show {
  clip-path: inset(0); }

.screen.right {
  clip-path: inset(0 0 0 100%); }

.screen.right.show {
  clip-path: inset(0); }

body {
  background-color: #fff; }

.contents {
  width: 100%;
  margin: 80px auto 0; }
  .contents .kv {
    width: 100%;
    height: 700px;
    background-image: url(../img/relationship/collaboration_kv_bg.png);
    background-repeat: repeat;
    background-position: center;
    background-size: contain;
    display: flex;
    justify-content: center;
    align-items: center; }
    .contents .kv ul {
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 100%;
      max-width: 980px;
      margin: 0 auto;
      padding: 0; }
      .contents .kv ul li {
        flex-basis: auto; }
        .contents .kv ul li h2 {
          font-size: 24px;
          writing-mode: vertical-rl;
          font-weight: 400;
          letter-spacing: 0.2em;
          color: #fff;
          position: relative; }
          .contents .kv ul li h2 span {
            position: absolute;
            font-size: 10px;
            font-weight: 400;
            letter-spacing: 0.1em;
            top: 0;
            right: -24px;
            color: #fff; }
          .contents .kv ul li h2 span:after {
            content: "";
            width: 1px;
            height: 100px;
            background-color: #fff;
            position: absolute;
            top: 120%;
            left: 50%;
            transform: translateX(-50%); }
      .contents .kv ul li:last-child {
        flex-basis: 610px; }
        .contents .kv ul li:last-child .ttl {
          margin: 0 auto 20px; }
        .contents .kv ul li:last-child .kv_ttl {
          font-size: 36px;
          font-weight: 400;
          line-height: 1;
          color: #fff;
          letter-spacing: 0.1em;
          margin: 0 auto 20px;
          text-align: left; }
        .contents .kv ul li:last-child .kv_catch {
          font-size: 18px;
          font-weight: 500;
          line-height: 1;
          color: #fff;
          letter-spacing: 0.1em;
          margin: 0 auto 20px;
          text-align: left; }
        .contents .kv ul li:last-child .kv_line {
          text-align: center;
          margin: 20px auto; }
        .contents .kv ul li:last-child p {
          font-size: 16px;
          font-weight: 400;
          line-height: 2.2;
          color: #fff;
          letter-spacing: 0.1em;
          margin: 0 auto;
          text-align: left; }
  .contents .contents_wrap {
    width: 100%;
    background-image: url(../img/relationship/collaboration_story02_bg.png);
    background-repeat: repeat;
    background-position: center;
    background-size: auto;
    margin: 0 auto;
    padding: 170px 0 100px; }
    .contents .contents_wrap .inner {
      width: 100%;
      max-width: 980px;
      margin: 0 auto;
      padding: 0; }
      .contents .contents_wrap .inner h3 {
        font-size: 32px;
        font-weight: 400;
        line-height: 1;
        position: relative; }
        .contents .contents_wrap .inner h3:before {
          content: "";
          background-image: url(../img/relationship/collaboration_contents_line.svg);
          background-repeat: no-repeat;
          background-position: center;
          background-size: contain;
          width: 120px;
          height: 120px;
          position: absolute;
          top: -80px;
          left: -60px;
          opacity: 0.5; }
      .contents .contents_wrap .inner h4 {
        font-size: 18px;
        font-weight: 400;
        line-height: 1;
        margin: 15px 0 35px; }
      .contents .contents_wrap .inner p {
        font-size: 16px;
        font-weight: 400;
        line-height: 2.2;
        color: #0A0A0A;
        letter-spacing: 0.1em;
        margin: 0; }
      .contents .contents_wrap .inner .photo_r {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        width: 100%;
        margin: 0 auto 160px;
        padding: 0; }
        .contents .contents_wrap .inner .photo_r .summary {
          flex-basis: calc(100% - 424px); }
          .contents .contents_wrap .inner .photo_r .summary h5 {
            font-size: 32px;
            font-weight: 400;
            line-height: 1;
            position: relative; }
            .contents .contents_wrap .inner .photo_r .summary h5:before {
              content: "";
              background-image: url(../img/relationship/collaboration_contents_line.svg);
              background-repeat: no-repeat;
              background-position: center;
              background-size: contain;
              width: 120px;
              height: 120px;
              position: absolute;
              top: -80px;
              left: -60px;
              opacity: 0.5; }
          .contents .contents_wrap .inner .photo_r .summary h6 {
            font-size: 18px;
            font-weight: 400;
            line-height: 1;
            margin: 15px 0 35px; }
          .contents .contents_wrap .inner .photo_r .summary p {
            font-size: 16px;
            font-weight: 400;
            line-height: 2.2;
            color: #0A0A0A;
            letter-spacing: 0.1em;
            margin: 0; }
        .contents .contents_wrap .inner .photo_r .photo {
          flex-basis: 374px;
          margin-left: 50px; }
          .contents .contents_wrap .inner .photo_r .photo img {
            max-width: 100%; }
      .contents .contents_wrap .inner .photo_l {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        width: 100%;
        margin: 0 auto 160px;
        padding: 0; }
        .contents .contents_wrap .inner .photo_l .summary {
          flex-basis: calc(100% - 424px);
          text-align: right; }
          .contents .contents_wrap .inner .photo_l .summary h5 {
            font-size: 32px;
            font-weight: 400;
            line-height: 1;
            position: relative; }
            .contents .contents_wrap .inner .photo_l .summary h5:after {
              content: "";
              background-image: url(../img/relationship/collaboration_contents_line.svg);
              background-repeat: no-repeat;
              background-position: center;
              background-size: contain;
              width: 120px;
              height: 120px;
              position: absolute;
              top: -80px;
              right: -60px;
              opacity: 0.5;
              transform: rotate(90deg); }
          .contents .contents_wrap .inner .photo_l .summary h6 {
            font-size: 18px;
            font-weight: 400;
            line-height: 1;
            margin: 15px 0 35px; }
          .contents .contents_wrap .inner .photo_l .summary p {
            font-size: 16px;
            font-weight: 400;
            line-height: 2.2;
            color: #0A0A0A;
            letter-spacing: 0.1em;
            margin: 0;
            text-align: left; }
        .contents .contents_wrap .inner .photo_l .photo {
          flex-basis: 374px;
          margin-right: 50px; }
          .contents .contents_wrap .inner .photo_l .photo img {
            max-width: 100%; }
      .contents .contents_wrap .inner .product {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        flex-wrap: wrap;
        width: 100%;
        margin: 30px auto 100px;
        padding: 0; }
        .contents .contents_wrap .inner .product .product_bx {
          flex-basis: 300px;
          max-width: 300px;
          margin: 0 auto 60px;
          padding: 0; }
          .contents .contents_wrap .inner .product .product_bx img {
            max-width: 100%; }
          .contents .contents_wrap .inner .product .product_bx h6 {
            font-size: 16px;
            font-weight: 600;
            line-height: 1;
            text-align: center;
            margin: 25px auto; }
          .contents .contents_wrap .inner .product .product_bx p {
            font-size: 16px;
            font-weight: 400;
            line-height: 2;
            text-align: left; }
      .contents .contents_wrap .inner .theme {
        margin: 0 auto 140px; }
        .contents .contents_wrap .inner .theme ul {
          display: flex;
          justify-content: space-between;
          align-items: flex-start;
          width: 100%;
          max-width: 980px;
          margin: 30px auto 0;
          padding: 0; }
          .contents .contents_wrap .inner .theme ul li {
            flex-basis: 300px;
            max-width: 300px;
            margin: 0 auto;
            padding: 0; }
            .contents .contents_wrap .inner .theme ul li h5 {
              font-size: 18px;
              font-weight: 400;
              line-height: 1;
              color: #fff;
              background-color: #0A0A0A;
              text-align: center;
              padding: 20px 0;
              margin: 0 auto 20px; }
            .contents .contents_wrap .inner .theme ul li p {
              font-size: 16px;
              font-weight: 400;
              line-height: 2;
              color: #0A0A0A;
              letter-spacing: 0.1em;
              margin: 0;
              text-align: left; }
      .contents .contents_wrap .inner .taste {
        margin: 0 auto 140px; }
        .contents .contents_wrap .inner .taste ul {
          display: flex;
          justify-content: space-between;
          align-items: center;
          flex-wrap: wrap;
          width: 100%;
          max-width: 980px;
          margin: 30px auto;
          padding: 0; }
          .contents .contents_wrap .inner .taste ul .photo {
            flex-basis: 100px; }
            .contents .contents_wrap .inner .taste ul .photo img {
              max-width: 85px; }
          .contents .contents_wrap .inner .taste ul .summary {
            flex-basis: 390px; }
            .contents .contents_wrap .inner .taste ul .summary h6 {
              font-size: 18px;
              font-weight: 500;
              line-height: 1;
              margin: 0 auto 10px; }
            .contents .contents_wrap .inner .taste ul .summary p {
              font-size: 16px;
              font-weight: 400;
              line-height: 1;
              margin: 0; }
          .contents .contents_wrap .inner .taste ul .kei {
            flex-basis: 100%;
            padding-bottom: 15px;
            margin-bottom: 15px;
            border-bottom: 1px dotted #707070; }
      .contents .contents_wrap .inner .bottom_ec_nav {
        display: flex;
        justify-content: center;
        align-items: flex-end;
        margin: 100px auto;
        padding: 0;
        gap: 10px; }
        .contents .contents_wrap .inner .bottom_ec_nav li img {
          max-width: 146px; }
        .contents .contents_wrap .inner .bottom_ec_nav li p {
          font-size: 16px;
          font-weight: 400;
          line-height: 1.6;
          color: #0A0A0A;
          letter-spacing: 0.1em;
          margin: 0 0 10px; }
        .contents .contents_wrap .inner .bottom_ec_nav li .ec {
          background-color: #fff;
          border: 1px solid #AC2437;
          width: 268px;
          height: 90px;
          display: flex;
          justify-content: center;
          align-items: center;
          gap: 10px;
          text-align: left; }
          .contents .contents_wrap .inner .bottom_ec_nav li .ec p {
            font-size: 16px;
            font-weight: 400;
            line-height: 1;
            color: #AC2437;
            letter-spacing: 0.1em;
            margin: 0; }
            .contents .contents_wrap .inner .bottom_ec_nav li .ec p span {
              font-size: 10px;
              color: #AC2437;
              margin-bottom: 10px;
              position: relative;
              display: block;
              background: none; }
              .contents .contents_wrap .inner .bottom_ec_nav li .ec p span:after {
                content: "";
                background-image: url(../img/relationship/collaboration_bottom_ec_arrow.svg);
                background-repeat: no-repeat;
                background-position: center;
                background-size: contain;
                width: 27px;
                height: 8px;
                position: absolute;
                right: 30px;
                transition-duration: 0.5s; }
        @media (hover: hover) and (pointer: fine) {
          .contents .contents_wrap .inner .bottom_ec_nav li:hover .ec p span:after {
            right: 10px; } }
  .contents .bottom_another_nav {
    width: 100%;
    height: 522px;
    background-image: url(../img/relationship/collaboration_story02_bottom_bg.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover; }
    .contents .bottom_another_nav .balck_base {
      width: 100%;
      height: 100%;
      background-color: rgba(15, 15, 15, 0.78);
      margin: 0 auto;
      padding: 0; }
      .contents .bottom_another_nav .balck_base ul {
        width: 100%;
        max-width: 810px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
        max-width: 810px;
        margin: 0 auto;
        padding: 120px 0 0; }
        .contents .bottom_another_nav .balck_base ul li img {
          max-width: 244px; }
        .contents .bottom_another_nav .balck_base ul li .kv_ttl {
          font-size: 32px;
          font-weight: 400;
          line-height: 1;
          color: #fff;
          letter-spacing: 0.1em;
          margin: 0 auto 20px;
          text-align: left; }
        .contents .bottom_another_nav .balck_base ul li .kv_catch {
          font-size: 18px;
          font-weight: 400;
          line-height: 1;
          color: #fff;
          letter-spacing: 0.1em;
          margin: 0 auto 20px;
          text-align: left; }
        .contents .bottom_another_nav .balck_base ul li:nth-child(2) {
          flex-basis: 505px; }
      .contents .bottom_another_nav .balck_base p {
        width: 100%;
        max-width: 810px;
        font-size: 16px;
        font-weight: 300;
        line-height: 2.2;
        color: #fff;
        letter-spacing: 0.1em;
        margin: 20px auto 40px;
        text-align: left; }
      .contents .bottom_another_nav .balck_base .story_btn {
        width: 180px;
        height: 42px;
        border: 1px solid #D9D9D9;
        display: flex;
        justify-content: center;
        align-items: center;
        transition-duration: .5s;
        margin: 0 auto; }
        .contents .bottom_another_nav .balck_base .story_btn p {
          font-size: 12px;
          font-weight: 400;
          line-height: 1;
          color: #fff;
          text-align: center;
          margin: 0 auto; }
        .contents .bottom_another_nav .balck_base .story_btn p:after {
          content: "";
          background-image: url(../img/arrow_wh.svg);
          background-size: contain;
          background-repeat: no-repeat;
          background-position: center;
          width: 27px;
          height: 8px;
          position: absolute;
          right: -14px;
          top: 50%;
          transform: translateY(-50%);
          transition-duration: .5s; }
        .contents .bottom_another_nav .balck_base .story_btn:hover p:after {
          right: -32px; }

@media (max-width: 780px) {
  .contents {
    width: 100%;
    margin: 12vw auto 0; }
    .contents .kv {
      width: 100%;
      height: 118vw;
      background-image: url(../img/relationship/collaboration_kv_bg.png);
      background-repeat: repeat;
      background-position: center;
      background-size: contain;
      display: flex;
      justify-content: center;
      align-items: center; }
      .contents .kv ul {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: column;
        width: 100%;
        max-width: 90vw;
        margin: 0 auto;
        padding: 0; }
        .contents .kv ul li {
          flex-basis: 100%; }
          .contents .kv ul li h2 {
            font-size: 4.358974359vw;
            writing-mode: horizontal-tb;
            font-weight: 400;
            letter-spacing: 0.2em;
            color: #fff;
            position: relative;
            margin: 0 auto 10vw; }
            .contents .kv ul li h2 span {
              position: absolute;
              font-size: 2.5641025641vw;
              font-weight: 400;
              letter-spacing: 0.1em;
              top: initial;
              bottom: -4vw;
              right: initial;
              left: 50%;
              transform: translateX(-50%);
              color: #fff; }
            .contents .kv ul li h2 span:after {
              content: none; }
        .contents .kv ul li:last-child {
          flex-basis: 80vw;
          text-align: center; }
          .contents .kv ul li:last-child .ttl {
            margin: 0 auto 2vw; }
            .contents .kv ul li:last-child .ttl img {
              max-width: 30vw; }
          .contents .kv ul li:last-child .kv_ttl {
            font-size: 5.3846153846vw;
            font-weight: 400;
            line-height: 1;
            color: #fff;
            letter-spacing: 0.1em;
            margin: 0 auto 2vw;
            text-align: center; }
          .contents .kv ul li:last-child .kv_catch {
            font-size: 3.0769230769vw;
            font-weight: 500;
            line-height: 1;
            color: #fff;
            letter-spacing: 0.1em;
            margin: 0 auto 2vw;
            text-align: center; }
          .contents .kv ul li:last-child .kv_line {
            text-align: center;
            margin: 3vw auto; }
            .contents .kv ul li:last-child .kv_line img {
              max-width: 10vw; }
          .contents .kv ul li:last-child p {
            font-size: 3.0769230769vw;
            font-weight: 400;
            line-height: 2;
            color: #fff;
            letter-spacing: 0.1em;
            margin: 0 auto;
            text-align: left; }
    .contents .contents_wrap {
      width: 100%;
      background-image: url(../img/relationship/collaboration_story02_bg.png);
      background-repeat: repeat;
      background-position: center;
      background-size: auto;
      margin: 0 auto;
      padding: 15vw 0 10vw; }
      .contents .contents_wrap .inner {
        width: 100%;
        max-width: 80vw;
        margin: 0 auto;
        padding: 0; }
        .contents .contents_wrap .inner h3 {
          font-size: 5.3846153846vw;
          font-weight: 400;
          line-height: 1;
          position: relative; }
          .contents .contents_wrap .inner h3:before {
            content: "";
            background-image: url(../img/relationship/collaboration_contents_line.svg);
            background-repeat: no-repeat;
            background-position: center;
            background-size: contain;
            width: 12vw;
            height: 12vw;
            position: absolute;
            top: -8vw;
            left: -8vw;
            opacity: 0.5; }
        .contents .contents_wrap .inner h4 {
          font-size: 3.5897435897vw;
          font-weight: 400;
          line-height: 1;
          margin: 2vw 0 5vw; }
        .contents .contents_wrap .inner p {
          font-size: 3.3333333333vw;
          font-weight: 400;
          line-height: 2;
          color: #0A0A0A;
          letter-spacing: 0.1em;
          margin: 0; }
        .contents .contents_wrap .inner .photo_r {
          display: flex;
          justify-content: space-between;
          align-items: flex-start;
          flex-wrap: wrap;
          width: 100%;
          margin: 0 auto 20vw;
          padding: 0; }
          .contents .contents_wrap .inner .photo_r .summary {
            flex-basis: 80vw; }
            .contents .contents_wrap .inner .photo_r .summary h5 {
              font-size: 5.3846153846vw;
              font-weight: 400;
              line-height: 1;
              position: relative; }
              .contents .contents_wrap .inner .photo_r .summary h5:before {
                content: "";
                background-image: url(../img/relationship/collaboration_contents_line.svg);
                background-repeat: no-repeat;
                background-position: center;
                background-size: contain;
                width: 12vw;
                height: 12vw;
                position: absolute;
                top: -8vw;
                left: -8vw;
                opacity: 0.5; }
            .contents .contents_wrap .inner .photo_r .summary h6 {
              font-size: 3.5897435897vw;
              font-weight: 400;
              line-height: 1;
              margin: 2vw 0 5vw; }
            .contents .contents_wrap .inner .photo_r .summary p {
              font-size: 3.3333333333vw;
              font-weight: 400;
              line-height: 2;
              color: #0A0A0A;
              letter-spacing: 0.1em;
              margin: 0; }
          .contents .contents_wrap .inner .photo_r .photo {
            flex-basis: 80vw;
            margin-left: -10vw;
            margin-top: 5vw; }
            .contents .contents_wrap .inner .photo_r .photo img {
              max-width: 60vw; }
        .contents .contents_wrap .inner .photo_l {
          display: flex;
          justify-content: space-between;
          align-items: flex-start;
          flex-direction: column-reverse;
          flex-wrap: wrap;
          width: 100%;
          margin: 0 auto 20vw;
          padding: 0; }
          .contents .contents_wrap .inner .photo_l .summary {
            flex-basis: 80vw; }
            .contents .contents_wrap .inner .photo_l .summary h5 {
              font-size: 5.3846153846vw;
              font-weight: 400;
              line-height: 1;
              position: relative; }
              .contents .contents_wrap .inner .photo_l .summary h5:after {
                content: "";
                background-image: url(../img/relationship/collaboration_contents_line.svg);
                background-repeat: no-repeat;
                background-position: center;
                background-size: contain;
                width: 12vw;
                height: 12vw;
                position: absolute;
                top: -8vw;
                right: -8vw;
                opacity: 0.5; }
            .contents .contents_wrap .inner .photo_l .summary h6 {
              font-size: 3.5897435897vw;
              font-weight: 400;
              line-height: 1;
              margin: 2vw 0 5vw; }
            .contents .contents_wrap .inner .photo_l .summary p {
              font-size: 3.3333333333vw;
              font-weight: 400;
              line-height: 2;
              color: #0A0A0A;
              letter-spacing: 0.1em;
              margin: 0; }
          .contents .contents_wrap .inner .photo_l .photo {
            flex-basis: 80vw;
            margin-right: -10vw;
            margin-left: 30vw;
            margin-top: 5vw;
            text-align: right; }
            .contents .contents_wrap .inner .photo_l .photo img {
              max-width: 60vw; }
        .contents .contents_wrap .inner .product {
          display: flex;
          justify-content: space-between;
          align-items: flex-start;
          flex-wrap: wrap;
          width: 100%;
          max-width: 90vw;
          margin: 5vw auto 15vw;
          padding: 0; }
          .contents .contents_wrap .inner .product .product_bx {
            flex-basis: 38vw;
            max-width: 38vw;
            margin: 0 auto 10vw;
            padding: 0; }
            .contents .contents_wrap .inner .product .product_bx img {
              max-width: 100%; }
            .contents .contents_wrap .inner .product .product_bx h6 {
              font-size: 3.3333333333vw;
              font-weight: 600;
              line-height: 1.4;
              text-align: center;
              margin: 3vw auto; }
            .contents .contents_wrap .inner .product .product_bx p {
              font-size: 3.0769230769vw;
              font-weight: 400;
              line-height: 1.6;
              text-align: left; }
        .contents .contents_wrap .inner .theme {
          margin: 0 auto 15vw; }
          .contents .contents_wrap .inner .theme ul {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            flex-wrap: wrap;
            width: 100%;
            max-width: 80vw;
            margin: 5vw auto 0;
            padding: 0; }
            .contents .contents_wrap .inner .theme ul li {
              flex-basis: 100%;
              max-width: 100%;
              margin: 0 auto 5vw;
              padding: 0; }
              .contents .contents_wrap .inner .theme ul li h5 {
                font-size: 3.5897435897vw;
                font-weight: 400;
                line-height: 1;
                color: #fff;
                background-color: #0A0A0A;
                text-align: center;
                padding: 3vw 0;
                margin: 0 auto 3vw; }
              .contents .contents_wrap .inner .theme ul li p {
                font-size: 3.3333333333vw;
                font-weight: 400;
                line-height: 2;
                color: #0A0A0A;
                letter-spacing: 0.1em;
                margin: 0;
                text-align: left; }
        .contents .contents_wrap .inner .taste {
          margin: 0 auto 15vw; }
          .contents .contents_wrap .inner .taste ul {
            display: flex;
            justify-content: space-between;
            align-items: center;
            flex-wrap: wrap;
            width: 100%;
            max-width: 80vw;
            margin: 5vw auto;
            padding: 0; }
            .contents .contents_wrap .inner .taste ul .photo {
              flex-basis: 15vw;
              margin-bottom: 3vw; }
              .contents .contents_wrap .inner .taste ul .photo img {
                max-width: 15vw; }
            .contents .contents_wrap .inner .taste ul .summary {
              flex-basis: 60vw;
              margin-bottom: 3vw; }
              .contents .contents_wrap .inner .taste ul .summary h6 {
                font-size: 3.3333333333vw;
                font-weight: 500;
                line-height: 1;
                margin: 0 auto 1vw; }
              .contents .contents_wrap .inner .taste ul .summary p {
                font-size: 3.0769230769vw;
                font-weight: 400;
                line-height: 1;
                margin: 0; }
            .contents .contents_wrap .inner .taste ul .kei {
              display: none; }
        .contents .contents_wrap .inner .bottom_ec_nav {
          display: flex;
          justify-content: center;
          align-items: flex-end;
          margin: 15vw auto;
          padding: 0;
          gap: 3vw; }
          .contents .contents_wrap .inner .bottom_ec_nav li {
            text-align: left; }
            .contents .contents_wrap .inner .bottom_ec_nav li img {
              max-width: 25vw; }
            .contents .contents_wrap .inner .bottom_ec_nav li p {
              font-size: 3.0769230769vw;
              font-weight: 400;
              line-height: 1.2;
              color: #0A0A0A;
              letter-spacing: 0.1em;
              margin: 0 0 2vw; }
            .contents .contents_wrap .inner .bottom_ec_nav li .ec {
              background-color: #fff;
              border: 1px solid #AC2437;
              width: 47vw;
              height: 14vw;
              display: flex;
              justify-content: center;
              align-items: center;
              gap: 3vw;
              text-align: left; }
              .contents .contents_wrap .inner .bottom_ec_nav li .ec p {
                font-size: 3.0769230769vw;
                font-weight: 400;
                line-height: 1;
                color: #AC2437;
                letter-spacing: 0;
                margin: 0; }
                .contents .contents_wrap .inner .bottom_ec_nav li .ec p span {
                  font-size: 2.5641025641vw;
                  color: #AC2437;
                  margin-bottom: 1vw;
                  position: relative;
                  display: block;
                  background: none; }
                  .contents .contents_wrap .inner .bottom_ec_nav li .ec p span:after {
                    content: "";
                    background-image: url(../img/relationship/collaboration_bottom_ec_arrow.svg);
                    background-repeat: no-repeat;
                    background-position: center;
                    background-size: contain;
                    width: 4vw;
                    height: 1.2vw;
                    position: absolute;
                    right: 5vw;
                    transition-duration: 0.5s; }
    .contents .bottom_another_nav {
      width: 100vw;
      height: 114vw;
      background-image: url(../img/relationship/collaboration_story02_bottom_bg-s.png);
      background-repeat: no-repeat;
      background-position: center;
      background-size: cover; }
      .contents .bottom_another_nav .balck_base {
        width: 100%;
        height: 100%;
        background-color: rgba(15, 15, 15, 0.78);
        margin: 0 auto;
        padding: 0; }
        .contents .bottom_another_nav .balck_base ul {
          width: 100%;
          max-width: 80vw;
          display: flex;
          justify-content: center;
          align-items: center;
          flex-wrap: wrap;
          margin: 0 auto;
          padding: 12vw 0 0; }
          .contents .bottom_another_nav .balck_base ul li {
            text-align: center; }
            .contents .bottom_another_nav .balck_base ul li img {
              max-width: 32vw;
              margin: 0 auto 3vw; }
            .contents .bottom_another_nav .balck_base ul li .kv_ttl {
              font-size: 4.6153846154vw;
              font-weight: 400;
              line-height: 1;
              color: #fff;
              letter-spacing: 0.1em;
              margin: 0 auto 2vw;
              text-align: center; }
            .contents .bottom_another_nav .balck_base ul li .kv_catch {
              font-size: 2.8205128205vw;
              font-weight: 400;
              line-height: 1;
              color: #fff;
              letter-spacing: 0.1em;
              margin: 0 auto 6vw;
              text-align: center; }
        .contents .bottom_another_nav .balck_base p {
          width: 100%;
          max-width: 80vw;
          font-size: 2.8205128205vw;
          font-weight: 300;
          line-height: 2;
          color: #fff;
          letter-spacing: 0.1em;
          margin: 0 auto 5vw;
          text-align: left; }
        .contents .bottom_another_nav .balck_base .story_btn {
          width: 60vw;
          height: 12vw;
          border: 1px solid #D9D9D9;
          display: flex;
          justify-content: center;
          align-items: center;
          transition-duration: .5s;
          margin: 0 auto; }
          .contents .bottom_another_nav .balck_base .story_btn p {
            font-size: 2.5641025641vw;
            font-weight: 400;
            line-height: 1;
            color: #fff;
            text-align: center;
            margin: 0 auto; }
          .contents .bottom_another_nav .balck_base .story_btn p:after {
            content: "";
            background-image: url(../img/arrow_wh.svg);
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
            width: 27px;
            height: 8px;
            position: absolute;
            right: -14px;
            top: 50%;
            transform: translateY(-50%);
            transition-duration: .5s; }
          .contents .bottom_another_nav .balck_base .story_btn:hover p:after {
            right: -32px; } }

/*# sourceMappingURL=collaboration02.css.map */