@charset 'utf-8';
@import url(./reset.css);



#wrap {
    width: 100%;
    height: auto;
    margin: 0 auto;
}



/*************** popup *****************/


.popup_bg {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 90;
    display: none;
}

.popup {
    width: 550px;
    height: 650px;
    position: absolute;
    z-index: 100;
    left: 73%;
    top: 53%;
    transform: translate(-50%, -50%);
    box-sizing: border-box;
    border-top-left-radius: 20%;
    border-bottom-right-radius: 20%;
    position: fixed;

}

.popup #popupup {
    width: 530px;
    height: 600px;
    background-color: #ff9831;
    margin: 0 auto;
    border-top-left-radius: 20%;
    border-bottom-right-radius: 20%;
    padding-top: 20px;
    box-shadow: 3px 3px 10px #444;
    border-top-right-radius: 2px;
    border-bottom-left-radius: 2px;
}

.popup #popupup #popupupup {
    width: 490px;
    height: 550px;
    border: 3px solid #ff9831;
    margin: 0 auto;
    border-top-left-radius: 20%;
    border-bottom-right-radius: 20%;
    background-color: #333;
    padding: 0 25px;
}

.popup h2 {
    font-size: 24px;
    text-align: center;
    margin-bottom: 20px;
    color: #ff9831;
    padding-top: 30px;
}

.popup p {
    font-size: 13px;
    font-weight: normal;
    margin-bottom: 30px;
    color: #eee;
    text-align: center;
    padding-top: 15px;
}

.popup p span {
    display: block;
    font-size: 14px;
    color: #666;
    font-weight: 400;
}

.popup a {
    position: absolute;
    left: 20px;
    bottom: 20px;
    width: 80px;
    text-align: center;
    margin-bottom: 35px;
    color: #333;
    font-weight: 500;
}




/*************** header *****************/


#wrap header {
    width: 100%;
    height: 100px;
    background-color: rgba(255, 255, 255, 0.0);
    margin: 0 auto;
    position: absolute;
    z-index: 999;
}

#wrap header:before {
    width: 100%;
    height: 100px;
    background-color: rgba(255, 255, 255, 0.8);
    margin: 0 auto;
    z-index: 99999;
}

#wrap header .header {
    width: 1200px;
    background-color: rgba(255, 255, 255, 0);
    height: 110px;
    margin: 0 auto;
}

#wrap header .header a {}

#wrap header .header .logo img {
    width: 6.3%;
    float: left;
    padding-top: 40px;
}

#wrap header .header ul {
    /*    float: right;*/
    height: 55px;
    text-align: center;
    color: #fff;
}

#wrap header .header ul li {
    float: right;
    width: 150px;
    line-height: 165px;
}

#wrap header .header ul li a {
    padding-left: 5px;
    display: block;
    color: #fff;
}

#wrap header .header ul li a:hover {
    font-weight: bold;
    transition: 0s;
}


#wrap header .header ul li .submenu {
    position: relative;
    width: 100%;
    height: 180px;
    z-index: 900;
    background-color: rgb(255, 255, 255, 0.8);
    text-align: center;
    transform: translateY(-30.8%);
    top: 50%;
    display: none;
}

#wrap header .header ul li .submenu li {
    width: 100%;
    height: 60px;
}

#wrap header .header ul li .submenu li:hover {
    background-color: #ff9933;
    transition: 0s;
    font-weight: bold;
}

#wrap header .header ul li .submenu li a {
    display: block;
    font-size: 14px;
    font-weight: 400;
    color: #333;
    line-height: 40px;
    line-height: 60px;
}


.menu {
    display: none;
}


#wrap header .header ul .kor a img {
    width: 18%;
    padding-top: 10px;
    margin-left: 55px;
}

#wrap header .header .menu {
    float: right;
    margin-top: 13px;
    display: none;
}

#wrap header .header .menu a img {
    width: 95px;
    padding-top: 7px;
    margin-left: 40px;
    float: right;
}

#wrap header .header .menu a img:hover {
    -webkit-transform: scale(1.1);
}



/*************** main *****************/


