html.cathay_smart.smart_bg ,
body.cathay_smart.smart_bg {
background-color: #F5F5F5;
}
spanRed {color:red;}
spanGreen {color:#26A862;}
html.cathay_smart ,
body.cathay_smart {
width: 100%;
height: 100%;
-webkit-overflow-scrolling: touch;
min-height: 100%;
overflow: hidden;
}
.wrap {
background-repeat: no-repeat;
background-size: cover;
overflow: hidden;
min-height: 100%;
}
.border_gray {
border-bottom: 2px solid #EBEBEB;
}
/* header */
.wrap .header {
height: 50px;
color: #3A3A3A;
text-align: center;
display: table;
width: 100%;
top: 0;
z-index: 999;
background-color: #F5F5F5;
position: fixed;
}
.header .txt {
display: table-cell;
vertical-align: middle;
font-size: 18px;
height: 50px;
}
.logo {
width: 27px;
height: 24px;
background: url(../images/logo.png);
display: inline-block;
vertical-align: middle;
margin-right: 9.6px;
margin-bottom: 4px;
}
.heder_back {
position: absolute;
width: 24px;
height: 24px;
top: 14px;
left: 11px;
cursor: pointer;
display: none;
}
.heder_service {
position: absolute;
width: 24px;
height: 24px;
top: 14px;
right: 11px;
cursor: pointer;
}
.header_content {
display: table;
margin: 0px auto;
}
.header_service ul {
list-style: none;
}
.header_service {
display: none;
}
.header_service li {
text-align: left;
padding: 10px 20px;
}
.header_service li a{
color: #3A3A3A;
font-weight: 700;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-size: 14px;
line-height: 19.4px;
}
.header_service li a:hover{
text-decoration: none;
}
.header_service i {
width: 24px;
height: 24px;
display: table;
float: left;
}
.header_service img {
margin: -2px -5px;
}
.header_service ul {
padding: 0px 15px;
}
.header_service li:hover {
background-color: #EBEBEB;
}
.sat_content p a {
text-decoration: underline;
}
.sat_content p {
padding: 0px 10px;
}
.sat_content span {
color: #26A862;
}
.sat_content_sat {
max-width: 350px;
margin: 0px auto;
font-size: 15px;
padding: 0px 10px;
}
/* header end */
/* content */
.sub_input > input[type=text]:focus, .sub_input > input[type=number]:focus, .sub_input > input[type=password]:focus, .sub_input > textarea:focus, .sub_input > select:focus, .bankcode input:focus{
-webkit-box-shadow: inset 0 0px 0px rgba(0, 0, 0, .075);
box-shadow: inset 0 0px 0px rgba(0, 0, 0, .075);
border:1.5px solid #34BC6A;
}
.wrap .content {
margin-top: 50px;
padding-top: 15px;
box-sizing: border-box;
padding-bottom: 15px;
padding-left: 15px;
padding-right: 15px;
overflow-y: auto;
overflow-x: hidden;
height:calc(100vh - 110px);
margin-bottom:60px;
}
/* content */
.wrap .content.phone {
margin-top: 0px;
padding-top: 15px;
box-sizing: border-box;
padding-bottom: 15px;
padding-left: 15px;
padding-right: 15px;
overflow-y: auto;
overflow-x: hidden;
height:calc(100vh - 60px);
margin-bottom:60px;
}
.robot {
width: 100%;
position: relative;
}
.robot .dialog-box {
padding-left: 28px;
color: #3A3A3A;
font-size: 16px;
padding-right: 20px;
}
.robot .dialog-box .message {
display: inline-block;
padding: 12px 16px;
background-color: #fff;
border-radius: 12px;
margin-bottom: 10px;
color: #3A3A3A;
box-shadow: 0px 8px 10px 0px #DDE8DD;
-moz-box-shadow: 0px 8px 10px 0px #DDE8DD; /* ���� Firefox �M�λy�k */
-webkit-box-shadow: 0px 8px 10px 0px #DDE8DD; /* ���� Safari �M Chrome �M�λy�k */
box-shadow: 0px 8px 10px 0px rgba(68,68,68,0.05); /* ���� Opera 10.5 + �M�λy�k */
position: relative;
margin-left: 16px;
z-index: 1;
font-size: 16px;
font-weight: 300;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
}
/*.robot .dialog-box .message::before {*/
/* content: "";*/
/* position: absolute;*/
/* width: 39px;*/
/*height: 23px;*/
/*background-image: url(../images/robot.png);*/
/*background-repeat: no-repeat;*/
/*top: 5px;*/
/* left: -9px;*/
/* z-index: -1;*/
/*}*/
.robot .dialog-box .message.dotpadding{
padding: 14px 10px 8px 10px;
}
.robot .dialog-box .select-card {
/*white-space: nowrap;*/
overflow-x: auto;
padding-left: 20px;
}
.segment {
display: inline-block;
vertical-align: top;
padding: 0;
background-color: #FFF;
border-radius: 0 12px 12px 12px;
box-shadow: 0px 8px 10px 0px #DDE8DD;
-moz-box-shadow: 0px 8px 10px 0px #DDE8DD; /* 嚙踝蕭嚙踝蕭 Firefox 嚙瞎嚙諄語嚙糊 */
-webkit-box-shadow: 0px 8px 10px 0px #DDE8DD; /* 嚙踝蕭嚙踝蕭 Safari 嚙瞎 Chrome 嚙瞎嚙諄語嚙糊 */
box-shadow: 0px 8px 10px 0px #DDE8DD; /* 嚙踝蕭嚙踝蕭 Opera 10.5 + 嚙瞎嚙諄語嚙糊 */
width: 250px;
word-break:break-all;
}
.segment.secard {
width: 200px;
}
.segment .txt{
padding:16px 16px;
position: relative;
}
.robot .dialog-box .segment .txt .title,.slider .segment .txt .title,.robot .dialog-box .secard .txt .title{
font-size: 16px;
font-weight: 700;
color: #3A3A3A;
}
.font-weight-300 * {
font-weight: 300;
}
.otpLogin {
margin-top: 20px;
}
.otpLogin * {
font-size: 16px;
color: #3A3A3A;
line-height: 22px;
}
.robot .dialog-box .segment .txt .desc {
font-size: 16px;
color: #3A3A3A;
font-weight: 300;
}
.bill-number{
padding: 16px;
}
.robot .dialog-box .segment .bill-number{
font-weight: 700;
font-size: 16px;
color: #3A3A3A;
margin-bottom: 5px;
}
.robot.bill-number{
color: #FF8500;
text-align: right;
}
.num{
color: #3A3A3A;
text-align: right;
font-weight: 400;
}
.title,.title *{
font-weight: 300;
font-size: 16px;
color: #3A3A3A;
margin-bottom: 5px;
text-align:left;
}
.robot .dialog-box .segment .txt .title,.slider .segment .txt .title-w5{
font-weight: 700;
}
.title:last-child {
margin-bottom: 0px;
}
.robot .dialog-box .segment .bill-number .desc{
font-size: 16px;
color: #676767;
text-align:left;
font-weight: lighter;
}
.robot .dialog-box .segment .btn-bottom a,.slider .segment .btn-bottom a ,.robot .dialog-box .secard a{
text-align: center;
color: #26A862;
display: block;
padding: 11px;
border-top: 2px solid #EAEAEA;
text-decoration: none;
line-height: 21px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-weight: 700;
font-size: 16px;
}
.robot .dialog-box .segment .btn-bottom a:last-child,.slider .segment .btn-bottom a:last-child{
border-radius: 0 0px 12px 12px;
}
.robot .dialog-box .segment .btn-bottom a:hover,.slider .segment .btn-bottom a:hover {
color: #0E8645;
outline: none;
}
.robot .dialog-box .segment .btn-bottom a:focus,.slider .segment .btn-bottom a:focus {
outline: none;
}
.robot .dialog-box .segment-map{
min-width: 100%;
padding: 0;
background-color: #fff;
border: 1px solid #ABCABB;
border-radius: 0 12px 12px 12px;
margin-right: 6px;
margin-bottom: 7px;
overflow: hidden;
}
.robot .dialog-box .segment-map .map{
width: 100%;
height: 180px;
background: #eee;
position: relative;
border-radius: 0 12px 0 0 ;
}
.robot .dialog-box .segment-map .desc{
padding: 20px 14px;
background: #FFFFFA;
}
.robot .dialog-box .weather-box{
display: table;
margin: -7px -14px;
border-radius: 0 12px 12px 12px;
overflow: hidden;
}
.robot .dialog-box .weather-box .tip{
display: table-cell;
vertical-align: middle;
padding: 7px 14px;
width: calc(100% - 113px);
}
.robot .dialog-box .weather-box .weather{
display: table-cell;
vertical-align: middle;
background-color: #FFF5EB;
color: #FF8500;
width: 113px;
padding: 7px 14px;
white-space: nowrap;
}
.robot .dialog-box .weather-box .weather span{
vertical-align: middle;
}
.icon-border{
border: 1px dashed #ccc;
border-radius: 4px;
display: inline-block;
width: 42px;
height: 42px;
text-align: center;
vertical-align: middle;
}
.icon-weather-rain{
background: url(../images/icon_weather_rain_2x.png);
background-repeat: no-repeat;
width: 33px;
height: 37px;
background-size: 33px 37px;
display: inline-block;
vertical-align: middle;
}
.img-creditcard {
width: 200px;
height: 130px;
border-radius: 0 12px 0px 0px;
}
.img-creditcard img, .img-credbank img {
border-radius: 0 12px 0px 0px;
}
.card_img img{
border-radius: 0 0px 0px 0px;
}
.img-creditcard.card_img{
background-image: url(../images/task05_bg.jpg);
background-repeat: no-repeat;
padding-left: 30px;
padding-top: 23px;
width: 200px;
height: 130px;
overflow: hidden;
}
.img-creditcard.card_img2{
background-image: url(../images/task05_bg02.jpg);
background-repeat: no-repeat;
padding-left: 30px;
padding-top: 23px;
width: 200px;
height: 130px;
overflow: hidden;
}
.img-creditcard.card_img img{
width: 140px;
}
.img-outurldiv{
width: 225px;
height: 140px;
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
border-radius: 0 12px 0px 0px;
margin: 0 auto;
position: relative;
transform:translateY(10%);
}
.img-credbank{
width: 250px;
height: auto;
border-radius: 0 12px 0px 0px;
}
.img-credbank01{
width: 250px;
height: 165px;
background: url(../images/card14.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
border-radius: 0 12px 0px 0px;
}
.img-credbank01.cre-card{
width: 200px;
height: 130px;
background: url(../images/card14.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 200px 130px;
border-radius: 0 12px 0px 0px;
}
.cre-card p{
margin: 0 0 0px;
}
.img-credbank05{
width: 250px;
height: 165px;
background: url(../images/card07.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
border-radius: 0 12px 0px 0px;
}
.img-credbank06
{
width: 250px;
height: 100px;
background: url(../images/card13-1.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 100%;
border-radius: 0 12px 0px 0px;
}
.img-credbank06 p {
height: 100px;
color: #3A3A3A;
width: 160px;
display: flex;
justify-content: center;
align-items: center;
padding: 0px 20px;
}
.img-credbank07
{
width: 250px;
height: 165px;
background: url(../images/card22.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 100%;
border-radius: 0 12px 0px 0px;
}
.img-credbank07 p {
font-weight: 700;
text-align: center;
color: #3A3A3A;
display: flex;
align-items: center;
justify-content: center;
display: -webkit-flex;
-webkit-align-items: center;
-webkit-justify-content: center;
width: 250px;
height: 125px;
padding: 0px 30px;
}
.img-credbank00.flag01{
width: 250px;
height: 165px;
background: url(../images/flag01.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
}
.img-credbank00.flag02{
width: 250px;
height: 165px;
background: url(../images/flag02.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
}
.img-credbank00.flag03{
width: 250px;
height: 165px;
background: url(../images/flag03.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
}
.img-credbank00.flag04{
width: 250px;
height: 165px;
background: url(../images/flag04.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
}
.img-credbank00.flag05{
width: 250px;
height: 165px;
background: url(../images/flag05.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
}
.img-credbank00.generic{
width: 250px;
height: 118px;
background: url(../images/card24.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 118px;
border-radius: 0 12px 0px 0px;
}
.img-credbank10{
width: 250px;
height: 165px;
background: url(../images/card34.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
border-radius: 0 12px 0px 0px;
}
.img-credbank10.sec_box{
border-radius: 0 12px 12px 12px;
cursor: pointer;
}
.img-credbank11{
width: 250px;
height: 165px;
background: url(../images/card35.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
border-radius: 0 12px 0px 0px;
}
.sec_img{
width: 80px;
position: absolute;
right: 18px;
top: 10px;
}
.img-credbank20.card01{
width: 200px;
height: 130px;
background: url(../images/card36-01.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 200px 130px;
border-radius: 0 12px 0px 0px;
}
.img-credbank20.card02{
width: 200px;
height: 130px;
background: url(../images/card36-02.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 200px 130px;
border-radius: 0 12px 0px 0px;
}
.img-credbank20.card03{
width: 200px;
height: 130px;
background: url(../images/card36-03.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 200px 130px;
border-radius: 0 12px 0px 0px;
}
.img-credbank20.card04{
width: 200px;
height: 130px;
background: url(../images/card36-04.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 200px 130px;
border-radius: 0 12px 0px 0px;
}
.img-credbank20.card05{
width: 200px;
height: 130px;
background: url(../images/card36-05.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 200px 130px;
border-radius: 0 12px 0px 0px;
}
.img-credbank20 p {
font-weight: 700;
text-align: center;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
display: -webkit-flex;
-webkit-align-items: center;
-webkit-justify-content: center;
width: 200px;
height: 140px;
padding: 0px 30px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
.img-credbank01 {
width: 250px;
height: 165px;
background: url(../images/card14_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
border-radius: 0 12px 0px 0px;
}
.img-credbank01.cre-card{
width: 200px;
height: 130px;
background: url(../images/card14_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 200px 130px;
border-radius: 0 12px 0px 0px;
}
.img-credbank02{
width: 250px;
height: 165px;
background: url(../images/card15_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
border-radius: 0 12px 0px 0px;
}
.img-credbank05{
width: 250px;
height: 165px;
background: url(../images/card07_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
border-radius: 0 12px 0px 0px;
}
.img-credbank06{
width: 250px;
height: 100px;
background: url(../images/card13-1_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 100px;
border-radius: 0 12px 0px 0px;
}
.img-creditcard.card_img{
background-image: url(../images/task05_bg_2x.jpg);
background-repeat: no-repeat;
background-size: 200px 130px;
}
.img-credbank07
{
width: 250px;
height: 165px;
background: url(../images/card22_2x.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
}
.img-credbank00.flag01{
width: 250px;
height: 165px;
background: url(../images/flag01_2x.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
}
.img-credbank00.flag02{
width: 250px;
height: 165px;
background: url(../images/flag02_2x.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
}
.img-credbank00.flag03{
width: 250px;
height: 165px;
background: url(../images/flag03_2x.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
}
.img-credbank00.flag04{
width: 250px;
height: 165px;
background: url(../images/flag04_2x.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
}
.img-credbank00.flag05{
width: 250px;
height: 165px;
background: url(../images/flag05_2x.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
}
.img-credbank00.generic{
width: 250px;
height: 118px;
background: url(../images/card24_2x.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 118px;
border-radius: 0 12px 0px 0px;
}
.img-credbank10
{
width: 250px;
height: 165px;
background: url(../images/card34_2x.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
}
.img-credbank11
{
width: 250px;
height: 165px;
background: url(../images/card35_2x.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
}
.img-credbank20.card01
{
width: 200px;
height: 130px;
background: url(../images/card36-01_2x.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 200px 130px;
}
.img-credbank20.card02
{
width: 200px;
height: 130px;
background: url(../images/card36-02_2x.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 200px 130px;
}
.img-credbank20.card03
{
width: 200px;
height: 130px;
background: url(../images/card36-03_2x.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 200px 130px;
}
.img-credbank20.card04
{
width: 200px;
height: 130px;
background: url(../images/card36-04_2x.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 200px 130px;
}
.img-credbank20.card05
{
width: 200px;
height: 130px;
background: url(../images/card36-05_2x.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: 200px 130px;
}
}
.img-credbank02{
width: 250px;
height: 165px;
background: url(../images/card15.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
border-radius: 0 12px 0px 0px;
}
.img-credbank03{
width: 250px;
border-radius: 0 12px 0px 0px;
min-height: 165px;
}
.img-credbank04{
width: 250px;
background-color: #D7DADC;
border-radius: 0 12px 0px 0px;
}
.segment-round {
border-radius: 0px 12px 12px 12px;
}
.free-height {
min-height: 0px;
}
.img-credbank05 p {
font-weight: 700;
text-align: center;
color: #3A3A3A;
display: flex;
align-items: center;
justify-content: center;
display: -webkit-flex;
-webkit-align-items: center;
-webkit-justify-content: center;
width: 250px;
height: 175px;
padding: 0px 30px;
}
.img-creditcard07 {
width: 310px;
height: 181px;
background: url(../images/img_creditcard07_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 320px 181px;
}
.img-creditcard08 {
width: 220px;
height: 120px;
background: url(../images/img_creditcard08_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 220px 120px;
}
.robot .dialog-box .time {
font-size: 12px;
margin: 0px 0 20px 20px;
color: #A0A0A0;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-weight: 400;
line-height: 16.8px;
}
.user {
width: 100%;
position: relative;
}
.user .dialog-box {
text-align: right;
color: #fff;
font-size: 16px;
padding-right: 0px;
padding-left: 20px;
}
.user .dialog-box .message {
display: inline-block;
position: relative;
padding: 12px 16px;
border-radius: 12px;
margin-bottom: 7px;
background: #98E3BA;
position: relative;
z-index: 1;
margin-right: 0px;
font-size: 16px;
font-weight: 300;
color: #3A3A3A;
text-align: left;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
}
/*.user .dialog-box .message::before {*/
/* content: "";*/
/* position: absolute;*/
/* width: 34px;*/
/* height: 24px;*/
/* background-image: url(../images/robot_user.png);*/
/* background-repeat: no-repeat;*/
/* top: 5px;*/
/* right: -9px;*/
/* z-index: -1;*/
/*}*/
.user .dialog-box .time {
right: 10px;
margin: 0 2px 20px 0;
font-size: 12px;
color: #A0A0A0;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-weight: 400;
line-height: 16.8px;
}
/* user */
.user .avatar{
width: 44px;
height: 44px;
border-radius: 19px;
display: inline-block;
position: absolute;
top: 0;
right: 0;
}
.hr-dashed{
border-top: 1px dashed #ABCABB;
}
/* content end */
/* ui-blackCover */
.ui-blackCover {
display: none;
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background-color: rgba(0,0,0,0.5);
z-index: 999999;
}
.ui-contextop iframe{
border-radius: 30px 30px 0px 0px;
width: 100vw;
overflow: hidden;
}
.ui-contextop {
position: fixed;
z-index: 9999999;
left: 0;
width: 100vw;
bottom: -300%;
}
.ui-contextop i.cancel{
width: 24px;
height: 24px;
display: table;
position: absolute;
right: 15px;
top: 14px;
cursor: pointer;
z-index: 99999999;
}
.ui-all {
position: relative;
overflow: hidden;
border-radius: 30px 30px 0px 0px;
}
/* ui-blackCover end */
/* card */
.txt_yellow h5 {
padding-top: 0px;
margin-top: 0px;
margin-bottom: 2px;
}
.txt_bank h5,.txt_safe h5{
font-size: 16px;
font-weight: 300;
margin: 0px;
margin-bottom: 4px;
color: #3A3A3A;
}
.txt_bank p,.txt_safe p{
font-size: 16px;
font-weight: 700;
color: #3A3A3A;
}
.txt_bank {
padding: 38px 40px 20px 38px;
position: relative;
}
.txt_safe {
padding: 32px 16px 28px 16px;
position: relative;
}
.txt_yellow{
padding: 20px;
}
.txt_sec {
padding: 22px 16px 15px 16px;
position: relative;
height: 165px;
}
.txt_sec p{
position: absolute;
bottom: 11px;
left: 53px;
font-size: 18px;
color: #26A862;
font-weight: 400;
}
.img-credbank03 .txt_safe span{
border-radius: 0px, 12px, 0px, 12px;
background-color: #98E3BA;
min-width: 65px;
height: 24px;
color: #3A3A3A;
padding: 4px 10px;
position: absolute;
right: 10px;
text-align: center;
font-size: 12px;
top: 5px;
margin: 12px;
}
.img-credbank04 .txt_safe span{
border-radius: 15px 15px 15px 15px;
background-color: #879195;
width: 44px;
height: 24px;
color: #D7DADC;
padding: 4px 0px;
position: absolute;
right: 10px;
text-align: center;
font-size: 12px;
top: 10px;
}
.img-credbank00{
width: 250px;
border-radius: 0 12px 0px 0px;
border-bottom: 2px solid #EAEAEA;
}
.img-credbank00 .txt_safe span{
border-radius: 0px, 12px, 0px, 12px;
background-color: #EC464A;
width: 65px;
height: 24px;
color: #fff;
padding: 4px 0px;
position: absolute;
right: 10px;
text-align: center;
font-size: 12px;
top: 10px;
}
.txt_Infor {
display: table;
width: 100%;
padding: 6px 0px;
}
.infor_left {
float: left;
font-size: 16px;
font-weight: 300;
}
.infor_right {
float: right;
font-size: 16px;
font-weight: 700;
}
.txt_Inforbox {
padding: 10px 20px;
position: relative;
}
.txt_Inforbox hr {
border-top: dashed #879195 1px;
}
.failure {
position: absolute;
background-color: #FDF1EB;
border-radius: 20px 20px 20px 20px;
color: #EC464A;
padding: 2px 30px 2px 36px;
top: -13px;
font-size: 14px;
font-weight: 300;
}
.failure span {
width: 15px;
height: 15px;
display: block;
float: left;
margin-right: 3px;
margin-top: 2px;
}
.chargeback {
display: inline-block;
padding: 12px 22px;
background-color: #fff;
border-radius: 12px;
box-shadow: 0px 8px 10px 0px #DDE8DD;
-moz-box-shadow: 0px 8px 10px 0px #DDE8DD; /* 嚙踝蕭嚙踝蕭 Firefox 嚙瞎嚙諄語嚙糊 */
-webkit-box-shadow: 0px 8px 10px 0px #DDE8DD; /* 嚙踝蕭嚙踝蕭 Safari 嚙瞎 Chrome 嚙瞎嚙諄語嚙糊 */
box-shadow: 0px 8px 10px 0px #DDE8DD; /* 嚙踝蕭嚙踝蕭 Opera 10.5 + 嚙瞎嚙諄語嚙糊 */
}
.cback_right {
float: left;
width: 76px;
height: 80px;
background: url(../images/cardday00.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 76px 80px;
border-radius: 0 12px 0px 0px;
}
.cback_left {
float: left;
display: flex;
align-items: center;
justify-content: center;
display: -webkit-flex;
-webkit-align-items: center;
-webkit-justify-content: center;
height: 86px;
font-size: 15px;
}
.cback_right h5 {
text-align: center;
color: #fff;
margin-bottom: 6px;
}
.cback_right h1 {
text-align: center;
margin: 0px;
}
.cback_day{
width: 165px;
height: 146px;
border-radius: 0 12px 0px 0px;
}
.cback_day.dayok{
background: url(../images/cardday01.png);
background-repeat: no-repeat;
background-position: center bottom;
background-size: 165px 120px;
color: #3A3A3A;
font-size: 15px;
}
.cback_day.dayno{
background: url(../images/cardday02.png);
background-repeat: no-repeat;
background-position: center bottom;
background-size: 165px 120px;
color: #3A3A3A;
font-size: 15px;
}
.cback_boxno {
width: 126px;
height: 130px;
color: #fff;
font-size: 43px;
}
.cback_boxno p{
text-align: center;
padding-top: 4px;
font-weight:bold;
}
.cback_day h1 {
font-size: 72px;
margin-bottom: 0px;
margin-top: 10px;
text-align: center;
}
.cback_day h5 {
font-size: 18px;
margin: 0px;
text-align: center;
}
.cback_box {
width: 126px;
}
.cathynote {
color: #5F6C72;
font-size: 14px;
padding: 10px 0px 10px 60px;
}
.cathynote p {
max-width: 266px;
padding-left: 32px;
padding-top: 10px;
margin: 0;
text-align: justify;
}
.cathynote i{
display: block;
width: 24px;
height: 24px;
float: left;
}
.cathynote i.icon{
background: url(../images/icon_down.png);
background-size: 100%;
}
.cathynote i.open{
background: url(../images/icon_up.png);
background-size: 100%;
display: block;
width: 24px;
height: 24px;
float: left;
}
.cathynote i img{
width: 100%;
}
.cathynote h5 {
float: left;
padding: 0px 0px 0px 8px;
margin: 0px;
line-height: 23px;
}
.cathynote .txt{
display: table;
}
.cathynote_line {
display: table;
border-bottom: dashed #879195 1px;
}
i.icon_down,i.icon_up{
cursor: pointer;
}
.cathynote ol{
padding-left: 50px;
padding-top: 10px;
max-width: 266px;
}
.cathynote_content{
display: none;
}
.segment.one-width {
width: 200px;
word-break:break-all;
}
.segment.two-width {
max-width: 250px;
}
.box_left {
float: left;
}
.box_center {
width: 88%;
float: left;
}
.box_right {
float: right;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
.cback_right {
float: left;
width: 76px;
height: 80px;
background: url(../images/cardday00_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 76px 80px;
border-radius: 0 12px 0px 0px;
}
.cback_day.dayok{
background: url(../images/cardday01_2x.png);
background-repeat: no-repeat;
background-position: center bottom;
background-size: 165px 120px;
color: #3A3A3A;
font-size: 15px;
}
.cback_day.dayno{
background: url(../images/cardday02_2x.png);
background-repeat: no-repeat;
background-position: center bottom;
background-size: 165px 120px;
color: #3A3A3A;
font-size: 15px;
}
.cathynote i.icon{
background: url(../images/icon_down.png);
background-size: 100%;
}
.cathynote i.open{
background: url(../images/icon_up.png);
background-size: 100%;
display: block;
width: 24px;
height: 24px;
float: left;
}
}
.small-tit {
border-radius: 15px 15px 15px 15px;
background-color: #fff;
width: auto;
color: #3A3A3A;
padding: 4px 6px 3px;
font-size: 12px;
display: inline-block;
font-weight: 700;
position: absolute;
right: 12px;
top: 12px;
}
.smart_note p {
background-color: #EBEBEB;
padding: 10px 12px;
font-size: 12px;
color: #3A3A3A;
border-radius: 5px;
}
.smart_note {
padding: 20px;
text-align: center;
}
/* card end */
.form-control:focus {
border:1.5px solid #36C36E;
-webkit-box-shadow: none;
box-shadow: none;
}
/* subview */
.subview_all {
overflow: hidden;
/*padding-bottom: 10px;*/
}
.subview_inner {
padding: 0px 26px;
max-width: 400px;
margin: 0px auto;
position: relative;
overflow-x: hidden;
overflow-y: hidden;
}
/*.subview_inner#login, .subview_inner#loginByPhoneVerify {*/
/* max-height: 50vh;*/
/*}*/
@media screen and (max-height: 500px){
/* .subview_inner#login, .subview_inner#loginByPhoneVerify {*/
/* max-height: 30vh;*/
/* }*/
}
.sub_button a {
float: left;
text-align: center;
width: 100%;
font-size: 15px;
}
.subview_head {
border-bottom: 1px solid #bfbfbf;
height: 45px;
}
.modal_title{
margin-top: 10px;
}
.subview_head h1 {
text-align: center;
color: #3A3A3A;
font-size: 17px;
font-weight: 300;
margin-top: 10px;
}
.subview_head hr {
border-top: 1px solid #bfbfbf;
margin-bottom: 12px;
}
.desc {
font-size: 16px;
font-weight: 300;
}
.sub_code a{
color: #26A862;
text-decoration: none;
}
.sub_code {
color: #879195;
font-size: 12px;
padding-top: 10px;
}
.subview_inner p {
color: #3A3A3A;
margin-bottom: 7px;
padding-top: 30px;
}
.sub_unmber {
float: left;
padding-top: 30px;
}
.subview_box {
margin: 30px 0px 0px;
font-weight: 700;
font-size: 16px;
color: #3A3A3A;
line-height: 22px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
}
.subview_box_password {
margin: 10px 0px 0px;
font-weight: 700;
font-size: 15px;
color: #3A3A3A;
}
.subview_box_password input {
margin-top: 7px;
height: 45px;
font-size: 15px;
color: #3A3A3A;
}
.subview_box input, .subview_box select {
margin-top: 7px;
height: 45px;
font-size: 15px;
color: #3A3A3A;
}
.select-arrow-box select {
background: url(../images/icon_down02_black_2x.png);
background-repeat: no-repeat;
background-position: center right 17px;
background-size: 20px;
}
.code_img {
width: 131px;
height: 51px;
display: table;
}
.sub_button .tag {
border-radius: 6px;
border: 1.5px solid #98E3BA;
background: #98E3BA;
color: #3A3A3A;
font-weight: 700;
font-size: 16px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
text-decoration: none;
max-width: 382px;
}
.sub_button .tag:hover {
border-radius: 6px;
border: 1.5px solid #34BC6A;
background: #34BC6A;
color: #FFFFFF;
font-weight: 700;
font-size: 16px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
text-decoration: none;
}
.sub_button p{
text-align: center;
color: #26A862;
font-size: 16px;
font-weight: 700;
display: table;
padding: 10px 0px;
margin: 0px auto;
}
.sub_button .error{
z-index: 100;
/*display: none;*/
margin: 5px auto;
border: 1.5px solid #D7DADC;
background: #D7DADC;
padding: 12px 8px;
border-radius: 6px;
color: #fff;
font-size: 16px;
font-weight: 700;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
}
.sub_button .error:hover{
text-decoration:none;
margin: 5px auto;
border: 1.5px solid #D7DADC;
background: #D7DADC;
padding: 12px 8px;
border-radius: 6px;
color: #fff;
font-size: 16px;
font-weight: 700;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
}
.sub_code .again {
color: #879195;
}
.sub_code .time {
color: #26A862;
}
.subview_box .icon_phone{
width: 24px;
height: 24px;
display: inline-table;
}
.subview_box .phone{
font-size: 20px;
padding-left: 4px;
}
.subview_box .icon_phone img{
margin: -6px 0px 0px;
width: 100%;
}
/* 2018-04-11 add */
.sub_code .send{
white-space: nowrap;
padding-right: 10px;
}
.subview_box.mail .dp-table{
display: table;
width: 100%;
table-layout: fixed;
}
.subview_box.mail .icon_mail{
width: 24px;
height: 24px;
display: table-cell;
}
.subview_box.mail .mail{
font-size: 20px;
padding-left: 8px;
display: table-cell;
word-break: break-all;
}
.subview_box.mail .icon_mail img{
margin: -6px 0px 0px;
width: 100%;
}
/* end 2018-04-11 */
.form-control {
border: 1.5px solid #D7DADC;
border-radius: 2px;
}
.has-success input.form-control{
border:1.5px solid #26A862;
}
.has-success input.form-control:focus{
border:1.5px solid #26A862;
}
.has-error input.form-control, .select-has-error input.bank_input {
border:1.5px solid #EC464A;
margin-bottom: 7px;
}
.has-error input.form-control:focus, .select-has-error input.bank_input:focus {
border:1.5px solid #EC464A;
}
.sub_input input::-ms-clear{display: none;}
.sub_input input::-ms-reveal{display: none;}
input.form-control i {
position: absolute;
}
i.sub_ok,i.sub_error {
width: 24px;
height: 24px;
display: table;
position: absolute;
top: 10px;
right: 10px;
z-index: 2;
}
.has-success .subview_bg ,.has-error .subview_bg{
position: absolute;
background-color: #fff;
width: 35px;
height: 35px;
right: 2px;
top: 5px;
z-index: 1;
display: block;
}
.sub_input.has-error span, .select-has-error span.error-msg {
color: #EC464A;
}
.sub_input {
position: relative;
}
.phone_code{
display: inline-block;
width: 80%;
padding-left: 5px;
}
.card_code{
display: inline-block;
width: 20%;
}
.card_back{
display: inline-block;
width: 89%;
padding-left: 5px;
}
.qa{
display: inline-block;
border: 1px solid #ccc;
border-radius: 4px;
padding: 11px;
cursor: pointer;
color: #26A862;
margin-top: 7px;
float: right;
}
.qa:hover{
color: #00994E;
background-color: #f9f9f9;
}
.qa_img{
width: 200px;
display: none;
position: absolute;
top: 0px;
right: 0px;
float: right;
}
.ver_qa{
position: relative;
}
.subview_box.ver_qa {
font-weight: 400;
}
.sub_table input[type=radio]:not(old), input[type=radio ]:not(old),.sub_table input[type=checkbox]:not(old), input[type=checkbox ]:not(old) {
width: 29px;
height: 29px;
margin: 0 auto;
padding: 0;
opacity: 0;
cursor: pointer;
position: absolute;
/*z-index: 99;*/
z-index: 600;
}
.agree input[type=radio]:not(old), input[type=radio ]:not(old),.sub_table input[type=checkbox]:not(old), input[type=checkbox ]:not(old) {
width : 24px;
height: 24px;
margin : 0;
padding : 0;
opacity : 0;
cursor: pointer;
}
.sub_table input[type=radio]:not(old) + label,.sub_table input[type=checkbox]:not(old) + label {
display: inline-block;
padding: 0;
margin: 0;
background: url(../images/icon_select02_2x.png) no-repeat 0 0px;
font-size: 14px;
position: absolute;
width: 24px;
height: 24px;
}
.sub_table input[type=radio]:not(old):checked + label,.sub_table input[type=checkbox]:not(old):checked + label {
background : url(../images/icon_select03.png) no-repeat 0 0px;
width: 24px;
height: 24px;
margin: 0;
padding: 0;
position: absolute;
background-size: 24px 24px;
}
.agree input[type=radio]:not(old) + label,.agree input[type=checkbox]:not(old) + label {
display: inline-block;
border: 2px solid #A0A0A0;
width: 24px;
height: 24px;
margin: 5px 0px;
}
.agree input[type=radio]:not(old):checked + label,.agree input[type=checkbox]:not(old):checked + label {
background : url(../images/icon_ok_2x.png) no-repeat -1px -2px;
background-size: 24px 24px;
background-color: #98E3BA;
border: 2px solid #98E3BA;
margin: 5px 0px;
}
.agree h5 {
display: inline-block;
margin: 10px 10px;
float: left;
}
.agree_left {
display: inline-block;
float: left;
}
.agree
{
display: inline-block;
padding-top: 10px;
}
.agree label {
margin-bottom: 0px;
}
.note{
margin: 0px 20px 10px;
font-size: 16px;
}
.remainCharacter {
position: absolute;
bottom: 2px;
right: 5px;
color: #A0A0A0;
font-size: 14px;
line-height: 20px;
font-weight: 400;
}
.div_content{
overflow-y: auto;
position: relative;
/* border-bottom: 1px solid #DFE2E3; */
box-shadow: inset 0px -8px 24px 0px #44444414;
}
textarea.form-control {
background-color: #F5F5F5;
font-size: 16px;
height: auto;
min-height: 230px;
font-weight: 400;
}
.table_left {
width: 29px;
padding: 0;
margin: 0 auto;
position: relative;
height: 29px;
}
.sub_table p {
color: #3A3A3A;
margin-bottom: 0px;
padding-top: 0px;
font-size: 16px;
font-weight: 300;
}
.sub_table span {
color: #26A862;
font-size: 12px;
font-weight: 400;
}
.sub_table tr {
height: 60px;
border-bottom: 1px solid #e6e6e6;
}
.sub_table tr:last-child {
border-bottom: none;
}
.sub_table tr:first-child {
height: auto;
border-bottom: initial;
}
.css_td.dropdown a {
color: #5F6C72;
}
.nav-collapse.collapse {
height: auto !important;
overflow: visible !important;
}
.sub_table tr:first-child {
background-color: #F5F5F5;
}
.table_right {
padding: 10px 0px;
}
.sub_button {
margin-top: 10px;
padding: 0px 24px;
}
hr.otp_line{
margin-bottom: 0px;
}
/* subview end */
/* subviewtable end */
.img-responsive, .thumbnail > img, .thumbnail a > img, .carousel-inner > .item > img, .carousel-inner > .item > a > img {
width: 100%;
}
.sub_height {
overflow: hidden;
padding-top: 10px;
}
.subview_tit h2 {
font-size: 16px;
text-align: center;
font-weight: 300;
}
p.bill_p {
text-align: center;
margin: 10px 15px;
}
.dropdown-menu{
box-shadow: 0px 6px 14px 0px #4444441A;
border: 0px;
}
.dropdown-menu:before {
position: absolute;
top: -7px;
left: 9px;
display: inline-block;
border-right: 7px solid transparent;
border-bottom: 7px solid #ccc;
border-left: 7px solid transparent;
border-bottom-color:#fff;
content: '';
}
.dropdown-menu:after {
position: absolute;
width: 0;
height: 0;
border-style: solid;
border-width: 0 10px 10px 10px;
border-color: transparent transparent #efefef transparent;
line-height: 0px;
_border-color: #ffffff #ffffff #000000 #ffffff;
_filter: progid:DXImageTransform.Microsoft.Chroma(color='#ffffff');
position: absolute;
top: -10px;
left: 6px;
content: '';
z-index: -1;
}
.css_table {
display:table;
width: 100%;
padding-top: 10px;
}
.css_tr {
display: table-row;
}
.css_td {
display: table-cell;
vertical-align: middle;
}
.sub_table th:first-child {
padding-left: 15px;
}
.nav > li {
float: left;
}
.td_line .css_td{
border-bottom: 1px solid #e6e6e6;
}
.icon_dropdown{
width: 15px;
height: 15px;
display: table;
float: left;
margin-top: 5px;
margin-left: 3px;
}
.icon_dropdown img{
width: 100%;
}
.sub_table h6{
float: left;
font-size: 14px;
color: #777777;
font-weight: 300;
}
th.table_01 {
width: 20%;
}
/* subviewtable end */
/* totalbill */
.sub_table.totalbill .total_card {
background-color: #e3f3e3;
height: 40px;
color: #26A862;
}
.sub_table.totalbill .total_tit {
background-color: #F5F6F6;
height: auto;
}
.sub_table.totalbill th {
padding-left: 5px;
}
.sub_table.totalbill th:first-child {
padding-left: 15px;
}
.sub_table.totalbill td:first-child {
padding-left: 15px;
}
.total_all.subview_all {
padding-bottom: 0px;
}
/* totalbill end */
/* control-bar */
.control-bar {
position: fixed;
-webkit-backface-visibility: hidden;
width: 100%;
bottom: 0;
z-index: 99;
}
.select-tag{
padding: 0px 20px;
overflow-x: auto;
white-space: nowrap;
background-color: rgba(232,247,236,60);
}
.select-box{
width: 100%;
background-color: #F5F5F5;
}
.select-box-notmonitor{
width: 100%;
background-color: #F8F8F8;
box-shadow: 0px -4px 10px 0px #dde6dc;
}
.select-box.now{
position: relative;
z-index: 1000;
}
.select-box-notmonitor.now{
position: relative;
z-index: 1000;
}
.select-box ul{
width: 96%;
margin: 0 2%;
padding: 15px 10px 0px;
overflow: hidden;
border-bottom: 5px solid #F8F8F8;
}
.select-box-notmonitor ul{
width: 96%;
margin: 0 2%;
padding: 15px 10px 0px;
overflow: hidden;
border-bottom: 5px solid #F8F8F8;
}
.select-tag .tag:hover, .tag:hover {
text-decoration: none;
}
.select-box a {
float: left;
text-align: center;
width: 100%;
font-size: 16px;
}
.select-box-notmonitor a {
float: left;
text-align: center;
width: 100%;
font-size: 16px;
}
.select-tag01 li {
width: 50%;
list-style: none;
float: left;
padding: 0px 5px;
}
.select-tag02 li {
width: 33.3%;
list-style: none;
float: left;
padding: 0px 5px;
}
.select-tag03 li {
width: 50%;
list-style: none;
float: left;
padding: 0px 5px;
}
.select-tag04 li {
width: 100%;
list-style: none;
float: left;
padding: 3px;
background: #F5F5F5;
}
.select-tag .display-tag,.display-tag{
z-index: 100;
/*display: none;*/
margin: 5px auto;
border: 2px solid gray;
background: #ffffff;
padding: 8px;
border-radius: 30px;
color: gray;
font-size: 15px;
font-weight: 400;
}
.select-tag .tag,.tag{
z-index: 100;
/*display: none;*/
margin: 5px auto;
background: #E8F0E8;
padding: 12px 8px;
border-radius: 30px;
color: #26A862;
font-size: 16px;
font-weight: 400;
}
.select-tag .tag:hover,.tag:hover{
text-decoration:none;
color: #ffffff;
background: #34BC6A;
}
.select-tag .tag:focus,.tag:focus{
text-decoration:none;
color: #ffffff;
background: #34BC6A;
}
.select-tag .tag,.search_in{
z-index: 100;
/*display: none;*/
margin: 5px auto;
background: #ffffff;
padding: 8px;
border-radius: 30px;
color: #26A862;
font-size: 16px;
font-weight: 400;
}
ul.select-tag04.search_all {
overflow-x: hidden;
overflow-y: auto;
max-height: 175px;
padding: 0px;
}
ul.select-tag04.search_all {
border-top: 5px solid #F5F5F5;
}
ul.select-tag04.search_all .tag {
border-bottom: solid #EBEBEB 2px;
background: #F5F5F5;
color: #3A3A3A;
margin: 0;
border-radius: 0px;
text-align: left;
padding: 8px 20px;
font-weight: 400;
line-height: 19.6px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-size: 14px;
}
ul.select-tag04.search_all .tag:focus,
ul.select-tag04.search_all .tag:hover{
border-left: none;
border-top: none;
border-right: none;
}
.select-menu {
background-color: #F5F5F5;
display: table;
width: 100%;
padding: 5px 0px 15px;
}
.footer-menu {
position: fixed;
width: 100%;
z-index: 9999;
bottom: 60px;
left: 0;
}
.select-menu li {
list-style: none;
float: left;
width: 33.3%;
text-align: center;
border-right: 1px solid #eaeaea;
}
ul.select-line li {
border-right: none;
margin: 0px;
}
ul.select-line hr {
width: 50%;
padding: 0;
margin-top: 15px;
margin-bottom: 10px;
}
.select-menu li:last-child {
border-right: none;
}
.select-menu ul {
padding: 0;
margin: 0;
}
.select-menu li a{
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
color: #3A3A3A;
font-size: 16px;
text-align: center;
font-weight: 700;
line-height: 21px;
}
.select-menu li a:hover,.select-menu li a:focus{
text-decoration:none;
}
.select-menu li img {
width: 60px;
height: 60px;
margin: 0px auto;
}
.select-tag .tag.animate
{
-webkit-animation: jumpchoice 1s linear;
-moz-animation: jumpchoice 1s linear;
animation: jumpchoice 0.5s linear;
display: inline-block;
}
@keyframes jumpchoice {
0% {
transform: translateY(100px);
}
30% {
transform: initial;
}
60% {
transform: translateY(-10px);
}
100%{
transform: initial;
}
}
.control-bar .box {
display: table;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
height: 60px;
background-color: #F5F5F5;
}
.control-bar .box a {
display: table-cell;
vertical-align: middle;
overflow: hidden;
text-indent: -9999px;
text-indent: 100%;
white-space: nowrap;
width: 60px;
height: 60px;
}
.smart_top {
position: absolute;
right: 20px;
bottom: 100px;
width: 32px;
height: 32px;
background-color: rgba(58, 58, 58, 0.5);
border-radius: 40px;
text-align: center;
padding-top: 9px;
padding-left: 9px;
cursor: pointer;
display: none;
z-index: 999;
}
.flipy {
-moz-transform:scaleY(-1);
-webkit-transform:scaleY(-1);
-o-transform:scaleY(-1);
transform:scaleY(-1);
filter:FlipV;
}
.smart_top:hover {
background-color: rgba(58, 58, 58, 0.5);
}
.smart_top img {
width: 14px;
}
.control-bar .box a.btn-mic {
width: 60px;
height: 60px;
}
span.btn-search{
display: block;
width: 40px;
height: 40px;
background: linear-gradient(0deg, #98E3BA 0%, #57CD99 100%);
border-radius: 20px;
margin: 10px auto;
position: relative;
z-index: 999;
}
span.btn-search i{
width: 23px;
height: 19.5px;
background: url(../images/icon_mic_2x.png);
background-size: 100%;
background-repeat: no-repeat;
display: block;
position: absolute;
top: 11px;
left: 11px;
}
span.btn-search.disable_right, span.btn-search.disable_right:hover{
background:#D7DADC;
}
span.btn-search.disable_right i,span.btn-search:active i, span.btn-search:hover i{
width: 23px;
height: 19.5px;
background: url(../images/icon_mic_disable_2x.png);
background-size: 100%;
background-repeat: no-repeat;
display: block;
position: absolute;
top: 11px;
left: 11px;
}
span.btn-search:hover {
background:#34BC6A;
}
.control-bar .box .input{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 30px;
display: table-cell;
vertical-align: middle;
width: 100%;
height: 40px;
padding: 4px 13px;
margin: 10px 0;
color: #879195;
font-size: 16px;
line-height: 32px;
border: none;
background-color: #FFFFFF;
border: 1.2px solid #ebebeb;
font-weight: 400;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
}
input.input.msg.disable_in{
border: 1px solid #D7DADC;
background-color: #D7DADC;
}
.subview_inner .input{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 24px;
display: block;
width: 100%;
height: 42px;
padding: 4px 13px 6px 44px;
margin: 2px 0;
color: #3A3A3A;
font-size: 16px;
line-height: 32px;
border: none;
background-color: #F5F5F5;
}
.dropdown-menu>li>a {
display: block;
padding: 3px 20px;
clear: both;
font-weight: 400;
line-height: 1.42857143;
color: #333;
white-space: nowrap;
}
.dropdown-menu>li {
border-bottom: 1px solid #dedede;
}
.dropdown-menu>li:last-child {
border-bottom: none;
}
.control-bar .box input,.subview_inner .input{outline:none}
.control-bar .box input.input::-webkit-input-placeholder{
color: #777777;
}
.control-bar .box input.input::-moz-placeholder{
color: #777777;
}
.control-bar .box input.input:-ms-input-placeholder{
color: #777777;
}
.control-bar .box input.input:-moz-placeholder {
color: #777777;
}
.btn-add .btn-add-span {
background: url(../images/icon_add_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 40px 40px;
width: 40px;
height: 40px;
display: block;
margin: 10px;
}
.btn-add .btn-add-span:active,
.btn-add .btn-add-span:hover {
background: url(../images/icon_add02_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 40px 40px;
}
.btn-add.disable_left .btn-add-span {
background: url(../images/icon_add03_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 40px 40px;
}
i.icon_search {
position: absolute;
width: 20px;
height: 20px;
left: 40px;
top: 12px;
}
/* control-bar end */
.robot .avatar{
width: 30px;
height: 30px;
border-radius: 19px;
display: inline-block;
position: absolute;
top: 0px;
left: 0px;
background-color: #F8F8F8;
}
.line_img{
max-width:150px;
margin-bottom: 10px;
margin-left: 16px;
}
.robot .avatar01{
width: 38px;
height: 38px;
border-radius: 19px;
display: inline-block;
position: absolute;
top: 0;
left: 0;
background: url(../images/avatar01_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 38px 38px;
}
.robot .avatar02{
width: 38px;
height: 38px;
border-radius: 19px;
display: inline-block;
position: absolute;
top: 0;
left: 0;
background: url(../images/avatar02_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 38px 38px;
}
.robot .avatar03{
width: 38px;
height: 38px;
border-radius: 19px;
display: inline-block;
position: absolute;
top: 0;
left: 0;
background: url(../images/avatar03_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 38px 38px;
}
.robot .avatar04{
width: 38px;
height: 38px;
border-radius: 19px;
display: inline-block;
position: absolute;
top: 0;
left: 0;
background: url(../images/avatar04_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 38px 38px;
}
.robot .avatar05{
width: 38px;
height: 38px;
border-radius: 19px;
display: inline-block;
position: absolute;
top: 0;
left: 0;
background: url(../images/avatar05_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 38px 38px;
}
.robot .avatar06{
width: 38px;
height: 38px;
border-radius: 19px;
display: inline-block;
position: absolute;
top: 0;
left: 0;
background: url(../images/avatar06_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 38px 38px;
}
.robot .avatar07{
width: 38px;
height: 38px;
border-radius: 19px;
display: inline-block;
position: absolute;
top: 0;
left: 0;
background: url(../images/avatar07_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 38px 38px;
}
.robot .avatar08{
width: 38px;
height: 38px;
border-radius: 19px;
display: inline-block;
position: absolute;
top: 0;
left: 0;
background: url(../images/avatar08_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 38px 38px;
}
.robot .avatar09{
width: 38px;
height: 38px;
border-radius: 19px;
display: inline-block;
position: absolute;
top: 0;
left: 0;
background: url(../images/avatar09_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 38px 38px;
}
.robot .tree{
width: 144px;
height: 175.2px;
background: url(../images/tree_icon_2x.gif);
background-repeat: no-repeat;
background-position: center center;
background-size: 144px 175.2px;
}
.robot .tree01{
width: 166px;
height: 156px;
margin: 15px;
background: url(../images/tree_icon01_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 166px 156px;
}
.robot .tree02{
width: 180px;
height: 170px;
margin: 15px;
background: url(../images/tree_icon02_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 166px 156px;
}
.robot .dialog-box .message .more{
width: 8px;
height: 8px;
border-radius: 4px;
background-color: #33AC71;
display: inline-block;
}
.robot .dialog-box .message .more1{
width: 8px;
height: 8px;
border-radius: 4px;
background-color: #48C159;
display: inline-block;
}
.robot .dialog-box .message .more2{
width: 8px;
height: 8px;
border-radius: 4px;
background-color: #78C93D;
display: inline-block;
}
/* control-bar end */
/* alert */
.payment .paymentcode{
width: 359px;
height: 627px;
background: url(../images/payment_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 359px 627px;
position: relative;
}
.payment .paymentcode .paymenticon{
width: 50px;
height: 56px;
background: url(../images/paymenticon_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 50px 56px;
position: absolute;
right: -13px;
top: -25px;
}
.img-creditcard09 {
width: 220px;
height: 120px;
background: url(../images/img_creditcard09_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 220px 120px;
}
/* slider */
.slider {
width: 100%;
margin: 0px auto;
padding: 0px 0px 0px 0px;
}
.slick-slide {
margin: 0px 1px;
}
.slick-slide img {
width: 100%;
}
.slick-prev:before,
.slick-next:before {
color: black;
}
.slick-slide {
transition: all ease-in-out .3s;
opacity: 1;
margin: 0px 0px;
}
/*.slick-active {
opacity: .5;
}
.slick-current {
opacity: 1;
}*/
.slider .segment{
padding: 0;
background-color: #FFF;
border-radius: 0 12px 12px 12px;
box-shadow: 0px 8px 10px 0px #DDE8DD;
-moz-box-shadow: 0px 8px 10px 0px #DDE8DD; /* ���� Firefox �M�λy�k */
-webkit-box-shadow: 0px 8px 10px 0px #DDE8DD; /* ���� Safari �M Chrome �M�λy�k */
box-shadow: 0px 6px 10px 0px rgba(68,68,68,0.05); /* ���� Opera 10.5 + �M�λy�k */
}
.slider .segment {
color: #3A3A3A;
font-size: 16px;
font-weight: 700;
}
.desc ul{
padding: 0px 0px 0px 21px;
margin: 0px;
}
.img-banner.segment-round img{
border-radius: 0px 12px 12px 12px;
}
.robot .tree{
width: 144px;
height: 175.2px;
background: url(../images/tree_icon_2x.gif);
background-repeat: no-repeat;
background-position: center center;
background-size: 144px 175.2px;
}
/* service */
.sat_all p {
text-align: center;
font-size: 15px;
padding: 0px 10px;
}
.sat_all {
border-radius: 10px;
position: relative;
}
.sat_all.phone {
box-shadow: 0px 0px 10px 5px #DDE8DD;
-moz-box-shadow: 0px 0px 10px 5px #DDE8DD;
-webkit-box-shadow: 0px 0px 10px 5px #DDE8DD;
box-shadow: 0px 0px 10px 5px #DDE8DD;
border-radius: 10px;
padding: 0px 0px 10px;
margin: 100px 0px 10px;
position: relative;
}
.sat_all ul {
display: table;
margin: 0px auto;
padding: 0px;
}
.sat_all li {
float: left;
width: 40px;
height: 40px;
margin: 0px 10px;
cursor: pointer;
}
li.icon_star {
background-image: url(../images/icon_star.png);
width: 40px;
height: 40px;
background-size: 96px 33px;
list-style: none;
background-position: -60px 4px;
background-repeat: no-repeat;
margin: 0 10px;
}
li.icon_star.open {
background-image: url(../images/icon_star.png);
width: 40px;
height: 40px;
background-size: 96px 33px;
list-style: none;
background-position: 0px 4px;
background-repeat: no-repeat;
}
.sat_content {
max-width: 350px;
margin: 0px auto;
font-size: 15px;
padding: 0px 10px;
}
.sat_img,.peo_img {
width: 100%;
/*position: absolute;
top: -83px;*/
}
.sat_img img {
text-align: center;
width: 153px;
margin: 0px auto;
}
.smart_message {
margin: 20px 0px;
}
.smart_message p {
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
color: #3A3A3A;
line-height: 24px;
font-size: 16px;
font-weight: 700;
}
textarea#message {
font-size: 16px;
}
.peo_img img{
width: 70px;
height: 70px;
border-radius: 50px;
margin: 0px auto;
box-shadow: 0px 8px 10px 0px #DDE8DD;
-moz-box-shadow: 0px 8px 10px 0px #DDE8DD;
-webkit-box-shadow: 0px 8px 10px 0px #DDE8DD;
box-shadow: 0px 8px 10px 0px #DDE8DD;
}
.otp_shock {
display: table;
margin: 40px auto 0px;
text-align: center;
font-size: 15px;
}
.otp_shock img {
width: 24px;
height: 24px;
margin: 15px auto;
}
/* service end*/
.cathay_smart_open {
background-color: #fff;
bottom:100%;
}
/* index*/
.smart_all {
position: fixed;
bottom: 0;
right: 0;
z-index: 99999;
}
.index_bg{
background-image: url(../images/index.png);
background-position: top center;
width: 100%;
height: 1080px;
background-repeat: no-repeat;
}
.smart_up {
width: 28px;
height: 28px;
margin-bottom: 12px;
margin-left: 42px;
cursor: pointer;
display: none;
}
.smart_alpha {
width: 110px;
height: 130px;
cursor: pointer;
background-image: url(../images/smart_alpha.png);
background-size: 100%;
background-position: 0px 14px;
z-index: 5;
margin-bottom: -20px;
}
.smart_alpha.end{
background-image: url(../images/smart_alpha02.png);
background-size: 100%;
background-position: 0px 14px;
}
.smart_alpha.shut{
background-image: url(../images/smart_alpha03.png);
background-size: 100%;
background-position: 0px 14px;
}
.smart_say .say{
right: 20px;
background-color: #fff;
border-radius: 40px 40px 40px 40px;
padding: 10px 20px;
position: relative;
box-shadow: 0px 8px 20px 0px #a7a7a7;
-moz-box-shadow: 0px 8px 20px 0px #a7a7a7;
-webkit-box-shadow: 0px 8px 20px 0px #a7a7a7;
box-shadow: 0px 8px 20px 0px #a7a7a7;
font-size: 14px;
line-height: 1.4;
}
.smart_say .say::before{
content: "";
position: absolute;
width: 24px;
height: 18px;
background-image: url(../images/robot_index.png);
background-repeat: no-repeat;
bottom: -12px;
right: 15px;
z-index: 2;
}
.smart_say p {
margin: 0;
}
.smart_box {
margin-right: 10px;
margin-bottom: -14px;
border-radius: 10px;
box-shadow: 0px 8px 20px 0px #a7a7a7;
-moz-box-shadow: 0px 8px 20px 0px #a7a7a7;
-webkit-box-shadow: 0px 8px 20px 0px #a7a7a7;
box-shadow: 0px 8px 20px 0px #a7a7a7;
overflow: hidden;
height: 500px;
z-index: 3;
display: none;
}
.smart_box iframe {
width: 450px;
height: 500px;
}
.smart_icon {
float: right;
}
/* index end*/
/* otp4 */
.panel .sub_code{
display: inline-block;
}
a.sub_left {
float: left;
width: 50px;
margin-right: 10px;
}
.sub_right {
float: right;
width: 250px;
}
.cathay_smart .panel{
border: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.panel .subview_box:first-child{
margin: 0px 0px;
}
.cathay_smart .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
color: #26A862;
cursor: default;
background-color: #fff;
border-bottom: 2px solid #26A862;
border: none;
}
.cathay_smart .nav-tabs > li > a {
margin-right: 2px;
line-height: 1.42857143;
border: none;
border-radius: 4px 4px 0 0;
font-size: 15px;
color: #879195;
background-color: #fff;
}
.cathay_smart .nav-tabs > li > a:hover {
border-bottom: 2px solid #26A862;
color: #26A862;
}
.cathay_smart .nav > li {
text-align: left;
}
.cathay_smart .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
background-color: #fff;
border-bottom: 2px solid #26A862;
border-bottom-color: none;
}
/* otp4 end*/
@media (max-width: 768px) {
.select-tag .tag, .tag,.robot .dialog-box,.user .dialog-box ,.control-bar .box .input,.subview_box,.sub_button p{
font-size: 16px;
}
.table_small .dropdown-menu{
margin: 0px 0px 0px 0px;
min-width: 72px;
}
}
@media (max-width: 520px) {
th.table_01 {
width: 23%;
}
.table_left {
width: 29px;
/*margin-left: 10px;*/
}
.sub_table td {
padding: 0px 5px;
}
.table_small .dropdown-menu{
margin: 0px 0px 0px -32px;
min-width: 72px;
}
.table_small .dropdown-menu:before {
left: 46px;
}
.table_small .dropdown-menu:after {
top: -10px;
left: 43px;
}
.qa_img{
width: 200px;
position: absolute;
top: 0px;
right: 0px;
}
}
@media (max-width: 412px) {
.select-tag02 li {
padding: 0px 2px;
}
.select-box a {
font-size: 16px;
}
.select-box-notmonitor a {
font-size: 16px;
}
}
@media (max-width: 320px) {
.cathay_smart .nav > li{
width:auto;
}
}
.target img,.target .time{
visibility: hidden;
}
.robot .tree{
width: 144px;
height: 175.2px;
background: url(../images/tree_icon_2x.gif);
background-repeat: no-repeat;
background-position: center center;
background-size: 144px 175.2px;
}
.new_msg_alert p{
border-radius: 50px;
width: 25%;
background: #33333333;
color: #333333b8;
padding: 10px;
margin: 10px auto;
font-size: 12px;
text-align: center;
}
.touch .heder_back{
display: block;
}
.header_service,.select-menu{
overflow : hidden;
}
.message{
word-break: break-all;
}
input::-webkit-input-placeholder {
color: #777777!important;
font-weight: 300;
font-size: 15px;
}
input::-webkit-input-placeholder { /* WebKit browsers */
color: #a0a0a0!important;
font-weight: 300;
font-size: 15px;
}
input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #a0a0a0!important;
font-weight: 300;
font-size: 15px;
}
input::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #a0a0a0!important;
font-weight: 300;
font-size: 15px;
}
input:-ms-input-placeholder { /* Internet Explorer 10+ */
color: #a0a0a0!important;
font-weight: 300;
font-size: 15px;
}
input.placeholder{ /* Internet Explorer 8 & 9*/
color: #a0a0a0!important;
font-weight: 300;
font-size: 15px;
}
input[type="text"] {
-webkit-appearance: none;
}
input.disable_in::-webkit-input-placeholder {
color: #fff!important;
font-weight: 300;
font-size: 15px;
}
input.disable_in::-webkit-input-placeholder { /* WebKit browsers */
color: #fff!important;
font-weight: 300;
font-size: 15px;
}
input.disable_in:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #fff!important;
font-weight: 300;
font-size: 15px;
}
input.disable_in::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #fff!important;
font-weight: 300;
font-size: 15px;
}
input.disable_in:-ms-input-placeholder { /* Internet Explorer 10+ */
color: #fff!important;
font-weight: 300;
font-size: 15px;
}
.control-bar .box.focus {
padding: 5px 0 0 0;
margin: 0 0 0 0;
}
/* for chrome */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;}
/* for mozilla */
input[type=number] {-moz-appearance: textfield;}
.cathay_smart input{outline:none}
@media screen and (max-height: 500px){
.subview_inner p {
padding-top: 10px;
}
.sub_button {
margin-top: 0px;
}
.subview_box {
margin: 0px 0px 0px;
}
.sat_all {
padding: 15px 0px 14px;
}
textarea#message {
height: 65px;
}
.subview_inner {
overflow: auto;
}
}
.brand_new_all .subview_box{
margin: 15px 0px 0px;
}
.brand_new_all .code_img{
width: 100%;
margin: 0px auto;
max-width: 335px;
}
.bank_agree a{
color: #26A862;
text-decoration: none;
border-bottom: 1px solid #26A862;
line-height: 25px;
}
.agree.bank_agree {
width: 100%;
padding-top: 15px;
}
.agree.bank_agree p{
color: #3A3A3A;
text-align: center;
margin: 0px;
padding: 10px 0px 0px;
font-size: 15px;
}
.has-million{
position: relative;
}
i.sub_million{
width: 24px;
height: 24px;
display: table;
position: absolute;
top: 12px;
right: 10px;
z-index: 2;
background-color: #fff;
font-style: normal;
}
.heder_service2 {
position: absolute;
width: 24px;
height: 24px;
top: 14px;
right: 11px;
cursor: pointer;
}
.header_service2 ul {
list-style: none;
}
.header_service2 {
display: none;
box-shadow: 0px 8px 10px 0px rgba(68,68,68,0.05);
}
.header_service2 li {
text-align: left;
padding: 10px 20px;
}
.header_service2 li a{
color: #fff;
}
.header_service2 li a:hover{
text-decoration: none;
}
.header_service2 i {
width: 24px;
height: 24px;
display: table;
float: left;
}
.header_service2 img {
margin: -2px -5px;
}
.header_service2 ul {
padding: 0px 15px;
}
.header_service2 li:hover {
background-color: #EBEBEB;
}
.passwordIcon_open{
position: absolute;
background: url(../images/eyeopen.png)no-repeat center;
background-size: 24px 24px;
width: 45px;
height: 45px;
right: 0;
}
.passwordIcon_close{
position: absolute;
background: url(../images/eyeclose.png)no-repeat center;
background-size: 24px 24px;
width: 45px;
height: 45px;
right: 0;
}
.fake-password {
-webkit-text-security: disc; /* for Safari */
text-security: disc; /* for others (may not be supported in all browsers) */
}
.small-tag {
border-radius: 15px 15px 15px 15px;
background-color: #fff;
width: 50px;
color: #3d3d3d;
padding: 4px 6px 3px;
font-size: 12px;
text-align:center;
display: inline-block;
font-weight: bold;
float: left;
margin-right: 10px;
}
.card-bottom span{
text-align: center;
color: #FC6C24;
display: block;
padding: 11px;
text-decoration: none;
font-weight: 700;
background:#FFF1EB;
}
.icon_sort {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: end;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
cursor: pointer;
}
.icon_sort::after {
display: block;
content: "";
width: 16px;
height: 16px;
margin-left: 3px;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkJBREJCQTAzRTdFNTExRTk5QUNBREU3M0EyNzZFMjEyIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkJBREJCQTA0RTdFNTExRTk5QUNBREU3M0EyNzZFMjEyIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QkFEQkJBMDFFN0U1MTFFOTlBQ0FERTczQTI3NkUyMTIiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QkFEQkJBMDJFN0U1MTFFOTlBQ0FERTczQTI3NkUyMTIiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6qzUotAAAB3klEQVR42uzbS07DMBCAYTeqyoKy4hIcAfFYQ4FtF1wGTgSFVcsNuAV3KAcItuRIVYkdP+aRUWYkL6ouov+r1caROmvb1kx5GjPxUQAFUAAFUAAFUAAFUICpzvxi8xx7/8yuX+GN0YbYDri168eue8HxT77hKhfAxW/tOrfrQyiCi3/zDV8hhD6AGx9/6l+fCETo4hf+9TKE0PTE7w7ijUCE43gTQ2gin7wRiBCKDyJ0ANc+fjlwAYfwaddKYHwvQuPjdwnx3Sz8TlgJjP+H4ABeMuLHiJAbf4jw6gDWdn0XXHgMCKXxxjevHcDerjuBCLXxrnnffQlKQwCJP/4ZlIIAFt93IwSB8CAlPnQrXIuwQUIAj48dhsaGgBI/dBweCwJafMoTIW4E1PgUAE4E9PhUACiEx7HF5wBAILwnIpDF5wJQIJDGlwBgIpDHlwJgILDE1wBAIrDFu5lX3qR0CO7pymUhguGKr90BUDuBLR4KoBaBLR4SgAoBNB4aABsBPB4DAAsBJR4LABoBLR4TAAoBNR4boBYBPZ4CoBSBJJ4KIBeBLJ4SIBWBNJ4aYAiBPJ4DIITAEg9xGoQ4RRqueE6AQwTDFe9mpn+amvgogAIogAIogAIogAJMdv4EGAD0rsQRDp6p9QAAAABJRU5ErkJggg==");
background-repeat: no-repeat;
background-position: center;
background-size: 12px;
-webkit-transition: -webkit-transform linear 0.3s;
transition: -webkit-transform linear 0.3s;
transition: transform linear 0.3s;
transition: transform linear 0.3s, -webkit-transform linear 0.3s;
}
.icon_sort--up::after {
-webkit-transform: rotate(-180deg);
transform: rotate(-180deg);
}
/*== 嚙緯嚙皚UI嚙調橘蕭 ==*/
input[type="password"] {
-webkit-appearance: none;
}
.subview_box {
margin: 20px 0px 0px;
}
.sub_code {
padding-top: 5px;
}
.sub_button{
margin-top:20px;
}
.has-error input.form-control{
margin-bottom:0px;
}
/*== 嚙畿嚙碼嚙踝蕭嚙踝蕭嚙調橘蕭 ==*/
.subview_inner .input {
margin: 0px 0px;
height: 45px;
}
.subview_head hr {
margin-bottom: 13px;
}
.sub_height {
padding-top: 13px;
}
.sub_table h6 {
margin-top: 7.85px;
margin-bottom: 7.85px;
}
.table_left {
height: 24px;
}
.sub_table input[type=radio]:not(old), input[type=radio ]:not(old), .sub_table input[type=checkbox]:not(old), input[type=checkbox ]:not(old) {
width: 24px;
height: 24px;
}
.sub_table input[type=radio]:not(old):checked + label, .sub_table input[type=checkbox]:not(old):checked + label {
width: 24px;
height: 24px;
background-size: 24px 24px;
}
.sub_table input[type=radio]:not(old) + label, .sub_table input[type=checkbox]:not(old) + label {
width: 24px;
height: 24px;
background-size: 24px 24px;
}
.sub_table input[type=radio]:not(old):checked + label, .sub_table input[type=checkbox]:not(old):checked + label {
background-size: 24px 24px;
}
/*== 嚙皚嚙調牌嚙範嚙盤嚙踝蕭 ==*/
.txt_Inforbox {
padding: 14px 20px;
}
ul{
list-style: none;
}
.subview_main{
padding:0 26px;
overflow-y: auto;
}
.subview_main_statement{
padding: 0 26px;
margin: 50px auto 150px;
}
.subview_main_verification{
padding: 0px 26px;
overflow-y: auto;
}
.registerBtnPadding{
padding: 0 26px;
}
/* 銝剔�瘣餃� */
.full_modal .modal-dialog{
margin: 0px auto;
width: 100%;
}
.full_version{
height: 100vh;
position: relative;
}
.full_version i{
width: 24px;
height: 24px;
display: inline-block;
position: absolute;
right: 15px;
top: 14px;
cursor: pointer;
z-index: 99999999;
}
.full_version .full_box img{
width: 220px;
margin: 0px auto;
}
.full_version .full_box{
position: absolute;
width: 100%;
text-align: center;
top: 50%;
left: 50%;
right: 0;
transform: translate(-50%, -50%);
}
.full_version .full_box p{
color: #fff;
font-size: 20px;
}
.full_version .full_box p span{
color: #FD8F24;
font-size: 26px;
}
.modal.fade.full_modal .modal-dialog {
transform: translateY(0vh);
}
/* 銝剔�瘣餃� end*/
/* 頧董��� */
.bankcode .search img {
width: 20px;
}
.bankcode {
position: relative;
background-color: #fff;
/*box-shadow: 0px 8px 30px 3px #c8dac857;
border: 1px solid #efefef; */
margin-top: -1px;
}
.bankcode .search {
left: 10px;
top: 14px;
position: absolute;
}
.bankcode input {
padding: 0px 34px;
/* border: 0px;
box-shadow: initial; */
background-color: #fff;
margin: 0px 0px;
height:45px;
}
.banksearch {
border-bottom: 1px solid #dedede;
}
.banksearch input {
height:45px;
}
.bankselect{
max-height:392px;
overflow-y: auto;
}
ul.bankselect {
margin: 0;
list-style: none;
padding: 0px;
/* border: 1px solid #efefef;*/
border-right: 1.5px solid #D7DADC;
border-bottom: 1.5px solid #D7DADC;
border-left: 1.5px solid #D7DADC;
border-bottom-left-radius: 2px;
}
.bankselect li {
padding: 8px 20px;
border-bottom: 1px solid #dedede;
cursor: pointer;
line-height: 23px;
}
.bankselect li:hover {
color: #fff;
background-color: #1baf54;
}
.bank_select {
color: #3A3A3A;
position: relative;
}
.bank_select .bs-caret {
position: absolute;
right: 16.71px;
top: 13px;
padding: 2px 3px;
margin-top: -2px;
color: transparent;
background: url(../images/icon_down02_black_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 20px;
}
.bank_select.select-has .bs-caret {
background: url(../images/icon_down02_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 20px;
-moz-transform: scaleY(-1);
-webkit-transform: scaleY(-1);
-o-transform: scaleY(-1);
transform: scaleY(-1);
}
.bank_select_disabled .bs-caret {
background: url(../images/icon_down02_gray_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 20px;
}
.select-has-error .bs-caret {
background: url(../images/icon_down02_black_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 20px;
}
.bank_select .caret {
border-top: 8px dashed;
border-top: 8px solid \9;
border-right: 8px solid transparent;
border-left: 8px solid transparent;
}
.bank_select select:focus + .bs-caret2{
background: url(../images/icon_down02_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 20px;
-moz-transform: scaleY(-1);
-webkit-transform: scaleY(-1);
-o-transform: scaleY(-1);
transform: scaleY(-1);
}
.bs-caret.bs-caret2{
pointer-events: none;
top:20px;
right: 12px;
}
ul.select-tag04.search_all li:last-child > a.tag{
border-bottom: none;
}
.subview_inner.bank_inner {
overflow: auto;
}
.changeBankHeight {
max-height: 500px!important;
}
.bank-title {
font-weight: 700;
}
.bank-sub-title {
color: #6B7771;
}
.line-grey {
border-top: 1px solid rgba(95, 108, 114, 0.2);
}
.sat-max-width-350 {
max-width: 350px;
margin: 15px auto 0;
font-size: 15px;
padding: 0px 10px;
}
.subview_head_new h1 {
text-align: center;
color: #3A3A3A;
font-size: 17px;
font-weight: 300;
line-height: 23px;
margin-top: 10px
}
.subview_head_new hr {
border-top: 1px solid #bfbfbf;
margin-top: 0px;
}
.subview_head_new .modal-close {
top: 10px;
}
.height-300 {
height: 300px;
}
/* 扣款提醒 start */
.backdrop{
height: 100%;
width: 100%;
background-color: rgba(0,0,0,0.1);
position: absolute;
z-index: 1045;
}
.backdrop:before {
content: '';
position: absolute;
width: 100%;
height: 100%;
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
z-index: 1050;
}
.reminder-header {
text-align: center;
margin: 33px 33px 7px 33px;
}
.reminder-content {
text-align: center;
margin: 0px 33px 9px 33px;
height: 57.5px;
font-size: 16px;
}
.uesr-info {
font-weight: 700;
font-size: 16px;
line-height: 21px;
color: #3A3A3A;
}
.uesr-info span {
font-weight: 700;
font-size: 16px;
line-height: 21px;
color: #3A3A3A;
}
a.tag-outline{
border-radius: 6px;
border: 1.5px solid #98E3BA;
background: #98E3BA;
color: #3A3A3A;
font-weight: 700;
font-size: 16px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
text-decoration: auto;
margin: 0 10px;
padding: 4px 20px;
}
a.tag-outline:hover {
border-radius: 6px;
border: 1.5px solid #34BC6A;
background: #34BC6A;
color: #FFFFFF;
font-weight: 700;
font-size: 16px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
text-decoration: auto;
}
#CustomHelloModal .sub_button a{
white-space: nowrap;
}
@media (max-width: 340px) {
#CustomHelloModal .sub_button {
flex-wrap: wrap;
}
#CustomHelloModal .sub_button a:not(:last-child) {
margin-bottom: 10px;
}
}
.d-flex {
display: flex;
}
.px-26 {
padding: 0px 26px;
}
.max-width-400 {
max-width: 400px;
margin: auto;
}
/* 扣款提醒 End */
/* FAQ底下新增答案評分功能 Start */
.frqDiv {
padding-left: 20px;
color: #3D3D3D;
font-size: 16px;
padding-right: 20px;
margin: 0px 26px;
}
.frqBtnDiv {
cursor: pointer;
/* margin-bottom: 1rem;*/
overflow: overlay;
}
.frqBtnDiv span {
color:#A0A0A0;
font-size: 14px;
padding-left: 4px;
}
.frqBtnDiv a {
float: left;
text-align: center;
font-size: 16px;
line-height: 24px;
background-color: #E8F0E8;
color: #26A862;
border-radius: 22px;
height: 35px;
padding-top: 5px;
list-style: none;
margin-right: 8px;
margin-bottom: 8px;
text-decoration: none;
}
.frqBtnDiv a:hover{
text-decoration: none;
color: #FFFFFF;
background: #34BC6A;
outline: none;
}
.frqQr-tag1, .frqQr-tag2, .frqQr-tag3 {
max-width: 500px;
}
.frqQr-tag1 a {
width: 100%;
}
.frqQr-tag2 a {
width: calc(50% - 8px);
}
.frqQr-tag3 a {
width: calc(33.3% - 8px);
}
.replySpan {
display: block;
font-weight: 400;
font-size: 12px;
line-height: 16.8px;
text-align: center;
color: #3A3A3A;
border-radius: 6px;
background-color: #EBEBEB;
width: 287px;
height: 33px;
margin-bottom: 8px;
line-height: 33px;
vertical-align: middle;
}
/* FAQ底下新增答案評分功能 End */
/* fly-QR start */
.fly-qr {
position: absolute;
top: -100px;
width: calc(100% - 30px);
z-index: 9999;
transition: top 1s;
}
.fly-qr-wrap {
cursor: pointer;
}
.fly-qr-content {
background-color: #98E3BA;
border-radius: 13px;
padding: 14px 16px;
box-shadow: 0px 6px 14px 0px #4444441A;
font-size: 14px;
font-weight: 700;
color: #3A3A3A;
}
.fly-qr-content {
display: flex;
align-items: center;
justify-content: space-between;
}
.fly-qr-content-left {
display: flex;
align-items: center;
}
.fly-qr-content-left .img-box img{
width: 35px;
height: 35px;
}
.fly-qr-content .msg {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
margin: 0 0 0 4px
}
.robot .fly-qr-div .dialog-box .time {
text-align: right;
margin: 3px 0 20px 20px;
}
/* fly-QR End */
/* CheckCard start */
.robot .dialog-box .check-card-div {
border-radius: 0 12px 12px 12px;
box-shadow: 0px 6px 14px 0px #4444441A;
padding: 16px 16px 8px;
max-width: 288px;
}
.message-tags {
margin-left: -8px;
padding: 5px 16px 5px 16px;
border-radius: 12px;
background: #98E3BA;
font-size: 16px;
font-weight: 700;
line-height: 24px;
color: #3A3A3A;
}
.check-img-box {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin: 16px 0 0;
}
.check-img-item {
width: 33.333%;
display: flex;
flex-direction: column;
align-items: center;
position: relative;
margin: 0 0 10px;
padding: 4px 0 0;
}
.checkbox-group {
position: absolute;
left: 18px;
}
.check-img-item .item-img-box {
width: 46px;
height: 46px;
}
.checkbox-group input[type=radio]:not(old) + label,.checkbox-group input[type=checkbox]:not(old) + label {
display: inline-block;
border: 2px solid #34BC6A;
width: 18px;
height: 18px;
margin: 5px 0px;
width: 18px;
border-radius: 4px;
background-color: #fff;
}
.checkbox-group input[type=radio]:not(old):checked + label,.checkbox-group input[type=checkbox]:not(old):checked + label {
background: url(../images/icon_ok_white.png) no-repeat 2px 3px;
background-size: 11px 9px;
background-color: #34BC6A;
border: 2px solid #34BC6A;
margin: 5px 0px;
}
.check-img-item .title {
font-size: 16px;
font-weight: 700;
line-height: 24px;
color: #26A862;
padding: 8px 0;
user-select:none; /* standard syntax */
-webkit-user-select:none; /* for Chrome、Safari */
-moz-user-select:none; /* for Mozilla、Firefox */
}
.check-img-item .title.hasNot {
color: #A0A0A0;
}
.check-img-item::before {
content: "";
width: 2px;
height: 50px;
background: #EBEBEB;
position: absolute;
right: 0;
top: 20%;
}
.check-img-item::after {
content: "";
width: 50px;
height: 2px;
background: #EBEBEB;
position: absolute;
top: -10px;
}
.check-img-item:nth-child(3n)::before, .check-img-item:nth-child(-n+3)::after {
content: none;
}
.check-card-div .sub_button{
margin-top: 0;
}
.sub_button button.tag {
width: 100%;
}
.sub_button button.tag:disabled {
border: 1.5px solid #D7DADC;
background: #D7DADC;
color: #FFFFFF;
}
.other-link-box {
text-align: center;
margin: 11px 0 8px;
}
.other-link-box span {
font-size: 16px;
font-weight: 400;
line-height: 24px;
}
.other-link-box .link {
color: #26A862;
cursor: pointer;
}
.cursor-pointer {
cursor: pointer;
}
/* CheckCard End */
/* KYC聲明事項 Start */
.sub_button .tag2 {
border-radius: 6px;
border: 1.5px solid #FFFFFF;
background: #FFFFFF;
color: #3A3A3A;
font-weight: 700;
font-size: 16px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
text-decoration: none;
max-width: 382px;
}
.sub_button .tag2:hover {
border-radius: 6px;
border: 1.5px solid #FFFFFF;
background: #FFFFFF;
color: #3A3A3A;
font-weight: 700;
font-size: 16px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
text-decoration: none;
}
.KYCNoticeSubTitle {
line-height: 24px;
font-weight: 700;
padding: 12px 0 8px 27px;
max-width: 375px;
margin: 0px auto;
}
.KYCNoticeTable {
max-width: 375px;
margin: 0px auto;
position: relative;
overflow-wrap: break-word;
}
.KYCNoticeTr {
}
.spacer {
margin: 0 15px;
position: absolute;
width: 88%;
left: 2%;
height: 10px;
border-bottom: 2px solid #EBEBEB;
}
.spacer2 {
height: 20px;
}
.KYCNoticeLabel {
display: inline-block;
border: 2px solid #A0A0A0;
width: 24px;
height: 24px;
margin: 5px 10px 0 16px;
border-radius: 4px;
}
.KYCNoticeLabelChecked {
display: inline-block;
border: 2px solid #98E3BA;
width: 24px;
height: 24px;
background : url(../images/icon_ok_2x_new.png) no-repeat -1px -2px;
background-size: 24px 24px;
background-color: #98E3BA;
margin: 5px 10px 0 15px;
border-radius: 4px;
}
.KYCNoticeTitle {
cursor: pointer;
margin-right: 10px;
font-weight: 300;
line-height: 24px;
}
.KYCNoticeImg {
width: 24px;
height: 24px;
margin-bottom: 2px;
margin-right: 16px;
cursor: pointer;
}
.KYCNoticeContentDiv {
overflow-x: hidden;
-webkit-overflow-scrolling: touch;
}
.KYCNoticeAgreeBtn {
width: 100%;
position: relative;
bottom: 0px;
}
.width50 {
width: 50% !important;
}
.bottomDiv {
position: absolute;
bottom: 0;
width: 100%;
box-shadow: 0px -8px 24px 0px rgba(68, 68, 68, 0.08);
}
#pdfContainer canvas {
width: 100%;
}
/* KYC聲明事項 End */