@charset "UTF-8";
@font-face {
  font-family: "basefont";
  src: url("../fonts/newbaskervillestd-roman.otf") format("opentype"); /* ファイルへのパスと形式 */
  font-display: swap; /* 読み込みまで代替えフォントを表示 */
}
/*---------------------------------------------
メディアクエリー
---------------------------------------------*/
/*---------------------------------------------
共通
---------------------------------------------*/
html {
  color: #000;
  /*
    display: none;
  */
}

/*リセット
--------------------------------------------*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
  font-family: "basefont", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #402919;
}

html {
  line-height: 1;
}

ol,
ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption,
th,
td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}

q,
blockquote {
  quotes: none;
}

q:before,
q:after,
blockquote:before,
blockquote:after {
  content: "";
  content: none;
}

a {
  text-decoration: none;
  color: inherit;
  transition: all 0.3s ease;
}
a:hover {
  opacity: 0.8;
  transition: all 0.3s ease;
}

a img {
  border: none;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

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

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

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

.flexed {
  display: flex;
  flex-wrap: wrap;
}

.flexed-center {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}

.flexed-between {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: stretch;
}

@media screen and (max-width: 768px) {
  .drw_lp {
    overflow-x: hidden;
  }
}
.basein {
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .basein {
    box-sizing: border-box;
  }
}
@media screen and (min-width: 769px) {
  .basein {
    box-sizing: border-box;
    max-width: 1200px;
    width: 100%;
  }
}

@media screen and (max-width: 768px) {
  .content_txt {
    margin: 17.5px 17.5px 0;
  }
}

.inline_b {
  display: inline-block;
}

ul.credit_txt {
  margin-top: 15px;
}
ul.credit_txt li a {
  display: block;
  margin-bottom: 5px;
  font-size: 13px;
  letter-spacing: 0.03em;
}
ul.credit_txt li a span {
  text-decoration: underline;
  padding: 0 2px 0 1px;
}

.come,
.shop {
  text-decoration: none !important;
  margin-left: 10px;
  font-style: italic;
}

.no-link {
  pointer-events: none;
}

.under_none {
  text-decoration: none !important;
}

@media screen and (min-width: 769px) {
  .two_column {
    gap: 25px;
    max-width: 930px;
    margin: 275px auto;
    width: 100%;
  }
}
@media screen and (min-width: 769px) {
  .two_column li {
    width: calc(50% - 12.5px);
  }
}

.one_column {
  width: 100%;
}
@media screen and (min-width: 769px) {
  .one_column {
    max-width: 600px;
    margin: 275px auto;
    width: 100%;
  }
}

@media screen and (min-width: 769px) {
  .wrapper {
    justify-content: space-around;
    position: relative;
  }
  .wrapper .center_line {
    max-width: 1080px;
  }
  .wrapper .left_line,
  .wrapper .right_line {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    z-index: 100;
    writing-mode: vertical-rl;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.6s ease, visibility 0.6s ease;
    font-size: 10px;
    letter-spacing: 1px;
    width: calc((100% - 1080px) / 2 - 2vw);
    display: flex;
  }
  .wrapper .left_line.is-visible,
  .wrapper .right_line.is-visible {
    /* このクラスがついたら表示 */
    opacity: 1;
    visibility: visible;
  }
  .wrapper .left_line {
    left: 2vw;
  }
  .wrapper .left_line .txt_line {
    margin-right: auto;
  }
  .wrapper .right_line {
    right: 2vw;
  }
  .wrapper .right_line .txt_line {
    margin-left: auto;
  }
}
/*---------------------------------------------
font
---------------------------------------------*/
.itc_l {
  font-family: "itc-american-typewriter", serif;
  font-weight: 300;
  font-style: normal;
}

.eg_gara {
  font-family: "eb-garamond", serif;
  font-weight: 400;
  font-style: italic;
}

.eg_gara_n {
  font-family: "eb-garamond", serif;
  font-weight: 400;
  font-style: normal;
}

/*---------------------------------------------
FV
---------------------------------------------*/
.main_wrap .main_viz {
  position: relative;
}
@media screen and (max-width: 768px) {
  .main_wrap .main_viz::before {
    content: "";
    position: relative;
    display: block;
    padding-top: 177.8666666667%;
  }
  .main_wrap .main_viz .main_img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    object-fit: cover;
  }
}
.main_wrap .main_viz h1 {
  position: absolute;
}
@media screen and (min-width: 769px) {
  .main_wrap .main_viz h1 {
    top: 50%;
    right: 7%;
    transform: translateY(-50%);
    width: 34vw;
    height: auto;
  }
}
@media screen and (max-width: 768px) {
  .main_wrap .main_viz h1 {
    bottom: 30px;
    left: 5.3333333333%;
    width: 93.3333333333%;
  }
}

