@charset "UTF-8";
/*---------------------------------

	Wrap

---------------------------------*/
html, body, article {
  height: 100%; }

html {
  font-size: 62.5%;
  font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }

body {
  font-size: 20px;
  line-height: 1.6;
  background-color: #000;
  -webkit-text-size-adjust: 100%;
  width: 100%;
  height: 100%; }
  @media (min-width: 1001px) {
    body {
      display: -webkit-flex;
      display: flex;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-align-items: center;
      align-items: center; } }
  @media (min-width: 751px) and (max-width: 1000px) {
    body {
      display: -webkit-flex;
      display: flex;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-align-items: center;
      align-items: center;
      font-size: 2vw; } }
  @media (max-width: 750px) {
    body {
      font-size: 2.5333333333vw; } }

article {
  width: 100%;
  height: auto; }

.wrap {
  width: 100%;
  position: relative;
  background: url("../img/pc/bg_img.png") no-repeat center center;
  display: block; }
  @media (min-width: 751px) and (max-width: 1000px) {
    .wrap {
      background: url("../img/pc/bg_img.png") no-repeat center -3% center -3%;
      background-size: cover; } }
  @media (max-width: 750px) {
    .wrap {
      background: url("../img/mobile/bg_img.png") no-repeat top center;
      background-size: cover; } }

.wrap_inner {
  width: 100%;
  margin: 0 auto;
  text-align: center; }
  @media (min-width: 1001px) {
    .wrap_inner {
      width: 1000px; } }
  .wrap_inner img {
    width: 100%; }

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

	Headder

---------------------------------*/
header {
  text-align: right; }

ul.logo_list {
  width: auto;
  padding: 0.6% 0 0 0;
  overflow: hidden; }

.logo_list li {
  width: 5.6%;
  margin: 2.6% 0 0 0;
  height: 153.5714285714%;
  float: right;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center;
  vertical-align: middle; }
  .logo_list li:first-child {
    width: 26%;
    margin: 0 0 0 0.8%; }
  @media (max-width: 750px) {
    .logo_list li {
      width: 13.0666666667%;
      margin: 3.4666666667% 0 0 0; }
      .logo_list li:first-child {
        width: 48%;
        margin: 0 0 0 1.0666666667%; } }

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

	Coontents

