html, body {width: 100%; height: 100%; font-family: 'Noto Sans TC', 'Helvetica', 'Arial', 'sans-serif';}
a {color: #5cf7fa; -webkit-transition: all .35s; transition: all .35s;}
a:hover, a:focus {color: #9cf7ff;}
hr {max-width: 100px; margin: 25px auto 0; border-width: 1px; border-color: rgba(34, 34, 34, 0.1);}
hr.light {border-color: white;}
h1, h2, h3, h4, h5, h6 {font-family: 'Noto Sans TC', 'Helvetica', 'Arial', 'sans-serif'; font-weight: 200; letter-spacing: 1px; line-height: 140%;}
p {font-size: 18px; line-height: 1.5; margin-bottom: 20px;}
section {padding: 100px 0;}
section h2 {font-size: 50px;}
.modal-title {color:#0c75ac; }
.modaltxt {color:#6b7378; font-size:80%; }
.modal-footer {border-top: 0px;}

/* 所有的icon start*/
.icon01 {
 width: 42px;
 height: 38px;
 padding: 0rem 0rem;
 margin: -.5rem .8rem 0rem 0rem;
 cursor: pointer;}
.icon01 a  {cursor: pointer;}
.icon01 :hover {cursor: pointer;}
/* 所有的icon end*/

/* 版頭選單 mainNav start*/
#mainNav {
 background: #0298c3;
 -webkit-transition: all .35s;
 transition: all .35s;
 font-weight: 200;
 letter-spacing: 1px;}
#mainNav .navbar-brand {
  display:block;
  width:180px;
  height:72px;
  opacity:1;
  cursor: pointer;}
#mainNav .navbar-brand:hover, #mainNav .navbar-brand:focus {opacity:0.9;}
#mainNav .navbar-toggler {
  font-size: 20px;
  padding: 8px 10px;
  color: #ffffff;
  cursor: pointer;}
#mainNav .navbar-nav > li > a {
  font-size: 110%;
  font-weight: bolder;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-left: 5px;}
#mainNav .navbar-nav > li > a.active {
  color: #5cf7fa !important;
  background-color: transparent;}
#mainNav .navbar-nav > li > a.active:hover {background-color: transparent;}
#mainNav .navbar-nav > li > a, #mainNav .navbar-nav > li > a:focus {color: #fff;}
#mainNav .navbar-nav > li > a:hover, #mainNav .navbar-nav > li > a:focus:hover {color: #5cf7fa;}
/* 版頭選單 mainNav end */

/* index header */
header.masthead {
  background-image: url(../img/Header1920.jpg);
  background-repeat: no-repeat;
  height: 100vh;
  min-height: 375px;
  position: relative;
  -moz-background-size: 100%;        /*for Firefox*/
  -webkit-background-size: 100%;      /*for Google Chrome、Safari*/
  -o-background-size: 100%;       /*for Opera*/
  background-size: 100%;}         /*for IE*/
header.masthead .header-content {
  max-width: 500px;
  margin-bottom: 50px;
  margin-top: 100vh;
  text-align: center;}
 /* 焦點報導 start */
.Focusbk {
  background-image: url(../img/Focusreport1920.jpg);
  background-repeat: no-repeat;
  min-height: 375px;
  background-color: #2c6ea1;
  position: relative;
  -moz-background-size: 100%;        /*for Firefox*/
  -webkit-background-size: 100%;      /*for Google Chrome、Safari*/
  -o-background-size: 100%;       /*for Opera*/
  background-size: 100%;}       /*for IE*/
section.Focusreport {position: relative; padding: 150px 0;}
section.Focusreport .Focustxt {
 font-size: 240%;
 font-weight: 400;
 color: #fff;
 letter-spacing: 15px;
 margin-top: -20px;
 margin-bottom: 50px;}
