.navbarSpace{height: 57px;}
#navbar{height: 55px; position: fixed; top: 0px; left: 0px; width: 100%; z-index: 55; background: var(--bg_white); border-bottom: 2px solid var(--bg_blue); box-shadow: var(--shadow);}
#navbar > div{max-width: 900px; padding: 0px 20px; box-sizing: border-box;}
#navbar .nIcon{display: inline-block; padding: 10px 0px;}
#navbar .nIcon > div{display: grid; grid-template-columns: 35px 1fr; grid-gap: 10px; align-items: center;}
#navbar .nIcon > div > div{width: 100%;}
#navbar .nIcon > div > div:first-child > div{width: 35px; height: 35px;}
#navbar .nIcon > div > div:nth-child(2){font-size: 17px; font-weight: bold;}

.footerSpace{height: 25px;}

#footer{margin-top: 35px; background: var(--bg_black);}
#footer > div{padding: 35px 20px 75px 20px; max-width: 900px; box-sizing: border-box; color: var(--text_white);}
#footer .fInfo{font-size: 11px; margin-top: 5px;}

section{max-width: 900px;}
section .distance{padding: 0px 20px;}

.content{min-height: calc(100vh - 190px);}

.headTitle{padding: 35px 20px; font-size: 25px; font-weight: bold;}
.contentTitle{padding: 10px 15px; font-size: 17px; font-weight: bold; color: var(--text_bluedark);}

.breadcrumb{padding: 10px 25px; list-style: none;}
.breadcrumb li{display: inline;}
.breadcrumb li+li:before{padding: 8px; color: var(--text_black); content: "/\00a0";}
.breadcrumb li a{color: var(--text_silver); font-weight: bold;}
.breadcrumb li a:hover {text-decoration: underline;}

.menu_horizontal{width: min-content; display: inline-block; white-space: nowrap; border-radius: 10px; border: 1px solid var(--bg_line);}
.menu_horizontal > a{display: inline-block;}
.menu_horizontal > a:not(:last-child) > div{border-right: 1px solid var(--bg_line);}
.menu_horizontal .tmItem{font-weight: bold; color: var(--text_black); padding: 10px 15px;}
.menu_horizontal .tmItem.active{color: var(--text_blue);}
.menu_horizontal .tmItem:hover{color: var(--text_blue); text-decoration: underline;}

.section .sTitle{padding: 10px 0px 10px 15px; font-weight: bold; font-size: 17px; color: var(--text_bluedark);}
.section .sTitle span{font-size: 13px; font-family: 'regular'; margin-left: 15px;}
.section .sItems{width: 100%; overflow: auto; white-space: nowrap; -ms-overflow-style: none; scrollbar-width: none;}
.section .sItems::-webkit-scrollbar{display: none;}

#popup{width: 100%; top: 0px; left: 0px; height: 100%; position: fixed; z-index: 90; background: rgba(239, 239, 239, 0.55); overflow: auto;}
#popup table{width: 100%; height: 100%;}
#popup .p_canvas{max-width: 400px; width: 80%; margin-top: 50px; margin-bottom: 50px; box-shadow: 0 0 6px 0 rgba(161, 161, 161, 0.5); border-radius: 5px; overflow: hidden;}

#alert{width: 100%; height: 0px; position: fixed; top: 0px; left: 0px; z-index: 100;}
#alert > div{width: 90%; max-width: 450px; transition: 0.2s; box-shadow: 0 0 6px 0 rgba(161, 161, 161, 0.5); position: relative; top: -100px; border-radius: 20px;}
#alert > div > div{padding: 9px 15px 11px 15px; text-align: center; color: var(--text_white);}
#alert > div.success{background: var(--bg_alert_green);}
#alert > div.warning{background: var(--bg_alert_orange);}
#alert > div.failed{background: var(--bg_alert_red);}

.popup_head_close{display: grid; grid-template-columns: 1fr 15px; grid-gap: 10px; align-items: center; padding: 10px 15px; box-sizing: border-box; background: var(--bg_silvercalm);}
.popup_head_close > div{width: 100%;}
.popup_head_close > div:first-child{font-weight: bold;}
.popup_head_close > div:nth-child(2) > div{width: 15px; height: 15px;}

.popupProfile{border-radius: 5px; border: 1px solid var(--bg_silver); padding: 10px; box-sizing: border-box; display: grid; grid-template-columns: 25px 1fr; grid-gap: 10px; align-items: center;}
.popupProfile > div{width: 100%;}
.popupProfile > div:first-child > div{width: 30px; height: 30px; border-radius: 50%; background-color: var(--bg_silvercalm);}
.popupProfile > div:nth-child(2){font-weight: bold;}

