@charset "UTF-8";
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 {
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  margin: 0;
  padding: 0; }

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

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

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

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

.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  font-size: 0;
  clear: both;
  visibility: hidden; }

.clearfix {
  display: inline-block; }

/* Hides from IE Mac */
* html .clearfix {
  height: 1%; }

.clearfix {
  display: block; }

/* ---------- 初期 ---------- */
body {
  letter-spacing: 0;
  font-family: "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif; }

img {
  width: 100%;
  max-width: 100%;
  height: auto;
  line-height: 0; }

a {
  text-decoration: none; }

strong {
  font-weight: bold; }

/* ---------- /共通部分 ---------- */
#jougetyuou {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);
  margin: auto; }

#kadomaru {
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px; }

#resbtn {
  -webkit-appearance: none; }

.ancr {
  position: relative;
  transition: 0.5s; }

.anca {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 10;
  cursor: pointer; }

.ancr:hover {
  opacity: 0.75;
  transition: 0.5s;
  cursor: pointer; }

/* ---------- /参考タグ部分 ---------- */
.wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between; }

.Yumincho_demi {
  /* Mac向けのフォント指定を優先 */
  font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-weight: 600; }

.Yumincho_extra {
  font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN", "Noto Serif JP",　serif;
  font-weight: 800; }

html {
  font-size: calc(1vw * 100 / 1280); }

@keyframes animationName1 {
  0% {
    width: 0%; }
  100% {
    width: 100%; } }
@keyframes sweepAction {
  0% {
    left: -100%; }
  50% {
    left: 0; }
  100% {
    left: 100%; } }
@keyframes fadeInDelay {
  to {
    opacity: 1; } }
@keyframes focusIn {
  0% {
    opacity: 0;
    filter: blur(20px);
    transform: scale(1); }
  100% {
    opacity: 1;
    filter: blur(0);
    transform: scale(1); } }
@keyframes animation3 {
  0% {
    opacity: 0;
    transform: translateY(30rem); }
  100% {
    opacity: 1;
    transform: translateY(0); } }
