.wel-mem {
    background: #eff9f5;
}

.wel-mem .top {
    padding-bottom: 15px;
    font: 29px/48px Arial, sans-serif;
    font-weight: bold;
    background: url(../images/mem_0010.png) bottom center no-repeat;
    color: #4a4a49;
}

.wel-mem .mid {
    padding-top: 25px;
    font: 19px/25px Arial, sans-serif;
    color: #4a4a49;
}


/********************************/

.five-s {
    background: url("../images/wel-men/bg.jpg") top center no-repeat;
}

.five-s .f-top {
    font: 35px/24px Arial, sans-serif;
    color: #4a4a49;
    font-weight: bold;
    position: relative;
    top: 0px;
    z-index: 1;
}

.five-s .f-box {}

.five-s .f-hi {
    min-height: 509px;
    margin-top: 105px;
}

.five-s .f-box .polygon {
    /* width: 200px; */
    position: relative;
}

.five-s .f-box .polygon {
    /* width: 300px; */
    position: relative;
}

.five-s .f-box .polygon .pic {
    text-align: center;
    position: relative;
}

.five-s .f-box .polygon .text {
    padding-top: 15px;
    text-align: center;
    font: 15px/19px LINE Seed Sans TH, Arial, sans-serif;
    color: #ffffff;
}

.five-s .f-box .po-1 {
    top: 180px;
    left: 0;
}

.five-s .f-box .po-2 {
    top: -10px;
    /* left: -126px; */
    /* margin-left: -145px; */
}

.five-s .f-box .po-3 {
    top: 180px;
    /* left: -276px; */
    /* margin-left: -145px; */
}

.five-s .f-box .po-4 {
    top: -11px;
    /* left: -423px; */
    /* margin-left: -145px; */
}

.five-s .f-box .po-5 {
    top: 180px;
    /* left: -572px; */
    /* margin-left: -145px; */
}

.five-s .f-box .po-6 {
    top: -10px;
    /* left: -708px; */
    /* margin-left: -145px; */
}

.five-s .f-box .po-7 {
    top: 180px;
    /* left: -866px; */
    /* margin-left: -145px; */
}

.five-s .f-box .po-8 {
    top: 10px;
    /* left: -1017px; */
    /* margin-left: -145px; */
}

.five-s .f-box .po-9 {
    top: 180px;
    /* left: -1170px; */
    /* margin-left: -145px; */
}

.five-s .f-box .po-10 {
    top: -10px;
    /* left: -1325px; */
    /* margin-left: -145px; */
}

.five-s .f-box .po-11 {
    top: 180px;
    /* left: -1484px; */
    /* margin-left: -145px; */
}

@media (max-width: 575px) {
    .five-s .f-top {
        padding: 10px 0;
        top: 10px;
    }
    .wel-mem .top {
        font: 25px/35px Arial, sans-serif;
        font-weight: bold;
    }
    .five-s .f-top img {
        max-width: 100%;
    }
    .five-s .f-box .po-1 {}
    .five-s .f-box .po-2 {}
    .five-s .f-box .po-3 {}
    .five-s .f-box .po-4 {}
    .five-s .f-box .po-5 {}
    .five-s .f-box .po-6 {}
    .five-s .f-box .po-7 {}
    .five-s .f-box .po-8 {}
    .five-s .f-box .po-9 {}
    .five-s .f-box .po-10 {}
    .five-s .f-box .po-11 {}
}

@media (min-width: 576px) and (max-width: 767px) {
    .five-s .f-top {
        padding: 10px 0;
        top: 10px;
    }
    .wel-mem .top {
        font: 25px/35px Arial, sans-serif;
        font-weight: bold;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .five-s .f-top {
        padding: 10px 0px;
        top: 10px;
        /* left: -12px; */
        right: 15px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .five-s .f-hi {
        min-height: 447px;
    }
    .five-s .f-box .polygon {
        width: 300px;
    }
    .five-s .f-box img {
        max-width: 70%;
        height: auto;
    }
    .five-s .f-box .polygon .text {
        font: 17px/20px LINE Seed Sans TH, Arial, sans-serif;
    }
    .dates .d-box .d-top {
        text-indent: 12px;
    }
}

@media (min-width: 1200px) and (max-width: 1280px) {
    .five-s .f-box .polygon {
        width: 300px;
    }
}

@media (min-width: 1281px) and (max-width: 1366px) {
    .five-s .f-box .polygon {
        width: 248px;
        position: relative;
    }
}

@media (min-width: 1367px) and (max-width: 1440px) {
    .five-s .f-box .polygon {
        width: 255px;
    }
}

@media (min-width: 1441px) and (max-width: 1600px) {
    .five-s .f-box .polygon {
        width: 270px;
        position: relative;
    }
}