@charset "utf-8";

#container.sub {
    width:1200px;
    margin:40px auto;
    position:relative;
}


/*----- media -----*/
@media (max-width:1200px) {
    #container.sub {
        max-width:1200px;
        width:100%;
        padding-bottom:25px;
        margin:0 auto;
    }
}


/*======== snb ========*/
#snb {
    display:inline-block;
    width:200px;
    font-weight:bold;
    text-indent:20px;
    vertical-align:top;
}
#snb .text_title {
    display:block;
    height:100px;
    color:#fff;
    font-size:20px;
    line-height:100px;
    background:#fb503c;
}
.snbArea {
    width:198px;
    border-left:1px solid #e9e9e9;
    border-right:1px solid #e9e9e9;
}
.snbArea > li {
    height:50px;
    color:#707070;
    font-size:15px;
    line-height:50px;
    border-bottom:1px solid #e9e9e9;
    position:relative;
}
.snbArea > li::after {
    content:url(../images/icon/icon_point.png);
    position:absolute;
    top:-2px;
    right:10px;
}
.snbArea > li:hover a {
    color:#fb503c;
}
.snbArea > li.active {
    background:#f5f5f5;
}


/*----- media -----*/
@media (max-width:1200px) {
    #snb {
        width:100%;
        height:50px;
        border-bottom:1px solid #e9e9e9;
    }
    #snb .text_title {
        display:block;
        width:300px;
        height:50px;
        color:#707070;
        font-size:18px;
        text-indent:20px;
        line-height:50px;
        background:none;
        position:relative;
        cursor:pointer;
    }
    #snb .text_title::after {
        content:'▼';
        font-size:12px;
        padding-left:10px;
    }
    .snbArea {
        display:none;
        width:300px;
        background:#fff;
        position:relative;
    }
}
@media (max-width:480px) {
    #snb {
        display:none;
    }
}


/*======== content common ========*/
#container.sub #content {
    display:inline-block;
    width:calc(100% - 245px);
    margin-left:40px;
}


/*----- top area -----*/
#content .topArea {
    margin-bottom:45px;
}
#content .topArea h2 {
    color:#2b2b2b;
    font-size:24px;
    font-weight:300;
    border-bottom:2px solid #2e2e2e;
    padding-bottom:10px;
    margin-bottom:30px;
}
#content .topArea p {
    color:#5e5e5e;
    font-size:13px;
    line-height:24px;
}
#content .topArea p::before {
    content:url(../images/icon/icon_point.png);
    vertical-align:text-bottom;
    margin-right:5px;
}


/*----- content area -----*/
.contentArea {
    border-top: 1px solid #ababab;
}
.contentArea table {
    width:100%;
}
.contentArea tr {
    border-bottom:1px solid #dcdcdc;
}
.contentArea th {
    width:200px;
    color:#2b2b2b;
    font-size:15px;
    font-weight:300;
    text-align:center;
    background:#f7f7f9;
    padding:17px 25px;
}
.contentArea tr:first-of-type td:first-of-type {
    width:130px;
}
.contentArea td {
    color:#2b2b2b;
    font-size:13px;
    font-weight:300;
    padding:10px 25px;
}
.contentArea td.text_sort {
    font-size:17px;
}
.contentArea td input[type='text'] {
    width:100%;
    height:33px;
    border:1px solid #e9e9e9;
}
.contentArea td.short input[type='text'] {
    width:40%;
}
.contentArea td.short input[type='file'] {
    padding-left:20px;
}
.contentArea td.mail input[type=text] {
    width:115px;
}
.contentArea td.mail select {
    width:115px;
    height:30px;
    border:1px solid #e9e9e9;
}
.contentArea td textarea {
    width:100%;
    border:1px solid #e9e9e9;
    resize: none;
}
.contentArea .imgBox{
width:287px;

}
.contentArea .imgBox a {
    display:inline;
}

#g_img {
	display: inline-table;
    width: 310px;
    height: 190px;
    font-size: 13px;
    text-align: center;
    padding: 10px 15px;
}
#g_img img{
	width:97%;
	height:150px;
 
}
#gimgList {
	
	display:inline;
}

/*----- btn area -----*/
.btnArea {
    text-align:center;
    margin:20px 0;
}
.btnArea button {
    width:125px;
    height:50px;
    color:#fff;
    font-family: 'Noto Sans KR', sans-serif;
    font-size:16px;
    font-weight:500;
    border:none;
    margin:0 2px;
}
.btnArea button.btn_submit {
    background:#232323;
}
.btnArea button.btn_cancel {
    background:#929292;
}



