/*=== 作者：Distantmemory - 时间：2018年11月 - 版本：1.0 - 个人：www.distantmemory.cc - 公司：www.timoo.net ===*/

/*=== 媒体查询 ===*/
/*手机*/
@media ( min-width : 320px) { 

    .hengbok-contact .contact .flower { position: absolute; top: -4rem; right: -4rem; z-index: 1; opacity: 0.1; pointer-events: none; }

    .hengbok-contact .contact { position: relative; padding: 0.32rem 0.08rem 0.64rem 0.08rem; }
    .hengbok-contact .contact .contact-way { padding: 0.32rem 0.24rem; height: 100%; background: #CBB8A8; color: #FFF; }
    .hengbok-contact .form { padding: 0.32rem 0.24rem; height: 100%; background: #FFF; }

}

@media ( min-width : 360px) { 

} 

/*平板电脑*/
@media ( min-width : 640px) {

}

/*笔记本电脑*/
@media ( min-width : 960px) {

} 

/*PC电脑*/
@media ( min-width : 1200px) { 

    .hengbok-contact .contact .flower { opacity: 1; }

    .hengbok-contact .contact { position: relative; padding: 0.8rem 0 2rem 0; }
    .hengbok-contact .contact .contact-way { padding: 0.64rem; }
    .hengbok-contact .form { padding: 0.64rem; }

} 

/*大屏PC电脑*/
@media ( min-width : 1600px) { 

}

/*=== Style ===*/
.hengbok-contact { position: relative; background: url(../image/tile.png) repeat; }
.hengbok-contact .map { position: relative; }
.hengbok-contact .map .shade { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.2); cursor: pointer; }
.hengbok-contact .map .shade.out { opacity: 0; pointer-events: none; }
.hengbok-contact .map .shade span { display: block; padding: 0.08rem; background: rgba(0,0,0,0.5); border-radius: 0.02rem; letter-spacing: 0.02rem; font-size: 0.14rem; color: #EEE; }

.hengbok-contact .contact .box { padding: 0; box-shadow: 0 0 0.08rem rgba(0,0,0,0.1); }
.hengbok-contact .contact .contact-way li + li { margin-top: 0.32rem; }
.hengbok-contact .contact .contact-way .subject { margin-bottom: 0.24rem; }
.hengbok-contact .contact .contact-way .subject span { display: inline-block; position: relative; letter-spacing: 0.01rem; font-weight: 700; }
.hengbok-contact .contact .contact-way .subject span::after { content: ""; display: block; position: absolute; bottom: -0.04rem; width: 100%; height: 0.01rem; background: rgba(255,255,255,0.7); }
.hengbok-contact .contact .contact-way .content { font-size: 0.14rem; }
.hengbok-contact .contact .contact-way .content .wechat { max-width: 1.6rem; } 

.hengbok-contact .form .subject { margin-bottom: 0.48rem; letter-spacing: 0.02rem; font-size: 0.24rem; } 
.hengbok-contact .form input { padding: 0 0.08rem; width: 100%; border: 0.01rem solid #DDD; line-height: 0.4rem; font-size: 0.14rem; }
.hengbok-contact .form textarea { padding: 0.08rem; width: 100%; height: 1.2rem; border: 0.01rem solid #DDD; line-height: 0.2rem; font-size: 0.14rem; resize: none; }
.hengbok-contact .form input:focus,
.hengbok-contact .form textarea:focus { border-color: #CBB8AB; }
.hengbok-contact .form .input .unit + .unit,
.hengbok-contact .form .unit-group + .unit-group { margin-top: 0.24rem; }
.hengbok-contact .form .code input { width: 50%; }
.hengbok-contact .form .code img { position: relative; top: -0.01rem; width: auto; height: 0.34rem; cursor: pointer; }
.hengbok-contact .form .button button { padding: 0 0.48rem; background: #CBB8AB; border: 0.01rem solid #CAB7A6; border-radius: 0.02rem; line-height: 0.4rem; font-size: 0.14rem; color: #FFF; cursor: pointer; }
.hengbok-contact .form .button button:hover { background: #FFF; color: #CBB8AB; }

.hengbok-contact .status { position: relative; margin-top: 0; padding: 0.06rem 0.12rem; border: 0.01rem solid rgba(0,0,0,0); border-radius: 0.02rem; font-size: 0.14rem; opacity: 0; visibility: hidden; 
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    transform-origin: 0 0;

    -webkit-transform:scaleY( 0 );
    -moz-transform:scaleY( 0 );
    -ms-transform:scaleY( 0 );
    -o-transform:scaleY( 0 );
    transform:scaleY( 0 ); }
.hengbok-contact .status.open { margin-top: 0.32rem; height: auto; opacity: 1; visibility: visible;               -webkit-transform:scaleY( 1 );
    -moz-transform:scaleY( 1 );
    -ms-transform:scaleY( 1 );
    -o-transform:scaleY( 1 );
    transform:scaleY( 1 ); }
.hengbok-contact .status.error { background: rgba(240,86,84,0.1); border: 0.01rem solid rgba(240,86,84,0.2); color: #F05654; }
.hengbok-contact .status.success { background: rgba(10,163,68,0.1); border: 0.01rem solid rgba(10,163,68,0.2); color: #0AA344; }
.hengbok-contact .status .text { padding-right: 0.24rem; }
.hengbok-contact .status .close { position: absolute; top: 0.06rem; right: 0.04rem; width: 0.24rem; height: 0.24rem; line-height: 0.24rem; font-size: 0.12rem; cursor: pointer; opacity: 0.5; }
.hengbok-contact .status .close:hover { opacity: 1; }