@charset "utf-8";
/* 사이트 공통 커스텀 (head.sub.php 에서 마지막에 로드) */

/* 기본 폰트 : Noto Serif JP (Google Fonts 는 head.sub.php 에서 로드) */
html, body, div, li, ul, ol, p, dl, dt, dd, h1, h2, h3, h4, h5, h6, th, td,
a, span, label, strong, b, em, input, button, textarea, select {
	font-family: 'Noto Serif JP', 'Hiragino Mincho ProN', 'Yu Mincho', serif;
}
/* 테마 CSS 에서 클래스 단위로 Pretendard JP 를 지정한 부분 */
html body .index-content .title_wrap h2,
html body .index-content .title_wrap p,
html body .index-content .section-05 .title_wrap p,
html body .index-content .section-03 .title_wrap p,
html body .index-content .section-03 .title_wrap h2,
html body .s_visual_wrap .slide .content h1,
html body .s_visual_wrap .slide .content p,
html body #section_01 table {
	font-family: 'Noto Serif JP', 'Hiragino Mincho ProN', 'Yu Mincho', serif;
}

/* 메인 배너 : 배경 이미지 + 텍스트 (텍스트 크기·위치는 배너 폭 기준 cqw) */
.top_banner {
	position: relative;
	display: block;
	container-type: inline-size;
}
.top_banner img {
	display: block;
	width: 100%;
}
.top_banner .top_banner_txt {
	position: absolute;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 500;
	color: #231815;
	white-space: nowrap;
	font-size: 14px;
}
.top_banner .top_banner_txt.company {
	top: 62%;
	font-size: 5.55cqw;
	line-height: 1.23;
}
.top_banner .top_banner_txt.catalog {
	left: 3.6%;
	top: 61.2%;
	font-size: 3.38cqw;
	line-height: 2.1;
}

/* 메인 : 最新情報 (글자 15.6px → 14.3px(-1pt), 기사 사이 구분선 점선) */
.index-content .latest-paper .notice .cate,
.index-content .latest-paper .notice .data,
.index-content .latest-paper h4.media-heading {
	font-size: 14.3px;
}
.index-content .latest-paper .media {
	border-bottom: 1px dotted #b5b5b5;
}

/* 메인 : 電子版カタログ 영역 */
.index-content .title_wrap h2.wc_lead {
	font-family: 'Noto Sans JP', sans-serif;
}
.index-content .title_wrap .wc_title {
	font-family: 'M PLUS Rounded 1c', sans-serif;
}
.index-content .title_wrap .wc_sub {
	font-family: 'Questrial', sans-serif;
	font-weight: 600;
}
.index-content button.button_top1,
.index-content button.button_top2,
.index-content button.button_top3,
.index-content button.button_top4 {
	font-family: 'Noto Sans JP', sans-serif;
}

/* 메인 : 製品選定のお問合せ 영역 (제목, 営業部 이름·전화·팩스) */
.index-content .title_wrap h2.contact_lead,
.index-content .contact_tel div,
.index-content .contact_tel span {
	font-family: 'Noto Sans JP', sans-serif;
}

/* 메인 슬라이드 : 화면 꽉 채움 → 콘텐츠 폭(카테고리 타일과 동일), 가로 슬라이드 */
.index_swiper_wrap {
	padding-top: 80px;	/* 고정 헤더 높이만큼 (tail.php 스크립트에서 실제 헤더 높이로 보정) */
}
#index_swiper.swiper-container {
	height: auto;
	max-height: none;
	aspect-ratio: 2.425 / 1;	/* 시안 비율 873 x 360 (이미지 slide_0N.jpg 도 같은 비율로 잘라 둠) */
	container-type: inline-size;
}
#index_swiper.swiper-container .swiper-wrapper .swiper-slide .slide-1 {
	background-position: center center;
}
/* 글자 위치 : 슬라이드별 top(%) / padding-left(%) 는 head.php 의 $main_slides 에서 지정 */
#index_swiper.swiper-container .swiper-content {
	transform: translateY(-50%);	/* top = 글자 덩어리의 세로 가운데 */
	z-index: 10;
}
#index_swiper.swiper-container .swiper-content.txt_top {
	transform: none;	/* top = 글자 윗변 */
}
#index_swiper .swiper_txt {
	padding-right: 3%;
	text-align: left !important;
}
#index_swiper .h2_002 {
	margin: 0px;
	font-size: max(12px, 2.65cqw);	/* PC 약 22px */
	line-height: 1.5;
	text-align: left !important;
}
#index_swiper .h2_002.txt_big {
	font-size: max(14px, 3.1cqw);	/* PC 약 26px */
}
/* 페이지 점 : 하단 가운데 (테마 CSS 가 !important 로 막대 모양/숨김 처리해 둠) */
#index_swiper .swiper-pagination {
	display: block !important;
	position: absolute !important;
	left: 0px !important;
	right: 0px !important;
	bottom: 10px !important;
	top: auto !important;
	width: 100% !important;
	margin: 0px !important;
	text-align: center !important;
	line-height: 0;
	z-index: 10 !important;
}
#index_swiper .swiper-pagination-bullet {
	display: inline-block;
	width: 9px !important;
	height: 9px !important;
	padding: 0px !important;
	margin: 0px 5px !important;
	border-radius: 50% !important;
	line-height: 0 !important;
	background-color: rgba(255, 255, 255, 0.5) !important;
}
#index_swiper .swiper-pagination-bullet:before {
	display: none;
}
#index_swiper .swiper-pagination-bullet-active {
	background-color: #fff !important;
}

