.n6_home-main-img {
    width : 100%;
    height : 450px;
    background-image : url(/assets/images/home/home-main-img.jpg);
    background-repeat : repeat-x;
    background-position : 0 center;
}

.n6_home-main-copy {
    width : 1020px;
    margin : 0 auto;
    padding-top : 140px;
}

@media (max-width: 640px) {
    .n6_home-main-img {
        height : 160px;
        background-size : 910px 160px;
    }
    .n6_home-main-copy {
        width : 100%;
        padding : 50px 20px 0; 
        text-align : center;
    }
    .n6_home-main-copy img {
        width : 100%;
        max-width : 320px;
    }
}

.n6_home-service-item {
    float : left;
    width : 33.3%;
    padding : 0 4px;
    text-align : center;
}
.n6_home-service-item a {
    display : block;
}
.n6_home-service-item a.is-hrm {
    background-color : #e4f1f5;
}
.n6_home-service-item a.is-tool {
    background-color : #ddf3ef;
}
.n6_home-service-item a.is-pub {
    background-color : #f6ecd8;
}
.n6_home-service-title {
    font-size : 30px;
    font-size : 3rem;
    font-weight : bold;
    line-height : 1;
    padding : 25px 0 20px 0;
}
.n6_home-service-icon {
    margin-right : 8px;
}
.n6_home-service-link {
    font-size : 18px;
    font-size : 1.8rem;
    font-weight : bold;
    position : relative;
    display : block;
    padding : 20px 15px;
    text-align : left;
    color : #fff;
    background-color : #60b8e0;
}
.n6_home-service-link:after {
    position : absolute;
    top : 25px;
    right : 15px;
    display : block;
    width : 10px;
    height : 17px;
    content : '';
    background-image : url(/assets/images/common-chevron-white.png);
}
.n6_home-service-link.is-2col {
    float : left;
    width : 50%;
}
.n6_home-service-link.is-2col-first {
    float : left;
    width : 50%;
    border-right : 1px solid #fff;
}

@media (max-width: 640px) {
    .n6_home-service {
        font-size : 1.3rem;
    }
    .n6_home-service-item {
        float : none;
        clear : both;
        width : 100%;
        margin-bottom : 20px;
        padding : 0 10px;
    }
    .n6_home-service-title {
        font-size : 2.2rem;
        padding : 12px 0 10px 0;
    }
    .n6_home-service-icon {
        width : 32px;
        height : 30px;
        margin-right : 5px;
    }
    .n6_home-service-link {
        font-size : 1.5rem;
        font-weight : normal;
        padding : 10px 8px;
    }
    .n6_home-service-link:after {
        top : 19px;
        right : 10px;
        width : 6px;
        height : 8px;
        background-size : 6px 8px;
    }
}

.n6_home-whatday {
    font-weight : bold;
    max-width : 680px;
    margin : 50px auto 0;
    padding : 15px 20px 10px 20px;
    border : 3px solid #e4f1f5;
    border-radius : 4px;
}
.n6_home-whatday-title {
    font-size : 24px;
    font-size : 2.4rem;
    line-height : 40px;
    margin-bottom : 5px;
    text-align : center;
    color : #0099df;
}
.n6_home-whatday-icon {
    position : relative;
    top : -3px;
    margin-right : 10px;
}
.n6_home-whatday-text {
    font-size : 21px;
    font-size : 2.1rem;
}

@media (max-width: 640px) {
    .n6_home-whatday {
        margin : 0 10px;
        padding : 15px 10px 10px;
    }
    .n6_home-whatday-title {
        font-size : 1.8rem;
        line-height : 30px;
    }
    .n6_home-whatday-icon {
        width : 30px;
        height : 30px;
        margin-right : 5px;
    }
    .n6_home-whatday-text {
        font-size : 1.6rem;
        font-weight : normal;
    }
}

.n6_home-pickup-item {
    float : left;
/*    width : 22%;*/
    width: 50%;
    padding : 1px;
}
.n6_home-pickup-item:first-child {
/*    width : 56%;*/
}
.n6_home-pickup-item:first-child p {
    height : auto;
}
.n6_home-pickup-item img {
    width : 100%;
}
.n6_home-pickup-item p {
    font-size : 12px;
    font-size : 1.2rem;
    height : 52px;
    padding : 6px 10px;
    background-color : #fff;
}

@media (max-width: 640px) {
    .n6_home-pickup {
        padding : 0 10px;
    }
    .n6_home-pickup-item {
        float : none;
        width : 100%;
        margin-bottom : 10px;
        padding : 0;
    }
    .n6_home-pickup-item:first-child {
        width : 100%;
    }
    .n6_home-pickup-item img {
        width : 100%;
    }
    .n6_home-pickup-item p {
        height : auto;
        padding : 6px 10px;
    }
}

.n6_home-news {
    float : left;
    width : 65%;
    padding : 0 25px 0 60px;
}
.n6_home-news .n6_news-item {
    margin-right : 15px; 
    padding : 15px 0;
}
.n6_home-news .n6_news-item-text {
    font-size : 14px;
    font-size : 1.4rem;
    clear : both;
    padding-top : 5px;
}
.n6_home-news .n6_news-item-date {
    font-size : 14px;
    font-size : 1.4rem;
}
.n6_home-news .n6_news-item-cate {
    font-size : 11px;
    font-size : 1.1rem;
}

