html {
	scroll-behavior: smooth;
}

body {
	font-family: 'Roboto', sans-serif;
	font-size: 16px;
	color: #000;
	line-height: 1;
	background: #E8EAEF;
}

.mon {
	font-family: 'Montserrat',
		sans-serif;

}

.osw {
	font-family: 'Oswald',
		sans-serif;
}

h1,
h2,
h3,
h4,
h5,
.h1,
.h2,
.h3,
.h4,
.h5 {
	margin: 0;
	padding: 0;
	line-height: 1;
}

p {
	margin: 0;
	padding: 0;
	line-height: 1;
}

ul {
	padding: 0;
	margin: 0;
	list-style-type: none;
}

a:hover {
	text-decoration: none;
}

label {
	margin-bottom: 0;
	width: 100%;
}

img {
	max-width: 100%;
}

.d-flex {
	display: -webkit-flex;
	flex-wrap: wrap;
}

.align-items-center {
	-webkit-align-items: center;
}

.justify-content-center {
	-webkit-justify-content: center;
}

.justify-content-between {
	-webkit-justify-content: space-between;
}

@media (max-width: 539px) {
	.main-navigation {
		width: 300px;
	}

	.hamburg-item a.active {
		left: 8px;
	}
}

/*********************************************/

.topsection {
	background: #fff;
	padding: 100px 0 350px 0;
}

.topsection h3 {
	font-weight: 300;
	font-size: 4.2em;
	color: #518FF7;
	margin-bottom: 350px;
}

.topsection .step {
	position: relative;
	width: 100%;
	flex: 0 0 19.3%;
	max-width: 19.3%;
	height: 190px;
}

.topsection .step .text-container {
	position: absolute;
	width: 240px;
	height: 275px;
	padding: 25px 25px 0 25px;
	margin: 5px 0;
}

.topsection .step .text-container:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 8px;
	height: 100%;
}

.topsection .step .text-container:after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 8px;
	height: 100%;
}

.topsection .step .text-container img {
	max-width: 30%;
	max-height: 24%;
	display: block;
	margin: 0 auto 20px auto;
}

.topsection .step .text-container p {
	font-weight: 400;
	font-size: 1em;
	line-height: 1.6;
	color: #333333
}

.topsection .step h4 {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	text-align: center;
	font-weight: 300;
	font-size: 2.9em;
	color: #fff;
}

.topsection .step:nth-child(n+2) h4 {
	padding-left: 50px;
}

.topsection .step:nth-child(n+2) {
	border-left: 6px solid #fff;
}

.topsection .step:nth-child(n+2):before {
	content: "";
	position: absolute;
	z-index: 1;
	top: 0;
	bottom: 0;
	left: 0;
	border-top: 95px solid transparent;
	border-bottom: 95px solid transparent;
	border-right: 0 solid transparent;
	border-left: 40px solid #fff;
}

.topsection .step:nth-child(1) {
	background: #333333;
}

.topsection .step:nth-child(1):after {
	content: "";
	position: absolute;
	z-index: 2;
	top: 0;
	bottom: 0;
	right: -40px;
	border-top: 95px solid transparent;
	border-bottom: 95px solid transparent;
	border-right: 0px solid transparent;
	border-left: 40px solid #333333;
}

.topsection .step:nth-child(1) .text-container {
	top: 100%;
}

.topsection .step:nth-child(1) .text-container:before,
.topsection .step:nth-child(1) .text-container:after {
	background: #333333;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
}

.topsection .step:nth-child(2) {
	background: #4D4D4D;
}

.topsection .step:nth-child(2):after {
	content: "";
	position: absolute;
	z-index: 2;
	top: 0;
	bottom: 0;
	right: -40px;
	border-top: 95px solid transparent;
	border-bottom: 95px solid transparent;
	border-right: 0px solid #fff;
	border-left: 40px solid #4d4d4d;
}

.topsection .step:nth-child(2) .text-container {
	bottom: 100%;
}

