@charset "utf-8";
/* CSS Document */

@import url('https://cdn.jsdelivr.net/npm/yakuhanjp@4.0.1/dist/css/yakuhanmp_s.css');
@import url("css/basic.css");
@import url("css/box.css");
@import url("css/page.css");
@import url("css/header.css");
@import url("js/swiper-bundle.min.css");

/* 1. 단어 단위 줄바꿈은 전체적으로 적용 (디자인에 영향 적음) */
body {
    word-break: keep-all;
    overflow-wrap: break-word;
}

/* 2. 실제 '글자'가 담기는 태그들만 골라서 왼쪽 정렬 강제 적용 */
/* 이미지나 레이아웃 박스에는 영향을 주지 않도록 범위를 좁힙니다. */
p, li, dd, dt, .text-box, .description {
    text-align: left !important;
}

/* 3. 만약 버튼이나 타이틀까지 왼쪽으로 갔다면, 그 부분만 다시 중앙으로 돌려놓는 안전장치 */
h1, h2, h3, .button, .center-align {
    text-align: center;
}
img { display: block; margin-left: auto; margin-right: auto; }

/* 도구 일람 테이블 스타일 수정 */
/* 도구 일람 테이블 강제 다이어트 */
table {
    width: 300px !important;     /* 350보다 더 좁게, 300으로 강제 고정 */
    table-layout: fixed;         /* 중요! 칸 너비를 브라우저 계산이 아닌 CSS 설정대로 고정 */
    margin-left: auto !important;
    margin-right: auto !important;
    border-collapse: collapse;
}

/* 왼쪽 기종 이름 칸 */
table th, table td:first-child {
    width: 80px !important;      /* 칸을 80px로 확 줄임 */
    font-size: 13px !important;  /* 글자 크기를 확실히 줄임 */
    padding: 8px 5px !important;
    text-align: center;
}

/* 오른쪽 설명 칸 */
table td:last-child {
    font-size: 12px !important;  /* 본문 글자도 작게 조정 */
    padding: 10px !important;
    line-height: 1.4 !important;
    word-break: keep-all !important;
}