@charset "utf-8";
/* CSS Document */
/* ----------------------------------------------------
　　共通設定
------------------------------------------------------- */

/*#header{background: var(--green2);}*/

/*
main {
    margin: 0 auto;
    position: relative;
}
*/

main p,
main section,
main aside {
	margin-bottom: 1rem;
}

.fs9 {
		font-size: 0.9rem;
	}


/* h1背景
--------------------------------------------*/

#content-detail .cont_bg{
	background: url("../img/common/bg2.png") no-repeat top center;
	background-size: contain;
}

#m-news .cont_bg{
	background: url("../img/common/bg3.png") no-repeat top center;
	background-size: contain;
}

#m-archive-contents .cont_bg{
	background: url("../img/common/bg4.png") no-repeat top center;
	background-size: contain;
}

#m-project .cont_bg{
	background: url("../img/common/bg5.png") no-repeat top center;
	background-size: contain;
}

#content-detail .cont_bg{
	padding:0rem 0 2rem;
}

main.content-detail .cont{
    background: url("../img/common/cont.png");
    background-repeat: repeat;
    background-size: 100%;
}

.outline{
    margin: 0 auto;
    max-width: 1280px;
}

#content-detail #header,
#content-detail #breadcrumb,
#content-detail .content-cate-box {
	background-color:  var(--green2);
}

#m-archive-contents #header,
#m-archive-contents #breadcrumb {
	background-color:  var(--green1);
}

#m-project #header,
#m-project #breadcrumb,
#m-project .content-cate-box {
	background-color: var(--green6);
}
#m-news #header,
#m-news #breadcrumb,
#m-news .content-cate-box {
	background-color: var(--green8);
}


#contents {
    padding: 7rem 0rem 2rem;
    max-width: 1280px;
    margin: 0 auto;
}

main.m-archive-contents #contents{
    padding: 5rem 2rem 0rem;
}
@media screen and (max-width: 959px){
    #contents {
        padding: 4rem 1rem 2rem;
    }
    main.m-archive-contents #contents{
        padding: 0rem 1rem 0rem;
    }
}

main.content-detail .cont:before{
    content: "";
    position: relative;
    display: block;
    background: url('../img/common/cont_top.png');
    background-repeat: no-repeat;
    top: -0.4rem;
    height: 20px;
    background-size: 100%;
}

main.content-detail .cont:after{
    content: "";
    position: relative;
    display: block;
    background: url('../img/common/cont_btm.png');
    background-repeat: no-repeat;
    bottom: -1rem;
    height: 20px;
    background-size: 100%;
}
/*
.cont{
    padding: 2rem 3rem;
}
*/
.cont_in{
    padding: 2rem;
    margin: 0 auto;
    max-width: 959px;
}


main.m-project h1,
main.content-detail h1,
main.m-archive-contents h1,
main.m-news h1{
    margin: 0 auto;
    max-width: 1280px;
}

main.content-detail .h1_bg{
    background-color: var(--green2);
}
main.m-project .h1_bg{
    background-color: var(--green6);
}
main.m-archive-contents .h1_bg{
    background-color: var(--green1);
}

main.m-news .h1_bg{
    background-color: var(--green8);
}

h1{
    font-weight: 600;
    font-size: 1.8rem;
    line-height: 2.4rem;
    color: var(--beige1);
    letter-spacing: 0.2em;
    padding: 2rem;
/*    background: var(--green2);*/
	font-family: var(--f_mincho);
}

h1 span{
    position: relative;
    display: block;
    max-width: 1280px;
    margin: 0 auto;
    font-size: 1.2rem;
	line-height:1.4rem;
	margin-top:1rem; 
}

.cont h2{
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 2rem;
}

.date{
    text-align: right;
}

.m-archive-contents h2,
.content-detail h2{
	font-size: 1.4rem;
    line-height: 1.2;
    padding: 1.5rem 0;
	font-weight: 700;
	font-family: var(--f_mincho);
}

.content-detail  #contents h2 {
	color: var(--red);
	position: relative;
	padding: 0;
	margin: 2rem 0;
}

.content-detail #contents h2:before {
	position: absolute;
	content: "";
	display: inline-block;
	background: url("../img/common/content-detail_h2.svg") no-repeat;
	background-size: contain;
	width: 100%;
	max-width: 85px;
	height: 100%;
	left: -13.5rem;
	top:0;
}

.m-archive-contents h3,
.content-detail h3,
.m-news h2{
	font-size: 1.2rem;
}

.m-news h2 {
	padding: 1.5rem 0 ;
}

.content-detail  #contents h3 {
	position: relative;
	padding: 0;
	margin: 1.5rem 0;
}

.content-detail #contents h3:before {
	position: absolute;
	content: "";
	display: inline-block;
	background: url("../img/common/content-detail_h3.svg") no-repeat;
	background-size: contain;
	max-width: 85px;
	width: 100%;
	height: 100%;
	left: -13rem;
	top:0;
}

@media screen and (max-width: 1414px){
	.content-detail h2:before {
		left: -7rem;
	}
	.content-detail h3:before {
		left: -6.5rem;
	}
}

@media screen and (max-width: 1154px){
    .content-detail h2:before {
		left: -6.5rem;
	}
	.content-detail h3:before {
		left: -6rem;
	}
}


#m-project h1,
#m-archive-contents h1{
	color: var(--beige1);
}

#m-project h1 span.en_font {
	color: var(--green5);
}

#m-archive-contents h1 span.en_font{
	color: var(--green7);
}


/*　パンくずリスト:
------------------------------------------------*/

#breadcrumb{
	font-size: 0.9rem;
    padding: 0.5rem;
/*    background: var(--green2);*/
    color: var(--beige1);
}

#breadcrumb ul{
    margin: 0 auto;
    position: relative;
    padding: 0 1rem;
    max-width: 1280px;
}

#breadcrumb li {
	display: inline;
}

#breadcrumb li * ,
#breadcrumb li a {
	display: inline-block;
	padding: 0 0.5rem 0 1.2rem;
	position: relative;
    color: var(--beige1);
}
#breadcrumb li:first-child > *{
	padding: 0 0.5rem 0 0;
}
#breadcrumb li:first-child > *::before{display: none;}

#breadcrumb li > *::before{
    content: "";
    display: block;
    position: absolute;
    width: 15px;
    height: 15px;
    left: 0;
    top: 0.3rem;
    background: url("../img/common/arrow01.svg") no-repeat;
}

#breadcrumb li a:hover,
#breadcrumb li em {
	font-weight: bold;
}



/* 　マスク
------------------------------------------------------- */
.mskImg {
  mask-image: url("../img/mask.png");/*マスク用画像*/
  mask-repeat: no-repeat;
  mask-position: 3% 0;
  mask-size: auto 100%;
  -webkit-mask-image: url("../img/mask.png");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: 3% 0;
  -webkit-mask-size: 100% auto;
    display: inline-block;
}

.mskImg2 {
  mask-image: url("../img/mask2.png");/*マスク用画像*/
  mask-repeat: no-repeat;
  mask-position: 3% 0;
  mask-size: 100% auto;
  -webkit-mask-image: url("../img/mask2.png");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  -webkit-mask-size: auto 100%;
    display: inline-block;
}

.content-area .mskImg{
    margin: 3rem 0 0;
}
/*
@media screen and (max-width: 959px){

.mskImg{
  mask-size: 50%;
  -webkit-mask-size: 50%;
    }
}
*/



/* 　youtube
------------------------------------------------------- */
.movie{
    margin: 0 auto 2rem;
    text-align: center;
}
.movie iframe{
    aspect-ratio: 16 / 9;
    width: 100%;
    height: auto;
	border: none;
}

/* 　link
------------------------------------------------------- */

.lnk1 {
	display: block;
}

.lnk1 a {
	text-decoration: none;
    display: inline-block;
	box-shadow: var(--shadow);
	padding: 0.5rem 2.8rem 0.5rem 0.8rem;
	background: url("../img/common/icon_arrow_02_g.svg") no-repeat;
	background-size: 2rem;
    background-position: right 0.25rem top 0.25rem;
	border-radius: 3px;
	line-height: 1.4rem;
    color: var(--green2);
}

.lnk1 a {
    background-color: var(--beige4);
}


.lnk1 a:hover {
    color: var(--beige4);
    background: url(../img/common/icon_arrow_02.svg) no-repeat;
    background-color: var(--green2);
    background-size: 2rem;
    background-position: right 0.25rem top 0.25rem;
    box-shadow: 3px 3px 0 var(--beige4);
}

/*
.lnk2 a {
    box-shadow: var(--shadow);
	color: #fff;
	background: var(--red) url("../img/common/icon_arrow_02.svg") no-repeat;
	background-size: 1.3rem;
	background-position: right 0.5rem top 0.8rem;
}*/

