@charset "utf-8";
/* ケアハウス七つ星　共通 */

/* 全体 */
:root{
    --font-size12: calc(12/16*1rem);
    --font-size14: calc(14/16*1rem);
    --font-size15: calc(15/16*1rem);
    --font-size16: calc(16/16*1rem);
    --font-size17: calc(17/16*1rem);
    --font-size18: calc(18/16*1rem);
    --font-size20: calc(20/16*1rem);
    --font-size22: calc(22/16*1rem);
    --font-size24: calc(24/16*1rem);
    --font-size32: calc(32/16*1rem);
	
    --main-color: #3FBCDF;/*濃い水色*/
    --sub-color: rgba(219, 245, 255, 0.6);/*背景用　薄い水色*/
    --accent-color: #7FCBE7;/*水色　ナビなど*/
    --accent-color2: #F27BA4;/*濃いピンク*/
	--accent-color3: #F2B6D5;/*薄いピンク*/
    --white-color: #ffffff;
    --red-color: #ed1c24;
    --text-color: #222222;/*基本テキストカラー　フォント変えたので変更*/
    --text-color2: #666666;
    --text-color3: #444444;
    --bg-color: #fcfbe5;
}

body {
	font-family: "Noto Sans JP", "Helvetica Neue", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
	font-weight: 400;
	font-feature-settings: "palt";
	color: var(--text-color);
}


/* 基本設定： フォントサイズ */
/*body {font-size: 16px;}*/

p {
	line-height: 1.7;
}
a {
	color: #036EB7;
}
a:hover {
	transition: 0.3s;
	color: var(--main-color);
}
img {
	width: 100%;
    height: auto;
}

.tx_sm {
	font-size: var(--font-size14);
	line-height: 1.4;
}
.tx_lb {
	font-size: var(--font-size18);
	font-weight: bold;
}
.tx_b {
	font-weight: bold;
}
.tx_oreb {
	font-weight: bold;
    color: #f05a24;
}
.tx_greb {
	font-weight: bold;
    color: var(--accent-color);
}


/* ページ基本 */
.wrap {
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
	padding: 10px 20px;
}


/* h1ページタイトル */
.page-title {
	max-width: 188px;
}


