@charset "utf-8";
.only-mobile {
    display: none
}

.only-s-mobile {
    display: none
}

.only-over-tablet {
    display: block;
}

.only-to-tablet {
    display: none;
}

.only-pc {
    display: block
}

body {
    background: #fff
}

#wrap, body, footer, header, main {
    width: 100%;
    position: relative
}

.wrap-comm, .wrap-event, .wrap1280 {
    width: 100%;
    max-width: 1280px;
    padding: 0 20px;
    margin: 0 auto;
    position: relative
}

.wrap720 {
    width: 100%;
    max-width: 760px;
    padding: 0 20px;
    margin: 0 auto
}

.wrap1400 {
    width: 100%;
    max-width: 1400px;
    padding: 0 20px;
    margin: 0 auto
}

#body_cs.body_event #wrap {
    overflow: hidden
}

.container-lnb {
    width: 100%;
    position: relative
}

#wrap_side {
    position: fixed;
    z-index: 200;
    bottom: 24px;
    right: 24px
}

main {
    padding-top: 81px
}

h2 {
    color: #171717;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: .2px
}

#wrap_side .box_side {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px
}

#wrap_side .box_side button {
    width: 42px;
    height: 42px;
    border-radius: 42px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12);
    border: 1px solid #e9ebed
}

#wrap_side .box_side button:hover {
    background-color: #f7f7f7
}

#wrap_side button.btn_write {
    background: url(/assets/images/icon_write.svg) no-repeat center center;
    background-color: #5b5b5b;
    border: 1px solid #5b5b5b;
    display: none
}

#wrap_side button.btn_write:hover {
    background-color: #5b5b5b
}

#wrap_side button.btn_top {
    background: url(/assets/images/icon_top.svg) no-repeat center center;
    background-color: #fff
}

#wrap_side button.btn_help {
    background: url(/assets/images/icon_help.svg) no-repeat center center;
    background-color: #fff
}

#body_home.logout #wrap_side button.btn_help {
    display: none
}

#wrap_side button.btn_top.on {
    background: url(/assets/images/icon_top_on.svg) no-repeat center center;
    background-color: #f57e1f
}

#wrap_side button.btn_help.on {
    background: url(/assets/images/icon_help_on.svg) no-repeat center center;
    background-color: #f57e1f
}

#popup_consult {
    position: absolute;
    width: 328px;
    bottom: calc(100% + 10px);
    right: 0;
    padding: 24px 24px 32px;
    border-radius: 16px;
    border: 1px solid #e9ebed;
    background: #fff;
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, .12);
    display: none
}

#popup_consult h3 {
    font-size: 20px;
    font-weight: 600;
    line-height: 140%;
    padding-bottom: 16px
}

#popup_consult .exp {
    color: #595959
}

#popup_consult .boximg {
    padding: 24px 0;
    display: flex;
    gap: 8px
}

#popup_consult .boximg > div {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
    justify-content: center
}

#popup_consult ul {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 8px
}

#popup_consult ul li a {
    width: fit-content;
    max-width: 100%;
    overflow: hidden;
    height: 32px;
    line-height: 32px;
    padding: 0 12px;
    border-radius: 8px;
    background: #e9ebee;
    color: #171717
}

#popup_chat {
    display: none;
    position: absolute;
    bottom: calc(100% + 10px);
    right: 0;
    width: 480px;
    height: 712px;
    overflow: hidden;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    border-bottom-left-radius: 0;
    border-bottom-left-radius: 0;
    border: 0;
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, .12);
    background: #f7f7f7
}

#btnchatmin {
    display: none
}

#popup_chat .wrap_chat {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch
}

#popup_chat .chat_header {
    background: #1f2020;
    flex: 0 0 fit-content
}

#popup_chat .chat_header .ht {
    height: 32px;
    display: flex;
    justify-content: space-between;
    align-items: center
}

#popup_chat .chat_header h3 {
    color: #fff;
    font-size: 14px;
    padding-left: 28px;
    position: relative
}

#popup_chat .chat_header h3::after {
    content: '';
    background: url(/assets/images/icon_chat.svg) no-repeat left center;
    width: 20px;
    height: 20px;
    position: absolute;
    left: 4px;
    top: 0
}

#popup_chat .chat_header .ht ul {
    flex: 0 0 fit-content;
    display: flex
}

#popup_chat .chat_header .url {
    height: 36px;
    color: #ccc;
    font-size: 14px;
    line-height: 36px;
    white-space: nowrap;
    overflow: hidden;
    padding: 0 12px;
    background: #282828
}

#popup_chat .chat_body {
    flex: 1;
    position: relative;
    border-left: 1px solid #bababa;
    border-right: 1px solid #bababa
}

#popup_chat .chat_body .chat_scroll {
    padding: 0 24px;
    margin-right: 2px;
    overflow-y: auto;
    overflow-x: hidden;
    position: absolute;
    left: 0;
    top: 40px;
    width: 100%;
    height: calc(100% - 40px);
    overflow-anchor: auto !important
}

#popup_chat .chat_body ul.chat_content {
    padding: 28px 0;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: stretch;
    gap: 20px
}

#popup_chat .chat_body .date {
    display: flex;
    align-items: center;
    justify-content: center
}

#popup_chat .chat_body .date span {
    display: flex;
    padding: 0 16px;
    justify-content: center;
    align-items: center;
    width: fit-content;
    height: 28px;
    border-radius: 50px;
    background: #bfbfbf;
    color: #fff;
    font-size: 12px;
    font-weight: 500
}

#popup_chat .chat_body .mds {
    padding-right: 52px;
    display: flex;
    justify-content: left;
    align-items: stretch;
    max-width: 100%;
    width: fit-content
}

#popup_chat .chat_body .mds > div {
    flex: 0 0 fit-content
}

#popup_chat .chat_body .mds .chat {
    flex: 0 1 auto;
    margin: 16px 8px 0 16px;
    border-radius: 0 8px 8px 8px;
    border: 1px solid #e9ebed;
    background: #fff;
    padding: 12px;
    position: relative;
    font-size: 14px;
    line-height: 140%
}

#popup_chat .chat_body .mds .chat::after {
    content: '';
    position: absolute;
    display: block;
    width: 8px;
    height: 9px;
    background: url(/assets/images/left_white_tr.png) no-repeat;
    left: -8px;
    top: -1px
}

#popup_chat .chat_body .mds .time > div {
    height: 100%;
    display: flex;
    flex-wrap: nowrap;
    align-items: end;
    gap: 12px
}

#popup_chat .chat_body .time span {
    display: block;
    white-space: nowrap;
    color: #8c8c8c;
    font-size: 12px;
    font-weight: 500
}

#popup_chat .chat_body .cust {
    padding-left: 52px;
    display: flex;
    justify-content: right;
    align-items: stretch;
    width: 100%
}

#popup_chat .chat_body .cust > div {
    flex: 1 0 auto
}

#popup_chat .chat_body .cust .time > div {
    height: 100%;
    display: flex;
    flex-wrap: nowrap;
    align-items: end;
    justify-content: right;
    gap: 12px
}

#popup_chat .chat_body .cust .chat {
    flex: 0 1 auto;
    margin: 0 7px 0 8px;
    border-radius: 8px 0 8px 8px;
    background: #f57e1f;
    padding: 12px;
    position: relative;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    line-height: 140%
}

#popup_chat .chat_body .cust .boximg {
    flex: 0 1 auto;
    margin: 0 7px 0 8px
}

#popup_chat .chat_body .cust .boximg img {
    width: 100%;
    height: auto;
    max-width: 479px;
    max-height: 320px;
    border-radius: 8px;
    object-fit: cover
}

#popup_chat .chat_body .cust .boxfile {
    flex: 0 1 auto;
    margin: 0 7px 0 8px;
    text-align: right
}

#popup_chat .chat_body .cust .boxfile img {
    width: 30px;
    display: inline-block
}

#popup_chat .chat_body .cust .chat::after {
    content: '';
    position: absolute;
    display: block;
    width: 8px;
    height: 9px;
    background: url(/assets/images/right_orange_tr.png) no-repeat;
    right: -7px;
    top: 0
}

#popup_chat .chat_footer {
    flex: 0 0 fit-content;
    background: #fff;
    position: relative;
    border-left: 1px solid #bababa;
    border-right: 1px solid #bababa;
    border-bottom: 1px solid #bababa
}

#popup_chat .chat_footer .search {
    padding: 20px 24px;
    border-radius: 12px 12px 0 0;
    border-top: 1px solid #e9ebed;
    background: #fff;
    box-shadow: 0 -2px 12px 0 rgba(0, 0, 0, .08);
    overflow: hidden
}

#popup_chat .chat_footer .search ul {
    display: flex;
    flex-direction: column;
    gap: 12px
}

#popup_chat .chat_footer .search li a {
    color: #595959;
    display: block
}

#popup_chat .chat_footer .search li a strong {
    color: #171717;
    font-weight: 700
}

#popup_chat .chat_footer ul.input {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 24px;
    gap: 12px;
    width: 100%;
    height: 48px;
    border-top: 1px solid #e9ebed
}

#popup_chat .chat_footer ul.input li:first-of-type, #popup_chat .chat_footer ul.input li:last-of-type {
    flex: 0 0 fit-content
}

#popup_chat .chat_footer ul.input li:nth-of-type(2) {
    display: flex;
    align-items: center;
    justify-content: start;
    flex: 1
}

#popup_chat .chat_footer ul.input li input {
    width: 100%;
    height: 36px;
    border: 0;
    padding: 0 12px;
    border-radius: 50px;
    background: #f2f4f7
}

#popup_chat_file {
    display: none
}

.wrap_chat_file {
    position: absolute;
    display: flex;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, .5);
    justify-content: center;
    align-items: center
}

#popup_chat_file .boxchatfile {
    width: 440px;
    border-radius: 12px;
    background: #fff
}

#popup_chat_file h3 {
    padding: 16px 13px 24px 16px;
    position: relative
}

#popup_chat_file h3 span {
    font-size: 20px;
    font-weight: 600
}

#popup_chat_file h3 button {
    position: absolute;
    right: 13px;
    top: 16px
}

#popup_chat_file .wrap-listfile {
    padding: 0 16px 16px
}

#popup_chat_file .listfile {
    width: 100%;
    height: fit-content;
    max-height: 290px;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 12px 0 16px
}

#popup_chat_file .listfile li {
    padding-bottom: 12px;
    display: flex;
    position: relative;
    gap: 16px
}

#popup_chat_file .listfile li .boximg {
    width: 56px;
    height: 56px;
    flex: 0 0 56px
}

#popup_chat_file .listfile li .boxtxt {
    flex: 1 1 auto;
    overflow: hidden
}

#popup_chat_file .listfile li .boxtxt p {
    line-height: 28px;
    padding-right: 25px
}

#popup_chat_file .listfile li .boxtxt span {
    line-height: 28px;
    color: #909090
}

#popup_chat_file .listfile li .boxtxt button {
    position: absolute;
    right: 0;
    top: 14px;
    width: 20px;
    height: 20px
}

#popup_chat_file .boxbtn {
    padding: 0 16px 16px
}

#popup_chat_file .boxbtn button {
    display: flex;
    width: 100%;
    height: 48px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    border: 1px solid #dfdfdf;
    background: #fff
}

header {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 100;
    background: #fff;
    width: 100%;
    padding: 0 80px;
    border-bottom: 1px solid #e9ebee
}

#body_product header {
    background: #fff;
    width: 100%;
    padding: 0 80px;
    border-bottom: 1px solid #e9ebee
}

@media (max-width: 1280px) {
    #body_product header {
        padding: 0 20px
    }
}

#body_product header nav .depth1 > li > a {
    color: #000
}

#body_product.scroll header nav .depth1 > li > a {
    color: #171717
}

#body_product.scroll header {
    background: #fff
}

#body_product header nav .depth1 > li::after {
    background: #fff
}

#body_product.scroll header nav .depth1 > li::after {
    background: #171717
}

.container-lnb {
    position: fixed;
    left: 0;
    top: 81px;
    z-index: 90;
    background: #fa8120;
    width: 100%;
    height: 56px;
    padding: 0 80px;
    border-bottom: 1px solid transparent
}

#body_product .container-lnb::before {
    content: '';
    position: absolute;
    display: block;
    width: 100%;
    height: 65px;
    left: 0;
    top: calc(100% - 1px)
}

#body_product .container-lnb.scroll.on::before {
    background: #fff
}

#body_product.body_egd .container-lnb::before {
    display: none
}

#body_product .container-lnb {
    background: #fa8120 !important;
    width: 100% !important;
    height: 56px !important;
    padding: 0 80px !important;
    border-bottom: 1px solid transparent !important;
}

#body_home::before {
    content: '';
    position: fixed;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 547px;
    background: linear-gradient(180deg, #fff 50%, #f2f4f7 100%);
    z-index: -1
}

#body_home header.scroll, #body_mypage header.scroll, #body_search header.scroll {
    border-bottom: 1px solid #e9ebee
}

#body_product header.scroll {
    border-bottom: 1px solid transparent
}

#body_product .container-lnb.scroll {
    background: #fff;
    border-bottom: 1px solid #d1d1d1
}

header .right > ul > li:nth-of-type(2), header .right > ul > li:nth-of-type(4) {
    display: none
}

header.scroll .right > ul > li:nth-of-type(2), header.scroll .right > ul > li:nth-of-type(4) {
    display: block
}

header .hwrap {
    width: 100%;
    margin: 0 auto;
    height: 80px;
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 64px
}

header .hwrap .btn-hb {
    display: none
}

.container-lnb .hwrap {
    width: 100%;
    margin: 0 auto;
    max-width: 1920px;
    height: 56px;
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 64px
}

header .right, header h1 {
    flex: 0 0 fit-content;
    position: relative
}

#body_product header h1 a img {
    content: url(/assets/images/logo.png)
}

#body_product.scroll header h1 img {
    content: url(/assets/images/logo.png)
}

#body_product.scroll header h1 #btn_h_close img {
    content: url(/assets/images/h_close.svg)
}

.container-lnb .left {
    flex: 0 0 168px;
    width: 168px
}

nav {
    height: 80px;
    flex: 1 0 auto
}

header .right > ul {
    display: flex;
    justify-content: space-between;
    align-items: center
}

header .right > ul > li > button {
    height: 48px;
    width: 48px;
    display: flex;
    justify-content: center;
    align-items: center
}

header .right .user {
    width: 80px;
    gap: 8px;
    padding-left: 24px
}

header .right .user .profile_wrapper {
    width: 28px;
    height: 28px
}

.profile_wrapper {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100%;
    position: relative;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden
}

.profile_wrapper > div {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    /* Safari 호환을 위해 aspect-ratio 제거하고 width/height 100% 사용 */
}

.profile_wrapper > div::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: url(/assets/images/mypage/profile_frame.svg) no-repeat center center/100% 100%;
    z-index: 2
}

.view-reply .wrap-accept .profile_wrapper > div::before {
    background: url(/assets/images/mypage/profile_frame_reply.svg) no-repeat center center/100% 100%
}

#body_product header .profile_wrapper > div::before {
    background: url(/assets/images/mypage/profile_frame_product.svg) no-repeat center center/100% 100%
}

#body_product.scroll header .profile_wrapper > div::before {
    background: url(/assets/images/mypage/profile_frame.svg) no-repeat center center/100% 100%
}

.profile_wrapper .imgbox {
    position: relative;
    overflow: hidden;
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    /* Safari 호환을 위해 aspect-ratio 제거 */
}

.profile_wrapper .imgbox img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    /* Safari 호환을 위해 aspect-ratio 제거하고 height: 100% 사용 */
    -webkit-appearance: none;
    image-rendering: -webkit-optimize-contrast;
}

/* mypage userinfo에서 프로필 이미지 크기 고정 */
#wrapper_mypage.userinfo .profile_wrapper {
    width: 110px;
    height: 110px;
}

#wrapper_mypage.userinfo .profile_wrapper .imgbox {
    width: 100%;
    height: 100%;
}

header .right #btnbookmark.on img {
    content: url(/assets/images/icon_bookmark_on.svg)
}

header .right #btnalarm.on img {
    content: url(/assets/images/icon_alarm_on.svg)
}

header .right #btnalarm {
    position: relative
}

header .right #btnalarm span {
    position: absolute;
    display: none;
    min-width: 20px;
    width: fit-content;
    padding-left: 6px;
    padding-right: 6px;
    height: 20px;
    background: #f4361e;
    border-radius: 20px;
    right: 0;
    top: 0;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .2px
}

header .right #btnalarm.on span, header .right #btnalarm span {
    display: block
}

header .right .popup_alarm {
    display: none;
    position: absolute;
    top: 60px;
    right: 0;
    width: 420px;
    border-radius: 16px;
    border: 1px solid #ebebeb;
    background: #fff;
    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, .24)
}

header .right .popup_alarm dt {
    padding: 16px 24px;
    font-size: 22px;
    border-bottom: 1px solid #e9ebee;
    position: relative;
    letter-spacing: .15px;
    font-weight: 700;
    color: #171717
}

header .right .popup_alarm dt .set {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 50%;
    right: 14px;
    transform: translateY(-50%)
}

header .right .popup_alarm dd.right {
    display: flex;
    justify-content: right
}

header .right .popup_alarm dd .read {
    font-weight: 500;
    color: #5b5b5b;
    letter-spacing: .2px;
    padding: 8px 0
}

header .right .popup_alarm dd {
    padding: 0 16px;
    position: relative
}

header .right .popup_alarm dd .fs .date {
    display: inline-block;
    margin-left: 12px
}

header .right .popup_alarm dd a {
    padding: 16px 0
}

header .right .popup_alarm dd a p:not(:first-of-type) {
    margin-top: 8px
}

header .right .popup_alarm dd a .ellipsis1 {
    color: #171717;
    font-weight: 500;
    letter-spacing: .2px
}

header .right .popup_alarm dd a .ellipsis1.off {
    color: #C0C0C0;
}

header .right .popup_alarm dd .nodata {
    padding: 16px 0;
    margin-bottom: 8px;
    height: 496px;
    text-align: center;
    line-height: 30;
    background: url(/assets/images/icon_alarm_gray.svg) no-repeat center;
    background-position: 50% 40%;
    color: #171717;
    font-weight: 500;
    letter-spacing: .2px;
}

header .right .popup_alarm dd:not(:last-of-type) a {
    border-bottom: 1px solid #f0f0f0
}

header .right .popup_alarm .del {
    position: absolute;
    top: 16px;
    right: 14px;
    width: 24px;
    height: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    display: block
}

header .right .popup_user {
    width: 360px;
    border-radius: 16px;
    border: 1px solid #e9ebee;
    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, .25);
    background: #fff;
    position: absolute;
    top: 60px;
    right: 0;
    overflow: hidden;
    display: none
}

header .right .popup_user .inner {
    padding: 20px 24px;
    position: relative
}

header .right .popup_user .inner.bg {
    background: #f7f7f7
}

header .right .popup_user div {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    vertical-align: middle
}

header .right .popup_user span {
    font-size: 14px;
    color: #171717;
    line-height: 1.3;
    letter-spacing: .2px
}

header .right .popup_user strong {
    color: var(--Eghis-Orange, #f57e1f);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

header .right .popup_user .fxs {
    color: #5b5b5b;
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: .2px
}

header .right .popup_user .fxt {
    color: #171717;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: .2px
}

header .right .popup_user .nick {
    color: #171717;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: .2px
}

header .right .popup_user .or a {
    width: 54px;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -.12px;
    border-radius: 4px;
    background: #42cc52;
    position: absolute;
    right: 0;
    top: 0
}

header .right .popup_user .inner .profile_wrapper {
    width: 64px;
    flex: 0 0 64px
}

header .right .popup_user .hd {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    position: relative
}

header .right .popup_user .hd .right {
    flex: 1
}

header .right .popup_user .inner .logout {
    position: absolute;
    right: 24px;
    top: 20px;
    width: 32px;
    height: 32px;
    border-radius: 100px;
    border: 1px solid #d5d7db;
    display: flex;
    justify-content: center;
    align-items: center
}

header .right .popup_user .hd a {
    color: #787878;
    font-size: 12px;
    font-weight: 400;
    line-height: 130%;
    letter-spacing: -.12px;
    width: fit-content;
    position: relative;
    margin-bottom: 3px
}

header .right .popup_user .inner.line {
    border-top: 1px solid #f2f2f2;
    padding: 10px 20px
}

header .right .popup_user .inner.i2 {
    padding: 12px 24px 20px;
    border-top: 1px solid #e9ebee
}

header .right .popup_user .inner.i3 {
    padding: 23px 24px 27px;
    border-top: 1px solid #e9ebee;
    background: #f7f7f7
}

header .right .popup_user .inner.i3 li a div {
    color: #171717;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .2px
}

header .right .popup_user .inner.i3 li a div span {
    color: #5b5b5b;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .2px
}

header .right .popup_user .inner.i3 li a div span strong {
    color: #171717;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: .2px;
    display: inline-block;
    margin-right: 4px
}

header .right .popup_user .inner ul {
    display: flex;
    flex-direction: column;
    gap: 14px
}

header .right .popup_user .inner ul li {
    display: flex;
    justify-content: start;
    align-items: center;
    position: relative;
    gap: 8px
}

header .right .popup_user .inner ul li .point span {
    color: #595959;
    letter-spacing: .2px;
    font-size: 16px;
    font-weight: 400
}

header .right .popup_user .inner ul li .pbtn {
    color: #ff6a00;
    letter-spacing: .2px;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .2px;
    height: 24px;
    padding: 8px;
    background: #fff0e5;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center
}

header .right .popup_user .inner ul li .right {
    position: absolute;
    right: 0
}

header .right .popup_user .inner ul li:first-of-type {
    flex: 0 0 fit-content
}

nav .depth1 {
    position: relative;
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 42px;
    height: 100%;
    width: fit-content
}

nav a.on, nav a:focus-within, nav a:hover {
    font-weight: 600;
    color: #ff6a00
}

#body_cs nav .depth1 > li:first-of-type > a {
    font-weight: 600;
    color: #ff6a00
}

.main-menu-on {
    font-weight: 600 !important;
    color: #ff6a00 !important;
}

#body_cnc nav .depth1 > li:nth-of-type(3) > a {
    font-weight: 600;
    color: #ff6a00
}

#body_product nav .depth1 > li:nth-of-type(4) > a {
    font-weight: 600;
    color: #ff6a00
}

#body_esti nav .depth1 > li:nth-of-type(5) > a {
    font-weight: 600;
    color: #ff6a00
}

#body_edge nav .depth1 > li:nth-of-type(6) > a {
    font-weight: 600;
    color: #ff6a00
}

nav .depth1 > li {
    /*transition: all .2s ease-out*/
}

nav .depth1 > li:first-of-type:focus-within .depth2, nav .depth1 > li:first-of-type:hover .depth2 {
    height: 383px
}

nav .depth1 > li:nth-of-type(2):focus-within .depth2, nav .depth1 > li:nth-of-type(2):hover .depth2 {
    height: 223px
}

nav .depth1 > li:nth-of-type(3):focus-within .depth2, nav .depth1 > li:nth-of-type(3):hover .depth2 {
    height: 383px
}

nav .depth1 > li:nth-of-type(4):focus-within .depth2, nav .depth1 > li:nth-of-type(4):hover .depth2 {
    height: 223px
}

nav .depth1 > li:nth-of-type(5):focus-within .depth2, nav .depth1 > li:nth-of-type(5):hover .depth2 {
    height: 143px
}

nav .depth2 {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: calc(100% - 2px);
    /*transition: all .2s ease-out;*/
    height: 0;
    overflow: hidden
}

nav .depth2 ul {
    margin: 13px 16px 16px;
    display: flex;
    width: 174px;
    padding: 22px 24px;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    border-radius: 16px;
    border: 1px solid #f0f0f0;
    background: #fff;
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, .12)
}

nav a, nav li {
    height: 100%;
    position: relative
}

nav .depth > li > a {
    font-weight: 600
}

nav .depth2 > li > a {
    font-weight: 400
}

nav a {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #171717;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: .2px;
    white-space: nowrap
}

.count_time {
    font-size: 14px;
    font-weight: 400;
    color: #8c8c8c
}

.icon_view {
    display: inline-block;
    padding-left: 24px;
    padding-right: 8px;
    font-size: 12px;
    font-weight: 500;
    color: #8c8c8c;
    background: url(/assets/images/icon_view.svg) no-repeat left center
}

.icon_reply {
    display: inline-block;
    padding-left: 24px;
    padding-right: 8px;
    font-size: 12px;
    font-weight: 500;
    color: #8c8c8c;
    background: url(/assets/images/icon_reply.svg) no-repeat left center
}

.icon_view_text {
    display: inline-block;
    padding-right: 8px;
    font-size: 14px;
    font-weight: 400;
    color: #8e8e8e;
    letter-spacing: .2px
}

.icon_reply_text {
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    color: #8e8e8e;
    letter-spacing: .2px
}

.date_rm {
    font-size: 14px;
    font-weight: 400;
    color: #8e8e8e;
    padding-right: 8px;
    display: inline-block
}

#search_keyword {
    position: relative;
    max-width: 100%;
    width: 720px;
    height: 72px;
    font-size: 20px;
    color: #171717;
    font-weight: 600;
    padding: 0 72px;
    background: 0 0
}

.boxsearch::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 100px;
    border: 2px solid transparent;
    background: linear-gradient(116.36deg, #fa0 0, #ff6a00 66.86%);
    mask: linear-gradient(#171717 0 0) padding-box, linear-gradient(#171717 0 0);
    mask-composite: exclude;
    z-index: -1;
    max-width: 100%;
    width: 720px;
    height: 72px;
    box-sizing: border-box
}

.boxsearch {
    position: relative;
    width: fit-content;
    margin: 0 auto;
    max-width: 100%
}

.boxsearch a.symbol {
    position: absolute;
    left: 16px;
    top: 50%;
    width: 56px;
    height: 56px;
    transform: translateY(-50%)
}

.boxsearch button {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    width: 56px;
    height: 56px;
    display: flex;
    justify-content: center;
    align-items: center
}

.boxsearch {
    position: relative;
    width: 720px;
    height: 72px;
    margin: 0 auto;
    max-width: 100%;
    padding: 2px;
    box-sizing: border-box
}

.boxsearch::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 35px;
    padding: 2px;
    background: conic-gradient(from 78.6deg at 50% 50%, #fa0, #ff6a00, #fa0);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: exclude;
    z-index: -1;
    pointer-events: none
}

.boxsearch-uniform {
    position: relative;
    width: 720px;
    height: 72px;
    margin: 0 auto;
    max-width: 100%;
    background: #fff;
    border-radius: 35px
}

.boxsearch-uniform::before {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: 37px;
    background: linear-gradient(78.6deg, #fa0 0, #ff6a00 50%, #fa0 100%), linear-gradient(78.6deg, #fa0 0, #ff6a00 50%, #fa0 100%);
    background-size: 100% 100%, 100% 100%;
    background-position: center;
    z-index: -1;
    pointer-events: none
}

.boxsearch-uniform::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 35px;
    background: #fff;
    z-index: -1
}

.boxsearch-svg {
    position: relative;
    width: 720px;
    height: 72px;
    margin: 0 auto;
    max-width: 100%;
    background-color: #fff;
    border-radius: 35px;
    background-image: url('data:image/svg+xml;utf8,<svg width="720" height="72" viewBox="0 0 720 72" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="1" y="1" width="718" height="70" rx="35" stroke="url(%23paint0_linear)" stroke-width="2" fill="none"/><defs><linearGradient id="paint0_linear" x1="0" y1="0" x2="28.1684" y2="139.599" gradientUnits="userSpaceOnUse"><stop stop-color="%23FFAA00"/><stop offset="1" stop-color="%23FF6A00"/></linearGradient></defs></svg>');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center
}

.boxsearch-precise {
    position: relative;
    width: 720px;
    height: 72px;
    margin: 0 auto;
    max-width: 100%
}

.boxsearch-precise::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 35px;
    background: linear-gradient(78.6deg, #fa0 0, #ff6a00 100%);
    -webkit-mask: radial-gradient(farthest-side at top left, transparent calc(100% - 2px), #fff calc(100% - 2px)), radial-gradient(farthest-side at top right, transparent calc(100% - 2px), #fff calc(100% - 2px)), radial-gradient(farthest-side at bottom left, transparent calc(100% - 2px), #fff calc(100% - 2px)), radial-gradient(farthest-side at bottom right, transparent calc(100% - 2px), #fff calc(100% - 2px)), linear-gradient(#fff 0 0) top/calc(100% - 70px) 2px no-repeat, linear-gradient(#fff 0 0) bottom/calc(100% - 70px) 2px no-repeat, linear-gradient(#fff 0 0) left/2px calc(100% - 70px) no-repeat, linear-gradient(#fff 0 0) right/2px calc(100% - 70px) no-repeat;
    -webkit-mask-composite: destination-in;
    mask-composite: intersect;
    z-index: -1;
    pointer-events: none
}

.boxsearch a.symbol, .boxsearch-precise a.symbol, .boxsearch-svg a.symbol, .boxsearch-uniform a.symbol {
    position: absolute;
    left: 16px;
    top: 50%;
    width: 56px;
    height: 56px;
    transform: translateY(-50%)
}

.boxsearch button, .boxsearch-precise button, .boxsearch-svg button, .boxsearch-uniform button {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    width: 56px;
    height: 56px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: 0 0;
    border: none;
    cursor: pointer
}

.select {
    min-width: 210px;
    width: fit-content;
    padding: 0 34px 0 16px;
    height: 40px;
    border-radius: 8px;
    color: #171717;
    font-size: 16px;
    font-weight: 400;
    position: relative;
    background: #fff url(/assets/images/sel_down.svg) no-repeat right 16px center;
    border: 1px solid #d5d7db;
    color: #5b5b5b;
    letter-spacing: .2px
}

.select option {
    background: #fff;
    color: #5b5b5b;
    padding: 9px 40px 9px 16px
}

.select option:disabled {
    color: #bdbdbd
}

.form-wrapper input[type=date], .form-wrapper input[type=email], .form-wrapper input[type=number], .form-wrapper input[type=password], .form-wrapper input[type=search], .form-wrapper input[type=tel], .form-wrapper input[type=text], .form-wrapper input[type=url], .step-order-form input[type=date], .step-order-form input[type=email], .step-order-form input[type=number], .step-order-form input[type=password], .step-order-form input[type=search], .step-order-form input[type=tel], .step-order-form input[type=text], .step-order-form input[type=url] {
    padding: 0 16px;
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    align-self: stretch;
    border-radius: 8px;
    border: 1px solid #d5d7db;
    color: #171717;
    font-weight: 400
}

.form-wrapper input:read-only {
    background-color: #f0f0f0;
    color: #5b5b5b
}

.form-wrapper select {
    width: 100%;
    min-width: 0
}

.wrap-paging {
    margin: 0 auto;
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px 12px;
    width: 100%;
    justify-content: center;
    margin-top: 60px;
    flex-wrap: wrap
}

.wrap-paging .next, .wrap-paging .prev {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    background: url(/assets/images/board/page_prev.svg) no-repeat center center
}

.wrap-paging .next {
    background: url(/assets/images/board/page_next.svg) no-repeat center center
}

.wrap-paging .none {
    opacity: .3;
    cursor: default
}

.wrap-paging .page-num {
    display: flex;
    align-items: center;
    gap: 5px 12px;
    flex: 0 0 fit-content;
    flex-wrap: wrap
}

.wrap-paging .page-num li {
    min-width: 24px;
    width: fit-content;
    flex: 0 0 fit-content;
    text-align: center;
    color: #595959
}

.wrap-paging .page-num li a {
    color: #5b5b5b;
    font-size: 16px;
    font-weight: 400;
    background: 0 0;
    height: 24px;
    width: 100%;
    border-radius: 6px
}

.wrap-paging .page-num li a.on {
    color: #fff;
    background: #ff6a00
}

.wrap-paging.btype {
    gap: 10px;
    width: 100%;
    justify-content: center
}

.wrap-paging.btype .next1, .wrap-paging.btype .next2, .wrap-paging.btype .prev1, .wrap-paging.btype .prev2 {
    width: 40px;
    height: 40px;
    flex: 0 0 40px
}

.wrap-paging.btype .prev1 {
    background: url(/assets/images/board/p_prev2_1.svg) no-repeat center center
}

.wrap-paging.btype .next1 {
    background: url(/assets/images/board/p_next2_1.svg) no-repeat center center
}

.wrap-paging.btype .prev2 {
    background: url(/assets/images/board/p_prev2_2.svg) no-repeat center center
}

.wrap-paging.btype .next2 {
    background: url(/assets/images/board/p_next2_2.svg) no-repeat center center
}

.wrap-paging.btype .page-num {
    gap: 4px
}

.wrap-paging.btype .page-num li {
    min-width: 40px;
    height: 40px
}

.wrap-paging.btype .page-num li a {
    min-width: 40px;
    height: 40px;
    width: fit-content;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1px;
    font-size: 15px;
    height: 100%;
    color: #171717;
    border: 1px solid #ddd
}

.wrap-paging.btype .page-num li a.on {
    color: #f57f20;
    border: 1px solid #f57f20;
    font-weight: 400
}

.list-board dt {
    height: 50px;
    border-top: 1px solid #e9ebee;
    border-bottom: 1px solid #e9ebee
}

.list-board dd {
    height: 42px;
    border-bottom: 1px solid #e9ebee;
    position: relative
}

.list-board dd.on {
    background: #f3faf5;
}

#body_cs .list-board dd.on {
    background: #fffdf7
}

.no-data, .no-data1 { /*height:188px!important;*/
    color: #8e8e8e !important;
    font-size: 14px !important;
    font-weight: 400 !important; /*border-bottom:1px solid #e9ebee!important;*/
    display: flex;
    justify-content: center !important;
    align-items: center !important;
    flex-direction: column !important;
    gap: 8px;
    letter-spacing: .2px
}

.no-data.tl {
    border-top: 1px solid #ddd !important
}

#boardList > .no-data {
    min-height: 188px !important;
}

