.consultants ul,.consultants li{
    padding: 0;
    margin: 0;
    list-style: none;
}
.consultants ul{
    display: flex;
    flex-wrap: wrap;
    margin-right: 0%;
    margin-left: 0%;
}
.consultants ul li{
    width: 32.33333%;
    margin: 0px 0.5% 1% 0.5%;
}
.consultants ul li:nth-child(1) .consultantTxtbox .name,
.consultants ul li:nth-child(1) .consultantTxtbox .jobTitle,
.consultants ul li:nth-child(5) .consultantTxtbox .name,
.consultants ul li:nth-child(5) .consultantTxtbox .jobTitle,
.consultants ul li:nth-child(6) .consultantTxtbox .name,
.consultants ul li:nth-child(6) .consultantTxtbox .jobTitle{
    color: #2e2108;
}
/*針寸深色背景*/
.consultants ul li:nth-child(3) .consultantTxtbox .name,
.consultants ul li:nth-child(3) .consultantTxtbox .article,
.consultants ul li:nth-child(3) .consultantTxtbox .jobTitle{
    color: #fff;
}
.consultants .consultant{
    position: relative;
}
.consultants .consultant picture{
    position: relative;
    display: block;
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    z-index: 2;
    overflow: hidden;
}
.consultants li:hover .consultant picture{
    transform: scale(1.05);
    opacity: .9;
    transition: all ease-out .5s;
}
.consultant img{
    position: absolute;
    top: 50%;
    right: 0;
    left: 50%;
    bottom: 0;
    width: 100%;
    height: auto;
    border: 0;
    transform: translate(-50%, -50%);
}
.consultant{
    position: relative;
    display: block;
    height: 0;
    padding: 0;
    overflow: hidden;
    padding-bottom: 100%;
    background: #CCC;
    font-size: 1em;
}
.consultantTxtbox{
    position: absolute;
    padding: 40px 35px;
    top: 0;
    z-index: 4;
}
.consultant_companyInfor{
    margin-left: 15px;
    display: block;
    margin-bottom: 24px;
    position: relative;
   /*  min-height: 120px; */
   border-left: 6px solid #bd9e81;
   padding-left: 10px;
}
/* .consultant_companyInfor::before{
    content: "";
    display: inline-block;
    width: 6px;
    height: 110px;
    background: #bd9e81;
    position: absolute;
    bottom: 6px;
    left: -15px;
} */
.consultantTxtbox .name,
.consultant_companyInfor .consultant_name{
    font-size: 2.6em;
    font-weight: 600;
    color: #543f19;
}
.consultantTxtbox .jobTitle,
.consultant_companyInfor .consultant_jobTitle{
    font-size: 1.2em;
    color: #543f19;
}
.consultantTxtbox .article{
    width: 43%;
    margin-top: 26px;
    font-size: 1.1em;
    color: #000;
}
.consultantTxtbox .title{
    font-size: 1.5em;
    margin-bottom: 4px;
    font-weight: 600;
}
.boss .consultantTxtbox .title{
    font-size: 1.7em;
}
.boss .consultantTxtbox .title-s{
    font-size: 1.5em;
}
.consultantTxtbox .title-s{
    font-size: 1.1em;
    margin-bottom: 20px;
    font-weight: 500;
}
.consultantTxtbox .text{
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.consultantTxtbox .article{
    position: relative;
    padding-bottom: 60px;
}
.boss .consultantTxtbox .article{
    position: relative;
    padding-bottom: 60px;
}
.consultant .moreBtn{
    position: absolute;
    bottom: 10px;
    left: -1px;
}
.consultant .moreBtn{
    padding: 6px 0px 6px 18px;
    background-color: #bb9d7e;
    color: #fff;
    display: inline-flex;
    align-items: center;
    font-size: 0.8em;
}
.consultant .moreBtn:hover{
    background-color: #9b7956;
}
.videoBox .icon_video,
.researcvideoBox .icon_video{
    background: url(../images/icon/icon_Youtube.svg) center center no-repeat;
    background-size: 100%;
} 
a.icon_video{
    display: inline-block;
    width: 48px;
    height: 48px;
    margin: 4px 1px;
    text-indent: 100%;
    white-space: nowrap;
}
/*跳出的畫面*/
.videoBox .icon_video ,
.researcvideoBox .icon_video {
  position: relative;
  display: inline-block;
  width: 48px;
  height: 48px;
  margin: 4px 1px;
  background: url(../images/icon/icon_Youtube.svg) center center no-repeat;
  background-size: 100%;
  text-indent: 100%;
  white-space: nowrap;
  cursor: pointer;
}

.videoBox .icon_video:hover {
 /*  opacity: 0.8; */
}

.icon_video .video_thumbnail{
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(-143px);
    width: 81px;
    height: 142px;
  object-fit: cover;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease, transform 0.3s ease;
  border-radius: 10px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);
  z-index: 10;
}
.researchsList .icon_video .video_thumbnail {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-143px);
    width: 81px;
    height: 142px;
  object-fit: cover;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease, transform 0.3s ease;
  border-radius: 10px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);
  z-index: 10;
}
.icon_video:hover .video_thumbnail {
  opacity: 1;
  transform: translateX(-50%) translateY(-173px); /* 往上浮一點 */
}
/*針對booss的高度調整*/
.boss{
    margin: 1% 0;
}
.boss .consultant{
    padding-bottom: 32.3333%;
}
/*深色背景　白色文字*/
/* .boss .consultantTxtbox .name,.boss .consultantTxtbox .jobTitle,.boss .consultantTxtbox  .article{
    color: #000;
} */
.boss .consultantTxtbox  .article{
    width: 68%;
    font-size: 1.2em;
}
/*特別尺寸*/
@media (max-width: 1600px) and (min-width: 1440px) {
    .consultant{
        font-size: .9em;
    }
    .consultantTxtbox{
        padding: 30px;
    }
    .consultantTxtbox .article{
        width: 45%;
        margin-top: 15px;
    }
    .consultantTxtbox .title-s{
        margin-bottom: 10px;
    }
}
/*特別尺寸*/
@media (max-width: 1440px) and  (min-width: 1240px){
    .consultant{
        font-size: .8em;
    }
    .consultantTxtbox{
        padding: 20px;
    }
    .consultantTxtbox .name{
        font-size: 2.3em;
    }
    .consultantTxtbox .article{
        margin-top: 0px;
        width: 45%;
        font-size: .95em;
    }
}
@media (max-width: 1240px){
    .consultants ul li{
        width: 49%;
    }
    .consultantTxtbox{
        padding: 30px;
    }
    .bossImg{
        background: url(../images/demo/boss2.jpg) 100% no-repeat;
    }
    .boss .consultant{
        padding-bottom: 62.666%;　/*配合下方二個排列的高度*/
    }
    .consultantTxtbox .title-s{
        margin-bottom: 10px;
    }
    .consultantTxtbox .article{
        width: 45%;
        margin-top: 16px;
    }
    .consultantTxtbox .title{
        font-size: 1.3em;
    }
}
/*特別尺寸*/
@media (max-width: 1000px) and  (min-width: 768px){
    .consultant{
        font-size: .85em;
    }
    .consultantTxtbox{
        padding: 25px;
    }
    .consultantTxtbox .article{
        width: 45%;
        padding-bottom: 50px;
        margin-top: 6px;
    }
    .consultantTxtbox .name{
        font-size: 2.5em;
    }
    .boss .consultantTxtbox .title {
        font-size: 1.5em;
    }
    .boss .consultantTxtbox .title-s {
        font-size: 1.1em;
    }
}
/*特別尺寸*/
@media (max-width: 820px) and  (min-width: 768px){
    .videoBox .icon_video,
    .researcvideoBox .icon_video{
        width: 36px;
        height: 36px;
    }
    .consultantTxtbox .text{
        display: none;
    }
}
@media (max-width: 768px){
    .consultants ul li{
        width: 100%;
        margin: 1% 0;
    }
    .boss .consultant{
        padding-bottom: 100%;　/*配合下方一個的高度*/
    }
    .consultantTxtbox .article{
        width: 45%;
    }
    .consultantTxtbox .title {
        font-size: 1.5em;
    }
    .consultantTxtbox .name{
        font-size: 2.8em;
    }
    .boss .consultantTxtbox .title {
        font-size: 1.5em;
    }
    .boss .consultantTxtbox .title-s {
        font-size: 1.1em;
    }
}
@media (max-width: 560px){/*特別尺寸*/
    .consultant{
        font-size: .9em;
    }
    .consultantTxtbox{
        padding: 30px;
    }
    .consultantTxtbox .article{
        width: 45%;
    }
}
@media (max-width: 480px){/*特別尺寸*/
    .consultant{
        font-size: .8em;
    }
    .consultantTxtbox{
        padding: 20px;
        width: 100%;
    }
    .consultantTxtbox .name{
        font-size: 2em;
    }
    .consultantTxtbox .article{
        margin-top: 0px;
        width: 45%;
    }
    .consultantTxtbox .title{
        margin-bottom: 5px;
    }
    .boss .consultantTxtbox .title-s {
        font-size: 1.1em;
    }
    .consultantTxtbox .title{
        padding: 2px;
        font-size: 1.2em;
    }
    .boss .consultantTxtbox .title {
        font-size: 1.2em;
    }
    .consultantTxtbox .title-s{
        font-size: 1.1em;
        margin-bottom: 0;
    }
    .boss .consultantTxtbox .article{
        margin-top: 0px;
    }
    .consultantTxtbox .text{
        display: none;
    }
    .boss .videoBox .icon_video,.videoBox .icon_video,
    .boss .researcvideoBox .icon_video,.researcvideoBox .icon_video{
        width: 36px;
        height: 36px;
        margin: 2px 1px;
    }
    .boss .consultantTxtbox .article{
        padding-bottom: 45px;
    }
}
@media (max-width: 330px){/*特別尺寸*/
    .consultantTxtbox .title-s{
        display: none;
    }
    .boss .videoBox .icon_video,
    .boss .researcvideoBox .icon_video{
        width: 32px;
        height: 32px;
    }
    .boss .consultantTxtbox .title{
        font-size: 1.2em;
    }
}


