@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Google+Sans+Code:ital,wght@0,300..800;1,300..800&family=Nanum+Pen+Script&display=swap");
.nanum-pen-script-regular {
  font-family: "Nanum Pen Script", cursive;
  font-weight: 400;
  font-style: normal;
}

html {
  scroll-behavior: smooth;
}

[class*=btn] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn_more {
  padding: 4px;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  background: #222 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M17.916 7.05424L10.416 13.7209C10.1792 13.9313 9.82271 13.9313 9.58594 13.7209L2.08594 7.05424L2.91602 6.12L10.001 12.4172L17.0859 6.12L17.916 7.05424Z' fill='white'/%3E%3C/svg%3E") no-repeat center/12px;
}
.btn_plus {
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8.00521 1.50256C8.28135 1.50256 8.50521 1.72642 8.50521 2.00256V7.49996H14C14.2761 7.49996 14.5 7.72382 14.5 7.99996C14.5 8.2761 14.2761 8.49996 14 8.49996H8.50521V14.0026C8.50521 14.2787 8.28135 14.5026 8.00521 14.5026C7.72907 14.5026 7.50521 14.2787 7.50521 14.0026V8.49996H2C1.72386 8.49996 1.5 8.2761 1.5 7.99996C1.5 7.72382 1.72386 7.49996 2 7.49996H7.50521V2.00256C7.50521 1.72642 7.72907 1.50256 8.00521 1.50256Z' fill='%23222222'/%3E%3C/svg%3E") no-repeat center/15px;
}
.btn_link {
  background: #121212;
  padding: 8px 12px;
  text-align: center;
  color: #fff;
  font-size: 15px;
  line-height: 160%;
  letter-spacing: -0.6px;
}
.btn_link i {
  display: inline-block;
  margin-left: 4px;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M5.64583 1.73242L10.9792 7.73242C11.1475 7.92184 11.1475 8.20707 10.9792 8.39648L5.64583 14.3965L4.89844 13.7324L9.9362 8.06445L4.89844 2.39648L5.64583 1.73242Z' fill='white'/%3E%3C/svg%3E") no-repeat center/16px;
}
.btn_close {
  display: flex;
  width: 56px;
  height: 56px;
  padding: 8px;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  aspect-ratio: 1/1;
  border-radius: 99px;
  background: rgba(64, 64, 64, 0.8);
  position: fixed;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
}
.btn_close i {
  background: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.9697 2.96967C20.2626 2.67678 20.7373 2.67678 21.0302 2.96967C21.3231 3.26256 21.3231 3.73732 21.0302 4.03022L13.0605 11.9999L21.0302 19.9697C21.3231 20.2626 21.3231 20.7373 21.0302 21.0302C20.7373 21.3231 20.2626 21.3231 19.9697 21.0302L11.9999 13.0605L4.03022 21.0302C3.73732 21.3231 3.26256 21.3231 2.96967 21.0302C2.67678 20.7373 2.67678 20.2626 2.96967 19.9697L10.9394 11.9999L2.96967 4.03022C2.67678 3.73732 2.67678 3.26256 2.96967 2.96967C3.26256 2.67678 3.73732 2.67678 4.03022 2.96967L11.9999 10.9394L19.9697 2.96967Z' fill='white'/%3E%3C/svg%3E%0A") no-repeat center/18px;
  display: block;
  width: 18px;
  height: 18px;
}

img {
  max-width: 100%;
}

.fr-modalParent_contentsInner {
  overflow-y: auto;
}

.only-mo {
  display: none;
}

.only-pc {
  display: block;
}

.link-arrow {
  padding-right: 16px;
  background-repeat: no-repeat;
  background-size: 12px;
  background-position: right 4px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M8.54096 6.23684C8.66111 6.08955 8.65238 5.87219 8.51508 5.73489L4.01508 1.23489C3.86863 1.08845 3.63125 1.08845 3.4848 1.23489C3.33836 1.38134 3.33836 1.61872 3.4848 1.76517L7.71967 6.00003L3.4848 10.2349C3.33836 10.3813 3.33836 10.6187 3.4848 10.7652C3.63125 10.9116 3.86863 10.9116 4.01508 10.7652L8.51508 6.26516L8.54096 6.23684Z' fill='%23222222'/%3E%3C/svg%3E");
}

.tab-area {
  border-top: 1px solid #eee;
  border-bottom: 1px solid #EEE;
  background: #fff;
  overflow-y: hidden;
  overflow-x: auto;
}
.tab-area ul {
  display: flex;
  margin-bottom: -1px;
}
.tab-area ul li {
  flex: 1;
}
.tab-area ul li a, .tab-area ul li button {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 12px 16px;
  color: #666;
  font-size: 14px;
  font-weight: 400;
  line-height: 142%;
  letter-spacing: -0.56px;
  white-space: nowrap;
  text-align: center;
}
.tab-area ul li.active {
  border-bottom: 1px solid #222;
}
.tab-area ul li.active a, .tab-area ul li.active button {
  color: #222;
  font-weight: 700;
}

