@charset "UTF-8";
/* CSS Document */
//ブレイクポイントを指定------ここから
$xl: 1399px;
$lg: 1199px;
$md: 991px;
$sm: 767px;
$xs: 575px;

@mixin xl {
  @media screen and (max-width: ($xl)) {
    @content;
  }
}
@mixin lg {
  @media screen and (max-width: ($lg)) {
    @content;
  }
}
@mixin md {
  @media screen and (max-width: ($md)) {
    @content;
  }
}
@mixin sm {
  @media screen and (max-width: ($sm)) {
    @content;
  }
}
@mixin xs {
  @media screen and (max-width: ($xs)) {
    @content;
  }
}
//ブレイクポイントを指定------ここまで

//メインカラー指定
$color-pink: #ed848b;
$color-blue: #007ac5;
$color-yellow: #fff2cb;
$color-orange: #f8ad4e;

#page-intro{
	height: 51px;
	@include xs {
		height: 77px;
	}
}

.headline{
	&::before {
		font-family: "Font Awesome 5 Free";
		content: "\f015";
	}
}
//.accordion-contents section{
//	margin-bottom: 4rem;
//}

.accordion-contents{
	margin-bottom: 2rem;
}

.ac-menu .accordion-contents section table.contact-table{
	width: 80%;
	@include sm {
		width: 90%;
	}
	tr{
		th{
			width: 45%!important;
			text-align: left;
			text-justify:inherit;
			text-align-last: inherit;
			text-justify:inherit;
			padding-right: 4rem;
			padding-left: 4rem;
			@include sm {
				width: 60%;
			}
			@include xs {
				width: 100%!important;
				display: block;
				text-align: center;
				padding-right: 1rem;
				padding-left: 1rem;

			}
		}
		td{
			text-align: center;
			@include xs {
				width: 100%;
				display: block;
				text-align: center;
			}
		}
	}
}

//全体-------------------------------------------
.links {
    margin-top: 2rem;
}
.links li a {
	@include sm {
    	width: 80%;
	}
	@include xs {
    	width: 100%;
	}
}
h4 {
    font-size: 18px;
    font-size: 1.8rem;
    color: #007ac5;
    font-weight: 500;
}

//connection　社会福祉法人連絡会---------------------------------------------
#connection {
}
//life-support　ライフサポート事業---------------------------------------------
#life-support {
}
//work-experience　お仕事体験事業---------------------------------------------
#work-experience {
}
//evacuation-area　避難場所提供事業---------------------------------------------
#evacuation-area {
}
//demae-kouza　子育て・福祉出前講座---------------------------------------------
#demae-kouza {
}

//member参加している法人（12法人）---------------------------------------------
#member {
	.frame {
		background-color: #FFFFFF;
		border: solid 1px $color-pink;
	}
	.inner {
		width: 90%;
		margin: auto;
		padding-top: 2rem;
		@include sm {
			padding-top: 2rem;
		}
		@include xs {
		padding-left: 0.5rem;
		padding-right: 0.5rem;
		}
	}
	#member-table {
		margin: auto;
		width: 90%;
		table {
			margin-bottom: 0;
			tr {
				td {
					width: 50%;
					padding-left: 3rem;
					@include lg {
						padding-left: 2rem;
						font-size: 92%;
					}
					@include sm {
						width: 100%;
					}
					@include xs {
						padding-left: 2rem;
						font-size: 86%;
					}
				}
			}
			tr:nth-of-type(2n+1) td {
				background: #FFF2D0;
			}
		}
		table + table {
			border-left: 1px dotted #979797;
			@include sm {
				border-left: none;
				margin-top: 0;
			}
		}
		table + table :first-child {
			@include sm {
				border-top: none;
			}
		}
	}
	p {
		width: 95%;
		margin-top: 0.5rem;
	}
}


//お問い合わせ
section{
	h4{
		font-size: 18px;
		font-size: 1.8rem;
		color: $color-blue;
		font-weight: 500;
		&:before{
			font-family: "Font Awesome 5 Free";
			content: "\f138";
			font-weight: 900;
			padding: 10px 5px 0px 10px;
			color: $color-blue;
			display: inline-block;
		}
	}
	table{
		width: 90%;
		margin: auto;
		margin-bottom: 3rem;
		margin-top: 1rem;
		@include lg {
			font-size: 91%;
		}
		@include md {
			font-size: 100%;
		}
		tr{
			border-top: 1px dotted #979797;
			th{
				font-weight: normal;
				background: #FFF2D0;
				padding: 1rem 1rem 1rem 3rem;
				@include xs {
					width: 100%;
					display: block;
				}
			}
			td{
				padding: 1rem 1rem 1rem 3rem;
				line-height: 1.5em;
				background: #ffffff;
				@include xs {
					width: 100%;
					display: block;
				}
				span{
					font-size: 18px;
					font-size: 1.8rem;
					font-weight: 500;
					margin-left: 1em;
				}
			}
		}
		tr:last-child{
			border-bottom:  1px dotted #979797;
		}
	}
}