.mb10 {
    margin-bottom: 10px !important
}

.mt0 {
    margin-top: 0 !important
}

.wrap-page-btn {
    position: relative
}

.wrap-page-btn .btnwrite {
    position: absolute;
    right: 0;
    top: -5px
}

.btnwrite {
    display: flex;
    width: 117px;
    height: 50px;
    padding: 0 23px;
    justify-content: right;
    align-items: center;
    border-radius: 8px;
    background: #f57f20;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    background: #f57f20 url(/assets/images/board/btnwrite.svg) no-repeat left 23px center
}

.list-board ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%
}

.list-board ul li {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 8px;
    font-size: 14px;
    height: 100%;
    overflow: hidden;
    white-space: nowrap;
    letter-spacing: .2px
}

.list-board.m2.fm dd {
    height: initial
}

.list-board.m2.fm li:nth-of-type(2) {
    justify-content: space-between
}

.list-board.m2.fm li:nth-of-type(2) .cat {
    margin-top: 8px;
    font-size: 14px;
    display: flex;
    gap: 8px
}

.list-board.m2.fm li:nth-of-type(3) {
    width: 116px;
    flex: 0 0 116px;
    justify-content: start
}

.list-board .wrap-thumb-img {
    flex: 0 0 72px;
    margin-left: 8px
}

.list-board dt ul li {
    font-weight: 600;
    color: #5b5b5b;
    justify-content: center !important
}

.list-board dd ul li {
    font-weight: 400;
    color: #8e8e8e
}

.list-board ul li .title, .wrap-board-title .title {
    width: fit-content;
    max-width: 100%;
    overflow: hidden;
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 8px;
    color: #171717;
    position: relative
}

.wrap-board-title .subject {
    color: #171717;
    font-size: 24px;
    font-weight: 700
}

.list-board ul li .title .ellipsis1 {
    white-space: initial
}

.list-board ul li .title .emgc, .wrap-board-title .emgc {
    height: 20px;
    display: flex;
    padding: 0 8px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    color: #f4361e;
    font-size: 12px;
    font-weight: 700;
    border: 1px solid #f4361e;
    letter-spacing: .2px
}

.gap8js .emgc {
    display: none !important
}

.container-board .title .emgcn, .list-board ul li .title .emgcn {
    height: 20px;
    display: flex;
    padding: 0 8px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    color: #f4361e;
    font-size: 12px;
    font-weight: 700;
    border: 1px solid #f4361e;
    letter-spacing: .2px
}

.container-board .title .reply, .list-board ul li .title .reply {
    color: #f4361e;
    font-weight: 400
}

.list-board dd.hit {
    background: #fffdf7
}

.title .hit {
    color: #ff6a00 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: .2px !important
}

.container-board .title > .subject, .list-board ul li .title > .ellipsis1, .list-board ul li .title > .ellipsis2, .list-board ul li .title > .ellipsis3 {
    flex: 1 1 auto;
    width: fit-content
}

.container-board .title > span, .list-board ul li .title > span {
    flex: 0 0 fit-content;
    width: fit-content
}

.list-board ul .left {
    justify-content: start !important
}

.list-board ul .auto {
    width: auto !important;
    flex: 1 1 auto !important
}

.btnwhite {
    width: fit-content;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 16px;
    height: 32px;
    border-radius: 6px;
    border: 1px solid var(--Line-Deep, #d5d7db);
    color: #171717;
    font-size: 14px;
    font-weight: 500
}

#body_home {
    background: #f2f4f7
}

#body_home header {
    background: #fff
}

#body_home .wrapper_main {
    width: 100%;
    position: relative;
    padding-bottom: 120px
}

main .cont_head.search {
    padding: 64px 0 40px
}

main .cont_head.search .cwrap {
    margin: 0 auto
}

main .cont_head.search .hk {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
    color: #595959;
    font-size: 16px;
    margin-top: 20px
}

main .cont_head.search .hk dt {
    padding-right: 8px
}

main .cont_head.search .hk dd {
    font-weight: 700
}

body.logout .cont_head.search {
    padding: 64px 0 56px
}

body.logout .cont_head.search div img {
    margin: 0 auto
}

body.logout .cont_head.search h2 {
    text-align: center;
    margin: 24px 0;
    font-size: 36px;
    font-style: normal;
    font-weight: 700
}

body.logout .cont_head.search p {
    color: var(--Text-Secondary, #5b5b5b);
    text-align: center;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#body_home .wrapper_main .cont_main {
    display: flex;
    width: 100%;
    min-width: 0;
    justify-content: space-between;
    align-items: stretch;
    gap: 30px
}

#body_home .wrapper_main .cont_main > .cont_left {
    flex: 0 0 810px;
    width: 810px
}

#body_home .wrapper_main .cont_main > .cont_right {
    flex: 0 0 400px;
    width: 400px
}

#body_home.logout .wrapper_main .cont_main > .cont_left {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: start
}

#body_home.logout .wrapper_main .cont_main > .cont_right {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: start
}

#body_home .w-home-btn {
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center
}

#body_home .btn-home-order {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 20px 50px
}

#body_home .wrapper_main section {
    margin-bottom: 16px
}

#body_home .wrapper_main section.swap .title {
    font-size: 18px;
    font-weight: 600;
    line-height: 140%
}

#body_home .wrapper_main .inwrap {
    padding: 24px 24px 30px;
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid #ebebeb
}

#body_home .wrapper_main .inwrap .scont {
    margin-top: 20px
}

#body_home .wrapper_main h3 {
    position: relative;
    font-size: 24px;
    font-weight: 600;
    color: #343434
}

/* 더보기 > 의 > 아이콘 vertical align center 처리*/
#body_home .wrapper_main h3 a {
    /*display: none;*/
    /*height: 24px;*/
    padding-right: 24px;
    width: fit-content;
    background: url(/assets/images/icon_more.svg) no-repeat right center;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    font-weight: 500;
    color: #595959;
    margin-right: -7px !important; /* CSS TODO */

}

#body_home .wrapper_main .swiper-pagination {
    top: initial;
    bottom: 16px
}

#body_home .wrapper_main .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border-radius: 8px;
    background: #fff;
    opacity: .5
}

#body_home .wrapper_main .swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 32px;
    opacity: 1
}

#body_home .wrapper_main .swiper.sec_banner_1 {
    width: 100%;
    overflow: hidden;
    border-radius: 16px
}

#body_home .wrapper_main .swiper.sec_banner_1 .swiper-slide {
    width: 100%;
    aspect-ratio: 810/240;
    border: 1px solid #ebebeb;
    overflow: hidden;
    border-radius: 16px
}

#body_home .wrapper_main .swiper.sec_banner_1 a {
    width: 100%;
    height: 100%
}

#body_home .wrapper_main .swiper.sec_banner_1 img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.swiper.tablist {
    width: 100%;
    overflow: hidden
}

.swiper.tablist .swiper-wrapper {
    display: flex;
    justify-content: start;
    align-items: center
}

.swiper.tablist .swiper-slide {
    flex: 0 0 fit-content
}

.swiper.tablist .swiper-slide a {
    height: 40px;
    padding: 0 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #5b5b5b;
    font-weight: 500;
    letter-spacing: .2px;
    border-radius: 50px;
    border: 1px solid #d5d7db
}

.swiper.tablist .swiper-slide a.on {
    border: 1px solid #ffb580;
    background: #fff0e5;
    color: #ff6a00;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .2px
}

#body_home .wrapper_main .sec_comm .tabcont {
    margin-top: 28px;
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 40px
}

#body_home .wrapper_main .sec_comm .tabcont .left, #body_home .wrapper_main .sec_comm .tabcont .right {
    flex: 1
}

#body_home .wrapper_main .sec_comm .left .item {
    padding: 14px 0
}

#body_home .wrapper_main .sec_comm .left .item:not(:first-of-type) {
    border-top: 1px solid #f0f0f0
}

#body_home .wrapper_main .sec_comm .left .fl {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px
}

#body_home .wrapper_main .sec_comm .left .boxtxt {
    display: flex;
    flex-direction: column;
    gap: 2px
}

#body_home .wrapper_main .sec_comm .left .boxtxt .cat {
    font-size: 14px;
    color: #8c8c8c
}

#body_home .wrapper_main .sec_comm .left .boxtxt .hit {
    /*TODO : 홈 - 커뮤니티 - 인기글 점 사이의 간격*/
    /*margin-left: 4px; */
    font-size: 14px;
    color: #f57e1f
}

#body_home .wrapper_main .sec_comm .left .boxtxt .exp {
    color: #595959
}

#body_home .wrapper_main .sec_comm .left .boximg {
    width: 72px;
    height: 72px;
    flex: 0 0 72px;
    border-radius: 8px;
    border: 1px solid #f0f0f0;
    overflow: hidden
}

#body_home .wrapper_main .sec_comm .left .boximg img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

#body_home .wrapper_main .sec_comm .left .fb {
    margin-top: 8px;
    position: relative
}

#body_home .wrapper_main .sec_comm .left .fb .count_time {
    font-size: 14px;
    color: #8c8c8c;
    position: absolute;
    right: 0;
    top: 0
}

#body_home .wrapper_main .sec_comm .right ul {
    display: flex;
    flex-direction: column
}

#body_home .wrapper_main .sec_comm .right li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 38px;
    gap: 12px
}

#body_home .wrapper_main .sec_comm .right .count_time {
    flex: 0 0 fit-content
}

#body_home .wrapper_main .sec_news .slist {
    display: grid;
    grid-template-columns:repeat(2, 1fr);
    gap: 16px 40px
}

#body_home .wrapper_main .sec_news .slist .item {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: start;
    overflow-x: hidden;
    width: 100%;
    max-width: 100%
}

#body_home .wrapper_main .sec_news .boximg {
    width: 156px;
    flex: 0 0 156px;
    aspect-ratio: 156/102;
    border-radius: 12px;
    border: 1px solid #f0f0f0 !important;
    overflow: hidden
}

#body_home .wrapper_main .sec_news .boxtxt {
    flex: 1 1 auto
}

#body_home .wrapper_main .sec_news .boximg img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

#body_home .wrapper_main .sec_news .boxtxt p:first-of-type {
    flex: 1 1 auto;
    margin: 9px 0 8px;
    font-size: 18px
}

#body_home .wrapper_main .sec_medi .slist {
    display: grid;
    gap: 16px;
    grid-template-columns:repeat(3, 1fr)
}

#body_home .wrapper_main .sec_medi .item {
    overflow-x: hidden;
    width: 100%;
    max-width: 100%
}

#body_home .wrapper_main .sec_medi .boximg {
    width: 100%;
    aspect-ratio: 250/160;
    object-fit: cover;
    border-radius: 12px;
    overflow: hidden;
    background: #a5abdd url(/assets/images/main/bg31.svg) no-repeat right bottom;
    padding: 20px 24px
}

#body_home .wrapper_main .sec_medi .thumbimg {
    width: 100%;
    aspect-ratio: 246/138;
    overflow: hidden;
    border: 1px solid #f0f0f0;
    border-radius: 8px
}

#body_home .wrapper_main .sec_medi .thumbimg img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

#body_home .wrapper_main .sec_medi .item:nth-child(3n+0) .boximg {
    background: #85bfd4 url(/assets/images/main/bg32.svg) no-repeat right bottom
}

#body_home .wrapper_main .sec_medi .boximg strong {
    display: block;
    width: fit-content;
    height: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #a5abdd;
    font-family: "Gmarket Sans";
    font-size: 14px;
    font-weight: 500;
    line-height: 130%;
    background: #fff;
    border-radius: 22px;
    padding: 3px 8px 1px;
    white-space: nowrap
}

#body_home .wrapper_main .sec_medi .item:nth-child(3n+0) .boximg strong {
    color: #85bfd4
}

#body_home .wrapper_main .sec_medi .boximg p {
    width: 147px;
    height: 78px;
    color: #fff;
    font-family: "Gmarket Sans";
    font-size: 20px;
    font-weight: 500;
    line-height: 130%;
    margin-top: 10px;
    word-break: keep-all;
    word-wrap: break-word;
    overflow: hidden
}

#body_home .wrapper_main .sec_medi .title {
    margin: 16px 0 8px
}

#body_home .wrapper_main .sec_medi .boxtxt .fb {
    display: flex;
    gap: 5px;
    justify-content: space-between;
    align-items: center
}

#body_home .wrapper_main .swiper.sec_banner_2 {
    width: 100%;
    overflow: hidden;
    border-radius: 16px
}

#body_home .wrapper_main .swiper.sec_banner_2 .swiper-slide {
    width: 100%;
    aspect-ratio: 400/200;
    border: 1px solid #f0f0f0;
    overflow: hidden;
    border-radius: 16px
}

#body_home .wrapper_main .swiper.sec_banner_2 a {
    width: 100%;
    height: 100%
}

#body_home .wrapper_main .swiper.sec_banner_2 img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

#body_home .wrapper_main .sec_invit .slist {
    display: grid;
    gap: 16px;
    grid-template-columns:repeat(3, 1fr)
}

#body_home .wrapper_main .sec_invit .item {
    overflow-x: hidden;
    width: 100%;
    max-width: 100%
}

#body_home .wrapper_main .sec_invit .boximg {
    width: 100%;
    aspect-ratio: 246/138;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #f0f0f0;
}

#body_home .wrapper_main .sec_invit .boximg img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

#body_home .wrapper_main .sec_invit .tp {
    margin-top: 16px
}

#body_home .wrapper_main .sec_invit .tp strong {
    width: fit-content;
    height: 20px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    background: #3262a6;
    border-radius: 24px;
    padding: 0 12px;
    letter-spacing: .2px
}

#body_home .wrapper_main .sec_invit .tp span {
    display: inline-block;
    margin-left: 8px;
    color: #171717;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .2px
}

#body_home .wrapper_main .sec_invit .boxtxt .title {
    margin: 7px 0 8px
}

#body_home .wrapper_main .sec_invit .boxtxt .tb {
    font-size: 14px
}

#body_home .wrapper_main .sec_invit .boxtxt .tb .area {
    color: #595959
}

#body_home .wrapper_main .sec_symp .slist {
    display: grid;
    gap: 16px;
    grid-template-columns:repeat(3, 1fr)
}

#body_home .wrapper_main .sec_symp .item {
    overflow-x: hidden;
    width: 100%;
    max-width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column
}

#body_home .wrapper_main .sec_symp .boximg {
    width: 100%;
    aspect-ratio: 246/138;
    border-radius: 12px;
    border: 1px solid #f0f0f0;
    overflow: hidden
}

#body_home .wrapper_main .sec_symp .boximg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: left center
}

#body_home .wrapper_main .sec_symp .boxtxt .title {
    margin: 16px 0
}

#body_home .wrapper_main .sec_symp .boxtxt .part {
    overflow: hidden;
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    width: 100%;
    height: 24px
}

#body_home .wrapper_main .sec_symp .boxtxt .date {
    margin: 12px 0 16px;
    color: #8c8c8c;
    font-weight: 500
}

.wrap-bbtn {
    display: flex;
    gap: 8px;
    justify-content: space-between
}

.wrap-bbtn .btn-scr {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    border: 1px solid #d5d7db;
    border-radius: 8px;
    background: url(/assets/images/icon_heart.svg) no-repeat center center
}

.wrap-bbtn .btn-scr.on {
    background: url(/assets/images/icon_heart_on.svg) no-repeat center center
}

.wrap-bbtn .fbtn {
    flex: 1;
    width: 100%;
    color: #ff6a00;
    display: flex;
    height: 40px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: #fff0e5;
    font-weight: 500;
    white-space: nowrap;
    letter-spacing: .2px
}

#body_home .wrapper_main .sec_user {
    width: 100%
}

#body_home .wrapper_main .swrap {
    padding: 24px;
    border-radius: 16px;
    border: 1px solid #ebebeb;
    background: #fff;
    width: 100%
}

#body_home .wrapper_main .sec_user .info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    width: 100%;
    overflow: hidden;
    padding-bottom: 20px;
    border-bottom: 1px solid #f0f0f0
}

#body_home .wrapper_main .sec_user .info .boximg {
    flex: 0 0 64px;
    width: 64px;
    height: 64px
}

#body_home .wrapper_main .sec_user .info .boximg img {
    width: 100%;
    height: 100%
}

#body_home .wrapper_main .sec_user .nm {
    flex: 1 1 auto;
    display: flex;
    justify-content: space-between;
    align-items: center
}

#body_home .wrapper_main .sec_user .nm .uname {
    font-size: 20px;
    font-weight: 600;
    line-height: 140%
}

#body_home .wrapper_main .sec_user .point {
    display: flex;
    align-items: center
}

#body_home .wrapper_main .sec_user .point span {
    color: #595959;
    display: block;
    margin-left: 4px
}

#body_home .wrapper_main .sec_user .point strong {
    color: #f57e1f;
    font-weight: 500;
    margin-left: 8px;
    display: block
}

#body_home .wrapper_main .sec_user .btnlogout {
    display: flex;
    height: 40px; /*padding:0 20px;*/
    justify-content: center;
    align-items: center;
    border-radius: 50px; /*border:1px solid #bbbec3;*/
    background: #fff;
    font-weight: 500;
    flex: 0 0 fit-content;
    gap: 8px;
    color: #171717;
    letter-spacing: .2px
}

#body_home .wrapper_main .sec_user .myw {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    width: 100%;
    margin-top: 16px
}

#body_home .wrapper_main .sec_user .myw .item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

#body_home .wrapper_main .sec_user .myw .tit {
    margin: 2px 0 4px
}

#body_home .wrapper_main .sec_user .myw .exp {
    color: #595959;
    font-size: 14px
}

#body_home .wrapper_main .sec_user .myw .exp strong {
    color: #ff6a00;
    font-size: 14px;
    font-weight: 600
}

#body_home.logout .wrapper_main .sec_user h3 {
    color: #595959;
    font-size: 16px;
    font-weight: 400;
    text-align: center
}

#body_home.logout .wrapper_main .sec_user .btnlogin {
    margin-top: 12px;
    display: flex;
    width: 100%;
    height: 56px;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    background: #f57f20;
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    white-space: nowrap
}

#body_home.logout .wrapper_main .sec_user .btnlogin strong {
    font-size: 20px;
    font-weight: 700
}

#body_home .wrapper_main .swiper.sec_banner_3 {
    width: 100%;
    overflow: hidden;
    border-radius: 16px
}

#body_home .wrapper_main .swiper.sec_banner_3 .swiper-slide {
    width: 100%;
    aspect-ratio: 400/120;
    border: 1px solid #bfbfbf;
    overflow: hidden;
    border-radius: 16px
}

#body_home .wrapper_main .swiper.sec_banner_3 a {
    width: 100%;
    height: 100%
}

#body_home .wrapper_main .swiper.sec_banner_3 img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

#body_home .wrapper_main .swiper.sec_banner_4, #body_home .wrapper_main .swiper.sec_banner_5 {
    width: 100%;
    overflow: hidden;
    border-radius: 16px
}

#body_home .wrapper_main .swiper.sec_banner_4 .swiper-slide, #body_home .wrapper_main .swiper.sec_banner_5 .swiper-slide {
    width: 100%;
    aspect-ratio: 400/200;
    border: 1px solid #f0f0f0;
    overflow: hidden;
    border-radius: 16px
}

#body_home .wrapper_main .swiper.sec_banner_4 a, #body_home .wrapper_main .swiper.sec_banner_5 a {
    width: 100%;
    height: 100%
}

#body_home .wrapper_main .swiper.sec_banner_4 img, #body_home .wrapper_main .swiper.sec_banner_5 img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

#body_home .wrapper_main .sec_chat h3 {
    font-size: 20px;
    font-weight: 600;
    line-height: 140%
}

#body_home .wrapper_main .sec_chat ul {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 4px
}

#body_home .wrapper_main .sec_chat ul li a {
    display: flex;
    justify-content: space-between;
    height: 40px;
    border-radius: 8px;
    background: #f7f7f7
}

#body_home .wrapper_main .sec_chat ul li a .text {
    padding: 0 12px;
    color: #171717;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .2px;
    display: flex;
    align-items: center
}

#body_home .wrapper_main .sec_chat ul li a .data {
    padding: 0 12px 0 32px;
    color: #8e8e8e;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .2px;
    background: url(/assets/images/icon_person.svg) no-repeat center left 12px;
    display: flex;
    align-items: center
}

#body_home .wrapper_main .sec_notice h3 {
    font-size: 20px;
    font-weight: 600;
    line-height: 140%
}

#body_home .wrapper_main .sec_notice .scont .item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 36px;
    gap: 12px
}

#body_home .wrapper_main .sec_notice .scont .subject {
    flex: 1 1 auto;
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 3px
}

#body_home .wrapper_main .sec_notice .scont .count_time {
    flex: 0 0 fit-content
}

.swiper.edge-tab {
    width: 100%;
    overflow: hidden;
    margin-bottom: 24px
}

.swiper.edge-tab .swiper-wrapper {
    display: flex;
    justify-content: start;
    align-items: center
}

.swiper.edge-tab .swiper-slide {
    flex: 0 0 fit-content
}

.swiper.edge-tab .swiper-slide a {
    width: 120px;
    height: 44px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    border: 1px solid #ddd;
    color: #272727;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 500
}

.swiper.edge-tab .swiper-slide a.on {
    color: #f57f20;
    border: 1px solid #f57f20;
    background: #ffefe2
}

.swiper.lnb {
    width: 100%;
    overflow: hidden;
    border-bottom: 1px solid var(--Line-Cool-Gray, #e9ebee)
}

.container-lnb .swiper.lnb {
    border-bottom: 1px solid transparent
}

#body_search .swiper.lnb {
    width: fit-content;
    overflow: hidden
}

.swiper.lnb .swiper-wrapper {
    display: flex;
    justify-content: start;
    align-items: center
}

.swiper.lnb .swiper-slide {
    flex: 0 0 fit-content
}

.swiper.lnb .swiper-slide a, .swiper.lnb .swiper-slide button {
    width: fit-content;
    flex: 0 0 fit-content;
    height: 56px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom: 2px solid transparent;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .2px;
    opacity: .5
}

.swiper.lnb .swiper-slide a.on, .swiper.lnb .swiper-slide button.on {
    border-bottom: 2px solid #171717;
    color: #171717;
    font-weight: 500;
    opacity: 1
}

.swiper.lnb .swiper-slide a, .swiper.lnb .swiper-slide button {
    color: #171717 !important
}

.swiper.lnb .swiper-slide a.on, .swiper.lnb .swiper-slide button.on {
    color: #171717 !important
}

.swiper.lnb-product {
    width: 100%;
    overflow: hidden;
    border-bottom: 1px solid var(--Line-Cool-Gray, #e9ebee)
}

.container-lnb .swiper.lnb-product {
    border-bottom: 1px solid transparent
}

#body_search .swiper.lnb-product {
    width: fit-content;
    overflow: hidden
}

.swiper.lnb-product .swiper-wrapper {
    display: flex;
    justify-content: start;
    align-items: center
}

.swiper.lnb-product .swiper-slide {
    flex: 0 0 fit-content
}

.swiper.lnb-product .swiper-slide a, .swiper.lnb-product .swiper-slide button {
    width: fit-content;
    flex: 0 0 fit-content;
    height: 56px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom: 2px solid transparent;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .2px;
    opacity: .5;
    color: #171717 !important
}

.swiper.lnb-product .swiper-slide a.on, .swiper.lnb-product .swiper-slide button.on {
    border-bottom: 2px solid #171717;
    color: #171717 !important;
    font-weight: 500;
    opacity: 1
}

.container-lnb .navwrap {
    position: relative
}

.container-lnb .swiper.lnb .swiper-slide a, .container-lnb .swiper.lnb .swiper-slide button {
    height: 56px;
    border-bottom: 2px solid transparent;
    color: #fff !important;
    font-size: 16px;
    font-weight: 500;
    opacity: .7;
    margin: 20px !important
}

.container-lnb .swiper.lnb .swiper-slide a.on, .container-lnb .swiper.lnb .swiper-slide button.on {
    border-bottom: 4px solid rgba(255, 255, 255, .6);
    color: #fff !important;
    opacity: 1
}

#body_product .container-lnb .swiper.lnb .swiper-slide a, #body_product .container-lnb .swiper.lnb .swiper-slide button {
    border-bottom: 2px solid transparent;
    color: #fff;
    opacity: 1
}

#body_product .container-lnb .swiper.lnb .swiper-slide a.on, #body_product .container-lnb .swiper.lnb .swiper-slide button.on {
    border-bottom: 2px solid #fff !important;
    color: #fff !important;
    font-weight: 800
}

#body_product.scroll .container-lnb .swiper.lnb .swiper-slide a, #body_product.scroll .container-lnb .swiper.lnb .swiper-slide button {
    border-bottom: 2px solid transparent;
    color: #353535
}

#body_product.scroll .container-lnb .swiper.lnb .swiper-slide a.on, #body_product.scroll .container-lnb .swiper.lnb .swiper-slide button.on {
    border-bottom: 2px solid #171717;
    color: #171717;
    font-weight: 800
}

.wrap-swsnb {
    padding: 16px 0
}

.b-bottom {
    border-bottom: 1px solid var(--Line-Cool-Gray, #e9ebee)
}

.swiper.snb {
    width: 100%;
    overflow: hidden;
    flex: 1 1 auto
}

.swiper.snb .swiper-wrapper {
    display: flex;
    justify-content: start;
    align-items: center
}

.swiper.snb .swiper-slide {
    flex: 0 0 fit-content
}

.swiper.snb .swiper-slide a, .swiper.snb .swiper-slide button {
    width: fit-content;
    flex: 0 0 fit-content;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 32px;
    padding: 0 13px !important;
    border: 1px solid #d5d7db;
    border-radius: 32px;
    background: #fff;
    color: #5b5b5b;
    font-weight: 500;
    letter-spacing: .2px;
    font-size: 14px
}

.my8 {
    margin: 8px 0 8px
}

.swiper.snb .swiper-slide a.on, .swiper.snb .swiper-slide button.on {
    border: 1px solid #ffb580;
    background: #fff0e5 !important;
    color: #FF6A00 !important
}

.swiper.p-snb {
    width: 100%;
    flex: 1 1 auto;
    position: absolute;
    left: 0;
    top: calc(100% + 1px);
    padding-top: 17px;
    overflow: visible;
    z-index: 90;
    display: none
}

#body_product .swiper.p-snb .swiper-wrapper {
    display: flex;
    justify-content: start;
    align-items: center
}

#body_product .swiper.p-snb .swiper-slide {
    flex: 0 0 fit-content
}

#body_product .swiper.p-snb .swiper-slide a, #body_product .swiper.p-snb .swiper-slide button {
    width: fit-content;
    flex: 0 0 fit-content;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    height: 44px;
    padding: 0 10px;
    border: 1px solid rgba(255, 255, 255, .34);
    border-radius: 44px;
    color: rgba(255, 255, 255, .7);
    font-weight: 500;
    white-space: nowrap;
    background: #013b60;
    overflow: hidden
}

#body_product .swiper.p-snb .swiper-slide a.on, #body_product .swiper.p-snb .swiper-slide a:hover, #body_product .swiper.p-snb .swiper-slide button.on, #body_product .swiper.p-snb .swiper-slide button:hover {
    border: 1px solid #fff;
    color: #fff
}

#body_product.scroll .swiper.p-snb .swiper-slide a, #body_product.scroll .swiper.p-snb .swiper-slide button {
    border: 1px solid #f7f7f7;
    color: #595959;
    background: #f7f7f7
}

