@font-face {
   font-family:"Source Han Sans CN Normal";
   src: url("/assets/webfonts/SourceHanSansCN-Normal.otf");
   }

body{font-weight: 500;font-family:"Source Han Sans CN Normal";}
.logo_div{position:absolute;z-index: 99;}
.logo_div a{border-bottom: 0px;}
.logo_div img{height: 60px;margin:8px 0px 0px 8px;border-radius: 5px;}

.lang_select_div{
   position:absolute;
   z-index: 99999;
   width:100px;
   height: 40px;
   top: 21px;
   right: 10px;
   text-align: right;
}
.lang_select_div #lang_select{
  
   width:100px;
   height: 35px;
   color:#4C516A;
   background-color:#F2F4F9;
   text-align: center;
   border: 2px solid #FFF;
   margin: 0px;
   font-size: 15px;
   line-height: 30px;
   /* border-radius: 0px 0px 0px 10px ; */
   border-radius: 10px ;
   box-shadow: 3px 3px 10px rgb(90, 90, 90);
}

.lang_select_div #lang_select option{
  
  width:100px;
  height: 40px;
  background-color:#F2F4F9;
}
#nav li:hover{
   background-color: #FFF;
   color: rgb(90, 90, 90);
}
/* 小項目控制 */
.red{color:red;font-weight: bold;}
.red2{color:#a72b28;font-weight: bold;}
.blue{color:#0000FF;font-weight: bold;}
.button-div{margin:40px 0px ;}
.center{text-align: center;}
.right{text-align: right;}
.left{text-align: left;}
.b{font-weight: bold;}
.width-100{width:100%}
.v-top{line-height: 40px;vertical-align: top;}
.bar{border-bottom: #e2e2e2 1px solid;}
.ul-20vw{padding:0px 25vw}



/* 上海墨斗威漾列車 */
.pd_train{margin-top: 40px;}
.pd_train_1{height: 150px;display: flex;}
.pd_train_1_left{flex-grow: 0;flex-shrink: 0;flex-basis: 385px;background-image: url(https://moodle.sh.cn/images/pb_train/pbtrain_01.png);width:385px;height: 150px;background-repeat: no-repeat;}
.pd_train_1_center{flex-grow: 1;flex-shrink: 1;flex-basis: 0%;background-image: url(https://moodle.sh.cn/images/pb_train/pbtrain_02.png);height: 150px;}
.pd_train_1_right{flex-grow: 0;flex-shrink: 0;flex-basis: 385px;background-image: url(https://moodle.sh.cn/images/pb_train/pbtrain_01r.png);width:385px;height: 150px;background-repeat: no-repeat;}

.pd_train_2{height: 315px;display: flex;}
.pd_train_2_left{flex-grow: 0;flex-shrink: 0;flex-basis: 230px;background-image: url(https://moodle.sh.cn/images/pb_train/pbtrain_04.png);width:230px;height: 315px;background-repeat: no-repeat;}
.pd_train_2_center{flex-grow: 0;flex-shrink: 0;height: 315px;width:calc(100% - 460px);}
.pd_train_2_right{flex-grow: 0;flex-shrink: 0;flex-basis: 230px;background-image: url(https://moodle.sh.cn/images/pb_train/pbtrain_04r.png);width:230px;height: 315px;background-repeat: no-repeat;}

/* .pd_train_2{height: 315px;}
.pd_train_2_left{float: left;background-image: url(/images/pb_train/pbtrain_04.png);width:230px;height: 315px;background-repeat: no-repeat;}
.pd_train_2_center{float: left;height: 315px;width:calc(100% - 460px);}
.pd_train_2_right{float: right;background-image: url(/images/pb_train/pbtrain_04r.png);width:230px;height: 315px;background-repeat: no-repeat;} */

.pd_train_3{height: 135px;display: flex;}
.pd_train_3_left{flex-grow: 0;flex-shrink: 0;flex-basis: 410px;background-image: url(https://moodle.sh.cn/images/pb_train/pbtrain_06.png);width:410px;height: 135px;background-repeat: no-repeat;}
.pd_train_3_center{flex-grow: 1;flex-shrink: 1;flex-basis: 0%;background-image: url(https://moodle.sh.cn/images/pb_train/pbtrain_07.png);height: 135px;}
.pd_train_3_right{flex-grow: 0;flex-shrink: 0;flex-basis: 410px;background-image: url(https://moodle.sh.cn/images/pb_train/pbtrain_06r.png);width:410px;height: 135px;background-repeat: no-repeat;}

.min-train{display:none}

.pd_train table{margin: 0px;}
.pd_train .carousel_text{ 
   font-size: 1rem;
   padding: 0px;margin: 0px;
   display: -webkit-box;   /**/
   -webkit-line-clamp: 1;   /**/
   -webkit-box-orient: vertical;   /**/
   overflow: hidden;   /**/
   text-overflow: ellipsis;   /**/}


/* Back to Top */
#backtotop{z-index:9999; display:inline-block; position:fixed; visibility:hidden; bottom:100px; right:20px; width:36px; height:36px; line-height:36px; font-size:16px; text-align:center; opacity:.2;}
#backtotop i{display:block; width:100%; height:100%; line-height:inherit;}
#backtotop.visible{visibility:visible; opacity:.5;}
#backtotop:hover{opacity:1;}
#backtotop{color:#FFFFFF; background-color:#7a7e96;}

/* top banner */
.top-banner{height:400px;background-size: cover;background-position: center center;}

/* movie */
.index-movie video{width: 100%;}
/* nav */
#header nav{background-color: #4C516A;}

/* footer */
#footer{background-color: #4C516A;}
.copyright li{color:#e4f2fabf;padding-top: 10px;}



/* Banner */
.slideshow {
   position:relative;
   margin: auto;
   padding:0px;
   overflow: hidden;
   height: 30vw;
   width: 100%;
}
.slideshow img {
   width: 100%;
   
   position: absolute;
   top: 0;
   left: 50%;
   transform: translateX(-50%);
   display: none;
}
.index_protext{
   
   display: -webkit-box;   /**/
   -webkit-line-clamp: 3;   /**/
   -webkit-box-orient: vertical;   /**/
   overflow: hidden;   /**/
   text-overflow: ellipsis;   /**/
}
.pro{text-align: center;}
/* .pro_page, .pro_page p{word-wrap:break-word;word-break:break-all;}  */
.product {margin-top:50px}
.subtitle{text-align: center;}
.contentTitle{border-bottom: 1px solid #b9b9b9;font-size: 1.5em;line-height: 40px;padding: 50px 0px 20px 0px;font-weight: bold;text-align: center;}

.newsPosbossContent{text-align: center;}
.newsPosbossContent img{max-width: 100%;height: auto;}

#header{padding: 0px;}
.img-max{width: 100%;}

/* 首頁下方的youtube */
.index-youtube{position: relative;width: 100%;height: 0;padding-bottom: 56.25%;margin-top: 30px;}
.index-youtube iframe{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}


/* 我們的客戶陳列方式 */
.client{display: flex;flex-wrap:wrap;padding:40px 0px ;flex-direction:row;justify-content:center}
.client div{margin:10px 20px;}
.client a {border:0}

/* 取消掉所有的a有底線 */

a {border-bottom: 0px;}

/* 最新活動的部份 */
/* .aboutPosbossContent table td ,.aboutPosbossContent table td a{font-weight: bold;} */
.atv-stone-year{width: 80px;height: 80px;text-align: center;vertical-align: middle;border-radius: 50%;background-color: #4C516A;color: #e2e2e2;line-height: 80px;margin-bottom: 40px;font-size: 1.5rem;}
.atv-arrow{width:80px;text-align: center;height:60px;padding:0px;font-weight: bold;color: #011da8;font-size: 1.8rem;padding:23px 0px 0px 0px !important}
.atv-stone{width:60px;text-align: center;vertical-align: middle;height:60px;padding:0px;}
.atv-date{width:60px;text-align: left;vertical-align:middle;padding:0px 0px 0px 0px !important;}
.atv-text{text-align: left;vertical-align:middle;padding: 20px;padding:0px 0px 0px 10px !important;}

.activity-table tr:hover{background-color: #9599b1;}
.activity-table a:hover{font-weight: bold;text-decoration: underline;}
.activity-table td{border: 0px solid #b9b9b9;}

.activity-table tr:nth-child(even) {background:rgb(238, 238, 238, 0.5)}
.activity-table tr:nth-child(odd) {background:rgba(255, 255, 255, 0.5) }

.aboutPosbossContent{padding: 0px 10vw;}
.newsPosbossContent img{margin-bottom: 5px;}

.back-button {padding-top: 20px;border-top: 1px solid #b9b9b9;margin-top: 80px;text-align: center;}


/* 產品教學按鈕 */
.teach-play{width: 1.4rem;vertical-align: text-top;}


/* 最新消息的前後則button */
#button-0{
   display:inline-block;
   width: 0;
   height: 0;
   border: 20px solid;
   border-color: transparent #4C516A transparent transparent;
   vertical-align:top;
   margin:  10px 20px 0px 0px;
}

#button-0:hover{
   border-color: transparent #2682fa transparent transparent;
}

#button-1{
   display:inline-block;
   width: 0;
   height: 0;
   border: 20px solid;
   border-color: transparent transparent transparent #4C516A;
   vertical-align:top;
   margin:  10px 0px 0px 20px;
}
#button-1:hover{
   border-color: transparent transparent transparent #2682fa;
}

#contentTitle{width:100%;height:40px;text-align:center;background-color:#535353;color:#FFF;font-size:16px;line-height:40px;font-weight:bold;}

/* footer social icons 設定 */
ul.icons{background-color: #ececec;}
ul.icons a:hover{background-color: #ffffff;}
.icon.brands.fa-line{color:#09a54a}
.icon.brands.fa-weixin{color:#2dc100}
.icon.brands.fa-tiktok{color:#1e3050}
.icon.brands.fa-line:hover{color:#06c755}
.icon.brands.fa-facebook{color:#106adf}
.icon.brands.fa-facebook:hover{color:#1876f2}
.icon.brands.fab.fa-youtube{color:#e60202}
.icon.brands.fab.fa-youtube:hover{color:#ff0000}
.icon.brands.fa-phone{color:#09a54a}

.tweet a .timestamp:hover{color:#fff}


/* LINE 浮動 QR-code  */
.line-button{margin-left:-55px;padding:0px 8px;font-size: 16px;color: #FFF;background-color: #2dc100;border-radius: 5px 0px 0px 5px;}
.line-button img{width:40px;vertical-align:middle}
.line-button a:hover{color:yellow}
.right-qrcode{position: fixed;top: 120px; right: -200px;padding: 0px 0px 0px 0px;width: 200px;opacity:1;z-index: 9999;}
.right-qrcode .line-qrcode{margin: 10px 0px 0px 0px;width:95%;border: 5px solid #66b395;border-radius: 10px;background-color:#FFFFFF}
.right-qrcode p{text-align: center;font-size: 0.5rem;}
.right-qrcode:hover{transition: 0.5s; transform: translateX(-200px);opacity:1}


@media (max-width: 1280px) {
   .logo_div img{height: 55px;margin:7px 0px 0px 7px;border-radius: 5px;}
   .lang_select_div{
      position:absolute;
      width:100px;
      height: 20px;
      top: 20px;
      right: 10px;
      text-align: right;
   }
   .lang_select_div #lang_select{
  
      width:80px;
      height: 30px;
      color:#4C516A;
      background-color:#F2F4F9;
      text-align: center;
      border: 2px solid #FFF;
      margin: 0px;
      font-size: 12px;
      line-height: 26px;
      /* border-radius: 0px 0px 0px 10px ; */
      border-radius: 10px ;
   }

   #button-0{
      border: 15px solid;
      border-color: transparent #4C516A transparent transparent;
      margin:  8px 15px 0px 0px;
   }
   
   
   
   #button-1{
      border: 15px solid;
      border-color: transparent transparent transparent #4C516A;
      margin:  8px 0px 0px 15px;
   }
   


}

@media (max-width: 1100px) {
   .logo_div{position: relative;text-align: center;background-color: #FFF;padding:20px}
   .logo_div img{height: 60px;margin:7px 0px 0px 7px;border-radius: 5px;}
   .lang_select_div #lang_select{box-shadow: 3px 3px 5px rgb(192, 191, 191);}
}

@media (max-width: 840px) {
   
   /* .logo_div img{display:none } */
   .form_submit input{padding: 10px 0px;}
   .client{display: flex;flex-wrap:wrap;padding:40px 0px ;flex-direction:row;justify-content:center}
   .client div{margin:5px 5px; width:45%}
   .client img{margin:5px 5px; width:100%}
   
   /* top banner */
   .top-banner{height:250px;}

   .aboutPosbossContent{padding: 0px;}

   
}

@media (max-width: 736px) {
   /* 手機版時最新消息沒有前後頁 */
   #button-0,#button-1{display:none}
   .ul-20vw{padding:0px 0px 0px 20px}
}

@media (max-width: 640px) {
   
   .pd_train{display:none}
   .min-train{display:inline}
}