@charset "UTF-8";

/*/////基本設定/////*/
.mycss #page h2{
	line-height: 3em;
	border-bottom: 2px solid rgba(var(--color-main-c),1.00);
	margin-bottom:2rem;
	padding-left:1em;
	font-size:1.2em;
}
.mycss #page h2::before{
	font-family: 'FontAwesome';
	content: '\f13a';
	margin-right:0.25em;
	color:rgba(var(--color-main-c),1.00);
}
.mycss #page h3{
	line-height: 2em;
	border-bottom: 2px solid rgba(var(--color-main-c),1.00);
	margin-bottom:1rem;
	padding-left:1em;
	font-size:1.2em;
}
.mycss #page p{
	line-height:1.8em;
}

/*==========写真でつながる、過去から未来へのストーリー。==========*/

/*/////写真で見る/////*/
.mycss .album{
	margin: 1rem 0;
	width: 100%;
}
.mycss .album h3{
	margin: 1rem 0;
	width: 100%;
	padding: 0.5rem 1rem;
	border-left: 10px solid rgba(var(--color-main-c),1.00);
	background-color: rgba(var(--color-main-c),0.20);
}
.album-gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px; /* 写真の間隔 */
  margin-top: 20px;
}

.album-gallery figure {
  margin: 0;
  text-align: center;
}

