/* 取消用户选择文字 */
* {
    user-select: none;
}
#root .pc-content {
    display: none;
}
#root .mobile-content {
    display: block;
}
#root .header {
    padding: 0 20px;
    z-index: 1002;
}
#root .side-menu {
    width: 100%;
    height: 620px;
    background: rgba(18, 18, 18, 0.8);
    backdrop-filter: blur(10px);
    left: 0;
    top: -620px;
}

#root .menu-box {
    padding: 105px 0;
}
#root .menu-box-icon {
    left: 19px;
    top: 23px;
}
#root .sub-menu-box-item .menu-box-item-text {
    padding-right: 32px;
    position: relative;
}
#root .sub-menu-item {
    margin-left: 0;
}
#root .menu-box-item-icon {
    top: 4px;
    right: 0;
}
#root .menu-box-item,
#root .sub-menu-box-item {
    text-align: center;
}
#root .side-menu .menu-footer-social {
    bottom: 30px;
    width: 170px;
    display: inline-flex;
    align-items: flex-start;
    gap: 30px;
    margin: 0 auto;
    left: 50%;
    transform: translate(-50%, 0);
}
#root .menu-footer-social .footer-social-icon {
    width: 20px;
    height: 20px;
    padding-left: 0;
    margin-right: 0;
    opacity: 0.8;
}

#root .menu-footer-social .footer-social-icon span {
    display: none;
}
#root .lang {
    right: 5px;
}
#root .index-content-box {
    width: 100%;
    left: 0;
    top: 0;
}

#root .sculpture-box {
    width: 100%;
    /* height: 60%; */
    position: relative;
    top: 30%;
}
#root .toki {
    height: 83%;
    margin-right: -190px;
    left: -30px;
}
#root .shu {
    height: 83%;
    position: relative;
    right: -5px;
}
#root .index-text-box {
    height: 100%;
    width: 100%;
    top: 55%;
}
#root .index-mooze {
    color: var(--Background-White, #fff);
    font-family: 'Playfair Display';
    width: 100%;
    height: 45px;
    line-height: 45px;
    text-align: center;
    font-size: 40px;
    font-weight: 600;
    letter-spacing: 8px;
    background: none;
    top: 22%;
}
#root .striped-background::after {
    display: none;
}

#root .page-content-text {
    width: 100%;
    top: 30%;
    font-size: 14px;
}
#root .page2-text-1 {
    padding-bottom: 28px;
}
#root .page2-text {
    margin-bottom: 0;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0.28px;
}
#root .page-content-3 {
    width: 100%;
    display: block;
    padding: 0;
}
#root .page3-sculpture {
    width: calc(100% - 64px);
    margin: 0 32px;
    height: 220px;
}
#root .page-content-3-text {
    width: calc(100% - 64px);
    margin: 0 32px;
    text-align: left;
    padding-bottom: 28px;
}
#root .page-content-3-text-1 {
    font-size: 16px;
    letter-spacing: 0.64px;
    padding-bottom: 5px;
}
#root .page-content-3-text-2 {
    font-size: 14px;
    letter-spacing: 0.56px;
}
#root .page-content-3 .guide-box-arrow {
    top: -17px;
}
#root .guide-box-row {
    width: 55px;
}
#root .guide-box-arrow {
    height: 55px;
}
#root .page3-text {
    bottom: 49px;
    left: 16px;
    font-size: 14px;
    letter-spacing: 0.56px;
}
#root .page3-bottom-box {
    height: auto;
    bottom: 40px;
    right: 16px;
}
#root .page3-bg-text {
    top: 40%;
    width: 276px;
    height: 420px;
    background-image: url('../image/mobile/toki-bg.png');
}
#root .page-content-4 {
    display: block;
    padding-bottom: 0;
}
#root .page-content-4 svg {
    width: 32px;
    height: 24px;
}
#root .index-toki-4 {
    width: 240px;
    margin: 0 32px 12px;
    height: 168px;
}
#root .page-content-4 .vertical-text-box {
    width: calc(100% - 64px);
    margin: 0 32px;
    font-size: 14px;
    gap: 12px;
}
#root .page-content-5 {
    width: calc(100% - 64px);
    height: 177px;
    margin: 100px 32px 120px;
}
#root .index-shu-2-text {
    left: 0;
    bottom: -54px;
}
#root .page5-text-1 {
    font-size: 14px;
    letter-spacing: 0.56px;
    margin-bottom: 6px;
}
#root .page5-text-2 {
    font-size: 12px;
    letter-spacing: 0.48px;
}
#root .page-content-5 .guide-box-arrow {
    right: 0;
    bottom: -55px;
}
#root .page-content-6 {
    flex-direction: column;
    align-items: flex-end;
    padding: 0 32px 100px;
}
#root .index-shu-3 {
    width: 240px;
    height: 166px;
}
#root .page-content-6 {
    gap: 12px;
}
#root .page-content-6 .vertical-text-box {
    font-size: 14px;
    line-height: 24px;
    gap: 12px;
}
#root .page-content-6 svg {
    width: 32px;
    height: 24px;
}
#root .page-content-7 {
    padding: 0 32px 120px;
}
#root .page-content-7-zipic {
    width: 100%;
    height: auto;
    aspect-ratio: 326 / 460;
}