#body_product.scroll .swiper.p-snb .swiper-slide a.on, #body_product.scroll .swiper.p-snb .swiper-slide a:hover, #body_product.scroll .swiper.p-snb .swiper-slide button.on, #body_product.scroll .swiper.p-snb .swiper-slide button:hover {
    border: 1px solid #171717;
    background: #171717;
    color: #fff
}

.swiper.btab {
    width: 100%;
    overflow: hidden;
    flex: 1 1 auto
}

.swiper.btab .swiper-wrapper {
    display: flex;
    justify-content: start;
    align-items: center
}

.swiper.btab .swiper-slide {
    flex: 0 0 fit-content
}

.swiper.btab .swiper-slide a, .swiper.btab .swiper-slide button {
    width: fit-content;
    flex: 0 0 fit-content;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 40px;
    padding: 0 16px;
    border-radius: 40px;
    background: #f7f7f7;
    color: #595959;
    font-weight: 400
}

.swiper.btab .swiper-slide a.on, .swiper.btab .swiper-slide button.on {
    background: #171717;
    color: #fff;
    font-weight: 700
}

.swiper.faqtab {
    width: 100%;
    overflow: hidden;
    flex: 1 1 auto
}

.swiper.faqtab .swiper-slide {
    flex: 0 0 fit-content
}

.swiper.faqtab .swiper-slide a, .swiper.faqtab .swiper-slide button {
    padding: 0 12px;
    height: 38px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 99px;
    background: #f2f2f2;
    color: #171717;
    font-size: 20px;
    font-style: normal;
    font-weight: 500
}

.swiper.faqtab .swiper-slide a.on, .swiper.faqtab .swiper-slide button.on {
    background: #404040;
    color: #fff;
    font-size: 20px;
    font-style: normal;
    font-weight: 500
}

#body_search, #body_search header {
    background: #fff
}

#body_search #footer {
    background: #f2f4f7;
    border-top: 1px solid #d5d7db
}

#wrapper_search {
    padding-bottom: 104px
}

#body_search main .cont_head.search {
    padding: 32px 0 20px
}

#body_search .tab-container {
    border-bottom: 1px solid rgba(0, 0, 0, .1)
}

#body_search .tab-container .swiper.lnb {
    margin: 0 auto;
    border-bottom: 0
}

#wrapper_search .swiper.s-tablist-3 {
    width: 100%;
    overflow: hidden;
    margin-top: 24px
}

#wrapper_search .swiper.s-tablist-3 .swiper-wrapper {
    display: flex;
    justify-content: start;
    align-items: center
}

#wrapper_search .swiper.s-tablist-3 .swiper-slide {
    flex: 0 0 fit-content
}

#wrapper_search .swiper.s-tablist-3 .swiper-slide a, #wrapper_search .swiper.s-tablist-3 .swiper-slide button {
    width: fit-content;
    flex: 0 0 fit-content;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #7b7b7b;
    font-size: 20px;
    font-weight: 500;
    padding: 0 12px
}

#wrapper_search .swiper.s-tablist-3 .swiper-slide a.on, #wrapper_search .swiper.s-tablist-3 .swiper-slide button.on {
    color: #fff;
    font-weight: 700;
    border-radius: 8px;
    background: #171717
}

#wrapper_search .board_main {
    margin: 32px 0
}

#wrapper_search .hd {
    padding: 12px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid #ebebeb;
    margin-bottom: 12px
}

#wrapper_search .hd .tit {
    flex: 0 0 fit-content;
    width: fit-content
}

#wrapper_search .hd .tit strong {
    color: #f57f20;
    font-weight: 600;
    display: inline-block;
    margin-left: 4px
}

#wrapper_search .hd .right {
    display: flex;
    gap: 16px
}

#wrapper_search .hd .right a {
    padding-left: 11px;
    color: #8e8e8e;
    letter-spacing: .2px;
    position: relative
}

#wrapper_search .hd .right a.on {
    color: #171717
}

#wrapper_search .hd .right a::before {
    content: '';
    width: 3px;
    height: 3px;
    position: absolute;
    background: #8e8e8e;
    border-radius: 3px;
    top: 50%;
    transform: translateY(-50%);
    left: 0
}

#wrapper_search .hd .right a.on::before {
    background: #ff6a00
}

#wrapper_search .bd .item {
    padding: 20px 0;
    border-bottom: 1px solid #f0f0f0
}

#wrapper_search .whead {
    color: #8c8c8c;
    font-size: 14px;
    font-weight: 400
}

#wrapper_search .whead img {
    display: inline-block;
    margin-bottom: 4px
}

#wrapper_search .whead * {
    display: inline-block;
    margin-right: 5px
}

#wrapper_search .whead strong {
    font-weight: 400;
    color: #595959
}

#wrapper_search .whead b {
    font-weight: 400;
    color: #f57e1f
}

#wrapper_search .bd .boxcon {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 32px;
    flex-wrap: nowrap
}

#wrapper_search .bd .boxtxt {
    flex: 1 1 auto
}

#wrapper_search .bd .boxtxt .ellipsis1 {
    color: #04c;
    font-size: 18px;
    font-weight: 400;
    line-height: 140%;
    margin: 12px 0 8px
}

#wrapper_search .bd .boxtxt .sub.ellipsis1 {
    color: #595959;
    margin: 0 0 8px
}

#wrapper_search .bd .boxtxt .graybox {
    padding: 16px 20px;
    border-radius: 8px;
    background: #f2f4f7
}

#wrapper_search .bd .boxtxt .graybox .stit.ellipsis1 {
    overflow: hidden;
    color: #595959;
    margin-bottom: 8px
}

#wrapper_search .bd .boxtxt .ellipsis1 strong {
    font-weight: 700
}

#wrapper_search .whead img.small {
    width: 20px
}

#wrapper_search .bd .boxtxt .ellipsis3 {
    color: #595959;
    font-weight: 400;
    margin-bottom: 8px
}

#wrapper_search .bd .boxtxt .ellipsis3 strong {
    font-weight: 700
}

#wrapper_search .bd .boximg {
    flex: 0 0 128px;
    width: 128px;
    height: 128px;
    overflow: hidden;
    border-radius: 8px;
    border: 1px solid #f0f0f0
}

#wrapper_search .bd .boximg img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

#wrapper_search .bd .item .boxcon.event .boxtxt {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 1 1 auto
}

#wrapper_search .bd .item .boxlimg {
    width: 184px;
    aspect-ratio: 184/104;
    flex: 0 0 184px;
    overflow: hidden;
    border-radius: 8px
}

#wrapper_search .bd .item .boxlimg img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

#wrapper_search .bd .item .dt {
    color: #8c8c8c;
    font-size: 14px;
    font-weight: 500
}

#wrapper_search .bd .item .part {
    margin: 12px 0 8px;
    display: flex;
    gap: 8px
}

#wrapper_search .bd .boxtxt .subject .ellipsis1.mt0 {
    margin: 0
}

#wrapper_search .bd .item .part span, .icon-sym {
    display: flex;
    width: fit-content;
    height: 20px;
    padding: 0 12px;
    justify-content: center;
    align-items: center;
    border-radius: 28px;
    background: #f0f0f0;
    color: #5b5b5b;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 600
}

#wrapper_search .bd .item .fbtn {
    margin-top: 16px;
    display: flex;
    width: 322px;
    max-width: 100%;
    height: 44px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    border: 1px solid #f57f20;
    background: #fff;
    color: #f57f20;
    font-weight: 600;
    white-space: nowrap
}

#wrapper_search .bd .item .cy {
    display: inline-flex;
    width: fit-content;
    padding: 2px 12px;
    margin-right: 8px;
    justify-content: center;
    align-items: center;
    border-radius: 22px;
    background: #3262a6;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .2px
}

#wrapper_search .bd .item .pr {
    display: inline-block;
    color: #171717;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .2px
}

#wrapper_search .bd .item .mt4 {
    margin-top: 4px
}

#wrapper_search .bd .item .area {
    display: inline-block;
    color: #5b5b5b;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .2px;
    padding-right: 4px
}

#wrapper_search .bd .item .hosp {
    display: inline-block;
    color: #171717;
    font-size: 14px;
    font-weight: 400;
    padding-left: 4px
}

#wrapper_search .bd .none {
    padding: 40px 0 120px;
    display: flex;
    flex-direction: column
}

#wrapper_search .bd .none .blankbox {
    width: 170px;
    height: 170px;
    flex-shrink: 0;
    background: #ededed
}

#wrapper_search .bd .none .boxtxt {
    padding: 20px 0
}

#wrapper_search .bd .none .dotli {
    color: #8e8e8e;
    letter-spacing: .2px;
    font-size: 14px;
    font-weight: 400
}

#wrapper_search .bd .none .dotli li {
    margin-bottom: 8px
}

#wrapper_search .bd .none .boxtxt p {
    color: #171717;
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 27px;
    letter-spacing: .2px
}

#wrapper_search .bd .none .boxtxt p strong {
    color: #f4361e;
    font-size: 18px;
    font-weight: 600
}

#wrapper_search .bd .none .dotli {
    color: #929292;
    font-weight: 400;
    line-height: 140%;
    margin-top: 8px
}

#body_mypage, #body_mypage header {
    background: #fff
}

#wrapper_mypage .wrap1280 {
    padding-bottom: 150px
}

#wrapper_mypage .swiper.snb .swiper-slide button {
    height: 38px;
    padding: 0 12px;
    border: 1px solid #f2f2f2;
    border-radius: 38px;
    background: #f2f2f2;
    color: #171717;
    font-size: 20px;
    font-weight: 500
}

#wrapper_mypage .swiper.snb .swiper-slide button.on {
    border: 1px solid #404040;
    background: #404040;
    color: #fff
}

#wrapper_mypage .list-board.m1 li:first-of-type {
    width: 40px;
    flex: 0 0 40px
}

#wrapper_mypage .list-board.m1 li:nth-of-type(2) {
    width: 100px;
    flex: 0 0 100px;
    justify-content: start
}

#wrapper_mypage .list-board.m1 li:nth-of-type(3) {
    width: auto;
    flex: 1 1 auto;
    justify-content: start
}

#wrapper_mypage .list-board.m1 li:nth-of-type(4) {
    width: 76px;
    flex: 0 0 76px
}

#wrapper_mypage .list-board.m1 li:nth-of-type(5) {
    width: 56px;
    flex: 0 0 56px
}

#wrapper_mypage .list-board.m1 li:nth-of-type(6) {
    width: 56px;
    flex: 0 0 56px
}

.list-board.m2 li:first-of-type {
    width: 100px;
    flex: 0 0 100px;
    justify-content: start
}

.list-board.m2 li:nth-of-type(2) {
    width: auto;
    flex: 1 1 auto;
    justify-content: start
}

.list-board.m2 li:nth-of-type(3) {
    width: 116px;
    flex: 0 0 116px
}

.list-board.m2 li:nth-of-type(4) {
    width: 76px;
    flex: 0 0 76px
}

.list-board.m2 li:nth-of-type(5) {
    width: 56px;
    flex: 0 0 56px
}

.list-board.m2 li:nth-of-type(6) {
    width: 56px;
    flex: 0 0 56px
}

/*#modal_home_points .modal_popup {*/
/*    top: 10%;*/
/*}*/

#modal_home_points .wrap-paging {
    margin-top: 20px;
}

#modal_home_points .no-data {
    padding: unset;
}

#modal_home_points .modal_inner {
    max-width: 100%;
    width: 880px;
    padding: 24px;
    background: #fff;
    border-radius: 16px;
    border: 1px solid #e9ebee
}

#modal_home_points .modal_inner h3 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--Text-Primary, #171717);
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .15px;
    margin-bottom: 24px
}

#modal_home_points #wrapper_mypage .title {
    padding-top: 20px;
    font-size: 20px;
    color: #171717;
    font-weight: 700;
}

#modal_home_points .w-list li {
    height: 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px
}

#modal_home_points .w-list li .mid {
    flex: 1;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_home_points .w-list li .right {
    flex: 0 0 fit-content;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
    color: silver;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_home_points .pagination-alt {
    margin-top: 14px;
}

#wrapper_mypage .list-board.m3 li:first-of-type {
    width: 108px;
    flex: 0 0 108px;
    justify-content: start
}

#wrapper_mypage .list-board.m3 li:nth-of-type(2) {
    width: auto;
    flex: 1 1 auto;
    justify-content: start
}

#wrapper_mypage .list-board.m3 li:nth-of-type(3) {
    width: 101px;
    flex: 0 0 101px
}

#wrapper_mypage .list-board.m3 li:nth-of-type(4) {
    width: 86px;
    flex: 0 0 86px
}

#wrapper_mypage .list-board.m3 li:nth-of-type(5) {
    width: 96px;
    flex: 0 0 96px
}

.cancellike {
    color: silver !important
}

#wrapper_mypage h2 {
    padding: 52px 0 12px
}

#wrapper_mypage .cont_main {
    padding-top: 20px
}

#wrapper_mypage .hd {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px
}

#wrapper_mypage .container-board {
    padding-top: 20px
}

#wrapper_mypage .boxbtn {
    padding: 11px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px
}

#wrapper_mypage .boxbtn div:first-of-type label {
    padding-left: 8px;
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .2px
}

#wrapper_mypage .list-board.m1.point li:nth-of-type(1) {
    width: 64px;
    flex: 0 0 64px;
}

#wrapper_mypage .list-board.m1.point li:nth-of-type(2) {
    width: 140px;
    flex: 0 0 140px;
    justify-content: center;
}

#wrapper_mypage .list-board.m1.point li:nth-of-type(3) {
    width: auto;
    flex: 1 1 auto;
    justify-content: start;
}

#wrapper_mypage .list-board.m1.point li:nth-of-type(4) {
    width: 146px;
    flex: 0 0 146px;
}

#wrapper_mypage .list-board.m1.point li:nth-of-type(5) {
    width: 146px;
    flex: 0 0 146px;
}


.mypage_banner {
    width: 100%;
    max-width: calc(100% - 1px);
    margin: 0 auto
}

.swiper.mypage_bottom_banner {
    width: 100%
}

.swiper.mypage_bottom_banner {
    width: 100%;
    overflow: hidden
}

.swiper.mypage_bottom_banner .swiper-slide {
    display: block;
    width: 100%;
    overflow: hidden
}

.swiper.mypage_bottom_banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center
}

.cs_banner {
    width: 100%;
    max-width: 100%;
    padding-top: 56px;
    margin: 0 auto 0
}

.swiper.cs_top_banner {
    width: 100%
}

.swiper.cs_top_banner {
    width: 100%;
    overflow: hidden
}

.swiper.cs_top_banner .swiper-slide {
    display: block;
    width: 100%;
    overflow: hidden
}

.swiper.cs_top_banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center
}

.grid-board {
    margin-top: 24px;
    display: grid;
    gap: 48px 30px;
    grid-template-columns:repeat(4, 1fr);
    width: 100%
}

.grid-board .item {
    overflow: hidden;
    min-width: 0
}

.grid-board .item .ele {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.preview-card {
    position: absolute;
    display: none;
    width: 330px;
    padding: 16px;
    flex-direction: column;
    flex-shrink: 0;
    border-radius: 12px;
    border: 1px solid var(--Line-Warm-Gray, #f0f0f0);
    background: var(--White, #fff);
    box-shadow: 0 4px 12px 0 rgba(0, 0, 0, .25);
    left: calc(100% + 14px);
    top: 0;
    z-index: 2
}

.table-calendar td:nth-of-type(6) .preview-card, .table-calendar td:nth-of-type(7) .preview-card {
    left: -14px;
    transform: translateX(-100%)
}

.preview-card.open {
    display: flex
}

.preview-card .wclose {
    display: flex;
    justify-content: right;
    margin-bottom: 16px
}

.preview-card .dt {
    margin-top: 12px;
    color: #8c8c8c;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .2px
}

.wrap-bbtn .dbtn {
    flex: 1;
    width: 100%;
    color: #171717;
    display: flex;
    height: 40px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: #fff;
    border: 1px solid #d5d7db;
    font-weight: 500;
    white-space: nowrap;
    letter-spacing: .2px
}

.grid-board .boximg, .preview-card .boximg {
    border-radius: 8px;
    border: 1px solid #f0f0f0;
    aspect-ratio: 298/168;
    overflow: hidden
}

.grid-board .boximg img, .preview-card .boximg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
    overflow: hidden
}

.wrap-bbtn {
    margin-top: 16px
}

.grid-board .dt {
    margin-top: 12px;
    color: #8c8c8c;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .2px
}

.grid-board .ellipsis2, .preview-card .ellipsis2 {
    margin-top: 16px;
    color: var(--Text-Primary, #171717);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: .2px
}

.grid-board .part, .preview-card .part {
    margin-top: 12px;
    display: flex;
    align-items: center;
    gap: 8px
}

#body_home .wrapper_main .sec_symp .boxtxt .part span, .grid-board .part span, .preview-card .part span {
    display: flex;
    width: fit-content;
    flex: 0 0 fit-content;
    padding: 0 12px;
    height: 20px;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    font-size: 12px;
    background: #f0f0f0;
    color: #5b5b5b;
    font-weight: 600;
    letter-spacing: .2px
}

.grid-board .btnapp {
    margin-top: 12px;
    display: flex;
    width: 100%;
    height: 44px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    border: 1px solid #f57f20;
    background: #fff;
    color: #f57f20;
    text-align: center;
    font-weight: 600
}

#wrapper_mypage.orderlist .cont_main {
    width: 816px;
    max-width: 100%;
    padding-top: 24px;
    margin: 0 auto
}

#wrapper_mypage.userinfo .cont_main {
    width: 816px;
    max-width: 100%;
    padding-top: 57px;
    margin: 0 auto
}

#wrapper_mypage.userinfo .cm_head {
    padding-bottom: 60px
}

#wrapper_mypage.userinfo .profile_wrapper {
    width: 120px;
    height: 120px;
    overflow: initial
}

#wrapper_mypage.userinfo .profile_wrapper .btn_wrap {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 40px;
    height: 40px;
    z-index: 3
}

#wrapper_mypage.userinfo .profile_wrapper .pbtn {
    width: 40px;
    height: 40px
}

#wrapper_mypage.userinfo .profile_wrapper .right {
    position: absolute;
    top: 0;
    left: 100%;
    padding-left: 12px;
    display: none
}

#wrapper_mypage.userinfo .profile_wrapper .btn_wrap:hover .right {
    display: block
}

#wrapper_mypage.userinfo .profile_wrapper .btn_list {
    display: flex;
    width: 96px;
    flex-direction: column;
    border-radius: 8px;
    border: 1px solid rgba(226, 226, 226, .93);
    box-shadow: 2px 2px 12px 0 rgba(0, 0, 0, .15);
    background: #fff;
    overflow: hidden
}

#wrapper_mypage.userinfo .profile_wrapper .btn_list button {
    display: flex;
    padding: 0 20px;
    height: 44px;
    width: 100%;
    justify-content: center;
    align-items: center;
    color: #171717;
    font-weight: 400
}

#wrapper_mypage.userinfo .profile_wrapper .btn_list li:nth-of-type(2) {
    border-top: 1px solid #eee
}

#wrapper_mypage.userinfo .profile_wrapper .btn_list li:nth-of-type(2) button {
    color: #f4361e
}

.form-wrapper label {
    display: block
}

.form-wrapper label div, form label div {
    position: relative
}

.form-wrapper h3 {
    color: #171717;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: .15px;
    padding-bottom: 14px;
    line-height: 56px
}

.form-wrapper .list-item {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding-bottom: 34px;
    margin-bottom: 34px
}

.form-wrapper .list-item:not(:last-of-type) {
    border-bottom: 1px solid rgba(221, 221, 221, .87)
}

#body_login header {
    border-bottom: 0
}

#body_login .login-first {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding-top: 80px
}

#body_login .form-wrapper .list-item:last-of-type {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: 0
}

#body_login .form-wrapper .select {
    color: #171717
}

#body_login .form-wrapper .select option[value=""] {
    color: #171717
}

.form-wrapper button {
    display: flex;
    width: fit-content;
    min-width: 112px;
    height: 40px;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    border: 1px solid #d5d7db;
    background: #fff;
    color: #171717;
    font-weight: 500;
    letter-spacing: .2px
}

.form-wrapper label > div.dt {
    color: #5b5b5b;
    font-size: 16px;
    font-weight: 500;
    padding-bottom: 8px;
    letter-spacing: .2px;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.form-wrapper label p {
    color: #5b5b5b;
    font-size: 16px;
    font-weight: 500;
    padding-bottom: 8px;
    letter-spacing: .2px
}

.form-wrapper label div.dt .chkbox span {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.form-wrapper .pspan {
    color: var(--Danger, #f4361e)
}

.form-wrapper .sgray {
    color: var(--Text-Tertiary, #8e8e8e);
    letter-spacing: .2px;
    font-size: 16px;
    font-style: normal;
    font-weight: 400
}

.form-wrapper .b_area {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 8px
}

.form-wrapper .b_area .left {
    flex: 1 1 auto
}

.form-wrapper .b_area .right {
    flex: 0 0 fit-content;
    width: fit-content
}

#body_loginform .find-passwd label div {
    margin-bottom: 24px
}

.mt32 {
    margin-top: 32px
}

#body_loginform .wrap-l-com strong {
    text-align: center;
    color: #171717;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .2px
}

#body_loginform .wrap-l-com {
    display: flex;
    flex-direction: column;
    gap: 24px;
    justify-content: center;
    align-items: center;
    color: var(--Text-Secondary, #5b5b5b);
    text-align: center;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.w320 {
    width: 320px !important
}

#body_loginform .box-login p.e-txt, .form-wrapper .e-txt {
    color: #f4361e;
    font-size: 14px;
    font-weight: 300;
    position: absolute;
    left: 0;
    top: calc(100% + 6px);
    z-index: 2
}

#body_loginform .box-login p.e-txt.based {
    color: #8e8e8e
}

.form-wrapper .e-txt.enable {
    color: #858585
}

.form-wrapper input.e-border {
    border: 1px solid #f4361e !important
}

.form-wrapper .e_area {
    display: flex;
    justify-content: space-between;
    align-items: end;
    color: var(--Text-Secondary, #5b5b5b);
    font-weight: 400;
    gap: 12px
}

.form-wrapper .e_area .cwrap {
    flex: 1;
    position: relative
}

.form-wrapper .e_area .mwrap {
    flex: 0;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center
}

.form-wrapper .e_area .cwrap .fit {
    width: 100%
}

.form-wrapper .e_area .cwrap .input_ehost {
    background-color: transparent
}

.form-wrapper .e_area .cwrap .sel_host {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    width: 100%
}

.form-wrapper .e_area .cwrap .select {
    width: 100%;
    height: 40px
}

.form-wrapper .pt {
    color: #393939;
    font-weight: 500
}

.mt10 {
    margin-top: 10px
}

.form-wrapper .exp {
    color: #8e8e8e;
    padding: 12px 0 0
}

.form-wrapper .wchk {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.form-wrapper .textbox {
    width: 100%;
    padding: 24px;
    border-radius: 16px;
    background: #f7f7f7
}

.form-wrapper .textbox > li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0 30px
}

.form-wrapper .textbox li > ul {
    padding: 12px 0;
    flex: 1
}

.form-wrapper .textbox .inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px
}

.form-wrapper .textbox .inner li:nth-of-type(odd) {
    white-space: nowrap;
    flex: 0 0 128px;
    color: var(--Text-Secondary, #5b5b5b);
    font-weight: 500;
    letter-spacing: .2px
}

.form-wrapper .textbox .inner li:nth-of-type(2n) {
    flex: 1;
    white-space: nowrap;
    color: var(--Text-Primary, #171717);
    font-weight: 400;
    letter-spacing: .2px
}

.form-wrapper .textbox .inner2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px
}

.form-wrapper .textbox .inner2 li:nth-of-type(odd) {
    white-space: nowrap;
    flex: 0 0 128px;
    color: var(--Text-Secondary, #5b5b5b);
    font-weight: 500;
    letter-spacing: .2px
}

.form-wrapper .textbox .inner2 li:nth-of-type(2n) {
    flex: 1;
    white-space: nowrap;
    color: var(--Text-Primary, #171717);
    font-weight: 400;
    letter-spacing: .2px
}

.form-wrapper .exp.t20 {
    padding-top: 20px
}

.form-wrapper .gridbox {
    display: grid;
    grid-template-columns:repeat(3, 1fr);
    gap: 9px;
    padding: 12px 0 0
}

.form-wrapper button.save {
    display: flex;
    width: 100%;
    height: 56px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: #ff6a00;
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: .2px
}

.form-wrapper button.save:disabled {
    background: #d9d9d9
}

#body_mypage .ul-order li {
    padding: 20px 8px 20px 0;
    border-bottom: 1px solid var(--Line-Cool-Gray, #e9ebee);
    position: relative
}

#body_mypage .ul-order li .bt {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 16px;
    position: relative
}

#body_mypage .ul-order li.nobd {
    border-bottom: none !important
}

#body_mypage .ul-order li .textbox {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 2px;
    flex: 1 1 auto;
    align-self: stretch;
    padding-right: 75px;
    margin-top: 5px
}

#body_mypage .ul-order li .imgbox {
    flex: 0 0 160px
}

#body_mypage .ul-order li .imgbox img {
    position: absolute;
    left: 0;
    top: 0;
    width: 160px;
    height: 160px;
    border-radius: 8px;
    border: 1px solid var(--Line-Warm-Gray, #f0f0f0);
    background: var(--BG-Cool-Gray, #f2f4f7);
    overflow: hidden;
    object-fit: cover
}

#body_mypage .ul-order .wb {
    margin: 12px 0 0 176px
}

.btn-delivery-tracking {
    width: 100%;
    display: flex;
    height: 44px;
    padding: 0 32px;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    border-radius: 8px;
    border: 1px solid var(--Line-Deep, #d5d7db)
}

#body_mypage .ul-order .view-order-detail {
    position: absolute;
    width: fit-content;
    right: 8px;
    top: 25px;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap
}

#body_mypage .ul-order .gsmall {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: .2px
}

#body_mypage .ul-order .ellipsis1 {
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .2px
}

#body_mypage .ul-order .price {
    color: var(--Text-Primary, #171717);
    font-weight: 600;
    letter-spacing: .2px
}

#body_mypage .ul-order .lb-event {
    display: flex;
    height: 20px;
    padding: 0 8px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    background: var(--Danger, #f4361e);
    color: var(--White, #fff);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .2px
}

#body_mypage .ul-order.pop li .imgbox {
    flex: 0 0 96px
}

#body_mypage .ul-order.pop li .imgbox img {
    position: absolute;
    left: 0;
    top: 0;
    width: 104px;
    height: 104px;
    border-radius: 8px;
    border: 1px solid var(--Line-Warm-Gray, #f0f0f0);
    background: var(--BG-Cool-Gray, #f2f4f7);
    overflow: hidden;
    object-fit: cover
}

#body_mypage .ul-order.pop .price {
    text-decoration: line-through;
    color: #8e8e8e;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#body_mypage .ul-order.pop strong {
    color: var(--Danger, #f4361e);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

#body_mypage .ul-order.pop b {
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

#body_mypage .ul-order.pop li .textbox {
    padding-right: 0;
    margin-top: 0
}

#body_mypage .ul-order.pop .wb {
    margin: 10px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px
}

#body_mypage .ul-order.pop li {
    border-bottom: 0
}

#wrapper_product {
    padding: 0;
    position: relative
}

#wrapper_product .bg-dark, #wrapper_product .bg-gray, #wrapper_product .bg-light {
    overflow-x: hidden
}

#wrapper_product .bg-dark {
    background: linear-gradient(90deg, #012a4a 0, #003d63 36.67%, #00243e 100%);
    color: #fff;
    position: relative
}

#wrapper_product .bg-dark h2 {
    color: #fff;
    font-size: 64px;
    font-weight: 800;
    line-height: 130%;
    padding: 5px 0 54px
}

#wrapper_product .bg-dark strong {
    color: #fff;
    font-size: 36px;
    font-weight: 500;
    line-height: 130%
}

#wrapper_product .bg-dark p {
    color: #fff;
    font-size: 24px;
    font-weight: 500;
    opacity: .7
}

#wrapper_product .bg-dark small {
    color: #fff;
    font-size: 20px;
    font-weight: 500;
    opacity: .7
}

#wrapper_product .bg-dark h3 {
    color: #fff;
    font-size: 40px;
    font-weight: 800;
    line-height: 130%
}

#wrapper_product .bg-dark .sec_1 .wrap1280 > div {
    padding: 355px 0 184px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
    flex-wrap: wrap
}

#wrapper_product .bg-dark .sec_2 {
    background: url(/assets/images/product/bg_1.png) no-repeat center bottom/cover
}

#wrapper_product .bg-dark .sec_2 .wrap1280 > div {
    padding: 82px 0 101px;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 30px;
    flex-wrap: wrap
}

#wrapper_product .bg-dark .sec_1 .left {
    flex: 0 0 fit-content
}

#wrapper_product .bg-dark .sec_1 .right {
    flex: 1 1 auto;
    max-width: 636px;
    max-height: 537px;
    width: 100%
}

#wrapper_product .bg-dark .sec_1 .right img {
    width: 100%;
    height: 100%;
    object-fit: contain
}

#wrapper_product .bg-dark .sec_2 .left {
    flex: 0 0 39.7%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    border-radius: 20px;
    background: rgba(255, 255, 255, .15);
    backdrop-filter: blur(20px);
    padding: 50px
}

#wrapper_product .bg-dark .sec_2 .left .imgbox {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1
}

#wrapper_product .bg-dark .sec_2 .right {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 40px;
    justify-content: space-between;
    align-items: center;
    height: 100%
}

#wrapper_product .bg-dark .sec_2 .right > div {
    border-radius: 20px;
    background: rgba(255, 255, 255, .15);
    backdrop-filter: blur(20px);
    padding: 50px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 70px
}

#wrapper_product .bg-dark .sec_2 .right .imgbox {
    flex: 0 0 fit-content
}

#wrapper_product .bg-dark .sec_2 h3 {
    padding: 8px 0 28px
}

#wrapper_product .bg-light {
    padding-bottom: 333px
}

#wrapper_product .bg-light .wrap1280 > div {
    margin-top: 333px
}

#wrapper_product .bg-gray small, #wrapper_product .bg-light small {
    color: #f57f20;
    font-size: 28px;
    font-weight: 700;
    line-height: 130%
}

#wrapper_product .bg-light .sec1 .imgbox {
    margin-bottom: 146px
}

#wrapper_product .bg-gray h3, #wrapper_product .bg-light h3 {
    color: #444;
    font-size: 64px;
    font-weight: 800;
    line-height: 130%;
    padding: 8px 0 32px
}

#wrapper_product .bg-gray h3, #wrapper_product .bg-gray small, #wrapper_product .bg-light .sec1 h3, #wrapper_product .bg-light .sec1 small {
    display: block;
    text-align: center
}

