@charset "utf-8";

/* おもちゃ（toys） */
.toys_series{
}

.toys_series h2{
  margin: 0 auto;
}

.toys_series p{
  text-align: center;
  color:#fff;
}
@media screen and ( min-width:768px ) { /* PC ==================== */
  .toys_series p{
  font-size: min(1.7vw,30px);
}
}
@media screen and ( max-width:768px ) { /* SP  ==================== */
}

.main-text{
  color:#fff;
  font-weight: bold;
  text-align: center;
  text-shadow: 0 0 5px #000,0 0 5px #000,0 0 10px #000,0 0 10px #000,0 0 20px #000,0 0 20px #000;
}
@media screen and ( min-width:768px ) { /* PC ==================== */
  .main-text{
    font-size: 200%;
  }
}
@media screen and ( max-width:768px ) { /* SP  ==================== */
  .main-text{
    font-size: 120%;
  }
}

.toy-content-body{
  width:100%;
  background-image: url("../img/bg_content_body.png");
  background-size:100%;
  font-weight: bold;
  background-repeat: repeat-y;
  margin: 0 auto;
}
.toy-content-body p{
  width:80%;
  margin:0 auto;
  padding-top:20px;
}

.toy-content-body h3{
  width:88%;
  color:#fff;
  font-size: 150%;
  font-weight: bold;
  text-align: center;
  border-bottom:2px solid #fff;
  margin: 30px auto 0;
  padding:5px;
}

@media screen and ( min-width:768px ) { /* PC ==================== */
/* ITEM LIST ==================== */
.item-list-box{
  width:90%;
  margin:20px auto 0;
}
.item-list-box h5{
  clear:both;
  width:100%;
  margin:10px auto 5px;
  border-left:5px solid #de0000;
  text-indent:5px;
}

.item-list-box h5.farst_lineup{
  margin-top:0 !important;
}

.item-list-box .item-card-box,
.swiper-wrapper{
  width:98%;
  margin:0 auto;
}
.swiper-item-1column1{
  overflow: hidden;
}

.item-card{
  margin: 2px 2px;
  width: calc(20% - 4px);
  float: left;
}
.item-card:nth-child(4n+1){
  margin-right: 2px;
}
.item-card:nth-child(5n){
  float: left;
}

.item-list-box figure {
  position: relative;
  overflow: hidden;
  width: 100%;
}
.item-list-box figcaption {
  position: absolute;
  bottom: -22px;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 65px;
  background: rgba(0,0,0,.6);
  -webkit-transition: .3s;
  transition: .3s;
  display:block;
  padding:3px !important;
  line-height:1.2;
  color:#fff;
}
.item-list-box figure:hover figcaption {
  bottom: 0;
  color:#fff;
}
}
@media screen and ( max-width:767px ) { /* SP  ==================== */
/* ITEM LIST ==================== */
.item-list-box{
  width:90%;
  margin:0 auto;
}
.item-list-box h5{
  clear:both;
  width:100%;
  margin:10px auto 5px;
  border-left:5px solid #de0000;
  text-indent:5px;
}
.item-list-box h5.farst_lineup{
  margin-top:0 !important;
}


.item-list-box .item-card-box,
.swiper-wrapper{
  width:98%;
  margin:0 auto;
}
.swiper-item-1column1{
  overflow: hidden;
}

.item-card{
  margin: 2px 2px;
  width: calc(50% - 4px);
  float: left;
}
.item-card:nth-child(2n+1){
  margin-right: 2px;
}
.item-card:nth-child(2n){
  float: right;
}


.item-lineup{
  margin:0 auto;
}
.item-lineup div{
  float:left;
  margin:0;
}
@media only screen and (orientation : portrait) { /*縦向きの際に適用*/
.item-lineup{
  width:316px;
}
.item-lineup div{
  width:158px !important;
}
}
@media only screen and (orientation : landscape) { /*横向きの際に適用*/
.item-lineup{
  width:560px;
}
.item-lineup div{
  width:140px !important;
}
}
@media only screen and (orientation : portrait) { /*縦向きの際に適用*/
.swiper-item-1column1,
.swiper-item-1column2,
.swiper-item-1column3,
.swiper-item-2column{
  width:318px;
  margin:0 auto;
  overflow:hidden;
}
.item-list-box .swiper-wrapper div{
  width:157px !important;
}
}
@media only screen and (orientation : landscape) { /*横向きの際に適用*/
.swiper-item-1column1,
.swiper-item-1column2,
.swiper-item-1column3,
.swiper-item-2column{
  width:564px;
  margin:0 auto;
  overflow:hidden;
}
.item-list-box .swiper-wrapper div{
  width:141px !important;
}
}
.item-list-box .swiper-wrapper div a{
  z-index:9998;
}
.item-list-box figure {
  position: relative;
  overflow: hidden;
  width: 100%;
}
.item-list-box figcaption {
  position: absolute;
  bottom: -20px;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 63px;
  background: rgba(0,0,0,.6);
  -webkit-transition: .3s;
  transition: .3s;
  display:block;
  padding:3px !important;
  line-height:1.2;
  color:#fff;
}
.item-list-box figure:hover figcaption {
  bottom: 0;
  color:#fff;
}
}

.movie{
  width:80%;
  margin:0 auto;
}
.movie iframe{
  width:100%;
  aspect-ratio: 16 / 9;
}