#root .footer {
    padding: 16px;
    /* margin-top:200px; */
}
#root .footer-links {
    justify-content: center;
    gap: 24px;
}
#root .footer-link {
    margin: 0;
}
#root .footer-box {
    margin-bottom: 25px;
}
#root .footer-lang {
    display: none;
}
#root .footer-link-box {
    display: block;
}
#root .footer-link:nth-of-type(2) {
    margin-right: 0;
}
#root .footer-link:nth-of-type(2)::before {
    display: none;
}
#root .footer-social-box {
    width: 100%;
    align-items: flex-start;
    gap: 30px;
    justify-content: center;
}
#root .page-about {
    overflow: hidden;
    height: calc(100vh + 150px);
}
#root .page-about::after {
    right: -46%;
    top: 38%;
    width: 100%;
    height: 100%;
    transform: scale(1.3);
    background-image: url('../image/product-main-sculpture.png');
    opacity: 0.15;
}
#root .page-about-content {
    width: 100%;
}
#root .page-about-content-text {
    width: 100%;
    height: 100%;
    padding: 0 45px;
}
#root .page-product-detial {
    height: 105vh;
    overflow: hidden;
}
#root .page-product-detial-sculpture-box {
    width: 100vw;
    height: 100%;
    margin: 0 auto;
    position: relative;
}
#root .page-about-content-text-title {
    font-size: 24px;
    margin-bottom: 20px;
}
#root .page-about-content-text-content {
    font-size: 14px;
}
@media screen and (max-width: 600px) {
    #root .page-product-detial-sculpture-1 {
        /* height: calc(50vh);
    width: calc(50vh * (309 / 413));  */
        width: 309px;
        height: 413px;
        background-image: url('../image/sculpture-copper.png');
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        position: absolute;
        bottom: -2.2%;
        left: -100px;
    }
    #root .page-product-detial-sculpture-2 {
        /* height: calc(65vh); 
    width: calc((65vh) * (252 / 494));  */
        width: 252px;
        height: 494px;
        background-image: url('../image/sculpture-sliver.png');
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        position: absolute;
        bottom: -4.5%;
        right: -74px;
    }
}

@media screen and (min-width: 600px) and (max-width: 1199px) {
    #root .page-product-detial-sculpture-1 {
        /* height: calc(60vh);
    width: calc(60vh * (309 / 413));  */
        width: 309px;
        height: 413px;
        background-image: url('../image/sculpture-copper.png');
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        position: absolute;
        bottom: -2.2%;
        left: -100px;
    }
    #root .page-product-detial-sculpture-2 {
        /* height: calc(70vh); 
    width: calc((70vh) * (252 / 494));  */
        width: 252px;
        height: 494px;
        background-image: url('../image/sculpture-sliver.png');
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        position: absolute;
        bottom: -4.5%;
        right: -65px;
    }
}

#root .page-product-detial-text-box {
    position: absolute;
    width: 320px;
    height: 230px;
    top: 35%;
    left: 50%;
    transform: translate(-50%, -50%);
}
#root .page-product-detial-bg {
    height: 50px; /* 高度为视窗高度的 11.25% */
    width: 315px; /* 宽度按等比缩放，基于高度的比例 */
    background-image: url('../image/detail-toki.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    top: 28%;
    left: 50%;
    transform: translate(-50%, -22%); /* 水平和垂直居中 */
}
#root .page-product-detial-text {
    position: absolute;
    color: #fff;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
    letter-spacing: 5px;
    font-size: 28px;
    line-height: 36px;
}
#root .page-product-detial-info-2 {
    margin-top: 0;
    height: 700px;
}
#root .page-product-detial-info-1-text {
    width: 100%;
    padding: 0 45px;
    font-size: 14px;
    line-height: 150%;
}
#root .page-product-detial-info-2-pic-1 {
    width: 198px;
    height: 305px;
    top: -145px;
}
#root .page-product-detial-info-2-pic-2 {
    width: 132px;
    height: 180px;
    bottom: -50%;
    left: -14vw;
}
#root .page-product-detial-info-2-pic-3 {
    width: 100px;
    height: 152px;
    top: 63%;
    right: -16vw;
}

