@charset "shift_jis"; 

/*********************************************************
共通設定
*********************************************************/

/*
見出し
*********************************************************/

h1{}
/*ページタイトル*/
h2{
	text-align:center;
	font-size:1.786em;
	line-height:1.2;
	position:relative;
	margin-bottom:55px;
	}
h2 span{
	display: block;
	font-size:0.56em;
	margin-bottom:10px;
	line-height:1;
	background:var(--color-gradation);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	}
h2::after {
  content: "";
  position: absolute;
  bottom: -25px;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 3px;
	background:var(--color-gradation);
}
/*タイトル*/
h3{
	background:var(--color-primary);
	font-size:1.429em;
	line-height:1.2em;
	padding:15px;
	color:#fff;
	border-radius: 5px;
	margin-bottom:15px;
	}
/*サブタイトル*/
h4{
	display: flex;
	align-items: center;
	margin-bottom:20px;
	font-size:1.286em;
	color:var(--color-primary);
	font-weight:700;
	padding-bottom:15px;
	border-bottom:#ccc solid 1px;
	}
h4 span{
	display:inline-block;
	vertical-align:middle;
	background:var(--color-primary);
	color:#fff;
	padding:10px;
	font-size:0.8em;
	line-height:1;
	margin-right:10px;
	}
h5{
	font-size:1.143em;
	font-weight:700;
	border-left:var(--color-primary) solid 4px;
	padding:5px 10px;
	margin-bottom:20px;
	}
/*PC*/
@media only screen and (min-width : 980px){
h2{
	font-size:1.875em;
	margin-bottom:80px;
	}
h2 span{
	font-size:0.533em;
	margin-bottom:15px;
	}
h2::after {
  bottom: -35px;
	height: 5px;
}
h3{
	font-size:1.563em;
	line-height:1.2em;
	padding:20px;
	margin-bottom:30px;
	}
h4{
	font-size:1.25em;
	}
h4 span{
	font-size:0.75em;
	}
h5{
	font-size:1.125em;
	}
}
/*IE*/
@media all and (-ms-high-contrast:none){
}

/*
コンテンツ
*********************************************************/
.contents{padding:40px 0;}
/*TABLET*/
@media only screen and (min-width : 600px){
	.contents{padding:60px 0;}
}
/*PC*/
@media only screen and (min-width : 980px){
	.contents{padding:80px 0;}
}

