body{font-family:"Microsoft Yahei";font-size:14px;color:#333; padding:0; margin:0;}
input , textarea , select{font-family:"Microsoft Yahei"; color:#333; font-size:14px;}
a{ color:#000;}
a:hover{ color:#1330aa;}
/*头部*/
.header{ width:100%; border-bottom:1px solid #000;position:fixed;z-index:100;background:#fff;}
.head{ width:1200px; margin:0px auto;height:75px;}
.head .logo{ height:55px;line-height: 55px; float:left; margin:10px 0;font-size: 16px;font-weight:bold;}   /*width:355px;*/
.head .logo img{ height:55px; vertical-align:top;}
.head .nav_m{ width:780px; float:right; margin-top:22px;}
.head .nav_m .nav{ width:100%; text-align:right;}
.nav li,.nav li a{ display:inline-block;display:inline; zoom:1;}
.nav li{ border-bottom:2px solid #FFF; margin-left:38px;}
.nav li.now{ border-bottom:2px solid #CB3333;}
.nav li a{ margin-left:0; font-size:16px; color:#000; padding:0 10px; height:35px; line-height:35px;}
.nav li a:hover,.nav li.now a{ color:#CB3333;}
.nav_m .n_icon{ display:inline-block; *display:inline; zoom:1; height:18px; line-height:18px; color:#333; padding-left:28px; background:url(../images/nav_ico.png) no-repeat left center; position:absolute; right:0; top:55px; z-index:9999; cursor:pointer;display:none; font-size:16px;}

/*幻灯片*/
.banner{ width:100%; position:relative; z-index:99; border-top:1px solid #DA251D;padding-top:75px;}
.owl-carousel .owl-wrapper:after {content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;}
/* display none until init */
.owl-carousel{display: none;position: relative;width: 100%;-ms-touch-action: pan-y;}
.owl-carousel .owl-wrapper{display: none;position: relative;-webkit-transform: translate3d(0px, 0px, 0px);}
.owl-carousel .owl-wrapper-outer{overflow: hidden;position: relative;width: 100%;}
.owl-carousel .owl-item{float: left;}.owl-carousel .owl-wrapper-outer.autoHeight{-webkit-transition: height 500ms ease-in-out;-moz-transition: height 500ms ease-in-out;-ms-transition: height 500ms ease-in-out;-o-transition: height 500ms ease-in-out;transition: height 500ms ease-in-out;}

.owl-controls .owl-page,.owl-controls .owl-buttons div{cursor: pointer;}
.owl-controls {-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
/* mouse grab icon */
.grabbing {cursor:url(grabbing.png) 8 8, move;}
/* fix */
.owl-carousel  .owl-wrapper,.owl-carousel  .owl-item{-webkit-backface-visibility: hidden;-moz-backface-visibility:    hidden;-ms-backface-visibility:     hidden;-webkit-transform: translate3d(0,0,0); -moz-transform: translate3d(0,0,0); -ms-transform: translate3d(0,0,0);}
#owl-demo { position: relative; width: 100%; margin-left: auto; margin-right: auto;}
#owl-demo .item{ position: relative; display: block;}
#owl-demo img { display: block; width: 100%;}
#owl-demo b { position: absolute; left: 0; bottom: 0; width: 100%; height: 78px; background-color: #000; opacity: .5; filter: alpha(opacity=50);}
#owl-demo span { position: absolute; left: 0; bottom: 37px; width: 100%; font: 18px/32px "微软雅黑","黑体"; color: #fff; text-align: center;}
.owl-pagination { position: absolute; bottom: 5px; width:100%; height: 35px; text-align: center;}
.owl-page { display: inline-block; width:18px; height: 18px; margin: 0 5px; background:url(../images/icon1.png) no-repeat; *display: inline; *zoom: 1;}
.owl-pagination .active { background:url(../images/icon2.png) no-repeat;;}
.owl-buttons { display: none;}
.owl-buttons div { position: absolute; top: 50%; width: 24px; height: 48px; margin-top: -40px; text-indent: -9999px;}
/*.owl-prev { left: 10px; background-image: url(../images/bg17.png);}
.owl-next { right: 10px; background-image: url(../images/bg18.png);}
.owl-prev:hover { background-image: url(../images/bg17.png);}
.owl-next:hover { background-image: url(../images/bg18.png);}*/
@media screen and (max-width: 579px) {.owl-pagination{bottom:0px;height:15px;}}
/*幻灯片*/
.bg_a{ width:100%; background:#F2F2F2;}
.f_nav{ width:1100px; margin:0px auto; padding:40px 0 30px;}
.f_nav li{ width:190px; float:left; padding-right:20px; margin-right:20px; background:url(../images/line.png) no-repeat right top; min-height:158px; font-size:12px;}
.f_nav li.f_ct{ width:240px}
.f_nav li.dz{ background:none; padding-right:0; margin-right:0; width:320px;}
.f_nav li .name b{ display:inline-block; *display:inline; zoom:1; height:40px; line-height:40px; position:relative; font-size:16px;}
.f_nav li .name b i{ display:block; width:48px; height:40px; position:absolute; right:-30px; top:-28px; background:url(../images/icon4.png) no-repeat;}
.f_nav li p{ width:100%; height:25px; line-height:25px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:7px;}
.f_nav li p img,.f_nav li p span{ display:inline-block; *display:inline; zoom:1; height:25px; line-height:25xp; vertical-align:top;}
.f_nav li .share{ width:100%; text-align:center; height:auto;}
.f_nav li .share img{ width:36px; height:35px;}
.f_nav li.dz p{ width:100%; height:auto; white-space:normal; line-height:145%; position:relative; padding-bottom:5px;}
.f_nav li.dz p .map{ display:inline-block; *display:inline; zoom:1; padding-left:50px; background:url(../images/icon7.png) no-repeat left center; height:35px; float:right; line-height:35px; margin-top:-5px;}
.f_nav li.dz .f_s{ width:100%; height:30px; background:#FFF; border-radius:7px; -moz-border-radius:7px; -webkit-border-radius:7px; position:relative; background:#FFF; overflow:hidden;}
.f_nav li.dz .f_s input[type="text"]{ width:220px; height:30px; border:0; background:none; line-height:30px; padding:0 5px; position:absolute; left:0; top:0;}
.f_nav li.dz .f_s input[type="submit"]{ width:70px; height:30px; position:absolute; right:0; top:0; cursor:pointer; background:#FF3333; color:#FFF; text-align:center; line-height:30px; border:0;}
.f_bg{ width:100%; background:#333333; padding:15px 0;}
.bq{ width:1100px; margin:0px auto;}
.bq .bq_l{ width:40%; height:20px; line-height:20px; text-align:left; font-size:12px; color:#FFF; float:left;}
.bq .bq_l a{ color:#FFF;}
.bq .bq_r{ width:50%; height:20px; line-height:20px; text-align:right; float:right; color:#FFF; font-size:12px;}
.banner_s ,.banner_s img{ width:100%; height:auto; vertical-align:top; box-shadow:0 0 0 #FFF;}
.i_line{ width:100%; border-top:1px solid #444; position:relative; height:15px;}
.i_line em{ display:block; width:125px; height:36px; position:absolute; left:50%; top:-1px; z-index:99; margin-left:-62px; background:url(../images/icon3.png) no-repeat;}
.i_ma{ width:100%; margin:0px; text-align:center; padding:20px 0;}
.i_ma li{ display:inline-block;*display:inline; zoom:1; width:300px; text-align:center; vertical-align:top; margin:0 18px;height:350px;border:1px solid #ededed;padding:11px;}
.i_ma .imgbox_bf{width:300px;height:260px;overflow: hidden;}
.i_ma li img{ width:307px; height:260px; vertical-align:top;transition: all 0.6s;}
.i_ma li img:hover{transform: scale(1.4);}
.i_ma li span{display:block;padding-top:20px;}
.i_ma li .title{ width:100%; height:40px; line-height:45px; border-bottom:1px solid #eee;}
.i_ma li .title a{ font-size:16px;font-weight:bold;}
.i_ma li .title a em{ color:#FF3333; padding-right:8px; font-weight:bold;}
.i_ma li .des{ width:100%; margin-top:10px; height:40px; line-height:165%; margin-bottom:8px; overflow:hidden; font-size:12px;}
.i_ma li .more{ width:100%; height:25px; line-height:25px; padding-top:7px; border-top:1px solid #eee;}
.i_ma li .more a{ display:inline-block; *display:inline; zoom:1; font-size:12px; color:#666; padding-left:25px; background:url(../images/icon8.png) no-repeat left center;}
.i_ma li .more a:hover{ color: #1330aa;}
.scd{ width:100%; margin:0px auto; padding:0px 0 50px; text-align:left; font-size:14px; color:#000;}
.scd img{ max-width:100%; height:auto; vertical-align:top;}
.pages{ width:100%; text-align:center; margin-bottom:25px;}
.pages a{ display:inline-block; *display:inline; zoom:1; height:22px; line-height:22px; border:2px solid #eee; margin:0 1px; font-size:12px; color:#555; padding:0 5px;}
.pages a.now{ color:#FFF; font-weight:bold; background:#DA251D; border-color:#DA251D;}
.scd_a{ width:100%; padding:0;}
.scd .scd_l{ width:185px; float:left;}
.scd_l .name{ width:100%; height:50px; line-height:50px; text-align:center; font-size:24px; color:#FFF; background:#DA251D;}
.scd_l .s_nav{ width:183px; border:1px solid #ddd; border-top:0; box-shadow:0 1px 4px #aaa; padding:10px 0;}
.scd_l .s_nav li{ width:100%; height:40px; line-height:40px;}
.scd_l .s_nav li a{ font-size:16px; width:86%; display:block; height:40px; line-height:40px; padding:0 7%;}
.scd .scd_r{ width:900px; float:left; margin-left:4%;}
.scd .scd_r .case{ width:100%;}
.case dl{ width:100%; padding-bottom:15px; margin-bottom:15px; border-bottom:1px solid #ddd;}
.case dl dt,.case dl dt img{ width:170px; height:130px; float:left; vertical-align:top;cursor:pointer;}
.case dl dd{ width:710px; float:right;}
.case dl dd .title{ width:100%; height:40px; line-height:40px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.case dl dd .title a{ font-size:18px; color:#D9251D;cursor:pointer;}
.case dl dd .des{ width:100%; height:45px; font-size:14px; color:#000; line-height:175%; overflow:hidden; margin-bottom:20px;}
.case dl dd .more{ width:100%; text-align:left;}
.case dl dd .more a{ font-size:14px;}
.pro{ width:100%;}
.pro dl{ width:1150px; margin:0px auto; padding:25px 0; margin-bottom:25px; background:#F4F4F4;}
.pro dl dt{ width:420px; height:295px; float:right; margin-right:50px;}
.pro dl dt img{ width:420px; height:295px; vertical-align:top;}
.pro dl dd{ width:610px; float:left; margin-left:50px;}
.pro dl dd .name{ width:100%; height:50px; line-height:50px; padding-top:15px; font-size:18px;}
.pro dl dd .des{ width:100%; height:45px; font-size:14px; line-height:175%; overflow:hidden; margin-bottom:30px; color:#000;}
.pro dl dd .more{ width:100%; margin-bottom:40px;}
.pro dl dd .more a{ display:block; width:110px; height:32px; text-align:center; line-height:32px; font-size:14px; color:#FFF; background:#DA251D;}
.pro dl dd .time{ width:100%; height:25px; line-height:25px; background:url(../images/icon9.png) no-repeat left center;}
.pro dl dd .time span{ font-size:13px; margin-left:25px;}
.contact{ width:100%;}
.contact dt{ width:542px; height:319px; float:right; margin-right:50px;}
.contact dt img{ width:524px; height:319px; vertical-align:top;}
.contact dd{ width:500px; float:left; margin-left:50px;}
.contact dd .c_logo,.contact dd .c_logo img{ width:285px; height:44px; vertical-align:top;}
.contact dd .c_logo{ margin:20px 0 10px;}
.contact dd h6{ width:100%; font-size:18px; color:#474747; margin-bottom:30px; font-weight:normal;}
.contact dd .c_m{ width:100%; font-size:12px; line-height:185%;}
.contact dd .c_m p{ width:100%; margin-bottom:10px;}
.contact dd .c_m img,.contact dd .c_m span{ display:inline-block; *display:inline; zoom:1; vertical-align:top;}
.contact dd .c_m img{ width:19px; height:19px; margin-right:10px;}
.join{position:relative; width:100%; text-align:center;}
.join img{ max-width:100%; height:auto; vertical-align:top;}
.imgbox{
    position:relative;
    width: 307px;
    height: 230px;
    overflow: hidden;
    border:none;
}
.imgbox img{
    cursor: pointer;
    transition: all 0.6s;
}
.imgbox img:hover{
    transform: scale(1.1);
}
.imgbox span{
    position:absolute;
    top:82%;
    color:#fff;
    font-size:24px;
    padding: 2% 26.5%;
    background: #000;
    opacity: .6;
}
.space_hx>span{
    margin-left:15.5%;
    font-weight: bold;
    font-size: 26px;
}
.space_hx>a{
    float:right;
    margin-right:12%;
    cursor:pointer;
    padding-top:7px;
}
.space_hx>a>img{
    vertical-align: middle;
    padding-left:5px;
}
.wrapper>.counter{
    width: 160px;
    height: 160px;
    line-height: 160px;
    margin: 0 auto;
    border: 1px solid #0095fc;
    border-radius: 50%;
}
.wrapper>.counter>h2{
    color:#0095fc;
    font-size: 60px;
}
*{
    margin:0;
    padding:0;
}
.pro{
    width:100%;
    float: left;
    margin-top: 28px;
    position: relative
}
.pro>div {
    width: 307px;
    float: left;
    position: relative;
    overflow: hidden;
    margin-right: 1%;
    margin-top: 1%;
    cursor: pointer;
    transition: all 0.6s;
    -moz-transition: all 0.6s; /* Firefox 4 */
    -webkit-transition: all 0.6s; /* Safari 和 Chrome */
    -o-transition: all 0.6s;
}
.pro>div>div {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    padding: 0px 40px;
    text-align: center;
    background-color: rgba(0, 0, 0, 0.6);
}
.pro>div:hover{
    box-shadow: 5px 10px 15px #c1c1c1,-5px 10px 15px #c1c1c1;
    transform: translateY(-3px);
}
.w1270{
    position:relative;
    width: 1280px;
    margin: 0 auto;
}
.met1_en>div {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 10px;
    height: auto;
    padding-bottom: 20px;
    border: 1px solid #efefef;
    background: #efefef;
    display: none;
}
.met1_ET {
    /*width: 546px;*/
    margin-left: 70px;
    padding-right: 20px;
    margin-top: 40px;
    height: 401px;
    overflow-y: scroll;
}
.close{
    cursor:pointer;
}
.content{
    position:absolute;
    width:100%;
    top:0;
    z-index: 100;
    padding:5% 0;
}
.content>ul{
    float:left;
    margin-left:3%;
}
.content>ul>li{
    font-size: 18px;
    color:#3E4159;
    padding:13px 75px;
    margin-top:3px;
    cursor:pointer;
}
.content>ul>li:hover{
    background-color:#3E4159;
    color:#fff;
}
.content>ul>li:first-child{
    font-size: 22px;
    background-color:#3E4159;
    padding:13px 75px;
    color:#fff;
}
.info{
    position: absolute;
    width: 100%;
    height: 600px;
    top: 0px;
    left: 0px;
    background-color: #fff;
    display:none;
    cursor:default;
    text-align:left;
    padding:10px 0;

}
.info>p{
    line-height:30px;
    padding:10px 50px;
}
.close{
    padding:20px;
    cursor:pointer;
}
.scd{ padding:0;}

#allmap{
    overflow: visible;
    top:0px;
    height:370px;
}
.online{
    width:80%;
    margin: 0 auto;
    margin-top:0px;
}
.online>p{
    font-size: 30px;
    font-weight: bold;
    margin: 3% 5%;
}
.online>form>input{
    margin:1% 5%;
    width:300px;
    height:40px;
    border:none;
    background: #f2f2f2;
}
.online>form>input:nth-child(6){
    width:150px;
    display: inline-block;
    border:none;
    background: #f2f2f2;
}
.online>form>#v_container{
    display: inline-block;
    vertical-align: middle;
    margin-left: -3%;
}
.online>form>input:last-child{
    display: block;
    background: #4f9bff;
    color: #fff;
    border-bottom: 3px solid #ff571f;
    width:200px;
    cursor:pointer;
}
.online>form>textarea{
    margin: 1% 5%;
    display: block;
    border:none;
    background: #f2f2f2;
    width:50%;
    height:80px;
}

.procont {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0%;
    display: none;
    z-index: 999;
    overflow: hidden;
	background: #ffffff90;
}
.procont .loading{ position: absolute; left:48%; top:35%; text-align:center;}
.procontp>p{
    text-align: center;
    font-size: 20px;
    color: #000;
    margin: 35px;
    font-weight: bold;
}
.procontp {
    width: 40%;
    height: 100%;
    position: absolute;
    left: -40%;
    top: 0;
    color: #eee;
    background: #e1e1e1;
    background-size: cover;
    display: none;
	overflow-y:auto;
}
.procontc {
    width: 60%;
    height: 100%;
    position: absolute;
    right:-60%;
    top: 0;
    background: #fff;
    overflow: auto;
    display:none;
}
.met1_ET>div:nth-child(2){
    width: 100px;
    height: 40px;
    line-height: 40px;
    background: #fff;
    border-radius: 5px;
    float: right;
}
.close{
    padding:15px;
    cursor:pointer;
}
.box{
    width:93%;
    /*height:825px;*/
    margin:0 auto;
    overflow:hidden;
}
.box>img{
    width:100%;
}
.main{
    width:85%;
    height:612px;
    margin-top:50px;
    padding:5px 90px;
}
.main>p{
    line-height:30px;
}
.main>ul>li{
    line-height:30px;
}

/**************右侧联系方式图标**************/
.right-flex {
    width: 45px;
    position: fixed;
    top: 50%;
    right: 8px;
    height: 403px;
    margin-top: -201px;
    z-index: 999;
}
.right-flex ul li {
    float: right;
    position: relative;
    width: 60px;
    height: 60px;
    line-height: 55px;
    margin-bottom: 20px;
    background: #ef8515;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    text-align: center;
    overflow: hidden;
    transition: width 0.3s, margin 0.3s;
}
.right-flex ul li a {
    color: #fff;
}
.right-flex ul li p {
    padding-left: 10px;
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    line-height: 45px;
    transition: transform 0.3s;
}
.right-flex ul li .right-ico {
    display: inline-block;
    vertical-align: middle;
    width: 35px;
    height: 35px;
}
.right-flex ul li .right-phone {
    font-size: 20px;
    padding-left: 10px;
}
.right-flex ul li .right-msg {
    font-size: 16px;
    padding-left: 0;
}
.right-flex ul li .ico-call {
    background: url("../images/icon_right_phone.png") no-repeat center;
}
.right-flex ul li .ico-msg {
    background: url("../images/icon_right_msg.png") no-repeat center;
}
.right-flex ul li:hover {
    margin-right: 0;
    width: 270px;
    text-align: left;
    padding-left: 20px;
}
.right-flex ul li:first-child:hover {
    width: 356px;
}

/*---------------------------*/
:root {
    --menu-width: 36.5em; /* Width of menu */
    --items: 5; /* Number of items you have */
    --item-width: calc(var(--menu-width) / var(--items));
}


nav {
    width: var(--menu-width);
    display: flex;
    transform-style: preserve-3d;
    justify-content: space-evenly;
    position: relative;
    z-index: 100;
    margin: 0px auto;
    perspective: 2000px;
    flex-wrap: wrap;
    top: 1em;
}

nav .menu-item {
    color: white;
    font-weight: 600;
    transform-style: preserve-3d;
    flex-grow: 1;
    display: flex;
    flex-basis: var(--item-width);
    box-sizing: border-box;
    padding: 1em 1.5em;
    justify-content: center;
    perspective: 200px;
    letter-spacing: 0.5px;
    min-height: 3.5em;
}

nav .menu_item{
    color:white;
    font-weight: 600;
    display:flex;
    box-sizing: border-box;
    padding:1em 1.5em;
    justify-content: center;
    letter-spacing: 0.5px;
    min-height: 3.5em;
}

nav .menu-text, nav .menu-text a {
    font-size: 1em;
    color: #000;
    text-decoration: none;
    text-shadow: 0 1px 5px rgba(0,0,0,0.1);
    transition: color 0.1s ease-out;
    text-align: center;
}

nav .menu-text a:hover {
    color: rgba(0,0,0,0.5);
}

#sub-menu-holder {
    pointer-events: none;
    color: rgba(0,0,0,0.5);
    font-weight: normal;
    padding: 1em;
    position: absolute;
    transition: opacity 2 ease-out;
    transform: rotateX(-25deg) scale(1);
    transform-origin: 50% 7em 0em;
    opacity: 0;
    box-shadow: 0 2px 7px rgba(0,0,0,0.1), 0 2px 20px rgba(0,0,0,0.3);
    box-sizing: border-box;
    top: 3rem;
    border-radius: 10px;
    background: white;
    display: block;
    height: 300px;
    width: calc(var(--menu-width) * 1.5);
}

#sub-menu-container {
    position: absolute;
    z-index: -1;
    min-width: 100%;
    top:-2em;
    width: 100%;
}

nav .menu-item:hover ~ #sub-menu-container #sub-menu-holder {
    animation: clipPath 0.25s ease-out 1 forwards;
    transition: clip-path 0.25s ease-out, left 0.15s ease-out, height 0.15s ease-out;
    opacity: 1;
    right: auto;
}
nav .menu-item:nth-of-type(2):hover ~ #sub-menu-container #sub-menu-holder{
    clip-path: inset(0 35.75em 0 0 round 10px);
    height: 14em;
}
/*nav .menu-item:nth-of-type(4):hover ~ #sub-menu-container #sub-menu-holder {
    clip-path: inset(0 28.75em 0 0 round 10px);
    height: 14em;
    opacity: 0;
}*/

nav .menu-item:nth-of-type(3):hover ~ #sub-menu-container #sub-menu-holder{
    clip-path: inset(0 15em 0 0 round 10px);
}
nav .menu-item:nth-of-type(4):hover ~ #sub-menu-container #sub-menu-holder {
    clip-path: inset(0 38em 0 0 round 10px);    /*15*/
}

nav .menu-item:nth-of-type(2):hover ~ #sub-menu-container #sub-menu-holder {
    left: calc(-1em + -1px);
}
nav .menu-item:nth-of-type(3):hover ~ #sub-menu-container #sub-menu-holder {
    left: calc(-6.5em + -1px);
    height: 18.75em;
}
nav .menu-item:nth-of-type(4):hover ~ #sub-menu-container #sub-menu-holder {
    left: calc(16.75em + 1px);  /*2*/
    height: 16.5em;              /*24.5*/
}
/*nav .menu-item:nth-of-type(4):hover ~ #sub-menu-container #sub-menu-holder {
    left: calc(19em + 1px);
    opacity:0;
}*/

.menu-item .sub-menu {
    position: absolute;
    top: 3em;
    color: rgba(0,0,0,0.5);
    border-radius: 10px;
    min-width: 8.5em;
    pointer-events: none;
    box-sizing: border-box;
    z-index: 999;
    margin-left: -5em;
    clip-path: inset(0 10em 10em 15em);
    opacity: 0;
    font-weight: initial;
    padding: 1.5em;
    transition: all 0.25s ease-out, opacity 0.25s ease-in, margin-left 0.25s ease-out, clip-path 0.15s ease-out;
}

.menu-item .sub-menu.double {
    min-width: 41.25em;
    height: 18.75em;
    display: grid;
    grid-template-columns: 54% 50%;
}
.menu-item .sub-menu.triple {
    min-width: 41.25em;
    height: 21em;
    display: grid;
    padding: 1.5em 2.5em;
    grid-template-columns: 55% 45%;
}
.menu-item:hover .sub-menu {
    pointer-events: all;
    clip-path: inset(0 0 0 0);
}

.menu-text:after {
    transition: bottom 0.25s ease-out, opacity 0.01s ease-out 0.01s;
    opacity: 0;
    content: '';
    position: absolute;
    pointer-events: none;
    bottom: -5em;
    left: calc(50% - 10px);
    border-color: transparent transparent white transparent;
    border-width: 10px;
    border-style: solid;
}
.menu-item:hover .menu-text:after {
    bottom: 0.5em;
    opacity: 1;
    transition: bottom 0.25s ease-out, opacity 0.01s ease-out 0.15s;
}
.menu-item:hover .sub-menu {
    opacity: 1;
    margin-left: 0;
}

.menu-item:hover ~ #sub-menu-container #sub-menu-holder  {
    transition: transform 0.25s ease-out, opacity 0.25s ease-out, clip-path 0.25s ease-out;
}

@keyframes clipPath {
    0% {
        opacity: 0;
    }
    100% {
        transform: rotateX(0deg) scale(1);
        top: 4.5em;
        opacity: 1;
    }
}

/* Menu specific */
.menu-item .title {
    font-weight: 500;
    color: rgb(44 70 86);
    margin: 0 0 0.25em 0;
}

.menu-item .icon-box * {
    transition: all 0.1s ease-out;
    position: relative;
}
.menu-item .icon-box.space {
    margin-bottom: 1.25em;
}
.menu-item .icon-box.flat {height: 1.5em;margin-bottom: 0.5em;}
.menu-item .icon, .menu-item .text {
    float: left;
    color: #9ea9af;
}


.menu-item .icon-box {
    cursor: pointer;
}
.menu-item .icon-box {
    float: left;
    width: 100%;
    margin: 0;
    height: 4em;
    row-gap: 0;
    line-height: 1em;
}



.menu-item .icon-box:hover .icon, .menu-item .icon-box:hover .title {
    color: rgb(89 110 123);
}


.bottom-container {
    grid-area: 4 / -3 / 4 / 3;
    padding-top: 1.5em;
    color: #3a5260;
    font-weight: 500;
}

.top-container {
    grid-area: 1 / -3 / 1 / 3;
    margin: 0 0 2em 0;
}

.bottom-container a {
    float: right;
    background: linear-gradient(90deg, #8ea4b166, #a3b5bf6b);
    padding: 0.5em 1em;
    border-radius: 100px;
    position: absolute;
    color: #2c4655bf;
    font-weight: bold;
    text-decoration: none;
    right: 1.5em;
    bottom: 1.5em;
}

.bottom-container a:hover {
    background: linear-gradient(90deg, #8ea4b136, #a3b5bf33);
}

.sub-menu h3 {
    font-size: 1em;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color:#1330aa;
    margin: 0.75em 0;
}

.sub-menu .box a {

    width: 100%;
    float: left;
    font-size: 1em;
    line-height: 2.5em;
    color: #000;
    text-decoration: none;
}

.sub-menu .box a:hover {
    color: rgb(44 70 86);
}

.box {
    margin: 0 0 3em 0;
}

.icon.big i {
    font-size: 1.25em;
    top: 0.2em;
}
nav .menu-item.highlight:hover ~ #sub-menu-container #sub-menu-holder #sub-menu-bottom { opacity: 1; }


.solution_detail{
    width:100%;
    min-width: 1132px;
    text-align: left;
    padding:0 0 14px;
}
.solution_detail .main-content{
    position:relative;
    background:#fff;
    padding:0 16px 10px;
    border-radius: 5px;
}
@media screen and (min-width: 1900px){
    .main-content {
        width: 1440px;
    }
}
    @media screen and (min-width: 1400px) {
        .main-content {
            width: 1200px;
        }
    }
        @media screen and (min-width: 1200px) {
            .main-content {
                width: 1200px;
            }
        }
            .main-content {
                position: relative;
                width: 1440px;
                margin: 4rem auto;
            }
.solution_detail p{
    font-size: 1rem;
    line-height: 30px;
    padding:0;
    margin:0 0 20px;
}
/*-----------------------------*/