@charset "utf-8";
/* CSS Document */


/* ---------------------------------------------------------------------------------------------

   Contents Slider

--------------------------------------------------------------------------------------------- */

  .l-inner {
    position: relative;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    max-width: 1200px;
    margin: 25px auto 0 auto;
    padding: 0 10rem;
	  z-index: 10;
  }

  [class*=swiper]:focus {
    outline: none;
  }

  .slide-media,
  .thumb-media {
    position: relative;
    overflow: hidden;
  }

  .slide-media img,
  .thumb-media img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }

  .card05 {
    overflow: hidden;
  }
  .card05 .swiper {
    overflow: visible;
  }
  .card05 .swiper-wrapper {
    -webkit-transition-timing-function: linear !important;
            transition-timing-function: linear !important;
  }
  .card05 .swiper-slide {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
  }
  .card05 .slide {
    overflow: hidden;
    width: 15rem;/*36rem*/
    border-radius: 5px;
    -webkit-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow);
  }
  .card05 .slide-media {
    padding-top: 100%;/*62.5%*/
  }
  .card05 .slide-media img {
    height: calc(100% + 16px);
    -webkit-transform: translateY(-16px);
            transform: translateY(-16px);
  }

  @media only screen and (max-width: 1000px) {
	  
    html {
      -webkit-text-size-adjust: 100%;
    }	
	  
    .l-inner {
      padding: 0 4rem;
    }
    .pc {
      display: none !important;
    }
  }

  @media only screen and (max-width: 600px) {

    .pc-tab {
      display: none !important;
    }
	  
    .card05 .slide {
      width: 10rem;/*24rem*/
    }
	  
  }

  @media only screen and (min-width: 1000px) {
	  
    .tab-sp {
      display: none !important;
    }
	  
    .card05 .slide {
      -webkit-transition: var(--transition);
      transition: var(--transition);
    }
	  
    .card05 .slide img {
      -webkit-transition: var(--transition);
      transition: var(--transition);
    }
	  
  }

  @media only screen and (min-width: 600px) {
	  
    .sp {
      display: none !important;
    }
	  
  }