.jongstit{
    --js-color1:#63C206;
    --js-color2:#434343;
    --js-color3:#FFFFFF;
    --js-color4:#050505;

    --sec2-padding: 20px 0;
    --sec3-padding: 20px 0;
    --sec4-padding: 20px 0;
    --sec5-padding: 20px 0;
    --sec6-padding: 40px 15px;
    --sec7-padding: 20px 0;
    --sec8-padding: 40px 15px;
    --sec9-padding: 20px 0;
    --sec10-padding: 40px 15px;
    --sec11-padding: 20px 0;

    background-color: var(--msBg);
}
.img-block img{
    height: 100% !important;
}
strong{
    font-weight: inherit;
}

/* end all setting */

.jongstit > #sec1{
    position: relative;
}
.jongstit > #sec1 > .content{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    z-index: 2;
}
.jongstit > #sec1 > .content > .content-group{
    margin: auto auto auto 3.5%;
}
.jongstit > #sec1 .sec1-title{
    color: var(--js-color1);
    /* text-align: center; */
    font-weight: 700;
    margin: 0;
    text-shadow: 0 1px 2px var(--js-color2);
}
html:lang(th) .jongstit > #sec1 .sec1-title,
html:lang(en) .jongstit > #sec1 .sec1-title{
    font-size: 19.18px;
    line-height: calc(100% + 15px);
}
.jongstit > #sec1 .sec1-sub-title{
    color: var(--js-color1);
    /* text-align: center; */
    font-weight: 500;
    margin: 0;
    text-shadow: 0 1px 2px var(--js-color2);
}
html:lang(th) .jongstit > #sec1 .sec1-sub-title,
html:lang(en) .jongstit > #sec1 .sec1-sub-title{
    font-size: 19.18px;
    line-height: calc(100% + 15px);
}

/* end sec1 */

.jongstit > #sec2{
    padding: var(--sec2-padding);
    position: relative;
}
.jongstit > #sec2 .content{
    display: flex;
    flex-direction: column;
}
.jongstit > #sec2 .content > .content-group{
    margin: auto;
}
.jongstit > #sec2 .content > .group2{
    display: flex;
    flex-direction: row;
}
.jongstit > #sec2 .content > .group2 > *:first-child{
    margin-right: 30px;
}
.jongstit > #sec2 .content > *:not(:last-child){
    margin-bottom: 30px;
}
.jongstit > #sec2 .sec2-desc{
    text-align: center;
    line-height: calc(100% + 15px);
    font-size: 12px;
}
.jongstit > #sec2 .sec2-title{
    color: var(--js-color1);
}

/* end sec2 */

.jongstit > #sec3{
    position: relative;
    padding: var(--sec3-padding);
    background-image: url(/assets/images/leading_in_polyester_fabric/m/85-years-of-expertise.webp);
    background-position: center;
    background-size: cover;
}
.jongstit > #sec3 .img-block{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.jongstit > #sec3 .sec3-desc{
    color: var(--js-color3);
    text-align: center;
    line-height: calc(100% + 15px);
    font-size: 12px;
}
.jongstit > #sec3 .content{
    position: relative;
    display: flex;
    flex-direction: column;
}
.jongstit > #sec3 .content > *{
    margin: auto;
}

/* end sec3 */

.jongstit > #sec4{
    padding: var(--sec4-padding);
    position: relative;
}
.jongstit > #sec4::after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 35%;
    background: var(--js-color3);
    background: radial-gradient(circle, rgba(255, 255, 255, 1) 47%, rgba(203, 235, 172, 1) 71%, rgba(99, 194, 6, 0.5) 99%);
    border-bottom: 1px solid #63C206;
}
.jongstit > #sec4 .sec4-title{
    line-height: calc(100% + 15px);
    color: var(--js-color1);
    text-align: center;
    font-weight: 700;
    margin: 0;
}
html:lang(th) .jongstit > #sec4 .sec4-title,
html:lang(en) .jongstit > #sec4 .sec4-title{
    font-size: 19.18px;
}
.jongstit > #sec4 .content{
    display: flex;
    flex-direction: column;
}
.jongstit > #sec4 .content > *:not(:last-child){
    margin-bottom: 30px !important;
}
.jongstit > #sec4 .content > .content-group{
    margin: auto;
}
.jongstit > #sec4 .content > .group2{
    width: 100%;
    position: relative;
    z-index: 1;
}
.jongstit > #sec4 .r1 > *{
    display: flex;
    padding: 0 7.5px;
}
.jongstit > #sec4 .r1 > * > .card{
    margin: auto;
    position: relative;
    width: fit-content !important;
    border-radius: 4%;
    /* overflow: hidden; */
    background-color: var(--js-color3);
    box-shadow: 2px 2px 24px #ccc;
}
.jongstit > #sec4 .r1 > * > .card > img{
    border-radius: 4% 4% 0 0;
}
.jongstit > #sec4 .r1 > * > .card > .card-body{
    padding: 0 7.5px 7.5px;
}
.jongstit > #sec4 .sec4-sub-title{
    /* position: relative; */
    color: var(--js-color1);
    line-height: calc(100% + 15px);
    margin: 10px 0 5px;
    /* padding-right: 20px; */
}
.jongstit > #sec4 .sec4-sub-title > a{
    position: absolute;
    bottom: 0;
    right: 7.5px;
    width: fit-content;
    /* height: 100%; */
    display: flex;
}
.jongstit > #sec4 .sec4-sub-title > a > *{
    margin: auto 0 auto auto;
    font-size: calc(100% + 18px);
    line-height: 0;
    font-style: normal;
    font-weight: 400;
    text-decoration: inherit;
    color: #60AB44;
}
.jongstit > #sec4 .sec4-sub-title > a > *:hover{
    color: var(--js-color4);
}

html:lang(th) .jongstit > #sec4 .sec4-sub-title,
html:lang(en) .jongstit > #sec4 .sec4-sub-title{
    font-size: 12px;
}
.jongstit > #sec4 .sec4-list{
    padding-inline-start: 16px;
    font-weight: 500;
    line-height: calc(100% + 10px);
}
html:lang(th) .jongstit > #sec4 .sec4-list,
html:lang(en) .jongstit > #sec4 .sec4-list{
    font-size: 10px;
}
.jongstit > #sec4 .sec4-list > *::marker{
    color: var(--js-color1);
}

/* end sec4 */

.jongstit > #warp-knit-fabric{
    padding: var(--sec5-padding);
}
.jongstit > #warp-knit-fabric .r1{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.jongstit > #warp-knit-fabric .r1 > *{
    margin: auto;
}
.jongstit > #warp-knit-fabric .r1 > *:first-child{
    text-align: center;
}
.jongstit > #warp-knit-fabric .r1 > *:last-child > .content > .content-group{
    display: flex;
}
.jongstit > #warp-knit-fabric .r1 > *:last-child > .content > .content-group > *{
    margin: auto;
}
.jongstit > #warp-knit-fabric .sec5-title{
    color: var(--js-color2);
    font-weight: 700;
    line-height: calc(100% + 15px);
    margin: 0;
}
html:lang(th) .jongstit > #warp-knit-fabric .sec5-title,
html:lang(en) .jongstit > #warp-knit-fabric .sec5-title{
    font-size: 19.18px;
}
.jongstit > #warp-knit-fabric .sec5-sub-title{
    color: var(--js-color3);
    background-color: #60AB44;
    font-weight: 700;
    width: fit-content;
    line-height: calc(100% + 7.5px);
    padding: 0 7.5px;
    margin: 0;
}
html:lang(th) .jongstit > #warp-knit-fabric .sec5-sub-title,
html:lang(en) .jongstit > #warp-knit-fabric .sec5-sub-title{
    font-size: 14.59px;
}
.jongstit > #warp-knit-fabric .sec5-desc{
    color: var(--js-color4);
    margin: 15px auto;
    font-weight: 400;
    line-height: calc(100% + 8px);
    max-width: 777px;
    font-size: 10px;
}
.jongstit > #warp-knit-fabric .sec5-title,
.jongstit > #warp-knit-fabric .sec5-sub-title{
    display: inline-block;
}
.jongstit > #warp-knit-fabric .sec5-sub-title{
    margin-left: 5px;
}
.jongstit > #warp-knit-fabric .img-block{
    position: relative;
}
.jongstit > #warp-knit-fabric .img-thumb-block{
    margin: -15% auto auto;
    max-width: 95%;
}
.jongstit > #warp-knit-fabric .img-thumb-block > *{
    padding: 0 3.25px;
}
.jongstit > #warp-knit-fabric .img-thumb-block > * > img{
    width: 100%;
}

