@charset "utf-8";

/* base */
* {
    margin: 0;
    padding: 0;
}
body {
    /*font-family: microsoft yahei;*/
    color: #506478;
    font-family: Microsoft YaHei UI,Microsoft YaHei,PingFang SC,Helvetica Neue,Hiragino Sans GB,Noto Sans,Tahoma,Arial,simsun,"sans-serif";
}
.row{
    margin: 0!important;
    padding: 0!important;
}
.ellipsis {
    text-overflow: ellipsis; /* 溢出显示省略号 */
    overflow: hidden; /* 溢出隐藏 */
    white-space: nowrap;  /* 强制不换行 */
}
.canNotSelect {
    user-select: none;
}

@font-face {
    font-family :"official";
    src :url("/src/stc/fonts/official/officialFont.woff");
}
.official {
    font-family: "official","microsoft yahei";
}
/* base */



/* define */
/* color */
/* rbg で表示しているカラーはまだ確定できていない 23/07/14 @愛理 */
.primary {
    color: #0DB3A6!important;
}
.gray {
    color: #506478!important;
}
.red {
    color: #E7826D!important;
}
.blue {
    color: #36A5F1!important;
}
.orange {
    /* waiting change */
    color: #E6A23C!important; 
}
.green {
    color: #7FCC8E!important;
}

.lightprimary {
    color: #D9F6F2!important;
}
.lightgray {
    color: #7A8B99!important;
}
.lightred {
    color: rgb(253, 226, 226)!important;
}
.lightblue {
    color: rgb(160, 207, 255)!important;
}
.lightorange {
    color: rgb(250, 236, 216)!important;
}
.lightgreen {
    color: rgb(225, 243, 216)!important;
}

.bgprimary {
    background-color: #F2FBFB!important;
    color: #0DB3A6!important;
}
.bggray {
    color: rgb(244, 244, 245)!important;
}
.bgred {
    color: #FFDBD4!important;
}
.bgblue {
    color: #E9F6FF!important;
}
.bgorange {
    color: rgb(253, 246, 236)!important;
}
.bggreen {
    color: #ECF4E1!important;
}
/* color end */
/* style */
.bold {
    font-weight: bold!important;
}
/* style end */
/* DOM */ 
a {
    /*color: #506478;*/
    color: #777;
    text-decoration: none;
}
a:hover {
    color: #0DB3A6;
    text-decoration: none;
}
a:focus {
    color: #1F2329;
    text-decoration: none;
}
ul {
    list-style: none;
}
/* DOM end */ 
/* DOM custom */
.importantlink:hover {
    color: #E7826D;
    opacity: .8!important;
}
.bh-tag {
    display: inline-block;
    font-size: 12px;
    
    border-width: 1px;
    border-style: solid;
    border-radius: 2px;
    box-sizing: border-box;
    white-space: nowrap;
    height: 24px;
    padding: 0 8px;
    line-height: 22px;
}
.bh-tag-verysmall {
    font-size: 10px;
    height: 18px;
    padding: 0 4px;
    line-height: 18px;
}
.bh-tag-primary {
    background-color: #e7f7f6;
    border-color: #cff0ed;
    color: #0db3a6;
}
.bh-tag-warning {
    background-color: #fdf6ec;
    border-color: #faecd8;
    color: #e6a23c;
}
.bh-tag-success {
    background-color: #f0f9eb;
    border-color: #e1f3d8;
    color: #67c23a;
}
.bh-tag-danger {
    background-color: #fef0f0;
    border-color: #fde2e2;
    color: #f56c6c;
}
.bh-link {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    position: relative;
    text-decoration: none;
    outline: 0;
    cursor: pointer;
    padding: 0;
    color: #777;
    font-size: 14px;
    font-weight: 500;
}
.bh-link:hover {
    text-decoration: none;
    color: #0db3a6;
}
.bh-link:focus {
    color: #777;
    text-decoration: none;
}

.bh-table {
    width: 100%;
}
.bh-thead {
    border-bottom: 1px solid #ebeef5;
    color: #909399;
    font-size: 16px;
    font-weight: bold;
}
.bh-thead th{
    padding: 12px 0;
}
.bh-tr {
    border-bottom: 1px solid #ebeef5;
}
.bh-tr:hover {
    background-color: #f5f7fa;
}
.bh-tr td{
    padding: 12px 0;
    color: #606266;
}

