/*
>>>Table of content
1.0 Common
	1.1 Group style
	1.2 Form elements
	1.3 Header & nav
	1.4 Footer
	1.5 Tabs
	1.6 Poster
	1.7 Ads
	1.8 Search
	1.9 Pop up
    1.10 Note
    1.11 Custom alert
2.0 Home
	2.1 Banner
3.0 Movie details
4.0 Seat plan
	4.1 Seat style
5.0 payment
6.0 Tutorial
7.0 Contact
8.0 FAQ
9.0 Lounge
10.0 About
99.0 Others 
*/

/* ===== 1.0 Common ================================================== */
*{
	color: #666;
	font-family: 'Lato', SimHei, Hiragino Sans GB, sans-serif;
	font-size: 14px;
	margin: 0;
	padding: 0;
}
body{
	background-color: #EBEFF2;
	padding-top: 44px;
	counter-reset: seat-journey;
}
body#home{
	padding-top: 0;
}
h2{
	color: #333;
	font-size: 20px;
	line-height: 44px;
	margin-bottom: 10px;
}
.h2-action{
	background-repeat: no-repeat;
	float: right;
	line-height: inherit;
}
.h2-action.more{
	background-image: url(../images/arrow-right.png);
	background-position: right center;
	background-size: auto 12px;
	padding-right: 12px;
}
.overlay{ 
	background: rgba(0,0,0,.5);
	height: 100%;
	display:none;
	left: 0;
	opacity: 0;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 999;
}
.tic-minus:after{
	content: "-";
}
.tic-plus:after{
	content: "+";
}
.centerContent{
	max-width: 980px;
}
img{
	vertical-align: top;
	width: 100%;
}
a{
	color: #03E3E3;
}
p{
	margin-bottom: 10px;
}
#home header{
	background-color: transparent;
	background-color: rgba(0,0,0,.75);
}
#home header.solid{
	background: #333;
}
.icon{
	display: inline-block;
	height: 44px;
	vertical-align: top;
	width: 44px;
}
.reminder .centerContent{
	padding: 20px 15px;
}
.reminder .reminder_h{
	color: #333;
	margin: 0;
}
.reminder p{
	color: #666;
	font-size: 12px;
	margin-bottom: 10px;
}
.reminder a{
	font-size: inherit;
}
.error-msg{
	color: #CD5C5C;
	margin-bottom: 10px;
	padding: 4px 2px;
}
.trailer-wrap{
	background: #000;
	cursor: pointer;
    height: 100%;
	left: 50%;
	max-height: 75vh;
	max-width: 1280px;
    overflow: hidden;
    position: fixed;
	top: 50%;
    width: 100%;
	z-index: 9999;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
.trailer-wrap iframe{
	height: 100%;
	left: 0;
	position: absolute;
    top: 0;
    width: 100%;
}


.poster-only-wrap{
	font-size: 0;
	display: flex;
}
.poster-only-wrap .poster{
	margin-right: 10px;
	width: calc(50% - 5px);
}
.poster-only-wrap .poster:nth-child(even){
	margin-right: 0;
}
.currency:before{
	color: inherit;
	content: "$";
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}
#article-wrap.centerContent{
	padding: 20px 15px;
}
.last-update{
	background-color: #d9f1f1;
	border-radius: 5px;
	border: 2px solid #e5e5e5;
	display: inline-block;
	padding: 10px;
}
.article{
	margin-bottom: 40px;
}
.article p{
	color: #999;
	font-size: 16px;
	line-height: 20px;
	margin-bottom: 20px;
}
.article .article-title{
	color: #000;
	font-size: 28px;
	line-height: normal;
	margin-bottom: 20px;
}
.article ol,
.article ul{
	font-size: 16px;
	line-height: 20px;
	margin: 30px 0 30px 18px;
}
.article li{
	font-size: inherit;
	line-height: inherit;
	margin-bottom: 10px;
}
.para-title{
	color: #000;
	font-size: inherit;
	font-weight: bold;
}

#tnc-wrap p{
	color: #999;
	font-size: 16px;
	line-height: 20px;
	margin-bottom: 20px;
}
#tnc-wrap ol,
#tnc-wrap ul{
	font-size: 16px;
	line-height: 20px;
	margin: 30px 0 30px 18px;
}
#tnc-wrap li{
	font-size: inherit;
	line-height: inherit;
	margin-bottom: 10px;
}

#disclaimer-wrap ol,
#disclaimer-wrap ul{
	font-size: 16px;
	line-height: 20px;
	margin: 30px 0 30px 18px;
}
#disclaimer-wrap li{
	font-size: inherit;
	line-height: inherit;
	margin-bottom: 10px;
}

/* ===== 1.1 Group style ========== */
.hamburger,
.ic-search{
	height: 44px;
	width: 44px;
}
textarea,
.centerContent,
.logo-wrap,
.hamburger,
.ic-search,
nav,
#lang,
.strokeBtn,
.solidBtn,
.owl-dots,
.poster.more p,
.social-title,
#seach-bar,
.session,
.session .time,
.movie-info,
.price-chart,
select,
#seat-plan span,
.option-wrap .option,
.e-ticket input,
.tic-type .txt,
input,
.expandable,
.purchase-info,
.purchase-info > div,
.tuto-wrap .txt,
.cont-info,
.feedback,
.equip-wrap label p,
.col,
.col-full{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.poster .btnWrap,
.back2top,
.selected-movie .timer,
.tic-type .txt{
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	transform: translateY(-50%);
}
.cover-img img{
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	transform: translateX(-50%);
}
h2,
body .strokeBtn,
body .solidBtn,
.session .time,
.payment-box .title{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}


/* ===== 1.2 Form elements ========== */
button,
input[type="button"],
input[type="submit"]{
	background: transparent;
	border: none;
	border-radius: 0;
	cursor: pointer;
	-webkit-appearance: none
}
input[type="text"],
input[type="email"],
input[type="number"],
input[type="search"],
textarea{
	border: 1px solid #ddd;
	border-radius: 5px;
	height: 44px;
	padding: 0 10px;
	width: 100%;
	-webkit-appearance: none
}
textarea{
	padding-bottom: 10px;
	padding-top: 10px;
	min-height: 160px;
}
select{
	border: none;
	border-radius: 0;
	background: #D0DAE1 url(../images/ic-select.png) right top no-repeat;
	color: #333;
	display: block;
	height: 44px;
	line-height: 44px;
	min-width: 200px;
	padding: 0 40px 0 10px;
	width: 100%;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
select:disabled{
    background-color: rgba(0,0,0,.05);
    background-image: none;
    color: rgba(0,0,0,.3);
}
.submit.disabled{
	pointer-events: none;
    background-color: rgba(0,0,0,.05);
    background-image: none;
    color: rgba(0,0,0,.3);
}
select.loading{
    background-image: url(../images/loading.gif);
    background-size: 30px;
    background-position: right 7px top 7px;
}
.ie select::-ms-expand{
    display: none;
}
.error input[type="text"],
.error input[type="email"],
.error input[type="search"],
.error textarea{
	border-color: IndianRed;
	color: IndianRed;
}
.error select{
	background-position: right -88px;
	border: 1px solid IndianRed;
	color: IndianRed;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder{
  color: #ccc;
}
input::-moz-placeholder,
textarea::-moz-placeholder{
  color: #ccc;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder{
  color: #ccc;
}
input:-moz-placeholder,
textarea:-moz-placeholder{
  color: #ccc;
}

/* error placeholder */
.error input::-webkit-input-placeholder,
.error textarea::-webkit-input-placeholder{
  color: #e6adad;
}
.error input::-moz-placeholder,
.error textarea::-moz-placeholder{
  color: #e6adad;
}
.error input:-ms-input-placeholder,
.error textarea:-ms-input-placeholder{
  color: #e6adad;
}
.error input:-moz-placeholder,
.error textarea:-moz-placeholder{
  color: #e6adad;
}
.btnWrap{
	font-size: 0;
	margin-top: 30px;
}
body .strokeBtn,
body .solidBtn{
	font-size: 16px;
	height: 44px;
	padding: 0 30px;
	vertical-align: top;
}
body .strokeBtn{
	border-color: #fff;
	border-style: solid;
	border-width: 2px;
	color: #fff;
	line-height: 40px;
}
body .strokeBtn:hover{
	background-color: rgba(255,255,255,.3);
}
.strokeBtn.green{
	border-color: #02A2A2;
	color: #02A2A2;
}
.strokeBtn.green:hover{
	background-color: rgba(2,162,162,.3);
}
body .solidBtn{
	background: #03E3E3;
	color: #000;
	line-height: 44px;
}
body .solidBtn:disabled,
body .solidBtn:hover:disabled,
.solidBtn.cancel:disabled,
.solidBtn.cancel:hover:disabled,
.solidBtn.back:disabled,
.solidBtn.back:hover:disabled{
	background-color: #ccc;
	color: #aaa;
}
.solidBtn.cancel,
.solidBtn.back,
#btn-back{
	background-color: #666;
}
body .solidBtn:hover{
	color: #fff;	
}
.input-wrap{
	margin-bottom: 10px;
}
.btn-wrap{
	margin-top: 40px;
}
.form-section{
	border-bottom: 1px solid #ddd;
	margin-bottom: 20px;
	padding: 0 0 20px 0;
}
.form-section .title{
	border-left: 2px solid #02A2A2;
	color: #000;
	padding-left: 10px;
	vertical-align: top;
}
.form-section .title a{
	float: right;
}


/* ===== 1.3 Header & nav ========== */
header{
	background: #333;
	font-size: 0;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 10;
	-webkit-box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.3);
}
header .mob{
	display: block;
	padding-top: 8px;
}
.hamburger{
	background-color: transparent;
	float: left;
	left: 0;
	position: fixed;
	top: 0;
	z-index: 11;
}
.hamburger.opened{
    z-index: 102;
}
.hamburger:hover .bar{
	background-color: #05d2d2;
}
.hamburger .bar{
	background: #fff;
	cursor: pointer;
	height: 2px;
	left: 50%;
	margin-left: -11px;
	position: absolute;
	width: 22px;
	-webkit-transition: transform .5s ease-in-out, margin .5s ease-in-out;
	-moz-transition: transform .5s ease-in-out, margin .5s ease-in-out;
	transition: transform .5s ease-in-out, margin .5s ease-in-out;
}
.bar.top{
	top: calc(50% - 7px);
}
.bar.mid{
	top: calc(50% - 1px);
	-webkit-transition: width .5s ease-in-out;
	-moz-transition: width .5s ease-in-out;
	transition: width .5s ease-in-out;
	
}
.bar.bot{
	top: calc(50% + 5px);
}
.opened .bot{
	margin-top: -6px;
	-moz-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.opened .top{
	margin-top: 6px;
	-moz-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.opened .mid{
	width: 0;
}
.logo-wrap{
	height: 44px;
	margin-left: 44px;
}
.logo-wrap:after{
	content: "";
	display: inline-block;
	height: inherit;
	vertical-align: middle;
}
.logo-wrap a{
	display: inline-block;
	vertical-align: middle;
}
.logo-wrap input{
	background-color: transparent;
	line-height: 44px;
}
.ic-search{
	background: url(../images/search.png) left top no-repeat;
	float: right;
	position: relative;
	z-index: 11;
}

.ic-tic,
#home nav .ic-tic{
	display: none;
}
#home nav.sidebaron .ic-tic{
	background: url(../images/ic-tic-indi-white.png) center -10px no-repeat;
	display: inline-block;
	float: right;
	position: relative;
}
#home .mob.sidebaron .ic-tic{
	background: url(../images/ic-tic-indi-white.png) center -10px no-repeat;
	display: inline-block;
	float: right;
	position: relative;
}
#home .ic-tic:hover{
	background-image: url(../images/ic-tic-indi-red.png);
}

