/* 스타일 시트 정의 */


.rimg {max-width:100%;}
.nopadding {padding:0px !important;}
.clear {clear:both;}

/* float */
.fl	{float:left !important;}
.fr	{float:right !important;}
.fn	{float:none !important;}

/* margin top */
.mt0	{margin-top:0px !important;}
.mt5	{margin-top:5px !important;}			.mt10 {margin-top:10px !important;}			.mt15 {margin-top:15px !important;}
.mt20 {margin-top:20px !important;}			.mt25 {margin-top:25px !important;}			.mt30 {margin-top:30px !important;}
.mt35 {margin-top:35px !important;}			.mt40 {margin-top:40px !important;}			.mt45 {margin-top:45px !important;}
.mt50 {margin-top:50px !important;}			.mt55 {margin-top:55px !important;}			.mt60 {margin-top:60px !important;}
.mt65 {margin-top:65px !important;}			.mt70 {margin-top:70px !important;}			.mt75 {margin-top:75px !important;}
.mt80 {margin-top:80px !important;}			.mt85 {margin-top:85px !important;}         .mt90 {margin-top:90px !important;}  
.mt95 {margin-top:95px !important;}			.mt100 {margin-top:100px !important;}       .mt150 {margin-top:150px !important;}  

/* margin right */
.mr5	{margin-right:5px !important;}			.mr10 {margin-right:10px !important;}			.mr15 {margin-right:15px !important;}
.mr17 {margin-right:17px !important;}
.mr20 {margin-right:20px !important;}			.mr25 {margin-right:25px !important;}			.mr30 {margin-right:30px !important;}
.mr35 {margin-right:35px !important;}			.mr40 {margin-right:40px !important;}			.mr45 {margin-right:45px !important;}
.mr50 {margin-right:50px !important;}			.mr55 {margin-right:55px !important;}			.mr60 {margin-right:60px !important;}
.mr65 {margin-right:65px !important;}			.mr70 {margin-right:70px !important;}			.mr75 {margin-right:75px !important;}

/* margin bottom */
.mb5 {margin-bottom:5px !important;}		.mb10 {margin-bottom:10px !important;}		.mb15{margin-bottom:15px !important;}
.mb20 {margin-bottom:20px !important;}		.mb25 {margin-bottom:25px !important;}		.mb30 {margin-bottom:30px !important;}
.mb35 {margin-bottom:35px !important;}		.mb40 {margin-bottom:40px !important;}		.mb45 {margin-bottom:45px !important;}
.mb50 {margin-bottom:50px !important;}		.mb55 {margin-bottom:55px !important;}		.mb60 {margin-bottom:60px !important;}
.mb65 {margin-bottom:65px !important;}		.mb70 {margin-bottom:70px !important;}		.mb75 {margin-bottom:75px !important;}
.mb80 {margin-bottom:80px !important;}      .mb85 {margin-bottom:85px !important;}      .mb90 {margin-bottom:90px !important;}
.mb95 {margin-bottom:95px !important;}      .mb100 {margin-bottom:100px !important;}      .mb200 {margin-bottom:200px !important;}

/* margin left */
.ml5 {margin-left:5px !important;}				.ml10 {margin-left:10px !important;}			.ml15{margin-left:15px !important;}
.ml20 {margin-left:20px !important;}			.ml25 {margin-left:25px !important;}			.ml30 {margin-left:30px !important;}
.ml35 {margin-left:35px !important;}			.ml40 {margin-left:40px !important;}			.ml45 {margin-left:45px !important;}
.ml50 {margin-left:50px !important;}			.ml55 {margin-left:55px !important;}			.ml60 {margin-left:60px !important;}
.ml65 {margin-left:65px !important;}			.ml70 {margin-left:70px !important;}			.ml75 {margin-left:75px !important;}

/* padding top */
.pt0	{padding-top:0px !important;}
.pt5	{padding-top:5px !important;}			.pt10 {padding-top:10px !important;}			.pt15 {padding-top:15px !important;}
.pt20 {padding-top:20px !important;}			.pt25 {padding-top:25px !important;}			.pt30 {padding-top:30px !important;}
.pt35 {padding-top:35px !important;}			.pt40 {padding-top:40px !important;}			.pt45 {padding-top:45px !important;}
.pt50 {padding-top:50px !important;}			.pt55 {padding-top:55px !important;}			.pt60 {padding-top:60px !important;}
.pt65 {padding-top:65px !important;}			.pt70 {padding-top:70px !important;}			.pt75 {padding-top:75px !important;}

/* padding right */
.pr0	{padding-right:0px !important;}
.pr5	{padding-right:5px !important;}		.pr10 {padding-right:10px !important;}		.pr15 {padding-right:15px !important;}
.pr20 {padding-right:20px !important;}		.pr25 {padding-right:25px !important;}		.pr30 {padding-right:30px !important;}
.pr35 {padding-right:35px !important;}		.pr40 {padding-right:40px !important;}		.pr45 {padding-right:45px !important;}
.pr50 {padding-right:50px !important;}		.pr55 {padding-right:55px !important;}		.pr60 {padding-right:60px !important;}
.pr65 {padding-right:65px !important;}		.pr70 {padding-right:70px !important;}		.pr75 {padding-right:75px !important;}

/* padding bottom */
.pb0	{padding-bottom:0px !important;}
.pb5	{padding-bottom:5px !important;}		.pb10 {padding-bottom:10px !important;}	.pb15{padding-bottom:15px !important;}
.pb20 {padding-bottom:20px !important;}	.pb25 {padding-bottom:25px !important;}	.pb30 {padding-bottom:30px !important;}
.pb35 {padding-bottom:35px !important;}	.pb40 {padding-bottom:40px !important;}	.pb45 {padding-bottom:45px !important;}
.pb50 {padding-bottom:50px !important;}	.pb55 {padding-bottom:55px !important;}	.pb55 {padding-bottom:55px !important;}
.pb65 {padding-bottom:65px !important;}	.pb70 {padding-bottom:70px !important;}	.pb75 {padding-bottom:75px !important;}

/* padding left */
.pl0	{padding-left:0px !important;}	
.pl5	{padding-left:5px !important;}			.pl10 {padding-left:10px !important;}			.pl15{padding-left:15px !important;}
.pl20 {padding-left:20px !important;}			.pl25 {padding-left:25px !important;}			.pl30 {padding-left:30px !important;}
.pl35 {padding-left:35px !important;}			.pl40 {padding-left:40px !important;}			.pl45 {padding-left:45px !important;}
.pl50 {padding-left:50px !important;}			.pl55 {padding-left:55px !important;}			.pl60 {padding-left:60px !important;}
.pl65 {padding-left:65px !important;}			.pl70 {padding-left:70px !important;}			.pl75 {padding-left:75px !important;}


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

 .mtext-center {text-align:center;}

}


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

 .mclear {clear:both;}

 /*팝업 처리*/
 #popup1 {position:absolute;left:10px;top:450px;z-index:99999999999;width:380px;}

 /*팝업 처리*/
 #popup2 {position:absolute;left:0px;top:0px;z-index:99999999999;width:380px;}


}


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

 .post-grid-item.750 {
    height: 750px;
}

}



