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

/*================================
ハピネスさんあいとは
================================*/
.aboutbox{
	position: relative;
	background-color: #fff;
	border: #f5f5f3 2px solid;
	padding: 10px;
}
.aboutbox::before{
	content: '';
	display: inline-block;
	width: 80px;
	height: 80px;
	position: absolute;
	top: 0;
	left: 0;
}
.aboutbox:nth-child(1)::before{ background-image: url("../img/about/about_num01.png");}
.aboutbox:nth-child(2)::before{ background-image: url("../img/about/about_num02.png");}
.aboutbox:nth-child(3)::before{ background-image: url("../img/about/about_num03.png");}
.aboutbox:nth-child(4)::before{ background-image: url("../img/about/about_num04.png");}
.aboutbox:nth-child(5)::before{ background-image: url("../img/about/about_num05.png");}
.aboutbox:nth-child(6)::before{ background-image: url("../img/about/about_num06.png");}
.aboutbox img{
	margin: 0 auto 1rem;
	display: block;
}
.aboutbox p{ margin-bottom: 0;}
@media (min-width: 768px){
	.aboutbox p{ text-align: center;}
}

/*理念・パーパス
================================*/
.philosophy,
.purpose{
	position: relative;
	text-align: center;
	padding: 1.5rem 0;
}
.philosophy::before,
.purpose::before{
	content: '';
	display: inline-block;
	width: 150px;
	height: 150px;
	border-radius: 50%;
	background: radial-gradient( rgba(250, 190, 0, .15) 0%, rgba(250, 190, 0, 0) 70%, rgba(250, 190, 0, 0) 100%);
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
	transition: .3s;
}
.philosophy p.main,
.purpose p.main{
	font-size: calc(.85rem + 1.2vw);
	margin-bottom: 0;
}

@media (min-width: 1200px){
	.philosophy p.main,
	.purpose p.main{ font-size: 1.8rem;}
	.philosophy p,
	.purpose p{ font-size: 1.125rem;}
}
@media (min-width: 768px){
}
@media (max-width: 767px){
}

/*行動指針
================================*/
.guidelines{
	border: #e4e4e4 1px solid;
	text-align: center;
	padding: 2rem 1rem;
}
.guidelines ul{
	display: inline-block;
	text-align: left;
	list-style: none;
	padding-left: 0;
	margin-bottom: 0;
}
.guidelines ul li:not(:last-child){ margin-bottom: .5rem;}
@media (min-width: 768px){
	.guidelines ul li{ font-size: 1.2rem;}
}
@media (max-width: 767px){
	.guidelines ul li{ font-size: 1.05rem;}
}

/*================================
概要・アクセス
================================*/
/*概要
================================*/
#overview .table > :not(caption) > * > *{ border-bottom-width: 0;}
#overview .table-striped > tbody > tr:nth-of-type(odd){ background-color: #f5f5f3;}
#overview .table th{ font-weight: normal;}
@media (min-width: 768px){
	#overview .table > :not(caption) > * > *{ padding: 1rem;}
}
@media (max-width: 767px){
	#overview .table th,
	#overview .table td{
		width: 100%;
		display: block;
	}
	#overview .table th{ border-bottom: #cacaca 1px solid;}
}

/*アクセス
================================*/
.access_txt{ text-align: center;}
.access_txt ul{
	list-style: none;
	padding-left: 0;
	display: inline-block;
	text-align: left;
}
.direction{
	border: #e4e4e4 1px solid;
	padding: .85rem;
}
.direction h3{
	font-size: 1.1rem;
	font-weight: bold;
}
.direction p{ margin-bottom: 0;}
#gmap iframe{ width: 100%;}

@media (min-width: 1200px){
	.direction:not(:first-child){ margin-top: .85rem;}
}
@media (min-width: 768px) and (max-width: 1199px){
	.direction:not(:first-child){ margin-top: 1rem;}
}
@media (min-width: 768px){
	.access_txt ul{
		display: flex;
		justify-content: center;
	}
	.access_txt ul li:not(:last-child){
		position: relative;
		margin-right: 1rem;
	}
	.access_txt ul li:not(:last-child)::before{
		content: '/';
		display: inline-block;
		position: absolute;
		right: -.8rem;
	}
	#gmap iframe{ height: 350px;}
}
@media (max-width: 767px){
	.direction{ margin-top: 1rem;}
	#gmap iframe{ height: 250px;}
}

