.contact_banner{
    padding: 21rem 0 20.5rem;
}
.contact_banner .tcon h1{
    color: white;
    font-weight: 300;
    margin-top: 2.5rem;
}
.contact_banner .tcon h1 em{
    font-style: normal;
}
.contact_main{
    padding: 11.4rem 0 9.5rem;
    background-color: #FFFEF9;
}
.contact_main .left{
    width: 41.08%;
}
.contact_main .right{
    width: 50%;
}
.contact_main .left .tcon{
    margin-bottom: 4.5rem;
}
.contact_main .left .tcon p{
    max-width: 49.6rem;
}
.contact_main .left .item .icon{
    width: 5.9rem;
    height: 5.9rem;
    min-width: 5.9rem;
    border-radius: 1.2rem;
    margin-right: 2rem;
}
.contact_main .left .item .icon img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.contact_main .left .item .title{
    font-size: 2.4rem;
    font-weight: 600;
    color: #2d2d2d;
    display: block;
    padding-top: 1.5rem;
    margin-bottom: 1rem;
}
.contact_main .left .item a{
    font-size: 1.7rem;
    color: #c19a5b;
    transition: all 0.3s;
}
.contact_main .left .item a:hover{
    text-decoration: underline;
}
.contact_main .left .item + .item{
    margin-top: 3.3rem;
}
.contact_main .left .item p{
    font-size: 1.8rem;
    color: #666666;
}
.contact_main .left .item p + p{
    margin-top: 0.5rem;
}
.contact_main .left .office_hours{
    margin-top: 6rem;
    padding: 2rem 2.8rem;
    background-color: #F7F4EF;
    border: 1px solid #bfb7af4d;
    border-radius: 1.2rem;
}
.contact_main .left .office_hours .title_con{
    font-size: 2.3rem;
    font-weight: 700;
    color: #2d2d2d;
    font-family: 'Cormorant Garamond', serif;
    display: flex;
    align-items: center;
    gap: 0.8rem;
    margin-bottom: 2rem;
}
.contact_main .left .office_hours .title_con:before{
    content: "";
    width: 2rem;
    height: 2rem;
    background: url('../img/contact_clock.svg') no-repeat center/contain;
    display: inline-block;
}
.contact_main .left .office_hours .col{
    display: flex;
    justify-content: space-between;
    padding: 1.3rem 0;
    border-bottom: 1px solid #d6d2cc;
}
.contact_main .left .office_hours .col p{
    font-size: 1.5rem;
    font-weight: 600;
    color: #2d2d2d;
}
.contact_main .left .office_hours .col span{
    color: #444;
    font-size: 1.5rem;
}
.contact_main .left .office_hours .cols .col:last-of-type{
    padding-bottom: 0.5rem;
    border-bottom: none;
}

.contact_main .right .form{
    padding: 4rem 4.7rem;
    border-radius: 1.6rem;
    background-color: white;
    border: 1px solid #eae8e5;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
}
.contact_main .right .form h3{
    font-size: 3.6rem;
    font-weight: 700;
    color: #2d2d2d;
    margin-bottom: 1.6rem;
}
.contact_main .right .form p{
    font-size: 1.6rem;
    color: #5a5650;
    margin-bottom: 3.5rem;
}

.contact_main .right form{
  display: flex;
  flex-flow: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 2.8rem 0;
}
.contact_main .right form span{
  display: block;
  width: 100%;
}
.contact_main .right form span label{
    font-size: 1.6rem;
    font-weight: 500;
    color: #2d2d2d;
    display: block;
    margin-bottom: 1rem;
}
.contact_main .right form span label i{
    color: var(--primary);
}
.contact_main .right form span.col2{
  width: 48.3%;
}
.contact_main .right form input:not([type="submit"]){
  line-height: 5rem;
  border: 1px solid #e8e2d9;
  padding: 0 2rem;
  background-color: #F9F8F4;
  border-radius: 0.52rem;
  width: 100%;
  background-color: #FFFFFF;
}
.contact_main .right form input:not([type="submit"]):focus{
    border-color: var(--primary);
}

.contact_main .right form select{
  line-height: 5.5rem;
  padding: 0 2rem;
  border-radius: 0.52rem;
  width: 100%;
  border: none;
  outline: none;
  font-size: 1.7rem;
  color: #5a5650;
  background: url('../img/select_brown.svg') no-repeat right 2rem center/1.6rem;
  background-color: #F9F8F4;
}