.main_viz h1 img.sp_none,
.main_viz h1 img.pc_none {
  width: 100%;
  height: auto;
  display: block;
}

/* ANIMATION */
.pic.blur {
  /* 初期状態（ぼけている・少し大きい） */
  filter: blur(10px);
  overflow: hidden;
}
.pic.blur img {
  transform: scale(1.05);
  transition: transform 1.5s ease;
  display: block;
  width: 100%;
}
.pic.blur {
  /* クラスがついた時（じわっとクリアに） */
}
.pic.blur.is-clear {
  filter: blur(0);
  transition: filter 1.5s ease;
}
.pic.blur.is-clear img {
  transform: scale(1);
}

.two_column.pic {
  display: flex; /* Flexboxを有効にする */
  justify-content: space-between;
  gap: 20px; /* 画像間の余白（ここが効くようになります） */
  list-style: none;
  padding: 0;
  width: 100%;
  position: relative; /* スライダー用 */
}
.two_column.pic li {
  flex: 1; /* 2つのliを均等幅に */
  position: relative; /* absoluteではなくrelativeにする（スライダーでない場合） */
  overflow: hidden; /* ぼかしの縁をカットする用 */
}
.two_column.pic li img {
  width: 100%;
  display: block;
  height: auto;
  transition: transform 0.1s linear; /* ぼかし連動のスケール用 */
}

/* もしこの two_column 自体がスライダー（フェード）として動いている場合 */
.two_column.anim.blur {
  min-height: 1px;
}

/* slide */
.flexslider {
  position: relative;
  width: 100%;
  /* heightの指定を消しても、中の画像に合わせて伸びるようになります */
}
.flexslider .slides {
  position: relative;
  list-style: none;
  padding: 0;
  margin: 0;
}
.flexslider .slides li {
  /* 基本は重ねるために absolute */
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  visibility: hidden;
  transition: opacity 1000ms ease, visibility 1000ms ease;
  z-index: 1;
  /* アクティブな時 */
}
.flexslider .slides li.is-active {
  opacity: 1;
  visibility: visible;
  z-index: 2;
  /* アクティブな要素だけを relative にすることで親の高さを作る */
  position: relative;
}
.flexslider .slides li img {
  width: 100%;
  display: block;
  height: auto;
}

/* AOS */
[data-aos=fade-up] {
  transform: translate3d(0, 25px, 0);
}
[data-aos=fade-up].aos-animate {
  transform: translate3d(0, 0, 0);
}

[data-aos=fade-down] {
  transform: translate3d(0, -25px, 0);
}
[data-aos=fade-down].aos-animate {
  transform: translate3d(0, 0, 0);
}

[data-aos=fade-left] {
  transform: translate3d(25px, 0, 0);
}
[data-aos=fade-left].aos-animate {
  transform: translate3d(0, 0, 0);
}

[data-aos=fade-right] {
  transform: translate3d(-25px, 0, 0);
}
[data-aos=fade-right].aos-animate {
  transform: translate3d(0, 0, 0);
}

.animeted {
  /* 下から上がってくる距離を縮める */
}
.animeted [data-aos=fade-up] {
  transform: translate3d(0, 20px, 0);
}
.animeted [data-aos=fade-up].aos-animate {
  transform: translate3d(0, 0, 0);
}
.animeted {
  /* 上から下がってくる距離を縮める */
}
.animeted [data-aos=fade-down] {
  transform: translate3d(0, -20px, 0);
}
.animeted [data-aos=fade-down].aos-animate {
  transform: translate3d(0, 0, 0);
}

