@charset "UTF-8";.page-hero{height:auto;aspect-ratio:1080/540}@media screen and (min-width: 1024px){.page-hero{aspect-ratio:1920/700}}.page-hero:after{background:linear-gradient(to bottom,#000000d9,#0000 25%,#0000 75%,#0000)}.grand-view-show{width:100%;position:relative;background:#ebebeb;padding-top:.25rem}@media screen and (min-width: 1024px){.grand-view-show{padding-block:16px 80px;overflow-x:hidden}}.project-detail{display:flex;flex-direction:column;width:100%;margin:0 auto}@media screen and (min-width: 1024px){.project-detail{flex-direction:column}}.project-detail__left{width:42.5%;padding-left:48px;padding-block:120px 48px;max-height:100vh;display:none;flex-direction:column;justify-content:space-between;flex-shrink:0;will-change:transform}.project-detail__left.mobile{display:block}@media screen and (min-width: 1024px){.project-detail__left.mobile{display:none}.project-detail__left{display:flex}}.project-detail:has(.project-social) .project-detail__left{padding-bottom:100px}.project-detail__desc{font-size:clamp(16px,1vw,24px);line-height:1.8;letter-spacing:.2em}.project-detail__desc.mobile{font-size:clamp(14px,.9vw,24px);margin:4rem 2rem 6rem}@media screen and (min-width: 1024px){.project-detail__desc.mobile{margin:0;display:none}}@media screen and (min-width: 1024px){.project-detail{flex-direction:row}.project-detail__right{width:57.5%;flex-shrink:0;display:flex;flex-direction:column}}.project-detail__title-img{width:100%;max-width:140px;-o-object-fit:contain;object-fit:contain;display:none}@media screen and (min-width: 1024px){.project-detail__title-img{display:block}}.project-detail__title-img.mobile{display:block;max-width:160px;margin-bottom:24px}@media screen and (min-width: 1024px){.project-detail__title-img.mobile{display:none}}.project-detail__slogan{font-size:clamp(16px,1.2vw,24px);letter-spacing:.2em}.project-detail__name-container{display:block;margin:4rem 2rem 2rem}@media screen and (min-width: 1024px){.project-detail__name-container{display:none}}.project-detail__sliders{display:flex;flex-direction:column;width:100%;gap:.25rem}@media screen and (min-width: 1024px){.project-detail__sliders{gap:16px}}.project-detail__video{width:100%;padding-top:.25rem}@media screen and (min-width: 1024px){.project-detail__video{padding-top:1rem}}.project-video{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background-color:#000}.project-video iframe{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border:none}.project-video--desktop{display:none}@media screen and (min-width: 1024px){.project-video--desktop{display:block}}.project-video--mobile{display:block}@media screen and (min-width: 1024px){.project-video--mobile{display:none}}.project-video--mobile.project-video--portrait{aspect-ratio:9/16}.swiper-container-wrapper{position:relative;width:100%;box-shadow:0 10px 30px #0000001a}.project-swiper{width:100%;overflow:hidden}.project-swiper__img-container{width:100%;position:relative;aspect-ratio:16/10;background-color:#ddd;overflow:hidden}.project-swiper__img-container img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:transform 1s ease}.project-swiper__caption{position:absolute;bottom:18px;left:24px;z-index:10;color:#fff;font-size:10px;line-height:1.4;text-shadow:0 1px 4px rgba(0,0,0,.6);max-width:30%;display:-webkit-box;-webkit-line-clamp:2}@media screen and (min-width: 768px){.project-swiper__caption{font-size:12px}}@media screen and (min-width: 1024px){.project-swiper__caption{bottom:16px;left:16px}}.project-swiper-pagination{position:absolute;bottom:24px!important;right:24px!important;left:auto!important;width:auto!important;z-index:10;display:flex;gap:14px}@media screen and (min-width: 1024px){.project-swiper-pagination{gap:10px}}.project-swiper-pagination .swiper-pagination-bullet{width:7px;height:7px}@media screen and (min-width: 1024px){.project-swiper-pagination .swiper-pagination-bullet{width:5px;height:5px}}.swiper-pagination-bullet{background-color:#fff6;opacity:1;transition:all .3s ease;cursor:pointer;margin:0!important}.swiper-pagination-bullet:hover{background-color:#ffffffe6}.swiper-pagination-bullet-active{background-color:#fff}.project-info{display:grid;grid-template-columns:1fr;font-family:"Noto Serif TC";margin-inline:2rem}@media screen and (min-width: 768px){.project-info{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width: 1024px){.project-info{margin:60px 0 0;padding-bottom:48px}}.project-info__item{padding-block:40px;border-bottom:1px solid #c0c1c1;gap:12px}@media screen and (min-width: 768px){.project-info__item{padding-block:48px}.project-info__item:nth-child(odd):not(.project-info__item--full){border-right:1px solid #9fa0a0;padding-right:40px}.project-info__item:nth-child(2n):not(.project-info__item--full){padding-left:40px}}@media screen and (min-width: 1024px){.project-info__item{padding:48px 0}}.project-info__item--full{grid-column:1/-1;border-right:none!important;padding-left:0!important;padding-right:0!important}.project-info__item--no-border{border-bottom:none}.project-info__label{margin-bottom:1rem;color:#282823;letter-spacing:.1em;line-height:2;display:block;font-size:13px;font-weight:400}@media screen and (min-width: 1024px){.project-info__label{font-size:14px;font-weight:500}}.project-info__value{font-size:clamp(18px,1.1458333333vw,22px);color:#681015;font-weight:500;letter-spacing:.08em;line-height:1.5}.project-info__icon{width:14px;fill:#c8a57d;display:inline-flex;vertical-align:middle}.project-social{display:flex;align-items:center;gap:16px}@media screen and (min-width: 1024px){.project-social{padding-top:8px}}.project-social__btn{width:40px;height:40px;border-radius:50%;background-color:#cea277;display:flex;align-items:center;justify-content:center;font-size:20px;border:1px solid #cea277;transition:all .3s cubic-bezier(.25,.46,.45,.94)}@media screen and (min-width: 1024px){.project-social__btn{background-color:#681015;border:1px solid #681015}}.project-social__btn-icon{fill:#ebebeb;width:50%;height:50%;transition:all .3s cubic-bezier(.25,.46,.45,.94)}.project-social__btn:hover,.project-social__btn:focus{background-color:var(--custom03);color:#cea277;transform:translateY(-4px);box-shadow:0 4px 12px #68101533}@media screen and (min-width: 1024px){.project-social__btn:hover,.project-social__btn:focus{color:#681015}}.project-social__btn:hover .project-social__btn-icon,.project-social__btn:focus .project-social__btn-icon{fill:#cea277}@media screen and (min-width: 1024px){.project-social__btn:hover .project-social__btn-icon,.project-social__btn:focus .project-social__btn-icon{fill:#681015}}
