@charset "UTF-8";

/* 自訂樣式/修改 */
.newsFilterBlock{
 width: 100%;
 height: 182px;
 display: flex;
 flex-wrap: wrap;
 align-items: stretch;
 padding-left: 5px;
 padding-right: 5px;
 margin-bottom: 24px;
 margin-top: 60px;
 overflow-y: scroll;
}
.newsFilter{
 width: 50%;
}
.newsFilterTitle{
 font-size: 20px;
 color: #AD0101; 
 text-align: center;
}
.newsFilterTitle span{
 display: block;
}
.newsFilterTitle span::after{
 content: '';
 display: block;
 width: 38px;
 height: 1px;
 border-bottom: 1px #AD0101 solid;
 margin: 9px auto 0 auto;
}
.newsFilterBox{
 width: 100%;
 padding: 8 22px 0 22px;
 margin-top: 14px;
}
div.newsFilter:nth-child(odd) .newsFilterBox{ 
 padding-left: 0;
 border-right: 1px #939393 solid;
}
.newsFilterBox form{
 width: 100%;
 display: flex;
 flex-wrap: wrap;
}
.newsFilterBox form div{
 width: 50%;
 position: relative;
 padding-left: 24px;
}
.newsFilterBox form div input{
 position: absolute;
 top: 2px;
 left: 0;
}
.newsFilterBox form div input[type=checkbox]:checked+label{
 color: #AD0101;
 text-decoration: underline;
}
.news_list .tagsBlock{
 width: 100%;
}
.news_list .tagsBlock span,.newsdetail .newsTag_editor span{
 display: inline-block;
 background-color: #F7EEE9;
 color: #063A60;
 margin-bottom: 2px;
}
.newsdetail .newsTag_editor span{
 margin-right: 5px;
}
.editor strong{font-weight: bold;}
.editor .tableTitle{
 width: 100%;
 margin: 30px 0;
}
.proClassDescription{
 width: 100%;
 max-width: 1024px;
 margin: 0 auto;
}

.proTopBtn{width: 100%;}
.proVideoBtnBox{
 margin-top: 30px;
 margin-bottom: 30px;
}
.pord_rblk .videoBtn{
 width: 100%;
 height: 56px;
 display: block;
 font-size: 16px;
 padding: 13px 10.5px;
 text-align: center;
 border-radius: 44px;
 color: #000000;
 border: 1px solid #000000;
 background-color: #ffffff;
 transition: all 0.3s ease-in-out;
}
.pord_rblk .videoBtn:hover{
 background-color: #AD0101;
 border-color: #AD0101;
 color: #ffffff;
}

.proTabTitle{
 width: 100%;
 display: flex;
 align-items: center;
}
.proTabTitle a{
 display: block;
 color: #000;
 margin-right: 3%;
}
.proTabTitle a.active,.proTabTitle a:hover{
 color: #AD0101;
}
.table-responsive.fir_txl table tr th:first-child, .table-responsive.fir_txl table tr td:first-child{width: auto;}
.table-responsive.fir_txl table tr th:nth-child(2){width: 20%;}
.table-responsive table tbody tr td.txt_redB{
 color: #FF0000;
 font-weight: bold;
}
.table-responsive table tbody tr td.txt_ongB{
 color: #fc9525;
 font-weight: bold;
}

