/* Common **********************************************************************/
*{margin: 0;padding: 0; text-decoration: none; color: #333; list-style: none; box-sizing: border-box; -webkit-text-size-adjust: none; font-family: 'Noto Sans KR', sans-serif; font-weight: 400; box-sizing: border-box;}
h1, h2, h3, h4, h5, h6{border: none;}
button{background: none; border: none;}
img{border: none;}
body{font-size: 15px;}

input{border: 1px solid #a8a8a8; padding-left: 10px; background: #fff; box-shadow: none;}
input, select option, textarea{font-size: 12px; color: #333;}
textarea{resize: none;}
input[type=password] {font-size: 12px; color: #333; font-family: 'dotum';}
.clear::after{content: " "; display: block; clear: both;}
input::-webkit-input-placeholder {color:#ccc;}
input:-moz-placeholder {color:#ccc; opacity:1;}
input::-moz-placeholder {color:#ccc; opacity:1;}
input:-ms-input-placeholder {color:#ccc;}
input:placeholder-shown {color:#ccc;}
table{border-collapse: collapse;}
fieldset{border: none;}

.check_wrap input[type="checkbox"]{display: none;}
.check_wrap span{padding-left: 20px;}
.check_wrap span::before{content: " "; display: inline-block; width: 15px; height: 15px; background: #fff; border: 1px solid #ccc; text-align: center; font-size: 11px; color: #444; margin-right: 5px; position: absolute; top: 0; left: 0;}
.check_wrap input:checked ~ span:before{content: "✔";  background: #fafafa;}



/*header ***************************************************************************/
#header{width: 100%;}
.header_top{width: 100%; height: 120px; position: relative; border-bottom: 1px solid #eee; background: #fff;}
.header_top .h_wrap{width: 1282px; height: 120px;  margin: 0 auto; position: relative; border-bottom: 1px solid #eee; text-align: center; padding-top: 17px;}
.header_top .top_menu{position: absolute; right: 20px; bottom: 14px;}
.header_top .top_menu a{margin: 0 10px;}
.header_top .top_menu .join::before{content: "|"; display: inline-block; margin: 0 10px 0 5px; font-size: 12px;}
.header_top .menu{display: none;}
.header_bottom{width: 1282px; margin: 0 auto; text-align: center}
.header_bottom .gnb{display: inline-block;}
.header_bottom .gnb li{float: left; margin: 0 54px; height: 55px; line-height: 55px;}
.header_bottom .gnb li a{font-size: 20px; font-weight: 500; }
.header_bottom .gnb li a:hover{color: #659860;}
.header_bottom .top_menu{display: none;}
.header_bottom .main_logo{display: none;}


#header.on::after{content: ""; display: block; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); position: fixed; top: 0; right: 0; z-index: 99;}

/*footer ***************************************************************************/
#footer{width: 100%;}
    .f_line01{width: 100%; height: 46px; border-top: 1px solid #626262; border-bottom: 1px solid #e5e5e5;}
    .f_line01 .f01_wrap{width: 1282px; height: 100%; margin: 0 auto; line-height: 46px;}

    .f_line02{width: 1282px; height: 143px; margin: 0 auto;}
    .f_line02 .t1{font-size: 17px; font-weight: 600; color: #444; margin-top: 25px;}
    .f_line02 .t1::after{content: ""; display: block; width: 17px; height: 1px; background: #555; margin-top: 18px;}
    .f_line02 .t2{margin-top: 25px;}
    .f_line02 .t2 span{font-size: 12px; color: #6d6d6d;}
    .f_line02 .t2 .gray{color: #adadad; display: inline-block; margin-right: 5px;}
    .f_line02 .t2 .t2W{margin-right: 15px; display: inline-block;}

/*login ***************************************************************************/
.sfigure_wrap.logf{background: url('/Skin/images/pc/sbg_login.jpg') no-repeat center center/cover;}

.login_menu{width: 100%; height: 335px; background: #fafafa; border-top: 1px solid #191919; margin-bottom: 290px;}

.login_con{width: 460px; margin: 0 auto; padding-top: 60px;}
.login_con table{width: 100%;}
.login_con table td{width: 100%; height: 60px;}
.login_con table td.link_area{text-align: center;}
.login_con table td.link_area a{text-decoration: underline; color: #666; font-size: 15px;}
.login_con table td.link_area a:first-child::after{content: '|'; display: inline-block; margin: 0 15px;}

.login_con table .ip_txt{width: 100%; height: 50px; padding-left: 20px; border: 1px solid #ccc; font-size: 15px;}
.login_con table .ip_txt::-webkit-input-placeholder {font-size: 15px;}
.login_con table .ip_txt:-moz-placeholder {font-size: 15px;}
.login_con table .ip_txt::-moz-placeholder {font-size: 15px;}
.login_con table .ip_txt:-ms-input-placeholder {font-size: 15px;}
.login_con table .ip_txt:placeholder-shown {font-size: 15px;}

.login_con table .submit_btn{width: 100%; height: 50px; background: #448c1e; color: #fff; font-size: 17px; margin-top: 40px; font-weight: 700;}

/* login - join **********************************************************************/
.join_box{width: 1360px; margin: 0 auto; padding-bottom: 30px; padding-top: 28px;}
.join_box01{border-bottom: 1px solid #e6e6e6;}
.join_box .t1{font-size: 17px; font-weight: 700; margin-bottom: 20px;}

/*scroll*/
.join_box .privacy_scroll{width: 100%; height: 180px; margin: 0 auto;  border: 1px solid #ddd; background: #f7f7f7;}
.join_box .privacy_scroll .swiper-slide {-webkit-box-sizing: border-box; box-sizing: border-box; padding-left: 20px; height: auto;}
.join_box .privacy_scroll .swiper-slide p{white-space: pre-line; line-height: 24px; font-size: 13px; font-weight: 400; color: #666;}
.join_box .swiper-scrollbar.privacy_scrollbar{background: none;}
.join_box .swiper-scrollbar.privacy_scrollbar .swiper-scrollbar-drag{width: 3px; background: #7d7d7d; top:10px; left: 2px;}
.join_box03 .member_info .phone_select ~ span{display: inline-block; margin: 0 5px;}

/*input check*/
.check_wrap{margin-top: 22px;}
.check_wrap .bfcheck{font-size: 13px; margin-right: 5px;}
.check_btn span{font-size: 13px; position: relative; top: -2px; color: #333;}
.join_box_all .check_wrap{margin-left: 25px;}
.join_box_all .check_wrap span{font-size: 14px; font-weight: 700; padding-left: 25px;}


.join_box03{width: 100%;}
.join_box03 .member_info{width: 100%; border-collapse: collapse;}
.join_box03 .member_info tr:first-child th,
.join_box03 .member_info tr:first-child td{border-top: 2px solid #000}
.join_box03 .member_info tr th,
.join_box03 .member_info td{border-bottom: 1px solid #e6e6e6; padding: 10px 0;}
.join_box03 .member_info input{height: 35px; width: 400px; border: 1px solid #d5d5d5; padding-left: 10px;}
.join_box03 .member_info input::placeholder{color: #aaa;}
.join_box03 .member_info input:-moz-placeholder{color: #aaa;}
.join_box03 .member_info input::-moz-placeholder{color: #aaa;}
.join_box03 .member_info input:-ms-input-placeholder{color: #aaa;}
.join_box03 .member_info input:-webkit-input-placeholder{color: #aaa;}
.join_box03 .member_info input.cellphone{width: 123px;}
.join_box03 .member_info input.mail01{width: 126px;}
.join_box03 .member_info input.mail02{width: 125px;}
.join_box03 .member_info th{width: 160px; height: 56px; background: #f7f7f7; text-align: center; color: #000; font-size: 15px;}
.join_box03 .member_info td{padding-left: 10px;}
.join_box03 .member_info .info_submit{width: 110px; height: 35px; background: #333; font-size: 13px; color: #fff; margin-left: 10px;}
.join_box03 .member_info .phone_select{width: 123px; height: 35px; border: 1px solid #d5d5d5; padding-left: 10px;}
.join_box03 .member_info .mail_select{width: 126px; height: 35px; border: 1px solid #d5d5d5; padding-left: 10px; margin-left: 5px;}
.join_box03 .member_info .mail_txt{font-size: 13px; margin: 0 5px;}
.join_box03 .member_info .address .address_m{margin: 8px 0;}

.join_box03 .member_info .twoBox input,
.join_box03 .member_info .twoBox button{float: left;}

.join_box03 .btn_center{text-align: center; margin-top: 70px;}
.join_box03 .btn_center .btn_wrap{display: inline-block;}
.join_box03 .btn_center .btn_wrap .join_submit{width: 130px; height: 40px; font-size: 15px; font-weight: 700;}
.join_box03 .btn_center .btn_wrap .join_in{background: #4a8400; color: #fff; margin-right: 10px;}
.join_box03 .btn_center .btn_wrap .join_cancle{background: #ccc; color: #666;}


/*paging*/

.paging{clear:both; margin-top: 54px; text-align:center;}
.paging span,.paging a,.paging strong{display:inline-block; border:1px solid #b5b4b4; color:#7c7a7a; line-height: 26px; min-width: 25px; height: 26px; overflow:hidden; border-radius: 2px; font-size: 13px;}
.paging a{color:inherit;}
.paging strong{background:#4a8400; color:white; border:0;}
.paging .first, .paging .last{display:none;}
.paging .first,.paging .prev,.paging .prevp,.paging .nextp,.paging .next,.paging .last{width: 25px; height: 26px;}
.paging .prevp{margin-right: 20px;}
.paging .nextp{margin-left: 20px;}
.paging .prev:before{content:'<<'; display:block; height:100%;}
.paging .prevp:before{content:'<'; display:block; height:100%;}
.paging .nextp:before{content:'>'; display:block; height:100%;}
.paging .next:before{content:'>>'; display:block; height:100%;}

/* 모달창 */

.modal_layer{position:fixed; top:0; left:0; z-index:5000; display:none; width:100%; height:100%; background:rgba(0,0,0,0.3);}
.modal_layer .modal_wrap{position:fixed; top:50%; left:50%; z-index:2; width:400px; height:300px; padding-top:50px; max-width:90%; max-height:90%; background:#F7F7F7; -moz-transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); -o-transform:translate(-50%, -50%); transform:translate(-50%, -50%);}
.modal_layer .modal_header{position:absolute; top:0; left:0; width:100%; height:50px; background:#2C3E50;}
.modal_layer .modal_header h1{padding:0 80px 0 20px; height:100%; font-size:16px; color:white; overflow:hidden; line-height:50px;}
.modal_layer .modal_header .close{position:absolute; top:16px; left:100%; margin-left:-38px; line-height:16px; font-size:18px; color:white; cursor:pointer; text-align:center;}
.modal_layer .modal_header .close{margin-left:-35px; font-size:24px;}
.modal_layer .modal_header .close i{font-size:16px;}
.modal_layer .modal_header .close i:before,.modal_layer .modal_header .close i:after{background:#fff;}
.modal_layer .submit_btn button{height:40px; font-size:14px; width:100px;}
.modal_layer .modal_contents{height:100%; overflow-y:auto;}
.modal_layer .modal_contents .modal_inner{padding:20px;}

p.alert{padding-bottom:20px; color:#c10;}

.modalConfirm{position:fixed; top:0; left:0; z-index:100; width:100%; height:100%; background:#999; background:rgba(0,0,0,0.1);}
.modalConfirm form{position:absolute; top:50%; left:50%; width:300px; padding:20px; margin:-80px 0 0 -150px; border:2px solid #333; background:#fff; text-align:center;}
.modalConfirm p{font-weight:700; padding-bottom:15px;}
.modalConfirm .sPopBtns{padding-top:10px;}
.modalConfirm .sPopBtns button + *{margin-left:5px;}
.modalConfirm .sPopBtns a + *{margin-left:5px;}

.nothing{text-align:center; color:#888; padding:20px 0;}

.fileUploadArea2{padding:10px 0;}
.fileUploadArea2 + .fileUploadArea2{padding-top:0;}
.fileUploadArea2 p{display:inline-block;}

#Reply{padding-top:50px; width:100%;}
#Reply h3{font-weight:700; padding-bottom:5px;}
#Reply h3 span{font-weight:400; color:#888; font-size:12px;}
#Reply fieldset{border:0;}
#Reply textarea{width:100%; resize:none;}
.repAttachImg{display:inline-block; padding-bottom:10px;}
.repAttachImg img{max-width:200px; max-height:200px;}

.replyWrite{margin-bottom:20px; padding-bottom:5px;}
.replyWrite fieldset{padding:5px 0;border-top:1px solid #b8c2cc;}
.replyWrite fieldset.user{display:table; width:100%; table-layout:fixed; background:#e6ecf2;}
.replyWrite fieldset.user dl{display:table-cell;}
.replyWrite fieldset.user dt{display:inline-block; width:100px; text-align:center; font-size:12px; font-weight:700; color:#828b99;}
.replyWrite fieldset.user dd{display:inline-block;}
.replyWrite fieldset.text{position:relative; padding-right:150px;}
.replyWrite fieldset.text textarea{height:100px; margin:0;}
.replyWrite fieldset.text .btn{position:absolute; top:5px; right:0; width:140px; height:100px;}
.replyWrite fieldset.text .btn button{width:100%; height:100%; background:#828b99; font-size:20px; color:#fff; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; text-align:center;}
.replyWrite div.option{padding:0;}
.replyWrite div.option:after{content:' '; display:block; clear:both}
.replyWrite div.option > span{float:left; width:80px;}
.replyWrite div.option .fileUploadArea2{padding:0; float:left;}

.replyAnswer fieldset.text{padding-right:0;}

.replyDelete{position:absolute; top:50%; left:50%; padding:10px 20px; margin-bottom:0; border:1px solid #e6ecf2; background:rgba(255, 255, 255, 0.8); -moz-transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); -o-transform:translate(-50%, -50%); transform:translate(-50%, -50%); text-align:center;}
.replyDelete fieldset{border:0;}
.replyDelete fieldset.pwd p{font-size:11px; margin-right:5px; color:#828b99; line-height:15px; vertical-align:middle; font-weight:700;}
.replyDelete fieldset.pwd span.pwdinp{display:block; padding-top:10px; vertical-align:middle;}
.replyDelete .btn{padding-top:10px;}

#replyListContents{font-size:0.90em;}
#replyListContents article{position:relative; border-bottom:1px solid #b8c2cc;}
#replyListContents article:first-child{border-top:1px solid #b8c2cc;}
#replyListContents header{padding:7px; background:#e6ecf2;}
#replyListContents header:after{content:' '; display:block; clear:both}
#replyListContents header b{display:inline-block; font-weight:700; margin-right:5px;}
#replyListContents .btns{float:right;}
#replyListContents .btns a{float:left; display:block; padding:2px 5px; background:#3c4155; color:#fff; font-size:0.9em; border-radius:2px; -webkit-border-radius:2px; -moz-border-radius:2px;}
#replyListContents .btns a + a{margin-left:5px;}
#replyListContents .btns a.replyActionBtn{font-weight:400; border:1px solid #3c4155; line-height:11px; background:#828b99; color:#fff;}
#replyListContents .btns a.replyActionBtn .num,
#replyListContents .btns a.replyActionBtn b{color:#fff;}
#replyListContents .btns a.replyActionBtn.already{font-weight:700; background:#3c4155;}
#replyListContents .btns a.replyReportActionBtn{background:#713f73; border-color:#341133; color:#fff;}
#replyListContents .btns a.replyReportActionBtn.already{background:#341133;}
#replyListContents form .btn{text-align:right;}
#replyListContents form .btn button + button{margin-left:5px;}
#replyListContents .comment{padding:10px; line-height:1.5em;}
#replyListContents .comment b{color:#999; margin-right:10px;}
#replyListContents a.pwdView{color:#713f73; display:inline-block; margin-left:5px; font-weight:700;}
#replyListContents .fileUploadArea2{padding:0; line-height:30px;}

.repLayer{position:fixed; top:0; left:0; z-index:100; width:100%; height:100%; background:#999; background:rgba(0,0,0,0.1);}
.repLayer form{position:absolute; top:50%; left:50%; width:400px; padding:20px; margin:-80px 0 0 -150px; border:2px solid #333; background:#fff; text-align:center;}
.repLayer div.btn{padding-top:10px;}
.repLayer div.btn button + button{margin-left:5px;}
.repLayer .targetContent{text-align:left; font-size:0.9em;}
.repLayer textarea{height:80px;}
.repLayer fieldset.user{text-align:left;}
.repLayer fieldset.user dl,.repLayer .repLayer fieldset.user dt,.repLayer .repLayer fieldset.user dd{display:inline-block;}
.repLayer fieldset.user dd input{width:100px;}
.repLayer fieldset.pwd{text-align:center;}
.repLayer fieldset.pwd p{font-weight:700; padding:15px 0 5px;}

table.write{width:100%; table-layout:fixed; border-collapse:collapse;}
table.write th{width:200px; padding-left: 22px; border:1px solid #eee; border-width:1px 0; text-align:left; background:#f7f7f7; height:40px; font-weight:400;}
table.write td{padding:10px; border:1px solid #eee; border-width:1px 0; text-align:left;}
table.write label + label{margin-left:10px;}
table.write select + select{margin-left:10px;}
table.write p + p{margin-top:5px;}
table.write textarea{height:250px; width:100%; resize:none;}
table.write input[type=text], table.write input[type=tel], table.write input[type=email], table.write input[type=password]{height:30px; font-size:16px;}
table.write span.guide{display:inline-block; vertical-align:middle; padding-left:10px; color:#777;}

.bottomBtnWrap{text-align: center;}
.bottomBtn{padding-top:20px; display: inline-block;}
.bottomBtn > * + *{margin-left:10px;}

.se2_addi_btns{padding:2px 5px; border:1px solid #ddd; border-bottom:0; background:#f4f4f4; font-size:12px; font-weight:700; color:#666; text-align:right;}
.se2_addi_btns > div{display:inline-block;}
.se2_addi_btns > div + div{margin-left:5px;}
.se2_addi_btns button{height:18px; padding:0 5px; border:1px solid #aaa; background:-webkit-linear-gradient(#fff, #fff, #fff, #eee); background:-moz-linear-gradient(#fff, #fff, #fff, #eee); background:-o-linear-gradient(#fff, #fff, #fff, #eee); background:linear-gradient(#fff, #fff, #fff, #eee); border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; vertical-align:middle;}
.se2_addi_btns .se2_add_img button i{position:relative; display:inline-block; width:12px; height:12px; border:1px solid #b18d82; border-radius:2px; -webkit-border-radius:2px; -moz-border-radius:2px; background:#fff; margin-right:5px; overflow:hidden; vertical-align:middle;}
.se2_addi_btns .se2_add_img button i:after{content:''; position:absolute; top:100%; left:50%; width:30px; height:30px; margin:-4px 0 0 -15px; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; background:#0db01c;}
.se2_addi_btns .se2_add_img button i:before{content:''; position:absolute; top:10%; right:10%; width:4px; height:4px; display:block; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; background:#ff8d46;}
.se2_addi_btns .se2_add_youtube button i{position:relative; display:inline-block; width:12px; height:8px; border-radius:2px; -webkit-border-radius:2px; -moz-border-radius:2px; background:#c11; margin-right:5px; overflow:hidden;}
.se2_addi_btns .se2_add_youtube button i:before{content:''; display:block; width:1px; height:150%;}
.se2_addi_btns .se2_add_youtube button i:after{content:''; position:absolute; top:50%; left:50%; display:block; border-top:2px solid transparent; border-left:4px solid #fff; border-bottom:2px solid transparent; margin:-2px 0 0 -2px;}
.se2_addi_btns .se2_add_link button i{position:relative; display:inline-block; width:14px; height:14px; margin-right:5px; overflow:hidden;}
.se2_addi_btns .se2_add_link button i:before{content:''; display:block; width:4px; height:2px; border:2px solid #666; border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px; -moz-transform:translate(0, 5px) rotate(-45deg); -webkit-transform:translate(0, 5px) rotate(-45deg); -ms-transform:translate(0, 5px) rotate(-45deg); -o-transform:translate(0, 5px) rotate(-45deg); transform:translate(0, 5px) rotate(-45deg);}
.se2_addi_btns .se2_add_link button i:after{content:''; position:absolute; top:0; left:0; display:block; width:4px; height:2px; border:2px solid #888; border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px; -moz-transform:translate(5px, 3px) rotate(-45deg); -webkit-transform:translate(5px, 3px) rotate(-45deg); -ms-transform:translate(5px, 3px) rotate(-45deg); -o-transform:translate(5px, 3px) rotate(-45deg); transform:translate(5px, 3px) rotate(-45deg);}

#youtubeLinkModal .modal_wrap{width:500px; height:350px;}
#youtubeLinkModal .modal_contents{padding:20px;}
#youtubeLinkModal textarea{height:150px; border:1px solid #ccc;}
#youtubeLinkModal input[type=text]{width:60px; margin-right:5px; border:1px solid #ccc; height:24px;}
#youtubeLinkModal textarea{width:100%; height:150px; border:1px solid #ccc;}
#youtubeLinkModal dl{display:table; width:100%; table-layout:fixed;}
#youtubeLinkModal dt{display:table-cell; width:80px; padding:2px;}
#youtubeLinkModal dd{display:table-cell; padding:2px;}
#youtubeLinkModal footer{margin-top:10px; text-align:center;}

#urlLinkModal .modal_wrap{width:500px; height:170px;}
#urlLinkModal .modal_contents{padding:20px;}
#urlLinkModal textarea{height:150px; border:1px solid #ccc;}
#urlLinkModal input[type=text]{width:100%; border:1px solid #ccc; height:24px;}
#urlLinkModal textarea{height:150px; border:1px solid #ccc;}
#urlLinkModal dl{display:table; width:100%; table-layout:fixed;}
#urlLinkModal dt{display:table-cell; width:80px; padding:2px;}
#urlLinkModal dd{display:table-cell; padding:2px;}
#urlLinkModal footer{margin-top:10px; text-align:center;}

dl.links{display:table; width:100%; table-layout:fixed;}
dl.links dt{display:table-cell; width:100px; padding-left:20px;}
dl.links dd{display:table-cell;}
dl.links a{text-decoration:underline; font-weight:700;}

.w10p{width:10%;}
.w20p{width:20%;}
.w30p{width:30%;}
.w40p{width:40%;}
.w50p{width:50%;}
.w60p{width:60%;}
.w70p{width:70%;}
.w80p{width:80%;}
.w90p{width:90%;}
.w100p{width:100%;}

.w5p{width:5%;}
.w15p{width:15%;}
.w25p{width:25%;}
.w35p{width:35%;}
.w45p{width:45%;}
.w55p{width:55%;}
.w65p{width:65%;}
.w75p{width:75%;}
.w85p{width:85%;}
.w95p{width:95%;}

.hidden, .hide{display:none;}



/*board ********************************************************/

/*common*/
.guide{color:#999; font-size:11px;}
ul.guide, p.guide{padding-top:5px;}
.requiredBullet{font-weight:700; color:#ff0000; margin-right:5px;  font-weight: 400;-moz-transform:translate(0, -5px); -webkit-transform:translate(0, -5px); -ms-transform:translate(0, -5px); -o-transform:translate(0, -5px); transform:translate(0, -5px);}

span.secretDoc{ display:inline-block; width: 14px; height: 16px; margin-right: 5px; vertical-align:middle; overflow:hidden;}
span.secretDoc:before{content:''; display: block; width:100%; height:100%; margin-bottom:10px; background: url('/Skin/images/pc/sub_img/lock.png') no-repeat center/cover;}
span.answerDoc{ display:inline-block; width: 20px; height: 12px; margin-right: 5px; vertical-align:middle; overflow:hidden;}
span.answerDoc:before{content:''; display: block; width:100%; height:100%; margin-bottom:10px; background: url('/Skin/images/pc/sub_img/reply.png') no-repeat center/cover;}
.newDoc{display:inline-block; width:16px; height:16px; vertical-align:middle; overflow:hidden; text-align:center; background:#c10; border-radius:3px; margin-left:5px;}
.newDoc:before{content:'N'; display:block; width:100%; height:100%; margin-bottom:10px; color:#fff; font-weight:800; line-height:16px; font-size:11px;}

a.sBtn, button.sBtn{display:inline-block; padding:3px 10px; background:#929599; color:#fff; vertical-align:middle; font-size:12px; line-height:16px;}
a.mBtn, button.mBtn{display:inline-block; min-width: 62px; height:30px; padding:0 10px; text-align:center; background:#929599; color:#fff; vertical-align:middle; font-size:14px; line-height:18px;}
a.bBtn, button.bBtn{display:inline-block; min-width:200px; height:40px; text-align:center; padding:0 20px; background:#929599; color:#fff; vertical-align:middle; font-size:16px; line-height:24px;}
a.sBtn:before, a.mBtn:before, a.bBtn:before{content:''; display:inline-block; width:0; height:100%; vertical-align:middle;}

.leftSysBtn{padding-top:10px;}
.leftSysBtn:after{content:' '; display:block; clear:both}
.leftSysBtn > *{margin:0 2px;}
a.btn1, button.btn1{background:#fff; color:#333; border:1px solid #ccc;}
a.btn2, button.btn2{background:#3c4155; color:#fff;}
a.btn3, button.btn3{background:#c10; color:#fff;}
.right_btn::after{content: ""; display: block; clear: both;}
.right_btn .boardWriteBtn{float: right; background: #aaa; margin-top: 20px;}

.boardList ul{display:table; table-layout:fixed; width:100%;}
.boardList li{display:table-cell; line-height:20px; font-size: 15px; text-align: center;}
.boardList header ul{ border-top: 1px solid #dbdbdb;  border-bottom: 1px solid #dbdbdb; background: #f9f9f9;}
.boardList header li{font-weight: 600; padding:19px 0; color: #000;}
.boardList li.check{width: 5%;}
.boardList li.num{width: 7%;}
.boardList li.category{width: 10%;}
.boardList li.name{width: 10%;}
.boardList li.date{width: 15%;}
.boardList li.hit{width: 7%;}

.boardList article ul{border-bottom: 1px solid #dbdbdb;}
.boardList article li{padding:26px 0; font-weight: 400; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.boardList article li.subject{text-align: left;}

.book01{color:#df8c0f; font-weight:700;}
.book02{color:#75b324; font-weight:700;}

.categoryTab{display:none;}

@media (max-width:1000px){
    .boardList li.date{width: 20%;}
    .boardList li.hit{width: 8%;}
}
@media (max-width:700px){
    .boardList article ul{display:block;}
    .boardList header li{display:none;}
    .boardList header li.check,
    .boardList header li.subject{display:table-cell;}
    .boardList header li.check,
    .boardList header li.num{width:15%;}
    .boardList header li.check + li.num{display:none;}
    .boardList article ul{position:relative; padding:10px 0 10px 15%;}
    .boardList article ul:after{content:''; display:block; clear:both;}
    .boardList article li{float:left; display:inline-block; width:auto; padding:0; text-align:left; overflow:visible;}
    .boardList article li.name,
    .boardList article li.date,
    .boardList article li.hit,
    .boardList article li.category{width:auto;}
    .boardList article li.category:before{content:'[';}
    .boardList article li.category:after{content:']'; margin-right:5px;}
    .boardList article li.subject{max-width:100%; word-break:break-all; white-space:normal;}
    .boardList article li.check{width:auto; position:absolute; top:50%; left:0; margin-top:-20px; width:15%; text-align:center;}
    .boardList article li.num{width:auto; position:absolute; top:50%; left:0; margin-top:-10px; width:15%; text-align:center;}
    .boardList article li.check + li.num{ margin-top:0px;}
    .boardList article li.name{clear:left;}
    .boardList article li.subject ~ li{font-size:11px;}
    .boardList article li.name ~ li:before{content:'|'; color:#ccc; display:inline-block; margin:0 5px;}
}

.BoardView{width: 100%; margin: 0 auto; margin-bottom: 200px;}
    .BoardView header{width: 100%; min-height: 60px; border-top: 1px solid #d6d6d6;   border-bottom: 1px solid #d6d6d6; padding: 20px 30px; text-align: left;}
    .BoardView header::after{content: ""; display: block; clear: both;}
	.BoardView .title{font-size: 17px; font-weight: 600; width: 57%; display: inline-block;  word-break: break-word; float: left;}
	.BoardView .h_info{float: right; width: 43%;}
	.BoardView .h_info::after{content: ""; display: block; clear: both;}
	.BoardView .h_info b{font-size: 15px; color: #999;}
    .BoardView .h_info li{font-size: 15px; color: #999; float: left; line-height: 25px; display: inline-block;}
    .BoardView .h_info li::after{content: "|"; display: inline-block; margin: 0 10px;  font-weight: 400;}
    .BoardView .h_info li:last-child::after{display: none;}
	.BoardView .mname{font-size: 15px; color: #999; float: left;  }
	.BoardView .date{font-size: 15px; color: #999; float: left; }

	.BoardView  .count{font-size: 15px; color: #999; float: left; }

    .BoardView .contents{min-height: 400px; text-align: left;  border-bottom: 1px solid #d6d6d6; padding: 40px 30px; margin: 0 5px; line-height: 33px; color: #666; font-size: 15px; font-weight: 400;}
    
    .BoardView  .bottomBtn::after{content: ""; display: block; clear: both;}
    .BoardView  .bottomBtn .mBtn {display: block; width: 92px; height: 40px; line-height: 40px; text-align: center; border-radius: 3px; border: 1px solid #d6d6d6; font-size: 17px; color: #444; float: right; margin-top: 40px; background: none;}

	.bottomBtnIn{float: right;}
    .bottomBtnIn a{display: block; width: 92px; height: 40px; line-height: 40px; text-align: center; border-radius: 3px; border: 1px solid #d6d6d6; font-size: 17px; color: #444; float: left; margin-top: 40px; background: none;}
    
    .BoardContainer #sub_wrap #sub_wrap{padding: 0;}

    #sub_wrap.terms{margin-top: 80px;}
    #sub_wrap.terms .text{width: 100%; min-height: 400px; border: 1px solid #ddd; margin-top: 20px; padding: 20px; font-size: 14px; font-weight: 400; line-height: 25px; word-break: keep-all; color: #444; overflow-y: auto;}

/*
    반응형 ***************************************

    분기점[width]  - 1282 | 1024 | 715 | 590 | 380

*/


@media all and (min-width: 1085px) and (max-width: 1282px){

    /*header*/
    .header_top .h_wrap{width: 100%;}
    .header_bottom{width: 100%;}
    .header_bottom .gnb li{margin: 0 42px;}

    /*footer*/
    .f_line01 .f01_wrap{width: 80%; margin: 0 auto;}
    .f_line02{width: 80%; margin: 0 auto;}

    /*join*/
    .join_box{width: 100%;}


}

@media all  and (min-width: 716px) and  (max-width: 1084px){

    /*header*/
    .header_top{position: fixed; z-index: 99; top: 0; right: 0; box-shadow: 0 -1px 12px rgba(0, 0, 0, 0.2); height: 90px;}
    .header_top .h_wrap{width: 100%; height: 90px;}
    .header_top .h_wrap .main_logo{display: inline-block; height: 60px;}
    .header_top .h_wrap .main_logo img{height: 100%;}
    .header_top .top_menu{display: none;}
    .header_bottom .gnb{margin-top: 50px;}
    .header_bottom .gnb li{float: none; margin: 10px 0;}

    #header .menu{display: block; width: 40px; height: 90px; background: url('/Skin/images/pc/menu.svg') no-repeat center center/contain; cursor: pointer; position: fixed; top: 0; right: 50px; z-index: 9999;}
    #header.on .menu{display: block; width: 30px; height: 90px; background: url('/Skin/images/pc/close.svg') no-repeat center center/contain; position: fixed; top: 0; right: 50px; z-index: 9999; cursor: pointer;}

    .header_bottom{position: fixed; width: 50%; height: 100%; top: 0; right: -100%; background: #fff; z-index: 999; overflow: auto; padding-bottom: 50px;}
    .header_bottom .top_menu{display: block; margin-top: 50px;}
    .header_bottom .top_menu a{display: inline-block; margin: 0 10px;}
    .header_bottom .main_logo{display: block; margin-top: 50px;}

    /*footer*/
    .f_line01 .f01_wrap{width: 80%; margin: 0 auto;}
    .f_line02{width: 80%; margin: 0 auto; height: auto; padding-bottom: 20px;}
    .f_line02 .t2 span{font-size: 13px; line-height: 25px;}

    /*join*/
    .join_box{width: 100%;}
    .join_box03 .member_info th{width: 20%;}
    .join_box03 .member_info .info_submit{margin-left: 0; margin-top: 10px;}
    .join_box03 .member_info .phone_select ~ span{display: inline-block; margin: 0 1%;}

    /*board*/
    .boardList article ul li{font-size: 13px;}

}



@media all and (min-width: 471px) and (max-width: 715px){

    /*header*/
    .header_top{height: 80px; position: fixed; top: 0; right: 0; background: #fff; z-index: 99; box-shadow: 0 -1px 12px rgba(0, 0, 0, 0.2);}
    .header_top .h_wrap{width: 100%; height: 100%; padding-top: 10px;}
    .header_top .top_menu{display: none;}
    .header_top  .main_logo{display: inline-block; width: 78px;}
    .header_top  .main_logo img{width: 100%;}
    .header_bottom .gnb{margin-top: 50px;}
    .header_bottom .gnb li{float: none; margin: 10px 0;}

    #header .menu{display: block; width: 40px; height: 80px; background: url('/Skin/images/pc/menu.svg') no-repeat center center/contain; cursor: pointer; position: fixed; top: 0; right: 30px; z-index: 9999;}
    #header.on .menu{display: block; width: 30px; height: 120px; background: url('/Skin/images/pc/close.svg') no-repeat center center/contain; position: fixed; top: 0; right: 30px; z-index: 9999; cursor: pointer;}

    .header_bottom{position: fixed; width: 100%; height: 100%; top: 0; right: -100%; background: #fff; z-index: 999; overflow: auto; padding-bottom: 50px;}
    .header_bottom .top_menu{display: block; margin-top: 50px;}
    .header_bottom .top_menu a{display: inline-block; margin: 0 10px;}
    .header_bottom .main_logo{display: block; margin-top: 50px;}

    /*footer*/
    .f_line01 .f01_wrap{width: 80%; margin: 0 auto;}
    .f_line02{width: 80%; margin: 0 auto; height: auto; padding-bottom: 20px;}
    .f_line02 .t2 span{font-size: 13px; line-height: 25px;}

    /*login*/
    .login_con{width: 88%;}

    /*join*/
    .join_box{width: 100%;}
    .join_box03 .member_info th{width: 20%; font-size: 13px;}
    .join_box03 .member_info input{width: 100%;}
    .join_box03 .member_info .phone_select{width: 30%;}
    .join_box03 .member_info .phone_select ~ span{font-size: 10px; display: inline-block; margin: 0 1%;}
    .join_box03 .member_info input.cellphone{width: 30%;}
    .join_box03 .member_info input.mail01{width: 30%;}
    .join_box03 .member_info input.mail02{width: 30%;}
    .join_box03 .member_info .mail_select{width: 30%; font-size: 11px;}
    .join_box03 .member_info .mail_txt{font-size: 10px; margin: 0 2px;}
    .join_box03 .member_info .info_submit{margin-left: 0; margin-top: 10px;}

    .join_box03 .btn_center .btn_wrap .join_submit{width: 100px;}

    /*board*/
    .boardList article ul li{font-size: 13px;}

}


@media all and  (max-width: 470px){

    /*header*/
    .header_top{height: 80px; position: fixed; top: 0; right: 0; background: #fff; z-index: 99; box-shadow: 0 -1px 12px rgba(0, 0, 0, 0.2);}
    .header_top .h_wrap{width: 100%; height: 100%; padding-top: 10px;}
    .header_top .top_menu{display: none;}
    .header_top  .main_logo{display: inline-block; width: 78px;}
    .header_top  .main_logo img{width: 100%;}
    .header_bottom .gnb{margin-top: 50px; overflow: auto; height: 100%;}
    .header_bottom .gnb li{float: none; margin: 10px 0;}

    #header .menu{display: block; width: 30px; height: 80px; background: url('/Skin/images/pc/menu.svg') no-repeat center center/contain; cursor: pointer; position: fixed; top: 0; right: 20px; z-index: 9999;}
    #header.on .menu{display: block; width: 30px; height: 120px; background: url('/Skin/images/pc/close.svg') no-repeat center center/contain; position: fixed; top: 0; right: 20px; z-index: 9999; cursor: pointer;}

    .header_bottom{position: fixed; width: 100%; height: 100%; top: 0; right: -100%; background: #fff; z-index: 999; overflow: auto; padding-bottom: 50px;}
    .header_bottom .top_menu{display: block; margin-top: 50px;}
    .header_bottom .top_menu a{display: inline-block; margin: 0 10px;}
    .header_bottom .main_logo{display: block; margin-top: 50px;}

    /*footer*/
    .f_line01 .f01_wrap{width: 80%; margin: 0 auto;}
    .f_line02{width: 80%; margin: 0 auto; height: auto; padding-bottom: 20px;}
    .f_line02 .t2 span{font-size: 13px; line-height: 25px;}

    /*login*/
    .login_con{width: 88%;}

    /*join*/
    .join_box{width: 100%;}
    .join_box .privacy_scroll{height: 120px;}
    .join_box .privacy_scroll .swiper-slide p{font-size: 12px;}
    .join_box .check_btn01{display: block; padding-left: 20px; padding-top: 10px;}
    .join_box .check_btn02{display: block; padding-left: 20px; padding-top: 10px;}
    .join_box .check_btn03 span{word-break: keep-all; display: inline-block; width: 96%;}

    .join_box03 .member_info th{width: 20%; font-size: 13px;}
    .join_box03 .member_info input{width: 100%;}
    .join_box03 .member_info .phone_select{width: 30%;}
    .join_box03 .member_info .phone_select ~ span{font-size: 10px; display: inline-block; margin: 0 1%;}
    .join_box03 .member_info input.cellphone{width: 30%;}
    .join_box03 .member_info input.mail01{width: 30%;}
    .join_box03 .member_info input.mail02{width: 30%;}
    .join_box03 .member_info .mail_select{width: 30%; font-size: 11px; padding-left: 0; background-position: center right 5px; background-size: 3px;}
    .join_box03 .member_info .mail_txt{font-size: 10px; margin: 0 2px;}
    .join_box03 .member_info .info_submit{margin-left: 0; margin-top: 10px; font-size: 13px;}
    .join_box03 .btn_center .btn_wrap .join_submit{font-size: 13px; width: 100px;}

    /*board*/
    .boardList article ul li{font-size: 13px;}

}