﻿/* 中部版 CSS Document   */
/* 修正日 20240313       */

/*-----------------------------------*/
/* 共通                              */
/*-----------------------------------*/

/* 下線強調 */
.highlight {
  text-decoration: underline;
  text-decoration-thickness: 0.5em;
  text-decoration-color: rgba(135, 215, 255, 0.4); /* 線の水色 */
  text-underline-offset: -0.2em;
  text-decoration-skip-ink: none;
}

.highlight_red {
  text-decoration: underline;
  text-decoration-thickness: 0.5em;
  text-decoration-color: rgba(255, 30, 30, 0.4); /* 線のピンク */
  text-underline-offset: -0.2em;
  text-decoration-skip-ink: none;
}

.highlight_yellow {
  text-decoration: underline;
  text-decoration-thickness: 0.5em;
  text-decoration-color: rgba(255, 255, 66, 0.4); /* 線の黄色 */
  text-underline-offset: -0.2em;
  text-decoration-skip-ink: none;
}

/* 角丸ボタン 人事院デフォルトカラー*/
div.detail{
	font-size: 1.6rem;
	max-width: 320px;
	position: relative;
	margin-top: 1.0em;
	margin-bottom: 1.0em;
	margin-left:auto;
	margin-right:auto;
	display:flex;
	justify-content:center;
}
div.detail a{
	width: 100%;
 	display:block;
	height:3.0em;
	margin:1.0em 0;
	padding-top:1.0em;
	line-height:1.0em;
	font-size: 16px;
 	background:#FFF;
	color:#330099;
	text-decoration: none;
	text-align:center;
	vertical-align: middle;
	border: 1px solid #330099;
	border-radius:1.5em;
	cursor: pointer;
	user-select: none;
}
div.detail a:hover{
	background: #330099;
	text-decoration: none;
	color: #fff
}

/* 角丸ボタン スカイブルー*/
div.yoyaku{
        font-size: 1.6rem;
	max-width: 320px; 
	position: relative; 
	margin-top: 1.0em; 
	margin-bottom: 1.0em; 
	margin-left:auto; 
	margin-right:auto; 
	display:flex; 
	justify-content:center;
}