/* end sec5 */

.jongstit #sec6{
    border-top: 1px solid var(--js-color1);
    border-bottom: 1px solid var(--js-color1);
}
.jongstit #sec6 > .container{
    border-left: 1px solid var(--js-color1);
    border-right: 1px solid var(--js-color1);
    padding: var(--sec6-padding);
}
.jongstit > #sec6 .r1{
    margin: 0;
}
.jongstit > #sec6 .sec6-title{
    font-weight: 500;
    color: var(--js-color4);
}
.jongstit > #sec6 .sec6-desc{
    font-weight: 400;
    color: var(--js-color4);
    line-height: calc(100% + 10px);
}
.jongstit > #sec6 .sec6-title,
.jongstit > #sec6 .sec6-desc{
    text-align: center;
}
.jongstit > #sec6 .sec6-desc{
    max-width: 769px;
}
.jongstit #sec6 .content > .content-group{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.jongstit #sec6 .sec6-btn-group{
    display: flex;
    padding: 40px 0;
}
.jongstit #sec6 .sec6-btn-group > .sec6-btn{
    position: relative;
    display: block;
    margin: auto;
    width: fit-content;
    border: 1px solid var(--js-color1);
    border-radius: 10px;
    padding: 16px 32px;
    font-weight: 700;
    color: var(--js-color4);
    animation: heartbeat 2s infinite;
    transform-origin: center;
}
.jongstit #sec6 .sec6-btn-group > .sec6-btn:hover{
    animation-play-state: paused;
}
.jongstit #sec6 .sec6-btn-group > .sec6-btn::after{
    content: "Tap to explore";
    position: absolute;
    left: 25%;
    width: 50%;
    height: fit-content;
    text-align: center;
    background-color: var(--js-color1);
    color: var(--js-color3);
    border-radius: 0px 0px 5px 5px;
}
html:lang(th) .jongstit #sec6 .sec6-btn-group > .sec6-btn::after{
    bottom: calc(-100% + 16px);
    line-height: calc(100% + 32px);
}
html:lang(en) .jongstit #sec6 .sec6-btn-group > .sec6-btn::after{
    bottom: -100%;
    line-height: calc(100% + 24px);
}
html:lang(th) .jongstit #sec6 .sec6-btn-group > .sec6-btn,
html:lang(en) .jongstit #sec6 .sec6-btn-group > .sec6-btn{
    font-size: 32px;
}

/* end sec6 */

.jongstit > #fleece-and-pile-fabric{
    padding: var(--sec7-padding);
}
.jongstit > #fleece-and-pile-fabric .r1{
    display: flex;
    flex-direction: column-reverse;
    flex-wrap: wrap;
}
.jongstit > #fleece-and-pile-fabric .r1 > *{
    margin: auto;
}

.jongstit > #fleece-and-pile-fabric .r1 > *:last-child{
    text-align: center;
}
.jongstit > #fleece-and-pile-fabric .r1 > *:first-child > .content > .content-group{
    display: flex;
}
.jongstit > #fleece-and-pile-fabric .r1 > *:first-child > .content > .content-group > *{
    margin: auto;
}

.jongstit > #fleece-and-pile-fabric .sec7-title{
    color: var(--js-color2);
    font-weight: 700;
    line-height: calc(100% + 15px);
    margin: 0;
}
html:lang(th) .jongstit > #fleece-and-pile-fabric .sec7-title,
html:lang(en) .jongstit > #fleece-and-pile-fabric .sec7-title{
    font-size: 19.18px;
}
.jongstit > #fleece-and-pile-fabric .sec7-sub-title{
    color: var(--js-color3);
    background-color: #60AB44;
    font-weight: 700;
    width: fit-content;
    line-height: calc(100% + 7.5px);
    padding: 0 7.5px;
    margin: 0;
}
html:lang(th) .jongstit > #fleece-and-pile-fabric .sec7-sub-title,
html:lang(en) .jongstit > #fleece-and-pile-fabric .sec7-sub-title{
    font-size: 14.59px;
}
.jongstit > #fleece-and-pile-fabric .sec7-desc{
    color: var(--js-color4);
    margin: 15px auto;
    font-weight: 400;
    line-height: calc(100% + 8px);
    max-width: 777px;
    font-size: 10px;
}
.jongstit > #fleece-and-pile-fabric .sec7-title,
.jongstit > #fleece-and-pile-fabric .sec7-sub-title{
    display: inline-block;
}
.jongstit > #fleece-and-pile-fabric .sec7-sub-title{
    margin-left: 5px;
}
.jongstit > #fleece-and-pile-fabric .img-block{
    position: relative;
}
.jongstit > #fleece-and-pile-fabric .img-thumb-block{
    margin: -15% auto auto;
    max-width: 95%;
}
.jongstit > #fleece-and-pile-fabric .img-thumb-block > *{
    padding: 0 3.25px;
}
.jongstit > #fleece-and-pile-fabric .img-thumb-block > * > img{
    width: 100%;
}

/* end sec7 */

.jongstit #sec8{
    border-top: 1px solid var(--js-color1);
    border-bottom: 1px solid var(--js-color1);
}
.jongstit #sec8 > .container{
    border-left: 1px solid var(--js-color1);
    border-right: 1px solid var(--js-color1);
    padding: var(--sec8-padding);
}
.jongstit > #sec8 .r1{
    margin: 0;
}
.jongstit > #sec8 .sec8-title{
    font-weight: 500;
    color: var(--js-color4);
}
.jongstit > #sec8 .sec8-desc{
    font-weight: 400;
    color: var(--js-color4);
    line-height: calc(100% + 10px);
}
.jongstit > #sec8 .sec8-title,
.jongstit > #sec8 .sec8-desc{
    text-align: center;
}
.jongstit > #sec8 .sec8-desc{
    max-width: 769px;
}
.jongstit #sec8 .content > .content-group{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.jongstit #sec8 .sec8-btn-group{
    display: flex;
    padding: 40px 0;
}
.jongstit #sec8 .sec8-btn-group > .sec8-btn{
    position: relative;
    display: block;
    margin: auto;
    width: fit-content;
    border: 1px solid var(--js-color1);
    border-radius: 10px;
    padding: 12px 24px;
    font-weight: 700;
    color: var(--js-color4);
    animation: heartbeat 2s infinite;
    transform-origin: center;
}
.jongstit #sec8 .sec8-btn-group > .sec8-btn:hover{
    animation-play-state: paused;
}
.jongstit #sec8 .sec8-btn-group > .sec8-btn::after{
    content: "Click here";
    position: absolute;
    left: 25%;
    width: 50%;
    height: fit-content;
    text-align: center;
    background-color: var(--js-color1);
    color: var(--js-color3);
    border-radius: 0px 0px 5px 5px;
}
html:lang(th) .jongstit #sec8 .sec8-btn-group > .sec8-btn::after{
    bottom: calc(-100% + 12px);
    line-height: calc(100% + 24px);
}
html:lang(en) .jongstit #sec8 .sec8-btn-group > .sec8-btn::after{
    bottom: -100%;
    line-height: calc(100% + 24px);
}
html:lang(th) .jongstit #sec8 .sec8-btn-group > .sec8-btn,
html:lang(en) .jongstit #sec8 .sec8-btn-group > .sec8-btn{
    font-size: 24px;
}

/* end sec8 */

.jongstit > #sportswear-fabric{
    padding: var(--sec9-padding);
}
.jongstit > #sportswear-fabric .r1{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.jongstit > #sportswear-fabric .r1 > *{
    margin: auto;
}
.jongstit > #sportswear-fabric .r1 > *:first-child{
    text-align: center;
}
.jongstit > #sportswear-fabric .r1 > *:last-child > .content > .content-group{
    display: flex;
}
.jongstit > #sportswear-fabric .r1 > *:last-child > .content > .content-group > *{
    margin: auto;
}
.jongstit > #sportswear-fabric .sec9-title{
    color: var(--js-color2);
    font-weight: 700;
    line-height: calc(100% + 15px);
    margin: 0;
}
html:lang(th) .jongstit > #sportswear-fabric .sec9-title,
html:lang(en) .jongstit > #sportswear-fabric .sec9-title{
    font-size: 19.18px;
}
.jongstit > #sportswear-fabric .sec9-sub-title{
    color: var(--js-color3);
    background-color: #60AB44;
    font-weight: 700;
    width: fit-content;
    line-height: calc(100% + 7.5px);
    padding: 0 7.5px;
    margin: 0;
}
html:lang(th) .jongstit > #sportswear-fabric .sec9-sub-title,
html:lang(en) .jongstit > #sportswear-fabric .sec9-sub-title{
    font-size: 14.59px;
}
.jongstit > #sportswear-fabric .sec9-desc{
    color: var(--js-color4);
    margin: 15px auto;
    font-weight: 400;
    line-height: calc(100% + 8px);
    max-width: 777px;
    font-size: 10px;
}
.jongstit > #sportswear-fabric .sec9-title,
.jongstit > #sportswear-fabric .sec9-sub-title{
    display: inline-block;
}
.jongstit > #sportswear-fabric .sec9-sub-title{
    margin-left: 5px;
}
.jongstit > #sportswear-fabric .img-block{
    position: relative;
}
.jongstit > #sportswear-fabric .img-thumb-block{
    margin: -15% auto auto;
    max-width: 95%;
}
.jongstit > #sportswear-fabric .img-thumb-block > *{
    padding: 0 3.25px;
}
.jongstit > #sportswear-fabric .img-thumb-block > * > img{
    width: 100%;
}

