@charset "utf-8";

:root{
	--subColor:#ffa8be;
	--lineColor:#ffced9;
}

body{
	background:url(../../img/pages/customize/kusari.png) fixed,var(--subColor);
}

.c_box{
	margin:2rem auto 0 auto;
	background:white;
	border-radius: .7rem;
	padding:3rem;
	display:grid;
	grid-template-columns: 1fr 2fr;
	gap:3rem;
	h3{
		font-size: 1.2em;
		font-weight: 500;
		inline-size: fit-content;
  	margin-inline: auto;
  	text-align: left;
	}
	> *{
		> * + *{
			margin-top:1rem;
		}
	}
	@media print {
		border:2px solid silver;
		padding:2rem;
	}
	@media (max-width: 800px) {
		display:block;
		padding:2rem;
		> *{
			margin-top:1rem;
		}
	}
}

#customize{
	p{
		text-align: left;
		strong{
			font-size: 1.1em;
			font-weight: 500;
			color:rgb(var(--mainColor));
		}
	}
}

#annaibun{/*利用者向けに案内文を作成し出力する。*/
	> div{
		> p{
			text-align: left;
		}
		> div{
			background:#f9faf3;
			padding:1.5rem;
			border-radius: .5rem;
			h4{
				text-align: left;
				font-weight: 400;
			}
			table{
				width:100%;
				background:white;
				margin:.5rem auto 0 auto;
				tr{
					th,td{
						padding:.5em;
						border:1px solid silver;
					}
					td{
						text-align: left;
					}
				}
			}
		}
	}
}

#event{/*イベントへの参加状況を把握する。*/
	p{
		text-align: left;
	}
}

#group{/*グループや世帯ごとに管理。*/
	p{
		text-align: left;
	}
}

#doukou{/*同行者を把握する。*/
	align-items: center;
	> div{
		> p{
			text-align: left;
		}
		
	}
	> aside{
		grid-column: 1 / -1;
			display:grid;
			grid-template-columns: repeat(auto-fill,minmax(min(400px,100%),1fr));
			gap:1rem;
			align-items:stretch;
			div{
				padding:2rem;
				border-radius: .7rem;
				figure{
					figcaption{
						margin:1em auto 0 auto;
						font-weight: 500;
						font-size: 1.2em;
					}
				}
				p{
					text-align: left;
					margin:1em auto 0 auto;
					strong{
						font-weight: 500;
					}
				}
				&:nth-of-type(1){
					background:#fcfbdc;
				}
				&:nth-of-type(2){
					background:#ffeef3;
					margin-top:0;
				}
			}
		}
}

#unei{
	p{
		text-align: left;
	}
}

#yuryou{
	> div{
		article{
			> * + *{
				margin-top:1em;
			}
			p{
				text-align: left;
			}
			aside{
				font-size: .9em;
				text-align: left;
			}
			&:nth-of-type(2){
				background:#ebfcf9;
				padding:1.5rem;
				border-radius: .5rem;
			}
		}
	}
}

.addtoany_content{
	margin-top:5rem !important;
}