
/******************************************************************************
/* インデックス設定
******************************************************************************/



.pcOnly {
	display: block;
}
@media screen and (max-width: 767px){
	.pcOnly {
		display: none;
	}
}

.spOnly {
	display: none;
}
@media screen and (max-width: 767px){
	.spOnly {
		display: block;
	}
}


/******************************************************************************
/* ベース設定
******************************************************************************/

.life_main_image {
	display: block;
	width: 100%;
	height: 400px;
	overflow: hidden;
	margin: 0;
}

.life_main_image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media screen and (max-width: 767px){
	.life_main_image {
		height: 45vw;
	}
}


/******************************************************************************
/* ベース設定
******************************************************************************/


.content_100 {
	box-sizing: border-box;
	max-width: 1200px;
	margin: 0 auto;
	width: 100%;
	text-align: left;
	font-feature-settings: "palt";

	}

.content_100_in {
	width: 100%;
	display: block;
	text-align: left;
	margin: 0 auto 0 auto;

	}
@media screen and (max-width: 1300px){
	.content_100_in {
		width: 86%;
	}
}

@media screen and (max-width: 767px){
	.content_100_in {
		width: 90%;
		margin: 0 auto 0 auto;
	}
}


/********************************************************************************************************
/* メインボックス
*********************************************************************************************************/

.title_box_100 {
	width: 100%;
	position: relative;
 	background-color: #DFEDD7;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
	padding-top: 20px;
	padding-left: 25px;
	padding-right: 25px;
	padding-bottom: 20px;
	border-radius: 5px;
	height: 100%;
	box-sizing: border-box;
	font-weight: 700;
	color: #4B7435;
	letter-spacing: 1.5px;
	font-size: 160%;
	margin: 50px auto 50px auto;
}

@media screen and (max-width: 1200px) {
	.title_box_100 {
		padding-bottom: 10px;
		font-size: 130%;
		padding-top: 15px;
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 15px;
		margin: 30px auto 40px auto;
	}
}
@media screen and (max-width: 767px) {
	.title_box_100 {
		height: auto;
		font-size: 100%;

	}
}

.title_box_100 p {
	text-align: right;
	color: #444444;
	font-size: 80%;
}


.breadcrumbArea{
	margin: 0px auto 0 auto;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-left: 100px;
	padding-right: 100px;
}
.breadcrumb {
	color: #000;
	font-size: 12px;
	display: flex;
	flex-wrap: wrap;
	text-align: start;
	justify-content: flex-start;
	white-space: nowrap;
}
.breadcrumb li a::after{
	content: ">";
	color: #333;
	display: inline-block;
	margin: 0 10px;
}
.breadcrumb li a{
	color: #1565C0;
}

@media screen and (max-width: 767px) {
    .breadcrumbArea{
    	padding: 10px 20px;
    }
}

.contentArea{
	margin: 50px auto 0;
	padding: 0 100px;
}
.contentArea.mvArea{
	margin: 0px auto 0;
}


.contentArea.trainingItemList{
	margin: 70px auto 0;
}
.contentAreaInner{
	box-sizing: border-box;
	max-width: 1200px;
	margin: 0 auto;
	width: 100%;
	text-align: left;
}

@media screen and (max-width: 767px) {
    .breadcrumbArea{
    	padding: 10px 20px;
    }
	.contentAreaInner{
		padding: 0 20.5px;
	}
	.breadcrumb{
		font-size: 10px;
	}
	.contentArea{
		width: 100%;
		margin-top: 60px;
		padding: 0;
	}
	.contentAreaInner{
		max-width: 100%;
		padding: 0 20.5px;
	}
	.breadcrumbArea .contentAreaInner {
        padding: 0;
    }
}



/********************************************************************************************************
/* メインボックス
*********************************************************************************************************/

.sub_title_box_100 {
	width: 100%;
	position: relative;
	box-sizing: border-box;
}
@media screen and (max-width: 767px) {
	.sub_title_box_100 {
		margin-top: 10px;
		margin-bottom: -20px;

		height: auto;
		font-size: 100%;

	}
}


.sub_title_box_100 p {
	text-align: right;
	color: #444444;
	font-size: 80%;
	font-weight: 700;
	letter-spacing: 1.5px;

}


/********************************************************************************************************
/* メインボックス
*********************************************************************************************************/




.sub_box_100 {
	display: block;
	position: relative;
	overflow: hidden;
	padding: 10px;
	padding-left: 70px;
	border: solid 2px #64914F;
	box-sizing: border-box;
	font-weight: 700;
	letter-spacing: 1.5px;
	margin: 60px auto 40px auto;
}
@media screen and (max-width: 767px) {
	.sub_box_100 {

		margin: 30px auto 20px auto;
		padding: 5px;
		padding-left: 40px;
	}
}

.sub_box_100:before {
	position: absolute;
	content: '';
	top: -150%;
	left: -100px;
	width: 155px;
	height: 300%;
	background: #64914F;
}
@media screen and (max-width: 767px) {
	.sub_box_100:before {
		width: 135px;
	}
}

.sub_box_100 span {
	position: absolute;
	display: block;
	top: 10px;
	left: 0;
	z-index: 1;
	font-size: 100%;
	padding-left: 16px;
	font-weight: 700;
	color: #fff;
	letter-spacing: 0px;
}
@media screen and (max-width: 767px) {
	.sub_box_100 span  {
		top: 6px;
		left: -9px;
	}
}



/******************************************************************************
/* サブエリア
*******************************************************************************/

.sub_area  {
	display: block;
	margin : 20px auto 20px auto;
}


.sub_area p  {
	font-weight: 700;
	margin-bottom: 10px;
}