nav{
	background: #333;
	height: 100%;
	left: -75%;
	overflow-y: auto;
	padding-top: 44px;
	position: fixed;
	top: 0;
	width: 75%;
	z-index: 101;
}

nav .ic-tic{
	display: none;
}

#lang{
	background: transparent;
	border: none;
	color: #03E3E3;
	font-size: 120%;
	height: 44px;
	padding: 0 15px;
	position: relative;
	text-align: left;
	width: 100%;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
#lang:after{
	border-bottom: 1px solid #444;
	bottom: 0;
	content: "";
	display: block;
	left: 15px;
	position: absolute;
	right: 15px;
	
}
#lang:focus{
	outline: none;
}
.navBtn{
	color: #fff;
	display: block;
	font-size: 120%;
	line-height: 44px;
	padding: 0 15px;
	text-decoration: none;
}
.navBtn:hover{
	background: rgba(255,255,255,.1);
}
.navBtn.active{
	color: #03E3E3;
}


/* ===== 1.4 Footer ========== */
footer{
	background: #000;
	padding-top: 10px;
}
.btn-group a{
	display: block;
	color: #fff;
	line-height: 44px;
	padding: 0 15px;
	text-decoration: none;
}
.btn-group a:hover{
	background-color: rgba(255,255,255,.2);
}
.btn-group.social a{
	background-position: 15px center;
	background-repeat: no-repeat;
	padding-left: 44px;	
}
.btn-group .fb{
	background-image: url(../images/social-fb.png);
}
.btn-group .twi{
	background-image: url(../images/social-twi.png);
}
.btn-group .ins{
	background-image: url(../images/social-ins.png);
}
.btn-group .links-wrap{
	display: none;
}
.btn-group .trigger,
.social-title{
	color: #03E3E3;
	font-size: 20px;
	line-height: 44px;
	padding: 0 15px;
	text-align: left;
	width: 100%;
}
.btn-group .trigger:hover{
	background-color: rgba(3,227,227,.2);
}
.trigger:after{
	content: "+";
	color: #fff;
	display: block;
	float: right;
	font-size: 30px;
}
.opened .trigger:after{
	content: "-";
}
.copyright-wrap{
	margin-top: 20px;
	position: relative;
}
.copyright-wrap:before{
	background-color: #444;
	content: "";
	display: block;
	height: 1px;
	left: 15px;
	position: absolute;
	right: 15px;
	top: 0;
}
.copyright-txt{
	color: #fff;
	font-size: 86%;
	padding: 10px 60px 10px 15px;
}
.back2top{
	background: url(../images/arrow-top.png) right center no-repeat;
	background-size: 14px auto;
	padding-right: 20px;
	position: absolute;
	right: 15px;
	top: 50%;
}


/* ===== 1.5 Tabs ========== */
.etabs{
	border-bottom: 1px solid #ddd;
	font-size: 0;
    height: 45px;
    list-style: none;
	margin: 0 15px;
    overflow-x: auto;
    position: relative;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
}
.arrow-tab .etabs{
	height: 44px;
	overflow-x: hidden;
	margin-left: 70px;
	margin-right: 70px;
}
.arrow-tab .arrow{
	background: #02A2A2 center no-repeat;
	background-size: auto 24px;
	cursor: pointer;
	height: 44px;
	padding: 10px;
	position: absolute;
	top: 0;
	width: 44px;
	z-index: 1;
}
.arrow-tab .arrow:disabled{
	background-color: #ddd;
}
.arrow-tab .left{
	background-image: url(../images/arrow-w-left.png);
	left: 15px;
}
.arrow-tab .right{
	background-image: url(../images/arrow-w-right.png);
	right: 15px;
}
.etabs li{
    display: inline-block;
    font: initial;
    height: 44px;
    padding: 0 15px;
    vertical-align: top;
}
.etabs li:first-child{
	margin-left: 0;
}
.etabs li:last-child{
	margin-right: 0;
}
.etabs li.active{
	color: #02A2A2;
}
.etabs a{
	color: inherit;
    display: block;
	font-size: 125%;
    line-height: 44px;
    text-decoration: none;
}
.etabs ~ div{
	margin-top: 20px;
	padding: 0 15px;
}

.etabs_home{
	border-bottom: 1px solid #ddd;
	font-size: 0;
    height: 45px;
    list-style: none;
	margin: 0 15px;
    overflow-x: auto;
    position: relative;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
}
.etabs_home li{
    display: inline-block;
    font: initial;
    height: 44px;
    padding: 0 15px;
    vertical-align: top;
}
.etabs_home li:first-child{
	margin-left: 0;
}
.etabs_home li:last-child{
	margin-right: 0;
}
.etabs_home li.active{
	color: #02A2A2;
}
.etabs_home a{
	color: inherit;
    display: block;
	font-size: 125%;
    line-height: 44px;
    text-decoration: none;
}
.etabs_home ~ div{
	margin-top: 20px;
	padding: 0 15px;
}


/* ===== 1.6 Poster ========== */
.poster{
	background: #000;
	cursor: pointer;
	display: inline-block;
	margin-bottom: 10px;
	position: relative;
	vertical-align: top;
	width: 140px;
}
.poster .over-wrap{
	background: rgba(0,0,0,.75);
	display: none;
	height: 0;
	left: 0;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	top: 0;
	width: 100%;
	-webkit-transition: opacity 0.5s;
	-moz-transition: opacity 0.5s;
	transition: opacity 0.5s;
}
.poster:hover .over-wrap{
	height: 100%;
	opacity: 1;
}
.poster .mob-link{
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

.poster .btnWrap{
	margin-top: 0;
	text-align: center;
	position: relative;
	top: 50%;
}
.poster .btnWrap input{
	padding: 0 10px;
	width: 80%;
}

.poster .btn-wrap{
	bottom: 0;
	margin-top: 0;
	padding: 0 15px 15px 15px;
	position: absolute;
	text-align: center;
	width: 100%;
}
.poster .btn-wrap input{
	min-width: 0;
	padding: 0 10px;
	width: 100%;
}

.poster .strokeBtn{
	margin-bottom: 10px;	
}
.poster.more p, .evt-thumb.more p{
	color: #03E3E3;
	font-size: 22px;
	padding: 15px;
	position: absolute;
	top: 0;
	width: 100%;
}
.poster.more p img, .evt-thumb.more p img{
	display: inline;
	height: auto;
	margin: 3px 0 0 6px;
	width: auto;
	-webkit-transition: margin 0.5s;
	-moz-transition: margin 0.5s;
	transition: margin 0.5s;
}
.poster.more:hover p img, .evt-thumb.more:hover p img{
	margin-left: 12px;
}

.poster .info{
	color: #fff;
	padding: 15px;
}
.poster .info div{
	color: inherit;
	padding-bottom: 5px;
}
.poster .info .title{
	font-size: 18px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.poster .info .launchDate{
	border-bottom: 1px solid #fff;
	font-size: 12px;
	margin-bottom: 10px;
	padding-bottom: 10px;
}

.evt-thumb.more{
    background: #000;
}

/* ===== 1.8 Search ========== */
.search-wrap{
	left: 0;
	display: none;
	position: fixed;
	top: -44px;
	width: 100%;
	z-index: 101;
}
.search-bar-wrap{
	background: #000;
	height: 44px;
	position: relative;
	z-index: 2;
}
.search-bar-wrap .icon{
	background: url(../images/search.png) left top no-repeat;
	left: 0;
	position: absolute;
	top: 0;
}
#seach-bar{
	background: transparent;
	border: none;
	color: #fff;
	font-size: 120%;
	height: 44px;
	line-height: 44px;
	padding-left: 44px;
	width: calc(100% - 74px);
}
#seach-cancel{
	color: #FA8072;
	float: right;
	height: 44px;
	line-height: 44px;
	padding: 0 15px;
	text-align: right;
	width: 74px;
}
.search-predict{
	background: #eee;
	display: none;
	max-height: 60%;
	overflow-y: auto;
	padding: 15px;
	position: relative;
	z-index: 1
}
.hot{
	font-size: 0;
	overflow-x: auto;
	margin: 0 -15px;
	padding: 0 15px;
	white-space: nowrap;
	-webkit-overflow-scrolling: touch;
}
.hot a{
	display: inline-block;
	margin-right: 10px;
	text-decoration: none;
	vertical-align: top;
	width: 100px;
}
.hot img{
	margin-bottom: 5px;
	-webkit-box-shadow: 0px -2px 6px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px -2px 6px 0px rgba(0,0,0,0.3);
	box-shadow: 0px -2px 6px 0px rgba(0,0,0,0.3);
}
.hot p{
	color: #333;
	white-space: normal;
}
.search-predict .label{
	margin-bottom: 5px;
}