.lnk2 a {
	font-family: var(--f_mincho2);
  	font-weight: 400;
  	font-style: normal;
	text-decoration: none;
	padding: .8rem 1.8rem;
	margin-right: 1.5rem;
	margin-bottom: 1rem;
	font-size: 1.2rem;
	display: inline-block;
	background: var(--red);
	color: var(--white);
	--r: 8px; /* 削り半径 */

  /* WebKit 系（Chrome/Safari/Edge） */
  -webkit-mask:
    radial-gradient(var(--r) at 0    0,    transparent calc(var(--r) - 1px), #000 calc(var(--r))) top    left,
    radial-gradient(var(--r) at 100% 0,    transparent calc(var(--r) - 1px), #000 calc(var(--r))) top    right,
    radial-gradient(var(--r) at 100% 100%, transparent calc(var(--r) - 1px), #000 calc(var(--r))) bottom right,
    radial-gradient(var(--r) at 0    100%, transparent calc(var(--r) - 1px), #000 calc(var(--r))) bottom left;
  -webkit-mask-size: 51% 51%;
  -webkit-mask-repeat: no-repeat;

  /* 標準プロパティ（Firefox など） */
  mask:
    radial-gradient(var(--r) at 0    0,    transparent calc(var(--r) - 1px), #000 calc(var(--r))) top    left,
    radial-gradient(var(--r) at 100% 0,    transparent calc(var(--r) - 1px), #000 calc(var(--r))) top    right,
    radial-gradient(var(--r) at 100% 100%, transparent calc(var(--r) - 1px), #000 calc(var(--r))) bottom right,
    radial-gradient(var(--r) at 0    100%, transparent calc(var(--r) - 1px), #000 calc(var(--r))) bottom left;
  mask-size: 51% 51%;
  mask-repeat: no-repeat;
}

/*.lnk2 a:hover,*/
.lnk2 a:focus {
	background: var(--red2);
}

.lnk2 {
	position: relative;
}

.lnk2::after {
	content: "";
	display: inline-block;
	background: url("../img/common/icon_arrow_01.svg") no-repeat;
	background-size: contain;
	width: 3rem;
	height: 3rem;
	position: absolute;
	right: 0;
	bottom: 20px;
	transition: 0.3s;
}

.lnk2:has(a:hover)::after {
	background: url("../img/common/icon_arrow_01_on.svg") no-repeat;
	background-size: contain;
}



/* dl
--------------------------------------------*/
.dl1 dt{
    color: var(--green1);
    font-weight: bold;
}

.dl1 dd{
    margin: 0 0 1rem;
}




/* 　多様なケアの技法 +　projectページの多様なケアの技法
------------------------------------------------------- */


/*

.m-archive-contents #contents {
	padding-left:  5rem;
	padding-right: 5rem;
}

@media screen and (max-width: 959px){
	main.m-archive-contents .content-area {
		grid-template-columns: repeat(1, 1fr);
	}
	
		.m-archive-contents #contents {
		padding-left:  1rem;
		padding-right: 1rem;
	}
}
*/


.content-image {
	padding-bottom: 1rem;
}
	
.filter_box {
	padding-bottom: 3rem;
	font-size: 0.9rem;
}
.filter_box dl div{
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}
.filter_box dl dt{
    font-weight: bold;
}
.filter_box ul {
	display: flex;
	flex-wrap: wrap;
	row-gap: 1.2rem;
	column-gap: 2rem;
	margin-bottom: 1.5rem;
}
	
.filter_box ul.cate_01 {
	font-family: var(--f_en1);
    font-optical-sizing: auto;
}	
.filter_box ul.cate_02 {
	column-gap: 1.5rem;
    font-family: var(--f_mincho);
}

ul.cate_01 li,
ul.cate_02 li{
	position: relative;
}
	
ul.cate_01 li button,
.cate_01_t{
	color: var(--green1);
	padding: 0.3rem 0.3rem 0.3rem 0.8rem;
	text-decoration: none;
	font-weight: bold;
	position: relative;
	display: inline-block;
	z-index: 1;
}
	
ul.cate_01 li.c1-c00 button,
.c1-c00_t{
	color: var(--beige2);
	background: var(--green1);
}	
ul.cate_01 li.c1-c01 button,
.c1-c01_t{
	color: var(--beige2);
	background: #00543a;
}
ul.cate_01 li.c1-c02 button,
.c1-c02_t{
	background-color: #5f2288;
    color: var(--beige2);
}
ul.cate_01 li.c1-c03 button,
.c1-c03_t{
	background-color: #47AC9A;
}
ul.cate_01 li.c1-c04 button,
.c1-c04_t{
	background-color: #f4c43a;
}
ul.cate_01 li.c1-c05 button,
.c1-c05_t{
	color: var(--beige2);
	background: var(--red);
}
ul.cate_01 li.c1-c06 button,
.c1-c06_t{
	background-color: #232b57;
    color: var(--beige2);
}

ul.cate_01 li::before,
ul.cate_01 li::after,
ul.cate_02 li::before,
.cate_01_t::before,
.cate_01_t::after{
	content: "";
	display: inline-block;
}

ul.cate_01 li::before,
.cate_01_t::before{
	width: 100%;
	height: 100%;
	position: absolute;
	left: -10px;
	top:0;
}

ul.cate_01 li::after,
.cate_01_t::after{
	width: 100%;
	height: 100%;
	position: absolute;
	right: -12px;
	top:0;
}

ul.cate_01 li.c1-c00::before,
.cate_01_t.c1-c00_t::before{
	background: url("../../common/img/common/c1-c00_left.png") no-repeat;
	background-position: center left;
	background-size: auto 100%;
}

ul.cate_01 li.c1-c00::after,
.cate_01_t.c1-c00_t::after{
	background: url("../../common/img/common/c1-c00_right.png") no-repeat;
	background-position: center right;
	background-size: auto 100%;
}

ul.cate_01 li.c1-c01::before,
.cate_01_t.c1-c01_t::before{
	background: url("../../common/img/common/c1-c01_left.png") no-repeat;
	background-position: center left;
	background-size: auto 100%;
}

ul.cate_01 li.c1-c01::after,
.cate_01_t.c1-c01_t::after{
	background: url("../../common/img/common/c1-c01_right.png") no-repeat;
	background-position: center right;
	background-size: auto 100%;
}

ul.cate_01 li.c1-c02::before,
.cate_01_t.c1-c02_t::before{
	background: url("../../common/img/common/c1-c02_left.png") no-repeat;
	background-position: center left;
	background-size: auto 100%;
}

ul.cate_01 li.c1-c02::after,
.cate_01_t.c1-c02_t::after{
	background: url("../../common/img/common/c1-c02_right.png") no-repeat;
	background-position: center right;
	background-size: auto 100%;
}

ul.cate_01 li.c1-c03::before,
.cate_01_t.c1-c03_t::before{
	background: url("../../common/img/common/c1-c03_left.png") no-repeat;
	background-position: center left;
	background-size: auto 100%;
}

ul.cate_01 li.c1-c03::after,
.cate_01_t.c1-c03_t::after{
	background: url("../../common/img/common/c1-c03_right.png") no-repeat;
	background-position: center right;
	background-size: auto 100%;
}

ul.cate_01 li.c1-c04::before,
.cate_01_t.c1-c04_t::before{
	background: url("../../common/img/common/c1-c04_left.png") no-repeat;
	background-position: center left;
	background-size: auto 100%;
}

ul.cate_01 li.c1-c04::after,
.cate_01_t.c1-c04_t::after{
	background: url("../../common/img/common/c1-c04_right.png") no-repeat;
	background-position: center right;
	background-size: auto 100%;
}

ul.cate_01 li.c1-c05::before,
.cate_01_t.c1-c05_t::before{
	background: url("../../common/img/common/c1-c05_left.png") no-repeat;
	background-position: center left;
	background-size: auto 100%;
}

ul.cate_01 li.c1-c05::after,
.cate_01_t.c1-c05_t::after{
	background: url("../../common/img/common/c1-c05_right.png") no-repeat;
	background-position: center right;
	background-size: auto 100%;
}

ul.cate_01 li.c1-c06::before,
.cate_01_t.c1-c06_t::before{
	background: url("../../common/img/common/c1-c06_left.png") no-repeat;
	background-position: center left;
	background-size: auto 100%;
}

ul.cate_01 li.c1-c06::after,
.cate_01_t.c1-c06_t::after{
	background: url("../../common/img/common/c1-c06_right.png") no-repeat;
	background-position: center right;
	background-size: auto 100%;
}






ul.cate_02 li::before {
	width: 100%;
	height: 114%;
	position: absolute;
	right: -10px;
    top: -5px;
	background: url("../img/common/c2-right2.png") no-repeat;
	background-position: bottom right;
	background-size: auto 100%;
}

@media screen and (max-width: 959px){
	ul.cate_02 li::before {
		top: -4px;
		height: 112%;
	}
}

	
ul.cate_02 li button {
	color: #fff;
	padding: 0.1rem 0.2rem 0.1rem 0.5rem;
	text-decoration: none;
	position: relative;
	background-color: var(--gray1);
	color: var(--red2);
    font-weight: 700;
	display: inline-block;
	border-radius: 0 50px 50px 0;
    font-size: 0.8rem;
}

main.m-archive-contents .content-area {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap:0 2rem;
    align-items: stretch;
}

@media screen and (max-width: 1250px){
	main.m-archive-contents .content-area {
		grid-template-columns: repeat(2, 1fr);
	}
}

/*@media screen and (max-width: 959px){*/
@media screen and (max-width: 767px){
	main.m-archive-contents .content-area {
		grid-template-columns: repeat(1, 1fr);
		padding: 0 2rem 3rem;
	}
}

	
.content-area img{	
	aspect-ratio: 430 / 487; 
  	object-fit: cover;
  	object-position: 50% 50%;
	width: 100%;
	transition: transform 0.3s ease;
}
	
.content-area a {
	text-decoration: none;
	position: relative;
    height: auto;
    display: flex;
    flex-direction: column;
	transition: transform 0.3s ease;
	--rot: 0deg; 
  	transform: rotate(var(--rot));
}



/*傾ける*/
.content-area a:nth-child(2n + 2),
.content-area a{
  	transform: rotate(1.5deg);
}

/*文字情報は傾き解除*/

.content-area a:nth-child(2n + 2) .cate_01_t,
.content-area a:nth-child(2n + 2) .content-box h2,
.content-area a:nth-child(2n + 2) .content-box h3,
.content-area a:nth-child(2n + 2) .content-box p,
.content-area a:nth-child(2n + 2)  ul.content-cate,
.content-area a .cate_01_t,
.content-area a .content-box h2,
.content-area a .content-box h3,
.content-area a .content-box p,
.content-area a  ul.content-cate{
  	transform: rotate(-1.5deg);
}
/*傾ける*/
.content-area a:nth-child(4n + 3){
  	transform: rotate(-1.5deg);
}
/*文字情報は傾き解除*/
.content-area a:nth-child(4n + 3) .cate_01_t,
.content-area a:nth-child(4n + 3) .content-box h2,
.content-area a:nth-child(4n + 3) .content-box h3,
.content-area a:nth-child(4n + 3) .content-box p,
.content-area a:nth-child(4n + 3)  ul.content-cate{
  	transform: rotate(1.5deg);
}

/* 2n+2番目のカードは右回転 */
.content-area a:nth-child(2n + 2),
.content-area a{
  	--rot: 1.5deg;
}

/* 4n+3番目のカードは左回転 */
.content-area a:nth-child(4n + 3){
  	--rot: -1.5deg;
}
@media screen and (min-width: 960px){
/*hoverで拡大はPCのみ*/
.content-area a:hover {
  	transform: scale(1.1);
}

.content-area a:hover{
  	transform: rotate(var(--rot)) scale(1.2);
    z-index: 90;
}
.content-area a:hover {
	transform: rotate(var(--rot)) scale(1.1);
    z-index: 90;
}
}


.content-area a::after {
	content: "";
	display: inline-block;
	width: 60px;
	height: 60px;
	/*border: 0.5px solid var(--green1);*/
	border-radius: 3px;
	/*box-shadow: var(--shadow);*/
	background:url("../../common/img/common/icon_arrow_01.svg") no-repeat;
	background-size: contain;
	background-position: center center;
	position: absolute;
	right: -0.5rem;
	z-index: 8;
}
.content-area a:hover::after {
	background:url("../../common/img/common/icon_arrow_01_on.svg") no-repeat;
	background-size: contain;
	background-position: center center;
}


/* ラベルのはみ出し対策*/
.content-area a { padding: 3rem 0; }
.content-area .cate_01_t { top: 2.9rem; } 
.content-area a::after { bottom: 3rem; } 

@media screen and (max-width: 959px){
    
.content-area a { padding: 2rem 0; }
.content-area .cate_01_t { top: 1.4rem; } 
.content-area a::after { bottom: 1rem; } 
    
}
@media screen and (max-width: 959px){    
.content-area a { padding: 1.5rem 0; }
}

.cate_01_t{
	position: absolute;
	top: -10px;
    left: 20px;
	z-index: 5;
	font-size: 0.9rem;
}
.cate_01_t span{
	z-index: 5;
	position: relative;
}
.content-box{
	color: #fff;
    position: relative;
    z-index: 4;
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.content-box:before,
.content-box::after{
	content:"";
	position: relative;
	display:block;
	height:30px;
}
.content-box::before{
	top :1.5rem;
}
.content-box::after{
	bottom:0.5rem;
}
	
.inner-box p,
.inner-box{
    display: flex;
    flex-direction: column;
    height: 100%;
}

.cate_01 .content-box::before,
.cate_04 .content-box::before{background: url('../../common/img/common/grass_top.png') no-repeat;background-size: 100%;}
.cate_02 .content-box::before,
.cate_05 .content-box::before{background: url('../../common/img/common/grass2_top.png') no-repeat;background-size: 100%;}
.cate_00 .content-box::before,
.cate_03 .content-box::before,
.cate_06 .content-box::before {background: url('../../common/img/common/grass3_top.png') no-repeat;background-size: 100%;}

.cate_01 .content-box::after,	
.cate_04 .content-box::after{background: url('../../common/img/common/grass_btm.png') no-repeat;background-size: 100%;}
.cate_02 .content-box::after,
.cate_05 .content-box::after {background: url('../../common/img/common/grass2_btm.png') no-repeat;background-size: 100%;}
.cate_00 .content-box::after,
.cate_03 .content-box::after,
.cate_06 .content-box::after{background: url('../../common/img/common/grass3_btm.png') no-repeat;background-size: 100%;}

.cate_01 .inner-box,
.cate_04 .inner-box {background: url('../../common/img/common/grass_center.png') repeat-y 0 -6px;background-size: 100%;}
.cate_02 .inner-box,
.cate_05 .inner-box {background: url('../../common/img/common/grass2_center.png') repeat-y 0 -6px;background-size: 100%;}
.cate_00 .inner-box,
.cate_03 .inner-box,
.cate_06 .inner-box {background: url('../../common/img/common/grass3_center.png') repeat-y 0 -6px;background-size: 100%;}
	
ul.content-cate{
	position: absolute;
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	align-items: flex-end;
	gap:0.3rem;
	z-index: 5;
	right: 0rem;
	top: 13rem;
	overflow: hidden;
}

	
ul.content-cate li{
  	font-size: 0.7rem;
  	background-color: var(--gray1);
    font-family: var(--f_mincho);
    font-weight: 700;
    color: var(--red2);
  	padding: 0.2rem 0.2rem 0.3rem;
  	text-align: left;
  	max-width: 6rem;
  	line-height: 1rem;
  	position: relative;
    right: 0;
  	z-index: 1;
	border-radius: 0 50px 50px 0;
}

ul.content-cate li::before{
  	content: "";
  	display: block;
  	width: 100%;
  	height: 110%;
  	position: absolute;
  	right: -3px;
  	top: -3px;
  	background: url("../../common/img/common/c2-right2.png") no-repeat;
  	background-position: bottom right;
  	background-size: auto 100%;
  	z-index: -1;
}

ul.content-cate li:nth-child(1){margin-right: 6px;}
ul.content-cate li:nth-child(2) {margin-right: 5px;}
ul.content-cate li:nth-child(3) {margin-right: 0px;}
ul.content-cate li:nth-child(4) {margin-right: 7px;}
ul.content-cate li:nth-child(5) {margin-right: 5px;}
ul.content-cate li:nth-child(6) {margin-right: 7px;}


.content-box h2,
.content-box h3{
    position: absolute;
    z-index: 2;
    top: 2.5rem;
    left: -0.5rem;
    display: inline-block;
	font-size: 1.4rem;
	font-family: var(--f_mincho);
    color: var(--green2);
    padding: 0.5rem 1rem 0.5rem 2rem;
    max-width: 110%;
}

.content-box h2,
.content-box h3{
    padding: 0;
	display: inline-block;
}
.cate_01 .content-box h2,
.cate_01 .content-box h3 {
	background:
		radial-gradient(circle at top left,     transparent 5px, #00543a 0) top left,
		radial-gradient(circle at bottom left,  transparent 5px, #00543a 0) bottom left;
	background-size: 0.7rem 50%;
	background-repeat: no-repeat;
}
.cate_02 .content-box h2,
.cate_02 .content-box h3 {
	background:
		radial-gradient(circle at top left,     transparent 5px, #5f2288 0) top left,
		radial-gradient(circle at bottom left,  transparent 5px, #5f2288 0) bottom left;
	background-size: 0.7rem 50%;
	background-repeat: no-repeat;
}
.cate_03 .content-box h2,
.cate_03 .content-box h3 {
	background:
		radial-gradient(circle at top left,     transparent 5px, #47AC9A 0) top left,
		radial-gradient(circle at bottom left,  transparent 5px, #47AC9A 0) bottom left;
	background-size: 0.7rem 50%;
	background-repeat: no-repeat;
}
.cate_04 .content-box h2,
.cate_04 .content-box h3 {
	background:
		radial-gradient(circle at top left,     transparent 5px, #f4c43a 0) top left,
		radial-gradient(circle at bottom left,  transparent 5px, #f4c43a 0) bottom left;
	background-size: 0.7rem 50%;
	background-repeat: no-repeat;
}
.cate_05 .content-box h2,
.cate_05 .content-box h3 {
	background:
		radial-gradient(circle at top left,     transparent 5px, var(--red) 0) top left,
		radial-gradient(circle at bottom left,  transparent 5px, var(--red) 0) bottom left;
	background-size: 0.7rem 50%;
	background-repeat: no-repeat;
}
.cate_06 .content-box h2,
.cate_06 .content-box h3 {
	background:
		radial-gradient(circle at top left,     transparent 5px, #232b57 0) top left,
		radial-gradient(circle at bottom left,  transparent 5px, #232b57 0) bottom left;
	background-size: 0.7rem 50%;
	background-repeat: no-repeat;
}
    
.content-box h2 span,
.content-box h3 span {
	display: inline-block;
	padding: 0.7rem 1rem 0.8rem 1.4rem;
	background:
		radial-gradient(circle at top right,    transparent 5px, var(--beige4) 0) top right,
		radial-gradient(circle at bottom right, transparent 5px, var(--beige4) 0) bottom right;
	background-size: calc(100% - 0.7rem) 50%;
	background-repeat: no-repeat;
}











/*
.content-box h2,
.content-box h3{
    position: absolute;
    z-index: 2;
    top: 2.5rem;
    left: -0.5rem;
    display: inline-block;
	font-size: 1.4rem;
	font-family: var(--f_mincho);
    color: var(--green2);
    padding: 0.5rem 1rem 0.5rem 2rem;
    max-width: 110%;
}
.cate_01 .content-box h2,
.cate_01 .content-box h3{
    background: url("../img/common/care-h3_bg_01_center.png") repeat-y;
    background-size: 100%;
}
.cate_02 .content-box h2,
.cate_02 .content-box h3{
    background: url("../img/common/care-h3_bg_02_center.png") repeat-y;
    background-size: 100%;
}
.cate_03 .content-box h2,
.cate_03 .content-box h3{
    background: url("../img/common/care-h3_bg_03_center.png") repeat-y;
    background-size: 100%;
}









.content-box h2:before,  
.content-box h3:before{   
    content: "";
    position: absolute;    
    top: -0.3rem;
    left: 0;
    width: 100%;
    height: 1rem;
}

.cate_01 .content-box h2:before,
.cate_01 .content-box h3:before{
    background: url("../img/common/care-h3_bg_01_top.png") no-repeat;
    background-size: 100%;
}
.cate_02 .content-box h2:before,
.cate_02 .content-box h3:before{
    background: url("../img/common/care-h3_bg_02_top.png") no-repeat;
    background-size: 100%;
}
.cate_03 .content-box h2:before,
.cate_03 .content-box h3:before{
    background: url("../img/common/care-h3_bg_03_top.png") no-repeat;
    background-size: 100%;
}
.content-box h2:after,
.content-box h3:after{
    content: "";
    position: absolute;
    bottom: -0.8rem;
    left: 0;
    width: 100%;
    height: 1rem;
}
.cate_01 .content-box h2:after,
.cate_01 .content-box h3:after{
    background: url("../img/common/care-h3_bg_01_btm.png") no-repeat;
    background-size: 100%;
}
.cate_02 .content-box h2:after,
.cate_02 .content-box h3:after{
    background: url("../img/common/care-h3_bg_02_btm.png") no-repeat;
    background-size: 100%;
}
.cate_03 .content-box h2:after,
.cate_03 .content-box h3:after{
    background: url("../img/common/care-h3_bg_03_btm.png") no-repeat;
    background-size: 100%;
}
*/
.content-box p{
    position: relative;
    display: inline-block;
    color: var(--beige1);
    padding: 0.5rem 1rem 0.5rem 2rem;
    background: url("../img/common/content-box-p_center.png") repeat-y;
    background-size: 100%;
    width: 104%;
    left: -2%;
    margin-bottom: 0;
    
}
.content-box p:before{   
    content: "";
    position: absolute;    
    top: -0.3rem;
    left: 0;
    width: 100%;
    height: 1rem;
    background: url("../img/common/content-box-p_top.png") no-repeat;
    background-size: 100%;
}
.content-box p:after{
    content: "";
    position: absolute;
    bottom: -0.5rem;
    left: 0;
    width: 100%;
    height: 1rem;
    background: url("../img/common/content-box-p_btm.png") no-repeat;
    background-size: 100%;
}







/*

main.content-detail .content-box h3 {
	position: absolute;
	left: -3%;
	top: 6%;
	display: inline-block;
	color: var(--green1);
	background-color: var(--green4);
	border: 0.5px solid #00381F;
	border-radius: 0 0 10px 10px;
	padding: 0.5rem 0.5rem 0.3rem!important;
	z-index: 2;
	font-size: 1.4rem;
	font-family: var(--f_mincho);
}
	
*/
.content-box p{
	padding: 1rem ;
	font-size: 0.9rem;
    line-height: 1.4rem;
    position: relative;
    z-index: 2;
}

/* 　コンテンツ詳細ページ
------------------------------------------------------- */

#contents .wrapper {
	display: flow-root;
}
	
#contents .wrapper .wrap-right {
    float: right;
    width: 400px;
    margin: 1rem 0 1rem 1.5rem;
    text-align: center;
}

@media screen and (max-width: 959px){
	
	#contents .wrapper {
		display: flex;
		flex-wrap: wrap;
	}
	
    #contents .wrapper .wrap-right {
		width: 100%;
		float:none;
}
}

/*
.content-detail .cont_bg {
	padding: 0 4rem 2rem;
}
*/

.content-detail .cont {
	position: relative;
}

.content-detail .content-number {
	position: absolute;
	padding: 2rem 1rem;
	font-family: var(--f_en1);
  	font-optical-sizing: auto;
  	font-weight: 600;
  	font-style: italic;
  	font-variation-settings:
    "slnt" 0;
	font-size: 2rem;
	left: -3rem;
	color: var(--green1);
	box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.4);
}

.content-detail .content-number.c1-c01_t {
	color: var(--beige2);
}

.content-detail .content-number::after {
	writing-mode: vertical-rl;
  	position: absolute;
  	top: 0.3rem;
  	left: 0.2rem;
  	font-size: 0.65rem;
	line-height: 0.7rem;
  	white-space: nowrap;
	color: var(--green1);
	font-style: normal;
}

.content-detail .content-number.c1-c01_t::after {
	content: 'Techniques No.';
	color: var(--beige2);
}

.content-detail .content-number.c1-c02_t::after {
	content: 'Arcives No.';
}

.content-detail .content-number.c1-c03_t::after {
	content: 'Event No.';
}

main.content-detail .content-cate-box {
	background: var(--green2);
/*	padding: 2rem 0;*/
}

main.content-detail .content-cate-box .content-cate {
	display: flex;
    flex-wrap: wrap;
    row-gap: 1rem;
    column-gap: 1.2rem;
	padding: 0 1.5rem;
}

main.content-detail .content-cate-box .content-cate li {
	display: inline-block;
	font-size: 0.9rem;
	font-family: var(--f_mincho2);
  	font-weight: 600;
  	font-style: normal;
	color: var(--red2);
    background-color: var(--gray1);
    text-align: center;
    line-height: 1.2rem;
    position: relative;
    border: 0.5px solid var(--green1);
    padding: .5rem 1rem .5rem 1rem;
    border-radius: 0px 50px 50px 0px;
	z-index: 1;
	border-radius: 0;
	right: -2rem;
}

main.content-detail .content-cate-box .content-cate li::before {
    content: "";
    display: block;
    width: 100%;
    height: 111%;
    position: absolute;
    right: -4px;
    top: -4px;
    z-index: -1;
    background: url(../../common/img/common/c2-right2.png) right bottom / auto 100% no-repeat;
	background-image: none;
    background-position: right bottom;
}

.content-detail time {
	text-align: center;
	display: block;
	font-size: 0.9rem;
	margin: 0 0 1rem;
	font-family: var(--f_en1);
  	font-optical-sizing: auto;
  	font-weight: 600;
  	font-style: italic;
  	font-variation-settings:
    "slnt" 0;
}

@media screen and (max-width: 767px){
	main.content-detail.fix-img  .content-cate-box .content-cate {
		display: block;
		position: relative;
		right: auto;
		top: auto;
	}
}

/* テキストエリアと画像の横並び */

main.content-detail .sec-box {
	margin-bottom: 3rem;
	grid-template-columns: 2fr 1fr;
	/*display: flex;*/
	display: grid;
	align-items: stretch;
	position: relative;
}

main.content-detail .sec-box:not(.sec-clm1) .sec-box_01 {
	z-index: 10;
	height:fit-content;
}

main.content-detail .sec-box .sec-box_02 {
	position: relative;
	left: -6rem;
	box-sizing: border-box;
	height: fit-content;
}

main.content-detail .sec-box.sec-clm1 {
	display: grid;
	grid-template-columns: 1fr;
}

/*
main.content-detail .sec-box_01 .cont, 
main.content-detail .sec-box_01 .cont_in {
  	display: flex;
  	flex-direction: column;
	flex-grow: 1;
}*/

/*
@media screen and (max-width: 959px){
    main.content-detail .sec-box {
        grid-template-columns: repeat(1, 1fr);
}
}*/


main.content-detail .sec-box .sec-box_01 .cont_in > div {
	/*overflow-y: scroll;*/
	/*overflow:scroll;
  	overflow-x: hidden;
	height: 200px;*/
	
	max-height: 500px;
	min-height: 300px;
	overflow:auto;
  	overflow-x: hidden;
	box-sizing: border-box;
	padding-right: 1rem;
}

main.content-detail .sec-box .sec-box_01 .cont_in > div::-webkit-scrollbar {
  width: 12px;
}

main.content-detail .sec-box .sec-box_01 .cont_in > div::-webkit-scrollbar-thumb {
  background: var(--green3); 
}

main.content-detail .sec-box .sec-box_01 .cont_in > div::-webkit-scrollbar-track {
  background: var(--beige1);
}


main.content-detail .sec-box .sec-box_02 > div {
	/*position: absolute;
	position: sticky;
    top: 100px;*/
	width: calc(100% + 6rem);
}

main.content-detail .sec-box .sec-box_02 img {
	width: 100%;
    height: auto;
    object-fit: cover;
}

main.content-detail .sec-box .sec-box_02 p {
	margin-left: 7rem;
	text-align: right;
}


@media screen and (max-width: 959px){
	
	main.content-detail .sec-box {
		grid-template-columns: repeat(1, 1fr);
	}
	
	
	main.content-detail .sec-box:not(.sec-clm1) .sec-box_01 {
		width: 100%;
	}
	
	main.content-detail .sec-box .sec-box_01 .cont_in > div {
		max-height: none!important;
		min-height: auto!important;
	}
	
	main.content-detail .sec-box .sec-box_02 {
		width: 100%;
		left: 0;
		top: -2rem;
	}
	main.content-detail .sec-box .sec-box_02 > div {
		width: 100%;
	}
	main.content-detail .sec-box .sec-box_02 p {
		margin-left: 0;
		text-align: center;
	}
}



main.content-detail aside {
	margin-top: 2rem;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap:3rem;
}

main.content-detail aside > section:only-child {
	grid-column: 2;
}

/*@media screen and (max-width: 959px){*/
@media screen and (max-width: 767px){
    main.content-detail aside {
        grid-template-columns: repeat(1, 1fr);
		gap:1rem;
}
}

.content-detail aside section {
	margin-bottom: 1rem;
}

.content-detail aside h2 {
	font-size: 2rem;
}

.content-detail aside h2#key {
	text-align: right;
}

main.content-detail aside .content-area {
	padding: 2rem;
}

main.content-detail aside .lnk1 {
	margin: 1rem 0 2rem 1rem;
}

@media screen and (max-width: 1279px){
	.content-detail aside h2#key {
		padding-right: 10px;
	}
}

/* 　newsページ
------------------------------------------------------- */

.fix-img .column-1,
.fix-img .column-2 {
	contain: paint;
}
.fix-img .column-1 {
	width: 64%;
	padding: 13px 0 12px;
	position: relative;
	background-image:	url('../img/common/cont_top.png');
	background-position:center top;
	background-repeat:	no-repeat;
	background-size:	100% 20px;
	margin-left: 1%;
}
.fix-img .column-1 .cont_in {
	background-image:	url('../img/common/cont_btm.png'), url("../img/common/cont.png");
	background-position:center bottom, center 20px;
	background-repeat:	no-repeat, repeat;
	background-size:	100% 20px, contain;
}
/*
.fix-img .column-1 .cont_in {
	background-image:	url('../img/common/cont_top.png'), url('../img/common/cont_btm.png'), url("../img/common/cont.png");
	background-position:center top, center bottom, center 20px;
	background-repeat:	no-repeat, no-repeat, repeat;
	background-size:	100% 20px, 100% 20px, contain;

}
*/
/*
.fix-img .column-1 .cont_in {
	background: url("../img/common/cont.png");
    background-repeat: repeat;
    background-size: 100%;
}
*/
/*
.fix-img .column-1:before{
    content: "";
    position: relative;
    display: block;
    background: url('../img/common/cont_top.png');
    background-repeat: no-repeat;
    height: 10px;
    background-size: 100%;
}
*/
/*
.fix-img .column-1:after{
    content: "";
    position: relative;
    display: block;
    background: url('../img/common/cont_btm.png');
    background-repeat: no-repeat;
    height: 20px;
    background-size: 100%;
}
*/
.fix-img .column-2 {
	width: 35%;
	padding: 0 1em;
}

.fix-img .column-1 img,
.fix-img .column-2 img {
	max-width: 100%;;
}

.fix-img .sec_cover {
	display: flex;
	flex-direction: row;
	margin: 0 auto 2rem;
}

.fix-img .sticky {
	position:	sticky;
	top:		120px;
	margin:		auto;
}

.fix-img .mskImg2 {
	mask-image: url("../img/mask3.png");
	-webkit-mask-image: url("../img/mask3.png");
}

@media screen and (max-width: 1279px){
	.fix-img h2 {
		margin-left: 10px;
	}
	
	.fix-img .cont_in h2 {
		margin-left: 0;
	}
}

@media screen and (max-width: 959px){
/*
	.fix-img .column-1 {
		padding: 13px 0 12px 10px;
	}
	.fix-img .column-1:before{
		height: 7px;
	}
*/
}

@media screen and (max-width: 767px){

	.fix-img .outline {
		padding: 0 1rem;
	}
	
	.fix-img .sec_cover {
		display: block;
		flex-direction: row;
		margin: 0 auto 2rem;
	}
	
	.fix-img ul.content-cate li {
		max-width: none;
		margin-bottom: .5rem;
	}
	
	.fix-img .column-1 {
		margin-left: 0;
	}
	
	.fix-img .column-1:before{
		height: 5px;
	}
	
	.fix-img .column-1,
	.fix-img .column-2 {
		width: auto;
		margin-bottom: 2rem;
	}
	
	.fix-img .column-2 {
		padding: 0;
	}
	.fix-img .column-2 .fs9 {
		text-align: center;
		margin: .5rem 0 0;
	}
}


/* 　newsページ
------------------------------------------------------- */


main.m-news .news-area {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap:2rem;
	margin: 3rem 0 0;
    align-items: stretch;
}
@media screen and (max-width: 1250px){
		main.m-news .news-area {
			grid-template-columns: repeat(2, 1fr);
		}
	}
/*@media screen and (max-width: 959px){*/
@media screen and (max-width: 767px){
    main.m-news .news-area {
        grid-template-columns: repeat(1, 1fr);
	}
}
main.m-news .news-area .cate {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;    
}

main.m-news .news-area img {
	aspect-ratio: 4 / 3;
    object-fit: cover;
    object-position: 50% 50%;
    width: 100%;
}

main.m-news .news-area a {
    text-decoration: none;
    position: relative;
/*    height: fit-content;*/
    height: auto;
    display: flex; 
    flex-direction: column;
}

main.m-news .news-area a::after {
    content: "";
    display: inline-block;
    width: 40px;
    height: 35px;
    border-radius: 3px;
    background: var(--beige4) url("../img/common/icon_arrow_01_red.svg") no-repeat;
    background-size: 40px;
    background-position: center center;
    position: absolute;
    right: 0.5rem;
    bottom: 2.5rem;
    box-shadow: var(--shadow2);
}
main.m-news .news-area a:hover::after {
    background: var(--red2) url("../img/common/icon_arrow_01_d.svg") no-repeat;
    background-size: 40px;
    background-position: center center;
}

main.m-news .news-area time {
    padding: 0 1rem;
    font-weight: 600;
    font-size: 1.2rem;
    font-family: var(--f_en1);
    font-optical-sizing: auto;
    font-style: normal;
    letter-spacing: 0.02em;
    font-style: italic;
}
	
main.m-news .news-area .news-cate {
    margin: 0 10px -10px 0;
/*
    position: absolute;
    top:-0.5rem;
    right: 0.5rem;
*/
}
/*
main.m-news .news-box{
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}

main.m-news .news-box:before {
    content: "";
    position: relative;
    display: block;
    background: url("../img/common/cont_top.png");
    background-repeat: no-repeat;
    top: -6px;
    height: 20px;
    background-size: 100%;
}

main.m-news .news-box:after
{
    content: "";
    position: relative;
    display: block;
    height: 20px;
    bottom: 20px;
    background: url("../img/common/cont_btm.png");
    background-size: 100%;
    background-repeat: no-repeat;
}
*/
main.m-news .news-box{
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  padding-top: 20px; 
  padding-bottom: 20px;  
}

main.m-news .news-box::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 20px;
  background: url("../img/common/cont_top.png") no-repeat;
  background-size: 100%;
}

main.m-news .news-box::after{
  content: "";
  position: absolute;
  bottom: 20px; 
  left: 0;
  right: 0;
  height: 20px;
  background: url("../img/common/cont_btm.png") no-repeat;
  background-size: 100%;
}

main.m-news .inner-box {
    background: url("../img/common/cont.png") repeat-y 0 -6px;
    background-size: 100%;
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 1rem;
    position: relative;
    top: -15px;
}

main.m-news .inner-box p {
    font-weight: 600;
    margin-bottom: 1rem;
}

main.m-news .cate_news {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 1rem;
}

main.m-news .cate_news li,
.news-area .news-cate{
    position: relative;
    color: var(--beige1);
    font-weight: 600;
}

main.m-news .cate_news li.news-c01,
.news-area .news-cate.news-c01{
    background-color: var(--green1);
}
main.m-news .cate_news li.news-c02,
.news-area .news-cate.news-c02{
    background-color: #47AC9A;
    color: var(--green1);
}
main.m-news .cate_news li.news-c03,
.news-area .news-cate.news-c03{
    background-color: #6A3F1C;
}
main.m-news .cate_news li.news-c04,
.news-area .news-cate.news-c04{
    background-color: #D6B930;
    color: var(--green1);
}
main.m-news .cate_news li.news-c05,
.news-area .news-cate.news-c05{
    background-color: #232b57;
}

main.m-news .cate_news li::after,
.news-area .news-cate::after{
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    border-width: 0 10px 10px 0;
    border-style: solid;
    box-shadow: -1px 1px 1px var(--beige1);
}

main.m-news .cate_news li.news-c01::after,
.news-area .news-cate.news-c01::after{
    border-color: var(--green1) var(--beige1) var(--green1);
}

main.m-news .cate_news li.news-c02::after,
.news-area .news-cate.news-c02::after{
    border-color: #47AC9A var(--beige1) #47AC9A;
}

main.m-news .cate_news li.news-c03::after,
.news-area .news-cate.news-c03::after{
    border-color: #6A3F1C var(--beige1) #6A3F1C;
}

main.m-news .cate_news li.news-c04::after,
.news-area .news-cate.news-c04::after{
    border-color: #6A3F1C var(--beige1) #D6B930;
}

main.m-news .cate_news li.news-c05::after,
.news-area .news-cate.news-c05::after {
    border-color: #232b57 var(--beige1) #232b57;
}

main.m-news .cate_news li button,
.news-area .news-cate{
    text-decoration: none;
    padding: 0.3rem 1rem 0.2rem 1rem;
    display: block;
    font-size: 0.9rem;
}

/* 　projectページ
------------------------------------------------------- */

main.m-project .cont_bg {
    background-color: transparent;
}

main.m-project .project_bg {
    background: url("../img/common/project_bg.png") no-repeat;
    background-attachment: fixed;
    background-size: 100% auto;
    background-position: top 18rem center;
    position: relative;
}

main.m-project #contents {
    max-width:100%;
}

main.m-project h2 {
    font-family: var(--f_mincho);
	font-weight: 400;
	font-style: normal;
    font-size: 2rem;
	letter-spacing: 0.1em;
    text-align: center;
    position: relative;
    z-index: 1;
    padding: 4rem 0 2rem;
}

main.m-project h2::before {
    width: 100%;
    display: block;
    font-family: var(--f_en1);
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
    font-variation-settings: "slnt" 0;
    word-break: break-all;
	letter-spacing: 0.02em;
    color: #fff;
    position: absolute;
    left: 50%;
    top: 80%;
    transform: translate(-50%, -60%);
    z-index: -1;
}

main.m-project #sec_01 h2{padding-top: 10rem;}
main.m-project #sec_01 h2::before {
    content: "About the Project";
    font-size: 5rem;
    line-height: 3.2rem;
}

@media screen and (min-width: 1921px){
	main.m-project #sec_01 h2{padding-top: 15rem;}
}

main.m-project #sec_02 h2::before {
    content: "What is ''The 'Care' Toolbox''";
    font-size: 4rem;
    line-height: 2.5rem;
    top: 60%;
}

main.m-project #sec_03 h2 {
	padding: 4rem 0 7rem;
}

main.m-project #sec_03 h2::before {
	content: "Living Archive of Care";
	font-size: 4rem;
	line-height: 2.5rem;
    top: 60%;
}

.nm_text {
    font-size: 3rem;
    font-weight: 700;
	font-family: var(--f_en1);
    font-optical-sizing: auto;
    font-variation-settings: "slnt" 0;
    font-style: italic;
	padding: 0 2rem;
    white-space: nowrap;
}

main.m-project h2 .fs9 {
    display: block;
    padding-top: 2.5rem;
	font-family: var(--f_en2);
  	font-weight: 600;
  	font-style: normal;
	letter-spacing: 0.02em;
}


@media screen and (max-width: 959px){
    main.m-project #sec_01 h2{padding-top: 5rem;}
    main.m-project #sec_01 h2::before {
        font-size: 3.5rem;
        }
    main.m-project #sec_02 h2::before {
        font-size: 3rem;
        }
    main.m-project #sec_03 h2::before {
        font-size: 3rem;
    }
    
}

@media screen and (max-width: 767px){
	.nm_text {
    	font-size: 2rem;
	}
	.cont_in h2 {
		padding-top: 0;
	}
}


/*
main.m-project h3 {
    position: relative;
	font-family: var(--f_mincho2);
  	font-weight: 400;
  	font-style: normal;
}
*/

main.m-project #contents {
    padding: 1rem 0rem 2rem;
}

main.m-project .ac-container {
    margin: 2rem 0;
}

main.m-project #sec_01,
main.m-project #sec_02 {
    margin-bottom: 2rem;
}

main.m-project .ac-container h3 {
    position: relative;
}


main.m-project #sec_01 .ac-container:nth-of-type(1) h3,
main.m-project #sec_02 .ac-container:nth-of-type(3) h3{
    margin-left: 20%;
    background: url("../img/common/project-h3_bg_01_center.png") repeat-y;
    background-size: 100%;
}

