https://www.city.kai.yamanashi.jp/ssi/js/base.js

1/*********************************************************************************
2全案件共通で使用する関数
3*********************************************************************************/
4
5// URL文字列エスケープ（escapeurl.js）
6/********************************************************************************/
7function htmlspecialchars_URL(str) {
8	return (str + '').replace(/"/g,'%26quot;')
9					.replace(/'/g,'%26#039;')
10					.replace(/</g,'%26lt;')
11					.replace(/>/g,'%26gt;')
12					.replace(/&/g,'&amp;');
13}
14
15// 要素の存在判定
16/*********************************************************************************
17	概要：
18		要素の存在判定
19	使用例：
20		if(domExistCheck(elements)) {
21			要素がすべて存在するときの処理
22		}
23	引数：
24		配列を渡します。
25		例1）要素が一つのとき
26			let element1 = document.querySelector("#main");
27			let elements = [element1];
28			if(domExistCheck(elements)){
29				// element1が存在する時
30			}
31			または
32			if(domExistCheck([element1])){
33				element1があるとき
34			}
35		例2）要素が複数のとき
36			let spMenuElement = document.querySelector('#spm_menu');
37			let targetElement = document.querySelector('#container');
38			let existChk = [spMenuElement, targetElement];
39			if(domExistCheck(elements)){
40				// #spm_menuと#containerが両方とも存在する時
41			}
42	返り値：
43		すべての要素が存在すれば true,要素が一つでも存在しなければ falseを返します。
44*********************************************************************************/
45function domExistCheck(elements) {
46	return elements.every(element => element);
47}
48
49// セッションストレージ可否判定
50/*********************************************************************************
51	概要：
52		セッションストレージ使用可不可の判定
53	使用例：
54		isSessionStorageAvailable();
55	引数
56		無し
57	返り値：
58		true または falase
59	詳細：
60		セッションストレージを使用できる環境かどうかの判定。
61		使用できる環境であればtrue,使用できなければfalseを返します。
62*********************************************************************************/
63function isSessionStorageAvailable() {
64	try {
65		const test = '__sessionStorage__';
66		sessionStorage.setItem(test, test);
67		sessionStorage.removeItem(test);
68		return true;
69	} catch (e) {
70		return false;
71	}
72}
73
74// 通常の文字サイズで印刷
75/*********************************************************************************
76	概要：
77		印刷用ページ表示
78	使用例：
79		print_normal();
80		<a id="print_mode_link" href="javascript:print_normal();">印刷ページ表示</a>
81	引数
82		無し
83	詳細：
84		- bodyおよび#print_mode_linkにクラスview_print_modeを追加する。
85		  その際、テキストの内容を通常ページへの案内テキストに書き換える。
86		- /ssi/css/print-preview.css をheadに読み込み/削除
87*********************************************************************************/
88function print_normal() {
89	const bodyElement = document.body;
90	const headElement = document.head;
91	const printLinkElement = document.querySelector('#print_mode_link');
92
93	if (!printLinkElement) {
94		return;
95	}
96
97	const isPrintMode = printLinkElement.classList.contains('view_print_mode');
98	const printCssElement = document.querySelector('link[href*="print-preview.css"]');
99
100	const printLinkText = isPrintMode ? '印刷ページ表示' : '通常ページへ戻る';
101	printLinkElement.textContent = printLinkText;
102
103	if (isPrintMode) {
104		// 通常ページへ戻る処理
105		initColorMode();
106		printCssElement?.remove(); 
107		bodyElement.classList.remove('view_print_mode');
108		printLinkElement.classList.remove('view_print_mode');
109	} else {
110		// 印刷ページへ進む処理
111		initColorMode(true); 
112		const link = document.createElement('link');
113		link.rel = 'stylesheet';
114		link.href = '/ssi/css/print-preview.css';
115		headElement.append(link);
116		bodyElement.classList.add('view_print_mode');
117		printLinkElement.classList.add('view_print_mode');
118	}
119	window.scroll({ top: 0 });
120}
121
122// 色変更
123/*********************************************************************************
124	概要：
125		背景色変更
126	使用例・詳細：
127		colorChange('blue');
128			- 青（bodyにクラス color_change,color_blue が追加される）
129		colorChange('black');
130			- 黒（bodyにクラス color_change,color_black が追加される）
131
132		colorChange();
133		colorChange('init');
134		colorChange('white');
135			- 上記は3つとも、通常のページに初期化。
136*********************************************************************************/
137function colorChange(strColorMode = 'init') {
138	const bodyElement = document.querySelector('body');
139	const headElement = document.querySelector('head');
140	const colorCssElement = document.querySelector('link[href*="/ssi/css/color-"]');
141	colorCssElement?.remove(); // 存在すれば削除
142
143	bodyElement.classList.remove('color_change','color_blue','color_black');
144	switch (strColorMode) {
145		case 'blue':
146			bodyElement.classList.add('color_change','color_blue');
147			headElement.insertAdjacentHTML('beforeend', '<link rel="stylesheet" href="/ssi/css/color-common.css" media="screen">');
148			if (isSessionStorageAvailable()) {
149				sessionStorage.setItem('colorMode', 'blue');
150			}
151			break;
152		case 'black':
153			bodyElement.classList.add('color_change','color_black');
154			headElement.insertAdjacentHTML('beforeend', '<link rel="stylesheet" href="/ssi/css/color-common.css" media="screen">');
155			if (isSessionStorageAvailable()) {
156				sessionStorage.setItem('colorMode', 'black');
157			}
158			break;
159		case 'white':
160		case 'init':
161		default:
162			if (isSessionStorageAvailable()) {

163				sessionStorage.removeItem('colorMode');
164			}
165			break;
166	}
167}
168
169// 色変更されていれば、ページ読み込み時にそれを反映
170/*********************************************************************************
171	概要：
172		背景色変更の読み込み
173	使用例・詳細：
174		initColorMode();
175			- ページ読み込み時に、設定されている背景色変更を適用
176		initColorMode(0);
177			- 背景色変更を初期化（保存はされず、ページ遷移・再読み込み等で再び背景色が適用される。
178			印刷ページ表示など、一時的に背景色を初期化したいときに使用。
179*********************************************************************************/
180function initColorMode(arg) {
181	if (arg == 0) {
182		// 背景色の一時的な初期化
183		const colorCssElement = document.querySelector('link[href*="/ssi/css/color-"]');
184		colorCssElement?.remove(); // 存在すれば削除
185	} else {
186		// 設定されている背景色を読み込み
187		if( isSessionStorageAvailable()) {
188			if(sessionStorage.getItem('colorMode')){
189				colorChange(sessionStorage.getItem('colorMode'));
190			}
191		}
192	}
193}
194
195// 色変更（前スクリプトとの互換性保持）
196/*********************************************************************************
197	概要：
198		背景色変更
199		※古いバージョンのCMSと互換性を保つために関数名を同じにしている。
200	使用例・詳細：
201		<a id="haikei_white" href="javascript:SetCss(1);" title="背景色を白色に変更する">白</a>
202		<a id="haikei_black" href="javascript:SetCss(2);" title="背景色を黒色に変更する">黒</a>
203		<a id="haikei_blue" href="javascript:SetCss(3);" title="背景色を青色に変更する">青</a>
204		SetCss(1); → 背景色を白色にする。（標準）
205		SetCss(2); → 背景色を黒色にする。（標準）
206		SetCss(3); → 背景色を青色にする。（標準）
207		SetCss();  → 背景色を白色にする。（引数を省略したときは1を代入）
208	引数：
209		半角数値（1～3）
210		デフォルトは1。
211	返り値：
212		無し
213*********************************************************************************/
214function SetCss(cssNumber = 1) {
215	switch (cssNumber) {
216		case 1:  colorChange('white');break;
217		case 2:  colorChange('black');break;
218		case 3:  colorChange('blue');break;
219		default: break;
220	}
221}
222
223// 文字サイズ変更
224/*********************************************************************************
225	概要：
226		文字サイズを変更する。
227		拡大は3回まで。（変更する場合はmaxFontSizeStepの値を変えてください）
228	使用例：
229		fontSizeChange('large'); → - 文字を大きくする。
230		fontSizeChange('small'); → - 文字を小さくする。
231		fontSizeChange(); → - 文字サイズを初期化（引数がない場合は、default が適用される。）
232		fontSizeChange('default'); → - 文字サイズ変更を初期化
233	引数：
234		'large' , 'small' , 'default'
235	返り値：
236		無し
237*********************************************************************************/
238function fontSizeChange(changeType = 'default') {
239	const stepNum = 1.25; // 拡大率
240	const maxFontSizeStep = 3; // 拡大を押せる最大回数
241	const bodyElement = document.querySelector('body');
242	let classChk = bodyElement.classList.contains('font_size_changed'); // 存在すればtrue,存在しなければfalseが返ってくる
243	let htmlElement = document.querySelector('html');
244	let htmlSTyle = window.getComputedStyle(htmlElement);
245	let currentFontSize = 10;
246	// const maxFontSize = 20;
247	// const minFontSize = 10;
248	let fontSizeStep = 0;
249	const fontSizeLargeButton = document.querySelector('#moji_large');
250	const fontSizeSmallButton = document.querySelector('#moji_small');
251
252	if (fontSizeLargeButton !== null) {
253		// フォント拡大回数の読み込み
254		if (isSessionStorageAvailable() && sessionStorage.getItem('fontSizeStep')) {
255			fontSizeStep = parseInt(sessionStorage.getItem('fontSizeStep'));
256		}
257
258		switch(changeType) {
259			case 'large':
260				currentFontSize = parseInt(htmlSTyle.getPropertyValue('font-size'));

261				currentFontSize = currentFontSize * stepNum;
262				fontSizeStep = fontSizeStep + 1;
263				if (fontSizeStep <= maxFontSizeStep) {
264					htmlElement.style.fontSize = currentFontSize + 'px';
265					if (isSessionStorageAvailable()) {
266						sessionStorage.setItem('fontSize', currentFontSize);
267						sessionStorage.setItem('fontSizeStep', fontSizeStep);
268					}
269				} else {
270					break;
271				}
272				if (!classChk) {
273					bodyElement.classList.add('font_size_changed');
274				}
275				break;
276			case 'small':
277				currentFontSize = parseInt(htmlSTyle.getPropertyValue('font-size'));
278				currentFontSize = currentFontSize / stepNum;
279				fontSizeStep = fontSizeStep - 1;
280				if (fontSizeStep > 0) {
281					htmlElement.style.fontSize = currentFontSize + 'px';
282					if (isSessionStorageAvailable()) {
283						sessionStorage.setItem('fontSize', currentFontSize);
284						sessionStorage.setItem('fontSizeStep', fontSizeStep);
285					}
286				} else if (fontSizeStep == 0) {
287					htmlElement.style.fontSize = '';
288					if (isSessionStorageAvailable()) {
289						sessionStorage.removeItem('fontSize');
290						sessionStorage.removeItem('fontSizeStep');
291					}
292					if (fontSizeSmallButton !== null) {
293						fontSizeSmallButton.inert = true;
294						fontSizeSmallButton.setAttribute('aria-disabled', 'true');
295					}
296				} else {
297					break;
298				}
299				if (typeof classChk !== 'undefined') {
300					bodyElement.classList.add('font_size_changed');
301				}
302				break;
303			case 'default':
304			default:
305				htmlElement.style.fontSize = '';
306				if (isSessionStorageAvailable()) {
307					sessionStorage.removeItem('fontSize');
308					sessionStorage.removeItem('fontSizeStep');
309				}
310				if (fontSizeSmallButton !== null) {
311					fontSizeSmallButton.inert = true;
312					fontSizeSmallButton.setAttribute('aria-disabled', 'true');
313
314				}
315				fontSizeLargeButton.inert = false;
316				fontSizeLargeButton.removeAttribute('aria-disabled');
317				fontSizeStep = 0;
318				if (typeof classChk !== 'undefined') {
319					bodyElement.classList.remove('font_size_changed','font_size_limit_max');
320				}
321				break;
322		}
323		// 拡大が最大回数の時にinert属性とクラスを追加
324		if (fontSizeStep >= maxFontSizeStep) {
325			fontSizeLargeButton.inert = true;
326			fontSizeLargeButton.setAttribute('aria-disabled', 'true');
327			bodyElement.classList.add('font_size_limit_max');
328		} else {
329			fontSizeLargeButton.inert = false;
330			fontSizeLargeButton.removeAttribute('aria-disabled');
331
332		}
333		// 縮小ボタン
334		if (fontSizeStep <= 0) {
335			if (fontSizeSmallButton !== null) {
336				fontSizeSmallButton.inert = true;
337				fontSizeSmallButton.setAttribute('aria-disabled', 'true');
338			}
339		} else {
340			if (fontSizeSmallButton !== null) {
341				fontSizeSmallButton.inert = false;
342				fontSizeSmallButton.removeAttribute('aria-disabled');
343			}
344		}
345	}
346}
347
348// 文字サイズ変更の読み込み
349/*********************************************************************************
350	概要：
351		文字サイズの変更を読み込み
352	使用例：
353		initFontSize();
354	引数：
355		無し
356	返り値：
357		無し
358	詳細：
359		- ページ表示時に実行する。（DomContentLoadedで実行すること。）
360*********************************************************************************/
361function initFontSize() {
362	if( isSessionStorageAvailable()) {
363		if (sessionStorage.getItem('fontSize')) {
364			let bodyElement = document.querySelector('body');
365			let currentFontSize = sessionStorage.getItem('fontSize');
366			let fontSizeLargeButton = document.querySelector('#moji_large');
367			let currentFontSizeStep = parseInt(sessionStorage.getItem('fontSizeStep'));
368			// 拡大回数が最大のときは拡大ボタンを押せないようにする。
369			if (currentFontSizeStep === 3) {
370				if (fontSizeLargeButton != null) {
371					fontSizeLargeButton.inert = true;
372					bodyElement.classList.add('font_size_limit_max');
373				}
374			}
375			bodyElement.classList.add('font_size_changed');
376			document.querySelector('html').style.fontSize = currentFontSize + 'px';
377		} else {
378			// フォントサイズの設定がない場合は縮小ボタンを非活性に。

379			let fontSizeSmallButton = document.querySelector('#moji_small');
380			if (fontSizeSmallButton !== null) {
381				fontSizeSmallButton.inert = true;
382			}
383		}
384	}
385}
386// 文字サイズ変更（前スクリプトとの互換性保持）
387function fsc(str = 'default') {
388	switch(str) {
389		case 'larger' : fontSizeChange('large'); break;
390		case 'small'  : fontSizeChange('small'); break;
391		case 'default' :
392		default: fontSizeChange('default'); break;
393	}
394}
395
396// アクセシビリティチェック画面の判定
397/*********************************************************************************
398	概要：
399		アクセシビリティチェック画面かどうかの判定
400	使用例：
401		if(accCheckerChk()){
402			// アクセシビリティチェック画面のときの処理
403		}
404	引数：
405		無し
406	返り値：
407		true , false
408	詳細：
409		アクセシビリティチェック画面かどうかの判定
410		クラスerrrangeを判定し、存在すれば（＝アクセシビリティチェック画面である）true,
411		存在しなければ（＝アクセシビリティチェック画面ではないfalseを返す。
412*********************************************************************************/
413function accElementChk() {
414	const accElement = document.getElementsByClassName('errrange');
415	return accElement.length > 0 ? true : false;
416}
417
418// アクセシビリティチェック画面のときに、bodyタグにクラス'acc_check_view'を追加する。
419/*********************************************************************************
420	概要：
421		アクセシビリティチェック画面のときにbodyにクラス'acc_check_view'を追加する。
422	使用例：
423		accCheckerChk();
424	引数：
425		無し
426	返り値：
427		無し
428	詳細：
429		実行すると、bodyタグにクラス'acc_check_view'を追加する。
430*********************************************************************************/
431function accCheckerChk() {
432	const bodyElement = document.querySelector('body');
433	if (accElementChk()) {
434		bodyElement.classList.add('acc_check_view');
435	}
436}
437
438// 色無しで確認画面の判定
439/*********************************************************************************
440	概要：
441		色無しで確認画面かどうかの判定
442	使用例：
443		accGrayCheck();
444	引数：
445		無し
446	返り値：
447		無し
448	詳細：
449	URLに特定の文字列が含まれれば専用のCSSを読み込む。
450	※filterタグが適用されるとposition:fixed;が標準状態と異なる動作想定外になるための対応。
451	※主に非表示にする。
452*********************************************************************************/
453function accGrayCheck() {
454	const bodyTag = document.querySelector('body');
455	const headTag = document.querySelector('head');
456	const chkUrl = location.pathname;
457	const compareStr = '/checker/GraceViewer';
458	const grayCSSTag = '<link rel="stylesheet" href="/ssi/css/acc-grayscale.css">';
459
460	// 色無しで確認画面のときに、bodyタグにクラス'accGrayscale'を追加する。
461	if (chkUrl.indexOf(compareStr) != -1) {
462		bodyTag.classList.add('accGrayscale');
463		headTag.insertAdjacentHTML('beforeend', grayCSSTag);
464	}
465}
466
467// 新着情報一覧の判定
468/*********************************************************************************
469	概要：
470		URLが新着一覧ページ(index-2.html)であればクラスを追加。
471	使用例：
472		chkIndexListAll();
473	引数：
474		無し
475	返り値：
476		無し
477	詳細：
478		URL中に'/index-2.html'が含まれていれば、ページ内の最初のdiv.tpl_〇〇にクラスindex-2を追加
479*********************************************************************************/
480function chkIndexListAll() {
481	const tplElm = document.querySelector('div[class*="tpl_"]');
482	if(tplElm !== null && location.pathname.includes('/index-2.html') === true){ // URLが一覧ページかどうか
483		tplElm.classList.add('index-2');
484	}
485}
486
487// ページ内見出し
488/*********************************************************************************
489	概要：
490		ページ内見出し作成
491	使用例：
492		addTocToDetail('#main_body');
493		addTocToDetail('#main_body , #sidebar2');
494
495		記事ページ,サブサイトトップページ,サブサイト記事ページ,所属トップページの#main_bodyと#sidebar2それぞれに目次（Table of contents）を作成（無い場合は作成されない）
496		if (document.querySelectorAll('.tpl_detail,.tpl_site_index,.tpl_site_detail,.tpl_soshiki_kakuka') > 0) {
497			addTocToDetail('#main_body,#sidebar2');
498		}
499	引数：
500		ページ内目次を挿入したい要素（複数可）
501	返り値：
502		無し
503*********************************************************************************/
504function addTocToDetail(targetArg) {
505	if (typeof targetArg === 'undefined') {
506		// 引数が無かったら戻る。
507		return;
508	} else {
509		const targetElement = Array.from(document.querySelectorAll(targetArg)); // targetArg 指定にマッチする要素のみが取得される。存在しない要素は取得されã

509ªã„。
510		const mainBodyH2Element = document.querySelectorAll('#main_body h2');
511
512		if (mainBodyH2Element.length > 0) {
513			// #main_body内のh2からh6までのタグをすべて取得。
514			const htagAll = Array.from(document.querySelectorAll('#main_body h2,#main_body h3,#main_body h4,#main_body h5,#main_body h6'));
515			let htag = '';
516			let linkElement = '';
517			
518			htagAll.forEach((element, index) => {
519				index += 1; // 自然数にするために+1
520				htag = element.tagName.toLowerCase(); // 見出しタグのタグ名（h2,h3など）の文字列を小文字に。
521				element.insertAdjacentHTML('beforebegin', '<span id="toc' + index + '"></span>'); // アンカーリンク先の設置
522				linkElement = linkElement + '<li class="toc_type_'+ htag + '"><a href="#toc' + index + '">' + element.textContent + '</a></li>'; // リスト＋アンカーリンクリンクタグの作成
523			});
524			/*
525				目次のHTMLを作成。（テンプレートリテラル）
526				囲みがバッククォーテーションである点に注意。（shift + @ で入力する）
527				${linkElement} に、上で処理したlinkElement内のタグが出力される。
528			*/
529			let templateToc = `
530			<details class="toc_link_wrap">
531			<summary class="toc_link_toggle">ページ内目次</summary>
532			<ul class="toc_link">${linkElement}</ul>
533			</details>`;
534
535			// 上のテンプレートリテラルで作成した目次を#main_bodyの開始タグ直後に設置。
536			for (let index = 0; index < targetElement.length; index++) {
537				targetElement[index].insertAdjacentHTML('afterbegin', templateToc);
538			}
539		}
540	}
541}
542
543// ページ内見出しへのアンカーリンク
544/*********************************************************************************
545	概要：
546		別ページからのリンクにページ内目次のアンカーリンクがあったときに、見出しまで移動させる
547	使用例：
548		tocAnchor();
549	引数：
550		無し
551	返り値：
552		無し
553	詳細：
554		load時に発火させること
555*********************************************************************************/
556function tocAnchor() {
557	let hashStr = location.hash;
558	if (hashStr.includes('#toc')) {
559		let targetElement = document.querySelector(hashStr);
560		if (targetElement !== null) {
561			window.scrollTo({ top: targetElement.offsetTop, behavior: 'smooth' });
562		}
563	}
564}
565
566// iframeタグスマートフォン対応
567/*********************************************************************************
568	概要：
569		Youtube,Googlemapのiframeタグスマートフォン対応
570	使用例：
571		ytIrameResponsive();
572	引数：
573		無し
574	返り値：
575		無し
576*********************************************************************************/
577function ytIrameResponsive() {
578	// iframeタグを取得。
579	let ytIframesArr = Array.from(document.querySelectorAll('iframe[src^="https://www.youtube"]'));
580	let gmIframeArr = Array.from(document.querySelectorAll('iframe[src^="https://www.google"]'));
581
582	// 取得したiframeタグに対し、aspect-ratioをiframeタグのwidth属性とheight属性の値で設定。
583	ytIframesArr.forEach(element => {
584		if (element.hasAttribute('width') && element.hasAttribute('height')) {
585			element.style.aspectRatio = element.getAttribute('width') + '/' + element.getAttribute('height');
586		}
587	});
588	gmIframeArr.forEach(element => {
589		if (element.hasAttribute('width') && element.hasAttribute('height')) {
590			element.style.aspectRatio = element.getAttribute('width') + '/' + element.getAttribute('height');
591		}
592	});
593}
594
595// setTitletoGMIframe関数
596/*********************************************************************************
597	概要：
598		title属性を持たないGoogle mapのiframe埋め込みタグにtitle属性を追加する。
599		has()のブラウザ対応度合いによっては、取得する要素を
600		iframe[src^="https://www.google.com/maps/embed"]:not(:has([title]))
601		で絞り込んでも可。
602		取得するGooglemapのセレクタをytIrameResponsive()と合わせている。
603	引数：
604		無し
605	返り値：
606		無し
607	使用例：
608		setTitletoGMIframe();
609*********************************************************************************/
610function setTitletoGMIframe() {
611	const iframes = document.querySelectorAll('iframe[src^="https://www.google.com/maps/embed"]');

612	iframes.forEach((elm)=>{
613		// title属性が無ければtitle属性を追加
614		if(!elm.hasAttribute('title')){
615			elm.setAttribute('title','Google map');
616		}
617	});
618}
619function setTitletoGMIframebyAPI() {
620	const mapCanvasIframe = document.querySelector('.gm-style iframe:not([title])');
621	if (mapCanvasIframe !== null) {
622		mapCanvasIframe.setAttribute('title', 'Google map');
623	}
624}
625
626// tableタグにスクロールバーを追加
627/*********************************************************************************
628	概要：
629		コンテンツエリア以上の幅をもつtableタグにスクロールバーを追加する。
630	使用例：
631		detailFreeTable();
632	引数：
633		無し
634	返り値：無し
635*********************************************************************************/
636function detailFreeTable() {
637	let tableElement = document.querySelectorAll('#main_body div[class*="detail_"] > table');
638	const btnElement = '<button type="button" class="sw_large_table sp_button">表のサイズを切り替える</button>';
639	if (tableElement) {
640		tableElement.forEach((element) => {
641			element.outerHTML = `<div class="sp_table_wrap2">${btnElement}<div class="sp_table_wrap">${element.outerHTML}</div></div>`
642		});
643		let buttons = document.querySelectorAll('#main_body div[class*="detail_"] .sw_large_table');
644		buttons.forEach((btnElm) => {
645			btnElm.addEventListener('click', () => {
646				btnElm.parentElement.classList.toggle('sp_large_table');
647			});
648		});
649	}
650}
651
652// tableタグの幅の書き換え
653/*********************************************************************************
654	概要：
655		ワープロライク中のtabelタグがコンテンツ幅よりも大きい幅をインラインスタイルで指定されていた時、
656		インラインスタイルの幅を100%に書き換える
657	引数：
658		無し
659	返り値：
660		無し
661	詳細：
662		safari対応
663*********************************************************************************/
664function rewriteTableWidth() {
665	const mainBody = document.querySelector('#main_body');
666	if (!mainBody) { // #main_bodyが存在しない場合は戻る。
667		return;
668	}
669
670	const contentW = parseInt(mainBody.clientWidth);
671	const tables = document.querySelectorAll('#main_body .detail_free table');
672
673	tables.forEach((elm) => {
674		const elmW = parseInt(elm.style.width);
675		if (elmW > contentW) {
676			elm.style.width = '100%';
677		}
678	});
679}
680
681
682/* ==================================================
683html読み込み後に実行される処理
684================================================== */
685document.addEventListener('DOMContentLoaded', function () {
686	// チェック関係
687	accCheckerChk();
688	accGrayCheck();
689	chkIndexListAll();
690	// 画面初期化関係
691	initColorMode();
692	initFontSize();
693
694	detailFreeTable();
695	ytIrameResponsive();
696	setTitletoGMIframe();
697	tocAnchor();
698
699	// ワープロライクが存在するページで実行
700	if (document.querySelector('#main_body div[class*="detail_"]') != null) {
701		rewriteTableWidth();
702	}
703});
704/* ==================================================
705html読み込み後に実行される処理 ここまで
706================================================== */
707
708
709/* ==================================================
710ページ読み込み完了時に実行される処理
711================================================== */
712window.addEventListener('load', (event) => {
713	setTimeout(setTitletoGMIframebyAPI, 1000);
714});
715
716
717try{
718      window.ChatConfig = {
719        baseURL: "https://api.izanai.ai",
720        wwwBaseURL: "https://chat.izanai.ai",
721        key:  "373696d78f929cf5",
722        id:  "1oe0wvtpyc4k",
723      }
724      var st = document.createElement("script");
725      st.type = "text/javascript";
726      st.async = true;
727      st.src = "https://chat.izanai.ai/static/public/chatcata_widget.js";
728      var header = document.getElementsByTagName("head")[0];
729      header.appendChild(st);
730    }catch (e){
731}
732
733/* ==================================================
734ページ読み込み完了時に実行される処理 ここまで
735================================================== */