/********************************************************

setting

********************************************************/
:root {
  --margin-block: 200px; }

@media (min-width: 1101px) and (max-width: 1280px) {
  :root {
    --margin-block: 120px; } }
@media (min-width: 641px) and (max-width: 1100px) {
  :root {
    --margin-block: 90px; } }
@media (max-width: 640px) {
  :root {
    --margin-block: 70px; } }
body {
  overflow-x: hidden; }

/* -------------------------------------------------------

animation

------------------------------------------------------- */
@keyframes slideLoopLeft {
  0% {
    transform: translateX(0); }
  100% {
    transform: translateX(-50%); } }
@keyframes slideLoopRight {
  0% {
    transform: translateX(-50%); }
  100% {
    transform: translateX(0); } }
@keyframes slideLoopUp {
  0% {
    transform: translateY(0); }
  100% {
    transform: translateY(-50%); } }
@keyframes slideLoopDown {
  0% {
    transform: translateY(-50%); }
  100% {
    transform: translateY(0); } }
/* -------------------------------------------------------

intro

------------------------------------------------------- */
.section_concept-intro .loop-text {
  overflow: hidden;
  position: relative;
  width: 300%;
  display: flex;
  margin: clamp(110px, 13.75vw, 220px) auto 0 0; }
  @media screen and (max-width: 600px) {
    .section_concept-intro .loop-text {
      margin-top: 0; } }
  .section_concept-intro .loop-text_wrap {
    width: 100%;
    display: flex;
    gap: 20px;
    margin-top: 40px; }

.section_concept-intro .intro_wrap {
  width: min(90%, 1400px);
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  flex-wrap: wrap;
  padding: clamp(50px, 6.25vw, 100px) 0 clamp(50px, 6.25vw, 100px) 0; }
  @media screen and (max-width: 970px) {
    .section_concept-intro .intro_wrap {
      height: auto; } }
  .section_concept-intro .intro_wrap .intro_copy {
    width: 47%;
    margin: clamp(60px, 7.5vw, 120px) 0 0 0; }
    @media screen and (max-width: 970px) {
      .section_concept-intro .intro_wrap .intro_copy {
        width: 100%; } }
    @media screen and (max-width: 600px) {
      .section_concept-intro .intro_wrap .intro_copy {
        margin-top: 0; } }
    .section_concept-intro .intro_wrap .intro_copy .copy_main {
      font-size: 20px;
      letter-spacing: 0.1em;
      color: #ec8380;
      font-weight: 400;
      margin: 0 0 clamp(50px, 6.25vw, 100px) 0; }
      @media screen and (min-width: 750px) {
        .section_concept-intro .intro_wrap .intro_copy .copy_main {
          font-size: calc(20px + 0.0205128205 * (100vw - 750px)); } }
      @media screen and (min-width: 1920px) {
        .section_concept-intro .intro_wrap .intro_copy .copy_main {
          font-size: 44px; } }
      @media screen and (max-width: 970px) {
        .section_concept-intro .intro_wrap .intro_copy .copy_main {
          margin-bottom: 30px; } }
    .section_concept-intro .intro_wrap .intro_copy .copy_text {
      font-size: 12px;
      line-height: 2.5; }
      @media screen and (min-width: 750px) {
        .section_concept-intro .intro_wrap .intro_copy .copy_text {
          font-size: calc(12px + 0.0034188034 * (100vw - 750px)); } }
      @media screen and (min-width: 1920px) {
        .section_concept-intro .intro_wrap .intro_copy .copy_text {
          font-size: 16px; } }
      @media screen and (max-width: 970px) {
        .section_concept-intro .intro_wrap .intro_copy .copy_text {
          line-height: 2.0;
          margin-bottom: 50px; } }
      .section_concept-intro .intro_wrap .intro_copy .copy_text p {
        margin: 0 0 clamp(30px, 3.75vw, 60px) 0; }
        .section_concept-intro .intro_wrap .intro_copy .copy_text p:last-child {
          margin-bottom: 0; }
  .section_concept-intro .intro_wrap .intro_scroll-img {
    width: 47%;
    height: 900px;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap; }
    @media screen and (max-width: 970px) {
      .section_concept-intro .intro_wrap .intro_scroll-img {
        width: 100%;
        height: auto; } }
    .section_concept-intro .intro_wrap .intro_scroll-img .scroll-img_group {
      width: 47%;
      display: flex;
      flex-direction: column;
      gap: 15px;
      animation: slideLoopUp 15s linear infinite; }
      @media screen and (max-width: 970px) {
        .section_concept-intro .intro_wrap .intro_scroll-img .scroll-img_group {
          flex-direction: row;
          animation: slideLoopLeft 15s linear infinite;
          width: 100%; } }
      .section_concept-intro .intro_wrap .intro_scroll-img .scroll-img_group:nth-child(2) {
        animation: slideLoopDown 15s linear infinite; }
        @media screen and (max-width: 970px) {
          .section_concept-intro .intro_wrap .intro_scroll-img .scroll-img_group:nth-child(2) {
            animation: slideLoopRight 15s linear infinite;
            margin-top: 20px; } }
      .section_concept-intro .intro_wrap .intro_scroll-img .scroll-img_group .scroll-img_item {
        width: 100%; }
        @media screen and (max-width: 970px) {
          .section_concept-intro .intro_wrap .intro_scroll-img .scroll-img_group .scroll-img_item {
            flex: 0 0 auto;
            width: 33%; } }
        .section_concept-intro .intro_wrap .intro_scroll-img .scroll-img_group .scroll-img_item img {
          border-radius: 7px; }

