@font-face {
    font-family: "SUIT Variable";
    font-weight: 100 900;
    src: local("SUIT Variable");
    src: url("/font/SUIT-Variable.woff2") format("woff2-variations");
}
body {
    background: #f5f5f5;
    overflow: hidden;
    font-family: "SUIT Variable" !important;
}
a:hover {
    color: #ff3838;
}
.contents.main {
    margin: 0;
    min-width: unset;
    width: unset;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}
.main .title {
    font-size: 25px;
    color: #303030;
    font-weight: 600;
}
.main .logo {
    font-size: 50px;
    color: #303030;
    font-weight: 700;
    margin: 28px 0;
}
.main .login_ingo {
    color: #767676;
    font-size: 22px;
    font-weight: 600;
}
.main .form_box {
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 400px;
  margin: 40px auto 0;
  padding: 0 10px;
  box-sizing: border-box;
}

.main .form_box p {
  background: #303030;
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  height: 60px;
  line-height: 60px;
  border-radius: 8px 0 0 8px;
  text-align: center;
  padding: 0 20px;
  margin: 0;
  white-space: nowrap;
  flex: 0 0 auto; /* 크기 고정 */
}

.main .form_box input {
  border: 1px solid #e1e1e1;
  border-left: none;
  border-radius: 0 8px 8px 0;
  padding: 10px 20px;
  text-align: center;
  font-size: 20px;
  color: #303030;
  font-weight: 500;
  height: 60px;
  box-sizing: border-box;
  flex: 1; /* 남은 공간 차지 */
  min-width: 0; /* 줄바꿈 방지 */
}

.main .event_button {
    background: #303030;
    color: #fff;
    padding: 20px 10px;
    width: 250px;
    border-radius: 12px;
    font-size: 22px;
    margin-top: 30px;
    cursor: pointer;
}
.main footer {
    color: #767676;
    font-size: 18px;
    margin-top: 50px;
}
#headersUser {
    min-width: 100%;
}
/* 일반사용자자 모드 일시 헤더 */
#headersUser,
#headers {
    background: #fff;
    border-bottom: 1px solid #dfe1e5;
    padding: 20px 44px;
    box-sizing: border-box;
    height: auto;
}
#headersUser .logo,
#headers .logo {
    margin: 0;
    width: auto;
}
#headersUser .logo_txt,
#headers .logo_txt {
    line-height: 1.4;
}
#headersUser .logo_txt span,
#headers .logo_txt span {
    color: #303030;
    font-size: 32px;
    font-weight: 900;
}
#headersUser .logo .logo_subtxt,
#headers .logo .logo_subtxt {
    color: #303030;
    font-size: 18px;
    line-height: 1.4;
    font-weight: 600;
}
#headersUser .member,
#headers .member {
    color: #303030;
    margin: 0;
    line-height: 1;
    font-size: 16px;
}
#headersUser .member strong,
#headers .member strong {
    font-size: 18px;
}
#headersUser .logout,
#headers .logout {
    color: #6f6f6f;
    border: 1px solid #6f6f6f;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 600;
    padding: 8px 12px;
    transition: all 0.3s;
}
#headersUser a.logout:hover {
    background: #303030;
    color: #fff;
}

/* 관리자 모드 일시 헤더더 id="headersUser" 에 admin 클래스 추가 필요 */
#headers.admin {
    background: #303030;
    min-width: 1151px;
}
#headers.admin .logo_txt span {
    color: #fff;
}
#headers.admin .logo .logo_subtxt {
    color: #fff;
}
#headers.admin .member {
    color: #fff;
}
#headers.admin .logout {
    color: #fff;
    border: 1px solid #fff;
}
#headers.admin a.logout:hover {
    background: #fff;
    color: #303030;
}

/* ✅ LNB 전체 래퍼 (토글 기준 위치 설정) */
.LNB_wrap {
    position: relative; /* 토글 버튼 기준 위치 지정 */
    border-right: 1px solid #dfe1e5;
    width: 230px;        /* PC 기준 너비 */
    min-width: 230px;    /* 최소 너비 고정 */
    box-sizing: border-box;
    overflow: scroll;
    transition: width 0.3s ease; /* 슬라이딩 애니메이션 */
}

/* ✅ 토글 접힘 상태 */
.LNB_wrap.collapsed {
    width: 40px !important;       /* 축소 너비 */
    min-width: 40px !important;
    overflow: hidden !important;
}

/* ✅ 메뉴 내용 감춤 */
.LNB_wrap.collapsed .category {
    display: none !important;
}

/* ✅ 토글 버튼 컨테이너 */
.lnb_toggle_btn {
    position: absolute;
    top: 12px;       /* ⬅️ 버튼 위치: 상단에서 거리 (조정 가능) */
    right: 1px;     /* ⬅️ 버튼 위치: 우측에서 거리 (조정 가능) */
    z-index: 10;    /* 이 버튼을 다른 요소들보다 위에 표시하기 위해 */
    cursor: pointer;
}