/*================================
サービス内容
================================*/
.service_ttl{
	font-weight: bold;
	text-align: center;
	margin-bottom: 0;
}
.service_ttl span{
	font-size: 60%;
	margin-bottom: .5rem;
	display: block;
}
.service h4{ margin-bottom: 1.5rem;}
.service p:last-child,
.service ul:last-child{ margin-bottom: 0;}
.use_list{
	list-style: none;
	padding-left: 0;
}
.use_list:last-child{ margin-bottom: 0;}
.use_list li{ margin-bottom: .5rem;}
.use_list li:last-child{ margin-bottom: 0;}
.use_list li .use_ttl{
	width: 165px;
  font-size: .85rem;
	font-weight: normal;
	text-align: center;
	border: #e4e4e4 1px solid;
	border-radius: 2px;
	padding: .2rem .5rem;
}
.service .disc_list{ padding-left: 1.5rem;}
@media (min-width: 768px){
	.use_list li{
		display: flex;
		align-items: flex-start;
	}
	.use_list li .use_ttl{ margin-right: .5rem;}
	.use_list li .use_txt{
		flex: 1;
		padding: .15rem 0;
	}
}
@media (max-width: 767px){
	.service_ttl{ margin-top: 3rem;}
	.use_list li span{ display: block;}
	.use_list li .use_ttl{ margin-bottom: .5rem;}
	.service_photo{ margin-top: 2rem;}
}

/*施設サービス
================================*/
.facility .service_ttl span{ color: #79bae2;}
.facility .service h4{ color: #79bae2;}

/*ページ下部背景*/
.facility_bg{
	background-image:url("../img/service/facility/tokuyo02.jpg");
	background-size: cover;
	background-position: center;
	margin-top: 4rem;
}
@media (min-width: 768px){
	.facility_bg{ height: 300px;}
}
@media (max-width: 767px){
	.facility_bg{ padding-top: 40%;}
}

/*在宅サービス
================================*/
.home .service_ttl span{ color: #fc7d70;}
.home .service h4{ color: #fc7d70;}
#service_point{ padding: 2rem 0;}
#service_point .point{
	background-color: #fff;
	text-align: center;
	border-color: #f5f5f3;
	border-style: solid;
	border-top-width: 5px;
	border-bottom-width: 5px;
}
#service_point .point h5{
	font-weight: bold;
}
#service_point .point p{
	display: inline-block;
	text-align: left;
	margin-bottom: 0;
}
#service_point .point img{ margin-bottom: .5rem;}
.home_help{ margin-top: 2.5rem;}
@media (min-width: 768px){
	#service_point .point{ padding: 1rem;}
}
@media (max-width: 767px){
	#service_point .point{ padding: 1rem .5rem;}
}

/*ページ下部背景*/
.home_bg{
	background-image:url("../img/service/home/home_bg.jpg");
	background-size: cover;
	background-position: center;
	margin-top: 4rem;
}
@media (min-width: 768px){
	.home_bg{ height: 300px;}
}
@media (max-width: 767px){
	.home_bg{ padding-top: 40%;}
}

/*地域支援
================================*/
.support .service_ttl span{ color: #69cc9d;}
.support .service h4{ color: #69cc9d;}

/*地域包括センター・留守家庭育成室*/
#support_center .service,
#support_kosodate .service{
	background-color: #fff;
	text-align: center;
}
#support_center .service .use_list{
	display: inline-block;
	text-align: left;
}
.center_list{
	list-style: none;
	padding-left: 0;
	margin-bottom: 1.5rem;
}
.center_list li{
	color: #fff;
	background-color: #69cc9d;
	padding: .25rem;
}
@media (min-width: 768px){
	#support_center .service,
  #support_kosodate .service{
    padding: 2rem 1.5rem;
  }
	.center_list{
		display: flex;
    justify-content: center;
		font-size: 1.1rem;
	}
	.center_list li{
		margin: 0 .25rem;
	}
  #support_center .center_list li{
		width: 33.33333%;
	}
  #support_kosodate .center_list li{
		width: 36%;
	}
}
@media (max-width: 767px){
	#support_center .service,
  #support_kosodate .service{
    padding: 1.5rem .75rem;
  }
	.center_list{
		max-width: 270px;
		margin-left: auto;
		margin-right: auto;
		font-size: .85rem;
	}
	.center_list li:not(:last-child){ margin-bottom: .5rem;}
	.center_txt{ text-align: left;}
}

