.s5-wrapper{
padding-bottom: 50px;
z-index: 1000;
overflow: hidden;
}
.s5-container{
overflow: hidden;
}
.s5-logo-img{   }
.img-s5-cover{
position: relative;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
}
.caption-img{
text-align: center!important;
box-sizing: border-box;
width: 100%;
font-family: Verdana,Geneva,sans-serif;
padding-top: 6px;
padding-bottom: 6px;
font-style: italic;
font-size: 17px !important;
line-height: 1.3 !important;
font-weight: 600 !important;
color: #5b9bd5;
}
.sub-contract-title{
position: absolute;
top: 0;
}
.first-lp-box{
text-align: left;
box-sizing: border-box;
font-family: 'Roboto', sans-serif;
display: block;
font-size: 17px ;
line-height: 1.3 ;
font-weight: 600 ;
color: #ffffff;
background-color: #5B9BD5;
border-radius: 10px;
padding: 10px;
position: relative;
top: 0;
width: 100%;
}
.first-lp-box::before{
content: "●";
text-align: center;
position: absolute;
color: #AFABAB;
left: 6.7px;
font-size: 10px; top: calc(100% - 5px);
z-index: 1;
}
.first-lp-box::after{
content: "";
text-align: center;
position: absolute;
width: 3px;
height: 900px;
background-color: #AFABAB;
color: #AFABAB;
left: 10px;
top: 0;
z-index: -1;
}
.normal-lp-box{
text-align: left;
box-sizing: border-box;
font-family: 'Roboto', sans-serif;
display: block;
font-size: 15px !important;
line-height: 1.3 !important;
font-weight: 500 !important;
color: #0070c0;
background-color: #BDD7EE;
border-radius: 5px;
padding: 10px;
width: 100%;
position: relative;
}
.normal-lp-box::before{
position: absolute;
content: "●";
text-align: center;
color: #AFABAB;
left: -5px;
font-size: 10px;
top: 50%;
transform: translateY(-50%);
z-index: 5;
}
.lp-box-2{ }
.txt-contract{
box-sizing: border-box;
font-family: 'Roboto', sans-serif;
line-height: 36px;
font-weight: 400;
display: block;
font-size: 18px ;
letter-spacing: 2px !important;
color: #70ad47;
position: absolute;
z-index: 100;
bottom: 90%;
width: 150%;
text-align: left;
left: 25%;
}
@media only screen and (max-width: 767px) {
.txt-contract{
bottom: 65%;
font-size: 15px; }
}
.sub-contract-arrow{
box-sizing: border-box;
font-family: 'Roboto', sans-serif;   transition: all 0.2s ease;
line-height: 36px;
font-weight: 400;
display: inline-block;
font-size: 18px !important;
letter-spacing: 2px !important;
color: #70ad47;
width: 20%;
}
.arrow{
color: #70ad47;
width: 100%; height: 100%;  }
.arrow-icon{
color: #70ad47; display: block;
font-size: 100px;
position: absolute;
top:50%; transform: translateY(-50%);
}
@media only screen and (max-width: 767px) {
.arrow-icon{
font-size: 90px;
}   }
.arrow-right-icon{
color: #4472C3;
display: block;
font-size: 70px;
position: absolute;
width: 100%;
height: auto;
left: 0;
top:50%;
transform: translateY(-50%);
padding-left: 10px;
}
@media only screen and (max-width: 767px) {
.arrow-right-icon{
font-size: 50px;
}
}
.right-arrow-txt{
width: 150%;
text-align: left;
box-sizing: border-box;
font-family: 'Roboto', sans-serif;
font-size: 13px;
line-height: 16px;
font-weight: 600; color: #4472c4; position: absolute;
left: -10%;
top: -30%; }
.txt-analysis{
width: 150%;
text-align: left;
box-sizing: border-box;
font-family: 'Roboto', sans-serif;
font-size: 13px;
line-height: 16px;
font-weight: 600; color: #4472c4; position: absolute;
left: -10%;
bottom: 80%; }
@media only screen and (max-width: 767px) {
.txt-analysis{
font-size: 10px;
bottom: 60%;
left:16%;
}
}
.first-box{
height: 200px;
width: 100%;
}
.box-1{
text-align: left;
box-sizing: border-box;
font-family: 'Roboto', sans-serif;  transition: all 0.2s ease;
margin-bottom: 7px; font-size: 17px !important;
line-height: 1.3 !important;
font-weight: 600 !important;
color: #ffffff;
background-color: #5B9BD5; border-radius: 5px;
width: 80%;
}
.arrow-1{
width: 20%;
}
.line-horizon{
height: 1px;
width: 100%;
background-color: #AFABAB;
position: absolute;
top:50%;
transform: translateY(-50%);
}
.line-2-container{
padding: 10px;
}
.line-2-last{ overflow: hidden;
}
.line-ver{
width: 50%;
height: 180px; position: absolute;
left: 100%;
top:50%;
border-left: 1px solid #AFABAB;   }
.line-ver-2{
width: 50%;
height: 100px;
background-color: #ffffff;
position: absolute;
left: 100%;
top:50%;
border-top: 1px solid #AFABAB;   }
.line-last-container{
}
.blank-box{
height: 10px;
width: 100%;
}
.line-horizon-last{ position: absolute;
height: 500px;
width: 200%;
left: 0;
top: 51%;
background-color: #ffffff;  }
.customer-column{
background-color: #E2F0D9;
box-sizing: border-box; height: 100%;
border-radius: 5px;  transition: all 0.5s ease;
}
.customer-column:hover{ box-shadow: 0 4px 8px 0px rgba(0, 0, 0, 0.2), 0 6px 20px 2px rgba(0, 0, 0, 0.19);
}
.img-customer{ top: -80px;
left: 0;
}
.customer-caption{   text-align: center!important;
box-sizing: border-box;
width: 100%;
font-family: Verdana,Geneva,sans-serif;
padding-top: 6px;
padding-bottom: 6px;
font-style: italic;
line-height: 17px;
color: #444;
font-size: 20px ;
font-weight: 600 !important;
text-transform: capitalize;
}
.customer-detail{
box-sizing: border-box; bottom: 26px;
width: 100%; margin-top: 250px;
padding: 0 5px 0 5px;
text-align: center;
font-family: 'Roboto', sans-serif; color: #111;
display: block;
font-size: 18px ;
line-height: 1.4 !important;
font-weight: 400 !important;
letter-spacing: 1px !important;
word-break: break-word;
}
@media only screen and (max-width: 500px) {
.customer-caption{
font-size: 10px!important;
}
.customer-detail{
font-size: 9px;
text-align: center!important;
box-sizing: border-box;
font-family: 'Roboto', sans-serif;   color: #111;
transition: all 0.2s ease;
line-height: 16px;
font-weight: 600;
display: inline-block;
}
.txt-contract{
font-size: 15px;
left: 50%;
z-index: 100;
}
}