@charset "UTF-8";

span.text-icon {
  display: inline-block;
  background: #bd2020;
  padding: 2px 6px;
  margin-right: 6px;
  /* 先行する文字列との間隔 */
  vertical-align: middle;
  /* 先行する文字列と上下中央揃え */
  margin-bottom: 2px;
  font-size: 24px;
  font-weight: 400;
  color: #fff;
  border-radius: 3px;
  /* アイコンの角を丸める */
}

/* -----------------------------------------------------------------------------
 Top Page carousel
----------------------------------------------------------------------------- */
.filter img {
  -moz-filter: brightness(0.65);
  -o-filter: brightness(0.65);
  -ms-filter: brightness(0.65);
  filter: brightness(0.65);
}

.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
}

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
}

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
}

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
}

/* -----------------------------------------------------------------------------
 Top Page contents トップページ
----------------------------------------------------------------------------- */
/* news */
.newslistArea {
  width: 100%;
  margin-top: 32px;
  margin-bottom: 48px;
}
.newslistArea__inner {
  width: 100%;
  max-width: 744px;
  margin-left: auto;
  margin-right: auto;
  padding: 32px 48px;
  background-color: #ffffff;
  border-radius: 32px;
  box-shadow: 0 6px 13px -3px #000c421a, 0 0 1px #000c421a;
}
.newslistArea__label {
  margin-bottom: 48px;
}
.newslistArea__list {
  width: auto;
}
.newslistArea__list hr {
  display: block;
  width: 100%;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
}
.newslistArea__list dl {
  width: 100%;
}
.newslistArea__list dl a:hover dt {
  filter: brightness(1.2);
}
.newslistArea__list dt {
  display: block;
  width: 100%;
  margin: 16px 0 8px;
  color: #005FB1;
  font-size: 18px;
  font-weight: 600;
}
.newslistArea__list dl dd {
  display: block;
  width: 100%;
  padding-bottom: 16px;
  font-size: 16px;
  color: #393939;
  border-bottom: 1px solid #DDDDDD;
}
.newslistArea__list dl dd a {
  color: #393939!important;
}
/* Pick Up */
.pickupArea {
  width: 100%;
  max-width: 744px;
  margin-left: auto;
  margin-right: auto;
}

.pickupArea__inner {
  display: flex;
  justify-content: center;
  align-items: stretch;
  flex-wrap: wrap;
  row-gap: 64px;
}
@media screen and (min-width: 768px) {
.pickupArea__inner {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  row-gap: 80px;
  width: 100%;
}
}
.pickupArea__card {
  width: 340px;
}

.pickup__header {
  font-size: 22px;
  font-weight: 700;
  color: #00A29A;
}
@media screen and (min-width: 768px) {
.pickup__header {
  font-size: 24px;
}
}
.pickup__header::before {
  content:'◎';
  padding-right: 8px;
  color: #EF9F00;
}
.pickup__body {
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 6px 13px -3px #000c421a, 0 0 1px #000c421a;
}
.newspaper {
  text-align: center;
  background: #FFFDE3;
}
.newspaper-number {
  padding: 16px 0;
  color: #039E8E;
  text-align: center;
}
.pickup__img img {
  border-radius: 16px 16px 0 0;
}
.pickup__text {
  padding: 16px;
}
.pickup__footer {
  padding-bottom: 24px;
}

