#pic-topic.contact::after{content:""; width:100%; height:100%; background:url("../images/pic-contact.jpg") no-repeat; background-size:100%; position:absolute; z-index:-3; opacity:.5; top:0; left:0;}

#top-head{padding:10px 25px 0 25px;}
#top-head .lang{right:25px;}
#contact{width:100%; margin:20px 0 0 0; padding:0; display:block; float:left; position:relative;}
#contact .address{width:50%; margin:0; padding:40px 35px; text-align:left; line-height:1.2; color:#000; border-radius:10px; overflow:hidden; background:#FFF; display:block; float:left; font-weight:300;}
#contact .address .logo{width:100%; margin-bottom:20px; text-align:left; display:inline-block;}
#contact .address .logo img{width:280px; display:inline-block;}
#contact .address h3{margin:15px 0; font-weight:600; color:#6668AA; display:inline-block;}
#contact .address h5{margin:0 0 15px 0; font-weight:500; line-height:1.3; display:inline-block;}
#contact .address p{margin:0 0 15px 0; font-size:1.3em; display:inline-block; position:relative;}
#contact .address p a{line-height:32px; color:#000; position:relative;}
/* #contact .address p a::before{content:""; width:29px; height:29px; background-repeat:no-repeat; position:absolute; left:0; top:2px; display:block;}
#contact .address p a.fb::before{background:url(../images/icon_facebook_red.png); background-size:100%;}
#contact .address p a.yt::before{background:url(../images/icon_youtube_red.png); background-size:100%;}
#contact .address p a.wa::before{background:url(../images/icon_whatsapp_red.png); background-size:100%;}
#contact .address p a.email::before{background:url(../images/icon_mail_red.png); background-size:100%;}
#contact .address p a.oa::before{background:url(../images/icon_line_OA_red.png); background-size:100%;}
#contact .address p a.tel::before{background:url(../images/icon_phone_red.png); background-size:100%;} */
#contact .address p a:hover{color:#EF3937;}
#contact .address p i{color:#6668AA; font-style: normal;}

#contact .container{width:100%; margin:0 0 40px 0; border-radius:10px; overflow:hidden; display:block; background:#FFF;}
#contact .map{width:50%; display:block; float:left;}
#contact .map img{width:100%;}
#gmap{width:100%; display:block; float:left;}
#gmap iframe{width:100%; height:450px;}
#contact form{width:50%; margin:0; padding:25px 35px; display:block; display:block; float:left;}
#contact form h6{width:100%; margin:15px 0 !important; padding-left:15% !important; font-size:18px; display:block; float:left;}
#contact form fieldset{width:100%; margin:24px 0 0 0; padding:0; border:0; display:block; position:relative;}
#contact form fieldset i{position:absolute; font-size:1.1em; color:#6668AA; right:23px; top:19px;}
#contact form fieldset input{color:#000; font-size:1.2em; font-family:'Kanit', sans-serif; border: 1px solid #DDD;}
#contact form fieldset input::placeholder{color:#999;}
#contact form fieldset input[type="text"]{width:100%; height:50px; line-height:50px; padding:0 50px 0 20px; text-align:left; border-radius:10px; display:block; background:#FFF; -webkit-appearance:none; -webkit-box-shadow: inset 0 1px 5px 0 rgba(0,0,0,.05); -moz-box-shadow: inset 0 1px 5px 0 rgba(0,0,0,.05); box-shadow: inset 0 1px 5px 0 rgba(0,0,0,.05);}
#contact form input[type="submit"]{width:162px; height:50px; line-height:50px; margin:10px 0 0 0; padding:0; text-align:center; color:#FFF; border:0; border-radius:10px; cursor:pointer;
display:block; background:#6668AA; position:relative; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -webkit-appearance:none;
}
#contact form input[type="submit"]:hover{transform:scale(1.05); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#contact form fieldset textarea{width:100%; height:150px; padding:20px; font-size:1.2em; color:#4C4C4C; line-height:22px; text-align:left; border: 1px solid #DDD; border-radius:10px; resize:none; background:#FFF; -webkit-appearance:none; -webkit-box-shadow: inset 0 1px 5px 0 rgba(0,0,0,.05); -moz-box-shadow: inset 0 1px 5px 0 rgba(0,0,0,.05); box-shadow: inset 0 1px 5px 0 rgba(0,0,0,.05); font-family:'Kanit', sans-serif;}
#contact form .gcode{width:306px; margin:24px 0 10px 0; position:relative; display:block; float:left;}

footer{margin-top:60px;}

@media (min-width: 1921px) {
  #pic-topic.contact::after{content:""; background:url("../images/pic-contact.jpg") no-repeat top center; background-size:1920px;}
}
@media (max-width: 800px) {
    #contact .address{width:100%; padding:30px 0}
    #contact form{width:100%; padding:25px 0 0 0; margin-bottom:30px;}
}
@media (max-width: 480px) {
    #top-head{padding:10px 15px 0 15px;}
    #top-head .lang{right:15px;}
    #contact{margin:0;}
    #contact .address p{font-size:1em;}
    #contact .map{width:100%;}    
    #contact form fieldset{margin-top:15px;}
    #contact form fieldset input{font-size:1em;}
    #contact form fieldset textarea{font-size:1em;}
    #contact .container{margin:0;}
    #contact form input[type="submit"]{width:162px; height:42px; line-height:42px; margin:10px 0 0 0; padding:0; text-align:center; color:#FFF; border:0; border-radius:10px;
        display:block; background:#6668AA; position:relative; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -webkit-appearance:none;
    }
    #gmap iframe{height:320px;}
    footer{margin-top:40px;}
}