section.Focusreport .carousel-control-prev {left: -10vw;}
section.Focusreport .carousel-control-next {right: -10vw;}
section.Focusreport .carousel-control-prev-icon {background-image: url(../img/arrow_left.svg);}
section.Focusreport .carousel-control-next-icon {background-image: url(../img/arrow_right.svg);}
section.Focusreport .carousel-control-prev-icon,
.carousel-control-next-icon {width: 100px; height: 100px;}
section.Focusreport .carousel-inner {
 border:rgba(133, 182, 211, 0.5) 18px solid;
 outline: 1px solid #badcfd;}
section.Focusreport .carousel-caption {
 right: 0;
 left: 0;
 bottom: 0;
 color: #161616;
 background-color:rgba(255, 255, 255, 0.9);
 padding: 2% 2% 0 2%;}
section.Focusreport h5 {
 text-align: justify;
 text-justify:inter-ideograph;
 line-height: 140%;
 font-size: 1.2rem;
}
section.Focusreport .carousel-indicators li {
  width: 18px;
  height: 18px;
  border-radius: 100%;
  cursor: pointer;
  margin-left: 5px;
  margin-right: 5px;}
section.Focusreport .carousel-indicators {bottom: -70px;}
.foucs-list {
 position:absolute;
 right:0;
 left: 0;
 z-index: 15;
 display:flex;
 justify-content: center;
 padding: 0;
 bottom: -140px;}
.datetxt{
  font-size: 115%;
  font-weight: 600;
  color: #0b609b;
  letter-spacing: 2px;
  margin-top: 0px;}
.carousel-more {
 text-align: center;
 font-size: 110%;
 background-color: #0f5792;
 color: #fff;
 border-radius: 30px 30px;
 padding: 2px 8px 4px 8px;
 margin-top: 0px;
 margin-bottom: 10px;}
.carousel-more a {
 text-align: center;
 font-size: 110%;
 background-color: #0f5792;
 color: #fff;
 border-radius: 30px 30px;
 padding: 2px 8px 4px 8px;
 text-decoration: none;
 margin-top: 0px;
 margin-bottom: 30px;}
.carousel-more a:hover {color: #5afffd;}
.list-more {
 text-align: center;
 font-size: 110%;
 background-color: #7ab5da;
 color: #fff;
 border-radius: 30px 30px;
 padding: 5px 12px 4px 12px;
 margin-top: 0px;
 margin-bottom: 10px;}
.list-more a {
 text-align: center;
 font-size: 110%;
 background-color: #7ab5da;
 color: #fff;
 border-radius: 30px 30px;
 padding: 5px 12px 4px 12px;
 text-decoration: none;
 margin-top: 0px;
 margin-bottom: 30px;}
.list-more a:hover {color: #0f5792;}
 /* 焦點報導 end */

 /* 全球報導 start */
.Newsbk {
 background-image: url(../img/Focusnews1920.jpg);
 background-repeat: no-repeat;
 min-height: 375px;
 background-color: #dce3e9;
 position: relative;
 -moz-background-size: 100%;        /*for Firefox*/
 -webkit-background-size: 100%;      /*for Google Chrome、Safari*/
 -o-background-size: 100%;       /*for Opera*/
 background-size: 100%;}       /*for IE*/
section.Focusnews .Focustxt {
 font-size: 240%;
 font-weight: bolder;
 color: #0b609b;
 letter-spacing: 15px;
 margin-top: -20px;
 margin-bottom: 50px;}
.newstitletxt {
  font-size: 180%;
  font-weight: bolder;
  color: #4a6cc3;
  letter-spacing: 2px;
  margin-top: -20px;
  margin-bottom: 20px;}
.newsconttxt {
  font-size: 120%;
  font-weight: normal;
  color: #4a4a4a;
  letter-spacing: 1px;
  margin-top: 0px;
  margin-bottom: 5px;}
.newsconttxt a {
  font-size: 120%;
  font-weight: normal;
  color: #4a4a4a;
  letter-spacing: 1px;
  text-decoration:none;
  margin-top: 0px;
  margin-bottom: 5px;}
.newsconttxt a:hover, a:active {color: #4a6cc3;}
.newsdatetxt{
  font-size: 115%;
  font-weight: 600;
  color: #0b609b;
  letter-spacing: 2px;
  margin-top: 0px;
  margin-bottom: 20px;}
.newstitletxt2 {
  font-size: 180%;
  font-weight: bolder;
  color: #874bbf;
  letter-spacing: 2px;
  margin-top: -20px;
  margin-bottom: 20px;}
.newsconttxt2 {
  font-size: 120%;
  font-weight: normal;
  color: #4a4a4a;
  letter-spacing: 1px;
  margin-top: 0px;
  margin-bottom: 5px;}
.newsconttxt2 a {
  font-size: 120%;
  font-weight: normal;
  color: #4a4a4a;
  letter-spacing: 1px;
  text-decoration:none;
  margin-top: 0px;
  margin-bottom: 5px;}
.newsconttxt2 a:hover, a:active {color: #874bbf;}
.pos01 {display: block;margin-right: 100px;}
.news-more {
  text-align: center;
  font-size: 110%;
  background-color: #3575c5;
  color: #fff;
  border-radius: 30px 30px;
  padding: 2px 8px 4px 8px;
  margin-top: 0px;
  margin-bottom: 30px;}
.news-more a {
  text-align: center;
  font-size: 110%;
  background-color: #3575c5;
  color: #fff;
  border-radius: 30px 30px;
  padding: 2px 8px 4px 8px;
  margin-top: 0px;
  margin-bottom: 30px;
  text-decoration: none;}
.news-more a:hover {color: #5afffd;}
.news-more2 {
  text-align: center;
  font-size: 110%;
  background-color: #645fd0;
  color: #fff;
  border-radius: 30px 30px;
  padding: 2px 8px 4px 8px;
  margin-top: 0px;
  margin-bottom: 30px;}
.news-more2 a {
  text-align: center;
  font-size: 110%;
  background-color: #645fd0;
  color: #fff;
  border-radius: 30px 30px;
  padding: 2px 8px 4px 8px;
  margin-top: 0px;
  margin-bottom: 30px;
  text-decoration: none;}
.news-more2 a:hover {color: #5afffd;}
 /* 全球報導 end */

 /* 全球科技發展趨勢資料 start */
.Globalbk {
 background-image: url(../img/Global1920.jpg);
 background-repeat: no-repeat;
 min-height: 375px;
 background-color: #aec3d2;
 position: relative;
 -moz-background-size: 100%;        /*for Firefox*/
 -webkit-background-size: 100%;      /*for Google Chrome、Safari*/
 -o-background-size: 100%;       /*for Opera*/
 background-size: 100%;}       /*for IE*/
section.Global .Focustxt {
 font-size: 240%;
 font-weight: bolder;
 color: #0b609b;
 letter-spacing: 2px;
 margin-top: -20px;
 margin-bottom: 50px;}
#global .globalname {
 font-size: 120%;
 font-weight:400;
 line-height: 140%;
 letter-spacing: 5px;
 color:#fff;
 background-color:#246fcc;
 cursor:pointer;
 text-decoration:none;
 border:3px #246fcc solid;
 border-radius: 30px;
 margin:0.8rem 2rem;
 padding:1rem 1rem;}
#global .globalname a {
 font-size: 120%;
 font-weight:400;
 line-height: 140%;
 color:#fff;
 background-color:#246fcc;
 cursor:pointer;
 text-decoration:none;
 border:3px #246fcc solid;
 border-radius: 30px;}
#global .globalname a:hover{
 font-size: 120%;
 font-weight:400;
 line-height: 140%;
 color:#bed5f1;
 background-color: transparent;
 cursor:pointer;
 text-decoration:none;}
 #global .globalname a:active{
  font-size: 120%;
  font-weight:400;
  line-height: 140%;
  color:#bed5f1;
  background-color: transparent;
  cursor:pointer;
  text-decoration:none;}
#global .card-body{
 padding: 1.25rem 1.25rem;
 color: #0b609b;
 background-color: #fff;
 border-radius: 8px 8px;
}
#global .globa-more {
  cursor: pointer;
  text-align:center;
  font-size: 100%;
  color: #0b609b;
  border-radius: 8px 8px;
  padding: 8px 8px;
  margin: 0px 10px 10px 10px;
 text-decoration: none;}
#global .globa-more a {
  cursor: pointer;
  text-align:center;
  font-size: 100%;
  color: #0b609b;
  border-radius: 8px 8px;
  padding: 8px 8px;
  margin: 0px 10px 10px 10px;
  text-decoration: none;}