main.m-project #sec_01 .ac-container:nth-of-type(2) h3,
main.m-project #sec_02 .ac-container:nth-of-type(1) h3{
    margin-right: 15%;
    background: url("../img/common/project-h3_bg_02_center.png") repeat-y;
    background-size: 100%;
}
main.m-project #sec_01 .ac-container:nth-of-type(3) h3,
main.m-project #sec_02 .ac-container:nth-of-type(2) h3{
    margin-left: 10%;
    background: url("../img/common/project-h3_bg_03_center.png") repeat-y;
    background-size: 100%;
}

main.m-project #sec_01 .ac-container:nth-of-type(1) h3:before,
main.m-project #sec_02 .ac-container:nth-of-type(3) h3:before,
main.m-project #sec_01 .ac-container:nth-of-type(2) h3:before,
main.m-project #sec_02 .ac-container:nth-of-type(1) h3:before,
main.m-project #sec_01 .ac-container:nth-of-type(3) h3:before,
main.m-project #sec_02 .ac-container:nth-of-type(2) h3:before{   
    content: "";
    position: absolute;    
    top: -0.4rem;
    width: 100%;
    height: 1rem;
}

main.m-project #sec_01 .ac-container:nth-of-type(1) h3:before,
main.m-project #sec_02 .ac-container:nth-of-type(3) h3:before{
    background: url("../img/common/project-h3_bg_01_top.png") no-repeat;
    background-size: 100%;
}
main.m-project #sec_01 .ac-container:nth-of-type(2) h3:before,
main.m-project #sec_02 .ac-container:nth-of-type(1) h3:before{
    background: url("../img/common/project-h3_bg_02_top.png") no-repeat;
    background-size: 100%;
}
main.m-project #sec_01 .ac-container:nth-of-type(3) h3:before,
main.m-project #sec_02 .ac-container:nth-of-type(2) h3:before{
    background: url("../img/common/project-h3_bg_03_top.png") no-repeat;
    background-size: 100%;
}