/* -----------------------------------------------------------------------------
 About Page contents 平和委員会とは
----------------------------------------------------------------------------- */
/* 平和委員会とは */
.aboutArea {
  width: 100%;
  max-width: 824px;
  margin-bottom: 48px;
  padding: 0 16px;
}
@media screen and (min-width: 768px) {
  .aboutArea {
    max-width: 824px;
    padding: 0 40px;
  }
}
.aboutArea__text {
  width: 100%;
  margin-bottom: 24px;
}
.aboutArea__photo {
  display: flex;
  justify-content: center;
  align-items: stretch;
  flex-wrap: wrap;
  row-gap: 32px;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .aboutArea__photo {
    justify-content: space-between;
  }
}
.aboutArea__photo img {
  width: 100%;
  max-width: 340px;
  height: auto;
  margin-bottom: 8px;
}
/* 魅力と活動 */
.aboutArea__inner {
  display: flex;
  justify-content: center;
  align-items: stretch;
  flex-wrap: wrap;
  row-gap: 48px;
}
@media screen and (min-width: 768px) {
.aboutArea__inner {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  row-gap: 56px;
  width: 100%;
}
}
.aboutArea__card {
  position: relative;
  width: 100%;
  max-width: 340px;
  padding: 16px;
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 6px 13px -3px #000c421a, 0 0 1px #000c421a;
}
@media screen and (min-width: 768px) {
  .aboutArea__card {
    max-width: 350px;
  }
}
.about__header {
  margin-bottom: 16px;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.025em;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .about__header {
    font-size: 24px;
  font-weight: 700;
  }
}
.about__text-note {
  padding: 8px;
  margin-top: 8px;
  font-size: 14px;
  border-radius: 8px;
  border: 1px solid #E5C48E ;
}
.number-margin {
  padding-top: 32px;
}
.circle {
  position: absolute;
  top: -30px;
  left: 40%;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #EB9306;
}
@media screen and (min-width: 768px) {
  .circle {
    position: absolute;
    top: -40px;
    left: 40%;
    width: 72px;
    height: 72px;
  }
}
.circle span {
  font-size: 40px;
  font-weight: 700;
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .circle span {
    font-size: 60px;
  }
}
.aboutArea-margin {
  padding-top: 48px;
}
@media screen and (min-width: 768px) {
  .aboutArea-margin {
    padding-top: 64px;
  }
}
/* 石川県平和委員会のあゆみ */
.timeline {
  width: 100%;
  max-width: 744px;
  padding: 16px;
  background: #fff;
  border-radius: 16px;
}
.timeline__list {
  padding: 40px 0;
}
.timeline__list-item {
  display: flex;
  line-height: 1.5;
}
.timeline-date {
  width: 25%;
  padding-right: 8px;
  color: #5a5a5a;
  font-size: 110%;
  font-weight: 600;
  letter-spacing: 0.05em;
}
@media screen and (min-width: 768px) {
  .timeline-date {
    width: 20%;
    padding: 0;
  }
}
.timeline-content {
  position: relative;
  width: 75%;
  padding: 0  16px 56px 32px;
  border-left: 1px solid #a2a2a2;
}
@media screen and (min-width: 768px) {
  .timeline-content {
    width: 80%;
  }
}
.timeline-content::before {
  content: "";
  position: absolute;
  top: 0;
  left: -10px;
  width: 20px;
  height: 20px;
  background-color: #039e8e;
  border-radius: 10px;
}
/* -----------------------------------------------------------------------------
 Guide Page contents 平和ガイド
----------------------------------------------------------------------------- */
/* 「軍都・金沢」を巡るフィールドワークに出かけませんか */
.guideArea {
  width: 100%;
  max-width: 824px;
  margin-bottom: 48px;
  padding: 0 16px;
}
@media screen and (min-width: 768px) {
  .guideArea {
    max-width: 824px;
    padding: 0 40px;
  }
}
.guideArea__field {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 16px;
  width: 100%;
  margin-bottom: 24px;
}
@media screen and (min-width: 768px) {
  .guideArea__field {
    justify-content: space-between;
    margin-bottom: 32px;
  }
}
.guideArea__field-reverse {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 16px;
  width: 100%;
  margin-bottom: 24px;
}
@media screen and (min-width: 768px) {
  .guideArea__field-reverse {
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    align-items: center;
    flex-wrap: wrap;
    row-gap: 32px;
    width: 100%;
    margin-bottom: 32px;
  }
}
.guideArea__field-text {
  width: 100%;
  max-width: 340px;
}  
@media screen and (min-width: 768px) {
  .guideArea__field-text {
    width: 100%;
    max-width: 320px;
  }  
}
.guideArea__field-photo {
  width: 100%;
  max-width: 340px;
  height: auto;
}
.guideArea__field-photo img {
  border-radius: 16px;
}
@media screen and (min-width: 768px) {
  .guideArea__field-photo {
    max-width: 380px;
  }
}
/* ガイド内容例 */
.guideArea__inner {
  display: flex;
  flex-wrap: wrap;
  row-gap: 32px;
  padding: 24px;
  background: #ffffff;
  border-radius: 16px;
  border: 1px solid #EDEDED;
}
@media screen and (min-width: 768px) {
  .guideArea__inner {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    row-gap: 0;
    padding: 32px;
  }
}
.guide__con-title {
  font-size: 18px;
  font-weight: 700;
}
.guideArea__inner ul li {
  margin-bottom: 4px;
}
.guide__con-note {
  margin-top: 4px;
  font-size: 15px;
  text-align: left;
}
@media screen and (min-width: 768px) {
  .guide__con-note {
    font-size: 16px;
    text-align: right;
  }
}
/* ガイドのお申し込み */
.guideArea__contact {
  width: 100%;
  padding: 16px;
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 6px 13px -3px #000c421a, 0 0 1px #000c421a;  
}
@media screen and (min-width: 768px) {
  .guideArea__contact {
    padding: 24px;
  }
}
.guide-request {
  margin-top: 32px;
}
.guide-request-form {
  margin-top: 24px;
}
/* -----------------------------------------------------------------------------
 News Paper Page contents 平和新聞石川県版
----------------------------------------------------------------------------- */
/* 平和新聞石川県版 */
.newspaper__header {
  background: #ffffff;
}
.newspaperArea {
  width: 100%;
  margin-bottom: 24px;
  padding: 0 16px;
}
@media screen and (min-width: 768px) {
  .newspaperArea {
    margin-bottom: 32px;
    padding: 0 40px;
  }
}
.newspaperArea__inner {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 16px;
  width: 100%;
  max-width: 680px;
}
@media screen and (min-width: 768px) {
  .newspaperArea__inner {
    justify-content: space-between;
     max-width: 680px;
    margin: 0 auto;
    padding: 0 40px;
  }
}
.newspaperArea__item {
  width: 100%;
  max-width: 240px;
}
@media screen and (min-width: 768px) {
  .newspaperArea__item {
    width: 240px;
  }
}
/* ページネーション 
  https://pote-chil.com/css-stock/ja/pagination */
