.p-top-logo {
  display: flex;
  align-items: center;
  line-height: 1.4;
  padding: 6px 5px;
  margin: 0 auto;
  text-align: left;
  background: #3e3e3e;
  color: #fff;
}

.p-top-logo a {
  display: block;
  transition: opacity .2s;
  text-decoration: none;
  color: #333;
}

.p-top-logo a:hover {
  opacity: .66;
}

.p-top-logo a:active {
  opacity: 1;
}

.p-top-logo img {
  width: 160px;
}

#slider-wrapper .bx-controls-direction a {
  z-index: 100;
}

#slider-wrapper .bx-viewport {
  top: 0;
  left: 0;
  border: 0;
  background: #f8f8f8;
  box-shadow: none;
}

#slider-wrapper .bx-wrapper img {
  margin: 0 auto;
}

#slider-wrapper .bx-caption {
  top: 0;
  bottom: auto;
  background: rgba(0, 0, 0, .3);
}

#slider-wrapper .bx-caption span {
  padding: 1.5em;
}

#slider-wrapper .bx-pager {
  bottom: 10px;
  padding-top: 0;
}

/*ページ選択丸の色*/
/*#slider-wrapper .bx-pager a {
  background: #fff;
}*/

#slider-wrapper .bx-pager a:hover,
#slider-wrapper .bx-pager a.active {
  background: #fd7f23;
}

.p-news {
  line-height: 1.5;
  margin: 0;
}

.p-news::after {
  display: block;
  clear: both;
  content: '';
}

.p-news__label {
  font-size: 14px;
  font-weight: normal;
  line-height: 1.6;
  width: 180px;
  margin: 0;
  letter-spacing: 1px;
}

.p-news__content {
  line-height: 1.6;
  margin: 5px 0 20px 10px;
}

.p-news__content p:nth-child(1) {
  margin-top: 0;
}

.p-news__label {
  font-family: 'Montserrat', sans-serif;
}

.p-news__label::before {
  content: '-';
}

.p-info {
  line-height: 1.5;
}

.p-contents {
  line-height: 1.5;
  margin-bottom: 40px;
}

.p-contents__list {
  margin: 0 0 20px;
  padding: 0;
  list-style-type: none;
}

.p-contents__list::after {
  display: block;
  clear: both;
  content: '';
}

.p-contents__list li {
  position: relative;
  box-sizing: border-box;
  padding: 0 2em 0 1em;
}

.p-contents__list li::before {
  position: absolute;
  top: .5em;
  left: 0;
  content: '-';
}

.p-contents__list a {
  display: block;
  max-width: 100%;
  padding: .5em 0;
  transition: opacity .2s;
  text-decoration: none;
  color: #333;
}

.p-contents__list a:hover {
  opacity: .66;
}

.p-contents__list a:active {
  opacity: 1;
}

.p-custom-banner {
  margin-top: 50px;
  text-align: center;
}

.p-custom-banner__unit {
  background: #f8f8f8;
}

.p-custom-banner__unit--text {
  font-family: 'Montserrat', sans-serif;
  padding: 30px 10px;
  color: #f8f8f8;
  background: #333;
}

.p-custom-banner__unit--text a {
  color: #f8f8f8;
}

.p-custom-banner__image {
  width: 100%;
}

.p-custom-banner__heading {
  font-size: 24px;
  padding: 10px 0;
}

.p-custom-banner__body {
  line-height: 1.5;
  padding: 10px 0;
}

@media screen and (min-width: 600px) {
  .p-top-logo {
    display: none;
  }

  #slider-wrapper .bx-pager {
    bottom: -30px;
  }

  .p-contents__list li::before {
    top: 0;
  }

  .p-contents__list li {
    float: left;
    width: 50%;
    margin-bottom: 20px;
  }

  .p-contents__list li:nth-child(2n + 1) {
    clear: left;
  }

  .p-contents__list a {
    display: inline-block;
    padding: 0;
  }

  .p-custom-banner {
    display: table;
    width: 100%;
    margin-top: 100px;
    table-layout: fixed;
  }

  .p-custom-banner__unit {
    display: table-cell;
    box-sizing: border-box;
    width: 50%;
    max-width: 50%;
    vertical-align: middle;
    word-break: break-all;
  }

  .p-custom-banner__unit--text {
    padding: 10px 20px;
  }
}

@media screen and (min-width: 960px) {
  .p-news__label {
    float: left;
    clear: left;
    margin-right: 20px;
  }

  .p-news__content {
    overflow: hidden;
    margin: 0 0 20px;
  }

  .p-custom-banner__heading {
    font-size: 30px;
  }
}

