@charset "UTF-8";

/* リセット */
@import url('reset.css');

/* ---------------------------------------------------------
汎用スタイル 
------------------------------------------------------------ */
html{
	scroll-behavior: smooth;
}
*{
	box-sizing: border-box;
}
body{
	font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
}
main{
	display: block;
}
@media screen and (min-width: 1024px)  {
	main{
		padding-top:128px;
	}
}
a{
	text-decoration: none;
	color: #000;
}
a img:hover{
	opacity: .6;
}
img{
	vertical-align: bottom;
	image-rendering: -webkit-optimize-contrast;
	max-width: 100%;
	height: auto;
}
li{
	list-style: none;
}
.center{
	text-align: center;
}
.right{
	text-align: right;
}
.mincho{
	font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.red{color:#c00;}
.fw-bold{font-weight: bold;}
.fw-normal{font-weight: normal;}

/* ---------------------------------------------------------
fontサイズ
------------------------------------------------------------ */
.fs-12{font-size: 75%;}
.fs-14{font-size: 87.5%;}
.fs-18{font-size: 112.5%;}
.fs-20{font-size: 125%;}
.fs-22{font-size: 137.5%;}
.fs-24{font-size: 150%;}
.fs-26{font-size: 162.5%;}
.fs-28{font-size: 175%;}
.fs-30{font-size: 187.5%;}
.fs-32{font-size: 200%;}

@media screen and (max-width: 1023px)  {
	.fs-20{font-size: 112.5%;}
	.fs-22{font-size: 112.5%;}
	.fs-24{font-size: 112.5%;}
	.fs-26{font-size: 125%;}
	.fs-28{font-size: 125%;}
	.fs-30{font-size: 150%;}
	.fs-32{font-size: 150%;}
}

/* ---------------------------------------------------------
margin
------------------------------------------------------------ */
.mgt0{margin-top:0!important;}
.mgt5{margin-top:5px!important;}
.mgt10{margin-top:10px!important;}
.mgt20{margin-top:20px!important;}
.mgt50{margin-top:50px!important;}
.mgb0{margin-bottom:0!important;}
.mgb5{margin-bottom:5px!important;}
.mgb10{margin-bottom:10px!important;}
.mgb20{margin-bottom:20px!important;}
.mgb50{margin-bottom:50px!important;}

/* PC・スマホ表示 */
@media screen and (min-width: 1024px)  {
	.sp{
		display: none !important;
	}
}
@media screen and (max-width: 1023px)  {
	.pc{
		display: none !important;
	}	
}

.anchor{
	padding-top:100px!important;
	margin-top:-100px!important;
}
/* ファイルアイコン */
a[href$=".pdf"]:not(.none),a[href$=".doc"],a[href$=".docx"],a[href$=".xls"],a[href$=".xlsx"]{
	position: relative;
	margin-left: 26px;
}
a.pdf:not(.none)::before,a[href$=".pdf"]:not(.none)::before{
	position: absolute;
	content: url('../images/pdf-link.gif');
	top:0;
	left:-26px;
}
a[href$=".doc"]::before,a[href$=".docx"]::before{
	position: absolute;
	content: url('../images/word-link.gif');
	top:0;
	left:-26px;
}
a[href$=".xls"]::before,a[href$=".xlsx"]::before{
	position: absolute;
	content: url('../images/excel-link.gif');
	top:0;
	left:-26px;
}


/* ---------------------------------------------------------
ヘッダー
------------------------------------------------------------ */
@media screen and (min-width: 1024px)  {
	header{
		position: fixed;
		padding: 0 calc( ( 100% - 1160px ) / 2 );
		width:100%;
		height:60px;
		margin:0 auto;
		display: flex;
		justify-content: space-between;
		z-index: 3;
		background-color: #fff;
	}
	header h1{
		display: flex;
		align-items: center;
	}
	header h1 img{
		height: 24px;
	}
	header > ul{
		display: flex;
	}
	header > ul > li{
		display: flex;
		align-items: center;
		margin-left:20px;
	}
	header .on, header .off{
		width: 46px;
		cursor: pointer;
	}
	header #resize-font{
		display: flex;
		margin-left:8px;
	}
	header #resize-font li{
		background-color:#d2def7;
		border: solid 1px #777;
		color:#001f62;
		margin-left:2px;
		width:24px;
		height:24px;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
	}
	header #resize-font > li.active{
		background-color:#001f62;
		color:#fff;
	}
	header #resize-font #small{
		font-size: 11px;
	}
	header #resize-font #medium{
		font-size: 14px;
	}
	header #resize-font #large{
		font-size: 17px;
	}
	header .twitter{
		width: 26px;
	}
}