#wrap .main {
    width: 100%;
    height: 940px;
    margin: 0px auto;
    /*
    background-image: url(../img/mainimg.gif);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
*/
    margin: 0 auto;
}


#wrap .main .maintext {
    position: relative;
    width: 1920px;
    height: 940px;
    overflow: hidden;
}

#wrap .main .maintext a {
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    animation-iteration-count: infinite;
    width: 100%;
}

#wrap .main .maintext img {
    height: 100%;
    
    
}


#wrap .main .maintext a h2 {
    position: absolute;
    top: 35%;
    left: 20%;
    margin: -10px -180px;
    color: #ffffff;
    padding: 20px 100px;
    font-weight: 700;
    color: #ff9933;
    font-size: 4.363rem;
    letter-spacing: 3px;
    opacity: 0.9;
    width: 1000px;
    height: 200px;
    line-height: 5.625rem;
    text-shadow: 5px 2px 2px rgba(51, 51, 51, 0.7);
}




/*************** cont1 *****************/


media="screen and (min-width: 1280px)"
@media (max-width: 1920px);

#wrap .cont1 {
    width: 100%;
    height: 260px;
    margin: 0 auto;
}

#wrap .cont1 .cont1-1 {
    width: 100%;
    margin: 0 auto;
    height: 350px;
    margin-bottom: 30px;
}


#wrap .cont1 .cont1-1 .video {
    width: 200px;
    float: right;
}

#wrap .cont1 .cont1-1 .video iframe {
    float: left;
    transform: translate(-213%, 185%);
    left: 50%;
    top: 60%;
}

#wrap .cont1 .cont1-1 .cont1text {

    width: 1200px;
    height: 300px;
    padding-left: 20px;
    padding-top: 50px;
    margin: 0 auto;
}

#wrap .cont1 .cont1-1 .cont1text h1 {
    font-size: 5rem;
    padding-top: 35px;
    color: #111;
    font-weight: 900;
    opacity: 0.855;
    letter-spacing: 1.5px;
    float: left;
    padding-top: 90px;
    text-align: left;
}

#wrap .cont1 .cont1-1 .cont1text h5 {
    font-size: 16px;
    line-height: 1.7em;
    color: #000;
    font-weight: 400;
    padding-bottom: 10px;
    opacity: 0.9;
    float: left;
    padding-top: 35px;
    margin-left: 60px;
}

#wrap .cont1 .cont1-1 .cont1text h5 h6 {
    font-size: 13px;
    color: #111;
    line-height: 1.5em;
    font-weight: 200;
    letter-spacing: 1px;
    opacity: 0.9;
}

#wrap .cont1 .cont1-1 .cont1text a {
    font-weight: 600;
    border: 1px solid #999;
    padding: 20px 80px;
    float: right;
    color: #444;
    margin-top: 20px;
    margin-right: 430px;
}

#wrap .cont1 .cont1-1 .cont1text a:hover {
    background-color: rgba(241, 241, 241, 1);
}

#wrap .cont1 .cont1-1 .cont1text a i {}




/*************** cont2 *****************/


media="screen and (min-width: 1280px)"
@media (max-width: 1920px);

#wrap .cont2 {
    width: 1200px;
    height: 600px;
    margin: 0 auto;
}

#wrap .cont2 .cut {
    float: right;
    transform: translateY(-16%);
    top: 50%;
    width: 34%;
    overflow: hidden;
}

#wrap .cont2 .cut img {
    border-bottom-left-radius: 20%;
}

#wrap .cont2 .cut:hover {}

#wrap .cont2 {
    padding-top: 110px;
}

#wrap .cont2 ul {
    width: 1200px;
    height: 365px;
    margin: 0 auto;
}

#wrap .cont2 ul li {
    padding-left: 10px;
    margin-left: 5px;
    margin-right: 10px;
    padding-right: 5px;
    text-align: center;
    float: left;
}

#wrap .cont2 ul li ul {
    width: 130px;
    height: 130px;
    background-color: #fff;
    border: 4px solid #38c674;
    border-top-right-radius: 40px;
    border-bottom-left-radius: 40px;
    text-align: center;
    position: relative;
}

#wrap .cont2 .sss li:hover {
    transform: scale(1.1);
    color: #38c674;
}

