.icon{
    width: 45px;
    height: auto;
}
section{
    margin:0.64rem;
}

button{
    color:#000;
}

.imgCenter{
    display: block;
    margin-left: auto;
    margin-right: auto;

}
.tablinks{
border: none;
outline: none;
background-color: transparent;
font-size: 18px;
font-weight: 700;
}

.flag{
height: auto;
width: 22px;
margin-right: 10px;
}

/*.tablinks{
    border-radius: 14px;
    border: 1px solid #C3C3C3;
padding:6px 10px; 
outline: 0;
color: #666;
background-color: #fff;
margin-right: 6px;
font-size: 14px;


}
.tablinks.active{
border-radius: 14px;
border: 1px solid #C14B57;
color:#C14B57;
padding:6px 10px; 
}*/
.blankModal2{
    position: relative;
background-color: #fff;
height: 100%;
/*padding-bottom: 30px;*/
background: #FFF;
box-shadow: 0px 0px 17px 0px rgba(0, 0, 0, 0.14);


z-index: 2;
}
.blankModal{
    position: relative;
    background-color: #fff;
    height: 100%;
    z-index: 3;
    background: #FFF;
    box-shadow: 0px 0px 17px 0px rgba(0, 0, 0, 0.14);
    text-align: center;
    }
.padding_30px{
    padding:16px 12px;
}
.padding_10px{
    padding:24px 10px 21px;
}
/*.fundList{
    height: 100%;
    width: 100%;
    background: #FFFFFF;
    box-shadow: 1px 2px 5px 0 rgba(0,0,0,0.25);
    -webkit-box-shadow: 1px 2px 5px 0 rgba(0,0,0,0.25);
      -moz-box-shadow: 1px 2px 5px 0 rgba(0,0,0,0.25);
    flex-wrap: wrap;
    padding:10px 0;
    justify-content: center;
}*/

.line{
    height: 1px;
    background-color: #f5f5f5;
    width: 100%;
    margin-top: 10px;
}
.line2{
    height: 1px;
    background-color: #BABABA;
    width: 100%;
    margin-top: 10px;
}
/*li{
    border-bottom: 1px solid  #DDD;
    margin-top: 8px;
}
li:last-child{
    border:none;
}*/
.shadow{
    box-shadow: 0px 0px 10px 0px #690D0B4D;

}
.title{
    margin: 16px 0px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    width: 100%;
}
.modal{
background-color: #fff;
padding:15px 12px;
box-shadow: 0px 0px 7px 0px #0000001C;
border-radius: 8px;
}
.modalQ{
    position: relative;
    background-color: #FFEADD;
    border-radius: 16px;
    padding:10px 0 10px 10px;
}
.modalQ::after{
    content:'';
    position: absolute;
   background-image: url(../img/Message-Box-Triangle-Pink.png);
   height: 100%;
   width: 18%;
   background-size: contain;
   background-position: center center;
   background-repeat: no-repeat;
   margin-top: 17px;
   margin-left: -40px;
   z-index: -1;
}
.modalQen{
    position: relative;
    background-color: #FFEADD;
    border-radius: 16px;
    padding:10px 10px 10px 10px;
}
.modalQen::after{
    content:'';
    position: absolute;
   background-image: url(../img/Message-Box-Triangle-Pink.png);
   height: 100%;
   width: 18%;
   background-size: contain;
   background-position: center center;
   background-repeat: no-repeat;
   top:54%;
   right:8%;
   z-index: -1;
}
.textC{
    text-align: center;
}
.modalA{
    position: relative;
    background-color: #F0F0F0;
    border-radius: 16px;
    padding:10px;
    width: 80%;
    z-index: 999;
}

.modalA::after{
    content:'';
    position: absolute;
   background-image: url(../img/Message-Box-Triangle-Grey.png);
   height: 100%;
   width: 18%;
   background-size: contain;
   background-position: center center;
   background-repeat: no-repeat;
    top:49%;
    left:10%;
   z-index: -1;
}

