@charset "UTF-8";
html {
  font-size: 62.5%;
  /*標準サイズ*/ }

:root {
  --vh: 1vh; }

body {
  color: #333;
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  -webkit-text-size-adjust: 100%;
  font-weight: 500;
  height: 100%; }

img {
  vertical-align: bottom; }

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

	表示非表示 
	
-------------------------------	*/
@media screen and (min-width: 1001px) {
  .sp {
    display: none !important; } }

@media screen and (max-width: 1000px) {
  .pc {
    display: none !important; } }

#floatNav {
  z-index: 1000; }

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

	contents
	
-------------------------------	*/
.main {
  margin: 0 auto; }
  .main .kv {
    max-width: 1000px;
    margin: 0 auto;
    margin-bottom: 3rem; }
    @media screen and (max-width: 1000px) {
      .main .kv {
        margin-bottom: 1rem; } }
    .main .kv img {
      width: 100%; }
  .main .mv {
    position: relative;
    max-width: 1000px;
    height: 0;
    padding-bottom: 561.5px;
    margin: 0 auto;
    margin-bottom: 8rem; }
    @media screen and (max-width: 1000px) {
      .main .mv {
        width: 100%;
        height: 0;
        padding-bottom: 56.25%;
        overflow: hidden;
        margin-bottom: 50px; } }
    .main .mv #player {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0; }
  .main .about {
    max-width: 700px;
    margin: 0 auto;
    margin-bottom: 3rem; }
    .main .about img {
      width: 100%; }
  .main .copy__inner {
    text-align: left;
    max-width: 850px;
    margin: 0 auto; }
    @media screen and (max-width: 1000px) {
      .main .copy__inner {
        width: 94%; } }
    .main .copy__inner .main-copy {
      font-size: 2.8rem;
      font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
      font-weight: bold;
      line-height: 5rem;
      margin-bottom: 4rem;
      border-bottom: 2px solid #737373; }
      @media screen and (max-width: 1000px) {
        .main .copy__inner .main-copy {
          font-size: 2rem;
          line-height: 2.8rem;
          margin-bottom: 2rem; } }
    .main .copy__inner .products {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      margin-bottom: 2rem; }
      @media screen and (max-width: 1000px) {
        .main .copy__inner .products {
          margin-bottom: 10px; } }
      .main .copy__inner .products__list {
        width: 29%;
        margin-bottom: 5rem; }
        @media screen and (max-width: 1000px) {
          .main .copy__inner .products__list {
            width: 48.5%;
            margin-bottom: 3rem; } }
        .main .copy__inner .products__list img {
          width: 100%; }
        .main .copy__inner .products__list__name {
          margin-top: 1.5rem;
          font-size: 1.2rem; }
        .main .copy__inner .products__list__price {
          margin-top: 2.5rem;
          font-size: 1.4rem;
          font-weight: bold; }
          @media screen and (max-width: 1000px) {
            .main .copy__inner .products__list__price {
              margin-top: 1.8rem; } }
          .main .copy__inner .products__list__price span {
            font-size: 1.2rem; }

a {
  opacity: 1;
  transition: 0.3s; }

a:hover {
  opacity: 0.6;
  transition: 0.3s; }