@charset "utf-8";
/*ベーススタイル設定
1.clearfix,clear
2.font
3.float
4.text-align
5.margin
6.padding
***************************/
/*1. clearfix,clear */

/* For modern browsers */
.clearfix:before,
.clearfix:after {
	content:"";
	display:block;
	overflow:hidden;
}
.clearfix:after {
	clear:both;
}
/* For IE 6/7 (trigger hasLayout) */
.clearfix {
	zoom:1;
}
.clear {
	clear:both;
}
/*2. font */
.fw_b {font-weight: bold;}
.fs10{font-size:10px;}
.fs12{font-size:12px;}
.fs14{font-size:14px;}
.fp80{font-size:80%;}
.fp90{font-size:90%;}
/*3. float */
.f_L {float: left;}
.f_R {float: right;}
/*4. text-align */
.t_R {text-align: right;}
.t_L {text-align: left;}
.t_C {text-align: center;}
/*5. margin */
.m0 {margin: 0}
.mb5 {margin: 0 0 5px}
.mb10 {margin: 0 0 10px}
.mb15 {margin: 0 0 15px}
.mb20 {margin: 0 0 20px}
.mb30 {margin: 0 0 30px}
.mt5 {margin: 5px 0 0px}
.mt10 {margin: 10px 0 0px}
.mt15 {margin: 15px 0 0px}
.mt20 {margin: 20px 0 0px}
.mt30 {margin: 30px 0 0px}
.mt40 {margin: 30px 0 0px}
.ml5 {margin: 0 0 0 5px}
.ml10 {margin: 0 0 0 10px}
.ml15 {margin: 0 0 0 15px}
.ml20 {margin: 0 0 0 20px}
.ml30 {margin: 0 0 0 30px}
.mr5 {margin: 0 5px 0 0}
.mr10 {margin: 0 10px 0 0}
.mr15 {margin: 0 15px 0 0}
.mr20 {margin: 0 20px 0 0}
.mr30 {margin: 0 30px 0 0}
.mlr5 {margin: 0 5px;}
.mlr10 {margin: 0 10px;}
.mlr15 {margin: 0 15px;}
.mlr20 {margin: 0 20px;}
.mlrb{margin:0 40px 40px 40px;width:880px;}
/*6. padding */
.p0 {padding: 0;}
.plr5 {padding: 0 5px;}
.plr10 {padding: 0 10px;}
.plr15 {padding: 0 15px;}
.plr20 {padding: 0 20px;}
.ptb10 {padding: 10px 0;}
.ptb20 {padding: 20px 0;}
.pall10 {padding: 10px;}
.pall20 {padding: 20px;}

/* 月別アーカイブ絞り込み中の表示（お知らせ・コラム一覧） */
.archive_filter_notice {
	background-color: #eee;
	padding: 10px 15px;
	margin: 0 0 20px;
	font-size: 14px;
}
.archive_filter_notice a {
	margin-left: 15px;
	color: #007abf;
}

/* ==========================================================
   Contact Form 7 対応（/contact/, /document/）
   contents.css の .inquiry_form 系デザインは旧来の生HTMLフォーム
   （input[name="input[xxx]"], class="owlet-input-name-sei" 等）を
   前提にしていたが、CF7は各項目を <p><span class="wpcf7-form-control-wrap"
   data-name="..."><input ...></span></p> という構造で出力し、name属性も
   フォームタグ名（company, name-sei, tel1 等）に変わる。
   そのため、CF7の実際の出力クラス・name属性に合わせて幅・余白を再指定する。
   ========================================================== */

/* CF7が各項目をpタグで自動的に囲むため、余分な行間を打ち消す */
.inquiry_form table tr td > p,
.inquiry_form table tr th > p,
.inquiry_form .owlet-input-sample p {
	margin: 0;
}

/* input各種（CF7はtype="text"以外にemail/tel/url/numberを使用する） */
.inquiry_form input[type="text"],
.inquiry_form input[type="email"],
.inquiry_form input[type="tel"],
.inquiry_form input[type="url"],
.inquiry_form input[type="number"] {
	line-height: 1.2;
	padding: 2px 4px;
	border: 1px solid #a4a4a4;
}

/* 会社名/屋号・部署/役職 */
.inquiry_form input[name="company"],
.inquiry_form input[name="department"] {
	width: 200px;
}

/* お名前・フリガナ（姓・名）2分割項目 */
.inquiry_form input[name="name-sei"],
.inquiry_form input[name="name-mei"],
.inquiry_form input[name="furigana-sei"],
.inquiry_form input[name="furigana-mei"] {
	width: 90px;
	margin: 0 5px;
}
/* CF7はテンプレート内の改行を <br> に変換するため、姓・名の間に入る
   意図しない改行を打ち消して横並びにする */
.inquiry_form td:has(input[name="name-sei"]) br,
.inquiry_form td:has(input[name="furigana-sei"]) br {
	display: none;
}

/* 電話番号・FAX番号（3分割）項目 */
.inquiry_form input[name="tel1"],
.inquiry_form input[name="tel2"],
.inquiry_form input[name="tel3"],
.inquiry_form input[name="fax1"],
.inquiry_form input[name="fax2"],
.inquiry_form input[name="fax3"] {
	width: 60px;
}
.inquiry_form input[name="tel2"],
.inquiry_form input[name="tel3"],
.inquiry_form input[name="fax2"],
.inquiry_form input[name="fax3"] {
	margin-left: 5px;
}

