@import url(https://fonts.googleapis.com/earlyaccess/sawarabimincho.css);
body {
  margin: 0;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI","Noto Sans Japanese","Hiragino Sans", Meiryo, sans-serif; }

img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom; }

.bg {
  position: fixed;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: -9999; }
  .bg video {
    width: 100%;
    vertical-align: bottom; }

.wrap {
  position: relative; }
  @media only screen and (max-width: 767px) {
    .wrap {
      margin: 50px 0; } }
  @media only screen and (min-width: 768px) {
    .wrap {
      margin: 100px auto; } }

.container {
  margin: 0 auto; }
  @media only screen and (min-width: 768px) {
    .container {
      max-width: 950px;
      width: calc(100% - 45px); } }

.content {
  background: #c3c3c3;
  border: #000 solid 4px;
  position: relative;
  background-image: url("../img/content-bg.png");
  background-repeat: repeat; }
  @media only screen and (max-width: 767px) {
    .content {
      margin: 0 auto;
      max-width: 320px; } }
  @media only screen and (min-width: 768px) {
    .content {
      margin: 0 auto;
      width: 100%; } }
  .content::before {
    content: "";
    background: #c3c3c3;
    height: calc(100% + 22px);
    border: #000 solid 9px;
    position: absolute;
    z-index: -1;
    top: -20px;
    left: -20px;
    background-image: url("../img/content-bg.png");
    background-repeat: repeat; }
    @media only screen and (max-width: 767px) {
      .content::before {
        width: calc(100% + 22px); } }
    @media only screen and (min-width: 768px) {
      .content::before {
        width: calc(100% + 22px); } }
  @media only screen and (max-width: 767px) {
    .content::after {
      display: none; } }
  @media only screen and (min-width: 768px) {
    .content::after {
      content: "";
      width: calc(100% + 55px);
      height: calc(100% + 55px);
      background: #c3c3c3;
      border: #000 solid 4px;
      position: absolute;
      z-index: -2;
      top: -32px;
      left: -32px;
      background-image: url("../img/content-bg.png");
      background-repeat: repeat; } }
  .content .hero {
    background-repeat: repeat-x;
    background-position: top center;
    margin: auto;
    z-index: 99; }
    @media only screen and (max-width: 767px) {
      .content .hero {
        background-image: url("../img/ttl-bg-sp.png?201115");
        max-width: 357px;
        height: 155px;
        top: -16px; } }
    @media only screen and (min-width: 768px) {
      .content .hero {
        background-image: url("../img/ttl-bg.png?201115");
        max-width: 1013px;
        height: 368px; } }
    .content .hero h1 {
      text-align: center;
      margin: 0; }
      @media only screen and (max-width: 767px) {
        .content .hero h1 {
          padding: 30px 20px 0; } }
      @media only screen and (min-width: 768px) {
        .content .hero h1 {
          padding: 70px 30px 0; } }
  .content__intro {
    position: relative;
    z-index: 99;
    text-align: center; }
    @media only screen and (max-width: 767px) {
      .content__intro {
        padding: 0 15px;
        margin: 30px 0 45px; } }
    @media only screen and (min-width: 768px) {
      .content__intro {
        font-size: 1.3rem;
        line-height: 2.7rem;
        margin: 30px 0 60px; } }
    @media only screen and (max-width: 767px) {
      .content__intro-ttl {
        margin: 0 0 25px; } }
    @media only screen and (min-width: 768px) {
      .content__intro-ttl {
        margin: 0 0 40px; } }
    @media only screen and (max-width: 767px) {
      .content__intro-ttl img {
        width: 260px; } }
    .content__intro p {
      font-family: 'Sawarabi Mincho';
      margin: 0;
      padding: 0;
      letter-spacing: 0.2em; }
      @media only screen and (max-width: 767px) {
        .content__intro p {
          line-height: 1.8rem; } }
  .content__catch {
    background: #000;
    text-align: center; }
    @media only screen and (max-width: 767px) {
      .content__catch {
        margin: 0 0 50px;
        padding: 15px 0; } }
    @media only screen and (min-width: 768px) {
      .content__catch {
        margin: 0 0 60px;
        padding: 10px 0; } }
    @media only screen and (max-width: 767px) {
      .content__catch img {
        width: 260px; } }
  @media only screen and (max-width: 767px) {
    .content__prod {
      padding: 0 15px; } }
  @media only screen and (min-width: 768px) {
    .content__prod {
      max-width: 800px;
      width: calc(100% - 35px);
      margin: 0 auto 50px; } }
  .content__prod-pic {
    background: #f1f1f1;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative; }
    @media only screen and (max-width: 767px) {
      .content__prod-pic {
        margin: 0 0 25px;
        padding: 40px 10px; } }
    @media only screen and (min-width: 768px) {
      .content__prod-pic {
        padding: 70px 15px;
        width: 100%; } }
    .content__prod-pic .kakudai {
      position: absolute; }
      @media only screen and (max-width: 767px) {
        .content__prod-pic .kakudai {
          bottom: 10px;
          right: 10px; } }
      @media only screen and (min-width: 768px) {
        .content__prod-pic .kakudai {
          bottom: 20px;
          right: 20px; } }
    .content__prod-pic span {
      position: absolute; }
      @media only screen and (max-width: 767px) {
        .content__prod-pic span {
          bottom: 0;
          left: 32%; } }
      @media only screen and (min-width: 768px) {
        .content__prod-pic span {
          bottom: 10px;
          left: 43%; } }
  .content__prod-txt {
    font-family: 'Sawarabi Mincho'; }
    @media only screen and (max-width: 767px) {
      .content__prod-txt {
        margin-bottom: 40px; } }
    @media only screen and (min-width: 768px) {
      .content__prod-txt {
        margin-top: 35px;
        align-self: center; } }
    .content__prod-txt p {
      padding: 0; }
      @media only screen and (max-width: 767px) {
        .content__prod-txt p {
          font-size: 1.0rem;
          margin: 0 0 20px; } }
      @media only screen and (min-width: 768px) {
        .content__prod-txt p {
          font-size: 1.2rem;
          line-height: 2.3rem;
          margin: 0 0 30px;
          text-align: center; } }
  .content__prod-ttl {
    text-align: center; }
    @media only screen and (max-width: 767px) {
      .content__prod-ttl {
        margin: 0 0 15px; } }
    @media only screen and (min-width: 768px) {
      .content__prod-ttl {
        margin: 0 0 15px; } }
    @media only screen and (max-width: 767px) {
      .content__prod-ttl img {
        width: 210px; } }
  .content__prod-price {
    font-weight: 900;
    letter-spacing: 0.05em;
    line-height: 100%;
    text-align: center; }
    @media only screen and (max-width: 767px) {
      .content__prod-price {
        font-size: 1.4rem;
        margin: 0 0 10px; } }
    @media only screen and (min-width: 768px) {
      .content__prod-price {
        font-size: 2.1rem;
        margin: 0 0 10px; } }
  .content__prod p {
    position: relative;
    font-family: 'Sawarabi Mincho';
    text-align: center;
    margin: 0;
    padding: 0; }
    @media only screen and (max-width: 767px) {
      .content__prod p {
        font-size: 1.0rem;
        line-height: 1.7rem; } }
    @media only screen and (min-width: 768px) {
      .content__prod p {
        font-size: 1.1rem;
        line-height: 2.0rem; } }
  .content__prod-gentei {
    text-align: center; }
    @media only screen and (max-width: 767px) {
      .content__prod-gentei {
        margin: 10px 0 0; } }
    @media only screen and (min-width: 768px) {
      .content__prod-gentei {
        margin: 15px 0 0; } }
    @media only screen and (max-width: 767px) {
      .content__prod-gentei img {
        width: 200px; } }
  @media only screen and (max-width: 767px) {
    .content__toujitsu {
      margin: 0 0 35px;
      padding: 0 15px; } }
  @media only screen and (min-width: 768px) {
    .content__toujitsu {
      max-width: 800px;
      width: calc(100% - 35px);
      margin: 0 auto 50px;
      display: flex; } }
  @media only screen and (max-width: 767px) {
    .content__toujitsu-pic {
      width: 100%;
      margin: 0 0 30px;
      text-align: center; } }
  @media only screen and (min-width: 768px) {
    .content__toujitsu-pic {
      width: 200px; } }
  @media only screen and (max-width: 767px) {
    .content__toujitsu-pic img {
      width: 70%; } }
  .content__toujitsu-twitter {
    font-family: 'Sawarabi Mincho';
    text-align: left;
    margin: 15px 0 0; }
    @media only screen and (max-width: 767px) {
      .content__toujitsu-twitter span {
        font-size: 1.0rem;
        line-height: 1.8rem; } }
    @media only screen and (min-width: 768px) {
      .content__toujitsu-twitter span {
        font-size: 0.9rem; } }
    .content__toujitsu-twitter span::before {
      content: "";
      display: inline-block;
      background-image: url("../img/icon-twitter.png");
      width: 15px;
      height: 12px;
      margin-right: 3px; }
    .content__toujitsu-twitter a {
      color: #000; }
      @media only screen and (max-width: 767px) {
        .content__toujitsu-twitter a {
          font-size: 1.0rem;
          line-height: 1.8rem; } }
      @media only screen and (min-width: 768px) {
        .content__toujitsu-twitter a {
          font-size: 0.85rem; } }
      .content__toujitsu-twitter a:hover {
        text-decoration: none; }
  .content__toujitsu-text {
    box-sizing: border-box; }
    @media only screen and (max-width: 767px) {
      .content__toujitsu-text {
        width: 100%; } }
    @media only screen and (min-width: 768px) {
      .content__toujitsu-text {
        width: calc(100% - 200px);
        padding-left: 45px;
        align-self: center; } }
    .content__toujitsu-text p {
      position: relative;
      font-family: 'Sawarabi Mincho';
      margin: 0;
      padding: 0; }
      @media only screen and (max-width: 767px) {
        .content__toujitsu-text p {
          font-size: 1.0rem;
          line-height: 1.8rem; } }
      @media only screen and (min-width: 768px) {
        .content__toujitsu-text p {
          font-size: 1.3rem;
          line-height: 2.4rem; } }
  @media only screen and (max-width: 767px) {
    .content__toujitsu-ttl {
      margin: 0 0 10px; } }
  @media only screen and (min-width: 768px) {
    .content__toujitsu-ttl {
      margin: 0 0 20px; } }
  @media only screen and (max-width: 767px) {
    .content__sale {
      margin: 0 0 40px;
      padding: 0 15px; } }
  @media only screen and (min-width: 768px) {
    .content__sale {
      max-width: 800px;
      width: calc(100% - 35px);
      margin: 0 auto 50px; } }
  .content__sale-ttl {
    font-family: 'Noto Serif JP', serif; }
    @media only screen and (max-width: 767px) {
      .content__sale-ttl {
        font-size: 1.3rem;
        margin: 0 0 10px; } }
    @media only screen and (min-width: 768px) {
      .content__sale-ttl {
        font-size: 1.5em;
        margin: 0 0 20px; } }
    @media only screen and (max-width: 767px) {
      .content__sale-ttl img {
        width: 110px; } }
  .content__sale p {
    font-family: 'Sawarabi Mincho';
    margin: 0;
    padding: 0; }
    @media only screen and (max-width: 767px) {
      .content__sale p {
        font-size: 0.95rem;
        line-height: 1.7rem; } }
    @media only screen and (min-width: 768px) {
      .content__sale p {
        font-size: 1.0rem;
        line-height: 1.85rem; } }
    .content__sale p a {
      color: #000;
      word-break: break-all; }
      .content__sale p a:hover {
        text-decoration: none; }
  @media only screen and (max-width: 767px) {
    .content__order {
      margin: 0 0 50px;
      padding: 0 15px; } }
  @media only screen and (min-width: 768px) {
    .content__order {
      max-width: 800px;
      width: calc(100% - 35px);
      margin: 0 auto 60px; } }
  .content__order-link {
    font-family: 'Sawarabi Mincho';
    background: #000;
    text-align: center;
    margin: 30px auto 0;
    max-width: 100%;
    letter-spacing: 0.03em; }
    @media only screen and (max-width: 767px) {
      .content__order-link {
        height: 50px;
        line-height: 50px; } }
    @media only screen and (min-width: 768px) {
      .content__order-link {
        height: 60px;
        line-height: 60px;
        cursor: pointer; } }
    .content__order-link:hover {
      opacity: 0.8; }
    .content__order-link a {
      color: #fff;
      text-decoration: none;
      display: block;
      width: 100%; }
      @media only screen and (max-width: 767px) {
        .content__order-link a {
          font-size: 1.03rem; } }
      @media only screen and (min-width: 768px) {
        .content__order-link a {
          font-size: 1.2rem; } }
      .content__order-link a::before {
        font-family: "Font Awesome 5 Free";
        content: "\f07a";
        font-size: 1.1rem;
        font-weight: 900;
        color: #fff;
        margin-right: 10px;
        position: relative;
        z-index: -2px; }
        @media only screen and (max-width: 767px) {
          .content__order-link a::before {
            font-size: 0.95rem; } }
        @media only screen and (min-width: 768px) {
          .content__order-link a::before {
            font-size: 1.1rem; } }
  .content__order p {
    font-family: 'Sawarabi Mincho';
    margin: 10px 0 0;
    padding: 0; }
    @media only screen and (max-width: 767px) {
      .content__order p {
        font-size: 0.95rem;
        line-height: 1.7rem; } }
    @media only screen and (min-width: 768px) {
      .content__order p {
        font-size: 1.0rem;
        line-height: 1.7rem; } }

.modal_inner {
  display: none; }

@media only screen and (max-width: 767px) {
  .modaal-container {
    max-width: 340px !important; } }
@media only screen and (min-width: 768px) {
  .modaal-container {
    max-width: 900px !important; } }

.modaal-content-container {
  text-align: center;
  padding: 0 !important; }

.modaal-close:focus:before,
.modaal-close:focus:after,
.modaal-close:hover:before,
.modaal-close:hover:after {
  background: #af110bs !important; }

@media only screen and (min-width: 768px) {
  .sponly {
    display: none; } }

@media only screen and (max-width: 767px) {
  .pconly {
    display: none; } }

.global_head {
  margin: 0;
  padding: 0; }