.source100  {
	text-align: right;
	font-size: 80%;
	margin-top: 10px;
}



/******************************************************************************
/* その他読み物ライン
*******************************************************************************/

.contentsTitle01 {
	display: block;
	box-sizing: border-box;
	border-bottom: 3px solid #CCC;
	font-size: 24px;
	font-weight: 700;
	color: #006BB8;
	letter-spacing: 0.1rem;
	margin-bottom: 40px;
	padding-bottom: 5px;
	position: relative;
}
@media screen and (max-width: 767px) {
	.contentsTitle01 {
	box-sizing: border-box;
	border-bottom: 3px solid #CCC;
	font-size: 16px;
	color: #006BB8;
	letter-spacing: 0rem;
	margin-bottom: 40px;
	padding-bottom: 0px;
	}
}
.contentsTitle01::after{
	content: "";
	width: 250px;
	height: 3px;
	display: block;
	background: #1565C0;
	position: absolute;
	bottom: -3px;
	left: 0;
	color: #006BB8;
}
@media screen and (max-width: 767px) {
	.contentsTitle01::after {
	content: "";
	width: 150px;
	height: 3px;
	display: block;
	background: #1565C0;
	position: absolute;
	bottom: -3px;
	left: 0;
	color: #006BB8;
	}
}


/******************************************************************************
life block
******************************************************************************/

.life_block {
	position: relative;
	display: block;
	margin:0 auto 40px;
	padding-top:40px;
	padding-bottom:20px;
	padding-left:40px;
	padding-right:40px;
	list-style:none;
	border: 1px solid #64AD48;
	border-radius: 10px;
	font-size: 140%;

}
@media screen and (max-width:767px){
.life_block {
	padding-top:10px;
	padding-bottom:10px;
	padding-left:20px;
	padding-right:20px;
	font-size: 110%;

	}
}


.life_block2 {
	display: block;
	margin:60px auto 40px;
	padding-top:40px;
	padding-bottom:40px;
	padding-left:40px;
	padding-right:40px;
	list-style:none;
	border: 1px solid #64AD48;
	border-radius: 10px;
	font-size: 140%;
	transform:translateY(-3px);
	box-shadow:0 6px 18px rgba(0,0,0,0.08);
}
@media screen and (max-width:767px){
.life_block2 {
	margin:30px auto 30px;
	padding-top:10px;
	padding-bottom:10px;
	padding-left:20px;
	padding-right:20px;
	font-size: 110%;

	}
}




.life_block a {
	text-decoration: none;
}
@media screen and (max-width:767px){
.life_block a {

	}
}

.life_card{
	display:block;
	text-decoration:none;
	color:inherit;
}

/* タイトル */
.life_title{
	position: relative;
	margin-bottom:20px;
}
@media screen and (max-width:767px){
	.life_title{
		position: relative;
		margin-bottom:10px;
	}
}

/* タイトル */
.life_title2{
	position: relative;
	margin-bottom:10px;
}
@media screen and (max-width:767px){
	.life_title2{
		position: relative;
		margin-bottom:10px;
	}
}



/* ヒント */
.life_hint{
	position: absolute;
	top:-25px;
	left: -20px;
	z-index: 100;
}
@media screen and (max-width:767px){
	.life_hint {
		position: absolute;
		top:-15px;
		left: -27px;
		z-index: 100;

	}
}

.life_hint img {
	display: block;
	width: 50px;
	height: auto;
	z-index: 100;

}
@media screen and (max-width:767px){
	.life_hint img {
		width: 35px;
		height: auto;
		z-index: 100;

	}
}


/* ヒント */
.life_hint2 {
	position: absolute;
	top:35px;
	left: 10px;
	z-index: 100;
}
@media screen and (max-width:767px){
	.life_hint2 {
		position: absolute;
		top:15px;
		left: -7px;
		z-index: 100;

	}
}

.life_hint2 img {
	display: block;
	width: 50px;
	height: auto;
	z-index: 100;

}
@media screen and (max-width:767px){
	.life_hint2 img {
		width: 35px;
		height: auto;
		z-index: 100;

	}
}







/* 本文＋画像 */
.life_body{
	display:flex;
	gap:30px;
	align-items:flex-start;
}

/* 奇数だけ左右反転 */
.life_block li:nth-child(odd) .life_body{
	flex-direction: row-reverse;
}



/* 本文 */
.life_text{
	flex:1;
	line-height:1.8;
	letter-spacing:2px;
}

/* 本文 */
.life_text_top{
	flex:1;
	line-height:1.8;
	letter-spacing:2px;
}




/* 画像 */
.life_photo{
	display: block;
	width:40%;
	background:#F3F8F1;
	border-radius:10px;
	overflow:hidden;
}

.life_photo img{
	width:100%;
	display:block;
}

/* 画像 */
.life_photo2 {
	width:50%;
	background:#F3F8F1;
	border-radius:10px;
	overflow:hidden;
}
.life_photo2 img{
	width:100%;
	display:block;
}



/* ボタン */
.life_button{
	margin-top:15px;
	font-weight:bold;
}



.life_up_date{
	width: 100%;
	margin-bottom:15px;
	font-weight:bold;
	text-align: right;
}



/******************************************************************************
ボトムメニュー
******************************************************************************/

.menu100years {
	margin: 50px auto 100px auto;
	display: flex;
	width: 100%;
	justify-content: center; /* ← 常に中央寄せ */
	gap: 20px;
	padding: 20px;
	list-style: none;
	border: 2px solid #0265a9;
	box-sizing: border-box;
	border-radius: 50px;
	background-color: #FEF8D5;
}

