/* ---------- Contact ---------- */
.ct-section{background:#fff;padding:70px 0 80px;overflow:hidden;position: relative;}
.ct-section .container{ max-width:1000px; }

.ct-section:before{
    position: absolute;
    content: '';
    height: 150px;
    width: 130px;
    background: url(/images/bnr-bef.png) no-repeat;
    background-size: contain;
    top: 20px;
    left: 0;
}

.ct-section:after{
    position: absolute;
    content: '';
    height: 150px;
    width: 120px;
    background: url(/images/bnr-aft.png) no-repeat;
    background-size: contain;
    bottom: 20px;
    right: 0;
}

.ct-section .ct-card{
  height:100%; background:#F4F4F4; border-radius:14px; padding:30px 28px;
}
.ct-section .ct-h{
  font-size: 26px;
  font-weight:600;
  color: #000000;
  margin:0 0 6px;
}
.ct-section .ct-sub{
  font: 400 14px/1.6 "Inter",sans-serif;
  color:var(--txt-color);
  margin:0 0 22px;
}

/* fields */
.ct-section .ct-field{ position:relative; }
.ct-section .ct-input{
  display:block; width:100%; height:44px; padding:0 40px 0 14px;
  background:#fff; border:1px solid #E6E6E6; border-radius:6px; outline:0; box-shadow:none;
  font:400 12px/1 "Inter",sans-serif; color:var(--txt-color); transition:border-color .3s;
}
.ct-section .ct-input:focus{ border-color:var(--btn-color); }
.ct-section .ct-input::placeholder{ 
    color:var(--h-color);
    font-size: 14px;
}
.ct-section textarea.ct-input{ height:130px; padding:14px; line-height:1.6; resize:vertical; }
.ct-section .ct-ico-r{
  position:absolute; right:14px; top:50%; transform:translateY(-50%);
  display:flex; color:var(--h-color); pointer-events:none;
}
.ct-section select.ct-input{
  appearance:none; -webkit-appearance:none; cursor:pointer;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23484848' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center / 12px;
}
.ct-section select.ct-input:invalid{ color:var(--h-color); }

.ct-section .ct-captcha{ display:flex; align-items:center; height:44px; }
.ct-section .ct-captcha img{ max-height:44px; width:auto; border-radius:6px; }

/* button */
.ct-section .ct-btn{
  width:100%; height:46px; border:0; border-radius:15px; cursor:pointer;
  display:flex; align-items:center; justify-content:center; gap:8px;
  background:var(--btn-color); color:var(--color2);
  font:700 11px/1 "Inter",sans-serif; letter-spacing:.04em; text-transform:uppercase;
  transition:background .3s;
}
.ct-section .ct-btn:hover{ background:var(--color1); }


.ct-section .form_success,
.ct-section .err_msg_1{ font:500 12px/1.5 "Inter",sans-serif; margin-bottom:10px; }

/* office info */
.ct-section .ct-list{ list-style:none; margin:0; padding:0; }
.ct-section .ct-list li{ display:flex; align-items:flex-start; gap:14px; margin-bottom:22px; }
.ct-section .ct-list li:last-child{ margin-bottom:0; }
.ct-section .ct-ico{
  flex: 0 0 50px;
  width: 50px;
  height: 50px;
  border-radius: 10px;
  background: #fff;
  color: var(--btn-color);
  display:flex;
  align-items:center;
  justify-content:center;
}
.ct-section .ct-list strong{
  display:block;
  margin-bottom:5px;
  font: 600 16px/1.3 "Inter",sans-serif;
  color: #000000;
}
.ct-section .ct-t{
  display:block;
  font: 400 13px/1.7 "Inter",sans-serif;
  color:var(--txt-color);
}
.ct-section .ct-t a{color:inherit;text-decoration:none;transition: all ease .3s;}
.ct-section .ct-t a:hover{ color:var(--btn-color); }
.ct-section .ct-t em{ font-style:normal; color:var(--btn-color); }

@media (max-width:991px){
    .ct-section{ padding:50px 0 60px; }
    .ct-section .ct-card{ padding:26px 20px; }
  
    .ct-section .ct-list li {
        margin: 19px 0;
    }
    
    .ct-section:before {
        top: 0;
        width: 100px;
        height: 100px;
    }
    
    .cont-map iframe {
        height: 300px;
    }
  
}

@media (max-width:767px){

    .ct-section:before {
        top: 0;
        width: 100px;
        height: 100px;
        z-index: 0;
    }
    
    .ct-section .ct-h {
        font-size: 24px;
    }
    
    .ct-section .ct-sub {
        font-size: 13px;
        margin-bottom: 10px;
    }
    
    .ct-section .ct-input::placeholder {
        font-size: 12px;
    }
    
    .ct-section .ct-t {
        font-size: 12px;
        line-height: 1.4;
    }
    
    .ct-section:after {
        height: 100px;
        width: 80px;
        bottom: 0;
    }
    
    .cont-map iframe {
        height: 250px;
    }
    
    .ct-section .ct-list li {
        margin: 19px 0;
    }
    
}