.bhtc_btn{
    display: inline-block;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    background: #fff;
    border: 1px solid #dcdfe6;
    color: #606266;
    -webkit-appearance: none;
    text-align: center;
    box-sizing: border-box;
    outline: none;
    margin: 0;
    transition: .1s;
    font-weight: 500;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    padding: 12px 20px;
    font-size: 14px;
    border-radius: 4px;
}
.bhtc_btn_small {
        padding: 9px 15px;
    font-size: 12px;
    border-radius: 3px;
}
.bhtc_btn_very_large_blank {
    padding: 16px 100px;
    font-size: 16px;
    border-radius: 6px;
}
.bhtc_btn_danger {
    
}
.bhtc_btn_success {
    color: #0db3a6;
    background: #f2fbfb;
    border-color: #add5d5;
}
.bhtc_btn_success:hover {
    color: #fff;
    background-color: #0db3a6;
    border-color: #0db3a6;
}
.bhtc_btn_info {
    color: #409eff;
    background: #ecf5ff;
    border-color: #b3d8ff;
}
.bhtc_btn_info:hover {
    color: #fff;
    background-color: #409eff;
    border-color: #409eff;
}
.bhtc_btn_vip {
    color: #e4a94e;
    background: #fffaf4;
    border-color: #ffe3b8;
}
.bhtc_btn_vip:hover {
    color: #fff;
    background-color: #e6a23c;
    border-color: #e6a23c;
}
.bhtc_btn_danger__dark {
    
}
.bhtc_btn_success__dark {
    color: #fff;
    background-color: #0db3a6;
    border-color: #0db3a6;
}
.bhtc_btn_info__dark {
    color: #fff;
    background-color: #409eff;
    border-color: #409eff;
}
.bhtc_btn_vip__dark {
    color: #fff;
    background-color: #e6a23c;
    border-color: #e6a23c;
}
.bhtc_btn_danger__dark:hover, .bhtc_btn_success__dark:hover, .bhtc_btn_info__dark:hover, .bhtc_btn_vip__dark:hover {
    opacity: .8;
}
.highlightPre {
    padding: 0;
    margin: 0 0 10px;
    font-size: 12px;
    line-height: 1.38461538;
    color: #333;
    word-break: break-all;
    word-wrap: break-word;
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 6px;
    
}
/* DOM custom end */
/* define end */

/* topnav start */
#bhtc_topnav {
    height: 64px;
    line-height: 64px;
    display: flex;
    box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
    padding: 0 10px ;
    /*backdrop-filter: blur(4px);*/
    font-size: 15px;
}
.bhtc_topnav__left {
    width: 50%;
    /*border: 1px solid blue;*/
}
.bhtc_topnav__right {
    width: 50%;
    /*border: 1px solid red;*/
}
@media screen and (max-width: 1080px) {
    .bhtc_topnav__right {
        display: none;
    }
    .bhtc_topnav__left {
        width: 100%;
        /*border: 1px solid blue;*/
    }
}


#bhtc_topnav__logoImg {
    height: 38px;
    user-select: none;
    -webkit-user-drag:none;
}
.bhtc_topnav__left ul li {
    margin: 0 12px;
    float: left;
}
.bhtc_topnav__right ul li {
    height: 63px;
    padding: 0 12px;
    float: right;
}
.bhtc_topnav__right ul li:hover {
    color: #0DB3A6;
}
.bhtc_topnav__right ul li a {
    line-height: 64px;
    height: 64px;
    display: block;
}
.bhtc_topnav__right ul li  i {
    transition: transform 0.3s ease-in-out!important;
    -webkit-transition: transform 0.3s ease-in-out!important;
    -moz-transition: all 0.3s ease-in-out!important;
    -o-transition: all 0.3s ease-in-out!important;
}
.bhtc_topnav__right ul li:hover i {
    transform: rotate(180deg)!important;
    -webkit-transform: rotate(180deg)!important;
    -moz-transform: rotate(180deg)!important;
    -o-transform: rotate(180deg)!important;
    -ms-transform: rotate(180deg)!important;
}

