/*
 * Global custom stylesheet for nowhosting.kr
 * Scope: entire site except /adm
 *
 * Migration target order:
 * 1. head.php inline rules
 * 2. include/home/head-assets.php inline rules
 * 3. tail.php inline rules
 * 4. page-modern.css
 * 5. member skin style.css files
 */

/* Home Head Assets */
:root {
        --primary: #4f46e5;
        --primary-hover: #4338ca;
        --secondary: #64748b;
        --background: #ffffff;
        --surface: #f8fafc;
        --text-primary: #0f172a;
        --text-secondary: #64748b;
        --border: #e2e8f0;
        --success: #22c55e;
        --error: #ef4444;
        --container-max: 1200px;
    }

    .container {
        max-width: var(--container-max);
    }

    body {
        font-family: 'Pretendard', sans-serif;
        overflow-x: hidden;
        background-color: #fff;
    }

    :focus-visible {
        outline: 2px solid var(--primary);
        outline-offset: 2px;
    }

    .skip-link {
        position: absolute;
        top: -40px;
        left: 0;
        background: var(--primary);
        color: white;
        padding: 8px 16px;
        z-index: 1000;
        transition: top 0.3s;
    }

    .skip-link:focus {
        top: 0;
    }

    @keyframes infinite-scroll {
        from { transform: translateX(0); }
        to { transform: translateX(-50%); }
    }

    .animate-infinite-scroll {
        animation: infinite-scroll 40s linear infinite;
    }

    @keyframes gradient {
        0% { background-position: 0% 50%; }
        50% { background-position: 100% 50%; }
        100% { background-position: 0% 50%; }
    }

    .animate-gradient {
        animation: gradient 6s ease infinite;
    }

    @keyframes float {
        0%, 100% { transform: translateY(0) rotate(0deg); }
        50% { transform: translateY(-20px) rotate(2deg); }
    }

    .animate-float {
        animation: float 6s ease-in-out infinite;
    }

    @keyframes bounce-slow {
        0%, 100% { transform: translateY(0); }
        50% { transform: translateY(-10px); }
    }

    .animate-bounce-slow {
        animation: bounce-slow 4s ease-in-out infinite;
    }

    .glass-card {
        background: rgba(255, 255, 255, 0.03);
        backdrop-filter: blur(10px);
        border: 1px solid rgba(255, 255, 255, 0.1);
    }

    .faq-answer {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.4s ease-out, opacity 0.3s ease-out;
        opacity: 0;
    }

    .faq-answer.open {
        max-height: 500px;
        opacity: 1;
    }

    .faq-item.active {
        border-color: #6366f1 !important;
        box-shadow: 0 10px 40px -10px rgba(99, 102, 241, 0.2);
    }

    .faq-item.active .faq-icon {
        transform: rotate(180deg);
    }

    .faq-item.active .faq-toggle > div:first-child {
        background-color: #6366f1;
        color: white;
    }

    .mobile-menu {
        transform: translateX(100%);
        transition: transform 0.3s ease-in-out;
    }

    .mobile-menu.open {
        transform: translateX(0);
    }

    .hero-slide {
        opacity: 0;
        transform: scale(1.1);
        transition: opacity 1s ease-in-out, transform 1s ease-in-out;
        pointer-events: none;
    }

    .hero-slide.active {
        opacity: 1;
        transform: scale(1);
        pointer-events: auto;
    }

    .slide-content {
        opacity: 0;
        transform: translateY(40px);
        transition: opacity 0.7s ease-out, transform 0.7s ease-out;
    }

    .hero-slide.active .slide-content {
        opacity: 1;
        transform: translateY(0);
    }

    .hero-slide.active .slide-content:nth-child(1) { transition-delay: 0s; }
    .hero-slide.active .slide-content:nth-child(2) { transition-delay: 0.1s; }
    .hero-slide.active .slide-content:nth-child(3) { transition-delay: 0.2s; }
    .hero-slide.active .slide-content:nth-child(4) { transition-delay: 0.3s; }
    .hero-slide.active .slide-content:nth-child(5) { transition-delay: 0.4s; }

    .slide-visual {
        opacity: 0;
        transform: translateX(80px);
        transition: opacity 1s ease-out, transform 1s ease-out;
        transition-delay: 0.3s;
    }

    .hero-slide.active .slide-visual {
        opacity: 1;
        transform: translateX(0);
    }

    .modern-content-wrap .page-wrap {
        max-width: 1200px;
        margin: 0 auto;
        width: 100%;
        padding-left: 16px;
        padding-right: 16px;
    }

    [data-reveal] {
        opacity: 0;
        transform: translateY(28px);
        transition: opacity 0.7s ease, transform 0.7s ease;
        will-change: opacity, transform;
    }

    [data-reveal].is-visible {
        opacity: 1;
        transform: translateY(0);
    }

    [data-reveal="left"] { transform: translateX(-28px); }
    [data-reveal="right"] { transform: translateX(28px); }
    [data-reveal="up"] { transform: translateY(28px); }

    [data-reveal="left"].is-visible,
    [data-reveal="right"].is-visible,
    [data-reveal="up"].is-visible {
        transform: translate(0, 0);
    }

    @media (prefers-reduced-motion: reduce) {
        [data-reveal] {
            opacity: 1;
            transform: none;
            transition: none;
        }
    }

    @media (min-width: 1024px) {
        .modern-content-wrap .page-wrap {
            padding-left: 24px;
            padding-right: 24px;
        }
    }

/* Legacy Shared Layout Rules */
.nohosting_table {border:solid 2px #eeeeee;margin-bottom:20px;}
.nohosting_table th{border:solid 1px #eeeeee;padding:10px;}
.nohosting_table td{border:solid 1px #eeeeee;padding:10px;}

.nowhosting_category {display:inline-block;margin-bottom:10px;}
.nowhosting_category li{float:left;margin-right:20px;}
.nowhosting_category .active a {color:midnightblue !important;font-weight:bold;}

/********************************************************
 Layout
********************************************************/
.wrapper { margin:0 auto;background-color:#fbfbfb;  }
.at-container { margin:0px auto; padding:0px;}
.is-pc .at-body { min-height:600px;background-color:#ffffff }
.at-body .at-container { overflow:hidden; }
.boxed.wrapper .at-body .at-container {background-color:#ffffff ;}
.at-content { position:relative; padding:0px 0px; }
.at-row { margin-left:-15px; margin-right:-15px; }
.at-col { position:relative; padding-left:15px; padding-right:15px;padding-bottom:20px; }

.nav-fixed .at-menu { width:100%; z-index:10; left:0px; }
@media all and (max-width:991px) {

.responsive .at-body .at-container { padding:0px 10px !important; }
.responsive .at-body .at-row { margin-left:0px; margin-right:0px; }
.responsive .at-body .at-col { padding-left:0px; padding-right:0px; }
.responsive .pull-right.at-main,
.responsive .pull-left.at-side { float:none !important; }

}


/* Category */
.list-category .div-tab-box { margin-bottom:15px; }
.list-category .dropdown { margin-bottom:15px; }
.list-category .active a, .list-category .selected a { color:crimson; font-weight:bold !important; }

/* Board List */
.list-category .div-tab.tabs { margin-bottom:0px; }
.list-board { }
.list-board .chk { width:40px; }
.list-board .num { width:60px; }
.list-board .reply { width:60px; }
.list-board .name { width:120px; }
.list-board .date { width:100px; }

.list-board .board-list { list-style:none; padding:0px; margin:0px; }
.list-board .board-list li { border-bottom:1px solid #ddd; display:table; width:100%; table-layout:fixed; }
.list-board .board-list li:hover { color:#000; background-color:#F8F8F8; }
.list-board .board-list li > div { display:table-cell; height:34px; line-height:22px; padding:6px 0px; text-align:center; color:#666; vertical-align:middle; }
.list-board .board-list li .subj { padding-left:10px; text-align:left; }
.list-board .board-list li .subj a { display:block; word-break:break-all; }
.list-board .board-list li .name { text-align:left; padding-left:10px; word-break:break-all; font-weight:bold; }
.list-board .board-list .xs-name a,
.list-board .board-list .xs-name span { display:inline-block !important; }
.list-board .board-list .none { padding:50px 0px; }

@media all and (max-width:768px) {
	.responsive .list-board .subj-item { margin-right:-15px }
	.responsive .list-board .subj-item > span { display:inline-block; margin-right:15px; font-weight:normal; }
	.responsive .list-board .subj-item > span:last-child { margin-right:0px; }
}


/* 癲ル슢?꾤땟戮⑤뭄????살씁??*/
.list-wrap { width:100%; }
.list-none { padding:80px 0px; }
.list-btn-box { margin: 15px 0px; }
.list-btn-box a span { margin-left: 4px; }
.list-page { margin-bottom:15px; }
.list-page .pagination { margin:0; }

/* ???⑤챶裕????살씁??*/
.view-wrap { width:100%; overflow:hidden; }
.view-wrap .img-photo i { background: rgb(245, 245, 245); padding: 16px; border-radius: 50%; width: 80px; height: 80px; text-align: center; color: rgb(143, 143, 143); font-size: 40px; display: inline-block; }
.view-wrap .img-photo img { border-radius: 50%; width: 80px !important; height: 80px !important; display:inline-block; }
.view-wrap .img-resize img { max-width:100%; height:auto; }
.view-wrap h1 { font-size: 22px; font-weight:bold; margin:0px; line-height:50px; display:block; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden; margin:0px; padding:0px 10px; color: rgb(59, 62, 67); letter-spacing:-1px; }
.view-wrap h1 .photo { border-radius: 50%; width: 50px; height: 50px; margin-bottom:10px; margin-right:10px; }
.view-wrap .no-attach { border-bottom:0px; }

.view-head { border-left:0px; border-right:0px; }
.view-head .sp { display:inline-block; width:20px; text-align:center; font-size:11px; color:#888; }
.view-head .list-group-item { padding:5px 15px; border-style:dotted; }
.view-cnt { margin-top:4px; }
.view-img img { display:block; max-width:100%; margin:0 auto 15px; border:0; height:auto; }
.view-content { padding:0px 15px 20px }
.view-mobile .view-content { padding:0px 0px 20px; }
.view-content img { width:auto; height:auto; max-width:100%; }
.view-content p { padding:0; margin:0; line-height:22px; }
.view-btn { margin:15px 0px 30px; }
.view-btn i { margin-right:2px; }

/* ??? */
.ans-content { padding:0px 15px 15px; }
.ans-content img { width:auto; height:auto; max-width:100%; }
.ans-content p { padding:0; margin:0; line-height:22px; }
.ans-btn { margin-top: 15px;  padding-top:14px; border-top:1px solid #eee; text-align:right; }
.ans-btn a span { margin-left: 6px; }
@media all and (max-width:460px) {
	.responsive .ans-btn .pull-left { float:none !important; }
}

/* ???ㅼ뒧??*/
.write-wrap { width:100%; overflow:hidden; }
.write-wrap h2 { padding:0px; margin:0px; font-size:14px; font-weight:bold; }
.write-wrap label { font-weight:bold; margin-top:4px; }
.write-wrap .write-content { height: 300px; }
.write-wrap .write-btn { margin:25px 0px; text-align:center; }
.write-wrap .sp-label { font-weight:normal; margin-right:10px; }
.write-wrap .sp-label input[type="checkbox"], .write-wrap .sp-label input[type="radio"] { margin-top:0px; }

/* ?袁⑸즵???????살씁??*/
@media all and (max-width:460px) {
	.responsive .list-btn { text-align:center; margin:0px auto; }
	.responsive .pull-right.list-btn { float:none !important; margin-bottom:14px; }
	.responsive .view-wrap h1 { text-overflow:clip; overflow:none; white-space:normal; line-height: 24px; font-size: 18px; margin-bottom:10px; }
	.responsive .view-wrap h1 .photo { display:none; }
	.responsive .view-btn i { margin-right:0px; }
}





[data-toggle="buttons"]>.btn>input[type="radio"],
[data-toggle="buttons"]>.btn>input[type="checkbox"] {
    position: absolute;
    z-index: -1;
    filter: alpha(opacity=0);
    opacity: 0
}

.input-group {
    position: relative;
    display: table;
    border-collapse: separate
}

.input-group[class*="col-"] {
    float: none;
    padding-right: 0;
    padding-left: 0
}

.input-group .form-control {
    position: relative;
    z-index: 2;
    float: left;
    width: 100%;
    margin-bottom: 0
}

.input-group-lg>.form-control,
.input-group-lg>.input-group-addon,
.input-group-lg>.input-group-btn>.btn {
    height: 46px;
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.33;
    border-radius: 6px
}

select.input-group-lg>.form-control,
select.input-group-lg>.input-group-addon,
select.input-group-lg>.input-group-btn>.btn {
    height: 46px;
    line-height: 46px
}

textarea.input-group-lg>.form-control,
textarea.input-group-lg>.input-group-addon,
textarea.input-group-lg>.input-group-btn>.btn,
select[multiple].input-group-lg>.form-control,
select[multiple].input-group-lg>.input-group-addon,
select[multiple].input-group-lg>.input-group-btn>.btn {
    height: auto
}

.input-group-sm>.form-control,
.input-group-sm>.input-group-addon,
.input-group-sm>.input-group-btn>.btn {
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px
}

select.input-group-sm>.form-control,
select.input-group-sm>.input-group-addon,
select.input-group-sm>.input-group-btn>.btn {
    height: 30px;
    line-height: 30px
}

textarea.input-group-sm>.form-control,
textarea.input-group-sm>.input-group-addon,
textarea.input-group-sm>.input-group-btn>.btn,
select[multiple].input-group-sm>.form-control,
select[multiple].input-group-sm>.input-group-addon,
select[multiple].input-group-sm>.input-group-btn>.btn {
    height: auto
}

.input-group-addon,
.input-group-btn,
.input-group .form-control {
    display: table-cell
}

.input-group-addon:not(:first-child):not(:last-child),
.input-group-btn:not(:first-child):not(:last-child),
.input-group .form-control:not(:first-child):not(:last-child) {
    border-radius: 0
}

.input-group-addon,
.input-group-btn {
    width: 1%;
    white-space: nowrap;
    vertical-align: middle
}

.input-group-addon {
    padding: 6px 12px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1;
    color: #555;
    text-align: center;
    background-color: #eee;
    border: 1px solid #ccc;
    border-radius: 4px
}

.input-group-addon.input-sm {
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 3px
}

.input-group-addon.input-lg {
    padding: 10px 16px;
    font-size: 18px;
    border-radius: 6px
}

.input-group-addon input[type="radio"],
.input-group-addon input[type="checkbox"] {
    margin-top: 0
}

.input-group .form-control:first-child,
.input-group-addon:first-child,
.input-group-btn:first-child>.btn,
.input-group-btn:first-child>.btn-group>.btn,
.input-group-btn:first-child>.dropdown-toggle,
.input-group-btn:last-child>.btn:not(:last-child):not(.dropdown-toggle),
.input-group-btn:last-child>.btn-group:not(:last-child)>.btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.input-group-addon:first-child {
    border-right: 0
}

.input-group .form-control:last-child,
.input-group-addon:last-child,
.input-group-btn:last-child>.btn,
.input-group-btn:last-child>.btn-group>.btn,
.input-group-btn:last-child>.dropdown-toggle,
.input-group-btn:first-child>.btn:not(:first-child),
.input-group-btn:first-child>.btn-group:not(:first-child)>.btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.input-group-addon:last-child {
    border-left: 0
}

.input-group-btn {
    position: relative;
    font-size: 0;
    white-space: nowrap
}

.input-group-btn>.btn {
    position: relative
}

.input-group-btn>.btn+.btn {
    margin-left: -1px
}

.input-group-btn>.btn:hover,
.input-group-btn>.btn:focus,
.input-group-btn>.btn:active {
    z-index: 2
}

.input-group-btn:first-child>.btn,
.input-group-btn:first-child>.btn-group {
    margin-right: -1px
}

.input-group-btn:last-child>.btn,
.input-group-btn:last-child>.btn-group {
    margin-left: -1px
}


.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px
}

.alert h4 {
    margin-top: 0;
    color: inherit
}

.alert .alert-link {
    font-weight: bold
}

.alert>p,
.alert>ul {
    margin-bottom: 0
}

.alert>p+p {
    margin-top: 5px
}

.alert-dismissable,
.alert-dismissible {
    padding-right: 35px
}

.alert-dismissable .close,
.alert-dismissible .close {
    position: relative;
    top: -2px;
    right: -21px;
    color: inherit
}

.alert-success {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6
}

.alert-success hr {
    border-top-color: #c9e2b3
}

.alert-success .alert-link {
    color: #2b542c
}

.alert-info {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1
}

.alert-info hr {
    border-top-color: #a6e1ec
}

.alert-info .alert-link {
    color: #245269
}

.alert-warning {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc
}

.alert-warning hr {
    border-top-color: #f7e1b5
}

.alert-warning .alert-link {
    color: #66512c
}

.alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1
}

.alert-danger hr {
    border-top-color: #e4b9c0
}

.alert-danger .alert-link {
    color: #843534
}






.panel {
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05)
}

.panel-body {
    padding: 15px
}

.panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px
}

.panel-heading>.dropdown .dropdown-toggle {
    color: inherit
}

.panel-title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 16px;
    color: inherit
}

.panel-title>a {
    color: inherit
}

.panel-footer {
    padding: 10px 15px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.panel>.list-group {
    margin-bottom: 0
}

.panel>.list-group .list-group-item {
    border-width: 1px 0;
    border-radius: 0
}

.panel>.list-group:first-child .list-group-item:first-child {
    border-top: 0;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px
}

.panel>.list-group:last-child .list-group-item:last-child {
    border-bottom: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.panel-heading+.list-group .list-group-item:first-child {
    border-top-width: 0
}

.list-group+.panel-footer {
    border-top-width: 0
}

.panel>.table,
.panel>.table-responsive>.table,
.panel>.panel-collapse>.table {
    margin-bottom: 0
}

.panel>.table:first-child,
.panel>.table-responsive:first-child>.table:first-child {
    border-top-left-radius: 3px;
    border-top-right-radius: 3px
}

.panel>.table:first-child>thead:first-child>tr:first-child td:first-child,
.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child td:first-child,
.panel>.table:first-child>tbody:first-child>tr:first-child td:first-child,
.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child td:first-child,
.panel>.table:first-child>thead:first-child>tr:first-child th:first-child,
.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child th:first-child,
.panel>.table:first-child>tbody:first-child>tr:first-child th:first-child,
.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child th:first-child {
    border-top-left-radius: 3px
}

.panel>.table:first-child>thead:first-child>tr:first-child td:last-child,
.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child td:last-child,
.panel>.table:first-child>tbody:first-child>tr:first-child td:last-child,
.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child td:last-child,
.panel>.table:first-child>thead:first-child>tr:first-child th:last-child,
.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child th:last-child,
.panel>.table:first-child>tbody:first-child>tr:first-child th:last-child,
.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child th:last-child {
    border-top-right-radius: 3px
}

.panel>.table:last-child,
.panel>.table-responsive:last-child>.table:last-child {
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.panel>.table:last-child>tbody:last-child>tr:last-child td:first-child,
.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child td:first-child,
.panel>.table:last-child>tfoot:last-child>tr:last-child td:first-child,
.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child td:first-child,
.panel>.table:last-child>tbody:last-child>tr:last-child th:first-child,
.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child th:first-child,
.panel>.table:last-child>tfoot:last-child>tr:last-child th:first-child,
.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child th:first-child {
    border-bottom-left-radius: 3px
}

.panel>.table:last-child>tbody:last-child>tr:last-child td:last-child,
.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child td:last-child,
.panel>.table:last-child>tfoot:last-child>tr:last-child td:last-child,
.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child td:last-child,
.panel>.table:last-child>tbody:last-child>tr:last-child th:last-child,
.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child th:last-child,
.panel>.table:last-child>tfoot:last-child>tr:last-child th:last-child,
.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child th:last-child {
    border-bottom-right-radius: 3px
}

.panel>.panel-body+.table,
.panel>.panel-body+.table-responsive {
    border-top: 1px solid #ddd
}

.panel>.table>tbody:first-child>tr:first-child th,
.panel>.table>tbody:first-child>tr:first-child td {
    border-top: 0
}

.panel>.table-bordered,
.panel>.table-responsive>.table-bordered {
    border: 0
}

.panel>.table-bordered>thead>tr>th:first-child,
.panel>.table-responsive>.table-bordered>thead>tr>th:first-child,
.panel>.table-bordered>tbody>tr>th:first-child,
.panel>.table-responsive>.table-bordered>tbody>tr>th:first-child,
.panel>.table-bordered>tfoot>tr>th:first-child,
.panel>.table-responsive>.table-bordered>tfoot>tr>th:first-child,
.panel>.table-bordered>thead>tr>td:first-child,
.panel>.table-responsive>.table-bordered>thead>tr>td:first-child,
.panel>.table-bordered>tbody>tr>td:first-child,
.panel>.table-responsive>.table-bordered>tbody>tr>td:first-child,
.panel>.table-bordered>tfoot>tr>td:first-child,
.panel>.table-responsive>.table-bordered>tfoot>tr>td:first-child {
    border-left: 0
}

.panel>.table-bordered>thead>tr>th:last-child,
.panel>.table-responsive>.table-bordered>thead>tr>th:last-child,
.panel>.table-bordered>tbody>tr>th:last-child,
.panel>.table-responsive>.table-bordered>tbody>tr>th:last-child,
.panel>.table-bordered>tfoot>tr>th:last-child,
.panel>.table-responsive>.table-bordered>tfoot>tr>th:last-child,
.panel>.table-bordered>thead>tr>td:last-child,
.panel>.table-responsive>.table-bordered>thead>tr>td:last-child,
.panel>.table-bordered>tbody>tr>td:last-child,
.panel>.table-responsive>.table-bordered>tbody>tr>td:last-child,
.panel>.table-bordered>tfoot>tr>td:last-child,
.panel>.table-responsive>.table-bordered>tfoot>tr>td:last-child {
    border-right: 0
}

.panel>.table-bordered>thead>tr:first-child>td,
.panel>.table-responsive>.table-bordered>thead>tr:first-child>td,
.panel>.table-bordered>tbody>tr:first-child>td,
.panel>.table-responsive>.table-bordered>tbody>tr:first-child>td,
.panel>.table-bordered>thead>tr:first-child>th,
.panel>.table-responsive>.table-bordered>thead>tr:first-child>th,
.panel>.table-bordered>tbody>tr:first-child>th,
.panel>.table-responsive>.table-bordered>tbody>tr:first-child>th {
    border-bottom: 0
}

.panel>.table-bordered>tbody>tr:last-child>td,
.panel>.table-responsive>.table-bordered>tbody>tr:last-child>td,
.panel>.table-bordered>tfoot>tr:last-child>td,
.panel>.table-responsive>.table-bordered>tfoot>tr:last-child>td,
.panel>.table-bordered>tbody>tr:last-child>th,
.panel>.table-responsive>.table-bordered>tbody>tr:last-child>th,
.panel>.table-bordered>tfoot>tr:last-child>th,
.panel>.table-responsive>.table-bordered>tfoot>tr:last-child>th {
    border-bottom: 0
}

.panel>.table-responsive {
    margin-bottom: 0;
    border: 0
}

.panel-group {
    margin-bottom: 20px
}

.panel-group .panel {
    margin-bottom: 0;
    border-radius: 4px
}

.panel-group .panel+.panel {
    margin-top: 5px
}

.panel-group .panel-heading {
    border-bottom: 0
}

.panel-group .panel-heading+.panel-collapse>.panel-body {
    border-top: 1px solid #ddd
}

.panel-group .panel-footer {
    border-top: 0
}

.panel-group .panel-footer+.panel-collapse .panel-body {
    border-bottom: 1px solid #ddd
}

.panel-default {
    border-color: #ddd
}

.panel-default>.panel-heading {
    color: #333;
    background-color: #f5f5f5;
    border-color: #ddd;
}

.panel-default>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #ddd
}

.panel-default>.panel-heading .badge {
    color: #f5f5f5;
    background-color: #333
}

.panel-default>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #ddd
}

.panel-primary {
    border-color: #428bca
}

.panel-primary>.panel-heading {
    color: #fff;
    background-color: #428bca;
    border-color: #428bca
}

.panel-primary>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #428bca
}

.panel-primary>.panel-heading .badge {
    color: #428bca;
    background-color: #fff
}

.panel-primary>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #428bca
}

.panel-success {
    border-color: #d6e9c6
}

.panel-success>.panel-heading {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6
}

.panel-success>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #d6e9c6
}

.panel-success>.panel-heading .badge {
    color: #dff0d8;
    background-color: #3c763d
}

.panel-success>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #d6e9c6
}

.panel-info {
    border-color: #bce8f1
}

.panel-info>.panel-heading {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1
}

.panel-info>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #bce8f1
}

.panel-info>.panel-heading .badge {
    color: #d9edf7;
    background-color: #31708f
}

.panel-info>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #bce8f1
}

.panel-warning {
    border-color: #faebcc
}

.panel-warning>.panel-heading {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc
}

.panel-warning>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #faebcc
}

