@charset "UTF-8";
#floatbar_btn{ position: fixed; display: flex; flex-direction: column; align-items: center; justify-content: center; top: 0; right: 17px; bottom: 0; width: 60px; margin: auto; opacity: 0.8;
	pointer-events: none;
}
#floatbar_btn:hover{ opacity: 1;}
#floatbar_btn *{pointer-events: auto;}
#floatbar_btn button{ display: block; width: 60px; height: 120px; margin: 2px 0; font-size: 14px; color: #FFFFFF; background-color: #30B5C1;}
#floatbar_btn button:first-child{ border-top-left-radius: 10px;}
#floatbar_btn button:last-child{ border-bottom-left-radius:10px;}
#floatbar_btn button.import{ position: relative; background-color: #2ecc71;}
#floatbar_btn button.import::after{ content: ''; position: absolute; top: 10px; left: -10px; bottom: 10px; width: 10px; background-color: #f1c40f; border-radius: 10px 0 0 10px;}
#floatbar_btn i{ display: block; margin-bottom: 10px; color: #FFFFFF;}
#floatbar_btn span{ font-size: 14px; color: #FFFFFF;}

.jy_viewbox.floatbar .jy_view{ width: 600px; height: 460px;}
.jy_viewbox.floatbar .nav{ height: 40px; overflow: visible;}
.jy_viewbox.floatbar .nav li{ position: relative; height: 30px; padding: 0 15px; line-height: 30px; font-size: 14px; border-radius: 2px; cursor: pointer;}
.jy_viewbox.floatbar .nav li.active{ color: #FFFFFF; background-color: #30B5C1;}
.jy_viewbox.floatbar .nav li.active::after{ content: ''; position: absolute; left: 0; right: 0; bottom: -10px; width: 0; height: 0; margin: auto; border: 10px solid #30B5C1; border-bottom: none; border-left-color: transparent; border-right-color: transparent;}
.jy_viewbox.floatbar .list{ position: relative; height: 100%; margin-right: 0px;}
.jy_viewbox.floatbar .list dl{ height: 100%; overflow: auto;}
.jy_viewbox.floatbar .list dd{ padding: 15px 0; margin-right: 20px; line-height: 20px; font-size: 14px; border-bottom: 1px solid #CCCCCC; cursor: pointer;}
.jy_viewbox.floatbar .list dd:hover{ color: #30B5C1;}
.jy_viewbox.floatbar .list dd span.import{ color: #30B5C1;}
.jy_viewbox.floatbar .more{ position: relative; float: right; width: 120px; padding-left: 20px; border-left: 1px solid #CCCCCC; text-align: center; z-index: 1;}
.jy_viewbox.floatbar .more button{ display: block; width: 120px; margin-bottom: 20px; color: #30B5C1; border-color: #30B5C1;}
.jy_viewbox.floatbar .more button:hover{ color: #30B5C1; border-color: #30B5C1;}
.jy_viewbox.floatbar .more button.import{ color: #FFFFFF; border-color: #30B5C1; background-color: #30B5C1;}
.jy_viewbox.floatbar .more img{ width: 120px; margin-bottom: 10px;}
.jy_viewbox.floatbar .more span{ font-size: 14px;}
.jy_viewbox.floatbar.dark .jy_view{ width: 200px;}
.jy_viewbox.floatbar.dark .list{ display: none;}
.jy_viewbox.floatbar.dark .more{ float: left; border: none;}

.jy_viewbox.feedback button.import{ border-color: #30B5C1; background-color: #30B5C1;}
.jy_viewbox.feedback button.import[disabled]{ border-color: #F2F2F2; background-color: #F2F2F2;}
.jy_viewbox.feedback input.jy_text:hover{ border-color: #30B5C1;}
.jy_viewbox.feedback input.jy_text:focus{ border-color: #30B5C1;}
.jy_viewbox.feedback textarea.jy_text:hover{ border-color: #30B5C1;}
.jy_viewbox.feedback textarea.jy_text:focus{ border-color: #30B5C1;}
.jy_viewbox.feedback .jy_view{ width: 400px; height: 370px;}
.jy_viewbox.feedback textarea.jy_text{ width: 350px; height: 150px;}
.jy_viewbox.feedback .count{ line-height: 30px; text-align: right;}
.jy_viewbox.feedback input.jy_text{ width: 350px;}
.jy_viewbox.feedback .hint{ margin-top: 15px; font-size: 14px; color: #EE5555;}
/*详细*/
.jy_viewbox.detail .jy_view{ width: 70%; height: 550px;}
.jy_viewbox.detail .jy_viewtitle{ color: #666666;}
.jy_viewbox.detail .jy_viewcon{ margin: 0 20px;}
.jy_viewbox.detail .answer{ position: absolute; top: 0; left: 0; bottom: 0; right: 0px; margin: auto; padding: 10px; background-color: #ECF0F1; border-radius: 4px; overflow: auto;}
.jy_viewbox.detail .answer>.title{ height: 40px; line-height: 40px; padding: 0 20px; font-size: 18px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: center;}
.jy_viewbox.detail .answer>.con{ word-break: break-all;}
.jy_viewbox.detail .answer>.con img{ max-width: 100%;}

.demand_bubble{ position: fixed; right: 0; bottom: 0;}
.demand_bubble .box{ position: absolute; right: 20px; bottom: 20px; width: 200px; height: 40px; padding: 15px; background-color: #69FFF7; overflow: hidden; white-space: nowrap; border-radius: 35px; cursor: pointer;}
.demand_bubble .box span{ display: block; margin-left: 15px; line-height: 20px; font-size: 16px; color: #2481BA; font-weight: bold;}
.demand_bubble .box i{ display: none; color: #2481BA;}
.demand_bubble .box:hover{ opacity: 0.9;}
.demand_bubble .box:active{ opacity: 1;}
.demand_bubble .horn1{ position: absolute; left: -35px; bottom: 20px; width: 30px; height: 30px; border-left: 15px solid #69FFF7; z-index: 999; border-bottom-left-radius: 30px;}
.demand_bubble .close{ position: absolute; right: 230px; bottom: 20px; width: 30px; height: 30px; line-height: 30px; color: #FFFFFF; background-color: #EE5555; text-align: center; border-radius: 50%; cursor: pointer;}
.demand_bubble .close:hover{ opacity: 0.9;}
.demand_bubble .close:active{ opacity: 1;}
.demand_bubble.hide .box{ width: 40px; height: 40px;}
.demand_bubble.hide .box span{ display: none;}
.demand_bubble.hide .box i{ display: block;}
.demand_bubble.hide .close{ display: none;}
.demand_bubble.hide .horn1{ display: none;}
.demand_bubble.hide .horn2{ display: none;}
.demand_bubble.anime{
	 animation: demand_bubble 2s ease-out -0.5s both;
}
@keyframes demand_bubble
{
0%{ transform: scale(0)rotate(-90deg);}
60%{ transform: scale(0)rotate(-90deg);}
75%{ transform: scale(1.04)rotate(4deg);}
80%{ transform: scale(0.98)rotate(-2deg);}
85%{ transform: scale(1.02)rotate(2deg);}
90%{ transform: scale(0.99)rotate(-1deg);}
95%{ transform: scale(1.01)rotate(1deg);}
100%{ transform: scale(1)rotate(0deg);}
}
.jy_viewbox.demand .jy_view{ width: 680px; height: 500px;}
.jy_viewbox.demand ul{ width: 600px; height: 400px; margin: auto;}
.jy_viewbox.demand li{ width: 200px; height: 200px; box-shadow: 0 0 0 1px #CCCCCC; cursor: pointer;}
.jy_viewbox.demand li.not{ cursor: auto;}
.jy_viewbox.demand li:hover i{ transform: scale(1.1);}
.jy_viewbox.demand li i{ display: block; width: 80px; height: 80px; margin: 0 auto; margin-top: 30px;}
.jy_viewbox.demand li span{ display: block; margin-top: 20px; text-align: center;}
.jy_viewbox.demand .advertise i{ color: #41cee0;}
.jy_viewbox.demand .integrate i{ color: #ff6536;}
.jy_viewbox.demand .invite i{ color: #5dd463;}
.jy_viewbox.demand .wechat i{ color: #5dd463;}
.jy_viewbox.demand .build i{ color: #ff6536;}
.jy_viewbox.demand .service i{ color: #41cee0;}

.jy_viewbox.demanddetail .jy_view{ width: 480px; height: 500px;}
.jy_viewbox.demanddetail button.import{ border-color: #30B5C1; background-color: #30B5C1;}
.jy_viewbox.demanddetail button.import[disabled]{ border-color: #F2F2F2; background-color: #F2F2F2;}
.jy_viewbox.demanddetail input.jy_text:hover{ border-color: #30B5C1;}
.jy_viewbox.demanddetail input.jy_text:focus{ border-color: #30B5C1;}
.jy_viewbox.demanddetail textarea.jy_text:hover{ border-color: #30B5C1;}
.jy_viewbox.demanddetail textarea.jy_text:focus{ border-color: #30B5C1;}
.jy_viewbox.demanddetail textarea.jy_text{ width: 350px; height: 150px;}
.jy_viewbox.demanddetail .count{ line-height: 30px; text-align: right;}
.jy_viewbox.demanddetail input.jy_text{ width: 350px;}
.jy_viewbox.demanddetail .hint{ margin-top: 15px; font-size: 14px; color: #EE5555;}
.jy_viewbox.demanddetail dl{ margin-bottom: 20px;}
.jy_viewbox.demanddetail dt{ height: 30px; line-height: 30px; font-size: 16px; color: #666666;}
.jy_viewbox.demanddetail dt span{ color: #EE5555;}
.jy_viewbox.demanddetail dd{ overflow: hidden;}
.jy_viewbox.demanddetail label{ float: left; height: 30px; margin-right: 10px; cursor: pointer;}
.jy_viewbox.demanddetail label>div{ float: left; width: 20px; height: 20px; margin-top: 5px;}
.jy_viewbox.demanddetail label>span{ float: left; margin: 5px; font-size: 14px;}
.jy_viewbox.demanddetail .more.all{ height: 150px;}
.jy_viewbox.demanddetail input.more{ width: 420px;}
.jy_viewbox.demanddetail textarea.more.all{ width: 420px;}
.jy_viewbox.demanddetail input.account{ width: 420px;}

.jy_viewbox.yeying .jy_view{ width: 1004px; height: 100%;}
.jy_viewbox.yeying .jy_viewcon{ top: 10px; bottom: 0;}
.jy_viewbox.yeying .web-wrapper{ padding: 0;}

@media(max-width: 420px){
#floatbar_btn{ width: 50px;}
#floatbar_btn button{ width: 50px; height: 60px;}
#floatbar_btn i{ margin: 10px;}
#floatbar_btn span{ display: none;}

.jy_viewbox.floatbar .jy_view{ width: 100%; height: 100%;}
.jy_viewbox.floatbar .list{ margin-right: 0px;}
.jy_viewbox.floatbar .more{ display: none;}

.jy_viewbox.detail .jy_view{ width: 100%; height: 100%;}

.jy_viewbox.demand .jy_view{ width: 100%; height: 100%;}
.jy_viewbox.demand ul{ width: 100%; height: auto;}
.jy_viewbox.demand li{ width: 50%;}

.jy_viewbox.demanddetail .jy_view{ width: 100%; height: 100%;}
.jy_viewbox.demanddetail textarea.jy_text{ width: 95%;}
.jy_viewbox.demanddetail input.jy_text{ width: 95%;}
.jy_viewbox.demanddetail input.more{ width: 95%;}
.jy_viewbox.demanddetail textarea.more.all{ width: 95%;}
.jy_viewbox.demanddetail input.account{ width: 95%;}

.demand_bubble{ display: none;}
}