/*===== default css  =====*/
html{
  scroll-behavior: smooth;
}
body{
	padding: 0;
	margin: 0;
   font-family: 'Montserrat', sans-serif;
}

/*=====Banner section css =====*/
.banner{
	width: 100%;
	height: auto;
	float: left;
	background: url(img/banner.jpg);
	padding: 60px 0px 90px 0px;
	background-size: cover;
	background-position: center;
	color: #fff;
}
.banner h2{
	margin-top: 60px;
	margin-bottom: 60px;
	font-size: 42px;
	font-weight: bold;
}

.banner ul{ list-style: none; padding: 0px; margin-top: 20px;}
.banner ul li {
	margin-top: 0px;
    font-size: 22px;
    text-align: left;
    color: #fff;
    background: url(img/check.png) left 13px no-repeat;
    padding: 6px 0px 3px 27px;
}
.main-btn{
	background: #3c58d7;
	color: #fff;
	font-weight: bold;
	border-radius: 5px;
	border: none;
	padding: 11px 40px 11px 40px;
	transition: 0.4s;
	margin-top: 20px;
	cursor: pointer;
}
.main-btn:hover{
	background: #192d89;
}
/*=====choice section css =====*/
.choice{
	width: 100%;
	height: auto;
	float: left;
	background: #fff;
	padding: 50px 0px 50px 0px;
}
.choice h2{
   text-align: center;
   font-weight: bold;
   margin-bottom: 30px;
}
.choice h4{
	font-size: 20px;
   text-align: center;
   font-weight: bold;
   margin-top: 70px;
}
/*=====text-img section css =====*/
.text-img{
    width: 100%;
	height: auto;
	float: left;
	background: #ffffff;
	padding: 50px 0px 50px 0px;
}
.text-img h3{
	font-weight: bold;
	color: #3c58d7;
	margin-top: 50px;
	margin-bottom: 20px;
}
.text-img p{
	color: gray;
	font-size: 18px;
}

.img-hover-zoom {
    background: #222f3e;
    width:100%; 
    overflow: hidden;
    border-radius: 0.5em;
}
.img-hover-zoom img {
  transition: transform .5s ease-in-out;
}

.img-hover-zoom:hover img {
  transform: scale(1.1) rotate(3deg);;
}
/*=====Banner2 section css =====*/
.banner2{
	width: 100%;
	height: auto;
	float: left;
	background: url(img/banner2.jpg);
	padding: 60px 0px 120px 0px;
	background-size: cover;
	background-position: center;
	color: #fff;
}
.banner2 h2{
	text-align: center;
	font-weight: bold;
	margin-bottom: 30px;
}
/*=====section css =====*/
.step{
   width: 100%;
	height: auto;
	float: left;
	background: #fff;
	padding: 50px 0px 50px 0px;
}

.step h6{
   letter-spacing: 2px;
   color: gray;
}
.step h2{
	font-weight: bold;
	margin-bottom: 50px;
}
.media{
	margin-bottom: 30px;
}
.media h5{
	font-weight: bold;
	color: #3c58d7;
}
.media p{color: gray; font-weight: 400;}

.step-no{
	width: 60px;
	height: 60px;
	border-radius: 100px;
	float: left;
	border: 1px solid black;
	margin-right: 10px;
}
.step-no h2{
	text-align: center;
  margin-top: 10px;
  font-weight: bold;
}
/*=====decision section css =====*/
.decision{
	width: 100%;
	height: auto;
	float: left;
	background: #f7f7f7;
	padding: 50px 0px 50px 0px;
}
.decision h2{
   font-weight: bold;
   color: #3c58d7;
   margin-top: 200px;
   margin-bottom: 20px;
}
.decision h4{
   margin-bottom: 20px;
}

