@charset "utf-8";

/* 내용관리 */

#ctt header h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
.ctt_admin {position: fixed;top: 100px;right: 0;}

   
/* ============================================================
   내용관리(content.php) — 한글 테마에서 누락분 이식
   적용 범위: content.php basic 스킨 (다른 영역 영향 없음)
   ============================================================ */

/* 사업지원절차 (co_id=support) */
.sub-support .bar { width: 0px; height: 2px; background: #000; margin-bottom: 80px; transition: 0.5s; margin-top: 80px; }
.sub-support.on .bar, .sub-support .on .bar { width: 100%; }
#sub_page.sub-support h5 { transition-delay: 0.3s; }
.sub-support dl { margin-top: 40px; padding-left: 20px; }
.sub-support dl dt { position: relative; color: var(--point); font-weight: bold; margin-top: 30px; transform: translateX(-50px); transition: 0.5s; opacity: 0; }
.sub-support dl dt::before { position: absolute; content: ''; top: 50%; left: -20px; transform: translateY(-50%); display: block; width: 10px; height: 2px; background: var(--point); }
.sub-support dl dd { color: #888; margin-top: 10px; font-size: 16px; transform: translateX(-50px); transition: 0.5s; opacity: 0; }
.sub-support dl dd ul { gap: 35px; padding-top: 10px; flex-wrap: wrap; display: flex; }
.sub-support dl dd ul li { gap: 20px; text-align: center; align-items: center; display: flex; flex-direction: column; }
.sub-support dl dd ul li+li .cir::before { content: '>'; position: absolute; top: 50%; left: -50px; transform: translateY(-50%); font-size: 30px; color: #000; }
.sub-support dl dd ul li .cir { position: relative; width: 150px; height: 150px; border: 2px dashed #ddd; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 20px; }
.sub-support dl dd ul li span { color: #000; font-weight: bold; width: 100%; padding: 0 10px; }
.sub-support dl dd ul li:nth-last-child(1) .cir { border: 0; background: var(--point); }
.sub-support dl dd ul li:nth-last-child(1) span { color: #fff; }
.sub-support dl dd ul li em { font-size: 14px; width: 150px; }
.sub-support.on dl dt, .sub-support.on dl dd, .sub-support .on dl dt, .sub-support .on dl dd { opacity: 1; transform: translateY(0); }
.sub-support dl dt:nth-child(1), .sub-support dl dd:nth-child(2) { transition-delay: 0.4s; }
.sub-support dl dt:nth-child(3), .sub-support dl dd:nth-child(4) { transition-delay: 0.5s; }
.sub-support dl dt:nth-child(5), .sub-support dl dd:nth-child(6) { transition-delay: 0.6s; }
.sub-support dl dt:nth-child(7), .sub-support dl dd:nth-child(8) { transition-delay: 0.7s; }
.sub-support dl dt:nth-child(9), .sub-support dl dd:nth-child(10) { transition-delay: 0.8s; }
.sub-support dl dt:nth-child(11), .sub-support dl dd:nth-child(12) { transition-delay: 0.9s; }
.sub-support .btn-box { margin-top: 40px; opacity: 0; transition: 0.5s; transition-delay: 1s; transform: translateX(-50px); }
.sub-support.on .btn-box, .sub-support .on .btn-box { opacity: 1; transform: translateY(0); }
.sub-support .btn-box a { padding: 15px 30px; background: var(--point); color: #fff; border-radius: 30px; }

@media screen and (max-width: 1100px) {
    .sub-support dl dd ul { gap: 20px; justify-content: center; }
    .sub-support dl dd ul li .cir { width: 16vw; height: 16vw; }
    .sub-support dl dd ul li+li .cir::before { left: -33px; }
}
@media screen and (max-width: 600px) {
    .sub-support dl dd ul { flex-direction: column; align-items: center; gap: 50px; }
    .sub-support dl dd ul li { width: 200px; position: relative; }
    .sub-support dl dd ul li .cir { width: 150px; height: 150px; }
    .sub-support dl dd ul li+li .cir::before { display: none; }
    .sub-support dl dd ul li+li::before { content: '>'; position: absolute; top: -50px; left: 50%; transform: translateX(-50%) rotate(90deg); font-size: 30px; color: #000; }
}