@charset "utf-8";

/* 팝업페이지 */
.wrap-text-pop {display: flex; justify-content: center; align-items: center; width: 100%; max-width: 440px;}
.wrap-text-pop .box {overflow: hidden; position: relative; width: 100%; height: 100%; border-radius: 20px;}
.wrap-text-pop .inner {overflow: auto; position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 30px 30px 0 30px; padding-top: 60px;}
.wrap-text-pop .inner::-webkit-scrollbar {width: 10px; height: 10px}
.wrap-text-pop .inner::-webkit-scrollbar-thumb {background: #0a3d7d; border: 0px solid #fff; border-radius: 10px;}
.wrap-text-pop .inner::-webkit-scrollbar-track {background-color: #fff;}

#popup_zone .wrap-text-pop {align-items: flex-end; max-width: none;}
#popup_zone .wrap-text-pop.skin1 {height: 100%;}
#popup_zone .wrap-text-pop .box {display: flex; align-items: flex-end; background: #174ae3; border-radius: 0;}
#popup_zone .wrap-text-pop .inner {width: auto; padding-top: 30px;}
#popup_zone .PZwrap {box-shadow: 0 0 10px rgba(0,0,0,.4);}

.wrap-text-pop .control {position: absolute; left: 0; top: 100%; width: 100%; display: flex; justify-content: space-between; align-items: center; background: #fff; height: 60px; padding: 0 0 0 20px; border: 1px solid #d1d1d1; box-shadow: 0 0 10px rgba(0,0,0,.4);}
.wrap-text-pop .close {width: 60px; height: 60px;}
.wrap-text-pop .close a {display: block; width: 100%; height: 100%; background: url('/Web-home/fnct/imageSlide/assets/img/ic-pop-close.png') no-repeat center; text-indent: -9999px;}

.wrap-text-pop.skin1 .subject {margin-bottom: 30px;}
.wrap-text-pop.skin1 .subject strong {font-family: pb; font-size: 20px; color: #fff;}
.wrap-text-pop.skin1 .text p {font-family: pr; font-size: 15px; color: #fff; text-shadow: 1px 1px 0 rgba(0,0,0,.9); color: #fff;}

.wrap-text-pop.skin2 .subject {margin-bottom: 15px;}
.wrap-text-pop.skin2 .subject strong {font-family: pb; font-size: 20px; color: #fff;}
.wrap-text-pop.skin2 .info {display: flex; justify-content: space-between; align-items: center;}
.wrap-text-pop.skin2 .info .list li {position: relative; display: flex; padding-left: 12px; font-family: pr; font-size: 15px; color: #fff;}
.wrap-text-pop.skin2 .info .list li::after {content: ''; position: absolute; left: 0; top: 7px; width: 7px; height: 7px; background: #fff; border-radius: 100%;}
.wrap-text-pop.skin2 .info .list p {padding-left: 5px; letter-spacing: normal;}
.wrap-text-pop.skin2 .info .link a {display: flex; align-items: center; height: 45px; padding: 0 20px; background: url('/Web-home/fnct/imageSlide/assets/img/bg-pop-button.jpg') repeat-x; border-radius: 5px; font-family: pb; font-size: 15px; color: #fff; transition: .5s;}
.wrap-text-pop.skin2 .info .link a:hover {box-shadow: 0 0 10px rgba(0,0,0,.7);}
.wrap-text-pop.skin2 .info .link a::after {content: ''; display: block; width: 12px; height: 23px; margin-left: 20px; background: url('/Web-home/fnct/imageSlide/assets/img/arr-pop-button.png') no-repeat center;}
.wrap-text-pop.skin2 .detail {margin-top: 25px; padding: 15px; background: rgba(255,255,255,.7); border: 3px solid #fff;}
.wrap-text-pop.skin2 .detail li {position: relative; display: flex; align-items: center; padding-left: 15px; padding-bottom: 3px;}
.wrap-text-pop.skin2 .detail li:last-child {padding-bottom: 0;}
.wrap-text-pop.skin2 .detail li::before {content: ''; position: absolute; left: 0; top: 9px; width: 5px; height: 5px; background: #011d3f; border-radius: 100%;}
.wrap-text-pop.skin2 .detail strong {flex-shrink: 0; width: 120px; font-family: pb; font-size: 15px; color: #002d64;}
.wrap-text-pop.skin2 .detail p {flex-grow: 1; font-family: pr; font-size: 15px; color: #000000;}
.wrap-text-pop.skin2 .text p {font-family: pr; font-size: 15px; color: #ffffff;}
.wrap-text-pop.skin2 .buttons {margin-top: 25px;}
.wrap-text-pop.skin2 .buttons ul {display: flex; flex-wrap: wrap;}
.wrap-text-pop.skin2 .buttons li {width: calc(50% - 10px); margin: 0 10px 10px 0;}
.wrap-text-pop.skin2 .buttons a {display: flex; justify-content: center; align-items: center; width: 100%; height: 50px; background: #0a3d7d; border-radius: 100px; text-align: center; font-family: pb; font-size: 15px; color: #fff;}
.wrap-text-pop.skin2 .buttons a:hover {background: #001043;}

.wrap-text-pop.skin3 .subject {text-align: center;}
.wrap-text-pop.skin3 .subject strong {font-family: pb; font-size: 30px; color: #e76d00;} 
.wrap-text-pop.skin3 .text {margin-top: 15px; text-align: center;}
.wrap-text-pop.skin3 .text p {font-family: pr; font-size: 15px; color: #000000;}
.wrap-text-pop.skin3 .time {margin-top: 20px; padding: 10px; background: #2eb55e; border-radius: 10px; text-align: center; color: #fff;}
.wrap-text-pop.skin3 .time strong {font-family: pb; font-size: 17px;}
.wrap-text-pop.skin3 .time p {letter-spacing: normal;}

.wrap-text-pop.skin4 .subject {text-align: center;}
.wrap-text-pop.skin4 .subject strong {font-family: pb; font-size: 27px; color: #fff;}
.wrap-text-pop.skin4 .text {margin: 30px 0; text-align: center; font-family: pb; font-size: 15px; color: #ffffff;}
.wrap-text-pop.skin4 .text em {display: inline-block; background: #001043; padding: 0 5px; color: #fff;}
.wrap-text-pop.skin4 .guide {padding: 14px; background: #fff; border-radius: 5px;}
.wrap-text-pop.skin4 .guide li {position: relative; padding-left: 10px; font-family: pb; font-size: 15px; color: #333;}
.wrap-text-pop.skin4 .guide li::after {content: ''; position: absolute; left: 0; top: 7px; width: 6px; height: 6px; background: #455972; border-radius: 100%;}
.wrap-text-pop.skin4 .guide li strong {padding-right: 10px; color: #0088ff;}
.wrap-text-pop.skin4 .guide li em {color: #ff0000;}
.wrap-text-pop.skin4 .guide .very strong {display: inline-block; padding-left: 5px; background: #ff0000; box-shadow: 3px 3px 0 #000; font-size:16px; color: #fff}

#popup_zone .cm-check {position: relative;}
#popup_zone .cm-check input {position: absolute; opacity: 0;}
#popup_zone .cm-check span {display: inline-block; position: relative;  font-family: pb; font-size: 15px; color: #333333; line-height: 1.8; letter-spacing: 0;}
#popup_zone .cm-check span::before {content: ""; position: absolute;}

#popup_zone .cm-check.style1 span {padding-left: 25px;}
#popup_zone .cm-check.style1 span::before {width: 20px; height: 20px; border: 1px solid #9B9B9B; left: 0; top: 2px; border-radius: 4px; background: #fff;}
#popup_zone .cm-check.style1 input:focus + span::before {border-color: #8a8a8a;}
#popup_zone .cm-check.style1 input:checked + span::before {background: #fff url("/Web-home/fnct/imageSlide/assets/img/ic-today.png") no-repeat center; border-color: #e7424e;}

@media screen and (max-width: 1540px) {
    .wrap-text-pop.skin2 .subject {margin-bottom: 10px;}
    .wrap-text-pop.skin1 .subject strong {font-size: 17px;}
    .wrap-text-pop.skin1 .text p {font-size: 14px;}
    .wrap-text-pop.skin2 .subject strong {font-size: 17px;}
    .wrap-text-pop.skin2 .text {margin-top: 10px;}
    .wrap-text-pop.skin2 .text p {font-size: 14px;}
    .wrap-text-pop.skin2 .buttons {margin-top: 15px;}
    .wrap-text-pop.skin2 .buttons a {height: 35px; font-size: 14px;}
    .wrap-text-pop.skin2 .info {flex-wrap: wrap;}
    .wrap-text-pop.skin2 .info .list {width: 100%;}
    .wrap-text-pop.skin2 .info .link {margin-top: 10px;}
    .wrap-text-pop.skin2 .detail {margin-top: 15px; padding: 10px;}
    .wrap-text-pop.skin3 .subject strong {font-size: 18px;}
    .wrap-text-pop.skin3 .text p {font-size: 14px;}
    .wrap-text-pop.skin3 .time strong {font-size: 16px;}
    .wrap-text-pop.skin3 .time p {font-size: 14px;}
}

@media screen and (max-width: 1040px) {
    .wrap-text-pop.skin2 .info .link a {height: 40px;}
    .wrap-text-pop.skin2 .info .list li {font-size: 14px;}
    .wrap-text-pop.skin2 .detail li::before {top: 7px;}
    .wrap-text-pop.skin2 .detail li {flex-wrap: wrap;}
    .wrap-text-pop.skin2 .detail strong {width: 100%; font-size: 14px;}
    .wrap-text-pop.skin2 .detail p {font-size: 14px;}
}

@media screen and (max-width: 900px) {
    .wrap-text-pop.skin1 .subject strong {font-size: 15px;}
    .wrap-text-pop.skin1 .text p {font-size: 12px;}
    .wrap-text-pop.skin2 .subject strong {font-size: 15px;}
    .wrap-text-pop.skin2 .text p {font-size: 12px;}
    .wrap-text-pop.skin2 .buttons a {font-size: 12px;}
    .wrap-text-pop.skin3 .subject strong {font-size: 16px;}
    .wrap-text-pop.skin3 .text p {font-size: 12px;}
    .wrap-text-pop.skin3 .time strong {font-size: 14px;}
    .wrap-text-pop.skin3 .time p {font-size: 12px;}
}

@media screen and (max-width: 750px) {
    .wrap-text-pop.skin2 .subject {margin-bottom: 5px;}
    .wrap-text-pop.skin2 .info .link {position: absolute; right: 30px; top: 56px;}
    .wrap-text-pop.skin2 .info .link a {width: 80px; height: auto; padding: 10px; background-size: cover;}
    .wrap-text-pop.skin2 .info .link a::after {display: none;}
    .wrap-text-pop.skin2 .detail {margin-top: 10px; padding: 7px;}
    .wrap-text-pop.skin2 .detail strong {width: auto; padding-right: 10px;}
    .wrap-text-pop {max-width: none;}
    .wrap-text-pop .thumb img {width: 100%;}
    .wrap-text-pop.skin2 .buttons li {margin: 0 10px 5px 0;}
    #popup_zone .cm-check.style1 span {padding-left: 5px;}
    #popup_zone .cm-check.style1 span::before {display: none;}
    #popup_zone .cm-check input {opacity: 1; position: relative;}
}