@media screen and (max-width: 1023px)  {
	header{
		display: flex;
	}
	header h1{
		width:50%;
		display: flex;
		align-items: center;
		padding:2vw;
	}
	header ul{
		width: 50%;
		display: flex;
		justify-content: flex-end;
	}
	header ul li{
		display: flex;
		align-items: center;
	}
	header ul select{
		width: 20vw;
		font-size: 3.1vw;
	}
	header ul li:nth-child(4){
		padding:2.5vw;
	}
	header ul li:nth-child(4) img{
		width: 8.5vw;
	}
	header ul li:last-child{
		width: 13.5vw;
	}
}
@media screen and (max-width: 1023px) and  (min-width: 768px) {
	header h1 {
		width: 35%;}
	header ul {
		width: 65%;}

	header ul li:nth-child(4) {
		padding:0 1vw;
	}
	header ul li:nth-child(4) img {
		width: 6vw;
	}
	header ul li:last-child {
		width: 7vw;
	}
	header ul select{
		font-size: 2vw;
	}
}
/* 検索*/
header ul select{
	border: none;
}
header .on{
	display: none;
}
header .search-form{
	position: absolute;
	background-color: #fff;
}

@media screen and (min-width: 1024px) {
	header .search-form{
		width: 500px;
		padding: 30px 20px;
		top:60px;
		right:calc( ( 100% - 1200px ) / 2 );
		box-shadow: 0 4px 8px 2px rgba(0, 0, 0, .3);
		z-index: 10;
	}
	header .search-form::before{
		position: absolute;
		content: '';
		width: 20px;
		height: 20px;
		background-color: #fff;
		transform: rotate(45deg);
		top: -10px;
		right:34px;
		border-top: solid 1px #ccc;
		border-left: solid 1px #ccc;
	}
	header .search-form .keyword{
		width: 360px;
		height: 40px;;
	}
	header .search-form .submit{
		background-color: #001f62;
		color: #fff;
		border: none;
		width: 90px;
		height: 40px;
	}
}
@media screen and (max-width: 1023px) {
	header .search-form{
		width: 100%;
		padding: 4vw;
		top:13vw;
		box-shadow: 0 4px 8px 2px rgba(0, 0, 0, .3);
		z-index: 10;
	}
	header .search-form::before{
		position: absolute;
		content: '';
		width: 10px;
		height: 10px;
		background-color: #fff;
		transform: rotate(45deg);
		top: -2vw;
		right:18vw;
		border-top: solid 1px #ccc;
		border-left: solid 1px #ccc;
	}
	header .search-form .keyword{
		width: 74vw;
		height: 8vw;
	}
	header .search-form .submit{
		background-color: #001f62;
		color: #fff;
		border: none;
		width: 14vw;
		height: 8vw;
	}
}
@media screen and (max-width: 1023px) and  (min-width: 768px) {
	header .search-form {
		top: 7vw;
	}
	header .search-form::before {
		top: -1vw;
		right: 10vw;
	}
}
/* ---------------------------------------------------------
グローバルナビ
------------------------------------------------------------ */
@media screen and (min-width: 1024px) {
	header + nav {
		position: fixed;
		top:60px;
		z-index: 2;
		box-shadow: 0 5px 3px rgba(0, 0, 0, 0.2);
	}
	nav #gnav{
		border-left: solid 1px #fff;
	}	
}
nav{
	width:100%;
	background-color: #001f62;
	position: relative;
}