/* -------------------------------------------------------

concept detail

------------------------------------------------------- */
.section_concept-detail .concept-detail {
  position: relative;
  width: 90%;
  margin: 20px auto 0;
  z-index: 1; }
  .section_concept-detail .concept-detail .bg-img_right {
    position: absolute;
    right: 0;
    top: 0; }
    @media screen and (max-width: 1170px) {
      .section_concept-detail .concept-detail .bg-img_right img {
        border-radius: 20px; } }
  .section_concept-detail .concept-detail .bg-img_left {
    position: absolute;
    left: 0;
    bottom: 0; }
    @media screen and (max-width: 1170px) {
      .section_concept-detail .concept-detail .bg-img_left img {
        border-radius: 20px; } }
  .section_concept-detail .concept-detail .concept-detail_wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: clamp(60px, 7.5vw, 120px) 0 clamp(60px, 7.5vw, 120px) 0;
    width: min(90%, 1400px);
    margin: 0 auto; }
    @media screen and (max-width: 750px) {
      .section_concept-detail .concept-detail .concept-detail_wrap {
        padding: 0 0 40px;
        width: 100%; } }
  .section_concept-detail .concept-detail .concept-detail_main-img {
    width: clamp(30%, 46.6vw, 895px);
    max-width: 895px; }
    @media screen and (max-width: 970px) {
      .section_concept-detail .concept-detail .concept-detail_main-img {
        width: 100%;
        order: 1; } }
    .section_concept-detail .concept-detail .concept-detail_main-img .en-text {
      position: absolute; }
      @media screen and (max-width: 1170px) {
        .section_concept-detail .concept-detail .concept-detail_main-img .en-text {
          width: 10%; } }
      @media screen and (max-width: 750px) {
        .section_concept-detail .concept-detail .concept-detail_main-img .en-text {
          width: 6%; } }
    .section_concept-detail .concept-detail .concept-detail_main-img__left {
      margin-left: calc(-1 * clamp(125px, 13vw, 250px)); }
      @media screen and (max-width: 970px) {
        .section_concept-detail .concept-detail .concept-detail_main-img__left {
          margin-left: 0; } }
      .section_concept-detail .concept-detail .concept-detail_main-img__left .en-text {
        right: 3%; }
    .section_concept-detail .concept-detail .concept-detail_main-img__right {
      margin-right: calc(-1 * clamp(125px, 13vw, 250px)); }
      @media screen and (max-width: 970px) {
        .section_concept-detail .concept-detail .concept-detail_main-img__right {
          margin-right: 0; } }
      .section_concept-detail .concept-detail .concept-detail_main-img__right .en-text {
        left: 3%; }
  .section_concept-detail .concept-detail .concept-detail_copy-unit {
    width: 46%;
    z-index: 1; }
    @media screen and (max-width: 970px) {
      .section_concept-detail .concept-detail .concept-detail_copy-unit {
        width: 90%;
        margin: 0 auto;
        order: 2; } }
    .section_concept-detail .concept-detail .concept-detail_copy-unit .copy_main {
      font-size: 18px;
      line-height: 1.6;
      font-weight: 400;
      margin: 0 auto clamp(20px, 2.5vw, 40px) auto; }
      @media screen and (min-width: 750px) {
        .section_concept-detail .concept-detail .concept-detail_copy-unit .copy_main {
          font-size: calc(18px + 0.0102564103 * (100vw - 750px)); } }
      @media screen and (min-width: 1920px) {
        .section_concept-detail .concept-detail .concept-detail_copy-unit .copy_main {
          font-size: 30px; } }
      @media screen and (max-width: 750px) {
        .section_concept-detail .concept-detail .concept-detail_copy-unit .copy_main {
          font-size: 16px; } }
    .section_concept-detail .concept-detail .concept-detail_copy-unit .copy_sub {
      font-size: 14px;
      line-height: 2.0; }
      @media screen and (min-width: 750px) {
        .section_concept-detail .concept-detail .concept-detail_copy-unit .copy_sub {
          font-size: calc(14px + 0.0017094017 * (100vw - 750px)); } }
      @media screen and (min-width: 1920px) {
        .section_concept-detail .concept-detail .concept-detail_copy-unit .copy_sub {
          font-size: 16px; } }
      @media screen and (max-width: 750px) {
        .section_concept-detail .concept-detail .concept-detail_copy-unit .copy_sub {
          font-size: 12px;
          line-height: 1.6; } }
    .section_concept-detail .concept-detail .concept-detail_copy-unit .sub-img_set {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      margin: clamp(40px, 5vw, 80px) auto 0 auto; }
      .section_concept-detail .concept-detail .concept-detail_copy-unit .sub-img_set img {
        border-radius: 7px;
        width: 100%; }

