@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css");

/* ============================================================
   general styles
   ============================================================ */
html{
	-webkit-text-size-adjust:100%;
	-ms-text-size-adjust:100%;
	-ms-overflow-style:scrollbar;
	-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
}
body {
    margin:0;
    font-family: "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
    font-family: ArialMTPro-Light,HeiSASC-Medium,HeiSASC-Light,"Helvetica Neue","Helvetica",sans-serif;
    /*font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";*/
    font-size:1rem;
    font-weight:400;
    line-height:1.8!important;
    color:#212529;
    background-color:#2c2c2c;
    -moz-osx-font-smoothing:grayscale;
    -webkit-font-smoothing:antialiased !important;
}
a:hover{
    text-decoration:none!important;
}
sub, sup {
	font-size:75%;
	line-height:0;
	position:relative;
	vertical-align:baseline;
}
sup {
	top:-0.5em;
}
sub {
	bottom:-0.25em;
}
ul,ol {
    list-style:none;
	margin:0;
    padding:0;
}
.fs-4{
	font-size:calc(1.275rem + .3vw) !important;
}
.fs-5{
	font-size:1.25rem !important;
}
.fs-6{
	font-size:1rem !important;
}
.table{
	width:100%;
	margin-bottom:1rem;
	color:#212529;
}
.h0,h0{
	font-size:3rem;
	margin-top:0;
	margin-bottom:.5rem;
	font-weight:500;
	line-height:1.2;
}
.m-6{
	margin:4rem!important;
}
.mt-6,.my-6{
	margin-top:4rem!important;
}
.mr-6,.mx-6{
	margin-right:4rem!important;
}
.mb-6,.my-6{
	margin-bottom:4rem!important;
}
.ml-6,.mx-6{
	margin-left:4rem!important;
}
.hui{
	color:#9c9c9c;
}
.w-80{width:80%!important}
.w-85{width:85%!important}
.w-90{width:90%!important}
.w-95{width:95%!important}


/* ============================================================
   #header styles
   ============================================================ */
#header {
	transition:all 0.95s;
	position:absolute;
	z-index:997;
	top:0px;
	width:100%;
}
#header.menu_fixed {
	background-color:rgba(21,91,213,1.0)!important;
	/*background: #2c2c2c!important;*/
	/*background:rgba(55, 55, 55, 0.99)!important;*/
	position:fixed;
	top:0px;
	/*box-shadow:0 2px 18px 0 rgba(0, 0, 0, 0.9);*/
}
#header.header-scrolled {
	background-color:rgba(0,0,0,0.3);
	/*background-color:rgba(21,91,213,0.5);*/
	box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.29);
	padding:0;
}
#header .logo {
	margin:10px 0px 10px 0px;
	overflow:hidden;
}
#header .bg-navbar{
	background:transparent;
	/*background-color:rgba(240, 240, 240, 0.1);*/
	/*box-shadow:0px 1px 0px 0px rgba(255, 255, 255, 0.1);*/
}
.navbar-nav .nav-link{
	padding:13px 8px!important;
    overflow:hidden;
}
.navbar-nav a.nav-link{
	color:#ffffff!important;
	font-size:16px!important;
	font-weight:bold;
}
.navbar-nav a.nav-link:hover{
	background-color:#2c6bd9;
	color:#ffffff!important;
	text-decoration:none;
}
.navbar-toggler{
	padding:.5rem .75rem!important;
	font-size:1.25rem;
	line-height:1;
	background-color:#ffffff!important;
	border:1px solid #e8e8e8!important;
	border-radius:.25rem;
}
.navbar-toggler span {
	background:#8e9196!important;
	display:block;
	width:22px;
	height:2px;
	margin:0 auto;
	margin-top:0px;
	-webkit-border-radius:1px;
	-moz-border-radius:1px;
	border-radius:1px;
	-webkit-transition:all 0.2s linear;
	-moz-transition:all 0.2s linear;
	-o-transition:all 0.2s linear;
	transition:all 0.2s linear;
}
.navbar-toggler span+span {
	margin-top:5px;
}
.navbar-toggler:hover {
	background-color:#555555!important;
	border:1px solid #555555!important;
}
.navbar-toggler:hover span {
	background:#ffffff!important;
}
.dropdown-menu{
    z-index:999999!important;
    height:auto!important;
}
.dropdown-item:focus,.dropdown-item:hover{
	color:#16181b;
	text-decoration:none;
	background-color:#9ceffc!important;
}
.navbar-collapse .navbar-btn {
    margin-top:0px;
}


