body {background-color:white;}
body,div{margin:0;padding:0;box-sizing:border-box;}
p {
font-family:arial;
color:gray;
}
* {
box-sizing:border-box;
}

* {
margin:0;
padding:0;
}
#topc {
width:100%;
height:110px;
background-color:#484848;
/*display: -webkit-flex;*/
display: flex;
}
#top {
width:100%;
max-width:900px;
height:110px;
display: flex;
display: -webkit-flex;
-webkit-flex-wrap: nowrap;
flex-wrap:nowrap;
background-color:white;
padding:0px;
margin:auto;
/*border-bottom:2px solid #b00000;*/
}
#top div:nth-of-type(1) {
min-width:140px;
margin:0px;
flex-grow:1;
}
#top div:nth-of-type(2) {
min-width:140px;
margin:0px;
flex-grow:1;
}
#info {
width:100%;
max-width:900px;
height:30px;
padding:0px;
margin:auto;
background-color:#e0e0e0;
/*border-bottom:2px solid #b00000;*/
}
.tab {
float:right;
margin-left:3px;
width:60px;
height:25px;
text-align:center;
background-color:white;
cursor:pointer;
color:gray;
font-family:arial;
font-size:13px;
line-height:25px;
}
.tab:hover {
float:right;
margin-left:3px;
width:60px;
height:25px;
border:1px solid white;
text-align:center;
background-color:white;
cursor:pointer;
color:black;
}
.tabel{
float:left;
margin-left:3px;
width:50px;
height:25px;
text-align:center;
background-color:white;
cursor:pointer;
color:gray;
font-family:arial;
font-size:13px;
line-height:25px;
}
.tabel:hover {
float:left;
margin-left:3px;
width:50px;
height:25px;
border:1px solid white;
text-align:center;
background-color:white;
cursor:pointer;
color:black;
}
.inform {
position:fixed;
right: 0;
left: 0;
width:95%;
max-width:350px;
top:50%;
margin-top:-150px;
background-color:white;
margin-left:auto;
margin-right:auto;
padding:20px;
z-index:110;
color:gray;
font-family:arial;
border:1px solid gray;
border-radius:8px;
}
#overlay1 {
display:none;
position:fixed;
background-color:#484848;
opacity:0.5;
width:100%;
height:100%;
z-index:100;
top:0px;
left:0px;
}
#overlay2 {
display:none;
position:fixed;
background-color:#484848;
opacity:0.5;
width:100%;
height:100%;
z-index:100;
top:0px;
left:0px;
}
#overlay3 {
display:none;
position:fixed;
background-color:#484848;
opacity:0.5;
width:100%;
height:100%;
z-index:100;
top:0px;
left:0px;
}
#overlay4{
display:none;
position:fixed;
background-color:#484848;
opacity:0.5;
width:100%;
height:100%;
z-index:100;
top:0px;
left:0px;
}
#close {
position:relative;
float:right;
width:49px;
height:18px;
left:17px;
top:-17px;
cursor:pointer;
background-image:url(images/bak.png);
background-size:49px 36px;
background-repeat:no repeat;
background-position:0px 0px;
}
#close:hover {
position:relative;
float:right;
width:49px;
height:18px;
left:17px;
top:-17px;
cursor:pointer;
background-image:url(images/bak.png);
background-size:49px 36px;
background-repeat:no repeat;
background-position:0px -18px;
}
.ml {
width:45px;
height:30px;
border:none;
background-image:url(images/mail.png);
background-size:45px 60px;
background-position:0px 0px;
cursor:pointer;
}
.ml:hover {
width:45px;
height:30px;
border:none;
background-image:url(images/mail.png);
background-size:45px 60px;
background-position:0px -30px;
cursor:pointer;
}
#wr1{
display:none;
}
#wr2{
display:none;
}
#wr3{
display:none;
}
#wr4{
display:none;
}
.pos{
grid-area:bx1;
background-color:white;
overflow:hidden;
}
.posp{
width:100%;
background-color:white;
overflow:hidden;
}
.posi{
position:relative;
white-space:nowrap;
height:70px;
overflow-x:auto;
overflow-y:hidden;
background-color:white;
}

