/* hidden */
@media screen and (max-width: 767px) {
  .sp_hidden {
    display: none !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
  .tb_hidden {
    display: none !important;
  }
}

@media screen and (min-width: 1024px) {
  .pc_hidden {
    display: none !important;
  }
}

/* sectionFlex */
.sectionFlex {
  margin-bottom: 2rem;
}

.sectionFlex.bottom0 {
  margin-bottom: 0;
}

/* tablet, landscape iPad, lo-res laptops ands desktops */
@media (max-width:961px)  {
    .table-scroll .normalTable2 td {
        white-space: nowrap;
        -webkit-text-size-adjust: none;
    }
}

@media screen and (max-width: 767px) {
  .sectionFlex > * {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
  }
  .sectionFlex h2 {
    text-align: center;
  }
  .sectionFlex h2 img {
    margin-left: auto;
    margin-right: auto;
  }
  .sectionFlex table {
    width: 100%;
  }
  .table-scroll .normalTable2 td {
    white-space: nowrap;
    -webkit-text-size-adjust: none;
  }
}

@media screen and (min-width: 768px) {
  .sectionFlex {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-left: -0.5rem;
    margin-right: -0.5rem;
    /* columns */
  }
  .sectionFlex > * {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
  .sectionFlex.column50-50 .leftBlock, .sectionFlex.column50-50 .rightBlock {
    width: 50%;
  }
  .sectionFlex.column40-60 .leftBlock {
    width: 40%;
  }
  .sectionFlex.column40-60 .rightBlock {
    width: 60%;
  }
  .sectionFlex.column3 > * {
    width: calc(100% / 3);
  }
  .sectionFlex table {
    width: 100%;
  }
}

@media screen and (min-width: 768px) {
  .sectionFlex.AlignC {
    align-items: center;
  }
}

@media screen and (max-width: 767px) {
  .sectionFlex.AlignC {
    text-align: center;
  }
}

@media screen and (min-width: 768px) {
  .sectionFlex.JustifyC {
    justify-content: center;
  }
}

@media screen and (min-width: 768px) {
  .sectionFlex.JustifyA {
    justify-content: space-around;
  }
}

.sectionFlexFIX {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* common */
.bottom_2rem {
  margin-bottom: 2rem;
}

.center {
  text-align: center;
}

.right {
  text-align: right;
}

.title_line01 {
  margin-top: 2rem;
  margin-left: 0;
}

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

table + table {
  margin-top: 1rem;
}

.price {
  font-size: 15px;
  font-weight: bold;
  line-height: 20px;
  text-align: right;
  vertical-align: top;
  white-space: nowrap;
}

.price .yen {
  font-size: 22px;
  line-height: 21px;
}

.f15red {
    color: #f40606;
    font-weight: normal;
}

/* layout */
body {
  font-size: 14px;
  margin: 0.5rem;
  line-height: 1.5em;
}

#out,
#container {
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

@media screen and (min-width: 1024px) {
  #out,
  #container {
    width: 100%;
    max-width: 980px;
  }
}

#contents,
#header,
#search,
#footer {
  width: auto;
  height: auto;
  padding: 0;
}

/* table */
@media screen and (max-width: 767px) {
  table {
    width: 100% !important;
  }
  /* fold */
  table.fold {
    border-right: none !important;
    border-left: none !important;
    border-bottom: none !important;
  }
  table.fold th {
    border-top: none !important;
    width: 100% !important;
    height: auto !important;
    display: block;
    box-sizing: border-box;
  }
  table.fold td {
    border-top: none !important;
    width: 100% !important;
    height: auto !important;
    display: block;
    box-sizing: border-box;
  }
}

.table-scroll {
  overflow: auto;
  -webkit-overflow-scrolling: auto;
  white-space: nowrap;
}

.normalTable1{
  border-collapse: collapse;
  border-spacing: 0;
  border: 1px solid #333;
}
.normalTable1 th,
.normalTable1 td{
  border: 1px solid #333;
  padding: 3px;
}
.normalTable1 th{
  background: #333;
  color: #fff;
  white-space: nowrap;
  font-weight: normal;
}

.normalTable2{
  border-collapse: collapse;
  border-spacing: 0;
  border: 1px solid #666;
}
.normalTable2 th,
.normalTable2 td{
  border: 1px solid #666;
  padding: 3px;
}
.normalTable2 th{
  background: #ccc;
  font-weight: normal;
  white-space: normal;
}
.normalTable2.nowrapHeader th{
    white-space: nowrap;
}

@media screen and (min-width: 1024px) {
  .table-scroll {
    overflow: visible;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .table-scroll-auto {
    overflow: auto;
  }
}

@media screen and (min-width: 768px) {
  .table-scroll table {
    width: 100%;
  }
}

.table-scroll .list {
  margin-bottom: 0;
}

.table-scroll::-webkit-scrollbar {
  height: 5px;
}

.table-scroll::-webkit-scrollbar-track {
  background: #efefef;
}

.table-scroll::-webkit-scrollbar-thumb {
  background: #ccc;
}

/* headTitle */
#headTitle {
  background-color: #000;
  margin-bottom: 1rem;
  width: 100%;
  box-sizing: border-box;
}

@media screen and (min-width: 768px) {
  #headTitle {
    display: flex;
    justify-content: space-between;
  }
}

