
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.3/font/bootstrap-icons.css");

body, html {margin: 0; padding: 0; height: 100vh;}
* {margin: 0; padding: 0; font-family: 'Noto Sans KR', sans-serif; font-size: 14px; color: #0d101c;  font-weight: 400;}
div, ul, li, h1, h2, h3, h4, h5, h6, p, span, strong, a, b {font-size: 14px; font-weight: 400; margin: 0; padding: 0; color: #0d101c; text-decoration: none; font-family: 'Noto Sans KR', sans-serif; letter-spacing: -0.5px;}
a:hover,
a:active,
a:focus {color: #0d101c;}
ul, li {list-style: none; margin: 0; padding: 0;}
.w2ui-reset table tr td, .w2ui-reset table tr th{padding: 0 !important;}

/* default */
    /*btn */
    .sms_btn {width: 160px; color: #fff; border-radius: 20px 0 20px 0; border: 0; margin: 0; padding: 0; background-color: transparent; display: inline-block; height: 60px; line-height: 60px; cursor: pointer; text-align: center; font-size: 14px;}
        .btn_01 {background-color: #198754; border: 1px solid #198754;}
        .btn_01 {background-color: #198754; border: 1px solid #198754;}
        .btn_01:hover,
        .btn_01:active,
        .btn_01:focus {color: #fff;}
        .btn_02 {background-color: #3d62b1; border: 1px solid #3d62b1;}
        .btn_02_send {background-color: #3d62b1; border: 1px solid #3d62b1; border-radius: 0px 0px 20px 20px;}
        .btn_02:hover,
        .btn_02:active,
        .btn_02:focus {color: #fff;}
        .btn_03 {background-color: #CA5454; border: 1px solid #CA5454;}
        .btn_03:hover,
        .btn_03:active,
        .btn_03:focus {color: #fff;}
        .btn_04 {border: 1px solid #CA5454; color: #ca5454; background-color: #fff;}
        .btn_04:hover,
        .btn_04:active,
        .btn_04:focus {color: #ca5454;}
        .btn_05 {border: 1px solid #3d62b1; color: #3d62b1; background-color: #fff;}
        .btn_05:hover,
        .btn_05:active,
        .btn_05:focus {color: #3d62b1;}
        .btn_06 {border: 1px solid #198754; color: #198754; background-color: rgba(25, 135, 84, .05);}
        .btn_06:hover,
        .btn_06:active,
        .btn_06:focus {color: #198754;}

    .sms_btn_circle {width: 120px; height: 120px; border: 1px solid #3d62b1; line-height: 120px; color: #3d62b1; margin: 0 5px; background-color: transparent; border-radius: 100%; background-color: #fff;}
    .sms_btn_circle:hover,
    .sms_btn_circle:active,
    .sms_btn_circle:focus {background-color: #3d62b1; color: #fff;}

    /* datepicker */
        .ui-widget-header { border: 0px solid #dddddd; background: #fff; } 
        .ui-datepicker-calendar>thead>tr>th { font-size: 14px !important; } 
        .ui-datepicker .ui-datepicker-header { position: relative; padding: 10px 0; } 
        .ui-state-default,
        .ui-widget-content .ui-state-default,
        .ui-widget-header .ui-state-default,
        .ui-button,
        html .ui-button.ui-state-disabled:hover,
        html .ui-button.ui-state-disabled:active { border: 0px solid #c5c5c5; background-color: transparent; font-weight: normal; color: #454545; text-align: center; } 
        .ui-datepicker .ui-datepicker-title { margin: 0 0em; line-height: 16px; text-align: center; font-size: 14px; padding: 0px; font-weight: bold; } 
        .ui-datepicker { display: none; background-color: #fff; border-radius: 4px; margin-top: 10px; margin-left: 0px; margin-right: 0px; padding: 20px; padding-bottom: 10px; width: 300px; box-shadow: 10px 10px 40px rgba(0, 0, 0, 0.1); } 
        .ui-widget.ui-widget-content { border: 1px solid #eee; } 
        #datepicker:focus>.ui-datepicker { display: block; } 
        .ui-datepicker-prev,
        .ui-datepicker-next { cursor: pointer; } 
        .ui-datepicker-next { float: right; } 
        .ui-state-disabled { cursor: auto; color: hsla(0, 0%, 80%, 1); } 
        .ui-datepicker-title { text-align: center; padding: 10px; font-weight: 100; font-size: 20px; } 
        .ui-datepicker-calendar { width: 100%; } 
        .ui-datepicker-calendar>thead>tr>th { padding: 5px; font-size: 20px; font-weight: 400; } 
        .ui-datepicker-calendar>tbody>tr>td>a { color: #000; font-size: 12px !important; font-weight: bold !important; text-decoration: none;}
        .ui-datepicker-calendar>tbody>tr>.ui-state-disabled:hover { cursor: auto; background-color: #fff; } 
        .ui-datepicker-calendar>tbody>tr>td { border-radius: 100%; width: 44px; height: 30px; cursor: pointer; padding: 5px; font-weight: 100; text-align: center; font-size: 12px; } 
        .ui-datepicker-calendar>tbody>tr>td:hover { background-color: transparent; opacity: 0.6; } 

        .ui-state-hover,
        .ui-widget-content .ui-state-hover,
        .ui-widget-header .ui-state-hover,
        .ui-state-focus,
        .ui-widget-content .ui-state-focus,
        .ui-widget-header .ui-state-focus,
        .ui-button:hover,
        .ui-button:focus { border: 0px solid #cccccc; background-color: transparent; font-weight: normal; color: #2b2b2b; } 

        .ui-widget-header .ui-icon { background-image: url('../img/btns.png'); } 
        .ui-icon-circle-triangle-e { background-position: -20px 0px; background-size: 36px; } 
        .ui-icon-circle-triangle-w { background-position: -0px -0px; background-size: 36px; } 
        .ui-datepicker-calendar>tbody>tr>td:first-child a { color: red !important; } 
        .ui-datepicker-calendar>tbody>tr>td:last-child a { color: #0099ff !important; } 
        .ui-datepicker-calendar>thead>tr>th:first-child { color: red !important; } 
        .ui-datepicker-calendar>thead>tr>th:last-child { color: #0099ff !important; } 

        .ui-state-highlight,
        .ui-widget-content .ui-state-highlight,
        .ui-widget-header .ui-state-highlight { border: 0px; background: #f1f1f1; border-radius: 50%; padding:5px; } 

        .inp { padding: 10px 10px; background-color: #f1f1f1; border-radius: 4px; border: 0px; } 
        .inp:focus { outline: none; background-color: #eee; } 


    /* w2ui */
        .w2ui-grid .w2ui-grid-body table .w2ui-head>div {color: #656164; font-size: 12px; font-weight: 300;}
        .w2ui-grid .w2ui-grid-body table td.w2ui-grid-data>div {font-size: 12px; font-weight: 300;}

/* header */
header {position: fixed; top: 0; left: 0; width: 100%; z-index: 3;}
header.scroll {background-color: rgba(0, 0, 0, .4);}

    .header {display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid rgba(255, 255, 255, .6); height: 70px; margin: auto;}
    

    .h_logo { padding: 0 20px; border-right: 1px solid #fff; height: 100%; display: flex; justify-content: center; align-items: center;}
    .h_logo a {display: block; text-align: center;}

    .h_menu { height: 100%; display: flex; justify-content: center; align-items: center;}
    .h_menu a {color: #fff; display: block; margin:0 10px; padding: 10px; font-size: 1.2rem;}

    .h_user {display: flex; justify-content: space-evenly; align-items: center; padding: 0 20px; border-left: 1px solid #fff;  height: 100%; color: #fff;}
    .h_user a {color: #fff; padding: 10px;}
    .h_user span {color: #fff;}

header.sub {position: absolute; top: 0; left: 0; width: 100%; z-index: 3;}
header.sub.scroll {background-color: transparent;}
header.sub .header {border-bottom: 1px solid rgba(0, 0, 0, 0.4); background-color: #fff;}
header.sub .h_logo,
header.sub .h_user {border-color: #333;}
header.sub .h_menu a,
header.sub .h_user,
header.sub .h_user a {color: #333;}
header.sub .h_user span { color: #3a8afd;}

/* main */
    /* visual */
    .visual {background: url('../img/main_img.jpg')no-repeat center / cover; width: 100%; height: 80vh;}

    /* section */
        /* 메가 sms */
        .section {display: flex; justify-content: flex-start; align-items: center;}
            .container {max-width: 1400px; margin: auto;  position: relative; padding: 90px 30px;}
                .c_tit h2 {font-size: 20px; text-transform: uppercase; font-weight: 600; margin-bottom: 60px;}
                .c_tit h3 {font-size: 46px; line-height: 1.5; font-weight: 600;}

                .c_box  {padding: 40px 0; margin-left: -40px; margin-right: -40px; display: flex; justify-content: space-between; align-items: center; height: 850px;}
                    .c_sol {flex: 1 1 30%; text-align: center;}
                    .c_sol::before,
                    .c_sol::after {content: ''; position: absolute; width: 1px; height: 100%; background-color: #ededed; top: 0; left: 0;}
                    .c_sol:nth-child(1)::before {left: 0;}
                    .c_sol:nth-child(1)::after {left: 32.5%;}
                    .c_sol:nth-child(2)::after {left: 67.5%;}
                    .c_sol:nth-child(3)::after {left: auto; right: 0;}

                    .c_sol:nth-child(3) {align-self: flex-start;}
                    .c_sol h2 {margin: 35px 0; font-size: 36px; font-weight: bold; line-height: 1;}
                    .c_sol p {color: #5d5d5d; font-size: 18px; line-height: 1.25;}

        /* 일하는 방식 */
        .section2 {background: url('../img/bg_01.jpg')no-repeat center / cover; width: 100%; min-height: 80vh;}

            .c_box2 {flex-wrap: wrap; height: auto; margin: 0; width: 70%;}
            .c_box2 div {flex: 1 1 20%; margin: 10px; background-color: #fff; border-radius: 10px; padding: 10px; max-width: 250px;}
            .c_box2 div span {font-weight: 600; margin-left: 10px;}

            .c_circle {position: absolute; right: 0; top: -50%; transform: translateY(50%);}

            .cl_circle:nth-child(1) .cc_icon {background:#fff url('../img/order_01.png')no-repeat center / auto; transition:all .3s}
            .cl_circle:nth-child(2) .cc_icon {background:#fff url('../img/order_02.png')no-repeat center / auto; transition:all .3s}
            .cl_circle:nth-child(3) .cc_icon {background:#fff url('../img/order_03.png')no-repeat center / auto; transition:all .3s}
            .cl_circle:nth-child(4) .cc_icon {background:#fff url('../img/order_04.png')no-repeat center / auto; transition:all .3s}
            .cl_circle:nth-child(5) .cc_icon {background:#fff url('../img/order_05.png')no-repeat center / auto; transition:all .3s}
            .cl_circle:nth-child(6) .cc_icon {background:#fff url('../img/order_06.png')no-repeat center / auto; transition:all .3s}

            .cl_circle.on:nth-child(1) .cc_icon {background:#7e8fb5 url('../img/order_01_over.png')no-repeat center / auto; transition:all .3s}
            .cl_circle.on:nth-child(2) .cc_icon {background:#7e8fb5 url('../img/order_02_over.png')no-repeat center / auto; transition:all .3s}
            .cl_circle.on:nth-child(3) .cc_icon {background:#7e8fb5 url('../img/order_03_over.png')no-repeat center / auto; transition:all .3s}
            .cl_circle.on:nth-child(4) .cc_icon {background:#7e8fb5 url('../img/order_04_over.png')no-repeat center / auto; transition:all .3s}
            .cl_circle.on:nth-child(5) .cc_icon {background:#7e8fb5 url('../img/order_05_over.png')no-repeat center / auto; transition:all .3s}
            .cl_circle.on:nth-child(6) .cc_icon {background:#7e8fb5 url('../img/order_06_over.png')no-repeat center / auto; transition:all .3s}

            .c_box3 {display: flex; justify-content: space-between; align-items: flex-start; height: auto; padding: 60px 0px;}
                .cl_circle {flex: 1 1 16.6666%; text-align: center; padding:0 15px; position: relative; }
                .cl_circle .cc_icon::before {content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: #7e8fb5; width: 0; height: 0px; transition:all .3s}
                    .cc_icon {width: 165px; height: 165px;  border: 1px solid #e6e8ec; border-radius: 100%; display: flex; justify-content: center; align-items: center; margin: auto;  position: relative; cursor: pointer;}
                    .cc_icon::after {content: ''; position: absolute; width: 12px; height: 12px; border-radius: 100%; background-color: #1c30a9; left: 50%; transform: translateX(-50%); bottom: -6px;}
                    
                    .cc_txt {display: flex; justify-content: center; align-items: center; flex-direction: column;}
                    .cc_txt span {color: #1c30a9; font-size: 18px; margin: 30px 0; display: inline-block; font-weight: bold;}
                    .cc_txt h2 {margin-bottom: 30px; font-weight: 600; color: #010101; font-size: 22px;}
                    .cc_txt p {font-weight: 400; color: #5d5d5d; font-size: 18px; line-height: 1.25; word-break: keep-all; word-wrap: break-word;}

                .cl_circle.on .cc_icon::after {display: none;}


        /* faq */
        .section4 {background-color: #303030;}
        .section4 .c_tit h2,
        .section4 .c_tit h3,
        .section4 .c_tit p {color: #fff;}
        .section4 .container {overflow: hidden; position: relative;}

        .cf_wrap {padding: 60px 0;}
            .cf_box {border-radius: 50px 0 50px 0; padding: 30px; height: 250px; background-color: #fff;}
            .cf_box h2 {font-size: 20px; padding: 15px 0;  font-weight: 600; border-bottom: 1px solid #010101; color: #010101; word-break: keep-all; word-wrap: break-word;}
            .cf_box p {color: #777; padding: 15px 0; word-break: keep-all; word-wrap: break-word;}

            .swiper {overflow: visible; position: static;}
            .swiper-slide-next.cf_box {background-color: #7e8fb5;}
            .swiper-slide-next.cf_box h2 {border-bottom: 1px solid #fff;}
            .swiper-slide-next.cf_box h2,
            .swiper-slide-next.cf_box p {color: #fff;}

            .swiper-button-next, .swiper-button-prev {top: 36%; transform: translateY(-50%);  width: 45px; height: 45px; border: 1px solid #fff;}
            .swiper-button-next{right: 0;}
            .swiper-button-prev {left: auto; right: 55px;}
            .swiper-button-next:after, .swiper-button-prev:after {color: #fff; font-size: 22px;}
            .swiper-button-next:hover,
            .swiper-button-prev:hover {background-color: #fff;}
            .swiper-button-next:hover.swiper-button-next:after,
            .swiper-button-prev:hover.swiper-button-prev:after {color: #333;}

footer {background-color: #000;}
    .footer {width: 100%; margin: auto; padding: 30px; background-color: #000;}
    .footer p {color: #fff; font-size: 14px; text-align: center;}

.sub_container {min-height: calc(100vh - 81px); min-width: 1400px; width: 100%; overflow-y: auto;}

.half {position: relative; overflow: hidden;}
.half::before {content: ''; position: absolute; width: 66%; height: 80%; background-color: #F0F4FD; bottom: 0; right: 0; border-radius: 120px 0 0 0;}

.full {width: 100%; margin: auto; position: relative; width: 1400px; min-height: calc(100vh - 81px); display: flex; justify-content: center; align-items: flex-start;}

/* 발송 */
#fixed_number {display: none; height: 100px;}
.sub_tit {margin-bottom: 50px; display: flex; justify-content: flex-start; align-items: center;}
.sub_tit h2{font-size: 24px; margin-bottom: 5px;}
.sub_tit p, .sub_tit span{font-size: 24px;}
.sub_tit .sub_btn_wrap {margin-top: 20px; align-items: center;}
.sub_tit .sub_btn_wrap input {margin-left: 5px !important;}
.sub_tit .sub_btn_wrap label {margin-left: 5px !important;}

.sub_tit .st_etc p {display: inline-block; background-color: #E7EEFE; width: fit-content; }
.sub_tit .st_etc p span:first-child {display: inline-block;}
.sub_tit .st_etc p span:last-child {font-size: 14px; margin: 0 5px;}
.sub_tit .st_etc p span.count {font-size: 24px; color: #333;}

.st_tit h1 {font-size: 60px; font-weight: bold;}
.st_etc {padding: 0 25px;}
.sub_content {display: flex; justify-content: center; align-items: center; height: 550px;}
.send_msg {margin-top: 60px;}
    .sc_img {width: 287px; background: url('../img/iphone.png')no-repeat center / contain; height: 583px; padding:40px 25px 15px; margin: 0 15px;}
    .sc_img > div {height: 100%;  display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start;}
        .send_btn {display: block; width: fit-content; margin: auto; margin-top: 10px;}
        /* .bite {position: absolute; right: 3px; top: 3px;} */
            #msg_len {color: #3d62b1;}

    .sc_list_table { background-color: #fff; box-shadow: 0px 5px 15px rgba(0, 0, 0, .04); padding: 12px; border-radius: 5px; min-height: 400px; border: 1px solid #ced4da; overflow-y: auto;}
    .sc_list_table th {background-color: #fafafa;}
    .sc_list_table th,
    .sc_list_table td {text-align: center;}
    .sc_list{ width: 400px;}
    .sc_list > .input-group { margin-bottom: 3px;}


    .sc_form {height: 100%;position: relative; margin: 0 15px;}
    .sc_form > button {margin-top: 15px; margin-left: auto;}
    .sc_form table {width: 100%;}
    .sc_form tr {border-bottom: 1px solid #CCD3E3;  text-align: left;}
    .sc_form th,
    .sc_form td {padding: 10px; vertical-align: middle; color: #000; font-weight: 400;}
    .sc_form textarea + label {color: #3d62b1 !important;}
    .sc_form i {color: #ff3848; cursor: pointer;}
    
    .excel_input {margin-bottom: 3px;}
    .excel_input *:not(img) {height: 34px;}
    .excel_input img {height: 26px;}

    .excel_input input[type="file"] {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip:rect(0,0,0,0);border: 0;}
    .excel_input label {display: inline-block;padding: .5em .75em;color: #999;font-size: inherit;line-height: normal;vertical-align: middle;background-color: #fdfdfd;cursor: pointer;border: 1px solid #ebebeb;border-bottom-color: #e2e2e2;border-radius: .25em;}
    
      /* named upload */
      .excel_input .upload-name {display: inline-block;padding: .5em .75em;  /* label의 패딩값과 일치 */font-size: inherit;font-family: inherit;line-height: normal;vertical-align: middle;background-color: #f5f5f5;border: 1px solid #ebebeb;border-bottom-color: #e2e2e2;border-radius: .25em;-webkit-appearance: none; /* 네이티브 외형 감추기 */-moz-appearance: none;appearance: none; flex: 1;}

    .excel_btn {width: 100%;margin-bottom: 3px;}
    .excel_btn img {margin-right: 10px;}

    .sc_sample {margin-top: auto; width: 100%; margin-bottom: 10px;}
    .sc_sample a,
    .sc_sample button {width: 100%;}
    .sc_sample *:not(:last-child) {margin-right: 5px;}
    .sc_sample a {font-size: 14px; font-weight: 400;}
    .sc_sample_search {min-width: 40%;}
    .sc_sample_search input {flex: 3 !important;}
    .sc_sample_search button{ width: auto !important;}

    .sc_sample2 {display: flex; justify-content: space-between; align-items: flex-end;}
    .sc_sample2 *:not(:last-child) {margin-right: 0px;}

    .sc_sample3 {align-items: flex-start; margin-bottom: 0;}
    .sc_sample3 .sms_btn {width: fit-content; padding: 0px 25px;} 

    .sc_sample4 {margin-bottom: 26px; }
    .sc_sample4 .sc_sample_search{margin-top: 21px;}
    
    .sc_form2 {padding: 0; }
    .sc_form2 label {margin-left: 0px !important;}
    .sc_form2 table {border-top: 1px solid #3D62B1; margin-top: 25px;}

    .sc_form3 {display: block; width: 100%; margin: 0;}
    .sc_form3 table {background-color: #fff; border-top: 1px solid #3d6281;}
    .sc_form3 th,
    .sc_form3 td {text-align: center;}

    .send_result {min-width: none; width: 100%; margin-top: 16px !important;}
    .send_result .btn {width: auto !important; margin-bottom: 0 !important; height: 38px!important;}

    .sl_table td,
    .sl_table th {padding: 3px;}
        /* .sc_form_detail {padding: 0 20px;} */

/* 그룹 */
.group_content {display: flex; justify-content: center; align-items: center;}
#main_group,
#sub_group {width: 100%; min-height: 800px;}
    .group_wrap {width: 100%;}
        .group_button {margin-bottom: 10px;}

.excel_wrap {padding: 15px; display: flex; justify-content: space-between; align-items: flex-start;}
    .group_box {padding: 15px; border: 1px solid #ced4da; box-shadow: 0px 5px 15px rgba(0, 0, 0, .04); border-radius: 5px; width: 49.5%; text-align: center;}
    .group_box h2 {text-align: left; margin-bottom: 10px; font-size: 18px; font-weight: bold;}
    .group_box select {margin-bottom: 5px;}
    .group_box p {font-size: 12px;}
    .group_box .btn-group {margin-top: 10px;}

/* 충전 */
.sub_content2 {flex-direction: column;}
    .pay_txt {margin: 30px 0;  display: flex; justify-content: center; align-items: center;}
    .pay_txt *:first-child {margin-right: 5px;}

    .sc_box {display: flex; justify-content: center; align-items: center; width: 100%; padding: 15px 0; border-top: 2px solid #3d6281; border-bottom: 1px solid #CCD3E3;}
    .sc_box .input-group {width: auto; margin: 0 15px;}
    .sc_box .st_etc {padding: 0;}
    .sc_box input {width: auto !important; flex: none !important;}

    .pay_receipt {width: fit-content; padding: 25px 60px; background-color: #fff; box-shadow: 0px 5px 15px rgba(0, 0, 0, .3); margin: auto; display: none;}
    .pay_receipt p {color: #ff3848; font-size: 12px;}
        .pay_box {display: flex; justify-content: flex-start; align-items: center;}
        .pay_box div {padding:0 24px;}
        .pay_box h2 {font-size: 20px; font-weight: bold;}
        .pay_box ul {padding:6px 12px; padding-left: 15px;position: relative;}
        .pay_box ul::before {position: absolute; content: ''; top: 50%; left: 0; transform: translateY(-50%); width: 4px; height: 4px; border-radius: 100%; background-color: #3d62b1;}

    .sc_price {padding: 20px 0; border-bottom: 1px solid #CCD3E3; display: flex; justify-content: center; align-items: center; width: 100%;}

    .request_list_popup {background-color:rgba(0, 0, 0, .6); position:fixed; left:0; top:0; width: 100%; height: 100vh; z-index: 4; display: flex; justify-content: center; align-items: center; display: none;}
        .rl_wrap {border-radius: 10px; border: 1px solid #e4e4e4; background-color: #fff; padding: 25px; text-align: right;}
        .rl_wrap h2 {font-size: 24px; margin-bottom: 15px; text-align: left;}
        .rl_wrap table {border-top: 2px solid #111;}
        .rl_wrap td,
        .rl_wrap th {border-bottom: 1px solid #e4e4e4; padding: 10px; text-align: left;}
        .rl_wrap a {margin-top: 10px; margin-left: auto;}

/* 결과 */
.request_btn {display: flex; min-width: 300px;}
.sub_content_wrap {display: flex; justify-content: center; align-items: flex-start; margin-left: -10px; margin-right: -10px;}
.sub_content_wrap table {border: 1px solid #CCD3E3 !important; caption-side: top;}
.sub_content_wrap table tbody > tr:hover {cursor: pointer;}
.sub_content_wrap table .form-check {margin: auto;}
.sub_content_wrap caption {text-align: center; border: 1px solid #CCD3E3; border-bottom: 0; color: #222; font-size: 16px; background-color: #f5f5f5;}
.sub_content {flex: 1 1 40%; margin: 0 10px;}
.sub_content_wrap table tr > td.history_message span {display: block; width: 250px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.sub_content_wrap table tr > td.open span {display: block; width: 250px;}
/* 결과추출 */

#daterange {width: 20% ; flex: none;}

.dump_wrap {display: flex; justify-content: flex-start; align-items: center;}
.dump_wrap > * {margin: 0 5px;}
.dump_wrap label {margin-right: 5px;}
.dump_wrap .input-group {width: auto;}

.pagination {justify-content: center; margin: 30px 0;}
    .page-item {margin: 0 3px; }
        .page-link {border-radius: 100% !important; background-color: transparent; color: #333; width: 40px; height: 40px; line-height: 40px; padding: 0; text-align: center;}
        .page-item:first-child .page-link,
        .page-item:last-child .page-link {border: 1px solid #eee;}

/* 글쓰기 */
#bo_w {padding-top: 120px; padding-bottom: 30px;  max-width: 1400px; width: 1400px; margin: auto; min-height: calc(100vh - 81px);}

.alert_bg {width: 100%; height: 100%; top: 0; left: 0; position: fixed; display: none; z-index: 999;}
.alert_wrap {position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 5px; box-shadow: 0px 5px 15px rgba(0, 0, 0, .15); background-color: #fff; padding: 20px; display: none; width: fit-content;}
.alert_wrap > h2 {margin-bottom: 15px; font-size: 16px;}
.alert_wrap > div {display: flex; justify-content: flex-end; align-items: center;}
.alert_wrap > div > button:last-child {margin-left: 5px;}
.admin_button1 {background-color: #4e73df !important; color: #fff !important;}
.admin_button2 {background-color: #fff !important; color: #4e73df !important; border: 1px solid #4e73df !important;}

/* mypage */

/* 마이페이지 */
#smb_my {position:relative; margin: auto; margin-bottom:30px; padding-top: 120px; padding-bottom: 30px; width: 100%;  margin: auto; min-height: calc(100vh - 81px);}
#smb_my:after {display:block;visibility:hidden;clear:both;content:""}

/* 마이페이지 aside */
#smb_my_ov {position:relative;float:left;margin:0 10px 0 0;width:265px;border:1px solid #e8e8e8;background:#fff;margin-right:20px}
#smb_my_ov h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#smb_my_ov .smb_me {display:block;background:#fff;border-bottom:1px solid #e8e8e8;padding:20px;text-align:center;font-size:1.167em}
#smb_my_ov .smb_me img {width:45px;border-radius:50%}
#smb_my_ov .smb_me .my_ov_name {display:inline-block;margin-bottom:10px;line-height:28px}
#smb_my_ov .smb_me a {display:inline-block;font-size:0.85em;height:28px;line-height:22px;border:1px solid #d5d9dd;color:#8a8a8a;border-radius:2px;padding:2px 5px}
#smb_my_ov .smb_me a.smb_info {color:#3a8afd}

#smb_private:after {display:block;visibility:hidden;clear:both;content:""}
#smb_private {padding:10px 0}
#smb_private li {text-align:left;position:relative;text-align:left}
#smb_private a {display:block;background:#fff;color:#465168;line-height:20px;padding:10px 20px 10px 25px}
#smb_private a strong {display:inline-block;float:right;max-width:87px;overflow:hidden;white-space:nowrap;text-overflow:clip;color:#3a8afd;padding:0 5px;border-radius:15px;font-size:0.92em}
#smb_private a:hover strong {background:#4b8bff}
#smb_private li a:hover {color:#4b8bff}
#smb_private li a:hover:after {position:absolute;left:0;top:0;width:2px;height:100%;background:#3a8afd;content:""}
#smb_private li i {width:25px;color:#8c9eb0;margin-right:5px}
#smb_private li:hover i {color:#3a8afd}
#smb_private .win_point strong {background:#37bc9b;color:#fff}
#smb_private .win_memo strong {background:#ff8b77;color:#fff}
#smb_private .win_scrap strong {background:#8cc152;color:#fff}
#smb_private .win_coupon strong {background:#a352c1;color:#fff}

#smb_my_ov h3 {font-size:1.2em;padding:20px 20px 10px;border-top:1px solid #e8e8e8}
#smb_my_ov .op_area {border-top:0;padding:0 20px;line-height:18px;color:#555}
#smb_my_ov .op_area:after {display:block;visibility:hidden;clear:both;content:""}
#smb_my_ov .op_area dt {margin:5px 0;padding-top:5px;font-weight:bold;color:#8c9eb0;line-height:20px}
#smb_my_ov .op_area dd {margin:5px 0;padding-bottom:10px;border-bottom:1px dashed #e5e5e5}
#smb_my_ovaddt {border-bottom:0 !important}
#smb_my_ovaddd {border-bottom:0 !important}

.withdrawal {display:block;padding:10px 20px;border-top:1px solid #e8e8e8;color:#c7c7c7}

/* 마이페이지 list */
#smb_my_list {float:left;width:100%}

#smb_my_od h2 {margin:0 0 10px;font-size:1.25em}
#smb_my_od {position:relative;margin:0 0 50px}
.smb_my_od {background:#fff}
.smb_my_od li {padding:15px;border-bottom:1px solid #ececec}
.smb_my_od li:last-child {border-bottom:0}
.smb_my_od li:after {display:block;visibility:hidden;clear:both;content:""}
.smb_my_od li:hover {background:#fff6f6}
.smb_my_od .smb_my_od_li {float:left;line-height:18px}
.smb_my_od .smb_my_od_li1 {width:140px;text-align:center}
.smb_my_od .smb_my_od_li2 {width:75%;padding:0 20px}
.smb_my_od .smb_my_od_li3 {width:80px;float:right;text-align:center}

.smb_my_od .ord_num,
.smb_my_od .ord_name {font-size:1.2em;font-weight:bold;letter-spacing:-0.5px}
.smb_my_od .date {color:#b5b5b5}
.smb_my_od .cost {color:#3a8afd;font-weight:bold}
.smb_my_od .misu {color:#6d6d6d}

#smb_my_wish {position:relative;margin-bottom:30px}
#smb_my_wish h2 {font-size:1.25em;padding:0 0 20px;border-bottom:1px solid #d9dde2}
#smb_my_wish li {position:relative;background:#fff;border-bottom:1px solid #ececec;padding:15px}
#smb_my_wish li:after {display:block;visibility:hidden;clear:both;content:""}
#smb_my_wish .smb_my_chk {display:inline-block;float:left;margin-right:10px;color:red}
#smb_my_wish .smb_my_img {float:left;margin-right:20px}
#smb_my_wish .smb_my_tit {margin:5px 0;font-size:1.167em;font-weight:bold}
#smb_my_wish .smb_my_price {font-weight:bold;font-size:1.2em;margin-bottom:30px}
#smb_my_wish .smb_my_date {font-size:1em;color:#777}
.smb_my_more {position:absolute;top:0;right:0}
.smb_my_more a {display:block;background:url('../img/more-btn.gif') no-repeat 0 2px;padding-left:20px;height:30px}
#smb_my_wish li .wish_del {position:absolute;right:20px;top:50px;font-size:1.4em;color:#b2b2b2}
#smb_ws_act {text-align:center;margin:20px 0 30px}
#smb_ws_act .btn01 {width:180px;height:50px;font-weight:bold;font-size:1.167em;border:1px solid #98a3b3;border-radius:3px}
#smb_ws_act .btn02 {width:180px;height:50px;font-weight:bold;font-size:1.167em;border:1px solid #1c70e9;border-radius:3px;background:#3a8afd}

/* 마이페이지 테이블 */
.tbl_head03 {margin:0 0 10px}
.tbl_head03 table {border-bottom:1px solid #d3d3d3}
.tbl_head03 caption {padding:0;font-size:0;line-height:0;overflow:hidden}
.tbl_head03 thead th {padding:10px 0;border-top:2px solid #959da6;border-bottom:1px solid #d3d3d3;color:#383838;font-size:1.2em;text-align:center;letter-spacing:-0.1em}
.tbl_head03 thead a {color:#383838}
.tbl_head03 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
.tbl_head03 tfoot th, .tbl_head03 tfoot td {padding:10px 0;border-top:1px solid #c1d1d5;border-bottom:1px solid #c1d1d5;background:#d7e0e2;text-align:center}
.tbl_head03 tbody th {padding:10px 0;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9}
.tbl_head03 td {background:#fff;background-clip:padding-box;padding:5px ;border-top:1px solid #ccd2d9;border-left:1px solid #f6f6f6;line-height:1.5em;word-break:break-all; text-align: center; font-size: 12px;}
.tbl_head03 td:first-child {border-left:0}
.tbl_head03 a {}

.mypage_total {color: #3a8afd; margin: 0 3px;}

.mypage_tab {display: flex; justify-content: center; align-items: center; border-bottom: 1px solid #1c30a9; margin-bottom: 50px;}
.mypage_tab a {flex: 1 1 40%; padding: 15px; border: 1px solid #1c30a9; border-bottom: 0; text-align: center; font-size: 20px;}
.mypage_tab a:hover {background-color: #1c30a9; color: #fff;}
.mypage_tab a.on {background-color: #1c30a9; color: #fff;}

.mb12 {margin-bottom: 12px;}

.my_sub_tit {display: flex; justify-content: space-between; align-items: center;}
@media(max-width:1400px) {
    .c_box {flex-wrap: wrap; height: auto; width: 100%; margin: auto;}
        .c_sol {flex: 1 1 100%;}
        .c_sol img {width: 100%;}
        .c_circle img {display: none;}

    .c_box2 div {flex: 1 1 40%;}
    .c_box3 {flex-wrap: wrap; justify-content: center; margin: auto;}
        .cl_circle {flex: 1 1 30%;}

        .cf_wrap {overflow: hidden;}
}

.status-label{
	padding: 3px 10px;
    font-size: 10px;
    border-radius: 2px;
    color: #fff;
	margin:0 5px;
}

.status-label.success{
    background-color: #6cba7b;
}

.status-label.warning {
    background-color: #f6c244;
}


.tele-ask {
    display: flex; /* Flexbox 사용 */
    align-items: center; /* 세로 중앙 정렬 */
    text-decoration: none; /* 링크의 기본 밑줄 제거 */
    color: #000; /* 텍스트 색상 설정 */
    margin: 20px; /* 여백 추가 (필요에 따라 조정) */
}

.tele-icon {
    margin-right: 5px; /* 이미지와 텍스트 간 여백 */
    width: 20px; /* 이미지 크기 조정 (필요에 따라 조정) */
    height: 20px; /* 이미지 크기 조정 (필요에 따라 조정) */
}