@charset "utf-8";
/********************************************************
 전라북도의사회(jmain) 전용 스타일
 - theme.css 다음에 불러와서 필요한 부분만 덮어씀
 - 색상은 아래 변수만 바꾸면 전체에 반영
 - 다른 의사회 사이트에 쓸 때는 이 파일만 복사해서 색상/크기 조정
********************************************************/
:root {
	--jm-main: #3b8ede;       /* 주 색상 (홈버튼, 하단선, 메뉴 강조) */
	--jm-main-dark: #2a74c0;  /* 주 색상 마우스 올렸을 때 */
	--jm-lnb-bg: #f5f5f5;     /* 최상단 링크줄 배경 */
	--jm-menu-text: #333;     /* 주메뉴 글자색 */
	--jm-caption-bg: rgba(59, 142, 222, .65); /* 메인 슬라이드 글자 배경 (마지막 숫자가 투명도 0~1) */
}

/********************************************************
■ 최상단 링크줄 (LNB)
********************************************************/
#nt_lnb { background: var(--jm-lnb-bg); border-bottom: 1px solid #e5e5e5; }
#nt_lnb .nt-container { padding-top: .55rem; padding-bottom: .55rem; }
#nt_lnb ul > li > a { color: #666; }
#nt_lnb ul > li > a:hover { color: var(--jm-main); }

/********************************************************
■ 메뉴바 : 로고 + 홈 + 주메뉴 + 전체메뉴
********************************************************/
.menu-bar-wrap { border-top: 0; }
#nt_sticky .menu-bar.border-primary { border-bottom: 2px solid var(--jm-main) !important; }
.jm-bar { min-height: 84px; }

/* 로고 */
.jm-logo { margin-right: 1.75rem; }
.jm-logo img { width: auto; max-height: 56px; }

/* 주메뉴 오른쪽 정렬 : 메뉴 칸은 내용 폭만큼, 남는 공간은 홈버튼 앞으로 */
.jm-bar > .flex-grow-1 { flex: 0 1 auto !important; }
.jm-bar > .jm-home { margin-left: auto; }

/* 홈 버튼 */
.jm-home {
	display: inline-flex; align-items: center; justify-content: center;
	width: 72px; height: 50px; margin-right: 1rem;
	background: var(--jm-main); color: #fff !important;
	border-radius: 3px; font-size: 22px;
}
.jm-home:hover { background: var(--jm-main-dark); text-decoration: none; }

/* 전체메뉴(≡) */
.jm-allmenu { margin-left: 1rem; font-size: 26px; color: var(--jm-menu-text) !important; }
.jm-allmenu:hover { color: var(--jm-main) !important; }

/********************************************************
■ PC 주메뉴
********************************************************/
#nt_menu .me-a { color: var(--jm-menu-text); font-weight: 500; font-size: 19px; letter-spacing: -0.5px; }
#nt_menu .me-li.on .me-a,
#nt_menu .me-li:hover .me-a { color: var(--jm-main); }

/* 서브메뉴(드롭다운) */
.nt-menu .sub-1div { border-top: 2px solid var(--jm-main); }
.nt-menu .sub-1dli.on .sub-1da,
.nt-menu .sub-1dli:hover .sub-1da { color: var(--jm-main); }

/********************************************************
■ 메인 상단 : 슬라이드 + 바로가기 2x3 (index/index-jmain.php)
********************************************************/
.jm-main-top {
	padding: 1.25rem 0;
	background: linear-gradient(to bottom, #ecf1f5, #f2f4f7);
	border-bottom: 1px solid #b6d2e6;
}
/* 슬라이드 : 가로:세로 = 20:7 비율로 높이 고정 (비율은 슬라이드 이미지에 맞춰 조정) */
.jm-slider { overflow: hidden; }
.jm-slider .title-carousel { height: auto !important; min-height: 0 !important; aspect-ratio: 20 / 7; }
.jm-slider .carousel-item { background-size: cover !important; background-position: center center !important; }

/* 슬라이드 전환 : 페이드 (Bootstrap 4 carousel-fade 방식) */
.jm-slider .carousel-item { opacity: 0; transform: none !important; transition: opacity .8s ease-in-out !important; }
.jm-slider .carousel-item.active,
.jm-slider .carousel-item-next.carousel-item-left,
.jm-slider .carousel-item-prev.carousel-item-right { z-index: 1; opacity: 1; }
.jm-slider .active.carousel-item-left,
.jm-slider .active.carousel-item-right { z-index: 0; opacity: 0; transition: opacity 0s .8s !important; }

/* 슬라이드 글자 : 왼쪽 아래 + 반투명 배경 띠 (위젯설정의 '텍스트' 칸 내용) */
.jm-slider .carousel-item .container { max-width: none; padding: 0; }
.jm-slider .carousel-item .row {
	margin: 0; justify-content: flex-start !important; align-items: flex-end !important; text-align: left !important;
}
.jm-slider .carousel-item .row > div { flex: 0 0 auto; max-width: 100%; padding: 0; }
.jm-slider .caption {
	display: inline-block; margin: 0 0 2.75rem 0; padding: .55rem 1.1rem !important;
	background: var(--jm-caption-bg); border-radius: 0 !important;
	animation-delay: .3s !important;
}
.jm-slider .caption h2,
.jm-slider .caption p {
	margin: 0; padding: 0 !important; color: #fff;
	font-size: 22px; font-weight: 500; letter-spacing: -0.5px;
	text-shadow: 0 1px 2px rgba(0,0,0,.35);
	animation-delay: .3s !important;
}
@media (max-width: 767.98px) {
	.jm-slider .caption { margin-bottom: 2rem; padding: .4rem .8rem !important; }
	.jm-slider .caption h2,
	.jm-slider .caption p { font-size: 15px; }
}

/* 바로가기 2x3 : 슬라이드 높이에 맞춰 3줄로 나눔 */
.jm-quick-row {
	display: grid !important; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3, 1fr);
	gap: 8px; height: 100%; margin: 0 !important;
}
.jm-quick-row > .col { padding: 0 !important; margin: 0 !important; max-width: none !important; flex: none !important; }

