@charset "UTF-8";

:root {
  --lpSetSize: (100vw / 1400)* 0.6596;
}

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,
i,
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;
  vertical-align: baseline;
  box-sizing: border-box;
}

.l-header {
  padding: 0;
  position: relative;
  z-index: 999;
  background-color: #fff;
  overflow-x: clip;
}

.l-footer {
  padding: 0;
  position: relative;
  z-index: 999;
  background-color: #fff;
  overflow-x: clip;
}

.pc-footer {
  margin: 0;
}

ul li {
  list-style: none;
}

#feature .main {
  width: calc(750 * var(--lpSetSize));
  order: 2;
  z-index: 20;
}

#feature .left {
  position: sticky;
  top: 80px;
  left: 0;
  width: 100%;
  height: calc(100vh - 80px);
  display: flex;
  order: 1;
  flex: 1;
  justify-content: center;
  align-items: center;
  background: #e2ddd9;
}

#feature .left .pc_hero_main {
  width: fit-content;
  height: 100vh;
  margin: auto;
  position: relative;
  box-sizing: border-box;
  overflow: hidden;
}

#feature .left .pc_hero_main img {
  width: 100%;
  height: 100vh;
}

#feature .left .pc_hero {
  margin: auto;
}

#feature .left .pc_logo {
  width: calc(572 * var(--lpSetSize));
  position: absolute;
  top: calc(35 * var(--lpSetSize));
  left: 53%;
  transform: translate(-50%);
  z-index: 20;
  pointer-events: none;
}

#feature .right {
  position: sticky;
  top: 80px;
  left: 0;
  width: 100%;
  height: calc(100vh - 80px);
  display: flex;
  order: 3;
  flex: 1;
  justify-content: center;
  align-items: start;
  background: #e2ddd9;
}

#feature .right .right_content {
  margin-top: calc(271 * var(--lpSetSize));
}

#feature .right_list li {
  margin: auto;
  text-align: center;
  width: fit-content;
}

#feature .right_list a {
  color: #897167;
  border-bottom: calc(0.67* var(--lpSetSize)) solid #897167;
  font-size: calc(30.9 * var(--lpSetSize));
  font-family: "freight-big-pro", serif;
  font-weight: 500;
  font-style: normal;
  line-height: 1.2;
}

#feature .right_list li:nth-child(1) a {
  line-height: 1;
  padding-bottom: calc(5 * var(--lpSetSize));
}

#feature .right_list li:nth-child(3) a {
  line-height: 1;
  padding-bottom: 0;
}

#feature .right_list li:nth-child(4) a {
  padding-bottom: calc(-7 * var(--lpSetSize));
}

#feature .right_list li:nth-child(5) a {
  line-height: 1;
  padding-bottom: 0;
}

#feature .right_list li:nth-child(1) {
  width: fit-content;
  margin: calc(-31 * var(--lpSetSize)) auto 0;
  letter-spacing: 0.01em;
  transform: translateX(calc(-6 * var(--lpSetSize)));
}

#feature .right_list li:nth-child(2) {
  margin: calc(13 * var(--lpSetSize)) auto 0;
}

#feature .right_list li:nth-child(3) {
  margin: calc(17 * var(--lpSetSize)) auto 0;
}

#feature .right_list li:nth-child(4) {
  margin: calc(20 * var(--lpSetSize)) auto 0;
}

#feature .right_list li:nth-child(5) {
  margin: calc(17 * var(--lpSetSize)) auto 0;
}

#feature .right .pc_btn {
  width: calc(293 * var(--lpSetSize));
  margin: calc(38 * var(--lpSetSize)) auto 0;
}


/*-------------------------
 Content
-------------------------*/
.l-container {
  width: 100%;
  overflow: clip;
}

#feature {
  box-sizing: border-box;
  overflow: clip;
  position: relative;
  width: 100%;
  color: #000;
  display: flex;
  background: #e2ddd9;
  z-index: 20;
}

