/* BASIC css start */
/* =========================================================
   FALLING LAND
   BOARD > 질문과 대답(상품 문의) > 수정/쓰기
   PC + MOBILE
   ========================================================= */

#bbsData {
    width:100%;
    color:#333;
}

#bbsData .page-body {
    width:100%;
    margin:0;
    padding:0;
}


/* =========================================================
   상단 게시판 메뉴
   ========================================================= */

#bbsData .bbs-hd {
    width:100%;
    margin:0 0 35px;
    padding:0;
    border-bottom:1px solid #e5e5e5;
}

#bbsData .bbs-hd .link {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    margin:0;
    padding:0;
}

#bbsData .bbs-hd .link li {
    position:relative;
    margin:0;
    padding:0 16px;
}

#bbsData .bbs-hd .link li:first-child {
    padding-left:0;
}

#bbsData .bbs-hd .link li:after {
    content:"";
    position:absolute;
    top:50%;
    right:0;
    width:1px;
    height:9px;
    background:#ddd;
    transform:translateY(-50%);
}

#bbsData .bbs-hd .link li.last:after,
#bbsData .bbs-hd .link li:last-child:after {
    display:none;
}

#bbsData .bbs-hd .link li a {
    display:block;
    padding-bottom:12px;
    color:#888;
    font-size:10px;
    font-weight:400;
    text-decoration:none;
}

#bbsData .bbs-hd .link li a:hover {
    color:#222;
}


/* =========================================================
   게시판 제목
   ========================================================= */

#bbsData .bbs-tit {
    margin:0;
    padding:0 0 12px;
    border-bottom:1px solid #333;
}

#bbsData .bbs-tit h3 {
    margin:0;
    padding:0;
    color:#222;
    font-size:16px;
    font-weight:600;
    line-height:1.4;
}


/* =========================================================
   상품 상단 정보
   ========================================================= */

#bbsData .prd-tinfo {
    display:flex;
    align-items:center;
    width:100%;
    margin:15px 0 0;
    padding:15px;
    border:1px solid #e5e5e5;
    background:#fff;
    overflow:visible;
    box-sizing:border-box;
}

#bbsData .prd-tinfo dt,
#bbsData .prd-tinfo dd {
    position:static;
    float:none;
    margin:0;
    padding:0;
}

#bbsData .prd-tinfo dt {
    flex:0 0 70px;
    width:70px;
    height:70px;
    margin-right:15px;
}

#bbsData .prd-tinfo dt img {
    display:block;
    width:70px;
    height:70px;
    object-fit:cover;
}

#bbsData .prd-tinfo dd {
    flex:1;
    width:auto;
    min-width:0;
}

#bbsData .prd-tinfo dd ul li {
    padding:3px 0;
    color:#777;
    font-size:9px;
    line-height:1.6;
}

#bbsData .prd-tinfo dd ul li .tit {
    margin-right:5px;
    color:#444;
    font-weight:500;
}

#bbsData .prd-tinfo dd ul li a {
    color:#555;
    vertical-align:middle;
    text-decoration:none;
}

#bbsData .prd-tinfo dd ul li img {
    vertical-align:middle;
}


/* =========================================================
   글쓰기 TABLE
   ========================================================= */

#bbsData .bbs-table-write {
    width:100%;
    margin-top:15px;
}

#bbsData .bbs-table-write fieldset {
    margin:0;
    padding:0;
    border:0;
}

#bbsData .bbs-table-write table {
    width:100%;
    border-collapse:collapse;
    table-layout:fixed;
    border-top:1px solid #333;
}

#bbsData .bbs-table-write th,
#bbsData .bbs-table-write td {
    padding:12px 10px;
    border-bottom:1px solid #e8e8e8;
    vertical-align:middle;
    box-sizing:border-box;
}

#bbsData .bbs-table-write th {
    background:#fafafa;
    color:#555;
    font-size:9px;
    font-weight:500;
    text-align:left;
}

#bbsData .bbs-table-write td {
    background:#fff;
    color:#666;
    font-size:9px;
}

#bbsData .bbs-table-write p {
    margin:8px 0;
    text-align:left;
}


/* =========================================================
   INPUT / SELECT
   ========================================================= */

#bbsData .bbs-table-write .MS_input_txt,
#bbsData .bbs-table-write input[type="text"],
#bbsData .bbs-table-write input[type="password"],
#bbsData .bbs-table-write input[type="email"] {
    max-width:100%;
    height:32px;
    padding:0 8px;
    border:1px solid #ddd;
    border-radius:0;
    background:#fff;
    color:#444;
    font-size:9px;
    line-height:30px;
    outline:none;
    box-sizing:border-box;
}

