﻿@charset "utf-8";
/* CSS Document */

/* 重設
--------------------------------------------------- */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain) */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;background: transparent;/*vertical-align: baseline;*/}
ol, ul, li{list-style: none;}

/*以下為針對HTML5,暫時不開放----------------*/  
/* HTML5 display-role reset for older browsers */
/*
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
*/
fieldset,img { border: none; }

/*-------------------基本-----------------------------*/
*, ::after, ::before{box-sizing: content-box}
a{ font-size:15px; text-decoration:none;outline:none; /* for Firefox */
 hlbr:expression(this.onFocus=this.blur()); color:#000 /* for IE */;transition:all 0.3s}
a:hover{ font-size:15px; text-decoration:none;color:#000;outline:none; /* for Firefox */hlbr:expression(this.onFocus=this.blur());transition:all 0.3s}
a:focus{outline: none;hlbr:expression(this.onFocus=this.blur());text-decoration:none;transition:all 0.3s}
body{outline:none; /* for Firefox */hlbr:expression(this.onFocus=this.blur()); /* for IE */ line-height:0px;
min-height:100vh; display:flex; flex-direction:column}
/*TOP整體下滑介面設定*/
.m0{ width:100%; height:auto; overflow:hidden; }
.m0-2{box-shadow:0 1px 3px rgba(0,0,0,0.1); height:0;overflow:hidden;position:relative; z-index:0;opacity:0;}
.top-bar{position:fixed;top:0px; z-index:100; height:172px;transition:all 0.3s; background:#fff;box-shadow:0 1px 5px rgba(0,0,0,0.2);opacity:1;overflow:inherit;}
/*主選單*/
.m1x{width:100%;height:80px;overflow:hidden;}
.m1{width:100%;height:auto;overflow:hidden;background:#545098;box-shadow: 0px 3px 8px rgba(0,0,0,.2);z-index:2;position:fixed;background:linear-gradient(10deg,#e84631 0%,#e36150 80%) no-repeat center top}
.m1 .a1{width:100%;height:auto;overflow:hidden; margin:0 auto;text-align:center;position:relative}
.m1 .a1 .lg1{width:176px;height:40px;overflow:hidden;padding:0 0 0;position:absolute;left:2%;top:20px}
.m1 .a1 .lg1 a img{width:100%;height:100%;}

.m1 .a1 .lg2{width:auto;height:70px;overflow:hidden;padding:0 0 0;position:absolute;left:2%;top:5px;display:none}
.m1 .a1 .lg2 a img{width:auto;height:100%;}

.m1 .a1 .lka1{width:calc(100% - 0px);height:80px;overflow:hidden;padding:20px 0 0;box-sizing: border-box;float:right}
.m1 .a1 .lka1 .lk1{width:auto;height:40px;overflow:hidden;display:inline-block;margin:0 5px;vertical-align:top}
.m1 .a1 .lka1 .lk1 a{width:auto;height:40px;overflow:hidden;font:700 24px/36px 'Noto Serif TC','Noto Sans TC',"Century Gothic","微軟正黑體"; color:#fff;text-align:center;display:block;border-radius:100px;padding:0 15px}

.m1 .a1 .lka1 .lk1 a:hover{background:#fb0;color:#111}
.bg1{background:url("../../images/bg1b.jpg") no-repeat center /cover;}
/*橫幅*/
.bn1{width:100%;height:900px;overflow:hidden; background:url("../../images/bn1.jpg") no-repeat center /cover;}
/*1*/
.m2{width:100%;height:auto;overflow:hidden;border-bottom: 3px dashed #ffae49/*background:#f6d19d;background:url("../../images/bg1.jpg") no-repeat center top/cover;*/}
.m2 .a2{width:100%;height:auto;overflow:hidden;padding:120px 0 60px;margin:0 auto}
.t1{width:570px;height:auto;overflow:hidden;margin:0 auto 0px}

.t1b{width:625px;}

.t1c{width:710px;}
.t1d{width:580px;}
.t1 img{width:100%;height:auto;}

.t1 h4{width:100%;height:auto;overflow:hidden;font:italic 700 28px/42px 'Noto Sans TC',"Century Gothic","微軟正黑體";margin-bottom:20px;color:#111;text-align:center;letter-spacing:-1px;padding:0 0 0}

.m2 .a2 .b1{width:100%;height:auto;overflow:hidden;}
.m2 .a2 .b1 .im1{width:1300px;height:auto;overflow:hidden;margin:0 auto 60px}
.m2 .a2 .b1 .im1 img{width:100%;height:auto;}

.m2 .a2 .b1 .im2{width:1400px;height:auto;overflow:hidden;margin:0 auto 0}
.m2 .a2 .b1 .im2 img{width:100%;height:auto;}
/*2*/
.m3{width:100%;height:auto;overflow:hidden;/*background:#f6d19d;background:url("../../images/bg1.jpg") no-repeat center top/cover;*/}
.m3 .a3{width:1200px;height:auto;overflow:hidden;padding:120px 0 60px;margin:0 auto}
.t2{width:750px;height:auto;overflow:hidden;margin:0 auto 80px}
.t2 img{width:100%;height:auto;}
.m3 .a3 .b2{width:100%;height:auto;overflow:hidden;}
.m3 .a3 .b2 .im3{width:600px;height:auto;overflow:hidden;float:left}
.m3 .a3 .b2 .im3 img{width:100%;height:auto;transition:all 0.3s}
.m3 .a3 .b2 .im3 img:hover {transform:rotate(0deg) scale(1.00); transition:all 0.3s; filter:brightness(120%)}

/*2*/
.m4{width:100%;height:auto;overflow:hidden;/*background:#f6d19d;background:url("../../images/bg1.jpg") no-repeat center top/cover;*/}
.m4 .a4{width:1200px;height:auto;overflow:hidden;padding:120px 0 60px;margin:0 auto}
.t3{width:680px;height:auto;overflow:hidden;margin:0 auto 80px}
.t3 img{width:100%;height:auto;}
.m4 .a4 .b3{width:100%;height:auto;overflow:hidden;}

.ls1{width:48%;min-height:300px;height:auto;padding:15px 0;float:left;
margin: 0 1% 20px;
background:url("../../images/tpbg.png") no-repeat center top/100% auto,
url("../../images/dwbg.png") no-repeat center bottom/100% auto
;box-sizing: border-box/*;border:1px solid #ffcc99;border-top:0;border-bottom:0;*/}

.ls1 .d1{width:100%;height:auto;overflow:hidden;background:url("../../images/bg2.jpg") center;padding:30px;box-sizing: border-box;}
.ls1  .d1 .t4{width:100%;height:auto;overflow:hidden;font:700 28px/40px 'Noto Serif TC','Noto Sans TC',"Century Gothic","微軟正黑體";margin-bottom:12px;color:#fff;text-align:center}
.ls1  .d1 .t4 h4{width:150px;height:42px;overflow:hidden;font:700 36px/40px 'Noto Serif TC','Noto Sans TC',"Century Gothic","微軟正黑體";margin-bottom:20px;color:#f80;text-align:center;border-radius:100px;display:block;background:#fff;margin:0 auto 8px;text-transform:uppercase}

.ls1  .d1 .im4{width:100%;height:auto;overflow:hidden;float:left}
.ls1  .d1 .im4 img{width:100%;height:auto;transition:all 0.3s}


.dwbt1{width:70px; height:70px;overflow:hidden;display:inline-block; text-align:center;border-radius:100px;border:0px solid #e95377; transition:all 0.3s;position:fixed; bottom:20px; right:2%;z-index:99;box-shadow:0 2px 8px rgba(0,0,0,0.3)}

.dwbt1 a img{width:100%;height:auto;transition:all 0.3s}
.dwbt1 a img:hover {transform:rotate(0deg) scale(.95); transition:all 0.3s;}
/*
.dwbt1 a{width:100%; height:38px;font:500 18px/36px 'Noto Sans TC',"Century Gothic","微軟正黑體";color:#fff;display:block;background:#1756a4}
.dwbt1 a:hover{ background:#043b80; border:0px solid #3577c1;transition:all 0.3s;}
*/

.bgt1{width:100%;height:auto;overflow:hidden;font:italic 900 88px/92px 'Noto Serif TC','Noto Sans TC',"Century Gothic","微軟正黑體";margin-bottom:20px;color:#0d0d2e;text-align:center;margin:0 0 20px 0;letter-spacing:-4px}
.bgt1 h4{width:100%;height:auto;overflow:hidden;font:italic 700 28px/30px 'Noto Sans TC',"Century Gothic","微軟正黑體";margin-bottom:20px;color:#333;text-align:center;letter-spacing:-1px;padding:25px 0 0}

/*隱藏訊息*/
.htx1{width:100%;height:0;overflow:hidden;}
/*3*/
.m5{width:100%;/*min-height:1000px;*/ height:auto;overflow:hidden;border-bottom: 3px dashed #ffae49;/*background:#f6d19d;background:url("../../images/bg1.png") no-repeat -40px center/auto 90%;*/}
.m5 .a5{width:1200px;height:auto;overflow:hidden;padding:120px 0 60px;margin:0 auto}
.m5 .a5 .b4a{width:52%;height:auto;overflow:hidden;float:left;}
.m5 .a5 .b4a .im5b{width:100%;height:auto;overflow:hidden;margin:0 0 30px;float:left;padding:30px 0 0}
.m5 .a5 .b4a .im5b img{width:100%;height:auto;}
.m5 .a5 .b4{width:calc(100% - 52%);height:auto;overflow:hidden;float:right;padding:40px 0 0}
.m5 .a5 .b4 .im5{width:100%;height:auto;overflow:hidden;margin:0 0 30px;float:left}
.m5 .a5 .b4 .im5 img{width:100%;height:auto;}


/*4*/
.m6{width:100%;height:auto;overflow:hidden;border-bottom:0px dashed #b6b6cc;}
.m6 .a6{width:1300px;height:auto;overflow:hidden;padding:120px 0 60px;margin:0 auto}

.m6 .a6 .b5{width:100%;height:auto;overflow:hidden;float:right;padding:0 0 0}

.m6 .a6 .b5 .t5{width:100%;height:auto;overflow:hidden;font:700 28px/40px 'Noto Serif TC','Noto Sans TC',"Century Gothic","微軟正黑體";margin-bottom:12px;color:#111;text-align:center}

.m6 .a6 .b5 .t5 h4{width:150px;height:42px;overflow:hidden;font:700 36px/40px 'Noto Serif TC','Noto Sans TC',"Century Gothic","微軟正黑體";margin-bottom:20px;color:#f80;text-align:center;border-radius:100px;display:block;background:#fff;margin:0 auto 8px;text-transform:uppercase}

.m6 .a6 .b5 .im6{width:50%;height:auto;overflow:hidden;margin:0 0 30px;float:left}

.m6 .a6 .b5 .im6 img{width:100%;height:auto;}
.m6 .a6 .b5 .c1{
width:calc(100% - 54%);height:auto;overflow:hidden;float:right;padding:20px 0 0}
.m6 .a6 .b5 .c1 .im7{width:100%;height:auto;overflow:hidden;margin:0 0 30px;float:left}
.m6 .a6 .b5 .c1 .im7 img{width:100%;height:auto;}


/*down*/
.m7{width:100%;height:auto;overflow:hidden;border-bottom:0px dashed #b6b6cc;background:#e36150}
.m7 .a7{width:100%;height:60px;overflow:hidden;margin:0 auto;font:500 14px/60px'Noto Sans TC',"Century Gothic","微軟正黑體";text-align:center;color:#fff}


