/* Show it's not fixed to the top */
body {
padding:0px;
margin:0px;
}
/* CSS navigation */
.bg-color{
background-color:#fff;
}

.nav-link{
color:#2d2d2d !important;
font-weight:bold !important;
font-family: "Noto Sans JP", sans-serif;
font-size:16px;
}


.navbar-nav .nav-link.active, .navbar-nav .show>.nav-link{
color:#2d2d2d !important;
font-weight:bold;
font-family: "Noto Sans JP", sans-serif;
font-size:16px;
}


.navbar-toggler{
background-color:#343162 !important;
}

.nav-btn{
background: linear-gradient(4deg, rgba(52,49,98,1) 0%, rgba(106,99,200,1) 100%);
border:none ;
color:#fff;
padding:10px 30px;
font-family: "Noto Sans JP", sans-serif;
border-radius: 25px;
font-size:14px;
margin-left:10px;
width:100%;
max-width:20%;
box-shadow: 1px 3px rgba(1, 1, 1, 0.25);
}

.nav-btn a {
    color: #fff; /* White text */
    text-decoration: none; /* Optional: removes underline */
}

.nav-btn a:hover,
.nav-btn a:visited,
.nav-btn a:active {
    color: #fff; /* Ensures it stays white even after clicking */
}

.nav-spacing{
padding:0% 4% !important;}

/* CSS banner first-section */
.top-banner{ 
 background-image:url(images/banner-top.png);
 background-position:top;
 background-repeat:no-repeat;
 background-size:cover;
 position:relative;
 margin-top:6.5rem;
  }
  
  .banner-spacing{
  margin-bottom:7%;
  margin-left:-30px;
  }
  

.banner-box{
background:rgba(13, 10, 52, 0.8);
width:100% !important;
max-width: 92% !important;
text-align:left;
padding:0px 0px 0px 15px;
}
.banner-box2{
background:rgba(13, 10, 52, 0.8);
width:100% ;
max-width: 59% ;
text-align:left;
padding:0px 0px 0px 15px;
margin-top:27px;
}
.banner-box3{
background:rgba(13, 10, 52, 0.8);
width:100% !important;
max-width: 97% !important;
text-align:left;
padding:0px;
margin-top:27px;
}
.banner-text h1{
color:#fff;
font-family: yugothib;
font-weight:bold;
font-size:40px;
text-align:left;
margin-top:37%;
}
.banner-text h2{
color:#fff;
font-family: "Noto Sans JP", sans-serif;
font-weight:bold;
font-size:85px;
text-align:left;
}
.banner-text h3{
color:#fff;
font-family: yugothib;
font-weight:bold;
font-size:90px;
text-align:left;
position:relative;
padding-top:5px;
}

.banner-text h3:before{
content:url('images/border-top.png');
background-repeat:no-repeat;
background-position:top;

position:absolute;
top: -35px;
    left: -3px;
}

.banner-text h3 .main-head{
font-size:115px;
padding:5px 15px 0px 15px;
position:relative;
}

.banner-text h3 .main-head:before{
content:url('images/border-bottom.png');
background-repeat:no-repeat;
background-position:bottom right;
position:absolute;
right:0px;
bottom:-39px;
}

.banner-text h3 span{
color:#fff;
font-family: yugothib;
font-weight:bold;
font-size:92px;
text-align:left;
}

.banner-text ul li {
    list-style-type: none;
    display: inline-table;
    color: #2d2d2d;
    font-family: Futura, "Trebuchet MS", Arial, sans-serif;
    font-size: 30px;
    text-align: center;
	letter-spacing:3px;
}

.banner-text p {
    font-family: yu-gothic-bold;
    color:#9D9D9D;
    font-size: 12px;
	text-align: center;
	letter-spacing:0.2px;}
/* CSS mission second-section */
.banner2{
background-image: url(images/web.png);
 background-position:top;
 background-repeat:no-repeat;
 background-size:cover;
 position:relative;
 }


.mission-bg {
    background-image: url(images/mission.png);
    background-position: center right;
    background-repeat: no-repeat;
    background-size: 80%;
}

.mission h1{
color:#2d2d2d;
font-family:Futura, "Trebuchet MS", Arial, sans-serif;;

font-size:42px;
text-align:center;
margin-top:32%;
padding: 3% 5% 3% 5%;
text-transform:uppercase;
position:relative;
}

.mission h1::before{
content: '';
  position: absolute;
  background: #2d2d2d;
  width: 100px;
  height: 1.5px;
  bottom:0;
  left: 42%;
}

.mission p{
color:#2d2d2d;
font-family:yu-gothic-medium;
font-size:19px;
font-weight:400 !important;
padding: 3% 5% 0% 5%;
margin-bottom:1px;

}


.mission-rgb{
background: rgba(255, 255, 255, 0.78) !important;
padding-left:5%;
}

/* CSS Achieve optimal cost third-section */

.achieve-bg-color{
background-image:url(images/achieve%20-bg.png);
background-position: center right;
background-repeat: no-repeat;
background-size: 85%;
}

