@charset "utf-8";

/* CSS Document */
body{font-family: 'Poppins','Noto Sans TC','Noto Sans JP',sans-serif;font-size:16px;line-height:1.5;color: #474747;background: #fff;font-weight:200;}
a{color:#474747;text-decoration:none}
a:hover{color:#777;-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}

/*---------------------- 基礎設定 ----------------------*/
.aleart_line{border-color: #d40023;}
.red{color: #d40023;}

/* 回頂端 */
#goTop{z-index: 999;border:1px solid #CCC;color:#aaa;background:#FFF;text-align:center;position:fixed;bottom: 100px;right: 25px;width: 60px;height: 60px;line-height: 60px;cursor:pointer;display:none;font-family:Verdana,Geneva,sans-serif;-moz-border-radius:100%;-webkit-border-radius:100%;border-radius:100%;-webkit-box-shadow:#EEE 0 0 5px;-moz-box-shadow:#EEE 0 0 5px;box-shadow:#EEE 0 0 5px;}
#goTop:hover{background:#999;color:#FFF}

/*按鈕*/
.btn-style{border: 1px solid #004789;color: #fff;padding:10px 40px;display: inline-block;background: #004789;transition: all .5s;}
.btn-style:hover{background: inherit;color: #004789;}
/*RWD編輯器表格(X捲軸)*/
.table-container table td{min-width:100px;padding:5px;border:1px solid #ccc;white-space:inherit}
@media screen and (max-width: 768px) {
.table-container{width:100%;overflow-y:auto;_overflow:auto;margin:0 0 1em}
}

/*---------------------- 頁面開始 ----------------------*/
i{/* display:inherit; */}
img{backface-visibility: hidden}
.block{height: 136px;width: 100%;}
/*標題*/
figure,p{margin-bottom:0;/*text-align: center;*/}
.main-title h2{position:relative;margin-bottom: 30px;}
.main-title h2:before{content:'';position:absolute;bottom: -10px;width:50px;height:1px;background: #211a61;left:50%;transform: translateX(-50%);}
.main-title h3{font-family: 'Fjalla One', sans-serif;font-size: 2.5rem;}
/*page number*/
.page-number{margin: 20px auto;}
.pagination{display: block;}
.pagination>li{display: inline-block;}
.pagination>li>a{border:none;color:#333;transition: all .5s;padding: 5px 10px;}
.pagination>li>a:hover{color: #ff9900;}
.pagination>li.on a{background: #ff9900;color: #fff;border-radius: inherit;}

/*版面區塊*/
.innerContent{z-index: 10;}
.page-inner{padding:0px 20px;}
.block-height{margin: 10px 0;}
.block-height:last-child{padding-bottom: 20px;}
@media screen and (min-width:991px) {
    .page-inner{padding:0px 40px;}
}
@media screen and (min-width:1280px) {
    .page-inner{padding:0px 60px;}
    .block-height{padding-top: 40px;}
    .block-height:last-child{padding-bottom:40px;}
}
@media screen and (min-width:1480px) {
    .page-inner{padding:0px 100px;}
    .ix-banner .slick-slide .banner-rwd-pic{display: none;}
}
@media screen and (min-width:1680px) {
    .page-inner{padding: 0px 300px;}
}
/*主選單*/
header{padding:10px 0;transition:all .5s;position: fixed;z-index: 999;background: #fff;top: 0;width: 100%;}
header.fixed{padding:0;-webkit-animation: .95s ease-in-out 0s normal none 1 running fadeInDown;animation: .95s ease-in-out 0s normal none 1 running fadeInDown;position: fixed;top: 0;left: 0;width: 100%;z-index: 999;background: #fff;-webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);}
header .menu a img{max-width: 70px;transition:all .5s;}
header.fixed .menu a img{max-width:60px}
.menu{display:flex;align-items: center;justify-content: space-between;padding: 10px 0;}
.menu-btn{display:none;}
.menu-outer{display:flex;align-items:center;width: 100%;}
.menu-list,.menu-lang{margin-left:auto;}
.menu-list ul{list-style:none;padding-left:0;display:flex;align-items: center;margin-bottom: 0;}
.menu-list ul li{padding: 0px 25px;position:relative;}
.menu-list ul li a{display:flex;transition: all .5s;}
.menu-list ul li a i{font-size:.9rem;margin-left:5px;}
.menu-list ul li:hover>a{color:#ff9900}
.menu-drop{display:none;position: absolute;top: 45px;width: 145%;left: 0;z-index: 10;background: #004789;padding: 10px;box-shadow: 0px 10px 10px rgb(0 0 0 / 0.2);}
.menu-drop a{font-size: .9rem;border-bottom: 1px solid rgb(255 255 255 / 0.4);padding: 10px 0;color: #FFF;display: flex;/* align-items: self-end; *//* justify-content: center; */transition: all .5s;}
.menu-drop a:last-child{border-bottom:none;}
.menu-drop a:hover{color: #ff9900;}
.jp_menu-drop{width: 165%;}


.menu-lang a{font-size:1.2rem;font-weight:bold;margin-right: 10px;display: inline-block;}
.menu-lang select{background: #dfdfdf;border: none;padding: 5px 10px;}
.menu-lang.mob-lang{margin-right: .5rem;margin-left: auto;background: inherit;}
.mob-lang select#lang{border: 1px solid #004789;background: #004789;color: #fff;border-radius: 5px;}
/*首頁-banner*/
.ix-banner.slick-dotted.slick-slider{margin-bottom: 0;margin-top: 136px;}
.ix-banner .slick-slide{position: relative;height: 450px;}
.ix-banner .slick-slide figure{display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    min-width: 100%;
    min-height: 100%;
    -o-object-fit: cover;
    object-fit: cover;}
.ix-banner .slick-slide img{    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    -o-object-fit: cover;
    object-fit: cover;}
.ix-banner .slick-slide:before{content:'';position:absolute;left:0;bottom:0;width:100%;height:100%;background: rgb(0 0 0 / 15%);z-index: 1;pointer-events: none;}
.ix-slogan{width: auto;position: absolute;bottom: 10%;left: 15%;z-index: 10;color:#fff;display: flex;align-items: flex-start;/* padding-left: 20px; *//* border-left: 3px solid #fff; */}
.ix-slogan h2{font-family: 'Fjalla One', sans-serif;font-size: 3rem;text-shadow: 0px 0px 5px #211a61;border-right: 3px solid;padding-right: 20px;}
.ix-slogan p{font-size: 1.2rem;text-shadow: 0px 0px 5px #211a61;margin-bottom: 0;max-width: 1000px;padding-left: 20px;/* margin-left: 20px; */}
.ix-banner .slick-dots{bottom: 5%;right: 10%;width: auto;}
.ix-banner .slick-dots li button:before{color:#fff!important;font-size: 20px;}
.ix-banner .slick-dots li.slick-active button:before{opacity:1;}
.ix-banner .slick-dots li{margin:0px 15px}
.banner-link{display:block;height: 100%;}
/*首頁新聞*/
.ix-news{background: #004789;padding: 40px 0;}
.ix-news-slide{padding:0px 30px;}
.ix-news-slide a{display:flex;align-items:center;color:#fff;transition: all .5s;}
.ix-news-slide a .date{color:rgb(255 255 255 / 70%);padding-right: 10px;}
.ix-news-slide a .type{border:1px solid;padding: 0px 10px;margin:0px 10px;font-size: .9rem;}
.ix-news-slide a:hover{color: #ff9900;}
.ix-news-slide a:hover .date{color: rgb(255 153 0 / 0.7);}
/*快速連結*/
.quick-link{padding:80px 0px;position: relative;}
.quick-list{
  display: grid;
  grid-template-columns: repeat(4,1fr);
  grid-column-gap: 20px; /* 設定左右間距 */
  grid-row-gap: 20px; /* 設定上下間距 */
  }
.quick-box{position:relative;}
.quick-box:before,.quick-box:after{content:'';position:absolute;left:0;bottom:0;width:100%;height:3px;transition: all .5s;background:#eee;}
.quick-box:before{width:0;}
.quick-box:hover:before{width:100%;background: #006fba;z-index: 1;}
.quick-box h3{font-size:1.2rem;font-weight:bold;margin: 15px 0;}
.link-zone a{position:relative;display:block;padding-left: 20px;margin-bottom: 10px;transition: all .5s;}
.link-zone a:before{content: "\f273";font-family: bootstrap-icons !important;font-size: .8rem;color: #006fba;font-weight: bold;position: absolute;left: 0;bottom: 3px;}
.link-zone a:hover{color: #ff9900;}
/*----------------------單元-------------------*/
.area_pro{position:relative}
.area_pro .area_abso{position:absolute;left:0;top: -300px;}
/*麵包屑*/
.breadCrumbs-block{/* margin-top: 15px; */padding: 15px 0;/* background: #ddd; */}
.breadCrumbs-block .breadCrumbs{/* float: right; */list-style:  none;margin:  0;padding:  0;}
.breadCrumbs-block .breadCrumbs .item{display: inline-block;padding: 0 7px 0 0;font-size: 14px;}
.breadCrumbs-block .breadCrumbs .item:after{content: '/';display: inline-block;color:#999}
.breadCrumbs-block .breadCrumbs .item a{display: inline-block;padding: 0 7px 0 0;color:#999;}
.breadCrumbs-block .breadCrumbs .item.active:after{display:none}
.breadCrumbs-block .breadCrumbs .item.active a{padding-right:0;color: #ff9900;}
/*banner*/
.banner-page{position:relative;z-index: 1;margin-top: 136px;}
.banner-word{position:absolute;top: 35%;left: 16%;color:#fff;}
.banner-word h2{font-size:1.4rem;position:relative;margin-bottom: 20px;}
.banner-word h2:before{content:'';position:absolute;left:0;bottom: -10px;width: 55px;height:1px;background:#fff;}
.banner-word h3{font-weight:bold;}
/*產品頁面*/
.pdt-page{margin: 30px 0 60px;}
.pdt-page:after{content:'';display:block;clear:both;}
.sidebar{width:250px;float:left;position: sticky;top: 120px;z-index: 10;background: #fff;}
.sidebar button{width:100%;border:none;padding:10px 0px;background: #004789;color: #fff;display: flex;align-items: center;justify-content: center;}
.sidebar button i{margin-bottom:5px;margin-left:5px;display:inline-block;}
.sidebar-list ul {list-style:none;padding-left:0;}
.sidebar-list ul li{padding: 10px 0px 10px 20px;border-bottom:1px solid #d0d0d0;position: relative;}
.sidebar-list ul li:before{content:'';position:absolute;left:3px;top:18px;height:6px;width:6px;background:#1f3134;border-radius:50%;-webkit-transition:.3s;transition:.3s}
.sidebar-list ul li:after{content:'';position:absolute;left: -1px;top: 14px;height: 14px;width: 14px;border:solid 1px #1f3134;border-radius:50%;-webkit-transform:scale(.5);transform:scale(.5);-webkit-transition:.3s;transition:.3s;}
.sidebar-list ul li.active:after,.sidebar-list ul li:hover:after{-webkit-animation:wave 1s .3s cubic-bezier(.08,.92,.35,1) infinite;animation:wave 1s .3s cubic-bezier(.08,.92,.35,1) infinite}
.sidebar-list ul li.active a{color: #ff9900;}
.sidebar-list ul li.active:before{background:#ff9900}
.sidebar-list ul li.active:after{border:1px solid #ff9900}
@-webkit-keyframes wave {
0%, 50% {
-webkit-transform:scale(0) translate3d(0, 0, 0);
transform:scale(0) translate3d(0, 0, 0);
opacity:1
}
to {
    -webkit-transform:scale(1.3) translate3d(0, 0, 0);
    transform:scale(1.3) translate3d(0, 0, 0);
    opacity:0
}
}
@keyframes wave {
0%, 50% {
-webkit-transform:scale(0) translate3d(0, 0, 0);
transform:scale(0) translate3d(0, 0, 0);
opacity:1
}
to {
    -webkit-transform:scale(1.3) translate3d(0, 0, 0);
    transform:scale(1.3) translate3d(0, 0, 0);
    opacity:0
}
}
         
.pdt-zone{width:100%;display: inline-block;}
.sidebar+.pdt-zone{width: calc(100% - 250px); padding-left: 50px;}
.pdt-all{display: grid;grid-template-columns: repeat(3,1fr);grid-column-gap: 20px; /* 設定左右間距 */grid-row-gap: 20px; /* 設定上下間距 */}
.pdt-all a{text-align:center;}
.pdt-all a figure{overflow:hidden}
.pdt-all a figure img{transition:all .5s;width: 80%;}
.pdt-all a:hover figure img{transform:scale(1.2)}
.pdt-all a p{padding:10px 0;border-bottom:1px solid #b1b1b1;font-size: 1.2rem;}
/*產品底層*/
.pdt-title{font-size:2.4rem;}
.apply-zone a{padding: 5px 15px;display:inline-block;background: #006fba;border-radius: 20px;border: 1px solid;color: #fff;font-size: .9rem;margin-bottom: 10px;transition: all .5s;}
.apply-zone a:hover{border: 1px solid #006fba;color: #006fba;background: inherit;}
.img-focus{/* padding:20px; */border:1px solid #eee;background: #fff;text-align: center;}
.img-thumb{list-style:none;padding-left:0;display:flex;flex-wrap: wrap;}
.img-thumb li{padding:10px;border:1px solid #eee;width: 25%;background: #fff;}
.img-thumb li a{margin-bottom:0}
.nav-tabs .nav-link{border: 1px solid transparent;border-radius:0;margin-left:-1px;border-top: 3px solid transparent;padding: 5px 10px;font-size: .9rem;}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{border-top: 3px solid #006fba;color: #006fba;}
.tab-content a{color:red}
.tab-content a:hover{text-decoration:underline}

.pdtBtn a{padding:10px 20px;display: inline-block;border:1px solid;background: #ff9900;color:#fff;transition: all .5s;}
.pdtBtn a:hover{background:inherit;border:1px solid #ff9900;color:#ff9900}
.pdtBtn a span{display: flex;align-items:center;justify-content: center;}
.pdtBtn a span i{margin-top:-7px;margin-right:5px;}
.pdtEdit table{width:100%}
.pdtEdit table tr:first-child td{background:#797979;color: #fff;text-align: center;padding: 10px;}
/*最新消息*/
.news-zone{
  display: grid;
  grid-template-columns: repeat(2,1fr);
  grid-column-gap: 20px; /* 設定左右間距 */
  grid-row-gap: 20px; /* 設定上下間距 */
  }
.news-zone .date{color:#006fba;font-weight: bold;font-size: .9rem;}  
.news-zone a{position:relative;border-bottom: 1px solid #eee;padding-bottom: 10px;transition: all .5s;}
.news-zone a:after{
    content: "\f273";
    font-family: bootstrap-icons !important;
    font-size: .8rem;
    color: #006fba;
    font-weight: bold;
    position: absolute;
    right: 0;
    bottom: 3px;
    }
.news-zone a:hover{color:#ff9900}   

/*六圖六文*/
.news-title{text-align:center;padding-bottom:10px;margin-bottom:20px;border-bottom:1px solid #000;}
.news-title .date{color:#006fba}
.news-pic{max-width: 1000px;margin: 0 auto;}
.pic-box{margin-bottom: 50px;}
.pic-box{display:flex;}
.pic-box figure{width:50%;}
.pic-box .pic-word{width:100%}
.pic-box figure + .pic-word{width:50%;padding-left:20px;}
.pic-box.big{flex-wrap:wrap;}
.pic-box.big>*{width: 100%!important;padding-left: 0!important;}
.pic-box.img-right{flex-direction: row-reverse;}
.pic-box.img-right picture + .pic-word{padding-left:0;padding-right:20px;}
.pic-box.img-left picture + .pic-word{padding-right:0;padding-left:20px;}
.pic-word{margin-top:20px;}
.pic-word a{color: #dc3545;}
.pic-word a:hover{text-decoration:underline}
.embed-responsive{max-width: 1000px;margin: 0 auto;}

@media screen and (max-width:768px) {
    /*新聞底層*/
    .pic-box{flex-wrap:wrap;}
    .pic-box figure,.pic-box .pic-word,.pic-box figure + .pic-word{width:100%;padding-left: 0;}
}
 
/*----------------------關於我們---------------------*/
/*company*/

.about-inner{position: relative;display: inline-block;width: 100%;}
.about-provides{margin-bottom: 50px;display: inline-block;}
.about-left h4 {font-size: 1rem;line-height: 1.8;margin-right: 40px;}
.about-big-word{margin-bottom: 15px;}
.about-big-word h2{font-weight:bold;color:#006fba;font-size: 2rem;display: flex;align-items: center;justify-content: left;font-family: 'Fjalla One', sans-serif;letter-spacing: 2px;}
.about-big-word h3{display: inline-block;font-size: 1rem;margin: 10px 0;}
.about-office {display: flex;}

/*
.about-office h2{font-weight: bold;color: #006fba;font-size: 2rem;display: flex;align-items: center;justify-content: left;font-family: 'Fjalla One', sans-serif;letter-spacing: 2px;}
*/
.about-hk,.about-tw{display: inline-block;width: 50%;margin: 50px 0;padding: 0 15px;float: left;}
.about-hk img,.about-tw img{width: 50%;display: block;float: left;padding: 2px;}
.about-hk h3,.about-tw h3 {display: flex;color: #000000;padding: 15px 0px;margin: 0;opacity: 0.8;font-size: 1.28em;font-weight: 400;}

/*factories + certification*/
.pro_box {display: grid;grid-template-columns: repeat(3,1fr);grid-column-gap: 30px;grid-row-gap: 30px;}
.box {text-align: center;box-shadow: 0px 0px 10px rgb(0 0 0 / 20%);padding: 15px;border-radius: 15px;display: flex;flex-wrap: wrap;align-items: center;justify-content: center;flex-direction: column;}
.box figure {width:80%;}
.page-cf {margin-bottom: 60px;}
.cf-title {margin: 0 0 25px;color: #004789;}
.pro_name {padding: 20px 0 5px;}
.pro_name span{font-weight: 400;}
@media (max-width:760px){
    .about-office{flex-direction:column;}
    .about-hk, .about-tw{width:100%;}
    .about-hk, .about-tw{padding:0;margin: 30px 0 0 0;}
}
@media (max-width:640px){
    .about-hk, .about-tw{display: flex;flex-direction: column;}
    .about-hk img, .about-tw img{width:100%;padding: 0;margin: 0 0 15px 0;}
    .about-hk img:last-child, .about-tw img:last-child{margin:0;}
    .about-hk h3, .about-tw h3{padding:0 0 15px 0;}
}

/*Milestone*/
.milestone-zone{position:relative;display: flex;flex-wrap: wrap;}
.milestone-box{display:flex;align-items:center;width: 100%;margin: 15px 0;background: #f7f7f7;height: auto;}
.mile-right{width: 50%;padding: 15px;display: flex;flex-wrap: wrap;flex-direction: row;justify-content: center;align-items: flex-start;}
.mile-left{width: 50%;/* margin-left: 20px; */padding: 20px 40px;}
.mile-left p{text-align: left;}
.mile-right .bliss-img{width: 40%;}
.mile-inner{padding: 10px 1px 0;text-align: center;}
.mile-inner .img-fluid {max-width: 75%;}

.mile_info_p {padding: 10px 5px;}
.mile_info_p p {text-align: center;justify-content: center;font-size: .9rem;font-weight: 400;}

.milestone-box:nth-child(even){/*flex-direction:row-reverse;*/}
.milestone-box:nth-child(even) .mile-right{margin-left:0;/* margin-right: 20px; */}
.mile-icon figure{background:#fff;border-radius:100%;width: 45px;height: 45px;display: flex;position: relative;align-items: center;justify-content: center;align-content: center;flex-direction: row;}
.mile-icon.first figure{border: 5px solid #ff0000;}
.mile-icon.second figure{border: 5px solid #006fba;}
.mile-icon.third figure{border: 5px solid #000000;margin-right: 0;}
.mile-icon.first figure:before{background: #ff0000;}
.mile-icon.second figure:before{background: #0060a0;}
.mile-icon.third figure:before{/* background: #000000; */}
.mile-icon figure:before{/* content:''; *//* position:absolute; */left: 0px;/* bottom:0; *//* width: 100%; *//* transform: scale(1.4); *//* height: 100%; *//* background: #000; *//* z-index: -1; *//* border-radius: 100%; */}
.mile-icon img{max-width: 25px;}

.mile-icon{width:100px;width: auto;position: relative;display: flex;margin-bottom: 10px;flex-direction: row;flex-wrap: nowrap;align-content: center;justify-content: flex-start;align-items: center;}
.mile-info h3{font-family: 'Fjalla One', sans-serif;font-size: 2rem;margin: 0 20px;padding: 0 10px;}
.mile-icon.third h3{color: #000000;display: inline-block;}
.mile-icon.first h3{color: #ff0000;}
.mile-icon.second h3{color: #006fba}
.mile-info ul{margin-bottom:0;list-style: none;padding-left: 0;}
.mile-info ul li{margin-bottom:10px;padding-bottom: 10px;}


.box-left, .box-right {display: flex;width: 50%;justify-content: center;align-items: center;}



@media screen and (max-width:768px) {
    .box-left, .box-right {display: flex;width: 100%;flex-direction: row;}
}


/*.milestone-box:nth-child(odd) .mile-info{padding-left: 35px;}
.milestone-box:nth-child(even) .mile-info{padding-right: 35px;}
*/

/*同樂優勢Advantage*/
.advantage-info{display: grid;grid-template-columns: repeat(3,1fr);grid-column-gap: 30px; /* 設定左右間距 */grid-row-gap: 60px; /* 設定上下間距 */}
.info-box{text-align:center;position: relative;padding: 20px;border-bottom: 3px solid #211a61;}
.info-box:before{content:'';position:absolute;left:50%;transform:translateX(-50%);width: 100%;height: 80%;bottom: 0;background: #fff;box-shadow: 0px 10px 20px rgb(0 0 0 / 15%);z-index: -1;}
.info-box figure{position:relative;margin-bottom: 20px;}
.info-box figure img{position:relative;max-width: 75px;margin: 0 auto;padding-bottom: 30px;}
.info-box figure:before{content:'';position:absolute;bottom:0;left: 50%;transform: translateX(-50%);width: 135px;height: 135px;border-radius: 100%;background: rgb(0,71,137); /* Old browsers */background: -moz-linear-gradient(-45deg, rgba(0,71,137,1) 0%, rgba(90,167,220,1) 100%); /* FF3.6-15 */background: -webkit-linear-gradient(-45deg, rgba(0,71,137,1) 0%,rgba(90,167,220,1) 100%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(135deg, rgba(0,71,137,1) 0%,rgba(90,167,220,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#004789', endColorstr='#5aa7dc',GradientType=1 );box-shadow: 0px 10px 15px rgb(0 0 0 / 15%);}
.info-box h3{font-size: 1.2rem;font-weight: bold;margin-bottom: 30px;position: relative;color: #211a61;}
.info-box h3:before{content:'';position:absolute;left:50%;transform:translateX(-50%);width: 50px;height: 2px;background: #211a61;bottom: -15px;}
.info-box span{position:absolute;bottom: -40px;right: 24px;font-size: 6rem;color: rgb(31 24 88 / 10%);font-family: 'Fjalla One', sans-serif;font-style: italic;}
.advantage .advantage_a a:hover {transition: all .3s linear;}
.advantage .advantage_a a:hover .img-fluid {transform: scale(1.1);}
.advantage .advantage_a a .img-fluid {transition: all .5s;}

/*one-stop ODM*/
.stop-zone{
  display: grid;
  grid-template-columns: repeat(3,1fr);
  grid-column-gap: 30px; /* 設定左右間距 */
  grid-row-gap: 30px; /* 設定上下間距 */
  }
.stop-box{position:relative;padding: 50px;}
.stop-box:before{content:'';position:absolute;right:0;bottom:0;width: 100%;height:100%;z-index: -1;border-radius: 25px;background: rgb(226,226,226); /* Old browsers */background: -moz-linear-gradient(-45deg, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 50%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%); /* FF3.6-15 */background: -webkit-linear-gradient(-45deg, rgba(226,226,226,1) 0%,rgba(219,219,219,1) 50%,rgba(209,209,209,1) 51%,rgba(254,254,254,1) 100%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(135deg, rgba(226,226,226,1) 0%,rgba(219,219,219,1) 50%,rgba(209,209,209,1) 51%,rgba(254,254,254,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe',GradientType=1 );border: 3px solid #ececec;box-shadow: 0px 10px 20px rgb(0 0 0 / 10%);}
.stop-icon figure{width: 90px;height: 90px;background:#fff;border: 5px solid #004789;border-radius:100%;display: flex;align-items: center;justify-content: center;box-shadow: 0px 10px 10px rgb(0 0 0 / 40%);position: relative;}
.stop-icon figure:before{content:'';position:absolute;left:0;bottom:0;width:100%;height:100%;transform: scale(1.3);background: #4894cb;z-index: -1;border-radius: 100%;}
.stop-icon span{position:absolute;right: 35px;top: -25px;font-size: 8rem;font-style: italic;color: #c5c5c5;}
.stop-icon img{max-width: 60px;}
.stop-info{/* padding-left: 55px; */color: #3a3a3a;margin-top: 30px;}
.stop-info h2{font-size:1.6rem;font-weight:bold;}
.stop-info h3{font-size: 1.2rem;margin-bottom: 25px;font-weight: bold;}
.stop-info h4{font-size:1.2rem;margin-bottom:30px;padding-left:10px;border-left:3px solid;}
.stop-info ul{list-style:none;padding-left:0;}
.stop-info ul li{padding-left:20px;position:relative;padding-bottom: 10px;}
.stop-info ul li:before{content: "\f49b";font-family: bootstrap-icons !important;position: absolute;left: 0;font-size: .9rem;top: 2px;}

/*Bluetooth+流程圖*/
.page-inner .core-height{padding-top: 0;}
.core-title .content_title {text-align: left;margin-bottom: 40px;}
.core-title .content_title h2 {}
.title_2 {color: #006fba;font-weight: 400;text-align: center;margin: 30px 0 0;}
.core-title .content_title p {font-size: 1rem;margin: 10px 10px 0 0;text-align: left;}
.block-height .core-box .core-title {text-align: left;color: #fff;background: #006fba;padding: 5px;display: flex;cursor: pointer;align-items: center;justify-content: space-between;}
.block-height .core-box .core-title h3 {color: #fff;padding: 10px;margin-bottom: 0;font-weight: 500;letter-spacing: 1px;font-size: 1.28rem;}
.block-height .core-box .core-title i{margin-right: 10px;}
.core-box .background-color {background: #eafbff;padding: 40px 10px;}
.core-info figure{display: flex;justify-content: center;}
.core-info .core-img{margin-top: 10px;}
.core-box {box-shadow: 0 8px 10px rgb(0 0 0 / 5%);}
.info_images {margin: 10px 0;}
.sameheight{position:relative;z-index:1}
.sameheight:before{content:"";position:absolute;background: #eeeeee;width: calc(100% - 31px);height: 100%;z-index: -1;top: 0;left: 50%;transform: translateX(-50%);}
@media(max-width:768px){
    .sameheight:before{display:none}
}
.right_cn {/* margin-top: 20px; */}
.right_cn p {text-align: left;}
.core-inner .info_images figure {border: 1px solid #eee;background: #eee;}
.info_p {background: #eee;padding: 10px 5px;/* height: 60px; */display: flex;align-content: center;justify-content: flex-start;align-items: center;flex-wrap: nowrap;flex-direction: column;}
.jp_mov_sh{min-height: 62px;}
.info_p ul{margin: 0;}
.info_p_two{/* min-height: 100px; */}
.info_p p {text-align: center;justify-content: center;color: #006fba;font-size: .9rem;font-weight: 400;}
.info_p p+p {font-weight: 400;color: #000000;}
.row .info_right .right_cn p {color: #000;margin-bottom: 1rem; }
.right_cn h3 {color: #006fba;font-size: 1.28rem;font-weight: 400;}
.row .info_right .right_cn {width: 100%;text-align: left;/* display: inline-table; */margin: 0 0 20px;}
p.red_p {color: red;/* line-height: 40px; */}
.red_p a{border: 1px solid #006fba;padding: 6px 10px;border-radius: 20px;margin: 0 5px;color: #006fba;white-space:nowrap;}
.red_p a:hover{background:#006fba;color:#fff;}
b.red_p{color: red}
.marginSame{margin: 1rem 0;}

/**/
.linkbtn a{border: 1px solid #006fba;padding: 0px 10px;border-radius: 20px;margin: 0 5px;color: #006fba;white-space:nowrap;}
.linkbtn a:hover{background:#006fba;color:#fff;}
.sm{display: none;}
.core-box .row .title{width:100%;margin: 0;}
.core-box .imgBoxList{display:flex;flex-wrap:wrap;align-content: flex-start;}
.core-box .imgBoxList .imgBox{width: calc(50% - 1rem);margin: 0 1rem 20px 0;background: #eee;}
.core-box .imgBoxList .imgBox:last-child{margin:0 0 0 1rem;}
.core-box .row .title01{margin:0;}
.core-box .row .title01 h3{margin:0;}
.core-info  .hightline0{line-height: inherit;}
p.heightline0{line-height: inherit;}
.secondul{margin-left: 1rem;}
.nwrap{white-space: nowrap;}


@media(max-width:1900px){
    .nwrap{white-space:inherit;}
}
@media(max-width:1200px){
    .mov_sh01{min-height:62px}
}
@media(max-width: 1067px){
    .jp_mov_sh{min-height:83px}
}
@media(max-width:1060px){
    .mov_sh{min-height:62px}
}
@media(max-width:991px){
    .blue_sh{min-height:62px}
    .jp_blue_sh{min-height:inherit}
}
@media(max-width:768px){
    .blue_sh{min-height:inherit;}
    .mov_sh{min-height:inherit}
    .mov_sh01{min-height:inherit}
    .jp_mov_sh{min-height:inherit}
}
@media(max-width:640px){
    .linkbtn a{margin-left: -10px;}
    .sm{display: block;}
    .core-box .imgBoxList{flex-direction:column}
    .core-box .imgBoxList .imgBox{width:100%;margin-bottom: 40px;}
    .core-box .imgBoxList .imgBox:last-of-type{margin-bottom:20px}
    .title02{margin-top: 1rem;}
}
/*sensors*/

ul {margin: 1rem 0 2rem;}
.row .col-md-3,.row  .col-md-4,.row  .col-md-5,.row .col-md-6,.row .col-md-7,.row .col-md-8,.row .col-md-12 {padding: 0px 15px;margin: 20px 0;} 
.page_col {margin: 0 !important;}
.page_col h3{margin-top: 20px;}
.row .info_ul {background: #2488cc;justify-content: center;padding: 10px 30px;color: #ffffff;font-size: 1.3rem;font-weight: bold;box-shadow: 3px 3px 3px #6c757d;/* min-height: 260px; *//* margin: 15px 0; */align-items: flex-start;height: 100%;}
.row .info_ul p{font-weight: 400;margin: 10px 0;text-align: center;}
.row .info_ul ul{font-weight: 400;font-size: 1rem;margin: 20px 0;}
.row h3,.tittle-h3 h3 {color: #006fba;font-weight: 400;font-size: 1.3rem;margin-bottom: 20px;}

@media (max-width:640px){
    .row .col-md-3,.row  .col-md-4,.row  .col-md-5,.row .col-md-6,.row .col-md-7,.row .col-md-8,.row .col-md-12 {padding: 0px 10px;margin: .5rem 0;} 
    .core-box .row .title01 h3{margin:0;margin-bottom: 20px;}
    .row .info_ul{padding:10px}
}

/*客戶*/
.clients-zone{display: grid;grid-template-columns: repeat(5,1fr);grid-column-gap: 30px; /* 設定左右間距 */grid-row-gap: 30px; /* 設定上下間距 */}
.clients-box{text-align:center;box-shadow: 0px 0px 10px rgb(0 0 0 / 20%);padding: 15px;border-radius: 15px;display: flex;flex-wrap: wrap;align-items: center;justify-content: center;}
.clients-box h3{font-size:1.2rem;font-weight: bold;margin: 15px 0;width: 100%;}
/*聯絡我們contact*/
.contact-link{padding:30px 0px;background: #eee;position: sticky;top: 100px;z-index: 1;}
.contact-link ul a:hover{background:#004789;color:#fff;}
.contact-link ul{list-style:none;padding-left:0;display:flex;align-items:center;justify-content:center;margin-bottom: 0;}
.contact-link ul.jp{/* flex-direction: column; */}
.contact-link ul.jp li{/* margin:.25rem; */}
.contact-link ul a{padding: 5px 20px;margin: 0 10px;background: inherit;color: #004789;border-radius: 25px;border: 1px solid;display: block;}
.contact-link ul.jp a{/* margin:.25rem 10px */}
.contact-form{padding:50px;box-shadow:0px 0px 20px rgb(0 0 0 / 0.2)}
.map-zone{margin-top: 80px;display: grid;grid-template-columns: repeat(2,1fr);grid-column-gap: 30px; /* 設定左右間距 */grid-row-gap: 30px; /* 設定上下間距 */}
.map-box{border:1px solid #eee;padding:20px;}
.map-box h3{font-size:1.4rem;font-weight:bold;margin-bottom:20px;position: relative;}
.map-box h3:before{content:'';position:absolute;left:0;bottom: -10px;width: 60px;height: 2px;background:#004789;}
.map-box h4{font-size:1rem;margin-bottom:20px;font-weight: bold;}
.map-box ul{list-style:none;padding-left:0;}
.map-box ul li{display:flex;margin-bottom: 10px;}
.map-box ul li i{width:20px;margin-top: -3px;color:#004789}
.map-box ul li span,.map-box ul li a{/* width: calc(100% - 20px); */padding-left: 10px;}
.map-box ul li a{color:#06f}
/*core回上一頁*/
.prevPage{position: -webkit-sticky;position: sticky;bottom: 0;left: 0;width: 100%;text-align: center;background: #fff;padding: 1rem 0 1rem;box-shadow: 2px 2px 10px #eee;z-index: 999;}
.prevPage a{background:#004789;padding: .5rem 2rem;color: #fff;display: inline-block;margin: 0 auto;border:1px solid #004789;z-index: 999;}
.prevPage a:hover{border:1px solid #004789;background:#fff;color:#004789}
/*頁尾*/
footer{background: #EFEFEF;color: #000;padding: 10px;text-align:center;font-size: .9rem;padding: 50px 0;font-weight: 400;}
footer ul{list-style:none;padding-left:0;}
footer a{color: #333;}
.ft-locate a{display:inline-block;margin-bottom:10px;}
.ft-locate a span:first-child{width: 60px;display:inline-block;vertical-align: top;position: relative;color: #296fbc;}
.ft-locate a span:first-child:before{content:'';position:absolute;right: 10px;bottom: 5px;width:1px;height: 12px;background: #296fbc;}
.ft-locate a span:last-child{display:inline-block;width: calc(100% - 60px);}
.ft-info{display:flex;justify-content: space-between;align-items: flex-end;}
.ft-left{width: 25%;text-align: left;min-width: 350px;}
.ft-left a img{max-width: 80px;margin-bottom: 30px;}
.ft-right{width: 45%;}
.ft-right ul{display:flex;margin-bottom: 0;}
.ft-right ul li:not(:last-child){margin-right: 25px;}
.ft-right ul li a{display:block;text-align: left;margin-bottom: 10px;transition: all .5s;}
.ft-right ul li a:last-child{margin-bottom:0;}
.ft-right ul li a:hover{color:#ff9900}
.ft-right ul li>a{color: #296fbc;}
.ft-btm{display:flex;align-items:center;width:100%;border-top: 1px solid #b7b7b7;padding-top: 10px;margin-top: 10px;justify-content: space-between;}
.ft-lang ul{display:flex;align-items:center;}
.ft-lang ul li{margin:0px 10px;}
.ft-lang ul li a{padding: 0 3px;transition:all .5s;position: relative;}
.ft-lang ul li:not(:last-child) a:after{content:'';position:absolute;bottom: 5px;right: -11px;width: 1px;height: 10px;background: #00000073;}
.ft-lang ul li a.active,.ft-lang ul li a:hover{background: #004789;color: #fff;}
/*chatbox*/
.fb_dialog_content iframe{/* bottom: 100px !important; */}

/*----------------------RWD設定-------------------*/

@media screen and (max-width:1680px) {
    .ix-about-other .service-box .service-info{top:0%}
}
@media screen and (max-width:1280px) {
    .ix-about-other .service-box .service-info{top:25%}
    .ix-about-other .service-box{width:50%}
    .ix-news,.ix-local{width:100%;margin: 0;}
    .ix-other{flex-wrap:wrap;}
    /*同樂優勢*/
    .advantage-info {grid-template-columns: repeat(2,1fr);}
    /*一條龍*/
    .stop-zone{grid-template-columns: repeat(2,1fr);}
}
@media screen and (max-width:1024px) {
    /*主選單*/
    .menu-btn{display:block;background:inherit;padding: 10px;box-shadow: none;border: 1px solid #004789;}
    .menu-btn .line{display: block;width: 25px;height:1px;background: #004789;}
    .menu-btn .line:nth-child(2){margin:10px 0}
    .menu-list ul li:hover:before{display:none;}
    .menu-outer{display:none;position:absolute;top: 80px;left: 0;width: 100%;background: #e9e9e9;flex-wrap: wrap;z-index: 99;}
    .menu-list{width:100%;}
    .menu-list ul{flex-wrap:wrap;justify-content: center;}
    .menu-list ul li{width:100%;text-align: center;padding: 15px 0;border-bottom: 1px solid #e2e2e2;}
    .menu-list ul li a{justify-content:center;}
    .menu-drop{position:relative;top:10px;width: 100%;}
    .menu-lang ul li a{justify-content:center;}
    .menu-lang{text-align:center;background: #004789;}
    .menu-lang select{background:#004789;color:#fff;}
}

@media screen and (max-width:996px) {
    .ix-slogan h2{font-size:1.6rem;width: auto;}
    .ix-slogan p{font-size:1rem;width: 100%;margin-left: 0;}
    .ix-slogan{/* position:relative; *//* background: #211a61; *//* width: 100%; */left: 0;padding: 20px;flex-wrap: wrap;}
    .ix-banner.slick-dotted.slick-slider{margin-top:108px}
    .block{height:108px}
    .menu{justify-content:inherit}
    /*主選單*/
    header .menu a img,header.fixed .menu a img{max-width:50px;}
    .quick-list {display: grid;grid-template-columns: repeat(2,1fr);}
    /*quick-link*/
    .quick-link{padding:20px 0}
    /*首頁-新聞*/
    .ix-news{padding: 20px 30px;}
    .ix-news-slide a{flex-wrap:wrap;}
    /*產品*/
    .sidebar{float:inherit;width:100%;top: 95px;}
    .pdt-zone{width:100%;padding-left:0;margin-top:30px;}
    .banner-word{position:relative;background: #004789;left: 0;padding: 20px;text-align: center;}
    .banner-word h2{font-size:1rem}
    .banner-word h3{font-size:1.2rem}
    .banner-word h2:before{left:50%;transform:translateX(-50%)}
    .sidebar+.pdt-zone{width: 100%;padding-left: 0;}
    /*factories + certification*/
    .pro_box {display: grid;grid-template-columns: repeat(1,1fr);}
    /*clients*/
    .clients-zone {grid-template-columns: repeat(2,1fr);grid-column-gap: 20px;grid-row-gap: 20px;}
    /*頁尾*/
    .ft-info,.ft-btm{flex-wrap:wrap;}
    .ft-left,.ft-right{width:100%}
    .ft-left>a{text-align:center;}
    .ft-right{margin-top:20px;}
    .ft-lang{width: 100%;margin-top: 20px;}
    .ft-lang ul{justify-content:center;}
}
@media screen and (max-width:768px) {
    /*首頁*/
    .quick-list {display: grid;grid-template-columns: repeat(1,1fr);}
    .pdt-all {display: grid;grid-template-columns: repeat(2,1fr);}
    /*產品*/
    .pdt-page { margin: 0;}
    /*一條龍*/
    .stop-zone{grid-template-columns: repeat(1,1fr);}
    
    /*Milestone
    .milestone-zone:before{left:0;transform:translateX(0)}
    .milestone-box{width:100%}
    .milestone-box:nth-child(even){flex-direction:row;padding-right: 0;padding-left: 40px;text-align: left;}
    .milestone-box:nth-child(even) .mile-info{padding-left:30px;padding-right:0;}
    .milestone-box:nth-child(even):before{right:inherit;left:-5px;}
    .milestone-box:nth-child(even):after{right:inherit;left:-5px;}
    */
}

@media screen and (max-width:640px) {
    /*主選單*/
    header{padding:0;z-index: 99;}
    .pdt-all {display: grid;grid-template-columns: repeat(1,1fr);}
    .banner-page,.banner-word,.banner-word h2{position:inherit;position: relative;}
    .banner-page{margin-top:88px}
    .ix-banner.slick-dotted.slick-slider{margin-top:88px}
    .block{height:88px}
    /*banner*/
    .ix-banner .slick-slide figure{position: inherit;top: 0;left: 0;transform: translate(0,0);min-width: 100%;}
    .ix-banner .slick-slide img{height:inherit;position: inherit;}
    .ix-banner .slick-slide{height:inherit}
    .ix-slogan{/* position:inherit; */}
    
    /*milestone*/
    .mile-icon{/* width:70px; */align-items: center;}
    .mile-icon figure{width:75px;height:75px}
    .mile-icon img{max-width: 35px;}
    .mile-info{width: 100%;}
    .milestone-box{flex-wrap:wrap;}
    .mile-right{width:100%}
    /*同樂優勢*/
    .advantage-info {grid-template-columns: repeat(1,1fr);}
    /*新聞*/
    .news-zone{    grid-template-columns: repeat(1,1fr);}
    /*聯絡我們*/
    .map-zone {grid-template-columns: repeat(1,1fr);}
    .contact-link{top:80px;padding: 15px 0;}
    /*頁尾*/
    .ft-right ul{flex-wrap:wrap}
    .ft-right ul li{margin-right:0;}
}
@media screen and (max-width:480px){
    .ix-banner .slick-slide .banner-pc-pic{display: none;}
}
