.card_search_film > a > div{padding: 25px 0px;}
.card_search_film > a:not(:last-child) > div{border-bottom: 1px solid var(--bg_silver);}
.card_search_film > a > div > div{display: table; table-layout: fixed; width: 100%;}
.card_search_film > a > div > div > div{display: table-cell; vertical-align: top;}
.card_search_film > a > div > div > div:first-child{width: 80px;}
.card_search_film > a > div > div > div:first-child > div{padding-bottom: 143%; background-color: var(--bg_silvercalm); border-radius: 5px;}
.card_search_film > a > div > div > div:nth-child(2){padding-left: 25px; padding-top: 10px;}
.card_search_film > a > div > div > div:nth-child(2) > div:first-child{font-weight: bold; font-size: 17px;}
.card_search_film > a > div > div > div:nth-child(2) > div:nth-child(2){margin-top: 5px; color: var(--text_silver);}

.card_hzl_trending{overflow: hidden; position: relative;}
.card_hzl_trending .cnt_card{overflow: auto; white-space: nowrap; font-size: 0px; -ms-overflow-style: none; scrollbar-width: none;}
.card_hzl_trending .cnt_card::-webkit-scrollbar{display: none;}
.card_hzl_trending .cnt_card > a > div{width: 215px; cursor: pointer; position: relative; font-size: 15px; display: inline-block; overflow: hidden;}
.card_hzl_trending .cnt_card > a:not(:last-child){margin-right: 20px;}
.card_hzl_trending .cnt_card > a > div > div{height: 323px; border-radius: 5px; background-color: var(--bg_silvercalm); position: relative; overflow: hidden; transition: var(--transition);}
.card_hzl_trending .cnt_card > a > div > div .cntPremium{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;}
.card_hzl_trending .cnt_card > a:hover > div > div{box-shadow: inset 0px 0px 0px 3px var(--bg_red);}
.card_hzl_trending:hover .scroll_card{opacity: 1;}

.card_hzl_film{overflow: hidden; position: relative;}
.card_hzl_film .cnt_card{overflow: auto; white-space: nowrap; font-size: 0px; -ms-overflow-style: none; scrollbar-width: none;}
.card_hzl_film .cnt_card::-webkit-scrollbar{display: none;}
.card_hzl_film .cnt_card > a > div{width: 150px; cursor: pointer; position: relative; font-size: 15px; display: inline-block; overflow: hidden;}
.card_hzl_film .cnt_card > a:not(:last-child){margin-right: 20px;}
.card_hzl_film .cnt_card > a > div > div:first-child{height: 215px; border-radius: 5px; background-color: var(--bg_silvercalm); position: relative; overflow: hidden; transition: var(--transition);}
.card_hzl_film .cnt_card > a > div > div:first-child .cntPremium{padding: 3px 3px 2px 7px; background: var(--bg_red); letter-spacing: 2px; color: var(--text_white); position: absolute; top: 0px; left: 0px; font-size: 8px; border-radius: 0px 0px 7px 0px;}
.card_hzl_film .cnt_card > a:hover > div > div:first-child{box-shadow: inset 0px 0px 0px 2px var(--bg_red);}
.card_hzl_film .cnt_card > a > div > div:nth-child(2){padding: 10px 0px;}
.card_hzl_film:not(.chfNew) .cnt_card > a > div > div:nth-child(2) > div{margin-top: 3px; color: var(--text_white); text-overflow: ellipsis; overflow: hidden;}
.card_hzl_film.chfNew .cnt_card .chfRating{display: table; min-width: min-content;}
.card_hzl_film.chfNew .cnt_card .chfRating > div{display: table-cell;}
.card_hzl_film.chfNew .cnt_card .chfRating .crItem{width: 40px; margin: 0px 2px;}
.card_hzl_film.chfNew .cnt_card .chfRating .crItem > div:first-child{width: 30px;}
.card_hzl_film.chfNew .cnt_card .chfRating .crItem > div:first-child > div{padding: 28%;}
.card_hzl_film.chfNew .cnt_card .chfRating .crItem > div:nth-child(2){text-align: center; font-size: 11px;}
.card_hzl_film.chfNew .cnt_card .chfTitle{margin-top: 3px; color: var(--text_white); text-overflow: ellipsis; overflow: hidden;}
.card_hzl_film:hover .scroll_card{opacity: 1;}

