/* 레이어팝업 */
.openlayrPop { position: fixed; z-index: 105; border-radius: 50%; top: 7rem; right: 2.5rem; }
.openlayrPop .popUp-count { display: flex; flex-direction: column; align-items: center; justify-content: center; background: linear-gradient(to right bottom, #ff9425 16%, #ff8200 55%, #d36d04 82%); color: #fff; width: 5.5rem; height: 5.5rem; gap: 0.2rem; border-radius: 50%; }
.openlayrPop img { max-width: 1.65rem; }
.openlayrPop span { font-size: 0.9rem; }
.openlayrPop .circle{position:absolute; top:50%; left:50%; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%); height:6.5rem; width:6.5rem; border-radius:50%; background-color:rgba(255,255,255,.18); z-index: -1; }
.openlayrPop .circle:before,
.openlayrPop .circle:after{content:""; position:absolute; width:100%; height:100%; left:50%; top:50%; border-radius:50%; background-color:rgba(255,255,255,.18); -webkit-transform:translate(-50%, -50%) scale(.1); transform:translate(-50%, -50%) scale(.1); opacity:0; -webkit-animation:active 2s infinite linear; animation:active 2s infinite linear;}
.openlayrPop .circle:after{-webkit-animation-delay:.3s; animation-delay:.3s;}

@keyframes active {
  0% {
    -webkit-transform:translate(-50%, -50%) scale(.1);
    transform:translate(-50%, -50%) scale(.1);
    opacity: 0;
  }
  50% {
    -webkit-transform:translate(-50%, -50%) scale(.5);
    transform:translate(-50%, -50%) scale(.5);
    opacity: 1;
  }
  100% {
  	-webkit-transform:translate(-50%, -50%) scale(1.5);
    transform:translate(-50%, -50%) scale(1.5);
    opacity: 0;
  }
}

.popHeader { position: fixed; display: none; justify-content: center; align-items: center; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.66); z-index: 999; }
.popHeader.active { display: flex; }
.popHeader .inner { position: relative; width: 100%; max-width: 80rem; padding: 0 3.25rem; } 
.popHeader .inner h2 { display: block; text-align: center; color: #fff; font-size: 2.7rem; font-weight: 300; } 
.popHeader .inner h2 span { font-weight: 700; } 
.popHeader .inner .control a { position: absolute; top: 50%; transform: translateY(-50%); display: inline-flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; background: #FFFFFF; color: #333333; border-radius: 50%; font-size: 1.5rem; opacity: 0; visibility: hidden; }
.popHeader .inner .control a.prev { left: 0; }
.popHeader .inner .control a.next { right: 0; }
.popHeader.stopSd .inner .control a { display: none !important; }
.popHeader .inner .control a.slick-arrow { opacity: 1; visibility: visible; }
.popHeader .slider { margin-top: 2rem; }
.popHeader .slider .item { margin: 0 1.25rem; position: relative; opacity: 0; visibility: hidden; }
.popHeader .slider .item .butm { width: 100%; position: absolute; left: 0; bottom: 0; border: 1px solid #A9C0E4; }
.popHeader .slider .item .butm > a { display: flex; align-items: center; justify-content: center; color: #fff; background: #00358F; height: 2rem; gap: 0.6rem; font-size: 0.7rem; font-weight: 600; line-height: 1.8rem; }
.popHeader .slider .item .butm > a > i { font-weight: 400; font-size: 0.8rem; line-height: 1; }
.popHeader .slider .item.slick-slide { opacity: 1; visibility: visible; }
.popHeader .slider .item .img { background: #e1e1e1; overflow: hidden; width: 100%; height: 22rem; display: flex; align-items: center; justify-content: center; }
.popHeader .slider .item .img p,
.popHeader .slider .item .img a { display: inline-flex; align-items: center; justify-content: center; font-size: 0; line-height: 0; width: 100%; height: 100%; position: relative; }
.popHeader .slider .item .img a::before { position: absolute; content: ""; width: 100%; height: 100%; background: transparent; border: 3px solid #000; left: 0; top: 0; opacity: 0; visibility: hidden; }
.popHeader .slider .item .img a:focus:before { opacity: 1; visibility: visible; }
.popHeader .slider .item .img p img,
.popHeader .slider .item .img a img { max-width: 100%; height: 100%; }
.popHeader .pop_d { display: flex; align-items: center; justify-content: center; gap: 0.75rem; margin-top: 2.75rem; flex-wrap: wrap; }
.popHeader .pop_d p,
.popHeader .pop_d a { border-radius: 0.4rem; display: inline-flex; align-items: center; justify-content: center; color: #fff; height: 2.8rem; padding: 0 1rem; box-shadow: 0px 0px 4px rgba(0,0,0,0.6); }
.popHeader .pop_d p { gap: 0.35rem; }
.popHeader .pop_d a.poptodayClose { gap: 0.5rem; }
.popHeader .pop_d a.lyrpopClose { background: #307FE2; }
.popHeader .pop_d a.poptodayClose { background: #163966; }
.popHeader .pop_d p { background: #595959; font-size: 0.95rem; font-weight: 500; }
.popHeader .pop_d p strong { font-weight: 500 !important; }
/* .popHeader .pop_d p span { padding-left: 0.35rem; margin-left: 0.35rem; } */
.popHeader .pop_d .page em { margin: 0 0.35rem; font-weight: 300; } 


/*** 반응형 ***/
@media (max-width: 1640px) {
  .popHeader .inner { width: calc(100% - 2rem); padding: 0 2.75rem; }
  .popHeader .inner .control a { width: 2.5rem; height: 2.5rem; }
}

@media (max-width: 1240px) {
    .openlayrPop { top: 6rem; right: 1rem; }
    .openlayrPop .popUp-count { width: 5rem; height: 5rem; }
    .openlayrPop .circle { width: calc(100% + 1rem); height: calc(100% + 1rem); }
    .openlayrPop img { max-width: 1.45rem; }
    .openlayrPop span { font-size: 0.85rem; }
}

@media (max-width: 1024px) {
  .popHeader .inner h2 { font-size: 2.35rem }
  .popHeader .slider { margin-top: 1.5rem; }
  .popHeader .slider .item .img { height: 35vw; }
  .popHeader .pop_d { margin-top: 1.5rem; }
}

@media (max-width: 860px) {
  .popHeader .slider .item .img { height: 40vw; }
  .popHeader .pop_d { margin-top: 1.5rem; }
}

@media (max-width: 768px) {
  .popHeader .inner h2 { font-size: 2.15rem }
  .popHeader .slider .item { margin: 0 0.75rem; }
  .popHeader .pop_d p { font-size: 0.85rem; }
  .popHeader .pop_d p, .popHeader .pop_d a { height: 2.5rem; }
}

@media (max-width: 580px) {
  .popHeader .inner { padding: 0 2.25rem; }
  .popHeader .inner h2 { font-size: 1.9rem; }
  .popHeader .slider { margin-top: 1.35rem; }
  .popHeader .pop_d { margin-top: 1rem; gap: 0.5rem; font-size: 0.8rem; }
  .popHeader .pop_d p { font-size: 0.8rem; }
  .popHeader .pop_d p, .popHeader .pop_d a { padding: 0 0.75rem; }
  .popHeader .inner .control a { width: 2.25rem; height: 2.25rem; }
}

@media (max-width: 480px) {
  .popHeader .inner { padding: 0 2.5rem; }
  .popHeader .slider .item { margin: 0; }
   .popHeader .inner h2 { font-size: 1.75em; }
  .popHeader .slider { margin-top: 1.15rem; }
  .popHeader .inner .control a { width: 2rem; height: 2rem; }
  .popHeader .pop_d,
  .popHeader .pop_d p { font-size: 0.75rem; }
  .popHeader .pop_d p, .popHeader .pop_d a { height: 2rem; }
  .popHeader .slider .item .img { height: 45vw; }

  .openlayrPop { top: 4rem;  }
  .openlayrPop .popUp-count { width: 4rem; height: 4rem; }
  .openlayrPop .circle { width: calc(100% + 1rem); height: calc(100% + 1rem); }
  .openlayrPop img { max-width: 1.25rem; }
  .openlayrPop span { font-size: 0.8rem; }
}

@media (max-width: 480px) {
  .popHeader .inner { padding: 0 2.25rem; width: calc(100% - 1.5rem); }
  .popHeader .slider { margin-top: 1rem; }
  .popHeader .inner .control a { width: 1.75rem; height: 1.75rem; font-size: 1.15rem; }
  .popHeader .pop_d,
  .popHeader .pop_d p { font-size: 0.7rem; }
  .popHeader .pop_d p, .popHeader .pop_d a { height: 1.75rem; }
  .popHeader .slider .item .img { height: 50vw; }

  .openlayrPop { top: 3.5rem;  }
  .openlayrPop .popUp-count { width: 3.5rem; height: 3.5rem; }
  .openlayrPop .circle { width: calc(100% + 1rem); height: calc(100% + 1rem); }
  .openlayrPop img { max-width: 1rem; }
  .openlayrPop span { font-size: 0.65rem; }

  .popHeader .slider .item .butm > a { height: 1.75rem; line-height: 1.55rem; }
}

@media (max-width: 360px) {
    .popHeader .slider .item .butm > a { height: 1.5rem; line-height: 1.3rem; }
}