/* ===== 1.9 Pop up ========== */
#popup{
	background-color: #EBEFF2;
	border-radius: 5px;
	left: 50%;
	max-width: 422px;
	overflow-y: auto;
	padding-bottom: 40px;
	position: fixed;
	top: 50%;
	transform-style: preserve-3d;
	width: 90%;
	z-index: 101;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	-webkit-box-shadow: 0 4px 10px 0 rgba(0,0,0,0.5);
	-moz-box-shadow: 0 4px 10px 0 rgba(0,0,0,0.5);
	box-shadow: 0 4px 10px 0 rgba(0,0,0,0.5);
}
#popup.imgOnly{
	max-width: 720px;
	padding-bottom: 0;
	overflow: hidden;
}
.closeBtn{
	background: rgba(0,0,0,.5) url(../images/pop-close.png) center no-repeat;
	height: 44px;
	position: absolute;
	right: 0;
	top: 0;
	width: 44px;
	z-index: 101;
}
#popup .popSlide{
	max-width: 422px;
	vertical-align: top;
	width: 100%;
}
#popup.imgOnly .popSlide{
	max-width: 720px;
}
#popup .img-wrap{
	border-radius: 5px 5px 0 0;
	overflow: hidden;
}
#popup .img-wrap img{
	vertical-align: top;
	width: 100%;
}
#popup .title{
	color: #333;
	font-size: 24px;
	margin: 20px 0 10px 0;
	padding: 0 20px;
	text-align: center;
	white-space: normal;
}
#popup .msg{
	color: #999;
	font-size: 16px;
	margin-bottom: 10px;
	padding: 0 20px;
	text-align: center;
	white-space: normal;
}
#popup .owl-dots{
	bottom: -26px;
}
#popup.imgOnly .owl-dots{
	bottom: 10px;
}
#popup .owl-dots button{
	border-color: #999;
}


/* ===== 1.10 Note ========== */
.note-wrap{
    background: #fff;
    bottom: 0;
    display: none;
    left: 0;
    max-height: 75vh;
    position: fixed;
    width: 100vw;
    z-index: 1000;
}
.note-wrap .centerContent{
    max-height: calc(75vh - 85px);
    overflow-y: auto;
    padding: 20px 15px 85px 15px;
}
.note-wrap h6{
    margin-bottom: 10px;
}
.note-item{
    font-size: 0;
    margin-bottom: 10px;
}
.note-item:nth-last-child(){
    margin-bottom: 0;
}
.note-item .thumb{
    display: inline-block;
    margin-right: 10px;
    vertical-align: top;
    width: 60px;
}
.note-item .txt{
    display: inline-block;
    padding-top: 10px;
    vertical-align: top;
    width: calc(100% - 70px);
}
.note-item .title{
    color: #000;
    margin-bottom: 0;
}
.note-btnWrap{
    background: #fff;
    bottom: 0;
    box-sizing: border-box;
    margin: 0;
    max-width: 980px;
    padding: 20px 15px;
    position: absolute;
    text-align: left;
    width: 100%;
}
.note-wrap .note-btnWrap:before{
    border-top: 1px solid rgba(0,0,0,.1);
    content: "";
    display: block;
    position: absolute;
    top: 0;
    width: 100%;
}
.note-wrap button{
    margin: 0 !important;
}


/* ===== 1.11 Custom alert ========== */

#cust_alert{
	background: #fff;
	display: none;
	left: 50%;
    max-height: 75%;
	max-width: 360px;
    overflow-y: auto; 
	padding: 20px 15px 30px;
	position: fixed;
	text-align: center;
	top: 50%;
	width: 90%;
	z-index: 1000;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	-webkit-box-shadow: 0 5px 10px 0 rgba(0,0,0,0.3);
	-moz-box-shadow: 0 5px 10px 0 rgba(0,0,0,0.3);
	box-shadow: 0 5px 10px 0 rgba(0,0,0,0.3);
}
#cust_alert .close{
    background: rgba(0,0,0,.5) url(../images/pop-close.png) center no-repeat;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1000;
}
#cust_alert .close:hover{
    background-color: rgba(0,0,0,.1);
}
#cust_alert .img-wrap{
	display: inline-block;
	margin-bottom: 20px;
	width: 120px;
}
#cust_alert .img-wrap.qr{
    margin-bottom: 0;
    width: 100%;
}
#cust_alert .img-wrap:empty,
h6:empty{
    margin: 0;
}
h6{
	color: #333;
	font-size: 26px;
	line-height: normal;
	margin-bottom: 10px;
}
#cust_alert .txt p{
	font-size: 18px;
	line-height: normal;
	padding-left: 20px;
	padding-right: 20px;
}
#cust_alert .txt span{
	font-size: 18px;
	line-height: normal;
}
#cust_alert .input-wrap .error-msg{
    font-size: 14px;
    padding: 4px 2px;
    text-align: left;
}
#cust_alert .btn-wrap{
	text-align: center !important;
}
#cust_alert .agree_tnc{
	display: inline-block;
	padding: 0 15px;
}
#cust_alert .agree_tnc p{
	text-align: left;
}
#cust_alert .solidBtn,
#cust_alert .strokeBtn{
	margin: 0 5px 10px 5px;
	min-width: 0;
}
.icon,.hamburger,.ic-search,#home .ic-tic,#cust_alert .close,.arrow-tab .arrow,.closeBtn,.tic-type .btn *{
	height: 44px;
	width: 44px;
}
header,textarea,.centerContent,.logo-wrap,.logo-wrap a,.hamburger,.ic-search,nav,#lang,.strokeBtn,.solidBtn,.owl-dots,.poster .btn-wrap,.poster.more p,.social-title,#seach-bar,.session,.session .time,.movie-info,.price-chart,select,#seat-plan span,.option-wrap .option,.e-ticket input,.tic-type .txt,input,.expandable,.trailer-wrap,.purchase-info,.purchase-info > div,.tuto-wrap .txt,.cont-info,.feedback,.equip-wrap label p,.col,.col-full,#hall-quick a,#sideBar .time-wrap,.cinema-info,#movie-details h4,.tic-type,.card-info div,.time-item .info,.time-item,.options-wrap,#overview ul .info,.appellative select,#cust_alert,.evt-thumb.more p,.member-priv-item,.non-loggedIn-purchase > div, .verified-number{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.cust-alert{
    background: #fff;
    border-radius: 5px;
    box-sizing: border-box;
    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.3);
    display: none;
    left: 50%;
    max-width: 500px;
    padding: 30px;
    position: fixed;
    text-align: center;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
}
.cust-alert .ic-close{
    position: absolute;
    right: 0;
    top: 0;
}
.cust-alert .title{
    color: #000;
    font-size: 24px;
    margin-bottom: 5px;
}
.cust-alert p{
    font-size: 16px;
}
.cust-action{
    margin-top: 30px;
    text-align: center;
}

/* crazy ads */
#cust_alert.crazyads{
    background-color: #EBEFF2;
    border-radius: 5px;
    left: 50%;
    max-width: 422px;
    overflow-y: auto;
    padding-bottom: 40px;
    position: fixed;
    top: 50%;
    transform-style: preserve-3d;
    width: 90%;
    z-index: 1000;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-box-shadow: 0 4px 10px 0 rgba(0,0,0,0.5);
    -moz-box-shadow: 0 4px 10px 0 rgba(0,0,0,0.5);
    box-shadow: 0 4px 10px 0 rgba(0,0,0,0.5);
    padding: 0;
    max-height: 100%;
    height: auto;
    overflow-y: hidden;
}
#crazy_ads .popSlide {
    background-color: #EBEFF2;
    max-width: 422px;
    vertical-align: top;
    width: 100% ;
}
#crazy_ads .popSlide a{
    text-decoration: none;
}
#crazy_ads .popSlide .title {
    color: #333;
    font-size: 24px;
    padding: 20px 20px 0;
    text-align: center;
    white-space: normal;
    line-height: 30px;
}
#crazy_ads .popSlide .msg {
    color: #999;
    font-size: 16px;
    padding: 0 20px 20px 20px;
    text-align: center;
    white-space: normal;
    margin:auto;
}
#crazy_ads .owl-dots {
    bottom: 0;
    text-align: left;
    margin: 10px auto;
    left: 0;
    position: relative;
}
#crazy_ads .owl-dots button{
    border-color: #999;
}

.crazyads .bx-viewport {
height: 100% !important;
}
.crazyads .bx-wrapper{
    border:none;
    box-shadow: none;
    margin-bottom: 40px;
}
.crazyads .bx-wrapper .bx-pager {
    text-align: left;
    padding: 0 20px 10px;
    width: 50%;
}
.crazyads .bx-wrapper .bx-pager.bx-default-pager a{
    border: 2px solid #999;
    background: transparent;
    border-radius: 50%;
    width: 7px;
    height: 7px;
}
.crazyads .bx-wrapper .bx-pager.bx-default-pager a:hover, 
.crazyads .bx-wrapper .bx-pager.bx-default-pager a.active {
    background: #DA281C;
}


/* ===== 2.0 Home ================================================== */
#home-tab{
	background-color: #ddd;
	background: linear-gradient(to bottom, #F7F8FA, #ddd 77%);
	min-height: 500px;
	padding: 20px 0;
}
#now,
#soon,#evt-news{
	font-size: 0;
    display: flex;
    flex-wrap: wrap;
}
#home-tab .poster{
	width: calc(50% - 5px);
}
#home-tab .poster:nth-child(even),#evt-news .evt-thumb:nth-child(even){
	margin-left: 10px;
}

.collapsible {
  cursor: pointer;
  padding: 5px;
  border: none;
  text-align: left;
  outline: none;
}

.collapse_content {
  padding: 0 18px;
  display: none;
  overflow: hidden;
}

/* ===== 2.1 banner ========== */
#banner{
	background: #000;
	overflow: hidden;
        padding-top: 64px;
	position: relative;
}
#banner .slide{
	overflow: hidden;
	position: relative;
}
.slide .centerContent{
	padding: 20px 15px 60px 15px;
	width: 100%;
}
.slide h4{
	color: #fff;
	font-size: 32px;
	line-height: 32px;
}
.slide .synopsis{
        color: #fff;
	display: none;
	line-height: 18px;
	margin-top: 20px;
	max-height: 53px;
	overflow: hidden;
	-webkit-transition: height .5s ease-in-out, width .5s ease-in-out;
	-moz-transition: height .5s ease-in-out, width .5s ease-in-out;
	transition: height .5s ease-in-out, width .5s ease-in-out;
}
.slide .synopsis.expanded{
    max-height: none;
    max-width: 80%;
}
.slide .label{
	color: #ccc;
}
.slide .rating,
.slide .duration{
	color: #03E3E3;
	font-weight: 900;
}
.slide img{
	width: 100%;
}
.slide .more{
	display: none;
}
.slide .strokeBtn{
	margin-right: 10px;
}
.owl-nav{
	display: none;
}
.owl-dots{
	bottom: 20px;
	padding: 0 15px;
	position: absolute;
}
.owl-dots button{
	background-color: transparent;
	border: 2px solid #fff;
	border-radius: 20px;
	height: 10px;
	margin-right: 5px;
	width: 10px;
}
.owl-dots button.active{
	background-color: #03E3E3;
}