.movie__section div {
  display: flex;
  flex-wrap: wrap;
}
  
.movie__section iframe {
  padding: 5px;
  width:calc(100%/3);
  box-sizing: border-box;
}

@media screen and (max-width: 780px) {
  .movie__section iframe {
  width:calc(100%/1);
}
}

.header_shopname {
  font-size: 0.7rem;
  font-weight: normal;
  margin: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
@media screen and (max-width: 600px) {
  .header_shopname {
  margin: 0 0 0 10px;
}
}

/* カテゴリ */
.top-catbanner_area {
display: grid;
grid-template-columns: repeat(3, minmax(150px, 1fr));
padding: 1rem 8px;
}
@media screen and (max-width: 680px) {
.top-catbanner_area {
grid-template-columns: repeat(2, minmax(150px, 1fr));
}
}

.summary {
position: relative;
display: flex;
align-items: center;
padding: 4px;
border: 1px solid #eee;
font-size: 14.4px;
cursor: pointer;
box-sizing: border-box;
}
.summary:hover {
opacity: 0.8;
}

.summary .btn,
.summary .btn2 {
position: absolute;
top: 37%;
left: 88%;
width: 18px;
height: 18px;
transform-origin: center center;
}
.summary .btn:before,
.summary .btn:after {
content: "";
background-color: #000;
width: 18px;
height: 2px;
position: absolute;
top: 7px;
left: 0;
transform-origin: center center;
}
.summary .btn:before {
width: 2px;
height: 18px;
top: 0;
left: 8px;
}
.summary.is-active .btn {
-webkit-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.summary .btn2:before,
.summary .btn2:after {
content: "";
position: absolute;
top: calc(50% - 0.5px);
right: 0;
width: 13px;
height: 1px;
border-radius: 9999px;
background-color: #000000;
transform-origin: calc(100% - 0.5px) 50%;
}
.summary .btn2::before {
transform: rotate(45deg);
}
.summary .btn2::after {
transform: rotate(-45deg);
}
.summary.is-active .btn:before {
content: none;
}
.summary::-webkit-details-marker {
display: none;
}
@media screen and (max-width: 390px) {
.summary .btn2 {
top: 28%;
}
.summary .btn2:before,
.summary .btn2:after {
width: 8px;
}
.summary .btn {
left: 90%;
}
.summary .btn2 {
left: 86%;
}
.summary .btn:after {
width: 14px;
top: 5px;
}
.summary .btn:before {
height: 13px;
left: 6px;
}
}

.top-catbanner_area a {
text-decoration: none;
color: #000;
}

.content {
background-color: #eee;
box-sizing: border-box;
}
.content a {
display: block;
}
.content a:not(:last-child) {
border-bottom: 1px solid #fff;
}
.content p {
position: relative;
text-align: left;
margin: 0;
padding: 10px 4px;
cursor: pointer;
font-size: 14.4px;
box-sizing: border-box;
}

.top-catbanner_area img {
width: 60px;
max-width: 50px;
height: auto;
margin-right: 5px;
}
@media screen and (max-width: 430px) {
.top-catbanner_area img {
margin-right: 3px;
max-width: 35px;
}
}



/*シリーズ一覧*/
@media screen and (min-width: 690px) {
  .for-sp {
    display: none !important;
  }
}
@media screen and (max-width: 689px) {
  .for-pc {
    display: none !important;
  }
}


.wrap-series h3 {
  margin: 0;
  padding: 4px;
  text-align: center;
  font-weight: normal;
  color: #fff;
  background-color: #000;
  font-size: 0.9rem;
}

.grid_series {
  display: grid;
  grid-template-columns: 30px 1fr 30% 1fr 1fr 1fr 1fr 1fr 1fr;
  /*grid-template-columns: 30px repeat(8, 1fr);*/
  grid-template-rows: repeat(14, auto);
}



.wrap-series a {
  color: #000;
}

.item1 {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 2px;
  font-size: 13px;
  white-space: nowrap;
  background-color: #fbf7ec;

  border: solid 1px #eee;
}

.cat-e,
.cat-s,
.cat-o {
  display: flex;
  justify-content: center;
  align-items: center;
  writing-mode: vertical-rl;
  text-orientation: upright;
  padding: 2px;
  font-size: 14px;
  letter-spacing: -3px;
  color: #fff;
}

.cat-e {
  grid-column: 1 / 2;
  grid-row: 2 / 7;
  background: #28529e;
}

.cat-s {
  grid-column: 1 / 2;
  grid-row: 7 / 12;
  background: #eb002b;
}

.cat-o {
  grid-column: 1 / 2;
  grid-row: 12 / 15;
  background: #37767b;
}

.item2 {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 5px;
  font-size: 0.8rem;

  border: solid 1px #eee;
}

.item1 p,
.item2 p {
  line-height: 1.1rem;
  margin: 0;
  padding:0;
}

.se-txt {
  flex-direction: column;
  text-align: center;
}
.se-img {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.se-img img {
  width: 75px;
  max-width: 100%;
}
.grid_series span {
  display: inline-block;
}

@media screen and (max-width: 869px) {
  .grid_series {
    grid-template-columns: 20px 100px 1fr 80px 1fr 60px 60px 70px 70px;
  }
  .cat-e,
  .cat-s,
  .cat-o {
    padding: 1px;
    font-size: 12px;
  }
  .item1 {
    white-space: normal;
    text-align: center;
  }
  .item2 {
    font-size: 14px;
  }

}





/*SP*/
@media screen and (max-width: 689px) {
  .wrap-series {
  padding:0 8px;
}
}

.for-sp .cat-e,
.for-sp .cat-s,
.for-sp .cat-o {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: relative;
  cursor: pointer;

  writing-mode: horizontal-tb;
  text-orientation: mixed;
  letter-spacing: 1px;
  padding: 0 0 0 20px;
  margin-bottom: 20px;
  font-size: 1.5rem;
}

.for-sp .cat-e span,
.for-sp .cat-s span,
.for-sp .cat-o span {
  background-color: #fff;
  color: #000;
  padding: 0 5px;
}

.series-bar summary::before,
.series-bar summary::after {
  content: '';
  display: inline-block;
  width: 20px;
  height: 2px;
  background-color: #fff;
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  transition: opacity 1s;

}

.series-bar summary::after {
  transform: translateY(-50%) rotate(90deg);
}

.series-bar summary.show-btn::after {
  transform: translateY(-50%) rotate(180deg);
}

.series-bar summary::-webkit-details-marker {
  display: none;
}
.series-bar summary {
list-style-type: none;
}


.for-sp .feature::before {
  content: "特色/\A feature";
  white-apace: pre;
}

.for-sp .use::before {
  content: "用途/\A use";
  white-apace: pre;
}

.for-sp .mate::before {
  content: "素材/\A material";
  white-apace: pre;
}

.for-sp .inchi::before {
  content: "股下/\A inseam \A (inchi)";
  white-apace: pre;
}

.for-sp .fly::before {
  content: "前開き\A/ fly";
  white-apace: pre;
}

.for-sp .pri::before {
  content: "価格/\A price";
  white-apace: pre;
}

.for-sp .number::before {
  content: "品番";
}

.for-sp .grid_series {
  grid-template-columns: auto 1fr;
  grid-template-rows: 1fr;
}


.for-sp .item1 {
  grid-column: 1 / 2;
}

.for-sp .item1,
.for-sp .item2 {
  justify-content: flex-start;
  align-items: flex-start;
  padding: 2px 4px;
  font-size: 0.9rem;
  text-align: left;
}

.for-sp .item2 {
  display: flex;
}

.for-sp .spimg {
  grid-column: 1 / 3;
  justify-content: center;
  padding: 5px 0;
}

.for-sp .number,
.for-sp .number_i {
  margin-bottom: 0.8rem;
}


/* info画像 */
.info_section {
  margin-top: 1rem;
  padding: 0 8px;
}
.section1{
  display: flex;
  justify-content: space-between;
  margin-bottom: 0.5rem;
}
.info_section img {
  height: auto;
  max-width: 100%;
}
.section1 a:not(:last-child) {
  padding-right: 5px;
}

.section2 {
  display: flex;
  list-style: none;
  text-align: center;
  margin: 0;
  padding: 0;
}
.section2 li {
  width: calc(100%/4);
  box-sizing:border-box;
}
.section2 li:not(:last-child) {
  margin-right: 12px;
}
@media screen and (max-width: 600px) {
.section2 li:not(:last-child) {
  margin-right: 5px;
}
}

.img_info {
  display: flex;
  justify-content: center;
   margin: 1rem auto;
}
.img_info img {
  width: 960px;
  max-width:90%;
}

/*コンテンツ*/
.contents__list {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  text-align: center;
  padding: 0;
}
.contents__list li {
  width: calc(100%/3);
  padding: 0 5px;
  box-sizing: border-box;
}
.contents__list img {
  max-width: 100%;
  height: auto;
}

@media screen and (max-width: 600px) {
 .contents__list li {
   width: calc(100%/2);
  }
}