.achieve h1{
color:#2d2d2d;
font-family:yu-gothic-bold;
font-weight:bold;
font-size:40px;
text-align:left;
padding-left:5%;

}

.achieve p{
color:#fff;
font-family:yu-gothic-medium;
font-size:19px;
font-weight:400 !important;
padding: 5% 5% 2% 5%;
margin-top:7%;
}


.achieve2 h1{
color:#2d2d2d;
font-family:yu-gothic-bold;
font-weight:bold;
font-size:40px;
text-align:left;


}

.achieve2 p{
color:#fff;
font-family:yu-gothic-medium;
font-size:19px;
font-weight:400 !important;
padding: 5% 5% 2% 0;
margin-top:7%;
}

.achieve-img{
margin-bottom:40%;
}


.flexible-bg-color{
background-image:url(images/achieve%20-bg.png);
background-position: center left;
background-repeat: no-repeat;
background-size: 85%;
}

.supports h6{
color:#2d2d2d;
font-family:yu-gothic-medium;
font-size:32px;
text-align:center;
padding: 1% 10% 7%;
line-height:1.5em;
}

/* CSS services */
.banner3{
background-image:url(images/services.png);
 background-position:top;
 background-repeat:no-repeat;
 background-size:cover;
 position:relative;
 height:568px;
 }

.services h1{
color:#fff;
font-family: Futura, "Trebuchet MS", Arial, sans-serif;
font-size:48px;
text-align:center;
margin-top: 8%;
letter-spacing:4px;
}
.services h6{
color:#fff;
font-family:yu-gothic-medium;
font-size:20px;
text-align:center;
}
.services p{
color:#fff;
font-family:yu-gothic-medium;
font-size:20px;
text-align:center;
margin-top:3.5%;
line-height:1.8em;
}


/* CSS Server-related-work */

.server-box{

box-shadow: 0px 4px 4px rgba(1,1,1,0.25);
height:70%;
width:100%;
max-width:94%;
}

.server{
padding:5% 10%!important;
}


.server h1{
color:#2d2d2d;
font-family:yu-gothic-bold;
font-size:24px;
text-align:left;
letter-spacing:4px;
border-bottom:#666666 solid 1px;
line-height:2.5rem;
padding-bottom:10px;
}

.server p{
color:#2d2d2d;
font-family:yu-gothic-medium;
font-size:16px;
text-align:left;
margin-top: 10%;
letter-spacing:4px;
}

/* CSS contact us */

.contact-bg{
background-color: #7785A0;
margin-top:4rem;
padding-top:1rem;
}

.contact-bg .contact p{
font-family: yu-gothic-medium;
  color:#ffffff;
  font-size:11px;
  text-align:center;
  padding-top:5px;
}

.text-contact p{
color:#fff;
font-family:yu-gothic-bold;
font-size:20px;
font-weight:bold;
text-align:center;
}
.contact-btn {
    background: linear-gradient(4deg, rgba(52, 49, 98, 1) 0%, rgba(106, 99, 200, 1) 100%);
    color: #fff;
    padding: 15px;
    font-family: yu-gothic-bold;
    border-radius: 50px;
    font-size: 24px;
  	border:	none;
	width:100%;
	max-width:35%;
}

.contact p{
  font-family: yu-gothic-bold;
  color:#2d2d2d;
  font-size:20px;
  text-align:center;

}

.text-contact ul{
display:inline;}



.text-contact ul li{
list-style-type:none;
display: inline-table;
color:#fff;
font-family: Futura, "Trebuchet MS", Arial, sans-serif;
font-size:24px;
text-align:left;
padding: 0px 46px 0px 5px;
}


.text-contact2 ul{
display:block;}



.text-contact2 ul li{
list-style-type:none;
display: block;
color:#fff;
font-family: Futura, "Trebuchet MS", Arial, sans-serif;
font-size:23px;
text-align:center;
padding: 0px 46px 0px 5px;
}

.text-contact2 .phone-number{
letter-spacing:4px;
font-size:32px;

}



/* CSS reason */


.reason-rgb{
background: rgba(255, 255, 255, 0.78) !important;
border: #9998b0 solid 1px;
margin-top:-10%;
padding-top: 10%;
    padding-bottom: 2%;
	margin-bottom:4.5%;

}


.banner4{
background-image:url(images/reason.png);
 background-position:bottom right;
 background-repeat:no-repeat;
 background-size:85.8%;
 position:relative;
 padding: 8% 0% 10% 0%;
 margin-top:15%;
 background-position-y: 60px;
 }


.reason-z-index {
    position: absolute;
    z-index: 1;
    background-color: #FFFFFF;
    width: 100%;
    max-width: 20%;
    left: 40%;
    top: -6%;
}

.reason-border{
border-right:solid 1px #9998b0;
border-bottom: solid 1px #9998b0;
padding-left:0px !important;
padding-right:0px !important;
}

.reason-border2{
border-bottom: solid 1px #9998b0;
padding-left:0px !important;
padding-right:0px !important;}


.reason-border3{
border-right:solid 1px #9998b0;
padding-left:0px !important;
padding-right:0px !important;}


