@charset 'utf-8';
@font-face {
    font-family: 'HarmonyOS Sans SC';
    src: local('HarmonyOS Sans SC Regular'),
         local('HarmonyOS Sans SC'),
         /* 主 CDN 链接 */
         url('https://img.kobin.com.cn/fonts/HarmonyOS-Sans/HarmonyOS-Sans-SC-Regular.woff2') format('woff2'),
         url('https://img.kobin.com.cn/fonts/HarmonyOS-Sans/HarmonyOS-Sans-SC-Regular.woff') format('woff'),
         /* 备 CDN 链接 */
         url('https://img.kobin.cn/fonts/HarmonyOS-Sans/HarmonyOS-Sans-SC-Regular.woff2') format('woff2'),
         url('https://img.kobin.cn/fonts/HarmonyOS-Sans/HarmonyOS-Sans-SC-Regular.woff') format('woff');
    font-style: normal;
    font-weight: normal;
    font-display: swap;
}
html {
	background: #fff;
	overflow-x: hidden;
}
body, button, code, input, kbd, pre, samp, select, textarea, tt, xmp {
    font-family: 'PingFang SC', 'HarmonyOS Sans SC', 'Microsoft Yahei', 'Helvetica', 'Segoe UI', Arial, sans-serif;
	line-height: normal;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'PingFang SC', 'HarmonyOS Sans SC', 'Microsoft Yahei', 'Helvetica', 'Segoe UI', Arial, sans-serif;
}
body {
	display: flex;
    flex-direction: column;
}
#app {
	flex: 1;
	padding-bottom: 40px;
}
#app, #app > div {
	height: auto;
}
.app-container {
    background-color: #fff;
}
.global-subtitle {
    background-color: #f8f8f8;
}
.global-header-logo {
    width: 190px;
}
.global-header-logo .small-img {
    position: relative;
    height: 56px;
    width: 190px;
    background-size: 32px;
    background-position: left center;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIyLjUgMjMuOSAxOTYuMyAxNDkuNyIgdmVyc2lvbj0iMS4xIiBoZWlnaHQ9IjE5NC42IiB3aWR0aD0iMjU1Ij4NCiA8cGF0aCBmaWxsPSIjZGNkY2RjIiBkPSJtMi41LDE3My41bDE1LjcsLTU1LjhjMS45LC02LjcgOCwtMTEuMyAxNC45LC0xMS4zbDc3LjcsMGwtMTUuOCw1NS45Yy0xLjksNi43IC04LDExLjMgLTE0LjksMTEuM2wtNzcuNiwwbDAsLTAuMXoiLz4NCiA8cGF0aCBmaWxsPSIjZWRlZGVkIiBkPSJtNTAuMyw1MC41bDYuMiwtMjIuMWMwLjcsLTIuNiAzLjIsLTQuNSA1LjksLTQuNWwzMC43LDBsLTYuMiwyMi4xYy0wLjcsMi42IC0zLjIsNC41IC01LjksNC41bC0zMC43LDB6Ii8+DQogPHBhdGggZmlsbD0iI2VkZWRlZCIgZD0ibTQ2LjUsMTMyLjNsMTUuNywtNTUuOGMxLjksLTYuNyA4LC0xMS4zIDE0LjksLTExLjNsNzcuNywwbC0xNS43LDU1LjhjLTEuOSw2LjcgLTgsMTEuMyAtMTQuOSwxMS4zbC03Ny43LDB6Ii8+DQogPHBhdGggZmlsbD0iI2JjYmNiYyIgZD0ibTc3LjEsNjUuM2MtNi45LDAgLTEzLDQuNiAtMTQuOSwxMS4zbDI4LjMsMTQuNGMwLDAgNy4zLC0yNS44IDcuMywtMjUuOGwtMjAuNywwbDAsMC4xeiIvPg0KIDxwYXRoIGZpbGw9IiNiY2JjYmMiIGQ9Im0zMy4xLDEwNi41Yy02LjksMCAtMTMsNC42IC0xNC45LDExLjNsMjguMywxNC41YzAsMCA3LjMsLTI1LjggNy4zLC0yNS44bC0yMC43LDB6Ii8+DQogPHBhdGggZmlsbD0iI2RjZGNkYyIgZD0ibTkwLjUsOTFsMTUuNywtNTUuOGMxLjksLTYuNyA4LC0xMS4zIDE0LjksLTExLjNsNzcuNywwbC0xNS43LDU1LjhjLTEuOSw2LjcgLTgsMTEuMyAtMTQuOSwxMS4zbC03Ny43LDB6Ii8+DQo8L3N2Zz4=');
}
.global-header-logo .small-img:after {
    content: 'KOBIN Iconfont';
    position: absolute;
    left: 44px;
    font-size: 18px;
    font-weight: 700;
    line-height: 56px;
    letter-spacing: -.025em;
    color: #eee;
}
.global-header .container > .nav {
    left: 200px;
}
.global-header .quick-menu .help {
    display: none;
}
.global-header-search .search-panel-fields .search-q {
    font-family: 'PingFang SC', 'HarmonyOS Sans SC', 'Microsoft Yahei', 'Helvetica', 'Segoe UI', Arial, sans-serif;
}
.app-main {
	overflow-x: hidden;
}
.global-content > .content {
    background-color: #f8f8f8;
}
.global-list-prj-item {
    background-color: #f8f8f8;
}
.yicon-detail-main .yicon-detail-list {
    width: 1134px;
}
.icon-detail-item {
    width: 148px;
}
.icon-detail-item > .info {
    font-size: 13px;
    width: auto
}
.icon-detail-item > .info .name, .icon-detail-item > .info .code {
    line-height: 18px;
}
.icon-detail-item > .info .icon {
    margin: 0 auto;
}
.icon-detail-item > .tool {
    padding: 0;
}
.icon-detail-item > .tool .tool-box {
    width: auto;
    padding: 0 26px;
}
.tan-container .tan-detail .download-box {
    gap: 18px;
}
.tan-container .tan-detail .download-box .download-btn {
    width: auto;
    flex: 1;
}
.tan-container .tan-detail .download-box .disabled {
    display: none;
}
footer {
    line-height: normal;
}
footer:not(.globalfooter), footer > .copyright {
    display: none;
}
.globalfooter {
    z-index: 919;
    position: relative;
    font-size: 11px;
	height: 140px;
    width: 100%;
    margin: 0;
    border-top: none;
    line-height: 16px;
    background-color: #f2f2f2;
    -webkit-user-select: none;
    user-select: none;
}
.globalfooter *, .globalfooter *:after, .globalfooter *:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.globalfooter span {
    height: auto;
    margin-bottom: 0;
    margin-right: 0;
}
.gf_content {
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
    padding: 0 22px;
}
.gf_breadcrumbs {
    z-index: 1;
    position: relative;
    padding: 18px 0;
    color: #505050;
}
.gf_breadcrumbs_home {
    z-index: 2;
    display: inline-block;
    position: relative;
    min-width: 22px;
    vertical-align: middle;
}
.gf_breadcrumbs_home:focus {
    outline: none;
}
.gf_breadcrumbs_home:focus-visible {
    outline: 2px solid #027dff;
    outline-offset: 2px;
}
.gf_breadcrumbs_home_image {
    display: block;
    height: 20px !important;
    width: 20px;
    background-size: contain;
    background-position: center;    
    background-repeat: no-repeat;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIyLjUgMjMuOSAxOTYuMyAxNDkuNyIgdmVyc2lvbj0iMS4xIiBoZWlnaHQ9IjE5NC42IiB3aWR0aD0iMjU1Ij4NCiA8cGF0aCBmaWxsPSIjMzEzMTMyIiBkPSJtMi41LDE3My41bDE1LjcsLTU1LjhjMS45LC02LjcgOCwtMTEuMyAxNC45LC0xMS4zbDc3LjcsMGwtMTUuOCw1NS45Yy0xLjksNi43IC04LDExLjMgLTE0LjksMTEuM2wtNzcuNiwwbDAsLTAuMXoiLz4NCiA8cGF0aCBmaWxsPSIjNDQ0NDQ1IiBkPSJtNTAuMyw1MC41bDYuMiwtMjIuMWMwLjcsLTIuNiAzLjIsLTQuNSA1LjksLTQuNWwzMC43LDBsLTYuMiwyMi4xYy0wLjcsMi42IC0zLjIsNC41IC01LjksNC41bC0zMC43LDB6Ii8+DQogPHBhdGggZmlsbD0iIzQ0NDQ0NSIgZD0ibTQ2LjUsMTMyLjNsMTUuNywtNTUuOGMxLjksLTYuNyA4LC0xMS4zIDE0LjksLTExLjNsNzcuNywwbC0xNS43LDU1LjhjLTEuOSw2LjcgLTgsMTEuMyAtMTQuOSwxMS4zbC03Ny43LDB6Ii8+DQogPHBhdGggZmlsbD0iIzFlMWUxZSIgZD0ibTc3LjEsNjUuM2MtNi45LDAgLTEzLDQuNiAtMTQuOSwxMS4zbDI4LjMsMTQuNGMwLDAgNy4zLC0yNS44IDcuMywtMjUuOGwtMjAuNywwbDAsMC4xeiIvPg0KIDxwYXRoIGZpbGw9IiMxZTFlMWUiIGQ9Im0zMy4xLDEwNi41Yy02LjksMCAtMTMsNC42IC0xNC45LDExLjNsMjguMywxNC41YzAsMCA3LjMsLTI1LjggNy4zLC0yNS44bC0yMC43LDB6Ii8+DQogPHBhdGggZmlsbD0iIzMxMzEzMiIgZD0ibTkwLjUsOTFsMTUuNywtNTUuOGMxLjksLTYuNyA4LC0xMS4zIDE0LjksLTExLjNsNzcuNywwbC0xNS43LDU1LjhjLTEuOSw2LjcgLTgsMTEuMyAtMTQuOSwxMS4zbC03Ny43LDB6Ii8+DQo8L3N2Zz4=');    
}
.gf_breadcrumbs_path {
    z-index: 1;
    display: inline-block;
    position: relative;
    padding-left: 11px;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.2;
    vertical-align: middle;
}
.gf_breadcrumbs_item {
    float: left;
    margin-right: 7px;
    padding: 3px 4px 3px 0;
    white-space: nowrap;
}
.gf_breadcrumbs_item:before {
    content: '';
    display: inline-block;
    height: 11px;
    width: 6px;
    margin-top: -1px;
    margin-right: 11px;
    vertical-align: middle;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2IiBoZWlnaHQ9IjExIiB2aWV3Qm94PSIwIDAgNiAxMSI+PHBvbHlsaW5lIHBvaW50cz0iLjY3NSAuOTI1IDUuMzIzIDUuNSAuNjc1IDEwLjA3NSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjODc4Nzg5IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMS4xIi8+PC9zdmc+');
}
.gf_breadcrumbs_item > a:focus {
    outline: none;
}
.gf_breadcrumbs_item > a:focus-visible {
    outline: 2px solid #027dff;
    outline-offset: 2px;
}
@media (hover: hover) {
    .gf_breadcrumbs_item > a:hover .gf_breadcrumbs_name {
        text-decoration: underline;
    }
}
.gf_footer {
    padding: 18px 0 22px;
    border-top: 1px solid #d6d6d6;
    color: #878789;
}
.gf_contact {
    padding-bottom: 6px;
}
.gf_contact > a {
    font-size: 11px;
    text-decoration: underline;
    color: #027dff;
}
.gf_contact > a:focus {
    outline: none;
}
.gf_contact > a:focus-visible {
    outline: 2px solid #027dff;
    outline-offset: 2px;
}
.gf_legal {
    z-index: 1;
    position: relative;
    top: -3px;
}
.gf_legal:before, .gf_legal:after {
    content: '';
    display: table;
}
.gf_legal:after {
    clear: both;
}
.gf_legal_copyright {
    margin-top: 4px;
    padding-top: 1px;
}
.gf_legal_powered {
    padding-left: 2px;
}
.gf_legal_powered > a {
    border-bottom: 1px solid transparent;
    color: #878789;
    transition: color 120ms;
}
.gf_legal_powered > a:focus {
    outline: none;
}
.gf_legal_powered > a:focus-visible {
    outline: 2px solid #027dff;
    outline-offset: 2px;
}
.gf_legal_powered > a:hover {
    border-color: #404040;
    color: #404040;
}
.gf_legal_link {
    display: inline-block;
    margin-top: 4px;
    white-space: nowrap;
}
.gf_legal_link:after {
    content: '|';
    margin: 0 8px;
}
.gf_legal_link:last-child:after {
    content: '';
    margin: 0;
}
.gf_legal_link > a {
    border-bottom: 1px solid transparent;
    color: #505050;
    transition: color 120ms;
}
.gf_legal_link > a:focus {
    outline: none;
}
.gf_legal_link > a:focus-visible {
    outline: 2px solid #027dff;
    outline-offset: 2px;
}
@media (hover: hover) {
    .gf_contact > a:hover {
        color: #2055ee;
    }
    .gf_legal_link > a:hover {
        border-color: #404040;
        color: #404040;
    }
}
@media screen and (min-width: 768px) {
    .gf_legal_copyright {
        float: left;
    }
    .gf_legal_links {
        float: right;
    }
}
@media screen and (max-width: 767.9px) {
    .gf_legal_links {
        margin-top: 16px;
    }
}