#root .page-product-detial-info-2-text {
    width: 255px;
    left: 50%;
    top: 168%;
    transform: translate(-50%, 0);
}
#root .lang-en .page-product-detial-info-2-text-en-lang {
    width: 300px;
    left: 50%;
    top: 168%;
    transform: translate(-50%, 0);
    margin-left: 0;
}
#root .lang-en .page-product-detial-info-2-text-title {
    margin-left: 0;
}
#root .page-product-detial-info-2-text-content-item:last-child {
    margin-left: 0;
}
#root .page-product-detial-info-3 {
    width: 368px;
    height: 440px;
    padding: 0 0 65px;
    overflow: hidden;
}
#root .page-product-detial-info-3-item {
    flex: 1 1 calc(50% - 6px);
}
#root .page-product-detial-info-3-item-text {
    font-size: 11px;
}
#root .page-product-detial-info-3-item:hover {
    transform: translateY(0);
}
#root .page-product-detial-info-4 {
    height: 920px;
}
#root .lang-cn .page-product-detial-info-4 {
    height: 600px;
}
#root .lang-jp .page-product-detial-info-4 {
    height: 780px;
}
#root .page-product-detial-info-4-content {
    width: 100vw;
    margin: 0 auto;
    padding: 0 45px;
}
#root .page-product-detial-info-3-item-text-name {
    margin-right: 0;
}
#root .page-product-detial-info-3-item-pic {
    margin-bottom: 0;
}
#root .page-product-detial-info-3-item-text-name-pc {
    display: none;
}
#root .page-product-detial-info-3-item-text-name-mobile {
    display: inline-block;
}
#root .page-product-detial-info-5 {
    overflow: hidden;
    height: 630px;
}
#root .page-product-detial-info-5-content {
    height: 100%;
}
#root .page-product-detial-info-5-sculpture {
    width: 379px;
    height: 572px;
    margin: 0 auto;
}
#root .page-product-detial-info-5-bg {
    width: 415px;
    height: 295px;
    margin: 0 auto;
    background-image: url(../image/mobile/detial-info-5-bg.png);
    top: 47%;
}
#root .page-product-detial-info-6 {
    height: 1130px;
}
#root .page-product-detial-info-6-part-1-box,
#root .page-product-detial-info-6-part-2,
#root .page-product-detial-info-6-part-2-overflow-box {
    padding: 0 24px;
    width: 100%;
}
#root .page-product-detial-info-6-part-overflow {
    width: 100%;
}
#root .page-product-detial-info-6-sculpture,
#root .page-product-detial-info-6-sculpture-2,
#root .page-product-detial-info-6-sculpture-3,
#root .page-product-detial-info-6-sculpture-1 {
    padding: 0 0 20px;
    width: 342px;
    height: 258px;
    margin: 0 auto;
    background: none;
    margin-bottom: 0;
}
#root .page-product-detial-info-6-sculpture-1 {
    width: 152px;
    margin: 0 12px 0 0;
}
#root .page-product-detial-info-6-sculpture img {
    width: 100%;
    height: 100%;
}
#root .page-product-detial-info-6-sculpture-3 {
    left: 0;
}
#root .page-product-detial-info-6-sculpture-box {
    width: 342px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: auto;
}
#root .page-product-detial-info-6-sculpture-2-text {
    width: 177px;
}
#root .page-product-detial-info-6-text-item-title {
    color: rgba(255, 255, 255, 0.8);
    font-size: 12px;
    font-weight: 400;
    line-height: 150%;
}
#root .page-product-detial-info-6-text-item-content {
    color: rgba(255, 255, 255, 0.4);
    font-size: 10px;
    font-weight: 400;
    line-height: 150%;
}
#root .page-product-detial-info-7-text-icon {
    top: 8px;
}
#root .page3-bottom-text {
    font-size: 14px;
}