/* nav sub */
.bhtc_topnav__right_submenu_button {
    cursor: pointer;
}
.bhtc_topnav__right_submenu_button:hover {
    box-sizing:border-box;
    border-bottom: 3px solid #0DB3A6;
}
.bhtc_topnav__sub_items {
    display: none;
    /*display: flex; use this when fix bugs*/ 
    width: 100%;
    min-height: 300px;
    /*border: 1px solid red;*/
    position: absolute;
    background-color: #FFFFFF;
    z-index: 10;
    box-shadow: 0 13px 13px rgba(0, 21, 41, 0.08);
    padding: 0 9%;
    position: fixed;
    top: 64px;
}
.bhtc_topnav__sub_items__left {
    width: 26%;
    min-height: 300px;
    
    
}
.bhtc_topnav__sub_items__left_banner {
    background-color: rgba(13, 179, 166, .08);
    background-image: url('https://static.zixiaoyun.com/i/2023/07/25/6pzie.png');
    background-size: 60%;
    background-repeat: no-repeat;
    background-position: right bottom;
    padding: 0 20px ;
    box-shadow: 0 4px 8px -8px rgba(31,35,41,.06), 6px 0 12px rgba(31,35,41,.04), 8px 0 24px 8px rgba(31,35,41,.04);
}
.bhtc_topnav__sub_items__left_list {
    
}
.bhtc_topnav__sub_items__left img {
    width: 50%;
    user-select: none;
    -webkit-user-drag :none;
    display: block;
    margin: 10px auto;
}
.bhtc_topnav__sub_items__left h4 {
    font-weight: 16px;
    text-align: center;
}
.bhtc_topnav__sub_items__left p{
    margin: 6px 0;
}
.bhtc_topnav__sub_items__right {
    padding: 30px 50px;
    width: 70%;
    min-height: 300px;
    display: flex;
    flex-wrap: wrap;
}
.bhtc_topnav__sub_items__right div {
    width: 31%;
    min-width: 200px;
    margin: 10px 1%;
    /*height: 36px;*/
    /*line-height: 36px;*/
    padding: 0 12px;
    border-radius: 6px;
    height: 68px;
    /*overflow: hidden;*/
    
}
.bhtc_topnav__sub_items__right div:hover {
    background-color: rgba(13, 179, 166, .08);
}
.bhtc_topnav__sub_items__right a{
    display: flex;
    height: 100%;
    width: 100%;
    padding: 6px 4px;
    min-width: 120px;
    
}
.bhtc_topnav__sub_items__right_icon {
    margin-right: 6px;
    font-size: 22px;
}
.bhtc_topnav__sub_items__right_icon img {
    user-select: none;
    -webkit-user-drag:none;
    width: 30px;
}
.bhtc_topnav__sub_items__right a span {
    display: block;
}

.bhtc_topnav__sub_items__right_title {
    font-weight: bold;
}
.bhtc_topnav__sub_items__right_desc {
    color: #888;
}

/* tools */
.bhtc_topnav__sub_items__left_list {
    padding: 20px 0;
    
    box-shadow: 6px 0 12px rgba(31,35,41,.04);
}
.bhtc_topnav__sub_tools_class_selector {
    width: 70%;
    height: 40px;
    line-height: 40px;
    padding: 0 16px;
    text-align: center;
    cursor: pointer;
    margin-left: 26%;
    border-radius: 6px;
    margin-bottom: 6px;
}

.bhtc_topnav__sub_items__right_tools {
    display: none;
}
#bhtc_topnav__sub_items__right_tools_image {
    display: flex;
}
/* topnav end */

/* upload start */
.uploader-files{
    min-height:200px!important;
    border-left:1px solid #ddd;
    border-right:1px solid #ddd;
    border-top:1px solid #ddd;
    cursor: pointer;
}
#fileBat {
    transition: all 0.2s linear 0s;
}
#fileBat:hover{
    box-shadow: 0 0 6px 0 rgba(0,0,0,.2);
    border-radius: 16px;
}
.uploadtooltipStyle {
    top:calc(100% - 70px)!important; 
} 
.file-list, .uploader-files{
    border-top:1px solid #ddd;
    border-left:1px solid #ddd;
    border-right:1px solid #ddd;
    border-bottom: none;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
    overflow: hidden;
}
.file-list+.uploader-actions{
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    border:1px solid #ddd;
    overflow: hidden;
    padding-left: 30px;
}