/* PC */
@media screen and (min-width: 769px) {
  .sponly {
    display: none !important; }

  .huwari {
    opacity: 0;
    transform: translateY(30px); }

  .huwari.is-active {
    animation-name: animation3;
    animation-duration: 1s;
    animation-fill-mode: forwards; }

  header {
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 10;
    transition: 0.5s;
    opacity: 1; }
    header.change-color {
      background: #fff;
      /*box-shadow: 0 1px 2px rgba(0,0,0,0.16);*/ }
    header.off {
      transition: 0.5s;
      opacity: 0;
      top: -100px; }
    header .inner {
      width: 100%;
      box-sizing: border-box;
      padding: 12px 23px 12px 31px;
      display: flex;
      justify-content: space-between;
      align-items: center; }
      header .inner .header_logo {
        width: 183px; }
        header .inner .header_logo img {
          mix-blend-mode: multiply; }
      header .inner .header_right {
        display: flex;
        justify-content: flex-end;
        align-items: center; }
        header .inner .header_right .header_nav {
          display: flex;
          justify-content: flex-start;
          margin-right: 45px; }
          header .inner .header_right .header_nav li {
            font-size: 14px;
            letter-spacing: 0.05em;
            line-height: 1;
            margin-right: 2em; }
            header .inner .header_right .header_nav li:last-child {
              margin-right: 0; }
            header .inner .header_right .header_nav li a {
              display: inline-block;
              color: #282828; }
              header .inner .header_right .header_nav li a:hover {
                text-decoration: underline; }
        header .inner .header_right .header_btn {
          width: 192px; }
          header .inner .header_right .header_btn a {
            display: block;
            width: 100%;
            font-size: 14px;
            line-height: 1;
            font-weight: bold;
            color: #fff;
            box-sizing: border-box;
            padding: 9px 0 10px 16px;
            border: solid 1px #f07713;
            background: url("../img/header_btn_icon.png") no-repeat right 7px center #f07713;
            background-size: 17px;
            transition: 0.3s; }
            header .inner .header_right .header_btn a:hover {
              color: #f07713;
              background: url("../img/header_btn_icon_02.png") no-repeat right 7px center #fff;
              background-size: 17px; }

  #mv {
    width: 100%;
    position: relative;
    /* ロゴ本体：ブロックが重なったタイミングで表示 */ }
    #mv.on {
      /* ロゴ本体：ブロックが重なったタイミングで表示 */ }
      #mv.on .mv_img img {
        animation: focusIn 0.5s ease-out forwards;
        animation-delay: 0.3s; }
      #mv.on .mv_logo_txt .div::before {
        animation: focusIn 0.3s ease-out forwards;
        animation-delay: 3.6s; }
      #mv.on .mv_logo_txt .div img {
        animation: focusIn 0.5s ease-out forwards;
        animation-delay: 3.4s; }
      #mv.on .animate-sweep-box::after {
        animation: sweepAction 1.5s cubic-bezier(0.77, 0, 0.175, 1) 1.9s forwards; }
      #mv.on .animate-sweep-content {
        animation: fadeInDelay 0.01s linear 2.3s forwards; }
      #mv.on .mv_txt_2:before {
        animation: focusIn 5.5s ease-out forwards;
        animation-delay: 0.3s; }
    #mv .mv_img {
      min-height: 788px;
      height: 788px;
      position: relative; }
      #mv .mv_img img {
        opacity: 0;
        filter: blur(20px);
        height: 100%;
        object-fit: cover;
        /* これが重要 */ }
    #mv .mv_logo {
      width: 394px;
      position: absolute;
      top: 242px;
      left: 50%;
      transform: translateX(-50%); }
      #mv .mv_logo img {
        animation-duration: 1.5s; }
    #mv .sweep-wrapper {
      position: relative;
      overflow: hidden; }
    #mv .animate-sweep-box::after {
      content: '';
      position: absolute;
      top: 0;
      left: -100%;
      width: 100%;
      height: 100%;
      background-color: #ec7a00;
      /* emerald-500 */
      z-index: 10; }
    #mv .animate-sweep-content {
      opacity: 0; }
    #mv .mv_txt_2 {
      position: absolute;
      left: 90px;
      top: 138px;
      width: 242px;
      height: 345px; }
      #mv .mv_txt_2:before {
        opacity: 0;
        filter: blur(20px);
        content: '';
        background: rgba(255, 255, 255, 0.8);
        display: block;
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        z-index: 1; }
      #mv .mv_txt_2 .mv_txt_2_1 {
        position: absolute;
        top: 30px;
        right: 20px;
        width: 30px;
        z-index: 2; }
      #mv .mv_txt_2 .mv_txt_2_2 {
        position: absolute;
        top: 30px;
        right: 60px;
        width: 27px;
        z-index: 2; }
      #mv .mv_txt_2 .mv_txt_2_3 {
        position: absolute;
        top: 30px;
        right: 110px;
        width: 29px;
        z-index: 2; }
      #mv .mv_txt_2 .mv_txt_2_4 {
        position: absolute;
        top: 30px;
        right: 160px;
        width: 51px;
        z-index: 2; }
    #mv .mv_txt {
      width: 243px;
      position: absolute;
      top: 139px;
      left: 90px; }
    #mv .mv_logo_txt {
      position: absolute;
      left: 0;
      width: 100%;
      text-align: center;
      z-index: 2;
      top: 242px; }
      #mv .mv_logo_txt .div {
        width: 394px;
        margin: 0 auto;
        position: relative;
        height: 122px;
        display: flex;
        justify-content: center;
        align-items: center; }
        #mv .mv_logo_txt .div::before {
          opacity: 0;
          filter: blur(20px);
          content: '';
          background: rgba(255, 255, 255, 0.8);
          display: block;
          width: 100%;
          height: 100%;
          position: absolute;
          left: 0;
          top: 0;
          z-index: 1; }
        #mv .mv_logo_txt .div img {
          opacity: 0;
          position: relative;
          z-index: 2;
          width: 341px;
          height: auto;
          filter: blur(20px); }

  #message {
    padding-top: 75px;
    margin-top: -75px;
    position: relative; }
    #message.on::before {
      animation-name: animationName1;
      animation-duration: 0.5s;
      animation-timing-function: ease;
      animation-delay: 1.1s;
      animation-iteration-count: 1;
      animation-direction: alternate;
      animation-fill-mode: forwards; }
    #message::before {
      position: absolute;
      content: "";
      width: 0;
      height: 1468px;
      left: 0;
      top: -270px;
      top: -195px;
      background: url("../img/message_bg.webp") no-repeat left top;
      background-size: 100vw 100%; }
    #message .inner {
      padding: 0 0 370px;
      position: relative;
      z-index: 2;
      overflow: hidden; }
      #message .inner::after {
        position: absolute;
        content: "";
        width: 753px;
        width: 58.82%;
        height: 667px;
        right: -87px;
        bottom: 195px;
        bottom: 215px;
        bottom: 19.79%;
        background: url("../img/message_img_02.webp") no-repeat center top;
        background-size: contain; }
      #message .inner .message_cont {
        width: 95%;
        max-width: 1100px;
        margin: 0 auto;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        position: relative;
        z-index: 3; }
        #message .inner .message_cont .message_left {
          width: 400px;
          width: 36.3636%; }
          #message .inner .message_cont .message_left .message_ttl {
            margin-bottom: 57px; }
            #message .inner .message_cont .message_left .message_ttl .enttl {
              width: 316px;
              max-width: 100%;
              margin-bottom: 12px; }
            #message .inner .message_cont .message_left .message_ttl .jattl {
              font-size: 20px;
              letter-spacing: 0.1em;
              line-height: 1;
              color: #767676;
              box-sizing: border-box;
              padding-left: 58px;
              position: relative; }
              #message .inner .message_cont .message_left .message_ttl .jattl::before {
                position: absolute;
                content: "";
                width: 48px;
                height: 1px;
                left: 0;
                top: 50%;
                transform: translateY(-50%);
                background: #767676; }
          #message .inner .message_cont .message_left .message_img {
            width: 370px;
            max-width: 100%;
            line-height: 0;
            margin-bottom: 60px;
            box-shadow: 30px 30px 0 #ececec; }
          #message .inner .message_cont .message_left .namearea {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            box-sizing: border-box;
            padding-right: 25px;
            color: #282828; }
            #message .inner .message_cont .message_left .namearea .poti {
              font-size: 16px;
              letter-spacing: 0.04em;
              line-height: 2em; }
            #message .inner .message_cont .message_left .namearea .name {
              font-size: 36px;
              letter-spacing: 0.05em;
              line-height: 1.2em; }
        #message .inner .message_cont .message_right {
          width: 594px;
          width: 54%; }
          #message .inner .message_cont .message_right h3 {
            font-size: 30px;
            letter-spacing: 0.05em;
            line-height: 1.5em;
            color: #ec7a00;
            font-feature-settings: "palt";
            box-sizing: border-box;
            padding-left: 25px;
            position: relative;
            margin-bottom: 30px; }
            #message .inner .message_cont .message_right h3::before {
              position: absolute;
              content: "";
              width: 2px;
              height: 74px;
              left: 0;
              top: 50%;
              transform: translateY(-50%);
              background: #ec7a00; }
          #message .inner .message_cont .message_right .message_txt {
            font-size: 16px;
            letter-spacing: 0.045em;
            line-height: 2em;
            color: #282828;
            font-feature-settings: "palt"; }
            #message .inner .message_cont .message_right .message_txt:nth-child(n+2) {
              margin-top: 1em; } }