/* 第一階層
------------------------------ */
@media screen and (min-width: 1024px) {
	nav #gnav > li{
		text-align: center;
		/* position: relative; */
		border-right: solid 1px #fff;
	}
}
nav #gnav > li > a::before{
	position: absolute;
	display: block;
	content: '';
}
nav #gnav > li.consult > a{
	font-size: 12px;
}
nav #gnav > li.consult > a span{
	font-size: 10px;
}
nav #gnav > li.lookingfor > a::before{
	background: url('../images/common/icon-search.png') no-repeat;
	background-size: contain;
}
nav #gnav > li.resident > a::before{
	background: url('../images/common/icon-house.png') no-repeat;
	background-size: contain;
}
nav #gnav > li.consult > a::before{
	background: url('../images/common/icon-talk.png') no-repeat;
	background-size: contain;
}
nav #gnav > li.business > a::before{
	background: url('../images/common/icon-biz.png') no-repeat;
	background-size: contain;;
}
nav #gnav > li.aboutus > a::before{
	background: url('../images/common/icon-about.png') no-repeat;
	background-size: contain;
}
/* 第二階層
------------------------------ */
@media screen and (min-width: 1024px) {
	nav #gnav li ul{
		position: absolute;
		background-color: #fff;
		z-index: 10;
		width: 100vw;
		left: 0;
		text-align: left;
		padding : 20px calc( ( 100% - 1160px ) / 2);
		display: flex;
		flex-wrap: wrap;
		opacity: .9;
		line-height: 1.2;
	}
	nav #gnav li ul li{
		width: 33%;
	}
	nav #gnav li ul a{
		color: #001f62;
		font-size: 16px;
		padding: 12px 20px 12px 0;
		position: relative;
	}
	nav #gnav li ul a::before{
		content:"";
		display:inline-block;
		height:1em;
		border-left: 3px solid #001f62;
		min-width: 10px;
		vertical-align: top;
	}


}
@media screen and (min-width: 1024px) and ( max-width:959px ) {
	nav #gnav{
		width:100%;
		display: flex;
		margin:0 auto;	
	}
	nav #gnav > li{
		width:calc( 100% / 5 );
	}
	nav #gnav > li a{
		display: block;
		padding:24px 0 24px 10px;
		font-size: 16px;
		color: #fff;
	}
	nav #gnav > li a::before{
		min-width:24px;
		height:24px;
		top:calc( 50% - 12px);
	}
}
@media screen and (min-width: 1024px) and ( max-width:1159px ) {
	nav #gnav{
		width:100%;
		display: flex;
		margin:0 auto;	
	}
	nav #gnav > li{
		width:calc( 100% / 5 );
	}
	nav #gnav > li a{
		display: block;
		padding:24px 0 24px 20px;
		font-size: 18px;
		color: #fff;
	}
	nav #gnav > li a::before{
		min-width:24px;
		height:24px;
		top:calc( 50% - 12px);
	}
}
@media screen and (min-width: 1160px)  {
	nav #gnav{
		max-width:1160px;
		display: flex;
		margin:0 auto;	
	}
	nav #gnav > li{
		width:calc( 100% / 5 );
	}
	nav #gnav > li a{
		display: block;
		padding:24px 0 24px 30px;
		font-size: 20px;
		color: #fff;
	}
	nav #gnav > li a::before{
		min-width:28px;
		height:28px;
		top:calc( 50% - 14px);
	}
}

/* タイトル画像 */
#heading img{
	width: 100%;
}