/* ============================================================
   #carousel styles
   ============================================================ */
.carousel-caption{
    right:5%!important;
    left:5%!important;
}
.carousel-item_bg1{
    background-image:url(../img/carousel_1.png);
    background-repeat:no-repeat;
    background-size:cover;
    background-position:left center;
    min-height:600px;
    overflow:hidden;
}
.carousel-item_bg2{
    background-image:url(../img/carousel_2.png);
    background-repeat:no-repeat;
    background-size:cover;
    background-position:right center;
    min-height:600px;
    overflow:hidden;
}
.carousel-item_bg3{
    background-image:url(../img/carousel_3.png);
    background-repeat:no-repeat;
    background-size:cover;
    background-position:left center;
    min-height:600px;
    overflow:hidden;
}
.carousel-item_bg4{
    background-image:url(../img/carousel_4.png);
    background-repeat:no-repeat;
    background-size:cover;
    background-position:right center;
    min-height:600px;
    overflow:hidden;
}
.carousel-indicators{
	margin-right:5%!important;
	margin-left:5%!important;
}
.text-shadow{
	text-shadow:-1px -1px 0 #ffffff,1px 1px 0 #333333,1px 1px 0 #444444;
}


/* ============================================================
   #section-1 styles
   ============================================================ */
#section-1{
    padding:90px 0px 60px 0px;
}
.single-feature{
    background:#f9f9fd;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    -ms-border-radius:5px;
    -o-border-radius:5px;
    border-radius:5px;
    -webkit-transition:.5s;
    -moz-transition:.5s;
    -o-transition:.5s;
    transition:.5s;
}
.single-feature img{
    margin-bottom:40px;
}
.single-feature a{
    color:#333333!important;
}
.single-feature:hover{
    background:#ffffff;
    -webkit-box-shadow:0 5px 20px rgba(0,0,0,0.1);
    -moz-box-shadow:0 5px 20px rgba(0,0,0,0.1);
    box-shadow:0 5px 20px rgba(0,0,0,0.1);
	color:#007bff;
}
.item-padding{
    padding:40px 20px;
}


/* ============================================================
   #section-2 styles
   ============================================================ */
#section-2{
    margin:0px 0px 60px 0px;
}
.count-area{
    color:#ffffff;
    background-image:url("../img/index_01.png");
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    position:relative;
    z-index:1;
}
.count-area:after{
    content:'';
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-image:linear-gradient(to top right, rgba(36,76,253,0.79), rgba(21,228,253,0.79));
    z-index:-1;
}
.count-padding{
    padding:100px 0;
}
.count-box {
    text-align:center;
}
.count-box p {
    color:#ffffff;
    font-size:22px;
    font-family:'Roboto', sans-serif;
}
.count-box span {
    font-size:48px;
    font-family:'Poppins', sans-serif;
    color:#ffffff;
    text-align:center;
}
.count-box sup{
    vertical-align:text-top;
    font-size:100%;
    font-weight:bold;
}
.count-line {
    width:30px;
    margin:8px auto 8px auto;
    height:2px;
    background-color:#ffffff;
}


/* ============================================================
   #section-3 styles
   ============================================================ */