/* 상품 페이지 : 이미지 위에 겹쳐 있던 문구 → 이미지 아래 왼쪽 정렬 (상품 index.php 의 .p_catch) */
#section_01 .p_catch {
	margin: 18px 0px 30px 0px;
	padding: 2px 0px 2px 14px;
	border-left: 4px solid #0a75bd;	/* 상품명 제목 바와 같은 계열 */
	text-align: left;
}
#section_01 .p_catch_main {
	font-size: 1.3em;
	font-weight: 700;
	line-height: 1.6;
	color: #1a1a1a;
}
#section_01 .p_catch_sub {
	margin-top: 6px;
	font-size: 1.1em;
	line-height: 1.6;
	color: #444;
}

/* 상품 페이지 : 모델명 번호 박스 검은색 */
.div_num {
	background-color: #000;
}
/* 상품 페이지 소제목 (製品特徴 / 図面 / 製品写真 / 製品仕様 …) : 카탈로그 스타일
   ▌굵은 세로 막대 + 굵은 제목 + 보조 문구, 아래 가는 회색 선 */
#section_01 h2 {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 1.2em;
	line-height: 1.4;
	padding-bottom: 8px;
	margin-bottom: 14px;
	border-bottom: 1px solid #a7a7a7;
}
#section_01 h2 .span_s_002 {
	font-family: 'Noto Sans JP', sans-serif;
	background-color: transparent;
	border: 0px;
	border-left: 5px solid #231815;
	padding: 0px 0px 0px 12px;
	color: #231815;
	font-weight: 700;
}
#section_01 h2 .span_s_003 {
	font-family: 'Noto Sans JP', sans-serif;
	background-color: transparent;
	border: 0px;
	padding: 0px;
	margin-left: 4px;
	color: #231815;
	font-weight: 400;
	font-size: 0.85em;
}

/* 상품 페이지 : 配線出し位置 등 부품 사진 — 상자로 감싸고 아래에 부품명 (①… 흰 바탕 검정 글씨, 왼쪽 정렬) */
#section_01 .wiring_box {
	border: 1px solid #6d6e71;
	background-color: #fff;
	margin-bottom: 20px;
}
#section_01 .wiring_box img {
	display: block;
	width: 100%;
}
#section_01 .wiring_box .wiring_name {
	border-top: 1px solid #6d6e71;
	padding: 6px 10px;
	background-color: #fff;
	color: #000;
	text-align: left;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 0.95em;
	line-height: 1.4;
}

/* 상품 사양 표 : 카탈로그 스타일 (상품 페이지 전체 table.spec_tbl)
   위·아래(1px) / 머리 행 아래 / 왼쪽 열 오른쪽 = 실선, 나머지 = 점선, 좌우 바깥 테두리 없음 */
#section_01 table.spec_tbl {
	border-collapse: collapse;
	border-top: 1px solid #231815;
	border-bottom: 1px solid #231815;
	border-left: 0px;	/* 일부 표의 HTML border 속성 무효화 */
	border-right: 0px;
	font-family: 'Noto Sans JP', sans-serif;
}
#section_01 table.spec_tbl th,
#section_01 table.spec_tbl td {
	font-family: 'Noto Sans JP', sans-serif;
	background-color: #fff;
	color: #231815;
	font-weight: 400;
	border: 0px;
	border-bottom: 1px dotted #8a8a8a;
	border-left: 1px dotted #8a8a8a;
	padding: 9px 8px;
}
#section_01 table.spec_tbl tr > :first-child {
	border-left: 0px;
	border-right: 1px solid #231815;	/* 왼쪽 열(항목) 구분 = 실선 */
	text-align: left;
	padding-left: 14px;
	white-space: nowrap;
}
#section_01 table.spec_tbl tr.spec_head > * {
	border-bottom: 1px solid #231815;	/* 머리 행(項目｜仕様) 아래 = 실선 */
}
/* rowspan 으로 항목 칸이 위 줄에 걸쳐 있는 이어지는 줄 : 첫 칸은 데이터 칸 */
#section_01 table.spec_tbl tr.spec_cont > :first-child {
	border-left: 1px solid #231815;
	border-right: 1px dotted #8a8a8a;
	text-align: center;
	padding-left: 8px;
	white-space: normal;
}