@charset "UTF-8";

/* 싱글 팝업 */
.popwrap { position : fixed; box-shadow : 4rem 4rem 20rem rgba(0,0,0,.1); border : 1px solid #e9e9e9; background : #fff }

 .popwrap .popbody {}

 .popwrap .popbody img{
  	width : 100% !important;
  	height : 100% !important;
  	-o-object-fit : contain !important;
  	object-fit : contain !important;
  	-o-object-position : center !important;
  	object-position : center !important;
  	max-width: 100%;
}

.popwrap .popfooter {
	padding : 0;
	background : #000;
	color : #fff;
	text-align : left;
	position : relative;
}

.popwrap .popfooter .btn_close_period { padding : 10px 20px; background : #000;  text-align : left; boarder : 0; color : #fff; }
.popwrap .popfooter .btn_close_period .close_txt { }

.popwrap .popfooter .btn_close_period span.today-text1{opacity:1;}
.popwrap .popfooter .btn_close_period span.today-text2{opacity:0;}

.popwrap .popfooter .btn_close_day { padding : 10px 20px; background : #393939; position: absolute; top: 0; right: 0; border :0; color : white }

.popwrap .popfooter::after {
	display: block;
	visibility: hidden;
	clear: both;
	content: "";
}

/*
.popwrap .popfooter .layer_close_period:hover .popwrap .popfooter .layer_close_period .close_txt.today-text1{opacity:0;}
.popwrap .popfooter .layer_close_period:hover .popwrap .popfooter .layer_close_period .close_txt.today-text2{opacity:1;} 
*/

@media screen and (max-width: 1200px) {
	.popwrap {left:50% !important; top: 50% !important; transform : translate(-50%, -50%) !important; }
 	.popwrap .popfooter .btn_close_period span.today-text2 { display: none !important; }
}

/* 모바일 */
@media screen and (max-width: 767px) {
	.popwrap {width : 85% !important; left:50% !important; top: 22.4rem !important; transform : translate(-50%, -50%) !important; }
	.popwrap .popbody { width : 100% !important; height: auto !important; }
	.popwrap .popfooter .btn_close_period { width : 100% !important; height : auto !important; padding : 0.5rem 1.25rem !important;  }
	.popwrap .popfooter .btn_close_day { padding : 0.5rem 1.25rem !important; }
	
}

/* 모바일 */
@media screen and (max-width: 434px) {
	.popwrap .popfooter .btn_close_period { width : 100% !important; height : auto !important; padding : 0.25rem 0.4rem !important;  }
	.popwrap .popfooter .btn_close_day { padding : 0.25rem 0.4rem !important; }
}



/* 싱글 팝업 */


/* 멀티팝업 PC */

.main-popup-sect{
	display:block; 
	opacity:1; 
	visibility:visible; 
}

.main-popup-sect .swiper-wrapper{height:auto;}

.main-popup-sect .swiper-pagination {
  bottom: 0 !important;
}


/* 단일 건일 경우에도 bullet 출력 : 더 유효성 높이기 위해 상위 클래스도 포함 */
.main-popup-sect .swiper-pagination .swiper-pagination-bullet:only-child { display: block !important; }


.main-popup-sect .swiper-slide img {
	width : 100% !important;
}

.main-popup-sect .swiper-pagination span {
  	width: 100% !important;
  height: 100%  !important;
  display: inline-block;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.main-popup-sect .swiper-pagination span:after {
  content: "";
  width: 20px;
  height: 20px;
  margin-left: -6px;
  margin-top: -6px;
  border-radius: 999px;
  border: 1px solid white;
  display: inline-block;
}


.main-popup-modal-item-bg{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 10% 0 0 0;
  opacity:1;
  visibility:visible;
  z-index: 111;
  background: rgba(0,0,0,.4);
}

.main-popup-modal-item{
  position: fixed;
  top: 50%;
  left: 50%;
  width: 100%;
  max-width:1000px;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%); 
  -moz-transform: translate(-50%, -50%); 
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  padding: 10% 0 0 0;
  opacity:1;
  visibility:visible;
  z-index: 111;
}
.main-popup-slider-madal{position:absolute; top:50%; left:50%; width:100%; max-width:1000px; height:29.313rem; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); margin:0 auto; background:rgba(254, 254, 254, 0); z-index:-1;}
.main-popup-modal-slider{position:relative; width:100%; height:100%;}
.main-popup-modal-slider > .swiper-wrapper{transform:none;}
.main-popup-modal-slider > .swiper-wrapper > .swiper-slide{position:relative; width:auto; height:100%;}
.main-popup-modal-slider > .swiper-wrapper > .swiper-slide > a{display:block; width:100%; height:100%; cursor: pointer;}
.main-popup-sect .swiper-pagination.main-popup-pagination{position:relative; width:100%; max-width:1000px; height:35px; margin:0 auto;}
.main-popup-sect .stp-wrap .swiper-pagination-bullet{width: 25%; height: 35px; font-size:15px; border-radius:0; margin:0; padding:7px 0 0 0; border-right:1px solid #d9d9d9; box-sizing:border-box; color:#000; background-color: #fff; opacity: 1; vertical-align: middle; font-weight:300;}
/*.stp-wrap .swiper-pagination-bullet:hover{color:#006241; font-weight:500;}*/
.main-popup-sect .stp-wrap .swiper-pagination-bullet:last-child{border-right:none;}
.main-popup-sect .stp-wrap .swiper-pagination-bullet-active{width: 25%; height: 35px; color:#006241; opacity:1; font-weight:500;}

.stp-btn{position:relative; width:100%; max-width:1000px; height:34px; margin:0 auto; background:#222; display:block;}
.main-popup-today{position:relative; width:20%; height:100%; font-size:12px;}
.main-popup-today .today-text{position:absolute; top:46%; left:0%; width:100%; color:#fff; transform:translateY(-50%); padding:0 0 0 10px; cursor:pointer; transition: 0.8s;}
.main-popup-today:hover .today-text.today-text1{opacity:0;}
.main-popup-today:hover .today-text.today-text2{opacity:1;}
.main-popup-today .today-text1{opacity:1;}
.main-popup-today .today-text2{opacity:0;}

.main-popup-close-modal-btn{
  position: absolute;
  top:7px;
  right:10px;
  width:20px;
  height:20px;
  cursor: pointer;
  transition:all 0.8s;
  transform:rotate(0deg);
  transform-origin:50% 50%;
  z-index:3;
}

.main-popup-close-modal-btn img{background-color : white;}
.main-popup-close-modal-btn:hover{transform:rotate(90deg);}

.main-popup-ctrls{width: 80px; height: 48px; background: url(../img/best-review-ctrls.png)0 0/200% no-repeat; position: absolute; top:46%; z-index:3;}
.main-popup-ctrls.prev{background-position: 0 0; left:calc(50% - 775px); }
.main-popup-ctrls.next{background-position: 100% 0; left:calc(50% + 695px);}

.main-popup-text{padding:3% 0 3% 4%;}
/* 멀티팝업 PC */

/* 멀티팝업 모바일 */
@media screen and (max-width: 1200px) {
		
		.main-popup-modal-item{
			  position: fixed;
			  top: 50%;
			  left: 50%;
			  width: 100%;
			  max-width:85%;
			  transform: translate(-50%, -50%);
			  -webkit-transform: translate(-50%, -50%); 
			  -moz-transform: translate(-50%, -50%); 
			  -ms-transform: translate(-50%, -50%);
			  -o-transform: translate(-50%, -50%);
			  padding: 10% 0 0 0;
			  opacity:1;
			  visibility:visible;
			  z-index: 111;
			}

		
		.main-popup-slider-madal{position:absolute; top:50%; left:50%; width:100%; max-width:85%; height:auto; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); margin:0 auto; background:rgba(254, 254, 254, 0); z-index:-1;}
		
		
		.main-popup-modal-slider.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{bottom:3%}
		.main-popup-modal-slider .swiper-pagination-bullet{width: 6px; height: 6px; background-color: #fff; opacity: 0.8; vertical-align: middle;}
		.main-popup-modal-slider .swiper-pagination-bullet-active{width: 10px; height: 10px; background-color: #006241; opacity:1;}
		
		.stp-btn{position:relative; width:100%; max-width:100%; height:40px; margin:0 auto; background:#212121; display:block;}
		
		
		.main-popup-today{position:relative; width:40%; height:100%; font-size:1rem;}
		.main-popup-today .today-text{position:absolute; top:48%; left:0%; width:100%; color:#fff; transform:translateY(-50%); padding:0 0 0 10px; cursor:pointer; transition: 0.8s;}
		
		.main-popup-close-modal-btn{
		  position: absolute;
		  top:10px;
		  right:10px;
		  width:20px;
		  height:20px;
		  cursor: pointer;
		  transition:all 0.8s;
		  transform:rotate(0deg);
		  transform-origin:50% 50%;
		  z-index:3;
		}
		.main-popup-close-modal-btn:hover{transform:rotate(180deg);}
}


/* 멀티팝업 모바일 */