.album-gallery img {
  max-width: 100%;   /* 枠に収まるように */
  height: auto;      /* 縦横比を保持 */
  display: block;
  margin: 0 auto;
  border-radius: 8px; /* オプション：角丸 */
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.album-gallery figcaption {
  margin-top: 8px;
  font-size: 0.9rem;
  color: #555;
}

@media (max-width: 900px) {
  .album-gallery {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .album-gallery {
    grid-template-columns: 1fr;
  }
}

/*==========徳島県支部について==========*/

/*/////これまでの取り組みと概要/////*/
.mycss .initiatives {
}
.mycss .initiatives>section{
	margin-bottom:1rem;
}
.mycss .initiatives h5{
	margin: 1rem 0 0.5rem 0;
	font-size: 1rem;
	line-height: 1.1em;
}
.mycss .initiatives p{
	margin:0 0 0 1rem!important;
	padding:0;
	text-indent:1rem;
}
.mycss .initiatives ul{
	display:table;
	margin-bottom:1rem;
}
.mycss .initiatives ul li{
	padding-left:2rem;
	text-indent:-1rem;
	line-height:1.4rem;
}
.mycss .initiatives ul li::before{
	font-family: 'FontAwesome';
	content: '\f0da';
	padding-right:0.5rem;
}
.mycss .initiatives ul li p{
	text-indent:0;
	padding:0.25rem 0 0 0;
}
.mycss .initiatives dl{
	margin-left:2rem;
}
.mycss .initiatives dd{
	
}
.mycss .initiatives dt{
	padding-left:1rem;
}

/*/////マンドリン/////*/
.mycss .mandolin {
}
.mycss .mandolin>section{
	margin-bottom:1rem;
}
.mycss .mandolin h5{
	margin-bottom: 1rem;
	font-size: 1.1rem;
	line-height: 1.1em;
}
.mycss .mandolin p{
	text-indent:1rem;
	margin:0!important;
	padding:0;
}
.mycss .mandolin ul{
	display:table;
	margin-bottom:1rem;
}
.mycss .mandolin ul li{
	padding-left:2rem;
	text-indent:-1rem;
}
.mycss .mandolin ul li p{
	text-indent:0;
	padding:0.25rem 0 0 0;
}
.mycss .mandolin table{
}
.mycss .mandolin table tr td{
	text-align:center;
	width:100px;
}
.mycss .mandolin table tr td:nth-of-type(3){
	width:160px;
}
.mycss .mandolin table tr td:nth-of-type(4){
	width:calc( 100% - 360px );
	text-align:left;
}


/*/////ご挨拶/////*/
.mycss .greeting{
	display:inline-block;
}
.mycss .greeting figure {
  float: left;
  margin: 0 15px 15px 0;
  width: 30%;
height:auto;
}
.mycss .greeting img{
	width:100%;
}
.mycss .greeting p{
	text-indent: 1rem;
	margin: 0;
	display: block; /* inherit ではなく明示的に block */
  clear: none;
  overflow: visible;
}
.mycss .greeting .wrap-greeting{
	margin-top:1rem;
	width:auto;
	float:right;
	margin-right:2rem;
}
.mycss .greeting .wrap-greeting dd{
	padding-left:1rem;
}

/*/////役員紹介/////*/
.mycss .boardmember table tbody td{
	text-align:center;
	width:150px;
}
.mycss .boardmember table span{
	text-align:center;
	display:block;
	font-size:0.75rem;
	font-weight:normal;
}
.mycss .boardmember table tbody td:nth-of-type(4){
	text-align:left;
	width:calc( 100% - 40px )
} 

.mycss .boardmember table tbody td{
	text-align:center;
}
.mycss .boardmember table tbody tr td:nth-of-type(1),
.mycss .boardmember table tbody tr td:nth-of-type(2),
.mycss .boardmember table tbody tr td:nth-of-type(3){
	width:20%;
} 
.mycss .boardmember table tbody tr td:nth-of-type(4){
	width:40%;
	text-align:left;
} 

/*/////会則/////*/

.mycss .bylaws dl{
	font-weight:600;
	margin-top:1em;
}
.mycss .bylaws dd{
	margin-top:1em;
}
.mycss .bylaws dt{
	padding-left:1em;
	text-indent:-1em;
}
.mycss .bylaws ul{
	margin-bottom: 1em;
	padding-left: 2em;
}
.mycss .bylaws ul>li{
	list-style: decimal!important;
	display: list-item;
}


/*==========投稿用ページ==========*/

/*/////投稿用/////*/
.mycss .news-page-cont{
}
.mycss .news-page-cont h3{
}
.mycss .wrap-single-category{
	width:100%;
}
.mycss .wrap-single-category .category, .mycss .wrap-single-category .date{
	width:auto;
	float:right;
	font-weight:bold;
	font-size:0.875rem;
}
.mycss .wrap-single-category .date{
	margin-left:1rem;
}
.mycss .pagenation{
	width:100%;
	margin-top:1rem;
}
.mycss .pagenation dl{
	font-weight:bold;
	font-size:0.875rem;
	padding:0.25rem 0.5rem;
	width: auto;
	float: left;
	color: rgba(var(--color-main),1.0);
}
.mycss .pagenation dl:last-of-type{
	float:right;
}

/*==========活動報告==========*/

/*/////写真で見る/////*/
.mycss .archive-report{
	width:100%; 
}
.mycss .archive-report h6{
	font-weight: bold;
	border-bottom: 1px solid rgba(var(--color-red),1.00);
	margin:2rem 0;
	padding-bottom:0.5rem;
}
.mycss .archive-report section{
	width:100%;
	display:block;
	margin-top:2rem;
}
.mycss .archive-report section .date{
	text-align:right;
	margin-bottom:0.5rem;
}

.mycss .report-p{
	display: flex;
	flex-wrap: wrap;
	justify-content:space-between;
}
.mycss .report-p::after{
  content:"";
  display: block;
  width: calc(100% / 3 - 30px);
  margin: 10px;
}
.mycss .report-p dl{
	display: table;
	width: 32%;
	border: 2px solid rgba(var(--color-main-c),1.00);
	margin-bottom:15px;
}
.mycss .report-p dl h4{
	padding: 0.75em 0.5em;
	background-color: rgba(var(--color-main-c),1.00);
	color: rgba(var(--color-white),1.00);
	line-height: 1.1em;
}
.mycss .report-p dl h4::before{
	font-family: 'FontAwesome';
	content: ''!important;
	padding-right:0!important;
}
.mycss .report-p dl dd{
	text-align: right;
	padding-right:0.5em;
}
.mycss .report-p dl p{
	font-size:0.875em;
	line-height:1.1em;
	padding:0.5em;
}
.mycss .report-p dl a{
	display: block;
	width: 100%;
	text-align: center;
	background-color: rgba(var(--color-main-c),1.00);
	color: rgba(var(--color-white),1.00);
	padding:0.5em 0;
}
/*内容*/
.mycss .report-p-cont h5{
	border-bottom: 1px solid rgba(var(--color-red),1.00);
	border-top: 1px solid rgba(var(--color-red),1.00);
	padding:0.5em;
}
.mycss .report-p-cont dd{
	text-align:right;
	margin:1em 0;
}
.mycss .report-p-cont p{
	margin: 1em 0 0 0;
	padding: 1em;
	border: 1px solid rgba(var(--color-main-c),1.00);
	background-color: rgba(var(--color-main-c),0.20);
}
.mycss .report-p-cont-p{
	display: flex;
	flex-wrap: wrap;
	justify-content:space-between;
}
.mycss .report-p-cont-p::after{  
	content:"";
  display: block;
  width: calc(100% / 3 - 30px);
  margin: 10px;
}
.mycss .report-p-cont-p dl{
	display: table;
	width: 32%;
	border: 2px solid rgba(var(--color-main-c),1.00);
	margin-bottom:15px;
}
.mycss .report-p-cont-p dl p{
	font-size:0.875em;
	padding:0.5em;
}

/*==========その他の情報==========*/

/*/////個人情報/////*/
.mycss .personal h6{
	border-left: 7px solid rgba(var(--color-main-c),1.00);
	margin:1em 0;
	padding-left:0.75em;
}
.mycss .personal ul{
	margin:1em;
	padding-left:0.75em;
}
.mycss .personal ul li{
	list-style: decimal;
	display: list-item;
}
.mycss .personal dl{
	width:auto;
	margin: 0 0 1em 2em;
	padding:0.5em;
	border: 1px solid rgba(33,33,33,1.00);
}