/* ✅ 토글 아이콘 이미지 */
.lnb_toggle_btn img {
    width: 40px;     /* ⬅️ 이미지 크기 (크면 눈에 띔) */
    height: 40px;
}

.category ul {
    box-sizing: border-box;
}
.category ul li {
    font-size: 18px;
    height: auto;
    font-weight: 400;
    padding: 6px 10px 6px 0;
}
.category ul li a {
    color: #6f6f6f;
    padding: 0;
}
.category a.over_s {
    font-size: 18px;
    color: #1c1c1c;
    font-weight: 600;
    border-bottom: none;
}
.category a.over_s:hover {
    text-decoration: none;
}
.category {
    padding: 0 16px;
}
.cate_step1_1_blue p {
    border-radius: 12px;
    margin: 20px 0 0;
    padding: 8px;
    display: flex;
    align-items: center;
    gap: 4px;
}
.cate_step1_1_blue p img {
    width: 24px;
}
.cate_step1_1_blue p span {
    margin: 0;
    font-size: 20px;
    color: #1c1c1c;
    font-weight: 600;
}
.category ul {
    padding: 0;
}
.category ul li {
    margin-top: 8px;
}
.cate_step1_1_blue {
    border-bottom: 0;
}
.contents_wrap .title_sub2 {
    font-size: 24px;
    padding-left: 15px;
    position: relative;
    flex: 1 30%;
}
.contents_wrap .title_sub2::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 5px;
    height: calc(100% - 10px);
    background: #1c1c1c;
    border-radius: 99px;
}
.contents_wrap {
    background: #f5f5f5;
    box-sizing: border-box;
    overflow-y: scroll;
    padding-bottom: 150px;
}
.table_wrap {
    border-radius: 12px;
    border: 1px solid #dfe1e5;
    background: transparent;
    margin-bottom: 45px;
}
.table_wrap.request {
    min-width: 872px;
}
.table_wrap.request table th {
    padding: 20px 10px;
    border-bottom: 1px solid #dfe1e5;
    border-right: none;
}
.table_wrap table {
    border: none;
    border-radius: 12px;
    overflow: hidden;
    border-collapse: collapse;
}
.table_wrap table .type3 {
    border-bottom: 1px solid #dfe1e5;
}
.table_wrap table .stripslashes th {
    border-top: 1px solid #dfe1e5;
}
.table_wrap table tr:last-child td {
    border-bottom: 0;
}
.table_wrap table th {
    background: #fbfbfc;
    font-size: 16px;
    color: #1c1c1c;
    font-weight: 600;
    padding: 10px 0;
    border-right: 1px solid #dfe1e5;
}
.table_wrap table th:last-child {
    border-right: 0;
}
.table_wrap table th.model_select {
    width: 220px;
    box-sizing: border-box;
}
.table_wrap.noti {
    min-width: 872px;
}
.table_wrap.noti table th {
    border-bottom: 1px solid #dfe1e5;
    border-right: none;
    padding: 20px 10px;
}
.table_wrap table td {
    background: #fff;
    border-bottom: 1px solid #dfe1e5;
    border-right: 1px solid #dfe1e5;
    position: relative;
    padding: 21px 0px 21px;
}
.table_wrap table td:last-child {
    border-right: 0;
}
.table_wrap table td .search_icon {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
}
.table_wrap table td.item_name {
    font-weight: 600;
    font-size: 16px;
    text-align: left;
    padding-left: 20px;
}
.table_wrap.noti table td,
.table_wrap.request table td {
    border-right: none;
    border-bottom: none;
    color: #6f6f6f;
    padding: 17px 0;
}
.table_wrap.noti table tr.red-text td,
.table_wrap.noti table tr.red-text td a {
    color: #ff3838;
    font-weight: 600;
}
.table_wrap.noti table td.title p {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 250px;
    margin: 0 auto;
}
.table_wrap table td a {
    color: #6f6f6f;
    font-size: 14px;
    font-weight: 600;
}
.table_wrap.noti table td a,
.table_wrap.request table td a,
.table_wrap.noti.setting table td a {
    text-decoration: none;
    font-weight: 400;
    font-size: 16px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 300px;
    display: block;
    margin: 0 auto;
}
.table_wrap.noti.setting table td a  {
    width: 200px;
}
.table_wrap.request table td a {
    width: 300px;
}
.table_wrap.request table td a:hover,
.table_wrap.noti table td a:hover {
    font-weight: 600;
}
.select_wrap {
    border: 1px solid #dfe1e5;
    border-radius: 8px;
    font-size: 14px;
    padding: 10px 45px 10px 10px;
    margin-left: 5px;
    margin-top: 10px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url(/images/arrow_gray_down.svg) no-repeat 93% 50%;
    background-color: #fff;
}
.notice-box.type1 {
    font-size: 16px;
    font-weight: 600;
    color: #767676;
    margin-top: 0px;
    background: #ffff;
    border-radius: 12px;
    border: 1px solid #dfe1e5;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;
    min-width: 100%;
    box-sizing: border-box;
}

