@charset "utf-8";
body,.en{font-family:'Roboto','微軟正黑體',sans-serif;}
.navbar{
    padding: 0 1rem .5rem;
}
.navbar-brand{
    font-size: 16px;
    display: -webkit-flex;
    display: flex;
    display: -ms-flexbox;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.navbar-brand span{margin-left:5px}
.navbar-expand-lg .navbar-nav .nav-link{
    font-size: 15.5px;
}
.font-style,.deve-page article .font-style{line-height: 1.5;letter-spacing: .5px;font-size: 16px;}
.seo-text {font-size: 17px;}
.about-p2 article, .about-p3-1 article,.about-p2-2 article,.deve-page article{text-align: left;}
.circle {
    width: 180px;
    border-radius: 10px;
}

.about-p3-title:before, .about-p3-title:after {
    width: 23%;
}
.pdf-item h2 {
    font-size: 16px;
    letter-spacing: .5px;
}
.only-pic-item p {
    padding: 5px;
    /* min-height: 55px; */
    font-size: 16px;
}
.only-pic-item p.en{font-size:16px;}
.test-service article p.font-style{
    padding-left: 20px;
}
header.change .lan-box{
    /* margin-top: -25px; */
}

.navbar-expand-xl .navbar-nav .nav-link{color: #fff;padding: 1rem .7rem;font-size: 17px;text-shadow: 0 0 4px #2f2f2f;position:relative;}
.navbar-expand-xl .navbar-nav .nav-link:before{position:absolute;content:'';width: 0;height: 2px;background-color: #fe0000;left: 0;bottom:0; -o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}
.navbar-expand-xl .navbar-nav .nav-link:hover:before{width:100%;right:0;left:auto;}
.navbar-expand-xl .navbar-nav .nav-item.active .nav-link:before{width: 100%;}
.navbar-expand-xl .dropdown-menu {
    width: 100%;
    border-radius: 0;
    background-color: rgba(255, 255, 255, 0.9);
    text-align: center;
    padding: 0;
    margin-top: 0;
}
.navbar-expand-xl .dropdown-menu a.dropdown-item{
    padding: 15px;
    position:relative;
    text-align: left;
}

.navbar-expand-xl .dropdown-menu a.dropdown-item:hover{background-color:#010080;color:#fff;}
.navbar-expand-xl .dropdown-menu a.dropdown-item:hover::after{
    border-left: .3em solid #fff;
}

.sidebar .dropdown-menu{
    left: 50%;
    transform: translateX(-50%);
    width: 280%;
}
.device-title span{
    margin-right: 0;
    font-size: 17px;
    color: #010080;
    font-weight: 600;
}
@media (min-width: 991px){
  .sub-dropdown:hover .sub-dropdown-menu{width:100%;border-radius: 0;margin: 0;}

}
@media (min-width: 1200px){
    .lan-phone{display: none!important;}
    header.change .navbar-expand-xl .navbar-nav .nav-link{color:#1d1d1d;text-shadow: none;}
}
@media (max-width: 1200px) { 
  /*header*/
  header .navbar{padding:0;background-color:#eee;-webkit-align-items:center;-ms-flex-align:center;align-items:center;top: 50px;}
  header.change .navbar{top:0}
  .navbar-brand{margin-left:1rem}
  .navbar-toggler{width:40px;height:40px;padding:0;font-size:initial;line-height:0;margin-right:1rem}
  .navbar-toggler-icon{background-color:#010080;width:100%;height:3px}
  .navbar-toggler-icon:nth-of-type(2){margin:8px 0}
  .navbar-brand img{width:55px}
  .navbar-collapse .lan-box{display:none!important}
  .navbar-collapse .navbar-nav{text-align:center;background-color:#010080}
  .navbar-expand-xl .navbar-nav .nav-link{text-shadow:none}
  .nav-item+.nav-item{border-top:1px solid rgba(255,255,255,.5)}
  .lan-box{position:absolute;z-index:10000;margin:0;background-color:#010080;/* padding:10px 0; */top: 0;}
  .sub-dropdown-title.dropdown-toggle::after{
    border-bottom: 0;
    border-left: .3em solid transparent;
    border-top: .3em solid #333;
    border-right: .3em solid transparent;
    right: auto;
    top: 26px;
    margin-left: .4em;
}
  .navbar-expand-xl .dropdown-menu a.dropdown-item:hover::after{
    border-left: .3em solid transparent;
    border-top: .3em solid #fff;
}
.sub-dropdown:hover .sub-dropdown-title{
    background-color: #9a99e4;
}
.sub-dropdown-menu{
    background-color: #fff!important;
}
}

@media (max-width: 991px) { 
  .navbar-collapse .navbar-nav a br{display:none}
  .sidebar .dropdown-menu{width:100%;left: 0;transform: translateX(0);}
  .sidebar .dropdown-menu br{display:none}
}

@media (max-width: 768px) { 


}

@media (max-width: 640px) { 
    .navbar-brand img{width:45px}
}

@media (max-width: 480px) { 

.circle{
    width: 160px;
}
.circle-ar{
    margin-bottom: 50px;
}
.arrow-d:before{
    bottom: -45px;
}
}

@media (max-width: 320px) { 

}