@charset "utf-8";
/*------------------------------------------------------------------------------
 * Front for Main Front Page

 * CSS    : front.css
 * Date   : 2016.11.04 updated
------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------
 *  Main page
------------------------------------------------------------------------------*/
.content_btm_rent {display:none;}


/* Middle Area
------------------------------------------------------------------------------*/
/* 메인 비주얼 슬라이드 */
.ms-slide {background-size:200% !important;}
.ms-slide .slide_text {position:absolute; top:50%; left:0%; width:100%; transform:translate(0%, -50%); margin:0px auto; padding:0px; text-align:center;}
.ms-slide .slide_text p.txt_large {display:inline-block; width:100%; margin:0 0 10px 0; color:#FFFFFF; font-size:36px; font-weight:400; letter-spacing:-2px; line-height:100%;}
.ms-slide .slide_text p.txt_medium {margin:0 0 10px 0px; color:#FFFFFF; font-size:18px; font-weight:100; letter-spacing:-1px; line-height:100%;}
.ms-slide .slide_text p.txt_small {margin:0 0 10px 0px; color:#FFFFFF; font-size:14px; font-weight:100; letter-spacing:-0.5px; line-height:100%;}
.ms-slide .slide_text a.link {display:inline-block; margin:10px 0 0px 0px; padding:10px 20px 10px 20px; background:transparent; border:1px solid #DDDDDD; color:#FFFFFF; font-size:12px; font-weight:400; letter-spacing:-1px; line-height:100%;}
.ms-slide .slide_text a.link:hover {background:#FFFFFF; border:1px solid #FFFFFF; color:#000000;}

/* 공연안내 */
.section_show {position:relative; width:100%; margin:20px auto 20px auto; padding:0px 0 0 0; background:url('/ko/common/img/bg/bg_section_m_show.png') center 40px no-repeat; background-size:90%;}
.section_show > .title {display:block; margin:0px 20px 0px 20px; padding:40px 0 0px 0; color:#FFFFFF; font-size:32px; font-weight:400; letter-spacing:-2px; text-align:center;}
.section_show > .title_desc {display:block; margin:0px 20px 0px 20px; padding:10px 0 20px 0; color:#e5e5e5; font-size:14px; font-weight:400; text-align:center;}
.section_show .shows {width:100%;}
.section_show .shows a.poster {display:block; position:relative; width:auto; height:auto; margin:10px 10px 0 10px; padding:0px; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
.section_show .shows a.poster:hover {margin:3px 0 0 0;}
.section_show .shows a.poster > img {width:100%; max-width:100%; margin:0 0 0 0; box-shadow:3px 3px 4px #555555;}
.section_show .shows a.title  {display:block; width:auto; padding:5px 0px 0px 0px; color:#FFFFFF; font-family:'Noto Sans KR', sans-serif; font-size:18px; line-height:150%; text-align:center;}
.section_show .shows a.title:hover {color:#D03849;}
.section_show .shows a.datetime  {display:block; width:auto; padding:15px 0px 0px 0px; color:#CCCCCC; font-size:14px; text-align:center;}
.section_show .shows a.title > strong {display:inline-block; margin:0 5px 0 0; padding:0 5px; background:rgba(255,255,255,0.75); border-radius:3px; color:#7f7f7f; font-size:11px; line-height:20px; vertical-align:3px;}
/* .section_show .btnShow_more {z-index:999; position:relative; display:block; width:160px; height:auto; margin:0px auto 40px auto; padding:10px 0px 10px 0px; color:#DDDDDD; font-size:15px; font-weight:400; background-color:transparent; border-top:1px solid #CCCCCC; border-right:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; border-left:1px solid #CCCCCC; text-align:center; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;} */
.section_show .btnShow_more_wrap {margin-bottom: 60px;}
.section_show .btnShow_more_wrap .btnShow_more {z-index:999; position:relative; display:block; width:160px; height:auto; margin:0px auto 15px auto; padding:10px 0px 10px 0px; color:#DDDDDD; font-size:15px; font-weight:400; background-color:transparent; border-top:1px solid #CCCCCC; border-right:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; border-left:1px solid #CCCCCC; text-align:center; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
/* .section_show .btnShow_more:hover {background:#CCCCCC; color:#333333;} */
.section_show .ms-nav-next, .section_show .ms-nav-prev {top:40% !important;}

/* 공연장안내 */
.section_theater {position:relative; width:100%; margin:20px auto 20px auto; padding:0px 0 0 0; background:url('/ko/common/img/bg/bg_section_m_stage.png') center 30px no-repeat; background-size:60%;}
.section_theater > .title {display:block; margin:0px 20px 0px 20px; padding:40px 0 0px 0; color:#555555; font-size:32px; font-weight:400; letter-spacing:-2px; text-align:center;}
.section_theater > .title_desc {display:block; margin:0px 20px 0px 20px; padding:10px 0 10px 0; color:#5B5B5B; font-size:14px; font-weight:400; text-align:center;}
.section_theater .stages {position:relative; width:100%; text-align:center;}
.section_theater .stages:after {clear:both; content:''; display:block;}
.section_theater .stages ul {list-style:none; width:auto; margin:0px 40px 40px 40px;}
.section_theater .stages ul:after {clear:both; content:''; display:block;}
.section_theater .stages ul li {float:none; position:relative; width:auto; height:auto; margin:20px auto 0 auto; box-shadow:2px 2px 4px #666666; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
.section_theater .stages ul li:last-child {margin:20px auto 0 auto;}
.section_theater .stages ul li:hover {margin-top:3px; border:0px solid #555555;}
.section_theater .stages ul li a {display:block; width:100%; height:100%; margin:0px; padding:0px;}
.section_theater .stages ul li a.stage01 {background:url('/ko/common/img/bg/bg_stage_link_01.jpg') center center no-repeat;}
.section_theater .stages ul li a.stage02 {background:url('/ko/common/img/bg/bg_stage_link_02.jpg') center center no-repeat;}
.section_theater .stages ul li a.stage03 {background:url('/ko/common/img/bg/bg_stage_link_03.jpg') center center no-repeat;}
.section_theater .stages ul li a .link_seat {display:block; position:absolute; top:20px; left:auto; right:auto; width:100%; margin:0px auto 0 auto; padding:0px 0 0 0; color:rgba(255,255,255,0.2); font-size:172px; font-weight:700; letter-spacing:-10px; line-height:100%; text-align:center;}
.section_theater .stages ul li a .link_no {display:block; margin:0px auto 0 auto; padding:190px 0 0 0; color:#CCCCCC; font-size:28px; font-weight:400;}
.section_theater .stages ul li a .link_desc {display:block; margin:0px auto; padding:20px 20px 0 20px; color:#CCCCCC; font-size:18px; font-weight:400;}
.section_theater .stages ul li a .link_desc > span {white-space:nowrap;}
.section_theater .stages ul li a .link {display:inline-block; margin:30px auto 30px auto; padding:10px 15px; border:1px solid #7f7f7f; color:#AAAAAA; font-size:15px; font-weight:400; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
.section_theater .stages ul li:hover > a > .link {background:rgba(0,0,0,0.8); border:1px solid #000000; color:#EBEBEB; font-size:14px; font-weight:400;}
.section_theater .btnStage_more {z-index:999; position:relative; display:table; width:auto; height:30px; margin:20px auto 40px auto; padding:15px 20px 15px 20px; color:#000000; font-size:21px; font-weight:200; background:transparent; border-top:1px solid #7f7f7f; border-right:1px solid #7f7f7f; border-bottom:1px solid #7f7f7f; border-left:1px solid #7f7f7f; text-align:center; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
.section_theater .btnStage_more:hover {background:#7f7f7f; color:#FFFFFF;}

/* 인스타그램 */
.section_instagram {position:relative; width:100%; margin:20px auto 20px auto; padding:0px 0 0 0;}
.section_instagram > .title {display:block; margin:0px auto 0px auto; padding:40px 0 0px 0; color:#CCCCCC; font-size:32px; font-weight:100; letter-spacing:-2px; text-align:center;}
.section_instagram > .title_desc {display:block; margin:0px auto 0px auto; padding:0px 0 20px 0; color:#CCCCCC; font-size:14px; font-weight:200; text-align:center;}
.section_instagram .instagram {position:relative; width:100%; text-align:center;}
.section_instagram .instagram:after {clear:both; content:''; display:block;}
.section_instagram .instagram ul {list-style:none; width:auto; margin:0px auto 0 auto; text-align:center;}
.section_instagram .instagram ul:after {clear:both; content:''; display:block;}
.section_instagram .instagram ul li {float:none; display:inline-block; position:relative; width:150px; height:150px; margin:0px 6px 12px 6px; overflow:hidden; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
.section_instagram .instagram ul li:last-child {margin:0px 6px 12px 6px;}
.section_instagram .instagram ul li a {display:block; position:relative; width:150px; height:150px; margin:0px; padding:0px;}
.section_instagram .instagram ul li a img {z-index:1; opacity:0.5; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
.section_instagram .instagram ul li a:hover img {z-index:1; opacity:1;}
.section_instagram .instagram ul li a p.caption {z-index:9999; display:block; float:left; position:absolute; top:150px; left:0px; right:0px; bottom:0px; width:130px; height:130px; margin:0px; padding:10px; overflow:hidden; background:rgba(208,56,73,0); color:#FFFFFF; font-size:11px; font-weight:400; letter-spacing:0px; line-height:120%; text-align:left; white-space:normal; word-break:break-all; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
.section_instagram .instagram ul li a:hover p.caption {top:0px; background:rgba(208,56,73,0.8);}
.section_instagram .btnInsta_more {z-index:999; position:relative; display:table; width:auto; height:30px; margin:20px auto 40px auto; padding:15px 20px 15px 20px; color:#CCCCCC; font-size:18px; font-weight:200; background:transparent; border-top:1px solid #7f7f7f; border-right:1px solid #7f7f7f; border-bottom:1px solid #7f7f7f; border-left:1px solid #7f7f7f; text-align:center; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
.section_instagram .btnInsta_more:hover {color:#FFFFFF; border:1px solid #8A2387;
	background: #8A2387;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #F27121, #E94057, #8A2387);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #F27121, #E94057, #8A2387); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

@media all and (min-width:768px) {
	/* 메인 비주얼 슬라이드 */
	.ms-slide {background-size:auto !important;}
	.ms-slide .slide_text {position:absolute; top:50%; left:0%; width:auto; transform:translate(0%, -50%); margin:0px 10%; padding:0px; text-align:left;}
	.ms-slide .slide_text p.txt_large {margin:0 0 20px 0; color:#FFFFFF; font-size:64px; font-weight:400; letter-spacing:-4px; line-height:100%;}
	.ms-slide .slide_text p.txt_medium {margin:0 0 20px 0; color:#FFFFFF; font-size:48px; font-weight:100; letter-spacing:-2px; line-height:100%;}
	.ms-slide .slide_text p.txt_small {margin:0 0 20px 5px; color:#FFFFFF; font-size:24px; font-weight:100; letter-spacing:-1px; line-height:100%;}
	.ms-slide .slide_text a.link {display:inline-block; margin:20px 0 0px 7px; padding:20px 20px 20px 20px; background:transparent; border:1px solid #DDDDDD; color:#FFFFFF; font-size:18px; font-weight:400; letter-spacing:-1px; line-height:100%;}
	.ms-slide .slide_text a.link:hover {background:#FFFFFF; border:1px solid #FFFFFF; color:#000000;}

	/* 공연안내 */
	.section_show {position:relative; width:100%; margin:80px auto 120px auto; padding:0px 0 0 0; background:url('/ko/common/img/bg/bg_section_m_show.png') center 30px no-repeat;}
	.section_show > .title {display:block; margin:0px auto 0px auto; padding:40px 0 0px 0; color:#FFFFFF; font-size:64px; font-weight:100; letter-spacing:-6px; text-align:center;}
	.section_show > .title_desc {display:block; margin:0px auto 0px auto; padding:0px 0 20px 0; color:#e5e5e5; font-size:18px; font-weight:200; text-align:center;}
	.section_show .shows {width:100%;}
	.section_show .shows a.poster {display:block; position:relative; width:100%; height:auto; margin:10px 0 0 0; padding:0px; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
	.section_show .shows a.poster:hover {margin:3px 0 0 0;}
	.section_show .shows a.poster > img {width:100%; max-width:100%; margin:0 0 0 0; box-shadow:3px 3px 4px #555555;}
	.section_show .shows a.title  {display:block; width:auto; padding:5px 0px 0px 0px; color:#FFFFFF; font-family:'Noto Sans KR', sans-serif; font-size:18px; line-height:150%; text-align:center;}
	.section_show .shows a.title:hover {color:#D03849;}
	.section_show .shows a.datetime  {display:block; width:auto; padding:15px 0px 0px 0px; color:#CCCCCC; font-size:14px; text-align:center;}
	.section_show .shows a.title > strong {display:inline-block; margin:0 5px 0 0; padding:0 5px; background:rgba(255,255,255,0.75); border-radius:3px; color:#7f7f7f; font-size:11px; line-height:20px; vertical-align:2px;}
	/* .section_show .btnShow_more {z-index:999; position:relative; display:block; width:300px; height:30px; margin:20px auto 0 auto; padding:15px 0px 15px 0px; color:#DDDDDD; font-size:21px; font-weight:200; background-color:transparent; border-top:1px solid #CCCCCC; border-right:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; border-left:1px solid #CCCCCC; text-align:center; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;} */
	.section_show .btnShow_more_wrap {text-align: center;}
	.section_show .btnShow_more_wrap .btnShow_more {z-index:999; position:relative; display:inline-block; width:210px; height:30px; margin:20px 10px 0 auto; padding:15px 0px 15px 0px; color:#DDDDDD; font-size:21px; font-weight:200; background-color:transparent; border-top:1px solid #CCCCCC; border-right:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; border-left:1px solid #CCCCCC; text-align:center; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
	.section_show .btnShow_more:hover {background:#CCCCCC; color:#333333;}

	/* 공연장안내 */
	.section_theater {position:relative; width:100%; margin:80px auto 120px auto; padding:0px 0 0 0; background:url('/ko/common/img/bg/bg_section_m_stage.png') center 30px no-repeat;}
	.section_theater > .title {display:block; margin:0px auto 0px auto; padding:40px 0 0px 0; color:#555555; font-size:64px; font-weight:100; letter-spacing:-6px; text-align:center;}
	.section_theater > .title_desc {display:block; margin:0px auto 0px auto; padding:0px 0 20px 0; color:#5B5B5B; font-size:18px; font-weight:200; text-align:center;}
	.section_theater .stages {position:relative; width:100%; text-align:center;}
	.section_theater .stages:after {clear:both; content:''; display:block;}
	.section_theater .stages ul {list-style:none; width:960px; margin:0px auto 0 auto;}
	.section_theater .stages ul:after {clear:both; content:''; display:block;}
	.section_theater .stages ul li {float:left; position:relative; width:310px; height:410px; margin:10px 15px 0 0; box-shadow:2px 2px 4px #666666; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
	.section_theater .stages ul li:last-child {margin:10px 0px 0 0;}
	.section_theater .stages ul li:hover {margin-top:3px; border:0px solid #555555;}
	.section_theater .stages ul li a {display:block; width:100%; height:100%; margin:0px; padding:0px;}
	.section_theater .stages ul li a.stage01 {background:url('/ko/common/img/bg/bg_stage_link_01.jpg') center center no-repeat;}
	.section_theater .stages ul li a.stage02 {background:url('/ko/common/img/bg/bg_stage_link_02.jpg') center center no-repeat;}
	.section_theater .stages ul li a.stage03 {background:url('/ko/common/img/bg/bg_stage_link_03.jpg') center center no-repeat;}
	.section_theater .stages ul li a .link_seat {display:block; position:absolute; top:20px; left:auto; right:auto; width:100%; margin:0px auto 0 auto; padding:0px 0 0 0; color:rgba(255,255,255,0.1); font-size:172px; font-weight:700; letter-spacing:-10px; line-height:100%; text-align:center;}
	.section_theater .stages ul li a .link_no {display:block; margin:0px auto 0 auto; padding:190px 0 0 0; color:#CCCCCC; font-size:28px; font-weight:100;}
	.section_theater .stages ul li a .link_desc {display:block; margin:0px auto; padding:20px 20px 0 20px; color:#CCCCCC; font-size:18px; font-weight:100;}
	.section_theater .stages ul li a .link_desc > span {white-space:nowrap;}
	.section_theater .stages ul li a .link {display:inline-block; margin:30px auto 0 auto; padding:10px 15px; border:1px solid #7f7f7f; color:#AAAAAA; font-size:14px; font-weight:400; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
	.section_theater .stages ul li:hover > a > .link {background:rgba(0,0,0,0.8); border:1px solid #000000; color:#EBEBEB; font-size:14px; font-weight:400;}
	.section_theater .btnStage_more {z-index:999; position:relative; display:block; width:308px; height:30px; margin:40px auto 0 auto; padding:15px 0px 15px 0px; color:#ㅊㅊㅊㅊㅊㅊ; font-size:21px; font-weight:200; background:transparent; border-top:1px solid #7f7f7f; border-right:1px solid #7f7f7f; border-bottom:1px solid #7f7f7f; border-left:1px solid #7f7f7f; text-align:center; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
	.section_theater .btnStage_more:hover {background:#7f7f7f; color:#FFFFFF;}

	/* 인스타그램 */
	.section_instagram {position:relative; width:100%; margin:80px auto 120px auto; padding:0px 0 0 0;}
	.section_instagram > .title {display:block; margin:0px auto 0px auto; padding:25px 0 0px 0; color:#CCCCCC; font-size:64px; font-weight:100; letter-spacing:-6px; text-align:center;}
	.section_instagram > .title_desc {display:block; margin:0px auto 0px auto; padding:0px 0 20px 0; color:#CCCCCC; font-size:18px; font-weight:200; text-align:center;}
	.section_instagram .instagram {position:relative; width:100%; text-align:center;}
	.section_instagram .instagram:after {clear:both; content:''; display:block;}
	.section_instagram .instagram ul {list-style:none; width:960px; margin:0px auto 0 auto; text-align:center;}
	.section_instagram .instagram ul:after {clear:both; content:''; display:block;}
	.section_instagram .instagram ul li {float:left; display:inline-block; position:relative; width:150px; height:150px; margin:0px 12px 0 0; overflow:hidden; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
	.section_instagram .instagram ul li:last-child {margin:0px 0px 0 0;}
	.section_instagram .instagram ul li a {display:block; position:relative; width:150px; height:150px; margin:0px; padding:0px;}
	.section_instagram .instagram ul li a img {z-index:1; opacity:0.5; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
	.section_instagram .instagram ul li a:hover img {z-index:1; opacity:1;}
	.section_instagram .instagram ul li a p.caption {z-index:9999; display:block; float:left; position:absolute; top:150px; left:0px; right:0px; bottom:0px; width:130px; height:130px; margin:0px; padding:10px; overflow:hidden; background:rgba(208,56,73,0); color:#FFFFFF; font-size:11px; font-weight:400; letter-spacing:0px; line-height:120%; text-align:left; white-space:normal; word-break:break-all; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
	.section_instagram .instagram ul li a:hover p.caption {top:0px; background:rgba(208,56,73,0.8);}
	.section_instagram .btnInsta_more {z-index:999; position:relative; display:block; width:400px; height:30px; margin:40px auto 0 auto; padding:15px 0px 15px 0px; color:#CCCCCC; font-size:21px; font-weight:200; background:transparent; border:1px solid #7f7f7f; text-align:center; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
	.section_instagram .btnInsta_more:hover {color:#FFFFFF; border:1px solid #8A2387;
		background: #8A2387;  /* fallback for old browsers */
		background: -webkit-linear-gradient(to right, #F27121, #E94057, #8A2387);  /* Chrome 10-25, Safari 5.1-6 */
		background: linear-gradient(to right, #F27121, #E94057, #8A2387); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	}
}



/*------------------------------------------------------------------------------
 * Responsive Media Query
------------------------------------------------------------------------------*/
@media all and (min-width:320px) {

}

@media all and (min-width:360px) {

}

@media all and (min-width:375px) {

}

@media all and (min-width:400px) {

}

@media all and (min-width:414px) {

}

@media all and (min-width:480px) {

}

@media all and (min-width:568px) {

}

@media all and (min-width:640px) {

}

@media all and (min-width:667px) {

}

@media all and (min-width:736px) {

}

@media all and (min-width:768px) {

}

.oldie #containerTop .visualSection .slideshow  {position:absolute; width:2560px; height:auto; margin:0; background:#000000; top:0; left:0;}