/* end sec9 */

.jongstit #sec10{
    border-top: 1px solid var(--js-color1);
    border-bottom: 1px solid var(--js-color1);
}
.jongstit #sec10 > .container{
    border-left: 1px solid var(--js-color1);
    border-right: 1px solid var(--js-color1);
    padding: var(--sec10-padding);
}
.jongstit > #sec10 .r1{
    margin: 0;
}
.jongstit > #sec10 .sec10-title{
    font-weight: 500;
    color: var(--js-color4);
}
.jongstit > #sec10 .sec10-desc{
    font-weight: 400;
    color: var(--js-color4);
    line-height: calc(100% + 10px);
}
.jongstit > #sec10 .sec10-title,
.jongstit > #sec10 .sec10-desc{
    text-align: center;
}
.jongstit > #sec10 .sec10-desc{
    max-width: 769px;
}
.jongstit #sec10 .content > .content-group{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.jongstit #sec10 .sec10-btn-group{
    display: flex;
    padding: 40px 0;
}
.jongstit #sec10 .sec10-btn-group > .sec10-btn{
    position: relative;
    display: block;
    margin: auto;
    width: fit-content;
    border: 1px solid var(--js-color1);
    border-radius: 10px;
    padding: 12px 24px;
    font-weight: 700;
    color: var(--js-color4);
    animation: heartbeat 2s infinite;
    transform-origin: center;
}
.jongstit #sec10 .sec10-btn-group > .sec10-btn:hover{
    animation-play-state: paused;
}
.jongstit #sec10 .sec10-btn-group > .sec10-btn::after{
    content: "Click here";
    position: absolute;
    left: 25%;
    width: 50%;
    height: fit-content;
    text-align: center;
    background-color: var(--js-color1);
    color: var(--js-color3);
    border-radius: 0px 0px 5px 5px;
}
html:lang(th) .jongstit #sec10 .sec10-btn-group > .sec10-btn::after{
    bottom: calc(-100% + 12px);
    line-height: calc(100% + 24px);
}
html:lang(en) .jongstit #sec10 .sec10-btn-group > .sec10-btn::after{
    bottom: -100%;
    line-height: calc(100% + 24px);
}
html:lang(th) .jongstit #sec10 .sec10-btn-group > .sec10-btn,
html:lang(en) .jongstit #sec10 .sec10-btn-group > .sec10-btn{
    font-size: 24px;
}

/* end sec10 */

.jongstit > #sec11{
    position: relative;
    padding: var(--sec11-padding);
    background-image: url(/assets/images/leading_in_polyester_fabric/jongstit.webp);
    background-position: center;
    background-size: cover;
    /* margin-bottom: 10%; */
}
.jongstit > #sec11 .img-block{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.jongstit > #sec11 .sec11-desc{
    text-align: center;
    line-height: calc(100% + 15px);
    font-size: 12px;
    color: var(--js-color3);
    margin: 0;
}
.jongstit > #sec11 .content{
    position: relative;
    display: flex;
    flex-direction: column;
}
.jongstit > #sec11 .content > *{
    margin: auto;
}

/* end sec11 */