div.yoyaku a{
	font-size: 1.6rem; 
	width: 100%; 
	display:block; 
	height:3.0em; 
	margin:1.0em 0; 
	padding-top:1.0em; 
	line-height:1.0em; 
	background:#FFF; 
	color:#00a6ed;
	text-decoration: none; 
	text-align:center; 
	vertical-align: middle; 
	border: 1px solid #87ceed; 
	border-radius:1.5em; 
	cursor: pointer; 
	user-select: none;
}
div.yoyaku a:hover{
	background: #87ceed; 
	background: linear-gradient(90deg, #87ceed, #00A6ED);
	text-decoration: none; 
	color: #fff
}

/* 説明用文章 */
div.explanation{
	font-size: 1.6rem;
	line-height: 1.8em;
	margin: 0.5em;
}

/* 箇条書きの行間 */
.ichiran li{
	padding-bottom: 1.5em;
}

/* 区切り */
hr.hr1{
	font-size: 1.6rem;
	border-top: 1px solid #aaa;
	margin: 2.0em 0;
}

/* コメント枠組み */
table.comment{
	font-size: 1.6rem;
	width: 95%;
	align: center;
	border:1px solid #87d7ff;
	margin: 2em auto;
	border-spacing: 0;
	border-collapse: separate;
	border-radius: 2em;
	-webkit-border-radius: 2em;
	-moz-border-radius: 2em;
	background: #fff
}
table.comment tr:first-of-type td{
	padding: 1em;
	background-color: #87d7ff;
	border-radius: 1.5em 1.5em 0 0;
	color: #fff;
	text-align: center;
	font-weight: bold;
	font-size: large;
}
table.comment td{
	padding: 1em;
}

/* --------------------------------- */
/* 中部版採用情報NAVI用のスタイル     */
/* --------------------------------- */

/* 各種SNSのアイコン */
div.logo{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
div.logo_box{
	width:80px;
	height:40px;
}

/* --------------------------------- */
/* こころの健康相談室用のスタイル     */
/* --------------------------------- */

div.pic{
	text-align:center;
}

/* ------------------------- */
/* 各種説明会用のスタイル     */
/* ------------------------- */

/* スケジュール表 */
table.schedule{
//	border-color: #87ceed; 
	width: 100%; 
	border-collapse: collapse;
	table-layout: fixed;
	word-break: break-all !important;
	word-wrap: break-all !important;
}
.schedule th{
//	background: #87ceed; 
	padding: 0.5rem; 
//	color: #fff;
	border-left: 1px solid #fff;
	border-bottom: 1px solid #fff;
}
.schedule th:first-child{
	border-left: 1px solid #87ceed;
}
.schedule th.midashi{
	background: #879CED;
}
.schedule th.midashi:first-child{
	border-left: 1px solid #879CED;
}
.schedule td{
	padding: 1.0rem;
	word-break: break-all !important;
}


/* ------------------------- */
/* 官庁案内用のスタイル     */
/* ------------------------- */

/* 官庁名のボタン リンク有効 */
div.kancho{
	font-size: 1.6rem; 
	position:relative; 
	display:flex; 
	justify-content:center; 
	margin: 2px;
}
div.kancho a{
	font-size: 1.6rem; 
	width: 100%; 
	display: block;
	padding: 0.5em 1em; 
	background: #fff; 
	color:#000;
	text-decoration: none; 
	vertical-align: middle; 
	border: 1px solid #87ceed; 
	cursor: pointer; 
	user-select: none;
}
div.kancho a:hover{
	background:#87ceed; 
	text-decoration: none; 
	color: #000;
}

/* 官庁名のボタン リンク無効 */
div.kancho_nolink{
	position:relative; 
	display:flex; 
	justify-content:center; 
	margin: 2px;
}
div.kancho_nolink a{
	font-size: 1.6rem; 
        width: 100%; 
	display: block;
	padding: 0.5em 1em; 
	background:#eee; 
	color:#000;
	text-decoration: none; 
	vertical-align: middle; 
	border: 1px solid #aaa; 
	cursor: pointer; 
	user-select: none;
	pointer-events: none;	
}

/* 東海北陸公務員フェアなどで使った */
/* 参加機関の説明回の数字 */
div.entry{
	font-weight: bold;
}
/* 説明回に不参加 */
span.k{
	color:#eee;
	font-weight: lighter;
}

/* 官庁案内の府省名 */
div.fusho {
	color: #fff;
	background-color:#87ceed; 
	font-weight: bold;
	width: 100%;
	height: 3.0em;
	text-align: center;
	padding-top: 0.8em;
	font-size: 150%;
	}

/* 官庁案内の管区名 リンク有効*/
div.block1 {
	width: 100%; 
	position: relative; 
	margin-left: 0; 
	display:flex; 
	justify-content:center;
}
a.block1{
	font-size: 1.6rem;
	width: 100%; 
	display:block; 
	height: auto;
	min-height: 3.0em; 
	margin:0.5em 0; 
	padding-top:1.0em; 
	line-height:1.0em; 
	background:#fff; 
	color:#000;
	text-decoration: none; 
	text-align:center; 
	vertical-align: middle; 
	border: 3px double #87ceed; 
	cursor: pointer; 
	user-select: none;
}
a.block1:hover{
	background: #87ceed; 
	text-decoration: 
	none; color: #fff;
}

/* 官庁案内の管区名 リンク無効*/
div.block2{
	font-size: 1.6rem;
	width: 100%; 
	height: auto;
	min-height: 3.0em; 
	margin:0.5em 0; 
	line-height:1.0em; 
	background:#fff; 
	color: #000; 
	text-align: center; 
	padding-top:1.0em; 
	border: 3px double #aaa;
}

/* 官庁案内の機関名 リンク有効*/
div.kikan{
	width: 310px; position: 
	relative; margin-left:0; 
	display:flex; 
	justify-content:center;
}
a.kikan{
	font-size: 1.6rem;
	width: 100%; 
	display:block;
	height:auto; 
	min-height:3.0em; 
	margin:0.5em 0; 
	padding-top:1.0em; 
	line-height:1.0em; 
	background:#FFF; 
	color:#000;
	text-decoration: none; 
	text-align:center; 
	vertical-align: middle; 
	border: 1px solid #87ceed; 
	border-radius:1.5em; 
	cursor: pointer; 
	user-select: none;
}
a.kikan:hover{
	background: #87ceed; 
	text-decoration: none; 
	color: #fff;
}

/* 官庁案内の機関名 複数列挙*/
div.multi-kikan{
	display:flex; 
	justify-content: 
	flex-start; 
	flex-wrap: wrap;
}

/* 官庁案内の区切り */
hr.hr2 {
	font-size: 1.6rem;
	border-top: 1px dashed #aaa; 
	margin: 1.0em 0;
}

/* 官庁案内の画像 */
div.guide {
	display: flex; 
	flex-wrap:wrap; 
	width: 100%;
}
div.guide img:hover{
	opacity:0.5;
}
div.guide a:hover{
	text-decoration:none;
}
div.nolink a{
	pointer-events: none;	
}


/* ----------------------------- */
/* 説明会・セミナー用のスタイル */
/* ----------------------------- */

/* 出張ガイダンスの画像 */
div.guidance{
	font-size: 1.6rem;
	width: 480px;
	margin-top: 2em;
	margin-left: auto;
	margin-right: auto;
}

/* 予定表 */
table.schedule2{
	border: 1px solid #87ceed;
	border-collapse: collapse;
}
table.schedule2 th{
	font-size: 1.6rem;
	height: 3.0em;
	padding: 0.5em;
	background: #87ceed;
	color: #fff;
	border-right: 1px solid #fff;
}
table.schedule2 th:last-child{
	border-right: 1px solid #87ceed;
}
table.schedule2 td{
	height: 5.0em;
	padding: 0.5em;
	border: 1px solid #87ceed;
}

/* ------------------------*/
/* 主要官庁一覧用のスタイル */
/* ------------------------*/
table.ichiran{
	border-collapse: collapse;
	border: 1px solid #87ceed;
	width: 100%;
}
table.ichiran td{
	font-size: 1.6rem;
	height: 4em;
	vertical-align: top;
	border: 1px solid #87ceed;
	padding: 0.25rem 0.5rem;
}
table.ichiran tr:nth-child(even) {
	background-color: #ddeeff;
}
td.kikan{
	width: 23%;
}
td.busho{
	width: 17%;
}
td.yubin{
	width: 10%;
}
td.address{
	width: 30%;
}
td.tel{
	width: 20%;
}


div.pic img{
	width: 80%;
	opacity: 0.95;
}

.address dl{
	display: flex;
	flex-wrap: wrap;
}
.address dt{
	width: 20%;
	padding: 0.5rem 1.0rem;
	background-color: #fff;
	color: #330099;
	border: 1px solid #330099;
	margin:0 0 1.0rem 0;
	display:flex;
	align-items: center;
	justify-content: center;
}
.address dd {
	width: 70%;
	padding: 0.5rem 1.0rem;
	background-color: #Fff;
	border: 0px solid #330099;
	margin:0 0 1.0rem 0;
}

.address ul{
	padding-left: 1.0rem;
}

table.nittei{
    border-spacing: 0px;
	width: 90%;
	margin: 0.5rem 0;
}

table.nittei th{
	padding: 0.5rem;
	border: 1px solid #000;
	background-color: #330099;
	color: #fff;
}


table.nittei td{
	padding: 0.5rem;
	width: 30%;
	vertical-align: middle;
	text-align: center;
	border: 0px solid #000;
}

/*-----------------------------------*/
/* パソコン用                        */
/*-----------------------------------*/
@media screen and (min-width:481px){
	div.kancho{
		width: calc((100% - 16px)/4); 
		height: 5.0em; 
		text-align: center; 
	}
	div.kancho a{width: 100%; 
		text-align:center; 
	}
	div.kancho_nolink{
		width: calc((100% - 16px)/4); 
		height: 5.0em; 
		text-align: center; 
	}
	div.kancho_nolink a{width: 100%; 
		text-align:center; 
	}

	div.box{
		width: calc(100%/4);
		box-sizing: border-box;
		border: 1px solid #87ceed;
	}
	div.entry{
		text-align: center; 
	}
	div.entry::before{
		content:"【";
		color: #000;
	}
	div.entry::after{
		content:"】";
		color: #000;
	}
	div.comment{
		text-align: left;
		padding: 0.5em;
		box-sizing: border-box;
	}
	div.box2{
		display: flex;
		box-sizing: border-box;
		justify-content: flex-start;
	}
	div.y-large{
		max-width: 480px;
	}
	div.y-large2{
		width: 100%;
		max-width: 200px;
		margin: 0 1em;
	}
		
	div.guide img {
		width: 310px; 
		height: 438px;
	}
	div.contents{
		width:610px; margin-left: 0.5em;
	}
	div.half{
		width:300px;
	}
	div.full{
		width:920px;
	}
	table.schedule2 tr:nth-child(odd) {
		background-color: #ddeeff;
	}
	table.schedule2 td.button {
		display: none;
	}
}

/*-----------------------------------*/
/* スマートホン用                    */
/*-----------------------------------*/
@media screen and (max-width:480px){

	/* 上に戻るボタンを常時表示 */
	a.c-back-to-top.c-back-to-top--square.c-back-to-top--blue{
		position: fixed;
		bottom: 1em;
		right: 1em;
		width: 60px;
		height: 60px;
		background: rgba(255,255,255,0.5);
		border: 2px solid #bbb;
		border-radius: 50%;
		display: inline-block;
		text-decoration: none;
		z-index: 99999;
	}
	a.c-back-to-top.c-back-to-top--square.c-back-to-top--blue::before{
		content: '';
		display: block;
		position: absolute;
		width: 1em;
		height: 1em;
		top: 1.5em;
		left: 1.3em;
		border: 5px solid;
		border-color: #bbb #bbb transparent transparent;
		transform: rotate(-45deg);
	}
	svg.c-back-to-top__icon{
		display: none;
	}

	div.kancho{
	        font-size: 1.6rem;
		width: 100%; 
		height: 5.0em; 
		text-align: left; 
		margin: 0;
		border-bottom: 1px solid #FFF;
	}
	div.kancho a{
		width: 100%; 
		text-align: left;
		padding-top: 2em; 
	}
	div.kancho br{
		display: none;
	}
	div.kancho_nolink{
		width: 100%; 
		height: 5.0em; 
		text-align: left; 
		margin: 0;
		border-bottom: 1px solid #FFF;
	}
	div.kancho_nolink a{
		width: 100%; 
		text-align: left;
		padding-top: 2em; 
	}
	div.kancho_nolink br{
		display: none;
	}
	div.box{
		width: 100%; 
	}
	div.entry::before{
		content: "説明回　";
	}
	div.comment{
		padding: 0 0.5em;
	}	
	div.block1{ 
		width: 95%;
		margin-left: auto;
		margin-right: auto;
	}
	div.block2{ 
		width: 95%;
		margin-left: auto;
		margin-right: auto;
	}
	div.kikan{ 
		width: 95%;
		margin-left: auto;
		margin-right: auto;
	}
	div.guide img{
		width: 100%; 
		height: auto;
	}
	div.contents{
		width:100%;
	}
	div.guidance{
		width: 100%;
	}
	div.guidance img{
		width: 100%;
	}
	table.schedule2{
		border: 0px solid #fff;
		font-size-adjust: none;
	}
	table.schedule2 th{
		display: none;
	}
	table.schedule2 td{
		width: 100%;
		box-sizing: border-box;
		padding: 0.25em 0.5em;
		display: block;
		height: auto;
		border: 0px solid #fff;
	}
	table.schedule2 td br{
		display:none;
	}
	table.schedule2 td.s_name{
  		margin-top: 2.0em;
		min-height: 2.0em;
		font-weight: bold;
		color: #fff;
		background: #87ceed;
	}
	table.schedule2 td.date::before{
		content: "開催日　";
		color: #00A6ED;
	}
	table.schedule2 td.place::before{
		content: "会場等　";
		color: #00A6ED;
	}
	table.schedule2 td.overview::before{
		content: "概要　";
		color: #00A6ED;
	}
	table.schedule2 td.jisshikikan::before{
		content: "実施機関　";
		color: #00A6ED;
	}
	table.schedule2 td.oubo_term::before{
		content: "応募期間　";
		color: #00A6ED;
	}
	table.schedule2 td.jissi_term::before{
		content: "実施期間　";
		color: #00A6ED;
	}
	div.pic img{
		width: 100%;
	}
}
