.bm_LineBox {
    /* z-index: 10; */
    /* top: 0; */
    /* right: 20px; */
    /* position: absolute; */
    /* width: 342.7px; */
	width:100%;
}
.bm_LineBanner{
	width:100%;
}
.bm_LineBanner a {
    gap: 6px;
    border-radius: 8px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 54px;
    overflow: hidden;
    position: relative;
    background: linear-gradient(90deg, rgb(34, 34, 34) 0%, rgb(77, 77, 77) 100%);
    padding: 0 20px;
    font-family: 'Pretendard-Medium';
    font-size: 15px;
    line-height: 24px;
    letter-spacing: -0.4px;
    text-align: left;
    color: #fff;
}
.bm_LineBanner a svg {
    vertical-align: top;
    width: 24px;
    height: 24px;
    fill: #fff;
}
.bm_LineBannerImg{
	width:100%;
	margin:10px 0 0 0;
}
.bm_LineBannerImg a {
	/* padding:10px; */
    /* border-radius: 6px; */
    display: flex;
    width: 100%;
    /* height: 150px; */
	/* background: #eee; */
}
.bm_LineBannerImg a img{
	max-width:100%;
}
@media (max-width: 991px) {
	.bm_LineBannerImg{
		display:none;
	}
	.bm_LineBanner a {
		gap: 6px;
		border-radius: 8px;
		height: 50px;
		padding: 0 20px;
		font-size: 15px;
		line-height: 24px;
	}
	.bm_LineBanner a svg {
		vertical-align: top;
		width: 20px;
		height: 20px;
		fill: #fff;
	}
}

/* ===== 한화손보 캐롯 리뉴얼 - 메인 콘텐츠 (모든 규칙 .hwa_main 하위) ===== */
.hwa_main *{ box-sizing:border-box; margin:0; padding:0; }
.hwa_main{
  font-family:'Pretendard','Apple SD Gothic Neo',-apple-system,sans-serif;
  font-weight:400;
  color:#111; -webkit-font-smoothing:antialiased;
}
/* .hwa_main a{ text-decoration:none; color:inherit; display:block; } */
.hwa_main img{ display:block; max-width:100%; }

/* 배경 섹션 */
.hwa_main .hwa-main {
    margin: 100px 0 0 0;
    /* background: linear-gradient(180deg,#ffffff 0%,#fbf5f0 5%,#fbf5f0 88.03%,#fbf5f0 100%); */
    background: linear-gradient(180deg, #FFF 0%, #FBF5F0 5%, #FBF5F0 96.16%, #FFF 100%);
	padding: 60px 0 100px;
}
/* 콘텐츠 inner (요청 규격) */
.hwa_main .hwa-inner{
  max-width:1320px; padding:0 20px; margin:0 auto;
  display:flex; flex-direction:column; gap:80px;
}

/* 섹션 공통 */
.hwa_main .hwa-sec{ display:flex; flex-direction:column; gap:24px; }
.hwa_main .hwa-sec-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:10px; }
.hwa_main .hwa-sec-title{
	font-family: 'HanwhaR';font-weight:400;
  font-size:28px; line-height:38px; letter-spacing:-1.4px; color:#111;
}
.hwa_main .hwa-sec-title--lg{ font-size:40px; line-height:56px; letter-spacing:-2px; }
.hwa_main .hwa-mo-br{ display:none; }
.hwa_main .hwa-more{
  display:flex; align-items:center; gap:8px; flex-shrink:0;
  font-family:'Pretendard-SemiBold'; font-weight:600;
  font-size:16px; line-height:30px; color:#888; white-space:nowrap;
}
.hwa_main .hwa-more-arrow{ width:7px; height:12px; object-fit:contain; }

/* 공통 텍스트 */
.hwa_main .hwa-cat{
  font-family:'Pretendard-Bold'; font-weight:700;
  font-size:16px; line-height:22px; letter-spacing:-0.8px; color:#ff5029;
}
.hwa_main .hwa-cat--sm{ font-size:15px; line-height:20px; letter-spacing:-0.75px; }
.hwa_main .hwa-date{
  font-family:'Pretendard-Bold'; font-weight:700;
  font-size:14px; line-height:18px; letter-spacing:-0.14px; color:#bbb;
}

/* NEW 배지 */
.hwa_main .hwa-badge{
  position:absolute; left:15px; top:15px; z-index:2;
  display:inline-flex; align-items:center; justify-content:center;
  padding:6px 8px 7px 9px; border-radius:6px; background:#ff5029;
  font-family:'Pretendard-ExtraBold'; font-weight:800;
  font-size:13px; line-height:14px; color:#fff;
}