#feature .feature__inner {
  width: calc(750 * var(--lpSetSize));
  height: fit-content;
  margin: 0;
  position: relative;
  overflow: clip;
  background: #3a2a25;
}

#feature a {
  transition: all 0.3s ease-in-out;
  display: block;
  transform: none;
  text-decoration: none;
}

#feature a:hover {
  cursor: pointer;
  opacity: .7;
  transition: all 0.3s ease-in-out;
}

#feature img,
svg,
video {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  overflow: visible;
}

#feature .section {
  position: relative;
}

#feature .section04 {
  padding-bottom: calc(166 * var(--lpSetSize));
}

#feature .section__inner {
  width: 100%;
}

#feature .block_area {
  position: relative;
  height: fit-content;
}

/*-------------------------
 Text_loop
-------------------------*/
#feature .text_loop {
  width: 100%;
  overflow: hidden;
  background: #ddd7ce;
  border-top: calc(8 * var(--lpSetSize)) solid #514440;
  border-bottom: calc(8 * var(--lpSetSize)) solid #514440;
}

#feature .text_loop_inner {
  display: flex;
  align-items: center;
  width: max-content;
  height: calc(64 * var(--lpSetSize));
  transform: translate3d(0, 0, 0);
  will-change: transform;
  animation: none;
}

#feature .text_loop_inner.is-ready {
  animation: loopText 50s linear infinite;
}

#feature .text_loop_inner img {
  display: block;
  height: calc(29 * var(--lpSetSize));
  width: auto;
  max-width: none;
  flex: none;
  margin-top: calc(5 * var(--lpSetSize));
}

@keyframes loopText {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    transform: translate3d(-50%, 0, 0);
  }
}

/*-------------------------
 hero
-------------------------*/
#feature .hero {
  width: calc(646.2799 * var(--lpSetSize));
  height: fit-content;
  margin: 0 auto;
  padding-top: calc(70 * var(--lpSetSize));
  position: relative;
}

#feature .logo {
  width: calc(640.1872 * var(--lpSetSize));
  position: absolute;
  top: calc(30 * var(--lpSetSize));
  left: 50%;
  transform: translate(-50%);
  z-index: 20;
}

#feature .hero_main img {
  transform: translateX(calc(-3 * var(--lpSetSize)));
}

/*-------------------------
 Text
-------------------------*/
#feature .main_content h2 {
  font-size: calc(72.96 * var(--lpSetSize));
  margin-top: calc(113 * var(--lpSetSize));
  letter-spacing: 0.005em;
  text-align: center;
  color: #e2d4bc;
  font-family: "freight-big-pro", serif;
  font-weight: 500;
  font-style: normal;
}

#feature .main_content h2.ttl02 {
  margin-top: calc(54 * var(--lpSetSize));
  letter-spacing: 0.01em;
}

#feature .main_content h2.ttl03 {
  margin-top: calc(57 * var(--lpSetSize));
  letter-spacing: 0.01em;
}

#feature .main_content h2.ttl04 {
  margin-top: calc(54 * var(--lpSetSize));
  margin-left: calc(3 * var(--lpSetSize));
  letter-spacing: 0.012em;
}

#feature .main_content h2.ttl05 {
  margin-top: calc(60 * var(--lpSetSize));
  letter-spacing: 0.01em;
  line-height: 1.29;
}

#feature .main_content h2.ttl05 span:nth-of-type(1) {
  margin-left: calc(-11 * var(--lpSetSize));
  letter-spacing: 0.02em;
}

#feature .main_content h2.ttl05 span:nth-of-type(2) {
  margin-left: calc(13 * var(--lpSetSize));
  letter-spacing: 0.02em;
}

#feature .main_content h2.ttl05 span:nth-of-type(3) {
  margin-left: calc(2 * var(--lpSetSize));
  letter-spacing: 0.006em;
}

#feature .main_content h3 {
  font-size: calc(72.96 * var(--lpSetSize));
  margin-top: calc(60 * var(--lpSetSize));
  letter-spacing: 0.01em;
  text-align: center;
  color: #e2d4bc;
  font-family: "freight-big-pro", serif;
  font-weight: 500;
  font-style: normal;
}