.pagenation {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 8px;
  padding: 0;
  list-style-type: none;
}
.pagenation a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 2em;
  height: 2em;
  color: #039e8e;
  border: 1px solid #039e8e;
  box-sizing: border-box;
}
.pagenation a:not(:hover) {
  text-decoration: none;
}
.pagenation .current a {
  color: #fff;
  background-color: #039e8e;
  pointer-events: none;
}
.pagenation .prev a,
.pagenation .next a {
  gap: 0 4px;
  width: auto;
  padding: .5em .8em;
  line-height: 1;
}
.pagenation .prev a::before,
.pagenation .next a::after {
  display: inline-block;
  content: '';
  width: .3em;
  height: .3em;
  transform: rotate(45deg);
}
.pagenation .prev a::before {
  border-bottom: 1px solid #039e8e;
  border-left: 1px solid #039e8e;
}
.pagenation .next a::after {
  border-top: 1px solid #039e8e;
  border-right: 1px solid #039e8e;
}
/* ガイドのお申し込み */
.newspaperArea__contact {
  width: 100%;
  max-width: 680px;
  margin: 0 auto;
  margin-top: 64px;
  padding: 16px;
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 6px 13px -3px #000c421a, 0 0 1px #000c421a;  
}
@media screen and (min-width: 768px) {
  .newspaperArea__contact {
    padding: 24px;
  }
}
.newspaperArea__item p::before {
  content: '●';
  padding-right: 4px;
}
/* -----------------------------------------------------------------------------
 efforts Page contents 平和の取り組み
----------------------------------------------------------------------------- */
.swiper {
  width: 100%;
  height: 100%;
}
.swiper-wrapper {
  height: auto;
}
.swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}

.swiper-slide img {
  width: 100%;
  height: auto;
}

.swiper-button-prev,
.swiper-button-next {
  display: none !important;
}

.swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background: rgba(255,255,255,0.6); /* 半透明の白 */
  opacity: 1;
}

.swiper-pagination-bullet-active {
  background: #ffffff; /* 選択時は白でくっきり */
}

.swiper-pagination {
  bottom: 8px !important;
}

