﻿@charset "utf-8";
@font-face { font-family: NotoSansTC-Bold; src: url(../fonts/NotoSansTC-Bold.ttf); }
@font-face { font-family: NotoSansTC-Medium; src: url(../fonts/NotoSansTC-Medium.ttf); }

@font-face { font-family: NotoSansTC-Regular; src: url(../fonts/NotoSansTC-Regular.ttf); }

@font-face { font-family: Roboto-Regular; src: url(../fonts/Roboto-Regular.ttf); }

@font-face { font-family: MicrosoftJhengHei-Regular; src: url(../fonts/MSJH.TTC); }
body, dd, div, dl, dt, form, h1, h2, h3, h4, h5, h6, input, li, ol, p, td, textarea, th, ul { margin: 0; padding: 0; -webkit-text-size-adjust: none; }
::-webkit-scrollbar { width: 10px; }

::-webkit-scrollbar-track { -webkit-box-shadow: inset006pxrgba(0,0,0,0.3); }

::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.3); -webkit-box-shadow: inset006pxrgba(0,0,0,0.5); }

table { border-collapse: collapse; border-spacing: 0; }

label { font-weight: 400; margin-bottom: 0; }

h1, .h1, h2, .h2, h3, .h3 { margin: 0; }

a:focus, button:focus, input:focus, .btn:focus, .form-control:focus, select:focus, input[type=checkbox]:focus, input[type=radio]:focus, textarea:focus { outline: none; box-shadow: none; }

img { border: 0; display: block; }

ol, ul { list-style: none; }
a { transition: all .3s; }
a, a:focus, a:hover { text-decoration: none; }
button, input, select, textarea { outline: 0; border-radius: 0; font-family: 'Noto Sans TC', '微軟正黑體','Microsoft JhengHei',Arial,Helvetica,Sans-Serif; }