/* ---------------------------------------------------------
スマホメニュー
------------------------------------------------------------ */
@media screen and (max-width: 1023px)  {
	header .close{
		display: none;
	}
	#gnav.mobile{
		display: none;
	}
	nav #gnav a{
		display: block;
		color: #fff;
		text-align: left;
	}
	/* 第一階層 */
	nav #gnav > .lookingfor{
		background: url('../images/common/icon-search.png') top 4.5vw left 5vw no-repeat;
		background-size: 6vw;
	}
	nav #gnav > .resident{
		background: url('../images/common/icon-house.png') top 4.5vw left 5vw no-repeat;
		background-size: 6vw;
	}
	nav #gnav > .consult{
		background: url('../images/common/icon-talk.png') top 4.5vw left 5vw no-repeat;
		background-size: 6vw;
	}
	nav #gnav > .business{
		background: url('../images/common/icon-biz.png') top 4.5vw left 5vw no-repeat;
		background-size: 6vw;
	}
	nav #gnav > .aboutus{
		background: url('../images/common/icon-about.png') top 4.5vw left 5vw no-repeat;
		background-size: 6vw;
	}
	@media screen and (max-width: 1023px) and ( min-width:768px ) {
		nav #gnav > .lookingfor{
			background: url('../images/common/icon-search.png') top 1.5vw left 3vw no-repeat;
			background-size: 4vw;
		}
		nav #gnav > .resident{
			background: url('../images/common/icon-house.png') top 1.5vw left 3vw no-repeat;
			background-size: 4vw;
		}
		nav #gnav > .consult{
			background: url('../images/common/icon-talk.png') top 1.5vw left 3vw no-repeat;
			background-size: 4vw;
		}
		nav #gnav > .business{
			background: url('../images/common/icon-biz.png') top 1.5vw left 3vw no-repeat;
			background-size: 4vw;
		}
		nav #gnav > .aboutus{
			background: url('../images/common/icon-about.png') top 1.5vw left 3vw no-repeat;
			background-size: 4vw;
		}
	}



	nav #gnav > li > a{
		padding: 5vw 5vw 5vw 15vw;
		font-size: 5vw;
		border-bottom:solid 1px #3a5eab;
		position: relative;
		overflow: hidden;
	}
	nav #gnav > li > a > i{
		position: absolute;
		top:5vw;
		right: 5.5vw;
		content: '';
		width: 4vw;
		height: 4vw;
		border-bottom: solid 2px #fff;
		border-right: solid 2px #fff;
		transform: rotate(45deg);
		z-index: 3;
	}
	nav #gnav > li > a > i.open{
		top:6vw;
		border-bottom: none;
		border-right: none;
		border-top: solid 2px #fff;
		border-left: solid 2px #fff;
		transform: rotate(45deg);
	}
	nav #gnav > li > a > i::before{
		position: absolute;
		background-color:rgba(255, 255, 255, .2);
		content:"";
		display: block;
		width:10vw;
		height:10vw;
		transform: rotate(45deg);
		top: -2.5vw;
		left: -2.5vw;
	}
	nav #gnav > li > a > i.open::before{
		top: -4vw;
    	left: -4vw;
	}
	@media screen and (max-width: 1023px) and  (min-width: 768px){
		nav #gnav > li > a {
			padding: 2.5vw 5vw 2.5vw 10vw;
			font-size:2.2vw;
		}
		nav #gnav > li > a > i {
			position: absolute;
			top: 1.5vw;
			right: 3vw;
			width: 2.5vw;
			height: 2.5vw;
		}
		nav #gnav > li > a > i.open{
			top:2.5vw;
		}
		nav #gnav > li > a > i::before {
			width: 5vw;
			height: 5vw;
			top: -0.75vw;
			left: -0.75vw;
		}
		nav #gnav > li > a > i.open::before {
			top: -1.75vw;
			left: -1.75vw;
		}
	}


	/* 第二階層 */
	nav #gnav > li > ul{
		background-color: #1f3f82;
	}
	nav #gnav > li > ul > li > a {
		padding:5vw 15vw 5vw 5vw;
		font-size: 4.2vw;
		border-bottom:solid 1px #3a5eab;
		position: relative;
	}
	/* 開閉ボタンを追加 */
	nav #gnav > li > ul > li > a > i{
		position: absolute;
		width: 10vw;
		height: 10vw;
		background-color: #fff;
		text-align: center;
		top: 2vw;
		right: 2.5vw;
		font-weight: 500;
		font-size: 8vw;
		color: #001f62;
		font-style: normal;
		line-height: 9vw;
	}
	nav #gnav > li > ul > li:not(.page_item_has_children) > a > i{
		display: none;
	}

	@media screen and (max-width: 1023px) and  (min-width: 768px){
		nav #gnav > li > ul > li > a {
			padding: 2.2vw 15vw 2.2vw 4vw;
			font-size: 2.2vw;
		}
		nav #gnav > li > ul > li > a > i {
			width: 5vw;
			height: 5vw;
			top: 0.75vw;
			right: 1.8vw;
			font-size: 6vw;
			line-height: 4vw;
		}
	}
	/* 第三階層 */
	nav #gnav ul ul{
		padding: 2vw 0;
		border-bottom: solid 1px #3a5eab;
	}
	nav #gnav ul ul li a{
		padding: 3vw 3vw 3vw 6vw;
		font-size: 4.2vw;
	}
	nav #gnav ul ul li a::before{
		content: '- ';
	}
	/* 今いる階層は開いておく */
	#gnav .children{
		display: none;
	}
	@media screen and (max-width: 1023px) and  (min-width: 768px){
		nav #gnav ul ul li a {
			padding: 2vw 3vw 2vw 6vw;
			font-size: 2.2vw;
		}
	}
}