#bbsData .bbs-table-write input:focus,
#bbsData .bbs-table-write textarea:focus,
#bbsData .bbs-table-write select:focus {
    border-color:#999;
}

#bbsData .bbs-table-write .MS_select,
#bbsData .bbs-table-write select {
    height:32px;
    padding:0 25px 0 7px;
    border:1px solid #ddd;
    border-radius:0;
    background-color:#fff;
    color:#555;
    font-size:9px;
    outline:none;
    box-sizing:border-box;
}

#bbsData .bbs-table-write .input_style1 {
    width:300px;
    max-width:100%;
}

#bbsData .bbs-table-write .input_style2 {
    width:600px;
    max-width:100%;
}

#bbsData .bbs-table-write .input_style3 {
    width:300px;
    max-width:100%;
    margin-right:0;
    background:#f7f7f7;
}


/* 제목 */

#bbsData .bbs-table-write .title {
    line-height:1.8;
}

#bbsData .bbs-table-write .title .title_select {
    padding-top:7px;
}

#bbsData .bbs-table-write .title .MS_select {
    margin-bottom:5px;
}


/* =========================================================
   내용
   ========================================================= */

#bbsData .bbs-table-write .text_content {
    padding:15px 10px;
}

#bbsData .bbs-table-write textarea {
    display:block;
    width:100%;
    max-width:100%;
    min-height:300px;
    padding:12px;
    border:1px solid #ddd;
    border-radius:0;
    background:#fff;
    color:#444;
    font-size:10px;
    line-height:1.7;
    resize:vertical;
    outline:none;
    box-sizing:border-box;
}


/* =========================================================
   파일 / 회색 버튼
   ========================================================= */

#bbsData .bbs-table-write .btn_gray,
#bbsData .bbs-table-write .btn_file {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:32px;
    margin-left:4px;
    padding:0 10px;
    border:1px solid #ccc;
    border-radius:0;
    background:#fff;
    color:#555;
    font-size:8px;
    line-height:30px;
    text-decoration:none;
    box-sizing:border-box;
}

#bbsData .bbs-table-write .btn_gray:hover,
#bbsData .bbs-table-write .btn_file:hover {
    border-color:#555;
    color:#111;
}


/* =========================================================
   주문번호
   ========================================================= */

#bbsData .bbs-table-write .myorder {
    position:relative;
}

#bbsData .bbs-table-write .myorder .input-group {
    position:relative;
    display:inline-block;
    max-width:100%;
    vertical-align:middle;
}

#bbsData .bbs-table-write .myorder .input-group #ordernumclear {
    position:absolute;
    top:50%;
    right:7px;
    width:18px;
    height:18px;
    margin:0;
    color:#999;
    font-size:9px;
    line-height:18px;
    text-align:center;
    cursor:pointer;
    transform:translateY(-50%);
}


/* =========================================================
   주문내역 조회 LAYER
   ========================================================= */

#myorderlayer {
    z-index:1000;
    display:none;
    position:absolute;
    top:40px;
    left:0;
    width:660px;
    max-width:calc(100vw - 40px);
    padding:0 0 20px;
    border:1px solid #aaa;
    background:#fff;
    box-sizing:border-box;
    box-shadow:0 5px 20px rgba(0,0,0,.08);
}

#myorderlayer .l-close {
    z-index:2;
    position:absolute;
    top:15px;
    right:15px;
    width:25px;
    height:25px;
    background:none;
    color:transparent;
    font-size:0;
    text-indent:0;
}

#myorderlayer .l-close:before,
#myorderlayer .l-close:after {
    content:"";
    position:absolute;
    top:12px;
    left:4px;
    width:17px;
    height:1px;
    background:#555;
}

#myorderlayer .l-close:before {
    transform:rotate(45deg);
}

#myorderlayer .l-close:after {
    transform:rotate(-45deg);
}

#myorderlayer .tit {
    height:auto;
    padding:18px 20px;
    border-bottom:1px solid #e5e5e5;
    color:#222;
    font-size:14px;
    font-weight:600;
    line-height:1.4;
}

#myorderlayer .cnt {
    padding:20px;
}


/* 기간 TAB */

#myorderlayer .cnt .cnt-tab {
    display:flex;
    width:100%;
    height:auto;
    margin:0 0 20px;
}

#myorderlayer .cnt .cnt-tab:after {
    display:none;
}