.contact_main .right form textarea{
  padding: 2rem;
  border-radius: 0.52rem;
  width: 100%;
  height: 15rem;
  background-color: white;
  border: 1px solid #e8e2d9;
}
.contact_main .right form textarea:focus{
    border-color: var(--primary);
}
.contact_main .right form .btn{
  line-height: 5.6rem;
  padding: 0 6rem;
  font-weight: 400;
  font-size: 1.6rem;
  display: flex;
  align-items: center;
  width: 100%;
  color: white;
  gap: 1rem;
  font-size: 1.6rem;
}
.contact_main .right form .btn:before{
    content: "";
    width: 1.8rem;
    height: 1.8rem;
    background: url('../img/contact_fly.svg') no-repeat center/contain;
}
.contact_main .right form .btn input[type="submit"]{
    display: none;
}
.contact_free{
    padding: 9.5rem 0 12rem;
    background: #FFFEF9;
}
.contact_free .tcon h2{
    max-width: 62rem;
}
.contact_free .tcon p{
    max-width: 70rem;
    margin-left: auto;
    margin-right: auto;
}
.contact_free .main{
    margin-top: 6rem;
}
.contact_free .main ul{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 3.6rem;
}
.contact_free .main ul li{
    padding: 2.8rem 3.3rem;
    border: 1px solid #eae8e5;
    border-radius: 1.2rem;
    background-color: white;
    display: flex;
    align-items: center;
    gap: 2.9rem;
    transition: all 0.3s;
}
.contact_free .main ul li:hover{
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
}
.contact_free .main ul li .img{
    width: 6.5rem;
    height: 6.5rem;
    border-radius: 1.2rem;
    background-color: #C19A5B;
    display: flex;
    align-items: center;
    justify-content: center;
}
.contact_free .main ul li .img img{
    width: 60%;
    height: 60%;
    object-fit: contain;
}
.contact_free .main ul li p{
    font-size: 2.4rem;
    font-weight: 700;
    color: #2d2d2d;
    font-family: 'Cormorant Garamond', serif;
}
.contact_find{
    padding: 12rem 0;
    background-color: #F7F4EF;
}
.contact_find .main{
    padding: 6.2rem 7.4rem;
    border-radius: 2rem;
    background-color: white;
}
.contact_find .main .info{
    width: 46.69%;
}
.contact_find .main .info .btn{
    margin-top: 3.5rem;
    line-height: 6.2rem;
    padding: 0 3.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}
.contact_find .main .info .btn:before{
    content: "";
    width: 1.8rem;
    height: 1.8rem;
    background: url('../img/contact_search.svg') no-repeat center/contain;
}
.contact_find .main .img{
    width: 44.17%;
    border-radius: 5rem;
    aspect-ratio: 54/40;
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
    .contact_banner{
        padding: 14rem 0 13rem;
    }
    .contact_main{
        padding: 9rem 0 8rem;
    }
    .contact_main .left{
        width: 44%;
    }
    .contact_main .right{
        width: 52%;
    }
    .contact_main .left .tcon{
        margin-bottom: 3.6rem;
    }
    .contact_main .left .tcon p{
        max-width: none;
    }
    .contact_main .left .item .icon{
        width: 5.2rem;
        height: 5.2rem;
        min-width: 5.2rem;
        margin-right: 1.6rem;
    }
    .contact_main .left .item .title{
        font-size: 2.2rem;
        padding-top: 0.8rem;
    }
    .contact_main .left .office_hours{
        margin-top: 4.5rem;
        padding: 2rem 2.2rem;
    }
    .contact_main .right .form{
        padding: 3.4rem 3.2rem;
    }
    .contact_main .right .form h3{
        font-size: 3.2rem;
    }
    .contact_main .right .form p{
        margin-bottom: 2.8rem;
    }
    .contact_main .right form{
        gap: 2.2rem 0;
    }
    .contact_main .right form .btn{
        padding: 0 4rem;
    }
    .contact_free{
        padding: 8rem 0 9.5rem;
    }
    .contact_free .main{
        margin-top: 4.6rem;
    }
    .contact_free .main ul{
        gap: 2.4rem;
    }
    .contact_free .main ul li{
        padding: 2.4rem 2.2rem;
        gap: 1.8rem;
    }
    .contact_free .main ul li .img{
        width: 5.4rem;
        height: 5.4rem;
        min-width: 5.4rem;
    }
    .contact_free .main ul li p{
        font-size: 2.1rem;
    }
    .contact_find{
        padding: 9rem 0;
    }
    .contact_find .main{
        padding: 4.6rem 4rem;
    }
    .contact_find .main .info{
        width: 48%;
    }
    .contact_find .main .img{
        width: 46%;
        border-radius: 3rem;
    }
}