/*2021產品主選單*/
header .nav .navBar .navMenu > li.more.multiMenu .wideMenu{
 width: 1571px;
 max-height: calc(100vh - 91px);
 left: 50%;
 transform: translateX(-50%);
 overflow-y: auto;
}
header.sticky .nav .navBar .navMenu > li.more.multiMenu .wideMenu{max-height: calc(100vh - 71px);}
header .nav .navBar .navMenu > li.more.multiMenu .moreMenu .multiM_top{
 padding: 0;
 flex-wrap: wrap;
 background-color: #F7F7F7;
}
.multiM_top a{
 cursor: pointer;
 color: #666666;
 display: flex;
 justify-content: center;
 align-items: center;
 font-size: 16px;
 transition: none;
}
.multiM_top .tabList{
 width: 100%;
 display: flex;
 align-items: center;
 border-bottom: 1px #B3B3B3 solid;
}
.multiM_top .tabList a{
 width: 33.33333%;
 height: 36px;
 font-size: 16px;
 border-right: 1px #B3B3B3 solid;
}
.multiM_top .tabList a:last-child{border-right: 0;}
.multiM_top .tabList a:hover,.multiM_top .tabList a.active{
 background-color: #AD0101;
 color: #fff;
}
.proOverview{
 width: 100%;
 display: flex;
 justify-content: center;
 padding: 24px 20px 20px 20px;
 border-bottom: 1px #B3B3B3 solid;
}
.proOverview a{font-size: 20px;}
.proOverview a i{
 font-size: 37px;
 margin-right: 10px;
}
.proOverview a span{border-bottom: 1px #F7F7F7 solid;}
.proOverview a:hover{
 color: #AD0101;
}
.proOverview a:hover span{
 border-bottom: 1px #AD0101 solid;
}
.multiM_top .tabContent,.multiM_top .tabBox{width: 100%;}
.multiM_top .listRow{
 width: 100%;
 display: flex;
 align-items: stretch;
 border-bottom: 1px #B3B3B3 solid;
}
.multiM_top .listTitle{
 width: 14.28571%;
 border-right: 1px #B3B3B3 solid;
 font-size: 27px;
 color: #666;
 display: flex;
 justify-content: center;
 align-items: center;
 margin: 18px 0 25px 0;
}
.tabBox > div:nth-child(2) .listTitle{margin: 12px 0;}
.multiM_top .listItem{
 width: 85.71429%;
 display: flex;
 flex-wrap: wrap;
 align-items: stretch;
}
.multiM_top .listItem a{
 width: 16.6666%;
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 align-items: flex-start;
 border-right: 1px #B3B3B3 solid;
 margin: 18px 0 25px 0;
 padding-top: 2px;
}
.tabBox > div:nth-child(2) .listItem a{margin: 12px 0;}
.multiM_top .listItem a:nth-child(6n){border-right:0;}
.multiM_top .listItem a:last-child{border-right:0;}
.multiM_top .listItem .iconBox{
 width: 100%;
 display: flex;
 justify-content: center;
 align-items: center;
 position: relative;
}
.multiM_top .iconBox img:not(.hoverImg){opacity: 1;}
.multiM_top .listItem .hoverImg{
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 z-index: 2;
 opacity: 0;
}
.multiM_top .listItem .itemName{
 text-align: center;
 line-height: 1.3;
 border-bottom: 1px #F7F7F7 solid;
 margin-bottom: 7px;
}
.multiM_top .listItem a:hover .itemName{
 color: #AD0101;
 border-bottom: 1px #AD0101 solid;
}
.multiM_top .listItem a:hover .iconBox img:not(.hoverImg){opacity: 0;}
.multiM_top .listItem a:hover .hoverImg{opacity: 1;}
.multiM_top .listItem .imgBox{
 width: 100%;
 /*height: 80px;*/
 display: flex;
 justify-content: center;
 align-items: center;
}
.multiM_top .listItem .imgBox img{
 max-width: 100%;
}
.multiM_bottom .listRow{
 width: 100%;
 display: flex;
 justify-content: center;
 align-items: center;
 padding: 10px 0 7px 0;
 border-bottom: 1px #B3B3B3 solid;
}
.multiM_bottom > div:first-child{padding: 8px 0 7px 0;}
.multiM_bottom div.listRow:last-child{border-bottom: 0;}
.multiM_bottom .listRow a{
 width: 20%;
 display: flex;
 align-items: center;
 font-size: 16px;
 color: #666;
}
.multiM_bottom .listRow .iconBox{
 display: inline-block;
 margin-right: 15px;
 position: relative;
}
.multiM_bottom .listRow img:not(.hoverImg){opacity: 1;}
.multiM_bottom .listRow .hoverImg{
 position: absolute;
 top: 0;
 left: 0;
 z-index: 2;
 opacity: 0;
}
.multiM_bottom .listItem .itemName{border-bottom: 1px #F7F7F7 solid;}
.multiM_bottom .listRow a:hover{color: #AD0101;}
.multiM_bottom .listRow a:hover img:not(.hoverImg){opacity: 0;}
.multiM_bottom .listRow a:hover .hoverImg{opacity: 1;}
.multiM_bottom .listRow a:hover .itemName{border-bottom: 1px #AD0101 solid;}
/*related product*/
.relatedProductBlock{
 width: 100%;
 overflow: hidden;
}
.relatedSlideBox{
 width: 100%;
 max-width: 998px;
 margin: 0 auto;
 overflow: hidden;
}
.relatedSlide{
 width: 100%;
 position: relative;
}
.relatedSlide .item{
 background-color: #fff;
 border: 1px #ccc solid;
}
.relatedSlide .item a{
 display: block;
 width: 100%;
 color: #666;
}
.relatedSlide .item .textBox{
 width: 100%;
 padding: 10px;
}
.relatedSlide .item h3{
 height: 40px;
 color: #AD0101;
 font-size: 16px;
 text-align: center;
 display: -webkit-box;
 -webkit-line-clamp: 2;
 -webkit-box-orient: vertical;
 overflow: hidden;
 text-overflow: ellipsis;
 margin-bottom: 10px;
}
.relatedSlide .item p{
 display: -webkit-box;
 -webkit-line-clamp: 3;
 -webkit-box-orient: vertical;
 overflow: hidden;
 text-overflow: ellipsis;
}
.relatedSlide .swiper-button-prev,.relatedSlide .swiper-button-next{
 background: none;
 background-color: #AD0101;
 color: #fff;
 margin-top: 0;
 transform: translateY(-50%);
 display: flex;
 justify-content: center;
 align-items: center;
 font-size: 20px;
}
.relatedSlide .swiper-button-prev{left: 0;}
.relatedSlide .swiper-button-next{right: 0;}
.gdprBlock_cont .more{color: #AD0101;}

@media (max-width: 1600px){
 header .nav .navBar .navMenu > li.more.multiMenu .wideMenu{width: 100%;}
}
@media (max-width: 1366px){
 .multiM_top .listTitle{
  font-size: 22px;
 }
 .multiM_top a{font-size: 14px;}
 .proOverview a span{font-size: 18px;}
 .proOverview a i{font-size: 33px;}
 .multiM_top .iconBox img{width: 27%;}
 .multiM_top .multiM_bottom .iconBox img{width: 82%;}
}
@media (max-width: 1200px){
 .multiM_top .listItem a{width: 33.33333%;}
 .multiM_top .listItem a:nth-child(4n),.multiM_top .listItem a:nth-child(6n){border-right:1px #B3B3B3 solid;}
 .multiM_top .listItem a:nth-child(3n){border-right:0;}
 .multiM_top .iconBox img{width: initial;}
 .multiM_top .multiM_bottom .iconBox img{width: initial;}
 .multiM_top a{font-size: 16px;}
 .proOverview a{font-size: 20px;}
 .proOverview a i{font-size: 37px;}
}
@media (min-width: 1170px){
 .multiM_bottom .listRow a{width: 25%;}
}
@media (min-width: 1081px){
 .columnBox{width: 75%;}
}
@media (max-width: 680px){
 .newsFilter{
  width: 100%;
  margin-bottom: 25px;
 }
 div.newsFilter:last-child{margin-bottom: 0;}
 div.newsFilter:nth-child(odd) .newsFilterBox{border-right: 0;}
}


/* cowboy 20220323 #43888 */
.formjump {
    display: none;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 15px;
    z-index: 100;
}

.formjump.show {
    display: flex;
}

.formjump > div {
    position: relative;
    width: 100%;
    max-width: 360px;
    max-height: 100%;
    padding: 40px 50px;
    background: #AD0101;
    border-radius: 20px;
}

@media (max-width: 480px) {
    .formjump > div {
        padding: 20px;
        overflow-y: auto;
    }
}

.formjump > div > .closebtn {
    position: absolute;
    display: block;
    top: -15px;
    right: -15px;
    width: 40px;
    height: 40px;
    color: #fff;
    font-size: 26px;
    line-height: 36px;
    text-align: center;
    background: #888;
    border-radius: 100%;
}

@media (max-width: 480px) {
    .formjump > div > .closebtn {
        top: 2px;
        right: 5px;
        width: 30px;
        height: 30px;
        font-size: 18px;
        line-height: 30px;
        background: unset;
    }
}

.formjump > div > form {
    width: 100%;
}

.formjump > div > form > .formtitle {
    color: #fff;
    font-size: 34px;
    font-weight: 700;
    line-height: 1.2;
    padding-bottom: 25px;
    margin-bottom: 30px;
    border-bottom: 1px solid #fff;
}

@media (max-width: 480px) {
    .formjump > div > form > .formtitle {font-size: 24px;}
}

.formjump > div > form > .formtxt {
    color: #fff;
    font-size: 16px;
    line-height: 1.4;
    margin-bottom: 30px;
}

.formjump > div > form > .formtxt > a {
    color: #fff;
    text-decoration: underline;
}

.formjump > div > form > input:not([type="submit"]),
.formjump > div > form > select {
    display: block;
    width: 100%;
    height: 40px;
    padding: 5px 10px;
    margin-bottom: 20px;
    border: 0;
    border-radius: 5px;
}

.formjump > div > form > input[type="submit"] {
    display: block;
    width: 100%;
    color: #AD0101;
    font-size: 16px;
    font-weight: 700;
    line-height: 50px;
    padding: 0 10px;
    background: #fff;
    border: 0;
    border-radius: 50px;
    cursor: pointer;
}