/* pc-only */
.top-view {
    width: 100%;
    margin: 3.69rem 0 7.62rem 0;
}

.top-view:not(.slick-initialized) .visual-img:not(:first-child) {
    display: none;
}

.visual-img {
    aspect-ratio: 70/39;
    padding: 0 0.5rem;
}

.visual-img a,
.visual-img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.popular-title h2 {
    color: #D85E96;
    font-family: "Noto Sans TC";
    font-size: 2.5rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin: 0 53.38rem 5.81rem 51.62rem;
    white-space: nowrap;
}

.product-wrapper {
    margin: 0 22.63rem 3.94rem 23.13rem;
}

.type-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.type-title h3 {
    color: #3C3C3C;
    font-family: "Noto Sans TC";
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal; 
}

.type-title img {
    width: 62.75rem;
    height: 0.15625rem;
}

.product-container {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-top: 4rem;
}

.product-area {
    width: 21.875rem;
    display: flex;
    flex-direction: column !important;
    text-decoration: none;
    color: inherit;
}

.product-area img {
    display: block;
    width: 100%;
}

.text-area {
    width: 21.875rem;
    height: 8.75rem;
    font-family: "PingFang TC", "Microsoft JhengHei", "Noto Sans TC", sans-serif;
    background-color: #F7E8DC;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0;
}

.product-name {
    color: #000;
    /* font-family: "Noto Sans TC"; */
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    padding-bottom: 0.5rem;
}

.product-catchphrase {
    color: #000;
    /* font-family: "Noto Sans TC"; */
    font-size: 1.1875rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding-bottom: 0.75rem;
}

.text-area img {
    width: 16.625rem;
    height: 2.1875rem;
}

.btn-view-all {
    width: 44.125rem;
    height: 3.0625rem;
    margin: 4.31rem 14.88rem 3.37rem 14.13rem;
}

.latest-news {
    background-image: url(/img/Group\ 42.png);
    width: 100%;
    height: 60.75rem;
    background-size: cover;
    background-position: top center;
    position: relative;
}

.news-wrapper {
    padding-top:14.62rem;
    margin: 0 22.81rem 10rem 23.44rem;
}

.news-container {
    background-color: #FFF;
    border-radius: 0.6875rem;
    padding: 2.69rem 1.88rem 1.62rem 2.31rem;
}

.mdy {
    color: #282828;
    font-family: "Noto Sans TC";
    font-size: 1.5625rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.07813rem;
    padding-top: 1.19rem;
}
.post {
    color: #282828;
    font-family: "Noto Sans TC";
    font-size: 1.5625rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.07813rem;
    padding: 0.69rem 4.5rem 1.06rem 1.75rem;
}

.news-content,
.news-content-sp {
    position: relative;
    cursor: pointer;
    border-radius: 0.5rem;
    transition: background-color 0.2s ease;
}

.news-content:hover,
.news-content-sp:hover {
    background-color: rgba(247, 232, 220, 0.55);
}

.news-content::after,
.news-content-sp::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 1.75rem;
    width: 1rem;
    height: 1rem;
    border-top: 0.18rem solid #8B5E4A;
    border-right: 0.18rem solid #8B5E4A;
    transform: translateY(-50%) rotate(45deg);
    transition: right 0.2s ease;
}

.news-content:hover::after,
.news-content-sp:hover::after {
    right: 1.35rem;
}

.news-content img {
    width: 69.5625rem;
    height: 0.0625rem;
    opacity: 0.5;
}

.news-more {
    width: 26.375rem;
    height: 3.0625rem;
    margin: 2.25rem 21.81rem 0 21.37rem;
}

.content-title {
    color: #402005;
    font-family: "Noto Sans TC";
    font-size: 2.5rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-align: center;
    padding-bottom: 3.25rem;
}

.contact {
    display: flex;
    margin: 6.81rem 17.69rem 10.94rem 14.81rem;
}

