/*共通CSS*/

@media only screen and (max-width: 640px){

    .fs-c-breadcrumb {
      margin-top: 70px;
  }
}

@media only screen and (min-width: 750px){

  .wapper-loosestraightpants2024ss {
    padding: 0 35%;
  }

  .fs-c-breadcrumb {
    margin-top: 30px;
  }

}

.upper {
  text-transform: uppercase;
}

.cap {
  text-transform: capitalize;
}

.-flex {
  display: flex;
}

.header-nav__inner {
  display: none;
}

.campaign-banner-block img {
  display: none;
}




/*section-top*/

section.top {
  text-align: center;
  margin-bottom: 15%;
  font-family: serif;
}

section.top h1 {
  font-size: 6vw;
  font-weight: bold;
  margin-bottom: -1%;
}

section.top p {
  font-size: 3vw;
  margin-bottom: 5%;
}

.description {
  font-size: 11px;
  letter-spacing: 1px;
  padding: 0 8%;
  text-align: left;
}

@media only screen and (min-width: 750px){

  section.top h1 {
    font-size: 2vw;
  }
  
  section.top p {
    font-size: 1vw;
  }

  .description {
    font-size: 13px;
  }

}




/*section-styling*/

section.styling {
  width: 100%;
}

.styling-box {
  float: left;
  width: 100%;
  margin-bottom: 5%;
}

.styling-box:nth-child(odd) {
  text-align: left;
}

.styling-box:nth-child(even) {
  text-align: right;
}

.styling-box:last-child {
  margin-bottom: 15%;
}

.styling-box img {
  width: 77%;
}


/*section-explanation*/

section.explanation {
  margin-bottom: 15%;
}

section.explanation h2 {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 8%;
}

section.explanation h3 {
  font-size: 15px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 3%;
}

.explanation-box .-flex {
  justify-content: center;
  gap: 5%;
  margin-bottom: 15%;
}

section.explanation img {
  width: 15%;
  height: 15%;
  border-radius: 50%;
}

.bub{
  width: 70%;
  position:relative;
  background:#e9e9e9;
  padding:15px;
  text-align:left;
  color:#000000;
  font-size:10px;
  border-radius:10px;
  -webkit-border-radius:10px;
  -moz-border-radius:10px;
}
.bub:after{
  border: solid transparent;
  content:'';
  height:0;
  width:0;
  pointer-events:none;
  position:absolute;
  border-color: rgba(204, 204, 204, 0);
  border-top-width:10px;
  border-bottom-width:10px;
  border-left-width:10px;
  border-right-width:10px;
  margin-top: -10px;
  border-right-color:#e9e9e9;
  right:100%;
  top:25%;
}

section.explanation h4 {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 1%;
}

.bub .point {
  margin-bottom: 8%;
}

.bub .point p {
  font-size: 13px;
}

.bub .point p span {
  font-size: 13.5px;
  font-weight: bold;
}

.bub .point:last-child {
  margin-bottom: 0%;
}

@media only screen and (min-width: 750px){

  section.explanation h2 {
    font-size: 18px;
  }
  
  section.explanation h3 {
    font-size: 16px;
  }
  

}


/*miyazaki*/

section.miyazaki {
  padding: 0 10%;
  margin-bottom: 15%;
}

section.miyazaki h4 {
  font-size: 16px;
  margin-bottom: 5%;
  text-align: center;
}

section.miyazaki .profile-img {
  width: 35%;
  display: block;
  margin: 0 auto;
  margin-bottom: 5%;
  border-radius: 50%;
}

section.miyazaki h3 {
  font-size: 11px;
  text-align: center;
}

section.miyazaki h2 {
  font-size: 30px;
  font-weight: bold;
  font-family: serif;
  margin-bottom: 5%;
  text-align: center;
}

section.miyazaki .sns {
  justify-content: center;
  align-items: center;
  max-width: 500px;
  margin: 0 auto;
  margin-bottom: 10%;
  gap: 5%;
}

section.miyazaki .logo {
  width: 20px;
}

section.miyazaki .sns a {
  width: 30%;
  justify-content: center;
  align-items: center;
  gap: 7%;
}

section.miyazaki p {
  font-size: 10px;
  letter-spacing: 1px;
  width: 85%;
  margin: 0 auto;
}

@media only screen and (min-width: 750px){

  section.miyazaki p {
    font-size: 13px;
  }

}


/*section-reco-item*/


section.reco-item {
  padding: 0 8%;
  margin-bottom: 15%;
}

section.reco-item h2 {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 8%;
}

section.reco-item .box {
  background-color: #e9e9e9;
  padding: 5%;
  justify-content: center;
  align-items: center;
  gap: 5%;
  margin-bottom: 5%;
  border-radius: 10px;
}

section.reco-item .box .a-img {
  width: 100%;
  border: 8px solid #FFF;
  border-radius: 10px;
}


section.reco-item .box img {
  width: 100%;
}

section.reco-item .box .detail {
  text-align: center;
}

section.reco-item .box .detail h3 {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 5%;
  font-family: serif;
}

section.reco-item .box .detail p {
  font-size: 12px;
  letter-spacing: 1px;
  margin-bottom: 5%;
  text-align: left;
}

section.reco-item .box .detail a {
  font-size: 12px;
  font-weight: bold;
  background-color: #000;
  color: #FFF;
  padding: 5px 10px;
}

@media only screen and (min-width: 750px){

  section.reco-item .box .a-img {
    width: 50%;
  }

}



/*プルダウン*/

.item {
  margin-bottom: 15%;
}

.item-all a {
  padding: 10px 20px;
  display: block;
  color: #FFF;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 1.8px;
}
.item-all {
  background: #1c1b1b;
  margin-bottom: 2%;
}
.main_menu {
  border-top-style: none !important;
  background-color: #e06e1d !important;
  padding-top: 13px !important;
  padding-bottom: 13px !important;
  color: #FFF;
  text-align: center;
  font-size: 14px;
  padding-left: 0px !important;
}
.main_menu::before {
  border-top: solid 2px #FFF !important;
  border-right: solid 2px #FFF !important;
}
#category {
  margin: 2% auto 2% !important;
}





/*セクションコンテンツ*/

section {
  background: #FFF;
  width: 100%;
}

section h2 {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 6%;
  text-align: center;
}













/*section-item*/

section.item {
  padding: 0 8%;
  font-family: serif;
}

section.item h2 {
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 8%;
  letter-spacing: -0.3px;
}

.item-list ul {
  margin-top: 5%;
}

.item-list li {
  float: left;
  width: 32%;
}

.item-list li img {
  margin-bottom: 8%;
}

.item-list li p {
  text-align: center;
  font-weight: bold;
  font-size: 10px;
}

.item-list li:not(:nth-child(3n)) {
  margin-right: 2%;
}

.item-list li:nth-child(-n+15) {
  margin-bottom: 9%;
}

.item-list.-brand li:nth-child(-n+15) {
  margin-bottom: 5%;
}



/*btn*/

a.c-btn01.mt10.-bk {
  background: #000;
  border: 1px solid #000;
  margin-top: 10px;

}

a.c-btn01.-jam {
  background: #2f79c5;
  border: 1px solid #2f79c5;
}


div.wapper-contents {
  margin: 7% 4% !important;
}



a.top {
  margin: 0 auto;
  color: #fff;
  font-weight: bold;
  display: block;
  width: 75px;
  height: 75px;
  border-radius: 50%;
  background: #e06e1d;
  text-align: center;
  line-height: 80px;
  margin-bottom: 10%;
}