header{
    width: 100%;
    height: 100px;
    
    position: relative;
}
header>.tksp{
    position: absolute;
    left: 10px;
    top: 60px;
    font-size: 20px;
}
header>.gh{
    position: absolute;
    left: 93%;
    top: 60px;
    font-size: 20px;
}
header>.gh>a{
    text-decoration: none;
}
header>.gh>a:hover{
    text-decoration: underline;
    color: red;
}
header>.box{
    position: absolute;
    width: 150px;
    height: 50px;
    background-color: aliceblue;
    left: 78%;
    top: 48px;
    background-color: blue;
    border-radius: 10px;
}
header>.box1{
    position: absolute;
    width: 200px;
    height: 48px;
    background-color: aliceblue;
    top: 45px;
    border: 2px solid black;
}
header>.box2{
    position: absolute;
    width: 50px;
    height: 48px;
    background-color: aliceblue;
    border: 2px solid black;
    left: 202px;
    top: 45px;
}
header>.dn{
    position: absolute;
    left: 80%;
    top: 60px;
    font-size: 20px;
    font-weight: bold;
}
header>.dn>a{
    text-decoration: none;
    color: white;
}
header>.dn>a:hover{
    text-decoration: underline;
    color: red;
}
header>.anh{
    position: absolute;
    left: 45%;
}
header>.anh1{
    position: absolute;
    top: 50px;
    left: 90%;
}
header>.anh2{
    position: absolute;
    top: 46px;
    left: 205px;
}