/*
装飾
*********************************************************/
.maker{
	display:inline;
  background: linear-gradient(rgba(255,250,127,0) 50%, #fffa7f 0%);
  background-repeat: no-repeat;
  background-size: 100% 0.5em;
  background-position: 0 100%;
}
.maker-gradation{
	display:inline;
  background:var(--color-gradation);
  background-repeat: no-repeat;
  background-size: 100% 0.5em;
  background-position: 0 100%;
}

/*
ボタン
*********************************************************/
.btn a{
	display:block;
	background:var(--color-accent);
	text-align:center;
	font-weight:700;
	color:#fff;
	font-size:1.143em;
	text-decoration:none;
	padding:15px 0;
	border-radius: 3px;
	}
.btn a:hover,
.btn a:active{ background:var(--color-accent-dark); }

/*青*/
.btn.btnBlue a{
	border:#4a9df1 solid 1px;
	background: #4a9df1;
	background:        -webkit-gradient(linear, left top, left bottom, from(#4a9df1), to(#2c74bd));
	background:         linear-gradient(0deg, #4a9df1 0%, #2c74bd 100%);
	background:    -moz-linear-gradient(top, #4a9df1 0%, #2c74bd 100%);
	background:      -o-linear-gradient(top, #4a9df1 0%, #2c74bd 100%);
	background: -webkit-linear-gradient(top, #4a9df1 0%, #2c74bd 100%);
	background:-ms-linear-gradient(top, #4a9df1, #2c74bd); /* IE */
	text-align:center;
	cursor:pointer;
	text-decoration:none;
	}
.btn.btnBlue a:hover,
.btn.btnBlue a:active{
	background:#2c74bd;
	color:#fff;
	box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.3) inset; /*内側*/
	-moz-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.3) inset;
	-o-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.3) inset;
	-webkit-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.3) inset;
	}


/*s*/
.btn_s a{
	display:block;
	line-height:1.1em;
	font-weight:bold;
	text-decoration:none;
	text-align:center;
	margin:2px auto;
	padding:5px 10px;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border:var(--color-primary) solid 1px;
	color:var(--color-primary);
	background:#fff2f2;
	}
.btn_s a:hover,
.btn_s a:active{
	background:var(--color-primary);
	color:#fff;
	}
/*ss*/
td.btn_ssWrap{ width:25%;}
.btn_ss a{
	display:block;
	font-size:0.9em;
	line-height:1;
	font-weight:bold;
	text-decoration:none;
	text-align:center;
	margin:2px auto;
	padding:5px;
	border-radius:30px;
	-moz-border-radius:30px;
	-webkit-border-radius:30px;
	border:#999 solid 1px;
	}
/*PC*/
@media only screen and (min-width : 980px){
.btn a{
	padding:20px 0;
	}
	td.btn_ssWrap{ width:300px;}
	.btn_ss{
		display:inline-block;
		width:80px;
	}
}

/*ボタン*/
.button-float {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 20px;
  width: 100%;
  max-width: 500px;
  min-height: 60px;
  background-color: #fff;
  border: 2px solid var(--color-accent);
  border-radius: 9999px;
  color: var(--color-accent);
  text-decoration: none;
  box-shadow: 0 6px 15px -5px rgba(229, 30, 77, 0.3);
  transition: color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
}
.button-float:hover {
  background-color: var(--color-accent-dark);
  color: #fff;
  border-color: var(--color-accent-dark);
  box-shadow: 0 16px 32px -8px rgba(229, 30, 77, 0.5);
  transform: translateY(-4px);
}
.button-float__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  background-color:var(--color-accent);
  color: #fff;
  border-radius: 50%;
  flex-shrink: 0;
  font-size: 0.714em;
  transition: background-color 0.25s ease, color 0.25s ease, transform 0.25s ease;
}
.button-float:hover .button-float__icon {
  background-color: #fff;
  color: var(--color-accent);
  transform: scale(1.15);
}
.button-float__text {
  flex: 1;
  font-size: 1.143em;
  font-weight: 700;
  line-height: 1.4;
  text-align: left;
}
.button-float__text span {
  display: block;
  font-size: 0.875em;
  transition: color 0.25s ease;
}
@media only screen and (min-width: 980px) {
  .button-float {
    width: auto;
    min-height: 80px;
    gap: 15px;
  }
  .button-float__icon {
    font-size: 0.875em;
    width: 40px;
    height: 40px;
  }
  .button-float__text {
    font-size: 1.125em;
  }
  .button-float__text span {
    font-size: 0.778em;
  }
}

/*
ログインボタン
*********************************************************/

.site-header{
	background-color:#FFF;
	width:100%;
	}
.site-header.fixed{
	/*
	background-color: rgba(255, 255, 255, 0.9);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
	width:100%;
	*/
	}
.utility-nav{
	display:flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	height:70px;
	}
.utility-nav h1{
	}
.utility-nav h1 img{
	max-height: 40px;
	}
.utility-nav__list{
	display:flex;
	align-items: center;
	justify-content: end;
	gap:10px;
	}
.utility-nav__item a{
	text-decoration:none;
	font-weight:700;
	}
.utility-nav__item__switch{
	display:inline-block;
	font-size:0.75em;
	line-height:1.2em;
	}
.utility-nav__item__switch:hover{
	}
.utility-nav__item__switch--group{
	color:var(--color-primary);
	}
.utility-nav__item__login,
.utility-nav__item__logout {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  /*gap: 5px;*/
  width: 100%;
  min-width: 50px;
  height: 50px;
  line-height: 1.2;
  border-radius: 3px;
  text-align: center;
  color: #FFF;
  text-decoration: none;
  box-sizing: border-box;
  font-size: 10px;
  border: 1px solid transparent; /* ホバー時のガタつき防止用 */
  transition: all 0.3s ease;
}
.utility-nav__item__login{
	background: var(--color-accent);
	}
.utility-nav__item__logout{
	background: var(--color-navy);
	}
.utility-nav__item__login--group,
.utility-nav__item__logout--group{
	background: linear-gradient(to bottom, var(--color-blue) 50%, #2666A6 50%);
	}
/* --- ホバー設定 (共通) --- */
.utility-nav__item__login:hover,
.utility-nav__item__logout:hover,
.utility-nav__item__login--group:hover,
.utility-nav__item__logout--group:hover{
	background: #fff;
	border-width:1px;
	border-style:solid;
	}
.utility-nav__item__login:hover {
	border-color: var(--color-accent-dark);
  color: var(--color-accent-dark);
}
.utility-nav__item__logout:hover {
	border-color: var(--color-navy-dark);
  color: var(--color-navy-dark);
}
.utility-nav__item__login--group:hover,
.utility-nav__item__logout--group:hover{
  border-color: var(--color-blue);
  color: var(--color-blue);
	}
/* --- アイコンのベース設定 (共通) --- */
.utility-nav__item__login:before,
.utility-nav__item__logout:before,
.utility-nav__item__login--group:before,
.utility-nav__item__login--group:before {
	display:none;
}
/*TABLET*/
@media only screen and (min-width: 600px) {
}
/*PC*/
@media only screen and (min-width: 980px) {
	.utility-nav{
		height:100px;
		}
	.utility-nav h1{}
	.utility-nav h1 img{
		max-height: 60px;
		}
	.utility-nav__list{
		gap:20px;
		}
	.utility-nav__item__switch{
		font-size:0.875em;
		}
	.utility-nav__item__login,
	.utility-nav__item__logout {
		flex-direction: row;
		gap: 10px;
		min-width: 150px;
		height: 50px;
		font-size:0.875em;
	}
	/* --- アイコンのベース設定 (共通) --- */
	.utility-nav__item__login:before,
	.utility-nav__item__logout:before,
	.utility-nav__item__login--group:before,
	.utility-nav__item__login--group:before {
		display:block;
		font-family: var(--font-icon);
		font-weight: 900;
		font-size: 20px;
		color: #fff;
		transition: color 0.3s ease;
	}
	/* ホバー時にアイコンの色も変える (共通) */
	.utility-nav__item__login:hover:before{
		color: var(--color-accent-dark);
	}
	.utility-nav__item__logout:hover:before {
		color: var(--color-navy-dark);
	}
	.utility-nav__item__login--group:hover:before,
	.utility-nav__item__logout--group:hover:before {
		color: var(--color-blue);
	}
	/* --- アイコンの出し分け (個別のユニコード) --- */
	/* Login用アイコン */
	.utility-nav__item__login:before {
		content: "\f2f6";
	}
	/* Logout用アイコン */
	.utility-nav__item__logout:before {
		content: "\f2f5";
	}
}

/*
ヘッダー（地図から探す）
*********************************************************/
#header{
	padding:5px 0;
	}
#header > *{
	display:flex;
	align-items: center;
	padding-right:55px;
	height:40px;
}
.logo{ margin-right:auto;}
.logo img{ max-height:40px;}
.h-produced{
	display:none;
	 margin-left:auto;
	 }
.h-produced img{ max-height:30px;}


@media only screen and (min-width: 980px){
	#header{padding:15px 0;}
	#header > *{
		padding-right:0;
		height:auto;
		align-items: flex-end;
		}
	.h-produced{ display:block;}
}

/*
フッター
*********************************************************/
.footer{
	background-color:#f7f7f7;
	}
.footer-box{
	background-color:#fff;
	padding:20px;
	border-radius: 10px;
	}
.footer-ttl{
	border-left:4px solid #e71b4e;
	padding-left:20px;
	font-size:1.429em;
	line-height:1.2;
	font-weight:700;
	color:#e71b4e;
	margin-bottom:20px;
	}
.footer-office{
	margin-top:10px;
	}
.footer-office dt{
	font-size:1.071em;
	font-weight:700;
	}
.footer-office dd{
	font-size:1em;
	line-height:1.4;
	}
.copyright{
	background:#333;
	padding:10px 10px;
	font-size:1em;
	line-height:1;
	color:#ffffff;
	text-align:center;
	}
	
/*TABLET*/
@media only screen and (min-width : 600px){
}
/*PC*/
@media only screen and (min-width : 980px){
.footer-box{
	padding:40px;
	}
.footer-ttl{
	border-left:4px solid #e71b4e;
	padding-left:20px;
	font-size:1.375em;
	margin-bottom:20px;
	}
.footer-office{
	margin-top:10px;
	}
.footer-office dt{
	font-size:1em;
	}
.footer-office dd{
	font-size:0.938em;
	}
.copyright{
	padding:20px 10px;
	font-size:0.875em;
	}
}

/*
メインイメージ
*********************************************************/
.mainImg{
	background-image:url(../images/mainBg2026.jpg);
	background-position:center top;
	background-repeat:no-repeat;
	background-size:cover;
	}
.mainImg img{
	margin-left:auto;
	margin-right:auto;
	max-height:500px;
	}

/*
ページタイトル
*********************************************************/
.pagetitle{
	background:var(--color-gradation);
	}
.pagetitle .inner{
	padding:50px 0;
	}
.pagetitle h2{
	position:static;
	margin-bottom:0;
	color:#fff;
	}
.pagetitle h2::after {
	display:none;
	}
/*TABLET*/
@media only screen and (min-width : 600px){
}
/*PC*/
@media only screen and (min-width : 980px){
.pagetitle p{
	font-size:1.875em;
	}
}
	
/*
トップページ
*********************************************************/

/*Sakai Volunteer Actionとは*/
.about-grid{
	display:flex;
	flex-direction: column;
	justify-content:space-between;
	}
.about-grid__tmb{
	width:100%;
	display:none;
	}
.about-grid__tmb img{
	margin-left:auto;
	margin-right:auto;
	}
.about-grid__cont{
	width:100%;
	margin-top:30px;
	}
.about-grid__ttl{
	font-size:1.563em;
	font-weight:700;
	line-height:1.4;
	margin-bottom:10px;
	}
.about-grid__txt{
	margin-top:10px;
	line-height:1.6;
	}
	
/*参加対象*/
.about-target{
	margin-top:20px;
	background-color:#f7f7f7;
	border-radius: 5px;
	padding:15px;
	}
.about-target__ttl{
	font-size:1.143em;
	color:#e71b4e;
	font-weight:700;
	}
.about-target__txt{
	font-weight:600;
	margin-top:5px;
	}
.about-target ul{
	margin-top:5px;
	}
.about-target ul li{
	line-height:1.4;
	font-size:0.875em;
	color:#666;
	}
	
/*こんな人におすすめ！*/
.osusume-grid{
	}
.osusume-card{
	border:1px solid #eee;
	}
.osusume-card__ttl{
	font-size:1.071em;
	text-align:center;
	padding:10px 10px;
	font-weight:bold;
	}
	
/*インスタグラム*/
.insta-wrap{
	background-color:#FFF9E5;
	padding:20px 0;
	}
	.insta-wrap img{
		margin-left:auto;
		margin-right:auto;
		filter: drop-shadow(0 10px 15px rgba(0, 0, 0, 0.1));
		}

/*参加・申込方法*/
.flow-wrap{
	background-color:#fdedf1;
	}
	
/* 親要素：画像のサイズに依存させる */
.p-flow-map {
  position: relative;
}
.p-flow-map__link {
  position: absolute;
  width: 50%;
  height: 3%; 
	box-sizing: border-box;
	text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
	border: 2px solid rgba(245,130,32,1);    /* 青い実線 */
	background-color: rgba(245,130,32,0.1); /* ほんのり青い背景 */
	border-radius: 4px; /* 少し角を丸くするとボタンらしく見えます */
	animation: p-blink 1.5s ease-in-out infinite;
}
.p-flow-map__link--a{
  left: 25%;
  top: 60.7%;
	}
.p-flow-map__link--b{
  left: 24.1%;
  top: 62.3%;
	}
.p-flow-map__link:hover,
.p-flow-map__link:active {
	animation-play-state: paused;
	background-color: rgba(245,130,32,0.3);
}
@keyframes p-blink {
  0% {
    /* 開始：枠線を不透明に */
    border-color: rgba(245,130,32,1);
    background-color: rgba(245,130,32,0.1);
  }
  50% {
    /* 中間：枠線を透明にし、背景も薄くする */
    border-color: rgba(245,130,32,0);
    background-color: rgba(245,130,32,0);
  }
  100% {
    /* 終了：開始と同じに戻す */
    border-color: rgba(245,130,32,1);
    background-color: rgba(245,130,32,0.1);
  }
}


/*参加者説明会の開催開催日時・申し込み方法について*/
.schedule-container {
	margin-top:20px;
  background-color: #fff;
  border-radius: 10px;
  padding: 0 15px;
}
.schedule-list {
}
.schedule-item {
  display: flex;
  align-items: center;
	flex-direction: column;
  padding: 15px 0;
  border-bottom: 1px dotted #ccc;
	gap:5px;
}
.schedule-item:last-child {
  border-bottom: none;
}
.day-badge {
  background: linear-gradient(to right, #ffd452, #f08e5a);
  color: #fff;
  font-weight: 700;
  padding: 10px 20px;
  border-radius: 20px;
  font-size: 0.857em;
	line-height: 1;
  min-width: 60px;
  text-align: center;
}
.date {
  font-weight: 700;
  font-size: 1.143em;
  /*min-width: 120px;*/
}
.location {
  font-weight: 700;
  font-size: 1.143em;
  flex: 1;
}

/*プログラム提案団体募集*/
.provider-head {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25em;
  margin-bottom: 30px;
  padding: 0 2.5em;
  font-size: 1.429em;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}
.provider-head::before,
.provider-head::after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 2px;
  height: 2em;
  background: #ff3b6b;
}
.provider-head::before {
  left: 0.6em;
  transform: rotate(-25deg);
}
.provider-head::after {
  right: 0.6em;
  transform: rotate(25deg);
}
.provider-head > span:last-child {
  position: relative;
  z-index: 1;
  display: inline-block;
  width: fit-content;
}
.provider-head span span{
  font-size: 0.75em;
}

/*TABLET*/
@media only screen and (min-width : 600px){
}
/*PC*/
@media only screen and (min-width : 980px){
	
/*Sakai Volunteer Actionとは*/
.about-grid{
	display:flex;
	flex-direction:row-reverse;
	justify-content:space-between;
	}
.about-grid__tmb{
	display:block;
	width:35%;
	}
.about-grid__cont{
	width:60%;
	margin-top:0;
	}
.about-grid__ttl{
	margin-bottom:20px;
	}
.about-grid__txt{
	margin-top:10px;
	}

/*参加対象*/
.about-target{
	margin-top:20px;
	padding:15px;
	}

/*こんな人におすすめ！*/
.osusume-card__ttl{
	font-size:0.938em;
	padding:20px 10px;
	}

/*インスタグラム*/
.insta-wrap{
	padding:40px 0;
	}

/*参加者説明会の開催開催日時・申し込み方法について*/
.schedule-container {
	margin-top:30px;
  padding: 0 20px;
}
.schedule-item {
  padding: 20px 0;
	flex-direction: row;
	gap:20px;
}
.day-badge {
  border-radius: 20px;
  font-size: 1em;
  min-width: 60px;
}
.date {
  font-size: 1.125em;
}
.location {
  font-size: 1.125em;
}

/*プログラム提案団体募集*/
.provider-head {
	font-size: 1.563em;
	margin-bottom: 40px;
}
.provider-head::before,
.provider-head::after {
}
.provider-head::before {
	left: 1em;
}
.provider-head::after {
	right: 1em;
}
.provider-head span span{
  font-size: 0.8em;
}
}


/*
プログラム提案など
*********************************************************/
.program-step {
  max-width: 800px;
  margin: 0 auto;
}
.program-step__item {
  position: relative;
  padding-bottom: 32px;
}
/* 縦線 */
.program-step__item:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 50px;
  top: 100%;
  margin-top: -32px;
  height: 32px;
  width: 12px;
  background-color: #2b2e63;
  z-index: 1;
}
.program-step__content {
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 15px;
  background-color: #fff;
  border: 4px solid var(--color-blue);
}
/* 数字円 */
.program-step__number {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-blue);
  color: #fff;
  font-weight: bold;
  font-size: 1.5em;
  border-radius: 50%;
}
/* 背景色の出し分け */
.program-step__item:nth-child(2) .program-step__content {
  background-color: #F0F6FA;
}
.program-step__item:nth-child(3) .program-step__content {
  background-color: #D1E3F0;
}
.program-step__title {
  font-size: 1.286em;
  font-weight: bold;
  margin-bottom: 5px;
}
.program-step__text {
  font-size: 1.071em;
  margin: 0;
}
/* PC対応 */
@media screen and (min-width: 980px) {
  .program-step__content {
    padding: 20px;
    gap: 20px;
  }
	.program-step__number {
		width: 50px;
		height: 50px;
	}
	.program-step__title {
		font-size: 1.25em;
	}
	.program-step__text {
		font-size: 0.938em;
	}
}

