@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&family=Noto+Serif+TC:wght@200..900&display=swap');

/* -- reset module8 -- */
.edit,
.show_content,
.main_part { width: 100% !important; max-width: 100% !important; margin: auto !important; padding: 0px !important;}
.pageIndex .main_part { border:none !important; }
.path,
.banner { display:none;}
/* -- reset module8 end -- */


.hs_box * { line-height:150%; font-size:15px; border:0; outline:none; text-decoration:none; padding:0; margin:0; list-style:none; box-sizing:border-box; max-width:100%; font-family: 'Noto Serif TC'; 
-webkit-transition: ease .4s; -moz-transition: ease .4s; -ms-transition: ease .4s; -o-transition: ease .4s; transition: ease .4s;}
.hs_box{overflow: hidden;scroll-behavior: smooth;background-color: #F7F5EA;max-width: 2000px;margin: auto;}
.hs_box sub, .hs_box sup{vertical-align: unset;}
.hs_box i, .hs_box em , .hs_box dfn , .hs_box var{font-style: normal;line-height: 0px;}/*斜線標籤轉正*/
.hs_box table{border-spacing: 0px;border-collapse: collapse;}
.hs_box table td{border: 1px solid #000;}
.hs_box img { max-width:100%;line-height: 0px;}
.hs_clear::before, .hs_clear::after { content:''; display: table; }
.hs_clear::after { clear: both;}
.hs_clear { zoom: 1; }

/*Animations*/
[data-animate-in] { opacity: 0; transition: transform 1.6s ease, opacity 1.6s ease;}
[data-animate-in="up"] { transform: translate3d(0, 10px, 0);}/*由下往上*/
[data-animate-in="left"] { transform: translate3d(-5%, 0, 0);}/*由左往右*/
[data-animate-in="right"] { transform: translate3d(5%, 0, 0);}/*由右往左*/
[data-animate-in="down"] { transform: translate3d(0, -10%, 0);}/*由上往下*/
[data-animate-in="fadeIn"] { transform: translate3d(0, 0, 0);}/*淡入*/
[data-animate-in="scaleIn"] {transform: scale(.3);}/*放大淡入*/
[data-animate-in="rotateIn"] {transform: scale(.3) rotate(-10deg);}/*放大淡入*/
[data-animate-in].in-view { opacity: 1; transform:translate3d(0,0,0) rotate(0deg); -webkit-transform:translate3d(0,0,0) rotate(0); transition: transform .8s ease, opacity .8s ease;}
.fade-in { opacity: 0; transition: opacity .5s ease; }
/*Animations-end*/

/*關鍵字*/
.key_words{height: 0; max-height: 0; overflow: hidden;}
.key_words h2, .key_words h3, .key_words h4, .key_words h5, .key_words h6{color: rgba(255,255,255,.0);}

    .edit_part {
        max-width: 100%;
        margin: auto;
        padding: 0;
    }

    .hs_box{
        --f_base: clamp(15px, 2vw, 40px); /* 基準字體 */

        /* 極簡比例系統 */
        --s-sm: 0.8;    /* 小字 */
        --s-md: 1;      /* 中字 */ 
        --s-lg: 1.25;   /* 大字 */

        --f14: 14px;
        --f16: clamp(15px, calc(var(--f_base) * var(--s-sm)), 16px);
        --f18: clamp(16px, calc(var(--f_base) * var(--s-sm)), 18px);
        --f20: clamp(17px, calc(var(--f_base) * var(--s-sm)), 20px);
        --f24: clamp(18px, calc(var(--f_base) * var(--s-md)), 24px);
        --f30: clamp(20px, calc(var(--f_base) * var(--s-md)), 30px);
        --f36: clamp(22px, calc(var(--f_base) * var(--s-lg)), 36px);
        --f80: clamp(32px, calc(var(--f_base) * 2), 80px);
        --f110: clamp(40px, calc(var(--f_base) * 2), 110px); /* 巨型標題單獨保留 */

        --pdy:calc(1vw + 70px);
        --pdx:5%;
        --Seriffont:'Noto Serif TC';
        --Cormfont:'Cormorant Garamond';
        --colorMain:#6F7951;
        --colorMainDark:#585246;
        --colorSub:#FCF7EB;
        --colorSubDark:#F3E1B8;
        --colorText:#585246;
    }
    .hs_box *{
        color: var(--colorText);
    }

    @keyframes typing {
        0% { clip-path: polygon(0 0, 10% 0, 10% 100%, 0% 100%);}
        100% { clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}
    }
    .in-view .anima_typing{overflow: hidden;position: relative;z-index: 1;animation: typing 3.5s steps(40, end)}
    .in-view .anima_typing{animation: typing 1.5s steps(40, end)}

    /*進階滑入滑出*/
    .allanima{z-index: 10;transition: ease-in-out 1.2s;}
    .allanima_left {clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);}
    .in-view .allanima_left {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
    .allanima_right {clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);}
    .in-view .allanima_right {clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}

    .allanima_bottom {clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0% 100%);}
    .in-view .allanima_bottom {clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}
    .allanima_top {clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);}
    .in-view .allanima_top {clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}

    .allanima_circle{clip-path: circle(15% at 50% 50%);}
    .in-view .allanima_circle{clip-path: circle(100% at 50% 50%);}
    /*------------------------------------*/

    /*共通*/
    .ho_entitle{
        font-size: var(--f80);
        color: var(--colorMain);
        font-family: var(--Cormfont);
        font-weight: bold;
        line-height: 120%;
        word-break: break-word;
    }
    .ho_chtitle{
        font-size: var(--f30);
        font-weight: bold;
        line-height: 200%;
        letter-spacing: 0.1em;
        margin: 5px 0 0;
    }
    .ho_btn{
        max-width: 180px;
        width: 100%;
        padding: 15px 10px;
        text-align: center;
        font-size: var(--f14);
        font-weight: bold;
        background-color: var(--colorSubDark);
    }
    .ho_btn:hover{
        background-color: var(--colorMain);
        color: var(--colorSub);
    }
    /*------------------------------------*/


    /* --- Media Queries --- */
    @media (max-width: 1360px) {}
    @media (max-width: 1024px) {}
    @media (max-width: 992px) {}
    @media (max-width: 768px) {}
    @media (max-width: 600px) {}
    @media (max-width: 475px) {}
    @media (max-width: 375px) {}