/*20210628，对css进行整理，以期清晰有序。2021-11-16，再次整理*/
/*汉语拼音字体*/
@font-face {
  font-family: 'gb_pinyinok-cRegular';
  src: url('../gb_pinyinok_c/gb_pinyinok-c.eot');
  src: url('../gb_pinyinok_c/gb_pinyinok-c-webfont.woff2') format('woff2'), url('../gb_pinyinok_c/gb_pinyinok-c-webfont.woff') format('woff'), url('../gb_pinyinok_c/GB Pinyinok-C.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
  unicode-range:U+3130-318F,U+31A0-31BF,U+0067,U+0251/*,U+0100-017F,U+0180-024F*/;
}
@font-face {
  font-family: "Helvetica Neue For Number";
  src: local("Helvetica Neue");
  unicode-range: U+30-39;/*指数字0-9的编码*/
}
.py1 {
  font-family: "gb_pinyinok-cRegular","宋体","Helvetica Neue For Number",Arial,sans-serif;
}
/*font-family: 'gb_pinyinok-cRegular','Helvetica Neue For Number',sans-serif;*/
/*end*/
body {
  background-color: rgba(255, 255, 255, 1);
  font-size: 100%; /*16px*/
  font-family:"gb_pinyinok-cRegular","宋体","Helvetica Neue For Number",Arial,sans-serif;
	
}
td, p, li {
  font-family: 宋体;
  font-size: 1rem;
}
A:link {
  text-decoration: none;
  color: #000099;
  font-size: 1rem
}
A:visited {
  text-decoration: none;
  color: #000099;
  font-size: 1rem
}
A:active {
  text-decoration: none;
  font-size: 1rem
}
A:hover {
  text-decoration: underline;
  color: red;
  font-size: 1rem
}
A.b:link {
  text-decoration: none;
  color: black;
  font-size: 1rem
}
A.b:visited {
  text-decoration: none;
  color: black;
  font-size: 1rem
}
A.b:active {
  text-decoration: none;
  font-size: 1rem
}
A.b:hover {
  text-decoration: none;
  color: red;
  font-size: 1rem
}
A.a:link {
  text-decoration: none;
  color: black;
  font-size: 1rem
} /*未访问时的状态*/
A.a:visited {
  text-decoration: none;
  color: white;
  font-size: 1rem
} /*已访问过的状态*/
A.a:active {
  text-decoration: none;
  font-size: 1.25rem
} /*鼠标移到上的状态*/
A.a:hover {
  text-decoration: none;
  color: red;
  font-size: 1rem
} /*点击时的状态*/
.line {
  BORDER-BOTTOM: lightgray 1px solid;
  BORDER-LEFT: black 0px solid;
  BORDER-RIGHT: black 0px solid;
  BORDER-TOP: black 0px solid;
}
.win {
  BORDER-BOTTOM: white 1px solid;
  BORDER-LEFT: white 0px solid;
  BORDER-RIGHT: #00BED6 0px solid;
  BORDER-TOP: white 0px solid;
}
.test1 {
  font-family: "宋体";
  font-size: 0.5625rem;
  color: lightseagreen
} /*9pt*/
.test2-1 {
  font-family: "MS Song";
  font-size: 0.75rem;
  color: white
} /*12pt*/
.test2-2 {
  font-family: "宋体";
  font-size: 0.75rem;
  color: black
}
.test2-3 {
  font-family: "宋体";
  font-size: 0.75rem;
  color: lightseagreen
}
.test2-4 {
  font-family: "宋体";
  font-size: 0.75rem;
  color: blue
}
.test2-5 {
  font-family: "gb_pinyinok-c";
  font-size: 0.75rem;
  color: red
}
.test2-6 {
  font-family: "MS Song";
  font-size: 0.75rem;
  color: black
}
.test3 {
  font-family: "宋体";
  font-size: 1rem;
  color: white
} /*16pt*/
.test3-1 {
  font-family: "宋体";
  font-size: 1rem;
  color: lightseagreen
}
.test3-2 {
  font-family: "宋体";
  font-size: 1rem;
  color: black;
  line-height: 200%
}
.test3-3 {
  font-family: "宋体";
  font-size: 1rem;
  color: red
}
.test4 {
  font-family: "仿宋";
  font-size: 1.125rem;
  color: red
} /*18pt*/
.test4-1 {
  font-family: "宋体";
  font-size: 1.125rem;
  color: black;
line-height: 200%;
}
.test4-2 {
  font-family: "宋体";
  font-size: 1.125rem;
  color: white;
  text-align: justify;
  text-align-last: justify;
}
.test4-3 {
  font-family: "宋体";
  font-size: 1.125rem;
  color: white
}
.test5 {
  font-family: "宋体";
  font-size: 1.25rem;
  color: red
} /*20pt*/
.test5-1 {
  font-family: "仿宋";
  font-size: 1.25rem;
  color: black;
  line-height: 200%;
} /*20pt*/
.test6 {
  font-family: "Arial Black";
  font-size: 1.5rem;
  color: red
} /*24pt*/
.test6-1 {
  font-family: "宋体";
  font-size: 1.5rem;
  color: white
} /*24pt*/
.test6-2 {
  font-family: "宋体";
  font-size: 1.5rem;
  color: black
} /*24pt*/
.test6-3 {
  font-family: "宋体";
  font-size: 1.5rem;
  color: lightseagreen
} /*24pt*/
.test6-4 {
  font-family: "宋体";
  font-size: 1.5rem;
  color: black;
  margin:2rem 0rem 2rem 0rem
} /*24pt 段落间距*/
.test7 {
  font-family: "宋体";
  font-size: 1.75rem;
  color: white
} /*28pt*/
.test7-1 {
  font-family: "宋体";
  font-size: 1.75rem;
  color: black
} /*28pt*/
.test7-2 {
  font-family: "宋体";
  font-size: 1.75rem;
  color: red
} /*28pt*/
.test8 {
  font-family: "宋体";
  font-size: 2rem;
  color: white
} /*32pt*/
.test8-1 {
  font-family: "宋体";
  font-size: 2rem;
  color: black
} /*32pt*/
.test8-2 {
  font-family: "宋体";
  font-size: 2rem;
  color: lightseagreen
} /*32pt*/
.test8-3 {
  font-family: "宋体";
  font-size: 2rem;
  color: black;
  margin:2.5rem 0rem 2.5rem 0rem
} /*32pt 段落间距*/
.test9 {
  font-family: "宋体";
  font-size: 2.25rem;
  color: white
} /*36pt*/
.test9-1 {
  font-family: "宋体";
  font-size: 2.25rem;
  color: black
} /*36pt*/
.test10 {
  font-family: "宋体";
  font-size: 3rem;
  color: white
} /*48pt*/
/*
test1 {  font-family: "Arial Black"; font-size: 18pt; color: red}
.test2 {  font-family: "MS Song"; font-size: 12pt; color: white}
.test3 {  font-family: "宋体"; font-size: 12pt; color:black}
.test4 {  font-family: "宋体"; font-size: 12pt; color:lightseagreen}
.test5 {  font-family: "宋体"; font-size: 9pt; color:lightseagreen}
.test6 {  font-family: "MS Song"; font-size: 12pt; color:black}
.test7 {  font-family: "宋体"; font-size: 16pt; color: white}
.test8 {  font-family: "gb_pinyinok-c"; font-size: 12pt; color: red}
.test9 {  font-family: "宋体"; font-size: 12pt; color:blue}
.test10 {  font-family: "Arial Black"; font-size: 18pt; color: red}
.test11 {  font-family: "宋体"; font-size: 16pt; color:lightseagreen}
.test12 {  font-family: "宋体"; font-size: 9pt; color: white}
.test13 {  font-family: "宋体"; font-size: 9pt; color: red}
.test14 {  font-family: "宋体"; font-size: 16pt; color: black}
.test15 {  font-family: "宋体"; font-size: 16pt; color:red }
.test16 {  font-family: "宋体"; font-size: 10pt; color:black }
.test24 {  font-family: "宋体"; font-size: 18pt; color:black }
.test48 {  font-family: "宋体"; font-size: 48pt; color:white}
.test32 {  font-family: "宋体"; font-size: 24pt; color:red}
.test33 {  font-family: "宋体"; font-size: 18pt; color:white}
*/

/*input框居中end*/
.title_box{
width: 100%;
overflow: hidden;
display: flex;
}
.title_left{width: 10px;height: 40px;border: 1px solid #FFFFFF ;float: left;}
.title_right{width: 10px;height: 40px;border: 1px solid #FFFFFF;float: right;}
.title_box input{width: 100%;}
/*input框居中end*/



/*泡泡背景*/
.kuang {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -10;
  background-image: linear-gradient(180deg, rgb(78, 168, 241), rgb(37, 91, 241));
}
.kuang1 {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -10;
}
.bubble {
  position: absolute;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: inset 0 0 8px #fff;
  animation: flutter 10s infinite;
  opacity: 0;
}
@keyframes flutter {
  0% {
    transform: translateX(0);
    bottom: -100px;
    opacity: 1;
  }
  50% {
    transform: translateX(100px);
    opacity: 0.5;
  }
  100% {
    transform: translateX(0px);
    bottom: 100%;
    opacity: 0;
  }
}
.bubble:nth-child(1) {
  left: -10%;
  width: 50px;
  height: 50px;
  animation-duration: 9s;
  animation-delay: 0.1s;
}
.bubble:nth-child(2) {
  left: 15%;
  width: 20px;
  height: 20px;
  animation-duration: 6s;
  animation-delay: 1.5s;
}
.bubble:nth-child(3) {
  left: 20%;
  width: 60px;
  height: 60px;
  animation-duration: 10s;
}
.bubble:nth-child(4) {
  left: 30%;
  width: 30px;
  height: 30px;
  animation-duration: 5.5s;
  animation-delay: 1.5s;
}
.bubble:nth-child(5) {
  left: 40%x;
  width: 50px;
  height: 50px;
  animation-duration: 12s;
}
.bubble:nth-child(6) {
  left: 50%;
  width: 20px;
  height: 20px;
  animation-duration: 6s;
  animation-delay: 1s;
}
.bubble:nth-child(7) {
  left: 60%;
  width: 40px;
  height: 40px;
  animation-duration: 8s;
  animation-delay: 1s;
}
.bubble:nth-child(8) {
  left: 65%;
  width: 60px;
  height: 60px;
  animation-duration: 15s;
}
.bubble:nth-child(9) {
  left: 80%;
  width: 55px;
  height: 55px;
  animation-duration: 9s;
  animation-delay: 0.5s;
}
.bubble:nth-child(10) {
  left: 100%;
  width: 40px;
  height: 40px;
  animation-duration: 12s;
}
/*泡泡背景end*/
.btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 230px;
  height: 90px;
  line-height: 90px;
  text-align: center;
  color: #fff;
  font-size: 25px;
  text-transform: uppercase;
  cursor: pointer;
  background: linear-gradient(90deg, #03a9f4, #f441a5, #ffeb3b, #03a9f4);
  background-size: 400%;
  border-radius: 60px;
}
.btn:hover {
  animation: animate 8s linear infinite;
}
@keyframes animate {
  0% {
    background-position: 0%;
  }
  100% {
    background-position: 400%;
  }
}
.btn::before {
  content: '';
  position: absolute;
  top: -5px;
  left: -5px;
  right: -5px;
  bottom: -5px;
  z-index: -1;
  background: linear-gradient(90deg, #03a9f4, #f441a5, #ffeb3b, #03a9f4);
  background-size: 400%;
  border-radius: 40px;
  opacity: 0;
  transition: 0.5s;
}
.btn:hover::before {
  filter: blur(20px);
  opacity: 1;
  animation: animate 8s linear infinite;
}
#rcorners1 {
  border-radius: 35px;
  background: #8AC007;
  padding: 20px;
  width: 200px;
  height: 150px;
}
#rcorners2 {
  border-radius: 15px 50px;
  border: 2px solid #8AC007;
  padding: 30px;
  width: 80%;
  height: 20%;
  align-content: center;
}
#rcorners3 {
  border-radius: 25px;
  background: url(/images/paper.gif);
  background-position: left top;
  background-repeat: repeat;
  padding: 20px;
  width: 200px;
  height: 150px;
}
div1 {
  position: absolute;
  left: 50%;
  width: 100px;
  height: 300px;
  padding: 15px;
  background-color: #8AC007;
  box-shadow: 5px 5px 5px #888888;
  text-align: center;
  margin: 0 auto;
  align-content: center;
}
div2 {
  margin: 0 auto;
  align-content: center;
  text-align: center;
}
/*div3是控制位于页面垂直居中*/
div3 {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 200px;
  height: 100px;
  margin-left: -100px;
  margin-top: -50px;
}
div5 {
  width: 500px;
  height: 300px;
  padding: 15px;
  background-color: #8AC007;
  box-shadow: 5px 5px 5px #888888;
}
h5 {
  text-shadow: 5px 5px 5px #888888;
}
#boxshadow {
  position: relative;
  -moz-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
  -webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
  box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
  padding: 10px;
  background: white;
}
/* Make the image fit the box */
#boxshadow img {
  width: 50%;
  border: 1px solid #8a4419;
  border-style: inset;
}
#boxshadow::after {
  content: '';
  position: absolute;
  z-index: -1; /* hide shadow behind image */
  -webkit-box-shadow: 0 15px 20px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 15px 20px rgba(0, 0, 0, 0.3);
  box-shadow: 0 15px 20px rgba(0, 0, 0, 0.3);
  width: 70%;
  left: 15%; /* one half of the remaining 30% */
  height: 100px;
  bottom: 0;
}
/*摁下的效果按钮*/
.button {
  display: inline-block;
  padding: 5px 15px;
  font-size: 1.125rem;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  color: #fff;
  background-color: #81CCEC;
  border: none;
  border-radius: 15px;
  box-shadow: 0 3px #999;
}
.button:hover {
  background-color: #3e8e41
}
.button:active {
  background-color: #3e8e41;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}
div6 {
  border: 15px solid transparent;
  width: 350px;
  padding: 10px 20px;
}
/*盒阴影*/
div7 {
  width: 500px;
  height: 200px;
  background-color: yellow;
  box-shadow: 10px 10px 5px #888888;
}
/*卡片式阴影*/
div.card {
  width: 95%;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  text-align: center;
}
div.header {
  background-color: #4CAF50;
  color: white;
  padding: 10px;
  font-size: 2rem;
}
div.container {
  padding: 10px;
}
/*卡片式结束*/
#round {
  -webkit-border-image: url(../images/border.png) 30 30 round; /* Safari 5 and older 平铺*/
  -o-border-image: url(../images/border.png) 30 30 round; /* Opera */
  border-image: url(../images/border.png) 30 30 round;
}
#stretch {
  -webkit-border-image: url(../border.png) 30 30 stretch; /* Safari 5 and older  拉伸*/
  -o-border-image: url(../border.png) 30 30 stretch; /* Opera */
  border-image: url(../border.png) 30 30 stretch;
}
/*处理图片*/
body {
  margin: 25px;
}
/*图片式卡片*/
div.polaroid {
  width: 100%;
  background-color: white;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-bottom: 25px;
}
div.container {
  text-align: center;
  padding: 10px 20px;
}
/*图片式卡片结束*/
/*导航栏*/
body {
  margin: 0;
}
ul.sidenav {
  list-style-type: none;
  margin: 0;
  padding: 0;
  width: 15%;
  background-color: #ADD8E6; /*导航文字背景色*/
  position: fixed;
  height: 100%;
  overflow: auto;
}
ul.sidenav li a {
  display: block;
  color: #000;
  padding: 8px 16px;
  text-decoration: none;
}
ul.sidenav li a.active {
  background-color: #4CAF50;
  color: white;
}
ul.sidenav li a:hover:not(.active) {
  background-color: #555;
  color: white;
}
div.content {
  margin-left: 25%;
  padding: 1px 16px;
  height: 1800px;
}