/*======== content list ========*/
/*----- table -----*/
#content.list table {

}
#content.list tr {
    height:50px;
}
#content.list th {
    width:auto;
    height:50px;
    color:#303030;
    font-size:15px;
    font-weight:500;
    background:#f7f7f9;
}
#content.list td {
    color:#303030;
    font-size:13px;
    font-weight:300;
    text-align:center;
}
#content.list td a {
    width:400px;
    text-align:left;
}
#content.list .btn_delete {
    border:none;
    background:none;
}

/*----- pagination area -----*/
._pagination {
    text-align:center;
    margin-top:20px;
}
.list_pagination {
    height:40px;
}
.list_pagination li {
    display:inline-block;
    width:38px;
    height:38px;
    color:#303030;
    font-size:14px;
    font-weight:300;
    text-align:center;
    line-height:38px;
    border:1px solid #ddd;
    cursor:pointer;
}
.list_pagination li.select {
    color:#fff;
    font-weight:600;
    border:1px solid #ddd;
    background:#555;
}
.list_pagination li.btn_next {
    text-indent:-9999px;
    overflow:hidden;
    vertical-align:bottom;
    background:url(../images/btn/btn_next.png) no-repeat;
}
.list_pagination li.btn_end {
    text-indent:-9999px;
    overflow:hidden;
    vertical-align:bottom;
    background:url(../images/btn/btn_end.png) no-repeat;
}
.list_pagination li.btn_pre {
    text-indent:-9999px;
    overflow:hidden;
    vertical-align:bottom;
    background:url(../images/btn/btn_pre.png) no-repeat;
}
.list_pagination li.btn_first {
    text-indent:-9999px;
    overflow:hidden;
    vertical-align:bottom;
    background:url(../images/btn/btn_first.png) no-repeat;
}


/*----- btn area -----*/
#content.list .btnArea {
    text-align:right;
}
#content.list .btnArea button.btn_list {
    background:#929292;
}



/*======== content view ========*/
/*----- top area -----*/
#content.view .topArea {
    margin-bottom:25px;
}


/*----- question area -----*/
#content.view ._question {
    min-height:355px;
}
#content.view ._question .text_title {
    color:#303030;
    border-top:1px solid #969696;
    border-bottom:1px solid #e9e9e9;
    padding:40px 25px;
    background:#f7f7f9;
}
#content.view ._question .text_title strong {
    display:block;
    font-size:15px;
    padding-bottom:20px;
}
#content.view ._question .list_date {
    font-size:13px;
}
#content.view ._question .list_date li {
    display:inline-block;
    padding:0 15px;
}
#content.view ._question .list_date li:first-child {
    padding-left:0;
}
#content.view ._question .list_date li:nth-of-type(2) {
    border-left:1px solid #303030;
    border-right:1px solid #303030;
}
#content.view ._question .text_question {
    padding:40px 25px;
}

#content.view .contentArea .box_question .text_question img {
    width:100%;
}

#content.view ._question .text_question img {
    width:100%;
}


#content.view ._question .text_question p {
    color:#303030;
    font-size:14px;
    font-weight:300;
    line-height:24px;
}
#content.view ._answer {
    min-height:140px;
    border:1px solid #e9e9e9;
    padding:35px;
}
#content.view ._answer strong {
    color:#fb503c;
    font-size:15px;
}
#content.view ._answer p {
    color:#303030;
    font-size:14px;
    font-weight:300;
    line-height:24px;
    margin-top:10px;
}


/*======== content faq ========*/
#content.faq .topArea h2 {
    margin-top:30px;
}
#content.faq .topArea ._search {
    text-align:center;
    border:1px solid #ececec;
    background:#f7f7f9;
    padding:35px 0;
}
#content.faq .topArea ._search > div {
    display:inline-block;
}
#content.faq .topArea ._search > div > span {
    color:#333;
    font-size:20px;
    vertical-align:middle;
    padding-right:15px;
}
#content.faq .topArea ._search > div > span strong {
    color:#fb503c;
    font-weight:bold;
}
#content.faq .topArea ._search .text_search {
    width:476px;
    height:46px;
    border:2px solid #fb503c;
}
#content.faq .topArea ._search .btn_search {
    width: 125px;
    height: 46px;
    color: #fff;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 16px;
    font-weight: 500;
    border: none;
    background:#232323;
    margin: 0 2px;
    vertical-align:middle;
}
#content.faq .topArea ._search > div > ul {
    text-align:left;
    color:#2f2f2f;
    font-size:13px;
    margin-top:13px;
    margin-left:93px;
}
#content.faq .topArea .box_search > div > ul li {
    display:inline-block;
    padding:0 10px;
    border-right:1px solid #757576;
}
#content.faq .topArea .box_search > div > ul li:first-child {
    padding-left:0;
}
#content.faq .topArea .box_search > div > ul li:last-child {
    border-right:none;
}