.topsection .step:nth-child(2) .text-container:before,
.topsection .step:nth-child(2) .text-container:after {
	background: #4D4D4D;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}

.topsection .step:nth-child(3) {
	background: #666666;
}

.topsection .step:nth-child(3):after {
	content: "";
	position: absolute;
	z-index: 2;
	top: 0;
	bottom: 0;
	right: -40px;
	border-top: 95px solid transparent;
	border-bottom: 95px solid transparent;
	border-right: 0px solid #fff;
	border-left: 40px solid #666666;
}

.topsection .step:nth-child(3) .text-container {
	top: 100%;
}

.topsection .step:nth-child(3) .text-container:before,
.topsection .step:nth-child(3) .text-container:after {
	background: #666666;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
}

.topsection .step:nth-child(4) {
	background: #808080;
}

.topsection .step:nth-child(4):after {
	content: "";
	position: absolute;
	z-index: 2;
	top: 0;
	bottom: 0;
	right: -40px;
	border-top: 95px solid transparent;
	border-bottom: 95px solid transparent;
	border-right: 0px solid #fff;
	border-left: 40px solid #808080;
}

.topsection .step:nth-child(4) .text-container {
	bottom: 100%;
}

.topsection .step:nth-child(4) .text-container:before,
.topsection .step:nth-child(4) .text-container:after {
	background: #808080;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}

.topsection .step:nth-child(5) {
	background: #999999;
}

.topsection .step:nth-child(5):after {
	content: "";
	position: absolute;
	z-index: 2;
	top: 0;
	bottom: 0;
	right: -40px;
	border-top: 95px solid #fff;
	border-bottom: 95px solid #fff;
	border-right: 0px solid #fff;
	border-left: 40px solid #999999;
}

.topsection .step:nth-child(5) .text-container {
	top: 100%;
}

.topsection .step:nth-child(5) .text-container:before,
.topsection .step:nth-child(5) .text-container:after {
	background: #999999;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
}

/*********************************************/

.header {
	position: relative;
	z-index: 10;
	background: url("images/sp_img/banner.png") no-repeat;
	background-size: cover;
	background-position: center bottom;
	padding: 125px 0 350px 0;
	text-align: center;
}

/*.header h1 {
	font-weight: 300;
	font-size: 4.81em;
	color: #fff;
}*/

.header .star {
	display: block;
	margin: 45px auto;
}

.header h1 {
	font-weight: 300;
	font-size: 4.81em;
	color: #fff;
}

.header h1 span {
	font-weight: 500;
}

.sec-1 {
	position: relative;
	z-index: 1;
	margin-top: -130px;
	padding-bottom: 70px;
	background: url("images/sp_img/sect-head-1.png") no-repeat;
	background-size: 100% 290px;
	background-position: center top;
}

.sec-1 .title {
	padding: 55px 0 48px 0;
	font-weight: 500;
	font-size: 2.43em;
	color: #fff;
	text-align: right;
	margin-bottom: 40px;
}

.sec-1 .box {
	position: relative;
	height: 521px;
	border-top-left-radius: 160.50px;
	border-bottom-right-radius: 160.50px;
	background: #F77F06;
	padding: 200px 43px 0 43px;
	margin-top: 40px;
	max-width: 346px;
}

.sec-1 .box .box-head {
	position: absolute;
	top: -30px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 227px;
	height: 227px;
	background: #fff;
	border: 8px solid #F77F06;
	border-radius: 100%;
	font-weight: 700;
	font-size: 4.18em;
	color: #F77F06;
}

.sec-1 .box p {
	font-weight: 300;
	font-size: 1.82em;
	line-height: 1.5;
	color: #fff;
	height: 100%;
	display: flex;
	align-items: center;
}

.sec-1 img {
	padding-left: 30px;
	max-width: 117%;
}

.sec-2 {
	position: relative;
	padding-bottom: 70px;
	background: url("images/sp_img/sect-head-2.png") no-repeat;
	background-size: 100% 290px;
	background-position: center top;
}

.sec-2 .title {
	padding: 55px 0 48px 0;
	font-weight: 500;
	font-size: 2.43em;
	color: #fff;
	margin-bottom: 86px;
}

.sec-2 img {
	position: absolute;
	z-index: -1;
	bottom: 0;
	left: 0;
	max-width: 43%;
}
.sec-2 .box-head img{
	position: relative;
	max-width: 100%;
}
.sec-2 .rating-box-container {
	width: 100%;
	max-width: 717px;
}

.sec-2 .rating-box {
	margin-left: 65px;
}

.sec-2 .rating-box div:nth-child(1) {
	width: 0px;
	padding: 9px 0;
	font-weight: 500;
	font-size: 1.375em;
	color: #fff;
	text-align: center;
	border-radius: 50px;
	margin:10px 0px;
}

.sec-2 .rating-box div:nth-child(2) {
	position: relative;
	width: 100%;
	max-width: 80%;
	padding: 23px 0 23px 35px;
	font-weight: 500;
	font-size: 1.62em;
	color: #fff;
	box-shadow: inset 11px 0 11px -5px rgba(0, 0, 0, 0.3);
	margin-left: -20px;
}
.sec-2 .rating-box:nth-child(n+2) div:nth-child(2) {
	margin-top: 20px;
}

.sec-2 .rating-box div:nth-child(2):before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	right: -30px;
	border-top: 35px solid #E8EAEF;
	border-bottom: 35px solid #E8EAEF;
	border-right: 0 solid #E8EAEF;
}

.sec-2 .rating-box:nth-child(1) div:nth-child(1),
.sec-2 .rating-box:nth-child(1) div:nth-child(2) {
	background: #A6B7B3;
}

.sec-2 .rating-box:nth-child(1) div:nth-child(2):before {
	border-left: 30px solid #A6B7B3;
}

/*.sec-2 .rating-box:nth-child(1) div:nth-child(2) {
	width: calc(100% - 210px);
	max-width: 86%;
}*/

.sec-2 .rating-box:nth-child(2) div:nth-child(1),
.sec-2 .rating-box:nth-child(2) div:nth-child(2) {
	background: #82938F;
}

.sec-2 .rating-box:nth-child(2) div:nth-child(2):before {
	border-left: 30px solid #82938F;
}

/*.sec-2 .rating-box:nth-child(2) div:nth-child(2) {
	width: calc(100% - 210px);
	max-width: 50%;
}*/

.sec-2 .rating-box:nth-child(3) div:nth-child(1),
.sec-2 .rating-box:nth-child(3) div:nth-child(2) {
	background: #FABF05;
}

.sec-2 .rating-box:nth-child(3) div:nth-child(2):before {
	border-left: 30px solid #FABF05;
}

/*.sec-2 .rating-box:nth-child(3) div:nth-child(2) {
	width: calc(100% - 210px);
	max-width: 35%;
}*/

.sec-2 .rating-box:nth-child(4) div:nth-child(1),
.sec-2 .rating-box:nth-child(4) div:nth-child(2) {
	background: #F77F06;
}

.sec-2 .rating-box:nth-child(4) div:nth-child(2):before {
	border-left: 30px solid #F77F06;
}

/*.sec-2 .rating-box:nth-child(4) div:nth-child(2) {
	width: calc(100% - 210px);
	max-width: 34%;
}*/

.sec-2 .rating-box:nth-child(5) div:nth-child(1),
.sec-2 .rating-box:nth-child(5) div:nth-child(2) {
	background: #C09FAB;
}

.sec-2 .rating-box:nth-child(5) div:nth-child(2):before {
	border-left: 30px solid #C09FAB;
}

/*.sec-2 .rating-box:nth-child(5) div:nth-child(2) {
	width: calc(100% - 210px);
	max-width: 33%;
}*/

.sec-2 .rating-box:nth-child(6) div:nth-child(1),
.sec-2 .rating-box:nth-child(6) div:nth-child(2) {
	background: #8E7D83;
}

.sec-2 .rating-box:nth-child(6) div:nth-child(2):before {
	border-left: 30px solid #8E7D83;
}

/*.sec-2 .rating-box:nth-child(6) div:nth-child(2) {
	width: calc(100% - 210px);
	max-width: 31%;
}*/

.sec-2 .rating-box:nth-child(7) div:nth-child(1),
.sec-2 .rating-box:nth-child(7) div:nth-child(2) {
	background: #A49FAE;
}

.sec-2 .rating-box:nth-child(7) div:nth-child(2):before {
	border-left: 30px solid #A49FAE;
}

/*.sec-2 .rating-box:nth-child(7) div:nth-child(2) {
	width: calc(100% - 210px);
	max-width: 28%;
}*/

.sec-2 .rating-box:nth-child(8) div:nth-child(1),
.sec-2 .rating-box:nth-child(8) div:nth-child(2) {
	background: #83808F;
}

.sec-2 .rating-box:nth-child(8) div:nth-child(2):before {
	border-left: 30px solid #83808F;
}

/*.sec-2 .rating-box:nth-child(8) div:nth-child(2) {
	width: calc(100% - 210px);
	max-width: 16%;
}*/

.sec-2 .box {
	position: relative;
	height: 521px;
	border-top-left-radius: 160.50px;
	border-bottom-right-radius: 160.50px;
	background: #A49FAE;
	padding: 200px 43px 0 43px;
	margin-top: 40px;
	max-width: 346px;
}

.sec-2 .box .box-head {
	position: absolute;
	top: -30px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 227px;
	height: 227px;
	background: #fff;
	border: 8px solid #A49FAE;
	border-radius: 100%;
	font-size: 4.18em;
	font-weight: 700;
	color: #A49FAE;
}

.sec-2 .box p {
	font-weight: 300;
	font-size: 1.6em;
	line-height: 1.5;
	color: #fff;
	height: 100%;
	display: flex;
	align-items: center;
}

.sec-3 {
	position: relative;
	padding-bottom: 150px;
	background: url("images/sp_img/sect-head-3.png") no-repeat;
	background-size: 100% 290px;
	background-position: center top;
}

.sec-3 .title {
	padding: 55px 0 48px 0;
	font-weight: 500;
	font-size: 2.43em;
	color: #fff;
	text-align: right;
	margin-bottom: 76px;
}

.sec-3 .box {
	position: relative;
	height: 540px;
	border-top-left-radius: 160.50px;
	border-bottom-right-radius: 160.50px;
	background: #A6B7B3;
	padding: 200px 43px 0 43px;
	max-width: 346px;
}

.sec-3 .box .box-head {
	position: absolute;
	top: -30px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 227px;
	height: 227px;
	background: #fff;
	border: 8px solid #A6B7B3;
	border-radius: 100%;
	font-size: 4.18em;
	color: #A6B7B3;
}

.sec-3 .box p {
	font-weight: 300;
	font-size: 1.6em;
	line-height: 1.5;
	color: #fff;
	height: 100%;
	display: flex;
	align-items: center;
}

.sec-3 .circle-container {
	max-width: 250px;
	flex-direction: column;
	padding-left: 100px;
}

.sec-3 .circle-container p:nth-child(2) {
	font-size: 1.56em;
	margin: 25px 0;
}

.sec-3 .circle-container .circle {
	width: 230px;
	height: 230px;
	padding: 60px 0
}

.sec-3 .circle-container .circle:first-of-type {
	border: 16px dotted #028FF9;
	border-radius: 100%;
}

.sec-3 .circle-container .circle:first-of-type p {
	font-size: 2.2em;
	line-height: 1.1;
	color: #028FF9;
	text-align: center;
}

.sec-3 .circle-container .circle:first-of-type p span {
	font-size: 2.4rem;
}

.sec-3 .circle-container .circle:last-of-type {
	border: 16px dotted #56B8EB;
	border-radius: 100%;
}

.sec-3 .circle-container .circle:last-of-type p {
	font-size: 2.2em;
	line-height: 1.1;
	color: #56B8EB;
	text-align: center;
}

.sec-3 img.img-3 {
	position: absolute;
	bottom: 0;
	right: 0;
	max-width: 92%;
}

.sec-3 img.img-3-mobile {
	position: absolute;
	bottom: 0;
	right: 0;
	display: none;
}

.sec-4 {
	padding: 120px 0 270px 0;
	background: url("images/sp_img/footer-bg.png") no-repeat;
	background-size: 100% auto;
	background-position: bottom center;
}

.sec-4 .row:last-of-type {
	margin-top: 110px;
}

.sec-4 .card {
	position: relative;
	height: 390px;
	border: 9px solid;
	border-radius: 20px;
	padding: 130px 15px 15px 15px;
	text-align: center;
}

.sec-4 .card .card-head {
	width: 186px;
	height: 186px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 100%;
	position: absolute;
	top: -90px;
	left: 50%;
	transform: translateX(-50%);
}

.sec-4 .card h4 {
	font-weight: 300;
	font-size: 1.85em;
	margin-bottom: 25px;
}

.sec-4 .card p {
	font-weight: 400;
	font-size: 1.17em;
	line-height: 1.6;
}

.sec-4 .card.color-1 {
	border-color: #A6B7B3;
}

.sec-4 .card.color-1 .card-head {
	background: #A6B7B3;
}

.sec-4 .card.color-1 h4 {
	color: #A6B7B3;
}

.sec-4 .card.color-2 {
	border-color: #82938F;
}

.sec-4 .card.color-2 .card-head {
	background: #82938F;
}

.sec-4 .card.color-2 h4 {
	color: #82938F;
}

.sec-4 .card.color-3 {
	border-color: #FABF05;
}

.sec-4 .card.color-3 .card-head {
	background: #FABF05;
}

.sec-4 .card.color-3 h4 {
	color: #FABF05;
}

.sec-4 .card.color-4 {
	border-color: #F77F06;
}

.sec-4 .card.color-4 .card-head {
	background: #F77F06;
}

.sec-4 .card.color-4 h4 {
	color: #F77F06;
}

.sec-4 .card.color-5 {
	border-color: #C09FAB;
}

.sec-4 .card.color-5 .card-head {
	background: #C09FAB;
}

.sec-4 .card.color-5 h4 {
	color: #C09FAB;
}

.sec-4 .card.color-6 {
	border-color: #8E7D83;
}

.sec-4 .card.color-6 .card-head {
	background: #8E7D83;
}

.sec-4 .card.color-6 h4 {
	color: #8E7D83;
}

.sec-4 .card.color-7 {
	border-color: #A49FAE;
}

.sec-4 .card.color-7 .card-head {
	background: #A49FAE;
}

.sec-4 .card.color-7 h4 {
	color: #A49FAE;
}

.sec-4 .card.color-8 {
	border-color: #83808F;
}

.sec-4 .card.color-8 .card-head {
	background: #83808F;
}

.sec-4 .card.color-8 h4 {
	color: #83808F;
}