@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

body{font-family:"微軟正黑體","Roboto","sans-serif";}

.main_header_area {
	padding: 14px 0;
	height: 110px;
	border-top: 11px solid #0657B0;
	/* background: linear-gradient(to top, rgb(0 0 0 / 0%) 0%, rgb(57 131 223) 100%); */
	/* box-shadow:6px 0 10px 0 rgb(0 0 0 / 54%); */
	padding: 0 0 14px 0;
	background: linear-gradient(to top, rgb(0 0 0 / 0%) 0%, rgb(36 100 179) 100%);
}
.nav-brand {
    width: 100%;
}
.navigation {
    padding: 10px 35px 10px 350px;
}
.main_header_area .container {
    max-width: 100%;
}
.me_tp_features {display: none;}
.stellarnav ul {margin-top: 20px;}
.stellarnav > ul > li > a:hover {
	color: #c8e2ff;
}
.stellarnav li.has-sub > a:hover:after {
    border-top: 6px solid #e5f1ff !important;
}
.stellarnav ul ul {
    top: 20px;
}
.stellarnav li li:hover > a , .stellarnav li li.has-sub:hover > a{
    background: rgb(48, 122, 212);
    color: #fff;
}
.nav-header {
    position: absolute;
    z-index: 123;
    top: 0px;
    left: 0;
    background: linear-gradient(to top, rgb(0 0 0 / 0%) 0%, rgb(255 255 255) 100%);
    padding: 4px 55px 0px 45px;
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 85% 100%, 0% 100%);
}
.header_area.sticky .main_header_area {
    background: #ffffffe6;
    transition: 0.5s;
}
.header_area {
    position: absolute;
    z-index: 9999;
    top: 0;
    left: 0;
    transition: 0.5s;
    width: 100%;
}
.main_header_area {
    transition: 0.5s;}    
.sticky .stellarnav > ul > li > a {
    color: #0657B0;
}
.sticky .stellarnav > ul > li:hover > a {
    color: #0084d5;
}
.sticky .stellarnav > ul > li > a::before {background-color:#0084d5;}    
.stellarnav li.has-sub > a:after {
    border-top: 6px solid #b8cbe1;
}
.swiper-slide img {height: auto;}

/* .stellarnav > ul > li.drop-left > ul {
    right: -60px;
} */

.path p,
.path p a { display: none;}

.stellarnav > ul > li.drop-left > ul {
    right: -60px;
}

/* = = = = = = = =浮動按鈕= = = = = = = = = = =  */

.footer_info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding: 0;
}