@media screen and (max-width: 767px) {
	.menu100years {
		margin: 40px auto 60px auto;
		display: block;
		border-radius: 10px;
		padding: 15px;

	}
}




.menu100years li {
	flex: 1;                /* ← 可変対応の核心 */
	display: flex;
}


.menu100years .prev { flex: 2; }
.menu100years .center { flex: 1; }
.menu100years .next { flex: 2; }
.menu100years li:not(:last-child) {
	border-right: 2px solid #0265a9;
}

@media screen and (max-width: 767px) {
	.menu100years .prev { flex: 1; margin-top: 0px; padding-bottom: 10px; }
	.menu100years .center { flex: 1; padding-top: 10px; padding-bottom: 10px; }
	.menu100years .next { flex: 1; padding-top: 10px; }
	.menu100years li:not(:last-child) {
		border-bottom: 2px solid #0265a9;
		border-right: 0px solid #0265a9;

	}

	/* 空のliにはボーダーを付けない */
	.menu100years li:empty {
		border: none !important;
	}

}


@media screen and (max-width: 767px) {
	/* 次が空のliなら、そのliのボーダーを消す */
	.menu100years li:has(+ li:empty) {
		border-bottom: none !important;
	}
}


@media screen and (max-width: 767px) {
	.menu100years li.prev:empty {
		padding-bottom: 0 !important;
	}
}


@media screen and (max-width: 767px) {
	.menu100years li.prev:empty + li.center {
		padding-top: 0 !important;
	}
}

@media screen and (max-width: 767px) {
	.menu100years li.next:empty + li.center {
		padding-bottom: 0 !important;
	}
}

@media screen and (max-width: 767px) {
	.menu100years li.next:empty {
		padding-top: 0px !important;
		margin-bottom: -10px !important;
	}
}




/* 左ブロック専用 */
	.menu100years .prev a {
	position: relative;
	justify-content: center;
}

/* アイコンを外へ */
.menu100years .prev .btnMenu_bottom {
	position: absolute;
	left: 20px;   /* ← 好みで調整 */
	top: 50%;
	transform: translateY(-50%);
	margin: 0;
}
@media screen and (max-width: 767px) {
	/* アイコンを外へ */
	.menu100years .prev .btnMenu_bottom {
		position: absolute;
		left: 0px;   /* ← 好みで調整 */
		top: 50%;
		transform: translateY(-50%);
		margin: 0;
	}
}


/* 中央ブロック専用（←ここを2にする） */
	.menu100years .center a {
	position: relative;
	justify-content: center;
}

/* アイコンを外へ（←ここも2にする） */
	.menu100years .center .btnMenu_bottom {
	position: absolute;
	left: 0px;
	top: 50%;
	transform: translateY(-50%);
	margin: 0;
}



/* 右ブロック専用 */
	.menu100years .next a {
	position: relative;
	justify-content: center;
}

/* アイコンを外へ */
	.menu100years .next .btnMenu_bottom {
	position: absolute;
	right: 20px;   /* ← 好みで調整 */
	top: 50%;
	transform: translateY(-50%);
	margin: 0;
}
@media screen and (max-width: 767px) {
		.menu100years .next .btnMenu_bottom {
		position: absolute;
		right: 0px;   /* ← 好みで調整 */
		top: 50%;
		transform: translateY(-50%);
		margin: 0;
	}
}


.menu100years a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	text-align: center;
	line-height: 1.4;
	gap: 5px;
	text-decoration: none;
}


.sub_title_100 {
	display: block;
	font-size:120%;
	font-weight: 700;
}
@media screen and (max-width: 767px) {
	.sub_title_100 {
		display: block;
		font-size:100%;
		font-weight: 700;
	}
}


.menu_title_100 {
	display: block;
	font-size:140%;
	font-weight: 700;
}
@media screen and (max-width: 767px) {
	.menu_title_100 {
		display: block;
		font-size:120%;
		font-weight: 700;
	}
}


.volume_num {
	display: inline-block;
	padding: 5px;
	font-size:90%;
	font-weight: 700;
	background-color: #96DA77;
	border-radius: 5px;
	margin-right: 5px;
	color: #ffffff;
}
@media screen and (max-width: 767px) {
	.volume_num {
		display: inline-block;
		padding: 5px;
		font-size:70%;
		font-weight: 700;
		background-color: #96DA77;
		border-radius: 5px;
		margin-right: 5px;
		color: #ffffff;
	}
}

@media screen and (max-width: 767px) {
	.menu100years {
		gap: 0;
	}
}


/********************************************************************************************************
/* ボトムメニューボタン設定
*********************************************************************************************************/


.btnMenu_bottom {
	width: 25px;
	display: inline-block;
	vertical-align: middle;
	transform: translateY(-1px); /* ↑下げたいなら正、上げたいなら負 */
	margin-right: 4px;
}

@media screen and (max-width: 1200px) {
	.btnMenu_bottom {
		display: inline-block;
		vertical-align: middle;
		transform: translateY(-1px); /* ↑下げたいなら正、上げたいなら負 */
		margin-right: 4px;
	}
}
@media screen and (max-width: 767px) {
	.btnMenu_bottom {
		width: 18px;
		display: inline-block;
		vertical-align: middle;
		transform: translateY(-4px); /* ↑下げたいなら正、上げたいなら負 */
		margin-right: 4px;
	}
}


/******************************************************************************
スマホ
******************************************************************************/

