@charset "UTF-8";
/* _setting CSS */
/* min-width:751px | 751px ~
------------------------------------------------------------------------- */
@media all and (min-width: 751px) {
  /* @media screen
  ------------------------------------------------------------------------- */
  #contents #page_hd1 {
    margin-bottom: -100px; }
    #contents #page_hd1 .img {
      width: 50vw; }
  #contents #sec1 {
    position: relative;
    z-index: 10;
    margin-bottom: 70px; }
    #contents #sec1 h2 {
      width: 55%;
      padding: 0 0 0 50px;
      color: #967e58;
      font-size: 3rem;
      letter-spacing: 0.13em;
      font-style: italic; }
    #contents #sec1 p {
      width: 45%;
      text-align: center; }
  #contents .top_text {
    line-height: 2.3;
    margin: 0 auto 90px;
    font-size: 1.8rem;
    text-align: left; }
  #contents .sec_wrap section {
    position: relative;
    padding: 120px 0 100px;
    background: url(../images/roots/sec2_img1.jpg) no-repeat center/cover; }
    #contents .sec_wrap section:before, #contents .sec_wrap section:after {
      content: attr(data-text);
      position: absolute;
      top: 35px;
      left: 50%;
      transform: translateX(-4.5em);
      opacity: 0.3;
      filter: saturate(2) brightness(2);
      color: #f1e2c6;
      font-family: 'Playfair Display','Hiragino Mincho Pro','游明朝','Yu Mincho','游明朝体','YuMincho',serif;
      font-size: 12rem;
      text-transform: uppercase; }
    #contents .sec_wrap section:after {
      background: url(../images/index/roots/sec2_img1.jpg) center/100vw;
      background-clip: text;
      -webkit-background-clip: text;
      filter: saturate(2) brightness(2);
      opacity: 0.5;
      color: transparent; }
    #contents .sec_wrap section * {
      text-align: center; }
    #contents .sec_wrap section h2 {
      position: relative;
      z-index: 5;
      margin: 0 0 10px;
      font-size: 6.2rem;
      letter-spacing: 0.18em; }
    #contents .sec_wrap section .text1 {
      margin: 0 0 20px;
      font-size: 2.6rem; }
    #contents .sec_wrap section .text2 p {
      line-height: 2;
      margin: 0 auto 20px;
      text-align: left; }
    #contents .sec_wrap section .text2 ._strong {
      margin: 40px auto;
      font-size: 1.8rem;
      font-weight: bold; }
  #contents .sec_wrap #sec3 {
    background: url(../images/roots/sec3_img1.jpg) no-repeat center/cover; }
    #contents .sec_wrap #sec3:before, #contents .sec_wrap #sec3:after {
      transform: translateX(-10px); }
    #contents .sec_wrap #sec3 .text2 {
      margin: 0 auto 30px; }
      #contents .sec_wrap #sec3 .text2 p {
        text-shadow: 0 0 10px rgba(255, 255, 255, 0.51); }
    #contents .sec_wrap #sec3 .sec3_1 {
      width: 850px;
      margin: 0 auto 30px;
      border-radius: 10px;
      background: rgba(255, 255, 255, 0.5);
      box-shadow: 0 0 20px rgba(255, 255, 255, 0.9); }
      #contents .sec_wrap #sec3 .sec3_1 .list_wrap {
        position: relative;
        margin: 0 0 30px;
        padding: 25px 0; }
        #contents .sec_wrap #sec3 .sec3_1 .list_wrap h3 {
          display: flex;
          justify-content: space-between;
          align-items: center;
          margin: 0 0 20px;
          font-size: 2.5rem;
          font-weight: 200;
          letter-spacing: 0.2em;
          white-space: nowrap; }
          #contents .sec_wrap #sec3 .sec3_1 .list_wrap h3:before, #contents .sec_wrap #sec3 .sec3_1 .list_wrap h3:after {
            content: '';
            width: 100%;
            height: 1px;
            margin: 0 20px 0 0;
            background: rgba(199, 202, 209, 0.5); }
          #contents .sec_wrap #sec3 .sec3_1 .list_wrap h3:after {
            margin: 0 0 0 20px; }
        #contents .sec_wrap #sec3 .sec3_1 .list_wrap ul {
          display: flex;
          flex-wrap: wrap;
          align-items: center;
          justify-content: center; }
          #contents .sec_wrap #sec3 .sec3_1 .list_wrap ul li {
            width: 125px;
            margin: 0 15px 25px;
            font-size: 1.4rem;
            text-align: center; }
            #contents .sec_wrap #sec3 .sec3_1 .list_wrap ul li span {
              display: flex;
              justify-content: center;
              align-items: center;
              width: 100%;
              height: 56px; }
      #contents .sec_wrap #sec3 .sec3_1 .text2 {
        line-height: 2.4; }
  #contents .sec_wrap #sec4 {
    background: url(../images/roots/sec4_img1.jpg) no-repeat center/cover; }
    #contents .sec_wrap #sec4 ._btn_textile {
      margin-top: 30px;
      transition: 0.3s ease; }
  #contents .sec_wrap #sec5 {
    background: url(../images/roots/sec5_img1.jpg) no-repeat center/cover; }

  /* @media screen
  ------------------------------------------------------------------------- */ }