#global .globa-more a:hover {
  cursor: pointer;
  text-align:center;
  font-size: 100%;
  color: #4d97cb;
  border-radius: 8px 8px;
  text-decoration: none;}
  #global .globa-more a:active {
    cursor: pointer;
    text-align:center;
    font-size: 100%;
    color: #4d97cb;
    border-radius: 8px 8px;
    text-decoration: none;}
/* 全球科技發展趨勢資料 end */

/* 研究分析 start */
.Researchbk {
 background-image: url(../img/Research1920.jpg);
 background-repeat: no-repeat;
 min-height: 375px;
 background-color: #042941;
 position: relative;
 -moz-background-size: 100%;        /*for Firefox*/
 -webkit-background-size: 100%;      /*for Google Chrome、Safari*/
 -o-background-size: 100%;       /*for Opera*/
 background-size: 100%;}       /*for IE*/
section.Research .Focustxt {
 font-size: 240%;
 font-weight: bolder;
 color: #fff;
 letter-spacing: 15px;
 margin-top: -20px;
 margin-bottom: 50px;}
 #research .researchname {
  font-size: 120%;
  font-weight:400;
  line-height: 140%;
  letter-spacing: 5px;
  color:#fff;
  background-color:#18bad7;
  cursor:pointer;
  text-decoration:none;
  border:3px #18bad7 solid;
  border-radius: 30px;
  margin:0.8rem 2rem;
  padding:1rem 1rem;}
 #research .researchname a {
  font-size: 120%;
  font-weight:400;
  line-height: 140%;
  color:#fff;
  background-color:#18bad7;
  cursor:pointer;
  text-decoration:none;
  border:3px #18bad7 solid;
  border-radius: 30px;}
 #research .researchname a:hover{
  font-size: 120%;
  font-weight:400;
  line-height: 140%;
  color:#bafdff;
  background-color: transparent;
  cursor:pointer;
  text-decoration:none;}
  #research .researchname a:active{
   font-size: 120%;
   font-weight:400;
   line-height: 140%;
   color:#bafdff;
   background-color: transparent;
   cursor:pointer;
   text-decoration:none;}