.effortsArea {
  width: 100%;
  max-width: 824px;
  margin-bottom: 48px;
  padding: 0 16px;
}
@media screen and (min-width: 768px) {
  .effortsArea {
    max-width: 824px;
    padding: 0 40px;
  }
}
.effortsArea__field {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 16px;
  width: 100%;
  margin-bottom: 24px;
}
@media screen and (min-width: 768px) {
  .effortsArea__field {
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 32px;
  }
}
.effortsArea__field-reverse {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 16px;
  width: 100%;
  margin-bottom: 24px;
}
@media screen and (min-width: 768px) {
  .effortsArea__field-reverse {
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    align-items: flex-start;
    flex-wrap: wrap;
    row-gap: 32px;
    width: 100%;
    margin-bottom: 32px;
  }
}
.effortsArea__field-text {
  width: 100%;
  max-width: 400px;
}  
@media screen and (min-width: 768px) {
  .effortsArea__field-text {
    width: 100%;
    max-width: 320px;
  }  
}
.effortsArea__field-photo {
  width: 100%;
  max-width: 400px;
  height: auto;
}
.effortsArea__field-photo img {
  border-radius: 16px;
}
@media screen and (min-width: 768px) {
  .effortsArea__field-photo {
    max-width: 400px;
  }
}
/* -----------------------------------------------------------------------------
Books Page contents 発行図書・DVD
----------------------------------------------------------------------------- */
/* 発行図書・DVD */
.booksArea {
  width: 100%;
  margin-bottom: 24px;
  padding: 0 16px;
}
@media screen and (min-width: 768px) {
  .booksArea {
    margin-bottom: 64px;
    padding: 0 40px;
  }
}
.books__header {
  margin-bottom: 32px;
  padding: 8px 0;
  background: #ffffff;
}
.books__header h3 {
  line-height: 1;
}
.books__header h3 span {
  font-size: 18px;
}
.booksArea__inner {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  row-gap: 32px;
  width: 100%;
  max-width: 720px;
}
@media screen and (min-width: 768px) {
  .booksArea__inner {
    justify-content: space-between;
    max-width: 720px;
  }
}
@media screen and (min-width: 768px) {
  .booksArea__item-thumb {
    width: 240px;
  }
}
@media screen and (min-width: 768px) {
  .booksArea__item-text {
    width: 440px;
  }
}
.booksArea__item-text h4 {
  margin-bottom: 0.5em;
  font-size: 16px;
  font-weight: 700;
} 
@media screen and (min-width: 768px) {
  .booksArea__item-text h4 {
    font-size: 18px;
  } 
}
.books_detailed {
  margin-top: 1em;
}
.booksArea__item-thumb .btn-more:last-child {
  margin-top: 8px;
}
@media screen and (min-width: 768px) {
  .booksArea__item-text-wide {
    width: 100%;
  }
}
/* -----------------------------------------------------------------------------
 Links Page contents 関係リンク
----------------------------------------------------------------------------- */
.linksArea {
  width: 100%;
  max-width: 824px;
  margin-top: 32px;
  margin-bottom: 48px;
  padding: 0 16px;
}
@media screen and (min-width: 768px) {
  .linksArea {
    max-width: 824px;
    padding: 0 40px;
  }
}
.links__list-item {
  margin-bottom: 1em;
}
.links__list-item::before {
  content: '●';
  padding-right: 4px;
  font-size: 14px;
  color: #054782;
}
.links__list-item::after {
  content: "\f08e"; /* v6 の up-right-from-square アイコン */
  font-family: "Font Awesome 6 Free"; /* Font Awesome 6 */
  font-weight: 900;
  margin-left: 0.5em;
  font-size: 0.9em; /* アイコンのサイズ */
  color: #a1a1a1; /* アイコンの色 */  
}

/* -----------------------------------------------------------------------------
 Sitepolicy Page contents サイトポリシー
----------------------------------------------------------------------------- */
.sitepolicyArea {
  width: 100%;
  max-width: 824px;
  margin-top: 32px;
  margin-bottom: 48px;
  padding: 0 16px;
}
@media screen and (min-width: 768px) {
  .sitepolicyArea {
    max-width: 824px;
    padding: 0 40px;
  }
}

.sitepolicy-item {
  margin: 16px 0 8px 0;
  font-size: 20px;
  font-weight: 600;
}

