/*############################ default ###################################*/
.visible-w1024{display: none;}
.visible-w991{display: none;}
.visible-w375{display: none;}
.visible-w360{display: none;}

.row-0{margin: 0px;}
.row-0 > div{padding: 0px;}

.row-20{margin: 0 -10px;}
.row-20 > div{padding: 0 10px;}

.row-flex{display: flex; flex-wrap: wrap;}
.row-flex > div{float: none;}
.row-flex > .col{ flex-basis: 0;-webkit-box-flex: 1;flex-grow: 1;max-width: 100%;}
.row-flex > .col-auto{-webkit-box-flex: 0;flex: 0 0 auto; width: auto; max-width: none;}
.row-flex > .col-12 {-webkit-box-flex: 0;flex: 0 0 100%;max-width: 100%;}


/*############################ main ###################################*/
.main{background-image: linear-gradient(90deg, rgba(1,162,139,1) 0%, rgba(16,193,88,1) 100%); position: relative;}
.main:before{content: ''; position: absolute; z-index: 0; bottom: 0; left: 0; width: 100%; height: 300px;
    background-image: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}
.main:after{content: ''; position: absolute; z-index: 0; top: 0; left: 0; bottom: 0; right: 0;
    background-image: url(../img-revamp-help/bg.png); background-size: contain;
    background-position: top right; background-repeat: no-repeat;
}
.main > section{position: relative; z-index: 1;}
.main .sc-box{padding-top: 45px; padding-bottom: 100px;}
.main .form-input { height: 50px; line-height: 48px; border: 1px solid #00A94F; display: block; padding: 0 15px;
    font-family: 'sukhumvittadmai-bold'; font-size: 16px; color: #00A94F; border-radius: 25px;
}
.main .select:after{height: 48px;line-height: 48px;font-size: 16px;}


/*############################ head-graphic ###################################*/
.head-graphic{background-image: url(../img-revamp-help/object-desktop.png);
    background-position: center; background-repeat: repeat-x; background-size: cover;
    width: 100%; height: 68px; position: relative; z-index: 1;
}


/*########################### breakpoints ###################################*/
.hl-faq{background-image: none; padding-bottom: 0;}
.hl-faq .heading{margin-bottom: 30px; text-align: center;}
.hl-faq ul.menu-list.menu-faq{padding-top: 0; text-align: center; margin: 0 -15px;}
.hl-faq .menu-list li{margin: 0; padding: 0 15px; font-size: 20px !important;}
.hl-faq .mb-10{margin-bottom: 20px;}
.hl-faq .select{max-width: 900px; margin: 0 auto;}

.hl-faq h2,
.hl-faq h4{
    font-size: 20px;
    color: #fff;
}




/*########################### sc-faq ###################################*/
.accordion-faq{position: relative; max-width: 900px; margin: 0 auto;}
.accordion-faq .accordion{border-radius: 10px; box-shadow: 0 0 4px rgba(0, 0, 0, 0.3); overflow: hidden;}
.accordion-faq .accordion + .accordion{margin-top: 30px;}
.accordion-faq .accordion-title{padding: 20px 60px 20px 30px; background-color: #fff;}
.accordion-faq .accordion-title:after {content: "+"; font-family: 'sukhumvittadmai-bold';font-size: 40px; right: 24px; top: 12px; transform: none;}
.accordion-faq .accordion-title.active:after{content: "-"; font-size: 50px; top: 6px; right: 26px;}
.accordion-faq .accordion-content .wrap.-setpd{padding: 20px 30px;}
.accordion-faq .accordion-content .wrap {padding: 20px 60px 20px 30px; background-color: #E5FFF1; color: #333333;}
.accordion-faq .accordion-content .wrap p{margin-bottom: 10px;}
.accordion-faq .accordion-content .wrap p:last-child{margin-bottom: 0;}
.accordion-faq .accordion-content .inner-list{margin-top: 15px;}
.accordion-faq .accordion-content .inner-list > li{list-style: decimal;}
.accordion-faq .accordion-content .text-note{color: #333;}
.accordion-faq .action{display: inline-block; vertical-align: middle; margin-left: 10px; text-align: center;}
.accordion-faq h3{
    font-size: 20px;
}


/*########################### breakpoints ###################################*/
@media (max-width: 1440px){
}

@media (max-width: 1199px) /*check 1024*/{
    .hidden-w1024{display: none;}
    .visible-w1024{display: block;}
}

@media (max-width: 991px) {
    .hidden-w991{display: none;}
    .visible-w991{display: block;}
}

@media (max-width: 767px) {
    .main:after{background-image: url(../img-revamp-help/bg-m.png);}
    .main .sc-box {padding-top: 30px;padding-bottom: 50px;}

    .head-graphic{background-image: url(../img-revamp-help/object-m.png);height: 40px;}

    .accordion-faq .accordion + .accordion {margin-top: 20px;}
    .accordion-faq .accordion-title {padding: 15px 30px 15px 15px;}
    .accordion-faq .accordion-title:after { font-size: 30px; right: 9px;top: 12px;}
    .accordion-faq .accordion-title.active:after { content: "-"; font-size: 36px;top: 7px;right: 12px;}
    .accordion-faq .accordion-content .wrap{padding: 15px 30px 15px 15px;}
    .accordion-faq .accordion-content .wrap.-setpd{padding: 15px;}
    .accordion-faq .action{display: block; margin-left: 0; margin-top: 10px; text-align: left;}
}

@media (max-width: 375px) {
    .visible-w375{display: block;}
    .hidden-w375{display: none;}

}
@media (max-width: 360px) {
    .visible-w360{display: block;}
    .hidden-w360{display: none;}
}