#research .card-body{
 padding: 1.25rem 1.25rem;
 color: #b9cfdf;
 background-color: #224054;
 border-radius: 8px 8px;}
#research .research-more {
 cursor: pointer;
 text-align:center;
 font-size: 100%;
 color: #18bad7;
 padding: 8px 8px;
 margin: 0px 10px 10px 10px;
 text-decoration: none;}
#research .research-more a {
 cursor: pointer;
 text-align:center;
 font-size: 100%;
 color: #18bad7;
 padding: 8px 8px;
 margin: 0px 10px 10px 10px;
 text-decoration: none;}
#research .research-more a:hover {
 cursor: pointer;
 text-align:center;
 font-size: 100%;
 color: #5cf7fa;
 text-decoration: none;}
 #research .research-more a:active {
  cursor: pointer;
  text-align:center;
  font-size: 100%;
  color: #5cf7fa;
  text-decoration: none;}
#research .card-title {
font-size: 120%;
color: #62cbce;}
 /* 研究分析 end */

 /* 國家概述 start */
#country .nav{flex-wrap:nowrap;}
.Countrybk {
 background-image: url(../img/Country1920.jpg);
 background-repeat: no-repeat;
 min-height: 375px;
 background-color: #dde0e2;
 position: relative;
 -moz-background-size: 100%;        /*for Firefox*/
 -webkit-background-size: 100%;      /*for Google Chrome、Safari*/
 -o-background-size: 100%;       /*for Opera*/
 background-size: 100%;}       /*for IE*/
section.Countryoverview .Focustxt {
 font-size: 240%;
 font-weight: bolder;
 color: #0b609b;
 letter-spacing: 15px;
 margin-top: -20px;
 margin-bottom: 50px;}
#country a {color: #bcd7dd;}
#country .nav-pills .nav-link{
 border-radius: 50px;
 margin: 1rem 2rem 1rem 1.5rem;
 padding: 1rem 3.5rem;
 cursor: pointer;
 letter-spacing: 2px;
 font-size: 200%;
 font-weight: 400;}
#country .txt1{background-color: #4aa7bc; border: 4px #4aa7bc solid;}
#country .txt1.active{border: 4px #4aa7bc solid;}
#country .txt2{background-color: #1d5781; border: 4px #1d5781 solid;}
#country .txt2.active{border: 4px #1d5781 solid;}
#country .txt3{background-color: #28a5a9; border: 4px #28a5a9 solid;}
#country .txt3.active{border: 4px #28a5a9 solid;}
#country .nav-pills .nav-link.active, .nav-pills .show > .nav-link{
 background-color: transparent;
 border-radius: 50px;
 color: #06728c;
 margin: 1rem 2rem 1rem 1.5rem;
 padding: 1rem 3.5rem;}
#country .countryname {
 font-size: 110%;
 font-weight:400;
 line-height: 140%;
 color:#195d6c;
 cursor:pointer;
 text-decoration:none;
 border:#4397aa;
 margin:1rem 2rem 1rem 2rem;
 border-width: thin;
 border-style:none none solid none;}
#country .countryname a {
 font-size: 110%;
 font-weight:400;
 line-height: 140%;
 color:#195d6c;
 cursor:pointer;
 text-decoration:none;}
#country .countryname a:hover{color: #2457ab;}
 /* 國家概述 end */

 /* 免責聲明 start*/
#disclaimer {background-color: #ededed;}
#disclaimer h3 {
 font-size: 140%;
 color: #105691;
 font-weight: 400;}
.disctext {
 font-size: 120%;
 color: #4a4a4a;
 font-weight: normal;
 line-height: 200%;
 text-align:justify;}
.disctext2 {
 font-size: 100%;
 color: #4a4a4a;
 font-weight: normal;
 line-height: 180%;
 text-align:justify;}
 /* 免責聲明 end*/

 /* footer start*/
