@charset "utf-8";

/* ============================================
   논문 투고 규정 (rule_article) 전용 스타일
   조문(제n조)을 카드형으로 재구성한 개선 디자인
   색상/폰트/아이콘은 레이아웃 공통(--color, Material Icons) 사용
   ============================================ */

.rule_article {counter-reset: article;}

/* --- 상단 요약 스트립 --- */
.reg_head {display:grid; grid-template-columns:1fr; gap:0.875rem; background:linear-gradient(120deg, #f3f7fd 0%, #eef7f5 100%); border:1px solid #dde6f2; border-radius:20px; padding:1.75rem; margin-bottom:2.5rem;}
.reg_head .reg_title {grid-column:1 / -1; display:flex; align-items:center; gap:10px; font-size:1.375rem; font-weight:700; color:#1e2a44; margin-bottom:0.25rem;}
.reg_head .reg_title .material-icons-outlined {display:inline-flex; justify-content:center; align-items:center; width:42px; height:42px; background:var(--color); color:#fff; border-radius:12px; font-size:1.375rem;}
.reg_head .reg_item {display:flex; align-items:flex-start; gap:0.75rem; background:rgba(255,255,255,0.7); border:1px solid #e2e9f3; border-radius:14px; padding:1rem 1.125rem;}
.reg_head .reg_item .material-icons-outlined {color:var(--color); font-size:1.5rem; flex:0 0 auto;}
.reg_head .reg_item .t {line-height:1.4;}
.reg_head .reg_item .t b {display:block; font-size:0.8125rem; color:var(--color); font-weight:700;}
.reg_head .reg_item .t span {font-size:1.0625rem; color:#333; word-break:break-all;}

/* --- 조문 카드 --- */
.rule_article > dl {display:flex; flex-direction:column; gap:1rem;}
.rule_article > dl > dt {display:flex; align-items:center; gap:10px; background:#f4f7fd; border:1px solid #e2e7f0; border-bottom:0; border-radius:14px 14px 0 0; padding:0.875rem 1.25rem; font-size:1.125rem; font-weight:700; color:var(--color); position:relative; margin-top:0.25rem;}
.rule_article > dl > dt::before {counter-increment: article; content: counter(article); display:inline-flex; justify-content:center; align-items:center; flex:0 0 30px; width:30px; height:30px; background:var(--color); color:#fff; border-radius:50rem; font-size:0.9375rem; font-family:"Roboto", sans-serif;}
.rule_article > dl > dt:first-of-type {margin-top:0;}
.rule_article > dl > dd {background:#fff; border:1px solid #e2e7f0; border-top:0; border-radius:0 0 14px 14px; padding:1.125rem 1.375rem; line-height:1.75; color:#333; box-shadow:0 4px 14px rgba(30,50,90,0.04);}
.rule_article > dl > dt, .rule_article > dl > dd {transition:border-color .2s ease-out;}
.rule_article > dl > dt:hover, .rule_article > dl > dt:hover + dd {border-color:#c2d2ec;}

/* 부칙 (마지막 dt/dd) — 강조색 */
.rule_article > dl > dt:last-of-type {background:#eef7f4; color:#1f8a6d; border-color:#cde9df;}
.rule_article > dl > dt:last-of-type::before {content:'\e5ca'; font-family:var(--material); background:#2ca985; font-size:1.125rem;}
.rule_article > dl > dd:last-of-type {border-color:#cde9df;}

/* dd 내부 리스트 */
.rule_article dd > ol {counter-reset: refnum; margin:0.75rem 0 0; padding:0; list-style:none;}
.rule_article dd > ol > li {counter-increment: refnum; position:relative; background:#f8f9fb; border:1px solid #eceef3; border-radius:10px; padding:0.875rem 1rem 0.875rem 2.5rem; line-height:1.65; word-break:break-all;}
.rule_article dd > ol > li::before {content: counter(refnum); position:absolute; left:0.875rem; top:0.875rem; display:inline-flex; justify-content:center; align-items:center; width:20px; height:20px; background:#dde6f4; color:var(--color); border-radius:50rem; font-size:0.75rem; font-weight:700;}
.rule_article dd > ol > li + li {margin-top:8px;}

.rule_article dd > ul {margin:0; padding:0; list-style:none;}
.rule_article dd > ul > li {position:relative; padding-left:16px; line-height:1.7;}
.rule_article dd > ul > li::before {content:''; position:absolute; top:12px; left:0; width:5px; height:5px; background:var(--color); border-radius:50rem;}
.rule_article dd > ul > li + li {margin-top:4px;}

.rule_article a {color:var(--color); text-decoration:underline; word-break:break-all;}

@media screen and (min-width:769px) {
	.reg_head {grid-template-columns:repeat(3, 1fr);}
}

@media screen and (max-width:768px) {
	.rule_article > dl > dt {font-size:1.0625rem; padding:0.75rem 1rem;}
	.rule_article > dl > dd {padding:1rem 1.125rem; font-size:1rem;}
	.reg_head {padding:1.375rem;}
}