/*================================
施設紹介
================================*/
.facility .f_photo{
	position: relative;
	margin-bottom: 1rem;
}
.facility .f_photo h3{
	position: absolute;
	left: 0;
	bottom: 0;
	font-size: 1.1rem;
	font-weight: bold;
	background-color: #fff;
	padding: .25rem 1rem;
	margin-bottom: 0;
}
#facility_day{ position: relative;}
#facility_day::before,
#facility_day::after{
	content: '';
	display: inline-block;
	width: 60%;
	height: 60%;
	background-image: url("../img/bg_circle.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	position: absolute;
	z-index: -1;
}
#facility_day::before{
	top: 5%;
	left: -25%;
}
#facility_day::after{
	right: -25%;
	bottom: 5%;
}
.day_service h3{ font-size: calc(1.275rem + 0.3vw);}
.f_other h4{
	font-size: 1.1rem;
	margin-top: .5rem;
	font-weight: bold;
}
.f_other p{ margin-bottom: 0;}
.o2box_txt{ text-align: center;}
.o2box_txt p{
	display: inline-block;
	text-align: left;
}
.efficacy{
	text-align: left;
	max-width: 520px;
	border: #e4e4e4 1px solid;
	padding: 1rem;
	margin: 1rem auto 3rem;
}
.efficacy ul{ margin-bottom: 0;}

@media (min-width: 1200px){
	.day_service h3{ font-size: 1.5rem;}
}
@media (min-width: 992px){
	#facility_other{ background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 35%, #f9f3e4 35%, #f9f3e4 100%);}
}
@media (min-width: 768px) and (max-width: 991px){
	#facility_other{ background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 20%, #f9f3e4 20%, #f9f3e4 100%);}
}
@media (min-width: 768px){
	.day_service .row:not(:last-child){ margin-bottom: 3rem;}
	.day_service h3{ margin-top: 1rem;}
	.efficacy{
		display: flex;
		justify-content: center;
	}
	.efficacy ul:not(:last-child){ margin-right: 1rem;}
}
@media (max-width: 991px){
	.f_other{ margin-top: 1rem;}
}
@media (max-width: 767px){
	.day_service h3{ margin-top: .5rem;}
	#facility_other{ background-color: #f9f3e4;}
}


/*================================
よくある質問
================================*/
#q_a .accordion{ border-bottom: #e4e4e4 1px solid;}
#q_a .accordion-item{ border-color: #e4e4e4;}
#q_a .accordion-header{ position: relative;}
#q_a .accordion-header::before{
	content: '';
	display: inline-block;
	width: 26px;
	height: 26px;
	background-color: #eec02c;
	border-radius: 50%;
	position: absolute;
	top: 1rem;
	right: .5rem;
}
#q_a .accordion-button{
	background-color: transparent;
	box-shadow: none;
	padding: 1rem 3rem 1rem 2rem;
}
#q_a .accordion-button::before,
#q_a .accordion-button::after{
	content: '';
	display: block;
	background-color: #fff;
	position: absolute;
	border-radius: 10px;
	border: none;
}
#q_a .accordion-button::after{
	left: auto;
	top: 28px;
	right: 14px;
	width: 14px;
	height: 2px;
}
#q_a .accordion-button::before{
	top: 22px;
	right: 20px;
	width: 2px;
	height: 14px;
	transition: .3s;
}
#q_a .accordion-button[aria-expanded="true"]::before{ display: none;}
#q_a .accordion-button span{
	position: relative;
	font-size: 1.1rem;
	font-weight: bold;
}
#q_a .accordion-button span::before{
	content: 'Q．';
	display: inline-block;
	font-size: 1.3rem;
	position: absolute;
	top: -.25rem;
	left: -1.5rem;
}

