body{ 
    position: relative;
    height: 100vh;
    margin: 0;
}
body::after{
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(./imgs/bg2.png)no-repeat left bottom;
    background-size: 50%;
    z-index: -1;
}
body::before{
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: url(./imgs/bg.png)no-repeat right top;
    background-size: contain;
    z-index: -1;
}
.container{
    width: 960px;
    max-width: 100%;
    height: 100%;
    padding: 30px;
    margin: 0 auto;
    box-sizing: border-box;
}
.header,.content{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.header .logo img{
    width: 140px;
    height: 140px;
    object-fit: contain;
    object-position: right;
}
.header a{
    width: 35px;
    height: 35px;
    line-height: 35px;
    border: 1px solid #0F7459;
    color: #0F7459;
    text-align: center;
    text-decoration: none;
}
.content{ height: calc(100vh - 200px);}
.title{ width: 50%;}
.title h3{
    margin:7px 0;
    font-size:30px;
    color: #F5D100;
    font-weight: 500;
    font-family: tahoma;
}
.title h4{
    margin: 7px 0;
    font-size: 30px;
    color: #E30613;
    font-weight: 500;
    font-family: tahoma;
}
.title h4>span{ color: #0F7459;}
.two-btns{ margin-top: 25px;}
.two-btns a{ margin-left: 15px;}
.two-btns img{ width: 160px;}
.img{ width: 50%;}
.img img{ width: 100%;}
@media (max-width: 768px) {
    .two-btns a{ margin: 0;}
    .two-btns img{ width: 130px;}
    .img{ width: 40%;}
}
@media (max-width:600px) {
    .title{ width: 100%;}
    .two-btns img {
        width: 155px;
    }

    .img {
        width: 75%;
    }

    .content {
        flex-direction: column-reverse;
        justify-content: center;
    }
}