#feature .main_content p {
  font-size: calc(24 * var(--lpSetSize));
  margin-top: calc(21 * var(--lpSetSize));
  letter-spacing: 0.01em;
  line-height: 2.08;
  text-align: center;
  color: #e2d4bc;
  font-family: "shippori-mincho", sans-serif;
  font-weight: 400;
  font-style: normal;
}

#feature .main_content p.text span:nth-of-type(1) {
  letter-spacing: 0.04em;
  margin-left: calc(1 * var(--lpSetSize));
}

#feature .main_content p.text span:nth-of-type(3) {
  letter-spacing: 0.02em;
  margin-left: calc(2 * var(--lpSetSize));
}

#feature .main_content p.text span:nth-of-type(4) {
  letter-spacing: 0.12em;
  margin-left: calc(0 * var(--lpSetSize));
}

#feature .main_content p.text span:nth-of-type(5) {
  letter-spacing: 0.05em;
  margin-left: calc(4 * var(--lpSetSize));
}

#feature .main_content p.text span:nth-of-type(6) {
  letter-spacing: 0;
  margin-left: calc(2 * var(--lpSetSize));
}

#feature .main_content p.text_02 {
  margin-top: calc(9 * var(--lpSetSize));
  margin-left: calc(2 * var(--lpSetSize));
  letter-spacing: 0.02em;
}

#feature .main_content p.text_02 span {
  letter-spacing: 0.03em;
  margin-left: calc(-5 * var(--lpSetSize));
}

#feature .main_content p.text_03 {
  margin: calc(1 * var(--lpSetSize)) 0 0 calc(6 * var(--lpSetSize));
  line-height: 1.7;
}

#feature .main_content p.text_03 span:nth-of-type(1) {
  letter-spacing: 0.02em;
  margin-left: calc(-2 * var(--lpSetSize));
}

#feature .main_content p.text_03 span:nth-of-type(2) {
  letter-spacing: 0;
  margin-left: calc(-5 * var(--lpSetSize));
}

#feature .main_content p.text_04 {
  margin-top: calc(8 * var(--lpSetSize));
}

#feature .main_content p.text_04 span:nth-of-type(1) {
  letter-spacing: 0.1em;
  margin-left: calc(2 * var(--lpSetSize));
}

#feature .main_content p.text_04 span:nth-of-type(2) {
  letter-spacing: 0;
  margin-left: calc(-11 * var(--lpSetSize));
}

#feature .main_content p.text_05 {
  margin-top: calc(13 * var(--lpSetSize));
}

#feature .main_content p.text_05 span:nth-of-type(1) {
  letter-spacing: 0.05em;
  margin-left: calc(1 * var(--lpSetSize));
}

#feature .main_content p.text_05 span:nth-of-type(2) {
  letter-spacing: -0.02em;
  margin-left: calc(-7 * var(--lpSetSize));
}

#feature .footer_area {
  position: relative;
  width: calc(750 * var(--lpSetSize));
  height: calc(920* var(--lpSetSize));
}

#feature .footer_area::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: calc(750 * var(--lpSetSize));
  height: calc(920* var(--lpSetSize));
  background: url("../img/img08.jpg") no-repeat center / cover;
  z-index: 0;
}

#feature .footer_area .footer_list {
  font-size: calc(34 * var(--lpSetSize));
  letter-spacing: 0;
  line-height: 1;
  text-align: center;
  color: #fff;
  padding-top: calc(134 * var(--lpSetSize));
  font-family: "freight-big-pro", serif;
  font-weight: 500;
  font-style: normal;
  position: relative;
  z-index: 20;
}

#feature .footer_area .footer_list li {
  margin: auto;
}

#feature .footer_area .footer_list li a {
  color: #fff;
  border-bottom: calc(0.67* var(--lpSetSize)) solid #fff;
  padding-bottom: calc(6 * var(--lpSetSize));
}

