@charset 'utf-8';

#nt_body > .nt-container { padding: 0; max-width: 100%;}
.page-content {}
.page-content article { position: relative;}
.page-content li,
.page-content dd,
.page-content td,
.page-content p { word-break: keep-all;}

.company { line-height: 1.2;}
.company .title-area { padding: 0 0 100px; text-align: center;}
.company .title-area h3 { font-size: 42px; font-weight: 500;}
.company .title-area p{ padding: 20px 0 0; font-size: 17px; font-weight: 300;}
.company .about {  padding: 0 0 100px; }
.company .about .txt {padding: 0 0 70px;}
.company .about .txt .p1 { font-size: 24px;}
.company .about .txt .p2 { padding: 15px 0 40px; font-size: 40px; font-weight: 500; }
.company .about .txt .p2 b { font-weight: 500; color: #003f7e;}
.company .about .txt .p3 { line-height: 1.7777;}
.company .about .flex { }
.company .about .flex .logo { order:2; display: flex; justify-content: center; align-items: center; padding: 0 20px; width: 48.07%; background: url(/img/es/company_bg_logo.gif) ; border: 1px solid #e1e1e1; }
.company .about .flex .info { display: flex; flex-wrap:wrap; order:1; margin: -20px 0 0; width: 48.07%; padding: 35px 0;}
.company .about .flex .info dt,
.company .about .flex .info dd { padding: 20px 0 ; border-bottom: 1px solid #e1e1e1; word-break: keep-all; }
.company .about .flex .info dt { width: 80px; font-weight: 500; color: #003f7e;  }
.company .about .flex .info dd { padding-left: 9%; width: calc(100% - 80px);}
.company .contact { padding: 70px 0 80px; margin: 0 0 40px; background: url(/img/es/company_bg.jpg) no-repeat center / cover;}
.company .contact p { color: #fff; text-align: center; font-size: 20px; line-height: 1.6;  }
.company .contact a { display: block; position: absolute; left: 50%; bottom: 0; transform: translate(-50%, 50%); width: 350px; height: 80px; color: #fff; text-align: center; line-height: 80px; background: #f03728;}
.company .contact a:hover { background:#003f7e}
.company .contact a:after { content:''; display: block; position: absolute; left: 0; top: 0; z-index: -1; width: 100%; height: 100%; background: #f3442d; transition:.3s }
.company .contact a:hover:after { opacity:1; border-bottom-right-radius:60% 70%}

.company .location { padding: 100px 0;}
.company .location table { margin: 20px 0 0;}
.company .location table th,
.company .location table td { padding: 20px 15px; border: 1px solid #e1e1e1; }
.company .location table th { width: 200px; font-weight: 500; text-align: center; background: #f9f9f9;}
.company .location table td {  }
.company .location table td span { display: inline-block; position: relative; top: -2px; margin: 0 10px 0 0; height: 18px; font-size: 14px; line-height: 18px; font-weight: 300; color: #fff; text-align: center; color: #fff;}
.company .location table td span.circle{  width: 18px; border-radius: 50%;  }
.company .location table td span.square { width: 40px;   }
.company .location table td span.blue { background: #053a9c;}
.company .location table td span.blue2 { background: #178fff;}
.company .location table td span.green { background: #32b16c;}
.company .location table td span.orange { background: #ff7e00;}
.company .location table td .flex { justify-content: left; flex-wrap:wrap}
.company .location table td dt { padding: 0 5px 0 0;}
.company .location table td ul { padding: 10px 0 0 50px; max-width: 900px;}
.company .location table td ul li { padding: 0 30px 5px 0;}

@media (max-width:991px){
    .company .title-area { padding: 0 0 90px;}
    .company .title-area h3 { font-size: 40px;}
    .company .about {  padding: 0 0 90px; }
    .company .location { padding: 90px 0;}
    .company .about .txt { padding: 0 0 65px; }
    .company .about .txt .p1 { font-size: 16px;}
    .company .about .txt .p2 { padding: 15px 0 35px; font-size: 34px; }
    .company .about .flex .info dd { padding-left: 4%;}
    .company .about .flex .info{padding: 0;}
    .company .contact a { width: 320px; height: 70px; line-height: 70px;}


}
@media (max-width:768px){
    .company .title-area { padding: 0 0 65px;}
    .company .title-area h3 { font-size: 38px;}

    .company .about {  padding: 0 0 70px; }
    .company .location { padding: 70px 0;}
    .company .about .txt { padding: 0 0 60px; }
    .company .about .txt .p2 { padding: 15px 0 30px; font-size: 25px;}
    .company .about .flex { flex-direction: column;}
    .company .about .flex .logo { order:1; padding: 50px 20px; margin: 0 0 20px;  width: 100%;}
    .company .about .flex .logo img {  max-width: 200px !important;}
    .company .about .flex .info { order:1; margin: 0; width: 100%;}
    .company .about .flex .info dt,
    .company .about .flex .info dd { padding: 15px 0;}
    .company .about .flex .info dd { padding-left: 4%; }
    .company .contact  { padding: 60px 0 70px;}
    .company .contact a { width: 300px; height: 64px; line-height: 64px;}
    .company .location table th { width: 140px;}
    .company .location table td dt { padding: 0 0 10px ; width: 100%; }
    .company .location table td ul { padding: 10px 0 0;}

}

@media (max-width:576px){
    .company .title-area { padding: 0 0 50px;}
    .company .title-area h3 { font-size: 34px;}
    .company .title-area p{ font-size: 15px; }
    .company .about {  padding: 0 0 60px; }
    .company .location { padding: 60px 0;}
    .company .about .txt { padding: 0 0 50px; }
    .company .about .txt .p2 { padding: 20px 0 30px; font-size: 28px;}
    .company .contact  { padding: 50px 0 60px;}
    .company .contact p { font-size: 18px;}
    .company .contact a { width: 260px; height: 56px; line-height: 56px; font-size: 16px;}
    .company .location table tr { display: block;}
    .company .location table tr:first-of-type { margin-bottom: 15px;}
    .company .location table th,
    .company .location table td { display: block; width: 100%; padding: 15px; margin-top: -1px;}
    /* .company .location table th { width: 120px; } */
    .company .location table td ul li { width: 100%; padding: 0 0 5px 50px; text-indent: -50px;}
    .company .location table td span { top: 0; text-indent: 0;}
}

@media (max-width:480px){
    .company .title-area { padding: 0 0 40px;}
    .company .title-area h3 { font-size: 28px;}
    .company .about {  padding: 0 0 50px; }
    .company .location { padding: 50px 0;}
    .company .about .txt { padding: 0 0 40px; }
    .company .about .txt .p2 {padding: 20px 0 25px;  font-size: 26px; }
    .company .contact a { width: 240px; height: 50px; line-height: 50px; font-size: 16px;}
    .company .location table th,
    .company .location table td { padding: 10px;}

}