#wrapper_product .bg-gray {
    padding: 112px 0 0;
    background: #f5f7fa;
    overflow: hidden
}

#wrapper_product .bg-gray h3 {
    padding-bottom: 0
}

#wrapper_product .bg-light p {
    color: #888;
    font-size: 28px;
    font-weight: 500
}

#wrapper_product .bg-gray dt {
    color: #444;
    font-size: 40px;
    font-weight: 800;
    line-height: 130%
}

#wrapper_product .bg-gray .name {
    color: #979ec2;
    font-size: 24px;
    font-weight: 700;
    line-height: 130%;
    padding: 12px 0 28px
}

#wrapper_product .bg-gray p {
    color: #5f5f5f;
    font-size: 24px;
    font-weight: 500
}

#wrapper_product .bg-gray .review {
    padding: 128px 0 0
}

#wrapper_product .bg-light .sec1 .imgbox img {
    margin: 0 auto
}

#wrapper_product .bg-light .sec1 p {
    margin: 0 auto;
    max-width: 570px
}

#wrapper_product .bg-light .sec2, #wrapper_product .bg-light .sec3 {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    max-height: 74vh;
    height: 805px;
    gap: 6.1vw
}

#wrapper_product .bg-light .sec3 {
    flex-direction: row-reverse
}

#wrapper_product .bg-light .sec2 .left, #wrapper_product .bg-light .sec3 .left {
    flex: 0 0 44.5%;
    display: flex;
    justify-content: center;
    align-items: center
}

#wrapper_product .bg-light .sec2 .right, #wrapper_product .bg-light .sec3 .right {
    flex: 1;
    position: relative
}

#wrapper_product .bg-light .sec2 .imgbox, #wrapper_product .bg-light .sec3 .imgbox {
    width: 100%;
    height: 100%;
    position: relative
}

#wrapper_product .bg-light .sec2 img, #wrapper_product .bg-light .sec3 img {
    max-width: initial;
    height: 100%;
    width: auto;
    position: absolute;
    display: block;
    left: 0;
    top: 0
}

#wrapper_product .bg-light .sec3 img {
    left: initial;
    right: 0
}

#wrapper_product .bg-gray .review.swiper {
    overflow: visible
}

#wrapper_product .bg-gray .review > ul {
    display: flex;
    align-items: stretch
}

#wrapper_product .bg-gray .review > ul .list-item {
    height: auto !important;
    padding: 40px;
    border-radius: 20px;
    background: #fff;
    box-shadow: 2px 2px 16px 0 rgba(12, 48, 101, .1);
    width: 562px;
    flex: 0 0 562px
}

#wrapper_product .mypage_banner {
    padding-top: 116px
}

#wrapper_cs, #wrapper_edge, #wrapper_egd, #wrapper_esti {
    padding-bottom: 60px
}

#body_edge h2 {
    padding: 40px 0 108px;
    color: #393939;
    font-size: 48px;
    font-style: normal;
    font-weight: 700
}

#wrapper_cs h2, #wrapper_egd h2, #wrapper_esti h2 {
    padding: 110px 0 12px;
    color: #171717;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: .2px
}

.pb24 {
    padding-bottom: 24px
}

.wrap-board-head {
    margin: 24px 0 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid #e9ebee;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px
}

.wrap-comm .wrap-board-head {
    margin: 0;
    padding-bottom: 24px;
    border-bottom: 1px solid #d6d8dc;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px
}

.wrap-board-head.tabs {
    justify-content: start;
    gap: 62px
}

.ttal, .wrap-board-head .left {
    color: #171717;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .2px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    flex: 1
}

#body_cnc .wrap-board-head .left > * {
    flex: 1
}

#body_cnc .wrap-board-head .left .select {
    width: 100%
}

.mb0 {
    margin-bottom: 0 !important
}

.ttal {
    padding: 24px 0
}

.ttal .num, .wrap-board-head .left .num {
    color: #ff6a00;
    flex: 1
}

.wrap-board-head .right label {
    color: #5b5b5b;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.wrap-board-head .right {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    max-width: 100%;
    flex: 0 0 fit-content;
    width: fit-content
}

.wrap-board-head .right label {
    max-width: 100%
}

.wrap-board-head .select {
    /*background-image: url(/assets/images/board/sel_down.svg);*/
    min-width: initial;
    /*color: #5b5b5b;*/
    /*font-size: 16px;*/
    font-weight: 400
}

.wrap-board-head label .period {
    position: relative
}

.wrap-board-head .period {
    min-width: 160px;
    max-width: 100%;
    width: 260px;
    cursor: pointer
}

.wrap-board-head .part {
    width: 125px
}

.input-search {
    padding: 0 52px 0 16px;
    width: 360px;
    max-width: 100%;
    height: 40px;
    /*background: url(/assets/images/icon_search.svg) no-repeat right 16px center;*/
    display: flex;
    justify-content: center;
    align-items: center;
    color: #171717;
    border-radius: 8px;
    border: 1px solid #d6d8dc
}

.input-search + button {
    position: absolute;
    width: 52px;
    height: 44px;
    opacity: 0;
    right: 0;
    top: 0
}

.container-board .wrap-board-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 24px
}

.container-board .wrap-board-bottom > div:first-of-type {
    flex: 0
}

.container-board .wrap-board-bottom > div:last-of-type {
    flex: 1
}

.container-board .wrap-board-bottom > div:last-of-type .input-search {
    width: 100%
}

.container-board .wrap-board-bottom .select {
    width: 115px;
    min-width: 0;
    max-width: 100%
}

.form-wrapper input[type=date][readonly], .form-wrapper input[type=email][readonly], .form-wrapper input[type=number][readonly], .form-wrapper input[type=password][readonly], .form-wrapper input[type=search][readonly], .form-wrapper input[type=tel][readonly], .form-wrapper input[type=text][readonly], .form-wrapper input[type=url][readonly] {
    border: 1px solid #d5d7db !important;
    background: #f0f0f0 !important;
    color: #8e8e8e !important
}

.container-board input[type=date], .container-board input[type=email], .container-board input[type=number], .container-board input[type=password], .container-board input[type=search], .container-board input[type=tel], .container-board input[type=text], .container-board input[type=url] {
    padding: 0 16px;
    width: 285px;
    max-width: 100%;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #5b5b5b;
    border-radius: 8px;
    border: 1px solid #d6d8dc
}

.container-board .btnblack {
    display: flex;
    padding: 0 18.5px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: #505050;
    color: #fff;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    width: fit-content;
    height: 44px
}

.wrap-board-head .wsbm {
    position: relative;
    max-width: 100%
}

.wrap-board-head .wsbm .btnsubmit {
    position: absolute;
    width: 52px;
    height: 40px;
    right: 0;
    top: 0
}

.wrap-board-head .label-period {
    position: relative
}

.wrap-board-head .pop-period {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    width: 330px;
    border-radius: 8px;
    border: 1px solid #ddd;
    box-shadow: 2px 2px 12px 0 rgba(0, 0, 0, .25);
    background: #fff;
    display: none;
    z-index: 1
}

.wrap-board-head .pop-period li {
    cursor: pointer;
    padding: 10px;
    color: #171717;
    font-size: 16px;
    font-weight: 500;
    line-height: 150%;
    background: #fff
}

.wrap-board-head .pop-period li.on, .wrap-board-head .pop-period li:focus, .wrap-board-head .pop-period li:hover {
    color: #f57f20;
    background: #fff1e6
}

.wrap-board-head .pop-period li .inp {
    margin-top: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 4px
}

.wrap-board-head .pop-period li.date {
    border-top: 1px solid #ddd
}

.wrap-board-head .pop-period li.date p {
    color: #171717
}

.wrap-board-head .pop-period li .inp input {
    display: flex;
    width: 120px;
    height: initial;
    border-radius: 0;
    padding: 2px 6px;
    justify-content: left;
    align-items: center;
    color: #171717;
    border: 1px solid #ddd
}

.wrap-board-head .pop-period li .inp label {
    position: relative
}

.wrap-board-head .pop-period li .inp button {
    display: flex;
    width: 60px;
    padding: 2px 6px;
    justify-content: center;
    align-items: center;
    background: #6c6c6c;
    color: #fff
}

.wrap-gridboard-cs1 .slist {
    display: grid;
    gap: 48px 21px;
    grid-template-columns:repeat(4, 1fr);
    margin-bottom: 28px;
    position: relative
}

@media (max-width: 1280px) {
    .wrap-gridboard-cs1 .slist {
        grid-template-columns:repeat(3, 1fr) !important
    }
}

@media (max-width: 960px) {
    .wrap-gridboard-cs1 .slist {
        grid-template-columns:repeat(2, 1fr) !important
    }
}

@media (max-width: 560px) {
    .wrap-gridboard-cs1 .slist {
        grid-template-columns:repeat(1, 1fr) !important
    }
}

.wrap-gridboard-cs1 .item {
    overflow-x: hidden;
    width: 100%;
    max-width: 100%
}

.wrap-gridboard-cs1 .item:nth-of-type(5)::after {
    content: '';
    position: absolute;
    display: block;
    left: 0;
    top: 50%;
    width: 100%;
}

.wrap-gridboard-cs1 .boximg {
    width: 100%;
    aspect-ratio: 292/164;
    border-radius: 8px;
    overflow: hidden;
    background: #f0f0f0;
    border: 1px solid #f0f0f0 !important;
}

.wrap-gridboard-cs1 .boximg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.wrap-gridboard-cs1 .boximg strong {
    display: block;
    width: fit-content;
    height: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #a5abdd;
    font-family: "Gmarket Sans";
    font-size: 14px;
    font-weight: 500;
    line-height: 130%;
    background: #fff;
    border-radius: 22px;
    padding: 3px 8px 1px;
    white-space: nowrap
}

.wrap-gridboard-cs1 .item:nth-child(4n+3) .boximg strong {
    color: #85bfd4
}

.wrap-gridboard-cs1 .boximg.m2 {
    background: #b4dda5
}

.wrap-gridboard-cs1 .boximg.m2 strong {
    color: #b4dda5
}

.wrap-gridboard-cs1 .item:nth-child(4n+2) .boximg.m2 {
    background: #a5abdd
}

.wrap-gridboard-cs1 .item:nth-child(4n+2) .boximg.m2 strong {
    color: #a5abdd
}

.wrap-gridboard-cs1 .item:nth-child(4n+3) .boximg.m2 {
    background: #85bfd4
}

.wrap-gridboard-cs1 .item:nth-child(4n+3) .boximg.m2 strong {
    color: #85bfd4
}

.wrap-gridboard-cs1 .item .borderimg {
    width: 100%;
    aspect-ratio: 308/176;
    overflow: hidden;
    border-radius: 12px;
    border: 1px solid #d6d8dc
}

.wrap-gridboard-cs1 .item .borderimg img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.wrap-gridboard-cs1 .boximg p {
    width: 147px;
    height: 78px;
    color: #fff;
    font-family: "Gmarket Sans";
    font-size: 20px;
    font-weight: 500;
    line-height: 130%;
    margin-top: 10px;
    word-break: keep-all;
    word-wrap: break-word;
    overflow: hidden
}

.wrap-gridboard-cs1 .title {
    margin: 16px 0 8px;
    font-size: 18px;
    font-weight: 600;
    /*height: 52px;*/
    color: #171717;
    letter-spacing: .2px
}

.wrap-gridboard-cs1 .count_time {
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .2px
}

.wrap-gridboard-cs1 .count_time2 {
    color: var(--Text-Tertiary, #5b5b5b);
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .2px
}

.wrap-gridboard-cs1 .sm {
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .2px
}

.wrap-gridboard-cs1 .sm2 {
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .2px
}

.wrap-gridboard-cs1 .sm span:last-of-type {
    margin-left: 12px
}

.wrap-gridboard-cs1 .boxtxt .fb {
    display: flex;
    gap: 5px;
    justify-content: space-between;
    align-items: center
}

.wrap-gridboard-cs1 .boxtxt .ahf {
    display: flex;
    gap: 8px;
    align-items: center;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.wrap-gridboard-cs1 .boxtxt .hos {
    color: var(--Text-Primary, #171717)
}

.wrap-board-title {
    border-top: 1px solid #e9ebee;
    border-bottom: 1px solid #e9ebee;
    padding: 24px 0
}

.wrap-board-title.mt48 {
    margin-top: 48px
}

.wrap-board-title .flex {
    display: flex;
    justify-content: start;
    align-items: center
}

.wrap-board-title .flex .left, .wrap-board-title .flex .mid {
    color: #acacac;
    font-size: 20px;
    font-weight: 500;
    flex: 0 0 138px;
    width: 138px;
    padding: 10px
}

.wrap-board-title .flex {
    flex: 1 1 auto
}

.wrap-board-title .txp {
    margin-top: 0;
    margin-bottom: 10px
}

.txp .left, .txp .right {
    display: flex;
    align-items: center;
    gap: 8px
}

.line-orange {
    border: 1px solid #ffb580 !important;
    background: #fff !important;
    color: #ff6a00 !important
}

.wrap-board-title .exp, .wrap-board-title .txp {
    display: flex;
    gap: 16px;
    color: #8e8e8e;
    margin-top: 10px;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    justify-content: space-between;
    align-items: center
}

.wrap-board-title .exp .left, .wrap-board-title .exp .right {
    display: flex;
    color: #C0C0C0;
    gap: 8px;
    align-items: center;
    font-size: 14px;
    letter-spacing: .2px
}

.wrap-board-title .exp .left .postViews {
    padding-left: 15px
}

.wrap-board-title .exp .right.gr {
    color: var(--Text-Disabled, silver);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.wrap-board-title .exp .left {
    color: #5b5b5b;
    font-size: 16px;
    letter-spacing: .2px
}

.wrap-board-title .exp .left > div:first-of-type {
    color: #5b5b5b;
    font-size: 16px;
    letter-spacing: .2px
}

.wrap-board-title .exp .left > div:last-of-type {
    color: #8e8e8e;
    font-size: 16px;
    letter-spacing: .2px
}

.wrap-board-title .title {
    color: #171717;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: .15px
}

.wrap-btn-list {
    display: flex;
    padding: 24px 0;
    justify-content: space-between;
    align-items: center
}

.cont_main .wrap-btn-list.only-mobile {
    display: none
}

.nonborder {
    border: 0
}

.wrap-btn-list .left, .wrap-btn-list .right {
    display: flex;
    gap: 8px
}

.btn-go-delete, .btn-go-list, .btn-go-modify, .btn-go-next, .btn-go-prev, .btn-go-pull-up, .btn-go-top {
    display: flex;
    height: 40px;
    padding: 0 20px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    border: 1px solid var(--Line-Deep, #d5d7db);
    background: var(--White, #fff);
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.btn-go-write {
    display: flex;
    height: 40px;
    padding: 0 20px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    border-radius: 8px;
    background: var(--BG-Cool-Gray, #f2f4f7)
}

.btn-go-list:disabled img, .btn-go-list:disabled span, .btn-go-next:disabled img, .btn-go-next:disabled span, .btn-go-prev:disabled img, .btn-go-prev:disabled span {
    opacity: .2715
}

.wrap-board-contents .wrap-board-answer {
    padding: 20px 40px;
    border-top: 0
}

.wrap-board-contents .wrap-contents {
    margin: 24px 0 48px;
    width: 100%;
    overflow: hidden;
    color: #171717;
    font-family: Pretendard;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    /*line-height: 150%*/
}

.wrap-board-contents .wrap-contents2 {
    padding: 48px 0
}

.wrap-board-contents .wrap-contents2 .topbox {
    padding: 40px;
    border-radius: 16px;
    border: 1px solid var(--Line-Warm-Gray, #f0f0f0);
    background: var(--BG-Warm-Gray, #f7f7f7);
    display: flex;
    gap: 113px;
    justify-content: space-between;
    align-items: start
}

.wrap-board-contents .wrap-contents2 .topbox .left {
    flex: 0 0 270px;
    width: 270px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    color: var(--Text-Primary, #171717);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    text-align: center
}

.wrap-board-contents .wrap-contents2 .topbox .left button {
    margin: 0 auto;
    height: 32px;
    padding: 0 16px;
    border-radius: 6px;
    border: 1px solid var(--Line-Deep, #d5d7db);
    background: var(--White, #fff);
    color: var(--Text-Primary, #171717);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.wrap-board-contents .wrap-contents2 .topbox .left img {
    border: 1px solid var(--Line-Cool-Gray, #e9ebee);
    background: var(--White, #fff);
    width: 100%;
    aspect-ratio: 270/150;
    object-fit: cover
}

.wrap-board-contents .wrap-contents2 .topbox .right {
    flex: 1;
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 36px
}

.wrap-board-contents .wrap-contents2 .topbox .right > ul {
    display: flex;
    flex-direction: column;
    gap: 20px;
    flex: 1
}

.wrap-board-contents .wrap-contents2 .topbox .right .dt {
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px;
    flex: 0 0 96px
}

.wrap-board-contents .wrap-contents2 .topbox .right .rleft > li, .wrap-board-contents .wrap-contents2 .topbox .right .rright > li {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 0
}

.wrap-board-contents .wrap-contents2 .topbox .right .rleft .dd {
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    flex: 1
}

.wrap-board-contents .wrap-contents2 .topbox .right small {
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 12px;
    font-style: normal;
    font-weight: 400
}

.wrap-board-contents .wrap-contents2 .topbox .right .rright .dd {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    flex: 1
}

.wrap-board-contents .wrap-contents2 .topbox .rright .dd > ul {
    display: flex;
    flex-direction: column;
    gap: 4px
}

.wrap-board-contents .wrap-contents2 .topbox .rright .dd > ul > li {
    display: flex;
    justify-content: space-between
}

.wrap-board-contents .wrap-contents2 .topbox .sb {
    flex: 0 0 52px
}

.wrap-board-contents .wrap-contents2 .topbox .sc {
    flex: 1
}

.wrap-board-contents .wrap-contents2 .botbox {
    padding: 64px 0;
    display: flex;
    gap: 103px;
    justify-content: space-between;
    align-items: start
}

.wrap-board-contents .wrap-contents2 .botbox .left {
    flex: 0 0 270px;
    width: 270px
}

.wrap-board-contents .wrap-contents2 .botbox .left .itop img {
    aspect-ratio: 270/152;
    object-fit: cover;
    border: 1px solid var(--Line-Cool-Gray, #e9ebee);
    background: var(--White, #fff)
}

.wrap-board-contents .wrap-contents2 .botbox .left .iflex {
    margin-top: 12px
}

.wrap-board-contents .wrap-contents2 .botbox .left .iflex img {
    aspect-ratio: 131/96;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid var(--Line-Warm-Gray, #f0f0f0);
    background: var(--BG-Cool-Gray, #f2f4f7)
}

.wrap-board-contents .wrap-contents2 .botbox .left .cnc-thumb-img .swiper-slide {
    width: calc(50% - 4px)
}

.wrap-board-contents .wrap-contents2 .botbox .right {
    flex: 1
}

.wrap-board-contents .wrap-contents2 .botbox .right > ul {
    display: flex;
    flex-direction: column;
    gap: 16px;
    justify-content: start;
    align-items: stretch
}

.wrap-board-contents .wrap-contents2 .botbox .right > ul > li {
    display: flex;
    justify-content: space-between;
    align-items: start
}

.wrap-board-contents .wrap-contents2 .botbox .right .dt {
    flex: 0 0 240px;
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.wrap-board-contents .wrap-contents2 .botbox .right .dd {
    flex: 1;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.wrap-board-contents .wrap-contents2 .textbox {
    padding: 64px 0;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    border-bottom: 1px solid #e9ebee
}

.wrap-board-contents .wrap-contents2 .bgraybox {
    padding: 24px;
    border-radius: 12px;
    background: var(--BG-Cool-Gray, #f2f4f7);
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.noborder {
    border: 0 !important
}

.noborder-top {
    border-top: 0 !important
}

.noborder-bottom {
    border-bottom: 0 !important
}

.pb0 {
    padding-bottom: 0 !important
}

.wrap-board-contents .rebox {
    padding: 24px 32px;
    border-radius: 16px;
    border: 1px solid var(--Line-Deep, #d5d7db)
}

.wrap-board-contents .wrap-contents li {
    position: relative;
    padding-left: 1.5em
}

.wrap-board-contents .wrap-contents li::after {
    content: '';
    position: absolute;
    width: 3px;
    height: 3px;
    border-radius: 3px;
    background-color: #171717;
    left: calc((1.5em - 3px) / 2);
    top: calc((1.5em - 3px) / 2)
}

.wrap-board-contents .wrap-contents img {
    max-width: 100%;
    margin: 10px 0 10px
}

.wrap-board-contents .wrap-contents.qa {
    min-height: 572px;
    color: #171717;
    font-size: 20px;
    font-weight: 400;
    line-height: 150%
}

.wrap-board-contents .wrap-contents.qa img {
    max-width: 80%;
    margin: 20px 0
}

.wrap-board-contents .wrap-contents.qa2 {
    margin: 40px;
    min-height: 572px;
    font-size: 20px;
    font-weight: 400;
    line-height: 150%
}

.wrap-board-contents .wrap-contents.qa2 img {
    max-width: 80%;
    margin: 40px 0
}

.pd0 {
    padding: 0 !important
}

.wrap-board-attach {
    padding: 24px 0 0
}

.wrap-board-attach dt {
    color: #171717;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    display: flex;
    justify-content: right;
    align-items: center;
    gap: 4px;
    margin-bottom: 8px
}

.wrap-board-attach dt span {
    color: #8e8e8e
}

.wrap-board-attach ul {
    color: #5b5b5b;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    padding: 16px;
    border-radius: 8px;
    border: 1px solid #d5d7db
}

.wrap-board-attach ul .list-file {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    padding: 4px 0
}

.btn-download {
    display: flex;
    width: 130px;
    padding-left: 22px;
    height: 34px;
    align-items: center;
    gap: 10px;
    border-radius: 4px;
    border: 1px solid #c4c4c4;
    color: #171717;
    font-size: 16px;
    font-weight: 500;
    background: url(/assets/images/board/icon_down.svg) no-repeat right 22px top 7px
}

.filename {
    display: flex;
    justify-content: start;
    align-items: center;
    width: fit-content;
    min-width: 0;
    max-width: 100%
}

.filename .ellipsis1 {
    flex: 1 1 auto;
    width: fit-content
}

.filename > :not(:first-of-type) {
    flex: 0 0 fit-content;
    width: fit-content
}

.filename .btn-download {
    margin-left: 40px
}

.wrap-board-dt-btn {
    padding: 40px 0 0
}

.wrap-board-dt-btn button {
    display: flex;
    width: 480px;
    height: 56px;
    max-width: 100%;
    padding: 0 10px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    border: 1px solid #c4c4c4;
    color: #171717;
    font-size: 24px;
    font-weight: 500;
    margin: 0 auto
}

.wrap-board-tablist {
    margin-top: 10px
}

.wrap-board-head.nbd {
    border-bottom: 0;
    padding-bottom: 0
}

.wrap-board-head.nbd2 {
    border-bottom: 0;
    padding-bottom: 0;
    margin: 20px 0
}

#body_cs .list-board.cs1 li:first-of-type {
    width: 64px;
    flex: 0 0 64px;
    justify-content: center
}

#body_cs .list-board.cs1 li:nth-of-type(2) {
    width: 100px;
    flex: 0 0 100px;
    justify-content: start
}

#body_cs .list-board.cs1 li:nth-of-type(3) {
    width: auto;
    flex: 1 1 auto;
    justify-content: start
}

#body_cs .list-board.cs1 li:nth-of-type(4) {
    width: 76px;
    flex: 0 0 76px
}

#body_cs .list-board.cs1 li:nth-of-type(5) {
    width: 56px;
    flex: 0 0 56px
}

.w200 {
    width: 200px !important
}

.w360 {
    width: 360px !important
}

.w370 {
    width: 370px !important
}

.wrap-board-head button.reset {
    display: flex;
    justify-content: right;
    align-items: center;
    width: 104px;
    padding: 0 20px;
    height: 40px;
    border-radius: 8px;
    border: 1px solid var(--Line-Deep, #d5d7db);
    background: #fff url(/assets/images/board/reset.svg) no-repeat left 16px center;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#body_cs .list-board.cs2 li:first-of-type {
    width: 68px;
    flex: 0 0 68px;
    justify-content: center
}

#body_cs .list-board.cs2 li:nth-of-type(2) {
    width: 100px;
    flex: 0 0 100px;
    justify-content: center
}

#body_cs .list-board.cs2 li:nth-of-type(3) {
    width: auto;
    flex: 1 1 auto;
    justify-content: start
}

#body_cs .list-board.cs2 li:nth-of-type(4) {
    width: 76px;
    flex: 0 0 76px;
    justify-content: right !important
}

#body_cs .list-board.cs3 li:first-of-type {
    width: 64px;
    flex: 0 0 64px;
    justify-content: center
}

#body_cs .list-board.cs3 li:nth-of-type(2) {
    width: 100px;
    flex: 0 0 100px;
    justify-content: center
}

#body_cs .list-board.cs3 li:nth-of-type(3) {
    width: auto;
    flex: 1 1 auto;
    justify-content: start
}

#body_cs .list-board.cs3 li:nth-of-type(4) {
    width: 76px;
    flex: 0 0 76px;
    justify-content: center
}

#body_cs .list-board.cs3 li:nth-of-type(5) {
    width: 56px;
    flex: 0 0 56px;
    justify-content: center
}

.container-board .complete {
    color: #04c !important
}

.container-board .planned {
    color: #5b5b5b !important
}

#wrapper_cs .wrapper-comm-contents {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 30px;
    margin-top: 24px
}

#wrapper_cs .wrap-comm .cont_menu {
    flex: 0 0 182px;
    width: 182px
}

.pt126 {
    padding-top: 126px
}

.pt122 {
    padding-top: 112px
}

#wrapper_cs .wrap-comm .cont_main {
    flex: 1 1 auto;
    width: auto
}

#wrapper_cs .wrap-comm .cont_main .wrap-board-head, #wrapper_cs .wrap-comm .cont_main .wrap-board-head.mt60 {
    padding-top: 0
}

#wrapper_cs .wrap-comm .cont_banner {
    flex: 0 0 182px;
    width: 182px
}

#wrapper_cs .list-board.cs4 li:first-of-type {
    width: 100px;
    flex: 0 0 100px;
    justify-content: start
}

#wrapper_cs .list-board.cs4 li:nth-of-type(2) {
    width: auto;
    flex: 1 1 auto;
    justify-content: start
}

#wrapper_cs .list-board.cs4 li:nth-of-type(3) {
    width: 116px;
    flex: 0 0 116px;
    justify-content: start
}

#wrapper_cs .list-board.cs4 li:nth-of-type(4) {
    width: 76px;
    flex: 0 0 76px
}

#wrapper_cs .list-board.cs4 li:nth-of-type(5) {
    width: 56px;
    flex: 0 0 56px
}

#wrapper_cs .list-board.cs4 li:nth-of-type(6) {
    width: 56px;
    flex: 0 0 56px
}

#wrapper_cs .list-board.cs5 dd {
    height: 94px
}

#wrapper_cs .list-board.cs5 .titleimg {
    width: 96px;
    height: 70px;
    overflow: hidden;
    flex: 0 0 96px
}

#wrapper_cs .list-board.cs5 .titleimg img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

#wrapper_cs .list-board.cs5 .title {
    flex: 1 1 auto;
    width: auto
}

#wrapper_cs .list-board.cs5 .gtext {
    margin-top: 8px;
    color: #8e8e8e;
    font-size: 14px;
    font-style: normal;
    font-weight: 400
}

#wrapper_cs .list-board.cs5 li:first-of-type {
    width: 100px;
    flex: 0 0 100px;
    justify-content: start
}

#wrapper_cs .list-board.cs5 li:nth-of-type(2) {
    width: auto;
    flex: 1 1 auto;
    justify-content: start;
    display: flex;
    gap: 20px;
    align-items: center
}

#wrapper_cs .list-board.cs5 li:nth-of-type(3) img {
    width: 100%;
    height: auto;
    min-height: 100px;
    object-fit: cover;
    border-radius: 9px;
    border: 1px solid #f0f0f0;
    background: #f2f4f7;
    /* Safari 호환을 위해 aspect-ratio 제거 */
}

#wrapper_cs .list-board.cs5 li:nth-of-type(3) {
    width: 80px;
    flex: 0 0 80px
}

#wrapper_cs .list-board.cs5 li:nth-of-type(4) {
    width: 116px;
    flex: 0 0 116px;
    justify-content: start
}

#wrapper_cs .list-board.cs5 li:nth-of-type(5) {
    width: 76px;
    flex: 0 0 76px
}

#wrapper_cs .list-board.cs5 li:nth-of-type(6) {
    width: 56px;
    flex: 0 0 56px
}

#wrapper_cs .wrap-comm .cont_menu h3 {
    color: #171717;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .2px
}

#wrapper_cs .wrap-comm .cont_menu ul {
    width: 100%
}

#wrapper_cs .wrap-comm .cont_menu li {
    display: flex;
    height: 32px;
    padding: 0 8px;
    gap: 8px;
    justify-content: start;
    align-items: center;
    border-radius: 8px;
    background: 0 0;
    color: var(--Text-Primary, #171717);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    margin: 8px 0
}

#wrapper_cs .wrap-comm .cont_menu li.line {
    height: 1px;
    background: #e9ebee;
    width: 100%
}

#wrapper_cs .wrap-comm .cont_menu .wrap-write {
    padding: 0 0 20px 0;
}

#wrapper_cs .wrap-comm .cont_menu .btn-comm-write {
    width: 100%;
    height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 6px;
    background: var(--Text-Secondary, #5b5b5b);
    color: var(--White, #fff);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .2px
}

#wrapper_cs .wrap-comm .cont_menu li.on {
    background: #f2f4f7
}

#wrapper_cs .wrap-comm .cont_menu li a {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 8px
}

#wrapper_cs .wrap-comm .cont_banner {
    display: flex;
    flex-direction: column;
    gap: 12px
}

#wrapper_cs .wrap-comm .cont_banner .tban {
    width: 100%;
    flex-shrink: 0;
    overflow: hidden;
    border-radius: 16px;
    border: 1px solid var(--Line-Cool-Gray, #e9ebee);
    background: var(--White, #fff)
}

#wrapper_cs .wrap-comm .cont_banner .tban img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

#wrapper_cs .wrap-comm .cont_banner .brd {
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: 9px;
    border-radius: 12px;
    border: 1px solid #e9ebee;
    padding: 8px 20px
}

#wrapper_cs .wrap-comm .cont_banner .brd .item {
    display: flex;
    padding: 12px 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    align-self: stretch;
    position: relative
}

#wrapper_cs .wrap-comm .cont_banner .brd .item:not(:first-of-type)::after {
    background: #d9d9d9;
    content: '';
    height: 1px;
    left: 0;
    right: 0;
    top: -5px;
    z-index: 1;
    position: absolute
}