.tab-contents {
  display: none;
}
.tab-contents.active {
  display: block;
}

.main_inner {
  max-width: unset;
  margin-right: unset;
  margin-left: unset;
  padding-right: 0;
  padding-left: 0;
}

h1 {
  color: #FFF;
  text-align: center;
  font-size: 48px;
  font-style: normal;
  font-weight: 700;
  line-height: 133%; /* 63.84px */
  letter-spacing: -3.36px;
}

h2 {
  color: #222;
  font-size: 32px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%; /* 48px */
  letter-spacing: -1.28px;
}

h3 {
  color: #000;
  text-align: center;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: 160%; /* 35.2px */
  letter-spacing: -1.1px;
}

h4 {
  color: #000;
  text-align: center;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 133%; /* 23.94px */
  letter-spacing: -0.9px;
}

.ani-down {
  transform: translateY(-30px);
  opacity: 0;
  transition: all 0.5s;
}

.ani-down.active {
  transform: translateY(0);
  opacity: 1;
}

.fr-modalChild_container .comment {
  font-size: 14px;
  color: #666;
}

@media screen and (min-width: 1280px) {
  .top-section {
    position: relative;
    /* 배경 슬라이드 */
  }
  .top-section .text-box {
    position: absolute;
    top: 52px;
    left: 80px;
    z-index: 10;
  }
  .top-section h1 {
    text-align: left;
    font-family: "UniqloProRegular", sans-serif;
    font-size: 32px;
    font-style: normal;
    font-weight: 400;
    line-height: 125%; /* 40px */
    letter-spacing: -0.64px;
    margin-bottom: 32px;
  }
  .top-section h1 strong {
    font-size: 80px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%; /* 96px */
    letter-spacing: -1.6px;
  }
  .top-section h1 strong span {
    display: inline-block;
    transform: translateY(-13px);
  }
  .top-section .text-area {
    margin-top: -10px;
  }
  .top-section .text-area p {
    color: #FFF;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 186%; /* 27.9px */
    letter-spacing: -0.6px;
  }
  .top-section #main-banner-slide-pc {
    position: absolute;
    z-index: 10;
    width: 1100px;
    top: 0;
    right: 0;
    height: 717px;
    margin: 72px 0 72px auto;
    padding-left: 89px;
  }
  .top-section #main-banner-slide-pc .swiper-wrapper {
    display: flex;
    align-items: flex-end; /* 기본적으로 하단 정렬 */
    margin-left: 24%;
  }
  .top-section #main-banner-slide-pc .swiper-slide {
    width: 219px !important;
    transition: transform 0.5s ease;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    transform-origin: bottom center; /* 확대 기준을 하단으로 */
  }
  .top-section #main-banner-slide-pc .swiper-slide video {
    width: 100%;
    aspect-ratio: 1/1.607;
  }
  .top-section #main-banner-slide-pc .swiper-slide-prev {
    transform: translateX(-50%); /* 확대 + 오른쪽으로 띄움 */
  }
  .top-section #main-banner-slide-pc .swiper-slide-active {
    transform: scale(2.03) translateX(-50%); /* 확대 + 오른쪽으로 띄움 */
    z-index: 2;
  }
  .top-section #main-banner-slide-pc .swiper-slide-active video {
    width: 100%;
    aspect-ratio: unset;
  }
  .top-section #mainbanner-bg-area {
    width: 100%;
    height: 860px;
    background: #000 url("https://image.uniqlo.com/UQ/ST3/kr/imagesother/Feature/contents/2511_Daejeon/people/main_banner_bg.jpg") no-repeat center right/contain;
  }
  .top-section #main-banner-slide-bg-pc {
    width: 51%;
    height: 100%;
    margin-left: unset;
    margin-right: auto;
  }
  .top-section #main-banner-slide-bg-pc .swiper-slide {
    width: 100% !important;
    height: 100% !important;
    margin-right: auto !important;
  }
  .top-section #main-banner-slide-bg-pc .swiper-slide img {
    width: 100%;
    height: 100%;
  }
  .contents-wrap {
    display: flex;
  }
  .left-area {
    width: 500px;
    box-sizing: content-box;
    flex-shrink: 0;
    background: #fff;
    padding-top: 64px;
  }
  .left-area .border-box {
    width: 100%;
    height: 100%;
    padding: 0 70px 0 80px;
  }
  .left-area h2 {
    margin-bottom: 32px;
    opacity: 0;
    transition: all 0.6s;
  }
  .left-area .profile {
    text-align: right;
    opacity: 0;
    transition: all 0.6s;
  }
  .left-area .profile span {
    display: block;
    font-size: 18px;
  }
  .left-area .profile strong {
    display: block;
    font-size: 18px;
  }
  .left-area.fixed {
    position: fixed;
    z-index: 10;
    top: 109px;
    height: 100%;
  }
  .left-area.fixed h2 {
    opacity: 1;
  }
  .left-area.fixed .profile {
    opacity: 1;
  }
  .right-area {
    padding-bottom: 88px;
    border-left: 1px solid #343434;
    width: calc(100% - 500px);
    margin-left: auto;
  }
  .right-area .profile-area {
    display: flex;
    gap: 56px;
    align-items: flex-end;
    margin-bottom: 48px;
    padding-left: 70px;
    padding-right: 80px;
  }
  .right-area .profile-area .wrap {
    flex: 1;
  }
  .right-area .profile-area .desc {
    color: #222;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 186%; /* 27.9px */
    letter-spacing: -0.6px;
  }
  h2 {
    color: #222;
    font-size: 36px;
    font-style: normal;
    font-weight: 700;
    line-height: 144%; /* 51.84px */
    letter-spacing: -1.44px;
  }
  .people-image {
    position: relative;
    flex: 1;
  }
  .people-image button {
    background: rgba(255, 255, 255, 0.8);
    color: #222;
    display: inline-flex;
    padding: 6px 16px;
    height: 32px;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: -0.56px;
    position: absolute;
    left: 12px;
    bottom: 12px;
    z-index: 10;
  }
  .show-interview {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 16px 0;
    margin-top: 16px;
    border-bottom: 1px solid #343434;
    color: #222;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 155%; /* 27.9px */
    letter-spacing: -0.72px;
  }
  .product {
    background: #F7F7F7;
    padding: 24px 70px;
  }
  .product .wrap {
    display: flex;
    align-items: center;
    gap: 48px;
  }
  .product .wrap figure {
    width: 258px;
    flex-shrink: 0;
  }
  .product .wrap .text-wrap .product-name {
    display: block;
    margin-bottom: 12px;
    color: #222;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 145%; /* 31.9px */
    letter-spacing: -0.88px;
  }
  .product .wrap .text-wrap .desc {
    margin-bottom: 24px;
    color: #222;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 177%; /* 31.86px */
    letter-spacing: -0.72px;
  }
  .product .wrap .text-wrap .btn_link {
    width: 118px;
  }
  .section-area section .profile-area {
    position: relative;
  }
  .section-area section .profile-area .wrap .image-sub {
    position: absolute;
    right: 80px;
    top: 60px;
  }
  .section-area section.typeR .profile-area .people-image {
    order: 2;
  }
  .section-area section.typeR .profile-area .wrap {
    order: 1;
  }
  .section-area section.typeR .profile-area .wrap .image-sub {
    left: 70px;
    right: unset;
  }
  .people-line-up {
    background: #F8F2E2;
    padding: 88px 80px;
    display: flex;
    gap: 64px;
  }
  .people-line-up .wrap {
    width: 336px;
  }
  .people-line-up span {
    display: block;
    color: #222;
    font-family: "Uniqlo Pro";
    font-size: 17px;
    font-style: normal;
    font-weight: 300;
    line-height: 140%; /* 23.8px */
    letter-spacing: -0.34px;
  }
  .people-line-up .show-people-line-up {
    margin-top: 8px;
  }
  .people-line-up .show-people-line-up strong {
    color: #222;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 145%; /* 31.9px */
    letter-spacing: -0.88px;
  }
  .people-line-up .show-people-line-up .btn_more {
    display: none;
  }
  .people-line-up .dropdown-area {
    flex: 1;
  }
  .people-line-up .dropdown-area .list-area ul {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    column-gap: 24px;
    row-gap: 40px;
  }
  .people-line-up .dropdown-area .list-area ul li {
    padding: 10px 8px 10px 0;
    border-bottom: 1px solid #aaa;
  }
  .people-line-up .dropdown-area .list-area ul li button {
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .people-line-up .dropdown-area .list-area ul li span {
    display: block;
    color: #222;
    text-align: left;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%; /* 24px */
    letter-spacing: -0.6px;
  }
  .people-line-up .dropdown-area .list-area ul li strong {
    display: block;
    color: #222;
    text-align: left;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 160%; /* 24px */
    letter-spacing: -0.6px;
  }
  .people-line-up .dropdown-area .list-area ul li i {
    display: block;
    width: 16px;
    height: 16px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M13.3977 10.4H12.1977V4.64841L3.62187 13.2242L2.77344 12.3758L11.3492 3.79998H5.59766V2.59998H12.7977C13.129 2.59998 13.3977 2.8686 13.3977 3.19998V10.4Z' fill='%23222222'/%3E%3C/svg%3E") no-repeat center/16px;
  }
  #people_heoyejingojinseong-pc .right-area {
    margin-top: 64px;
  }
  #people_leeyongwon-pc .image-sub {
    top: 36px;
  }
  #profile_songchongofencing-pc {
    position: relative;
  }
  #profile_songchongofencing-pc .thumb {
    display: block;
    overflow: hidden;
    height: 889px;
    width: 100%;
    position: relative;
  }
  #profile_songchongofencing-pc .thumb .profile_image0 {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    max-width: unset;
    transition: all 0.1s linear;
  }
  .modal-interview {
    position: fixed;
    background: #FFFFFF;
    width: 100%;
    height: 90vh;
    z-index: 100;
    left: 0;
    bottom: 0;
    border-radius: 16px 16px 0 0;
    transition: all 0.4s ease-in-out;
    transform: translateY(100%);
    overflow: hidden;
    padding-bottom: 80px;
  }
  .modal-interview.active {
    transform: translateY(0);
  }
  .modal-interview.active + .dim {
    display: block;
  }
  .modal-interview article {
    height: 100%;
    overflow-y: auto;
  }
  .modal-interview article .head-area {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 80px 8px;
    border-bottom: 1px solid #EEE;
    margin-bottom: 24px;
  }
  .modal-interview article .head-area .pagination {
    color: #666;
    font-size: 28px;
    font-style: normal;
    line-height: 160%; /* 40px */
    letter-spacing: -1px;
  }
  .modal-interview article .head-area .pagination span {
    color: #222;
    margin-right: 4px;
    font-weight: 700;
  }
  .modal-interview article .head-area .name {
    color: #222;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 160%; /* 24px */
    letter-spacing: -0.6px;
  }
  .modal-interview article .head-area .name span {
    display: block;
    text-align: right;
  }
  .modal-interview article .head-area .name span:nth-of-type(1) {
    font-weight: 400;
  }
  .modal-interview article .interview-wrap {
    display: flex;
  }
  .modal-interview article .comment {
    width: 523px;
    padding: 313px 80px;
    display: flex;
    flex-shrink: 0;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
    color: #222;
    text-align: center;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 145%; /* 31.9px */
    letter-spacing: -0.88px;
    white-space: nowrap;
    background: #fff;
  }
  .modal-interview article .comment.fixed {
    position: fixed;
    top: 0;
    left: 0;
  }
  .modal-interview article .comment::before {
    content: "";
    display: block;
    margin: 0 auto 12px;
    width: 24px;
    height: 24px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M19.3053 5.5L16.3461 10.6113C16.4886 10.5322 16.6549 10.477 16.8451 10.446C17.0353 10.415 17.2251 10.3991 17.4145 10.3983C18.5672 10.3983 19.5363 10.7954 20.3218 11.5898C21.1073 12.3849 21.5 13.338 21.5 14.4491C21.5 15.5921 21.1073 16.5529 20.3218 17.3318C19.5363 18.1106 18.5672 18.5 17.4145 18.5C16.2939 18.5 15.333 18.1106 14.5319 17.3318C13.7307 16.5529 13.3301 15.5921 13.3301 14.4491C13.3301 14.0581 13.3787 13.6911 13.4759 13.3482C13.573 13.0054 13.7114 12.6817 13.8909 12.3772L17.89 5.5H19.3053ZM8.47517 5.5L5.51599 10.6101C5.65843 10.5317 5.82475 10.477 6.01495 10.446C6.20515 10.415 6.39493 10.3991 6.58431 10.3983C7.73702 10.3983 8.70612 10.7954 9.49161 11.5898C10.2771 12.3841 10.6699 13.3372 10.6699 14.4491C10.6699 15.6084 10.2771 16.5729 9.49161 17.3428C8.70612 18.1126 7.73702 18.4984 6.58431 18.5C5.46371 18.5 4.50284 18.1106 3.7017 17.3318C2.90057 16.5529 2.5 15.5921 2.5 14.4491C2.5 14.0581 2.54858 13.6911 2.64574 13.3482C2.74289 13.0054 2.88081 12.6817 3.05948 12.3772L7.0598 5.5H8.47517Z' fill='%23222222'/%3E%3C/svg%3E") no-repeat center/24px;
  }
  .modal-interview article .comment::after {
    content: "";
    display: block;
    margin: 12px auto 0;
    width: 24px;
    height: 24px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M4.69468 18.5L7.65386 13.3887C7.51142 13.4678 7.3451 13.523 7.1549 13.554C6.9647 13.585 6.77492 13.6009 6.58554 13.6017C5.43283 13.6017 4.46373 13.2046 3.67824 12.4102C2.89275 11.6151 2.5 10.662 2.5 9.55087C2.5 8.40794 2.89275 7.44706 3.67824 6.66824C4.46373 5.88941 5.43283 5.5 6.58554 5.5C7.70615 5.5 8.66701 5.88941 9.46815 6.66824C10.2693 7.44706 10.6699 8.40794 10.6699 9.55087C10.6699 9.94191 10.6213 10.3089 10.5241 10.6518C10.427 10.9946 10.2886 11.3183 10.1091 11.6228L6.11005 18.5H4.69468ZM15.5248 18.5L18.484 13.3899C18.3416 13.4683 18.1752 13.523 17.9851 13.554C17.7949 13.585 17.6051 13.6009 17.4157 13.6017C16.263 13.6017 15.2939 13.2046 14.5084 12.4102C13.7229 11.6159 13.3301 10.6628 13.3301 9.55087C13.3301 8.39161 13.7229 7.42706 14.5084 6.65722C15.2939 5.88737 16.263 5.50163 17.4157 5.5C18.5363 5.5 19.4972 5.88941 20.2983 6.66824C21.0994 7.44706 21.5 8.40794 21.5 9.55087C21.5 9.94191 21.4514 10.3089 21.3543 10.6518C21.2571 10.9946 21.1192 11.3183 20.9405 11.6228L16.9402 18.5H15.5248Z' fill='%23222222'/%3E%3C/svg%3E") no-repeat center/24px;
  }
  .modal-interview article .interview-script {
    margin-top: 32px;
    padding: 0 80px 0 0;
  }
  .modal-interview article .interview-script.fixed {
    padding-left: 523px;
  }
  .modal-interview article .interview-script p {
    color: #111;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 186%; /* 27.9px */
    letter-spacing: -0.6px;
  }
  .modal-interview article .interview-script p .name {
    display: inline-block;
    position: relative;
    margin-bottom: 8px;
    font-weight: 700;
  }
  .modal-interview article .interview-script p .name::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: #222;
  }
  .modal-interview article .interview-script .q {
    margin-bottom: 12px;
  }
  .modal-interview article .interview-script .a {
    text-indent: 50px;
    margin-bottom: 32px;
    font-weight: 400;
  }
  .modal-interview article .interview-script .a.not-indent {
    text-indent: 0;
  }
  .modal-interview article .interview-script figure {
    margin: 32px 0;
  }
  .modal-interview + .dim {
    background: rgba(0, 0, 0, 0.8);
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 99;
    top: 0;
    left: 0;
    display: none;
  }
  #interview0 figure {
    text-align: center !important;
  }
  #interview0 figure:nth-of-type(1) {
    width: 50% !important;
    margin: 0 auto 40px !important;
  }
  #interview1 figure {
    text-align: center;
  }
  #interview1 figure img {
    width: 50% !important;
  }
  #interview1 figure:nth-of-type(2) img {
    width: 240px !important;
  }
  #interview2 .interview-script figure:nth-of-type(1) {
    text-align: center !important;
  }
  #interview2 .interview-script figure:nth-of-type(1) img {
    width: 458px !important;
  }
  #interview2 .interview-script figure:nth-of-type(2) {
    text-align: center !important;
  }
  #interview2 .interview-script figure:nth-of-type(2) img {
    width: 260px !important;
  }
  #interview2 .interview-script figure:nth-of-type(3) {
    margin: 0 0 64px !important;
  }
  #interview2 .interview-script figure:nth-of-type(3) img {
    width: 100% !important;
  }
  #interview3 .interview-script figure {
    text-align: center !important;
  }
  #interview3 .interview-script figure img {
    width: 392px !important;
  }
  #interview3 .interview-script figure:nth-of-type(4) img {
    width: 520px !important;
  }
  #interview4 .interview-script figure {
    text-align: center !important;
  }
  #interview4 .interview-script figure:nth-of-type(1) img {
    width: 605px !important;
  }
  #interview4 .interview-script figure:nth-of-type(2) img {
    width: 302px !important;
  }
  #interview4 .interview-script figure:nth-of-type(3) img {
    width: 412px !important;
  }
  #interview5 .interview-script figure {
    text-align: center !important;
  }
  #interview5 .interview-script figure:nth-of-type(1) img {
    width: 404px !important;
  }
  #interview5 .interview-script figure:nth-of-type(2) img {
    width: 280px !important;
  }
  #interview6 .interview-script figure {
    text-align: center !important;
  }
  #interview6 .interview-script figure:nth-of-type(1) img {
    width: 605px !important;
  }
  #interview6 .interview-script figure:nth-of-type(2) img {
    width: 300px !important;
  }
  #interview6 .interview-script figure:nth-of-type(3) img {
    width: 100% !important;
  }
  #all-product-list {
    padding: 56px;
    border-top: 1px solid #343434;
    border-bottom: 1px solid #343434;
  }
  #all-product-list h3 {
    margin-bottom: 16px;
  }
  #all-product-list h4 {
    margin-bottom: 16px;
  }
  #all-product-list .fr-bff-products {
    width: 1176px;
    margin: 0 auto 100px;
    gap: 24px;
    justify-content: center;
  }
  .related-page {
    margin-top: 100px;
  }
  .related-page h3 {
    font-weight: 700;
    margin-bottom: 48px;
  }
  .related-page ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    column-gap: 16px;
    row-gap: 24px;
    width: 1176px;
    margin: 0 auto;
  }
  .related-page ul li {
    width: 30%;
  }
  .related-page ul li .title {
    padding: 16px 0;
  }
  .related-page ul li .title strong {
    display: block;
    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%; /* 24px */
    letter-spacing: -0.8px;
  }
  .related-page ul li .title span {
    color: #000;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 142%; /* 19.88px */
    letter-spacing: -0.7px;
    display: block;
    margin-top: 8px;
  }
  .store {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    margin: 48px 0;
    padding: 0 16px;
  }
  .store .thumb {
    width: 160px;
  }
  .store .title strong {
    display: block;
    color: #111;
    font-size: 24px;
    font-style: normal;
    font-weight: 800;
    line-height: 133%; /* 31.92px */
    letter-spacing: -0.48px;
    margin-bottom: 8px;
    white-space: nowrap;
  }
  .store .title span {
    display: block;
    color: #666;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 142%; /* 19.88px */
    letter-spacing: -0.28px;
  }
  .store .title .btn {
    border: 1px solid #ddd;
    border-radius: 500px;
    padding: 16px 32px;
    font-size: 15px;
    color: #111;
    font-weight: 700;
    margin-top: 16px;
  }
}
@media screen and (max-width: 1280px) {
  .only-mo {
    display: block;
  }
  .only-pc {
    display: none;
  }
  .top-section {
    position: relative;
  }
  .top-section h1 {
    width: 100%;
    position: absolute;
    top: 10px;
    padding-left: 20px;
    left: 50%;
    transform: translateX(-50%);
    text-align: left;
    z-index: 10;
    color: #FFF;
    font-family: "UniqloProRegular", sans-serif;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 133%; /* 31.92px */
    letter-spacing: -0.48px;
  }
  .top-section h1 strong {
    font-size: 64px;
    font-style: normal;
    font-weight: 400;
    line-height: 112%; /* 71.68px */
    letter-spacing: -1.28px;
  }
  .top-section h1 strong span {
    display: inline-block;
    transform: translateY(-10px);
  }
  .top-section .text-area {
    padding: 48px 16px;
    background: #121212;
  }
  .top-section .text-area p {
    color: #FFF;
    text-align: center;
    font-size: 15px;
    font-style: normal;
    font-weight: 300;
    line-height: 186%; /* 27.9px */
    letter-spacing: -0.6px;
  }
  #main-banner-slide .swiper-wrapper {
    aspect-ratio: 1/1.607;
  }
  #main-banner-slide .swiper-slide {
    width: 100%;
  }
  #main-banner-slide video {
    width: 100%;
    aspect-ratio: 1/1.607;
  }
  .people-line-up {
    background: #F8F2E2;
    padding: 48px 16px;
  }
  .people-line-up span {
    color: #222;
    font-family: "UniqloPro Regular";
    font-size: 17px;
    font-style: normal;
    font-weight: 300;
    line-height: 140%; /* 23.8px */
    letter-spacing: -0.34px;
  }
  .people-line-up .show-people-line-up {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-top: 8px;
  }
  .people-line-up .show-people-line-up strong {
    color: #222;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 145%; /* 31.9px */
    letter-spacing: -0.88px;
  }
  .people-line-up .show-people-line-up .btn_more {
    transition: all 0.4s;
  }
  .people-line-up .show-people-line-up.active .btn_more {
    transform: rotate(180deg);
  }
  .people-line-up .dropdown-area {
    margin-top: 20px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
  }
  .people-line-up .dropdown-area.active {
    max-height: 500px;
  }
  .people-line-up .dropdown-area .list-area ul li {
    padding: 10px 8px 10px 0;
    border-bottom: 1px solid #aaa;
  }
  .people-line-up .dropdown-area .list-area ul li button {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .people-line-up .dropdown-area .list-area ul li span {
    display: block;
    color: #222;
    text-align: left;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%; /* 24px */
    letter-spacing: -0.6px;
  }
  .people-line-up .dropdown-area .list-area ul li strong {
    display: block;
    color: #222;
    text-align: left;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 160%; /* 24px */
    letter-spacing: -0.6px;
  }
  .people-line-up .dropdown-area .list-area ul li i {
    display: block;
    width: 16px;
    height: 16px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M13.3977 10.4H12.1977V4.64841L3.62187 13.2242L2.77344 12.3758L11.3492 3.79998H5.59766V2.59998H12.7977C13.129 2.59998 13.3977 2.8686 13.3977 3.19998V10.4Z' fill='%23222222'/%3E%3C/svg%3E") no-repeat center/16px;
  }
  section {
    padding-top: 48px;
  }
  section .inner-contents {
    padding: 0 16px;
  }
  section .profile {
    margin-top: 12px;
    text-align: right;
    color: #222;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%; /* 24px */
    letter-spacing: -0.6px;
  }
  section .profile span {
    display: block;
  }
  section .profile strong {
    display: block;
    font-weight: 700;
  }
  section .profile .people-image {
    position: relative;
    margin: 16px auto 16px -16px;
  }
  section .profile .people-image button {
    background: rgba(255, 255, 255, 0.8);
    color: #222;
    display: inline-flex;
    height: 28px;
    padding: 4px 12px;
    justify-content: center;
    align-items: center;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 133%; /* 15.96px */
    letter-spacing: -0.48px;
    position: absolute;
    left: 12px;
    bottom: 12px;
    z-index: 10;
  }
  section .profile .desc {
    color: #222;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 186%; /* 27.9px */
    letter-spacing: -0.6px;
    margin-top: 15px;
    margin-bottom: 8px;
    text-align: left;
  }
  section .show-interview {
    width: 100%;
    padding: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #222;
    color: #222;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 160%; /* 24px */
    letter-spacing: -0.6px;
  }
  section .product {
    position: relative;
    margin-top: 32px;
    transition: all 0.5s;
    padding: 0 0 24px;
    min-height: 100vw;
    box-sizing: content-box;
  }
  section .product * {
    transition: all 0.5s;
  }
  section .product figure {
    width: 100%;
    position: absolute;
    order: 2;
  }
  section .product .product-name {
    opacity: 0;
    width: 50%;
    color: #222;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 145%; /* 31.9px */
    letter-spacing: -0.88px;
    transition-delay: 0.4s;
    transform: translateY(30px);
    order: 1;
  }
  section .product .desc {
    opacity: 0;
    margin-top: 16px;
    color: #222;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%; /* 24px */
    letter-spacing: -0.6px;
    transition-delay: 0.5s;
    transform: translateY(30px);
  }
  section .product .btn_link {
    opacity: 0;
    width: 100%;
    margin-top: 24px;
    transition-delay: 0.6s;
    transform: translateY(30px);
  }
  section .product.active {
    padding: 0 16px 48px;
    height: auto;
    min-height: unset;
  }
  section .product.active .wrap {
    display: flex;
    align-items: flex-end;
    gap: 16px;
  }
  section .product.active .wrap figure {
    width: 50%;
    position: static;
  }
  section .product.active .wrap .product-name {
    opacity: 1;
    transform: translateY(0);
  }
  section .product.active .desc {
    opacity: 1;
    transform: translateY(0);
  }
  section .product.active .btn_link {
    opacity: 1;
    transform: translateY(0);
  }
  section #profile_songchongofencing {
    position: relative;
  }
  section #profile_songchongofencing .thumb {
    overflow: hidden;
    height: 539px;
    width: 100%;
    position: relative;
  }
  section #profile_songchongofencing .thumb .profile_image0 {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    max-width: unset;
    transition: all 0.1s linear;
  }
  section.typeR {
    background: #F8F2E2;
  }
  section.typeR h2 {
    text-align: right;
  }
  section.typeR .profile {
    text-align: left;
  }
  section.typeR .people-image {
    margin: 16px -16px 16px auto;
  }
  section.typeR .product .wrap figure {
    order: 1;
  }
  section.typeR .product .wrap .product-name {
    order: 2;
  }
  .modal-interview {
    position: fixed;
    background: #FFFFFF;
    width: 100%;
    height: calc(100% - 80px);
    z-index: 100;
    left: 0;
    bottom: 0;
    overflow: hidden;
    border-radius: 16px 16px 0 0;
    transition: all 0.4s ease-in-out;
    transform: translateY(100%);
  }
  .modal-interview.active {
    transform: translateY(0);
  }
  .modal-interview.active + .dim {
    display: block;
  }
  .modal-interview article {
    height: 100%;
    overflow-y: auto;
  }
  .modal-interview article .head-area {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 24px 16px 8px;
    border-bottom: 1px solid #EEE;
    margin-bottom: 24px;
  }
  .modal-interview article .head-area .pagination {
    color: #666;
    font-size: 25px;
    font-style: normal;
    line-height: 160%; /* 40px */
    letter-spacing: -1px;
  }
  .modal-interview article .head-area .pagination span {
    font-weight: 700;
    color: #222;
    margin-right: 4px;
  }
  .modal-interview article .head-area .name {
    color: #222;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 160%; /* 24px */
    letter-spacing: -0.6px;
  }
  .modal-interview article .head-area .name span {
    display: block;
    text-align: right;
  }
  .modal-interview article .comment {
    color: #222;
    text-align: center;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 145%; /* 31.9px */
    letter-spacing: -0.88px;
  }
  .modal-interview article .comment::before {
    content: "";
    display: block;
    margin: 0 auto 12px;
    width: 24px;
    height: 24px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M19.3053 5.5L16.3461 10.6113C16.4886 10.5322 16.6549 10.477 16.8451 10.446C17.0353 10.415 17.2251 10.3991 17.4145 10.3983C18.5672 10.3983 19.5363 10.7954 20.3218 11.5898C21.1073 12.3849 21.5 13.338 21.5 14.4491C21.5 15.5921 21.1073 16.5529 20.3218 17.3318C19.5363 18.1106 18.5672 18.5 17.4145 18.5C16.2939 18.5 15.333 18.1106 14.5319 17.3318C13.7307 16.5529 13.3301 15.5921 13.3301 14.4491C13.3301 14.0581 13.3787 13.6911 13.4759 13.3482C13.573 13.0054 13.7114 12.6817 13.8909 12.3772L17.89 5.5H19.3053ZM8.47517 5.5L5.51599 10.6101C5.65843 10.5317 5.82475 10.477 6.01495 10.446C6.20515 10.415 6.39493 10.3991 6.58431 10.3983C7.73702 10.3983 8.70612 10.7954 9.49161 11.5898C10.2771 12.3841 10.6699 13.3372 10.6699 14.4491C10.6699 15.6084 10.2771 16.5729 9.49161 17.3428C8.70612 18.1126 7.73702 18.4984 6.58431 18.5C5.46371 18.5 4.50284 18.1106 3.7017 17.3318C2.90057 16.5529 2.5 15.5921 2.5 14.4491C2.5 14.0581 2.54858 13.6911 2.64574 13.3482C2.74289 13.0054 2.88081 12.6817 3.05948 12.3772L7.0598 5.5H8.47517Z' fill='%23222222'/%3E%3C/svg%3E") no-repeat center/24px;
  }
  .modal-interview article .comment::after {
    content: "";
    display: block;
    margin: 12px auto 0;
    width: 24px;
    height: 24px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M4.69468 18.5L7.65386 13.3887C7.51142 13.4678 7.3451 13.523 7.1549 13.554C6.9647 13.585 6.77492 13.6009 6.58554 13.6017C5.43283 13.6017 4.46373 13.2046 3.67824 12.4102C2.89275 11.6151 2.5 10.662 2.5 9.55087C2.5 8.40794 2.89275 7.44706 3.67824 6.66824C4.46373 5.88941 5.43283 5.5 6.58554 5.5C7.70615 5.5 8.66701 5.88941 9.46815 6.66824C10.2693 7.44706 10.6699 8.40794 10.6699 9.55087C10.6699 9.94191 10.6213 10.3089 10.5241 10.6518C10.427 10.9946 10.2886 11.3183 10.1091 11.6228L6.11005 18.5H4.69468ZM15.5248 18.5L18.484 13.3899C18.3416 13.4683 18.1752 13.523 17.9851 13.554C17.7949 13.585 17.6051 13.6009 17.4157 13.6017C16.263 13.6017 15.2939 13.2046 14.5084 12.4102C13.7229 11.6159 13.3301 10.6628 13.3301 9.55087C13.3301 8.39161 13.7229 7.42706 14.5084 6.65722C15.2939 5.88737 16.263 5.50163 17.4157 5.5C18.5363 5.5 19.4972 5.88941 20.2983 6.66824C21.0994 7.44706 21.5 8.40794 21.5 9.55087C21.5 9.94191 21.4514 10.3089 21.3543 10.6518C21.2571 10.9946 21.1192 11.3183 20.9405 11.6228L16.9402 18.5H15.5248Z' fill='%23222222'/%3E%3C/svg%3E") no-repeat center/24px;
  }
  .modal-interview article .interview-script {
    margin-top: 32px;
    padding: 0 16px;
  }
  .modal-interview article .interview-script p {
    color: #111;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 186%; /* 27.9px */
    letter-spacing: -0.6px;
  }
  .modal-interview article .interview-script p .name {
    display: inline-block;
    position: relative;
    margin-bottom: 8px;
  }
  .modal-interview article .interview-script p .name::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: #222;
  }
  .modal-interview article .interview-script .q {
    margin-bottom: 12px;
  }
  .modal-interview article .interview-script .a {
    text-indent: 50px;
    margin-bottom: 32px;
    font-weight: 400;
  }
  .modal-interview article .interview-script .a.not-indent {
    text-indent: 0;
  }
  .modal-interview article .interview-script figure {
    margin: 32px 0;
  }
  .modal-interview + .dim {
    background: rgba(0, 0, 0, 0.8);
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 99;
    top: 0;
    left: 0;
    display: none;
  }
  #all-product-list h3 {
    margin-bottom: 16px;
  }
  #all-product-list h4 {
    margin-bottom: 16px;
  }
  #all-product-list .fr-bff-products {
    margin-bottom: 64px;
    justify-content: center;
    gap: 8px;
  }
  .related-page {
    margin-top: 40px;
  }
  .related-page h3 {
    margin-bottom: 16px;
  }
  .related-page ul {
    display: grid;
    row-gap: 24px;
    grid-template-columns: 1fr 1fr;
  }
  .related-page ul li:nth-child(2n) .title {
    padding-left: 0;
  }
  .related-page ul li .title {
    padding: 16px;
  }
  .related-page ul li .title strong {
    display: block;
    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%; /* 24px */
    letter-spacing: -0.8px;
  }
  .related-page ul li .title span {
    color: #000;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 142%; /* 19.88px */
    letter-spacing: -0.7px;
    display: block;
    margin-top: 8px;
  }
  .store {
    display: flex;
    gap: 12px;
    align-items: center;
    margin: 48px 0;
    padding: 0 16px;
  }
  .store .thumb {
    flex: 1;
  }
  .store .title {
    flex: 1;
  }
  .store .title strong {
    display: block;
    color: #111;
    font-size: 24px;
    font-style: normal;
    font-weight: 800;
    line-height: 133%; /* 31.92px */
    letter-spacing: -0.48px;
    margin-bottom: 8px;
    white-space: nowrap;
  }
  .store .title span {
    display: block;
    color: #666;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 142%; /* 19.88px */
    letter-spacing: -0.28px;
  }
  .store .title .btn {
    border: 1px solid #ddd;
    border-radius: 500px;
    padding: 16px 32px;
    font-size: 15px;
    color: #111;
    font-weight: 700;
    margin-top: 16px;
  }
}

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