@media screen and (max-width:767px){

.life_body{
	display:flex !important;
	flex-direction:column !important;
	gap:15px;
	margin-bottom: 10px;
	width:100%;

}
@media screen and (max-width:767px){

ul.life_block .life_body{
	display:flex;
	flex-direction:column;
}

}

.life_text{
	order:2;
	width:100%;
	display: block;

}

/* 本文 */
.life_text_top{
	order:2;
	width:100%;
	display: block;
	-webkit-line-clamp: 3;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
}



.life_photo{
	order:1;
	width:100%;
	display: block;
}

.life_photo2{
	order:1;
	width:100%;
}


.life_button{
	order:3;
}

}

/******************************************************************************
life_card
******************************************************************************/
.life_block{
	transition:0.2s;
}

.life_block:hover{
	transform:translateY(-3px);
	box-shadow:0 6px 18px rgba(0,0,0,0.08);
}


/******************************************************************************
newマーク
******************************************************************************/


/*リボンの位置*/
.cp_ribbon01 {
  position: absolute;
  top: -6px;
  left: 30px;
}
/*リボンの設定*/
.cp_ribbon01 .cp_ribbon {
  position: relative;
  display: flex;
  /* 追加 */
  justify-content: center;  /* 横中央 */
  align-items: center;      /* 縦中央 */
  width: 60px;
  padding: 3px 0px 10px 0px;
  color: #ffffff;
  background: #FFC107;
  border-top-left-radius: 3px;
  clip-path: polygon(0% 0%, 100% 0, 100% 100%, 50% 75%, 0% 100%);
	font-weight: 700;
}
/*リボンの影部分*/
.cp_ribbon01:before {
  position: absolute;
  content: '';
  top: 0px;
  right: -6px;
  width: 6px;
  height: 6px;
  background-color: #FF8F00;
  clip-path: polygon(0 0, 0% 100%, 100% 100%);
}



/******************************************************************************
まとめブロック
******************************************************************************/

.matome_block {
	display: block;
	margin:80px auto 0px auto;
	padding-top:20px;
	padding-bottom:20px;
	padding-left:30px;
	padding-right:30px;
	list-style:none;
	border: 1px solid #64AD48;
	font-size: 100%;
	letter-spacing: 1.5px;
	background-color: #F3FBEA;
}
@media screen and (max-width:767px){
.matome_block {
	margin:40px auto 10px auto;
	padding-top:20px;
	padding-bottom:20px;
	padding-left:20px;
	padding-right:20px;
	font-size: 100%;

	}
}

.midashi_title {
	display: block;
	margin:0px auto 10px auto;
	font-size: 100%;
	font-weight: 700;
}

.matome_block p {
	display: block;
	margin:0px auto 30px auto;
	font-size: 100%;
}

.matome_block p:last-of-type {
	margin-bottom: 0;
}

/******************************************************************************
/* サブコンテンツタイトル設定（目が見えづらい方に）
******************************************************************************/

ul.iroha_subtitle_block4 {
	margin: 0 auto 0 auto;
	display: flex;
	width: 100%;
	justify-content: space-between;

}
@media screen and (max-width: 767px) {
	ul.iroha_subtitle_block4 {
		margin: 20px auto 0px auto;
		width:100%;
	}
}

ul.iroha_subtitle_block4 li {
	margin-bottom: 15px;

}

ul.iroha_subtitle_block4 li:first-child {
		width: 75px;
}
@media screen and (max-width: 767px) {
	ul.iroha_subtitle_block4 li:first-child {
			width: 55px;
	}
}

ul.iroha_subtitle_block4 li:last-child {
		margin-top: 8px;
		width: calc(100% - 75px);
}
@media screen and (max-width: 767px) {
	ul.iroha_subtitle_block4 li:last-child {
			margin-top: 0px;
			width: calc(100% - 55px);
	}
}

/******************************************************************************
/* サブタイトル
*******************************************************************************/

p.life_block_title {
	width: 100%;
	font-size: 110%;
	font-weight: 700;
	border-top: 3px dotted #64AD48;
	border-bottom: 3px dotted #64AD48;
	padding-top: 5px;
	padding-bottom: 5px;
	margin-top :5px;
}

p.life_block_title span {
	display: block;
	margin-left :15px;
}
@media screen and (max-width: 767px) {
	p.life_block_title span {
		display: block;
		margin-left :5px;
	}
}

p.life_block_title2 {
	display: block;
	width: 100%;
	font-size: 180%;
	font-weight: 700;
	border-top: 3px dotted #64AD48;
	border-bottom: 3px dotted #64AD48;
	padding-top: 5px;
	padding-bottom: 5px;
	margin-top :5px;
}
@media screen and (max-width: 767px) {
	p.life_block_title2 {
		display: block;
		font-size: 110%;
	}
}

p.life_block_title2 span {
	margin-left :10px;
}
@media screen and (max-width: 767px) {
	p.life_block_title2 span {
		display: block;
		margin-left :5px;
	}
}

/******************************************************************************
/* サブコンテンツポイントマーク5
*******************************************************************************/


.balloon5-right {
	position: relative;
	display: inline-block;
	margin: 0px auto 0px auto;
	padding: 0 5px;
	width: 75px;
	height: 75px;
	background: #96DA77;
	border-radius: 50%;
	box-sizing: border-box;
	line-height: 1.5;
	letter-spacing: 0px;
}
@media screen and (max-width: 767px) {
	.balloon5-right {
		position: relative;
		display: inline-block;
		margin: 0px auto 0px auto;
		padding: 0 5px;
		width: 45px;
		height: 45px;
		background: #96DA77;
		border-radius: 50%;
		box-sizing: border-box;
		line-height: 1.5;
		letter-spacing: 0px;
	}
}