.section_concept-detail .concept-detail__green {
  background: #dbe8e1;
  border-radius: 60px; }
  @media screen and (max-width: 1170px) {
    .section_concept-detail .concept-detail__green {
      border-radius: 20px; } }
  .section_concept-detail .concept-detail__green .concept-detail_copy-unit .copy_main {
    color: #719280; }
  .section_concept-detail .concept-detail__green .concept-detail_copy-unit .sub-img_set .sub-img_01 {
    width: min(30%, 185px); }
  .section_concept-detail .concept-detail__green .concept-detail_copy-unit .sub-img_set .sub-img_02 {
    width: min(63%, 400px);
    margin-top: 50px; }
.section_concept-detail .concept-detail__blue {
  background: #dcecf1;
  border-radius: 60px; }
  @media screen and (max-width: 1170px) {
    .section_concept-detail .concept-detail__blue {
      border-radius: 20px; } }
  .section_concept-detail .concept-detail__blue .concept-detail_copy-unit .copy_main {
    color: #698791; }
  .section_concept-detail .concept-detail__blue .concept-detail_copy-unit .sub-img_set .sub-img_01 {
    width: min(50%, 315px); }
  .section_concept-detail .concept-detail__blue .concept-detail_copy-unit .sub-img_set .sub-img_02 {
    width: min(48%, 300px);
    margin-top: 30px; }
    .section_concept-detail .concept-detail__blue .concept-detail_copy-unit .sub-img_set .sub-img_02 .img_02_02 {
      width: min(59%, 177px);
      margin-top: 10px; }
.section_concept-detail .concept-detail__purple {
  background: #ebe8ef;
  border-radius: 60px; }
  @media screen and (max-width: 1170px) {
    .section_concept-detail .concept-detail__purple {
      border-radius: 20px; } }
  .section_concept-detail .concept-detail__purple .concept-detail_copy-unit .copy_main {
    color: #a293b6; }
  .section_concept-detail .concept-detail__purple .concept-detail_copy-unit .sub-img_set .sub-img_01 {
    width: min(43%, 270px); }
    .section_concept-detail .concept-detail__purple .concept-detail_copy-unit .sub-img_set .sub-img_01 .img_01_02 {
      width: min(83%, 225px);
      margin-left: auto;
      margin-top: 10px; }
  .section_concept-detail .concept-detail__purple .concept-detail_copy-unit .sub-img_set .sub-img_02 {
    width: min(55%, 350px);
    margin-top: 50px; }

/* -------------------------------------------------------

last_view

------------------------------------------------------- */
.section_last_view {
  background-color: #9ebed7;
  margin-top: -100px; }
  @media screen and (max-width: 1170px) {
    .section_last_view {
      margin-top: -50px; } }
  .section_last_view .loop-text {
    width: 300%;
    overflow-x: hidden;
    display: flex;
    padding: clamp(75px, 9.375vw, 150px) 0 0 0; }
    .section_last_view .loop-text .loop-text_wrap {
      width: 100%;
      display: flex;
      gap: 20px;
      animation: slideLoopLeft 20s linear infinite;
      will-change: transform; }
      .section_last_view .loop-text .loop-text_wrap .loop-text_item {
        width: 100%; }
  .section_last_view .concept-copy-mark_wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    flex-wrap: wrap;
    margin: clamp(100px, 12.5vw, 200px) auto 0 auto; }
    .section_last_view .concept-copy-mark_wrap .concept-copy {
      font-weight: 700;
      writing-mode: vertical-rl;
      text-orientation: upright;
      font-size: 16px;
      text-align: center;
      color: #353232;
      display: block; }
      @media screen and (min-width: 750px) {
        .section_last_view .concept-copy-mark_wrap .concept-copy {
          font-size: calc(16px + 0.011965812 * (100vw - 750px)); } }
      @media screen and (min-width: 1920px) {
        .section_last_view .concept-copy-mark_wrap .concept-copy {
          font-size: 30px; } }
    .section_last_view .concept-copy-mark_wrap .concept-mark {
      width: min(80%, 753px);
      margin: clamp(100px, 12.5vw, 200px) auto 0 auto; }
  .section_last_view .view-img {
    width: 100%; }
    .section_last_view .view-img img {
      width: 100%; }
