@charset "utf-8";
/* CSS Document */
.online_service_variable{width:50px;position: fixed;right:0;z-index: 999;bottom:50px;}
.online_service_content li{width:100%;height:50px;background:#f6ac3b;text-align: center;margin-bottom:1px;position: relative;}
.online_service_content li:hover{background:#f6ac3b}
.online_service_content li a{line-height: 50px;display:block;color:#fff;position: relative;}
.online_service_content li a img{width:25px;}
.mess_btn em{display:block;position: absolute;right:3px;top:-15px;font-style: normal;font-size:0.875rem;}
.tel_display{background:#f6ac3b;position: absolute;right:-247px;height:50px;top:0;line-height: 40px;color:#fff;font-size:var(--ark-font-foutitle);padding:0.25rem;min-width: 180px;font-family: "OPPOSans";font-weight: 600;transition: .4s;z-index:-1;}
.wx_display{position: absolute;right:-247px;bottom:0;width:180px;height:200px;background:#f6ac3b;padding:1rem;color:rgba(255,255,255,0.8);font-size:0.875rem;text-align: center;transition: .4s;z-index: -1;}
.wx_display img{margin-bottom:0.5rem;width:135px;}
.online_service_top{height:50px;background:#f6ac3b;text-align: center;line-height: 50px;display:none;transition: .4s;}
.online_service_top a{display:block;}
.online_service_top:hover{background:#f6ac3b}
.tel_item:hover .tel_display{right:47px;background:#f6ac3b}
.wx_item:hover .wx_display{right:47px;background:#f6ac3b}
/**/
.online_message_form{width:100%;position: fixed;display:none;align-items: center;top:0;bottom:0;background:rgba(0,0,0,0.3);align-content: center;z-index: 999;}
.online_message_form.active{display:flex;}
.online_message_model{width:760px;margin:0 auto;background:rgba(255,255,255,1.00);padding:2rem;position: relative;}
.online_mess_content form{margin-top:2rem;}
.online_mess_content input{width:100%;line-height: 45px;margin:0.5rem 0;}
.online_mess_content input[type=text]{border-bottom:1px #333 solid;}
.online_mess_content textarea{border-bottom:1px #333 solid;width:100%;min-height: 100px;margin-top:1rem;}
.online_mess_content textarea::placeholder{color:#777;font-size:0.875rem;}
.online_mess_content input[type=button]{background:var(--color-font-them);color:#fff;cursor: pointer;font-size:1rem;letter-spacing: 2px;}
.on_mess_cloase{width:25px;height:25px;position: absolute;right:20px;top:25px;cursor: pointer;}
.on_mess_cloase:before{content:"";width:20px;height:2px;background:#333;position: absolute;right:0;top:0;transform: rotate(45deg);}
.on_mess_cloase:after{content:"";width:20px;height:2px;background:#333;position: absolute;right:0;top:0;transform: rotate(-45deg);}
.online_mess_content h3{font-size:var(--ark-font-size);}