@charset "UTF-8";
:root {
	/*文字色*/
	--to-fontColorN: #445985;
	--to-fontColorBlue: #00a0c6;
	/*リンク色*/
	--to-linkColor: #00a0c6;
	--to-linkColorB: #39414f;
	--to-linkColorN: #445985;
	/*線*/
	--to-borderBlue:#00a0c6;
	--to-borderG:#f4f4f3;
	--to-borderG2: #e3e3e3;
	--to-borderN: #445985;
	--to-borderB: #39414f;
	/*背景色*/
	--to-bgColorW: #fff;
	--to-bgColorG: #f4f4f3;
	/*テーブルhead背景*/
	--to-tableHbg: #e5eaf5;
	/*H6*/
	--to-fontH6: #39414f;
	/*ホバー*/
	--to-NavHover:#e5eaf5;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
	line-height: 1.5em;
}
html{
	font-size: 62.5%;
	height: 100%;
	color: #39414f;
}
html *{box-sizing: border-box;}
a {
	text-decoration: none;
	transition: 0.3s;
	color: var(--to-linkColor);
}
body {
	font-size: 1.6rem;
	height: 100%;
}

/*=====================
　header
=====================*/

header {
	position: relative;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 2%;
	box-sizing: border-box;
}
header h1{background: #fff;}
header h1 a{display: block;}
.headerBox{
	display: flex;
	align-items: center;
}
@media screen and (max-width:1080px){
	.headerBox{
		width: 100%;
		justify-content:flex-end;
	}
}

.spageHeader{
	padding: 2% 2% 1% 2%;
	box-sizing: border-box;
}
/*==================
2024ヘッダー改修
==================*/
.spAuxiliary{display: none}
.pcAuxiliary{
	display: flex;
}
/*背景色・文字サイズ変更枠*/
.accordionVision {
	margin-left: 5px;
	position: relative;
}
.accordionVision summary {
    display: flex;
	min-width: 225px;
	/*border: 2px solid #00a0c6;*/
	border: 2px solid var(--to-borderBlue);
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding:5px 5px 5px 30px;
    cursor: pointer;
	font-weight: bold;
	color: var(--to-linkColorB);
}
.accordionVision summary::before{
	content: "";
	position: absolute;
	width: 23px;
	height: 23px;
	background: url("../../img/iconHeader1.png") no-repeat;
	background-size: contain;
	left: 5px;
}
.accordionVision > .vision {
	position: absolute;
    opacity: 0;
	top: 50px;
	right: 0;
    margin: auto;
    padding: 10px;
	/*background: #fff;*/
	background:var(--to-bgColorW);
	width: 262px;
	box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.35);
	display: flex;
	justify-content: right;
	flex-wrap: wrap;
}
.accordionVision[open] > .vision {
    transform: none;
    opacity: 1;
}
.visionBgColor,.visionFontsize{
	width: 100%;
	display: flex;
	justify-content: right;
	list-style-type: none;
	align-items: center;
}
.visionFontsize{
	margin-top: 5px;
}
.visionBgColor li,.visionFontsize li{
	margin-left: 3px;
}
.bgBtn{
	border-radius: 5px;
	padding: 8px;
	font-size: 1.6rem;
	min-width: 30px;
	min-height: 30px;
	line-height: 1;
	cursor: pointer;
}
#bg-white{
	border: 2px solid #bfbfbf;
	background: #fff;
	border-radius: 3px;
}
#bg-black{
	border: 2px solid #feff00;
	background: #000;
	color: #feff00;
	border-radius: 3px;
}
#bg-blue{
	border: 2px solid #feff00;
	background: #1c00ff;
	color: #feff00;
	border-radius: 3px;
}
#bg-yellow{
	border: 2px solid #000;
	background: #feff00;
	color: #000;
	border-radius: 3px;
}
.sizeBtn{
	background: #c9c9c3;
	color: #fff;
	border-radius: 5px;
	border: none;
	padding: 8px;
	font-size: 1.6rem;
	min-width: 30px;
	min-height: 30px;
	line-height: 1;
	cursor: pointer;
}
.visionFontsize > li > .is_active{background: #00a0c6!important;}
/*Foreign language枠*/
.accordionLanguage {
	margin-left: 5px;
	position: relative;
}
.accordionLanguage summary {
    display: flex;
	min-width: 180px;
	/*border: 2px solid #00a0c6;*/
	border: 2px solid var(--to-borderBlue);
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding:5px 5px 5px 30px;
    cursor: pointer;
	font-weight: bold;
	color: var(--to-linkColorB);
}
.accordionLanguage summary::before{
	content: "";
	position: absolute;
	width: 23px;
	height: 23px;
	background: url("../../img/iconHeader2.png") no-repeat;
	background-size: contain;
	left: 5px;
}
.accordionLanguage > .language {
	position: absolute;
    opacity: 0;
	top: 50px;
	left: 0;
	right: 0;
    margin: auto;
	background: var(--to-bgColorW);
	width: 155px;
	box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.35);
}
.accordionLanguage[open] > .language {
    transform: none;
    opacity: 1;
}
.accordionLanguage > .language a{
	display: block;
	border-bottom: 1px solid var(--to-borderG);
	padding: 5px 10px;
	color: var(--to-linkColorB);
	position: relative;
}
.accordionLanguage > .language a:hover{
	background: var(--to-NavHover);
}
.accordionLanguage > .language a:before{
	position: absolute;
	content: "";
	color: #00a0c6;
	right: 5px;
	top:0;
	bottom: 0;
	margin: auto;
	width: 10px;
	height: 10px;
	background: url("../../img/rightArrow.png") no-repeat;
	background-size: contain;
}

