* {
    list-style: none;
    text-decoration: none;
    margin: 0;
    padding: 0;
}
html{
    font-size:16px;
}
[v-cloak] {
    display: none;
}
/*!* 当屏幕宽度小于等于 768px 时应用的样式 *!*/
/*@media screen and (max-width: 768px) {*/
/*  html {*/
/*    font-size: 14px;*/
/*  }*/
/*}*/

/*!* 当屏幕宽度大于等于 768px 且小于等于 1024px 时应用的样式 *!*/
/*@media screen and (min-width: 768px) and (max-width: 1024px) {*/
/*  html {*/
/*    font-size: 16px;*/
/*  }*/
/*}*/

/*!* 当屏幕宽度大于等于 1024px 时应用的样式 *!*/
/*@media screen and (min-width: 1024px) {*/
/*  html {*/
/*    font-size: 18px;*/
/*  }*/
/*}*/

.content {
    /* width: 90rem; */
    width: 100%;
    background-color: #f5f4f4;
    /*padding-bottom: 10rem;*/
}

.topnav {
    background-color: #fff;
    width: 100%;
    height: 4rem;
    display: flex;
    align-items: center;
}

.navcontent {
    margin: 0 auto;
    width: 75rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo {
    width: 6.75rem;
    height: 2rem;
}

.opbox {
    display: flex;
    list-style: none;

}
.choose{
    color: #0aabf5 !important;
    font-weight: 600;
    border-bottom: 4px solid #0aabf5;
    padding-bottom: .2rem;
}
.opbox li {
    font-weight: 600;
    width: 5rem;
    height: 1.5rem;
    margin-right: 1.75rem;
    color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    font-size: 1rem;
    font-family: '微软雅黑';
}
.opbox li a{
    color: rgba(0, 0, 0, 0.5);
    font-size: 15px;
    font-weight: 400;
}

.opbox li img {
    width: 1rem;
    height: 0.5rem;
}
.opbox li:nth-child(2){
    position: relative;
}
/*.tuike{*/
/*  position: relative;*/
/*}*/
.hidden{
    visibility: hidden;
    position: absolute;
    top: 3.5rem;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
    padding: 10px 15px;
    min-width: 7.5rem;
    z-index: 99999;
    background-color: #FFFFFF;
    width: 280px;
}
.tuike:hover .hidden{
    visibility: visible;
}
.plachoder {
    height: 100px;
    width: 100%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -3rem;
}
.triangle-up {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 8px solid #FFF;
    position: absolute;
    top: -0.5rem;
    left: 50%;
    transform: translateX(-50%);
}
.drop-content-item {
    color: rgba(0, 0, 0, 0.6);
    font-size: 0.875rem;
    height: 5.5rem ;
    display: inline-flex ;
    align-items: center ;
    position: relative ;
    z-index: 9999 ;
    width: 100% ;
}

.drop-content-item:hover .drop-content-item-right-title,
.drop-content-item.active .drop-content-item-right-title {
    color: #0894ff !important;
}

.drop-content-item-icon {
    width: 3rem !important;
    height: 3rem !important;
}

.drop-content-item-right {
    margin-left: 1rem ;
}

.drop-content-item-right-title {
    color: #666666 ;
    font-size: 1rem ;
    font-weight: 500 ;
    line-height: 1.5rem ;
    margin-bottom: 0.25rem ;
}

.drop-content-item-right-desc {
    font-size: 0.75rem ;
    line-height: 1.25rem ;
    color: rgba(0, 0, 0, 0.6) ;
}
.core {
    background-color: #fff;
    width: 75rem;
    margin: 1.5rem auto ;
    padding-bottom: 4.6875rem;
}

.titlebox {
    border-bottom: 1px solid #EDEDED;
    padding: 1.5rem;
    display: flex;
    justify-content: space-between;
}

.title {
    font-weight: 600;
    font-size: 1.25rem;
}

.color0091FF {
    color: #0091FF;
}

.bgc0091FF {
    background-color: #0091FF;
}

.back {
    font-weight: 600;
    font-size: 1.25rem;
    color: #0091FF;
}

.wenan {
    margin: 1.5rem auto 0;
    width: 71rem;
    background-color: #f5f7f9;
    font-weight: 400;
    font-size: 0.75rem;
    font-family: PingFangSC, PingFang SC;
    color: #666666;
    text-align: left;
    font-style: normal;

    padding: 1rem;
}

.progressbox {
    width: 100%;
    display: flex;
}

.progressitem {
    padding: 10px 0;
    flex: 1;
    font-size: 16px;
    line-height: 16px;
    color: #666;
    text-align: center;
}

.progresstitle {
    /*font-weight: 600;*/
    font-size: 0.75rem;
    color: #777;
    line-height: .75rem;
    margin-top: 1rem;
}

.explain {
    margin-top: 0.5rem;
    font-weight: 400;
    font-size: .75rem;
    color: #666666;
    /*line-height: 1.375rem;*/
}

.progressimg {
    width: 2.25rem;
    height: 2.25rem;
}

.bar{
    width: 11rem;
    height: 1px;
    background-color: #D9D9D9 ;
    position: relative;
    top: 1.875rem;
    left: 13rem;
}
.operation{
    display: flex;
    padding: 0 1.5rem;
    justify-content: space-between ;
}
.leftarea{
  
    background-color: #FAFAFA;
    width: 35.5rem;
    padding-bottom: 1rem;
    border: 1px solid #ededed;
}

.selectbox{
    display: flex;
    align-items: center;
    justify-content: end;
    padding:1rem 1.3rem 0 0;
    margin-bottom: 1.5rem;
}
.jiekou::before{
    display: inline-block;
    margin-right: 4px;
    color: #ff4d4f;
    font-size: 0.875rem;
    font-family: SimSun, sans-serif;
    line-height: 1;
    content: "*";
}
.jiekou::after{
    content: ":";
    position: relative;
    top: -.5px;
    margin: 0 8px 0 2px;
}

.select{
    width: 21rem;
    font-size: 0.875rem;
    padding: 0.25rem 0.6875rem;
}
.apitokenbox{
    display: flex;
    align-items: center;
    justify-content: end;
    padding-right: 2rem;
    margin-bottom: 1.5rem;
    position: relative;
}

.apitoken span{
    display: inline-block;
    margin-right: 4px;
    color: #ff4d4f;
    font-size: 0.875rem;
    font-family: SimSun, sans-serif;
    line-height: 1rem;
}
.apitoken::after{
    content: ":";
    position: relative;
    top: -.5px;
    margin: 0 8px 0 2px;
}
.apitokenipt{
    width: 20rem;
    height: 2rem;
    font-size: 0.875rem;
    padding-left:  1rem;
    border: 1px solid #dcdfe6;
}

.apitokenipt:focus {
    /* 光标进入输入框时的边框样式 */
    border: 1px solid #007bff!important;
    /* ... */
}
.fenge{
    height: 1px;
    background-color: #EDEDED;
    margin-bottom:1.5rem ;
}
.btnbox{
    display: flex;
    justify-content: end;

}
/*.el-select .el-input .el-select__caret{*/
/*    color: #C0C4CC;*/
/*    font-size: 14px;*/
/*    transform: rotateZ(180deg);*/
/*    cursor: pointer;*/
/*}*/
/deep/ .el-input--suffix .el-input__inner.el-input__icon{
    height: 0  !important;
    width: 25px;
}
.submit{
    text-align: center;
    line-height: 2rem;
    width: 5.5rem;
    height: 2rem;
    font-size: 0.875rem;
    color: #FFFFFF;
    border: 0;
    margin-right: 21rem;
    cursor: pointer;
}
.rightarea{
    width: 35.5rem;

}
.resposetitlebox{
    width: 100%;
    height: 2.75rem;
    background-color: #EDEDED;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid #ededed;
}
.resposetitle{
    margin-left: 1rem;
    font-weight: 500;
    font-size: 1rem;
    color: #666666

}
#test{
    width:32.5rem ;
    white-space: pre-wrap;
    word-wrap: break-word;
    padding: 1.5rem;
    /*overflow-wrap: break-word;*/
}
.function{
    display: flex;
    justify-content:flex-end;
    width: 7.5rem;
    font-weight: 500;
    font-size: 1rem;
    color: #0091FF;
    margin-right: 1rem;
    cursor: pointer;
}
.format{
    cursor: pointer;
}
.copy{
    font-weight: 500;
    font-size: 1rem;
    color: #0091FF;
    cursor: pointer;
}
.bottom{
    width: 100%;
    /*height: 19rem;*/
    padding: 2.9rem 0 1.4rem 0;
    background-color: #272b2e;
}
.bottom-center{
    width: 75rem;
    margin: 0 auto;
}
.bottom-top{
    display: flex;
}
.bottom-ul{
    flex: 1;
    color: #FFFFFF;
    font-weight: 400;
    /*text-align: center;*/
}
.bottom-ul li:first-child{
    margin-bottom: 0.9375rem;
    font-size: 1.125rem;
}
.bottom-ul li{
    margin-bottom:0.7rem;
}
.bottom-ul li a{
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 0.75rem;
    text-align: left;
}
.bottom-bottom{
    display: flex;
    justify-content: center;
    color: #fff;
    margin: 3rem auto 0  auto;
    font-size: 0.875rem;
}
.bottom-bottom span{
    margin:0 1rem;
}
.bottom-bottom div a{
    color: #fff;
}
.loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* 半透明黑色背景 */
    z-index: 9999; /* 确保加载弹窗在最顶层 */
    justify-content: center;
    align-items: center;
    display: none;
}