.reason-borderspacing{
margin-left: 7% !important;
margin-right: 7% !important;
}

.reason-text-top h1{
color:#2d2d2d;
font-family: Futura, "Trebuchet MS", Arial, sans-serif;
font-size:48px;
text-align:center;

}

.reason-text-top p{
color:#2d2d2d;
font-family:yu-gothic-medium;
font-size:20px;
text-align:center;

}

.reason-text h2{
color:#2d2d2d;
font-family:yu-gothic-bold;
font-size:28px;
text-align:center;
margin-top:-20%;

}

.reason-text p{
color:#2d2d2d;
font-family:yu-gothic-medium;
font-size:20px;
text-align:left;
padding-top:20px;
}

.reason-text3 h2{
color:#2d2d2d;
font-family:yu-gothic-bold;
font-size:28px;
text-align:center;


}

.reason-text3 p{
color:#2d2d2d;
font-family:yu-gothic-medium;
font-size:20px;
text-align:left;
padding-top:20px;
}

.reason-text4 h2{
color:#2d2d2d;
font-family:yu-gothic-bold;
font-size:28px;
text-align:center;


}

.reason-text4 p{
color:#2d2d2d;
font-family:yu-gothic-medium;
font-size:20px;
text-align:left;
padding-top:20px;
}

.reason-text2{
padding-top:4%;
padding-bottom:4%;
font-family:yu-gothic-medium;
font-size:28px;
}

.reason-text3{
padding-top:4%;

}

.reason-text2 h1{
color:#2d2d2d;
font-family: Futura, "Trebuchet MS", Arial, sans-serif;
font-size:48px;
text-align:center;

}

.reason-text2 h2{
color:#2d2d2d;
font-family:yu-gothic-bold;
font-size:28px;
text-align:center;


}

.reason-text2 p{
color:#2d2d2d;
font-family:yu-gothic-medium;
font-size:20px;
text-align:left;
padding-top:20px;
}


.reason-text-box{
background-color:#FFFFFF;
width: 100%;
    max-width: 100%;
    margin: auto;
	font-family:yu-gothic-medium;
	font-size:28px;
}

.reason-text-box p{
background-color:#FFFFFF;
width: 100%;
    max-width: 100%;
    margin: auto;
	font-family:yu-gothic-medium;
	font-size:20px;
}
.reasonbox-spacing{
padding: 5% 10% 4% 0%;
}

.reasonbox-spacing2{
padding: 5% 0 4% 10%;
}

.reasonbox-spacing3{
padding: 5% 10% 0 0%;
}

.reasonbox-spacing4{
padding: 5% 0 0 10%;
}


/* CSS pricing */

.banner5{
background-image:url(images/pricing.jpg);
 background-position:top;
 background-repeat:no-repeat;
 background-size:contain;
 position:relative;
 padding: 7% 0% 0% 0%;
 }

.pricing h1{
color:#fff;
font-family: Futura, "Trebuchet MS", Arial, sans-serif;
font-size:48px;
text-align:center;
margin-top: 2%;
letter-spacing:4px;
}
.pricing h6{
color:#fff;
font-family:yu-gothic-medium;
font-size:20px;
text-align:center;
}

.p-box-spacing{
margin-top:3%;
	

}

.pricing-inner-box{
background: #343162 !important;
width:100%;
max-width: 100%;
text-align:left;
padding: 5px 0px;
}

.pricing-inner-box2{
background: #F1F4FD !important;
width:100%;
max-width: 100%;
text-align:left;


}
.pricing-inner-text h1{
font-family: Futura, "Trebuchet MS", Arial, sans-serif;
font-size:20px;
color :#fff;
text-align:center;
margin-bottom:0px;
}

.pricing-inner-text h6{
font-family: Futura, "Trebuchet MS", Arial, sans-serif;
font-size:20px;
color:#fff;
margin-bottom:0px;
text-align:center;
}

.pricing-inner-text h2{
font-family:yu-gothic-medium;
font-size:36px;
color :#060147;
text-align:center;
margin:0px;
padding: 9% 0% 0% 0%;
position:relative;
}

.pricing-inner-text h3:before{
content:'';
position:absolute;
background:#060147;
width:50px;
height:2px;
top: 10px;
  left: 43%;
}


.pricing-inner-text h3{
font-family: Futura, "Trebuchet MS", Arial, sans-serif;
font-size:36px;
color :#060147;
text-align:center;
padding: 6% 0% 9% 0%;
position:relative;
}

.pricing-inner-text h3 span{
font-family:yu-gothic-medium;
font-size:20px;
color :#060147;
text-align:center;
}

.pricing-inner-box3{
background:#343162 !important;
width:100%;
text-align:left;
margin:auto;
}

.pricing-inner-box4{
background: #F1F4FD !important;
width:100%;
max-width: 80%;
text-align:left;
margin:auto;
}

.pricing-inner-text2 h1{
font-family:yu-gothic-medium;
font-size:20px;
font-weight:bold;
color :#fff;
text-align:center;
margin:0px;
padding:10px;
}