.tel-btn {
    width: 41.6875rem;
    height: 18.625rem;
    aspect-ratio: 620/277;
    margin-right: 3.81rem;
}

.line {
    width: 41.6875rem;
    height: 8.875rem;
    aspect-ratio: 667/142;
    margin-bottom: 1.88rem;
}

.question {
    width: 41.75rem;
    height: 7.875rem;
    aspect-ratio: 334/63;
    align-items: center;
}

/* positon画像 */
.butterfly-1 {
    width: 12.875rem;
    height: 9.9375rem;
    aspect-ratio: 206/159;
    position: absolute;
    top: 52.62rem;
    left: 34.62rem;
}

.leaf-1 {
    width: 16.4375rem;
    height: 21.875rem;
    aspect-ratio: 130/173;
    position: absolute;
    top: 56.19rem;
}

.leaf-2 {
    width: 21.875rem;
    height: 12.25rem;
    aspect-ratio: 25/14;
    position: absolute;
    top: 75.31rem;
    left: 98.31rem;
}

.leaf-3 {
    width: 13.34375rem;
    height: 13.96875rem;
    aspect-ratio: 64/67;
    position: absolute;
    top: 112rem;
}

.animal-1 {
width: 8.5625rem;
height: 7.46875rem;
aspect-ratio: 137.00/119.50;
position: absolute;
top: 112rem;
right: 9.25rem;
}

.leaf-4 {
width: 18.5rem;
height: 21.875rem;
aspect-ratio: 137/162;
position: absolute;
top: 219.19rem;
}

.leaf-5 {
width: 22.8125rem;
height: 19.0625rem;
aspect-ratio: 73/61;
position: absolute;
top: 240.06rem;
left: 97.19rem;
}

/* ==================================================== */
/* sp-only */
/* ===================================================== */
.slide-main {
    display: block;
    margin: 0;
    padding: 0;
}

.top-view-sp {
    width: 100%;
    margin: 0;
    padding: 0;
}

.visual-img-sp {
    width: 100%;
}

.visual-img-sp a,
.visual-img-sp img {
    display: block;
    width: 100%;
    height: auto;
}

.popular-title-sp h2 {
    color: #D85E96;
    font-family: "Noto Sans TC";
    font-size: 2.5rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin: 3.44rem 16.38rem 2rem 16.63rem;
    white-space: nowrap;
}

.type-title-sp {
    width: 10.5rem;
    height: 4.0625rem;
    aspect-ratio: 168/65;
    margin: 0 18.81rem 1.81rem 18.69rem;
}

.product-container-sp {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin: 0 1.5rem 3.12rem 1.44rem;
}

.product-area-sp {
    width: 21.875rem;
    display: flex;
    flex-direction: column !important;
    text-decoration: none;
    color: inherit;
}

.product-area-sp img {
    display: block;
    width: 100%;
}

.text-area-sp {
    width: 21.875rem;
    height: 8.75rem;
    font-family: "PingFang TC", "Microsoft JhengHei", "Noto Sans TC", sans-serif;
    background-color: #F7E8DC;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0;
}

.product-name-sp {
    color: #000;
    /* font-family: "Noto Sans TC"; */
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    padding-bottom: 0.5rem;
}

.product-catchphrase-sp {
    color: #000;
    /* font-family: "Noto Sans TC"; */
    font-size: 1.1875rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding-bottom: 0.75rem;
}

.text-area-sp img {
    width: 16.625rem;
    height: 2.1875rem;
}

.btn-view-all-sp {
    width: 44.125rem;
    height: 3.0625rem;
    margin: 0 1.94rem 5.19rem 1.94rem;
}

.latest-news-sp {
    background-image: url(/img/アセット\ 16\ 1.png);
    width: 48rem;
    height: 51.375rem;
    aspect-ratio: 71/76;
    background-size: cover;
    background-position: top center;
    position: relative;
}

