/*------------------tags start*/.textIndent-fix,.textIndent-fix p{text-indent:0!important;}.whiteSpace-nowrap{white-space:nowrap!important;}/*------------------announcement start*/.announcementStyle{} .announcementStyle li{border-bottom: 1px solid #eee; padding-top: 15px; padding-bottom: 15px;} .announcementStyle li:after{content: ''; display: table; clear: both;} /*.announcementStyle .imgDiv{display: none;}*/ .announcementStyle .imgDiv img{border: 5px solid #ededed;} /*.announcementStyle li:hover .imgDiv img{border-color: #ffe1dc;}*/ .announcementStyle li{width: 100%; color: #888;} .announcementStyle li span.date{color: #c78300; font-weight: bold; margin-bottom: 4px; display: block;} .announcementStyle li .link{margin-bottom: 10px;} .announcementStyle li .link p{line-height:1.3;} .announcementStyle li a{font-weight: 500; color: #010101;} .announcementStyle a.subtitle{font-size: 13px; line-height: 1.3; display: block; color: #888; font-weight: normal; margin-top: 5px;} .announcementStyle li a:hover{color: #1b96cf; text-decoration: none;}div.subtitle{margin-top: 7px; font-size: 13px; color: #797979;}.borderNone tr,.borderNone td{border:none;} /*列表頁有圖時顯示樣式 jQery偵測*/ .announcementStyle li.tiemHasImg .imgDiv{display: block;} .announcementStyle li.tiemHasImg .imgDiv img{width:100%; height:auto;}@media (min-width: 768px){.announcementStyle li{display: flex; flex-direction: row-reverse; justify-content: space-between;} span.date{width:10%; text-align:right;} li .link{width: 90%;} li.tiemHasImg .link{width: 67%; padding-left: 22px;} li.tiemHasImg .imgDiv{width: 23%;}}@media (max-width: 480px){.announcementStyle li.tiemHasImg .imgDiv{margin-top: 10px;} .announcementStyle li.tiemHasImg .imgDiv, .announcementStyle li.tiemHasImg .infoDiv, .announcementStyle .infoDiv span{float: none; width: auto;} .imgDiv{text-align: center; width:100%;} .imgBorder img{width:100%;} .imgDiv img{width: 100%;} .announcementStyle .infoDiv a{display: block; width: 100%;}}/*announcement end*//*default start*/.defaultBody{background-color: #f7f7f7;}.main-container.default{padding: 0; max-width: none; min-height: auto; background-color: transparent;} .main-container.default > *{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}.default .clearfix:after{content: ''; display: table; clear: both;}.default .main-content{position: relative;}.default .topDiv{padding: 30px 0; max-width: 1200px; margin: 0 auto;}.default .main-content h2,.default .bottomDiv h2{font-size: 22px; line-height: 1; color: #000; font-weight: bold; border-left: 6px solid #4678de; padding: 3px 0 3px 10px; margin-bottom: 45px; position: relative;} .default .main-content h2 i, .default .bottomDiv h2 i{color: #848484; font-size: 14px; font-family: sans-serif; padding-left: 6px; padding-right: 6px;} .default .main-content h2 span.en, .default .bottomDiv h2 span.en{font-size: 13px; font-family: sans-serif; font-weight: normal;}.default .main-content li a:before{content: ''; display: inline-block; width: 7px; height: 7px; background-color: #bcbcbc; transform: translate(0, -2px); margin: 0 3px;}.default .main-content{vertical-align: top;} .default .main-content .more{text-align: right;} .default .main-content .more a{display: inline-block; background-color: #efca00; line-height: 29px; padding: 0 20px; color: #000; font-weight: bold; font-size: 13px;}.default .newsDiv ul{margin-left: -10px; margin-right: -10px;}.default .newsDiv li{display: inline-block; width: calc( 33.3333% - 3px ); vertical-align: top; margin-bottom: 30px; padding: 0px 11px;}.default .newsDiv .imgDiv{margin-bottom: 10px;} .default .newsDiv .imgDiv img{width: 100%; height: auto;}.default .newsDiv li a{position: relative; display: block; color: #000; font-weight: bold;} .default .newsDiv li a > span{margin-left: 5px;}@media (max-width: 1201px){.main-container.default{width: 100%;} /*首頁內容區*/ .default .topDiv, .default .bottomDiv{width: 95%; margin-left: auto; margin-right: auto;}}@media (max-width: 769px){.default .main-content{width: 100%;} .default .main-content .newsDiv{padding-bottom: 45px;} .default .main-content ul{border-bottom: 0;} .default .main-content .more{text-align: center;}}@media (max-width: 576px){.default .main-content ul{padding: 0 16px;} .default .newsDiv h2{margin-bottom: 20px;} .default .newsDiv ul{margin: 0;} .default .newsDiv li{width: 100%; padding: 0;}}/*default end*//*download start*/.downloadStyle{margin: 0 -1%;} .downloadStyle:after{content: ''; display: table; clear: both;} .downloadStyle > div{display: inline-block; width: calc( 48% - 3px); margin: 0 1% 2%; border-top: 1px solid #eee; padding-top: 15px; vertical-align: top;} .downloadStyle > div a{font-weight: bold;} .downloadStyle > div img{vertical-align: text-bottom; margin-right: 5px;} .downloadStyle > div > span{display: block; color: #888; font-size: 14px; margin-top: 3px;}/*download table*/table.downloadStyle{border: 0;} table.downloadStyle td{border: 0;} table.downloadStyle td div{background: url(../img/top_bg.gif) 0 bottom repeat-x; margin-bottom: 4px;}@media (max-width: 768px){.downloadStyle > div{width: 100%;} .downloadStyle > div span{padding-left: 0;}}/*--------------download end*//*--------------form start*/.tableStyle{width: 100%; max-width: 1000px; margin: 0 auto;} .tableStyle table{width: 100%;} .tableStyle td{padding: 6px; font-weight: bold; line-height: 36px;} .tableStyle input, .tableStyle textarea{line-height: 22px;} .tableStyle input[type=text], .tableStyle input[type=password], .tableStyle textarea, .tableStyle select{width: 100%; /*display: block;*/ display: inline-block; background: #f6f6f6; border: 1px solid #f6f6f6; padding: 6px 8px;} .tableStyle select{padding-right: 0; padding-left: 3px;} .tableStyle.fixWauto input[type=text], .tableStyle.fixWauto input[type=password], .tableStyle.fixWauto textarea{width: auto;} .tableStyle input[type=text]:focus, .tableStyle textarea:focus{outline: 0; border: 1px solid #17B0EB; box-shadow: 0 0 0 0; background: #fff; color: #008fc6;} .tableStyle select:focus{outline: 0; border: 1px solid #17B0EB; box-shadow: 0 0 0 0; background: #fff; color: #008fc6;} .tableStyle select option{color: #000;} .tableStyle input[type=file]{background: #f6f6f6; padding: 6px 6px; display: inline-block;} .tableStyle .mainlink0, .tableStyle .style1, .tableStyle .style2{color: #fe3917; font-weight: bold; padding: 3px 0; display: inline-block; font-size: 15px;} .tableStyle .checkTable{width: auto;} .tableStyle .checkTable input{visibility: hidden; margin-left: -13px;} .tableStyle .checkTable label{cursor: pointer;} .tableStyle .checkTable label:before{content: "\f096"; display: inline-block; font: normal normal normal 17px/1 FontAwesome; padding-right: 5px; transform: translate(0, 1px);} .tableStyle .checkTable input:checked + label:before{content: "\f046"; /*color: #17B0EB;*/ padding-right: 2.5px;} .tableStyle .radioTable{width: auto;} .tableStyle .radioTable td{padding: 0 5px;} .tableStyle .radioTable input{visibility: hidden; margin-left: -13px;} .tableStyle .radioTable label{cursor: pointer;} .tableStyle .radioTable label:before{content: "\f10c"; display: inline-block; font: normal normal normal 17px/1 FontAwesome; padding-right: 5px;} .tableStyle .radioTable input:checked + label:before{content: "\f058"; color: #17B0EB;} .tableStyle .btnStyle input[type=submit], .tableStyle .btnStyle input[type=reset], .btnStyle input[type=submit], .btnStyle input[type=reset], .btnStyle input[type=button]{border: 0; padding: 8px 15px; background: linear-gradient(to top, #698fdc, #4678de 100%); text-shadow: 0 1px 0 rgba(255,255,255,.4); color: #fff; font-weight: bold; border-bottom: 2px solid #254075; border-radius: 3px; margin: 0 5px; font-size: 15px;} .tableStyle .orgtitle{color: #fe3917; font-weight: bold;} .tableEditStyle .GridViewDiv tr{background-color: transparent;}/*datepicker style*/.PosData{position: relative; display: inline-block; padding-right: 36px; background-color: #f6f6f6;}.tableStyle .PosData input[type=text]{width: 135px; position: relative; z-index: 1; background-color: transparent; margin-right: -36px; padding-right: 42px; cursor: pointer; margin-bottom: 0; height: 36px\0/ !important;} .tableStyle .PosData input[type=text]:focus{background-color: transparent;} .PosData .fa-calendar{position: absolute; right: 0px; top: 0px; border-radius: 0 2px 2px 0; margin-bottom: 0; height: 35px; width: 37px; line-height: 35px; text-align: center; background: #f6f6f6; cursor: pointer; border: 0; border-left: 1px solid #d5d5d5;} .PosData .fa-calendar:hover{color: #17B0EB; background: #efefef;} .PosData input[type=text]:focus + i{border-color: #17B0EB !important; color: #4b81ba; background: #f6f6f6;}/*兩個日曆放在同個td時用*/.tableStyle .td-PosData-fix input[type=text]{}@media (max-width: 768px){.tableStyle .PosData{padding-right: 0;} .tableStyle .PosData input[type=text]{width:100%;}}/*表格樣式+輸入格*/ .tableStyle.style2 th{background-color: #4b81ba; border: 1px solid #ccd7ef; padding: 2px 3px; color: #fff; line-height: 1.8em;} .tableStyle.style2 td{border-bottom: 1px solid #ccd7ef; padding: 5px 3px; line-height: 1.8em;} .tableStyle.style2 td input, .tableStyle.style2 td select{border: 1px solid #d9d9d9; height:37px; margin-bottom:0;} .tableStyle.mobile-vertical .mobile-show{display: none;} .tableStyle.style2 .PosData .fa-calendar{height: 37px; border: 1px solid #cad5e1;}@media (max-width: 768px){.tableStyle.mobile-vertical{display: block !important; position: relative; width: 100%;} .tableStyle.mobile-vertical thead{display: block; float: left;} .tableStyle.mobile-vertical thead tr{display: block;} .tableStyle.mobile-vertical thead th{display: block; width: auto; padding: 0px 3px; height: 48px; line-height: 48px; border-top: 0;} .tableStyle.mobile-vertical tbody{display: block; width: auto; position: relative; overflow-x: auto; white-space: nowrap;} .tableStyle.mobile-vertical tbody tr{display: inline-block; vertical-align: top; margin: 0px -2px;} .tableStyle.mobile-vertical tbody td{display: block; width: auto;} .tableStyle.mobile-vertical .text-lineheight{line-height:37px;} .tableStyle.mobile-vertical .mobile-hidden, .tableStyle .mobile-hidden{display: none;} .tableStyle.mobile-vertical .mobile-show{display: inline-block;} } /**/ .remindNote{border: 2px solid #ea1b1b; padding: 15px 10px; display: block; background-color: #fff9f9; font-weight: bold;} .remindNote.padding-s ul{margin-left: 0; margin-bottom:0; line-height: 1.4;} .remindNote.padding-s li + li{padding-top: 8px;} /* table class 間隔小時用*/ .tableStyle table.table-td-min td, table.table-td-min td{padding: 2px 6px; line-height: 1.4;} /* td class 間隔小時用*/ .tableStyle table td.td-min{padding: 2px 6px; line-height: 1.4;} /* table class 裝飾點 + 標題 用 */ .tableStyle table.table-tr-flex tr{display: flex;} .tableStyle table.table-tr-flex td:first-child{width: 24px;} /* tr class 裝飾點 + 標題 用 */ .tableStyle tr.tr-flex{display: flex;} .tableStyle tr.tr-flex td:first-child{width: 24px;} /**/ .tableStyle.tableList1{max-width: 520px;} .tableList1 td{display: block; width: 100%; text-align: left;} .tableStyle.tableList1 input[type=text], .tableStyle.tableList1 input[type=password], .tableStyle.tableList1 textarea{margin-top: 5px; display: block;} .tableList1 .checkTable{width: 100%;} .tableList1 .checkTable td{max-width: 33.3333%; display: inline-block;} .tableList1 td.btnStyle{text-align: center; height: auto;} @media (min-width: 768px){.tableStyle.tableList1 .btnStyle input{width: 26%;} } @media (max-width: 769px){.tableList1 .checkTable td{max-width: none;} } @media (max-width: 576px){.tableStyle td{width: 100%; display: block; text-align: left; height: auto;} .tableStyle td.mobileInputW45 input[type=text]{width: 45%;} .tableStyle td.mobileInputW35 input[type=text]{width: 35%;} .tableStyle input[type=file]{width: 100%;} .tableStyle td.btnStyle{text-align: center;} .tableStyle input[type=text], .tableStyle input[type=password], .tableStyle .btnStyle input[type=submit], .tableStyle .btnStyle input[type=reset]{width: 100% !important; max-width: initial !important; margin: 0 0 15px;} .main-content .mobileTrMarginBottom0{margin-bottom: 0;} .mobilePaddingLeft{padding-left: 11px;} } /*-----------------------------form end*/ /*------------------------organization start*/ .organizationStyle{text-align: center; overflow-y: auto; font-size: 15px;} .organizationStyle img{max-width: none;} /**/ .organizationStyle.HStyle{overflow: hidden;} .HStyle ul.bottomList:after{content: ''; display: table; clear: both;} .HStyle li{position: relative;} .HStyle li a{border: 1px #333 solid; color: #000; display: inline-block; background: #fff; border-radius: 4px; margin-bottom: 5px; padding: 0 7px; padding: 4px 7px; line-height: 1.2; text-shadow: 0 0px 1px rgba(0,0,0,.7);} .HStyle li a:hover{text-decoration: none; background: #ddd;} /* li.top 上方董監事會,主任室樣式*/ .HStyle li.top li{height: 50px;} .HStyle li.top li a{position: relative; width: 78px; text-align: center;} .HStyle li.top li a:after{content: ''; display: table; background: #666; height: 24px; width: 1px; position: absolute; left: 50%; top: 100%;} .HStyle li.top li div{position: absolute; top: calc( 50% + 2px ); left: 50%; margin-left: -119px; font-size: 15px; font-weight: bold; padding-right: 61px;} .HStyle li.top li div:after{content: ''; display: table; width: 53px; height: 1px; border-top: 1px dashed; position: absolute; left: 4em; margin-left: 7px; top: 50%;} .HStyle li.top li.last div{margin-left: 0; padding-right: 0; padding-left: 62px;} .HStyle .top li.last div:after{left: auto; right: 6.5em;} .orgnization{font-size: 16px; text-align: justify;} .orgnization a{color: #2e75b5;} .orgnization p{letter-spacing: 1px; margin: 0 0 20px; text-indent: 2em;} .orgnization p.ulTitle{text-indent: 0; font-weight: bold; margin: 0;} .orgnization .linkBox li{display: inline-block;} .orgnization .linkBox li:before{color: #2e75b5; content: 'I'; display: inline-block; margin: 0 2px 0 4px;} .orgnization .imgBox2, .orgnization .imgBox3, .orgnization .imgBox4, .orgnization .imgBox5{font-size: 0;} .orgnization .imgBox2 .imgItem{display: inline-block; width:calc(50% - 4px);} .orgnization .imgBox3 .imgItem{display: inline-block; width:calc(33.33% - 4px);} .orgnization .imgBox4 .imgItem{display: inline-block; width:calc(25% - 4px);} .orgnization .imgBox5 .imgItem{display: inline-block; width: calc(20% - 4px);} .orgnization .imgItem{padding: 0 8px; box-sizing: border-box; vertical-align: bottom;} .orgnization .imgItem img{width: 100%; height: auto;} .orgnization .imgItem .imgText{font-size: 16px; font-weight: bold; margin: 8px 0 16px 0; text-align: center;} .orgnization .title{color: #CC0000; font-size: 20px; font-weight: bold; text-indent: 0;} .EditText .orgnization .title1, .EditText.orgnization .title1{color: #f19642; font-size: 24px; font-weight: bold; text-indent: 0;} .orgnization .titleCenter{text-align: center; font-size: 18px; font-weight: bold;} .orgnization .myTable{width: 100%; border: 1px #006600 solid; border-collapse: collapse;} .orgnization .myTable td, .orgnization .myTable th{border: 1px #006600 solid; padding: 4px;} .orgnization .myTable th{background: #b6e3a5; color: #006600; text-align: center;} .orgnization .myTable tr{background: #ccebc0;} .orgnization .myTable tr:nth-child(2n){background: #fff;} .orgnization ol li{list-style: decimal;} @media (min-width: 1070px){.HStyle ul.line{border-top: 1px solid #666; position: relative;} ul.line:after{content: ''; display: table; clear: both;} .HStyle ul.line li:first-child:before{content: ''; display: table; width: calc( (100%/2) ); height: 10px; background-color: #fff; position: absolute; left: 0; top: -1px; z-index: 100;} .HStyle ul.line li:last-child:before{content: ''; display: table; width: 50%; height: 10px; background-color: #fff; position: absolute; left: calc( 50% + 1px ); top: -1px; z-index: 100;} ul.line li{height: 18px; width: 14.285%; float: left;} ul.line li:after{content: ''; display: table; width: 1px; background: #666; height: 18px; position: absolute; top: 0; left: 50%;} .HStyle ul.bottomList > li > a{display: block; margin-bottom: 0; border-radius: 10px;} .HStyle ul.bottomList > li ul{text-align: left; font-size: 15px; padding-top: 10px; padding-left: 1.2em; position: relative; overflow: hidden;} .HStyle ul.bottomList > li ul:before{content: ''; display: table; background: #666; height: 300px; width: 1px; position: absolute; left: .6em; top: -5px;} .HStyle ul.bottomList > li ul:after{content: ''; display: table; background-color: #fff; position: absolute; left: .6em; bottom: 0; width: 8px; border-top: 1px solid #666; height: 16px; height: 17px\0;} .HStyle ul.bottomList > li.team-3 ul:after, .HStyle ul.bottomList ul.other-style:after{height: 24px; height: 25px\0;} .HStyle ul.bottomList > li{width: 12%; padding: 0 5px 10px; float: left;}
    .HStyle ul.bottomList > li:nth-child(1), .HStyle ul.bottomList > li:nth-child(3) {
        width: 15%;} .HStyle ul.bottomList > li:nth-child(6){width: 18%;} .HStyle ul.bottomList > li:nth-child(4){width: 14%;} .HStyle ul.bottomList li ul li{position: relative;} .HStyle ul.bottomList li ul li a{font-size: 14px; letter-spacing: -0.05em;} .HStyle ul.bottomList li ul li:after{content: ''; display: table; width: 7px; height: 1px; background: #666; position: absolute; left: -8px; top: 50%; margin-top: -2px;} .HStyle ul.bottomList li ul li:last-child:after{background: transparent;} /*產業應用策略辦公室*/ .HStyle ul.bottomList > li ul.other-style:before{border-left: 1px dashed #fff;} .HStyle ul.bottomList > li ul.other-style:after{border-top: 1px dashed #666;} .HStyle ul.bottomList ul.other-style{margin-top: -15px; padding-top: 14px;} } @media (max-width: 1071px){.organizationStyle.LStyle.LStyle{text-align: left; margin: 0 auto; max-width: 720px;} .organizationStyle.LStyle > *{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} .LStyle li.top li div{position: absolute; top: calc( 50% + 2px ); left: 39px; font-size: 15px; font-weight: bold; margin-left: 0; padding-right: 0; padding-left: 62px;} .LStyle li.top li div:after{content: ''; display: table; width: 53px; height: 1px; border-top: 1px dashed; position: absolute; margin-left: 7px; top: 50%; left: auto; right: 4.5em;} .LStyle > ul{max-width: 430px; margin: 0 auto;} .organizationStyle.LStyle li{vertical-align: top;} .LStyle li.center:before{content: ''; display: table; left: 50%; width: 1px; height: 131px; background: #666; position: absolute; z-index: 1000;} .LStyle li.center{display: inline-block; width: 78px; position: relative;} .LStyle li.center:after{content: ''; display: table; width: 44px; height: 1px; background: #666; position: absolute; top: 130px; left: 50%;} .LStyle li.bottom{display: inline-block; width: 80%; border-left: 1px solid #666; padding-left: 18px; margin-top: 20px; position: relative;} .LStyle li.bottom:after{content: ''; display: table; position: absolute; bottom: 0; left: -6px; width: 6px; height: 17px; background: #fff;} .LStyle li.bottom ul.bottomList{margin-top: -15px;} .LStyle li.bottom > ul > li:before{content: ''; display: table; width: 17px; height: 1px; background: #666; position: absolute; top: 14px; left: -19px;} .LStyle li.bottom > ul > li > a{display: inline-block; width: 150px; margin-right: 3%; vertical-align: top;} .LStyle li.bottom > ul > li > ul{display: inline-block; vertical-align: top; border-left: 1px solid #666; padding-left: 9px; margin-bottom: 1em; position: relative;} .LStyle li.bottom > ul > li > ul:before{content: ''; display: table; position: absolute; content: ''; display: table; position: absolute; background: #fff; width: 6px; height: 14px; left: -1px; top: 0;} .LStyle li.bottom > ul > li > ul:after{content: ''; display: table; position: absolute; content: ''; display: table; position: absolute; background: #fff; width: 6px; height: 17px; left: -6px; bottom: 0;} .LStyle li.bottom > ul > li > ul > li{position: relative;} .LStyle li.bottom > ul > li > ul > li:before{content: ''; display: table; width: 9px; height: 1px; background: #666; position: absolute; top: 14px; left: -9px;} .LStyle li.bottom > ul > li > ul.other-style > li:before{border-top: 1px dashed #fff;} .HStyle ul.bottomList ul.other-style{border-left: 1px dashed #666; padding-top: 17px; position: relative; left: 164px; top: -31px;} .LStyle li.bottom > ul > li > ul.other-style:before{display: none;} } @media (max-width: 650px){.LStyle > ul{max-width: 320px;} .HStyle li.top li a:after{left: 15px;} .LStyle li.center:before{left: 15px;} .LStyle li.center:after{width: 20px;} .LStyle li.top li div{left: 13px;} .LStyle li.center{width: 30px;} .LStyle li.bottom:after{height: 12px;} .LStyle li.bottom > ul > li > ul:before{display: none;} .LStyle li.bottom > ul.bottomList > li > a{margin-bottom: 0;} .LStyle li.bottom > ul > li > ul{display: block; padding-top: 5px; margin-left: 15px;} .LStyle li.bottom > ul > li > ul.other-style > li:before{border-top: 1px dashed #fff;} .HStyle ul.bottomList ul.other-style{margin-top: -32px; padding-top: 17px; border-left: 1px dashed #666; top: 0; left: 0;} } @media (max-width: 480px){.orgnization .linkBox li{display: block;} .orgnization .imgBox2 .imgItem, .orgnization .imgBox3 .imgItem, .orgnization .imgBox4 .imgItem, .orgnization .imgBox5 .imgItem{width: 100%; margin: 4px 0;} } @media (max-width: 430px){.organizationStyle.LStyle.LStyle{} .LStyle > ul{} } /*------------------------organization end*/ /*----------------photo Start*/ .photoStyle{margin-top: 15px; display: flex; flex-wrap: wrap;} .photoStyle > div{border-top: none; border-bottom: 1px solid #eee; width: 100%; padding: 0 0 15px;} .photoStyle > *{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} .photoStyle .item{display: block; width: 24.6%; vertical-align: top; background: #fff; border-radius: 3px; overflow: hidden; margin-bottom: 25px; text-align: center; padding: 0 1%;} .photoStyle .item a{display: block;} .photoStyle .item a{/*max-width: 182px;*/ display: inline-block; vertical-align: top; overflow: hidden; position: relative; background-color: #efca00;} /*.photoStyle .item a img{border: 5px solid #ededed;}*/ .photoStyle .item a:hover:before{content: "\f1c5"; font: normal normal normal 34px/1 FontAwesome; color: #fff; background-color: transparent; border: 0; position: absolute; z-index: 1; left: 50%; top: 50%; margin-left: -15px; margin-top: -17px;} .photoStyle .item a:hover img{/*transform: scale(1.05);*/ /*transition:all .2s;*/ opacity: .2;} .photoStyle .item span{/*width: calc( 100% - 190px );*/ display: block; vertical-align: top; padding: 5px 0px; color: #010101; font-weight: bold;} .photoStyle .item span:before{display: inline-block; content: "\f0d8"; font: normal normal normal 20px/1 FontAwesome; margin-right: 8px; color: #efca00; transform: translate(0, 1px);} @media (min-width: 576px){.photoStyle .item a img{max-height: 108px;} } @media (max-width: 767px){.photoStyle .item{width: 49%;} } @media (max-width: 480px){.photoStyle .item{width: 100%;} .photoStyle .item a{display: block; width: 100%; max-width: none;} .photoStyle .item a img{width: 100%; height: auto;} .photoStyle .item span{width: 100%;} } /*----------------photo end*/ /*------------publication start*/ .publicationShow{text-align: center;} .publicationShow .item{width: 25%; display: inline-block; max-width: 123px; vertical-align: top; font-weight: bold;} .publicationShow .item .imgDiv{margin-bottom: 8px;} .publicationStyle .mail{text-align: center; margin: 20px 0;} .activityReport, .list, .sms, .list, .propaganda{margin-bottom: 20px;} .activityReport span, .sms > span, .list span, .propaganda span{font-weight: bold; margin-bottom: 10px; display: block;} .activityReport ul:after, .list ul:after{content: ''; display: table; clear: both;} .activityReport ul li, .list ul li{float: left; width: 12.5%; margin-bottom: 6px;} .activityReport li a, .list li a{padding: 0 20px 0 0;} .sms li{border-bottom: 1px #aaa dashed; margin-bottom: 10px; padding: 0 0 10px;} .sms li:last-child{border-bottom: none;} .sms li span{border-right: 1px solid #333; padding-right: 5px; margin-right: 10px;} .sms li a{display: inline-block; margin-right: 10px; min-width: 42px;} .propaganda li{margin-bottom: 6px;} @media (max-width: 1170px){.activityReport ul li, .list ul li{width: 25%;} } @media (max-width: 769px){.activityReport ul li, .list ul li{width: 33.3333%;} } @media (max-width: 480px){.activityReport ul li, .list ul li{width: 50%;} .publicationStyle .publicationTable td{display: block; width:100% !important; text-align:center;} } /*------------publication end*/ /*-------------publicbrief start*/ .publicStyle{margin: 10px 0 0;} .publicStyle:after{content: ''; display: table; clear: both;} .publicStyle h2{font-size: 18px; font-weight: bold; margin-bottom: 6px;} .publicStyle .imgDiv{min-width: 180px; float: left; text-align: center;} .publicStyle .imgDiv a{display: block; margin-top: 5px; margin-bottom: 5px;} .publicStyle a.show_btn{margin-top: 15px;} .publicStyle a.show_btn:hover img{opacity: .7;} .publicStyle .infoDiv{width: calc( 100% - 210px ); float: right;} .publicStyle .infoDiv ul li ul{margin-left: 1.5em; font-size: 14px;} .publicStyle .infoDiv li a{display: block; padding: 3px 6px;} .publicStyle .infoDiv > ul > li > a{font-weight: bold; border-bottom: 1px solid #e6e6e6;} .publicStyle .infoDiv > ul > li > ul{margin-bottom: 10px;} .publicStyle li ul li a:before{content: "\f105"; display: inline-block; font: normal normal normal 14px/1 FontAwesome; padding-right: 8px;} .publicStyle li ul li ul li a:before{content: "-";} @media (min-width: 577px){.publicStyle .imgDiv{width:180px;} } @media (max-width: 576px){.publicStyle .imgDiv, .publicStyle .infoDiv{float: none; width: 100%;} .publicStyle .imgDiv{margin-bottom: 20px;} } @media (max-width: 320px){.publicStyle .infoDiv > ul > li > ul{margin-left: 0;} } /*-------------publicbrief end*/ /*---------------sitemap start*/ .main-content .sitemapStyle{line-height: 1.3; padding: 5px 0 0;} .sitemapStyle .item{width: 100%; display: inline-block; vertical-align: top; margin-bottom: 5px;} .sitemapStyle .item > a{font-weight: bold; line-height: 1.3em;} /*有第二層時使用此class*/ .itemListStyle{position: relative;} .itemListStyle:before{content: ''; display: table; width: 7em; height: 1px; border-bottom: 1px dotted #b9b9b9; position: absolute; top: 9px;} .item.itemListStyle > a{background-color: #fff; padding-right: 0.5em; position: relative; z-index: 10;} .item.itemListStyle > a:after{content: ''; position: absolute; left: 100%; top: 4px; color: #b9b9b9; width: 8px; height: 8px; border: 1px solid #b9b9b9; border-radius: 50%; background: #f8f8f8;} .itemListStyle .item_1{padding-top: 3px; padding-left: 7em; margin-top: -22px; position: relative; overflow: hidden;} .itemListStyle .item_1 .item_2:before{content: ''; border-left: 1px dotted #aaa; position: absolute; left: 0; top: 0; height: 76%;} .itemListStyle .item_1 .item_2{position: relative; left: 53px;} .itemListStyle .item_1:before{content: ''; display: table; width: 1px; height: 300px; border-left: 1px dotted #b9b9b9; position: absolute; top: 13px; left: 7em;} .itemListStyle .item_1:after{content: ''; display: table; height: 9px; width: 25px; position: absolute; bottom: 0; z-index: 30; background: #fff; left: 91px;} .itemListStyle .item_1 a{display: block; padding-left: 1.5em; position: relative; color: #666; width: 220px;} .itemListStyle .item_1 a:before{content: ''; display: table; width: 1em; height: 1px; border-bottom: 1px dotted #b9b9b9; position: absolute; left: 0px; top: 9px;} .itemListStyle .mainlink0{line-height: 1.3;} /*.item_1 a:after{content: ''; position: absolute; left: 17px; top: 7px; color: #b9b9b9; width: 8px; height: 8px; border: 1px solid #b9b9b9; border-radius: 50%; background: #fff;}*/ /* page table style */ .tablePublicationStyle{width: 100%; margin: 0 auto; border-spacing: 0; border-collapse: collapse;} .tablePublicationStyle > tbody > tr > td{border: 1px solid #ccd7ef; padding: 2px 3px; line-height: 1.8em;} .tablePublicationStyle > tbody > tr:nth-child(2n+1){background-color: #e6edfc;} .tablePublicationStyle table tr{background-color: rgba(0,0,0,0);} .tableEditStyle{width: 100%; /*table-layout: fixed;*/ margin: 0 auto; border-spacing: 0; border-collapse: collapse;} .tableEditStyle > table{margin-bottom: 40px;} .GridViewTable{border: 1px solid #ccd7ef;} .tableEditStyle tr.table-02-1, .tableEditStyle td.table-02-1, .informationtable .table_select, .GridViewTable > tbody > tr:nth-child(odd){background-color: #e6edfc;} .tableEditStyle tr, .GridViewTable > tbody > tr:nth-child(even){background-color: #fff;} .tableEditStyle th, .tableEditStyle td.tdTop, .tableEditStyle td.table-01, .GridViewTable td.tdTop, .tableEditStyle td.table-01-html, .tableEditStyle.tableHorizontalStyle .table-02, .tableEditStyle.informationtable th, .tableEditStyle .table-001 .table-03-1-html{background-color: #4b81ba; color: #fff; padding: 3px 3px; white-space: nowrap;} .tableEditStyle.nowrap-fix th{white-space: normal;} .tableEditStyle th, .tableEditStyle td, .tableEditStyle td.table-02, .tableEditStyle .table-02 td, .tableEditStyle td.table-03-1-html, .informationtable th, .GridViewTable > tbody > tr > td{border: 1px solid #ccd7ef; padding: 2px 3px; line-height: 1.8em;} .tableEditStyle td table td{border: 0; padding: 0;} .tableEditStyle td .table2EditStyle td{border: 1px solid #ccd7ef; padding: 2px 3px;} .GridViewTable > tbody > tr > td{vertical-align: middle;} .tableEditStyle td input, .GridViewTable td input{vertical-align: middle;} .tableEditStyle td ul{padding-left: 25px;} .tableEditStyle td li{list-style: disc;} .tableEditStyle.tableHorizontalStyle .table-02{} .tableEditStyle input[type='submit']{border: 1px solid #989898; background: #fff; color: #989898; padding: 0px 13px; border-radius: 3px; display: inline-block;} .tableEditStyle.table-tr-border1 tr + tr{border-top: 1px solid #ccd7ef;} .mobileOvxAuto{overflow-x: auto;} @media (max-width: 576px){.mobileOvxAuto .tableEditStyle{width: 800px !important;} } /* page table style end*/ /* page text/img style */ h3.orgtitle, .orgtitle, h3.orgtitle a{padding: 0px 0px 7px 0px; /*font-size: 16px;*/ line-height: 1.5; color: #f18d00; font-weight: bold;} h3.orgtitle{padding-bottom: 0;} h3.orgtitle span{padding-right: 6px;} .orgtitleColor{color: #ED9800;} /* PDF,history Download style */ .pdf-link a, .history-link a{color: #000; font-weight: bold;} .pdf-link a, .history-link a{border: 1px solid #d7d7d7; border-bottom: 4px solid #efefef; padding: 7px; border-radius: 3px; display: inline-block;} .pdf-link a:hover, .history-link a:hover{margin-top: 3px; border-bottom: 1px solid #d7d7d7; text-decoration: none; color: #f21e2a; background: rgba(0,0,0,.01);} .pdf-link .fa, .history-link .fa{color: #f21e2a; font-weight: bold; font-size: 18px; padding-right: 7px; border-radius: 50%; text-align: center;} /*img*/ .alineImg{display: flex; /*align-items: center; justify-content: center;*/ margin: 0 auto; justify-content: center;} .alineImg .imgDiv{/*flex:1;*/ text-align: center;} .alineImg .imgDiv img{max-width: 100%;} .alineImg .imgDiv.p5{padding: 5px;} .alineImg .imgDiv.p10, .alineImg .p10, .alineImg-s .p10{padding: 10px;} .alineImg.alignEnd{align-items: flex-end;} .alineImg.alignCenter{align-items: center;} /* ms_2 使用 */ .alineImg-s{display: flex; justify-content: space-around;} .imgBorder img{border: 1px solid #000;} img.imgW100{width: 100%; height: auto;} .EditImg1{margin: 0 auto;} .EditImg1 + .EditImg1{margin-top: 25px;} .alineImg span, .EditImg1 span, .EditImg2 span, .EditImg3 span, .EditImg4 span{display: block; font-weight: bold;} .alineImg span span, .EditImg1 span span, .EditImg2 span span, .EditImg3 span span, .EditImg4 span span{display: inline-block;} .alineImg span img, .EditImg1 span img, .EditImg2 span img, .EditImg3 span img, .EditImg4 span img{max-width: none; width: auto !important;} /* lightsource use */ .EditImg3.hasText-style .imgDiv{border: 1px solid #000;} .EditImg3.hasText-style span{font-weight: bold; padding: 5px 0; margin: 0;} /*img text*/ .topText span{margin-bottom: 10px;} .bottomText span{margin-top: 5px;} /*text*/ /*連結list排列時使用*/ .listStyle{line-height: 26px; margin: 10px 0 20px;} .listStyle.discStyle li{list-style: disc; margin: 0 0 0 16px; width: calc(100% - 16px);} .grid5List li{width: 24%; display: inline-block; white-space: nowrap;} /*list style:disc樣式時使用*/ .listStyleD ul, .EditText ul{padding-left: 23px; margin: 0 0 15px 1em;} .listStyleD ul li, .EditText ul li{list-style: disc;} .listStyleD ol, .EditText ol{padding-left: 23px; margin: 0 0 15px 1em;} .listStyleD ol li, .EditText ol li{list-style: decimal;} /*list style:decimal樣式時使用*/ ul.listStyleDecimal li{list-style: decimal;} /*消除list style:disc樣式時使用*/ .EditText ul.fixListstyle{padding-left: 0;} .EditText ul.fixListstyle li{list-style: none;} /*listLineStyle*/ ul.listLineStyle li{background: url(../img/top_bg.gif) 0 bottom repeat-x; margin-bottom: 4px;} table.listLineStyle td{border:0;} table.listLineStyle td div{background: url(../img/top_bg.gif) 0 bottom repeat-x; margin-bottom: 4px; line-height: 26px;} /* .EditText 純文字僅文字時使用*/ /* .tableTextGrid 表格寬度改為 100% 時使用 */ .block{display: block;} .alignCenter{text-align: center;} .alignRight{text-align: right;} p, .EditText, .tableTextGrid{margin-bottom: 12px; line-height: 1.625em;} .EditText table td{vertical-align: top;} .vertical-middle, .EditText table .vertical-middle{vertical-align:middle;} .ma15{margin: 15px 0;} p.ma0, .ma0, .EditText .ma0{margin: 0 !important;} p.ma-b0, .ma-b0, .EditText .ma-b0{margin-bottom: 0 !important;} .mobile-block{font-style: normal;} @media (max-width: 576px){.mobile-block{display: block;} .EditText table.mobile-td-inline td{display: inline;} } .tableTextGrid table{width: 100%;} .tableTextGrid td{line-height: 1.625em;} .tableTextGrid.table-td-align-m td{vertical-align: middle;} .main-content .tableTextGrid.table-td-padding-0 > tbody > tr > td{padding: 0;} /*milestone use*/ .tableTextGrid.table-td-paddingB-min > tbody > tr > td{padding-bottom: 2px;} /*for如何到NSRRC使用*/ .tableTextGrid .tabTitle{font-size: 16px; font-weight: bold; padding-top: 10px;} .tableTextGrid .tabTitle:before{content: ''; display: inline; border-left: 6px solid #000; padding-right: 10px;} .tableTextGrid .tabSubTitle{font-weight: bold; width: 22%;} .tableTextGrid .tabSubTitleLink{font-weight: normal;} .tabInsideTab .tabSubTitle{padding: 0 0 0 1em;} /*相關網站*/ .websiteTable2{display: block; padding: 20px 0 0;} .websiteTable3{margin: 0 0 0 1em;} /*同仁通訊錄 search use*/ /* fix table 無法移除且寬度失控且無法滾動問題*/ .fixW > tbody > tr > td{border: 0; width: 100%;} .fixW > tbody > tr{display: flex; flex-wrap: wrap;} .fixW{display: block;} .fixW > tbody{display: block; width: 100%;} /*解決 table 在 ie 無法計算寬度之問題*/ .fixW2{table-layout: fixed; width: 100%;} /*for同仁通訊錄desktop使用*/ .personalText{line-height: 1.8em;} .personalText ul{padding-left: 23px; margin-bottom: 15px;} .personalText li{list-style: disc;} .personalText div{display: inline;} .people-img{margin-bottom: 10px;} .personalText ol{padding-left: 23px; margin-bottom: 15px;} .personalText ol li{list-style: decimal;} @media (min-width: 767px){.people-box{position: relative;} .people-img{position: absolute; right: 0; top: 0;} .people-img + .tableTextGrid .desktop-paddingR{padding-right: 174px; word-break: break-all;} } /*並列均寬時使用*/ .flex{display: flex; line-height: 1.8em;} .flex-s{display: flex; line-height: 1.8em; flex-wrap: wrap;} .flex > div, .flex-s > div{/*flex: 1;*/} /*原版型style*/ .tabBox{line-height: 1.8em;} .tabBox a{color: #666; text-decoration: underline;} .tabBox a:hover{color: #1b96cf;} .style3{color: #336699;} .redboldfont{font-weight: bold; color: #CC0000; line-height: 1.8em;} .mainlink0{color: #1b96cf; line-height: 1.8em;} .content_p, p.content{text-indent: 1.6em;} .EditText .title2{font-weight: bold; margin: 0 0 8px;} .EditText .title{color: #f00; font-size: 1.2em; font-weight: bold; margin: 1em 0 8px;} .EditText p{text-align: justify; letter-spacing: 1px; margin: 0 0 20px; text-indent: 2em;} .smallfont{color: #888;} .boxW11{display: block; width: 11px; height: 1px;} .box6{display: block; width: 1px; height: 6px;} .box10{display: block; width: 1px; height: 10px;} .box15{display: block; width: 1px; height: 15px;} .box20{display:block; width:1px; height:20px;} /*分隔線style*/ .lineStyle{height: 8px; width: 100%; background: url(../../chinese/img/top_bg.gif) top center repeat-x; margin-bottom: 1px; margin-top: 1px;} .lineStyle + h3, .lineStyle + .EditText{margin-top: 15px;} /*頁面下方back ,top包的div*/ .backTop{text-align: right; margin-top: -6px;} .backTop a:last-child img{vertical-align: top;} /**/ .color-red{color: #fe3917; font-weight: bold; padding: 3px 0px; font-size: 16px; line-height: 1.5;} .space-nowrap{white-space: nowrap; vertical-align: top;} .min-w100{min-width: 100px;} .min-w150{min-width: 150px;} .min-w200{min-width: 200px;} .max-w100{max-width: 100px;} .max-w150{max-width: 150px;} .max-w200{max-width: 200px;} .max-w300{max-width: 300px;} .max-w550{max-width: 550px;} .inlineBlock{display: inline-block;} .center{text-align: center !important;} .right{text-align: right;} .fontB{font-weight: bold;} /*web*/ @media (min-width: 1070px){.EditText, .tabBox, .tableEditStyle td, .GridViewTable > tbody > tr > td, p, .tableTextGrid p, .listStyle, .flex, .flex-s{letter-spacing: 1px;} .alineImg.fixmaxW .imgDiv img{max-width: none;} } @media (min-width: 767px){.tableTextGrid > tbody > tr > td{padding-bottom: 15px;} /**/ .alineImg span, .EditImg1 span, .EditImg2 span, .EditImg3 span, .EditImg4 span{margin-bottom: 10px;} .alineImg span span, .EditImg1 span span, .EditImg2 span span, .EditImg3 span span, .EditImg4 span span{display: inline-block;} /*for同仁通訊錄desktop使用*/ .personalText > tbody > tr > td{padding-bottom: 15px;} .personalText .spacing-max{letter-spacing: 1em;} .personalText .spacing-b{letter-spacing: 0.33em;} /*for科學研究組使用*/ .mixTop{display: flex; -webkit-align-items: flex-start; align-items: flex-start; -webkit-justify-content: center; justify-content: center; /*margin-bottom: 12px;*/ justify-content: space-between; align-items: center; margin: 0 0 20px;} .mixTop h3{margin-bottom: 0;} .mixTop .desktopR{} .desktopR td{line-height: 1.8em;}.desktop-none{display:none;} } @media (min-width: 575px){.desktopW80{width: 80%;} .desktopW75{width: 75%;} .desktopW72{width: 72%;} .desktopW70{width: 70%; padding-right: 10px;} .desktopW65{width: 65%;} .desktopW68{width: 68%;} .desktopW50{width: 50%;} .desktopW35{width: 35%;} .desktopW30{width: 30%;} .desktopW25{width: 25%;} .flex.between{justify-content: space-between;} .desktop-ma-L-min{margin-left:8px;} } /*mobile*/ @media (max-width: 1070px){.grid5List li{width: 24.4%;} } @media (max-width: 767px){.alineImg{display: block;} .alineImg .imgDiv + .imgDiv{margin-top: 15px;} .alineImg .imgDiv.p10, .alineImg .p10{padding: 10px 0;} .tableTextGrid tr{display: block; margin-bottom: 15px;} .tableTextGrid td{display: block; width: 100% !important;} .personalText td{text-align: left;} .grid5List li{width: 49.4%;} .EditText img, img{height: auto;} /*.EditText table tr{display: block; margin-bottom: 12px;} .EditText table td{display: block; width: 100%;} .EditText table.tableWdefault tr, table.tableWdefault tr{display: table-row; width: auto;} .EditText table.tableWdefault td, table.tableWdefault td{display: table-cell; width: auto;} .EditText table.mobileTdWAuto td{display: inline; width: auto; padding-right: 5px;}*/ .mobileAutoW{width: auto !important;} .mobileInlineBlock{display: inline-block;} /**/ .alineImg + .alineImg, .alineImg + .EditImg1{margin-top: 20px;} .mixTop + .mobileOvxAuto .tableEditStyle{margin-top: 10px;} } @media (max-width: 576px){.flex{display: block;} .tabInsideTab .tabSubTitle{width: 100%;} .tabInsideTab td{padding: 0 0 0 1em;} /**/ .EditText img.mobileW100{width: 100%; display: block; margin-bottom: 20px;} .mobileW100{width: 100%; display: block;} .mobileCenter{text-align: center;} .mobileBottomS{padding-bottom: 15px;} .EditText.mobileBrNone br{display: none;} } @media (max-width: 480px){.alineImg .imgDiv img{width: 100%; height: auto; margin: 0;} .flex-s{display: block;} .flex-s br{display: none;} .EditText .ms4-text{width: 100%;} .EditText .fixMobileFlex{display: block;} .EditText .fixMobileFlex > *{width: 100%;} } @media (max-width: 375px){/* ms_2 使用 */ .alineImg-s .p10{padding: 10px 0;} .alineImg-s{display: block;} } @media (max-width: 320px){.grid5List li{width: 100%;} } /* page text/img style end*/ @media (max-width: 768px){.main-content .itemListStyle:before{display: none;} .main-content .item.itemListStyle > a:after{left: 3px; top: 4px;} .main-content .itemListStyle .item_1{padding-left: 0.5em; margin-top: -15px; padding-top: 23px; margin-bottom: 10px;} .main-content .itemListStyle .item_1:after{left: -6px;} .main-content .itemListStyle .item_1:before{left: 0.5em;} .item.itemListStyle > a{padding-left: 20px;} } @media (max-width: 480px){.sitemapStyle .item{margin-bottom: 20px;} } /*---------------sitemap end*/ /*-----------------tps_meeting start*/ .tps_meeting .imgText{color: #7B9EBD; font-size: 12px;} .tps_meeting .EditImg3.marginBox .imgDiv ~ .imgDiv{margin: 0 0 0 20px;} .boldfont{font-weight: bolder; vertical-align: top;} .tps_meeting .imgBlock{width: 200px; max-width: 100%;} @media(max-width: 576px){.tps_meeting .EditImg3.marginBox .imgDiv ~ .imgDiv{margin: 0;} .tps_meeting .meetingTable td, .tps_meeting .meetingTable td span{display: block;} .tps_meeting .meetingTable tr{display: block; margin: 10px 0 0;} .tps_meeting .meetingTable span{border-top: 1px #aaa dashed;} } /*-----------------tps_meeting end*/ /*-----------------jobsView end*/ .resume-page .address-flex{display: flex; justify-content: space-between;} .resume-page .address-flex input:first-child{width: 90px;} .resume-page .address-flex input:nth-child(2){width: calc( 100% - 100px );}/*-----------------jobs_info start*/.jobs-info.listStyleD ul{margin-left: 0; margin-top: 10px; margin-bottom: 10px; line-height: 1.4;}/*-----------------viewResume start*/@media(max-width: 767px){.molile-td-2line td:nth-child(odd){width: 160px; display: inline-block; text-align: right;} .molile-td-2line td:nth-child(even){width: calc( 100% - 160px ); display: inline-block;}}@media(max-width: 320px){.main-container .molile-td-2line td{width: 100%; display: block; text-align:left;} .molile-td-2line td:nth-child(even){margin-bottom: 6px;}}