@charset "UTF-8";

/*
///////////////////////////////////////////////////////////////////////////////////////
                                                                                SETTING
///////////////////////////////////////////////////////////////////////////////////////
*/
.barbour_240912 {
  --color-white: #fff;
  --color-black: #000;
  --color-text: #58595b;
  --color-brown: #a1846c;
  --color-beige: #ebe3dd;
  --font-ryo: "ryo-text-plusn";
  --font-miller: "miller-headline";
  --font-en: var(--font-miller), sans-serif;
  --font-ja: var(--font-ryo), sans-serif;
  --font-main: var(--font-en), var(--font-ja), sans-serif;
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  font-feature-settings: "palt";
  overflow: clip;
}
@media screen and (min-width: 768px) {
  .barbour_240912 {
    width: 100%;
    margin: 3rem auto 10rem;
  }
}
@media screen and (max-width: 767px) {
  .barbour_240912 {
    width: calc(750*100vw/750);
    margin: calc(0*100vw/750) auto calc(100*100vw/750);
  }
}
/*
//////////////////////////////////////////////////////////////////////////////////////////////
component - flex
//////////////////////////////////////////////////////////////////////////////////////////////
*/
.barbour_240912 .c-flex_row {
  display: flex;
  flex-direction: row;
  gap: var(--row, 0) var(--column, 0);
}
.barbour_240912 .c-flex_row_reverse {
  display: flex;
  flex-direction: row-reverse;
  gap: var(--row, 0) var(--column, 0);
}
.barbour_240912 .c-flex_column {
  display: flex;
  flex-direction: column;
  gap: var(--row, 0) var(--column, 0);
}
.barbour_240912 .c-flex_column_reverse {
  display: flex;
  flex-direction: column-reverse;
  gap: var(--row, 0) var(--column, 0);
}
@media screen and (min-width: 768px) {
  .barbour_240912 .c-pc_flex_row {
    display: flex;
    flex-direction: row;
    gap: var(--row, 0) var(--column, 0);
  }
  .barbour_240912 .c-pc_flex_row_reverse {
    display: flex;
    flex-direction: row-reverse;
    gap: var(--row, 0) var(--column, 0);
  }
  .barbour_240912 .c-pc_flex_column {
    display: flex;
    flex-direction: column;
    gap: var(--row, 0) var(--column, 0);
  }
  .barbour_240912 .c-pc_flex_column_reverse {
    display: flex;
    flex-direction: column;
    gap: var(--row, 0) var(--column, 0);
  }
}
@media screen and (max-width: 767px) {
  .barbour_240912 .c-sp_flex_row {
    display: flex;
    flex-direction: row;
    gap: var(--row, 0) var(--column, 0);
  }
  .barbour_240912 .c-sp_flex_row_reverse {
    display: flex;
    flex-direction: column-reverse;
    gap: var(--row, 0) var(--column, 0);
  }
  .barbour_240912 .c-sp_flex_column {
    display: flex;
    flex-direction: column;
    gap: var(--row, 0) var(--column, 0);
  }
  .barbour_240912 .c-sp_flex_column_reverse {
    display: flex;
    flex-direction: column-reverse;
    gap: var(--row, 0) var(--column, 0);
  }
}
/*
///////////////////////////////////////////////////////////////////////////////////////
                                                                                common
///////////////////////////////////////////////////////////////////////////////////////
*/
.barbour_240912 img,
.barbour_240912 picture {
  display: block;
  width: 100%;
  height: auto;
}
.barbour_240912 section {
  margin: 0 auto;
}
.barbour_240912 .c-text_title {
  font-size: 2.4rem;
  line-height: 2;
  letter-spacing: .01em;
  color: var(--color-black);
  font-weight: var(--fw-bold);
  text-align: center;
}
.barbour_240912 .c-text_lead {
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: .01em;
  color: var(--color-black);
  font-weight: var(--fw-regular);
}
@media screen and (max-width: 767px) {
  .barbour_240912 .c-text_title {
    font-size: calc(32*100vw/750);
  }
  .barbour_240912 .c-text_lead {
    font-size: calc(24*100vw/750);
  }
}
/*
///////////////////////////////////////////////////////////////////////////////////////
                                                                              firstview
///////////////////////////////////////////////////////////////////////////////////////
*/
.barbour_240912 .firstview {
  width: 100%;
}
.barbour_240912 .firstview__wrapper {
  --row: 2.5rem;
}
@media screen and (min-width: 768px) {
  .barbour_240912 .firstview__image {
    width: 60rem;
    margin: 0 auto;
  }
  .barbour_240912 .firstview__lead {
    width: 60rem;
    margin: 0 auto;
  }
}
@media screen and (max-width: 767px) {
  .barbour_240912 .firstview {
    width: calc(750*100vw/750);
  }
  .barbour_240912 .firstview__wrapper {
    --row: calc(50*100vw/750);
  }
  .barbour_240912 .firstview__lead {
    padding: 0 calc(25*100vw/750);;
  }
}
/*
///////////////////////////////////////////////////////////////////////////////////////
                                                                            styleview01
///////////////////////////////////////////////////////////////////////////////////////
*/
.barbour_240912 .styleview01 {
  width: 100rem;
  margin-top: 5rem;
}
.barbour_240912 .styleview01 .styleview__wrapper {
  --row: 5rem;
}
.barbour_240912 .styleview01 .styleview__lead {
  width: 50rem;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .barbour_240912 .styleview01 {
    width: calc(750*100vw/750);
    margin-top: calc(100*100vw/750);
  }
  .barbour_240912 .styleview01 .styleview__wrapper {
    --row: calc(50*100vw/750);
  }
  .barbour_240912 .styleview01 .styleview__lead {
    width: calc(700*100vw/750);
  }
}
/*
///////////////////////////////////////////////////////////////////////////////////////
                                                                            styleview02
///////////////////////////////////////////////////////////////////////////////////////
*/
.barbour_240912 .styleview02 {
  width: 80rem;
  margin-top: 5rem;
}
.barbour_240912 .styleview02 .styleview__wrapper {
  --row: 5rem;
}
.barbour_240912 .styleview02 .styleview__wrap {
  --column: 5rem;
  align-items: center;
}
.barbour_240912 .styleview02 .styleview__image {
  width: 30rem;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .barbour_240912 .styleview02 {
    width: calc(700*100vw/750);
    margin-top: calc(100*100vw/750);
  }
  .barbour_240912 .styleview02 .styleview__wrapper {
    --row: calc(30*100vw/750);
  }
  .barbour_240912 .styleview02 .styleview__wrap {
    --row: calc(30*100vw/750);
  }
  .barbour_240912 .styleview02 .styleview__image {
    width: calc(450*100vw/750);
    margin: 0 auto;
  }
}
/*
///////////////////////////////////////////////////////////////////////////////////////
                                                                            styleview03
///////////////////////////////////////////////////////////////////////////////////////
*/
.barbour_240912 .styleview03 {
  width: 80rem;
  margin-top: 5rem;
}
.barbour_240912 .styleview03 .styleview__wrapper {
  --row: 5rem;
}
.barbour_240912 .styleview03 .styleview__wrap {
  --column: 5rem;
  align-items: center;
}
.barbour_240912 .styleview03 .styleview__image {
  width: 30rem;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .barbour_240912 .styleview03 {
    width: calc(700*100vw/750);
    margin-top: calc(100*100vw/750);
  }
  .barbour_240912 .styleview03 .styleview__wrapper {
    --row: calc(30*100vw/750);
  }
  .barbour_240912 .styleview03 .styleview__wrap {
    --row: calc(30*100vw/750);
  }
  .barbour_240912 .styleview03 .styleview__image {
    width: calc(450*100vw/750);
    margin: 0 auto;
  }
}
/*
///////////////////////////////////////////////////////////////////////////////////////
                                                                            styleview04
///////////////////////////////////////////////////////////////////////////////////////
*/
.barbour_240912 .styleview04 {
  width: 70rem;
  margin-top: 5rem;
}
.barbour_240912 .styleview04 .styleview__wrapper {
  --row: 5rem;
}
.barbour_240912 .styleview04 .styleview__lead {
  width: 50rem;
  margin:  0 auto;
}
@media screen and (max-width: 767px) {
  .barbour_240912 .styleview04 {
    width: calc(700*100vw/750);
    margin-top: calc(100*100vw/750);
  }
  .barbour_240912 .styleview04 .styleview__wrapper {
    --row: calc(30*100vw/750);
  }
  .barbour_240912 .styleview04 .styleview__image {
    width: calc(650*100vw/750);
    margin: 0 auto;
  }
  .barbour_240912 .styleview04 .styleview__lead {
    width: 100%;
  }
}
/*
///////////////////////////////////////////////////////////////////////////////////////
                                                                            lastview
///////////////////////////////////////////////////////////////////////////////////////
*/
.barbour_240912 .lastview__lead {
  text-align: center;
}
.barbour_240912 .lastview {
  width: 50rem;
  margin-top: 2rem;
}
.barbour_240912 .lastview__btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 21rem;
  height: 3.3rem;
  margin: 0 auto;
  font-size: 1.6rem;
  text-align: center;
  background-color: var(--color-black);
  color: var(--color-white);
  transition: opacity .5s;
}
.barbour_240912 .lastview__btn:hover {
  opacity: 0.6;
}
.barbour_240912 .lastview__btn > a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}
.barbour_240912 .lastview .lastview__wrapper {
  --row: 5rem;
}
@media screen and (max-width: 767px) {
  .barbour_240912 .lastview {
    width: calc(700*100vw/750);
    margin-top: calc(100*100vw/750);
  }
  .barbour_240912 .lastview .lastview__wrapper {
    --row: calc(50*100vw/750);
  }
  .barbour_240912 .lastview__btn {
    width: calc(420*100vw/750);;
    height: calc(66*100vw/750);
    font-size: calc(24*100vw/750);
  }
  .barbour_240912 .lastview .lastview__image {
    width: calc(500*100vw/750);
    margin: 0 auto;
  }
}