html,body{
        background: #f5f6f7;
        font-family: "微软雅黑";
        font-size: 14px;
        overflow: auto;
    }
    #check{
        margin-bottom: 100px;
    }
    #check>.search{
        background: #00050a;
        width: 100%;
        height: 500px;
    }
    #check>.search .input>input{
        width: 700px;
        height: 60px;
        padding: 10px;
        line-height: 60px;
        background: transparent;
        border-radius: 10px;
        outline: none;
        border: 1px solid deepskyblue;
        color: deepskyblue;
        font-size: 25px;
        text-align: center;
        margin-top: 15px;
    }
    #check>.search .op>button{
        line-height: 40px;
        text-align: center;
        cursor: pointer;
        outline: 0;
        background: #c4f25c;
        border: 2px solid #0c0c14 !important;
        border-radius: 999px !important;
        font-family: 'Inter', 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI Variable', 'Segoe UI', 'PingFang SC', '苹方', 'Microsoft YaHei UI', 'Microsoft YaHei', sans-serif;
        font-weight: 800;
        font-size: 15px !important;
        letter-spacing: 0.5px;
        height: 50px !important;
        width: 200px !important;
        margin-top: 18px !important;
        cursor: pointer;
        box-shadow: 6px 6px 0 #ff4d8d, 5px 5px 0 1px #ff4d8d;
        transition: transform .12s ease, box-shadow .12s ease;
    }
    #check>.search .op>button:hover{
        transform: translate(-2px, -2px);
        box-shadow: 9px 9px 0 #ff4d8d, 9px 9px 0 1px #ff4d8d;
        color: #0c0c14;
    }
    #check>.container{
        margin-top: -250px;
    }
    
    .info{
        border: 1px solid #eee;
        border-top: none;
        margin-top: 10px;
        background: white;
        border-radius: 8px 8px 0 0;
        padding: 2px;
    }
    .info.asninfo{
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .info>.title{
        background: linear-gradient(45deg, #e6efff, #fcfaff);
        color: #000;
        margin: 0 -1px 0 -1px;
        padding: 20px;
        text-align: center;
        border-radius: 8px 8px 0 0;
        justify-content: space-between;
    }
    
    .info>.content{
        font-size: 13px;
        background-color: white;
    }
    .info>.content>.warn-updating{
            background: #fff6f6;
            box-shadow: 0 0 0 1px #e0b4b4 inset, 0 0 0 0 transparent;
            margin: 5px;
            padding: 5px 10px;
            color: #9f3a38;
            display: flex;
            align-items: center;
        }
    .info>.content>.line{
        border-bottom: 1px solid #eee;
        display: flex;
        background: white;
        position: relative;
    }
    .info>.content>.line:nth-child(2n){
        background: #f5f7fb;
    }

    .info>.content>.line>.name{
        width: 200px;
        text-align: center;
        padding: 15px 10px;
        border-right: 1px solid #e0e0e0;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }
    .info>.content>.line>.content{
        flex: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        padding: 15px 10px;
    }
    .info>.content>.line>.content>img{
        width: 16px;
        margin-right: 5px;
    }
    .info>.content>.line>.content .op{
        position:absolute;
        right:20px;
        display: flex;
        justify-content: right;
        align-items: center;
        gap:10px;
        color: #2e67fe;
        user-select: none;
    }
    .info>.content>.line>.content .op>a
    {
        color:#2e67fe;
        text-decoration: none;
        cursor: pointer;
        padding-bottom: 1px;
        font-size: 14px;
        border-bottom: 1px solid #2e67fe;
        transform: scale(0.9);
    }
    .info>.content>.line.loc>.content>.report{
        color:#2e67fe;
        text-decoration: none;
        position:absolute;
        right:20px;
        cursor: pointer;
        padding-bottom: 1px;
        border-bottom: 1px solid #2e67fe;
        transform: scale(0.9);
    }
    .info>.content>.line.line-iptype .label,.info>.content>.line.line-risk .label{
        box-sizing: border-box;
        min-width: 90px;
    }
    .asninfomobile{
        display: none;
    }
    .asninfo{
        border-right: none;
        margin-top: 30px;
        padding: 5px;
        background: #fff;
        border-radius: 10px;
        box-shadow: 1px 1px 2px 1px #aaa;
    }
    .asninfo.oterinfo{
        border-radius:0 10px 10px 10px;
    }
    .asninfo>.title{
        background: linear-gradient(45deg, #e6efff, #fcfaff);
        color: #000;
        padding: 15px;
        text-align: center;
        display: flex;
        border-radius: 8px 8px 0 0;
        font-size: 12px;
    }
    .asninfo>.title>div:first-child{
        display: flex;
        align-items: center;
    }
    .asninfo>.title>div:first-child>img{
        width: 24px;
        height: 24px;
        margin-right: 8px;
    }
    .asninfo>.title>div{
        width: 150px;
    }

    .asninfo>.line{
        font-size: 13px;
    }
    .asninfo>.line{
        border-bottom: 1px solid #eee;
        display: flex;
        align-items: center;
        background: white;
        padding: 15px 10px;
        color: #666;
    }

    .asninfo>.line.invalid{
        filter: grayscale(0.5);
        background: #fafafa;
        color: #888;
        font-size: 12px;
    }
    .asninfo>.line:last-child{
        border-radius: 0 0 10px 10px;
    }
    .info>.content>.line.line-domains>.content{
        flex-direction: column;
        padding: 5px 10px;
    }
    .info>.content>.line.line-domains>.content>p {
        margin: auto 0;
        line-height: 27px;
    }
    .line.line-domains p{
        margin: 5px;
    }
    .line.line-domains a,.line.line-domains a:visited{
        color: #8E7BaD;
        cursor: pointer;
    }
    .line.asn a,.line.asn a:visited{
        color: #1E0BED;
        cursor: pointer;
    }
    .line.asnname a,.line.asnname a:visited
    , .line.orgname a,.line.orgname a:visited{
        color: #8E7BaD;
        cursor: pointer;
    }
    .asninfo>.line a, .asninfo>.line.asn a:visited{
        color: #1E0BED;
        cursor: pointer;
    }

    .asninfo>.line>div{
        width: 150px;
        text-align: center;
    }
    .asninfo.prefixes>.title>div:nth-child(3){
        flex: 1;
    }
    .asninfo.prefixes.geohistory>.title>div:nth-child(2){
        flex: 1;
    }
    .asninfo.prefixes.geohistory>.title>div:nth-child(3){
        flex: none;
    }
    .asninfo.orgs>.title>div:nth-child(1){
        flex: 1;
    }
    .asninfo.prefixes>.line>div:nth-child(3){
        flex: 1;
        text-align: left;
    }
    .asninfo.prefixes.geohistory>.line>div:nth-child(3){
        flex: none;
        text-align: center;
    }
    .asninfo.prefixes.geohistory>.line>div:nth-child(2){
        flex: 1;
        text-align: left;
    }
    .asninfo.orgs>.line>div:nth-child(1){
        flex: 1;
        text-align: left;
    }
    .asninfo.prefixes>.line>div:first-child{
        display: flex;
        align-items: center;
    }
    .asninfo.orgs>.line>div:first-child{
        display: flex;
        justify-content: left;
        align-items: center;
    }
    .asninfo>.line>div>div{
        margin-right: 5px;
        width: 12px;
        height: 12px;
    }
    .asninfo>.line>div>div.valid{
        background: limegreen;
        border: 1px solid #1f1a16;
        border-radius: 50%;
        background-image: none !important;
    }
    .asninfo>.line>div>div.invalid{
        background: #d8d3cc;
        border: 1px solid #1f1a16;
        border-radius: 50%;
        background-image: none !important;
    }
    .asninfo.prefixes>.line>.country{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .asninfo.prefixes>.line>.country>img{
        width: 16px;
        margin-right: 5px;
    }
    .asninfo.otherinfo-switch{
        width: 180px;
        display: flex;
        gap: 10px;
        justify-content: space-between;
        padding: 0;
        border-radius: 5px 5px 0 0;
    }
    .otherinfo-switch>.switch {
        color: #303133;
        padding: 5px 10px;
        cursor: pointer;
        border: 0.2em solid transparent;
        border-bottom: none;
        display: flex;
        align-items: center;
    }
    .otherinfo-switch>.switch:hover{
        color: deepskyblue;
    }
    .otherinfo-switch>.switch.active{
        color: deepskyblue;
        border: 0.2em solid deepskyblue;
        border-bottom: none;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
    }
    #error_report{
        width: 500px;
        border: 1px solid #000;
        box-shadow: 0 0 10px 5px #fff;
        position: absolute;
        left: calc(50% - 250px);
        top: 500px;
        background: #fff;
        padding: 20px;
        padding-top: 0;
        font-size: 12px;
        z-index: 999;
    }
    #error_report>.title{
        height: 40px;
        border-bottom: 1px solid #ccc;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        font-size: 14px;
    }
    #error_report>.close{
        position: absolute;
        right: 15px;
        top: 5px;
        transform: scaleX(1.5);
        cursor: pointer;
    }
    #error_report>.close:hover{
        color: #aaa;
    }
    #error_report .line{
        display: flex;
        justify-content: space-between;
        height: 40px;
        align-items: center;
    }
    #error_report .line input{
        padding: 5px 10px;
        width: 350px;
        outline: none;
        font-size: 12px;
    }
    #error_report>.btnreport{
        padding: 10px 20px;
        border: 1px solid deepskyblue;
        color: deepskyblue;
        margin: 0 auto;
        width: 70px;
        text-align: center;
        margin-top: 20px;
        cursor: pointer;
    }
    #error_report>.btnreport:hover{
        border: 1px solid #008fcf;
        color: #008fcf;
    }
    body #bdmap{
        height: 200px;
        margin-top: 2px;
        resize: vertical;
    }
    .maptitle {
        background: #888;
        color: white;
        padding: 20px;
        text-align: center;
        border-top: 0.2em solid deepskyblue;
        border-radius: 20px 20px 0 0;
        margin-top: 50px;
    }
    .nextip{
        margin-top: 50px;
        display: flex;
        justify-content: space-between;
    }
    .nextip>a{
        background: #fff;
        border-radius: 8px;
        border: 1px solid #2e67fe;
        text-decoration: none;
        overflow: hidden;
        color: #000;
        display: flex;
        align-items: center;
        box-sizing: border-box;
        height: 34px;
    }

    body .asninfo.oterinfo>.title>div{
        width: 100%;
        text-align: left;
    }
    body .asninfo.oterinfo>.line>div{
        width: 100%;
        text-align: left;
    }

    .label{
        padding: 5px 13px;
        color: white;
        border-radius: 3px;
        margin-right: 3px;
        display: inline-block;
        cursor: default;
    }
    .label.mini{
        padding: 3px 8px;
        transform: scale(0.7);
        font-size: 12px;
    }
    .label.tiny{
        padding: 3px 8px;
        transform: scale(0.55);
        font-size: 12px;
    }
    .label.green{
        background: green;
    }
    .label.lightgreen{
        background: limegreen;
    }
    .label.orange{
        background: lightcoral;
    }
    .label.yellow{
        background: orange;
    }
    .label.darkgreen{
        background: seagreen;
    }
    .label.red{
        background: red;
    }

    .riskbar>.riskitem{
        width: 12px;
        height: 12px;
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
        color: white;
    }
    .riskbar>.riskitem.riskcurrent{
        width: 138px;
        height: 26px;
        border: 1px solid #fff;
        border-radius: 3px;
        padding: 0 10px;
        margin: 0 5px;
        cursor: default;
    }
    .riskbar>.riskitem.riskcurrent .lab{
        margin-left: 10px;
    }
    .line-usecount .riskbar>.riskitem.riskcurrent{
        width: auto;
        min-width: 57px;
    }
    .usecountbar{
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 2px;
        border-radius: 3px;
        color: white;
        font-size: 12px;
        width: 154px;
        margin: 0 auto;
        position: relative;
        cursor: default;
    }
    .usecountbar[usecount='1 - 10 (极好)']{
        background: limegreen;
    }
    .usecountbar[usecount='10 - 100 (一般)']{
        background: #b5db60;
    }
    .usecountbar[usecount='100 - 1000 (风险)']{
        background: #f7aa1d;
    }
    .usecountbar[usecount='1000 - 10000 (高危)']{
        background: #e06133;
    }
    .usecountbar[usecount='10000+ (极度风险)']{
        background: #f3141d;
    }
    
    .websites{
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 10px;
    }
    .websites>a{
        margin-top: 10px;
        overflow:hidden; 
    }
    .websites>a>img{
        width: 130px;
        height: 30px;
        border-radius: 3px;
        border: 2px solid #000;
    }

    .info>.content>.line.line-domains>.content{
        max-height: 300px;
        overflow: auto;
        justify-content: unset;
    }
    .reversecname .line>div, .reversecname .title>div {
        flex: 1;
        text-align: left;
    }
    .reversecname .line>div {
        width: 150px;
    }

    .reversecname .line>div:last-child, .reversecname .title>div:last-child {
        width: 150px !important;
        flex: unset !important;
    }
    .reversecname .line{
        font-size: 13px;
    }
    .reversecname .line{
        border-bottom: 1px solid #eee;
        display: flex;
        align-items: center;
        background: white;
        padding: 15px 10px;
        color: #666;
    }

    .reversecname .line.invalid{
        filter: grayscale(0.5);
        background: #fafafa;
        color: #888;
        font-size: 12px;
    }
    .reversecname .line:last-child{
        border-radius: 0 0 10px 10px;
    }
    .reversecname .line>div:first-child{
        display: flex;
        align-items: center;
    }
    .reversecname .line>div>div.valid {
        background: url(/static/images/yes.png);
        background-size: cover;
        margin-right: 5px;
        width: 16px;
        height: 16px;
    }

    .asninfomobile.reversecname .item {
        background: #fff;
        display: flex;
        justify-content: space-between;
        margin-top: 2px;
    }
    .asninfomobile.reversecname .item>.name{
        margin-top: 2px;
        padding: 5px 10px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: #000;
    }
    .asninfomobile.reversecname .item>.name.cname{
        color: #888;
    }
    /*
    #ad_right>a{
        border-bottom: 1px solid #aaa;
        background: #f0f0f0 !important;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 260px;
        height: 80px;
    }*/
    
    @media screen and (max-width: 1919px) {
        .container{
            min-width: 1000px;
            width: 1000px;
        }
    }
    @media screen and (max-width: 1530px) {
        html,body{
            min-width: 1300px;
            overflow-x: auto;
        }
    }

    @media screen and (max-width: 1200px) {
        .container{
            width: 100%;
            min-width: 0px;
        }
        .toprow{
            margin-top: 50px;
            margin-left: 20px;
            margin-right: 20px;
        }
        #check{
            margin-bottom: 10px;
            position: relative;
        }
        #check>.search{
            padding: 0 20px;
            box-sizing: border-box;
        }
        #check>.search>.container{
            padding-top: 30px !important;
        }
        #check>.search .input>input{
            width: 100%;
        }
        #check>.search .op>button{
            width: 100%;
            height: 60px;
            border-radius: 10px;
        }
        #check>.container{
            margin-top: -330px;
        }
        #check .info{
            margin: 0 10px;
        }
        #check>.container>.info>.title>a{
            display: none;
        }
        .asninfo>.line{
            font-size: 12px;
        }
        .info>.content>.line>.name{
            width: 120px;
        }
        .info>.content>.line>.content{
            display: block;
        }
        .info>.content>.line.loc>.content{
            display: flex;
        }
        .info>.content>.line.ip>.content{
            display: flex;
            justify-content: center;
            align-items: center;
            word-break: break-word;
        }
        .info>.content>.line.loc>.content>.report{
            display: none;
        }
        #check .asninfo{
            margin: 0 10px;
            margin-top: 10px;
        }
        .asninfo>.title{
            border-radius: 8px 8px 0 0;
        }
        .asninfo>.title>div:nth-child(1){
            width: 150px;
        }
        .asninfo>.line{
            overflow-x: auto;
        }
        .asninfo>.line>div {
            width: 130px;
        }
        .asninfo.oterinfo>.line>div {
            width: 100%;
        }
        .asninfo.oterinfo>.title>div:nth-child(1){
            width: 100%;
        }
        .asninfo.oterinfo>.line>div {
            width: 100%;
        }
        #check .maptitle{
            margin-left: 10px;
            margin-right: 10px;
            margin-top: 20px;
            border-radius: 8px 8px 0 0;
        }
        #bdmap{
            margin: 0 10px;
        }
        .nextip{
            margin-top: 10px;
            padding: 0 10px;
        }
    }
    @media screen and (max-width: 1200px){
        .toprow{
            margin-top: 50px;
        }
        html,body{
            min-width: auto;
            overflow-x: auto;
        }
        #ad_right{
            display: none;
        }
    }
    @media screen and (max-width: 800px) {
        .ispwhy{
           display: none;
        }
        #websites-wrap{
            display: none;
        }
        #check>.search .input>input{
            height: 50px;
            line-height: 50px;
            font-size: 20px;
            border-radius: 8px;
        }
        #check>.search .op>button{
            height: 50px;
            border-radius: 8px;
        }
        .toprow{
            margin: 20px 10px 10px 10px;
        }
        #check>.container{
            margin-top: -290;
        }
        .info>.content{
            font-size: 12px;
        }
        .info>.content>.line>.name{
            width: 80px;
        }
        .info>.content>.line>.content .op{
            display: none;
        }
        .asninfo.prefixes,.asninfo.orgs,.asninfo.rirs{
            display: none;
        }
        
        #bdmap{
            margin: 0;
        }
        .nextip{
            display: none;
        }
        .showinvalidwrap{
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .showinvalid{
            background: #cee4ff;
            display: inline-block;
            padding: 2px 10px;
            border-radius: 4px;
            margin-bottom: 10px;
            color: #345587;
        }
        .fielddesc{
            display: none;
        }
        .asninfomobile{
            margin: 10px;
            color: #666;
            font-size: 12px;
            display: block;
            border: 2px solid #fff;
            border-radius: 8px;
            box-shadow: 1px 1px 2px 1px #aaa;
        }
        .asninfo>.title{
            padding: 15px 5px;
        }
        .asninfomobile>.title{
            padding: 10px 5px;
            display: flex;
            align-items: center;
            background: linear-gradient(45deg, #e6efff, #fcfaff);
            color: black;
            border-radius: 8px 8px 0 0;
        }
        .asninfomobile>.title>img{
            width: 20px;
            height: 20px;
            margin-right: 8px;
        }
        .asninfomobile>.item{
            margin-bottom: 10px;
        }
        .asninfomobile>.item.invalid{
            display: none;
            filter: brightness(0.9) grayscale(0.5);
        }
        .asninfomobile>.item.invalid.show{
            display: flex;
        }
        .asninfomobile>.item>.asn{
            display: flex;
            align-items: center;
            justify-content: space-between;
            background: #fff;
            padding: 5px 10px;
            border-radius: 5px 5px 0 0;
        }
        .asninfomobile>.item>.asn>.num{
            color: #666;
            display: flex;
            align-items: center;
        }
        .asninfomobile>.item.valid>.asn>.num{
            color: #000;
            font-weight: bold;
        }
        .asninfomobile>.item>.asn>.num>.valid{
            background: url('/static/images/yes.png');
            background-size: cover;
            margin-right: 5px;
            width: 14px;
            height: 14px;
            background: limegreen;
            border: 1px solid #1f1a16;
            border-radius: 50%;
            background-image: none !important;
        }
        .asninfomobile>.item>.asn>.num>.invalid{
            background: url('/static/images/no.png');
            background-size: cover;
            margin-right: 5px;
            width: 14px;
            height: 14px;
            background: #d8d3cc;
            border: 1px solid #1f1a16;
            border-radius: 50%;
            background-image: none !important;
        }
        .asninfomobile>.item>.name{
            margin-top: 2px;
            background: #fff;
            padding: 5px 10px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .asninfomobile>.item.valid>.name{
            color: #000;
        }
        .asninfomobile>.item>.name>.label{
            margin-left: -10px;
            margin-right: -5px;
        }
        .asninfomobile>.item>.country{
            padding: 5px 10px;
            background: #fff;
        }
        .asninfomobile>.item>.country img{
            width: 16px;
            margin-right: 5px;
        }
        .asninfomobile>.item>.times{
            background: #fff;
            padding: 5px 10px;
            border-radius: 0 0 5px 5px;
            color: #aaa;
            display: flex;
            align-items: cener;
            justify-content: space-between;
        }
        .asninfomobile.rirs>.item>.country{
            margin-top: 2px;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }
        .asninfomobile.rirs>.item>.country>div{
            display: flex;
            align-items: center;
        }
        .asninfo.oterinfo>.line>div{
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        body .asninfo.oterinfo>.title>div{
            text-align: center;
        }
        .info>.content>.line.line-domains>.content{
            max-height: 150px;
        }
    }