.card_film{display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; grid-gap: 20px;}
.card_film > a{margin: 0px;}
.card_film > a > div{width: 100%;}
.card_film > a > div > div:first-child{padding-bottom: 143%; background-color: var(--bg_black); overflow: hidden; border-radius: 5px; position: relative;}
.card_film > a > div > div:first-child .cntPremium{padding: 3px 3px 2px 7px; background: var(--bg_red); letter-spacing: 2px; color: var(--text_white); position: absolute; top: 0px; left: 0px; font-size: 8px; border-radius: 0px 0px 7px 0px;}
.card_film > a > div > div:first-child .cntOpt{position: absolute; bottom: 0px; cursor: default; padding: 7px 0px; left: 0px; width: 100%; background: var(--bg_blackcalm);}
.card_film > a > div > div:first-child .cntOpt > div{width: 15px; height: 15px; cursor: pointer; display: inline-block; float: right; margin-right: 6px;}
.card_film > a > div > div:nth-child(2){padding: 15px 0px 20px 0px; display: inline-grid; width: 100%;}
.card_film:not(.cfNew) > a > div > div:nth-child(2) > div{font-weight: bold; width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; color: var(--text_white);}
.card_film.cfNew .cfTitle{font-weight: bold; width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; color: var(--text_white);}
.card_film.cfNew .cfRating{display: table; min-width: min-content;}
.card_film.cfNew .cfRating > div{display: table-cell;}
.card_film.cfNew .cfRating .crItem{width: 40px; margin: 0px 2px;}
.card_film.cfNew .cfRating .crItem > div:first-child{width: 30px;}
.card_film.cfNew .cfRating .crItem > div:first-child > div{padding: 28%;}
.card_film.cfNew .cfRating .crItem > div:nth-child(2){text-align: center; font-size: 11px;}

