@charset "utf-8";
/* CSS Document */
#system-message-container{ display:none;}
html { scroll-behavior: smooth;}
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box; }
body {  font-family: 'autorlight'; font-size: 20px;} 
.thankyou{ color:#ffffff;}
/* HEADER
========================================================================*/
header { }
.logo{ position: absolute; right: 0; top: 30px;}
.logo img{ width: 150px;}

/* BANNER
========================================================================*/
.banner { position: relative;}
.bannerTxt{ position:absolute; width: 100%; left: 0; top: 50%; margin-top: -80px;}
.bannerTxt h2{ color:#ffffff;font-size: 60px; line-height: 70px; margin-bottom: 15px;  font-family: 'glancesans-bold';}
.bannerTxt h2 span{ color:#F6E92F;}
/* CONTAINER
========================================================================*/
.aboutWrap{ position: relative; padding: 80px 0;}
.aboutWrap .aboutInner{ position: relative;}
.aboutWrap .aboutInner .aboutLeft{ width: 45%; float: left; margin-right: 5%;}
.aboutWrap .aboutInner .aboutLeft h2{}
.aboutWrap .aboutInner .aboutLeft h3{}
.aboutWrap .aboutInner .aboutLeft h4{}
.aboutWrap .aboutInner .aboutRight{ width: 50%; float: left;}
.aboutWrap .aboutInner ul{ margin-top: 60px;}
.aboutWrap .aboutInner ul li{ width: 25%; float: left; text-align: center;}
.aboutWrap .aboutInner ul li .num{ width: 150px; height: 150px; background: #0071BB; border-radius: 50%; margin: 0 auto; font-family: 'glancesans-bold'; font-size: 70px; line-height: 150px; color: #ffffff; }
.aboutWrap .aboutInner ul li .text{   line-height: 25px; margin-top: 15px;font-family: 'autormedium';}

.realWrap{ position: relative; padding: 250px 0 250px 0;  z-index: 5;} 
.realWrap .background{ width: 100%; top:-250px; left: 0; position: absolute;z-index: 1;}
.realWrap .realInner{ position: relative;z-index: 5;}
.realWrap .realInner .realLeft { width: 45%; float: left; margin-right: 5%;}
.realWrap .realInner .realLeft img{ max-width: 80%; margin-top: 30px;}
.realWrap .realInner .realRight{ width: 50%; float: left;color: #ffffff;}
.realWrap .realInner .realRight h3{ color: #ffffff; margin-bottom: 40px;}
.realWrap .realInner .realRight h3 span{color: #ffffff; text-transform: uppercase; color: #F6E92F;}

.highlightWrap{ position: relative;  padding: 80px 0 200px 0; z-index: 8;} 
.highlightWrap .highlightInner{}
.highlightWrap .highlightInner h3{ color: #000000; margin-bottom: 50px;}
.highlightWrap .highlightInner h3 span{ color: #0F4B8B;}
.highlightWrap .highlightInner .highlightLeft{ width: 45%; float: left;}
.highlightWrap .highlightInner .highlightLeft img{ width: 100%;}
.highlightWrap .highlightInner .highlightRight{ width: 55%; float: left;}
.highlightWrap .highlightInner .highlightRight{}
.highlightWrap .highlightInner .highlightRight ul{}
.highlightWrap .highlightInner .highlightRight ul li{ display:flex;align-items: center; }
.highlightWrap .highlightInner .highlightRight ul li .num{ max-width: 160px; flex: 1; color: #F6E92F; background: #0F4B8B; text-align: center; font-size: 74px; font-family: 'glancesans-bold'; padding: 20px 0;}
.highlightWrap .highlightInner .highlightRight ul li .text{flex: 1; padding: 10px 20px; font-size: 25px; line-height: 28px;}
.highlightWrap .highlightInner .highlightRight ul li:nth-child(odd){ background: #D9F1FF;}
.highlightWrap .highlightInner .highlightRight ul li:nth-child(even){ background: #E5E5E5;flex-direction: row-reverse;}

.adviceWrap{ position: relative; background: #f1f1f1;}
.adviceWrap .adviceInner{}
.adviceWrap .adviceInner .adviceLeft{ width: 45%; float: left; margin-right: 5%;}
.adviceWrap .adviceInner .adviceLeft img{ max-width: 100%; width: 90%; margin-top: -117px;}
.adviceWrap .adviceInner .adviceRight{ width: 50%; float: left; padding: 80px 0;}
.adviceWrap .adviceInner .adviceRight h3{}
.adviceWrap .adviceInner .adviceRight h3 span{}
.adviceWrap .adviceInner .adviceRight .formWrap{ margin-top: 30px;}
.inputBox{ position: relative; margin-bottom: 25px;}
.inputBox input{ width: 100%; border: 1px solid #0F4B8B; border-radius: 15px; padding: 15px;font-size: 18px;font-family: 'autorlight';}
.inputBox textarea{ width: 100%; border: 1px solid #0F4B8B; border-radius: 15px; padding: 15px;font-size: 18px;font-family: 'autorlight';}
.inputSubmit{ position: relative; text-align: center; margin-top: 40px;}
.inputSubmit input{ background: #0F4B8B; padding: 18px 40px; font-size: 24px; text-transform: uppercase; color: #ffffff; border-radius: 15px;font-family: 'autormedium';}
.inputBox .formError { color: #cb0000; font-weight: normal; font-size: 15px; position: absolute; left: 15px; bottom: -21px;}
/* FOOTER
========================================================================*/
footer{ position: relative; padding: 80px 0; background: #0F4B8B;}
footer .footerWrap{}
footer .footerWrap .footerLeft{ width: 40%; margin-right: 5%; float: left; text-align: center;}
footer .footerWrap .footerLeft img{ width: 60%;}
footer .footerWrap .footerRight{ width: 55%; float: left; color: #FFFFFF; font-size: 24px;}
footer .footerWrap .footerRight ul{}
footer .footerWrap .footerRight ul li{ margin-bottom: 30px;}
footer .footerWrap .footerRight ul li:last-child{ margin-bottom: 0;}
footer .footerWrap .footerRight ul li a{ color: #FFFFFF;}

/* HEADINGS
========================================================================*/
h1, h2, h3, h4, h5, h6 { }
h1 { font-size: 26px; line-height: 27px; }
h2 { font-size: 30px; line-height: 34px; color: #000000; margin-bottom: 0;font-family: 'autormedium';}
h3 { font-size: 60px; line-height: 70px; color: #0071BB; margin-bottom: 10px; font-family: 'glancesans-bold';  }
h4 { font-size: 28px; line-height: 32px; color: #000000; margin-bottom: 0; font-family: 'autormedium';}
h5 { font-size: 16px; line-height: 17px; }
h6 { font-size: 14px; line-height: 16px; }
p { margin-top: 10px; }
p:first-child { margin: 0; }
/* FORM
========================================================================*/
label { }
input, textarea, select { font-size: 15px; background: #FFF; border: 1px solid #dadada; padding: 15px; margin: 0; }
input:focus, textarea:focus { border-color: #c1c1c1; background: #FFF; }

/* Font Family
=========================================================================*/
@font-face {
    font-family: 'autorlight';
    src: url('fonts/autor-light-webfont.eot');
    src: url('fonts/autor-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/autor-light-webfont.woff') format('woff'),
         url('fonts/autor-light-webfont.ttf') format('truetype'),
         url('fonts/autor-light-webfont.svg#autorlight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'autormedium';
    src: url('fonts/autor-medium-webfont.eot');
    src: url('fonts/autor-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/autor-medium-webfont.woff') format('woff'),
         url('fonts/autor-medium-webfont.ttf') format('truetype'),
         url('fonts/autor-medium-webfont.svg#autormedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'autorbold';
    src: url('fonts/autor-bold-webfont.eot');
    src: url('fonts/autor-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/autor-bold-webfont.woff') format('woff'),
         url('fonts/autor-bold-webfont.ttf') format('truetype'),
         url('fonts/autor-bold-webfont.svg#autorbold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'glancesans-mediumregular';
    src: url('fonts/glancesans-medium-webfont.eot');
    src: url('fonts/glancesans-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/glancesans-medium-webfont.woff') format('woff'),
         url('fonts/glancesans-medium-webfont.ttf') format('truetype'),
         url('fonts/glancesans-medium-webfont.svg#glancesans-mediumregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'glancesans-bold';
    src: url('fonts/glancesans-bold-webfont.eot');
    src: url('fonts/glancesans-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/glancesans-bold-webfont.woff') format('woff'),
         url('fonts/glancesans-bold-webfont.ttf') format('truetype'),
         url('fonts/glancesans-bold-webfont.svg#glancesans-boldregular') format('svg');
    font-weight: normal;
    font-style: normal;
}




