@charset "utf-8";


/* !main
---------------------------------------------------------- */
.main {
	position: relative;
	top: 95px;
	height: 600px;
	background: url("../img/HERO05.png@2x.png") ;
	background-position: 30%;
	background-size: cover;
}
.mainimg img {
	width: 100%;
}
.maincont {
	position: absolute;
	left: 0;
	top: 50%;
	width: 100%;
	transform: translateY(-55%);
	z-index: 2;
	padding:0 60px;
}
.mainbox {
	max-width: 1030px;
	margin: 0 auto;
	overflow: hidden;
}
.maininner {
	float: right;
}
.maintit {
	background: #002162;
	color: #fff;
	font-size: 25px;
	padding: 5px 10px;
	text-align: center;
}
.maintxt {
	margin-top: 25px;
	font-size: 50px;
	font-weight: 700;
	color: #002162;
	line-height: 1.4;
}
/*@media screen and (max-width: 1080px) {
.main {
	background: url("../img/bg_mainimg.png") center center no-repeat;
	background-size: cover;
	padding: 240px 60px 180px;
}
.mainimg {
	display: none;
}
.maincont {
	position: inherit;
	left: inherit;
	top: inherit;
	transform: translateY(0);
}
.maintit {
	font-size: 24px;
}
.maintxt {
	margin-top: 20px;
	font-size: 38px;
}
}*/

@media screen and (max-width: 768px) {
.main {
	padding: 150px 40px;
	top: 60px;
}

.mainbox{
	max-width: 500px;
}
.maininner {
	float: none;
}
.maintit {
	font-size: 20px;
}
.maintxt {
	margin-top: 10px;
	font-size: 40px;
}
}

@media screen and (max-width: 425px) {
	.maincont{
		padding: 0 20px;
	}

	.mainimgbtn{
		width: 100%;
	}

	.maintxt{
		font-size: 30px;
	}

}