.popup_list{list-style-type: none;}
.popup_list > li{padding: 15px 20px; cursor: pointer; transition: all 0.5s ease;}
.popup_list > li:not(:last-child){border-bottom: 1px solid #f6f6f6;}
.popup_list > li:hover{background: #e7e7e7;}
.popup_list > a > li{padding: 15px 20px; cursor: pointer; transition: all 0.5s ease;}
.popup_list > a:not(:last-child) > li{border-bottom: 1px solid #f6f6f6;}
.popup_list > a:hover > li{background: var(--bg_silvercalm);}
.popup_list.plIcon li{display: grid; grid-template-columns: 20px 1fr; grid-gap: 10px; align-items: center;}
.popup_list.plIcon li > div{width: 100%;}
.popup_list.plIcon li > div:first-child > div{width: 20px; height: 20px;}

.popup_withIcon{padding: 15px 0px;}
.popup_withIcon > div:first-child > div{width: 150px; height: 150px;}
.popup_withIcon > div:nth-child(2){margin-top: 15px; text-align: center;}

.page_empty{padding: 45px 0px 65px 0px; text-align: center; color: var(--text_silver); font-size: 15px;}

.option_logo{margin-top: 25px;}
.option_logo > a:not(:last-child) > div{margin-bottom: 25px;}
.option_logo > a > div{display: grid; grid-template-columns: 25px 1fr; grid-gap: 15px; align-items: center;}
.option_logo > a > div > div{width: 100%;}
.option_logo > a > div > div:first-child > div{width: 25px; height: 25px;}
.option_logo > a > div > div:nth-child(2){font-weight: bold;}

/**FRONT**/
.front_header{border-bottom: 5px solid var(--bg_blue); padding: 50px 0px 60px 0px;}
.front_header .fhLogo{display: grid; grid-template-columns: 50px 1fr; grid-gap: 15px; align-items: center;}
.front_header .fhLogo > div{width: 100%;}
.front_header .fhLogo > div:first-child > div{height: 50px; width: 100%;}
.front_header .fhLogo > div:nth-child(2){font-size: 25px; font-family: 'bold';}
.front_header .fhSlogan{margin-top: 15px; font-weight: bold;}

.front_menu{display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap: 35px; margin: 55px 0px;}
.front_menu > div{width: 100%;}
.front_menu .fmItem .fiIcon{transition: var(--transition);}
.front_menu .fmItem .fiIcon > div{width: 80px; height: 80px; display: inline-block;}
.front_menu .fmItem:hover .fiIcon{opacity: 0.4;}
.front_menu .fmItem > div:nth-child(2){font-weight: bold; margin-top: 5px;}
.front_menu .fmItem > div:nth-child(3){color: var(--text_silver);}

/**HQ**/
.hq_head{margin-bottom: 25px;}
.hq_head .hhLogo{width: 100px; margin-bottom: 5px; display: inline-block;}
.hq_head .hhLogo > div{padding-bottom: 24%;}

.hq_items{display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap: 15px; margin-bottom: 25px;}
.hq_items > div{width: 100%; padding: 15px; border: 1px solid var(--bg_silver); box-sizing: border-box; border-radius: 10px;}
.hq_items > div > div:first-child{width: 65px; height: 65px; margin-bottom: 15px;}
.hq_items > div > div:nth-child(2){text-align: center;}
.hq_items > div > div:nth-child(2) > div:first-child{font-weight: bold;}
.hq_items > div > div:nth-child(2) > div:nth-child(2){color: var(--text_silver); font-size: 12px; margin-top: 10px;}

.hq_content > div > div:first-child{font-size: 15px; font-weight: bold;}
.hq_content > div:not(:last-child){margin-bottom: 15px;}
.hq_content .hcItems .htBox{padding: 10px 0px;}
.hq_content .hcItems .htBox > div:first-child{font-weight: bold;}
.hq_content .hcItems .htBox > div:nth-child(2){color: var(--text_silver);}

.hq_location{margin-top: 25px;}

.hq_box .hbTitle{font-size: 15px; font-weight: bold; margin-bottom: 35px;}
.hq_box .hbTitle > span{padding: 10px 15px 12px 15px; border-radius: 0px 10px 10px 0px; border: 2px solid var(--bg_blue); border-left: 0px;}
.hq_box .hbImg{display: inline-block; margin-bottom: 20px;}
.hq_box .hbImg > div{background-size: cover;}
.hq_box .hbImg.store{width: 150px;}
.hq_box .hbImg.store > div{padding-bottom: 30%; background-image: url('../../../images/background/hq_store.png');}
.hq_box .hbImg.cuveer{width: 150px;}
.hq_box .hbImg.cuveer > div{padding-bottom: 20%; background-image: url('../../../images/background/hq_cuveer.png');}
.hq_box .hbImg.aplus{width: 85px;}
.hq_box .hbImg.aplus > div{padding-bottom: 100%; background-image: url('../../../images/background/hq_aplus.png');}
.hq_box .hbImg.kwikkufm{width: 210px;}
.hq_box .hbImg.kwikkufm > div{padding-bottom: 14%; background-image: url('../../../images/background/hq_kwikkufm.png');}
.hq_box .hbList{margin-top: 15px;}
.hq_box .hbList > div:first-child{}
.hq_box .hbList > div:nth-child(2){margin-top: 15px; padding-left: 15px;}
.hq_box .hbList > div:nth-child(2) > div:not(:last-child){margin-bottom: 10px;}
.hq_box .hbList > div:nth-child(2) > div > div:first-child{font-weight: bold;}

.hbSection{display:flex;flex-direction:column;gap:20px; margin-top: 25px;}
.hbSection>div{display:flex;align-items:center;gap:20px;}
.hsImage{width:250px;flex-shrink:0;}
.hsImage > div{width:100%;padding-bottom:100%;border-radius:12px;}
.hsContent{flex:1;}
.hsContent .hcTitle{font-size: 17px;font-family: 'bold';margin-bottom:12px;}

.hq_benefit{padding: 15px;}
.hq_benefit > div:first-child{font-size: 15px; font-weight: bold; margin-bottom: 10px;}
.hq_benefit .hbInfo > div{display: grid; grid-template-columns: 65px 1fr; grid-gap: 15px; align-items: center;}
.hq_benefit .hbInfo > div:not(:last-child){margin-bottom: 20px;}
.hq_benefit .hbInfo > div > div{width: 100%;}
.hq_benefit .hbInfo > div > div:first-child > div{width: 20px; height: 20px; border-radius: 50%; background-color: var(--bg_blue);}
.hq_benefit .hbInfo > div > div:nth-child(2) > div:first-child{font-size: 15px; font-weight: bold; margin-bottom: 5px;}

/**VIDEO TUTORIAL**/
.videoplayer{float: none; clear: both; width: 100%; position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0;}
.videoplayer iframe{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

/**CREATOR**/
.creator_menu{padding-bottom: 10px; border-bottom: 2px solid var(--bg_line);}
.creator_menu > div{display: inline-block; cursor: pointer; padding: 7px 15px 8px 15px; border-radius: 10px;}
.creator_menu > div:not(:last-child){margin-right: 10px;}
.creator_menu > div.active{background: var(--bg_blue); color: var(--text_white);}

.creator_box > div{display: grid; grid-template-columns: 1fr 1fr; align-items: center; grid-gap: 25px;}
.creator_box.withIcon > div.cbRight{grid-template-columns: 1fr 200px;}
.creator_box.withIcon > div.cbLeft{grid-template-columns: 200px 1fr;}
.creator_box > div:not(:last-child){margin-bottom: 25px;;}
.creator_box > div > div{width: 100%;}
.creator_box .cbCover > div{padding-bottom: 60%; border-radius: 10px;}
.creator_box .cbIcon > div{padding-bottom: 100%}
.creator_box .cbContent{padding: 35px 0px;}
.creator_box .cbContent > div:first-child{font-size: 20px; font-weight: bold; margin-bottom: 5px;}

.creator_premium{display: grid; grid-template-columns: 1fr 1fr; grid-gap: 15px;}
.creator_premium > div{width: 100%; border: 1.5px solid var(--bg_line); border-radius: 10px;}
.creator_premium .cpItem{padding: 15px; display: grid; grid-template-columns: 65px 1fr; grid-gap: 15px; align-items: top; box-sizing: border-box;}
.creator_premium .cpItem > div{width: 100%;}
.creator_premium .cpItem > div:first-child > div{padding-bottom: 100%;}
.creator_premium .cpItem > div:nth-child(2) > div:first-child{font-weight: bold; font-size: 15px;}
.creator_premium .cpItem .ciDesc{color: var(--text_silver);}
.creator_premium .cpItem .ciList{margin-top: 10px;}
.creator_premium .cpItem .ciList > div:nth-child(2){margin-top: 5px; margin-left: 20px; font-size: 11px;}
.creator_premium .cpItem .ciList > div:nth-child(2) > div{position: relative;}
.creator_premium .cpItem .ciList > div:nth-child(2) > div:before{content: ''; position: absolute; left: -15px; top: 5px; width: 5px; height: 5px; border-radius: 50%; background: var(--bg_silver);}
.creator_premium .cpItem .ciList > div:nth-child(2) > div:not(:last-child){margin-bottom: 3px;}

/**FAQ**/
.faq_items > div{padding: 13px 0px;}
.faq_items > div:first-child{padding-top: 0px;}
.faq_items > div:not(:last-child){border-bottom: 1px solid var(--bg_line);}
.faq_items > div > div:first-child{font-weight: bold; font-size: 15px; cursor: pointer;}
.faq_items > div > div:nth-child(2){color: var(--text_silver); padding: 10px 0px 0px 15px; display: none;}

/**BRAND**/
.brand_logo{display: grid; grid-template-columns: 1fr 150px; grid-gap: 15px; max-width: 500px; margin-top: 35px; margin-bottom: 35px;}
.brand_logo > div{width: 100%;}
.brand_logo button{width: 100%;}
.brand_color{max-width: 500px; margin-top: 35px; margin-bottom: 35px;}
.brand_color > div:first-child{font-weight: bold;}
.brand_color .bcItems{margin-top: 15px;}
.brand_color .bcItems > div{display: inline-block;}
.brand_color .bcItems > div:not(:last-child){margin-right: 10px;}
.brand_color .bcItems > div > div:first-child{width: 50px; height: 50px; background: red;}
.brand_color .bcItems > div > div:nth-child(2){margin-top: 5px;}
.brand_info{max-width: 500px; margin-top: 35px; margin-bottom: 35px;}
.brand_info > div:first-child{font-weight: bold;}

/**HELP**/
.help_store_hts > div{display: grid; grid-template-columns: 150px 1fr; grid-gap: 20px; align-items: center;}
.help_store_hts > div:not(:last-child){margin-bottom: 35px;}
.help_store_hts > div > div{width: 100%;}
.help_store_hts > div > div:nth-child(2) > div:first-child{font-weight: bold; font-size: 15px; margin-bottom: 10px;}
.help_store_hts .hthIcon{padding-bottom: 100%;}

/**CONTACT**/
.contact_list{margin-top: 25px;}
.contact_list > a{display: inline-block; width: 100%;}
.contact_list > a > div{display: grid; grid-template-columns: 25px 1fr; align-items: center; grid-gap: 15px; padding: 10px 0px;}
.contact_list > a:not(:last-child) > div{margin-bottom: 10px;}
.contact_list > a > div > div{width: 100%;}
.contact_list > a > div > div:first-child > div{width: 25px; height: 25px;}
.contact_list > a > div > div:nth-child(2){font-weight: bold;}
.contact_list > a > div > div:nth-child(2) > div:first-child{font-size: 11px; color: var(--text_silver);}

/**OTHERS**/
.others_da{min-height: calc(100vh - 300px);}
.others_da > div{display: none; max-width: 550px;}
.others_da > div.active{display: block;}
.others_da .odBox .obContent{display: grid; grid-template-columns: 250px 1fr; grid-gap: 15px; align-items: center; padding: 15px 10px; box-sizing: border-box; border-radius: 10px; border: 1px solid var(--bg_line);}
.others_da .odBox .obContent > div{width: 100%;}
.others_da .odBox .obContent > div:first-child > div{padding-bottom: 50%;}
.others_da .odBox .obBtn{display: grid; margin-top: 25px; grid-template-columns: min-content 1fr min-content; align-items: center;}
.others_da .odBox .obBtn > div{width: 100%;}

/**ERROR**/
.error_page{max-width: 500px; background: var(--bg_silvercalm); border-radius: 10px; margin-top: 70px; margin-bottom: 100px;}
.error_page > div{padding: 30px 35px 35px 30px; font-size: 17px;}
.error_page > div > div:first-child{font-size: 25px; font-weight: bold;}

.error_login{max-width: 570px; padding: 10px 15px; background: var(--bg_orangecalm); border-radius: 10px; margin-top: 80px; margin-bottom: 200px;}
.error_login > div:first-child{font-family: 'bold'; font-size: 15px;}
.error_login > div:nth-child(2){margin-top: 5px;}