/* ////.min-width:751px | 751px ~
---------------------------------------------------------------------
------------
------------
------------
------------
------------
------------
------------
------------
------------
------------
max-width:750px | ~ 750px
------------------------------------------------------------------------- */
@media all and (max-width: 750px) {
  /* @media screen
  ------------------------------------------------------------------------- */
  #contents #page_hd1 {
    padding-bottom: 2vw; }
    #contents #page_hd1 h1 {
      color: #967e58; }
    #contents #page_hd1 .img {
      top: -10vw;
      left: 20vw;
      width: 120vw; }
  #contents #sec1 {
    position: relative;
    z-index: 10;
    margin-bottom: 16vw; }
    #contents #sec1 h2 {
      padding: 8vw 0 0;
      color: #967e58;
      font-size: 1.3rem;
      letter-spacing: 0.13em;
      font-style: italic; }
    #contents #sec1 p {
      position: absolute;
      top: 0;
      right: 5.3333333333vw;
      width: 58.1333333333vw;
      text-align: center; }
  #contents .top_text {
    line-height: 2.2;
    width: 86.9333333333vw;
    margin: 0 0 26.6666666667vw;
    padding: 0 0 0 18vw;
    font-size: 1.2rem; }
  #contents .sec_wrap section {
    position: relative;
    padding: 12vw 0 6.6666666667vw;
    background: url(../images/roots/sec2_img1.jpg) no-repeat center/cover; }
    #contents .sec_wrap section:before, #contents .sec_wrap section:after {
      content: attr(data-text);
      position: absolute;
      top: 4vw;
      left: 0;
      opacity: 0.3;
      filter: saturate(2) brightness(2);
      color: #f1e2c6;
      font-family: 'Playfair Display','Hiragino Mincho Pro','游明朝','Yu Mincho','游明朝体','YuMincho',serif;
      font-size: 6rem;
      text-transform: uppercase; }
    #contents .sec_wrap section:after {
      background: url(../images/index/roots/sec2_img1.jpg) center/100vw;
      background-clip: text;
      -webkit-background-clip: text;
      filter: saturate(2) brightness(2);
      opacity: 0.2;
      color: transparent; }
    #contents .sec_wrap section h2 {
      position: relative;
      z-index: 5;
      margin: 0 0 2.6666666667vw;
      font-size: 3.2rem;
      letter-spacing: 0.18em;
      text-align: center; }
    #contents .sec_wrap section .text1 {
      margin: 0 0 5.3333333333vw;
      font-size: 1.4rem;
      text-align: center; }
    #contents .sec_wrap section .text2 {
      padding: 0 5.3333333333vw; }
      #contents .sec_wrap section .text2 p {
        line-height: 2;
        margin: 0 0 4vw; }
      #contents .sec_wrap section .text2 ._strong {
        margin: 4vw 0;
        font-size: 1.4rem;
        font-weight: bold; }
  #contents .sec_wrap #sec3 {
    background: url(../images/roots/sec3_img1.jpg) no-repeat center/cover; }
    #contents .sec_wrap #sec3:before, #contents .sec_wrap #sec3:after {
      transform: translateX(-10px); }
    #contents .sec_wrap #sec3 .text2 {
      margin: 0 0 2.6666666667vw; }
      #contents .sec_wrap #sec3 .text2 p {
        text-shadow: 0 0 10px rgba(255, 255, 255, 0.51); }
    #contents .sec_wrap #sec3 .sec3_1 {
      margin: 0 0 4.4vw;
      padding: 4vw 0 0;
      background: rgba(255, 255, 255, 0.5);
      box-shadow: 0 0 4vw rgba(255, 255, 255, 0.9); }
      #contents .sec_wrap #sec3 .sec3_1 .list_wrap {
        position: relative; }
        #contents .sec_wrap #sec3 .sec3_1 .list_wrap h3 {
          display: flex;
          justify-content: space-between;
          align-items: center;
          margin: 0 0 4.2666666667vw;
          font-size: 1.6rem;
          font-weight: 200;
          letter-spacing: 0.2em;
          white-space: nowrap; }
          #contents .sec_wrap #sec3 .sec3_1 .list_wrap h3:before, #contents .sec_wrap #sec3 .sec3_1 .list_wrap h3:after {
            content: '';
            width: 100%;
            height: 1px;
            margin: 0 20px 0 0;
            background: rgba(199, 202, 209, 0.5); }
          #contents .sec_wrap #sec3 .sec3_1 .list_wrap h3:after {
            margin: 0 0 0 20px; }
        #contents .sec_wrap #sec3 .sec3_1 .list_wrap ul {
          display: flex;
          flex-wrap: wrap;
          justify-content: space-between;
          margin: 0 2.6666666667vw 1.3333333333vw; }
          #contents .sec_wrap #sec3 .sec3_1 .list_wrap ul li {
            width: 20%;
            margin: 0 0 3.3333333333vw;
            font-size: 0.8rem;
            text-align: center; }
            #contents .sec_wrap #sec3 .sec3_1 .list_wrap ul li span {
              display: flex;
              justify-content: center;
              align-items: center;
              width: 100%;
              height: 10.1333333333vw; }
              #contents .sec_wrap #sec3 .sec3_1 .list_wrap ul li span img {
                width: auto;
                transform: scale(0.78); }
      #contents .sec_wrap #sec3 .sec3_1 .text2 {
        line-height: 2.3; }
  #contents .sec_wrap #sec4 {
    background: url(../images/roots/sec4_img1.jpg) no-repeat center/cover; }
    #contents .sec_wrap #sec4 ._btn_textile {
      width: 80%;
      margin: 2.6666666667vw 0;
      transition: 0.3s ease; }
  #contents .sec_wrap #sec5 {
    background: url(../images/roots/sec5_img1.jpg) no-repeat center/cover; }

  /* @media screen
  ------------------------------------------------------------------------- */ }