/* ===============================
   IMPORTS
=============================== */
@import url(../../../css/reset.css);
@import url(../css/common.css);
@import url(../css/button.css);
@import url(../css/style.css);


body{font-family:'Pretendard','Noto Sans KR',sans-serif;background:#f5f6fa;color:#333;}

/* ===============================
   GUIDE WRAP & SECTIONS
=============================== */
.guide_wrap{max-width:1200px;margin:60px auto;background:#fff;border-radius:16px;box-shadow:0 4px 10px rgba(0,0,0,0.08);padding:40px 50px;}
.guide_wrap h1{font-size:26px;margin-bottom:25px;font-weight:700;color:#222;}

.guide_section{margin:60px 0;}
.guide_section h2{font-size:22px;font-weight:600;}
.guide_section h3{font-size:20px;font-weight:500;color:#0072ff;margin:40px 0 12px 0;}

/* ===============================
   GUIDE INFO
=============================== */
.guide_info{background:#fafafa;border:1px solid #eee;padding:15px 20px;border-radius:10px;margin-bottom:25px;}
.guide_info ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:15px 30px;}

/* ===============================
   FILTER BUTTONS
=============================== */
.filter_wrap{margin-bottom:15px;display:flex;gap:8px;}
.filter_btn{padding:8px 16px;border:1px solid #ccc;background:#fff;border-radius:6px;font-size:14px;cursor:pointer;transition:.2s;}
.filter_btn:hover{background:#f0f0f0;}
.filter_btn.active{background:#0072ff;border-color:#0072ff;color:#fff;}

/* ===============================
   TABLE GUIDE
=============================== */
.tb_guide{width:100%;border-collapse:collapse;font-size:14px;}
.tb_guide th,.tb_guide td{border:1px solid #ddd;padding:10px 12px;text-align:center;}
.tb_guide th{background:#f9f9f9;font-weight:600;}
.tb_guide a{color:#0072ff;text-decoration:none;}
.tb_guide a:hover{text-decoration:underline;}

/* STATUS COLORS */
.done{color:#198754;font-weight:600;}
.ing{color:#e67e22;font-weight:600;}
.wait{color:#aaa;font-weight:600;}

/* ===============================
   BUTTON GUIDE
=============================== */
.btn_wrap{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:25px;justify-content:flex-start;}
.btn{border-radius:6px;font-size:14px;cursor:pointer;font-weight:500;border:none;transition:.2s;}
.btn_default{background:#fff;border:1px solid #ccc;color:#333;}.btn_default:hover{background:#f8f8f8;}
.btn_primary{background:#0072ff;color:#fff;}.btn_primary:hover{background:#005edc;}
.btn_danger{background:#e74c3c;color:#fff;}.btn_danger:hover{background:#c0392b;}
.btn_warning{background:#f39c12;color:#fff;}.btn_warning:hover{background:#e67e22;}
.btn_sub{background:#6c757d;color:#fff;}.btn_sub:hover{background:#5a6268;}
.btn_sm{padding:5px 10px;font-size:13px;}.btn_md{padding:8px 16px;font-size:14px;}.btn_lg{padding:12px 24px;font-size:16px;}

/* ===============================
   FORM ELEMENTS
=============================== */
.form_wrap{display:flex;flex-direction:column;gap:10px;margin-bottom:25px;}
input[type="text"],input[type="email"],input[type="password"],textarea,select{border:1px solid #ccc;border-radius:6px;padding:8px 12px;font-size:14px;width:100%;transition:.2s;}
input:focus,textarea:focus,select:focus{border-color:#0072ff;box-shadow:0 0 0 2px rgba(0,114,255,0.1);outline:none;}
textarea{min-height:100px;resize:vertical;}

.form_wrap.email_wrap{gap:8px;justify-content:flex-start;flex-direction:row;}
.form_wrap.radio_wrap, .form_wrap.checkbox_wrap{flex-direction:row;}
.form_wrap .input_post{width:calc(48% - 105px);}

/* ===============================
   COLOR GUIDE
=============================== */
.color_guide{display:flex;flex-wrap:wrap;gap:12px;}
.color_box{width:120px;border-radius:6px;overflow:hidden;text-align:center;font-size:12px;border:1px solid #ddd;}
.color_box .sample{height:50px;}.color_box .code{padding:6px;background:#fafafa;}
.status_wrap{margin:60px 0 0 0;}
.status_wrap span{margin:0 16px 0 0;}

/* ===============================
   RESPONSIVE
=============================== */
@media (max-width:768px){.guide_wrap{padding:20px;}.guide_info ul{flex-direction:column;}.tb_guide th,.tb_guide td{font-size:12px;padding:8px;}}