﻿@charset "UTF-8";

/* S 비회원 로그인 관련 임시 업데이트 소스 : 추후 회원서비스 전체 적용시 ui.style.css 호출하게 되면 삭제 */
@import "iCheck.css";

.btn_optbox {
	display:relative;
	padding: 12px 11px;
}
.btn_optbox:after {
	display:block;
	content:'';
	clear:both;
}
.btn_optbox .lbox {
	float:left;
}
.btn_optbox .rbox {
	float:right;
}
.line_btn_round {
    display: inline-block;
	padding:0 10px;
    min-width: 70px;
    height: 28px;
    line-height: 27px;
    font-size:12px;
    text-align: center;
    color: #373e46;
    letter-spacing: -0.4px;
    border: 1px solid #9197a3;
    border-radius: 24px;
	background:transparent;
}

.btn_optbox .lbox .agree{padding:4px 0 0;}
.line_btn_round.disabled {color:#dddfe2; border-color:#dddfe2; pointer-events: none; cursor:default;}

/* E 비회원 로그인 관련 임시 업데이트 소스 */

/* S COMMON */
    .sprite,
    .spriteBefore,
    .spriteAfter,
    .spriteFooter{font-size:0; background-attachment:scroll; background-color:transparent; background-repeat:no-repeat}
    .fogbg{position:fixed; left:0; top:0; width:100%; height:100%; opacity:.5; background-color:#000}    
    .spinner.dim:before{content:''; position:fixed; left:0; top:0; width:100%; height:100%; background-color:#000; opacity:0.3}
    .allview_box_wrap *{letter-spacing:-0.5px; box-sizing:content-box; line-height:100%}    

    /* S > Footer */
        footer{background-color:#f2f2f2}
            .footerLink{overflow:hidden; border-top:1px solid #e4e4e4}
            .footerLink a{float:left; width:25%; padding:25px 0; font-size:12px; color:#9197a3; text-align:center}
            .footerLink a span{display:block; border-left:1px solid #bdc1c8;color:#9197a3}
            .footerLink a:first-child span{border-left-width:0}
            
            .footerContents{overflow:hidden; position:relative; padding:0 25px; background-color:#e1e2e4}
            .footerContents h1{position:absolute}
            .footerContents .footerContentsLink{overflow:hidden; float:right}
            .footerContents .footerContentsLink li{float:left; padding:20px 0}
            .footerContents .footerContentsLink li a{font-weight:normal; font-size:11px; color:#4b4f56; vertical-align:middle}
            .footerContents .footerContentsLink li:nth-child(2) a{font-weight:700; font-size:11px}
            .footerContents .footerContentsLink li:before{content:'ㆍ'}
            .footerContents .footerContentsLink li:first-child:before{content:''}
                .footerLogo{display:block; width:50px; height:22px; margin:16px auto 0; background-position:-77px top}
                .companyInfo{clear:both; overflow:hidden; padding:16px 0; font-size:11px; color:#9197a3; border-top:1px solid #bfc6cf}
                .companyInfo dt,
                .companyInfo dd{float:left; margin-top:5px; line-height:1.5em}
                .companyInfo dt{width:39%}
                .companyInfo dd{width:61%}
                .companyInfo dd address{line-height:1.5em}
                .companyInfo dt:first-child,
                .companyInfo dt:first-child + dd{margin-top:0}

            .footerReserved{width:100%; padding-top:25px; padding-bottom:70px; font-size:10px; color:#9197a3; text-align:center; background-color:#e1e2e4}
    /* E > Footer */

    /* S > Nav */
        nav{overflow:hidden; width:100%; background-color:#fff; z-index:3}
		nav a {position:relative; z-index:2;}
        nav a,
        nav a:link,
        nav a:visited{float:left; width:25%; height:44px; font-weight:700; font-size:16px; color:#9197a3; line-height:44px; text-align:center; vertical-align:middle}
        nav a.active{color:#000; border-bottom:2px solid #000}
		
		/* 메뉴 5개짜리 슬라이딩 기능 추가 */
		nav.type5 {overflow:auto; -webkit-overflow-scrolling:touch; z-index:1;}
		nav.type5 .inner {overflow:hidden; position:relative; width:110%;}
        nav.type5 a,
        nav.type5 a:link,
        nav.type5 a:visited{width:20%;}
    /* E > Nav */

    /* S > Popup */
        .popLayer{position:fixed; left:0; top:100%; z-index:101; /*background-color:#000;*/ width:100%; height:300px; z-index:9}        
        .popFogBg{display:none; position:fixed; left:0; top:0; width:100%; height:100%; background-color:#000; opacity:.5}

		/* S > VIP선정 포인트 팝업 */
		.popVIPPointWrap{display:none; overflow:auto; position:fixed; left:0; top:0; width:100%; height:100%; text-align:center; background-color:#fff; z-index:9}
		.popVIPPointWrap .popLayerHeader{overflow:hidden; position:fixed; left:0; top:0; width:100%; height:45px; padding:0 45px; text-align:inherit; font-weight:bold; font-size:1.20em; color:#000; letter-spacing:-0.5px; line-height:45px; text-overflow:ellipsis; white-space:nowrap; background-color:#fff; border-bottom:1px solid #f2f2f2; z-index:9}
		.popVIPPointWrap .popLayerHeader .btnPopClose{right:auto; left:0; top:1px; width:42px; height:42px; padding:2px; background-position:-71px -79px}
		.popVIPPointWrap .popLayerContainer{overflow:auto; padding:0; width:100%; height:100%; -webkit-overflow-scrolling:touch}
		.popVIPPointWrap .popLayerContainer ul{padding:150% 11px 20px; z-index:8; background-color:#fff}
		.popVIPPointWrap .popLayerContainer li{padding:20px 0; text-align:left}
		.popVIPPointWrap .popLayerContainer li dt{display:block; position:relative; margin-top:20px; margin-bottom:5px; padding-left:7px; font-weight:700; font-size:14px; letter-spacing:-0.5px}
		.popVIPPointWrap .popLayerContainer li dt:first-child{margin-top:0}
		.popVIPPointWrap .popLayerContainer li dt:before{content:''; position:absolute; left:0; top:5px; width:4px; height:4px; background-color:#333; border-radius:2px}
		.popVIPPointWrap .popLayerContainer li dd{padding-left:7px; font-weight:400; font-size:12px; letter-spacing:-0.5px; line-height:1.4em}
		.popVIPPointWrap .popLayerContainer li:first-child{border-bottom:1px solid #f4f3ef}
		.popVIPPointWrap .popLayerContainer li:first-child dt{padding-left:0}        
		.popVIPPointWrap .popLayerContainer li:first-child dt:before{content:none}
		.popVIPPointWrap .popLayerContainer li:first-child dd{padding-left:0}
		.popVIPPointWrap .popLayerContainer li p{margin-top:20px; font-weight:400; font-size:12px; line-height:1.4em}
		/* E > VIP선정 포인트 팝업 */

		/* S 결제기반 팝업 스타일 : ui.page.css 미호출 페이지에서 사용 180911 */
		.payment_popup_st {background-color:#f2f2f2 !important; height:100%;}
		.payment_popup_st .popup_header {position: relative; height: 44px; line-height: 44px; background:#fff;}
		.payment_popup_st .popup_header .closebtn {display: inline-block; position: absolute; left: 12px; top: 12px;}
		.payment_popup_st .icon_popup_close_red {
			display: inline-block;
			width: 22px; height: 22px; 
			font-size: 0; line-height:0; color: transparent; vertical-align: top;
			border: 0; 
			background: url('../../images/payment/sprite_common.png') no-repeat 0 -25px;
			-webkit-background-size: 250px 250px; 
			background-size: 250px 250px;
		}
		.payment_popup_st .popup_header h1 {padding-left: 48px; font-size: 17px; line-height: 45px; color: #030303;}
		.payment_popup_st .section_top {padding:0 26px 12px; background: #fff; border-bottom: 1px solid #d8d8d8;}
		.payment_popup_st .section_top .area_input:first-child {margin-top:0 !important; padding-top:10px;}
		
		.payment_popup_st .area_input > div {position: relative; font-size: 10px;}
		.payment_popup_st .area_input > div + div {margin-top: 10px;}
		
		.payment_popup_st .area_input input[type="text"],
		.payment_popup_st .area_input input[type="password"],
		.payment_popup_st .area_input input[type="email"],
		.payment_popup_st .area_input input[type="tel"]{display: block; width: 100%; height: 40px; font-size: 19px; text-indent: 0; border-left: 0; border-top: 0; border-right: 0; border-bottom: 1px solid rgba(221,223,226,1); border-radius:0;}
		.payment_popup_st .area_input .area_radiobox {padding: 10px 0 15px; text-align: left; border-bottom: 1px solid rgba(221,223,226,1); overflow: hidden;}
		.payment_popup_st .area_input .area_radiobox > div {float: left; width: 50%;}
		.payment_popup_st .area_input .area_radiobox label {font-size: 19px;}
		.payment_popup_st .area_input .area_radiobox label span {width: 10px; height: 10px; margin: 5px 7px 0 0;}
		.payment_popup_st .area_input input + input {margin-top: 11px;}

		.payment_popup_st .icon_circle_delete {width: 14px; height: 14px; vertical-align: top; background: url('../../images/payment/sprite_common.png') no-repeat -175px 0; -webkit-background-size: 250px 250px; background-size: 250px 250px;}

		.payment_popup_st .section_top .more_infobox {margin:15px 0 12px; text-align:left;}
		.payment_popup_st .section_top .alink_more {position:relative; padding-left:17px; font-size:12px; color:#9197a3;}
		.payment_popup_st .section_top .alink_more:before {display:inline-block; content:''; position:absolute; left:0; top:1px; width:12px; height:12px; background:url('../../images/common/ico_i2.png') no-repeat 0 0; background-size:12px;}

		.payment_popup_st .btn_check {margin-top: 12px; text-align: center;}
		.payment_popup_st .btn-square {display: inline-block; text-align: center; vertical-align: top; min-width: 68px; width: 142px; height: 36px; line-height: 35px; font-size: 14px; color: rgba(34,34,34,1); border: 1px solid rgba(145,151,163,1); border-radius: 2px; background: transparent;}
		/* E 결제기반 팝업 스타일 : ui.page.css 미호출 페이지에서 사용 180911 */
		
		/* S 이용안내 팝업 */
		.info_pop_howtouse .inner {padding:30px; height:calc(100% - 24%); text-align:center;}
		.info_pop_howtouse .inner .tit {margin-bottom:20px; font-size:17px; color:#000; line-height:1.4;}
		.info_pop_howtouse .inner .img {margin:0 auto; max-width:240px;}
		.info_pop_howtouse .inner .img > img {width:100%; display:block;}
		.info_pop_howtouse .inner .img + .area_contents {margin-top:20px;}
		
		.info_pop_howtouse .area_scroll {margin-right:-30px; padding-right:30px; height:100%; overflow-x:hidden; overflow-y:auto; /* -webkit-overflow-scrolling:touch; */}

		.info_pop_howtouse .area_scroll::-webkit-scrollbar {-webkit-appearance:none;}
		.info_pop_howtouse .area_scroll::-webkit-scrollbar:vertical {width:3px;}
		.info_pop_howtouse .area_scroll::-webkit-scrollbar-thumb {background-color:rgba(0,0,0,.3); border-radius:8px;}

		.info_pop_howtouse .area_contents {text-align: left;}
		.info_pop_howtouse .area_contents ol li {position: relative; padding-left:15px; font-size: 14px; line-height: 20px; color: #222;}
		.info_pop_howtouse .area_contents ol li + li {margin-top: 5px;}
		.info_pop_howtouse .area_contents ol li span {display: inline-block; position: absolute; left: 0; top: 4px;}
		.info_pop_howtouse .area_contents ol li em {font-style:normal; color: #4a90e2;}
		.info_pop_howtouse .area_contents .has_img li {padding-left:0; margin-top:20px;}
		.info_pop_howtouse .area_contents .has_img li:first-child {margin-top:0;}
		.info_pop_howtouse .area_contents .has_img li .img {margin-bottom:15px;}
		.info_pop_howtouse .area_contents .has_img li .txt {position:relative; padding-left:15px; line-height: 20px;}
		.info_pop_howtouse .area_contents .list_dot {position:relative; margin-top:15px; padding-top:15px;}
		.info_pop_howtouse .area_contents .list_dot:before {position:absolute; left:0; right:-30px; top:0; display:block; content:''; border-top:1px solid #9197a3;}
		.info_pop_howtouse .area_contents .list_dot:first-child {margin-top:0;}
		.info_pop_howtouse .area_contents .list_dot li {position: relative; padding-left: 9px; font-size: 12px; line-height: 1.8; color: #8d97a3; text-align:left;}
		.info_pop_howtouse .area_contents .list_dot li:before {position: absolute; left: 0; top: 8px; display: block; width: 4px; height: 4px; border-radius: 100%; background: #8d97a3; content: '';}
		.info_pop_howtouse .area_contents .list_dot li + li {margin-top:10px;}
		/* E 이용안내 팝업 */

		/* 스프라이트 */
		.sprite_common {
			display: inline-block;
			vertical-align: middle;
			color: transparent;
			border: 0;
			background: none;
			font-size: 0;
			line-height: 0;
			background: url("../../images/payment/sprite_common.png") no-repeat 0 0;
			-webkit-background-size: 250px 250px;
			background-size: 250px 250px;
		}

		/* input 삭제 x버튼 */
		.area_input > div a,
		.area_input .btn_delete {
			display:block;
			padding:5px;
			position: absolute;
			right: -5px;
			top: 50%;
			margin-top: -12px;
			opacity: 0;
		}
		.area_input input:focus + a,
		.area_input input:focus + .btn_delete {opacity: 1;}

    /* E > Popup */

	/* 관람 등급 아이콘 */
	.ico_grade {display:inline-block; overflow:hidden; width:18px; height:18px; vertical-align:middle;}
	.ico_grade img {display:block; width:100%;}

	/* 엣지쿠폰 */
	.edge_coupon_area {position:relative; border-top:1px solid #dcdee3;}
	.edge_coupon_area > div {display:block; padding:0 11px; height:44px;}
	.edge_coupon_area > div .tit {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; margin-right:62px; font-size:12px; line-height:44px; color:#fb4357;}
	.edge_coupon_area > div .btn_down {position:absolute; top:50%; right:11px; margin-top:-12px; display:inline-block; padding:6px 5px 7px; font-size:11px; color:#fff; text-align:center; border-radius:3px; background-color:#fb4357;}


/* E COMMON */

@media only screen and (-webkit-min-device-pixel-ratio:1){
    .spriteFooter{content:''; background-image:url('./../../images/main/common/sprite@1x.png'); background-size:200px 200px}    
	.popVIPPointWrap .popLayerHeader .btnPopClose{background-image:url(./../../images/main/common/sprite@1x.png)}
}
@media only screen and (-webkit-min-device-pixel-ratio:2){
    .spriteFooter{content:''; background-image:url('./../../images/main/common/sprite@2x.png'); background-size:200px 200px}    
	.popVIPPointWrap .popLayerHeader .btnPopClose{background-image:url(./../../images/main/common/sprite@2x.png)}
}
@media only screen and (-webkit-min-device-pixel-ratio:3){
    .spriteFooter{content:''; background-image:url('./../../images/main/common/sprite@3x.png'); background-size:200px 200px}    
	.popVIPPointWrap .popLayerHeader .btnPopClose{background-image:url(./../../images/main/common/sprite@3x.png)}
}