/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
　　　album
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

/* 準備中対応 */
h2 {
  margin: 100px auto;
}


.archive_wrapper {
  margin: 0 auto;
  padding: 0;
  overflow-x: hidden;
  text-align: center;
}

.album-cat {
  display: flex;
  justify-content: flex-start;
  width: 80%;
  margin: 100px auto 0;
  flex-wrap:wrap;
  gap:10px 20px;
}

.cat-parent-li {
  /* display: flex; */
}


.album-cat li {
	display: inline-block;
	font-size: 16px;
  height: 48px;
}

.album-cat li a {
  color: #fff;
  text-decoration: none;
  transition: 0.6s;
  background-color: #b37caf;
  padding: 0.5em;
  border-radius: 10px;
}

.album-cat li a:hover {
  transition: 0.6s;
  background-color: #8b3b89;
}


.album-cat a.current {
  color: #fff;
  font-weight: bold;
}


.article_body {
  width: 90%;
  max-width: 1440px;
  margin: 0 auto 200px;
  padding: 100px 50px;
  text-align: left;
}

.contents_body {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.entry {
  list-style: none;
  padding: 10% 0;
  margin: 0 auto;
}

.post_thumbnail img {
  max-width: 352px;
  max-height: 352px;
  width: 24vw;
  height: 24vw;
  object-fit: cover;
}


.pagenation_area {
  display: flex;
  justify-content: center;
  margin: 0 auto;
  align-items: center;
}

.pagenation_area li {
  list-style: none;
  font-size: 24px;
  font-family: "Cormorant Garamond", serif;
  font-weight: 400;
}

.pagenation_area li a {
  text-decoration: none;
  color: #000;
}

.pagenation_area li a:hover {
  color: #000;
}

.page-count {
  font-size: 24px;
  font-family: "Cormorant Garamond", serif;
  font-weight: 400;
  margin: 72px;
}




/* グリッド */

.contents_body{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:20px;
}

.entry{
  list-style:none;
}

.contents_body{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:20px;
}

/* .post_thumbnail img{
  width:100%;
  height:220px;
  object-fit:cover;
} */

/* タブレット */

@media (max-width:1024px){
.contents_body{
  grid-template-columns:repeat(3, 1fr);
}
}

/* スマホ */

@media (max-width:768px){
.contents_body{
  grid-template-columns:repeat(2, 1fr);
}
}

/* 小さいスマホ */

@media (max-width:480px){
.contents_body{
  grid-template-columns:1fr;
}
}









/* ===============================
   カテゴリメニュー
================================ */

.archive_wrapper .cat-parent{
  position: relative;
}

/* 親カテゴリリスト */
.archive_wrapper .parent-list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  gap:20px;
}

/* 親カテゴリ */
.archive_wrapper .cat-parent-li{
  position:relative;
}

.archive_wrapper .cat-parent-li > a{
  display:block;
  padding:10px 15px;
  text-decoration:none;
  color:#fff;
  transition:.3s;
  margin-left: 24px;
}

/* hover */
.archive_wrapper .cat-parent-li > a:hover{
  color:#fff;
}

/* ===============================
   ドロップダウン
================================ */

.archive_wrapper .album_dropdown__lists{
  position:absolute;
  top:100%;
  left:0;

  list-style:none;
  margin:0;
  padding:10px 0;

  min-width:180px;

  display:none;
  z-index:10;
}

/* hoverで表示 */
.archive_wrapper .cat-parent-li:hover .album_dropdown__lists{
  display: flex;
  flex-direction: column;
}

/* 現在カテゴリのときは常に表示(taxonomy) */
.cat-parent-li.open .album_dropdown__lists{
  display: flex;
  flex-direction: column;
}

/* 子カテゴリ */
.archive_wrapper .album_dropdown__list a{
  display:block;
  padding:8px 15px;
  color:#fff;
  text-decoration:none;
  transition:.3s;
  margin-left: 24px;
  height: initial;
  width: 200px;
}

.archive_wrapper .album_dropdown__list a:hover{
  background:#8b3b89;
}

.archive_wrapper .album_dropdown__list:not(:first-child)::before{
    display: none;
}

/* ===============================
   current（現在表示中）
================================ */

.archive_wrapper .cat-parent a.current,
.archive_wrapper .album_dropdown__list a.current{
  background:#8b3b89;
  color:#fff;
}

/* .cat-parent-li > a{
  display:inline-block;
  padding:8px 14px;
}

.cat-parent-li > a.current{
  border:2px solid #8b3b89;
}

.album_dropdown__list a.current{
  border:2px solid #8b3b89;
  background:#8b3b89;
} */


/* taxonomyページでは子カテゴリを通常配置にする */

.tax-album-cat .album_dropdown__lists{
  position:relative;
  display:block;
  top:auto;
  left:auto;
  margin-top:10px;
  z-index:1;
}

/* .archive .album_dropdown__lists{
  position:absolute;
} */

.tax-album-cat .cat-parent-li{
  position:static;
}

/* .album-cat{
  display:block;
  overflow:hidden;
} */

.tax-album-cat .cat-parent-li{
  position:static;
}

.tax-album-cat .album_dropdown__lists{
  position:relative;
  top:auto;
  left:auto;
}

.archive_wrapper{
  position:relative;
}

.album-cat{
  position:relative;
  z-index:10;
}

.article_body{
  position:relative;
  z-index:1;
}

.archive_wrapper .album_dropdown__lists{
  z-index:20;
}

/* ===============================
   スマホ
================================ */

@media (max-width:768px){

.archive_wrapper .parent-list{
  flex-direction:column;
}

.archive_wrapper .album_dropdown__lists{
  position:static;
  border:none;
  display:block;
  padding-left:15px;
}

}

/* ーーーータブレットーーーーーーーーーーーーーーーーーー */
@media screen and (max-width: 1024px){
  .article_body {
    padding: 40px 0 100px;
    width: 100%;
  }

  .entry {
    width: 100%;
    padding: 20px;
  }

  .contents_body {
    gap: 48px 24px;
  }

}

/* ーーーースマホーーーーーーーーーーーーーーーーーーーー */
@media screen and (max-width: 520px) {
  .album-cat li {
    margin-right: 24px;
    font-size: 16px;
  }

  .article_body {
    padding: 32px 0px 40px;
    text-align: center;
  }

  .contents_body {
    display: block;
  }

  .entry {
    width: 90%;
  }

  .post_thumbnail img {
    width: 240px;
    height: 240px;
  }

  .page-count {
    font-size: 18px;
    margin: 40px;
  }

  .pagenation_area li {
    font-size: 18px;
  }
}