.balloon5-right:before {
	content: "";
	position: absolute;
	top: 50%;
	right: -15px;
	margin-top: -8px;
	border: 8px solid transparent;
	border-left: 15px solid #96DA77;
	z-index: 0;
}



.balloon5-right p.step1 {
	text-align: center;
	color: #FFF;
	font-size: 100%;
	font-weight: 700;
	margin-top: 15px;
	margin-bottom: -8px;
	letter-spacing: 0px;
}
@media screen and (max-width: 767px) {
	.balloon5-right p.step1 {
		text-align: center;
		color: #FFF;
		font-size: 90%;
		font-weight: 700;
		margin-top: 5px;
		margin-bottom: -8px;
		letter-spacing: 0px;
	}
}


.balloon5-right p.step2 {
	text-align: center;
	color: #FFF;
	font-size: 180%;
	font-weight: 700;
	margin-top: 14px;
	margin-bottom: 0px;
	letter-spacing: 0px;
}
@media screen and (max-width: 767px) {
	.balloon5-right p.step2 {
		text-align: center;
		color: #FFF;
		font-size: 110%;
		font-weight: 700;
		margin-top: 11px;
		margin-bottom: 0px;
		letter-spacing: 0px;
	}
}



.balloon5-right p.step3 {
	text-align: center;
	color: #FFF;
	font-size: 70%;
	font-weight: 700;
	margin-top: 19px;
	margin-bottom: 0px;
	letter-spacing: 10px;
}

/******************************************************************************
/* 線
*******************************************************************************/