#myorderlayer .cnt .cnt-tab li {
    float:none;
    flex:1;
    width:auto;
    height:34px;
    margin:0 0 0 -1px;
    border:1px solid #ddd;
    background:#fff;
    box-sizing:border-box;
}

#myorderlayer .cnt .cnt-tab li:first-child {
    margin-left:0;
}

#myorderlayer .cnt .cnt-tab li a {
    display:flex;
    align-items:center;
    justify-content:center;
    height:32px;
    color:#777;
    font-size:9px;
    line-height:32px;
    text-decoration:none;
}

#myorderlayer .cnt .cnt-tab li.now {
    z-index:1;
    border:1px solid #333;
    background:#333;
    font-weight:500;
}

#myorderlayer .cnt .cnt-tab li.now a {
    color:#fff;
}


/* 주문 목록 */

#myorderlayer .cnt .tabWrap {
    width:100%;
}

#myorderlayer .cnt table {
    width:100%;
    border-collapse:collapse;
    table-layout:fixed;
    border-top:1px solid #333;
}

#myorderlayer .cnt table thead th {
    padding:11px 4px;
    border-bottom:1px solid #ddd;
    background:#fafafa;
    color:#555;
    font-size:8px;
    font-weight:500;
}

#myorderlayer .cnt table tbody td {
    padding:10px 4px;
    border-bottom:1px solid #eee;
    color:#666;
    font-size:8px;
    line-height:1.5;
}

#myorderlayer .cnt table tbody td .prd-blue {
    color:#444;
    cursor:pointer;
}

#myorderlayer .cnt table tbody td .prd-blue:hover {
    color:#000;
}


/* 주문조회 페이징 */

#myorderlayer .paging {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:2px;
    margin-top:18px;
}

#myorderlayer .paging a {
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:25px;
    height:25px;
    color:#999;
    font-size:9px;
    text-decoration:none;
}

#myorderlayer .paging a.now,
#myorderlayer .paging .now {
    color:#111;
    font-weight:600;
}


/* =========================================================
   개인정보 동의
   ========================================================= */

#bbsData .new-privercy-contract {
    margin:5px 0;
    padding:15px;
    border:1px solid #e5e5e5;
    background:#fafafa;
    box-sizing:border-box;
}

#bbsData .new-privercy-contract p {
    margin:15px 0 8px;
    color:#333;
    font-size:10px;
    font-weight:500;
    text-align:left;
}

#bbsData .new-privercy-contract p:first-child {
    margin-top:0;
}

#bbsData .privercy-contract textarea {
    width:100%;
    height:90px !important;
    min-height:90px;
    padding:8px;
    border:1px solid #ddd;
    background:#fff;
    color:#777;
    font-size:8px;
    resize:none;
    box-sizing:border-box;
}

#bbsData .privercy-contract-tap {
    height:auto;
    margin-bottom:8px;
}

#bbsData .privercy-contract-tap ul {
    display:flex;
    margin:0;
    padding:0;
}

#bbsData .privercy-contract-tap li a {
    display:block;
    padding:7px 10px;
    color:#777;
    font-size:8px;
    text-decoration:none;
}

#bbsData .privercy-contract-tap li.sel a {
    color:#111;
    font-weight:500;
}

#bbsData .privercy-agree {
    margin-top:8px;
    color:#666;
    font-size:8px;
}

#bbsData .privercy-agree label {
    margin-right:15px;
}


/* 개인정보 표 */

#bbsData .privercy-contract .tbl {
    width:100% !important;
    margin:0;
    padding:0;
    border-collapse:collapse;
    border-top:1px solid #ddd;
    border-left:1px solid #ddd;
}

#bbsData .privercy-contract .tbl caption {
    display:none;
}

#bbsData .privercy-contract .tbl th,
#bbsData .privercy-contract .tbl td {
    height:32px;
    padding:5px;
    border-right:1px solid #ddd;
    border-bottom:1px solid #ddd;
    font-size:8px;
    letter-spacing:0;
}

#bbsData .privercy-contract .tbl th {
    background:#f7f7f7;
    color:#444;
    font-weight:500;
    text-align:center;
}

#bbsData .privercy-contract .tbl td .txt-l {
    margin:0;
    padding:5px;
    text-align:left;
}


/* =========================================================
   등록하기 / 목록보기
   ========================================================= */

#bbsData .bbs-link-btm {
    margin-top:30px;
    text-align:center;
    font-size:0;
}

#bbsData .bbs-link-btm dt {
    display:none;
}

