@CHARSET "UTF-8";

.layerpopup {position: fixed; top:50%; left: 50%; width: 350px; height: 350px;  transform: translateX(-50%)translateY(-50%); border-top-left-radius: 15px; border-top-right-radius: 15px; z-index: 1000; border-top-left-radius: 10px; background: url(/images/popup.jpg); background-size: 100% 100%; background-repeat: no-repeat;  }
.layerpopup .popup_content  {width: 350px; height: 350px; box-shadow:0 12px 15px 0 rgba(0,0,0,.24),0 17px 50px 0 rgba(0,0,0,.19); position: relative; top:0; left:0;}
.layerpopup .popup_content div {position: absolute; top:10%; left: 50%; transform: translateX(-50%); color: #333; font-size: 15px; width: 75%; text-align: center; }
.layerpopup .popup_content h2 {color: #7daca8;}
.layerpopup .popup_content p {margin-top: 15px;}
.layerpopup .popup_bottom {background: #d96867; color: #fff; overflow: hidden; position: relative; top:0%; width: 350px; height: 36px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; line-height: 36px; text-align: right;}
.layerpopup .popup_bottom .btn_close:hover {text-decoration: underline;}
.layerpopup .popup_bottom .btn_close {margin-left: 12px; margin-right: 20px;}

.join_layerpopupbg {display: none; background: rgba(1, 1, 1, 0.8); z-index: 10; position: fixed; top: 0; left: 0; width: 100%; height: 100%; color: #000;}

/*** popup ***/
#layerpopupbg {background: rgba(1, 1, 1, 0.7); position: fixed; z-index: 999; width: 100%; height: 100%; left: 0; top: 0; color: #fff;}
#layerpopup {border-radius: 5px 5px 0 0; max-width: 400px; text-align: center; background: #fff; margin: 10% auto; box-shadow:0 12px 15px 0 rgba(0,0,0,.24),0 17px 50px 0 rgba(0,0,0,.19); color:#000;}
/* popup 상단 */
.popup_title {padding-top: 30px; font-size: 18px;}
.popup_content {font-size: 14px;}
/* popup 하단 */
.popup_bottom {/* background: #ccc; */ overflow: hidden; position: relative;/*  margin-top: 40px; */}
.popup_bottom a {display: block; color:#000; float: left; width: 50%; height: 40px; line-height: 40px; text-align: center; font-size: 13px; border: 1px solid #ddd;}
.btn_close {display: inline-block; position: relative; cursor: pointer; border-left-style: hidden !important; /* background-color: #7daca8; color:#fff !important; */}

.review_write {margin-top: 3%;}

@media screen and (max-width:440px){
    #layerpopup {max-width: 320px;}
}


/* 팝업 메시지 - 설정 */
#modal_msg_setting {}
#modal_msg_setting .modal-window {width: 584px;  height:initial; transform: translate(0, 100%);}
#modal_msg_setting .modal-window .modal_content_wrap {width: initial; width: 524px;}
#modal_msg_setting .modal-window .modal_content_wrap .modal_content.msg_settings .content_box ul {flex-direction: column;}
#modal_msg_setting .modal-window .modal_content_wrap .modal_content.msg_settings .content_box ul li {justify-content: space-between; align-items: center; margin-bottom: 0;    font-size: 16px;  color: #3F3F3F;}
/* modal_popup real_time_msg ----------------------------------------------------------------------------------------- */

/* modal_popup  buy_popup ----------------------------------------------------------------------------------------- */
.buy_popup {position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; z-index: 999999;}
.buy_popup.hidden {display: none;}
/* .modal_background {display: none;} */
.buy_popup .modal_bg {width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6);}
.buy_popup .title {}
.buy_popup .title h2 {font-weight: 500;  font-size: 22px;  line-height: 25px;  color: #000; text-align: center;}
.buy_popup .close-area {cursor: pointer;  position: absolute;  top: 32px;  right: 32px; padding: 5px;}
.buy_popup .modal-window {background: #FFF;  border-radius: 14.5px;  position: absolute;  width: 585px; top: 0px; transform: translate(0, 40%);  height: 560px;  overflow-y: auto;  padding: 42px 0 0; box-sizing: border-box;}
.buy_popup .modal-window::-webkit-scrollbar {display: none;}

.buy_popup .modal_content_wrap {width: 524px; margin: 0 auto;}
.buy_popup .modal_content_wrap .modal_content {margin-top: 42px;}
.buy_popup .modal_content_wrap .modal_content .content_tit {font-size: 16px;  line-height: 18px;  letter-spacing: 0.025em;  color: #3F3F3F;  margin-bottom: 16px; }
.buy_popup .modal_content_wrap .modal_content .content_tit strong {font-weight: 500;  font-size: 12px;  letter-spacing: 0.025em;  color: #FB460E; margin-left: 2px;}
.buy_popup .modal_content_wrap .modal_content .content_tit.on::after {content: "*";  font-size: 16px;  line-height: 18px;  color: #FB460E;  margin-left: 4px;}
.buy_popup .modal_content_wrap .selected_item {display: flex;  align-items: center;  justify-content: space-between;}
.buy_popup .modal_content_wrap .selected_item li {font-size: 18px;  line-height: 21px;  color: #3F3F3F;}
.buy_popup .modal_content_wrap .selected_item .item_info {width: 304px;}
.buy_popup .modal_content_wrap .selected_item .item_info .info_sub {letter-spacing: 0.01em;  color: rgba(63, 63, 63, 0.4); margin-top: 12px;}
.buy_popup .modal_content_wrap .selected_item .item_info .info_opt {font-weight: 300;  color: #3F3F3F; margin-top: 22px;}
.buy_popup .modal_content_wrap .point_info {border-top: 1.3172px solid #E6E6E6;}
.buy_popup .modal_content_wrap .point_info li {border-bottom: 1.3172px solid #E6E6E6; padding: 16px 0; display: flex;  justify-content: space-around;}
.buy_popup .modal_content_wrap .point_info li p {font-size: 16px;  line-height: 18px;  color: #3F3F3F;}


/* button */
.buy_popup .btnbox {border-radius: 0px 0px 14.5px 14.5px;  margin-top: 54px; position: absolute;  bottom: 0;  width: 100%;}
.buy_popup .btnbox ul {display: flex;}
.buy_popup .btnbox ul li {width: 50%; display: flex;  justify-content: center;}
.buy_popup .btnbox ul li a {width: 100%;  text-align: center;  padding: 17px 0;  font-size: 23px;  line-height: 26px;}
/* modal_popup  buy_popup ----------------------------------------------------------------------------------------- */

/* modal_popup  buy_popup2 ----------------------------------------------------------------------------------------- */
/* 쉐도우 효과*/
.shadow {  position: fixed;  left: 0;  top: 0;  background: rgba(0, 0, 0, 0.52);  width: 100%;  height: 100vh;  display: none; z-index: 999;     height: 100%;}

/* 0628수정사항 - 알림팝업 투명 뒷배경 추가 */
.white_shadow { display: none; background-color: transparent; width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 999;}
/* 알림팝업 투명 뒷배경 추가 끝 */

/* 0622수정사항 - 배경클릭안되는 쉐도우효과 추가(휴대폰인증팝업에 필요) */
.shadow_blocking {  position: fixed;  left: 0;  top: 0;  background: rgba(0, 0, 0, 0.52);  width: 100%;  height: 100vh;  display: none; z-index: 9999;     height: 100%;}
/* 배경클릭안되는 쉐도우효과 끝 */

/* 팝업 기본디자인 */
/* 0919수정사항 - 일부 팝업들이 뒷그림자에 가려지던 현상 수정 */
.popup {display: none; background: #FFF;  border-radius: 14.5px;  position: fixed;  width: 585px;   overflow-y: auto;  padding: 42px 0 0;  box-sizing: border-box;  z-index: 1000001;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);}
/* 일부 팝업들이 뒷그림자에 가려지던 현상 수정 끝 */
.popup .title {font-weight: 500;  font-size: 22px;  line-height: 25px;  color: #000;  text-align: center;}
.popup .close-area {cursor: pointer;  position: absolute;  top: 37px;  right: 30px;  padding: 5px;}

/* 0707수정사항 - 쌀콘장착하기 팝업 내부여백값 수정 */
.popup .modal_content_wrap {width: 524px; margin: 0 auto; padding: 40px 0 110px;}
.item_equip.popup .modal_content_wrap{padding:40px 0 0px;}
/* 쌀콘장착하기 팝업 내부여백값 수정 끝 */
.popup .modal_content_wrap .modal_content {margin-top: 42px;}
/* 0630수정사항 - 쌀먹장터_구매팝업 문구추가로 인한 여백 조절 */
.popup .modal_content_wrap .modal_content .content_tit {font-size: 16px;  line-height: 18px;  letter-spacing: 0.025em;  color: #3F3F3F;  margin-bottom: 16px; }
/* 쌀먹장터_구매팝업 문구추가로 인한 여백 조절 끝 */
.popup .modal_content_wrap .modal_content .content_tit strong {font-weight: 500;  font-size: 12px;  letter-spacing: 0.025em;  color: #FB460E; margin-left: 2px;}
.popup .modal_content_wrap .modal_content .content_tit.on::after {content: "*";  font-size: 16px;  line-height: 18px;  color: #FB460E;  margin-left: 4px;}
.popup .modal_content_wrap .selected_item {display: flex;  align-items: center;  justify-content: space-between;}
.popup .modal_content_wrap .selected_item li {font-size: 18px;  line-height: 21px;  color: #3F3F3F;}
.popup .modal_content_wrap .selected_item .item_info {width: 304px;}
.popup .modal_content_wrap .selected_item .item_info .info_sub {letter-spacing: 0.01em;  color: rgba(63, 63, 63, 0.4); margin-top: 12px;}
.popup .modal_content_wrap .selected_item .item_info .info_opt {font-weight: 300;  color: #3F3F3F; margin-top: 22px;}
/* 0630수정사항 - 쌀먹장터_구매팝업 문구추가 */
.popup .modal_content_wrap .expiration_notice { margin-top:18px; color : red; text-align:center; font-size:18px; }
/* 쌀먹장터_구매팝업 문구추가 끝 */
.popup .modal_content_wrap .point_info {border-top: 1.3172px solid #E6E6E6;}
.popup .modal_content_wrap .point_info li {border-bottom: 1.3172px solid #E6E6E6; padding: 16px 0; display: flex;  justify-content: space-around;}
.popup .modal_content_wrap .point_info li p {font-size: 16px;  line-height: 18px;  color: #3F3F3F;}
.popup .modal_content_wrap .point_info li p.lack_points {color: #FB460E;}
.popup .modal_content_wrap .alarm_lack_points {  display: flex;  align-items: center;  justify-content: center;  font-size: 18px;  line-height: 21px;  color: #3F3F3F; margin-top: 40px;}
.popup .modal_content_wrap .alarm_lack_points img {margin-right: 12px;}

/* button */
.popup .btnbox {border-radius: 0px 0px 14.5px 14.5px;  margin-top: 54px; position: absolute;  bottom: 0;  width: 100%;}
.popup .btnbox ul {display: flex;}
.popup .btnbox ul li {width: 100%; display: flex;  justify-content: center;}
.popup .btnbox ul li a {width: 100%;  text-align: center;  padding: 17px 0;  font-size: 23px;  line-height: 26px;}


/* 0626수정사항 - 커밍순팝업 css */
.popup.mini_popup.charge_comingsoon .btnbox{ margin-top: 70px; position: relative;}
.popup.mini_popup.charge_comingsoon{ height: auto;}
/* 커밍순팝업 css 끝 */

/* 미니팝업 기본디자인 */
.mini_popup {height: 327.66px;}
.mini_popup .modal_content_wrap {padding: 0;}
.mini_popup .modal_content_wrap .buy_question {text-align: center;  margin-top: 62px;}
.mini_popup .modal_content_wrap .buy_question p {font-size: 18px;  line-height: 193%;  color: #3F3F3F;}
/* modal_popup  buy_popup2 ----------------------------------------------------------------------------------------- */


/* 광고팝업 -------------------------------------------- */
.shadow_AD {display: none; position: fixed;  left: 0;  top: 0;  background: rgba(0, 0, 0, 0.52);  width: 100%;  height: 100vh;  display: none;  z-index: 999;  height: 100%;}
.ad_popup {position: fixed;   top: 50%;  left: 50%;  transform: translate(-50%, -50%);  z-index:9999; border-radius: 15px; overflow: hidden; text-align: center;}
.ad_popup .ad_img_box img {object-fit: cover; width: 100%; max-width: 950px; max-height: 800px; min-width: 365px;  min-height: 540px;}

.ad_popup.text .ad_text_box {background: #fff; padding: 40px 66px; width: 453px; max-height: 1000px;     overflow-y: auto;}
.ad_popup.text .ad_text_box .notice_title {font-size: 20px;  line-height: 23px;  color: #000;margin-bottom: 60px;}
.ad_popup.text .ad_text_box .notice_text {font-size: 18px;  line-height: 21px;  color: #3F3F3F;}

.ad_popup .ad_btn_box {background: #FFF; display: flex; align-items: center; padding: 17px 30px;    margin-top: -5px;}
.ad_popup.text .ad_btn_box {background: #E1E1E1;}
.ad_popup .ad_btn_box .btn_close {font-size: 23px;  line-height: 26px;  color: #BCBCBC;}
.ad_popup .ad_btn_box p {display: flex; align-items: center;}
.ad_popup .ad_btn_box p input + label:before {width: 24px; height: 24px; background-size: 18px; border-radius: 50%;}
.ad_popup .ad_btn_box .btn_close.normal {margin-left: auto; color: #3F3F3F;}


/* 광고팝업 -------------------------------------------- */





/* 모달 팝업 Start -------------------------------------------- */

/* 커밍순팝업 css */
.popup.mini_popup.charge_comingsoon .btnbox{ margin-top: 70px; position: relative;}
.popup.mini_popup.charge_comingsoon{ height: auto;}
/* 커밍순팝업 css 끝 */

/* 미니팝업 기본디자인 */
.mini_popup {height: 327.66px;}
.mini_popup .modal_content_wrap {padding: 0;}
.mini_popup .modal_content_wrap .buy_question {text-align: center;  margin-top: 62px;}
.mini_popup .modal_content_wrap .buy_question p {font-size: 18px;  line-height: 193%;  color: #3F3F3F;}



/* 모달 팝업 End -------------------------------------------- */



/* 공통 check_box */
p input[type="checkbox"] {  display:none;  }/*input 은 숨겨주기*/
p input + label{  cursor:pointer; letter-spacing: 0.025em;  color: #3F3F3F;}/*input 바로 다음의 label*/
p input + label:before{  content:"";  display:inline-block;  width:17px;  height:17px; vertical-align:middle;/*체크 전과 체크 후 높이 차이 때문에 설정*/  margin-right: 10px;  background: #F9F9F9;  border: 1px solid #E4E4E4;}/*input 바로 다음의 label:before 에 체크하기 전 CSS 설정*/
p input:checked + label:before{  content:""; background: #fff url(/images/check_blue.svg) no-repeat center center;  }/*checked된 input 바로 다음의 label:before 에 체크 후 CSS 설정*/  




/* 태블릿 사이즈 (1200px ~ 650px)  */
@media screen and (max-width:1200px) {
  .layout_fix {width: 96%; margin: 0 auto; position: initial;}
  .mini_popup { width: 93%; }
  .mini_popup.liked { height: 250px; }
  .mini_popup .modal_content_wrap { width: initial; }