.ser {
grid-area:bx2;
padding-top:15px;
}
.pro {
grid-area:bx3;
}
.contain {
position:relative;
width:100%;
max-width:900px;
margin:auto;
overflow-x:hidden;
overflow-y:hidden;
display: grid;
grid-template-columns:1fr;
grid-template-areas:"bx1"
"bx2"
"bx3";
}
.containp {
position:relative;
width:100%;
max-width:900px;
margin:auto;
overflow-x:hidden;
overflow-y:hidden;
}
.aa {
position:relative;
display:block;
height:35px;
width:300px;
background:url(images/GBG.png);
background-size:300px 70px;
background-position:0px 0px;
margin-left:50%;
left:-150px;
margin-bottom:3px;
text-align:center;
border:1px solid gray;
border-radius:5px;
cursor:pointer;
font-family:arial;
color:gray;
clear:both;
line-height:35px;
}
.aa:hover {
position:relative;
display:block;
height:35px;
width:300px;
background:url(images/GBG.png);
background-size:300px 70px;
background-position:0px -35px;
margin-bottom:3px;
text-align:center;
margin-left:50%;
left:-150px;
border:2px solid gray;
border-radius:5px;
font-family:arial;
color:black;
cursor:pointer;
clear:both;
line-height:35px;
}
.ah {
position:relative;
display:block;
height:35px;
width:300px;
background-image:url(images/rev.png);
background-size:300px 35px;
margin-left:50%;
left:-150px;
margin-top:16px;
margin-bottom:3px;
text-align:center;
border:1px solid gray;
border-radius:5px;
cursor:pointer;
font-family:arial;
color:gray;
clear:both;
line-height:35px;
}
.ah:hover {
position:relative;
display:block;
height:35px;
width:300px;
background-image:url(images/rev.png);
background-size:300px 35px;
margin-top:16px;
margin-bottom:3px;
text-align:center;
margin-left:50%;
left:-150px;
border:2px solid gray;
border-radius:5px;
font-family:arial;
color:black;
cursor:pointer;
clear:both;
line-height:35px;
}
.ex {
position:relative;
display:none;
height:35px;
width:300px;
background-color:white;
margin-left:50%;
left:-150px;
margin-bottom:3px;
text-align:center;
border:1px solid gray;
border-radius:5px;
cursor:pointer;
font-family:arial;
color:gray;
clear:both;
line-height:35px;
}
.ex:hover {
position:relative;
display:none;
height:35px;
width:300px;
background-color:#f5f5f5;
margin-bottom:3px;
text-align:center;
margin-left:50%;
left:-150px;
border:2px solid gray;
border-radius:5px;
font-family:arial;
color:black;
cursor:pointer;
clear:both;
line-height:35px;
}
.aax {
position:relative;
display:block;
height:35px;
width:300px;
background-image:url(images/BG.png);
background-size:300px 70px;
background-position:0px 0px;
margin-left:50%;
left:-150px;
margin-bottom:3px;
text-align:center;
border:1px solid gray;
border-radius:5px;
cursor:pointer;
font-family:arial;
color:gray;
clear:both;
line-height:35px;
}
.aax:hover {
position:relative;
display:block;
height:35px;
width:300px;
/*background-color:#f5f5f5;*/
margin-bottom:3px;
text-align:center;
margin-left:50%;
left:-150px;
border:2px solid gray;
border-radius:5px;
font-family:arial;
color:black;
cursor:pointer;
clear:both;
line-height:35px;
}
.aacl {
position:relative;
clear:both;
display:block;
height:35px;
width:300px;
background-color:#ccffff;
text-align:center;
margin-left:50%;
left:-150px;
margin-bottom:15px;
margin-top:15px;
text-align:center;
border:1px solid grey;
border-radius:5px;
cursor:pointer;
font-family:arial;
line-height:35px;
color:grey;
}
.aacl:hover {
position:relative;
clear:both;
height:35px;
width:300px;
background-color:#f5f5f5;
text-align:center;
margin-left:50%;
left:-150px;
margin-bottom:15px;
margin-top:15px;
text-align:center;
border:2px solid grey;
border-radius:5px;
cursor:pointer;
font-family:arial;
line-height:35px;
color:black;
}
.ab {
text-decoration:none;
font-family:arial;
color:gray;
line-height:35px;
}
.foot {
width:100%;
max-width:900px;
margin:auto;
padding:20px;
background-color:#484848;
color:white;
font-family:arial;
font-size:8px;
overflow:hidden;
clear:left;
}
.but{
position:fixed;
top:160px;
/*margin-left:99%;*/
width:70px;
height:25px;
background:url(images/bak.png) no-repeat;
background-size:70px 50px;
background-position:0px 0px;
text-decoration:none;
cursor:pointer;
z-index:99;
border:none;
}
.but:hover{
position:fixed;
top:160px;
/*margin-left:99%;*/
width:70px;
height:25px;
background:url(images/bak.png) no-repeat;
background-size:70px 50px;
background-position:0px -25px;
text-decoration:none;
cursor:pointer;
z-index:99;
border:none;
}
.sod {
position:relative;
width:51px;
height:51px;
display:inline-block;
cursor:pointer;
margin-right:1px;
}
.sodp {
width:50px;
height:50px;
}
#rt1 {
position:relative;
width:35px;
height:160px;
/*background:url(images/bbt.png);*/
/*background-size:35px 160px;*/
margin-top:5px;
float:left;
cursor:pointer;
border:none;
}
#rt1:hover {
position:relative;
width:35px;
height:160px;
/*background:url(images/bbt.png);*/
/*background-size:35px 160px;*/
margin-top:5px;
float:left;
cursor:pointer;
border:2px solid white;
}
#rt2 {
position:relative;
width:35px;
height:160px;
background:url(images/bbt.png) no-repeat;
background-position:left;
background-size:35px 160px;
margin-top:5px;
float:left;
cursor:pointer;
border:none;
z-index:50;
}
#rt2:hover {
position:relative;
width:35px;
height:160px;
background:url(images/bbt.png) no-repeat;
background-size:32px 160px;
background-position:left;
margin-top:5px;
float:left;
cursor:pointer;
border:none;
z-index:50;
}
#rt3 {
position:relative;
width:35px;
height:160px;
background:url(images/fbt.png) no-repeat;
background-position:right;
background-size:35px 160px;
margin-top:5px;
float:left;
cursor:pointer;
border:none;
z-index:50;
}
#rt3:hover{
position:relative;
width:35px;
height:160px;
background:url(images/fbt.png) no-repeat;
background-position:right;
background-size:32px 160px;
margin-top:5px;
float:left;
cursor:pointer;
border:none;
z-index:50;
}
#rt4 {
position:relative;
width:35px;
height:160px;
/*background:url(images/fbt.png);*/
/*background-size:35px 160px;*/
margin-top:5px;
float:left;
cursor:pointer;
border:none;
}
#rt4:hover{
position:relative;
width:35px;
height:160px;
/*background:url(images/fbt.png);*/
/*background-size:35px 160px;*/
margin-top:5px;
float:left;
cursor:pointer;
border:2px solid white;
}
#poc1 {
position:relative;
width:160px;
height:160px;
margin-top:5px;
float:left;
opacity:0.5;
}
.sid {
width:70px;
height:25px;
border-bottom:1px solid white;
margin:3px;
color:white;
text-align:center;
line-height:13px;
font-family:arial;
font-size:14px;
cursor:pointer;
}
.side {
width:70px;
height:25px;
margin:3px;
background:url(images/aup.png);
background-size:70px 20px;
cursor:pointer;
}
.cmnm {
position:fixed;
width:80px;
height:0px;
float:left;
background-color:black;
top:140px;
padding-top:0px;
display:block;
overflow:hidden;
transition:height 0.5s;
-webkit-transition:height 0.5s;
z-index:99;
opacity:0.9;
}
.cmnm2 {
position:fixed;
display:block;
width:80px;
height:98px;
float:left;
background-color:black;
top:140px;
z-index:99;
padding-top:3px;
/*overflow:hidden;*/
transition:height 0.5s;
-webkit-transition:height 0.5s;
opacity:0.9;
}
#pan1 {
position:absolute;
display:block;
top:1px;
height:150px;
left:81px;
background-color:black;
z-index:99;
padding-top:3px;
overflow:hidden;
transition:width 0.5s;
-webkit-transition:width 0.5s;
opacity:0.95;
}
#pan2 {
position:absolute;
display:block;
top:1px;
height:150px;
left:81px;
background-color:black;
z-index:99;
padding-top:3px;
overflow:hidden;
transition:width 0.5s;
-webkit-transition:width 0.5s;
opacity:0.95;
}
#pan3 {
position:absolute;
display:block;
top:1px;
height:150px;
left:81px;
background-color:black;
z-index:99;
padding-top:3px;
overflow:hidden;
transition:width 0.5s;
-webkit-transition:width 0.5s;
opacity:1;
}