.navbarSpace{height: 60px;}

#navbar{position: fixed; top: 0px; left: 0px; z-index: 55; width: 100%; height: 60px; background: rgba(0,0,0,0.58); backdrop-filter: blur(4px);}
#navbar > div{padding: 0px 45px;}
#navbar .nContent{display: grid; grid-gap: 15px; grid-template-columns: 120px 1fr 200px 100px;}
#navbar .nContent.user{grid-template-columns: 120px 1fr 200px 40px;}
#navbar .nContent > div{width: 100%;}
#navbar .nLogo{width: 100%; padding-bottom: 19%; margin-top: 17px; position: relative;}
#navbar .nLogo > span{position: absolute; bottom: -14px; right: -12px; background: var(--bg_red); font-size: 9px; color: var(--text_white); padding: 2px 7px; border-radius: 10px;}
#navbar .nMenu{white-space: nowrap; font-size: 0px;}
#navbar .nMenu > a{display: inline-block; color: var(--text_white);}
#navbar .nMenu > a.active{color: var(--text_red);}
#navbar .nMenu > a:hover:not(.active){opacity: 0.7;}
#navbar .nMenu > a > div{padding: 17px 13px; font-size: 15px;}
#navbar #idSearch{position: relative;}
#navbar .nSearch{position: absolute; top: 0px; right: 0px; transition: var(--transition);}
#navbar .nSearch input{width: 100%; padding: 7px 15px; background: var(--bg_silvercalm); border-radius: 50px; margin-top: 13px;}
#navbar .nBtn{padding: 8px 0px; background: var(--bg_red); font-size: 11px; text-align: center; border-radius: 10px; margin-top: 12px;}
#navbar .nProfile{padding: 6px 0px 7px 0px; background: var(--bg_red); border-radius: 10px; margin-top: 12px; transition: var(--transition);}
#navbar .nProfile:hover{box-shadow: inset 0px 0px 0px 1.5px var(--bg_white);}
#navbar .nProfile > div{width: 20px; height: 20px;}

#headerBackSpace{height: 50px;}
#headerBack{height: 50px; width: 100%; position: fixed; top: 0px; left: 0px; z-index: 55; background: var(--bg_gradient1);}
#headerBack > div{padding: 0px 35px 0px 35px; height: 50px;}
#headerBack .hBack{width: 50px; height: 50px; float: left; margin-right: 15px;}
#headerBack .hBack > div{width: 25px; height: 25px; position: relative; top: 12px;}
#headerBack .hLogo{width: 95px; float: left; margin-top: 16px;}
#headerBack .hLogo > div{padding: 12%;}

#footer{height: 100px; margin-top: 40px; padding-bottom: 25px;}
#footer .fBody{display: grid; grid-template-columns: 490px 1fr; grid-gap: 15px;}
#footer .fBody > div{width: 100%;}
#footer .fBody .fbOption{white-space: nowrap; margin-top: 25px;}
#footer .fBody .fbOption > a{display: inline-block;}
#footer .fBody .fbOption > a:not(:last-child){margin-right: 15px;}
#footer .fBody .fbContent{margin-top: 7px; color: var(--text_silver);}
#footer .fBody .fbEngine{margin-top: 5px; font-size: 11px; color: #313131;}
#footer .fBody > div:nth-child(2) > div{float: right;}
#footer .fBody .fbDownload > div:first-child{text-align: right;}
#footer .fBody .fbDownload > div:nth-child(2){white-space: nowrap; margin-top: 20px;}
#footer .fBody .fbDownload > div:nth-child(2) > a{display: inline-block;}
#footer .fBody .fbDownload > div:nth-child(2) > a:not(:last-child){margin-right: 15px;}
#footer .fBody .fbDownload > div:nth-child(2) > a > div{width: 136px; height: 40px; background-size: cover;}

.download_playstore{background-image: url('../../../images/download_playstore.png');}
.download_appstore{background-image: url('../../../images/download_appstore.png');}

#content{min-height: calc(100vh - 350px);}
#content .contentSpace{display: inline-block; width: 100%; margin-top: 20px;}
#content div.empty{padding: 20px 15px; text-align: center; margin-top: 100px; margin-bottom: 300px; font-size: 17px; color: var(--text_silver);}
#content div.empty.mini{margin-top: 50px; margin-bottom: 100px;}

section{max-width: 1200px;}
section.sec800{max-width: 900px;}
section > div.distance{padding: 0px 25px;}

#container{display: grid;}
#container .barfull{grid-column: 1 / side 2; margin: 0px;}
#container .content{grid-column: 1; margin: 0px;}
#container .side{grid-column: 2; margin: 0px;}
#container.cnt800{width: 900px;}
#container.cnt800 .content{width: 600px;}
#container.cntLeft{grid-template-columns: auto 300px;}
#container.cntLeft .side{padding-left: 25px;}
#container.cntRight{grid-template-columns: 250px auto;}
#container.cntRight .side{padding-right: 25px;}
.sideTitle{padding-bottom: 15px; font-size: 20px; font-family: 'bold';}