@media screen and (max-width: 1920px) {
  ul.sidenav {
    width: 100%;
    height: auto;
    position: relative;
  }
  /*屏幕小于1920，在顶部，大于1920，在左边*/
  ul.sidenav li a {
    float: left;
    padding: 15px;
    margin-left: 0px;
  }
  div.content {
    margin-left: 0;
  }
}
/*屏幕小于400，变垂直*/
@media screen and (max-width: 300px) {
  ul.sidenav li a {
    text-align: center;
    float: none;
  }
}
/*导航栏*/
/*下拉菜单*/
li a, .dropbtn {
  display: inline-block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}
li a:hover, .dropdown:hover, .dropbtn {
  background-color: #111;
}
.dropdown {
  display: inline-block;
}
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
}
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}
.dropdown-content a:hover {
  background-color: #f1f1f1
}
.dropdown:hover .dropdown-content {
  display: block;
}
.input {
  font-size: 1.6rem;
  /* 设置输入框中字体的大小 */
  height: 2.4rem;
  /* 设置输入框的高度 */
  border-radius: 0.4rem;
  /* 设置输入框的圆角的大小 */
  border: 0.1rem solid #CCEEFF;
  /* 设置输入框边框的粗细和颜色 */
  background-color: rgba(171, 143, 144, 0.05);
  /*设置输入框底色*/
  color: #986655;
  /* 设置输入框中文字的颜色 */
  outline: 0;
  /* 将输入框点击的时候出现的边框去掉 */
  text-align: center;
  /* 设置输入框中文字的位置 */
  padding-left: 1rem;
  /* display:block;
/* 将输入框设置为块级元素 */
  cursor: pointer;
  box-shadow: 0.1rem 0.1rem 0.1rem 0.1rem #CCEEFF;
  /* 将输入框设置阴影 */
}
input::-webkit-input-placeholder {
  color: #986655;
  font-size: 1.6rem;
}
h1 {
  font-family: "Arial", sans-serif;
  font-size: 3rem;
  '字体大小'
  text-align: center;
  font-weight: bold;
  color: #24F114;
  '字体颜色'
  margin-top: 200px;
}
.text {
  position: relative;
}
.text:after {
  content: '';
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: -moz-linear-gradient(top, rgba(39, 39, 39, 1) 0%, rgba(39, 39, 39, 0) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(39, 39, 39, 1)), color-stop(100%, rgba(39, 39, 39, 0)));
  background: -webkit-linear-gradient(top, rgba(39, 39, 39, 1) 0%, rgba(39, 39, 39, 0) 100%);
  background: -o-linear-gradient(top, rgba(39, 39, 39, 1) 0%, rgba(39, 39, 39, 0) 100%);
  background: -ms-linear-gradient(top, rgba(39, 39, 39, 1) 0%, rgba(39, 39, 39, 0) 100%);
  background: linear-gradient(to bottom, rgba(39, 39, 39, 1) 0%, rgba(39, 39, 39, 0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#272727', endColorstr='#00272727', GradientType=0);
}
span {
  text-shadow:
    0 -1px 0 #858585, 0 1px 10px rgba(0, 0, 0, .6), 0 6px 1px rgba(0, 0, 0, .1), 0 0 5px rgba(0, 0, 0, .2), 0 1px 3px rgba(0, 0, 0, .3), 0 3px 5px rgba(0, 0, 0, .2), 0 7px 10px rgba(0, 0, 0, .25), 0 15px 10px rgba(0, 0, 0, .2), 0 25px 15px rgba(0, 0, 0, .15);
}
#parent {
  height: 100%;
}
#floater {
  float: left;
  height: 50%;
  width: 100%;
  margin-bottom: -50%;
}
#child {
  clear: both;
  height: 50%;
}

.textarea-inherit {
	    width: 100%;
        overflow: auto;
        word-break: break-all; /* 解决兼容问题,文本输入框自适应大小，可用calss调用 */
    }
.textarea{

    width:400px;

    min-height:20px;

    max-height:300px;

    _height:120px;

    margin-left:auto;

    margin-right:auto;

    padding:3px;

    outline:0;

    border:1pxsolid#a0b3d6;

    font-size:12px;

    line-height:24px;

    padding:2px;

    word-wrap:break-word;

    overflow-x:hidden;

    overflow-y:auto;
    border-color:rgba(82,168,236,0.8);

    box-shadow:inset01px3pxrgba(0,0,0,0.1),008pxrgba(82,168,236,0.6);

}