.uploader-actions .btn-link{
    /*color:#0db3a6!important;*/
    outline: none;
}
.uploader-actions .btn-link:hover{
    background-color: transparent;
    color: #1e8732;
}
.uploader-actions .btn-link:focus{
    background-color: transparent;
}

#fileBat .file-list[data-drag-placeholder]:before, .uploader-files[data-drag-placeholder]:before{

    font-family: microsoft yahei;
}

#fileBat .file-list .file[data-status=queue], .uploader-files .file[data-status=queue]{
    background-color: #fafaff;
}
#fileBat .file-list .file-status{
    color:#0db3a6!important;

}
#fileBat .uploader-message[data-type=warning] {
    background-color: #0db3a6;
}
#fileBat .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
    background-color: #fffefe!important;
}

/* url uploader start */
.url-uploader{
    border: 1px solid #ddd;
    border-radius: 16px!important;
    overflow: hidden;
    transition: all .3s ease;
    position: relative;
}
.url-uploader:hover{
    box-shadow: 0 0 6px 0 rgba(0,0,0,.2);
    border: 1px solid #ddd;
}
.url-uploader:focus{
    box-shadow: 0 0 6px 0 rgba(0,0,0,.2);
    border: 1px solid #ddd;
}
.url-uploader-message{
    height: 24px;
    line-height: 24px;
    width: 100%;
    position: absolute;
    display: none;
    color: #fff;
    text-align: center;
}

#url-data{
    width: 100%;
    min-height: 180px;
    margin: 0 0;
    display: block;
    padding: 10px 15px;
    border: none;
    
}
#url-data:focus{
    outline: none;
}
.url-control-bar{
    line-height: 30px;
    border-top: 1px solid #ddd;
    padding: 0 30px;
}
#sub{
    color:#ff4a83;
    padding: 5px 12px;
    font-size: 13px;
}
#sel{
    color: #0db3a6!important;
}
#sub:hover, #sel:hover{
    text-decoration: none;
}
/* url uploader end */

/* output start */
#home-bottom {
    margin-top: 30px;
}
#home-bottom .nav-tabs .active{
    /*border-bottom: 1px solid #fff!important;*/
}
#home-bottom .nav-tabs a:hover{
    color:grey;
}
#home-bottom textarea:focus{
    outline: none!important;
    box-shadow: none!important;
}
.childNav .active a{
    background-color: #e7f7f8!important;
    color: #0db3a6!important;
    border: none !important;
    transition: all 0.3s linear 0s;
}
.childNav .active a:hover{
    background-color: #def7f9!important;
    color: #0db3a6!important;
    border: none !important;
}
.childNav li a{
    color: #0db3a6;
    background-color: #fff;
    transition: all 0.3s linear 0s;
}
.childNav li a:hover{
    color: #0db3a6;
    background-color: #e7f7f8;
}


.childNav_method .active a{
    background-color: #e7f7f8!important;
    color: #0db3a6!important;
    border: none !important;
    transition: all 0.3s linear 0s;
}
.childNav_method .active a:hover{
    background-color: #def7f9!important;
    color: #0db3a6!important;
    border: none !important;
}
.childNav_method li a{
    color: #0db3a6;
    background-color: #fff;
    transition: all 0.3s linear 0s;
}
.childNav_method li a:hover{
    color: #0db3a6;
    background-color: #e7f7f8;
}



.childNav_2 .active a{
    background-color: #f4f7ff!important;
    color: #386af1!important;
    border: none !important;
    transition: all 0.3s linear 0s;
}
.childNav_2 .active a:hover{
    background-color: #eff4ff!important;
    color: #386af1!important;
    border: none !important;
}
.childNav_2 li a{
    color: #386af1;
    background-color: #fff;
    transition: all 0.3s linear 0s;
}
.childNav_2 li a:hover{
    color: #386af1;
    background-color: #f4f7ff!important;
}
/* output end */
/* upload end */



/* URL mode */
/* the main container of url mode, it includes the upload module */
.url-container{
    border-bottom: 1px solid #ddd; 
}
/* uploader settings */
.url-uploader{
    /* this margin [auto] will break the margin, DO NOT use in this version 23/7/17 @愛理 */
    /*margin: 10px auto 30px;*/
    margin-top: 10px;
    margin-bottom: 30px;
    border: 1px solid #ddd;
    border-radius: 16px!important;
    overflow: hidden;
    transition: all .3s ease;
    position: relative;
}
.url-control-bar .tooltip-inner{
    background-color: #000!important;
    color: #fff!important;
    font-size: 12px!important;
    width: 10em;
}
.url-control-bar .tooltip.top .tooltip-arrow{
    border-top-color: #000!important;
}
/* URL mode end */

