﻿.Hometitle {
    width: 100%;
    margin: 10px 0;
}

    .Hometitle h2 {
        /*padding-left:40px;
*/ color: #555;
        line-height: 40px;
        text-align: center;
        position: relative;
        margin: 30px 0px 30px 0px;
        z-index: 22;
        font-size: 24px;
        letter-spacing: 2px;
    }

        .Hometitle h2 span {
            position: absolute;
            width: 100%;
            text-align: center;
            left: 0px;
            top: 0px;
            color: #e7e7e7;
            font-weight: normal;
            letter-spacing: 1px;
            z-index: -1;
            font-size: 40px;
        }
.container {
width:1200px;
margin:0 auto;
text-align:center;
}
#jpintron .container p{
    padding: 20px;
    text-align: left;
    display: block;
    font-size: 17px;
    line-height: 34px;
    font-weight: normal;
/*    max-width: 900px;
*/    margin: auto;
    color: #333333;
    text-indent:2em;

}

#jpcontent .container img {
width:1100px;
}
/**轮播图*/
#addiv .banner {
    clear: both;
    width: 100%;
}

    #addiv .banner .warp {
        width: 100%;
        min-width: 1200px;
        overflow: hidden;
        position: relative;
    }

    #addiv .banner .warpnav {
        height: 389px;
        position: relative;
        left: 0;
        transition: 0.5s all;
        width: 100%;
    }

        #addiv .banner .warpnav li {
            /*float:left;*/
            width: 100%;
            height: 389px;
            position: absolute;
            display: none;
        }

            #addiv .banner .warpnav li img {
                display: block;
                /*width:1200px;*/
                height: 389px;
                margin: 0 auto;
                width: 100%;
            }

    #addiv .banner .warp ol {
        position: absolute;
        bottom: 5px;
        z-index: 8888;
        width: 100%;
        text-align: center;
    }

        #addiv .banner .warp ol li {
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background: #fff;
            display: inline-block;
            margin-left: 10px;
            cursor: pointer;
        }

            #addiv .banner .warp ol li span {
                display: block;
                background: #10AE59;
                border-radius: 50%;
                margin: auto;
                width: 0;
                height: 0;
                transition: 0.5s all;
            }

            #addiv .banner .warp ol li.active span {
                width: 8px;
                height: 8px;
                margin: 1px auto;
            }

    #addiv .banner .warp .Mask {
        position: absolute;
        min-width: 300px;
        /*height:390px;*/
        background: none;
        z-index: 999;
        top: 0;
        right: 0;
        left: 0;
        right: 0;
        margin: 0 auto;
        background-image: url(.);
    }

    #addiv .banner .warp .prev {
        position: absolute;
        left: 10px;
        top: 170px;
        width: 40px;
        background: rgba(0,0,0,0.5);
        color: #fff;
        height: 80px;
        font-size: 30px;
        cursor: pointer;
        line-height: 80px;
        text-align: center;
        z-index: 9999;
        border-radius: 2px;
        background: #000 \9;
        filter: alpha(opacity=60) \9;
        display: none;
    }

    #addiv .banner .warp .next {
        position: absolute;
        right: 10px;
        top: 170px;
        width: 40px;
        background: rgba(0,0,0,0.5);
        color: #fff;
        height: 80px;
        font-size: 30px;
        cursor: pointer;
        line-height: 80px;
        text-align: center;
        z-index: 9999;
        border-radius: 2px;
        background: #000 \9;
        filter: alpha(opacity=60) \9;
        display: none;
    }

.TestInstordLst {
    overflow:hidden;
    margin-bottom:30px;
padding:20px 0px 30px 10px;
}

    .TestInstordLst .TestInstordItem {
        float: left;
        background: #fff;
        border-radius: 10px;
        width: 240px;
        height: 250px;
        line-height: 35px;
        margin-right: 67px;
     box-shadow:3px 3px 13px #ccc;
    }

        .TestInstordLst .TestInstordItem .icon {
            height: 160px;
            border-radius: 10px 10px 0px 0px;
            overflow: hidden;
            text-align: center;
        }

            .TestInstordLst .TestInstordItem .icon img {
                border-radius: 5px 5px 0px 0px;
                width: 130px;
                height: 130px;
                transition: 0.5s all;
                display: block;
                margin: 20px auto;
                border:1px solid #ccc;
                border-radius:50%;
                padding:2px;
            }

        .TestInstordLst .TestInstordItem:hover img {
            transform: scale(1.1);
        }

        .TestInstordLst .TestInstordItem .mess {
            text-align: center;
            padding-top: 15px;
        }

            .TestInstordLst .TestInstordItem .mess p {
                color: #666;
                font-size: 13px;
                line-height: 22px;
           /*     padding-left: 30px;
                padding-right: 10px;*/
                text-align: center;
            }

            .TestInstordLst .TestInstordItem .mess .title {
                line-height: 30px;
                font-weight: bold;
                color: #10AE59;
                font-size: 15px;
            }

        .TestInstordLst .TestInstordItem .oper {
            color: #fb684f;
            text-align: center;
            cursor: pointer;
        }

            .TestInstordLst .TestInstordItem .oper span {
                background: #f67920;
                color: #fff;
                text-align: center;
                padding: 3px 10px;
                line-height: 25px;
                border-radius: 10px;
            }