/* ---------------------------------------------------------
フッター
------------------------------------------------------------ */
footer{
	width:100%;
	position: relative;
}
footer #sitemap{
	background-color: #001f62;
	color: #fff;
	padding:30px calc( ( 100% - 1160px ) /2 );
}
footer #sitemap #gotop{
	position: absolute;
	top:30px;
	right: calc( ( 100% - 1160px ) /2 );
	font-size: 13px;
}

@media screen and (max-width: 1159px)  {
	footer #sitemap #gotop{
		top:20px;
		right: 10px;
	}
}
footer #sitemap #gotop a{
	color:#fff;
	position: relative;
	padding-right:22px;
}
footer #sitemap #gotop a::after{
	position: absolute;
	top: 0;
	right:0;
	content:'';
	width:18px;
	height:18px;
	background:url('../images/common/gotop.png') top right no-repeat;
	background-size: contain;
}
footer #sitemap a{
	color: #fff;
}
@media screen and (min-width: 1024px)  {
	footer #sitemap div{
		display: flex;
		justify-content: space-between;
		margin-bottom: 30px;
	}
}
footer #sitemap div .title{
	font-weight: 700;
}
footer #sitemap div li:not(.title){
	font-size: 14px;
}
footer #sitemap .foot{
	display: flex;
	justify-content: center;
}
@media screen and (min-width: 1024px)  {
	footer #sitemap .foot li:first-child{
		border-left: solid 1px #fff;
	}
	footer #sitemap .foot li{
		font-size: 14px;
		text-align: center;
		border-right: solid 1px #fff;
	}
	footer #sitemap .head{
		width:200px;
		margin-bottom: 40px;
	}
	footer #sitemap div .title{
		margin-bottom: 30px;
	}
	footer #sitemap div li:not(.title){
		margin-bottom:12px;
	}
	footer #sitemap .foot li{
		padding:0 50px;
	}
}
@media screen and (max-width: 1023px)  {
	footer #sitemap{
		padding:0;
	}
	footer #sitemap .head{
		padding: 16vw 10vw 6vw;
		border-bottom: solid 1px #fff;
	}
	footer #sitemap div li{
		padding: 4vw 6vw;
		text-align: center;
		border-bottom: solid 1px #fff;
	}
	footer #sitemap div li a{
		font-weight: 500;
		font-size: 14px;
	}
	footer #sitemap div li:not(.title){
		display: none;
		background-color: #d2def7;
	}
	footer #sitemap div li:not(.title) a{
		color: #001f62;
		display: block;
	}
	footer #sitemap .foot{
		flex-wrap: wrap;
		padding: 15px 0;
	}
	footer #sitemap .foot li{
		font-size: 13px;
		text-align: center;
		width: 50%;
		padding:3vw;
	}
}
@media screen and (max-width: 1023px) and  (min-width: 768px){
	footer #sitemap .head {
		padding: 7vw 30vw 3vw;}
	footer #sitemap div li {
		padding: 2vw 6vw;}
	footer #sitemap div li a {
		font-size: 2vw;}
	footer #sitemap .foot li {
		font-size: 1.6vw;
		width: 16.6%;
		padding: 2vw 0vw;
	}
}
footer #copy{
	padding:30px;
	color:#777;
	font-size: 14px;
	text-align: center;
	display: flex;
	justify-content: center;
	gap: 0 20px;
}
footer #copy p{
	display: flex;
	align-items: center;
}
footer #copy div{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
}
footer #copy a{
	display: flex;
	align-items: center;
}
@media screen and (max-width: 1023px)  {
	footer #copy{
		padding:3vw;
		font-size: 12px;
		display: block;
	}
}