#root .page-product-detial-info-7 {
    width: 100vw;
    height: 650px;
    padding: 0 24px;
    overflow: hidden;
}
#root .page-product-detial-info-7-pic-box {
    width: 100%;
    height: 500px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    flex-shrink: 0;
    max-width: 740px;
}
#root .page-product-detial-info-7-text {
    font-size: 14px;
    padding: 50px 0 0;
    width: 100%;
}
#root .page-product-detial-info-7-text-link {
    width: 115px;
    height: 38px;
    padding: 6px 20px 6px 30px;
}

#root .page-product-explain-box {
    width: calc(100% - 68px);
    margin: 0 auto;
    height: 80vh;
    box-sizing: border-box;
    background-color: #191818;
}
#root .page-product-explain-box.show {
    bottom: -10px;
}
#root .page-product-shop-size-item-size {
    font-size: 10px;
}
#root .page-product-explain-box-title {
    color: rgba(255, 255, 255, 0.9);
    font-family: 'MS Mincho';
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
#root .page-product-explain-box-content {
    height: 90%;
    color: rgba(255, 255, 255, 0.7);
    font-family: 'MS Mincho';
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px; /* 157.143% */
}
#root .page-product-main-sculpture {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 430px;
    height: 500px;
    transform: translate(-50%, -50%);
    z-index: 101;
    display: none;
}
#root .main {
    height: auto;
}
#root .page-product-main-sculpture-link {
    display: none;
}
#root .page-product-explain-box {
    padding: 40px 24px;
}
#root .page-product-shop {
    height: 100%;
}
#root .page-product-shop-box {
    width: 100%;
    height: 100%;
    display: block;
}
#root .page-product-main-sculpture-angle {
    position: relative;
    left: 0;
    transform: translate(0, 0);
    bottom: 0;
    top: 130px;
    margin: 0 auto;
}
#root .page-product-show {
    width: 100%;
    height: 265px;
    position: static;
}
#root .page-product-shop-box-content {
    width: 100%;
    height: 500px;
}
#root .page-product-shop-type {
    width: 100vw;
    margin: 0 auto;
    padding: 0 38px;
    position: relative;
    right: 0;
    top: 0;
    transform: translate(0, 0);
}
#root .page-product-shop-type-name {
    font-size: 28px;
    font-weight: 800;
    letter-spacing: 2.8px;
}
#root .page-product-shop-type-describe {
    font-size: 14px;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.28px;
}
#root .page-product-shop-texture-name {
    font-size: 16px;
}
#root .page-product-shop-texture-item {
    width: 148px;
}
#root .page-product-shop-size-item {
    width: 148px;
}
#root .page-product-shop-texture-item-text {
    font-size: 14px;
    letter-spacing: 0.28px;
}
#root .page-product-shop-size-item-name {
    font-size: 14px;
    letter-spacing: 0.28px;
}
#root .page-product-shop-size-item :nth-child(2) {
    width: 168px;
}
#root .page-product-shop-price {
    margin: 0 36px;
    width: calc(430px - 110px);
    padding: 40px 0 0;
    left: calc(50% - 36px);
    transform: translate(-50%, 0);
}
#root .page-product-shop-price-text strong,
#root .page-product-shop-price-text-symbol {
    font-size: 20px;
}
#root .page-product-shop-price-text-unit {
    font-size: 12px;
}
#root .page-product-shop-buy-btn {
    font-size: 14px;
    height: 40px;
    line-height: 14px;
    padding: 12px 22px 14px 21px;
}

#root .page-product-detial-info-7-pic-1,
#root .page-product-detial-info-7-pic-2,
#root .page-product-detial-info-7-pic-3,
#root .page-product-detial-info-7-pic-4,
#root .page-product-detial-info-7-pic-5 {
    width: 126px;
    height: 400px;
}

#root .page-product-detial-info-7-pic-box {
    flex-direction: column; /* 垂直布局 */
}

#root .page-product-detial-info-7-pic-1,
#root .page-product-detial-info-7-pic-2,
#root .page-product-detial-info-7-pic-3,
#root .page-product-detial-info-7-pic-4,
#root .page-product-detial-info-7-pic-5 {
    flex: 1 1 100%; /* 每张图片占据整行宽度 */
    height: auto; /* 高度自动调整 */
    max-width: 100%; /* 确保图片占满容器宽度 */
    margin-bottom: 10px; /* 添加下方间距 */
}