/* ===== 블록1: 보장 가이드 ===== */
.hwa_main .hwa-guide {
    display: flex;
    align-items: flex-start;
    gap: 34px;
}
/* 피처드 카드 */
.hwa_main .hwa-feat{
  flex:1 1 0; min-width:0; background:#fff; border-radius:16px;
  display:flex; flex-direction:column; gap:24px; 
}
.hwa_main .hwa-feat:hover .hwa-feat-title{
	text-decoration:underline;
}

.hwa_main .hwa-feat-thumb{
  position:relative; aspect-ratio:842/464; border:1px solid rgba(0,0,0,.06);
  border-radius:16px; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
}
.hwa_main .hwa-feat-ico{ width:360px; max-width:78%; height:auto; object-fit:contain; }
.hwa_main .hwa-feat-body{ display:flex; flex-direction:column; gap:10px; padding:0 30px 26px; }
.hwa_main .hwa-feat-texts{ display:flex; flex-direction:column; gap:6px; }
.hwa_main .hwa-feat-title{
	display: block;
    display: -webkit-box;
    overflow: hidden;
    white-space: normal;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  font-family:'Pretendard-SemiBold'; font-weight:600;
  font-size:24px; line-height:32px; letter-spacing:-0.24px; color:#000;
}
.hwa_main .hwa-feat-desc{
		display: block;
    display: -webkit-box;
    overflow: hidden;
    white-space: normal;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  font-family:'Pretendard'; font-weight:400;
  font-size:18px; line-height:26px; letter-spacing:-0.18px; color:#888;
}

/* 우측 리스트 */
.hwa_main .hwa-side{ flex:0 0 404px; width:404px; display:flex; flex-direction:column; gap:14px; }
.hwa_main .hwa-usp{
  background:#fff; border-radius:16px; padding:22px 24px;
  display:flex; align-items:center; gap:20px;
}
.hwa_main .hwa-usp-body{ flex:1 1 0; min-width:0; display:flex; flex-direction:column; gap:10px; }
.hwa_main .hwa-usp-title{
  font-family:'Pretendard-SemiBold'; font-weight:600;
  font-size:20px; line-height:26px; color:#000;
}
.hwa_main .hwa-usp .hwa-cat{ margin-bottom:-4px; } /* 카테고리-제목 간격 6px 보정 */
.hwa_main .hwa-usp-ico{
  flex-shrink:0; width:80px; height:80px; border-radius:10px;
  border:1px solid rgba(0,0,0,.06); overflow:hidden;
  background:linear-gradient(180deg,rgba(255,159,100,.9),rgba(255,121,52,.9));
  display:flex; align-items:center; justify-content:center;
}
.hwa_main .hwa-usp-ico img{ width:60px; height:60px; object-fit:contain; }

/* 우측 세로형 카드 (아이콘 상단 + 텍스트 하단) */
.hwa_main .hwa-vcard{
  background:#fff; border-radius:16px; height:314px;
  padding:22px 24px; display:flex; flex-direction:column; gap:20px;
}
.hwa_main .hwa-vcard:hover .hwa-vcard-title{
	text-decoration:underline;
}
.hwa_main .hwa-vcard-ico{
  flex:1 1 0; min-height:0; border-radius:10px; overflow:hidden;
  border:1px solid rgba(0,0,0,.06);
  display:flex; align-items:center; justify-content:center;
}
.hwa_main .hwa-vcard-ico img{ width:120px; height:120px; object-fit:contain; }

/* 관리자에서 등록한 썸네일(사진)은 아이콘과 달리 주황 배경 영역을 꽉 채운다.
   .hwa-ico--photo 클래스는 index.php 가 file1U 가 있을 때만 붙인다.
   아래쪽 모바일 미디어쿼리의 아이콘 크기 지정(.hwa-vcard-ico img 등)을 이겨야 하므로
   선택자를 한 단계 더 좁혀 우선순위를 높였다. */
