@charset "utf-8";@import url(reset.css);@import url(awesomefont4.4/css/font-awesome.min.css);@import url(rwdgrid.css);*{font-family:Heiti TC, "微軟正黑體", "メイリオ", Microsoft JhengHei, Helvetica, Arial, sans-serif;}
body{opacity:0;background:#111;font-size:13px;transition:all 0.4s ease;}
body.open{opacity:1;}
body.exit{opacity:0;}
a{cursor:pointer;color:#d22829;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-o-transition:all 0.4s ease;transition:all 0.4s ease;}
[class*='col-']{float:left;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
.b-box{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
.col-1{width:100%;}
.col-2{width:50%;}
.col-3{width:33.33%;}
.col-4{width:25%;}
.col-5{width:20%;}
a.btn_color1{display:inline-block;background:#da3940;padding:8px 35px;font-size:18px;color:#FFF;box-shadow:2px 2px 0 #811318;}
a.btn_color1:hover{box-shadow:none;}
a.btn_color2{display:inline-block;padding:10px 40px;border:1px solid #FFF;font-size:15px;color:#FFF;}
a.btn_color2:hover{box-shadow:none;}
input[type="text"]{-webkit-appearance:none;}
textarea{-webkit-appearance:none;}
.outerWrap{position:relative;}
.wrap{width:1160px;margin:0 auto;}
.label{padding:5px 7px;color:#FFF;background:rgba(0,0,0,0.8);}
header{width:100%;position:fixed;left:0;top:0;z-index:300;transition:all 0.4s ease;}
header.shrinkins{background:rgba(255,255,255,0.92);box-shadow:0px 2px 2px rgba(0,0,0,0.20);}
header.shrinkins .logo{padding:5px 0 0 0;}
header.shrinkins ul.menu li > a{padding:20px 0;}
header.shrinkins ul.menu li > a b{display:none;}
header.shrinkins ul.menu li > a b:after{display:none;}
header .logo{padding:20px 0;transition:all 0.4s ease;}
header.shrinkins .logo strong a{display:block;width:100%;height:50px;background:url(../images/logo2.png) no-repeat left center;background-size:contain;text-indent:-9999px;}
header strong{display:inline-block;width:180px;padding:0;transition:all 0.4s ease;}
header strong a{display:block;width:100%;height:50px;background:url(../images/logo.png) no-repeat left center;background-size:contain;text-indent:-9999px;}
header.shrinkins ul.menu li > a{color:#000;}
nav.menuBox{text-align:right;padding:0;}
/* 
#8694c5 為menu選項的顏色
*/
ul.menu{}
ul.menu li{position:relative;float:left;}
ul.menu li > a{display:block;font-size:15px;padding:45px 0px 5px 0px;margin:0 16px;color:#FFF;position:relative;z-index:1;}
ul.menu li > a b{display:block;background:#8694c5;width:34px;height:32px;line-height:32px;text-align:center;font-size:12px;color:#FFF;border-radius:100%;position:absolute;top:5px;left:50%;margin-left:-16px;transition:all 0.4s ease;}
ul.menu li > a b:after{position:relative;bottom:10px;left:50%;margin-left:-16px;display:block;content:"";width:0;height:0;border-style:solid;border-width:20px 16px 0 16px;border-color:#8694c5 transparent transparent transparent;}
ul.menu li > a:after{content:"";display:none;width:0;height:1px;background:#d22829;opacity:0;transition:all 0.4s ease;position:absolute;bottom:0;left:0;z-index:-1;}
ul.menu li > a:hover,
ul.menu li > a.current{}
ul.menu li > a:hover:after,
ul.menu li > a.current:after{width:100%;opacity:1;}
ul.menu li.dropDown{}
ul.menu li .submenu{display:none;width:250px;position:absolute;top:100%;left:0;}
/* 
background:rgba(31,53,129,0.7)設定顏色與透明度
01 設定電腦版menu的背景色與移過的顏色
*/
ul.menu li .submenu a{display:block;background:rgba(47,113,185,0.9);padding:10px 15px;font-size:15px;text-align:left;color:#fff;}
ul.menu li .submenu a:hover{background:#55bacf;}

header.shrink{background-color:rgba(0,0,0,0.92);}
header.shrink .logo{padding:5px 0 0 0;}
header.shrink ul.menu li > a{padding:20px 0;}
header.shrink ul.menu li > a b{display:none;}
header.shrink ul.menu li > a b:after{display:none;}
header.ins ul.menu li > a:hover,
ul.menu li > a.current{}
header.ins ul.menu li > a.current:after{width:100%;height:2px;background:#8694c5;display:block;}
.m_menu{display:none;}
.bannerArea{clear:both;position:relative;}
.bannerArea .wrap{width:100%;padding:0;}
.bannerArea ul li{display:table;width:100%;height:450px;color:#fff;background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;}
.bannerArea ul li .title{width:100%;text-align:center;display:table-cell;vertical-align:middle;}
.bannerArea ul li .title h1{font-size:4em;font-weight:normal;font-family:Helvetica, Arial, sans-serif, "微軟正黑體", Heiti TC, "メイリオ";color:#FFF;line-height:1;}
.bannerArea ul li .title em{font-size:1em;color:#FFF;font-weight:normal;line-height:2;}
.bannerAreaSlider{clear:both;position:relative;}
.bannerAreaSlider h1,
.bannerAreaSlider .title
{line-height:1;font-size:3.2em;font-weight:normal;color:#FFF;font-family:Helvetica, Arial, sans-serif, "微軟正黑體", Heiti TC, "メイリオ";}
.bannerAreaSlider em{line-height:1;font-size:1.4em;font-weight:normal;color:#FFF;}
/* 設定foot的高度 padding屬性 */
footer{padding:25px 0;background:#f2f3f3;}
footer .topBox{margin-bottom:10px;padding-bottom:10px;}
footer .topBox div:first-Child{padding-top:0;}
footer .topBox h4{margin-bottom:15px;font-family:Verdana, Geneva, sans-serif;font-weight:normal;font-size:26px;color:#FFF;text-transform:uppercase;}
footer .topBox h4 i{font-size:25px;margin-right:5px;}
footer .topBox p{font-size:15px;color:#FFF;line-height:25px;}
footer address{ color:#FFF; font-style:normal;}
ul.downMenu li{padding:0;}
ul.downMenu li a{display:block;padding:7px;font-size:13px;color:#c9c9c9;}
ul.downMenu li a:hover{text-decoration:underline;}
/*頁底背景色*/
.endArea{clear:both;border-top:0px solid #3a3a3a;text-align:center;padding:20px 0;color:#FFF;background:#2f71b9;}
.endArea span{padding:0 5px;color:#686868;}
.goTopBox{position:absolute;right:50px;z-index:99;}
.goTopBox a{display:block;background:#BD4242;width:50px;height:50px;font-size:25px;line-height:46px;border-radius:100%;color:#FFF;text-align:center;}
.mainArea{background:#FFF;padding:50px 0;}
.contentBox{}
.textEditor{clear:both;padding:0 10px;font-size:1.2em;color:#2f2f2f;line-height:1.8;}
.textEditor a{color:#d22829;}
.textEditor a:hover{color:#0e7cc2;text-decoration:underline;}
.textEditor div.btn{text-align:center;padding:10px 0;}
.textEditor div.btn a{background:#d22829;color:#fff;display:inline-block;padding:10px 20px;border-radius:5px;}
.textEditor img{max-width:100%;}
.textEditor ul{list-style:disc outside;padding-left:30px;}
.textEditor ol{list-style:decimal outside;padding-left:30px;}
/*關閉是為了要看到表的的內框線，同時移掉reset.css中的tr, th, td
.textEditor table{border-collapse:collapse;}
.textEditor table th{padding:20px;text-align:center;background:#BD4242;color:#FFF;}
.textEditor table td{background:#FFF;padding:10px;border-bottom:1px solid #f1f1f1;}
*/
table.breakpoint > tbody > tr > td.expand{cursor:pointer;background:url(../images/plus.png) no-repeat 5px center;padding-left:40px;}
.textEditor hr{margin:30px 0;border:none;border-top:1px solid #e8e8e8;}
.textEditor h1{font-weight:normal;font-size:2.5em;margin-bottom:20px;}
.textEditor h2{font-weight:normal;font-size:2.2em;color:#000;margin-bottom:15px;}
.textEditor h3{font-weight:normal;font-size:2.1em;margin-bottom:10px;}
.textEditor h4{font-weight:normal;font-size:2em;margin-bottom:40px;padding:30px 20px;text-align:center;border-radius:0 0 10px 10px;}
.textEditor h5{font-weight:normal;font-size:1.3em;margin-bottom:5px;}
.textEditor h5 i{padding-right:5px;}
.textEditor h6{font-weight:normal;font-size:1.2em;}
.socailBtn{ clear:both; padding:30px 0; text-align:center;}
.socailBtn > div{ display:inline-block !important; vertical-align:middle !important; margin:0 5px;}
.m_classLink{display:none;}
.classBox{margin-bottom:70px;}
ul.classLink{text-align:center;}
ul.classLink li{display:inline-block;margin-right:15px;margin-bottom:15px;}
ul.classLink li i{display:block;font-size:1.3em;}
ul.classLink li a{font-size:14px;display:block;padding:10px 18px;color:#000;border:1px solid #dcdcdc;}
ul.classLink li a:hover,
ul.classLink li a.current{color:#FFF;background:#d22829;border:1px solid #d22829;}
ul.classLink li a.current:before{display:none;content:"X";font-size:12px;margin-right:8px;}
ul.classLink li a.current_all{color:#FFF;background:#d22829;border:1px solid #d22829;}
ul.classLink li a.current_all:before{display:none;content:"X";font-size:12px;margin-right:8px;}
.sideMenu{}
.sideMenu h4{font-size:20px;font-weight:normal;color:#d22829;}
.sideMenu h4 i{margin-right:8px;}
.sideMenu ul{margin-top:5px;}
.sideMenu ul li{border-bottom:1px solid #e1e1e1;position:relative;}
.sideMenu ul li a{display:block;color:#222;padding:15px 0;font-size:14px;}
.sideMenu ul li a:hover,
.sideMenu ul li a.current{color:#d22829;}
.sideTag{margin-bottom:30px;}
.sideTag h4{font-size:20px;font-weight:normal;color:#d22829;}
.sideTag h4 i{margin-right:8px;}
.sideTag ul{margin-top:10px;}
.sideTag ul li{display:inline-block;margin:4px 2px;}
.sideTag ul li a{display:block;background:#f0f0f0;color:#222;padding:10px 15px;font-size:14px;}
.sideTag ul li a:hover,
.sideTag ul li a.current{background:#d22829;color:#FFF;}
@media (max-width:1367px){header .wrap{padding:0 20px;}
}
@media (max-width:1160px){.outerWrap{}
.mainArea{padding:20px 0;}
.wrap{width:99%;padding:0 1%;}
/*
.wrap{width:90%;padding:0 5%;}
width讓寬度永遠等於容器寬度的90%
padding留白
*/
header{display:none;}
.m_menu{display:block;width:100%;-webkit-box-shadow:0px 2px 2px 2px rgba(26,26,26,0.50);box-shadow:0px 2px 2px 2px rgba(26,26,26,0.50);position:fixed;top:0;left:0;z-index:9999;}
/*選單外的遮罩顏色 */
.m_menu .mask{display:none;background:rgba(76,82,165, 0.7);position:fixed;width:100%;height:100%;padding-bottom:60px;top:0;left:0;}
/* 首頁menu的背景色 */
.m_menu .controlBox{background:#f8f8f8;}
/*width:85px 加寬menu與logo的顯示範圍 */
.m_menu .controlBox a.main{display:block;float:left;width:85px;height:50px;font-size:20px;color:#FFF;line-height:50px;text-align:center;}
/* 取消，讓logo自動調整
.m_menu .controlBox .m_logo{padding-top:5px;width:100px;overflow:hidden;}
.m_menu .controlBox .m_logo img{display:block;width:100%;max-width:100%;}
*/
.m_menu .controlBox .m_logo{}
.m_menu .controlBox .m_logo img{}
.m_menu .controlBox .right{float:right;margin-top:16px;margin-right:10px;}
.m_menu .controlBox .right a{display:inline-block;font-size:12px;padding:5px 7px;color:#FFF;text-align:center;border-radius:3px;border:1px solid #FFF;}
/* 
#8694c5 為menu選項的顏色
*/
/* 02主選單顏色 */
.m_menu .hideBox{display:none;background:#385197;width:230px;padding-bottom:50px;overflow-y:auto;-webkit-overflow-scrolling:touch;position:fixed;left:0;top:0;bottom:0;}

/* 01點到主項目，展開時反白
menu title的背景色 background:#5ca0eb;
的顏色 */
.m_menu .hideBox p.sp{padding:10px;font-size:13px;color:#FFF;background:#5ca0eb;}
.m_menu .hideBox .m_trans{text-align:center;padding:30px 0;}
.m_menu .hideBox .m_trans > div{display:inline-block;}
.m_menu .hideBox .language{text-align:center;padding:30px 0;}
.m_menu .hideBox .language a{display:inline-block;margin:0 5px;font-size:13px;color:#FFF;}
.m_menu .mfun{padding:15px 0;text-align:center;}
.m_menu .mfun a{margin:0 1px;display:inline-block;font-size:20px;background:#eb2629;color:#FFF;width:35px;height:35px;line-height:35px;text-align:center;border-radius:100%;}
.m_menu ul.nav{}
/*04menu選單的文字與01的background同色！
background:#385197;
 */
.m_menu ul.nav li a{padding:20px 10px;font-family:"微軟正黑體", "新細明體", sans-serif;display:block;font-size:15px;color:#FFF;background:#385197;}
.m_menu ul.nav li a i{float:right;}
.m_menu ul.nav li .submenu{display:none;}

/*03 點到子項目的顏色 */
.m_menu ul.nav li .submenu a{display:block;background:#8694c5;padding:10px 20px;font-size:12px;}
.m_menu ul.nav li .submenu a:hover{background:#efba2b;}
}
@media (max-width:767px){.mainArea{}
.mainArea .wrap{padding:0 20px;}
}
@media (max-width:640px){}
@media (max-width:480px){.col-2{float:none;width:100%;}
.col-3{float:none;width:100%;}
.col-4{float:none;width:100%;}
.col-5{float:none;width:100%;}
.goTopBox{position:fixed;top:auto !important;bottom:10px !important;right:10px;}
}
.imh_opacity{background:#000;overflow:hidden;}
.imh_opacity img{transition:all 0.3s linear;-webkit-backface-visibility:hidden;}
.imh_opacity:hover img{opacity:0.8;transform:scale(1.05);}
.imh_detail{background:#000;overflow:hidden;}
.imh_detail img{transition:all 0.3s linear;-webkit-backface-visibility:hidden;}
.imh_detail a:before{display:block;content:"Details+";padding:10px 20px;font-size:13px;color:#FFF;border:2px solid #FFF;opacity:0;position:absolute;left:50%;margin-left:-45px;top:50%;margin-top:-80px;z-index:99;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;transition:all 0.3s ease;}
.imh_detail:hover a:before{opacity:1;margin-top:-20px;}
.imh_detail:hover img{opacity:0.3;transform:scale(1.05);}
.imh_zoom{display:block;background:#fff;overflow:hidden;position:relative;}
.imh_zoom:hover{background:#000;}
.imh_zoom img{transition:all 0.3s linear;-webkit-backface-visibility:hidden;}
.imh_zoom:before{display:block;font-family:'FontAwesome';content:"\f002";font-size:18px;color:#000;background:#FFF;width:40px;height:40px;line-height:40px;text-align:center;border-radius:100%;position:absolute;left:50%;top:-30px;margin-top:-20px;margin-left:-20px;z-index:99;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-o-transition:all 0.4s ease;transition:all 0.4s ease;}
.imh_zoom:hover:before{top:50%;}
.imh_zoom:hover img{opacity:0.3;transform:scale(1.05);}