.news-wrapper-sp {
    padding-top: 6.12rem;
    margin: 0 1.69rem 0 1.94rem;
}

.content-title-sp {
    color: #402005;
    font-family: "Noto Sans TC";
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.2925rem;
    text-align: center;
    padding-bottom: 2.81rem;
}

.news-container-sp {
    width: 44.375rem;
    height: 0 auto;
    border-radius: 0.6875rem;
    background: #FFF;
    padding: 2rem 1.31rem 1.75rem 1.44rem;
}

.mdy-sp {
    width: 16.875rem;
    height: 0 auto;
    color: #282828;
    font-family: "Noto Sans TC";
    font-size: 1.5625rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.07813rem;
    padding-top: 2.06rem;
}

.news-content-sp:first-child .mdy-sp {
    padding-top: 0;
}

.post-sp {
    width: auto;
    height: 0 auto;
    color: #282828;
    font-family: "Noto Sans TC";
    font-size: 1.5625rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.07813rem;
    padding: 0.69rem 4.5rem 1.12rem 1.75rem;
    white-space: normal;
}

.news-more-sp img {
    padding: 1.94rem 7.85rem 0 8rem;
}

.contact-title-sp {
    width: 12.5rem;
    height: 2.625rem;
    color: #402005;
    font-family: "Noto Sans TC";
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.2925rem;
    margin: 5.25rem 16.19rem 3.12rem 19.31rem;
}

.contact-container-sp {
    width: 45.3125rem;
    height: 34.5625rem;
    background: #F8E6D8;
    margin: 0 1.31rem 4.25rem 1.38rem;
}

.tel-title-sp {
    color: #454545;
    font-family: "Noto Sans TC";
    font-size: 1.9375rem;
    font-style: normal;
    font-weight: 500;
    line-height: 1.75rem; /* 90.323% */
    letter-spacing: 0.44563rem;
    padding: 2.56rem 15.81rem 2.12rem 15.62rem;
    white-space: nowrap;
}

.tel-img-sp {
    width: 45.31rem;
    height: 9.375rem;
    aspect-ratio: 298/75;
    padding: 0 4.12rem 0 3.94rem;
}

.line-title-sp {
    color: #454545;
    font-family: "Noto Sans TC";
    font-size: 1.9375rem;
    font-style: normal;
    font-weight: 500;
    line-height: 1.75rem; /* 90.323% */
    letter-spacing: 0.44563rem;
    padding: 2.69rem 18.12rem 2.06rem 18.06rem;
    white-space: nowrap;
}

.line-img-sp {
    width: 45.31rem;
    height: 9.3125rem;
    aspect-ratio: 4/1;
    padding: 0 4.06rem 0 4rem;
}

.leaf-sp-1 {
    width: 9.8125rem;
    height: 12.125rem;
    aspect-ratio: 157/194;
    position: absolute;
    top: 43.81rem;
}

.leaf-sp-2 {
    width: 12.9375rem;
    height: 11.625rem;
    aspect-ratio: 69/62;
    position: absolute;
    top: 43.38rem;
    left: 35.06rem;
}

.animal-sp-1 {
    width: 21.4375rem;
    height: 5.875rem;
    aspect-ratio: 343/94;
    position: absolute;
    top: 140.56rem;
}

.leaf-sp-3 {
    width: 11.4375rem;
    height: 9.875rem;
    aspect-ratio: 183/158;
    position: absolute;
    top: 197.94rem;
    left: 36rem;
}

.leaf-sp-4 {
    width: 12.625rem;
    height: 11.625rem;
    aspect-ratio: 101/93;
    position: absolute;
    top: 290rem;
    left: 35.38rem;
}

/* news/information */

.news-modal-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    padding: 3rem 1.5rem;
    background: rgba(0, 0, 0, 0.35);
    justify-content: center;
    align-items: center;
    overflow-y: auto;
}

.news-modal-overlay.is-open {
    display: flex;
}