main.m-project #sec_01 .ac-container:nth-of-type(1) h3:after,
main.m-project #sec_02 .ac-container:nth-of-type(3) h3:after,
main.m-project #sec_01 .ac-container:nth-of-type(2) h3:after,
main.m-project #sec_02 .ac-container:nth-of-type(1) h3:after,
main.m-project #sec_01 .ac-container:nth-of-type(3) h3:after,
main.m-project #sec_02 .ac-container:nth-of-type(2) h3:after{
    content: "";
    position: absolute;
    bottom: -0.7rem;
    width: 100%;
    height: 1rem;
}


main.m-project #sec_01 .ac-container:nth-of-type(1) h3:after,
main.m-project #sec_02 .ac-container:nth-of-type(3) h3:after{
    background: url("../img/common/project-h3_bg_01_btm.png") no-repeat;
    background-size: 100%;
}

main.m-project #sec_01 .ac-container:nth-of-type(2) h3:after,
main.m-project #sec_02 .ac-container:nth-of-type(1) h3:after{
    background: url("../img/common/project-h3_bg_02_btm.png") no-repeat;
    background-size: 100%;
}

main.m-project #sec_01 .ac-container:nth-of-type(3) h3:after,
main.m-project #sec_02 .ac-container:nth-of-type(2) h3:after{
    background: url("../img/common/project-h3_bg_03_btm.png") no-repeat;
    background-size: 100%;
}