.sp-shadow{
background:#F9F9F9;
box-shadow:0 4px 4px rgba(1, 1, 1, 0.25);
padding-left:12% !important;

padding-right:12% !important;
}

.sp-shadow-inner{
box-shadow:0 4px 4px rgba(1, 1, 1, 0.25);


}

.pricing-box{

box-shadow:0px 4px 4px rgba(1, 1, 1, 0.25);
height:70%;
}

.pricing-box-new{

box-shadow:0px 4px 4px rgba(1, 1, 1, 0.25);

}

.pricing-box2{

box-shadow:0px 4px 4px rgba(1, 1, 1, 0.25);
}

.pricing-box-bg{
background-color:#FFFFFF;
margin: 30px;
padding: 14px;
}

.pricing-box ul{
padding:0px;
margin-left:5px;
}
.pricing-box ul li{
list-style-type:none;
font-family:yu-gothic-medium;
font-size:12px;
}

.pricing-box-full ul{
padding:0px;
margin-left:5px;
}
.pricing-box-full ul li{
list-style-type:none;
font-family:yu-gothic-medium;
font-size:12px;
line-height:1.8em;
}

.sp-shadow .pricing-inner-text h3{
padding-top:9%;
font-size:40px;
}

.sp-shadow .pricing-inner-text h3::before{
left:41%;
}

.pricing-text-full{
padding-top:4%;
}

.pricing-text-full ul li{
font-family:yu-gothic-medium;
line-height:2em;
font-size:16px;
}

.pricing-text-full ul li::marker{
font-size:12px;
}

.pricing-text ul{
padding:0px;
}
.pricing-text ul li{
font-family:yu-gothic-medium;
font-size:18px;
text-align:left;
}


/* CSS case */

.banner6{
background-image:url(images/case.png);
 background-position:center;
 background-repeat:no-repeat;
 background-size:cover;
 padding: 9% 0% 9% 0%;
 margin-top:4rem;
 
 }


.case-text h1{
color:#fff;
font-family:Futura, "Trebuchet MS", Arial, sans-serif;
font-size:48px;
text-align:center;
}

.case-text p{
color:#fff;
font-family:yu-gothic-medium;
font-size:20px;
text-align:center;

}

/* CSS case-01 */
.banner7{
background-image:url(images/banner-case.png);
 background-position:top;
 background-repeat:no-repeat;
 background-size:cover;
 position:relative;
 height:auto;
 margin-top:5rem;
 margin-bottom:5rem;
 }

.case-inner-box{
background: #343162 !important;
width:100%;
max-width: 100%;
margin:auto;
position:relative;
}

.case-inner-box:after {
    content:"";
    position: absolute;
    left: 0;
	background-color:#b6b6b6;
	height:1px;
	width:100%;
    top: 75px;	
}

.case-inner-text h1{
font-family:yu-gothic-medium;
font-size:32px;
color:#FFFFFF;
padding: 6px 0px 6px 20px;
}

.case-inner-text h1 span{
font-family:yu-gothic-medium;
font-size:20px;
color:#FFFFFF;
}

.case-inner-small{
background: #343162 !important;
width:100%;
max-width: 35%;
border-radius:10px;
position:relative;
}
.case-small-text h1{
color:#FFFFFF;
font-size:20px;
font-family:yu-gothic-medium;
text-align:center;
padding: 10px 5px;
}

.case-small-text p{
color:#2d2d2d;
font-size:14px;
font-family:yu-gothic-medium;
text-align:left;
line-height:1.5em;
padding: 10px 5px;
}

.case-box2{

box-shadow: 0px 4px 4px rgba(1, 1, 1, 0.25);
background-color:#FFFFFF !important;
}

.case-bottom-text h5{
color:#2d2d2d;
font-size:24px;
font-family:yu-gothic-medium;

}

/* CSS review */

.reivew-banner8{
background-image:url(images/banner-bottom.png);
 background-position:top;
 background-repeat:no-repeat;
 background-size:cover;
 position:relative;
 padding-bottom:4%;

 }

.review-text h1{
color:#fff;
font-family:Futura, "Trebuchet MS", Arial, sans-serif;
font-size:48px;
text-align:left;
}

.review-text p{
color:#fff;
font-family:yu-gothic-medium;
font-size:20px;
text-align:left;
}


.review-box{
background-color:#FFFFFF;
margin-top:-8%;
width:100%;
padding:5% !important;
border-top-left-radius:100px;
}

.banner9{
background-image:url(images/review.png);
 background-position:bottom;
 background-repeat:no-repeat;
 background-size:cover;
 position:relative;


 }

.card{
border: none !important;
--bs-card-border-radius: 1.375rem !important;
padding:0 5%;
background:transparent !important;
}

.card-title{
font-family:yu-gothic-bold;
font-size:32px;
border-bottom: solid 1px #666666;
padding-bottom:18px;
position:relative;
}


.card-title::before{

}

.card-text{
font-family:yu-gothic-medium;
font-size:23px;
font-weight:normal;
padding-top:18px;
color:#2d2d2d;

}