#wrapper_cs .wrap-comm .cont_banner .brd .cy {
    display: inline-flex;
    padding: 0 12px;
    width: fit-content;
    height: 20px;
    justify-content: center;
    align-items: center;
    border-radius: 99px;
    background: #3262a6;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .2px
}

#wrapper_cs .wrap-comm .cont_banner .brd .pr {
    color: #171717;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .2px
}

#wrapper_cs .wrap-comm .cont_banner .brd .ellipsis2 {
    color: #171717;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .2px
}

#wrapper_cs .wrap-comm .cont_banner .brd .area {
    color: #5b5b5b;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .2px
}

#wrapper_cs .wrap-comm .cont_banner .brd .area::after {
    content: ' ·'
}

#wrapper_cs .wrap-comm .cont_banner .brd .hosp {
    color: #171717;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .2px
}

#wrapper_cs .wrap-comm .wrap-paging {
    margin-top: 24px
}

#wrapper_cs .wrap-comm .wrap-cont-write {
    margin-top: 12px;
    display: flex;
    justify-content: right
}

#wrapper_cs .wrap-comm .btn-cont-write {
    display: flex;
    justify-content: center;
    gap: 8px;
    align-items: center;
    height: 34px;
    padding: 0 16px;
    border-radius: 6px;
    border: 1px solid var(--Line-Deep, #d5d7db);
    background: var(--White, #fff);
    color: var(--Text-Primary, #171717);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.btn-white {
    display: inline-flex;
    width: 146px;
    height: 50px;
    padding: 0 10px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 8px;
    border: 1px solid #c4c4c4;
    color: #171717;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%
}

.btn-white.small {
    width: 106px
}

.btn-white.orange {
    border: 1px solid #f57f20;
    width: 117px;
    color: #f57f20;
    font-size: 16px;
    font-weight: 600
}

.ml8 {
    margin-left: 8px
}

.textarea {
    width: 100%;
    color: #171717;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    resize: none;
    overflow: hidden
}

.wrap-board-view .view-top {
    margin-bottom: 20px;
    text-align: right
}

.wrap-board-view .view-head {
    padding: 12px 10px;
    border-top: 2px solid #171717;
    border-bottom: 1px solid #c4c4c4
}

.wrap-board-view .view-head.flex {
    padding: 12px 10px;
    border-top: 2px solid #171717;
    border-bottom: 1px solid #c4c4c4;
    display: flex;
    align-items: center
}

.wrap-board-view .view-head .left {
    width: 138px;
    flex: 0 0 138px;
    padding: 10px;
    color: #acacac;
    font-size: 20px;
    font-weight: 500
}

.wrap-board-view .view-head img {
    display: inline-block
}

.wrap-board-view .view-head .cat {
    color: #171717
}

.wrap-board-view .view-head .title {
    margin-top: 4px;
    color: #171717;
    font-size: 24px;
    font-weight: 700
}

.wrap-board-view .view-head .title span {
    display: inline-flex;
    padding: 2px 6px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    background: #171717;
    color: #fff;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    vertical-align: text-bottom
}

.wrap-board-view .view-head .hb {
    margin-top: 10px;
    display: flex;
    text-align: center;
    gap: 20px
}

.wrap-board-view .view-head .nick {
    color: #424242;
    font-weight: 500
}

.wrap-board-view .view-head .date {
    color: #8a8a8a
}

.wrap-board-view .view-head .read {
    color: #8a8a8a
}

.wrap-board-view .view-head .reply {
    color: #171717
}

.wrap-board-view .view-contents {
    padding-bottom: 43px
}

.wrap-board-view .wrap-contents {
    padding: 46px 0 81px;
    color: #171717;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%
}

#contenteditable li, .wrap-contents li {
    position: relative;
    padding-left: 1.5em
}

#contenteditable li::after, .wrap-contents li::after {
    content: '';
    position: absolute;
    width: 2px;
    height: 2px;
    border-radius: 2px;
    background-color: #929292;
    left: calc((1.5em - 2px) / 2);
    top: calc((1.5em - 2px) / 2)
}

.wrap-board-view .view-contents .con_btn {
    display: flex;
    align-items: center;
    justify-content: center
}

.wrap-board-view .view-contents .con_btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center
}

.btn-heart {
    display: flex;
    padding: 0 20px;
    width: 142px;
    height: 50px;
    justify-content: right;
    align-items: center;
    gap: 14px;
    border-radius: 4px;
    border: 1px solid #cbcbcb;
    color: #171717;
    background: #fff;
    font-size: 20px;
    background: url(/assets/images/board/icon_heart.svg) no-repeat left 20px center
}

.btn-heart.on {
    background: url(/assets/images/board/icon_heart_fill.svg) no-repeat left 20px center;
    border: 1px solid red
}

.btn-link {
    color: var(--Text-Primary, #171717);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .2px
}

.btn-report:not(.text) {
    display: flex;
    padding: 0 8px;
    width: 68px;
    height: 32px;
    justify-content: right;
    align-items: center;
    border-radius: 4px;
    border: 1px solid #cbcbcb;
    background: url(/assets/images/board/report.svg) no-repeat left 8px center;
    color: #171717
}

.btn-report.text {
    color: var(--Text-Primary, #171717);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.wall {
    width: 1px;
    height: 12px;
    background: var(--Line-Deep, #d5d7db);
    flex: 0 0 1px
}

.wrap-board-view .view-contents .con_btn .right {
    position: absolute;
    right: 0;
    bottom: 0;
    display: flex;
    gap: 10px
}

.wrap-act-group {
    color: #171717;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 25px;
    padding: 24px 0;
    border-bottom: 1px solid var(--Line-Cool-Gray, #e9ebee)
}

.exp button span, .wrap-act-group button span {
    color: #171717;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.exp button img, .wrap-act-group button img, a.button img {
    display: inline-block;
    vertical-align: text-top;
    filter: grayscale(100%)
}

.exp button.on img, .wrap-act-group button.on img {
    filter: grayscale(0%)
}

.wrap-act-group button.like img {
    display: inline-block;
    vertical-align: text-top; /*filter:grayscale(0%)*/
}

.wrap-act-group button.on.like img {
    filter: grayscale(0%);
    content: url('/assets/images/board/icon_like_on.svg')
}

.wrap-act-group .left, .wrap-act-group .right {
    display: flex;
    gap: 16px;
    align-items: center
}

.view-reply {
    padding: 12px 0 12px
}

.view-reply .tit {
    margin-bottom: 12px;
    display: flex;
    gap: 8px;
    color: #171717;
    font-size: 20px;
    font-weight: 700;
    align-items: center;
    letter-spacing: .2px;
    cursor: default;
    pointer-events: none
}

.view-reply .tit span img {
    display: none
}

.view-reply .tit span {
    color: #171717;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .2px
}

.view-reply li.wrap-accept {
    padding: 16px 20px;
    border-radius: 12px;
    background: #fff8f2
}

.view-reply li.wrap-accept b {
    display: block;
    padding-left: 18px;
    margin-bottom: 17px;
    color: #ff6a00;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    background: url(/assets/images/board/chk.svg) no-repeat left center
}

.view-reply li {
    position: relative
}

.view-reply li:not(:first-of-type) {
    margin-top: 20px;
    padding-top: 21px;
    border-top: 1px solid #e9ebee
}

.view-reply > ul > li:last-of-type {
    border-bottom: 1px solid #e9ebee;
    padding-bottom: 21px
}

.view-reply li > ul {
    padding-left: 48px;
    margin-top: 20px;
    border-top: 1px solid #e9ebee
}

.view-reply li:first-of-type {
    padding-top: 20px
}

.view-reply .mid {
    margin: 2px 0
}

.view-reply .rflex {
    display: flex;
    align-items: start;
    gap: 16px
}

.view-reply .rflex .rfleft {
    flex: 0 0 48px;
    width: 48px
}

.view-reply .top {
    vertical-align: text-bottom
}

.view-reply .reply-writebox .top {
    vertical-align: text-bottom;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px
}

.view-reply .top strong > * {
    display: inline-block
}

.view-reply .top strong {
    color: #171717;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .2px
}

.view-reply .top em {
    color: var(--Text-Disabled, silver);
    text-align: right;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.view-reply .writer {
    margin-left: 4px;
    display: inline-block;
    color: #ff6a00;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.view-reply .me {
    margin-left: 4px;
    display: inline-block;
    border-radius: 8px;
    color: #5b5b5b;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.view-reply i {
    margin-right: 4px;
    color: #8e8e8e;
    display: inline-block;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .2px
}

.view-reply .top em {
    margin-left: 4px;
    color: #d9d9d9;
    font-weight: 100
}

.view-reply .mid {
    color: #171717;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.view-reply button.btn-reply-reply {
    color: #8e8e8e;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    margin-left: 8px;
    display: inline-block
}

.view-reply button.btn-reply-accept {
    height: 20px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 0 8px;
    border-radius: 4px;
    background: #fff0e5;
    color: #ff6a00;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    margin-left: 12px;
    letter-spacing: .2px
}

.view-reply .right {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 20px;
    right: 0;
    top: 20px;
    z-index: 2
}

.view-reply .wrap-accept .right {
    display: none
}

.view-reply .right .w-control {
    position: absolute;
    width: 60px;
    border-radius: 8px;
    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, .25);
    right: 28px;
    top: 0;
    border: 1px solid #e9ebee;
    overflow: hidden;
    display: none
}

.view-reply .right .w-control button {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 40px;
    width: 100%;
    color: #171717;
    font-weight: 400;
    background: #fff
}

.view-reply .right .w-control button.delete {
    color: #f4361e
}

.view-reply .right .w-control button.t-report {
    display: flex;
    height: 48px;
    width: 100%;
    justify-content: center;
    align-items: center;
    color: #171717;
    font-weight: 400;
    background: #fff
}

.wrap-btn-delete {
    position: absolute;
    top: 0;
    left: calc(-100% - 20px);
    display: none;
    z-index: 5
}

.btn-delete-temp {
    display: flex;
    height: 48px;
    width: 60px;
    justify-content: center;
    align-items: center;
    background: #fff;
    border-radius: 8px;
    background: var(--White, #fff);
    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, .25);
    color: var(--Danger, #f4361e);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.view-bottom {
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.view-bottom .left {
    display: flex;
    align-items: center;
    gap: 10px
}

.view-bottom .right {
    display: flex;
    align-items: center;
    justify-content: right;
    gap: 10px
}

.reply-writebox.reply-reply {
    display: none
}

.reply-writebox {
    border: 1px solid #e1e1e1;
    padding: 16px;
    border-radius: 8px;
    margin-top: 12px
}

.reply-writebox:focus-within {
    border: 1px solid #171717;
    padding: 16px;
    border-radius: 8px;
    margin-top: 12px
}

.reply-writebox .textarea {
    background: 0 0;
    margin: 8px 0 15px;
    color: #171717;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.reply-writebox .fr {
    display: flex;
    justify-content: right
}

.rbarea {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px
}

.rbarea .bright {
    display: flex;
    align-items: center;
    gap: 8px
}

.reply-writebox .replybtcancel {
    display: flex;
    width: 40px;
    height: 20px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 4px;
    background: var(--BG-Cool-Gray, #f2f4f7);
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.reply-writebox .replybtnwrite {
    display: flex;
    width: 40px;
    height: 20px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    background: var(--Btn-Disabled, #d9d9d9);
    color: var(--White, #fff);
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.mention {
    color: #04c !important;
    font-size: 14px;
    font-weight: 500;
    display: inline;
    letter-spacing: .2px
}

#modal_home_edit {
    display: none
}

.itemBoxHighlight {
    background-color: #fff0e5
}

#modal_home_edit .modal_inner {
    max-width: 100%;
    width: 480px;
    padding: 24px;
    background: #fff;
    border-radius: 16px;
    border: 1px solid #e9ebee
}

#modal_home_edit .modal_inner h3 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--Text-Primary, #171717);
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .15px;
    margin-bottom: 24px
}

#modal_home_edit .w-btn {
    display: flex;
    justify-content: right;
    gap: 10px;
    align-items: center;
    padding-top: 24px;
    border-top: 1px solid #e9ebee
}

#modal_home_edit .w-btn .btn-cancel {
    display: flex;
    height: 40px;
    padding: 0 20px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    border: 1px solid var(--Line-Deep, #d5d7db);
    background: var(--White, #fff);
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_home_edit .w-btn .btn-save {
    display: flex;
    height: 40px;
    padding: 0 20px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    background: var(--Primary, #ff6a00);
    color: var(--White, #fff);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_home_edit .chkbox i {
    width: 24px;
    height: 24px;
    background: url(/assets/images/uncheck2.svg) no-repeat center center/24px auto;
    display: inline-block
}

#modal_home_edit .chkbox input[type=checkbox]:checked + i {
    background: url(/assets/images/checked.svg) no-repeat center center/21px auto
}

#modal_home_edit .chkbox input[type=checkbox][readonly] + i {
    background: url(/assets/images/checked_readonly.svg) no-repeat center center/24px auto
}

#modal_home_edit .w-list {
    padding: 12px 0
}

#modal_home_edit .w-list li {
    height: 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px
}

#modal_home_edit .w-list li .left {
    flex: 0 0 fit-content
}

#modal_home_edit .w-list li .mid {
    flex: 1;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_home_edit .w-list li .right {
    flex: 0 0 fit-content;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
    color: silver;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_report {
    display: none
}

#modal_report .modal_inner {
    max-width: 100%;
    width: 510px;
    border-radius: 12px;
    background: #fff;
    box-shadow: 2px 2px 16px 0 rgba(0, 0, 0, .25);
    overflow: hidden
}

#modal_report .modal_inner h3 {
    display: flex;
    padding: 20px;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #e8e8e8;
    background: #fff;
    color: #393939;
    font-size: 24px;
    font-weight: 700
}

#modal_report .modal_inner dl {
    padding: 20px;
    display: flex;
    gap: 16px;
    flex-direction: column
}

#modal_report .modal_inner .box_btn {
    padding: 0 20px 20px
}

#modal_report .modal_inner dt {
    color: #414141;
    font-size: 18px;
    font-weight: 700
}

#modal_report .modal_inner dd label {
    display: flex;
    gap: 12px
}

#modal_report .modal_inner dd label {
    color: #414141;
    font-weight: 600
}

#modal_report .modal_inner dd label p {
    color: #afafaf
}

#modal_report .modal_inner dd .ta {
    width: 100%;
    height: 130px;
    padding: 8px;
    border-radius: 8px;
    border: 1px solid #cfcfcf;
    background: #fff;
    color: #414141
}

.wrap-board-write .write-top {
    padding: 24px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    background: var(--White, #fff);
    border-bottom: 1px solid var(--Line-Cool-Gray, #E9EBEE);
}

.write-top .btn-close-write {
    margin-left: -6px
}

.wrap-board-write h3 {
    color: var(--Text-Primary, #171717);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .15px
}

.wrap-board-write .write-top .right {
    display: flex;
    gap: 8px
}

.btn-commtop-white {
    height: 40px;
    padding: 0 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    border: 1px solid #d5d7db;
    color: #171717;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.btn-commtop-white.btor {
    border: 1px solid #ff6a00;
    color: #fff;
    background: #ff6a00
}

.btn-commtop-white:disabled {
    color: silver !important;
    background: #fff !important
}

.wrap-board-write .write-form-top {
    padding: 24px 0
}

.mt24 {
    margin-top: 24px
}

.mt25 {
    margin-top: 25px
}

.mt12 {
    margin-top: 12px
}

.radio {
    display: inline-flex;
    align-items: center;
    gap: 12px
}

.radio:first-of-type {
    margin-right: 32px
}

.wrap-board-write .flex-dl {
    display: flex;
    align-items: start;
    gap: 22px
}

.wrap-board-write .flex-dl .errorbox {
    margin-left: 8px;
    display: inline-block;
    padding: 4px 12px;
    border-radius: 4px;
    background: #f3f3f3;
    color: #777;
    font-size: 16px;
    font-weight: 500
}

.wrap-board-write .wrap-recruit dd * {
    color: #8e8e8e !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 400
}

.wrap-board-write .wrap-recruit dd button {
    display: flex;
    gap: 8px;
    align-items: center
}

.wrap-board-write .box-boardtype {
    height: 33px;
    align-items: center
}

.wrap-board-write .flex-dl > dt {
    flex: 0 0 146px;
    width: 146px;
    color: #8e8e8e;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: .2px;
    line-height: 40px;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.wrap-board-write .flex-dl > dt label span {
    color: #5b5b5b;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.wrap-board-write .flex-dl > dd {
    flex: 1
}

.wrap-board-write .flex-dl > dd.dflex {
    display: flex;
    align-items: center;
    gap: 8px
}

.wrap-board-write .flex-dl > dd.dflex .atxt {
    color: #8e8e8e;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 18px;
    letter-spacing: .2px
}

.flex-radio {
    display: flex;
    flex-wrap: wrap;
    gap: 8px
}

.wrap-button-radio label span {
    padding: 0 12px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    border: 1px solid #d5d7db;
    color: #5b5b5b;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    cursor: pointer;
    white-space: nowrap;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none
}

.wrap-button-radio label {
    width: fit-content;
    height: fit-content
}

.wrap-button-radio label input[type=radio] {
    display: none
}

.wrap-button-radio label input[type=radio]:checked + span {
    border: 1px solid #ffb580;
    background: #fff0e5;
    color: #ff6a00
}

.wrap-button-radio .none-category {
    margin-bottom: 8px
}

.date-hidden {
    opacity: 0;
    width: 100%;
    height: 40px;
    position: absolute;
    left: 0;
    top: 0;
    cursor: pointer
}

.date-hidden::-webkit-calendar-picker-indicator {
    opacity: 0;
    width: 100%;
    height: 40px;
    position: absolute;
    left: 0;
    top: 0;
    background: #000;
    width: 100%;
    cursor: pointer
}

.wrap-board-write .wrap-input input, .wrap-board-write .wrap-input > button {
    width: 100%;
    height: 50px;
    padding: 0 16px;
    border-radius: 8px;
    border: 1px solid #d5d7db;
    color: #171717;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: .2px;
    display: flex;
    align-items: center;
    gap: 8px
}

.wrap-board-write .wrap-input input:read-only {
    color: #8e8e8e;
    background: #f0f0f0
}

.wrap-board-attach p.exp {
    color: silver;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    text-align: center
}

.wrap-board-attach .flex {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    color: #8e8e8e;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    cursor: pointer;
}

.wrap-board-attach .flex > label {
    display: flex
}

.wrap-board-write .write-contents {
    border: 1px solid #d5d7db;
    overflow: hidden
}

.wrap-board-write .write-contents .wrap-tag {
    border-top: 1px solid #e1e1e1
}

.wrap-board-write .write-contents .wrap-tag input {
    padding: 15px 20px;
    width: 100%;
    color: #171717;
    font-size: 20px;
    font-weight: 500
}

.wrap-board-write .write-attach, .wrap-board-write .write-survey {
    width: 100%;
    border-radius: 8px;
    border: 1px solid #e1e1e1;
    overflow: hidden;
    padding: 10px 20px;
    margin-top: 20px;
    display: flex;
    gap: 29px;
    align-items: center
}

.wrap-board-write .write-attach button.btn-white, .wrap-board-write .write-survey button.btn-white {
    width: 106px;
    height: 40px;
    padding: 0;
    font-size: 16px;
    color: #171717;
    font-weight: 500
}

.wrap-board-write .write-attach.column {
    flex-direction: column;
    justify-content: start;
    align-items: start;
    gap: 0
}

.write-attach .wfn {
    width: 100%;
    margin-bottom: 13px;
    display: flex;
    flex-direction: column;
    gap: 13px
}

.write-attach .fn-item {
    display: flex;
    align-items: center;
    gap: 12px
}

.write-attach .fn {
    color: #171717;
    font-size: 20px
}

.wrap-board-write .write-attach input[type=text] {
    color: #848484;
    font-size: 20px;
    display: block;
    width: 100%
}

.wrap-board-write .write-survey p {
    color: #848484;
    font-size: 20px
}

.wrap-board-write .none-category label {
    display: block
}

.box-survey {
    display: flex;
    width: 100%;
    padding: 12px 20px;
    border-radius: 8px;
    align-items: center;
    gap: 12px;
    border: 1px solid #e9ebee;
    color: #8e8e8e;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .2px
}

.box-survey .survey-title {
    color: #171717;
    font-size: 18px
}

.wrap-board-head.tabs .right {
    display: flex;
    align-items: center;
    gap: 15px
}

.wrap-board-head.tabs .right label span {
    display: flex;
    padding: 4px 12px;
    justify-content: center;
    align-items: center;
    border-radius: 99px;
    background: #f2f2f2;
    color: #171717;
    font-size: 20px;
    font-weight: 500;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none
}

.wrap-board-head.tabs .right label input:checked + span {
    background: #404040;
    color: #fff
}

.wrap-board-head.tabs .right input {
    display: none
}

#modal_temp .modal_inner {
    width: 560px;
    max-width: 100%;
    border-radius: 16px;
    background: #fff;
    padding: 24px;
    overflow: hidden;
    border: 1px solid var(--Line-Cool-Gray, #e9ebee)
}

#modal_temp .modal_inner h3 {
    display: flex;
    padding-bottom: 25px;
    justify-content: space-between;
    align-items: center;
    color: var(--Text-Primary, #171717);
    font-size: 22px;
    font-weight: 700;
    letter-spacing: .15px
}

#modal_temp .modal_inner .box {
    display: flex;
    width: 100%;
    padding: 18px;
    justify-content: center;
    align-items: center;
    background: #f7f7f7;
    color: #5b5b5b;
    font-family: Pretendard;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: .2px;
    border-radius: 8px
}

#modal_temp .modal_inner label.flex i {
    flex: 0 0 auto
}

#modal_temp .modal_inner label.flex {
    display: flex;
    align-items: center;
    gap: 8px
}

#modal_temp .modal_inner ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    min-width: 0;
    max-width: 100%;
    width: 100%;
    height: 56px;
    border-bottom: 1px solid #e9ebee
}

#modal_temp .modal_inner li .tt {
    flex: 1 1 auto;
    width: auto
}

#modal_temp .modal_inner li .ellipsis1 {
    flex: 1 1 auto;
    width: auto;
    color: #171717;
    font-size: 16px;
    letter-spacing: .2px
}

#modal_temp .modal_inner li span {
    flex: 0 0 fit-content;
    width: fit-content;
    color: #8e8e8e;
    font-size: 14px;
    letter-spacing: .2px
}

#modal_temp .modal_inner li .relative {
    flex: 0 0 fit-content;
    width: fit-content;
    padding-left: 12px
}

#modal_survey .modal_inner {
    max-width: 100%;
    width: 480px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid var(--Line-Cool-Gray, #e9ebee);
    padding: 24px;
    overflow: hidden
}

#modal_survey .modal_inner h3 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--Text-Primary, #171717);
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .15px
}

#modal_survey dt {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: .2px;
    margin-top: 24px
}

#modal_survey dd {
    margin: 6px 0
}

#modal_survey select {
    width: 100%;
    height: 48px
}

#modal_survey input[type=email], #modal_survey input[type=number], #modal_survey input[type=tel], #modal_survey input[type=text] {
    padding: 0 16px;
    width: 100%;
    height: 48px;
    border-radius: 8px;
    border: 1px solid #d5d7db;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-weight: 400;
    line-height: 24px
}

#modal_survey .wbtn button {
    width: 100%;
    height: 40px;
    border-radius: 8px;
    background: var(--BG-Cool-Gray, #f2f4f7);
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_survey .wbtn {
    padding-top: 6px;
    padding-bottom: 16px
}

#modal_survey .wset {
    color: #393939;
    font-size: 20px;
    display: flex;
    justify-content: space-between;
    margin-top: 12px
}

#modal_survey .wset .radio {
    display: flex;
    gap: 8px;
    align-items: center
}

#modal_survey .wset .inset {
    display: block;
    margin-top: 7px
}

#modal_survey .wset .inset.hidden {
    display: none
}

#modal_survey .wset .indate {
    width: 140px;
    position: relative
}

#modal_survey .wset .inppl {
    width: 115px;
    margin-left: 30px
}

#modal_survey .wset .inppl input {
    text-align: center
}

#modal_survey .wset input[type=date], #modal_survey .wset input[type=number] {
    width: 100%;
    padding: 8px 12px;
    border-radius: 8px;
    border: 1px solid #ddd;
    color: #393939;
    font-size: 16px;
    font-weight: 500
}

#modal_survey .wset ul {
    display: grid;
    grid-template-columns:repeat(3, 1fr);
    gap: 5px;
    width: 100%
}

#modal_survey .box_btn {
    padding-top: 24px;
    display: flex;
    justify-content: right
}

#modal_survey .btn.make {
    display: flex;
    height: 40px;
    padding: 0 20px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #ff6a00;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .2px
}

.gap40 {
    gap: 40px !important
}

.bundle-table {
    width: 100%;
    max-width: 1084px;
    margin: 0 auto
}

.bundle-table.t3 {
    margin-bottom: 20px
}

.bundle-table thead th, .bundle-table.t1 th {
    background: #ebebeb
}

.bundle-table.t2 tbody td {
    height: 144px;
    vertical-align: top
}

.bundle-table.t2 tbody p {
    color: #171717;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    display: block;
    text-overflow: initial;
    overflow: initial;
    display: -webkit-box;
    -webkit-line-clamp: initial;
    -webkit-box-orient: initial;
    white-space: initial
}

.bundle-table.t2 thead th, .bundle-table.t3 thead th {
    text-align: center
}

.bundle-table tbody th {
    background: #ccc
}

.bundle-table td {
    background: #fff
}

.bundle-table.t1 tr:first-of-type {
    border-top: 1px solid #cbcbcb
}

.bundle-table.t1 td, .bundle-table.t1 th, .bundle-table.t2 tbody td {
    padding: 10px
}

.bundle-table tr {
    border-bottom: 1px solid #cbcbcb
}

.bundle-table td, .bundle-table th {
    border-left: 1px solid #cbcbcb;
    border-right: 1px solid #cbcbcb;
    padding: 0 10px
}

.bundle-table td p, .bundle-table th p {
    color: #272727;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    display: block;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: wrap
}

.virtual-placeholder {
    color: #bfbfbf !important
}

#contenteditable {
    width: 100%;
    height: 512px;
    padding: 20px;
    overflow-y: auto;
    color: #171717;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px
}

#contenteditable:focus {
    outline: 0
}

.toobar_contenteditable .btn-write-file {
    display: none
}

