:root{--red:#ed1c24;--ink:#171717;--muted:#777;--line:#e5e2dd;--soft:#f7f5f2}
*{box-sizing:border-box}
body{margin:0;color:var(--ink);background:#f7f7f6;font-family:"Malgun Gothic","Apple SD Gothic Neo",Arial,sans-serif;font-size:16px}
button,select,input{font:inherit}
button,a{cursor:pointer}
.my-header{background:#fff;border-bottom:1px solid var(--line)}
.my-head-inner{width:min(1440px,calc(100% - 64px));min-height:120px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:30px}
.my-logo{display:block;width:min(520px,45vw)}
.my-logo img{display:block;width:100%;height:auto}
.my-head-actions{display:flex;align-items:center;gap:9px;white-space:nowrap}
.my-head-actions a,.my-head-actions button,.my-head-actions b{border:0;background:none;color:#171717;text-decoration:none;font-size:16px;font-weight:400}
.my-head-actions .active{color:var(--red)}
.my-head-actions span{color:#bbb}
.my-head-actions select{height:36px;border:1px solid var(--line);border-radius:999px;background:#fff;padding:0 12px}
.my-main-nav{border-top:1px solid var(--line)}
.my-main-nav>div{width:min(1440px,calc(100% - 64px));height:52px;margin:auto;display:flex;align-items:center;gap:34px}
.my-main-nav a{color:#222;text-decoration:none;font-size:17px}
.mypage-layout{width:min(1440px,calc(100% - 64px));margin:32px auto 70px;display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px}
.mypage-side{align-self:start;position:sticky;top:20px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px}
.mypage-member{display:flex;align-items:center;gap:11px;padding-bottom:17px;border-bottom:1px solid var(--line)}
.mypage-avatar{display:grid;width:42px;height:42px;place-items:center;border-radius:50%;background:#171717;color:#fff}
.mypage-member b,.mypage-member span{display:block}.mypage-member span{margin-top:4px;color:#333;font-size:13px}
.mypage-menu{display:flex;flex-direction:column;gap:4px;margin-top:14px}
.mypage-menu button{border:0;border-radius:8px;background:transparent;color:#333;padding:11px 12px;text-align:left}
.mypage-menu button:hover,.mypage-menu button.active{background:#f3f1ed;color:var(--red)}
.mypage-content{min-width:0}
.my-panel[hidden]{display:none!important}
.my-panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px}
.my-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:24px}
.my-title span{color:var(--red);font-size:13px;font-weight:700;letter-spacing:.15em}
.my-title h1{margin:5px 0;font-size:30px}.my-title p{margin:0;color:#444;font-size:14px}
.action-title{align-items:center}
button{border:1px solid var(--line);border-radius:7px;background:#fff;padding:9px 13px;color:#171717}
button.primary{border-color:var(--red);background:var(--red);color:#fff}
button.danger{border-color:#b8161d;color:#b8161d}
.my-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.my-stat-grid article{min-height:120px;border:1px solid var(--line);border-radius:12px;padding:17px}
.my-stat-grid span,.my-stat-grid strong,.my-stat-grid em{display:block}
.my-stat-grid span{color:#333;font-size:14px}.my-stat-grid strong{margin-top:14px;font-size:25px}.my-stat-grid em{margin-top:5px;color:#444;font-size:13px;font-style:normal}
.my-dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:20px}
.my-box{border:1px solid var(--line);border-radius:12px;padding:18px}
.my-box h2{margin:0 0 13px;font-size:18px}.my-box p{color:#333;line-height:1.7}
.my-box-head{display:flex;align-items:center;justify-content:space-between}
.my-box-head button{border:0;padding:2px;background:none;font-size:13px}
.my-list{margin:4px 0 0;padding:0;list-style:none}
.my-list li{display:flex;justify-content:space-between;gap:15px;padding:11px 0;border-top:1px solid #eee}
.my-list time,.my-list b{color:#333;font-size:13px;font-weight:400}.plus{color:#1b8b4c!important}
.account-ok strong{display:inline-block;border-radius:999px;background:#e9f6ec;color:#247e47;padding:6px 11px}
.my-form{display:flex;flex-direction:column;gap:17px}
.my-form>label,.my-form fieldset{display:flex;flex-direction:column;gap:7px}
.my-form input,.my-form select,.security-form input{height:43px;border:1px solid var(--line);border-radius:8px;padding:0 12px;background:#fff}
.my-form i{color:var(--red);font-size:13px;font-style:normal}
.my-form fieldset{margin:0;border:1px solid var(--line);border-radius:10px;padding:16px}
.profile-photo-row{display:flex;align-items:center;gap:15px}
.profile-photo{display:grid;width:70px;height:70px;place-items:center;border-radius:50%;background:#222;color:#fff;font-size:22px}
.form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}.form-grid label{display:flex;flex-direction:column;gap:7px}
.interest-grid{display:flex;flex-wrap:wrap;gap:8px}.interest-grid label{border:1px solid var(--line);border-radius:999px;padding:8px 11px}.interest-grid input{width:auto;height:auto}
.form-actions{text-align:right}
.my-box-stack{display:flex;flex-direction:column;gap:13px}
.security-form{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:9px}
.agent-status-tabs{display:flex;gap:7px;margin-bottom:17px}.agent-status-tabs .active{border-color:var(--red);color:var(--red)}
.my-table-wrap{overflow:auto;border:1px solid var(--line);border-radius:10px}
table{width:100%;border-collapse:collapse;white-space:nowrap}
th,td{padding:13px 12px;border-bottom:1px solid #eee;text-align:left;font-size:14px}
th{background:#faf9f7;color:#333;font-weight:400}
.status{display:inline-block;border-radius:999px;padding:5px 8px}.status.public{background:#e9f6ec;color:#247e47}.status.private{background:#eee;color:#333}.status.review{background:#fff1dd;color:#9a661a}
.activity-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.activity-grid button{display:flex;min-height:105px;flex-direction:column;align-items:flex-start;justify-content:center;gap:8px;padding:17px}
.activity-grid b{font-size:18px}.activity-grid span{color:#333;font-size:14px}
.hp-balance{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;border:1px solid var(--line);border-radius:12px;padding:22px}.hp-balance strong{font-size:28px}
.setting-list{border-top:1px solid var(--line)}
.setting-list label{display:flex;justify-content:space-between;align-items:center;padding:18px 4px;border-bottom:1px solid var(--line)}
.setting-list b,.setting-list small{display:block}.setting-list small{margin-top:5px;color:#444}
.setting-list input{width:20px;height:20px}
.danger-box{margin-bottom:13px;border:1px solid #ead3d3;border-radius:12px;padding:20px}.danger-box h2{margin:0;font-size:18px}.danger-box p{color:#333}
.my-footer{padding:20px;background:#171717;color:#555;text-align:center;font-size:14px}
@media(max-width:950px){.mypage-layout{grid-template-columns:1fr}.mypage-side{position:static}.mypage-menu{display:grid;grid-template-columns:repeat(3,1fr)}.my-stat-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.my-head-inner{width:calc(100% - 28px);min-height:auto;display:block;padding:14px 0}.my-logo{width:75%}.my-head-actions{margin-top:13px;overflow:auto}.my-main-nav>div{width:calc(100% - 28px);overflow:auto}.mypage-layout{width:calc(100% - 24px);margin-top:18px}.mypage-menu{grid-template-columns:1fr 1fr}.my-panel{padding:19px 14px}.my-stat-grid,.my-dashboard-grid,.activity-grid,.form-grid{grid-template-columns:1fr}.security-form{grid-template-columns:1fr}.my-title h1{font-size:25px}}


/* 마이페이지 공통 상단영역 */
.my-main-nav>div{
  position:relative;
}
.my-weather{
  display:flex;
  align-items:center;
  gap:14px;
  margin-left:auto;
  color:#171717;
  font-size:16px;
  white-space:nowrap;
}
.my-weather span+span{
  padding-left:14px;
  border-left:1px solid var(--line);
}
.my-notice{
  background:#faf9f7;
}
.my-notice>div{
  width:min(1440px,calc(100% - 64px));
  height:40px;
  margin:auto;
  display:flex;
  align-items:center;
  gap:8px;
  border-top:1px solid var(--line);
  color:#171717;
  font-size:16px;
}
.my-important{
  color:var(--red);
  font-weight:700;
}
.my-keywords{
  width:min(1440px,calc(100% - 64px));
  height:42px;
  margin:auto;
  display:flex;
  align-items:center;
  gap:16px;
  overflow-x:auto;
  border-bottom:1px solid var(--line);
  color:#171717;
  font-size:16px;
  white-space:nowrap;
}
.my-keywords>span{
  display:flex;
  align-items:center;
  gap:4px;
}
.my-keywords i{
  color:var(--red);
  font-style:normal;
}
.my-keywords b{
  font-weight:400;
}
.my-keywords em{
  color:#555;
  font-size:16px;
  font-style:normal;
}
.my-keywords em.up{
  color:#df3131;
}
.my-keywords em.down{
  color:#3276c8;
}

@media(max-width:900px){
  .my-main-nav>div{
    flex-wrap:wrap;
    height:auto;
    min-height:52px;
    padding:8px 0;
  }
  .my-weather{
    width:100%;
    overflow-x:auto;
    padding-bottom:5px;
  }
}

@media(max-width:700px){
  .my-notice>div,
  .my-keywords{
    width:calc(100% - 28px);
  }
}

/* 관심사 선택 목록 */
.interest-grid{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.interest-grid label{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 11px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  cursor:pointer;
}
.interest-grid label:has(input:checked){
  border-color:var(--red);
  background:#fff6f6;
  color:var(--red);
}
.interest-grid input{
  width:auto!important;
  height:auto!important;
  margin:0;
}
#interestCount{
  margin-left:7px;
  color:var(--red);
  font-size:14px;
}

/* 마이페이지 일반 폰트 14px 통일 */
.mypage-layout,
.mypage-layout p,
.mypage-layout label,
.mypage-layout input,
.mypage-layout select,
.mypage-layout button,
.mypage-layout th,
.mypage-layout td,
.mypage-layout small,
.mypage-layout time,
.mypage-layout em,
.mypage-layout .status,
.mypage-layout .mypage-member b,
.mypage-layout .mypage-member span,
.mypage-layout .mypage-menu button,
.mypage-layout .my-title span,
.mypage-layout .my-title p,
.mypage-layout .my-stat-grid span,
.mypage-layout .my-stat-grid em,
.mypage-layout .my-list b,
.mypage-layout .activity-grid span,
.mypage-layout .agent-status-tabs button{
  font-size:16px!important;
}

/* 주요 제목과 수치는 기존 강조 크기 유지 */
.mypage-layout .my-title h1{
  font-size:30px!important;
}
.mypage-layout .my-box h2,
.mypage-layout .activity-grid b,
.mypage-layout .danger-box h2{
  font-size:18px!important;
}
.mypage-layout .my-stat-grid strong{
  font-size:25px!important;
}
.mypage-layout .hp-balance strong{
  font-size:28px!important;
}

@media(max-width:700px){
  .mypage-layout .my-title h1{
    font-size:25px!important;
  }
}

.my-localdb-card [data-localdb-create]{
  margin-top:8px;
  padding:7px 11px;
  border:1px solid #d8d8d8;
  border-radius:8px;
  background:#fff;
  color:#171717;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
}

.my-localdb-card [data-localdb-create]:hover{
  border-color:#e53935;
  color:#e53935;
}

.my-localdb-actions{
  display:flex;
  align-items:stretch;
  flex-direction:column;
  gap:8px;
  width:100%;
  margin-top:8px;
}

.my-localdb-actions .localdb-status-button,
.my-localdb-card [data-localdb-action]{
  width:100%;
  margin:0;
  border:1px solid #171717;
  border-radius:6px;
  background:#171717;
  color:#fff;
  text-align:center;
  font-size:13px;
  font-weight:700;
  line-height:1.45;
  padding:9px 6px;
  min-height:38px;
  cursor:pointer;
  white-space:nowrap;
  transition:.15s ease;
}

.my-localdb-actions .localdb-status-button:hover,
.my-localdb-card [data-localdb-action]:hover{
  background:#000;
  border-color:#000;
}

.my-localdb-actions .localdb-status-button:disabled,
.my-localdb-card [data-localdb-action]:disabled{
  opacity:1;
  background:#171717;
  border-color:#171717;
  color:#fff;
}
}

/* MYPAGE_PORTAL_SAVED_RESULTS_CSS_01 */
.mypage-portal-saved{
  margin-top:24px;
  padding:22px;
  border:1px solid #e2e2e2;
  border-radius:12px;
  background:#fff;
}

.mypage-saved-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin-bottom:16px;
}

.mypage-saved-heading span{
  color:#ed1c24;
  font-size:11px;
  letter-spacing:.12em;
}

.mypage-saved-heading h2{
  margin:4px 0 0;
  font-size:20px;
}

.mypage-saved-heading b{
  color:#666;
  font-size:13px;
}

.mypage-saved-message{
  padding:22px 10px;
  color:#777;
  text-align:center;
}

.mypage-saved-list{
  display:flex;
  flex-direction:column;
}

.mypage-saved-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:15px 0;
  border-bottom:1px solid #ededed;
}

.mypage-saved-item:last-child{
  border-bottom:0;
}

.mypage-saved-info{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.mypage-saved-info strong{
  overflow:hidden;
  color:#222;
  font-size:15px;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.mypage-saved-info span{
  color:#888;
  font-size:12px;
}

.mypage-saved-actions button{
  min-width:58px;
  padding:7px 12px;
  border:1px solid #ccc;
  border-radius:7px;
  background:#fff;
  cursor:pointer;
}

@media(max-width:700px){
  .mypage-saved-item{
    align-items:flex-start;
  }

  .mypage-saved-info strong{
    white-space:normal;
  }
}

/* MYPAGE_NEW_MENU_STRUCTURE_CSS_01 */
.mypage-preparing{
  margin-top:18px;
  padding:34px 20px;
  border:1px solid #e4e4e4;
  border-radius:12px;
  background:#fafafa;
  color:#777;
  text-align:center;
}

.mypage-content-tabs{
  display:flex;
  gap:8px;
  margin-top:18px;
  padding-bottom:12px;
  border-bottom:1px solid #e4e4e4;
}

.mypage-content-tabs button{
  padding:8px 16px;
  border:1px solid #ddd;
  border-radius:8px;
  background:#fff;
  color:#444;
  cursor:pointer;
}

.mypage-content-tabs button.active{
  border-color:#ed1c24;
  background:#ed1c24;
  color:#fff;
}

/* MYPAGE_FINAL_17_MENU_CSS_02 */
.mypage-menu{
  max-height:calc(100vh - 220px);
  overflow-y:auto;
  scrollbar-width:thin;
}

.mypage-account-status{
  margin-top:18px;
  padding:22px;
  border:1px solid #e1e1e1;
  border-radius:12px;
  background:#fff;
}

.mypage-account-status > strong{
  color:#16803c;
  font-size:17px;
}

.mypage-account-status > p{
  margin:8px 0 20px;
  color:#666;
}

.mypage-account-status dl{
  margin:0;
}

.mypage-account-status dl div{
  display:grid;
  grid-template-columns:100px 1fr;
  padding:10px 0;
  border-top:1px solid #eee;
}

.mypage-account-status dt{
  color:#777;
}

.mypage-account-status dd{
  margin:0;
  color:#333;
}

/* MYPAGE_BASIC_INFO_LAYOUT_CSS_01 */
#my-profile .my-title{
  margin-bottom:20px;
}

#my-profile .profile-photo-row{
  margin-bottom:20px;
  padding:18px;
  border:1px solid #e3e3e3;
  border-radius:12px;
  background:#fafafa;
}

.basic-member-summary{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin:0 0 26px;
}

.basic-member-summary article{
  padding:16px;
  border:1px solid #e3e3e3;
  border-radius:10px;
  background:#fff;
}

.basic-member-summary span{
  display:block;
  margin-bottom:7px;
  color:#777;
  font-size:12px;
}

.basic-member-summary strong{
  color:#222;
  font-size:17px;
}

.basic-section-heading{
  margin:26px 0 14px;
  padding-bottom:10px;
  border-bottom:1px solid #e6e6e6;
}

.basic-section-heading span{
  color:#ed1c24;
  font-size:10px;
  letter-spacing:.12em;
}

.basic-section-heading h2{
  margin:4px 0 0;
  font-size:18px;
}

.basic-section-heading p{
  margin:6px 0 0;
  color:#777;
  font-size:12px;
}

.basic-password-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-top:12px;
  padding:14px 15px;
  border:1px solid #e2e2e2;
  border-radius:9px;
}

.basic-password-row span,
.basic-password-row small{
  display:block;
}

.basic-password-row span{
  margin-bottom:4px;
  color:#333;
  font-size:14px;
  font-weight:600;
}

.basic-password-row small{
  color:#888;
}

.basic-password-row button,
.basic-detail-button{
  padding:8px 13px;
  border:1px solid #ccc;
  border-radius:7px;
  background:#fff;
  cursor:pointer;
  white-space:nowrap;
}

.basic-information-grid{
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(240px,.7fr);
  gap:16px;
  margin-top:22px;
}

.basic-level-information,
.basic-hp-information{
  padding:20px;
  border:1px solid #e2e2e2;
  border-radius:12px;
  background:#fff;
}

.basic-information-grid .basic-section-heading{
  margin-top:0;
}

.level-grade-list{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:7px;
  margin-bottom:14px;
}

.level-grade-list div{
  padding:11px 6px;
  border-radius:8px;
  background:#f6f6f6;
  text-align:center;
}

.level-grade-list b,
.level-grade-list span{
  display:block;
}

.level-grade-list b{
  margin-bottom:4px;
  color:#333;
  font-size:13px;
}

.level-grade-list span{
  color:#888;
  font-size:11px;
}

.basic-hp-information > strong{
  display:block;
  margin:26px 0 18px;
  color:#ed1c24;
  font-size:28px;
}

@media(max-width:900px){
  .basic-member-summary{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .basic-information-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:600px){
  .level-grade-list{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .basic-password-row{
    align-items:flex-start;
    flex-direction:column;
  }
}

/* MYPAGE_EMAIL_LOGIN_ID_READONLY_01 */
#my-profile .readonly-email-label small{
  margin-left:7px;
  color:#888;
  font-size:11px;
  font-weight:400;
}

#my-profile
.readonly-email-label
input[readonly]{
  border-color:#e1e1e1!important;
  background:#f3f3f3!important;
  color:#777!important;
  cursor:not-allowed!important;
}

/* MYPAGE_SAVED_RESULTS_PAGINATION_CSS_02 */
.mypage-saved-pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  margin-top:18px;
}

.mypage-saved-pagination[hidden]{
  display:none!important;
}

.mypage-saved-pagination button{
  min-width:34px;
  height:32px;
  padding:0 9px;
  border:1px solid #d8d8d8;
  border-radius:7px;
  background:#fff;
  color:#444;
  cursor:pointer;
}

.mypage-saved-pagination button.active{
  border-color:#ed1c24;
  background:#ed1c24;
  color:#fff;
}

.mypage-saved-pagination button:disabled{
  opacity:.4;
  cursor:default;
}
