@charset "utf-8";
/***********************************************************
	Filename: szphp.css
	Note	: 全站综合部分CSS样式
	Version : szphp v2.0.0
	Author  : 优尚设计 <547829810@qq.com>
	Web		: www.szphp.cn
	Update  : 2019.5.20
***********************************************************/
@import "https://cos.szphp.cn/font-icon/font-awesome-v4/css/font-awesome.min.css";
@import "https://at.alicdn.com/t/c/font_856875_ncvip72cf5.css";

/* 自定义字体 */
@import "https://cos.szphp.cn/font/noto_sans_sc/noto_sans_sc.css?family=Noto+Sans+SC:wght@300,400,500,700&display=swap";
@font-face {
    font-family: 'montserrat-regular';
    src: url('https://cos.szphp.cn/font/montserrat-regular/montserrat-regular-8-webfont.woff2') format('woff2'),
        url('https://cos.szphp.cn/font/montserrat-regular/montserrat-regular-8-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'facon';
    src: url('https://cos.szphp.cn/font/facon/facon-2-webfont.woff2') format('woff2'),
        url('https://cos.szphp.cn/font/facon/facon-2-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
.family-noto{font-family:'Noto Sans SC'}
.szphp-font-montserrat{font-family:'montserrat-regular'}
.szphp-font-facon{font-family:'facon'}

/* 针对1440PX宽度的分辨率，把col-xl-10的宽度增加到与col-11宽度一致 2025-05-15 页面设计作者——深圳市优尚企业形象设计有限公司 www.szphp.cn*/
@media (min-width: 1200px) and (max-width: 1600px) {
  .col-xl-10{-ms-flex:0 0 91.666667%;flex:0 0 91.666667%;max-width:91.666667%}
}

/* ::-webkit-scrollbar{width:12px;background-color:#006eff}
::-webkit-scrollbar-thumb{widows:12px;background-color:#aeaeae}
::-webkit-scrollbar-track-piece{width:12px;background-color:#f8f8f8}
::-webkit-scrollbar-thumb:hover{width:12px;background-color:rgba(2,62,235,.8)} */

/*综合样式***********************************************************************/
::after,::before{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}
body{margin:0;background:#fff;color:#333;letter-spacing:0;font-weight:normal;font-size:1rem;font-family:"pingfang SC","Helvetica Neue","Open Sans","Microsoft YaHei","Hiragino Sans GB",Arial;line-height:1.6}
[tabindex="-1"]:focus{outline:0!important}
hr{overflow:visible;box-sizing:content-box;height:0}
h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem;font-weight:600}
p{margin-top:0;margin-bottom:1.5rem}
abbr[data-original-title],abbr[title]{border-bottom:0;text-decoration:underline;text-decoration:underline dotted;cursor:help;-webkit-text-decoration:underline dotted;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}
address{margin-bottom:1rem;font-style:normal;line-height:inherit}
dl,ol,ul{margin-top:0;margin-bottom:1rem}
ol ol,ol ul,ul ol,ul ul{margin-bottom:0}
dt{font-weight:600}
dd{margin-bottom:.5rem;margin-left:0}
blockquote{margin:0 0 1rem}
small{font-size:100%}
sub,sup{position:relative;vertical-align:baseline;font-size:75%;line-height:0}
sub{bottom:-.25em}
sup{top:-.5em}
b,strong{font-weight:600}
a{outline:0;background-color:transparent;color:#023eeb;text-decoration:none}
a:hover{text-decoration:none}
a:not([href]):not([tabindex]){color:inherit;text-decoration:none}
a:not([href]):not([tabindex]):focus,a:not([href]):not([tabindex]):hover{color:inherit;text-decoration:none}
a:not([href]):not([tabindex]):focus{outline:0}
code,kbd,pre,samp{font-size:1rem;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}
pre{overflow:auto;margin-top:0;margin-bottom:1rem}
figure{margin:0 0 1rem}
img{border-style:none;vertical-align:middle}
svg{overflow:hidden;vertical-align:middle}
table{border-collapse:collapse}
caption{padding-top:.75rem;padding-bottom:.75rem;color:#6c757d;caption-side:bottom;text-align:left}
th{text-align:inherit}
label{display:inline-block;margin-bottom:.5rem}
button{border-radius:0;-webkit-tap-highlight-color:transparent}
:focus{outline:0}
button:focus{outline:0}
button,input,optgroup,select,textarea{margin:0;font-size:inherit;font-family:inherit;line-height:inherit}
button,input{overflow:visible;-webkit-appearance:none}
button,select{text-transform:none}
select{word-wrap:normal}
[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}
[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}
[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{padding:0;border-style:none}
input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}
input[type=date],input[type=datetime-local],input[type=month],input[type=time]{-webkit-appearance:listbox}
textarea{overflow:auto;resize:vertical;-webkit-appearance:none}
fieldset{margin:0;padding:0;min-width:0;border:0}
legend{display:block;margin-bottom:.5rem;padding:0;width:100%;max-width:100%;color:inherit;white-space:normal;font-size:1.5rem;line-height:inherit}
progress{vertical-align:baseline}
[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}
[type=search]{outline-offset:-2px;-webkit-appearance:none}
[type=search]::-webkit-search-decoration{-webkit-appearance:none}
::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}
output{display:inline-block}
summary{display:list-item;cursor:pointer}
template{display:none}
[hidden]{display:none!important}
.btn.focus,.btn:focus{box-shadow:none}
@media screen and (max-width:576px){
    body{line-height:1.5}
    .family-noto{font-family:"pingfang SC","Helvetica Neue","Open Sans","Microsoft YaHei","Hiragino Sans GB",Arial}
}
@media screen and (min-width:1920px){
    body{margin-right:auto;margin-left:auto;width:1920px}
    .container-fluid{width:1920px}
}

/*全站字体大小设置（新版）***********************************************************************/
.bold500{font-weight:500}
.bold{font-weight:600}
.fine{font-weight:normal}
.font-xs{font-size:.8rem}
.font-sm{font-size:.95rem}
.font-md{font-size:1.25rem}
.font-lg{font-size:1.5rem}
.font-xl{font-size:2rem}
.font-xxl{font-size:3rem}
@media screen and (max-width:576px){
    .font-xs{font-size:.8rem}
    .font-sm{font-size:.9rem}
    .font-md{font-size:1rem}
    .font-lg{font-size:1.25rem}
    .font-xl{font-size:1.75rem}
    .font-xxl{font-size:2.5rem}
}

/*header******************************************************************************/
header{position:absolute;z-index:9990;width:100%;height:80px;transition:all .3s ease 0s}
header .logo{overflow:hidden;width:100%;height:80px}
header .logo .usun{display:inline-block;box-sizing:content-box;margin-right:10px;padding-right:10px;width:210px;height:50%;border-right:1px solid rgba(255,255,255,.15);background:url(../images/cn-logo-white.png) no-repeat left center;vertical-align:middle}
header .logo h1,header .logo p{display:inline;color:rgba(255,255,255,.9);line-height:80px}
header .logo p{margin-bottom:0;color:#333}
.fixed_header{position:fixed;background:rgba(255,255,255,.99);box-shadow:0 0 15px 1px rgba(0,0,0,.05)}
.fixed_header .logo .usun{border-right:1px solid rgba(51,51,51,.1);background:url(../images/cn-logo-blue.png) no-repeat left center}
.fixed_header .logo h1{color:#333}
@media screen and (max-width:1024px){
    header{height:65px}
    header .logo{height:65px}
    .fixed_header .logo .usun,header .logo .usun{height:60%;border-right:0}
    header .logo h1{line-height:65px;opacity:0}
}
@media screen and (max-width:768px){
    header .logo .usun{border-right:0;background:url(../images/cn-logo-white-mobile.png) no-repeat left top;background-size:auto 85%}
    .fixed_header .logo .usun{border-right:0;background:url(../images/cn-logo-blue-mobile.png) no-repeat left top;background-size:auto 85%}
    .fixed_header{box-shadow:0 0 0 0 transparent}
}
@media screen and (max-width:576px){
    .fixed_header .logo .usun,header .logo .usun{margin-top:4%;height:70%}
    header .logo .usun{background:url(../images/cn-logo-white-mobile.png) no-repeat left center;background-size:70% auto}
    .fixed_header .logo .usun{background:url(../images/cn-logo-blue-mobile.png) no-repeat left center;background-size:70% auto}
}

/*响应式导航********************************************/
/*汉堡展开效果*/
menu .nav__trigger .nav__icon{position:relative;display:inline-block;width:30px;height:2px;background-color:#fff;transition:all .1s ease 0s;-webkit-transition-duration:.1s;transition-duration:.1s;-webkit-transition-property:background-color,-webkit-transform;transition-property:background-color,-webkit-transform;transition-property:background-color,transform;transition-property:background-color,transform,-webkit-transform}
menu .nav__trigger .nav__icon:after,menu .nav__trigger .nav__icon:before{position:absolute;display:block;width:30px;height:2px;background:#fff;content:'';-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:margin,-webkit-transform;transition-property:margin,-webkit-transform;transition-property:margin,transform;transition-property:margin,transform,-webkit-transform}
menu .nav__trigger .nav__icon:before{margin-top:-8px}
menu .nav__trigger .nav__icon:after{margin-top:8px}
.fixed_menu .nav__trigger .nav__icon,.fixed_menu .nav__trigger .nav__icon:after,.fixed_menu .nav__trigger .nav__icon:before{background:#333}
.nav--active .nav__trigger .nav__icon{background:rgba(51,51,51,0)}
.nav--active .nav__trigger .nav__icon:before{margin-top:0;background:#333;-webkit-transform:rotate(45deg);transform:rotate(45deg)}
.nav--active .nav__trigger .nav__icon:after{margin-top:0;background:#333;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}

/*大屏幕*/
menu .nav__trigger{display:none}
menu{position:relative;overflow:hidden;margin:0;width:100%}
menu nav{margin:25px 0;height:30px;text-align:right}
menu nav a{position:relative;display:inline-block;margin:0 1rem;color:#fff;line-height:28px}
menu nav .current{border-bottom:2px solid #fff;color:#fff}
menu nav a::after{position:absolute;bottom:0;left:0;width:0;height:2px;background-color:rgba(255,255,255,0);content:''}
menu nav a:hover{color:#fff}
menu nav a:hover::after{left:0;width:100%;background-color:#fff}
menu nav a,menu nav a::after{transition:all .2s ease 0s}
menu nav .current:hover{border-bottom:2px solid rgba(255,255,255,.8);color:rgba(255,255,255,.8)}
menu nav .current:hover::after{width:0}
menu .copyright{display:none}
.fixed_menu nav a{color:#333}
.fixed_menu nav a:hover{color:#023eeb}
.fixed_menu nav a:hover::after{left:0;width:100%;background-color:#023eeb}
.fixed_menu nav .current{border-bottom:2px solid #023eeb;color:#023eeb}
.fixed_menu nav .current:hover{border-bottom:2px solid #023eeb;color:#023eeb}
.fixed_menu nav .current:hover::after{width:0!important}
@media screen and (max-width:1200px){
    menu .nav__trigger{display:block}
    menu{margin:0;height:65px}
    menu nav{height:65px}
    menu nav a{margin-right:-150px}
}

/*小屏幕*/
menu .nav__trigger{position:absolute;top:15px;right:15px;z-index:9999;width:30px;height:25px}
@media screen and (max-width:1200px){
    menu nav a,menu nav a::after{transition:all 0s ease 0s}
    .nav--active{position:fixed;top:0;right:0;z-index:9998;padding:0;height:100%;max-width:100%;background:rgba(255,255,255,.99);transition:height .3s ease 0s}
    .nav--active nav{margin:0 auto;padding-top:15%;width:100%;height:auto}
    .nav--active nav a{position:relative;display:inline-block;margin:0 0 0;width:100%;color:#333;text-align:center;line-height:50px;opacity:1;font-size:25px}
    .nav--active nav a:hover{border-bottom:0 none;color:#023eeb}
    .nav--active nav .current{border-bottom:0;color:#023eeb}
    menu nav a::after{height:0}
    .nav--active .copyright{display:block;margin-top:5%;margin-right:auto;margin-left:auto;padding-top:5%;width:90%;border-top:1px solid #eee;text-align:center;line-height:30px}
}

/*footer******************************************************************************/
footer{position:relative;padding-top:80px;padding-bottom:20px;background-color: #151515;}
footer::after{background:url(../svg/guilloche.svg) repeat center center;background-size:20px 20px;content: "";position: absolute;width:100%;height:100%;top:0;left:0;z-index: 0;opacity: .8;-webkit-mask-image:linear-gradient(160deg, rgb(0, 0, 0), rgba(0, 0, 0, 0))}
footer .col-12{z-index: 1;}
footer .collapse:not(.show){display:block}
@media screen and (max-width:768px){
    footer{padding-top:60px;padding-bottom:30px}
}
@media screen and (max-width:576px){
    footer .collapse:not(.show){display:none}
}
/*link*/
footer .title{margin-bottom:.5rem;color:#fff}
footer .title a{float:right;display:none;color:#fff}
footer .title a:before{content:'\f068';font-size:10px;font-family:FontAwesome}
footer .title .collapsed:before{content:'\f067';font-size:10px;font-family:FontAwesome}
footer .link{color:rgba(255,255,255,.7)}
footer .link a{display:block;margin-bottom:.5rem;width:100%;color:rgba(255,255,255,.7);font-weight: 300;}
footer .link a:hover{color:#fff}
@media screen and (max-width:576px){
    footer .title{margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid rgba(255,255,255,.04);color:rgba(255,255,255,.7)}
    footer .title a{display:block}
}
/*contact*/
footer .contact{color:rgba(255,255,255,.7);font-weight: 300;}
footer .contact .qrcode-box{padding-top:5px;text-align:right}
footer .contact .qrcode{display:inline-block;margin-right:25px;margin-bottom:25px;width:100px;height:100px;text-align:center;opacity:.9}
footer .contact .qrcode p{line-height:30px}
footer .contact .qrcode img{width:100%;border:5px solid #fff;border-radius:3px}
footer .contact .tips{display:none}
footer .contact .text{float:right;text-align:left}
footer .contact span{display:block;margin-bottom:.25rem}
footer .contact small{margin-right:10px}
@media screen and (max-width:768px){
    footer .contact{margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.04)}
    footer .contact .qrcode-box{text-align:left}
    footer .contact .qrcode{margin:0 15px}
}
@media screen and (max-width:576px){
    footer .contact{margin-top:0;padding-top:0;border-top:0 solid rgba(255,255,255,.04)}
    footer .contact .qrcode-box{padding-top:15px}
    footer .contact .qrcode{float:left;overflow:hidden;margin-right:10px;margin-left:0;height:auto}
    footer .contact .qrcode p{margin-bottom:0}
    footer .contact .tips{display:block}
    footer .contact .tips .fa{display:block;margin-bottom:.5rem;font-size:2rem}
    footer .contact .text{float:none;margin-left:0;width:100%;text-align:left}
}
/*copyright*/
footer .copyright{position:relative;margin-top:1rem;padding:1rem 15px 0;border-top:1px solid rgba(255,255,255,.05);color:rgba(255,255,255,.7);text-align:right;font-size:12px}
footer .copyright .iconfont{position:absolute;top:2px;left:0;display:inline-block;color:#fff}
footer .copyright p{margin:0;padding-left:0;text-align:left;line-height:30px}
footer .copyright a{margin-right:8px;padding-right:8px;border-right:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.7);line-height:16px;display:inline-block;margin-bottom:5px}
footer .copyright a:hover{color:#fff}
footer .copyright a:last-child{border-right:0 solid rgba(255,255,255,.1)}
@media screen and (max-width:768px){
    footer .copyright{border-bottom:0 solid rgba(255,255,255,.05);text-align:center}
    footer .copyright .icon-szphp{display:none}
    footer .copyright p{margin-bottom:1rem;padding-left:0;text-align:center;line-height:20px}
}
@media screen and (max-width:576px){
    footer .copyright .none576{display:none}
}
/*friendlink*/
footer .friendlink{margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.05);font-size:12px}
footer .friendlink span{display:inline-block;margin-right:8px;padding-right:8px;border-right:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.7)}
footer .friendlink a{margin-right:8px;padding-right:8px;color:rgba(255,255,255,.7);line-height:20px}
footer .friendlink a:hover{color:#fff}
@media screen and (max-width:768px){
    footer .friendlink{display:none}
}
/*debug_time*/
footer .debug_time{font-size:11px;margin-top:10px;color:#333}
footer .debug_time b{font-weight:400}
/*返回头部和在线客服*/
.gotop{position:fixed;right:-3px;bottom:5%;z-index:99999;font-size:12px}
.gotop .online{border-radius:3px;background:#fff;box-shadow:0 0 10px rgba(33,37,44,.2);transition:all .5s ease 0s}
.gotop .backtop{margin-top:10px;border-radius:3px;background:#fafafa;box-shadow:0 0 10px rgba(33,37,44,.2);transition:all .5s ease 0s}
.gotop a{display:block;width:55px;height:60px;color:#333;text-align:center;cursor:pointer}
.gotop .backtop a{height:45px}
.gotop a:hover{color:#023eeb}
.gotop .iconfont{display:block;margin-bottom:-.5rem;font-size:1.5rem;line-height:45px}
.gotop .fa{display:block;margin-bottom:-.5rem;font-size:1.5rem;line-height:45px}
.gotop .backtop .fa{display:block;font-size:2rem;line-height:55px;line-height:45px}
.gotop .zixun{position:relative;transition:margin .5s ease 0s;-webkit-animation-name:fadeInOut;-webkit-animation-timing-function:ease-in-out;-webkit-animation-iteration-count:infinite;-webkit-animation-duration:2s;-webkit-animation-direction:alternate}
.gotop .zixun span{position:absolute;top:5px;right:5px;width:16px;height:16px;border-radius:50%;background:#f36;color:#fff;text-align:center;line-height:16px}
/*微信弹出*/
.gotop .wechat{position:relative}
.gotop .online .wechat a{height:65px;border-bottom:1px solid #ededed}
.gotop .online .wechat .iconfont{font-size:1.4rem}
.gotop .online .wechat .wechatbox{position:absolute;top:0;right:60px;display:none;padding:10px;width:auto;height:auto;border-radius:3px;background:#fff;box-shadow:0 0 10px rgba(33,37,44,.2);text-align:center;transition:all .5s ease 0s}
.gotop .online .wechat .wechatbox .wechat-img{display:inline-block;padding:0;width:128px;background:#fff;color:#333}
.gotop .online .wechat .wechatbox .wechat-img img{width:100%}
.gotop .online .wechat .wechatbox span{display:block;margin-top:.5rem}
.gotop .online .wechat:hover .wechatbox{right:60px;display:block!important;animation:fadein .5s ease}
@keyframes fadein{
    from{right:25px;opacity:0}
    to{right:60px;opacity:1}
}
/*手机只显示在线客服*/
@media screen and (max-width:768px){
    .gotop a{width:45px}
}
@media screen and (max-width:576px){
    .gotop .online .wechat{display:none}
    .gotop .online .qq{display:none}
    .gotop .online .book{display:block}
    .gotop a{height:50px}
    .gotop .fa{font-size:1.25rem;line-height:35px}
}
/*呼吸灯效果*/
.breathe{-webkit-animation-name:fadeInOut;-webkit-animation-timing-function:ease-in-out;-webkit-animation-iteration-count:infinite;-webkit-animation-duration:3s;-webkit-animation-direction:alternate}@-webkit-keyframes fadeInOut{0%{color:#023eeb}20%{color:rgba(255,51,102,.9)}40%{color:#f36}60%{color:1}80%{color:rgba(255,51,102,.9)}100%{color:#023eeb}}
/*动画延时*/
.delay1s{-webkit-animation-delay:.5s}
.delay2s{-webkit-animation-delay:1s}
.delay3s{-webkit-animation-delay:1.5s}

/*修改腾讯云智服的在线图标 20220728*/
.main-chat {
	right: 55px!important
}
.main-contact {
	right: -3px!important;
	bottom: 230px!important
}
.main-contact .chat-btn {
	padding: 0!important;
	width: 55px!important;
	height: 60px!important;
	border-radius: 3px;
	background-color: #fff!important;
	box-shadow: 0 0 10px rgba(33,37,44,.2);
    align-items: center
}
.main-contact .icon {
	margin-right: 0!important;
	background-image: none!important
}
.main-contact .icon {
	font-style: normal!important
}
.main-contact .icon::before {
	margin-left: -2px;
	color: #023eeb;
	content: '\e69e';
	font-size: 10px;
	font-size: 1.5rem;
	font-family: iconfont;
	transition: margin .5s ease 0s;
	-webkit-animation-name: fadeInOut;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-duration: 2s;
	-webkit-animation-direction: alternate
}
.main-contact .icon::after {
	display: block;
	margin-top: -5px;
	color: #023eeb;
	content: '咨询';
	font-size: 12px;
    font-weight: 600;
	transition: margin .5s ease 0s;
	-webkit-animation-name: fadeInOut;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-duration: 2s;
	-webkit-animation-direction: alternate
}
.main-contact .txt {
	font-size: 0!important
}
/* .main-contact .txt::before {
	position: absolute;
	top: 5px;
	right: 5px;
	width: 13px;
	height: 13px;
	border-radius: 50%;
	background: #f36;
	color: #fff;
	content: "2";
	text-align: center;
	font-size: 10px;
	line-height: 13px;
} */
@media screen and (max-width:768px){
    .main-contact .chat-btn {
        width: 45px !important;
        min-width: 45px !important;
    }
    .main-contact .txt::before {display: none;}
    .main-contact .icon {
        width:auto!important;
        height:auto!important
    }
}
@media screen and (max-width:576px){
    .main-contact {
        bottom: 90px!important
    }
}

/*修改观点研究栏目内容页代码高亮显示滚动条样式 20220729*/
.syntaxhighlighter{border-radius: 3px;}
.syntaxhighlighter::-webkit-scrollbar{width:8px;height:8px;background-color:#ccc}
.syntaxhighlighter::-webkit-scrollbar-thumb{widows:8px;height:8px;background-color:#ccc}
.syntaxhighlighter::-webkit-scrollbar-track-piece{width:8px;height:8px;background-color:#edf1fb}
.syntaxhighlighter::-webkit-scrollbar-thumb:hover{width:8px;height:8px;background-color:#ccc}
.syntaxhighlighter .toolbar{display: none;}

/* 动画加载效果 20220905*/
.preloader{position:fixed;top:0;left:0;z-index:99999;width:100%;height:100%;background-color:#fff}
.loader{position:absolute;top:50%;left:50%;display:block;display:grid;--color:rgb(44, 74, 247);--size-mid:6vmin;--size-dot:1.5vmin;--size-bar:.4vmin;--size-square:3vmin;place-items:center}
.loader::after,.loader::before{position:absolute;box-sizing:border-box;content:''}
.loader.--1::before{width:var(--size-mid);height:var(--size-mid);border:4px solid var(--color);border-radius:50%;border-top-color:transparent;-webkit-animation:loader-1 1s linear infinite;animation:loader-1 1s linear infinite}
.loader.--1::after{width:calc(var(--size-mid) - 2px);height:calc(var(--size-mid) - 2px);border:2px solid transparent;border-radius:50%;border-top-color:var(--color);animation:loader-1 .6s linear reverse infinite}
@-webkit-keyframes loader-1{100%{transform:rotate(1turn)}}
@keyframes loader-1{100%{transform:rotate(1turn)}}