/* ===== 2.2 sidebar ========== */
#sideBar{
	display: block;
	background-color: #fff;
	bottom: 0;
	height: 100% !important; /* prevent sidebar slideup when change tab */
	max-width: 386px;
	position: fixed;
	top: 0;
	right: -90%;
	width: 85%;
	z-index: 988;
	-webkit-transition: right 0.5s ease-in-out;
	-moz-transition: right 0.5s ease-in-out;
	transition: right 0.5s ease-in-out;
}
#sideBar + .overlay{
	z-index: 109;
}
#sideBar.opened{
	right: 0;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
}
#sideBar .etabs{
	background-color: #dbdbdb;
	border-bottom: none;
	height: 64px;
	margin: 0;
}
#sideBar .etabs li{
	height: 100%;
	padding-left: 0;
	padding-right: 0;
	width: 14.285%;
}
#sideBar li.active{
	background-color: #35A9A6;
}
#sideBar li.active .day,
#sideBar li.active .mth{
    color: #fff;
}
#sideBar .tab a{
	padding: 20px 0 10px;
	text-align: center;
	width: 100%;
}
#sideBar .tab p{
	line-height: 80%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 100%;
    font-size: 15px;
    font-weight: 700;
}
#sideBar .mth{
	color: #999;
	font-size: 12px;
	margin-bottom: 5px;
}
#sideBar .day{
	color: rgba(102,102,102,.3);
	font-size: 16px;
	margin-bottom: 0;
}
.cine-selector .input-wrap{
	border-bottom: 1px solid rgba(0,0,0,.1);
	margin-bottom: 0;
	padding-bottom: 20px;
}
#sideBar .active .day{
	color: rgba(102,102,102,1);
}
#sideBar .time-wrap{
	height: calc(100% - 149px);
	overflow-y: auto;
	margin-top: 0;
	padding-top: 20px;
	position: relative;
	overflow-x: hidden;
}

.movie-wrap .each-movie-wrap{
	border-bottom: 1px solid rgba(0,0,0,.1);
	margin-bottom: 20px;
	padding-bottom: 10px;
}

.movie-wrap h4{
	color: #333;
	font-size: 18px;
	text-overflow: ellipsis;
}
#sideBar .session-type{
	margin-right: -10px;
	margin-top: 20px;
}
#sideBar .session-type p{
	font-size: 14px;
}


/* ===== 3.0 Movie details ================================================== */
#movie-details{
	background: #333;
	padding: 20px 0 40px;
}
#movie-details .centerContent{
	padding: 0 15px;
}
#movie-details .centerContent:after{
	clear: left;
	content: "";
	display: block;
}
.poster-img{
	display: none;
}
#movie-details h4{
	color: #fff;
	font-size: 26px;
}
#movie-details .info{
	margin-top: 10px;
}
#movie-details .share{
	background: url(../images/share.png) right center no-repeat;
	float: right;
	font-size: 18px;
	padding: 6px 24px 6px 10px;
}
.txt .info {
    text-align: left;
}
.txt .item{
	margin-bottom: 3px;
}
.txt .label{
	color: #999;
	/* float: left; */
	width: 90px;
}
.txt .info-txt{
	color: #02A2A2;
	display: inline-block;
	/* margin-left: 70px; */
}
.cast p{
	color: #02A2A2;
}
.txt .synopsis{
	margin-top: 20px;
}
.synopsis .title{
	color: #fff;
	font-size: 18px;
}
.synopsis .syn-txt{
	color: #999;
	margin-bottom: 20px;
	max-height: 40px;
	line-height: 20px;
	overflow: hidden;
	-webkit-transition: max-height .5s ease-in-out;
	-moz-transition: max-height .5s ease-in-out;
	transition: max-height .5s ease-in-out;
}
.synopsis .syn-txt.expanded{
	max-height: 500px;
}
.synopsis .read-more{
	color: #02A2A2;
	margin-bottom: 20px;
	text-decoration: underline;
}
.session-wrap{
	background: #fff;
        padding-top: 20px;
}
.session-wrap .centerContent{
        padding: 20px 15px;
}

#recommanded .centerContent{
	font-size: 0;
	padding: 20px 15px;
}
#recommanded .poster-wrap{
    display: flex;
    flex-wrap: wrap;
}
#recommanded .poster{
	margin-right: 10px;
	width: calc(50% - 10px);
}
#recommanded .poster:nth-child(odd){
	margin-right: 10px;
}
#recommanded .poster:nth-child(odd):not(:last-child){
	margin-right: 10px;
}

.cinema-info .name{
	background: rgba(255,103,30,.1) url(../images/ind-loc.png) 5px 5px no-repeat;
	color: #02A2A2;
	display: inline-block;
	font-size: 20px;
	font-weight: bold;
	line-height: 100%;
	margin-bottom: 20px;
	padding: 5px 10px 5px 30px;
}

h3{
    color: #000;
    font-size: 24px;
    margin-bottom: 20px;
}
.cinema-time{
    margin-bottom: 40px;
}
.session-type{
	font-size: 0;
	margin-bottom: 20px;
}
.session-type:last-child{
	margin-bottom: 0;
}
.session-type > p{
	font-size: initial;
	margin-bottom: 10px;
}
.session{
	background: #fff;
	border: 1px solid #979797;
	border-bottom: none;
	display: inline-block;
	height: 60px;
	margin: 0 10px 10px 0;
	overflow: hidden;
	padding: 0 5px 4px 5px;
	position: relative;
	text-align: center;
	text-decoration: none;
	vertical-align: top;
	width: 100px;
}
/*
.session{
	background: #fff;
	border: 1px solid #979797;
	border-bottom: none;
	display: inline-block;
	height: 63px;
	margin: 0 10px 10px 0;
	overflow: hidden;
	padding: 0 10px 4px 10px;
	position: relative;
	text-align: center;
	text-decoration: none;
	vertical-align: top;
	width: 130px;
}
*/
.session .full:empty{
	background: skyblue;
	height: 2px;
	width: 10px;
}
.session .schedule_housename{
    position: absolute;
    right: 0;
    font-size: 11px !important;
    padding-right: 2px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 92px;
}
.session .time{
	color: #000;
	display: inline-block;
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 0;
	margin-top: 15px;
	max-width: 100%;
}
.session .price{
	margin-bottom: 0;
}
.session.midnight,
.session.midnight.full{
    background-image: url(../images/time-mn.png);
    background-size: cover;
}
.session.midnight .time,
.session.midnight.full .time{
    color: #fff;
}
.session.midnight .price,
.session.midnight .zone{
    color: #aaa;
}
.session.full{
	background-color: rgba(0,0,0,.1);
	cursor: default;
}
.session.full .time{
	color: rgba(0,0,0,.3);
	margin-top: 8px;
	top: auto;
	-webkit-transform: none;
	-moz-transform: none;
	transform: none;
}
.full-txt{
	color: #CD5C5C;
	font-size: 20px;
	margin-bottom: 0;
	text-align: center;
}

/* ===== 4.0 Seat plan ================================================== */
.selected-movie{
	background: #333;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 10;
	-webkit-box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.3);
}
.selected-movie.opened{
    z-index: 101;
}
.selected-movie .centerContent{
	height: 100%;
}
.journey{
	background: url(../images/arrow-w-bot.png) right 15px center no-repeat;
	background-size: 12px auto;
	cursor: pointer;
	font-size: 0;
	height: 44px;
	padding: 0 15px;
}
.opened .journey{
	background-image: url(../images/arrow-w-top.png);
}
.step{
	font-size: 16px;
	line-height: 44px;
	margin-right: 10px;
	opacity: 0;
	position: absolute;
	top: -100px;
	vertical-align: top;
}
.step:before{
	background: #666;
	border-radius: 10px;
	color: #999;
	counter-increment: seat-journey;
	content: counter(seat-journey);
	display: inline-block;
	height: 20px;
	line-height: 20px;
	margin-right: 5px;
	margin-top: 12px;
	text-align: center;
	vertical-align: top;
	width: 20px;
}
.step.active:before{
	background: #03E3E3;
	color: #333;
}
.step.success:before{
	background: #8FBC8F url(../images/check.png) center no-repeat;
	background-size: 12px auto;
	font-size: 0;
}
.step.failed,
.step.active.failed{
    color: #CD5C5C;
}
.step.failed:before{
    background: #CD5C5C url(../images/ind-exclamation.png) center no-repeat;
    font-size: 0;
}
.step.active{
	color: #03E3E3;
	display: inline-block;
	opacity: 1;
	position: static;
}
.step.active.success{
	color: #8FBC8F;
	display: inline-block;
}
.selected-movie .timer{
	background: #02A2A2;
	color: #fff;
	display: inline-block;
	font-size: 12px;
	padding: 0 4px;
	position: relative;
	top: 50%;
	vertical-align: top;
}
.expandable{
	display: none;
	height: calc(100% - 44px);
	max-height: 302px;
	overflow-y: auto;
	padding: 10px 15px 20px 15px;
	position: relative;
}
.movie-info{
	border-bottom: 1px solid #5B5B5B;
	padding-bottom: 20px;
}
.movie-info .img{
	display: none;
}
.movie-info h4{
	color: #fff;
	font-size: 26px;
	margin-bottom: 10px;
}
.movie-info .txt .label{
	margin-right: 5px;
	width: auto;
}
.movie-info .txt .info-txt{
    font-size: inherit;
	display: inline;
	margin-left: 0;
}
.price-chart{
	color: #fff;
	padding-top: 20px;
}
.price-chart p{
	color: inherit;
}
.price-chart .label{
	color: #999;
}
.label.tic{
	margin-top: 20px;
}
.selectBox-wrap .centerContent{
	font-size: 0;
	padding: 20px 15px;
}
.selectBox-wrap .select-box{
	margin-bottom: 5px;
}
.seat-wrap{
	background: #333;
	padding: 20px 0;
}
.seat-wrap .centerContent{
	padding: 0 15px;
}
.seat-wrap.zoomed .centerContent{
	padding-right: 40px;
	position: relative;
}
.seat-wrap.zoomed .centerContent:before{
	background-color: #333;
	color: #999;
	content: "上下滑动";
	font-size: 12px;
	height: 14px;
	line-height: 14px;
	margin-top: -38px;
	padding: 0 10px;
	position: absolute;
	right: 13px;
	text-align: center;
	text-transform: uppercase;
	top: 50%;
	width: 62px;
	z-index: 1;
	transform-origin: right 50%;
	-webkit-transform: rotate(-90deg) translateY(-50%);
	-moz-transform: rotate(-90deg) translateY(-50%);
	transform: rotate(-90deg) translateY(-50%);
}
.en .seat-wrap.zoomed .centerContent:before{
	content: "Scroll area";
	margin-top: -48px;
	right: 13px;
	width: 82px;
}
.seat-wrap.zoomed .centerContent:after{
	border-left: 1px dashed rgba(255,255,255,.2);
	border-right: 1px dashed rgba(255,255,255,.2);
	bottom: 0;
	content: "";
	display: block;
	position: absolute;
	right: 15px;
	top: 0;
	width: 6px;
}
.screen{
	background-color: #333;
	margin: 20px auto 0 auto;
	max-width: 580px;
	overflow: hidden;
	position: relative;
	text-align: center;
	width: 100%;
	-webkit-transition: opacity .5s ease-in-out;
	-moz-transition: opacity .5s ease-in-out;
	transition: opacity .5s ease-in-out;
}
.screen img{
	vertical-align: bottom;
}
.screen p{
	color: #03E3E3;
	font-size: 12px;
	line-height: 16px;
	margin-top: 10px;
	position: relative;
	text-transform: uppercase;
	z-index: 2;
}
.screen p span{
    border: 0;
	color: inherit;
	font-size: inherit;
    line-height: normal;
	margin: 0 10px;
}
#seat .btnWrap,
#payment .btnWrap{
	text-align: center;
}
#seat .solidBtn,
#payment .solidBtn{
	margin: 0 0 10px 0;
	width: 200px;
}