/* h2.headingTitle */
section h2.headingTitle {
	position: relative;
	padding: 10px 0 ;
	font-size: var(--font-size22);
	line-height: 1.6;
	font-weight: 600;
	letter-spacing: 0.05em;
}
section h2.headingTitle:after {
	content: "";
	display: block;
	height: 3px;	
	background: -webkit-linear-gradient(left, #99CC33 50%, #FFF);
	background: -o-linear-gradient(left, #99CC33 50%, #FFF);
	background: linear-gradient(to right, #99CC33 50%, #FFF);
}
@media (max-width: 600px) {
	section h2.headingTitle {
		font-size: var(--font-size20);
	}
}

/* 見出し 星 */
.headingTitle-star {
 	display: flex;
  	align-items: center;
 	gap: 10px;
	font-size: var(--font-size24);
  	color: var(--text-color);
  	line-height: 1.4;
}
.headingTitle-star__icon {
	flex-shrink: 0;
	width: 26px;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	margin-top: 3px;/*調整*/
}
.headingTitle-star__text {
	flex: 1;
}


/* 見出し　ライン */
.headingTitle-line {
	font-size: var(--font-size24);
	line-height: 1.6;
	font-weight: 500;
	letter-spacing: 0.05em;
	border-bottom: 2px solid var(--accent-color);
}

@media (max-width: 600px) {
	.headingTitle-star {
		font-size: var(--font-size20);
	}
}


/*content-wrap共通*/
.content-wrap  {
 	max-width: 880px;
 	margin: 0 auto 40px;
 	display: flex;
 	flex-direction: column; /* スマホでは縦並び */
 	gap: 12px;
}

@media (min-width: 768px) {
	.content-wrap  {
		flex-direction: row;
		align-items: flex-start;
		justify-content: space-between;
		gap: 20px;
	}
	.content-title {
		width: 25%;
	}
	.content-txt {
		width: 72%;
	}
}


/* パンくずリスト */
.bread ol {
	display: flex;
	justify-content: flex-end;
	margin: 0;
	padding: 0;
	list-style: none;
}

.bread li {
	display: block;
	padding: 5px;
	color: #666;
	font-size: var(--font-size14);
	text-decoration: none;
}
.bread li a::after {
	margin-left: 10px;
	content: '\f105';
	font-family: 'FontAwesome';
}
.bread li a:hover {
	color: #3FBDE0;
}
@media (max-width: 600px) {
	.bread ol {
		display: none;/*600px以下は表示しない*/
	}
}


/* header */
header {
	background-color: var(--white-color);
}
header .headerTop {
	height: 100px;
	padding: 10px;
	text-align: center;

}
header .siteTitle a {
	display: block;
}
.siteTitle {
	max-width: 244px;
}

header .submenu li {
	display: inline-block;
	margin-top: 10px;
	margin-left: 10px;
	font-size: var(--font-size17);
}
header .submenu li a {
	color: var(--text-color);
}
header .submenu li a:hover {
	color: var(--main-color);
}

header .submenu li.teltx {
	font-size: var(--font-size24);
	line-height: 1.4;
}
header .submenu li span.fa {
	color: var(--main-color);
}


@media (min-width: 769px) {
	header .headerTop {
	display: flex;
	justify-content: space-between;
	align-items: center;
	max-width: 1000px;
	height: 60px;
	margin-left: auto;
	margin-right: auto;
	}
	header .submenu li a {
		margin-left: 20px;
	}
}

nav.head_menu {
	background: var(--accent-color);
}
nav.head_menu ul {
	max-width: 1000px;
	margin: 0 auto;
}
nav.head_menu>ul:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
nav.head_menu>ul>li {
	float: left;
	width: 20%;/*6分割のとき16.6666%*/
	position: relative;
	font-size: var(--font-size18);
}
nav.head_menu a {
	display: block;
	color: #111;
	text-decoration: none;
	background: var(--accent-color);
	padding: 14px 10px;
}

nav.head_menu>ul>li:first-child>a {
	border-left: 1px solid #70B6D0;
}
nav.head_menu>ul>li>a {
	border-right: 1px solid #70B6D0;
	text-align: center;
}
nav.head_menu>ul>li>a:hover {
	background: var(--main-color);
}


@media only screen and (max-width: 768px) {
	header {
		position:relative;
		/*height: 135px;高さ調整*/
		height: auto;/*追加*/
		padding-top: 10px;
	}
	header .headerTop {
	    padding:inherit;
	}	
	header .siteTitle  {
		margin-inline: auto;
	}
	nav.head_menu a {
		position: relative;
		padding: 12px 10px;
	}
	nav.head_menu a::after {
		position: absolute;
		top: 50%;
		margin-top: -10px;
		left: 15px;
		font-family: FontAwesome;
		content: "\f105";
	}
	nav.head_menu>ul {
		margin-top: 0px;
	}
	nav.head_menu>ul>li {
		float: left;
		width: 50%;
		font-size: var(--font-size17);
        letter-spacing: 0.08em;
	}
	nav.head_menu>ul>li>a {
		padding-left: 30px;
		text-align: left;
		border-right: 1px solid #70B6D0;
		border-bottom: 1px solid #70B6D0;
	}
	nav.head_menu>ul>li:first-child>a {/*border-leftを消去*/
		border-left: none;
	}
	header .submenu li.teltx {
		font-size: var(--font-size20);
	}
	header .submenu li {
		font-size: var(--font-size14);
	}
	nav.head_menu>ul>li:last-child>a {/*border-rightを消去*/
		border-right: none;
	}
}

@media (max-width: 600px) {/* 424px*/
	header {
		/*height: 128px;*/
		height: auto;/*追加*/
	}
	header .headerTop {
		height: 110px;/*110px*/
	}
	header .submenu li {
		margin-top: 15px;
		margin-bottom: 0;
		padding: 0;
		font-size: var(--font-size16);
		}
		header .submenu li.grouptx {
		display: none;/*グループリンク、スマホはnone*/
	}
}


/*カテゴリー内リンクバナー*/
aside {
  background: var(--bg-color);
  padding-top: 5px;
  padding-bottom: 15px;
}

.linkBox .link-item {
	text-align: center;
}

.linkBox .link-item {
	text-align: center;
	letter-spacing: 0.1em;
}
.linkBox .link-item a {
	width: 100%;
	display: inline-block;
	margin-top: 8px;
	padding: 12px 0px;
	border-radius: 4px;
	background-color: var(--main-color);
	color: var(--white-color);
	font-size: var(--font-size17);
	text-decoration: none;
}

.linkBox .link-item a:hover {
	background-color: var(--white-color);
	color: #111;
}
.linkBox .link-item.current a  {
	color: #111;
	background: var(--white-color);
}
@media (min-width: 769px) {
	aside {
	  padding-top: 0px;
	  padding-bottom: 0px;
	}
	.linkBox .container {
		display: flex;
		max-width: 1000px;
		margin-left: auto;
		margin-right: auto;
	}

	.linkBox .link-item {
		flex: 1;
		width: 33.333%;
	}
	.linkBox .link-item {
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 5px;
	}
	.linkBox .link-item a {
		width: 200px;
		margin-top: 20px;
		margin-bottom: 20px;
		padding: 20px 20px;
	}
}


/* フッター */
footer {
	background: url("../img/footer_bg.png") center bottom;
	background-size: cover;
}

footer .container {
	padding: 35px 20px 20px;
}

@media (min-width: 768px) {
	footer .container {
		display: flex;
		flex-wrap: wrap;
		max-width: 1000px;
		margin-left: auto;
		margin-right: auto;
	}
	.foot_info {
		flex: 0 0 50%;
		width: 46%;
	}
	.foot_menu {
		flex: 0 0 50%;
		width: 50%;
	}

	.foot_copy {
		flex: 0 0 100%;
		width: 100%;
	}
}


/* foot_info： 組織名連絡先 */
.foot_info {
	margin-bottom: 30px;
}
.foot_info h2 {
	margin-top: 0;
	font-size: var(--font-size20);
    line-height: 1.6;
}
.foot_info h3 {
	margin-top: 0;
	margin-bottom: 15px;
	font-size: var(--font-size15);
}

.foot_info p {
	margin-top: 5px;
	margin-bottom: 0;
	font-size: var(--font-size14);
	line-height: 1.5;
}
.foot_info p.catch {
	margin-right: 5px;
}
.foot_info a {
	color: inherit;
	text-decoration: none;
}
footer p.maplink {
	margin-top: 14px;
}
footer p.maplink a:hover {
	color: var(--main-color);	
}

/* foot_menu： フッターメニュー */
.foot_menu div {
	margin-bottom: 20px;
	color: var(--text-color2);
}

.foot_menu h4 {
	margin-bottom: 10px;
}

.foot_menu ul {
	margin: 0;
	padding: 0;
	position: relative;
}
.foot_menu ul li:before {
  font-family: FontAwesome;
  content: "\f105";
  position: absolute;
  left : 0em;
  color: var(--main-color);
}
.foot_menu ul li {
	margin-left: 10px;
	font-size: var(--font-size14);
	line-height: 1.4;
	text-decoration: none;
	padding: 4px;
}
.foot_menu ul li a {
	color: var(--text-color2);
	text-decoration: none;
}
.foot_menu ul li a:hover {
	color: var(--main-color);
}

@media (min-width: 768px) {
	.foot_menu {
		display: flex;
	}
	.foot_menu div {
		flex: 1;
	}
	.foot_menu div:not(:first-child) {
		margin-left: 40px;
	}
}


/* foot_copy： コピーライト */
.foot_copy {
	font-size: var(--font-size12);
	line-height: 1.4;
	color: var(--text-color3);
	text-align: center;
	font-family: sans-serif;
}


/* topに戻る */
#gototop {
  z-index: 24000;
  position: fixed;
  bottom: 0%;
  right: 0%;
}
#gototop a {
  display: block;
  text-decoration: none;
  background: #eee;
  color: var(--accent-color);
  text-align: center;
  width: 40px;
  line-height: 1.5;
  padding: 10px;
}
#gototop a:hover {
  opacity: 0.6;
}

.mb10 {
	margin-bottom: 10px;
}
.mb20 {
	margin-bottom: 20px;
}
.mb30 {
    margin-bottom: 30px;
}
.mb40 {
    margin-bottom: 40px;
}
.mb50 {
	margin-bottom: 50px;
}


/* 改行 */
@media (min-width: 501px){   
  .pc_br { display:block; }
  .sp_br { display:none; }
}
@media (max-width: 500px){   
  .pc_br { display:none; }
  .sp_br { display:block; }
}