.modalAen{
    position: relative;
    background-color: #F0F0F0;
    border-radius: 16px;
    padding:10px;
    width: 80%;
    z-index: 999;
}

.modalAen::after{
    content:'';
    position: absolute;
   background-image: url(../img/Message-Box-Triangle-Grey.png);
   height: 100%;
   width: 18%;
   background-size: contain;
   background-position: center center;
   background-repeat: no-repeat;
    top:51%;
    left:10%;
   z-index: -9   ;
}

.box1{
    display: block;
}
.hide{
    display: none;
}
.visible{
visibility: hidden;
}
.q1{
    margin-right: 10px;
}
.arrow{
    width: 0.4266666666666667rem;
    height: 0.4266666666666667rem;
    float: right;
    margin-top: 0.0533333333333333rem;
    margin-left: 10px;
}
.border{
    border-top: 1px solid #DDDDDD;
    border-bottom: 1px solid #DDDDDD;
  
}
.type{
    height: 6px;
    width: 28px;
    margin-right: 10px;
}
.type2{
    height: 6px;
    width: 28px;
    margin-right: 10px;
}
.type3{
    height: 6px;
    width: 28px;
    margin-right: 10px;
}
.type4{
    height: 6px;
    width: 28px;
    margin-right: 10px;
}
.flexBtw{
    display: flex;
    align-items: center;
    justify-content: space-between;
    /*margin:0 15px;*/
    flex-direction: row;
}
.flexBtw2{
    display: flex;
    align-items: center;
    /*justify-content: space-between;*/
    /*margin:0 8px;*/
    flex-direction: row;  
}
.flex{
    display: flex;
    align-items: center;
    width: 100%;
    flex-direction: row;
    height: 100%;

}
.flexCenter{
    display: flex;
   justify-content: center;
    flex-direction: column;
}
.flexStart{
    display: flex;
    align-items: center;
    justify-content:flex-start;
    margin:0 15px;
    flex-direction: row;
}
.flexEnd{
    display: flex;
    align-items: center;
    justify-content:flex-end;
    /* margin:0 15px; */
    flex-direction: row;
    width: 100%;
}
.w50{
    width: 80%;
}
.w100{
    width: 100%;
}

.block{

    border-radius: 5px;
background: #D17881;
    font-size: 13px;
    padding:2px 6px;
    color: #FFFFFF;
    letter-spacing: 0;
    font-weight: 400;
    color:#fff;
   
}
.tag{
    border-radius: 25px;
    background: #FFF7F2;
    color: #C14B57;
    font-size: 13px;
    padding:3px 13px;
    margin-top: 9px;
    margin-right: 7px;
 
}
.banner{
    position: relative;
    z-index: 555;
}
/* .mr90{
    margin-right: 190px;
} */
/* padding */
.padding5px{
    padding: 5px;
}

.padding20{
   padding:0 20px;
    margin-top: -8px;
}
.padding24{
    padding:0 24px;
  
 }
 .padding70{
    padding:0px 70px 0px 0px
  
 }
 .padding25{
    padding:0 25px;
  
 }

.flex-col{
    display: flex;
    flex-direction: column;
    align-items: center;

}
.flex-row{
    display: flex;
    flex-direction: row;
    /* align-items: center; */
    justify-content: space-evenly;
    align-items: center;

}
.flexStart{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin: 0 15px;
    flex-direction: row;
}
.flexEnd{
    display: flex;
    justify-content:flex-end;
    margin: 0 -15px;

}
/* margin top */
.mt10{
    margin-top: 10px;
}
.mt21{
    margin-top: 21px;
}
.mt24{
    margin-top: 24px;
}

.mt48{
    margin-top: 48px;
}
.mt1{
    margin-top: -1px;
    padding: 0  0  10px 0 ;
}
.mt2{
    margin-top: 2px;
}
.m12{
    margin-top: 12px;
}
.mt7{
    margin-top: 7px;
 }
 .mt4{
    margin-top: 4px;
 }
 .mt8{
    margin-top: 8px;
 }
 .mt12{
    margin-top: 12px;
 }
