@import url(//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSansNeo.css);
@import url(https://fonts.googleapis.com/css2?family=Poppins&display=swap);

* { font-family: 'Spoqa Han Sans Neo', 'sans-serif'; }
html{overflow: hidden;height: 100%;}
body{margin: 0 !important;overflow-x: hidden;height: 100%;}
a{color:#2E2FD0;}
h1,h2,h3,h4,h5,p{margin:0;}
a.link{color: #000000;text-decoration: none;}
.dnone{display: none !important}
.d-none{display: none !important}
.clear{clear: both;}
.pt4{padding-top: 4px !important;}
.pt10{padding-top: 10px !important;}
.pb30{padding-bottom: 30px !important;}
.pr30{padding-right: 30px !important;}
.pb140{padding-bottom: 140px !important;}
.mt30{margin-top: 30px !important;}
.mt120{margin-bottom: 120px !important;}
.space{display: inline-block;}
.text-left{text-align: left;}
.text-center{text-align: center;}
.text-right{text-align: right;}
em{font-style: normal;}
button{cursor: pointer;}
ul{margin:0;padding:0;list-style-type: none;}
div.width{width:1170px;margin: 0 auto;}
@media (max-width: 1250px) {
    div.width{padding: 0px 48px;width:auto;}
}
@media (max-width: 800px) {
    div.width{padding: 0px 16px;width:auto;}
}
button.disabled{opacity: 0.4;}
body.pc{margin: 0 auto !important;max-width: 400px;border: 1px solid #e5e3e3;}
body.pc::-webkit-scrollbar{width: 5px;}
body.pc::-webkit-scrollbar-track{background: #F1F1F1;}
body.pc::-webkit-scrollbar-thumb{background: #C1C1C1;height: 20%;border-radius: 10px;}
body.pc .divSearchStore::-webkit-scrollbar{width: 5px;}
body.pc .divSearchStore::-webkit-scrollbar-track{background: #F1F1F1;}
body.pc .divSearchStore::-webkit-scrollbar-thumb{background: #C1C1C1;height: 20%;border-radius: 10px;}

.pc .headerTitle{max-width: 366px;}
.pc.scroll .headerTitle{max-width: 361px;}

/** input switch */
.switchInput{position: relative;display: inline-block;width: 33px;height: 17px;}
.sliderInput{position: absolute;cursor: pointer;top: 0;left: 0;right: 0;bottom: 0;background-color: #D4D4D4;-webkit-transition: .4s;transition: .4s;}
.sliderInput:before{position: absolute;content: "";height: 13px;width: 13px;left: 3px;bottom: 2px;background-color: white;-webkit-transition: .4s;transition: .4s;}
.switchInput input{display: none;}
.switchInput input:checked + .sliderInput{background-color: #FF7949;}
.switchInput input:focus + .sliderInput{box-shadow: 0 0 1px #2196F3;}
.switchInput input:checked + .sliderInput:before{-webkit-transform: translateX(15px);-ms-transform: translateX(15px);transform: translateX(15px);}
.switchInput .sliderInput.round {border-radius: 34px;}
.switchInput .sliderInput.round:before {border-radius: 50%;}

/** 이미지 확대 */
.imageExpand{cursor: pointer;z-index: 10;}
.img-expand{width: 100%;height: 100%;position: fixed;top: 0;left: 0;background-color: rgba(0, 0, 0, 0.4);display: flex;align-items: center;z-index: 10;}
.img-expand > div{position: relative;margin: 0 auto;max-width: 80%;height: 100%;}
.img-expand > div div.head{width: 100%;height: 68px;background-color: #ffffff;position: relative;}
.img-expand > div div.cont{padding: 60px;background-color: #fff;position: relative;width: calc(100% - 120px);height: calc(90% - 60px);border-radius: 12px;background-color: #000000;overflow: auto;}
.img-expand > div div.cont img{width: 100%;}
.img-expand > div.height{position: relative;margin: 0 auto;max-width: 80%;height: 90%;}
.img-expand > div.height div.cont img{height: 100%}
.img-expand > div div.head .close {position: absolute;width: 24px;height: 24px;top: 20px;right: 20px;cursor: pointer;background-image: url("/static/images/icon/iconClose.svg");background-size: 24px;}
@media (max-width: 800px) {
    .img-expand > div{max-width: 100%;height: 100%;width:100%;}
    .img-expand > div.height{max-width: 100%;height: 100%;}
    .img-expand > div div.cont{width: 100%;height: calc(100% - 68px);border-radius: 0;padding: 0;display: grid;align-items: center;}
    .img-expand > div div.cont img{width: calc(100% - 20px);padding: 0 10px;}
    .img-expand > div.height div.cont img{height: calc(100% - 140px);padding: 70px 10px;}
}

/** 복사완료 팝업 */
#divCopyTxt {background-color: #ffffff;border-radius: 12px;box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);position: absolute;top:0;transition: 2s;opacity: 1;transition-delay: 1s;}
#divCopyTxt span {color: #333333;font-size: 14px;opacity: 0.8;font-weight: normal;display: block;padding: 30px 40px;}
@media (max-width: 800px) {
    #divCopyTxt{top:50% !important;left: 50% !important;transform: translate( -50%, -50% );}
}

/** CK Editor */
.ckEditer ul,.ckEditer ol{padding-left: 2rem;margin-top: 0;margin-bottom: 1rem;box-sizing: border-box;}
.ckEditer ul{list-style-type: disc}
.ckEditer ul li{display: list-item;text-align: -webkit-match-parent;}
.ckEditer p{margin-bottom: 1rem;}

/** swiper */
.swiper {width: 100%;height: 100%;}
.swiper-slide {text-align: center;font-size: 18px;background: #fff;display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;width: 85%;padding-right: 10px;}
.swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;}
.swiper .swiper-button-prev,.swiper .swiper-button-next{background-size: 90px;width: 90px;height: 90px;top: calc(50% - 25px);}
.swiper .swiper-button-next.swiper-button-disabled, .swiper .swiper-button-prev.swiper-button-disabled{display: none;}
.swiper .swiper-button-prev{background-image: url("/images/v2/btn/btnPaging1.svg");background-size: 90px;width: 90px;height: 90px;    margin-top: -40px;}
.swiper .swiper-button-next{background-image: url("/images/v2/btn/btnPaging2.svg");background-size: 90px;width: 90px;height: 90px;    margin-top: -40px;}
.swiper .swiper-button-prev:after,.swiper .swiper-button-next:after{content: ' '}
.swiper .swiper-pagination{position: relative;padding-top: 20px;}
.swiper .swiper-pagination .swiper-pagination-bullet{background-color: #E4E4E4;width: 11px;height: 11px;margin-right: 10px;opacity: 1;}
.swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color: #02B763}

/** input - checkbox */
input[type=checkbox]{display: none;}
input[type=checkbox]+label {padding-left: 34px;background-image: url('/static/images/icon/iconCheckOff.svg');background-position-y: center;background-size: 24px;background-repeat: no-repeat;height: 24px;display: inline-flex;align-items: center;}
input[type=checkbox]:checked+label {background-image: url('/static/images/icon/iconCheckOn.svg');}
input[type=checkbox]:disabled+label{opacity: 0.5;}

/** input - checkbox */
input[type=checkbox].type01+label{background-image: url('/static/images/icon/iconCheckType1Off.svg')}
input[type=checkbox].type01:checked+label {background-image: url('/static/images/icon/iconCheckType1On.svg')}

/** input - radio */
input[type=radio]{display: none;}
input[type=radio]:checked{background-image: url('/static/images/icon/iconRadioOn.svg');background-position-y: 2px;}
input[type=radio]+label {padding-left: 34px;background-image: url('/static/images/icon/iconRadioOff.svg');background-repeat: no-repeat;background-position-y: center;height: 24px;display: inline-flex;align-items: center;}
input[type=radio]:checked+label {background-image: url('/static/images/icon/iconRadioOn.svg');}
input[type=radio]:disabled+label{opacity: 0.5;}

/** selectbox */
select{border: 1px #CDCDCD solid;border-radius: 7px;padding: 16px;background: url('/static/images/icon/iconSelectBoxArrow.svg') no-repeat;background-position-x: 95%;background-position-y: center;appearance: none;}

/** alert */
.alertPopup{background-color: rgba(51,51,51,0.8);position: fixed;top: 0;left: 0;width: 100%;height: 100%;display: flex;z-index: 1000;}
.alertPopup > div{background-color: #FFFFFF;border-radius: 31px;position: relative;flex:1;margin: auto 17px;width: 100%;padding: 56px 17px 20px;}
.pc .alertPopup > div{margin: auto;max-width: 350px;}
.alertPopup > div p {color: #373454;font-size: 18px;font-weight: 500;text-align: center;padding-bottom: 57px;}
.alertPopup > div p em{font-size: 14px;}
.alertPopup > div button {background-color: #02B763;border-radius: 12px;color: #FFFFFF;font-size: 16px;font-weight: 500;width: 100%;border: none;padding: 17px 0;}

/** confirm */
.confirmPopup{background-color: rgba(51,51,51,0.8);position: fixed;top: 0;left: 0;width: 100%;height: 100%;display: flex;z-index: 1000;}
.pc .confirmPopup > div{margin: auto;max-width: 350px;}
.confirmPopup > div{background-color: #FFFFFF;border-radius: 31px;position: relative;flex:1;margin: auto 17px;width: 100%;padding: 56px 17px 20px;}
.confirmPopup > div p {color: #373454;font-size: 18px;font-weight: 500;text-align: center;padding-bottom: 57px;}
.confirmPopup > div > div {display: flex;}
.confirmPopup > div > div button.ok {background-color: #02B763;border-radius: 12px;color: #FFFFFF;font-size: 16px;font-weight: 500;width: 100%;border: none;padding: 17px 0;margin-right: 10px;}
.confirmPopup > div > div button.cancel {background-color: #ffffff;border-radius: 12px;color: #333333;font-size: 16px;font-weight: 500;width: 100%;border: none;padding: 17px 0;border: 1px solid #E4E4E4;margin-left: 10px;}

/* loding bar */
.loadingBox .dim {position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.7);}
.loadingBox .circle {position:fixed; left:50%; top:50%; transform:translate(-50%, -50%); width:40px; height:40px; border:3px solid #fff; border-top:3px solid #02B763; border-radius:50em; transition:all .2s;animation-name:spinCircle;animation-duration:.8s;animation-iteration-count:infinite;animation-timing-function:linear;}
img.loadingBar {transform: translate(-50%, -50%);width: 40px;transition: all 0.2s;animation-name: spinCircle;animation-duration: 1.5s;animation-iteration-count: infinite;animation-timing-function: linear;}
@keyframes spinCircle {
    from {transform:translate(-50%, -50%) rotate(0);}
    to {transform:translate(-50%, -50%) rotate(360deg);}
}

/** 장바구니 */
.basket{display: flex;background-color: #E4E4E4;border-radius: 18px;padding: 0 17px 0 19px;position: absolute;right: 17px;cursor: pointer;}
.basket.active{background-color: #02B763;}
.basket img.no{margin-right: 8px;}
.basket img.active{margin-right: 8px;display: none;}
.basket.active img.no{display: none;}
.basket.active img.active{display: block;}
.basket div{padding: 6px 0;position: relative;overflow: hidden;width: 9px;height: 23px;transition: all 0.2s ease 0s;}
.basket div span{color: #333333;font-size: 14px;font-weight: 700;position: absolute;top: 8px;}
.basket.active div span{color: #FFFFFF;}