.news-modal-overlay-sp.is-open {
    display: flex;
}

.information {
    width: min(73.4375rem, 100%);
    max-height: calc(100vh - 6rem);
    padding: 4rem 3.75rem 4.5rem 3.12rem;
    background: #FFFFFF;
    overflow-y: auto;
}

.information-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.information-container img {
    width: 3.43806rem;
    height: auto;
    flex-shrink: 0;
    padding-bottom: 1.03rem;
    padding-right: 0.62rem;
    cursor: pointer;
}

.information-title {
    color: #3C3C3C;
    font-family: "Noto Sans TC";
    font-size: 3.375rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.10125rem;
    padding-bottom: 1.03rem;
}

.pink-line {
    width: 100%;
    height: auto;
}

.information > img {
    display: block;
    width: 100%;
    height: auto;
}

.up-data {
    color: #3F3D3C;
    font-family: "Noto Sans TC";
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.0675rem;
    padding: 1.09rem 0 1.06rem;
}

.news-content-title {
    color: #000;
    font-family: "Noto Sans TC";
    font-size: 3.4375rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.10313rem;
    padding-bottom: 2rem;
}

.informaiton-content p {
    color: #000;
    font-family: "Noto Sans TC";
    font-size: 2.1875rem;
    font-style: normal;
    font-weight: 500;
    line-height: 3.8125rem; /* 174.286% */
    letter-spacing: 0.06563rem;
    padding: 0 1.31rem;
    word-break: break-word;
}

.informaiton-content div,
.informaiton-content p {
    color: #000;
    font-family: "Noto Sans TC";
    font-size: 2.1875rem;
    font-style: normal;
    font-weight: 500;
    line-height: 3.8125rem;
    letter-spacing: 0.06563rem;
}

/* sp */

.news-modal-overlay-sp {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    padding: 2rem 1.5rem;
    background: rgba(0, 0, 0, 0.35);
    justify-content: center;
    align-items: center;
    overflow-y: auto;
}

.news-modal-overlay-sp.is-open {
    display: flex;
}

.information-sp {
    width: min(36.25rem, 100%);
    max-height: calc(100vh - 4rem);
    padding: 1.94rem 2.19rem 3rem 2.19rem;
    background: #FFFFFF;
    overflow-y: auto;
}

.information-container-sp {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.information-container-sp img {
    width: 3.43806rem;
    height: auto;
    flex-shrink: 0;
    padding-bottom: 1.03rem;
    padding-right: 0.62rem;
    cursor: pointer;
}

.information-title-sp {
    color: #3B3A3A;
    font-family: "Noto Sans TC";
    font-size: 2.5rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.075rem;
    padding-bottom: 1.03rem;
}

.pink-line-sp {
    width: 100%;
    height: auto;
}

.information-sp > img {
    display: block;
    width: 100%;
    height: auto;
}

.up-data-sp {
    color: #3F3D3C;
    font-family: "Noto Sans TC";
    font-size: 1.8125rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.05438rem;
    padding: 1.31rem 0 1.13rem;
}

.news-content-title-sp {
    color: #000;
    font-family: "Noto Sans TC";
    font-size: 2.9375rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.08813rem;
    padding-bottom: 1.13rem;
}

.informaiton-content-sp p {
    color: #000;
    font-family: "Noto Sans TC";
    font-size: 2.1875rem;
    font-style: normal;
    font-weight: 500;
    line-height: 3.8125rem; /* 174.286% */
    letter-spacing: 0.06563rem;
    padding: 0 1.31rem;
    white-space: normal;
    word-break: break-word;
}

.informaiton-content-sp div,
.informaiton-content-sp p {
    color: #000;
    font-family: "Noto Sans TC";
    font-size: 2.1875rem;
    font-style: normal;
    font-weight: 500;
    line-height: 3.8125rem;
    letter-spacing: 0.06563rem;
}