.news {
	max-width: 1030px;
	margin: 0 auto;
	transform: translateY(-50%);
	position: relative;
	z-index: 2;
	top: 95px;
}
.newsin {
	display: table;
	width: 100%;
}
.newsin .newstit {
	display: table-cell;
	width: 15%;
	text-align: center;
	font-size: 18px;
	color: #fff;
	vertical-align: middle;
	background: transparent linear-gradient(90deg, #547ABC 0%, #7D9DD5 100%) 0% 0% no-repeat padding-box;
}
.newsin .newscont{
	display: flex;
	align-items: center;
	background-color: #fff;
	padding: 15px 40px 15px 20px;
}
.newsin .newscont li {
	display: flex;
	align-items: center;
	color: #002162;
	margin-right: 30px;
}

.newstxt {
	position: relative;
	display: flex;
	align-items: center;
	color: #002162;
	font-size: 16px;
	transition: all 0.3s;
}

.newstxt::after{
	position: absolute;
	bottom: -5px;
	left: 0;
	content: '';
	width: 0;
	height: 1px;
	background-color: #002162;
	transition: all 0.3s;
}

.newstxt:hover::after{
	width: 100%;
}

.newstxt:hover{
	opacity: 0.7;
}

.newsin .newscata{
	color:#fff;
	display: inline-block;
	background: #ea884f;
	padding: 3px 20px;
	margin-right: 30px;
}

.fv-subtext{
	color: #002162;
	font-size: 21px;
	margin-top: 10px;
}

.fv-btn{
	text-align: center;
	line-height: 50px;
	height: 50px;
	width: 50%;
	float: right;
	font-size: 18px;
	margin-top: 20px;
}


@media screen and (max-width: 1080px) {
.news {
	padding: 0 60px;
	max-width: none;
	position: relative;
}
.newsin {
	display: table;
	width: 100%;
}
.newsin .newstit {
	width: 12%;
}
.newsin .newscont li a {
	padding-right: 50px;
}
}


@media screen and (max-width: 768px) {
.news {
	transform: translateY(0);
	padding: 0;
	top: 60px;
}
.newsin {
	display: block;
}
.newsin .newstit {
	display: block;
	width: auto;
	text-align: left;
	font-size: 14px;
	padding: 10px 20px;
}
.newsin .newscont {
	display: block;
	padding: 15px 20px;
}
.newsin .newscont li a {
	padding-right: 30px;
	font-size: 14px;
}
.newsin .newstxt {
	font-size: 14px;
}
.newsin .newscata {
	padding: 5px 15px;
}

.fw-normal{
	font-weight: normal;
}

.newsin .newscont{
	display: block;
}

.newsarea{
	margin-top: 10px;
}
.fv-subtext{
	color: #002162;
	font-size: 16px;
	text-align: center;
}
.fv-btn{
	width: 100%;
	float: right;
}

}




/* !video
---------------------------------------------------------- */
.video{
	text-align: center;
	margin-top: 30px;
	padding: 0 60px;
	
}
.video video{
	max-width: 800px;
	width: 100%;
	margin: 0 auto 100px;
	cursor: pointer;
	outline: none;
}

@media screen and (max-width: 767px) {
	.video-text{
		margin-bottom: 0 !important;
	}
}

@media screen and (max-width: 425px) {
	.video{
		padding: 0;
		margin: 0;
	}
	.video video{
		margin:0;
	}
}

/* !support
---------------------------------------------------------- */
.support {
	max-width: 1070px;
	margin: 0px auto;
	padding-top: 150px;
	position: relative;
	top: 95px;
}
/*.support .hdl {
	margin-bottom: 100px;
}*/
.support .supportlist {
	margin: 0 0 0 -75px;
}
.support .supportlist li {
	float: left;
	width: 25%;
	padding-left: 75px;
}
.support .supporttxt {
	font-size: 16px;
	margin-bottom: 20px;
}
.support .supportico {
	width: 160px;
	margin: 0 auto;
	display: table;
}
.support .supportico span {
	display: table-cell;
	width: 100%;
	height: 160px;
	vertical-align: middle;
	text-align: center;
	background: #547abc;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	box-shadow: 0px 10px 20px #547abc33;
}
.support .supportimg {
	display: none;
}

.visibleTab{
	display: none;
}


@media screen and (max-width: 1080px) {

.support .supporttxt{
	margin-top: 20px;
}
.support .supportimg {
	display: block;
	margin-bottom: 90px;
}
.support .supportimg img {
	width: 100%;
}
.support .supportbox {
	padding: 0 60px;
}
.support .supportlist {
	margin: -60px 0 0 -75px;
}
.support .supportlist li {
	width: 50%;
	margin-top: 60px;
}

.visiblePC{
	display: none;
}

.visibleTab{
	display: block;
}
}


@media screen and (max-width: 767px) {
.support {
	padding: 0 20px;
}

.support .supporttxt{
	text-align: center;
}
.support .hdl {
	padding: 0 20px;
}
.support .supportlist {
	margin: 0;
}
.support .supportbox {
	padding: 0 40px;
}
.support .supportlist li {
	float: none;
	width: auto;
	padding-left: 0;
	margin-top: 0;
}
.support .supportlist li+li {
	margin-top: 60px;
}
.support .supportico {
	width: 136px;
}
.support .supportico span {
	height: 136px;
}
.support video{
	height: 300px;
}

.visibleTab{
	display: none;
}



}


/* !package
---------------------------------------------------------- */
.package {
	margin-top: 200px;
}
.package .hdl {
	margin-bottom: 65px;
}
.package .hdm {
	margin-bottom: 40px;
}
.package table {
	width: 100%;
}
.package table th,.package table td {
	vertical-align: middle;
	font-size: 16px;
	padding: 20px;
	border-bottom: 10px #f4f5f7 solid;
	position: relative;
}

.b-c{
	border-bottom: 10px #fff solid!important;
}

.package table th {
	text-align: center;
	color: #fff;
	font-size: 20px;
}
.package table td {
	border-right: 1px #547abc solid;
}
.package .bottomnone {
	border-bottom: none !important;
}
.package .rightnone {
	border-right: none !important;
}
.package table td.packagedown:before {
	position: absolute;
	content: "";
	left: 50%;
	bottom: 0;
	transform: translate(-50%,50%);
	border-top: 18px solid #547abc;
	border-bottom: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	z-index: 2;
}
.package .crevice {
	padding: 5px 20px;
}
.package .bgyellow {
	background: #ffe154;
	color: #555;
	font-size: 16px;
	font-weight: 700;
	width: 15%;
}
.package .bgblue01 {
	background: #547abc;
	width: 28.3333%;
}
.package .bgblue01:before {
	position: absolute;
	content: "";
	left: 100%;
	top:50%;
	transform:translateY(-50%);
	border-left:20px #547abc solid;
	border-right:0;
	border-top:10px solid transparent;
	border-bottom:10px solid transparent;
	z-index: 2;
}
.package .bgblue02 {
	background: #064d8f;
	width: 28.3333%;
}

.example-02{
	background: #3D6095!important;
}


.example-02:before {
	position: absolute;
	content: "";
	left: 100%;
	top:50%;
	transform:translateY(-50%);
	border-left:20px #3D6095 solid;
	border-right:0;
	border-top:10px solid transparent;
	border-bottom:10px solid transparent;
	z-index: 2;
}
.package .bgblue03 {
	background: #325381;
	width: 28.3333%;
}

.example-03{
	background: #27466D!important;
}

.example-03:before{
	border-left:20px #27466D solid!important;
}
.package .bgblue03:before {
	position: absolute;
	content: "";
	left: 100%;
	top:50%;
	transform:translateY(-50%);
	border-left:20px #325381 solid;
	border-right:0;
	border-top:10px solid transparent;
	border-bottom:10px solid transparent;
	z-index: 2;
}
.package .bgblue04 {
	background: #102c46;
}
.package .bggreen01 {
	background: #4ca491;
	font-size: 16px;
}
.package .bggreen02 {
	background: #2c8370;
	font-size: 16px;
}
.package .borblack {
	border-right: 1px #707070 solid;
}
.package .packagedot {
	text-align: center;
	margin: 0 30px;
}
.package .packagedot ul {
	display: inline-block;
}
.package .packagedot ul li {
	text-align: left;
	padding-left: 20px;
	position: relative;
}
.package .packagedot ul li+li {
	margin-top: 10px;
}
.package .packagedot ul li:before {
	position: absolute;
	content: "";
	background: #547abc;
	width: 10px;
	height: 10px;
	left: 0;
	top: 8px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	z-index: 2;
}
.package .packagetxt {
	margin: 0 20px;
	text-align: center;
}
.package .packagetxt span {
	display: inline-block;
	text-align: left;
}
.package .packagetxt span b {
	display: inline;
	font-weight: 700;
	text-align: left;
	 background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #c3d0e5 0%) repeat scroll 0 0;
}
.package .packageimg {
	text-align: center;
}
.package .appliarea {
	padding: 0;
	border-right: none;
}
.package .application {
	margin-top: 40px;
	padding: 15px 20px;
	background: #064d8f;
	display: flex;
	align-items: center;
	position: relative;
}
.package .applibox {
	width: 50%;
	padding: 0 30px;
	display: flex;
	align-items: center;
}
.package .appliimg {
	display: table;
	flex-shrink: 0;
}
.package .appliimg span {
	display: table-cell;
	width: 90px;
	height: 90px;
	text-align: center;
	vertical-align: middle;
	background: #fff;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
}
.package .applitxt {
	font-size: 18px;
	color: #fff;
	font-weight: 700;
	padding-left: 35px;
}
.package .appliarrow01 {
	position: absolute;
	left: 16.6666%;
	bottom: 100%;
	border-top: 0;
	transform: translateX(-50%);
	border-bottom: 18px #064d8f solid;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	z-index: 2;
}
.package .appliarrow02 {
	position: absolute;
	left: 49.9999%;
	bottom: 100%;
	border-top: 0;
	transform: translateX(-50%);
	border-bottom: 18px #064d8f solid;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	z-index: 2;
}
.package .appliarrow03 {
	position: absolute;
	left: 83.3333%;
	bottom: 100%;
	border-top: 0;
	transform: translateX(-50%);
	border-bottom: 18px #064d8f solid;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	z-index: 2;
}


@media screen and (max-width: 1080px) {
.package table th,.package table td {
	font-size: 14px;
	padding: 15px;
}
.package table th {
	font-size: 16px;
}
.package .crevice {
	padding: 5px 20px;
}
.package .bgyellow {
	font-size: 14px;
	width: 7%;
	line-height: 1.2;
}
.package .bgblue01 {
	width: 31%;
}
.package .bgblue01:before {
	position: absolute;
	content: "";
	left: 100%;
	top:50%;
	transform:translateY(-50%);
	border-left:20px #547abc solid;
	border-right:0;
	border-top:10px solid transparent;
	border-bottom:10px solid transparent;
	z-index: 2;
}
.package .bgblue02 {
	width: 31%;
}
.package .bgblue03 {
	width: 31%;
}
.package .packagedot {
	margin: 0;
}
.package .packagedot ul li:before {
	top: 5px;
}
.package .packagedot ul {
	display: inline-block;
}
.package .packagetxt {
	margin: 0;
}
.package .application {
	padding: 10px 50px;
	display: block;
}
.package .applibox {
	width: auto;
	padding: 5px 0;
}
.package .appliimg span {
	width: 77px;
	height: 77px;
}
.package .appliimg span img {
	width: 42px;
}
.package .applitxt {
	padding-left: 25px;
}
}


@media screen and (max-width: 767px) {
.package table th,.package table td {
	font-size: 8px;
	padding: 10px 5px;
	border-bottom: 5px #f4f5f7 solid;
}
.package table th {
	font-size: 9px;
}
.package table td.packagedown:before {
	position: absolute;
	content: "";
	left: 50%;
	bottom: 0;
	transform: translate(-50%,50%);
	border-top: 8px solid #547abc;
	border-bottom: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	z-index: 2;
}
.package .packageimg img {
	max-width: 45px;
}
.package .crevice {
	padding: 2px 5px;
}
.package .bgyellow {
	font-size: 7px;
}
.package .bgblue01 {
	width: 31%;
}
.package .bgblue01:before {
	position: absolute;
	content: "";
	left: 100%;
	top:50%;
	transform:translateY(-50%);
	border-left:10px #547abc solid;
	border-right:0;
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
	z-index: 2;
}
.package .bggreen01 {
	font-size: 8px;
}
.package .bggreen02 {
	font-size: 8px;
}

.package .bgblue03:before {
	border-left:10px #325381 solid;
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
	z-index: 2;
}
.package .packagedot ul li {
	padding-left: 10px;
}
.package .packagedot ul li+li {
	margin-top: 5px;
}
.package .packagedot ul li:before {
	width: 6px;
	height: 6px;
	top: 5px;
}
.package .application {
	padding: 5px 10px;
	margin-top: 20px;
}
.package .appliimg span {
	width: 40px;
	height: 40px;
}
.package .appliimg span img {
	width: 22px;
}
.package .applitxt {
	font-size: 12px;
	padding-left: 15px;
}
.package .appliarrow01 {
	border-bottom: 9px #064d8f solid;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	z-index: 2;
}
.package .appliarrow02 {
	border-bottom: 9px #064d8f solid;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	z-index: 2;
}
.package .appliarrow03 {
	border-bottom: 9px #064d8f solid;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	z-index: 2;
}
}

/*!cta
---------------------------------------------------------- */
.cta{
	text-align: center;
	background-color: #547ABC;
	color: #fff;
	font-size: 22px;
	font-weight: 500;
	padding: 30px 0 10px 0;
	margin: 50px 0 50px 0;
}

@media screen and (max-width: 767px){
	.cta{
		font-size: 18px;
	}
}

@media screen and (max-width: 425px) {
	.cta{
		padding: 30px 20px 10px 20px;
	}
}

/*!contact
---------------------------------------------------------- */

.contact{
	width: 100%;
	height: 200px;
	margin-top: 60px;
	background-color: #547ABC;
}
.con-text{
	font-size: 24px;
	color: #fff;
	font-weight: bold;
	text-align: center;
	line-height: 40px;
	width: 35%;
	padding-top: 15px;
	margin: 0 auto;
}

.con-btn{
	text-align: center;
	background-color: #E2C50A;
	height: 70px;
	width: 250px;
	margin: 0 auto;
	margin-top: 20px;
	box-shadow: 0px 3px 0px #C1A7004D;

}

.con-btn:hover{
	transform: translateY(3px);
	box-shadow: none;
	background-color: #FFE154;
}

.con-btn a{
	line-height: 70px;
	font-size: 18px;
}


@media screen and (max-width: 1080px) {
	.con-text{
		width: 80%;
	}
}


@media screen and (max-width: 767px) {
	.con-text{
		width: 88%;
		font-size: 13px;
	}
}




/* !service
---------------------------------------------------------- */
#service {
	padding: 90px 20% 0 0;
	position: relative;
	margin-top: 100px;
}
#service .serviceimg {
	position: absolute;
	right: 0;
	top: 0;
	width: 62%;
	z-index: 1;
}
#service .servicebg {
	background:rgba(6,77,143,0.2);
	padding: 100px 30% 4% 20%;
}
#service .servicebox {
	background: #fff;
	box-shadow: 10px 10px 20px rgba(84, 122, 188, 0.15);
	transform: translateY(100px);
	padding: 70px 80px 160px;
	position: relative;
	z-index: 2;
	width: 120%;
	max-width: 750px;
    height: 750px;
    margin: 0 auto;
}
#service .servicetit {
	font-weight: 700;
	font-size: 30px;
	color: #002162;
	padding: 35px 80px 35px 0;
	margin-bottom: 70px;
	position: relative;
}
#service .servicetit:before {
	position: absolute;
	content: "";
	background: url("../img/bg_service.svg") 0 0 no-repeat;
	width: 385px;
	height: 117px;
	left: 0;
	top: 0;
	opacity: 0.25;
	z-index: 1;
}
#service .servicetit:after {
	position: absolute;
	content: "";
	left: 0;
	bottom: 0;
	width: 100px;
	height: 5px;
	background: transparent linear-gradient(270deg, #547abc 0%, #002162 100%) 0% 0% no-repeat padding-box;
	margin-bottom: -10px;
	z-index: 2;
}
#service .servicecont {
	line-height: 2;
}
#service .servicecont li+li {
	margin-top: 30px;
}
#service .servicename {
	position: absolute;
	right: -130px;
	bottom: 20px;
	width: 433px;
	z-index: 2;
}