.notice-box.type2 {
    background: #fff;
    border-radius: 12px;
    padding: 32px 36px;
    width: auto;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.25);
    border: none;
    color: #70737c;
    line-height: 25px;
    margin-top: 0;
    width: 100%;
    min-width: 100%;
    box-sizing: border-box;
}
.notice-box.stripslashes {
    color: #767676;
    padding: 15px;
    background: none;
    box-shadow: none;
    font-size: 16px;
    border: none;
    border-radius: 0;
    line-height: 25px;
    max-width: 761px;
}
.notice-box.type1 a {
    background: #303030;
    border: 1px solid #303030;
    padding: 14px 20px;
    font-size: 16px;
}
.notice-box.type1 a.gomobileorder {
    padding: 10px 20px;
}
.notice-box.type2 a {
    text-decoration: underline;
}
.notice-box.type2 span {
    color: 171719;
    font-size: 16px;
    font-weight: 600;
    display: inline;
    justify-content: flex-start;
    align-items: center;
    gap: 4px;
}
.table_regist {
    background: transparent;
    display: flex;
    justify-content: flex-start;
    gap: 60px;
}
.table_regist.mobileDetail {
    gap: 60px;
    min-width: 1107px;
}
.table_regist.noflex {
    display: block;
    min-width: 872px;
    border: 1px solid #dfe1e5;
    border-radius: 12px;
    overflow: hidden;
}
.table_regist.termsofuse {
    display: block;
    min-width: 872px;
    border: 1px solid #dfe1e5;
    border-radius: 12px;
    overflow: hidden;
}
.table_regist.termsofuse table {
    border: none;
}
.table_regist.termsofuse table th {
    border: none;
}
.table_regist.termsofuse pre,
.table_regist.information pre {
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-word;
    font-size: 16px;
    font-weight: 400;
}
.table_regist.information {
    min-height: 400px;
    border: 1px solid #dfe1e5;
    border-radius: 12px;
    overflow: hidden;
    min-width: 872px;
}
.table_regist.notiDetail {
    border: 1px solid #dfe1e5;
    border-radius: 12px;
    overflow: hidden;
    min-width: 872px;
}
.table_regist.notiDetail table {
    border: none;
}
.table_regist.information table td {
    text-align: left;
    padding: 30px;
    vertical-align: baseline;
    border-right: 0;
}
.table_regist.information table tr:last-child td,
.table_regist.information table tr:last-child th {
    border-bottom: 0;
}
.left-column {
    flex: unset;
    padding: 0;
    line-height: 1.8;
    text-align: center;
}
.device-image {
    border: 1px solid #dfe1e5;
    padding: 0;
    border-radius: 12px;
    max-height: 500px;
    width: 300px;
    height: 300px;
}
.left-column #left_modelName {
    color: #303030;
    margin-top: 14px;
    font-size: 24px;
}
.left-column #left_makeCost {
    font-size: 24px;
    color: #303030;
}
.left-column a.notice-button {
    background: #303030;
    border: 1px solid #303030;
    padding: 12px 0;
    width: 100%;
    margin: 18px 0 0;
    font-size: 18px;
    font-weight: 600;
}
.left-column a.notice-button.mini {
    background: none;
    color: #767676;
    border: none;
    padding: 0;
    text-decoration: underline;
    text-underline-offset: 4px;
    font-size: 16px;
    margin-top: 5px;
}
a.notice-button.more {
    background: #303030;
    border: 1px solid #303030;
    padding: 17px 10px;
    font-size: 16px;
    font-weight: 600;
}
a.notice-button.moreMini {
    background: #303030;
    border: 1px solid #303030;
    padding: 10px 10px;
    margin: 7px;
    font-size: 16px;
    font-weight: 400;
}
a.notice-button.goorder {
    background: #303030;
    border-color: #303030;
    margin: 30px auto;
    display: block;
    width: 65%;
    font-size: 16px;
    text-align: center;
} 
a.notice-button.layer {
  display: block;              /* 한 줄 차지하고 아래 배치 */
  width: 60%;                  /* 컨텐츠(부모)의 절반 */
  max-width: 100%;             /* 반응형 안정성 */
  background: #303030;
  border: 1px solid #303030;
  border-radius: 8px;          /* 기존 라운드 유지 */
  margin: 8px 0;               /* 위아래 여백 작게 */
  padding: 10px 16px;
  font-size: 16px;
  text-align: center;
  color: #fff;
  text-decoration: none;
  box-sizing: border-box;
}

