/* 여기에 작업 또는 수정할 당신의 css style을 설정하세요. (customizations) */
/* 헤드 */
.visitnum{
    display: none !important;
}

.disnone{
    display: none !important;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul,a {
	list-style: none;
    text-decoration: none;
    color: #131415;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
button{
	border: none;
	background-color: transparent;
	padding: 0;
}
label{
	vertical-align: sub;
}

input:focus{
	outline: none;
}

button,a{
	cursor: pointer !important;
}

button.nav-link{
	padding: 0;
}

.btn-close,
input[type=checkbox]{
	--bs-btn-close-focus-shadow:unset;
}

@media (min-width:1200px){
    .container, .container-lg, .container-md, .container-sm, .container-xl{
        max-width: 1280px !important;
        padding: 0 !important;
    }
}

.w1280{
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
}

.pagingUl{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.pagingUl .arrowimg{
    height: 12px;
}

.pagingUl li button{
    width: 32px;
    height: 32px;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #555555;
    border: 1px solid #E3E5E8;
}

.pagingUl li button:hover{
    color: #db9d0d;
}

/* -------------------------------------------------------- */


/* 헤더 */
.header-wrap {
    background-color: #0C0D0E;
    border-bottom: 1px solid #232529;
}

.header-title-search{
    width: 346px;
    height: 38px;
    border-radius: 50px;
    border: none;
    background-color: #232529;
}

.header-title-search .eyoom-form input{
    background: transparent !important;
    border: none !important;
    color: #EEEEEE;
}

.header-title-search .eyoom-form input::placeholder{
    color: #7F8186 !important;
}

.header-title-search .eyoom-form .input-button .button{
    background:transparent !important;
    border: none !important;
    padding-top: 6px;
    padding-right: 15px;
}

.top-header{
    position: relative;
    height: 64px;
    display: flex;
    align-items: center;
}

.top-header-nav li > a{
    color: #D5D7DC !important;
}

.top-header-nav li > a:hover{
    color: #eff4ff !important;
}

.top-header .dropdown-toggle::after{
    display: none !important;
}


.header-title-search{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.headmenu{
    width: 21px;
    padding-top:4px;
}

.board-list,
.board-view,
.board-write{
    max-width: 1280px;
    margin: 0 auto;
    margin-top: 40px;
}


/* 로고 */
@media (min-width:991px){
    .site-logo{
        width: 182px;
    }
}
/* -- */

.top-header-inner{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.thn-end{
    display: flex;
    align-items: center;
    gap: 15px;
}

.top-header-nav li > a{
    font-size: 14px;
}

.registerbtn{
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    height: 36px;
    background-color: #42464E;
    border-radius: 5px;
    transition: all .2s;
}

.registerbtn:hover{
    background-color: rgb(92, 96, 105)
}

.allmenu{
    margin-left: 15px;
}

.top-header-nav li.dropdown .dropdown-menu{
    border: none !important;
    background-color: #1C1E22;
    border-radius: 6px;
}

.log-after-span{
    color: #D5D7DC !important;
    font-size: 14px;
}

.log-after-span:hover{
    color: #eff4ff !important;
}

.header-wrap .navbar-nav{
    gap: 25px;
}

.header-wrap .navbar-nav > li > a{
    position: relative;
    color: #fff;
    font-size: 15px;
}

.header-wrap .navbar-nav > li > a.active:after{
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #F3C04A;
    margin-left: 0 !important;
}

/* 메뉴 */
.allmenuli{
    display: none !important;
}
/* -- */


/* 메인 */
.basic-body{
    padding-top: 0 !important;
    padding-bottom: 120px;
}

.page-body{
    max-width: 1280px;
    margin: 0 auto;
}

.basic-body.page-body{
    padding-top: 40px !important;
}

.comTopCont{
    width: 100%;
    height: auto;
    background-image: url("/theme/eb4_basic/image/comTopCont.png");
    background-size: cover;
    background-repeat: no-repeat;
    padding: 40px 0;
}

.cominner{
    max-width: 1280px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 20px;
}

.cominBox{
    position: relative;
    width: calc(100%/5 - 10px);
    height: 248px;
    border-radius: 12px;
}

.cominBox:after{
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 150px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.9) 80%);
    border-radius: 0px 0px 11px 11px;
}

.cominBox p{
    font-size: 18px;
    line-height: 24px;
    color: #fff;
    position: absolute;
    font-weight: 500;
    left: 15px;
    bottom: 20px;
    z-index: 2;
}

.cominBox:hover p{
    text-decoration: underline;
}

.main-boCont{
    padding-top: 50px;
}

.main-board-div{
    display: flex;
    align-items: center;
    gap: 30px;
}

.bestboard{
    margin-top: 30px;
}

.whitebox{
    /* Rectangle 2192 */
    box-sizing: border-box;
    background: #FFFFFF;
    border: 1px solid #E3E5E8;
    box-shadow: 0px 0px 11.9px rgba(20, 72, 94, 0.1);
    border-radius: 10px;
    padding: 30px;
}

.main-board-div .whitebox{
    width: calc(100%/2 - 15px);
    height: 504px;
}

.whitebox .tidiv{
    border-bottom: 1px solid #E3E5E8;
}

.whitebox .tip{
    font-size: 18px;
    font-weight: 600;
    color: #17191C;
    padding-bottom: 16px;
}

.whitebox .cont-a{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.whitebox .txbox{
    width: calc(100% - 140px);
}

.whitebox .txbox .title-div{
    display: flex;
    align-items: center;
    gap: 4px;
}

.whitebox .sumbox{
    width: 90px;
    height: 58px;
}

.whitebox .sumbox img{
    width: 100%;
    height: 100%;
    border-radius: 6px;
    object-fit: cover;
}

.whitebox .pagingUl{
    margin-top: 20px;
}

.num{
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #4A4E57;
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    border-radius: 4px;
}

.num.topnum{
    background-color: #F3C04A !important;
    color: #000 !important;
}

.num.newspan{
    background-color: #FF632B !important;
}

.num.newspan img{
    width: 10px;
}

.con_sp{
    max-width: calc(100% - 28px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 16px;
    font-weight: 500;
}

.con_info{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 7px;
}

.con_info > div{
    position: relative;
}

.con_info > div:after{
    content: "·";
    display: block;
    position: absolute;
    top: 50%;
    right: -6px;
    color: #757B8A;
    transform: translateY(-50%);
}

.con_info > div:last-child:after{
    display: none;
}

.con_info span{
    font-size: 14px;
    color: #757B8A;
    font-weight: 500;
}

.con_info span.kind{
    color: #db9d0d;
}

.con_info span.name{
    color: #525661;
    font-weight: 500;
}

.eyeicon{
    height: 10px;
    margin-right: -2px;
}
.goodicon{
    height: 12px;
    margin-right: -2px;
}

.wi-boUl > li{
    padding: 15px 0;
    border-bottom: 1px solid #F0F0F0;
}

.wi-boUl > li:last-child{
    border-bottom: none;
}

.cat-ti{
    font-size: 18px;
    font-weight: 600;
    color: #17191C;
    margin-bottom: 18px;
}

.card-board-div{
    margin-top: 50px;
}

.cardBox-div{
    display:flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
}

.cardBox{
    display: block;
    width: calc(100%/5 - 16px);
}

.cardBox .sumbox{
    width: 100%;
    height: 136px;
}

.cardBox .sumbox img{
    width: 100%;
    height: 100%;
    border-radius: 8px;
    object-fit: cover;
}

.card-tidiv{
    display: flex;
    align-items: center;
    margin-top: 10px;
}

.card-tidiv span{
    font-size: 16px;
    font-weight: 500;
}

.card-tidiv .tisp{
    max-width: 85%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.card-tidiv .reple{
    color: #CA8E04;
}

.bo-info{
    margin-top: 10px;
}

.bo-info .username{
    font-size: 14px;
    color: #616161;
    font-weight: 500;
}

.bo-info .con_info{
    margin-top: 3px !important;
}

.bo-info .con_info span{
    font-size: 13px !important;
    font-weight: 400 !important;
}

.moreCont{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 40px;
}

.moreCont button{
    width: 140px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    font-size: 16px;
    font-weight: 500;
    color: #555555;
    border: 1px solid #E3E5E8;
    border-radius: 50px;
}

.moreCont button:hover{
    color: #3949ab;
}

.moreCont button span{
    color: #FF632B;
}

.moreCont button img{
    height: 11px;
    margin-top: -1px;
    margin-left: 2px;
}

.moreCont .line{
    width: calc((100% - 140px)/2);
    height: 1px;
    background-color: #E3E5E8;
}


/* 상세 */
.writeAndsearch{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
}

.writebtn{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    width: 80px;
    height: 32px;
    background-color: #0182FF;
    border-radius: 4px;
    color: #fff !important;
    font-size: 12px;
}

.writebtn:hover{
    background-color: #0775e2;
}

.writebtn img{
    height: 14px;
    margin-top: -1px;
}

.search-cont{
    width: 22px;
    height: 22px;
}

.eb-pagination img{
    height: 12px;
}

.boardCateDiv {
    margin-bottom: 40px;
}

.boardCateDiv h2{
    font-size: 20px;
    font-weight: 600;
    color: #17191C;
}

.board-catelinkDiv > div{
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 28px;
}

.board-catelinkDiv > div a{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 0 15px;
    background-color: #fff;
    border: 1px solid #E3E5E8;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 500;
}

.board-catelinkDiv > div a.active{
    border: none;
    background-color: #000;
    color: #fff;
}

.board-topBest{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.board-topBest .boardBestdiv{
    width: calc(100%/3 - 10px);
    height: 208px;
    background-color: #1F1F1F;
    border-radius: 10px;
    padding: 15px;
}

.board-topBest .boardBestdiv .tiDiv{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.board-topBest .boardBestdiv .tiDiv p{
    font-size: 16px;
    font-weight: 500;
    color: #fff;
}

.board-topBest .boardBestdiv .tiDiv .arrowbox{
    display: flex;
    align-items: center;
    gap: 6px;
}

.board-topBest .boardBestdiv .tiDiv .arrowbox a{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background-color: #2F3137;
    border-radius: 2px;
}

.board-topBest .boardBestdiv .tiDiv .arrowbox a:hover{
    background-color: #454850;
}

.board-topBest .boardBestdiv .tiDiv .arrowbox a img{
    height: 10px;
}

.board-topBest .boardBestdiv .boardBest-li{
    padding: 5px 0;
}

.board-topBest .boardBestdiv .boardBest-li:last-child{
    padding-bottom: 0;
}

.board-topBest .boardBestdiv .boardBest-li a{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.board-topBest .boardBestdiv .boardBest-li a .left{
    width: calc(100% - 48px);
    display: flex;
    align-items: center;
    gap: 5px;
}

.board-topBest .boardBestdiv .boardBest-li a .left .txtbox{
    max-width: calc(100% - 60px);
    display: flex;
    align-items: center;
}

.board-topBest .boardBestdiv .boardBest-li a .left .con_sp{
    color: #EEEEEE;
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.board-topBest .boardBestdiv .boardBest-li a .left .con_sp:hover{
    color: #fff;
}

.board-topBest .boardBestdiv .boardBest-li a .left .reple{
    color: #F3C04A;
    font-size: 14px;
}

.board-topBest .boardBestdiv .boardBest-li a .username{
    font-size: 12px;
    color: #ACB0B9;
}


/* 게시판 테이블 */
.bl-list span,
.bl-list div{
    color: #17191C !important;
}

.bl-list .text-gray{
    color: #6E6E6E !important;
}

.board-list .bl-wrap{
    border-bottom: none !important;
    border-top: none !important;
}

.board-list .bl-head{
    height: 40px !important;
    background-color: #4A4E57 !important;
    border: none;
    border-bottom: none !important;
}

.board-list .bl-head > div,
.board-list .bl-head > div a{
    color: #fff;
    font-weight: 400 !important;
    font-size: 14px;
}

.board-list .bl-head > div:before{
    display: none !important;
}

.board-list .bl-list{
    border-bottom: 1px solid #E3E5E8 !important;
}

.board-list .bl-list .bl-subj .bl-new-icon{   
    display: flex !important;
    align-items: center !important;
    justify-content:  center !important;
    width: 18px !important;
    height: 18px !important;
    margin-top: -2px !important;
    border-radius: 3px !important;
    background-color: #FF632B !important;
}

.board-list .bl-list .bl-subj .bl-new-icon img{
    height: 10px;
}

.board-list .bl-list > div:before{
    display: none !important;
}

.board-list .bl-list .bl-subj a{
    display: flex !important;
    align-items: center;
    gap: 4px;
}

.bl-name-in{
    display: flex !important;
    align-items: center;
}

.bl-name-in span{
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
}

.board-list .bl-list .bl-subj .bl-new-icon:after,
.board-list .bl-list .bl-subj .bl-new-icon:before{
    display: none !important;
}

/* 글쓰기 */
.board-view-cont{
    padding-top: 40px;
}

.board-view,
.board-write{
    max-width: 1000px;
    margin: 0 auto;
    background: #FFFFFF;
    border: 1px solid #E3E5E8;
    box-shadow: 0px 0px 11.9px rgba(20, 72, 94, 0.1);
    border-radius: 10px;
    padding: 40px;
}

.board-view .board-view-info{
    display: flex;
    align-items: center;
    border-top: none !important;
    border-bottom: 1px solid #E3E5E8 !important;
    padding-bottom: 25px !important;
    margin-bottom: 25px !important;
    min-height: auto !important;
    background: transparent !important;
    margin-top: 12px !important;
}


.board-view .board-view-info .info-box-bottom{
    display: flex !important;
    align-items: center;
    gap:4px;
}

.board-view .board-view-info .info-box-bottom span{
    color: #757B8A !important;
    font-weight: 500 !important;
    font-size: 14px;
    margin-right: 0 !important;
}

.board-view .board-view-info .view-info-box{
    margin-left: 0 !important;
}

.board-view .board-view-info .view-photo-box{
    position: unset !important;
}


.board-view .board-view-info .view-info-box .bl-photo{
    display: none;
}

.board-view .board-view-info .info-box-top .view-nick{
    font-size: 16px;
    font-weight: 500;
}

.board-view .mini-cate{
    font-size: 16px;
    font-weight: 500;
    color: #FF632B;
}

.board-view .board-view-subj{
    margin-top: 7px !important;
}

.board-view .board-view-subj .h3sp{
    font-size: 26px !important;
    font-weight: 600 !important;
}

.view-comment-write{
    margin-bottom: 0 !important;
}

.view-comment .view-comment-no-item{
    border-top: none !important;
    border-bottom: none !important;
}

.view-comment .view-comment-heading,
.comment-area .comment-write-heading{
    border-bottom: 1px solid #E3E5E8 !important;
}

.comment-write-submit{
    margin-top: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.comment-write-submit button,
.comment-write-submit input{
    border: 1px solid #0182FF !important;
    color: #0182FF !important;
    background-color: #fff !important;
}

.comment-write-submit .cancel-a{
    display: inline-block;
    border: 1px solid #E3E5E8 !important;
    color: #000 !important;
    background-color: #fff !important;
}

.comment-write-submit button:hover,
.comment-write-submit input:hover{
    color: #0182FF !important;
}

#captcha{
    width: 100% !important;
}

.view-comment .view-comment-heading,
.comment-area .comment-write-heading{
    font-size: 18px !important;
}

.board-view-file{}
.board-view .board-view-file li{
    border-bottom: none !important;
    border: 1px solid #E3E5E8 !important;
    border-radius: 6px;
    margin-top: 10px;
    padding: 15px 12px !important;
}

.board-view-file{}
.board-view .board-view-file li:nth-child(1){
    margin-top: 0;
}

/* 글쓰기 */
.board-write .board-write-title{
    border-bottom: none !important;
}


/* -- */
.board_kind_choice_Wrap{
    position: relative;
    margin-bottom: 30px;
}

.board_kind_choice_Wrap .board_kind_choice_choiceDiv{
    display: flex;
    align-items: center;
}

.board_kind_choice_Wrap .board_kind_choice_choiceDiv button{
    max-width: 500px;
    font-size: 16px;
    color: #525661 !important;
    font-weight: 500;
    padding-right: 20px;
}

.board_kind_choice_Wrap .board_kind_choice_choiceDiv img{
    width: 12px;
    transition: transform 0.3s ease;
}

.board_kind_choice_listDiv {
    padding-top: 12px;
    min-width: 150px;
    position: absolute;
    top: 30px;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #757B8A33;
    box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.15);
    display: none;
    transition: all 0.2s;
    z-index: 5;
}

.board_kind_choice_listDiv li button,
.board_kind_choice_listDiv li span{
    width: 100%;
    padding: 10px 34px 10px 16px;
    text-align: left;
    font-size: 13px;
    color: #333;
    line-height: 1.2;
}

.board_kind_choice_listDiv li:hover{
    background-color: #e6edfb;
}

.board_kind_choice_listDiv li span{
    display: block;
    margin-bottom: 5px;
}

@-webkit-keyframes fade_AC {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

.board_kind_choice_Wrap.active .board_kind_choice_listDiv {
    display: block;
    -webkit-animation:fade_AC 0.4s ease forwards;
}

.board_kind_choice_Wrap.active .board_kind_choice_choiceDiv img {
    transform: rotate(180deg);
}

/* ---- */
.write-myinfowrap{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.write-myinfowrap > div{
    width: calc(100%/2 - 5px);
}

.write-myinfowrap .input{
    margin-bottom: 0 !important;
}

.write-myinfowrap .input input{
    border: 1px solid #d0d3db !important;
    border-radius: 6px !important;
}

.required-mark:after{
    border-top: 8px solid #F3C04A !important;
}

.write-title-label input{
    border: none !important;
    border-bottom: 1px solid #D9D9D9 !important;
    font-size: 24px !important;
    font-weight: 500 !important;
    padding-bottom: 20px !important;
    color: #17191C !important;
}

.write-title-label input:focus{
    border: none !important;
    border-bottom: 1px solid #D9D9D9 !important;
}

.write-title-label input::placeholder{
    color: #ACB0B9 !important;
}


/* 게시판 카드 폼 */
.card-form-wrap{
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
}

.card-form-div{
    width: calc(100%/2 - 20px);
}

.card-form-div a{
    display: flex;
    align-items: center;
    gap: 14px;
}

.card-form-div .sumbox{
    width: 124px;
    height: 80px;
}

.card-form-div .sumbox img{
    width: 100%;
    height: 100%;
    border-radius: 6px;
    object-fit: cover;
}

.card-form-div .con_info{
    margin-top: 10px;
}

.card-form-div .txbox{
    width: calc(100% - 140px);
}

.card-form-div .txbox .title-div{
    display: flex;
    align-items: center;
    gap: 4px;
}