#section-franchise{ background: url('../img/franchise/franchise/background-franchise.png') no-repeat top left;  position: relative; z-index: 0;  background-size: 100%;/*padding:100px 0% 100px 0%;*/}
#section-franchise-facility{background: #f2ebe4; position: relative; z-index: 0;  background-size: cover; padding:75px 10% 75px 10%;}
#section-franchise-facility-mobile{background: #f2ebe4; position: relative; z-index: 0;  overflow: hidden; background-size: cover; padding: 50px 5% 25px 5%; display:none;}
#section-franchise-facility-2{background: #ffcc00; position: relative; z-index: 0;  background-size: cover; padding:75px 10% 75px 10%;}
#section-franchise-facility-2-mobile{background: #ffcc00; position: relative; z-index: 0;  overflow: hidden; background-size: cover;  padding: 50px 5% 100px 5%; display:none;}
#section-franchise-budget{background:white; position:relative;  z-index: 0;  background-size: cover; padding:0px 0% 0px 0%; overflow-x:hidden; color:black;}
#section-franchise-budget-bottom-mobile{background: #f2ebe4; position:relative;  z-index: 0;  background-size: cover; padding:25px 0% 25px 0%; overflow-x:hidden; display:none;}
#section-franchise-join{background: url('../img/franchise/franchisejoin/background-gray.png') no-repeat top left;  position: relative; z-index: 0;  background-size: cover;  padding: 100px 5% 250px 5%;}
#section-franchise-join-2{background:#ffffff no-repeat top left; position:relative; z-index:0; background-size:cover; height:180px;    padding: 0px 5% 0px 5%;}
#section-franchise-join-mobile{background: #f2ebe4;  position: relative; z-index: 0;  background-size: cover;  padding: 100px 0% 0px 0%; display:none;}
#section-franchise-join-2-mobile{background:#ffffff no-repeat top left; position:relative; z-index:0; background-size:cover; padding: 0px 5% 150px 5%; display:none;}
#section-franchise-faq{background: #ffffff;  position: relative; z-index: 0;  background-size: cover; padding:0px 0% 0px 0%;}
#section-franchise-faq-mobile{background: #ffffff;  position: relative; z-index: 0;  overflow: hidden; background-size: cover; padding: 75px 0% 75px 0%; display:none;}
#section-masterfranchise-who{background: #f2ebe4 no-repeat top left; position: relative; z-index: 0;  background-size: cover; padding:75px 10% 75px 10%;}
#section-masterfranchise-who-mobile{background: #f2ebe4 no-repeat top left; position: relative; z-index: 0; overflow:hidden;  background-size: cover; padding:50px 5% 50px 5%; display:none;}
#section-master-condition{background: #f8f2ed no-repeat top left; position: relative; z-index: 0;  background-size: cover; padding:75px 10% 75px 10%;}
#section-master-condition-mobile {background: #f8f2ed no-repeat top left;position: relative;z-index: 0; overflow:hidden; background-size: cover;padding: 50px 5% 50px 5%; display:none;}
#section-master-facility{background: #ffffff no-repeat top left; position: relative; z-index: 0;  background-size: cover; padding:75px 10% 200px 10%;}
#section-master-facility-mobile{background: #ffffff no-repeat top left; position: relative; z-index: 0;  overflow: hidden; background-size: cover; padding:50px 0% 175px 0%;display:none;}
#section-master-facility-information{background: #ffcc00 no-repeat top left; position: relative; z-index: 0;  background-size: cover; padding: 75px 10% 0px 10%;}
#section-master-facility-information-mobile{background: #ffcc00 no-repeat top left; position: relative; z-index: 0;  background-size: cover; padding: 50px 5% 0px 5%; display:none;}
#section-masterfranchise-howto{background: #f2ebe4; position: relative; z-index: 0;  background-size: cover; padding:75px 10% 150px 10%;}
#section-masterfranchise-howto-mobile{background: #f2ebe4; position: relative; z-index: 0;  background-size: cover; padding:50px 5% 200px 5%; display:none;}
#section-howto-interest{background: #ffcc00; position: relative; z-index: 0;  background-size: cover; padding:75px 5% 75px  5%;}
#section-howto-interest-mobile{background: #ffcc00; position: relative; z-index: 0;  background-size: cover;  padding:50px 5% 55px  5%; display:none;}
#section-masterfranchise-budget-1{background: url('../img/franchise/masterfranchisebudget/background-black.png') no-repeat top left; position: relative; z-index: 0;  background-size: cover; padding:75px 10% 150pX 10%;}
#section-masterfranchise-budget-2{background: url('../img/franchise/masterfranchisebudget/background-yellow.png')no-repeat top left; position: relative; z-index: 0;  background-size: cover;    padding: 50px 5% 50px 5%;}
.howto-interest-container{background: url('../img/franchise/masterfranchisehowto/background-black.png')no-repeat top left;position: relative; z-index: 0;  background-size: cover; padding: 125px 5% 125px 5%; top: -220px;}
.franchise-list-button{position:absolute; top:0px;color:white;padding:5%;}
.franchise-banner-text-yellow{font-family:'touchebold'; font-size:43px; color:#ffcc00;}
.franchise-banner-text-white{font-family:'gibsonregular'; font-size:17px; color:#ffffff;}
.franchise-mt-2{margin-top:2%;}
.masterfranchise-mb-5{margin-bottom:5%;}
.masterfranchise-mt-3{margin-top: 3%;}
.masterfranchise-mt-8{margin-top:8%;}
.howto-row-2{margin: auto; width:66%;}
.banner-image-left-franchise {
    width: 57%;
    top: -102px;
    position: relative;
    left: 0;
}

.banner-image-right-franchise{
    width: 71%;
    position: absolute;
    right: 0;
    top: -115px;
}

.franchise-mb-3{margin-bottom:3%;}
.franchise-tipe-banner-content {
    position: absolute;
    right: 140px;
    top: 80px;
    width: 33%;
}

.franchise-faq-banner-content {
    position: absolute;
    right: 140px;
    top: 140px;
    width: 33%;
}

.franchise-title-black{font-family:'touchebold'; font-size:43px; color:#2e2d2c;}

.franchise-banner-title-black {
    font-family: 'touchesemibold';
    font-size: 12px;
    color: #2e2d2c;
    margin-left: 2%;
    letter-spacing: 0.7px;
}

.franchise-banner-title-text{
    font-family:'toucheregular';
    font-size :42px;
    color:#2e2d2c;
}

.franchise-content{
    width:50%;
    float:left;
    padding: 5% 10% 5% 10%;
}

.franchise-content-2{
    text-align:center;
    min-height:350px; 
}

.franchise-indonesia-text{
    font-family:'touchebold'; 
    font-size:29px; 
    color:#ffcc00;
    margin-top: 5%;
}

.franchise-text{
    font-family:'gibsonregular'; 
    font-size:18px; 
    color: #ffffff;
}

.master-franchise{
    font-family:'touchebold'; 
    font-size:29px; 
    color:#2e2d2c;
    margin-top: 5%;
}

.master-franchise-text{
    font-family:'gibsonregular'; 
    font-size:18px; 
    color:#2e2d2c;
}

.franchise-button-content{
    float:left;
    width:50%; 
    padding: 10% 10% 14% 10%;
}
.button-franchise{
    margin-top: 20px;
    background: url('../img/franchise/franchise/button-yellow.png') no-repeat;
    width: 340px;
    height: 50px;
    padding: 2% 3% 3% 14%;
    text-align: left;
}

.button-franchise a{
    font-family: 'touchebold';
    font-size: 11px;
    color: #2e2d2c;
}

.button-master-franchise{
    margin-top: 20px;
    background: url('../img/franchise/franchise/button-black.png') no-repeat;
    width: 370px;
    height: 50px;
    padding: 2% 3% 3% 14%;
    text-align: left;
}

.button-master-franchise a{
    font-family: 'touchebold';
    font-size: 11px;
    color: #ffcc00;
}



.banner-image-left-franchisefacility {
    width: 100%;
    top: -102px;
    position: relative;
    left: 0;
}

.banner-image-right-franchisefacility {
    width: 71%;
    position: absolute;
    right: 0;
    top: -115px;
}

.btn-facility {
    margin-top: 20px;
    background: url('../img/franchise/franchisefacility/list-button-active.png') no-repeat;
    background-size: contain;
    width: 335px;
    min-height: 50px;
    padding: 3% 3% 3% 15%;
    text-align: left;
    font-family: 'touchebold';
    font-size: 11px;
    color: #2e2d2c;
}

/* .btn-facility a{
 
} */

.btn-facility-nonactive{
    margin-top: 20px;
    background: url('../img/franchise/franchisefacility/list-button.png') no-repeat;
    background-size:contain;
    width: 335px;
    
    min-height: 50px;
    padding: 3% 3% 3% 15%;
    text-align: left;
    font-family: 'touchebold';
    font-size: 11px;
    color: #ffcc00;
   
}

.btn-facility-nonactive a{
    font-family: 'touchebold';
    font-size: 11px;
    /* color: #ffcc00; */
    color: #2e2d2c;
} 

.btn-facility-nonactive:hover{
    margin-top: 20px;
    background: url('../img/franchise/franchisefacility/list-button-active.png') no-repeat;
    background-size:contain;
    width: 335px;
    height: 50px;
    padding: 3% 3% 3% 15%;
    text-align: left;
    font-family: 'touchebold';
    font-size: 11px;
    color: #2e2d2c;
    cursor:pointer;
}

/* .btn-facility-nonactive a:hover{
    
} */

.franchise-banner-title-white {
    font-family: 'touchesemibold';
    font-size: 12px;
    color: #ffffff;
    margin-left: 2%;
    letter-spacing: 0.7px;
}

.facility-header-mobile{border-bottom: 2px solid #9f9d9b; padding-bottom: 5%; margin-bottom: 5%;}
.facility-mobile-item{margin-bottom:5%;}
.border-mobile-facility-separator{
    background: url('../img/franchise/franchisefacility/border-bottom.png') no-repeat;
    background-size: cover;
    width: 100%;
    height:10px;
    text-align: center;
    margin: 0 auto;
}
.border-facility-separator{
    margin-top: 3%;
    margin-bottom: 3%;
}

.border-end-facility-separator{
    margin-top: 5%;
    margin-bottom: 10%;

}

ul.list-facility {
    list-style-image: url('../img/franchise/franchisefacility/pointer.png');
    font-family:'gibsonregular';
    font-size:17px;
    color:#4a4a49;
    /* padding-right: 10%; */
    
}

ul.list-facility li{
    margin: 0px 0px 2px -21px;
    padding-left: 3%;
}

.button-facility-here {
    margin-top: 20px;
    background: url('../img/franchise/franchisefacility/button-black.png') no-repeat;
    width: 160px;
    height: 50px;
    padding: 3% 3% 3% 3%;
    text-align: center;
    font-family: 'touchebold';
    font-size: 11px;
    color: #ffcc00;
    -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;
}

.button-facility-here:hover{opacity:0.7;}


.background-budget-white{width:100%; padding: 50px 0% 50px 0%; background:#ffffff;}
.background-budget-gray{width:50%; height: 1460px; float:left; padding: 100px 0% 100px 0%; background:#f2ebe4;}
.background-budget-yellow{width:50%;float:left; height: 1460px; padding: 100px 0% 100px 0%; background:#ffcc00;}
.budget-pos-relative{position:relative;    left: -15px;}
.budgetcontent-left{width:50%; float:left; min-height: 400px;}
.budgetcontent-right{width:50%; float:left; min-height: 400px;}
.budgetcontent-left-mobile{width:100%; float:left; min-height: 100px; display:none;}
.budgetcontent-right-mobile{width:100%; float:left; min-height: 400px;display:none;}
.budget-padding-1{padding: 15% 5% 15% 10%;}
.budget-number-font{
    background: url('../img/franchise/franchisebudget/number-content.png') no-repeat;
    width: 40px;
    height: 44px;
    background-size: cover;
    position: relative;
    font-family: 'gibsonbold_italic';
    font-size: 15px;
    color: #ffcc00;
    top: 10px;
    left: 15px;
    padding-top: 8px;
    text-align: center;
}
.number-content-1{width:10%;float:left;}
.budget-container-value{position:absolute;width:20%; font-family:'gibsonbold_italic'; font-size:27px; color:#ffcc00; top: 18px;left: 21px; z-index:1;}
.budget-container-value-2 {
    position: absolute;
    width: 20%;
    text-align: center;
    font-family: 'gibsonbold_italic';
    font-size: 27px;
    color: #ffcc00;
    top: 15px;
    left: 18px;
}
.budget-container-value-3 {
    position: absolute;
    width: 20%;
    text-align: center;
    font-family: 'gibsonbold_italic';
    font-size: 27px;
    color: #ffcc00;
    top: 15px;
    left: 26px;
}



.budget-container-name{width:33%;float:left;font-family:'touchebold'; font-size:23px; color:#2e2d2c; padding-left: 10px;}
.budget-container-name-2 {
    position: absolute;
    width: 20%;
    font-family: 'gibsonbold_italic';
    font-size: 27px;
    color: #ffcc00;
    top: 18px;
    left: 21px;
}

.budget-container-name-2-small {
    position: absolute;
    width: 20%;
    font-family: 'gibsonbold_italic';
    font-size: 27px;
    color: #ffcc00;
    top: 19px;
    left: 30px;
}


.budget-container-name-3{width:75%; float:left; margin-left:5%;font-family:'touchebold'; font-size:23px; color:#2e2d2c;}
.line-bottom-budget{
    background: url('../img/franchise/franchisebudget/border-bottom.png') no-repeat;
    width: 100%;
    height: 2px;
    background-size: cover;
}
.million-text {
    font-family: 'gibsonbold_italic';
    font-size: 14px;
    color: #ffcc00;
    position: relative;
    left: 10px;
    top: -20px;
}

html[lang="en_EN"] .million-text{
    font-family: 'gibsonbold_italic';
    font-size: 14px;
    color: black;
    position: relative;
    left: 0px;
    top: -20px;
}
.million-text-2 {
    font-family: 'gibsonbold_italic';
    font-size: 14px;
    color: #ffcc00;
    position: relative;
    left: 0px;
    top: -20px;
}
.million-text-3 {
    font-family: 'gibsonbold_italic';
    font-size: 14px;
    color: #ffcc00;
    position: relative;
    left: -40px;
    top: 15px;
}

.million-text-3-small {
    font-family: 'gibsonbold_italic';
    font-size: 14px;
    color: #ffcc00;
    position: relative;
    left: -32px;
    top: 15px;
    
}
.value-circle-content{
    width: 33%;
    float: left;
    position: relative;
    top: -15px;
    left: 15px;
}
.value-circle-position{position:relative; top:-10px;}



.regular-content-left{width:50%;float:left;padding-left: 5%;padding-right: 8%;}
.syariah-content-right{width:50%;float:left; padding-left: 5%; padding-right: 8%;}
.budget-table-list-left{width:60%; float:left;}
.budget-table-list-right{width:40%; float:left; text-align:right; padding-top: 1%; padding-bottom: 1%;}
.budget-list-text{font-family:'gibsonregular'; font-size:16px; color:#3c3c3b; margin-top:2%; margin-bottom:2%;}
.budget-total-spend-text{width:50%; float:left;text-align:left;}
.budget-currency-spend-text{width:50%; float:left; text-align:right;}
.budget-img-big{min-height: 500px; float:left; width:100%;  margin-bottom: 5%;    position: relative; }
.budget-img-small{margin: 0 auto;text-align: center;}
.budget-position-circle-2{ background: url('../img/franchise/franchisebudget/value-circle.png') no-repeat; width:95px; height: 95px; background-size:cover; position:absolute;z-index:1;top: 65px;right: 25px;}

.budget-position-circle-2-small{
    background: url('../img/franchise/franchisebudget/value-circle.png') no-repeat;
    width: 95px;
    height: 95px;
    background-size: cover;
    position: absolute;
    z-index: 1;
    top: 20px;
    right: 75px;
}
.relative-index-1{position:relative;z-index:1;}

.payback-period-text{font-size:14px; font-family:'touchebold'; color:#2e2d2c; letter-spacing: 0.7px;}
.payback-period-value{font-size:40px; font-family:'touchebold'; color:#f2ebe4;}
.payback-period-value-yellow{font-size:40px; font-family:'touchebold'; color:#f4b000;}
.budget-container-description{width:70%; float:left; font-size:16px; font-family:'gibsonregular'; color:#2e2d2c;}

.provision-content-left{width:30%; float:left;}
.provision-img-left{width:30%; float:left;}
.provision-content-text{width:70%; float:left;}
.provisions-text{font-family:'touchebold'; font-size:14px; color:#2e2d2c;}
.provisions-text-2{font-family:'gibsonitalic'; font-size:14px; color:#2e2d2c;}
.provisions-list-left{width:10%; float:left;}
.provisions-list-right{width:90%; float:left;}
.budget-header-yellow-left{width:50%; float:left;}
.budget-header-yellow-right{width:50%; float:left;}
.budget-header-gray-left{width:50%; float:left;}
.budget-header-gray-right{width:50%; float:right;text-align: right;}
.img-yellow-container{min-height: 400px; float:left; width:100%; margin-bottom: 5%;}
.number-content-2{float:left; width:20%;}
.mt-5-mb-5{
    /* margin-top:5%; */
    margin-bottom:5%;
}
.mh-420{min-height: 420px;}
.budget-pointer-marker-position{width:30%; float:left;text-align:right}
.flex-background-gray{display: flex; align-content: space-between; flex-wrap: wrap; flex-direction: row; padding: 75px 0% 100px 0%; background:#f2ebe4;}
.flex-background-yellow{display: flex; align-content: space-between; flex-wrap: wrap; flex-direction: row; padding: 75px 0% 100px 0%; background:#ffcc00;}
.flex-content{flex: 50; padding-left: 5%;padding-right: 8%;}
.background-gray-header-left{min-height: 400px; float:left; width:50%;}
.background-gray-header-right{min-height:400px; float:left; width:50%; padding-left: 5%;padding-top: 40%;}
.container-value-gray-position{position:relative;z-index:1;top:88px;right:-175px;}
.button-franchise-regular{
    background: url('../img/franchise/franchisebudget/button-regular-syariah.png') no-repeat;
    width: 160px;
    height: 50px;
    padding: 1% 3% 1% 3%;
    text-align: center;
    font-family: 'touchebold';
    font-size: 13px;
    color: #ffcc00;
}

.button-franchise-syariah{
    background: url('../img/franchise/franchisebudget/button-regular-syariah.png') no-repeat;
    width: 160px;
    height: 50px;
    padding: 1% 3% 1% 3%;
    text-align: center;
    font-family: 'touchebold';
    font-size: 13px;
    color: #ffcc00;
}

.income-budget{
    background: url('../img/franchise/franchisebudget/header-yellow.png') no-repeat;
    width: 100%;
    height: 50px;
    padding: 3% 3% 2% 3%;
    padding-top: 14px;
    text-align: left;
    font-family: 'touchebold';
    font-size: 14px;
    color: #2e2d2c;
    background-size: cover;
}

.cost-budget{
    background: url('../img/franchise/franchisebudget/header-yellow (2).png') no-repeat;
    width: 100%;
    height: 50px;
    padding: 3% 3% 2% 3%;
    padding-top: 14px;
    text-align: left;
    font-family: 'touchebold';
    font-size: 14px;
    color: #2e2d2c;
    background-size: cover;
}

.spending-budget{
    background: url('../img/franchise/franchisebudget/header-yellow.png') no-repeat;
    width: 100%;
    height: 50px;
    padding: 3% 3% 2% 3%;
    padding-top: 14px;
    text-align: left;
    font-family: 'touchebold';
    font-size: 14px;
    color: #2e2d2c;
    background-size: cover;
}


.income-budget-yellow{
    background: url('../img/franchise/franchisebudget/header-cyan.png') no-repeat;
    background-size: cover;
    width: 100%;
    height: 50px;
    padding: 3% 3% 2% 3%;
    padding-top: 14px;
    text-align: left;
    font-family: 'touchebold';
    font-size: 14px;
    color: #2e2d2c;
    background-size: cover;
}

.income-budget-yellow-2{
    background: url('../img/franchise/franchisebudget/header-yellow.png') no-repeat;
    background-size: cover;
    width: 100%;
    height: 50px;
    padding: 3% 3% 2% 3%;
    padding-top: 14px;
    text-align: left;
    font-family: 'touchebold';
    font-size: 14px;
    color: #2e2d2c;
    background-size: cover;
}

.spending-budget-yellow{
    background: url('../img/franchise/franchisebudget/header-cyan.png') no-repeat;
    background-size:cover;
    width: 100%;
    height: 50px;
    padding: 3% 3% 2% 3%;
    padding-top: 14px;
    text-align: left;
    font-family: 'touchebold';
    font-size: 14px;
    color: #2e2d2c;
    background-size: cover;
}

.spending-budget-yellow-2{
    background: url('../img/franchise/franchisebudget/header-yellow.png') no-repeat;
    background-size:cover;
    width: 100%;
    height: 50px;
    padding: 3% 3% 2% 3%;
    padding-top: 14px;
    text-align: left;
    font-family: 'touchebold';
    font-size: 14px;
    color: #2e2d2c;
    background-size: cover;
}

.cost-budget-yellow{
    background: url('../img/franchise/franchisebudget/header-cyan (2).png') no-repeat;
    background-size:cover;
    width: 100%;
    height: 50px;
    padding: 3% 3% 2% 3%;
    padding-top: 14px;
    text-align: left;
    font-family: 'touchebold';
    font-size: 14px;
    color: #2e2d2c;
    background-size: cover;
}

.cost-budget-yellow-2{
    background: url('../img/franchise/franchisebudget/header-yellow (2).png') no-repeat;
    background-size:cover;
    width: 100%;
    height: 50px;
    padding: 3% 3% 2% 3%;
    padding-top: 14px;
    text-align: left;
    font-family: 'touchebold';
    font-size: 14px;
    color: #2e2d2c;
    background-size: cover;
}
.container-provision{margin-top:3%; margin-right:3%; margin-bottom:3%;}
.container-provision ul li{
    margin-left: -25px;
}


ul.budget-list-icon{
    list-style-image: url('../img/franchise/franchisebudget/pointer.png');
    margin-left: -20px;
}

.provision-list-icon{font-family:'gibsonitalic'; font-size:14px; color:#2e2d2c;}
.provision-list-icon ul li{
    list-style-image: url('../img/franchise/franchisebudget/pointer (2).png');
    margin-left: -25px;
}


.join-step-container{
    background: url('../img/franchise/franchisejoin/join-list-content.png') no-repeat;
    background-size:cover;
    width:100%;
    height:65px;
    padding: 2% 2% 2% 2%;
}

.join-step-container-even{
    width:100%;
    height:65px;
    padding: 2% 2% 2% 2%;
}

.franchise-join-separator{
    background: url('../img/franchise/franchisejoin/border-bottom.png') no-repeat;
    background-size:cover;
    width:100%;
    height:8px;
}


.franchise-join-information-container{
    background: url('../img/franchise/franchisejoin/background-join-contact.png') no-repeat;
    background-size:100% 100%;
    width:100%;
    padding: 75px 5% 75px 5%;
    position: relative;
    top: -195px;
}

.franchise-join-address{
    margin-top:5%;
    margin-bottom:5%;
    font-family:'gibsonregular';
    font-size:16px;
    color:#3c3c3b;
}

.button-franchise-join{
    background: url('../img/franchise/franchisejoin/button-black.png') no-repeat;
    width: 160px;
    height: 50px;
    padding: 2% 2% 2% 2%;
    text-align: center;
    font-family: 'touchebold';
    font-size: 11px;
    color: #ffcc00;
    -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;
}

.button-franchise-join:hover{opacity:0.7;}


/*Franchise Facility*/

.facility-left{width:50%; float:left;color:black;padding-right:10%;}
.facility-right{width:50%; float:left;color:black;padding-left:10%;}
.image-franchise-facility{width:20%;float:left;}
.franchise-facility-condition{width:80%;float:left; font-family:'touchebold'; font-size:28px; color:#2e2d2c;float:left;}
.franchise-left-part{width:20%;float:left;}
.franchise-right-part{width:80%;float:left; font-family:'touchebold'; font-size:28px; color:#2e2d2c;float:left;}
.facility-2-left{width:50%;float:left;}
.facility-2-right{width:50%;float:left; padding:10%;}
.facility-2-interest-text{font-family:'gibsonregular'; font-size:18px; color:#3c3c3b;white-space:nowrap; margin-top:10%; margin-bottom:15%;}

/*Franchise Join */

.want-join-left{width:50%;float:left;font-family:'gibsonregular'; font-size:17px; color: #2e2d2c;}
.want-join-right{width:50%;float:left;text-align:right;}
.want-join-inner-mobile{padding-left:5%; padding-right:5%;}
.contact-join-inner-mobile{padding-left:5%; padding-right:5%; margin-top:5%;}
.want-join-mobile{width:100%;font-family:'gibsonregular'; font-size:15px; color: #2e2d2c;}
.hotline-information-mobile{margin-top:5%;}
.join-step-content{width:100%; margin-top: 5%;margin-bottom: 5%;}
.join-step-content-left{width:50%;float:left;font-family:'touchebold'; font-size:15px;  color:#2e2d2c; padding-right:5%;}
.join-step-content-right{width:50%; float:left;font-family:'touchebold'; font-size:15px;  color:#2e2d2c; padding-left:5%;}
.join-step-content-mobile{width:100%;font-family:'touchebold'; font-size:14px;  color:#2e2d2c;}
.number-join-position{position:relative; width:10%; float:left;}
.number-join-text{position:absolute; font-family:'gibsonbold_italic'; font-size:16px; color:#ffcc00; top:7px; left:15px;}
.number-join-text-2{position:absolute; font-family:'gibsonbold_italic'; font-size:16px; color:#ffcc00; top:7px; left:12px;}
.contact-join-mobile-content{background:#f4b000; padding: 50px 5% 50px 5%;}


.join-step-text{width:90%;float:left;padding:2%;}
.join-information-left{width:55%; float:left;  padding-right: 5%;}
.join-information-right{width:45%; float:left; padding-left: 5%;}
.join-information-text{font-family:'gibsonregular'; font-size:16px; color:#3c3c3b; margin-bottom:5%;}
.join-information-left-part{width:35%;float:left;}
.join-information-right-part{width:65%;float:left;}
.hotline-info-text{width:30%;float:left;white-space:nowrap;font-family:'touchesemibold'; font-size:13px; color:#c16700;}
.hotline-info-detail-text{width:70%;float:left;white-space:nowrap; font-family:'touchebold'; font-size:14px; color:#2e2d2c;}
.surabaya-join-text{margin-left:2%; font-family:'touchesemibold'; font-size:15px; color:#373636;}
.join-information-interest-text{font-family:'gibsonregular'; font-size:18px; color:#3c3c3b;margin-top:10%; margin-bottom:10%;}
.background-join-here-mobile{ background: url('../img/franchise/franchisejoin/franchise-join-contact-mobile.png') no-repeat top left; background-size:cover; padding:50px 5% 50px 5%; top: -1px;position:relative; }

/*Franchise FAQ*/

.faq-section-1{background:#ffffff; padding:75px 10% 75px 10%;}
.faq-section-2{background:#f2ebe4; padding:75px 10% 75px 10%;}
.faq-section-3{background:#ffcc00; padding:75px 10% 75px 10%;}
.faq-section-4{background:#ffffff; padding:75px 10% 75px 10%;}
.faq-section-5{background:#f2ebe4; padding:75px 10% 75px 10%;}
.img-faq-icon{max-width:40%;}
.faq-content-left{float:left; width:25%;}
.faq-content-right{float:left; width:75%;}
.category-name-text-faq{font-family:'touchebold'; font-size:28px; color:#2e2d2c; width: 50%; }
.q-text{width:5%; float:left; font-family:'gibsonsemibold'; font-size:17px; color:#4a4a49;}
.a-text{width:5%; float:left; font-family:'gibsonsemibold'; font-size:17px; color:#4a4a49;}
.faq-question-text{float:left;width:95%; font-family:'gibsonregular'; font-size:17px; color:#4a4a49;}
.faq-answer-text{float:left;width:95%; font-family:'gibsonregular'; font-size:17px; color:#4a4a49;}
.faq-answer-text a{color:#4a4a49;}
.look-detail-faq{font-family:'touchemedium'; font-size:15px; color:#2e2d2c;position: absolute; top: 20px;  left: 40px;overflow-x: hidden; }
.accordion-left-faq{width:30%; float:left;}
.accordion-right-faq{width:70%; float:left;}
.accordion-left-faq-2{width:70%; float:left; border-bottom: 1px solid black; margin-top:5%;}
.accordion-right-faq-2{width:30%; float:left;position: relative;}
.masterfranchise-faq-general{background: #f2ebe4; position: relative; z-index: 0;  background-size: cover; padding:75px 10% 75px 10%;}

.accordion {
    background-color: #ffffff;
    color: black;
    cursor: pointer;
    padding: 0px;
    /* padding-left:30px; */
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 20px;
    font-style:bold;
    transition: 0.4s;
  }
  


  .accordion:after {
    /* font-family: FontAwesome; */
    content: url('../img/franchise/franchisefaq/franchise-faq-down.png');
    cursor:pointer;
    font-size: 30px;
    font-weight: 400;
    color: #d3b879;
    float: right;
    position: relative;
    top: -30px;
    text-align: right;
}
  
  .accordion.active:after {
    content: url('../img/franchise/franchisefaq/franchise-faq-up.png');
    cursor:pointer;
    /* transform: rotate(90deg) perspective(0); */
  }
  
  .panel {
    padding: 0 0px;
    border: none;
    background-color: #ffffff;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
  }

  /* Accordion Franchise Budget */
.border-budget-accordion {
    border-bottom: 1px solid black;
    width: 60%;
    position: relative;
    top: 15px;
}  

.border-budget-accordion-1 {
    border-bottom: 1px solid black;
    width: 70%;
    position: relative;
    top: 15px;
    margin-left: 5%;
}  

.btn-accordion-down-2{
    background: url('../img/franchise/franchisebudget/accordion-yellow-button.png') top left no-repeat;
    cursor:pointer;
    font-family:'touchebold';
    font-size:14px;
    color:#2e2d2c;
    padding:2%;
    padding-top:9px;
    width: 100%;
    height: 35px;
    background-size: contain;
}

.accordion-button-1 {
    background: url('../img/franchise/franchisebudget/accordion-yellow-button.png') top left no-repeat;
    cursor: pointer;
    font-family: 'touchebold';
    font-size: 14px;
    padding-top: 6px;
    padding-left: 2%;
    padding-right: 2%;
    padding-bottom: 3px;
    color: #2e2d2c;
    position: relative;
    width: 15%;
    height: 35px;
    margin-left: 77%;
    border: none;
    text-align: left;
    outline: none;
    background-size: contain;
    transition: 0.4s;
    margin-bottom: 3%;
  }
  .accordion-button-1:after {
    /* font-family: FontAwesome; */
    content: url('../img/franchise/franchisefaq/franchise-faq-down.png');
    cursor:pointer;
    font-size: 20px;
    font-weight: 100;
    float: right;
    position: relative;
    top: -5px;
    text-align: right;
}
  
  .accordion-button-1.active:after {
    content: url('../img/franchise/franchisefaq/franchise-faq-up.png');
    cursor:pointer;
    /* transform: rotate(90deg) perspective(0); */
  }

  .accordion-budget-1 {
    padding: 0 0px;
    border: none;
    background-color: #ffffff;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
  }




.accordion-button-2 {
    background: url('../img/franchise/franchisebudget/accordion-white-button.png') top left no-repeat;
    background-size: contain!important;
    cursor:pointer;
    font-family:'touchebold';
    font-size:14px;
    padding-top: 3px;
    padding-left: 3%;
    padding-right: 3%;
    padding-bottom: 3px;
    color:#2e2d2c;
    position: relative;
    width: 35%;
    height: 35px;
    margin-left: 65%;
    border: none;
    text-align: left;
    outline: none;
    background-size:contain;
    transition: 0.4s;
    margin-bottom: 3%;
  }
  .accordion-button-2:after {
    /* font-family: FontAwesome; */
    content: url('../img/franchise/franchisefaq/franchise-faq-down.png');
    cursor:pointer;
    font-size: 20px;
    font-weight: 100;
    float: right;
    position: relative;
    top: -5px;
    text-align: right;
}
  
  .accordion-button-2.active:after {
    content: url('../img/franchise/franchisefaq/franchise-faq-up.png');
    cursor:pointer;
    /* transform: rotate(90deg) perspective(0); */
  }

  .accordion-budget-2 {
    padding: 0 0px;
    border: none;
    background-color: #ffcc00;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
  }


  .accordion-budget-white {
    padding: 0 0px;
    border: none;
    background-color: #ffcc00;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
  }

  .accordion-button-white {
    background: url('../img/franchise/franchisebudget/accordion-white-button.png') top left no-repeat;
    background-size: contain!important;
    cursor:pointer;
    font-family:'touchebold';
    font-size:14px;
    padding-top: 3px;
    padding-left: 3%;
    padding-right: 3%;
    padding-bottom: 3px;
    color:#2e2d2c;
    position: relative;
    width: 35%;
    height: 35px;
    margin-left: 65%;
    border: none;
    text-align: left;
    outline: none;
    background-size:contain;
    transition: 0.4s;
    margin-bottom: 3%;
  }
  .accordion-button-white:after {
    /* font-family: FontAwesome; */
    content: url('../img/franchise/franchisefaq/franchise-faq-down.png');
    cursor:pointer;
    font-size: 20px;
    font-weight: 100;
    float: right;
    position: relative;
    top: -5px;
    text-align: right;
}
  
  .accordion-button-white.active:after {
    content: url('../img/franchise/franchisefaq/franchise-faq-up.png');
    cursor:pointer;
    /* transform: rotate(90deg) perspective(0); */
  }

  .accordion-budget-white {
    padding: 0 0px;
    border: none;
    background-color: #ffcc00;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
  }


.accordion-button-3 {
    background: url('../img/franchise/franchisebudget/accordion-white-button.png') top left no-repeat;
    background-size: contain!important;
    cursor:pointer;
    font-family:'touchebold';
    font-size:14px;
    padding-top: 3px;
    padding-left: 3%;
    padding-right: 3%;
    padding-bottom: 3px;
    color:#2e2d2c;
    position: relative;
    width: 35%;
    height: 35px;
    margin-left: 65%;
    border: none;
    text-align: left;
    outline: none;
    background-size:contain;
    transition: 0.4s;
    margin-bottom: 3%;
    
  }
  .accordion-button-3:after {
    /* font-family: FontAwesome; */
    content: url('../img/franchise/franchisefaq/franchise-faq-down.png');
    cursor:pointer;
    font-size: 20px;
    font-weight: 100;
    float: right;
    position: relative;
    top: -5px;
    text-align: right;
}
  
  .accordion-button-3.active:after {
    content: url('../img/franchise/franchisefaq/franchise-faq-up.png');
    cursor:pointer;
    /* transform: rotate(90deg) perspective(0); */
  }

  .accordion-budget-3 {
    padding: 0 0px;
    border: none;
    background-color: #ffcc00;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
  }


  .accordion-button-4 {
    background: url('../img/franchise/franchisebudget/accordion-yellow-button.png') top left no-repeat;
    background-size: contain!important;
    cursor:pointer;
    font-family:'touchebold';
    font-size:14px;
    padding-top: 3px;
    padding-left: 3%;
    padding-right: 3%;
    padding-bottom: 3px;
    color:#2e2d2c;
    position: relative;
    width: 35%;
    height: 35px;
    margin-left: 65%;
    border: none;
    text-align: left;
    outline: none;
    background-size:contain;
    transition: 0.4s;
    margin-bottom: 3%;
  }
  .accordion-button-4:after {
    /* font-family: FontAwesome; */
    content: url('../img/franchise/franchisefaq/franchise-faq-down.png');
    cursor:pointer;
    font-size: 20px;
    font-weight: 100;
    float: right;
    position: relative;
    top: -5px;
    text-align: right;
}
  
  .accordion-button-4.active:after {
    content: url('../img/franchise/franchisefaq/franchise-faq-up.png');
    cursor:pointer;
    /* transform: rotate(90deg) perspective(0); */
  }

  .accordion-budget-4 {
    padding: 0 0px;
    border: none;
    background-color: #f2ebe4;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
  }

  .accordion-budget-yellow {
    padding: 0 0px;
    border: none;
    background-color: #f2ebe4;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
  }

  .accordion-button-yellow {
    background: url('../img/franchise/franchisebudget/accordion-yellow-button.png') top left no-repeat;
    background-size: contain!important;
    cursor:pointer;
    font-family:'touchebold';
    font-size:14px;
    padding-top: 3px;
    padding-left: 3%;
    padding-right: 3%;
    padding-bottom: 3px;
    color:#2e2d2c;
    position: relative;
    width: 35%;
    height: 35px;
    margin-left: 65%;
    border: none;
    text-align: left;
    outline: none;
    background-size:contain;
    transition: 0.4s;
    margin-bottom: 3%;
  }
  .accordion-button-yellow:after {
    /* font-family: FontAwesome; */
    content: url('../img/franchise/franchisefaq/franchise-faq-down.png');
    cursor:pointer;
    font-size: 20px;
    font-weight: 100;
    float: right;
    position: relative;
    top: -5px;
    text-align: right;
}
  
  .accordion-button-yellow.active:after {
    content: url('../img/franchise/franchisefaq/franchise-faq-up.png');
    cursor:pointer;
    /* transform: rotate(90deg) perspective(0); */
  }

  .accordion-budget-yellow {
    padding: 0 0px;
    border: none;
    background-color: #f2ebe4;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
  }


  .accordion-button-5 {
    background: url('../img/franchise/franchisebudget/accordion-yellow-button.png') top left no-repeat;
    background-size: contain!important;
    cursor:pointer;
    font-family:'touchebold';
    font-size:14px;
    padding-top: 3px;
    padding-left: 3%;
    padding-right: 3%;
    padding-bottom: 3px;
    color:#2e2d2c;
    position: relative;
    width: 35%;
    height: 35px;
    margin-left: 65%;
    border: none;
    text-align: left;
    outline: none;
    background-size:contain;
    transition: 0.4s;
    margin-bottom: 3%;
  }
  .accordion-button-5:after {
    /* font-family: FontAwesome; */
    content: url('../img/franchise/franchisefaq/franchise-faq-down.png');
    cursor:pointer;
    font-size: 20px;
    font-weight: 100;
    float: right;
    position: relative;
    top: -5px;
    text-align: right;
}
  
  .accordion-button-5.active:after {
    content: url('../img/franchise/franchisefaq/franchise-faq-up.png');
    cursor:pointer;
    /* transform: rotate(90deg) perspective(0); */
  }

  .accordion-budget-5 {
    padding: 0 0px;
    border: none;
    background-color: #f2ebe4;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
  }


  .accordion-button-6 {
    background: url('../img/franchise/franchisebudget/accordion-white-button.png') top left no-repeat;
    background-size: contain!important;
    cursor:pointer;
    font-family:'touchebold';
    font-size:14px;
    padding-top: 3px;
    padding-left: 3%;
    padding-right: 3%;
    padding-bottom: 3px;
    color:#2e2d2c;
    position: relative;
    width: 35%;
    height: 35px;
    margin-left: 65%;
    border: none;
    text-align: left;
    outline: none;
    background-size:contain;
    transition: 0.4s;
    margin-bottom: 3%;
  }
  .accordion-button-6:after {
    /* font-family: FontAwesome; */
    content: url('../img/franchise/franchisefaq/franchise-faq-down.png');
    cursor:pointer;
    font-size: 20px;
    font-weight: 100;
    float: right;
    position: relative;
    top: -5px;
    text-align: right;
}
  
  .accordion-button-6.active:after {
    content: url('../img/franchise/franchisefaq/franchise-faq-up.png');
    cursor:pointer;
    /* transform: rotate(90deg) perspective(0); */
  }

  .accordion-budget-6 {
    padding: 0 0px;
    border: none;
    background-color: #ffcc00;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
  }


  .accordion-button-7 {
    background: url('../img/franchise/franchisebudget/accordion-white-button.png') top left no-repeat;
    background-size: contain!important;
    cursor:pointer;
    font-family:'touchebold';
    font-size:14px;
    padding-top: 3px;
    padding-left: 3%;
    padding-right: 3%;
    padding-bottom: 3px;
    color:#2e2d2c;
    position: relative;
    width: 35%;
    height: 35px;
    margin-left: 65%;
    border: none;
    text-align: left;
    outline: none;
    background-size:contain;
    transition: 0.4s;
    margin-bottom: 3%;
  }
  .accordion-button-7:after {
    /* font-family: FontAwesome; */
    content: url('../img/franchise/franchisefaq/franchise-faq-down.png');
    cursor:pointer;
    font-size: 20px;
    font-weight: 100;
    float: right;
    position: relative;
    top: -5px;
    text-align: right;
}
  
  .accordion-button-7.active:after {
    content: url('../img/franchise/franchisefaq/franchise-faq-up.png');
    cursor:pointer;
    /* transform: rotate(90deg) perspective(0); */
  }

  .accordion-budget-7 {
    padding: 0 0px;
    border: none;
    background-color: #ffcc00;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
  }

  .number-content-left-mobile{width:50%; float:left;}
  .number-content-right-mobile{width:50%; float:right; text-align: right;}


  .value-circle-content-2{
    background: url('../img/franchise/franchisebudget/value-circle.png') no-repeat;
    width: 95px;
    height: 95px;
    background-size: cover;
    position: relative;
  }

/*Master Franchise Facility*/

.btn-master-facility {
    margin-top: 0px;
    background: url('../img/franchise/masterfranchisefacility/list-button-active.png') no-repeat;
    width: 355px;
    height: 40px;
    padding: 3% 3% 3% 15%;
    text-align: left;
    font-family: 'touchebold';
    font-size: 11px;
    color: #ffcc00;
    background-size: cover;
    margin-bottom: 20px;
}


.btn-master-facility-nonactive{
    margin-top: 0px;
    background: url('../img/franchise/masterfranchisefacility/list-button-active-2.png') no-repeat;
    width: 355px;
    height: 40px;
    padding: 3% 3% 3% 15%;
    text-align: left;
    font-family: 'touchebold';
    font-size: 11px;
    color: #2e2d2c;
    background-size: cover;
    margin-bottom :20px;
}


.btn-master-facility-nonactive:hover{
    margin-top: 0px;
    background: url('../img/franchise/masterfranchisefacility/list-button-active.png') no-repeat;
    width: 355px;
    height: 40px;
    padding: 3% 3% 3% 15%;
    text-align: left;
    font-family: 'touchebold';
    font-size: 11px;
    color: #ffcc00;
    background-size: cover;
    margin-bottom :20px;
}

.master-franchise-who-left{width:50%;float:left;}
.master-franchise-who-right{width:50%;float:left; text-align:right;}
.who-left-part{width:20%;float:left;}
.who-right-part{width:80%; float:left; font-family:'touchebold'; font-size:28px; color:#2e2d2c; white-space:normal;}
.who-text{font-family:'gibsonregular'; font-size:17px; color:#4a4a49; margin-top:5%;}
.condition-text-left{width:50%; float:left;}
.condition-text-right{width:50%; float:left; text-align:right;}
.master-image-condition{width:20%;float:left;}
.master-condition-title{width:80%; float:left; font-family:'touchebold'; font-size:28px; color:#2e2d2c; white-space:normal;}
.condition-left-part{width:50%; float:left; padding-right: 5%;}
.condition-right-part{width:50%; float:left; padding-left: 5%;}
.criteria-text{font-family:'touchebold'; font-size:14px; color:#f0ae00;}
.master-facility-part{width:50%; float:left; padding-right: 5%;}
.master-facility-part-right{width:50%; float:left; padding-left: 5%;}
.baba-rafi-facility-text{font-family:'gibsonregular'; font-size: 17px; color:#4a4a49;padding-left: 10%;}
.join-step-left-part{position:relative; width:10%; float:left; padding-left:3%;padding-top: 2px;}
.join-step-right-part{width:90%;float:left;padding:2%;}
.number-step-text{position:absolute; font-family:'gibsonbold_italic'; font-size:16px; color:#2e2d2c; top:4px; left:26px;}
.number-step-text-2{position:absolute; font-family:'gibsonbold_italic'; font-size:16px; color:#2e2d2c; top:4px; left:23px;}


.franchise-banner-title-black {
    font-family: 'touchesemibold';
    font-size: 12px;
    color: #2e2d2c;
    margin-left: 2%;
    letter-spacing: 0.7px;
}

.join-master-step-container {
    background: url('../img/franchise/masterfranchisefacility/list-content.png') no-repeat;
    background-size: cover;
    width: 100%;
    height: 35px;
    font-family:'touchebold';
    font-size: 13px;
    color:#3c3c3b;
    /* padding: 2% 2% 2% 2%; */
}

.join-master-step-container-even{
    width:100%;
    height:65px;
    padding: 2% 0% 2% 0%;
    font-family:'touchebold';
    font-size: 13px;
    color:#3c3c3b;
}
.background-information{background:#2e2e2d; color:white; width:60%; position:relative; margin:0 auto;padding: 10% 15% 10% 15%; top: -190px;}
.master-information-text{font-family:'gibsonregular'; font-size:18px; color : #ffffff;  margin-top:10%; margin-bottom: 15%;}

.button-master-facility-join {
    background: url('../img/franchise/masterfranchisefacility/button-submit.png') no-repeat;
    width: 160px;
    height: 50px;
    padding: 2% 2% 2% 2%;
    padding-top: 9px;
    text-align: center;
    font-family: 'touchebold';
    font-size: 11px;
    color: #2e2d2c;
    -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s!important;
}

.button-master-facility-join:hover{opacity:0.7!important;}

/*Master Franchise Budget*/

.masterfranchisebudget-column{width:50%; float:left;}
.masterfranchisebudgetyellowcontent{background:#ffcc00;  padding: 50px 15% 50px 15%; white-space: nowrap;}
.mfbudget-text-left{font-family:'gibsonregular'; font-size:18px; color:#ffffff; padding: 10% 20% 10% 0%;}
.email-contact-master-budget{font-family:'gibsonregular'; font-size:18px; color:#ffcc00;}
.mfbudget-text-right{font-family:'gibsonregular'; font-size:18px; color:#3c3c3b; margin-top:10%; margin-bottom:10%;}

.button-masterbudget-whatsapp{
    background: url('../img/franchise/masterfranchisebudget/button-franchise-contact.png') no-repeat;
    background-size: contain;
    width: 270px;
    height: 50px;
    padding: 2% 2% 2% 2%;
    padding-top: 6px;
    text-align: center;
    font-family: 'touchebold';
    font-size: 11px;
    color: #2e2d2c;
    -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;
}

.button-masterbudget-whatsapp:hover{opacity:0.7;}

.button-mf-budget-leftpart{width:20%; float:left;}
.button-mf-budget-rightpart{width:80%; float:left;text-align: left;}
.mfbudget-text-right-mobile {font-size: 17px;display:none;}
.icon-wa-email-mfbudget{max-width: 30%; position:relative; top:-1px;}
.button-masterbudget-here-2 {
    background: url('../img/franchise/masterfranchisebudget/button-submit.png') no-repeat;
    width: 160px;
    height: 50px;
    padding: 2% 2% 2% 2%;
    padding-top: 9px;
    text-align: center;
    font-family: 'touchebold';
    font-size: 11px;
    color: #ffcc00;
    -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;
}

.button-masterbudget-here-2:hover{opacity:0.7}


/*Master FRANCHISE HOW TO*/

.howto-item-row-1{width:33%;float:left; padding: 5%;}
.howto-item-row-2{width:50%;float:left; padding:7%}
.image-number-howto{position:relative; top:30px;}
.image-howto-left{width:15%; float:left;}
.image-howto-right{width:85%; float:left;}
.howto-number-text{font-family:'gibsonbold_italic'; font-size:13px; color:#ffcc00; position:relative;text-align:center; left: -4px;top: 6px;}
.howto-title-content{font-family:'touchebold'; font-size:15px; color:#2e2d2c;margin-top: 5%; margin-bottom: 5%;}
.howto-text-content{font-family:'gibsonregular'; font-size:17px; color:#4a4a49;}
.howto-interest-content{width:50%; float:left;}
.interest-left-1{width:15%; float:left;}
.interest-right-1{width:85%; float:left; font-family:'gibsonregular';font-size:16px; color:#ffffff; line-height: 25px;}
.interest-left-2{width:30%; float:left;}
.interest-right-2{width:65%; float:left; margin-left: 5%;}
.howto-information-content{margin-top: -15%; padding-left:15%; padding-right:15%;}
.howto-information-content-left{width:70%; float:left; font-family:'gibsonregular'; font-size:18px; color:#343333; padding-right: 5%;}
.howto-information-content-right{width:30%; float:left;padding-left: 5%;}
.surabaya-text{margin-left:3%; font-family:'touchesemibold'; font-size:15px; color:#ffcc00; letter-spacing:1.7px;}
.interest-address-text{margin-top:3%; font-family:'gibsonregular'; font-size:16px; color:#ffffff; white-space: nowrap;}
.interest-text-left{width:20%;float:left; font-family:'touchesemibold'; font-size:13px; color:#ffcc00;}
.interest-text-right{width:80%;float:left; font-family:'touchebold'; font-size:14px; color:#ffffff; white-space:nowrap;}
.howtoseparator{
    background: url('../img/franchise/masterfranchisehowto/border-separator (2).png') no-repeat;
    width:100%;
    height:10px;
}

.howto-item-mobile{margin-top:10%;margin-bottom:10%;}

.highlight-howto-text{
    background: url('../img/franchise/masterfranchisehowto/highlight-1.png') no-repeat;
    width: 100%;
    padding-left:2%;
    background-size:auto 100%;
}

.highlight-howto-text-2{
    background: url('../img/franchise/masterfranchisehowto/highlight-2.png') no-repeat;
    width: 100%;
    padding-left:2%;
    background-size:auto 100%;
}

.highlight-howto-text-3{
    background: url('../img/franchise/masterfranchisehowto/highlight-3.png') no-repeat;
    width: 100%;
    padding-left:2%;
    background-size:auto 100%;
}

.highlight-howto-text-4{
    background: url('../img/franchise/masterfranchisehowto/highlight-4.png') no-repeat;
    width: 100%;
    padding-left:2%;
    background-size:auto 100%;
}

.highlight-howto-text-5{
    background: url('../img/franchise/masterfranchisehowto/highlight-5.png') no-repeat;
    width: 100%;
    padding-left:2%;
    background-size:auto 100%;
}

.button-howto-here{
    background: url('../img/franchise/masterfranchisehowto/button-black.png') no-repeat;
    width: 160px;
    height: 50px;
    padding: 5% 2% 2% 2%;
    text-align: center;
    font-family: 'touchebold';
    font-size: 11px;
    letter-spacing: 1.7px;
    color: #ffcc00;
    -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;
}

.button-howto-here:hover{opacity:0.7;}

.corner-bottom-right-bevel {
    border-color: yellow transparent transparent transparent;
    border-width: 50px 50px 0 0;
  }

.box2 {
    width: max-content;
    height: 20px;
    line-height: 20px;
    padding: 0 5px;
    background-color: #ffcc00;
    padding-right: 20px;
    border-right: 0;
    position: relative;
    margin-bottom: 2%;
    white-space: nowrap;
}
  
.box2:after {
    content: "";
    display: block;
    border-style: solid;
    border-color: #ffcc00 transparent transparent transparent;
    border-width: 20px 5px 0px 0px;
    width: 0;
    height: 0;
    position: absolute;
    top: 0;
    right: -5px;
}

@media (max-width: 1920px) and (min-width: 1850px) {
    /* .budget-container-value {
        top: -40px;
        left: 365px;
    } */

    .border-budget-accordion-1 {
        width: 75%;
        margin-left: 5%;
    } 
    .accordion-button-1 {
        width: 11%;
        height: 35px;
        margin-left: 84%;
    }

    .border-budget-accordion {
        border-bottom: 1px solid black;
        width: 67%;
        position: relative;
        top: 15px;
    }

    .accordion-button-2 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-white {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-3 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-4 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-yellow {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-5 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-6 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-7 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .budget-position-circle-2 {
        position: relative;
        z-index: 1;
        top: 180px;
        right: -390px;
    }
    .budget-position-circle-2-small {
        position: relative;
        z-index: 1;
        top: 110px;
        right: -420px;
    }
}

@media (max-width: 1850px) and (min-width: 1800px) {
    /* .budget-container-value {
        top: -40px;
        left: 345px;
    } */


    .border-budget-accordion-1 {
        width: 75%;
        margin-left: 5%;
    } 
    .accordion-button-1 {
        width: 12%;
        height: 35px;
        margin-left: 84%;
    }

    .border-budget-accordion {
        border-bottom: 1px solid black;
        width: 67%;
        position: relative;
        top: 15px;
    }

    .accordion-button-2 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-white {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-3 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-4 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-yellow {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-5 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-6 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-7 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .budget-position-circle-2 {
        position: relative;
        z-index: 1;
        top: 180px;
        right: -390px;
    }
    .budget-position-circle-2-small {
        position: relative;
        z-index: 1;
        top: 110px;
        right: -420px;
    }
}

@media (max-width: 1800px) and (min-width: 1750px) {
    /* .budget-container-value {
        top: -40px;
        left: 335px;
    } */

    .border-budget-accordion-1 {
        width: 75%;
        margin-left: 5%;
    } 
    .accordion-button-1 {
        width: 12%;
        height: 35px;
        margin-left: 84%;
    }

    .border-budget-accordion {
        border-bottom: 1px solid black;
        width: 67%;
        position: relative;
        top: 15px;
    }

    .accordion-button-2 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-white {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-3 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-4 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-yellow {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-5 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-6 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-7 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }
    .budget-position-circle-2 {
        top: 60px;
        right: 180px;
    }
    .budget-position-circle-2-small {
        top: 5px;
        right: 165px;
    }
}

@media (max-width: 1750px) and (min-width: 1700px) {
    /* .budget-container-value {
        top: -40px;
        left: 325px;
    } */

    .border-budget-accordion-1 {
        width: 75%;
        margin-left: 5%;
    } 
    .accordion-button-1 {
        width: 12%;
        height: 35px;
        margin-left: 84%;
    }

    .border-budget-accordion {
        border-bottom: 1px solid black;
        width: 67%;
        position: relative;
        top: 15px;
    }

    .accordion-button-2 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-white {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-3 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-4 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-yellow {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-5 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-6 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-7 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .budget-position-circle-2 {
        top: 60px;
        right: 150px;
    }
    
    .budget-position-circle-2-small {
        top: 10px;
        right: 145px;
    }
}

@media (max-width: 1700px) and (min-width: 1650px) {
    /* .budget-container-value {
        top: -40px;
        left: 315px;
    } */

    .border-budget-accordion-1 {
        width: 75%;
        margin-left: 5%;
    } 
    .accordion-button-1 {
        width: 12%;
        height: 35px;
        margin-left: 84%;
    }

    .border-budget-accordion {
        border-bottom: 1px solid black;
        width: 67%;
        position: relative;
        top: 15px;
    }

    .accordion-button-white {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-3 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-4 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-yellow {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-5 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-6 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-7 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .budget-position-circle-2 {
        top: 60px;
        right: 140px;
    }
    .budget-position-circle-2-small {
        top: 10px;
        right: 140px;
    }
}

@media (max-width:1650px) and (min-width:1600px){
    /* .budget-container-value {
        left: 310px;
    } */

    .border-budget-accordion-1 {
        width: 75%;
        margin-left: 5%;
    } 
    .accordion-button-1 {
        width: 12%;
        height: 35px;
        margin-left: 84%;
    }

    .border-budget-accordion {
        border-bottom: 1px solid black;
        width: 67%;
        position: relative;
        top: 15px;
    }

    .accordion-button-white {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-3 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-4 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-yellow {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-5 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-6 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-7 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }
    .budget-position-circle-2 {
        top: 60px;
        right: 110px;
    }

    .budget-position-circle-2-small {
        top: 5px;
        right: 140px;
    }
}

@media (max-width:1600px) and (min-width:1550px){
    /* .budget-container-value {
        left: 300px;
    } */

    .border-budget-accordion-1 {
        width: 75%;
        margin-left: 5%;
    } 
    .accordion-button-1 {
        width: 12%;
        height: 35px;
        margin-left: 84%;
    }

    .border-budget-accordion {
        border-bottom: 1px solid black;
        width: 67%;
        position: relative;
        top: 15px;
    }

    .accordion-button-white {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-3 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-4 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-yellow {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-5 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-6 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-7 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .budget-position-circle-2 {
        top: 60px;
        right: 90px;
    }

    .budget-position-circle-2-small {
        top: 5px;
        right: 125px;
    }
}

@media (max-width:1550px) and (min-width:1500px){
    /* .budget-container-value {
        left: 290px;
    } */

    .border-budget-accordion-1 {
        width: 75%;
        margin-left: 5%;
    } 
    .accordion-button-1 {
        width: 12%;
        height: 35px;
        margin-left: 84%;
    }

    .border-budget-accordion {
        border-bottom: 1px solid black;
        width: 67%;
        position: relative;
        top: 15px;
    }

    .accordion-button-2 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-white {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-3 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-4 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-yellow {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-5 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-6 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-7 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .budget-position-circle-2-small {
        top: 5px;
        right: 115px; 
    }
}
@media (max-width:1500px) and (min-width:1450px){
    /* .budget-container-value {
        left: 290px;
    } */

    .border-budget-accordion-1 {
        width: 75%;
        margin-left: 5%;
    } 
    .accordion-button-1 {
        width: 12%;
        height: 35px;
        margin-left: 84%;
    }

    .border-budget-accordion {
        border-bottom: 1px solid black;
        width: 67%;
        position: relative;
        top: 15px;
    }

    .accordion-button-2 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-white {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-3 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-4 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-yellow {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-5 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-6 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }

    .accordion-button-7 {
        padding-top: 9px;
        width: 28%;
        height: 35px;
        margin-left: 72%;
    }
}
@media (max-width:1450px) and (min-width:1400px){
    /* .budget-container-value {
        left: 281px;
    } */
}

/*@media (max-width:1400px) and (min-width:1350px){
    .budget-container-value {
        left: 270px;
    }
}*/




@media all and (max-width:1350px){
    /* .budget-container-value {
        left: 260px;
    } */
}
@media all and (max-width:1300px){
    .image-franchise-facility {
        width: 25%;
    }

    .franchise-facility-condition {
        width: 75%;
    }

    .franchise-left-part {
        width: 25%;
    }

    .franchise-right-part {
        width: 75%;
    }

    .number-step-text {
        top: 6px;
        left: 24px;
    }

    .number-step-text-2 {
        top: 7px;
        left: 21px;
    }

    /* .budget-container-value {
        left: 252px;
    } */

    .btn-facility {
        min-height: 40px;
    }

    .btn-facility-nonactive {
        min-height: 40px;
    }

    .btn-facility-nonactive:hover{
        height: 40px;
    }

    .btn-master-facility {
        height: 40px;
    }

    .btn-master-facility-nonactive {
        height: 40px;
    }

    .btn-master-facility-nonactive:hover{
        height: 40px;
    }
}

@media all and (max-width:1250px){
    /* .budget-container-value {
        left: 245px;
    } */

    .budget-position-circle-2 {
        top: 45px;
        right: -30px;
    }
    .budget-position-circle-2-small {
        top: 20px;
        right: 75px;
    }
}


@media all and (max-width:1200px){
    .number-step-text-2 {
        top: 6px;
        left: 20px;
    }

    .howto-number-text {
        left: -1px;
        top: 4px;
    }

    /* .budget-container-value {
        left: 235px;
    } */

    .btn-master-facility {
        height: 40px;
        margin-bottom: 15px;
    }

    .btn-master-facility-nonactive {
        height: 40px;
        margin-bottom: 15px;
    }

    .btn-master-facility-nonactive:hover{
        height: 40px;
        margin-bottom: 15px;
    }
    
}
@media all and (max-width:1150px){
    .hotline-info-detail-text {
        font-size: 12px;
    }

    .number-step-text {
        top: 5px;
        left: 22px;
    }

    .number-step-text-2 {
        top: 5px;
        left: 18px;
    }

    /* .budget-container-value {
        left: 225px;
    } */

    .budget-position-circle-2 {
        top: 60px;
        right: -12px;
    }

    .budget-position-circle-2-small {
        top: 20px;
        right: 35px;
    }

    .btn-facility {
        min-height: 35px;
    }

    .btn-facility-nonactive {
        min-height: 35px;
    }

    .btn-facility-nonactive:hover{
        height: 35px;
    }

    .btn-master-facility {
        width:335px;
        height: 38px;
        margin-bottom: 15px;
    }

    .btn-master-facility-nonactive {
        width:335px;
        height: 38px;
        margin-bottom: 15px;
    }

    .btn-master-facility-nonactive:hover{
        width:335px;
        height: 38px;
        margin-bottom: 15px;
    }
   
    .mfbudget-text-left {
        font-size: 16px;
    }
    .mfbudget-text-right {
        font-size: 16px;
    }

    .email-contact-master-budget {
        font-size: 16px;
    }

    .budget-img-big {
        min-height: 420px;
    }
    
}

@media all and (max-width:1100px){
    .franchise-join-address {
        font-size: 15px;
    }
    .want-join-left {
        font-size: 16px;
    }

    .button-franchise-join {
        padding: 2% 2% 2% 2%;
        padding-top: 10px;
    }
    .faq-content-left {
        float: left;
        width: 30%;
    }
    .faq-content-right {
        float: left;
        width: 70%;
    }

    .number-step-text {
        top: 5px;
        left: 21px;
    }

    .number-step-text-2 {
        top: 5px;
        left: 17px;
    }

    /* .budget-container-value {
        left: 216px;
    } */

    .budget-container-name-3 {
        font-size: 22px;
    }

    .payback-period-value-yellow {
        font-size: 35px;
    }

    .payback-period-value {
        font-size: 35px;
    }
}

@media all and (max-width:1050px){
    .image-franchise-facility {
        width: 30%;
    }

    .franchise-facility-condition {
        width: 70%;
    }

    .franchise-left-part {
        width: 30%;
    }

    .franchise-right-part {
        width: 70%;
    }

    .facility-right {
        padding-left: 5%;
    }

    .facility-left {
        padding-right: 5%;
    }

    .join-step-container {
        width: 100%;
        height: 55px;
        padding: 1%;
    }

    .join-step-container-even {
        width: 100%;
        height: 55px;
        padding: 1%;
    }

    .number-join-text {
        font-size: 15px;
        top: 9px;
        left: 15px;
    }

    .number-join-text-2 {
        font-size: 15px;
        top: 9px;
        left: 10px;
    }

    .number-step-text {
        top: 5px;
        left: 21px;
        font-size: 13px;
    }

    .number-step-text-2 {
        top: 5px;
        left: 17px;
        font-size: 13px;
    }

    .interest-address-text {
        font-size: 14px;
    }

    .interest-text-left {
        width:25%;
        font-size: 11px;
    }

    .interest-text-right {
        width:75%;
        font-size: 12px;
    }

    /* .budget-container-value {
        left: 207px;
    } */

    .border-budget-accordion-1 {
        width: 67%;
        margin-left: 5%;
    }

    .accordion-button-1 {
        width: 18%;
        height: 35px;
        margin-left: 74%;
    }

    .budget-position-circle-2 {
        top: 60px;
        right: -20px;
    }

    .budget-position-circle-2-small {
        top: 20px;
        right: 10px;
    }


    .border-budget-accordion {
        width: 55%;
    }
    .accordion-button-2 {
        width: 38%;
        height: 35px;
        margin-left: 62%;
    }

    .accordion-button-white {
        width: 38%;
        height: 35px;
        margin-left: 62%;
    }
    .accordion-button-3 {
        width: 38%;
        height: 35px;
        margin-left: 62%;
    }
    .accordion-button-4 {
        width: 38%;
        height: 35px;
        margin-left: 62%;
    }

    .accordion-button-yellow {
        width: 38%;
        height: 35px;
        margin-left: 62%;
    }

    .accordion-button-5 {
        width: 38%;
        height: 35px;
        margin-left: 62%;
    }
    .accordion-button-6 {
        width: 38%;
        height: 35px;
        margin-left: 62%;
    }
    .accordion-button-7 {
        width: 38%;
        height: 35px;
        margin-left: 62%;
    }

    .provision-content-left {
        width: 40%;
    }

    .provision-content-text {
        width: 60%;
    }
    
    .franchise-list-button {
        top: 0px;
    }

    .budget-container-name {
        font-size: 21px;
    }
    .budget-container-name-3 {
        font-size: 21px;
    }

}

@media all and (max-width:1000px){
    .image-join-contact-surabaya{max-width:85%;}
    .hotline-info-text {
        width: 20%;
        font-size: 11px;
    }
    .franchise-join-address {
        font-size: 14px;
    }

    .number-step-text {
        top: 5px;
        left: 20px;
        font-size: 13px;
    }

    .join-master-step-container {
        font-size: 12px;
        /* padding: 2% 2% 2% 2%; */
    }

    .join-master-step-container-even {
        font-size: 12px;
    }

    .master-condition-title {
        width: 70%;
        font-size: 24px;
        white-space: normal;
    }
    .who-left-part {
        width: 30%;
        float: left;
    }
    .who-right-part {
        width: 70%;
        font-size: 24px;
        white-space: nowrap;
    }

    .master-image-condition {
        width: 30%;
        float: left;
    }

    .howto-item-row-1 {
        width: 33%;
        float: left;
        padding: 3%;
    }

    .howto-item-row-2 {
        width: 50%;
        float: left;
        padding: 5%;
    }

    .howto-row-2 {
        margin: auto;
        width: 75%;
    }

    .howto-number-text {
        left: 0px;
        top: 5px;
    }

    /* .budget-container-value {
        left: 198px;
    } */

    .border-budget-accordion {
        width: 50%;
    }

    .accordion-button-2 {
        width: 45%;
        height: 35px;
        margin-left: 55%;
    }

    .accordion-button-white {
        width: 45%;
        height: 35px;
        margin-left: 55%;
    }

    .accordion-button-3 {
        width: 45%;
        height: 35px;
        margin-left: 55%;
    }
    .accordion-button-4 {
        width: 45%;
        height: 35px;
        margin-left: 55%;
    }

    .accordion-button-yellow {
        width: 45%;
        height: 35px;
        margin-left: 55%;
    }
    .accordion-button-5 {
        width: 45%;
        height: 35px;
        margin-left: 55%;
    }
    .accordion-button-6 {
        width: 45%;
        height: 35px;
        margin-left: 55%;
    }
    .accordion-button-7 {
        width: 45%;
        height: 35px;
        margin-left: 55%;
    }
    .accordion-button-2 {
        width: 45%;
        height: 35px;
        margin-left: 55%;
    }

    .accordion-button-white {
        width: 45%;
        height: 35px;
        margin-left: 55%;
    }

    .btn-facility {
        min-height: 10px;
        width: 270px;
        height: 34px;
        background-size: cover;
    }

    .btn-facility-nonactive {
        min-height: 10px;
        width: 270px;
        height: 34px;
        background-size: cover;
    }

    .btn-facility-nonactive:hover{
        min-height: 10px;
        width: 270px;
        height: 34px;
        background-size: cover;
    }

    .btn-master-facility {
        width: 295px;
        height: 33px;
        margin-bottom: 15px;
        font-size: 9px;
    }

    .btn-master-facility-nonactive {
        width: 295px;
        height: 33px;
        margin-bottom: 15px;
        font-size: 9px;
    }

    .btn-master-facility-nonactive:hover{
        width: 295px;
        height: 33px;
        margin-bottom: 15px;
        font-size: 9px;
    }

    .budget-img-big {
        min-height: 385px;
    }
    
}

@media all and (max-width:950px){
    .franchise-join-address {
        font-size: 13px;
    }
    .join-information-text {
        font-size: 15px;
    }
    .join-information-interest-text {
        font-size: 16px;
    }
    .want-join-left {
        font-size: 15px;
    }

    .number-join-text {
        font-size: 14px;
        top: 10px;
        left: 13px;
    }

    .number-join-text-2 {
        font-size: 14px;
        top: 10px;
        left: 10px;
    }

    .number-step-text {
        top: 5px;
        left: 19px;
        font-size: 13px;
    }

    .number-step-text-2 {
        top: 5px;
        left: 15px;
        font-size: 13px;
    }

    .master-franchise-who-right {
        padding-left: 5%;
    }

    .budget-container-name {
        width: 40%;
    }

    /* .budget-container-value {
        left: 235px;
    } */
    .number-content-1 {
        width: 15%;
        float: left;
    }

    .budget-position-circle-2 {
        top: 50px;
        right: -15px;
    }

    .budget-position-circle-2-small {
        top: 20px;
        right: -10px;
    }

    .payback-period-value-yellow {
        font-size: 30px;
    }

    .payback-period-value {
        font-size: 30px;
    }

    .budget-number-font {
        top: 8px;
        left: 15px;
    }


    .btn-facility {
        min-height: 10px;
        width: 240px;
        height: 30px;
        background-size: cover;
        font-size: 9px;
    }

    .btn-facility-nonactive {
        min-height: 10px;
        width: 240px;
        height: 30px;
        background-size: cover;
        font-size: 9px;
    }

    .btn-facility-nonactive:hover{
        min-height: 10px;
        width: 240px;
        height: 30px;
        background-size: cover;
        font-size: 9px;
    }


    .btn-master-facility {
        width: 285px;
        height: 33px;
        margin-bottom: 10px;
        font-size: 9px;
    }

    .btn-master-facility-nonactive {
        width: 285px;
        height: 33px;
        margin-bottom: 10px;
        font-size: 9px;
    }

    .btn-master-facility-nonactive:hover{
        width: 285px;
        height: 33px;
        margin-bottom: 10px;
        font-size: 9px;
    }

    .budget-container-name-3 {
        font-size: 20px;
        padding-left: 5%;
    }
}
@media all and (max-width:900px){
    .franchise-facility-condition {
        font-size: 24px;
    }

    .franchise-right-part {
        font-size: 24px;
    }

    .join-information-left-part {
        width: 30%;
        float: left;
    }
    .join-information-right-part {
        width: 70%;
        float: left;
    }

    .faq-content-left {
        width: 25%;
    }
    .faq-content-right {
        width: 75%;
        padding-left: 5%;
    }
    
    .number-step-text {
        top: 6px;
        left: 18px;
        font-size: 11px;
    }

    .number-step-text-2 {
        top: 7px;
        left: 16px;
        font-size: 11px;
    }

    .join-master-step-container {
        font-size: 12px;
        height: 45px;
    }

    .howto-text-content {
        font-size: 15px;
    }

    .howto-title-content {
        font-size: 14px;
        margin-top: 5%;
        margin-bottom: 5%;
    }

    .howto-number-text {
        left: 1px;
        top: 6px;
    }

    .howto-interest-content {
        width: 45%;
        float: left;
    }

    /* .budget-container-value {
        left: 225px;
    } */

    .provisions-text {
        font-size: 13px;
    }

    .provisions-text-2 {
        font-size: 13px;
    }

    .btn-master-facility {
        width: 265px;
        height: 30px;
        margin-bottom: 10px;
        font-size: 8px;
    }

    .btn-master-facility-nonactive {
        width: 265px;
        height: 30px;
        margin-bottom: 10px;
        font-size: 8px;
    }

    .btn-master-facility-nonactive:hover{
        width: 265px;
        height: 30px;
        margin-bottom: 10px;
        font-size: 8px;
    }

    .budget-img-big {
        min-height: 330px;
    }
}

@media all and (max-width:850px){
    .join-information-text {
        font-size: 14px;
    }
    .join-information-interest-text {
        font-size: 14px;
    }

    .surabaya-join-text {
        font-size: 13px;
    }

    .hotline-info-detail-text {
        font-size: 10px;
    }

    .hotline-info-text {
        width: 20%;
        font-size: 10px;
    }

    .want-join-left {
        font-size: 14px;
    }

    .number-join-text {
        font-size: 14px;
        top: 8px;
        left: 12px;
    }

    .number-join-text-2 {
        font-size: 14px;
        top: 8px;
        left: 8px;
    }
    .join-step-text {
        font-size:13px;
    }

    .category-name-text-faq {
        font-size: 26px;
        width: 100%;
    }

    .q-text {
        width: 10%;
    }

    .faq-question-text {
        width: 90%;
    }

    .a-text {
        width: 10%;
    }

    .faq-answer-text {
        width: 90%;
    }
    
    .number-step-text {
        top: 6px;
        left: 16px;
        font-size: 11px;
    }

    .number-step-text-2 {
        top: 7px;
        left: 14px;
        font-size: 11px;
    }

    .howto-number-text {
        left: 0px;
        top: 7px;
    }

    .interest-right-1 {
        font-size: 14px;
    }

    .interest-text-right {
        width: 70%;
        font-size: 11px;
    }

    .interest-text-left {
        width: 30%;
        font-size: 10px;
    }

    /* .budget-container-value {
        left: 214px;
    } */

    .budget-container-name {
        font-size: 21px;
    }
   
    .accordion-button-1 {
        width: 21%;
        height: 35px;
        margin-left: 71%;
    }
    .border-budget-accordion-1 {
        width: 63%;
        margin-left: 5%;
    }

    .budget-total-spend-text {
        width: 60%;
    }

    .budget-currency-spend-text {
        width: 40%;
    }

    .income-budget {
        font-size: 13px;
    }

    .spending-budget {
        font-size: 13px;
    }

    .cost-budget {
        font-size: 13px;
    }

    .income-budget-yellow {
        font-size: 13px;
    }

    .spending-budget-yellow {
        font-size: 13px;
    }

    .cost-budget-yellow {
        font-size: 13px;
    }


    .income-budget-yellow-2 {
        font-size: 13px;
    }

    .spending-budget-yellow-2 {
        font-size: 13px;
    }

    .cost-budget-yellow-2 {
        font-size: 13px;
    }

    .budget-position-circle-2 {
        top: 35px;
        right: -30px;
    }

    .budget-position-circle-2-small {
        top: 20px;
        right: -20px;
    }

    .budget-container-name-3 {
        font-size: 19px;
    }

    .payback-period-value-yellow {
        font-size: 28px;
    }

    .payback-period-value {
        font-size: 28px;
    }

    .payback-period-text {
        font-size: 13px;
    }

    .budget-number-font {
        top: 0px;
        left: 15px;
        font-size: 13px;
    }

    .provision-list-icon {
        font-size: 13px;
    }

    .budget-container-description {
        font-size: 14px;
    }

    .btn-facility {
        min-height: 10px;
        width: 215px;
        height: 27px;
        background-size: cover;
        font-size: 8px;
    }

    .btn-facility {
        min-height: 10px;
        width: 225px;
        height: 28px;
        background-size: cover;
        font-size: 9px;
    }


    .btn-facility-nonactive {
        min-height: 10px;
        width: 225px;
        height: 28px;
        background-size: cover;
        font-size: 9px;
    }

    .btn-facility-nonactive:hover{
        min-height: 10px;
        width: 225px;
        height: 28px;
        background-size: cover;
        font-size: 9px;
    }

    .franchise-list-button {
        top: 0px;
        left: -20px;
    }

    .mfbudget-text-left {
        font-size: 14px;
    }

    .mfbudget-text-right {
        font-size: 14px;
    }

    .email-contact-master-budget {
        font-size: 14px;
    }

    #section-masterfranchise-budget-1 {
        padding: 75px 5% 150pX 5%;
    }
}


@media all and (max-width:800px){
    ul.list-facility {
        font-size: 16px;
    }

    .franchise-facility-condition {
        font-size: 22px;
    }

    .franchise-right-part {
        font-size: 22px;
    }
    .join-information-text {
        font-size: 13px;
    }
    .join-information-interest-text {
        font-size: 13px;
    }

    .franchise-join-address {
        font-size: 11px;
    }

    .number-step-text {
        top: 7px;
        left: 16px;
        font-size: 9px;
    }

    .number-step-text-2 {
        top: 7px;
        left: 14px;
        font-size: 9px;
    }

    .howto-title-content {
        font-size: 12px;
    }

    .howto-text-content {
        font-family: 'gibsonregular';
        font-size: 14px;
        color: #4a4a49;
    }

    .howto-item-row-1 {
        width: 33%;
        float: left;
        padding: 5%;
    }

    .howto-number-text {
        left: 0px;
        top: 11px;
        font-size: 11px;
    }

    /* .budget-container-value {
        left: 203px;
    } */


    /* .accordion-button-1 {
        font-size: 11px;
    } */
    .accordion-button-2 {
        font-size: 11px;
    }

    .accordion-button-white {
        font-size: 11px;
    }

    .accordion-button-white {
        font-size: 11px;
    }
    .accordion-button-3 {
        font-size: 11px;
    }
    .accordion-button-4 {
        font-size: 11px;
    }

    .accordion-button-yellow {
        font-size: 11px;
    }
    .accordion-button-5 {
        font-size: 11px;
    }
    .accordion-button-6 {
        font-size: 11px;
    }
    .accordion-button-7 {
        font-size: 11px;
    }
    

    .btn-facility {
        min-height: 10px;
        width: 215px;
        height: 27px;
        background-size: cover;
        font-size: 8px;
        margin-top: 15px;
    }

    .btn-facility-nonactive {
        min-height: 10px;
        width: 215px;
        height: 27px;
        background-size: cover;
        font-size: 8px;
        margin-top: 15px;
    }

    .btn-facility-nonactive:hover{
        min-height: 10px;
        width: 215px;
        height: 27px;
        background-size: cover;
        font-size: 8px;
        margin-top: 15px;
    }


    .btn-master-facility {
        width: 245px;
        height: 28px;
        margin-bottom: 10px;
        font-size: 8px;
    }

    .btn-master-facility-nonactive {
        width: 245px;
        height: 28px;
        margin-bottom: 10px;
        font-size: 8px;
    }

    .btn-master-facility-nonactive:hover{
        width: 245px;
        height: 28px;
        margin-bottom: 10px;
        font-size: 8px;
    }

    .facility-2-interest-text {
        font-size: 15px;
        margin-top: 10%;
        margin-bottom: 15%;
    }

    .budget-container-name-3 {
        font-size: 19px;
        padding-left: 8%;
    }    

    .payback-period-value-yellow {
        font-size: 25px;
    }

    .payback-period-value {
        font-size: 25px;
    }

    .budgetcontent-left {
        min-height: 325px;
    }

    .budgetcontent-right {
        min-height: 325px;
    }

    .budget-container-name-3 {
        font-size: 15px;
        padding-left: 10%;
    }
    
    .budget-container-name {
        font-size: 16px;
    }
}

@media all and (max-width:750px){
    .join-information-text {
        font-size: 12px;
    }
    .join-information-interest-text {
        font-size: 12px;
    }

    .number-join-text {
        font-size: 13px;
        top: 6px;
        left: 10px;
    }

    .number-join-text-2 {
        font-size: 13px;
        top: 7px;
        left: 7px;
    }

    .number-step-text {
        top: 6px;
        left: 15px;
        font-size: 9px;
    }
    .number-step-text-2 {
        top: 6px;
        left: 13px;
        font-size: 9px;
    }

    .howto-number-text {
        left: 0px;
        top: 13px;
        font-size: 11px;
    }

    /* .budget-container-value {
        left: 190px;
    } */

    .budget-position-circle-2 {
        top: 25px;
        right: -40px;
    }

    .budget-position-circle-2-small {
        top: 20px;
        right: -30px;
    }

    .payback-period-text {
        font-size: 12px;
    }

    .payback-period-value-yellow {
        font-size: 25px;
    }

    .payback-period-value {
        font-size: 25px;
    }

    .budget-number-font {
        top: 12px;
        left: 15px;
        font-size: 13px;
    }

  

    .provisions-text {
        font-size: 12px;
    }
    .provisions-text-2 {
        font-size: 12px;
    }

    .provision-list-icon {
        font-size: 12px;
    }


    .btn-facility {
        min-height: 10px;
        width: 205px;
        height: 26px;
        background-size: cover;
        font-size: 8px;
        margin-top: 15px;
    }

    .btn-facility-nonactive {
        min-height: 10px;
        width: 205px;
        height: 26px;
        background-size: cover;
        font-size: 8px;
        margin-top: 15px;
    }

    .btn-facility-nonactive:hover{
        min-height: 10px;
        width: 205px;
        height: 26px;
        background-size: cover;
        font-size: 8px;
        margin-top: 15px;
    }


    .btn-master-facility {
        width: 225px;
        height: 26px;
        margin-bottom: 10px;
        font-size: 8px;
    }

    .btn-master-facility-nonactive {
        width: 225px;
        height: 26px;
        margin-bottom: 10px;
        font-size: 8px;
    }

    .btn-master-facility-nonactive:hover{
        width: 225px;
        height: 26px;
        margin-bottom: 10px;
        font-size: 8px;
    }

    .budget-img-big {
        min-height: 275px;
    }
    
    .budget-pos-relative {
        position: relative;
        left: -15px;
        top: -10px;
    }
}
@media all and (max-width:700px){

    .franchise-list-button {
        position: absolute;
        top: -15px;
        color: white;
        padding: 5%;
        margin-left: 5%;
    }
    #section-franchise-facility{display:none;}
    #section-franchise-facility-mobile{display:block;}
    #section-franchise-facility-2{display:none;}
    #section-franchise-facility-2-mobile{display:block;}

    ul.list-facility {
        margin-bottom: 5%;
        font-size:15px;
    }

    .facility-2-interest-text {
        font-family: 'gibsonregular';
        font-size: 18px;
        color: #3c3c3b;
        white-space: nowrap;
        margin-top: 5%;
        margin-bottom: 5%;
    }

    .button-facility-here {
        padding-top: 9px;
        /* padding: 1% 3% 3% 3%; */
    }

    .franchise-right-part {
        font-size: 24px;
    }

    .facility-2-interest-text {
        font-size: 17px;
    }

    .franchise-facility-condition {
        font-size: 24px;
    }

    .image-franchise-facility {
        width: 20%;
    }

    .franchise-facility-condition {
        width: 80%;
    }

    .franchise-left-part {
        width: 20%;
    }

    .franchise-right-part {
        width: 80%;
    }


    /* Franchise Join */
    #section-franchise-join{display:none;}
    #section-franchise-join-2{display:none;}
    #section-franchise-join-mobile{display:block;}
    #section-franchise-join-2-mobile{display:block;}

    .join-step-content-left {
        width: 100%;
        padding-right: 0%;
    }

    .number-join-text {
        font-size: 12px;
        top: 11px;
        left: 49px;
    }

    .number-join-text-2 {
        font-size: 12px;
        top: 11px;
        left: 47px;
    }

    .franchise-join-separator {
        background-size: contain;
        height: 5px;
    }

    .franchise-join-information-container {
        display:none;
    }

    .button-franchise-join {
        padding-top: 10px;
    }

    .hotline-info-text {
        width: 20%;
        font-size: 12px;
    }

    .hotline-info-detail-text {
        width: 80%;
        font-size: 13px;
    }

    .join-step-text {
        padding: 1%;
    }

    .join-information-interest-text {
        font-size: 15px;
    }

    .join-information-text {
        font-size: 15px;
    }

    .franchise-join-address {
        font-size: 15px;
    }

    .surabaya-join-text {
        font-size: 14px;
    }

    .join-information-left-part {
        width: 40%;
    }

    .join-information-right-part {
        width: 60%;
    }

    .number-join-position {
        width: 15%;
        text-align: left;
        padding-left: 5%;
    }

    .join-step-text {
        width: 85%;
        padding: 1%;
        font-size:14px;
    }

    /* Franchise FAQ Mobile */
    #section-franchise-faq{display:none;}
    #section-franchise-faq-mobile{display:block;}

    .category-name-text-faq {
        width: 100%;
        font-size: 26px;
    }

    .img-faq-icon {
        max-width: 60%;
    }

    .faq-question-text {
        font-size: 15px;
        width: 95%;
    }

    .q-text {
        font-size: 15px;
        width: 5%;
    }

    .a-text {
        font-size: 15px;
        width: 5%;
    }


    .faq-answer-text {
        font-size: 15px;
        width: 95%;
    }
    .faq-section-1 {
        background: #ffffff;
        padding: 30px 5% 30px 5%;
    }

    /* Master Franchise Facility  */
    #section-masterfranchise-who{display:none;}
    #section-masterfranchise-who-mobile{display:block;}
    .master-franchise-who-right {
        width: 100%;
        text-align: center;
        margin-bottom: 5%;
    }

    .who-right-part {
        font-size: 24px;
        white-space: normal;
        width:80%;
    }

    .who-text {
        font-size: 15px;
    }

    #section-master-condition{display:none;}
    #section-master-condition-mobile{display:block;}

    .condition-text-left {
        width: 100%;
        margin-bottom:5%;
    }

    #section-master-facility{display:none;}
    #section-master-facility-mobile{display:block;}

    .master-facility-part {
        width: 100%;
        margin-bottom: 5%;
        padding-right: 0%;
    }

    .baba-rafi-facility-text {
        font-size: 15px;
        padding-left: 0%;
    }

    .join-master-step-container {
        background: url('../img/franchise/masterfranchisefacility/list-content.png') no-repeat;
        background-size: cover;
        width: 100%;
        height: 50px;
        font-family: 'touchebold';
        font-size: 13px;
        color: #3c3c3b;
        padding: 0% 0% 0% 0%;
    }

    .join-master-step-container-even {
        width: 100%;
        height: 50px;
        padding: 0% 0% 0% 0%;
        font-family: 'touchebold';
        font-size: 13px;
        color: #3c3c3b;
    }

    .join-step-left-part {
        position: relative;
        width: 10%;
        float: left;
        padding-left: 3%;
        padding-top: 1%;
        /* padding: 2% 2% 2% 2%; */
    }

    .number-step-text {
        position: absolute;
        font-family: 'gibsonbold_italic';
        font-size: 12px;
        color: #2e2d2c;
        top: 14px;
        left: 33px;
    }

    .number-step-text-2 {
        position: absolute;
        font-family: 'gibsonbold_italic';
        font-size: 12px;
        color: #2e2d2c;
        top: 13px;
        left: 30px;
    }
    #section-master-facility-information{display:none;}
    #section-master-facility-information-mobile{display:block;}

    .background-information {
        background: #2e2e2d;
        color: white;
        width: 90%;
        position: relative;
        margin: 0 auto;
        padding: 10% 5% 10% 5%;
        top: -205px;
    }
   
    .master-condition-title {
        width: 80%;
        font-size: 24px;
        white-space: normal;
    }
    .criteria-text {
        font-size: 13px;
    }

    .master-information-text {
        font-size: 16px;
    }

    .master-image-condition {
        width: 20%;
        float: left;
    }

    .who-left-part {
        width: 20%;
        float: left;
    }

    /* Master Franchise How To  */
    #section-masterfranchise-howto{display:none;}
    #section-masterfranchise-howto-mobile{display:block;}
    #section-howto-interest{display:none;}
    #section-howto-interest-mobile{display:block;}

    .howto-number-text {
        font-size: 13px;
        text-align: left;
        left: 12px;
        top: 5px;
    }

    .box2 {
        margin-bottom: 1%;
    }

    .image-howto-left {
        width: 10%;
        float: left;
    }
    .image-howto-right {
        width: 90%;
        float: left;
    }

    .howto-interest-content {
        width: 100%;
    }

    .interest-right-1 {
        width: 100%;
        font-size: 15px;
        line-height: 25px;
        margin-bottom: 5%;
    }

    .interest-address-text {
        white-space: normal;
        font-size: 15px;
    }

    .howto-information-content-left {
        width: 100%;
        padding-right: 0%;
    }
    
    .howto-information-content {
        margin-top: -15%;
        padding-left: 0%;
        padding-right: 0%;
    }

    .howto-information-content {
        margin-top: -40%;
        padding-left: 0%;
        padding-right: 0%;
    }

    .howto-information-content-right {
        width: 100%;
        float: left;
        margin-top: 5%;
        padding-left: 0%;
    }

    .button-howto-here {
        padding: 2% 2% 2% 2%;
        padding-top: 8px;
    }

    .howto-interest-container {
        padding: 100px 5% 100px 5%;
    }

    .interest-text-left {
        font-size: 12px;
        width: 20%;
    }

    .interest-text-right {
        font-size: 13px;
        width:80%;
    }

    .interest-left-2 {
        width: 35%;
        float: left;
    }

    .interest-right-2 {
        width: 60%;
        float: left;
        margin-left: 5%;
    }

    .howto-title-content {
        font-size: 17px;
    }

    .howto-text-content {
        font-size: 15px;
    }

    .regular-content-left {
        width: 100%;
        padding-left: 5%;
        padding-right: 5%;
        margin-bottom: 5%;
    }

    .syariah-content-right {
        width: 100%;
        padding-left: 5%;
        padding-right: 5%;
    }

    .flex-content {
        flex: 100%;
        padding-left: 5%;
        padding-right: 5%;
    }


    .background-budget-white {
        width: 100%;
        padding: 50px 0% 0px 0%;
        background: #f2ebe4;
    }

    .flex-background-yellow {
        padding: 0px 0% 0px 0%;
        background: #f2ebe4;
    }

    .flex-background-gray {
        padding: 0px 0% 0px 0%;
    }

    .payback-period-value {
        color: #f4b000;
    }

    .budgetcontent-left{display:none;}
    .budgetcontent-right{display:none;}
    .budgetcontent-left-mobile{display:block;}
    .budgetcontent-right-mobile{display:block; text-align: center;}

    .value-circle-content {
        width: 33%;
        float: right;
    }

    .value-circle-position {
        position: relative;
        top: 135px;
    }

    .budget-container-value {
        width: 7%;
    }

    .million-text {
        left: 11px;
        top: -20px;
    }

    .million-text-3{
        left: -40px;
    }

    .budget-padding-1 {
        padding: 5% 5% 5% 5%;
    }

    .budget-img-big {
        width: 100%;
        text-align: center;
        min-height: 400px;
    }

    /* .budget-position-circle-2 {
        top: 155px;
        right: -440px;
        width: 20%;
    } */

    .budget-container-name-2 {
        top: 20px;
        left: 25px;
    }

    .budget-position-circle-2-small {
        top: 10px;
        right: 150px;
    }

    /* .budget-container-name-2-small {
        top: 15px;
        left: 45px;
    } */

    .border-budget-accordion {
        width: 69%;
    }

    .accordion-button-1 {
        width: 24%;
        height: 40px;
        margin-left: 71%;
        padding-top: 6px;
        padding-right: 0%;
    }

    .accordion-button-2 {
        width: 27%;
        height: 40px;
        margin-left: 73%;
        padding-top: 8px;
        padding-right: 0%;
        padding-bottom: 15px;
    }

    .accordion-button-white {
        width: 27%;
        height: 40px;
        margin-left: 73%;
        padding-top: 8px;
        padding-right: 0%;
        padding-bottom: 15px;
    }
    .accordion-button-3 {
        width: 27%;
        height: 40px;
        margin-left: 73%;
        padding-top: 8px;
        padding-right: 0%;
        padding-bottom: 15px;
    }
    .accordion-button-4 {
        width: 27%;
        height: 40px;
        margin-left: 73%;
        padding-top: 8px;
        padding-right: 0%;
        padding-bottom: 15px;
    }

    .accordion-button-yellow {
        width: 27%;
        height: 40px;
        margin-left: 73%;
        padding-top: 8px;
        padding-right: 0%;
        padding-bottom: 15px;
    }

    .accordion-button-5 {
        width: 27%;
        height: 40px;
        margin-left: 73%;
        padding-top: 8px;
        padding-right: 0%;
        padding-bottom: 15px;
    }
    .accordion-button-6 {
        width: 27%;
        height: 40px;
        margin-left: 73%;
        padding-top: 8px;
        padding-right: 0%;
        padding-bottom: 15px;
    }
    .accordion-button-7 {
        width: 27%;
        height: 40px;
        margin-left: 73%;
        padding-top: 8px;
        padding-right: 0%;
        padding-bottom: 15px;
    }
    .budget-number-font {
        top: 0px;
        left: 15px;
        font-size: 12px;
    }

    .budget-container-name {
        font-size: 17px;
        margin-left: 5%;
    }

    .payback-period-text {
        font-size: 11px;
    }
    
    .payback-period-value-yellow {
        font-size: 29px;
    }

    .payback-period-value {
        font-size: 29px;
    }

    .accordion-budget-1 {
        background-color: #f2ebe4;
    }

    .accordion-budget-2 {
        background-color: #f2ebe4;
    }

    .accordion-budget-white {
        background-color: #f2ebe4;
    }
    .accordion-budget-3 {
        background-color: #f2ebe4;
    }
    .accordion-budget-4 {
        background-color: #f2ebe4;
    }

    .accordion-budget-yellow {
        background-color: #f2ebe4;
    }

    .accordion-budget-5 {
        background-color: #f2ebe4;
    }
    .accordion-budget-6 {
        background-color: #f2ebe4;
    }
    .accordion-budget-7 {
        background-color: #f2ebe4;
    }

    .number-content-1 {
        width: 20%;
        float: left;
    }
    
    .border-budget-accordion-1 {
        width: 63%;
        margin-left: 5%;
    }

    .border-budget-accordion {
        width: 70%;
    }

    .accordion-button-1 {
        width: 21%;
        margin-left: 75%;
        font-size: 9px;
    }

    .accordion-button-1:after {
        top: -8px;
        right: 5px;
    }

    .accordion-button-2 {
        width: 24%;
        margin-left: 77%;
        font-size: 9px;
    }

    .accordion-button-white {
        width: 24%;
        margin-left: 77%;
        font-size: 9px;
    }
    .accordion-button-3 {
        width: 24%;
        margin-left: 77%;
        font-size: 9px;
    }
    .accordion-button-4 {
        width: 24%;
        margin-left: 77%;
        font-size: 9px;
    }

    .accordion-button-yellow {
        width: 24%;
        margin-left: 77%;
        font-size: 9px;
    }
    .accordion-button-5 {
        width: 24%;
        margin-left: 77%;
        font-size: 9px;
    }
    .accordion-button-6 {
        width: 24%;
        margin-left: 77%;
        font-size: 9px;
    }
    .accordion-button-7 {
        width: 24%;
        margin-left: 77%;
        font-size: 9px;
    }


    .accordion-button-2:after {
        top: -8px;
        right: 7px;
    }

    .accordion-button-white:after {
        top: -8px;
        right: 7px;
    }
    .accordion-button-3:after {
        top: -8px;
        right: 7px;
    }
    .accordion-button-4:after {
        top: -8px;
        right: 7px;
    }

    .accordion-button-yellow:after {
        top: -8px;
        right: 7px;
    }
    .accordion-button-5:after {
        top: -8px;
        right: 7px;
    }
    .accordion-button-6:after {
        top: -8px;
        right: 7px;
    }
    .accordion-button-7:after {
        top: -8px;
        right: 7px;
    }
 

    .btn-facility {
        margin-top: 20px;
        background: url('../img/franchise/franchisefacility/list-button-active.png') no-repeat;
        background-size: contain;
        width: 495px;
        min-height: 65px;
        padding: 3% 3% 3% 15%;
        text-align: left;
        font-family: 'touchebold';
        font-size: 15px;
        color: #2e2d2c;
    }
    
    .btn-facility-nonactive{
        margin-top: 20px;
        background: url('../img/franchise/franchisefacility/list-button.png') no-repeat;
        background-size:contain;
        width: 495px;
        min-height: 65px;
        padding: 3% 3% 3% 15%;
        text-align: left;
        font-family: 'touchebold';
        font-size: 15px;
        color: #ffcc00;
    }
    
    .btn-facility-nonactive a{
        font-family: 'touchebold';
        font-size: 15px;
        /* color: #ffcc00; */
        color: #2e2d2c;
    } 
    
    .btn-facility-nonactive:hover{
        margin-top: 20px;
        background: url('../img/franchise/franchisefacility/list-button-active.png') no-repeat;
        background-size:contain;
        width: 495px;
        height: 65px;
        padding: 3% 3% 3% 15%;
        text-align: left;
        font-family: 'touchebold';
        font-size: 15px;
        color: #2e2d2c;
        cursor:pointer;
    }

    .btn-master-facility {
        margin-top: 0px;
        background: url('../img/franchise/masterfranchisefacility/list-button-active.png') no-repeat;
        width: 525px;
        min-height: 60px;
        padding: 3% 3% 3% 15%;
        text-align: left;
        font-family: 'touchebold';
        font-size: 15px;
        color: #ffcc00;
        background-size: cover;
        margin-bottom: 20px;
    }
    
    
    .btn-master-facility-nonactive{
        margin-top: 0px;
        background: url('../img/franchise/masterfranchisefacility/list-button-active-2.png') no-repeat;
        background-size: contain;
        width: 525px;
        min-height: 60px;
        padding: 3% 3% 3% 15%;
        text-align: left;
        font-family: 'touchebold';
        font-size: 15px;
        color: #2e2d2c;
        background-size: cover;
        margin-bottom :20px;
    }
    
    
    .btn-master-facility-nonactive:hover{
        margin-top: 20px;
        background: url('../img/franchise/masterfranchisefacility/list-button-active.png') no-repeat;
        width: 525px;
        min-height: 60px;
        padding: 3% 3% 3% 15%;
        text-align: left;
        font-family: 'touchebold';
        font-size: 15px;
        color: #ffcc00;
        background-size: cover;
        margin-bottom :20px;
    }

    .budget-container-name-3 {
        font-size: 17px;
        padding-left: 3%;
    }


    /* Master Franchise Budget*/

    .mfbudget-text-left {
        font-size: 17px;
        padding: 10% 0% 10% 0%;
    }

    .mfbudget-text-right {
        font-size: 17px;
        /* display:none; */
    }

    .email-contact-master-budget {
        font-size: 17px;
    }

    .masterfranchisebudget-column {
        width: 100%;
        float: left;
    }

    .masterfranchisebudgetyellowcontent {
        padding: 50px 5% 50px 5%;
        margin-top: 10%;
    }

    .value-circle-content {
        top: 135px;
        left: 30px;
    }

    .budget-position-circle-2 {
        top: 40px;
        right: 73px;
    }

    #section-franchise-budget-bottom-mobile{
        display:block;
    }

    .budget-pos-relative {
        position: relative;
        left: -15px;
        top: -7px;
    }
}

@media all and (max-width:650px){
    .number-join-text {
        font-size: 12px;
        top: 11px;
        left: 47px;
    }

    .number-join-text-2 {
        font-size: 12px;
        top: 11px;
        left: 44px;
    }

    .number-step-text {
        top: 14px;
        left: 31px;
    }

    .number-step-text-2 {
        top: 13px;
        left: 28px;
    }

    .budget-container-value {
        width: 7%;
    }

    /* .budget-container-name-2 {
        top: 15px;
        left: 31px;
    } */
    
    /* .budget-position-circle-2-small {
        top: 110px;
        right: -345px;
        width: 20%;
    } */

    .budget-container-name-2-small {
        top: 15px;
        left: 40px;
    }

    .budget-position-circle-2 {
        top: 40px;
        right: 59px;
    }
}

@media all and (max-width:600px){
    .border-mobile-facility-separator {
        height: 9px;
    }

    .number-join-text {
        font-size: 12px;
        top: 11px;
        left: 45px;
    }

    .number-join-text-2 {
        font-size: 12px;
        top: 11px;
        left: 42px;
    }

    .look-detail-faq {
        font-family: 'touchemedium';
        font-size: 14px;
        color: #2e2d2c;
        position: relative;
        top: 16px;
        left: 25px;
    }


    .number-step-text {
        top: 14px;
        left: 30px;
    }

    .number-step-text-2 {
        top: 13px;
        left: 27px;
    }

    .budget-container-value {
        width: 7%;
    }

    /* .budget-container-name-2 {
        top: 15px;
        left: 28px;
    } */

    /* .budget-position-circle-2 {
        top: 155px;
        right: -406px;
        width: 20%;
    } */

    /* .budget-position-circle-2-small {
        top: 110px;
        right: -305px;
        width: 20%;
    } */

    .budget-position-circle-2-small {
        top: 5px;
        right: 110px;
    }

    .budget-container-name-2-small {
        top: 15px;
        left: 36px;
    }

    .btn-master-facility {
        width: 485px;
        min-height: 55px;
        font-size: 15px;
    }

    .btn-master-facility-nonactive{
        width: 485px;
        min-height: 55px;
        font-size: 15px;
    }
    
    
    .btn-master-facility-nonactive:hover{
        width: 485px;
        min-height: 55px;
        font-size: 15px;
    }

    .budget-position-circle-2 {
        top: 40px;
        right: 46px;
    }
}

@media all and (max-width:550px){
    .number-join-text {
        font-size: 12px;
        top: 11px;
        left: 43px;
    }

    .number-join-text-2 {
        font-size: 12px;
        top: 11px;
        left: 40px;
    }

    .number-step-text {
        top: 13px;
        left: 29px;
    }

    .number-step-text-2 {
        top: 12px;
        left: 26px;
    }

    .master-image-condition {
        width: 25%;
        float: left;
    }

    .master-condition-title {
        width: 75%;
    }

    .who-left-part {
        width: 25%;
        float: left;
    }

    .who-right-part {
        width: 75%;
        float: left;
    }

    .budget-container-value {
        width: 7%;
    }

  

    /* .budget-position-circle-2 {
        top: 140px;
        right: -355px;
        width: 20%;
    } */

    /* .budget-container-name-2 {
        top: 15px;
        left: 25px;
    } */

    .budget-container-name-2-small {
        top: 15px;
        left: 31px;
    }


    .border-budget-accordion-1 {
        width: 55%;
        margin-left: 5%;
    }


    .accordion-button-1 {
        width: 25%;
        margin-left: 71%;
    }

    .accordion-button-2 {
        width: 28%;
        margin-left: 72%;
    }

    .accordion-button-white {
        width: 28%;
        margin-left: 72%;
    }
 
    .accordion-button-3 {
        width: 28%;
        margin-left: 72%;
    }

    .accordion-button-4 {
        width: 28%;
        margin-left: 72%;
    }

    .accordion-button-yellow {
        width: 28%;
        margin-left: 72%;
    }

    .accordion-button-5 {
        width: 28%;
        margin-left: 72%;
    }
    .accordion-button-6 {
        width: 28%;
        margin-left: 72%;
    }
    .accordion-button-7 {
        width: 28%;
        margin-left: 72%;
    }

    .border-budget-accordion {
        width: 65%;
    }

    .btn-master-facility {
        width: 370px;
        height: 40px;
        font-size: 11px;
        margin-bottom :20px;
        background-size:contain;
    }
    
    
    .btn-master-facility-nonactive{
        width: 370px;
        height: 40px;
        font-size: 11px;
        margin-bottom :20px;
        background-size:contain;
    }
    
    
    .btn-master-facility-nonactive:hover{
        width: 370px;
        height: 40px;
        font-size: 11px;
        margin-bottom :20px;
        background-size:contain;
    }

    .btn-facility {
        width: 410px;
        min-height: 55px;
        
    }

    .btn-facility-nonactive{
        width: 410px;
        min-height: 55px;
        margin-top:25px;
    }
    .btn-facility-nonactive:hover{
        width: 410px;
        min-height: 55px;
        margin-top:20px;
    }

    .budget-position-circle-2 {
        top: 40px;
        right: 7px;
    }
    
    .budget-position-circle-2-small {
        top: 5px;
        right: 80px;
    }
}
@media all and (max-width:500px){
    .border-mobile-facility-separator {
        height: 7px;
    }

    .image-franchise-facility {
        width: 25%;
    }

    .franchise-facility-condition {
        width: 75%;
    }

    .franchise-left-part {
        width: 25%;
    }

    .franchise-right-part {
        width: 75%;
    }

    .number-join-text {
        font-size: 12px;
        top: 11px;
        left: 41px;
    }

    .number-join-text-2 {
        font-size: 12px;
        top: 11px;
        left: 38px;
    }

    .category-name-text-faq {
        font-size: 25px;
    }

    .look-detail-faq {
        font-size: 11px;
        top: 14px;
        left: 25px;
    }

    .number-step-text {
        top: 12px;
        left: 27px;
    }

    .number-step-text-2 {
        top: 12px;
        left: 25px;
    }

    .budget-container-value {
        width: 7%;
    }

    /* .budget-container-name-2 {
        font-size: 22px;
    } */

    /* .budget-position-circle-2 {
        top: 125px;
        right: -305px;
        width: 20%;
    } */

    /* .million-text-3 {
        left: -36px;
        top: 15px;
    } */

    /* .budget-container-name-2-small {
        top: 20px;
        left: 31px;
        font-size: 22px;
    } */

    .million-text-3-small {
        left: -31px;
        top: 15px;
    }

    .budget-number-font {
        top: 11px;
        left: 16px;
        font-size: 12px;
    }

    .btn-facility {
        margin-top: 25px;
        width: 335px;
        min-height: 50px;
        font-size: 11px;
        background-size:contain;
    }

    .btn-facility-nonactive{
        margin-top: 25px;
        width: 335px;
        min-height: 50px;
        font-size: 11px;
        background-size:contain;
       
    }
    
   
    .btn-facility-nonactive:hover{
        margin-top: 25px;
        width: 335px;
        height: 50px;
        font-size: 11px;
        background-size:contain;
    }

    .accordion-button-2 {
        width: 31%;
        margin-left: 69%;
    }

    .accordion-button-white {
        width: 31%;
        margin-left: 69%;
    }
    .accordion-button-3 {
        width: 31%;
        margin-left: 69%;
    }
    .accordion-button-4 {
        width: 31%;
        margin-left: 69%;
    }

    .accordion-button-yellow {
        width: 31%;
        margin-left: 69%;
    }
    .accordion-button-5 {
        width: 31%;
        margin-left: 69%;
    }
    .accordion-button-6 {
        width: 31%;
        margin-left: 69%;
    }
    .accordion-button-7 {
        width: 31%;
        margin-left: 69%;
    }

    .border-budget-accordion {
        width: 62%;
    }

    .value-circle-content {
        top: 135px;
        left: 45px;
    }

    .budget-position-circle-2-small {
        top: 5px;
        right: 55px;
    }

}

@media all and (max-width:450px){
    .number-join-text {
        font-size: 12px;
        top: 11px;
        left: 38px;
    }

    .number-join-text-2 {
        font-size: 12px;
        top: 11px;
        left: 34px;
    }

    .join-step-text {
        width: 85%;
        padding: 1%;
        padding-left: 5%;
    }    

    .look-detail-faq {
        font-size: 9px;
        top: 14px;
        left: 20px;
    }

    .q-text {
        width: 10%;
    }
    .a-text {
        width: 10%;
    }
    .faq-question-text {
        width: 90%;
    }

    .faq-answer-text {
        width: 90%;
    }

    .number-step-text {
        top: 11px;
        left: 26px;
    }

    .number-step-text-2 {
        top: 12px;
        left: 23px;
    }

    .budget-container-value {
        left: 16px;
        width: 7%;
        top: 17px;
    }                                                                                                                                                                                                

    .budget-position-circle-2 {
        width: 87px;
        height: 87px;
        top: 39px;
        right: 26px;
    }

    .budget-container-name-2 {
        top: 17px;
        left: 20px;
    }

    /* .budget-container-name-2-small {
        top: 18px;
        left: 25px;
        font-size: 22px;
    } */

    .btn-master-facility {
        width: 340px;
        height: 40px;
        font-size: 11px;
        margin-bottom :20px;
        background-size:contain;
    }
    
    .btn-master-facility-nonactive{
        width: 340px;
        height: 40px;
        font-size: 11px;
        margin-bottom :20px;
        background-size:contain;
    }
    
    .btn-master-facility-nonactive:hover{
        width: 340px;
        height: 40px;
        font-size: 11px;
        margin-bottom :20px;
        background-size:contain;
    }

    .accordion-button-2 {
        width: 33%;
        margin-left: 67%;
        padding-top: 6px;
    }

    .accordion-button-white {
        width: 33%;
        margin-left: 67%;
        padding-top: 6px;
    }
    .accordion-button-3 {
        width: 33%;
        margin-left: 67%;
        padding-top: 6px;
    }
    .accordion-button-4 {
        width: 33%;
        margin-left: 67%;
        padding-top: 6px;
    }

    .accordion-button-yellow {
        width: 33%;
        margin-left: 67%;
        padding-top: 6px;
    }

    .accordion-button-5 {
        width: 33%;
        margin-left: 67%;
        padding-top: 6px;
    }
    .accordion-button-6 {
        width: 33%;
        margin-left: 67%;
        padding-top: 6px;
    }
    .accordion-button-7 {
        width: 33%;
        margin-left: 67%;
    }

    .accordion-button-7 {
        width: 33%;
        margin-left: 67%;
        padding-top: 6px;
    }

    .accordion-button-2:after {
        top: -9px;
        right: 7px;
    }

    .accordion-button-white:after {
        top: -9px;
        right: 7px;
    }
    .accordion-button-3:after {
        top: -9px;
        right: 7px;
    }
    .accordion-button-4:after {
        top: -9px;
        right: 7px;
    }

    .accordion-button-yellow:after {
        top: -9px;
        right: 7px;
    }

    .accordion-button-5:after {
        top: -9px;
        right: 7px;
    }
    .accordion-button-6:after {
        top: -9px;
        right: 7px;
    }
    .accordion-button-7:after {
        top: -9px;
        right: 7px;
    }

    .accordion-button-1 {
        width: 30%;
        margin-left: 66%;
        padding-top: 1px;
    }

    .value-circle-content-2 {
        width: 87px;
        height: 87px;
    }

    .value-circle-content {
        top: 90px;
        left: 15px;
    }

    .budget-position-circle-2-small {
        top: 15px;
        right: 40px;
        width: 87px;
        height: 87px;
    }

    .budget-container-name-2-small {
        top: 15px;
        left: 26px;
    }
    
}

@media all and (max-width:400px){
    .border-mobile-facility-separator {
        height: 6px;
    }

    .btn-facility {
        width: 310px;
    }

    .btn-facility-nonactive {
        width: 310px;
    }

    .btn-facility-nonactive:hover{
        width: 310px;
    }

    .image-franchise-facility {
        width: 30%;
    }

    .franchise-facility-condition {
        width: 70%;
    }

    .franchise-left-part {
        width: 30%;
    }

    .franchise-right-part {
        width: 70%;
    }

    .number-join-text {
        font-size: 12px;
        top: 11px;
        left: 34px;
    }

    .number-join-text-2 {
        font-size: 12px;
        top: 11px;
        left: 30px;
    }

    .look-detail-faq {
        font-size: 9px;
        top: 10px;
        left: 12px;
    }

    .category-name-text-faq {
        font-size: 24px;
    }

    .number-step-text {
        top: 9px;
        left: 21px;
    }
    .number-step-text-2 {
        top: 10px;
        left: 18px;
    }

    .who-right-part {
        padding-left: 5%;
    }

    .master-condition-title {
        padding-left: 5%;
    }

    .budget-container-value {
        width: 7%;
    }

    /* .budget-container-name-2-small {
        top: 12px;
        left: 21px;
        font-size: 22px;
    } */

    .budget-number-font {
        top: 8px;
        left: 14px;
        font-size: 12px;
    }

    .border-budget-accordion {
        width: 64%;
    }

    .border-budget-accordion-1 {
        width: 51%;
        margin-left: 5%;
    }

    .accordion-button-1 {
        width: 32%;
        margin-left: 63%;
    }

    .accordion-button-2 {
        width: 35%;
        margin-left: 64%;
        padding-top: 4px;
    }

    .accordion-button-white {
        width: 35%;
        margin-left: 64%;
        padding-top: 4px;
    }

    .accordion-button-3 {
        width: 35%;
        margin-left: 64%;
        padding-top: 4px;
    }
    .accordion-button-4 {
        width: 35%;
        margin-left: 64%;
        padding-top: 4px;
    }

    .accordion-button-yellow {
        width: 35%;
        margin-left: 64%;
        padding-top: 4px;
    }


    .accordion-button-5 {
        width: 35%;
        margin-left: 64%;
        padding-top: 4px;
    }
    .accordion-button-6 {
        width: 35%;
        margin-left: 64%;
        padding-top: 4px;
    }
    .accordion-button-7 {
        width: 35%;
        margin-left: 64%;
        padding-top: 4px;
    }

    .btn-master-facility {
        width: 320px;
        height: 30px;
        font-size: 11px;
        margin-bottom :20px;
        background-size:contain;
    }
    
    
    .btn-master-facility-nonactive{
        width: 320px;
        height: 30px;
        font-size: 11px;
        margin-bottom :20px;
        background-size:contain;
    }
    
    
    .btn-master-facility-nonactive:hover{
        width: 320px;
        height: 30px;
        font-size: 11px;
        margin-bottom :20px;
        background-size:contain;
    }

    .border-budget-accordion {
        width: 57%;
    }

    .budget-position-circle-2 {
        top: 40px;
        right: 12px;
    }

}

@media all and (max-width:370px){ 
    .budget-container-value {
        width: 7%;
    }
    .budget-position-circle-2 {
        top: 20px;
        right: 3px;
    }

    .budget-number-font {
        top: 7px;
        left: 12px;
        font-size: 12px;
    }

    .budget-position-circle-2-small {
        top: 5px;
        right: 20px;
    }
}

@media all and (max-width:360px){ 
    .budget-container-value {
        width: 7%;
    }

    /* .budget-container-name-2-small {
        top: 17px;
        left: 26px;
        font-size: 22px;
    } */

   
}

@media all and (max-width:350px){
    .btn-facility {
        width: 265px;
    }

    .btn-facility-nonactive {
        width: 265px;
    }

    .btn-facility-nonactive:hover{
        width: 265px;
    }
    .border-mobile-facility-separator {
        height: 5px;
    }

    .franchise-facility-condition {
        font-size: 20px;
    }
    .franchise-right-part {
        font-size: 20px;
    }

    ul.list-facility {
        font-size: 13px;
    }

    .facility-2-interest-text {
        font-size: 15px;
    }

    .number-join-text {
        font-size: 12px;
        top: 9px;
        left: 30px;
    }

    .number-join-text-2 {
        font-size: 12px;
        top: 9px;
        left: 26px;
    }

    .join-step-text {
        font-size:12px;
    }

    .join-information-text {
        font-size: 13px;
    }
    .hotline-info-detail-text {
        font-size: 12px;
    }
    .franchise-join-address {
        font-size: 14px;
    }

    .join-information-interest-text {
        font-size: 13px;
    }

    .want-join-mobile {
        font-size: 13px;
        color: #2e2d2c;
    }
    .hotline-info-text {
        width: 20%;
        font-size: 11px;
    }

    .category-name-text-faq {
        font-size: 22px;
    }

    .look-detail-faq {
        font-size: 9px;
        top: 8px;
        left: 8px;
    }

    .number-step-text {
        top: 9px;
        left: 20px;
        font-size: 10px;
    }

    
    .number-step-text-2 {
        top: 9px;
        left: 18px;
        font-size: 10px;
    }

    .master-condition-title {
        font-size: 22px;
    }

    .interest-text-left {
        font-size: 11px;
    }
    .interest-text-right {
        font-size: 11px;
    }

    .howto-title-content {
        font-size: 15px;
    }

    .budget-container-value {
        width: 7%;
    }

    .budget-number-font {
        top: 6px;
        left: 11px;
        font-size: 12px;
    }


    .accordion-button-1 {
        width: 34%;
        margin-left: 60%;
        padding-top: 0px;
    }

    .accordion-button-2 {
        width: 38%;
        margin-left: 61%;
        padding-top: 1%;
    }

    .accordion-button-white {
        width: 38%;
        margin-left: 61%;
        padding-top: 1%;
    }


    .accordion-button-3 {
        width: 38%;
        margin-left: 61%;
        padding-top: 1%;
    }

    .accordion-button-4 {
        width: 38%;
        margin-left: 61%;
        padding-top: 1%;
    }

    .accordion-button-yellow {
        width: 38%;
        margin-left: 61%;
        padding-top: 1%;
    }

    .accordion-button-5 {
        width: 38%;
        margin-left: 61%;
        padding-top: 1%;
    }

    .accordion-button-6 {
        width: 38%;
        margin-left: 61%;
        padding-top: 1%;
    }
    .accordion-button-7 {
        width: 38%;
        margin-left: 61%;
        padding-top: 1%;
    }
    .accordion-button-2:after {
        top: -7px;
        right: 7px;
    }

    .accordion-button-white:after {
        top: -7px;
        right: 7px;
    }
    .accordion-button-3:after {
        top: -7px;
        right: 7px;
    }
    .accordion-button-4:after {
        top: -7px;
        right: 7px;
    }

    .accordion-button-yellow:after {
        top: -7px;
        right: 7px;
    }
    .accordion-button-5:after {
        top: -7px;
        right: 7px;
    }
    .accordion-button-6:after {
        top: -7px;
        right: 7px;
    }
    .accordion-button-7:after {
        top: -7px;
        right: 7px;
    }
    .payback-period-value {
        font-size: 25px;
    }

    .payback-period-value-yellow {
        font-size: 25px;
    }

    .btn-master-facility {
        width: 300px;
        height: 40px;
        font-size: 11px;
        margin-bottom :10px;
        background-size:contain;
    }
    
    
    .btn-master-facility-nonactive{
        width: 300px;
        height: 40px;
        font-size: 11px;
        margin-bottom :10px;
        background-size:contain;
    }
    
    
    .btn-master-facility-nonactive:hover{
        width: 300px;
        height: 40px;
        font-size: 11px;
        margin-bottom :10px;
        background-size:contain;
    }

    .mfbudget-text-left {
        font-size: 15px;
    }

    .mfbudget-text-right {
        font-size: 15px;
    }

    .email-contact-master-budget {
        font-size: 15px;
    }
}


@media all and (max-width:330px){
    .number-join-text {
        font-size: 12px;
        top: 8px;
        left: 28px;
    }

    .number-join-text-2 {
        font-size: 12px;
        top: 8px;
        left: 25px;
    }
    .hotline-info-detail-text {
        font-size: 11px;
    }

    .franchise-join-address {
        font-size: 13px;
    }

    .number-step-text {
        top: 8px;
        left: 18px;
    }

   

    .number-step-text-2 {
        top: 9px;
        left: 15px;
    }
    .budget-container-value {
        width: 7%;
    }

    /* .budget-position-circle-2 {
        top: 102px;
        right: -220px;
        width: 25%;
    } */

    /* .budget-container-name-2 {
        top: 16px;
        left: 15px;
    } */

    /* .budget-container-name-2-small {
        top: 13px;
        left: 22px;
        font-size: 22px;
    } */
    .budget-number-font {
        top: 6px;
        left: 11px;
        font-size: 12px;
    }

    .btn-master-facility {
        width: 270px;
        height: 40px;
        font-size: 10px;
        margin-bottom :10px;
        background-size:contain;
    }
    
    
    .btn-master-facility-nonactive{
        width: 270px;
        height: 40px;
        font-size: 10px;
        margin-bottom :10px;
        background-size:contain;
    }
    
    
    .btn-master-facility-nonactive:hover{
        width: 270px;
        height: 40px;
        font-size: 10px;
        margin-bottom :10px;
        background-size:contain;
    }

    .value-circle-content {
        top: 75px;
        left: 5px;
    }

    .budget-position-circle-2-small {
        top: -5px;
        right: 10px;
    }

    .budget-container-name-3 {
        font-size: 15px;
        padding-left: 5%;
    }

    .budget-container-name {
        font-size: 15px;
        margin-left: 5%;
    }
  
}

@media all and (max-width:300px){ 
    .budget-container-value {
        width: 7%;
    }

    /* .budget-position-circle-2 {
        top: 94px;
        right: -192px;
        width: 25%;
    } */

    /* .budget-container-name-2 {
        top: 12px;
        left: 12px;
    } */

    .budget-number-font {
        top: 6px;
        left: 9px;
        font-size: 12px;
    }
}