body, html { overflow-x: hidden; width: 100%; background: #fff; color: #231815; font-size: 1em; font-family: 'Noto Sans TC', '微軟正黑體','Microsoft JhengHei',Arial,Helvetica,Sans-Serif; }

body { position: relative; min-height: 100%; overflow: inherit !important; }

* { box-sizing: border-box; }

.modal-header .close { font-size: 2em; }

.container { padding: 0; }

.form-control:focus { box-shadow: inherit; }

textarea.form-control { padding: 10px; }

.white-content { background: #fff; padding: 30px; }

.select-top-wrap { margin-bottom: 20px; }

img { max-width: 100%; max-height: 100%; }
table img { max-height: inherit; }

.visible { position: absolute; left: -99999px; top: -99999px; }
.h100 { height: 100%; }

.w100 { width: 100%; }

select::-ms-expand { display: none; }
.warp { width: 1340px; margin: 0 auto; position: relative; }

/* header */
.header { width: 100%; position: fixed; background-color: #fff; z-index: 10; }
.header .wrapper { transition: .8s ease-in-out; padding: 40px 27px; }
.header-top .nav-img { width: 40px; }
.header-top-nav li { float: left; margin-left: 23px; }
.header-top-nav li a { display: inline-block; font-family: NotoSansTC-Regular; font-size: 18px; color: #222222; letter-spacing: 1.8px; line-height: 18px; -webkit-transition: -webkit-transform .3s; transition: -webkit-transform .3s; transition: transform .3s; transition: transform .3s,-webkit-transform .3s; }
.header-nav .menu-pc .sub-menu li > .isClose::after { content: "+"; width: 15px; margin-top: 9px; margin-left: 10px; }
.header-nav .menu-pc .sub-menu li > .isOpen::after { content: "-"; }
.header-top-nav li a:hover { color: #2ACF60; }
.header-top h1 a { display: block; width: 380px; }
.header-top { height: auto; }
.header-top .top-warp { height: auto; display: flex; justify-content: space-between; align-items: center; }
.header--shrink { padding: 20px 27px; height: auto; display: flex; justify-content: space-between; align-items: center; transition: .8s ease-in-out; }
.header-top .warp img { transition: .8s ease-in-out; }
.header--shrink .rwd { transition: .8s ease-in-out; }
.header-top-nav .cl { display: flex; align-items: center; }

/* header-search */
.header-search { position: fixed; width: 100%; height: 100%; background: #fff; top: 0px; display: none; z-index: 2; }
.header-search .warp { height: 100%; background: #f8f6f5; }
.header-search .close span { cursor: pointer; }
.header-search .input-search div { position: relative; }
.header-search .input-search input { position: relative; width: 100%; font-size: 30px; border: none; border-bottom: 1px #666 solid; background: none; }
.header-search .input-search button { position: absolute; right: 10px; border: none; background: none; }
.header-search .input-search .hotdes { font-family: NotoSansTC-Regular; font-size: 18px; color: #222222; letter-spacing: 1.8px; line-height: 18px; line-height: 26px; margin-top: 30px; }
.header-search .input-search .hotdes a { color: #222222; }
.header-search .input-search .hotdes a:hover { color: #2ACF60; }
.header-search .input-search .des { font-family: NotoSansTC-Regular; font-size: 18px; color: #222222; letter-spacing: 1.8px; line-height: 18px; line-height: 26px; margin-top: 30px; }
.header-search .input-search { width: 85%; margin: 0 auto; padding-top: 160px; }
.header-search .close { float: right; width: 136px; height: 90px; display: flex; justify-content: center; align-items: center; }



.header-nav { position: fixed; width: 100%; height: 100%; background: #fff; top: 0px; z-index: 2; display: none; }
.header-nav .warp { height: 100%; background: #f8f6f5; width: 1380px; padding: 27px 20px; }
.header-nav .close a { display: block; width: 380px; }
.header-nav .close .right { position: absolute; right: 20px; top: 32px; cursor: pointer; }
.header-nav .nav-ul { margin: 0 auto; width: 85%; line-height: 40px; margin-top: 40px; }
.header-nav .nav-ul .menu-pc { display: flex; justify-content: space-between; height: 280px; }
.header-nav .nav-ul .menu-ph { display: none; }
.header-nav .nav-ul li { min-width: 99px; line-height: 40px; margin-top: 20px; margin-bottom: 20px; }
.header-nav .nav-ul li li { width: 100%; float: none; margin: 0px; line-height: 35px; }
.header-nav .nav-ul li li div { width: 100%; border-left: 1px #000 solid; }
.header-nav .nav-ul li li div a { display: block; line-height: 30px; padding-left: 8px; }
.header-nav .nav-ul li a { font-family: NotoSansTC-Regular; font-size: 16px; color: #000; letter-spacing: 0.5px; text-align: justify; line-height: 16px; }
.header-nav .nav-ul li .main { font-family: NotoSansTC-Bold; font-size: 20px; color: #000; letter-spacing: 1.8px; line-height: 20px; }
.nav-hr { clear: both; height: 70px; }

.nav-click { display: none; }

.header-nav .nav-footer { margin: 0 auto; width: 85%; overflow: hidden; }
.header-nav .nav-footer .icon_wrapper { display: flex; float: left; }
.header-nav .nav-footer img { max-width: 42px; margin-right: 15px; }

.header-nav .nav-footer .text_wrapper { overflow: hidden; float: right; line-height: 42px; }
.header-nav .nav-footer .text_wrapper a { font-family: NotoSansTC-Medium; font-size: 18px; color: #222222; }
.header-nav .nav-footer .text_wrapper span > span { margin: 0 20px; }
.header-nav .nav-footer .text_wrapper div > span:nth-child(2) { margin-left: 0; }
.nav-footer .wel-nav { display: none; }

/* welcome*/
.welcome-div { position: fixed; width: 100%; height: 100%; background: #fff; top: 0px; z-index: 99; }
.welcome-div .welcome-header { position: absolute; top: 27px; width: 100%; z-index: 9; }
.welcome-div .welcome-header .warp > div { -webkit-transition: .3s ease-in-out; }
.welcome-div .welcome-header .active { display: none; }
.welcome-div .logo-white .wel-nav a { color: #fff; }
.welcome-div .logo-white .wel-nav span { color: #fff; }
.welcome-div .wel-nav { position: absolute; right: 20px; top: 10px; }
.welcome-div .wel-nav a { font-family: NotoSansTC-Medium; font-size: 18px; color: #222222; letter-spacing: 1.8px; line-height: 18px; margin-left: 20px; }
.welcome-div .wel-nav span { margin-left: 20px; }
/* .welcome-div .itemdiv { display: none; } */
.welcome-div .itemdiv img { width: 100%; height: 100%; }

.hr { clear: both; height: 1px; }
.hr40 { clear: both; height: 40px; }
/* content-banner (2021/7/27)*/
.content { padding-top: 118px; }
.content .content-banner .img { width: 100%; }
.content .content-banner h1 { line-height: 60px; }
.content .content-banner hr { border-color: #2ACF60;; }
.content .content-banner .notice { background-color: #fff; font-family: NotoSansTC-Medium; display: flex; justify-content: space-between; align-items: center; display: flex; align-items: center; }
.content .content-banner .notice .notice-con { display: flex; align-items: center; padding: 10px 0; }
.content .content-banner .notice span { display: inline-block; float: left; }
.content .content-banner .notice .span { width: 20px; height: 14px; border-bottom: 2px #2ACF60 solid; margin: 0 5px; }
.content .content-banner .notice .button-wrapper { top: 20px; text-outline: 0 0 #000; display: inline-block; }
.content .content-banner .notice .button-wrapper .btn-prev { cursor: pointer; display: block; width: 42px; height: 42px; margin-left: 180px; background-image: url(../images/index/icon_arrow_left.png); float: left; margin-right: 10px; }
.content .content-banner .notice .button-wrapper .btn-prev:hover { background-image: url(../images/index/icon_arrow_left_2.png); }
.content .content-banner .notice .button-wrapper .btn-next { cursor: pointer; display: block; width: 42px; height: 42px; margin-left: 20px; background-image: url(../images/index/icon_arrow_right.png); float: left; }
.content .content-banner .notice .button-wrapper .btn-next:hover { background-image: url(../images/index/icon_arrow_right_2.png); }
.content .content-banner .text { width: 960px; height: 30px; display: flex; align-items: center; justify-content: flex-end; font-family: NotoSansTC-Medium; font-size: 16px; color: #4A4A4A; letter-spacing: 1px; line-height: 20px; z-index: 1; }
.content .content-banner .text span { font-family: NotoSansTC-Bold; font-size: 16px; color: #4A4A4A; letter-spacing: 1px; line-height: 20px; }
.content .content-banner .text a { color: #4A4A4A; }
.content .content-banner .text .text-con { height: 20px; overflow: hidden; }
.content .content-banner .text .text-con div { display: none; }
.rwd768, .rwd375 { display: none; }
.rwd { display: block; }
/*content-exh*/

.content-exh { font-family: NotoSansTC-Regular; }
.content-exh .title { position: relative; padding-left: 93px; margin-top: 60px; }
.content-exh .title span { font-family: Roboto-Regular; font-size: 15px; color: #323232; letter-spacing: 1px; }
.content-exh .title .section_nav { position: relative; }
.content-exh .title .section_nav a { position: absolute; color: #000; display: block; right: 80px; top: 10px; border-bottom: 1px #000 solid; line-height: 30px; font-family: NotoSansTC-Bold; font-size: 15px; color: #333333; letter-spacing: 2px; }
.content-exh .card_grops-list { padding: 20px 80px 0 93px; width: 100%; }
.content-exh .mobile-list { display: none; }
.content-exh .pc-list { display: block; }
.content-exh .card_grops { display: flex; justify-content: space-between; }
.content-exh .card_item .img { position: relative; }
.content-exh .card_item .message { margin-top: 15px; width: 350px; }
.content-exh .card_item .message .type { display: block; width: 60px; height: 20px; line-height: 24px; background-color: #EAFFF1; font-family: NotoSansTC-Regular; font-size: 13px; color: #2ACF60; letter-spacing: 1px; text-align: center; margin-top: 14px; }
.content-exh .card_item .message p { font-family: Roboto-Regular; font-size: 16px; color: #676767; letter-spacing: 0.5px; text-align: justify; line-height: 16px; margin-bottom: 8px; }
.content-exh .card_item .message .time { padding: 0 4px; }
.content-exh .card_item .name { display: block; width: 100%; font-family: NotoSansTC-Medium; font-size: 20px; color: #222222; letter-spacing: 1px; line-height: 24px; margin-bottom: 12px; }

/*content-eve*/

.content-eve { font-family: NotoSansTC-Regular; }
.content-eve .title { position: relative; padding-left: 93px; margin-top: 60px; }
.content-eve .title span { font-family: Roboto-Regular; }
.content-eve .title .section_nav { position: relative; }
.content-eve .title .section_nav a { position: absolute; color: #000; display: block; right: 80px; top: 10px; border-bottom: 1px #000 solid; line-height: 30px; font-family: NotoSansTC-Bold; font-size: 15px; color: #333333; letter-spacing: 2px; }
.content-eve .card_grops { position: relative; margin: 20px 80px 0 93px; display: flex; justify-content: space-between; }
.content-eve .card_item .img { position: relative; }
.content-eve .card_item .message { margin-top: 15px; }
.content-eve .card_item .message .type { display: block; width: 60px; height: 24px; line-height: 24px; background-color: #EAFFF1; font-family: NotoSansTC-Regular; font-size: 13px; color: #2ACF60; letter-spacing: 1px; text-align: center; line-height: 20px; margin-top: 14px; }
.content-eve .card_item .message p { font-family: Roboto-Regular; font-size: 16px; color: #676767; letter-spacing: 0.5px; text-align: justify; line-height: 16px; margin-bottom: 11px; }
.content-eve .card_item .message .time { padding: 0 4px; }
.content-eve .card_item .name { display: block; width: 255px; font-family: NotoSansTC-Medium; font-size: 20px; color: #222222; letter-spacing: 1px; line-height: 24px; margin-bottom: 12px; }

/*box-1*/
.box-1 { font-family: NotoSansTC-Regular; }
.box-1 .box-1-con { height: 914px; }
.box-1 .introduce_box { position: relative; width: 1170px; margin-left: 93px; height: 578px; background-color: #F5F5F5; margin-top: 100px; }
.box-1 .introduce_box .text_wrapper { position: relative; }
.box-1 .introduce_box .text_wrapper div { float: left; margin-top: 90px; }
.box-1 .introduce_box .text_wrapper .left_text { width: 440px; font-size: 16px; color: #222222; letter-spacing: 2px; }
.box-1 .introduce_box .text_wrapper .left_text span { display: block; line-height: 40px; margin-left: 150px; }
.box-1 .introduce_box .text_wrapper .description { width: 550px; line-height: 40px; }
.box-1 .introduce_box .text_wrapper .description .title { font-family: NotoSansTC-Bold; font-size: 31px; color: #222222; letter-spacing: 4px; line-height: 40px; }
.box-1 .introduce_box .text_wrapper .description p { font-size: 18px; color: #222222; letter-spacing: 1.5px; line-height: 34px; margin-top: 40px; }
.box-1 .introduce_box .text_wrapper .description a { color: #000; display: block; margin-top: 40px; border-bottom: 1px #000 solid; line-height: 30px; width: 120px; }
.box-1 .img-list { position: absolute; z-index: 1; left: 150px; top: 450px; }
.box-1 .img-list .img-list-con { width: 1170px; height: auto; overflow: hidden; }
.box-1 .img-list .owl-carousel { width: 1440px; height: 470px; }
.box-1 .img-list .owl-carousel .single-slide { width: 1440px; }
.box-1 .img-list .owl-carousel .mobile { display: none; }
.box-1 .img-list .owl-carousel .owl-item img { width: auto; }
.box-1 .img-list .owl-nav { display: none; }

.dis-block { display: block; }
/*box-2*/
.box-2 { font-family: NotoSansTC-Regular; width: 1420px; }
.box-2 .box-2-con { height: 940px; }
.box-2 .introduce_box { position: relative; width: 1290px; height: 478px; background-color: #F5F5F5; margin-top: 110px; }
.box-2 .introduce_box .text_wrapper { position: relative; }
.box-2 .introduce_box .text_wrapper div { float: left; margin-top: 90px; }
.box-2 .introduce_box .text_wrapper .left_text { width: 570px; font-size: 16px; color: #222222; letter-spacing: 2px; }
.box-2 .introduce_box .text_wrapper .left_text span { display: block; line-height: 40px; margin-left: 285px; }
.box-2 .introduce_box .text_wrapper .description { width: 550px; line-height: 40px; }
.box-2 .introduce_box .text_wrapper .description .title { font-family: NotoSansTC-Bold; font-size: 21px; color: #222222; letter-spacing: 4px; line-height: 40px; }
.box-2 .introduce_box .text_wrapper .description p { font-size: 18px; color: #222222; letter-spacing: 1.5px; line-height: 34px; margin-top: 20px; }
.box-2 .introduce_box .text_wrapper .description a { color: #000; display: block; margin-top: 40px; border-bottom: 1px #000 solid; line-height: 30px; width: 120px; }
.box-2 .img-list { position: absolute; z-index: 1; left: 285px; top: 370px; }
.box-2 .img-list .img-list-con { width: 1150px; height: 470px; }
.box-2 .img-list .owl-nav { display: none; }
.box-2 .img-list .dis-block div { width: 350px; height: 240px; }
.box-2 .img-list .dis-block a { color: #222; }
.box-2 .img-list .single-slide { line-height: 24px; font-family: NotoSansTC-Regular; font-size: 18px; color: #222222; letter-spacing: 1.5px; text-align: justify; line-height: 34px; }
.box-2 .img-list .dis-block span { display: block; color: #222222; margin-top: 20px; font-family: Roboto-Regular; font-size: 15px; color: #323232; letter-spacing: 1px; line-height: 15px; }
.box-2 .img-list .dis-block p { color: #222222; }
.box-2 .img-list .dis-block .title { font-family: NotoSansTC-Bold; font-size: 24px; color: #222222; letter-spacing: 2.4px; margin-top: 0px; line-height: 44px; margin-bottom: 20px; }

.box-2 .img-list .dis-block span { padding: 0 30px 0 10px; display: block; color: #222222; margin-top: 20px; font-family: Roboto-Regular; font-size: 15px; color: #323232; letter-spacing: 1px; line-height: 15px; }
.box-2 .img-list .dis-block p { color: #222222; padding: 0 30px 0 10px; }

/*content-imedia*/
.content-imedia { font-family: NotoSansTC-Regular; }
.content-imedia .title { position: relative; padding-left: 131px; font-size: 15px; color: #222222; letter-spacing: 1px; margin-bottom: 20px; padding: 0px; margin-top: 40px; margin-left: 136px; }
.content-imedia .title span { font-family: Roboto-Regular; }
.content-imedia .title .section_nav { position: relative; display: flex; justify-content: space-between; align-items: center; }
.content-imedia .title .section_nav a { color: #000; display: block; margin-right: 35px; border-bottom: 1px #000 solid; line-height: 30px; font-family: NotoSansTC-Bold; font-size: 15px; color: #333333; letter-spacing: 2px; }
.content-imedia .item_grops { position: relative; margin-top: 30px; }
.content-imedia .item_grops .video { width: 1304px; height: 725px; position: relative; }
.content-imedia .item_grops .video img { width: 100%; height: 100%; }
.content-imedia .item_grops .video .play { cursor: pointer; display: block; position: absolute; top: 35%; left: 43%; width: 200px; height: 200px; background: url(../images/index/play.png); background-size: cover; }
.content-imedia .prodice { width: 572px; font-size: 18px; color: #222222; letter-spacing: 1.5px; line-height: 34px; margin: 35px 0 100px 135px; min-height: 136px; }
.content-imedia .tag { width: 590px; height: 262px; background-color: #F2F3F4; padding: 60px 0px 0px 60px; position: absolute; top: 620px; right: -102px; cursor: pointer; }
.content-imedia .tag p { font-size: 30px; color: #222222; letter-spacing: 2px; line-height: 48px; font-family: NotoSansTC-Bold; }
.content-imedia .tag .title { margin-left: 0px; }
.imedia-con { display: none; }

/*content-new*/

.content-new { font-family: NotoSansTC-Regular; }
.content-new .content-new-con { display: inline-block; position: relative; }
.content-new .new-left { width: 850px; float: left; margin-right: 100px; }
.content-new .new-left .title { position: relative; padding-left: 135px; }
.content-new .new-left .title span { font-family: Roboto-Regular; }
.content-new .new-left .title .section_nav { display: flex; justify-content: space-between; align-items: center; }
.content-new .new-left .title .section_nav a { color: #000; display: block; border-bottom: 1px #000 solid; line-height: 30px; margin-right: 8px; }
.content-new .new-left .item_grops { position: relative; margin-top: 30px; }
.content-new .new-right { width: 350px; float: left; padding-top: 50px; text-align: center; }
.content-new .card_grops { width: 100%; }
.content-new .new-con { margin-left: 135px; position: relative; margin-top: 40px; }
.content-new .card_grops li { position: relative; padding-top: 14px; display: inline-block; border-top: 1px solid #EFEFEF; height: 70px; }
.content-new .card_grops li:hover { background-color: #efefef; }
.content-new .card_grops li span { float: left; display: block; width: 80px; font-size: 16px; color: #000000; letter-spacing: 0.5px; line-height: 24px; margin-left: 14px; }
.content-new .card_grops li .type { display: block; float: left; width: 110px; background-color: #eaeaea;; height: 24px; font-size: 13px; color: #000; letter-spacing: 1px; text-align: center; line-height: 24px; margin: 0 28px 0 18px; }
.content-new .card_grops li p { height: 70px; width: 458px; height: 48px; overflow: hidden; font-family: NotoSansTC-Regular; font-size: 16px; color: #000000; letter-spacing: 0.5px; line-height: 24px; float: left; font-size: 18px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }


/*box-3*/

.box-3 { font-family: NotoSansTC-Regular; }
.box-3-con { position: relative; height: 790px; width: 100%; margin-top: 120px; }
.box-3 .introduce_box { position: relative; width: 1157px; height: 478px; background-color: #F5F5F5; position: relative; }
.box-3 .introduce_box .text_wrapper { position: relative; }
.box-3 .introduce_box .text_wrapper div { float: left; margin-top: 90px; }
.box-3 .introduce_box .text_wrapper .left_text { width: 440px; font-size: 16px; color: #222222; letter-spacing: 2px; }
.box-3 .introduce_box .text_wrapper .left_text span { display: block; line-height: 40px; margin-left: 135px; }
.box-3 .introduce_box .text_wrapper .description { width: 550px; line-height: 40px; }
.box-3 .introduce_box .text_wrapper .description .title { font-family: NotoSansTC-Bold; font-size: 31px; color: #222222; letter-spacing: 4px; line-height: 45px; }
.box-3 .introduce_box .text_wrapper .description p { font-size: 18px; color: #222222; letter-spacing: 1.5px; line-height: 34px; margin-top: 10px; }
.box-3 .introduce_box .text_wrapper .description a { color: #000; display: block; margin-top: 40px; border-bottom: 1px #000 solid; line-height: 30px; width: 120px; }


.box-3 .award_wrapper { position: absolute; left: 135px; top: 300px; width: 1180px; justify-content: space-between; }
.box-3 .award_wrapper .card { float: left; width: 300px; }
.box-3 .award_wrapper .card:hover p { border-bottom: 1px #2ACF60 solid; }
.box-3 .award_wrapper .card p { font-family: NotoSansTC-Medium; font-size: 20px; color: #222222; letter-spacing: 2px; line-height: 60px; width: 262px; }
.box-3 .award_wrapper .card span { display: none; }
.box-3 .award_wrapper .card .img { width: 262px; height: 340px; }
.box-3 .award_wrapper .owl-nav { display: none; }

.footer { background-color: #F8F6F5; }
.footer-bg { padding: 50px 0px; height: 600px; margin-top: 10px; }
.footer-bg .footer-con { position: relative; }

.footer-bg .head { display: flex; padding-left: 0px; align-items: center; }
.footer-bg .l-icons { margin-left: 40px; }
.footer-bg .l-icons a { margin-right: 20px; display: inline-block; }
.footer-bg .footer-con .branch { padding-left: 0px; display: flex; justify-content: space-between; }
.footer-bg .footer-con .branch div:nth-last-child(1) { margin-right: 0px; }
.footer-bg .footer-con .branch div a { font-family: NotoSansTC-Regular; font-size: 18px; color: #222222; text-align: justify; line-height: 31px; margin: 0; }
.footer-bg .footer-con .branch div p { font-family: NotoSansTC-Regular; font-size: 16px; color: #222; line-height: 29px; margin-top: 10px; }
.footer-bg .footer-con .list_grops { font-family: NotoSansTC-Regular; font-size: 16px; }
.footer-bg .footer-con .list_grops div a { color: #222; }
.footer-bg .head p { font-family: NotoSansTC-Regular; font-size: 18px; color: #222222; letter-spacing: 1px; text-align: justify; line-height: 31px; margin: 0; }


.footer-bg .footer-con .footer-bm { display: flex; font-family: NotoSansTC-Regular; font-size: 14px; color: #222222; letter-spacing: 1px; text-align: justify; line-height: 40px; margin-top: 20px; }
.footer-bg .footer-con .footer-bm .icon_grops { display: flex; }
.footer-bg .footer-con .footer-bm .icon_grops a { margin-left: 20px; }


.con-top { position: fixed; right: 20px; top: 30%; width: 35px; }
.con-top .con-top-con { position: relative; width: 35px; }
.con-top .con-top-con span { cursor: pointer; }
.con-top .scroll { background: url('../images/index/scroll.png') no-repeat; width: 35px; height: 83px; display: block; }
.con-top .top { margin-top: 400px; background: url('../images/index/top.png') no-repeat; width: 35px; height: 87px; display: block; }
.box-1 .owl-stage { min-width: 10317px; }

/*new*/
.content-eve .card_item .message .type { width: auto; padding: 4px 15px 7px 17px; display: initial; margin-top: 0; }
.content-eve .card_item .message > div { margin-top: 14px; display: none; }
.content-exh .card_item .message .type { width: auto; padding: 4px 15px 7px 17px; display: initial; margin-top: 0; }
.content-exh .card_item .message > div { margin-top: 14px; display: none; }

.img-list-info { overflow: hidden; display: inline-block; position: relative; }
.img-list-info .img-list-con { height: 600px; float: left; width: 33.3%; padding: 2% 1%; line-height: 24px; font-family: NotoSansTC-Regular; font-size: 18px; color: #222222; letter-spacing: 1.5px; text-align: justify; line-height: 34px; }
.img-list-info .dis-block div { width: 350px; }
.img-list-info .img-list-con img { display: block; width: 100%; }
.img-list-info .img-list-con span { display: block; color: #222222; margin-top: 20px; font-family: Roboto-Regular; font-size: 15px; color: #323232; letter-spacing: 1px; line-height: 15px; }
.img-list-info .img-list-con .tit { font-family: NotoSansTC-Bold; font-size: 24px; color: #222222; letter-spacing: 2.4px; margin-top: 0px; line-height: 44px; margin-bottom: 20px; }
.img-list-info .img-list-con p { color: #222222; }
#all .welcome-div { display: none; }
#all .con-top .con-top-con .scroll { display: none; }

/*header-des*/
.header-des .des-title { width: 385px; font-size: 1.1em; position: relative; padding-bottom: 15px; border-bottom: 1px solid #2ACF60; box-sizing: content-box; }
.header-des .des-con { margin-top: 30px; }
.header-des .des-con p { line-height: 28px; }
.header-des .des-con .left { width: 50%; display: inline-block; font-size: 1em; }
.header-des .des-con .right { width: 50%; float: right; }
/*.header-des .des-con .right img { float: right; }*/

/* surrounding,traffic */
.sur-content, .tra-content, .inside-page { padding-top: 118px; margin-bottom: 100px; }
.sur-content .bread-nav, .tra-content .bread-nav, .inside-page .bread-nav { font-size: 16px; font-family: NotoSansTC-Regular; line-height: 24px; padding: 20px 0 29px 0; }
.sur-content .title, .tra-content .title, .inside-page .title { font-size: 30px; font-family: NotoSansTC-Regular; line-height: 41px; padding: 10px 0; border-bottom: 1px solid #ccc; margin-bottom: 40px; }
.sur-list { display: flex; align-items: center; flex-direction: column; }
.sur-list .item { width: 800px; height: auto; }
.sur-list .line { border-top: 1px solid #2ACF60; height: 1px; width: 800px; margin-top: 15px; }
.sur-list .item-tit { font-size: 24px; color: #333; font-weight: bolder; font-family: MicrosoftJhengHei-Regular; padding: 30px 0 28px 0; text-align: center; }
.sur-list .item-info { padding-top: 20px; font-size: 18px; line-height: 30px; color: #333; font-family: MicrosoftJhengHei-Regular; }
.sur-list .item-classify { padding-top: 35px; }
.sur-list .item-classify .class-tit { font-weight: bolder; font-family: MicrosoftJhengHei-Regular; font-size: 24px; line-height: 40px; color: #333; }
.sur-list .item-classify .class-cont { font-family: MicrosoftJhengHei-Regular; font-size: 18px; line-height: 30px; color: #333; }

/* environment */
.envir1, .envir2 { margin-bottom: 40px; padding-bottom: 40px; border-bottom: 1px solid #2ACF60; }
.envir3 { margin-bottom: 60px; }
.envir1 .tit, .envir2 .tit, .envir3 .tit { padding: 20px 0; border-bottom: 3px solid #2acf60; }
.envir1 .tit span, .envir2 .tit span, .envir3 .tit span { font-size: 20px; font-family: NotoSansTC-Regular; }
/* .envir2,.envir3{  ; } */
.envir .card-list { margin-top: 40px; overflow: hidden; }
.envir .card-list .left { width: 690px; margin-right: 40px; float: left; }
.envir .card-list .center { margin-right: 80px; float: left; }
.envir .card-list .center span, .envir2 .envir2-con .center span { font-size: 20px; font-family: NotoSansTC-Regular; line-height: 27px; letter-spacing: 1px; padding: 6px 0; border-bottom: 1px solid #2ACF60; }
.envir .card-list .right { width: 300px; float: right; }
.envir .card-list .right .item-info { font-size: 18px; line-height: 30px; color: #333; font-family: MicrosoftJhengHei-Regular; }
.envir .card-list .right .item-classify { padding-top: 35px; }
.envir .card-list .right .class-tit { font-weight: bolder; font-family: MicrosoftJhengHei-Regular; font-size: 24px; line-height: 40px; color: #333; }
.envir .card-list .right .class-cont { font-family: MicrosoftJhengHei-Regular; font-size: 18px; line-height: 30px; color: #333; }


/* tab-maplist */
.tab-maplist .tab-title { display: flex; height: 48px; margin-bottom: 20px; }
.tab-maplist .tab-title li { margin-right: 40px; cursor: pointer; font-size: 20px; font-family: NotoSansTC-Regular; }
.tab-maplist .tab-title li:hover { color: #2ACF60; }
.tab-maplist .tab-title li.active { color: #2ACF60; }
.tab-maplist .tab-content { width: 100%; overflow: hidden; padding-bottom: 300px; }
.tab-maplist .tab-content .tra-map { width: 100%; display: none; }
.tab-maplist .tab-content .tra-map > div { width: 100%; display: flex; }
.tab-maplist .tab-content .tra-map.show { display: block; }
.tab-maplist .tra-map > div .img { margin-right: 60px; width: 520px; height: 440px; }
.tab-maplist .tra-map > div .address { width: 760px; height: 440px; }
.tab-maplist .tra-map > div .address li { background: #eee; margin-bottom: 10px; }
.tab-maplist .car_title { display: flex; align-items: center; justify-content: space-between; padding: 30px; cursor: pointer; }
.tab-maplist .car_title .left { display: flex; align-items: center; font-weight: bolder; font-family: MicrosoftJhengHei-Regular; font-size: 24px; color: #333; }
.tab-maplist .car_title i { display: inline-block; margin-right: 21px; position: relative; }
.tab-maplist .car_title .icon_bus::before { display: inline-block; content: ""; width: 60px; height: 60px; background: url(../images/icon_bus_1.png); }
.tab-maplist .car_title .icon_bus::after { display: none; content: ""; width: 60px; height: 60px; background: url(../images/icon_bus_2.png); position: absolute; top: 0; left: 0; z-index: 5; }
.tab-maplist .active .car_title .icon_bus::after { display: inline-block; }
.tab-maplist .car_title .icon_train::before { display: inline-block; content: ""; width: 60px; height: 76px; background: url(../images/icon_train_1.png); }
.tab-maplist .car_title .icon_train::after { display: none; content: ""; width: 60px; height: 76px; background: url(../images/icon_train_2.png); position: absolute; top: 0; left: 0; z-index: 5; }
.tab-maplist .active .car_title .icon_train::after { display: inline-block; }
.tab-maplist .car_title .icon_mrt::before { display: inline-block; content: ""; width: 60px; height: 66px; background: url(../images/icon_mrt_1.png); }
.tab-maplist .car_title .icon_mrt::after { display: none; content: ""; width: 60px; height: 66px; background: url(../images/icon_mrt_2.png); position: absolute; top: 0; left: 0; z-index: 5; }
.tab-maplist .active .car_title .icon_mrt::after { display: inline-block; }
.tab-maplist .car_title .icon_car::before { display: inline-block; content: ""; width: 60px; height: 48px; background: url(../images/icon_car_1.png); }
.tab-maplist .car_title .icon_car::after { display: none; content: ""; width: 60px; height: 48px; background: url(../images/icon_car_3.png); position: absolute; top: 0; left: 0; z-index: 5; }
.tab-maplist .active .car_title .icon_car::after { display: inline-block; }
.tab-maplist .active .car_title .tit_car { color: #2ACF60; }
.tab-maplist .car_title img.add { display: block; }
.tab-maplist .car_title img.reduce { display: none; }
.tab-maplist .active .car_title img.add { display: none; }
.tab-maplist .active .car_title img.reduce { display: block; }
.tab-maplist .car_content { display: none; padding: 23px 31px 33px; border-top: 1px solid #cecece; }
.tab-maplist .car_content h6 { font-size: 16px; line-height: 30px; font-weight: normal; font-family: MicrosoftJhengHei-Regular; }
.tab-maplist .car_content p { line-height: 25px; font-size: 18px; }

/* chief */
.chief-content .chief-con { display: flex; justify-content: space-between; }
.chief-content .chief-img { padding: 70px 0; }
.chief-content .chief-img .tit { padding-bottom: 40px; font-weight: bolder; font-family: MicrosoftJhengHei-Regular; font-size: 24px; line-height: 32px; color: #333; }
.chief-content .chief-info { width: 602px; display: flex; flex-direction: column; justify-content: center; }
.chief-content .chief-info h6 { font-size: 24px; line-height: 32px; color: #333; border-bottom: 1px solid #2ACF60; padding-bottom: 10px; font-weight: bolder; font-family: MicrosoftJhengHei-Regular; }
.chief-content .chief-info div { font-size: 18px; line-height: 32px; padding: 20px 0 40px; }
.chief-content .chief-info p { font-family: MicrosoftJhengHei-Regular; }

/* ser-content */
.ser-content .img { padding: 60px 0 59px; display: flex; justify-content: center; }
.ser-content > p { font-size: 22px; line-height: 32px; font-family: MicrosoftJhengHei-Regular; padding-bottom: 40px; }
.ser-content div:nth-child(3) { display: flex; }
.ser-content .left { padding: 0 100px 20px 0; }
.ser-content .left, .ser-content .right { display: flex; }
.ser-content h5 { padding-right: 50px; margin-bottom: 15px; line-height: 32px; }
.ser-content h5 span { width: 210px; font-size: 22px; padding-bottom: 10px; }
.ser-content ul { width: 480px; }
.ser-content ul li { padding-bottom: 10px; }
.ser-content ul h6 { font-size: 22px; padding-bottom: 5px; font-weight: normal; border-bottom: 1px solid #a7a7a7cc; }
.ser-content ul p { font-size: 18px; margin-top: 10px; margin-bottom: 20px; }

.tra-content .int_top { display: flex; align-items: center; }
.tra-content .int_top img { padding-right: 50px; }
.tra-content .int_top p { font-size: 18px; line-height: 32px; font-family: MicrosoftJhengHei-Regular; color: #333; }
.tra-content .int_center { margin-top: 38px; }
.tra-content .int_center p { font-size: 18px; color: #333; line-height: 32px; font-family: MicrosoftJhengHei-Regular; margin-bottom: 10px; }
.tra-content .int_center h5 { font-size: 24px; line-height: 32px; font-weight: bolder; font-family: MicrosoftJhengHei-Regular; color: #333; margin: 53px 0 18px 0; }
.tra-content .int_center span { display: block; font-size: 18px; line-height: 32px; color: #333; font-family: MicrosoftJhengHei-Regular; margin-bottom: 10px; }
.tra-content .int_bottom { margin-top: 50px; }
.tra-content .int_bottom ul li { display: flex; margin-bottom: 70px; }
.tra-content .int_bottom ul li .img { margin-right: 40px; width: 460px; }
.tra-content .int_bottom .ibi_content { width: 837px; }
.tra-content .int_bottom .ibi_content h6 { margin-top: -5px; font-size: 24px; color: #333; line-height: 30px; padding-bottom: 10px; border-bottom: 1px solid #2ACF60; font-weight: bolder; font-family: MicrosoftJhengHei-Regular; }
.tra-content .int_bottom .ibi_content div { padding: 18px 0 42px; font-size: 18px; line-height: 32px; font-family: MicrosoftJhengHei-Regular; color: #333; }

/* recommend */
.recom-content .rec-con { display: flex; margin-right: 89px; }
.recom-content .rec-con .rec-left { width: 710px; }
.recom-content .rec-con .gallery-top { margin-top: 30px; width: 710px; }
.recom-content .rec-con .gallery-top .rec-l-top li { height: 566px; display: flex; justify-content: center; align-items: center; }
.recom-content .rec-con .gallery-thumbs { margin-top: 30px; height: 144px; }
.recom-content .rec-con .gallery-thumbs .rec-l-bottom li { display: flex; align-items: center; justify-content: center; }
.recom-content .rec-con .rec-l-top li.select { display: block; }
.recom-content .rec-right { margin-left: 89px; }
.recom-content .rec-right .right-title { margin-bottom: 28px; margin-top: 74px; font-size: 24px; line-height: 32px; font-weight: bolder; font-family: MicrosoftJhengHei-Regular; padding-bottom: 20px; border-bottom: 1px solid #2ACF60; }
.recom-content .rec-right .right-content { font-size: 18px; line-height: 32px; font-family: MicrosoftJhengHei-Regular; }

/* recomlist */
.reclist-content .title { margin-bottom: 30px; }
.reclist-content .list-top { width: 100%; padding: 15px 0; background: #f7f7f7; margin-bottom: 50px; }
.reclist-content .list-top span, .reclist-content .list-top input, .reclist-content .list-top button { font-size: 18px; line-height: 32px; font-family: MicrosoftJhengHei-Regular; color: #333; background: none; outline: none; border: none; }
.reclist-content .list-top span { padding-left: 50px; }
.reclist-content .list-top input { margin: 0 20px; border: 1px solid #ccc; padding: 3px 10px; font-size: 16px; }
.reclist-content .list-top button { background: #008744; padding: 4px 19px; font-size: 16px; color: #fff; }
.reclist-content .list-bottom { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-row-gap: 83px; grid-column-gap: 116px; }
/* .reclist-content .list-bottom li a{ display: flex; flex-direction: column; align-items: center; } */
.reclist-content .list-bottom li .img { height: 255px; width: 370px; display: flex; justify-content: center; align-items: center; }
.reclist-content .list-bottom li span { display: inline-block; font-size: 24px; font-family: MicrosoftJhengHei-Regular; line-height: 32px; color: #333; font-weight: bold; margin-top: 10px; }

/* craftward */
.search-box2 .book-detail { font-size: 18px; font-family: NotoSansTC-Regular; color: #222222; letter-spacing: 1.5px; line-height: 34px; }
.craft-video dl { overflow: hidden; background: #f7f7f7; border: 1px solid #eee; display: grid; grid-template-columns: 320px 1fr; grid-column-gap: 30px; }
.craft-video dl + dl { margin-top: 20px; }
.craft-video dl dt { background: #f7f7f7; position: relative; display: flex; justify-content: center; align-items: center; }
.craft-video dl dt a .hover-target { position: absolute; top: 0; left: 0; background: rgba(0,0,0,0.5); width: 100%; height: 241px; opacity: 0; -webkit-transition: .3s ease-in-out; display: flex; justify-content: center; align-items: center; }
.craft-video dl dt a:hover .hover-target { opacity: 1; }
.craft-video dl dd { padding: 20px 60px 20px 0; }
.craft-video dl dd h3 a, .craft-video dl dd .title a { display: block; margin: 0 0 10px 0; color: #333; font-size: 1.375em; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; transition: all .3s; -webkit-transition: all .3s; font-weight: bold; }
.craft-video dl dd p { line-height: 30px; color: #333; font-size: 1.125em; }
.craft-video dl dd p.location { font-size: 18px; color: #222222; letter-spacing: 1.5px; line-height: 34px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }

/* exhibition */
.exhibition dl dd p.exhi-btn { margin-top: 10px; line-height: 14px; padding-left: 0; }
.exhibition dl dd p.exhi-btn a { display: inline-block; border: 1px solid #cccc; background: #fff; /* height: 37px; width: 92px; line-height: 37px; */ padding: 8px 17px 8px 17px; font-size: 14px; font-family: MicrosoftJhengHei-Regular; color: #333; border-radius: 5px; position: relative; cursor: pointer; }
.exhibition dl dd p.exhi-btn a:hover { background-color: #F2F2F2; }
.exhibition dl dd p.exhi-btn a i { display: none; width: 16px; height: 16px; position: absolute; top: 14px; left: 17px; }
/* .exhibition dl dd p.exhi-btn a:nth-child(1) i{ background:url(../images/exhi-btn1.png);  }
.exhibition dl dd p.exhi-btn a:nth-child(2) i{ background:url(../images/exhi-btn2.png);  } */


/*search*/
.gsc-control-cse .gs-spelling, .gsc-control-cse .gs-result .gs-title, .gsc-control-cse .gs-result .gs-title * { font-size: 1em !important; }
.gsc-control-cse, .gsc-control-cse .gsc-table-result { font-size: 1em !important; }
.gsc-webResult .gs-result { line-height: 1.875em; }
.gsc-tabHeader { font-size: 0.9em !important; }


/*rwd*/
@media(max-width:1440px) {
    .header { position: fixed; }
    .header-nav { height: auto; left: 0px; bottom: 0px; overflow-x: hidden; }
    .content { padding-top: 98px; }
    .warp { width: 100%; }
    .header-top { height: auto; }
    .header-top-nav { right: 20px; }
    .header-top-nav li { display: none; }
    .header-top-nav li.rwd-show { display: inline-block; }
    .header-nav .nav-ul .menu-pc { display: none; }
    .header-nav .nav-ul .menu-ph { display: block; }

    .header-nav .nav-ul li { width: 100%; margin: 10px 0px; }
    .header-nav .nav-ul li .main { border-bottom: 1px #ededed solid; display: block; height: 40px; }
    .header-nav .nav-ul { width: 100%; padding: 0px 20px; }
    .header-nav .nav-click { display: block; margin-top: 50px; }
    .header-nav .nav-click ul { display: flex; justify-content: center; }
    .header-nav .nav-click ul li { display: inline-block; }
    .header-nav .nav-click li a { display: inline-block; font-family: NotoSansTC-Regular; font-size: 18px; color: #222222; letter-spacing: 1.8px; line-height: 18px; }
    .header-nav .nav-click li a:focus, .header-nav .nav-click li a:hover { color: #2ACF60; }
    .header-nav .nav-click span { padding: 0 1px; }
    .header-nav .nav-click li a:focus { color: #2ACF60; }
    .header-nav .nav-click span { padding: 0 1px; }
    .header-nav .nav-footer .text_wrapper { float: none; margin-top: 30px; }
    .header-nav .nav-footer .icon_wrapper { float: none; display: flex; justify-content: center; width: 100%; margin: 0 auto; padding: 30px 0; }
    .header-nav .nav-footer .text_wrapper div { display: flex; justify-content: center; flex-direction: column; align-items: center; }
    .header-nav .nav-footer .text_wrapper div .title { padding-bottom: 10px; }
    .header-nav .nav-footer .text_wrapper .split { display: none; }
    .nav-footer .wel-nav { display: block; }
    .nav-footer .wel-nav a { color: #fff; }
    .nav-footer .wel-nav span { color: rgb(26, 24, 24); }
    .nav-footer .wel-nav { text-align: center; display: block; }
    .nav-footer .wel-nav a { font-family: NotoSansTC-Medium; font-size: 18px; color: #222222; letter-spacing: 1.8px; line-height: 18px; }
    .nav-footer .wel-nav span { margin: 0 20px; }
    .icon_wrapper { }
    .nav-hr { display: none; }

    .header-nav .nav-footer .text_wrapper div a, .header-nav .nav-footer .text_wrapper div span { line-height: 25px; }
    .has-menu a::before { content: "+"; width: 15px; float: right; margin-right: 25px; }
    .has-menu li a::before { content: ""; }
    .has-menu > a.isOpen::before { content: "-"; }
    .has-menu ul { display: none; }
    .header-nav .warp { height: auto; }
    .header-nav .warp { height: auto; background: #f8f6f5; width: 100%; padding: 27px 10px; }
    .content .content-banner .text { width: 95%; position: relative; text-align: left; top: 0px; margin: 0px 10px; left: 0px; height: auto; text-align: center; line-height: 20px; }
    .content .content-banner .img { width: 100%; height: auto; margin-left: 0px; text-align: center; }
    .content .content-banner .img img { margin-top: 10px; }
    .content .content-banner .notice { position: relative; width: 100%; height: auto; top: 0px; padding: 15px; display: inline-block; }
    .content .content-banner .notice .h1 { height: auto; }
    .content .content-banner .notice .time { height: auto; }
    .content-exh .title { padding: 0 15px; }
    .content-exh .title .section_nav a { right: 0px; }
    .content-exh .mobile-list { display: none; }
    .content-exh .pc-list { display: block; }
    .content-exh .card_grops-list { padding: 20px 15px 0; width: 100%; }
    .content-exh .card_grops { display: flex; justify-content: space-between; }
    .content-exh .card_item { width: 32%; height: auto; }
    .content-exh .card_item img { width: 100%; height: auto; }
    .content-exh .card_item .message { width: 100%; }

    .content-eve .title { padding: 0 15px; }
    .content-eve .title .section_nav a { right: 0px; }
    .content-eve .card_grops { padding: 0 15px; margin-left: 0; width: 100%; display: flex; justify-content: space-between; }
    .content-eve .card_item { margin: 0px; width: 255px; height: 370px; }
    .box-1 { width: 100%; padding: 15px; }
    .box-1 .introduce_box { width: 100%; margin-left: 0px; margin-top: 60px; }
    .box-1 .introduce_box .text_wrapper div { margin-top: 0px; }
    .box-1 .introduce_box .text_wrapper .left_text, .box-1 .introduce_box .text_wrapper .description { width: 100%; padding: 20px; }
    .box-1 .introduce_box .text_wrapper .left_text span { margin-left: 0px; }
    .box-1 .img-list { position: relative; margin-top: 40px; top: 30px; }


    .box-2 .introduce_box { width: 100%; margin-left: 0px; margin-top: 60px; }
    .box-2 .introduce_box .text_wrapper div { margin-top: 0px; }
    .box-2 .introduce_box .text_wrapper .left_text, .box-2 .introduce_box .text_wrapper .description { width: 100%; padding: 20px; }
    .box-2 .introduce_box .text_wrapper .left_text span { margin-left: 0px; }
    .box-2 .img-list { left: 0px; }


    .content-imedia .title { margin: 0 15px; }
    .content-imedia .item_grops .video { width: 100%; height: auto; }
    .content-imedia .tag { position: relative; top: 0px; width: 346px; height: auto; right: 0px; padding: 20px; }
    .content-imedia .prodice { width: 100%; margin: 0px; padding: 20px; min-height: 136px; }
    .content-new .new-left .title { padding-left: 20px; }
    .content-new .new-left { width: 100%; margin-right: 0px; }
    .content-new .new-con { margin-left: 20px; }
    .content-new .new-right { width: 100%; }

    .box-3 .introduce_box { width: 100%; margin-left: 0px; margin-top: 60px; }
    .box-3 .introduce_box .text_wrapper div { margin-top: 0px; }
    .box-3 .introduce_box .text_wrapper .left_text, .box-3 .introduce_box .text_wrapper .description { width: 100%; padding: 20px; }
    .box-3 .introduce_box .text_wrapper .left_text span { margin-left: 0px; }
    .box-3 .img-list { left: 0px; }
    .box-3 .award_wrapper { left: 0px; width: 100%; position: relative; top: -158px; }

    .footer-bg { padding: 40px 20px }
    .footer-bg .left { padding-left: 0px; }
    .footer-bg .right { display: none; }
    .footer-bg .footer-con .branch { padding-left: 0px; }
    .footer-bg .footer-con .branch div { margin-bottom: 10px; }
    .footer-bg .footer-con .footer-bm .icon_grops, .footer-bg .footer-con .footer-bm .ownership { float: none; margin-bottom: 20px; }
    ::-webkit-scrollbar { width: 10px; height: 4px; }

    .welcome-div .welcome-header { position: absolute; top: 47px; width: 100%; text-align: center; }

    .welcome-div .wel-nav { position: absolute; left: 6%; top: 70px; }
    .footer-bg { height: 1300px; }

    .sur-content, .tra-content, .inside-page { padding-top: 118px; margin-bottom: 0; }
    .sur-content .bread-nav, .tra-content .bread-nav, .inside-page .bread-nav { margin: 0 30px; }
    .sur-content .title, .tra-content .title, .inside-page .title { margin: 0 30px; }
    .chief-content .chief-con { margin: 0 30px; }
    .chief-content .chief-img { padding: 30px 0; }

    .tra-content .tab-maplist { margin: 30px 30px 0; }
    .tab-maplist .tab-content { padding-bottom: 330px; }
    .tab-maplist .tab-content .tra-map > div { justify-content: space-between; }

    /* reclist-content */
    .reclist-content .list-top { width: auto; margin: 20px 30px; }
    .reclist-content .list-bottom { margin: 40px 30px; }
    .recom-content .rec-con { margin: 30px 30px 0; }

    .tra-content .int_top, .tra-content .int_center, .tra-content .int_bottom { margin: 30px 30px 40px; }

    .envir1, .envir2 { margin: 30px 30px 0; }
    .envir .card-list .right { width: 400px; float: right; }

    .ser-content { margin: 0 30px; }
}

@media(max-width:1200px) {
    .ser-content .left, .ser-content .right { justify-content: space-between; }
    .ser-content h5 { padding-right: 0; }
}

@media(max-width:992px) {
}

@media(max-width:768px) {
    .content .content-banner .notice .button-wrapper .btn-prev { margin-left: 0px; width: 34px; height: 34px; background-size: cover; margin-top: 10px; }
    .content .content-banner .notice .button-wrapper .btn-next { width: 34px; height: 34px; background-size: cover; margin-top: 10px; }
    .content .content-banner .notice .page { margin-top: 3px; margin-right: 30px; font-size: 20px; }
    .content .content-banner .notice .span { margin: 4px 5px 0; }
    .content .content-banner .text { justify-content: flex-start; }
    .content .content-banner .text .text-con { height: 40px; }
    .content .content-banner .notice .notice-con { padding-bottom: 20px; }
    .content-exh .card_grops-list { padding: 20px 15px 0; }
    .content-exh .mobile-list { display: block; }
    .content-exh .pc-list { display: none; }
    .content-exh .card_item { width: 100%; margin-right: 15px; height: auto; display: inline-block; }
    .content-exh .card_item .message { width: 100%; padding: 0 .3125em; }
    .content-exh .card_item .img { max-width: 100%; height: auto; }
    .content-exh .card_item .name { height: 60px; font-size: 1.25em; letter-spacing: .0625em; margin-bottom: 0.8em; line-height: 1.5em; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; }
    .content-exh .owl-carousel .owl-stage-outer { overflow-x: scroll; }

    .content-eve .card_item .img { width: 96%; }
    .content-eve .card_item .name { width: 96%; font-size: 18px; }
    .content-eve .card_item .message p { width: 96%; line-height: 26px; font-size: 16px; }
    .box-1 .img-list .owl-carousel img { max-height: 190px; width: auto; }
    .box-1 .img-list .owl-carousel .single-slide { max-height: 190px; }
    .content-imedia .item_grops .video .play { display: none; }
    h1 { font-size: 1.6em; }
    .content-new .card_grops li { height: auto; display: block; }
    .content-new .card_grops li span, .content-new .card_grops li .type { display: inline-block; float: none }
    .content-new .card_grops li p { width: auto; margin: 10px 0 0 114px; padding-right: 20px; float: none; }
    .content-imedia .tag { width: 100%; }
    /* .content-new .new-right{ display: flex; justify-content: center; align-items: center; } */
    .welcome-div .welcome-header .logo img { margin: 0 auto; }
    .box-3 .introduce_box { height: 370px; }
    .box-3 .award_wrapper { top: -20px; }
    .box-3 .award_wrapper .card { width: 100%; }
    .box-3 .award_wrapper .card .img { width: 100%; height: 100%; }
    .box-3 .award_wrapper .card p { font-size: 16px; line-height: 22px; width: 133px; }
    .box-3-con { height: 680px; }
    .box-2 .img-list .dis-block div { width: 100%; height: auto; }
    .box-2 .img-list .dis-block p { width: 100%; }
    .box-2 .img-list .img-list-con { width: 100%; }
    .box-1 .img-list { left: 50px; }
    .box-2 .img-list { width: 100%; padding: 20px; position: relative; top: -30px; }
    .box-2 .introduce_box .text_wrapper .description { padding-bottom: 60px; }
    .box-2 .introduce_box { margin-top: 0px; }
    .box-2 .owl-carousel .owl-stage-outer { overflow: visible; }
    .box-1 .box-1-con { height: 764px; }
    .footer { background: none; }
    .footer-bg { height: auto; background-color: #F8F6F5; }
    .con-top { z-index: 1; top: 15%; }
    /* .footer-bg .l-icons { position: relative; top: 20px; left: 0px; } */


    .rwd768 { display: block; }
    .rwd, .rwd375 { display: none; }
    .footer-bg .footer-con .footer-bm { height: 200px; }
    .nav-hr { height: 100px; }
    .header-nav .nav-footer .text_wrapper { top: -90px; }
    .box-3 .award_wrapper_con { width: 612px; }
    .box-3 .award_wrapper .owl-stage { min-width: 1000px; }
    .box-3 .award_wrapper .card p { width: 100%; text-align: center; }
    .header-top .warp { height: auto; }
    .header--shrink { padding: 15px 10px; }
    .header--shrink .rwd768 { transition: .5s ease-in-out; }
    .header .wrapper { padding: 25px 10px; }
    .header-top h1 { margin-left: 10px; }
    .header-top-nav li.rwd-show { margin-right: 10px; }
    .header-top h1 a { width: 280px; }
    /*new*/
    .img-list-info .img-list-con { width: 100%; }
    .header-des .des-title { width: auto; }
    .header-des .des-con .left { width: 100%; margin-bottom: 20px; }
    .header-des .des-con .right { width: 100%; }
    .header-des .des-con .right img { float: initial; }


    .sur-content, .tra-content, .inside-page { padding-top: 78px; }
    .inside-page .bread-nav, .sur-content .bread-nav, .tra-content .bread-nav, .inside-page .bread-nav { margin: 0 20px; padding: 10px 0 10px 0; }
    .sur-content .title, .tra-content .title, .inside-page .title { margin: 0 15px; }
    .ser-content { margin: 0 15px; }
    .ser-content div:nth-child(3) { display: block; }
    .ser-content .left { padding-right: 0; }
    .ser-content .left, .ser-content .right { display: block; }
    .ser-content h5 { padding-right: 0; padding-bottom: 15px; }
    .ser-content ul { width: 100%; }

    .envir1 .tit, .envir2 .tit, .envir3 .tit { margin: 15px; }
    .envir .card-list .left, .envir .card-list .center, .envir .card-list .right { width: 100%; float: none; }
    .envir1, .envir2, .envir3 { margin: 0 15px; }
    .envir1, .envir2 { margin-bottom: 20px; padding-bottom: 20px; }

    .envir .card-list .left, .envir .card-list .center { margin-bottom: 20px; }
    .envir .card-list .right .item-classify { padding-top: 15px; }

    .sur-list .item { width: 100%; }
    /* chief */
    .chief-content .chief-con { display: block; margin: 0 15px; }
    .chief-content .chief-img .tit { text-align: center; }
    .chief-content .chief-img div:nth-child(2) { display: flex; justify-content: center; }
    .chief-content .chief-info { width: 100%; }
    /* tra-content */
    .tra-content .tab-maplist { margin: 30px 15px 0; }
    .tab-maplist .tab-title { justify-content: center; }
    .tab-maplist .tab-title li { margin: 0; }
    .tab-maplist .tab-title li + li { margin-left: 30px; }
    .tab-maplist .tab-content .tra-map > div { display: block; }
    .tab-maplist .tra-map > div .img { width: 100%; margin: 0; display: flex; justify-content: center; height: auto; margin-bottom: 30px; }
    .tab-maplist .tra-map > div .address { width: 100%; height: auto; }
    .tab-maplist .tab-content { padding: 0; }
    /* reclist-content */
    .reclist-content .list-top { width: auto; margin: 20px 15px; }
    .reclist-content .list-bottom { display: grid; grid-template-columns: 1fr 1fr; grid-row-gap: 30px; grid-column-gap: 50px; margin: 40px 15px; }
    .reclist-content .list-bottom li { width: 100%; }
    .reclist-content .list-bottom li .img { width: 100%; height: 307px; }

    .recom-content .rec-con { display: block; margin: 30px 15px 40px; }
    .recom-content .rec-con .rec-left { width: 100%; }
    .recom-content .rec-con .gallery-top { width: 100%; }
    .recom-content .rec-right { margin-left: 0; margin-top: 28px; }
    .recom-content .rec-right .right-title { margin-top: 0; padding-bottom: 10px; margin-bottom: 20px; }

    .tra-content .int_top, .tra-content .int_center, .tra-content .int_bottom { display: block; margin: 30px 15px 0; }
    .tra-content .int_top { display: flex; flex-direction: column; align-items: center; }
    .tra-content .int_top img { padding: 0; }
    .tra-content .int_bottom ul li { display: block; margin-bottom: 0; }
    .tra-content .int_bottom ul li .img { display: flex; justify-content: center; width: auto; }
    .tra-content .int_bottom .ibi_content { width: 100%; margin-top: 30px; }

    .craft-video dl dd { width: 378px; }
    div.exhibition dl { padding: 0 }
    div.exhibition > dl > dt { position: static; width: 100%; }
    div.exhibition dl dt a { text-align: center; }
    div.exhibition dl dt a img { display: inline-block; }
}

@media (max-width:480px) {
    .con-top { display: none; }
    .hr40 { height: 0; }
    .header { position: fixed; top: 0; left: 0; }
    .header-top { height: auto; }
    .header-top .warp { height: auto; }
    .header--shrink { padding: 15px 10px; }
    .header--shrink .rwd768 { transition: .5s ease-in-out; }
    .header .wrapper { padding: 25px 10px; }
    .header-top .top-warp { display: flex; }
    .header-top .warp .close { display: flex; padding: 16px 24px 26px; }
    .header-nav .close .right { position: static; top: 0; left: 0; }
    .header-top .wrapper img { transition: .8s ease-in-out; }
    .header-top-nav .nav-img { margin: 0; width: auto; height: auto; }
    .header-top-nav .nav-img img { margin: 0; }
    .header-nav .nav-ul { margin-top: 0; }
    .header-nav .nav-ul .menu-pc { display: none; }
    .header-nav .nav-ul .menu-ph { display: block; }
    .header-nav .nav-ul .menu-ph li:nth-child(1) { padding-top: 20px; border-top: 1px #ededed solid; }
    .header-nav .nav-ul li .main { font-size: 1.125em; line-height: 1.125em; letter-spacing: .125em; }
    .header-nav .nav-ul li a { line-height: 2.5em; font-size: 1em; letter-spacing: .125em; }
    .header-nav .nav-ul .sub-menu li > .isClose::before { content: "+"; width: 15px; float: right; margin-right: 25px; }
    .header-nav .nav-ul .sub-menu li > .isOpen::before { content: "-"; }
    .nav-hr { height: 0; }
    .header-nav .nav-click { display: block; padding: 1em 20px 0; margin-top: 0; }
    .header-nav .nav-click ul { display: flex; justify-content: space-between; }
    .header-nav .nav-click ul li { display: inline-block; }
    .header-nav .nav-click li a { display: inline-block; font-family: NotoSansTC-Regular; font-size: 18px; color: #222222; letter-spacing: 1.8px; line-height: 18px; }
    .header-nav .nav-click li a:focus { color: #2ACF60; }
    .header-nav .nav-click span { padding: 0 1px; }
    .header-nav .nav-footer .text_wrapper { margin: 0 auto; top: -90px; }
    .header-nav .nav-footer .text_wrapper div { width: 100%; }
    .header-nav .nav-footer .text_wrapper div > span { display: flex; justify-content: center; align-items: center; width: 100%; padding: 0 24px; margin: 0; }
    .header-nav .nav-footer .text_wrapper div a { font-size: 0.9em; letter-spacing: .11em; line-height: 1.125em; margin-left: 0; text-align: center; }
    .header-nav .nav-footer .text_wrapper div span { margin: 0 .625em 0 .625em; }
    .header-nav .nav-footer .text_wrapper div span:last-child { margin-top: 0.6em; }
    .header-nav .nav-footer .text_wrapper .split { display: none; }
    .header-nav .nav-footer { margin: 30px auto 0; }
    .icon_wrapper { width: 100%; display: flex; justify-content: center; padding-bottom: 1.25em; }
    .header-nav .nav-footer img { margin: 0 5px; }
    .nav-footer .wel-nav a { color: #fff; }
    .nav-footer .wel-nav span { color: rgb(26, 24, 24); }
    .nav-footer .wel-nav { text-align: center; display: block; }
    .nav-footer .wel-nav a { font-family: NotoSansTC-Medium; font-size: 18px; color: #222222; letter-spacing: 1.8px; line-height: 18px; }
    .nav-footer .wel-nav span { margin: 0 20px; }



    .content { padding-top: 78px; }
    /* banner */

    .content .content-banner { width: 100%; }
    .content .content-banner .text { /*height: 3.75em;*/ display: flex; justify-content: center; align-items: center; margin: 0; padding: 0 .9357em; width: 100%; line-height: 1.25em; }
    .content .content-banner .text a { font-size: .8125em; }
    .content .content-banner .text span { font-size: .8125em; line-height: 1.25em; letter-spacing: .0625em; }
    .content .content-banner .notice { padding: 0; }
    .content .content-banner .notice .notice-con { display: flex; justify-content: space-between; align-items: center; padding: 15px 24px }
    .header-nav .nav-click li a { font-size: 14px; }
    .tab-maplist .tab-title li { font-size: 14px; }
    .content-banner .rwd375 { display: block; }
    .content-banner .rwd, .content-banner .rwd768 { display: none; }



    .content-exh .title { padding: 0 .9375em; margin-top: 2.5em; }
    .content-exh .title span { font-size: .8125em; line-height: .8125em; letter-spacing: .054em; }
    .content-exh .title .section_nav { position: static; display: flex; justify-content: space-between; align-items: center; }
    .content-exh .title .section_nav h1 { font-size: 1.5em; letter-spacing: .1125em; line-height: 1.5em; }
    .content-exh .title .section_nav a { position: static; font-size: .875em; letter-spacing: .125em; line-height: 1.69em; }
    .content-exh .mobile-list { display: block; }
    .content-exh .pc-list { display: none; }
    .content-exh .owl-carousel .owl-stage-outer { overflow-x: scroll; }
    .content-exh .card_item { width: 100%; margin: 0; }
    .content-exh .card_item .img { width: 100%; max-width: 100%; }
    .content-exh .card_item .message { width: 100%; padding: 0 .9375em; }
    .content-exh .card_item .name { font-size: 1.25em; letter-spacing: .063em; line-height: 1.63em; margin-bottom: 1em; height: auto; }
    .content-exh .card_item .message .time { padding: 0 .25em; }
    .content-exh .card_item .message p { font-size: .9357em; line-height: .9357em; letter-spacing: .031em; margin-bottom: 0.5em; }
    .content-exh .card_grops-list { padding: 20px 15px 10px; }
    .content-exh .card_item .message > div { margin: .875em 0 0 0; }
    .content-exh .card_item .message .type { padding: .25em .9375em .25em 1.0625em; font-size: .75em; line-height: .75em; letter-spacing: .16em; }


    .content-eve .hr40 { height: 40px; }
    .content-eve .title { margin-top: 0; padding: 0 .9375em 0; }
    .content-eve .title span { line-height: 0.8125em; font-size: 0.8125em; letter-spacing: .054em; }
    .content-eve .title .section_nav h1 { font-size: 1.5em; line-height: 1.5em; letter-spacing: .09375em; }
    .content-eve .title .section_nav a { font-size: 0.875em; line-height: 1.35em; top: 0.3125em; letter-spacing: .0625em; }
    .content-eve .card_grops { width: 100%; padding: 0 .9375em; display: grid; grid-template-columns: 1fr 1fr; grid-row-gap: 2.5em; grid-column-gap: 1.25em; margin-top: 1.25em; }
    .content-eve .card_item { width: 100%; height: 100%; }
    .content-eve .card_item .img { height: auto; width: 100%; }
    .content-eve .card_item .name { font-size: 1em; width: 100%; line-height: 1.25em; margin-bottom: 1em; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; }
    .content-eve .card_item .message { margin-top: .375em; }
    .content-eve .card_item .message .time { font-size: .75em; padding: 0 .25em; line-height: 1.5em; }
    .content-eve .card_item .message .place { text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; }
    .content-eve .card_item .message p { font-size: .75em; line-height: 1em; margin-bottom: 0; width: 100%; }
    .content-eve .card_item .message .type { font-size: .75em; padding: .25em .875em; line-height: 1.25em; }
    .content-eve .card_item .message > div { margin-top: .875em; }

    .box-1 { padding: 0; }
    .box-1 .box-1-con { height: 40.875em; padding: .9375em; }
    .box-1 .img-list { left: 50px; }
    .box-1 .img-list .img-list-con { width: 480px; }
    .box-1 .introduce_box { margin-top: 0; }
    .box-1 .introduce_box .text_wrapper .left_text span { font-size: .75em; line-height: 1.5em; letter-spacing: .15em; }
    .box-1 .introduce_box .text_wrapper .description { padding: 1.875em .9375em; }
    .box-1 .introduce_box .text_wrapper .left_text { padding: 1.875em .9375em 0; }
    .box-1 .introduce_box .text_wrapper .description .title { font-size: 1.5em; line-height: 1.9375em; letter-spacing: .1875em; }
    .box-1 .introduce_box .text_wrapper .description p { font-size: .9375em; line-height: 1.6875em; margin-top: 1.375em; letter-spacing: .0625em; }
    .box-1 .introduce_box .text_wrapper .description a { margin-top: 2.5em; line-height: 1.875em; width: 6.875em; margin-top: 2.5em; font-size: .9375em; letter-spacing: .125em; }



    .box-2 { margin-top: 2.5em; }
    .box-2 .box-2-con { height: 48.85em; }
    .box-2 .hr40 { height: 1.25em; }
    .box-2 .introduce_box { background: none; }
    .box-2 .introduce_box .text_wrapper .left_text { padding: 1.25em 1.875em 0; }
    .box-2 .introduce_box .text_wrapper .left_text span { font-size: .75em; line-height: 1.5em; letter-spacing: .05em; }
    .box-2 .introduce_box .text_wrapper .description { padding: 0 1.875em 1.25em; }
    .box-2 .introduce_box .text_wrapper .description .title { font-size: 1.5em; line-height: normal; letter-spacing: .11875em; }
    .box-2 .introduce_box .text_wrapper .description .title i { display: inline-block; font-style: normal; line-height: 10px; }
    .box-2 .introduce_box .text_wrapper .description p { font-size: .9375em; letter-spacing: .0625em; line-height: 1.6875em; margin-top: 1.25em; }
    .box-2 .img-list { top: -0.0625em; padding: 1.25em 1.875em; }
    .box-2 .img-list .img-list-con { margin-top: 0; width: 100%; }
    .box-1 .img-list .owl-carousel { height: auto; width: 100%; }
    .box-1 .img-list .owl-carousel .single-slide { width: 480px; }
    .box-1 .owl-carousel .owl-stage-outer { overflow: visible; }
    .owl-carousel.owl-drag .owl-item { width: 100%; }
    .box-2 .img-list .img-list-con .single-slide { width: 100%; }
    .box-2 .img-list .dis-block div { width: 100%; height: auto; }
    .box-2 .img-list .dis-block span { font-size: .75em; margin-top: 1.5em; letter-spacing: .0625em; line-height: .75em; padding: 0 .9375em; }
    .box-2 .img-list .dis-block .title { font-size: 1.25em; line-height: 1.625em; letter-spacing: .125em; margin-bottom: .5em; }
    .box-2 .img-list .dis-block p { font-size: 0.9375em; line-height: 1.6875em; letter-spacing: .05em; width: 100%; padding: 0 .9375em; }

    .content-imedia .title { margin: 0 .9375em; font-size: 0.75em; }
    .content-imedia .hr40 { height: 2.5em; }
    .content-imedia .section_nav h1 { font-size: 2em; line-height: 1.5em; letter-spacing: .125em; }
    .content-imedia .title .section_nav a { font-size: 1.2em; letter-spacing: .125em; margin-right: 0; }
    .content-imedia .item_grops .video img { display: block; }
    .content-imedia .tag { padding: 1.875em 0 1.875em 1.875em; width: 100%; }
    .content-imedia .tag .title { font-size: 0.75em; line-height: 0.75em; padding-bottom: .5em; }
    .content-imedia .tag p { line-height: 1.375em; font-size: 1.25em; }
    .content-imedia .prodice { padding: 1.1875em 1.9em 0 1.875em; font-size: 1em; line-height: 1.6875em; min-height: initial; }

    .content-new .hr40 { height: 2.5em; }
    .content-new .new-left .title { padding: .9375em; }
    .content-new .new-left .title span { font-size: 0.75em; margin-left: .3125em; }
    .content-new .new-left .title .section_nav h1 { font-size: 1.5em; line-height: 1.5em; letter-spacing: .125em; }
    .content-new .new-left .title .section_nav a { font-size: .9em; letter-spacing: .125em; font-family: NotoSansTC-Bold; }
    .content-new .new-con { margin: .9375em .9375em 0 .9375em; }
    .content-new .card_grops li { padding: 1.125em 0 0.7em; }
    .content-new .card_grops li:last-child { border-bottom: 1px solid #EFEFEF; }
    .content-new .card_grops li span { width: 5em; font-size: .8125em; line-height: .8125em; margin-left: .9375em; letter-spacing: .031em; }
    .content-new .card_grops li .type { width: 6.875em; font-size: .75em; height: 1.7em; line-height: 1.7em; letter-spacing: .0625em; margin-top: -0.34em; }
    .content-new .card_grops li p { font-size: 0.9375em; line-height: 1.63em; margin-left: 5.875em; padding-right: .9375em; }

    .content-new .new-right .fb-page span { margin: 0 auto; display: block; }

    .content-new .new-right img { width: 100%; }

    .box-3-con { margin-top: 2.5em; background-color: #F5F5F5; height: 40.25em; }
    .box-3 .introduce_box { height: 29.875em; }
    .box-3 .introduce_box .text_wrapper .left_text { padding: 1.25em 2.55em 0; }
    .box-3 .introduce_box .text_wrapper .description { padding: 1.875em 1.875em 0; }
    .box-3 .introduce_box .text_wrapper .left_text { font-size: .75em; line-height: 1.5em; letter-spacing: .05em; }
    .box-3 .introduce_box .text_wrapper .left_text .EN_name { line-height: 20px; letter-spacing: .05em; }
    .box-3 .introduce_box .text_wrapper .left_text .CN_name { line-height: 20px; letter-spacing: .1em; }
    .box-3 .introduce_box .text_wrapper .description .title { font-size: 1.5em; line-height: 1.75em; letter-spacing: .11875em; }
    .box-3 .introduce_box .text_wrapper .description p { font-size: .9375em; margin-top: .625em; line-height: 2em; letter-spacing: .0625em; }
    .box-3 .award_wrapper { top: -180px; }
    .box-3 .award_wrapper_con { width: 100%; }
    .box-3 .award_wrapper .card p { font-size: 1em; line-height: 1.25em; width: 100%; margin-top: .9375em; text-align: center; }
    .box-3 .award_wrapper .card { width: auto; display: inline-block; }
    .box-3 .award_wrapper .card .img { width: 100%; height: auto; }


    .footer { background: none; }
    .footer .hr40 { height: 2.5em; }
    .footer-bg { background-color: #F8F6F5; margin-top: 0; padding: 2.5em .9375em 5em; }
    .footer-bg .head { display: block; }
    .footer-bg .rwd768 { display: none; }
    .footer-bg .rwd { display: block; }
    .footer-bg .l-icons { position: absolute; top: 38.3em; left: 0; margin-left: 0; width: 60%; display: flex; justify-content: space-between; }
    .footer-bg .l-icons a { margin-right: 0.5em; }
    .footer-bg .l-icons a img { width: 2.5em; height: 2.5em; }
    .footer .footer-con .hr40 { height: .75em; }
    .footer-bg .footer-con .branch { display: block; }
    .footer-bg .footer-con .branch div { margin-bottom: 1.25em; }
    .footer-bg .footer-con .branch div a { font-size: 1em; line-height: 1.9375em; }
    .footer-bg .footer-con .branch div p { margin-top: 0; font-size: .875em; line-height: 1.6em; }
    .footer-bg .footer-con .list_grops span { display: none; }
    .footer-bg .footer-con .list_grops div { display: grid; grid-template-columns: 36% 21% 20%; justify-content: space-between; }
    .footer-bg .footer-con .list_grops div a { font-size: .875em; }
    .footer-bg .footer-con .footer-bm { display: block; height: auto; }
    .footer-bg .footer-con .footer-bm .icon_grops { margin: 0; position: absolute; top: 51.35em; right: 0; width: 37%; display: flex; justify-content: space-between; }
    .footer-bg .footer-con .footer-bm .icon_grops a { margin: 0 0.5em 0 0; }
    .footer-bg .footer-con .footer-bm .icon_grops a .left-img { width: 8.5em; height: 3em; }
    .footer-bg .footer-con .footer-bm .icon_grops a .right-img { width: 2.8em; height: 3em; }
    .footer .footer-con .hr100 { height: 70px; }
    .footer-bg .footer-con .footer-bm { margin-bottom: 2.5em; font-size: .75em; letter-spacing: .0625em; line-height: 1.5em; }
    /*trans*/
    .warp { width: 100%; }
    .tab-maplist .tab-title { width: 100%; flex-wrap: wrap; justify-content: space-between; height: 80px; }
    .tab-maplist .tab-title li { margin-bottom: 10px; font-size: 16px; }
    .tab-maplist .tab-title li:nth-child(2), .tab-maplist .tab-title li:nth-child(4) { margin-right: 15px; }
    .tab-maplist .tab-title li:nth-child(1), .tab-maplist .tab-title li:nth-child(3) { margin-left: 15px; }


    .sur-content { padding: 74px 0 0; margin-bottom: 0; }
    .inside-page, .tra-content { padding-top: 74px; margin-bottom: 30px; }
    .inside-page .bread-nav, .sur-content .bread-nav, .tra-content .bread-nav, .inside-page .title { margin: 0 15px; padding: 0; }
    .sur-content .title, .tra-content .title, .inside-page .title { margin: 0 15px; padding: 10px 0; }
    /* surrounding */
    .sur-content .sur-list { margin: 0 15px; }
    .sur-content .sur-list .line { width: 100%; }

    /* environment */
    .envir1 .tit, .envir2 .tit, .envir3 .tit { margin: 15px; }
    .envir .card-list { margin-top: 20px; }
    .envir .card-list .left, .envir .card-list .center, .envir .card-list .right { float: none; width: 100%; }
    .envir .right { padding: 0 10px; }


    /* introduction */
    .tra-content .int_top, .tra-content .int_center, .tra-content .int_bottom { display: block; margin: 30px 15px 0; }
    .tra-content .int_top img { padding: 0; }
    .tra-content .int_center { margin-top: 50px; }
    .tra-content .int_center h5 { margin: 22px 0; }
    .tra-content .int_bottom ul li { display: block; margin-bottom: 0; }
    .tra-content .int_bottom ul li .img { width: 100%; margin: 0; }
    .tra-content .int_top p, .tra-content .int_bottom .ibi_content { width: 100%; margin-top: 18px; }
    /* chief */
    .chief-content .chief-con { display: block; }
    .chief-content .chief-img { padding: 30px 15px; }
    .chief-content .chief-info { padding: 0 15px; width: 100%; }
    .chief-content .chief-info div { padding: 20px 0; }
    /* service */
    .ser-content .img { padding: 30px 0 20px; }
    .ser-content > p { padding: 0 0 30px; }
    .ser-content div:nth-child(3) { display: block; }
    .ser-content .left { margin-bottom: 30px; }
    .ser-content .left, .ser-content .right { padding: 0; }
    .ser-content h5 { width: 100%; }
    .ser-content ul li { padding: 5px 0; }
    .ser-content ul h6 { padding: 5px 0; }
    /*  traffic*/
    .tra-content .tab-maplist { margin-top: 30px; }
    .tab-maplist .tab-title { height: auto; margin-bottom: 0; }
    /* .tab-maplist .tab-content .tra-map{ padding: 0 15px; } */
    .tab-maplist .tab-content .tra-map > div { display: block; }
    .tab-maplist .tra-map > div .img { width: 100%; height: auto; margin-bottom: 20px; }
    .tab-maplist .tra-map > div .address { width: 100%; }
    /* recommend */
    .recom-content .rec-con { display: block; margin: 20px 15px 40px; }
    .recom-content .rec-con .rec-left { width: 100%; }
    .recom-content .rec-right { margin: 30px 0 0; }
    .recom-content .rec-right .right-title { margin-top: 0; }
    .recom-content .rec-con .gallery-top { width: 100%; }
    .recom-content .rec-con .gallery-thumbs { height: 87px; }
    .recom-content .rec-con .gallery-top .rec-l-top li { height: 359px; }
    /* recomlist */
    .reclist-content .list-top { margin: 30px 15px 0; box-sizing: border-box; width: auto; display: flex; justify-content: center; align-items: center; }
    .reclist-content .list-top span { padding-left: 0; }
    .reclist-content .list-top input { margin: 0 10px; padding: 3px 5px; }
    .reclist-content .list-bottom { margin: 20px 15px 40px; grid-row-gap: 20px; grid-column-gap: 20px; }
    .reclist-content .list-bottom li .img { height: 192px; }
    .reclist-content .list-bottom li span { font-size: 18px; }

    /* craftaward */
    .craft-video dl { display: block; }
    .craft-video dl dt { width: 100%; height: 300px; }
    .craft-video dl dd { padding: 20px; width: 100%; }
    .craft-video dl dt a .hover-target { display: none; }
}

@media (max-width:375px) {
}

/* 2021/7/26修改 */
/* 圖片遮罩 */
.img .hover-target { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(0,0,0,0.6); opacity: 0; -webkit-transition: .5s ease-in-out; }
.img .hover-target::before { display: inline-block; content: ""; width: 70px; height: 70px; border: 1px solid #fff; position: absolute; top: 20px; left: 20px; border-right: none; border-bottom: none; }
.img .hover-target::after { display: inline-block; content: ""; width: 70px; height: 70px; border: 1px solid #fff; position: absolute; bottom: 20px; right: 20px; border-top: none; border-left: none; }
.img:hover .hover-target { opacity: 1; }

/* 修改 */
.content-new .new-left .title .section_nav .right a { float: left; margin-left: 10px; }
.nav-click { display: none; }

@media (max-width:768px) {
    .header-top h1 { margin-left: 10px; }
    .header-top h1 a { width: 280px; }
}

@media (max-width:480px) {
    .header-top { height: auto; }
    .header-top .warp { height: auto; }
    .header-top .warp .close { display: flex; padding: 16px 24px 26px; }
    .header-nav .close .right { position: static; top: 0; left: 0; }
    .header-top .wrapper img { transition: .8s ease-in-out; }
    /*2021/7/27*/
    .content .content-banner .text { text-align: left; height: 3.75em; display: flex; justify-content: flex-start; align-items: center; margin: 0; padding: 0 .9357em; width: 100%; line-height: 1.25em; }
    .content .content-banner .text a { text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; overflow: hidden; -webkit-box-orient: vertical; }
    .content .content-banner .text span { margin-top: 3px; }
    /* .content .content-banner .img img { height: 280px; width: 100%; margin-top: 0; } */



}