/* CSSコード */
/* リセットCSS */
hr {
  height: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

/* 破線 */
.hr1 {
  border-top: 1px dashed #aaa;
}

.hr2 {
	border-top: 1px dashed #5B52B3;
	margin-bottom: 50px;
}

.hr3 {
  border-top: 3px dashed orange;
  background-color: rgb(232, 243, 131);
}



/******************************************************************************
/* その他の読み物一覧設定
******************************************************************************/

/*new include*/
.years_col_include {
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 30px;
}

.years_col_include li {
	width: calc((100% - 30px) / 4);
	box-sizing: border-box;
	margin-bottom: 5px;
	border-radius: 8px;
}
.years_col_include li.is_disabled{
	background-color: #EFEFEF;
    opacity: 0.6;
    pointer-events: none;
}

.years_col_include li:nth-child(4n) {
	padding-right: 0;
}

.years_col_include li > a {
	position: relative;
	font-size: 13px;
	padding: 0 10px;
	display: block;
	border: 1px solid #d9d9d9;
}
.years_col_include li > a {
	border-radius: 8px;
	overflow: hidden;
}

.years_col_include li > a::after {
	position: absolute;
	content: "";
	display: block;
	background: url('https://healthrent.duskin.jp/column/img/common/img_arrow_column.png');
	width: 32px;
	height: 32px;
	bottom: 0;
	right: 0;
	z-index: 10;

}

.years_col_include li:first-child > a::before,
.years_col_include li:nth-child(2) > a::before,
.years_col_include li:nth-child(3) > a::before,
.years_col_include li:nth-child(4) > a::before,
.years_col_include li:nth-child(5) > a::before,
.years_col_include li:nth-child(6) > a::before{
	position: absolute;
	content: "";
	display: block;
	background: url('https://healthrent.duskin.jp/column/img/common/icon_new.png');
	width: 43px;
	height: 43px;
	background-size: contain;
	background-repeat:no-repeat;
	top: 0;
	left: 0;
	z-index: 10;


}

.years_col_include li:first-child > a {
	background: url('../img/inc_100.png') no-repeat 95% center;
    background-size: 35%;
}

.years_col_include li:nth-child(2) > a {
	background: url('https://healthrent.duskin.jp/column/img/common/inc_ninchi.png') no-repeat 95% center;
	background-size: 35%;
}

.years_col_include li:nth-child(3) > a {
	background: url('https://healthrent.duskin.jp/column/img/common/inc_homecare.png') no-repeat 95% center;
    background-size: 35%;
}
.years_col_include li:nth-child(4) > a {
	background: url('https://healthrent.duskin.jp/column/img/common/inc_rental.png') no-repeat 95% center;
    background-size: 35%;
}
.years_col_include li:nth-child(5) > a {
	background: url('https://healthrent.duskin.jp/column/img/common/inc_brain-training.png') no-repeat 95% center;
    background-size: 35%;
}
.years_col_include li:nth-child(6) > a {
	background: url('https://healthrent.duskin.jp/column/img/common/inc_oshihon.png') no-repeat 95% center;
    background-size: 35%;
}
.years_col_include li:nth-child(7) > a {
	background: url('https://healthrent.duskin.jp/column/img/common/inc_iroha.png') no-repeat 95% center;
	background-size: 35%;
}

.years_col_include li:nth-child(8) > a {
	background: url('https://healthrent.duskin.jp/column/img/common/inc_recipe.png') no-repeat 95% center;
	background-size: 35%;
}

.years_col_include li:nth-child(9) > a {
	background: url('https://healthrent.duskin.jp/column/img/common/inc_nagara.png') no-repeat 95% center;
	background-size: 35%;
}

.years_col_include li:nth-child(10) > a {
	background: url('https://healthrent.duskin.jp/column/img/common/inc_library.png') no-repeat 95% center;
	background-size: 35%;
}
.years_col_include li:nth-child(11) > a {
	background: url('https://healthrent.duskin.jp/column/img/common/inc_condition.png') no-repeat 95% center;
	background-size: 35%;
}

.years_col_include li:nth-child(12) > a {
	background: url('https://healthrent.duskin.jp/column/img/common/inc_onayami.png') no-repeat 95% center;
	background-size: 35%;
}




.years_col_include li:nth-child(13) > a {
	background: url('https://healthrent.duskin.jp/column/img/common/inc_info.png') no-repeat 95% center;
	background-size: 35%;
}

.years_col_include li:last-child > a {
	background: url('https://healthrent.duskin.jp/column/img/common/inc_kinryoku.png') no-repeat 95% center;
	background-size: 35%;
}


.years_col_include li > a > span {
	display: table-cell;
	vertical-align: middle;
	font-size: 13px;
	height: 117px;
}
.years_col_include li > a span.bold {
	font-weight: bold;
	font-size: 14px;
	color: #1565C0;
}

.years_col_include li > a:hover {
	text-decoration: none;
	border-color: #006bb8;
	opacity: 1;
}

.years_col_include li > a:hover > span {
	opacity: .8;
}

.years_col_include li > a:hover:before {
	border-bottom: 24px solid transparent;
	border-left: 20px solid #006bb8;
}
.years_col_include li > a:hover:before {
	border-bottom: none;
	border-left: none;
}

.years_col_include li.active > a {
	pointer-events: none;
	cursor: default;
	border-color: #d9d9d9;
	text-decoration: none;
}

.years_col_include li.active > a:after {
	position: absolute;
	top: 0;
	left: 0;
	content: '';
	height: 100%;
	width: 100%;
	background: #e6e6e6;
	opacity: .7;
}

.years_col_include li.active > a:hover:before {
	border-bottom: 24px solid transparent;
	border-left: 20px solid #000;
}

@media screen and (max-width: 767px) {
	.years_col_include {
		padding: 0 auto 0 auto;
	}
	.years_col_include li {
		width: calc((100% - 10px) / 2);
		margin-bottom: 5px;
	}
	.years_col_include li > a {
		padding: 15px 10px 10px 5px;
	}
	.years_col_include li > a > span {
		font-size: 12px;
		line-height: 20px;
	}
	.years_col_include li > a span.bold {
		font-size: 13px;
	}
	.years_col_include li:first-child > a{
		background-position-y: 90% !important;
	}
	.years_col_include li:first-child > a,
	.years_col_include li:nth-child(2) > a,
	.years_col_include li:nth-child(3) > a,
	.years_col_include li:nth-child(4) > a,
	.years_col_include li:nth-child(5) > a,
	.years_col_include li:nth-child(6) > a,
	.years_col_include li:nth-child(7) > a,
	.years_col_include li:nth-child(8) > a,
	.years_col_include li:nth-child(9) > a,
	.years_col_include li:last-child > a {
		background-position: 95% 60%;
		background-size: 14vw;
		line-height: 1.2;
	}
	.years_col_include li:first-child > a::before,
	.years_col_include li:nth-child(2) > a::before,
	.years_col_include li:nth-child(3) > a::before,
	.years_col_include li:nth-child(4) > a::before,
	.years_col_include li:nth-child(5) > a::before,
	.years_col_include li:nth-child(6) > a::before{
		width: 32px;
		height: 32px;
	}

	.years_col_include li > a > span {
		height: 60px;
	}
}


/********************************************************************************************************
/* 100年コラムボックスボタン設定
*********************************************************************************************************/


.btnMenu_button {
	width: 25px;
	display: inline-block;
	vertical-align: middle;
	transform: translateY(-3px); /* ↑下げたいなら正、上げたいなら負 */
	margin-right: 4px;
}


@media screen and (max-width: 767px) {
	.btnMenu_button {
		width: 18px;
		display: inline-block;
		vertical-align: middle;
		transform: translateY(-3px); /* ↑下げたいなら正、上げたいなら負 */
		margin-right: 4px;
	}
}


/********************************************************************************************************
/* 100年コラムボックス一覧に戻るボタン設定
*********************************************************************************************************/


.btnMenu_button2 {
	width: 25px;
	display: inline-block;
	vertical-align: middle;
	transform: translateY(-1px); /* ↑下げたいなら正、上げたいなら負 */
	margin-right: 4px;
}

@media screen and (max-width: 1200px) {
	.btnMenu_button2 {
		display: inline-block;
		vertical-align: middle;
		transform: translateY(-1px); /* ↑下げたいなら正、上げたいなら負 */
		margin-right: 4px;
	}
}
@media screen and (max-width: 767px) {
	.btnMenu_button2 {
		width: 18px;
		display: inline-block;
		vertical-align: middle;
		transform: translateY(-4px); /* ↑下げたいなら正、上げたいなら負 */
		margin-right: 4px;
	}
}


/******************************************************************************
/* 詳しくはコチラ
*******************************************************************************/

.iroha_box_list_subtitle_main {
	margin: 30px auto 20px auto;
	width: 40%;
	font-size: 90%;
	color: #5A4FB2;
	font-weight: 700;
 	background-color: #ffffff;
	border: solid 2px #918BCC;/*左線（実線 太さ 色）*/
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
	padding-top: 8px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 8px;
	border-radius: 10px;
	z-index:110;
	text-align: center;
	box-sizing: border-box;

}



@media screen and (max-width: 1200px) {
	.iroha_box_list_subtitle_main {
			font-size: 90%;

	}
}

@media screen and (max-width: 767px) {
	.iroha_box_list_subtitle_main {
			top: 110px;
			font-size: 90%;
			padding-top: 6px;
			padding-left: 5px;
			padding-right: 5px;
			padding-bottom: 6px;
			width: 60%;

	}
}


/******************************************************************************
/* 一覧ページに戻る
*******************************************************************************/

.life100_box_list_subtitle_main2 {
	margin: 30px auto 20px auto;
	display: block;
	width: 100%;
	font-size: 140%;
	color: #5A4FB2;
	font-weight: 700;
 	background-color: #ffffff;
	border: solid 2px #918BCC;/*左線（実線 太さ 色）*/
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
	padding-top: 15px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 14px;
	border-radius: 10px;
	z-index:110;
	text-align: center;
	box-sizing: border-box;
	text-decoration: none;

}

a.life100_box_list_subtitle_main2 {
	text-decoration: none;
}



@media screen and (max-width: 1200px) {
	.life100_box_list_subtitle_main2 {
			font-size: 110%;

	}
}

@media screen and (max-width: 767px) {
	.life100_box_list_subtitle_main2 {
			top: 110px;
			font-size: 110%;
			padding-top: 6px;
			padding-left: 5px;
			padding-right: 5px;
			padding-bottom: 6px;
			width: 100%;

	}
}






/******************************************************************************
/* 介護用品・福祉用具
*******************************************************************************/



#product {
  background: #F5F5F5;
    margin: 80px 0 0;
    padding: 90px 7% 80px
}