.info_fix{ bottom: 108px; right: 14px;}
.info_fix>span{background: #888;}
.info_fix:hover >span{ background-color: #636363;}
.info_fix_links a:hover {
    background: #fff;/*#e5f8fda8*/
}

.info_fix_links a {
            position: relative;
            display: inline-block;
            background: #fff;
            border-radius: 50%;
            overflow: hidden;
        }

        .info_fix_links a::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border: 4px solid #2f8699;
            border-right: 4px solid #42aec2;
            border-bottom: 4px solid #42aec2;
            border-radius: 50%;
            box-sizing: border-box;
            transform-origin: center;
        }

        .info_fix_links a:hover::before {
            animation: loading 1.75s infinite linear;
        }
.stellarnav > ul > li > a{transition:all 0.3s; color: #0657B0; font-weight: bold;
    font-size: 18px;}

        @keyframes loading {
            from {
                transform: rotate(0deg);
            }
            to {
                transform: rotate(360deg);
            }
        }

.info_fix_links .info_fix_phone{ order: 1;}
.info_fix_links .info_fix_line { order:2;}
.info_fix_links .info_fix_ig { order:5;}
.info_fix_links .info_fix_fb { order:3;}
.info_fix_links .info_fix_mail{ display: none;}
.info_fix_ig span::before{ background-image: url(https://pic03.eapple.com.tw/hongjhih/fix_mg-01.svg);}
.info_fix_tel span::before{background-image: url(https://pic03.eapple.com.tw/hongjhih/fix_yuanchuan-01.svg);}
.info_fix_tel2 span::before{background-image: url(https://pic03.eapple.com.tw/hongjhih/fix_zhonghua-01.svg);}
.info_fix_line span::before{background-image: url(https://pic03.eapple.com.tw/hongjhih/fix_line-01-01.svg);}
.info_fix_fb span::before{background-image: url(https://pic03.eapple.com.tw/hongjhih/fix_fb-01-01.svg);}
.info_fix_links .info_fix_phone {display: none;}


/* = = = = 內頁banner = = = = = = =  */
.banA {
    background-image: url(https://pic03.eapple.com.tw/hongjhih/smallbanner1.jpg);
}
.banB {
    background-image: url(https://pic03.eapple.com.tw/hongjhih/smallbanner2.jpg);
}
.banblog {
    background-image: url(https://pic03.eapple.com.tw/hongjhih/smallbanner3.jpg);
}
.banF {
    background-image: url(https://pic03.eapple.com.tw/hongjhih/smallbanner1.jpg);
}
.banner {
    font-size: 40px;
    padding: 65px 0;
    text-align: center;
    height: 300px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    line-height: 219px;
    box-shadow: none;
}
.banner h5 {
    font-weight: 600;
}


/* = = = = = = = =footer資訊= = = = = = = = = = =  */
.footer_info {
    display: flex;
    padding: 0;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    padding-left: 300px;
    padding-right: 60px;
}
.footer_info ul {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-family: "Noto Sans TC", sans-serif;
}
.footer_info li {
    display:flex;
    width: 100%;
	flex-direction:column;
}
.footer {background: #fff;border-top: 1px solid #6B7079;}
.footer_info li p.tel:before { content:'遠傳：';}
.footer_info li p.tel2:before { content:'中華：';}
.footer_info li p.fax {display: none;}
.footer_info li p.phone {display: none;}
.footer_info li p.tel {order: 1;}
.footer_info li p.tel2 {order: 2;}
.footer_info li p.line {order: 3;}
.footer_info li p.mail {order: 4;}
.footer_info li p.add {order: 5;}

.box_link {display: none;}

.footer_menu a {border: 1px #c5dae9 solid; color: #2a537f; background: #dae7f1;}
.footer_menu a:hover {background: #3e5f9d;}
.center {max-width: 100%;}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*文章設定*/
/*一排呈現
.subbox_item { width:100%;}
*/
.blog_list_ri h5 {    color: #fff;    font-weight: bold;    letter-spacing: 3px;}
.blog_list_ri em {    display: none;}
.blog_list_ri p {    color: rgb(255 255 255 / 78%);    margin-top: 10px;}

.blog_box_edit {    line-height: 180%;    text-align: justify;    background-color: rgb(245 247 249 / 90%);    border-radius: 15px;    padding: 30px;    min-height: 70vh;}
.blog_le .accordion > li {    transition: all 0.3s;}
.blog_le .accordion > li:hover, .blog_le .accordion > li.on_this_category {    background: #4a7ebf !important;}
.subbox_item a:before , .subbox_item a:after {    transition: 0.3s;}

.blog_le .accordion {    border: 1px #54668b solid;    background: #4a7ebf;}
.accordion li .link {    padding: 0;}
.link a {    width: 100%;    display: block;    padding: 15px 10px;    color: #fff;}
.link a:hover {    width: 100%;    display: block;    padding: 15px 10px;    color: #fff;    background: linear-gradient(95deg, #355c8c, transparent);}

.blog_page #content, .blog_in_page #content {    background-image: url(https://pic03.eapple.com.tw/hongjhih/aa-bg007-1.jpg);    background-position: top;    background-repeat: repeat-y;    background-color: #3c4b6a;    background-size: contain;    position: relative;}

.blog_back {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin: 0 0 0 auto;
    max-width: calc(100% - 240px);
}
.blog_back a {    width: calc((100% - 20px) / 3);}
.blog_back a.article_btn_prev , .blog_back a.article_btn_next {    background: #6583a1;    color: #f0f8ff;}

.blog_back a.article_btn_back {background: #4a7ba56e;color: #f0f8ff;}

/*文章分享變1排3個*/
.blog_page .main_part , .blog_in_page .main_part {    max-width: 1400px;padding-bottom: 50px;}
.blog_page .main_part:after, .blog_in_page .main_part:after {
    content: "";
    width: 90%;
    max-width: 100%;
    max-height: 125px;
    margin: 0 auto;
    height: 25vw;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 5%;
    position: absolute;
    bottom: 50px;
    left: 0;
}
.blog_subbox {    display: flex;    flex-wrap: wrap;    justify-content: flex-start;}
.blog_box {    position: relative;    z-index: 2;}

.subbox_item {    display: block;    width: 100%;    float: none;    margin-bottom: 15px;    position: relative;    padding: 5px;}
.subbox_item a {    display: flex;    border-radius: 15px 0 0 15px;    flex-wrap: wrap;    overflow: hidden;}
.subbox_item a:before {
    content: 'MORE';
    top: unset;
    left: unset;
    right: 25px;
    bottom: 25px;
    width: 50px;
    height: 50px;
    background: rgb(102 136 194 / 55%);
    font-size: 13px;
    letter-spacing: 1px;
    text-indent: -1px;
    color: #fff;
    padding: 17px 5px;
    border-radius: 100%;
    opacity: 0;
    transform: none;
}
.subbox_item a:hover:before {
    transform: none;
    opacity: 1;
    transition: all 500ms;
}
.subbox_item a:after {    content: none;}

.blog_list_ri {    width: calc(100% - 200px);    padding: 2.5vw;    background: linear-gradient(90deg, rgb(44 95 161 / 80%), transparent);}
.blog_list_le {    padding: 0px;    width: 200px;    position: relative;}
.blog_list_le img {    max-width: 100%; width: 100%;}
.blog_list_le:before {
    content: "";
    background: linear-gradient(90deg, rgb(117 148 217), transparent);
    position: absolute;
    width: 0;
    height: 100%;
    opacity: 0;
    transition: all 0.3s;
}
.subbox_item a:hover .blog_list_le:before {    width: 100%;    opacity: 1;}

.blog_in_page h4.blog_category_title { padding-left: 50px;}
.blog_in_page h4.blog_category_title::before {    content: "";    position: absolute;    background-image: url(https://pic03.eapple.com.tw/hongjhih/03.png);    width: 42px;    height: 62px;    top: -10px;    left: 0;    z-index: -1;}
h4.blog_category_title {    font-size: 30px;    margin-bottom: 30px;    text-align: justify;    color: rgb(44 95 161);    border-bottom: 1px #a3afcc solid;    letter-spacing: 5px;    position: relative;}
h4.blog_category_title em:after {   content: '>';  display: inline-block;    vertical-align: middle;    font-size: 15px;    color: #a3afcc; margin: 0 10px; font-weight: 100;}
h4.blog_category_title span {   font-size: 18px;    color: #a3afcc;     font-weight: 500;}


/*= = = = 產品介紹 = = = = = = = */
/*購物車*/
.product_page {background-image: url(https://pic03.eapple.com.tw/hongjhih/aa-bg008.jpg);}
.product_page .products-list .name {color: #54668b;}
.product-layer-two li a {color: #3258ad;border: 1px #7695d9 solid;background-color: transparent;}
.product-layer-two li a:after {position: absolute;content: '';display: block;right: 0;top: 0;width: 0;height: 0;border-style: solid;border-width: 0 20px 15px 0;border-color: transparent #3258ad transparent transparent;}
.products-list .more {border: 1px solid #6e8fb1;color: #6e8fb1;}
.products-list .item a:hover .more {background: #6e8fb1;}
.lastaction {color: #43688f;background-color: #d7e7f7;}
.nextaction {background-color: #43688f;}
.lastPage {background: #43688f !important;}

/* -------------- */

/* 商品展示 */
.inquiry_a1 {background: #4c94d1;}
.inquiry_a3:hover {letter-spacing:2px;background: #364b79 !important;}

/* 詢價車 */
.send_simple {background: #3385cb url(../images/simple_right.png) 88% center no-repeat;}
.rewrite_simple {background: #729fc5 url(../images/simple_left.png) 10% center no-repeat;}

/*= = = = 最新消息 = = = = = = = */

.news_part .title_i_box h4 {
    font-size: 24px;
    color: #1d81bd;
    font-weight: 600;
}
.news_list ul li a:hover {
    background: #e5eef7;
}
.animated-arrow {
    background: #6e8fb1;
}

/*= = = = 最新消息 = = = = = = = */
.i_bg_t_img img:hover {transform: scale(1.0) !important;}

/*文章*/
.blog_le .accordion > li:hover .link, .blog_le .accordion > li.on_this_category .link {
    color: #85bded !important;
    background: #2c64cf;}
h5.blog_le_t {color: #2c64cf;}
.blog_le .accordion {border: 1px #85bded solid;}
h4.blog_category_title {border-bottom: 1px #85bded solid;}
.blog_back a.article_btn_back {
    background: #3f8fd3;}
.blog_back a.article_btn_prev {
    background: #2653ab;}
.blog_back a.article_btn_next {
    background: #2653ab;}
.subbox_item a:after {background: #2c64cf9e;
    border: 0px #ddd solid;}
.subbox_item a:before {color: #2c64cf;}

/* 促銷標題 */
.promotion_title span {border: 0px #ccc dashed;}
.promotion_title em {border: 0px #ccc dashed;}
.promotion_title h2 {color: #2c64cf;}

/*促銷*/

.other_promotion li:hover {
    border-top: 1px solid #598ae5;}
.other_promotion .pmtTitle h3 {
    color: #1e4897;}
.other_promotion li {
    border-top: 1px solid #85bded;
    width: 30.3%;
    float: left;
    padding: 5px 15px;
    margin: 20px 1.5%;}
.other_promotion li a {
    display: block;
    border: 0px #e5e5e5 dashed;
    padding: 10px;
    width: 96%;
    margin: 2%;
    position: relative;
    text-decoration: none;
    background-color: transparent;
}

/* = = = = = = 聯絡我們 = = = = = = = */

.ct_04 li:nth-of-type(2) {background: transparent !important;}






@media screen and (max-width: 1366px) {
    .c01 {padding: 20px 0 0 0 !important;}
    .a06 {max-width: 1300px !important;}
    .i_bg_t_banner_text {padding: 220px 75px 130px 75px !important;}
    .ct_02 {padding: 80px 50px !important;}
}

@media screen and (max-width: 1024px) {
.subbox_item {    width: 50%;}
.subbox_item a {    border-radius: 15px 15px 0 0;    height: 100%;}
.subbox_item a:before {    left: 50%;    transform: translateX(-50%);    bottom: 10px;}
.subbox_item a:hover:before {    transform: translateX(-50%);}
.a03::after {background-position: 0px !important;}
.c01 {background-image: url('https://pic03.eapple.com.tw/hongjhih/aa-bg003-1.jpg') !important;}
.i_bg_t_banner {background-position: 50% !important;}
.content1 {display: block !important;}
.i_bg_t_box2 {width: 600px !important;}
.content1 .i_bg_t_text {height: 350px;}
.content2 {height: 480px; padding: 30px 0 30px 0 !important; display: flex; flex-direction: column;}

.blog_list_ri {    width: 100%;    height: 100%;    padding: 15px;    padding-bottom: 70px;    background: linear-gradient(0deg, rgb(42 126 195) 0%, rgb(33 77 131) 100%);}
.blog_list_le {    width: 100%;}
.footer_info {padding-left: 90px;}
}

@media screen and (max-width: 800px) {
    .footer_info {
        align-items: baseline;;
        flex-direction: column;
        align-content: flex-start;
    }
}

@media screen and (max-width: 768px) {
    .header_area {position: relative;}
    .main_header_area {height: 60px; background: linear-gradient(to top, rgb(42 126 195) 0%, rgb(33 77 131) 100%);}
    .navigation {padding: 0;}
    .nav-header {position: static; text-align: center; background: #fff; padding: 6px 55px 6px 25px; height: 75px;}
    .nav-brand img {margin: -13px 0 0px 0;}
    .stellarnav.mobile {padding-top: 12px;}
    .stellarnav ul ul {top: 0px;}
    .stellarnav ul {margin-top: 0px;}
    .stellarnav.mobile.right .close-menu, .stellarnav.mobile.left .close-menu {background: #dde8f7;}
    .stellarnav.mobile li.open {background: #edf3fb; padding:0px}
    .i_bg_t_banner {background-position: 55%;}
    .i_bg_t_contentbox2 .i_bg_t_box .i_bg_t_content.content2 .i_bg_t_img.img2.in-view img {margin-right: 0px;}
    .ct_03 li > figure {margin: 0 auto;}
    .blog_back {max-width: 100%;}
    .banner { height: 185px; line-height: 150px; padding: 20px 0;}
    .stellarnav > ul > li.drop-left > ul {right: 0px;}

    /* 最新消息 */
    .other_promotion li {border-top: 1px solid #85bded; width: 45%;float: left; padding: 0px 10px; margin: 20px 1%;}


    /*Footer/＝＝＝＝＝*/
#to_top { bottom:60px;}
#bottom_menu {display: block; }
.footer.with_shopping_mode { padding:0px 0 60px; }
.footer_info {    justify-content: center; flex-direction: column; padding: 0 40px;}
.footer_logo {    text-align: center;}
.header_area.sticky .main_header_area {background: linear-gradient(to top, rgb(42 126 195) 0%, rgb(33 77 131) 100%);}
.center {    max-width: 100%;}
.footer_menu {display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100px, 100%), 1fr)); gap: 5px; text-align: center;}


/* = = = = 手機板下方按鈕 = = = = = = = */


/* 隐藏所有 'em' 元素的文字 */
#bottom_menu li a em {
    position: relative;
    color: transparent; /* 隐藏文字 */
    overflow: hidden;
    white-space: nowrap;
}

/* 为第二个 'em' 元素（电话1）添加新文字 */
#bottom_menu li:nth-of-type(2) a em::before {
    content: "遠傳"; /* 新的文字内容 */
    position: absolute;
    top: 0;
    left: 0;
    color: black; /* 设置新文字颜色 */
    white-space: nowrap;
    width: 100%; /* 确保新文字显示在原文字位置上 */
    height: 100%; /* 确保新文字显示在原文字位置上 */
    display: block;
}

/* 为第三个 'em' 元素（电话2）添加新文字 */
#bottom_menu li:nth-of-type(3) a em::before {
    content: "中華"; /* 新的文字内容 */
    position: absolute;
    top: 0;
    left: 0;
    color: black; /* 设置新文字颜色 */
    white-space: nowrap;
    width: 100%; /* 确保新文字显示在原文字位置上 */
    height: 100%; /* 确保新文字显示在原文字位置上 */
    display: block;
}

/* 确保 '回首頁' 的文字不会被伪元素覆盖 */
#bottom_menu li:nth-of-type(1) a em {
    position: relative; /* 为第一个元素保持相对定位 */
    color: black; /* 确保 '回首頁' 文字正常显示 */
}

/* = = = = = = 手機板下方按鈕結束 = = = = = = = = = = = =  */

/* 聯絡我們 */
.ct_02 em {right: -60px !important;}

}



@media screen and (max-width: 600px) {
.subbox_item {    width: 100%;}
.blog_back {    width: 95%;}
.footer_info {padding: 0 10px;}
}

@media screen and (max-width: 470px) {
.i_bg_t_banner_text {padding: 80px 20px !important;}
}

@media screen and (max-width: 400px) {
.main_header_area {height: 50px;}
.nav-header {padding: 6px 35px 6px 25px;}
.nav-brand, .header_area.sticky .nav-brand {max-width: 215px;}
.nav-brand img {margin: 0px 0 0px 0;}
.stellarnav.mobile {padding-top: 7px;}
.i_bg_t_banner_text {padding: 80px 20px !important;}
.other_promotion li {width: 92%; margin-right: 4%; margin-left: 4%;}
.ct_02 section > figure {display: none !important;}
.ct_02 em {display: none !important;}
.ct_02::after {display: none}
.cc {margin: 5px;}
.ct_03 li > figure a {min-width: 50px !important; min-height: 50px !important;}
.ct_03 li > figure a img {width: 36px !important;}

}


/**/


