/*--------------------------------------------------------------
# Contents Basic
--------------------------------------------------------------*/
.containerWrapper {
    padding: 10px 10px 20px;
    box-sizing: border-box;
    min-height: 600px;
}
.containerWrapper2 {
    padding: 10px 0 20px;
    box-sizing: border-box;
}
.conpageWrap {
    padding: 20px 0;
    box-sizing: border-box;
}
@media screen and (max-width:768px) {
    .conpageWrap {padding: 20px 10px;}
}
.tit1-stem {
    font-size: 1.2em;
    font-weight: 550;
    position: relative;
}
.tit-tmn {
    font-size: 1.3em;
    font-weight: 550;
    position: relative; 
    padding: 10px 0 5px;
    margin: 12px auto 5px;
    box-sizing: border-box;
}
.tit-tmn::before {
    content: '';
    display: block;
    position: absolute;
    left: 0; top: 3px; width: 32px; height: 3px; border-radius: 3px;
    background-color: #2967b2;
}
.tit1-ico::before, .tit2-ico::before, .tit3-ico::before {
    content: '';
    display: inline-block;
    position: relative;
    width: 1em; height: 1em;
    vertical-align: middle;
    margin-right: 5px;
}
.tit1-ico::before {background: url('../images/icons/bookmarkIco1.svg') no-repeat center / cover;}
.tit2-ico::before {background: url('../images/icons/listIco1.svg') no-repeat center / cover;}
.istemBtn1 {
    display: inline-block;
    color: #fff !important;
    background-color: #45455f;
    padding: 5px 15px;
    border-radius: 2px;
    box-shadow: 1px 1px 2px rgb(100,100,100,0.4);
}
.anc-xy, .anc-y {position: absolute;}
.anc-xy {top: 50%; left:50%; transform: translate(-50%, -50%);}
.anc-y {top: 50%; transform: translateY(-50%);}
.type-sup1 {
    font-family: 'Malgun Gothic','Apple SD Gothic Neo', sans-serif;
    height: 40px;
    font-size: 1em;
    padding: 0.5em;
    outline: none;
    border: 1px solid #cbcbcb;
    background-color: #fcfdfd;
    border-radius: 3px;
    box-sizing: border-box;
    resize: none;
}
.type-sup1::placeholder {
    font-size: 0.93em;
    color: #999;
}
.type-sup1:focus {
    /* background-color: #f6faff; */
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(102,175,233,0.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(102,175,233,0.6);    
    box-sizing: border-box;        
}
@media screen and (max-width:768px) {
    .type-sup1 {padding: 0.7em 0.5em;}    
}

/*--------------------------------------------------------------
# Site Item Box
--------------------------------------------------------------*/
.stemBoxwrap {
    border-bottom: 1px solid #eee;
    padding: 15px 0;
    box-sizing: border-box;
}
.stemBoxwrap > h2 {
    margin: 0 auto 10px;
}
.stemBx {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0 -0.5%;
    overflow: hidden;
}
.stemBx li {
    width: 15.6666%;
    margin: 0.5%;
    position: relative;
}
.stemself {margin: 0;}
.stemself li {
    width: 18%;
    margin: 8px 1%;
}
.stemBx li a {
    display: block;
    height: 46px;
    line-height: 44px;
    color: #444;
    background-color: #fcfcfc;
    border: 1px solid #d1d1d1;
    text-align: center;
    border-radius: 5px;
    padding: 0 7px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;       
    box-sizing: border-box;
    box-shadow: 1px 1px 3px rgba(100,100,100,0.3);
    font-weight: 600;
    transition: background-color 0.3s;
}
.stemBx li a:hover {
    color: #fff;
    border: 1px solid #2967b2;
    background-color: #327dd9;
}
.stemBx li .delbtnw {
    display: block;
    position: absolute;
    top: -5px; right: -4px;
    width: 23px; height: 23px;
    background: url('../images/icons/close-cir.svg') no-repeat center / cover;
}
.btnBx-more {
    padding: 10px 0 5px;
    text-align: right;
}
.btnSt1 {
    display: inline-block;
    outline: none; border: none;
    padding: 5px 10px;
    position: relative;
    box-sizing: border-box;
}
.btnBx-more .btnSt1 {
    font-size: 12px;
    padding: 1.5px 5px 1.5px 7px;
    background-color: #aaa;
    color: #f5f5f5;
    border-radius: 18px;
}
.btnBx-more .btnSt1::after {
    content: '';
    display: inline-block;
    width: 0.8em; height: 0.8em;
    background: url('../images/icons/chaw-right.svg') no-repeat center / cover;
    vertical-align:baseline;
    margin-left: 3px;
}
@media screen and (max-width:1000px) {
    .stemBx {margin: 0 -0.5%;}    
    .stemBx li {width: 19%; margin: 0.5%;}   
    /* .stemself {margin: 0;}
    .stemself li { width: 23%; margin: 8px 1%;}     */
}
@media screen and (max-width:768px) {
    .stemBx {margin: 0 -1%;}    
    .stemBx li {width: 30.333%; margin: 1.5%;}    
    .stemself {margin: 0;}
    .stemself li {
        width: 47%;
        margin: 8px 1.5%;
    }    
}

/*--------------------------------------------------------------
# Site List Box
--------------------------------------------------------------*/
.stemvlWrap {
    margin: 20px auto;
}
.instemvlBx {
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
}
.instemvlBx.stem420 {margin: 0 -0.5%;}
.stem420 .instemvlx {
    width: 24%;
    margin: 0.5%;
}
.instemvlx .tit-istv {
    position: relative;
    font-size: 1.05em;
    font-weight: 600;
    padding: 7px 15px 7px 10px;
    background-color: #eaeaea;
    border: 1px solid #ddd;
    border-bottom: none;
    box-sizing: border-box;
}
.more-istv2 {
    position: absolute;
    display: block;
    width: 12px; height: 12px;
    right: 8px; top: 50%; transform: translateY(-50%);
    background: transparent url('../images/icons/chaw-right3.svg') no-repeat center / cover;
    font-size: 12px;
    font-weight: 300;
}
.instemvlx .bx-istv {
    padding: 7px 8px;
    border: 1px solid #ddd;
    box-sizing: border-box;
}
.instemvlx .bx-istv li {
    box-sizing: border-box;
}
.instemvlx .tit-istv, .instemvlx .bx-istv li > a  {
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;        
}
.instemvlx .bx-istv li > a {
    padding: 6px 0;
    box-sizing: border-box;
}
.instemvlx .bx-istv li > a:hover {
    font-weight: 600;
    color: #111;
    background-color:#f0f8ff;
}
.instemvlx .bx-istv li > a::before { content: '•'; margin: 0 7px 0 0;}

@media screen and (max-width:768px) {
    .instemvlBx.stem420 {margin: 0 -1%;}
    .stem420 .instemvlx {width: 48%; margin: 1%;}
}

/*--------------------------------------------------------------
# List Box
--------------------------------------------------------------*/
.stemList {
    border-top: 1px solid #ccc;
    margin: 15px auto 25px;
}
.stemList li {
    display: flex;
    overflow: hidden;
    border-bottom: 1px solid #ddd;
    padding: 0;
    box-sizing: border-box;
    transition: background-color 0.3s;
}
.stemList li:nth-child(2n+1) {
    background-color: #fafafa;
}
.stemList .stemin1, .stemList .stemin2 {
    display: flex;
    align-items: center;
}
.stemin1 > p, .stemin2 > p {
    padding: 0 4px;
    height: 47px;
    line-height: 44px;
    box-sizing: border-box;
}
.stemin1 > p, .stemin2 > p, .stemin1 .scol2 > a {
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    box-sizing: border-box;
}
.stemin1 .scol2 > a {font-weight: 550;}
.stemin1 .scol2 > a:hover {text-decoration: underline;}
.stemList .stemin1 {flex: 2.8;}
.stemList .stemin2 {flex: 1.5;}
.stemin1 .scol1 {width: 50px; text-align: center;}
.stemin1 .scol2 {flex: 1; font-weight: 500; color: #222; max-width:650px;}
.stemin1 .scol1, .stemin2 .scol3, .stemin2 .scol4, .stemin2 .scol5, .stemin2 .scol6 {
    color: #777;
    font-size: 0.93em;
    text-align: center;
}
.stemin2 .scol3, .stemin2 .scol4, .stemin2 .scol5, .stemin2 .scol6 {flex: 1;}
.stemList .oneStp {
    font-weight: 550;
    text-align: center;
    color: #444;
    background-color: #f5f5f5;
}
.stemList li:hover {background-color: #eff8fd;}
.stemList li.oneStp:hover {background-color: #f5f5f5;}
@media screen and (max-width:768px) {
    .stemList li {flex-direction: column; padding: 8px 0;}
    .stemList .stemin1, .stemList .stemin2 {flex: none; width: 100%;}
    .stemin1 > p, .stemin2 > p {
       height: 27px;
        line-height: 27px;
    }
    .stemin2 .scol3, .stemin2 .scol4, .stemin2 .scol5, .stemin2 .scol6 {
        display: inline-block;
        flex: none;
        text-align: left;
        margin: 0 10px 0 0;
    }
    .stemList .oneStp, .stemin1 .scol1, .stemin2 .scol4 {display: none;}
}
.pagingBx {
    display: flex;
    justify-content: center;
    margin: 20px auto 15px;
}
.pagingBx > a {
    width: 25px; height: 25px;
    text-align: center; line-height: 25px;
    background-repeat: no-repeat;
    margin: 0 2px;
}
.pagingBx > a.on {
    color: #f42827;
    font-weight: 600;
    text-decoration: underline;
}
.pagingBx > a.prevpbtn {
    background: url('../images/icons/chevron-left-wgs.svg') center / 80%;
    /* background: url('../images/icons/left-arrow.png') center / 73%; */
}
.pagingBx > a.nextpbtn {
    background: url('../images/icons/chevron-right-wgs.svg') center / 80%;
    /* background: url('../images/icons/right-arrow.png') center / 73%; */
}
/* - List SearchBox - */
.schiimwrap {margin: 0 auto 25px;}
.schiimwrap.miu10 {margin: -10px auto 25px;}
.schiimwrap .schiimBx {}
.schiimBx .schiim {
    display: flex;
    justify-content: flex-end;
}
.schiimsty {
    width: 200px;
    border: 1px solid #ccc;
    border-right: none;
    height: 27px;
    padding: 0 7px;
    box-sizing: border-box;
}
.schiimsty::placeholder {
    font-size: 13px;
    color: #999;
}
.schiimbtn {
    padding: 0 17px;
    line-height: 27px;
    box-sizing: border-box;
    border-left: none;
    color: #fff;
    background-color: #444;
    font-size: 13px;
    font-weight: 350;
}
.stemin2 .scol5 > i::before {
    display: inline-block;
    font-size: 0.94em;
    border: 1px solid #cdcdcd;
    padding: 1px 4.5px;
    line-height: normal;
    color: #444;
    background-color: #fff;
}
.stemin2 .scol5 > i.stt1::before {content: '처리중';}
.stemin2 .scol5 > i.stt2::before {content: '등록완료';}
.stemin2 .scol5 > i.stt3::before {content: '보류'; background-color: #efefef; color: #797979;}

.titwithBtn {position: relative;}
.titwithBtn .btnSt1 {
    position: absolute;
    top: 10px; right: 5px;
    font-size: 13px;
    font-weight: 400;
    padding: 7px 9px 7px 13px;
    background-color: #999;
    color: #fff;
}
.titwithBtn .btnSt1::after {
    content: '';
    display: inline-block;
    width: 0.8em; height: 0.8em;
    background: url('../images/icons/chaw-right.svg') no-repeat center / cover;
    vertical-align:baseline;
    margin-left: 3px;
}
@media screen and (max-width:768px) {
    .schiimBx .schiim {justify-content:center;}
}

/*--------------------------------------------------------------
# Login Box
--------------------------------------------------------------*/
.loginbgWrap {
    width: 100%;
    height: 500px;
    position: relative;
}
.loginBox {
    position: absolute;
    top: 45%; left: 50%; transform: translate(-50%,-50%);
    width: 93%;
    max-width: 350px;
    background-color: #fff;
    padding: 15px 25px;
    border-radius: 5px;
    /* border: 0.7px solid #ddd; */
    background-color: #f5f5f5;
    box-sizing: border-box;
}
.loginBox .titlogin {
    font-size: 1.4em;
    text-align: center;
    font-weight: 600;
    color: #222;
    padding: 10px 5px 20px;
    box-sizing: border-box;
}
.formBx li {
    text-align: center;
    padding: 5px 0;
}
.formBx li input, .btnlogin {height: 40px;}
.formBx li input {width: 100%;}
.btnlogin {
    margin: 7px auto 0;
    font-size: 15px;
    display: block;
    width: 100%;
    line-height: 40px;
    background-color: #444;
    color: #fff;
}
.formBx li.joinwbx {
    text-decoration: underline;
    padding: 15px 0 7px;
}


/*--------------------------------------------------------------
# Inquiry Box
--------------------------------------------------------------*/
.supWrap {}
.supBox {
    width: 80%;
    border-top: 1px solid #ccc;
    margin: 15px auto;
}
.row-sup {
    display: flex;
    align-items: center;
    min-height: 3.8em;
    padding: 0.7em 5px;
    box-sizing: border-box;
    border-bottom: 1px solid #ddd;
}
.row-sup .col1-sup {
    width: 150px;
    font-weight: 550;
}
.row-sup .col2-sup {flex: 1;}
.row-sup .wd80 input[type=text], .row-sup .wd80 select, .row-sup .wd80 textarea, .row-sup .wd80 input[type=password], .row-sup .wd80 input[type=email] {width: 80%;}
.row-sup .wdsum {width: 180px;}
.col2-sup.colany1 {
    display: flex;
    align-items: center;
}
.col2-sup .reformNum {
    display: inline-block;
    font-weight: 600;
    height: 38px;
    line-height: 38px;
    letter-spacing: 3.5px;
    background-color: #777;
    color: #eee;
    padding: 0 1em;
    margin-right: 7px;
    white-space: nowrap;
    box-sizing: border-box;
}
.selxcate1 label {display: inline-block; font-weight: 550;}
.selxcate1 label:first-of-type {margin-right: 15px;}

.submit-supBox {
    text-align: center;
    margin: 15px 0;
}
.sumix1, .sumix2 {
    width: 130px;
    padding: 9px;
}
.sumix2 { background-color: #a8a8a8;}
.infoTxB-inq1 {
    width: 100%;
    background-color: #f7f7f7;
    padding: 9px;
    margin: 10px auto;
    border: 1px solid #dedede;
    border-radius: 2px;
    box-sizing: border-box;
}
.infoTxB-inq1 .tit-inq1 {
    font-size: 1.07em;
    font-weight: 550;
    margin-bottom: 5px;
}
.infoTxB-inq1 .desc-inq1 {
    color: #666;
}
.row-sup textarea {height: 150px;}
.row-term {
    padding: 1em 5px;
    border-bottom: 1px solid #ddd;
    box-sizing: border-box;
}
.row-term > h3 {
    font-size: 1.05em;
    font-weight: 550;
}
.row-term .termBox {
    height: 130px;
    padding: 18px 11px;
    overflow-y: auto;
    border: 1px solid #ddd;
    background-color: #f9f9f9;
    box-sizing: border-box;
    font-size: 0.95em;
    line-height: 1.6;
    font-weight: 300;
    color: #666;
    margin: 10px auto;
}
.row-sup .descmoo {
    display: block;
    margin: 4px 0 0;
    font-size: 13px;
    color: #f54281;
}
@media screen and (max-width:768px) {
    .row-sup {flex-direction: column;}
    .row-sup .col1-sup {
        width: 100%;
        margin-bottom: 4px;
    }
    .row-sup .col2-sup {
        flex: none;
        width: 100%;
    }    
    .supBox {width: 100%;}
    .row-sup .wd80 input[type=text], .row-sup .wd80 select, .row-sup .wd80 textarea, .row-sup .wd80 input[type=password], .row-sup .wd80 input[type=email] {width: 100%;}
    .sumix1, .sumix2 {padding: 12px 9px;}
}


/* ===================== 
Article
===================== */

.in-cowwn {
    margin: 0 -10px;
    overflow: hidden;
}
.tit-atvc, .cate-atvc, .desc-atvc {
    padding: 13px;
    box-sizing: border-box; 
}
.tit-atvc {
    font-size: 1.2em;
    line-height: 1.4;
    background-color: #f5f5f5;
    font-weight: 600;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
.cate-atvc {
    text-align: right;
    border-bottom: 1px solid #eee;
}
.cate-atvc .cazui {
    display: inline-block;
    font-size: 0.94em;
    color: #888;
}
.cate-atvc .cazui:last-of-type {margin: 0 0 0 10px;}
.desc-atvc img, .desc-atvc video, .desc-atvc iframe {
    display: block;
    max-width: 100%;
    margin: 5px auto;
}
.desc-atvc {}

/* =========== 
  Article Page
=========== */
.viewatWrap {}
.tit-vwat {
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
.tit-vwat > h2 {
    font-size: 1.4em;
    font-weight: 550;
    padding: 10px 5px;
    line-height: 1.4;
    background-color: #f5f5f5;
    border-bottom: 1px solid #eee;
    box-sizing: border-box;
}
.tit-vwat .cate-vwa {
    padding: 10px 0;
    text-align: right;
    font-size: 0.93em;
    color: #888;
}
.tit-vwat .cate-vwa .date {margin: 0 0 0 10px;}
.tit-vwat .cate-vwa .cate{margin: 0 0 0 10px;}
.content-vwat {
    font-size: 16px;
    padding: 15px 5px 25px;
    box-sizing: border-box;
    line-height: 1.7;
}
.content-vwat img, .content-vwat video, .content-vwat iframe {
    display: block;
    max-width: 100%;
    margin: 5px auto;
}
.tagBx-vwat, .gobtn-vwat {
    padding: 15px 5px;
    box-sizing: border-box;
}
.tagBx-vwat > a {
    display: inline-block;
    margin: 0 7px 0 0;
}
.tagBx-vwat > a::before {content: '#'; margin: 0 2px 0 0;}
.tagBx-vwat > a::after {content: ',';}
.gobtn-vwat {
    border-top: 1px solid #ddd;
    text-align: right;
}
.gobtn-vwat .golistw {
    display: inline-block;
    padding: 5px 18px;
    border: 1px solid #444;
    color: #fff;
    background-color: #444;
}
.olist-vwat {
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
.olist-vwat li {
    display: flex;
    padding: 12px 0;
}
.olist-vwat li:last-of-type {
    border-top: 1px solid #eee;
}
.olist-vwat li .tit-wa {
    flex: 0 0 60px;
    font-weight: 550;
    color: #327dd9;
}
.olist-vwat li .desc-wa {flex: 1; overflow: hidden;}
.olist-vwat li .desc-wa a {
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

/* --  Inquery Register -- */
.regiwtab {
    width: 100%;
    table-layout: fixed;
    margin: 15px auto 0;
    font-size: 15px;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
.regiwtab .cob1 {
    width: 110px; 
    background-color: #f5f5f5; 
    color: #666; 
}
.regiwtab .cob2 {}
.regiwtab tr {}
.regiwtab td {
    height: 43px;
    padding: 0 10px;
    box-sizing: border-box;
}
.regiwtab tr:not(:last-of-type) {
    border-bottom: 1px solid #eee;
}

/* -- Reply Area (0111) -- */
.articleReply {
    padding: 5px;
    border: 1px solid #ddd;
    box-sizing: border-box;
}
.articleReply .writeReply {
    padding: 0.7em 0.5em;
    border: 1px solid #ddd;
    box-sizing: border-box;   
}
.writeReply .indtx {
    font-size: 0.9em;
    color: #888;
    font-weight: 300;
    margin: 3px 0 0;
}

/* -- View Reply -- */
.list-Reply {padding: 8px 0;}
.list-Reply li:first-child {border-top: 1px solid #bbb;}    
.list-Reply li:last-child {border-bottom: 1px solid #ddd;}    
.list-Reply li {border-bottom: 1px dotted #ccc;}    
.list-Reply .infoBoxRew {
    padding: 0.55em 0.5em;
    background-color: #f7f7f7;
    display: flex;
    align-items: center;
    position: relative;
    box-sizing: border-box;
}    
.list-Reply li {padding: 0 0 0.7em;}
.list-Reply .delrexo {padding: 5px 5px 5px 10px;}
.list-Reply .delrexo .txsoo {
    font-size: 0.88em;
    font-weight: 350;
    color: #888;
    padding: 0 0 4px;
}
.list-Reply .delrexo .inxsoo {}
.list-Reply .delrexo .inxsoo > input {height: 30px; width: 95px;}
.list-Reply .delrexo .inxsoo > button {
    display: inline-block;
    margin: 0 0 0 3px;
    background-color: #ddd;
    padding: 0 0.7em;
    line-height: 28px;
    border: 1px solid #ccc;
    height: 30px;
}
.infoBoxRew .authorRew {color: #3074a5;}
.infoBoxRew .authorRew::before, .infoBoxRew .dateRew::before, .infoBoxRew .delBtnRew {
    display: inline-block;
    width: 14px; height: 14px;   
    vertical-align: middle; 
}
.infoBoxRew .authorRew::before, .infoBoxRew .dateRew::before {
    content: '';
    margin-right: 5px;
}
.infoBoxRew .authorRew::before {background: url('../images/icons/user2-ico.svg') no-repeat center / cover;}    
.infoBoxRew .dateRew {color: #999; margin-left: 15px; font-size: 0.8em; font-weight: 300;}    
.infoBoxRew .dateRew::before {background: url('../images/icons/clock2-ico.svg') no-repeat center / cover;}
.infoBoxRew .delBtnRew {
    width: 16px; height: 16px;
    margin-left: 10px;
    background: url('../images/icons/trash3-ico.svg') no-repeat center / cover;
}
.list-Reply .contentRew {
    padding: 0.5em 0.5em 0.2em;
    box-sizing: border-box;
}

/* -- Write Reply -- */
.writeReply {background-color: #f7f7f7;}
.writeReply .titBoxReply {
    display: flex;
    align-items: center;
    box-sizing: border-box;    
}
.writeReply .titBoxReply > h3 {
    font-size: 1.07em;
    font-weight: 600;    
}
.writeReply .titBoxReply .authorCount {
    margin: 0 0 0 8px;
    font-size: 0.9em;
    color: #888;
    font-weight: 300;
}
.writeBoxReply .npassBx {margin: 12px 0 0;}
.writeBoxReply .npassBx > input {height: 35px;}
.writeBoxReply .npassBx > input:first-of-type {margin: 0 7px 0 0;}
.writeBoxReply .npassBx > input::placeholder, .writeReply .writeBoxReply .textBoxrex::placeholder, .submitBoxReply .rnibx > input::placeholder {
    font-size: 0.9em;
    color: #aaa;
}
.writeReply .writeBoxReply .textBoxrex {
    width: 100%;
    margin: 8px auto;
    height: 5em;
}
.submitBoxReply {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap;
}
.submitBoxReply .rnibx {
    display: flex;
    align-items: center;
    margin: 0 7px 0 0;
}
.submitBoxReply .rnibx > input {
    height: 35px;
    width: 100px;
}
.submitBoxReply .rnibx .rntxt {
    margin: 0 4px 0 0;
    font-weight: 350;
    color: #777;
}
.submitBoxReply .rnibx .rncode {
    display: inline-block;
    margin: 0 7px 0 0;
    padding: 0 0.7em;
    line-height: 35px;
    color: #444;
    font-size: 1.15em;
    background-color: #ccc;
    font-weight: 600;
}
.submitBoxReply .BtnReply {
    font-size: 1em;
    display: inline-block;
    padding: 5px 18px;
    border: 1px solid #444;
    color: #fff;
    background-color: #444;    
}
@media screen and (max-width:768px) {
    .writeBoxReply .npassBx > input {width: 100%;}
    .writeBoxReply .npassBx > input:first-of-type {margin: 0 0 7px 0;}
    .submitBoxReply .rnibx {
        width: 100%;
        margin: 0 0 7px 0;
        justify-content: flex-end;
    }
}
/* -- End Reply Area (0111) -- */

/* =========== 
 *   About Hot Deal (02-08)
 *   =========== */

/* -- View Shop Goods -- */
.viewShop2 {}
.viewShop2 img {
    display: block;
    margin: 5px auto;
    width: 100%;
}
.cate-vmga {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 3px;
    box-sizing: border-box;
}
.cate-vmga .vgcol1 > a:hover {text-decoration: underline;}
.cate-vmga .vgcol1 > a::before {
    content: '';
    display: inline-block;
    width: 13px;
    height: 13px;
    vertical-align: middle;    
    background: url(../images/icons/user2-ico.svg) no-repeat center / cover;
    margin: 0 5px 0 0;
}
.cate-vmga .vgcol2 {
    font-size: 0.9em;
    color: #666;
}
.cate-vmga .vgcol2 > span {font-weight: 600; color: #797979;}
.cate-vmga .vgcol2 > span:not(:last-child) {margin: 0 10px 0 0;}
.cate-vmga .vgcol2 > span::before {font-weight: 400; margin: 0 5px 0 0;}
.cate-vmga .vgcol2 .mg-viewn::before {content: '조회수';}
.cate-vmga .vgcol2 .mg-vvio::before {content: '추천수';}
.cate-vmga .vgcol2 .mg-reply::before {content: '댓글';}
.cate-vmga .vgcol2 .mg-date::before {content: '일자 :';}
.cate-vmga .vgcol2 .mg-date {font-weight: 400;}

.viewShop2 .vsp-link {
    display: flex;
    justify-content: flex-end;
    align-items:center;
    padding: 10px 0 7px;
    box-sizing: border-box;
}
.viewShop2 .vsp-link > span {color: #999; font-size: 13px;}
.viewShop2 .vsp-link > button {
    font-size: 13px;
    padding: 1px 7px;
    margin: 0 0 0 7px;
}
.viewShop2 .vspBtn2 {
    color: #222;
    border: 1px solid #ccc;
    border-radius: 3px;
    box-sizing: border-box;
    background-color: #f8f8f8;
    box-shadow: 0.6px 0.6px 1px rgba(0,0,0,0.2);
}

.mgListWrap {margin: 8px auto;}
.mgListWrap .mg_tit, .mgListWrap .mgm_btn {
    font-size: 15.5px;
    color: #111;
    background-color: #eee;
    box-sizing: border-box;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;    
}
.mgListWrap .mg_tit {
    font-weight: 600;
    padding: 8px 5px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.mgListWrap .mg_tit > p {font-size: 13px; color: #777; font-weight: 400;}
.mgListWrap .mg_listBx {}
.mgListWrap .mg_listBx > li {
    padding: 8px 3px;
    box-sizing: border-box;
    border-bottom: 1px solid #ddd;
}
.mgListWrap .mg_listBx > li:nth-child(even) {background-color: #f8f8f8;}
.mgListWrap .mg_listBx > li > a {
    font-size: 15.5px;
    display: block;
    font-weight: 600;
} 
.mgListWrap .mg_listBx > li > a:hover {text-decoration: underline;}
.mgListWrap .mg_listBx > li > p {
    font-size: 14px;
    margin: 5px 0;
} 
.mgListWrap .mg_listBx > li > p > span {
    position: relative;
    display: inline-block;
}
.mgListWrap .mg_listBx > li > p > span:not(:last-child) {margin: 0 12px 0 0;}
.mgListWrap .mg_listBx > li > p > span:not(:last-child)::after {
    content: '';
    display: block;
    position: absolute;
    top: 50%; right: -8px; transform: translateY(-50%);
    width: 1px; height: 50%;
    background-color: #ccc;
}
.mgListWrap .mg_listBx > li > p > span.m_price {color: #3262c5; font-weight: 550;}
.mgListWrap .mg_listBx > li > p > span.m_diff > span {color: red; font-weight: 600;}
.mgListWrap .mg_listBx > li > p > span.m_price::before {content: '가격 : '; color: #666; font-weight: 400;}
.mgListWrap .mg_listBx > li > p > span.m_regdate::before {content: '등록일 : '; color: #666;}
.mgListWrap .mgm_btn {
    display: block; width: 100%;
    border-top: none;
    padding: 5px 5px;
}
.mgListWrap .mgm_btn > span {font-weight: 400; color: #444;}
.mgListWrap .mgm_btn > span::before {content: '(총 ';}
.mgListWrap .mgm_btn > span::after {content: ' 개)';}

.vspBxw {
    display: flex;
    padding: 8px 5px 13px;
}
.vspBxw .vspb-col1 {flex: 1; text-align: center;}
.vspBxw .vspb-col2 {}
.vspBxw .vspBtn2 {
    padding: 3px 10px;
    font-size: 15px;
}
.alt_enddeal {
    font-size: 1.15em;
    color: #d97245;
    text-align: center;
    font-weight: bold;
    background-color: #fef3eb;
    padding: 10px 8px;
    margin: 5px auto;
    border: 1px solid #fde4d7;
    box-sizing: border-box;
}
.alt_enddeal > span::before {
    content: '⚠️';
    margin-right: 10px;
}
@media screen and (max-width:768px) {
    .cate-vmga {flex-wrap: wrap;}
    .cate-vmga .vgcol2 {margin: 4px 0 0 0;}
    .mgListWrap .mg_tit {flex-wrap: wrap;}
    .mgListWrap .mg_listBx > li > p {font-size: 13px;}     
}

/* -- Hot Deal List  -- */
.hdws-ListBx {}
.hdws-List {
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    margin: 15px auto 25px;
}
.hdws-List li {
    display: flex;
    padding: 7px 0;
}
.hdws-List li:nth-child(2n+1) {background-color: #f9f9f9;}
.hdws-List li:not(:first-child) {border-top: 1px solid #eee;}
.hdws-List .img-hdws {
    width: 80px; height: 80px;
    border: 1px solid #ddd;
    border-radius: 3px;
    overflow: hidden;
    margin: 0 7px 0 0;
}
.hdws-List .img-hdws img {
    width: 100%; min-height: 100%;
}
.hdws-List .desc-hdws {
    flex: 1;
    overflow: hidden;
}
.hdws-List .desc-hdws .tit-hdws {
    font-size: 1.05em;
    font-weight: 550;
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    box-sizing: border-box;    
}
.hdws-List .desc-hdws .tit-hdws > a {color: #3262c5;}
.hdws-List .desc-hdws .tit-hdws > a:hover {text-decoration: underline;}
.hdws-List .desc-hdws .info-hdws {font-size: 14px;  margin: 6px 0 0 0;}
.hdws-List .desc-hdws .info-hdws p:nth-child(){margin: 2.5px 0 0 0;}
.hdws-List .desc-hdws .info-hdws p > span {position: relative;}
.hdws-List .desc-hdws .info-hdws p > span:not(:last-child) {margin: 0 7px 0 0;}
.hdws-List .desc-hdws .info-hdws p > span > a:hover {text-decoration: underline;}
.hdws-List .desc-hdws .info-hdws p > span::before {
    font-size: 13px;
    color: #666;
    font-weight: 300;
    vertical-align:baseline;
}
.hdws-List .desc-hdws .info-hdws .shop-hdws, .hdws-List .desc-hdws .info-hdws .price-hdws {color: #2967b2;}
.hdws-List .desc-hdws .info-hdws .shop-hdws::before {content: '쇼핑몰 : ';}
.hdws-List .desc-hdws .info-hdws .price-hdws::before {content: '가격 : ';}
.hdws-List .desc-hdws .info-hdws .ship-hdws::before {content: '배송비 : ';}
.hdws-List .desc-hdws .info-hdws .cate-hdws::before {content: '구분 : ';}
.hdws-List .desc-hdws .info-hdws .aut-hdws::before {content: '';}
.hdws-List .desc-hdws .info-hdws .date-hdws::before {content: '일자 : ';}

.hdws-List .desc-hdws .info-hdws p > span:not(:last-child)::after {
    content: '/'; color: #999; font-weight: 300; margin: 0 0 0 7px; font-size: 10px; vertical-align: baseline;
}
@media screen and (max-width:768px) {
    .hdws-List .desc-hdws .info-hdws p {display:inline;}
    .hdws-List .desc-hdws .info-hdws p:last-child::before {content: '/'; color: #999; font-weight: 300; margin: 0 0 0 7px; font-size: 10px; vertical-align: baseline;}

}

/* -- Hot Deal Tab Area-- */
.hdwt-Wrap {
    margin: 15px auto;
    background-color: #f2f2f2;
}
.hdwt-inBx {
    display: flex;
    align-items: center;
    border: 1px solid #ddd;
    border-radius: 5px;
    box-sizing: border-box;
}
.hdwt-inBx .hdwt-col1 {
    width: 80px;
    text-align: center;
    font-weight: 600;
}
.hdwt-inBx .hdwt-col1 > a::before {content: '🏠︎'; margin: 0 6px 0 0;}
.hdwt-inBx .hdwt-col2 {
    flex: 1;
    color: #222;
    line-height: 1.6;
    padding: 10px 10px;
    border-left: 1px solid #ddd;
    background-color: #fff;
    box-sizing: border-box;
}
.hdwt-inBx .hdwt-col2 .itwii {padding: 6px  0;}
.hdwt-inBx .hdwt-col2 .itwii:hover, .hdwt-inBx .hdwt-col1 > a:hover {text-decoration:underline; color: #2967b2;}
.hdwt-inBx .hdwt-col2 .itwii:not(:last-child) {margin: 0 14px 0 0;}

@media screen and (max-width:768px) {
    .hdwt-inBx .hdwt-col2 {
        font-size: 15px;
    }    
}

/*20230110 SJ 추가*/
.formBx li input, .btnprev{height: 40px;}
.formBx li input {width: 100%;}
.btnprev{
    margin: 7px auto 0;
    font-size: 15px;
    display: block;
    width: 100%;
    line-height: 40px;
    background-color: #A8A8A8;
    color: #fff;
}