.hwa_main .hwa-feat-thumb img.hwa-ico--photo,
.hwa_main .hwa-vcard-ico img.hwa-ico--photo{
  width:100%; height:100%; max-width:none;
  object-fit:cover; object-position:center;
}
.hwa_main .hwa-vcard-body{ display:flex; flex-direction:column; gap:6px; }
.hwa_main .hwa-vcard-texts{ display:flex; flex-direction:column; gap:10px; }
.hwa_main .hwa-vcard-tt{ display:flex; flex-direction:column; gap:4px; }
.hwa_main .hwa-vcard-title{
	display: block;
    display: -webkit-box;
    overflow: hidden;
    white-space: normal;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
  font-family:'Pretendard-SemiBold'; font-weight:600;
  font-size:20px; line-height:26px; color:#000;
}
.hwa_main .hwa-vcard-desc{
	    display: block;
    display: -webkit-box;
    overflow: hidden;
    white-space: normal;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
  font-family:'Pretendard'; font-weight:400;
  font-size:16px; line-height:24px; letter-spacing:-0.16px; color:#888;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}

/* ===== 블록2: 최신 글 ===== */
.hwa_main .hwa-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:34px;
}
.hwa_main .hwa-card{
  background:#fff; border-radius:16px; display:flex; flex-direction:column; gap:22px; overflow:hidden;
}
.hwa_main .hwa-card:hover .hwa-card-title{
	text-decoration:underline;
}
.hwa_main .hwa-card-thumb{
  position:relative; border:1px solid rgba(0,0,0,.06); border-radius:16px; overflow:hidden; aspect-ratio:404/268;
}
.hwa_main .hwa-card-thumb img{ width:100%; height:100%; object-fit:cover; }
.hwa_main .hwa-card-body{ display:flex; flex-direction:column; gap:6px; padding:0 26px 26px; }
.hwa_main .hwa-card-texts{ display:flex; flex-direction:column; gap:14px; }
.hwa_main .hwa-card-title{
	    display: block;
    display: -webkit-box;
    overflow: hidden;
    white-space: normal;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  font-family:'Pretendard-SemiBold'; font-weight:600;
  font-size:24px; line-height:32px; letter-spacing:-0.24px; color:#000;
}

/* 전체 글 보기 버튼 */
.hwa_main .hwa-allbtn{
  background:#fff; border-radius:10px; padding:22px 18px; text-align:center;
  font-family:'Pretendard-Medium'; font-weight:500;
  font-size:18px; line-height:26px; color:#111;
}

/* ===== 블록3: 배너 ===== */
.hwa_main .hwa-banners{ display:flex; gap:20px; }
.hwa_main .hwa-banner{ flex:1 1 0; }
.hwa_main .hwa-banner img{
  width:100%;  object-fit:cover;
  border:1px solid rgba(0,0,0,.04); border-radius:16px; background:#fff;
}

/* =========================================================
   반응형 : max-width 기준 (모바일)
   ========================================================= */