/* ---------------------------------------------------------
基本スタイル
------------------------------------------------------------ */
button{
	border:none;
	display: block;
	background: transparent;
	text-align: center;
	margin: auto;
	font-size: 18px;
}
button:hover{
	opacity: .8;
}
button a{
	color: #fff;
	background-color: #001f62;
	display: block;
	margin: 0 auto;
	width: fit-content;
	padding:10px 60px 10px 40px;
	position: relative;
}
button a::after{
	position: absolute;
	width: 10px;
	height: 10px;
	content: '';
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	transform: rotate( 45deg );
	top:calc( 50% - .4em);
	right: 16px;
}

button.unlinked a{
	background-color: #fff;
	border:1px solid #001f62;
	color:#001f62!important;
	font-weight: normal;
	pointer-events: none;
	padding:2px 60px 2px 40px;
	font-size:14px;
}
button.unlinked:hover{
	opacity: 1;
}
/* ---------------------------------------------------------
ページャー
------------------------------------------------------------ */
.wp-pagenavi{
	margin:30px auto;
	display: flex;
	justify-content: center;
}
.wp-pagenavi > *{
	font-size: 16px;
	width: 34px;
	height: 34px;
	margin:6px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.wp-pagenavi > a{
	background-color: #efefef;
	border: solid 1px #ccc;
	color:#333
}

/* ---------------------------------------------------------
404
------------------------------------------------------------ */
.error404 #main{
	display: block;
	padding:100px 0;
}
.error404 #main h1{
	font-size: 36px;
	text-align: center;
	margin-bottom: 60px;
}
@media screen and (max-width: 1023px)  {
	.error404 #main h1{
		font-size: 24px;
		line-height: 1.6;
	}
}

/* ---------------------------------------------------------
検索結果
------------------------------------------------------------ */
.search-results main{
	display: block;
}
.search-results #main article{
	padding:30px 0;
	width: 100%;
}
.search-results #main dt{
	margin-top:10px;
}
.search-results #main dd{
	font-size: 12px;
	color: #006621;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
@media screen and (max-width: 1023px)  {
	.search-results #main article{
		padding:30px 5vw;
	}
}

/* ---------------------------------------------------------
資格シミュレーション
------------------------------------------------------------ */
button[type="submit"]{
	color: #fff;
    background-color: #001f62;
    display: block;
    margin: 0 auto;
    width: fit-content;
    padding: 10px 60px 10px 40px;
    position: relative;
}
.next button[type="submit"]::after{
	position: absolute;
	width: 10px;
	height: 10px;
	content: '';
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	transform: rotate( 45deg );
	top:calc( 50% - .4em);
	right: 16px;
}
/* ---------------------------------------------------------
テーブルソート
------------------------------------------------------------ */
.dataTables_filter{
	margin-bottom: 1rem;
}
#sortable th{
	white-space: nowrap;
}
#sortable .sort{
	cursor: pointer;
}
#sortable tfoot{
	display:table-header-group;
}
#tblsearch{
	margin-bottom: 10px;
}
#tblsearch input[type="search"]{
	float: left;
	margin-right: 10px;
	font-size: 18px;
}
#tblsearch input[type="submit"]{
	padding: 0 20px;
	margin: 0;
}
#tblsearch .hit{
	background-color: #fff8a6;
}