/* || -------------------- midashi */

/* 
  第3階層目のH1、高さ基準の画像
*/

.midashi {
  width: 100%;
  text-align: center; 
  margin-bottom: 50px;
  padding: 0 14px 0 14px;
}
.midashi img{
  width: 100%;
  height: 94px;
  object-fit: contain;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .midashi {
    margin-bottom: 30px;
  }
  .midashi img{
    height: 76px;
  }
}

/* || -------------------- first-color */

/* 
  1文字目の色を変更する見出し
  ・詳細ページのみ一律サイズを下げる
*/

.first-color {
  width: 100%;
  color: #6D5B4C;
  font-size: 1.5em;
  font-weight: 700;
  text-align: center;
}

.first-color.orange span {
  color: #FF8D29;
}
.first-color.green span {
  color: #91BF26;
}
.first-color.pink span {
  color: #FF8080;
}

@media screen and (max-width: 768px){
  div.detail .first-color{
    font-size: 1.25em;
  }
}

/* || -------------------- a.detail (ページリンク) */

a.detail {
  position: relative;
  display: block;
  width: 100%;
	color: #6D5B4C;
  font-weight: 700;
  text-align: center;
	border-radius: 40px;
  padding: 18px 0;
  margin: 0 auto;
}
a.detail.yellow {
	background-color: #FFEF88;
}
a.detail.deepyellow {
	background-color: #FFEF88;
}
a.detail.pink {
	background-color: #FFE9E9;
}
a.detail.deeppink {
	color: #fff;
	background-color: #FF8080;
}

a.detail:before , a.detail:after {
  position: absolute;
  right: 28px;
  display: flex;
  content: "";
  width: 10px;
  height: 2px;
	background-color: #6D5B4C;
}
a.detail.deeppink:before ,
a.detail.deeppink:after {
	background-color: #fff;
}

a.detail:before {
  top: 25px;
  transform: rotate(45deg);
}
a.detail:after {
  top: 31px;
  transform: rotate(-45deg);
}