#section-3{
    padding:0px 0px 60px 0px;
}
.inner-box{
	position:relative;
	display:block;
	overflow:hidden;
	border-radius:6px;
}
.inner-box .image-box{
	position:relative;
	display:block;
	overflow:hidden;
	border-radius:6px;
}
.inner-box .image-box:before {
	position:absolute;
	content:'';
	width:100%;
	height:100%;
	background:-webkit-linear-gradient(90deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.0) 50%);
	bottom:0px;
	right:0px;
	z-index:1;
}
.inner-box .image-box img{
	width:100%;
	transition:all 500ms ease;
}
.inner-box:hover .image-box img{
	transform:scale(1.05);
}
.inner-box .text{
	position:absolute;
	left:20px;
	bottom:20px;
	width:calc(100% - 40px);
	background-color:transparent;
	z-index:2;
}
.inner-box .text h4{
	position:relative;
	display:block;
	font-size:18px;
	line-height:1.5;
	font-weight:normal;
	margin-bottom:20px;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
    color:#ffffff;
}
.inner-box .text h4 a{
	color:#ffffff;
}
.inner-box .text h4 a:hover{
	color:#9ceffc;
	text-decoration:none;
}
.badge-blue{
	min-width:80px;
	position:absolute;
	top:20px;
	left:20px;
	background-color:#9ceffc;
	padding:.5em .8em!important;
	color:#333333;
	font-size:14px!important;
	z-index:3;
}
a.badge-blue:focus,a.badge-blue:hover{
	background-color:#66e9fd;
	color:#ffffff;
}
a.badge-blue.focus,a.badge-blue:focus{
	outline:0;
	box-shadow:0 0 0 .2rem rgba(52,58,64,.5);
}


/* ============================================================
   #section-4 styles
   ============================================================ */
#section-4{
    padding:0px 0px 80px 0px;
}
.news_time{
    display:block;
    width:75px;
    height:75px;
    border:1px solid #155bd5;
    background:#155bd5;
    text-align:center;
}
.news_time .date{
    font-size:20px;
    color:#ffffff;
    padding:5px 0 0 0;
}
.news_time .year{
    color:#87a9e4;
    font-size:16px;
    font-weight:bold;
}
.news_title{
    overflow:hidden;
    text-overflow:ellipsis;
    display: -webkit-box;
    -webkit-line-clamp:1;
    -webkit-box-orient:vertical;
}
.news_text{
    color:#999999;
    font-size:16px;
    overflow:hidden;
    text-overflow:ellipsis;
    display: -webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
}


/* ============================================================
   #footer styles
   ============================================================ */
#footer {
    background:#4d4d4d;
    padding:40px 0px 30px 0px;
}
#footer .foot-item {
	margin-bottom:0px;
	color:#f1f1f1;
    font-size:14px;
}
#footer .foot-item div,#footer .foot-item p{
	line-height:1.75;
	color:#f1f1f1;
}
#footer .foot-item div a,#footer .foot-item p a{
	color:#f1f1f1;
}
#footer .foot-item div a:hover,#footer .foot-item p a:hover{
	color:#9ceffc;
	text-decoration:none;
}
#footer .foot-item ul{
    margin:0;
    padding:0;
    list-style-type:none;
}
#footer .foot-item li{
    position:relative;
    padding-left:25px;
    margin-bottom:2px;
}
#footer .foot-item li:last-child{
    margin-bottom:0;
}
#footer .foot-item li:before{
    content:"\f280";
    font-family:"bootstrap-icons";
    font-weight:400;
    font-size:12px;
    /*width:10px;
    height:10px;*/
    line-height:1;
    position:absolute;
    top:5px;
    left:0px;
}


/* ============================================================
   #inpage styles
   ============================================================ */