/*
プログラム申し込み期間について
*********************************************************/
.entry-schedule {
}
.entry-schedule__banner {
	border-radius: 14px;
	overflow: hidden;
	background: var(--color-background-primary);
	border: 2px solid var(--color-navy);
	max-width: 100%;
	background-color: #fff;
}
.entry-schedule__bar {
	height: 7px;
	background: var(--color-gradation);
}
.entry-schedule__inner {
	padding: 30px 20px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.entry-schedule__tag {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 0.8125em;
	font-weight: 700;
	color: #fff;
	background: var(--color-primary);
	border-radius: 4px;
	padding: 5px 14px;
	align-self: flex-start;
}
.entry-schedule__tag-dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #fff;
	animation: entry-schedule-pulse 1.8s ease-in-out infinite;
}
@keyframes entry-schedule-pulse {
	0%,100%{opacity:1;transform:scale(1)}
	50%{opacity:0.4;transform:scale(0.7)}
}
.entry-schedule__title {
	font-size: 1.786em;
	font-weight: 700;
	line-height: 1.2;
}
.entry-schedule__divider {
	height: 2px;
	background: var(--color-gradation);
	border-radius: 2px;
}
.entry-schedule__rows {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.entry-schedule__row {
	display: flex;
	flex-direction: column;
	gap: 5px;
}
.entry-schedule__label {
	font-size: 1.143em;
	font-weight: 700;
	color: var(--color-blue);
}
.entry-schedule__date {
	font-size: 1.786em;
	font-weight: 700;
	color: var(--color-primary);
	line-height: 1.3;
}
.entry-schedule__date span {
	display: inline-block;
	color: var(--color-primary);
}
.entry-schedule__value {
	font-size: 1.0625em;
	color: var(--color-navy);
	font-weight: 500;
	line-height: 1.65;
}
.entry-schedule__note {
	font-size: 0.8125em;
	color: var(--color-text-secondary);
	padding-left: 14px;
	border-left: 3px solid var(--color-accent);
	line-height: 1.75;
}

@media only screen and (min-width: 980px) {
	.entry-schedule__inner {
		padding: 40px;
		gap: 20px;
	}
	.entry-schedule__rows {
		flex-direction: row;
		gap: 20px;
	}
	.entry-schedule__row {
		flex: 1;
		/*padding: 0 28px 0 0;*/
		gap: 10px;
	}
	.entry-schedule__row + .entry-schedule__row {
		/*padding: 0 0 0 28px;*/
		border-left: 2px solid var(--color-border-tertiary);
	}
	.entry-schedule__label { font-size: 1em; }
	.entry-schedule__title { font-size: 1.875em; }
	.entry-schedule__date { font-size: 1.875em; }
	.entry-schedule__note { font-size: 0.938em; }
  }
	
/*
個人情報の取り扱いについて
*********************************************************/
.consent-box {
  background: #fff;
  border: 1px solid #ddd;
  padding: 0;
  margin: 30px 0;
}
.consent-box__title {
  font-size: 1.143em;
  font-weight: 700;
  text-align: center;
  color: #fff;
  background-color: var(--color-blue);
  padding: 15px;
}
.consent-box__content {
  padding: 15px;
}
.consent-box__label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  cursor: pointer;
}
.consent-box__label:hover {
  color: var(--color-accent);
}
.consent-box__checkbox {
  width: 20px !important;
  height: 20px !important;
  flex-shrink: 0;
	accent-color: var(--color-accent);
}
.consent-box__text {
  font-size: 1.143em;
  line-height: 1.4;
  font-weight: 700;
}
.consent-box__note {
  font-size: 0.938em;
  color: #666;
  text-align: center;
	margin-top: 5px;
}
.consent-box__submit {
  display: flex;
  justify-content: center;
  margin-top: 15px;
}
.consent-box__submit button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px 20px;
  background-color: var(--color-primary);
  color: #fff;
  font-size: 1.143em;
  font-weight: 700;
  border: none;
  border-radius: 9999px;
  cursor: pointer;
  transition: background-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
  box-shadow: 0 4px 12px rgba(229, 30, 77, 0.3);
}
.consent-box__submit button:hover {
  background-color: var(--color-primary-dark);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(229, 30, 77, 0.4);
}
.consent-box__submit button:active {
  transform: translateY(0);
  box-shadow: 0 4px 12px rgba(229, 30, 77, 0.3);
}