.toobar_contenteditable * {
    color: var(--Text-Secondary, #5b5b5b) !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    letter-spacing: .2px !important
}

.toobar_contenteditable {
    padding: 0 20px;
    border-bottom: 1px solid #d5d7db;
    background-color: #f7f7f7;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap
}

.toobar_contenteditable > div {
    padding: 12px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px
}

.toobar_contenteditable > div:first-of-type {
    padding: 12px 0 12px 20px
}

.toobar_contenteditable > div:last-of-type {
    padding: 12px 20px 12px 0
}

.toobar_contenteditable .wall {
    width: 1px;
    height: 12px;
    background: #d5d7db
}

.toobar_contenteditable select {
    padding: 0 22px 0 0;
    height: 24px;
    display: flex;
    align-items: center;
    background: url(/assets/images/board/t_down.svg) right center no-repeat
}

.toobar_contenteditable button img {
    max-width: initial
}

.mr10 {
    margin-right: 10px
}

.wrap-survey {
    padding: 12px 20px;
    border-radius: 8px;
    border: 1px solid var(--Line-Cool-Gray, #e9ebee)
}

.wrap-survey .tit {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px
}

.wrap-survey .tit .left {
    flex: 1 1 auto;
    display: flex;
    width: 100%;
    border-radius: 8px;
    align-items: center;
    gap: 12px;
    color: #8e8e8e;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .2px
}

.wrap-survey .tit .left .survey-title {
    color: #171717;
    font-size: 18px
}

.wrap-survey .tit .right {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto
}

.wrap-survey .tit .right .date {
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 14px;
    font-style: normal;
    letter-spacing: .2px;
    white-space: nowrap
}

.wrap-survey .tit .right .status {
    color: var(--Primary, #ff6a00);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

.black {
    color: #171717 !important
}

.wrap-survey .item:not(:first-of-type) {
    border-top: 1px solid #e9ebee
}

.wrap-survey .qtn .con label, .wrap-survey .qtn .con p {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    margin-bottom: 4px
}

.wrap-survey .qtn .con label strong, .wrap-survey .qtn .con p strong {
    font-weight: 600;
    font-style: normal;
    display: flex;
    align-items: center
}

.wrap-survey .qtn .con .data {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-left: 24px;
    gap: 8px;
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.wrap-survey .qtn .con .data .txt {
    flex: 0 0 38px;
    width: 38px;
    overflow: hidden
}

.wrap-survey .qtn .con .data .gph {
    flex: 1 1 auto
}

.wrap-survey .qtn .con .data .bg-gph {
    width: 100%;
    height: 12px;
    border-radius: 50px;
    background: #f2f4f7
}

.wrap-survey .qtn .con .data .bar-gph {
    width: 0;
    height: 12px;
    border-radius: 50px;
    background: #8e8e8e
}

.wrap-survey .qtn .con .data .per {
    flex: 0 0 38px;
    width: 38px;
    overflow: hidden;
    text-align: right
}

.wrap-survey .item {
    padding: 8px 0
}

.wrap-survey .item.on .qtn .con .data .per, .wrap-survey .item.on .qtn .con .data .txt {
    color: #ff6a00 !important
}

.wrap-survey .item.on .qtn .con .data .bar-gph {
    background: #ff6a00 !important
}

.wrap-survey .wrap-c-btn {
    margin-top: 20px;
    padding: 24px;
    display: flex;
    justify-content: center
}

.wrap-survey .survey-submit {
    height: 40px;
    padding: 0 20px;
    border-radius: 8px;
    background: var(--Tertiary, #fff0e5);
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--Primary, #ff6a00);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.wrap-survey .survey-submit-re {
    height: 40px;
    padding: 0 20px;
    border-radius: 8px;
    background: var(--Tertiary, #fff);
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--Primary, #171717);
    border: 1px solid var(--Line-Deep, #d5d7db);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.wrap-board-head .wrapbt {
    display: flex;
    margin-left: 12px
}

.wrap-board-head .btn-calendar-type, .wrap-board-head .btn-card-type {
    width: 40px;
    height: 40px;
    background: url(/assets/images/board/board_type1.svg) no-repeat left center
}

.wrap-board-head .btn-calendar-type {
    background: url(/assets/images/board/board_type1.svg) no-repeat right center
}

.wrap-calendar .btn-calendar-type, .wrap-calendar .btn-card-type {
    background: url(/assets/images/board/board_type2.svg) no-repeat left center
}

.wrap-calendar .btn-calendar-type {
    background: url(/assets/images/board/board_type2.svg) no-repeat right center
}

.ml21 {
    margin-left: 21px !important
}

.pt60 {
    padding-top: 60px !important
}

.select.onoff {
    width: 160px
}

.wrap-board-head.nbd2 .input-search {
    width: 280px
}

.select.category {
    width: 160px
}

.wrap-calendar .w-h-ym {
    white-space: nowrap;
    gap: 16px;
    display: flex;
    align-items: center;
    color: var(--Text-Primary, #171717);
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

.table-calendar {
    width: 100%;
    background-color: #fff;
    border-collapse: collapse;
    border-radius: 12px;
    box-shadow: 0 0 0 1px #e9ebee
}

.table-calendar .sunday {
    color: #f4361e m !important
}

.table-calendar thead tr {
    height: 40px
}

.table-calendar thead th {
    text-align: center;
    background: #f7f7f7;
    color: #171717;
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    overflow: hidden;
    height: 40px
}

.table-calendar thead th:first-of-type {
    border-top-left-radius: 12px
}

.table-calendar thead th:last-of-type {
    border-top-left-radius: 12px
}

.table-calendar tbody tr {
    height: 178px;
    border-top: 1px solid #e9ebee
}

.table-calendar td:not(:first-of-type), .table-calendar th:not(:first-of-type) {
    border-left: 1px solid #e9ebee
}

.table-calendar td:first-of-type > b, .table-calendar th:first-of-type {
    color: #f4361e !important
}

.table-calendar tbody td {
    padding: 8px 4px;
    vertical-align: top;
    position: relative
}

.table-calendar tbody td .item {
    position: relative
}

.table-calendar tbody td b {
    padding: 4px 8px;
    display: block;
    color: var(--Text-Primary, #171717);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

.table-calendar tbody td.today b {
    color: #ff6a00;
    font-weight: 600
}

.table-calendar tbody td.today::after {
    content: '';
    position: absolute;
    display: block;
    width: 100%;
    height: 4px;
    left: 0;
    top: 0;
    background: #ff6a00
}

.table-calendar tbody td.disabled b {
    opacity: .5
}

.table-calendar tbody td .list-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%
}

.table-calendar tbody td .more {
    height: 18px;
    margin: 1px 8px 0;
    padding-left: 0;
    position: relative;
    overflow: hidden;
    color: #171717;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 18px;
    letter-spacing: .2px
}

.table-calendar tbody td .ellipsis1 {
    height: 20px;
    margin: 0 8px;
    padding-left: 10px;
    position: relative;
    overflow: hidden;
    color: #5b5b5b;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: .2px
}

.table-calendar tbody td .ellipsis1:active, .table-calendar tbody td .ellipsis1:focus, .table-calendar tbody td .ellipsis1:hover {
    text-decoration: underline;
    text-underline-position: under;
    text-decoration-color: #5B5B5B
}

.table-calendar tbody td .ellipsis1::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    border-radius: 4px;
    background: #5b5b5b
}

.table-calendar tbody td .list-item .item.on .ellipsis1 {
    color: #ff6a00
}

.table-calendar tbody td .list-item .item.on .ellipsis1::before {
    background: #ff6a00
}

.mt35 {
    margin-top: 35px
}

.wrap-event .wrap-view {
    display: flex;
    gap: 40px;
    justify-content: space-between;
    align-items: start
}

.wrap-event .wrap-view .left {
    width: auto;
    flex: 1 1 auto
}

.wrap-event .wrap-view .right {
    flex: 0 0 calc(378 * 100% / 1240);
    width: calc(378 * 100% / 1240);
    padding: 24px;
    border-radius: 12px;
    border: 1px solid var(--Line-Cool-Gray, #e9ebee);
    background: var(--White, #fff)
}

.wrap-event .wrap-view .wrap-bbtn .btn-scr {
    flex: 0 0 56px;
    width: 56px;
    height: 56px;
    border: 1px solid #d5d7db;
    border-radius: 8px;
    background: url(/assets/images/icon_heart.svg) no-repeat center center/24px 24px
}

.wrap-event .wrap-view .wrap-bbtn .btn-scr.on {
    background: url(/assets/images/icon_heart_on.svg) no-repeat center center/24px 24px
}

.wrap-event .wrap-view .wrap-bbtn .fbtn {
    flex: 1;
    width: 100%;
    color: #fff;
    display: flex;
    height: 56px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: #ff6a00;
    font-size: 18px;
    font-weight: 500;
    white-space: nowrap;
    letter-spacing: .2px
}

.wrap-event .wrap-view .left dt {
    color: #171717;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 16px;
    letter-spacing: .15px;
    margin-top: 40px
}

.wrap-event .wrap-view .left dd strong {
    color: #5b5b5b;
    font-weight: 400
}

.wrap-event .wrap-view .left dd {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: .2px
}

.wrap-event .wrap-view .left dd .date {
    color: #5b5b5b;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: .2px
}

.wrap-event .wrap-view .right .date {
    color: #5b5b5b;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: .2px
}

.wrap-event .wrap-view .left dd .date .wall {
    margin: 0 8px
}

.wrap-event .wrap-view .date b {
    color: silver;
    margin: 0 4px
}

.wrap-event .wrap-view .left dd .class {
    margin-top: 16px
}

.wrap-event .wrap-view .left dd .class li strong {
    font-weight: 600
}

.wrap-event .wrap-view .left dd .class li {
    margin-bottom: 4px;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    display: flex;
    gap: 12px;
    align-items: center
}

.wrap-event .wrap-view .sprofile {
    display: flex;
    justify-content: space-between;
    align-items: start;
    padding: 24px 0;
    border-top: 1px solid #e9ebee
}

.wrap-event .wrap-view .sprofile:last-of-type {
    border-bottom: 1px solid #e9ebee
}

.wrap-event .wrap-view .ileft {
    display: flex;
    gap: 45px;
    align-items: center;
    width: 50%
}

.wrap-event .wrap-view .ileft .imgbox {
    width: 95px;
    height: 95px;
    border-radius: 95px;
    overflow: hidden;
    border-radius: 99px;
    border: 1px solid #c4c4c4;
    background: #f8f8f8
}

.wrap-event .wrap-view .ileft .imgbox img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.wrap-event .wrap-view .ileft .txtbox {
    color: #171717;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .15px
}

.wrap-event .wrap-view .ileft .txtbox strong {
    color: #171717;
    font-size: 22px;
    font-weight: 700
}

.wrap-event .wrap-view .iright ul {
    display: flex;
    flex-direction: column;
    gap: 4px
}

.wrap-event .wrap-view .iright ul li::before {
    content: '-'
}

.wrap-event .wrap-view .iright ul li {
    display: flex;
    gap: 8px
}

.wrap-event .wrap-view .iright {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    width: 50%
}

.wrap-event .wrap-view .titeimgbox {
    width: 100%;
    aspect-ratio: 848/477;
    border-radius: 8px;
    overflow: hidden
}

.wrap-event .wrap-view .titeimgbox img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.wrap-event .wrap-view .mid {
    margin-top: 40px;
    margin-bottom: 24px;
    color: #393939;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    display: flex;
    justify-content: space-between
}

.wrap-event .wrap-view .right .wbtn {
    display: flex;
    justify-content: space-between;
    gap: 10px
}

.wrap-event .wrap-view .btn-scrab {
    flex: 0 0 109px;
    display: flex;
    width: 109px;
    height: 44px;
    justify-content: right;
    align-items: center;
    padding: 0 21px;
    border-radius: 8px;
    border: 1px solid #b3b3b3;
    background: #fff;
    color: #696969;
    font-size: 16px;
    font-weight: 600;
    background: url(/assets/images/board/icon_heart.svg) no-repeat left 21px center/20px auto;
    overflow: hidden
}

.wrap-event .wrap-view .btn-scrab.on {
    background: url(/assets/images/board/icon_heart_fill.svg) no-repeat left 21px center/20px auto;
    border: 1px solid red
}

.wrap-event .wrap-view .btn-apply {
    flex: 1 1 auto;
    display: flex;
    width: auto;
    height: 44px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: #f57f20;
    color: #fff;
    font-size: 16px;
    font-weight: 700
}

.wrap-board-head.faq {
    padding: 20px 0;
    margin: 0;
    border: 0
}

.wrap-faq dl {
    border-bottom: 1px solid #ddd
}

.wrap-faq dt {
    color: #171717;
    font-size: 18px;
    font-weight: 600;
    padding: 15px 30px 15px 0;
    background: url(/assets/images/board/faq_arrow_down.svg) no-repeat right center;
    cursor: pointer
}

.wrap-faq dt strong {
    color: var(--Primary, #ff6a00);
    font-family: "Gmarket Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.wrap-faq dt.on {
    background: url(/assets/images/board/faq_arrow_up.svg) no-repeat right center
}

.wrap-faq dt {
    border-top: 1px solid #ddd
}

.wrap-faq dd {
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    padding: 0 24px 24px 24px;
    display: none
}

.wrap-shop-kv {
    background: #eeeae7
}

.shop-kv.swiper {
    width: 100%;
    max-width: 1920px;
    overflow: hidden;
    position: relative;
    padding: 141px 0 85px
}

.shop-kv.swiper .swiper-slide {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.shop-kv.swiper .swiper-slide > div {
    width: fit-content
}

.shop-kv.swiper .swiper-slide img {
    width: initial;
    height: auto
}

.shop-kv .pwrap {
    position: absolute;
    right: 20px;
    bottom: 42px;
    width: fit-content;
    height: 27px;
    background: #787574;
    border-radius: 99px;
    display: flex;
    align-items: center;
    font-size: 14px;
    font-weight: 400;
    color: #fff;
    z-index: 10
}

.shop-kv .button-prev {
    width: 26px;
    height: 100%;
    cursor: pointer;
    background: url(/assets/images/left_white.svg) no-repeat left 11px center/auto 12px
}

.shop-kv .button-next::after, .shop-kv .button-prev::after {
    content: '';
    display: none
}

.shop-kv .button-next {
    width: 26px;
    height: 100%;
    cursor: pointer;
    background: url(/assets/images/right_white.svg) no-repeat right 11px center/auto 12px
}

.shop-kv .swiper-horizontal > .swiper-pagination-bullets, .shop-kv .swiper-pagination-bullets.swiper-pagination-horizontal, .shop-kv .swiper-pagination-custom, .shop-kv .swiper-pagination-fraction {
    bottom: initial;
    top: initial;
    left: initial;
    width: initial
}

.shop-kv .swiper-pagination-fraction {
    color: #fff
}

#body_cs .product-list .titlebox {
    padding: 112px 0 32px;
    text-align: center;
    color: var(--Text-Primary, #171717);
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .2px
}

#body_cs .product-list .swiper.lnb-product .swiper-wrapper {
    justify-content: center
}

.product-grid {
    margin-top: 32px;
    display: grid;
    grid-template-columns:repeat(4, 1fr);
    gap: 64px 20px
}

#body_cs .product-grid .imgbox {
    width: 100%;
    height: 200px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #f0f0f0;
    border-radius: 8px;
    overflow: hidden;
    /* Safari 호환을 위해 aspect-ratio 제거하고 고정 높이 사용 */
}

#body_cs .product-grid .imgbox img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

#body_cs .product-grid .ellipsis1 {
    margin-top: 11px;
    color: #5b5b5b;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .2px
}

#body_cs .product-grid .price {
    margin: 6px 0;
    color: #8e8e8e;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: .2px;
    text-decoration: line-through
}

#body_cs .product-grid .point {
    color: var(--Text-Primary, #171717);
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

#body_cs .product-grid .point strong {
    color: var(--Danger, #f4361e);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .15px
}

#modal_view_order_detail .step-detail .window-body {
    padding: 24px 0 0;
    margin: 0 auto;
    min-height: 100vh
}

#modal_view_order_detail .step-detail .window-body .inner {
    padding: 0 40px
}

#modal_view_order_detail .step-detail .w-btn {
    padding: 24px 40px;
    border-top: 1px solid var(--Line-Deep, #d5d7db)
}

#modal_view_order_detail .step-detail button.btn-order {
    width: 100%;
    height: 56px;
    border-radius: 8px;
    background: var(--Primary, #ff6a00);
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--White, #fff);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_view_order_detail .wrap-product .tibox {
    color: var(--Text-Primary, #171717);
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .2px;
    height: 56px;
    line-height: 56px;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: start
}

#modal_view_order_detail .wrap-product h4 {
    color: var(--Text-Primary, #171717);
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .2px;
    height: 56px;
    line-height: 56px;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: start
}

#modal_view_order_detail .step-detail .tinfo {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 32px;
    padding: 20px 24px;
    border-bottom: 1px solid #d5d7db
}

#modal_view_order_detail .step-detail .tinfo .imgbox {
    flex: 0 0 160px;
    width: 160px
}

#modal_view_order_detail .step-detail .tinfo .imgbox img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    border: 1px solid var(--Line-Warm-Gray, #f0f0f0);
    background: var(--BG-Cool-Gray, #f2f4f7);
    /* Safari 호환을 위해 aspect-ratio 제거 */
}

#modal_view_order_detail .step-detail .tinfo .right {
    flex: 1
}

#modal_view_order_detail .step-detail .tinfo .pname {
    color: var(--Text-Primary, #171717);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_view_order_detail .step-detail .tinfo .pinfo {
    display: flex;
    gap: 12px;
    align-items: start;
    justify-content: space-between
}

#modal_view_order_detail .step-detail .tinfo .pinfo .per {
    flex: 1;
    color: var(--Danger, #f4361e);
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_view_order_detail .step-detail .tinfo .price {
    flex: 0 0 fit-content;
    width: fit-content;
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    text-decoration: line-through
}

#modal_view_order_detail .step-detail .tinfo .point {
    flex: 0 0 auto;
    width: fit-content;
    color: var(--Text-Primary, #171717);
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

#modal_view_order_detail .step-detail .tinfo .eainfo {
    margin-top: 44px;
    padding: 16px 0
}

.eainfo {
    display: flex;
    align-items: center;
    gap: 12px
}

.eainfo .bbox {
    display: flex;
    align-items: center;
    border-radius: 4px;
    border: 1px solid #d5d7db
}

.eainfo .bbox button {
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center
}

.eainfo .bbox .quantity {
    width: 50px;
    height: 32px;
    border-left: 1px solid #d5d7db;
    border-right: 1px solid #d5d7db;
    padding: 0 7px;
    text-align: center;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_view_order_detail .step-detail .tinfo .w-total {
    padding: 21px 0 29px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    border-top: 1px solid #e9ebee
}

#modal_view_order_detail .step-detail .tinfo .w-total .txt {
    flex: 1 1 auto;
    color: var(--Text-Primary, #171717);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

#modal_view_order_detail .step-detail .tinfo .w-total .t_qut {
    flex: 0 0 fit-content;
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_view_order_detail .step-detail .tinfo .w-total .wall {
    flex: 0 0 1px
}

#modal_view_order_detail .step-detail .tinfo .w-total .sum-price {
    flex: 0 0 fit-content;
    color: var(--Danger, #f4361e);
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .15px
}

#modal_view_order_detail .step-detail .wrap-d-info {
    padding: 24px 40px 32px
}

#modal_view_order_detail h5 {
    height: 56px;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    align-items: center;
    color: var(--Text-Primary, #171717);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 56px;
    letter-spacing: .15px
}

#modal_view_order_detail .step-order-form {
    display: none
}

#modal_view_order_detail .step-order-form .w-order {
    padding: 16px 0 32px
}

#modal_view_order_detail .step-order-form .graybox {
    border-radius: 16px;
    background: var(--BG-Warm-Gray, #f7f7f7);
    padding: 24px
}

#modal_view_order_detail .step-order-form .graybox li {
    display: flex;
    gap: 12px
}

#modal_view_order_detail .step-order-form .graybox li .left {
    flex: 0 0 32%;
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_view_order_detail .step-order-form .graybox li .right {
    flex: 1;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_view_order_detail .step-order-form .w-manager {
    padding-bottom: 32px
}

#modal_view_order_detail .step-order-form .w-manager h5 label span {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_view_order_detail .step-order-form .w-manager .inp {
    padding: 16px 0;
    display: block
}

#modal_view_order_detail .step-order-form .w-manager .inp .nm {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    display: block
}

#modal_view_order_detail .step-order-form .inp .iflex {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 8px
}

#modal_view_order_detail .step-order-form .inp .iflex .left {
    flex: 1 1 auto
}

#modal_view_order_detail .step-order-form .inp .iflex .right {
    flex: 0 0 128px;
    width: 128px
}

#modal_view_order_detail .step-order-form .inp .iflex .btn-dark {
    height: 48px;
    padding: 0 32px;
    border-radius: 8px;
    background: var(--Text-Secondary, #5b5b5b);
    color: var(--White, #fff);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_view_order_detail .w-pinfo {
    padding: 32px 0;
    border-top: 1px solid var(--Line-Deep, #d5d7db)
}

#modal_view_order_detail .p-list {
    padding: 20px 0;
    gap: 24px;
    display: flex;
    justify-content: space-between;
    align-items: top;
    border-bottom: 1px solid var(--Line-Deep, #e9ebee)
}

#modal_view_order_detail .p-list .pimg {
    border-radius: 8px;
    border: 1px solid var(--Line-Warm-Gray, #f0f0f0);
    background: var(--BG-Cool-Gray, #f2f4f7);
    flex: 0 0 fit-content
}

#modal_view_order_detail .p-list .pimg img {
    width: 102px;
    height: 102px;
    object-fit: cover
}

#modal_view_order_detail .p-list .right {
    flex: 1
}

#modal_view_order_detail .p-list .right .pname {
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_view_order_detail .p-list .right .qut {
    margin: 8px 0;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_view_order_detail .p-list .right .pr {
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    text-decoration: line-through
}

#modal_view_order_detail .p-list .right .pb {
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

#modal_view_order_detail .p-list .right .pb strong {
    color: var(--Danger, #f4361e);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

#modal_view_order_detail .step-order-form .w-point {
    padding: 32px 0
}

#modal_view_order_detail .step-order-form .w-point ul {
    padding: 20px 0
}

#modal_view_order_detail .step-order-form .w-point ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px
}

#modal_view_order_detail .step-order-form .w-point ul li .left {
    flex: 1;
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_view_order_detail .step-order-form .w-point ul li:last-of-type .left, #modal_view_order_detail .step-order-form .w-point ul li:last-of-type .right {
    color: var(--Link, #04c) !important
}

#modal_view_order_detail .step-order-form .w-point ul li .right {
    flex: 0 0 fit-content;
    color: var(--Text-Primary, #171717);
    text-align: right;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_view_order_detail .step-order-form .w-point ul li:last-of-type {
    margin-top: 12px
}

#modal_view_order_detail .step-order-form .w-jg {
    padding: 24px 0
}

#modal_view_order_detail .step-order-form .w-jg .wflex {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_view_order_detail .step-order-form .w-jg .wflex .u {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    text-decoration-line: underline
}

#modal_view_order_detail .step-order-form .w-jg .jgb {
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    display: flex;
    gap: 24px;
    justify-content: space-between;
    align-items: center
}

#modal_view_order_detail .step-order-form .w-btn {
    padding: 24px 0;
    display: flex;
    gap: 24px;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #d5d7db
}

#modal_view_order_detail .step-order-form .w-btn .left {
    flex: 0 0 auto;
    width: auto;
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_view_order_detail .step-order-form .w-btn .right {
    flex: 1 1 57%;
    width: 57%
}

#modal_view_order_detail .step-order-form .w-btn .right button:disabled {
    background: silver
}

#modal_view_order_detail .step-order-form .w-btn .right button {
    display: flex;
    width: 100%;
    height: 56px;
    padding: 0 32px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: var(--Primary, #ff6a00);
    color: var(--White, #fff);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_view_order_detail .step-order-form .lack .left, #modal_view_order_detail .step-order-form .lack .right, #modal_view_order_detail .step-order-form .lack span {
    color: #f4361e !important
}

#modal_view_order_detail .step-order-form .lack .pinkbox {
    border-radius: 4px;
    background: #ffedeb;
    padding: 8px 12px;
    display: block;
    text-align: center;
    color: var(--Danger, #f4361e);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_view_order_detail .step-order-complete {
    display: none
}

#modal_view_order_detail .step-order-complete .w-onum {
    padding: 16px 0
}

#modal_view_order_detail .step-order-complete .w-onum p {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_view_order_detail .step-order-complete .w-deliv {
    padding: 16px 0;
    border-bottom: 1px solid var(--Line-Deep, #d5d7db)
}

#modal_view_order_detail .step-order-complete .w-deliv ul {
    padding: 12px 0
}

#modal_view_order_detail .step-order-complete .w-deliv ul li {
    height: 40px;
    line-height: 40px;
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

#modal_view_order_detail .step-order-complete .w-deliv ul li .left {
    width: 136px;
    flex: 0 0 136px
}

#modal_view_order_detail .step-order-complete .w-deliv ul li .right {
    flex: 1 1 auto;
    width: auto;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_view_order_detail .step-order-complete .w-cust {
    margin: 24px 0;
    padding: 24px;
    border-radius: 16px;
    background: var(--BG-Cool-Gray, #f2f4f7);
    width: 100%
}

#modal_view_order_detail .step-order-complete .w-cust .bl {
    color: var(--Link, #04c);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    margin-bottom: 16px
}

#modal_view_order_detail .step-order-complete .w-cust .t {
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px;
    margin-bottom: 12px
}

#modal_view_order_detail .step-order-complete .w-cust ul li {
    display: flex;
    align-items: center
}

#modal_view_order_detail .step-order-complete .w-cust ul li .left {
    width: 88px;
    flex: 0 0 88px;
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_view_order_detail .step-order-complete .w-cust ul li .right {
    flex: 1 1 auto;
    width: auto;
    color: var(--Text-Primary, #171717);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_view_order_detail .step-order-complete .w-banner img {
    border-radius: 12px;
    background: var(--Text-Primary, #171717);
    width: 100%;
    object-fit: cover;
    aspect-ratio: 620/114
}

#body_cs .swiper.faqtab.psnb {
    margin: 0 auto;
    width: fit-content
}

#body_login main {
    padding: 120px 0 180px
}

#body_login .wrap1280 > * {
    text-align: center;
    margin-left: auto;
    margin-right: auto
}

#body_login h2 {
    color: #171717;
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .2px
}

#body_login h2 ~ p {
    color: var(--Text-Secondary, #5b5b5b);
    text-align: center;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#body_login .loginp {
    color: #5b5b5b;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: .2px
}

#body_login .loginimg {
    margin-top: 72px
}

#body_login button.btn-begin, #body_login button.btn-id-cert {
    margin-top: 32px;
    display: flex;
    width: 394px;
    max-width: 100%;
    height: 56px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: #ff6a00;
    color: #fff;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#body_login .form-wrapper {
    width: 816px;
    max-width: 100%;
    margin: 40px auto 0;
    text-align: initial
}

.red {
    color: #c00;
    font-size: 16px;
    font-style: normal;
    font-weight: 400
}

#body_loginform, #body_loginform #wrap, #body_loginform main {
    min-width: initial !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: initial !important
}

#body_loginform .wrap1280.flex {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    min-height: fit-content;
    padding: 100px 20px
}

#body_loginform .wrap-login {
    width: 560px;
    margin-left: auto;
    margin-right: auto
}

#body_loginform h2 img {
    width: 224px;
    height: auto;
    margin-left: auto;
    margin-right: auto
}

#body_loginform .box-login {
    margin: 48px 0;
    padding: 48px 32px 32px;
    display: flex;
    flex-direction: column;
    border-radius: 16px;
    border: 1px solid #ebebeb
}

#body_loginform .box-login ul {
    display: flex;
    flex-direction: column;
    gap: 24px
}

#body_loginform .box-login label {
    display: flex;
    flex-direction: column;
    gap: 8px
}

#body_loginform .box-login label span {
    color: #5b5b5b;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .2px
}

#body_loginform .box-login label input {
    color: #171717;
    font-size: 16px;
    font-weight: 400;
    display: flex;
    width: 100%;
    height: 48px;
    padding: 0 16px;
    align-items: center;
    border-radius: 8px;
    border: 1px solid #d5d7db
}

#body_loginform .fl {
    display: flex;
    gap: 8px;
    justify-content: space-between;
    align-items: center
}

#body_loginform .fl > div:first-of-type {
    flex: 1
}

#body_loginform .fl > div:last-of-type {
    flex: 0 0 137px
}

#body_loginform h2 ~ p {
    color: var(--Text-Secondary, #5b5b5b);
    text-align: center;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#body_loginform .w-sec {
    position: absolute;
    display: block;
    right: 16px;
    top: 50%;
    transform: translateY(-50%)
}

#body_loginform h2 {
    color: var(--Text-Primary, #171717);
    text-align: center;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .2px;
    margin-bottom: 24px
}

#body_loginform .btn-cert {
    display: flex;
    width: 137px;
    height: 48px;
    padding: 0 32px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: var(--Text-Secondary, #5b5b5b);
    color: var(--White, #fff);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#body_loginform .w-fp {
    display: flex;
    justify-content: right
}

#body_loginform .w-fp a {
    flex: 0 0 fit-content
}

#body_loginform .wrap-btn-go-login {
    padding: 56px 0
}

#body_loginform .btn-go-login, #body_loginform .wrap-btn-go-login button {
    display: flex;
    width: 100%;
    height: 56px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    color: #fff;
    background: #ff6a00;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: .2px
}

#body_loginform .btn-go-login.gray, #body_loginform .btn-go-login:disabled {
    background: #d9d9d9
}

.box-banner {
    width: 100%;
    height: 184px;
    border-radius: 12px;
    background: #2a2d34;
    padding: 24px 32px;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.box-banner p {
    color: #fff;
    font-size: 28px;
    font-style: normal;
    font-weight: 400
}

#body_loginform .box-login p {
    color: var(--Text-Secondary, #5b5b5b);
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#body_loginform .box-login p.red {
    color: var(--Danger, #f4361e);
    font-weight: 600;
    margin-bottom: 20px
}

.box-banner strong {
    font-style: normal;
    font-weight: 700
}

.wrap-gridboard-egd1 .slist {
    display: grid;
    gap: 40px 24px;
    grid-template-columns:repeat(4, 1fr);
    margin-bottom: 28px
}

.wrap-gridboard-egd1 .item {
    overflow-x: hidden;
    width: 100%;
    max-width: 100%
}

.wrap-gridboard-egd1 .boximg {
    width: 100%;
    aspect-ratio: 322/176;
    border-radius: 8px;
    overflow: hidden
}

.wrap-gridboard-egd1 .boximg img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.wrap-gridboard-egd1 .boxtxt {
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px
}

.mt8 {
    margin-top: 8px !important
}

.mt16 {
    margin-top: 16px !important
}

.boxtxt .flex {
    display: flex;
    gap: 8px;
    align-items: center
}

.istatus {
    display: flex;
    padding: 0 12px;
    height: 24px;
    align-items: center;
    border-radius: 100px;
    background: #3262a6;
    color: #fff;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    flex: 0 0 fit-content;
    width: fit-content;
    letter-spacing: .2px
}

.istatus3 {
    display: flex;
    padding: 0 12px;
    height: 20px;
    align-items: center;
    border-radius: 100px;
    background: #3262a6;
    color: #fff;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    flex: 0 0 fit-content;
    width: fit-content;
    letter-spacing: .2px
}

.istatus2 {
    display: flex;
    padding: 0 12px;
    height: 24px;
    align-items: center;
    border-radius: 100px;
    background: #e4e4e4;
    color: #848484;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    flex: 0 0 fit-content;
    width: fit-content;
    letter-spacing: .2px
}

.boxtxt .flex span {
    color: #171717;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.wrap-gridboard-egd1 .boxtxt .ellipsis2 {
    color: #171717;
    font-size: 20px;
    font-style: normal;
    font-weight: 600
}

.wrap-gridboard-egd1 .boxtxt .date {
    color: #949494;
    font-size: 16px;
    font-style: normal;
    font-weight: 500
}

#body_egd .input-search {
    width: 320px
}

.swiper.egd-tabs {
    width: 100%;
    overflow: hidden;
    flex: 1 1 auto
}

.swiper.egd-tabs .swiper-wrapper {
    display: flex;
    justify-content: start;
    align-items: center
}

.swiper.egd-tabs .swiper-slide {
    flex: 0 0 fit-content
}

.swiper.egd-tabs .swiper-slide a, .swiper.egd-tabs .swiper-slide button {
    width: fit-content;
    flex: 0 0 fit-content;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 38px;
    padding: 0 12px;
    border-radius: 99px;
    font-size: 20px;
    background: #f2f2f2;
    color: #171717;
    font-weight: 500
}

.swiper.egd-tabs .swiper-slide a.on, .swiper.egd-tabs .swiper-slide button.on {
    background: #404040;
    color: #fff;
    font-weight: 500
}

#body_egd .wrap-tabs {
    margin: 42px 0 40px
}

.swiper.wrap-cpn {
    margin-top: 24px;
    margin-bottom: 24px
}

.swiper.wrap-cpn .swiper-wrapper {
    display: flex;
    justify-content: start;
    align-items: start
}

.swiper.wrap-cpn .swiper-slide {
    flex: 0 0 100px;
    width: 100px;
    text-align: center
}

.swiper.wrap-cpn .swiper-slide a, .swiper.wrap-cpn .swiper-slide button {
    width: 100px;
    flex: 0 0 100px
}

.swiper.wrap-cpn .circle {
    width: 100px;
    height: 100px;
    border-radius: 100px;
    border: 1px solid #b3b3b3;
    background: #f5f5f5;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 25px 17px;
    margin-bottom: 20px
}

.swiper.wrap-cpn .circle img {
    width: 100%;
    height: 100%;
    object-fit: contain
}

.my24pxbt {
    padding: 24px 0 !important;
    border-bottom: 1px solid #e9ebee !important;
    margin: 0 !important
}

.wrap-gridboard-egd2:last-of-type {
    border-bottom: 0
}

h3.jy {
    color: #171717;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .15px;
    padding: 12px 0
}

h3.jy + p {
    color: #5b5b5b;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.wrap-gridboard-egd2 .slist {
    display: grid;
    gap: 40px 24px;
    grid-template-columns:repeat(4, 1fr)
}

.wrap-gridboard-egd2 .item {
    overflow-x: hidden;
    width: 100%;
    max-width: 100%
}

.wrap-gridboard-egd2 .boximg {
    width: 100%;
    aspect-ratio: 322/176;
    border-radius: 8px;
    overflow: hidden;
    position: relative
}

.wrap-gridboard-egd2 .boximg.new::after {
    content: 'New';
    position: absolute;
    display: block;
    width: 50px;
    height: 28px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    left: 9px;
    top: 7px;
    border-radius: 99px;
    background: #ff0004;
    z-index: 2
}

.wrap-gridboard-egd2 .boximg img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.wrap-gridboard-egd2 .boxtxt {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px
}

