/*! Writen  by SCSS */
.sec .inner {
  max-width: 1200px; }
.sec .color_wh {
  color: #fff;
  color: #dcdddd; }
.sec .btn_vm a {
  font-size: clamp(12px, calc(18vw / 11.8), 18px);
  line-height: 1;
  display: block;
  width: 70%;
  max-width: 360px;
  background: #363531;
  text-align: center !important;
  padding: 0.6em;
  transition: all 0.3s ease-in-out 0s; }
  .sec .btn_vm a:hover {
    background: #774f24; }
  .sec .btn_vm a img {
    width: 10em; }
.sec .btn_vm.c a {
  margin-inline: auto; }
.sec .btn_vm.r a {
  margin-left: auto; }
.sec .btn_vm.l a {
  margin-right: auto; }
.sec .btn_lm a {
  font-size: clamp(12px, calc(19vw / 11.8), 19px);
  line-height: 1;
  display: block;
  background: #363531;
  text-align: center !important;
  padding: 0.6em;
  transition: all 0.3s ease-in-out 0s;
  text-decoration: none; }
  .sec .btn_lm a:hover {
    background: #774f24; }
  .sec .btn_lm a p {
    display: flex;
    justify-content: center;
    gap: 1.2em;
    margin-bottom: 0.6em; }
    @media screen and (max-width: 480px) {
      .sec .btn_lm a p {
        flex-direction: column;
        gap: 0.8em;
        margin-bottom: 0.9em; } }
    .sec .btn_lm a p .en {
      font-size: 150%;
      color: #c9a063;
      text-decoration: none; }
    .sec .btn_lm a p .ja {
      color: #fff;
      font-size: 150%; }
  .sec .btn_lm a img {
    width: 10em; }
.sec .t01 {
  font-size: clamp(18px, calc(28vw / 11.8), 28px);
  font-size: clamp(18px, calc(27vw / 11.8), 27px);
  letter-spacing: 0.15em;
  line-height: 1.86;
  line-height: 1.7;
  font-weight: 600;
  margin-bottom: 0.7em;
  margin-bottom: 0.4em; }
  @media screen and (max-width: 480px) {
    .sec .t01 {
      font-size: calc(16vw / 3.9);
      margin-bottom: 1em; } }
.sec .t02 {
  font-size: clamp(20px, calc(44vw / 11.8), 44px);
  font-size: clamp(20px, calc(39vw / 11.8), 39px);
  letter-spacing: 0.15em;
  line-height: 1.678;
  line-height: 1.5;
  font-weight: 600;
  margin-bottom: 0.8em; }
  @media screen and (max-width: 480px) {
    .sec .t02 {
      margin-bottom: 1em;
      font-size: calc(22vw / 3.9); } }
.sec .t03 {
  font-size: clamp(12px, calc(18vw / 11.8), 18px);
  font-size: clamp(12px, calc(22vw / 11.8), 22px);
  font-size: clamp(12px, calc(21vw / 11.8), 21px);
  letter-spacing: 0.15em;
  line-height: 3.2;
  line-height: 2.8;
  font-weight: 600; }
  @media screen and (max-width: 480px) {
    .sec .t03 {
      font-size: calc(14vw / 3.9);
      line-height: 2; } }
.sec .sec_ttl_en {
  margin-bottom: 0.7em; }
.sec .sec_ttl_sub {
  font-size: clamp(12px, calc(22vw / 11.8), 22px);
  letter-spacing: 0.15em;
  line-height: 1.4;
  font-weight: 600;
  margin: 0 auto 2em;
  padding: 0 1.7em 0.2em;
  width: fit-content;
  border-bottom: solid 1px #333333; }
  @media screen and (max-width: 480px) {
    .sec .sec_ttl_sub {
      font-size: calc(15vw / 3.9);
      padding: 0 1em 0.2em; } }
.sec .sec_ttl {
  font-size: clamp(20px, calc(36vw / 11.8), 36px);
  font-size: clamp(20px, calc(32vw / 11.8), 32px);
  font-size: clamp(18px, calc(28vw / 11.8), 28px);
  letter-spacing: 0.15em;
  line-height: 1.4;
  font-weight: 600;
  margin-bottom: 0.6em; }
  @media screen and (max-width: 480px) {
    .sec .sec_ttl {
      letter-spacing: 0.1em;
      font-size: calc(18vw / 3.9);
      line-height: 1.8; } }
  .sec .sec_ttl .sup_box sup {
    top: -0.05em; }
.sec .sec_ttl2 {
  font-size: clamp(20px, calc(28vw / 11.8), 28px);
  font-size: clamp(18px, calc(25vw / 11.8), 25px);
  letter-spacing: 0.15em;
  line-height: 1.6;
  font-weight: 600;
  margin-bottom: 0.6em; }
  @media screen and (max-width: 480px) {
    .sec .sec_ttl2 {
      letter-spacing: 0.1em;
      font-size: calc(17vw / 3.9);
      font-size: calc(16vw / 3.9); } }
.sec .sec_lead {
  font-size: clamp(12px, calc(198vw / 11.8), 19px);
  letter-spacing: 0.15em;
  line-height: 2.8;
  font-weight: 600; }
  @media screen and (max-width: 480px) {
    .sec .sec_lead {
      letter-spacing: 0.1em;
      font-size: calc(14vw / 3.9);
      line-height: 2.2; } }
  .sec .sec_lead .sup_box sup {
    top: 1.8em; }

:root {
  interpolate-size: allow-keywords; }

.sec00 {
  padding: 140px 0 60px;
  background: #363530;
  color: #dcdddd;
  color: #dcdddd; }
  @media screen and (max-width: 480px) {
    .sec00 {
      padding: 80px 0 40px; } }
  @media screen and (max-width: 480px) {
    .sec00 .img001 {
      width: calc(100% + 60px);
      margin-inline: -30px; } }
  .sec00 .box1 {
    width: fit-content;
    margin-inline: auto; }
    .sec00 .box1 p {
      width: fit-content; }
  .sec00 .ac_btn1,
  .sec00 .ac_btn2 {
    cursor: pointer;
    width: fit-content;
    margin-inline: auto;
    transition: all 0.3s ease-in-out 0s;
    position: relative; }
    .sec00 .ac_btn1:hover,
    .sec00 .ac_btn2:hover {
      opacity: 0.6; }
    .sec00 .ac_btn1 .btn,
    .sec00 .ac_btn2 .btn {
      position: absolute;
      bottom: 8%;
      left: 0;
      right: 0;
      font-size: clamp(10px, calc(17vw / 12.6), 17px);
      line-height: 1;
      font-weight: 600;
      color: #b5b5b6;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 1em; }
      @media screen and (max-width: 480px) {
        .sec00 .ac_btn1 .btn,
        .sec00 .ac_btn2 .btn {
          font-size: calc(12vw / 3.9);
          bottom: 10%; } }
      .sec00 .ac_btn1 .btn .txt,
      .sec00 .ac_btn2 .btn .txt {
        letter-spacing: 0.1em; }
      .sec00 .ac_btn1 .btn .icon,
      .sec00 .ac_btn2 .btn .icon {
        background: #dcdddd;
        padding: 0.3em;
        position: relative;
        width: 2.6em;
        height: 1.8em; }
        .sec00 .ac_btn1 .btn .icon .inn,
        .sec00 .ac_btn2 .btn .icon .inn {
          position: relative;
          width: 100%;
          height: 100%;
          transform-origin: center center;
          transition-duration: 0.3s; }
          .sec00 .ac_btn1 .btn .icon .inn:before, .sec00 .ac_btn1 .btn .icon .inn:after,
          .sec00 .ac_btn2 .btn .icon .inn:before,
          .sec00 .ac_btn2 .btn .icon .inn:after {
            content: "";
            background-color: #363530;
            border-radius: 10px;
            width: 2em;
            height: 2px;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            transform-origin: center center; }
          .sec00 .ac_btn1 .btn .icon .inn:before,
          .sec00 .ac_btn2 .btn .icon .inn:before {
            width: 2px;
            height: 1.2em;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%); }
    .sec00 .ac_btn1.on .btn .icon .inn,
    .sec00 .ac_btn2.on .btn .icon .inn {
      -webkit-transform: rotate(-180deg);
      transform: rotate(-180deg); }
      .sec00 .ac_btn1.on .btn .icon .inn:before,
      .sec00 .ac_btn2.on .btn .icon .inn:before {
        content: none; }
  .sec00 .ac_btn2 {
    position: relative; }
    .sec00 .ac_btn2 .btn {
      position: relative; }
  .sec00 .ac_cont {
    overflow: hidden;
    height: 0;
    transition: all 0.4s ease-in-out 0s; }
    .sec00 .ac_cont.on {
      height: auto; }
    .sec00 .ac_cont .inner {
      max-width: 1220px;
      max-width: 968px;
      padding: 100px 0 0; }
      @media screen and (max-width: 480px) {
        .sec00 .ac_cont .inner {
          padding: 50px 0 0; } }
    .sec00 .ac_cont .sec_ttl_en {
      color: #fff;
      color: #dcdddd; }
    .sec00 .ac_cont .t01 {
      font-size: clamp(14px, calc(22vw / 11.8), 22px);
      font-size: clamp(14px, calc(19vw / 11.8), 19px);
      font-weight: 400; }
      @media screen and (max-width: 480px) {
        .sec00 .ac_cont .t01 {
          font-size: calc(16vw / 3.9); } }
    .sec00 .ac_cont .t02 {
      font-size: clamp(20px, calc(40vw / 11.8), 40px);
      font-size: clamp(20px, calc(34vw / 11.8), 34px);
      color: #b28247;
      margin-bottom: 0.4em; }
      @media screen and (max-width: 480px) {
        .sec00 .ac_cont .t02 {
          margin-bottom: 0.6em;
          font-size: calc(20vw / 3.9); } }
    .sec00 .ac_cont .han {
      max-width: 764px;
      margin-inline: auto;
      display: flex;
      justify-content: flex-end;
      gap: 1.4em;
      font-size: clamp(12px, calc(17vw / 12.6), 17px);
      line-height: 1;
      font-weight: 600; }
      @media screen and (max-width: 480px) {
        .sec00 .ac_cont .han {
          font-size: calc(12vw / 3.9); } }
      .sec00 .ac_cont .han .han1 {
        color: #c30d23;
        display: inline-block;
        margin-right: 0.3em; }
      .sec00 .ac_cont .han .han2 {
        color: #00913a;
        display: inline-block;
        margin-right: 0.3em; }
    .sec00 .ac_cont .box2 .box2_ttl {
      font-size: clamp(16px, calc(30vw / 12.6), 30px);
      font-size: clamp(16px, calc(28vw / 12.6), 28px);
      line-height: 1;
      letter-spacing: 0.6em;
      font-weight: 600;
      margin-bottom: 1em; }
      @media screen and (max-width: 480px) {
        .sec00 .ac_cont .box2 .box2_ttl {
          font-size: calc(20vw / 3.9);
          font-size: calc(16vw / 3.9); } }
    .sec00 .ac_cont .box2 ul {
      display: flex;
      flex-wrap: wrap;
      gap: 40px calc(60% / 12.2);
      gap: 40px calc(40% / 9.68); }
      .sec00 .ac_cont .box2 ul li {
        width: calc(580% / 12.2);
        width: calc(464% / 9.68); }
        .sec00 .ac_cont .box2 ul li .txt {
          background: #c9bc9c;
          font-size: clamp(12px, calc(19vw / 9.68), 19px);
          line-height: 1;
          letter-spacing: 0.1em;
          font-weight: 600; }
          @media screen and (max-width: 480px) {
            .sec00 .ac_cont .box2 ul li .txt {
              font-size: calc(13vw / 3.9);
              letter-spacing: 0.02em; } }
          .sec00 .ac_cont .box2 ul li .txt p {
            color: #333;
            display: flex;
            justify-content: center;
            justify-content: flex-start;
            align-items: baseline; }
            @media screen and (max-width: 480px) {
              .sec00 .ac_cont .box2 ul li .txt p {
                flex-direction: column;
                justify-content: center;
                align-items: center;
                text-align: center;
                margin-inline: 0;
                margin-left: 0;
                margin-right: 0; } }
            .sec00 .ac_cont .box2 ul li .txt p .t {
              text-align: left; }
              @media screen and (max-width: 480px) {
                .sec00 .ac_cont .box2 ul li .txt p .t {
                  text-align: center; } }
            .sec00 .ac_cont .box2 ul li .txt p .s {
              font-size: 80%; }
            .sec00 .ac_cont .box2 ul li .txt p .no {
              display: block;
              width: 1.1489em;
              margin-right: 0.2em;
              display: flex;
              align-items: center;
              justify-content: center;
              line-height: 1.2;
              letter-spacing: normal;
              color: #fff;
              transform: translateY(0.2em); }
              @media screen and (max-width: 480px) {
                .sec00 .ac_cont .box2 ul li .txt p .no {
                  margin-bottom: 0.5em; } }
              .sec00 .ac_cont .box2 ul li .txt p .no span {
                display: inline-block; }
              .sec00 .ac_cont .box2 ul li .txt p .no img {
                width: 1.1489em; }

.bg_wrap {
  background: url("../images/top/bg.jpg") center center/cover; }

.sec01 {
  padding: 100px 0 50px;
  background: url("../images/concept/sec1_bg1.png") right 10% no-repeat;
  background-size: calc(1266% / 19.2) auto; }
  @media screen and (max-width: 480px) {
    .sec01 {
      padding: 40px 0 40px;
      padding-bottom: 50px;
      background-position: right 15%;
      background-size: 140% auto; } }
  .sec01 .box11 {
    display: flex;
    justify-content: center;
    align-items: center; }
    @media screen and (max-width: 480px) {
      .sec01 .box11 {
        flex-direction: column-reverse;
        gap: 20px; }
        .sec01 .box11 .ill .t_cap_b {
          bottom: -10px;
          right: 0; }
        .sec01 .box11 .fig {
          width: 65%;
          margininline: auto; } }
    @media screen and (max-width: 480px) {
      .sec01 .box11 figcaption {
        bottom: 0; } }

.sec02 {
  padding: 100px 0 30px;
  background: url("../images/concept/sec2_bg1.png") left 10% no-repeat;
  background-size: calc(965% / 19.2) auto; }
  @media screen and (max-width: 480px) {
    .sec02 {
      padding: 40px 0 20px;
      padding-top: 0;
      background-position: left 15%;
      background-size: 120% auto; } }
  .sec02 .cap_ex {
    font-size: 14px; }
    @media screen and (max-width: 480px) {
      .sec02 .cap_ex {
        font-size: 12px; } }

.sec03 {
  padding: 100px 0 50px;
  background: url("../images/concept/sec3_bg1.png") right 10% no-repeat;
  background-size: calc(1062% / 19.2) auto; }
  @media screen and (max-width: 480px) {
    .sec03 {
      padding: 40px 0 20px;
      background-position: right 15%;
      background-size: 140% auto; } }
  .sec03 .bg {
    background: #363531;
    padding: 60px 0;
    color: #fff; }
    @media screen and (max-width: 480px) {
      .sec03 .bg {
        padding: 30px 0; } }
  .sec03 .box31 {
    display: flex;
    justify-content: center;
    gap: 30px calc(45% / 12); }
    @media screen and (max-width: 480px) {
      .sec03 .box31 {
        flex-direction: column; } }
    .sec03 .box31 li {
      width: calc(370% / 12); }
      @media screen and (max-width: 480px) {
        .sec03 .box31 li {
          width: 100%; } }

.sec04 {
  padding: 100px 0 80px;
  background: url("../images/concept/sec4_bg1.png") left 10% no-repeat;
  background-size: calc(996% / 19.2) auto; }
  @media screen and (max-width: 480px) {
    .sec04 {
      padding: 40px 0 40px;
      background-position: left 15%;
      background-size: 120% auto; } }
  .sec04 .box41 {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px calc(20% / 12); }
    @media screen and (max-width: 480px) {
      .sec04 .box41 {
        flex-direction: column;
        gap: 15px; } }
    .sec04 .box41 li {
      width: calc(590% / 12); }
      @media screen and (max-width: 480px) {
        .sec04 .box41 li {
          width: 100%; } }
  @media screen and (max-width: 480px) {
    .sec04 .box42 {
      width: 85%;
      margin-inline: auto; } }
  .sec04 .box42 .ttl {
    font-size: clamp(16px, calc(30vw / 11.8), 30px);
    margin-bottom: 1em;
    line-height: 1.6; }
    @media screen and (max-width: 480px) {
      .sec04 .box42 .ttl {
        font-size: calc(16vw / 3.9);
        margin-bottom: 20px;
        margin-inline: -20px; } }
  .sec04 .box42 .text {
    text-align: center;
    font-size: clamp(12px, calc(19vw / 11.8), 19px);
    line-height: 1;
    margin-bottom: clamp(20px, calc(30vw / 11.8), 30px); }
    @media screen and (max-width: 480px) {
      .sec04 .box42 .text {
        margin-inline: -20px; } }

sup {
  font-size: 40%; }

.sup_box {
  display: inline-block;
  position: relative; }
  .sup_box sup {
    position: absolute;
    right: 0;
    top: -0.1em; }

@media screen and (max-width: 480px) {
  .sld1 img {
    max-width: none;
    width: 600px; } }

@media screen and (max-width: 480px) {
  .sld2 img {
    max-width: 600px;
    width: 600px; } }

@media screen and (max-width: 480px) {
  .sp_w {
    width: calc(100% + 40px);
    margin-inline: -20px; } }

.cap_l.ex,
.cap_r.ex {
  font-size: 14px;
  letter-spacing: 0.05em; }
  @media screen and (max-width: 480px) {
    .cap_l.ex,
    .cap_r.ex {
      font-size: 12px; } }

/*# sourceMappingURL=concept.css.map */