#feature .footer_area .footer_list li:nth-child(3) a {
  padding-bottom: 0;
}

#feature .footer_area .footer_list li:nth-child(4) a {
  padding-bottom: calc(4 * var(--lpSetSize));
}

#feature .footer_area .footer_list li:nth-child(5) a {
  padding-bottom: calc(2 * var(--lpSetSize));
}

#feature .footer_area .footer_list li:nth-child(1) {
  width: calc(99.4181 * var(--lpSetSize));
  margin: calc(11 * var(--lpSetSize)) auto 0 calc(320 * var(--lpSetSize));
  letter-spacing: 0.01em;
}

#feature .footer_area .footer_list li:nth-child(2) {
  width: calc(139.051 * var(--lpSetSize));
  margin: calc(20 * var(--lpSetSize)) auto 0 calc(307 * var(--lpSetSize));
  letter-spacing: 0.018em;
}

#feature .footer_area .footer_list li:nth-child(3) {
  width: calc(155.5461 * var(--lpSetSize));
  margin: calc(20 * var(--lpSetSize)) auto 0 calc(298 * var(--lpSetSize));
  letter-spacing: 0.018em;
}

#feature .footer_area .footer_list li:nth-child(4) {
  width: calc(285.4912 * var(--lpSetSize));
  margin: calc(27 * var(--lpSetSize)) auto 0 calc(234 * var(--lpSetSize));
  letter-spacing: 0.014em;
}

#feature .footer_area .footer_list li:nth-child(5) {
  width: calc(244.7387 * var(--lpSetSize));
  margin: calc(22 * var(--lpSetSize)) auto 0 calc(254 * var(--lpSetSize));
  letter-spacing: 0.018em;
}

#feature .btn {
  width: calc(400 * var(--lpSetSize));
  margin: calc(53 * var(--lpSetSize)) 0 0 calc(176 * var(--lpSetSize));
  position: relative;
  z-index: 20;
}

#feature .logo02 {
  width: calc(484.4316 * var(--lpSetSize));
  margin: calc(130 * var(--lpSetSize)) auto 0;
  position: relative;
  z-index: 20;
}

/*-------------------------
 Item
-------------------------*/
#feature .item_area.item_area__01 {
  width: calc(600 * var(--lpSetSize));
  height: calc(640 * var(--lpSetSize));
  margin-top: calc(70 * var(--lpSetSize));
}

#feature .item_area.item_area__02 {
  width: calc(429.3179 * var(--lpSetSize));
  height: calc(320 * var(--lpSetSize));
  margin: calc(80 * var(--lpSetSize)) 0 0 calc(164 * var(--lpSetSize));
}

#feature .item_area.item_area__03 {
  width: calc(600 * var(--lpSetSize));
  height: calc(641.4669 * var(--lpSetSize));
  margin-top: calc(70 * var(--lpSetSize));
}

#feature .item_area.item_area__04 {
  width: calc(600 * var(--lpSetSize));
  height: calc(641.4669 * var(--lpSetSize));
  margin-top: calc(69 * var(--lpSetSize));
}


#feature .item_area {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0 auto;
}

#feature .item_area .item_set {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
  height: calc(320 * var(--lpSetSize));
  box-sizing: border-box;
}

#feature .item_area .item_set:nth-child(odd) {
  border-right: calc(1 * var(--lpSetSize)) solid #fff;
  margin-right: calc(-1 * var(--lpSetSize));
}

#feature .item_area .item_set:nth-child(-n + 2) {
  border-bottom: calc(1 * var(--lpSetSize)) solid #fff;
}

#feature .item_area.item_area__03 .item_set:nth-child(1),
#feature .item_area.item_area__03 .item_set:nth-child(2),
#feature .item_area.item_area__03 .item_set:nth-child(3),
#feature .item_area.item_area__03 .item_set:nth-child(4) {
  border-bottom: calc(1 * var(--lpSetSize)) solid #fff;
}