---------------------------------*/
.text_area {
  width: 100%;
  height: 18%;
  margin: 18.6% 0 0 0;
  background: -moz-linear-gradient(rgba(0, 0, 0, 0) 0 25%, #000 50% 100%);
  background: -webkit-linear-gradient(rgba(0, 0, 0, 0) 0 25%, #000 50% 100%);
  background: linear-gradient(rgba(0, 0, 0, 0) 0 25%, #000 50% 100%); }
  .text_area .wrap_inner {
    text-align: left;
    position: relative; }
    @media (min-width: 751px) and (max-width: 1000px) {
      .text_area .wrap_inner {
        overflow: hidden; } }
  .text_area h2 {
    width: 58.4%;
    font-size: 0;
    margin: 0 0 0 2.8%;
    padding: 1.4% 0 0 0; }
  @media (min-width: 1001px) {
    .text_area {
      margin: 186px 0 0 0; } }
  @media (max-width: 750px) {
    .text_area {
      height: 34.6666666667%;
      margin: 73.8666666667% 0 0 0; }
      .text_area h2 {
        width: 77.8666666667%;
        font-size: 0;
        margin: 0 0 0 2.4%;
        padding: 6.4% 0 0 0; } }

.text {
  width: 53.2%;
  margin: 1.6% 0 0 2.8%;
  padding: 0 0 1% 0;
  color: #fff; }
  @media (max-width: 750px) {
    .text {
      width: 70.9333333333%;
      margin: 2.4% 0 0 2.6666666667%;
      padding: 0 0 8.8% 0; } }

.store_bun {
  width: 23.6%;
  padding: 7.6% 0 0 0;
  position: absolute;
  top: 46.6666666667%;
  right: 1.8%;
  background: url("../img/pc/bun_Induction.png") top center no-repeat;
  background-size: contain; }
  @media (max-width: 750px) {
    .store_bun {
      width: 66.6666666667%;
      padding: 6.4% 0 0 0;
      top: 77.6923076923%;
      left: 2.6666666667%;
      background: url("../img/mobile/bun_Induction.png") top center no-repeat;
      background-size: contain; } }

.dl_link_bun {
  width: 24%;
  padding: 4% 0 0 0;
  position: absolute;
  top: 50%;
  right: -1%;
  background: url("../img/pc/btn_dl_off.png") top center no-repeat;
  background-size: contain; }
  .dl_link_bun:hover {
    background: url("../img/pc/btn_dl_on.png") top center no-repeat;
    background-size: contain; }
  .dl_link_bun a {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0; }
  @media (max-width: 750px) {
    .dl_link_bun {
      width: 26.6666666667%;
      padding: 6.4% 0 0 0;
      top: 72.3076923077%;
      right: 0%;
      background: url("../img/mobile/btn_dl_off.png") top center no-repeat;
      background-size: contain; }
      .dl_link_bun:hover {
        background: url("../img/mobile/btn_dl_on.png") top center no-repeat;
        background-size: contain; } }

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

	Footer

---------------------------------*/
footer .wrap_fotter {
  width: 100%;
  height: 15%;
  background: url("../img/pc/bg_line.png") repeat-y center center;
  background-color: #000; }
  @media (min-width: 751px) and (max-width: 1000px) {
    footer .wrap_fotter {
      background: url("../img/pc/bg_line.png") no-repeat center -3% center -3%;
      background-size: cover; } }
  @media (max-width: 750px) {
    footer .wrap_fotter {
      background-image: none;
      background-color: #898989;
      height: 39.4666666667% 0 0 0; } }

ul.link_list {
  width: 100%;
  text-align: center;
  padding: 1.2% 0 0 0;
  overflow: hidden;
  font-size: 0; }
  @media (max-width: 750px) {
    ul.link_list {
      display: flex;
      flex-wrap: wrap; } }

.link_list li {
  width: 19.6%;
  height: 30.612244898%;
  margin: 0 2.4% 0 0;
  display: inline-block; }
  .link_list li:last-child {
    width: 28.4%;
    height: 28.1690140845%;
    margin: 0; }
  .link_list li a {
    background-color: #ffffff;
    display: block; }
    .link_list li a:hover img {
      cursor: pointer;
      filter: alpha(opacity=60);
      -ms-filter: "alpha(opacity=60)";
      -moz-opacity: 0.6;
      -khtml-opacity: 0.6;
      opacity: 0.6;
      zoom: 1; }
  .link_list li .pc {
    display: block !important; }
  .link_list li .sp {
    display: none !important; }
  @media (max-width: 750px) {
    .link_list li {
      flex-direction: column;
      width: 30.1333333333%;
      margin: 0 0 0 2.1333333333%; }
      .link_list li:first-child {
        order: 2;
        margin: 0 0 0 2.6666666667%; }
      .link_list li:nth-child(2) {
        order: 3; }
      .link_list li:nth-child(3) {
        order: 4; }
      .link_list li:last-child {
        order: 1;
        width: 94.6666666667%;
        margin: 2.6666666667% 2.4%; }
      .link_list li .pc {
        display: none !important; }
      .link_list li .sp {
        display: block !important; } }

.copy {
  width: 100%;
  margin: 1.2% auto 0 auto;
  color: #cacaca;
  border-top: #444 2px solid;
  border-image: linear-gradient(to right, rgba(202, 202, 202, 0) 0, #cacaca 18% 82%, rgba(202, 202, 202, 0));
  border-image-slice: 1;
  padding: 0.4% 0;
  font-size: 12px; }
  .copy .br-sp {
    display: none; }
  @media (min-width: 751px) and (max-width: 1000px) {
    .copy {
      font-size: 1.2vw; } }
  @media (max-width: 750px) {
    .copy {
      font-size: 2.4vw;
      margin: 2.6666666667% auto 0 auto;
      padding: 1.3333333333% 0; }
      .copy .br-sp {
        display: block; } }
