body,html{margin: 0px;}
.active{color: #09f;font-weight: bold}
.header{height: 80px}
.main{width: 1200px;margin: 0 auto;}
.logo{height: 50px;margin: 15px 0;}
.menu{float: right;height: 80px;line-height: 80px}
.menu a{font-size: 18px;margin-right: 27px;color: #333;text-decoration: none}
.menu a:hover{color: #09f}
.menu button{font-family:inherit;background: #2e8df1;color: #fff;border-radius: 5px;padding: 10px 20px;border:none;font-size: 17px;font-weight: 700;border:solid 1px #2e8df1;cursor: pointer;transition: background .18s}
.menu button:hover{background: #1f76c8;color: #fff;}
.banner{background: url("../media/img/index_banner.jpg");min-height: 500px;text-align: center;padding-bottom:40px;position:relative;}
.banner .banner_img{margin-top: 100px}
.input{margin-top: 50px}
.input .url{width: 730px;
    height: 60px;
    line-height: 60px;
    background: white;
    padding: 0 20px;
    font-size: 20px;
    color: #333;
    border:none;
    vertical-align: text-top;
    outline:none;
    border-radius: 10px 0px 0px 10px;
}


.input .url2{width: 800px;
    height: 60px;
    line-height: 60px;
    background: white;
    padding: 0 20px;
    font-size: 20px;
    color: #333;
    border:none;
    vertical-align: text-top;
    outline:none;
    border-radius: 10px;
}

.input .url3{width: 318px;
    height: 60px;
    line-height: 60px;
    background: white;
    padding: 0 20px;
    font-size: 20px;
    color: #333;
    border:none;
    vertical-align: text-top;
    outline:none;
    display: inline-block;
}
.input .search-btn{width: 150px;
    height: 100%;
    background: linear-gradient(-90deg,rgba(84,124,255,1) 0%,rgba(92,197,253,1) 100%);
    color: white;
    font-size: 20px;
    cursor: pointer;
    display: inline-block;
    vertical-align: text-top;
    height: 60px;
    line-height: 60px;
    border-radius: 0px 10px 10px 0px;
}
.input label{font-size: 20px}
.title{text-align: center;font-size: 40px;font-weight: bold;padding-top: 150px}
.intro{font-size: 18px;text-align: center;margin-top: 20px}
.bboxs{margin-top: 50px}
.box{width: calc(25% - 24px);display: inline-flex;align-items: center;text-align: left;margin: 12px 12px;padding: 22px 20px;background: #fff;border-radius: 12px;box-shadow: 0 2px 12px rgba(0,0,0,0.06);vertical-align: top;transition: box-shadow .3s;box-sizing: border-box}
.box:hover{box-shadow: 0 4px 20px rgba(0,0,0,0.12)}
.box img{width: 48px;height: 48px;margin-right: 16px;flex-shrink: 0}
.box .btext{flex: 1;min-width: 0}
.box .btitle{font-weight: bold;font-size: 15px;color: #333}
.box .bintro{color:#8c96a0;font-size: 12px;margin-top: 4px;line-height: 1.4;white-space:nowrap}
.bbox{width: 50%;display: inline-block;vertical-align: top;margin-top: 20px;}
.bbox img{max-width: 100%}
.bbox .xtitle{font-size: 40px;font-weight: bold;margin-top: 100px;color: #12263C}
.bbox .xtitle2{font-size: 20px;font-weight: bold;margin-top: 45px;color: #45a9f1}
.bbox .xintro{font-size: 18px;margin-top: 25px;color: #00133B;line-height: 25px}
.banner2{height: 284px;background: url("../media/img/index_banner2.jpg");text-align: center;}
.ntitle{font-weight: bold;color: #fff;font-size: 50px;padding-top: 70px}
.bbutton{background: #fff;border: solid 1px #fff;color: #09f;font-size: 18px;padding: 10px 50px;border-radius: 30px;display: inline-block;margin-top: 30px;cursor: pointer;}
.bbutton:hover{color: #fff;background: rgb(69,154,245);}
.footer{background: #040B22;height: 400px;color: #999;padding-top: 100px}
.l1{width: 20%;display: inline-block;vertical-align: top;}
.l2{width: 50%;display: inline-block;vertical-align: top;}
.l3{width: 30%;display: inline-block;vertical-align: top;}
.logos{margin-top: 20px}
.logos img{width: 120px;margin-right: 25px}
.copyright{font-size: 15px;margin-top: 30px}
.copyright a{color: #999}
.short_box{width:880px;border-radius: 15px;background: #fff;color: #333;display:block;visibility:hidden;opacity:0;box-shadow: 0 10px 40px rgba(0,0,0,0.2);padding:20px;text-align:left;z-index:100;transition:opacity .3s,visibility .3s;margin-top:10px}
/* v19c10clean: 上行删去 position:absolute;left:50%;transform:translateX(-50%) —— 三处使用页
   （index/short/custom）均已注入 v19c5b 弹窗化 CSS（position:fixed 居中），旧定位值永不生效 */
.short_box .urlinfo{display:inline-block;vertical-align: top;margin-left: 20px;width: calc(100% - 150px);padding-top: 15px}
.short_box img{width: 90px;}
.short_box .creat_time{float: right;margin-top: 0px;}
.short_box .long_url{color:#999;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.login_btn{background: #fff;border: solid 1px #45a9f1;border-radius: 10px;display: inline-block;float: right;color:#45a9f1;padding:10px 20px;margin-top:-50px;cursor:pointer}
.login_btn:hover{background:#45a9f1;color:#fff;}
.copy-button{font-size: 12px;padding: 0 5px;border-radius: 5px;border:solid 1px #45a9f1;background:#45a9f1;color:#fff;display: inline-block;cursor:pointer}
.copy-button:hover{background: #fff;color: #45a9f1}
table{background: #f7f7f7;margin-bottom: 10px;width: 100%}
th{text-align: left;border-bottom: solid 1px #DDD;padding: 10px}
td{border-bottom: solid 1px #EEE;padding: 10px}
/* Remove blue focus outline on click */
a:focus,button:focus,.btn:focus,.btn:active:focus,.btn.active:focus,input:focus,select:focus,textarea:focus{outline:none;outline-offset:0}

/* Feature detail hover popup - PC */
.box[data-detail] { cursor: pointer; position: relative; transition: transform 0.15s, box-shadow 0.15s; }
.box[data-detail]:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.box[data-detail]::after { content: attr(data-detail); display: none; position: absolute; bottom: calc(100% + 10px); left: 50%; transform: translateX(-50%); background: #fff; border-radius: 10px; padding: 16px 20px; min-width: 280px; max-width: 360px; box-shadow: 0 8px 24px rgba(0,0,0,0.15); font-size: 14px; color: #555; line-height: 1.8; z-index: 9999; white-space: normal; text-align: left; font-family: 'Microsoft YaHei',Arial,sans-serif; font-weight: normal; }
.box[data-detail]::before { content: ""; display: none; position: absolute; bottom: calc(100% + 4px); left: 50%; transform: translateX(-50%); border: 6px solid transparent; border-top-color: #fff; z-index: 10000; }
.box[data-detail]:hover::after, .box[data-detail]:hover::before { display: block; animation: dropIn 0.25s cubic-bezier(0.34,1.56,0.64,1); }
@keyframes dropIn { from{opacity:0;transform:translateX(-50%) translateY(8px)} to{opacity:1;transform:translateX(-50%) translateY(0)} }