@charset "UTF-8";
@import url(//fonts.googleapis.com/earlyaccess/notosanstc.css);
html, body{overflow:hidden; height:100vh;}
body{overflow-x:hidden; overflow-y:auto;}
*, body, div, p, input, button, a, strong, td, li, i, h1, h2, h3, h4, h5, strong, button, span, .btn{font-size:16px; line-height:25px; color:#575757; font-weight:normal; font-family:'Noto Sans TC', 'FontAwesome', '微軟正黑體', sans-serif; text-decoration:none; text-shadow:none; margin:0; padding:0;}
.main{width:94%; max-width: 946px; margin:0 auto; position:relative;}
.main div, .main p{text-align:justify;}
.hideit{display:none;}
.clear{clear:both;}
h5{font-weight:bold;}
p{margin:30px 0;}
hr{border:1px #9f9f9f solid; border-top:none; border-left:none; border-right:none; margin:20px 0;}
hr.line{border:1px #6cc5f1 solid; border-top:none; border-left:none; border-right:none; margin-top:40px; margin-bottom:20px; display:block;}
header{background: #0e6eb8; padding: 10px 0;}
header .tool{font-size: 12px; color: #fff; text-align: right;}
header .tool a{font-size: 12px; color: #fff;}
header .info{float: right; text-align: right; clear: both; font-size: 30px; color: #fff; margin-top: 5px;}
header .info h1{color: #fff65f; font-size: 43px; font-weight: bold; line-height: 43px; margin: 0 0 5px 0; padding: 0;}
header .info .text{color:#fff; top:-10px; position:relative;}
header .info .button img{height:25px;}
header .test{width:100%; position:absolute; z-index:2; top:90px; left:0;}
#logo{display: inline-block; margin-bottom:5px;}
#logo img{width:90%; max-width:507px;}
nav{background: #0e6eb8; text-align: center; clear: both; padding: 5px 0;}
nav a{color: #fffec7; margin: 0 10px; padding: 0 8px; font-size: 19px; position: relative;}
nav a:after{content: ''; border-right: 1px #fffec7 solid; position:absolute; right: -10px; top: 8px; height: 21px}
nav a img{position: relative; top: 3px;}
nav a:hover, nav a.current{background: #55b9ea; color: #fff65f; border-radius: 9px;}
nav a:nth-last-child(1):after{border:none;}
main img{max-width:100%;}
#indexBanner{position:relative; width:100%;}
#iwant{text-align:center;}
#indexBanner #iwant{position:absolute; z-index:2; text-align:right; right:4%; bottom:5%; width:30%;}
#indexBanner #iwant img{width:30%;}
.col3{width: 100%; margin:30px auto; padding:0;}
.col3 li{position:relative; list-style:none; width:31%; max-width:280px; padding-bottom:20px; display:inline-block; vertical-align:top; font-size:16px;}
.col3 li:nth-child(3n+2){margin:0 calc(6% - 9px);}
.col3 li .img{margin:0 auto 10px auto; display:block;}
.col3 .title, .title{color:#0e6eb8;  font-size:16px;}
ul.col3.report li, .col3.report h5{color:#0e6eb8;}
ul.col3.report li .img{margin-bottom:30px;}
.pageTitle{color:#0e6eb8;  font-size:20px;}
.col3.center li{text-align:center;}
.col3.company1{text-align:center;}
.col3.company1 li{text-align:left;}
.titleBlue{width:100%; max-width:275px; text-align:center; margin:0 auto 20px auto; display:block; border:1px #6cc5f1 solid; border-left:none; border-right:none; text-align:center;}
.titleBlue strong{width:calc(100% - 62px); font-size:18px; line-height:40px; background:#6cc5f1; color:#fff; display:inline-block;  text-align:center; width:80%; margin-left:10%;}
.titleBlue.inline{width:382px;}
.titleBlue.inline strong{width:320px;}
.titleBlue strong.small{font-size:14px; line-height:22px;}
.titleBlue.line{width:100%;}
.titleBlue.line strong{width:calc(100% - 62px); margin:0 31px;}
.titleBlue.nobreak{max-width:380px;}
.page_title{text-align:center; margin:30px 0;}
.page_title span{background: #55b9ea; color:#fff65f; border-radius: 6px; font-size:30px; line-height:35px; padding:8px 10px; display:inline-block;}
.imgBox{text-align:center;}
.imgBox div{display:inline-block; text-align:left;}
.imgBox.news div{max-width:700px; display:block; margin:0 auto; text-align:justify;}
.imgBox.news div img{width:100%; height:auto;}
.imgBox.news11 div{max-width:446px;}
.imgBox.news12 div{max-width:454px;}
.img2 div{width:49%; display:inline-block; float:left;}
.img2 div img{width:100%; height:auto;}
.img2 div:nth-child(2){float:right;}
.img2:after{content:''; display:block; clear:both; margin-bottom:20px;}
.img2.report div:nth-child(1){width:29%;}
.img2.report div:nth-child(2){width:calc(71% - 20px);}
.img2.report div img{width:100%; height:auto;}
.img2.news2{width:88%; margin:50px auto;}
.img2.news2 div:nth-child(1){width:320px;}
.img2.news2 div:nth-child(2){width:480px;}
.left{width:100%; max-width:560px; float:left; text-align:justify;}
.rightImg{width:96%; max-width:300px; float:right; text-align:center;}
.rightImg div{margin-bottom:50px; color:#0e6eb8;}
#indexCompanys{text-align:center; margin-bottom:50px;}
#indexCompanys a{margin:0 9% 20px 0; display:inline-block; color:#0e6eb8; width:253px; vertical-align:top;}
#indexCompanys a img{max-width:100%; height:auto;}
#indexCompanys a:nth-child(3), #indexCompanys img:nth-child(5), #indexCompanys a:nth-child(6){margin-right:0;}
#indexCompanys a:nth-child(4){margin:0 15% 20px 5%;}
img.fr{float:right; margin:0 0 20px 20px;}
.companyInfo{float:left; color:#0e6eb8; width:100%; max-width:280px; margin-bottom:10px;}
.companyIntroduction{float:right; width:100%; max-width:600px;}
.dot{width:5px; height:5px; margin-right:8px; display:inline-block; border-radius:2.5px; background:#0E6EB8; top:-3px; position:relative;}
.blue{color:#0E6EB8;}
.dir a:nth-child(2){float:right;}
#news01Img{margin:20px 0;}
#news01Img img{margin-right:20px;}
#news01Img img:nth-child(1){float:left; margin-top:-10px;}
.col5{margin-bottom:50px;}
.col5 a{width:calc(20% - 15px); display:inline-block; margin-right:15px; text-align:center; color:#0e6eb8; margin-bottom:15px; vertical-align:top;}
.col5 a img{width:100%;}
.col5 a:nth-last-child(1){margin-right:0;}
footer{background: #bee8ff; padding: 20px 0;}
footer .main{color: #15424b; text-align: center;}
footer .brands{margin-bottom: 10px; text-align:center;}
footer .brands a{margin:0 10px 10px 0; display:inline-block;}
footer .brands a:nth-child(2){width:210px; text-align:left;}
footer .brands a:nth-child(5){margin-left:335px;}
@media screen and (max-width:600px){
  #logo{display: block; text-align:center; margin-top:10px;}
  header .tool{margin-right:5%;}
  header .info{float: none; text-align: right; clear: both; font-size: 14px; margin-right: 5%;}
  header .info h1{font-size: 30px; font-weight: bold; line-height: 30px; margin: 0 0 10px 0; padding: 0;}
  nav a{font-size: 14px; display:inline-block; margin:0 5px 5px 0;}
  nav a:after{display:none;}
  nav a img{height:14px;}
  .col3{width:90%; margin:20px auto; display:block;}
  .col3 li{width:100%; max-width:none; maring:0 auto 50px auto; float:none; display:block;}
  .col3 li:nth-child(3n+2){margin:0 auto 50px auto;}
	.img2 div{width:100%; float:none; margin-bottom:20px;}
	.img2 div:nth-child(2){float:none;}
  .img2.report div:nth-child(1){width:100%; margin-bottom:20px;}
  .img2.report div:nth-child(2){width:100%;}
	.img2.news2, .img2.news2 div:nth-child(1), .img2.news2 div:nth-child(2){width:100%;}
  .titleBlue{margin:0 auto 20px auto;}
  .page_title span{font-size:18px;}
	#indexCompanys a, #indexCompanys a:nth-child(4){margin-right:0;}
  #indexCompanys img{margin-right:0;}
  .left{float:none; max-width:none; margin:0 auto 30px auto;}
  .rightImg{float:none; max-width:none;}
  img.fr{float:none; display:block; width:80%; margin:0 auto 15px auto;}
  #news01Img{text-align:center;}
  #news01Img img{margin-right:0px;}
  #news01Img img:nth-child(1){float:none;}
  .col5 a{width:calc(50% - 15px);}
  .col5 a:nth-child(even){margin-right:0;}
  footer .brands a:after{display:none;}
  footer .brands a{float:left; width:40%; display:inline-block; text-align:left; margin-bottom:10px;}
  footer .brands a img{max-width:40vw;}
  footer .brands a:nth-child(even){margin-left:20px;}
  footer .brands img{width:calc(50% - 10px); margin:0 10px 10px 0;}
  footer .brands img:nth-child(2n){margin-right:0;}
}