A:link {text-decoration:none; color:#535353;}
A:visited {text-decoration:none; color:#535353;}
/*A:hover {  text-decoration:none;  color:#0076AE;}*/
p,br,body,td,table,tr,input,select,textarea { font-size:9pt;font-family: "Apple SD Gothic Neo",'nanumR',"Nanum Gothic",Malgun Gothic,"맑은 고딕",Dotum,"돋움", sans-serif;}

body, h1, h2, h3, h4, h5, h6,
div, p, blockquote, pre, address,
ul, ol, li, dl, dt, dd,
table, caption, th, td,
form, fieldset, legend,
hr {
	margin:0;
}

.sinput { height:31px; padding:0 10px; background:#fff; border:1px solid #d9d9d9;margin:5px 0; font-size:9pt; }
.sinput2 { height:18px; background:#fff; border:1px solid #d9d9d9;margin:5px 0; font-size:9pt; }
.sbjstyle {color : #2791A1;font-weight : bold;text-decoration : underline;}

.td01 {
	font-family: "Apple SD Gothic Neo",'nanumR',"Nanum Gothic",Malgun Gothic,"맑은 고딕",Dotum,"돋움", sans-serif;
	font-size: 12px;line-height:18px;color: #535353;text-decoration:none;}

.subtitle {
	font-family: "Apple SD Gothic Neo",'nanumR',"Nanum Gothic",Malgun Gothic,"맑은 고딕",Dotum,"돋움", sans-serif;
	font-size: 12px;line-height:18px;color: #FFFFFF;text-decoration:none;}

.tm01 {
	font-family: "Apple SD Gothic Neo",'nanumR',"Nanum Gothic",Malgun Gothic,"맑은 고딕",Dotum,"돋움", sans-serif;
	font-size: 11px;font-style: normal;line-height: 14px;color: #000000;text-decoration: none;}

.lm01 {
	font-family: "Apple SD Gothic Neo",'nanumR',"Nanum Gothic",Malgun Gothic,"맑은 고딕",Dotum,"돋움", sans-serif;
	font-size: 12px;font-style: normal;line-height: normal;color: #6F6F6F; /* h10: 원본 'color: 6F6F6F'(# 누락) — 원본은 DOCTYPE 없는 quirks 모드라 해시리스 hex 가 적용됐다(_styles 실측 rgb(111,111,111)). 우리는 표준모드라 무효 선언이 되어 검정으로 떨어지므로 # 만 보충해 원본 실측값을 그대로 재현한다(R5v1/R16). 값 변경 아님. */
}
.rollist01 {
	font-family: "Apple SD Gothic Neo",'nanumR',"Nanum Gothic",Malgun Gothic,"맑은 고딕",Dotum,"돋움", sans-serif;
	font-size: 12px;font-style: normal;line-height: 18px;color: #FFCC00;} /* h10: 원본 'FFCC00' # 누락 보충 — 실측 rgb(255,204,0) */

.lrlist01 {
    padding-top: 2px;font-family: "Apple SD Gothic Neo",'nanumR',"Nanum Gothic",Malgun Gothic,"맑은 고딕",Dotum,"돋움", sans-serif;
	font-size: 13px;line-height: 17px;color: #6F6F6F;} /* h10: 원본 '6F6F6F' # 누락 보충 — 실측 rgb(111,111,111) */

.tds {
	font-family: "Apple SD Gothic Neo",'nanumR',"Nanum Gothic",Malgun Gothic,"맑은 고딕",Dotum,"돋움", sans-serif;
	font-size: 12px;font-style: normal;line-height: 17px;color: #7C7D7D; /* h10: 원본 '7C7D7D' # 누락 보충 — 실측 rgb(124,125,125). 바로 아래 .tds2 는 원본이 '#7C7D7D' 로 정상 표기(원저자 오타 방증) */
}
.tds2{
	font-family: "Apple SD Gothic Neo",'nanumR',"Nanum Gothic",Malgun Gothic,"맑은 고딕",Dotum,"돋움", sans-serif;
	font-size: 11px;font-style: normal;line-height: 14px;color: #7C7D7D;}

.tds2 span{font-weight:bold;}

.stit {padding:25px 0 16px; font-weight:bold; color:#000;font-size:20px;}
.stit2 {padding:25px 0 16px; font-weight:bold; color:#fe3652; font-size:20px;}

table.myinfo-add {
  width: 100%; border :0; border-collapse:collapse;
  font-family: "Apple SD Gothic Neo",'nanumR',"Nanum Gothic",Malgun Gothic,"맑은 고딕",Dotum,"돋움", sans-serif; font-size: 12px; text-decoration: none; color : #000;
}

table.myinfo-add th {
  border-top:1px solid #e0e0e0; border-spacing:0;
  border-bottom:1px solid #e0e0e0; border-spacing:0;}

table.myinfo-add td {
  background : #fff; padding:0 5px 0 5px;
  border-bottom:1px solid #e0e0e0; border-spacing:0;
  text-align: center;}

.navi {
	font-family: "Apple SD Gothic Neo",'nanumR',"Nanum Gothic",Malgun Gothic,"맑은 고딕",Dotum,"돋움", sans-serif;
	font-size: 11px;font-style: normal;line-height: normal;text-decoration: none;color: #999999;}

.listm {
	font-family: "Apple SD Gothic Neo",'nanumR',"Nanum Gothic",Malgun Gothic,"맑은 고딕",Dotum,"돋움", sans-serif;
	font-size: 12px; line-height: 18px; color:#6C99C5; text-decoration: none;}

.prod01 {
	font-family: "Apple SD Gothic Neo",'nanumR',"Nanum Gothic",Malgun Gothic,"맑은 고딕",Dotum,"돋움", sans-serif;
	font-size: 12px; line-height: 14px; color:#5B5B5B;}

.tm02 {
	font-family: "Apple SD Gothic Neo",'nanumR',"Nanum Gothic",Malgun Gothic,"맑은 고딕",Dotum,"돋움", sans-serif;
	font-size: 12px; font-style: normal; line-height:18px; color: #FFFFFF;}

blockquote
{
	font-style: italic;
	font-family: "Apple SD Gothic Neo",'nanumR',"Nanum Gothic",Malgun Gothic,"맑은 고딕",Dotum,"돋움", sans-serif;
	padding: 2px 0;
	border-style: solid;
	border-color: #ccc;
	border-width: 0;
}

.cke_contents_ltr blockquote
{
	padding-left: 20px;
	padding-right: 8px;
	border-left-width: 5px;
}

.cke_contents_rtl blockquote
{
	padding-left: 8px;
	padding-right: 20px;
	border-right-width: 5px;
}

.m_social{margin-left:-10px !important;}
.m_social ul.menu li {float:left;padding-bottom:10px;font-size:0;line-height:0;vertical-align:top;}
.m_social ul.menu li:last-child {padding-right:0;float:left;}
.m_social ul.menu li img{padding-left:10px;}

/* input 소스*/

.txt-field {height:30px; padding:0 10px; background:#fff; border:1px solid #d9d9d9;margin:5px 0;}
.txt-field2 {height:30px; padding:0 10px; background:#fff; border:1px solid #d9d9d9;margin:5px 0;opacity: 0.8;}
.txt-field3 {height:18px; padding:0 10px; background:#fff; border:1px solid #d9d9d9;margin:5px 0;opacity: 0.8;}
/*
input[type=checkbox]{
-webkit-appearance: none;appearance: none;width: 20px;height: 20px;margin: 0;cursor: pointer;vertical-align: bottom;background: #fff;
border: 1px solid #555555;border-radius: 1px;-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;box-sizing: border-box;position: relative;opacity: 0.5;}

input[type=checkbox]:active{border-color: #555555;background: #fff;-webkit-appearance: none;}
input[type=checkbox]:hover {border-color: #555555;-webkit-appearance: none;}
input[type=checkbox]:checked{background: #fff;}
input[type=checkbox]:checked::after {
width: 17px;height: 17px;content: '';display: block;background: #fff;-webkit-appearance: none;
position: relative;top: 1px;right: 0px;left: 1px;display: inline-block;-moz-appearance:none;
-webkit-appearance:none;opacity: 0.5;
}
*/

.phone_n{
	font-size: 12px; height:30px;line-height:30px;padding: 0 0 0 8px;
    display: inline-block;
    width: 65px;
    height: 30px;
    position: relative;
    top: 0;
    right: 0;
    background: url(/uploads/mig_site/img/templates/skin/images/button/tmp_form.png) no-repeat 47px -59px;
    cursor: pointer;
    opacity: 0.8;
	border: 1px solid #d0d0d0;appearance:none;
	-moz-appearance:none;
-webkit-appearance:none;
	color:#000000;
}
.phone_s{
	font-size: 12px; height:30px;line-height:30px;padding: 0 0 0 8px;
    display: inline-block;
    width: 175px;
    height: 30px;
    position: relative;
    top: 0;
    right: 0;
    background: url(/uploads/mig_site/img/templates/skin/images/button/tmp_form.png) no-repeat 157px -59px;
    cursor: pointer;
    opacity: 0.8;
	border: 1px solid #d0d0d0;appearance:none;
	-moz-appearance:none;
-webkit-appearance:none;
	color:#000000;
}
.phone_b{
	font-size: 12px; height:30px;line-height:30px;padding: 0 0 0 8px;
    display: inline-block;
    width: 575px;
    height: 30px;
    position: relative;
    top: 0;
    right: 0;
    background: url(/uploads/mig_site/img/templates/skin/images/button/tmp_form.png) no-repeat 557px -59px;
    cursor: pointer;
    opacity: 0.8;
	border: 1px solid #d0d0d0;appearance:none;
	-moz-appearance:none;
-webkit-appearance:none;
	color:#000000;
}

.phone_p{
	font-size: 12px; height:30px;line-height:30px;padding: 0 0 0 8px;
    display: inline-block;
    width: 220px;
    height: 30px;
    position: relative;
    top: 0;
    right: 0;
    background: url(/uploads/mig_site/img/templates/skin/images/button/tmp_form.png) no-repeat 200px -59px;
    cursor: pointer;
    opacity: 0.8;
	border: 1px solid #d0d0d0;appearance:none;
	-moz-appearance:none;
-webkit-appearance:none;
	color:#000000;
}

.phone_k{
	font-size: 12px; height:30px;line-height:30px;padding: 0 0 0 8px;
    display: inline-block;
    width: 75px;
    height: 30px;
    position: relative;
    top: 0;
    right: 0;
    background: url(/uploads/mig_site/img/templates/skin/images/button/tmp_form.png) no-repeat 57px -59px;
    cursor: pointer;
    opacity: 0.8;
	border: 1px solid #d0d0d0;appearance:none;
	-moz-appearance:none;
-webkit-appearance:none;
	color:#000000;
}

select::-ms-expand { display: none; }

/*
.checks {position: relative;}
.checks input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip:rect(0,0,0,0);
  border: 0;
}
.checks input[type="radio"] + label {
  display: inline-block;
  position: relative;
  padding-left: 30px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.checks input[type="radio"] + label:before {
  content: '';
  position: absolute;
  left: -1;
  top: -5px;
  width: 21px;
  height: 21px;
  text-align: center;
  background: #fafafa;
  border: 1px solid #d0d0d0;
  border-radius: 100%;
  box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
}
.checks input[type="radio"] + label:active:before,
.checks input[type="radio"]:checked + label:active:before  {
  box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}
.checks input[type="radio"]:checked + label:before {
  background: #ffffff;
  border-color: #d0d0d0;
}
.checks input[type="radio"]:checked + label:after {
  content: '';
  position: absolute;
  top: 1px;
  left: 5px;
  width: 11px;
  height: 11px;
  background: #99a1a7;
  border-radius: 100%;
  box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3);
}*/

/* radio size */
/*.checks.small input[type="radio"] + label {
  font-size: 12px;
  padding-left: 25px;
}
.checks.small input[type="radio"] + label:before {
    top: -2px;
  width: 18px;
  height: 18px;
}
.checks.small input[type="radio"]:checked + label:after {
    top: 4px;
  width: 8px;
  height: 8px;
}*/


.check {margin-left:10px;position:relative}

.check input[type="checkbox"] + label {background:url('/uploads/mig_site/img/source/image/checks.gif') no-repeat 0 0;cursor:pointer;display:inline-block;height:28px;left:0;padding-left:32px;line-height:29px;margin-left:-23px;.margin-left:-23px}/*가짜 체크박스*/
.check input[type="checkbox"]:checked + label{background-position: 0 -39px;}

.check input[type="radio"] + label {background:url('/uploads/mig_site/img/source/image/radio.gif') no-repeat 0 0;cursor:pointer;display:inline-block;height:26px;left:0;padding-left:29px;line-height:25px;margin-left:-23px}/*가짜 라디오버튼*/
.check input[type="radio"]:checked + label{background-position: 0 -50px;}

table.detail_page_table table {margin:0 auto}


/* ── 반응형 유동화 (2026-08-21 교정): 고정폭 테이블(1078/1080) 유동화.
   ⚠ 이전 버그: html·body 둘 다 overflow-x:hidden → overflow-y auto 강제 → 세로 이중 스크롤.
   이제 overflow 를 건드리지 않고 레이아웃만 유동화해 가로 넘침 자체를 없앤다. ── */
html, body { max-width: 100%; }
#divGSBody { width: 100% !important; max-width: 1080px; margin: 0 auto; }
@media (max-width: 1120px) {
  table[width="1080"], table[width="1078"] { width: 100% !important; max-width: 100%; }
  #divGSBody img { max-width: 100%; height: auto; }
}

/* ── 모바일/태블릿 햄버거 메뉴 (2026-08-21 재작성: 공격적 리셋으로 겹침 해결, 태블릿 포함) ── */
.mnav-toggle { display: none; }
@media (max-width: 1120px) {
  .mnav-toggle { display: inline-block; position: absolute; top: 62px; right: 16px; z-index: 100010;
    width: 40px; height: 34px; padding: 6px; background: none; border: 0; border-radius: 0;
    cursor: pointer; box-shadow: none; -webkit-appearance: none; appearance: none; }
  .mnav-toggle .mnav-bar { display: block; width: 100%; height: 3px; margin: 3px 0; background: #333; border-radius: 2px; }

  #header .top .top_menu { display: none !important; }

  #header .top.mnav-open .top_menu {
    display: block !important; position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    width: 100% !important; height: 100% !important; margin: 0 !important; padding: 62px 0 40px !important;
    overflow-y: auto !important; -webkit-overflow-scrolling: touch;
    background: #fff !important; z-index: 100000 !important; box-sizing: border-box !important; list-style: none !important; }

  /* 메뉴 내 모든 요소의 데스크톱 위치/플로트/고정높이 리셋 → 절대위치 서브메뉴 겹침 제거 */
  #header .top.mnav-open .top_menu * {
    position: static !important; float: none !important;
    width: auto !important; max-width: 100% !important; height: auto !important;
    top: auto !important; left: auto !important; right: auto !important; bottom: auto !important;
    line-height: 1.5 !important; background-image: none !important; margin: 0 !important; }

  #header .top.mnav-open .top_menu > li { display: block !important; border-bottom: 1px solid #e5e5e5; }
  #header .top.mnav-open .top_menu > li > a {
    display: block !important; padding: 16px 24px !important; font-size: 17px !important; font-weight: bold !important;
    color: #222 !important; text-align: left !important; }
  /* 서브메뉴: 원본 li padding(8px 10px)·height 리셋, 일관 여백 */
  #header .top.mnav-open .top_menu ul { display: block !important; background: #f7f7f7 !important; padding: 0 !important; }
  #header .top.mnav-open .top_menu ul li {
    display: block !important; border-top: 1px solid #ececec; padding: 0 !important; height: auto !important; min-height: 0 !important; }
  #header .top.mnav-open .top_menu ul li a {
    display: block !important; padding: 13px 24px 13px 40px !important; font-size: 14px !important;
    line-height: 1.4 !important; color: #555 !important; text-align: left !important; }
  /* 원본 스킨 잔여(빈 텍스트 노드·img 배경) 정리 */
  #header .top.mnav-open .top_menu ul li:empty { display: none !important; }
  #header .top.mnav-open .top_menu .li_img { background: none !important; }
}

@media (max-width: 1120px) {
  /* 전역: 지도 iframe·미디어·긴 표가 뷰포트 넘지 않게 (2026-08-21) */
  iframe, embed, object, video { max-width: 100% !important; }
  #divGSBody table { max-width: 100% !important; }
  #divGSBody td, #divGSBody th { overflow-wrap: anywhere; }
}

@media (max-width: 1120px) {
  /* width:100%+padding 인 콘텐츠 div가 content-box라 padding만큼 넘치는 것 방지 (2026-08-21) */
  #divGSBody div { box-sizing: border-box; }
}

@media (max-width: 1120px) {
  /* 콘텐츠 영역(divGSBody 밖 포함) width:100%+padding div box-sizing 교정 — privacy 등 (2026-08-21) */
  div[style*="width: 100%"], div[style*="width:100%"] { box-sizing: border-box !important; max-width: 100% !important; }
}

@media (max-width: 1120px) {
  /* 모바일/태블릿: 좌측 제품네비 사이드바 숨김(햄버거가 내비 대체) → 본문 전체폭 확보 (2026-08-21) */
  /* 제품/게시판 좌측 사이드바만 숨김(valign=top). 로고 셀(rowspan=2)은 제외 — 안 그러면 로고가 사라진다 */
  td[width="220"][valign="top"], td[width="228"][valign="top"] { display: none !important; }
  td[width="14"][valign="top"] { display: none !important; }
  td[width="847"] { width: auto !important; display: table-cell; }
}

/* 햄버거 메뉴 열림 시 뒤 body 스크롤 잠금(스크롤바 이중 방지) — 메뉴 오버레이만 스크롤 (2026-08-21) */
html.mnav-lock, body.mnav-lock { overflow: hidden !important; height: 100% !important; }

/* 햄버거→닫기(X) 변형 + 스크롤바 유무로 버튼 안 흔들리게 gutter 고정 (2026-08-21) */
html { scrollbar-gutter: stable; }
.mnav-toggle .mnav-bar { transition: transform .25s ease, opacity .2s ease; }
#header .top.mnav-open .mnav-toggle .mnav-bar:nth-child(1) { transform: translateY(6px) rotate(45deg); }
#header .top.mnav-open .mnav-toggle .mnav-bar:nth-child(2) { opacity: 0; }
#header .top.mnav-open .mnav-toggle .mnav-bar:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 1120px) {
  /* 배너 flexslider 반응형 — absolute(top:117px)·고정높이(505)가 헤더 위로 겹침 → 흐름에 넣고 폭비율 높이 (2026-08-21 flexslider 반응형) */
  .flexslider { position: relative !important; top: 0 !important; height: auto !important; width: 100% !important; overflow: hidden; }
  /* JS(initHeroSlider)가 슬라이드를 absolute 겹침 + opacity 페이드로 전환한다.
     그 방식을 유지하되, 부모(.slides)에 폭비율 높이를 줘 모든 슬라이드가 같은 크기로 겹치게 한다.
     ⚠ position:relative 강제나 :not(:first-child){display:none} 를 주면 JS가 활성화한 2·3번째
     슬라이드가 세로로 흐르거나 숨겨져 "배너 사라짐"이 된다(원본 slider 는 겹침 전제). */
  .flexslider .slides { position: relative; width: 100%; aspect-ratio: 1905 / 505; }
  .flexslider .slides > li { position: absolute !important; top: 0; left: 0; width: 100% !important; height: 100% !important; }
  .flexslider .slides > li a, .flexslider .slides > li img { display: block; width: 100% !important; height: 100% !important; }
  .flexslider .slides > li img { background-size: cover !important; background-position: center !important; object-fit: cover; }
  #visual { width: 100% !important; height: auto !important; float: none !important; }
  #visual div { width: 100% !important; }
  #brand, #mallmain { width: 100% !important; }
  #slideshow { width: 100% !important; margin-top: 20px !important; }
  #header .sns { width: 100% !important; }
  #header .sns ul { position: static !important; }
  /* subimg.jpg 는 flexslider 로딩 전 placeholder(데스크톱은 absolute 배너가 덮어 안 보임) — 모바일에선 흐름배치라 중복 노출 → 숨김 */
  img[src$="subimg.jpg"] { display: none !important; }
  table[background$="subbg.jpg"] { background-image: none !important; }
}

/* ── 반응형 푸터 (2026-08-24 재작성) — 원본 이미지 구운 고객센터/메뉴를 시맨틱 텍스트로 ── */
.site-footer { background: #f4f4f4; border-top: 1px solid #d3d3d3; margin-top: 50px; color: #555; font-size: 13px; line-height: 1.7; }
.site-footer .foot-inner { max-width: 1080px; margin: 0 auto; padding: 34px 20px 40px; box-sizing: border-box; }
.site-footer h3 { margin: 0 0 12px; font-size: 15px; font-weight: bold; color: #333; letter-spacing: .5px; }
.site-footer p { margin: 2px 0; }
.foot-top { display: flex; flex-wrap: wrap; gap: 30px 50px; padding-bottom: 26px; border-bottom: 1px solid #e0e0e0; }
.foot-col { flex: 1 1 auto; min-width: 180px; }
.foot-cs .foot-tel { font-size: 24px; font-weight: bold; color: #222; letter-spacing: 1px; line-height: 1.25; }
.foot-cs .foot-hours { color: #888; font-size: 12px; }
.foot-about-links { list-style: none; margin: 0; padding: 0; }
.foot-about-links li { margin: 4px 0; }
.foot-about-links a { color: #555; text-decoration: none; }
.foot-about-links a:hover { color: #cf180a; }
.foot-menu { display: flex; flex-wrap: wrap; gap: 6px 0; align-items: center; padding: 18px 0; }
.foot-menu a { color: #555; text-decoration: none; font-size: 13px; padding: 2px 16px; border-right: 1px solid #d5d5d5; }
.foot-menu a:first-child { padding-left: 0; }
.foot-menu a:last-child { border-right: 0; }
.foot-menu a:hover { color: #222; }
.foot-biz { display: flex; align-items: center; gap: 24px; padding-top: 20px; border-top: 1px solid #e0e0e0; }
.foot-logo img { max-width: 160px; height: auto; }
.foot-biz-info { font-style: normal; color: #777; font-size: 12px; line-height: 1.9; }
.foot-biz-info span { display: inline; }
.foot-biz-info span::after { content: " | "; color: #ccc; }
.foot-biz-info span.foot-biz-line, .foot-biz-info span.foot-copy { display: block; }
.foot-biz-info span.foot-biz-line::after, .foot-biz-info span.foot-copy::after { content: ""; }
.foot-copy { margin-top: 6px !important; color: #999; }

@media (max-width: 900px) {
  .site-footer { text-align: center; }
  .foot-top { flex-direction: column; gap: 24px; text-align: center; }
  .foot-col { min-width: 0; }
  .foot-menu { justify-content: center; }
  .foot-biz { flex-direction: column; gap: 14px; text-align: center; }
  .foot-biz-info { line-height: 1.8; }
  .foot-biz-info span { display: block; }
  .foot-biz-info span::after { content: ""; }
}

@media (max-width: 1080px) {
  /* 상품 목록 반응형 (2026-08-25): 좁은 폭에서 float 160px 6개가 줄바꿈되며 외톨이 발생.
     세로 캐러셀 대신 전 상품을 flex 그리드로 균등·중앙 배치해 깔끔하게 펼친다. 상품 그리드 반응형 */
  #slideshow { width: 100% !important; height: auto !important; margin-top: 24px !important; overflow: visible !important; }
  #slideshow .btn { display: none !important; }              /* 세로 캐러셀 위/아래 버튼 숨김 */
  #slidesContainer { width: 100% !important; height: auto !important; float: none !important; overflow: visible !important; }
  #slideInner { width: 100% !important; margin-top: 0 !important; transition: none !important; }
  #slideInner .slide { width: 100% !important; height: auto !important; }
  #slideInner .slide[data-clone] { display: none !important; }  /* 그리드 모드에선 클론 불필요 */
  /* 3개 슬라이드(ul)를 하나의 흐름으로: slide/ul 를 display:contents 로 투명화하고
     slideInner 자체를 flex 컨테이너로 → 18개 상품이 슬라이드 경계 없이 연속 배치(외톨이 방지) */
  #slideInner { display: flex !important; flex-wrap: wrap; justify-content: center; gap: 14px 14px; }
  #slideInner .slide { display: contents !important; }
  #slideInner .slide ul { display: contents !important; margin: 0; padding: 0; }
  #slideInner .slide li { float: none !important; width: 160px !important; height: auto !important; margin: 0 !important; }
}

/* ── 모바일 드로어 개선 (2026-08-25): 상단 로고+닫기 헤더바, 톤 정비 ── */
.mnav-head { display: none; }
@media (max-width: 1120px) {
  /* 열렸을 때(body.mnav-lock) 기존 헤더 햄버거 버튼 숨김 → 드로어 안 닫기 버튼만 노출 */
  body.mnav-lock .mnav-toggle { display: none !important; }

  /* 드로어 상단 고정 헤더바 */
  #header .top.mnav-open .top_menu { padding: 0 !important; }
  #header .top.mnav-open .top_menu > li.mnav-head {
    display: flex !important; align-items: center; justify-content: space-between;
    position: sticky; top: 0; z-index: 5;
    height: 58px; padding: 0 16px !important; background: #fff; border-bottom: 2px solid #cf180a; }
  #header .top.mnav-open .mnav-head-logo { line-height: 0; }
  #header .top.mnav-open .mnav-head-logo img { height: 34px !important; width: auto !important; }
  #header .top.mnav-open .mnav-close {
    width: 38px !important; height: 38px !important; min-width: 38px !important; flex: 0 0 38px;
    padding: 0 !important; background: none !important; border: 0 !important; cursor: pointer; position: relative !important; }
  #header .top.mnav-open .mnav-close span {
    position: absolute !important; top: 50% !important; left: 8px !important;
    width: 22px !important; height: 2px !important; background: #333 !important; }
  #header .top.mnav-open .mnav-close span:nth-child(1) { transform: rotate(45deg); }
  #header .top.mnav-open .mnav-close span:nth-child(2) { transform: rotate(-45deg); }

  /* 상위메뉴: 좌측 컬러바 강조 */
  #header .top.mnav-open .top_menu > li:not(.mnav-head) > a {
    padding: 16px 20px !important; border-left: 3px solid transparent; }
  #header .top.mnav-open .top_menu > li.menu_center_color > a { color: #cf180a !important; }
  /* 서브: 여백 정돈(이미 리셋됨) — 배경 살짝, 좌측 인디케이터 */
  #header .top.mnav-open .top_menu ul { background: #fafafa !important; }
  #header .top.mnav-open .top_menu ul li a { color: #666 !important; }
}

/* ── 모바일 드로어 아코디언 + 여백 통일 (2026-08-25) ── */
@media (max-width: 1120px) {
  /* 여백 통일: nv.css .sub_menuN{left:-30/-10/...} 무력화 + 상위/서브 일관 정렬 */
  #header .top.mnav-open .top_menu > li:not(.mnav-head) {
    position: relative !important; padding: 0 !important; margin: 0 !important; height: auto !important; }
  #header .top.mnav-open .top_menu > li:not(.mnav-head) > a {
    left: 0 !important; padding: 15px 48px 15px 22px !important; position: relative !important; }
  #header .top.mnav-open .top_menu li ul[class^="sub_menu"] {
    left: 0 !important; right: 0 !important; margin: 0 !important; }
  #header .top.mnav-open .top_menu li ul[class^="sub_menu"] li a {
    left: 0 !important; padding: 13px 22px 13px 40px !important; }

  /* 아코디언: 상위 a 에 +/- 토글 아이콘, 서브는 기본 접힘(.mnav-expanded 일 때만 펼침) */
  #header .top.mnav-open .top_menu > li:not(.mnav-head):has(> ul[class^="sub_menu"]) > a::after {
    content: ""; position: absolute; right: 22px; top: 50%; width: 10px; height: 10px;
    margin-top: -5px; border-right: 2px solid #999; border-bottom: 2px solid #999;
    transform: rotate(45deg); transition: transform .2s ease; }
  #header .top.mnav-open .top_menu > li.mnav-expanded > a::after { transform: rotate(-135deg); }
  #header .top.mnav-open .top_menu > li:not(.mnav-head) > ul[class^="sub_menu"] { display: none !important; }
  #header .top.mnav-open .top_menu > li.mnav-expanded > ul[class^="sub_menu"] { display: block !important; }
}

@media (max-width: 1120px) {
  /* 서브페이지 모바일/태블릿 좌우 여백 (2026-08-25 서브페이지 좌우 여백):
     #content는 display:contents(박스없음)라 패딩 불가 → 모바일에서 블록으로 되돌리고 좌우 패딩.
     홈(index)은 #content 미사용이라 영향 없음. box-sizing으로 넘침 방지. */
  #content { display: block !important; padding-left: 16px !important; padding-right: 16px !important; box-sizing: border-box; overflow-x: hidden; }
  /* 내부 고정폭 표/이미지가 패딩만큼 좁아진 폭을 넘지 않게 */
  #content table { max-width: 100% !important; }
  /* 홈은 배너·상품그리드가 풀블리드여야 자연스러움 → 여백 제거 */
  body.home #content { padding-left: 0 !important; padding-right: 0 !important; }
}

/* ── 제품 상세 공통 스타일 (.pspec) — 하이브리드 재조판 공통. 페이지별 CSS 중복/누락(urethane 0개,
   silicone-hose 3개 등) 해소 위해 공통 정의. 페이지 고유 변형(wide/spec/dia/matrix/figure)만 각 페이지 CSS. (2026-08-25) ── */
.pspec { text-align: left; color: #333; font-size: 13px; line-height: 1.7; }
.pspec h2 { margin: 0 0 8px; font-size: 26px; letter-spacing: -0.5px; color: #2b2f4a; }
.pspec h3 { margin: 34px 0 12px; padding-left: 10px; font-size: 15px; color: #2b2f4a; border-left: 3px solid #59aeef; }
.pspec-rule { width: 90px; height: 6px; background: #d8d8d8; margin: 0 0 20px; }
.pspec-lead { margin: 0 0 6px; }
.pspec-apply { margin: 0; padding: 18px 26px; border: 1px solid #ccc; list-style: none; column-count: 2; column-gap: 26px; }
.pspec-apply li { line-height: 2.1; padding-left: 9px; text-indent: -9px; }
.pspec-apply li::before { content: "\B7 "; }
.pspec table { border-collapse: collapse; width: 100%; max-width: 800px; font-size: 13px; }
.pspec th, .pspec td { border: 1px solid #b5b5b5; padding: 7px 6px; text-align: center; }
.pspec thead th { background: #bfe0fa; font-weight: normal; }
.pspec thead tr + tr th { background: #cfcfcf; }
.pspec tbody th { background: #cfcfcf; font-weight: normal; }
.pspec caption { caption-side: top; padding: 0 0 8px; font-weight: bold; color: #2b2f4a; }
.pspec-note { margin: 8px 0 0; max-width: 800px; text-align: right; font-size: 12px; }
.pspec-pack { margin: 0; padding: 0; list-style: none; }
.pspec-pack li { padding-left: 10px; text-indent: -10px; }
.pspec-pack li::before { content: "\B7 "; }
.pspec-caution { display: block; padding-left: 28px; text-indent: 0; }
.pspec-photos img { display: block; max-width: 100%; height: auto; }
.pspec-photos img + img { margin-top: 12px; }
.pspec-scroll { max-width: 800px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.pspec-scroll table { min-width: 470px; }
@media (max-width: 860px) { .pspec-scroll { max-width: calc(100vw - 26px); } }

/* 준비중 안내 페이지(실란트 등 원본 콘텐츠 미등록) (2026-08-25) */
.pspec-empty { padding: 20px 0 60px; }
.pspec-empty-msg { margin: 40px 0; padding: 50px 20px; text-align: center; color: #888; font-size: 15px; line-height: 1.9; background: #fafafa; border: 1px solid #eee; }

/* ── 맨 위로(TOP) 버튼 — 화살표, 우하단 고정 (2026-08-25). 기존 LAYER_MENU(최근본상품+TOP박스) 제거 대체 ── */
.to-top {
  position: fixed; right: 20px; bottom: 24px; z-index: 9000;
  width: 46px; height: 46px; border-radius: 50%;
  background: #222; box-shadow: 0 2px 8px rgba(0,0,0,.25);
  display: flex; align-items: center; justify-content: center;
  text-decoration: none; transition: background .2s ease, transform .15s ease;
}
.to-top:hover { background: #cf180a; transform: translateY(-2px); }
.to-top-arrow {
  display: block; width: 13px; height: 13px;
  border-top: 2.5px solid #fff; border-right: 2.5px solid #fff;
  transform: rotate(-45deg); margin-top: 4px;
}
@media (max-width: 768px) { .to-top { right: 14px; bottom: 18px; width: 42px; height: 42px; } }

@media (max-width: 1120px) {
  /* 모바일/태블릿: 브레드크럼(현재위치 네비 '홈 > 게시판 > Q&A') 숨김 (2026-08-25 브레드크럼 숨김) */
  td.navi, .navi { display: none !important; }
}

/* 게시판 상단 페이지명 (2026-09-04) — 모바일은 브레드크럼(위)·LNB 가 안 보여 현재 게시판을
   알 수 없고, 섹션 이미지('고객지원'/'자료실')는 8페이지가 동일해 구분이 안 된다.
   데스크톱은 원본 재현대로 이미지만, 모바일/태블릿에서만 게시판명 텍스트를 병기한다. */
.board-title-name { display: none; }
@media (max-width: 1120px) {
  .board-title-name { display: inline-block; margin-left: 0; font-weight: bold; font-size: 15px; color: #333; vertical-align: middle; letter-spacing: -0.5px; }
  /* 모바일 타이틀 통일(2026-09-09 고객 확인): 게시판 섹션 이미지(공지/카달로그 2종을 12페이지가 공유)는
     숨기고 타이틀바('게시판')+게시판명 텍스트만 — 약관류 페이지와 동일한 표시 깊이로 맞춘다. 데스크톱은 원본 유지. */
  img[src*="board/file/notice_top_"], img[src*="board/file/catalogue_top_"] { display: none; }
}

@media (max-width: 1120px) {
  /* 게시판 리스트 표(번호/제목/작성자/작성일/조회수) 반응형 (2026-08-25 게시판 리스트 표 반응형):
     #content{overflow-x:hidden}이라 표의 자체 가로스크롤이 막힘 → table-layout:fixed로 5열을
     뷰포트 폭에 맞춰 강제 축소. 제목열이 남는 폭 차지, 나머지는 내용 축약. width=500 표도 포함. */
  #content table[width="98%"], #content table[width="500"] { table-layout: fixed !important; width: 100% !important; max-width: 100% !important; display: table !important; overflow: visible !important; }
  #content table[width="98%"] td, #content table[width="500"] td { overflow: hidden; text-overflow: ellipsis; word-break: break-all; }
  /* 게시판 목록 열너비 명시(2026-08-26): 제목 넓게·메타 고정. 헤더표+데이터행(별도표) 정렬 위해
     1px 세로 구분선 숨김 + 데이터행 table[width=100%]도 고정레이아웃. 페이지CSS ≤640 width:auto를 특이도(1,2,2)로 오버라이드. */
  #content table[width="98%"] td[width="1"] { display: none !important; }
  /* 헤더 표 첫 행이 <td colspan=11>(검은 구분선)이라 table-layout:fixed가 열을 11등분(각 53px)해
     라벨행/데이터행의 명시 %너비를 무시함 → auto로 전환해 명시 %너비가 적용되게 (2026-08-26) */
  #content table[width="98%"] { table-layout: auto !important; }
  #content table[width="98%"] table[width="100%"] { table-layout: auto !important; width: 100% !important; }
  #content table[width="98%"] td[width="540"] { width: 46% !important; }
  #content table[width="98%"] td[width="109"], #content table[width="98%"] td[width="110"] { width: 19% !important; font-size: 11px; }
  #content table[width="98%"] td[width="79"], #content table[width="98%"] td[width="80"] { width: 23% !important; font-size: 11px; }
  #content table[width="98%"] td[width="59"], #content table[width="98%"] td[width="60"] { width: 12% !important; font-size: 11px; }
  /* 모바일: 게시글 번호 열 숨김 (2026-08-25) — 내부 카운터라 방문자에게 무의미, 제목 폭 확보 */
  #content table[width="98%"] td[width="39"],
  #content table[width="98%"] td[width="39"] + td[width="1"],
  #content table[width="98%"] td[width="40"] { display: none !important; }
}

/* 게시판 페이지 이동(◀ 1 ▶) 미표시 (2026-08-25) — 글 거의 없는 껍데기 게시판이라 페이징 불필요.
   헤더/검색 표와 속성이 같아 prev.gif 포함 표만 :has로 특정.
   ⚠ 배선 존 제외 (2026-08-27): 배선된 페이저는 같은 prev.gif 를 계승해 이 선택자에 걸려
   래퍼 table 째 숨겨졌다(실측: 동작하는 페이저가 0x0 · offsetParent=null · display:none).
   jsErrors 에 안 잡히는 무증상 회귀라 존마다 페이지 CSS 로 되돌리는 우회가 복제되던 것을
   여기서 정본화한다 — .ec-base-paginate(배선 페이저)를 품은 표는 숨기지 않는다. */
#content table[width="98%"]:has(img[src*="/button/prev.gif"]):not(:has(.ec-base-paginate)) { display: none !important; }

/* 배선 페이저 공용 스타일 (2026-08-27 승격) — 존 3곳(notice·order·catalogue)이 같은 블록을
   각자 복제하고 있었다. 이 사이트엔 EC 스킨 CSS 가 없어 표시 규칙을 여기서 정의한다.
   현재 페이지 #FF0000 볼드 = 원본 재현. first/last 는 대응 아이콘이 없어 미표시(마크업은 공용 규격상 유지). */
.ec-base-paginate { display: inline-block; }
/* [hidden] 이 display 선언보다 이겨야 한다 — paging.js 는 1페이지 이하일 때
   root.hidden / li.hidden 으로 감춘다(총 페이지 1이면 페이저 자체가 사라지는 게 정상). */
.ec-base-paginate[hidden] { display: none; }
.ec-base-paginate > a,
.ec-base-paginate ol,
.ec-base-paginate li { display: inline-block; vertical-align: middle; }
.ec-base-paginate ol { margin: 0; padding: 0; list-style: none; }
.ec-base-paginate li { margin: 0 4px; }
.ec-base-paginate li[hidden] { display: none; }
.ec-base-paginate a { text-decoration: none; color: inherit; }
.ec-base-paginate a:hover, .ec-base-paginate a:focus { text-decoration: underline; }
/* 현재 페이지 — 원본 <font color="#FF0000"><b>1</b></font>.
   paging.js 는 .this 를 <li> 가 아니라 <a> 에 붙인다(sel.on='this'). */
.ec-base-paginate a.this { color: #FF0000; font-weight: bold; }
.ec-base-paginate > a.first, .ec-base-paginate > a.last { display: none; }

/* 게시판 '다른 게시판으로 이동' 드롭다운 미표시 — 전 화면. 껍데기 게시판이라 불필요(컨버팅 시 빌더 게시판 모듈이 이동 처리) (2026-08-25) */
.grs_admin2 { display: none !important; }

/* 게시판 '다른 게시판으로 이동' 앞 빨간 > 화살표(ic_info_01.gif) 미표시 — 드롭다운 숨김과 함께 (2026-08-25) */
img[src*="ic_info_01.gif"] { display: none !important; }
/* 상세보기 미배선 게시글 제목은 클릭 불가처럼 커서 기본값 (2026-08-25) */
a[data-board-read="pending"] { cursor: default; }

/* 게시판 검색 버튼(텍스트) + 모바일 '검색' 라벨 숨김 (2026-08-26) */
/* 게시판 검색 폼 — 시맨틱 재작성(2026-08-26): <table> 제거, form+flex. 박스 여백·입력+버튼 좌측정렬 */
.board-search { display:flex; align-items:center; gap:8px; border:1px solid #ddd; background:#f5f5f5; padding:12px 14px; margin:12px 0 0; box-sizing:border-box; }
.board-search-label { font-weight:bold; color:#333; font-size:13px; white-space:nowrap; }
.board-search-input { flex:0 1 420px; height:32px; padding:0 10px; border:1px solid #d9d9d9; background:#fff; font-size:13px; box-sizing:border-box; }
.board-search-btn { display:inline-flex; align-items:center; height:32px; padding:0 18px; background:#333; color:#fff !important; font-size:12px; font-weight:bold; border:0; border-radius:3px; cursor:pointer; white-space:nowrap; }
.board-search-btn:hover { background:#cf180a; }
@media (max-width:640px) { .board-search-label { display:none; } .board-search-input { flex:1 1 auto; } }

/* 빈 게시판 안내문구 통일 (2026-08-26) — 고객지원/자료실 동일 스타일 */
#content td.board-empty { color:#888; font-size:13px; text-align:center; letter-spacing:0; padding:22px 10px; }

/* 공통 2단 레이아웃(서브내비 + 본문) — 레거시 <table width=1078> 시맨틱 전환 시범 (2026-08-26) */
/* gap 11px: 본문 열 = 1080-220-11 = 849px(구몰 우측 컬럼 실측치) — 통이미지(845~849px)가
   원본 크기로 렌더된다. 846px(gap 14)에서는 847px+ 이미지 전량이 미세 축소 리샘플링돼
   텍스트가 뿌옇게 보였다(고객 화질 피드백 2026-09-09). */
.page-2col { display:grid; grid-template-columns:220px 1fr; gap:11px; max-width:1080px; margin:0 auto; align-items:start; }
.page-side { display:flex; flex-direction:column; align-items:center; gap:15px; }
.page-side img { display:block; max-width:100%; height:auto; }
.page-main { min-width:0; }
@media (max-width:1120px) {
  .page-2col { grid-template-columns:1fr; }
  .page-side { display:none; }
}

/* 헤더 시맨틱 전환 — 배경/래퍼/밴드 table 제거, 로고 float:left + #header(GNB) float:right 유지 (2026-08-26) */
.head-bg { background:url('/uploads/mig_site/img/templates/skin/images/program_basic/body/20160826151727_mallbg.jpg') repeat-x top; }
.head-inner { width:1078px; max-width:100%; margin:0 auto; }
.head-util { text-align:right; padding:0; line-height:1; }
.head-util a { display:inline-block; }
.head-util a img { vertical-align:middle; }
.head-main { position:relative; }
.head-main::after { content:""; display:block; clear:both; }
.head-main #header { margin-top:11px; }
.head-logo { float:left; }
.head-logo img { display:block; max-width:100%; height:auto; }
.sub-banner { background:url('/uploads/mig_site/img/templates/skin/images/images/subbg.jpg') repeat-x; text-align:center; padding-bottom:16px; }
.sub-banner-inner { width:1080px; max-width:100%; margin:0 auto; }
.sub-banner-inner img { max-width:100%; height:auto; vertical-align:top; }
@media (max-width:1120px) {
  .head-util { text-align:center; }
  .head-main { height:auto; }
  .head-logo { float:none; text-align:center; }
  .head-logo img { display:inline-block; }
  .sub-banner { display:none; }  /* 모바일/태블릿 서브페이지: 하늘색 띠 제거(사용자 선택 숨김) */
}

/* 홈 히어로 죽은링크(href=#) 커서 기본값 (2026-08-26) */
#banner_tabs .slides a[href="#"] { cursor: default; }


/* ── 공지 롤링(TV 화면) 아이템 — 인라인 스타일 대체 + 긴 제목 CSS 말줄임 (2026-08-31) ── */
.rollist01 .roll-item { margin-bottom: 18px; }
.rollist01 .roll-item:last-child { margin-bottom: 0; }
.rollist01 .roll-item a { display: block; text-decoration: none; }
.rollist01 .roll-new { margin-right: 3px; vertical-align: middle; }
.rollist01 .roll-date { color: #FFEFAE; }
.rollist01 .roll-item, .rollist01 .roll-item a { max-width: 150px; }
.rollist01 .roll-title {
  display: block;
  width: 150px;
  color: #FFCC00;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rollist01 .roll-empty { color: #FFCC00; text-align: center; padding-top: 2px; }

/* TV 화면 배경색 폴백 — 스크린 이미지(lr_rollist_screen.gif) 미로드 시에도 검은 화면 유지.
   원본 스킨은 배경색 없이 이미지에만 의존해, 이미지가 안 뜨면 흰 화면+노란글씨 안보임(2026-08-31 실측).
   이미지가 순검정(0,0,0)이라 로드돼도 시각 동일. */
.rollist01 { background-color: #000; }

/* ── 공지 TV 위젯: 레거시 raster 9-tile 프레임(엣지 이미지가 셀을 못 채워 Retina서 흰 간격,
   h8 원본부터 있던 문제)을 숨기고 깔끔한 CSS 프레임으로 교체 (2026-08-31) ── */
.js-notice-tv { background: #1c1c1c; border-radius: 10px; }
.js-notice-tv td[background] { background-image: none !important; }
.js-notice-tv img[src*="lr_rollist_img"] { display: none !important; }
.js-notice-tv .rollist01 { background-color: #000 !important; }

/* 공지 롤링 이음새 없는 무한 스크롤 — 내용 2벌 복제 + translateY -50% 순환(marquee 재시작 끊김 대체) */
.rollist01 marquee { overflow: hidden; }
.rollist01 .roll-scroll { animation-name: rollUp; animation-timing-function: linear; animation-iteration-count: infinite; }
@keyframes rollUp { from { transform: translateY(0); } to { transform: translateY(-50%); } }

/* 게시판 상태화면(로딩/빈/에러) hidden 이 반응형 display:table !important(#content table[width=98%], 587행)를 이겨야 한다 — class 추가로 특이도 상향. 모바일서 상태화면 오노출 방지(2026-08-31). */
#content table.board-state[hidden] { display: none !important; }

/* GNB 쇼핑몰 하위 메뉴 숨김 — 스토어 카테고리 딥링크 불가로 드롭다운 감추고 쇼핑몰=스토어 메인 링크만 (2026-08-31) */
#header .sub_menu5, #header #layer5 { display: none !important; }

/* hidden 인 게시판 표(상태화면·댓글블록 등)는 반응형 display:table !important 를 이겨야 한다 — 모바일서 빈 댓글·상태화면 오노출 방지(2026-08-31) */
#content table[width="98%"][hidden], #content table[width="500"][hidden] { display: none !important; }


/* 좌측 제품 카테고리 박스 (제품소개와 동일 — 쇼핑몰 카테고리+호버 플라이아웃 대체, 2026-08-31) */
.lnb-prodcat { width: 219px; margin: 0 auto 10px; text-align: left; }
.lnb-prodcat-head { margin: 0; background: #1c1c1c; color: #fff; font-size: 18px; font-weight: bold; letter-spacing: 1px; padding: 15px 18px; }
.lnb-prodcat-list { list-style: none; margin: 0; padding: 0; border: 1px solid #e2e2e2; border-top: none; }
.lnb-prodcat-list li { border-bottom: 1px solid #eee; }
.lnb-prodcat-list li:last-child { border-bottom: none; }
.lnb-prodcat-list a { display: block; padding: 12px 20px; color: #333; text-decoration: none; font-size: 14px; }
.lnb-prodcat-list a::before { content: "- "; color: #999; }
.lnb-prodcat-list a:hover { background: #f6f6f6; color: #000; }
/* 현재 페이지 메뉴 강조(활성) — 5개 섹션 공통, lnb-active.js 가 부여 */
.lnb-prodcat-list a.lnb-active { background: #f2f2f2; color: #cf180a; font-weight: bold; }
.lnb-prodcat-list a.lnb-active::before { color: #cf180a; }


/* 글쓰기 폼 모바일 정렬 보정 — 제목행이 잠금(비밀글) 체크로 셀이 길어지면 라벨이 세로중앙으로
   밀려 입력칸과 어긋나던 것을 교정. 라벨을 상단정렬하고 좁은 화면에서 입력을 풀폭으로. (2026-08-31) */
/* 폼 모든 셀 상단정렬 → 입력이 셀 상단에 오고, 라벨은 패딩으로 입력 세로중앙에 맞춤.
   제목행(잠금체크)·비번행(안내문구)로 셀이 길어져도 라벨-입력이 어긋나지 않는다. */
[data-write-form] table td { vertical-align: top; }
/* 예외: sbt 타이틀바(30px, bg이미지)는 폼이 아니므로 원래 중앙 정렬 유지 —
   위 규칙이 훅 하위 전체 table 을 잡아 타이틀·브레드크럼이 상단 붙던 것 교정 (2026-09-09) */
[data-write-form] table[height="30"][background] td { vertical-align: middle; }
/* 입력칸을 셀 폭에 맞춰 통일(전 화면) — size 속성 차이로 PC 에서 닉네임/제목/비번 폭이 달라 우측 끝이 안 맞던 것 교정. 체크박스/라디오는 별도 규칙으로 제외됨. */
[data-write-form] input[type="text"],
[data-write-form] input[type="password"] { width: 100%; box-sizing: border-box; }
/* 라벨을 line-height 로 입력 세로중앙에 맞춘다(폰트 metric 무관 — padding 방식은 기기마다 어긋남).
   입력 height:30px + 셀 padding-top:5px → 입력 세로중앙 20px. 라벨 line-height:40px, 상단정렬 → 중앙 20px. */
[data-write-form] td[width="73"] { line-height: 40px; padding-top: 0; }
[data-write-form] td[width="14"] { line-height: 40px; }
[data-write-form] td[width="14"] img { vertical-align: middle; }
/* 라벨-입력 구분 바(|)를 입력 높이(≈30px)에 맞추고 입력과 세로 중앙정렬. 상단정렬 변경으로 짧고 위로 붙던 것 교정. 전 화면(PC/태블릿/모바일) 공통. */
[data-write-form] td[width="20"] { line-height: 40px; }
[data-write-form] td[width="20"] table { display: inline-block; vertical-align: middle; height: 28px !important; }
[data-write-form] td[width="20"] table td { height: 28px !important; line-height: 0; padding: 0; }
[data-write-form] td[width="20"] table img { height: 28px !important; }
/* 잠금(비밀글) 체크박스가 페이지 CSS 의 모바일 리플로우 input{width:100%!important} 에 걸려 254px 로 늘어나던 것 제외 — 체크박스/라디오는 본래 크기로 */
[data-write-form] input[type="checkbox"],
[data-write-form] input[type="radio"] { width: auto !important; max-width: none !important; }
[data-write-form] .check[data-lock-row] input[type="checkbox"] { vertical-align: middle; margin: 0 5px 0 0; }
@media screen and (max-width: 760px) {
  [data-write-form] input[type="text"],
  [data-write-form] input[type="password"] { width: 100%; box-sizing: border-box; }
  [data-write-form] .check[data-lock-row] { margin-top: 8px; }
}


/* 글쓰기 폼 상단/버튼 여백 — 상단 검은선과 첫 필드(닉네임) 사이, 등록/취소 버튼 위 여백 추가 */
[data-write-form] tr:has(> td[bgcolor="#000000"]) + tr > td { padding-top: 16px; }
[data-write-form] table[height="40"]:has([data-write-submit]) { margin-top: 18px; }

/* 게시판 목록/상세 상태 셀(로딩·빈목록·에러) 공통 하단 마감 — 목록 표가 행 유무와 무관하게
   #dddddd 1px 로 닫히게 한다. 페이지별 복사 규칙(성적서·주문제작 누락 사고)을 전역 단일 정의로 승격 (2026-09-09). */
#content td.board-empty { border-bottom: 1px solid #dddddd; }