.wrap-gridboard-egd2 .ellipsis2 {
    color: #171717;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    word-break: keep-all;
    word-wrap: break-word
}

.wrap-gridboard-egd2 .date {
    color: #949494;
    font-size: 16px;
    font-style: normal;
    font-weight: 500
}

.btn-more-view {
    display: flex;
    justify-content: center;
    align-items: center;
    width: fit-content;
    padding: 10px;
    gap: 4px;
    color: #595959;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    margin: 10px auto
}

.wrap-banner-top {
    padding-top: 52px;
    width: 100%;
    max-width: 1920px;
    margin: 0 auto
}

.pt52 {
    padding-top: 52px !important
}

.wrap-gridboard-egd3 {
    margin: 24px 0
}

.wrap-gridboard-egd3 .slist {
    display: grid;
    gap: 48px 30px;
    grid-template-columns:repeat(4, 1fr)
}

.boxtxt .idate {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.wrap-gridboard-egd3 .boximg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 287/162;
    border-radius: 8px
}

.wrap-gridboard-egd3 .boxtxt {
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 6px
}

.wrap-gridboard-egd3 .boxtxt .flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #949494;
    font-size: 16px;
    font-style: normal;
    font-weight: 500
}

.wrap-gridboard-egd3 .flex .pcat {
    flex: 0 0 fit-content;
    width: fit-content;
    display: flex;
    padding: 2px 8px;
    justify-content: center;
    align-items: center;
    color: #24b129;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    border-radius: 99px;
    background: #ddf5de
}

.wrap-gridboard-egd3 .boxtxt .ellipsis1 {
    color: #171717;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

.wrap-gridboard-egd3 .boxtxt .ellipsis2 {
    color: #5b5b5b;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#body_product.body_egd .wrap-btn {
    padding: 105px 0 195px
}

#body_product.body_egd .btn-apply-product {
    margin: 0 auto;
    width: 367px;
    height: 56px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 12px;
    background: #f57f20;
    color: #fff;
    font-size: 20px;
    font-style: normal;
    font-weight: 600
}

#body_product.body_egd .bg-gray {
    padding: 112px 0 116px
}

#body_egd .graybox, #body_esti .graybox {
    padding: 24px;
    border-radius: 16px;
    background: var(--BG-Warm-Gray, #f7f7f7)
}

#body_egd .graybox ul li, #body_esti .graybox ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    height: 48px
}

#body_egd .graybox ul li .left, #body_esti .graybox ul li .left {
    flex: 0 0 128px;
    width: 128px
}

#body_egd .graybox ul li .right, #body_esti .graybox ul li .right {
    flex: 1 1 auto;
    width: auto;
    color: var(--Text-Primary, #171717);
    font-weight: 400;
    letter-spacing: .2px
}

#body_egd .form-egd, #body_esti .form-egd {
    max-width: 100%;
    width: 816px;
    margin: 40px auto 0
}

.m0w100 {
    width: 100% !important;
    margin: 0 !important
}

.m0 {
    margin: 0 !important
}

.jcleft {
    justify-content: left !important
}

.h160 {
    height: 160px !important
}

#body_egd .form-egd .select, #body_egd .form-egd input[type=email], #body_egd .form-egd input[type=number], #body_egd .form-egd input[type=tel], #body_egd .form-egd input[type=text], #body_egd .form-egd textarea, #body_esti .form-egd .select, #body_esti .form-egd input[type=email], #body_esti .form-egd input[type=number], #body_esti .form-egd input[type=tel], #body_esti .form-egd input[type=text], #body_esti .form-egd textarea {
    width: 100%;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    height: 40px
}

#body_egd .form-egd textarea, #body_esti .form-egd textarea {
    height: 98px;
    padding: 12px 16px;
    border-radius: 8px;
    border: 1px solid #d5d7db;
    background: #fff
}

#body_egd .form-egd label.chkbox, #body_esti .form-egd label.chkbox {
    display: flex;
    justify-content: center
}

#body_egd .form-egd label.chkbox span, #body_esti .form-egd label.chkbox span {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#body_egd .form-wrapper .list-item, #body_esti .form-wrapper .list-item {
    padding-bottom: 52px;
    margin-bottom: 0;
    border-bottom: 0
}

#body_egd .wrap-btn, #body_esti .wrap-btn, #body_product .wrap-btn {
    margin-top: 58px;
    display: flex;
    gap: 8px;
    justify-content: space-between;
    align-items: center
}

#body_egd .wrap-btn .btn-prev, #body_esti .wrap-btn .btn-prev, #body_product .wrap-btn .btn-prev {
    flex: 0 0 200px;
    display: flex;
    width: 200px;
    height: 56px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    border: 1px solid #ddd;
    color: #171717;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#body_egd .wrap-btn .btn-register, #body_esti .wrap-btn .btn-register, #body_product .wrap-btn .btn-register {
    flex: 1 1 auto;
    display: flex;
    width: 100%;
    height: 56px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: #ff6a00;
    color: #fff;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#body_egd .board-survey .wrap-board-head {
    padding: 24px 0 24px;
    margin: 0 0 24px;
    border-bottom: 1px solid #f2f4f7
}

#body_egd .board-survey .box-exp {
    width: 100%;
    padding: 20px;
    border-radius: 12px;
    background: #f7f7f7;
    color: #171717;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    margin-top: 12px;
    letter-spacing: .2px
}

#body_egd .board-survey .box-exp .dotli > li::after {
    background-color: #171717
}

#body_egd .board-survey .box-exp ul > li > ul > li {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    line-height: 24px
}

#body_egd .wrap-dp .w1 {
    padding: 160px 0;
    background: #fafafa
}

#body_egd .wrap-dp .w2 {
    padding: 200px 0 160px;
    background: #fff
}

#body_egd .wrap-dp .w3 {
    padding: 160px 0;
    background: #fafafa
}

#body_egd .wrap-dp .w4 {
    padding: 64px 0;
    background: #fff;
    margin: 0 auto;
    width: fit-content
}

.pb0 {
    padding-bottom: 0 !important
}

#body_egd .wrap-dp .w4 button {
    display: flex;
    height: 56px;
    padding: 0 64px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: var(--Primary, #ff6a00);
    color: var(--White, #fff);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#body_egd .wrap-dp .titbox {
    padding: 0;
    color: #303030;
    text-align: center;
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: -.88px
}

.h2 {
    color: #171717;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: .2px
}

#body_egd .wrap-dp .titbox ~ p {
    color: #303030;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: -.44px;
    text-align: center;
    margin: 40px 0 80px
}

#body_egd .wrap-dp .w1 .cardbox {
    display: flex;
    gap: 40px;
    justify-content: space-between;
    align-items: stretch;
    width: 100%
}

#body_egd .wrap-dp .w1 .card {
    flex: 1 1 auto;
    width: auto;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 8px 24px 0 #e8e8e8;
    padding: 48px 0
}

#body_egd .wrap-dp .w1 .card .imgbox img {
    width: 100%;
    aspect-ratio: 373/170
}

#body_egd .wrap-dp .w1 .card .tit {
    color: #303030;
    text-align: center;
    font-size: 23px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: -.506px;
    padding: 36px 32px
}

#body_egd .wrap-dp .w1 .card .exp {
    display: flex;
    flex-direction: column;
    gap: 28px;
    padding: 0 32px
}

#body_egd .wrap-dp .w1 .card .exp li {
    color: #303030;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: -.352px;
    gap: 8px;
    display: flex;
    justify-content: space-between;
    align-items: start
}

#body_egd .wrap-dp .w1 .card .exp li > div {
    flex: 1 1 auto;
    width: auto
}

#body_egd .wrap-dp .w1 .card .exp li::before {
    content: '';
    display: block;
    background: url(/assets/images/board/ichk.svg) no-repeat left top 5px;
    width: 14px;
    height: 20px;
    flex: 0 0 14px
}

#body_egd .wrap-dp .swiper.w2tab {
    width: fit-content;
    margin: 72px auto 0
}

#body_egd .wrap-dp .swiper.w2tab .swiper-slide {
    width: fit-content;
    height: 56px;
    color: #606060;
    text-align: center;
    font-size: 22px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: -.484px;
    border-bottom: 3px solid transparent;
    cursor: pointer
}

#body_egd .wrap-dp .swiper.w2tab .swiper-slide.on {
    color: #303030;
    border-bottom: 3px solid #ff6501;
    font-weight: 700
}

#body_egd .wrap-dp .w2 .w2-cont {
    display: none
}

#body_egd .wrap-dp .w2 .w2-cont .exp {
    display: flex;
    justify-content: space-between;
    gap: 88px;
    align-items: center;
    margin-top: 160px
}

#body_egd .wrap-dp .w2 .w2-cont .exp:nth-of-type(2n) {
    flex-direction: row-reverse
}

#body_egd .wrap-dp .w2 .w2-cont .exp .imgbox, #body_egd .wrap-dp .w2 .w2-cont .exp .txtbox {
    flex: 1
}

#body_egd .wrap-dp .w2 .w2-cont .exp .txtbox .tit {
    color: #303030;
    font-size: 38px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: -.836px
}

#body_egd .wrap-dp .w2 .w2-cont .exp .txtbox .ext {
    color: #303030;
    font-size: 19px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: -.418px;
    margin-top: 56px
}

#body_egd .wrap-dp .w2 .w2-cont .exp:nth-of-type(2n) .txtbox * {
    text-align: right
}

#body_egd .wrap-dp .w3 .cardbox {
    display: grid;
    grid-template-columns:repeat(2, 1fr);
    gap: 24px;
    margin-top: 40px
}

#body_egd .wrap-dp .w3 .cardbox .card {
    display: flex;
    gap: 32px;
    justify-content: space-between;
    align-items: start;
    padding: 40px;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 8px 24px 0 #e8e8e8
}

#body_egd .wrap-dp .w3 .cardbox .left {
    flex: 0 0 72px;
    width: 72px
}

#body_egd .wrap-dp .w3 .cardbox .right .tit {
    color: #303030;
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: -.616px
}

#body_egd .wrap-dp .w3 .cardbox .right .exp {
    margin-top: 25px;
    color: #606060;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: -.44px
}

#body_egd .wrap-dp .w3 .cardbox .right {
    flex: 1
}

.board-survey-list {
    display: flex;
    flex-direction: column;
    gap: 20px
}

.board-survey-list .item {
    display: flex;
    width: 100%;
    padding: 16px 0;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    background: #fff;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.board-survey-list .item.closed {
    opacity: .5
}

.board-survey-list .item .left {
    flex: 0 0 192px;
    width: 192px
}

.board-survey-list .item .left img {
    aspect-ratio: 192/108;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid var(--Line-Warm-Gray, #f0f0f0)
}

.board-survey-list .item .right {
    flex: 0 0 fit-content;
    width: fit-content;
    text-align: right;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    display: flex;
    gap: 8px;
    align-items: center
}

/*.board-survey-list .item img {*/
/*    filter: grayscale(100%)*/
/*}*/

.board-survey-list .item .right::before {
    content: url(/assets/images/icon_point.svg);
    display: block;
    width: 24px;
    height: 24px
}

.board-survey-list .item.closed .right::before {
    filter: grayscale(100%)
}

.board-survey-list .item .ellipsis1, .board-survey-list .item .mid {
    flex: 1 1 auto;
    min-width: 0
}

.board-survey-list .item .title {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 12px;
    margin-bottom: 20px
}

.board-survey-list .item .title .ellipsis1 {
    color: var(--Text-Primary, #171717);
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

.board-survey-list .item .mid > p {
    margin-top: 6px
}

#modal_window_survey .modal_inner {
    max-width: 100%;
    width: 940px;
    background: #fff;
    position: relative;
    height: initial
}

#modal_window_survey .window-head {
    position: block;
    width: 100%;
    left: 0;
    top: 0;
    display: flex;
    padding: 4px 12px;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #ccc;
    background: #f8f9fa
}

#modal_window_survey .wrap-window-btn {
    display: flex;
    gap: 24px
}

#modal_window_survey .window-body {
    padding: 40px;
    width: 880px;
    max-width: 100%;
    margin: 0 auto
}

#modal_window_survey .window-body .titlebox {
    color: var(--Text-Primary, #171717);
    padding: 0;
    margin: 0;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 56px;
    letter-spacing: .2px
}

#modal_window_survey .window-body .wcon {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 4px;
    padding: 24px 0
}

#modal_window_survey .window-body .wcon .qq {
    margin-top: 2px;
    flex: 0 0 40px;
    color: var(--Primary, #ff6a00);
    font-family: "Gmarket Sans";
    font-size: 20px;
    font-style: normal;
    font-weight: 400
}

#modal_window_survey .window-body .wcon .right {
    flex: 1
}

#modal_window_survey .window-body .wcon .right h3 {
    color: var(--Text-Primary, #171717);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_window_survey .window-body .wcon .right h3 small {
    font-size: 14px;
    font-weight: 400
}

#modal_window_survey .window-body .wcon .item {
    margin-top: 12px
}

#modal_window_survey .window-body .wcon .item > li {
    margin-top: 8px
}

#modal_window_survey .window-body .wcon .item span {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_window_survey .window-body .wbt {
    margin-top: 64px
}

#modal_window_survey .window-body .wbt .btn-survey-submit {
    display: flex;
    height: 56px;
    padding: 0 32px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: var(--Primary, #ff6a00);
    color: var(--White, #fff);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    margin: 0 auto
}

#modal_window_survey .btn-min-window {
    display: none
}

#modal_window_survey.max .btn-min-window {
    display: block
}

#modal_window_survey.max .window-body {
    padding: 120px 30px;
    min-height: 100vh
}

#modal_window_survey.max .btn-max-window {
    display: none
}

#modal_window_survey.max .modal_popup {
    padding: 0 !important;
    top: initial !important;
    transform: initial !important;
    width: 100% !important;
    position: block !important;
    left: initial !important;
    max-width: initial !important
}

#modal_window_survey.max .modal_inner {
    width: 100%;
    height: 100%
}

#modal_window_survey.max .window-head {
    position: fixed
}

#modal_view_order_detail .modal_inner {
    max-width: 100%;
    width: 700px;
    background: #fff;
    position: relative;
    height: initial
}

#modal_view_order_detail .window-head {
    position: relative;
    width: 100%;
    left: 0;
    top: 0;
    display: flex;
    padding: 4px 12px;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #ccc;
    background: #f8f9fa
}

#modal_view_order_detail .wrap-window-btn {
    display: flex;
    gap: 24px
}

#modal_view_order_detail .window-body {
    padding: 24px 47px 32px;
    margin: 0 auto;
    min-height: 100vh
}

#modal_view_order_detail .btn-min-window {
    display: none
}

#modal_view_order_detail.max .btn-min-window {
    display: block
}

#modal_view_order_detail.max .window-body {
    padding: 57px 47px 32px;
    min-height: 100vh
}

#modal_view_order_detail.max .btn-max-window {
    display: none
}

#modal_view_order_detail.max .modal_popup {
    padding: 0 !important;
    top: initial !important;
    transform: initial !important;
    width: 100% !important;
    position: block !important;
    left: initial !important;
    max-width: initial !important
}

#modal_view_order_detail.max .modal_inner {
    width: 100%;
    height: 100%
}

#modal_view_order_detail.max .window-head {
    position: fixed
}

#modal_view_order_detail h4 {
    color: var(--Text-Primary, #171717);
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 56px;
    letter-spacing: .2px
}

#modal_view_order_detail dd {
    padding-bottom: 16px;
    border-bottom: 1px solid #d5d7db
}

#modal_view_order_detail dt {
    color: var(--Text-Primary, #171717);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 56px;
    letter-spacing: .15px;
    padding-top: 16px
}

#modal_view_order_detail .dinfo li {
    padding: 10px 0;
    color: var(--Text-Primary, #171717);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    display: flex;
    justify-content: space-between;
    align-items: center
}

#modal_view_order_detail .dinfo li .left {
    flex: 0 0 112px;
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_view_order_detail .dinfo li .right {
    flex: 1
}

#modal_view_order_detail .ordernum {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_view_order_detail .dinfo ~ button {
    margin: 12px 0
}

#modal_view_order_detail .graybox {
    margin: 24px 0 24px;
    border-radius: 16px;
    background: var(--BG-Cool-Gray, #f2f4f7);
    padding: 20px;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

#modal_view_order_detail .graybox li {
    display: flex;
    align-items: center;
    margin-top: 4px
}

#modal_view_order_detail .graybox li .left {
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    flex: 0 0 88px
}

#modal_view_order_detail .graybox li .right {
    flex: 1
}

#modal_view_order_detail .graybox .bl {
    color: var(--Link, #04c);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    margin-bottom: 16px
}

#modal_view_order_detail .graybox .tt {
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px;
    margin-bottom: 10px
}

.mt32bt {
    border-top: 1px solid var(--Line-Deep, #d5d7db);
    padding-top: 32px
}

.mb32bb {
    border-bottom: 1px solid var(--Line-Deep, #d5d7db);
    padding-bottom: 32px
}

#modal_view_order_detail .sum {
    margin: 52px 0 20px;
    display: flex;
    gap: 12px;
    flex-direction: column
}

#modal_view_order_detail .sum li {
    display: flex;
    gap: 20px;
    justify-content: space-between;
    align-items: center
}

#modal_view_order_detail .sum .sbj {
    color: var(--Text-Tertiary, #8e8e8e);
    font-weight: 500;
    letter-spacing: .2px
}

#modal_view_order_detail .sum .sbj2 {
    color: var(--Text-Tertiary, #171717);
    font-size: 18px;
    font-weight: 500;
    letter-spacing: .2px
}

#modal_view_order_detail .pr1 {
    color: var(--Text-Primary, #171717);
    text-align: right;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_view_order_detail .pr2 {
    color: var(--Link, #04c);
    text-align: right;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_view_order_detail .pr3 {
    color: var(--Link, #04c);
    text-align: right;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#modal_view_order_detail .pr4 {
    color: var(--Text-Primary, #171717);
    text-align: right;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

#wrapper_cnc {
    padding: 52px 0 64px
}

.bb1 {
    border-bottom: 1px solid #e9ebee
}

#wrapper_cnc .swiper.cnc-lnb {
    margin-top: 52px;
    width: 100%;
    overflow: hidden
}

#wrapper_cnc .swiper.cnc-lnb .swiper-wrapper {
    display: flex;
    justify-content: start;
    align-items: center
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide {
    flex: 0 0 115px;
    width: 115px;
    overflow: hidden
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide a {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
    width: 100%
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide a .imgbox {
    width: 40px;
    height: 40px;
    margin: 0 auto
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide a p {
    color: #7b7b7b;
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    white-space: nowrap;
    padding-top: 12px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide a.on p {
    color: #f57f20;
    font-weight: 700;
    border-bottom: 2px solid #f57f20
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide a.on .imgbox {
    border-radius: 40px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:first-of-type a .imgbox {
    background: url(/assets/images/cnc/lnb_01.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:first-of-type a.on .imgbox {
    background: #f57f20 url(/assets/images/cnc/lnb_01_on.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(2) a .imgbox {
    background: url(/assets/images/cnc/lnb_02.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(2) a.on .imgbox {
    background: #f57f20 url(/assets/images/cnc/lnb_02_on.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(3) a .imgbox {
    background: url(/assets/images/cnc/lnb_03.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(3) a.on .imgbox {
    background: #f57f20 url(/assets/images/cnc/lnb_03_on.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(4) a .imgbox {
    background: url(/assets/images/cnc/lnb_04.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(4) a.on .imgbox {
    background: #f57f20 url(/assets/images/cnc/lnb_04_on.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(5) a .imgbox {
    background: url(/assets/images/cnc/lnb_05.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(5) a.on .imgbox {
    background: #f57f20 url(/assets/images/cnc/lnb_05_on.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(6) a .imgbox {
    background: url(/assets/images/cnc/lnb_06.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(6) a.on .imgbox {
    background: #f57f20 url(/assets/images/cnc/lnb_06_on.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(7) a .imgbox {
    background: url(/assets/images/cnc/lnb_07.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(7) a.on .imgbox {
    background: #f57f20 url(/assets/images/cnc/lnb_07_on.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(8) a .imgbox {
    background: url(/assets/images/cnc/lnb_08.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(8) a.on .imgbox {
    background: #f57f20 url(/assets/images/cnc/lnb_08_on.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(9) a .imgbox {
    background: url(/assets/images/cnc/lnb_09.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(9) a.on .imgbox {
    background: #f57f20 url(/assets/images/cnc/lnb_09_on.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(10) a .imgbox {
    background: url(/assets/images/cnc/lnb_10.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.cnc-lnb .swiper-slide:nth-of-type(10) a.on .imgbox {
    background: #f57f20 url(/assets/images/cnc/lnb_10_on.svg) no-repeat center center/24px 24px
}

#wrapper_cnc .swiper.partner-list {
    margin-bottom: 20px;
    width: 100%;
    overflow: hidden
}

#wrapper_cnc .wrap-swiper-button-next, #wrapper_cnc .wrap-swiper-button-prev {
    width: 72px;
    height: 100%;
    top: 0;
    position: absolute;
    z-index: 2;
    display: flex;
    align-items: center
}

#wrapper_cnc .wrap-swiper-button-prev {
    left: 0;
    background: linear-gradient(90deg, #fff 60%, rgba(255, 255, 255, 0) 100%);
    justify-content: left
}

#wrapper_cnc .wrap-swiper-button-next {
    right: 0;
    background: linear-gradient(270deg, #fff 60%, rgba(255, 255, 255, 0) 100%);
    justify-content: right
}

#wrapper_cnc .wrap-swiper-button-next button, #wrapper_cnc .wrap-swiper-button-prev button {
    width: 44px;
    height: 44px;
    border: 1px solid #d5d7db;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100px
}

#wrapper_cnc .wrap-swiper-button-next.swiper-button-disabled, #wrapper_cnc .wrap-swiper-button-prev.swiper-button-disabled {
    display: none
}

#wrapper_cnc .swiper.partner-list .swiper-wrapper {
    display: flex;
    justify-content: start;
    align-items: center
}

#wrapper_cnc .swiper.partner-list .swiper-slide {
    flex: 0 0 240px;
    width: 240px;
    display: flex;
    align-items: stretch;
    border-radius: 12px;
    border: 1px solid #d5d7db;
    overflow: hidden
}

#wrapper_cnc .swiper.partner-list .swiper-slide .imgbox {
    width: 100%;
    aspect-ratio: 240/88
}

#wrapper_cnc .swiper.partner-list .swiper-slide .imgbox img {
    max-width: 100%;
    width: 100%;
    height: 100%;
    object-fit: cover
}

#wrapper_cnc .swiper.partner-list .swiper-slide .txtbox {
    padding: 0 20px;
    height: 52px;
    border-top: 1px solid var(--Line-Deep, #d5d7db);
    background: var(--BG-Warm-Gray, #f7f7f7);
    display: flex;
    justify-content: start;
    align-items: center
}

#wrapper_cnc .swiper.partner-list .swiper-slide .txtbox .ellipsis1 {
    color: #272727;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

#wrapper_cnc h3.partner-h3 {
    margin: 20px 0 16px;
    color: var(--Text-Primary, #171717);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .15px
}

#body_cnc .list-board.cs1 li:first-of-type {
    width: 64px;
    flex: 0 0 64px;
    justify-content: center
}

#body_cnc .list-board.cs1 li:nth-of-type(2) {
    display: none
}

#body_cnc .list-board.cs1 li:nth-of-type(3) {
    width: auto;
    flex: 1 1 auto;
    justify-content: start
}

#body_cnc .list-board.cs1 li:nth-of-type(4) {
    width: 164px;
    flex: 0 0 164px;
    justify-content: center
}

#body_cnc .list-board.cs1 li:nth-of-type(5) {
    width: 76px;
    flex: 0 0 76px
}

#body_cnc .list-board.cs1 li:nth-of-type(6) {
    width: 56px;
    flex: 0 0 56px
}

#body_cnc .list-board.cs3 li:first-of-type {
    width: 64px;
    flex: 0 0 64px;
    justify-content: center
}

#body_cnc .list-board.cs3 li:nth-of-type(2) {
    width: 164px;
    flex: 0 0 164px;
    justify-content: center
}

#body_cnc .list-board.cs3 li:nth-of-type(3) {
    width: auto;
    flex: 1 1 auto;
    justify-content: start
}

#body_cnc .list-board.cs3 li:nth-of-type(4) {
    width: 76px;
    flex: 0 0 76px
}

#body_cnc .list-board.cs3 li:nth-of-type(5) {
    width: 56px;
    flex: 0 0 56px
}

#body_cnc .list-board.cs2 li:first-of-type {
    width: 64px;
    flex: 0 0 64px;
    justify-content: center
}

/*
#body_cnc .list-board.cs2 li:nth-of-type(2) {
    display: none
}
*/

#body_cnc .list-board.cs2 li:nth-of-type(3) {
    width: auto;
    flex: 1 1 auto;
    justify-content: start
}

#body_cnc .list-board.cs2 li:nth-of-type(4) {
    width: 76px;
    flex: 0 0 76px
}

#body_cnc .list-board.cs2 li:nth-of-type(5) {
    width: 56px;
    flex: 0 0 56px
}

#wrapper_cnc.cnc2 {
    padding-top: 0
}

#wrapper_cnc.cnc2 .cnc_kv {
    width: 100%;
    height: 200px;
    background: #d9ecf3;
    margin-bottom: 112px
}

#wrapper_cnc.cnc2 .cnc_kv.bg2 {
    background: #f3e7d9
}

#wrapper_cnc.cnc2 .cnc_kv .wrap-event {
    height: 100%
}

#wrapper_cnc.cnc2 .cnc_kv .kv-box {
    width: calc(100% - 40px);
    height: 176px;
    border-radius: 16px;
    padding: 24px 40px;
    background: #fff;
    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, .12);
    border: 1px solid #f2f4f7;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, +50%)
}

#wrapper_cnc.cnc2 .cnc_kv .kv-wrap {
    display: flex;
    gap: 40px;
    justify-content: space-between;
    align-items: center
}

#wrapper_cnc.cnc2 .cnc_kv .imgbox {
    flex: 0 0 128px;
    width: 128px;
    height: 128px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 999px;
    border: 1px solid #e9ebee;
    background: #fff;
    overflow: hidden
}

#wrapper_cnc.cnc2 .cnc_kv .imgbox img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

#wrapper_cnc.cnc2 .cnc_kv .txtbox {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#wrapper_cnc.cnc2 .cnc_kv .cpart {
    display: flex;
    justify-content: center;
    align-items: center;
    width: fit-content;
    padding: 0 12px;
    height: 24px;
    border-radius: 99px;
    color: #5b5b5b;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    background: #f2f4f7;
    letter-spacing: .2px
}

#wrapper_cnc.cnc2 .cnc_kv .tit {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .2px
}

#wrapper_cnc.cnc2 .cnc_kv .btnbox {
    display: flex;
    flex: 0 0 fit-content;
    width: fit-content;
    justify-content: center;
    gap: 16px;
    align-items: center
}

#wrapper_cnc.cnc2 .cnc_kv .btnbox button {
    display: flex;
    width: 150px;
    padding: 12px 20px;
    justify-content: center;
    align-items: center;
    flex: 0 0 150px;
    color: #393939;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    border-radius: 99px;
    border: 1px solid #c2c2c2
}

#wrapper_cnc.cnc2 .subcat {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 20px;
    border-bottom: 1px solid #e9ebee
}

#wrapper_cnc.cnc2 .subcat a {
    padding: 0;
    height: 56px;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    display: flex;
    align-items: center;
    opacity: .5
}

#wrapper_cnc.cnc2 .subcat a.on {
    opacity: 1;
    border-bottom: 2px solid #171717
}

#wrapper_cnc.cnc2 .infobox {
    width: 100%;
    padding: 40px 0 200px
}

#wrapper_cnc.cnc2 .infobox .item-list {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%
}

#wrapper_cnc.cnc2 .infobox .item-list dl {
    display: flex;
    justify-content: space-between;
    align-items: start
}

#wrapper_cnc.cnc2 .infobox dt {
    width: 200px;
    flex: 0 0 200px;
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

#wrapper_cnc.cnc2 .infobox dd {
    flex: 1;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#wrapper_cnc.cnc2 .infobox dd img {
    vertical-align: bottom
}

#wrapper_cnc.cnc2 .infobox dd img {
    display: inline-block
}

.ml16 {
    margin-left: 16px !important
}

#wrapper_cnc.cnc2 .infobox .keywd {
    display: flex;
    gap: 12px;
    flex-wrap: wrap
}

#wrapper_cnc.cnc2 .infobox .keywd > li {
    display: flex;
    width: fit-content;
    padding: 0 16px;
    justify-content: center;
    align-items: center;
    border-radius: 99px;
    background: #f2f4f7;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px;
    white-space: nowrap
}

#wrapper_cnc .wrap-board-cnc2 .bhead {
    margin-bottom: 40px;
    display: flex;
    gap: 30px;
    align-items: center
}

#wrapper_cnc .wrap-board-cnc2 .bhead .left {
    flex: 0 0 fit-content;
    white-space: nowrap
}

#wrapper_cnc .wrap-board-cnc2 .bhead .right {
    flex: 1;
    min-width: 0
}

#wrapper_cnc.cnc2 .cnc_kv.s2 {
    background: #f3e7d9
}

#body_cnc .wrap-board-cnc2 .list-board li:first-of-type {
    width: 188px;
    flex: 0 0 188px;
    justify-content: start
}

#body_cnc .wrap-board-cnc2 .list-board dd li:first-of-type {
    color: #acacac;
    font-size: 20px;
    font-style: normal;
    font-weight: 500
}

#body_cnc .wrap-board-cnc2 .list-board li:nth-of-type(2) {
    width: auto;
    flex: 1 1 auto;
    justify-content: start
}

#body_cnc .wrap-board-cnc2 .list-board li:nth-of-type(3) {
    width: 191px;
    flex: 0 0 191px
}

#body_cnc .wrap-board-cnc2 .list-board li:nth-of-type(4) {
    width: 96px;
    flex: 0 0 96px
}

#body_esti .wrap-esti {
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
    align-items: start
}

#body_esti .wrap-esti .w-status {
    flex: 0 0 318px
}

#body_esti .wrap-esti .w-content {
    flex: 1
}

#body_esti .wrap-esti .w-status {
    display: flex;
    flex-direction: column;
    gap: 8px
}

#body_esti .wrap-esti .w-status li {
    display: flex;
    justify-content: left;
    align-items: start;
    gap: 8px
}

#body_esti .wrap-esti .w-status li:nth-of-type(odd) {
    filter: grayscale(100%);
    opacity: .35
}

#body_esti .wrap-esti .w-status li.done, #body_esti .wrap-esti .w-status li.on {
    filter: grayscale(0%);
    opacity: 1
}

