﻿/*.main{padding-bottom: 376px;}*/
.content{padding-top: 8px; }
.contactLeft iframe {
    width: 100%!important;
    border: none;
    height: 386px;
}
.contactLeft{width: 61%;float: left;}
.contactRight{width: 39%;float: right;}
.contactTop{border-bottom: 1px solid #dedede;    padding-left: 2px;padding-bottom: 19px;
    padding-top: 22px;}
.contactBottom{padding-left: 3px;padding-top: 25px;}
.contactLeft img{width: 100%;}
.contactRight .contactTop h2 {
    font-size: 18px;
    font-family:\5FAE\8F6F\96C5\9ED1;
    color: #333;
    letter-spacing:0.9px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-all;
    overflow: hidden;
    text-align: center;
    font-weight: 500;    margin-bottom: -2px;
}
.contactRight .contactTop p {
    font-size: 16px;
    font-family: '\5B8B\4F53';
    color: #666666;
    text-indent: -12px;
    line-height: 28px;
        letter-spacing: 0.6px;    padding-left: 24px;    margin-top: 20px;
}
.contactRight p .fa-map-marker {
        font-size: 24px;
    color: #999999;
    vertical-align: sub;
    margin-right: 10px;
}
.contactRight p .fa-phone {
    font-size: 18px;
    color: #999999;
    vertical-align: middle;
    margin-right: 9px;
}
.contactRight p label{font-weight: 600;    margin-right: 1px;
    letter-spacing: 1.2px;}
.contactRight>div{padding-left:23px;}

.contactBottom h2{ font-size: 14px;
    font-family: '\5B8B\4F53';
    color: #666666;    letter-spacing: 1.2px;    margin-bottom: 14px;}
.contactBottom p{font-size: 12px;color: #666;letter-spacing: 0.59px;line-height: 22px; display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-all;
    
}
    .contactBottom p a{font-size: 12px;color: #666;}
.contactBottom div {
    margin-top: 9px;
}

.formWrap form>div{width: 683px;margin: 0 auto;}
.formWrap h2{text-align: center;}
.formWrap li>label,.formRight>div>label{font-size: 12px; font-family: '\5B8B\4F53'; color: #666666;font-weight: 600;text-align: right;    letter-spacing: 1.4px;
    min-width: 70px;    height: 36px;
    line-height: 36px;
    margin-right: -6px;}
.formLeft input{outline:0;border: 1px solid #cccccc;border-radius: 4px;    padding:0px 13px;
    width: 215px;    height: 34px;    line-height: 34px;
    font-size: 12px;margin: 0;
    font-family: '\5B8B\4F53';}
.formWrap .formLeft{float: left;}
.formRight{float: right;
    position: relative;
}
.formWrap li{margin-bottom: 14px;position: relative;height: 36px;}
.formRight textarea{    resize: none;outline: 0;
    padding: 10px 13px;    min-height: 112px;
    width: 215px;
    font-size: 12px;
    letter-spacing: 0.6px;
    border: 1px solid #cccccc;
    border-radius: 4px;}
.formRight textarea:focus,.formWrap .formLeft input:focus{border: 1px solid #df0615;}
.errorWrap{font-size: 12px;color: #df0615;    position: absolute;
    left: 42px;
    top: 34px;}
.formRight .errorWrap{    top: 133px;
}
.submit input{outline:0;background: #df0615;text-align: center;font-size: 12px;font-family: '\5B8B\4F53'; color: #fff;border: none;    margin: 0 auto;
    display: block;    margin-top: 18px;
    line-height: 34px;
    width: 97px;
    border-radius: 3px;
    letter-spacing: 14px;
    padding-left: 22px;}
    .submit input:hover{opacity: 0.8;}
.formWrap h2{font-size: 16px;font-family: '\5B8B\4F53'; color: #333;    margin-bottom: 26px;    letter-spacing: 7px;}
.formWrap .container>div{background: #ebebeb;    padding-top: 29px;    padding-bottom: 35px;    box-shadow:0px 0px 18px rgba(236,236,236,0.9);
    border-radius: 5px;}
.formWrap{    margin-top: 30px;}
.formWrap ::-webkit-input-placeholder { /* WebKit browsers */ 
color: #cbcbcb; 
} 
.formWrap :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ 
color: #cbcbcb; 
} 
.formWrap ::-moz-placeholder { /* Mozilla Firefox 19+ */ 
color: #cbcbcb; 
} 
.formWrap :-ms-input-placeholder { /* Internet Explorer 10+ */ 
color: #cbcbcb; 
}
/*寮圭獥*/
    

@media (max-width:999px){
  .contactRight,.contactLeft { width: 100%; float: inherit; }
  .main { padding-top: 70px;}
}
@media (max-width:768px){
  .content .container{padding: 0;}
}
@media (max-width:767px){
  .contactRight .contactTop h2{margin-left: -14px;}
 .formRight,.formWrap .formLeft{float: inherit;}
  .formWrap form>div {
    width: inherit;
    margin: 0 auto;
}
.formWrap li>label, .formRight label{min-width: 55px;margin-right: -1px;}
.formLeft input,.formRight textarea{width: 60%;}
.errorWrap {
    left: 46px;
}
.content {
    padding-top: 21px;
}
.contactTop{    padding-bottom: 20px;
    padding-top: 27px;}
    .contactRight .contactTop p{    margin-top: 20px;}
    .formWrap {
    margin-top: 24px;
}
.contactBottom h2{    margin-bottom: 15px;}
.contactBottom div {
    margin-top: 11px;
}
.contactBottom{    padding-top: 25px;padding-bottom: 10px;}
.formWrap .container>div{    padding:31px 13px 35px;border-radius: 0;}
.submit input{    margin-top: 31px;}
.contactRight>div { padding-left: 12px; }
.formRight textarea{    margin-left: 5px;}
}
@media (max-width:480px){
  .contactLeft iframe,.contactLeft{height: 290px!important;overflow:hidden;}
.formLeft input, .formRight textarea{
width:78%;
}
}
@media (max-width:320px){
  .formLeft input, .formRight textarea {
    width: 218px;
}
}




