﻿@charset "utf-8";
/* CSS Document */
/*=====================default page set=====================*/
.dtit{text-align:left; color:#031f53; width:100%;}
.dhotpro{display:flex; flex-wrap:wrap;}
.bloand0 .dhotpro .list .frm{background:#ec4c08; color:#fff; border-radius:.8rem; padding:1rem !important; display:flex; flex-wrap:nowrap; flex-direction: row;}
.bloand0 .dhotpro .list .frm:hover{box-shadow:0 0 10px rgba(0,0,0,0.3);}
.bloand0 .list .frm figure{width:50px;}
.bloand0 .list .frm section{width:calc(100% - 50px);}
.bloand0 .list h3.subject{padding:0;}
@media screen and (max-width:960px){/*desktop-small pad*/
.bloand0 .dhotpro .list{width:33% !important;}
}
@media screen and (max-width:767px){/*desktop-small pad*/
.bloand0 .dhotpro .list{width:50% !important;}
}
.bloand1 .dhotpro .list .frm,.bloand1 .list .frm{padding:10px !important; background:#fff; border-radius:1rem; border:1px solid #ccc; position:relative;}
.bloand1 .list .frm{overflow:hidden;}
.bloand1 .list .frm section{color:#031f53; text-align:center;}
.bloand1 .list .frm .innerhtml{font-size:1.1rem; font-weight:500;}
.bloand1 .list .frm figure{border-radius:7px; overflow:hidden;}
@media screen and (max-width:960px){/*desktop-small pad*/
.bloand1 .dhotpro .list,.bloand1 .list{width:33% !important;}
}
@media screen and (max-width:767px){/*desktop-small pad*/
.bloand1 .dhotpro .list,.bloand1 .list{width:50% !important;}
}
.bloand2{padding-bottom:30px;}
.bloand2 .dhotpro{justify-content:center;}
.bloand2 .list .frm{border:1px solid #edeef2; background:#f5f6f7; border-radius:.5rem; display:flex; flex-wrap:nowrap; flex-direction: row; align-items: center;}
.bloand2 .dhotpro .list .frm{padding:.3rem !important;}
.bloand2 .list .frm figure{width:15px;}
.bloand2 .list .frm section{width:calc(100% - 15px);}
.bloand2 .dhotpro .list h3.subject{color:#0464bd; position:relative; padding:.5rem; font-size:.95rem; font-weight:500;}
.bloand2 .dhotpro .list h3.subject::after{content:""; position:absolute; right:3px; top:50%; transform:translateY(-50%);}
.bloand2 .dhotpro .list .frm:hover h3.subject{color:#000;}

@media screen and (max-width:767px){/*desktop-small pad*/
.bloand2 .dhotpro .list{width:50% !important;}
}
/*Header區定義*/
@media screen and (max-width:767px){/*desktop-small pad*/

.logo a{padding:10px;}
}
/* 側邊選單：隱藏大分類、展開所有小分類 */
#submenu .subnav > ul > li{padding:0;}
#submenu .subnav > ul > li > a { display: none; }
#submenu .subnav > ul > li > ul.sub { display: block !important; }
#submenu .subnav > ul > li > ul > li > a {text-align:center; padding:10px 2rem;}
/*footerTs區定義*/
#footerTs{font-size:.85rem; overflow:hidden; padding:20px 0 0 0;}
#footerTs .BottomList{display:none;}
#footerTs .BottomCntA{width:100%; display:flex; align-items:top; flex-grow:1; justify-content:center;}
#footerTs .BottomCntB{flex-direction:column; padding:0 0 20px 0; position:relative; color:#fff;}


#footerTs .copyright{display:none;}
#footerTs .comname{text-align:center; margin:50px 0;}
@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;}

}
/*=====================default page set end=====================*/

@media screen and (max-width:767px){/*phone*/
#defaultimg{padding-top:0;}
}
/* syistop 覆蓋：移入 header 內，logo 左 syistop 右 */
#header .page{display:flex; align-items:center; justify-content:space-between; flex-direction:row;}
.syistop{position:static; width:auto; background:transparent; border:none; white-space:nowrap;}
.syistop{display:flex; flex-direction:column; align-items:flex-end; gap:4px;}
.syistop a{padding-right:18px;}
.syistop-links{font-size:.85rem; color:#333; line-height:1.4; display:flex; padding-bottom:5px;}
.syistop-links a{color:#333; text-decoration:none; padding:0 2px;}
.syistop-links a:hover{color:#ec4c08;}
.syistop-postbtn{display:inline-block; background:#ec4c08; color:#fff !important; padding:5px 18px; border-radius:4px; font-size:.9rem; font-weight:700; text-decoration:none; line-height:1.6;}
.syistop-postbtn:hover{background:#c93a00;}
@media screen and (max-width:767px){
.syistop{display:none;}
}
.nav{background:#012a59; justify-content: space-around;}
.nav .syisnav a{color:#fff;}
.nav .syisnav a:hover{color:#f0c15f;}
.prolist .main .list .frm:hover{box-shadow:0 0 1px rgba(100,100,100,1);}


/* 廣告標記篩選-customize */
.loan-tag-filter{margin:12px 0; padding:8px 0;}
.loan-tag-filter .page{display:flex; flex-wrap:wrap; grid-gap: 8px; flex-direction:row;}
.tag-btn{display:inline-block; width:calc(calc(100% - 56px) / 8); padding:5px; background:#f3f4f6;border-radius:10px;cursor:pointer; text-decoration:none;color:#031f53;font-size:.9rem;transition:all .2s; text-align: center;}
.tag-btn.active,.tag-btn:hover{background:#ec4c08; color:#fff;}
.loan-tags{margin:4px 0;}
.loan-tag{display:inline-block;padding:2px 9px;background:#f2f2f2;border-radius:12px;font-size:12px;margin:2px;color:#555;}
/*以下為預設功能用*/

/*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;}
}
/*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*/
.A0205 .page{max-width:960px;}
.A0205 .main .list h3.subject{width:calc(100% - 7em); display: inline-block;}
.A0205 .main .list .path{width:6em; display: inline-block;}
.A0205 .main .list .more{width:4em; display: inline-block;}
.A0205 .main .list{border-bottom:1px dotted #ccc;}
@media screen and (max-width:767px){/*phone*/
.A0205 .main .list section{ flex-wrap: wrap;}
.A0205 h3.subject{width:100%;}
.A0205 .main .list .path {width:50%;}
.A0205 .main .list .more{width:50%; 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;}
.A0403_class .main .list .frm,.A0403 .main .list .frm{position:relative; overflow:hidden;}
/*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 section{border-bottom:1px solid #ccc;}
.A0408_BCat .main .list .more{color:#0464bd;}
.A0408_BCat .main .list h3.subject{color:#031f53; letter-spacing:2px;}
.A0408_BCat .main .bloand1 .list section{border-bottom:none;}
/*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*/

.A0604 .list h3.subject{font-weight:normal; width:calc(100% - 5em); display:inline-block;}
.A0604 .list .more{width:5em; display:inline-block;}
.A0604 .list .more span{display:inline-block; border-radius:1em; padding:2px 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{padding:0;}
.A0604 .list .frm:hover .more span{background:#333;}
/*A0701*/
.A0701 .main .list{text-align:center;}
/*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;}

/* loan_detail 內頁 */
.loan-detail-card{background:#fff;border-radius:12px;box-shadow:0 0 10px rgba(0,0,0,0.1);padding:20px;margin:16px 0;}
.loan-detail-card h1.syis{text-align:left;}
.loan-detail-card figure{text-align:center; margin-top:30px; margin-bottom:30px;}
.loan-detail-card figure img{display:inline-block;}
.loan-cat-badge,.loan-tag-badge{display:inline-block;padding:2px 10px;background:#f3f6fc;border-radius:10px;font-size:1.2rem;font-weight:normal;margin-left:6px;vertical-align:middle;line-height:1.8;}
.loan-cat-badge{color:#0e39cc;}
.loan-tag-badge{color:#000;}
.loan-cta-btns{display:flex;gap:12px;margin:16px 0;}
.btn-call,.btn-line{flex:1;display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 16px;border-radius:8px;text-decoration:none;color:#fff;transition:all .2s ease;}
.btn-call{background:linear-gradient(to bottom,#035fe4,#023baf);}
.btn-line{background:linear-gradient(to bottom,#05b504,#029102);}
.btn-call:hover,.btn-line:hover{box-shadow:0 6px 16px rgba(0,0,0,0.35);transform:translateY(-2px);filter:brightness(1.15);color:#fff;}
.cta-icon{width:44px;height:44px;object-fit:contain;flex-shrink:0;}
.cta-txt{display:flex;flex-direction:column;align-items:flex-start;}
.cta-txt strong{font-size:1.8rem;line-height:1.3;}
.cta-txt small{font-size:1rem;font-weight:normal;opacity:0.9;}
@media screen and (max-width:767px){
.loan-cta-btns{flex-direction:column;}
}
.loan-reminder{background:#fff0f0;border:2px solid #f8b8b8;border-radius:8px;padding:16px 20px;margin:16px 0;}
.loan-reminder h2.dtit{color:#d30917; margin-top:0;}
.loan-reminder h3{color:#c0392b;margin:0 0 14px 0;font-size:1rem;font-weight:700;}
.loan-reminder-cards{display:flex; list-style:none; padding:0; margin:0;}
.loan-reminder-cards li{flex:1;padding:10px 30px;text-align:center;border-right:1px solid #f8b8b8;}
.loan-reminder-cards li .ri-icon{font-size:2rem;color:#c0392b;margin-bottom:8px;}
.loan-reminder-cards li h4{font-size:1rem;color:#000;margin:0 0 6px 0;line-height:1.4;}
.loan-reminder-cards li p{font-size:.9rem;color:#333;margin:0;line-height:1.4;}
@media screen and (max-width:767px){
.loan-cat-badge{font-size:.9rem;}
.loan-reminder-cards{flex-direction:column;gap:8px;}
.loan-reminder-cards li{width:100%;flex:none;display:grid;grid-template-columns:40px 1fr;grid-template-rows:auto auto;column-gap:12px;padding:10px 12px;border:none;text-align:left;}
.loan-reminder-cards li .ri-icon{grid-column:1;grid-row:1 / 3;font-size:1.6rem;margin-bottom:0;display:flex;align-items:center;justify-content:center;}
.loan-reminder-cards li h4{grid-column:2;grid-row:1;margin:0 0 2px 0;}
.loan-reminder-cards li p{grid-column:2;grid-row:2;margin:0;}
.tag-btn{width:calc((100% - 16px) / 3);}
}
.loan-similar{background:#fff;border-radius:12px;box-shadow:0 0 10px rgba(0,0,0,0.1);padding:20px;margin:16px 0;}
.loan-similar-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;}
.loan-similar-hd .dtit{margin:0;}
.loan-more-link{font-size:.9rem;color:#1a6fc4;text-decoration:none;white-space:nowrap;}
.loan-more-link:hover{text-decoration:underline;}
.loan-similar .dhotpro .list .frm{display:block;border:1px solid #eee;border-radius:8px;overflow:hidden;text-decoration:none;color:#031f53;padding:0;}
.loan-similar .dhotpro .list .frm figure{margin:0;}
.loan-similar .dhotpro .list .frm section{padding:8px;}
.loan-similar .dhotpro .list h3.subject{font-size:.95rem;margin:0;}
@media screen and (max-width:767px){
.loan-similar .dhotpro .list{width:50% !important;}
}
.loan-block-card{background:#fff;border-radius:12px;box-shadow:0 0 10px rgba(0,0,0,0.1);padding:20px;margin:16px 0;}
.loan-notice h2.dtit{text-align:left;margin:0 0 12px 0;color:#012a59;}
.loan-notice ol{margin:0;padding-left:1.5em;}
.loan-notice ol li{margin:6px 0;color:#444;line-height:1.6;}
/* loan_detail 內頁 end */
/* tagsrow 地區頁籤(高對比按鈕化+sticky黏頂) */
.tagsrow{display:flex; flex-wrap:nowrap; gap:8px; padding:8px 0 10px 0; position:sticky; top:0; z-index:290; background:#fff;}
.tagbtn{flex:1; display:block; text-align:center; padding:12px 8px; background:#0b3272; border-radius:8px; color:#fff; text-decoration:none; font-size:1.05rem; font-weight:600; border:1px solid #0b3272; border-top:4px solid #0b3272; transition:all .2s ease; position:relative; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; box-shadow:0 2px 5px rgba(11,50,114,.25);}
.tagbtn:hover{background:#1a4a9d; border-color:#1a4a9d; color:#fff; transform:translateY(-2px); box-shadow:0 5px 12px rgba(11,50,114,.35);}
.tagbtn.active{background:#ec4c08; border-color:#ec4c08; border-top:4px solid #a33305; color:#fff; font-weight:700; font-size:1.15rem; box-shadow:0 4px 12px rgba(236,76,8,.45);}
.tagbtn.active:hover{background:#d64405; border-color:#d64405; border-top-color:#a33305; transform:none;}
@media screen and (max-width:767px){
.tagsrow{overflow-x:auto; -webkit-overflow-scrolling:touch; gap:6px; padding:8px 0;}
.tagbtn{flex:0 0 auto; min-width:5.5em; padding:10px 16px; font-size:.95rem; border-radius:99em; border-top-width:1px;}
.tagbtn.active{font-size:1.02rem; border-top:1px solid #ec4c08;}
}
/* tagsrow 地區頁籤 end */

/* 廣告卡片 hover 強化 */
.list .frm{transition:transform .2s ease, box-shadow .2s ease;}
.list .frm:hover{transform:translateY(-4px); box-shadow:0 8px 18px rgba(0,0,0,.15);}
/* 廣告卡片 hover 強化 end */

/* 熱門借款類型列表(tagtypepage):卡片標題與縣市標籤置左,其他頁不受影響 */
.tagtypepage .list .frm section{text-align:left;}
.list .frm section .cat-tag{display:block; text-align:left;}
.list .frm section .cat-tag img{vertical-align:middle; margin-right:3px;}

/* detail頁 CTA 按鈕動態效果(光澤掃過+話筒搖動+LINE跳動) */
.btn-call,.btn-line{position:relative; overflow:hidden;}
.btn-call::after,.btn-line::after{content:''; position:absolute; top:0; left:-80%; width:50%; height:100%; background:linear-gradient(105deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.45) 50%, rgba(255,255,255,0) 100%); transform:skewX(-20deg); animation:ctaShine 3.2s ease-in-out infinite; pointer-events:none;}
.btn-line::after{animation-delay:1.6s;}
@keyframes ctaShine{0%{left:-80%;} 45%{left:130%;} 100%{left:130%;}}
.btn-call .cta-icon{animation:ctaRing 2.6s ease-in-out infinite; transform-origin:50% 50%;}
@keyframes ctaRing{0%,68%,100%{transform:rotate(0);} 72%{transform:rotate(-14deg);} 78%{transform:rotate(12deg);} 84%{transform:rotate(-9deg);} 90%{transform:rotate(6deg);} 96%{transform:rotate(-3deg);}}
.btn-line .cta-icon{animation:ctaBounce 2.6s ease-in-out infinite;}
@keyframes ctaBounce{0%,58%,100%{transform:translateY(0);} 68%{transform:translateY(-6px);} 78%{transform:translateY(0);} 86%{transform:translateY(-3px);} 94%{transform:translateY(0);}}
/* CTA 按鈕動態效果 end */
/* TOP 置頂角標 */
.top-badge{position:absolute; top:0; right:0; z-index:2; width:0; height:0; border-style:solid; border-width:0 48px 48px 0; border-color:transparent #ec4c08 transparent transparent;}
.top-badge::after{content:'TOP'; position:absolute; top:10px; left:20px; color:#fff; font-size:9px; font-weight:700; display:block; width:26px; text-align:center; transform:rotate(45deg); line-height:1;}
/* TOP 置頂角標 end */

/*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); }




/* 隱藏前台浮動按鈕 */
.fixedbtn{display:none;}
