@charset "UTF-8";

/**
 * Trytech Theme - Extras
 *
 * 旧サイトCSSに含まれていない、本WP化で追加した要素のスタイルのみ。
 * 旧サイトの style.css / trytech_style.css の後に読み込まれます。
 */

/* ============================================================
   言語スイッチャー（日本語/English）の統一スタイル
   静的HTMLとWordPress動的ページで見た目を同じにする
   ============================================================ */
/* 1220px以上（PC表示）: 右上に絶対配置 */
@media (min-width: 1220px) {
	#nav_lang {
		position: absolute;
		top: 16px;
		right: 30px;
		font-size: 0.9rem;
		margin: 0;
		padding: 0;
		list-style: none;
		display: flex;
	}
	#nav_lang li {
		display: inline-block;
	}
	#nav_lang .nav-link {
		padding: 4px 10px;
		color: #000;
	}
	#nav_lang .nav-link.disabled {
		color: #808080;
	}
}

/* ============================================================
   ヘッダーが container 幅で中央寄せにならないよう、
   container-fluid を画面全幅にする
   旧style.cssの @media (min-width:1200px) で position:fixed が指定されているが、
   フォールバックとして全幅指定を強制
   ============================================================ */
#headmenu .container-fluid {
	width: 100%;
	max-width: 100%;
	background: #fff;
}

/* ============================================================
   PC表示時のヘッダーフォントサイズを旧サイトに合わせる
   ============================================================ */
@media (min-width: 1200px) {
	#nav_main .nav-link {
		font-size: 16px;
		padding: 0.5rem 1rem;
	}
	#nav_home .material-icons-outlined {
		font-size: 24px;
		color: #007bff;
	}
}

/* ============================================================
   ドロップダウンメニュー（マウスオーバー時）のフォント整形
   ============================================================ */
.dropdown-nav .dropdown-item {
	font-size: 14px;
	padding: 8px 16px;
	color: #212529;
}
.dropdown-nav .dropdown-item:hover {
	background: #f6faff;
	color: #007bff;
}

/* マウスオーバー時にドロップダウンを表示 */
@media (min-width: 1200px) {
	#nav_main .nav-item.dropdown:hover > .dropdown-nav {
		display: block;
	}
}

/* ============================================================
   ヘッダー領域とメインビジュアルの間隔調整
   #headmenu の height: 120px で既にヘッダー領域を確保しているため、
   メインビジュアル側に追加マージンは不要
   ============================================================ */
@media (min-width: 1200px) {
	body {
		padding-top: 0;
	}
	/* #home_carousel の上余白は不要。#headmenu の高さで自然に確保される */
}

/* ============================================================
   ニュースフィルター
   ============================================================ */
.news_filter {
	list-style: none;
	margin: 0 0 20px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: center;
}
.news_filter li a {
	display: inline-block;
	padding: 4px 16px;
	border: 1px solid #45a1f7;
	border-radius: 25px;
	color: #45a1f7;
	text-decoration: none;
	font-size: 90%;
	transition: all 0.3s ease;
}
.news_filter li a:hover,
.news_filter li.active a {
	background: #45a1f7;
	color: #fff;
	text-decoration: none;
}

/* ============================================================
   ニュースメタ情報（詳細ページ）
   ============================================================ */
.news_meta {
	margin: 20px 0;
}
.news_meta time {
	margin-left: 10px;
	color: #666;
}

/* ============================================================
   ニュースカテゴリの色付け（旧style.css の news_IR を小文字スラッグでも適用）
   WordPressがスラッグを自動的に小文字化するため、news_ir として出力される
   ============================================================ */
.news_ir {
	display: inline-block;
	background: #1343bd;
	color: #fff;
	text-align: center;
	width: 6em;
	margin-right: 2em;
}
.news_media {
	display: inline-block;
	background: #394354;
	color: #fff;
	text-align: center;
	width: 6em;
	margin-right: 2em;
}

/* ============================================================
   ニュース一覧ページ（左サイドメニュー）レイアウト調整
   ============================================================ */
.page_news .container .row > aside.col-lg-3 {
	padding-top: 1em;
}
.page_news .container .row > article.col-lg-9 {
	padding-top: 0.5em;
}
.page_news .news_list {
	list-style: none;
	padding: 0;
	margin: 1em 0;
}
.page_news .news_list > li {
	padding: 0.8em 0;
	border-bottom: 1px solid #e5e5e5;
	line-height: 1.6;
}
.page_news .news_list > li:first-child {
	border-top: 1px solid #e5e5e5;
}
.page_news .page_title {
	font-size: 180%;
	font-weight: bold;
	margin-bottom: 0.5em;
}

/* ニュース一覧の各行: ラベル＋日付＋タイトル */
.page_news .news_list > li > span[class^="news_"] {
	display: inline-block;
	vertical-align: middle;
}
.page_news .news_list > li > a {
	color: #007bff;
	text-decoration: none;
	margin-left: 0.5em;
}
.page_news .news_list > li > a:hover {
	text-decoration: underline;
}

/* ============================================================
   動画エリア（タイトルと埋め込みの隙間を最小化・最終版）
   詳細度を上げて、style.css の .title_blue 影響を排除
   ============================================================ */
.col-md-7 div.movie_area,
.product-main div.movie_area,
div.movie_area {
	margin: 20px 0 0 0;
	padding: 0;
}
.col-md-7 div.movie_area:first-of-type,
div.movie_area:first-of-type {
	margin-top: 15px;
}
/* 動画タイトル: 高い詳細度で旧.title_blueの影響を完全排除 */
.col-md-7 .movie_area p.movie_title,
.product-main .movie_area p.movie_title,
.movie_area > p.movie_title,
p.movie_title {
	font-size: 100% !important;
	color: #3165b5 !important;
	font-weight: bold !important;
	margin: 0 0 4px 0 !important;
	padding: 0 !important;
	line-height: 1.4 !important;
	display: block !important;
}
.movie_area iframe,
.movie_area > iframe {
	max-width: 100% !important;
	width: 100% !important;
	aspect-ratio: 16 / 9 !important;
	display: block !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	vertical-align: top !important;
}
/* wpautopによる空タグを除去 */
.movie_area > p:empty,
.movie_area > br,
.movie_area > br + br {
	display: none !important;
}

/* ============================================================
   キャッチコピー
   ============================================================ */
.catch {
	font-weight: bold;
	color: #45a1f7;
	margin-bottom: 15px;
}

/* ============================================================
   採用情報用テーブル間の余白
   ============================================================ */
.recruit_lead,
.recruit_extra {
	margin: 15px 0;
}

/* ============================================================
   ページネーション
   ============================================================ */
.pagination_wrap {
	margin: 30px 0;
}
.pagination_wrap .page-numbers {
	display: inline-block;
	padding: 6px 14px;
	margin: 0 3px;
	border: 1px solid #ccc;
	border-radius: 4px;
	color: #333;
	text-decoration: none;
}
.pagination_wrap .page-numbers.current,
.pagination_wrap .page-numbers:hover {
	background: #45a1f7;
	border-color: #45a1f7;
	color: #fff;
	text-decoration: none;
}

/* ============================================================
   WordPress管理バー対策（管理者ログイン中の表示崩れ防止）
   ============================================================ */
.admin-bar #headmenu .container-fluid {
	top: 32px;
}
@media (max-width: 782px) {
	.admin-bar #headmenu .container-fluid {
		top: 46px;
	}
}