@media screen and (min-width:576px){
    .jongstit{
        --sec2-padding: 30px 0;
        --sec3-padding: 30px 0;
        --sec4-padding: 30px 0;
        --sec5-padding: 30px 0;
        --sec7-padding: 30px 0;
        --sec9-padding: 30px 0;
        --sec11-padding: 30px 0;
    }

    /* end all setting */

    html:lang(th) .jongstit > #sec1 .sec1-title,
    html:lang(en) .jongstit > #sec1 .sec1-title{
        font-size: 19.18px; /*3.33%*/
    }
    html:lang(th) .jongstit > #sec1 .sec1-sub-title,
    html:lang(en) .jongstit > #sec1 .sec1-sub-title{
        font-size: 19.18px; /*3.33%*/
    }

    /* end sec1 */

    html:lang(th) .jongstit > #sec2 .sec2-desc,
    html:lang(en) .jongstit > #sec2 .sec2-desc{
        font-size: 16px; /*1.25%*/
    }
    html:lang(th) .jongstit > #sec2 .sec2-title,
    html:lang(en) .jongstit > #sec2 .sec2-title{
        font-size: 19.18px; /*3.33%*/
    }
    html:lang(th) .jongstit > #sec2 .sec2-title > span,
    html:lang(en) .jongstit > #sec2 .sec2-title > span{
        font-size: 33.24px /*5.77%*/
    }

    /* end sec2 */

    html:lang(th) .jongstit > #sec3 .sec3-desc,
    html:lang(en) .jongstit > #sec3 .sec3-desc{
        font-size: 16px; /*1.25%*/
    }

    /* end sec3 */

    .jongstit > #sec4 .sec4-sub-title{
        margin: 20px 0 10px;
    }
    .jongstit > #sec4::after{
        height: 44%;
    }
    html:lang(th) .jongstit > #sec4 .sec4-sub-title,
    html:lang(en) .jongstit > #sec4 .sec4-sub-title{
        font-size: 14px;
    }
    html:lang(th) .jongstit > #sec4 .sec4-list,
    html:lang(en) .jongstit > #sec4 .sec4-list{
        font-size: 12px;
    }
    .jongstit > #sec4::after{
        border-top: 1px solid #63C206;
    }

    /* end sec4 */

    .jongstit > #warp-knit-fabric .sec5-desc{
        margin: 30px auto;
    }
    html:lang(th) .jongstit > #warp-knit-fabric .sec5-title,
    html:lang(en) .jongstit > #warp-knit-fabric .sec5-title{
        font-size: 19.07px; /*3.31*/
    }
    html:lang(th) .jongstit > #warp-knit-fabric .sec5-sub-title,
    html:lang(en) .jongstit > #warp-knit-fabric .sec5-sub-title{
        font-size: 14.28px; /*2.48%*/
    }
    html:lang(th) .jongstit > #warp-knit-fabric .sec5-desc,
    html:lang(en) .jongstit > #warp-knit-fabric .sec5-desc{
        font-size: 14px;
    }

    /* end sec5 */

    html:lang(th) .jongstit > #sec6 .sec6-title,
    html:lang(en) .jongstit > #sec6 .sec6-title{
        font-size: 36px;
    }
    html:lang(th) .jongstit > #sec6 .sec6-desc,
    html:lang(en) .jongstit > #sec6 .sec6-desc{
        font-size: 16px; /*1.25%*/
    }

    /* end sec6 */

    .jongstit > #fleece-and-pile-fabric .sec7-desc{
        margin: 30px auto;
    }
    html:lang(th) .jongstit > #fleece-and-pile-fabric .sec7-title,
    html:lang(en) .jongstit > #fleece-and-pile-fabric .sec7-title{
        font-size: 19.07px; /*3.31*/
    }
    html:lang(th) .jongstit > #fleece-and-pile-fabric .sec7-sub-title,
    html:lang(en) .jongstit > #fleece-and-pile-fabric .sec7-sub-title{
        font-size: 14.28px; /*2.48%*/
    }
    html:lang(th) .jongstit > #fleece-and-pile-fabric .sec7-desc,
    html:lang(en) .jongstit > #fleece-and-pile-fabric .sec7-desc{
        font-size: 14px;
    }

    /* end sec7 */

    html:lang(th) .jongstit > #sec8 .sec8-title,
    html:lang(en) .jongstit > #sec8 .sec8-title{
        font-size: 36px;
    }
    html:lang(th) .jongstit > #sec8 .sec8-desc,
    html:lang(en) .jongstit > #sec8 .sec8-desc{
        font-size: 16px; /*1.25%*/
    }

    /* end sec8 */

    .jongstit > #sportswear-fabric .sec9-desc{
        margin: 30px auto;
    }
    html:lang(th) .jongstit > #sportswear-fabric .sec9-title,
    html:lang(en) .jongstit > #sportswear-fabric .sec9-title{
        font-size: 19.07px; /*3.31*/
    }
    html:lang(th) .jongstit > #sportswear-fabric .sec9-sub-title,
    html:lang(en) .jongstit > #sportswear-fabric .sec9-sub-title{
        font-size: 14.28px; /*2.48%*/
    }
    html:lang(th) .jongstit > #sportswear-fabric .sec9-desc,
    html:lang(en) .jongstit > #sportswear-fabric .sec9-desc{
        font-size: 14px;
    }

    /* end sec9 */

    html:lang(th) .jongstit > #sec10 .sec10-title,
    html:lang(en) .jongstit > #sec10 .sec10-title{
        font-size: 36px;
    }
    html:lang(th) .jongstit > #sec10 .sec10-desc,
    html:lang(en) .jongstit > #sec10 .sec10-desc{
        font-size: 16px; /*1.25%*/
    }

    /* end sec10 */

    html:lang(th) .jongstit > #sec11 .sec11-desc,
    html:lang(en) .jongstit > #sec11 .sec11-desc{
        font-size: 16px; /*1.25%*/
    }

    /* end sec11 */
}
@media screen and (min-width:768px){
    .jongstit{
        --sec2-padding: 40px 0;
        --sec3-padding: 40px 0;
        --sec4-padding: 40px 0;
        --sec5-padding: 40px 0;
        --sec7-padding: 40px 0;
        --sec9-padding: 40px 0;
        --sec11-padding: 40px 0;
    }

    /* end all setting */

    html:lang(th) .jongstit > #sec1 .sec1-title,
    html:lang(en) .jongstit > #sec1 .sec1-title{
        font-size: 25.57px; /*3.33%*/
    }
    html:lang(th) .jongstit > #sec1 .sec1-sub-title,
    html:lang(en) .jongstit > #sec1 .sec1-sub-title{
        font-size: 25.57px; /*3.33%*/
    }

    /* end sec1 */

    html:lang(th) .jongstit > #sec2 .sec2-title,
    html:lang(en) .jongstit > #sec2 .sec2-title{
        font-size: 25.57px; /*3.33%*/
    }
    html:lang(th) .jongstit > #sec2 .sec2-title > span,
    html:lang(en) .jongstit > #sec2 .sec2-title > span{
        font-size: 44.31px /*5.77%*/
    }

    /* end sec2 */

    html:lang(th) .jongstit > #sec4 .sec4-title,
    html:lang(en) .jongstit > #sec4 .sec4-title{
        font-size: 25.57px; /*3.33%*/
    }
    html:lang(th) .jongstit > #sec4 .sec4-sub-title,
    html:lang(en) .jongstit > #sec4 .sec4-sub-title{
        font-size: 18px;
    }
    .jongstit > #sec4 .r1 > *{
        display: flex;
        padding: 0 15px;
    }
    .jongstit > #sec4 .sec4-list{
        padding-inline-start: 24px;
    }
    html:lang(th) .jongstit > #sec4 .sec4-list,
    html:lang(en) .jongstit > #sec4 .sec4-list{
        font-size: 16px;
    }
    .jongstit > #sec4::after{
        height: 42%;
    }

    /* end sec4 */

    html:lang(th) .jongstit > #warp-knit-fabric .sec5-title,
    html:lang(en) .jongstit > #warp-knit-fabric .sec5-title{
        font-size: 25.42px; /*3.31*/
    }
    html:lang(th) .jongstit > #warp-knit-fabric .sec5-sub-title,
    html:lang(en) .jongstit > #warp-knit-fabric .sec5-sub-title{
        font-size: 19.05px; /*2.48%*/
    }

    /* end sec5 */

    html:lang(th) .jongstit > #fleece-and-pile-fabric .sec7-title,
    html:lang(en) .jongstit > #fleece-and-pile-fabric .sec7-title{
        font-size: 25.42px; /*3.31*/
    }
    html:lang(th) .jongstit > #fleece-and-pile-fabric .sec7-sub-title,
    html:lang(en) .jongstit > #fleece-and-pile-fabric .sec7-sub-title{
        font-size: 19.05px; /*2.48%*/
    }

    /* end sec7 */

    html:lang(th) .jongstit > #sportswear-fabric .sec9-title,
    html:lang(en) .jongstit > #sportswear-fabric .sec9-title{
        font-size: 25.42px; /*3.31*/
    }
    html:lang(th) .jongstit > #sportswear-fabric .sec9-sub-title,
    html:lang(en) .jongstit > #sportswear-fabric .sec9-sub-title{
        font-size: 19.05px; /*2.48%*/
    }

    /* end sec9 */
}
@media screen and (min-width:992px){
    .jongstit{
        --sec2-padding: 60px 0;
        --sec3-padding: 60px 0;
        --sec4-padding: 60px 0;
        --sec5-padding: 60px 0;
        --sec7-padding: 60px 0;
        --sec9-padding: 60px 0;
        --sec11-padding: 60px 0;
    }

    /* end all setting */

    html:lang(th) .jongstit > #sec1 .sec1-title,
    html:lang(en) .jongstit > #sec1 .sec1-title{
        font-size: 33.03px; /*3.33%*/
    }
    html:lang(th) .jongstit > #sec1 .sec1-sub-title,
    html:lang(en) .jongstit > #sec1 .sec1-sub-title{
        font-size: 33.03px; /*3.33%*/
    }

    /* end sec1 */

    html:lang(th) .jongstit > #sec2 .sec2-desc,
    html:lang(en) .jongstit > #sec2 .sec2-desc{
        font-size: 20px; /*1.25%*/
    }
    html:lang(th) .jongstit > #sec2 .sec2-title,
    html:lang(en) .jongstit > #sec2 .sec2-title{
        font-size: 33.03px; /*3.33%*/
    }
    html:lang(th) .jongstit > #sec2 .sec2-title > span,
    html:lang(en) .jongstit > #sec2 .sec2-title > span{
        font-size: 57.24px /*5.77%*/
    }

    /* end sec2 */

    html:lang(th) .jongstit > #sec3 .sec3-desc,
    html:lang(en) .jongstit > #sec3 .sec3-desc{
        font-size: 20px; /*1.25%*/
    }

    /* end sec3 */

    html:lang(th) .jongstit > #sec4 .sec4-title,
    html:lang(en) .jongstit > #sec4 .sec4-title{
        font-size: 33.03px; /*3.33%*/
    }
    html:lang(th) .jongstit > #sec4 .sec4-sub-title,
    html:lang(en) .jongstit > #sec4 .sec4-sub-title{
        font-size: 24px;
    }
    .jongstit > #sec4::after{
        height: 34.5%;
    }
    .jongstit > #sec4 .r1 > * > .card > .card-body{
        padding: 0 15px 15px;
    }

    /* end sec4 */

    .jongstit > #warp-knit-fabric .sec5-desc{
        margin: 40px auto;
    }
    html:lang(th) .jongstit > #warp-knit-fabric .sec5-title,
    html:lang(en) .jongstit > #warp-knit-fabric .sec5-title{
        font-size: 32.84px; /*3.31*/
    }
    html:lang(th) .jongstit > #warp-knit-fabric .sec5-sub-title,
    html:lang(en) .jongstit > #warp-knit-fabric .sec5-sub-title{
        font-size: 24.60px; /*2.48%*/
    }

    /* end sec5 */

    html:lang(th) .jongstit > #sec6 .sec6-title,
    html:lang(en) .jongstit > #sec6 .sec6-title{
        font-size: 38px;
    }
    html:lang(th) .jongstit > #sec6 .sec6-desc,
    html:lang(en) .jongstit > #sec6 .sec6-desc{
        font-size: 18px; /*1.25%*/
    }

    /* end sec6 */

    .jongstit > #fleece-and-pile-fabric .sec7-desc{
        margin: 40px auto;
    }
    html:lang(th) .jongstit > #fleece-and-pile-fabric .sec7-title,
    html:lang(en) .jongstit > #fleece-and-pile-fabric .sec7-title{
        font-size: 32.84px; /*3.31*/
    }
    html:lang(th) .jongstit > #fleece-and-pile-fabric .sec7-sub-title,
    html:lang(en) .jongstit > #fleece-and-pile-fabric .sec7-sub-title{
        font-size: 24.60px; /*2.48%*/
    }

    /* end sec7 */

    html:lang(th) .jongstit > #sec8 .sec8-title,
    html:lang(en) .jongstit > #sec8 .sec8-title{
        font-size: 38px;
    }
    html:lang(th) .jongstit > #sec8 .sec8-desc,
    html:lang(en) .jongstit > #sec8 .sec8-desc{
        font-size: 18px; /*1.25%*/
    }

    /* end sec8 */

    .jongstit > #sportswear-fabric .sec9-desc{
        margin: 40px auto;
    }
    html:lang(th) .jongstit > #sportswear-fabric .sec9-title,
    html:lang(en) .jongstit > #sportswear-fabric .sec9-title{
        font-size: 32.84px; /*3.31*/
    }
    html:lang(th) .jongstit > #sportswear-fabric .sec9-sub-title,
    html:lang(en) .jongstit > #sportswear-fabric .sec9-sub-title{
        font-size: 24.60px; /*2.48%*/
    }

    /* end sec9 */

    html:lang(th) .jongstit > #sec10 .sec10-title,
    html:lang(en) .jongstit > #sec10 .sec10-title{
        font-size: 38px;
    }
    html:lang(th) .jongstit > #sec10 .sec10-desc,
    html:lang(en) .jongstit > #sec10 .sec10-desc{
        font-size: 18px; /*1.25%*/
    }

    /* end sec10 */

    html:lang(th) .jongstit > #sec11 .sec11-desc,
    html:lang(en) .jongstit > #sec11 .sec11-desc{
        font-size: 20px; /*1.25%*/
    }

    /* end sec11 */
}
@media screen and (min-width:1200px){
    .jongstit{
        --sec4-padding: 60px 0 100px;
    }

    /* end all setting */

    html:lang(th) .jongstit > #sec1 .sec1-title,
    html:lang(en) .jongstit > #sec1 .sec1-title{
        font-size: 48px; /*3.33%*/
    }
    html:lang(th) .jongstit > #sec1 .sec1-sub-title,
    html:lang(en) .jongstit > #sec1 .sec1-sub-title{
        font-size: 48px; /*3.33%*/
    }

    /* end sec1 */

    .jongstit > #sec2 .content > .group1{
        max-width: 68.11%;
    }
    html:lang(th) .jongstit > #sec2 .sec2-title,
    html:lang(en) .jongstit > #sec2 .sec2-title{
        font-size: 48px; /*3.33%*/
    }
    html:lang(th) .jongstit > #sec2 .sec2-title > span,
    html:lang(en) .jongstit > #sec2 .sec2-title > span{
        font-size: 82px /*5.77%*/
    }

    /* end sec2 */

    html:lang(th) .jongstit > #sec4 .sec4-title,
    html:lang(en) .jongstit > #sec4 .sec4-title{
        font-size: 48px; /*3.33%*/
    }

    /* end sec4 */

    html:lang(th) .jongstit > #warp-knit-fabric .sec5-title,
    html:lang(en) .jongstit > #warp-knit-fabric .sec5-title{
        font-size: 48px; /*3.31*/
    }
    html:lang(th) .jongstit > #warp-knit-fabric .sec5-sub-title,
    html:lang(en) .jongstit > #warp-knit-fabric .sec5-sub-title{
        font-size: 36px; /*2.48%*/
    }
    html:lang(th) .jongstit > #warp-knit-fabric .sec5-desc,
    html:lang(en) .jongstit > #warp-knit-fabric .sec5-desc{
        font-size: 18px; /*1.81%*/
    }

    /* end sec5 */

    html:lang(th) .jongstit > #sec6 .sec6-title,
    html:lang(en) .jongstit > #sec6 .sec6-title{
        font-size: 40px;
    }
    html:lang(th) .jongstit > #sec6 .sec6-desc,
    html:lang(en) .jongstit > #sec6 .sec6-desc{
        font-size: 20px;
    }

    /* end sec6 */

    html:lang(th) .jongstit > #fleece-and-pile-fabric .sec7-title,
    html:lang(en) .jongstit > #fleece-and-pile-fabric .sec7-title{
        font-size: 48px; /*3.31*/
    }
    html:lang(th) .jongstit > #fleece-and-pile-fabric .sec7-sub-title,
    html:lang(en) .jongstit > #fleece-and-pile-fabric .sec7-sub-title{
        font-size: 36px; /*2.48%*/
    }
    html:lang(th) .jongstit > #fleece-and-pile-fabric .sec7-desc,
    html:lang(en) .jongstit > #fleece-and-pile-fabric .sec7-desc{
        font-size: 18px; /*1.81%*/
    }

    /* end sec7 */

    html:lang(th) .jongstit > #sec8 .sec8-title,
    html:lang(en) .jongstit > #sec8 .sec8-title{
        font-size: 40px;
    }
    html:lang(th) .jongstit > #sec8 .sec8-desc,
    html:lang(en) .jongstit > #sec8 .sec8-desc{
        font-size: 20px;
    }

    /* end sec8 */

    html:lang(th) .jongstit > #sportswear-fabric .sec9-title,
    html:lang(en) .jongstit > #sportswear-fabric .sec9-title{
        font-size: 48px; /*3.31*/
    }
    html:lang(th) .jongstit > #sportswear-fabric .sec9-sub-title,
    html:lang(en) .jongstit > #sportswear-fabric .sec9-sub-title{
        font-size: 36px; /*2.48%*/
    }
    html:lang(th) .jongstit > #sportswear-fabric .sec9-desc,
    html:lang(en) .jongstit > #sportswear-fabric .sec9-desc{
        font-size: 18px; /*1.81%*/
    }

    /* end sec9 */

    html:lang(th) .jongstit > #sec10 .sec10-title,
    html:lang(en) .jongstit > #sec10 .sec10-title{
        font-size: 40px;
    }
    html:lang(th) .jongstit > #sec10 .sec10-desc,
    html:lang(en) .jongstit > #sec10 .sec10-desc{
        font-size: 20px;
    }

    /* end sec10 */
}
@media screen and (min-width:1441px){
    html:lang(th) .jongstit > #sec1 .sec1-title,
    html:lang(en) .jongstit > #sec1 .sec1-title{
        font-size: 72px; /*3.75%*/
    }
    html:lang(th) .jongstit > #sec1 .sec1-sub-title,
    html:lang(en) .jongstit > #sec1 .sec1-sub-title{
        font-size: 48px; /*2.50%*/
    }

    /* end sec1 */

    html:lang(th) .jongstit > #sec2 .sec2-desc,
    html:lang(en) .jongstit > #sec2 .sec2-desc{
        font-size: 24px; /*1.25%*/
    }
    html:lang(th) .jongstit > #sec2 .sec2-title,
    html:lang(en) .jongstit > #sec2 .sec2-title{
        font-size: 64px; /*4.50%*/
    }
    html:lang(th) .jongstit > #sec2 .sec2-title > span,
    html:lang(en) .jongstit > #sec2 .sec2-title > span{
        font-size: 109.3px /*7.69%*/
    }

    /* end sec2 */

    .jongstit > #sec3{
        background-image: url(/assets/images/leading_in_polyester_fabric/d/85-years-of-expertise.webp);
    }
    html:lang(th) .jongstit > #sec3 .sec3-desc,
    html:lang(en) .jongstit > #sec3 .sec3-desc{
        font-size: 24px; /*1.25%*/
    }
    .jongstit > #sec3 .content{
        min-height: 431px;
    }

    /* end sec3 */

    .jongstit > #sec4 .sec4-sub-title{
        position: relative;
        padding-right: 20px;
    }
    .jongstit > #sec4 .sec4-sub-title > a{
        top: 0;
        height: 100%;
    }
    .jongstit > #sec4 .sec4-sub-title > a > *{
        font-size: calc(100% + 5px);
    }

    /* end sec4 */

    .jongstit > #warp-knit-fabric .col-xl-7,
    .jongstit > #warp-knit-fabric .col-xl-5{
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
    }
    .jongstit > #warp-knit-fabric .r1{
        margin: 0;
    }
    .jongstit > #warp-knit-fabric .col-xl-7 {
        width: 58.33333333%;
    }
    .jongstit > #warp-knit-fabric .col-xl-5 {
        width: 41.66666667%;
    }
    .jongstit > #warp-knit-fabric .r1 > *:last-child > .content > .content-group > *{
        margin: auto 0 auto auto;
    }
    html:lang(th) .jongstit > #warp-knit-fabric .sec5-title,
    html:lang(en) .jongstit > #warp-knit-fabric .sec5-title{
        font-size: 48px; /*3.31*/
    }
    html:lang(th) .jongstit > #warp-knit-fabric .sec5-sub-title,
    html:lang(en) .jongstit > #warp-knit-fabric .sec5-sub-title{
        font-size: 36px; /*2.48%*/
    }
    html:lang(th) .jongstit > #warp-knit-fabric .sec5-desc,
    html:lang(en) .jongstit > #warp-knit-fabric .sec5-desc{
        font-size: 24px; /*1.65%*/
    }
    .jongstit > #warp-knit-fabric .r1 > *:first-child{
        text-align: left;
    }
    .jongstit > #warp-knit-fabric .sec5-title,
    .jongstit > #warp-knit-fabric .sec5-sub-title{
        display: block;
    }
    .jongstit > #warp-knit-fabric .sec5-sub-title{
        margin-left: 0;
    }
    .jongstit > #warp-knit-fabric .sec5-desc{
        max-width: 547px;
    }
    .jongstit > #warp-knit-fabric .img-thumb-block{
        margin: -10% auto auto -10.5%;
    }

    /* end sec5 */

    .jongstit > #sec6 .col-xl-4{
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
    }
    .jongstit > #sec6 .col-xl-4 {
        width: 33.33333333%;
    }
    .jongstit > #sec6 .sec6-title,
    .jongstit > #sec6 .sec6-desc{
        text-align: left;
    }
    .jongstit > #sec6 .sec6-desc{
        max-width: 100%;
    }
    .jongstit > #sec6 .content > .content-group{
        align-items: start;
    }
    .jongstit #sec6 .sec6-btn-group > .sec6-btn{
        padding: 12.5px 25px;
    }
    html:lang(th) .jongstit #sec6 .sec6-btn-group > .sec6-btn::after{
        bottom: calc(-100% + 12.5px);
        line-height: calc(100% + 25px);
    }
    html:lang(en) .jongstit #sec6 .sec6-btn-group > .sec6-btn::after{
        bottom: -100%;
        line-height: calc(100% + 25px);
    }
    html:lang(th) .jongstit #sec6 .sec6-btn-group > .sec6-btn,
    html:lang(en) .jongstit #sec6 .sec6-btn-group > .sec6-btn{
        font-size: 24px;
    }

    /* end sec6 */

    .jongstit > #fleece-and-pile-fabric .col-xl-7,
    .jongstit > #fleece-and-pile-fabric .col-xl-5{
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
    }
    .jongstit > #fleece-and-pile-fabric .r1{
        margin: 0;
    }
    .jongstit > #fleece-and-pile-fabric .col-xl-7 {
        width: 58.33333333%;
    }
    .jongstit > #fleece-and-pile-fabric .col-xl-5 {
        width: 41.66666667%;
    }
    .jongstit > #fleece-and-pile-fabric .r1{
        flex-direction: row;
    }
    .jongstit > #fleece-and-pile-fabric .r1 > *:first-child > .content > .content-group > *{
        margin: auto auto auto 0;
    }
    .jongstit > #fleece-and-pile-fabric .r1 > *:last-child > .content > .content-group > *{
        margin-left: auto;
    }
    .jongstit > #fleece-and-pile-fabric .sec7-title,
    .jongstit > #fleece-and-pile-fabric .sec7-sub-title,
    .jongstit > #fleece-and-pile-fabric .sec7-desc{
        text-align: right;
    }
    html:lang(th) .jongstit > #fleece-and-pile-fabric .sec7-title,
    html:lang(en) .jongstit > #fleece-and-pile-fabric .sec7-title{
        font-size: 48px; /*3.31*/
    }
    html:lang(th) .jongstit > #fleece-and-pile-fabric .sec7-sub-title,
    html:lang(en) .jongstit > #fleece-and-pile-fabric .sec7-sub-title{
        font-size: 36px; /*2.48%*/
    }
    html:lang(th) .jongstit > #fleece-and-pile-fabric .sec7-desc,
    html:lang(en) .jongstit > #fleece-and-pile-fabric .sec7-desc{
        font-size: 24px; /*1.65%*/
    }
    .jongstit > #fleece-and-pile-fabric .r1 > *:first-child{
        text-align: left;
    }
    .jongstit > #fleece-and-pile-fabric .sec7-title,
    .jongstit > #fleece-and-pile-fabric .sec7-sub-title{
        display: block;
    }
    .jongstit > #fleece-and-pile-fabric .sec7-sub-title{
        margin-left: 0;
    }
    .jongstit > #fleece-and-pile-fabric .sec7-desc{
        max-width: 547px;
    }
    .jongstit > #fleece-and-pile-fabric .img-thumb-block{
        margin: -10% -5% auto auto;
    }

    /* end sec7 */

    .jongstit > #sec8 .col-xl-4{
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
    }
    .jongstit > #sec8 .col-xl-4 {
        width: 33.33333333%;
    }
    .jongstit > #sec8 .sec8-title,
    .jongstit > #sec8 .sec8-desc{
        text-align: left;
    }
    .jongstit > #sec8 .sec8-desc{
        max-width: 100%;
    }
    .jongstit > #sec8 .content > .content-group{
        align-items: start;
    }
    .jongstit #sec8 .sec8-btn-group > .sec8-btn{
        padding: 12.5px 25px;
    }
    html:lang(th) .jongstit #sec8 .sec8-btn-group > .sec8-btn::after{
        bottom: calc(-100% + 12.5px);
        line-height: calc(100% + 25px);
    }
    html:lang(en) .jongstit #sec8 .sec8-btn-group > .sec8-btn::after{
        bottom: -100%;
        line-height: calc(100% + 25px);
    }
    html:lang(th) .jongstit #sec8 .sec8-btn-group > .sec8-btn,
    html:lang(en) .jongstit #sec8 .sec8-btn-group > .sec8-btn{
        font-size: 24px;
    }

    /* end sec8 */

    .jongstit > #sportswear-fabric .col-xl-7,
    .jongstit > #sportswear-fabric .col-xl-5{
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
    }
    .jongstit > #sportswear-fabric .r1{
        margin: 0;
    }
    .jongstit > #sportswear-fabric .col-xl-7 {
        width: 58.33333333%;
    }
    .jongstit > #sportswear-fabric .col-xl-5 {
        width: 41.66666667%;
    }
    .jongstit > #sportswear-fabric .r1 > *:last-child > .content > .content-group > *{
        margin: auto 0 auto auto;
    }
    html:lang(th) .jongstit > #sportswear-fabric .sec9-title,
    html:lang(en) .jongstit > #sportswear-fabric .sec9-title{
        font-size: 48px; /*3.31*/
    }
    html:lang(th) .jongstit > #sportswear-fabric .sec9-sub-title,
    html:lang(en) .jongstit > #sportswear-fabric .sec9-sub-title{
        font-size: 36px; /*2.48%*/
    }
    html:lang(th) .jongstit > #sportswear-fabric .sec9-desc,
    html:lang(en) .jongstit > #sportswear-fabric .sec9-desc{
        font-size: 24px; /*1.65%*/
    }
    .jongstit > #sportswear-fabric .r1 > *:first-child{
        text-align: left;
    }
    .jongstit > #sportswear-fabric .sec9-title,
    .jongstit > #sportswear-fabric .sec9-sub-title{
        display: block;
    }
    .jongstit > #sportswear-fabric .sec9-sub-title{
        margin-left: 0;
    }
    .jongstit > #sportswear-fabric .sec9-desc{
        max-width: 547px;
    }
    .jongstit > #sportswear-fabric .img-thumb-block{
        margin: -10% auto auto -10.5%;
    }

    /* end sec9 */

    .jongstit > #sec10 .col-xl-4{
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
    }
    .jongstit > #sec10 .col-xl-4 {
        width: 33.33333333%;
    }
    .jongstit > #sec10 .sec10-title,
    .jongstit > #sec10 .sec10-desc{
        text-align: left;
    }
    .jongstit > #sec10 .sec10-desc{
        max-width: 100%;
    }
    .jongstit > #sec10 .content > .content-group{
        align-items: start;
    }
    .jongstit #sec10 .sec10-btn-group > .sec10-btn{
        padding: 12.5px 25px;
    }
    html:lang(th) .jongstit #sec10 .sec10-btn-group > .sec10-btn::after{
        bottom: calc(-100% + 12.5px);
        line-height: calc(100% + 25px);
    }
    html:lang(en) .jongstit #sec10 .sec10-btn-group > .sec10-btn::after{
        bottom: -100%;
        line-height: calc(100% + 25px);
    }
    html:lang(th) .jongstit #sec10 .sec10-btn-group > .sec10-btn,
    html:lang(en) .jongstit #sec10 .sec10-btn-group > .sec10-btn{
        font-size: 24px;
    }

    /* end sec10 */

    html:lang(th) .jongstit > #sec11 .sec11-desc,
    html:lang(en) .jongstit > #sec11 .sec11-desc{
        font-size: 24px; /*1.25%*/
    }
    /* .jongstit > #sec11 .content{
        min-height: 431px;
    } */

    /* end sec11 */
}
@media screen and (min-width:1600px){
    .jongstit > #sec4 .sec4-list{
        padding-inline-start: 32px;
    }

    /* end sec4 */
}

