/* reset.css */
/*
@ author Nero
@ email nero.zhang@minew.com
*/

@font-face {
  font-family: 'oplusiconfontregular';
  src: url('../fonts/OPlusSans3-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'oplusiconfontmedium';
  src: url('../fonts/OPlusSans3-Medium.ttf') format('truetype');
}

@font-face {
  font-family: 'oplusiconfontlight';
  src: url('../fonts/OPlusSans3-Light.ttf') format('truetype');
}

@font-face {
  font-family: 'oplusiconfontbold';
  src: url('../fonts/OPlusSans3-Bold.ttf') format('truetype');
}

@font-face {
  font-family: 'oplusiconfontregular';
  src: url('../fonts/OPlusSans3-Regular.ttf') format('truetype');
}


/*  */
@font-face {
  font-family: 'oppoiconfontbold';
  src: url('../fonts/OPPOSans-Bold.ttf') format('truetype');
}

@font-face {
  font-family: 'oppoiconfontmedium';
  src: url('../fonts/OPPOSans-Medium.ttf') format('truetype');
}

@font-face {
  font-family: 'oppoiconfontregular';
  src: url('../fonts/OPPOSans-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'iconfont';
  src: url('../fonts/iconfont.ttf') format('truetype');
}

@font-face {
  font-family: 'iconfont1';
  src: url('../fonts/iconfont1.ttf') format('truetype');
}


body {
    font-family: 'oplusiconfontregular' !important;
}

p{
    text-align: justify;
}


.icon {
  width: 3em;
  height: 3em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}

.icon1 {
  width: 2em;
  height: 2em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}

.iconfont1 {
  font-family: "iconfont1" !important;
  font-size: 50px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: var(--color-blue);
}



.iconfont {
  font-family: "iconfont" !important;
  font-size: 50px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: var(--color-blue);
}

/* 整套字体 定义规则 */
@font-face {
	font-family: "SourceHanSansCN";
	src: url('../fonts/fontmin/SourceHanSansCN-Light.woff2') format('woff2');
	/* src: url('../fonts/fontmin/SourceHanSansCN-Light.woff') format('woff'), */
	/* url('../fonts/fontmin/SourceHanSansCN-Light.ttf') format('truetype'); */
	font-weight: 300;
	font-style: normal;
}
@font-face {
	font-family: "SourceHanSansCN";
	src: url('../fonts/fontmin/SourceHanSansCN-Normal.woff2') format('woff2');
	/* src: url('../fonts/fontmin/SourceHanSansCN-Normal.woff') format('woff'), */
	/* url('../fonts/fontmin/SourceHanSansCN-Normal.ttf') format('truetype'); */
	font-weight: 400;
	font-style: normal;
}
@font-face {
	font-family: "SourceHanSansCN";
	src: url('../fonts/fontmin/SourceHanSansCN-Bold.woff2') format('woff2');
	/* url('../fonts/fontmin/SourceHanSansCN-Bold.woff') format('woff'), */
	/* url('../fonts/fontmin/SourceHanSansCN-Bold.ttf') format('truetype'); */
	font-weight: 700; /*不要用 blod*/
	font-style: normal;
}

:root{
    --font-size-root: 14px;     /* 字号 */
    /* 颜色值 */
    --color-light-blue: #8DD2D5;   /* 浅蓝 */
    --color-blue: #05A9AF;   /*蓝*/
    --color-light-orange: #F18B6B;   /* 橘色 */
    --color-orange: #EA5123;    /* 浅橘色 */
    --color-red: #e0131c;   /*企业红*/
    --color-font: #020202;  /*字体颜色 默认*/
    /* 顶部导航栏高度 */
    --nav-height: 68px;
}
/* #region reset CSS*/
html,body,ul,ol,li,dl,dt,dd,p,h1,h2,h3,h4,h5,h6,form,input,button,img,div,footer,header,section,em,i,strong,nav,main{
    margin:0;
    padding:0;
    border:0;
    box-sizing: border-box;
}
ul,ol{list-style-type:none;}
img{max-width: 100%;}
/* 斜体去除 */
i{font-style: inherit;}
a{
    text-decoration:none;
    color: var(--color-font);
}
a:hover{color: var(--color-font);}

html,body{
    font-size: var(--font-size-root);
    font-family: 'SourceHanSansCN', 'Arial' ,'sans-serif';
    -webkit-font-smoothing: antialiased;
    font-weight: normal;
    color: var(--color-font);
    line-height: 1.56;
    font-style: normal;
    position: relative !important;
    top: 0 !important; /* 针对 SEO quake插件 */
    width: 100%;
    color: var(--color-font);
}

/* 表单元素 */
input[type='email']:focus, 
input[type='date']:focus, 
input[type='search']:focus, 
input[type='number']:focus, 
input[type='text']:focus, 
input[type='tel']:focus, 
input[type='url']:focus, 
input[type='password']:focus, 
textarea:focus, select:focus{
    outline: none;
}

/* 去除默认加减按钮 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]{
    margin: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
/* 针对Firefox浏览器 兼容 写法*/
@-moz-document url-prefix() {
    input[type="number"] {
        -webkit-appearance: textfield;
        -moz-appearance: textfield;
        appearance: textfield;
    }
} 
/* 去除默认边框 */
input[type="number"] {
    outline: none; /* 可选，去除焦点时的外边框 */
    text-align: center;
    padding: 0;
}
/* #endregion */

/* #region 自定义公用 CSS*/
/* 公用类名 */
.flex{ display: flex;} /* flex布局 */
.flex-column{ display: flex; flex-direction: column;}
.flex-wrap{ display: flex; flex-wrap: wrap;}
.flex-center{ display: flex; justify-content: center;align-items: center;}


.pt-160{padding-top:160px;}
.pt-100{padding-top:100px;}
.pt-80{padding-top:80px;}
.pt-60{padding-top:60px;}
.pt-50{padding-top:50px;}
.pt-30{padding-top:30px;}
.pt-20{padding-top:20px;}
.pt-10{padding-top:10px;}
.pt-5{padding-top:5px;}

.pb-160{padding-bottom:160px;}
.pb-100{padding-bottom:100px;}
.pb-80{padding-bottom:80px;}
.pb-60{padding-bottom:60px;}
.pb-50{padding-bottom:50px;}
.pb-30{padding-bottom:30px;}
.pb-20{padding-bottom:20px;}
.pb-10{padding-bottom:10px;}
.pb-5{padding-bottom:5px;}
.pl-5{padding-left:5px;}
.pl-10{padding-left:10px;}
.pr-5{padding-right:5px;}
.pr-10{padding-right:10px;}

.mt-5{margin-top: 5px;} 
.mt-10{margin-top: 10px;} 
.mt-20{margin-top: 20px;} 
.mt-30{margin-top: 30px;}
.mt-50{margin-top: 50px;}
.mt-80{margin-top: 80px;}
.mt-100{margin-top: 100px;}
.mt-120{margin-top: 120px;}


.mb-5{margin-bottom: 5px;} 
.mb-10{margin-bottom: 10px;} 
.mb-20{margin-bottom: 20px;} 
.mb-30{margin-bottom: 30px;}
.mb-50{margin-bottom: 50px;}
.mb-80{margin-bottom: 80px;}
.mb-100{margin-bottom: 100px;}
.mb-120{margin-bottom: 120px;}

.mt-6rem{
    margin-top: 6rem;
}
.mb-1rem{
    margin-bottom: 1rem;

}

/* 文字样式 */
.font-blod{
    font-weight: 700;
    font-family: 'oplusiconfontregular' !important;
}
.font-light{font-weight: 300;}
.font-normal{font-weight: 400;}

.font-blue{color: var(--color-blue);}
.font-red{color: var(--color-red);}
.font-white{color: #fff;}
.font-gray{color: #666;}
.font-center{text-align: center;}

.font-56{font-size: 56px;}
.font-50{font-size: 50px;}
.font-48{font-size: 48px;}
.font-46{font-size: 46px;}
.font-44{font-size: 44px;}
.font-40{font-size: 40px;}
.font-38{font-size: 38px;}
.font-36{font-size: 36px;}
.font-34{font-size: 34px;}
.font-30{font-size: 30px;}
.font-28{font-size: 28px;}
.font-26{font-size: 26px;}
.font-24{font-size: 24px;}
.font-22{font-size: 22px;}
.font-20{font-size: 20px;}
.font-18{font-size: 18px;}
.font-17{font-size: 17px;}
.font-16{font-size: 16px;}
.font-15{font-size: 15px;}
.font-14{font-size: 14px;}
.font-12{font-size: 12px;}

/* 辅助类 */
.hidden{display: none !important;}
.border{border: 1px solid red;}
.clear::after{content: '';clear: both;display: table;}
.hr{ border-bottom: 1px solid #a1a1a150;}

/* 样式类 */
.br-full{border-radius: 500px;}
.br-10{border-radius: 10px;}
.br-5{border-radius: 5px;}
.br-3{border-radius: 3px;}
.bd-1{border: 1px solid #a1a1a150;}

/* 按钮 样式 */
.btn{
	background-color: #a2a9b6;
	color: #4c5161;
	cursor: pointer;
	display:inline-block;
    padding: 4px 18px;
    margin-right: 2px;
    margin-left: 2px;
	border: 0 solid transparent;
	transition: all 0.3s ease-in-out;
}
.btn:hover{
    /* 滤镜：加暗 和 阴影 */
    filter: brightness(.96) drop-shadow(0px 1px 1px #ccc);
    -webkit-filter: brightness(.96) drop-shadow(0px 1px 1px #ccc);
}
.blue{
	background-color: var(--color-blue);
	color: #f7f9fa;
}
.light-blue{
	background-color: var(--color-light-blue);
	color: #f7f9fa;
}
.blue-gradient{
    color: #f7f9fa;
    background-image: linear-gradient(145deg, var(--color-blue), var(--color-light-blue));
}
.orange{
	background-color: var(--color-orange);
	color: #f7f9fa;
}
.light-orange{
	background-color: var(--color-light-orange);
	color: #f7f9fa;
}
.orange-gradient{
    color: #f7f9fa;
    background-image: linear-gradient(145deg, var(--color-orange), var(--color-light-orange));
}
.blue:hover, .light-blue:hover, .blue-gradient:hover, .orange:hover, .light-orange:hover, .orange-gradien:hover{
	color: #f7f9fa;
}
/* #endregion */

/* 等待动画 */
/*沒有圈圈的情況*/
.loading2::before {   
    content: "";
    position: absolute;
    inset: 0;
    /* opacity: 0; */
    z-index: 1;
    border-radius: inherit;
    background-color: inherit;
    box-shadow: inherit;
    transition: opacity 0s ease;
    background-color: #f1f1f110;
}
.loading::before {
    content: "";
    position: absolute;
    inset: 0;
    /* opacity: 0; */
    z-index: 1;
    border-radius: inherit;
    background-color: inherit;
    box-shadow: inherit;
    transition: opacity 0s ease;
    background-color: #f1f1f110;
}
.loading::after {
    position: absolute;
    top: calc(50% - 9px);
    inset-inline-start: calc(50% - 9px);
    /* opacity: 0; */
    z-index: 2;
    transition: opacity 0s ease;
    content: "";
    display: inline-block;
    width: 26px;
    height: 26px;
    border: 2px solid rgba(0,0,0,0);
    /* border-left-color: currentColor; */
    border-left-color: var(--color-blue);
    border-radius: 50%;
    vertical-align: middle;
    animation: wd-rotate 450ms infinite linear;
}
@keyframes wd-rotate {
    100% {
        transform: rotate(360deg)
    }
}


/* 鼠标移入图片放大 class */
.hover-scale,
.hover-scale-10,
.hover-scale-20{
    overflow: hidden;
}
.hover-scale img,
.hover-scale-10 img,
.hover-scale-20 img{
    transition: transform 0.4s ease-in-out;
}
.hover-scale:hover img{
    transform: scale(1.05);
}
.hover-scale-20:hover img{
    transform: scale(1.20);
}
.hover-scale-10:hover img{
    transform: scale(1.10);
}