@media screen and (max-width: 1080px) {
#service {
	padding: 60px 0 0 0;
}
#service .serviceimg {
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	padding-left: 60px;
}
#service .servicebg {
	padding: 320px 20% 0 60px;
}
#service .servicebox {
	box-shadow: 10px 10px 20px rgba(84, 122, 188, 0.15);
	transform: translateY(60px);
	padding: 60px 70px 60px;
	height: 650px;
	width: 100%;
}
#service .servicetit {
	font-size: 25px;
	padding: 35px 110px 35px 0;
	margin-bottom: 40px;
}
#service .servicename {
	right: -100px;
	width: 300px;
}
#service .servicecont li+li {
	margin-top: 0;
}
}


@media screen and (max-width: 767px) {
#service {

}
#service .serviceimg {
	right: 0;
	top: 0;
	width: 100%;
	padding-left: 30px;
}
#service .servicebg {
	padding: 150px 0 0;
}
#service .servicebox {
	transform: translateY(0);
	padding: 30px 30px 40px;
	height: 600px;
}
#service .servicetit {
	font-size: 20px;
	padding: 25px 0;
	margin-bottom: 40px;
}
#service .servicetit:before {
	width: 262px;
	height: 80px;
}
#service .servicetit:after {
	width: 60px;
	height: 4px;
}
#service .servicename {
	position: absolute;
	right: 10px;
	bottom: -20px;
	width: 300px;
}
#service .servicecont{
	font-size: 14px;
}
}