/* ===== 4.1 Seat style ========== */
.legend{
	margin-bottom: 20px;
}
.legend div{
	display: inline-flex;
	line-height: 22px;
	margin-bottom: 10px;
	margin-right: 20px;
	vertical-align: top;
}
body .legend span{
    height: 22px;
    line-height: 22px;
    margin: 0 5px 0 0;
    width: 22px;
    text-align: center;
}
#seat-plan{
	overflow: auto;
}
.fitted #seat-plan{
	overflow: hidden;
}
#seat-plan .inner{
	display: inline-block;
	vertical-align: top;
}
#seat-plan.scaled .inner{
	display: block;
}
#seat-plan .row{
	font-size: 0;
	white-space: nowrap;
}
#seat-plan .row.corridor{
	height: 8px;
}
/* .seat-wrap span{
	background-position: center;
	background-clip: padding-box;
	border: 1px solid #00ff66;
    border-radius: 2px; 
	color: #fff;
	cursor: pointer;
	display: inline-block;
	font-size: 14px;
	height: 44px;
	line-height: 44px;
	margin: 2px;
	position: relative;
	text-align: center;
	vertical-align: top;
	width: 44px;
} */
span.empty,
span.row-label,
span.corridor,
span.twin-gap{
	background-color: transparent;
	border-color: transparent;
	cursor: default;
}
span.row-label,
span.corridor{	
	width: 22px;
}
span.twin-gap{
    width: 10px;
}
span.wheel{
	background-image: url(../images/ic-wheelchair.png);
    background-size: 96%;
}
span.picked{
	background-color: #00FF66;
}
span.prog{
	background-color: #444;
    border-color: #444;
    color: #999;
}

span.sold{
	background-color: transparent;
	background-image: url(../images/ic-seat_sold.png);
	border-color: #E70001;
	cursor: default;
	font-size: 0;
}

/* span.reserved{
	background-color: transparent;
	border-color: transparent;
	cursor: default;
	font-size: 0;
} */
span.reserved.wheel{
    background: none;
}

#selected-seat span:after {
    content: ",";
}

#selected-seat span:last-child:after {
    content: "";
}

/* ===== 5.0 Payment ================================================== */
#payment-content.centerContent{
	padding: 0 15px;
}
.payment-box{
	background: #fff;
	border: 2px solid #fff;
	margin-bottom: 20px;
	padding: 0 8px 18px 8px;
	position: relative;
}
.payment-box.error{
	border: 2px solid #CD5C5C;
}
.payment-box .title{
	color: #333;
	font-size: 20px;
	height: 44px;
	line-height: 44px;
}
.payment-box.error .title{
	color: #CD5C5C;
}
.payment-box select{
	max-width: 360px;
}
.tic-type{
	height: 44px;
	margin-bottom: 20px;
}
.tic-type .txt{
	display: inline-block;
	padding-right: 15px;
	position: relative;
	top: 50%;
	width: calc(100% - 132px);
}
.tic-type .txt .type{
	color: #333;
	font-size: 16px;
}
.tic-type .txt p,
.tic-type .txt span{
	color: #02A2A2;
	font-size: 12px;
}
.tic-type .btn{
	border-radius: 5px;
	float: right;
	font-size: 0;
	overflow: hidden;
}
.tic-type .btn *{
	border: none;
	height: 44px;
	text-align: center;
	vertical-align: top;
	width: 44px;
}
.tic-type .btn button{
	background: #02A2A2;
	color: #000;
	font-size: 20px;
}
.tic-type .btn button:hover{
	color: #fff;
}
.tic-type .btn button:disabled{
	background: #ccc;
	color: #aaa;
}
.tic-type .btn input{
	background: #f3f3f3;
	color: #333;
	font-size: 20px;
	padding: 0;
}
.picked-seat{
	border-bottom: 2px solid #333;
}
.picked-seat p{
	color: #333;
	font-size: 16px;
	margin-bottom: 10px;
}
.picked-seat .total-tic{
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 20px;
}
.total-price{
	margin-top: 20px;
}
.total-price .total-amount{
	color: #333;
	float: left;
	font-size: 20px;
	font-weight: bold;
}
.total-price .amount{
	color: #02A2A2;
	font-size: 20px;
	text-align: right;
                  min-width:60px
}
.transaction_servicecharge{
	margin-top: 20px;
}
.transaction_servicecharge .total-servicecharge{
	color: #333;
	float: left;
	font-size: 20px;
	font-weight: bold;
}
.transaction_servicecharge .amount-servicecharge{
	color: #02A2A2;
	font-size: 20px;
	text-align: right;
                  min-width:60px
}
.option-wrap{
	font-size: 0;
	margin-right: -10px;
	padding-bottom: 10px;
}
.option-wrap .option{
	background-position: center bottom -1px;
	background-repeat: no-repeat;
	border: 1px solid #ddd;
	border-radius: 5px;
	height: 66px;
	margin-bottom: 10px;
	margin-right: 10px;
	vertical-align: top;
	width: 130px;
}
.option-wrap .option.active{
	background-color: #EBEFF2;
	background-position: center top -4px;
	border-width: 4px;
	-webkit-box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.1);
}
.option-wrap .visa{
	background-image: url(../images/payment-option-visa.png);
}
.option-wrap .master{
	background-image: url(../images/payment-option-master.png);
}
.option-wrap .union{
	background-image: url(../images/payment-option-union.png);
}
.e-ticket{
	border-top: 1px solid #ddd;
	font-size: 0;
	padding-top: 10px;
}
.e-ticket p{
	font-size: 16px;
	margin-bottom: 10px;
}
.e-ticket input{
	max-width: 340px;
	width: 100%;
}
.e-ticket .error-msg{
	margin: 10px 0 0 0;
}
.error #tic-mail{
	background-color: rgba(205,92,92,.1);
	color: #CD5C5C;
}
.payment-box:last-child{
	margin-bottom: 0;
}
.agree_tnc{
	display: block;
	margin-top: 20px;
}
.agree_tnc input{
	float: left;
	margin-top: 2px;
}
.agree_tnc p{
	margin-left: 20px;
}
.agree_tnc .error-msg{
	color: #CD5C5C;
	font-size: 14px;
	margin-left: 0;
}
.purchase-info{
	font-size: 0;
	margin-top: 20px;
}
.purchase-info > div{
	display: inline-block;
	margin-bottom: 20px;
	vertical-align: top;
}
.purchase-info > div:nth-child(even){
	width: 40%;
}
.purchase-info > div:nth-child(odd){
	padding-right: 20px;
	width: 60%;
}
.purchase-info p{
	color: #fff;
	font-size: 14px;
}
.purchase-info p.label{
	color: #999;
}
.purchase-info .left{
	width: 60%;
}
.purchase-info .right{
	width: 40%;
}

/* ===== 6.0 Tutorial ================================================== */
.tuto-wrap{
	background: #000;
	font-size: 0;
	padding: 0 0 20px 0;
}
.tuto-wrap .txt{
	padding: 20px 15px;
}
.tuto-wrap .title{
	color: #fff;
	font-size: 20px;
	margin-bottom: 20px;
}
.tuto-wrap p{
	color: #aaa;
	font-size: 16px;
	margin-bottom: 10px;
}

/* ===== 7.0 Contact ================================================== */
#cont-wrap{
	font-size: 0;
	padding: 20px 15px;
}
.cont-info{
	background: #02A2A2;
	box-shadow: 0 5px 10px rgba(0,0,0,.3);
	margin-bottom: 40px;
	max-width: 360px;
	padding: 20px;
}
.cont-info a{
	color: #fff;
	display: block;
}
.address .ios,
html.iOS .address .geo{
	display: none;
}
html.iOS .address .ios{
	display: block;
}
.cont-info p{
	color: #fff;
}
#contact .title:first-child{
    border-top: 0;
    padding-top: 0;
}
#contact .title{
    border-top: 1px solid rgba(255,255,255,.2);
	font-size: 20px;
    padding-top: 20px;
}
#contact .title-sub{
	margin-bottom: 20px;
}
.cont-info .item{
	background-position: left top;
	background-repeat: no-repeat;
	color: #b4e3e3;
	margin-bottom: 20px;
	padding-left: 30px;
}
.cont-info .address{
	background-image: url(../images/cont-loc.png);
}
.cont-info .email{
	background-image: url(../images/cont-mail.png);
}
.cont-info .phone{
	background-image: url(../images/cont-phone.png);
}
.cont-info .item p{
	color: inherit;
}
.cont-info .phone p{
	font-size: 12px;
	font-style: italic;
}
.feedback .title{
	color: #000;
}
#ff-msg{
	resize: vertical;
}

/* ===== 8.0 FAQ ================================================== */
.faq-wrap{
	list-style: none;
	counter-reset: faq_counter;
}
#faq-content ol {
    margin-left: 20px;
}
#faq-content li{
	border-bottom: 1px solid #ddd;
	color: #333;
	font-size: 16px;
	margin-bottom: 20px;
	padding-bottom: 20px;
	position: relative;
}
#faq-content li p{
	font-size: 16px;
}
.faq-item:before{
	color: inherit;
	content: counter(faq_counter, decimal-leading-zero);
	counter-increment: faq_counter;
	float: left;
	margin-right: 6px;
	width: 20px;
}
.faq-item.opened{
	border-bottom: 1px solid #ddd;
	color: #02A2A2;
}
.qn{
	color: inherit;
	cursor: pointer;
	font-size: inherit;
	margin-bottom: 5px;
	margin-left: 26px;
}
.ans{
	color: #666;
	display: none;
	font-size: inherit;
	margin-left: 26px;
}