/* PC対応 */
@media screen and (min-width: 980px) {
  .consent-box {
    margin: 40px 0;
  }
  .consent-box__title {
    font-size: 1.125em;
    padding: 15px 20px;
  }
  .consent-box__content {
    padding: 20px;
  }
  .consent-box__text {
    font-size: 1em;
  }
  .consent-box__note {
    font-size: 0.875em;
  }
	.consent-box__submit {
		margin-top: 20px;
	}
  .consent-box__submit button {
    font-size: 1em;
    padding: 10px 20px;
  }
}

/********************************************************
受入index
*/

.indexWrap{}
.indexWrapL{ float:left; width:36%;}
.indexWrapL img{ margin:auto;}
.indexWrapR{float:right; width:60%;}
.indexWrap dt{
	font-weight:bold;
	color:var(--color-primary);
	font-size:1.2em;
	line-height:1.4em;
	}
.indexWrap dd{ clear:both;}

@media only screen and (min-width : 600px){
	.indexWrap dd{clear:inherit;}
}


/********************************************************
参加index
*/
.topLead {
	background: #feecdb url(../images/top_leadBg.gif) right top no-repeat;
	padding:20px;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	}
.topLead dt{
	font-size:1.36em;
	font-weight:bold;
	color:var(--color-blue);
	text-shadow: 1px 1px 3px rgba(255,255,255,1),-1px 1px 3px rgba(255,255,255,1),1px -1px 3px rgba(255,255,255,1), -1px -1px 3px rgba(255,255,255,1);
	margin-bottom:10px;
	padding-bottom:5px;
	border-bottom:var(--color-blue) solid 2px;
	}
.topLead dd{
	/*横・下・ぼかし・色*/
	text-shadow: 1px 1px 1px #ffffff;
	}

.topDate{}
.topDate img{ margin:auto;}
.topDateL{ margin-bottom:20px;}

.topDateR{
	padding:20px;
	}

@media only screen and (min-width : 980px){
	.topLead {padding:40px}
	.topLead dt{font-size:1.5em; padding-bottom:10px; margin-bottom:20px;}
	.topDateL{
		float:left;
		width:500px;
		margin-bottom:0;
		}
	.topDateR{
		float:right;
		width:420px;
		border:#006d3a solid 1px;
		border-radius:20px;
		-moz-border-radius:20px;
		-webkit-border-radius:20px;
		padding:30px 20px;
		}


}

/*********************************************************
体験レポート
*/
.subMenu{
	display:flex;
	align-items: stretch;
	justify-content:space-between;
	}
.subMenu > *{
	flex-shrink: 0;
	}