@media screen and (max-width: 768px) {
    .contact_banner{
        padding: 60px 0 50px;
    }
    .contact_banner .tcon h1{
        margin-top: 12px;
    }
    .contact_main{
        padding: 50px 0 40px;
    }
    .contact_main .main{
        flex-wrap: wrap;
    }
    .contact_main .left,
    .contact_main .right{
        width: 100%;
    }
    .contact_main .right{
        margin-top: 32px;
    }
    .contact_main .left .tcon{
        margin-bottom: 26px;
    }
    .contact_main .left .tcon p{
        max-width: none;
    }
    .contact_main .left .item .icon{
        width: 44px;
        height: 44px;
        min-width: 44px;
        border-radius: 10px;
        margin-right: 14px;
    }
    .contact_main .left .item .title{
        font-size: 17px;
        padding-top: 0;
        margin-bottom: 6px;
    }
    .contact_main .left .item a{
        font-size: 14px;
        word-break: break-word;
    }
    .contact_main .left .item p{
        font-size: 14px;
    }
    .contact_main .left .item + .item{
        margin-top: 22px;
    }
    .contact_main .left .office_hours{
        margin-top: 30px;
        padding: 16px 18px;
        border-radius: 10px;
    }
    .contact_main .left .office_hours .title_con{
        font-size: 18px;
        margin-bottom: 14px;
    }
    .contact_main .left .office_hours .title_con:before{
        width: 16px;
        height: 16px;
    }
    .contact_main .left .office_hours .col{
        padding: 10px 0;
        gap: 12px;
    }
    .contact_main .left .office_hours .col p,
    .contact_main .left .office_hours .col span{
        font-size: 13px;
    }
    .contact_main .right .form{
        padding: 24px 20px;
        border-radius: 12px;
    }
    .contact_main .right .form h3{
        font-size: 24px;
        line-height: 1.3;
        margin-bottom: 10px;
    }
    .contact_main .right .form p{
        font-size: 14px;
        margin-bottom: 22px;
    }
    .contact_main .right form{
        gap: 16px 0;
    }
    .contact_main .right form span.col2{
        width: 100%;
    }
    .contact_main .right form span label{
        font-size: 14px;
        margin-bottom: 6px;
    }
    .contact_main .right form input:not([type="submit"]){
        line-height: 42px;
        font-size: 14px;
        padding: 0 14px;
    }
    .contact_main .right form select{
        line-height: 44px;
        font-size: 14px;
        padding: 0 14px;
        background-position: right 14px center;
        background-size: 12px;
    }
    .contact_main .right form textarea{
        height: 100px;
        padding: 14px;
        font-size: 14px;
    }
    .contact_main .right form .btn{
        line-height: 44px;
        padding: 0 20px;
        font-size: 14px;
        justify-content: center;
        gap: 8px;
    }
    .contact_main .right form .btn:before{
        width: 14px;
        height: 14px;
    }
    .contact_free{
        padding: 40px 0 50px;
    }
    .contact_free .tcon h2,
    .contact_free .tcon p{
        max-width: none;
    }
    .contact_free .main{
        margin-top: 26px;
    }
    .contact_free .main ul{
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .contact_free .main ul li{
        padding: 16px 18px;
        gap: 14px;
        border-radius: 10px;
    }
    .contact_free .main ul li .img{
        width: 46px;
        height: 46px;
        min-width: 46px;
        border-radius: 10px;
    }
    .contact_free .main ul li p{
        font-size: 18px;
    }
    .contact_find{
        padding: 50px 0;
    }
    .contact_find .main{
        padding: 24px 20px;
        border-radius: 14px;
        flex-wrap: wrap;
    }
    .contact_find .main .info,
    .contact_find .main .img{
        width: 100%;
    }
    .contact_find .main .info .btn{
        margin-top: 20px;
        line-height: 42px;
        padding: 0 20px;
        justify-content: center;
        gap: 8px;
    }
    .contact_find .main .info .btn:before{
        width: 14px;
        height: 14px;
    }
    .contact_find .main .img{
        margin-top: 24px;
        border-radius: 14px;
    }
}