.panel-warning>.panel-heading .badge {
    color: #fcf8e3;
    background-color: #8a6d3b
}

.panel-warning>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #faebcc
}

.panel-danger {
    border-color: #ebccd1
}

.panel-danger>.panel-heading {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1
}

.panel-danger>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #ebccd1
}

.panel-danger>.panel-heading .badge {
    color: #f2dede;
    background-color: #a94442
}

.panel-danger>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #ebccd1
}

input[type="date"].input-sm,
input[type="time"].input-sm,
input[type="datetime-local"].input-sm,
input[type="month"].input-sm {
    line-height: 30px
}





/* List Head */
.div-head { 
	display:table; 
	width:100%; 
	table-layout:fixed; 
	padding:15px 0; 
	border-top-width:2px; 
	border-top-style:solid; 
	border-bottom:1px solid #c3c3c3; 
	border-collapse:separate;
}
.div-head > span { 
	display:table-cell; 
	text-align:center; 
	vertical-align:middle; 
	border-right:1px solid #ddd; 
	font-weight:bold; 
	line-height:1; 
}
.div-head > span:last-child { 
	border-right:0; 
}
.div-head.list-head > span { 
	border:0; 
}


/* Row & Col Space */
.row-10 {
	margin-left:-5px !important; margin-right:-5px !important;
}
.col-10 {
	padding-left:5px !important; padding-right:5px !important;
}
.row-15 {
	margin-left:-8px !important; margin-right:-8px !important;
}
.col-15 {
	padding-left:8px !important; padding-right:8px !important;
}
.row-20 {
	margin-left:-10px !important; margin-right:-10px !important;
}
.col-20 {
	padding-left:10px !important; padding-right:10px !important;
}


.qsearch-box { border:1px solid #ddd; background:#fafafa; padding:20px 15px 3px; margin-bottom:15px; }


.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px
}

.pagination>li {
    display: inline
}

.pagination>li>a,
.pagination>li>span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #428bca;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd
}

.pagination>li:first-child>a,
.pagination>li:first-child>span {
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

.pagination>li:last-child>a,
.pagination>li:last-child>span {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px
}

.pagination>li>a:hover,
.pagination>li>span:hover,
.pagination>li>a:focus,
.pagination>li>span:focus {
    color: #2a6496;
    background-color: #eee;
    border-color: #ddd
}

.pagination>.active>a,
.pagination>.active>span,
.pagination>.active>a:hover,
.pagination>.active>span:hover,
.pagination>.active>a:focus,
.pagination>.active>span:focus {
    z-index: 2;
    color: #fff;
    cursor: default;
    background-color: #428bca;
    border-color: #428bca
}

.pagination>.disabled>span,
.pagination>.disabled>span:hover,
.pagination>.disabled>span:focus,
.pagination>.disabled>a,
.pagination>.disabled>a:hover,
.pagination>.disabled>a:focus {
    color: #777;
    cursor: not-allowed;
    background-color: #fff;
    border-color: #ddd
}

.pagination-lg>li>a,
.pagination-lg>li>span {
    padding: 10px 16px;
    font-size: 18px
}

.pagination-lg>li:first-child>a,
.pagination-lg>li:first-child>span {
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px
}

.pagination-lg>li:last-child>a,
.pagination-lg>li:last-child>span {
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px
}

.pagination-sm>li>a,
.pagination-sm>li>span {
    padding: 5px 10px;
    font-size: 12px
}

.pagination-sm>li:first-child>a,
.pagination-sm>li:first-child>span {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px
}

.pagination-sm>li:last-child>a,
.pagination-sm>li:last-child>span {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px
}

.pager {
    padding-left: 0;
    margin: 20px 0;
    text-align: center;
    list-style: none
}

.pager li {
    display: inline
}

.pager li>a,
.pager li>span {
    display: inline-block;
    padding: 5px 14px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 15px
}

.pager li>a:hover,
.pager li>a:focus {
    text-decoration: none;
    background-color: #eee
}

.pager .next>a,
.pager .next>span {
    float: right
}

.pager .previous>a,
.pager .previous>span {
    float: left
}

.pager .disabled>a,
.pager .disabled>a:hover,
.pager .disabled>a:focus,
.pager .disabled>span {
    color: #777;
    cursor: not-allowed;
    background-color: #fff
}

/* Page Modern Styles */
@charset "UTF-8";

.modern-page-wrap {
    color: #1e293b;
}

.modern-page-wrap > *:first-child {
    margin-top: 0 !important;
}

.modern-page-wrap h2,
.modern-page-wrap h3,
.modern-page-wrap h4,
.modern-page-wrap h5 {
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.28;
    margin-top: 0;
}

.modern-page-wrap h2 { font-size: 34px; font-weight: 900; margin-bottom: 14px; }
.modern-page-wrap h3 { font-size: 28px; font-weight: 900; margin-bottom: 12px; }
.modern-page-wrap h4 { font-size: 22px; font-weight: 800; margin-bottom: 10px; }
.modern-page-wrap h5 { font-size: 18px; font-weight: 800; margin-bottom: 8px; }

.modern-page-wrap p,
.modern-page-wrap li,
.modern-page-wrap td,
.modern-page-wrap th {
    color: #334155;
    font-size: 15px;
    line-height: 1.8;
}

.modern-page-wrap .row {
    margin-bottom: 22px;
}

.modern-page-wrap .modern-section,
.modern-page-wrap .row {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 28px;
    box-shadow: 0 22px 50px -38px rgba(15, 23, 42, 0.45);
    padding: 28px;
}

.modern-page-wrap .row .row {
    border: 0;
    box-shadow: none;
    border-radius: 0;
    padding: 0;
    margin-bottom: 0;
    background: transparent;
}

.modern-page-wrap img,
.modern-page-wrap iframe {
    border-radius: 20px;
    border: 1px solid #dbeafe;
    box-shadow: 0 16px 32px -24px rgba(15, 23, 42, 0.45);
    overflow: hidden;
    max-width: 100%;
}

.modern-page-wrap iframe {
    width: 100%;
}

.modern-page-wrap ul,
.modern-page-wrap ol {
    padding-left: 22px;
    margin: 0 0 10px;
}

.modern-page-wrap .disc-style li,
.modern-page-wrap ul li {
    margin-bottom: 6px;
}

.modern-page-wrap .table,
.modern-page-wrap table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #dbe3ee;
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
}

.modern-page-wrap .table th,
.modern-page-wrap table th {
    background: #f8fafc;
    font-weight: 800;
    color: #0f172a;
}

.modern-page-wrap .table th,
.modern-page-wrap .table td,
.modern-page-wrap table th,
.modern-page-wrap table td {
    border-bottom: 1px solid #edf2f7;
    padding: 10px 12px;
}

.modern-page-wrap .table tr:last-child td,
.modern-page-wrap table tr:last-child td {
    border-bottom: 0;
}

.modern-page-wrap .btn,
.modern-page-wrap a.btn,
.modern-page-wrap .vps-detail-btn-primary,
.modern-page-wrap .serverwaf-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 18px;
    border-radius: 14px;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none !important;
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #1e293b;
    transition: all .2s ease;
}

.modern-page-wrap .btn:hover,
.modern-page-wrap a.btn:hover,
.modern-page-wrap .vps-detail-btn-primary:hover,
.modern-page-wrap .serverwaf-btn:hover {
    transform: translateY(-1px);
    border-color: #6366f1;
    color: #4338ca;
}

.modern-page-wrap .btn-primary,
.modern-page-wrap .btn-color,
.modern-page-wrap .btn-brand-01,
.modern-page-wrap .btn-brand-02,
.modern-page-wrap .btn-brand-03,
.modern-page-wrap .vps-detail-btn-primary,
.modern-page-wrap .serverwaf-btn-primary {
    background: #4f46e5;
    border-color: #4f46e5;
    color: #fff;
}

.modern-page-wrap .btn-primary:hover,
.modern-page-wrap .btn-color:hover,
.modern-page-wrap .btn-brand-01:hover,
.modern-page-wrap .btn-brand-02:hover,
.modern-page-wrap .btn-brand-03:hover,
.modern-page-wrap .vps-detail-btn-primary:hover,
.modern-page-wrap .serverwaf-btn-primary:hover {
    background: #4338ca;
    border-color: #4338ca;
    color: #fff;
}

.modern-page-wrap hr {
    border-color: #e2e8f0;
    margin: 18px 0;
}

@media (max-width: 991px) {
    .modern-page-wrap .modern-section,
    .modern-page-wrap .row {
        border-radius: 20px;
        padding: 18px;
    }

    .modern-page-wrap h2 { font-size: 28px; }
    .modern-page-wrap h3 { font-size: 24px; }
    .modern-page-wrap h4 { font-size: 20px; }
}