.loading-spinner {
    border: 5px solid #f3f3f3; /* 白色边框 */
    border-top: 5px solid #3498db; /* 蓝色顶部边框 */
    border-radius: 50%; /* 圆形 */
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite; /* 旋转动画 */
}
.message {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 10px 20px;
    border-radius: 5px;
    display: none;
}
.show {
    display: block;
}
#backToTopBtn {
    width: 4rem;
    height: 4rem;
    position: fixed;
    bottom: 20px;
    right: 20px;
    background-color: #7c7c7c;
    color: white;
    border: none;
    border-radius: 5px;
    padding:1rem;
    cursor: pointer;
}
.rightnav {
    position: fixed;
    right: 0;
}
#qqBtn {
    width: 80px;
    height: 80px;
    position: fixed;
    bottom: 110px;
    right: 20px;
    background-color: #7c7c7c;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    overflow: hidden;
}
#qqlist {
    position: fixed;
    bottom: 110px;
    right: 20px;
    background-color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    overflow: hidden;
}
#qqlist a span{
    display: block;
    font-size: 14px;
    line-height: 32px;
    box-sizing: border-box;
    border-radius: 4px;
    font-weight: 400;
    color: white;
    margin: 16px;
    padding-left: 30px;
    padding-right: 14px;
    white-space: nowrap;
    opacity: 1;
    cursor: pointer
    
}
#qqlist a span.ask {
    background: url(/assetsv2/images/qq.png) 8px center no-repeat rgba(43,133,228,1);
    background-size: 16px 16px;
}
#indexToTop {
    width: 35px;
    height: 35px;
    position: fixed;
    bottom: 20px;
    right: 20px;
    background-color: #7c7c7c;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    padding: 0;
	font-size: 11px;
}
#indexToTop:hover {
    background-color: #0056b3;
}
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
.el-color-picker__icon, .el-input, .el-textarea {
    display: inline-block;
    width: 20rem;
}