.table_regist table {
    border-radius: 12px;
    border: 1px solid #dfe1e5;
    background: transparent;
    width: 100%;
    border-collapse: collapse;
}
.table_regist.information table,
.table_regist.noflex table {
    border: none;
}
.table_regist table th {
    background: #fbfbfc;
    font-size: 18px;
    color: #1c1c1c;
    font-weight: 600;
    border-right: 1px solid #dfe1e5;
    border-bottom: 1px solid #dfe1e5;
    width: 175px;
    padding: 0;
}
.table_regist table td {
    background: #fff;
    border-bottom: 1px solid #dfe1e5;
    border-right: 1px solid #dfe1e5;
    position: relative;
    padding: 17px 10px 17px;
    text-align: left;
    font-size: 20px;
}
.table_regist.productReg table td {
    padding: 15px;
}
.table_regist.productReg table td input[type="text"] {
    border: 1px solid #dfe1e5;
    border-radius: 8px;
    height: auto;
}
.table_regist .right-column table tr:last-child th,
.table_regist .right-column table tr:last-child td,
.table_regist.notiDetail table tr:last-child th,
.table_regist.notiDetail table tr:last-child td {
    border-bottom: 0;
}
.table_regist .right-column table td,
.table_regist.notiDetail table td {
    border-right: 0;
}
.table_regist.notiDetail table td {
    padding: 30px;
}
.right-column {
    border: 1px solid #dfe1e5;
    border-radius: 12px;
    overflow: hidden;
}
.table_regist .right-column table {
    border: none;
}
.right-column .select_wrap {
    margin-top: 0;
    font-size: 18px;
    font-weight: 500;
    margin-left: 0;
    padding: 10px 30px 10px;
    text-align: left;
    width: 290px;
}
.right-column input[type="radio"],
.detail_middle input[type="radio"],
.table_regist.productReg table td input[type="radio"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    border: 1px solid #ccc;
    border-radius: 50%;
    outline: none;
    cursor: pointer;
    background-color: #fafafa;
    margin-right: 5px;
    margin-top: -3px;
}
.right-column input[type="radio"]:checked,
.detail_middle input[type="radio"]:checked,
.table_regist.productReg table td input[type="radio"]:checked {
    background-color: #111;
    border: 4px solid #fff;
    box-shadow: 0 0 0 1px #111;
}
.table_regist.noflex table td {
    text-align: left;
    padding: 15px 25px;
    color: #303030;
    border-right: 0;
    font-size: 18px;
}
.table_regist.noflex table tr:last-child th,
.table_regist.noflex table tr:last-child td {
    border-bottom: 0;
}
.table_regist.noflex input[type="text"] {
    border: 1px solid #dfe1e5;
    border-radius: 8px;
    padding: 10px 20px;
    font-size: 18px;
    font-weight: 500;
    flex: 1;
}
.table_regist.noflex input[type="text"]#custAddr2 {
    width: 50% !important;
    flex: unset;
}
.table_regist.noflex table td .list_item {
    margin-top: 10px;
    color: #303030;
}
.table_regist.noflex table td .list_item:first-child {
    margin-top: 0;
}
.table_regist.noflex .select_wrap {
    margin: 0;
    padding: 10px 30px 10px 20px;
    height: 45px;
}
.table_regist.noflex #custTelecode {
    margin-right: 5px;
}
.address_box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}
.address_detail {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    color: #303030;
    font-weight: 500;
    font-size: 18px;
}
#consultNotes {
    border: 1px solid #dfe1e5;
    border-radius: 8px;
    width: 100%;
    font-size: 20px;
}
.table_regist.detail_right {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #dfe1e5;
    margin-top: 0;
}
.table_regist.mainSetting {
    min-width: 872px;
}
.table_regist.mainSetting table td {
    padding: 15px;
}
.table_regist.detail_right table {
    border: none;
}
.table_regist.detail_right table td {
    border-right: 0;
    padding: 15px;
}
.table_regist.detail_right table tr:first-child th {
    border-right: 0;
    font-size: 20px;
    font-weight: 700;
    background: #ddd;
}
.table_regist.detail_right table tr:last-child th,
.table_regist.detail_right table tr:last-child td {
    border-bottom: 0;
}
.table_regist.noflex .address_box .btn_blue_s {
    margin: 0;
    background: #303030;
    font-size: 16px;
    font-weight: 500;
    box-sizing: border-box;
    height: 45px;
    line-height: 45px;
    padding: 0 20px;
}
.table_regist.noflex .address_box .btn_blue_s:hover {
    color: #fff;
}
textarea:focus {
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
}
.checkbox-container {
    margin-top: 20px;
    color: #303030;
    font-size: 18px;
}
.checkbox-container a:hover {
    color: #ff3838;
}
.checkbox-container input[type="checkbox"],
input[type="checkbox"].deviceList,
input[type="checkbox"].productList,
input[type="checkbox"].siteList,
input[type="checkbox"].phonePlanList {
    accent-color: #303030;
    width: 20px;
    height: 20px;
}
.btn_wrap_center.btn_black .submit_ok {
    background: #303030;
}
.btn_wrap_center.btn_black .submit_cancel {
    border: 1px solid #303030;
    color: #303030;
}
.btn_wrap_center.more {
    gap: 30px;
    width: 70%;
    margin: 50px auto 0;
    width: 900px;
    margin: 50px 0;
    padding: 0 200px;
    box-sizing: border-box;
}
a.submit_ok_blue {
    background: #303030;
    font-size: 20px;
    font-weight: 600;
}
.pageNum_blue a {
    background: #fff;
    border-radius: 8px;
    font-weight: 400;
    font-size: 16px;
    color: #303030;
    box-sizing: border-box;
}
.pageNum_blue a.Current {
    font-weight: 600;
    background: #303030;
    color: #fff;
    border: none;
}
.consultation-popup {
    padding: 32px 24px;
}
.consultation-popup p {
    font-size: 16px;
    color: #303030;
    font-weight: 600;
}
.detail_pop {
    border: 1px solid #dfe1e5;
    border-radius: 12px;
    overflow: hidden;
}
.detail_pop .info-table {
    margin-bottom: 0;
}
.detail_pop .info-table tr:first-child {
    border-bottom: 1px solid #dfe1e5;
}
.detail_pop .info-table th,
.detail_pop .info-table td {
    border: none;
}
.detail_pop .info-table th {
    border-right: 1px solid #dfe1e5;
    background: #fbfbfc;
    font-size: 16px;
    color: #1c1c1c;
    font-weight: 600;
    text-align: center;
}
.detail_pop .info-table input[type="text"] {
    border: 1px solid #dfe1e5;
    border-radius: 8px;
    color: #6f6f6f;
    font-size: 16px;
    padding: 8px 12px;
}
.detail_pop .info-table input[type="text"]::placeholder {
    color: #6f6f6f;
    font-size: 16px;
}
.pop_btn_type2 {
    margin-top: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
}
.pop_btn_type2 .btn_blue_s {
    margin: 0;
    background: #303030;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    width: 136px;
    padding: 15px 0px;
}
.pop_btn_type2 .btn_blue_s:last-child {
    background: #fff;
    color: #303030;
    border: 1px solid #6f6f6f;
}
.more_infotxt {
    font-size: 16px;
    color: #303030;
    font-weight: 600;
    margin-top: 20px;
}
.cancel_btn {
    background: #303030;
    color: #fff;
    border: 1px solid #303030;
    font-weight: 500;
    font-size: 20px;
    border-radius: 8px;
    flex: 1 50%;
    box-sizing: border-box;
}
.cancel_btn a.submit_ok_blue {
    background: inherit;
    font-size: inherit;
    font-weight: inherit;
    display: block;
    padding: 15px 0;
}
.go_list_btn {
    background: #fff;
    color: #303030;
    border: 1px solid #6f6f6f;
    font-weight: 500;
    font-size: 20px;
    border-radius: 8px;
    flex: 1 50%;
}
.go_list_btn a.submit_cancel_blue {
    background: inherit;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
    border-radius: inherit;
    margin: 0;
    border: 0;
    display: block;
    padding: 15px 0;
}
.notiDetail a.submit_cancel_blue {
    background: #303030;
    font-size: 20px;
    font-weight: 600;
    color: #fff;
    border-radius: 12px;
}
a.submit_cancel_blue.more {
    background: #303030;
    border: 1px solid #303030;
    color: #fff;
}
.consultation-popup2 {
    padding: 32px;
    border-radius: 12px;
    color: #767676;
    line-height: 20px;
}
.consultation-popup2 strong {
    color: #1c1c1c;
    font-size: 18px;
    font-weight: 600;
}
.consultation-popup2 p {
    margin-top: 5px;
    display: flex;
    gap: 5px;
    font-size: 16px;
}
.consultation-popup2 .popup-button-container .btn_blue_m {
    background: #303030;
    border-radius: 8px;
    padding: 15px 0;
    font-size: 18px;
}
#footers {
    margin: 0;
    background: #f5f5f5;
    height: auto;
    display: block;
    position: relative;
    margin-top: 45px;
    width: calc(100% + 80px);
    margin-left: -40px;
    border-top: 1px solid #dadada;
    padding: 50px 30px 0;
    text-align: left;
    color: #767676;
    box-sizing: border-box;
}
#footers .footer_inner {
    width: 700px;
}
#footers .top_footer {
    display: flex;
    justify-content: flex-start;
    gap: 5px;
}
#footers .top_footer span:last-child {
    text-align: left;
}
#footers .middle_footer {
    margin-top: 20px;
}
#footers .middle_footer .middle_top {
    display: flex;
    justify-content: flex-start;
    gap: 20px;
}
#footers .middle_footer .middle_top .number_area {
    display: flex;
    gap: 20px;
}
#footers .bottom_footer {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 10px;
}
#footers .bottom_footer .right_area {
    display: flex;
    gap: 20px;
}
#footers .bottom_footer .logo {
    width: 100px; 
}