@media (max-width:991px){
	
}   
@media (max-width:991px){
	.hwa_main .hwa-main {
		margin: 80px 0 0 0;
		padding: 40px 0 60px;
	}
}
@media (max-width:767px){
  .hwa_main .hwa-main {
    margin: 60px 0 0 0;
    padding: 30px 0 20px;
}
  .hwa_main .hwa-inner{ gap:30px; }

  .hwa_main .hwa-sec{ gap:16px; }
  .hwa_main .hwa-mo-br{ display:inline; }
  .hwa_main .hwa-sec-title{ font-size:18px; line-height:26px; letter-spacing:-0.9px; }
  .hwa_main .hwa-sec-title--lg{ font-size:20px; line-height:26px; letter-spacing:-1px; }
  .hwa_main .hwa-more{ font-size:13px; line-height:24px; gap:6px; }
  .hwa_main .hwa-more-arrow{ width:5px; height:8px; }

  .hwa_main .hwa-cat{ font-size:13px; line-height:16px; letter-spacing:0; }
  .hwa_main .hwa-cat--sm{ font-size:13px; line-height:16px; letter-spacing:0; }
  .hwa_main .hwa-date{
    font-family:'Pretendard-SemiBold'; font-weight:600;
    font-size:12px; line-height:14px; letter-spacing:0; color:#aaa;
  }

  .hwa_main .hwa-badge{ left:9px; top:9px; padding:5px 6px 5px 7px; border-radius:5px; font-size:11px; line-height:12px; }

  /* 블록1 - 세로 스택 */
  .hwa_main .hwa-guide{ flex-direction:column; gap:10px; }
  .hwa_main .hwa-feat{ width:100%; border-radius:10px; gap:0; }
  .hwa_main .hwa-feat-thumb{ aspect-ratio:auto; height:auto; border-radius:10px; }
  .hwa_main .hwa-feat-ico{ width:200px; max-width:60%; }
  /* 위 규칙 때문에 컨테이너 높이가 auto 라 height:100% 가 풀린다.
     사진은 제 비율대로 폭을 채우게 두면 주황 영역이 그대로 덮인다. */
  .hwa_main .hwa-feat-thumb img.hwa-ico--photo{ height:auto; }
  .hwa_main .hwa-feat-body{ gap:10px; padding:14px 16px 16px; }
  .hwa_main .hwa-feat-texts{ gap:4px; }
  .hwa_main .hwa-feat-title{ font-size:18px; line-height:24px; letter-spacing:0; }
  .hwa_main .hwa-feat-desc{ font-size:14px; line-height:20px; letter-spacing:0; }

  .hwa_main .hwa-side{ flex:none; width:100%; gap:10px; }
  .hwa_main .hwa-usp{ height:100px; padding:16px; gap:14px; border-radius:10px; }
  .hwa_main .hwa-usp-body{ gap:8px; }
  .hwa_main .hwa-usp .hwa-cat{ margin-bottom:0; }
  .hwa_main .hwa-usp-title{
    font-size:16px; line-height:22px;
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  }
  .hwa_main .hwa-usp-ico{ width:64px; height:64px; border-radius:8px; }
  .hwa_main .hwa-usp-ico img{ width:48px; height:48px; }
  
  /* 우측 세로형 카드 */
  .hwa_main .hwa-vcard{ height:auto; padding:16px; gap:14px; border-radius:10px; }
  .hwa_main .hwa-vcard-ico{ flex:none; height:160px; border-radius:8px; }
  .hwa_main .hwa-vcard-ico img{width: 120px;height: 120px;}
  .hwa_main .hwa-vcard-texts{ gap:8px; }
  .hwa_main .hwa-vcard-tt{ gap:4px; }
  .hwa_main .hwa-vcard-title{ font-size:16px; line-height:22px; }
  .hwa_main .hwa-vcard-desc{ font-size:13px; line-height:18px; letter-spacing:0; }

  /* 블록2 - 1열 */
  .hwa_main .hwa-grid{grid-template-columns:repeat(2,1fr);gap:20px; }
  .hwa_main .hwa-card{ border-radius:10px; gap:0; }
  .hwa_main .hwa-card-thumb{ aspect-ratio:335/222; border-radius:10px; }
  .hwa_main .hwa-card-body{ gap:10px; padding:14px 16px 16px; }
  .hwa_main .hwa-card-texts{ gap:8px; }
  .hwa_main .hwa-card-title{ font-size:18px; line-height:24px; letter-spacing:0; }
  .hwa_main .hwa-allbtn {
		border: 1px solid #F7F7F7;
		padding: 17px 18px;
		font-size: 14px;
		line-height: 20px;
	}

  /* 블록3 - 세로 스택 */
  .hwa_main .hwa-banners{ flex-direction:column; gap:6px; }
  .hwa_main .hwa-banner img{  border-radius:12px; }
}

/* 태블릿(선택) : 최신글 2열 */
@media (max-width:1024px) and (min-width:768px){
  .hwa_main .hwa-grid{ grid-template-columns:repeat(2,1fr); }
}

@media (max-width:600px){
	.hwa_main .hwa-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}





/* =========================================================
   최근 가장 많이 본 / 사람들이 궁금해하는
   ========================================================= */
.hwa_main .hwa-pop{ display:flex; gap:34px; align-items:stretch; }
.hwa_main .hwa-rank-col{ flex:842 1 0; min-width:0; display:flex; flex-direction:column; gap:24px; }
.hwa_main .hwa-key-col{ flex:404 1 0; min-width:0; display:flex; flex-direction:column; gap:24px; }
.hwa_main .hwa-pop-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:10px; min-height:38px; }