/* Member CSS: theme/basic/skin/member/basic/style.css */
@charset "utf-8";
/* SIR 筌왖€??곷툡??*/

/* ### 疫꿸퀡????????뚣끉??怨뺤춳??곸췅 ??뽰삂 ### */

/* 甕곌쑵??*/
.mbskin a.btn01 {}
.mbskin a.btn01:focus, .mbskin .btn01:hover {}
.mbskin a.btn02 {}
.mbskin a.btn02:focus, .mbskin .btn02:hover {}
.mbskin .btn_confirm {} /* ??뽯뻼??ｍ€?筌욊쑵六?*/
.mbskin .btn_submit {}
.mbskin button.btn_submit {}
.mbskin fieldset .btn_submit {}
.mbskin .btn_cancel {}
.mbskin button.btn_cancel {}
.mbskin .btn_cancel:focus, .mbskin .btn_cancel:hover {}
.mbskin a.btn_frmline, .mbskin button.btn_frmline {} /* ?怨좊젶甕곕뜇?뉐칰???곗쒔????*/
.mbskin button.btn_frmline {}
.mbskin .win_btn {} /* ??됯갯??*/
.mbskin .win_btn button {}
.mbskin .win_btn input {}
.mbskin .win_btn a {}
.mbskin .win_btn a:focus, .mbskin .win_btn a:hover {}
/* 野껊슣??癒?뒠 甕곌쑵??*/
.mbskin a.btn_b01 {}
.mbskin a.btn_b01:focus, .mbskin .btn_b01:hover {}
.mbskin a.btn_b02 {}
.mbskin a.btn_b02:focus, .mbskin .btn_b02:hover {}
.mbskin a.btn_admin {} /* ?온€?귐딆쁽 ?袁⑹뒠 甕곌쑵??*/
.mbskin a.btn_admin:focus, .mbskin a.btn_admin:hover {}

/* 疫꿸퀡????뵠??*/
.mbskin .tbl_head01 {}
.mbskin .tbl_head01 caption {}
.mbskin .tbl_head01 thead th {}
.mbskin .tbl_head01 thead a {}
.mbskin .tbl_head01 thead th input {} /* middle 嚥???롢늺 野껊슣?????꾨┛?癒?퐣 筌뤴뫖以??????筌ｋ똾寃뺠쳸類ㅻ뮞 ??깆뵥 繹먥뫁彛?*/
.mbskin .tbl_head01 tfoot th {}
.mbskin .tbl_head01 tfoot td {}
.mbskin .tbl_head01 tbody th {}
.mbskin .tbl_head01 td {}
.mbskin .tbl_head01 a {}
.mbskin td.empty_table {}

/* ?????뵠??*/
.mbskin table {}
.mbskin caption {}
.mbskin .frm_info {}
.mbskin .frm_file {}

.mbskin .tbl_frm01 {}
.mbskin .tbl_frm01 th {width:85px;}
.mbskin .tbl_frm01 td {}
.mbskin .tbl_frm01 textarea, .mb_skin tbl_frm01 .frm_input {}
.mbskin .tbl_frm01 textarea {}
/*
.mbskin .tbl_frm01 #captcha {}
.mbskin .tbl_frm01 #captcha input {}
*/
.mbskin .tbl_frm01 a {}

/* ?袁⑸땾??낆젾 */
.mbskin .required, .mbskin textarea.required {}

/* ???뵠?????됭퉪??類ㅼ벥 */
.mbskin .td_board {}
.mbskin .td_chk {}
.mbskin .td_date {}
.mbskin .td_datetime {}
.mbskin .td_group {}
.mbskin .td_mb_id {}
.mbskin .td_mng {}
.mbskin .td_name {}
.mbskin .td_nick {}
.mbskin .td_num {}
.mbskin .td_numbig {}

.mbskin .txt_active {}
.mbskin .txt_expired {}

/* ### 疫꿸퀡????????뚣끉??怨뺤춳??곸췅 ??### */

/* ???뜚揶쎛€????? */
#fregister section {margin:0 0 20px;padding:20px 0}
#fregister h2 {margin:0 0 20px;text-align:center}
#fregister textarea {display:block;margin-bottom:10px;padding:5px;width:98%;height:150px;border:1px solid #e9e9e9;background:#f7f7f7}
#fregister .fregister_agree {padding:10px 0 0;text-align:right}
#fregister .fregister_agree label {display:inline-block;margin-right:5px}
#fregister p {color:#e8180c;text-align:center}
#fregister .btn_confirm {margin-bottom:20px}
#fregister_private .tbl_head01 th{;text-align:center;border:1px solid #d1dee2;width:33%}
#fregister_private .tbl_head01 td {border:1px solid #e9e9e9}
#fregister_private .tbl_head01 caption{position:absolute;font-size:0;line-height:0;overflow:hidden}

/* ???뜚揶쎛€????낆젾 */
#fregisterform textarea {height:50px}

#fregisterform #msg_certify {margin:5px 0 0;padding:5px;border:1px solid #dbecff;background:#eaf4ff;text-align:center}

#fregisterform .frm_address {margin:5px 0 0}
#fregisterform #mb_addr3 {display:inline-block;margin:5px 0 0;vertical-align:middle}
#fregisterform #mb_addr_jibeon {display:block;margin:5px 0 0}

/* ???뜚揶쎛€???袁⑥┷ */
#reg_result {padding:50px 0 0}
#reg_result #result_email {margin:20px 0;padding:10px 50px;border-top:1px solid #e9e9e9;border-bottom:1px solid #dde4e9;background:#fff;line-height:2em}
#reg_result #result_email span {display:inline-block;width:150px}
#reg_result #result_email strong {color:#e8180c;font-size:1.2em}
#reg_result #result_coupon {margin:20px 0;padding:10px 50px;border-top:1px solid #e9e9e9;border-bottom:1px solid #dde4e9;background:#fff;line-height:2em}
#reg_result #result_coupon strong {color:#ff3061;font-weight:normal}
#reg_result p {line-height:1.8em}
#reg_result .btn_confirm {margin:50px 0}

/* ?袁⑹뵠????쑬?甕곕뜇??筌≪뼐由?*/
#find_info #mb_hp_label {display:inline-block;margin-left:10px}
#find_info #info_fs {margin:0 20px 20px;padding:0;background:#fff}
#find_info #info_fs .frm_input {width:70%}
#find_info p {margin:0 0 10px;line-height:1.8em}
#find_info #captcha {margin:0 20px}

/* 嚥≪뮄???*/
#mb_login {margin:0 auto;padding:100px 0;width:500px}
#mb_login h1 {margin:0 0 20px;font-size:1.3em}
#mb_login h2 {margin:0}
#mb_login p {padding:10px 0;line-height:1.5em}
#mb_login #login_fs {position:relative;margin:0;padding:20px 20px 20px 95px;border:1px solid #cfded8;border-bottom:0;background:#fff}
#mb_login #login_fs legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
#mb_login #login_fs label {letter-spacing:-0.1em}
#mb_login #login_fs .login_id {position:absolute;top:26px;left:95px}
#mb_login #login_fs .login_pw {position:absolute;top:52px;left:95px}
#mb_login #login_fs .frm_input {display:block;margin:0 0 5px 80px;width:162px}
#mb_login #login_fs .btn_submit {position:absolute;top:20px;right:95px;width:60px;height:53px}
#mb_login #login_info {margin:0 0 30px;padding:20px;border:1px solid #cfded8;background:#f5f6fa}
#mb_login #login_info div {text-align:right}

#mb_login_notmb {position:relative;margin:0 0 20px;padding:20px;border:1px solid #cfded8;background:#fff}
#mb_login_notmb #guest_privacy {margin:0 0 10px;padding:10px;height:150px;border:1px solid #e9e9e9;overflow:auto}
#mb_login_notmb .btn_confirm {padding:10px 0 0}

#mb_login_od {position:relative;margin:0;padding:20px 20px 20px 95px;border:1px solid #cfded8;border-bottom:0;background:#fff}
#mb_login_od legend {position:absolute;font-size:0;line-height:0;overflow:hidden}
#mb_login_od label {letter-spacing:-0.1em}
#mb_login_od .od_id {position:absolute;top:26px;left:95px}
#mb_login_od .od_pwd {position:absolute;top:52px;left:95px}
#mb_login_od .frm_input {display:block;margin:0 0 5px 80px}
#mb_login_od .btn_submit {position:absolute;top:20px;left:335px;width:52px;height:49px}
#mb_login_odinfo {margin:0 0 30px;padding:20px;border:1px solid #cfded8;background:#f5f6fa}
#mb_login_odinfo div {text-align:right}

/* 筌잛럩? */
#memo_view_contents {margin:0 auto 20px;width:90%}
#memo_view_contents h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#memo_view_ul {margin:0;padding:0 0 10px;border-bottom:1px solid #eee;list-style:none}
.memo_view_li {position:relative;padding:5px 0}
.memo_view_subj {display:inline-block;width:65px}
#memo_view p {padding:10px 0;min-height:150px;height:auto !important;height:150px;background:#fff;line-height:1.8em}

#memo_write textarea {height:100px}

/* ??쎄쾿??*/
#scrap_do table {margin:0 0 10px;width:100%}
#scrap_do textarea {height:100px}

/* ???뜚 ??쑬?甕곕뜇???類ㅼ뵥 */
#mb_confirm {margin:0 auto;padding:100px 0;width:500px}
#mb_confirm h1 {margin:0 0 20px;font-size:1.3em}
#mb_confirm p {padding:20px;border:1px solid #dde4e9;border-bottom:0;background:#fff}
#mb_confirm p strong {display:block}
#mb_confirm fieldset {margin:0 0 30px;padding:30px 0;border:1px solid #e9e9e9;background:#f5f6fa;text-align:center}
#mb_confirm fieldset .frm_input {background-color:#fff !important}
#mb_confirm label {letter-spacing:-0.1em}
#mb_confirm_id {display:inline-block;margin-right:20px;font-weight:bold}

/* ??쑬?疫꼲€ ??쑬?甕곕뜇???類ㅼ뵥 */
#pw_confirm {margin:0 auto;padding:100px 0;width:500px}
#pw_confirm h1 {margin:0 0 20px;font-size:1.3em}
#pw_confirm p {padding:20px;border:1px solid #dde4e9;border-bottom:0;background:#fff}
#pw_confirm p strong {display:block}
#pw_confirm fieldset {margin:0 0 30px;padding:30px 0;border:1px solid #e9e9e9;background:#f5f6fa;text-align:center}
#pw_confirm fieldset .frm_input {background-color:#fff !important}
#pw_confirm label {letter-spacing:-0.1em}
#pw_confirm_id {display:inline-block;margin-right:20px;font-weight:bold}

/* ??곗컭??*/
#formmail #subject {width:386px}
#formmail textarea {height:100px}

/* ?癒?┛???뻣 */
#profile table {margin-bottom:0}
#profile section {margin:0 auto 20px;padding:20px;width:86%}

#profile h2 {margin:0}

/* Modern Auth UI */
.mbskin-modern {
    --mb-primary: #4f46e5;
    --mb-primary-hover: #4338ca;
    --mb-text: #0f172a;
    --mb-muted: #64748b;
    --mb-border: #dbe3ee;
}

.mbskin-modern#mb_login { margin: 0; padding: 0; width: auto; }
.mbskin-modern #fregister p { color: var(--mb-muted); text-align: left; }

#mb_login.mbskin-modern,
#mb_confirm.mbskin-modern,
#pw_confirm.mbskin-modern,
#reg_result.mbskin-modern,
#find_info.mbskin-modern {
    margin: 0;
    padding: 0;
    width: auto;
}

#mb_login.mbskin-modern h1,
#mb_confirm.mbskin-modern h1,
#pw_confirm.mbskin-modern h1,
#reg_result.mbskin-modern h1,
#find_info.mbskin-modern h1 {
    margin: 0 0 8px;
    padding: 0;
    font-size: 34px;
    font-weight: 900;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--mb-text);
}

#mb_login.mbskin-modern p,
#mb_confirm.mbskin-modern p,
#pw_confirm.mbskin-modern p,
#reg_result.mbskin-modern p,
#find_info.mbskin-modern p {
    padding: 0;
    border: 0;
    background: transparent;
}

.mbskin-modern .mb-auth-shell {
    max-width: 980px;
    margin: 24px auto;
    padding: 0 12px;
}

.mbskin-modern .mb-auth-card {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid var(--mb-border);
    border-radius: 26px;
    padding: 26px;
    box-shadow: 0 26px 54px -42px rgba(15, 23, 42, 0.45);
}

#mb_login.mbskin-modern .mb-auth-card,
#mb_confirm.mbskin-modern .mb-auth-card,
#pw_confirm.mbskin-modern .mb-auth-card,
#reg_result.mbskin-modern .mb-auth-card,
#find_info.mbskin-modern .mb-auth-card {
    width: auto;
}

.mbskin-modern .mb-auth-card-wide { padding: 28px; }

.mbskin-modern h1 {
    margin: 0 0 8px;
    font-size: 34px;
    font-weight: 900;
    letter-spacing: -0.02em;
    color: var(--mb-text);
}

.mbskin-modern .mb-auth-desc {
    margin: 0 0 18px;
    color: var(--mb-muted);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.7;
}

.mbskin-modern .mb-auth-form label {
    display: block;
    margin: 0 0 6px;
    color: #334155;
    font-size: 13px;
    font-weight: 800;
}

.mbskin-modern .frm_input,
.mbskin-modern textarea,
.mbskin-modern select {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 14px;
    min-height: 46px;
    padding: 0 14px;
    background: #fff;
    color: #1e293b;
    box-shadow: none;
}

.mbskin-modern textarea {
    min-height: 160px;
    padding: 12px 14px;
}

.mbskin-modern .frm_input:focus,
.mbskin-modern textarea:focus,
.mbskin-modern select:focus {
    border-color: #6366f1;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12);
}

.mbskin-modern .mb-auth-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin: 10px 0 14px;
    color: var(--mb-muted);
    font-size: 12px;
}

.mbskin-modern .mb-check {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 700;
    color: #334155;
}

.mbskin-modern .btn_submit,
.mbskin-modern .btn01,
.mbskin-modern .btn02,
.mbskin-modern .btn_cancel,
.mbskin-modern .btn_frmline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    border-radius: 12px;
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #1e293b;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none !important;
    padding: 0 16px;
    transition: all .2s ease;
}

.mbskin-modern .btn_submit,
.mbskin-modern .btn01 {
    background: var(--mb-primary);
    border-color: var(--mb-primary);
    color: #fff;
}

.mbskin-modern .btn_submit:hover,
.mbskin-modern .btn01:hover {
    background: var(--mb-primary-hover);
    border-color: var(--mb-primary-hover);
    color: #fff;
}

.mbskin-modern .btn02:hover,
.mbskin-modern .btn_cancel:hover,
.mbskin-modern .btn_frmline:hover {
    border-color: var(--mb-primary);
    color: var(--mb-primary);
}

.mbskin-modern .mb-auth-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 12px;
}

.mbskin-modern .mb-auth-extra {
    border: 1px solid var(--mb-border);
    border-radius: 18px;
    background: #fff;
    padding: 16px;
}

#mb_login.mbskin-modern #mb_login_notmb,
#mb_login.mbskin-modern #mb_login_od,
#mb_login.mbskin-modern #mb_login_odinfo {
    position: static;
    margin: 14px 0 0;
    padding: 16px;
    border: 1px solid var(--mb-border);
    border-radius: 18px;
    background: #fff;
}

#mb_login.mbskin-modern #mb_login_notmb #guest_privacy {
    margin: 12px 0;
    padding: 14px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #f8fafc;
}

#mb_login.mbskin-modern #mb_login_od legend {
    position: static;
    font-size: 15px;
    line-height: 1.5;
    font-weight: 900;
    color: var(--mb-text);
    margin-bottom: 10px;
}

.mbskin-modern .mb-auth-row a,
.mbskin-modern .mb-auth-extra a {
    color: var(--mb-primary);
    font-weight: 700;
    text-decoration: none;
}

.mbskin-modern .mb-auth-row a:hover,
.mbskin-modern .mb-auth-extra a:hover {
    color: var(--mb-primary-hover);
}

.mbskin-modern input[type="checkbox"] {
    width: 16px;
    height: 16px;
}

.mbskin-modern #fregister section,
.mbskin-modern .tbl_frm01.tbl_wrap {
    border: 1px solid var(--mb-border);
    border-radius: 18px;
    background: #fff;
    padding: 16px;
    margin-bottom: 14px;
}

.mbskin-modern .mb-form-section-title {
    margin: 0 0 12px;
    font-size: 18px;
    font-weight: 900;
    color: var(--mb-text);
}

.mbskin-modern .tbl_frm01 table,
.mbskin-modern .tbl_head01 table {
    width: 100%;
    border-collapse: collapse;
}

.mbskin-modern .tbl_frm01 th,
.mbskin-modern .tbl_frm01 td,
.mbskin-modern .tbl_head01 th,
.mbskin-modern .tbl_head01 td {
    border-bottom: 1px solid #eef2f7;
    padding: 10px;
    vertical-align: top;
}