.product {
    margin: auto;
    max-width: 1200px;
}



#product .product_area {
    margin: auto;
    max-width: 1200px;
}

#product .column_ttl {
    margin: auto;
    margin-bottom: 30px;
    max-width: 1200px;
}

#product .list_btn{
  display: flex;
  justify-content: center;
}

#product .list_btn a{
  max-width: 470px;
  width: 100%;
  font-size: 18px;
  display: block;
    position: relative;
}

#product .list_btn a:first-of-type {
    margin-right:15px;
}
#product .list_btn a:last-of-type {
    margin-left:15px;
}

#product .btn_bdr{
  line-height: 54px;
}
#product .btn_yellow{
  background: #e29200;
  color: #fff;
  text-align: center;
  font-weight: bold;
  border-radius: 8px;
  height: 60px;
  line-height: 60px;
}
#product .btn_yellow:hover{
  text-decoration: none;
}

#product .list_btn a.btn_yellow::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    border: 7px solid transparent;
    border-left: 11px solid #fff;
}


#product .list_btn a.btn_bdr::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    border: 7px solid transparent;
    border-left: 11px solid #0465ac;
}

#product .blankIcon {
  width: 23px;
  margin-left: 7px;
  display: inline-block;
}
#product .blankIcon img {
  vertical-align: -4px;
}
#product .bnr_box{
  margin-bottom: 30px;
}

@media screen and (min-width: 768px){
  #product .list_btn a::after{
    right: 33px;
  }
  #product .list_btn .btn_bdr::after{
    right: 30px;
  }
}
@media screen and (max-width: 767px){
  #product {
        padding: 60px 13px ;
    }
  #product .list_btn{
    margin-top: 25px;
    gap: 10px 0;
      flex-wrap: wrap;
  }
  #product .list_btn a{
    width: 100%;
    max-width: 100%;
  }
    #product .list_btn a:first-of-type {
    margin-right:0;
}
#product .list_btn a:last-of-type {
    margin-left:0;
}
  #product .btn_yellow{
    height: 58px;
    line-height: 58px;
  }
  #product .blankIcon {
    width: 20px;
    margin-left: 2px;
  }
  #product .blankIcon img {
    vertical-align: -2px;
  }
}

.product_area {
    display: flex;
    flex-wrap: wrap;
}

.product_btn {
    display: inline-block;
    width: calc((100% - 90px) / 4);
    border: 1px solid #707070;
    min-height: 90px;
    margin-right: 27px;
    margin-bottom: 30px;
    background-color: #fff;
    font-size: 15px;
    position: relative;
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: right bottom;
}

.product_btn:nth-of-type(4n) {
    margin-right: 0;
}

.product_btn span {
    position: absolute;
    left: 10px;
}

.product_btn01 {background-image: url(../img/index_item_01.jpg);}
.product_btn02 {background-image: url(../img/index_item_02.jpg);}
.product_btn03 {background-image: url(../img/index_item_04.jpg);}
.product_btn04 {background-image: url(../img/index_item_03.jpg);}
.product_btn05 {background-image: url(../img/index_item_05.jpg);}
.product_btn06 {background-image: url(../img/index_item_06.jpg);}
.product_btn07 {background-image: url(../img/index_item_13.jpg);}
.product_btn08 {background-image: url(../img/index_item_14.jpg);}

.product_btn01 span {top: 22px;}
.product_btn02 span {top: 14px;}
.product_btn03 span {top: 22px;}
.product_btn04 span {top: 22px;}
.product_btn05 span {top: 36px;}
.product_btn06 span {top: 22px;}
.product_btn07 span {top: 36px;}
.product_btn08 span {top: 22px;}

@media screen and (max-width: 767px){
    .product_btn {
        width: calc((100% - 20px) / 2);
        min-height: 80;
        margin-right: 15px;
        margin-bottom: 10px;
        background-size: auto 70%;
    }
    
    .product_btn:nth-of-type(2n) {
        margin-right: 0;
    } 
}

.bg-gray{
  background-color: #f8f8f8;
}






#article .box_wh{
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid #cccccc;
}
#article .list_box{
  gap: 30px 0;
}
#article .box_sub{
  width: 465px;
  display: flex;
  align-items: center;
  text-decoration: none;
  box-sizing: border-box;
}
#article .box_sub img{
  display: block;
  width: 100%;
}
#article .box_sub .txt_box{
  padding: 10px 5px 10px 25px;
  font-size: 20px;
  font-weight: bold;
  box-sizing: border-box;
  flex: 1 1 auto;
}
#article .btn_blank{
  position: relative;
}
#article .btn_blank:after{
  content: "";
  display: block;
  position: absolute;
  right: 15px;
  top: 15px;
  width: 16px;
  height: 16px;
  background: url(../img/icon_blank.png) no-repeat;
  background-size: contain;
}
.bnr_box a{
  display: block;
}
.bnr_box a img {
  vertical-align: bottom;
}
#article .bnr_box{
  margin-top: 50px;
    margin-bottom: 50px;
}
#article .bnr_box img {
    width: 100%;
}