#bbsData .bbs-link-btm dd {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:5px;
}

#bbsData .bbs-link-btm a {
    display:flex;
    align-items:center;
    justify-content:center;
    width:150px;
    height:42px;
    margin:0;
    padding:0;
    border-radius:0;
    font-size:9px;
    font-weight:500;
    line-height:42px;
    box-sizing:border-box;
}

#bbsData .bbs-link-btm a.CSSbuttonBlack {
    border:1px solid #333;
    background:#333;
    color:#fff;
}

#bbsData .bbs-link-btm a.CSSbuttonWhite {
    border:1px solid #aaa;
    background:#fff;
    color:#444;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media screen and (max-width:768px) {

    #bbsData .bbs-hd {
        margin-bottom:25px;
    }

    #bbsData .bbs-hd .link li {
        padding:0 9px;
    }

    #bbsData .bbs-hd .link li:first-child {
        padding-left:0;
    }

    #bbsData .bbs-hd .link li a {
        padding-bottom:8px;
        font-size:9px;
    }

    #bbsData .bbs-tit h3 {
        font-size:15px;
    }


    /* 상품 정보 */

    #bbsData .prd-tinfo {
        padding:10px;
    }

    #bbsData .prd-tinfo dt {
        flex:0 0 55px;
        width:55px;
        height:55px;
        margin-right:10px;
    }

    #bbsData .prd-tinfo dt img {
        width:55px;
        height:55px;
    }

    #bbsData .prd-tinfo dd ul li {
        font-size:8px;
    }


    /* 글쓰기 표 */

    #bbsData .bbs-table-write table,
    #bbsData .bbs-table-write tbody,
    #bbsData .bbs-table-write tr,
    #bbsData .bbs-table-write th,
    #bbsData .bbs-table-write td {
        display:block;
        width:100%;
    }

    #bbsData .bbs-table-write colgroup {
        display:none;
    }

    #bbsData .bbs-table-write tr {
        border-bottom:1px solid #e8e8e8;
    }

    #bbsData .bbs-table-write th {
        padding:9px 8px 4px;
        border:0;
        background:#fff;
        font-size:8px;
    }

    #bbsData .bbs-table-write td {
        padding:4px 8px 10px;
        border:0;
        font-size:8px;
    }

    #bbsData .bbs-table-write .input_style1,
    #bbsData .bbs-table-write .input_style2,
    #bbsData .bbs-table-write .input_style3 {
        width:100%;
    }

    #bbsData .bbs-table-write textarea {
        min-height:220px;
    }


    /* 주문번호 */

    #bbsData .bbs-table-write .myorder .input-group {
        width:calc(100% - 95px);
    }

    #bbsData .bbs-table-write .myorder .input-group input {
        width:100%;
    }

    #bbsData .bbs-table-write .btn_gray {
        width:88px;
        margin-left:3px;
        padding:0 4px;
    }


    /* 주문조회 레이어 */

    #myorderlayer {
        position:fixed;
        top:50%;
        left:12px;
        width:calc(100vw - 24px);
        max-width:none;
        max-height:80vh;
        overflow-y:auto;
        transform:translateY(-50%);
    }

    #myorderlayer .tit {
        padding:16px;
        font-size:13px;
    }

    #myorderlayer .cnt {
        padding:15px 10px;
    }

    #myorderlayer .cnt .cnt-tab li a {
        font-size:8px;
    }

    #myorderlayer .cnt table colgroup {
        display:table-column-group;
    }

    #myorderlayer .cnt table,
    #myorderlayer .cnt table tbody,
    #myorderlayer .cnt table thead {
        display:table;
        width:100%;
    }

    #myorderlayer .cnt table tr {
        display:table-row;
    }

    #myorderlayer .cnt table th,
    #myorderlayer .cnt table td {
        display:table-cell;
        width:auto;
        padding:8px 2px;
        font-size:7px;
    }


    /* 개인정보 */

    #bbsData .new-privercy-contract {
        padding:10px;
    }

    #bbsData .privercy-contract-tap ul {
        display:block;
    }

    #bbsData .privercy-contract-tap li {
        border-bottom:1px solid #eee;
    }


    /* 하단 버튼 */

    #bbsData .bbs-link-btm {
        margin-top:25px;
    }

    #bbsData .bbs-link-btm dd {
        gap:4px;
    }

    #bbsData .bbs-link-btm a {
        flex:1;
        width:auto;
        max-width:160px;
        height:40px;
        font-size:9px;
        line-height:40px;
    }
}
/* BASIC css end */