/* components start */
#main-box{
    padding-bottom: 100px;
    position: relative;
    border-bottom: 1px solid #ddd;
}
.container {
    max-width: 100%!important;
}
.notice-wrapper {
    margin: 10px 0;
    padding: 5px 3%;
}
.notice-item {
    margin: 10px 0;
    padding: 6px 9.5px;
    color: #0db3a6;
    background-color: #f2fbfb;
    text-align: center;
    border-radius: 6px;
    font-family: microsoft yahei;
}
.notice-item  a{
    color: #0db3a6;
}

.notice-warning-item {
    margin: 10px 0;
    padding: 6px 9.5px;
    color: #E6A23C;
    background-color: #fdf6ec;
    text-align: center;
    border-radius: 6px;
    font-family: microsoft yahei;
}
.notice-danger-item {
    margin: 10px 0;
    padding: 6px 9.5px;
    color: #f56c6c;
    background-color: #fef0f0;
    text-align: center;
    border-radius: 6px;
    font-family: microsoft yahei;
}
/* mode start */
#moe1 {
    position: absolute;
    height: 100px;
    bottom: 0;
    right: 200px;
 
}
#moe2 {
    position: absolute;
    height: 50px;
    bottom: 0;
    right: 240px;
}
#moe1:hover,#moe2:hover{
    cursor: pointer;
}
/* mode end */

/* title and slogan start */
.bhtc-title{
    line-height: 30px;
    vertical-align: top;
    font-size: 26px;
    height: 30px;
    color: #0db3a6;
    display: block;
    margin: 0 auto;
    text-align: center;
    font-weight: normal;
    margin-top: 60px;
}
.bhtc-slogan{
    color: #898787;
}
/* title and slogan end */

/* base64 and url uploading cover start */
.coverComponent {
    position: absolute;
    background-color: rgba(255,255,255,.8);
    width: 100%;
    height: 100%;
    border-radius: 16px;
    /*opacity: .3;*/
    padding-top: 46px;
    z-index: 1;
    text-align: center;
    display: none;
}
.coverComponent img {
    height: 60px;
    width: 60px;
    opacity: .4;
    animation: rotate 1.8s linear infinite;
}
.coverComponentTips {
    text-align: center;
}
.rollingimage {
    
    
}
@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
/* base64 and url uploading cover end */

/* show start */
.innerH2{
    margin: 30px 0;
    font-weight: normal;
    font-size:36px;
    text-align: center;
    color: #0db3a6;
}
/* show end */

/* footer start */
#footer-copyright{
    text-align: center;
}
.ft-items a{
    text-decoration: none;
    line-height: 30px;
}
.ft-items a:hover,.ft-items a:link,.ft-items a:focus,.ft-items a:visited{
    text-decoration: none;
}
.ft-items-title{
    font-size: 18px;
    color: #000;
    line-height: 24px;
    margin-bottom: 14px;
}
.p{
    position: relative;
}
.p a:hover{
    text-decoration: none;
    color:#0DB3A6;
}
.wechatcus{
    background-image: url(https://static.zixiaoyun.com/i/2108/18/ltyx.png);
    height: 208px;
    width: 160px;
    background-size: 100% 100%;
    display: none;
    z-index: 9999;
    position: absolute;
    bottom: 60px; 
    left: -70px;
}
.wechatcom{
    background-image: url(https://static.zixiaoyun.com/i/2024/01/31/2kbz.jpg);
    height: 208px;
    width: 160px;
    background-size: 100% 100%;
    display: none;
    z-index: 9999;
    position: absolute;
    bottom: 60px;
    left: 40px;
}
#footer{
    padding-top: 40px!important;
    border-top: 1px solid #dcdada;
}
#footer-logo{
    user-select:none;
    -webkit-user-drag: none;
    width: 46%;
}
.footer-left-ul li{
    list-style: none;
    color: #4a4a4a;
    line-height: 26px;
}
.ft-bind-tips{
    color: #a09d9d!important;
    margin-bottom: 18px;
}
.sharelinks{
    display: inline-block;
    margin: 4px 6px;
    border-radius:50%;
    border:1px solid #ddd;
    padding:10px;
    font-size:20px!important
}
#ft_wechat {
    height: 50px;
    width: 50px;
    background-image: url(https://static.zixiaoyun.com/i/2108/17/yaqg.png);
    background-size: 100% 100%;
    cursor: pointer;
}