.list_swiper {
    max-height: 200px;
    margin: 10px auto;
    max-width: 1100px;
    overflow: hidden;
    position: relative;
}
.list_swiper .swiper-wrapper {
    height: auto;
}
.list_swiper .swiper-slide img {
    width: 100%; /* 이미지 크기를 슬라이드 너비에 맞춤 */
    max-width: 90%; /* 이미지 크기를 슬라이드 너비에 맞춤 */
    height: 30%; /* 비율 유지하면서 크기 조정 */
}
.list_swiper .swiper-pagination-fraction {
    position: absolute;
    bottom: 10px;
    right: 20px;
    top: unset;
    left: unset;
    width: auto;
}

.detail_middle li {
    margin-bottom: 30px;
}
.detail_middle li:last-child {
    margin-bottom: 0;
}
.detail_middle h3 {
    font-size: 20px;
    font-weight: 600;
    color: #303030;
    margin-bottom: 10px;
}
.detail_middle h3 span {
    font-size: 14px;
    font-weight: 400;
    color: #ff3838;
}
.detail_middle p {
    font-size: 16px;
    font-weight: 400;
    color: #303030;
}
.detail_middle p.two_input_type {
    display: flex;
    gap: 5px;
}
.detail_middle p span {
    font-size: 14px;
    color: #ff3838;
}
.detail_middle p.two_input_type span {
    color: #303030;
    font-size: 16px;
}
.detail_middle .select_wrap {
    margin: 0;
}
.right_infotxt {
    color: #767676;
    font-size: 16px;
}
.right_infotxt p {
    display: flex;
    gap: 4px;
    margin-top: 6px;
}
.right_infotxt p:first-child {
    margin-top: 0;
}
.contents_wrap .title_wrap {
    margin: 25px 0 10px;
    min-width: 872px;
}
.contents_wrap .title_wrap.detail {
    margin-top: 40px;
}
.table_regist2 {
    border: 1px solid #e1e1e1;
    border-radius: 4px;
    overflow: hidden;
    margin-top: 0;
    min-width: 872px;
}
.table_regist2 table {
    border-top: 0;
    border-bottom: 0;
    border-collapse: collapse;
}
.table_regist2 table th {
    background: #fbfbfc;
    font-size: 16px;
    font-weight: 600;
}
.table_regist2 .select_wrap {
    margin: 0;
    text-align: center;
    height: 45px;
}
.table_regist2.orderStatistice table td {
    text-align: center;
}
.table_regist2 input[type="text"] {
    border: 1px solid #e1e1e1;
    border-radius: 4px;
    font-size: 16px;
}
.table_regist2 .search_s {
    background: #303030;
    height: 45px;
    display: inline-flex;
    align-items: center;
    box-sizing: border-box;
    margin-top: 0px;
    border-radius: 4px;
    font-size: 16px;
    margin-left: 50px;
}
textarea#guideContents {
    min-height: 250px;
    border: 1px solid #e1e1e1;
    border-radius: 12px;
}
#ui-datepicker-div{
    z-index: 9 !important;
}
.ui-widget-header { 
    border: 0px solid #dddddd; 
    background: #fff; 
}
.ui-datepicker-calendar>thead>tr>th { 
    font-size: 14px !important; 
}
.ui-datepicker .ui-datepicker-header { 
    position: relative; 
    padding: 10px 0;
    background: #ddd; 
}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active { 
    border: none !important; 
    background-color: transparent !important; 
    font-weight: normal; 
    color: #454545 !important; 
    text-align: center; 
}
.ui-state-active, 
.ui-widget-content .ui-state-active, 
.ui-widget-header .ui-state-active, 
a.ui-button:active, .ui-button:active, 
.ui-button.ui-state-active:hover {
    background: #303030 !important;
    color: #fff !important;
    border-radius: 8px !important;
    padding: 8px !important;
}
.ui-state-default {
    background: transparent;
    border: none;
}
.ui-datepicker .ui-datepicker-title { 
    margin: 0 0em; 
    line-height: 16px; 
    text-align: center; 
    font-size: 14px; 
    padding: 0px; 
    font-weight: bold; 
}
.ui-datepicker { 
    display: none; 
    background-color: #fff; 
    border-radius: 4px; 
    margin-top: 10px; 
    margin-left: 0px; 
    margin-right: 0px; 
    padding: 20px; 
    padding-bottom: 10px; 
    width: 300px; 
    box-shadow: 10px 10px 40px rgba(0, 0, 0, 0.1); 
}
.ui-widget.ui-widget-content { 
    border: 1px solid #eee; 
}
#datepicker:focus>.ui-datepicker { 
    display: block; 
}
.ui-datepicker-prev,
.ui-datepicker-next { 
    cursor: pointer; 
}
.ui-datepicker-next { 
    float: right; 
}
.ui-state-disabled { 
    cursor: auto; 
    color: hsla(0, 0%, 80%, 1); 
}
.ui-datepicker-title { 
    text-align: center; 
    padding: 10px; 
    font-weight: 100; 
    font-size: 20px; 
}
.ui-datepicker-calendar { 
    width: 100%; 
}
.ui-datepicker-calendar>thead>tr>th { 
    padding: 5px; 
    font-size: 20px; 
    font-weight: 400; 
}
.ui-datepicker-calendar>tbody>tr>td>a { 
    color: #000; 
    font-size: 12px !important; 
    font-weight: bold !important; 
    text-decoration: none;
}
.ui-datepicker-calendar>tbody>tr>.ui-state-disabled:hover { 
    cursor: auto; 
    background-color: #fff; 
}
.ui-datepicker-calendar>tbody>tr>td { 
    border-radius: 100%; 
    width: 44px; 
    height: 30px; 
    cursor: pointer; 
    padding: 5px; 
    font-weight: 100; 
    text-align: center; 
    font-size: 12px; 
}
.ui-datepicker-calendar>tbody>tr>td:hover { 
    background-color: transparent; 
    opacity: 0.6; 
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus { 
    border: 0px solid #cccccc; 
    background-color: transparent; 
    font-weight: normal; 
    color: #2b2b2b; 
}
.ui-datepicker-calendar>tbody>tr>td:first-child a { 
    color: red !important; 
}
.ui-datepicker-calendar>tbody>tr>td:first-child a.ui-state-active { 
    color: #fff !important; 
}
.ui-datepicker-calendar>tbody>tr>td:last-child a { 
    color: #0099ff !important; 
}
.ui-datepicker-calendar>tbody>tr>td:last-child a.ui-state-active {
    color: #fff !important;
}
.ui-datepicker-calendar>thead>tr>th:first-child { 
    color: red !important; 
}
.ui-datepicker-calendar>thead>tr>th:last-child { 
    color: #0099ff !important; 
}
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight { 
    border: 0px; 
    background: #f1f1f1; 
    border-radius: 50%; 
    padding-top: 7px; 
    padding-bottom: 8px; 
}
.btn_wrap_center {
    margin: 50px 0;
    min-width: 872px;
}
.table_wrap.noti.admin table td a {
    width: 150px;
}
/*
@media (max-width: 1600px) {
    .table_regist table th {
        padding: 20px 0;
    }
    .table_regist table td {
        padding: 15px 0;
    }
    .table_wrap.noti table td.title p {
        width: 190px;
    }
    .table_wrap.noti table td a,
    .table_wrap.request table td a {
        width: 150px;
    }
    .table_wrap.noti table td.link a {
        width: 200px;
    }
    .notiDetail a.submit_cancel_blue {
        font-size: 18px;
        padding: 10px 45px;
    }
    .table_wrap.noti table td,
    .table_wrap.request table td {
        padding: 15px 0;
    }
    .cancel_btn {
        font-size: 18px;
    }
    .cancel_btn a.submit_ok_blue,
    .go_list_btn a.submit_cancel_blue {
        padding: 10px 0;
    }
    .btn_wrap_center.more {
        padding: 0 240px;
    }
    .table_regist.mobileDetail {
        gap: 50px;
    }
}
*/

@media (max-width: 1500px) {
    .right-column .select_wrap {
        font-size: 16px;
        width: 245px;
        padding: 10px 20px 10px;
    }
    .table_regist table td {
        font-size: 16px;
    }
    .table_regist table th {
        font-size: 16px;
        width: 180px;
    }
    .table_regist.mobileDetail {
        gap: 40px;
    }
}

@media (max-width: 1400px) {
    .table_regist.mobileDetail {
        gap: 30px;
    }
}


/*헤더 플로팅 배너 css - start*/
/* 예시: common.css 또는 headerNew.asp 상단 <style>에 추가 */
#quickMenu a {
  display: inline-block;
  margin-right: 15px;
  font-size: 15px;
  color: #232323;
  text-decoration: none;
  font-weight: 500;
}