@media screen and (min-width: 769px) and (min-width: 1281px) {
  #message .inner::after {
    position: absolute;
    content: "";
    width: 753px;
    height: 667px;
    right: -87px;
    bottom: 195px;
    bottom: 19.79%;
    background: url("../img/message_img_02.webp") no-repeat center top;
    background-size: contain; } }
@media screen and (min-width: 769px) {
  #product {
    margin-top: -204px;
    position: relative; }
    #product::before {
      position: absolute;
      content: "";
      width: 100%;
      height: 1406px;
      left: 0;
      top: 0;
      background: url("../img/product_bg.webp") no-repeat center;
      background-size: 100% auto;
      z-index: -1; }
    #product .inner {
      width: 95%;
      max-width: 1100px;
      margin: 0 auto;
      padding: 110px 0 170px; }
      #product .inner h3 {
        font-size: 30px;
        letter-spacing: 0.05em;
        line-height: 1.5em;
        color: #ec7a00;
        font-feature-settings: "palt";
        box-sizing: border-box;
        padding-left: 25px;
        position: relative;
        margin-bottom: 60px; }
        #product .inner h3::before {
          position: absolute;
          content: "";
          width: 2px;
          height: 74px;
          left: 0;
          top: 50%;
          transform: translateY(-50%);
          background: #ec7a00; }
      #product .inner .product_cont {
        width: 974px;
        width: 88.545%;
        display: flex;
        justify-content: space-between; }
        #product .inner .product_cont.cont02 {
          margin: 60px 22px 250px auto; }
        #product .inner .product_cont.cont03 {
          margin-top: 80px; }
        #product .inner .product_cont .product_box {
          width: 454px;
          width: 46.612%; }
          #product .inner .product_cont .product_box a {
            display: block;
            width: 100%;
            color: #282828;
            transition: 0.3s; }
            #product .inner .product_cont .product_box a:hover {
              opacity: 0.8; }
          #product .inner .product_cont .product_box .product_box_img {
            line-height: 0;
            box-shadow: 22px 22px 0 #fce4cc; }
          #product .inner .product_cont .product_box h4 {
            font-size: 20px;
            letter-spacing: 0.04em;
            line-height: 1;
            font-weight: bold;
            font-feature-settings: "palt";
            margin: 43px 0 15px; }
          #product .inner .product_cont .product_box .product_box_txt {
            font-size: 16px;
            letter-spacing: 0.04em;
            line-height: 2em;
            font-feature-settings: "palt"; }

  #history_ancr {
    padding-top: 80px;
    margin-top: -80px; }

  #history {
    width: 100%;
    overflow: hidden; }
    #history .bg {
      padding: 54px 0 90px;
      background: #d6d6d6;
      position: relative; }
    #history .history_ttl {
      width: 95%;
      max-width: 1100px;
      margin: 0 auto 30px;
      position: relative;
      z-index: 2; }
      #history .history_ttl .enttl {
        width: 491px;
        margin-bottom: 12px; }
      #history .history_ttl .jattl {
        font-size: 20px;
        letter-spacing: 0.1em;
        line-height: 1;
        color: #767676;
        box-sizing: border-box;
        padding-left: 58px;
        position: relative; }
        #history .history_ttl .jattl::before {
          position: absolute;
          content: "";
          width: 48px;
          height: 1px;
          left: 0;
          top: 50%;
          transform: translateY(-50%);
          background: #767676; }
    #history .history_txt {
      width: 95%;
      max-width: 1100px;
      margin: 0 auto 40px;
      font-size: 16px;
      letter-spacing: 0.04em;
      line-height: 2em;
      color: #282828;
      position: relative;
      z-index: 2; }
    #history .history_box {
      width: 100%;
      width: 95.3%;
      max-width: 95.3%;
      margin-left: auto;
      box-sizing: border-box;
      /*padding-left: 4.685%;*/
      overflow: visible; }
      #history .history_box .img_scroll {
        padding-bottom: 15px;
        overflow: scroll;
        position: relative;
        z-index: 2;
        cursor: grab;
        /*IE(Internet Explorer)・Microsoft Edgeへの対応*/
        -ms-overflow-style: none;
        /*Firefoxへの対応*/
        scrollbar-width: none;
        /*Google Chrome、Safariへの対応*/ }
        #history .history_box .img_scroll-webkit-scrollbar {
          display: none; }
        #history .history_box .img_scroll .simplebar-scrollbar {
          background-color: #f07700 !important;
          border-radius: 10px; }
          #history .history_box .img_scroll .simplebar-scrollbar::before {
            background: #f07700; }
        #history .history_box .img_scroll .simplebar-track {
          background-color: #767676;
          border-radius: 10px; }
          #history .history_box .img_scroll .simplebar-track.simplebar-horizontal {
            width: 1160px !important;
            width: 95% !important; }
        #history .history_box .img_scroll .history_img {
          width: 5516px;
          width: 3000px;
          width: 4000px;
          padding-right: 60px; }
          #history .history_box .img_scroll .history_img img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            user-select: none;
            -webkit-user-drag: none; }
      #history .history_box .bg_scroll {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        inset: 0;
        overflow: hidden;
        z-index: 1; }
        #history .history_box .bg_scroll .bg_img {
          width: 5577px;
          height: 100%;
          background: url("../img/history_bg.webp") no-repeat left center;
          background-size: cover;
          position: absolute;
          top: 0;
          left: 0;
          will-change: transform; }

  #symbol .inner {
    width: 95%;
    max-width: 1100px;
    margin: 0 auto;
    padding: 135px 0; }
    #symbol .inner h3 {
      font-size: 30px;
      letter-spacing: 0.05em;
      line-height: 1.5em;
      color: #ec7a00;
      font-feature-settings: "palt";
      box-sizing: border-box;
      padding-left: 25px;
      position: relative;
      margin-bottom: 30px; }
      #symbol .inner h3::before {
        position: absolute;
        content: "";
        width: 2px;
        height: 74px;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        background: #ec7a00; }
    #symbol .inner .symbol_txt {
      font-size: 16px;
      letter-spacing: 0.04em;
      line-height: 2em;
      font-feature-settings: "palt";
      margin-bottom: 60px; }
    #symbol .inner .symbol_box {
      box-sizing: border-box;
      padding: 59px 54px 66px 76px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      border: solid 1px #d6d6d6;
      margin-bottom: 63px; }
      #symbol .inner .symbol_box .symbol_box_logo {
        width: 276px;
        width: 28.512%; }
      #symbol .inner .symbol_box .symbol_box_right {
        width: 607px;
        width: 62.7%; }
        #symbol .inner .symbol_box .symbol_box_right h4 {
          font-size: 24px;
          letter-spacing: 0.05em;
          line-height: 1;
          color: #ec7a00;
          font-feature-settings: "palt";
          box-sizing: border-box;
          padding-left: 42px;
          position: relative;
          margin-bottom: 25px; }
          #symbol .inner .symbol_box .symbol_box_right h4::before {
            position: absolute;
            content: "";
            width: 29px;
            height: 2px;
            left: 0;
            top: 50%;
            transform: translateY(-50%);
            background: #ec7a00; }
        #symbol .inner .symbol_box .symbol_box_right .symbol_box_txt {
          font-size: 16px;
          letter-spacing: 0.09em;
          line-height: 2em;
          color: #282828;
          font-feature-settings: "palt"; }
    #symbol .inner .symbol_btn {
      width: 336px;
      margin: 0 auto; }
      #symbol .inner .symbol_btn a {
        display: block;
        width: 100%;
        font-size: 16px;
        letter-spacing: 0.04em;
        line-height: 1;
        font-weight: bold;
        color: #fff;
        text-align: center;
        box-sizing: border-box;
        padding: 19px 0;
        border: solid 1px #f07700;
        background: url("../img/header_btn_icon.png") no-repeat right 17px center #f07713;
        background-size: 17px;
        transition: 0.3s; }
        #symbol .inner .symbol_btn a:hover {
          color: #f07713;
          background: url("../img/header_btn_icon_02.png") no-repeat right 17px center #fff;
          background-size: 17px; }

  footer {
    background: url("../img/footer_bg.webp") no-repeat right top;
    background-size: 100% 100%; }
    footer .inner {
      width: 95%;
      max-width: 1180px;
      margin: 0 auto;
      padding: 10px 0 20px;
      padding: 60px 0 20px;
      /*display: flex;
      justify-content: space-between;*/
      position: relative; }
      footer .inner .footer_logo {
        width: 342px;
        position: absolute;
        top: 0;
        left: 0; }
      footer .inner .footer_right {
        /*padding-top: 45px;*/
        width: 90%;
        max-width: 1180px;
        color: #fff;
        text-align: right;
        margin-left: auto; }
        footer .inner .footer_right .company {
          font-size: 20px;
          letter-spacing: 0.04em;
          line-height: 1;
          font-weight: bold; }
        footer .inner .footer_right .address {
          font-size: 14px;
          letter-spacing: 0.04em;
          line-height: 1;
          margin: 17px 0 29px; }
        footer .inner .footer_right .footer_menu {
          display: flex;
          justify-content: flex-end;
          margin-bottom: 45px; }
          footer .inner .footer_right .footer_menu li {
            font-size: 16px;
            letter-spacing: 0.04em;
            line-height: 1.2em;
            margin-left: 2em;
            text-align: left;
            padding-left: 1.3em;
            text-indent: -1.3em; }
            footer .inner .footer_right .footer_menu li a {
              color: #fff; }
        footer .inner .footer_right .copyright {
          font-size: 12px;
          letter-spacing: 0.04em;
          line-height: 1; } }