.card_list_film > div{display: table; width: 100%; table-layout: fixed;}
.card_list_film > div:not(:last-child){margin-bottom: 20px;}
.card_list_film > div > div{display: table-cell; vertical-align: middle;}
.card_list_film > div > div:first-child{width: 55px;}
.card_list_film > div > div:first-child > a > div{padding-bottom: 150%; background-color: var(--bg_silvercalm); border-radius: 3px;}
.card_list_film > div > div:last-child{padding-left: 15px;}
.card_list_film > div > div:last-child > div:first-child{font-size: 17px; font-family: 'bold'; color: var(--text_black); text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.card_list_film > div > div:last-child > div:nth-child(2){color: var(--text_silver);}
.card_list_film > div > div:last-child > div:nth-child(2) > span:not(:last-child){margin-right: 5px;}
.card_list_film > div > div:last-child > div:nth-child(3){margin-top: 5px;}

.card_film_box{display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; grid-gap: 20px; min-height: 50px;}
.card_film_box > div{width: 100%;}
.card_film_box > div > a > div:first-child{width: 100%;}
.card_film_box > div > a > div:first-child div{padding-bottom: 150%; border-radius: 5px;}
.card_film_box > div > a > div:nth-child(2){margin-top: 10px;}
.card_film_box > div > a > div:nth-child(2) > div{font-size: 17px; color: var(--text_white); font-family: 'bold';}

.card_film_episode{}
.card_film_episode > a > div{padding: 15px 0px;}
.card_film_episode .cfeBox{display: table; table-layout: fixed; width: 100%;}
.card_film_episode .cfeBox > div{display: table-cell; vertical-align: middle;}
.card_film_episode .cfeBox > div:first-child{width: 150px;}
.card_film_episode .cfeBox > div:first-child > div{padding-bottom: 56%; background-color: var(--bg_silver); border-radius: 5px;}
.card_film_episode .cfeBox > div:nth-child(2){padding-left: 15px; padding-top: 5px;}
.card_film_episode .cfeBox > div:nth-child(2) > div:first-child{font-size: 17px; font-weight: bold; color: var(--text_black);}
.card_film_episode .cfeBox > div:nth-child(2) > div:nth-child(2){margin-top: 5px; color: var(--text_silver);}

.card_list_nobar{display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap: 20px;}
.card_list_nobar > div{width: 100%;}
.card_list_nobar > div > div:first-child{position: relative;}
.card_list_nobar > div > div:first-child > a > div{padding-bottom: 150%; background-color: var(--bg_black); border-radius: 5px;}
.card_list_nobar > div > div:first-child > span{position: absolute; top: 15px; left: 15px; padding: 3px 7px; background: var(--bg_silver); font-size: 11px; border-radius: 3px;}
.card_list_nobar > div > div:nth-child(2){margin-top: 10px;}
.card_list_nobar > div > div:nth-child(2) > div:first-child{font-size: 17px; font-family: 'bold';}
.card_list_nobar > div > div:nth-child(2) > div:nth-child(2){margin-top: 3px; color: var(--text_silver);}
.card_list_nobar > div > div:nth-child(3){margin-top: 10px; white-space: nowrap;}
.card_list_nobar > div > div:nth-child(3) > div{display: inline-block;}
.card_list_nobar > div > div:nth-child(3) > div:not(:last-child){margin-right: 10px;}
.card_list_nobar .clnBtn{display: grid; grid-template-columns: 15px 1fr; grid-gap: 5px; cursor: pointer; align-items: center; transition: var(--transition);}
.card_list_nobar .clnBtn:hover{color: var(--text_red);}
.card_list_nobar .clnBtn > div{width: 100%;}
.card_list_nobar .clnBtn > div:first-child > div{width: 15px; height: 15px;}

.card_avatar > div:not(:last-child){margin-bottom: 15px;}
.card_avatar .caTitle{padding: 10px 0px; text-align: center; font-weight: bold;}
.card_avatar .caList{display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; grid-gap: 10px;}
.card_avatar .caList > div{width: 100%;}
.card_avatar .caList .caItem{padding-bottom: 100%; border-radius: 50%; cursor: pointer; background-color: var(--bg_silvercalm); background-size: 101%; transition: var(--transition); position: relative; overflow: hidden;}
.card_avatar .caList .caItem:before{content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 1; background: transparent;}
.card_avatar .caList .caItem:not(.active):hover{box-shadow: 0px 0px 0px 2px var(--bg_silver);}
.card_avatar .caList .caItem.active{box-shadow: 0px 0px 0px 5px var(--bg_red);}
.card_avatar .caList .caItem img{width: 100%; position: absolute; top: 0px; left: 0px;}

.card_livechat{}
.card_livechat > div:not(:last-child){margin-bottom: 15px;}
.card_livechat > div > div:first-child{font-family: 'bold'; margin-left: 15px; font-size: 11px; color: var(--text_silver);}
.card_livechat > div > div:nth-child(2){margin-top: 5px; padding: 10px 15px; border-radius: 10px; background: #00000021;}
.card_livechat > div > div:nth-child(2) > img{width: 70px;}

.card_service > div{padding: 15px 20px; background: var(--bg_black); border-radius: 10px;}
.card_service > div:not(:last-child){margin-bottom: 15px;}
.card_service .csTitle{margin-bottom: 3px;}
.card_service .csTitle span{padding: 2px 5px; border-radius: 3px; font-size: 9px; position: relative; bottom: 2px; margin-right: 5px;}
.card_service .csTitle span.premium{background: var(--bg_red); color: var(--text_white);}
.card_service .csInfo{font-size: 11px;}
.card_service .csIcon img{height: 20px;}
.card_service .csWarning{padding: 35px 0px; text-align: center;}
.card_service .csBtnFloating{position: relative; height: 0px; top: 35px;}

.card_freepass > div{padding: 15px 20px 16px 20px; display: grid; grid-template-columns: 1fr 100px; background: var(--bg_darkgrey1); grid-gap: 15px; box-sizing: border-box; align-items: center; border-radius: 10px; transition: var(--transition);}
.card_freepass > div:nth-child(odd){background: var(--bg_darkgrey2);}
.card_freepass > div:not(:last-child){margin-bottom: 15px;}
.card_freepass > div:hover{box-shadow: 0px 0px 0px 1px var(--bg_line);}
.card_freepass > div > div{width: 100%;}
.card_freepass > div > div:first-child > div:first-child{font-size: 11px; color: var(--text_silver);}
.card_freepass > div > div:first-child > div:nth-child(2){font-size: 20px;}
.card_freepass > div > div:nth-child(2){text-align: right;}
.card_freepass > div > div:nth-child(2) > div:first-child{font-size: 11px; color: var(--text_silver);}

.card_freepass_mini{}
.card_freepass_mini > div{padding: 10px 15px; cursor: pointer; display: grid; grid-template-columns: 15px 1fr; grid-gap: 15px; border: 1px solid var(--bg_line); border-radius: 5px; transition: var(--transition); align-items: center;}
.card_freepass_mini > div:hover{border: 1px solid var(--bg_red);}
.card_freepass_mini > div:not(:last-child){margin-bottom: 10px;}
.card_freepass_mini > div > div{width: 100%;}
.card_freepass_mini > div > div:first-child > div{width: 15px; height: 15px; box-shadow: inset 0px 0px 0px 2px var(--bg_silver); border-radius: 50%;}
.card_freepass_mini > div.active > div:first-child > div{box-shadow: none; background: var(--bg_red);}
.card_freepass_mini .cfmContent > div:first-child{display: grid; grid-template-columns: 1fr 60px;}
.card_freepass_mini .cfmContent > div:first-child > div{width: 100%;}
.card_freepass_mini .cfmContent > div:first-child > div:first-child{font-family: 'bold';}
.card_freepass_mini .cfmContent > div:first-child > div:nth-child(2){text-align: right;}
.card_freepass_mini .cfmContent > div:nth-child(2) span{font-size: 11px; color: var(--text_silver);}

.card_redeemlist{display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 15px;}
.card_redeemlist > div{width: 100%; border: 1px solid var(--bg_silver); background: var(--bg_white); padding: 20px 15px; border-radius: 10px; box-sizing: border-box;}
.card_redeemlist > div.emptyStock{opacity: 0.3;}
.card_redeemlist .ccBody{display: grid; grid-template-columns: 1fr 110px; grid-gap: 10px; align-items: center;}
.card_redeemlist .ccBody > div{width: 100%;}
.card_redeemlist .ccBody .cbTitle{font-size: 17px; color: var(--text_red); font-weight: bold;}
.card_redeemlist .ccBody .cbInfo{margin-top: 5px;}
.card_redeemlist .ccBody .cbBtn{display: grid; grid-template-columns: 15px 1fr; padding: 5px 15px; color: var(--text_white); border-radius: 20px; background: var(--bg_red); grid-gap: 10px; align-items: center;}
.card_redeemlist .ccBody .cbBtn > div{width: 100%;}
.card_redeemlist .ccBody .cbBtn > div:first-child > div{width: 15px; height: 15px; background-size: 100%;}

.card_arcade{display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap: 20px; margin-top: 20px;}
.card_arcade > a{width: 100%;}
.card_arcade > a > div > div:first-child{padding-bottom: 42%; background-color: var(--bg_silver); border-radius: 10px;}
.card_arcade > a > div > div:nth-child(2){margin-top: 10px; color: var(--text_black);}

.card_class{display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 15px;}
.card_class > a{width: 100%; transition: var(--transition); border-radius: 10px; background: var(--bg_white); overflow: hidden; border: 1px solid var(--bg_line);}
.card_class > a:hover{border: 1px solid var(--bg_red);}
.card_class .ccItem .ciCover > div{padding-bottom: 100%; background-color: var(--bg_silvercalm);}
.card_class .ccItem .ciInfo{padding: 15px;}
.card_class .ccItem .ciInfo .ciTitle{font-weight: bold;}
.card_class .ccItem .ciInfo .ciDate{display: grid; margin-top: 10px; grid-template-columns: 15px 1fr; grid-gap: 15px; align-items: center;}
.card_class .ccItem .ciInfo .ciDate > div{width: 100%;}
.card_class .ccItem .ciInfo .ciDate > div:first-child > div{width: 15px; height: 15px;}
.card_class .ccItem .ciInfo .ciMeeting{display: grid; margin-top: 5px; grid-template-columns: 15px 1fr; grid-gap: 15px; align-items: center;}
.card_class .ccItem .ciInfo .ciMeeting > div{width: 100%;}
.card_class .ccItem .ciInfo .ciMeeting > div:first-child > div{width: 15px; height: 15px;}
.card_class .ccItem .ciInfo .ciUser{display: grid; margin-top: 10px; grid-template-columns: 30px 1fr; grid-gap: 15px; align-items: center;}
.card_class .ccItem .ciInfo .ciUser > div{width: 100%;}
.card_class .ccItem .ciInfo .ciUser > div:first-child > div{width: 30px; height: 30px; background-color: var(--bg_silvercalm); border-radius: 50%;}
.card_class .ccItem .ciInfo .ciBtn{margin-top: 10px; display: grid; grid-template-columns: 1fr 100px; grid-gap: 10px; align-items: center; padding: 10px 15px; border-radius: 10px; background: var(--bg_red); box-sizing: border-box; color: var(--text_white);}
.card_class .ccItem .ciInfo .ciBtn > div{width: 100%;}
.card_class .ccItem .ciInfo .ciBtn button{width: 100%;}

.card_class_meeting{margin-top: 15px;}
.card_class_meeting > a:not(:last-child) > div{margin-bottom: 15px;}
.card_class_meeting .ccmItem{padding: 15px; border-radius: 10px; background: var(--bg_white); border: 1px solid var(--bg_line); display: grid; grid-template-columns: 100px 1fr; grid-gap: 15px; box-sizing: border-box; align-items: center;}
.card_class_meeting .ccmItem > div{width: 100%;}
.card_class_meeting .ccmItem > div:first-child{font-size: 20px; font-weight: bold; text-align: center;}
.card_class_meeting .ccmItem .ciInfo{position: relative;}
.card_class_meeting .ccmItem .ciInfo > div:first-child{font-weight: bold; margin-bottom: 5px;}
.card_class_meeting .ccmItem .ciInfo .ciLive{position: absolute; top: -12px; right: 0px; background: var(--bg_red); border-radius: 0px 0px 15px 15px; padding: 3px 10px 5px 10px; font-weight: bold; color: var(--text_white);}
.card_class_meeting .ccmItem.ccmpast{background: var(--bg_silvercalm);}
.card_class_meeting .ccmItem.ccmongoing{box-shadow: inset 0px 0px 0px 3px var(--bg_red);}
.card_class_meeting .ccmItem.ccmongoing > div:first-child{color: var(--text_red);}
.card_class_meeting .ccmItem.ccmongoing .ciInfo > div:first-child{color: var(--text_red);}