/* 內頁樣式 */
:root {
    --nav-color: rgb(214, 197, 158);
    --border-color: #6f8bac;
    --th-bgcolor: #6f8bac;
    --page-color: #424a54;
}


/* .page_con{
    background: url(../images/pc/bg_l_2.png) no-repeat top center;
    background-size: 100% auto;
    } */



/******* 共用設定 *******/
.page, .page .content{
    width: 100%;}

.prose {
    --gap: 20px;
    width: 100%;
    /* color: #141414; */
    font-size: 1rem;
    min-height: 600px;
    /* overflow: hidden; */
    padding: var(--gap) 0 100px;
    margin: 0 auto;
}

.prose a {
    text-decoration:underline;
}


/*超連結 X 設定*/
.prose div.txt_link{
    padding: .5rem .5rem;
}


.prose div.txt_link a{
    font-size: 1.3rem;
    font-weight: 600;
    color:#cf7855;
    padding: .7rem .5rem .5rem .1rem;
    /* border-bottom: 1px solid #cf7855; */
}
.content a{
    margin-left: 15px;
    font-size: 1.3rem;
    font-weight: 600;
    color:#cf7855;
    padding: .7rem .5rem .5rem .1rem;
}

.content a::before{
    content: "★";
    position: absolute;
    margin-left: -20px;
    width: 10px;
    height: 10px;
}



.prose div.txt_link a:hover{
    color:#c44f21;
}
.prose div.txt_link svg{
    width: 15px;
    display: inline-block;
}




/*圖檔 X 設定*/
.prose .img_style,
.content img {
    width: 100%;
    height: auto;
    margin: .7rem 0;
}
.prose .img_style img{
    width: 100%;
    margin: auto;
}




.prose h1,
.prose h2,
.prose h3,
.prose h4,
.prose h5,
.prose h6 {font-weight: 700;}



.prose .prose-header {
    margin: 0 var(--gap);
    border-bottom: 2px solid var(--border-color); 
    position: relative;
    top: 0;
    z-index: 10;
    padding: 10px 0;
    background-color: #44444400;
}

.prose header h1 {
    color: #41628a;
    --prose_h1: 30px;
    font-size: var(--prose_h1);
    font-weight: 700;
    margin: 0;
}

.prose .content {    
    width: calc(100% - var(--gap) * 2);
    margin: 0 var(--gap);
}


.prose ol,
.prose ul {
    margin-bottom: 1rem;
}

.prose ol {
    list-style: decimal;
}

.prose ul {
    list-style: disc;
}

.prose li {
    margin-left: 24px;
}

.prose p {
    margin: .5rem 0;
}


/*連結圖案*/
.prose .prose-header .btn-copy {    
    width: var(--btn-copy); aspect-ratio: 1/1;
    background-color: #41628a;
    position: absolute; right: 0; top: 50%;
    text-indent: -1000rem;    
    -ms-transform: translateY(-50%); transform: translateY(-50%);    
    mask-image: url(../images/btn_link.svg);
    mask-size: 100% auto;
    transition: .25s filter cubic-bezier(0.4,0,0.2,1);
}
.prose-header::before {
    content: "";
    width: var(--btn-copy); aspect-ratio: 1/1; display: block;
    background: #41628a;
    font-size: 0; border-radius: 50%;
    position: absolute; top: 0; right: 0; z-index: 0;
    opacity: 0;
    transition: .25s opacity cubic-bezier(0.4,0,0.2,1);
    transform: scale(0.9);
    margin-top: .85rem;
}
.prose-header:has(.btn-copy:hover)::before {
    opacity: 1;
    background: #5779a2;
}

.prose .prose-header .btn-copy:hover {
    background-color: #ffffff7b;
}





/* 共用設定 X 各頁面 X 表格 */
.page h2{
    color: #435c79;
    margin-top: 1.5rem;
    margin-bottom: 1rem;
    font-size: 1.9rem;
    text-shadow: 1px 1px 1px rgba(255, 247, 217, 0.3);
}

.page h3{ 
    color: #424a54;
    margin-top: 2rem; 
    margin-bottom: .5rem; 
    font-size: 1.4rem;
}

.page .content{color:var(--page-color); overflow: auto;}