.mb20{
    margin-bottom: 10px;
}
.h20{
    height: 10px;
}

.font8Grey{
font-size: 12px;
color: #969696;
letter-spacing: 0;
font-weight: 400

}
.font12{
    font-size: 12px;
color: #333333;
letter-spacing: 0;
font-weight: 500;
}
.font15{
 
font-size: 15px;
color: #9D9D9D;
letter-spacing: 0;
font-weight: 400;
}
.font15B{

font-size: 15px;
color: #333333;
letter-spacing: 0;
font-weight: 700;
}
.font14Grey{
    font-family: PingFangSC-Regular;
font-size: 14px;
color: #9C9C9C;
letter-spacing: 0;
font-weight: 400;
}
.font18{
    font-size: 18px;
color: #333333;
letter-spacing: -0.36px;
font-weight: 600;
}
@media only screen and (min-width: 1081px) and (max-width:1920px) {

    html{font-size:41.4px !important;}

    .w50{
        width: 60%;
    }
        
}

@media only screen and (min-width: 1081px) and (max-width:1920px) {
    html{font-size:41.4px !important;}

.w50{
    width: 50%;
}
    
  }
  
  
  @media only screen and (min-width: 820px) and (max-width: 1180px)  {
       html{font-size:41.4px !important;}
       .w50{
        width: 60%;
    }
        
  }

  @media only screen and (min-width: 768px) and (max-width: 1024px)  {
       html{font-size:41.4px !important;}
       .w50{
        width: 60%;
    }
    .modalQen2::after {
        content: '';
        position: absolute;
        background-image: url(../img/Message-Box-Triangle-Pink.png);
        height: 100%;
        width: 18%;
        background-size: contain;
        background-position: center center;
        background-repeat: no-repeat;
        margin-top: 9px;
    margin-left: -71px;
    z-index: -1;
    }
    .modalQen4::after {
        content: '';
        position: absolute;
        background-image: url(../img/Message-Box-Triangle-Pink.png);
        height: 100%;
        width: 18%;
        background-size: contain;
        background-position: center center;
        background-repeat: no-repeat;
        margin-top: 9px;
    margin-left: -71px;
    z-index: -1;
    } 
  }
  @media only screen and (min-width: 540px) and (max-width: 720px)  {
       html{font-size:41.4px !important;}
       .w50{
        width: 60%;
    }
    .modalQen2::after {
        content: '';
        position: absolute;
        background-image: url(../img/Message-Box-Triangle-Pink.png);
        height: 100%;
        width: 18%;
        background-size: contain;
        background-position: center center;
        background-repeat: no-repeat;
        margin-top: 9px;
    margin-left: -71px;
    z-index: -1;
    }
    .modalQen4::after {
        content: '';
        position: absolute;
        background-image: url(../img/Message-Box-Triangle-Pink.png);
        height: 100%;
        width: 18%;
        background-size: contain;
        background-position: center center;
        background-repeat: no-repeat;
        margin-top: 9px;
    margin-left: -71px;
    z-index: -1;
    }
  }

  @media only screen  and (max-width: 320px)  {
       html{font-size:41.4px !important;
   }
   .type{
    width: 40px;
   }
       body{
        font-size: 14px;
       }
       .font16{
        font-size:13px;
       }
       .font8Grey{
        font-size: 9px;
       }
       .w50{
        width: 80%;
    }
    .modalQ::after{
        margin-top: -16px;
        z-index: -10;
    }
    .modalA::after{
        margin-top: -16px;
        z-index: -10;
    }
    .modalQen{
        position: relative;
    }
    .modalQen::after {
        content:'';
        position: absolute;
        background-image: unset;
    }
    .modalQen2::after{
        content:'';
        position: absolute;
        background-image: unset;
    }
 
            }