@charset "utf-8";
/* CSS Document */
/*--------------------------------------

エリアで探す(area_city.php) PC

--------------------------------------*/

/*--------------------------------------
ページヘッダー
--------------------------------------*/
.page-header {
  width: 100%;
  height: 150px;
  color: #fff;
	display: flex;
  align-items: center;
  background: url('../img/renewal/enlist/header-bg.jpg') no-repeat center center;
  background-size: cover;
	box-sizing: border-box;
}

.page-header-inner {
	width: 1100px;
	margin: 0 auto;
	display: flex;
  align-items: center;
  justify-content: flex-start;
}

.page-title {
	font-family: 'Noto Sans JP', sans-serif;
  font-size: 28px;
	font-weight: bold;
}

/*--------------------------------------
パンくずリスト
--------------------------------------*/
.breadcrumb_wrapper {
	border-bottom: 1px solid #DDD;
	padding-top: 18px;
	padding-bottom: 18px;
}
.breadcrumb{
	width:1100px;
	display:flex;
	align-items:center;
	margin:0 auto;
	font-size:14px;
}
.breadcrumb li{
	display:inline-block;
	position: relative;
	vertical-align:bottom;
}
.breadcrumb li:after{
	content:'>';
	display: inline-block;
	position: relative;
	margin-left:10px;
	margin-right:10px;
}
.breadcrumb li:first-child:after{
	transform: translateY(-3px);
}
.breadcrumb li:last-child:after{
	content:'';
}

/*--------------------------------------
ページ内リンク
--------------------------------------*/
.area-link-btn{
    width: 100%;
    display: flex;
    justify-content: space-between;
		gap: 4px;
		margin-top: 56px;
}

.area-link-btn a{
		width: 87px;
		background: url(../img/chevron-icon-down.svg) 90% 14px / 11px 5px no-repeat #5BBCC9;
		border-radius: 6px;
		color: #fff;
		display: block;
		font-size: 13px;
		font-weight: bold;
		line-height: 1.4;
		padding: 8px 0 8px 8px;
		transition: 0.5s all;
}

.area-link-btn a:hover{
		background: url(../img/chevron-icon-down.svg) 90% 18px / 11px 5px no-repeat #4CD8E5;
		transition: 0.5s all;
}

/*--------------------------------------
チェックリスト 全体の枠
--------------------------------------*/
.area_wrap{
	width:1100px;
	margin:0 auto;
	margin-bottom: 160px;
}
.area_wrap table{
	width:100%;
	margin-top:40px;
}
.area_wrap table tr{
	display:block;
}
.area_wrap table tr + tr{
	margin-top: 20px;
}
.area_wrap table th{
	min-width:300px;
	background-color:#EEEEEE;
	text-align:left;
	padding:40px 30px;
	font-size: 15px;
	font-weight:bold;
	line-height: 20px;
	vertical-align:top;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
	box-sizing: border-box;
}
.area_wrap table td{
	padding:40px 30px;
	background-color:#F5F5F5;
	width:100%;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
}
.area_wrap table th.zeniki,
.area_wrap table td.zeniki {
	color:#222222;
	background-color:#CCEDF2;
}
.area_wrap table td ul.olist{
	display:grid;
	width: 100%;
	grid-template-columns: repeat(3, 1fr);
	row-gap: 22px;
}
/*チェックボックス*/
input[type=checkbox] {
  display: none;
}
.checkbox {
  box-sizing: border-box;
  -webkit-transition: background-color 0.2s linear;
  transition: background-color 0.2s linear;
  position: relative;
  display: inline-block;
	padding-left: 28px;
  border-radius: 8px;
  vertical-align: middle;
  cursor: pointer;
	font-size: 15px;
	line-height: 20px;
}
.checkbox:after {
	box-sizing: border-box;
  -webkit-transition: border-color 0.2s linear;
  transition: border-color 0.2s linear;
  position: absolute;
  top: -1px;
  left: 0px;
  display: block;
  width: 20px;
  height: 20px;
  border: 1px solid #CCC;
  border-radius: 4px;
  content: '';
	background-color: #FFF;
}
.checkbox:hover:after {
	box-sizing: border-box;
	border: 1px solid #5BBCC9;
}
.checkbox:before {
  -webkit-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
  position: absolute;
  top: 0;
  left: 6px;
  display: block;
  width: 6px;
  height: 10px;
  border-right: 2px solid #FFF;
  border-bottom: 2px solid #FFF;
  content: '';
  opacity: 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
	z-index: 1;
}
.all{
	padding: 8px 12px 0 35px;
}
.all:after{
	left: 0;
}
.all:before{
	left: 8px;
}
input[type=checkbox]:checked + .checkbox:before {
  opacity: 1;
}
input[type=checkbox]:checked + .checkbox:after {
  background-color: #5BBCC9;
	border: solid 1px #5BBCC9;
}
.submit_wrap{
	margin-top:60px;
	width:1100px;
}
.submit_wrap .submit{
	width:320px;
	height:55px;
	background-color:#5BBCC9;
	font-size: 16px;
	font-weight: 700;
	line-height: 23px;
	color: #FFFFFF;
	border-radius: 6px;
	margin:0 auto;
	display:block;
	cursor:pointer;
}
/*--------------------------------------
フッターバナー一覧
--------------------------------------*/
.footer_banner{
	clear:both;
	background-color: #FFF2C5;
	margin-top:100px;
	padding:30px 0;
}
.footer_banner ul{
	width:1120px;
	margin:0 auto;
}
.footer_banner ul li{
	float:left;
	margin-right:20px;
}
.footer_banner ul li:last-child{
	margin-right:0;
}
#top-bar{
	margin: 0 auto;
}
#top-bar{
	margin: 0 auto;
}