/* SP */
@media screen and (max-width: 768px) {
  .pconly {
    display: none !important; }

  html {
    font-size: calc(1vw * 100 / 375); }

  .huwari {
    opacity: 0;
    transform: translateY(20rem); }

  .huwari.is-active {
    animation-name: animation3;
    animation-duration: 1s;
    animation-fill-mode: forwards; }

  header {
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 10;
    transition: 0.5s; }
    header.change-color {
      background: #fff;
      /*box-shadow: 0 1rem 2rem rgba(0,0,0,0.16);*/ }
    header.off {
      transition: 0.5s;
      opacity: 0;
      top: -100rem; }
    header .inner {
      box-sizing: border-box;
      padding: 19rem 63rem 20rem 19rem;
      display: flex;
      justify-content: space-between;
      align-items: center; }
      header .inner .header_logo {
        width: 118rem; }
        header .inner .header_logo img {
          mix-blend-mode: multiply; }
      header .inner .header_right .header_btn {
        width: 129rem; }
        header .inner .header_right .header_btn a {
          display: block;
          width: 100%;
          font-size: 10rem;
          line-height: 1;
          font-weight: bold;
          color: #fff;
          font-feature-settings: "palt";
          box-sizing: border-box;
          padding: 7rem 0 7rem 11rem;
          background: url("../img/header_btn_icon_sp.webp") no-repeat right 8rem center #f07713;
          background-size: 12rem; }

  /*ハンバーガー メニュー*/
  nav.hum {
    display: block;
    position: fixed;
    top: 64rem;
    right: -100vw;
    /*bottom: 0;*/
    width: 100vw;
    height: 100vh;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    transition: all .5s;
    z-index: 19;
    opacity: 1;
    background: rgba(240, 119, 19, 0.9); }

  .open nav.hum {
    right: 0;
    opacity: 1; }

  nav.hum .hum_inner {
    width: 335rem;
    margin: 0 auto;
    padding: 54rem 0 20rem;
    box-sizing: border-box; }
    nav.hum .hum_inner ul {
      width: 326rem;
      margin: 0 auto 235rem; }
      nav.hum .hum_inner ul li {
        font-size: 18rem;
        letter-spacing: 0.05em;
        line-height: 1;
        font-weight: bold;
        background: url("../img/hum_dot_line.webp") no-repeat left bottom;
        background-size: 100%; }
        nav.hum .hum_inner ul li:nth-child(n+2) {
          margin-top: 30rem; }
        nav.hum .hum_inner ul li a {
          display: block;
          width: 100%;
          color: #fff;
          box-sizing: border-box;
          padding-bottom: 10rem;
          background: url("../img/hum_arrow.webp") no-repeat right 9rem bottom 13rem;
          background-size: 4.5rem; }
    nav.hum .hum_inner .hum_btn {
      width: 100%; }
      nav.hum .hum_inner .hum_btn a {
        display: block;
        width: 100%;
        font-size: 16rem;
        letter-spacing: 0.05em;
        line-height: 1;
        font-weight: bold;
        color: #f07700;
        text-align: center;
        padding: 19rem 0 20rem;
        background: url("../img/header_btn_icon_02.png") no-repeat right 17rem center #fff;
        background-size: 17rem; }

  /*============
  .toggle_btn
  =============*/
  .toggle_btn {
    display: block;
    position: fixed;
    top: 20rem;
    right: 20rem;
    width: 24rem;
    height: 22rem;
    transition: all .5s;
    cursor: pointer;
    z-index: 23; }

  .toggle_btn span {
    display: block;
    position: absolute;
    right: 0;
    width: 24rem;
    height: 2rem;
    border-radius: 100rem;
    background-color: #ec7a00;
    transition: all .5s; }

  .toggle_btn span:nth-child(1) {
    top: 0; }

  .toggle_btn span:nth-child(2) {
    width: 17rem;
    top: 10rem; }

  .toggle_btn span:nth-child(3) {
    top: 20rem; }

  .open .toggle_btn span:nth-child(1) {
    -webkit-transform: translateY(10rem) rotate(-315deg);
    transform: translateY(10rem) rotate(-315deg); }

  .open .toggle_btn span:nth-child(2) {
    opacity: 0; }

  .open .toggle_btn span:nth-child(3) {
    -webkit-transform: translateY(-10rem) rotate(315deg);
    transform: translateY(-10rem) rotate(315deg); }

  /*============
  #mask
  =============*/
  #mask {
    display: none;
    transition: all .5s; }

  .open #mask {
    display: block;
    transition: all .5s;
    position: absolute;
    top: 13.73vw;
    right: 0;
    width: 100%;
    height: 100vh;
    z-index: 18; }

  #mv {
    width: 100%;
    position: relative;
    /* ロゴ本体：ブロックが重なったタイミングで表示 */ }
    #mv.on {
      /* ロゴ本体：ブロックが重なったタイミングで表示 */ }
      #mv.on .mv_img img {
        animation: focusIn 0.5s ease-out forwards;
        animation-delay: 0.3s; }
      #mv.on .mv_logo_txt .div::before {
        animation: focusIn 0.3s ease-out forwards;
        animation-delay: 3.6s; }
      #mv.on .mv_logo_txt .div img {
        animation: focusIn 0.5s ease-out forwards;
        animation-delay: 3.4s; }
      #mv.on .animate-sweep-box::after {
        animation: sweepAction 1.5s cubic-bezier(0.77, 0, 0.175, 1) 1.9s forwards; }
      #mv.on .animate-sweep-content {
        animation: fadeInDelay 0.01s linear 2.3s forwards; }
      #mv.on .mv_txt_2:before {
        animation: focusIn 5.5s ease-out forwards;
        animation-delay: 0.3s; }
    #mv .mv_img img {
      opacity: 0;
      filter: blur(20px); }
    #mv .sweep-wrapper {
      position: relative;
      overflow: hidden; }
    #mv .animate-sweep-box::after {
      content: '';
      position: absolute;
      top: 0;
      left: -100%;
      width: 100%;
      height: 100%;
      background-color: #ec7a00;
      /* emerald-500 */
      z-index: 10; }
    #mv .animate-sweep-content {
      opacity: 0; }
    #mv .mv_txt_2 {
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      top: 135rem;
      width: 237rem;
      height: 398rem; }
      #mv .mv_txt_2:before {
        opacity: 0;
        filter: blur(20px);
        content: '';
        background: rgba(255, 255, 255, 0.8);
        display: block;
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        z-index: 1; }
      #mv .mv_txt_2 .mv_txt_2_1 {
        position: absolute;
        top: 110rem;
        right: 30rem;
        width: 30rem;
        z-index: 2; }
      #mv .mv_txt_2 .mv_txt_2_2 {
        position: absolute;
        top: 110rem;
        right: 65rem;
        width: 27rem;
        z-index: 2; }
      #mv .mv_txt_2 .mv_txt_2_3 {
        position: absolute;
        top: 110rem;
        right: 110rem;
        width: 29rem;
        z-index: 2; }
      #mv .mv_txt_2 .mv_txt_2_4 {
        position: absolute;
        top: 110rem;
        right: 160rem;
        width: 51rem;
        z-index: 2; }
    #mv .mv_txt {
      width: 243rem;
      position: absolute;
      top: 139rem;
      left: 90rem; }
    #mv .mv_logo_txt {
      position: absolute;
      left: 0;
      width: 100%;
      text-align: center;
      z-index: 2;
      top: 170rem; }
      #mv .mv_logo_txt .div {
        width: 100%;
        height: 60rem;
        display: flex;
        justify-content: center;
        align-items: center; }
        #mv .mv_logo_txt .div img {
          opacity: 0;
          position: relative;
          z-index: 2;
          width: 195rem;
          height: auto;
          filter: blur(20px); }
    #mv .mv_logo {
      width: 237rem;
      position: absolute;
      top: 135rem;
      left: 50%;
      transform: translateX(-50%); }
      #mv .mv_logo img {
        animation-duration: 1.5s; }
    #mv .mv_txt {
      width: 243rem;
      position: absolute;
      top: 139rem;
      left: 90rem; }

  #message {
    padding-top: 64rem;
    margin-top: -64rem;
    position: relative; }
    #message.on::before {
      animation-name: animationName1;
      animation-duration: 0.5s;
      animation-timing-function: ease;
      animation-delay: 1.1s;
      animation-iteration-count: 1;
      animation-direction: alternate;
      animation-fill-mode: forwards; }
    #message::before {
      position: absolute;
      content: "";
      width: 0;
      height: 2045rem;
      height: 2100rem;
      left: 0;
      top: -82rem;
      top: -18rem;
      background: url("../img/message_bg_sp.webp") no-repeat left top;
      background-size: 100vw 100%; }
    #message .inner {
      padding: 40rem 0 130rem;
      position: relative;
      z-index: 2;
      overflow: hidden; }
      #message .inner::after {
        position: absolute;
        content: "";
        width: 350rem;
        height: 310rem;
        right: -51rem;
        bottom: 75rem;
        bottom: 90rem;
        background: url("../img/message_img_02.webp") no-repeat center;
        background-size: contain; }
      #message .inner .message_cont {
        width: 335rem;
        margin: 0 auto;
        position: relative;
        z-index: 3; }
        #message .inner .message_cont .message_left {
          margin-bottom: 40rem; }
          #message .inner .message_cont .message_left .message_ttl {
            margin-bottom: 20rem; }
            #message .inner .message_cont .message_left .message_ttl .enttl {
              width: 210rem;
              margin-bottom: 25rem; }
            #message .inner .message_cont .message_left .message_ttl .jattl {
              font-size: 20rem;
              letter-spacing: 0.1em;
              line-height: 1;
              color: #767676;
              box-sizing: border-box;
              padding-left: 59rem;
              position: relative; }
              #message .inner .message_cont .message_left .message_ttl .jattl::before {
                position: absolute;
                content: "";
                width: 48rem;
                height: 1rem;
                left: 0;
                top: 50%;
                transform: translateY(-50%);
                background: #767676; }
          #message .inner .message_cont .message_left h3 {
            font-size: 18rem;
            letter-spacing: 0.01em;
            line-height: 1.55em;
            color: #ec7a00;
            font-feature-settings: "palt";
            box-sizing: border-box;
            padding-left: 14rem;
            position: relative;
            margin-bottom: 55rem; }
            #message .inner .message_cont .message_left h3::before {
              position: absolute;
              content: "";
              width: 2rem;
              height: 50rem;
              left: 0;
              top: 50%;
              transform: translateY(-50%);
              background: #ec7a00; }
          #message .inner .message_cont .message_left .message_img {
            width: 257rem;
            margin: 0 auto 40rem;
            line-height: 0;
            box-shadow: 20rem 20rem 0 #f4f4f4; }
          #message .inner .message_cont .message_left .namearea {
            box-sizing: border-box;
            padding-left: 35rem;
            color: #282828; }
            #message .inner .message_cont .message_left .namearea .poti {
              font-size: 16rem;
              letter-spacing: 0.04em;
              line-height: 1.7em;
              margin-bottom: 10rem; }
            #message .inner .message_cont .message_left .namearea .name {
              font-size: 28rem;
              letter-spacing: 0.05em;
              line-height: 1.2em; }
        #message .inner .message_cont .message_right .message_txt {
          font-size: 16rem;
          letter-spacing: 0.04em;
          line-height: 2em;
          color: #282828;
          font-feature-settings: "palt"; }
          #message .inner .message_cont .message_right .message_txt:nth-child(n+2) {
            margin-top: 1em; }

  #product {
    padding-top: 64rem;
    margin-top: -64rem;
    position: relative; }
    #product::before {
      position: absolute;
      content: "";
      width: 100%;
      height: 1739rem;
      left: 0;
      top: 64rem;
      background: url("../img/product_bg_sp.webp") no-repeat center;
      background-size: 100% 100%;
      z-index: -1; }
    #product .inner {
      width: 335rem;
      margin: 0 auto;
      padding: 15rem 0 70rem; }
      #product .inner h3 {
        font-size: 18rem;
        letter-spacing: 0.05em;
        line-height: 1.55em;
        color: #ec7a00;
        font-feature-settings: "palt";
        box-sizing: border-box;
        padding-left: 14rem;
        position: relative;
        margin-bottom: 40rem; }
        #product .inner h3::before {
          position: absolute;
          content: "";
          width: 2rem;
          height: 50rem;
          left: 0;
          top: 50%;
          transform: translateY(-50%);
          background: #ec7a00; }
      #product .inner .product_cont {
        width: 100%; }
        #product .inner .product_cont.cont02 {
          margin: 30rem 0 160rem; }
        #product .inner .product_cont .product_box {
          width: 100%; }
          #product .inner .product_cont .product_box:nth-child(n+2) {
            margin-top: 30rem; }
          #product .inner .product_cont .product_box a {
            display: block;
            width: 100%;
            color: #282828; }
          #product .inner .product_cont .product_box .product_box_img {
            width: 320rem;
            line-height: 0;
            box-shadow: 16rem 16rem 0 #fce4cc; }
          #product .inner .product_cont .product_box h4 {
            font-size: 20rem;
            letter-spacing: 0.04em;
            line-height: 1.6em;
            font-weight: bold;
            font-feature-settings: "palt";
            margin: 30rem 0 10rem; }
          #product .inner .product_cont .product_box .product_box_txt {
            font-size: 16rem;
            letter-spacing: 0.05em;
            line-height: 2em;
            font-feature-settings: "palt"; }

  #history_ancr {
    padding-top: 64rem;
    margin-top: -64rem; }

  #history {
    width: 100%;
    overflow: hidden; }
    #history .bg {
      padding: 60rem 0 50rem;
      background: #d6d6d6;
      position: relative; }
    #history .history_ttl {
      width: 350rem;
      margin: 0 auto 30rem;
      position: relative;
      z-index: 2; }
      #history .history_ttl .enttl {
        width: 100%;
        margin-bottom: 12rem; }
      #history .history_ttl .jattl {
        font-size: 20rem;
        letter-spacing: 0.1em;
        line-height: 1;
        color: #767676;
        box-sizing: border-box;
        padding-left: 58rem;
        position: relative; }
        #history .history_ttl .jattl::before {
          position: absolute;
          content: "";
          width: 48rem;
          height: 1rem;
          left: 0;
          top: 50%;
          transform: translateY(-50%);
          background: #767676; }
    #history .history_txt {
      width: 335rem;
      margin: 0 auto 50rem;
      font-size: 16rem;
      letter-spacing: 0.04em;
      line-height: 2em;
      color: #282828;
      position: relative;
      z-index: 2; }
    #history .history_box {
      width: 100%;
      box-sizing: border-box;
      padding-left: 20rem;
      overflow: visible; }
      #history .history_box .img_scroll {
        padding-bottom: 15rem;
        overflow: scroll;
        position: relative;
        z-index: 2;
        /*IE(Internet Explorer)・Microsoft Edgeへの対応*/
        -ms-overflow-style: none;
        /*Firefoxへの対応*/
        scrollbar-width: none;
        /*Google Chrome、Safariへの対応*/ }
        #history .history_box .img_scroll-webkit-scrollbar {
          display: none; }
        #history .history_box .img_scroll .simplebar-scrollbar {
          background-color: #f07700 !important;
          border-radius: 10rem; }
          #history .history_box .img_scroll .simplebar-scrollbar::before {
            background: #f07700; }
        #history .history_box .img_scroll .simplebar-track {
          background-color: #767676;
          border-radius: 10rem; }
          #history .history_box .img_scroll .simplebar-track.simplebar-horizontal {
            /*width: 1160rem!important;*/
            width: 335rem !important;
            height: 6rem !important; }
        #history .history_box .img_scroll .history_img {
          width: 5516rem;
          width: 4000rem;
          padding-right: 60rem; }
          #history .history_box .img_scroll .history_img img {
            width: 100%;
            height: 100%;
            object-fit: contain; }
      #history .history_box .bg_scroll {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        inset: 0;
        overflow: hidden;
        z-index: 1; }
        #history .history_box .bg_scroll .bg_img {
          width: 5577rem;
          height: 100%;
          background: url("../img/history_bg.webp") no-repeat left center;
          background-size: cover;
          position: absolute;
          top: 0;
          left: 0;
          will-change: transform; }

  #symbol {
    padding-top: 30rem;
    margin-top: -30rem; }
    #symbol .inner {
      width: 335rem;
      margin: 0 auto;
      padding: 55rem 0 75rem; }
      #symbol .inner h3 {
        font-size: 18rem;
        letter-spacing: 0.05em;
        line-height: 1.55em;
        color: #ec7a00;
        font-feature-settings: "palt";
        box-sizing: border-box;
        padding-left: 14rem;
        position: relative;
        margin-bottom: 30rem; }
        #symbol .inner h3::before {
          position: absolute;
          content: "";
          width: 2rem;
          height: 50rem;
          left: 0;
          top: 50%;
          transform: translateY(-50%);
          background: #ec7a00; }
      #symbol .inner .symbol_txt {
        font-size: 16rem;
        letter-spacing: 0.04em;
        line-height: 2em;
        font-feature-settings: "palt";
        margin-bottom: 40rem; }
      #symbol .inner .symbol_box {
        box-sizing: border-box;
        padding: 60rem 16rem 35rem 17rem;
        border: solid 1rem #d6d6d6;
        margin-bottom: 58rem; }
        #symbol .inner .symbol_box .symbol_box_logo {
          width: 223rem;
          margin: 0 auto 48rem; }
        #symbol .inner .symbol_box .symbol_box_right {
          width: 100%; }
          #symbol .inner .symbol_box .symbol_box_right h4 {
            font-size: 24rem;
            letter-spacing: 0.01em;
            line-height: 1;
            color: #ec7a00;
            font-feature-settings: "palt";
            box-sizing: border-box;
            padding-left: 42rem;
            position: relative;
            margin-bottom: 25rem; }
            #symbol .inner .symbol_box .symbol_box_right h4::before {
              position: absolute;
              content: "";
              width: 29rem;
              height: 2rem;
              left: 0;
              top: 50%;
              transform: translateY(-50%);
              background: #ec7a00; }
          #symbol .inner .symbol_box .symbol_box_right .symbol_box_txt {
            font-size: 16rem;
            letter-spacing: 0.085em;
            line-height: 2em;
            color: #282828;
            font-feature-settings: "palt"; }
      #symbol .inner .symbol_btn {
        width: 336rem;
        margin: 0 auto; }
        #symbol .inner .symbol_btn a {
          display: block;
          width: 100%;
          font-size: 16rem;
          letter-spacing: 0.04em;
          line-height: 1;
          font-weight: bold;
          color: #fff;
          font-feature-settings: "palt";
          text-align: center;
          box-sizing: border-box;
          padding: 19rem 0;
          border: solid 1rem #f07700;
          background: url("../img/header_btn_icon_sp.webp") no-repeat right 17rem center #f07713;
          background-size: 17rem; }

  footer {
    background: url("../img/footer_bg_sp.webp") no-repeat right top;
    background-size: 100% auto; }
    footer .inner {
      width: 335rem;
      margin: 0 auto;
      padding: 0 0 20rem; }
      footer .inner .footer_logo {
        width: 132rem; }
      footer .inner .footer_right {
        padding-top: 50rem;
        color: #fff;
        text-align: right; }
        footer .inner .footer_right .company {
          font-size: 18rem;
          letter-spacing: 0.04em;
          line-height: 1;
          font-weight: bold; }
        footer .inner .footer_right .address {
          font-size: 14rem;
          letter-spacing: 0.04em;
          line-height: 1.5em;
          margin: 15rem 0 40rem; }
        footer .inner .footer_right .copyright {
          font-size: 10rem;
          letter-spacing: 0.04em;
          line-height: 1; } }

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