/* END */
@media screen and (max-width: 768px) {
  .center_line .flexed-center {
    justify-content: space-between;
  }
}
.center_line .content01 > div {
  line-height: 25px;
}
@media screen and (min-width: 769px) {
  .center_line .content01 > div {
    max-width: 950px;
    margin: 145px auto 165px;
  }
  .center_line .content01 > div .content01_txt {
    max-width: calc(100% - 515px);
    width: 100%;
    font-size: 15px;
  }
  .center_line .content01 > div .content01_txt h2, .center_line .content01 > div .content01_txt p:nth-child(2) {
    margin-bottom: 38px;
  }
  .center_line .content01 > div .content01_img {
    max-width: 435px;
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .center_line .content01 > div .content01_txt {
    margin: 90px 0 90px 20px;
    width: calc(100% - 20px);
    font-size: 13px;
    line-height: 17px;
    letter-spacing: 0.03em;
  }
  .center_line .content01 > div .content01_txt h2, .center_line .content01 > div .content01_txt p:nth-child(2) {
    margin-bottom: 17.5px;
  }
  .center_line .content01 > div .content01_img {
    margin: 0 0 75px 20px;
    width: calc(100% - 97.5px);
    text-align: left;
  }
}
.center_line .content02 .img_area {
  max-width: 600px;
  margin: 0 auto;
  width: 100%;
}
.center_line .content02 .img_area .content_img {
  margin-bottom: 15px;
}
.center_line .content02 .img_area + .flexed-center {
  margin: 225px auto 275px;
  max-width: 1130px;
  width: 100%;
  justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .center_line .content02 .img_area + .flexed-center {
    margin: 123.5px 0 115px;
  }
}
.center_line .content02 .img_area + .flexed-center .img_box {
  max-width: 338px;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .center_line .content02 .img_area + .flexed-center .img_box {
    width: calc(100% - 135px);
    margin: 0 auto;
    max-width: 100%;
    margin-bottom: 160px;
  }
}
.center_line .content02 .img_area + .flexed-center .content_box {
  max-width: 600px;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .center_line .content03 .two_column {
    margin: 0 0 0 5px;
  }
  .center_line .content03 .two_column li {
    width: calc(100% - 120px);
  }
  .center_line .content03 .two_column li:first-child {
    margin-bottom: 5px;
  }
  .center_line .content03 .content_box {
    margin: 75px 0 115px auto;
    width: calc(100% - 76px);
  }
  .center_line .content03 .content_box .content_img {
    margin-right: 6px;
  }
  .center_line .content03 .content_box .content_img + .content_txt {
    margin: 17.5px 0 0;
  }
}
.center_line .content04 .basein {
  max-width: 1130px;
  margin: 0 auto;
  width: 100%;
  justify-content: space-between;
}
.center_line .content04 .basein .slider_wrap {
  max-width: 600px;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .center_line .content04 .basein .slider_wrap {
    order: 2;
  }
  .center_line .content04 .basein .slider_wrap .credit_txt {
    margin: 16.5px 20px 0;
  }
}
.center_line .content04 .basein .content_box {
  max-width: 340px;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .center_line .content04 .basein .content_box {
    order: 1;
    margin: 0 6px 75px auto;
    width: calc(100% - 76px);
    max-width: 100%;
  }
}
.center_line .content05 .basein {
  max-width: 1080px;
}
.center_line .content05 .basein .two_column {
  margin: 330px auto;
  gap: 10px;
}
@media screen and (max-width: 768px) {
  .center_line .content05 .basein .two_column {
    margin: 150px 0 140px;
    display: block;
  }
}
.center_line .content05 .basein .two_column li {
  width: calc(50% - 5px);
}
@media screen and (max-width: 768px) {
  .center_line .content05 .basein .two_column li {
    width: calc(100% - 195px);
    margin: 0 auto;
  }
  .center_line .content05 .basein .two_column li:first-child {
    margin-bottom: 5px;
  }
}
@media screen and (max-width: 768px) {
  .center_line .content05 .basein .img_area .credit_txt {
    margin: 16.5px 20px 0;
  }
}
.center_line .content06 {
  max-width: 450px;
  margin: 350px auto;
}
@media screen and (max-width: 768px) {
  .center_line .content06 {
    max-width: 100%;
    margin: 0 auto;
  }
}
.center_line .content06 .one_column {
  margin: 255px auto;
}
@media screen and (max-width: 768px) {
  .center_line .content06 .one_column {
    margin: 115px auto;
    width: calc(100% - 75px);
  }
  .center_line .content06 .one_column .credit_txt {
    display: grid;
    justify-content: center;
  }
}
.center_line .content07 .basein {
  max-width: 1130px;
  justify-content: space-between;
}
.center_line .content07 .basein .slider_wrap {
  max-width: 340px;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .center_line .content07 .basein .slider_wrap {
    margin: 25px 6px 75px auto;
    width: calc(100% - 76px);
    max-width: 100%;
  }
}
.center_line .content07 .basein .content_box {
  max-width: 600px;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .center_line .content07 .basein .content_box .credit_txt {
    margin: 16.5px 20px 0;
  }
}
.center_line .content08 .basein .two_column {
  margin: 300px auto 325px;
}
@media screen and (max-width: 768px) {
  .center_line .content08 .basein .two_column {
    margin: 112.5px auto 142.5px;
  }
  .center_line .content08 .basein .two_column .slider_wrap {
    margin: 25px auto 75px 6px;
    width: calc(100% - 121px);
    max-width: 100%;
  }
  .center_line .content08 .basein .two_column > li:last-child {
    margin: 0 6px 0 auto;
    width: calc(100% - 76px);
    max-width: 100%;
  }
}
.center_line .content08 .basein .two_column .content_box .credit_txt li {
  width: 100%;
}
.center_line .content09 .basein .flexed-center {
  max-width: 1130px;
  width: 100%;
  justify-content: space-between;
}
.center_line .content09 .basein .flexed-center.slider li:first-child {
  max-width: 600px;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .center_line .content09 .basein .flexed-center.slider li:first-child {
    order: 2;
  }
}
.center_line .content09 .basein .flexed-center.slider li:last-child {
  max-width: 338px;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .center_line .content09 .basein .flexed-center.slider li:last-child {
    order: 1;
    margin: 115px auto 125px;
    max-width: 100%;
    width: calc(100% - 55px);
  }
  .center_line .content09 .basein .flexed-center.slider li:last-child.no_mrgin {
    margin: 0;
  }
}
.center_line .content09 .basein .credit_txt {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .center_line .content09 .credit_txt {
    margin: 16.5px 20px 0;
  }
}
.center_line .content10 .basein .two_column {
  max-width: 725px;
  gap: 10px;
  margin: 300px auto 300px;
}
@media screen and (max-width: 768px) {
  .center_line .content10 .basein .two_column {
    margin: 190px 0 150px;
    display: block;
  }
}
.center_line .content10 .basein .two_column li {
  width: calc(50% - 5px);
}
@media screen and (max-width: 768px) {
  .center_line .content10 .basein .two_column li {
    width: calc(100% - 195px);
    margin: 0 auto;
  }
  .center_line .content10 .basein .two_column li:first-child {
    margin-bottom: 5px;
  }
}
.center_line .content10 .one_column {
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .center_line .content10 .one_column {
    margin: 0 16px;
    width: calc(100% - 32px);
  }
}
.center_line .content11 .basein .one_column {
  max-width: 400px;
}
@media screen and (max-width: 768px) {
  .center_line .content11 .basein .one_column {
    margin: 165px auto;
    max-width: 100%;
    width: calc(100% - 75px);
  }
}
.center_line .content11 .basein .one_column:last-child {
  margin: 275px auto 350px;
}
.center_line .content11 .basein .full_img {
  max-width: 1080px;
  margin: 0 auto;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .center_line .content11 .basein .credit_txt {
    margin: 15px 15px 0;
  }
}
.center_line .content11 .basein .credit_txt li {
  width: 100%;
}
.center_line .content11 .basein .content_box.one_column {
  margin: 166.5px auto 140px;
  width: calc(100% - 190px);
}
@media screen and (max-width: 768px) {
  .center_line .content11 .basein .content_txt .credit_txt {
    margin: 15px 0 15px;
  }
  .center_line .content11 .basein .content_txt li {
    width: 100%;
  }
}

/** FOOTER **/
footer {
  margin-top: 0;
  margin-bottom: 66.6666666667vw auto 0;
  text-align: center;
}
@media screen and (min-width: 769px) {
  footer {
    margin: 220px auto 0;
  }
}
footer .btn {
  width: 70%;
  display: block;
  margin: 10px auto;
}
@media screen and (min-width: 769px) {
  footer .btn {
    width: 284px;
  }
}
footer .insta svg {
  margin: 53.3333333333vw auto 20px;
  width: 20px;
}
@media screen and (min-width: 769px) {
  footer .insta svg {
    margin: 175px auto 23px;
    width: 30px;
  }
}
footer .copy {
  font-size: 9px;
  margin-bottom: 110px;
}

.staff_credit {
  margin: 60vw auto;
  font-size: 12px;
}
@media screen and (min-width: 769px) {
  .staff_credit {
    margin: 300px auto;
    font-size: 13px;
  }
}
.staff_credit p {
  padding-bottom: 1.3333333333vw;
}
@media screen and (min-width: 769px) {
  .staff_credit p {
    padding-bottom: 8px;
  }
}
.staff_credit p:last-child {
  padding-bottom: 0;
  line-height: 1.2;
}/*# sourceMappingURL=style.css.map */