﻿

.slideshow { position: relative; width: 100%; height: 500px; overflow: hidden; }
.slideshow-image { position: absolute; top: 0px; left: 0px; width: 100%; height: 500px; background: no-repeat 50% 50%; background-size: cover; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-duration: 8s; animation-duration: 8s; opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2); }
.slideshow1 { -webkit-animation-name: kenburns-1; animation-name: kenburns-1; z-index: 3; }

@-webkit-keyframes kenburns-1 {
    0% { opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2); }
    100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); }
}

@keyframes kenburns-1 {
    0% { opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2); }
    100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); }
}

@media only screen and (max-width:1200px) {
    .slideshow { height: 450px; }
        .slideshow .slideshow-image { height: 450px; }
}


@media only screen and (max-width:1024px) {
    .slideshow { height: 415px; }
        .slideshow .slideshow-image { height: 450px; }
}

@media only screen and (max-width:960px) {
    .slideshow { height: 330px; }
        .slideshow .slideshow-image { height: 330px; }
}

@media only screen and (max-width:768px) {
    .slideshow { height: 210px; }
        .slideshow .slideshow-image { height: 210px; }
}

@media only screen and (max-width:480px) {
    .slideshow { height: 160px; }
        .slideshow .slideshow-image { height: 160px; }
}


.aboutcontentbigbox { width: 100%; margin-top: 80px; margin-bottom: 60px; overflow: hidden; }
.aboutcontent { width: 100%; max-width: 1200px; font-size: 0px; padding: 0px 10px; }
    .aboutcontent .left { width: 55%; display: table-cell; vertical-align: top; background-image: url(/Tpl/ID1009/images/about/a1.jpg); background-position: top center; background-repeat: no-repeat; }
        .aboutcontent .left img { width: 100%; }


    .aboutcontent .right { width: 45%; padding-left: 40px; display: table-cell; vertical-align: top; }
        .aboutcontent .right .txt { font-size: 20px; line-height: 32px; color: #333; text-indent: 2em; text-align: justify; text-justify: inter-ideograph }
            .aboutcontent .right .txt b { font-size: 24px; color: #18ac1b; }
        .aboutcontent .right .pic { width: 100%; margin-top: 20px; }
            .aboutcontent .right .pic img { width: 100%; }



@media only screen and (max-width:960px) {
    .aboutcontent .left { width: 45%; }
    .aboutcontent .right { width: 55%; padding-left: 20px; }
        .aboutcontent .right .txt { font-size: 16px; line-height: 32px; }
            .aboutcontent .right .txt b { font-size: 18px; }
}

@media only screen and (max-width:768px) {
    .aboutcontent .left { display: none; }
    .aboutcontent .right { width: 100%; padding-left: 0px; }
}



.aboutcontent2bigbox { margin: 0px auto 30px auto; width: 100%; }
    .aboutcontent2bigbox .aboutcontent2 { width: 100%; }
        .aboutcontent2bigbox .aboutcontent2 img { width: 100%;max-width:1920px; }



@media only screen and (max-width:768px) {
    .aboutcontent2bigbox .aboutcontent2 { height: 200px; }
}




.aboutcontent3bigbox { width: 100%; overflow: hidden; margin-bottom: 40px; }
.aboutcontent3 { width: 100%; max-width: 1200px; font-size: 20px; padding: 0px 10px; text-align: left; line-height: 34px; }
    .aboutcontent3 img { float: left; max-width: 600px; padding-right: 60px; padding-bottom: 20px; }
    .aboutcontent3 p { text-indent: 2em; text-align: justify; text-justify: inter-ideograph }
    .aboutcontent3 .title { font-size: 32px; font-weight: bold; margin-bottom: 10px; }
        .aboutcontent3 .title b { color: #18ac1b; }
        .aboutcontent3 .title i { font-style: normal; font-size: 14px; margin-left: 20px; text-transform: uppercase; }



@media only screen and (max-width:1024px) {
    .aboutcontent3 { font-size: 18px; }
        .aboutcontent3 img { max-width: 500px; padding-right: 40px; padding-bottom: 20px; }
        .aboutcontent3 .title { font-size: 26px; }
}


@media only screen and (max-width:960px) {
    .aboutcontent3 { font-size: 18px; }
        .aboutcontent3 img { max-width: 420px; padding-right: 40px; padding-bottom: 20px; }
        .aboutcontent3 .title { font-size: 26px; }
}


@media only screen and (max-width:768px) {
    .aboutcontent3 { font-size: 14px; line-height: 24px; }
        .aboutcontent3 img { max-width: 300px; padding-right: 20px; padding-bottom: 10px; }
        .aboutcontent3 .title { font-size: 18px; }
}

@media only screen and (max-width:480px) {
    .aboutcontent3 { font-size: 14px; line-height: 24px; }
        .aboutcontent3 img { width: 100%; max-width: none; float: none; padding-right: 0px; padding-bottom: 10px; }
        .aboutcontent3 .title { font-size: 18px; }
}