.follow_us_qr {
    background-image: url(https://static.zixiaoyun.com/i/2108/10/48ytk.png);
    height: 208px;
    width: 160px;
    background-size: 100% 100%;
    display: none;
}


.follow_us_qr_we {
    background-image: url(https://static.zixiaoyun.com/i/2108/18/ltyx.png);
    height: 208px;
    width: 160px;
    background-size: 100% 100%;
    display: none;
}
/* footer end */
/* components end */


/* doc start */
/* there set nav bg-transparent by padding-top:64px 23/7/25 @愛理 */
.bhtc_doc_banner {
    width: 100%;
    height: 334px;
    background-color: #fff;
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    border-bottom: 1px solid #ddd;
    padding-top: 124px;
    text-align: center;
}
.bhtc_doc_banner img {
    position: absolute;
    height: 160px;
    right: 200px;
    bottom: 0;
    user-select: none;
    -webkit-user-drag:none;
}
.bhtc_doc_banner h1 {
    font-size: 36px;
    letter-spacing: 3px;
}
.bhtc_doc_banner h1 span {
    /*border-bottom: 4px solid #0DB3A6;*/
    color: #0DB3A6;
}
.bhtc_doc_banner p{
    font-size: 18px;
    width: 36%;
    margin: 0 auto;
}
.bhtc_doc_main_content {
    width: 68%;
    margin: 0 auto;
    /*border-bottom: 1px solid #ddd;*/
}
.bhtc_doc_main_content__h2,.bhtc_doc_main_content__h2_bottom {
    font-size: 30px;
    text-align: center;
    font-weight: normal;
    padding: 20px 0;
    user-select: none;
}
.bhtc_doc_main_content__h2:after {
    content: '';
    width: 90px;
    height: 3px;
    border-radius: 4px;
    background-color: #0DB3A6;
    display: block;
    margin: 25px auto 0;
}

.bhtc_doc_main_content__h2 span{
    display: inline-block;
    font-weight: normal;
    margin: 0 6px;
    color: #ddd;
}
.bhtc_doc_main_content__desc {
    font-size: 16px;
    text-indent: 2em;
    line-height: 24px;
    margin: 20px 0;
}
.bhtc_docs_margin_wrapper {
    margin: 20px 0 60px;
}
.bhtc_docs_margin_wrapper img {
    display: block;
    margin: 10px auto;
    width: 50%;
    border-radius: 6px;
}
/* doc end */

/* scene and introduce start */
@media screen and (min-width: 1080px) {
    .bhtc-intro-part{
        width: 100%; 
        margin: 0 auto ;
        padding: 30px 0;
        display: flex;
        border-bottom: 1px dashed #ddd;
        flex-wrap: nowrap;
        justify-content:center;
    }
    .bhtc-intro-part-left{
        width: 40%;
        padding: 20px;
    }
    .bhtc-intro-part-right{
        width: 60%;
        padding: 20px;
        text-align: center;
    }
}
@media screen and (min-width: 400px) {
    .bhtc-intro-part{
        width: 100%;
        margin: 0 auto ;
        padding: 30px 0;
        border-bottom: 1px dashed #ddd;
    }
    .bhtc-intro-part-left{
        padding: 20px;
    }
    .bhtc-intro-part-right{
        padding: 20px;
        text-align: center;
    }
}
.bhtc-intro-part-left h2{
    color: #0db3a6;
    margin-top: 0;
    padding-left: 20px;
}
.bhtc-intro-part-label{
    font-size: 14px;
    color: #555;
    font-weight: lighter;
}
.bhtc-intro-part-desc{
    font-size: 16px;
    padding: 6px 20px;
    cursor: pointer;
    border-radius: 8px;
}

.bhtc-intro-part-right img{
    width: 100%;
    border: 1px solid #ddd;
    border-radius: 12px;
    overflow: hidden;
    margin: 0 0 10px 0;
    user-select: none;
    -webkit-user-drag:none;
    transition: box-shadow .2s linear 0s;
    
}
.bhtc-intro-part-right img:hover{
    box-shadow: #ddd 0px 0px 20px;
}




/* scene and introduce end */

/* announce and news start*/
/* list page start */
/* !ATTENTION! this 'chevron-right' if is used in other pages, it might be make a Global pollution !! 23/7/26 @愛理 */
.chevron-right {
    margin: 0 6px;
    font-weight: lighter;
    color: #888;
}
.announce-breadcrumb-wrapper {
    padding-top: 64px;
    width: 64%;
    margin: 20px auto 0px;
}
.announce-breadcrumb-wrapper a{
    font-weight: bold;
}
.announce-breadcrumb-wrapper a:hover{
    text-decoration: none;
    color: #0db3a6;
}
.announce-list-wrapper{
    width: 64%;
    margin: 20px auto;
    padding: 25px 30px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.annouce_category {
    display: flex;
    width: 64%;
    margin: 20px auto;
    padding: 25px 30px;
    border: 1px solid #ddd;
    border-radius: 4px;
}
.announce_category_title {
    width: 6em;
}
.announce_category_tags{
    width: calc(100% - 6em);
}
.announce_category_tag {
  /*padding: 4px 0;*/
  height: 2em;
  min-width: 7em;
  border: 1px solid #ddd;
  border-radius: 2px;
  color: #777;
  display: inline-block;
  margin:  0 2px 8px 2px;
}

.announce_category_tag a {
  display: block;
  width: 100%;
  height: 100%;
  color: inherit;
  text-decoration: none;
  box-sizing: border-box;
  padding: 0;
  text-align: center;
  line-height: 2em;
}

.announce_category_active {
    background-color: #e7f7f6;
    border: 1px solid #0db3a6;
    color: #0db3a6;
    background-image: url("https://static.zixiaoyun.com/i/2024/02/01/66e3p.svg");
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: 16px 16px;
}
.announce_category_active a {
    color: #0db3a6;
}
/* list page end */
/* detail page start */
.announce-article-wrapper{
    width: 64%;
    margin: 20px auto;
    padding: 25px 30px;
    border: 1px solid #ddd;
    border-radius: 4px;
}
.announce-title, .announce-content {
    width: 90%;
    margin: 0 auto;
}
.announce-title h3 {
    font-size: 18px;
    line-height: 28px;
    padding: 50px 0 30px;
    border-bottom: #e5e5e5 2px solid;
    text-align: center;
}
.announce-content-end {
    text-align: right;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
}
.announce-content-key {
    text-indent: 2em;
    font-size: 14px;
}
.announce-content-comment {
    text-indent: 2em;
    font-size: 12px;
}
.announce-content-end img {
    margin-right: -15px;
}
.announce-content-desc, .announce-content-first, .announce-content-end {
    font-size: 14px;
}
.announce-content-desc {
    text-indent: 2em;
}
.announce-body img{
    max-width: 100%;
     vertical-align: middle;
     margin: 0 auto 20px;
     user-select: none;
     -webkit-user-drag: none;

}

/* detail page end */
/* announce and news end */


/* tools start */
.tools_title {
    margin: 30px 0 18px;
    font-size: 36px;
    font-weight: normal;
    color: #606060;
}
#tool_main_box {
    padding-top: 64px;
}
.tools-breadcrumb-wrapper {
    font-size: 14px;
    margin: 20px 0 14px;
}
.tools-breadcrumb-wrapper a{
    /*font-weight: bold;*/
}
.tools-breadcrumb-wrapper a:hover{
    text-decoration: none;
    color: #0db3a6;
}
.tools-breadcrumb-wrapper .chevron-right {
    margin: 0 6px;
    font-weight: lighter;
    color: #888;
}
    
.tools_introduce {
   margin-top: 30px;
}
.tools_introduce__box {
   padding: 14px 20px;
   border-radius: 6px;
   margin: 12px 0;
   background-color: #FFFFFF;
   border: 1px solid #DDDDDD;
}
.tools_introduce__box p {
   margin: 6px 0;
   line-height: 24px;
   font-size: 14px;
}
.tools_introduce__box h3 {
   margin: 4px 0 0 0;
}
.tools_introduce__box img {
   border-radius: 6px;
   margin-bottom: 6px;
   user-select: none;
   -webkit-user-drag:none;
}


/* tools end */