@media screen and (max-width:1440px){
    .jongstit{
        --sec6-padding: 250px 15px 40px;
        --sec8-padding: 250px 15px 40px;
        --sec10-padding: 250px 15px 40px;
    }

    /* end all setting */

    .jongstit > #sec6{
        margin-top: -250px;
    }
    .jongstit > #sec6 > .container{
        max-width: 80%;
    }
    .jongstit > #sec6 .content{
        display: flex;
    }
    .jongstit > #sec6 .content > .content-group{
        margin: auto;
        max-width: 777px;
    }
    .jongstit > #sec6 .r1 > *:not(:last-child) .content > .content-group{
        margin-bottom: 30px !important;
    }

    /* end sec6 */

    .jongstit > #sec8{
        margin-top: -250px;
    }
    .jongstit > #sec8 > .container{
        max-width: 80%;
    }
    .jongstit > #sec8 .content{
        display: flex;
    }
    .jongstit > #sec8 .content > .content-group{
        margin: auto;
        max-width: 777px;
    }
    .jongstit > #sec8 .r1 > *:not(:last-child) .content > .content-group{
        margin-bottom: 30px !important;
    }

    /* end sec8 */

    .jongstit > #sec10{
        margin-top: -250px;
    }
    .jongstit > #sec10 > .container{
        max-width: 80%;
    }
    .jongstit > #sec10 .content{
        display: flex;
    }
    .jongstit > #sec10 .content > .content-group{
        margin: auto;
        max-width: 777px;
    }
    .jongstit > #sec10 .r1 > *:not(:last-child) .content > .content-group{
        margin-bottom: 30px !important;
    }

    /* end sec10 */
}
@media screen and (max-width:991px){
    .jongstit #sec6 .sec6-btn-group > .sec6-btn{
        padding: 10px 20px;
    }
    html:lang(th) .jongstit #sec6 .sec6-btn-group > .sec6-btn::after{
        bottom: calc(-100% + 10px);
        line-height: calc(100% + 20px);
    }
    html:lang(en) .jongstit #sec6 .sec6-btn-group > .sec6-btn::after{
        bottom: -100%;
        line-height: calc(100% + 24px);
    }
    html:lang(th) .jongstit #sec6 .sec6-btn-group > .sec6-btn,
    html:lang(en) .jongstit #sec6 .sec6-btn-group > .sec6-btn{
        font-size: 20px;
    }

    /* end sec6 */

    .jongstit #sec8 .sec8-btn-group > .sec8-btn{
        padding: 10px 20px;
    }
    html:lang(th) .jongstit #sec8 .sec8-btn-group > .sec8-btn::after{
        bottom: calc(-100% + 10px);
        line-height: calc(100% + 20px);
    }
    html:lang(en) .jongstit #sec8 .sec8-btn-group > .sec8-btn::after{
        bottom: -100%;
        line-height: calc(100% + 25px);
    }
    html:lang(th) .jongstit #sec8 .sec8-btn-group > .sec8-btn,
    html:lang(en) .jongstit #sec8 .sec8-btn-group > .sec8-btn{
        font-size: 18px;
    }

    /* end sec8 */

    .jongstit #sec10 .sec10-btn-group > .sec10-btn{
        padding: 10px 20px;
    }
    html:lang(th) .jongstit #sec10 .sec10-btn-group > .sec10-btn::after{
        bottom: calc(-100% + 10px);
        line-height: calc(100% + 20px);
    }
    html:lang(en) .jongstit #sec10 .sec10-btn-group > .sec10-btn::after{
        bottom: -100%;
        line-height: calc(100% + 25px);
    }
    html:lang(th) .jongstit #sec10 .sec10-btn-group > .sec10-btn,
    html:lang(en) .jongstit #sec10 .sec10-btn-group > .sec10-btn{
        font-size: 18px;
    }

    /* end sec10 */
}
@media screen and (max-width:767px){
    .jongstit #sec8 .sec8-btn-group > .sec8-btn{
        padding: 10px 15px;
    }
    html:lang(th) .jongstit #sec8 .sec8-btn-group > .sec8-btn::after{
        bottom: calc(-100% + 10px);
        line-height: calc(100% + 15px);
    }
    html:lang(en) .jongstit #sec8 .sec8-btn-group > .sec8-btn::after{
        bottom: calc(-100% + 11px);
        line-height: calc(100% + 20px);
    }
    html:lang(th) .jongstit #sec8 .sec8-btn-group > .sec8-btn,
    html:lang(en) .jongstit #sec8 .sec8-btn-group > .sec8-btn{
        font-size: 12px;
    }

    /* end sec8 */

    .jongstit #sec10 .sec10-btn-group > .sec10-btn{
        padding: 10px 15px;
    }
    html:lang(th) .jongstit #sec10 .sec10-btn-group > .sec10-btn::after{
        bottom: calc(-100% + 10px);
        line-height: calc(100% + 15px);
    }
    html:lang(en) .jongstit #sec10 .sec10-btn-group > .sec10-btn::after{
        bottom: calc(-100% + 11px);
        line-height: calc(100% + 20px);
    }
    html:lang(th) .jongstit #sec10 .sec10-btn-group > .sec10-btn,
    html:lang(en) .jongstit #sec10 .sec10-btn-group > .sec10-btn{
        font-size: 12px;
    }

    /* end sec10 */
}
@media screen and (max-width:575px){
    .jongstit{
        --sec6-padding: 150px 15px 40px;
        --sec8-padding: 150px 15px 40px;
        --sec10-padding: 150px 15px 40px;
    }

    /* end all setting */

    html:lang(th) .jongstit > #sec1 .sec1-title,
    html:lang(en) .jongstit > #sec1 .sec1-title{
        line-height: calc(100% + 7.5px);
    }
    html:lang(th) .jongstit > #sec1 .sec1-sub-title,
    html:lang(en) .jongstit > #sec1 .sec1-sub-title{
        line-height: calc(100% + 7.5px);
    }

    /* end sec1 */

    .jongstit > #sec2 .sec2-desc{
        line-height: calc(100% + 7.5px);
    }

    /* end sec2 */

    .jongstit > #sec3 .sec3-desc{
        line-height: calc(100% + 7.5px);
    }

    /* end sec3 */

    .jongstit > #sec4 .sec4-title{
        line-height: calc(100% + 7.5px);
    }
    .jongstit > #sec4 .sec4-sub-title{
        line-height: 100%;
    }

    /* end sec4 */

    .jongstit > #warp-knit-fabric .sec5-desc{
        line-height: calc(100% + 7.5px);
    }

    /* end sec5 */

    .jongstit > #sec6{
        margin-top: -150px;
    }
    .jongstit > #sec6 > .container{
        max-width: calc(100% - 30px);
        padding-left: 0;
        padding-right: 0;
    }
    .jongstit > #sec6 .content > .content-group{
        max-width: unset;
    }
    .jongstit > #sec6 .sec6-desc{
        line-height: calc(100% + 7.5px);
    }
    html:lang(th) .jongstit > #sec6 .sec6-title,
    html:lang(en) .jongstit > #sec6 .sec6-title{
        font-size: 19.18px;
    }
    html:lang(th) .jongstit > #sec6 .sec6-desc,
    html:lang(en) .jongstit > #sec6 .sec6-desc{
        font-size: 10px; /*1.25%*/
    }
    .jongstit > #sec6 .r1 > *:not(:last-child) .content > .content-group{
        margin-bottom: 20px !important;
    }
    .jongstit #sec6 .sec6-btn-group{
        padding: 15px 0;
    }
    .jongstit #sec6 .sec6-btn-group > .sec6-btn{
        padding: 5px 10px;
    }
    html:lang(th) .jongstit #sec6 .sec6-btn-group > .sec6-btn::after{
        bottom: calc(-100% + 5px);
        line-height: calc(100% + 10px);
    }
    html:lang(en) .jongstit #sec6 .sec6-btn-group > .sec6-btn::after{
        bottom: calc(-100% + 2px);
        line-height: calc(100% + 20px);
    }
    html:lang(th) .jongstit #sec6 .sec6-btn-group > .sec6-btn,
    html:lang(en) .jongstit #sec6 .sec6-btn-group > .sec6-btn{
        font-size: 12px;
    }

    /* end sec6 */

    .jongstit > #fleece-and-pile-fabric .sec7-desc{
        line-height: calc(100% + 7.5px);
    }

    /* end sec7 */

    .jongstit > #sec8{
        margin-top: -150px;
    }
    .jongstit > #sec8 > .container{
        max-width: calc(100% - 30px);
        padding-left: 0;
        padding-right: 0;
    }
    .jongstit > #sec8 .content > .content-group{
        max-width: unset;
    }
    .jongstit > #sec8 .sec8-desc{
        line-height: calc(100% + 7.5px);
    }
    html:lang(th) .jongstit > #sec8 .sec8-title,
    html:lang(en) .jongstit > #sec8 .sec8-title{
        font-size: 19.18px;
    }
    html:lang(th) .jongstit > #sec8 .sec8-desc,
    html:lang(en) .jongstit > #sec8 .sec8-desc{
        font-size: 10px; /*1.25%*/
    }
    .jongstit > #sec8 .r1 > *:not(:last-child) .content > .content-group{
        margin-bottom: 20px !important;
    }
    .jongstit #sec8 .sec8-btn-group{
        padding: 15px 0;
    }
    .jongstit #sec8 .sec8-btn-group > .sec8-btn{
        padding: 5px 10px;
    }
    html:lang(th) .jongstit #sec8 .sec8-btn-group > .sec8-btn::after{
        bottom: calc(-100% + 5px);
        line-height: calc(100% + 10px);
    }
    html:lang(en) .jongstit #sec8 .sec8-btn-group > .sec8-btn::after{
        bottom: calc(-100% + 1px);
        line-height: calc(100% + 20px);
    }
    html:lang(th) .jongstit #sec8 .sec8-btn-group > .sec8-btn,
    html:lang(en) .jongstit #sec8 .sec8-btn-group > .sec8-btn{
        font-size: 12px;
    }

    /* end sec8 */

    .jongstit > #sportswear-fabric .sec9-desc{
        line-height: calc(100% + 7.5px);
    }

    /* end sec9 */

    .jongstit > #sec10{
        margin-top: -150px;
    }
    .jongstit > #sec10 > .container{
        max-width: calc(100% - 30px);
        padding-left: 0;
        padding-right: 0;
    }
    .jongstit > #sec10 .content > .content-group{
        max-width: unset;
    }
    .jongstit > #sec10 .sec10-desc{
        line-height: calc(100% + 7.5px);
    }
    html:lang(th) .jongstit > #sec10 .sec10-title,
    html:lang(en) .jongstit > #sec10 .sec10-title{
        font-size: 19.18px;
    }
    html:lang(th) .jongstit > #sec10 .sec10-desc,
    html:lang(en) .jongstit > #sec10 .sec10-desc{
        font-size: 10px; /*1.25%*/
    }
    .jongstit > #sec10 .r1 > *:not(:last-child) .content > .content-group{
        margin-bottom: 20px !important;
    }
    .jongstit #sec10 .sec10-btn-group{
        padding: 15px 0;
    }
    .jongstit #sec10 .sec10-btn-group > .sec10-btn{
        padding: 5px 10px;
    }
    html:lang(th) .jongstit #sec10 .sec10-btn-group > .sec10-btn::after{
        bottom: calc(-100% + 5px);
        line-height: calc(100% + 10px);
    }
    html:lang(en) .jongstit #sec10 .sec10-btn-group > .sec10-btn::after{
        bottom: calc(-100% + 1px);
        line-height: calc(100% + 20px);
    }
    html:lang(th) .jongstit #sec10 .sec10-btn-group > .sec10-btn,
    html:lang(en) .jongstit #sec10 .sec10-btn-group > .sec10-btn{
        font-size: 12px;
    }

    /* end sec10 */

    .jongstit > #sec11 .sec11-desc{
        line-height: calc(100% + 11px);
    }

    /* end sec11 */
}
@media screen and (max-width:431px){
    .jongstit{
        --sec4-padding: 20px 0;
        --sec6-padding: 100px 15px 40px;
        --sec8-padding: 100px 15px 40px;
        --sec10-padding: 100px 15px 40px;
    }

    /* end all setting */

    html:lang(th) .jongstit > #sec4 .sec4-sub-title,
    html:lang(en) .jongstit > #sec4 .sec4-sub-title{
        font-size: 8px;
    }
    .jongstit > #sec4 .sec4-list{
        padding-inline-start: 12px;
        line-height: calc(100% + 5px);
    }
    html:lang(th) .jongstit > #sec4 .sec4-list,
    html:lang(en) .jongstit > #sec4 .sec4-list{
        font-size: 7px;
    }

    /* end sec4 */

    .jongstit > #sec6{
        margin-top: -100px;
    }
    html:lang(th) .jongstit #sec6 .sec6-btn-group > .sec6-btn,
    html:lang(en) .jongstit #sec6 .sec6-btn-group > .sec6-btn{
        font-size: 11px;
    }

    /* end sec6 */

    .jongstit > #sec8{
        margin-top: -100px;
    }
    .jongstit #sec8 .sec8-btn-group > .sec8-btn{
        padding: 5px 10px;
    }
    html:lang(th) .jongstit #sec8 .sec8-btn-group > .sec8-btn::after{
        bottom: calc(-100% + 5px);
        line-height: calc(100% + 10px);
    }
    html:lang(en) .jongstit #sec8 .sec8-btn-group > .sec8-btn::after{
        bottom: calc(-100% + 10px);
        line-height: calc(100% + 15px);
    }
    html:lang(th) .jongstit #sec8 .sec8-btn-group > .sec8-btn,
    html:lang(en) .jongstit #sec8 .sec8-btn-group > .sec8-btn{
        font-size: 8px;
    }

    /* end sec8 */

    .jongstit > #sec10{
        margin-top: -100px;
    }
    .jongstit #sec10 .sec10-btn-group > .sec10-btn{
        padding: 5px 10px;
    }
    html:lang(th) .jongstit #sec10 .sec10-btn-group > .sec10-btn::after{
        bottom: calc(-100% + 5px);
        line-height: calc(100% + 10px);
    }
    html:lang(en) .jongstit #sec10 .sec10-btn-group > .sec10-btn::after{
        bottom: calc(-100% + 10px);
        line-height: calc(100% + 15px);
    }
    html:lang(th) .jongstit #sec10 .sec10-btn-group > .sec10-btn,
    html:lang(en) .jongstit #sec10 .sec10-btn-group > .sec10-btn{
        font-size: 8px;
    }

    /* end sec10 */
}
@media screen and (max-width:303px){
    html:lang(th) .jongstit > #sec4 .sec4-sub-title,
    html:lang(en) .jongstit > #sec4 .sec4-sub-title{
        font-size: 6px;
    }
    html:lang(th) .jongstit > #sec4 .sec4-list,
    html:lang(en) .jongstit > #sec4 .sec4-list{
        font-size: 5px;
    }

    /* end sec4 */

    .jongstit #sec8 .sec8-btn-group > .sec8-btn{
        padding: 4px 8px;
    }
    html:lang(th) .jongstit #sec8 .sec8-btn-group > .sec8-btn::after{
        bottom: calc(-100% + 4px);
        line-height: calc(100% + 8px);
    }
    html:lang(en) .jongstit #sec8 .sec8-btn-group > .sec8-btn::after{
        bottom: calc(-100% + 10px);
        line-height: calc(100% + 15px);
    }
    html:lang(th) .jongstit #sec8 .sec8-btn-group > .sec8-btn,
    html:lang(en) .jongstit #sec8 .sec8-btn-group > .sec8-btn{
        font-size: 7px;
    }

    /* end sec8 */

    .jongstit #sec10 .sec10-btn-group > .sec10-btn{
        padding: 4px 8px;
    }
    html:lang(th) .jongstit #sec10 .sec10-btn-group > .sec10-btn::after{
        bottom: calc(-100% + 4px);
        line-height: calc(100% + 8px);
    }
    html:lang(en) .jongstit #sec10 .sec10-btn-group > .sec10-btn::after{
        bottom: calc(-100% + 10px);
        line-height: calc(100% + 15px);
    }
    html:lang(th) .jongstit #sec10 .sec10-btn-group > .sec10-btn,
    html:lang(en) .jongstit #sec10 .sec10-btn-group > .sec10-btn{
        font-size: 7px;
    }

    /* end sec10 */
}

@keyframes heartbeat {
  0%, 100% {
    transform: scale(1);
  }
  14% {
    transform: scale(1.1);
  }
  28% {
    transform: scale(1);
  }
  42% {
    transform: scale(1.1);
  }
  70% {
    transform: scale(1);
  }
}