.sideMenu > a > div{padding: 15px 20px; cursor: pointer; transition: all 0.5s ease; color: var(--text_black); position: relative;}
.sideMenu > a:not(:last-child) > div{border-bottom: 1px solid #f6f6f6;}
.sideMenu > a:hover > div{background: #e7e7e7;}
.sideMenu > a > div.active:before{content: ''; position: absolute; width: 2px; height: 100%; background: var(--bg_blue); left: 0px; top: 0px;}

.footerSpace{height: 20px;}

#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%; color: var(--text_black); margin-top: 50px; margin-bottom: 50px; box-shadow: 0 0 6px 0 rgba(161, 161, 161, 0.5); border-radius: 5px; overflow: hidden;}

.popup_head_action{height: 45px; padding: 0px 15px;}
.popup_head_action .pha_title{font-size: 15px; font-family: 'bold'; float: left; margin-top: 15px;}
.popup_head_action .pha_action{float: right;}
.popup_head_action .pha_action button{margin-top: 10px;}

.popup_loginNumberPhone .plHead{height: 150px; background: var(--bg_gradient1); position: relative;}
.popup_loginNumberPhone .plHead > div:first-child{width: 60px; height: 60px; top: 30px; position: relative; background-size: cover; background-image: url('../../../images/icon/others/smartphone.png');}
.popup_loginNumberPhone .plHead > div:nth-child(2){position: absolute; bottom: 15px; left: 15px; font-size: 15px; font-weight: bold; color: var(--text_white);}
.popup_loginNumberPhone .plNumber{padding: 15px 20px;}
.popup_loginNumberPhone .plNumber button{width: 100%;}
.popup_loginNumberPhone .plOtp{padding: 15px 20px; background: var(--bg_silvercalm); display: none;}

.popup_point{padding: 10px 25px 12px 25px; display: grid; grid-template-columns: 1fr 1fr; grid-gap: 10px; box-sizing: border-box; border-bottom: 1px solid var(--bg_silver);}
.popup_point > div{width: 100%; display: grid; grid-template-columns: 25px 1fr; grid-gap: 15px; align-items: center;}
.popup_point > div > div{width: 100%;}
.popup_point .ppIcon{height: 20px; width: 20px;}
.popup_point .ppContent > div:first-child{font-size: 11px;}
.popup_point .ppContent > div:nth-child(2){font-family: 'bold';}

.popup_user_info{padding: 5px 5px 6px 5px; display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 10px; box-sizing: border-box; border-bottom: 1px solid var(--bg_silver);}
.popup_user_info > div{text-align: center; width: 100%; padding: 10px 0px;}
.popup_user_info > div.pointer:hover{box-shadow: inset 0px 0px 0px 1.5px var(--bg_red); border-radius: 10px;}
.popup_user_info .puiIcon{height: 20px; width: 20px;}
.popup_user_info .puiContent{margin-top: 8px;}
.popup_user_info .puiContent > div:first-child{font-size: 11px;}
.popup_user_info .puiContent > div:nth-child(3){font-size: 11px; color: var(--text_silver);}
.popup_user_info .puiContent .pcBold{font-family: 'bold';}
.popup_user_info .puiContent .pcBtn > span{padding: 0px 7px; background: var(--bg_silver); color: var(--text_silver); font-size: 11px; border-radius: 10px;}
.popup_user_info .puiContent .pcBtn > span.active{background: var(--bg_red); color: var(--text_white);}

.popup_expired{display: grid; grid-template-columns: 1fr 65px; grid-gap: 20px;}
.popup_expired > div:nth-child(2) > div{width: 65px; height: 65px;}

.popup_title_inline{padding: 15px 20px 10px 20px; color: var(--text_silver); font-family: 'bold'; letter-spacing: 6px;}
.popup_title_inline > span{position: relative;}
.popup_title_inline > span:before{content: ''; position: absolute; width: calc(100% + 20px); height: 2px; bottom: -5px; left: 0px; background: var(--bg_red);}

.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; color: var(--text_black);}
.popup_list > a:not(:last-child) > li{border-bottom: 1px solid #f6f6f6;}
.popup_list > a:hover > li{background: #e7e7e7;}
.popup_list > a > li .status{padding: 0px 7px; background: var(--bg_silver); color: var(--text_silver); font-size: 11px; border-radius: 10px; float: right;}
.popup_list > a > li .status.active{background: red; color: var(--text_white);}

.popup_login > div:first-child{height: 70px; background: var(--bg_black); background-image: var(--bg_gradient1); color: var(--text_white); position: relative;}
.popup_login > div:first-child > div{font-size: 17px; font-weight: bold; position: absolute; bottom: 15px; left: 15px;}
.popup_login > div:nth-child(2){padding: 15px; display: grid; grid-template-columns: 1fr 135px; grid-gap: 15px; box-sizing: border-box; align-items: center;}
.popup_login > div:nth-child(2) > div{width: 100%;}
.popup_login > div:nth-child(2) > div button{width: 100%;}

.popup_inputKidsMode{display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap: 15px;}
.popup_inputKidsMode > input{width: 100%; text-align: center; font-size: 20px;}

.popup_set_time{display: grid; grid-template-columns: 1fr 1fr; grid-gap: 15px;}
.popup_set_time > div{width: 100%;}
.popup_set_time > div > div:first-child{color: var(--text_silver);}
.popup_set_time > div > div:nth-child(2){margin-top: 5px;}

.popup_nsfw{width: 100%; height: 100%; background: rgba(0, 0, 0, 0.85); position: fixed; top: 0px; left: 0px; z-index: 50;}
.popup_nsfw > div{display: table; width: 100%; height: 100%; table-layout: fixed;}
.popup_nsfw > div > div{display: table-cell; vertical-align: middle;}
.popup_nsfw > div > div > div{width: 450px; padding: 25px 0px; background: var(--bg_white); border-radius: 10px; text-align: center;}
.popup_nsfw > div > div > div > div:first-child{width: 135px; height: 100px; background-image: url('../../../images/back_nsfw.png'); background-size: 100%;}
.popup_nsfw > div > div > div > div:nth-child(2){margin-top: 15px; font-size: 17px; font-family: 'bold';}
.popup_nsfw > div > div > div > div:nth-child(3){margin-top: 5px; padding: 0px 25px;}
.popup_nsfw > div > div > div > div:nth-child(4){margin-top: 15px;}

#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);}

.devmode{position: fixed; bottom: 15px; right: 15px; padding: 10px 25px; background: var(--bg_red); color: var(--text_white); font-weight: bold; z-index: 55; border-radius: 10px; border: 2px solid var(--bg_white);}

.alertActivateEmail{padding: 15px 25px; background: var(--bg_orange);}

.scroll_card{opacity: 0; transition: all 0.2s ease;}
.scroll_card > div{height: 100%; width: 0px; top: 0px; position: absolute; z-index: 1;}
.scroll_card > div:first-child{left: 25px; display: none;}
.scroll_card > div:last-child{right: 30px;}
.scroll_card > div > div{width: 40px; height: 40px; cursor: pointer; border-radius: 50%; position: absolute; top: 32%; background: var(--bg_white); border: 3px solid var(--bg_blue);}
.scroll_card > div:last-child > div{right: 0px;}
.scroll_card > div > div > div{width: 20px; height: 20px; margin-top: 9.5px;}
.scroll_card > div:hover:first-child > div > div{margin-left: 5px;}
.scroll_card > div:hover:last-child > div > div{margin-right: 5px;}

.share{padding: 10px 0px;}
.share > div{padding: 10px 20px; cursor: pointer;}
.share > div:not(:last-child){border-bottom: 1px solid var(--bg_line);}
.share > div > div{display: table; table-layout: fixed; width: 100%;}
.share > div > div > div{display: table-cell; vertical-align: middle;}
.share > div > div > div:first-child{width: 25px;}
.share > div > div > div:first-child > div{height: 25px;}
.share > div > div > div:last-child{padding-left: 15px;}

.slider{position: relative; overflow: hidden; height: 398px; padding: 25px 0px; background: var(--bg_bluecalm);}
.slider .sTop{position: relative;}
.slider .sTop > div{position: relative;}
.slider .sTop > div > a > div{width: 1143px; position: absolute; left: 0px; right: 0px; transition: all 0.5s ease; transform: scale(0.8);}
.slider .sTop > div > a > div > div{background-size: cover; border-radius: 10px; padding-bottom: 33%;}
.slider .sTop > div > a:first-child > div{right: unset; left: -78%;}
.slider .sTop > div > a:nth-child(2) > div{transform: scale(1); z-index: 1;}
.slider .sTop > div > a:nth-child(3) > div{left: unset; right: -78%;}
.slider .sTop > div > a:nth-child(n+4) > div{opacity: 0; left: unset; right: -100%;}
.slider .sBottom{position: absolute; height: 10px; bottom: 18px; left: 0px; width: 100%;}
.slider .sBottom > div{display: table;}
.slider .sBottom > div > div{display: table-cell; vertical-align: middle; padding: 0px 5px;}
.slider .sBottom > div > div > div{width: 10px; height: 10px; background: var(--bg_silver); border-radius: 50%; cursor: pointer;}
.slider .sBottom > div > div > div.active{background: var(--bg_blue);}

.title{display: inline-block; width: 100%; padding: 15px 0px;}
.title > div:first-child > div{font-size: 17px; font-weight: bold; float: left; top: 2px; position: relative;}
.title > div:first-child > div .tImgFilm{height: 21px; width: 115px; margin: 5px 0px; float: left;}
.title > div:nth-child(2){float: right;}
.headMore{display: table; table-layout: fixed;}
.headMore > div{display: table-cell; vertical-align: middle;}
.headMore > div:first-child{padding-right: 15px; font-weight: bold;}
.headMore > div:last-child{width: 30px;}
.headMore > div:last-child > div{height: 30px; border-radius: 50%; background: var(--bg_blue);}
.headMore > div:last-child > div > div{width: 15px; height: 15px; position: relative; top: 7px; left: 2px;}

.page_head{margin-bottom: 15px;}
.page_head > div{display: inline-block; width: 100%;}
.page_head > div > div:first-child{font-size: 20px; font-family: 'bold'; float: left;}
.page_head > div > div:nth-child(2){float: right; margin-top: 7px;}
.page_head > div > div:nth-child(2) a{cursor: pointer;}

.page_back{font-size: 17px; font-family: 'bold';}
.page_title{padding: 40px 25px 45px 25px; color: var(--text_blue);}
.page_title h1{font-size: 25px; font-family: 'bold';}
.page_title_fixed{height: 122px;}
.page_title_fixed > div{z-index: 5; width: 100%; transition: var(--transition);}
.page_title_fixed.fixedOn > div{position: fixed; background: var(--bg_base); left: 0px; top: 0px; padding-top: 55px; border-bottom: 2px solid var(--bg_red);}
.page_title_fixed > div > div{width: 100%;}
.page_title_fixed > div > div > div{padding: 40px 25px 40px 25px; font-size: 25px; font-weight: bold; transition: var(--transition);}
.page_title_fixed.fixedOn > div > div > div{padding: 15px 25px 15px 25px; font-size: 20px;}
.page_title_mini{padding: 15px 25px 20px 25px; font-size: 20px; font-family: 'bold'; color: var(--text_blue);}

.page_loading{padding: 35px 0px 20px 0px; text-align: center; font-size: 20px; color: var(--text_silver);}

.page_icon{width: 170px; height: 170px;}

.menu_horizontal{padding: 15px 0px; margin: 5px 0px 10px 0px;}
.menu_horizontal > div{display: table; table-layout: fixed;}
.menu_horizontal > div > div{display: table-cell; padding: 0px 5px;}
.menu_horizontal > div > div > a > div{padding: 5px 10px 6px 10px; border-radius: 5px; color: var(--text_silver); font-size: 15px; white-space: nowrap;}
.menu_horizontal > div > div > a > div:hover, .menu_horizontal > div > div > a > div.active{background: var(--bg_blue); color: var(--text_white);}

.tab > div:first-child{display: table; width: 100%; table-layout: fixed;}
.tab > div:first-child > div{display: table-cell; font-weight: bold; font-size: 17px; position: relative; cursor: pointer; height: 50px; vertical-align: middle; padding-bottom: 5px; text-align: center;}
.tab > div:first-child > div:before{content: ''; position: absolute; bottom: 0px; left: 0px; width: 100%; height: 2px; background: var(--bg_silver); opacity: 0; transition: all 0.2s ease;}
.tab > div:first-child > div:not(.active){color: var(--text_silver);}
.tab > div:first-child > div:not(.active):hover:before{background: var(--bg_line); opacity: 1;}
.tab > div:first-child > div.active:before{opacity: 1;}
.tab > div:first-child > div > span{padding: 2px 3px; background: var(--bg_silvercalm); font-size: 11px; position: relative; top: -1px; border-radius: 3px; color: var(--text_silver);}
.tab > div:last-child > span:not(:first-child){display: none;}

.rightclick{display: none; z-index: 1000; position: absolute; overflow: hidden; border: 1px solid var(--bg_silver); white-space: nowrap; background: var(--bg_white); border-radius: 5px; padding: 0;}
.rightclick li{padding: 8px 12px; cursor: pointer; list-style-type: none; transition: all 0.2s ease; user-select: none;}
.rightclick li:hover{background-color: var(--bg_silvercalm);}

.dropdown{position: relative;}
.dropdown .dd_canvas{width: 200px; min-height: 10px; background: var(--bg_white); position: absolute; z-index: 5; right: 0px; box-shadow: 0px 0px 5px var(--bg_silver); list-style-type: none; border-radius: 5px; overflow: hidden; display: none;}
.dropdown .dd_canvas.top{bottom: 130%;}
.dropdown .dd_canvas.bottom{top: 130%;}
.dropdown .dd_canvas li{border-bottom: 0.5px solid #e0e0e0;}
.dropdown .dd_canvas li:last-child{border-bottom: 0px;}
.dropdown .dd_canvas .ddc_content{padding: 10px 15px;}
.dropdown .dd_canvas .ddc_content > div{width: 15px; height: 15px; float: left; margin-right: 10px;}

.sidebox > div:first-child{padding: 15px 0px; font-size: 20px; font-family: 'bold'; border-bottom: 1px solid var(--bg_line);}
.sidebox.first > div:first-child{padding: 0px 0px 15px 0px;}

.emoticon{position: relative; cursor: pointer;}
.emoticon > .emt{position: absolute; width: 230px; z-index: 10; overflow: hidden; background: var(--bg_white); box-shadow: 0px 0px 10px var(--bg_silver); border-radius: 10px; top: 100%; right: 0px;}
.emoticon.emt_left > .emt{left: 0px; right: unset;}
.emoticon > .emt > div:first-child{width: 100%; white-space: nowrap; font-size: 0px; background: var(--bg_silvercalm); overflow: auto;}
.emoticon > .emt > div:first-child > div{display: inline-block; height: 41px; width: 40px; cursor: pointer; position: relative;}
.emoticon > .emt > div:first-child > div > div:before{content: ''; transition: all 0.2s ease; bottom: 0px; left: 0px; position: absolute; height: 2px; background: var(--bg_blue); opacity: 0; width: 100%;}
.emoticon > .emt > div:first-child > div:hover:not(.active) > div:before{opacity: 1; background: var(--bg_silver);}
.emoticon > .emt > div:first-child > div.active > div:before{opacity: 1;}
.emoticon > .emt > div:first-child > div > div{width: 25px; height: 26px; background-size: cover; margin-top: 7px;}
.emoticon > .emt > div:last-child{height: 240px; overflow: auto; display: grid; grid-template-columns: auto auto auto auto auto;}
.emoticon > .emt > div:last-child > div.loadingEmoticon{padding-top: 90px; color: var(--text_silver);}
.emoticon > .emt > div:last-child > div:not(.loadingEmoticon){width: 100%; height: 44px; transition: all 0.2s ease; cursor: pointer;}
.emoticon > .emt > div:last-child > div:not(.loadingEmoticon):hover{box-shadow: inset 0px 0px 0px 1px var(--bg_blue);}
.emoticon > .emt > div:last-child > div:not(.loadingEmoticon) > div{width: 30px; height: 31px; background-size: cover; margin-top: 6.5px;}

.stickerBox > div:first-child{padding: 15px 8px 5px 20px; height: 25px;}
.stickerBox > div:first-child > div:first-child{font-size: 17px; font-family: 'bold'; float: left;}
.stickerBox > div:first-child > div:nth-child(2){width: 25px; height: 25px; float: right;}
.stickerBox > div:first-child > div:nth-child(2) > div{width: 15px; height: 15px; margin-top: 5px;}
.stickerBox > div:nth-child(2){display: none; grid-template-columns: auto 40px;}
.stickerBox > div:nth-child(2) > div{width: 100%; overflow: auto;}
.stickerBox > div:nth-child(3){padding: 15px 15px 20px 15px; min-height: 250px;}
.stickerBox .sB_list{white-space: nowrap;}
.stickerBox .sB_list > div{display: inline-block; padding: 10px 22px; font-family: 'bold'; cursor: pointer;}
.stickerBox .sB_list > div.active{color: var(--text_blue);}
.stickerBox .sB_btnstore{height: 40px; border-left: 2px solid var(--bg_line);}
.stickerBox .sB_btnstore.active{background: var(--bg_silvercalm);}
.stickerBox .sB_btnstore > div{width: 25px; height: 25px; top: 7px; position: relative;}
.stickerBox .sB_btnstore > div:hover{opacity: 0.3;}
.stickerBox .sB_btnstore.active > div{opacity: 0.3;}
.stickerBox .sB_body{display: none;}
.stickerBox .sB_body .sB_loading{padding: 85px 0px 100px 0px; text-align: center; color: var(--text_silver);}
.stickerBox .sB_body .sB_remove{padding-bottom: 15px; height: 18px; width: 100%; display: none;}
.stickerBox .sB_body .sB_remove > div{float: right; color: var(--text_blue); cursor: pointer;}
.stickerBox .sB_body .sB_content{display: none; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap: 15px;}
.stickerBox .sB_body .sB_content > div{width: 100%;}
.stickerBox .sB_body .sB_content > div > div{padding-bottom: 100%; cursor: pointer;}
.stickerBox .sB_body .sB_content > div > div:hover{box-shadow: inset 0px 0px 0px 1px var(--bg_blue);}
.stickerBox .sB_store{display: none;}
.stickerBox .sB_store > div{display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 15px;}
.stickerBox .sB_store > div > div{width: 100%; cursor: pointer;}
.stickerBox .sB_store > div > div > div:first-child{padding-bottom: 100%; background-color: var(--bg_silvercalm); border-radius: 5px;}
.stickerBox .sB_store > div > div > div:nth-child(2){margin-top: 10px;}
.stickerBox .sB_store > div > div > div:nth-child(2) > div:first-child{font-family: 'bold';}
.stickerBox .sB_store > div > div:hover > div:nth-child(2) > div:first-child{color: var(--text_blue);}
.stickerBox .sB_store > div > div > div:nth-child(2) > div:nth-child(2){margin-top: 3px; color: var(--text_silver);}

.account_bg{height: 120px; background-image: url('../../../images/background/account.jpg'); background-size: cover; position: relative;}
.account_bg > div{position: absolute; bottom: 0px; left: 0px; width: 100%;}
.account_bg > div > div{padding: 0px 15px 20px 15px; color: var(--text_white);}
.account_bg > div > div > div:first-child{font-size: 11px;}
.account_bg > div > div > div:nth-child(2){margin-top: 5px;}
.account_bg > div > div > div:nth-child(2) > span{padding: 3px 10px 4px 10px; border-radius: 5px; background: rgba(251, 65, 49, 0.50); font-size: 12px;}
.account_menu{}

/**LOGIN**/
.login_layout{margin: 70px auto 120px auto; background: #222222; max-width: 800px; border-radius: 10px; overflow: hidden;}
.login_layout > div{display: grid; grid-template-columns: 1fr 1fr; grid-gap: 25px;}
.login_layout > div > div{width: 100%;}
.login_layout > div > div:first-child{background-size: cover; background-image: url('../../../images/background/login.jpg');}
.login_layout .llBox{padding: 50px 50px 70px 50px;}
.login_layout .llBox > div:first-child{font-size: 20px; font-family: 'bold';}
.login_layout .llBox > div:not(:first-child){margin-top: 15px;}
.login_layout .ll_sosmed button{width: 100%; padding: 15px 0px; font-size: 15px;}
.login_layout .ll_sosmed > div:not(:last-child){margin-bottom: 15px;}
.login_layout .ll_sosmed button.btn_gplus{background: #dd4b39;}
.login_layout .ll_sosmed button.btn_apple{background: #333333;}
.login_layout .ll_sosmed button.btn_fb{background: #3B5998;}
.login_layout .ll_sosmed button.btn_twt{background: #55ACEE;}
.login_layout .ll_others{border-top: 1px solid var(--bg_silver); padding-top: 15px;}
.login_layout .ll_others button{width: 100%; padding: 15px 0px; font-size: 15px;}
.login_layout .ll_others > div:not(:last-child){margin-bottom: 15px;}
.login_layout .ll_others > div > div{margin-top: 5px; text-align: center; color: var(--text_silver);}

.login_btn{display: grid; grid-template-columns: 15px 1fr; align-items: center; padding: 0px 25px 0px 40px; box-sizing: border-box;}
.login_btn > div{width: 100%;}
.login_btn > div:first-child > div{width: 15px; height: 15px;}

.login_token{margin-top: 10px; margin-bottom: 15px; text-align: center; padding: 10px 15px; background: var(--bg_silvercalm); border-radius: 10px;}
.login_token > div:first-child{}
.login_token > div:nth-child(2){margin-top: 5px; margin-bottom: 5px; font-size: 30px; font-family: 'bold'; color: var(--text_red);}
.login_token > div:nth-child(3){margin-bottom: 15px; width: 80%;}
.login_token > div:nth-child(3) > div{width: 100%; padding-bottom: 20%; background-image: url('../../../images/icon/others/telco_token.png'); background-size: 100%;}
.login_token > div:nth-child(4){color: var(--text_silver); font-size: 11px;}

.login_smartfren{margin-top: 10px; margin-bottom: 15px; text-align: center; padding: 10px 15px; background: var(--bg_line); border-radius: 10px;}
.login_smartfren > div:first-child{margin-bottom: 15px; width: 70%;}
.login_smartfren > div:first-child > div{width: 100%; padding-bottom: 20%; background-image: url('../../../images/icon/others/telco_smartfren.png'); background-size: 100%;}
.login_smartfren > div:nth-child(2){color: var(--text_silver); font-size: 11px;}

.login_check_token{max-width: 700px; padding: 20px 25px; border: 1px solid var(--bg_silver); margin-top: 100px; border-radius: 10px;}
.login_check_token.process{border: 1px solid var(--bg_red); color: var(--text_silver);}

/**EXPLORE**/
.exp_banner{position: relative;}
/* .exp_banner{position: relative; border-bottom: 2px solid var(--bg_red);} */
.exp_banner > a > div{padding-bottom: 30%; position: relative;}
.exp_banner > a > div:before{content: ''; bottom: 0px; left: 0px; width: 100%; height: 50%; position: absolute; background-image: linear-gradient(to bottom, transparent, var(--bg_base));}

.exp_welcome{height: 250px; background: var(--bg_red); position: relative; overflow: hidden;}
.exp_welcome:before{content: ''; bottom: 0px; left: 0px; position: absolute; width: 100%; height: 200%; background-image: linear-gradient(to bottom, transparent, var(--bg_base));}
.exp_welcome .ewBox{padding: 25px 25px 0px 25px; position: relative; z-index: 1;}
.exp_welcome .ewBox > div:first-child{font-size: 35px; font-family: 'bold';}

.exp_page{position: relative; z-index: 1;}

.exp_games{position: fixed; bottom: 45px; right: 45px; cursor: pointer; z-index: 55; width: 75px; height: 75px; background-image: url('../../../images/icon/others/games.png'); background-size: 100%; transition: all 1s ease;}
.exp_games.active{bottom: calc(100vh - 50px); transform: scale(3);}

/**ARCADE**/
.arcade_banner{height: 250px; background-image: url(../../../images/background/arcade_bg.png); background-size: cover; margin-top: 15px; border-radius: 10px; position: relative;}
.arcade_banner .abDesc{position: absolute; bottom: 25px; left: 25px; z-index: 1;}
.arcade_banner .abDesc > div:first-child{font-size: 20px;}
.arcade_banner .abDesc > div:nth-child(2){font-size: 35px; font-weight: bold;}
.arcade_banner .abBanner{background-image: url(../../../images/background/arcade.png); background-size: cover; position: absolute; bottom: 15px; right: 15px; width: 300px; height: 220px; border-radius: 30px; box-shadow: inset 0px 0px 0px 2px var(--bg_red);}

.arcade_run iframe{width: 100%; height: calc(100vh - 56px); border: none;}

/**PROFILE**/
.profile_layout{width: 600px; margin-top: 25px;}
.profile_layout .plHead{height: 200px; background-image: url(../../../images/background/account.jpg); background-size: cover; position: relative; border-radius: 10px;}
.profile_layout .plHead > div{grid-gap: 15px; display: grid; grid-template-columns: 1fr 190px; padding: 0px 25px 25px 25px; box-sizing: border-box; width: 100%; position: absolute; bottom: 0px; left: 0px;}
.profile_layout .plHead > div > div{width: 100%;}
.profile_layout .plHead .phUser{display: grid; grid-template-columns: 40px 1fr; grid-gap: 15px;}
.profile_layout .plHead .phUser > div{width: 100%;}
.profile_layout .plHead .phUser > div:first-child > div{width: 40px; height: 40px; background: var(--bg_black); border-radius: 50%;}
.profile_layout .plHead .phUser > div:first-child > div > div{width: 25px; height: 25px; top: 6px; position: relative;}
.profile_layout .plHead .phUser > div:nth-child(2) > div:first-child{font-size: 11px; margin-bottom: 2px;}
.profile_layout .plHead .phUser > div:nth-child(2) > div:nth-child(2) > div:first-child{font-family: 'bold';}
.profile_layout .plHead .phUser > div:nth-child(2) > div:nth-child(2) > div:nth-child(2){font-size: 11px; margin-top: 3px;}
.profile_layout .plHead .phPoints > div:first-child{display: inline-block; width: 100%;}
.profile_layout .plHead .phPoints > div:first-child > div{float: right; display: grid; grid-template-columns: 15px 1fr; grid-gap: 10px; align-items: center;}
.profile_layout .plHead .phPoints > div:first-child > div > div{width: 100%;}
.profile_layout .plHead .phPoints > div:first-child > div > div:first-child > div{width: 15px; height: 15px;}
.profile_layout .plHead .phPoints > div:nth-child(2){text-align: right; margin-top: -7px; font-size: 15px; font-weight: bold;}
.profile_layout .plHead .phPoints > div:nth-child(3){text-align: right; font-size: 11px; margin-top: 3px;}

.profile_service{margin-top: 15px; min-height: 250px;}
.profile_service .psTitle{font-size: 17px; font-family: 'bold';}
.profile_service .psContent{margin-top: 15px;}
.profile_service .psContent > div{padding: 15px 20px; background: var(--bg_black); border-radius: 10px;}
.profile_service .psContent > div:not(:last-child){margin-bottom: 15px;}
.profile_service .psContent > div > div:first-child{margin-bottom: 3px;}
.profile_service .psContent > div > div:first-child span{padding: 2px 5px; border-radius: 3px; font-size: 9px; position: relative; bottom: 2px; margin-right: 5px;}
.profile_service .psContent > div > div:first-child span.premium{background: var(--bg_red); color: var(--text_white);}
.profile_service .psContent > div > div:nth-child(2){font-size: 11px;}

.profile_points_head{display: grid; grid-template-columns: 1fr 1fr; grid-gap: 1px; padding: 15px 0px; box-sizing: border-box; background: var(--bg_black); border-radius: 10px;}
.profile_points_head > div{width: 100%; position: relative; padding-left: 20px; box-sizing: border-box;}
.profile_points_head > div:nth-child(2):before{content: ''; position: absolute; top: 2px; left: 0px; height: 85%; width: 1px; background: var(--bg_white);}
.profile_points_head .pphBox{display: grid; grid-template-columns: 20px 1fr; grid-gap: 10px; align-items: center;}
.profile_points_head .pphBox > div{width: 100%;}
.profile_points_head .pphBox > div:first-child > div{width: 20px; height: 20px;}
.profile_points_head .pphBox > div:nth-child(2) > div:first-child{font-size: 11px;}
.profile_points_head .pphBox > div:nth-child(2) > div:nth-child(2){margin-top: 2px; font-family: 'bold';}

.profile_points_history{margin-top: 15px; min-height: 250px;}
.profile_points_history .pphTitle{font-size: 17px; font-family: 'bold';}
.profile_points_history .pphContent{margin-top: 15px;}
.profile_points_history .pphContent > div{padding: 15px 20px; background: var(--bg_black); border-radius: 10px;}
.profile_points_history .pphContent > div:not(:last-child){margin-bottom: 15px;}
.profile_points_history .pphContent > div > div:first-child{font-size: 11px;}
.profile_points_history .pphContent > div > div:nth-child(2){display: grid; grid-template-columns: 1fr 150px; grid-gap: 15px; box-sizing: border-box;}
.profile_points_history .pphContent > div > div:nth-child(2) > div{width: 100%;}
.profile_points_history .pphContent > div > div:nth-child(2) > div:first-child{display: grid;}
.profile_points_history .pphContent > div > div:nth-child(2) > div:first-child > div{white-space: nowrap; width: 100%; overflow: hidden; text-overflow: ellipsis;}
.profile_points_history .pphContent > div > div:nth-child(2) > div:nth-child(2){text-align: right;}

.profile_creditcard{margin-top: 15px; min-height: 250px;}
.profile_creditcard .pcHead{display: grid; grid-template-columns: 1fr 190px; align-items: center;}
.profile_creditcard .pcHead > div{width: 100%;}
.profile_creditcard .pcHead > div:first-child{font-size: 17px; font-family: 'bold';}
.profile_creditcard .pcHead > div:nth-child(2){text-align: right;}
.profile_creditcard .pcContent{margin-top: 25px;}
.profile_creditcard .pcContent > div{padding: 15px 20px; background: var(--bg_black); border-radius: 10px; display: grid; grid-template-columns: 1fr 80px; align-items: center; box-sizing: border-box;}
.profile_creditcard .pcContent > div:not(:last-child){margin-bottom: 15px;}
.profile_creditcard .pcContent > div > div{width: 100%;}
.profile_creditcard .pcContent > div > div:first-child{font-weight: bold;}
.profile_creditcard .pcContent > div > div:nth-child(2){font-size: 11px; text-align: right;}

.profilecc .pcTitle{padding: 15px 15px 16px 15px; font-weight: bold; background: var(--bg_black); color: var(--text_white);}
.profilecc .pcCard{padding: 15px 15px 0px 15px; color: var(--text_white);}
.profilecc .pcCard > div{height: 185px; background: var(--bg_gradient1); border-radius: 10px; position: relative;}
.profilecc .pcCard > div > div{position: relative;}
.profilecc .pcCard > div > div:first-child{width: 40px; height: 40px; position: absolute; top:  15px; left: 15px;}
.profilecc .pcCard > div > div:nth-child(2){top: 73px; font-weight: bold; font-size: 22px; height: 34px; text-align: right; padding-right: 15px; letter-spacing: 5px;}
.profilecc .pcCard > div > div:nth-child(3){top: 110px; padding-left: 15px; font-size: 13px; white-space: nowrap;}
.profilecc .pcCard > div > div:nth-child(3) > div{display: inline-block; vertical-align: middle;}
.profilecc .pcCard > div > div:nth-child(3) > div:first-child{font-size: 9px; line-height: 8.5px; margin-right: 10px;}
.profilecc .pcInput{padding: 15px 15px 0px 15px;}

/**GAMES**/
.games_run iframe{width: 100%; height: calc(100vh - 56px); border: none;}

/**SEARCH**/
.s_layout{width: 600px; padding-top: 35px; padding-bottom: 35px; min-height: 300px;}
.s_layout .slHead{padding: 25px 35px; background: var(--bg_black); border-radius: 10px;}
.s_layout .slHead input{width: 100%; background: var(--bg_white); font-size: 20px; padding: 10px 20px;}
.s_layout .slResult{margin-top: 25px;}
.s_layout .slResult > div:first-child{text-align: center;}
.s_layout .slResult > div:first-child > div:first-child{font-size: 20px;}
.s_layout .slResult > div:first-child > div:nth-child(2){font-size: 14px;}
.s_layout .slResult > div:nth-child(2){margin-top: 20px;}

.s_info{margin-top: 70px; text-align: center; color: var(--text_silver);}

/**FREEPASS**/
.fpLayout{display: grid; grid-template-columns: 300px 1fr; grid-gap: 20px; min-height: 500px;}
.fpLayout > div{width: 100%;}

.fpMe{padding: 15px 20px; position: sticky; top: 85px; border-radius: 10px; overflow: hidden;}
.fpMe:before{content: ''; background-image: var(--bg_gradient); position: absolute; top: 0px; left: 0px; width: 100%; height: 250px;}
.fpMe > div{position: relative; z-index: 1;}
.fpMe > div:first-child{display: grid; grid-template-columns: 1fr 70px; align-items: center;}
.fpMe > div:first-child > div{width: 100%;}
.fpMe > div:first-child > div:nth-child(2){margin-top: 3px; font-size: 20px; font-family: 'bold'; text-align: right;}
.fpMe > div:nth-child(2){margin-top: 15px; background: var(--bg_white); border-radius: 10px;}
.fpMe > div:nth-child(2) > div{padding: 10px 15px; color: var(--text_black); position: relative; cursor: pointer;}
.fpMe > div:nth-child(2) > div:not(:last-child){border-bottom: 1px solid var(--bg_line);}
.fpMe > div:nth-child(2) > div:before{content: ''; position: absolute; top: 7px; right: 10px; width: 2px; height: 26px; background: var(--bg_silver); opacity: 0; transition: var(--transition);}
.fpMe > div:nth-child(2) > div:hover:before{opacity: 1;}
.fpMe > div:nth-child(2) > div.active:before{background: var(--bg_red); opacity: 1;}

/**REDEEMLIST**/
.rl_head{padding: 25px 0px 0px 0px; display: grid; grid-template-columns: 1fr 150px; align-items: center;}
.rl_head > div{width: 100%;}
.rl_head > div:first-child{font-size: 25px; font-family: 'bold';}
.rl_head > div:nth-child(2){text-align: right;}
.rl_head > div:nth-child(2) > span{padding: 5px 20px 6px 20px; border-radius: 50px; background: var(--bg_gradient1); font-weight: bold; color: var(--text_white);}

.rl_detail .rdHead{display: grid; grid-template-columns: 100px 1fr; grid-gap: 20px; padding: 20px; box-sizing: border-box; background: var(--bg_blackcalm); color: var(--text_white);}
.rl_detail .rdHead > div{width: 100%;}
.rl_detail .rdHead .rhCover > div{width: 100px; height: 100px; background-color: var(--bg_silvercalm); border-radius: 5px;}
.rl_detail .rdHead .rhInfo > div:first-child{font-size: 15px; font-weight: bold;}
.rl_detail .rdHead .rhInfo > div:nth-child(2){margin-top: 5px;}
.rl_detail .rdHead .rhInfo > div:nth-child(3){margin-top: 10px;}
.rl_detail .rdTos{margin: 15px 15px 0px 15px;}
.rl_detail .rdTos > div:first-child{font-weight: bold; color: var(--text_red);}
.rl_detail .rdTos > div:nth-child(2){margin-top: 5px; padding: 15px; border: 1px solid var(--bg_line); border-radius: 10px; overflow: auto; height: 200px;}

.rl_status{padding: 15px;}
.rl_status > div:first-child > div{width: 64px; height: 64px;}
.rl_status > div:nth-child(2){text-align: center; margin-top: 10px; font-weight: bold;}
.rl_status > div:nth-child(3){text-align: center; margin-top: 15px;}

/**QUIZ**/
.quiz_popup{width: 340px; height: 485px; background-image: url('../../../images/quiz/bg.png'); background-size: cover; position: relative;}
.quiz_popup .qpInfo{position: absolute; top: 52px; left: 0px; text-shadow: 0px 5px 0px var(--bg_black); width: 100%; text-align: center; color: var(--text_white); font-size: 23px; font-family: 'bold';}
.quiz_popup .qpInfo > div:nth-child(2){margin-top: 130px;}
.quiz_popup .qpBtn{position: absolute; width: 100%; bottom: 49px; left: 0px;}
.quiz_popup .qpBtn > div{width: 185px; height: 41px; background-size: cover;}
.quiz_popup .qpBtn > div:first-child{background-image: url('../../../images/quiz/btnMain.png');}
.quiz_popup .qpBtn > div:nth-child(2){background-image: url('../../../images/quiz/btnNanti.png');margin-top: 15px;}

/**PAGES**/
.pages_iphone_header{height: 300px; background: var(--bg_black); border-top: 2px solid var(--bg_red);}
.pages_iphone_header > div{width: 558px; height: 250px; margin-top: 20px; background-image: url('../../../images/background/pages-win-iphone.png'); background-size: cover;}
.pages_iphone_layout{height: 500px; width: 700px; margin-top: 10px;}
.pages_iphone_layout > div:first-child{white-space: nowrap; width: 100%; font-size: 0px;}
.pages_iphone_layout > div:first-child > div{display: inline-block; cursor: pointer; padding: 10px 15px; width: 100px; text-align: center; position: relative; font-size: 17px;}
.pages_iphone_layout > div:first-child > div:before{content: ''; bottom: 0px; left: 0px; position: absolute; width: 100%; height: 3px; background: var(--bg_silver); opacity: 0; transition: var(--transition);}
.pages_iphone_layout > div:first-child > div:hover:before{opacity: 1;}
.pages_iphone_layout > div:first-child > div.active:before{opacity: 1; background: var(--bg_red);}
.pages_iphone_layout > div:nth-child(2){padding-top: 25px;}
.pages_iphone_layout > div:nth-child(2) > div:not(.active){display: none;}
.pages_iphone_layout .pilContent > div:not(:first-child){margin-top: 25px;}
.pages_iphone_layout .pilTos{padding: 0px 15px 15px 15px;}
.pages_iphone_layout .pilPer{padding: 0px 15px 15px 15px; text-align: center; font-size: 17px;}

.pages_iphone_search{padding: 15px 25px; background: var(--bg_black); border-radius: 10px;}
.pages_iphone_search > div{display: grid; grid-template-columns: 1fr 70px; grid-gap: 15px;}
.pages_iphone_search > div > div{width: 100%;}

.pages_iphone_search_content{padding: 15px 25px;}
.pages_iphone_search_content > div{display: grid; grid-gap: 15px; grid-template-columns: 1fr 200px;}
.pages_iphone_search_content > div > div{width: 100%; font-size: 17px;}
.pages_iphone_search_content .piscContent{letter-spacing: 3px; color: var(--text_red); font-family: 'bold';}
.pages_iphone_search_content .piscInfo{text-align: right;}

.pages_iphone_leaderboard{}
.pages_iphone_leaderboard > div{padding: 15px 25px;}
.pages_iphone_leaderboard > div > div{display: grid; grid-gap: 15px; grid-template-columns: 50px 1fr 200px;}
.pages_iphone_leaderboard > div > div > div{width: 100%; font-size: 17px;}
.pages_iphone_leaderboard .pilNumb{}
.pages_iphone_leaderboard .pilContent{letter-spacing: 3px; color: var(--text_red); font-family: 'bold';}
.pages_iphone_leaderboard .pilInfo{text-align: right;}

/**VERIFY**/
.verify_nobar{margin: 50px auto; max-width: 500px;}
.verify_nobar .vnHead > div{width: 135px; height: 26px;}
.verify_nobar .vnBody{margin-top: 35px; border: 1px solid var(--bg_line); border-radius: 10px; padding: 20px; display: grid; grid-template-columns: 55px 1fr; grid-gap: 20px; align-items: center;}
.verify_nobar .vnBody > div{width: 100%;}
.verify_nobar .vnBody > div:first-child > div{width: 55px; height: 55px;}
.verify_nobar .vnBody > div:nth-child(2) > div:first-child{font-size: 17px; font-family: 'bold';}
.verify_nobar .vnBody > div:nth-child(2) > div:nth-child(2){margin-top: 10px;}
.verify_nobar .vnBack{margin-top: 35px; text-align: center;}

/**NOBAR**/
.nobar_box{padding: 15px; border: 1px solid var(--bg_red); border-radius: 5px;}
.nobar_box span{padding: 3px 7px; background: var(--bg_silver); font-size: 11px; border-radius: 3px;}

.nobar_layout{position: absolute; width: 100%; height: 100%; display: grid; grid-template-columns: 1fr 350px;}
.nobar_layout > div{width: 100%; position: relative;}
.nobar_layout > div:nth-child(2){background: var(--bg_blackcalm);}
.nobar_layout .nlVideo{width: 100%; height: 100%;}

.nlRight{display: grid; grid-template-rows: 145px 1fr; height: 100%;}
.nlRight > div{width: 100%; position: relative;}

.nbOpt{height: 35px; border-bottom: 1px solid var(--bg_red);}
.nbOpt .close{width: 35px; height: 35px; float: right; margin-right: 15px; cursor: pointer;}
.nbOpt .close > div{width: 15px; height: 15px; margin-top: 10px;}
.nbOpt .minimize{width: 35px; height: 35px; float: left; margin-left: 5px; cursor: pointer;}
.nbOpt .minimize > div{width: 15px; height: 15px; margin-top: 10px;}

.nbInfo{padding: 15px 20px 17px 20px; background: var(--bg_black); border-radius: 5px; margin: 15px;}
.nbInfo > div:first-child{font-family: 'bold';}
.nbInfo > div:nth-child(2){margin-top: 10px;}
.nbInfo > div:nth-child(2) span{padding: 3px 5px; background: var(--bg_silvercalm); border-radius: 5px; font-size: 11px; color: var(--text_black);}

.nbChat{display: grid; grid-template-rows: 35px 1fr 60px; position: absolute; width: 100%; height: 100%; top: 0px; left: 0px;}
.nbChat > div{width: 100%;}
.nbChat .ncTitle{padding: 0px 15px; font-size: 17px;}
.nbChat .ncBody{overflow: auto; padding: 0px 15px; box-sizing: border-box;}
.nbChat .ncInput{display: grid; grid-template-columns: 25px 1fr; grid-gap: 15px; box-sizing: border-box; padding: 10px 15px; border-top: 1px solid var(--bg_black); align-items: center;}
.nbChat .ncInput > div{width: 100%;}
.nbChat .ncInput > div:first-child > div{width: 25px; height: 25px;}
.nbChat .ncInput > div input{color: var(--text_white);}

/**WATCH**/
.watch_top{height: 0px; width: 100%; position: relative;}
.watch_top.wtStick{position: fixed; top: 0px;}
.watch_top > div{position: absolute; top: 0px; left: 0px; width: 100%; z-index: 10;}
.watch_top > div > div{padding: 15px 35px;}
.watch_top > div > div > div{display: table; table-layout: fixed; width: 100%;}
.watch_top > div > div > div > div{display: table-cell; vertical-align: middle;}
.watch_top > div > div > div > div:first-child{width: 35px; padding-right: 35px; display: none; cursor: pointer;}
.watch_top.wtStick > div > div > div > div:first-child{display: table-cell;}
.watch_top > div > div > div > div:first-child > div{width: 15px; height: 15px;}
.watch_top > div > div > div > div:nth-child(2){}
.watch_top > div > div > div > div:nth-child(2) > div{width: 150px; height: 30px; float: left;}

.watch_banner{}
.watch_banner > div:first-child{height: 230px;}
.watch_banner > div:nth-child(2){position: absolute; top: 60px; left: 0px; width: 100%; padding-bottom: 30%; background-size: 100%; background-color: var(--bg_black);}
.watch_banner > div:nth-child(2):before{content: ''; position: absolute; bottom: 0px; left: 0px; width: 100%; padding-bottom: 33%; background-image: linear-gradient(to top, #111113, transparent);}
.watch_content{color: var(--text_white); position: relative; z-index: 1;}
.watch_content > div{display: table; table-layout: fixed; width: 100%;}
.watch_content > div > div{display: table-cell; vertical-align: top;}
.watch_content .wc_cover{width: 250px;}
.watch_content .wc_cover > div:first-child{height: 357px; background-color: var(--bg_black); position: relative; border-radius: 7px; cursor: pointer; overflow: hidden;}
.watch_content .wc_cover > div:first-child .fcwc_play{width: 80px; height: 80px; background: var(--bg_red); opacity: 0.8; border-radius: 50%; position: relative; top: 130px;}
.watch_content .wc_cover > div:first-child .fcwc_play > div{width: 40px; height: 40px; position: relative; top: 20px; left: 3px;}
.watch_content .wc_cover:hover > div:first-child .fcwc_play{opacity: 1;}
.watch_content .wc_cover > div:first-child .fcwc_premium{padding: 5px 10px 6px 10px; background: var(--bg_red); letter-spacing: 4px; color: var(--text_white); position: absolute; top: 0px; left: 0px; font-size: 11px;}
.watch_content .wc_opt > div{margin-top: 15px;}
.watch_content .wc_opt .woBtn{display: grid; grid-template-columns: 20px 1fr; grid-gap: 15px; align-items: center; padding: 10px 15px 13px 15px; box-sizing: border-box; background: var(--bg_red); color: var(--text_white); border-radius: 5px; cursor: pointer; transition: var(--transition);}
.watch_content .wc_opt .woBtn:hover{background: var(--bg_black); color: var(--text_white); box-shadow: inset 0px 0px 0px 2px var(--bg_red);}
.watch_content .wc_opt .woBtn > div{width: 100%;}
.watch_content .wc_opt .woBtn > div > div{width: 20px; height: 20px;}
.watch_content .wc_desc{padding-left: 35px; padding-top: 25px;}
.watch_content .wc_desc > div:first-child{display: grid; grid-template-columns: 1fr; grid-gap: 15px;}
.watch_content .wc_desc > div:first-child.withIcon{display: grid; grid-template-columns: 1fr 50px; grid-gap: 15px;}
.watch_content .wc_desc > div:first-child > div{width: 100%;}
.watch_content .wc_desc > div:first-child h1{font-size: 30px; font-weight: bold;}
.watch_content .wc_desc > div:first-child > div:first-child > div:nth-child(2){margin-top: 10px; white-space: nowrap;}
.watch_content .wc_desc > div:first-child > div:first-child > div:nth-child(2) > div{display: inline-block; padding: 3px 5px; background: var(--bg_silvercalm); color: var(--text_black); border-radius: 5px;}
.watch_content .wc_desc > div:first-child > div:first-child > div:nth-child(2) > div:not(:last-child){margin-right: 15px;}
.watch_content .wc_desc > div:first-child > div:nth-child(2) img{width: 50px; margin-top: 15px;}
.watch_content .wc_desc > div:nth-child(2){margin-top: 15px;}
.watch_content .wc_desc .wcd_info{padding: 15px 0px;}
.watch_content .wc_desc .wcd_detail{padding: 15px 0px;}
.watch_content .wc_desc .wcd_detail > div{display: table; table-layout: fixed; width: 100%;}
.watch_content .wc_desc .wcd_detail > div > div{display: table-row;}
.watch_content .wc_desc .wcd_detail > div > div > div{display: table-cell; vertical-align: middle; padding: 5px 0px}
.watch_content .wc_desc .wcd_detail > div > div > div:first-child{width: 140px; font-family: 'bold';}

.film_watch_video{display: none;}
.film_watch_video > div{position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 190; display: grid; grid-template-rows: 50px 1fr 90px; color: var(--text_white); background: var(--bg_black);}
.film_watch_video > div > div{width: 100%; height: 100%;}
.film_watch_video .fwvHead{padding: 0px 15px; display: grid; grid-template-columns: 30px 1fr; grid-gap: 15px; align-items: center;}
.film_watch_video .fwvHead > div{width: 100%;}
.film_watch_video .fwvHead > div:first-child > div{width: 20px; height: 20px; cursor: pointer;}
.film_watch_video .fwvHead > div:nth-child(2) > div{width: 100px; height: 21px; float: left;}
.film_watch_video .fwvInfo{padding: 0px 15px; display: grid; grid-template-columns: 45px 1fr; grid-gap: 15px; align-items: center;}
.film_watch_video .fwvInfo > div{width: 100%;}
.film_watch_video .fwvInfo > div:first-child > div{padding-bottom: 150%; border-radius: 5px; background-color: var(--bg_silvercalm);}
.film_watch_video .fwvInfo > div:nth-child(2){font-family: 'bold';}

.watch_review{margin-top: 25px; padding: 20px; background: var(--bg_black); border-radius: 10px;}
.watch_review > div:first-child{font-size: 17px; font-family: 'bold';}
.watch_review > div:nth-child(2){margin-top: 10px; color: var(--text_silver); overflow: hidden; position: relative;}
.watch_review:not(.notReview) > div:nth-child(2).notShow{height: 100px;}
.watch_review:not(.notReview) > div:nth-child(2).show{height: auto;}
.watch_review:not(.notReview) > div:nth-child(2).notShow:before{content: ''; position: absolute; bottom: 0px; left: 0px; width: 100%; height: 80%; background-image: linear-gradient(to bottom, transparent, var(--bg_black));}
.watch_review:not(.notReview) > div:nth-child(3){display: inline-block; width: 100%;}
.watch_review:not(.notReview) > div:nth-child(3) > div{float: right; padding: 3px 5px 4px 5px; background: red; border-radius: 5px; margin-top: 10px; cursor: pointer;}

.watch_series > div:first-child{font-size: 17px; font-family: 'bold'; color: var(--text_white); margin-top: 15px;}

/**SERIES**/
.series_banner{}
.series_banner > div:first-child{height: 150px;}
.series_banner > div:nth-child(2){position: absolute; top: 0px; left: 0px; width: 100%; height: 400px; background-color: var(--bg_black);}
.series_banner > div:nth-child(2):before{content: ''; position: absolute; bottom: 0px; left: 0px; width: 100%; height: 80%; background-image: linear-gradient(to top, #111113, transparent);}
.series_layout{position: relative; z-index: 1;}
.series_layout > div:first-child h1{font-size: 30px; font-weight: bold; color: var(--text_white);}
.series_layout > div:nth-child(2){display: grid; grid-template-columns: 350px 1fr; grid-gap: 30px; margin-top: 25px;}
.series_layout > div:nth-child(2) > div{width: 100%;}
.series_layout .fLeftFixed{position: fixed; width: 350px; top: 70px;}
.series_layout .fType{white-space: nowrap;}
.series_layout .fType > div{display: inline-block; color: var(--text_white); font-size: 11px; padding: 3px 7px; border-radius: 5px; background: rgba(255, 255, 255, 0.25);}
.series_layout .fType > div:not(:last-child){margin-right: 10px;}
.series_layout .fInfo{position: relative; overflow: hidden; border-radius: 10px; margin-top: 17px; background: rgba(255, 255, 255, 0.25); color: var(--text_white);}
.series_layout .fInfo:before{content: ''; position: absolute; width: 50%; height: 100%; top: 0px; left: 0px; background: var(--bg_black);}
.series_layout .fInfo > div{padding: 20px; position: relative; z-index: 1;}
.series_layout .fInfo > div > div{display: grid; grid-template-columns: 1fr 1fr; grid-gap: 15px;}
.series_layout .fInfo > div > div:not(:last-child){margin-bottom: 10px;}
.series_layout .fInfo > div > div > div{width: 100%;}
.series_layout .fInfo > div > div > div:nth-child(2){text-align: right; color: var(--text_silver);}
.series_layout .fDesc{margin-top: 15px; padding: 15px; background: var(--bg_black); border-radius: 10px;}
.series_layout .fDesc > div:first-child{font-size: 17px; font-family: 'bold'; color: var(--text_white);}
.series_layout .fDesc > div:nth-child(2){margin-top: 10px; color: var(--text_silver);}
.series_layout .fButton{margin-top: 25px;}
.series_layout .fButton > div:not(:last-child){margin-bottom: 20px;}
.series_layout .fButton > div button{width: 100%;}
.series_layout .fEpisode > div:first-child{font-size: 17px; font-family: 'bold'; color: var(--text_white);}

/**LIVE**/
@keyframes animatedBgGala {
  from {background-position: 0 0;}
  to {background-position: 100% 0;}
}
.live_index{margin-bottom: 45px;}
.live_index .liHead{height: 300px; position: relative; background: var(--bg_black);}
.live_index .liHead .lhTxt{text-align: center;}
.live_index .liHead .lhTxt > div{font-size: 130px; font-family: 'bold'; letter-spacing: 35px; position: relative;}
.live_index .liHead .lhTxt > div{background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(
90deg
,blue,green); animation: animatedBgGala 10s linear infinite alternate; background-size: contain; filter: opacity(30%);}
.live_index .liHead .lhTxt > div:first-child{top: -30px;}
.live_index .liHead .lhTxt > div:nth-child(2){top: -100px;}
.live_index .liHead .lhDecor{position: absolute; top: 0px; left: 0px; width: 100%; height: 0px; z-index: 1;}
.live_index .liHead .lhDecor > div{width: 140px; height: 140px; opacity: 90%;}
.live_index .liCover{position: relative; height: 120px;}
.live_index .liCover > div{position: absolute; bottom: -0; width: 100%; left: 0px;}
.live_index .liCover > div > div{width: 180px; height: 270px; display: none; background-color: var(--bg_silver); box-shadow: 0px 0px 0px 3px var(--bg_white); border-radius: 5px;}
.live_index .liDesc{max-width: 800px; margin-top: 25px;}
.live_index .liDesc > div:first-child{font-size: 25px; font-family: 'bold'; text-align: center;}
.live_index .liDesc > div:nth-child(2){margin-top: 15px; width: 300px;}
.live_index .liDesc > div:nth-child(2) > div{display: grid; grid-template-columns: 1fr 80px; grid-gap: 15px;}
.live_index .liDesc > div:nth-child(2).trailer{width: 400px;}
.live_index .liDesc > div:nth-child(2).trailer > div{grid-template-columns: 1fr 80px 80px;}
.live_index .liDesc > div:nth-child(2) > div > div{width: 100%;}
.live_index .liDesc > div:nth-child(2) > div > div button{width: 100%;}
.live_index .liDesc > div:nth-child(3){margin-top: 25px; border-radius: 10px; padding: 20px 25px; background: var(--bg_black);}
.live_index .liDesc > div:nth-child(3) > div:first-child{margin-bottom: 5px; font-family: 'bold';}
.live_index .liDesc > div:nth-child(3) > div:nth-child(2){color: var(--text_silver);}

.live_show > div:first-child{position: absolute; top: 15px; left: 15px; width: 35px; transition: var(--transition); cursor: pointer; height: 35px; border-radius: 50%; background: rgba(255, 255, 255, 0.35); z-index: 10;}
.live_show > div:first-child:hover{background: var(--bg_white);}
.live_show > div:first-child > div{width: 15px; height: 15px; position: relative; top: 10px;}
.live_show > div:nth-child(2){height: 100%; position: absolute; top: 0px; width: 100%; left: 0px; display: grid; grid-template-columns: 1fr 300px;}
.live_show > div:nth-child(2) > div{width: 100%; position: relative;}
.live_show .lsVideo{display: grid; grid-template-columns: 1fr; align-items: center; width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; background: var(--bg_black);}
.live_show .lsVideo > div{width: 100%;}
.live_show .lsChat{position: absolute; top: 0px; width: 100%; height: 100%; left: 0px; display: grid; grid-template-rows: 41px 1fr 75px;}
.live_show .lsChat > div{width: 100%; height: 100%;}
.live_show .lsChat > div:first-child > div{padding: 5px 15px;}
.live_show .lsChat > div:first-child > div > span:first-child{font-size: 20px; font-family: 'bold';}
.live_show .lsChat > div:first-child > div > span:nth-child(2){font-size: 10px; color: var(--text_silver); cursor: pointer; margin-top: 8px; float: right;}
.live_show .lsChat > div:nth-child(2){overflow: auto;}
.live_show .lsChat > div:nth-child(2) > div{padding: 0px 15px;}
.live_show .lsChat > div:nth-child(3) > div:first-child{padding: 10px 15px;}
.live_show .lsChat > div:nth-child(3) > div:nth-child(2){font-size: 11px; margin-top: -5px; padding-left: 16px;}
.live_show .lsChat .llcBox{display: grid; grid-template-columns: 1fr 35px; grid-gap: 15px;}
.live_show .lsChat .llcBox > div{width: 100%;}
.live_show .lsChat .llcBox input{background: var(--bg_white);}
.live_show .lsChat .llcBox .llcbSticker{width: 35px; height: 35px; background: var(--bg_black); border-radius: 5px; transition: var(--transition); cursor: pointer;}
.live_show .lsChat .llcBox .llcbSticker:hover{box-shadow: inset 0px 0px 0px 2px var(--bg_silver);}
.live_show .lsChat .llcBox .llcbSticker.active{box-shadow: inset 0px 0px 0px 2px var(--bg_red);}
.live_show .lsChat .llcBox .llcbSticker > div{width: 20px; height: 20px; position: relative; top: 7px;}
.live_show .lsChat .llcBox .llcbSticker.active > div{opacity: 0.5;}
.live_show .lsChat .llcSticker{position: relative; width: 100%; height: 0px;}
.live_show .lsChat .llcSticker > div{position: absolute; width: 100%; display: none; background: var(--bg_black); z-index: 3; bottom: 50px; left: 0px; box-shadow: 0px 0px 0px 2px var(--bg_red); border-radius: 5px;}
.live_show .lsChat .llcSticker > div > div:first-child{padding: 10px 15px 0px 15px; background: var(--bg_blue); color: var(--text_white);}
.live_show .lsChat .llcSticker > div > div:nth-child(2){height: 250px; overflow: auto; padding: 5px 15px 15px 15px;}
.live_show .lsChat .llcSticker .tcs_box{display: grid; width: 100%; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; grid-gap: 15px;}
.live_show .lsChat .llcSticker .tcs_box > div{width: 100%;}
.live_show .lsChat .llcSticker .tcs_box > div > div{width: 100%; padding-bottom: 100%; cursor: pointer; transition:all 0.2s ease}
.live_show .lsChat .llcSticker .tcs_box > div:hover > div{opacity: 0.5;}

.live_show_alert{width: 100%; height: 100%; display: grid; grid-template-columns: 1fr; align-items: center; top: 0px; left: 0px; position: absolute;}
.live_show_alert > div{width: 400px; padding: 7px 0px; text-align: center; background: var(--bg_red); border-radius: 50px;}

.live_trailer{display: none;}
.live_trailer > div{position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 70; display: grid; grid-template-columns: 1fr; align-items: center; background: rgba(0,0,0,0.58); backdrop-filter: blur(4px);}
.live_trailer > div > div{width: 100%;}
.live_trailer .ltClose{position: absolute; top: 25px; left: 25px; transition: var(--transition); width: 35px; height: 35px; border-radius: 50%; background: var(--bg_black); cursor: pointer;}
.live_trailer .ltClose:hover{box-shadow: 0px 0px 0px 1px var(--bg_white);}
.live_trailer .ltClose > div{width: 20px; height: 20px; margin-top: 7px;}
.live_trailer .ltBox{width: 800px; height: 450px; background: var(--bg_white); border-radius: 10px;}

/**PAYMENT**/
.payment_layout{margin: 25px auto 80px auto; background: var(--bg_white); max-width: 500px; border-radius: 10px; overflow: hidden;}
.payment_layout .plHead{height: 150px; background-size: cover; background-image: url('../../../images/background/account.jpg');}
.payment_layout .plHead > div{text-align: center; font-size: 20px; font-family: 'bold'; position: relative; top: 60px; letter-spacing: 7px;}
.payment_layout .plContent{padding: 30px 25px;}
.payment_layout .plContent .plcActive{color: var(--text_black);}
.payment_layout .plContent .plcActive > div:first-child{font-size: 17px; margin-bottom: 10px; font-family: 'bold';}
.payment_layout .plContent .plcActive > div:nth-child(2){color: var(--text_silver);}
.payment_layout .plContent .plcActive > div:nth-child(3){margin-top: 15px;}
.payment_layout .plContent .plcActive > div:nth-child(3) > span{padding: 5px 15px 6px 15px; border-radius: 5px; background: var(--bg_red); color: var(--text_white);}
.payment_layout .plContent .plcOthers{display: table; table-layout: fixed; width: 100%;}
.payment_layout .plContent .plcOthers > div{display: table-row;}
.payment_layout .plContent .plcOthers > div > div{display: table-cell; vertical-align: middle; padding: 15px 0px;}
.payment_layout .plContent .plcOthers > div > div:first-child > div:first-child{height: 30px; background-size: 100%; margin-bottom: 10px;}
.payment_layout .plContent .plcOthers .plcoTelcoAll{width: 240px; background-image: url('../../../images/icon/others/telco_all.png');}
.payment_layout .plContent .plcOthers .plcoTelcoSmartfren{width: 150px; background-image: url('../../../images/icon/others/telco_smartfren.png');}
.payment_layout .plContent .plcOthers .plcoVoucher{width: 240px; background-image: url('../../../images/icon/others/voucher.png');}
.payment_layout .plContent .plcOthers > div > div:nth-child(2){padding-left: 15px; width: 130px;}
.payment_layout .plContent .plcOthers button{width: 100%; padding: 15px 0px; font-size: 15px;}
.payment_layout .plContent .plcOthers > div:not(:last-child){margin-bottom: 15px;}
.payment_layout .plContent .plcOthers > div > div{margin-top: 5px; text-align: center; color: var(--text_silver);}

.payment_method{margin: 25px auto 80px auto; background: var(--bg_white); max-width: 500px; border-radius: 10px; overflow: hidden; color: var(--text_black);}
.payment_method .pmHead{padding: 15px 25px 10px 25px; border-bottom: 2px solid var(--bg_line); display: grid; grid-template-columns: 100px 1fr; grid-gap: 15px; align-items: center; box-sizing: border-box;}
.payment_method .pmHead > div{width: 100%;}
.payment_method .pmHead > div:first-child > div{height: 40px;}
.payment_method .pmHead > div:nth-child(2){font-weight: bold; font-size: 15px;}
.payment_method .pmInfo{padding: 15px 25px 0px 25px;}
.payment_method .pmCountDown{}
.payment_method .pmCountDown > div:first-child{font-weight: bold; margin-top: 15px; text-align: center; color: var(--text_silver);}
.payment_method .pmCountDown > div:nth-child(2){display: table; border-collapse: separate; border-spacing: 15px 10px;}
.payment_method .pmCountDown > div:nth-child(2) > div{display: table-cell; padding: 10px 0px; width: 50px; background: var(--bg_silvercalm); color: var(--text_red); border-radius: 10px; text-align: center; font-size: 20px; font-weight: bold; box-shadow: inset 0px 0px 0px 2px var(--bg_line);}
.payment_method .pmQr{padding: 25px 0px;}
.payment_method .pmQr > div{width: 270px; height: 270px; background-size: cover;}
.payment_method .pmStatus{padding: 25px 0px 45px 0px; font-size: 15px; font-weight: bold; text-align: center;}
.payment_method .pmStatus > span{padding: 10px 15px; border-radius: 10px; background: var(--bg_silvercalm); color: var(--text_silver);}
.payment_method .pmStatus.expired > span{background: var(--bg_red); color: var(--text_white);}
.payment_method .pmStatus.success > span{background: var(--bg_green); color: var(--text_white);}

.payment_package{background: var(--bg_blackcalm); color: var(--text_white); position: relative;}
.payment_package .ppHead{padding: 10px 0px; background: var(--bg_black); font-size: 17px; font-family: 'bold'; text-align: center;}
.payment_package .ppClose{position: absolute; z-index: 1; width: 15px; height: 15px; top: 15px; left: 15px; cursor: pointer;}
.payment_package .ppOpt{padding: 13px 15px; display: grid; grid-template-columns: 1fr 1fr; grid-gap: 15px; align-items: center; box-sizing: border-box;}
.payment_package .ppOpt > div{width: 100%;}
.payment_package .ppOpt > div > div{padding: 10px 0px; cursor: pointer; border-radius: 50px; box-shadow: inset 0px 0px 0px 2px var(--bg_red); text-align: center; font-family: 'bold';}
.payment_package .ppOpt > div > div.active{background: var(--bg_red);}
.payment_package .ppBody{padding-bottom: 20px;}
.payment_package .ppBody > span > div:not(:first-child){margin-top: 20px;}
.payment_package .ppBody .pbPayment{border-radius: 10px; margin-left: 15px; margin-right: 15px; background: var(--bg_red);}
.payment_package .ppBody .pbPayment > div:first-child{padding: 10px 15px;}
.payment_package .ppBody .pbPayment > div:first-child > div:first-child{font-size: 12px;}
.payment_package .ppBody .pbPayment > div:first-child > div:nth-child(2){font-size: 25px; margin: 5px 0px;}
.payment_package .ppBody .pbPayment > div:first-child > div:nth-child(3){font-size: 9px; padding-bottom: 5px; border-bottom: 1px solid var(--bg_white);}
.payment_package .ppBody .pbPayment > div:first-child > div:nth-child(4){padding-top: 5px; font-size: 12px;}
.payment_package .ppBody .pbPayment > div:nth-child(2){border-radius: 10px; background: var(--bg_white); padding: 0px 15px;}
.payment_package .ppBody .pbPayment > div:nth-child(2) > div{padding: 13px 0px; cursor: pointer; display: grid; grid-template-columns: 1fr 100px; box-sizing: border-box; align-items: center;}
.payment_package .ppBody .pbPayment > div:nth-child(2) > div:not(:last-child){border-bottom: 1px solid var(--bg_silvercalm);}
.payment_package .ppBody .pbPayment > div:nth-child(2) > div > div{width: 100%; color: var(--text_red); font-size: 15px;}
.payment_package .ppBody .pbPayment > div:nth-child(2) > div > div:first-child{white-space: nowrap;}
.payment_package .ppBody .pbPayment > div:nth-child(2) > div > div:first-child > div{display: list-item; font-size: 0px;}
.payment_package .ppBody .pbPayment > div:nth-child(2) > div.pmOther > div:first-child img{height: 17px;}
.payment_package .ppBody .pbPayment > div:nth-child(2) > div.pmTelco > div:first-child img{height: 25px;}
.payment_package .ppBody .pbPayment > div:nth-child(2) > div > div:nth-child(2){text-align: right;}

.payment_input{}
.payment_input > div:first-child{padding-top: 20px; text-align: center;}
.payment_input > div:first-child > img{height: 23px;}
.payment_input > div:nth-child(2){padding: 15px 15px 0px 15px;}
.payment_input > div:nth-child(2) > div:first-child{margin-bottom: 10px; text-align: center;}
.payment_input > div:nth-child(2) input{font-size: 17px; text-align: center;}
.payment_input > div:nth-child(3){padding: 15px 15px 25px 15px; text-align: center;}
.payment_input > div:nth-child(3) button{width: 120px;}

.payment_freepass_method{background: var(--bg_gradient1); border-radius: 10px; overflow: auto; margin: 15px;}
.payment_freepass_method .pfmQty{padding: 15px 15px 0px 15px; display: grid; grid-template-columns: 1fr 80px; grid-gap: 15px; align-items: center; box-sizing: border-box;}
.payment_freepass_method .pfmQty > div{width: 100%;}
.payment_freepass_method .pfmQty .pqBox > div{display: grid; grid-template-columns: 15px 1fr 15px; grid-gap: 5px; align-items: center;}
.payment_freepass_method .pfmQty .pqBox > div > div{width: 100%;}
.payment_freepass_method .pfmQty .pqBox .pbBtn > div{width: 15px; height: 15px; background: var(--bg_red); cursor: pointer;}
.payment_freepass_method .pfmQty .pqBox .pbBtn > div > div{width: 10px; height: 10px; position: relative; top: 2px; left: -0.5px;}
.payment_freepass_method .pfmQty .pqBox .pbCount > div{border-bottom: 1px solid var(--bg_white); padding-bottom: 3px; text-align: center;}
.payment_freepass_method .pfmMethod{margin-top: 15px;}
.payment_freepass_method .pfmMethod .pmHead{padding: 15px; display: grid; grid-template-columns: 1fr 95px; grid-gap: 15px; align-items: center; box-sizing: border-box;}
.payment_freepass_method .pfmMethod .pmHead > div{Width: 100%;}
.payment_freepass_method .pfmMethod .pmHead > div:first-child > div:nth-child(2){margin-top: 2px; font-size: 11px;}
.payment_freepass_method .pfmMethod .pmHead > div:nth-child(2){text-align: right; font-size: 15px; font-family: 'bold';}
.payment_freepass_method .pfmMethod .pmList{margin-top: 5px; background: var(--bg_white); border-radius: 10px;}
.payment_freepass_method .pfmMethod .pmList > div{padding: 15px; display: grid; grid-template-columns: 1fr 75px; align-items: center; box-sizing: border-box; cursor: pointer;}
.payment_freepass_method .pfmMethod .pmList > div:not(:last-child){border-bottom: 1px solid var(--bg_line);}
.payment_freepass_method .pfmMethod .pmList > div > div{width: 100%;}
.payment_freepass_method .pfmMethod .pmList > div > div:first-child{font-size: 0px;}
.payment_freepass_method .pfmMethod .pmList > div > div:first-child img{height: 15px;}
.payment_freepass_method .pfmMethod .pmList > div > div:nth-child(2){text-align: right; color: var(--text_red);}

.paymentPoints{padding: 15px 25px 30px 25px; background: var(--bg_black);}
.paymentPoints > div:first-child{padding: 10px 0px;}
.paymentPoints > div:first-child > div{width: 110px; height: 21px;}
.paymentPoints > div:nth-child(2){margin-top: 10px; text-align: center; color: var(--text_white);}
.paymentPoints > div:nth-child(2) > div:first-child{margin-bottom: 15px;}
.paymentPoints > div:nth-child(3){margin-top: 25px; padding: 20px; border: 2px solid var(--bg_blackcalm); box-sizing: border-box; border-radius: 10px; display: grid; grid-template-columns: 35px 1fr; grid-gap: 15px; align-items: center;}
.paymentPoints > div:nth-child(3) > div{width: 100%;}
.paymentPoints > div:nth-child(3) > div:first-child > div{padding-bottom: 150%; background-color: var(--bg_silver); border-radius: 3px;}
.paymentPoints > div:nth-child(3) > div:nth-child(2) > div:first-child{font-size: 15px; font-family: 'bold'; color: var(--text_white);}
.paymentPoints > div:nth-child(3) > div:nth-child(2) > div:nth-child(2){margin-top: 3px; font-size: 11px; color: var(--text_silver);}
.paymentPoints > div:nth-child(4){margin-top: 25px; display: grid; grid-template-columns: 1fr 1fr; grid-gap: 15px;}
.paymentPoints > div:nth-child(4) > div{width: 100%;}
.paymentPoints > div:nth-child(4) button{width: 100%;}

.paymentPointsFinish > div:first-child{margin-bottom: 15px;}
.paymentPointsFinish > div:nth-child(2){padding: 0px 15px;}
.paymentPointsFinish > div:nth-child(2) > div:first-child{font-size: 15px; font-weight: bold;}
.paymentPointsFinish > div:nth-child(3){padding: 15px;}

/**ABOUT**/
.about_layout{width: 600px; margin-top: 35px; margin-bottom: 35px; overflow: hidden; border-radius: 10px; background: var(--bg_white);}
.about_layout .alHead{padding: 25px 35px; color: var(--text_red); background: var(--bg_silvercalm); text-align: center;}
.about_layout .alHead h1{font-size: 20px; font-family: 'bold';}
.about_layout .alContent{padding: 20px 25px 30px 25px; color: var(--text_black); min-height: 300px;}

.about_list > div:not(:last-child){margin-bottom: 20px;}
.about_list > div > div:first-child{font-size: 17px; font-family: 'bold'; color: var(--text_red);}
.about_list > div > div:nth-child(2){padding-left: 35px; position: relative; color: var(--text_silver);}
.about_list > div > div:nth-child(2):before{content: ''; position: absolute; top: 0px; left: 15px; height: 100%; width: 2px; background: var(--bg_red);}

/**ERROR**/
.e_404{height: 250px; padding-top: 50px;}
.e_404 > div:first-child{width: 300px; height: 125px; background-image: url('../../../images/error_404.png');}
.e_404 > div:last-child{font-size: 25px; text-align: center; margin-top: 40px;}
.e_box{padding-top: 50px; padding-bottom: 50px;}
.e_box > div:first-child{width: 125px; height: 125px;}
.e_box.notavail > div:first-child{background-image: url('../../../images/e_notavail.png');}
.e_box.forbidden > div:first-child{background-image: url('../../../images/e_forbidden.png');}
.e_box > div:nth-child(2){font-size: 25px; font-family: 'bold'; text-align: center; margin-top: 40px;}
.e_box > div:last-child{width: 600px; font-size: 17px; text-align: center; margin-top: 20px;}
.e_login > div:first-child{text-align: center; font-size: 20px;}
.e_login > div:nth-child(2){text-align: center; margin-top: 25px;}

.e_verificationemail{width: 500px; min-height: calc(100vh - 350px); margin-top: 50px; margin-bottom: 100px;}
.e_verificationemail > div:first-child{font-size: 20px; font-family: 'bold';}
.e_verificationemail > div:nth-child(2){margin-top: 10px;}
.e_verificationemail > div:nth-child(3){margin-top: 25px;}

.e_info{width: 500px; padding-top: 100px; padding-bottom: 50px;}
.e_info > div:first-child{font-size: 25px; font-family: 'bold';}
.e_info > div:nth-child(2){margin-top: 15px;}
.e_info > div:nth-child(3){margin-top: 25px;}
.e_suggest{margin-bottom: 50px; padding: 20px 25px;}
.e_suggest > div:first-child{font-size: 25px; font-family: 'bold';}
.e_suggest > div:last-child{display: table; width: 100%; margin-top: 15px; table-layout: fixed;}
.e_suggest > div:last-child > div{display: table-cell; vertical-align: top;}
.e_suggest > div:last-child > div:first-child{padding-right: 15px;}
.e_suggest > div:last-child > div:last-child{width: 300px;}

.e_errorpage{display: grid; grid-template-columns: 50px 1fr; grid-gap: 15px; width: 550px; margin-top: 75px;}
.e_errorpage > div{width: 100%;}
.e_errorpage > div:first-child > div{width: 50px; height: 50px;}
.e_errorpage > div:nth-child(2) > div:first-child{font-size: 17px; font-weight: bold; margin-bottom: 5px;}