#content.faq .contentArea {
    border:none;
}
#content.faq .contentArea li {
    border-bottom:1px solid #eee;
    padding:25px 5px;
}
#content.faq .contentArea li:first-child {
    padding-top:0;
}
#content.faq .box_question {
    color:#484848;
    font-size:16px;
    cursor:pointer;
}
#content.faq .box_question p::before {
    content:url(../images/icon/icon_question.png);
    vertical-align:middle;
    padding-right:10px;
}
#content.faq .box_answer {
    display:none;
    color:#484848;
    font-size:14px;
    margin-top:30px;
}
#content.faq .box_answer a {
    display:inline-block;
    color:#0f0f0f;
    text-decoration: underline;
    padding-left:10px;
}
#content.faq .box_answer p::before {

    vertical-align:middle;
    padding-right:10px;
}




/*----- btn area -----*/
#content.view .btnArea {
    text-align:center;
}
#content.view .btnArea button.btn_list {
    background:#929292;
}





/*----- media -----*/
@media (max-width:1200px) {
    #container.sub #content {
        width:calc(100% - 40px);
        margin:10px;
    }
    #content.list td a {
        width:300px;
    }
}
@media (max-width:768px) {
	 
    .contentArea th {
        width:60px;
        font-size:12px;
        padding: 10px 5px
    }
    .contentArea tr:first-of-type td:first-of-type {
        width:65px;
    }
    .contentArea td {
        padding: 10px 5px;
    }
    .contentArea td.text_sort {
        font-size:12px;
    }
    input[type=radio] + label span {
        width:18px;
        height:18px;
        background-size:contain;
    }
    #content.list td a {
        width:auto;
    }
    #content.view .box_question .list_date {
        font-size:12px;
    }
    #content.view .box_question .list_date li {
        padding:0 5px;
    }

    #content.faq .topArea .box_search > div > span {
        display:block;
        text-align:left;
    }
    #content.faq .topArea .box_search .text_search {
        display:block;
        min-width:300px;
        width:100%;
        margin:10px 0;
    }
    #content.faq .topArea .box_search .btn_search {
        display:block;
        min-width:300px;
        width:100%;
    }
    #content.faq .topArea .box_search > div > ul {
        margin-left:0;
    }

}
@media (max-width:500px) {
    .contentArea td span.divide {
        display:block;
        margin:3px 0;
    }

    #content.list .box_table{
        overflow-x:auto;
    }
    #content.list table{
        width:500px;
    }
    .list_pagination li:nth-of-type(6),
    .list_pagination li:nth-of-type(7),
    .list_pagination li:nth-of-type(8),
    .list_pagination li:nth-of-type(9),
    .list_pagination li:nth-of-type(10) {
        display:none;
    }
    #content.view .box_question .list_date li {
        display:block;
        padding:0;
    }
    #content.view .box_question .list_date li:nth-of-type(2) {
        border:none;
    }
    .contentArea td.short input[type='text'] {
        width:100%;
    }
    .contentArea td.short input[type='file'] {
        padding:0;
    }
}
@media (max-width:380px) {
    #container.sub #content {
        width:calc(100% - 20px);
        margin:10px;
    }
}




    /*======== quickWrap ========*/
.quickWrap {
    width:110px;
    font-weight:300;
    position:fixed;
    top:247px;
    left:50%;
    margin-left:630px;
}
.quickWrap .text_title {
    display:block;
    color:#2b2b2b;
    font-size:15px;
    text-align:center;
    border:1px solid #e9e9e9;
    padding:7px 0;
}
.quickWrap ul {
    border-left:1px solid #e9e9e9;
    border-right:1px solid #e9e9e9;
}
.quickWrap li {
    height:30px;
    color:#4b4b4b;
    font-size:12px;
    text-indent:15px;
    line-height:30px;
    border-bottom:1px solid #e9e9e9;
}
.quickWrap .btn_top {
    width:100%;
    height:35px;
    color:#fff;
    font-size:15px;
    border:none;
    background:#999;
    margin-top:5px;
}
.quickWrap .btn_top::after {
    content:url(../images/icon/icon_top.png);
    margin-left:5px;
}


/*----- media -----*/
@media (max-width:1200px) {
    .quickWrap {
        display:none;
    }
}