#feature .item_area.item_area__04 .item_set:nth-child(1),
#feature .item_area.item_area__04 .item_set:nth-child(2),
#feature .item_area.item_area__04 .item_set:nth-child(3),
#feature .item_area.item_area__04 .item_set:nth-child(4) {
  border-bottom: calc(1 * var(--lpSetSize)) solid #fff;
  margin-top: calc(-2 * var(--lpSetSize));
}

#feature .item_area.item_area__02 .item_set:nth-child(-n + 2) {
  border-bottom: unset;
}

#feature .item_area .item_image {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: calc(190 * var(--lpSetSize));
  margin: 0;
}

#feature .item_area .item_image a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

#feature .item_area .item_image img {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

#feature .item01 {
  width: calc(176.6784 * var(--lpSetSize));
  margin: calc(2 * var(--lpSetSize)) 0 0 calc(-3 * var(--lpSetSize));
}

#feature .item02 {
  width: calc(119.4604 * var(--lpSetSize));
  margin: calc(47 * var(--lpSetSize)) 0 0 calc(-6 * var(--lpSetSize));
}

#feature .item03 {
  width: calc(130.055 * var(--lpSetSize));
  margin: calc(64 * var(--lpSetSize)) 0 0 calc(-2 * var(--lpSetSize));
}

#feature .item04 {
  width: calc(194.9937 * var(--lpSetSize));
  margin: calc(28 * var(--lpSetSize)) 0 0 calc(4 * var(--lpSetSize));
}

#feature .item05 {
  width: calc(141.0424 * var(--lpSetSize));
  margin: calc(47 * var(--lpSetSize)) 0 0 calc(-87 * var(--lpSetSize));
}

#feature .item06 {
  width: calc(88.6009 * var(--lpSetSize));
  margin: calc(81 * var(--lpSetSize)) 0 0 calc(88 * var(--lpSetSize));
}

#feature .item07 {
  width: calc(138.1582 * var(--lpSetSize));
  margin: calc(34 * var(--lpSetSize)) 0 0 calc(-4 * var(--lpSetSize));
}

#feature .item08 {
  width: calc(138.1582 * var(--lpSetSize));
  margin: calc(31 * var(--lpSetSize)) 0 0 calc(-6 * var(--lpSetSize));
}

#feature .item09 {
  width: calc(138.1582 * var(--lpSetSize));
  margin: calc(32 * var(--lpSetSize)) 0 0 calc(1 * var(--lpSetSize));
}

#feature .item10 {
  width: calc(162.6334 * var(--lpSetSize));
  margin: calc(22 * var(--lpSetSize)) 0 0 calc(-14 * var(--lpSetSize));
}

#feature .item11 {
  width: calc(162.6334 * var(--lpSetSize));
  margin: calc(33 * var(--lpSetSize)) auto 0;
}

#feature .item12 {
  width: calc(122.9518 * var(--lpSetSize));
  margin: calc(51 * var(--lpSetSize)) auto 0 calc(85 * var(--lpSetSize));
}

#feature .item13 {
  width: calc(138.785 * var(--lpSetSize));
  margin: calc(44 * var(--lpSetSize)) auto 0 calc(73 * var(--lpSetSize));
}

#feature .item14 {
  width: calc(226.2503 * var(--lpSetSize));
  margin: calc(-20 * var(--lpSetSize)) auto 0 calc(35 * var(--lpSetSize));
}

#feature .item15 {
  width: calc(138.1773 * var(--lpSetSize));
  margin: calc(46 * var(--lpSetSize)) auto 0 calc(71 * var(--lpSetSize));
}

/*-------------------------
 image
-------------------------*/
#feature .img01 {
  width: calc(550 * var(--lpSetSize));
  margin: calc(85 * var(--lpSetSize)) auto 0;
}

#feature .img01_2 {
  width: calc(264 * var(--lpSetSize));
  margin: calc(59 * var(--lpSetSize)) 0 0 0;
}

#feature .img02 {
  width: calc(750 * var(--lpSetSize));
  margin: calc(97 * var(--lpSetSize)) auto 0;
}