@media screen and (max-width: 1350px){

main.m-project #sec_01 .ac-container:nth-of-type(1) h3:before,
main.m-project #sec_02 .ac-container:nth-of-type(3) h3:before,
main.m-project #sec_01 .ac-container:nth-of-type(2) h3:before,
main.m-project #sec_02 .ac-container:nth-of-type(1) h3:before,
main.m-project #sec_01 .ac-container:nth-of-type(3) h3:before,
main.m-project #sec_02 .ac-container:nth-of-type(2) h3:before{
    top: -0.3rem;
}
    
main.m-project #sec_01 .ac-container:nth-of-type(1) h3:after,
main.m-project #sec_02 .ac-container:nth-of-type(3) h3:after,
main.m-project #sec_01 .ac-container:nth-of-type(2) h3:after,
main.m-project #sec_02 .ac-container:nth-of-type(1) h3:after,
main.m-project #sec_01 .ac-container:nth-of-type(3) h3:after,
main.m-project #sec_02 .ac-container:nth-of-type(2) h3:after{
    bottom: -0.9rem;
}
}


@media screen and (max-width: 959px){
main.m-project #sec_01 .ac-container:nth-of-type(1) h3,
main.m-project #sec_02 .ac-container:nth-of-type(3) h3,
main.m-project #sec_01 .ac-container:nth-of-type(3) h3,
main.m-project #sec_02 .ac-container:nth-of-type(2) h3{
    margin-left: 5%;
}
main.m-project #sec_01 .ac-container:nth-of-type(2) h3,
main.m-project #sec_02 .ac-container:nth-of-type(1) h3{
    margin-right: 5%;
}
main.m-project #sec_01 .ac-container:nth-of-type(1) h3:before,
main.m-project #sec_02 .ac-container:nth-of-type(3) h3:before,
main.m-project #sec_01 .ac-container:nth-of-type(2) h3:before,
main.m-project #sec_02 .ac-container:nth-of-type(1) h3:before,
main.m-project #sec_01 .ac-container:nth-of-type(3) h3:before,
main.m-project #sec_02 .ac-container:nth-of-type(2) h3:before{
    top: -0.2rem;
}
main.m-project #sec_01 .ac-container:nth-of-type(1) h3:after,
main.m-project #sec_02 .ac-container:nth-of-type(3) h3:after,
main.m-project #sec_01 .ac-container:nth-of-type(2) h3:after,
main.m-project #sec_02 .ac-container:nth-of-type(1) h3:after,
main.m-project #sec_01 .ac-container:nth-of-type(3) h3:after,
main.m-project #sec_02 .ac-container:nth-of-type(2) h3:after{
    bottom: -1rem;
}
}