/* !feature
---------------------------------------------------------- */
.feature {
	max-width: 1030px;
	margin: 50px auto 0;
	padding-top: 150px;
}
.feature .hdm {
	margin-bottom: 50px;
}
.featurelist {
	overflow: hidden;
	margin: 0 0 0 -20px;
}
.featurelist li {
	float: left;
	width: 33.3333%;
	padding-left: 20px;
	color: #fff;
}
.featurelist .featurein {
	position: relative;
}
.featurelist .featurein:before {
	position: absolute;
	content: "";
	left: 50%;
	top: 0;
	width: 5px;
	height: 100%;
	margin-left: -3px;
	z-index: 1;
}
.featurelist .feature01:before {
	background: #547abc;
}
.featurelist .feature02:before {
	background: #325381;
}
.featurelist .feature03:before {
	background: #102C46;
}
.featurelist .featurebox {
	padding: 35px 30px;
	position: relative;
	z-index: 2;
}
.featurelist .feature01 .featurebox {
	background: #547abc;
}
.featurelist .feature02 .featurebox {
	background: #325381;
}
.featurelist .feature03 .featurebox {
	background: #102C46;
}
.featurelist .featurestep {
	margin-top: 30px;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	text-align: center;
	line-height: 60px;
	position: relative;
	z-index: 2;
}
.featurelist .featurestep b {
	font-weight: 700;
}
.featurelist .feature01 .featurestep {
	background: #547abc;
}
.featurelist .feature02 .featurestep {
	background: #325381;
}
.featurelist .feature03 .featurestep {
	background: #102C46;
}
.featurelist .featurecap {
	text-align: center;
	font-size: 16px;
	margin-bottom: 20px;
}
.featurelist .featuretit {
	font-weight: 700;
	font-size: 20px;
	text-align: center;
	margin-bottom: 25px;
}
.featurelist .featuretxt {
	line-height: 1.8;
	margin-bottom: 15px;
}
.featurelist .featureball {
	display: table;
	width: 114px;
	margin: 0 auto;
}
.featurelist .featureball span {
	display: table-cell;
	width: 100%;
	height: 114px;
	vertical-align: middle;
	text-align: center;
	background: #fff;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
}
.featurelist .feature02 .featurestep span {
	position: absolute;
	right: 100%;
	top: 0;
	background: #325381;
	width: 20px;
	height: 60px;
	z-index: 2;
}
.featurelist .feature02 .featurestep span:before {
	position: absolute;
	content: "";
	left: 0;
	top: 0;
	border-left:20px #547abc solid;
	border-right:0;
	border-top:30px solid transparent;
	border-bottom:30px solid transparent;
	z-index: 2;
}
.featurelist .feature03 .featurestep span {
	position: absolute;
	right: 100%;
	top: 0;
	background: #102C46;
	width: 20px;
	height: 60px;
	z-index: 2;
}
.featurelist .feature03 .featurestep span:before {
	position: absolute;
	content: "";
	left: 0;
	top: 0;
	border-left:20px #325381 solid;
	border-right:0;
	border-top:30px solid transparent;
	border-bottom:30px solid transparent;
	z-index: 2;
}