#body_esti .wrap-esti .w-status li.done span img {
    content: url(/assets/images/esti/done.svg)
}

#body_esti .wrap-esti .w-status li span {
    flex: 0 0 48px;
    display: flex;
    justify-content: center;
    align-items: center
}

#body_esti .wrap-esti .w-status li .right {
    flex: 1;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

#body_esti .wrap-esti .w-status li small {
    color: var(--Text-Primary, #171717);
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#body_esti .wrap-esti .w-status li.done small, #body_esti .wrap-esti .w-status li.on small {
    color: var(--Text-Tertiary, #8e8e8e)
}

.w605 {
    width: 100%;
    max-width: 605px
}

.grid-dpt {
    display: grid;
    grid-template-columns:repeat(5, 1fr);
    margin: 24px 0;
    gap: 10px
}

.grid-dpt li {
    position: relative
}

.grid-dpt li label {
    display: flex;
    width: 100%;
    height: auto;
    min-height: 80px;
    /* Safari 호환을 위해 aspect-ratio 제거하고 min-height 사용 */
}

.grid-dpt label i, .grid-dpt label span {
    display: none;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.grid-dpt li label b {
    display: block;
    width: 100%;
    height: 100%
}

.grid-dpt li:first-of-type label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt1.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(2) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt2.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(3) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt3.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(4) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt4.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(5) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt5.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(6) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt6.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(7) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt7.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(8) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt8.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(9) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt9.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(10) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt10.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(11) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt11.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(12) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt12.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(13) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt13.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(14) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt14.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(15) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt15.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(16) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt16.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(17) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt17.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(18) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt18.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(19) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt19.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(20) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt20.png) no-repeat center center/100%
}

.grid-dpt li:nth-of-type(21) label input[type=checkbox] ~ b {
    background: url(/assets/images/esti/dpt21.png) no-repeat center center/100%
}

.grid-dpt li label input[type=checkbox]:checked ~ b:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    border: 2px solid #ff6a00
}

#body_esti .wrap-esti .w-btn {
    padding-top: 48px;
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: center
}

#body_esti .wrap-esti .w-btn .center {
    flex: 1;
    display: flex;
    justify-content: center
}

#body_esti .wrap-esti .w-btn .left {
    flex: 0 0 fit-content
}

#body_esti .wrap-esti .w-btn .right {
    flex: 1
}

#body_esti .wrap-esti .w-btn .center button {
    width: 393px;
    height: 56px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: var(--Primary, #ff6a00);
    color: var(--White, #fff);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#body_esti .wrap-esti .w-btn .left button {
    width: 200px;
    height: 56px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    border: 1px solid var(--Line-Deep, #d5d7db);
    background: var(--White, #fff);
    color: var(--Text-Primary, #171717);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#body_esti .wrap-esti .w-btn .right button {
    width: 100%;
    height: 56px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: var(--Primary, #ff6a00);
    color: var(--White, #fff);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.mb24 {
    margin-bottom: 24px
}

#body_esti .w-form {
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    display: flex;
    justify-content: space-between;
    align-items: start;
    padding: 24px 0;
    border-bottom: 1px solid #e9ebee
}

#body_esti .w-form .left {
    font-weight: 600;
    flex: 0 0 160px
}

#body_esti .w-form .right {
    flex: 1
}

#body_esti .w-form .right > ul {
    display: flex;
    flex-direction: column;
    gap: 16px
}

#body_esti .w-form .right > ul > li {
    display: flex;
    justify-content: space-between;
    align-items: center
}

#body_esti .w-form .right > ul > li .dt {
    flex: 1
}

#body_esti .w-form .right > ul > li .eainfo {
    flex: 0 0 fit-content
}

#body_esti .w-form .dt .chkbox {
    color: #5b5b5b
}

.table-esti {
    margin: 24px 0;
    border-radius: 12px;
    border: 1px solid #d5d7db;
    border-style: hidden;
    box-shadow: 0 0 0 1px #d5d7db;
    overflow: hidden
}

#body_esti .w-content h3 {
    color: #171717;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 26px;
    letter-spacing: .2px;
    text-align: left;
    padding: 24px 0 0
}

.table-esti tr {
    border: 1px solid #d5d7db
}

.table-esti th {
    border-left: 1px solid #d5d7db;
    background: #f2f4f7;
    padding: 12px 22px;
    text-align: left;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

.table-esti td {
    border-left: 1px solid #d5d7db;
    padding: 10px;
    text-align: center;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

#body_esti .w-done {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 56px 0
}

#body_esti .w-done p {
    padding: 12px 0 24px
}

.list-board.es1 li:first-of-type {
    width: auto;
    flex: 1 1 auto;
    justify-content: center
}

.list-board.es1 li:nth-of-type(2) {
    flex: 0 0 160px;
    justify-content: center
}

.list-board.es1 li:nth-of-type(3) {
    flex: 0 0 160px;
    justify-content: center
}

.list-board.es1 li:nth-of-type(4) {
    display: none !important;
    flex: 0 0 160px;
    justify-content: center
}

.w816 {
    width: 816px;
    max-width: 100%;
    margin: 0 auto;
    padding-top: 86px
}

#body_edge .grid-chart-1 {
    display: grid;
    grid-template-columns:repeat(3, 1fr);
    gap: 12px
}

.flex-col {
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: stretch;
    align-items: stretch
}

.grid-chart-1 .flex-col > div {
    flex: 1
}

.box-chart {
    border-radius: 12px;
    border: 1px solid #c1c1c1;
    background: #fff;
    overflow: hidden
}

.h-line {
    width: 100%;
    height: 1px;
    background: #ddd;
    margin: 64px 0
}

.flex-row {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 12px
}

.flex-row .left {
    flex: 0 0 66.3235%
}

.flex-row .right {
    flex: 1
}

#body_home #footer {
    background: #fff;
    border-top: 1px solid var(--Line-Cool-Gray, #e9ebee)
}

#footer {
    background: #f2f4f7;
    padding: 40px 0 40px;
    overflow: hidden;
    border-top: 1px solid var(--Line-Cool-Gray, #d5d7db)
}

#footer .footer_new {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 25px;
    width: 100%;
    align-items: start
}

#footer .wrap_footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: left;
    align-items: start;
    gap: 32px 64px;
    width: 100%
}

#footer .logo {
    flex: 0 0 fit-content
}

#footer .fmain {
    flex: 1 1 auto
}

#footer .family {
    flex: 0 0 fit-content
}

#footer a, #footer div {
    color: #5b5b5b;
    font-size: 12px;
    font-weight: 400;
    white-space: nowrap;
    line-height: 20px;
    letter-spacing: .2px
}

#footer .f1 {
    display: flex;
    margin-bottom: 4px;
    align-items: center;
    flex-wrap: wrap;
    justify-content: start;
    width: 240px
}

#footer .f1 a {
    position: relative;
    display: flex;
    align-items: center
}

#footer .f1 a::after {
    content: '';
    display: block;
    width: 1px;
    height: 8px;
    margin: 0 12px;
    background: #d5d7db
}

/*#footer .f1 a:nth-of-type(3n):after {*/
/*    display: none*/
/*}*/

#footer .f1 a:nth-of-type(6n):after {
    display: none
}

#footer .wall {
    display: block;
    width: 1px;
    height: 8px;
    margin: 0 12px;
    background: #d5d7db
}

#footer a.strong, #footer div.strong {
    font-weight: 700
}

/*#footer .f3 {*/
/*    font-weight: 600*/
/*}*/

/*#footer .f3 span {*/
/*    font-weight: 500*/
/*}*/

#footer div.copy {
    white-space: wrap
}

#footer .addr, #footer .fmfooter {
    padding-top: 12px
}

#footer .copy, #footer .num {
    padding-top: 4px
}

#footer .wall {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 25px;
    overflow: hidden
}

#footer .wall > * {
    position: relative
}

#footer .wall > :not(:last-of-type)::after {
    content: '|';
    position: absolute;
    display: block;
    width: 1px;
    height: 100%;
    top: 0;
    right: -13px
}

#footer .fmfooter a:first-of-type {
    color: #fff
}

#footer select {
    width: 240px;
    height: 40px;
    padding: 7px 16px;
    border-radius: 8px;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    position: relative;
    background: #262626 url(/assets/images/icon_selectbox_down.svg) no-repeat right 8px center
}

#footer select option {
    background: #262626;
    color: #fff;
    padding: 7px 16px
}

#footer_product {
    padding: 33px 0 154px;
    background: #eaeaea
}

#footer_product .link {
    color: #606060;
    font-size: 24px;
    font-weight: 500;
    letter-spacing: -.24px;
    display: flex;
    gap: 41px;
    align-items: center;
    flex-wrap: wrap
}

#footer_product .link > li {
    position: relative
}

#footer_product .link > li:not(:last-of-type)::after {
    content: '';
    position: absolute;
    display: block;
    width: 1px;
    height: 24px;
    top: 50%;
    transform: translateY(-50%);
    right: -20px;
    background: #c4c4c4
}

#footer_product .mflex {
    padding: 38px 0 20px;
    display: flex;
    gap: 20px;
    justify-content: space-between;
    align-items: start
}

#footer_product h2 {
    padding: 0;
    color: #565656;
    font-size: 28px;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: -.28px
}

#footer_product p {
    color: #8b8b8b;
    font-size: 24px;
    font-weight: 500;
    line-height: 150%;
    letter-spacing: -.24px
}

#footer_product p.copy {
    padding-top: 63px
}

#footer_product select {
    width: 206px;
    height: 41px;
    padding: 0 50px 0 20px;
    border-radius: 8px;
    border: 1px solid #bfbfbf;
    position: relative;
    background: #fff url(/assets/images/sel_down.svg) no-repeat right 20px center;
    color: #565656;
    letter-spacing: -.16px
}

.modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    background: rgba(0, 0, 0, .5);
    z-index: 300
}

.modal .modal_popup {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: fit-content;
    max-width: 95%
}

#modal_alarmset .modal_inner {
    max-width: 100%;
    padding: 20px;
    background: #fff;
    border-radius: 20px;
    width: 480px;
    border-radius: 12px;
    background: #fff;
    max-width: 100%
}

#modal_alarmset h3 {
    font-size: 24px;
    font-weight: 600;
    line-height: 133%;
    padding-bottom: 12px
}

#modal_alarmset dl {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 16px 0
}

#modal_alarmset dl {
    border-top: 1px solid #f0f0f0
}

#modal_alarmset dl:last-of-type {
    border-bottom: 1px solid #f0f0f0
}

#modal_alarmset dt {
    color: #171717;
    font-weight: 600;
    letter-spacing: .2px
}

#modal_confirm {
    z-index: 2000
}

#modal_confirm .modal_inner {
    max-width: 100%;
    padding: 24px;
    background: #fff;
    border-radius: 16px;
    width: 400px;
    max-width: 100%
}

#modal_confirm .modal_inner.action {
    animation: zoomIn .15s forwards
}

#modal_confirm .modal_inner .textbox {
    padding: 20px 0 28px
}

#modal_confirm .modal_inner .icon img {
    margin: 0 auto
}

#modal_confirm .modal_inner h3 {
    color: #171717;
    font-size: 18px;
    font-weight: 600;
    display: none;
    letter-spacing: .2px;
    text-align: center
}

#modal_confirm .modal_inner p {
    padding-top: 10px;
    font-size: 14px;
    color: #5b5b5b;
    letter-spacing: .2px;
    text-align: center;
    display: none
}

#modal_confirm .modal_inner .box_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding-top: 0;
    display: none
}

#modal_confirm .modal_inner .btn-cancel {
    width: 120px;
    height: 40px;
    border-radius: 8px;
    border: 1px solid var(--Line-Deep, #d5d7db);
    background: var(--White, #fff);
    color: var(--Text-Primary, #171717);
    font-weight: 500;
    letter-spacing: .2px
}

#modal_confirm .modal_inner .btn-ok {
    width: 120px;
    height: 40px;
    border-radius: 8px;
    background: var(--Primary, #ff6a00);
    color: var(--White, #fff);
    font-weight: 500;
    letter-spacing: .2px
}

.pt0 {
    padding-top: 0 !important
}

.pt20 {
    padding-top: 20px
}

.img-title-72 {
    width: 72px;
    height: 72px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid #f0f0f0;
    overflow: hidden
}

.link-email {
    display: inline-block;
    color: #04c !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: .2px;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font
}

#body_reply #wrap_side {
    display: none
}

#body_reply .wrap {
    display: flex;
    flex-direction: column;
    gap: 24px;
    justify-content: space-between;
    align-items: start;
    min-height: 100vh;
    height: 100%
}

.wrap-header-title-reply {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    color: var(--Text-Primary, #171717);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .15px;
    display: flex;
    padding: 0 20px;
    align-items: center;
    gap: 12px;
    height: 56px;
    border-bottom: 1px solid var(--Line-Cool-Gray, #e9ebee);
    background: #fff
}

.subject-rp, a.subject-rp {
    background: #fff;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    color: var(--Text-Primary, #171717);
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    padding: 11px 20px;
    border-bottom: 8px solid #f2f4f7
}

.wrap-title-reply {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    background: #fff;
    z-index: 500
}

#body_reply main {
    padding-top: 105px
}

#body_event_list main {
    padding-top: 57px
}

#body_event_list .event-header {
    width: 1280px;
    max-width: 100%;
    padding: 12px 20px;
    margin: 0 auto;
    border-bottom: 1px solid #e9ebee;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#body_event_list .list-item li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    gap: 16px;
    border-bottom: 1px solid #e9ebee
}

#body_event_list .list-item .right {
    flex: 0 0 32px
}

#body_event_list .btn-scr {
    width: 32px;
    height: 32px;
    border: 1px solid #d5d7db;
    border-radius: 4px;
    background: url(/assets/images/icon_heart.svg) no-repeat center center
}

#body_event_list .btn-scr.on {
    background: url(/assets/images/icon_heart_on.svg) no-repeat center center
}

#body_event_list .inner {
    min-height: calc(100vh - 201px);
    padding-bottom: 57px
}

#body_event_list .list-item .left {
    color: var(--Text-Primary, #171717);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

#body_event_list .list-item .left span {
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    margin-top: 4px
}

#body_esti.prc-esti main {
    padding-top: 114px;
    min-height: calc(100vh - 201px)
}

.atext {
    display: flex;
    gap: 8px;
    flex-direction: column
}

.atext-ah {
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px
}

.atext-f12 {
    display: flex;
    gap: 12px;
    align-items: center;
    color: var(--Text-Primary, #171717);
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

.atext-f12 em {
    flex: 0 0 1px;
    width: 1px;
    height: 12px;
    background: #d5d7db
}

.atext-f8 {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #171717;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.atext-f8:nth-of-type(3) {
    color: #5b5b5b
}

.atext-f8:nth-of-type(5) {
    color: #171717
}

.atext-dvs {
    display: flex;
    width: fit-content;
    height: 24px;
    padding: 2px 8px;
    align-items: center;
    border-radius: 4px;
    background: #f0f6ff;
    color: var(--Tag, #3262a6);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px
}

.swiper-container.con-land {
    position: relative
}

.swiper.con-land {
    width: 816px;
    max-width: 100%;
    margin: 0 auto;
    overflow: hidden;
    position: initial
}

.swiper.con-land .swiper-button-disabled {
    opacity: .2;
    cursor: default
}

.swiper.con-land .swiper-wrapper .swiper-slide {
    width: 816px;
    max-width: 100%;
    margin: 0 auto;
    aspect-ratio: 816/611;
    overflow: hidden
}

.swiper.con-land .swiper-wrapper .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.s-btn-next {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    cursor: pointer
}

.s-btn-prev {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    cursor: pointer
}

.s-pagination {
    position: absolute;
    display: flex;
    width: fit-content;
    padding: 4px 16px;
    justify-content: center;
    align-items: center;
    border-radius: 99px;
    background: rgba(23, 23, 23, .5);
    color: var(--White, #fff);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    bottom: 19px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2
}

#body_cnc.board-view.land .grid-box-con {
    padding: 64px 105px;
    display: grid;
    gap: 30px;
    grid-template-columns:repeat(4, 1fr)
}

#body_cnc.board-view.land .grid-box-con > div {
    display: flex;
    gap: 8px;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    height: 120px;
    border-radius: 16px;
    background: var(--BG-Cool-Gray, #f2f4f7);
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#body_cnc.board-view.land .grid-box-con strong {
    color: var(--Text-Primary, #171717);
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .15px
}

#body_cnc.board-view.land .flex-text-con {
    padding: 64px 0;
    gap: 48px;
    display: flex;
    flex-direction: column;
    border-top: 1px solid var(--Line-Cool-Gray, #e9ebee)
}

#body_cnc.board-view.land .grid-text-con {
    display: grid;
    grid-template-columns:repeat(2, 1fr);
    gap: 48px 30px
}

#body_cnc.board-view.land .fl-list {
    display: flex;
    flex-direction: column;
    gap: 8px
}

#body_cnc.board-view.land .fl-list > li {
    display: flex
}

#body_cnc.board-view.land .fl-list > li i {
    flex: 0 0 120px;
    width: 120px
}

#body_cnc.board-view.land .fl-list > li em {
    flex: 1 1 auto;
    width: auto
}

#body_cnc.board-view.land b {
    display: block;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .15px;
    padding-bottom: 12px
}

#body_cnc.board-view.land i {
    color: var(--Text-Tertiary, #8e8e8e);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

#body_cnc.board-view.land em {
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px
}

.sbl {
    color: #04c
}

#body_cnc.board-view.land ul.dotli {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.fl-green {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 40px
}

.fl-green li {
    display: flex;
    white-space: nowrap
}

button.disabled {
    background: #d9d9d9 !important;
    color: #fff !important
}

.write-bottom {
    padding: 20px 0;
    gap: 8px;
    display: none;
    justify-content: space-between;
    align-items: center
}

.btn-write-cancel {
    flex: 1;
    width: 100%;
    display: flex;
    height: 48px;
    padding: 0 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 10px;
    border: 1px solid var(--Line-Deep, #d5d7db);
    background: var(--White, #fff);
    color: var(--Text-Primary, #171717);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.btn-write-register {
    flex: 1;
    width: 100%;
    display: flex;
    height: 48px;
    padding: 0 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 10px;
    background: var(--Primary, #ff6a00);
    color: var(--White, #fff);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

.wrap-file-write-mobile {
    display: none
}

#modal_file_mobile .modal_inner {
    max-width: 100%;
    width: 480px;
    border-radius: 16px;
    background: #fff;
    padding: 0;
    overflow: hidden
}

#modal_file_mobile .modal_inner h3 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--Text-Primary, #171717);
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .2px;
    padding: 15px 20px;
    border-bottom: 1px solid #e9ebee
}

#modal_file_mobile .bodyul {
    padding: 0 20px 20px
}

#modal_file_mobile .bodyul li {
    padding: 12px 0;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    align-items: center;
    color: var(--Text-Secondary, #5b5b5b);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .2px;
    border-bottom: 1px solid #e9ebee
}

#modal_file_mobile .bodyul li .fn {
    flex: 1 1 auto;
    width: 100%
}

#modal_file_mobile .bodyul li .bt {
    flex: 0 0 32px;
    width: 32px
}

.btn-file-delete-mobile {
    width: 32px;
    height: 32px;
    display: flex;
    justify-content: center;
    align-items: center
}

.btn-file-delete-mobile img {
    width: 20px;
    height: 20px
}

.select-virtual {
    display: none;
    text-align: left;
    width: 100%;
    height: 48px;
    line-height: 48px;
    color: #171717;
    font-size: 14px;
    font-weight: 500;
    position: relative;
    background: #fff url(/assets/images/sel_down.svg) no-repeat right center/16px 16px;
    border-bottom: 1px solid #e9ebee;
    letter-spacing: .2px
}

.dimmed, .dimmed.hide, .dimmed.show {
    display: block
}

#dimmed {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    min-height: 100vh;
    background: rgba(23, 23, 23, .5);
    z-index: 999998;
    display: none
}

.sel-3 {
    color: #5b5b5b
}

.sel-1, .sel-2, .sel-3 {
    display: none
}

#modal_window_survey .wcon .item label {
    color: #393939;
    display: inline-flex;
    align-items: start;
    cursor: pointer;
    position: relative;
    gap: 8px
}

.step-order-form input[type=date], .step-order-form input[type=email], .step-order-form input[type=number], .step-order-form input[type=password], .step-order-form input[type=search], .step-order-form input[type=tel], .step-order-form input[type=text], .step-order-form input[type=url] {
    padding: 0 16px;
    width: 100%;
    height: 48px;
    display: flex;
    align-items: center;
    align-self: stretch;
    border-radius: 8px;
    border: 1px solid #d5d7db;
    color: #171717;
    font-weight: 400
}

@media all and (max-width: 1480px) {
    .container-lnb, header {
        padding: 0 20px !important
    }

    .container-lnb .hwrap, header .hwrap {
        gap: 44px
    }

    nav .depth1 {
        gap: 44px
    }
}

.swiper-container.lnb {
    overflow-x: auto;
    white-space: nowrap
}

.swiper-wrapper {
    display: inline-flex
}

.swiper-slide {
    flex: 0 0 auto;
    padding: 0
}

.swiper-slide a.on {
    font-weight: 700;
    border-bottom: 2px solid #000
}

.btn-cont-write {
    display: flex;
    justify-content: center;
    gap: 8px;
    align-items: center;
    height: 34px;
    padding: 0 16px;
    border-radius: 6px;
    border: 1px solid var(--Line-Deep, #d5d7db);
    background: var(--White, #fff);
    color: var(--Text-Primary, #171717);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

/*.no-data{min-height:200px!important}*/
.input-search + button {
    display: none !important
}

.swiper.lnb {
    overflow: visible !important
}

.swiper.lnb .swiper-wrapper {
    display: flex !important;
    transform: none !important
}

.btn-go-edit {
    display: flex;
    height: 40px;
    padding: 0 20px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    color: var(--Text-Primary, #171717);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px;
    border-radius: 8px;
    border: 1px solid var(--Line-Deep, #d5d7db)
}

.exp .right {
    display: flex;
    align-items: center;
    gap: 10px
}

.exp .right .btn-link, .exp .right .button {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 6px 0;
    background-color: #fff;
    text-decoration: none;
    cursor: pointer;
    transition: all .2s ease;
    vertical-align: middle
}

.exp .right .btn-link:hover, .exp .right .button:hover {
    background-color: #f5f5f5;
    border-color: #ccc
}

.exp .right a:first-child img:first-child {
    margin-top: 3px
}

.exp .right .btn-link img, .exp .right .button img {
    width: 16px;
    height: 16px;
    vertical-align: middle
}

.exp .right .btn-link span, .exp .right .button span {
    color: #333;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    vertical-align: middle
}

.exp .right .btn-link {
    font-family: inherit;
    font-size: inherit;
    outline: 0
}

@media (max-width: 768px) {
    .exp .right {
        gap: 5px
    }

    .exp .right .btn-link, .exp .right .button {
        padding: 6px 12px
    }

    .exp .right .btn-link span, .exp .right .button span {
        font-size: 13px
    }
}

nav ul.depth1 > li > a {
    font-weight: 600 !important
}

.list-board dd:has(.no-data) {
    border-bottom: 0
}

form #searchType {
    max-width: 150px !important
}

.wsbm #searchKeyword {
    min-width: 280px !important
}

.boximg {
    /*border: 1px solid #dfdfdf !important;*/
    /*border-radius: 6px !important*/
}

.bookmark-btn {
    border: 0 !important;
    position: absolute;
    top: 10px;
    right: 10px;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    background: 0 0 !important;
    box-shadow: none !important;
    transition: all .2s ease
}

.btn-comm-write {
    display: flex;
    justify-content: center;
    gap: 8px;
    align-items: center;
    height: 34px;
    padding: 0 16px;
    border-radius: 6px;
    border: 1px solid var(--Line-Deep, #d5d7db);
    background: var(--White, #fff);
    color: var(--Text-Primary, #171717);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .2px
}

/* 글이 있는 게시판과 없는 게시판이 스크롤바 생성 유무에 따라서 화면 배치가 변경됨. */
/* 데스크톱 환경에서 레이아웃 시프트 방지 */
@media screen and (min-width: 1280px) {
    body {
        overflow-y: scroll !important; /* 수직 스크롤바 항상 표시 */
        overflow-x: auto !important; /* 수평 스크롤바는 필요시에만 */
    }
}

/* 프로필 이미지 공통 - 피그마와 잔디에 있는 SVG 형태와 동일하게 구현 */
.profile_wrapper .imgbox {
    /* Squircle 형태 구현 - iOS 스타일 둥근 사각형 */
    border-radius: 30% !important;
    position: relative;
    overflow: hidden;
}

/* 두 클래스의 이미지에 동시 적용 */
.profile_wrapper .imgbox img,
.user-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 컨테이너 공통 스타일 */
.profile_wrapper .imgbox,
.user-avatar {
    position: relative;
    overflow: hidden;
    border-radius: 30%;
}

/* CSS Squircle 효과를 위한 의사 요소 */
.profile_wrapper .imgbox::before,
.user-avatar::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 30%;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
    pointer-events: none;
    z-index: 1;
}

/* 더 정확한 squircle을 위한 SVG mask */
@supports (mask-image: url('')) or (-webkit-mask-image: url('')) {
    .profile_wrapper .imgbox,
    .user-avatar {
        border-radius: 0 !important;
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M50,0 C87.5,0 100,12.5 100,50 C100,87.5 87.5,100 50,100 C12.5,100 0,87.5 0,50 C0,12.5 12.5,0 50,0' fill='black'/%3E%3C/svg%3E");
        mask-image: url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M50,0 C87.5,0 100,12.5 100,50 C100,87.5 87.5,100 50,100 C12.5,100 0,87.5 0,50 C0,12.5 12.5,0 50,0' fill='black'/%3E%3C/svg%3E");
        -webkit-mask-size: 100% 100%;
        mask-size: 100% 100%;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
    }

    .profile_wrapper .imgbox::before,
    .user-avatar::before {
        display: none;
    }
}

/* TODO : 알림 팝업 min-height: 560px으로 조정하고, 브라우저 height 의 40% 정도로 조정 %*/
.popup_alarm {
    min-height: 300px;
    height: auto !important;
    max-height: calc(100vh - 100px);
    overflow: hidden; /* 전체 overflow 제거 */
    display: flex;
    flex-direction: column;
}

/* 알림 메시지 스크롤 영역 */
.popup_alarm .notify-scroll-wrapper {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 400px; /* 고정 높이로 설정 */
    min-height: 200px; /* 최소 높이 보장 */
}

/* 작은 화면에서는 min-height 조정 */
@media (max-height: 768px) {
    .popup_alarm {
        min-height: 250px; /* 작은 화면에서는 최소 높이 줄임 */
        height: auto !important;
    }

    .popup_alarm .notify-scroll-wrapper {
        max-height: 300px; /* 작은 화면에서는 더 작게 */
    }
}

/* nick 부분 ellipsis 처리 - 로그아웃 버튼과 겹치지 않도록 */
header .right .popup_user .hd .right {
    padding-right: 42px; /* logout 버튼 공간 확보 (32px 버튼 + 24px right + 12px 여백) */
    min-width: 0; /* flex 아이템이 shrink 가능하도록 */
}

header .right .popup_user .hd .right p:first-child {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

header .right .popup_user .nick {
    display: inline-block;
    max-width: calc(100% - 20px); /* "님" 텍스트 공간 확보 */
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#body_egd .only-mobile,
#body_esti .only-mobile,
#body_product .only-mobile {
    display: none;
}

#body_egd .only-s-mobile,
#body_esti .only-s-mobile,
#body_product .only-s-mobile {
    display: none;
}

#body_egd .only-pc,
#body_esti .only-pc,
#body_product .only-pc {
    display: block;
}

@media all and (max-width: 1279px) {
    #body_egd .only-pc,
    #body_esti .only-pc,
    #body_product .only-pc {
        display: none;
    }

    #body_egd .only-s-mobile,
    #body_esti .only-s-mobile,
    #body_product .only-s-mobile {
        display: none;
    }

    #body_egd .only-mobile,
    #body_esti .only-mobile,
    #body_product .only-mobile {
        display: block;
    }
}

.wrap-board-contents ul,
.wrap-board-contents ol,
.wrap-board-contents li {
    list-style: revert !important;
    margin: revert !important;
    padding: revert !important;
    -webkit-text-size-adjust: revert !important;
    text-size-adjust: revert !important;
    box-sizing: revert !important;
}

.wrap-gridboard-cs1 .boximg {
    display: flex !important;
    aspect-ratio: 293 / 164 !important; /* 비율 유지 */
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
}

.wrap-gridboard-cs1 .boximg img {
    width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
    border-radius: 8px;
}

.board-survey-list .item .left {
    display: flex !important;
    aspect-ratio: 192 / 108 !important; /* 비율 유지 */
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    width: 192px;
}

.board-survey-list .item .left img {
    width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
}

.open-commnu-menu .wrap-header-detail {
    display: none;
}

/* 리사이즈 시 transition 비활성화 */
.no-transition,
.no-transition *,
body.no-transition,
body.no-transition *,
body.no-transition .wrap1280,
body.no-transition .wrap1280 *,
body.no-transition .cont_head,
body.no-transition .cont_head *,
body.no-transition .swiper,
body.no-transition .swiper * {
    transition: none !important;
    animation: none !important;
    -webkit-transition: none !important;
    -webkit-animation: none !important;
}

input[type=email]:focus,
input[type=number]:focus,
input[type=tel]:focus,
input[type=text]:focus,
textarea:focus,
input[type=email]:focus,
input[type=number]:focus,
input[type=tel]:focus,
input[type=text]:focus,
select:focus,
textarea:focus {
    border-color: #5b5b5b !important;
}

/* Nice Select 커스터마이징 */

/* 호버 상태 개선 - 마우스가 리스트를 벗어나도 선택된 항목만 표시 */
.nice-select .list:not(:hover) .option:not(.selected) {
    background-color: transparent !important;
}

/* 선택된 항목 스타일 */
.nice-select .option.selected {
    background-color: #f0f0f0 !important;
    font-weight: bold;
}

/* 호버 중인 항목 스타일 */
.nice-select .option:hover {
    background-color: #F3F4F6 !important;
}

/* 포커스된 항목 스타일 */
.nice-select .option.focus {
    background-color: #F3F4F6 !important;
}

/* 선택된 항목이 호버될 때 */
.nice-select .option.selected:hover {
    background-color: #F3F4F6 !important;
}

/* 스크롤바 스타일링 (웹킷 브라우저) */
.nice-select .list::-webkit-scrollbar {
    width: 6px;
}

.nice-select .list::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.nice-select .list::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 3px;
}

.nice-select .list::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* 드롭다운이 열릴 때 부드러운 애니메이션 */
.nice-select .list {
    transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out, max-height 0.2s ease-out !important;
}
