@charset "utf-8";
/* CSS Document */
@import url("swiper.min.css");
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC:300,400,500,700&display=fallback&subset=chinese-traditional');

body,input,select { font:normal 16px/140% 'Noto Sans TC', '微軟正黑體', 'Arial Unicode MS', 'sans-serif'; color:#222; background-color:#fff; margin:0; padding:0;}
html, body {height: 100%; position: relative;}
a {text-decoration:none; transition:all 0.3s; -moz-transition:all 0.3s; -webkit-transition:all 0.3s;}
div, p, span, ul, ol, li, h1, h2, h3, h4, h5, h6, input, table, td, th, img {margin: 0;padding: 0;border: none;}
img {border: none;display:block;}
img.inline { display: inline-block; vertical-align: middle; }
ul, li {list-style: none;}
.fL {float:left;}
.fR {float:right;}
.tL {text-align:left;}
.tR {text-align:right;}
.tC {text-align:center;}
.tC img{ margin:0 auto;}
.tB {font-weight: 500;}
.clr {clear:both;}

/*key_color*/
.key_org{ color: #fe6700;}
a.key_org{ color: #fe6700; text-decoration: underline;}
.key_lake{ color: #1ba6b7;}
.key_blue{ color: #0099e0;}
.key_red{ color: #b11818;}
a.key_red{ color: #b11818; text-decoration: underline;}


/*頁面設定*/
.fullpage{ width: 100%; min-width: 1100px;}
.fullpage.gray{ background-color: #f3f3f3;}
.fullpage.gray2{ background-color: #e5e5e5;}
.fullpage.blue{ background-color: #000066;}
.pagesize{ width: 1100px; margin:0 auto; padding: 25px 50px; box-sizing:border-box;}
.wrapper{ padding-top: 100px;}

.m_hide{ display: block;}
.m_block{ display: none;}

/*header*/
.header{ width: 100%; min-width: 1100px; border-top:5px solid #000067; background-color: #f4f4f4; position: fixed; top: 0; left: 0; z-index: 99;}
.header_in{ height: 95px; margin:0 auto; padding: 0 50px 0 400px; box-sizing: border-box; position: relative;}
h1{ width: 340px; height: 40px; background: url("../images/logo.jpg") no-repeat; background-size: contain; position: absolute; top: 50%; left: 50px; margin-top: -20px;  transition:all 0.3s; -moz-transition:all 0.3s; -webkit-transition:all 0.3s;}
h1 a{ width: 100%; height: 100%; display: block; text-indent:-9999px;}
.menu{ display: flex; justify-content:flex-end; align-items:center;}
.menu ul.main{ display:flex; margin-right: 30px;}
.menu ul.main li{ margin-left: 55px; line-height: 95px; font-size: 18px; font-weight: 500; color: #222; position: relative;}
.menu ul.main li:nth-child(1){ margin-left: 0;}
.menu ul.main li::after{ content:''; width: 30px; height: 3px; background-color: rgba(255, 102, 0, 0); display: block; position: absolute; left: 50%; margin-left: -15px; bottom: 23px; transition:all 0.3s;}
.menu ul.main li:hover::after, .menu ul.main li.on::after{ background-color: rgba(255, 102, 0, 1);}
.menu ul.main li a{ color: #222;}
.menu ul.link{ display:flex;}
.menu ul.link li{ width: 35px; height: 35px; border: 1px solid #868686; border-radius: 99em; transition:all 0.3s;}
.menu ul.link li a{ width: 100%; height: 100%; display: block;}
.menu ul.link li.home{ background: url("../images/btn_home.png") center center no-repeat; background-size: contain; margin-right: 6px;}
.menu ul.link li.en{ background: url("../images/btn_en.png") center center no-repeat; background-size: contain;}
.menu ul.link li.ch{ background: url("../images/btn_ch.png") center center no-repeat; background-size: contain;}
.menu ul.link li:hover{ border: 1px solid #000066;}
.menu ul.link li.home:hover{ background:#000066 url("../images/btn_home_on.png") center center no-repeat; background-size: contain; margin-right: 6px;}
.menu ul.link li.en:hover{ background:#000066 url("../images/btn_en_on.png") center center no-repeat; background-size: contain;}
.menu ul.link li.ch:hover{ background:#000066 url("../images/btn_ch_on.png") center center no-repeat; background-size: contain;}

.header.sticky { -moz-box-shadow: 0 0 15px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.2); box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);} 
.header.sticky .header_in { height: 70px; }
.header.sticky h1 { width: 309px; height: 36px; margin-top: -18px;}
.header.sticky .menu ul.main > li { line-height: 70px;}
.header.sticky .menu ul.main > li::after{ bottom: 12px;}

/*標題*/
h2{ font-size: 30px; font-weight: 500; color: #bbb; line-height: 1.2em; margin-bottom: 25px;}
h2.black{ color: #3d3d3d; padding-right: 100px; margin-bottom: 20px; position: relative;}
h2.black a.more{ font-size: 16px; color: #959595; font-weight: normal; position: absolute; right: 0; top: 0px;}
h2.black a.more::after{ content: ''; width: 20px; height: 20px; display: inline-block; vertical-align:sub; background: url("../images/btn_toGo.png")no-repeat; background-size: contain; margin-left: 5px;}
h2.black a.more:hover{ color: #000066; text-decoration: underline;}
h2.black a.more:hover::after{ background: url("../images/btn_toGo_on.png")no-repeat; background-size: contain;}
h2.black a{ color: #3d3d3d; }

h3{ font-size: 18px; color: #000066; font-weight: 500; position: relative; margin-bottom: 25px;}
h3 span{ background-color: #fff; padding: 0 20px;}
h3::before{ content: ''; width: 3px; height: 15px; background-color: #000066; display: inline-block; vertical-align: middle;}
h3::after{ content: ''; width: 100%; height: 1px; background-color: #e0e0e0; position: absolute; top: 50%; left: 0; z-index: -1;}

/*topBN*/
.topBn_area{ width: 100%; height: auto; padding-top: 100px; overflow: hidden; position: relative;}
.topBn_area img { width: 100%; height: auto;}
.swiper-container-horizontal > .swiper-pagination-bullets{ bottom: 30px;}
.swiper_topBN .swiper-pagination-bullet{ width: 12px; height: 12px; background-color: #000066; opacity: 0.8;}
.swiper_topBN .swiper-pagination-bullet-active{ background-color: #ff6600; opacity:1;}
.swiper_topBN.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px;}

/*stage*/
.stage{ width: 1100px; margin:0 auto; padding: 35px 50px; box-sizing: border-box; display: flex; justify-content:space-between; align-items:center;}
.stage .box_txt{ width: 50%; text-align: right;}
.stage .box_txt .headline{ color: #3e3e3e; font-weight: 500; font-size: 25px; padding: 25px 0;}
.stage .box_txt p{ line-height: 30px; margin-bottom: 30px;}
.stage .box_txt a.more{ width: 180px; height: 40px; line-height: 40px; display: block; text-align: center; font-size: 14px; font-weight: lighter; border-radius: 99em; letter-spacing: 3px; float: right;
background: #8989ba; /* Old browsers */
background: -moz-linear-gradient(left,  #8989ba 1%, #a7a6cb 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #8989ba 1%,#a7a6cb 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #8989ba 1%,#a7a6cb 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8989ba', endColorstr='#a7a6cb',GradientType=1 ); /* IE6-9 */
}
.stage .box_txt a.more:hover{ letter-spacing: 2px;}
.stage .box_txt a.more span{color: #fff;}
.stage .box_txt a.more span::after{ content: ''; width: 12px; height: 12px; background: url("../images/toR_w.png") center center no-repeat; background-size: contain; display: inline-block; margin-left: 5px;}
.stage .box_pic{ width: 45%;}
.stage .box_pic img{ width: 100%; height: auto;}

.fullpage.gray .stage .box_txt{ text-align: left;}
.fullpage.gray .stage .box_txt a.more{ float: left;}

/*cards*/
ul.cards{ display: flex; justify-content:space-between; padding: 20px 0 40px 0;}
ul.cards li{ width: 32%; border-radius: 20px; overflow: hidden; padding-bottom: 80px; position: relative; -moz-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); font-size: 16px; line-height: 30px; color: #333; font-weight: 400; transition:all 0.3s; -moz-transition:all 0.3s; -webkit-transition:all 0.3s;}
ul.cards li:hover{ -moz-box-shadow: 0 2px 20px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 2px 20px rgba(0, 0, 0, 0.3); box-shadow: 0 2px 20px rgba(0, 0, 0, 0.3);}
ul.cards li .top{ height: 120px; margin-bottom: 25px; text-align: center; display: flex; align-items: center; justify-content: center;}
ul.cards li:nth-child(1) .top{ background:url("../images/card_1_bg.jpg") no-repeat; background-size: cover;}
ul.cards li:nth-child(2) .top{ background:url("../images/card_2_bg.jpg") no-repeat; background-size: cover;}
ul.cards li:nth-child(3) .top{ background:url("../images/card_3_bg.jpg") no-repeat; background-size: cover;}
ul.cards li .top p{ font-size: 20px; color: #fff; font-weight: 400; text-shadow:0px 0px 10px rgba(0, 0, 0, 0.6);}
ul.cards li .mid{ padding: 0 20px; /*word-wrap: break-word; word-break: break-all;word-wrap:break-word;*/}
ul.cards li .mid span{  font-weight: 500;}
ul.cards li a.more{ width: 100px; height: 30px; border-radius: 99em; text-align: center; line-height: 26px; position: absolute; bottom: 30px; left: 50%; margin-left: -50px;}
ul.cards li:nth-child(1) a.more{ border: 1px solid #ef6b25; color: #ef6c25;}
ul.cards li:nth-child(2) a.more{ border: 1px solid #1ba6b7; color: #1ba6b7;}
ul.cards li:nth-child(3) a.more{ border: 1px solid #26459b; color: #26459b;}
ul.cards li:nth-child(1) a.more:hover{ border: 1px solid #ef6b25; color: #fff; background-color: #ef6b25; }
ul.cards li:nth-child(2) a.more:hover{ border: 1px solid #1ba6b7; color: #fff; background-color: #1ba6b7;}
ul.cards li:nth-child(3) a.more:hover{ border: 1px solid #26459b; color: #fff; background-color: #26459b;}

/*topNews*/
ul.topNews{}
ul.topNews li{ display: flex; align-items:center; margin-bottom: 15px; position: relative;}
ul.topNews li a{ top: 0; bottom: 0; left: 0; right: 0; position: absolute;}
ul.topNews li .date{ width: 58px; height: 58px; margin-right: 20px; border: 1px solid #9fa5a8; border-radius: 15px; overflow: hidden; text-align: center;}
ul.topNews li .date div:nth-child(1){ height: 38px; background-color: #9fa5a8; color: #fff; line-height: 38px; font-size: 20px;}
ul.topNews li .date div:nth-child(2){ height: 20px; color: #8d8d8d; line-height: 18px; font-size: 12px;}
ul.topNews li p{ color: #555; width: calc(100% - 80px); border-bottom: 1px solid #e9e9e9; padding: 20px 0; overflow : hidden; text-overflow : ellipsis; white-space : nowrap; box-sizing: border-box; transition:all 0.3s; -moz-transition:all 0.3s; -webkit-transition:all 0.3s;}
ul.topNews li span{ margin-right: 20px; font-weight: 500;}
ul.topNews li:hover p{ padding-left: 5px;}

/*bot_menu*/
ul.bot_menu{ display: flex; justify-content:space-between; padding: 15px 50px; max-width: 1100px; margin: 0 auto; box-sizing: border-box;}
ul.bot_menu li a{ color: #c5c7d2;}
ul.bot_menu li a:hover{ color: #fff;}

/*footer*/
.footer{ width: 100%; background-color: #e5e5e5;}
.footer_in{ width: 1100px; padding: 40px 50px; margin: 0 auto; color: #5c5c67; font-size: 14px; line-height: 1.8em; box-sizing: border-box; display: flex; justify-content: space-between;}
.footer_in .l_set{ width: 35%;}
.footer_in .r_set{ width: 60%; text-align: right;}
.footer_in .social_list{ display: flex; align-items:center; margin-bottom: 20px;}
.footer_in .logo_f{ width: 213px; height: 20px; background: url("../images/logo_f.png") no-repeat; background-size: contain; margin-right: 10px;}
.footer_in a.link_fb{ width: 30px; height: 30px; border-radius: 99em; background: url("../images/icon_fb.jpg") no-repeat; background-size: 30px auto; overflow: hidden; display: block; margin-right: 5px;}
.footer_in a.link_in{ width: 30px; height: 30px; border-radius: 99em; background: url("../images/icon_in.jpg") no-repeat; background-size: 30px auto; overflow: hidden; display: block; margin-right: 5px;}
.footer_in a.link_ytb{ width: 30px; height: 30px; border-radius: 99em; background: url("../images/icon_ytb.jpg") no-repeat; background-size: 30px auto; overflow: hidden; display: block;}
.footer_in ul.contact_list{}
.footer_in ul.contact_list li{ margin-bottom: 0px;}
.footer_in ul.contact_list li a{ color: #5c5c67;}
.footer_in ul.contact_list li a:hover{ text-decoration: underline;}
.footer_in ul.contact_list li.email::before{ content: ''; display:inline-block; width: 18px; height: 18px; background: url("../images/icon_email.png") no-repeat; background-size: contain; vertical-align: middle; margin-right: 5px;}
.footer_in ul.contact_list li.tel::before{ content: ''; display:inline-block; width: 18px; height: 18px; background: url("../images/icon_tel.png") no-repeat; background-size: contain; vertical-align: middle; margin-right: 5px;}
.footer_in ul.contact_list li.add::before{ content: ''; display:inline-block; width: 18px; height: 18px; background: url("../images/icon_add.png") no-repeat; background-size: contain; vertical-align: middle; margin-right: 5px;}

/*---------------for 內頁---------------*/
/*route*/
.route{ width: 1000px; height: 45px; line-height: 45px; margin: 0 auto; overflow : hidden;}
.route_box{ padding: 0 25px; color: #333; font-size: 15px; display: inline-block; background:url("../images/route_bg.jpg") top left repeat-x; background-size: auto 45px; box-sizing: border-box;}
.route_box a{ color: #333;}
.route_box a:hover{ text-decoration: underline;}
.route_box span::after{ content: ' / '; display: inline-block;  margin: 0 10px;}
.route_box span:last-child::after{ display: none;}

/*table*/
table.news_list{ margin-bottom: 10px;}
table.news_list td, table.news_list th{ padding: 15px;}
table.news_list td{ border-bottom:1px solid #dedede; transition:all 0.3s; -moz-transition:all 0.3s; -webkit-transition:all 0.3s;}
table.news_list tr:last-child td{ border-bottom: none;}
table.news_list tr:nth-child(2n+1) td{ background-color: #f9f9f9;}
table.news_list tr:hover td{ background-color: #ededf9; color: #fe6700;}
table.news_list tr:hover td .arrow{ background: url("../images/toR_org.png") center center no-repeat; background-size: 12px 12px;}
table.news_list td.date{ text-align: center; color: #000066; width: 15%;}
table.news_list td.news_togo{ position: relative; padding-right: 50px;}
table.news_list td.news_togo a{ position: absolute; top: 0; bottom: 0; right: 0; left: 0;}
table.news_list td.news_togo .arrow{ width: 50px; height: 50px; background: url("../images/toR_gry.png") center center no-repeat; background-size: 12px 12px; position: absolute; top: 50%; margin-top: -25px; right:0; transition:all 0.3s; -moz-transition:all 0.3s; -webkit-transition:all 0.3s;}
table.news_list th{ background-color: #000066; color: #fff; font-weight: normal; border-right:1px solid #fff;}
table.news_list th:last-child{ border-right: none;}

/*news*/
.news_title{ color: #000066; font-size: 18px; font-weight: 500; line-height: 1.5em; padding-bottom: 20px; border-bottom: 1px solid #e0e0e0; margin-bottom: 10px;}
.date_box{ display: flex; justify-content: space-between; font-size: 15px; line-height: 1.2em; margin-bottom: 30px;}
.date_box div:nth-child(1){ color: #9494bf;}
.date_box div:nth-child(2) a{ color: #959595;}
.date_box div:nth-child(2) a::before{ content: ''; width: 20px; height: 20px; display: inline-block; vertical-align:sub; background: url("../images/btn_pre.png")no-repeat; background-size: contain; margin-right: 5px;}
.date_box div:nth-child(2) a:hover{ color: #000066; text-decoration: underline;}
.date_box div:nth-child(2) a:hover::before{ background: url("../images/btn_pre_on.png")no-repeat; background-size: contain;}

/*文章*/
.txt_area{ line-height: 1.8em; font-weight: 300;}
.txt_area .phase{ margin-bottom: 30px;}
.txt_area .graph{ display:flex; justify-content: center; align-items:center; text-align: center; color: #666; margin-bottom: 10px;}
.txt_area .graph div{ width: 48%; margin: 10px;}
.txt_area .graph img{ width: 100%; height: auto; }
.txt_area .graph.single{ display: block;}
.txt_area .graph.single div{ width: 100%; margin: 10px 0;}

ul.list_blue{ margin-bottom: 25px;}
ul.list_blue li{ padding-left: 30px; position: relative; margin-bottom: 10px;}
ul.list_blue li::before{ content: ''; width: 8px; height: 8px; display: block; border-radius: 99em; background-color: #25abe9; position: absolute; top: 12px; left: 6px;}
ul.list_blue.gray li::before{ background-color: #c8c8c8;}
ul.list_blue li ol li{ list-style: decimal; padding-left: 0; margin-left: 20px; margin-bottom: 5px;}
ul.list_blue li ol li::before{ display: none;}

.separate{ width: 100%; height: 35px; background: url("../images/separate_bg.png") center center no-repeat; background-size: contain;}

ul.sort{ display: flex; justify-content: center; margin-bottom: 30px;}
ul.sort li{ width: 23%; height: 40px; line-height: 40px; font-weight: 400; text-align: center; margin: 0 1%; border-radius: 99em; border:1px solid #26459b; padding: 0 10px; box-sizing: border-box;}
ul.sort li:hover{ background-color: #000066;}
ul.sort li a{ width: 100%; height: 100%; display: block; color: #000066;}
ul.sort li:hover a{ color: #fff;}

.phto_list{ display: flex; justify-content: space-around; margin-bottom: 20px;}
.phto_list .pic{ width: 24%; height: auto; border: 1px solid #e0e0e0;}
.phto_list .pic img{ width: 100%; height: auto;}

.qrCode{ border-top: 1px dashed #bbb; padding-top: 20px;}
.qrCode p{ text-align: center; font-weight: 500;}
.qrCode .photo{ width: 180px; height: 180px; margin: 0 auto;}
.qrCode .photo img{ width: 100%; height: auto;}

ul.num{ margin-bottom: 25px; padding-left: 20px;}
ul.num li{ margin-bottom: 10px; list-style-type: decimal;}


/*代理商*/
ul.company{ display: flex; flex-wrap: wrap;}
ul.company li{ width: 32%; line-height: 1.8em; margin-right: 2%; margin-bottom: 25px; box-sizing: border-box; border: 1px solid #dbdbdb; text-align: center; overflow: hidden; position: relative; padding-bottom: 130px; transition:all 0.3s; -moz-transition:all 0.3s; -webkit-transition:all 0.3s;}
ul.company li:nth-child(3n){ margin-right: 0;}

ul.company li a{ position: absolute; top: 0; bottom: 0; right: 0; left: 0; z-index: 10;}
ul.company li .top{ padding: 30px 30px 10px 30px}
ul.company li .logo_pic{ width: auto; height: 50px; margin-bottom: 5px;}
ul.company li .top .logo_pic img{ width: auto; height: 50px; margin: 0 auto;}
ul.company li .co_name{ color: #0099e0;}
ul.company li .bot{ width: 100%; height: 80px; position: absolute; left: 0; bottom: 0; background-color: #c5c5c5; display: flex; align-items:center; justify-content: center; flex-direction:column;}
ul.company li .bot .site{ min-width: 100px; height: 30px; padding: 0 15px; box-sizing: border-box; background-color: #000066; color: #fff; border-radius: 5px;}
ul.company li .bot p{ color: #fff;}
ul.company li .btn_link{ width: 30px; height: 30px; border:1px solid #ef6b24; border-radius: 99em; background: url("../images/toR_org.png") center center no-repeat;  background-size: 12px 12px; position: absolute; bottom: 90px; left: 50%; margin-left: -15px; transition:all 0.3s; -moz-transition:all 0.3s; -webkit-transition:all 0.3s;}
ul.company li:hover{ -moz-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);}
ul.company li:hover .btn_link{ background: #ef6b24 url("../images/toR_w.png") center center no-repeat; background-size: 12px 12px;}

/*聯絡我們*/
.map_area{ display: flex; height: auto; background-color: #f2f3f4;}
.map_area div:nth-child(1){ width: 35%;}
.map_area div:nth-child(2){ width: 65%;}
.map_area div:nth-child(1) img{ width: 100%; height: auto;}
.map_area div:nth-child(2) iframe{ width: 100%; height: 100%;}

.info_area{ padding: 30px 40px; background-color: #19195a; margin-bottom: 26px;}
ul.info_list{}
ul.info_list li{ margin-bottom: 10px; display: flex; color: #fff;}
ul.info_list li div:nth-child(1){ width: 85px; color: #fff2af;}
ul.info_list li div:nth-child(2){ width: calc( 100% - 85px);}
ul.info_list li a{ color: #fff;}
ul.info_list li a:hover{ text-decoration: underline;}

p.form{ padding: 10px 0;}

/*top_view*/
.top_view{ width: 100%; height: 250px; color: #fff; box-sizing: border-box; padding: 45px 300px 45px 60px; margin-bottom: 30px;}
.top_view.typ1{ background: url("../img/top_view01.jpg") no-repeat; background-size: cover;}
.top_view.typ2{ background: url("../img/top_view02.jpg") no-repeat; background-size: cover;}
.top_view.typ3{ background: url("../img/top_view03.jpg") no-repeat; background-size: cover;}
.top_view h4{ font-size: 25px; font-weight: 400; margin-bottom: 15px;}
.top_view p{ font-size: 18px; font-weight: 300; line-height: 1.5em;}

/*cae產品*/
.cae_product_box{ width: 620px; height: 450px; margin: 0 auto; background: url("../img/CAE_products_bg.jpg") no-repeat; position: relative;}
.cae_product_box .cae_p_01{ width: 195px; height: 195px; position: absolute; top:0; left:0;}
.cae_product_box .cae_p_02{ width: 195px; height: 195px; position: absolute; top:0; left:177px;}
.cae_product_box .cae_p_03{ width: 195px; height: 195px; position: absolute; top:0; right:71px;}
.cae_product_box .cae_p_04{ width: 195px; height: 195px; position: absolute; bottom:0; left:71px;}
.cae_product_box .cae_p_05{ width: 195px; height: 195px; position: absolute; bottom:0; right:178px;}
.cae_product_box .cae_p_06{ width: 195px; height: 195px; position: absolute; bottom:0; right:0px;}
.cae_product_box .cae_p_01 img, .cae_product_box .cae_p_02 img, .cae_product_box .cae_p_03 img, .cae_product_box .cae_p_04 img, .cae_product_box .cae_p_05 img, .cae_product_box .cae_p_06 img{ width: 100%; height: auto;}

/*---------------for 英文版---------------*/
/*header*/
.header_in.en{ padding: 0 20px 0 300px;}
.header_in.en h1{ background: url("../images/logo_en.jpg") no-repeat; background-size: contain;}
.header_in.en .menu ul.main li{ margin-left: 35px;}
.header_in.en .menu ul.main li:nth-child(1){ margin-left: 0;}

/*top_view*/
.top_view.en p{ font-size: 16px;}

/*cae產品*/
.cae_product_box.en{ background: url("../img/CAE_products_bg_e.jpg") no-repeat; }

/*footer*/
.footer_in .logo_f_en{ width: 204px; height: 20px; background: url("../images/logo_f_en.png") no-repeat; background-size: contain; margin-right: 10px;}


/*---------------for 小網---------------*/
@media screen and (max-width: 1099px){
	.header_in.en h1{ width: 270px; height: 32px;}
	.header.sticky .header_in.en{ padding: 0 20px 0 240px;}
	.header.sticky .header_in.en h1{ width: 220px; height: 26px;}
	.header_in.en .menu ul.main li{ font-size: 16px;}
}

@media screen and (max-width: 1024px){
	.pagesize { width: 100%;}
	.fullpage { min-width: inherit;}
	
	/*header*/
	.header{ min-width: inherit;}
	.header_in { padding: 0 20px 0 280px;}
	h1{ width: 250px; height: 29px; left: 20px; margin-top: -15px; }
	.menu ul.main { margin-right: 15px;}
	.menu ul.main li{ margin-left: 30px;}
	.header_in.en .menu ul.main li{ margin-left: 20px;}
	.header.sticky .header_in.en .menu ul.main li{ margin-left: 15px;}
	
	/*topBN*/
	.swiper-container-horizontal > .swiper-pagination-bullets { bottom: 15px;}
	
	/*stage*/
	.stage { width: 100%;}
	
	/*footer*/
	.footer_in{ width: 100%;}
	
	/*route*/
	.route { width: 100%;}
    
}
@media screen and (max-width: 800px){
	.pagesize{ padding:20px;}
	
    /*header*/
	.header{ -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2); box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);}
	
	.header_in.en{ padding: 0 20px 0 220px;}
	h1{ width: 250px; height: 29px; left: 20px; margin-top: -15px;}
	.header_in.en h1{ width: 200px; height: 23px; left: 20px; margin-top: -14px;}
	.menu ul.main { margin-right: 10px;}
	.menu ul.main li{ margin-left: 20px;}
	
	/*topNews*/
	ul.topNews li .date{ width: 48px; height: 48px; margin-right: 10px; border-radius: 8px;}
	ul.topNews li .date div:nth-child(1){ height: 30px; line-height: 30px;}
	ul.topNews li p{  width: calc(100% - 60px); padding: 12px 0;}
	
	/*stage*/
	.stage { padding: 25px 30px;}
	
	/*bot_menu*/
	ul.bot_menu{ padding: 15px 20px;}
    
    /*footer*/
	.footer_in { width: 100%; padding: 30px 20px; flex-wrap: wrap; justify-content: flex-start;}
    .footer_in .l_set{ width: 100%; margin-bottom: 15px;}
    .footer_in .r_set{ width: 100%; text-align: left; line-height: 1.6em;}
	
	/*代理商*/
	ul.company li .top{ padding: 20px 10px 10px 10px;}
    ul.company li .logo_pic{ height: 40px;}
    ul.company li .top .logo_pic img{ height: 40px; }
	
	/*top_view*/
	.top_view{ padding: 45px 60px 45px 60px;}
	.top_view.typ1{ background-position: center;}
	
	/*cae產品*/
	.cae_product_box { width: 500px; height: 363px; background-size: contain;}
	.cae_product_box.en{ background: url("../img/CAE_products_bg_e.jpg") no-repeat; background-size: contain;}
	.cae_product_box .cae_p_01{ width: 160px; height: 160px; position: absolute; top:0; left:0;}
    .cae_product_box .cae_p_02{ width: 160px; height: 160px; position: absolute; top:0; left:145px;}
    .cae_product_box .cae_p_03{ width: 160px; height: 160px; position: absolute; top:0; right:50px;}
    .cae_product_box .cae_p_04{ width: 160px; height: 160px; position: absolute; bottom:0; left:50px;}
    .cae_product_box .cae_p_05{ width: 160px; height: 160px; position: absolute; bottom:0; right:145px;}
    .cae_product_box .cae_p_06{ width: 160px; height: 160px; position: absolute; bottom:0; right:0px;}
    
}
@media screen and (max-width: 767px){
	.wrapper{ padding-top: 80px;}
	
    .m_hide{ display: none;}
    .m_block{ display: block;}
	
	/*header*/
	.m_header{ width: 100%; min-width: inherit; height: 80px; border-top:5px solid #000067; background-color: #f4f4f4; padding: 0 60px; box-sizing: border-box; position: fixed; z-index: 99; -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2); box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);}
	h1{ width: 240px; height: 28px; left: 50%; margin-top: -14px; margin-left: -120px; background: url("../images/logo.jpg") no-repeat; background-size: contain;}
	.m_header.m_block.en h1{ background: url("../images/logo_en.jpg") no-repeat; background-size: contain;}
	.btnNav{ width: 35px; height: 35px; background:url("../images/btn_nav.png") no-repeat; background-size: contain; border: 1px solid #868686; border-radius: 99em; position: absolute; top: 20px; left: 10px;}
	.btn_en{ width: 35px; height: 35px; background: url("../images/btn_en.png") center center no-repeat; background-size: contain; border: 1px solid #868686; border-radius: 99em; position: absolute; top: 20px; right: 10px;}
	.btn_ch{ width: 35px; height: 35px; background: url("../images/btn_ch.png") center center no-repeat; background-size: contain; border: 1px solid #868686; border-radius: 99em; position: absolute; top: 20px; right: 10px;}
	.btnNav a, .btn_en a, .btn_ch a{ width: 100%; height: 100%; display: block;}
	
	/*標題*/
    h2{ font-size: 25px; font-weight: 400; line-height: 1.0em; margin-bottom: 20px;}
	
	/*topBN*/
	.topBn_area{ padding-top: 80px; min-width: inherit;}
	.swiper-container-horizontal > .swiper-pagination-bullets{ bottom: 15px;}
    .swiper_topBN .swiper-pagination-bullet{ width: 8px; height: 8px;}
	.swiper_topBN.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 6px;}
	
	/*mmenu*/
	.mm-menu { --mm-color-text:rgba(255, 255, 255, 1);--mm-color-border:rgba(255, 255, 255, 0.1);}
	.mm-panel { padding: 0; background: #18182d;}
	.mm-panels > .mm-panel > .mm-listview { margin: 0; }
	.mm-listitem{ color:rgba(255,255,255,.75); color:var(--mm-color-text);border-color:rgba(255,255,255,.1);border-color:var(--mm-color-border);}
	.mm-listitem::after { left: 0; }
	.mm-listitem__text { padding: 0 10px; line-height: 50px; text-align: left; font-size: 18px; font-weight: 400; }
	
	/*stage*/
	.stage { width: 100%; padding: 25px 20px; flex-wrap:wrap;}
	.stage .box_txt, .stage .box_pic{ width: 100%;}
	.stage .box_txt .headline{ text-align: center; padding: 20px 0;}
	.stage .box_txt{ text-align: inherit;}
	.stage .box_txt p{ margin-bottom: 20px;}
	.stage .box_txt a.more, .fullpage.gray .stage .box_txt a.more{ float: none; margin: 0 auto;}
	.fullpage.gray .stage .box_txt{ order: 2;}
	.fullpage.gray .stage .box_pic{ order: 1;}
	
	/*cards*/
	ul.cards{ flex-wrap: wrap; padding: 0 0 20px 0;}
	ul.cards li{ width: 100%; margin-bottom: 20px; padding-bottom: 65px;}
	ul.cards li a.more{ bottom: 20px;}
	ul.cards li:nth-child(1) a.more:active{ border: 1px solid #ef6b25; color: #fff; background-color: #ef6b25; }
    ul.cards li:nth-child(2) a.more:active{ border: 1px solid #1ba6b7; color: #fff; background-color: #1ba6b7;}
    ul.cards li:nth-child(3) a.more:active{ border: 1px solid #26459b; color: #fff; background-color: #26459b;}
	
	/*bot_menu*/
    ul.bot_menu{ padding: 10px 20px; flex-wrap: wrap; justify-content: flex-start;}
	ul.bot_menu li{ width: 27%; padding: 0 1%; margin-bottom: 5px; text-align: left; box-sizing: border-box;}
	ul.bot_menu li:nth-child(2), ul.bot_menu li:nth-child(5){ width: 46%;}
	/*bot_menu en*/
	ul.bot_menu.en li{ width: 48%;}
	
	/*table*/
	table.news_list{ margin-bottom: 5px;}
	table.news_list td, table.news_list th{ padding: 10px;}
	table.news_list td.date{ width: 10%;}
	
	/*文章*/
	.txt_area .phase{ margin-bottom: 25px;}
	.txt_area .graph{ flex-direction: column; margin-bottom: 5px;}
    .txt_area .graph div{ width: 100%; margin: 5px 0;}
	.txt_area .graph p{ font-size: 14px; line-height: 1.5em;}
	
	ul.list_blue { margin-bottom: 15px;}
	ul.list_blue li{ padding-left: 25px; margin-bottom: 5px;}
	ul.list_blue li::before{ width: 6px; height: 6px; top: 14px; left: 2px;}
	
	ul.sort{ flex-direction: column;}
	ul.sort li{ width: 100%; margin: 0 0 8px 0;}
	
	.phto_list{ margin-bottom: 10px;}
	
	.qrCode{ padding-top: 10px;}
    .qrCode p{ line-height: 1.5em;}
    .qrCode .photo{ width: 150px; height: 150px;}
	
	/*代理商*/
    ul.company li{ width: 100%; margin-right: 0;}
	ul.company li .logo_pic{ height: 50px;}
    ul.company li .top .logo_pic img{ height: 50px; }
	
	/*聯絡我們*/
	.map_area{ flex-direction: column;}
    .map_area div:nth-child(1){ width: 100%; height: 200px; background: url("../img/location_photo.jpg") top -15px center no-repeat; background-size: cover;}
    .map_area div:nth-child(2){ width: 100%; height: 400px;}
	.map_area div:nth-child(1) img{ display: none;}
	
	.info_area{ padding: 15px 20px; background-color: #19195a; margin-bottom: 16px;}
	ul.info_list li{ margin-bottom: 5px; flex-direction: column;}
    ul.info_list li div:nth-child(1){ width: 100%;}
    ul.info_list li div:nth-child(2){ width: 100%;}
	
	p.form{ padding: 5px 0;}
	
	/*top_view*/
	.top_view{ padding: 20px; height: auto; margin-bottom: 20px;}
	.top_view h4{ font-size: 20px; margin-bottom: 10px;}
    .top_view p{ font-size: 16px;}
	
	/*cae產品*/
	.cae_product_box { width: 310px; height: 225px; background-size: contain;}
	.cae_product_box .cae_p_01{ width: 100px; height: 100px; position: absolute; top:0; left:0;}
    .cae_product_box .cae_p_02{ width: 100px; height: 100px; position: absolute; top:0; left:90px;}
    .cae_product_box .cae_p_03{ width: 100px; height: 100px; position: absolute; top:0; right:20px;}
    .cae_product_box .cae_p_04{ width: 100px; height: 100px; position: absolute; bottom:0; left:20px;}
    .cae_product_box .cae_p_05{ width: 100px; height: 100px; position: absolute; bottom:0; right:90px;}
    .cae_product_box .cae_p_06{ width: 100px; height: 100px; position: absolute; bottom:0; right:0;}
	
}
@media screen and (max-width: 320px){
	.pagesize { padding: 20px 10px;}
	
	/*header*/
	.m_header h1{ width: 210px; height: 25px; margin-top: -12px; margin-left: -105px;}
	h3{ margin-bottom: 15px;}
	
	/*bot_menu*/
	ul.bot_menu li{ font-size: 14px; padding: 0;}
	ul.bot_menu li{ width: 26%;}
	ul.bot_menu li:nth-child(2), ul.bot_menu li:nth-child(5){ width: 48%;}
	
	/*footer*/
	.footer_in .social_list{ flex-wrap: wrap; justify-content: center; margin-bottom: 15px;}
	.footer_in .logo_f{ width: 100%; background-position: center center;  background-size: 213px 20px; margin-right: 0; margin-bottom: 5px;}
	/*footer_en*/
	.footer_in .logo_f_en{ width: 100%; background-position: center center;  background-size: 204px 20px; margin-right: 0; margin-bottom: 5px;}
	
	/*文章*/
	.txt_area .phase{ margin-bottom: 15px;}
	
	ul.list_blue{ margin-bottom: 15px;}
    ul.list_blue li{ padding-left: 20px;}
	
	/*聯絡我們*/
	.map_area div:nth-child(1){ height: 200px;}
	
	/*top_view*/
	.top_view h4{ font-size: 18px;}
    .top_view p{ font-size: 14px;}
	
	/*cae產品*/
	.cae_product_box { width: 280px; height: 203px; background-size: contain;}
	.cae_product_box .cae_p_01{ width: 90px; height: 90px; position: absolute; top:0; left:0;}
    .cae_product_box .cae_p_02{ width: 90px; height: 90px; position: absolute; top:0; left:85px;}
    .cae_product_box .cae_p_03{ width: 90px; height: 90px; position: absolute; top:0; right:20px;}
    .cae_product_box .cae_p_04{ width: 90px; height: 90px; position: absolute; bottom:0; left:20px;}
    .cae_product_box .cae_p_05{ width: 90px; height: 90px; position: absolute; bottom:0; right:85px;}
    .cae_product_box .cae_p_06{ width: 90px; height: 90px; position: absolute; bottom:0; right:0;}
    
}