@media screen and (max-width: 1080px) {
.feature {
	max-width: none;
	margin: 150px auto 0;
	padding: 150px 60px;
}
.feature .hdm {
	margin-bottom: 50px;
}
.featurelist {
	margin: 0;
}
.featurelist li {
	float: none;
	width: auto;
	padding-left: 0;
}
.featurelist li+li {
	margin-top: 20px;
}
.featurelist .featurein {
	position: relative;
	padding-left: 170px;
}
.featurelist .featurein:before {
	position: absolute;
	content: "";
	left: 0;
	top: 50%;
	width: 100%;
	height: 5px;
	margin: -3px 0 0;
}
.featurelist .featurebox {
	padding: 35px 30px 20px;
}
.featurelist .featurestep {
	position: absolute;
	left: 0;
	top: 0;
	width: 140px;
	height: 100%;
	display: table;
	margin: 0;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
}
.featurelist .featurestep b {
	display: table-cell;
	width: 100%;
	height: 100%;
	text-align: center;
	vertical-align: middle;
}
.featurelist .featureball {
	width: 96px;
}
.featurelist .featureball span {
	width: 100%;
	height: 96px;
}
.featurelist .feature02 .featurestep span {
	position: absolute;
	right: inherit;
	top: -20px;
	left: 0;
	width: 140px;
	height: 20px;
}
.featurelist .feature02 .featurestep span:before {
	position: absolute;
	content: "";
	left: 0;
	top:0;
	border-top: 20px solid #547abc;
	border-bottom: 0;
	border-left: 70px solid transparent;
	border-right: 70px solid transparent;
	z-index: 2;
}
.featurelist .feature03 .featurestep span {
	position: absolute;
	right: inherit;
	top: -20px;
	left: 0;
	width: 140px;
	height: 20px;
}
.featurelist .feature03 .featurestep span:before {
	position: absolute;
	content: "";
	left: 0;
	top:0;
	border-top: 20px solid #325381;
	border-bottom: 0;
	border-left: 70px solid transparent;
	border-right: 70px solid transparent;
	z-index: 2;
}
}