.mbskin-modern .tbl_frm01 tr:last-child th,
.mbskin-modern .tbl_frm01 tr:last-child td,
.mbskin-modern .tbl_head01 tr:last-child th,
.mbskin-modern .tbl_head01 tr:last-child td {
    border-bottom: 0;
}

.mbskin-modern .frm_info {
    display: block;
    margin-bottom: 6px;
    color: var(--mb-muted);
    font-size: 12px;
    line-height: 1.6;
}

@media (max-width: 991px) {
    .mbskin-modern .mb-auth-card,
    .mbskin-modern .mb-auth-card-wide { padding: 16px; border-radius: 18px; }
    .mbskin-modern h1,
    #mb_login.mbskin-modern h1,
    #mb_confirm.mbskin-modern h1,
    #pw_confirm.mbskin-modern h1,
    #reg_result.mbskin-modern h1,
    #find_info.mbskin-modern h1 { font-size: 28px; }
    .mbskin-modern .mb-auth-row { flex-direction: column; align-items: flex-start; }
    .mbskin-modern .mb-auth-actions { flex-direction: column; }
    .mbskin-modern .btn_submit,
    .mbskin-modern .btn01,
    .mbskin-modern .btn02,
    .mbskin-modern .btn_cancel { width: 100%; }
    #mb_login.mbskin-modern #mb_login_notmb,
    #mb_login.mbskin-modern #mb_login_od,
    #mb_login.mbskin-modern #mb_login_odinfo,
    .mbskin-modern .mb-auth-extra { padding: 14px; border-radius: 16px; }
    .mbskin-modern .tbl_frm01 th,
    .mbskin-modern .tbl_frm01 td,
    .mbskin-modern .tbl_head01 th,
    .mbskin-modern .tbl_head01 td { display: block; width: 100%; }
}

/* Brand Motion */
.mbskin-modern .mb-auth-card {
    animation: mbFadeUp .55s ease both;
}

.mbskin-modern .tbl_frm01.tbl_wrap,
.mbskin-modern #fregister section,
.mbskin-modern .mb-auth-actions,
.mbskin-modern .mb-auth-extra {
    animation: mbFadeUp .55s ease both;
}

.mbskin-modern .tbl_frm01.tbl_wrap:nth-of-type(1),
.mbskin-modern #fregister section:nth-of-type(1) { animation-delay: .06s; }
.mbskin-modern .tbl_frm01.tbl_wrap:nth-of-type(2),
.mbskin-modern #fregister section:nth-of-type(2) { animation-delay: .12s; }
.mbskin-modern .tbl_frm01.tbl_wrap:nth-of-type(3),
.mbskin-modern .mb-auth-actions { animation-delay: .18s; }

.mbskin-modern .btn_submit,
.mbskin-modern .btn01,
.mbskin-modern .btn02,
.mbskin-modern .btn_cancel,
.mbskin-modern .btn_frmline {
    transition: transform .18s ease, box-shadow .22s ease, border-color .2s ease, background-color .2s ease, color .2s ease;
}

.mbskin-modern .btn_submit:hover,
.mbskin-modern .btn01:hover,
.mbskin-modern .btn02:hover,
.mbskin-modern .btn_cancel:hover,
.mbskin-modern .btn_frmline:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 24px -18px rgba(79, 70, 229, 0.55);
}

.mbskin-modern .frm_input,
.mbskin-modern textarea,
.mbskin-modern select {
    transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

@keyframes mbFadeUp {
    0% { opacity: 0; transform: translateY(14px); }
    100% { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    .mbskin-modern .mb-auth-card,
    .mbskin-modern .tbl_frm01.tbl_wrap,
    .mbskin-modern #fregister section,
    .mbskin-modern .mb-auth-actions,
    .mbskin-modern .mb-auth-extra {
        animation: none !important;
    }

    .mbskin-modern .btn_submit,
    .mbskin-modern .btn01,
    .mbskin-modern .btn02,
    .mbskin-modern .btn_cancel,
    .mbskin-modern .btn_frmline,
    .mbskin-modern .frm_input,
    .mbskin-modern textarea,
    .mbskin-modern select {
        transition: none !important;
    }
}

/* Member CSS: theme/basic/mobile/skin/member/basic/style.css */
@charset "utf-8";
/* SIR 筌왖€??곷툡??*/

/* ### 疫꿸퀡????????뚣끉??怨뺤춳??곸췅 ??뽰삂 ### */

/* 甕곌쑵??*/
.mbskin a.btn01 {}
.mbskin a.btn01:focus, .mbskin a.btn01:hover {}
.mbskin a.btn02 {}
.mbskin a.btn02:focus, .mbskin .btn02:hover {}
.mbskin .btn_confirm {} /* ??뽯뻼??ｍ€?筌욊쑵六?*/
.mbskin .btn_submit {}
.mbskin .btn_cancel {}
.mbskin .btn_frmline {} /* ?怨좊젶甕곕뜇?뉐칰???곗쒔????*/
.mbskin .win_btn {} /* ??됯갯??*/
.mbskin .win_btn a {}
.mbskin .win_btn button {}
.mbskin .win_btn input {}
/* 野껊슣??癒?뒠 甕곌쑵??*/
.mbskin a.btn_b01 {}
.mbskin a.btn_b01:focus, .mbskin .btn_b01:hover {}
.mbskin a.btn_b02 {}
.mbskin a.btn_b02:focus, .mbskin .btn_b02:hover {}
.mbskin a.btn_admin {} /* ?온€?귐딆쁽 ?袁⑹뒠 甕곌쑵??*/
.mbskin a.btn_admin:focus, .mbskin a.btn_admin:hover {}

/* 疫꿸퀡????뵠??*/
.mbskin .tbl_head01 {}
.mbskin .tbl_head01 caption {}
.mbskin .tbl_head01 thead th {}
.mbskin .tbl_head01 thead a {}
.mbskin .tbl_head01 thead th input {} /* middle 嚥???롢늺 野껊슣?????꾨┛?癒?퐣 筌뤴뫖以??????筌ｋ똾寃뺠쳸類ㅻ뮞 ??깆뵥 繹먥뫁彛?*/
.mbskin .tbl_head01 tfoot th {}
.mbskin .tbl_head01 tfoot td {}
.mbskin .tbl_head01 tbody th {}
.mbskin .tbl_head01 td {}
.mbskin .tbl_head01 a {}
.mbskin td.empty_table {}

/* ?????뵠??*/
.mb_skin table {}
.mb_skin caption {}
.mb_skin .frm_info {}
.mb_skin .frm_file {}

.mbskin .tbl_frm01 {}
.mbskin .tbl_frm01 caption {}
.mbskin .tbl_frm01 th {}
.mbskin .tbl_frm01 td {}
.mbskin .tbl_frm01 textarea, .mbskin .frm_input {}
.mbskin .tbl_frm01 textarea {}
/*
.mbskin .tbl_frm01 #captcha {}
.mbskin .tbl_frm01 #captcha input {}
*/
.mbskin .tbl_frm01 a {}

.mbskin .required, .mbskin textarea.required {} /* ?袁⑸땾??낆젾 */

/* ???뵠?????됭퉪??類ㅼ벥 */
.mbskin .td_board {}
.mbskin .td_chk {}
.mbskin .td_date {}
.mbskin .td_datetime {}
.mbskin .td_group {}
.mbskin .td_mb_id {}
.mbskin .td_mng {}
.mbskin .td_name {}
.mbskin .td_nick {}
.mbskin .td_num {}
.mbskin .td_numbig {}

/* ### 疫꿸퀡????????뚣끉??怨뺤춳??곸췅 ??### */

/* ???뜚揶쎛€????? */
#fregister section {padding:15px;border-bottom:1px solid #eee;background:#fafafa}
#fregister h2 {margin:0 0 15px;text-align:center}
#fregister textarea {display:block;margin-bottom:10px;padding:5px;width:99%;height:150px;border:1px solid #cfded8;background:#f7f7f7}
.fregister_agree {padding:10px 0 0;text-align:right}
.fregister_agree label {display:inline-block;margin-right:5px}
#fregister p {color:#e8180c;text-align:center}
#fregister .btn_confirm {margin:15px 0}
#fregister_private .tbl_head01 {margin:0}
#fregister_private .tbl_head01 th{;text-align:center;border:1px solid #d1dee2;width:33%}
#fregister_private .tbl_head01 td {border:1px solid #e9e9e9;background:#fff}
#fregister_private .tbl_head01 caption{position:absolute;font-size:0;line-height:0;overflow:hidden;top:0;color:#fff}

/* ???뜚揶쎛€????낆젾 */
#fregisterform #reg_mb_email, #fregisterform .frm_address {width:100%}

#fregisterform textarea {width:100%;height:50px}

#fregisterform #msg_certify {margin:5px 0 0;padding:5px;border:1px solid #dbecff;background:#eaf4ff;text-align:center}

#fregisterform .frm_address {margin:5px 0 0}
#fregisterform #mb_addr3 {display:block;margin:5px 0 0}
#fregisterform #mb_addr_jibeon {display:block;margin:5px 0 0}

/* ???뜚揶쎛€???袁⑥┷ */
#reg_result {padding:40px 10px 0}
#reg_result #result_email {margin:20px 0;padding:10px 50px;border-top:1px solid #eee;border-bottom:1px solid #eee;background:#fff;line-height:2em}
#reg_result #result_email span {display:inline-block;width:150px}
#reg_result #result_email strong {color:#e8180c;font-size:1.2em}
#reg_result p {line-height:1.8em}
#reg_result .btn_confirm {margin:50px 0}

/* ?袁⑹뵠????쑬?甕곕뜇??筌≪뼐由?*/
#find_info #info_fs {margin:0 20px 10px}
#find_info #info_fs p {margin:0 0 10px;line-height:1.8em}
#find_info #info_fs #mb_email {width:100%}
#find_info #captcha {margin:0 20px;padding:0 0 10px}
#find_info #captcha input {margin-left:5px}

/* 嚥≪뮄???*/
#mb_login {margin:20px 0}
#mb_login h1 {margin:0 0 15px;padding:0 10px;font-size:1.3em}
#mb_login h2 {margin:0}
#mb_login p {padding:10px 0;line-height:1.5em}
#mb_login #login_frm {position:relative;padding:0 5px;font-size:1em}
#mb_login #login_frm div {padding:10px 0 0;text-align:right}
#mb_login .frm_input {display:block;margin-bottom:5px;padding:0;width:81%;height:1.8em;line-height:1.8em}
#mb_login .btn_submit {position:absolute;top:0;right:5px;padding:0 !important;width:18%;height:4.3em !important;text-align:center}
#mb_login section {margin:30px 0;padding:15px 10px;border:1px solid #cfded8;background:#f7f7f7}
#mb_login section div {text-align:right}

/* 筌잛럩? */
#memo_view_contents {margin:0 auto 20px;width:90%}
#memo_view_contents h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#memo_view_ul {margin:0;padding:0 0 10px;border-bottom:1px solid #eee;list-style:none}
.memo_view_li {position:relative;padding:5px 0}
.memo_view_subj {display:inline-block;width:65px}
#memo_view_ul a {}
#memo_view p {padding:10px 0;min-height:150px;height:auto !important;height:150px;line-height:1.8em}

#memo_list_ul {margin:0 20px;padding:0;border-top:1px solid #e9e9e9;list-style:none}
#memo_list_ul li {position:relative;padding:10px 0;border-bottom:1px solid #e9e9e9}
#memo_list_ul .memo_link {}
#memo_list_ul .memo_send {display:block;margin-top:4px}
#memo_list_ul .memo_send a{color:#777}
#memo_list_ul .memo_read {font-size:0.95em;color:#666}
#memo_list_ul .memo_del {position:absolute;top:10px;right:0}

#memo_write #me_recv_mb_id {width:98%}
#memo_write textarea {width:99%;height:100px}

/* ??쎄쾿??*/
#scrap_ul {margin:0 20px;padding:0;border-top:1px solid #e9e9e9;list-style:none}
#scrap_ul li {position:relative;padding:10px 35px 10px 0;border-bottom:1px solid #e9e9e9}
#scrap_ul .scrap_board {display:inline-block;margin:0 10px 0 0;font-weight:bold}
#scrap_ul .scrap_del {position:absolute;top:10px;right:0}

#scrap_do table {margin:0 0 10px;width:100%}
#scrap_do textarea {width:99%;height:100px}

/* ?????*/
#point_ul {margin:0 20px;padding:0;border-top:1px solid #e9e9e9;list-style:none}
#point_ul li {position:relative;padding:10px 0;border-bottom:1px solid #e9e9e9}
#point_ul .point_wrap01 {position:relative;padding:0 0 0 90px}
#point_ul .point_wrap02 {margin:7px 0 0;text-align:right}
#point_ul .point_date {position:absolute;top:0;left:0}

#point_sum {margin:0 20px}
#point_sum .sum_row {margin:0 0 1px;background:#f2f5f9}
#point_sum .sum_row:after {display:block;visibility:hidden;clear:both;content:''}
#point_sum .sum_tit, #point_sum .sum_val {display:block;margin:0 0 1px;padding:10px}
#point_sum .sum_tit {clear:both;float:left;width:100px}
#point_sum .sum_val {float:right}

/* ???뜚 ??쑬?甕곕뜇???類ㅼ뵥 */
#mb_confirm {margin:30px 0}
#mb_confirm h1 {margin:0 0 15px;padding:0 10px;font-size:1.3em}
#mb_confirm p {padding:15px 10px;border-bottom:1px solid #cfded8;border-bottom:0;background:#fff}
#mb_confirm p strong {display:block}
#mb_confirm fieldset {position:relative;margin:0 0 5px;padding:20px 10px;border-bottom:1px solid #cfded8;background:#f7f7f7}
#mb_confirm_pw {display:block;margin-top:10px;padding:0;width:88%;line-height:1.8em !important}
#mb_confirm .btn_submit {position:absolute;bottom:20px;right:10px;width:10%;height:1.9em !important;line-height:1.9em}

/* ??쑬?疫꼲€ ??쑬?甕곕뜇???類ㅼ뵥 */
#pw_confirm {margin:30px 0}
#pw_confirm h1 {margin:0 0 15px;padding:0 10px;font-size:1.3em}
#pw_confirm p {padding:15px 10px;border-bottom:1px solid #cfded8;border-bottom:0;background:#fff}
#pw_confirm p strong {display:block}
#pw_confirm fieldset {position:relative;margin:0 0 5px;padding:5px 5px 10px;border-bottom:1px solid #cfded8;background:#f7f7f7}
#pw_wr_password {display:block;margin-top:10px;padding:0;width:88%;line-height:1.8em !important}
#pw_confirm .btn_submit {position:absolute;bottom:10px;right:5px;width:10%;height:1.9em !important;line-height:1.9em}

/* ??곗컭??*/
#formmail #subject {width:98%}
#formmail textarea {width:99%;height:100px}

/* ?癒?┛???뻣 */
#profile table {margin-bottom:0}
#profile section {padding:10px 20px}
#profile h2 {margin:0}
#profile .sv_wrap a {margin:0 0 5px;padding:0;font-weight:bold;line-height:10px}

/* Modern Auth UI */
.mbskin-modern {
    --mb-primary: #4f46e5;
    --mb-primary-hover: #4338ca;
    --mb-text: #0f172a;
    --mb-muted: #64748b;
    --mb-border: #dbe3ee;
}

.mbskin-modern#mb_login { margin: 0; padding: 0; width: auto; }
.mbskin-modern #fregister p { color: var(--mb-muted); text-align: left; }

#mb_login.mbskin-modern,
#mb_confirm.mbskin-modern,
#pw_confirm.mbskin-modern,
#reg_result.mbskin-modern,
#find_info.mbskin-modern {
    margin: 0;
    padding: 0;
    width: auto;
}

#mb_login.mbskin-modern h1,
#mb_confirm.mbskin-modern h1,
#pw_confirm.mbskin-modern h1,
#reg_result.mbskin-modern h1,
#find_info.mbskin-modern h1 {
    margin: 0 0 8px;
    padding: 0;
    font-size: 26px;
    font-weight: 900;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--mb-text);
}

#mb_login.mbskin-modern p,
#mb_confirm.mbskin-modern p,
#pw_confirm.mbskin-modern p,
#reg_result.mbskin-modern p,
#find_info.mbskin-modern p {
    padding: 0;
    border: 0;
    background: transparent;
}

.mbskin-modern .mb-auth-shell { max-width: 980px; margin: 16px auto; padding: 0 8px; }
.mbskin-modern .mb-auth-card {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid var(--mb-border);
    border-radius: 18px;
    padding: 14px;
    box-shadow: 0 20px 46px -40px rgba(15, 23, 42, 0.45);
}

#mb_login.mbskin-modern .mb-auth-card,
#mb_confirm.mbskin-modern .mb-auth-card,
#pw_confirm.mbskin-modern .mb-auth-card,
#reg_result.mbskin-modern .mb-auth-card,
#find_info.mbskin-modern .mb-auth-card {
    width: auto;
}

