@charset "utf-8";

/* 이미지팝업 */
.pop-img-viewer {display:none; z-index:300; position:fixed; top:0; left:0; right:0; bottom:0; background-color:rgba(0, 0, 0, .9);}
.pop-img-viewer .img-wrap>img {z-index:100; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);max-width:100%; max-height:100%;}
.pop-img-viewer .btn-close {z-index:200; position:absolute; top:20px; right:20px;}

/* 오류접수 팝업 */
.pop-opinion {display:none; z-index:300; position:fixed; top:0; left:0; right:0; bottom:0; background-color:rgba(0, 0, 0, .9);}
.pop-opinion>.wrap {position:absolute; top:50%; left:50%; transform:translateX(-50%) translateY(-50%); width:800px; padding:35px 59px; border:10px solid #ddd; background-color:#fff;}
.pop-opinion .tt {display:block; margin-bottom:20px; text-align:center; color:#333; font-family:'ntsm'; font-size:2.4rem;}
.pop-opinion .txt {display:flex; align-items:center; padding-bottom:23px; padding-left:10px;}
.pop-opinion .txt p {padding-left:20px; padding-right:100px; color:#565656; line-height:1.6; font-size:1.4rem;}
.pop-opinion .txt p>span {display:block;}
.pop-opinion .op-data {padding:12px 8px; border-top:1px solid #000; border-bottom:1px solid #000;}
.pop-opinion .op-data em,
.pop-opinion .op-data span {display:block;}
.pop-opinion .op-data em {color:#333; font-family:'ntsm'; font-size:1.8rem;}
.pop-opinion .op-data span {padding-top:5px; color:#767676; font-size:1.4rem;}
.pop-opinion .bx-form {padding:12px 0;}
.pop-opinion .bx-form ul {margin:0;}
.pop-opinion .bx-form .input-wrap {width:100%;}
.pop-opinion .bx-form .input-wrap textarea {height:150px;}
.pop-opinion .bx-form .bx-form-btns {padding-top:15px;}
.pop-opinion .bx-form .bx-form-btns .active {padding:12px 60px; width:auto; font-size:1.7rem; background-color:#424a7a;}
.pop-opinion .btn-close {z-index:200; position:absolute; top:20px; right:20px;}

@media (max-width: 767px) {
    .pop-opinion {overflow-y:auto;}
    .pop-opinion>.wrap {width:calc(100% - 20px); padding:15px 0; border:7px solid #ddd;}
    .pop-opinion .txt {padding:0 10px 17px 10px;}
    .pop-opinion .txt img {display:none; width:23px; height:auto;}
    .pop-opinion .txt p {padding:0;}

    .pop-opinion .bx-form ul>li {padding:3px 0;}
    .pop-opinion .bx-form .input-wrap input, 
    .pop-opinion .bx-form .input-wrap select, 
    .pop-opinion .bx-form .input-wrap textarea {height:26px; padding:0 8px;}
    .pop-opinion .bx-form .input-wrap textarea {height:70px; padding:8px;}

    .pop-opinion .bx-form .bx-form-btns .active {height:auto; padding:8px 30px; font-size:1.5rem;}
    .pop-opinion .btn-close {top:10px; right:10px; width:16px; height:16px;}
}

/*  팝업 */
.pop-win-wrap #container {height:calc(100% - 40px);}

.pop-win-wrap.wide {max-width:none; height:100%;}
.pop-win-wrap.wide #container {height:calc(100% - 40px);}

.pop-win-wrap header {height:40px; background-color:#35353e;}
.pop-win-wrap .header-wrap {display:flex; justify-content:space-between; align-items:center; height:100%;}

.pop-win-wrap .header-wrap .pw-title {display:flex; align-items:center; width:80%; padding-left:15px;}
.pop-win-wrap .header-wrap .pw-title h2 { margin-right:10px; font-size:1.7rem; font-family:'ntsr'; font-weight:normal; color:#fff;}
.pop-win-wrap .header-wrap .pw-title select {padding:0 10px; color:#fff; font-size:14px; color:#fff; background-color:#35353e; border:2px solid #6e77aa; border-radius:4px;}

.pop-win-wrap .header-wrap .fw-logo {display:flex; justify-content: flex-end; align-items:center; width:20%; text-align:right; vertical-align:middle;}
.pop-win-wrap .header-wrap .fw-logo>a {margin:0 11px;}

.pop-win-wrap .article-wrap {display:flex; padding:32px 20px;}
.pop-win-wrap .article-wrap .side {width:28%}
.pop-win-wrap .article-wrap .side.full {width:100%}/*230210*/
.pop-win-wrap .article-wrap .content {width:calc(72% - 7%); margin-left:7%;}


/* 공지사항 */
.pop-notice {z-index:200; position:fixed; width:50%; bottom:0; right:0; padding:30px 0 20px 40px; background-color:#333351; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;}/*230109*/
.pop-notice.notice-image {top:55px; bottom:auto; left:20px; right:auto; max-width:100%; width:auto; padding:10px;}/*230109*/
.pop-notice.notice-image .nt-fnc {padding-right:10px;}

.pop-notice .tx strong {display:block; padding-bottom:12px; margin-bottom:20px; color:#99cc33; font-size:2rem; font-family:'ntsm'; border-bottom:1px solid #585877;}
.pop-notice .tx p {padding-right:80px; padding-bottom:15px; line-height:1.6; color:#ddd; font-size:1.5rem; word-break:keep-all; letter-spacing:0; font-family:'ntsl';}/*230109*/

.pop-notice .nt-fnc {padding:10px 25px 4px 0; text-align:right; color:#ddd; font-size:1.2rem;}/*230109*/
.pop-notice .nt-fnc label {vertical-align:middle; margin-left:5px; font-family:'ntsl';}/*230109*/
.pop-notice .nt-fnc input, .nt-fnc button {margin-left:20px;}


@media (min-width: 768px) and (max-width: 1180px) {
    #wrap.pop-win-wrap {min-width:auto !important;}
}
@media (max-width: 1180px) {
    .pop-win-wrap .article-wrap {display:block;}
    .pop-win-wrap .article-wrap .side,
    .pop-win-wrap .article-wrap .content {width:100%;}
    .pop-win-wrap .article-wrap .content {margin-left:0;}
}
@media (max-width: 767px) {
    .pop-win-wrap header {height:56px; padding:5px 0 5px 8px}
    .pop-win-wrap #container {height:calc(100% - 56px);}

    .pop-win-wrap .header-wrap .pw-title {width:calc(100% - 80px); padding-left:0; padding-right:17px; line-height:1.4;}
    .pop-win-wrap .header-wrap .pw-title .breadCrumb-tag {display:none; margin-left:0; margin-top:5px;}
    .pop-win-wrap .header-wrap .fw-logo {flex-direction:column; width:80px;}
    .pop-win-wrap .header-wrap .fw-logo>a {margin:2px 0;}

    .pop-win-wrap .article-wrap {display:block; padding:14px 8px;}
    .pop-win-wrap .article-wrap .side {margin-bottom:25px;}

    .nombSc {overflow-y:hidden;}

    .pop-notice {left:0; right:0; padding:14px 20px 8px 20px; width:auto;}/*230109*/
    .pop-notice .nt-fnc {padding-right:0;}
    .pop-notice .tx p {padding-right:0;}
    .pop-notice.notice-image {top:60px; left:50%; width:320px; transform:translateX(-50%);}

}