@media screen and (max-width: 767px) {
.feature {
	margin: 50px auto 0;
	padding: 0 20px;
}
.featurelist .featurein {
	position: relative;
	padding-left: 60px;
}
.featurelist .featurebox {
	padding: 25px 20px;
}
.featurelist .featurestep {
	width: 50px;
	font-size: 12px;
}
.featurelist .featurestep b {
	display: table-cell;
	width: 100%;
	height: 100%;
	text-align: center;
	vertical-align: middle;
	line-height: 1.5;
}
.featurelist .featureball {
	width: 96px;
}
.featurelist .feature02 .featurestep span {
	width: 50px;
}
.featurelist .feature02 .featurestep span:before {
	border-left: 25px solid transparent;
	border-right: 25px solid transparent;
}
.featurelist .feature03 .featurestep span {
	width: 50px;
}
.featurelist .feature03 .featurestep span:before {
	border-left: 25px solid transparent;
	border-right: 25px solid transparent;
}
.featurelist .featurecap {
	font-size: 12px;
	margin-bottom: 15px;
}
.featurelist .featuretit {
	font-size: 16px;
	margin-bottom: 20px;
}
.featurelist .featuretxt {
	font-size: 12px;
	margin-bottom: 20px;
}
}



/* !problem
---------------------------------------------------------- */
.problem {
	margin-top: 100px;
	background: #e2c50a;
	padding: 20px 40px;
	color: #3c3500;
}
.problem .problemtit {
	text-align: center;
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 30px;
}

.problem .problemcont {
	max-width: 700px;
	margin: 0 auto 15px;
	display: flex;
	align-items: center;
	font-weight: normal;
	line-height: 1.8;
}
.problem .problemico {
	padding-right: 20px;
}
.report{
	max-width: 180%;
}
.problem .problemtxt {
	font-size: 20px;
	margin-left: 20px;
}

.problem strong{
	border-bottom: 4px #C92020 solid;

}
.size1{
	font-size: 14px;
}
.problem .size2{
	display: block;
	font-size: 14px;
	line-height: 1.3;
	margin-top: 10px;
}
.problem .problembtn {
	max-width: 250px;
	margin: 0 auto;
}
.op2 {
	position: relative;
	display:inline-block;
	width: 100%;
	align-items: center;
	height: 60px;
	line-height: 60px;
	font-size: 18px;
	background: #fff;
	text-align: center;
	z-index: 0;
}

.op2:hover{
	color: #fff;
}
.op2::before{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	content: '';
	background: #333;
	transform-origin: right top;
	transform: scale(0,1);
	transition: transform .3s;
}

.op2:hover::before{
	transform-origin: left top;
	transform: scale(1,1);
}



@media screen and (max-width: 1080px) {
.problem .problemtxt{
	line-height:2;
}
.problem .problembtn{
	margin-top: 30px;
}
}

@media screen and (max-width: 767px) {
.problem {
	margin-top: 50px;
	padding: 20px;
}
.problem .problemtit {
	font-size: 16px;
	margin-bottom: 25px;
}
.problem .problemico {
	padding-right: 10px;
	flex-shrink: 0;
}
.problem .problemcont {
	margin: 0 auto 20px;
}
.problem .problemtxt {
	font-size: 16px;
}
.problem .problembtn {
	max-width: 300px;
	margin: 0 auto;
}
.problem .problembtn .btntxt {
	font-size: 16px;
}

.problem .size{
	font-size: 12px;
}

}

/* !Annotation
---------------------------------------------------------- */
.Annotation{
	font-size: 14px;
	margin-top: 20px;
	line-height: 1.8;
	font-weight: 400;
}