/* -----------------------------------------------------------------------------
 Info Page contents お知らせの個別ページ
----------------------------------------------------------------------------- */
/* news */
.newslistArea {
  width: 100%;
  margin-top: 32px;
  margin-bottom: 48px;
}
.newsArea__inner {
  width: 100%;
  max-width: 744px;
  margin-left: auto;
  margin-right: auto;
  padding: 32px 48px;
  background-color: #ffffff;
  border-radius: 16px;
  box-shadow: 0 6px 13px -3px #000c421a, 0 0 1px #000c421a;
}

/* -----------------------------------------------------------------------------
 Apply Page contents お申し込みフォームページ
----------------------------------------------------------------------------- */
.formArea {
  width: 100%;
  margin-bottom: 24px;
  padding: 16px;
  background: #fff;
}
@media screen and (min-width: 768px) {
  .formArea {
    padding: 16px 40px;
  }
}

.formArea p {
  margin-top: 1em;
}

.guide-contact {
  margin: 0 auto;
  margin-top: 24px;
  padding: 16px;
  width: 90%;
  max-width: 1038px;
  background: #fff;
  border-radius: 4px;
}
@media screen and (min-width: 768px) {
  .guide-contact {
    width: 1038px;
}
}

.guide-contact-note {
  margin-bottom: .5em;
  font-size: 18px;
  font-weight: 600;
  color:#bd2020;
}

.guide-contact p strong {
  font-weight: 600;
}
/*ContactForm7カスタマイズ*/
.wpcf7-list-item.first {
  margin: 0!important;
}

table.cf7_table {
	width: 90%;
	margin: 0 auto;
	border: 3px solid #e5e5e5;
}

table.cf7_table tr {
	border-top: 1px solid #e5e5e5;
}

.single .entry-content table.cf7_table,
.page .entry-content table.cf7_table {
	display: table;
}

/*入力欄*/
.cf7_table input[type="text"],
.cf7_table input[type="tel"],
.cf7_table input[type="email"] {
  width: 80%;
  padding: 16px 20px;
	border: 1px solid #bdbdbd;
}
.cf7_table textarea {
  width: 100%;
  padding: 16px 20px;
	border: 1px solid #bdbdbd;
}

.cf7_table ::placeholder {
	color:#797979;
}

.cf7_table td.order-check input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin: 0 3px 3px 4px;
	border: 1px solid #bdbdbd;
}

.cf7_table td.orders input[type="number"],
.cf7_table td.total-amount input[type="text"] {
  width: 30%;
  padding: 12px 16px;
	border: 1px solid #bdbdbd;
}

/*「必須」文字*/
.cf7_required {
	margin-right: 1em;
	padding: 4px ;
	font-size: .8em;
	background: #f79034;/*オレンジ*/
	color: #fff;
	border-radius: 3px;
}

/*「任意」文字*/
.cf7_unreq {
	font-size:.8em;
	padding: 4px;
	background: #bdbdbd;/*グレー*/
	color: #fff;
	border-radius: 3px;
	margin-right: 1em;
}

/* タイトル列 */
@media screen and (min-width: 768px){
	.cf7_table th {
	  width: 30%;/*横幅*/
    padding: 8px;
    text-align: left;
	  background-color:#ebedf5;/*ブルーグレー*/
    vertical-align: middle;
	}
  .cf7_table th p {
    margin-left: 0.5em;
  }
  .cf7_table td {
    padding: 16px;
  }
  .cf7_table textarea {
  width: 80%;
  padding: 16px 20px;
	border: 1px solid #bdbdbd;
}
}

/* レスポンシブ */
@media screen and (max-width: 768px) {
	table.cf7_table {
	  width: 95%;
	}
	.cf7_table tr, .cf7_table td, .cf7_table th {
	  display: block;
	  width: 100%;
	}
	.cf7_table th {
    padding: 16px;
    text-align: left;
  	background-color:#ebedf5;
    vertical-align: middle;
	}
  .cf7_table th p {
    margin-left: 0.5em;
  }
  .cf7_table td {
    padding: 16px;
  }
}

/* 「送信する」ボタン */
.wpcf7 input.wpcf7-submit {
	margin:0 auto;
  padding: 8px 16px;
	color:#fff;
	font-size:1.2em;
	background-color:#f79034;/* オレンジ*/
	border:0;
  border-radius: 4px;
  cursor: pointer;
}

.cf7_btn {
	text-align: center;
	margin-top: 20px;
}

.wpcf7-spinner {
	width: 0;
	margin: 0;
}