html, body {
    height: 100%;
    margin: 0px;
}
*,::after,::before{
 box-sizing: border-box;    text-decoration: none;
}
.hidden {display: none;}
#successMessage { position: fixed; z-index: 9999999999999; top: 50%; left: 50%; width: 80%; transform: translate(-50%, -50%); padding: 20px; background-color: rgba(0, 0, 0, 0.7); color: white; text-align: center; }
#successMessage a.qrbox {background: #f54a30; padding: 5px 10px; border: none; color: #fff;}
.bg-success { background-color: #1bcfb4 !important; }
.mr-1, .mx-1 {
    margin-right: 0.25rem !important;
}
.mr-3{ margin-right: 1rem !important; }
.text-primary { color: #b66dff !important; }
.text-small2 { font-size: 14px; }
.text-success { color: #1bcfb4 !important; }

.w-100 {
    width: 100% !important;
}
.text-hidden { font-size:0px; color:#eee; display:none; }
/* chat window */
.chat-window {
    width: 100%;
    max-width:700px;
    height: 100%;
	padding:20px;
  background-color: #fff;
  margin:0px auto;
  font-family: Arial, sans-serif;
    overflow: hidden;
}
div#loading {
    position: relative;
    padding-bottom: 100px;
}
div#loading .loadfred  {position: absolute; right: 0px; width: 50%; bottom: 107px;}
#chat-form { position: fixed; padding:10px; bottom: 0px; width: 100%; max-width: 700px; left:50%; margin-left:-350px;  border: 1px solid #eee; border-radius: 0px;}
#chat-form a {cursor: pointer;}
.gptform {display: flex; width: 100%;}
.gptformipt {border: 1px solid #1bcfb4; padding:5px 10px; height:60px; font-size: 14px; resize: none; -webkit-text-size-adjust: none; }
.gptformbt {border: none; color: #fff; border-radius: 5px; width:60px;}
.gptuserbox.chat-message .message-content {background:#eee;}
.gptbotbox.chat-message .message-content {background:#f4f7f9;}
.chat-message .message-content pre {background:#fff; border-radius:5px; font-size:12px; line-height:20px;}

#message {
    width: 195px;
    height: 50px;
    color: #fff;
    font-size: 14px;
    line-height: 50px;
    text-align: center;
    background: #10a37f;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 99999999999;
    opacity: 0;
    transition: opacity 0.5s;
    border-radius: 10px;
}

#message.show {
opacity: 1;
}

/* chat history */
.chat-history {
  height:79%;
  overflow-y: scroll;
    padding-bottom: 100px;
}

/* chat message */
.chat-message {
  padding: 10px;
  overflow: hidden;
  display: flex;
  font-size:14px;
}

.chat-message .avatar {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  margin-right: 10px;
}

.chat-message .message-content {
  background-color: #f7f7f7;
  border-radius: 10px;
  padding: 10px;
  box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.1);
  flex: 1;
  width:90%;
}

.chat-message .message-content .sender {
  font-weight: bold;
}

.chat-message .message-content .message-text {
  margin-top: 5px;
  padding: 10px 0px;
  word-wrap: break-word;
  white-space: pre-wrap;
}

/* chat input */
.chat-input {
  padding: 10px;
	border: 1px solid #999;
  background-color: #ffffff;
  margin-top: 10px;
  display: flex;
  border-radius: .375rem;
  box-shadow:0px 0px 4px #ccc;
  margin-top: 50px;
}
.chat-input textarea[type=text] {
  flex: 1;
  border: none;
  outline: none;
  font-size: 16px;
	height:40px;
}

.chat-input button {
  border: none;
  background-color: #10a37f;
  color: white;
  padding: 10px;
  border-radius: 5px;
  cursor: pointer;
  margin-left: 10px;
}


/* 对话框样式 */
.chat-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  height: 490px;
  overflow: scroll;
  border: 1px solid #ddd;
  border-radius: 5px;
  padding: 10px;
}

/* 消息框样式 */
.message-box {
  max-width: 60%;
  word-wrap: break-word;
  padding: 10px;
  border-radius: 5px;
  margin-bottom: 10px;
}

/* 用户消息框样式 */
.user-message {
  background-color: #f2f2f2;
  align-self: flex-start;
}



/* 等待标识样式 */
.waiting-indicator {
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  margin-bottom: 10px;
  color: #aaa;
}




/*悬浮*/
.xficon {
    position: fixed;
    right:1%;
    top: 50%;
    z-index: 999;
    width: 50px;
    height:120px;
    justify-content: center;
    align-items: center;
}
.xficon a {
    width: 50px;
    height: 50px;
    display: block;
  background: #9a55ff;
  color: #fff;
  margin-bottom: 20px;
  font-size: 12px;
  text-align: center;
}
.xficon a i {
  font-size: 2em;
  display: block;
  padding-top: 5px;
}
.xficon a:hover {color: #fff; text-decoration: none;}
.gptsrktop {padding:1rem 0;}

@media screen and (max-width: 768px) {
    #chat-form { position: fixed; padding:0px; bottom: 0px; width: 100%; left: 0px; margin-left: 0px; }
    #chat-form i {font-size:20px;}
    .gptsrktop {padding:0px 0px 10px 0px;}
    .mbhidden {display:none;}
    ul.navbar-nav.navbar-nav-right.mbhidden {display:none;}
    .chat-window {padding:20px 5px;}
    .xficon {  position: fixed; right: 0; left: 0; bottom: 0; }
}




/*
 * Container style
 */
.h20 {height:20px;}
.regbox .content-wrapper,.loginbox .content-wrapper {background: url("/static/newstatic/images/lgbg.png") repeat-x}
.ridiomdi {position: relative;}
.ridiomdi .radiohd {display: none; position: absolute; bottom:25px; left:-75px; background: rgba(0,0,0,0.8);color: #fff; font-style: normal; padding: 5px 10px; border-radius: 5px; font-size: 12px;width: 150px; z-index: 9999;}
.ridiomdi:hover .radiohd {display: block;}


.wangjibox {width: 100%; height: 100%; background: rgba(0,0,0,0.8); position: fixed; top: 0; left: 0; z-index: 99999;}
.wangjimima {background: #fff; padding: 50px; border: 3px solid #eee; width:95%; max-width:500px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.wangjimima .closex {cursor: pointer; width: 20px; height: 20px; line-height: 20px; text-align: center; background: #333; color: #fff; display: block; position: absolute; right: 0px; top:0px; }

.wangjibox2 {width: 100%; height: 100%; background: rgba(0,0,0,0.8); position: fixed; top: 0; left: 0; z-index: 99999;}
.wangjimima2 {background: #fff; padding: 50px; border: 3px solid #eee; width:500px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.wangjimima2 .closex {cursor: pointer; width: 20px; height: 20px; line-height: 20px; text-align: center; background: #333; color: #fff; display: block; position: absolute; right: 0px; top:0px; }

.wangjibox3 {width: 100%; height: 100%; background: rgba(0,0,0,0.8); position: fixed; top: 0; left: 0; z-index: 99999;}
.wangjimima3 {background: #fff; padding: 50px; border: 3px solid #eee; width:500px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.wangjimima3 .closex {cursor: pointer; width: 20px; height: 20px; line-height: 20px; text-align: center; background: #333; color: #fff; display: block; position: absolute; right: 0px; top:0px; }

.dynavs {    height:60px;line-height:60px;font-size: 1.5em;width: 100%;margin: 10px 0 0 0;overflow: hidden;}
.dynavs ul {    margin: 0px;padding: 0px;width: 100%;height:70px;border-radius: 10px;overflow: hidden;background: #74868b;text-shadow: 1px 1px 1px #000;}
.dynavs ul li {float: left; width:50%; text-align: center; list-style:none; line-height:60px;}
.dynavs ul li.current,.dynavs ul li:hover { background: #333;}
.dynavs a {color: #fff; font-size: 18px; width: 100%; height: 100%; display: block; }
.dynavs a:hover {text-decoration: none; color: #fff;}

.artlistbox {overflow: hidden;}
.artlistbox li a {display: block; overflow: hidden}
.artlistbox li a:hover {text-decoration:none;}
.artlistbox li:hover { background: #f7f7f7;}

.card form select.form-control.w-100.select-serh {height: 46px;}
.table th img, .table td img.kkruye {width: 200px; height: auto;}
.indexzzserv a:hover * {color: #fff;}

.textshadow {text-shadow: 1px 1px 2px #666;}
.ppimgs {width: 100%; position: relative}
.ftot { display: none; width: 100%; margin: 0 auto;  height: 60px; background: #ec3251; z-index: 9999999; position: fixed; bottom: 0; left嚗�0; right: 0; justify-content: space-between;  align-items: center;}
.ftot a { text-align: center;  width: 25%; color: #fff; display: block; font-weight: normal; font-size: 26px;}
.ftot a:hover {color: #fff;}
.ftot .ina { font-size: 35px;}
.ftot span {font-size: 14px; font-weight: normal; display: block; line-height: 22px;}
.webtop {position: fixed; text-align: center; font-size: 12px; bottom: 100px; width: 60px;}
.rightwechat {position: fixed; text-align: center; font-size: 12px; bottom: 190px;width: 60px; height:60px; border:none; cursor: pointer; font-size: 30px;}

.sharetips {margin:0px 0px 60px 0px; padding:16px; background:yellow; border:1px #ec3251 dashed; font-size:14px; color:#333;}

.artyulanbox {padding:50px 30px; border: 1px solid; background: #f7f7f7; font-size:16px;}
.artyulanbox h1 {font-size: 28px; margin-bottom: 20px;}
.artyulanbox p { font-size:18px; line-height: 2em; text-align: justify;}
.artyulanbox img {width:100%; margin: 20px 0px;}

button.btn.btn-outline-dark.btn-icon-text.mb-2{ width: 100%;}
.form-group.col-md-8.grid-margin.float-left.p-5 div input {padding:20px;border-color: #666;}
.clear = {clear: both;}

form.sx-box {overflow:hidden;}
select.form-control.mb-2.select-serh.col-md-2 { height:31px; margin-top: 1px; }
button.btn.btn-gradient-dark.mb-2.col-md-2 { height:32px; width: 100px; margin-left: 10px; }
.table td img.splistimg {width: 50px; height: auto; border-radius: 0;}

@media screen and (max-width: 991px) {
    form.sx-box button.btn.btn-gradient-dark.mb-2.col-md-2 {float:right;}
}

#fountainG{
	position:relative;
	width:234px;
	height:28px;
	margin:auto;
}

.fountainG{
	position:absolute;
	top:0;
	background-color:rgb(0,0,0);
	width:28px;
	height:28px;
	animation-name:bounce_fountainG;
		-o-animation-name:bounce_fountainG;
		-ms-animation-name:bounce_fountainG;
		-webkit-animation-name:bounce_fountainG;
		-moz-animation-name:bounce_fountainG;
	animation-duration:1.5s;
		-o-animation-duration:1.5s;
		-ms-animation-duration:1.5s;
		-webkit-animation-duration:1.5s;
		-moz-animation-duration:1.5s;
	animation-iteration-count:infinite;
		-o-animation-iteration-count:infinite;
		-ms-animation-iteration-count:infinite;
		-webkit-animation-iteration-count:infinite;
		-moz-animation-iteration-count:infinite;
	animation-direction:normal;
		-o-animation-direction:normal;
		-ms-animation-direction:normal;
		-webkit-animation-direction:normal;
		-moz-animation-direction:normal;
	transform:scale(.3);
		-o-transform:scale(.3);
		-ms-transform:scale(.3);
		-webkit-transform:scale(.3);
		-moz-transform:scale(.3);
	border-radius:19px;
		-o-border-radius:19px;
		-ms-border-radius:19px;
		-webkit-border-radius:19px;
		-moz-border-radius:19px;
}

#fountainG_1{
	left:0;
	animation-delay:0.6s;
		-o-animation-delay:0.6s;
		-ms-animation-delay:0.6s;
		-webkit-animation-delay:0.6s;
		-moz-animation-delay:0.6s;
}

#fountainG_2{
	left:29px;
	animation-delay:0.75s;
		-o-animation-delay:0.75s;
		-ms-animation-delay:0.75s;
		-webkit-animation-delay:0.75s;
		-moz-animation-delay:0.75s;
}

#fountainG_3{
	left:58px;
	animation-delay:0.9s;
		-o-animation-delay:0.9s;
		-ms-animation-delay:0.9s;
		-webkit-animation-delay:0.9s;
		-moz-animation-delay:0.9s;
}

#fountainG_4{
	left:88px;
	animation-delay:1.05s;
		-o-animation-delay:1.05s;
		-ms-animation-delay:1.05s;
		-webkit-animation-delay:1.05s;
		-moz-animation-delay:1.05s;
}

#fountainG_5{
	left:117px;
	animation-delay:1.2s;
		-o-animation-delay:1.2s;
		-ms-animation-delay:1.2s;
		-webkit-animation-delay:1.2s;
		-moz-animation-delay:1.2s;
}

#fountainG_6{
	left:146px;
	animation-delay:1.35s;
		-o-animation-delay:1.35s;
		-ms-animation-delay:1.35s;
		-webkit-animation-delay:1.35s;
		-moz-animation-delay:1.35s;
}

#fountainG_7{
	left:175px;
	animation-delay:1.5s;
		-o-animation-delay:1.5s;
		-ms-animation-delay:1.5s;
		-webkit-animation-delay:1.5s;
		-moz-animation-delay:1.5s;
}

#fountainG_8{
	left:205px;
	animation-delay:1.64s;
		-o-animation-delay:1.64s;
		-ms-animation-delay:1.64s;
		-webkit-animation-delay:1.64s;
		-moz-animation-delay:1.64s;
}



@keyframes bounce_fountainG{
	0%{
	transform:scale(1);
		background-color:rgb(0,0,0);
	}

	100%{
	transform:scale(.3);
		background-color:rgb(255,255,255);
	}
}

@-o-keyframes bounce_fountainG{
	0%{
	-o-transform:scale(1);
		background-color:rgb(0,0,0);
	}

	100%{
	-o-transform:scale(.3);
		background-color:rgb(255,255,255);
	}
}

@-ms-keyframes bounce_fountainG{
	0%{
	-ms-transform:scale(1);
		background-color:rgb(0,0,0);
	}

	100%{
	-ms-transform:scale(.3);
		background-color:rgb(255,255,255);
	}
}

@-webkit-keyframes bounce_fountainG{
	0%{
	-webkit-transform:scale(1);
		background-color:rgb(0,0,0);
	}

	100%{
	-webkit-transform:scale(.3);
		background-color:rgb(255,255,255);
	}
}

@-moz-keyframes bounce_fountainG{
	0%{
	-moz-transform:scale(1);
		background-color:rgb(0,0,0);
	}

	100%{
	-moz-transform:scale(.3);
		background-color:rgb(255,255,255);
	}
}

.pagenavi {margin-top: 40px;-webkit-box-pack: center!important; justify-content: center!important; display: flex;height: 40px; overflow: hidden; border-radius: 5px;}
.pagenavi a,.pagenavi span {color: #999; padding: 5px 15px; border: 1px solid #999; line-height:25px; height:35px; background:none; font-size: 12px; margin-right: -1px;}
.pagenavi a:hover ,.pagenavi span.current-page {text-decoration: none; background:#999; color: #eee;}

.pagenavi2 {margin-top: 40px;-webkit-box-pack: center!important; justify-content: center!important; display: flex;height: 40px; overflow: hidden; border-radius: 5px;}
.pagenavi2 a,.pagenavi2 span {color: #fff; padding: 5px 15px; border: 1px solid #fff;  line-height:30px; background:none; font-size: 12px; margin-right: -1px;}
.pagenavi2 a:hover ,.pagenavi2 span.current-page {text-decoration: none; background:#fff; color: #999; }

.atrdtbox {padding:3rem; text-align:justify;}
.atrdtbox .artdtcontent img { width:100%;}
.artlstds {text-align:justify;}

@media screen and (max-width: 991px) {
	.ppimgs .ftot { display: flex;}
	.kuaijiedh {display: none;}
	.webtop {position: relative; margin-top: 50px; width: 60px; left:40%;bottom:0px;}
	.rightwechat {position: relative; margin-top: 50px;bottom:0px; left:40%; }
	.xficon {display: none;}
	div#loading {margin-bottom: 250px;padding-bottom: 150px;}
	span.float-right.text-small2.boldnone { display: none; }
	.atrdtbox {padding:3rem 1em;}
	.jtrightfd {display:none;}
	.content-wrapper #popup-content {width:100%;}   
}


/*yhmlist css*/
.popupbox { position: fixed; top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.9);display: flex;justify-content: center;align-items: center;z-index: 9999;}
.popup-content {background-color: #ffffff;padding: 20px;border-radius: 10px; position: relative; max-height: 90%; overflow-y: scroll;}
.popup-content table {width: 100%;margin: auto;border-collapse: collapse;}
.popup-content th, .popup-content td {padding: 10px;text-align: center;border: 1px solid #000000;}
.popup-close { position: absolute; top:0px; right:0px; background: #333; border: 0px; color: #fff; border-radius:18px; width:22px; height:22px; line-height:22px;}
/*mysplist css*/
#popup {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.9);display: none;justify-content: center;align-items: center;z-index: 9999;}
/* 隞乩�𧢲甅撘讐鍂鈭𤾸撕�枂蝒堒藁����摰� */
#popup-content {background-color: white;border: 1px solid black;padding: 20px;position: relative;width: 50%;height: 95%; overflow-y: scroll;}

/* 隞乩�𧢲甅撘讐鍂鈭𤾸�喲𡡒��厰僼 */
#close {
  color: black;
  float: right;
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
}

/* 隞乩�𧢲甅撘讐鍂鈭擧��𧋦��摰� */
#text {
  margin-bottom: 20px;
	padding: 40px;
}

/* 隞乩�𧢲甅撘讐鍂鈭𤾸�滚���厰僼 */
#copy {
  background-color: white;
  border: 1px solid black;
  color: black;
  cursor: pointer;
  font-size: 16px;
  padding: 8px;
	float: right;
}

/* 隞乩�𧢲甅撘讐鍂鈭𡡞�䭾���砍�𨅯銁憭滚���厰僼銝𦠜𧒄 */
#copy:hover {
  background-color: black;
  color: white;
}



.ps {
  overflow: hidden !important;
  overflow-anchor: none;
  -ms-overflow-style: none;
  touch-action: auto;
  -ms-touch-action: auto;
}

/*
 * Scrollbar rail styles
 */
.ps__rail-x {
  display: none;
  opacity: 0;
  transition: background-color .2s linear, opacity .2s linear;
  -webkit-transition: background-color .2s linear, opacity .2s linear;
  height: 15px;
  /* there must be 'bottom' or 'top' for ps__rail-x */
  bottom: 0px;
  /* please don't change 'position' */
  position: absolute;
}

.ps__rail-y {
  display: none;
  opacity: 0;
  transition: background-color .2s linear, opacity .2s linear;
  -webkit-transition: background-color .2s linear, opacity .2s linear;
  width: 15px;
  /* there must be 'right' or 'left' for ps__rail-y */
  right: 0;
  /* please don't change 'position' */
  position: absolute;
}

.ps--active-x > .ps__rail-x,
.ps--active-y > .ps__rail-y {
  display: block;
  background-color: transparent;
}

.ps:hover > .ps__rail-x,
.ps:hover > .ps__rail-y,
.ps--focus > .ps__rail-x,
.ps--focus > .ps__rail-y,
.ps--scrolling-x > .ps__rail-x,
.ps--scrolling-y > .ps__rail-y {
  opacity: 0.6;
}

.ps__rail-x:hover,
.ps__rail-y:hover,
.ps__rail-x:focus,
.ps__rail-y:focus {
  background-color: #eee;
  opacity: 0.9;
}

/*
 * Scrollbar thumb styles
 */
.ps__thumb-x {
  background-color: #aaa;
  border-radius: 6px;
  transition: background-color .2s linear, height .2s ease-in-out;
  -webkit-transition: background-color .2s linear, height .2s ease-in-out;
  height: 6px;
  /* there must be 'bottom' for ps__thumb-x */
  bottom: 2px;
  /* please don't change 'position' */
  position: absolute;
}

.ps__thumb-y {
  background-color: #aaa;
  border-radius: 6px;
  transition: background-color .2s linear, width .2s ease-in-out;
  -webkit-transition: background-color .2s linear, width .2s ease-in-out;
  width: 6px;
  /* there must be 'right' for ps__thumb-y */
  right: 2px;
  /* please don't change 'position' */
  position: absolute;
}

.ps__rail-x:hover > .ps__thumb-x,
.ps__rail-x:focus > .ps__thumb-x {
  background-color: #999;
  height: 11px;
}

.ps__rail-y:hover > .ps__thumb-y,
.ps__rail-y:focus > .ps__thumb-y {
  background-color: #999;
  width: 11px;
}

/* MS supports */
@supports (-ms-overflow-style: none) {
  .ps {
    overflow: auto !important;
  }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .ps {
    overflow: auto !important;
	  
  }
}