td { font-family: "Arial", "Helvetica", "sans-serif";font-size: 8.5pt}
a {  color: #003399}
Input {font-family: "新細明體"; font-size: 8.5pt}
Select {font-family: "新細明體"; font-size: 8.5pt}
textarea {font-family: "Verdana, Arial, Helvetica";font-size: 8.5pt; line-height:1.1em;}
form {margin:0px}
Body {font-family: "Verdana", "Arial", "Helvetica", "sans-serif"; font-size: 8.5pt; color: #333333}
.tableTitle {  background-color: #DDDDDD;height="20"; text-align: center;BORDER-BOTTOM:#000000 1px solid; BORDER-right: #000000 1px solid ;BORDER-LEFT: #ffffff 1px solid;BORDER-top: #ffffff 1px solid; }
.titledown  {  background-color: #DDDDDD;height="20"; text-align: center;BORDER-BOTTOM:#000000 1px solid; BORDER-right: #000000 1px solid ;BORDER-LEFT: #ffffff 1px solid;BORDER-top: #ffffff 1px solid; }
.poptable {BORDER-BOTTOM:#666666 1px solid; BORDER-right:#666666 1px solid ;BORDER-LEFT: #ffffff 1px solid;BORDER-top: #ffffff 1px solid; }
.tableEmboss {BORDER-BOTTOM:#ffffff 1px solid; BORDER-right:#ffffff 1px solid ;BORDER-LEFT: #666666 1px solid;BORDER-top: #666666 1px solid; }
.tableWhite {BORDER-BOTTOM:#ffffff 1px solid; BORDER-right:#ffffff 1px solid ;BORDER-LEFT: #ffffff 1px solid;BORDER-top: #ffffff 1px solid; }
a:link {  color: #004D99; text-decoration: none}
a:visited {  color: #004D99; text-decoration: none}
a:hover {  color: #CC0099}
.page{font-family: "Verdana, Arial, Helvetica"; font-size: 7.5pt ; height="20"; }
.Uneditable { background-color: #C9F1E9}
.UneditableGreen { background-color:#C9F1E9}
.editeYellow { background-color:#FFFAE8}
.LoginInput {  border: 1px #999999 dashed}
.LoginID {  background-color: #999999; border: 1px #666666 solid}
.BGOneTime {  background-repeat: no-repeat}
.ORGTree {  background-color: #ffffff;height="16"; text-align: center;BORDER-BOTTOM:#000000 1px solid; BORDER-right: #000000 1px solid ;BORDER-LEFT:#CCCCCC  1px solid;BORDER-top:#CCCCCC  1px solid; }
.LoginInput {  border: 1px #999999 dashed}
.LoginID {  background-color: #999999; border: 1px #666666 solid}

.UneditableYellow { background-color:#FFEFC4}
.UneditableYellowGreen { background-color:#EBF0CA}
.UneditableBlue { background-color:#C9F1E9}
.file-box{ position:relative;width:340px}
.txt{ height:22px; border:1px solid #cdcdcd; width:180px;}
.btn{ background-color:#EAEAEA; border:1px solid #CDCDCD;height:24px; width:70px;}
.file{ position:absolute; top:0; right:80px; height:24px; filter:alpha(opacity:0);opacity: 0;width:260px }


.ui-widget-overlay {
  opacity: 0.6;
  filter: Alpha(Opacity=50);
  background-color: #292929;
 }

/*20230703 Modify by ben [2023B001]Portal首頁優化(階段三、階段四)*/
.flex-container {
  display: flex;
  flex-direction: column ;
  justify-content:flex-start;
  font-size: 12px;
  width:95%;
}

.bulletin-title{
  font-size:22px;
  height: auto;
  max-height: 90px;
  width:95%;
  margin: 8px 8px 8px 8px;
  background-color: rgb(245 245 245);
  font-family: MicrosoftJhengHei;
  font-style: normal;
  font-weight: bold;
  line-height: 1.33;
  letter-spacing: normal;
  background-color: #f8f8f8;
  overflow:auto;
  word-wrap:break-word;
}

.bulletin-con{
  background-color: rgb(250 250 250);
}
.bulletin-subject {
 
  font-size: 14px;
  display: flex;
  flex-direction: row;
  margin: 5px 5px ; 
}

.bulletin-subject1{
  min-width:300px;
  margin: 0 20px 0 0 ; 
  white-space:nowrap; 
  
}

.bulletin-url{
  white-space: nowrap;
  overflow: hidden; /*20230703 Modify by ben [2023B001]Portal首頁優化(階段三、階段四) 兩行後多餘的字變...*/
  text-overflow: ellipsis;
}

.bulletin-subject-name {
  font-family: MicrosoftJhengHei;
  font-size: 14px;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: normal;
  color: #7e7e7e; 
}
.bulletin-subject2{
  width:200px;
  margin: 0 40px 0 0 ;
  white-space:nowrap;
}
.bulletin-body,.member-body,.happy-body,.conference-body{
  background-color: #f8f8f8;
}

.bulletin-main {
  /*background-color: rgb(255,255,255); */
  background-color: rgb(255,255,255);
  padding: 8px ;
  border-radius: 10px;
  font-size: 14px;
  white-space:nowrap;
}

.bulletin-text{
  padding-left: 8px ;
}
.bulletin-context{
  font-size: 14px;
  height: 366px;
  max-height: 396px;
  overflow:auto;
  border-radius: 10px;
  padding: 5px;
  background-color: rgb(255, 255, 255);
  display:flex;
  flex-direction:column;
  position: relative;
}

.bulletin-attach{
  display: flex;
  flex-wrap:wrap;
  flex-direction: row ;
  margin: 10px 0 0 0 ;
  /*overflow:auto; */
  
}

 
.bulletin-link{
  
  border-radius: 5px;
  border-style:solid;
  border-color:rgb(199, 195, 195);
  padding: 6px 6px 6px 10px;
  border-width:1px;
  height: 66px;
  width: 300px;
  margin:3px 10px 3px 3px;
  display: flex;
  flex-direction: row;
  /* 水平置中 */
  justify-content: center;    
  /* 垂直置中 */
  align-items: center;
  cursor: pointer;
}

.bulletin-link:hover {
  background-color: #DDDDDD;

}
.bulletin-imgblock{
  width: 22px;
  height: 22px;
  margin: 0 10px 0px 0px;
}
.bulletin-link-name{
  font-weight: bold;
  cursor: pointer;
  text-align:left;
  font-size: 14px;
  color: #7e7e7e;
  overflow:hidden;
  width: 250px;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin: 0 0 5px 0;
}
.bulletin-attinfo-block{
  width: 100%; 
}
.bulletin-http{
  margin: 26px 16px 0 0;
  font-size: 14px;
  height: 30px;
}

.bulletin-attachsize{
  margin: 2px 0 0;
  font-family: MicrosoftJhengHei;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: normal;
  color: #a9a9a9;
}
.bulletin-http .text-style-1 {
  color: #7e7e7e;
}
.bulletin-http .text-style-2 {
  color: #0069c2;
}

.bulletin-bottom{
  margin-top: auto;
}

.dialog-close{
  /*position: relative;*/
  position:absolute;
  top:15;
  right: 20;
  transform: translate(50%,-50%);
  cursor: pointer;
} 

 

.Line-3 {
  width: 99%;
  height: 1px;
  margin: 8px 8px 0 0;
  border: solid 1px #e9e9e9;
}

.font-setting{
  font-weight:bold;
  font-size:13px;
  color: #292929;
  
}

.font-limit{ 
  max-width: 200px; /* 假設指定寬度為 150px，可以依據實際情況調整 */
  overflow: hidden; /* 隱藏超過寬度的文字 */
  white-space: nowrap; /* 讓文字不換行 */
  text-overflow: ellipsis; /* 超出文字框後顯示省略號 */
}

.icon-close{
  width: 24px;
  height: 24px;
  object-fit: contain;
}

 
.dialog-close:hover img {
  content: url(../img/newportal/close-hover.svg);
}

.PrevBtn:hover img {
  content: url(../img/newportal/hover-arrow-left.svg);
}

.NextBtn:hover img {
  content: url(../img/newportal/hover-arrow-right.svg);
}

/* 控制scroll bar 寬度 */
.bulletin-context::-webkit-scrollbar,.conference-context::-webkit-scrollbar 
,.conference-main::-webkit-scrollbar,.happy-detail::-webkit-scrollbar
{
  width: 6px;
}
/* 控制scroll bar 捲軸可以拉的部分 */
.bulletin-context::-webkit-scrollbar-thumb,.conference-context::-webkit-scrollbar-thumb
,.conference-main::-webkit-scrollbar-thumb,.happy-detail::-webkit-scrollbar-thumb {
  background-color: gray;
  height: 20px;
 }

.member-title,.conference-title{
  width: 96px;
  margin: 8px 13px 8px 0;
  font-family: MicrosoftJhengHei;
  font-size: 24px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: normal;
  color: #292929;
  white-space: nowrap;

}
.member-container {
  display: flex;
  flex-direction: column ;
  justify-content:flex-start;
  padding: 4px 4px 8px 8px;
  border-radius: 10px;
  background-color: #f8f8f8;
}

.member-detail{
  display: flex;
  flex-direction: row;
}

.mask{
  overflow: hidden;
  width: 90px;
  height: 90px;
  position: relative;
  background-color: #fff;
  border-radius: 50%;
}


.mask>img{
  width: 100%;
  position: absolute;
  left: 0%;
}

.mask-nopic{
  width: 33px;
  height: 36px;
}

.mask-divnopic{
  
  width: 90px;
  height: 90px;
  display: flex;
  /* 水平置中 */
  justify-content: center;    
  /* 垂直置中 */
  align-items: center;
  background-color: #fff;
  border-radius: 50%;
}

.member-info{
  width: 570px;
  height: 250px;

  padding: 20px;
  border-radius: 13px;
  font-weight: normal;
  color: #7e7e7e;
  font-size: 18px;
  background-color: #fff;
}

.member-list,.member-list-last {
  margin: 0px 0px 14px;
  font-size: 14px;
}
.member-info > div >span {
  font-family: MicrosoftJhengHei;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: normal;
  color: #292929;
}

 
.member-name{
  font-size: 20px;
  font-weight: bold;
}

.member-ename {
  font-size: 12px;
  color: #292929;
  word-wrap:break-word;
}

.member-left{
  display: flex;
  flex-direction: column;
  text-align:center;
  align-items: center;    
  width: 110px;
  margin: 0 20px 0 0;
}

.member-picarea{
  text-align:center;
}

.happy-title{
  width: 680px;
  min-height: 24px; 
  margin: 5px 16px 24px 0;
  font-family: MicrosoftJhengHei;
  font-size: 24px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.17;
  letter-spacing: normal;
  color: #292929;
 
}

.happy-detail{
  width: 712px;
  min-height: 60px;
  height:auto;
  margin: 0px 8px 10px 0;
  font-family: MicrosoftJhengHei;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: normal;
  color: #292929; 
  overflow: auto;   
}

.happy-container{
  background-color: #f8f8f8;
  width: 720px; 
  height: 410px; 
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow-x: hidden;
  overflow-y: hidden;
}


.happy-banner{

  width: 715px;
  height: 190px;
  border-radius: 14px;
  display: flex;
  /* 水平置中 */
  justify-content: center;    
  /* 垂直置中 */
  align-items: center;
  margin-top:auto; 
  background-color: fff;
  padding: 0 0 0 2px ; 
}
.happy-banner2{
  width:660px; 
  height: 190px;
  margin-top: 30px;
}
.happy-picture{
  max-width: 156px;
  min-width: 156px;
  height: 156px;
  border-radius: 10px;
 
}

.happy-list{
  width: 660px;
  max-width: 660px;
  min-width: 660px;
  position: relative;    
}

.owl-stage{
  width:360px;
}
 
.PrevBtn,.NextBtn{ 
  position: absolute;
  top: 78px;
  transform: translateY(-90%); 
 
}

.PrevBtn {
  left:-30px;   
}

.NextBtn {
  right: -30px;   
}


.happy-image{
  border-radius: 10px;
  width: 156px;
  height: 156px;
}


 
.calendar_meeting{
  height: 15px;
  width: 15px;
  border-radius: 50%;
  background-color: red;
}

.conference-container{
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  background-color: #f8f8f8;
}

 
.conference-main{
  width:760px;
  height: 590px;
  overflow: auto;
  border-radius: 10px;
  margin: auto;
}
.conference-meeting{
  margin: 0 0 24px;
  padding: 20px;
  border-radius: 13px;
  background-color: #fff;
  font-size: 24px;
}

.conference-subject{
  font-family: MicrosoftJhengHei;
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: normal;
  color: #292929;
  margin: 0 0 20px 0;
}

.conference-list{
  display: flex;
  flex-direction: row;

  /* 垂直置中 */
  align-items: center;
  margin: 0 0 15px 0;
}

.conference-text{
  font-family: MicrosoftJhengHei;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: normal;
  color: #292929;
  margin: 0 0 0 16.5px;
}

.flex {
  display:flex;
  flex-direction: row;
}


.imgPreview {
    
    
  display: none;
  top: 0;
  left: 0;
  width: 100%; /*容器佔滿整個螢幕*/
  height: 100%;
  position: fixed;
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
}

.imgPreview img {

  position: absolute;
  z-index: 100;
  width: auto;
  height: 95%;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}