/* 해시태그 안내 "?" 뱃지 */
.hwa_main .hwa-q-wrap{ position:relative; display:inline-block; }
.hwa_main .hwa-q{
  display:inline-flex; align-items:center; justify-content:center;
  width:25px; height:25px; border-radius:99px; background:#dbcbc4; color:#fff;
  font-family:'Pretendard-Bold'; font-weight:700; font-size:16px; line-height:1;
  vertical-align:2px; margin-left:2px;
  border:0; padding:0; cursor:pointer; -webkit-appearance:none; appearance:none;
}
.hwa_main .hwa-q:focus-visible{ outline:2px solid #111; outline-offset:2px; }

/* 뱃지 클릭 시 뜨는 안내 말풍선 */
.hwa_main .hwa-q-tip{
  position:absolute; left:50%; bottom:calc(100% + 12px); transform:translateX(-50%);
  z-index:30; display:flex; align-items:flex-start; gap:12px;
  width:max-content; max-width:280px; padding:14px 16px;
  border-radius:12px; background:#fff; box-shadow:0 4px 16px rgba(0,0,0,.14);
  font-family:'Pretendard-Regular'; font-weight:400;
  font-size:15px; line-height:22px; letter-spacing:-0.3px; color:#333;
  text-align:left; white-space:normal;
}
.hwa_main .hwa-q-tip[hidden]{ display:none; }
/* 말풍선 아래쪽 꼬리 */
.hwa_main .hwa-q-tip::after{
  content:''; position:absolute; top:100%; left:50%; transform:translateX(-50%);
  border:8px solid transparent; border-top-color:#fff;
}
.hwa_main .hwa-q-close{
  flex-shrink:0; width:20px; height:20px; margin-top:1px;
  border:0; padding:0; background:transparent; cursor:pointer;
  color:#333; font-size:20px; line-height:1; -webkit-appearance:none; appearance:none;
}

/* ----- 랭킹 네비 버튼 ----- */
.hwa_main .hwa-rank-nav{ display:flex; gap:6px; }
.hwa_main .hwa-rank-btn{
  width:38px; height:38px; border-radius:99px; background:#fff; border:0; cursor:pointer;
  display:flex; align-items:center; justify-content:center; padding:0;
  box-shadow:0 2px 6px rgba(0,0,0,.05);
  color:#111;                       /* 기본: 검정 */
  transition:color .15s;
}
/* 화살표(꺾쇠) - 색은 버튼 color를 따름 */
.hwa_main .hwa-rank-ico{
  display:block; width:8px; height:8px;
  border:solid currentColor; border-width:0 2px 2px 0;
}
.hwa_main .hwa-rank-btn[data-dir="up"]   .hwa-rank-ico{ transform:rotate(-135deg); margin-top:3px; }
.hwa_main .hwa-rank-btn[data-dir="down"] .hwa-rank-ico{ transform:rotate(45deg);   margin-bottom:3px; }
/* 호버: 주황 */
.hwa_main .hwa-rank-btn:hover:not(:disabled){ color:#ff5029; }
/* 비활성: 회색 */
.hwa_main .hwa-rank-btn:disabled{ color:#d5d5d5; cursor:default; box-shadow:0 2px 6px rgba(0,0,0,.03); }

/* ----- 랭킹 리스트 ----- */
.hwa_main .hwa-rank{
  position:relative; background:#fff; border-radius:16px; height:370px;
  padding:12px 30px; overflow:hidden; touch-action:none; user-select:none;
}
.hwa_main .hwa-rank-track{ list-style:none; margin:0; padding:0; }
.hwa_main .hwa-rank-item{ position:relative; }
.hwa_main .hwa-rank-item > a{
  display:flex; align-items:center; gap:28px; padding:24px 0;
  text-decoration:none; color:inherit;
}
.hwa_main .hwa-rank-item a:hover .hwa-rank-title{
	text-decoration:underline;
}
.hwa_main .hwa-rank-item + .hwa-rank-item::before{
  content:''; position:absolute; top:0; left:64px; right:0; height:1px; background:rgba(238,238,238,.93);
}
.hwa_main .hwa-rank-num{
  flex:0 0 44px; width:44px; height:44px; border-radius:8px; background:#fdefe4;
  display:flex; align-items:center; justify-content:center;
  font-family:'Pretendard-Bold'; font-weight:700; font-size:24px; line-height:24px; color:#ff5029;
}
.hwa_main .hwa-rank-body{ flex:1 1 0; min-width:0; display:flex; flex-direction:column; gap:6px; }
.hwa_main .hwa-rank-title{
  font-family:'Pretendard-SemiBold'; font-weight:600;
  font-size:20px; line-height:32px; letter-spacing:-0.2px; color:#000;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.hwa_main .hwa-rank-thumb{
  flex:0 0 91px; width:91px; height:60px; border-radius:8px; overflow:hidden; border:1px solid rgba(0,0,0,.06);
}
.hwa_main .hwa-rank-thumb img{ width:100%; height:100%; object-fit:cover; }
/* 가짜 스크롤바 (장식) — 위치·높이는 JS 가 계산해 넣는다 */
.hwa_main .hwa-rank-bar{
  position:absolute; top:20px; right:4px; width:4px; height:140px; border-radius:5px; background:#eee; pointer-events:none;
}

/* ----- 인기 키워드 (자동 흐름) ----- */
.hwa_main .hwa-key{
  position:relative; background:#fff; border-radius:16px; padding:30px 0; overflow:hidden;
  flex:1 1 auto; display:flex; flex-direction:column; justify-content:center; gap:12px;
}
.hwa_main .hwa-key-row{ overflow:hidden; cursor:grab; touch-action:pan-y; }
.hwa_main .hwa-key-row.is-drag{ cursor:grabbing; }
.hwa_main .hwa-key-track{ display:flex; width:max-content; will-change:transform; }
.hwa_main .hwa-key-set{ display:flex; gap:12px; padding-right:12px; flex:0 0 auto; }
/* ※ 자동 흐름 속도는 CSS가 아니라 JS의 SPEED 값에서 조절합니다 (newmain.html 스크립트 참고) */
.hwa_main .hwa-tag{
  flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center;
  padding:12px 22px; border-radius:99px; background:#f2f2f2; white-space:nowrap;
  font-family:'Pretendard-Medium'; font-weight:500; font-size:17px; line-height:26px; color:#666;
  text-decoration:none;
  border:1px solid transparent; transition:background-color .15s, color .15s, border-color .15s;
}
/* 호버 시에만 강조(주황 테두리) */
.hwa_main .hwa-tag:hover{
  background:#fff; border-color:#ff5029; color:#ff5029;
  font-family:'Pretendard-SemiBold'; font-weight:600;
}
/* 좌우 페이드 마스크 */
.hwa_main .hwa-key::before,
.hwa_main .hwa-key::after{
  content:''; position:absolute; top:0; bottom:0; width:70px; z-index:1; pointer-events:none;
}
.hwa_main .hwa-key::before{ left:0;  background:linear-gradient(90deg,#fff 20%,rgba(255,255,255,0)); }
.hwa_main .hwa-key::after{ right:0; background:linear-gradient(270deg,#fff 20%,rgba(255,255,255,0)); }

/* =========================================================
   반응형 : max-width 기준 (모바일)
   ========================================================= */
@media (max-width:767px){
	/* 최근 많이 본 / 궁금해하는 - 세로 스택 */
	.hwa_main .hwa-pop{ flex-direction:column; gap:30px; }
	.hwa_main .hwa-rank-col,
	.hwa_main .hwa-key-col{ flex:none; width:100%; gap:16px; }
	.hwa_main .hwa-pop-head{ min-height:auto; }
	.hwa_main .hwa-rank-nav{ gap:6px; }

	/* 말풍선이 화면 밖으로 나가지 않도록 뱃지 기준 왼쪽으로 펼침 */
	.hwa_main .hwa-q-tip{
		left:auto; right:-8px; transform:none;
		max-width:calc(100vw - 60px);
		font-size:14px; line-height:20px;
	}
	.hwa_main .hwa-q-tip::after{ left:auto; right:16px; transform:none; }
	.hwa_main .hwa-rank-btn{ width:34px; height:34px; }

	.hwa_main .hwa-rank{ height:300px; padding:6px 16px; border-radius:10px; }
	.hwa_main .hwa-rank-item > a{ gap:14px; padding:16px 0; }
	.hwa_main .hwa-rank-item + .hwa-rank-item::before{ left:50px; }
	.hwa_main .hwa-rank-num{ flex-basis:36px; width:36px; height:36px; font-size:18px; line-height:18px; border-radius:6px; }
	.hwa_main .hwa-rank-body{ gap:4px; }
	.hwa_main .hwa-rank-title{ font-size:15px; line-height:22px; }
	.hwa_main .hwa-rank-thumb{ flex-basis:72px; width:72px; height:48px; }
	.hwa_main .hwa-rank-bar{ height:100px; }

	.hwa_main .hwa-key{ padding:20px 0; border-radius:10px; gap:10px; }
	.hwa_main .hwa-key-set{ gap:8px; padding-right:8px; }
	.hwa_main .hwa-tag{ font-size:14px; line-height:22px; padding:9px 16px; }
	.hwa_main .hwa-tag--on{ padding:8px 15px; }
	.hwa_main .hwa-key::before,
	.hwa_main .hwa-key::after{ width:40px; }
}