/*** pc 模式 ***/

/* 僅行動裝置模式顯示 (pc 模式關閉) */
.mobile
{
    display: none;
}

/* 頁首 */
#header
{
    position: fixed;
    top: 0;
    width: 100%;
    height: 75px;
    background: white;
    z-index: 200;
}
.header
{
    display: flex;
    flex-direction: row;
    height: 65px;
    background: white;
    color: black;
    position: relative;
}

/* 頁首 logo */
.header-log-menu-btn-position
{
    display: flex;
    flex: 0.5;
    padding: 5px 0 0 5px;
}
.header-logo
{
    display: flex;
}
.img-logo
{
    width: auto;
    max-width: 328.31px;
    max-height: 100%;
    height: auto;
    margin-right: auto;
    display: block;
}

/* mail href */
.href
{
    color: #0000ee;
    text-decoration: "underline";
}

/* 當非行動裝置模式時，強制顯示導航欄區塊 */
@media screen and (min-width: 961px) {
    .header-nav
    {
        display: flex !important;
    }
}
/* 導航欄區塊 */
.header-nav
{
    flex: 1;
    justify-content: end;
    padding: 5px 15px 0 0;
}
/* 導航欄清單 */
.header-item
{
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    font-size: 20px;
}
.header-item > li
{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 0 5px;
    font-size: 20px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}