.mbskin-modern h1 { margin: 0 0 8px; font-size: 26px; font-weight: 900; letter-spacing: -0.02em; color: var(--mb-text); }
.mbskin-modern .mb-auth-desc { margin: 0 0 14px; color: var(--mb-muted); font-size: 13px; font-weight: 600; line-height: 1.65; }

.mbskin-modern .mb-auth-form label { display: block; margin: 0 0 6px; color: #334155; font-size: 12px; font-weight: 800; }
.mbskin-modern .frm_input,
.mbskin-modern textarea,
.mbskin-modern select {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    min-height: 44px;
    padding: 0 12px;
    background: #fff;
    color: #1e293b;
    box-shadow: none;
}

.mbskin-modern textarea { min-height: 150px; padding: 10px 12px; }
.mbskin-modern .frm_input:focus,
.mbskin-modern textarea:focus,
.mbskin-modern select:focus { border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99,102,241,.12); }

.mbskin-modern .mb-auth-row { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin: 10px 0 14px; font-size: 12px; color: var(--mb-muted); }
.mbskin-modern .mb-check { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; color: #334155; }

.mbskin-modern .btn_submit,
.mbskin-modern .btn01,
.mbskin-modern .btn02,
.mbskin-modern .btn_cancel,
.mbskin-modern .btn_frmline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 42px;
    border-radius: 12px;
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #1e293b;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none !important;
    padding: 0 12px;
}

.mbskin-modern .btn_submit,
.mbskin-modern .btn01 { background: var(--mb-primary); border-color: var(--mb-primary); color: #fff; }
.mbskin-modern .mb-auth-actions { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }

.mbskin-modern .mb-auth-extra {
    border: 1px solid var(--mb-border);
    border-radius: 14px;
    background: #fff;
    padding: 12px;
}

#mb_login.mbskin-modern #mb_login_notmb,
#mb_login.mbskin-modern #mb_login_od,
#mb_login.mbskin-modern #mb_login_odinfo {
    position: static;
    margin: 12px 0 0;
    padding: 12px;
    border: 1px solid var(--mb-border);
    border-radius: 14px;
    background: #fff;
}

#mb_login.mbskin-modern #mb_login_notmb #guest_privacy {
    margin: 10px 0;
    padding: 12px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #f8fafc;
}

#mb_login.mbskin-modern #mb_login_od legend {
    position: static;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 900;
    color: var(--mb-text);
    margin-bottom: 8px;
}

.mbskin-modern .mb-auth-row a,
.mbskin-modern .mb-auth-extra a {
    color: var(--mb-primary);
    font-weight: 700;
    text-decoration: none;
}

.mbskin-modern input[type="checkbox"] {
    width: 16px;
    height: 16px;
}

.mbskin-modern #fregister section,
.mbskin-modern .tbl_frm01.tbl_wrap {
    border: 1px solid var(--mb-border);
    border-radius: 14px;
    background: #fff;
    padding: 12px;
    margin-bottom: 12px;
}

