@charset "UTF-8";
/*- ========= Parts Style ========= -*/
/*- = Category navi = -*/
.category-block{
  margin-top: -32px;
  margin-bottom: 20px;
  z-index: 20; }
.category-block h2.theme-title{
  width: 225px;
  height: 32px;
  text-align: center;
  font-size: 1.4rem;
  line-height: 2.2;
  color: #fff;
  padding: 0 3em;
  background-color: #BD143F; }
@media screen and (max-width: 736px) {
  .category-block h2.theme-title{
    width: 32%;
    line-height: 2.5;
    padding: 0 0.3em; }}
.category-block2{
  position: fixed;
  width: 100%;
  top:0;
  background-color: #fff;
  border-bottom: 1px solid #ccc;
  margin-top: 60px;
  z-index: 10; }
/* 追加 */
@media screen and (max-width: 736px) {
  .category-block2{
    margin-top: 52px;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2); }}
.category-inner-article{
  margin: 0 auto;
  border-top: 1px solid #eee; }
@media screen and (max-width: 736px) {
  .category-inner, .category-inner-article{
    overflow-y: hidden;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    /*overflow-scrolling: touch;*/ }}
.category-nav{
  max-width: 1050px;
  margin: 0 auto;
  padding-bottom: 0.5em;
  text-align: center;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1.2;
  margin-bottom: 1em; }
.category-block2 .category-nav{
  padding-bottom: 0.3em;
  margin-bottom: 0; } /*追加*/
@media screen and (max-width: 1024px) {
.category-nav{
  width: 960px; }}
.category-nav li{
  position: relative;
  width: -webkit-calc(99% / 9);
  width: calc(99% / 9); }
.category-nav li a{
  display: block;
  color: #C3C3C3;
  padding-top: 5em;
  padding-bottom: 0.2em;
  background: url("/assets/img/theme-icon-1.svg") no-repeat center 1.2rem; }
.category-nav li a::after {
  position: absolute;
  bottom: -4px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #BB1440;
  transform: scale(0, 1);
  transform-origin: center top;
  transition: transform .3s; }
/* 追加 */
@media screen and (max-width: 736px) {
  .category-nav li{
    height: 65px; }
  .category-nav li a{
    padding-top: 3.2em;
    background-size: 28%; }}
@media screen and (max-width: 414px) {
  .category-nav li a{
    padding-top: 3.5em; }}
.category-nav li a:hover::after {
  transform: scale(1, 1); }
.category-nav li:nth-child(2) a{
  background-image: url("/assets/img/theme-icon-2.svg"); }
.category-nav li:nth-child(2) a::after{
  background: #D94D2E; }
.category-nav li:nth-child(3) a{
  background-image: url("/assets/img/theme-icon-3.svg"); }
.category-nav li:nth-child(3) a::after{
  background: #248F8F; }
.category-nav li:nth-child(4) a{
  background-image: url("/assets/img/theme-icon-4.svg"); }
.category-nav li:nth-child(4) a::after{
  background: #1492B8; }
.category-nav li:nth-child(5) a{
  background-image: url("/assets/img/theme-icon-5.svg"); }
.category-nav li:nth-child(5) a::after{
  background: #C8326E; }
.category-nav li:nth-child(6) a{
  background-image: url("/assets/img/theme-icon-6.svg"); }
.category-nav li:nth-child(6) a::after{
  background: #688907; }
.category-nav li:nth-child(7) a{
  background-image: url("/assets/img/theme-icon-7.svg"); }
.category-nav li:nth-child(7) a::after{
  background: #34548F; }
.category-nav li:nth-child(8) a{
  background-image: url("/assets/img/theme-icon-8.svg"); }
.category-nav li:nth-child(8) a::after{
  background: #5F409D; }
.category-nav li:nth-child(9) a{
  background-image: url("/assets/img/theme-icon-9.svg"); }
.category-nav li:nth-child(9) a::after{
  background: #FC0099; }
.category-nav li.active a{
  color: inherit;
  background-image: url("/assets/img/theme-icon-1-2.svg"); }
.category-nav li a:hover{
  color: #222;
  background-image: url("/assets/img/theme-icon-1-2.svg"); }
.category-nav li:nth-child(2) a:hover, .category-nav li:nth-child(2).active a{
  background-image: url("/assets/img/theme-icon-2-2.svg"); }
.category-nav li:nth-child(3) a:hover, .category-nav li:nth-child(3).active a{
  background-image: url("/assets/img/theme-icon-3-2.svg"); }
.category-nav li:nth-child(4) a:hover, .category-nav li:nth-child(4).active a{
  background-image: url("/assets/img/theme-icon-4-2.svg"); }
.category-nav li:nth-child(5) a:hover, .category-nav li:nth-child(5).active a{
  background-image: url("/assets/img/theme-icon-5-2.svg"); }
.category-nav li:nth-child(6) a:hover, .category-nav li:nth-child(6).active a{
  background-image: url("/assets/img/theme-icon-6-2.svg"); }
.category-nav li:nth-child(7) a:hover, .category-nav li:nth-child(7).active a{
  background-image: url("/assets/img/theme-icon-7-2.svg"); }
.category-nav li:nth-child(8) a:hover, .category-nav li:nth-child(8).active a{
  background-image: url("/assets/img/theme-icon-8-2.svg"); }
.category-nav li:nth-child(9) a:hover, .category-nav li:nth-child(9).active a{
  background-image: url("/assets/img/theme-icon-9-2.svg"); }
.category-nav li.active:after {
  border: 8px solid transparent;
  border-top-color: #BB1440;
  border-bottom-width: 0;
  bottom: -10px;
  content: "";
  display: block;
  left: 44%;
  position: absolute;
  width: 0; }
.category-nav li:nth-child(2).active:after{
  border-top-color: #D94D2E; }
.category-nav li:nth-child(3).active:after{
  border-top-color: #248F8F; }
.category-nav li:nth-child(4).active:after{
  border-top-color: #1492B8; }
.category-nav li:nth-child(5).active:after{
  border-top-color: #C8326E; }
.category-nav li:nth-child(6).active:after{
  border-top-color: #688907; }
.category-nav li:nth-child(7).active:after{
  border-top-color: #34548F; }
.category-nav li:nth-child(8).active:after{
  border-top-color: #5F409D; }
.category-nav li:nth-child(9).active:after{
  border-top-color: #FC0099; }