/* !solution
---------------------------------------------------------- */
.solution {
	padding: 90px 0 0 20%;
	position: relative;
	margin-top: 100px;
}
.solution .solutionimg {
	position: absolute;
	left: 0;
	top: 0;
	width: 62%;
	z-index: 1;
}
.solution .solutionbg {
	background:rgba(6,77,143,0.2);
	padding: 100px 20% 4% 30%;
}
.solution .solutionbox {
	background: #fff;
	box-shadow: 10px 10px 20px rgba(84, 122, 188, 0.15);
	transform: translateY(100px);
	padding: 70px 80px 200px;
	position: relative;
	z-index: 2;
	width: 120%;
	max-width: 755px;
	height: 755px;
	margin: 0 auto;
}
.solution .solutiontit {
	font-weight: 700;
	font-size: 30px;
	color: #002162;
	padding: 35px 80px 35px 0;
	margin-bottom: 70px;
	position: relative;
}
.solution .solutiontit:before {
	position: absolute;
	content: "";
	background: url("../img/bg_service.svg") 0 0 no-repeat;
	width: 385px;
	height: 117px;
	left: 0;
	top: 0;
	opacity: 0.25;
	z-index: 1;
}
.solution .solutiontit:after {
	position: absolute;
	content: "";
	left: 0;
	bottom: 0;
	width: 100px;
	height: 5px;
	background: transparent linear-gradient(270deg, #547abc 0%, #002162 100%) 0% 0% no-repeat padding-box;
	margin-bottom: -10px;
	z-index: 2;
}
.solution .solutioncont {
	line-height: 1.8;
}
.solution .solutioncont li+li {
	margin-top: 30px;
}
.solution .solutionname {
	position: absolute;
	right: -110px;
	bottom: 40px;
	width: 570px;
	z-index: 2;
}


@media screen and (max-width: 1080px) {
.solution {
	padding: 60px 0 0 0;
}
.solution .solutionimg {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	padding-right: 60px;
}
.solution .solutionbg {
	padding:320px 130px 0 8%;
}
.solution .solutionbox {
	box-shadow: 10px 10px 20px rgba(84, 122, 188, 0.15);
	transform: translateY(60px);
	padding: 60px 70px 150px;
	height: 600px;
	width: 100%;
}
.solution .solutiontit {
	font-size: 25px;
	padding: 35px 0;
	margin-bottom: 40px;
}
.solution .solutionname {
	right: -50px;
	width: 475px;
}
.solution .solutioncont li+li {
	margin-top: 0;
}
}


@media screen and (max-width: 767px) {
.solution {
	padding: 40px 0 0;
	margin-top: 150px;
}
.solution .solutionimg {
	right: 0;
	top: 0;
	width: 100%;
	padding-right: 30px;
}
.solution .solutionbg {
	padding: 150px 0 0;
}
.solution .solutionbox {
	transform: translateY(0);
	padding: 30px 30px 60px;
	height: 500px;
}
.solution .solutiontit {
	font-size: 20px;
	padding: 25px 0;
	margin-bottom: 40px;
}
.solution .solutiontit:before {
	width: 262px;
	height: 80px;
}
.solution .solutiontit:after {
	width: 60px;
	height: 4px;
}
.solution .solutionname {
	position: absolute;
	right: 10px;
	bottom: -20px;
	width: 360px;
}
.solution .solutioncont{
	font-size: 14px;
}
}

/* !solution features
---------------------------------------------------------- */
.solufeatit {
	max-width: 400px;
	margin: 0 auto 50px;
	font-size: 16px;
	font-weight: 700;
	padding: 15px 0;
	color: #002162;
	text-align: center;
	border-bottom: 1px #002162 solid;
	border-top: 1px #002162 solid;
}
.pointin {
	display: flex;
	justify-content: center;
	margin-bottom: 50px;
}
.pointin li+li {
	padding-left: 20px;
}
.pointin .pointbox {
	width: 150px;
	height: 150px;
	border: 7px solid #002162;
	background: #fff;
	font-size: 22px;
	font-weight: 700;
	color: #002162;
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	position: relative;
}
.pointin .pointico {
	position: absolute;
	left: -7px;
	top: -7px;
	z-index: 2;
}
.pointin .pointico span {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	background: #ffe154;
	width: 45px;
	height: 45px;
	font-weight: 700;
	font-size: 10px;
	color: #002162;
	z-index: 2;
}
.pointin .pointico span b {
	display: block;
	font-size: 14px;
	font-weight: 700;
}

.solufealist {
	overflow: hidden;
	margin: 0 0 0 -70px;
}
.solufealist li {
	float: left;
	width: 50%;
	padding-left: 70px;
}
.solufealist .solufeain {
	background: #064d8f;
	color: #fff;
	padding: 35px 70px;
}
.solufealist .solufeacap {
	text-align: center;
	font-size: 16px;
	margin-bottom: 20px;
}
.solufealist .solufeahd {
	text-align: center;
	font-weight: 700;
	font-size: 20px;
	margin-bottom: 25px;
}
.solufealist .solufeatxt {
	margin-bottom: 15px;
	line-height: 1.8;
}
.solufealist .solufeaball {
	display: table;
	width: 114px;
	margin: 0 auto;
}
.solufealist .solufeaball span {
	display: table-cell;
	width: 100%;
	height: 114px;
	vertical-align: middle;
	text-align: center;
	background: #fff;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
}
.solufeaarea {
	position: relative;
	margin-bottom: 50px;
}
.solufeanote {
	position: relative;
}
.solufeanote:before {
	position: absolute;
	content: "";
	left: 20%;
	bottom: 100%;
	border-top: 0;
	border-bottom: 18px solid #4ca491;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	z-index: 2;
}
.solufeanote:after {
	position: absolute;
	content: "";
	right: 20%;
	bottom: 100%;
	border-top: 0;
	border-bottom: 18px solid #4ca491;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	z-index: 2;
}
.solufeanote span {
	display: block;
	margin-top: 30px;
	text-align: center;
	font-size: 20px;
	color: #fff;
	font-weight: 700;
	padding: 10px 0;
	background: #4ca491;
}

.solustep {
	display: flex;
}
.solustep li {
	width: 25%;
	text-align: center;
	line-height: 60px;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	position: relative;
}
.solustep li:before {
	position: absolute;
	content: "";
	left: 0;
	top: 0;
	border-right:0;
	border-top:30px solid transparent;
	border-bottom:30px solid transparent;
	z-index: 2;
}
.solustep .solustep01 {
	background: #547abc;
}
.solustep .solustep02 {
	background: #3D6095;
}
.solustep .solustep02:before {
	border-left: 20px solid #547abc;
}
.solustep .solustep03 {
	background: #27466D;
}
.solustep .solustep03:before {
	border-left: 20px solid #3D6095;
}
.solustep .solustep04 {
	background: #102c46;
}
.solustep .solustep04:before {
	border-left: 20px solid #27466D;
}


@media screen and (max-width: 1080px) {
.solufealist {
	margin: 0 0 0 -50px;
}
.solufealist .solufeain {
	padding: 35px 25px;
}
.solufealist li {
	padding-left: 50px;
}
.solustep li {
	font-size: 16px;
}
}


@media screen and (max-width: 767px) {
.solufeatit {
	max-width: none;
	margin: 0 20px 50px;
	font-size: 16px;
	padding: 10px 0;
}
.pointin {
	justify-content: space-between;
	flex-wrap: wrap;
	margin: -30px 20px 50px;
}
.pointin li {
	margin-top: 30px;
}
.pointin li+li {
	padding-left: 0;
}
.pointin .pointbox {
	width: 130px;
	height: 130px;
	font-size: 17px;
}
.pointin .pointico span {
	font-size: 8px;
}
.pointin .pointico span b {
	font-size: 10px;
}
	
.solufealist {
	margin: 0;
}
.solufealist li {
	float: none;
	width: auto;
	padding-left: 0;
}
.solufealist li+li {
	margin-top: 10px;
}
.solufealist .solufeain {
	padding: 25px 20px 30px;
}
.solufealist .solufeacap {
	font-size: 12px;
	margin-bottom: 15px;
}
.solufealist .solufeahd {
	font-size: 16px;
	margin-bottom: 20px;
}
.solufealist .solufeatxt {
	margin-bottom: 10px;
	font-size: 12px;
}
.solufealist .solufeaball {
	width: 98px;
}
.solufealist .solufeaball span {
	height: 98px;
}
.solufeaarea {
	padding-left: 80px;
}
.solufeanote {
	position: absolute;
	left: 0;
	top: 0;
	width: 50px;
	height: 100%;
	display: table;
	z-index: 2;
}
.solufeanote:before {
	left: 100%;
	bottom: inherit;
	top: 25%;
	border-left:18px #4ca491 solid;
	border-right:0;
	border-top:10px solid transparent;
	border-bottom:10px solid transparent;
	z-index: 2;
}
.solufeanote:after {
	left: 100%;
	bottom: 25%;
	border-left:18px #4ca491 solid;
	border-right:0;
	border-top:10px solid transparent;
	border-bottom:10px solid transparent;
	z-index: 2;
}
.solufeanote span {
	display: table-cell;
	width: 100%;
	height: 100%;
	vertical-align: middle;
	margin-top: 0;
	padding: 0 15px;
	line-height: 1.2;
}
	
.solustep {
	display: block;
	max-width: 200px;
	margin: 0 auto;
}
.solustep li {
	width: auto;
	line-height: 100px;
}
.solustep li:before {
	position: absolute;
	content: "";
	left: 0;
	top: 0;
	border-bottom: 0;
	border-left: 100px solid transparent;
	border-right: 100px solid transparent;
	z-index: 2;
}
.solustep .solustep02,.solustep .solustep03,.solustep .solustep04 {
	padding-top: 20px;
}
.solustep .solustep02:before {
	border-top: 20px #547abc solid;
	border-left: 100px solid transparent;
}
.solustep .solustep03:before {
	border-top: 20px #3d5f95 solid;
	border-left: 100px solid transparent;
}
.solustep .solustep04:before {
	border-top: 20px #27456d solid;
	border-left: 100px solid transparent;
}
}

/* !example
---------------------------------------------------------- */

.w-21{
	width: 20% !important;
}

.exam-image{
	width: 50%;
}

.exam-text{
	color: #000 !important;
	font-size: 15px !important;
	background-color: #fff;
	font-weight: 400;
}

.size2{
	font-size: 12px;
}

.exam-img{
	background-color: #fff;
}

@media screen and (max-width: 1080px) {
	.exam-image{
		width: 90%;
	}
}

@media screen and (max-width: 767px) {
	.exam-image{
		width: 100%;
	}
	.exam-text{
		font-size: 9px !important;
	}

	.exam-text span{
		font-size: 7px !important;
	}
}

/* !contact
---------------------------------------------------------- */
#contact{
	max-width: 660px;
	padding-top: 150px;
	margin: 100px auto 0 auto;
}

.contact-text{
	margin-top: 35px;
	background-color: #fff;
	padding: 40px 60px;
	line-height: 1.8;
}


.contact-item{
    letter-spacing: 0.42px;
    color: #2B2B2B;
	opacity: 1;
	font-weight: normal;
}


#contact iframe{
	margin-top: 50px;
	width: 100%;
	height: 1147px !important;
}


@media screen and (max-width: 767px) {
	#contact{
		width: 100%;
		padding:0 20px;
	}
	.contact-text{
		font-size: 14px;
		padding: 20px 30px;
	}
	#contact iframe{
		height: 1561px !important;
	}

}