.content-header {
    padding: 70px 0;
    text-align: center;
}

.content-header img {
    display: block;
    margin: auto;
}

.content-header-desc {
    text-align: center;
    color: #545454;
    font-size: 20px;
}

/* kol list */
.kol-list {
    max-width: 1260px;
    margin: auto;
    margin-top: 100px;
    position: relative;
}

.kol-list-frame {
    position: relative;
    z-index: 1;
}

.kol-list-frame img.desktop {
    display: block;
    width: 100%;
}

.kol-list-left {
    width: 54%;
    height: 100%;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
}

.kol-list-info {
    text-align: center;
}

.kol-list-info p:nth-child(1) {
    padding-bottom: 25px;
}

.kol-list-info-ssname {
    color: #535353;
    font-size: 20px;
    padding: 20px 0;
}

.kol-list-info-btn {
    display: block;
    width: 150px;
    text-align: center;
    background-color: #e9bd7e;
    color: #FFF;
    padding: 5px 0;
    margin: 0 auto;
    font-size: 20px;
}

.kol-list-right {
    width: 46%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
}

.kol-list-right img {
    display: block;
    width: 100%;
}

.kol-list-right2 {
    width: 54%;
    height: 100%;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2;
}

.kol-list-left2 {
    width: 46%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.kol-list-left2 img {
    width: 100%;
}

/* more kol */
.more-kol {
    max-width: 1440px;
    margin: 140px auto 80px auto;
    position: relative;
}

.swiper-container {
    max-width: 1260px;
    width: 90%;
    margin: auto;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    position: relative;
}

.swiper-slide-hover {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(212, 165, 99, .8);
    display: none;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.swiper-slide-hover p {
    font-size: 20px;
    text-align: center;
    color: #FFF;
}

.swiper-slide-hover p a {
    color: #FFF;
    display: block;
    width: 150px;
    margin: auto;
    padding: 5px 0;
    border: 1px solid #FFF;
    font-size: 19px;
}

.swiper-slide-hover p:nth-child(2) {
    margin-top: 15px;
}

/* slide page start*/
.swiper-button-next,
.swiper-button-prev {
    background-image: url(../image/swiper-arrow2.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 80%;
}

.swiper-button-next {
    transform: scaleX(-1);
}

.swiper-button-next:after,
.swiper-button-prev:after {
    display: none;
}
.more-kol-mo{ display: none;}

/* end slide page*/
.swiper-slide img {
    display: block;
    width: 100%;
}

@media screen and (max-width: 750px) {
    .content-header {
        padding: 25px 0;
    }

    .content-header img {
        height: 24px;
    }

    .content-header-en img {
        height: auto;
        width: 50%;
    }

    .content-header-desc {
        font-size: 14px;
        margin: 0 15px;
    }

    .kol-list {
        margin-top: 50px;
        display: flex;
        flex-direction: column;
        margin-left: 15px;
        margin-right: 15px;
    }

    .kol-list-frame {
        position: absolute;
        left: 0;
        top: 0;
        z-index: 1;
    }

    .kol-list-frame img.desktop {
        display: none;
    }

    .kol-list-frame img.mobile {
        display: block;
        width: 100%;
    }

    .kol-list-left {
        display: block;
        width: 100%;
        height: auto;
        position: relative;
        order: 2;
    }

    .kol-list-right {
        width: 100%;
        height: auto;
        position: relative;
        order: 1;
    }

    .kol-list-left2 {
        display: block;
        width: 100%;
        height: auto;
        position: relative;
        order: 1;
    }

    .kol-list-right2 {
        width: 100%;
        height: auto;
        position: relative;
        order: 2;
    }

    .kol-list-info {
        padding-bottom: 40px;
    }

    .kol-list-info p:nth-child(1) {
        width: 60%;
        margin: auto;
        padding: 13px 0;
    }

    .kol1-pic {
        width: 42%;
        margin: auto;
    }

    .kol2-pic {
        width: 48%;
        margin: auto;
    }

    .kol3-pic {
        width: 55%;
        margin: auto;
    }

    .kol1-pic-en {
        width: 55%;
        margin: auto;
    }

    .kol2-pic-en {
        width: 40%;
        margin: auto;
    }

    .kol3-pic-en {
        width: 78%;
        margin: auto;
    }


    .kol-list-info img.pins {
        display: block;
        width: 100%;
    }

    .kol-list-info-ssname {
        font-size: 14px;
        padding: 15px 0;
    }

    .kol-list-info-btn {
        width: 120px;
        font-size: 15px;
    }

    /* more kol */
    .more-kol {
        margin: 40px auto 40px auto;
    }

    .more-kol-mo {
        display: flex;
        margin: 30px 5px 0 5px;
        flex-wrap: wrap;
    }

    .more-kol-mo-item {
        overflow: hidden;
        width: 50%;
    }

    .more-kol-mo-item a {
        display: block;
        color: #535353;
        margin: 10px;
    }

    .more-kol-mo-item a img {
        display: block;
        width: 100%;
    }

    .more-kol-mo-item a .username {
        text-align: center;
        padding: 10px 0 10px;
    }

    .more-kol-getmore {
        text-align: center;
        padding-top: 10px;
    }

    .more-kol-getmore a {
        display: inline-block;
        width: 120px;
        border: 1px solid #535353;
        color: #535353;
        padding: 5px;
    }

}

@media screen and (min-width:460px) and (max-width:750px){
    .kol-list-frame {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        z-index: 1;
    }
    .kol-list-frame img.mobile{ height: 100%;}
    .kol-list{ padding-bottom: 50px;}
}

/* ------------------------------ PAD ------------------------------------*/
@media screen and (min-width:750px) and (max-width:1000px){
    .content-header {
        padding: 40px 0;
    }
    .content-header img{ height: 25px; }
    .content-header-desc{ font-size: 16px;}
    .kol-list {
        margin: 60px 15px 0 15px;
    }
    .kol-list-info p:nth-child(1) img{ height: 30px;}
    .kol-list-info p:nth-child(2) img{ height: 26px;}
    .kol-list-info-ssname {
        font-size: 16px;
        padding: 15px 0;
    }
    .kol-list-info-btn {
        width: 120px;
        font-size: 16px;
    }
    .kol-list-info p:nth-child(2) img.kol2-pic{ height: 62px;}
    .more-kol {
        margin: 80px auto 60px auto;

    }
    .content-header-desc {
       padding:  0 20px;
    }
}