.subMenu a{
	position:relative;
	display:block;
	height:100%;
	text-align:center;
	text-decoration:none;
	font-size:0.9em;
	line-height:1.2em;
	font-weight:500;
	padding:10px;
	cursor:pointer;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-webkit-appearance: none;/*iphoneのデフォルトボタン打消*/
	border:#aaaaaa solid 1px;
	background:-webkit-gradient(
	linear, left top, left bottom, 
	from(#f7f7f7),
	to(#eeeeee));
	background:-webkit-linear-gradient(top, #f7f7f7 0% , #eeeeee 100%);
	background:-moz-linear-gradient   (top, #f7f7f7 0% , #eeeeee 100%);
	background:-o-linear-gradient     (top, #f7f7f7 0% , #eeeeee 100%);
	background:-ms-linear-gradient(top, #f7f7f7 #eeeeee); /* IE */
	background:linear-gradient        (top, #f7f7f7 0% , #eeeeee 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(
	GradientType=0,startColorstr='#FFf7f7f7', endColorstr='#FFeeeeee');/*IE10用（色の頭にFFが必要）*/

}


.result1 .borderBox{
	border-color:#ccc;
	padding:20px !important;
	}

.result1 h4{}
.result1 h5{ border:none; padding:10px; background-color:#ffe9da;}



/*********************************************************
一覧
*/

/* --- ページナビ --- */
.pagerWrap {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 5px;
	margin-bottom: 20px;
	font-family: sans-serif;
}
.pagerWrap span {
	font-size: 1em;/*14*/
}
.pagerWrap p {
	margin: 0;
	padding: 0;
}
.pagerWrap a, .pagerWrap p {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 40px;
	border-radius: 4px;
	font-size: 1em;/*14*/
	font-weight: bold;
	text-decoration: none;
	box-sizing: border-box;
	transition: all 0.3s ease;
}
.pagerWrap a {
	color: #333;
	background-color: #fff;
	border: 1px solid #ddd;
}
.pagerWrap a:hover {
	background-color: #f0f0f0;
	border-color: #bbb;
}
.pagerWrap p {
	background-color: var(--color-primary);
	color: #fff;
}
.pagerWrap p:has(a) {
	background: none;
	width: auto;
	height: auto;
}
.pagerWrap p a {
	width: 40px;
	height: 40px;
}
/*TABLET*/
@media only screen and (min-width : 600px){
}
/*PC*/
@media only screen and (min-width : 980px){
.pagerWrap span {
	font-size: 0.875em;/*16*/
}
.pagerWrap a,
.pagerWrap p {
	font-size: 0.875em;/*16*/
}
}
/*IE*/
@media all and (-ms-high-contrast:none){
}

/* --- 検索件数 --- */
.resultWrap{
	display:flex;
	align-items: center;
	justify-content: space-between;
	}

/* --- ボランティア一覧 --- */
/* カラム設定 */
.vol-list-column {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.vol-list-column > div {
	width: calc(50% - 5px);  /* gap分を引く */
	margin: 0;               /* margin-rightは不要に */
}

/* TABLET */
@media only screen and (min-width: 600px) {
.vol-list-column > div {
	width: calc(33.333% - 7px);  /* 3カラム */
}
}

.vol-card {
	border: 1px solid #eee;
	display: flex;
	flex-direction: column;
}
.vol-card__img-box {
	display: block;
	width: 100%;
	overflow: hidden;
	background-color: #f7f7f7;
	aspect-ratio: 4 / 3;
	position: relative;
}
.vol-card__img {
	width: 100%;
	height: 100%;
	-o-object-fit: contain;
	object-fit: contain;
	-o-object-position: center;
	object-position: center;
}
.vol-card__cate{
	position:absolute;
	top:0;
	right:0;
	background-color: var(--color-blue);
	color:#fff;
	padding:0.5em 1em;
	font-size:0.875em;
	line-height:1;
	z-index: 2;
	}
.vol-card__body {
	padding: 10px;
display: flex;
    flex-direction: column;
    flex: 1;
}
.vol-card__mh{
	flex: 1;
	}
.vol-card__badge--closed {
	color: var(--color-primary);
	font-size: 1em;/*14*/
}
.vol-card__title {
	font-weight: bold;
	font-size: 1.286em;
	/*18*/
	line-height: 1.5em;
	border-bottom: 1px solid #ddd;
	padding-bottom: 5px;
	margin-bottom: 10px;
}
.vol-card__tags {
	display: flex;
	align-content: flex-start;
	flex-wrap: wrap;
	gap: 2px;
	margin-bottom: 5px;
}
.vol-card__tag {
	display: inline-block;
	min-width: 60px;
	text-align: center;
	border: var(--color-primary) solid 1px;
	border-radius: 3px;
	font-size: 0.857em;/*12*/
	line-height: 1;
	padding: 0.5em 0.5em;
	color: var(--color-primary);
	font-weight: bold;
}
.vol-card__tag--highlight {
	background-color: var(--color-primary);
	color: #fff !important;
}
.vol-card__meta {
	font-size: 1.071em;/*15*/
}
.vol-card__meta-label {
	font-weight: bold;
}
.vol-card__desc {
	padding-top: 5px;
	margin-top: 5px;
	border-top: #ddd dashed 1px;
	font-size: 1.071em;
	/*15*/
	line-height: 1.5em;
}
.vol-card__actions {
	margin-top: auto;
	padding-top: 10px;
}
.vol-card__action-item {
	margin-bottom: 5px;
}
.vol-card__action-item:last-child {
	margin-bottom: 0;
}
.vol-card__btn {
	display: block;
	padding: 10px;
	border-radius: 3px;
	text-align: center;
	font-size: 1.071em;
	/*15*/
	font-weight: bold;
	text-decoration: none;
}
.vol-card__btn--detail {
	color: #FFF;
	background-color: var(--color-primary);
	border: 1px solid var(--color-primary);
}
.vol-card__btn--detail:hover {
	color: var(--color-primary);
	border: 1px solid var(--color-primary);
	background-color: #fff;
}
.vol-card__btn--chat {
	color: #fff;
	background-color: var(--color-accent);
	border: 1px solid var(--color-accent);
}
.vol-card__btn--chat:hover {
	color: var(--color-accent);
	border: 1px solid var(--color-accent);
	background-color: #fff;
}
/*TABLET*/
@media only screen and (min-width : 600px){
}
/*PC*/
@media only screen and (min-width : 980px){
	.vol-card__body {
		padding: 20px;
	}
	.vol-card__badge--closed {
		font-size: 0.875em;
		/*14*/
	}
	.vol-card__title {
		font-size: 1.125em;
		/*18*/
		padding-bottom: 10px;
		margin-bottom: 20px;
	}
	.vol-card__tags {
		margin-bottom: 10px;
	}
	.vol-card__tag {
		font-size: 0.75em;
		/*12*/
		padding: 0.5em 0.5em;
	}
	.vol-card__meta {
		font-size: 0.938em;
		/*15*/
	}
	.vol-card__desc {
		padding-top: 10px;
		margin-top: 10px;
		font-size: 0.938em;
		/*15*/
	}
	.vol-card__actions {
		margin-top: auto;
		padding-top: 20px;
	}
	.vol-card__action-item {
		margin-bottom: 10px;
	}
	.vol-card__btn {
		font-size: 0.938em;
		/*15*/
		padding: 10px;
	}
}

/*********************************************************
マイページ
*/

/* --- 共通 --- */
.mypage-nav{
	display: flex;
	flex-wrap: wrap; /* 折り返しを有効化 */
	justify-content: space-between; /* または flex-start */
	gap: 10px;
	}
	.mypage-nav__item{
		width: calc((100% - 10px) / 2);
		}
		.mypage-nav__link{
			display:block;
			background-color:#FDEDF1;
			color:#111;
			border-radius: 3px;
			text-align:center;
			padding:1em;
			font-weight:700;
			text-decoration:none;
			}
			.mypage-nav__link.active{
				background-color:var(--color-primary);
				color:#fff;
				}
			.mypage-nav__link:hover{
				background-color:var(--color-primary-dark);
				color:#fff;
				}
/*.mypage-nav--group .mypage-nav__link{
	background-color:#DEEBF7;
	}
	.mypage-nav--group .mypage-nav__link.active{
		background-color:var(--color-blue);
		}
	.mypage-nav--group .mypage-nav__link:hover{
		background-color:var(--color-blue);
		}*/

/*TABLET*/
@media only screen and (min-width : 600px){
}
/*PC*/
@media only screen and (min-width : 980px){
.mypage-nav__item {
	width: calc((100% - 30px) / 4);
  }
}
/*IE*/
@media all and (-ms-high-contrast:none){
}

/* --- 申込済み体験一覧 --- */

/* --- チャット履歴 --- */

/* 事務局からのお知らせ */
/*一覧*/
.news-section {
	background-color: #fff;
	border: 1px solid #eee;
	border-radius: 0.5em;
	overflow: hidden;
	margin-bottom: 2em;
}
.news-section__header {
	background-color: #f9fafb;
	padding: 1em;
	font-weight: bold;
	color: #333;
	border-bottom: 1px solid #eee;
	font-size: 1.14em; /* 16 */
	display: flex;
	align-items: center;
	text-align:left;
	margin-bottom:0;
	position: static;
}
.news-section__header::before {
	content: "";
	display: inline-block;
	width: 0.3em;
	height: 1em;
	background-color: var(--color-blue);
	margin-right: 0.5em;
	border-radius: 2px;
}
.news-list {
	display: flex;
	flex-direction: column;
}
.news-list-scroll{
	overflow-y:scroll;
	height:150px;
	}
.news-list__item {
	display: flex;
	align-items: flex-start; /* スマホ: 文字が折り返した時に上揃え */
	flex-wrap: wrap; /* スマホ: 折り返し許可 */
	padding: 1em;
	border-bottom: 1px solid #eee;
	gap: 0.5em;
	background-color: #fff;
	transition: background-color 0.2s;
}
.news-list__item:last-child {
	border-bottom: none;
}
.news-list__item:hover {
	background-color: #f0f8ff;
}
.news-list__date {
	font-size: 1em; /* 14px */
	color: #666;
}
.news-list__category {
	font-size: 0.857em; /* 12px */
	color:  var(--color-blue);
	border: 1px solid var(--color-blue);
	padding: 0.1em 0.5em;
	border-radius: 9999px;
	white-space: nowrap;
	width:100px;
	text-align:center;
}
.news-list__title {
	width: 100%;
	font-size: 1.071em; /* 15px */
	color: #333;
	text-decoration: none;
	line-height: 1.5;
}
.news-list__title:hover {
	text-decoration: underline;
	color: var(--color-blue);
}
/*PC*/
@media only screen and (min-width: 980px) {
	.news-section__header {
		font-size: 1em; /* 16 */
	}
	.news-list__item {
		align-items: center;
		flex-wrap: nowrap;
	}
	.news-list__date {
		font-size: 0.875em; /* 14px */
	}
	.news-list__category {
		font-size: 0.75em; /* 12px */
	}
	.news-list__title {
		width: auto;
		flex: 1;
		margin-top: 0;
		font-size: 0.938em; /* 15 */
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		min-width: 0;
	}
}
/*詳細*/
.news-detail {
	background-color: #fff;
	border: 1px solid #eee;
	border-radius: 0.5em;
	overflow: hidden;
	margin-bottom: 2em;
}
.news-detail__header {
	padding: 1.5em 1em; /* 21px 14px */
	border-bottom: 1px dashed #ddd;
}
.news-detail__meta {
	display: flex;
	align-items: center;
	gap: 0.8em;
	margin-bottom: 0.8em;
}
.news-detail__date {
	color: #666;
	font-family: monospace;
	font-size: 1em; /* 14px */
}
.news-detail__category {
	font-size: 0.857em; /* 12px */
	color: var(--color-blue);
	border: 1px solid var(--color-blue);
	padding: 0.2em 0.8em;
	border-radius: 9999px;
	white-space: nowrap;
	background-color: #fff;
}
.news-detail__title {
	font-size: 1.286em; /* 18px */
	font-weight: bold;
	line-height: 1.5;
	color: #333;
}
.news-detail__body {
	padding: 2em 1em; /* 28px 14px */
	line-height: 1.8;
	color: #333;
	font-size: 1em;
}
.news-detail__body p {
	margin-bottom: 1.5em;
}
.news-detail__body h2 {
	font-size: 1.14em; /* 16px */
	font-weight: bold;
	background-color: #f0f8ff; /* 薄い青背景 */
	padding: 0.8em;
	border-left: 5px solid var(--color-blue); /* 青いアクセント */
	margin-top: 2em;
	margin-bottom: 1em;
}
.news-detail__body h3 {
	font-size: 1.07em; /* 15px */
	font-weight: bold;
	border-bottom: 2px solid var(--color-blue);
	padding-bottom: 0.5em;
	margin-top: 2em;
	margin-bottom: 1em;
}
.news-detail__body ul,
.news-detail__body ol {
	margin-bottom: 1.5em;
	padding-left: 1.5em;
	background-color: #f9fafb;
	padding: 1em 1em 1em 2em; /* 枠で囲むスタイル */
	border-radius: 4px;
}
.news-detail__body li {
	list-style-type: disc;
	margin-bottom: 0.5em;
}
.news-detail__body li:last-child {
	margin-bottom: 0;
}
.news-detail__body a {
	color: var(--color-blue);
	text-decoration: underline;
}
.news-detail__body img {
	max-width: 100%;
	height: auto;
	border: 1px solid #eee;
	margin: 1em 0;
}
.news-detail__footer {
	padding: 1em 1em 2em;
	text-align: center;
	border-top: 1px solid #eee;
}
.news-detail__back-btn {
	display: inline-block;
	min-width: 200px;
	padding: 1em;
	background-color: #9ca3af; /* グレー */
	color: #fff;
	text-decoration: none;
	border-radius: 9999px;
	font-weight: bold;
	transition: background-color 0.3s;
	font-size: 1em;
}
.news-detail__back-btn:hover {
	background-color: #6b7280; /* 濃いグレー */
}
@media only screen and (min-width: 980px) {
	.news-detail__header {
		padding: 2em 2em;
	}
	.news-detail__date {
		font-size: 0.875em; /* 14px */
	}
	.news-detail__category {
		font-size: 0.75em; /* 12px */
	}
	.news-detail__title {
		font-size: 1.125em; /* 20px */
		margin-top: 0.5em;
	}
	.news-detail__body {
		padding: 3em;
	}
	.news-detail__body h2 {
		font-size: 1.28em; /* 18px */
	}
	.news-detail__back-btn {
		opacity: 1;
	}
	.news-detail__back-btn:hover {
		opacity: 0.8;
	}
}

/* チャット一覧 */
.chat-wrap{
	}
.chat-wrap .resultWrap select{
	width:auto;
	padding: 5px;
	font-size:1em;/*14*/
	}
	
.chat-list {
	border-top: 1px solid #dddddd;
}
.chat-list__item {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	padding: 15px 20px;
	border-bottom: 1px solid #dddddd;
	background-color: #fff;
	position: relative;
}
.chat-list__item:nth-child(even) {
	background-color: #f7f7f7;
}
.chat-list__bell {
	display: -ms-grid;
	display: grid;
	place-items: center;
	position: absolute;
	top: 50%;
	right: 20px;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: #ee006a;
	color: #fff;
	font-size: 10px;
	line-height: 1;
	z-index: 1;
}
.chat-list__bell::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background-color: inherit;
	z-index: -1;
	-webkit-animation: pulse-ring-scale 1.8s ease-out infinite;
	animation: pulse-ring-scale 1.8s ease-out infinite;
}
@-webkit-keyframes pulse-ring-scale {
	0% {
		-webkit-transform: translate(-50%, -50%) scale(1);
		transform: translate(-50%, -50%) scale(1);
		opacity: 0.6;
	}
	100% {
		-webkit-transform: translate(-50%, -50%) scale(2);
		transform: translate(-50%, -50%) scale(2);
		opacity: 0;
	}
}
@keyframes pulse-ring-scale {
	0% {
		-webkit-transform: translate(-50%, -50%) scale(1);
		transform: translate(-50%, -50%) scale(1);
		opacity: 0.6;
	}
	100% {
		-webkit-transform: translate(-50%, -50%) scale(2);
		transform: translate(-50%, -50%) scale(2);
		opacity: 0;
	}
}
.chat-list__date {
	margin-right: 10px;
	flex-shrink: 0;
}
.chat-list__category {
	width: 100%;
	max-width: 200px;
	display: inline-block;
	border: 1px solid var(--color-primary);
	color: var(--color-primary);
	padding: 5px 10px;
	margin-right: 0;
	background-color: #fff;
	white-space: nowrap;
	line-height: 1.2;
	border-radius: 3px;
	font-weight: bold;
	text-align: center;
	overflow: hidden;
	text-overflow: ellipsis;
	vertical-align: middle;
	box-sizing: border-box;
}
.chat-list__title {
	color: #111;
	text-decoration: none;
	font-weight: bold;
	flex-grow: 1;
	width: 100%;
	display: block;
	margin-top: 5px;
	text-decoration: none;
}
.chat-list__title:hover {
	text-decoration: underline;
	opacity: 0.8;
}
/*TABLET*/
@media only screen and (min-width: 600px) {
	.chat-list {
		flex-wrap: wrap;
	}
	.chat-list__title {
		width: auto;
		margin-top: 0;
	}
	.chat-list__date {
		margin-right: 20px;
	}
	.chat-list__category {
		margin-right: 20px;
	}
}
/*PC*/
@media only screen and (min-width: 980px) {
	.chat-wrap .resultWrap select{
		font-size: 0.938em;
		/*15*/
		}
	.chat-list-wrap .resultWrap select {
		font-size: 0.938em;
		/*15*/
	}
	.chat-list__category {
		font-size: 0.875em;
		/*14*/
	}
	.chat-list__title {
		font-size: 0.938em;
		/*15*/
	}
}
/*IE*/
@media all and (-ms-high-contrast:none) {}

/* チャット詳細 */
.chat-screen {
	display: flex;
	flex-direction: column;
	/*height: 100vh;*/
	background-color: #fff;
	position: relative;
	overflow: hidden;
}
.chat-header {
	border-radius: 10px 10px 0 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background-color: var(--color-blue);
	color: #fff;
	padding: 1em;
	/* 14px */
	z-index: 20;
	flex-shrink: 0;
}
.chat-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: var(--color-blue);
  color: #fff;
  padding: 20px;
  z-index: 20;
  flex-shrink: 0;
}
.chat-header__profile {
  display: flex;
  align-items: center;
  gap: 0.8em;
  flex: 1;
  min-width: 0;
}
.chat-header__avatar {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
	border-radius: 9999px;
  background-color: rgba(255, 255, 255, 0.2);
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}
.chat-header__avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.chat-header__meta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  line-height: 1.2;
  overflow: hidden;
}
.chat-header__label {
  font-size: 0.714em; /* 10px */
  opacity: 0.8;
  display: block;
  margin-bottom: 0.2em;
}
.chat-header__org-name {
  font-size: 1em; /* 14px */
  font-weight: bold;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.chat-header__back {
  font-size: 0.857em; /* 12px */
  color: #fff;
  text-decoration: none;
  background-color: rgba(0, 0, 0, 0.1);
  padding: 0.5em 0.8em;
  border-radius: 0.3em;
  margin-left: 1em;
  white-space: nowrap;
  transition: background-color 0.2s;
}
.chat-header__back:hover {
  background-color: rgba(0, 0, 0, 0.2);
}
.chat-body {
	/* flex: 1;  <-- これは削除するか、以下のように打ち消す */
	flex: none; /* 自動伸縮をオフにする */
	max-height: 500px;		
	overflow-y: auto;
	padding: 20px;
	/*padding-bottom: 9em;*/
	/* フッター＋余白分 (約126px) */
	background-color: #f7f7f7;
}
.chat-body__inner {
	display: flex;
	flex-direction: column;
	gap: 1.5em;
}
.chat-body__date-label {
	display: flex;
	justify-content: center;
	margin: 1em 0;
}
.chat-body__date-label span {
	background-color: rgba(0, 0, 0, 0.3);
	color: #fff;
	font-size: 0.714em;
	/* 10px / 14px */
	padding: 0.3em 0.8em;
	border-radius: 9999px;
}
/*.chat-body__spacer {
	height: 5em;
}*/
/* Block: .chat-msg */

.chat-msg {
	display: flex;
	width: 100%;
	gap: 0.5em;
}
/* Modifier: Partner (Left) */

.chat-msg--partner {
	align-items: flex-start;
}
/* Modifier: Me (Right) */

.chat-msg--me {
	justify-content: flex-end;
	align-items: flex-end;
}
/* Elements */

.chat-msg__avatar {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	border-radius: 9999px;
	background-color: #d1d5db;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}
.chat-msg__avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.chat-msg__content-wrap {
	max-width: 75%;
}
.chat-msg__name {
	font-size: 0.857em;
	/* 12px / 14px */
	color: #6b7280;
	margin-bottom: 0.25em;
	margin-left: 0.25em;
}
.chat-msg__bubble {
	position: relative;
	padding: 0.857em;
	/* 12px */
	border-radius: 1.14em;
	/* 16px */
	box-shadow: 0 0.07em 0.14em 0 rgba(0, 0, 0, 0.05);
}
.chat-msg--partner .chat-msg__bubble {
	background-color: #fff;
	border-top-left-radius: 0.15em;
	border: 1px solid #f3f4f6;
}
.chat-msg--me .chat-msg__bubble {
	background-color: #ffe4e1;
	border-top-right-radius: 0.15em;
	border: 1px solid #fce7f3;
}
.chat-msg__subject {
	font-size: 0.714em;
	/* 10px */
	font-weight: bold;
	color: #9ca3af;
	border-bottom: 1px dashed #d1d5db;
	padding-bottom: 0.3em;
	margin-bottom: 0.5em;
	display: block;
}
.chat-msg__subject--pink {
	border-color: #fbcfe8;
	color: #6b7280;
}
.chat-msg__text {
	font-size: 1em;
	/* 14px (継承) */
	line-height: 1.625;
	white-space: pre-wrap;
}
.chat-msg__time {
	font-size: 0.714em;
	/* 10px */
	color: #9ca3af;
	display: block;
	margin-top: 0.3em;
	margin-left: 0.3em;
}
.chat-msg__meta-col {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: flex-end;
	padding-bottom: 0.3em;
	gap: 0.15em;
}
.chat-msg__status {
	font-size: 0.714em;
	font-weight: bold;
	color: #9ca3af;
}
/* Block: .settings-panel */

.settings-panel {
position: absolute;
	bottom: 4.286em; /* 60px / 14px */
	left: 0;
	width: 100%;
	background-color: #fff;
	border-top-left-radius: 1em;
	border-top-right-radius: 1em;
	box-shadow: 0 -0.28em 1.4em rgba(0, 0, 0, 0.1);
	z-index: 40;
	border-top: 1px solid #f3f4f6;
	max-height: 70%; /* 画面からはみ出さないよう vh ではなく % に変更推奨 */
	overflow-y: auto;
	transition: transform 0.3s ease-in-out;
	transform: translateY(110%);
}
.settings-panel.is-open {
	transform: translateY(0);
}
.settings-panel__inner {
	padding: 20px 20px 20px 20px;
}
.settings-panel__handle-wrap {
	display: flex;
	justify-content: center;
	margin-bottom: 0.75em;
}
.settings-panel__handle {
	width: 3em;
	height: 0.25em;
	background-color: #d1d5db;
	border-radius: 9999px;
}
.settings-panel__section {
	/*margin-bottom: 1em;*/
}
.settings-panel__label {
	display: block;
	font-size: 1em;
	/* 14px */
	font-weight: bold;
	margin-bottom: 0.5em;
}
.settings-panel__radios {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
}
.settings-panel__radio-item {
	flex: 1;
	min-width: 7.14em;
	/* 100px */
}
.settings-panel__radio-input {
	display: none;
}
.settings-panel__radio-btn {
	display: block;
	text-align: center;
	cursor: pointer;
	padding: 0.5em;
	border-radius: 0.5em;
	font-size: 1em;
	transition: all 0.2s;
	border: 1px solid #e5e7eb;
	background-color: #f9fafb;
}
/* Radio States */

.settings-panel__radio-input:checked+.settings-panel__radio-btn--blue {
	background-color: var(--color-blue);
	color: white;
	border-color: var(--color-blue);
}
.settings-panel__radio-input:checked+.settings-panel__radio-btn--gray {
	background-color: var(--color-blue);
	color: white;
	border-color: var(--color-blue);
}
.settings-panel__radio-input:checked+.settings-panel__radio-btn--red {
	background-color: var(--color-accent);
	color: white;
	border-color: var(--color-accent);
}
/* Schedule Box */

.settings-panel__schedule-box {
	margin-top:10px;
	background-color: #f9fafb;
	border-radius: 0.5em;
	padding: 0.75em;
	border: 1px solid #e5e7eb;
}
.settings-panel__sub-label {
	font-size: 0.857em;
	/* 12px */
	color: #6b7280;
	margin-bottom: 0.75em;
	font-weight: bold;
}
.settings-panel__date-rows {
	display: flex;
	flex-direction: column;
	gap: 0.75em;
}
.settings-panel__date-row {
	display: flex;
	align-items: center;
	background-color: #fff;
	padding: 0.25em;
	border-radius: 0.25em;
	border: 1px solid #e5e7eb;
}
.settings-panel__date-tag {
	width: 4.5em;
	font-size: 0.714em;
	/* 10px */
	font-weight: bold;
	background-color: #f3f4f6;
	color: #4b5563;
	padding: 0.3em 0;
	border-radius: 0.3em;
	text-align: center;
	margin-right: 0.5em;
	flex-shrink: 0;
}
.settings-panel__date-tag--primary {
	background-color: #dbeafe;
	color: #1e40af;
}
.settings-panel__date-input {
	flex: 1;
	background: transparent;
	border: none;
	font-size: 1em;
	/* 14px */
	outline: none;
}
.settings-panel__textarea {
	width: 100%;
	border: 1px solid #d1d5db;
	border-radius: 0.25em;
	padding: 0.4em 0.5em;
	font-size: 1em;
	outline: none;
	resize: none;
}
.settings-panel__textarea:focus {
	border-color: var(--color-blue);
}
/* Overlay */

.chat-overlay {
	position: absolute;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.2);
	z-index: 30;
	display: none;
	opacity: 0;
	transition: opacity 0.3s;
}
.chat-overlay.is-visible {
	display: block;
	opacity: 1;
}
/* Block: .chat-footer */

.chat-footer {
	/*
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 50;
	*/
	width: 100%;
	z-index: 50;
	background-color: #fff;
}
/* Status Bar */

.chat-footer__status-bar {
	/*padding: 0 0.5em;
	margin-bottom: -0.3em;*/
	/* 隙間調整 */
	cursor: pointer;
	/*transform: translateY(0);
	transition: transform 0.3s;*/
}
.chat-footer__status-bar.is-shifted {
	/*transform: translateY(-0.7em);*/
}
.chat-footer__status-content {
	max-width: 960px;
	margin: 0 auto;
	background-color: var(--color-primary);
	color: #fff;
	font-size: 0.857em; /* 12px */
	font-weight:bold;
	height: 40px;
	/* 高さを固定したため、上下パディングは0にして中央揃えに任せる */
	padding: 0 20px;
	border-top-left-radius: 0.5em;
	border-top-right-radius: 0.5em;
	box-shadow: 0 0.28em 0.42em -0.07em rgba(0, 0, 0, 0.1);
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.chat-footer__status-content:hover {
	background-color: #CB1543;
}
.chat-footer__status-text {
	display: flex;
	align-items: center;
	gap: 0.5em;
}
/* Input Area */

.chat-footer__input-area {
	border-radius: 0 0 10px 10px;
	background-color: #333;
	padding: 0.5em;
	/*border-top: 1px solid #e5e7eb;
	box-shadow: 0 -0.15em 0.7em rgba(0, 0, 0, 0.05);*/
}
.chat-footer__toolbar {
	display: flex;
	align-items: flex-end;
	gap: 0.5em;
	max-width: 960px;
	margin: 0 auto;
}
.chat-footer__tool-btn {
	width: 2.857em;
	/* 40px */
	height: 2.857em;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #9ca3af;
	background: transparent;
	border: none;
	border-radius: 9999px;
	cursor: pointer;
	transition: all 0.2s;
}
.chat-footer__tool-btn:hover {
	color: #4b5563;
	background-color: #f3f4f6;
}
.chat-footer__field-wrap {
	flex: 1;
	background-color: #f3f4f6;
	border-radius: 1em;
	padding: 0.5em 1em;
	min-height: 3.14em;
	/* 44px */
	display: flex;
	align-items: center;
}
.chat-footer__field {
	width: 100%;
	background: transparent;
	border: none;
	padding: 0;
	font-size: 1em;
	/* 14px */
	resize: none;
	max-height: 9em;
	outline: none;
}
.chat-footer__send-btn {
	width: 3.14em;
	/* 44px */
	height: 3.14em;
	flex-shrink: 0;
	background-color: var(--color-blue);
	color: #fff;
	border-radius: 9999px;
	border: none;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 0.28em 0.42em -0.07em rgba(0, 0, 0, 0.1);
	cursor: pointer;
	transition: transform 0.1s, background-color 0.2s;
}
.chat-footer__send-btn:hover {
	background-color: var(--color-blue-dark);
}
.chat-footer__send-btn:active {
	transform: scale(0.95);
}

/*.chat-screen--group .chat-header{
	background-color: var(--color-primary);
	}
.chat-screen--group .chat-footer__status-content {
	background-color: var(--color-blue);
}
.chat-screen--group .chat-footer__status-content:hover {
	background-color: var(--color-blue-dark);
}*/

@media screen and (max-width: 979px) {
  /* スマホ・タブレット時は強制的に16pxにする */
  .chat-footer__field,
  .settings-panel__textarea,
  .settings-panel__date-input{
    font-size: 16px !important;
  }
}
/*TABLET*/
@media only screen and (min-width: 600px) {
}
/*PC*/
@media only screen and (min-width: 980px) {
.chat-header__label {
  font-size: 0.875em; /* 14px */
}
.chat-header__org-name {
  font-size: 1em; /* 16px */
}
}
/*IE*/
@media all and (-ms-high-contrast:none) {}