#q_a .accordion-button:not(.collapsed){ color: #f29da6;}
#q_a .accordion-body{ padding: 1rem;}
#q_a .accordion-body p{
	position: relative;
	padding-left: 1.1rem;
}
#q_a .accordion-body p::before{
	content: 'A．';
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
}

/*================================
お問い合わせフォーム
================================*/
.contact_txt{ margin-bottom: 3rem;}
.error_box{
	background-color: #f5f5f3;
	padding: 1rem;
	margin-bottom: 3rem;
}
.error_box p{ color: #bf272d;}
.form_table{ border-color: #fff;}
.form_table .required{ color: #bf272d;}
.formError{
	left: 0 !important;
	margin-top: 8px !important;
}
.formError .formErrorArrow{ display: none;}
.formErrorContent{
	background-color: #bf272d !important;
	border: none !important;
	box-shadow: none !important;
	border-radius: 0 !important;
}
.form_table th{ font-weight: normal;}
.form_table .form-group{
	position: relative;
	margin-bottom: 1rem;
}
.zip{
	display: flex;
	align-items: center;
}
.zip input{ width: 216px;}
.zip p{
	font-size: .85rem;
	text-indent: -.85rem;
	padding-left: .85rem;
	margin-bottom: 0;
}
.email p{
	font-size: .85rem;
	text-indent: -.85rem;
	padding-left: .85rem;
	margin-bottom: 0;
}
.email p:not(:last-child){ margin-top: 0.25rem;}
.address label:not(:first-child){ margin-top: .5rem;}
div:not(#confirm) .form_table{ margin-bottom: 1rem;}
.form_table .form-inline{
	display: inline-block;
	min-width: 240px;
}
.btnbox{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 2rem;
}
#confirm .btnbox{ margin-top: 3rem !important;}
.submit,
.btn_submit{ transition: .3s;}
.btn_submit{
	color: #333;
	border: #333 1px solid;
	border-radius: 0;
	padding: .65rem 1rem;
	text-align: center;
}
.btn_submit:hover{
	color: #fff;
	background-color: #333;
}
#confirm .form_table .form-group{ margin-bottom: 0 !important;}
#confirm .form_table{ border-color: #e4e4e4;}
.return{ margin-right: 1rem;}
.btn_return{
	position: relative;
	color: #000;
	border: #333 1px solid;
	border-radius: 0;
	background-color: #f5f5f3;
	text-align: center;
	padding: .65rem 1rem;
	transition: .3s;
}
.btn_return:hover{ color: #000;}
@media (min-width: 768px){
	.zip input{ margin: 0 1rem 0 .5rem;}
	.submit,
	.btn_submit{ width: 250px;}
	.btn_return{ width: 155px;}
}
@media (max-width: 767px){
	.form_table th,
	.form_table td{
		width: 100%;
		display: block;
	}
	.zip{ flex-wrap: wrap;}
	.zip input{ margin-left: .5rem;}
	.zip p{
		width: 100%;
		margin-top: .25rem;
	}
	#confirm .form_table th{ padding-bottom: 0;}
	.submit_func{ width: 50%;}
	.btn_return,
	.btn_submit{
		font-size: .8rem;
	}
	.submit,
	.btn_submit{
		width: 100%;
		max-width: 250px;
	}
	#confirm .submit,
	#confirm .btn_submit{ flex: 1;}
}

/*================================
プライバシーポリシー
================================*/
.privacy_policy{
	counter-reset: h3;
	margin-top: 3rem;
}
.privacy_policy h3{
	font-weight: normal;
	padding-left: 1.2rem;
	text-indent: -1.2rem;
}
.privacy_policy h3::before{
  counter-increment: h3;
  content: counter(h3) ". ";
}
.privacy_policy dl{
	counter-reset: dl;
	margin-bottom: 0;
}
.privacy_policy dl dt{ margin-bottom: .5rem;}
.privacy_policy dl dt::before{
  counter-increment: dl;
  content: "（" counter(dl) "） ";
}
.privacy_policy dl dd{ margin-bottom: 1.5rem;}
.privacy_policy dl dd ol{
	padding-left: 1.5rem;
	margin-top: 1rem;
	margin-bottom: 0;
}