nav{
    width: 100%;
    height: 70px;
    background-color:darkgray;
    text-align: center;
    line-height: 70px;
}
nav>a{
    text-decoration: none;
    margin: 0 85px;
    font-variant: small-caps;
    color: white;
}
nav>a:hover{
    text-decoration: underline;
    color: red;
}
article{
    width: 100%;
    height: 2850px;
    position: relative;
}
article>.anh3{
    position: absolute;
    top: 50px;
}
article>.box3{
    position: absolute;
    width: 550px;
    height: 350px;
    left: 910px;
    top: 50px;
    background-color:dimgray ;
    text-align: center;
    line-height: 350px;
}
h2{
    color: white;
}
article>.anh4{
    position: absolute;
    top: 420px;
    left: 910px;
}
article>.box4{
    position: absolute;
    width: 892px;
    height: 400px;
    background-color:dimgray;
    top: 570px;
    text-align: center;
}
h1{
    color: white;
    font-size: 40px;
}
h4{
    color: white;
    font-size: 30px;
    padding-top: 50px;
}
article>.box5{
    position: absolute;
    width: 100%;
    height: 80px;
    background-color:darkgray;
    top: 980px;
    line-height: 80px;
}
article>.box5>a{
    text-decoration: none;
    font-size: 40px;
    font-variant: small-caps;
    color: white;
    font-weight: bold;
}
article>.box6{
    position: absolute;
    width: 32%;
    height: 500px;
    top: 1080px;
    background-color: lightgray;
    text-align: center;
}
.imgchange{
    width: 400px;
    height: 400px;
}
article>.chu1{
    position: absolute;
    top: 1490px;
    left: 30px;
}
article>.chu1>a{
    text-decoration: none;
    font-size: 24px;
    font-variant: small-caps;
    color: crimson;
}
article>.chu1>a:hover{
    font-weight: bold;
    color: green;
}
.imgchange1{
    position: absolute;
    width: 100px;
    height: 40px;
    top: 1525px;
    left: 60px;
}
article>.chu2{
    position: absolute;
    top: 1528px;
    left: 178px;
    font-size: 25px;
    font-variant: small-caps;
}
article>.chu2>a{
    text-decoration: none;
    color:dodgerblue;
}
article>.chu2>a:hover{
    text-decoration: underline;
    color: crimson;
    font-weight: bold;
}
article>.box7{
    position: absolute;
    width: 32%;
    height: 500px;
    top: 1080px;
    left: 496px;
    background-color:lightgray;
    text-align: center;
}
.imgchange2{
    width: 400px;
    height: 400px;
}
article>.chu3{
    position: absolute;
    top: 1490px;
    left: 530px;
}
article>.chu3>a{
    color: crimson;
    text-decoration: none;
    font-size: 24px;
    font-variant: small-caps;
}
article>.chu3>a:hover{
    color:green;
    font-weight: bold;
}
.imgchange3{
    position: absolute;
    width: 100px;
    height: 40px;
    top: 1525px;
    left: 560px;
}
article>.chu4{
    position: absolute;
    top: 1528px;
    left: 680px;
    font-size: 25px;
    font-variant: small-caps;
}
article>.chu4>a{
    text-decoration: none;
    color: dodgerblue;
}
article>.chu4>a:hover{
    color: crimson;
    font-weight: bold;
    text-decoration: underline;
}
article>.box8{
    position: absolute;
    width: 32%;
    height: 500px;
    top: 1080px;
    left: 68%;
    background-color:lightgray;
    text-align: center;
}
.imgchange4{
    width: 400px;
    height: 400px;
}
article>.chu5{
    position: absolute;
    top: 1490px;
    left: 1025px;
}
article>.chu5>a{
    color:crimson;
    text-decoration: none;
    font-size: 24px;
    font-variant: small-caps;
}
article>.chu5>a:hover{
    color:green;
    font-weight: bold;
}
.imgchange5{
    position: absolute;
    width: 100px;
    height: 40px;
    top: 1525px;
    left: 1055px;
}
article>.chu6{
    position: absolute;
    top: 1528px;
    left: 1175px;
    font-size: 25px;
    font-variant: small-caps;
}
article>.chu6>a{
    text-decoration: none;
    color: dodgerblue;
}
article>.chu6>a:hover{
    color: crimson;
    font-weight: bold;
    text-decoration: underline;
}
article>.box9{
    position: absolute;
    width: 100%;
    height: 80px;
    background-color:darkgray;
    top: 1590px;
    line-height: 80px;
}
article>.box9>a{
    text-decoration: none;
    font-size: 40px;
    font-variant: small-caps;
    color: white;
    font-weight: bold;
}
article>.box10{
    position: absolute;
    width: 32%;
    height: 500px;
    top: 1690px;
    background-color:lightgray;
    text-align: center;
}
.imgchange6{
    width: 400px;
    height: 400px;
}
article>.chu7{
    position: absolute;
    top: 2100px;
    left: 32px;
}
article>.chu7>a{
    color: crimson;
    text-decoration: none;
    font-size: 23px;
    font-variant: small-caps;
}
article>.chu7>a:hover{
    color:green;
    font-weight: bold;
}
article>.box11{
    position: absolute;
    width: 32%;
    height: 500px;
    top: 1690px;
    left: 496px;
    background-color:lightgray;
    text-align: center;
}
.imgchange7{
    width: 400px;
    height: 400px;
}
article>.chu8{
    position: absolute;
    top: 2100px;
    left: 530px;
}
article>.chu8>a{
    color: crimson;
    text-decoration: none;
    font-size: 24px;
    font-variant: small-caps;
}
article>.chu8>a:hover{
    color:green;
    font-weight: bold;
}
article>.box12{
    position: absolute;
    width: 32%;
    height: 500px;
    top: 1690px;
    left: 68%;
    background-color:lightgray;
    text-align: center;
}
.imgchange8{
    width: 400px;
    height: 400px;
}
article>.chu9{
    position: absolute;
    top: 2100px;
    left: 1028px;
}
article>.chu9>a{
    color: crimson;
    text-decoration: none;
    font-size: 22px;
    font-variant: small-caps;
}
article>.chu9>a:hover{
    color:green;
    font-weight: bold;
}
article>.box13{
    position: absolute;
    width: 100%;
    height: 80px;
    background-color:darkgray;
    top: 2200px;
    line-height: 80px;
}
article>.box13>a{
    text-decoration: none;
    font-size: 40px;
    font-variant: small-caps;
    color: white;
    font-weight: bold;
}
article>.box14{
    position: absolute;
    width: 32%;
    height: 500px;
    top: 2300px;
    background-color:lightgray;
    text-align: center;
}
.imgchange9{
    width: 400px;
    height: 400px;
}
article>.chu10{
    position: absolute;
    top: 2710px;
    left: 85px;
}
article>.chu10>a{
    color: crimson;
    text-decoration: none;
    font-size: 23px;
    font-variant: small-caps;
}
article>.chu10>a:hover{
    color:green;
    font-weight: bold;
}
article>.box15{
    position: absolute;
    width: 32%;
    height: 500px;
    top: 2300px;
    left: 496px;
    background-color:lightgray;
    text-align: center;
}
.imgchange10{
    width: 400px;
    height: 400px;
}
article>.chu11{
    position: absolute;
    top: 2710px;
    left: 585px;
}
article>.chu11>a{
    color: crimson;
    text-decoration: none;
    font-size: 23px;
    font-variant: small-caps;
}
article>.chu11>a:hover{
    color:green;
    font-weight: bold;
}
article>.box16{
    position: absolute;
    width: 32%;
    height: 500px;
    top: 2300px;
    left: 993px;
    background-color:lightgray;
    text-align: center;
}
.imgchange11{
    width: 400px;
    height: 400px;
}
article>.chu12{
    position: absolute;
    top: 2710px;
    left: 1085px;
}
article>.chu12>a{
    color: crimson;
    text-decoration: none;
    font-size: 23px;
    font-variant: small-caps;
}
article>.chu12>a:hover{
    color:green;
    font-weight: bold;
}
footer{
    width: 100%;
    height: 400px;
    background-color:rgb(22, 148, 150);
    position: relative;
    
}
footer>.chu13{
    line-height: 80px;
}
footer>.chu13>a{
    position: absolute;
    text-decoration: none;
    font-size: 20px;   
    color: white;
    margin-top: -9px;
    padding: 0px 20px;
}
footer>.chu13>a:hover{
    color: gold;
    font-weight: bold;
    text-decoration: underline;
}
footer>.chu14{
    margin-top: -250px;
    padding: 0 600px;
    line-height: 80px;
}
footer>.chu14>a{
    position: absolute;
    text-decoration: none;
    color: white;
    font-size: 20px;
}
footer>.chu14>a:hover{
    color: gold;
    font-weight: bold;
    text-decoration: underline;
}
footer>.chu15{
    margin-top: -320px;
    padding: 0 1000px;
    line-height: 80px;
}
footer>.chu15>a{
    position: absolute;
    text-decoration: none;
    color: white;
    font-size: 20px;
}
footer>.chu15>a:hover{
    color: gold;
    font-weight: bold;
    text-decoration: underline;
}
footer>.chu15>p{
    position: absolute;
    margin-top: 0px;
    font-size: 20px;
    line-height: 40px;
    color: white;
}
.imgchange12{
    position: absolute;
    width: 400px;
    height: 200px;
    left: 1000px;
    top: 180px;
}