@charset "utf-8";

@media screen and (max-width: 1300px) { /*최대사이즈 제외*/
	.btn-menu {display:block;}
}

@media screen and (max-width: 768px) { /* 모바일 해상도 시작 */
	.layout {width:100%; box-sizing:border-box;}
	.header .logo a {width:117px; height:50px; background-size:100%;}
	.footer,
	.footer .layout {height:140px;}
	.footer .btn-payment {position:static; margin-top:10px;}

	.m-hide {display:none !important;}
	.title-page {font-size:24px; letter-spacing:-1px;}
	.page-desc {margin-top:10px; letter-spacing:0; font-size:14px;}

	.tab {height:25px; margin-bottom:20px; white-space:nowrap;}
	.tab a {width:80px; height:25px; line-height:25px; padding:0 10px; font-size:12px; text-align:center; border-radius:20px;}


	/* GNB */
	.gnb-menu {}
	.gnb-menu:before {top:44px; height:90px;}
	.gnb-menu a {font-size:14px;}
	.gnb-menu .depth-1 > li > a {height:43px;}
	.gnb-menu .depth-1 > li > a:hover,
	.gnb-menu .depth-1 > li > a.active {border-bottom:2px solid #3290bf;}
	.gnb-menu .depth-2 {top:43px;}
	.gnb-menu .depth-2 a {padding-top:5px; line-height:2; font-size:11px;}
	.gnb-menu.active .depth-2,
	.gnb-menu.active:before {display:none;}

	/* Side Bar */
	.sidebar {display:block; position:absolute; top:0; right:0; bottom:0; left:0; z-index:200; text-align:left;
		-webkit-transition: -webkit-transform .3s ease-in; transition:transform .3s ease-in;
		pointer-events:none;
	}
	.sidebar:before {content:''; opacity:0; background-color:rgba(0,0,0,.6); position:fixed; left:0; top:0; right:0; bottom:0; z-index:100;
		 -webkit-transition:opacity .3s ease-in .1s; transition:opacity .3s ease-in .1s;
		pointer-events:none;}
	.sidebar .sidebar-layout {width:80%; position:fixed; top:0; right:0; bottom:0; z-index:200; padding-bottom:70px; background-color:#fff;}

	.sidebar .btn-sidebar {height:14px; width:20px; position: absolute; top:-2px; right: 70px; margin-top: -7px; margin-right:-60px; cursor: pointer; z-index: 1;pointer-events:all;}
	.sidebar .btn-sidebar span {background-color:#424b52;}
	.sidebar .btn-sidebar span:first-child {top:0;}
	.sidebar .btn-sidebar span:last-child {top: calc(100% - 2px);}

	.sidebar .sidebar-header {height:50px; padding-top:15px; padding-left:15px; background-color:#3290bf; box-sizing:border-box;}
	.sidebar .sidebar-logo {display:inline-block; width:116px; height:19px; background:url('../images/common/sidebar_logo.png') 0 0 no-repeat; vertical-align:top; background-size:116px auto; font:0/0 a;}
	.sidebar .btn-close {display:none; position:absolute; right:3px; top:4px; width:40px; height:40px;}

	.sidebar .btn-sidebar {height:18px; width: 24px; position: absolute; top: 21px; right:70px; margin-top: -7px; margin-right:-60px; cursor: pointer; z-index:201; pointer-events:all;}
	.sidebar .btn-sidebar span:first-child {top:0;}
	.sidebar .btn-sidebar span:last-child {top: calc(100% - 2px);}

	.sidebar .side-menu {display:block; position:relative; background-color:#fff;}
	.sidebar .side-menu .title-sub {height:32px; line-height:32px; padding-left:15px; background-color:#eee; font-size:15px;}
	.sidebar .side-menu a {display:block; height:32px; line-height:32px; padding-left: 15px; border-top:1px solid #cdcdcd; font-size:13px; color:#888;}
	.sidebar .side-menu li:first-child a {border-top:none;}
	.sidebar .side-menu a:active {color:#3290bf;}

	.sidebar .side-footer {position:absolute; left:0; bottom:0; right:0; height:70px; padding-top:15px; background-color:#424b52; text-align:center; font-size:12px; color:#fff; box-sizing:border-box;}
	.sidebar .side-footer a {line-height:1.5; font-size:15px; font-weight:bold; color:#fff; border-top:none;}

	.sidebar.is-open {display:block; bottom:0; -webkit-transition:opacity 1s ease-in; transition: opacity 1s ease-in; pointer-events:all;}
	.sidebar.is-open:before {opacity:1; pointer-events:all;}
	.sidebar.is-open .btn-sidebar {pointer-events:none;}
	.sidebar.is-open .btn-close {display:block; z-index:202; pointer-events:all;}

	.sidebar .sidebar-layout {
		opacity:1;
		pointer-events:none;
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
		-webkit-transition: -webkit-transform .5s ease;
		transition:transform .5s ease;
	}
	.sidebar.is-open .sidebar-layout {
		pointer-events:auto;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}

	/* Sidebar Animation */
	.sidebar .btn-sidebar {
		-webkit-animation: o .6s cubic-bezier(.645,.045,.355,1) .3s forwards;
		-moz-animation: o .6s cubic-bezier(.645,.045,.355,1) .3s forwards;
		animation: o .6s cubic-bezier(.645,.045,.355,1) .3s forwards;
	}
	.sidebar .btn-sidebar span {
		position: absolute;
		top: 8px;
		left: 0;
		width: 100%;
		height: 2px;
		-ms-transform-origin: center;
		transform-origin: center;
		-webkit-transition: all cubic-bezier(.25,.46,.45,.94) .2s,background-color linear .2s .2s,top cubic-bezier(.25,.46,.45,.94) .2s .2s,opacity linear 0s .2s;
		-moz-transition: all cubic-bezier(.25,.46,.45,.94) .2s,background-color linear .2s .2s,top cubic-bezier(.25,.46,.45,.94) .2s .2s,opacity linear 0s .2s;
		transition: all cubic-bezier(.25,.46,.45,.94) .2s,background-color linear .2s .2s,top cubic-bezier(.25,.46,.45,.94) .2s .2s,opacity linear 0s .2s;
	}
	.sidebar.is-open .btn-sidebar {
		-webkit-animation: o .6s cubic-bezier(.645,.045,.355,1) .3s forwards;
		-moz-animation: o .6s cubic-bezier(.645,.045,.355,1) .3s forwards;
		animation: o .6s cubic-bezier(.645,.045,.355,1) .3s forwards;
	}
	.sidebar.is-open .btn-sidebar span {
		background-color:#fff;
		-webkit-transition: all cubic-bezier(.25,.46,.45,.94) .2s .2s,background-color linear .2s,top cubic-bezier(.25,.46,.45,.94) .2s,opacity linear 0s .2s;
		-moz-transition: all cubic-bezier(.25,.46,.45,.94) .2s .2s,background-color linear .2s,top cubic-bezier(.25,.46,.45,.94) .2s,opacity linear 0s .2s;
		transition: all cubic-bezier(.25,.46,.45,.94) .2s .2s,background-color linear .2s,top cubic-bezier(.25,.46,.45,.94) .2s,opacity linear 0s .2s;
		top: 50%;
		opacity: 0;
	}
	.sidebar.is-open .btn-sidebar span:first-child {
		opacity: 1;
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	.sidebar.is-open .btn-sidebar span:last-child {
		opacity: 1;
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	/* main */
	.main-visual {height:auto; padding-top:78.1944%; background:url('../images/main/main_visual_mobile.jpg') 50% 0 no-repeat; background-size:cover;}
	.best-item .item-list {padding:3%; margin-left:-3%;}
	.best-item .item-list li {width:50%; padding-left:3%; padding-bottom:3%;}

	/* contact us */
	.contact .contents {padding:30px 10px 0;}
	.contact .map {margin-top:20px; padding-top:67.5%; background-image:url('../images/contents/map_m.png');}
	.contact .address {width:300px; margin-top:20px;}
	.contact .address dl dt,
	.contact .address dl dd {letter-spacing:0; font-size:14px;}
	.contact .address dl dt {width:50px;}

	/* contents */
	.container.business .contents {padding-top:30px;}
	.business .business-item {padding:0 40px;}
	.business .business-item li {display:block; width:100%; padding-top:76%; margin-top:30px;}
	.business .business-item .cine-hotel {background-image:url('../images/contents/contents_cinehotel_m.jpg');}
	.business .business-item .wow-cine {background-image:url('../images/contents/contents_wowcine_m.jpg');}

	/* intro */
	.container.intro .contents {padding-top:20px;}
	.intro-items {width:100%; margin-top:0;}
	.intro-items .item {width:100%; margin-left:0; margin-top:40px; padding:0 40px; box-sizing:border-box;}
	.intro-items .item:before {width:130px; height:130px; background-size:400px auto;}
	.intro-items .item dt {margin-top:15px; font-size:16px; letter-spacing:0; font-weight:bold;}
	.intro-items .item dd {margin-top:5px; font-size:14px; letter-spacing:0;}
	.intro-items .item-1:before {background-position:0 0;}
	.intro-items .item-2:before {background-position:-135px 0;}
	.intro-items .item-3:before {background-position:-270px 0;}

	/* history */
	.container.history .contents {padding:20px 0 30px;}
	.history-list {width:auto; max-width:350px; margin:20px auto 0; padding-left:100px; padding-top:137%; background:url('../images/contents/history_year_m.png') 50% 0 no-repeat; background-size:100%;}
	.history-list ul {display:none;}
	.history-list ul li {font-size:11px;}
	.history-list .bullet li:before {top:6px;}

	.history-item {padding: 0 20px;}
	.history-item img {width: 100%;}

	/* products */
	.products .contents {padding-top:20px;}
	.products .tab {overflow-x:auto;}
	.products .tab a {width:auto; font-size:11px;}
	.product {margin-top:20px; margin-bottom:35px; background-color:#fff;}
	.product .title {height:35px; line-height:35px; font-size:15px;}
	.product .row {padding:20px 20px 0;}
	.product .thumb {float:none; width:100%; height:250px; border:1px solid #c9c9c9; box-sizing:border-box; background-color:#fff; text-align:center;}
	.product .info {float:none; width:100%; height:auto; margin-top:10px; padding-left:0; box-sizing:border-box;}
	.product .table {height:100%;}
	.product .table thead th {height:23px; padding:5px; font-size:15px;}
	.product .table tbody th,
	.product .table tbody td {height:23px; padding:5px; font-size:14px;}

	.product .detail {margin-top:10px; padding:0 20px 20px;}
	.product .detail dt {position:static; display:block; width:100%; height:30px; margin-bottom:10px; line-height:30px; font-size:12px;}
	.product .detail dd {margin-top:5px; padding-left:10px; font-size:12px;}
	.product .detail dd:before {left:0; top:5px; width:3px; height:3px;}

}


@media screen and (max-width: 425px) { /* 모바일 사이즈 */
	.container {padding-bottom:150px;}

	.footer .footer-content {padding-top:16px;}
	.footer .info {max-width:auto;}
	.footer .info li {font-size:10px;}
	.footer .info i {margin:0 8px;}
	.footer .copy {font-size:8px; margin-top:5px;}

	.best-item {margin-top:20px;}
	.best-item .title {width:107px; height:25px; line-height:25px; font-size:14px;}
	.best-item .item-list {margin-top:20px;}

	/* history */
	.history-list {}
	.history-list ul {display:none;}
}

@media screen and (max-width: 320px) { /* 모바일 최소 해상도 */

}