@charset "utf-8";
/* css setting start */


/* 팝업 popup */
#popupWrap{}
.popup {display:none; background-color:rgba(0,0,0,0.5);width:100%;height:100%;position:fixed;top:0;left:0;z-index:9999;}
.popup-btn {cursor:pointer;}
.popup .popupbox-wrap{
  position:
  fixed;
  top:50%;
  left:50%;
  transform:
  translate(-50%, -50%);
  max-width:144rem;
  background-color:#fff;
  width:90%;
  max-height: 90vh;
  overflow-y: scroll;
}

.popup .popupbox {
  padding: 5.5rem 8.5rem;
  box-shadow: 5px 5px 30px rgb(0 0 0 / 20%);
  width:100%;
}
.popup a.close {position:absolute;right: calc(8.5rem - 22px);top: 4rem;width: 2.2rem;height: 2.2rem;}
.popup a.close span{width: 30px;height: 1px;background-color: #999;}
.popup a.close span:nth-child(1){transform: rotate(45deg);transform-origin: top left;margin: 0px 0 14px 0;}
.popup a.close span:nth-child(2){transform: rotate(-45deg);transform-origin: top left;margin: -3px 0 0 0;}




/*** popup ***/
.popup{}
.popup a.close{
    top: calc(5rem - 2.2rem);
    right: calc(7rem - 2.2rem);
}
.popup a.close span{height:2px; background-color:#000;}
.popup a.close span:nth-child(1){
    margin: 0px 0px 10px 0;
}
.popup a.close span:nth-child(2){
    margin: 0px 0px -2px -1px;
}

/* popup - mail popup */
.modal_mail{}
.modal_mail .popupbox-wrap{
    max-width: 1025px;
}
.modal_mail .mailBox{
    padding: 0;
}
.modal_mail .p_header{
  background: url(/images/sub/sub01/mail_pop_bg.jpg);
  background-repeat: no-repeat;
  padding: 7rem 7rem;
  background-size: cover;
}
.modal_mail .p_header h2{
  font-size:4rem;
  color:#fff;
}
.modal_mail .p_header p{
  font-size:1.6rem;
  color:#fff;
}
.modal_mail .p_cont{
    padding: 4rem 7rem;
}
.modal_mail .p_cont .p_table{border-top:1px solid #000;}
.modal_mail .p_table dl{
  border-bottom:1px solid #dddddd;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  background-color:#f7f7f7;
}
.modal_mail .p_table dt{font-size:14px; width: 12rem;color: #000;font-weight: 600;text-align: center;}
.modal_mail .p_table dd{
    width: calc(100% - 12rem);
  padding:1rem 2rem;
    padding-right: 0;background-color:#fff;
}
.modal_mail .p_table dd input[type=text]{
    border: 1px solid #ccc;
    height: 40px;

}
.modal_mail .p_table dd textarea{
    border: 1px solid #ccc;
    font-size: 14px;
}

.modal_mail .p_table dd p{font-size:14px; padding: 1rem 0;}

.modal_mail .p_table dd .file-upload {}
.modal_mail .p_table dd .file-upload span{
    background: #fff;
    border: 1px solid #ccc;
    height: 40px;
    width: calc(100% - 140px);
}
.modal_mail .p_table dd .file-upload .upload-btn{
    float: right;
    width: 130px;
    height: 40px;
}
.modal_mail .p_table dd .file-upload button.findBtn{
    height: 40px;
    font-size: 14px;
    background-color: #111;
}
.modal_mail .p_table dd .file-upload .upload-btn input.file{}


.modal_mail .p_footer{
    padding: 0rem 7rem 8rem 7rem;
}


/* popup - acc popup */
.modal_acc .p_header{
  background: url(/images/sub/acc_pop_bg.jpg);
}

.modal_acc .box{background:#f5f5f5;display: flex;justify-content: space-between;align-items: center;margin-top: 15px;padding: 3rem;}
.modal_acc .box ul{}
.modal_acc .box li{
    font-size: 14px;
    color: #333333;
    line-height: 1.75em;
}


/* popup - popup-basic */
.popup-basic{}
.popup-basic .popupbox-wrap{
    width: fit-content;
    max-width: 90vw;
    overflow: hidden;
    min-width: 640px;
}
.popup-basic .mailBox{
    padding: 7rem 6rem;
}
.popup-basic .p_header{
    padding-bottom: 5rem;
}
.popup-basic .p_header img{
    margin: 0 auto;
}
.popup-basic .p_cont{
    text-align: center;
}
.popup-basic .p_cont p{
  font-size: 16px;
  color: #111;
  padding-bottom:4rem;
  font-weight: 500;
}
.popup-basic .p_cont h2{
  font-size: 2.2rem;
  color: #111;
  padding-bottom:5rem;
}
.popup-basic .p_footer{}
.popup-basic .p_footer ul{}
.popup-basic .p_footer ul li{
    text-align: center;
    font-size: 16px;
    color: #000000;
}
.popup-basic .p_footer ul li a{
    position: relative;
    right: unset;
    top: unset;
    display: block;
    width: fit-content;
    height: 50px;
    margin: 0 auto;
    border: 1px solid #0f3fa0;
    line-height: 50px;
    padding: 0 6rem 0 2.5rem;
    border-radius: 25px;
    font-weight: 600;
    color: #111;
    transition:all 0.2s;
}
.popup-basic .p_footer ul li a::before{
    opacity: 1;
    right: 27px;
    top: calc(50% - 0px);
    transition:all 0.2s;
}
.popup-basic .p_footer ul li a::after{
    right: 25px;
    line-height: 50px;
    top: 0;
    transition:all 0.2s;
}
.popup-basic .p_footer ul li:hover a{background-color:#0f3fa0; color:#fff;}
.popup-basic .p_footer ul li:hover a::before{transform:translateX(10px); background:#fff;}
.popup-basic .p_footer ul li:hover a::after{transform:translateX(10px); color:#fff;}



/* ===== 아이디 비밀번호찾기 ===== */
#pop-search{}
#pop-search .find-type label{font-size:1.6rem;}
#pop-search ul li input[type=submit]{font-size:1.6rem;}




/* popup - productImg */
.productImg{}
.productImg .popupbox-wrap{
    max-width: 900px;
}
.productImg .popupbox{
    padding: 5rem 7rem;
}
.productImg .p_header{
    padding-bottom: 2rem;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: end;
}
.productImg .p_header h2{font-size: 3.4rem; color:#111;width: 100%;}
.productImg .p_header p:not(.tag){font-size:1.6rem; color:#555555;vertical-align: baseline;}
.productImg .p_header p{margin-right:15px;display: inline-block;}
.productImg .p_cont{overflow:hidden;padding-top:3rem;border-top:1px solid #333333;}
.productImg ul.icon_contact{position:unset}



/* popup - popSlide */
.popSlide{
}
.popSlide .swiper-wrapper{}
.popSlide .swiper-slide{border: 1px solid #dbdbdb;}
.popSlide .swiper-slide img{width: 100%;height: 100%;object-fit: cover;object-position: center;max-height: 428px;/* overflow: hidden; */}

.popSlide .control{}
.popSlide .control .btn{}
.popSlide .control .btn div{
}
.popSlide .control .btn div::after{
    font-size: 3rem;
}
.popSlide .control .btn div.next{right: unset;left: calc(100% - 7rem + 1rem);}
.popSlide .control .btn div.prev{
    left: unset;
    right: calc(100% - 7rem + 1rem);
}
.popSlide .control .btn div.next::after{}
.popSlide .control .btn div.prev::after{}



.popSlide-thumbs{
    display: flex;
}
.popSlide-thumbs .swiper-slide{position:relative;}
.popSlide-thumbs .swiper-slide::after{
  content:'';
  position:absolute;
  width:100%;
  height:100%;
  background-color:rgba(0,0,0,0.6);
  top:0;
  left:0;
}
.popSlide-thumbs img{border:1px solid #dbdbdb;width: 100%;height: 100%;max-height: 115px;object-fit: cover;object-position: center;}


.popSlide-thumbs .swiper-slide-thumb-active{}
.popSlide-thumbs .swiper-slide-thumb-active::after{
  content:none;
}


/* ===== 회원탈퇴 / 유료회원 취소 안내 ===== */
.popup_quit_rule{}
.popup_quit_rule .popupbox{
    padding: 7rem 4rem;
}
.popup_quit_rule h2{
    font-size: 2.2rem;
    font-weight: 700;
    text-align: center;
    color: #000;
}

.popup_quit_rule .p_header{padding-bottom: 2rem;border-bottom: 1px solid #dddddd;}
.popup_quit_rule .p_cont{
    text-align: left;
    padding-top: 3rem;
}

.popup_quit_rule .p_cont > div{padding: 0rem 2rem;}
.popup_quit_rule .p_cont h6{font-size: 2.2rem;color: #000;font-weight: 700;padding-bottom: 1.5rem;position: relative;}
.popup_quit_rule .p_cont h6:before{content: '';background-image: url(/images/btn/check_on.png);width: 12px;height: 10px;position: absolute;right: calc(100% + 8px);top: 11px;}
.popup_quit_rule .p_cont p{color:#666;}
.popup_quit_rule .p_cont > div:last-child p{padding-bottom:0;}


/* css setting end */

/* media size setting start */
@media all and (max-width:1320px) {

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

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

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


/* popup - productImg */
.productImg{}
.productImg .popupbox-wrap{}
.productImg .popupbox{padding: 5rem;}
.productImg .p_header{}
.productImg .p_header h2{font-size: 2.8rem;}
.productImg .p_header p:not(.tag){}
.productImg .p_header p{}
.productImg .p_cont{}
.productImg ul.icon_contact{}



/* popup - popSlide */
.popSlide{}
.popSlide .swiper-wrapper{}
.popSlide .swiper-slide{}
.popSlide .swiper-slide img{}

.popSlide .control{}
.popSlide .control .btn{}
.popSlide .control .btn div{top: 400px;}
.popSlide .control .btn div::after{}
.popSlide .control .btn div.next{right: unset;left: calc(100% - 5rem + 1rem);}
.popSlide .control .btn div.prev{right: calc(100% - 5rem + 1rem);}
.popSlide .control .btn div.next::after{}
.popSlide .control .btn div.prev::after{}


/* popup - mail popup */
.modal_mail{}
.modal_mail .popupbox-wrap{}
.modal_mail .mailBox{}
.modal_mail .p_header{padding: 5rem;}
.modal_mail .p_header h2{ font-size: 3.6rem;}
.modal_mail .p_header p{}
.modal_mail .p_cont{ padding: 4rem 5rem;}


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

/*** popup ***/
.popup{}
.popup a.close{
    top: calc(5rem - 2.2rem);
    right: calc(5rem - 2.2rem);
}
.popup a.close span{}
.popup a.close span:nth-child(1){}
.popup a.close span:nth-child(2){}

  /* popup - popup-basic */
  .popup-basic{}
  .popup-basic .popupbox-wrap{min-width: unset; width: 90%;}
  .popup-basic .mailBox{
    padding: 5rem 4rem;
}
  .popup-basic .p_header{
    padding-bottom: 3rem;
}
  .popup-basic .p_cont{}
  .popup-basic .p_cont p{
    padding-bottom: 2rem;
}
  .popup-basic .p_cont h2{
    font-size: 1.8rem;
    padding-bottom: 4rem;
}

  /* popup - mail popup */
  .modal_mail{}
  .modal_mail .popupbox-wrap{}
  .modal_mail .mailBox{}
  .modal_mail .p_header{ padding: 4rem 3rem;}
  .modal_mail .p_header h2{font-size: 2.8rem;}
  .modal_mail .p_header p{}
  .modal_mail .p_cont{padding: 3rem;}
  .modal_mail .p_cont .p_table{}
  .modal_mail .p_table dl{}
  .modal_mail .p_table dt{width: 7rem;}
  .modal_mail .p_table dd{width: calc(100% - 7rem);}



  /* popup - productImg */
  .productImg{}
  .productImg .popupbox-wrap{}
  .productImg .popupbox{ padding: 5rem 3rem 3rem;}
  .productImg .p_header{}
  .productImg .p_header h2{font-size: 2.4rem;}
  .productImg .p_header p:not(.tag){}
  .productImg .p_header p{}
  .productImg .p_cont{}
  .productImg ul.icon_contact{}

  .popSlide-thumbs{display:none;}



}
@media all and (max-width:480px) {
  /* popup - popup-basic */
  .popup-basic{}
  .popup-basic .p_footer{}
  .popup-basic .p_footer ul{}
  .popup-basic .p_footer ul li{}
  .popup-basic .p_footer ul li a{
    font-size: 14px;
}


}
/* media size setting end */