.mbskin-modern .mb-form-section-title { margin: 0 0 10px; font-size: 16px; font-weight: 900; color: var(--mb-text); }
.mbskin-modern .tbl_frm01 th,
.mbskin-modern .tbl_frm01 td,
.mbskin-modern .tbl_head01 th,
.mbskin-modern .tbl_head01 td { display: block; width: 100%; border-bottom: 1px solid #eef2f7; padding: 8px 0; }
.mbskin-modern .tbl_frm01 tr:last-child th,
.mbskin-modern .tbl_frm01 tr:last-child td,
.mbskin-modern .tbl_head01 tr:last-child th,
.mbskin-modern .tbl_head01 tr:last-child td { border-bottom: 0; }
.mbskin-modern .frm_info { display: block; margin-bottom: 6px; color: var(--mb-muted); font-size: 12px; line-height: 1.55; }

/* Brand Motion */
.mbskin-modern .mb-auth-card,
.mbskin-modern .tbl_frm01.tbl_wrap,
.mbskin-modern #fregister section,
.mbskin-modern .mb-auth-actions,
.mbskin-modern .mb-auth-extra {
    animation: mbFadeUp .45s ease both;
}

.mbskin-modern .tbl_frm01.tbl_wrap:nth-of-type(1),
.mbskin-modern #fregister section:nth-of-type(1) { animation-delay: .05s; }
.mbskin-modern .tbl_frm01.tbl_wrap:nth-of-type(2),
.mbskin-modern #fregister section:nth-of-type(2) { animation-delay: .1s; }
.mbskin-modern .tbl_frm01.tbl_wrap:nth-of-type(3),
.mbskin-modern .mb-auth-actions { animation-delay: .15s; }

.mbskin-modern .btn_submit,
.mbskin-modern .btn01,
.mbskin-modern .btn02,
.mbskin-modern .btn_cancel,
.mbskin-modern .btn_frmline {
    transition: transform .16s ease, box-shadow .2s ease, border-color .2s ease, background-color .2s ease, color .2s ease;
}

.mbskin-modern .btn_submit:active,
.mbskin-modern .btn01:active,
.mbskin-modern .btn02:active,
.mbskin-modern .btn_cancel:active,
.mbskin-modern .btn_frmline:active {
    transform: translateY(1px);
}

.mbskin-modern .frm_input,
.mbskin-modern textarea,
.mbskin-modern select {
    transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

@keyframes mbFadeUp {
    0% { opacity: 0; transform: translateY(12px); }
    100% { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    .mbskin-modern .mb-auth-card,
    .mbskin-modern .tbl_frm01.tbl_wrap,
    .mbskin-modern #fregister section,
    .mbskin-modern .mb-auth-actions,
    .mbskin-modern .mb-auth-extra {
        animation: none !important;
    }

    .mbskin-modern .btn_submit,
    .mbskin-modern .btn01,
    .mbskin-modern .btn02,
    .mbskin-modern .btn_cancel,
    .mbskin-modern .btn_frmline,
    .mbskin-modern .frm_input,
    .mbskin-modern textarea,
    .mbskin-modern select {
        transition: none !important;
    }
}

/* Member CSS: skin/member/basic/style.css */
@charset "utf-8";

/* Sub Title */
.sub-title { padding:10px 12px; border-top:4px solid #444; }
.sub-title h4 { padding:0; margin:0; line-height:50px; font-size:18px; }
.sub-title i { background: rgb(245, 245, 245); padding-top: 12px; border-radius: 50%; width: 50px; height: 50px; text-align: center; color: rgb(143, 143, 143); font-size: 25px; display: inline-block; }
.sub-title img { border-radius: 50%; width: 50px !important; height: 50px !important; display:inline-block; }

/* Follow */
.follow-skin .bg-heading { background:#fafafa; }
.follow-skin .col-follow .myinfo a { margin-right:15px; color:#888; font-size:11px; }
.follow-skin .sp-follow { margin-bottom:0px; border-top:3px solid #444; }
.follow-skin .img-photo i { background: rgb(245, 245, 245); padding: 16px; border-radius: 50%; width: 80px; height: 80px; text-align: center; color: rgb(143, 143, 143); font-size: 40px; display: inline-block; }
.follow-skin .img-photo img { border-radius: 50%; width: 80px !important; height: 80px !important; display:inline-block; }
@media all and (max-width:460px) {
	.responsive .follow-skin .col-follow { display:block !important; width:100% !important;}
}

/* Formmail */
.formmail-form { padding:20px; }
.formmail-type label { margin-right:10px; }

/* Memo */
.memo-send-info { padding:8px 20px;background:#fafafa;border-bottom:1px solid #eee; }
.memo-content { padding:20px; line-height:22px;border-bottom:1px solid #eee; margin-bottom:15px; }
.memo-send-form { padding:20px; }

/* Mypage */
.mypage-skin .img-photo i { background: rgb(245, 245, 245); padding: 16px; border-radius: 50%; width: 80px; height: 80px; text-align: center; color: rgb(143, 143, 143); font-size: 40px; display: inline-block; }
.mypage-skin .img-photo img { border-radius: 50%; width: 80px !important; height: 80px !important; display:inline-block; }
.mypage-skin .img-resize img { max-width:100%; height:auto; }
.mypage-skin .view-author .auth-photo { width:160px; padding-right:15px; }
@media all and (max-width:460px) {
	.responsive .mypage-skin .view-author .auth-photo { float:none; width:100%; padding-right:0px; }
}

/* MyPhoto */
.myphoto { margin-bottom:15px; }
.myphoto img { border-radius: 50%; display:inline-block; }
.myphoto i { background: rgb(245, 245, 245); padding: 18px; border-radius: 50%; text-align: center; color: rgb(143, 143, 143); font-size: 40px; display: inline-block; }

/* MyPost */
.mypost-skin i.img-fa { width:40px; height:40px; padding:10px 0px 0px; font-size:20px; text-align:center; color:#aaa; }
.mypost-skin .list-details { padding-top:4px; }
.mypost-skin .list-none { padding:50px 0px; }

.mypost-media { padding-bottom:10px; }
.mypost-media .photo i { border-radius:50%; background: rgb(245, 245, 245); padding: 15px; width: 64px; height: 64px; text-align: center; color: rgb(143, 143, 143); font-size: 30px; display: inline-block; }
.mypost-media .photo img { border-radius:50%; width: 64px !important; height: 64px !important; display:inline-block; }
.mypost-media .media { border-bottom:1px solid #eee; margin:7px 0px; padding:0px 12px 7px; }
.mypost-media :first-child.media { border-top:0px; margin-top:0px; padding-top:0px; }
.mypost-media .media-heading { padding:0; margin:0px; line-height: 20px; }
.mypost-media .media .media-body { padding-left:0px; }
.mypost-media .media .media-content {  }
.mypost-media .media .media-content p { margin:0px; padding:0px; }
.mypost-media .media .media-resize { margin-top:10px; }
.mypost-media .media .media-resize img { max-width:100%; height:auto; }
.mypost-media .media.media-reply { border:0px; border-top:1px solid #eee; margin:10px 0px 0px; padding:10px 0px 0px; }

/* Point */
.point-skin th, .point-skin td { white-space:nowrap; }
.point-skin td.po-content { white-space:normal; }

/* Profile */
.profile-skin .img-photo i { border-radius: 50%; background: rgb(245, 245, 245); padding: 16px; width: 80px; height: 80px; text-align: center; color: rgb(143, 143, 143); font-size: 40px; display: inline-block; }
.profile-skin .img-photo img { border-radius: 50%; width: 80px !important; height: 80px !important; display:inline-block; }
.profile-skin .img-resize img { max-width:100%; height:auto; }

/* Register */
.register-term { position: relative; height: 200px; margin:0px; overflow: auto; }
#agree11, #agree21 { margin:0px; }

/* Register Form */
.register-form .text-gap { margin-bottom:4px; }
.register-form .addr-line { margin-bottom:7px; }
@media all and (max-width:767px) {
	.responsive .register-form .cert-btn { margin-top:10px }
}

/* Response */
.myresponse-skin .res-info { margin:0; padding:7px 12px; }
.myresponse-skin .media { border-top:1px solid #eee; margin:6px 0px; padding:8px 12px 0px; }
.myresponse-skin .myresponse-list .media:first-child { border-top:0px; margin-top:0px; padding-top:8px; }
.myresponse-skin .media-heading { padding:0; margin:0; }
.myresponse-skin .photo i { border-radius: 50%; background: rgb(238, 238, 238); padding: 8px; width: 40px; height: 40px; text-align: center; color: rgb(255, 255, 255); font-size: 25px; display: inline-block; }
.myresponse-skin .photo img { border-radius: 50%; width: 40px !important; height: 40px !important; display:inline-block; }
.myresponse-skin .media-info i { margin-left:10px; }
.myresponse-skin .media-info i:first-child { margin-left:0px; }

/* Scrap */
.scrap-skin i.scrap-icon { background:#333; color:#fff; }
.scrap-skin .scrap-head { margin:0px; padding: 10px 20px; line-height:22px; background:#333; color:#fff; font-size:16px; text-align:center; }
.scrap-skin .scrap-form { padding: 10px 20px 20px; }

/* Shopping */
.shopping-skin i.img-fa { width:40px; height:40px; padding:10px 0px 0px; font-size:20px; text-align:center; color:#aaa; }
.shopping-skin .list-none { padding:50px 0px; }

/* Wishlist */
.wishlist-skin i.img-fa { width:40px; height:40px; padding:10px 0px 0px; font-size:20px; text-align:center; color:#aaa; }

/* Mypage */
.mypage-tbl th { background:#333 !important; color:#fff !important; text-align:center !important; white-space:nowrap;  }
.mypage-tbl td { text-align:center; white-space:nowrap; }

/* Modern Auth UI */
.mbskin-modern {
    --mb-primary: #4f46e5;
    --mb-primary-hover: #4338ca;
    --mb-text: #0f172a;
    --mb-muted: #64748b;
    --mb-border: #dbe3ee;
}

.mbskin-modern#mb_login { margin: 0; padding: 0; width: auto; }
.mbskin-modern #fregister p { color: var(--mb-muted); text-align: left; }

.mbskin-modern .mb-auth-shell {
    max-width: 980px;
    margin: 24px auto;
    padding: 0 12px;
}

.mbskin-modern .mb-auth-card {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid var(--mb-border);
    border-radius: 26px;
    padding: 26px;
    box-shadow: 0 26px 54px -42px rgba(15, 23, 42, 0.45);
}

.mbskin-modern .mb-auth-card-wide { padding: 28px; }

.mbskin-modern h1 {
    margin: 0 0 8px;
    font-size: 34px;
    font-weight: 900;
    letter-spacing: -0.02em;
    color: var(--mb-text);
}

.mbskin-modern .mb-auth-desc {
    margin: 0 0 18px;
    color: var(--mb-muted);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.7;
}

.mbskin-modern .mb-auth-form label {
    display: block;
    margin: 0 0 6px;
    color: #334155;
    font-size: 13px;
    font-weight: 800;
}

.mbskin-modern .frm_input,
.mbskin-modern textarea,
.mbskin-modern select {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 14px;
    min-height: 46px;
    padding: 0 14px;
    background: #fff;
    color: #1e293b;
    box-shadow: none;
}

.mbskin-modern textarea {
    min-height: 160px;
    padding: 12px 14px;
}

.mbskin-modern .frm_input:focus,
.mbskin-modern textarea:focus,
.mbskin-modern select:focus {
    border-color: #6366f1;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12);
}

.mbskin-modern .mb-auth-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin: 10px 0 14px;
    color: var(--mb-muted);
    font-size: 12px;
}

.mbskin-modern .mb-check {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 700;
    color: #334155;
}

.mbskin-modern .btn_submit,
.mbskin-modern .btn01,
.mbskin-modern .btn02,
.mbskin-modern .btn_cancel,
.mbskin-modern .btn_frmline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    border-radius: 12px;
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #1e293b;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none !important;
    padding: 0 16px;
    transition: all .2s ease;
}

.mbskin-modern .btn_submit,
.mbskin-modern .btn01 {
    background: var(--mb-primary);
    border-color: var(--mb-primary);
    color: #fff;
}

.mbskin-modern .btn_submit:hover,
.mbskin-modern .btn01:hover {
    background: var(--mb-primary-hover);
    border-color: var(--mb-primary-hover);
    color: #fff;
}

.mbskin-modern .btn02:hover,
.mbskin-modern .btn_cancel:hover,
.mbskin-modern .btn_frmline:hover {
    border-color: var(--mb-primary);
    color: var(--mb-primary);
}

.mbskin-modern .mb-auth-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 12px;
}

.mbskin-modern #fregister section,
.mbskin-modern .tbl_frm01.tbl_wrap {
    border: 1px solid var(--mb-border);
    border-radius: 18px;
    background: #fff;
    padding: 16px;
    margin-bottom: 14px;
}

.mbskin-modern .mb-form-section-title {
    margin: 0 0 12px;
    font-size: 18px;
    font-weight: 900;
    color: var(--mb-text);
}

.mbskin-modern .tbl_frm01 table,
.mbskin-modern .tbl_head01 table {
    width: 100%;
    border-collapse: collapse;
}

.mbskin-modern .tbl_frm01 th,
.mbskin-modern .tbl_frm01 td,
.mbskin-modern .tbl_head01 th,
.mbskin-modern .tbl_head01 td {
    border-bottom: 1px solid #eef2f7;
    padding: 10px;
    vertical-align: top;
}

.mbskin-modern .tbl_frm01 tr:last-child th,
.mbskin-modern .tbl_frm01 tr:last-child td,
.mbskin-modern .tbl_head01 tr:last-child th,
.mbskin-modern .tbl_head01 tr:last-child td {
    border-bottom: 0;
}

.mbskin-modern .frm_info {
    display: block;
    margin-bottom: 6px;
    color: var(--mb-muted);
    font-size: 12px;
    line-height: 1.6;
}

@media (max-width: 991px) {
    .mbskin-modern .mb-auth-card,
    .mbskin-modern .mb-auth-card-wide { padding: 16px; border-radius: 18px; }
    .mbskin-modern h1 { font-size: 28px; }
    .mbskin-modern .mb-auth-row { flex-direction: column; align-items: flex-start; }
    .mbskin-modern .mb-auth-actions { flex-direction: column; }
    .mbskin-modern .btn_submit,
    .mbskin-modern .btn01,
    .mbskin-modern .btn02,
    .mbskin-modern .btn_cancel { width: 100%; }
    .mbskin-modern .tbl_frm01 th,
    .mbskin-modern .tbl_frm01 td,
    .mbskin-modern .tbl_head01 th,
    .mbskin-modern .tbl_head01 td { display: block; width: 100%; }
}

/* Brand Motion */
.mbskin-modern .mb-auth-card {
    animation: mbFadeUp .55s ease both;
}

.mbskin-modern .tbl_frm01.tbl_wrap,
.mbskin-modern #fregister section,
.mbskin-modern .mb-auth-actions,
.mbskin-modern .mb-auth-extra {
    animation: mbFadeUp .55s ease both;
}

.mbskin-modern .tbl_frm01.tbl_wrap:nth-of-type(1),
.mbskin-modern #fregister section:nth-of-type(1) { animation-delay: .06s; }
.mbskin-modern .tbl_frm01.tbl_wrap:nth-of-type(2),
.mbskin-modern #fregister section:nth-of-type(2) { animation-delay: .12s; }
.mbskin-modern .tbl_frm01.tbl_wrap:nth-of-type(3),
.mbskin-modern .mb-auth-actions { animation-delay: .18s; }

.mbskin-modern .btn_submit,
.mbskin-modern .btn01,
.mbskin-modern .btn02,
.mbskin-modern .btn_cancel,
.mbskin-modern .btn_frmline {
    transition: transform .18s ease, box-shadow .22s ease, border-color .2s ease, background-color .2s ease, color .2s ease;
}

.mbskin-modern .btn_submit:hover,
.mbskin-modern .btn01:hover,
.mbskin-modern .btn02:hover,
.mbskin-modern .btn_cancel:hover,
.mbskin-modern .btn_frmline:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 24px -18px rgba(79, 70, 229, 0.55);
}

.mbskin-modern .frm_input,
.mbskin-modern textarea,
.mbskin-modern select {
    transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

@keyframes mbFadeUp {
    0% { opacity: 0; transform: translateY(14px); }
    100% { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    .mbskin-modern .mb-auth-card,
    .mbskin-modern .tbl_frm01.tbl_wrap,
    .mbskin-modern #fregister section,
    .mbskin-modern .mb-auth-actions,
    .mbskin-modern .mb-auth-extra {
        animation: none !important;
    }

    .mbskin-modern .btn_submit,
    .mbskin-modern .btn01,
    .mbskin-modern .btn02,
    .mbskin-modern .btn_cancel,
    .mbskin-modern .btn_frmline,
    .mbskin-modern .frm_input,
    .mbskin-modern textarea,
    .mbskin-modern select {
        transition: none !important;
    }
}

/* Member CSS: mobile/skin/member/basic/style.css */
@charset "utf-8";
/* SIR 筌왖€??곷툡??*/

/* ### 疫꿸퀡????????뚣끉??怨뺤춳??곸췅 ??뽰삂 ### */

/* 甕곌쑵??*/
.mbskin a.btn01 {}
.mbskin a.btn01:focus, .mbskin a.btn01:hover {}
.mbskin a.btn02 {}
.mbskin a.btn02:focus, .mbskin .btn02:hover {}
.mbskin .btn_confirm {} /* ??뽯뻼??ｍ€?筌욊쑵六?*/
.mbskin .btn_submit {}
.mbskin .btn_cancel {}
.mbskin .btn_frmline {} /* ?怨좊젶甕곕뜇?뉐칰???곗쒔????*/
.mbskin .win_btn {} /* ??됯갯??*/
.mbskin .win_btn a {}
.mbskin .win_btn button {}
.mbskin .win_btn input {}
/* 野껊슣??癒?뒠 甕곌쑵??*/
.mbskin a.btn_b01 {}
.mbskin a.btn_b01:focus, .mbskin .btn_b01:hover {}
.mbskin a.btn_b02 {}
.mbskin a.btn_b02:focus, .mbskin .btn_b02:hover {}
.mbskin a.btn_admin {} /* ?온€?귐딆쁽 ?袁⑹뒠 甕곌쑵??*/
.mbskin a.btn_admin:focus, .mbskin a.btn_admin:hover {}

/* 疫꿸퀡????뵠??*/
.mbskin .tbl_head01 {}
.mbskin .tbl_head01 caption {}
.mbskin .tbl_head01 thead th {}
.mbskin .tbl_head01 thead a {}
.mbskin .tbl_head01 thead th input {} /* middle 嚥???롢늺 野껊슣?????꾨┛?癒?퐣 筌뤴뫖以??????筌ｋ똾寃뺠쳸類ㅻ뮞 ??깆뵥 繹먥뫁彛?*/
.mbskin .tbl_head01 tfoot th {}
.mbskin .tbl_head01 tfoot td {}
.mbskin .tbl_head01 tbody th {}
.mbskin .tbl_head01 td {}
.mbskin .tbl_head01 a {}
.mbskin td.empty_table {}

/* ?????뵠??*/
.mb_skin table {}
.mb_skin caption {}
.mb_skin .frm_info {}
.mb_skin .frm_file {}

.mbskin .tbl_frm01 {}
.mbskin .tbl_frm01 caption {}
.mbskin .tbl_frm01 th {}
.mbskin .tbl_frm01 td {}
.mbskin .tbl_frm01 textarea, .mbskin .frm_input {}
.mbskin .tbl_frm01 textarea {}
/*
.mbskin .tbl_frm01 #captcha {}
.mbskin .tbl_frm01 #captcha input {}
*/
.mbskin .tbl_frm01 a {}

.mbskin .required, .mbskin textarea.required {} /* ?袁⑸땾??낆젾 */

/* ???뵠?????됭퉪??類ㅼ벥 */
.mbskin .td_board {}
.mbskin .td_chk {}
.mbskin .td_date {}
.mbskin .td_datetime {}
.mbskin .td_group {}
.mbskin .td_mb_id {}
.mbskin .td_mng {}
.mbskin .td_name {}
.mbskin .td_nick {}
.mbskin .td_num {}
.mbskin .td_numbig {}

/* ### 疫꿸퀡????????뚣끉??怨뺤춳??곸췅 ??### */

/* ???뜚揶쎛€????? */
#fregister section {padding:15px;border-bottom:1px solid #eee;background:#fafafa}
#fregister h2 {margin:0 0 15px;text-align:center}
#fregister textarea {display:block;margin-bottom:10px;padding:5px;width:99%;height:150px;border:1px solid #cfded8;background:#f7f7f7}
.fregister_agree {padding:10px 0 0;text-align:right}
.fregister_agree label {display:inline-block;margin-right:5px}
#fregister p {color:#e8180c;text-align:center}
#fregister .btn_confirm {margin:15px 0}
#fregister_private .tbl_head01 {margin:0}
#fregister_private .tbl_head01 th{;text-align:center;border:1px solid #d1dee2;width:33%}
#fregister_private .tbl_head01 td {border:1px solid #e9e9e9;background:#fff}
#fregister_private .tbl_head01 caption{position:absolute;font-size:0;line-height:0;overflow:hidden;top:0;color:#fff}

/* ???뜚揶쎛€????낆젾 */
#fregisterform #reg_mb_email, #fregisterform .frm_address {width:100%}

#fregisterform textarea {width:100%;height:50px}

#fregisterform #msg_certify {margin:5px 0 0;padding:5px;border:1px solid #dbecff;background:#eaf4ff;text-align:center}

#fregisterform .frm_address {margin:5px 0 0}
#fregisterform #mb_addr3 {display:block;margin:5px 0 0}
#fregisterform #mb_addr_jibeon {display:block;margin:5px 0 0}

/* ???뜚揶쎛€???袁⑥┷ */
#reg_result {padding:40px 10px 0}
#reg_result #result_email {margin:20px 0;padding:10px 50px;border-top:1px solid #eee;border-bottom:1px solid #eee;background:#fff;line-height:2em}
#reg_result #result_email span {display:inline-block;width:150px}
#reg_result #result_email strong {color:#e8180c;font-size:1.2em}
#reg_result #result_coupon {margin:20px 0;padding:10px 50px;border-top:1px solid #eee;border-bottom:1px solid #eee;background:#fff;line-height:2em}
#reg_result #result_coupon strong {color:#ff3061;font-weight:normal}
#reg_result p {line-height:1.8em}
#reg_result .btn_confirm {margin:50px 0}

/* ?袁⑹뵠????쑬?甕곕뜇??筌≪뼐由?*/
#find_info #info_fs {margin:0 20px 10px}
#find_info #info_fs p {margin:0 0 10px;line-height:1.8em}
#find_info #info_fs #mb_email {width:100%}
#find_info #captcha {margin:0 20px;padding:0 0 10px}
#find_info #captcha input {margin-left:5px}

/* 嚥≪뮄???*/
#mb_login {margin:20px 0}
#mb_login h1 {margin:0 0 15px;padding:0 10px;font-size:1.3em}
#mb_login h2 {margin:0}
#mb_login p {padding:10px 0;line-height:1.5em}
#mb_login #login_frm {position:relative;padding:0 5px;font-size:1em}
#mb_login #login_frm div {padding:10px 0 0;text-align:right}
#mb_login .frm_input {display:block;margin-bottom:5px;padding:0;width:81%;height:1.8em;line-height:1.8em}
#mb_login .btn_submit {position:absolute;top:0;right:5px;padding:0 !important;width:18%;height:4.3em !important;text-align:center}
#mb_login section {margin:30px 0;padding:15px 10px;border:1px solid #cfded8;background:#f7f7f7}
#mb_login section div {text-align:right}

#mb_login_notmb {margin:30px 0;padding:15px 10px;border:1px solid #cfded8;background:#f7f7f7}
#mb_login_notmb #guest_privacy {margin:0 0 10px;padding:10px;height:150px;border:1px solid #e9e9e9;background:#fff;overflow:auto}
#mb_login_notmb .btn_confirm {margin:20px 0 0;text-align:right}

#mb_login_od {position:relative;margin:20px 5px;border-bottom:0;background:#fff}
#mb_login_od legend {position:absolute;font-size:0;line-height:0;overflow:hidden}
#mb_login_od .od_id {position:absolute;top:26px;left:95px}
#mb_login_od .od_pwd {position:absolute;top:52px;left:95px}
#mb_login_od .frm_input {display:block;margin-bottom:5px;padding:0;width:80%;height:1.8em;line-height:1.8em}
#mb_login_od .btn_submit {position:absolute;top:0;right:0;padding:0 !important;width:18%;height:4em !important;text-align:center}
#mb_login_odinfo {margin:0 0 30px;padding:20px;border:1px solid #cfded8;background:#f7f7f7}
#mb_login_odinfo div {text-align:right}

/* 筌잛럩? */
#memo_view_contents {margin:0 auto 20px;width:90%}
#memo_view_contents h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#memo_view_ul {margin:0;padding:0 0 10px;border-bottom:1px solid #eee;list-style:none}
.memo_view_li {position:relative;padding:5px 0}
.memo_view_subj {display:inline-block;width:65px}
#memo_view_ul a {}
#memo_view p {padding:10px 0;min-height:150px;height:auto !important;height:150px;line-height:1.8em}

#memo_list_ul {margin:0 20px;padding:0;border-top:1px solid #e9e9e9;list-style:none}
#memo_list_ul li {position:relative;padding:10px 0;border-bottom:1px solid #e9e9e9}
#memo_list_ul .memo_link {}
#memo_list_ul .memo_send {display:block;margin-top:4px}
#memo_list_ul .memo_send a{color:#777}
#memo_list_ul .memo_read {font-size:0.95em;color:#666}
#memo_list_ul .memo_del {position:absolute;top:10px;right:0}

#memo_write #me_recv_mb_id {width:98%}
#memo_write textarea {width:99%;height:100px}

/* ??쎄쾿??*/
#scrap_ul {margin:0 20px;padding:0;border-top:1px solid #e9e9e9;list-style:none}
#scrap_ul li {position:relative;padding:10px 35px 10px 0;border-bottom:1px solid #e9e9e9}
#scrap_ul .scrap_board {display:inline-block;margin:0 10px 0 0;font-weight:bold}
#scrap_ul .scrap_del {position:absolute;top:10px;right:0}

#scrap_do table {margin:0 0 10px;width:100%}
#scrap_do textarea {width:99%;height:100px}

/* ?????*/
#point_ul {margin:0 20px;padding:0;border-top:1px solid #e9e9e9;list-style:none}
#point_ul li {position:relative;padding:10px 0;border-bottom:1px solid #e9e9e9}
#point_ul .point_wrap01 {position:relative;padding:0 0 0 90px}
#point_ul .point_wrap02 {margin:7px 0 0;text-align:right}
#point_ul .point_date {position:absolute;top:0;left:0}

#point_sum {margin:0 20px}
#point_sum .sum_row {margin:0 0 1px;background:#f2f5f9}
#point_sum .sum_row:after {display:block;visibility:hidden;clear:both;content:''}
#point_sum .sum_tit, #point_sum .sum_val {display:block;margin:0 0 1px;padding:10px}
#point_sum .sum_tit {clear:both;float:left;width:100px}
#point_sum .sum_val {float:right}

/* ???뜚 ??쑬?甕곕뜇???類ㅼ뵥 */
#mb_confirm {margin:30px 0}
#mb_confirm h1 {margin:0 0 15px;padding:0 10px;font-size:1.3em}
#mb_confirm p {padding:15px 10px;border-bottom:1px solid #cfded8;border-bottom:0;background:#fff}
#mb_confirm p strong {display:block}
#mb_confirm fieldset {position:relative;margin:0 0 5px;padding:20px 10px;border-bottom:1px solid #cfded8;background:#f7f7f7}
#mb_confirm_pw {display:block;margin-top:10px;padding:0;width:88%;line-height:1.8em !important}
#mb_confirm .btn_submit {position:absolute;bottom:20px;right:10px;width:10%;height:1.9em !important;line-height:1.9em}

/* ??쑬?疫꼲€ ??쑬?甕곕뜇???類ㅼ뵥 */
#pw_confirm {margin:30px 0}
#pw_confirm h1 {margin:0 0 15px;padding:0 10px;font-size:1.3em}
#pw_confirm p {padding:15px 10px;border-bottom:1px solid #cfded8;border-bottom:0;background:#fff}
#pw_confirm p strong {display:block}
#pw_confirm fieldset {position:relative;margin:0 0 5px;padding:5px 5px 10px;border-bottom:1px solid #cfded8;background:#f7f7f7}
#pw_wr_password {display:block;margin-top:10px;padding:0;width:88%;line-height:1.8em !important}
#pw_confirm .btn_submit {position:absolute;bottom:10px;right:5px;width:10%;height:1.9em !important;line-height:1.9em}

/* ??곗컭??*/
#formmail #subject {width:98%}
#formmail textarea {width:99%;height:100px}

/* ?癒?┛???뻣 */
#profile table {margin-bottom:0}
#profile section {padding:10px 20px}
#profile h2 {margin:0}

#profile .sv_wrap a {margin:0 0 5px;padding:0;font-weight:bold;line-height:10px}

/* Modern Auth UI */
.mbskin-modern {
    --mb-primary: #4f46e5;
    --mb-primary-hover: #4338ca;
    --mb-text: #0f172a;
    --mb-muted: #64748b;
    --mb-border: #dbe3ee;
}

/* Management UI */
.management-subnav {
    margin-bottom: 2rem;
}

.dashboard-shell {
    background: #f8fafc;
}

.dashboard-shell .animate-fadeIn {
    animation: dashboardFadeIn .3s ease-out;
}

.dashboard-shell .animate-slideDown {
    animation: dashboardSlideDown .3s ease-out;
}

.dashboard-shell .animate-scaleIn {
    animation: dashboardScaleIn .2s ease-out;
}

.custom-scrollbar::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.custom-scrollbar::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 3px;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 3px;
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

.dashboard-no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.dashboard-no-scrollbar::-webkit-scrollbar {
    display: none;
}

.view-section {
    display: none;
}

.view-section.active,
.expert-section.active {
    display: block;
}

.modal-overlay {
    display: none;
}

.modal-overlay.active {
    display: flex;
}

.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.page-hero-shell {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.page-hero-content {
    max-width: 920px;
}

.page-hero-stats {
    width: 100%;
    min-width: 0 !important;
}

@media (min-width: 1280px) {
    .page-hero-shell {
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
    }

    .page-hero-stats {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }
}

/* Tax Save Popup */
#scash {
    max-width: 760px;
    margin: 24px auto;
    padding: 24px;
    border: 1px solid #e2e8f0;
    border-radius: 32px;
    background: #ffffff;
    box-shadow: 0 30px 80px -50px rgba(15, 23, 42, 0.45);
}

#scash #win_title {
    margin: 0 0 8px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #0f172a;
    font-size: 32px;
    font-weight: 900;
    letter-spacing: -0.02em;
}

#scash section {
    margin-top: 18px;
    padding: 20px;
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

#scash section h2 {
    margin: 0 0 16px;
    color: #0f172a;
    font-size: 18px;
    font-weight: 900;
    letter-spacing: -0.02em;
}

#scash .tbl_head01.tbl_wrap {
    margin: 0;
    border: 0;
    background: transparent;
}

#scash .tbl_head01 table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #dbe3ee;
    border-radius: 18px;
    overflow: hidden;
    background: #fff;
}

#scash .tbl_head01 th,
#scash .tbl_head01 td {
    padding: 14px 16px;
    border-bottom: 1px solid #eef2f7;
    vertical-align: middle;
}

#scash .tbl_head01 tbody tr:last-child th,
#scash .tbl_head01 tbody tr:last-child td {
    border-bottom: 0;
}

#scash .tbl_head01 th {
    width: 180px;
    background: #f8fafc;
    color: #334155;
    font-size: 13px;
    font-weight: 800;
}

#scash .tbl_head01 td {
    color: #0f172a;
    font-size: 14px;
    font-weight: 700;
}

#scash .frm_input,
#scash input[type="text"] {
    width: 100%;
    min-height: 46px;
    border: 1px solid #cbd5e1;
    border-radius: 14px;
    background: #fff;
    color: #0f172a;
    padding: 0 14px;
    box-shadow: none;
}

#scash .frm_input:focus,
#scash input[type="text"]:focus {
    border-color: #6366f1;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12);
}

#scash input[type="radio"] {
    margin-right: 6px;
}

#scash label {
    color: #334155;
    font-weight: 700;
}

#scash #scash_apply {
    margin-top: 18px;
    display: flex;
    align-items: center;
    gap: 12px;
}

#scash #show_pay_btn,
#scash #show_progress {
    display: inline-flex;
    align-items: center;
}

#scash button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    border: 1px solid #4f46e5;
    border-radius: 16px;
    background: #4f46e5;
    color: #fff;
    padding: 0 22px;
    font-size: 14px;
    font-weight: 900;
    transition: all .2s ease;
}

#scash button:hover {
    background: #4338ca;
    border-color: #4338ca;
}

