@charset "utf-8";



/*----------------------------------------------------
    PCサイトcss
----------------------------------------------------*/
@media screen and (min-width: 768px) {
/*/////////////PC用のCSSをここに作成してください。/////////////*/
/*/////////////必ず中括弧の中に作成してください。/////////////*/

.sec03 .column-medium {
    padding: var(--s2) 3.8rem 8rem 3.8rem;
}

  .center_img{
    text-align: center;
  }

}



/*----------------------------------------------------
    SPサイトcss
----------------------------------------------------*/
@media screen and (max-width: 767px) {
/*/////////////SP用のCSSをここに作成してください。/////////////*/
/*/////////////必ず中括弧の中に作成してください。/////////////*/

.header-area-upper {
  
  text-align: left;
  border-bottom: 1px solid #000;
  padding-bottom: 1rem;
}
.header-title {
  font-size: 1.1rem;
      padding-left: 3rem;
    line-height: 1.2;
}

.header-title::before {
  
  left: 0;
}

.mv-logo {
margin-top: min(4.13333vw, 3.1rem);
}


.mainvisual.lower .lower-image {
  max-width: 50%;
  margin-inline: auto;
}

.mainvisual.lower .lower-image img {
 max-width: none;
}

.column-small {
  padding-bottom: 2.5rem;
}

.column-small + .column-small {
  margin-top: 3.5rem;
}


  .column-small .l-stack-large {
  padding-left: 1.8rem;
  padding-right: 1.8rem;
}

 .thb-iconbox01-title {
    max-width: none;
  }

  .column-small .btn-web {
     max-width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5rem;
  }

  .column-small .btn-web a {
    background-color: #FD9B23;
    font-size: 1.6rem;
  }

  .column-small .btn-tel {
    margin-top: 2.5rem;
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
    z-index: 1;
  }

    .onb-five-slider-container .swiper-button-prev:after {
    content: "";
    position: absolute;
    left: 0rem;
    top: 50%;
    transform: translateY(0);
    width: 3rem;
    height: 3rem;
    background: url(
    "./img/arrow-left_big.png") no-repeat center center;
    background-size: contain;

  }

    .onb-five-slider-container .swiper-button-next:after {
    content: "";
    position: absolute;
    right: 0rem;
    width: 3rem;
    height: 3rem;
    top: 50%;
    transform: translateY(0);

  }

.caption {text-align: center;padding-bottom: 3rem;}

.icon-title-area {
  max-width: 90%;
  margin-left: auto;
  margin-right: auto;
}

.column-medium table th {
 font-size: 1.5rem;
}

  .column-medium table td {
  font-size: 1.5rem;
  width: 40%;
  border-color: #000;
  padding: var(--s1);
}

.column-medium table::after{
  text-align: left;
  font-size: 1.4rem;
  left: 0;
}

.column-medium .onb-m-title5 {
  margin-top: 5.1rem;
}

.onb-casebox02-sub {
  padding: 1rem;
  left: 6.5%;
}

.onb-five-slider-container + h4 {
  font-size: 2rem;
}

.plus-black-box {
  margin-top: 0;
  padding-block: 0.7rem;
  padding-inline: 1rem;
  font-size: 2rem;
}

.sec02 {
  padding-bottom: 5.5rem;
  margin-bottom: 0;
  margin-top: 4rem;
  background-size: cover;
  background-attachment: scroll;
}

.sec02 + .sec03 {
  margin-top: 0;
}

.onb-casebox-01-frame {
  padding-left: 0;
  padding-right: 0;
}

.section-title07 span::after {
  right: -7rem;
}

.sec03.case-studies::after {
  
  width: 84%;

}

.sec04.case-studies::after {
 width: 84%;
}

.sec04 .l-stack-large {
  gap: 2.1rem;
}

.l-pickup-contents02:nth-of-type(2) {
margin-top: 5rem;
}

.section-title06 {
   
    right: 2.5vw;
    
}

.taste_text {
  width: 75%;
}

.pickup-contents02-catch {
  text-align: left;
  margin-top: 3rem;
}



.pickup-contents02-catch {
  margin-bottom: 1.81rem;
}

.section-title07.guide::before {
    max-width: 175px;
    top: -0.3rem;
}

.section-title07.guide a::after {
  right: -11rem;
}

.sec04 {
  margin-bottom: 0;
}

.sec05 {
  margin-top: 0;
}

.pickup-contents01-catch {
  margin-top: 1rem;
}

.section-title07.faq a::after {
  right: -9rem;
}

.acc-title::before {
  right: 4px;
}

.acc-title::after {
  right: 4px;
}

.footer-area-logo {
  width: 21rem;
  text-align: center;
  margin: 0 auto var(--s4);
}

.sec03 .l-grid-three:last-of-type {
  display: block;
}

.sec03 .l-grid-three:last-of-type .column-small{
  width: 100%;
}

.sec03 .column-medium{
  padding-bottom: 3rem;
}

.sec02 .btn-tel {
    margin: 0;
    z-index: 0;
}



#low-page #chapter-6::before {
    width: 6rem;
    top: -2rem;
    left: -3rem;
}

#low-page table td {
  width: 100%;
  word-break: break-all;
}

#low-page .btn-internal2 a, #low-page .btn-internal a {
    padding: var(--s2) var(--s3) var(--s2) var(--s1);
    font-size: 1.6rem;
}

#low-page .btn-internal a{
background-position:95% center;
    background-size: auto 0.8em;
}

#low-page .btn-internal2 a{
    background-position:95% center;
    background-size: auto 0.4em;   
}

#low-page .btn-web a {
    font-size: 1.6rem;
    padding: var(--s2) var(--s3) var(--s2) var(--s1);
    background: #FD9B23 url(./img/arrow-01-bk-right.svg) no-repeat center right 0.8rem / auto 0.8em;
}

}