a.btn_bdr,
.btn_bdr{
  border: 3px solid #0465ac;
  border-radius: 5px;
  background-color: #fff;
  display: inline-block;
  color: #0465ac;
  text-decoration: none;
  line-height: 52px;
  font-size: 16px;
  text-align: center;
  font-weight: bold;
  box-sizing: border-box;
}
a.btn_solid{
  border-radius: 5px;
  background-color: #0465ac;
  display: inline-block;
  color: #fff;
  text-decoration: none;
  line-height: 52px;
  font-size: 16px;
  text-align: center;
  font-weight: bold;
  box-sizing: border-box;
}
.link_arw:after{
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 6px;
  height: 6px;
  border-top: 2px solid #0265a9;
  border-right: 2px solid #0265a9;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  margin: -2px 0 0 10px;
}






#recommend {
  background: #F2F9FF;
    margin: 80px 0 0;
    padding: 90px 7% 80px
}

.recommend {
    margin: auto;
    max-width: 1200px;
}

.recommend_area {
    display: flex;
    justify-content: space-between;
}

.recommend_item {
	width: calc((100% - 90px)/4);
	/* margin: 0 15px; */
}

.recommend_item a {
    border-radius: 8px;
    display: inline-block;
    width: 100%;
    height: fit-content;
}

.recommend_item a img {
    width: 100%;
    border-radius: 8px;
}

.recommend_item p {
    font-size: 15px;
    line-height: 22px;
}

@media screen and (max-width: 767px){
    #recommend {
        margin: 60px 0 0;
        padding: 60px 20px 44px;
    }
    
    .recommend_area {
        flex-wrap: wrap;
    }
    
    .recommend_item {
         width: 100%;
        display: flex;
        justify-content: space-between;
        margin-bottom: 16px;
    }
    
    .recommend_item a {
        width: calc(50% - 5px);
    }
    
    .recommend_item p {
        width: calc(50% - 5px);
    }
    
}

#mail_magazine {
	display: block;
 	margin: 50px auto 50px auto;
	width: 50%;
}
@media screen and (max-width: 767px){
    #mail_magazine {
        margin-top: 53px;
        margin-bottom: 50px;
    }
}

#mail_magazine img {
    width: 100%;
    margin: auto;
}


#return_top {
	display: block;
 	margin: 50px auto 0px auto;
	width: 50%;
}

#return_top .bnr_box {
    width: 100%;
    margin: auto;
}

#return_top .bnr_box img {
    width: 100%;
    margin: auto;
}

@media screen and (max-width: 767px){
    #return_top {
        margin-top: 53px;
        margin-bottom: 50px;
    }
}



.share_sns {
    width: 130px;
    margin: 110px auto 80px;
    display: flex;
    justify-content: space-between;
} 

.share_sns a {
    width: 50px;
    height: auto;
}

.share_sns a img {
    width: 100%;
}

@media screen and (max-width: 767px) {
   .share_sns {
       width:100%;
       max-width: 210px;
       margin: 70px auto 60px;
    }  
}



/* **********  slider ********** */
._js_recommend_area{
	position: relative;
}
.slick-list{
	margin:0 -15px;
}
.slick-list::before,
.slick-list::after{
	content: '';
	display: block;
	position: absolute;
	width: 15px;
	height: 100%;
	background-color: #F2F9FF;
	top: 0;
	z-index: 10;
}
.slick-list::before{
	left: 0;
}
.slick-list::after{
	right: 0;
}
.slick-slide{
	margin: 0 15px;
}
.slide-arrow{
	position: absolute;
	top: 50%;
    z-index: 10;
	cursor: pointer;
}
.slide-arrow.prev-arrow{
	left: 0;
	transform: translate(-50%,-50%);
}
.slide-arrow.next-arrow{
	right: 0;
	transform: translate(50%,-50%);
}

/******************************************************************************
/* リストスタイル
*******************************************************************************/

ul.parent {
	list-style: none;
	padding-left: 0;
	margin-left: 20px;
}

ul.parent li {
	position: relative;
	padding-left: 1.2em;
}

ul.parent li::before {
	content: "•";
	position: absolute;
	left: 0;
}



ul.parent2 {
	display: flex;
	list-style: none;
	padding-left: 0;
	margin-left: 20px;
}

ul.parent2 li {
	position: relative;
	padding-left: 1.2em;
}

ul.parent2 li::before {
	content: "•";
	position: absolute;
	left: 0;
}




ul.parent3 {
	list-style: none;
	padding-left: 0;
	counter-reset: num;
	margin-left: 20px;

}

ul.parent3 li {
	counter-increment: num;
	position: relative;
	padding-left: 1.5em;
}

ul.parent3 li::before {
	content: counter(num);
	position: absolute;
	left: 0;
	font-family: "Arial Unicode MS", "Segoe UI Symbol", sans-serif;
}

/* ①②③に変換 */
ul.parent3 li:nth-child(1)::before { content: "①"; }
ul.parent3 li:nth-child(2)::before { content: "②"; }
ul.parent3 li:nth-child(3)::before { content: "③"; }
ul.parent3 li:nth-child(4)::before { content: "④"; }