/* 導航欄項目及下拉列表 */
.header-li-position
{
    padding: 0 20px 0 5px;
}
/* 導航欄項目 */
.header-li-ul-title-position,
.header-li-ul-title
{
    display: block;
    position: relative;
}
/* 導航欄下拉列表 */
.header-li-ul
{
    display: none;
    flex-direction: column;
    position: absolute;
    background: #ffffff;
    top: 66px;
    left: 0;
    z-index: 100;
    width: 100%;
    border: 1px solid #dfdfdf;
    border-radius: 5px;
}
.header-li-ul li
{
    display: block;
    text-align: center;
    cursor: pointer;
    border-bottom: 1px solid #c7c7c7;
    padding: 5px;
    font-size: 19px;
    width: calc(100% + 2px);
    left: -1px;
    position: relative;
    box-sizing: border-box;
}
.header-li-ul li:nth-child(1)
{
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.header-li-ul li:nth-last-child(1)
{
    border-bottom: 0;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
.header-li-ul li:hover
{
    background: #b9b9f6;
}
.header-li-ul li:active,
.header-li-ul .act,
.header-li-ul .act:hover
{
    color:rgb(245, 248, 251);
    font-weight: bold;
    background: #333399;
}

/*導航欄項目箭頭和旋轉動畫*/
.header-arrow
{
    display: block;
    position: absolute;
    right: -15px;
    top: 3px;
}
.arrow-down
{
    border-style: solid dashed dashed dashed;
    border-color: transparent;
    border-bottom-color: black;
    border-width: 6px;
}
.header-arrow-animation-up
{
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    top: 3px;

    -moz-animation-name: rotate-arrow-up;
    -moz-animation-duration: 0.3s;
    -moz-animation-fill-mode: both;

    -webkit-animation-name: rotate-arrow-up;
    -webkit-animation-duration: 0.3s;
    -webkit-animation-fill-mode: both;

    animation-name: rotate-arrow-up;
    animation-duration: 0.3s;
    animation-fill-mode: both;
}
.header-arrow-animation-down
{
    -moz-transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
    top: 9px;

    -moz-animation-name: rotate-arrow-down;
    -moz-animation-duration: 0.3s;
    -moz-animation-fill-mode: both;

    -webkit-animation-name: rotate-arrow-down;
    -webkit-animation-duration: 0.3s;
    -webkit-animation-fill-mode: both;

    animation-name: rotate-arrow-down;
    animation-duration: 0.3s;
    animation-fill-mode: both;
}
@-moz-keyframes rotate-arrow-up {
    from
    {
        -moz-transform: rotate(0deg);
        top: 3px;
    }
    to
    {
        -moz-transform: rotate(-180deg);
        top: 9px;
    }
}
@-webkit-keyframes rotate-arrow-up {
    from
    {
        -webkit-transform: rotate(0deg);
        top: 3px;
    }
    to
    {
        -webkit-transform: rotate(-180deg);
        top: 9px;
    }
}
@keyframes rotate-arrow-up {
    from
    {
        transform: rotate(0deg);
        top: 3px;
    }
    to
    {
        transform: rotate(-180deg);
        top: 9px;
    }
}
@-moz-keyframes rotate-arrow-down {
    from
    {
        -moz-transform: rotate(-180deg);
        top: 9px;
    }
    to
    {
        -moz-transform: rotate(0deg);
        top: 3px;
    }
}
@-webkit-keyframes rotate-arrow-down {
    from
    {
        -webkit-transform: rotate(-180deg);
        top: 9px;
    }
    to
    {
        -webkit-transform: rotate(0deg);
        top: 3px;
    }
}
@keyframes rotate-arrow-down {
    from
    {
        transform: rotate(-180deg);
        top: 9px;
    }
    to
    {
        transform: rotate(0deg);
        top: 3px;
    }
}

/* 導航欄下拉列表 - 語系 */
.header-lang li:hover
{
    color: black;
    font-weight: 100;
    background: #fff1c6;
}
.header-lang li:active,
.header-lang .act,
.header-lang .act:hover
{
    font-weight: 100;
    color: black;
    background: #ffdb87;
}


/*分隔線*/
.line
{
    margin-top: 5px;
    display: flex;
    width: 100%;
    height: 1px;
    background-color: #d8d8d8;
}


/* 頁尾 */
.footer
{
    display: flex;
    position: fixed;
    bottom: 0;
    height: 50px;
    width: 100%;
    z-index: 100;
}
/* 頁尾背景 */
.footer-bg
{
    display: flex;
    justify-content: end;
    width: 100%;
    background-color: #d8e3f0;
    position: relative;
}
/* 頁尾文字 */
.footer-text-position
{
    width: 100%;
    height: 100%;
    display: flex;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
}
.footer-text
{
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
}
.footer-text span
{
    text-align: center;
}
.footer-text:nth-child(1)
{
    justify-content: flex-start;
    left: 20px;
    color: #595959;
}
/* 頁尾遮罩與圖片 */
.footer-img-block
{
    display: flex;
    position: relative;
    margin: 0 0 0 auto;
    width: 91px;
}
.footer-img-mask
{
    display: flex;
    position: absolute;
    width: 46px;
    height: 100%;
    background: #4f81bd;
    opacity: 0.176471;
    left: 0;
}
.footer-img
{
    display: flex;
    height: 100%;
    width: 91px;
}


/* 每頁標題和內容 - 共用 */
#main
{
    margin-top: 75px;
}
.main
{
    margin-top: 5px;
    background-color: rgb(245, 248, 251);
    min-height: calc(100vh - 126px);
}
.main-title
{
    position: relative;
}
.main-title-bg-flex,
.main-title-img
{
    display: flex;
    flex-direction: row;
    width: 100%;
}
.main-title-bg
{
    flex: 1;
    display: flex;
}
.main-title-bg img
{
    width: 100%;
    height: 138px;
}
.main-title-text-pos
{
    display: flex;
    font-size: 56px;
    font-weight: bold;
    color: white;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    letter-spacing: 5px;
}
.main-title-text
{
    font-size: 64px;
}
.main-content
{
    display: flex;
    flex-direction: column;
    background-color: rgb(245, 248, 251);
}


/* 首頁 */
/* 首頁 - 內容 */
.inx-content
{
    display: flex;
    flex-direction: column;
    margin: auto;
    min-height: calc(100vh - 269px);
    justify-content: center;
    width: 100%;
}
/* 首頁 - 內容標題 */
.content-title
{
    font-size: 34px;
    font-weight: bold;
    text-align: center;
    padding: 28px 0;
}
/* 首頁 - 內容標籤 */
.index-tag-block
{
    display: flex;
    flex-direction: row;
    justify-content: center;
}
.index-tag-block .index-tag-block-content
{
    display: flex;
    width: 22%;
    height: 70px;
    position: relative;
}
.index-tag-block-content:nth-child(1)
{
    z-index: 3;
    right: -6%;
}
.index-tag-block-content:nth-child(2)
{
    z-index: 2;
    right: -2%;
}
.index-tag-block-content:nth-child(3)
{
    z-index: 1;
    left: -2%;
}
.index-tag-block-content:nth-child(4)
{
    z-index: 0;
    left: -6%;
}
/* 首頁 - svg 標籤圖示 */
.svg-tag-base
{
    width: 100%;
    height: 100%;
}
.index-tag-block-content .tag
{
    display: flex;
    width: 100%;
}
/* 首頁 - svg 標籤文字 */
.tag-title
{
    display: flex;
    position: absolute;
    color: white;
    font-size: 22px;
    font-weight: bold;
    z-index: 10;
    height: 100%;
    width: 100%;
    justify-content: center;
    align-items: center;
    top: 0;
    left: -2px;
}
.tag-column
{
    flex-direction: column;
}
/* 首頁 - Application 標籤內容 */
.inx-tag-content-flex-2column
{
    width: 22%;
    display: flex;
    flex-direction: column;
    position: relative;
    left: -5%;
}
.flex-2column-row
{
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-left: 18%;
    box-sizing: border-box;
    height: 100%;
    position: relative;
    justify-content: center;
    bottom: -6px;
}
.flex-2column-row > div
{
    display: flex;
    flex: 1;
    align-items: flex-end;
}
/* 首頁 - 標籤內容 */
.inx-tag-content
{
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    font-size: 20px;
    margin-bottom: 20px;
}
/* 首頁 - Materials ~ Battery Modules 標籤內容 */
.inx-tag-content-flex-1column
{
    width: 66%;
    display: flex;
    flex-direction: column;
    right: -6%;
    position: relative;
}
/* 首頁 - LIB */
.flex-1column-1row
{
    display: flex;
    width: 100%;
    font-size: 20px;
    color: red;
    padding-top: 50px;
    box-sizing: border-box;
}
.flex-materials-1content
{
    display: flex;
    flex-direction: column;
    width: 33.5%;
    justify-content: center;
    align-items: center;
    position: relative;
}
.flex-cells-1content
{
    width: 33.5%;
    display: flex;
    position: relative;
    left: -6%;
    justify-content: center;
    align-items: flex-end;
}
/* 首頁 - SSB */
.flex-battery-modules-1content
{
    width: 33.5%;
    display: flex;
    position: relative;
    left: -6%;
    justify-content: center;
    align-items: flex-end;
}
.flex-materials-1content-box
{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-right: 11%;
    width: 100%;
    box-sizing: border-box;
}
.flex-cells-1content-box
{
    display: flex;
    flex-direction: column;
    width: 100%;
    justify-content: center;
    align-items: center;
    padding-right: 11%;
    padding-left: 6%;
    box-sizing: border-box;
    position: relative;
    bottom: -6px;
}
.flex-battery-modules-1content-box
{
    display: flex;
    flex-direction: column;
    width: 100%;
    justify-content: center;
    align-items: center;
    padding-right: 11%;
    padding-left: 6%;
    box-sizing: border-box;
    position: relative;
    bottom: -6px;
}

.inx-content-column-red-dashed
{
    display: block;
    position: absolute;
    height: calc(100% + 50px);
    bottom: 0;
    right: 11%;
    border-left: 2px dashed red;
}
.inx-content-column-indigo-dashed
{
    display: block;
    position: absolute;
    height: calc(100% + 176px);
    bottom: 0;
    right: 6.5%;
    border-left: 2px dashed #4a7dba;
}

.red-arrow-block,
.indigo-arrow-block
{
    position: relative;
    display: flex;
    width: 100%;
    justify-content: start;
}
.red-arrow-line
{
    width: calc(89% - 15px);
    height: 5px;
    background: red;
    display: flex;
    margin-top: 11px;
    margin-right: 10px;
    position: relative;
    z-index: 5;
    left: 0;
}
.indigo-arrow-line
{
    width: calc(94% - 15px);
    height: 5px;
    background: #4a7dba;
    display: flex;
    margin-top: 11px;
    margin-right: 10px;
    position: relative;
    z-index: 5;
    left: 0;
}
.svg-tag-arrow
{
    position: absolute;
    right: 12%;
    top: 0;
    height: 25px;
    width: 30px;
}

.indigo-svg-tag-arrow
{
    position: absolute;
    right: 7%;
    top: 0;
    height: 25px;
    width: 30px;
}

.flex-1column-2row
{
    display: flex;
    flex-direction: row;
    width: 100%;
    font-size: 20px;
    color: #366092;
    padding-top: 50px;
    box-sizing: border-box;
}
.flex-materials-cells-1content
{
    display: flex;
    flex-direction: column;
    width: 61%;
    justify-content: center;
    align-items: center;
    position: relative;
}
.flex-materials-cells-1content-box
{
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding-right: 4%;
    box-sizing: border-box;
}
.flex-materials-cells-1content-box-row
{
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
}
.flex-materials-cells-1content-box-row .flex-row-center
{
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
}

.index-footer-text
{
    display: block;
    text-align: center;
    margin: 50px 0 70px;
}
.index-footer-text div
{
    display: inline-block;
    padding: 0 5px;
    color: #3f3f3f;
    font-size: 18px;
}


/*關於我們*/
.about-content
{
    display: flex;
    flex-direction: column;
    margin: auto;
    min-height: calc(100vh - 269px);
    padding-bottom: 60px;
    box-sizing: border-box;
    max-width: 1200px;
}
.about-p
{
    width: 83%;
    display: flex;
    text-indent: 2em;
    padding: 20px 0 0;
    margin: auto;
    font-size: 20px;
    line-height: 1.3;
}

.about-img-row
{
    max-width: 90%;
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: center;
    align-items: center;
    margin: 50px auto 20px;
}
.about-img-div-column
{
    display: flex;
    flex-direction: row;
    flex: 1;
}
.about-img-div
{
    display: flex;
    flex-direction: column;
    flex: 1;
}
.about-img-div img
{
    width: 100%;
    height: 100%;
    max-width: 200px;
    max-height: 95px;
    margin: auto;
}
.about-img-div p
{
    text-align: center;
    margin-top: 5px;
    font-size: 18px;
    height: 2em;
}


/*技術-共用*/
.technology-content
{
    display: flex;
    flex-direction: row;
    justify-content: center;
    min-height: calc(100vh - 279px);
    padding-bottom: 60px;
}
.technology-column
{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0 35px 0 0;
}
.technology-width
{
    width: 60%;
}
.technology-list
{
    background-color: rgb(51, 51, 153);
    color: rgb(165, 165, 165);
    width: 120px;
    align-items: center;
    height: 38px;
    display: flex;
    margin: 7px 15px;
    justify-content: center;
    cursor: pointer;
    font-size: 20px;
}
.technology-list.act
{
    color: white;
}
.technology-red-text
{
    color: red;
    margin: 30px 13px 28px 13px;
    font-size: 24px;
    display: flex;
    align-items: center;
    line-height: 30px;
    width: 100%;
}
.technology-p
{
    text-indent: 2em;
    /* display: flex; */
    width: 100%;
    align-items: center;
    font-size: 20px;
    margin: 10px 0;
    line-height: 26px;
}


/*技術-list*/
.technology-img-list
{
    display: flex;
    align-items: center;
    margin-bottom: 30px;
}
.technology-img-list > img
{
    width: 100%;
}


/*技術-ssb*/
.technology-column-ssb
{
    margin-bottom: 50px;
}
.technology-ssb-p
{
    text-indent: 2em;
    margin-top: 30px;
    font-size: 20px;
    line-height: 26px;
    width: 100%;
}
.technology-ssb-p:nth-last-child(2)
{
    margin-bottom: 40px;
}

/*技術-road*/
.technology-ul
{
    display: flex;
    color: blue;
    font-size: 22px;
    flex-direction: column;
    margin-bottom: 10%;
    margin-top: 20px;
    width: 100%;
}
.technology-ul li
{
    list-style-type: disc;
    margin: 10px 0;
    line-height: 26px;
}
.technology-part2
{
    font-size: 28px;
    font-weight: bold;
    width: 100%;
}
.technology-part2 p
{
    margin: 5px 0;
    text-align: center;
}
.technology-part2 p:nth-child(1)
{
    text-align: center;
}
.technology-part2 p:nth-child(2)
{
    margin: 5px 0 30px;
}
.technology-img, .technology-img img
{
    display: flex;
    width: 100%;
    margin: auto;
    max-width: 780px;
}

/*產品-list*/
.product-content
{
    display: flex;
    flex-direction: row;
    justify-content: center;
    min-height: calc(100vh - 279px);
    padding-bottom: 60px;
}
.product-column
{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0 35px 0 0;
}
.product-column:nth-child(2)
{
    padding-right: 20px;
}
.product-width
{
    width: 50%;
}
.product-list
{
    background-color: rgb(51, 51, 153);
    color: rgb(165, 165, 165);
    width: 120px;
    align-items: center;
    height: 38px;
    display: flex;
    margin: 7px 15px;
    justify-content: center;
    cursor: pointer;
    font-size: 20px;
}
.product-list.act
{
    color: white;
}
.product-red-text
{
    color: red;
    margin: 30px 13px 28px 13px;
    font-size: 24px;
    line-height: 28px;
    width: 100%;
}
.product-img, .product-img img
{
    width: 100%;
}
.product-img img
{
    display: block;
    margin: auto;
}

/*產品-list*/
.product-p
{
    margin-top: 15px;
    font-size: 20px;
    padding-left: 1em;
    text-indent: -1em;
    box-sizing: border-box;
    width: 100%;
    line-height: 1.2;
}
.product-p p
{
    margin-bottom: 10px;
}

/*產品-spe*/
.product-main-sspe
{
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 20px 0 10px;
    max-width: 700px;
    line-height: 1.2;
}
.product-part1-sspe
{
    color: red;
    margin-bottom: 10px;
    font-size: 24px;
    text-align: center;
}
.product-part2-sspe
{
    display: flex;
    flex-direction: row;
    font-size: 20px;
    align-items: center;
}
.product-part2-text
{
    margin: auto;
    font-size: 20px;
    text-indent: 2em;
    display: block;
    padding-right: 15px;
}
.product-part2-text:nth-last-child(1)
{
    padding: 10px 0 0;
}
.product-part2-imgtext-pos-sspe
{
    display: flex;
    align-items: center;
}
.product-part2-imgtext-sspe
{
    position: relative;
    display: block;
}
.product-part2-imgtext-text-sspe
{
    position: absolute;
    display: inline-block;
    font-size: 16px;
    text-align: center;
    width: 100%;
    top: 5px;
}
.product-part2-imgtext-img-sspe
{
    display: block;
    margin: auto;
}
.product-p-sspe
{
    font-size: 20px;
    margin: 10px 0 20px 1em;
    text-indent: -1em;
}
.product-p-sspe:nth-child(1)
{
    padding: 5px 0;
}
.product-p-sspe p
{
    margin-bottom: 10px;
}
.product-img-spe, .product-img-spe img
{
    width: 100%;
    max-width: 700px;
}

/*產品-ssb*/
.product-width-ssb
{
    width: 80%;
    max-width: 1000px;
}
.product-ul
{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    width: 100%;
}
.product-ul-mobile
{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    width: 100%;
}
.product-li
{
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    margin: 10px 0;
    flex: 1;
}
.product-li-flex3
{
    flex: 3;
}
.product-li-text
{
    display: flex;
    flex-direction: column;
    width: 100%;
    justify-content: center;
    padding-right: 10px;
    box-sizing: border-box;
    flex: 1;
}
.product-li-text div
{
    line-height: 1.5;
}
.product-li-text > div:nth-child(1)
{
    margin-left: 1.5em;
    text-indent: -1.5em;
}
.product-li-text > div:nth-child(2)
{
    margin-left: 1.5em;
}
.product-li.product-li-flex3 .product-li-text-img
{
    display: none;
    margin: auto;
}
.product-li-img
{
    display: flex;
    height: 70px;
    width: 130px;
    flex: 1;
    padding: 10px 0;
}
.product-li-img2
{
    padding: 20px 0;
    width: 80%;
    flex: 2;
    flex-direction: column;
}
.product-li-img img
{
    width: 100%;
    height: 100%;
}
.product-li-img2 img
{
    display: flex;
    width: 100%;
}
.product-li-img2-mobile
{
    display: flex;
    flex-direction: row;
    display: none;
}
.product-li-img2-mobile .product-li-img2 img
{
    width: 50%;
    margin: auto;
}
.product-li-img-text
{
    display: flex;
    flex-direction: column;
}
.product-li-img-text div
{
    display: flex;
    margin: auto;
}
.font-bold
{
    font-weight: bold;
}

/*產品-ssbb*/
.product-column-ssbb
{
    padding: 30px;
    box-sizing: border-box;
}
.product-part1-ssbb
{
    color: red;
    font-size: 24px;
    text-align: center;
    font-weight: bold;
}
.product-part2-ssbb
{
    text-indent: 1em;
    margin-bottom: 45px;
    line-height: 22px;
    margin-top: 20px;
    display: flex;
    flex-direction: row;
}
.product-part2-text-ssbb
{
    display: flex;
    align-items: center;
    padding-right: 15px;
}
.product-part2-img-ssbb
{
    display: flex;
    align-items: center;
    position: relative;
}
.product-part2-img-ssbb img
{
    display: block;
    height: 130px;
}
.product-part2-img-float-txt
{
    display: block;
    position: absolute;
    top: 5px;
    color: #000000;
    width: 100%;
}
.product-part3-ssbb
{
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-bottom: 30px;
}


/*服務*/
.service-content
{
    min-height: calc(100vh - 289px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px 10px 50px;
    box-sizing: border-box;
}
.service-title
{
    color: red;
    font-size: 24px;
    font-weight: bold;
    margin: 10px 0;
    text-align: center;
}
.service-ul
{
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 22px;
    width: 80%;
    max-width: 680px;
}
.service-li
{
    margin: 25px 0;
}
.service-li-title
{
    text-indent: -1.5em;
    margin-left: 1.5em;
    margin-bottom: 10px;
}
.service-li-text
{
    margin-left: 1.5em;
    line-height: 28px;
}


/*聯繫*/
.contact
{
    display: flex;
    min-height: calc(100vh - 270px);
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 20px 10px 70px;
    box-sizing: border-box;
}
.contact-title
{
    display: flex;
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 20px;
}
.contact-name
{
    display: flex;
    font-size: 20px;
    text-align: center;
}
.contact-row
{
    display: flex;
    flex-direction: row;
}
.contact-row div
{
    font-size: 22px;
}
.contact-row div:nth-child(1)
{
    padding: 0 10px 10px 0;
}
.contact-decoration
{
    text-decoration: underline;
}
.contact-row > div:nth-child(2)
{
    font-weight: bold;
}

/*電池區塊*/
.battery-block
{
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 80px;
    margin-right: 20px;
}
.battery-lr
{
    border: 10px solid yellow;
    width: 20%;
    height: 60px;
    position: relative;
}
.battery-left
{
    background: #9900cc;
}
.battery-oval
{
    border: #d8f8f8 solid;
    border-radius: 50%;
    width: 40px;
    margin: auto;
}
.battery-ca
{
    color: white;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
}
.battery-text
{
    font-size: 17px;
    font-weight: bold;
    text-align: center;
    color: white;
    position: absolute;
    bottom: 10px;
    width: 100%;
}

.battery-right
{
    background: #00b050;
}

.battery-center
{
    background-color: #00b0f0;
    width: 60%;
    justify-content: center;
    display: flex;
    align-items: center;
    position: relative;
}
.battery-center div
{
    color: white;
    font-size: 18px;
    text-align: center;
    padding: 0 10px;
    box-sizing: border-box;
    line-height: 22px;
}

.battery-line
{
    position: absolute;
    width: 1px;
    height: 25px;
    bottom: -33px;
    background: black;
}
.line-left
{
    right: -6px;
}
.line-right
{
    left: -6px;
}
.line-level
{
    position: absolute;
    height: 1px;
    width: 35px;
    bottom: 0;
    background: black;
}
.level-left
{
    left: 0;
}
.level-right
{
    right: 0;
}
.line-arrow
{
    width: 0;
    height: 0;
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
    position: absolute;
    top: -2px;
}
.line-arrow-left
{
    border-left: 7px solid black;
    right: -6px;
}
.line-arrow-right
{
    border-right: 7px solid black;
    left: -6px;
}
.battery-center .arrow-text
{
    position: absolute;
    top: 80px;
    color: black;
    max-width: calc(100% - 75px);
    height: 44px;
    justify-content: center;
    align-items: center;
    display: flex;
    margin: auto;
    padding: 0;
}