/******20250328新增研究主題新增大圖文 start******/
.researchersTopic{
    padding: 30px;
    color: #333;
    background:url(../images/demo/bg-graphic-01.png) no-repeat left center #fff;
}
.researchersTopic .title{
    font-size: 2.3em;
    font-weight: 600;
    margin-bottom: 30px;
    color: #333;
    text-align: center;
    position: relative;
}
.researchersTopic .title::before{
    content: "";
    display: inline-block;
    width: 50px;
    height: 6px;
    background: #4a4a4a;
    position: absolute;
    top: -10px;
    left: calc(50% - 25px);
}
.resTopic_content{
    display: flex;
}
.resTopic_contentImg{
    width: 70%;
}
.resTopic_article{
    width: 30%;
    min-width: 440px;
    padding: 0px 30px;
}
.reTopic_articleTitle{
    font-size: 1.8em;
    margin-bottom: 10px;
}
.resTopicbtn{
    margin-top: 30px;
    white-space: nowrap;
    padding: 8px 42px;
    font-size: 1em;
    letter-spacing: 1px;
    color: #bb9d7e;
    border: solid 1px #bb9d7e;
    background-image: -webkit-gradient(linear, right top, left top, from(#fff), color-stop(50%, #fff), color-stop(50%, #bb9d7e), to(#8a6a4a));
    background-image: linear-gradient(to left, #fff, #fff 50%, #bb9d7e 50%, #8a6a4a);
    background-size: 200% 100%;
    background-position: right;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    display: inline-block;
}
.consultants .resTopicbtn{
    margin-top: 8px;
    padding: 4px 22px;
}
.resTopicbtn:hover{
    background-image: -webkit-gradient(linear, right top, left top, from(#fff), color-stop(50%, #fff), color-stop(50%, #bb9d7e), to(#8a6a4a));
    background-image: linear-gradient(to left, #fff, #fff 50%, #bb9d7e 50%, #8a6a4a);
    background-size: 200% 100%;
    background-position: left;
    color: #fff;
}
.researchersTopic .moreBox{
    margin-top: 10px;
}
@media (max-width: 1240px){
    .resTopic_content {
        display: flex;
        flex-direction: column;
    }
    .resTopic_contentImg{
        width: 100%;
    }
    .resTopic_article{
        width: 100%;
        min-width: unset;
        padding: 10px 0;
    }
}

/******20250328新增研究人員區 start******/
ul.researchsList,ul.researchsList li{
    list-style: none;
}
ul.researchsList{
    display: flex;
    flex-wrap: wrap;
}
.researchsList li{
    position: relative;
}
.researchsList .researcvideoBox{
    position: absolute;
    z-index: 9;
    bottom: 15px;
    right: 22px;
}
.researchsList li{
    width: 25%;
}
.researchImg{
    position: relative;
}
.researchsList .companyInfor,
.researchsContent .companyInfor,
.engineeringContent .companyInfor{
    position: absolute;
    bottom: 0;
    width: 100%;
    color: #fff;
    padding: 30px;
    z-index: 4;
    min-height: 137px;
}
.researchsList .companyInfor .name,
.researchsContent .companyInfor .name,
.engineeringContent .companyInfor .name{
    font-size: 1.2em;
    font-weight: 600;
    color: #fff;
}
.researchsList .article{
    padding: 30px 30px 45px 30px;
    min-height: 228px;
}
.researchsList .article .text{
    display:inline-block;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 7;
    overflow: hidden;
}
picture{
    position: relative;
    display: block;
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    z-index: 2;
    overflow: hidden;
}
picture img{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: opacity .6s ease;
    overflow: hidden;
    font-size: 0;
    pointer-events: none;
}
picture img.border1{
    border-top-left-radius: 300px;
}
.researchsList li:hover picture img{
    transform: scale(1.2);
    opacity: .9;
    transition: all ease-out .5s;
}
.researchsList li .companyInfor,
.researchsContent .companyInfor{
    background-image: -webkit-gradient(linear, right top, left top, from(#a06058), color-stop(50%, #fff), color-stop(50%, #daa59ecb), to(#a06058));
    background-image: linear-gradient(to left, #daa59e96, #a06058a8 50%, #c78a82cb 50%, #a06058);
    background-size: 200% 100%;
    background-position: right;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}
.researchsList li .article,
.consultant{
    position: relative;
}
.researchsList li .box_more ,
.consultants li .box_more,
.consultant .box_more
{
    font-size: 0.8em;
    position: absolute;
    bottom: 10px;
    right: 30px;
}
.consultants li .box_more,
.consultants .box_more{
    z-index: 4;
}
.researchImg_icon{
    text-align: right;
}
.researchImg_icon a{
    display: inline-block;
    width: 36px; 
    height: 36px;
    margin: 4px 1px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}
.researchImg_icon .icon_fb{
    background: url(../images/icon/icon_fb.svg) center center no-repeat ;
    background-size: 100%;
}
.researchImg_icon .icon_ig{
    background: url(../images/icon/icon_Instagram.svg) center center no-repeat ;
    background-size: 100%;
}
.researchImg_icon a:hover {
    opacity: 0.8;
}
/* .consultants li .box_more{
    position: unset;
}
.researchsList li:hover .box_more{
    color: #daa59e96;
}
.consultants li:hover .box_more{
    color: #000;
}
.consultants li:nth-child(3) .box_more{
    color: #fff;
} */
.researchsList li:hover .companyInfor{
    background-image: -webkit-gradient(linear, right top, left top, from(#a06058), color-stop(50%, #fff), color-stop(50%, #daa59ecb), to(#a06058));
    background-image: linear-gradient(to left, #daa59e96, #a06058a8 50%, #c78a82cb 50%, #a06058);
    background-size: 200% 100%;
    background-position: left;
}
.researchsList li:nth-child(even){
    background: #f5f5f5;
}
.researchsList li:hover{
    background: #fff;
}
/*遮罩 + 動畫 +文字置中*/

/*右下角浮出效果*/
.floating-player {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 360px;
    height: 640px;
    background: black;
    box-shadow: 0 0 20px rgba(0,0,0,0.5);
    z-index: 9999;
    border-radius: 16px;
    overflow: hidden;
    transition: opacity 0.3s ease;
}
.floating-player.hidden {
    display: none;
}
.player-content {
    position: relative;
    width: 100%;
    height: 100%;
}
.floating-player iframe {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 16px;
}
.close-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    background: rgba(0,0,0,0.7);
    color: white;
    border: none;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    cursor: pointer;
    font-size: 16px;
    line-height: 28px;
}
/*右下角浮出效果*/
#bossFloatingPlayer {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 360px;
  max-width: 90%;
  background: #fff;
  box-shadow: 0 5px 20px rgba(0,0,0,0.2);
  border-radius: 8px;
  overflow: hidden;
  z-index: 1000;

  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.3s ease, transform 0.3s ease;
  pointer-events: none;
}

#bossFloatingPlayer iframe {
  width: 100%;
  height: 200px;
  display: block;
  border: none;
}

#bossFloatingPlayer.show {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

#bossFloatingPlayer button {
  position: absolute;
  top: 5px;
  right: 5px;
  background: #000;
  color: #fff;
  border: none;
  border-radius: 50%;
  width: 28px;
  height: 28px;
  font-size: 16px;
  cursor: pointer;
  z-index: 10;
}

/* optional: hidden class to start with */
#bossFloatingPlayer.hidden {
  display: none;
}
.VideoZone p{
    width: 100%;
    margin: 60px 15px 0px 0px;
    text-align: center;
    padding: 1px 15px;
    font-size: 2.5em;
    font-weight: 600;
    color: #543f19;
    background: linear-gradient(to left, #c0c0c069, rgba(255, 255, 255, 0));
}
.VideoZone p span{
    font-weight: 300;
    font-size: .5em;
    display: inline-block;

}
@media (max-width: 1440px) and  (min-width: 1240px){
    .researchsList li{
        width: 33.33333%;
    }
}
@media (max-width: 1240px) {
    .researchsList li{
        width: 50%;
    }
}
@media (max-width: 768px) {
    .researchsList li{
        width: 100%;
    }

}

/******20250328新增研究人員＿content start******/
.researchsContent{
    display: block;
    background: url(../images/demo/bg-graphic-03.jpg) no-repeat top center #fff;
    background-size: 100%;
    position: relative;
}
.researchsContent::before,
.engineeringContent::before{
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    background: linear-gradient(rgba(226, 226, 226, 0.01), rgb(236, 236, 236));
    width: 100%;
    height: 200px;
}
.researchsContent .webWrap{
    display: flex; 
    flex-direction: row;
}
.researchsContent .researchImg{
    width: 45%;
    min-width: 400px;
    min-height: 700px;
    position: relative;
    padding-left: 120px;
}
.researchsContent .companyInfor{
    position: absolute;
    bottom: 0;
}
.researchsContent .article{
    width: 65%;
    padding: 0px 20px 10px 20px;
    margin: 0px 1%;
    color: #5c5b56;
    z-index: 1;
}
.researchsContent picture{
    min-width: 400px;
}
.researchsContent .text{
    position: relative;
    padding-left: 15px;
}
.researchsContent .consultant_article .text{
    font-size: 1.05em;
}
.researchsContent .consultant_article .Sub-title,.article_Title,
.engineeringContent .consultant_article .Sub-title,.article_Title{

    font-size: 2em;
    margin-bottom: 0px;
    font-weight: 700;
    color: #363636;
}
.researchsContent .consultant_article .Sub-title-s,
.engineeringContent .consultant_article .Sub-title-s{
    font-size: 1.5em;
    margin-bottom: 20px;
    font-weight: 400;
    color: #363636;
}
.researchsContent .text::before,
.engineeringContent .text::before{
    content: "";
    display: inline-block;
    width: 6px;
    height: 25px;
    background: #bd9e81;
    position: absolute;
    top: 5px;
    left: 0px;
}
.researchsContent .consultant_article .text::before,
.engineeringContent .consultant_article .text::before{
    display: none;
}
.researchsContent .path,
.engineeringContent .path{
    display: block;
    margin-bottom: 16px;
}
.videoCard{
    margin-top: 30px;
    position: absolute;
    /* border: 6px solid #f1f1f1; */
    display: inline-block;
    top: 450px;
    left: 31px;
    z-index: 10;
    width: 270px;
}
.StaffVideoCard{
    position: absolute;
    /* border: 6px solid #f1f1f1; */
    display: inline-block;
    top: 503px;
    right: 31px;
    z-index: 10;
    width: 270px;
}
.pos2{
    margin-top: 30px;
    position: absolute;
    /* border: 6px solid #f1f1f1; */
    display: inline-block;
    top: 450px;
    left: 320px;
    z-index: 10;
    width: 270px;
}
.videoCard picture,
.StaffVideoCard picture{
    width: 100%;
    min-width: unset;
    padding-bottom: 58%;
    cursor: pointer;
}
.videoCard picture img,
.StaffVideoCard picture img{
    border: 6px solid #f1f1f1;
   /*  width: 32%; */
   width: 100%;
}
.researchsContent .backWrap{
    display: flex;
    justify-content: flex-end;
}
.backWrap{
    position:relative;
    /* z-index: 10; */
    padding: 10px 0px;
}
.bossVideoList.grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 預設桌機四欄 */
  gap: 15px;
  margin: 0 auto;
  padding: 20px;
}
.bossVideoList.grid .VideoItem:last-child{
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-column: 3 / span 2;
    -ms-grid-row: 1;
    -ms-grid-row-span: 2;
    grid-row: 2 / span 2;
}
.VideoItem{
    visibility: visible;
    -webkit-transform: translateY(0) scale(1);
    opacity: 1;
    transform: translateY(0) scale(1);
    opacity: 1;
    -webkit-transition: all, -webkit-transform 0.8s linear 0s, opacity 0.8s linear 0s;
    transition: all, transform 0.8s linear 0s, opacity 0.8s linear 0s;
    overflow: hidden;
    position: relative;
    height: 100%;
}
.bossVideoList .Txt{
    z-index: 2;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 100%;
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #bb9c7ec0;
    font-family: "Noto Sans TC", "Microsoft JhengHei", sans-serif;
    padding: 48px 40px 43px 40px;
    text-align: left;
    opacity: 0;
    pointer-events: none;
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
    color: #fff;
}
.bossVideoList .VideoItem:hover .Txt{
        opacity: 1;
        pointer-events: auto;
        -webkit-transform: translateY(0);
       transition: transform 1s ease; /* 慢慢變化 */
       transform: translateY(0px); /* 向上移動 */
       cursor: pointer;
       font-size: 1.2em;
}
.bossVideo{
    background: url(../images/bg/community_bg.jpg) repeat-y  center top ;
    background-size: 100%;
    position: relative;
    padding: 130px 0;
    z-index: 2;
}
.arrow img {
    animation: smooth-shake 1.2s ease-in-out infinite;
}

@keyframes smooth-shake {
    0%, 100% {
        transform: translateX(0);
    }
    20% {
        transform: translateX(-4px);
    }
    50% {
        transform: translateX(4px);
    }
    80% {
        transform: translateX(-2px);
    }
}
.bossVideo.webWrap{
    /* width: 77%;
    margin: auto; */
}
.researchsContent .researchImg.prl0{
    padding-left: 0px;
}
.Txt .arrow {
    margin-top: 20px;
    width: 35px;
    height: 30px;
}
/*------研究人員上方頁籤-------*/
.submenuStyle2{
    margin-top: 0px;
}
.submenuStyle2 li{
    background-color: #bb9d7e;
    border-radius: 50px;
    margin:15px 8px;
}
.submenuStyle2 li:hover{
    background-color: #005655;
}
.submenuStyle2 li a{
    color: #fff;
}
/*------研究人員內頁-------*/
.researchsContent .researchsContentWrap .knowledge_Staff{
    padding-left: 0px;
}
.article_card{
    background: #fff;
    border: 1px solid #e0e0e0;
    padding:20px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
    display: flex;
    margin-top: 60px;
    margin-bottom: 24px;
}
.article_card .article_Txt{
    width: 60%;
    padding: 0px 8px 0px 16px;
}
.article_card .article_imgBox{
    width: 40%;
    margin-top: -60px;
}
.article_card .article_imgBox.content_c6{
    width: 80%;
}
.article_Title{
    position: relative;
    padding-bottom: 16px;
    margin-bottom: 9px;
    border-bottom: 1px solid #bf9f83;
}
.article_Slogn{
    font-size: 1.1em;
    display: inline-block;
    background: #e5dfcf;
    margin-bottom: 4px;
    font-weight: 400;
    padding: 2px 8px;
    color: #232323d6;
}
.article_Slogn span{
    font-size: .9em;
}
.article_Title::after{
    content: "";
    display: inline-block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100px;
    height: 6px;
    background: #bd9e81;
}
.article_imgBox{
    margin-bottom: 12px;
}
.article_img .box_img{
    border-radius: 8px;
    overflow: hidden;
}
.article_Txt{
    margin-bottom: 30px;
    line-height: 1.8;
    font-size: 1.05em;
}
figcaption{
    color: #9a905e;
    padding: 1px;
}
.article_Title2{
    font-size: 1.6em;
    margin: 10px 0 8px 0;
    font-weight: 600;
    color: #363636;
}
.researchsContent .knowledge_Staff{
    width: 32%;
}
.p-Block{
    display: inline-block;
}
.p-Block .alignleft{    
    float: left;
    margin: 0em 1.5em 1em 0;
    display: table;
    clear: both;
    width: 40%;
}
/*============研究人員列表頁============*/
/*--------研究人員列表頁--------*/
/*20250603 add*/
.knowledgeStaffBlock{
  display: flex;
  background-color: #ffffff;
  padding: 12px 12px;
/*   border: 1px solid #eaeaea; */
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  margin-bottom: 12px;
  position: relative;
  z-index: 1;
}
li .knowledgeStaffBlock{
  border: 1px solid #eaeaea;
  padding: 16px ;
  margin-bottom: 18px;
}
.kSBlock_imgBox{
  width: 31.8888%;
  margin-right: 1%;
}
.kSBlock_arcBox{
  width: 64.6666%;
  margin: 0 1%;
  padding-bottom: 30px;
  position: relative;
}
.knowledgeStafList .kSBlock_imgBox{
  width: 29.8888%;
}
.knowledgeStafList .kSBlock_arcBox{
  width: 66.6666%;
}
.knowledgeStafList li:nth-child(even) .knowledgeStaffBlock{
    flex-direction: row-reverse;
}
.knowledgeStafList li:nth-child(even) .kSBlock_imgBox{
  margin-right: 0%;
  margin-left: 1%;
}
.kSBlock_arcTitle{
  font-size: 2em;
  font-weight: 500;
  margin-bottom: 8px;
  color: #000;
}
.kSBlock_arcTxt{
  color: #3f3e3a;
  line-height: 1.8;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
/* a:hover .kSBlock_arcTxt{
  color: #000000;
} */
.box_morePos{
  position: absolute;
  bottom: 10px;
}
a .box_more{
  color: #000;
  font-size: 0.8em;
}
a:hover .box_more{
    color: #bb9d7e;
}
.kSBlock_type{
  background: #4d3117ad;
  position: absolute;
  top: 0;
  z-index: 1;
  color: #fff;
  padding: 8px 16px;
  line-height: 1.5;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}
a:hover .kSBlock_type{
  background: #93673dad;
}
.knowledgeStafList ul,.knowledgeStafList li{
    list-style: none;
    margin: 0;
    padding: 0;
}
/* .knowledgeStafList li a{
    margin-top: 24px;
} */
.knowledgeStafftBg{
    display: block;
    background: url(../images/demo/bg-graphic-03.jpg) repeat-y top center #fff;
    background-size: 100%;
    position: relative;
}
.knowledgeStafftBg::after{
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    background: linear-gradient(rgba(226, 226, 226, 0.01), rgb(236, 236, 236));
    width: 100%;
    height: 200px;
    background-size: 100%;
}
.kSBlock_arcPeople{
    display: inline-block;
    background: #e5dfcf;
    padding: 2px 8px;
    color: #000000d6;
    font-size: .9em;
}
.backBoxC{
    text-align: center;
}
/* 上邊線 */
.knowledgeStaffBlock::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  height: 1px;
  width: 0;
  background: #97714ead;
  transition: width 0.4s ease;
}
/* 右邊線 */
.knowledgeStaffBlock::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 1px;
  height: 0;
  background: #97714ead;
  transition: height 0.4s ease;
}
/* 下邊線 */
.knowledgeStaffBlock .bottom-line {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  height: 1px;
  width: 0;
  background: #97714ead;
  transition: width 0.4s ease;
}
/* 左邊線 */
.knowledgeStaffBlock .left-line {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 1px;
  height: 0;
  background: #97714ead;
  transition: height 0.4s ease;
}
/* Hover 動畫觸發 */
.knowledgeStaffBlock:hover::before {
  width: 100%;
}
.knowledgeStaffBlock:hover::after {
  height: 100%;
}
.knowledgeStaffBlock:hover .bottom-line {
  width: 100%;
}
.knowledgeStaffBlock:hover .left-line {
  height: 100%;
}



/*============桌面固定、RWD 取消浮動 start============*/
/* .researchsContentWrap {
  display: flex;
  gap: 2rem;
} */

/* 桌面版固定左邊圖片（sticky 效果） */
.researchsContent .researchImg {
  position: sticky;
  top: 120px; /* 可根據需要調整 */
  align-self: flex-start;
}



/* RWD：手機版取消 sticky，改成正常排列 */
@media (max-width: 1024px) {
  .researchsContentWrap {
    display: block;
  }

  .researchsContent .researchImg  {
    position: unset;
    width: 100%;
    margin-bottom: 20px;
  }
}

/******新增工程安全 start******/
.engineeringContent {
    display: block;
    background: url(../images/bg/engineering_bg.jpg) no-repeat bottom right #fff;
    background-size: 90%;
    position: relative;
    padding-bottom: 2em;
}
.engineeringContent .researchImg{
    min-width: 400px;
    min-height: 700px;
    position: relative;
    padding-left: 120px;
}
.engineeringContent .article {
    padding: 0px 20px 10px 20px;
    margin: 0px 1%;
    color: #5c5b56;
    position: relative;
    z-index: 1;
}
.engineeringContent_info{
    display: flex;
    width: 100%;
    flex-direction: column;
}
.eng_infoText{
    /* width: 85%; */
    width: 100%;
    /* margin: 0 auto; */
    height: auto;
    padding: 30px;
    background: #ffffff80;
}
.engineeringImg{
    margin: 10px;
    /* margin-left: 0px; */
    text-align: center;
   /*  display: flex; */
}
.engineeringImg img{
    padding: 4px;
}
.video-containerWrap{
   /*  max-width: 800px; */
    margin: 10px auto;
    text-align: center;
}
.video-container {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 比例 */
}
.video-container .responsive-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
/*============桌面固定、RWD 取消浮動 end============*/
@media (max-width: 1600px) and (min-width: 1440px){
    .researchsContent .researchImg {
        padding-left: 0px;
    }
    .videoCard,
    .StaffVideoCard{
        width: 250px;
        left: 12px;
    }
    .pos2{
        left: 274px;
    }
    .engineeringContent {
        background-size: 90%;
    }
}
@media (max-width: 1440px) {
    .researchsContent .researchImg {
        padding-left: 0px;
    }
    .videoCard,
    .StaffVideoCard{
        position: unset;
        width: 49%;
    }
    .pos2,.videoCard,
    .StaffVideoCard{
        margin-top: 4px;
    }
    .bossVideoList.grid{
        display: grid;
        gap: 15px;
    }
    .bossVideo{
         padding: 80px 0;
    }
    .bossVideoList.grid{
        display: grid;
        grid-template-columns: repeat(3, 1fr); /* 預設桌機四欄 */
        gap: 15px;
        margin: 0 auto;
        padding: 20px;
    }
    .bossVideoList.grid .VideoItem:nth-child(1){
        grid-column:1/ span 1;  /* 從第一欄開始，佔 1 欄 */
        grid-row: 1 / span 1;     /* 從第一列開始，佔 1 列 */
    }
    .bossVideoList.grid .VideoItem:nth-child(2){
        grid-column: 2/ span 1;  /* 從第一欄開始，佔 1 欄 */
        grid-row: 1 / span 1;     /* 從第一列開始，佔 1 列 */
        background-color: #4a4a4a;
    }
    .bossVideoList.grid .VideoItem:nth-child(3){
        grid-column: 3 / span 1;
        grid-row: 1 / span 1;
        background-color: #a12222;
    }
    .bossVideoList.grid .VideoItem:nth-child(4){
        grid-column: 1 / span 1;
        grid-row: 2 / span 1;
        background-color: #84ad11;
    }
    .bossVideoList.grid .VideoItem:nth-child(5){
        grid-column: 2 / span 1;
        grid-row: 2 / span ;
        background-color: #111bad;
    }
    .bossVideoList.grid .VideoItem:nth-child(6){
        grid-column: 3 / span 1;
        grid-row: 2 / span 1;
        background-color: #d11ba3;
    }
    .bossVideoList.grid .VideoItem:nth-child(7){
        grid-column: 1 / span 1;
        grid-row: 3 / span 1;
        background-color: #d14f1b;
    }
    .bossVideoList.grid .VideoItem:nth-child(8){
        grid-column: 2 / span 1;
        grid-row: 3 / span 1;
        background-color: #d14f1b;
    }
    .bossVideoList.grid .VideoItem:nth-child(9){
        grid-column: 3 / span 1;
        grid-row: 3 / span 1;
        background-color: #d14f1b;
    }
    .VideoZone p{
        margin: 30px 15px 0px 0px;
        font-size: 2em;
    }
    .engineeringContent {
        background: url(../images/bg/engineering_bg2.jpg) no-repeat bottom right #fff;
        background-size: 100%;
        padding-bottom: 60px;
    }
    .engineeringContent_info{
        width: 100%;
    }
    .eng_infoText{
        width: 100%;
    }
}
@media (max-width: 1240px) {
    .researchsContentWrap{
        padding: 0px 30px 30px 30px;
    }
    .boss .consultantTxtbox  .article{
        display: -webkit-box;
        -webkit-line-clamp: 10;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .videoCard,
    .StaffVideoCard{
        width: 49.3%;
    }
    picture img.border1{
      border-top-left-radius: 0px;
    }
    .researchsContent .researchImg{
        min-height: unset;
    }
    .researchsContent .researchImg{
        padding:0px 15px;
    }
    .article_card{
        flex-direction: column;
    }
    .article_card .article_imgBox{
        width: 80%;
    }
    .article_card .article_Txt{
        width: 100%;
        padding: 0px 8px 0px 8px;
    }
}
@media (max-width: 1024px) {
    .researchsContent .webWrap{
        flex-direction: column;
    }
    .researchsContent .researchImg{
        width: 50%;
    }
    .researchsContent .article {
        padding: 15px 15px 0px 15px;
        width: 100%;
    }
    .article_card{
        flex-wrap: nowrap;
        flex-direction: row;
    }
    .article_card .article_imgBox,.article_card .article_Txt{
        width: 50%;
    }
    .article_card .article_Txt{
        padding: 0px 8px 0px 16px;
    }
    .kSBlock_arcTitle{
        font-size: 1.8em;
    }
    .kSBlock_arcTxt{
        color: #3f3e3a;
        line-height: 1.8;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
}
@media (max-width: 798px) {
    .researchsContent .researchImg{
        width: 100%;
        min-width: unset;
    }
    .researchsContent picture{
        min-width: unset;
        width: 100%;
    }
    .researchsContent .article{
        padding: 15px 0px 0px 0px;
    }
    .researchsContent .companyInfor{
        padding: 20px;
    }
    .consultant_companyInfor{
        margin-bottom: 8px;
    }
    .bossVideoList.grid{
        display: grid;
        grid-template-columns: repeat(2, 1fr); /* 預設桌機四欄 */
        gap: 15px;
        margin: 0 auto;
        padding: 20px;
    }
    .bossVideoList.grid .VideoItem:nth-child(1){
        grid-column:1/ span 2;  /* 從第一欄開始，佔 2 欄 */
        grid-row: 1 / span 1;     /* 從第一列開始，佔 1 列 */
    }
    .bossVideoList.grid .VideoItem:nth-child(2){
        grid-column: 1/ span 1;  
        grid-row: 2 / span 1;     
        background-color: #4a4a4a;
    }
    .bossVideoList.grid .VideoItem:nth-child(3){
        grid-column: 2 / span 1;
        grid-row: 2 / span 1;
        background-color: #a12222;
    }
    .bossVideoList.grid .VideoItem:nth-child(4){
        grid-column: 1 / span 1;
        grid-row: 3 / span 1;
        background-color: #84ad11;
    }
    .bossVideoList.grid .VideoItem:nth-child(5){
        grid-column: 2 / span 1;
        grid-row: 3 / span ;
        background-color: #111bad;
    }
    .bossVideoList.grid .VideoItem:nth-child(6){
        grid-column: 1 / span 1;
        grid-row: 4 / span 1;
        background-color: #d11ba3;
    }
    .bossVideoList.grid .VideoItem:nth-child(7){
        grid-column: 2 / span 1;
        grid-row: 4 / span 1;
        background-color: #d14f1b;
    }
    .bossVideoList.grid .VideoItem:nth-child(8){
        grid-column: 1 / span 1;
        grid-row: 5 / span 1;
        background-color: #d14f1b;
    }
    .bossVideoList.grid .VideoItem:nth-child(9){
        grid-column: 2 / span 1;
        grid-row: 5 / span 1;
        background-color: #d14f1b;
    }
    .VideoZone p{
        margin: 30px 15px 0px 0px;
        font-size: 2em;
    }
    .bossVideo {
        padding: 40px 0;
    }
    .submenuStyle2 li{
        margin: 8px 8px 2px 8px;
    }
    .submenu li a{
        padding: 6px 16px;
    }
    .article_card{
        flex-direction: column;
    }
    .article_card .article_imgBox,.article_card .article_Txt{
        width: 100%;
        padding: 0px 8px 0px 8px;
    }
    .knowledgeStaffBlock ,.knowledgeStafList li:nth-child(even) .knowledgeStaffBlock{
        flex-direction: column;
    }
    .kSBlock_imgBox,.knowledgeStafList .kSBlock_imgBox{
        width: 100%;
        margin-right: 0%;
    }
    .kSBlock_arcBox,.knowledgeStafList .kSBlock_arcBox{
        width: 100%;
        margin: 0 0%;
        padding-bottom: 30px;
        position: relative;
    }
    .engineeringContent {
        background-size: 160%;
    }
    .video-containerWrap{
        width: 100%;
    }
    .eng_infoText {
        padding: 8px;
        /* background: unset; */
    }
}
/******20250328新增研究人員區 start******/
@media (max-width: 560px) {
    .bossVideoList .Txt{
        padding: 15px;
    }
    .p-Block .alignleft{   
        width: 100%;
    }
    .engineeringImg{
        flex-direction: column;
    }
    .engineeringContent{
        background: unset;
        background-color: #fff;
        padding-bottom: 2em;
    }
}
@media (max-width: 430px) {
    .bossVideoList.grid{
        display: grid;
        grid-template-columns: repeat(1, 1fr); /* 預設桌機四欄 */
        gap: 0px;
        row-gap: 15px;
        margin: 0 auto;
        padding: 15px;
    }
    .bossVideoList.grid .VideoItem:nth-child(1){
        grid-column:1/ span 2;  /* 從第一欄開始，佔 2 欄 */
        grid-row: 1 / span 1;     /* 從第一列開始，佔 1 列 */
    }
    .bossVideoList.grid .VideoItem:nth-child(2){
        grid-column: 1/ span 1;  
        grid-row: 2 / span 1;     
        background-color: #4a4a4a;
    }
    .bossVideoList.grid .VideoItem:nth-child(3){
        grid-column: 1/ span 1;  
        grid-row: 3 / span 1;
        background-color: #a12222;
    }
    .bossVideoList.grid .VideoItem:nth-child(4){
        grid-column: 1 / span 1;
        grid-row: 4 / span 1;
        background-color: #84ad11;
    }
    .bossVideoList.grid .VideoItem:nth-child(5){
        grid-column: 1/ span 1;  
        grid-row: 5 / span ;
        background-color: #111bad;
    }
    .bossVideoList.grid .VideoItem:nth-child(6){
        grid-column: 1 / span 1;
        grid-row: 6 / span 1;
        background-color: #d11ba3;
    }
    .bossVideoList.grid .VideoItem:nth-child(7){
        grid-column: 1/ span 1;  
        grid-row: 7 / span 1;
        background-color: #d14f1b;
    }
    .bossVideoList.grid .VideoItem:nth-child(8){
        grid-column: 1 / span 1;
        grid-row: 8 / span 1;
        background-color: #d14f1b;
    }
    .bossVideoList.grid .VideoItem:nth-child(9){
        grid-column: 1/ span 1;  
        grid-row: 9 / span 1;
        background-color: #d14f1b;
    }
    .VideoZone p{
        margin: 30px 15px 0px 0px;
        font-size: 2em;
    }
}