#wrap .cont2 ul li ul li {
    text-align: center;
}

#wrap .cont2 ul li ul li img {
    width: 70%;
    margin: 0 auto;
    text-align: center;
    padding-top: 30px;
}

#wrap .cont2 ul li h8 {
    font-weight: 600;
    padding-top: 17px;
    font-size: 18px;
    color: #444;
}

#wrap .cont2 ul li ul li h9 {
    font-size: 13px;
    color: #333;
    line-height: 6px;
    padding-bottom: 30px;
}

#wrap .cont2 .cont2text {
    position: relative;
    text-align: left;
    opacity: 0.9;
}

#wrap .cont2 .cont2text ul li {
    width: 630px;
    text-align: left;
}

#wrap .cont2 .cont2text ul li h9:hover {}

#wrap .cont2 .cont2text ul li h9 {
    color: #111;
    font-weight: 300;
    font-size: 12px;
    line-height: 1.5em;
    opacity: 0.99;
}




/*************** cont3 *****************/


media="screen and (min-width: 1280px)"
@media (max-width: 1920px);

#wrap .cont3 {
    width: 100%;
    background-color: aqua;
}

#wrap .cont3 .cut img {
    float: left;
    height: 950px;
    width: 45%;
}

#wrap .cont3 .cont3box {
    width: 650px;
    margin: 0 auto;
    float: left;
    padding-right: 400px;
    position: relative;
    text-align: left;
}

#wrap .cont3 .cont3box .cont3text {
    margin: 0 auto;
    width: 550px;
    float: left;
    padding-left: 100px;
    top: 90%;
    transform: translateY(-10%);
}

#wrap .cont3 .cont3box .cont3text .farmcare {}

#wrap .cont3 .cont3box .cont3text .farmcare img {
    padding-bottom: 30px;
    float: left;
    width: 450px;
    height: auto;
}

#wrap .cont3 .cont3box .cont3text h7 {
    float: left;
    font-size: 14px;
    overflow: hidden;
    width: 700px;
    padding-top: 30px;
}

#wrap .cont3 .cont3box .cont3text h8 {
    float: left;
    width: 500px;
}

#wrap .cont3 .cont3box .cont3text h7 i {
    font-size: 18px;
    color: #38c674;
    font-weight: bold;
}

#wrap .cont3 .cont3box .cont3text ul img {
    width: 3%;
    float: left;
}

#wrap .cont3 .cont3box .cont3text .farmcare02 {
    float: right;
}

#wrap .cont3 .cont3box .cont3text .farmcare02 img {
    width: 80%;
    float: left;
}

#wrap .cont3 .cont3box .cont3text .farmcare02 img:hover {
    transform: scale(1.1);
}

#wrap .cont3 .cont3box .farmcare02 .tete {
    width: 700px;
    height: 50px;
    background-color: #ff9831;
    color: #fff;
    font-weight: 500;
    padding: 10px 80px 10px 20px;
    letter-spacing: 3px;
    border-bottom-right-radius: 40px;
    text-align: left;
}

#wrap .cont3 .cont3box .farmcare02 .tete:hover {
    background-color: #38c674;
}




/*************** cont4 *****************/


#wrap .cont4 {
    width: 100%;
    height: 420px;
    background-color: #f8f8f8;
}

#wrap .cont4 .cont4-4 {
    width: 900px;
    margin: 0 auto;
    padding-top: 50px;
}

#wrap .cont4 .cont4-4 .mockup {
    width: 500px;
    float: left;
}

#wrap .cont4 .cont4-4 .mockup img {
    width: 90%;
}

#wrap .cont4 .cont4-4 .cont4text {
    width: 500px;
    float: left;
    color: #333;
    font-weight: 400;
    opacity: 0.9;
    font-size: 12px;
    padding-left: 70px;
    position: relative;
}

#wrap .cont4 .cont4-4 .cont4text h7 {
    transform: translate(-10%, -10%);
    top: 100%;
    left: 10%;
    position: relative;
}

#wrap .cont4 .cont4-4 .cont4text h8 {}

#wrap .cont4 .cont4-4 .cont4text h7 i {
    font-size: 17px;
    color: #38c674;
    font-weight: bold;
}

