@charset "utf-8";
* { margin:0; padding:0;}
ul,ol,li { list-style:none;}
a { text-decoration:none;}
h1,h2,h3,h4,h5,h6 { font-size:100%;}
body { font-size:13px; line-height:1;}
table { border-collapse: collapse;}
img { vertical-align:top;}
.clear:after { content:""; display:block; clear:both;}


body{background-image: url(bg.jpg); background-size: cover; width: 100vw; height: 100vh;}

h2{position: absolute; top:200px; left:30%; transform: translateX(-50%); font-size: 30px;color:#fff; }
.write-btn { color:#fff; display: block; width: 100px; height: 30px; line-height: 30px;
             position: absolute; top:300px; left:30%; transform: translateX(-50%);
            border:1px solid #fff; font-size: 20px; ;text-align: center; background-color: rgba(0,0,0,0.7);}

table{border:1px solid #fff; text-align: center; position: absolute; top:45%; left:30%; transform: translate(-50%,-50%);
        background-color: rgba(0,0,0,0.7); color:#fff;font-size: 15px; ;}

th{line-height: 30px;}

td{width:100px; line-height: 30px;}

tr{border-bottom:1px solid #fff;}

table a{color:#fff;}


.searchbox {text-align: center; position: absolute; top:70%; left:30%; transform: translate(-50%,-50%);
             color:#fff;font-size: 15px; ;}

.searchbox #search2{background-color: black ; color: #fff;border:1ps solid #fff; width:60px;}

.list { color:#fff; display: block; width: 100px; height: 30px; line-height: 30px;
    position: absolute; top:642px; left:15%; transform: translateX(-50%);
   border:1px solid #fff; font-size: 20px; ;text-align: center; background-color: rgba(0,0,0,0.7);}