@charset "UTF-8";
/*
    회사 개요 (/company)

    page-shell.css 위에 얹는다. 틀·제목·배경은 거기서 오고
    여기서는 이 페이지 안쪽 조판만 정의한다.
    배경이 어두워 흰 글자를 쓴다 — service.css·awards.css 와 같은 기준이다.
*/

.co_lead {
    max-width: 52em;
    margin: 0 0 1.6em;
    font-size: 17px;
    line-height: 1.9;
    color: rgba(255, 255, 255, .86);
}
.co_lead:last-of-type {
    margin-bottom: 0;
}
.co_lead a {
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid rgba(188, 178, 255, .5);
}
.co_lead a:hover,
.co_lead a:focus-visible {
    border-bottom-color: #bcb2ff;
}
.co_lead b {
    font-weight: 700;
}

/* 「이어서 볼 것」 절에만 남는다. 세 칸의 절 제목은 .shell_cell_t 가 받는다. */
.co_h2 {
    margin: 6rem 0 20px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .02em;
    color: #bcb2ff;
}

/* ---------- 회사 정보 (첫 칸) ----------
   3칼럼 중 한 칸 안에 들어가므로 이름과 값을 위아래로 쌓는다.
   가로 2단으로 두면 칸이 좁아 이름이 접힌다. */
.co_dl {
    margin: 0;
}
.co_dl dt {
    margin: 1.4rem 0 .3rem;
    font-size: 12px;
    color: rgba(255, 255, 255, .55);
}
.co_dl dt:first-child {
    margin-top: 0;
}
.co_dl dd {
    margin: 0;
    font-size: 14px;
    line-height: 1.75;
    color: rgba(255, 255, 255, .88);
}
.co_dl dd a {
    color: #bcb2ff;
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
.co_dl dd a:hover,
.co_dl dd a:focus-visible {
    border-bottom-color: currentColor;
}

/* ---------- 목록 ---------- */
.co_list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.co_list li {
    position: relative;
    margin: 0 0 1.1rem;
    padding-left: 1.4rem;
    font-size: 14px;
    line-height: 1.8;
    color: rgba(255, 255, 255, .8);
}
.co_list li:last-child {
    margin-bottom: 0;
}
/* 점은 글자가 아니라 표식이라 화면낭독기에서 읽히지 않게 가상요소로 둔다 */
.co_list li::before {
    content: "";
    position: absolute;
    left: .35rem;
    top: .85em;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #bcb2ff;
}
.co_list a {
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid rgba(188, 178, 255, .5);
}
.co_list a:hover,
.co_list a:focus-visible {
    border-bottom-color: #bcb2ff;
}
.co_list b {
    font-weight: 700;
    color: #fff;
}

/* ---------- 이어서 볼 것 ---------- */
.co_links {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: .8rem;
}
.co_links a {
    display: block;
    padding: 11px 20px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 999px;
    font-size: 14px;
    color: rgba(255, 255, 255, .82);
    text-decoration: none;
    transition: border-color .2s ease, color .2s ease;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}
.co_links a:hover,
.co_links a:focus-visible {
    border-color: rgba(188, 178, 255, .7);
    color: #fff;
}

@media (max-width: 768px) {
    .co_lead {
        font-size: 15px;
    }
    .co_dl dd,
    .co_list li {
        font-size: 14px;
    }
    .co_more {
        display: block;
        margin: .3rem 0 0;
    }
}
