﻿@charset "utf-8";
/* CSS Document */
:root {
--primary-color: #2b9b93;
--primary-bgcolor:#e9f5f4;
}
/*=====================default page set=====================*/
.shilind1{background:#e9f5f4; padding:50px 0;}
.shilind1 .dhotpro{display:flex; align-items: stretch;}
.shilind1 .dhotpro .list{display:flex; align-items: stretch;}
.shilind1 .dhotpro .list .frm{padding:20px !important; background:#fff; box-shadow:0 0 5px rgba(0,0,0,0.1);}
.shilind1 .list .frm h3.subject{font-size:.9rem; color:#000; font-weight:500;}
.shilind1 .list .frm .path{color:var(--primary-color); padding-top:0; margin-top:0;}
.shilind1 .list .more{text-align:left;}
.shilind1 .list .more span{letter-spacing:2px;}
@media screen and (max-width:767px){/*phone*/
	.shilind1{overflow:hidden;}
	.shilind1 .page{padding:0 40px;}
}
.A10401d1{background:url("../images/bg-dabout.jpg") no-repeat right; background-size:contain;}
.A10401d1 .page{max-width:1600px; padding:0;}
.A10401d1 table td:nth-of-type(1){width:62%; padding:0; line-height:0;}
.A10401d1 table td:nth-of-type(2){padding:0 2em;}
.A10401d1 table td{font-size:1rem; line-height:180%;}
.A10401d1 table td h2{font-size:25px; color:#000; letter-spacing:1px; line-height:130%;}
.A10401d1 table td .more a,.shilind2 .list .frm .more span{display:inline-block; padding:.4rem 3rem .4rem 1rem; background:var(--primary-color); color:#fff; border-radius:5px; position:relative;}
.A10401d1 table td .more a::after,.shilind2 .list .frm .more span::after{content:""; width:10px; height:10px; border:1px solid #fff; border-bottom:none; border-left:none; position:absolute; right:1rem; top:50%; display:block; transform:rotate(45deg) translateY(-50%);}
.A10401d1 table td .more a:hover{background:#333; color:#fff;}
@media screen and (max-width:1286px){/*desktop*/
.A10401d1 table td{font-size:.85rem; line-height:180%;}
.A10401d1 table td h2{font-size:1.8rem;}
}
@media screen and (max-width:960px){/*desktop-small pad*/
.A10401d1 .page{padding:0;}
.A10401d1 table td h2{font-size:1.1rem;}	
.A10401d1 table td:nth-of-type(1){width:100%; float:left;}
.A10401d1 table td:nth-of-type(2){width:100%; float:left;}
.A10401d1 table td:nth-of-type(2){padding:1em 2em;}
}
@media screen and (max-width:767px){/*phone*/
.A10401d1 table td:nth-of-type(1),.A10401d1 table td{width:100%; display:block; float:left;}
.A10401d1 table td .more{text-align:center;}
}
.shilind2{background: url("../images/bg.jpg") no-repeat bottom center; background-size:cover; background-attachment: fixed;}
.shilind2 .page{padding:70px 50px;}
.shilind2 .dhotpro{padding-top:40px;}
.shilind2 .list{display:wrap;}
.shilind2 .list .frm{display:flex; flex-direction:row;}
.shilind2 .list .frm figure{width:55%; padding:1rem;}
.shilind2 .list .frm section{width:45%; padding:1rem; color:#000; justify-content: center;}
.shilind2 .list .frm h3.subject{letter-spacing:2px; color:#000;}
.shilind2 .list.rr .frm{flex-direction:row-reverse;}
@media screen and (max-width:767px){/*desktop-small pad*/
.shilind2 .page{padding:70px 40px;}
.shilind2 .list .frm{flex-direction:column;}
.shilind2 .list .frm figure{width:100%; padding:10px;}
.shilind2 .list .frm section{width:100%; padding:10px;}
.shilind2 .list.rr .frm{flex-direction:column;}
}
.syisform input[type='text'], .syisform input[type='password'], .syisform select, .syisform textarea{border:1px solid #333;}
/*Header區定義*/
.logo a{padding:10px;}

/*footerTs區定義*/
#footerTs{font-size:.85rem; overflow:hidden; padding:40px 0 0 0;}
#footerTs .BottomList{display:none;}
#footerTs .page{align-items:flex-start;}
#footerTs .BottomCntA{width:calc(100% - 280px); display:flex; align-items:top; flex-grow:1; justify-content: space-between;}
#footerTs .BottomCntB{width:280px; position:relative; color:#fff;}
#footerTs .copyright{background:#2b9b93; justify-content:center;}
#footerTs .comname{text-align:center; margin:50px 0;}
#footerTs .BottomCntA p{font-size:1.2rem; padding:.8rem 0;}
#footerTs .BottomCntA ol{margin:0; padding:0; list-style:none;}
#footerTs .BottomCntA ol li{padding:3px 0; font-size:.9rem;}

@media screen and (max-width:767px){/*desktop-small pad*/
#footerTs .BottomCntA{width:100%; flex-wrap: wrap; flex-direction:column;}
#footerTs .BottomCntB{width:100%; flex-wrap: wrap; justify-content:center; text-align:center; margin-top:20px;}

}
/*=====================default page set end=====================*/
#defaultimg .page{max-width:1920px;}
#defaultimg{background:#eef1f5;}

.nav,.nav .syisnav{align-content:center;}
.syisnav a{font-size:1rem;}
.syisnav > li:nth-of-type(1) > a::before{content:url("../images/icon-tm1.png");}
.syisnav > li:nth-of-type(2) > a::before{content:url("../images/icon-tm2.png");}
.syisnav > li:nth-of-type(3) > a::before{content:url("../images/icon-tm3.png");}
.syisnav > li:nth-of-type(4) > a::before{content:url("../images/icon-tm4.png");}
.syisnav > li:nth-of-type(5) > a::before{content:url("../images/icon-tm5.png");}
.syisnav > li:nth-of-type(6) > a::before{content:url("../images/icon-tm6.png");}
.syisnav > li:nth-of-type(7) > a::before{content:url("../images/icon-tm7.png");}
.syisnav li a:hover{color:var(--primary-color);}
@media screen and (max-width:960px){/*phone*/
	.syisnav a{font-size:1.2rem;}
	.syisnav li a::before{display:none;}
}
.sidetit{color:var(--primary-color); margin-top:0;}
.prolist .main .list .frm:hover{box-shadow:0 0 1px rgba(100,100,100,1);}
/*以下為預設功能用*/

/*prodetail*/
.prodetail .main h1.syis{width:100%; float:right;}
.prodetail .main .sum{width:100% !important; float:right;}
.prodetail .main figure{padding-right:3em; width:100%;}
.prodetail .main .cnt::before{content:"詳細介紹"; font-size:16px; color:#999; display:block; width:100%; border-bottom:1px solid #ccc; font-weight:700; letter-spacing: 1px; margin:2em 0 1em 0;}
@media screen and (max-width:767px){/*phone*/
.prodetail .main h1.syis{width:100%; float:right;}
.prodetail .main .sum{width:100% !important; float:right;}
}
/*gadetail*/
.gadetail .ga{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(33%, 1fr));
  gap: 0;
}
.gadetail .ga .list{width:100% !important;}
.gadetail .ga .list .frm figure{
  display: block;
  aspect-ratio: 4 / 3;      /* 或改成 1/1 更方正 */
  overflow: hidden;
  border-radius: 6px;
}
.gadetail .ga .list .frm figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;        /* 關鍵:自動裁切填滿,不變形 */
}
.gadetail .ga .list .frm .innerhtml{display:none;}
@media screen and (max-width:767px){/*phone*/
.gadetail .ga {

  grid-template-columns: repeat(auto-fill, minmax(100%, 1fr));
}
}
/*Contact4*/
.Contact4{padding-bottom:0;}
.Contact4 .gmap .page{max-width:100%; width:100%;}
/*A0201 style*/
.A0201 .main .list .frm{background:#fff; box-shadow:0 0 5px rgba(200,200,200,.2);}
.A0201_detail h1.syis{text-align:center;}
/*A0202 style*/
.A0202 .page{max-width:960px;}
.A0202 .main .list{border-bottom:1px solid #ccc;}
/*A0203 A0204 style*/
@media screen and (max-width:767px){/*phone*/
.A0203_detail .side, .A0204_detail .side{display: none;}
}
/*A0204 style*/
/*A0205 style*/
.A0205Cat .main .list section + h3.subject{color:#000; border-bottom:1px solid #ccc;}
.A0205 .main .list .frm:hover h3.subject,.A0205.sub .list .frm:hover h3.subject{color:var(--primary-color);}
.A0205 .main .list section,.A0205.sub .list section{flex-direction:row; color:#000; justify-items: center;}
.A0205 .main .list h3.subject,.A0205.sub .list h3.subject{width:calc(100% - 10rem); display: inline-block; padding:0; order:1;}
.A0205 .main .list .path,.A0205.sub .list .path{width:6rem; display: inline-block; order:0;}
.A0205 .main .list .more,.A0205.sub .list .more{width:4rem; order:2; text-align: center;}
.A0205 .main .list .frm:hover .more span,.A0205.sub .list .frm:hover .more span{background: var(--primary-color);}
.A0205 .main .list .more span,.A0205.sub .list .more span{border-radius:1rem; display: inline-block; background:#666; color:#fff; width:4rem; text-align: center;}
.A0205 .main .list,.A0205.sub .list{border-bottom:1px dotted #ccc;}
@media screen and (max-width:767px){/*phone*/
.A0205 .main .list section,.A0205.sub .list section{flex-wrap: wrap;}
.A0205 .main .list h3.subject,.A0205.sub .list h3.subject{width:100%;}
.A0205 .main .list .path ,.A0205.sub .list .path {width:100%;}
.A0205 .main .list .more,.A0205.sub .list .more{width:100%; text-align: right;}
}
/*A0207*/
.A0207_class .main .list{text-align: center;}
.A0207_class .main .list .frm{background:#fff; box-shadow: 0 0 3px rgba(0,0,0,0.1);}
/*A0208*/
.A0208 .main .ptit{display:none;}
/*A0209*/
.A0209 .main .list h3.subject{width:calc(100% - 7em); display: inline-block;}
.A0209 .main .list .path{width:6em; display: inline-block;}
.A0209 .main .list .more{width:4em; display: inline-block;}
.A0209 .main .list{border-bottom:1px dotted #ccc;}
@media screen and (max-width:960px){/*desktop-small pad*/
/*A0209*/
.A0209 .main .list h3.subject{width:100%; display: inline-block;}
.A0209 .main .list .path{width:6em; display: inline-block; }
.A0209 .main .list .more{width:4em; display: inline-block; float:right;}
}
/*A0301*/
.A0301_detail .main h1{display:none;}
/*A0302*/
.A0302 .main .list{text-align:center;}
/*A0306*/
.A0306 .main .list .more{text-align:center;}
/*A0403*/
.A0403_class .main .list{text-align:center;}
.A0403 .main .list h3.subject{font-size:15px;}
/*A0404*/
.A0404_class .main .list{text-align:center;}
.A0404_class .main .list h3.subject{border-top:3px solid #666; background:#f5f5f5;}
.A0404_detail .subtit{display:none;}
.A0404_detail .prodetail .rr{width:100%;}
/*A0405*/
.A0405 .main .list .frm{padding:0;}
.A0405 .main .list h3.subject{font-size:16px;}
/*A0406*/
.A0406 .main .list figure, .A0406 .main .list section{width:50%; padding:0.5em; display:inline-block; float:left;}
.A0406 .main .list.rr figure{float:right;}
/*A0407*/
.A0407 .ptit{display:none;}
/*A0408*/
.A0408_BCat .main .list{text-align:center;}
.A0408_BCat .main .list .frm{background:#fff; box-shadow:0 0 3px rgba(0,0,0,0.1);}
.A0408 .main .list h3.subject{font-size:16px;}
/*A0501*/
.A0501 .main .list .frm{background:#fff; box-shadow:0 0 10px rgba(0,0,0,0.1);}
.A0501 .main .list .innerhtml{padding-left:30px; border-top:1px solid #ccc;}
/*A0502*/
.A0502 .main .list .frm{border:1px solid #ccc; position:relative;}
.A0502 .main .list .frm::before{content:""; width:45px; height:100%; position:absolute; top:0; left:0; background:#ccc; display: block; z-index: -1;}
.A0502 .main .list .innerhtml{padding:5px 0 5px 45px; border-top:1px solid #ccc;}
.A0502 .main .list h3.subject{padding:5px; margin-left:45px !important; text-indent: -45px !important;}
.A0502 .main .list h3.subject .foricon{color:#fff; text-align: center; font-size:30px; width:40px; line-height: 32px; margin-right:5px; display: inline-block; text-indent:initial;}
/*A0503*/
.A0503 .main .list{padding:0;}
.A0503 .main .list h3.subject{border-bottom:1px solid #ccc;}
.A0503 .main .list .innerhtml{padding-left:30px;}
/*A0601*/
.A0601 .main .list h3.subject .foricon{display:none;}
.A0601 .main .list .frm{background:#fff; box-shadow:0 0 10px rgba(0,0,0,0.1);}
/*A0602*/
.A0602 .main .list .frm{background:#fff; border:1px solid #efefef;}
.A0602 .main .list h3.subject{font-weight:normal;}
.A0602 .main .list h3.subject .foricon{padding:5px; opacity:.5; }
.A0602 .main .list h3.subject .foricon images{width:10px; height:auto; padding-top:10px;}
/*A0603*/
.A0603 .main .list h3.subject .foricon{padding:5px; opacity:.5; }
.A0603 .main .list .frm{background:#fff; border-radius:1em;}
/*A0604
.presentall .list, .presentall .list .frm{margin:0; padding:0;}
.presentall .list{margin-top:0.5em;}
*/
.A0604 .list h3.subject{font-weight:normal; width:calc(100% - 5rem); display:inline-block;}
.A0604 .list .more{width:5rem; display:inline-block;}
.A0604 .list .more span{display:inline-block; border-radius:1rem; padding:0 6px; background:#666; color:#fff;}
.A0604 .list h3.subject .foricon{padding:5px; opacity:.5; }
.A0604 .list{border-bottom:1px dotted #999; padding:0; margin:0;}
.A0604 .list .frm section{flex-direction:row; align-items: center; padding:0 4px;}
.A0604 .list .frm{padding:0;}
.A0604 .list .frm:hover .more span{background:var(--primary-color);}
.A0604 .list .frm:hover{background:#e9f5f4;}
.A0604 .list .frm:hover h3.subject{color:var(--primary-color);}
/*A0701*/
.A0701 .main .list{text-align:center;}
.A0701 .main .list .frm{border:1px solid #ccc;}
/*A0702*/
.A0702 .main .list h3.subject{font-weight:normal; width:calc(100% - 5em); display:inline-block;}
.A0702 .main .list .more{width:5em; display:inline-block;}
.A0702 .main .list .more span{display:inline-block; border-radius:1em; padding:2px 6px; background:#666; color:#fff;}
.A0702 .main .list h3.subject .foricon{padding:5px; opacity:.5; }
.A0702 .main .list{border-bottom:1px dotted #999; padding:0; margin:0;}
.A0702 .main .list .frm{padding:0;}
.A0702 .main .list .frm:hover .more span{background:#333;}
/*A1702*/
.A1702 .main .list{border-bottom:1px dotted #ccc;}
/*Contact4*/
.Contact4{padding-bottom:0;}
.Contact4 .gmap .page{max-width:100%; width:100%;}
/*A0901*/
.MBLayout h1{width:66%; float:right;}
.MBLayout figure{width:33%;}
.MBLayout .innerhtml.sum{width:66%; padding-left:2em;}
.MBLayout .innerhtml{margin-top:2em;}
@media screen and (max-width:767px){/*phone*/
.MBLayout figure,.MBLayout h1{width:100%; text-align: left; font-size:20px;}
.MBLayout .innerhtml.sum{width:100%; padding-left:0;}
}
/*QALayout*/
.QALayout .main .list h3.subject{text-indent:-30px; margin-left:30px;}
/*syis default product*/
.Ctlist .main .list{text-align:center;}

/*syis default download*/
.DWlist .main .list{border-bottom:1px dotted #ccc;}
.DWlist .main .list h3.subject, .DWlist .main .list .path{display:inline-block; vertical-align: top;}
.DWlist .main .list .frm{padding:0;}
.DWlist .main .list .path{width:6em; line-height:180%; padding:0.5em 0;}
.DWlist .main .list h3.subject{width:calc(100% - 6em); }

.deplist .main .list .frm{border:1px solid #ccc; padding:0;}
.deplist .main .list .frm section{color:#000; padding:0 10px; display:flex; flex-direction:row;}
.deplist .main .list .frm:hover{box-shadow:0 5px 10px rgba(100,100,100,0.1); border:1px solid #fff; background:var(--primary-bgcolor);}
.deplist .main .list .frm:hover h3.subject{color:var(--primary-color);}
.deplist .main .list .frm h3.subject{width:calc(100% - 6rem);}
.deplist .main .list .frm .more{width:6rem; display:flex; align-items: center; justify-content:flex-end;}

.act .main .list .frm{border:1px solid #ccc;}
.act .main .list .frm section{color:#000; padding:0 10px; display:flex;}
.act .main .list .frm:hover{box-shadow:0 5px 10px rgba(100,100,100,0.1); border:1px solid #fff; background:var(--primary-bgcolor);}
.act .main .list .frm:hover h3.subject{color:var(--primary-color);}
.deplist .main .list .frm h3.subject{width:100%;}

