@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap');
._kln{font-weight: bold;}
._ysc{text-align: center;}
._ysr{text-align: right;}
._gz{display: none;}
.pd-5{margin:5px}.pd-10{margin:10px}.pd-15{margin:15px}.pd-20{margin:20px}
.pd-t5{margin-top:5px}.pd-t10{margin-top:10px}.pd-t15{margin-top:15px}.pd-t20{margin-top:20px}
.pd-b5{margin-bottom:5px}.pd-b10{margin-bottom:10px}.pd-b15{margin-bottom:15px}.pd-b20{margin-bottom:20px}
.pd-l5{margin-left:5px}.pd-l10{margin-left:10px}.pd-l15{margin-left:15px}.pd-l20{margin-left:20px}
.pd-r5{margin-right:5px}.pd-r10{margin-right:10px}.pd-r15{margin-right:15px}.pd-r20{margin-right:20px}
.mr-5{margin:5px}.mr-10{margin:10px}.mr-15{margin:15px}.mr-20{margin:20px}
.mr-t5{margin-top:5px}.mr-t10{margin-top:10px}.mr-t15{margin-top:15px}.mr-t20{margin-top:20px}
.mr-b5{margin-bottom:5px}.mr-b10{margin-bottom:10px}.mr-b15{margin-bottom:15px}.mr-b20{margin-bottom:20px}
.mr-l5{margin-left:5px}.mr-l10{margin-left:10px}.mr-l15{margin-left:15px}.mr-l20{margin-left:20px}
.mr-r5{margin-right:5px}.mr-r10{margin-right:10px}.mr-r15{margin-right:15px}.mr-r20{margin-right:20px}
textarea:focus,input:focus{
    outline: none;
}
a:link,a:active,a:visited,a:focus{text-decoration:none}
a:hover{text-decoration:none}
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Open Sans',sans-serif;
}
body{
    display: flex;
    justify-content: center;
    font-weight: 500;
    font-size: 12px;
    background: #d4d4d4
}
.kt{
    position: relative;
    width: 100%;
    border: 0;
    background: #fff;
    height: 100vh;
}
@media (min-width:740px){
    .kt{
        width: 700px;
    }
}
.b1{
    height: 100vh;
    overflow-y: auto;
}
.b1-a{
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #ccc;
    height: 60px;
    font-size: 14px;
}
.b1-b{
    padding: 15px 10px;
    background: #f2f2f2;
    border-bottom: 1px solid #ccc;
}
.b1-c{
    padding: 15px 10px;
    background: rgb(207, 186, 186);
}
.b1-d{
    display: flex;
    justify-content: space-between;
    padding: 10px;
}
.b1-d2 span{
    font-size: 12px;
    color: #ccc;
}
.b1-br{
    border-top: 1px dashed #ccc
}

.b2-a{
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #ccc;
    height: 60px;
    font-size: 14px;
}
.b2-b{
    padding: 15px 10px;
    background: #f2f2f2;
    border-bottom: 1px solid #ccc;
}
.b2-r1{
    color: #489729;
}
.b2-r2{
    color: #f00;
}
.b2-c{
    display: flex;
    justify-content: space-between;
    border-bottom: 1px dashed #ccc;
    padding: 10px;
}
.b2-d{
    display: flex;
}
.b2-d1{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.b2-d1-a{
    display: flex;
}
.b2-d1-a span{
    border: 1px solid #ccc;
    background: #f2f2f2;
    padding: 5px;
    border-radius: 25%;
    font-weight: bold;
}


.b3-a{
    padding: 10px;
    display: flex;
    align-items: center;
}
.b3-a1{
    width: 100px;
}
.b3-a2{
    flex: 1;
    display: flex;
}
.b3-a2-g1{
    background: #1e991a;
    color: #fff;
    padding: 10px;
}
.b3-a2-g2{
    background: #f00;
    color: #fff;
    padding: 10px;
}
.b3-a2-g3{
    border:1px solid #999;
    color: #999;
    padding: 10px;
}
.b3-a input[type=text],.b3-a select{
    padding: 5px 10px;
}
.b4-br{
    border-top: 1px dashed #ccc
}
.b4-d{
    display: flex;
    padding: 10px;
}
.b4-d1{
    width: 40px;
    font-size: 20px;
    color: #77531d;
}
.b4-d2{
    width: 80px;
}
.b4-d2-b{
    font-size: 10px;
    color: #999;
}
.b4-d2-c{
    font-size: 12px;
    color: #77531d;
}
.b4-d3{
    flex: 1;
    display: flex;
    justify-content: space-between;
}
.b4-d3-b{
    display: flex;
    align-items: end;
    flex-direction: column;
}
.b4-d3-b2{
    margin-top: 5px;
    color: #999;
}
.b4-rnk1{
    color: #1e991a
}
.b4-rnk2{
    color: #f00
}




.z1{
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
.z1 form{
    border: 1px solid #666;
    border-radius: 10px;
    padding: 20px;
    width: 250px;
}
.z1 form input[type="text"],.z1 form input[type="password"]{
    padding: 10px;
    width: 100%;
}
.z1 form input[type="submit"]{
    width: 100%;
    background: #2f6818;
    color: #fff;
    border: 1px solid #666;
    padding: 10px;
}
.z1 form div{
    display: flex;
    justify-content: center;
}