html.cathay_smart.smart_bg ,
body.cathay_smart.smart_bg {
background-color: #F5F5F5;
}
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%;
}
.modal-open .modal.overflow_y_hid{
overflow-y: hidden;
}
.modal a{
color: #0091FF;
/* text-decoration: underline; */
}
.modal a:hover,
.modal a:focus{
/* color: #26A862; */
/* color: #23527C; */
text-decoration: underline;
}
.forexAtmDiv{
border-bottom: solid #EBEBEB 2px;
padding: 15px 0px;
}
.forexAtmDiv:first-child{
padding: 0px 0px 15px;
}
h1 {
font-size: 30px;
}
h2 {
font-size: 20px;
}
h3, h4 {
font-size: 18px;
}
/* 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;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
.logo {
background: url(../images/logo_2x.png);
background-size: 27px 24px;
display: inline-block;
vertical-align: middle;
}
}
.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: #1AAF54;
}
.sat_content_sat {
/* max-width: 350px; */
margin: 0px auto;
font-size: 16px;
padding: 4px 24px 0px 24px;
}
.sat_content_sat p {
color: #3A3A3A;
}
.sat_content_sat span {
color: #26A862;
}
.remind {
position: absolute;
z-index: 999;
right: 20px;
background-color: #fff;
padding: 5px;
top: 55px;
opacity: 0.6;
border-radius: 5px;
font-size: 12px;
color: #666666;
}
.noheader .header {
display: none;
}
.wrap.noheader .content
{
/* margin-top: 0px; go on life.style */
/* height:calc(100vh - 60px); go on life.style */
}
/* header end */
/* content */
/*20191118敺Ⅱ隤�閮餉圾*/
.wrap .content {
margin-top: 50px;
padding-top: 15px;
box-sizing: border-box;
padding-bottom: 15px;
padding-left: 16px;
padding-right: 16px;
overflow-y: auto;
overflow-x: hidden;
height:calc(100vh - 110px);
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 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 */
width: 250px;
word-break:break-all;
}
.segment.secard {
width: 200px;
}
.segment .txt{
padding: 8px 16px;
position: relative;
}
.robot .dialog-box .segment .txt .title,.slider .segment .txt .title,.robot .dialog-box .secard .txt .title{
font-size: 16px;
font-weight: 300;
color: #3A3A3A;
}
.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: 700;
}
.title{
font-weight: 300;
font-size: 16px;
color: #3A3A3A;
margin-bottom: 0px;
text-align:left;
line-height: 24px;
}
.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;
}
/* 新增LINK的 disabled 樣式 */
.btn-bottom a.disabled,.secard a.disabled {
color: #A0A0A0 !important; /* 文字變淡灰色 加了important連滑鼠移上去也是變灰色*/
pointer-events: none; /* 禁用點擊 */
cursor: not-allowed; /* 滑鼠變禁用符號 */
background-color: #f5f5f5; /* 背景變淡灰（可依需求調整） */
font-weight: 400; /* 字重變淡（可選） */
border-top: 2px solid #ddd; /* 邊框也變淡一點 */
}
.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/card14.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 16px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-weight: 400;
font-size: 16px;
line-height: 24px;
}
.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: #37474F;
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;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-size: 16px;
line-height: 22.4px;
}
.img-credbank08{
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-credbank00.flag01{
width: 250px;
height: 165px;
background: url(../images/flag01.png), url(../images/flag00.png);
background-repeat: no-repeat;
background-position: left 194px top 28px, left 20px top 20px;
background-size: 28px 20px, 210px 124px;
}
.img-credbank00.flag02{
width: 250px;
height: 165px;
background: url(../images/flag02.png), url(../images/flag00.png);
background-repeat: no-repeat;
background-position: left 194px top 28px, left 20px top 20px;
background-size: 28px 20px, 210px 124px;
}
.img-credbank00.flag03{
width: 250px;
height: 165px;
background: url(../images/flag03.png), url(../images/flag00.png);
background-repeat: no-repeat;
background-position: left 194px top 28px, left 20px top 20px;
background-size: 28px 20px, 210px 124px;
}
.img-credbank00.flag04{
width: 250px;
height: 165px;
background: url(../images/flag04.png), url(../images/flag00.png);
background-repeat: no-repeat;
background-position: left 194px top 28px, left 20px top 20px;
background-size: 28px 20px, 210px 124px;
}
.img-credbank00.flag05{
width: 250px;
height: 165px;
background: url(../images/flag05.png), url(../images/flag00.png);
background-repeat: no-repeat;
background-position: left 194px top 28px, left 20px top 20px;
background-size: 28px 20px, 210px 124px;
}
.img-credbank00.generic{
width: 250px;
height: 116px;
background: url(../images/card24_new.png);
background-repeat: no-repeat;
background-position: left 20px top 20px;
background-size: 210px 74px;
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;
}
.img-credbank12
{
width: 250px;
height: 100px;
background: url(../images/card41.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 100%;
border-radius: 0 12px 0px 0px;
}
.img-credbank12 p {
height: 100px;
color: #3A3A3A;
width: 160px;
display: flex;
justify-content: center;
align-items: center;
padding: 0px 16px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-weight: 400;
font-size: 16px;
line-height: 24px;
}
.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.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;
}
.img-credbank02{
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-credbank05{
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-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.png), url(../images/flag00.png);
background-repeat: no-repeat;
background-position: left 194px top 28px, left 20px top 20px;
background-size: 28px 20px, 210px 124px;
}
.img-credbank00.flag02{
width: 250px;
height: 165px;
background: url(../images/flag02.png), url(../images/flag00.png);
background-repeat: no-repeat;
background-position: left 194px top 28px, left 20px top 20px;
background-size: 28px 20px, 210px 124px;
}
.img-credbank00.flag03{
width: 250px;
height: 165px;
background: url(../images/flag03.png), url(../images/flag00.png);
background-repeat: no-repeat;
background-position: left 194px top 28px, left 20px top 20px;
background-size: 28px 20px, 210px 124px;
}
.img-credbank00.flag04{
width: 250px;
height: 165px;
background: url(../images/flag04.png), url(../images/flag00.png);
background-repeat: no-repeat;
background-position: left 194px top 28px, left 20px top 20px;
background-size: 28px 20px, 210px 124px;
}
.img-credbank00.flag05{
width: 250px;
height: 165px;
background: url(../images/flag05.png), url(../images/flag00.png);
background-repeat: no-repeat;
background-position: left 194px top 28px, left 20px top 20px;
background-size: 28px 20px, 210px 124px;
}
.img-credbank00.generic{
width: 250px;
height: 116px;
background: url(../images/card24_new.png);
background-repeat: no-repeat;
background-position: left 20px top 20px;
background-size: 210px 74px;
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-credbank12{
width: 250px;
height: 100px;
background: url(../images/card41_2x.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 100px;
border-radius: 0 12px 0px 0px;
}
.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/card14.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 250px 165px;
border-radius: 0 12px 0px 0px;
}
.img-credbank03{
width: 250px;
/** background-color: #FFD600; **/
background-color: #FFFFFF;
border-radius: 0 12px 0px 0px;
}
.img-credbank04{
width: 250px;
background-color: #FFFFFF;
border-radius: 0 12px 0px 0px;
}
.img-credbank03.segment-round {
border-radius: 0px 12px 12px 12px;
}
.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;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-size: 16px;
line-height: 22.4px;
}
.img-credbank01 .txt_bank h5{
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-size: 16px;
line-height: 21px;
color: #000000;
}
.img-credbank01 .txt_bank p{
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-size: 16px;
line-height: 22.4px;
color: #000000;
}
.img-credbank03 h5{
font-weight: 300;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-size: 16px;
line-height: 24px;
color: #000000;
}
.img-credbank03 p{
font-weight: 700;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-size: 16px;
line-height: 24px;
color: #000000;
}
.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: 30px;
height: 30px;
border-radius: 12px;
display: inline-block;
position: absolute;
top: 0;
right: 0px;
}
.hr-dashed{
border-top: 1px dashed #ABCABB;
}
/*.robot a {
font-weight: 700;
text-decoration: underline;
}
/* 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: 12px 12px 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-x: hidden;
overflow-y: auto;
border-radius: 12px 12px 0px 0px;
}
/* ui-blackCover end */
/* card */
.txt_yellow h5 {
padding-top: 0px;
margin-top: 0px;
margin-bottom: 2px;
}
/* 憸冽���� start */
.txt_bank h5,.txt_safe h5{
font-size: 16px;
font-weight: 300;
margin: 0px;
margin-bottom: 0px;
line-height: 24px;
color: #3A3A3A;
}
.txt_bank p,.txt_safe p{
font-size: 16px;
font-weight: 700;
line-height: 24px;
margin-bottom: 15px;
color: #3A3A3A;
}
.img-credbank00 .txt_bank h5{
font-size: 14px;
font-weight: 300;
margin: 0px;
margin-bottom: 0px;
line-height: 19.6px;
color: #3A3A3A;
}
.img-credbank00 .txt_safe h5{
font-size: 16px;
font-weight: 300;
margin: 0px;
margin-bottom: 0px;
line-height: 24px;
color: #3A3A3A;
}
.img-credbank00 .txt_bank p,.txt_safe p{
font-size: 16px;
font-weight: 700;
line-height: 24px;
margin-bottom: 0px;
color: #3A3A3A;
}
/* 憸冽���� end */
.txt_safe p:last-child{
margin-bottom: 0px;
}
.txt_bank {
padding: 23px 44px 23px 44px;
position: relative;
}
.txt_safe {
padding: 8px 16px 8px 16px;
position: relative;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
}
.txt_yellow{
padding: 20px;
}
.txt_sec {
padding: 22px 20px 15px 20px;
position: relative;
height: 165px;
}
.txt_sec p{
position: absolute;
bottom: 11px;
left: 53px;
font-size: 18px;
color: #27AE58;
font-weight: 400;
}
.img-credbank03 .txt_safe span{
border-radius: 12px 12px 12px 12px;
background-color: #fff;
min-width: 65px;
height: 24px;
color: #27AE58;
padding: 4px 10px;
position: absolute;
right: 10px;
text-align: center;
font-size: 12px;
top: 10px;
}
.img-credbank04 .txt_safe span{
border-radius: 12px 12px 12px 12px;
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-credbank04 .txt_safe .small-tit{
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
border-radius: 0px 12px 0px 12px;
width: auto;
color: #3A3A3A;
padding: 4px 16px 4px 16px;
font-size: 14px;
line-height: 19.6px;
background-color: #D7DADC;
display: inline-block;
font-weight: 700;
position: absolute;
right: 0px;
top: 0px;
height: 28px;
}
.img-credbank00{
width: 250px;
background-color: #FFFFFF;
border-radius: 0 12px 0px 0px;
}
.img-credbank00 .txt_safe span{
border-radius: 12px 12px 12px 12px;
background-color: #e65100;
width: 65px;
height: 24px;
color: #fff;
padding: 4px 0px;
position: absolute;
right: 10px;
text-align: center;
font-size: 12px;
top: 10px;
}
.img-credbank00 .txt_safe .small-tit{
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
border-radius: 0px 12px 0px 12px;
width: auto;
color: #FFFFFF;
padding: 4px 16px 4px 16px;
font-size: 14px;
line-height: 19.6px;
background-color: #EC464A;
display: inline-block;
font-weight: 700;
position: absolute;
right: 0px;
top: 0px;
height: 28px;
}
a {
color: #0091FF;
}
a:hover, a:focus {
color: #0091FF;
text-decoration: underline;
}
a:visited {
color: #23527C;
text-decoration: underline;
}
.txt_Infor {
display: table;
width: 100%;
padding: 8px 0px;
}
/* 憸冽���� start */
.infor_left {
float: left;
font-size: 16px;
font-weight: 300;
line-height: 24px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
}
.infor_right {
float: right;
font-size: 16px;
font-weight: 700;
line-height: 24px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
}
/* 憸冽���� end */
.txt_Inforbox {
padding: 8px 16px 8px 16px;
position: relative;
}
.small_tit_Inforbox {
padding: 40px 0px 6px 8px;
position: relative;
}
.txt_Inforbox hr {
border-top: dashed #879195 1px;
}
.failure {
position: absolute;
background-color: #FDF1EB;
border-radius: 12px;
color: #E65100;
padding: 2px 30px 2px 36px;
top: -13px;
font-size: 13px;
line-height: 19px;
font-weight: 400;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
}
.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 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 8px 10px 0px rgba(68,68,68,0.05); /* Opera 10.5 + M 弇y k */
}
.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: 16px;
}
.cback_right h5 {
text-align: center;
color: #fff;
margin-bottom: 6px;
}
.cback_right h1 {
text-align: center;
margin: 0px;
}
.cback_day{
width: 175px;
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: 16px;
}
.cback_day.dayno{
background: url(../images/cardday02.png);
background-repeat: no-repeat;
background-position: center bottom;
background-size: 165px 120px;
color: #3A3A3A;
font-size: 16px;
}
.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: #3A3A3A;
font-size: 14px;
padding: 5px 0px 10px 0px;
}
.cathynote p {
max-width: 266px;
padding-left: 28px;
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;
}
.cathynote .cathynote_line .cathynote_line_ht {
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-size: 14px;
font-weight: 300;
line-height: 19.6px;
color:#3A3A3A;
margin-top: 3.4px;
}
.cathynote .cathynote_line_ht {
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-size: 14px;
font-weight: 300;
line-height: 20.27px;
color:#3A3A3A;
}
.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: 16px;
}
.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: 16px;
}
.cathynote i.icon{
background: url(../images/icon_down_2x.png);
background-size: 100%;
}
.cathynote i.open{
background: url(../images/icon_up_2x.png);
background-size: 100%;
display: block;
width: 24px;
height: 24px;
float: left;
}
}
/**
.small-tit {
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
border-radius: 12px;
width: auto;
color: #3A3A3A;
padding: 4px 6px 3px;
font-size: 16px;
background-color: #98E3BA;
display: inline-block;
font-weight: 700;
position: absolute;
top: 12px;
}
**/
.small-tit {
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
border-radius: 0px 12px 0px 12px;
width: auto;
color: #3A3A3A;
padding: 4px 16px 4px 16px;
font-size: 14px;
line-height: 19.6px;
background-color: #98E3BA;
display: inline-block;
font-weight: 700;
position: absolute;
right: 0px;
top: 0px;,
line-height: 19.6px;
height: 28px;
}
.smart_note p {
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
font-weight: 400;
background-color: #EBEBEB;
padding: 10px 12px;
font-size: 12px;
color: #3A3A3A;
border-radius: 5px;
line-height: 16.8px;
max-width: calc(100vw - 88px);
}
.smart_note {
text-align: left;
width: 350px;
margin-left: 60px;
}
/* card end */
/* subview */
.subview_all {
overflow-x: hidden;
overflow: auto;
}
.subview_inner {
padding: 0px 26px;
padding: 0px 24px 10px;
max-width: 400px;
margin: 0px auto;
position: relative;
max-height: 450px;
overflow-x: hidden;
overflow-y: auto;
}
.sub_button a {
float: left;
text-align: center;
width: 100%;
font-size: 16px;
/* box-shadow: 0px -8px 10px 0px rgba(68,68,68,0.08);*/
}
.subview_head h1 {
text-align: center;
color: #3A3A3A;
font-size: 16px;
font-weight: 300;
line-height: 24px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
margin-bottom: 13px;
margin-top: 13px;
}
.subview_head h2 {
text-align: center;
color: #3A3A3A;
font-size: 16px;
line-height: 24px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
}
.subview_head hr {
border-top: 1px solid #bfbfbf;
/* margin-bottom: 12px; */
margin-bottom: 0px;
padding-bottom: 10px;
margin-top: 15px;
}
.desc {
font-size: 16px;
font-weight: 700;
line-height: 24px;
}
.sub_code a{
color: #26A862;
}
.sub_code {
color: #879195;
font-weight: 400;
font-size: 16px;
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 input {
margin-top: 7px;
height: 45px;
font-size: 16px;
color: #3A3A3A;
}
.code_img {
width: 131px;
height: 51px;
display: table;
}
.sub_button_content{
max-width: 350px;
margin: 0px auto;
font-size: 16px;
padding: 0px 10px;
}
/* 憸冽���� start */
.sub_button .return{
border-radius: 6px;
border: 1.5px solid #27AE58;
background-color: #ffffff;
color: #27AE58;
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;
}
.sub_button .return:hover{
border-radius: 6px;
border: 1.5px solid #34BC6A;
background-color: #34BC6A;
color: #ffffff;
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;
}
/* 憸冽���� end */
.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;
}
.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 .tag .disabled{
border: 1.5px solid #d7dadc;
background-color: #d7dadc;
color: white;
}
.sub_button p{
text-align: center;
color: #27AE58;
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 10px; */
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 10px; */
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:focus{
text-decoration:none;
margin: 5px auto;
border: 1.5px solid #D7DADC;
background: #D7DADC;
/* padding: 12px 10px; */
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;
font-size: 16px;
}
.sub_code .time {
color: #26A862;
font-size: 16px;
text-decoration: none;
}
.subview_box .icon_phone{
width: 24px;
height: 24px;
display: inline-table;
}
.subview_box .phone{
font-weight: 700;
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%;
}
.form-control:focus {
border:1.5px solid #34BC6A;
-webkit-box-shadow: none;
box-shadow: none;
}
/* end 2018-04-11 */
.has-success input.form-control{
-webkit-box-shadow: none;
box-shadow: none;
border:1.5px solid #27AE58;
}
.has-success input.form-control:focus{
-webkit-box-shadow: none;
box-shadow: none;
border:1.5px solid #27AE58;
}
.has-error input.form-control{
-webkit-box-shadow: none;
box-shadow: none;
border:1.5px solid #EC464A;
margin-bottom: 7px;
}
.has-error input.form-control:focus{
-webkit-box-shadow: none;
box-shadow: none;
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 {
color: #EC464A;
}
.sub_input {
position: relative;
}
.sub_input2.has-error img {
border: #E65100 1px solid;
}
.sub_input2.has-error span {
color: #E65100;
}
.sub_input2 {
position: initial;
}
.phone_code{
display: inline-block;
width: 80%;
padding-left: 5px;
}
.card_code{
display: inline-block;
width: 76px;
}
.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: #0091FF;
margin-top: 7px;
float: right;
}
.qa:hover{
/* color: #23527C; */
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: 24px;
height: 24px;
margin: 0 auto;
padding: 0;
opacity: 0;
cursor: pointer;
position: absolute;
z-index: 99;
left: 0px;
}
.agree input[type=radio]:not(old), input[type=radio ]:not(old),.sub_table input[type=checkbox]:not(old), input[type=checkbox ]:not(old),.agree2 input[type=radio]:not(old), input[type=radio ]: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_new.png) no-repeat 0 0px;
font-size: 14px;
position: absolute;
width: 24px;
height: 24px;
background-size: 24px 24px;
left: 0px;
}
.sub_table input[type=radio]:not(old):checked + label,.sub_table input[type=checkbox]:not(old):checked + label {
background : url(../images/icon_checked.png) no-repeat 0 0px;
width: 24px;
height: 24px;
margin: 0;
padding: 0;
position: absolute;
left: 0px;
}
.agree input[type=radio]:not(old) + label,.agree2 input[type=radio]:not(old) + label{
display: inline-block;
border: 2px solid #26af57;
width: 24px;
height: 24px;
}
.agree input[type=checkbox]:not(old) + label,.agree2 input[type=checkbox]:not(old) + label{
display: inline-block;
border: 2px solid #A0A0A0;
width: 24px;
height: 24px;
}
.agree input[type=checkbox]:not(old):checked + label,.agree2 input[type=checkbox]:not(old):checked + label{
display: inline-block;
border: 2px solid #98E3BA;
width: 24px;
height: 24px;
}
.agree input[type=radio]:not(old):checked + label,.agree2 input[type=radio]:not(old):checked + label{
background : url(../images/icon_ok.png) no-repeat -1px -2px;
}
.agree input[type=checkbox]:not(old):checked + label,.agree2 input[type=checkbox]:not(old):checked + label{
background : url(../images/icon_ok_new.png) no-repeat -1px -2px;
background-color: #98E3BA;
}
.agree h5, .agree2 h5 {
display: inline-block;
margin: 0px 5px;
float: left;
font-size: 16px;
line-height: 24px;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
}
.agree_left {
display: inline-block;
float: left;
}
.agree
{
display: inline-block;
padding-top: 10px;
position: absolute;
bottom: 0px;
}
.agree2{
display: inline-block;
padding-top: 10px;
}
.agree label,.agree2 label{
margin-bottom: 0px;
}
.note{
margin: 0px 20px 10px;
font-size: 16px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
.sub_table input[type=radio]:not(old) + label,.sub_table input[type=checkbox]:not(old) + label {
background: url(../images/icon_select02_2x_new.png) no-repeat 0 0px;
background-size: 24px 24px;
left: 0px;
}
.sub_table input[type=radio]:not(old):checked + label,.sub_table input[type=checkbox]:not(old):checked + label {
display: inline-block;
padding: 0px;
margin: 0px;
background: url(../images/icon_checked@2x.png) no-repeat 0 0px;
font-size: 14px;
background-size: 24px 24px;
left: 0px;
}
.agree input[type=radio]:not(old):checked + label,.agree2 input[type=radio]:not(old):checked + label{
background : url(../images/icon_ok_2x.png) no-repeat -1px -2px;
background-size: 24px 24px;
}
.agree input[type=checkbox]:not(old):checked + label,.agree2 input[type=checkbox]:not(old):checked + label{
background : url(../images/icon_ok_2x_new.png) no-repeat -1px -2px;
background-size: 24px 24px;
background-color: #98E3BA;
}
}
.table_left {
width: 24px;
padding: 0;
margin: 0 auto;
position: relative;
height: 24px;
}
/* 憸冽���� start */
.sub_table p {
color: #3A3A3A;
margin-bottom: 0px;
padding-top: 0px;
font-size: 16px;
font-weight: 300;
line-height: 24px;
}
.sub_table span {
color: #26A862;
font-size: 12px;
font-weight: 400;
line-height: 16.8px;
}
/* 憸冽���� end */
.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: #F5F6F6;
}
.table_right {
padding: 10px 0px;
}
.sub_button {
margin-top: 10px;
}
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-x: hidden;
/*overflow-y: hidden;*/
padding-top: 10px;
}
.subview_tit h2 {
font-size: 16px;
text-align: center;
font-weight: 300;
color: #3A3A3A;
}
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%;
}
/* 憸冽���� start */
.sub_table h6{
float: left;
font-size: 14px;
color: #777777;
font-weight: 300;
line-height: 19.6px;
margin-top: 2px;
margin-bottom: 2px;
}
/* 憸冽���� end */
th.table_01 {
width: 20%;
}
/* subviewtable end */
/* totalbill */
.sub_table.totalbill .total_card {
background-color: #e3f3e3;
height: 40px;
color: #27AE58;
}
.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;
/**box-shadow: 0px -4px 10px 0px #dde6dc;**/
}
.select-box.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;*/
border-bottom: 5px solid #F5F5F5;
}
.realService{
position: absolute;
display: none;
top: -46px;
left: 12px;
}
a.showService .realService{
display: block;
}
.rsInner {
position: absolute;
padding: 12px 26px;
background-color: #fff;
border-radius: 45px 45px 45px 45px;
color: #27AE58;
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;
}
.rsInner::before {
content: "";
position: absolute;
background-image: url(../images/robot.png);
background-repeat: no-repeat;
bottom: -11px;
left: 13px;
z-index: 0;
width: 0;
height: 0;
border-style: solid;
border-color: #fff transparent transparent transparent;
border-width: 15px 7.5px 0 7.5px;
}
.select-tag .tag:hover, .tag:hover {
/** border: 1px solid #27AE58; **/
background: #34BC6A;
color: #fff;
}
.select-box a {
float: left;
text-align: center;
width: 100%;
font-size: 16px;
font-weight: 700;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
}
.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;
}
.select-tag .tag,.tag{
z-index: 100;
/*display: none;*/
margin: 5px auto;
/**border: 2px solid #27AE58;**/
background: #ECF2EC;
padding: 8px;
border-radius: 30px;
color: #27AE58;
font-size: 16px;
font-weight: 400;
}
.return{
z-index: 100;
/*display: none;*/
margin: 5px auto;
border: 2px solid #27AE58;
background: #ffffff;
padding: 12px 10px;
border-radius: 30px;
color: #27AE58;
font-size: 15px;
font-weight: 400;
}
.select-tag .tag:hover,.tag:hover{
/** border: 2px solid #27AE58; **/
text-decoration: none;
outline: none;
}
.select-tag .tag:focus,.tag:focus{
/** border: 2px solid #27AE58; **/
text-decoration:none;
color: #ffffff;
background: #34BC6A;
}
.select-tag .tag,.search_in{
z-index: 100;
/*display: none;*/
margin: 5px auto;
background: #ECF2EC;
padding: 12px 10px;
border-radius: 30px;
color: #27AE58;
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-top: solid #EBEBEB 2px;
background: #F5F5F5;
color: #3A3A3A;
/** border: 2px solid #27AE58; **/
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;
}
.select-menu {
background-color: #F5F5F5;
border-top: 5px solid #F5F5F5;
display: table;
width: 100%;
padding: 5px 0px 15px;
}
.footer-menu {
box-shadow: 0px -16px 24px 0px #44444414;
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 i{
width: 20px;
height: 18px;
background: url(../images/icon_mic_2x_new.png);
background-size: 100%;
background-repeat: no-repeat;
display: block;
position: absolute;
top: 11px;
left: 11px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
span.btn-search i{
width: 20px;
height: 18px;
background: url(../images/icon_mic_2x_new.png);
background-size: 100%;
background-repeat: no-repeat;
display: block;
position: absolute;
top: 11px;
left: 11px;
}
}
span.btn-search{
display: block;
width: 40px;
height: 40px;
background-color: #57CD99;
border-radius: 20px;
margin: 10px auto;
position: relative;
z-index: 999;
}
span.btn-search:active i, span.btn-search:hover i{
width: 20px;
height: 18px;
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:active, span.btn-search:hover{
display: block;
width: 40px;
height: 40px;
background-color: #34BC6A;
border-radius: 20px;
margin: 10px auto;
position: relative;
z-index: 999;
}
span.btn-search.disable_right{
background-color: #D7DADC;
}
span.btn-search.disable_right i{
width: 23px;
height: 19.5px;
background: url(../images/icon_send_2x_new.png);
background-size: 100%;
background-repeat: no-repeat;
display: block;
position: absolute;
top: 11px;
left: 11px;
}
span.btn-search.disable_right:hover{
background-color: #D7DADC;
}
span.btn-search:hover {
background-color: #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: #A0A0A0;
font-size: 16px;
line-height: 22px;
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{
color: #A0A0A0;
border: 1px solid #D7DADC;
background-color: #EBEBEB;
}
.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: 30px;
display: block;
width: 100%;
height: 42px;
padding: 4px 13px 6px 44px;
margin: 2px 0;
color: #A0A0A0;
font-size: 16px;
line-height: 32px;
border: none;
background-color: #F5F5F5;
}
ul.subview_rule{
margin: 0px;
padding: 15px 0px 0px;
list-style: none;
}
.subview_rule li{
color: #879195;
font-size: 12px;
padding: 2px 0px;
}
.subview_rule img{
display:inline-block;
vertical-align: top;
padding-top: 2px;
padding-right: 5px;
}
.subview_rule .rule_tit{
display:inline-block;
width: 90%;
}
.rule-top p{
padding-top: 15px;
}
.rule-top .top-tit{
margin: 20px 0px 0px;
}
.dropdown-menu>li>a {
display: block;
padding: 3px 20px;
clear: both;
font-weight: 400;
line-height: 1.42857143;
color: #3A3A3A;
white-space: nowrap;
}
.dropdown-menu.inner>li>a {
padding: 8px 20px;
}
.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: #fff;
}
.control-bar .box input.input::-moz-placeholder{
color: #B3B3B3;
}
.control-bar .box input.input:-ms-input-placeholder{
color: #B3B3B3;
}
.control-bar .box input.input:-moz-placeholder {
color: #B3B3B3;
}
.btn-add {
background: url(../images/icon_add_2x_new.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 40px 40px;
}
.btn-add:active, .btn-add:hover {
background: url(../images/icon_add02_2x_new.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 40px 40px;
}
.btn-add.disable_left {
background: url(../images/icon_add03_2x_new.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 40px 40px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
.btn-add {
background: url(../images/icon_add_2x_new.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 40px 40px;
}
.btn-add:active, .btn-add:hover {
background: url(../images/icon_add02_2x_new.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 40px 40px;
}
.btn-add.disable_left {
background: url(../images/icon_add_2x_new.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: #F5F5F5;
}
.line_image_div:first-child div .robot .avatar{
top: 11px;
}
.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 18px 18px 18px;
}
.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: 16px;
padding: 0px 10px;
}
.sat_all {
/** 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 8px 10px 0px rgba(68,68,68,0.08); **/
border-radius: 10px;
/** padding: 20px 0px 30px;
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;
}
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: 16px;
padding: 0px 10px;
}
.div_content{
overflow-y: auto;
position: relative;
}
.sat_content .sat_message {
line-height: 24px;
font-size: 16px;
font-weight: 300;
font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "sans-serif", "Roboto";
color: #3A3A3A;
}
.sat_content_onechatbot {
margin: 0px auto;
font-size: 15px;
padding: 0px 10px;
}
.sat_content_onechatbot p {
color: #3A3A3A;
}
.sat_content_onechatbot span {
color: #26A862;
}
.sat_img,.peo_img {
width: 100%;
position: absolute;
top: -83px;
}
.sat_img img {
text-align: center;
width: 153px;
margin: 0px auto;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
li.icon_star {
background-image: url(../images/icon_star_2x_new.png);
width: 40px;
height: 40px;
background-size: 96px 33px;
list-style: none;
background-position: -60px 4px;
background-repeat: no-repeat;
}
li.icon_star.open {
background-image: url(../images/icon_star_2x_new.png);
width: 40px;
height: 40px;
background-size: 96px 33px;
list-style: none;
background-position: 0px 4px;
background-repeat: no-repeat;
}
}
.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;
}
textarea.form-control {
background-color: #F5F5F5;
font-size: 16px;
height: auto;
min-height: 230px;
font-weight: 400;
}
.remainCharacter {
position: absolute;
bottom: 2px;
right: 5px;
color: #A0A0A0;
font-size: 14px;
line-height: 20px;
font-weight: 400;
}
.sat_all .mes_p{
padding: 20px 0px 0px;
}
.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 rgba(68,68,68,0.05);
}
.otp_shock {
display: table;
margin: 40px auto 0px;
text-align: center;
font-size: 16px;
}
.otp_shock img {
width: 24px;
height: 24px;
margin: 15px auto;
}
.otp_share img{
width: 50px;
height: 50px;
display: inline-block;
}
.otp_share ul{
display: table;
padding: 0;
margin: 0px auto;
}
.otp_share li{
display: inline-block;
text-align: center;
padding: 30px 25px 58px;
}
.otp_share a p{
margin: 0px;
padding-top: 2px;
color: #3A3A3A;
font-size: 12px;
}
.otp_share a:hover, .otp_share a:focus{
text-decoration:none;
}
/* service end*/
.cathay_smart_open {
background-color: #fff;
bottom:100%;
}
.smart_tit {
border-bottom: 1px solid #bfbfbf;
min-height: 45px;
}
.smart_link {
height: calc(80vh);
overflow-y: scroll;
overflow-x: hidden;
-webkit-overflow-scrolling: touch;
}
.overflow-y-hidden { /* ����蔭閮剖�� */
overflow-y: hidden;
}
.smart_link iframe {
height: 100%;
/* height: calc(100% - 5px); */
border: 0;
border-radius: 0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
-ms-border-radius: 0px;
-o-border-radius: 0px;
overflow: auto;
-webkit-overflow-scrolling: touch !important;
}
/* 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;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
.smart_alpha {
background-image: url(../images/smart_alpha_2x.png);
background-size: 100%;
background-position: 0px 14px;
}
.smart_alpha.end{
background-image: url(../images/smart_alpha02_2x.png);
background-size: 100%;
background-position: 0px 14px;
}
.smart_alpha.shut{
background-image: url(../images/smart_alpha03_2x.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: #34BC6A;
cursor: default;
background-color: #fff;
border-bottom: 2px solid #34BC6A;
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: 16px;
color: #879195;
background-color: #fff;
}
.cathay_smart .nav-tabs > li > a:hover {
border-bottom: 2px solid #34BC6A;
color: #34BC6A;
}
.cathay_smart .nav > li {
width: 50%;
text-align: center;
}
.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 #34BC6A;
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: 24px;
margin-left: 10px;
}
.sub_table td {
padding: 0px 5px;
}
.sub_height {
max-height: 310px;
}
.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) {*/
/* .sub_height {*/
/* max-height: 230px;*/
/*}*/
/* .select-tag02 li {*/
/* padding: 0px 2px;*/
/*}*/
/*.select-box a {*/
/* font-size: 13px;*/
/*}*/
/*}*/
@media (max-width: 750px) {
.sub_height {
max-height: 347px;
}
}
@media (max-width: 360px) {
.sub_height {
max-height: 280px;
}
}
@media (max-width: 320px) {
.sub_height {
max-height: 210px;
}
.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: #879195!important;
font-weight: 300;
font-size: 16px;
}
input::-webkit-input-placeholder { /* WebKit browsers */
color: #879195!important;
font-weight: 300;
font-size: 16px;
}
input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #879195!important;
font-weight: 300;
font-size: 16px;
}
input::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #879195!important;
font-weight: 300;
font-size: 16px;
}
input:-ms-input-placeholder { /* Internet Explorer 10+ */
color: #879195!important;
font-weight: 300;
font-size: 16px;
}
input.placeholder{ /* Internet Explorer 8 & 9*/
color: #879195!important;
font-weight: 300;
font-size: 16px;
}
input[type="text"] {
-webkit-appearance: none;
}
input.disable_in::-webkit-input-placeholder {
color: #fff!important;
font-weight: 300;
font-size: 16px;
}
input.disable_in::-webkit-input-placeholder { /* WebKit browsers */
color: #fff!important;
font-weight: 300;
font-size: 16px;
}
input.disable_in:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #fff!important;
font-weight: 300;
font-size: 16px;
}
input.disable_in::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #fff!important;
font-weight: 300;
font-size: 16px;
}
input.disable_in:-ms-input-placeholder { /* Internet Explorer 10+ */
color: #fff!important;
font-weight: 300;
font-size: 16px;
}
.control-bar .box.focus {
padding: 5px 0 0 0;
margin: 0 0 30px 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: 600px){
.sub_height {
max-height: 250px;
}
.sat_content {
/*height: 450px;*/
overflow-x: hidden;
overflow-y: auto;
}
}
@media screen and (max-height: 550px){
.sub_height {
max-height: 200px;
}
.sat_content {
height: 300px;
}
}
@media screen and (max-height: 500px){
.sub_height {
max-height: 150px;
}
.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 {
max-height: 200px;
overflow: auto;
}
.sat_content {
height: 200px;
}
}
.bootstrap-select .dropdown-menu > li > a:hover,
.bootstrap-select .dropdown-menu > li > a:focus{
color: #fff;
text-decoration: none;
background-color: #1baf54;
}
/* 憸冽���� start */
.bootstrap-select .caret{
border: unset;
background: url(../images/icon_dropdown_new.png);
width: 24px;
height: 24px;
}
.bootstrap-select .dropdown-toggle:focus {
border-color: #34BC6A;
}
/* 憸冽���� end */
.bootstrap-select .bs-caret{
position: absolute;
right: 10px;
padding: 2px 5px;
margin-top: -2px;
border-radius: 5px;
color: #fff;
background-color: #1baf54;
}
.sing_lightbox{
display:inline-block;
width: 100%;
}
.sing_font p{
padding: 10px;
}
.sing_font h5 a{
color: #1AAF54;
text-decoration: none;
border-bottom: 1px solid #1AAF54;
}
.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: #1AAF54;
text-decoration: none;
border-bottom: 1px solid #1AAF54;
line-height: 25px;
}
.agree.bank_agree {
width: 100%;
padding-top: 15px;
}
.agree.bank_agree p{
color: #3A3A3A;
text-align: center;
margin: 0px;
padding: 15px 0px 0px;
font-size: 16px;
}
.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;
}
@media screen and (min-height: 640px){
.subview_inner.bank_height{
max-height: 560px;
overflow-x: hidden;
overflow-y: auto;
}
}
.sign_new .panel-body{
padding: 0px 15px;
}
.sign-otp .subview_box{
margin: 15px 0px 0px;
}
.acc_number{
color: #879195;
font-size: 16px;
padding: 0px 0px 15px;
cursor: pointer;
}
.sing_remarks{
padding-left: 32px;
}
.sing_link a {
color: #1AAF54;
text-decoration: none;
/* border-bottom: 1px solid #1AAF54; */
}
.sing_link {
padding: 10px 0px;
margin: 10px auto;
display: table;
}
.sign_new_inner {
padding: 0px 26px;
max-width: 400px;
margin: 0px auto;
position: relative;
}
.sign_new_inner_column {
padding: 20px 26px;
max-width: 400px;
margin: 0px auto;
position: relative;
max-height: 460px;
}
.registeredIframeClass{
height: 460px;
/* height: 80vh;
max-height: 640px; */
}
/*�����ND*/
/* 銝剔�暑��� */
.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*/
/* 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;
padding: 4px 20px;
border-radius: 22px;
height: 35px;
padding-top: 7px;
list-style: none;
margin-right: 8px;
margin-bottom: 8px;
}
.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 {
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;
/* display: table-cell;*/
margin-bottom: 8px;
line-height: 33px;
vertical-align: middle;
}
/* FAQ摨�憓����� End */
/* 憸冽���� start */
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;
}
/* 憸冽���� 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�afari */
-moz-user-select:none; /* for Mozilla�irefox */
}
.check-img-item .title.hasNot {
color: #A0A0A0;
}
.check-img-item::before {
content: "";
width: 1px;
height: 50px;
background: #EBEBEB;
position: absolute;
right: 0;
top: 20%;
}
.check-img-item::after {
content: "";
width: 50px;
height: 1px;
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;
}
/* CheckCard End */