#jpspacial {
margin-top:20px;
margin-bottom:30px;
overflow:hidden;
}
#jpspacial .content-box h1 {
    margin-top: 10px;
    line-height: 60px;
}
#jpspacial .content-box h4 {
margin-bottom:10px;
}

    #jpspacial .content-box .flex-box {
        width: 1146px;
        margin: auto;
        display: -webkit-box;
        display: -moz-box;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        -webkit-justify-content: space-between;
        justify-content: space-between;
        padding-top: 5px;
        box-sizing: border-box;
        text-align: center;
        margin-bottom:30px;
    }

#jpspacial .content-box .flex-box .item {
    background-image: url(../../Img/icon/spcal01.png);
    background-size: 100% 100%;
    background-position: center center;
    background-repeat: no-repeat;

    background-position: top center !important;
    margin: 0 16px;
    width: 278px;
    font-size: 14px;
    color: #1c1f21;
    text-align: center;
    line-height: 22px;
    font-weight: 400;
    height:250px;

}
    #jpspacial .content-box .flex-box .item2 {
        background-image: url(../../Img/icon/spcal02.png);
    }
    #jpspacial .content-box .flex-box .item3 {
        background-image: url(../../Img/icon/spcal03.png);
    }
    #jpspacial .content-box .flex-box .item4 {
        background-image: url(../../Img/icon/spcal04.png);
    }
    #jpspacial .content-box .flex-box .item .p1 {
        margin-top: 61px;
        font-size: 14px;
        color: #1c1f21;
        text-align: center;
        line-height: 22px;
        font-weight: 600;
        padding-top:15px;
   
    }


    #jpspacial .content-box .flex-box .item .p2 {
        height: 100px;
        font-size:12px;
        margin-top:10px;
        padding:0 28px;
    }
.jpgg img{
    width:100%;
    margin-bottom:30px;
}

#cbsimg {
width:100px;
border-radius:0px;
height:120px;
}
#jpresz {
margin-bottom:70px;
}
/*********配套教材******/
#jpmaterial {
    margin-bottom: 70px;
}
#jpmaterial .container {
    position: relative;
    overflow: hidden;
}
#jpmaterial .materiallst {
    overflow: hidden;
    transition:0.5s all;
    margin-top:15px;
}
    #jpmaterial .materiallst .materialitem {
    float:left;
    width:230px;
    margin-bottom:20px;
    margin-right:10px;
    border:1px solid #333;
    }
        #jpmaterial .materiallst .materialitem img {
        width:100%;
        height:320px;
        }
#jpmaterial .materialol {
display:none;
}
#jpmaterial .container:hover .materialol {
display:block;
}

#jpmaterial .materialol span {
    position: absolute;
    width: 30px;
    height: 80px;
    background: rgba(0,0,0,.2);
    line-height: 80px;
    text-align: center;
    color: #fff;
    cursor: pointer;
    top: 120px;
    font-size: 25px;
    border-radius: 4px;
}
    #jpmaterial .materialol .left {
   
        left: 0px;
   
    }
    #jpmaterial .materialol .right {
   
    right:0px;
    }

.jpcimgdiv {
position:fixed;
top:50%;
left:50%;
margin-left:-250px;
margin-top:-342px;
text-align:center;
width:500px;
height:660px;
display:none;
z-index:999;
border:1px solid #ddd;
box-shadow:0px 0px 3px #ccc;
background:rgba(0,0,0,0.5);

}
    .jpcimgdiv .title {

        line-height: 25px;
        height: 25px;
    }
        .jpcimgdiv .title span {
        float:right;
        cursor:pointer;
        color:#fff;
        margin-right:10px;
        }
        .jpcimgdiv img {
            max-width: 500px;
            max-height: 600px;
        }