#wrap .cont4 .cont4-4 .cont4text a {
    font-weight: 600;
    border: 1px solid #999;
    padding: 20px 80px;
    color: #444;
    margin-top: 13px;
    letter-spacing: 1px;
    margin-left: 66px;
}

#wrap .cont4 .cont4-4 .cont4text a:hover {
    background-color: rgba(241, 241, 241, 1);
}

#wrap .cont4 .cont4-4 .cont4text a {
    transform: translate(-300%, -93%);
    left: 0%;
    top: 10%;
    width: 28%;
}

#wrap .cont4 .cont4-4 .cont4text a img:hover {
    opacity: 1;
}

#wrap .cont4 .cont4-4 .mockupgif {
    text-align: center;
    height: 300px;
    width: 400px;
    float: left;
    transform: translate(-40%, -30%);
    top: 50%;
    left: 50%;
}

#wrap .cont4 .cont4-4 .mockupgif img {
    width: 150%;
}




/*************** cont5 *****************/


#wrap .cont5 {
    width: 100%;
    margin: 0 auto;
    background-color: #fff;
    height: 950px;
}


#wrap .cont5 img {
    float: left;
    margin-bottom: 30px;
    width: 45%;
    height: 950px;
}

#wrap .cont5 .cont5box {
    width: 600px;
    margin: 0 auto;
    padding-top: 50px;
    position: relative;
    height: 950px;
    padding-bottom: 60px;
    float: left;
}

#wrap .cont5 .cont5box .cont5img {
    text-align: center;
    float: left;
    border-radius: 3px;
    left: 150%;
    transform: translateX(21%);
}

#wrap .cont5 .cont5box .cont5img img {
    width: 500px;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 120px;
}

#wrap .cont5 .cont5box .cont5text {
    float: left;
    width: 600px;
    height: 880px;
    padding-bottom: 50px;
    color: #111;
    font-weight: normal;
    font-size: 15px;
    position: relative;
    padding-left: 100px;
}

#wrap .cont5 .cont5box .cont5text .farmkingimgggggg {}

#wrap .cont5 .cont5box .cont5text .farmkingimgggggg img {
    height: auto;
    width: 90%;
    margin-top: 20px;
}

#wrap .cont5 .cont5box .cont5text .kingbox {
    width: 600px;
    height: 300px;
    float: left;
    margin-top: 20px;
}

#wrap .cont5 .cont5box .cont5text .kingbox li {
    width: 140px;
    float: left;
    margin-right: 10px;
}

#wrap .cont5 .cont5box .cont5text .kingbox li h6 {
    text-align: center;
    margin-top: 15px;
    font-size: 14px;
    margin-right: 10px;
    font-weight: 500;
}

#wrap .cont5 .cont5box .cont5text .kingbox li:last-child {
    margin-right: 0;
}

#wrap .cont5 .cont5box .cont5text .kingbox li ul {
    width: 120px;
    height: 120px;
    border: 5px solid #38c674;
    border-bottom-right-radius: 20%;
    border-top-left-radius: 20%;
}

#wrap .cont5 .cont5box .cont5text .kingbox li ul:hover {
    background-color: #38c674;

}

#wrap .cont5 .cont5box .cont5text .kingbox li ul img {
    width: 70px;
    height: auto;
    text-align: center;
    margin: 0 auto;
    margin-left: 20px;
    margin-top: 15px;
}

#wrap .cont5 .cont5box .cont5text .kingbox li ul {}

#wrap .cont5 .cont5box .cont5text .logo01 {
    text-align: center;
    margin: 0 auto;
    opacity: 1;
    width: 460px;
    height: auto;
}

#wrap .cont5 .cont5box .cont5text .logo02 {
    display: none;
}

#wrap .cont5 .cont5box .cont5text h7 {
    float: left;
    padding-top: 25px;
    width: 515px;
    height: auto;
    font-size: 15px;
    margin-right: 15px;
}

#wrap .cont5 .cont5box .cont5text h8 {
    width: 400px;
    float: left;
    margin-right: 10px;
    font-size: 15px;
    font-weight: 500;
}