@media (max-width: 640px) {
    .n6_home-news {
        float : none;
        width : 100%;
        padding : 0 10px;
    }
    .n6_home-news .n6_news-list {
        overflow-y : auto;
        height : auto;
        margin-bottom : 20px;
    }
    .n6_home-news .n6_news-item {
        margin-right : 0;
    }
    .n6_home-news .n6_news-item-text {
        font-size : 1.3rem;
        padding-top : 0;
    }
    .n6_home-news .n6_news-item-date {
        font-size : 1.3rem;
    }
    .n6_home-news .n6_news-item-cate {
        font-size : 1rem;
    }
}

.n6_home-seminar {
    float : right;
    width : 35%;
    padding : 0 60px 0 25px;
}
.n6_home-seminar-inner {
    height : 330px;
    margin-bottom : 40px;
    padding : 20px 10px 5px 20px;
    background-color : #c7e5f3;
}
.n6_home-seminar-list li {
    margin-right : 10px; 
    padding : 15px 0;
    border-top : 1px solid #fff;
}
.n6_home-seminar-list li:first-child {
    padding : 5px 0 15px;
    border-top : none;
}
.n6_home-seminar-list li a:hover {
    opacity : 1;
    color : #0099df;
}

@media (max-width: 640px) {
    .n6_home-seminar {
        float : none;
        clear : both;
        width : 100%;
        padding : 20px 10px 0;
    }
    .n6_home-seminar-inner {
        height : auto;
        margin-bottom : 20px;
        padding : 10px 10px 5px;
    }
    .n6_home-seminar-list {
        overflow-y : auto;
        height : auto;
    }
    .n6_home-seminar-list > li {
        font-size : 1.3rem;
        padding : 10px 0;
    }
    .n6_home-seminar-list > li:first-child {
        padding : 5px 0 10px;
    }
}

.n6_home-tool {
    width : 1060px;
    min-width : 1060px;
    margin : 0 auto;
    padding : 0 5px;
}
.n6_home-tool > li {
    float : left;
    padding : 15px;
}

@media (max-width: 640px) {
    .n6_home-tool {
        width : 100%;
        min-width : 100%;
        margin : 20px 0 0;
        padding : 0 45px;
        text-align : center;
    }
    .n6_home-tool > li {
        float : none;
        margin-bottom : 10px;
        padding : 0;
    }
}

.n6_home-book {
    position : relative;
    overflow-y : hidden;
    max-width : 1600px;
    max-height : 140px;
    margin : 0 auto;
    padding : 0 90px;
}
.n6_home-book-slider li {
    float : left;
}
.n6_home-book-slider li img {
    width : auto;
    max-height : 140px;
    -webkit-transition : all .2s;
            transition : all .2s;
}
.n6_home-book-slider li img:hover {
    opacity : .7;
}
.n6_home-book-prev,
.n6_home-book-next {
    position : absolute;
    top : 50%;
    margin-top : -15px;
}
.n6_home-book-prev {
    right : -60px;
}
.n6_home-book-next {
    left : -60px;
}

@media (max-width: 640px) {
    .n6_home-book {
        margin : 0 auto;
        padding : 0 40px;
    }
    .n6_home-book-prev,
    .n6_home-book-next {
        position : absolute;
        top : 50%;
        margin-top : -12px;
    }
    .n6_home-book-prev {
        right : -20px;
    }
    .n6_home-book-next {
        left : -20px;
    }
}

/*
 * CSS Styles that are needed by jScrollPane for it to operate correctly.
 *
 * Include this stylesheet in your site or copy and paste the styles below into your stylesheet - jScrollPane
 * may not operate correctly without them.
 */
.jspContainer {
    position : relative;
    overflow : hidden;
}

.jspPane {
    position : absolute;
}

.jspVerticalBar {
    position : absolute;
    top : 0;
    right : 0;
    width : 16px;
    height : 100%;
    background : red;
}

.jspHorizontalBar {
    position : absolute;
    bottom : 0;
    left : 0;
    width : 100%;
    height : 16px;
    background : red;
}

.jspCap {
    display : none;
}

.jspHorizontalBar .jspCap {
    float : left;
}

.jspTrack {
    position : relative;
    padding : 2px;
    background : #eee;
}

.jspDrag {
    position : relative;
    top : 0;
    left : 0;
    cursor : pointer;
    border-radius : 6px;
    background : #c6d4da;
}

.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag {
    float : left;
    height : 100%;
}

.jspArrow {
    display : block;
    margin : 0;
    padding : 0;
    cursor : pointer;
    text-indent : -20000px;
    background : #50506d;
}

.jspArrow.jspDisabled {
    cursor : default;
    background : #80808d;
}

.jspVerticalBar .jspArrow {
    height : 16px;
}

.jspHorizontalBar .jspArrow {
    float : left;
    width : 16px;
    height : 100%;
}

.jspVerticalBar .jspArrow:focus {
    outline : none;
}

.jspCorner {
    float : left;
    height : 100%;
    background : #eeeef4;
}

.js-scroll-news {
    overflow : auto;
    width : 100%;
    height : 330px;
}

.js-scroll-seminar {
    overflow : auto;
    width : 100%;
    height : 270px;
}

@media (max-width: 640px) {
    .js-scroll-seminar {
        height : auto;
    }
}