#inpage {
    margin:60px 0px;
    position:relative;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
    padding:0;
    border:0;
    vertical-align:baseline;
}
.banner {
    width:100%;
    height:300px;
}
.bannerimg {
    z-index:2;
    width:100%;
    height:100%;
    margin:0 auto;
    position:relative;
}
.bannerimg:after {
    position:absolute;
    left:0;
    top:0;
    height:100%;
    width:100%;
    background:#1d5df9;
    content:"";
    z-index:-1;
    opacity:.5;
}
.bannerimg .title {
    color:#ffffff;
    position:absolute;
    top:160px;
}
.bannerimg .title .h2 {
    color:#ffffff;
    font-size:60px;
}
.detail-title {
    word-break:break-all;
    text-overflow:ellipsis;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
}
#inpage .item-info {
    padding-bottom:20px;
    font-family:SourceHanSansCN-Normal, SourceHanSansCN;
    font-weight:300;
    color:rgba(0, 0, 0, 0.9);
    line-height:28px;
}
#inpage .item-info .text {
    position:relative;
    height:30px;
    line-height:30px;
    font-size:16px;
}
#inpage .item-info .text::before {
    content:"\f101";
    font:normal normal normal 14px/1 FontAwesome;
    position:absolute;
    top:0;
    left:-15px;
    line-height:30px;
    width:10px;
    font-size:15px;
    text-rendering:auto;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
}
.vs-list ul{
    margin:0;
    padding:0;
    list-style-type:none;
}
.vs-list li{
    position:relative;
    padding-left:45px;
    margin-bottom:15px;
}
.vs-list li:last-child{
    margin-bottom:0;
}
.vs-list li:before{
    content:"\f270";
    font-family:"bootstrap-icons";
    font-weight:400;
    width:25px;
    height:25px;
    line-height:25px;
    position:absolute;
    top:4px;
    left:20px;
}
.eline{
    margin:0;
    padding:0;
    padding-top:10px;
    padding-bottom:40px;
}
.eline ol {
    width: min(60rem, 90%);
    margin-inline: auto;
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    list-style: none;
    counter-reset: cardnr;
    justify-content: center;
}
.eline li {
    --frontColor:#f5f5f5;
    --width: 10em;
    --inlineP: 0.5rem;
    --borderR: 4rem;
    --arrowW: 2rem;
    --arrowH: 1.5rem;
    counter-increment: cardnr;
    width: calc(var(--width) - var(--inlineP) * 2);
    display: grid;
    grid-template:
        "icon" var(--borderR)
        "title"
        "descr" 1fr;
    margin-inline: var(--inlineP);
    margin-bottom: calc(var(--borderR));
    position: relative;
}
.eline li .icon,.eline li .title,.eline li .descr {
    background: var(--frontColor);
    padding-inline: 1rem;
    padding-bottom: 2rem;
}
.eline li .icon,.eline li .title {
    color: var(--accent-color);
    text-align: center;
    padding-bottom: 1.5rem;
}
.eline li .title,.eline li .descr {
    filter: drop-shadow(0.125rem 0.125rem 0.075rem rgba(0, 0, 0, 0.25));
}
.eline li .icon {
    /*background-color:transparent!important;*/
    grid-area: icon;
    /*font-size: 2rem;*/
    display: grid;
    place-items: center;
    border-radius: var(--borderR) 0 0 0;
    position: relative;
}
.eline li .icon img {
    margin: 1rem 0;
    height:50px;
}
.eline li .title {
    grid-area: title;
    padding-top:1rem;
    font-size: 24px;
    font-weight: bold;
}
.eline li .descr {
    grid-area:descr;
    line-height:1;
    font-size:16px;
    text-align:center;
}
.eline li .descr::before {
    content: "";
    width: var(--arrowW);
    height: var(--arrowH);
    position: absolute;
    right: 1.5rem;
    top: 100%;
    background: inherit;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.eline li::after {
    content: counter(cardnr, decimal-leading-zero);
    position: absolute;
    z-index: -1;
    left: calc(var(--inlineP) * -1);
    right: calc(var(--inlineP) * -1);
    top: var(--borderR);
    bottom: calc(var(--borderR) * -1);
    display: flex;
    align-items: flex-end;
    background: var(--accent-color);
    background-image: linear-gradient(160deg,rgba(255, 255, 255, 0.25),transparent 25% 75%,rgba(0, 0, 0, 0.25));
    border-radius: 0 0 var(--borderR) 0;
    --pad: 1rem;
    padding: var(--pad);
    font-size: calc(var(--borderR) - var(--pad) * 2);
    color: white;
}
.eline li::before {
    content: "";
    position: absolute;
    height: var(--borderR);
    top: calc(100% + var(--borderR) - 2px);
    left: calc(var(--inlineP) * -1);
    right: calc(var(--inlineP) * -1);
    border-radius: 0 var(--borderR) 0 0;
    background-image: linear-gradient(var(--accent-color), transparent 60%);
    opacity: 0.5;
    filter: blur(2px);
}
.carousel-indicators-inpage{
    bottom:-40px!important;
}
.carousel-indicators-inpage li{
    background-color:#0066ff!important;
}