#wrap .cont5 .cont5box .cont5text h8 b {
    color: #38c674;
}

#wrap .cont5 .cont5box .cont5text h8 img {
    width: 2.5%;
    float: left;
    padding-left: 4px;
    opacity: 1;
}

#wrap .cont5 .cont5box .cont5text .tete00 {
    transform: translate(-40%, 2200%);
    top: 50%;
    left: 50%;
}

#wrap .cont5 .cont5box .cont5text .tete00 .tete {
    width: 700px;
    height: 50px;
    background-color: #ff9831;
    color: #fff;
    font-weight: 500;
    padding: 10px 80px 10px 20px;
    letter-spacing: 3px;
    border-bottom-right-radius: 40px;
    text-align: left;
}

#wrap .cont5 .cont5box .cont5text .tete:hover {
    background-color: #38c674;
}




/*************** cont6 *****************/


#wrap .cont6 {
    width: 100%;
    height: 260px;
    background-color: #f8f8f8;
}

#wrap .cont6 .cont666 {
    width: 1200px;
    height: 300px;
    margin: 0 auto;
}

#wrap .cont6 .cont666 .video {
    width: 33%;
    background-color: #fff;
    float: right;
    height: 220px;
    margin: 0 auto;
    margin-top: 20px;
    margin-right: 30px;
}

#wrap .cont6 .cont666 .news {
    width: 60%;
    background-color: #eee;
    float: left;
    height: 220px;
    margin: 0 auto;
    margin-left: 50px;
    margin-left: 30px;
    margin-top: 20px;
}

#wrap .cont6 .cont666 .news h3 {
    padding-left: 30px;
    padding-top: 15px;
    font-size: 18px;
    color: #333;
    font-weight: bold;
}

#wrap .cont6 .cont666 .news ul {}

#wrap .cont6 .cont666 .news ul li {
    height: 40px;
    border-bottom: 1px dashed #eee;
    padding: 20px 30px;
    font-size: 13px;
}

#wrap .cont6 .cont666 .news ul li:last-child {
    border: 0;
}

#wrap .cont6 .cont666 .news ul li a:hover {
    color: #38c674;
}

#wrap .cont6 .cont666 .news ul li a {
    text-overflow: ellipsis;
    display: block;
    overflow: hidden;
    white-space: nowrap;
}

#wrap .cont6 .cont666 .news ul li p {
    float: right;
}




/*************** cont7 *****************/


#wrap .cont7 {
    width: 100%;
    height: 385px;
    background-image: url(../img/footerbging.png);
    background-position: center;
}

#wrap .cont7 .cont7box {
    width: 900px;
    height: 250px;
    margin: 0 auto;
    color: #fff;
    font-weight: bold;
    padding-top: 80px;
}

#wrap .cont7 .cont7box h4 {
    font-size: 68px;
    float: left;
    letter-spacing: 1px;
}

#wrap .cont7 .cont7box h4 h5 {
    float: left;
    font-weight: 400;
}

#wrap .cont7 .cont7box h5 {
    margin-top: 5px;
    font-size: 25px;
    line-height: 38px;
    font-weight: normal;
    width: 1000px;
    opacity: 0.9;
    margin: 0 auto;
}

#wrap .cont7 .cont7box a {

    float: right;
    height: 60px;
    background-color: #ff9831;
    color: #fff;
    width: 20%;
    text-align: center;
    font-size: 16px;
    letter-spacing: 2px;
    padding-top: 18px;
    margin-top: 20px;
}

#wrap .cont7 .cont7box a img {
    width: 80%;
    float: right;
}

#wrap .cont7 .cont7box a:hover {
    opacity: 0.9;
}




/*************** footer *****************/


footer {
    background-color: #333;
    height: 200px;
    width: 100%;
}

footer .footer {
    width: 900px;
    height: 150px;
    margin: 0 auto;
    padding-top: 80px;
    color: #fff;
    opacity: 0.8;
    font-size: 10px;
}

footer .footer img {
    width: 10%;
    float: left;
    transform: translateY(-20%);
    top: 50%;
}

footer .footer p {
    font-weight: 200;
    text-align: center;
}


footer .footer02 {
    display: none;
}