﻿/*上方公告*/
.top-bulletin{top:0;height:35px;padding:4px 0;background-color:#172439;color:white;position:fixed;z-index:19;overflow:hidden}
.top-bulletin-content{width:100%;display:flex;overflow:hidden}
.top-bulletin.hide{display:none}
.top-bulletin .megaphone{width:24px;height:24px;margin:2px 15px 2px 0;object-fit:contain}
.top-bulletin .content{max-width:calc(100% - 88px)}
.top-bulletin .content .item{float:left;font-size:16px;line-height:1.75;display:inline-block;white-space:nowrap;visibility:hidden;overflow:hidden;text-overflow:ellipsis}
.top-bulletin .content .item.swiper-slide-active{visibility:visible}
.top-bulletin .img-close{width:24px;height:24px;z-index:11}
/*有上方公告時index-header調整*/
.index-header{top:35px !important}
.index-header.hidetop{top:0 !important}
.index-header ~ .container .index-area0{height:35px}
.index-header.simple ~ .container .index-area0{height:26px}
.index-header.hidetop ~ .container .index-area0{height:0}
.index-header.hidetop.simple ~ .container .index-area0{height:0}
/*第1區塊banner*/
.index-area1{position:relative;height:500px;padding-left:0 !important;padding-right:0 !important;width:100%;overflow:hidden;max-width:unset !important}
.index-area1-1{background-image:var(--slide-web-1);background-repeat:no-repeat;background-position:bottom;background-size:cover}
.index-area1-2{background-image:var(--slide-web-2);background-repeat:no-repeat;background-position:bottom;background-size:cover}
.index-area1-3{background-image:var(--slide-web-3);background-repeat:no-repeat;background-position:bottom;background-size:cover}
.index-area1-1-1,.index-area1-2-1,.index-area1-3-1{padding-top:78px;height:114px;font-size:24px;font-weight:600;line-height:1.5;color:#3f5372}
.index-area1-1-2,.index-area1-2-2,.index-area1-3-2{padding-top:4px;height:100px;font-size:72px;font-weight:600;line-height:1.33}
.index-area1-1-2-1{height:100px;display:block !important;display:-webkit-inline-box !important;overflow:hidden}
.index-area1-1-2-1 .swiper-wrapper .swiper-slide{visibility:hidden}
.index-area1-1-2-1 .swiper-wrapper .swiper-slide.swiper-slide-active{visibility:visible}
.index-area1-1-3,.index-area1-2-3,.index-area1-3-3{padding-top:24px;display:flex;position:relative}
.index-area1-1-3-1,.index-area1-2-3-1,.index-area1-3-3-1{height:60px;width:620px;box-shadow:0 0 15px 0 rgba(23,36,57,0.25);font-size:20px;line-height:1.5;padding:15px 0 15px 20px;border:0;color:#8a919c}
.index-area1-1-3 .search,.index-area1-2-3 .search,.index-area1-3-3 .search{height:60px;width:60px}
.index-area1-1-3 .search img,.index-area1-2-3 .search img,.index-area1-3-3 .search img{height:32px;width:32px}
.index-area1-1-4{padding-top:40px;display:flex;box-sizing:border-box}
.index-area1-1-4-1{width:160px;height:60px}
.index-area1-1-4-1-1{height:60px;font-size:48px;font-weight:600;line-height:1.25;color:#3f5372}
.index-area1-1-4-1-2{height:36px;font-size:24px;font-weight:600;line-height:1.5;color:#3f5372}
.index-area1-1-4-1-3{height:28px;color:#8a919c}
.index-area1>.swiper-wrapper>div{position:relative}
.index-area1>.swiper-wrapper>div>div{position:relative}
.area1-pagination{text-align:right;max-width:1420px;margin-left:auto;margin-right:auto;right:70px}
.area1-pagination>.swiper-pagination-bullet{width:6px;height:6px;margin:0 6px;opacity:.7;background-color:#CCC}
.area1-pagination>.swiper-pagination-bullet-active:not(:first-child){opacity:1;background-color:#FFF}
.area1-pagination>.swiper-pagination-bullet:first-child{width:100px;height:4px;margin:1px 6px 1px 0;border-radius:3px}
.area1-pagination>.swiper-pagination-bullet .progressbar{width:0;height:4px;border-radius:3px;background-color:#FFF;transition:none}
.area1-pagination>.swiper-pagination-bullet-active .progressbar{width:0;height:4px;border-radius:3px;background-color:#FFF;transition:width 8s ease-in;display:block}
/*第2區塊排行*/
.index-area2{text-align:center;margin-bottom:173.5px;}
.index-area2-1,.index-area6-1{padding-top:120px}
.index-area2-2,.index-area5-2{padding-top:8px;font-size:24px;font-weight:600;line-height:1.5;color:#3f5372}
.index-area2-3{padding-top:60px}
.index-area2-3-1-1{position:relative;align-items:center}
.index-area2-3-1-1 .tab-header-item{height:46px;padding:0 15px 0 15px}
.index-area2-3-1-1 .tab-header-item .tw{width:16px;height:16px}
.index-area2-3-1-1 .tab-header-item .usa{width:16px;height:16px}
.index-area2-3-1-1{display:flex}
.index-area2-3-2 table th{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}
.index-area2-3-2 table th:nth-child(1){width:60%}
.index-area2-3-2 table th:nth-child(2){width:10%}
.index-area2-3-2 table th:nth-child(3){width:10%}
.index-area2-3-2 table th:nth-child(4){width:10%}
.index-area2-3-2 table th:nth-child(5){content:attr(wContent);width:10%}
.index-area2-3-2 table td:nth-child(1)>div{display:flex}
.index-area2-3-2 table td:nth-child(1) .td-item1{min-width:100px}
.index-area2-3-2 table td:nth-child(1) .td-item2{min-width:180px;max-width: 180px}
.index-area2-3-2 table td:nth-child(1) .td-item3{min-width:180px}
.index-area2-3-2 table td:nth-child(5) span{content:url(../../Images/Icon/icon-arrow-r.svg);width:24px;height:24px}
.index-area2-3-2 table td:nth-child(5) span:hover{content:url(../../Images/Icon/icon-calculator-blue.svg)}
.index-area2-4,.index-area6-4{margin-top:39.5px;display:flex;justify-content:center;position:relative}
.index-area2-4>a,.index-area6-4>a{height:60px;width:300px;padding:15px 0 15px 0;display:flex;justify-content:center}
/*第3區塊開戶*/
.index-area3{height:320px;background-image:url(../../Images/Common/img-account-w.png);background-position:center;background-size:cover;background-repeat:no-repeat}
.index-area3-1{padding-top:68px}
.index-area3-2{font-size:24px;font-weight:600;line-height:1.5;padding-top:8px}
.index-area3-3{margin-top:20px;display:flex;justify-content:center;position:relative}
.index-area3-3>*{height:60px;width:300px;padding:15px 0 15px 0;display:flex;justify-content:center}
/*第5區塊瞻前顧後*/
.index-area5{padding-top:122px;padding-bottom:120px;background-image:url(../../Images/Common/bg-service-pc.png);background-repeat:no-repeat;background-color:#e6ebf5;background-attachment:fixed;background-size:cover;background-position-y:center;text-align:center}
.index-area5-3{padding:48px 60px 0 60px;display:flex;align-items:center;justify-content:center}
.index-area5-3-1{width:420px;height:546px;margin-left:20px;padding:48px 0 32px}
.index-area5-3-1:first-child{margin-left:0}
.index-area5-3-1:nth-child(1)>.index-area5-3-1-1::after{display:inline-block;content:"";width:274px;height:274px;background-image:url(../../Images/Common/img-lend.png);background-size:274px 274px}
.index-area5-3-1:nth-child(2)>.index-area5-3-1-1::before{display:inline-block;content:"";width:274px;height:274px;background-image:url(../../Images/Common/img-trend.png);background-size:274px 274px}
.index-area5-3-1:nth-child(3)>.index-area5-3-1-1::after{display:inline-block;content:"";width:274px;height:274px;background-image:url(../../Images/Common/img-borrow.png);background-size:274px 274px}
.index-area5-3-1-1-2{text-align:center;color:#8a919c}
.index-area5-3-1-2{margin-top:32px;display:flex;justify-content:center;position:relative}
.index-area5-3-1-2>*{height:48px;width:137px}
/*第6區塊常見問題*/
.index-area6{background-color:#3f5372;text-align:center;padding-bottom:100px}
.index-area6-2{padding-top:8px;font-size:24px;font-weight:600;line-height:1.5}
.index-area6-3{margin-top:48px}
.index-area6-3-1{margin-top:12px;width:100%;text-align:left}
.index-area6-3-1-1{padding:17px 20px 15px;background-color:#e6ebf5}
.index-area6-3-1-2{background-color:#FFF;padding:30px 57px 50px}

/****** RWD Setting ******/
@media screen and (max-width:767px){
/*上方公告*/
.top-bulletin{height:31px;padding:7px 0}
.top-bulletin .content{max-width:calc(100% - 20px)}
.top-bulletin .content .item{font-size:13px;line-height:1.38}
.top-bulletin .img-close{width:16px;height:16px}
/*有上方公告時index-header調整*/
.index-header{top:31px !important}
.index-header.hidetop{top:0 !important}
.index-header ~ .container .index-area0{height:31px}
.index-header.hidetop ~ .container .index-area0{height:0}
/*第1區塊banner*/
.index-area1{height:400px;width:100%;overflow:hidden}
.index-area1-1{background-image:var(--slide-mobile-1);background-size:cover;width:100%}
.index-area1-2{background-image:var(--slide-mobile-2);background-repeat:no-repeat;background-position:bottom}
.index-area1-3{background-image:var(--slide-mobile-3);background-repeat:no-repeat;background-position:bottom}
.index-area1-1-1,.index-area1-2-1,.index-area1-3-1{margin-top:32px;padding-top:0;height:32px;font-size:22px;text-align:center}
.index-area1-1-2,.index-area1-2-2,.index-area1-3-2{padding-top:4px;height:46px;font-size:36px;font-weight:600;line-height:1.28;text-align:center}
.index-area1-1-2-1{height:46px}
.index-area1-1-2-1 .swiper-wrapper{width:auto}
.index-area1-1-3,.index-area1-2-3,.index-area1-3-3{padding:20px 20px 0 20px}
.index-area1-1-3-1,.index-area1-2-3-1,.index-area1-3-3-1{height:44px;width:calc(100% - 44px);box-shadow:0 0 15px 0 rgba(23,36,57,0.25);font-size:14px;line-height:1.71;padding:10px 0 10px 16px}
.index-area1-1-3 .search,.index-area1-2-3 .search,.index-area1-3-3 .search{height:44px;width:44px}
.index-area1-1-3 .search img,.index-area1-2-3 .search img,.index-area1-3-3 .search img{height:24px;width:24px}
.index-area1-1-4{padding:80px 24px 0 24px;display:block;box-sizing:border-box}
.index-area1-1-4-1{width:auto;height:36px;display:flex;align-items:flex-end}
.index-area1-1-4-1-1{height:36px;font-size:24px;font-weight:600;line-height:1.5}
.index-area1-1-4-1-2{height:24px;font-size:14px;font-weight:600;line-height:1.71;padding-left:4px}
.index-area1-1-4-1-3{height:24px;padding-left:8px}
.index-area1>.swiper-wrapper>div{position:relative;height:400px}
.index-area1>.swiper-wrapper>div>div{position:relative}
.area1-pagination{margin-right:unset;right:23px}
/*第2區塊排行*/
.index-area2{margin-bottom:50px}
.index-area2-1,.index-area6-1{padding-top:50px}
.index-area2-2,.index-area5-2,.index-area6-2{padding-top:4px;font-size:16px;font-weight:600;line-height:1.5}
.index-area2-3{padding-top:32px}
.index-area2-3-1-1 .tab-header-item{height:58px;padding:12px 20px 12px 20px}
.index-area2-3-1-1 .tab-header-item.tw:before{margin-right:4px}
.index-area2-3-1-1 .tab-header-item.usa:before{margin-right:4px}
.index-area2-3-2 table thead tr{height:38px}
.index-area2-3-2 table th:nth-child(1){min-width:auto}
.index-area2-3-2 table th:nth-child(2){display:none}
.index-area2-3-2 table th:nth-child(3){width:80px}
.index-area2-3-2 table th:nth-child(4){width:80px}
.index-area2-3-2 table th:nth-child(5){width:55px;content:attr(mContent)}
.index-area2-3-2 table td:nth-child(1)>div{display:block}
.index-area2-3-2 table td:nth-child(1){padding:8px 0 7.5px 8px}
.index-area2-3-2 table td:nth-child(1) .td-item1{width:100%}
.index-area2-3-2 table td:nth-child(1) .td-item2{width:100%;font-size: 12px;font-weight: normal;line-height: 1.5}
.index-area2-3-2 table td:nth-child(1) .td-item3{display:none}
.index-area2-3-2 table td:nth-child(2){display:none}
.index-area2-3-2 table td:nth-child(5){padding:8px 0 7.5px 8px}
.index-area2-3-2 table td:nth-child(5) span{width:20px;height:20px}
.index-area2-4,.index-area6-4{margin-top:24px}
.index-area2-4>a,.index-area6-4>a{height:48px;width:240px;padding:10px 0 10px 0}
/*第3區塊開戶*/
.index-area3{margin-top:50px;height:284px;background-image:url(../../Images/Common/img-account-m.png);background-size:cover;width:100%}
.index-area3-1{padding:44px 68px 0 67px;display:block}
.index-area3-1 div{text-align:center}
.index-area3-2{font-size:14px;padding-top:4px}
.index-area3-3>*{height:48px;width:240px;padding:10px 0 10px 0}
/*第5區塊瞻前顧後*/
.index-area5{padding-top:50px;padding-bottom:50px;background-image:url(../../Images/Common/bg-service-m-2.png);text-align:center;background-size:100% auto}
.index-area5-3{padding:32px 0 0 0;display:block}
.index-area5-3-1{width:unset;height:178px;margin-left:16px;margin-right:16px;padding:20px 16px 20px 16px;margin-top:20px;position:relative}
.index-area5-3-1:first-child{margin-left:16px;margin-right:16px}
.index-area5-3-1:nth-child(1)>.index-area5-3-1-1::after{width:140px;height:140px;background-size:140px 140px;position:absolute;right:0;top:38px}
.index-area5-3-1:nth-child(2)>.index-area5-3-1-1::before{width:140px;height:140px;background-size:140px 140px;position:absolute;right:0;top:38px}
.index-area5-3-1:nth-child(3)>.index-area5-3-1-1::after{width:140px;height:140px;background-size:140px 140px;position:absolute;right:0;top:38px}
.index-area5-3-1-1-1{text-align:left}
.index-area5-3-1-1-2{text-align:left;width:180px}
.index-area5-3-1-2{margin-top:30px;justify-content:left}
.index-area5-3-1-2>*{height:24px;width:130px;justify-content:left}
/*第6區塊常見問題*/
.index-area6{padding-bottom:51.5px}
.index-area6-3{margin-top:3px}
.index-area6-3-1-1{padding:12px 12px}
.index-area6-3-1-1 span{padding-left:8px}
.index-area6-3-1-2{padding:12px 12px 12px 12px}
}