#scash_empty {
    max-width: 640px;
    margin: 40px auto;
    padding: 24px;
    border: 1px solid #fecaca;
    border-radius: 24px;
    background: #fff1f2;
    color: #be123c;
    font-size: 15px;
    font-weight: 800;
    text-align: center;
}

@media (max-width: 767px) {
    #scash {
        margin: 12px;
        padding: 16px;
        border-radius: 24px;
    }

    #scash #win_title {
        font-size: 26px;
    }

    #scash section {
        padding: 14px;
        border-radius: 18px;
    }

    #scash .tbl_head01 table,
    #scash .tbl_head01 tbody,
    #scash .tbl_head01 tr,
    #scash .tbl_head01 th,
    #scash .tbl_head01 td {
        display: block;
        width: 100%;
    }

    #scash .tbl_head01 th {
        border-bottom: 0;
        border-top: 1px solid #eef2f7;
    }

    #scash .tbl_head01 tbody tr:first-child th {
        border-top: 0;
    }

    #scash #scash_apply {
        flex-direction: column;
        align-items: stretch;
    }

    #scash button,
    #scash #show_pay_btn,
    #scash #show_progress {
        width: 100%;
    }
}

@keyframes dashboardFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes dashboardSlideDown {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes dashboardScaleIn {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}

.management-app .nowhosting_managemnt_content {
    background: transparent !important;
    padding: 0 !important;
}

.management-app hr {
    margin: 2rem 0 !important;
    border: 0 !important;
    border-top: 1px solid #e2e8f0 !important;
}

.management-app h2 {
    margin: 0 0 .75rem;
    color: #0f172a;
    font-size: 1.75rem;
    font-weight: 900;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.management-app p {
    color: #475569;
    line-height: 1.75;
}

.management-app .management-hero-card,
.management-app .management-section-card {
    border: 1px solid #e2e8f0;
    background: #fff;
    border-radius: 2rem;
    padding: 1.5rem;
    box-shadow: 0 24px 60px -42px rgba(15, 23, 42, 0.35);
}

.management-app .management-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.management-app .management-kpi {
    border: 1px solid #e2e8f0;
    background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
    border-radius: 1.5rem;
    padding: 1rem 1.125rem;
}

.management-app .management-kpi small {
    display: block;
    color: #64748b;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.management-app .management-kpi strong {
    display: block;
    margin-top: .65rem;
    color: #0f172a;
    font-size: 1.5rem;
    font-weight: 900;
    letter-spacing: -0.03em;
}

.management-app .user_make {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    padding: 1.25rem;
    margin-top: 1rem;
    border: 1px solid #e2e8f0;
    border-radius: 1.75rem;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 24px 60px -42px rgba(15, 23, 42, 0.3);
}

.management-app .main_input,
.management-app .main_select,
.management-app .user_make input,
.management-app .user_make select {
    min-height: 48px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 14px !important;
    background: #fff !important;
    color: #0f172a !important;
    padding: 0 14px !important;
    margin: 0 !important;
    box-shadow: none !important;
}

.management-app .main_input:focus,
.management-app .main_select:focus,
.management-app .user_make input:focus,
.management-app .user_make select:focus {
    border-color: #6366f1 !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12) !important;
}

.management-app .hosting_button,
.management-app .user_make_button,
.management-app .main_button,
.management-app .main_button_mini,
.management-app .main_redbutton_mini {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    border-radius: 14px !important;
    border: 1px solid #cbd5e1 !important;
    background: #fff !important;
    color: #0f172a !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    padding: 0 16px !important;
    transition: transform .18s ease, box-shadow .18s ease, border-color .2s ease, background-color .2s ease, color .2s ease;
}

.management-app .user_make_button,
.management-app .main_button {
    background: #4f46e5 !important;
    border-color: #4f46e5 !important;
    color: #fff !important;
}

.management-app .main_redbutton_mini {
    background: #ef4444 !important;
    border-color: #ef4444 !important;
    color: #fff !important;
}

.management-app .hosting_button:hover,
.management-app .user_make_button:hover,
.management-app .main_button:hover,
.management-app .main_button_mini:hover,
.management-app .main_redbutton_mini:hover {
    transform: translateY(-1px);
    box-shadow: 0 16px 28px -20px rgba(79, 70, 229, 0.35);
}

.management-app .user_hosting_list {
    width: 100%;
    margin: 1rem 0 1.75rem !important;
    border-collapse: separate !important;
    border-spacing: 0;
    border: 1px solid #dbe3ee !important;
    border-radius: 1.75rem;
    overflow: hidden;
    background: #fff !important;
    box-shadow: 0 24px 60px -42px rgba(15, 23, 42, 0.35);
}

.management-app .user_hosting_list th {
    background: #f8fafc !important;
    color: #0f172a !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: .04em;
    text-transform: uppercase;
    padding: 14px 12px !important;
    border: 1px solid #e2e8f0 !important;
    text-align: center;
}

.management-app .user_hosting_list td {
    background: #fff !important;
    color: #334155 !important;
    font-size: 13px !important;
    padding: 12px !important;
    border: 1px solid #eef2f7 !important;
    text-align: center;
    vertical-align: top;
}

.management-app .user_hosting_domain_db {
    width: 100%;
    border-collapse: separate !important;
    border-spacing: 12px;
    background: transparent !important;
}

.management-app .user_hosting_domain_db td {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
}

.management-app .host_info,
.management-app .db_info {
    width: calc(33.333% - 12px) !important;
    min-width: 220px;
    margin: 0 12px 12px 0 !important;
    float: left;
}

.management-app .host_info table,
.management-app .db_info table {
    width: 100%;
    height: auto !important;
    border-collapse: separate !important;
    border-spacing: 0;
    overflow: hidden;
    border-radius: 1.25rem;
    border: 1px solid #dbe3ee !important;
    background: #fff !important;
    box-shadow: 0 18px 45px -35px rgba(15, 23, 42, 0.35);
}

.management-app .host_info td,
.management-app .db_info td {
    border: 1px solid #eef2f7 !important;
    background: #fff !important;
    color: #334155 !important;
    font-size: 12px !important;
    padding: 10px !important;
}

.management-app .firewall_config_table {
    width: 100%;
    border-collapse: separate !important;
    border-spacing: 0;
    border: 1px solid #dbe3ee !important;
    border-radius: 1.5rem;
    overflow: hidden;
    background: #fff !important;
}

.management-app .firewall_config_table td {
    border: 1px solid #eef2f7 !important;
    background: #fff !important;
    color: #334155 !important;
    padding: 10px !important;
}

.management-app .firewall_config_table td:nth-child(1) {
    background: #f8fafc !important;
    color: #0f172a !important;
    font-weight: 800;
}

.management-app .firewall_config_label {
    display: block;
    position: relative;
    width: 70px;
    height: 26px;
    background: #d3d3d3;
    border-radius: 30px;
    transition: background .4s ease;
    margin: 0;
}

.management-app .firewall_config_label::after {
    content: "";
    position: absolute;
    left: 3px;
    top: 50%;
    width: 20px;
    height: 20px;
    border-radius: 100%;
    background-color: #fff;
    transform: translateY(-50%);
    box-shadow: 1px 3px 4px rgba(0, 0, 0, 0.1);
    transition: all .4s ease;
}

.management-app .firewall_config_label::before {
    content: "OFF";
    font-size: 15px;
    font-family: Arial, Helvetica, sans-serif;
    position: absolute;
    left: 30px;
    top: 50%;
    transform: translateY(-50%);
    transition: all .4s ease;
}

.management-app .firewall_config {
    display: none;
}

.management-app .firewall_config:checked + label {
    background: #0948b3;
}

.management-app .firewall_config:checked + label::after {
    left: calc(100% - 23px);
}

.management-app .firewall_config:checked + label::before {
    content: "ON";
    color: #fff;
    left: 10px;
}

.management-app .firewall_country_list {
    line-height: 120% !important;
}

.management-app .firewall_country_list a {
    font-size: small;
    color: #111827;
    background-color: gainsboro;
    padding-left: 5px;
    padding-right: 5px;
    cursor: pointer;
    display: inline-block;
    margin: 1px;
}

.management-app .main_top_banner {
    display: flex;
    align-items: center;
    min-height: 70px;
    margin-top: 1rem !important;
    padding: 0 1.25rem;
    border: 1px solid #dbe3ee !important;
    border-radius: 1.5rem;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
    color: #0f172a;
    font-size: 16px !important;
    font-weight: 800;
}

.management-app #form_result,
.management-app #ajax_result {
    margin-top: 1rem;
}

.management-app .slogan {
    margin: 0 0 1.5rem !important;
    color: #0f172a;
    font-size: 2rem;
    font-weight: 900;
    letter-spacing: -0.02em;
    text-align: left !important;
}

.management-app .partner_box,
.management-app .work_list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.management-app .partner_introduce {
    padding: 1.5rem !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 1.75rem;
    background: #fff !important;
    box-shadow: 0 24px 60px -42px rgba(15, 23, 42, 0.35);
    margin: 0 !important;
    text-align: left !important;
}

.management-app .partner_introduce h4 {
    margin: 0 0 .75rem;
    color: #0f172a;
    font-size: 1.35rem;
    font-weight: 900;
    letter-spacing: -0.02em;
    text-align: left !important;
}

.management-app .partner_introduce p {
    margin: 0 0 .75rem;
    text-align: left !important;
}

.management-app .partner_introduce pre {
    margin: 0;
    white-space: pre-wrap;
    word-break: keep-all;
    font-family: inherit;
    color: #334155;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 1rem;
    padding: 1rem;
    line-height: 1.8;
}

.management-app .work {
    width: 100%;
    margin: 0 !important;
    text-align: left;
    display: flex;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 1.75rem;
    background: #fff !important;
    box-shadow: 0 24px 60px -42px rgba(15, 23, 42, 0.35);
}

.management-app .work_data {
    width: 100% !important;
    float: none !important;
    text-align: left !important;
    padding: 1.25rem;
}

.management-app .work_name,
.management-app .work_content,
.management-app .work_content2 {
    width: 100%;
    height: auto !important;
    padding: 0 !important;
    margin-bottom: 1rem;
}

.management-app .work_name h3 {
    color: #0f172a;
    font-size: 1.25rem;
    font-weight: 900 !important;
    letter-spacing: -0.02em;
}

.management-app .work p,
.management-app .work h3 {
    text-align: left !important;
    margin: 0;
}

.management-app .work_into_link {
    color: #64748b;
}

.management-app .work_view {
    width: 150px !important;
    float: none !important;
    display: flex;
    align-items: stretch;
    border-left: 1px solid #e2e8f0;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.management-app .work_view button,
.management-app .work button {
    border: 0 !important;
    outline: 0;
    padding: 1rem !important;
    color: #0f172a !important;
    background: transparent !important;
    text-align: center;
    cursor: pointer;
    width: 100%;
    height: 100%;
    font-size: 15px !important;
    font-weight: 900 !important;
}

.management-app .user_task_list {
    width: 100%;
    border-collapse: separate !important;
    border-spacing: 0;
    border: 1px solid #dbe3ee !important;
    border-radius: 1.25rem;
    overflow: hidden;
    background: #fff !important;
}

.management-app .user_task_list th {
    font-size: 11px !important;
    border: 1px solid #e2e8f0 !important;
    padding: 12px 10px !important;
    text-align: center;
    background: #f8fafc !important;
    color: #0f172a !important;
    font-weight: 900 !important;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.management-app .user_task_list td {
    font-size: 13px !important;
    border: 1px solid #eef2f7 !important;
    padding: 10px !important;
    text-align: center;
    background: #ffffff !important;
    color: #334155 !important;
}

.management-app .partner_data,
.management-app .task_data {
    text-align: left !important;
}

.management-app .status_progress,
.management-app .status_confirm {
    width: 100%;
    background: transparent !important;
    border: 0 !important;
    border-collapse: separate !important;
    border-spacing: 0;
    table-layout: fixed;
}

.management-app .status_progress td,
.management-app .status_confirm td {
    width: 10%;
    color: #94a3b8 !important;
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    cursor: pointer;
    font-weight: 800;
}

.management-app .progress10,
.management-app .progress20,
.management-app .progress30,
.management-app .progress40,
.management-app .progress50,
.management-app .progress60,
.management-app .progress70,
.management-app .progress80,
.management-app .progress90,
.management-app .progress100,
.management-app .confirm10,
.management-app .confirm20,
.management-app .confirm30,
.management-app .confirm40,
.management-app .confirm50,
.management-app .confirm60,
.management-app .confirm70,
.management-app .confirm80,
.management-app .confirm90,
.management-app .confirm100 {
    background: #dcfce7 !important;
    color: #166534 !important;
    border-color: #86efac !important;
}

.management-app .detail-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    border-bottom: 1px solid #e2e8f0;
    padding-bottom: 1.25rem;
    margin-bottom: 1.5rem;
}

.management-app .detail-title {
    margin: 0;
    color: #0f172a;
    font-size: 2rem;
    font-weight: 900;
    letter-spacing: -0.03em;
}

.management-app .close-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 0 16px;
    background: #fff;
    color: #0f172a;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
    transition: all .18s ease;
}

.management-app .close-button:hover {
    border-color: #cbd5e1;
    background: #f8fafc;
}

.management-app .section-content {
    margin: 0 !important;
    padding: 0 !important;
}

.management-app .detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.management-app .detail-card,
.management-app .chart-section {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid #e2e8f0;
    border-radius: 1.5rem;
    padding: 1.25rem;
    box-shadow: 0 24px 60px -42px rgba(15, 23, 42, 0.2);
}

.management-app .detail-card h4,
.management-app .chart-section h4 {
    margin-top: 0;
    margin-bottom: 1rem;
    color: #0f172a;
    font-size: 1.1rem;
    font-weight: 900;
    letter-spacing: -0.02em;
    border-bottom: 1px solid #e2e8f0;
    padding-bottom: .85rem;
}

.management-app .detail-item {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .75rem 0;
    border-bottom: 1px dashed #dbe3ee;
}

.management-app .detail-item:last-child {
    border-bottom: 0;
}

.management-app .detail-item strong {
    color: #475569;
    font-weight: 800;
}

.management-app .detail-item span {
    color: #0f172a;
    text-align: right;
}

.management-app .status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.management-app .status-active {
    background-color: #e6ffe6;
    color: #28a745;
}

.management-app .status-suspended {
    background-color: #ffe6e6;
    color: #dc3545;
}

.management-app .status-cpu-overload {
    background-color: #fff3cd;
    color: #ffc107;
}

.management-app .chart-controls {
    display: flex;
    gap: .75rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.management-app .chart-controls button {
    min-height: 42px;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    background: #fff;
    color: #334155;
    padding: 0 16px;
    font-size: 13px;
    font-weight: 800;
    transition: all .18s ease;
}

.management-app .chart-controls button.active,
.management-app .chart-controls button:hover {
    background: #4f46e5;
    border-color: #4f46e5;
    color: #fff;
}

.management-app .chart-wrapper {
    position: relative;
    height: 450px;
    width: 100%;
    margin-top: 20px;
}

.management-app .chart-loading {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.9);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.2em;
    color: #555;
    z-index: 10;
    border-radius: 8px;
}

.management-app .sw-wrapper {
    border-radius: 2rem;
    overflow: hidden;
    box-shadow: 0 30px 80px -52px rgba(15, 23, 42, 0.45);
}

.management-app .clearfix {
    clear: both;
}

@media (max-width: 1199px) {
    .management-app .host_info,
    .management-app .db_info {
        width: calc(50% - 12px) !important;
    }
}

@media (max-width: 991px) {
    .management-app .management-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .management-app .host_info,
    .management-app .db_info {
        width: 100% !important;
        margin-right: 0 !important;
    }

    .management-app .user_make {
        padding: 1rem;
    }

    .management-app .work {
        flex-direction: column;
    }

    .management-app .work_view {
        width: 100% !important;
        border-left: 0;
        border-top: 1px solid #e2e8f0;
    }

    .management-app .detail-header {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 767px) {
    .management-app .management-kpi-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .management-app h2 {
        font-size: 1.45rem;
    }

    .management-app .user_hosting_list {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }

    .management-app .user_task_list {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }

    .management-app .partner_introduce pre {
        font-size: 13px;
    }
}

.mbskin-modern#mb_login { margin: 0; padding: 0; width: auto; }
.mbskin-modern #fregister p { color: var(--mb-muted); text-align: left; }

.mbskin-modern .mb-auth-shell { max-width: 980px; margin: 16px auto; padding: 0 8px; }
.mbskin-modern .mb-auth-card {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid var(--mb-border);
    border-radius: 18px;
    padding: 14px;
    box-shadow: 0 20px 46px -40px rgba(15, 23, 42, 0.45);
}

.mbskin-modern h1 { margin: 0 0 8px; font-size: 26px; font-weight: 900; letter-spacing: -0.02em; color: var(--mb-text); }
.mbskin-modern .mb-auth-desc { margin: 0 0 14px; color: var(--mb-muted); font-size: 13px; font-weight: 600; line-height: 1.65; }

.mbskin-modern .mb-auth-form label { display: block; margin: 0 0 6px; color: #334155; font-size: 12px; font-weight: 800; }
.mbskin-modern .frm_input,
.mbskin-modern textarea,
.mbskin-modern select {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    min-height: 44px;
    padding: 0 12px;
    background: #fff;
    color: #1e293b;
    box-shadow: none;
}

.mbskin-modern textarea { min-height: 150px; padding: 10px 12px; }
.mbskin-modern .frm_input:focus,
.mbskin-modern textarea:focus,
.mbskin-modern select:focus { border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99,102,241,.12); }

.mbskin-modern .mb-auth-row { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin: 10px 0 14px; font-size: 12px; color: var(--mb-muted); }
.mbskin-modern .mb-check { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; color: #334155; }

.mbskin-modern .btn_submit,
.mbskin-modern .btn01,
.mbskin-modern .btn02,
.mbskin-modern .btn_cancel,
.mbskin-modern .btn_frmline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 42px;
    border-radius: 12px;
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #1e293b;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none !important;
    padding: 0 12px;
}

.mbskin-modern .btn_submit,
.mbskin-modern .btn01 { background: var(--mb-primary); border-color: var(--mb-primary); color: #fff; }
.mbskin-modern .mb-auth-actions { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }

.mbskin-modern #fregister section,
.mbskin-modern .tbl_frm01.tbl_wrap {
    border: 1px solid var(--mb-border);
    border-radius: 14px;
    background: #fff;
    padding: 12px;
    margin-bottom: 12px;
}

.mbskin-modern .mb-form-section-title { margin: 0 0 10px; font-size: 16px; font-weight: 900; color: var(--mb-text); }
.mbskin-modern .tbl_frm01 th,
.mbskin-modern .tbl_frm01 td,
.mbskin-modern .tbl_head01 th,
.mbskin-modern .tbl_head01 td { display: block; width: 100%; border-bottom: 1px solid #eef2f7; padding: 8px 0; }
.mbskin-modern .tbl_frm01 tr:last-child th,
.mbskin-modern .tbl_frm01 tr:last-child td,
.mbskin-modern .tbl_head01 tr:last-child th,
.mbskin-modern .tbl_head01 tr:last-child td { border-bottom: 0; }
.mbskin-modern .frm_info { display: block; margin-bottom: 6px; color: var(--mb-muted); font-size: 12px; line-height: 1.55; }

/* Brand Motion */
.mbskin-modern .mb-auth-card,
.mbskin-modern .tbl_frm01.tbl_wrap,
.mbskin-modern #fregister section,
.mbskin-modern .mb-auth-actions,
.mbskin-modern .mb-auth-extra {
    animation: mbFadeUp .45s ease both;
}

.mbskin-modern .tbl_frm01.tbl_wrap:nth-of-type(1),
.mbskin-modern #fregister section:nth-of-type(1) { animation-delay: .05s; }
.mbskin-modern .tbl_frm01.tbl_wrap:nth-of-type(2),
.mbskin-modern #fregister section:nth-of-type(2) { animation-delay: .1s; }
.mbskin-modern .tbl_frm01.tbl_wrap:nth-of-type(3),
.mbskin-modern .mb-auth-actions { animation-delay: .15s; }

.mbskin-modern .btn_submit,
.mbskin-modern .btn01,
.mbskin-modern .btn02,
.mbskin-modern .btn_cancel,
.mbskin-modern .btn_frmline {
    transition: transform .16s ease, box-shadow .2s ease, border-color .2s ease, background-color .2s ease, color .2s ease;
}

.mbskin-modern .btn_submit:active,
.mbskin-modern .btn01:active,
.mbskin-modern .btn02:active,
.mbskin-modern .btn_cancel:active,
.mbskin-modern .btn_frmline:active {
    transform: translateY(1px);
}

.mbskin-modern .frm_input,
.mbskin-modern textarea,
.mbskin-modern select {
    transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

@keyframes mbFadeUp {
    0% { opacity: 0; transform: translateY(12px); }
    100% { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    .mbskin-modern .mb-auth-card,
    .mbskin-modern .tbl_frm01.tbl_wrap,
    .mbskin-modern #fregister section,
    .mbskin-modern .mb-auth-actions,
    .mbskin-modern .mb-auth-extra {
        animation: none !important;
    }

    .mbskin-modern .btn_submit,
    .mbskin-modern .btn01,
    .mbskin-modern .btn02,
    .mbskin-modern .btn_cancel,
    .mbskin-modern .btn_frmline,
    .mbskin-modern .frm_input,
    .mbskin-modern textarea,
    .mbskin-modern select {
        transition: none !important;
    }
}

/* Management ServerWAF Styles */
/* Modern & Sophisticated CSS Variables */
:root {
    --sw-primary: #4f46e5;
    --sw-primary-hover: #4338ca;
    --sw-secondary: #0f172a;
    --sw-accent: #8b5cf6;
    --sw-success: #10b981;
    --sw-danger: #ef4444;
    --sw-warning: #f59e0b;
    --sw-bg: #f8fafc;
    --sw-card-bg: #ffffff;
    --sw-text-main: #1e293b;
    --sw-text-sub: #64748b;
    --sw-border: #e2e8f0;
    --sw-radius-lg: 16px;
    --sw-radius-md: 12px;
    --sw-radius-sm: 8px;
    --sw-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --sw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --sw-shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

/* Scoped Reset */
.sw-wrapper {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    color: var(--sw-text-main);
    line-height: 1.5;
    background-color: var(--sw-bg);
    min-height: 800px;
    box-sizing: border-box;
}

.sw-wrapper *, .sw-wrapper *::before, .sw-wrapper *::after {
    box-sizing: inherit;
}

/* Helper Classes */
.sw-hidden { display: none !important; }
.sw-flex { display: flex; }
.sw-items-center { align-items: center; }
.sw-justify-between { justify-content: space-between; }
.sw-justify-center { justify-content: center; }
.sw-gap-2 { gap: 0.5rem; }
.sw-gap-4 { gap: 1rem; }
.sw-w-full { width: 100%; }
.sw-text-center { text-align: center; }

/* Hero Section */
.sw-hero {
    background: linear-gradient(135deg, #0f172a 0%, #1e1b4b 100%);
    padding: 80px 20px 120px;
    text-align: center;
    color: white;
    position: relative;
    overflow: hidden;
}

.sw-hero-title {
	color:#ffffff;
    font-size: 3rem;
    font-weight: 800;
    margin: 0 0 1rem;
    letter-spacing: -0.02em;
}

.sw-hero-title span {
    background: linear-gradient(to right, #818cf8, #c084fc);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.sw-hero-desc {
    font-size: 1.25rem;
    color: #cbd5e1;
    margin: 0 auto 1.5rem;
    max-width: 600px;
    font-weight: 300;
}

.sw-point-badge {
    display: inline-flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(8px);
    padding: 8px 16px;
    border-radius: 9999px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    font-size: 0.9rem;
    margin-top: 20px;
}

/* Main Container */
.sw-container {
    max-width: 1200px;
    margin: -80px auto 40px;
    padding: 0 20px;
    position: relative;
    z-index: 10;
}

/* Card */
.sw-card {
    background: var(--sw-card-bg);
    border-radius: var(--sw-radius-lg);
    box-shadow: var(--sw-shadow-lg);
    border: 1px solid var(--sw-border);
    overflow: hidden;
    margin-bottom: 40px;
}

/* Tabs */
.sw-tabs {
    display: flex;
    border-bottom: 1px solid var(--sw-border);
}

.sw-tab {
    flex: 1;
    padding: 20px;
    text-align: center;
    cursor: pointer;
    font-weight: 600;
    color: var(--sw-text-sub);
    background: #f8fafc;
    transition: all 0.2s ease;
    border: none;
    font-size: 1rem;
}

.sw-tab:hover {
    background: #f1f5f9;
    color: var(--sw-text-main);
}

.sw-tab.sw-active {
    background: white;
    color: var(--sw-primary);
    border-bottom: 2px solid var(--sw-primary);
}

/* Form Section */
.sw-form-section {
    padding: 40px;
}

.sw-section-header {
    display: flex;
    align-items: flex-start;
    margin-bottom: 30px;
    gap: 15px;
}

.sw-step-num {
    width: 36px;
    height: 36px;
    background: linear-gradient(135deg, var(--sw-primary), var(--sw-accent));
    color: white;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}

.sw-step-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--sw-text-main);
    margin: 0 0 5px;
}

.sw-step-desc {
    font-size: 0.9rem;
    color: var(--sw-text-sub);
    margin: 0;
}

/* Input Group */
.sw-input-group {
    margin-bottom: 20px;
    margin-left: 50px;
}

.sw-label {
    display: block;
    font-size: 0.9rem;
    font-weight: 600;
    margin-bottom: 8px;
    color: var(--sw-text-main);
}

.sw-input {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid var(--sw-border);
    border-radius: var(--sw-radius-md);
    font-size: 1rem;
    transition: all 0.2s;
    background: #fff;
    color: var(--sw-text-main);
}

.sw-input:focus {
    outline: none;
    border-color: var(--sw-primary);
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1);
}

.sw-select {
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 1em;
}

/* Plan Grid */
.sw-plan-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-left: 50px;
}

.sw-plan-card {
    border: 1px solid var(--sw-border);
    border-radius: var(--sw-radius-lg);
    padding: 24px;
    cursor: pointer;
    transition: all 0.2s;
    background: white;
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.sw-plan-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--sw-shadow);
    border-color: #cbd5e1;
}

.sw-plan-card.sw-selected {
    border-color: var(--sw-primary);
    background: #eef2ff;
    box-shadow: 0 0 0 2px var(--sw-primary);
}

.sw-plan-badge {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--sw-accent);
    color: white;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 9999px;
    box-shadow: var(--sw-shadow-sm);
}

.sw-plan-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.sw-plan-type {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--sw-text-sub);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.sw-check-circle {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--sw-primary);
    display: none;
    align-items: center;
    justify-content: center;
}

.sw-selected .sw-check-circle { display: flex; }

.sw-plan-price {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--sw-text-main);
}

.sw-plan-price span {
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--sw-text-sub);
}