footer {
  padding: 25px 0;
  color: rgba(201, 209, 220, 1);
  background-color: #0f5792;}
.footerback{
 background: url("../img/footer-img.jpg");
 background-repeat: repeat-x;
 background-color: #0f5792;
 -moz-background-size:100%;
 -webkit-background-size:100%;
 -o-background-size:100%;
 background-size:100%;}
.footer-logo01 {
 display: block;
 max-width: 304px;
 max-height: 75px;
 margin-top: 1rem;
 z-index: 3;}
.footer-logo02 {
 display: block;
 max-width: 378px;
 max-height: 49px;
 margin-top: 1rem;
 margin-bottom: 1.78rem;
 z-index: 3;}
.footer-txt01{
 font-size: 110%;
 font-family: 'Noto Sans TC', 'Helvetica', 'Arial', 'sans-serif';
 font-weight: normal;
 color: #d0dae6;
 line-height: 140%;
 z-index: 3;}
.footer-txt02{
 font-size: 130%;
 font-family: 'Noto Sans TC', 'Helvetica', 'Arial', 'sans-serif';
 font-weight: normal;
 color: #d0dae6;
 line-height: 140%;
 z-index: 3;}
.bg-primary {
  background: #5cf7fa;
  background: -webkit-gradient(linear, left top, left bottom, from(#5cf7fa), to(#8dffff));
  background: linear-gradient(#5cf7fa, #8dffff);}
.text-primary {color: #5cf7fa;}
.no-gutter > [class*='col-'] {
  padding-right: 0;
  padding-left: 0;}
/* footer end*/

/* 回到首頁 go top button start*/
#button {
  display: inline-block;
  background-color: #645fd0;
  width: 50px;
  height: 50px;
  text-align: center;
  border-radius: 6px;
  border: 1px #fff solid;
  position: fixed;
  bottom: 6px;
  right: 6px;
  transition: background-color .3s, opacity .5s, visibility .5s;
  opacity: 0;
  visibility: hidden;
  z-index: 1000;}
#button::after {
  content: "\f077";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  font-size: 1.5em;
  line-height: 45px;
  color: #fff;}
#button:hover {
  cursor: pointer;
  background-color: #333;}
#button:active {background-color: #555;}
#button.show {
  opacity: 1;
  visibility: visible;}
/* 回到首頁 go top button end*/



/* RWD 語法自定義 start */
/* 992px以上（包含）的都適用  */
@media (min-width: 992px) {
#mainNav {border-color: transparent; background-color: transparent;}
#mainNav .navbar-nav > li > a, #mainNav .navbar-nav > li > a:focus {color: rgba(255, 255, 255, 0.9);}
#mainNav .navbar-nav > li > a:hover, #mainNav .navbar-nav > li > a:focus:hover {color: #5cf7fa;}
#mainNav.navbar-shrink {border-color: rgba(34, 34, 34, 0.1); background: url("../img/Header_top.jpg"), #0298c3;}
#mainNav.navbar-shrink .navbar-brand:hover, #mainNav.navbar-shrink .navbar-brand:focus {opacity:0.9;}
#mainNav.navbar-shrink .navbar-nav > li > a, #mainNav.navbar-shrink .navbar-nav > li > a:focus {color: #fff;}
#mainNav.navbar-shrink .navbar-nav > li > a:hover, #mainNav.navbar-shrink .navbar-nav > li > a:focus:hover {color: #5cf7fa;}
header.masthead {
 min-height: 775px;
 padding-top: 0;
 padding-bottom: 0;}
header.masthead .header-content {
 margin-bottom: 0;
 margin-top: 92vh;
 text-align: center;}
}

/* 介於 769px 與 280px 之間的尺寸 pad~phone */
@media screen and (min-width: 280px) and (max-width: 769px) {
header.masthead .header-content {
 margin-bottom: 0;
 margin-top: 78vh;
 text-align: center;}
}

/* 介於 1366px 與 2560px 之間的尺寸 pc */
@media screen and (min-width: 1680px) and (max-width: 2560px) {
.container {max-width: 1200px;}
#disclaimer .container {max-width: 860px;}
#Footer .container {
  max-width: 72vw;
  height: 478px;}
}

@media screen and (min-width: 1367px) and (max-width: 1679px) {
#Footer .container {
  max-width: 80vw;
  height: 478px;}
.container {max-width: 1200px;}
#disclaimer .container {max-width: 860px;}
#mainNav .navbar-brand {min-height:12vh;}
header.masthead {
 background-image: url(../img/Header1620.jpg);
 background-repeat: no-repeat;
 height: 100vh;
 min-height: 375px;
 position: relative;
 -moz-background-size: cover;        /*for Firefox*/
 -webkit-background-size: cover;        /*for Google Chrome、Safari*/
 -o-background-size: cover;        /*for Opera*/
 background-size: cover;}         /*for IE*/
}

/* 介於 1439px 與 1025px 之間的尺寸 筆電 */
@media screen and (min-width: 1025px) and (max-width: 1439px) {
.container {max-width: 1200px;}
#disclaimer .container {max-width: 880px;}
#Footer .container {max-width: 85vw; height: 478px;}
.footer-txt01{font-size: 100%; line-height: 130%;}
.footer-txt02{font-size: 120%; line-height: 140%;}
}

@media screen and (min-width: 1025px) and (max-width: 1366px) {
#mainNav .navbar-brand {min-height:8vh;}
header.masthead {background-image: url(../img/Header1366.jpg);}
.Focusbk {background-image: url(../img/Focusreport1366.jpg);}
.Globalbk {background-image: url(../img/Global1366.jpg);}
.Researchicon {max-width: 70%;}
#mainNav .navbar-nav > li > a {font-size: 110%; margin-left : 0px;}
.pos01 {display: block;margin-right: 0px;}
}


/* 介於 1024px 與 993px 之間的尺寸 小筆電 pad-pro */
@media screen and (min-width: 992px) and (max-width: 1024px) {
.container {max-width: 1024px;}
#disclaimer .container {max-width: 767px;}
#Footer .container {max-width: 66vw; height: auto;}
#mainNav .navbar-brand {
  display:block;
  width:150px;
  height:60px;
  min-width:16vh;
  cursor: pointer;}
#mainNav .navbar-shrink {
  display:block;
  width:150px;
  height:60px;
  min-width:20vh;
  cursor: pointer;}
#mainNav .navbar-brand {min-height:10vh;}
header.masthead {background-image: url(../img/Header1024.jpg);}
.Focusbk {background-image: url(../img/Focusreport1024_02.jpg);}
.Globalbk {background-image: url(../img/Global1366.jpg);}
.Researchicon {max-width: 90%;}
h3 {font-size: 140%;}
h5 {font-size: 100%;}
.carousel-more {
 text-align: center;
 font-size: 100%;
 background-color: #0f5792;
 color: #fff;
 border-radius: 30px 30px;
 padding: 2px 6px 6px 6px;
 margin-top: 0px;
margin-bottom: 30px;}
.carousel-more a {
 text-align: center;
 font-size: 100%;
 background-color: #0f5792;
 color: #fff;
 border-radius: 30px 30px;
 padding: 2px 6px 6px 6px;
 text-decoration: none;
 margin-top: 0px;
 margin-bottom: 30px;}
.carousel-more a:hover {color: #5afffd;}
#mainNav .navbar-nav > li > a {font-size: 100%; margin-left : 10px; line-height : 9vh;}
.pos01 {display: block;margin-right: 0px;}
#country .countryname {font-size: 130%; line-height: 160%;}
#country .countryname a {font-size: 130%;line-height: 160%;}
}

/* 介於 992px 與 320px 之間的尺寸 phone */
@media screen and (min-width: 319px) and (max-width: 992px) {
.container {max-width: 100vw;}
#disclaimer .container {max-width: 100vw;}
#Footer .container {max-width: 92vw; height: auto;}
.footer-logo01 {
 display: block;
 max-width: 275px;
 max-height: 68px;
 margin-top: 1rem;}
.footer-logo02 {
 display: block;
 max-width: 275px;
 max-height: 36px;
 margin-top: 1rem;
 margin-bottom: 1.78rem;}
header.masthead {background-image: url(../img/Header1024_01.jpg);}
.pos01 {display: block;margin-right: 0px;}
}

/* footer-background 介於 1024px 與 769px 之間的尺寸 pad */
@media screen and (min-width: 769px) and (max-width: 1024px) {
.footerback{background: url("../img/footer-img_md.jpg"); background-repeat: repeat-x; background-color: #0f5792;}
header.masthead .header-content {margin-bottom: 0; margin-top: 80vh; text-align: center;}
#country .nav-pills .nav-link{margin: 1rem 0.5rem; font-size: 150%; padding: 1.2rem 2.5rem;}
#country .nav-pills .nav-link.active, .nav-pills .show > .nav-link{margin: 1rem 0.5rem; font-size: 150%; padding: 1.2rem 2.5rem;}
}
 /* footer-background 介於 768.98px 與 567px 之間的尺寸 phone */
 @media screen and (min-width: 569px) and (max-width: 768.98px) {
.footerback{background: url("../img/footer-img_sm.jpg"); background-repeat: repeat-x; background-color: #0f5792;}
.Globalbk {background-image: url(../img/Global768.jpg);}
header.masthead {
 background-image: url(../img/Header768_01.jpg);
 -moz-background-size:100%;
 -webkit-background-size:100%;
 -o-background-size:100%;
 background-size:100%;}
#mainNav .navbar-nav > li > a {
 font-size: 120%;
 font-weight: bolder;
 letter-spacing: 2px;
 text-transform: uppercase;
 margin-left: 25px;}
#country .nav-pills .nav-link{
 margin: 1rem 0.5rem 1rem 0.5rem;
 padding: 1rem 2rem;
 letter-spacing: 1px;
 font-size: 150%;}
#country .txt1{border: 3px #8ab6c1 solid;}
#country .txt1.active{border: 3px #8ab6c1 solid;}
#country .txt2{background-color: #1e5782; border: 3px #1e5782 solid;}
#country .txt2.active{border: 3px #1e5782 solid;}
#country .txt3{background-color: #28a5a9; border: 3px #28a5a9 solid;}
#country .txt3.active{border: 3px #28a5a9 solid;}
#country .nav-pills .nav-link.active, .nav-pills .show > .nav-link{margin: 1rem 0.5rem 1rem 0.5rem; padding: 1rem 2rem;}
}
/* footer-background 介於 568.98px 與 280px 之間的尺寸 small-phone */
@media screen and (min-width: 280px) and (max-width: 568.98px) {
.footerback{ background: url("../img/footer-img_xs.jpg"); background-repeat: repeat-x; background-color: #0f5792;}
header.masthead {background-image: url(../img/Header720.jpg);}
.Globalbk {background-image: url(../img/Global720.jpg); background-color: #aec3d2;}
section.Global .Focustxt {font-size: 220%;}
#mainNav .navbar-nav > li > a {
 font-size: 100%;
 font-weight: bolder;
 letter-spacing: 2px;
 text-transform: uppercase;
 margin-left: 25px;}
.icon01 {width: 32px; height: 28px; padding: 0rem 0rem; margin: -.2rem 1.2rem 0rem 0rem; cursor: pointer;}
.pos01 {display: block;margin-right: 0px;}
#country .container-fluid {padding-right: 0px; padding-left: 0px;}
#country .txt1{background-color: #8ab6c1; border: 2px #8ab6c1 solid;}
#country .txt1.active{border: 2px #8ab6c1 solid;}
#country .txt2{background-color: #1e5782; border: 2px #1e5782 solid;}
#country .txt2.active{border: 2px #1e5782 solid;}
#country .txt3{background-color: #28a5a9; border: 2px #28a5a9 solid;}
#country .txt3.active{border: 2px #28a5a9 solid;}
#country .nav-pills .nav-link.active, .nav-pills .show > .nav-link{margin:1rem 0.5rem; font-size:120%; padding:1rem 1.2rem;}
#country .nav-pills .nav-link{margin:1rem 0.5rem; font-size:120%; padding:1rem 1.2rem;}
}

/* 校正 phone橫式 header start */
@media screen and (min-width: 439px) and (max-width: 480px) {
header.masthead .header-content {
  margin-bottom: 0;
  margin-top: 65vh;
  text-align: center;}
header.masthead {background-image: url(../img/Header480.jpg);}
 }
@media screen and (min-width: 567px) and (max-width: 568px) {
header.masthead .header-content {
  margin-bottom: 0;
  margin-top: 65vh;
  text-align: center;}
 header.masthead {background-image: url(../img/Header568.jpg);}
}
@media screen and (min-width: 639px) and (max-width: 640px) {
header.masthead .header-content {
 margin-bottom: 0;
 margin-top: 75vh;
 text-align: center;}
header.masthead {background-image: url(../img/Header667.jpg);}
}
@media screen and (min-width: 666px) and (max-width: 667px) {
header.masthead .header-content {
  margin-bottom: 0;
  margin-top: 80vh;
  text-align: center;}
header.masthead {background-image: url(../img/Header667.jpg);}
}
@media screen and (min-width: 730px) and (max-width: 731px) {
header.masthead .header-content {
  margin-bottom: 0;
  margin-top: 80vh;
  text-align: center;}
header.masthead {background-image: url(../img/Header667.jpg);}
}
@media screen and (min-width: 735px) and (max-width: 736px) {
 header.masthead .header-content {
  margin-bottom: 0;
  margin-top: 80vh;
  text-align: center;}
 header.masthead {background-image: url(../img/Header667.jpg);}
}
@media screen and (min-width: 1023px) and (max-width: 1024px) {
 header.masthead .header-content {
  margin-bottom: 0;
  margin-top: 80vh;
  text-align: center;}
 header.masthead {background-image: url(../img/Header1024_02.jpg);}
}
/* 校正 phone橫式 header end */

/* 選單動態 start */
.animated-icon1, .animated-icon2, .animated-icon3 {
width: 30px;
height: 20px;
position: relative;
margin: 0px;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
-o-transition: .5s ease-in-out;
transition: .5s ease-in-out;
cursor: pointer;}
.animated-icon1 span, .animated-icon2 span, .animated-icon3 span {
display: block;
position: absolute;
height: 3px;
width: 100%;
border-radius: 9px;
opacity: 1;
left: 0;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .25s ease-in-out;
-moz-transition: .25s ease-in-out;
-o-transition: .25s ease-in-out;
transition: .25s ease-in-out;}
.animated-icon1 span {background: #e65100;}
.animated-icon2 span {background: #e3f2fd;}
.animated-icon3 span {background: #f3e5f5;}
.animated-icon1 span:nth-child(1) {top: 0px;}
.animated-icon1 span:nth-child(2) {top: 10px;}
.animated-icon1 span:nth-child(3) {top: 20px;}
.animated-icon1.open span:nth-child(1) {
top: 11px;
-webkit-transform: rotate(135deg);
-moz-transform: rotate(135deg);
-o-transform: rotate(135deg);
transform: rotate(135deg);}
.animated-icon1.open span:nth-child(2) {
opacity: 0;
left: -60px;}
.animated-icon1.open span:nth-child(3) {
top: 11px;
-webkit-transform: rotate(-135deg);
-moz-transform: rotate(-135deg);
-o-transform: rotate(-135deg);
transform: rotate(-135deg);}
/* Icon 3*/
.animated-icon2 span:nth-child(1) {top: 0px;}
.animated-icon2 span:nth-child(2), .animated-icon2 span:nth-child(3) {top: 10px;}
.animated-icon2 span:nth-child(4) {top: 20px;}
.animated-icon2.open span:nth-child(1) {
top: 11px;
width: 0%;
left: 50%;}
.animated-icon2.open span:nth-child(2) {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);}
.animated-icon2.open span:nth-child(3) {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);}
.animated-icon2.open span:nth-child(4) {
top: 11px;
width: 0%;
left: 50%;}
/* Icon 4 */
.animated-icon3 span:nth-child(1) {
top: 0px;
-webkit-transform-origin: left center;
-moz-transform-origin: left center;
-o-transform-origin: left center;
transform-origin: left center;}
.animated-icon3 span:nth-child(2) {
top: 10px;
-webkit-transform-origin: left center;
-moz-transform-origin: left center;
-o-transform-origin: left center;
transform-origin: left center;}
.animated-icon3 span:nth-child(3) {
top: 20px;
-webkit-transform-origin: left center;
-moz-transform-origin: left center;
-o-transform-origin: left center;
transform-origin: left center;
}
.animated-icon3.open span:nth-child(1) {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
top: 0px;
left: 8px;}
.animated-icon3.open span:nth-child(2) {
width: 0%;
opacity: 0;}
.animated-icon3.open span:nth-child(3) {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
top: 21px;
left: 8px;}
.navbar-toggler {border: 0px solid transparent;}
#mainNav button{outline:none;}
i {
  border: solid white;
  border-width: 0 6px 6px 0;
  display: inline-block;
  padding: 12px;}
.down {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);}
/* 選單動態 end */

/* Breakpoint XS */
@media (max-width: 575px) {
.hidden-xs-down, .hidden-sm-down, .hidden-md-down, .hidden-lg-down, .hidden-xl-down,
.hidden-xs-up, .hidden-unless-sm, .hidden-unless-md, .hidden-unless-lg, .hidden-unless-xl {
  display: none !important;}
section.Focusreport .carousel-control-prev-icon, .carousel-control-next-icon {
  display: none !important;}
section.Focusreport .carousel-control-prev {
  display: none !important;}
h3 {font-size: 140%;}
section.Focusreport .carousel-inner {
 border:rgba(133, 182, 211, 0.5) 5px solid;
 outline: 1px solid #badcfd;}
.xs-all {
 position : relative;
 width:100%;
 padding-right: 0px;
 padding-left: 0px;}
}

/* Breakpoint SM */
@media (min-width: 576px) and (max-width: 767px){
.hidden-sm-down, .hidden-md-down, .hidden-lg-down, .hidden-xl-down, .hidden-xs-up, .hidden-sm-up, .hidden-unless-xs, .hidden-unless-md, .hidden-unless-lg, .hidden-unless-xl {
  display: none !important;}
section.Focusreport .carousel-control-prev-icon, .carousel-control-next-icon {
  display: none !important;}
section.Focusreport .carousel-control-prev {
  display: none !important;}
}

/* Breakpoint MD */
@media (min-width: 768px) and (max-width: 991px){
 .hidden-md-down, .hidden-lg-down, .hidden-xl-down, .hidden-xs-up, .hidden-sm-up, .hidden-md-up, .hidden-unless-xs, .hidden-unless-sm, .hidden-unless-lg, .hidden-unless-xl {
  display: none !important;}
}

/* Breakpoint LG */
@media (min-width: 992px) and (max-width: 1199px){
 .hidden-lg-down, .hidden-xl-down, .hidden-xs-up, .hidden-sm-up, .hidden-md-up, .hidden-lg-up, .hidden-unless-xs, .hidden-unless-sm, .hidden-unless-md, .hidden-unless-xl{
  display: none !important;}
}

/* Breakpoint XL */
@media (min-width: 1200px){
 .hidden-xl-down, .hidden-xs-up, .hidden-sm-up, .hidden-md-up, .hidden-lg-up, .hidden-xl-up, .hidden-unless-xs, .hidden-unless-sm, .hidden-unless-md, .hidden-unless-lg{
  display: none !important;}
}