.de-box{
	width: 100%;
	height: auto;
	float: left;
	background: #fff;
	margin-bottom: 20px;
	padding: 20px 15px 20px 15px;
	box-shadow: 0 24px 36px rgb(0 91 87 / 7%);
	border-radius: 5px;
}
.de-box h4{
	text-align: center;
	font-weight: bold;
	font-size: 20px;
	margin-top: 20px;
}
.de-box p{
	text-align: center;
	color: gray;
	font-weight: normal;
}
/*=====man section css =====*/
.man{
	width: 100%;
	height: auto;
	float: left;
	background: #fff;
	padding-top: 50px;
}
.man h5{
	color: #515151;
	font-weight: bold;
}
.man h2{
	color: #3c58d7;
	font-weight: bold;
}
.man p{
	color: gray;
}
/*=====Number section css =====*/
.number{
	width: 100%;
	height: auto;
	float: left;
	background: #3c58d7;
	padding: 50px 0px 50px 0px;
}
.display-4{
	color: #fff;
	font-weight: bold;
}
.number p{
	text-align: center;
	color: #fff;
}
/*=====review section css =====*/
.review{
	width: 100%;
	height: auto;
	float: left;
	background: #fff;
	padding: 50px 0px 50px 0px;
}
.review h2{
	text-align: center;
	font-weight: bold;
	color: #3c58d7;
}
.review h5{
	text-align: center;
	color: gray;
	margin-bottom: 60px;
}
.review p{
	text-align: center;
	color: gray;
	margin-bottom: 0px;
}
small{
	color: #a6a6a6;
}
/*=====section css =====*/
.faq{
	width: 100%;
	height: auto;
	float: left;
	background: #fff;
	padding: 0px 0px 70px 0px;
}
.faq h2{
	text-align: center;
	font-weight: bold;
	color: #3c58d7;
}
.panel-default>.panel-heading {
  margin-top: 20px;
  background-color: #f6f6f6;
  border-radius: 10px;
  border-color: #e4e5e7;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.panel-default>.panel-heading a {
  display: block;
  font-size: 18px;
  font-weight: bold;
  padding: 15px 15px;
  text-decoration: none;
  color: #000;
}

.panel-default>.panel-heading a:after {
  content: "";
  position: relative;
  top: 1px;
  display: inline-block;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  float: right;
  transition: transform .25s linear;
  -webkit-transition: -webkit-transform .25s linear;
}

.panel-default>.panel-heading a[aria-expanded="true"] {
  background-color: #eee;
  border-radius: 10px;
}

.panel-default>.panel-heading a[aria-expanded="true"]:after {
  content: "\2212";
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.panel-default>.panel-heading a[aria-expanded="false"]:after {
  content: "\002b";
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}
/*=====section css =====*/
.footer{
	width: 100%;
	height: auto;
	float: left;
	background: #0b0d17;
	padding: 30px 0px 30px 0px;
}
.footer p{
	color: #d9dbe1;
	text-align: center;
	margin-top: 20px;
}


/*=====tools section css =====*/

.phone{
	display: none;
}
/*=====Only Computer extra-large device=====*/
@media screen and (min-width: 768px)
{
 /*===== Start only computer css =====*/

.step img{
	margin-top: 20px;
}

}


/*===== Mobile, tab and medium & small device =====*/
@media screen and (max-width: 768px)
{
	/*===== start Mobile css =====*/
 .banner{
	padding: 50px 0px 50px 0px;
}
.banner h2{
	margin-top: 20px;
	font-size: 28px;
}
.banner ul li {
	margin-top: 0px;
    font-size: 18px;
    padding: 11px 0px 3px 24px;
}
.choice h4{
	font-size: 20px;
   text-align: center;
   font-weight: bold;
   margin-top: 15px;
}
.text-img{
	padding: 40px 0px 40px 0px;
}
.text-img h3{
	font-weight: bold;
	color: #3c58d7;
	margin-top: 10px;
	margin-bottom: 10px;
}
.media{
	margin-bottom: 10px;
}
.step h2{
	font-size: 28px;
	margin-bottom: 30px;
}
.decision h2{
	font-size: 24px;
   margin-top: 0px;
   margin-bottom: 20px;
}



.phone{
	display: block;
}
.pc{
	display: none;
}

}