#feature .img03 {
  width: calc(700 * var(--lpSetSize));
  margin: calc(250 * var(--lpSetSize)) auto 0;
}

#feature .img04 {
  width: calc(750 * var(--lpSetSize));
  margin: calc(242 * var(--lpSetSize)) auto 0;
}

#feature .img05 {
  width: calc(515.3525 * var(--lpSetSize));
  margin: calc(80 * var(--lpSetSize)) auto 0;
}

#feature .img06 {
  width: calc(515.3525 * var(--lpSetSize));
  margin: calc(11 * var(--lpSetSize)) auto 0;
}

#feature .img07 {
  width: calc(700 * var(--lpSetSize));
  margin: calc(245 * var(--lpSetSize)) auto 0;
}

/*-------------------------
 credit
-------------------------*/
#feature .credit-inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: calc(-72 * var(--lpSetSize)) auto 0 calc(-11 * var(--lpSetSize));
}

#feature .credit01 .credit-inner {
  margin: calc(-71 * var(--lpSetSize)) auto 0 calc(-11 * var(--lpSetSize));
}

#feature .credit02 .credit-inner {
  margin: calc(-71 * var(--lpSetSize)) auto 0 calc(-5 * var(--lpSetSize));
}

#feature .credit03 .credit-inner {
  margin: calc(-52 * var(--lpSetSize)) auto 0 calc(-1 * var(--lpSetSize));
}

#feature .credit04 .credit-inner {
  margin: calc(-51 * var(--lpSetSize)) auto 0 calc(2 * var(--lpSetSize));
}

#feature .credit05 .credit-inner {
  margin: calc(-58 * var(--lpSetSize)) auto 0 calc(-87 * var(--lpSetSize));
}

#feature .credit06 .credit-inner {
  margin: calc(-57 * var(--lpSetSize)) auto 0 calc(89 * var(--lpSetSize));
}

#feature .credit07 .credit-inner {
  margin: calc(-71 * var(--lpSetSize)) auto 0 calc(-10 * var(--lpSetSize));
}

#feature .credit08 .credit-inner {
  margin: calc(-71 * var(--lpSetSize)) auto 0 calc(-4 * var(--lpSetSize));
}

#feature .credit09 .credit-inner {
  margin: calc(-74 * var(--lpSetSize)) auto 0 0;
}

#feature .credit10 .credit-inner {
  margin: calc(-74 * var(--lpSetSize)) auto 0 calc(-9 * var(--lpSetSize));
}

#feature .credit11 .credit-inner {
  margin: calc(-4 * var(--lpSetSize)) auto 0 calc(3 * var(--lpSetSize));
}

#feature .credit12 .credit-inner {
  margin: calc(-73 * var(--lpSetSize)) auto 0 calc(-12 * var(--lpSetSize));
}

#feature .credit13 .credit-inner {
  margin: calc(-74 * var(--lpSetSize)) auto 0 calc(-4 * var(--lpSetSize));
}

#feature .credit14 .credit-inner {
  margin: calc(-75 * var(--lpSetSize)) auto 0 calc(-1 * var(--lpSetSize));
}

#feature .credit15 .credit-inner {
  margin: calc(-75 * var(--lpSetSize)) auto 0 calc(-9 * var(--lpSetSize));
}

#feature .credit-inner a {
  font-size: calc(20 * var(--lpSetSize));
  letter-spacing: 0.035em;
  text-align: center;
  color: #e2d4bc;
  font-family: "shippori-mincho", sans-serif;
  font-weight: 400;
  font-style: normal;
}

/*-------------------------
 View All
-------------------------*/
#feature .btn_viewall {
  width: calc(111 * var(--lpSetSize));
  opacity: 0;
  transition: opacity 0.6s ease, transform 0.6s ease;
  pointer-events: none;
  position: fixed;
  left: 65.1%;
  transform: translate(-50%);
  bottom: calc(1 * var(--lpSetSize));
  z-index: 20;
}

#feature .btn_viewall.active {
  opacity: 1;
  pointer-events: auto;
}
