* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root{
    
    /* 原本標題頁尾 背景顏色 */
    --color2: #eaf2f4;
    /* 原本標題頁尾 字顏色 */
    --color3:#171E26;
    /* a 標籤hover顏色 */
    --color4:#F2CD5E;


    --color7:#99d3df;
    --color8:#88bbd6;
    --color9:#cdcdcd;
    --color10:#e9e9e9;

    --color11:#4484ce;
    --color12:#d9d9d9;
    --color13:#f9cf00;
    --color14:#f19f4d;


    --color15:#6b7a8f;
    --color16:#f7882f;
    --color17:#f7c331;
    --color18:#dcc7aa;

    --color19:#a9b7cd;
    --color20:#c7d8c6;
    --color21:#efd9c1;
   
    --color22:#EBEFF2;

    --color23:#F2CD5E;
}

/* 標題 */

.headNav {
    text-align: center;
    background-color: var(--color19);
}



.headNav a {
    text-decoration: none;
    color: white;
    font-weight: 800;
    font-size: 1.5rem;
    display: inline-block;
    padding: 20px;
}

.headNav span a{
    display: inline-block;
    padding: 20px;
    font-size: 35px;
    margin: 0 100px;
}

.headNav a:hover {
    color: #6b7a8f;
}



/* footer */
.footerBox {
    margin: 0px auto;
    background-color: var(--color19);
    /* width: 840px; */
}

.mytxt {
    display: block;
    margin: auto;
    width: 215px;
    height: 90px;
}

.mytxt p {
    line-height: 90px;
    color: white;
}

/* top按鈕 */
#BackTop {
    position: fixed;
    right: 1.5em;
    bottom: 10%;
    z-index: 90;
    cursor: pointer;
}

#BackTop img {
    width: 45px;
}

#BackTop p {
    text-align: center;
    color: var(--color20);
}