/*=====================
　footer
=====================*/
.copy{
	width: 100%;
	text-align: center;
	padding: 6%;
	box-sizing: border-box;
}
#page_top{
	width: 50px;
	height: 50px;
	position: fixed;
	right: -50px;
	bottom: 0;
	background: #00a0c6;
	opacity: 0.6;
}
#page_top a{
	position: relative;
	display: block;
	width: 50px;
	height: 50px;
	text-decoration: none;
}
#page_top a::before{
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	content: '\f062';
	font-size: 25px;
	color: #fff;
	position: absolute;
	width: 25px;
	height: 25px;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	margin: auto;
	text-align: center;
}
/*=====================
　spage
=====================*/
.spageMain{
	width: 100%;
}
/*========大枠=========*/
article{
	width: 1024px;
	margin: 0 auto;
}
article h3{
	width: 100%;
	background: #00a0c6;
	font-weight: bold;
	font-size: 2.4rem;
	color: #fff;
	padding: 3%;
	box-sizing: border-box;
}
/*=====================
　alert
=====================*/
.alertinfoWrap{padding-top: 3%;}
.alertH3{background:#ff0004!important;}
.alertH4{
	width: 100%;
	background: url("../../img/barImg.png") no-repeat;
	background-position: center left 10px;
	border: 2px solid #00a0c6;
	padding: 15px 15px 15px 50px;
	font-weight: bold;
	font-size: 1.8rem;
	margin: 20px 0;
	box-sizing: border-box;
}
.ta-l{text-align: left}
.ta-c{text-align: center}
.ta-r{text-align: right}
.ta-l a,.ta-c a,.ta-r a{
	color: #00a0c6;
	font-weight: bold;
	border: none!important;
	padding: 0!important;
}
.ta-l strong,.ta-c strong,.ta-r strong{
	font-weight: bold;
}
.ta-l i,.ta-c i,.ta-r i{
	font-style: italic;
}
.alertImage{margin: 20px 0;}
.ta-l{
	margin-left: 0;
	margin-right: auto;
}
.ta-c{
	margin-left: auto;
	margin-right: auto;
}
.ta-r{
	margin-left: auto;
	margin-right: 0;
}
.alertDisc{
	padding: 0;
	margin: 20px 0;
	list-style-type: none;
}
.alertDisc li{
	position: relative;
	padding-left: 20px;
	line-height: 1.8;
}
.alertDisc li:before{
	position: absolute;
	content: "■";
	color: #00a0c6;
	margin: auto;
	left: 0;
	bottom: 0;
	top: 0;
}
.alertDisc li a{
	color: #00a0c6;
	font-weight: bold;
	border: none!important;
	padding: 0!important;
}
.alertDisc li strong{font-weight: bold;}
.alertDisc li i{font-style: italic;}
.alertNumber{
	counter-reset: item;
	list-style-type: none;
	padding-left: 0;
	margin: 20px 0;
}
.alertNumber li{
	text-indent: -1.6rem;
	padding: 5px 0 5px 2rem;
	box-sizing: border-box;
}
.alertNumber li:before {
	counter-increment: item;
	content: counter(item)'.';
	padding-right: .5em;
	font-weight: bold;
	color: #00a0c6;
}
.lertNumber li a{
	color: #00a0c6;
	font-weight: bold;
	border: none!important;
	padding: 0!important;
}
.lertNumber li strong{font-weight: bold;}
.lertNumber li i{font-style: italic;}

.alertTable{
	width: 100%;
	border-collapse: collapse;
	margin: 20px 0;
}
.alertTable th{background: #e5eaf5;}
.alertTable th,.alertTable td{
	border: 1px solid #00a0c6;
	padding: 5px;
	vertical-align: middle;
	box-sizing: border-box;
}
.alertTable th a,.alertTable td a{
	color: #00a0c6;
	font-weight: bold;
	border: none!important;
	padding: 0!important;
}
.alertTable th strong,.alertTable td strong{
	font-weight: bold;
}
.alertTable th i,.alertTable td i{
	font-style: italic;
}
/*========ボタン=========*/
.alertBtn{
	margin-top: 40px;
}
.btn{
	padding: 15px;
	text-align: center;
	font-weight: bold;
	font-size: 1.6rem;
	background: #00a0c6;
	color: #fff!important;
	border-radius: 10px;
	box-sizing: border-box;
}
.btn:hover{
	opacity: 0.8;
}
/*===============================================
●tablet.css  画面の横幅が1000px〜737pxまで
===============================================*/

@media screen and (max-width:1000px){

	body{
		 -webkit-text-size-adjust: 100%;
	}
	
	img {
		max-width: 100%;
		width: 100%;
		height: auto;
		width /***/: auto;
	}
	/*=====================
	　header
	=====================*/
	header{
		width: 100%;
		height: 61px;
		position: fixed;
		z-index: 1;
		background: #fff;
		top: 0;
		left: 0;
		padding: 1.5% 0 0 2%;
	}
	#wrapper{margin-top: 78px;}
	article{width: 96%;}
	/*========ボタン=========*/
	.alertBtn{text-align: center;}
	/*==================
	2024ヘッダー改修
	==================*/
	.pcAuxiliary{display: none;}
	.spAuxiliary{
		display: flex;
		justify-content: space-between;
		width: 96%;
		margin: 0 auto;
		flex-wrap: wrap;
	}
	.accordionVision, .accordionLanguage{
		margin-left: 0;
		margin-bottom:10px;
		width: 49%;
	}
	.accordionVision summary,.accordionLanguage summary {
		min-width: auto;
		width: 100%;
	}
}
@media screen and (max-width:737px){

	body{ -webkit-text-size-adjust: 100%;}
	/*=====================
	　header
	=====================*/
	.spageHeader{
		padding: 3.5% 0 0 3%;
		box-sizing: border-box;
	}
	article{width: 90%;}
	/*==================
	2024ヘッダー改修
	==================*/
	.accordionVision, .accordionLanguage{width: 100%;}
	.accordionVision{margin-bottom: 5px;}
	.accordionVision summary,.accordionLanguage summary {
		min-width: auto;
		width: 100%;
		border: 1px solid #00a0c6;
	}
	.accordionVision > .vision {
		position:static;
		opacity: 0;
		top:auto;
		right: auto;
		margin: auto;
		padding: 10px;
		box-shadow:none;
	}
	.accordionLanguage > .language {
		position:static;
		opacity: 0;
		top: auto;
		left: auto;
		right: auto;
		margin: auto;
		width: 100%;
		box-shadow: none;
	}
}