#quickMenu a .menu-bg {
  background: #444;
  color: #fff;
  border-radius: 10px;
  padding: 5px 10px;
  margin-left: 4px;
  font-size: 15px;
  font-weight: 600;
}
/*헤더 플로팅 배너 css - end*/

/*테이블 테두리 셀 구분색 진하게 - start*/
.table_wrap table {
  border-collapse: collapse;
  border: 1px solid #ececec;   /* 바깥 테두리: 아주 연하게 */
}
.table_wrap th, .table_wrap td {
  border: 1px solid #e1e1e1;   /* 셀 구분선: 연한 회색 */
}
/*테이블 테두리 셀 구분색 진하게 - end*/

.img-wrap img {
    width: 100%;
    height: auto;
    display: block;
}

/*날짜 초기화버튼*/
.reset-date-btn {
  padding: 4px 7px;
  background-color: #f5f5f5;
  border: 1px solid #534e4e;
  border-radius: 20px;
  font-size: 14px;
  color: #333;
  cursor: pointer;
  transition: background-color 0.2s, transform 0.2s;
}

#desktop a {
  display: inline-block;
  font-size: 17px;
  color: #232323;
  text-decoration: none;
  font-weight: 500;
}

#desktop a .menu-bg {
  background: #444;
  color: #fff;
  border-radius: 10px;
  padding: 5px 10px;
  font-size: 16px;
  font-weight: 600;
  display: block;
  margin: 0 auto;
  text-align: center;
}