/* shu */
#root .introduce-shu-main-scene-sculpture {
    height: 100vh;
    background-position: 58% 50%;
}
#root .introduce-shu-main-scene-left-light {
    width: 100vw;
    height: 100vh;
    background-image: url(../image/intrduce-shu-light-mobile.png);
}
#root .introduce-shu-main-scene-right-light {
    display: none;
}
#root .introduce-shu-main-scene-text-1 {
    width: 216px;
    height: 60px;
}
#root .introduce-shu-main-scene-text-2 {
    font-size: 40px;
}
#root .introduce-shu-main-scene-text-box {
    bottom: 30px;
}
#root .introduce-shu-main-scene-text-box-2 {
    font-size: 14px;
    line-height: 24px;
    padding: 0 40px;
}
#root .introduce-shu-2 {
    padding-bottom: 88px;
}
#root .introduce-shu-2-sculpture-box {
    width: calc(100% - 48px);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin: 0 24px;
    height: auto;
}
#root .introduce-shu-2-sculpture-1,
#root .introduce-shu-2-sculpture-2 {
    width: 50%;
    aspect-ratio: 164 / 205;
    height: auto;
}
#root .introduce-shu-2-sculpture-3 {
    width: calc(100% - 48px);
    margin: 12px 24px 18px;
    height: auto;
    aspect-ratio: 342 / 440;
}
#root .introduce-shu-2-sculpture-2-text {
    position: relative;
    width: calc(100% - 48px);
    margin: 0 24px;
}
#root .introduce-shu-2-sculpture-2-text svg {
    width: 32px;
    height: 24px;
    margin-bottom: 12px;
    font-size: 14px;
    line-height: 24px;
}
#root .introduce-shu-3 {
    padding: 0 24px;
}
#root .introduce-shu-3-sculpture {
    width: 100%;
    height: auto;
    aspect-ratio: 342 / 190;
    margin-bottom: 0;
}
#root .introduce-shu-3-sculpture-text {
    font-size: 11px;
}
#root .introduce-shu-4-title {
    width: calc(100% - 48px);
    margin: 78px 24px 0;
}
#root .introduce-shu-4-sculpture-box {
    width: calc(100% - 48px);
    margin: 0 24px;
}
#root .introduce-shu-4-sculpture {
    width: 100%;
    height: 320px;
}
#root .introduce-shu-4-sculpture-bg {
    width: 100%;
    height: 320px;
}
#root .introduce-shu-4-sculpture-text {
    right: 14px;
    font-size: 14px;
    line-height: 16px;
}
#root .introduce-shu-4-sculpture-box {
    height: 425px;
}
#root .introduce-shu-4-sculpture-linght {
    width: 100%;
    height: 400px;
}
/* .page-product-detial-info-7 {
    height: 500px;
} */

/* Space */
#root .space-page {
    width: 100%;
    padding: 0 18px;
    display: block;
}
#root .space-page .page-content-7-zipic {
    width: 366px;
    height: 516px;
}
#root .space-info {
    width: 100%;
}
#root .space-info-basic-info-title {
    color: rgba(255, 255, 255, 0.9);
    font-size: 18px;
    font-weight: 600;
    line-height: 150%;
}
#root .space-info-basic-info-item-name {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    font-weight: 400;
    line-height: 150%;
    float: none;
}
#root .space-info-basic-info-item-text {
    color: rgba(255, 255, 255, 0.9);
    font-size: 14px;
    font-weight: 500;
    line-height: 150%;
    width: auto;
}
#root .traffic-line-item-name {
    display: flex;
    padding: 6px;
    align-items: center;
    gap: 6px;
    align-self: stretch;
}
#root .traffic-line-item-text {
    color: rgba(255, 255, 255, 0.8);
    font-size: 14px;
    font-weight: 500;
    line-height: 150%;
}
#root .traffic-line-item-tips {
    color: rgba(255, 255, 255, 0.5);
    font-size: 14px;
    font-weight: 500;
    line-height: 150%;
}
#root .space-addr {
    width: calc(100% - 60px);
    margin: 0 30px 70px;
    text-align: left;
}
#root .space-addr-item svg {
    width: 16px;
    height: 16px;
    position: absolute;
    left: -24px;
    top: 0;
}
#root .space-addr-title {
    font-size: 18px;
    padding-bottom: 12px;
    margin-bottom: 20px;
}
#root .space-addr-item {
    font-size: 18px;
    margin: 0 0 10px 24px;
    font-size: 14px;
    text-align: left;
}
