@charset "UTF-8";
@media (max-width:1280px) {
    .section {
        min-width: 100%;
        max-width: 100%;
    }
    .content {
        width: 100%;

    }

}

@media (max-width:1023px){
    .section {
        min-width: 100%;
        max-width: 100%;
    }
    .content {
        width: 100%;
    }
    #banner h1{
        font-size: 36px;
    }
}
@media (max-width:767px){
    .section {
        min-width: 100%;
        max-width: 100%;
    }
    .content {
        width: 100%;
    }

    #banner{
        background: url(/project/ERP5/images/banner1200.jpg) no-repeat center center;
        background-size: cover;
    }
    #banner h1{
        display: block;
        font-size: 36px;
        padding-left: 10%;
        padding-top: 60%;
    }
    #banner .pic1{
        margin: 0;
        display: block;
        width: 70%;
        margin-top: 2%;
        margin-left: 10%;
        font-size: 16px;
        line-height: 2;
        color: #fff;
        letter-spacing: 4px;
        text-align: center;
        border-top: solid 1px #fff;
        border-bottom: solid 1px #fff;
    }
    #banner .pic2{
        font-size:16px;
        line-height: 1.8;
        color: #fff;
        padding-left: 10%;
        letter-spacing: 2px;
    }
    #banner .pic3{
        display: block;
        width: 50%;
        margin-top: 0;
        margin-left: 10%;
    }
}
@media (max-width:467px) and (min-width: 414px){

    p{
        font-size: 16px;
        text-align: justify;
    }
    #banner{
        background: url(/project/ERP5/images/banner1200.jpg) no-repeat center center;
        background-size: cover;
    }
    #banner h1{
        display: block;
        font-size: 36px;
        padding-left: 10%;
        padding-top: 60%;
    }
    #banner .pic1{
        margin: 0;
        display: block;
        width: 70%;
        margin-top: 3%;
        margin-left: 10%;
        font-size: 16px;
        line-height: 2;
        color: #fff;
        letter-spacing: 4px;
        text-align: center;
        border-top: solid 1px #fff;
        border-bottom: solid 1px #fff;
    }
    #banner .pic2{
        font-size:16px;
        line-height: 1.8;
        color: #fff;
        padding-left: 10%;
        padding-top: 2%;
        padding-bottom: 2%;
        letter-spacing: 2px;
    }
    #banner .pic3{
        display: block;
        width: 50%;
        margin-top: 0;
        margin-left: 10%;
    }
    #viewpoint{
        overflow: hidden;
    }
    #part1{
        height: auto;
    }
    #part1,#part2,#part3,#part4,#part5,#part5a,#part6{
        width: 100%;
        padding: 0 5%;
    }
    #part1 h2,#part2 h2,#part3 h2,#part4 h2,#part5 h2,#part6 h2{
        font-size: 28px;
        color: #fff;
        padding-top: 5%;
    }
    #part1 .imageText {
        width: 100%;
        margin: 0 auto;
        padding-top: 0;
    }
    #part1 .imageText img{
        float: none;
        margin: 0 auto;
    }
    .imageText>p {
        width: 100%;
        font-size: 16px;
        line-height: 1.8;
        color: #fff;
        float: none;
        padding-top:2%;
        padding-bottom: 2%;
        text-align: justify;
    }
    #part2 h2{
        color: #1cacff;
    }
    #part2 p{
        text-align: justify;
    }
    #part3{
        height: auto;
    }
    #part3 h2,#part4 h2,#part5 h2,#part5a h2,#part6 h2{
        color: #1cacff;
    }
}
@media (max-width:413px){
    .section {
        min-width: 100%;
        max-width: 100%;
    }
    .content {
        width: 100%;
    }

    #banner h1{
        font-size: 28px;
        padding-top:62%;
    }
    #banner .pic1{
        margin: 0;
        display: block;
        width: 70%;
        margin-top: 3%;
        margin-left: 10%;
        font-size: 16px;
        line-height: 2;
        color: #fff;
        letter-spacing: 3px;
        text-align: center;
        border-top: solid 1px #fff;
        border-bottom: solid 1px #fff;
    }
    p{
        font-size: 14px;
        text-align: justify;
    }
    #viewpoint{
        overflow: hidden;
    }
    #part1{
        height: auto;
    }
    #part1,#part2,#part3,#part4,#part5,#part5a,#part6{
        width: 100%;
        padding: 0 5%;
    }
    #part1 h2,#part2 h2,#part3 h2,#part4 h2,#part5 h2,#part6 h2{
        font-size: 28px;
        color: #fff;
        padding-top: 5%;
    }
    #part1 .imageText {
        width: 100%;
        margin: 0 auto;
        padding-top: 0;
    }
    #part1 .imageText img{
        float: none;
        margin: 0 auto;
    }
    .imageText>p {
        width: 100%;
        font-size: 16px;
        line-height: 1.8;
        color: #fff;
        float: none;
        padding-top:2%;
        padding-bottom: 2%;
        text-align: justify;
    }
    #part2 h2{
        color: #1cacff;
    }
    #part2 p{
        text-align: justify;
    }
    #part3{
        height: auto;
    }
    #part3 h2,#part4 h2,#part5 h2,#part5a h2,#part6 h2{
        color: #1cacff;
    }
    .guesta{
        width: 100%;
    }

    .guesta ul li>img {
        width: 100%;
    }
}

@media (max-width:374px){
    .section {
        min-width: 100%;
        max-width: 100%;
    }
    .content {
        width: 100%;
    }

    #banner h1{
        font-size: 20px;
    }
}