@charset "UTF-8";
@font-face {
  font-family: 'Noto-B';
  src: url("/asset/font/NotoSansJP-Bold.eot");
  src: url("/asset/font/NotoSansJP-Bold.eot?iefix") format("eot"), url("/asset/font/NotoSansJP-Bold.woff") format("woff");
  font-display: swap;
}
@font-face {
  font-family: 'Noto-L';
  src: url("/asset/font/NotoSansJP-Light.eot");
  src: url("/asset/font/NotoSansJP-Light.eot?iefix") format("eot"), url("/asset/font/NotoSansJP-Light.woff") format("woff");
  font-display: swap;
}
@font-face {
  font-family: 'Noto-R';
  src: url("/asset/font/NotoSansJP-Regular.eot");
  src: url("/asset/font/NotoSansJP-Regular.eot?iefix") format("eot"), url("/asset/font/NotoSansJP-Regular.woff") format("woff");
  font-display: swap;
}
@font-face {
  font-family: 'Noto-M';
  src: url("/asset/font/NotoSansJP-Medium.eot");
  src: url("/asset/font/NotoSansJP-Medium.eot?iefix") format("eot"), url("/asset/font/NotoSansJP-Medium.woff") format("woff");
  font-display: swap;
}
@font-face {
  font-family: 'TexGyreHeros';
  src: url("../font/texgyreheros-regular.eot");
  src: url("../font/texgyreheros-regular.eot?iefix") format("eot"), url("../font/texgyreheros-regular.woff") format("woff");
  font-display: swap;
}
a {
  cursor: pointer;
}

@media only screen and (max-width: 767px) {
  .dn-sp {
    display: none !important;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .dn-tablet {
    display: none !important;
  }
}

@media only screen and (min-width: 1025px) {
  .dn-pc {
    display: none !important;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1024px), only screen and (min-width: 1025px) {
  .dn-tab_pc {
    display: none !important;
  }
}

.itemDetail_button {
  color: #000;
  display: block;
  text-align: center;
  border: 1px solid;
  border-radius: 50px;
  font-weight: 600;
  font-size: 20px;
  width: 260px;
  padding: 10px 0;
}
@media only screen and (min-width: 1025px), only screen and (min-width: 768px) and (max-width: 1024px) {
  .itemDetail_button {
    margin: 50px auto 120px;
  }
}
@media only screen and (max-width: 767px) {
  .itemDetail_button {
    font-size: 11px;
    width:38%;
    margin:10px
  }
}
@media only screen and (min-width: 1025px), only screen and (min-width: 768px) and (max-width: 1024px) {
 .flexbox{
  display:flex; 
  width:1287px;
  margin:auto;
}
}


@media only screen and (max-width: 767px) {
  .flexbox{
  display:flex; 
  flex-wrap:wrap;
  justify-content:center;
  margin:20px;
}
}

h1{
  text-align:center;
  font-weight: bold;
}