.page .content ul li{list-style: "\25C6"; padding-inline-start: .5rem; padding: .25rem;}
.page .content ul li::marker{ font-size: .9rem;}
.page .content ul li::before{margin-right: .5rem;}

.page table{

}
.page table th,
.page table td{vertical-align: middle;}
.page table thead,
.page table tbody tr:nth-child(1) td{text-align: center;}
.page table thead th span{display: block;}
.page table tbody{ color: #242424 !important; text-align: center;}


/******* 共用設定 X 表格 *******/

.wp-block-table,
.content table {
    overflow: auto;
    max-height: 80vh;
    position: relative;
    margin: 0;
    margin-bottom: 1.5rem;
}

.wp-block-table table,
.content table {
    border-collapse: collapse;
    width: max-content;
    min-width: 100%;
    background-color: #fff;
}

.wp-block-table table td,
.content table td{
    background-color: #cfdae8;
    vertical-align: top;
}

.wp-block-table table thead th,
.wp-block-table table tbody tr:nth-child(1) td,
.content table tbody tr:nth-child(1) td{    
    background-color: var(--th-bgcolor);
    border-color: var(--th-bgcolor);
    color: #fff;
}

.wp-block-table table td,
.wp-block-table table th,
.content table td {
    border: 1px solid #fff;
    padding: 6px 12px;
}

.wp-block-table thead th,
.wp-block-table table tbody tr:nth-child(1) td,
.content table tbody tr:nth-child(1) td {
    position: sticky; top: 0; z-index: 10;
}

/* .wp-block-table figcaption {
    text-align: center;
} */


/* 左邊第一欄固定 */
/* .wp-block-table .sticky-col {
    position: sticky; 
    word-break: keep-all;
    left: 0; 
    z-index: 9;
}

.wp-block-table thead .sticky-col {
    z-index: 11;
} */


/* 欄位顏色 X 設定 */
.page table td.grade1{background-color: #d7d7d7;}
.page table td.grade2{background-color: #d1dbcd;}
.page table td.grade3{background-color: #cfd8e5;}
.page table td.grade4{background-color: #dfcfd6;}
.page table td.grade5{background-color: #cccae0;}
.page table td.grade6{background-color: #dad7bd;}

/* 文字顏色 X 設定 */
.txt_b{
    color:#df6aff;
}
.txt_c{
    color:#f96d1c;
}



/* #long_form  table thead th:nth-last-of-type(n+2){
    white-space:nowrap;
} */

/* .page.p3_3 table td:nth-of-type(1),
.page.p4_3 table td:nth-of-type(1)
{white-space: nowrap;} */

/* ------------------ 英文 X 設定 ------------------ */
#en .wp-block-table table td,
#en .wp-block-table table th{
    max-width: 180px;
    word-break: break-word;
}









/* ------------------ wide view ------------------ */

@media (min-width:1024px) {
    /******* 共用設定 *******/
    .prose {
        --gap: 60px;
        font-size: 1.15rem;
        line-height: 2rem;
        max-width: 970px;
    }

    .prose .prose-header {
        line-height: 1;
        margin:0 var(--gap) 32px;
        padding: 0 0 20px;
    }

    .prose header h1 {
        font-size: calc(var(--prose_h1)* 1.3);
    }

    .prose .prose-header .btn-copy {
        width: calc(var(--btn-copy) * 1.2);
        margin-top: -10px;
    }
    .prose-header::before {
        width: calc(var(--btn-copy) * 1.2);
        margin-top: -4px;
    }

    .prose h4,
    .prose h5,
    .prose h6 { margin: 1.75rem 0;}



    /******* 共用設定 X 表格 *******/
    .wp-block-table table td,
    .wp-block-table table th {
        padding: .5rem 1rem;
    };
}


@media (max-width:680px) {
    .page table{font-size: 1rem;}
}


@media (max-width:430px) {
    /* 共用設定 X 各頁面 X 表格 */
    .page table thead{font-size: 1.1rem;}
    .page .content p,.page .content ul li{ font-size: 1rem;}

    .page h2{ font-size: 1.4rem; line-height: 1.8rem; margin-top: 1.5rem;}
    .page h2>span{ 
        padding: .2rem 1.5rem .2rem 0rem;
    }
    
    .page h3{ font-size: 1.2rem;}
    .page table thead{ font-size: 1rem;}

    .wp-block-table {
        max-height: 50vh;
    }
}