@media screen and (max-width:420px){
    header{
        width: 100%;
        height: 40px;
    }
    .head_cont{
        width: 100%;
        height: 40px;
    }
    .head_div1{
        width: 400px;
        height: 30px;
    }
    .head_div2{
        width: 550px;
        height: 30px;
    }
    #but1{
        width: 80px;
        height: 30px;
    }
    #but1:hover{
        font-size: 10px;
    }
    #but2{
        width: 80px;
        height: 30px;
    }
    #but2:hover{
        font-size: 10px;
    }
    
    .head_p{
        font-size: 12px;
    }
    .head_p1{
        font-size: 20px;
    }
    main{
        height: 580px;

    }
    .main_cont{
        height: 80px;
    }
    .main_div1{
        width: 300px;
        height: 50px;
    }
    .main_div2{
        width: 500px;
        height: 50px;
    }
    h1{
        font-size: 35px;
    }
    h1:hover{
        font-size: 50px;
    }
    nav{
        height: 50px;
    }
    .menu{
        height: 50px;
    }
    .menu>li{
        font-size: 10px;
        padding-left: 30px;
    }
    .menu>li:hover{
        font-size: 18px;
    }
    .menu>li:nth-child(1){
        width: 35%;
        height: 50px;
        padding: 16px 5px;
        font-size: 10px;
    }
    .menu1{
        top: 30px;
        left: 5px;
    }
    .menu1>li{
        width: 115px;
        height: 35px;
        padding: 5px;
        font-size: 14px;
       
    }
    .menu1>li:hover{
        width: 120px;
        height: 35px;
    }
    .menu2{
        top: 30px;
        left: 5px;
    }
    .menu2>li{
        width: 115px;
        height: 35px;
        padding: 5px;
        font-size: 14px;
    }
    .menu2>li:hover{
        width: 120px;
        height: 35px;
    }
    .ic3{
        padding: 0 8px;
    }
    .main_div3{
        width: 350px;
        height: 350px;
        margin: 80px auto;

    }
    .main_div4{
        width: 250px;
        height: 250px;
        top: 50px;
        left: 50px;
    }
    .main_h2{
        text-align: center;
        font-size: 85px;
        padding-top: 70px;
    }
    .main_h2:hover{
        font-size: 95px;
    }
    .main_h3{
        font-size: 25px;
    }
    .main_h3:hover{
        font-size: 30px;
    }
    .main_div5{
        width: 500px;
        height: 120px;
    }
    .main_p{
        font-size: 15px;
        padding: 0 5px;
        display: none;
    }
    section{
        height: 800px;
    }
    .sec_cont1{
        height: 800px;
    }
    .sec_div1{
        width: 710px;
        height: 380px;
        top: 10px;
        left: 60px;
        display: none;
    }
    .sec_cont2{
        width: 300px;
        height: 38px;
    }
    .sec1_item1{
        width: 300px;
        height: 25px;
    }
    .sec_cont3{
        width: 700px;
        height: 320px;
        display: none;
        
    }
    .sec_div2{
        width: 420px;
        height: 380px;
        top: 10px;
        right:2px;
    }
    .sec_item9{
        width: 350px;
        height: 30px;
    }
    .sec_h3{
        font-size: 20px;
    }
    .sec_item10{
        width: 165px;
        height: 100px;
        margin: 10px;
    }
    #sec_but{
        width: 130px;
        height: 50px;
        margin: 15px 20px;
    }
    #sec_but:hover{
        width: 150px;
        height: 55px;
        margin: 15px 6px;
    }
    .sec_div3{
        width: 415px;
        height: 380px;
        top: 410px;
        left: 3px;
    }
    .sec_div4{
        width: 420px;
        height: 380px;
        top: 410px;
        right: 5px;
    }
    .sec_item11{
        width: 300px;
        height: 35px;
    }
    .sec_p1{
        font-size: 22px;
    }
    .sec_item12{
        width: 180px;
        margin: 15px;
    }
    .sec_item13{
        width: 350px;
        height: 215px;
        margin-top: 15px;
    }
    .sec2_p2{
        font-size: 10px;
        padding: 0 5px;
    }
    #but3{
        width: 158px;
        height: 45px;
        font-size: 10px;
        margin: 15px 110px;
    }
    #but3:hover{
        width: 180px;
        height: 50px;
    }
    .sec1{
        height: 800px;
    }
    .size{
        width: 86%;
    }
    .sec1_cont{
        height: 55px;
    }
    .sec1_h3{
        width: 300px;
        height: 30px;
        font-size: 20px;
    }
    .sec1_hr{
        width: 120px;
        margin-top:15px ;
    }
    .sec1_cont2{
        height: 700px;  
    }
    .sec1_item{
        width: 150px;
        height: 150px;
    }
    .sec1_item:hover{
        width: 180px;
        height: 180px;
    }
    .sec1_item1{
        width: 150px;
        height: 150px;
    }
    .sec1_item1:hover{
        width: 180px;
        height: 180px;
    }
    .sec1_item3{
        width: 150px;
        height: 150px;
        margin-top: 5px;
    }
    .sec1_item3:hover{
        width: 180px;
        height: 180px;
    }
    .sec1_item4{
        width: 150px;
        height: 150px;
    }
    .sec1_item4:hover{
        width: 180px;
        height: 180px;
    }
    .sec1_item5{
        width: 150px;
        height: 150px;
    }
    .sec1_item5:hover{
        width: 180px;
        height: 180px;
    }
    .sec1_item6{
        width: 150px;
        height: 150px;
    }
    .sec1_item6:hover{
        width: 180px;
        height: 180px;
    }
    .sec1_item7{
        width: 150px;
        height: 150px;
    }
    .sec1_item7:hover{
        width: 180px;
        height: 180px;
    }
    .sec1_item8{
        width: 150px;
        height: 150px;
    }
    .sec1_item8:hover{
        width: 180px;
        height: 180px;
    }
    /* .sec1_item{
        width: 150px;
        height: 150px;
    }
    .sec1_item:hover{
        width: 180px;
        height: 180px;
    }
    .sec1_item2{
        width: 185px;
        height: 65px;
    }
    .sec1_item5{
        display: none;
    }
    .sec1_item2:nth-child(3){
        display: none;
    }
    .sec1_item7{
        display: none;
    }
    .sec1_item2:nth-child(4){
        display: none;
    }
    .sec1_item6{
        display: none;
    }
    .sec1_item2:nth-child(7){
        display: none;
    }
    .sec1_item8{
        display: none;
    }
    .sec1_item2:nth-child(8){
        display: none;
    } */

    .sec1_p{
        font-size: 10px;
        padding: 0 28px;
    }
    .sec1_p:hover{
        font-size: 15px;
    }
    .sec2{
        height: 200px;
    }
    .sec2_cont{
        height: 55px;
    }
    .sec2_h3{
        width: 300px;
        height: 30px;
        font-size: 22px;
    }
    .sec2_hr{
        width: 100px;
        margin-top: 15px;
    }
    .sec2_cont1{
        height: 130px;
    }
    .sec2_item{
        width: 80px;
        height: 80px;
    }
    .sec2_item:hover{
        width: 120px;
        height: 120px;
    }
    footer{
        height: 850px;
        
    }
    .foot_cont{
        height: 850px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .foot_item1{
        width: 350px;
        height: 350px;
    }
    .foot_h3{
        font-size: 22px;
        padding: 5px 5px;
    }
    .foot_p{
        font-size: 13px;
        padding: 35px 5px;
    }
    .foot_cont2{
        width: 350px;
        height: 315px;
    }
    .foot_cont3{
        width: 350px;
        height: 160px;
    }
    .foot_item2{
        width: 95px;
        height: 40px;
    }
    .foot_item2:hover{
        width: 120px;
        height: 45px;
    }
    .foot_item3{
        width: 115px;
        height: 40px;
    }
    .foot_item:hover{
        width: 120px;
        height: 45px;
    }
    .foot_item4{
        width: 95px;
        height: 40px;
    }
    .foot_item4:hover{
        width: 120xp;
        height: 45px;
    }
    .foot_item5{
        width: 201px;
        height: 40px;
    }
    .foot_item5:hover{
        width: 220px;
        height: 45px;
    }
    .foot_item6{
        width: 115px;
        height: 40;
    }
    .foot_item6{
        width: 125px;
        height: 45px;
    }
    .foot_h4{
        padding: 7px;
    }
    .foot_cont4{
        width: 350px;
        height: 350px;
    }
    .foot_p1{
        padding: 43px 5px;
    }
    .foot_cont5{
        width: 350px;
        height: 110px;
    }
    #email{
        width: 200px;
        height: 50px;
        padding: 0 5px;
    }
    #email[data-b="b"]{
        width: 220px;
        height: 55px;
        
    }
    #button{
        width: 150px;
        height: 50px;
    }
    #button:hover{
        width: 155px;
        height: 55px;
    }
    .foot_cont6{
        height: 35px;
    }
    .foot_item7{
        width: 300px;
        height: 30px;
    }
    .foot_p2{
        font-size: 13px;
        padding: 5px;
    }
    .foot_item8{
        width: 150px;
        height: 30px;
    }
    .foot_p3{
        font-size: 13px;
        padding: 5px;
    }
    ::-webkit-scrollbar{
        width: 25px;
        border-radius: 10px;
    }
    ::-webkit-scrollbar-track{
        width: 25px;
        border-radius: 5px;
    }
    ::-webkit-scrollbar-thumb{
        width: 20px;
        border-radius: 10px;
    }

}
@media screen and (max-width:360px){
    header{
        width: 100%;
        height: 40px;
    }
    .head_cont{
        width: 100%;
        height: 40px;
    }
    .head_div1{
        width: 400px;
        height: 30px;
    }
    .head_div2{
        width: 550px;
        height: 30px;
    }
    #but1{
        width: 60px;
        height: 30px;
        font-size: 10px;
    }
    #but1:hover{
        font-size: 10px;
    }
    #but2{
        width: 65px;
        height: 30px;
        font-size: 10px;
    }
    #but2:hover{
        font-size: 10px;
    }
    
    .head_p{
        font-size: 11px;
    }
    .head_p1{
        font-size: 20px;
    }
    main{
        height: 580px;

    }
    .main_cont{
        height: 80px;
    }
    .main_div1{
        width: 300px;
        height: 50px;
    }
    .main_div2{
        width: 500px;
        height: 50px;
    }
    h1{
        font-size: 35px;
    }
    h1:hover{
        font-size: 50px;
    }
    nav{
        height: 50px;
    }
    .menu{
        height: 50px;
    }
    .menu>li{
        font-size: 10px;
        padding-left: 30px;
    }
    .menu>li:hover{
        font-size: 18px;
    }
    .menu>li:nth-child(1){
        width: 30%;
        height: 45px;
        padding: 15px 5px;
        font-size: 8px;
    }
    .menu1{
        top: 30px;
        left: 5px;
    }
    .menu1>li{
        width: 115px;
        height: 35px;
        padding: 5px;
        font-size: 14px;
       
    }
    .menu1>li:hover{
        width: 120px;
        height: 35px;
    }
    .menu2{
        top: 30px;
        left: 5px;
    }
    .menu2>li{
        width: 115px;
        height: 35px;
        padding: 5px;
        font-size: 14px;
    }
    .menu2>li:hover{
        width: 120px;
        height: 35px;
    }
    .ic3{
        padding: 0 8px;
    }
    .main_div3{
        width: 350px;
        height: 350px;
        margin: 80px auto;

    }
    .main_div4{
        width: 250px;
        height: 250px;
        top: 50px;
        left: 50px;
    }
    .main_h2{
        text-align: center;
        font-size: 85px;
        padding-top: 70px;
    }
    .main_h2:hover{
        font-size: 95px;
    }
    .main_h3{
        font-size: 25px;
    }
    .main_h3:hover{
        font-size: 30px;
    }
    .main_div5{
        width: 500px;
        height: 120px;
    }
    .main_p{
        font-size: 15px;
        padding: 0 5px;
        display: none;
    }
    section{
        height: 800px;
    }
    .sec_cont1{
        height: 800px;
    }
    .sec_div1{
        width: 710px;
        height: 380px;
        top: 10px;
        left: 60px;
        display: none;
    }
    .sec_cont2{
        width: 300px;
        height: 38px;
    }
    .sec1_item1{
        width: 300px;
        height: 25px;
    }
    .sec_cont3{
        width: 700px;
        height: 320px;
        display: none;
        
    }
    .sec_div2{
        width: 358px;
        height: 380px;
        top: 10px;
        right:2px;
    }
    .sec_item9{
        width: 350px;
        height: 30px;
    }
    .sec_h3{
        font-size: 20px;
    }
    .sec_item10{
        width: 165px;
        height: 100px;
        margin: 10px;
    }
    #sec_but{
        width: 130px;
        height: 50px;
        margin: 15px 20px;
    }
    #sec_but:hover{
        width: 150px;
        height: 55px;
        margin: 15px 6px;
    }
    .sec_div3{
        width: 355px;
        height: 380px;
        top: 410px;
        left: 3px;
    }
    .sec_div4{
        width: 358px;
        height: 380px;
        top: 410px;
        right: 5px;
    }
    .sec_item11{
        width: 300px;
        height: 35px;
    }
    .sec_p1{
        font-size: 22px;
    }
    .sec_item12{
        width: 180px;
        margin: 15px;
    }
    .sec_item13{
        width: 350px;
        height: 215px;
        margin-top: 15px;
    }
    .sec2_p2{
        font-size: 10px;
        padding: 0 5px;
    }
    #but3{
        width: 158px;
        height: 45px;
        font-size: 10px;
        margin: 15px 110px;
    }
    #but3:hover{
        width: 180px;
        height: 50px;
    }
    .sec1{
        height: 780px;
    }
    .size{
        width: 85%;
    }
    .sec1_cont{
        height: 55px;
    }
    .sec1_h3{
        width: 300px;
        height: 30px;
        font-size: 18px;
    }
    .sec1_hr{
        width: 120px;
        margin-top:15px ;
    }
    .sec1_cont2{
        height: 700px;
        
        
        
    }
    .sec1_item{
        width: 150px;
        height: 150px;
    }
    .sec1_item:hover{
        width: 180px;
        height: 180px;
    }
    .sec1_item2{
        width: 155px;
        height: 55px;
    }
    .sec1_item1{
        width: 150px;
        height: 150px;
    }
    .sec1_item1:hover{
        width: 180px;
        height: 180px;
    }
    .sec1_item3{
        width: 150px;
        height: 150px;
        margin-top: 31px;
    }
    .sec1_item3:hover{
        width: 180px;
        height: 180px;
    }
    .sec1_item4{
        width: 150px;
        height: 150px;
        
    }
    .sec1_item4:hover{
        width: 180px;
        height: 180px;
    }
    .sec1_item5{
        width: 150px;
        height: 150px;
    }
    .sec1_item5:hover{
        width: 180px;
        height: 180px;
    }
    .sec1_item6{
        width: 150px;
        height: 150px;
        margin-top: 31px;
       
    }
    .sec1_item6:hover{
        width: 180px;
        height: 180px;
    }
    .sec1_item7{
        /* width: 150px;
        height: 150px; */
        display: none;
    }
    .it7{
        display: none;
    }
    /* .sec1_item7:hover{
        width: 180px;
        height: 180px;
    } */
    .sec1_item8{
        /* width: 150px;
        height: 150px; */
        display: none;
    }
    .it8{
        display: none;
    }

    /* .sec1_item8:hover{
        width: 180px;
        height: 180px;
    } */
    /* .sec1_item:nth-child(3){
        display: none;
    }
    .sec1_item1:nth-child(3){
        display: none;
    }
    .sec1_item:nth-child(4){
        display: none;
    }
    .sec1_item1:nth-child(4){
        display: none;
    }
    .sec1_item:nth-child(7){
        display: none;
    }
    .sec1_item1:nth-child(7){
        display: none;
    }
    .sec1_item:nth-child(8){
        display: none;
    }
    .sec1_item1:nth-child(8){
        display: none;
    } */

    .sec1_p{
        font-size: 10px;
        padding: 0 28px;
    }
    .sec1_p:hover{
        font-size: 15px;
    }
    .sec2{
        height: 180px;
    }
    .sec2_cont{
        height: 55px;
    }
    .sec2_h3{
        width: 300px;
        height: 30px;
        font-size: 20px;
    }
    .sec2_hr{
        width: 100px;
        margin-top: 15px;
    }
    .sec2_cont1{
        height: 130px;
    }
    .sec2_item{
        width: 70px;
        height: 70px;
    }
    .sec2_item:hover{
        width: 120px;
        height: 120px;
    }
    footer{
        height: 850px;
        
    }
    .foot_cont{
        height: 850px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .foot_item1{
        width: 350px;
        height: 285px;
    }
    .foot_h3{
        font-size: 20px;
        padding: 5px 5px;
    }
    .foot_p{
        font-size: 13px;
        padding: 35px 18px;
        text-align: justify;
    }
    .foot_cont2{
        width: 350px;
        height: 280px;
    }
    .foot_cont3{
        width: 350px;
        height: 160px;
    }
    .foot_item2{
        width: 95px;
        height: 40px;
    }
    .foot_item2:hover{
        width: 120px;
        height: 45px;
    }
    .foot_item3{
        width: 115px;
        height: 40px;
    }
    .foot_item:hover{
        width: 120px;
        height: 45px;
    }
    .foot_item4{
        width: 95px;
        height: 40px;
    }
    .foot_item4:hover{
        width: 120xp;
        height: 45px;
    }
    .foot_item5{
        width: 201px;
        height: 40px;
    }
    .foot_item5:hover{
        width: 220px;
        height: 45px;
    }
    .foot_item6{
        width: 115px;
        height: 40;
    }
    .foot_item6{
        width: 125px;
        height: 45px;
    }
    .foot_h4{
        padding: 7px;
    }
    .foot_cont4{
        width: 350px;
        height: 280px;
    }
    .foot_p1{
        font-size: 13px;
        padding: 30px 20px;
    }
    .foot_cont5{
        width: 350px;
        height: 110px;
    }
    #email{
        width: 200px;
        height: 50px;
        padding: 0 5px;
    }
    #email[data-b="b"]{
        width: 185px;
        height: 50px;
        
    }
    #button{
        width: 150px;
        height: 50px;
        font-size: 12px;
    }
    #button:hover{
        width: 155px;
        height: 55px;
    }
    .foot_cont6{
        height: 35px;
    }
    .foot_item7{
        width: 300px;
        height: 30px;
    }
    .foot_p2{
        font-size: 13px;
        padding: 5px;
    }
    .foot_item8{
        width: 150px;
        height: 30px;
    }
    .foot_p3{
        font-size: 13px;
        padding: 5px;
    }
    ::-webkit-scrollbar{
        width: 25px;
        border-radius: 10px;
    }
    ::-webkit-scrollbar-track{
        width: 25px;
        border-radius: 5px;
    }
    ::-webkit-scrollbar-thumb{
        width: 20px;
        border-radius: 10px;
    }
}