/* メールアドレス・URL */
.inquiry_form input[name="your-email"],
.inquiry_form input[name="your-url"] {
	width: 300px;
}

/* マイナンバー管理人数：入力欄と単位「人」を同じ行に、
   「人数をご入力ください」はその下・左揃えに表示する。
   td に display:flex を使うと td が table-cell でなくなり、
   罫線が二重に見えたり tr いっぱいに広がらなくなるため、
   display は変更せず、中身の要素を inline化して対応する。 */
.inquiry_form input[name="mynumber"] {
	width: 80px;
}
.inquiry_form td:has(input[name="mynumber"]) > p {
	display: inline;
	margin: 0;
}
.inquiry_form td:has(input[name="mynumber"]) .owlet-input-sample {
	display: inline;
	margin-left: 6px;
}
.inquiry_form td:has(input[name="mynumber"]) .owlet-input-sample p:first-child {
	display: inline;
	margin: 0;
}
.inquiry_form td:has(input[name="mynumber"]) .owlet-input-sample p:last-child {
	display: block;
	text-align: left;
	margin: 4px 0 0;
}

/* 入力エラー時のツールチップ表示 */
.inquiry_form .wpcf7-not-valid-tip {
	display: block;
	font-size: 12px;
	margin-top: 4px;
}

/* 送信完了・エラー等のレスポンス表示がフォーム幅からはみ出さないように */
.inquiry_form .wpcf7-response-output {
	max-width: 100%;
	box-sizing: border-box;
}

/* 確認ボタンのチラつき対策。
   .owl-img-roll は owl.js の mouseenter/mouseleave で src の
   "roll_off" を "roll_on" に入れ替えるが、この確認ボタンには
   roll_on 画像が存在しないため、hover時に画像が読み込みエラーとなり
   要素サイズが変化 → カーソルが境界を跨いで mouseenter/mouseleave が
   連続発火 → チラつく、という状態になっていた。
   画像の実サイズ(200x65)を明示的に固定し、読み込み失敗時もサイズが
   変化しないようにする。 */
.form_button input[type="image"].owl-img-roll {
	width: 200px;
	height: 65px;
	cursor: pointer;
}

/* ==========================================================
   Lightbox（Lightbox v2.7.1 / _lib/lightbox）の
   閉じる・前へ・次へアイコンが表示されない問題への対応。
   lightbox.css は各アイコンを ../img/close.png 等の背景画像として
   読み込むが、これは _lib/lightbox/css/lightbox.css からの相対パス
   なので _lib/lightbox/img/ を参照する。しかしこのディレクトリ自体が
   存在せず常に404になっており、アイコンが表示されない
   （テーマ直下の img/ フォルダは無関係で、そちらも中身が0バイトの
   ダミーファイルだった）。
   画像に依存せず、CSSのcontentで記号を描画して代替する。
   ========================================================== */
.lb-data .lb-close {
	background-image: none;
	width: 40px;
	height: 40px;
	font-size: 40px;
	line-height: 38px;
	color: #fff;
	text-align: center;
	text-decoration: none;
	/* lightbox.cssの既定値 opacity:0.7 のままだと薄く見えるため、
	   通常時から完全不透明にする */
	opacity: 1;
	filter: none;
}
.lb-data .lb-close::after {
	content: "\00d7";
}
.lb-data .lb-close:hover,
.lb-data .lb-close:visited,
.lb-data .lb-close:active {
	color: #fff;
	opacity: 0.8;
	text-decoration: none;
}

/* 前へ・次へは画像の内側ではなく外側（左右）に配置する。
   .lb-nav は画像と同じ大きさで position:absolute になっているため、
   その内側にある .lb-prev/.lb-next も position:absolute にして
   負のleft/rightで画像の外側へはみ出させる。 */
.lb-nav a.lb-prev,
.lb-nav a.lb-next {
	position: absolute;
	top: 0;
	float: none;
	width: 50px;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: none;
	background-color: transparent;
	font-size: 40px;
	line-height: 1;
	color: #fff;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.8);
	text-decoration: none;
	/* lightbox.cssの既定値 opacity:0 は画像に重ねるアイコン用の
	   hover演出（通常時は透明、hoverで見える）だが、画像の外側に
	   矢印記号を常設する今回の形では、通常時から不透明にする */
	opacity: 1;
	filter: none;
}
.lb-nav a.lb-prev {
	left: -60px;
}
.lb-nav a.lb-next {
	right: -60px;
}
.lb-nav a.lb-prev::after {
	content: "\2039";
}
.lb-nav a.lb-next::after {
	content: "\203a";
}
.lb-nav a.lb-prev:hover,
.lb-nav a.lb-next:hover,
.lb-nav a.lb-prev:visited,
.lb-nav a.lb-next:visited,
.lb-nav a.lb-prev:active,
.lb-nav a.lb-next:active {
	color: #fff;
	opacity: 0.8;
	text-decoration: none;
}