/* ===== 9.0 Lounge ================================================== */
.cover-img{
	height: 172px;
	overflow: hidden;
	position: relative;
}
.cover-img img{
	height: 100%;
	left: 50%;
	position: absolute;
	width: auto;
}
#lounge-cont.centerContent{
	padding: 15px;
}
#lounge_form{
	border-top: 1px solid #ddd;
	margin-top: 20px;
	padding-top: 10px;
}
#lounge_form select{
	min-width: 100px;	
}
.form-section.contInfo-wrap{
	font-size: 0;
}
#lounge_form .contTitle{
	display: inline-block;
	margin-right: 10px;
	vertical-align: top;
	width: 120px;
}
.contInfo-wrap .contInfo-name{
	display: inline-block;
	vertical-align: top;
	width: calc(100% - 110px);
}
.equip-wrap .input-wrap{
	font-size: 0;
}
.equip-wrap label{
	cursor: pointer;
	display: inline-block;
	margin-right: 10px;	
	position: relative;
	vertical-align: top;
}
.equip-wrap label p{
	width: 84px;
}
.equip-wrap input[type="checkbox"]{
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
}
.equip-wrap input:checked + p{
	background-color: rgba(255,255,0,.2);
	border-color: #02A2A2;
	color: #02A2A2;
}
.equip-wrap label p{
	border: 1px solid #999;
	color: #999;
	line-height: 44px;
	padding: 0 15px;
	text-align: center;
        width: auto;
}
.form-section.special-wrap{
	border: none;
}
#lf-special{
	resize: vertical;
}

/* ===== 10.0 About ================================================== */
#cinema-cont.centerContent{
	padding: 15px;
}
.table-wrap{
	border-top: 1px solid #ddd;
	margin-top: 20px;
	padding-top: 20px;
}
.table-wrap .legend span{
    display: inline-block;
    vertical-align: top;
}
.legend .two-d span{
	background-color: rgba(255,215,0,.5);
	color: #000;
}
.legend .three-d span{
	background-color: rgba(100,149,237,.5);
	color: #000;
}
.table{
	border-left: 1px solid #000;
    border-top: 1px solid #000;
    overflow-x: auto;
}
.table .row{
    border-bottom: 1px solid #000;
    border-right: 1px solid #000;
    display: inline-block;
	font-size: 0;
    vertical-align: top;
    white-space: nowrap;
}
.table .row.label{
	background-color: #e6e6e6;
}
.table .row.two-d{
	background-color: rgba(255,215,0,.5);
}
.table .row.three-d{
	background-color: rgba(100,149,237,.5);
}
.col,
.col-full{
	padding: 4px 0;
	text-align: center;
}
.col{
	display: inline-block;
    min-width: 250px;
	vertical-align: top;
    white-space: normal;
	width: 33.3333%;
}

.col.tab-gt{
	display: none;
}
.two-d .col div,
.three-d .col div{
    align-items: center;
    border-bottom: 1px solid rgba(0,0,0,.05);
    box-sizing: border-box;
    display: flex;
    height: 44px;
    justify-content: center;
    line-height: normal;
    padding: 5px 10px;
    width: 100%;
}
.two-d .col div:last-child,
.three-d .col div:last-child{
    border-bottom: 0;
}

/* ===== 99.0 Others ================================================== */
#purchase-history{
	margin-top: 10px;
	max-width: 280px;
	width: 100%;
}
#main-content{
	padding: 20px 15px;
	min-height: 500px;
}
#history .confirm{
	width: 200px;
}
#search-result .centerContent{
	padding: 20px 15px;
}
body#thanks{
	padding-top: 0;	
}
#thanks .selected-movie{
	position: static;
	-webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
#thanks .journey{
	background-image: none;
}
#thanks .expandable{
	display: block;
	max-height: none;
}
#thanks .msg-only.centerContent{
	padding: 20px 15px;
}
body#payment-fail{
	padding-top: 0;	
}
#payment-fail .selected-movie{
	position: static;
	-webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
#payment-fail .journey{
	background-image: none;
}
#payment-fail .expandable{
	display: block;
	max-height: none;
}
#payment-fail .msg-only.centerContent{
	padding: 20px 15px;
}

#ads-top{
	height: 0;
	display:none;
}

.evt-thumb {
    display: inline-block;
    margin-bottom: 10px;
    position: relative;
    vertical-align: top;
    width: calc(50% - 5px);
}

#evt-details-wrap .evt-sidebar{
	display: none;
}

#evt-details-wrap {
    width: 100%;
    padding: 20px 15px 40px 15px;
    min-height: 400px;
}

.evt-info .title {
    color: #000;
    font-size: 24px;
    line-height: normal;
    margin-bottom: 10px;
}

.evt-info .date {
    color: #999;
    margin-bottom: 30px;
}

@media(min-width:0px) and (max-width:767px){
	#home nav.sidebaron .ic-tic{
		display: none;
	}
}

@media(max-width:380px){
    body .strokeBtn, body .solidBtn {
        font-size: 14px;
        padding: 0 20px;
    }
    .slide h4 {
        font-size: 28px;
    }
}

@media (min-width:430px){
	#sideBar{
		right: -386px;
	}
}

@media (max-width:767px){
    header{
        padding-bottom: 15px;
    }
	#seat-plan{
		max-height: 900px;
	}
    .evt-thumb:nth-child(odd){
		margin-right: 6px;
    }
}