.border-style01 {border: 1px solid #898989;}


.tline.title::after {

    position: absolute;
    content: '';
    background-color: #34495e;
    left: 120px;
    height: 1px;
    width: 60px;
    bottom: 3px;

}

.tline2.title::after {

    position: absolute;
    content: '';
    background-color: #34495e;
    left: 50px;
    height: 1px;
    width: 60px;
    bottom: 3px;

}


/* font color */
.c_black {color:#000 !important;}
.c_fff {color:#fff !important;}
.c_333 {color:#333 !important;}
.c_777 {color:#777 !important;}
.c_3d3d3d {color:#3d3d3d !important;}
.c_817260 {color:#817260 !important;}
.c_453b3b {color:#453b3b !important;}
.red1 {color:#ac0000;}
.red2 {color:#dd0810}

/* width */
.w100p {width:100% !important;}
.w70 {width:70px !important;}
.w100 {width:100px !important;}
.w200 {width:200px !important;}
.w283 {width:283px !important;}
.w331 {width:331px !important;}
.w485 {width:485px !important;}

.h473 {height:473px !important;}

.pd0 {padding:0 !important;}
.pd30 {padding:30px !important;}
.pb3 {padding-bottom:3px !important;}

.mg0 {margin:0 !important;}
.mt70 {margin-top:70px !important;}
.mtm5 {margin-top:-5px !important;}
.mtm10 {margin-top:-10px !important;}
.mtm20 {margin-top:-20px !important;}
.mtm30 {margin-top:-30px !important;}
.mtm40 {margin-top:-40px !important;}
.mb0 {margin-bottom:0 !important;}
.mb2 {margin-bottom:2px !important;}
.mb7 {margin-bottom:7px !important;}
.mr3 {margin-right:3px !important;}

.letter1 {letter-spacing:-1px !important;}

.fs11 {font-size:11px !important;}
.fs12 {font-size:12px !important;}
.fs13 {font-size:13px !important;}
.fs14 {font-size:14px !important;}
.fs24 {font-size:24px !important;}
.fs28 {font-size:28px !important;}

.h364 {height:364px !important;}

.line_t0 {border-top:0 !important;}
.line_t1 {border-top:2px solid #393c43 !important;}
.line_t2 {border-top:1px solid #c9c9c9 !important;}
.line_b1 {border-bottom:1px solid #eaeaea !important;}
.line_b2 {border-bottom:1px solid #bbb !important;}
.line_b3 {border-bottom:1px solid #dfdfdf !important;}
.line_b4 {border-bottom:2px solid #797267 !important;}
.line_b5 {border-bottom:2px solid #877669 !important;}



.about-us-wrapper .text-style05 {font-size:20px;padding-top:50px;}

/* 숨김 설정 */

@media all and (max-width:768px){
	
	/* 해상도 768px 이하 기기에서 숨김처리 */
	.hidden-m768 {display:none;}

	/*팝업 처리*/
	 #popup1 {position:absolute;left:10px;top:450px;z-index:200;width:90%;}

}


@media all and (min-width:768px){
	
	/* 해상도 768px 이하 기기에서 숨김처리 */
	.hidden-p768 {display:none;}

}




@media all and (max-width:768px){
	
	/* 해상도 768px 이하 기기에서 숨김처리 */
	div#post_area img {max-width:100%;}
	td.bbsnewf5 img {max-width:100%;}

	
}


.title::after {
    position: absolute;
    content: '';
    background-color: #34495e;
    left: 0;
    height: 1px;
    width: 60px;
    bottom: 3px;
}

/* 모바일에서 반응형 구굴지도/유튜브 지원 */
  .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; }
  .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }


  .clear {clear:both;}
  .text-right {text-align:right;}
  .text-left {text-align:left;}
  .text-center {text-align:center;}
  .nopadding {padding:0px;}
  .pb20 {padding-bottom:20px !important;}


.heading .title5  {
    font-size: 2.143rem;
    font-weight: bold;
    line-height: 25px;
    position: relative;
    text-align:center;
    margin: 0;
    padding-right: 5px;
    text-transform: capitalize;
    color: #a02418;
    background-color: #ffffff;
}


/*-----------------------------------
    웹즐팩 Basic Style 
--------------------------------------*/

.title {
    position: relative;
    font-size: 24px;
    line-height: 26px;
    color: #444;
    padding-bottom: 15px;
    margin: 0;
    margin-bottom: 50px;
}

.title.white {
    color: #bbb;
}
.title.white:before, 
.title.white:after {
    background: rgba(255,255,255,0.4);
}
.text-center.title:before {
    left: 50%;
    transform: translateX(-50%);
}
.text-center.title:after {
    left: calc(50% + 10px);
    transform: translateX(-50%);
}
.bg-img {
    background-image: url(../img/bg-img.png);
}
.bg-img2 {
    background-image: url(../img/bg-img2.jpg);
}
.tc-element-list-menu {
    list-style-type: none;
    padding: 0;
    margin: 0;
}
.tc-element-list-menu li a {
    position: relative;
    display: block;
    padding: 20px;
    font-size: 17px;
    background: rgba(0, 0, 0, 0.05);
    width: 100%;
    color: #999;
    margin-bottom: 30px;
    text-align: center;
}
.tc-element-list-menu li a:hover {
    background: rgba(0, 0, 0, 0.1);
    color: #888;
}
.tc-element-list-menu li a .badge {
    position: absolute;
    top: 4px;
    right: 4px;
    border-radius: 4px;
    background: #ef1c2e;
    font-size: 11px;
    padding: 5px 9px 6px 9px;
    letter-spacing: 1px;
}
.tc-element-list-menu li a .badge.update {
    background: #4CAF50;
}
.tc-element-list-menu li a .badge.hot {
    background: #f39c12;
}
.title .badge {
    border-radius: 4px;
    background: #ef1c2e;
    font-size: 11px;
    padding: 5px 9px 4px 9px;
    letter-spacing: 1px;
}

@media (max-width: 767px) {
    .row [class*="col-"]:nth-child(n+2) [class*="testimonial-"] {
        margin-top: 60px;
    }
}


/*-----------------------------
    Services Style1
-------------------------------*/
.tc-services-style1 .services-item {padding: 30px 25px 25px;position: relative;text-align: center;background: #fff;border: 1px solid rgba(0, 0, 0, 0.05);margin-bottom: 25px;}
.tc-services-style1 .services-icon {font-size: 32px;display: inline-block;background-color: #444;color: #bbb;height: 82px;width: 82px;text-align: center;line-height: 82px;border-radius: 50%;margin-bottom: 10px;-webkit-transition: all .3s ease-out;transition: all .3s ease-out;}
.tc-services-style1 .services-item:hover .services-icon {background-color: #222;color: #fff;}
.tc-services-style1 .services-title {display: inline-block;font-size: 18px;margin-bottom: 20px;color: #222;}
.tc-services-style1 .services-desc p {font-size: 14px;line-height: 1.8;color: #777;}
.tc-services-style1 .services-desc a {color: #777;font-size: 13px;position: relative;display: inline-block;text-decoration: none !important;margin-top: 8px;}
.tc-services-style1 .services-desc a:hover {color: #222;}


/*-----------------------------
    Services Style2
-------------------------------*/
.tc-services-style2 .services-item {position: relative;text-align: center;background: #fff;border: 1px solid rgba(0, 0, 0, 0.05);margin-bottom: 25px;}
.tc-services-style2 .services-icon {font-size: 26px;padding: 30px;background-color: #f5f5f5;color: #bbb;text-align: center;-webkit-transition: all .3s ease-out;transition: all .3s ease-out;margin-left: -1px;margin-right: -1px;margin-top: -1px;}
.tc-services-style2 .services-item:hover .services-icon {background-color: #222;color: #fff;}
.tc-services-style2 .services-desc {padding: 30px 25px;}
.tc-services-style2 .services-title {display: inline-block;font-size: 18px;color: #222;margin-top: 0;margin-bottom: 20px;}
.tc-services-style2 .services-desc p {font-size: 14px;line-height: 1.8;color: #777;}
.tc-services-style2 .services-desc a {color: #777;font-size: 13px;position: relative;display: inline-block;text-decoration: none !important;margin-top: 10px;}
.tc-services-style2 .services-desc a:hover {color: #222;}


/*본사위치 -  찾아오시는 길*/
.sub_title2{padding: 70px 0 40px 0; overflow:hidden; vertical-align:bottom;}
.sub_title2 h2{font-size: 35px; text-align: center;}
.location_wrap{position:relative;}
.btn_wrap{position:absolute; right:0; top:30px; width:100px; padding-top:30px; float:right; text-align:right;}
.btn_wrap .s_point{ text-align:left; padding:10px;  border:1px solid #bbb; color:#333; font-size:12px;}
.location_box{width:1100px; height:475px; border:1px solid #ddd;}

.location_info1{padding:30px 50px 20px 0; border-top:1px solid #ddd; border-bottom:1px solid #ddd; overflow:hidden; }

.location_info1 dt{float:left; clear:right; padding-bottom:7px; width:20%; font-size:14px; color:#333; line-height:16px;}
.location_info1 dd{float:right; width:80%; padding-bottom:7px; font-size:14px; color:#666; line-height:16px;}
.location_info1 dd a{font-size:14px; color:#666; }



/*-----------------------
    Carousel
-------------------------*/
.carousel-caption {
	text-shadow: none;
}
.carousel-caption .cs-title {
	margin-top: 0;
	font-size: 20px;
	line-height: normal;
}
.car-nav:before {
    position: absolute;
    font-family: FontAwesome;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    font-size: 32px;
    color: #FF0000;
    opacity: 0;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
}
.car-prev:before {
    content: "\f104";
	left: 35px;
}
.car-next:before {
    content: "\f105";
	right: 35px;
	padding-left: 5px;
}
.carousel:hover .car-nav:before {
	opacity: 1;
}

/*-----------------------
    Carousel Style1
-------------------------*/
.tc-carousel-style1 .carousel-caption {
    background-color: rgba(26, 26, 26, 0.84);
    color: #fff;
    top: 35px;
    right: 35px;
    left: auto;
    width: 60%;
    bottom: auto;
    text-align: left;
    padding: 35px;
}
.tc-carousel-style1 .cs-title a {
	color: #fff;
	text-decoration: none;
}
.tc-carousel-style1 .cs-desc {
	color: #fff;
	margin: 0;
}
.tc-carousel-style1 .carousel-indicators li {
	height: 6px;
	width: 30px;
	border-color: #FF0000;
	margin: 0;
}
.tc-carousel-style1 .carousel-indicators li.active {
	background-color: #FF0000
}
.tc-carousel-style1 .car-nav:before {
    border: 2px solid #FF0000;
    display: inline-block;
    height: 50px;
    width: 50px;
    line-height: 48px;
    text-align: center;
    border-radius: 50%;
}
.tc-carousel-style1 .car-prev:before {
	left: 65px;
}
.tc-carousel-style1 .car-next:before {
	right: 65px;
	padding-left: 5px;
}
.tc-carousel-style1 .car-nav:hover:before {
	background: #FF0000;
	color: #fff;
}
.tc-carousel-style1.carousel:hover .car-prev:before {
	left: 35px;
}
.tc-carousel-style1.carousel:hover .car-next:before {
	right: 35px;
}
.tc-carousel-style1.tc-light .car-nav:before {
    border-color: #fff;
    color: #fff;
}
.tc-carousel-style1.tc-light .car-nav:hover:before {
	background: #fff;
	color: #444;
}
.tc-carousel-style1.tc-light .carousel-indicators li {
    border-color: #fff;
}
.tc-carousel-style1.tc-light .carousel-indicators li.active {
    background-color: #fff;
}	

@media screen and (min-width: 767px) {
	.tc-carousel-style1.tc-light .carousel-caption {
	    background-color: rgba(255, 255, 255, 0.1);
	}
	.tc-carousel-style1.tc-light .cs-title a, 
	.tc-carousel-style1.tc-light .cs-desc {
		color: rgba(255, 255, 255, 0.9);
	}
}
@media screen and (max-width: 767px) {
	.tc-carousel-style1 .carousel-caption {
	    position: initial;
	    width: 100%;
	}
	.tc-carousel-style1 .carousel-indicators li {
	    border-color: #fff;
	}
	.tc-carousel-style1 .carousel-indicators li.active {
	    background-color: #fff;
	}
}

  

/*==========================
    Caption Animation #5
===========================*/
.tc-image-caption5 {position: relative;overflow: hidden;margin-bottom: 20px;}
.tc-image-caption5 img {max-width: 100%;-webkit-transform: scale(1.5) translateY(0);transform: scale(1.5) translateY(0);-webkit-transition: all .4s ease-in-out;transition: all .4s ease-in-out;}
.tc-image-caption5:hover img {-webkit-transform: scale(1.5) translateY(12px);transform: scale(1.5) translateY(12px);}
.tc-image-caption5:after {position: absolute;content: '';height: 100%;width: 100%;opacity: 0;background-color: rgba(0, 0, 0, 0.5);-webkit-transition: all .5s ease-in;transition: all .5s ease-in;top: 0;left: 0;}
.tc-image-caption5:hover:after {opacity: 1}
.tc-image-caption5 .caption {position: absolute;bottom: 0;z-index: 10;left: 0;text-align: left;width: 100%;padding: 15px;background-color: rgba(0,0,0,0.6);text-align: center;}
.tc-image-caption5 .caption h3 {color: #fff;font-size: 19px;margin-bottom: 2px;-webkit-transition: all .5s ease-in-out;transition: all .5s ease-in-out;}
.tc-image-caption5 .link-wrap {position: absolute;top: 40%;left: 50%;-webkit-transform: translateY(-50%) translateX(-50%);transform: translateY(-50%) translateX(-50%);z-index: 10;}
.tc-image-caption5 .link-wrap a {display: inline-block;height: 36px;width: 36px;line-height: 36px;background-color: rgba(0, 0, 0, 0.6);text-align: center;color: #fff;font-size: 12px;border-radius: 50%;opacity: 0;-webkit-transform: scale(0);transform: scale(0);-webkit-transition: all .5s ease-in-out;transition: all .5s ease-in-out;}
.tc-image-caption5 .link-wrap a:last-child {margin-left: 2px;-webkit-transition-delay: .1s;transition-delay: .1s;}
.tc-image-caption5:hover .link-wrap a {opacity: 1;-webkit-transform: scale(1);transform: scale(1);}
.tc-image-caption5 .link-wrap a:hover {background-color: rgba(0, 0, 0, 0.9);color: #f5f5f5;}


/*-----------------------------
    Common Styles
-------------------------------*/
.post-grid-img img {width: 100%}
.post-grid-item {margin-bottom: 25px;}

/*--------------------------
    Post Grid Style1
----------------------------*/
.tc-post-grid-style1 .post-grid-content {padding: 25px;border-width: 0 1px 1px 1px;border-style: solid;border-color: #eee;background-color: #fff;}
.tc-post-grid-style1 .post-grid-title {font-size: 18px;text-transform: uppercase;margin-bottom: 4px;margin-top: 0;}
.tc-post-grid-style1 .post-grid-title a {color: #222;text-decoration: none;}
.tc-post-grid-style1 .post-grid-title a:hover {color: #555;}
.tc-post-grid-style1 .post-grid-meta {padding: 0;list-style-type: none;margin: 0;font-size: 10px;text-transform: uppercase;}
.tc-post-grid-style1 .post-grid-meta * {color: #999;}
.tc-post-grid-style1 .post-grid-meta li {display: inline-block;position: relative;}
.tc-post-grid-style1 .post-grid-meta li + li {padding-left: 10px;margin-left: 10px;}
.tc-post-grid-style1 .post-grid-meta li + li:after {position: absolute;content: '';background: #ddd;height: 8px;width: 1px;top: 50%;left: -2px;-webkit-transform: translateY(-50%);transform: translateY(-50%);}
.tc-post-grid-style1 .post-grid-desc {margin-top: 10px;}
.tc-post-grid-style1 .post-grid-desc p {color: #888;}
.tc-post-grid-style1 .post-grid-footer {margin-top: 25px;}
.tc-post-grid-style1 .post-grid-footer .readon {padding: 4px 17px;font-size: 11px;border: 1px solid #eee;color: #999;-webkit-transition: all .3s ease-out;transition: all .3s ease-out;}
.tc-post-grid-style1 .post-grid-footer .readon:hover {border-color: #444;background-color: #444;color: #bbb;}


/*----------  1.8. Menu Order Item  ----------*/

    .menu-items .title {
        font-family: 'antonioregular', sans-serif;
        font-size: 1.429rem;

        display: inline-block;

        width: 100%;
        margin-bottom: 5px;

        text-transform: capitalize;

        color: #01050e;
    }

    .menu-items .title .name {
        float: left;
        text-align: left;
    }

    .menu-items .title .price {
        float: right;
        -webkit-transition: all .5s ease;
           -moz-transition: all .5s ease;
             -o-transition: all .5s ease;
                transition: all .5s ease;

        color: #a4a6a9;
    }

    .menu-items .title:hover .price {
        color: #ed421c;
    }

    .menu-items .desciption {
        margin: 0;
        text-align: left;
    }



    .menu-items {
        display: table;
        width: 100%;
        margin-bottom: 30px;
    }

    .menu-items .item-image {
        position: relative;
        display: table-cell;
        width: 45%;
    }

    .menu-items .item-image:after {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        content: '';
        -webkit-transition: all .5s ease;
           -moz-transition: all .5s ease;
             -o-transition: all .5s ease;
                transition: all .5s ease;
        -webkit-transform: scale(0);
           -moz-transform: scale(0);
            -ms-transform: scale(0);
             -o-transform: scale(0);
                transform: scale(0);
        background-color: rgba(0, 0, 0, .5);
    }

    .menu-items .item-content {
        display: table-cell;
        padding-left: 30px;
        vertical-align: middle;
    }

    .menu-items:hover .item-image:after {
        -webkit-transform: scale(1);
           -moz-transform: scale(1);
            -ms-transform: scale(1);
             -o-transform: scale(1);
                transform: scale(1);
    }



/* 3 - Price Table 
---------------------------------------------------------------------- */ 
.rpt .rpt-title { 
	font-size: 24px;
	font-weight: 700;
	text-transform: uppercase;
	display: block;
}
.rpt li {
	padding: 12px;
}
.rpt .rpt-item {
	border: 1px solid #f1f3f6;
	border-left:none;
	text-align: center;
	background: #fff;
} 
.rpt .rpt-single:first-child .rpt-item {
	border-left: 1px solid #f1f3f6;
}

.rpt .rpt-pack-info {
	background: #0FB9DB;
	padding: 25px;
} 
.rpt .rpt-pack-price {
	padding: 37px;
	margin-bottom: 0;
	position: relative;
	display: inline-block;
} 
.rpt .rpt-currency { 
	font-weight: 400;
	position: absolute; 
	color: #fff; 
	left: -15px;
	top:-10px;
	font-size: 22px;
}
.rpt .rpt-price  {
	font-size: 48px;
	color: #fff; 
} 
 
.rpt .rpt-body li {
	border-bottom: 1px solid #f1f3f6;
} 
.rpt .rpt-body li:last-child {
	border-bottom: none;
}
.rpt .rpt-pack-info {
 	background: #fff;
 	margin-bottom: 0;
}  
.rpt .rpt-footer { 
	margin-bottom: 30px; 
} 
 
.rpt .rpt-item {
	border:1px solid #f1f3f6;
} 
.rpt .rpt-circle {
	position: relative;
	display: block;
	text-align: center;
	width: 130px;
	height: 130px;
	line-height: 120px;
	margin: 5px auto;
	border: 5px solid #f1f3f6;
	border-radius: 100%;
	z-index: 0;
} 
.rpt .rpt-circle:after { 
	content: "";
	position: absolute;
	background: #a02418;
	border-radius: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: -2; 
}
.rpt .rpt-circle:before {
	content: "";
	position: absolute;
	background: #e7eef1;
	border-radius: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: -1;	
	background: #a02418; 
	background: -moz-linear-gradient(135deg,  rgba(0,0,0,.0) 50%,rgba(0,0,0,.1) 50%);  
	background: -webkit-linear-gradient(135deg,  rgba(0,0,0,.0) 50%,rgba(0,0,0,.1) 50%); 
	background: -o-linear-gradient(135deg,  rgba(0,0,0,.0) 50%,rgba(0,0,0,.1) 50%); 
	background: -ms-linear-gradient(135deg,  rgba(0,0,0,.0) 50%,rgba(0,0,0,.1) 50%);
	background: linear-gradient(135deg,  rgba(0,0,0,.0) 50%,rgba(0,0,0,.1) 50%); 
}  
.rpt .rpt-pack-price { 
	padding: 0;
	display: inline-block;
}
.rpt .rpt-price {
	font-size: 30px;
}
.rpt .rpt-duration {
	position: absolute;
	left: 0;
	right: 0;
	width: 100%;
	text-align: center;
	right: inherit;
	top: 35px;
	font-size: 22px;
	color: #fff;
	display: block;   
}
.rpt .rpt-body {
	position: relative;
}
.rpt .rpt-body:after {
	content: "";
	position: absolute;
	left:0;
	right: 0;
	top: -4px; 
}    

 
/* 3.1 - Style 1
-------------------------------------------- */ 
.rpt-s1 .rpt-item:hover .rpt-circle:before {
	-webkit-transform: rotate(90deg);
	   -moz-transform: rotate(90deg);
	    -ms-transform: rotate(90deg);
	     -o-transform: rotate(90deg);
	        transform: rotate(90deg);
}

/* 3.1 - Style 1 End
-------------------------------------------- */ 

/*style 2*/
.rpt-s2 .rpt-item .rpt-circle:before {
	-webkit-transition: all .5s ease;
	   -moz-transition: all .5s ease;
	    -ms-transition: all .5s ease;
	     -o-transition: all .5s ease;
	        transition: all .5s ease;
}
.rpt-s2 .rpt-item:hover .rpt-circle:before {
	-webkit-transform: rotate(360deg);
	   -moz-transform: rotate(360deg);
	    -ms-transform: rotate(360deg);
	     -o-transform: rotate(360deg);
	        transform: rotate(360deg);
}


/*style 3 and style 4*/
.rpt-s4 .rpt-item .rpt-circle, 
.rpt-s3 .rpt-item .rpt-circle {
	overflow: hidden;
}
.rpt-s4 .rpt-item .rpt-circle:before, 
.rpt-s3 .rpt-item .rpt-circle:before {
	background: rgba(0,0,0,.1);
	border-radius: 0;
	left: 50%;
    margin-left: 18px;
    right: -50px;
    top: -50px;
    bottom: -60px;
	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	     -o-transform: rotate(45deg);
	        transform: rotate(45deg);
}
.rpt-s3 .rpt-item:hover .rpt-circle:before {
	 left: -50px;
}
.rpt-s4 .rpt-item:hover .rpt-circle:before {
	 left: 100%;
	 margin-left: 50px;
}


/* style 5 */
.rpt-s5 .rpt-item .rpt-circle { 
	background: transparent!important;  
}
.rpt-s5 .rpt-item .rpt-circle:before {
	background: transparent;
	border:5px solid #0FB9DB;
}
.rpt-s5 .rpt-item:hover .rpt-circle:after {
	background: transparent;
}
.rpt-s5 .rpt-item:hover .rpt-duration,
.rpt-s5 .rpt-item:hover .rpt-price,
.rpt-s5 .rpt-item:hover .rpt-currency {
	color:#0FB9DB;
} 


/* style 6 */
.rpt-s6 .rpt-item .rpt-circle { 
	background: transparent!important;  
}
.rpt-s6 .rpt-item .rpt-circle:before {
	background: transparent;
	border:5px solid #0FB9DB;
}
.rpt-s6 .rpt-item:hover .rpt-circle:after {
	top: 25px;
	left: 25px;
	right: 25px;
	bottom: 25px;
	opacity: 0;
}
.rpt-s6 .rpt-item:hover .rpt-duration,
.rpt-s6 .rpt-item:hover .rpt-price,
.rpt-s6 .rpt-item:hover .rpt-currency {
	color:#0FB9DB;
} 

/* style 7 */
.rpt-s7 .rpt-item .rpt-circle,
.rpt-s8 .rpt-item .rpt-circle,
.rpt-s9 .rpt-item .rpt-circle ,
.rpt-s10 .rpt-item .rpt-circle  { 
	background: transparent!important; 
}
.rpt-s7 .rpt-item .rpt-circle:before,
.rpt-s8 .rpt-item .rpt-circle:before,
.rpt-s9 .rpt-item .rpt-circle:before,
.rpt-s10 .rpt-item .rpt-circle:before   {
	background: transparent;
	border:5px solid #0FB9DB;
}
.rpt-s7 .rpt-item:hover .rpt-circle:after,
.rpt-s8 .rpt-item .rpt-circle:after {
	top: -25px;
	left: -25px;
	right: -25px;
	bottom: -25px;
	opacity: 0;
}
.rpt-s7 .rpt-item:hover .rpt-duration,
.rpt-s7 .rpt-item:hover .rpt-price,
.rpt-s7 .rpt-item:hover .rpt-currency, 
.rpt-s8 .rpt-item .rpt-duration,
.rpt-s8 .rpt-item .rpt-price,
.rpt-s8 .rpt-item .rpt-currency {
	color:#0FB9DB;
}

/* style 8 */ 
.rpt-s8 .rpt-item:hover .rpt-circle:after, 
.rpt-s9 .rpt-item:hover .rpt-circle:after {
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	opacity: 1;
}
.rpt-s8 .rpt-item:hover .rpt-duration,
.rpt-s8 .rpt-item:hover .rpt-price,
.rpt-s8 .rpt-item:hover .rpt-currency,
.rpt-s9 .rpt-item:hover .rpt-duration,
.rpt-s9 .rpt-item:hover .rpt-price,
.rpt-s9 .rpt-item:hover .rpt-currency {
	color:#fff;
}


/* style 9 */  
.rpt-s9 .rpt-item .rpt-circle:after {
	top: 25px;
	left: 25px;
	right: 25px;
	bottom: 25px;
	opacity: 0;
}
.rpt-s9 .rpt-item .rpt-duration,
.rpt-s9 .rpt-item .rpt-price,
.rpt-s9 .rpt-item .rpt-currency {
	 color:#0FB9DB;
} 

/* style 10 */  
.rpt-s10 .rpt-item .rpt-circle:after {
	background: transparent;
}
.rpt-s10 .rpt-item:hover .rpt-circle:after {
	background: #0FB9DB;;
}
.rpt-s10 .rpt-item .rpt-duration,
.rpt-s10 .rpt-item .rpt-price,
.rpt-s10 .rpt-item .rpt-currency {
	color:#0FB9DB;
}
.rpt-s10 .rpt-item:hover .rpt-duration,
.rpt-s10 .rpt-item:hover .rpt-price,
.rpt-s10 .rpt-item:hover .rpt-currency {
	color:#fff;
}

/* 3 - Price Table End
---------------------------------------------------------------------- */ 


/* 팝업 */

.promo {
	position:relative;
	padding:30px 200px 30px 0
}
.promo h3 {
	font-weight:700;
	margin-bottom:0
}
.promo>.container>span,.promo>span {
	display:block;
	color:#444;
	font-weight:300;
	font-size:16px;
	margin-top:6px
}
.promo a.button {
	position:absolute;
	top:50%;
	margin:-18px 0 0
}
.promo.promo-border a.button,.promo.promo-dark a.button,.promo.promo-light a.button {
	right:30px
}
.promo a.button.button-mini {
	margin-top:-12px
}
.promo a.button.button-small {
	margin-top:-15px
}
.promo a.button.button-large {
	margin-top:-22px
}
.promo a.button.button-xlarge {
	margin-top:-25px
}
.promo a.button.button-desc {
	margin-top:-40px
}
.promo-uppercase h3 {
	font-size:22px
}
.promo-uppercase>.container>span,.promo-uppercase>span {
	font-size:15px
}
.promo.promo-border {
	border:1px solid #E5E5E5;
	border-radius:3px;
	padding-left:30px
}
.promo.promo-light {
	background-color:#F5F5F5;
	border-radius:3px;
	padding-left:30px
}
.promo.promo-dark {
	border:0!important;
	background-color:#333;
	padding:30px 200px 30px 30px;
	text-shadow:1px 1px 1px rgba(0,0,0,.2);
	border-radius:3px
}
.promo.promo-dark h3 {
	color:#FFF
}
.promo.promo-dark>.container>h3 span,.promo.promo-dark>h3 span {
	padding:2px 8px;
	border-radius:3px;
	background-color:rgba(0,0,0,.15);
	color:#FFF;
	font-weight:400
}
.promo.promo-dark>.container>span,.promo.promo-dark>span {
	color:#CCC;
	margin-top:8px
}
.promo.promo-flat {
	background-color:#1ABC9C
}
.promo.promo-flat>.container>span,.promo.promo-flat>span {
	color:rgba(255,255,255,.9)
}
.promo.promo-flat a.button:not(.button-border) {
	background-color:rgba(0,0,0,.2);
	color:#FFF
}
.promo.promo-flat a.button:hover {
	background-color:#FFF;
	border-color:#FFF;
	color:#444;
	text-shadow:none
}
.promo-full {
	border-radius:0!important;
	border-left:0!important;
	border-right:0!important;
	padding:40px 0!important
}
.promo-full a.button {
	right:15px!important
}
.promo-full.promo-right a.button {
	right:auto!important;
	left:15px!important
}
.promo.parallax {
	padding:80px 0!important
}
.promo.promo-right {
	text-align:right;
	padding:30px 0 30px 200px
}
.promo.promo-right a.button {
	left:0;
	right:auto
}
.promo.promo-dark.promo-right:not(.promo-mini),.promo.promo-right.promo-border:not(.promo-mini) {
	padding-right:30px
}
.promo.promo-dark.promo-right a.button,.promo.promo-right.promo-border a.button {
	left:30px
}
.promo.promo-center a.button,.promo.promo-mini a.button {
	margin:20px 0 0;
	left:0!important;
	position:relative;
	top:0;
	right:0
}
.promo.promo-center {
	text-align:center;
	padding:5px
}
.promo.promo-mini {
	text-align:left;
	padding:20px 25px
}
.promo.promo-mini h3 {
	font-size:20px;
	line-height:1.5
}
.promo.promo-mini.promo-uppercase h3 {
	font-size:18px
}
.promo.promo-mini.promo-dark h3 {
	line-height:1.7
}
.promo.promo-mini.promo-center {
	text-align:center
}
.promo.promo-mini.promo-right {
	text-align:right
}


/*-----------------------------
    Common Styles
-------------------------------*/
div[class*="tc-note-"] + div[class*="tc-note-"] {margin-top: 20px;}

/*-----------------------------
    Note Style2
-------------------------------*/
.tc-note-style2 {vertical-align: middle;padding: 20px;background-color: #fff;border-top: 3px solid #444;display: table;width: 100%;-webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);}
.tc-note-style2 .note-icon {width: 58px;display: table-cell;text-align: center;vertical-align: middle;font-size: 30px;}
.tc-note-style2 .note-desc {vertical-align: middle;padding-left: 15px;}
.tc-note-style2 .note-desc h3 {margin: 0 0 7px 0;font-size: 20px;}
.tc-note-style2.tc-note-info {border-color: #3dc0f1;}
.tc-note-style2.tc-note-info .note-icon {color: #3dc0f1;}
.tc-note-style2.tc-note-success {border-color: #4CAF50;}
.tc-note-style2.tc-note-success .note-icon {color: #4CAF50;}
.tc-note-style2.tc-note-warning {border-color: #FF9800;}
.tc-note-style2.tc-note-warning .note-icon {color: #FF9800;}
.tc-note-style2.tc-note-danger {border-color: #ff5252;}
.tc-note-style2.tc-note-danger .note-icon {color: #ff5252;}


/*------------------------
	Box Style3
--------------------------*/
.tc-box-style3 {margin-bottom: 25px;}
.tc-box-style3 .box-title {font-size: 18px;line-height: normal;color: #444;padding: 15px 20px 12px;background-color: rgba(0, 0, 0, 0.04);margin: 0 0 15px;}
.tc-box-style3 .box-content {font-size: 14px;padding: 15px 20px 12px;background-color: rgba(0, 0, 0, 0.04);}


/*-----------------------
    Accordion
-------------------------*/
.tc-accordion .panel {margin-bottom: 5px;background-color: rgba(0, 0, 0, 0.03);border: 0;border-radius: 0;box-shadow: none;}
.acdn-title {margin: 0;}
.acdn-title a {display: block;position: relative;padding: 15px;font-size: 18px;color: #666;}
.acdn-body {padding: 15px;border-top: 1px solid rgba(0, 0, 0, 0.04);font-size: 13px;}
.tc-accordion .acdn-title a:after {position: absolute;font-family: FontAwesome;content: "\f068";color: inherit;font-size: 12px;right: 15px;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);}
.tc-accordion .acdn-title a.collapsed:after {content: "\f067";}

/*-----------------------
    Accordion Style1
-------------------------*/
.tc-accordion-style1 .panel {background-color: #fff;-webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);}
.tc-accordion-style1 .acdn-body {border-top: 1px solid rgba(0, 0, 0, 0.04);}

/*-----------------------
    Accordion Style2
-------------------------*/
.tc-accordion-style2 .panel {background: transparent;}
.tc-accordion-style2 .acdn-title a {background-color: #444;color: #bbb;}
.tc-accordion-style2 .acdn-body {background-color: #555;color: #bbb;}




/* 대박집 프로젝트  */

/*------------------------------
    Xgenious Plain Js Tab Css
------------------------------*/

.xgnav-tabs{
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0px;
}
.xgnav-tabs li{
    display: inline-block;
    border: 1px solid #e2e2e2;
    padding: 5px 20px;
    font-size: 16px;
    font-family: inherit;
    border-collapse: collapse;
    cursor: pointer;
    transition: .3s ease-in;
}
.xgnav-tabs li.active{
    background-color: #444;
    border-color: #444;
    color: #fff;
}

.xgtab-pane{
    display: none;
    font-size: 16px;
    line-height: 26px;
    overflow: hidden;
}
.xgtab-pane.active{
    display: block;
}

.xgtab-pane.show {
    -webkit-animation: 1s .1s fadeIn both;
    animation: 1s .1s fadeIn both;
}

@-webkit-keyframes swing {
    20% {
      -webkit-transform: rotate3d(0, 0, 1, 15deg);
      transform: rotate3d(0, 0, 1, 15deg);
    }
  
    40% {
      -webkit-transform: rotate3d(0, 0, 1, -10deg);
      transform: rotate3d(0, 0, 1, -10deg);
    }
  
    60% {
      -webkit-transform: rotate3d(0, 0, 1, 5deg);
      transform: rotate3d(0, 0, 1, 5deg);
    }
  
    80% {
      -webkit-transform: rotate3d(0, 0, 1, -5deg);
      transform: rotate3d(0, 0, 1, -5deg);
    }
  
    to {
      -webkit-transform: rotate3d(0, 0, 1, 0deg);
      transform: rotate3d(0, 0, 1, 0deg);
    }
  }
  
  @keyframes swing {
    20% {
      -webkit-transform: rotate3d(0, 0, 1, 15deg);
      transform: rotate3d(0, 0, 1, 15deg);
    }
  
    40% {
      -webkit-transform: rotate3d(0, 0, 1, -10deg);
      transform: rotate3d(0, 0, 1, -10deg);
    }
  
    60% {
      -webkit-transform: rotate3d(0, 0, 1, 5deg);
      transform: rotate3d(0, 0, 1, 5deg);
    }
  
    80% {
      -webkit-transform: rotate3d(0, 0, 1, -5deg);
      transform: rotate3d(0, 0, 1, -5deg);
    }
  
    to {
      -webkit-transform: rotate3d(0, 0, 1, 0deg);
      transform: rotate3d(0, 0, 1, 0deg);
    }
  }
  

@-webkit-keyframes shake {
    from,
    to {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  
    10%,
    30%,
    50%,
    70%,
    90% {
      -webkit-transform: translate3d(-10px, 0, 0);
      transform: translate3d(-10px, 0, 0);
    }
  
    20%,
    40%,
    60%,
    80% {
      -webkit-transform: translate3d(10px, 0, 0);
      transform: translate3d(10px, 0, 0);
    }
  }
  
  @keyframes shake {
    from,
    to {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  
    10%,
    30%,
    50%,
    70%,
    90% {
      -webkit-transform: translate3d(-10px, 0, 0);
      transform: translate3d(-10px, 0, 0);
    }
  
    20%,
    40%,
    60%,
    80% {
      -webkit-transform: translate3d(10px, 0, 0);
      transform: translate3d(10px, 0, 0);
    }
  }

@-webkit-keyframes rubberBand {
    from {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  
    30% {
      -webkit-transform: scale3d(1.25, 0.75, 1);
      transform: scale3d(1.25, 0.75, 1);
    }
  
    40% {
      -webkit-transform: scale3d(0.75, 1.25, 1);
      transform: scale3d(0.75, 1.25, 1);
    }
  
    50% {
      -webkit-transform: scale3d(1.15, 0.85, 1);
      transform: scale3d(1.15, 0.85, 1);
    }
  
    65% {
      -webkit-transform: scale3d(0.95, 1.05, 1);
      transform: scale3d(0.95, 1.05, 1);
    }
  
    75% {
      -webkit-transform: scale3d(1.05, 0.95, 1);
      transform: scale3d(1.05, 0.95, 1);
    }
  
    to {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  }
  
  @keyframes rubberBand {
    from {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  
    30% {
      -webkit-transform: scale3d(1.25, 0.75, 1);
      transform: scale3d(1.25, 0.75, 1);
    }
  
    40% {
      -webkit-transform: scale3d(0.75, 1.25, 1);
      transform: scale3d(0.75, 1.25, 1);
    }
  
    50% {
      -webkit-transform: scale3d(1.15, 0.85, 1);
      transform: scale3d(1.15, 0.85, 1);
    }
  
    65% {
      -webkit-transform: scale3d(0.95, 1.05, 1);
      transform: scale3d(0.95, 1.05, 1);
    }
  
    75% {
      -webkit-transform: scale3d(1.05, 0.95, 1);
      transform: scale3d(1.05, 0.95, 1);
    }
  
    to {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  }
  
@-webkit-keyframes pulse {
    from {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  
    50% {
      -webkit-transform: scale3d(1.05, 1.05, 1.05);
      transform: scale3d(1.05, 1.05, 1.05);
    }
  
    to {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  }
  
  @keyframes pulse {
    from {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  
    50% {
      -webkit-transform: scale3d(1.05, 1.05, 1.05);
      transform: scale3d(1.05, 1.05, 1.05);
    }
  
    to {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  }
  
@-webkit-keyframes fadeIn {
    from {
      opacity: 0;
    }
  
    to {
      opacity: 1;
    }
  }
  
  @keyframes fadeIn {
    from {
      opacity: 0;
    }
  
    to {
      opacity: 1;
    }
  }
  @-webkit-keyframes fadeInDown {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, -20%, 0);
      transform: translate3d(0, -20%, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  @keyframes fadeInDown {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, -20%, 0);
      transform: translate3d(0, -20%, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  @-webkit-keyframes bounce {
    from,
    20%,
    53%,
    80%,
    to {
      -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
      animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  
    40%,
    43% {
      -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
      animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
      -webkit-transform: translate3d(0, -30px, 0);
      transform: translate3d(0, -30px, 0);
    }
  
    70% {
      -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
      animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
      -webkit-transform: translate3d(0, -15px, 0);
      transform: translate3d(0, -15px, 0);
    }
  
    90% {
      -webkit-transform: translate3d(0, -4px, 0);
      transform: translate3d(0, -4px, 0);
    }
  }
  
  @keyframes bounce {
    from,
    20%,
    53%,
    80%,
    to {
      -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
      animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  
    40%,
    43% {
      -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
      animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
      -webkit-transform: translate3d(0, -30px, 0);
      transform: translate3d(0, -30px, 0);
    }
  
    70% {
      -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
      animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
      -webkit-transform: translate3d(0, -15px, 0);
      transform: translate3d(0, -15px, 0);
    }
  
    90% {
      -webkit-transform: translate3d(0, -4px, 0);
      transform: translate3d(0, -4px, 0);
    }
  }
  @-webkit-keyframes fadeInLeft {
    from {
      opacity: 0;
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  @keyframes fadeInLeft {
    from {
      opacity: 0;
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  .fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
  }
  
  @-webkit-keyframes fadeInLeftBig {
    from {
      opacity: 0;
      -webkit-transform: translate3d(-2000px, 0, 0);
      transform: translate3d(-2000px, 0, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  @keyframes fadeInLeftBig {
    from {
      opacity: 0;
      -webkit-transform: translate3d(-2000px, 0, 0);
      transform: translate3d(-2000px, 0, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  .fadeInLeftBig {
    -webkit-animation-name: fadeInLeftBig;
    animation-name: fadeInLeftBig;
  }
  
  @-webkit-keyframes fadeInRight {
    from {
      opacity: 0;
      -webkit-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  @keyframes fadeInRight {
    from {
      opacity: 0;
      -webkit-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  .fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
  }
  
  @-webkit-keyframes fadeInRightBig {
    from {
      opacity: 0;
      -webkit-transform: translate3d(2000px, 0, 0);
      transform: translate3d(2000px, 0, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  @keyframes fadeInRightBig {
    from {
      opacity: 0;
      -webkit-transform: translate3d(2000px, 0, 0);
      transform: translate3d(2000px, 0, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  .fadeInRightBig {
    -webkit-animation-name: fadeInRightBig;
    animation-name: fadeInRightBig;
  }
  
  @-webkit-keyframes fadeInUp {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, 100%, 0);
      transform: translate3d(0, 100%, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  @keyframes fadeInUp {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, 100%, 0);
      transform: translate3d(0, 100%, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  .fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
  }
  
  @-webkit-keyframes fadeInUpBig {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, 2000px, 0);
      transform: translate3d(0, 2000px, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  @keyframes fadeInUpBig {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, 2000px, 0);
      transform: translate3d(0, 2000px, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  .fadeInUpBig {
    -webkit-animation-name: fadeInUpBig;
    animation-name: fadeInUpBig;
  }
  
  @-webkit-keyframes fadeOut {
    from {
      opacity: 1;
    }
  
    to {
      opacity: 0;
    }
  }
  
  @keyframes fadeOut {
    from {
      opacity: 1;
    }
  
    to {
      opacity: 0;
    }
  }
  

/*-------------------------
    Style 06
-------------------------*/
.xgenious-tab-wrapper-06 .xgnav-tabs {
  text-align: center;
  display: block;
  position: relative;
  z-index: 0;
  margin-bottom: 20px; }

.xgenious-tab-wrapper-06 .xgnav-tabs:after {
  position: absolute;
  left: 0;
  top: 50%;
  background-color: #e2e2e2;
  content: '';
  width: 100%;
  height: 2px;
  z-index: -1; }

.xgenious-tab-wrapper-06 .xgnav-tabs li {
  width:210px;
  padding: 15px 30px;
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 600;
  color: #333333;
  border: 2px solid #e2e2e2;
  margin: 0 10px;
  background-color: #fff;
  border-radius: 30px; }

.xgenious-tab-wrapper-06 .xgnav-tabs li i {
  padding-right: 5px; }

.xgenious-tab-wrapper-06 .xgnav-tabs li.active {
  background-color: #197beb;
  border-color: #197beb;
  color: #fff; }

.xgenious-tab-wrapper-06 .xgtab-pane {
  font-size: 18px;
  line-height: 28px;
  padding: 20px 20px 10px 20px;
  border: 2px solid #e2e2e2;
  border-radius: 30px; }

.xgnav-tabs li.active a {color:#fff;}



/*스토리 */

.no-gutters > .col, .no-gutters > [class*="col-"] {
    padding-right: 0;
    padding-left: 0;
}

.full-background{
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.background-offset{
  width: 100%;
  height: 100%;
  background-size: 80%;
  background-repeat: no-repeat;
  background-position: center;
}

.background-80{
  background-size: 80%;
  background-repeat: no-repeat;
  background-position: center;
}

.background-70{
  background-size: 70%;
  background-repeat: no-repeat;
  background-position: center;
}

.background-60{
  background-size: 60%;
  background-repeat: no-repeat;
  background-position: center;
}

.background-50{
  background-size: 50%;
  background-repeat: no-repeat;
  background-position: center;
}

.background-40{
  background-size: 40%;
  background-repeat: no-repeat;
  background-position: center;
}

.background-30{
  background-size: 30%;
  background-repeat: no-repeat;
  background-position: center;
}

.grey-bg {
    background-color: 
    #fafafa !important;
}

.min-400 {
    min-height: 400px;
}

.padding-10-perc {
    padding:7% 10% 0px 10%;
}
@media screen and (max-width:776px) {
  .padding-10-perc {
    padding: 70px 15px;
  }

}

  .banner-6 {
    position: relative;
    overflow: initial;
    background-image: url('../../img/img/menu06_cont01_bg01.jpg');
}

  .banner-7 {
    position: relative;
    overflow: initial;
    background-image: url('../../img/img/menu06_cont02_bg01.jpg');
}

  .banner-8 {
    position: relative;
    overflow: initial;
    background-image: url('../../img/img/menu06_cont03_bg01.jpg');
}

  .banner-9 {
    position: relative;
    overflow: initial;
    background-image: url('../../img/img/menu06_cont04_bg01.jpg');
}

  .banner-10 {
    position: relative;
    overflow: initial;
    background-image: url('../../img/img/menu06_cont04_bg02.jpg');
}


  .banner-11 {
    position: relative;
    overflow: initial;
    background-image: url('../../img/img/main_cont011_bg001.jpg');
}


  .banner-12 {
    position: relative;
    overflow: initial;
    background-image: url('../../img/img/main_cont012_bg01.jpg');
}

  .banner-31 {
    position: relative;
    overflow: initial;
    background:#fab100;
}

  .banner-32 {
    position: relative;
    overflow: initial;
    background:#d7d8da;
}

  .banner-33 {
    position: relative;
    overflow: initial;
    background:#fab100;
}


  .banner-34 {
    position: relative;
    overflow: initial;
    background:#d7d8da;
}

  .banner-35 {
    position: relative;
    overflow: initial;
    background:#fab100;
}

  .banner-36 {
    position: relative;
    overflow: initial;
    background:#010101;
}


  .banner-37 {
    position: relative;
    overflow: initial;
    background:#29b3d3;
}

  .banner-38 {
    position: relative;
    overflow: initial;
    background:#d7d8da;
}







  .special-coffee.hidden-p768 {
    position: relative;
    overflow: initial;
    background-image: url('../../img/img/main_cont03_bg001.jpg');
	background-size: cover;
	
}




/*----------------------------
    Calltoaction Styles
------------------------------*/
.tc-calltoaction {padding: 25px 30px;background: #fff;min-height: 63px;border: 1px solid rgba(0,0,0,0.04);-webkit-box-shadow: -3px 0 0 rgba(0, 0, 0, 0.8);box-shadow: -3px 0 0 rgba(0, 0, 0, 0.8);}
.tc-calltoaction .cta-button {display: inline-block;padding: 20px 30px;font-size: 16px;text-decoration: none;background-color: #444;color: #e5e5e5;}
.tc-calltoaction .cta-button:hover {background-color: #000;color: #fff;}
.tc-calltoaction h3 {font-size: 22px;line-height: 32px;margin: 0;color: #333;}
.tc-calltoaction p {margin: 5px 0 0;}
.tc-calltoaction:not(.cta-align-center) {display: -ms-flexbox;display: -webkit-flex;display: flex;-ms-flex-wrap: wrap;-webkit-flex-wrap: wrap;flex-wrap: wrap;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}
.tc-calltoaction.cta-align-left {text-align: left;}
.tc-calltoaction.cta-align-left .cta-button {margin-left: auto;}
.tc-calltoaction.cta-align-right {text-align: right;-webkit-box-shadow: 3px 0 0 rgba(0, 0, 0, 0.8);box-shadow: 3px 0 0 rgba(0, 0, 0, 0.8);}
.tc-calltoaction.cta-align-center {text-align: center;padding: 45px;-webkit-box-shadow: 0 -3px 0 rgba(0, 0, 0, 0.8);box-shadow: 0 -3px 0 rgba(0, 0, 0, 0.8);}
.tc-calltoaction.cta-align-center h3 {font-size: 26px;}
.tc-calltoaction.cta-align-center .cta-button {margin-top: 25px;}
.tc-calltoaction.cta-align-center .cta-content > div {margin-top: 10px;}
.tc-calltoaction.cta-radius {padding: 25px 40px;border-radius: 60px;-webkit-box-shadow: none;box-shadow: none;}
.tc-calltoaction.cta-radius .cta-button {border-radius: 60px;}



.icon-box.icon-box-style-4, .icon-box.icon-box-style-7 {
  display: -ms-flexbox;
  display: flex;
  align-items: flex-start;
  text-align: left;	
}
/* line 182, ../../theme/css/gui/_icon-boxes.scss */
.icon-box.icon-box-style-4 .icon-box-icon-offset-border, .icon-box.icon-box-style-7 .icon-box-icon-offset-border {
  margin-right: 1rem;
}
/* line 186, ../../theme/css/gui/_icon-boxes.scss */
.icon-box.icon-box-style-4 .icon-box-icon, .icon-box.icon-box-style-7 .icon-box-icon {
  margin-right: 1rem;
  border-radius: 100%;
  width: auto;
  height: auto;
  padding: 2.3rem;
  text-align: center;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  position: relative;
}
/* line 197, ../../theme/css/gui/_icon-boxes.scss */
.icon-box.icon-box-style-4 .icon-box-icon i.fa,
.icon-box.icon-box-style-4 .icon-box-icon i.fas,
.icon-box.icon-box-style-4 .icon-box-icon i.far,
.icon-box.icon-box-style-4 .icon-box-icon i.fal,
.icon-box.icon-box-style-4 .icon-box-icon i.fab,
.icon-box.icon-box-style-4 .icon-box-icon i.icons,
.icon-box.icon-box-style-4 .icon-box-icon i.lnr, .icon-box.icon-box-style-7 .icon-box-icon i.fa,
.icon-box.icon-box-style-7 .icon-box-icon i.fas,
.icon-box.icon-box-style-7 .icon-box-icon i.far,
.icon-box.icon-box-style-7 .icon-box-icon i.fal,
.icon-box.icon-box-style-7 .icon-box-icon i.fab,
.icon-box.icon-box-style-7 .icon-box-icon i.icons,
.icon-box.icon-box-style-7 .icon-box-icon i.lnr {
  font-size: 1.9rem;
  color: #FFF;
  margin: 0 auto;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
/* line 213, ../../theme/css/gui/_icon-boxes.scss */
.icon-box.icon-box-style-4 .icon-box-icon object,
.icon-box.icon-box-style-4 .icon-box-icon img, .icon-box.icon-box-style-7 .icon-box-icon object,
.icon-box.icon-box-style-7 .icon-box-icon img {
  margin: 0 auto;
}
/* line 220, ../../theme/css/gui/_icon-boxes.scss */
.icon-box.icon-box-style-4.icon-box-reverse .icon-box-icon, .icon-box.icon-box-style-7.icon-box-reverse .icon-box-icon {
  margin-right: 0;
  margin-left: 1rem;
}


.icon-box-info-title h3 {margin:5px 0px;}


.rounded-border {
    border-radius: 5px !important;
}

.section-heading {
 position: relative;
 margin-bottom: 10px;
}
.section-heading h2 strong,
.section-heading h3 strong,
.section-heading h4 strong,
.section-heading h5 strong,
.section-heading h6 strong {
 font-weight: 700;
}
.section-heading h2 i,
.section-heading h3 i,
.section-heading h4 i,
.section-heading h5 i,
.section-heading h6 i {
 font-style: italic;
}


.section-heading h4 {
 position: relative;
 font-size: 30px;
 font-weight: 400;
 color: #222;
 line-height: 130%;
 margin-bottom: 10px;
 margin-top: 5px;
}
@media (max-width: 767px) {
 .section-heading h4 {
  font-size: 30px;
 }
}

.section-heading p {
 font-size: 15px;
 font-weight: 400;
 color: #777;
 line-height: 1.8;
 padding-top: 15px;
 margin-bottom: 0px;
}
.section-heading small {
 display: inline-block;
 font-size: 14px;
 font-weight: 600;
 color: #46bfe2;
 padding-bottom: 5px;
}
.large-heading {
 position: relative;
 margin-bottom: 15px;
}
.large-heading h2 {
 position: relative;
 font-size: 45px;
 font-weight: 700;
 color: #222;
 line-height: 1.4;
 margin-bottom: 15px;
}
@media (max-width: 767px) {
 .large-heading h2 {
  font-size: 30px;
 }
}
.large-heading h3 {
 position: relative;
 font-size: 39px;
 font-weight: 700;
 color: #222;
 line-height: 140%;
 margin-bottom: 15px;
}
.large-heading h4 {
 position: relative;
 font-size: 36px;
 font-weight: 600;
 color: #222;
 line-height: 140%;
 margin-bottom: 15px;
}
.large-heading h5 {
 position: relative;
 font-size: 32px;
 font-weight: 700;
 color: #222;
 line-height: 130%;
 margin-bottom: 15px;
}
.large-heading small {
 font-size: 14px;
 font-weight: 700;
 color: #46bfe2;
 line-height: 250%;
 text-transform: uppercase;
 padding-bottom: 5px;
}
.section-heading-line {
 content: '';
 display: block;
 width: 100px;
 border-radius: 10px;
 height: 6px;
 background: #46bfe2;
 margin: auto;
 margin-top: 20px;
 margin-bottom: 10px;
}
.section-heading-line-white {
 content: '';
 display: block;
 width: 100px;
 border-radius: 10px;
 height: 6px;
 background: #fff;
 margin: auto;
 margin-top: 20px;
 margin-bottom: 10px;
}
.text-left .section-heading-line {
 content: '';
 display: inline-block;
 width: 100px;
 border-radius: 10px;
 height: 6px;
 background: #46bfe2;
 margin-top: 10px;
 margin-bottom: 0px;
}
.text-right .section-heading-line {
 text-align: right;
 content: '';
 display: inline-block;
 width: 100px;
 border-radius: 10px;
 height: 6px;
 background: #46bfe2;
 margin-top: 10px;
 margin-bottom: 0px;
}
.line-thin {
 height: 4px !important;
}
.line-extra-thin {
 height: 3px !important;
}
.line-wide {
 width: 130px !important;
}

.pl-30-md {
    padding-left: 30px;
}

.icon-holder-md i {
    font-size: 55px;
    color: 
    #46bfe2;
}


/*-----------------------------------------29. Timeline-------------------------------------------*/.timeline {
 position: relative;
 max-width: 100%;
 margin: 0 auto;
}
.timeline::after {
 content: '';
 position: absolute;
 width: 2px;
 background-color: #eee;
 top: 0;
 bottom: 0;
 left: 50%;
 margin-left: -3px;
}
/* Container around content */.timeline-container {
 padding: 10px 40px;
 position: relative;
 background-color: inherit;
 width: 50%;
}
/* The circles on the timeline */.timeline-container::after {
 content: '';
 position: absolute;
 width: 12px;
 height: 12px;
 right: -4px;
 background-color: #fff;
 border: 2px solid #46bfe2;
 top: 15px;
 border-radius: 50%;
 z-index: 1;
}
.timeline-left {
 left: 0;
}
.timeline-right {
 left: 50%;
}
/* Add arrows to the left container (pointing right) */.timeline-left::before {
 content: " ";
 height: 0;
 position: absolute;
 top: 22px;
 width: 0;
 z-index: 1;
 right: 30px;
 border: medium solid white;
 border-width: 10px 0 10px 10px;
 border-color: transparent transparent transparent white;
}
/* Add arrows to the right container (pointing left) */.timeline-right::before {
 content: " ";
 height: 0;
 position: absolute;
 top: 22px;
 width: 0;
 z-index: 1;
 left: 10px;
 border: 2px solid white;
 border-width: 10px 10px 10px 0;
 border-color: transparent white transparent transparent;
}
.timeline-right::after {
 left: -8px;
}
/* The actual content */.timeline-content {
 padding: 0px 0px 50px 0px;
 background-color: white;
 position: relative;
 border-radius: 6px;
}
.timeline-content-inner {
 background: #f7f7f7;
 border-radius: 10px;
 padding: 20px 30px 30px 30px;
}
.timeline-content-inner p {
 font-size: 14px;
 color: #999;
 line-height: 1.7;
 font-weight: 400;
 margin-bottom: 0px;
}
.timeline-content h3 {
 display: block;
 color: #222;
 font-size: 16px;
 font-weight: 500;
 margin: 7px 0px;
}
.timeline h2 {
 display: block;
 color: #46bfe2;
 font-size: 16px;
 font-weight: 600;
 margin-bottom: 15px;
}
.timeline-left-all h2 {
 width: 50%;
 color: #46bfe2;
 margin-left: 50%;
 padding-left: 30px;
 margin-bottom: -35px;
}
.timeline-right-all h2 {
 width: 50%;
 text-align: right;
 color: #46bfe2;
 padding-right: 35px;
 margin-bottom: -35px;
}
@media screen and (max-width: 600px) {
 .timeline::after {
  left: 31px;
 }
 .timeline-container {
  width: 100%;
  padding-left: 70px;
  padding-right: 25px;
 }
 .timeline-container::before {
  left: 60px;
  border: medium solid white;
  border-width: 10px 10px 10px 0;
  border-color: transparent white transparent transparent;
 }
 .timeline-left::after,
 .timeline-right::after {
  left: 20px;
 }
 .timeline-right {
  left: 0%;
 }
 .timeline-left-all h2 {
  margin: 0px;
  width: 100%;
  padding-left: 65px;
  padding-bottom: 10px;
  margin-bottom: 0px !important;
  color: #45bcde;
  text-align: left !important;
 }
 .timeline-right-all h2 {
  margin: 0px;
  width: 100%;
  padding-left: 65px;
  padding-bottom: 10px;
  margin-bottom: 0px !important;
  color: #46bfe2;
  text-align: left !important;
 }
}
.timeline-left .timeline-content {
 text-align: right;
}
@media screen and (max-width: 600px) {
 .timeline-left .timeline-content {
  text-align: left;
 }
}


/*--------------------------------
    Common Styles
----------------------------------*/
.heading-inner {position: relative;display: inline-block;margin-bottom: 20px;margin-top: 0;font-size: 24px;text-rendering: optimizeLegibility;}

/*--------------------------------
    Heading Style1
----------------------------------*/
.tc-heading-style1 .heading-inner {padding-bottom: 10px;border-bottom: 1px solid rgba(0, 0, 0, 0.1);}
.tc-heading-style1 .heading-inner:after {content: '';position: absolute;height: 1px;width: 25%;bottom: -1px;left: 0;background-color: #232323;}
.tc-heading-style1.tc-heading-center {text-align: center;}
.tc-heading-style1.tc-heading-center .heading-inner:after {left: 50%;-webkit-transform: translateX(-50%);transform: translateX(-50%);}
.tc-heading-style1.tc-heading-right {text-align: right;}
.tc-heading-style1.tc-heading-right .heading-inner:after {left: auto;right: 0;}


.menu01_cont02_style p {font-size:16px;line-height:2;}




.icon-holder-md span {font-size: 32px !important;margin-left: 20px;color:#000;}


.previewAreaBox {
    border: solid 1px #2d2d2d;   
    text-align: center;
    background: #2d2d2d;
    padding: 50px 50px 50px 50px;
    width:100%;
	height: 250px;
    z-index: 9999999;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    position: relative;
	box-shadow: rgb(0, 0, 0) 10px 10px 5px;
}

.previewAreaBox h1 {font-size:36px;color:#8fc31f; }
.previewAreaBox p {color:#fff; }


@media screen and (max-width: 768px) {
.previewAreaBox {
    border: solid 1px #2d2d2d;   
    text-align: center;
    background: #2d2d2d;
    padding: 50px 50px 50px 50px;
    width:100%;
	height: 280px;
    z-index: 9999999;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    position: relative;
	box-shadow: rgb(0, 0, 0) 10px 10px 5px;
}

.previewAreaBox h1 {font-size:24px;color:#8fc31f; }
.previewAreaBox p {color:#fff; }

.tc-post-grid-style1 .post-grid-content {min-height: 110px;}


}


#divpop {
  position: absolute;
  left: 10px;
  top: 42px;
  z-index: 200;
  visibility: hidden;
  width: 480px !important;
}

@media (max-width: 480px) {
  #divpop {
    width: 90vw !important;    /* or 100vw, 또는 원하는 값 */
    min-width: 0;
    left: 5vw;      /* 혹은 left: 0; 또는 적절히 조정 */
    box-sizing: border-box;
  }
}