/*

main.m-project #sec_01 .ac-container:nth-of-type(2) h3,
main.m-project #sec_02 .ac-container:nth-of-type(1) h3{
    margin-right: 15%;
    background: url("../img/common/project-h3_bg_02.png") no-repeat;
    background-size: 100% 100%;
    background-position: center left -4rem;
}
main.m-project #sec_01 .ac-container:nth-of-type(3) h3,
main.m-project #sec_02 .ac-container:nth-of-type(2) h3{
    margin-left: 10%;
    background: url("../img/common/project-h3_bg_03.png") no-repeat;
    background-size: 100% 100%;
    background-position: center right -4rem;
}

*/


/*

@media screen and (max-width: 959px){
        main.m-project #sec_01 .ac-container:nth-of-type(1) h3,
        main.m-project #sec_02 .ac-container:nth-of-type(3) h3{
        margin-left: 15%;
        background: url("../img/common/project-h3_bg_01_sp.png") no-repeat;
        background-size: 100% 100%;
        background-position: center right -2rem;
    }
        main.m-project #sec_01 .ac-container:nth-of-type(2) h3,
        main.m-project #sec_02 .ac-container:nth-of-type(1) h3{
        margin-right: 10%;
        background: url("../img/common/project-h3_bg_02_sp.png") no-repeat;
        background-size: 100% 100%;
        background-position: center left -2rem;
    }
        main.m-project #sec_01 .ac-container:nth-of-type(3) h3,
        main.m-project #sec_02 .ac-container:nth-of-type(2) h3{
            margin-left: 5%;
            background: url("../img/common/project-h3_bg_03_sp.png") no-repeat;
            background-size: 100% 100%;
            background-position: center right -2rem;
    }
}
*/