@media (min-width:768px){
	/* ===== 1.0[768] Common ========== */
	.poster-only-wrap .poster{
		margin-right: 10px;
		width: calc(25% - 7.5px);
	}
	.poster-only-wrap .poster:nth-child(even){
		margin-right: 10px;
	}
	.poster-only-wrap .poster:nth-child(4n + 4){
		margin-right: 0;
	}

	.evt-thumb {
	    margin-right: 10px;
	    width: calc(20% - 11px);
	}
	
	.evt-img {
	    float: left;
	    margin-bottom: 5px;
	    margin-right: 20px;
	    width: 280px;
	}

	header .mob{
		display: none;
	}
	
	/* ===== 1.3[768] Header & nav ========== */
	.hamburger{
		display: none;
	}
	.logo-wrap{
		display: inline-block;
		margin-left: 0;
		padding: 0 15px;
		margin-top: 10px;
	}

	nav{
		background-color: transparent;
		height: 44px;
		left: 230px; /* override inline style that insert by menu toggle */
		padding-top: 0;
		text-align: right;
		right: 15px;
		width: auto;
        z-index: 10;
        top: 0;
		margin-left: -10px;
	}
	nav:before{
		border-left: 2px solid #999;
		content: "";
		float: left;
		height: 22px;
		margin-top: 11px;
	}
	nav + .overlay{
		display: none !important;
	}

	#home nav.sidebaron .ic-tic{
		display: inline-block;
	}

	#lang{
		float: left;
		width: auto;
	}
	#lang:after{
		display: none;
	}
	.navBtn{
		display: inline-block;
		margin-left: 10px;
		padding: 0 5px;
	}

	#ads-top{
	display: block;
	height: auto;
	position: relative;
	}
	.ads-wrap{
		display: block;
		font-size: 0;
		margin: 40px 0 20px;
		padding: 0 15px;
		text-align: center;
	}
	.ads-wrap a{
		display: inline-block;
		width: calc(50% - 5px);
		vertical-align: bottom;
	}
	.ads-wrap a:nth-child(odd){
		margin-right: 10px;
	}
	.ads-cont-end a{
		display: block;
	}
	.ads-close{
		background: url(../images/ads-x.png) center no-repeat;
		height: 24px;
		position: absolute;
		top: 10px;
		right: 10px;
		width: 24px;
	}
	.ads-close:hover{
		background-color: rgba(0,0,0,.2);
	}

	#main-nav{
		background: #F5F5F5;
		height: 100%;
		left: -75%;
		position: fixed;
		top: 0;
		width: 75%;
		z-index: 200;
	}

	#main-nav{
		background-color: transparent;
		padding-top: 0;
		position: static;
		width: 100%;
	}
	#main-nav + .overlay{
		display: none !important;
	}
	
	/* ===== 1.4[768] Footer ========== */
	.sitemap{
		font-size: 0;
		text-align: center;
	}
	.btn-group{
		display: inline-block;
		max-width: 220px;
		text-align: left;
		vertical-align: top;
		width: 25%;
	}
	.btn-group .trigger{
		cursor: default;
	}
	.btn-group .trigger:hover{
		background-color: transparent;
	}
	.trigger:after{
		display: none;
	}
	.links-wrap{
		display: block !important;
	}
	.btn-group a{
		line-height: 30px;
	}
	.copyright-txt{
		padding-bottom: 20px;
		padding-top: 20px;
	}
	
	/* ===== 1.6[768] Poster ========== */
	.poster.more p{
		font-size: 28px;
	}
	.poster.more p img{
		margin-top: 8px;
	}
	
	/* ===== 1.7[768] Ads ========== */
	.ads-wrap{
		display: block;
		font-size: 0;
		margin: 40px 0 20px;
		padding: 0 15px;
	}
	.ads-wrap a{
		display: inline-block;
		width: calc(50% - 5px);
	}
	.ads-wrap a:first-child{
		margin-right: 10px;
	}
	
	/* ===== 1.8[768] Search ========== */
	.hot a{
		width: 120px;
	}
	
	/* ===== 1.9[768] Pop up ========== */

	/* ===== 2.0[768] Home ===== */
	#home-tab .poster{
		margin-right: 10px;
		width: calc(20% - 8px);
	}
	#home-tab .poster:nth-child(even),#evt-news .evt-thumb:nth-child(even){
		margin-left: 0;
	}
	#home-tab .poster:nth-child(3n),#evt-news .evt-thumb:nth-child(3n){
		margin-right: 0;
	}
	#home-tab .poster:nth-child(5n),#evt-news .evt-thumb:nth-child(3n){
		margin-right: 0;
	}

	.evt-thumb img{
		margin-right: 10px;
		height: 260px;
	}
	
	/* ===== 2.1[768] banner ========== */
	.slide .synopsis{
		display: block;
	}
	.slide .more{
		display: inline-block;
		margin-top: 20px;
	}

	/* ===== 3.0[768] Movie detail ========== */
	.poster-img{
		display: inline-block;
		float: left;
		width: 180px;
	}
	#movie-details .txt{
		margin-left: 200px;
	}
	.synopsis .syn-txt{
		max-height: none;
	}
	.synopsis .read-more{
		display: none;
	}
	#recommanded .poster{
		margin-right: 10px;
		width: calc(24% - 7.5px);
	}
	#recommanded .poster:nth-child(odd):not(:last-child){
		margin-right: 10px;
	}
	
	/* ===== 4.0[768] Seat plan ========== */
	.step{
		display: inline-block;
		margin-left: 10px;
		margin-right: 0;
		opacity: 1;
		position: static;
		width: calc(33.3333% - 28px);
	}
	.step:first-child{
		margin-left: 0;
	}
	.step.success{
		color: #8FBC8F;
	}
	.selected-movie .timer{
		float: right;
		margin-right: 25px;
	}
	.expandable{
		font-size: 0;
	}
	.expandable:after{
		border-left: 1px solid #585858;
		bottom: 20px;
		content: "";
		display: block;
		left: 69%;
		position: absolute;
		top: 10px;
	}
	.movie-info{
		border-bottom: none;
		display: inline-block;
		padding-bottom: 0;
		padding-right: 15px;
		vertical-align: top;
		width: 70%;
	}
	.movie-info:after{
		clear: both;
		content: "";
		display: block;
	}
	.movie-info .img{
		display: block;
		float: left;
		width: 80px;
	}
	.movie-info .txt{
		margin-left: 100px;
	}
	.price-chart{
		display: inline-block;
		padding-left: 15px;
		padding-top: 0;
		vertical-align: top;
		width: 30%;
	}
	.select-box{
		display: inline-block;
		vertical-align: top;
		width: calc(50% - 2.5px);
	}
	.select-box:nth-child(odd){
		margin-right: 5px;
	}
	#seat .btnWrap,
	#payment .btnWrap{
		text-align: left;
	}
	#seat .solidBtn
	{
		margin-left: 0;
		margin-right: 20px;
	}
	#payment .solidBtn{
		margin-left: 0;
		margin-right: 20px;
	}

	#cust_alert .solidBtn{
		margin-left: 0;
		margin-right: 0px !important;
	}
	
	/* ===== 5.0[768] payment ========== */
	.tic-type .txt p{
		display: inline;
		font-size: 16px;
	}
	.tic-type .txt p span{
		font-size: inherit;
	}
	.tic-type .txt .type:after{
		/*content: "-";*/
		padding: 0 10px;
	}
	.picked-seat{
		border-bottom: none;
		border-top: 2px solid #333;
		padding: 10px 160px 0 0;
	}
	.picked-seat .total-tic{
		margin-bottom: 0;
	}
	.total-price{
		bottom: 10px;
		display: inline-block;
		position: absolute;
		right: 10px;
	}
	.total-price p{
		display: inline-block;
		float: none;
		margin-left: 10px;
	}
	.transaction_servicecharge{
		bottom: 45px;
		display: inline-block;
		position: absolute;
		right: 10px;
	}
	.transaction_servicecharge p{
		display: inline-block;
		float: none;
		margin-left: 10px;
	}
	#payment .movie-info{
		width: 65%;
	}
	.purchase-info{
		display: inline-block;
		margin-top: 0;
		width: 35%;
	}
	#payment .expandable:after{
		left: 62%;
	}
	.e-ticket .error-msg{
		display: inline-block;
		margin-left: 10px;
		max-width: 360px;
		vertical-align: top;
	}
	
	/* ===== 6.0[768] Tutorial ========== */
	.tuto-wrap .centerContent{
		font-size: 0;
		position: relative;
	}
	.img-wrap,
	.tuto-wrap .txt{
		display: inline-block;
		vertical-align: top;
		width: 50%;
	}
	.tuto-wrap .txt{
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
	}
	.tuto-wrap.img-right .centerContent{
		text-align: right;
	}
	.tuto-wrap.img-right .txt{
		left: 0;
	}

	/* ===== 7.0[768] Contact ========== */
	.cont-info,
	.feedback{
		display: inline-block;
		vertical-align: top;
	}
	.cont-info{
		width: 300px;
	}
	.feedback{
		margin-left: 20px;
		width: calc(100% - 320px);
	}

	/* ===== 9.0[768] Lounge ========== */
	.cover-img{
		height: 236px;
	}
	.form-section{
		font-size: 0;
	}
	.form-section .input-wrap{
		display: inline-block;
		margin-right: 10px;
		vertical-align: top;
		width: calc(50% - 5px);
	}
	.contInfo-wrap .input-wrap:nth-child(even){
		margin-right: 0;
	}
	#lounge_form .contInfo-name{
		width: calc(50% - 135px);
	}
	#lounge_form .input-wrap.start-time{
		margin-right: 10px;
		width: calc(25% - 7.5px);
	}
	.evt-wrap .input-wrap:nth-child(odd){
		margin-right: 0;		
	}
	#lounge_form .input-wrap.end-time{
		margin-right: 0;
		width: calc(25% - 7.5px);
	}
	.form-section.equip-wrap .input-wrap,
	.form-section.special-wrap .input-wrap{
		width: 100%;
	}
	.equip-wrap label p{
		min-width: 130px;
	}
    
    /* ===== 10.0[768] About ========== */
    .table .row{
        display: block;
        white-space: normal;
    }
    .col{
        min-width: 0;
    }
	
	/* ===== 99.0[768] Others ========== */
	#thanks .step{
		margin: 0;
		width: 33.3333%;
	}
	#thanks .step:nth-child(2n){
		text-align: center;
	}
	#thanks .step:nth-child(3n){
		text-align: right;
	}
	#thanks .movie-info{
		width: 65%;
	}
	#thanks .expandable:after{
		left: 62%;
	}
	#payment-fail .step{
		margin: 0;
		width: 33.3333%;
	}
	#payment-fail .step:nth-child(2n){
		text-align: center;
	}
	#payment-fail .step:nth-child(3n){
		text-align: right;
	}
	#payment-fail .movie-info{
		width: 65%;
	}
	#payment-fail .expandable:after{
		left: 62%;
	}	
	
}

@media (min-width:980px){
	/* ===== 1.0[980] Common ========== */
	body{
		padding-top: 64px;
	}
	.centerContent{
		left: 50%;
		margin-left: -490px;
		position: relative;
	}
	
	#evt-details-wrap .evt-sidebar a {
	    display: block;
	    margin-bottom: 10px;
	}
		
	/* ===== 1.3[980] Header & nav ========== */
	header{
		height: 64px;
	}
	nav{
		left: 50% !important;  /* to override important in medai querry 768 */
		margin-left: -260px;
		top: 10px;
		width: 735px;
	}
	
	/* ===== 1.6[980] Poster ========== */
	.poster .over-wrap{
		display: block;
	}
	
	/* ===== 1.8[980] Search ========== */
	.search-wrap{
		top: -64px;
	}
	.search-bar-wrap{
		height: 64px;
	}
	.search-bar-wrap .centerContent{
		padding-top: 10px;
	}
	.search-bar-wrap .icon{
		top: 10px;
	}
	
	#popup .owl-dots{
		left: auto;
		margin-left: 0;
	}
    
    /* ===== 1.10[980] Note ========== */
    .note-wrap .centerContent{
        font-size: 0;
    }
    .note-item{
        box-sizing: border-box;
        display: inline-block;
        padding: 0 10px;
        text-align: center;
        vertical-align: top;
        width: 25%;
    }
    .note-item .thumb{
        display: block;
        margin: auto;
    }
    .note-item .txt{
        display: block;
        width: 100%;
    }
    .note-btnWrap{
        left: 50%;
        margin-left: -490px;
    }
	
	#evt-details-wrap .evt-sidebar{
		border-left: 1px solid rgba(0,0,0,.1);
		display: block;
		float: right;
		padding-left: 15px;
		margin-left: 15px;
		width: 120px;
	}
	
	/* ===== 2.0[980] Home ========== */
	#home-tab .poster{
		margin-right: 10px;
		width: calc(20% - 8px);
		height: 260px;
	}
	#home-tab .poster:nth-child(3n),#evt-news .evt-thumb:nth-child(3n){
		margin-right: 10px;
	}
	#home-tab .poster:nth-child(5n),#evt-news .evt-thumb:nth-child(5n){
		margin-right: 0;
	}
	
	.evt-thumb img{
		margin-right: 10px;
		height: 260px;
	}
	
	
	/* ===== 2.1[980] banner ========== */
	.owl-dots{
		left: 50%;
		margin-left: -490px;
	}
	.owl-carousel .owl-stage{
            display: flex;
        }
        #banner{
            padding-top: 64px;
            height:300px;
        }
        .owl-item{
            flex-shrink: 0;
        }
        .slide{
            height: 100%;
            min-height: calc(100vw*5/16);
            transition: height .6s ease-in-out;
        }
        .slide .centerContent{
            opacity: 0;
            transition: opacity .6s ease-in-out;
            z-index: 2;
            top: 150px;
            transform: translate(0, -50%);
        }
        .slide .synopsis{
            max-width: 50%;
        }
        #banner .slide img{
            left: 50%;
            min-width: 100%;
            position: absolute;
            transform: translateX(-50%);
            transition: height .1s ease-in-out, width .1s ease-in-out;
            width: auto;
        }
        #banner:hover .active .centerContent{
            opacity: 1;
        }
        .slide:before,
        .slide:after{
            content: "";
            display: block;
            left: 0;
            position: absolute;
            transition: background .6s ease-in-out;
            width: 100%;
            z-index: 1;
        }
        #banner:hover .active .slide:before{
            background: rgba(0,0,0,.5);
            height: 100%;
            top: 0;
        }
        #banner:hover .active .slide:after{
            background-color: transparent;
            background: linear-gradient(to top, rgba(0,0,0,.5), rgba(0,0,0,0));
            height: calc(100% - 44px);
            top: 44px;
        }
	
	/* ===== 3.0[980] Movie detail ========== */
	.poster-img{
		width: 240px;
	}
	#movie-details .txt{
		margin-left: 260px;
	}
	
	/* ===== 4.0[980] Seat plan ========== */
	body#seat,
	body#payment{
		padding-top: 0;
	}
	.selected-movie{
		position: static;
		-webkit-box-shadow: 0px 3px 6px 0px rgba(0,0,0,0);
    	-moz-box-shadow: 0px 3px 6px 0px rgba(0,0,0,0);
    	box-shadow: 0px 3px 6px 0px rgba(0,0,0,0);
	}
	.selected-movie + .overlay{
		display: none !important;
	}
	.journey,
	.journey.opened{
		background-image: none;
	}
	.selected-movie .timer{
		margin-right: 0;
	}
	.expandable{
		display: block !important;
		overflow: hidden;
	}
	.expandable:after{
		left: 79%;
	}
	.movie-info{
		width: 80%;
	}
	.movie-info .img{
		width: 140px;
	}
	.movie-info .txt{
		margin-left: 160px;
	}
	.price-chart{
		width: 20%;
	}
	.selectBox-wrap .centerContent{
		padding-bottom: 40px;
		padding-top: 40px;
	}
	.selectBox-wrap .select-box,
    .selectBox-wrap .btnWrap{
        display: inline-block;
		margin-bottom: 0;
		margin-right: 10px;
		width: calc(24% - 8px);
	}
    #seat .selectBox-wrap .btnWrap{
        margin: 0;
    }
    .selectBox-wrap select,
    #seat .selectBox-wrap .solidBtn{
        min-width: 0;
        width: 100%;
    }
	.select-box:nth-child(odd){
		margin-right: 10px;
	}
	
	/* ===== 4.1[980] Seat style ========== */
	#seat-plan{
		overflow: hidden;
	}

	/* ===== 5.0[980] Payment ========== */
	#payment .movie-info{
		width: 70%;
	}
	.purchase-info{
		display: inline-block;
		margin-top: 0;
		width: 30%;
	}
	#payment .expandable:after{
		left: 67%;
	}
	.e-ticket .error-msg{
		max-width: 580px;
	}

	/* ===== 7.0[980] Contact ========== */
	.cont-info .phone a{
		color: inherit;
		cursor: default;
		text-decoration: none;
	}
	
	/* ===== 9.0[980]] Lounge ========== */
	.cover-img{
		height: 300px;
	}
	
	/* ===== 99.0[980] Others ========== */
	#thanks .movie-info{
		width: 70%;
	}
	#thanks .expandable:after {
		left: 67%;
	}
	#payment-fail .movie-info{
		width: 70%;
	}
	#payment-fail .expandable:after {
		left: 67%;
	}
}