.review-ellipse{
background:url(images/ellipse.png);
background-repeat:no-repeat;
background-position:left;
background-position-y:71%;
background-size:75px;

}

.card-body{
padding-left:0px !important;

}

.review-section .col-lg-1{
width:7%;
}
.review-section .col-lg-11{
width:93%;
}

.review-section{
background:url(images/review-bg.png);
background-repeat:no-repeat;
background-size:cover;
background-position:bottom;
padding-bottom:5rem;

}



/* CSS transactions */

.transactions-bg{
background-color:#DDE4FF;
clear:both;
}


.transactions h1{
color:#2d2d2d;
font-family:Futura, "Trebuchet MS", Arial, sans-serif;
font-size:48px;
text-align:center;
}

.transactions p{
color:#2d2d2d;
font-family:yu-gothic-medium;
font-size:20px;
text-align:center;
}

.transactions-bg .col-lg-2{
width:19%;
padding:20px;
}
.transactions2-bg .col-lg-2 .col-12{
width:19%;
padding:20px;
}

.transactions-col{
position:relative;
}

.transactions-col::after{
content:url('images/polygon.png');

position:absolute;
right: -13px;
  top: 64%;
}

/* CSS transactions-end */



/* flow of transactions */
.inquiry h1{
color:#2d2d2d;
font-family:yu-gothic-medium;
text-align:center;
font-size:15px;
padding: 50px 0px 20px;
}
.inquiry-content{
position:relative;
}

.inquiry-content:before{
content: "";
    position: absolute;
    background-color: #343162;
    height: 1px;
    width: 75%;
    top: 10%;
    margin-right: 0;
    margin-left: 0;
}

.inquiry-content img{
    z-index: 0;
    position: relative;
}
.numbers{
background:#FFFFFF;
width: 50px;
  height: 50px;
  line-height: 0.7em;
  font-size: 20px;
  font-family: Futura, "Trebuchet MS", Arial, sans-serif;
  color: #343162;
  font-weight: bold;
  border: 2px solid #343162;
}

/* flow of transactions end */

/* contact */
.c-position{
position:relative;}

.c-position img{
position:absolute;
right: 0px;
width: 100%;
max-width: 65%;
}

.contact h1 {
    color: #2d2d2d;
    font-family: Futura, "Trebuchet MS", Arial, sans-serif;
    font-size: 48px;
    text-align: center;
	margin-top:28%;
}

.contact2 p{
color:#ffffff;
font-family:yu-gothic-medium;
font-size:11px;
text-align:center;
}

.contact-form-bg{
background-color:#DDE4FF;
padding:5% 12%;
margin-top:6rem;

}
.footer{
position:relative;
}

.footer h1::before{
content:url('images/footer-text-top-border.png');
position:absolute;
left: 35px;
  top: -30px;

}

.footer h2::before{
content:url('images/footer-text-bottom-border.png');
position:absolute;
right: 35px;
  top: 0;

}



.footer-btm-bg{
background-color:#7785A0;
padding:5% 12% 2% 12%;

}


.footer-menu ul{
display:flex;
justify-content: space-between;
list-style-type:none;
}

.footer-menu ul li{
list-style-type:none;
color:#ffffff;
font-family:yu-gothic-medium;
font-size:14px;
padding:15px;
position:relative;

}

.footer-menu ul li::before{
content:'';
background-color:#FFFFFF;
width:1px;
height:50px;
position:absolute;
top:0;
left:-38%;
}

.footer-menu ul li:nth-child(1)::before{
background:transparent;
}

.footer-menu ul li a, .footer-menu ul li a:hover{
color:#ffffff;
text-decoration:none;
}

.contact-box{ 
width:25%;
background-color:#fff;
border-radius:50px;
border:solid 1px;
padding: 5px 7px;
margin-right:10px;
}

.contact-form-bg ul{
display:inline;
padding-left:10px;
}
.contact-form-bg ul li{
display:inline;

}

.contact-form-bg ul li:nth-child(1){
text-align:right;
padding-right:4%;
}


.icon-color{
color:#2d2d2d;


}


