@charset "UTF-8";

/*==================================================
アコーディオンのためのcss
===================================*/

/*アコーディオン全体*/
.accordion-area {
  list-style: none;
  width: 100%;
  max-width: 1000px; /* default 900 */
  margin: 0 auto;
}

.accordion-area li {
  margin: 5px 0;
}

.accordion-area section {
  border: 1px solid #ccc;
}
.archiveyear:hover{
  color: #b3761a;
}

/*アコーディオンタイトル*/
.archiveyear {
  position: relative; /*+マークの位置基準とするためrelative指定*/
  cursor: pointer;
  font-size: 2.3rem;
  font-family: "Monotype Corsiva",serif;
  color: #555;
  font-weight: 500;
  padding: 0 0 0 60px;
  transition: all 0.5s ease;
}

/*アイコンの＋と×*/
.archiveyear::before,
.archiveyear::after {
  position: absolute;
  content: "";
  width: 15px;
  height: 2px;
  background-color: #555;
}
.archiveyear::before {
  top: 48%;
  left: 15px;
  transform: rotate(0deg);
}
.archiveyear::after {
  top: 48%;
  left: 15px;
  transform: rotate(90deg);
}

/*　closeというクラスがついたら形状変化　*/

.archiveyear.close::before {
  transform: rotate(45deg);
}

.archiveyear.close::after {
  transform: rotate(-45deg);
}

/*アコーディオンで現れるエリア*/
.box {
  display: none; /*はじめは非表示*/
  background: #fff;
  margin: 0 3% 3% 3%;
  /*padding: 3%;*/

}