@media (min-width:1366px){
    /* ===== 2.2[1366] Sidebar ========== */
	#sideBar + #wrapper,
	#sideBar + .overlay +#wrapper{
		padding-right: 386px;
	}
	#home nav.sidebaron .ic-tic{
		display: none;
	}
	#home #sideBar + #wrapper nav.sidebaron{
		left: 50% !important;  /* to override important in medai querry 768 */
		margin-left: -450px;
		top: 10px;
		width: 715px;
	}
	#home nav.sidebaroff{
		left: 50% !important;  /* to override important in medai querry 768 */
		margin-left: -260px;
		top: 10px;
		width: 715px;
	}
	nav{
		left: 50% !important;  /* to override important in medai querry 768 */
		margin-left: -260px;
		top: 10px;
		width: 735px !important;

	}
	/* reduce max-width of centerContent in home page, to prevent unpredicted error when double scrollbar appear */
	#home #sideBar + #wrapper .centerContent{
		max-width: 940px;
		margin-left: -470px;
	}
	#sideBar{
		right: 0 !important; /* force the sidebar to always visible in desktop screen */
		-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
		-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
	}
	#sideBar + .overlay{
		display: none !important; /* force the overlay to hide */
	}
	#sideBar + #wrapper header,
	#sideBar + .overlay + #wrapper header{
		width: calc(100% - 386px);
	}
	#sideBar + #wrapper .slide,
	#sideBar + .overlay + #wrapper .slide{
		height: 500px;
	}
	#sideBar + #wrapper .owl-dots{
		padding: 0 35px;
	}
	#sideBar + #wrapper .sitemap1 a{
		padding: 0 26px;
	}
	#sideBar + #wrapper .sitemap1 a:first-of-type{
		padding-left: 0;
	}
	#sideBar + #wrapper .sitemap a:last-of-type{
		padding-right: 0;
	}
}

@media (min-width:1440px){
	#home nav .ic-tic{
		display: none !important;
	}
	#home #sideBar + #wrapper .centerContent {
		max-width: 980px;
		margin-left: -490px;
	}
	#sideBar + #wrapper .owl-dots {
		padding: 0 15px;
	}
}


@media (min-width:1920px){
	#home nav .ic-tic{
		display: none !important;
	}
	#sideBar + #wrapper #banner .slide,
	#sideBar + .overlay + #wrapper #banner .slide{
		height: 540px;
	}
}


[data-rate]{
	background-position: right top;
	background-repeat: no-repeat;
	display: inline-block;
	line-height: 100%;
	max-width: 100%;
	padding-right: 28px;
	vertical-align: top;
}
[data-rate="1"]{
	background-image: url(../images/rating-1.png);
}
[data-rate="2"]{
	background-image: url(../images/rating-2.png);
}
[data-rate="2a"]{
	background-image: url(../images/rating-2a.png);
}
[data-rate="2b"]{
	background-image: url(../images/rating-2b.png);
}
[data-rate="3"]{
	background-image: url(../images/rating-3.png);
}

/*
* Seats
*/
/* .seat-wrap{
	height:800px;
} */
#seat-plan{
	position: relative;
  }
  #zoom{
	position:absolute
  }
.seat {
	display: flex !important;
	flex-direction: column !important;
	justify-content: center !important;
	border-radius: 5px;
	position: absolute;
	text-align: center;
	font-size: 18px;
  }
  
  .seat.void {
	border: 0;
	color: white;
  }
  
  .seat.void.wc {
	background: url('./images/seat/wc.svg') no-repeat;
	background-size: cover;
  }
  
  .seat.void.entrance {
	background: url('./images/seat/entrance.svg') no-repeat;
	background-size: cover;
  }
  
  .seat.void.exit {
	background: url('./images/seat/exit.svg') no-repeat;
	background-size: cover;
  }
  
  .void.screen::before{
	background: url('./images/seat/scr.png') left center no-repeat;
	background-size: 100% 8px;
	content: "";
	display: block;
	height: 8px;
	width: 100%;
  }
  
  .void.screen.up::before{
	transform: rotate(180deg);
  }
  
  .void.screen.down::before{
	transform: rotate(0deg);
  }
  
  .void.screen{
	width: 70%;
	transform: translateX(20%);
	display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    border-radius: 5px;
    position: absolute;
    text-align: center;
    font-size: 18px;
  }
  
  .void.screen span{
	color: #00ff66;
	display: inline-block;
	font-size: 12px;
  }
  
  /*.seat.void.screen.up {
	background: url('./images/seat/screen-up.png') no-repeat;
	background-size: cover;
	padding-top: 0;
  }
  
  .seat.void.screen.down {
	background: url('./images/seat/screen-down.png') no-repeat;
	background-size: cover;
	padding-top: 0;
  }*/
  
  .seat.std, .legend .std {
	border: 1px solid #00ff66;
	/* background-color: #D5E8D4; */
	color: #fff;
  }
  
  .seat.std.picked {
	background-color: #00FF66;
	color: #D5E8D4;
  }
  
  /* .seat.std.selected-socket {
	border: 1px solid #999;
	color: #999;
	background-color: #999;
  }
  
  .seat.std.kid, .legend .std.kid {
	border-color: #FF0000;
	background-color: #D5E8D4;
	color: #FF0000;
  }
  
  .seat.std.kid.picked {
	background-color: #FF0000;
	color: #D5E8D4;
  }
  
  .seat.std.kid.selected-socket {
	border: 1px solid #999;
	color: #999;
	background-color: #999;
  }
  
  .seat.std.lounger, .legend .std.lounger {
	border-color: #BD7000;
	background-color: #F0A30A;
	color: #CC6600;
  }
  
  .seat.std.lounger.picked {
	background-color: #CC6600;
	color: #F0A30A;
  }
  
  .seat.std.lounger.selected-socket {
	border: 1px solid #999;
	color: #999;
	background-color: #999;
  } */
  /*
  .seat.std.recliner {
	border-color: #0000FF;
	background-color: #A9C4EB;
	color: #0000FF;
  }
  
  
  .seat.std.recliner.selected {
	background-color: #0000FF;
	color: #A9C4EB;
  }
  
  .seat.std.recliner.selected-socket {
	border: 1px solid #999;
	color: #999;
	background-color: #999;
  }
  */
  
  /* .seat.std.guest, .legend .std.guest {
	background-color: #4B4B4B;
  }
  
  .seat.std.guest.picked {
	background-color: #0BA08E;
  }
  
  .seat.std.guest.selected-socket {
	border: 1px solid #999;
	color: #999;
	background-color: #999;
  }
  
  .seat.std.vacant, .legend .std.vacant {
	background-color: #A0A0A0;
  }
  
  .seat.std.vacant.picked {
	background-color: #0BA08E;
  }
  
  .seat.std.vacant.selected-socket {
	border: 1px solid #999;
	color: #999;
	background-color: #999;
  } */
  
  /* .seat.twin, .legend .twin {
	border: 1px solid #0000FF;
	color: #0000FF;
	background-color: #A9C4EB;
  }
  
  .seat.twin.left {
	border-radius: 5px 0 0 5px;
  }
  
  .seat.twin.left.picked {
	color: #A9C4EB;
	background-color: #0000FF;
  }
  
  .seat.twin.right {
	border-radius: 0 5px 5px 0;
  }
  
  .seat.twin.right.picked {
	color: #A9C4EB;
	background-color: #0000FF;
  }
  
  .seat.twin.selected-socket {
	border: 1px solid #999;
	color: #999;
	background-color: #999;
  } */
  
  .seat.wheel, .legend .wheel {
	border: 1px solid white;
	background: url('./images/seat/wheel_black.svg') no-repeat;
	background-size: 20px;
	background-color: white;
	background-position: center;
  }
  
  .seat.wheel.picked {
	background: url('./images/seat/wheel.svg') no-repeat;
	background-size: 20px;
	background-color: black;
	background-position: center;
  }
  
  .seat.std.vacant.selected-socket {
	border: 1px solid #999;
	color: #999;
	background-color: #999;
  }
  
  .seat.booked, .legend .booked {
	border: 1px solid #E70001;
	color: #E70001;
	background-size: cover;
	/* background-color: #647687; */
  }
  
  .seat.reserved, .legend .reserved {
	border: 1px solid #E70001;
	color: #E70001;
	/* background-color: #647687; */
  }
  
  .seat.reserved.picked {
	color: #647687;
	background-color: white;
  }
  
  .seat.held, .legend .held {
	background-color: #444;
    border-color: #444;
    color: #999;
  }
  
  .seat.noavail, .legend .noavail {
	border: 1px solid #E70001;
	color: #E70001;
	/* background-color: #4D4D4D; */
	background-size: cover;
  }
  
  .seat.maintenance, .legend .maintenance {
	border: 1px solid white;
	background: url('./images/seat/maintenance.svg') no-repeat;
	background-size: 20px;
	background-color: #4D4D4D;
	background-position: center;
  }

@media (max-width: 400px) {
    #seat-plan .inner {
        /* overflow: auto; */
        left: 15px !important;
    }
	.fitted #seat-plan {
		overflow: auto;
	}
	.seat {
        overflow: auto;
	}
}
  
  /*
  * Seat Plan
  */