.jm-quick {
	display: flex; align-items: center;
	height: 100%; min-height: 0; padding: 0 1rem;
	background: #fafafa; border: 1px solid #e0e0e0;
	color: #222 !important; font-size: 17px; font-weight: 700; letter-spacing: -0.5px;
}
.jm-quick:hover { text-decoration: none; color: var(--jm-main) !important; }
.jm-quick i {
	flex-shrink: 0; width: 50px; height: 44px; line-height: 44px; margin-right: .85rem;
	text-align: center; font-size: 26px; border-radius: 5px;
	background: #3ca1db; color: #fff;
}
.jm-quick:hover i { background: #444; }
.jm-quick .badge { font-size: 11px; vertical-align: middle; }

/* 아이콘을 이미지로 쓸 때 (배경 없는 png) : 아이콘 칸과 같은 크기 */
.jm-quick-ico {
	flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
	width: 50px; height: 44px; margin-right: .85rem;
}
.jm-quick-ico img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; }
.jm-quick-txt { line-height: 1.25; }
.jm-quick-txt small { display: block; margin-top: 3px; font-size: 12px; font-weight: 500; letter-spacing: -0.3px; }

/* 가운데 줄 강조 1 : 회비안내 (사이트 파랑) */
.jm-quick.is-pay { background: linear-gradient(135deg, var(--jm-tb-from), var(--jm-tb-to)); border-color: var(--jm-tb-from); color: #fff !important; }
.jm-quick.is-pay small { color: rgba(255,255,255,.9); }
.jm-quick.is-pay i { background: #fff; color: var(--jm-main); }
.jm-quick.is-pay .badge { background: #ffd43b; color: #333; }
.jm-quick.is-pay:hover { background: linear-gradient(135deg, #22629f, #3592bd); color: #fff !important; }
.jm-quick.is-pay:hover i { background: #fff; color: #22629f; }

/* 가운데 줄 강조 2 : 회관건립기금 모금 (네이버 초록) */
.jm-quick.is-fund { background: #03c75a; border-color: #03c75a; color: #fff !important; }
.jm-quick.is-fund small { color: rgba(255,255,255,.9); }
.jm-quick.is-fund i { background: #fff; color: #03c75a; }
.jm-quick.is-fund .jm-quick-ico { background: #fff; border-radius: 5px; padding: 5px; }
.jm-quick.is-fund:hover { background: #02b351; color: #fff !important; }
.jm-quick.is-fund:hover i { background: #fff; color: #02b351; }

/********************************************************
■ 메인 본문 : 최신글 박스
********************************************************/
.jm-main-body { padding-bottom: 1rem; }
.jm-box {
	margin-bottom: 1.5rem; padding: 1.25rem 1.5rem 1rem;
	background: #fff; border: 1px solid #e3e3e3;
}
.jm-box h3.h3 a { color: #222; }
.jm-box h3.h3 a:hover { color: var(--jm-main); text-decoration: none; }
.jm-box hr.hr::after { background-color: var(--jm-main); }
@media (max-width: 575.98px) {
	.jm-box { padding: 1rem .75rem .75rem; }
}

/* 하단 배너 슬라이드 (wr-post-slick) : 흰 배경, 여백 축소 */
.jm-banner .wr-post-slick { margin-bottom: .5rem !important; }
.jm-banner .wr-post-slick .post-slick { box-shadow: none; }
.jm-banner .wr-post-slick .post-slick-items { padding: 0; margin-left: -6px !important; margin-right: -6px !important; } /* row의 -15px 대신 간격만큼만 → 양 끝 테두리 보이게 */
.jm-banner .wr-post-slick .slider-single { padding-left: 6px; padding-right: 6px; }

/* 배너 칸 : 185x54 비율 고정 + 테두리는 바깥 칸에 (원본 크기 배너도 같은 크기로) */
.jm-banner .wr-post-slick .img-hover-scale {
	aspect-ratio: 185 / 54;
	border: 1px solid #e3e3e3; border-radius: 0 !important;
	background: #fff; box-shadow: none !important;
}
.jm-banner .wr-post-slick .img-hover-scale a { display: block; width: 100%; height: 100%; }
.jm-banner .wr-post-slick .img-hover-scale img {
	width: 100%; height: 100%; object-fit: contain; border: 0;
}
.jm-banner .wr-post-slick .img-hover-scale:hover img { transform: none; }  /* 확대 효과 끔 */

/* 최신글 두 열 : 각 열의 마지막 박스가 남는 높이를 채워서 양쪽 바닥을 맞춤 (PC) */
@media (min-width: 768px) {
	.jm-equal > [class*="col-"] { display: flex; flex-direction: column; }
	.jm-equal > [class*="col-"] > .jm-box:last-child { flex-grow: 1; }
}

/* 앨범자료실 (갤러리 위젯) : 세로 3줄 웹진형 - 왼쪽 썸네일, 오른쪽 제목/작성자/날짜 */
/* 썸네일 크기는 아래 두 값으로 조정 (위젯설정의 썸네일 크기보다 우선) */
.jm-photo { --jm-photo-w: 120px; --jm-photo-ratio: 70%; }  /* 썸네일 폭, 세로/가로 비율 */
.jm-photo .na-list > li .img-wrap { padding-bottom: var(--jm-photo-ratio) !important; }
.jm-photo .na-list > li {
	display: grid; grid-template-columns: var(--jm-photo-w) 1fr; grid-template-rows: auto auto 1fr;
	column-gap: 1rem; flex: 0 0 100% !important; max-width: 100% !important;
	margin-bottom: .75rem !important; padding-bottom: .75rem !important;
	border-bottom: 1px solid #f0f0f0;
}
.jm-photo .na-list > li:last-child { border-bottom: 0; margin-bottom: 0 !important; }
.jm-photo .na-list > li .img-wrap { grid-column: 1; grid-row: 1 / span 3; margin-bottom: 0 !important; }
.jm-photo .na-list > li .na-title { grid-column: 2; font-size: 16px; font-weight: 500; }
.jm-photo .na-list > li .clearfix { grid-column: 2; margin-top: .35rem; }
@media (max-width: 575.98px) {
	.jm-photo { --jm-photo-w: 100px; }
}

/* 태블릿/모바일 : 슬라이드 아래로 내려가므로 칸 높이를 고정값으로 */
@media (max-width: 991.98px) {
	.jm-quick-row { grid-template-rows: none; grid-auto-rows: 84px; height: auto; }
	.jm-quick { font-size: 15px; padding: 0 .75rem; }
	.jm-quick i { width: 42px; height: 38px; line-height: 38px; font-size: 22px; margin-right: .6rem; }
	.jm-quick-ico { width: 42px; height: 38px; margin-right: .6rem; }
	.jm-quick-txt small { font-size: 11px; }
}

/********************************************************
■ 메인 오른쪽 : 로그인 (widget/jm-outlogin)
********************************************************/
.jm-login { padding: 1.1rem 1.25rem; }
.jm-ol-head { display: flex; align-items: center; padding-bottom: .75rem; border-bottom: 1px solid #eee; }
.jm-ol-photo { flex-shrink: 0; margin-right: .85rem; }
.jm-ol-photo img { width: 64px; height: 64px; border-radius: 50%; border: 1px solid #e3e3e3; object-fit: cover; }
.jm-ol-info { flex-grow: 1; min-width: 0; }
.jm-ol-name { font-size: 18px; font-weight: 500; letter-spacing: -0.5px; color: #222; margin-bottom: .45rem;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jm-ol-links, .jm-ol-sub { font-size: 14px; color: #555; }
.jm-ol-links a, .jm-ol-sub a { color: #555; }
.jm-ol-links a:hover, .jm-ol-sub a:hover { color: var(--jm-main); text-decoration: none; }
.jm-ol-sub { margin: .6rem 0 .75rem; color: #888; }
.jm-ol-sub a { color: #888; }
.jm-ol-btn { background: #2f3640; color: #fff !important; border-radius: 0; padding: .5rem; font-size: 15px; }
.jm-ol-btn:hover { background: #1e232a; }

/* 로그아웃 상태 : 입력칸 2줄 + 오른쪽 큰 로그인 버튼 */
.jm-ol-form { display: flex; }
.jm-ol-inputs { flex-grow: 1; min-width: 0; }
.jm-ol-inputs .form-control { height: 38px; border-radius: 0; font-size: 14px; }
.jm-ol-inputs .form-control + .sr-only + .form-control,
.jm-ol-inputs .form-control ~ .form-control { margin-top: 4px; }
.jm-ol-login {
	flex-shrink: 0; width: 76px; margin-left: 4px; border-radius: 0;
	background: var(--jm-main); color: #fff !important; font-weight: 500;
}
.jm-ol-login:hover { background: var(--jm-main-dark); }
.jm-login .custom-control-label { font-size: 14px; color: #888; }

/********************************************************
■ 메인 오른쪽 : 회원복지 협약기관 배너
********************************************************/
.jm-side-bn li + li { margin-top: 8px; }
.jm-side-bn li a { display: block; border: 1px solid #e3e3e3; }
.jm-side-bn li a:hover { border-color: var(--jm-main); }
.jm-side-bn li img { display: block; width: 100%; height: auto; }

/********************************************************
■ 하단 (tail.php) : 링크줄 + 로고/주소 - 화면 전체 폭 어두운 배경
********************************************************/
:root {
	--jm-ft-link-bg: #454545;  /* 링크줄 배경 */
	--jm-ft-bg: #2b2b2b;       /* 주소 영역 배경 */
}
#nt_footer.jm-footer { width: 100%; margin: 0; background: var(--jm-ft-bg); color: #ccc; font-size: 15px; }
.jm-ft-links { background: var(--jm-ft-link-bg); }
.jm-ft-links ul { padding: .8rem 0; }
.jm-ft-links li { margin-right: 0 !important; }
.jm-ft-links li + li::before { content: "/"; margin: 0 .9rem; color: #999; }
.jm-ft-links a { color: #ccc; }
.jm-ft-links a b { font-weight: 500; }
.jm-ft-links a:hover { color: #fff; text-decoration: none; }

.jm-ft-info { padding: 1.5rem 0 1.75rem; }
.jm-ft-logo { flex-shrink: 0; margin-right: 2rem; }
.jm-ft-logo img { display: block; max-height: 48px; width: auto; }
.jm-ft-about { list-style: none; margin: 0 0 .25rem; padding: 0; }
.jm-ft-about li { display: inline-block; margin-right: 2.25rem; line-height: 1.9; color: #ddd; }
.jm-ft-copy { color: #ddd; line-height: 1.9; }
.jm-ft-copy b { font-weight: 400; }
@media (max-width: 767.98px) {
	#nt_footer.jm-footer { font-size: 14px; }
	.jm-ft-info { padding: 1.25rem 0 1.5rem; }
	.jm-ft-about li { display: block; margin-right: 0; line-height: 1.7; }
}

/********************************************************
■ 서브 상단 띠 (_title.php) : 이미지 없이 그라데이션 + 글자
********************************************************/
:root {
	--jm-tb-from: #2a74c0;   /* 띠 왼쪽 색 */
	--jm-tb-to: #3fa7d6;     /* 띠 오른쪽 색 */
}
#nt_title.jm-title-band {
	position: relative; overflow: hidden;
	background: linear-gradient(110deg, var(--jm-tb-from) 0%, var(--jm-tb-to) 100%) !important;
	color: #fff;
}
/* 오른쪽 옅은 원 무늬 */
#nt_title.jm-title-band::before,
#nt_title.jm-title-band::after {
	content: ""; position: absolute; border-radius: 50%; pointer-events: none;
	background: rgba(255,255,255,.08);
}
#nt_title.jm-title-band::before { width: 340px; height: 340px; right: 8%;  top: -190px; }
#nt_title.jm-title-band::after  { width: 220px; height: 220px; right: -40px; bottom: -130px; background: rgba(255,255,255,.10); }

.jm-tb-inner {
	position: relative; z-index: 1;
	display: flex; flex-direction: column; justify-content: center;
	min-height: 118px; padding: 1rem 0;
}
.jm-tb-inner p { margin: 0; }
.jm-tb-en { font-size: 12px; letter-spacing: 3px; opacity: .75; }
.jm-tb-slogan { font-size: 26px; font-weight: 300; letter-spacing: -1px; line-height: 1.35; }
.jm-tb-slogan strong { font-weight: 700; }
.jm-tb-name { font-size: 15px; opacity: .9; }
@media (max-width: 767.98px) {
	.jm-tb-inner { min-height: 84px; padding: .75rem 0; }
	.jm-tb-en { font-size: 10px; letter-spacing: 2px; }
	.jm-tb-slogan { font-size: 19px; }
	.jm-tb-name { font-size: 13px; }
	#nt_title.jm-title-band::before { width: 200px; height: 200px; top: -120px; }
}

/* 서브 상단 띠 오른쪽 바로가기 : PC(992px 이상)에서만 */
.jm-tb-wrap { display: flex; align-items: center; justify-content: space-between; }
.jm-tb-quick { display: none; position: relative; z-index: 1; margin: 0; padding: 0; list-style: none; }
@media (min-width: 992px) {
	.jm-tb-quick { display: flex; gap: 12px; }
}
.jm-tb-quick a {
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	width: 104px; height: 84px; border-radius: 6px;
	background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.28);
	color: #fff !important; font-size: 14px; letter-spacing: -0.5px;
	transition: background .2s, transform .2s;
}
.jm-tb-quick a:hover { background: rgba(255,255,255,.24); text-decoration: none; transform: translateY(-2px); }
.jm-tb-quick i { font-size: 24px; margin-bottom: 6px; opacity: .95; }

/********************************************************
■ 게시판 사이드 (side/jm-side.php) : 로그인 + 하위메뉴
********************************************************/
.jm-side .jm-box { margin-bottom: 1.25rem; }
.jm-snb { margin-bottom: 1.5rem; border: 1px solid #e3e3e3; background: #fff; }
.jm-snb-head {
	position: relative; padding: 1.4rem 1rem; text-align: center;
	background: linear-gradient(110deg, var(--jm-tb-from), var(--jm-tb-to));
	color: #fff; font-size: 20px; font-weight: 500; letter-spacing: -0.5px;
}
.jm-snb-head::after { /* 아래 꼭지 */
	content: ""; position: absolute; left: 50%; bottom: -9px; margin-left: -9px;
	border-left: 9px solid transparent; border-right: 9px solid transparent;
	border-top: 9px solid var(--jm-tb-from);
}
.jm-snb-list { list-style: none; margin: 0; padding: 0; }
.jm-snb-list > li + li { border-top: 1px solid #eee; }
.jm-snb-list > li > a {
	display: flex; align-items: center; justify-content: space-between;
	padding: .85rem 1.25rem; color: #333; font-size: 16px;
}
.jm-snb-list > li > a i { color: #999; }
.jm-snb-list > li > a:hover,
.jm-snb-list > li.on > a { background: #eef5fc; color: var(--jm-main); text-decoration: none; }
.jm-snb-list > li.on > a { font-weight: 500; }
.jm-snb-list > li.on > a i,
.jm-snb-list > li > a:hover i { color: var(--jm-main); }
.jm-snb-sub { list-style: none; margin: 0; padding: .4rem 0 .6rem; background: #f8fafc; }
.jm-snb-sub a { display: block; padding: .3rem 1.25rem .3rem 2rem; color: #666; font-size: 14px; }
.jm-snb-sub li.on a, .jm-snb-sub a:hover { color: var(--jm-main); text-decoration: none; }

/********************************************************
■ 내용 페이지 (내용관리 : greet, ethics, history, organ, map ...)
  - 내용관리 HTML 에 class="jm-page" 로 감싸면 적용
********************************************************/
.jm-page { font-size: 16px; line-height: 1.85; color: #444; word-break: keep-all; }
.jm-page img { max-width: 100%; height: auto; }
.jm-page-img { text-align: center; }

/* 구역 + 제목 */
.jm-sec { margin-bottom: 2.75rem; }
.jm-sec:last-child { margin-bottom: 1rem; }
.jm-sec-title {
	position: relative; margin: 0 0 1.25rem; padding: 0 0 .7rem .9rem;
	font-size: 21px; font-weight: 700; letter-spacing: -0.5px; color: #222;
	border-bottom: 1px solid #e3e3e3;
}
.jm-sec-title::before { /* 왼쪽 파란 막대 */
	content: ""; position: absolute; left: 0; top: .2em; width: 4px; height: 1.05em;
	background: linear-gradient(to bottom, var(--jm-tb-to), var(--jm-tb-from)); border-radius: 2px;
}
.jm-sec-title::after { /* 제목줄 아래 짧은 파란 선 */
	content: ""; position: absolute; left: 0; bottom: -1px; width: 60px; height: 2px; background: var(--jm-main);
}
.jm-sec-body p { margin: 0 0 1rem; }

/* 번호 목록 (의사윤리강령) */
.jm-num { list-style: none; counter-reset: jmnum; margin: 0; padding: 0; }
.jm-num > li {
	counter-increment: jmnum; position: relative;
	padding: .9rem 1rem .9rem 3.6rem; border-bottom: 1px dashed #e3e3e3;
}
.jm-num > li::before {
	content: counter(jmnum); position: absolute; left: .6rem; top: .95rem;
	width: 32px; height: 32px; line-height: 32px; border-radius: 50%; text-align: center;
	background: var(--jm-main); color: #fff; font-size: 15px; font-weight: 700;
}

/* 인용 박스 (선서 첫 문장) */
.jm-quote {
	position: relative; margin: 0 0 1.25rem; padding: 1.25rem 1.5rem 1.25rem 3.5rem;
	background: #eef5fc; border-left: 4px solid var(--jm-main);
	font-size: 18px; font-weight: 500; color: #24507e;
}
.jm-quote::before {
	content: "\201C"; position: absolute; left: 1rem; top: .2rem;
	font-size: 54px; line-height: 1; color: var(--jm-tb-to); font-family: Georgia, serif;
}

/* 체크 목록 (선서 문항) */
.jm-check { list-style: none; margin: 0; padding: 0; }
.jm-check > li { position: relative; padding: .55rem 0 .55rem 1.9rem; border-bottom: 1px solid #f2f2f2; }
.jm-check > li::before {
	content: "\f00c"; font-family: FontAwesome; position: absolute; left: .2rem; top: .6rem;
	color: var(--jm-main); font-size: 14px;
}

/* 오시는 길 : 지도 + 정보표 */
.jm-map { margin-bottom: 1.25rem; border: 1px solid #e3e3e3; }
.jm-map .root_daum_roughmap { width: 100% !important; }
.jm-info { display: grid; grid-template-columns: 9rem 1fr; margin: 0; border-top: 2px solid var(--jm-main); }
.jm-info dt, .jm-info dd { margin: 0; padding: .8rem 1rem; border-bottom: 1px solid #e3e3e3; }
.jm-info dt { background: #f5f8fb; font-weight: 500; color: #222; }
.jm-info a { color: var(--jm-main); }
.jm-sep { display: inline-block; width: 1px; height: 12px; margin: 0 .6rem; background: #ccc; vertical-align: middle; }

@media (max-width: 575.98px) {
	.jm-page { font-size: 15px; }
	.jm-sec-title { font-size: 19px; }
	.jm-num > li { padding-left: 3rem; }
	.jm-num > li::before { width: 28px; height: 28px; line-height: 28px; font-size: 14px; left: .3rem; }
	.jm-quote { font-size: 16px; padding: 1rem 1rem 1rem 2.75rem; }
	.jm-info { grid-template-columns: 1fr; }
	.jm-info dt { border-bottom: 0; padding-bottom: .2rem; }
	.jm-info dd { padding-top: .2rem; }
}

/* 회칙 탭 (게시판 j_rule 읽기 스킨) */
.jm-tabs { display: flex; list-style: none; margin: 0 0 1.5rem; padding: 0; border-bottom: 1px solid #d5d5d5; }
.jm-tabs li { margin-bottom: -1px; }
.jm-tabs li + li { margin-left: -1px; }
.jm-tabs a {
	display: block; padding: .65rem 1.75rem; border: 1px solid #d5d5d5;
	background: #f5f5f5; color: #555; font-size: 16px; font-weight: 500;
}
.jm-tabs a:hover { color: var(--jm-main); text-decoration: none; }
.jm-tabs li.on a {
	position: relative; z-index: 1; background: #fff; color: var(--jm-main);
	border-top: 2px solid var(--jm-main); border-bottom-color: #fff;
}
.jm-files { list-style: none; margin: 0 0 1rem; padding: .75rem 1rem; background: #f8fafc; border: 1px solid #e3e3e3; font-size: 15px; }
.jm-files li + li { margin-top: .35rem; }
.jm-files a { color: #444; }
.jm-files a:hover { color: var(--jm-main); text-decoration: none; }
.jm-admin-btns { padding-top: .75rem; border-top: 1px solid #eee; }
.jm-admin-btns .btn { margin-left: .25rem; }

/********************************************************
■ 병의원검색 (bbs/hospital_list.php, hospital_view.php)
********************************************************/
.jm-hp-guide { margin: -.25rem 0 1rem; color: #666; font-size: 15px; }
.jm-hp-form { margin-bottom: 1.5rem; border-top: 2px solid var(--jm-main); }
.jm-hp-row { display: flex; align-items: stretch; border-bottom: 1px solid #e3e3e3; }
.jm-hp-th {
	flex: 0 0 8.5rem; margin: 0; padding: .7rem 1rem; display: flex; align-items: center;
	background: #f5f8fb; font-weight: 500; color: #222; font-size: 15px;
}
.jm-hp-td { flex: 1 1 auto; min-width: 0; padding: .5rem .75rem; }
.jm-hp-td .custom-select, .jm-hp-td .form-control { max-width: 320px; font-size: 15px; }
.jm-hp-checks { padding-top: .65rem; padding-bottom: .4rem; }
.jm-hp-checks .custom-control { margin-bottom: .3rem; min-width: 6.5rem; font-size: 15px; }
.jm-hp-btns { padding-top: 1rem; text-align: center; }
.jm-hp-btns .btn { min-width: 110px; margin: 0 .2rem; }

.jm-hp-total { margin-bottom: .5rem; font-size: 15px; color: #555; }
.jm-hp-total b { color: var(--jm-main); }
.jm-hp-table { margin-bottom: 1rem; border-top: 2px solid #333; font-size: 15px; }
.jm-hp-table th { background: #f7f7f7; text-align: center; white-space: nowrap; border-bottom: 1px solid #ccc !important; }
.jm-hp-table td { text-align: center; vertical-align: middle; }
.jm-hp-table td a { color: #222; }
.jm-hp-table td a:hover { color: var(--jm-main); }
.jm-hp-table td.text-left a { font-weight: 500; }
.jm-hp-zone, .jm-hp-name { width: 5.5rem; white-space: nowrap; }
.jm-hp-tel { width: 9rem; white-space: nowrap; }
.jm-hp-empty { padding: 3rem 0 !important; color: #888; }
.jm-hp-paging { text-align: center; }

.jm-hp-info { margin-bottom: 1.5rem; }
.jm-hp-map iframe { display: block; width: 100%; height: 420px; border: 0; }
.jm-hp-maplinks { margin: -.5rem 0 .5rem; text-align: right; }
.jm-hp-maplinks .btn { margin-left: .25rem; }

@media (max-width: 575.98px) {
	.jm-hp-row { flex-direction: column; }
	.jm-hp-th { flex-basis: auto; padding: .5rem .75rem .2rem; background: none; }
	.jm-hp-td { padding-top: 0; }
	.jm-hp-td .custom-select, .jm-hp-td .form-control { max-width: none; }
	.jm-hp-table { font-size: 14px; }
	.jm-hp-zone, .jm-hp-name { width: auto; }
	.jm-hp-tel { width: auto; }
	.jm-hp-map iframe { height: 300px; }
}

/********************************************************
■ 팝업레이어 (관리자 > 팝업레이어관리)
  - PC : 예전처럼 "홈페이지 폭" 기준으로 위치 고정
         (브라우저 크기가 바뀌어도 팝업이 좌우로 움직이지 않음)
  - 관리자에서 입력한 좌측 위치(px)는 아래 폭의 왼쪽 끝부터 계산
********************************************************/
:root { --jm-pop-w: 1200px; }  /* 기준 폭 : 예전 사이트 본문 폭 */
#hd_pop { width: var(--jm-pop-w); max-width: none; margin: 0 auto; }
@media (max-width: 1200px) {
	#hd_pop { margin-left: 0; } /* 기준 폭보다 화면이 좁으면 왼쪽 끝에 붙임 */
}
.hd_pops { box-shadow: 0 6px 24px rgba(0,0,0,.18); }

/* 모바일 : 화면 폭에 맞춰 이미지 전체가 보이게 */
@media (max-width: 576px) {
	#hd_pop { width: 100%; }
	.hd_pops { left: 10px !important; right: 10px !important; top: 10px !important; max-width: none; }
	.hd_pops_con { width: 100% !important; height: auto !important; max-height: calc(100vh - 90px); overflow-y: auto; background: #fff; }
	.hd_pops_con img { width: 100% !important; height: auto !important; }
	.hd_pops_footer { display: flex; }
	.hd_pops_footer button { position: static !important; flex: 1 1 auto; margin: 0 !important; font-size: 13px !important; }
	.hd_pops_footer .hd_pops_close { flex: 0 0 auto; }
}

/********************************************************
■ 회원정보관리 (bbs/mem_list.php, mem_form.php, mem_excel.php, mem_part.php)
********************************************************/
.jm-mem-menu { margin-bottom: 1.25rem; }
.jm-mem-search { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 1rem; }
.jm-mem-search .custom-select { width: auto; max-width: 220px; }
.jm-mem-search .form-control { width: 200px; }
.jm-mem-cats { display: flex; flex-wrap: wrap; list-style: none; margin: 0 0 1rem; padding: .6rem .75rem; background: #f5f8fb; border: 1px solid #e3e3e3; font-size: 15px; }
.jm-mem-cats li + li::before { content: "|"; margin: 0 .6rem; color: #ccc; }
.jm-mem-cats a { color: #444; }
.jm-mem-cats a b { font-weight: 500; color: #888; }
.jm-mem-cats li.on a, .jm-mem-cats li.on a b { color: #d6336c; font-weight: 700; }
.jm-mem-total { margin-bottom: .4rem; font-size: 15px; }
.jm-mem-table { border-top: 2px solid #333; font-size: 15px; }
.jm-mem-table th { background: #f7f7f7; text-align: center; white-space: nowrap; border-bottom: 1px solid #ccc !important; }
.jm-mem-table th a { color: #222; }
.jm-mem-table td { text-align: center; vertical-align: middle; padding: .5rem .4rem; }
.jm-mem-table td a { color: #333; }
.jm-mem-table td a.is-join, .jm-mem-note .is-join { color: #e8590c; font-weight: 700; }
.jm-mem-table tr.is-stop td { background: #fafafa; color: #999; }
.jm-mem-empty { padding: 3rem 0 !important; color: #888; }
.jm-mem-note { margin: .25rem 0 1rem; font-size: 14px; color: #666; }
.jm-mem .btn-xs { padding: .1rem .45rem; font-size: 13px; line-height: 1.5; }
.jm-mem-part { max-width: 420px; }

/* 입력 폼 */
.jm-mem-h4 { margin: 1.5rem 0 .5rem; font-size: 17px; font-weight: 700; color: #333; }
.jm-mem-form { margin-bottom: 0; }
.jm-mem-form .jm-hp-td { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.jm-mem-form .jm-hp-td > .form-control:not([class*="jm-w-"]) { flex: 1 1 100%; }
.jm-w-xs { width: 110px !important; flex: 0 0 auto; }
.jm-w-sm { width: 160px !important; flex: 0 0 auto; }
.jm-w-md { width: 240px !important; flex: 0 0 auto; }
.jm-mem-selects .custom-select { width: auto; max-width: 200px; }
.jm-req { color: #e03131; }
.jm-help { font-size: 13px; color: #6c8ebf; }

/* 일괄등록 */
.jm-mem-guide { margin-bottom: 1rem; padding: 1rem 1.25rem; background: #fffbe6; border: 1px solid #f1e3a6; font-size: 14px; }
.jm-mem-guide ul, .jm-mem-guide ol { margin: 0; padding-left: 1.2rem; }
.jm-mem-guide li + li { margin-top: .35rem; }
.jm-mem-result { margin-bottom: 1.5rem; }
.jm-mem-ids { margin-top: .25rem; font-size: 13px; word-break: break-all; }

@media (max-width: 575.98px) {
	.jm-mem-search .custom-select, .jm-mem-search .form-control { flex: 1 1 45%; max-width: none; width: auto; }
	.jm-w-sm, .jm-w-md { width: 100% !important; }
}

/* 내용 페이지 : 안내 문장, 표, 혜택 박스 */
.jm-lead { margin: 0 0 1.25rem; font-size: 16px; color: #444; }
.jm-lead .fa { color: var(--jm-main); margin-right: .25rem; }

.jm-tbl { width: 100%; min-width: 560px; border-collapse: collapse; border-top: 2px solid var(--jm-main); font-size: 15px; }
.jm-tbl th, .jm-tbl td { padding: .75rem .6rem; border-bottom: 1px solid #e3e3e3; text-align: center; vertical-align: middle; }
.jm-tbl thead th { background: #f5f8fb; color: #222; font-weight: 700; white-space: nowrap; }
.jm-tbl tbody th { background: #fafbfc; color: #24507e; font-weight: 500; white-space: nowrap; }
.jm-tbl a { color: #333; }
.jm-tbl a:hover { color: var(--jm-main); }

.jm-benefit { margin-bottom: 1.5rem; border: 1px solid #e3e3e3; }
.jm-benefit-head { display: flex; align-items: center; padding: .7rem 1rem; background: #f5f8fb; font-size: 17px; font-weight: 700; color: #222; }
.jm-benefit-no {
	flex-shrink: 0; width: 30px; height: 30px; line-height: 30px; margin-right: .7rem;
	border-radius: 50%; text-align: center; background: var(--jm-main); color: #fff; font-size: 15px;
}
.jm-benefit-main { margin: 0; padding: .9rem 1rem .4rem; font-size: 16px; }
.jm-benefit-main b { color: #d6336c; }
.jm-benefit-main small { color: #888; }
.jm-benefit-note { margin: 0; padding: 0 1rem .9rem 2.2rem; color: #666; font-size: 14px; }
.jm-benefit-note li { list-style: "※ "; }
@media (max-width: 575.98px) {
	.jm-benefit-head { font-size: 15px; }
	.jm-benefit-main { font-size: 15px; }
}

/* 약관·방침 페이지 (provision, privacy, disclaimer, noemail) */
.jm-terms { font-size: 15px; line-height: 1.8; }
.jm-terms .jm-art { margin: 1.75rem 0 .6rem; font-size: 17px; font-weight: 700; color: #24507e; }
.jm-terms .jm-sec-title + .jm-art { margin-top: 0; }
.jm-terms .jm-tol { margin: 0 0 .5rem; padding-left: 1.5rem; }
.jm-terms .jm-tol .jm-tol { margin: .25rem 0 .5rem; padding-left: 1.25rem; list-style: disc; color: #555; }
.jm-terms .jm-tol li { margin-bottom: .25rem; }
.jm-terms p { margin: 0 0 .9rem; }
.jm-noemail { padding: 2rem 1rem; text-align: center; background: #f5f8fb; border: 1px solid #e3e3e3; }
.jm-noemail .fa { font-size: 64px; color: var(--jm-main); opacity: .8; }

/* 회원가입 약관 상자 안에서는 제목 숨김 (나리야 회원가입 스킨이 provision.php 를 불러옴) */
.register .jm-terms .jm-sec-title { display: none; }
.register .jm-terms { font-size: 13px; }

/* ===== 회원정보 찾기 (아이디/비밀번호) ===== */
.jm-find{max-width:480px;margin:0 auto}
.jm-find .jm-tabs{margin-bottom:24px}
.jm-find label{font-weight:600;font-size:14px;margin-bottom:4px}
.jm-find-desc{color:#555;line-height:1.7;margin-bottom:18px}
.jm-find-result{text-align:center;padding:28px 16px;border:1px solid #dbe6f3;border-radius:8px;background:#f5f9fe}
.jm-find-id{font-size:26px;font-weight:700;color:var(--jm-main);letter-spacing:2px;margin-bottom:6px;word-break:break-all}
.jm-find-guide{margin-top:16px;padding:14px 16px;background:#f8f9fa;border-radius:6px;line-height:1.7;font-size:14px}
.jm-find-warn{margin-top:16px;padding:14px 16px;background:#fff8e6;border:1px solid #f3dfa8;border-radius:6px;line-height:1.7;font-size:14px;color:#6b5200}
.jm-find-steps{padding:16px 18px;border:1px solid #d6e6f6;border-radius:6px;background:#f5f9fe;font-size:15px;line-height:1.75}
.jm-find-steps ol{margin:8px 0 6px;padding-left:22px}
.jm-find-steps li{margin-bottom:4px}
.jm-find-note{margin:0;color:#c0392b;font-size:14.5px}
.jm-find-email{font-size:19px;font-weight:700;color:#24507e;word-break:break-all;margin-bottom:0}

/* 바로가기 : 가로 2칸 (회관건립기금) */
.jm-quick-row > .jm-wide { grid-column: 1 / -1; }
.jm-wide .jm-quick { font-size: 19px; }
.jm-wide .jm-quick-txt small { font-size: 13px; }
.jm-wide .jm-quick::after { content: "\f105"; font-family: FontAwesome; margin-left: auto; font-size: 26px; opacity: .85; }
@media (max-width: 991.98px) {
	.jm-wide .jm-quick { font-size: 16px; }
	.jm-wide .jm-quick-txt small { font-size: 12px; }
}