main.m-project .ac-parent {
    color: var(--green4);
    padding: 0.9rem 3rem 0.7rem 9rem;
    background: url("../img/common/icon_arrow_01_r.svg") no-repeat;
    background-size: 1.8rem;
    background-position: left 7rem center;
    line-height: 1.8rem;
	display: flex;
	align-items: center;
	gap:1rem;
	letter-spacing: 0.08em;
	font-family: var(--f_mincho);
}

main.m-project .ac-parent.on {
	background: url("../img/common/icon_arrow_01_d.svg") no-repeat;
    background-size: 2.5rem;
    background-position: left 7rem center;
}

main.m-project .ac-child {
    padding: 3rem 2rem;
    margin: 0 auto;
    max-width: 1280px;
}

@media screen and (max-width: 959px){
    main.m-project .ac-parent {
        display: flex;
        align-items: center;
        gap:1rem;
        padding: 1.5rem 2rem 1.5rem 3rem;
        background: url("../img/common/icon_arrow_01_r.svg") no-repeat;
        background-size: 1.8rem;
        background-position: left 1.5rem center;
    }

    .nm_text {
        padding: 0 1rem;
    }
    main.m-project .ac-parent.on {
        background: url("../img/common/icon_arrow_01_d.svg") no-repeat;
        background-size: 2.5rem;
        background-position: left 1rem center;
    }
    main.m-project .ac-child {
        padding: 2rem;
    }

}

@media screen and (max-width: 767px){
    main.m-project .ac-parent {
        gap:.5rem;
        padding: 1rem 1.5rem 1rem 2rem;
        background-size: 1.6rem;
        background-position: left 1.2rem center;
    }
	
	main.m-project .ac-parent.on {
        background-size: 2.2rem;
        background-position: left .8rem center;
    }

}	



/* 　careページ
------------------------------------------------------- */

.catearikata{
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap:2rem;
    align-items: start;
    padding: 3rem 0 0;
}

.catearikata .text{
    position: relative;
    background: url("../img/common/care_center.png") repeat-y;
    background-size: 100%;
}

.catearikata .text::before{
    content: "";
    position: relative;
    display: block;
    background-repeat: no-repeat;
    bottom: 1.3rem;
    height: 1.3rem;
    background: url('../img/common/care_top.png') no-repeat;
    background-size: 100%;
}

.catearikata .text::after{
    content: "";
    position: relative;
    display: block;
    background-repeat: no-repeat;
    bottom: -1.8rem;
    height: 2rem;
    background: url('../img/common/care_btm.png') no-repeat;
    background-size: 100%;
}

@media screen and (max-width: 599px){

.catearikata .text::before{
    content: "";
    position: relative;
    display: block;
    background-repeat: no-repeat;
    bottom: 0.9rem;
    height: 1rem;
    background: url('../img/common/care_top.png') no-repeat;
    background-size: 100%;
}
}

.m-archive-contents .catearikata h2{
    margin: 2rem 2rem 2rem 0;
    display: inline-block;
}

 .catearikata p{
    padding: 0;
    margin: 0 2rem;
}

.m-archive-contents .catearikata button.reset {
    display: inline-block;
    border-radius: 10px;
    box-shadow: var(--shadow);
    background: var(--beige4);
    padding: 0.2rem 0.5rem;
    font-weight: bold;
}
.m-archive-contents .catearikata button.reset:hover {
    color: var(--beige4);
    background-color: var(--green1);
    box-shadow: 3px 3px 0 var(--beige4);
}


/*@media screen and (max-width: 959px){*/
@media screen and (max-width: 767px){
.catearikata{
    grid-template-columns: 1fr;
    gap:1rem;
}
    
}

/* スライド */

.a-contents_02 .slick-slide,
main.m-project .slick-slide {
    transition: all 0.3s ease-in-out; /* スムーズなアニメーションのために追加 */
    transform: scale(0.85); /* 中央でないスライドを少し小さくする */
    opacity: 0.7; /* 中央でないスライドを少し薄くする */
    margin: 0;
    height: auto !important;
}