#headTitle .headTitleInner {
  border-left: 6px solid #C80D2F;
  padding: 0.3rem 0.7rem;
}

#headTitle .headTitleInner .product {
  margin-right: 1rem;
  COLOR: #ee9c00;
  font-weight: bold;
}

#headTitle .headTitleInner .white {
  color: #fff;
}

@media screen and (min-width: 768px) {
  #headTitle .headTitleInner {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
}

#headTitle .linkBtn {
  padding: 0.3rem 0.7rem;
  height: auto;
  min-height: 20px;
  background-color: #666666;
}

#headTitle .linkBtn a {
  margin: 0 5px;
}

@media screen and (max-width: 767px) {
  #headTitle .linkBtn {
    padding: 0.5rem 0.7rem;
  }
}

#detailTitle {
  padding: 0.5rem;
  font-weight: bold;
  background-color: #333333;
  color: #fff;
}

@media screen and (min-width: 768px) {
  #detailTitle {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
}

@media screen and (max-width: 767px) {
  #detailTitle .snsArea {
    margin-top: 0.3rem;
    margin-bottom: 0.3rem;
  }
}

#detailTitle .snsArea img {
  vertical-align: bottom;
  height: 20px;
  width: auto;
}

#detailTitle .snsArea > div {
  padding-bottom: 0;
}

#detailTitle .snsArea::after {
  display: none !important;
}

#containerWrap {
  border: 1px solid #333;
  padding: 1.5rem;
}

@media screen and (max-width: 767px) {
  #containerWrap {
    padding: 1rem;
  }
}

#containerWrap h1,
#containerWrap h2,
#containerWrap h3,
#containerWrap h4,
#containerWrap h5,
#containerWrap h6,
#containerWrap pre,
#containerWrap ul,
#containerWrap p {
  margin-top: 5px;
  margin-bottom: 8px;
}

#containerWrap .hks_tv_wrap {
  width: 100%;
  height: 0;
  position: relative;
  padding-top: 56.25%;
  overflow: hidden;
}

#containerWrap .hks_tv_wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

@media screen and (max-width: 767px) {
  #containerWrap .hks_tv_wrap {
    margin-bottom: 1rem;
  }
}

@media screen and (min-width: 768px) {
  #containerWrap .hks_tv_wrap {
    margin-bottom: 2rem;
  }
}

.table-unset-border-collapse table {
    border-collapse: unset;
    border-color: unset;
}
