@charset "utf-8";


/* 게시판 버튼 스타일 */
.bd-btn-wrap {display: flex;justify-content: space-between;}


/* 게시판 페이지 번호 */
.page-btn-list {display: flex;justify-content: center;gap: 4px;}
.page-btn-list li a {display: flex;justify-content: center;align-items: center;width: 32px;height: 32px;text-align: center;font-weight: 400;font-size: 13px;color: #767676;border: 1px solid #e5e5ec;transition: all .3s;}
.page-btn-list li:hover a {background: #f7f7f8;}
.page-btn-list li a.on {font-weight: 600;color: var(--brand2);}
.page-btn-list li .page-btn-arrow.off {display: none;}


/* 게시판 테이블 */
.bd-table-wrap tr {border-bottom: 1px solid #e5e5ec;transition: all .3s;} 
.bd-table-wrap tr.fixed {background: #fef8f9;font-weight: 600;color: var(--brand);} 
.bd-table-wrap tr:first-child {background: var(--brand);color: var(--white);}
.bd-table-wrap tr:first-child th {font-family: var(--gm);font-weight: 400;}
.bd-table-wrap tr:not(:first-child):hover {background: #F4F6F7;} 
.bd-table-wrap th, .bd-table-wrap td {vertical-align: middle; line-height: 1.3;word-break: break-all;text-align: center;padding: 15px;} 
.bd-table-wrap .w-100 {width: 100px;}
.bd-table-wrap .w-150 {width: 150px;}
.bd-title {display: flex;column-gap: 4px;}
.bd-title a {font-weight: 600;color: var(--black);display: block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;text-align: left;transition: all .3s;width: fit-content;}
.bd-table-wrap tr.fixed .bd-title a {color: var(--brand);} 
.bd-table-wrap tr.fixed i {font-size: 14px;} 
.bd-title a:hover {color: var(--brand2);}
@media screen and (max-width: 768px) {
    .bd-table-wrap tr:first-child th {font-size: 15px;}
    .bd-table-wrap .m-none {display: none;}
    .bd-table-wrap colgroup col:nth-child(2) {width: calc(100% - 120px);}
    .bd-table-wrap .w-150 {width: 120px;}
}
@media screen and (max-width: 480px) {
    .bd-table-wrap td {padding: 14px;}
    .bd-table-wrap colgroup col:nth-child(2) {width: 65%;}
    .bd-table-wrap colgroup col:last-child {width: 35%;}
    /* .bd-table-wrap .w-150, .bd-table-wrap .w-100, .bd-table-wrap colgroup col {width: 100%;} */
}

/* 공통 */
.control-label {color: #111;font-weight: 600;text-align: left;}
input.form-control {background: #F9F6F6;border-radius: 5px;width: 100%;height: 40px;padding: 0 16px;font-size: 15px;}
input[type=file].form-control {background: #fff;width: 100%;height: 40px;padding: 0;font-size: 15px;line-height: 40px;}
textarea.form-control {background: #F9F6F6;border: none;border-radius: 5px;width: 100%;height: 100px;padding: 16px;font-size: 15px;}
.panel-heading {font-family: var(--gm);font-size: 20px;font-weight: 500;color: #111;padding-bottom: 20px;border-bottom: 2px solid var(--brand);}
.form-group {display: flex;align-items: center;padding: 15px 0;}
.tooltip {position: static !important;display: inline-block !important;}
.tooltip-inner {color: #891147;font-size: 14px;}
.mb-title {color: #111;font-weight: 600;}
.board .alert-info {padding: 15px;border-radius: 6px;margin-bottom: 8px;background: #f2eced;color: #6f2536;font-weight: 500;font-size: 15px;display: flex;}
.board .alert-info > button {margin-right: 8px;color: #6f2536;}
.board .alert-warning {padding: 15px;border-radius: 6px;margin-bottom: 8px;background: #f2eced;color: #6f2536;font-weight: 500;font-size: 15px;display: flex;}
.board .alert-warning > button {margin-right: 8px;color: #6f2536;}
@media screen and (max-width: 768px) {
    .panel-heading {font-size: 19px;}
}
@media screen and (max-width: 480px) {
    .panel-heading {font-size: 18px;}
}


/* 텍스트형 게시판 - 리스트 */
.bd-header {display: flex;justify-content: flex-end;}
.bd-search-wrap {display: flex;gap: 8px;}
.bd-searchBox {width: 200px;height: 48px;border-bottom: 1px solid #e5e5ec;display: flex;}
.bd-searchBox:has(input:focus) {border-color: #111;}
select.form-control {width: 120px;height: 48px;border: 0;border-bottom: 1px solid #e5e5ec;font-size: 15px;background: #fff;}
.bd-sch-input {width: 100%;height: 48px;padding: 0 16px;font-size: 15px;}
.bd-sch-btn {height: 48px;cursor: pointer;font-size: 20px;color: #111;transition: all .3s;}
.bd-sch-btn:hover {color: var(--brand2);}
.bd-list-icon {display: flex;column-gap: 4px;align-items: center;font-size: 15px;line-height: 1;}
.bd-list-icon i {color:#8f8789;}
.bd-list-comment {white-space: nowrap;}
.bd-list-comment > i {margin-right: 2px;}
@media screen and (max-width: 480px) {
    .bd-header {justify-content: center;}
    .bd-search-wrap {width: 100%;}
    select.form-control {width: 40%;}
    .bd-searchBox {width: 60%;}
}


/* 갤러리형 게시판 - 리스트 */
.gallery-list {}
.gallery-list .gallery-content {width: calc((100% - 72px) / 4);}
.gallery-list .gallery-content > a {display: block;width: 100%;height: 100%;overflow: hidden;border-radius: 20px;border: 1px solid #e5e5ec;transition: all .3s;}
.gallery-list .gallery-content > a:hover {box-shadow: 0 4px 12px 0 rgba(0, 0, 0, .1);}
.gallery-list .gallery-thumb > img {width: 100%;height: 100%;object-fit: cover;}
.gallery-list .gallery-text {padding: 24px 16px;border-top: 1px solid #e5e5ec;}
.gallery-list .gallery-text h6 {height: 48px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;font-size: 16px;font-weight: 700;color: var(--black);}
.gallery-info-list {margin-top: 8px;display: flex;align-items: center;gap: 4px;}
.gallery-info-list > li {font-size: 14px;display: flex;gap: 4px;}
.gallery-info-list > li + li:not(.gallery-label-list)::before {content: '·';}
li.gallery-label-list {display: flex;align-items: center;gap: 4px;}
li.gallery-label-list .label-warning {margin-bottom: 0;padding: 0 4px;}

/* 게시판 - 쓰기 */
.bd-write .panel-heading {border-bottom: 1px solid #111;}
.bd-write .form-group {border-bottom: 1px solid #e5e5ec;min-height: 71px;}
.bd-write .form-group .col-sm-2 {width: 20%;}
.bd-write .form-group .col-sm-10 {width: 100%;}
.bd-write .form-group.editor-wrap {flex-direction: column;align-items: flex-start;}
.bd-write .form-group .col-sm-12 {width: 100%;}
.bd-write .option-list {display: flex;column-gap: 8px;align-items: center;}
@media screen and (max-width: 480px) {
.bd-write .form-group .col-sm-2 {width: 30%;}
.bd-write .form-group .col-sm-10 {width: 70%;}
}


/* 게시판 - 읽기 */
.bd-view .panel-heading {border-bottom: 1px solid #111;}
.bd-view .info {display: flex;column-gap: 8px;align-items: center;padding-top: 20px;}
.bd-view .info i {color: #8f8789;}
.bd-view .contents-view {margin: 32px auto;}
.bd-view .border_button {display: flex;justify-content: space-between;}
.bd-view .border_button .btn-group {display: flex;column-gap: 8px;}


/* 댓글 리스트 */
#viewcomment .media-wrap:has(.media) {padding: 32px;background: #faf9f9;border-radius: 20px;}
#viewcomment .media {border-bottom: 1px dashed #e2e0e1;margin-bottom: 16px;}
#viewcomment .media:last-of-type {margin-bottom: 0;}
#viewcomment .media-body {}
#viewcomment .media-heading {display: flex;column-gap: 12px;align-items: center;font-weight: 400;margin-bottom: 8px;}
#viewcomment .media-heading i {color: #8f8789;}
#viewcomment .media-heading .option-list {display: flex;column-gap: 12px;align-items: center;}
#viewcomment .media-heading .reply {display: flex;column-gap: 12px;align-items: center;}
#viewcomment .media-heading .name {color: #111;font-weight: 600;}
#viewcomment .media-heading a {color: #111;font-weight: 600;transition: all .3s;}
#viewcomment .media-heading a:hover {color: var(--brand2);}
/* #viewcomment .media-heading > input[type=checkbox] {display: none;} */
#viewcomment textarea.form-control {background: #fff;}
#viewcomment .comment-content {margin-bottom: 16px;}
.label-warning {display: block;padding: 2px 4px;background: #AF1A5D;color: #fff;font-size: 12px;width: fit-content;margin-bottom: 8px;}
.alert-comment-list-message {padding: 15px;border-radius: 6px;margin-bottom: 8px;background: #f2eced;color: #6f2536;font-weight: 500;font-size: 15px;display: flex;}
.alert-comment-list-message > button {margin-right: 8px;color: #6f2536;}
@media screen and (max-width: 480px) {
    #viewcomment .media-wrap:has(.media) {padding: 24px 16px;}
    #viewcomment .media {margin-bottom: 24px;}
    #viewcomment .media:last-of-type {margin-bottom: 0;}
    #viewcomment .media-heading {white-space: nowrap;flex-wrap: wrap;row-gap: 16px;margin-bottom: 16px;}
    #viewcomment .comment-content {margin-bottom: 24px;}
}

/* 댓글 쓰기 */
.alert-comment-message {padding: 15px;border-radius: 6px;margin-bottom: 8px;background: #f2eced;color: #6f2536;font-weight: 500;font-size: 15px;display: flex;}
.alert-comment-message > button {margin-right: 8px;color: #6f2536;}
.comment-line {margin: 32px auto;width: 100%;height: 1px;background: #e5e5ec;}
.comment_write_button_area {display: flex;align-items: center;column-gap: 8px;}
.comment_write_button_area > .form-group {margin: 0;}
#comment_write_box .comment_write_button_area {margin-top: 15px;}
#comment_write_box .comment_write_button_area .form-group {padding: 0;margin: 0;}
.comment_write_title {font-family: var(--gm);font-size: 20px;font-weight: 500;color: #111;margin-bottom: 16px;}
@media screen and (max-width: 768px) {
    .comment_write_title {font-size: 19px;}
}
@media screen and (max-width: 480px) {
    .comment_write_title {font-size: 18px;}
}
/* ================================================================================ */



/* 로그인 */
.login {max-width: 480px;width: 100%;margin: 0 auto;}
.login .group-wrap {border-bottom: 1px solid #e5e5ec;display: flex;flex-direction: column;gap: 20px;padding: 24px 0;}
.login .form-group {flex-direction: column;align-items: flex-start;gap: 10px;padding: 0;}
.login .btn-wrap {margin: 40px auto 50px;}
.login .btn-wrap > button {width: 60%;align-self: center;}
.login .input-wrap {width: 100%;}
.login .panel-footer .pull-right {display: flex;column-gap: 16px;justify-content: flex-end;}
.login .alert {background: #610F210D;border-radius: 6px;padding: 16px;font-size: 14px;}
@media screen and (max-width: 480px) {
    .login .btn-wrap {margin: 30px auto 40px;}
}


/* 회원가입 */
.search .panel-body {padding: 15px 0;}
.search .form-group .w-100 {width: 100%;}
.register .panel-heading span {font-size: 14px;font-family: var(--pr);}
.register .panel-heading span b {color: var(--brand2);}
.register .form-group {border-bottom: 1px solid #e5e5ec;}
.register .help-block {font-size: 14px;}
.register .alert-info {padding: 15px;border-radius: 6px;margin-bottom: 8px;background: #f2eced;color: #6f2536;font-weight: 500;font-size: 15px;display: flex;}
.register .alert-info > button {margin-right: 8px;color: #6f2536;}
.register .alert-warning {padding: 15px;border-radius: 6px;margin-bottom: 8px;background: #f2eced;color: #6f2536;font-weight: 500;font-size: 15px;display: flex;}
.register .alert-warning > button {margin-right: 8px;color: #6f2536;}
.register .form-group .tooltip {display: block !important;}
.register .control-label {color: var(--black);background: transparent;font-family: 'Pretendard';font-weight: 600;border-radius: 0;text-align: left;padding: 0 15px;line-height: 1.5;}
.register .control-label:not(.not-essential)::before {content: '*';color: var(--brand2);margin-right: 4px;}
.register .control-label .help-block {font-size: 14px;color: var(--gray);font-weight: 400;margin-top: 4px;}
.register .post-number {display: flex;gap: 10px;}
.register .post-number .post-number-inner {flex: 0 1 30%;}
.register .address {display: flex;gap: 10px;}
.register .address .address-inner {flex: 0 1 calc((100% - 10px) / 2);}
.register .left {width: 240px;}
.register .right {width: calc(100% - 240px);}
.register .form-group-inner {width: 100%;display: flex;align-items: center;}
.register .form-group-inner:has(.input-name) {gap: 16px;}
.register .input-name {font-weight: 600;color: #666;white-space: nowrap;width: 120px;padding: 0 15px;}
.register .input-name + .input-wrap {width: calc(100% - 120px);}
@media screen and (max-width: 768px) {
    .register .post-number .post-number-inner {flex: 0 1 calc(100% - 84px);}
    .register .address {flex-wrap: wrap;}
    .register .address .address-inner {flex: 0 1 100%;}
    .register .left {width: 200px;}
    .register .right {width: calc(100% - 200px);}
    .register .m-width-100 {flex-direction: column;gap: 15px;}
    .register .m-width-100 .form-group-inner + .form-group-inner {padding-top: 15px;border-top: 1px solid #e5e5ec;}
    .register .lang .right {flex-direction: column;gap: 15px;}
}
@media screen and (max-width: 480px) {
    .register .form-group {flex-direction: column;row-gap: 8px;}
    .register .left, .register .right {width: 100%;}
    .register .control-label {padding: 0;}
    .register .radio-box span {height: auto;}
    .register .form-group-inner {flex-direction: column;row-gap: 8px;}
    .register .lang .right {row-gap: 8px;}
    .register .lang .form-group-inner {flex-direction: row;}
    .register .input-name {padding: 0;width: 100px;}
    .register .input-name + .input-wrap {width: calc(100% - 100px);} 
}


/* 회원정보찾기(계정 찾기) */
.search .input-group {display: flex;flex-direction: column;gap: 20px;}
.search .input-group > input {width: 100%;}
.findaccount {width: 50%;margin: 0 auto;}
.findaccount .tooltip {display: block !important;}
@media screen and (max-width: 768px) {
    .findaccount {width: 100%;}
}


/* 마이페이지 - 회원정보수정 */
.mypage > .nav {display: none;}
.mypage {width: 100%;margin: 0 auto;}
.mypage .form-group {border-bottom: 1px solid #e5e5ec;}
.mypage .form-group > .w-30 {width: 200px;}
.mypage .form-group > .w-70 {width: calc(100% - 200px);}
.mypage .control-label {width: 200px;color: #111;font-weight: 600;text-align: left;}
.mypage .help-block {font-size: 14px;display: block;}
.mypage .input-wrap {display: flex;column-gap: 8px;align-items: center;}
.mypage .input-wrap input {width: 150px;}
.mypage .alert {background: #610F210D;border-radius: 6px;padding: 16px;font-size: 14px;margin-top: 15px;}
.mypage .panel-body {padding: 15px 0;}
.mypage .form-group > .w-30 {width: 200px;}
.mypage .form-group > .w-70 {width: calc(100% - 200px);}
@media screen and (max-width: 480px) {
    .mypage .form-group > .w-30 {width: 30%;}
    .mypage .form-group > .w-70 {width: 70%;}
    .mypage .input-wrap {flex-direction: column;gap: 8px;}
    .mypage .input-wrap input {width: 100%;}
    .mypage .input-wrap button {width: 100%;}
}