/* 공통 radio 버튼 스타일 - 구조와 관계없이 일관 적용 */
input[type="radio"].form-radio {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 20px;               /* 버튼 크기 */
  height: 20px;
  border: 1px solid #555;    /* 외곽선 */
  border-radius: 50%;        /* 동그랗게 */
  outline: none;
  cursor: pointer;
  background-color: #fafafa; /* 배경색 */
  margin-right: 5px;         /* 라벨 간격 */
  margin-top: -3px;          /* 수직정렬 보정 */
  position: relative;
}

/* 선택되었을 때 표시되는 내부 점 */
input[type="radio"].form-radio:checked::before {
  content: '';
  position: absolute;
  top: 4px;
  left: 4px;
  width: 10px;
  height: 10px;
  background-color: #333;
  border-radius: 50%;
}

.img_bi {
  width: 30px;
  height: auto;
  vertical-align: middle;
  margin-right: 5px;
}

/* 📱 
###########################
모바일 화면에서의 스타일 조정
###########################
*/
@media (max-width: 480px) {
    .reset-date-btn {
        font-size: 13px;
        padding: 5px 10px;
    }
    .main .title {
        font-size: 20px;
    }
    .main .login_ingo {
        font-size: 19px;
    }
    .kakao-img {
        width: 150px;
    }

    #headersUser,
    #headers {
        width: 100% !important; /* 화면의 100%를 차지하도록 강제 */
        min-width: unset !important;
        max-width: 100% !important;
        padding: 10px 8px;
        font-size: 14px;
        height: auto;
    }
    #headersUser .logo,
    #headers .logo {
        font-size: 24px;
        margin: 10px 0;
    }
    #headersUser .logo_txt span,
    #headers .logo_txt span {
        font-size: 18px;
    }
    #headersUser .logo .logo_subtxt,
    #headers .logo .logo_subtxt {
        font-size: 0px; /* 모바일에서 더 작게 */
    }
    #headersUser .member,
    #headers .member {
        font-size: 10px;
    }
    #headersUser .member strong,
    #headers .member strong {
        font-size: 13px;
    }
    #headersUser .logout,
    #headers .logout {
        font-size: 10px;
        padding: 4px 6px;
    }
    .img-wrap img {
        width: 80%;
        max-width: 180px;
        height: auto;
        margin: 0 auto;
        display: block;
    }
    .LNB_wrap {
        width: 50% !important;
        min-width: unset !important;
        max-width: 50% !important;
        font-size: 12px !important;
        padding: 0 2px !important;
        box-sizing: border-box;
    }
    .LNB_wrap.collapsed {
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    }    
    .category {
        padding: 0 2px !important;
        font-size: 12px !important;
    }
    .category ul li,
    .category a.over_s {
        font-size: 12px !important;
    }
    #desktop a {
        font-size: 12px !important;
    }
    #desktop a .menu-bg {
        width: 65% !important;
        font-size: 9px !important;
        margin: 0 auto !important;
        border-radius: 8px !important;
        display: block !important;
        text-align: center !important;
    }
    .LNB_wrap {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .category {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .category ul {
        padding-left: 8 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .category ul li {
        padding-left: 2px !important;
        padding-right: 2px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .cate_step1_1_blue p {
        padding-left: 2px !important;
        padding-right: 2px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .contents_wrap {
        font-size: 12px !important;
        padding-left: 4px !important;
        padding-right: 4px !important;
    }        
    .contents_wrap .title_sub2,
    .contents_wrap .title_wrap,
    .table_wrap,
    .table_wrap th,
    .table_wrap td {
        font-size: 12px !important;
    }
    .table_wrap table tr,
    .table_wrap table th,
    .table_wrap table td {
        height: auto !important; /* 높이 강제 지정 해제 */
        min-height: 0 !important;
        padding: 8px !important;
    }
    .table_wrap table th,
    .table_wrap table td {
        padding: 8px !important;
    }
    .table_wrap table td.item_name {
        font-size: 12px !important;
        padding-left: 4px !important;
        padding-top: 6px !important;
        padding-bottom: 6px !important;
        line-height: 1.2 !important;
        min-height: 0 !important;
        height: auto !important;
    }
    .table_wrap table td .search_icon img {
        width: 16px !important;
        height: 16px !important;
    }
    a.notice-button {
        font-size: 13px !important;
        padding: 7px !important;
        margin: 8px 0 !important;
        border-radius: 6px !important;
    }
    
    .contents_wrap .title_wrap {
        margin: 25px 0 10px;
        min-width: 600px;
    }

    .notice-box.type1,
    .notice-box.type2 {
        width: 450px !important;
        font-size: 12px !important;
        padding: 6px 10px !important;
        box-sizing: border-box !important;
    }
    .search_icon {
        display: none;
    }

    .select_wrap {
        border: 1px solid #dfe1e5;
        border-radius: 8px;
        font-size: 11px;
        padding: 8px 20px 8px 8px;
        margin-left: 3px;
        margin-top: 5px;
        -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
            background: url(/images/arrow_gray_down.svg) no-repeat 93% 50%;
            background-color: #fff;
        }
        .table_wrap table td a {
            color: #6f6f6f;
            font-size: 12px;
            font-weight: 500;
        }

        #footers .footer_inner {
            width: 600px;
        }
    .list_swiper {
        max-height: 160px; /* 높이 더 줄임 */
    }

    .list_swiper .swiper-slide img {
        max-height: 120px; /* 이미지 높이도 더 작게 */
    }
    .img_bi {
        width: 24px; /* 원하는 크기로 조정 */
    }  
}
/* 📱 
###########################
모바일 화면에서의 스타일 조정
###########################
*/