/* ----------------------- .category カテゴリー ----------------------- */

.category {
	width: 100%;
	max-width: 1720px;
	margin: auto;
}

.category_chapter {
	position: relative;
}
.category_chapter:not(:first-of-type) {
	margin-top: min(10vw,172px);
}
.category_image {
	width: 60.465%;
/*
	max-width: 1040px;
*/
	position: relative;
	overflow: hidden;
}

.category_chapter_L .category_image {
	margin-left:auto;
}
.category_chapter_R .category_image {
	margin-right: auto;
}

/* カテゴリータイトル）-----*/

.category_title {
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	/*width: 23.2558%;*/
	width: 30%;
	max-width: 400px;
}
.category_title a {
  width: 100%;
}
.category_chapter_L .category_title {
	left: 18.0%;
}

.category_chapter_R .category_title {
	right: 18.0%;
}
.category_title .k {
  border: 1px solid rgba(255,255,255,0.75);
	transition: 0.5s;
  position: absolute;
  top:50%;left: 50%;
  transform: translateX(-50%) translateY(-50%);
}
.category_title .k_l {width: 97%;height: 97%;}
.category_title .k_s {width: 94%;height: 94%;}

.category_title a:hover .k {
	transform:translateX(-50%) translateY(-50%) rotate(45deg) scale(1.15);
  opacity: 0.5;
}

/* ----- */

.category_image .ann {
  position: absolute;
  bottom: 5px;
  text-shadow: 0 0 5px #000;
}


.category_image .ann.ann_L {left: 5px;}
.category_image .ann.ann_R {right:5px;}



/* ================ SP ================ */
@media screen and (max-width: 767px) {
  .category_chapter {
    padding-top: 75vw;
  }
  .category_image {
    width: 95vw;
    max-width:none;
  }
  .category_chapter_L .category_title {
    left: 3vw;
  }

  .category_chapter_R .category_title {
    right: 3vw;
  }
  .category_title {
    width: 85%;
    top:0;
    transform: none;
  }
}



/* ================================ 横幅拡大対応 ================================ */
@media screen and (min-width: 1720px) {
  .category {
    max-width:none;
  }
  .category_image > img {
    width: 100%;
  }
  .category_title {
    width: 26%;
    max-width:none;
  }
  #top #c2.category_image {
    max-height: none!important;
  }
}






