.contact-detail { 
  background-color: #343162;
  border-radius: 50px;
  border: solid 1px;
  padding: 5px 7px;
}
.contact-icon-color{
color:#ffffff;}

/* contact end */

/* map */
 .banner10{
background-image:url(images/map.png);
 background-position:bottom;
 background-repeat:no-repeat;
 background-size:cover;
 position:relative;
 height:486px;
 }               

.text-form ul li {
    list-style-type: none;
    display: inline-table;
    color:#343162;
    font-family: Futura, "Trebuchet MS", Arial, sans-serif;
    font-size: 26px;
    text-align: left;
}

.text-form p {
    font-family: yu-gothic-bold;
    color: #343162;
    font-size: 12px;
}

.form-btn {
    background: linear-gradient(4deg, rgba(52, 49, 98, 1) 0%, rgba(106, 99, 200, 1) 100%);
    color: #fff;
    padding: 15px;
    font-family: yu-gothic-bold;
    border-radius: 50px;
    font-size: 24px;
    margin-left: 10px;
    border: none;
	width:100%;
	max-width: 50%;
}

.form-control{
    display: inline;
    width: 50%;
   line-height: 2.5 !important;
}

.form-name h1{
color:#2d2d2d;
font-family: yu-gothic-bold;
text-align:right;
font-size:20px;
}

.form-name h2{
color:#fff;
font-family: yu-gothic-bold;
text-align:center;
font-size:20px;
padding: 9px 5px;
}


.form-name2 h2 {
    color: #2d2d2d;
    font-family: Futura, "Trebuchet MS", Arial, sans-serif;
    text-align: center;
    font-size: 20px;
    padding: 9px 5px;
}


.form-small-box {
    background: #343162 !important;
    width: 100%;
    max-width: 78%;
    border-radius: 10px;
    position: relative;
	
}

.form-small-box2 {
    background: #fff !important;
    width: 100%;
    max-width: 62%;
    border-radius: 10px;
    position: relative;
	
}

.form-check-input {
    width: 1.4em !important; 
    height: 1.4em !important;
	}
.form-check-input[type=checkbox] {
    border-radius: 0px;
}

/* map end */

/* footer */

.footer-main-txt{
margin-bottom:5rem;
}

.footer h1{
color:#fff;
font-family: yu-gothic-bold;
text-align:center;
font-size:32px;
padding-bottom:10px;
}
.footer h2{
color:#fff;
font-family: yu-gothic-bold;
text-align:center;
font-size:32px;
}

.footer-btn {
    background: #fff;
    color: #2d2d2d;
    padding:4%;
    font-family: yu-gothic-bold;
    font-size: 24px;
    margin-left: 10px;
    border: none;
	max-width:42%;
	width:100%;
}

.footer p{
color:#fff;
font-family:yu-gothic-medium;
text-align:center;
font-size:14px;
padding-top:10px;
}


.footer h4{
color:#fff;
font-family:yu-gothic-medium;
text-align:center;
font-size:14px;
padding-top:20px;
letter-spacing:2px;
}

/* footer end */

@media (min-width: 768px) {
    .navbar-expand-md .navbar-nav .nav-link {
        padding-right: 15px !important;
        padding-left: 15px !important;
		font-family:yu-gothic-medium;
		font-size:18px;
		text-align:center;
    }
	
	.navbar-second{
	font-family: Futura, "Trebuchet MS", Arial, sans-serif;
    font-size: 10px;
	color:#9D9D9D;}	
}



@media(min-width:1400px){

.banner-text ul li{
font-size:32px;
}

.banner-box{
max-width:83% !important;

}
.banner-box2{
max-width: 56% !important;
}
.banner-box3{
max-width:95% !important;
}
	
	
	
.banner-text h1{
font-size:40px !important;
margin-top:42.5% !important;
}
.banner-text h2{
font-size:88px !important;
}
.banner-text h3{
font-size:90px !important;
}

.banner-text h3 span{
font-size:98px !important;
}
.banner-text h3 .main-head{
font-size:128px !important;

}

.banner-text h3 .main-head:before{

bottom:-41.5px;
}

.banner4{

 background-size:87.4%;
 
 }
 
 .reason-rgb{
 margin-bottom:3%;
 }
 .reason-text{
 padding-bottom:6% !important;}
 
 .reason-text h2{
 margin-top:-17% !important;}
 
 .reason-text2{
 padding-top: 5.5%;
    padding-bottom: 5%;
 }
 
 .reason-text3{
 padding-top: 5.5%;
 
 }
 
 .reason-text4{
  padding-top: 5.5%;

 }
 
 .case-inner-box{
 margin-top:5%;
 }
 
 .case-small-text p{

line-height:2em;

}

.review-ellipse{

background-position-y:77%;


}
.card-text{
font-size:24px;
}


.footer h1::before{

left: 50px;
 

}


.footer h2::before{
right: 50px;

}

.pricing-inner-text h3::before{
left:45%;
}

.sp-shadow .pricing-inner-text h3::before{
left:43%;
}

.mission p{
font-size:20px;
}

.footer-menu ul li::before{
left:-50%;
}

.footer-btn{
max-width:38%;
}

.contact-form-bg ul li:nth-child(1){
padding-right:9%;
}

.text-form ul li{
font-size:28px;
}


}


@media(max-width:767px) {

.navbar-toggler-icon {
width: 2em !important;
    height: 2em !important;
	}
	
	.nav-btn {
	   margin-left: 0px;}


.banner-box {
margin-left:35px !important;
max-width: 100% !important;
}

.banner-text h1 {
    font-size: 16px !important;
	margin-top: 37%;

}

.fixed-top{
border-bottom:1px solid #dcdcdc;
}

.navbar-toggler{
background:transparent !important;
}

.navbar-brand img{
width:80%;
}

.banner-text-top{
margin-top:-4rem !important;
}

.top-banner{
margin-top:10rem;
}

.banner-text h2 {
font-size: 20px;
}

.banner-box2 {
max-width: 50%;
margin-left: 35px !important;
margin-top:5px;}

.banner-text h3 .main-head {
    font-size: 30px;
	}
.banner-text h3 span {
font-size: 24px;
}
.banner-box3 {
max-width:90% !important;
margin-left: 35px !important;
margin-top:5px;
}

.mission-bg{
margin-top:4rem;

background-position-y: 10px;
}

.banner-text h3 {
font-size:0px;}

.banner-text h3 .main-head:before {
bottom: -17px;}

.banner-text h3:before {
top: -7px;
}

.banner-text ul li{
font-size:20px;
}

.mission h1 {
font-size: 22px;
}
.mission p{
font-size: 14px;
}

.mission h1::before {
left: 36%;}

.achieve h1 {
font-size: 24px;
text-align:center;
}
.achieve p {
font-size: 16px;}

.achieve-img {
   margin-bottom: 0%; 
}

.achieve-bg-color{
background-image:url(images/achieve%20-bg.png);
background-position: center right;
background-repeat: no-repeat;
background-size:cover;
}
.flexible-bg-color {
    background-image: url(images/achieve%20-bg.png);
    background-position: center left;
    background-repeat: no-repeat;
    background-size:cover;
}

.achieve2 h1 {
font-size: 24px;
text-align:center;}

.achieve2 p {
font-size: 16px;
    padding: 5% 5% 2% 5%;}
	
.supports h6 {
font-size: 14px;
padding: 10% 2%;
line-height:2em;
}

.services h1 {
font-size: 34px;
}

.services h6 {
font-size: 16px;
}

.services p {
font-size: 16px;
}

.banner3 {
height: 450px;}

.server-box {
max-width: 100%;
height:100%;}

.server h1 {
font-size: 16px;
}

.server p {
font-size: 12px;}

.text-contact p {
font-size: 18px;
}

.contact-btn {
    max-width: 78%;
	font-size: 18px;
}

.contact-bg .contact p {
padding-left: 50px;
}
.text-contact ul li{
font-size: 18px;
}

.reason-text-top h1 {
font-size: 34px;
}
.reason-text-top p {
font-size: 16px;
}
.reason-z-index {
max-width: 42%;
    left: 31%;
    top: -2%;}


.reason-text h2 {
font-size: 18px;
}

.reason-text p{
font-size: 12px;
}
.reason-text2 h2 {
font-size: 18px;}

.reason-text2 p {
font-size: 12px;
}
.reason-text3 h2 {
font-size: 18px;
}
.reason-text3 p {
font-size: 12px;
}
.pricing h1 {
        font-size: 34px;}

.pricing h6 {
font-size: 16px;}

.pricing-box-bg {
margin:0px;}

.pricing-inner-text h2{
font-size: 26px;}
.pricing-inner-text h3 {
font-size: 26px;}


.sp-shadow .pricing-inner-text h3 {
font-size: 26px;}

.pricing-text-full ul li {
font-size: 12px;
}
.case-text h1{
font-size: 34px;
}

.case-text p {
font-size: 16px;}

.case-inner-text h1 {
    font-size: 26px;
	}

.case-inner-text h1 span {
font-size: 18px;}

.case-small-text h1 {
font-size: 15px;}


.case-bottom-text h5{
font-size: 18px;}

.review-text h1 {
font-size: 34px;
}

.review-text p{
font-size: 16px;
}

.card-title {
font-size:22px;}

.card-text{
font-size:18px;}

.transactions h1{
font-size: 34px;
}

.c-position img {
max-width:100%;}

.contact h1{
font-size: 34px;
}

.contact p {
font-size: 16px;
}

.form-name h1 {
font-size: 11px;
}

.form-name h2{
font-size: 11px;
}

.form-name2 h2{
font-size: 11px;
}

.footer-btm-bg {
padding: 5% 6% 2% 6%;}

.footer h1 {
font-size: 14px;}

.footer h2 {
font-size: 14px;}

.footer h2::before {
    right: -17px;
    top: -32px;
}
.footer h1::before {
    left: -17px;
    top: -20px;
}

.footer-btn {
max-width: 88%;
}

.text-contact2 .phone-number {
    font-size: 24px;
}
.text-contact2 ul li {
font-size: 25px;
}

.footer-menu ul {
      padding-left: 0px;
}

.footer-btm-bg {
    background-color: #7785A0;
   padding: 5% 3% 2% 3%;
}


.footer-menu ul li {
    padding: 5px;
	font-size: 10px;}

.footer-menu ul li::before {

    height: 26px; 
    left: -2%;	
}

.contact-form-bg {
    padding: 5% 3%;
}


.form-control {
font-size: 11px !important;
}


.contact-icon-color .fa-solid{
font-size:22px;}

.text-form ul li {
font-size: 29px;}



.transactions-col::after {
    content: url(images/polygon2.png);
    position: absolute;
   right: 146px;
   top: 14%;
display:none !important;
	}

.inquiry h1{
padding-top:15px;
}

.transactions-bg .col-lg-2{
    width: 100%;
    padding: 20px;
}


.inquiry-content:before {
top:8%;}

.offcanvas-collapse {
        top: 95px;}

.nav-btn {
     max-width: 69%;
}

.navbar-nav .nav-link.active{
    font-size: 14px;}

.form-btn {
max-width: 78%;
font-size: 18px;
}


.form-small-box {
    background: #343162 !important;
    width: 100%;
    max-width: 78%;
	}


.form-small-box2 {
    background: #fff !important;
    width: 100%;
    max-width: 78%;
}

}

@media (min-width: 375px) and (max-width: 400px) {

.banner-text h1 {
        font-size: 18px !important;
		}

.banner-text h2 {
        font-size: 43px;
    }

.banner-text h3 .main-head {
        font-size: 50px;
    }

.banner-text h3 span {
        font-size: 34px;
    }

.mission h1 {
	font-size: 18px;
        padding: 20% 5% 3% 5%;
    }

   
.mission p {
        font-size: 12px;
		padding: 3% 5% 0% 12%;
    }

.mission-bg {
    background-size: 86%;
	}

.mission-rgb {
    background: rgba(255, 255, 255, 0.78) !important;
    padding-left: 4%;
}


.mission h1::before {
width: 60px;
}

    .text-contact p {
        font-size: 14px;
    }

.server h1 {
        font-size: 13px;
    }

.achieve h1 {
        font-size: 20px;
        text-align: center;
    }

.achieve p {
        font-size: 14px;
    }


    .achieve2 h1 {
      font-size: 20px;
    }

.achieve2 p {
        font-size: 14px;
		}
		
    .supports h6 {
        font-size: 12px;
		}

.services h1 {
        font-size: 28px;
    }

    .services h6 {
        font-size: 12px;
    }

    .services p {
        font-size: 13px;
    }
    .banner3 {
        height: 372px;
    }

.contact-btn {
        max-width: 68%;
        font-size: 14px;
    }

.reason-text-top h1 {
        font-size: 28px;
    }

.reason-text-top p {
        font-size: 14px;
    }

.reason-text h2 {
        font-size: 16px;
    }
    .reason-text2 h2 {
        font-size: 16px;
    }

.reason-text3 h2 {
        font-size: 16px;
    }

.pricing h1 {
        font-size: 28px;
    }


    .pricing h6 {
        font-size: 14px;
    }
	
	
	.pricing-inner-text h1 {
	font-size: 18px;
	}
	
	.pricing-inner-text h6 {
	font-size: 18px;
	}

.pricing-inner-text h2 {
        font-size: 22px;
    }	
	
    .pricing-inner-text h3 {
        font-size: 22px;
    }	
	
	.sp-shadow .pricing-inner-text h3 {
        font-size: 22px;
    }
	
	    .case-text h1 {
        font-size: 28px;
    }
	
	
	.case-text p {
        font-size: 14px;
    }
	
	.case-inner-text h1 {
        font-size: 24px;
    }
	
	.case-inner-text h1 span {
        font-size: 16px;
    }
	
	.case-small-text h1 {
        font-size: 14px;
    }
	
	.case-small-text p {	
	font-size: 12px;
	}
	.case-bottom-text h5 {
        font-size: 16px;
    }
	
    .review-text h1 {
        font-size: 28px;
    }	
	
	    .review-text p {
        font-size: 14px;
    }
	
	.review-box {
	padding: 8% !important;}
	
	.card-title {
        font-size: 20px;
    }
	
	.card-text {
        font-size: 16px;
    }
	
	.transactions h1 {
        font-size: 28px;
    }
	
	.transactions p {
	font-size: 14px;}
	
	    .transactions-col::after {
        content: url(images/polygon2.png);
        position: absolute;
        right: 122px;
        top: 16%;
display:none !important;
    }
	    .contact h1 {
        font-size: 28px;
    }
	
	
	.contact p {
        font-size: 14px;
    }
	
	.form-small-box {   
	 max-width: 83%;
	 }
	 
	 .form-small-box2 {   
	 max-width: 83%;
	 }
	
	.form-name h2 {
        font-size: 10px;
    }
	
	.form-name2 h2 {
        font-size: 10px;
    }	
	
	.privacy-policy {
	font-size:12px;
	}
	.privacy-policy2 {
	font-size:12px;
	}
	
	.form-btn {
	padding: 9px;
	font-size: 20px;
	}
	
	.text-form ul li {
        font-size: 26px;
    }
	
	.footer h1 {
        font-size: 12px;
    }
	
	.footer h2 {
        font-size: 12px;
    }
	.footer-menu ul li {
         font-size: 8px;
    }
	
	.text-contact2 .phone-number {
        font-size: 18px;
    }
	
.text-contact2 ul li {
        font-size: 18px;
    }

.navbar-toggler-icon {
width: 2em !important;
    height: 2em !important;}
	
	
	.nav-btn {
	   margin-left: 0px;}

.banner10{
height:auto !important;
}

.text-form .contact-detail{
font-size:18px;}


}




@font-face {
  font-family: yu-gothic-bold;
  src: url(font/yu-gothic-bold.ttf);
}

@font-face {
  font-family: yu-gothic-medium;
  src: url(font/yu-gothic-medium.otf);
}


@font-face {
  font-family: futura;
  src: url(font/futura.ttf);
}