/*
.a-contents_02 .slick-slide > div,
main.m-project .slick-slide > div {
    margin-bottom: 1rem;
	padding-left: 2rem;
	padding-right: 2rem;
}
*/

.a-contents_02 .slick-center,
main.m-project .slick-center {
  transform: scale(1); /* 中央のスライドを標準サイズに戻す（または大きくする） */
  opacity: 1; /* 中央のスライドは不透明に */
}


.a-contents_02 .slick-prev,
main.m-project .slick-prev,
.a-contents_02 .slick-next,
main.m-project .slick-next {
  top: 50%; /* 垂直方向の中央 */
  transform: translateY(-50%);
  background: none;
    height: 50px;
    width: 50px;
	padding: 0;
}
@media screen and (max-width: 959px){
	main.m-project .slick-prev,
	.a-contents_02 .slick-prev {
		left: -2rem;
	}
	main.m-project .slick-next,
	.a-contents_02 .slick-next {
		right: -2rem;
	}
	main.m-project .slick-slide > div,
	.a-contents_02 .slick-slide > div {
		padding-left: 2rem;
    	padding-right: 2rem;
	}
}

main.m-project .slick-prev:before,
.a-contents_02 .slick-prev:before {
    background: url(../img/common/icon_arrow_01.svg) no-repeat;
    transform: rotate(90deg);
    background-size: cover;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    height: 50px;
    width: 50px;
}

main.m-project .slick-next:before,
.a-contents_02 .slick-next:before {
    background: url("../img/common/icon_arrow_01.svg") no-repeat;
    transform: rotate(-90deg);
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    height: 50px;
    width: 50px;
}

main.m-project .slick-controls,
.a-contents_02 .slick-controls {
    display: flex;
    gap: 2rem;
    justify-content: center;
    align-items: center;
    margin: 0 0 2rem;
    padding: 0 0 3rem;
}

main.m-project .slick-controls .slide-dots .slick-dots,
.a-contents_02 .slick-controls .slide-dots .slick-dots {
    position: relative;
    bottom: auto;
    display: inline-block;
    margin: 0;
}

main.m-project .slick-dots li button,
.a-contents_02 .slick-dots li button {
    width: 15px;
}

main.m-project .slick-dots li button:hover, 
main.m-project .slick-dots .slick-dots li button:focus,
.a-contents_02 .slick-dots li button:hover, 
.a-contents_02 .slick-dots .slick-dots li button:focus {
    outline: auto;
}

/* Dots */
main.m-project .slick-dotted.slick-slider{
    margin: 0 2rem;
}
.a-contents_02 .slick-dotted.slick-slider {
    margin: 0 2rem;
/*    padding: 0 2rem;*/
    
}
@media screen and (max-width:959px){
.a-contents_02 .slick-dotted.slick-slider {
/*
    margin: 0;
    padding: 2rem;
*/
}
    
}


main.m-project .slick-dots,
.a-contents_02 .slick-dots {
    position: absolute;
    bottom: -25px;
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
}

main.m-project .slick-dots li,
.a-contents_02 .slick-dots li {
    position: relative;
    display: inline-block;
    width: 7px;
    height: 7px;
    margin: 0 7px;
    padding: 0;
    cursor: pointer;
    top: -3px;
}

main.m-project .slick-dots li button,
.a-contents_02 .slick-dots li button {
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 10px;
    height: 10px;
    background: var(--black);
    text-align: center;
    opacity: .5;
}

.a-contents_02 .slick-dots li button {
    background: var(--beige1);
}

main.m-project .slick-dots li button:hover,
main.m-project .slick-dots li button:focus,
.a-contents_02 .slick-dots li button:hover,
.a-contents_02 .slick-dots li button:focus {
    outline: solid 2px var(--black);
	background-color: var(--black);
}

main.m-project .slick-dots li.slick-active button,
.a-contents_02 .slick-dots li.slick-active button {
    opacity: 1;
}

main.m-project .slick-controls button,
.a-contents_02 .slick-controls button {
    background: none;
}

main.m-project .slick-controls button img,
.a-contents_02 .slick-controls button img {
    width: 3rem;
}

main.m-project .slick-controls button#slick-play-btn,
.a-contents_02 .slick-controls button#slick-play-btn {
    display: none;
}

main.m-project .slick-controls button:hover,
.a-contents_02 .slick-controls button:hover {
  outline: solid 2px var(--black);
}

main.m-project .slick-track,
.a-contents_02 .slick-track {
	padding: 2rem 0 0;
}

main.m-project .slick-list,
.a-contents_02 .slick-list {
	padding: 0 75px;
}

@media screen and (max-width: 959px){

main.m-project .slick-track,
.a-contents_02 .slick-track {
	padding: 0;
}
    
}

/*---- アコーディオン ----*/

.ac-parent {
	font-weight: 500;
  	transition: .3s;
  	padding: 1rem 3rem 1rem 1rem;
	background: url("../img/common/icon_arrow_01_w_left.svg") no-repeat;
	background-size: 1.5rem;
    background-position: right 1rem top 1.1rem;
	display: block;
	width: 100%;
	color: #fff;
	box-sizing: border-box;
}
.ac-child {
	padding: 1rem;
}

.ac-parent.on {
	background: url("../img/common/icon_arrow_01_w_down.svg") no-repeat;
	background-size: 1.5rem;
	background-position: right 1rem top 1.1rem;
	color: var(--green2);
}

/*---- アコーディオン キーワード　----*/

dl.keword-ac {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}

dl.keword-ac button {
	font-size: 1.1rem;
	letter-spacing: 0.3em;
	max-width: 500px;
	font-family: var(--f_mincho)
	font-family: var(--f_mincho)
}

dl.keword-ac button .en_font {
	font-size: 0.9rem;
	letter-spacing: 0.13em;
}
	
dl.keword-ac .keword-bg {
	padding: 0.5rem 0.5rem 0.5rem 1.5rem;
	background: url("../img/common/keyword_bg_close.svg") no-repeat;
	background-size: 100% 100%;
	display: inline-block;
	transition: width 0.3s ease;
	position: relative;
	margin-top: -5px;
}
	
dl.keword-ac .keword-bg:first-child {
  margin-top: 0;
}
	
dl.keword-ac .keword-bg.is-open {
	background: url("../img/common/keyword_bg_open.svg") no-repeat;
	background-size: 100% 100%;
	width: 75%;
	display: inline-block;
}
	
@media screen and (max-width:959px){
	dl.keword-ac .keword-bg.is-open {
		width: 90%;
	}
}
	
dl.keword-ac .keword-bg .en_font {
	display: none;
}
	
dl.keword-ac .keword-bg.is-open .en_font  {
	display: inline-block;
}
	
dl.keword-ac .ac-parent.on {
    background: url("../img/common/icon_arrow_01_down.svg") no-repeat;
    background-size: 1.5rem;
    background-position: right 1rem top 1.1rem;
    color: var(--green2);
}



/*リニアナビ*/
.linear{
    text-align: center;
	margin-bottom: 5rem;
}

.linear ol {
    display: flex;
    justify-content:center;
    flex-wrap: wrap;
    align-items: center;
    list-style: none;
    padding: 0;
    margin: 0;
	gap: 0.5rem;
}
.linear ol li.back a,
.linear ol li.next a {
    text-indent: -10000px;
    overflow: hidden;
}
.linear ol li.back a {
    background: url("../img/common/icon_arrow_03.svg") no-repeat 0 0.2rem;
    background-size: 1rem;
    padding: 0 1rem;
}

.linear ol li.back a:hover {
    background: url("../img/common/icon_arrow_03_on.svg") no-repeat 0 0.2rem;
    background-size: 1rem;
}
.linear ol li.next a {
    background: url("../img/common/icon_arrow_03.svg") no-repeat 0 0.4rem;
    background-size: 1rem;
    transform: rotate(180deg);
    padding: 0 1rem 0 2rem;
}
.linear ol li.next a:hover {
    background: url("../img/common/icon_arrow_03_on.svg") no-repeat 0 0.4rem;
    background-size: 1rem;
    transform: rotate(180deg);
/*    transform: scale(1.5);*/
}

.linear ol li a,
.linear ol li span {
    display: block;
    padding: 0 1rem;
    text-decoration: none;
    font-style: italic;
}

.linear ol li:not([class]){
    position: relative;
}

.linear ol li:not([class])::after{
    content: "";
    position: absolute;
    width: 1px;
    height: 10px;
    top: 0.5rem;
    left: 2.8rem;
    background: var(--green1);
}

.linear ol li:not([class]) a:hover {
    transform: scale(1.5);
}


/*ol*/
ol.list {
	margin-left: 1.5rem;
}
ol.list > li {
	padding-bottom: 0.5em;
}
/*ul*/
ul.list li{
	margin-bottom: 1rem;
}
ul.list li a{
	background: url("../img/common/icon_arrow_01_g.svg") no-repeat 0 0.4rem;
	background-size: 1.5rem;
	padding: 0.5rem 1rem 0.5rem 2rem;
}