/* Tier Headers */
.sw-tier-header {
    text-align: center;
    padding: 10px;
    border-radius: var(--sw-radius-md);
    margin-bottom: 10px;
    color: white;
    font-size: 0.85rem;
    font-weight: 700;
}
.sw-tier-basic { background: linear-gradient(135deg, #3b82f6, #2563eb); }
.sw-tier-pro { background: linear-gradient(135deg, #8b5cf6, #7c3aed); }
.sw-tier-ent { background: linear-gradient(135deg, #f97316, #ea580c); }

/* Payment Footer */
.sw-payment-footer {
    padding: 30px 40px;
    border-top: 1px solid var(--sw-border);
    background: #f8fafc;
}

.sw-total-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    padding: 20px;
    background: white;
    border-radius: var(--sw-radius-md);
    border: 1px solid var(--sw-border);
}

.sw-total-label {
    font-weight: 600;
    color: var(--sw-text-sub);
}

.sw-total-amount {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--sw-primary);
}

.sw-btn-submit {
    width: 100%;
    padding: 16px;
    background: linear-gradient(135deg, var(--sw-primary), var(--sw-primary-hover));
    color: white;
    border: none;
    border-radius: var(--sw-radius-md);
    font-size: 1.1rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s;
    box-shadow: 0 4px 6px -1px rgba(79, 70, 229, 0.4);
}

.sw-btn-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(79, 70, 229, 0.5);
}

/* Table Section */
.sw-table-container {
    overflow-x: auto;
}

.sw-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.95rem;
}

.sw-table th {
    text-align: left;
    padding: 16px 20px;
    background: #f1f5f9;
    color: var(--sw-text-sub);
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
}

.sw-table td {
    padding: 16px 20px;
    border-bottom: 1px solid var(--sw-border);
    color: var(--sw-text-main);
}

.sw-status-active {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: #ecfdf5;
    color: var(--sw-success);
    border-radius: 9999px;
    font-size: 0.8rem;
    font-weight: 600;
}

.sw-status-expired {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: #fef2f2;
    color: var(--sw-danger);
    border-radius: 9999px;
    font-size: 0.8rem;
    font-weight: 600;
}

.sw-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.sw-code {
    font-family: monospace;
    background: #f1f5f9;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 0.85rem;
    color: var(--sw-text-sub);
}

/* Modal */
.sw-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(4px);
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.sw-modal.sw-show {
    display: flex;
}

.sw-modal-content {
    background: white;
    width: 100%;
    max-width: 500px;
    border-radius: var(--sw-radius-lg);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    overflow: hidden;
    animation: swSlideUp 0.3s ease-out;
}

@keyframes swSlideUp {
    from { transform: translateY(20px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.sw-modal-header {
    background: linear-gradient(135deg, var(--sw-primary), var(--sw-accent));
    padding: 20px 25px;
    color: white;
}

.sw-modal-title {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 700;
}

.sw-modal-body {
    padding: 25px;
    max-height: 400px;
    overflow-y: auto;
    color: var(--sw-text-main);
}

.sw-term-item {
    margin-bottom: 20px;
}

.sw-term-title {
    font-weight: 700;
    margin-bottom: 5px;
    font-size: 0.95rem;
}

.sw-term-desc {
    font-size: 0.9rem;
    color: var(--sw-text-sub);
    padding-left: 10px;
    border-left: 3px solid var(--sw-border);
}

.sw-modal-footer {
    padding: 20px 25px;
    background: #f8fafc;
    border-top: 1px solid var(--sw-border);
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.sw-btn-cancel {
    padding: 10px 20px;
    border: 1px solid var(--sw-border);
    border-radius: var(--sw-radius-md);
    background: white;
    color: var(--sw-text-sub);
    font-weight: 600;
    cursor: pointer;
}

.sw-btn-confirm {
    padding: 10px 25px;
    border: none;
    border-radius: var(--sw-radius-md);
    background: var(--sw-primary);
    color: white;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 4px 6px -1px rgba(79, 70, 229, 0.3);
}

/* Responsive */
@media (max-width: 1024px) {
    .sw-plan-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .sw-plan-grid { grid-template-columns: 1fr; margin-left: 0; }
    .sw-input-group { margin-left: 0; }
    .sw-step-num { margin-bottom: 10px; }
    .sw-section-header { flex-direction: column; gap: 5px; }
    .sw-form-section { padding: 25px; }
    .sw-table th, .sw-table td { padding: 12px; }
    .sw-table th:nth-child(2), .sw-table td:nth-child(2) { display: none; } /* Hide plan name on mobile */
}