/* --------------------------------------------------

	section size

-------------------------------------------------- */

/* sec-fv

---------------------------------------------------------------------------- */

.sec-fv {

  position: relative;

  height: 100vh;

  min-height: 765px;

  overflow: hidden;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

}

@media screen and (max-width: 767px) {

  .sec-fv {

    height: auto;

    min-height: inherit;

  }

}

.sec-fv:before, .sec-fv:after {

  position: absolute;

  display: block;

  content: "";

}

@media screen and (max-width: 767px) {

  .sec-fv:before, .sec-fv:after {

    display: none;

  }

}

.sec-fv:before {

  left: 50%;

  top: 50%;

  -webkit-transform: translate(-50%, -50%);

          transform: translate(-50%, -50%);

  background: url("../images/border_fv_pc.png") no-repeat center center;

  background-size: 100% 100% !important;

  width: calc(100% - 56px);

  height: calc(100% - 56px);

  z-index: 2;

  mix-blend-mode: lighten;

}

.sec-fv:after {

  left: 0;

  bottom: 0;

  background: url("../images/bg_wave.png") no-repeat center bottom;

  background-size: 100% auto;

  width: 100%;

  height: 180rem;

  z-index: 3;

}

.sec-fv__inner {

  position: absolute;

  left: 0;

  right: 0;

  top: 0;

  margin: 0 auto;

  width: 50%;

  min-width: 900px;

  height: 100%;

  z-index: 5;

}

@media screen and (max-width: 767px) {

  .sec-fv__inner {

    width: 100%;

    min-width: inherit;

  }

}

.sec-fv__inner .fv-txt {

  position: relative;

  width: 100%;

  left: 50%;

  -webkit-transform: translateX(-50%);

          transform: translateX(-50%);

  top: 7%;

  margin: 0 auto;

  padding: 0 17px;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

}

@media screen and (max-width: 767px) {

  .sec-fv__inner .fv-txt {

    width: 100%;

    min-width: inherit;

    top: 5.2rem;

    margin: 0 auto;

    padding: 0;

  }

}

.sec-fv__inner .fv-txt p {

  position: absolute;

  top: 3vh;

}

.sec-fv__inner .fv-txt p img {

  width: 100%;

  max-width: inherit;

  height: auto;

}

.sec-fv__inner .fv-txt .txt01 {

  right: 0;

  width: 24.4%;

  max-width: 232px;

}

@media screen and (max-height: 768px) {

  .sec-fv__inner .fv-txt .txt01 {

    width: 21.6%;

  }

}

@media screen and (max-width: 767px) {

  .sec-fv__inner .fv-txt .txt01 {

    right: 5rem;

    width: 100%;

    max-width: 9.5rem;

    min-width: inherit;

  }

}

.sec-fv__inner .fv-txt .txt02 {

  left: 1rem;

  width: 13.5%;

  max-width: 120px;

}

@media screen and (max-height: 768px) {

  .sec-fv__inner .fv-txt .txt02 {

    width: 11.5%;

  }

}

@media screen and (max-width: 767px) {

  .sec-fv__inner .fv-txt .txt02 {

    left: 5rem;

    width: 100%;

    max-width: 10rem;

    min-width: inherit;

  }

}

.sec-fv .fv-logo {

  position: absolute;

  height: 100vh;

  min-height: 765px;

  bottom: 8%;

  width: 100%;

  min-width: 1800px;

  left: 50%;

  -webkit-transform: translateX(-50%);

          transform: translateX(-50%);

  z-index: 3;

}

@media screen and (max-width: 767px) {

  .sec-fv .fv-logo {

    height: auto;

    min-width: inherit;

    min-height: inherit;

    bottom: 0;

  }

}

@media screen and (min-width: 768px) {

  .sec-fv .fv-logo img {

    width: 100%;

    height: 100%;

    -o-object-fit: cover;

       object-fit: cover;

  }

}

.sec-fv .fv-img {

  position: relative;

  height: 100vh;

  min-height: 765px;

  z-index: 1;

  bottom: 8%;

  min-width: 1800px;

  left: 50%;

  -webkit-transform: translateX(-50%);

          transform: translateX(-50%);

  z-index: 1;

}

@media screen and (max-width: 767px) {

  .sec-fv .fv-img {

    height: auto;

    min-width: inherit;

    min-height: inherit;

    bottom: 0;

  }

}

@media screen and (min-width: 768px) {

  .sec-fv .fv-img img {

    width: 100%;

    height: 100%;

    -o-object-fit: cover;

       object-fit: cover;

  }

}

.sec-fv .btn_wrap {

  position: absolute;

  right: 20px;

  bottom: 20px;

  z-index: 999;

}

@media screen and (max-width: 767px) {

  .sec-fv .btn_wrap {

    right: 2rem;

    bottom: 2rem;

  }

}

.sec-fv .btn_wrap .bnr_btn {

  position: relative;

  display: block;

  max-width: 250px;

  -webkit-box-shadow: 4px 8px 24px rgba(0, 0, 0, 0.24);

          box-shadow: 4px 8px 24px rgba(0, 0, 0, 0.24);

  border-radius: 100%;

  -webkit-box-shadow: 4px 8px 24px rgb(0, 0, 0);

          box-shadow: 4px 8px 24px rgb(0, 0, 0);

  z-index: 1;

}

.sec-fv .btn_wrap .bnr_btn:before {

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  background-color: rgba(0, 0, 0, 0.3);

  opacity: 0;

  border-radius: 100%;

  z-index: 1;

  -webkit-transition: 0.4s;

  transition: 0.4s;

}

@media screen and (min-width: 768px) {

  .sec-fv .btn_wrap .bnr_btn:hover:before {

    opacity: 1;

  }

}

@media screen and (max-width: 767px) {

  .sec-fv .btn_wrap .bnr_btn {

    max-width: 30rem;

  }

}

.sec-fv .btn_wrap .bnr_btn img {

  width: 100%;

  max-width: inherit;

}



.ipad .sec-fv, .ipod .sec-fv {

  max-height: 1080px;

}



/* sec-first

---------------------------------------------------------------------------- */

.sec-first {

  position: relative;

  padding: 116px 0 186px 0;

  background: url("../images/bg_black_pc.jpg") no-repeat left top;

  background-size: cover !important;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

}

@media screen and (max-width: 767px) {

  .sec-first {

    background: url("../images/bg_black_sp.jpg") no-repeat left top;

    padding: 10rem 0 14rem 0;

  }

  .sec-first .l-wrapper {

    padding: 0;

  }

}

.sec-first .flex {

  display: -ms-flexbox;

  display: -webkit-box;

  display: flex;

  -ms-flex-pack: start;

  -webkit-box-pack: start;

          justify-content: flex-start;

  -ms-flex-align: start;

  -webkit-box-align: start;

          align-items: flex-start;

  -ms-flex-wrap: nowrap;

  flex-wrap: nowrap;

  -ms-flex-line-pack: stretch;

  align-content: stretch;

  -webkit-box-orient: horizontal;

  -webkit-box-direction: reverse;

      -ms-flex-direction: row-reverse;

          flex-direction: row-reverse;

}

@media screen and (max-width: 767px) {

  .sec-first .flex {

    display: block;

  }

}

.sec-first .flex__img {

  width: 62%;

  max-width: 765px;

}

@media screen and (max-width: 767px) {

  .sec-first .flex__img {

    width: 68rem;

    margin: 0 0 0 auto;

  }

}

.sec-first .flex__txt {

  width: 38%;

  padding-right: 70px;

  min-height: 482px;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

}

@media screen and (max-width: 767px) {

  .sec-first .flex__txt {

    width: 100%;

    min-height: inherit;

    margin-top: 5rem;

    padding: 0 7rem !important;

  }

}

.sec-first .flex__txt .c-text {

  font-size: 2.2rem;

  line-height: 3.5;

  letter-spacing: 0.04em;

  font-weight: 500;

  color: #fff;

  margin: 0 0 0 auto;

}

@media screen and (max-width: 1199px) {

  .sec-first .flex__txt .c-text {

    font-size: 2.2rem;

    line-height: 2.9090909091;

    letter-spacing: 0.04em;

    font-weight: 500;

  }

}

@media screen and (max-width: 767px) {

  .sec-first .flex__txt .c-text {

    font-size: 3rem;

    line-height: 2.4666666667;

    letter-spacing: 0.04em;

    font-weight: 500;

  }

}

.sec-first .flex.-reverse {

  -webkit-box-orient: horizontal;

  -webkit-box-direction: normal;

      -ms-flex-direction: row;

          flex-direction: row;

}

.sec-first .flex.-reverse .flex__txt {

  padding-right: 0;

  padding-left: 70px;

}

.sec-first .flex.-reverse .flex__txt .c-text {

  margin: 0;

}

@media screen and (max-width: 767px) {

  .sec-first .flex.-reverse .flex__img {

    margin: 0 auto 0 0;

  }

}

.sec-first .flex:nth-of-type(1) {

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

}

.sec-first .flex:nth-of-type(2) .flex__txt {

  padding-top: 25px;

}

.sec-first .flex:nth-of-type(3) .flex__txt {

  padding-top: 25px;

}

@media screen and (max-width: 767px) {

  .sec-first .flex:nth-of-type(3) .flex__txt {

    padding: 0 5rem 0 7rem !important;

  }

}

.sec-first .flex:nth-of-type(3) .flex__txt .c-text {

  font-size: 2.2rem;

  line-height: 2.6818181818;

  letter-spacing: 0.04em;

  font-weight: 500;

}

@media screen and (max-width: 1199px) {

  .sec-first .flex:nth-of-type(3) .flex__txt .c-text {

    font-size: 2.2rem;

    line-height: 2.3636363636;

    letter-spacing: 0.04em;

    font-weight: 500;

  }

}

@media screen and (max-width: 767px) {

  .sec-first .flex:nth-of-type(3) .flex__txt .c-text {

    font-size: 3rem;

    line-height: 2.4666666667;

    letter-spacing: 0.04em;

    font-weight: 500;

  }

}

.sec-first .flex + .flex {

  margin-top: 175px;

}

@media screen and (max-width: 767px) {

  .sec-first .flex + .flex {

    margin-top: 10rem;

  }

}

.sec-first .img {

  text-align: center;

  margin: 190px auto 0 auto;

  width: 100%;

  max-width: 430px;

}

@media screen and (max-width: 767px) {

  .sec-first .img {

    margin: 14rem auto 0 auto;

    width: 51.8rem;

    max-width: inherit;

  }

}



/* sec-reason

---------------------------------------------------------------------------- */

.sec-reason {

  position: relative;

  padding: 130px 0 196px 0;

  background: url("../images/bg_green_pc.jpg") no-repeat left top;

  background-size: cover !important;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

}

@media screen and (max-width: 767px) {

  .sec-reason {

    padding: 11.5rem 0 19rem 0;

    background: url("../images/bg_green_sp.jpg") no-repeat left top;

  }

}

.sec-reason .reason-box {

  display: -ms-flexbox;

  display: -webkit-box;

  display: flex;

  -ms-flex-pack: start;

  -webkit-box-pack: start;

          justify-content: flex-start;

  -ms-flex-align: start;

  -webkit-box-align: start;

          align-items: flex-start;

  -ms-flex-wrap: nowrap;

  flex-wrap: nowrap;

  -ms-flex-line-pack: stretch;

  align-content: stretch;

  -webkit-box-orient: horizontal;

  -webkit-box-direction: reverse;

      -ms-flex-direction: row-reverse;

          flex-direction: row-reverse;

}

@media screen and (max-width: 767px) {

  .sec-reason .reason-box {

    display: block;

  }

}

.sec-reason .reason-box__txt {

  width: calc(100% - 520px);

  padding-right: 45px;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

}

@media screen and (max-width: 767px) {

  .sec-reason .reason-box__txt {

    width: 100%;

    margin-top: 2.5rem;

    padding: 0;

    display: -ms-flexbox;

    display: -webkit-box;

    display: flex;

    -ms-flex-pack: start;

    -webkit-box-pack: start;

            justify-content: flex-start;

    -ms-flex-align: center;

    -webkit-box-align: center;

            align-items: center;

    -ms-flex-wrap: nowrap;

    flex-wrap: nowrap;

    -ms-flex-line-pack: stretch;

    align-content: stretch;

  }

}

.sec-reason .reason-box__txt .num {

  margin-bottom: 40px;

}

@media screen and (max-width: 767px) {

  .sec-reason .reason-box__txt .num {

    margin-bottom: 0;

    width: 10.6rem;

  }

}

.sec-reason .reason-box__txt .text {

  font-size: 3.6rem;

  line-height: 1.5555555556;

  letter-spacing: 0.14em;

  font-weight: 500;

  color: #fff;

}

@media screen and (max-width: 767px) {

  .sec-reason .reason-box__txt .text {

    width: calc(100% - 8.6rem);

    font-size: 4.2rem;

    line-height: 1.4285714286;

    letter-spacing: 0.07em;

    font-weight: 500;

    margin-right: -2rem;

    padding-left: 2rem;

    -webkit-box-sizing: border-box;

            box-sizing: border-box;

  }

}

.sec-reason .reason-box__img {

  width: 520px;

}

@media screen and (max-width: 767px) {

  .sec-reason .reason-box__img {

    width: 100%;

  }

}

.sec-reason .reason-box + .reason-box {

  margin-top: 100px;

}

@media screen and (max-width: 767px) {

  .sec-reason .reason-box + .reason-box {

    margin-top: 10rem;

  }

}

@media screen and (max-width: 767px) {

  .sec-reason .reason-box:nth-of-type(1) .reason-box__txt .num {

    width: 8.9rem;

  }

  .sec-reason .reason-box:nth-of-type(3) .reason-box__txt .num {

    width: 10.3rem;

  }

}

.sec-reason .bnr_wrap {

  margin: 185px auto 0 auto;

  text-align: center;

}

@media screen and (max-width: 767px) {

  .sec-reason .bnr_wrap {

    margin: 13rem auto 0 auto;

  }

}

.sec-reason .bnr_wrap .c-lead_text {

  margin-bottom: 45px;

}

@media screen and (max-width: 767px) {

  .sec-reason .bnr_wrap .c-lead_text {

    margin-bottom: 2.5rem;

  }

}



/* sec-reason

---------------------------------------------------------------------------- */

.sec-roots {

  padding: 145px 0 150px 0;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

}

@media screen and (max-width: 767px) {

  .sec-roots {

    padding: 14.5rem 0 18rem 0;

  }

}

.sec-roots .sec-title {

  text-align: center;

  color: #fff;

  font-size: 6rem;

  line-height: 1.2166666667;

  letter-spacing: 0.14em;

  font-weight: 500;

  margin-bottom: 35px;

}

@media screen and (max-width: 767px) {

  .sec-roots .sec-title {

    font-size: 6.2rem;

    line-height: 1.2580645161;

    letter-spacing: 0.22em;

    font-weight: 500;

    margin-bottom: 4rem;

  }

}

.sec-roots .c-text {

  color: #fff;

  padding: 0 1.5rem;

  margin-bottom: 65px;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

}

@media screen and (max-width: 767px) {

  .sec-roots .c-text {

    text-align: left !important;

    font-size: 2.8rem;

    line-height: 1.7857142857;

    letter-spacing: 0.1em;

    font-weight: 500;

    margin-bottom: 11rem;

  }

}

.sec-roots .img {

  width: 100%;

  max-width: 75.5rem;

  text-align: center;

  margin: 0 auto;

}

@media screen and (max-width: 767px) {

  .sec-roots .img {

    margin: 0 -1.5rem;

  }

}

.sec-roots .slider_wrap {

  margin: 0 auto;

  max-width: 1080px;

}

.sec-roots .slider_wrap .slider_inner {

  position: relative;

}

.sec-roots .slider_wrap .slider {

  padding: 0 55px;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

}

@media screen and (max-width: 767px) {

  .sec-roots .slider_wrap .slider {

    padding: 0 4.5rem;

  }

}

.sec-roots .slider_wrap .slider .slick-slide {

  display: -ms-flexbox;

  display: -webkit-box;

  display: flex;

  -ms-flex-pack: center;

  -webkit-box-pack: center;

          justify-content: center;

  -ms-flex-align: end;

  -webkit-box-align: end;

          align-items: flex-end;

  -ms-flex-wrap: nowrap;

  flex-wrap: nowrap;

  -ms-flex-line-pack: stretch;

  align-content: stretch;

}

@media screen and (max-width: 767px) {

  .sec-roots .slider_wrap .slider .slick-slide {

    display: block;

  }

}

.sec-roots .slider_wrap .slider .slick-slide .slide__img {

  width: 147px;

  margin-left: 20px;

}

@media screen and (max-width: 767px) {

  .sec-roots .slider_wrap .slider .slick-slide .slide__img {

    width: 15.6rem;

    margin: 0 auto;

  }

}

.sec-roots .slider_wrap .slider .slick-slide .slide__txt {

  width: calc(100% - 350px);

  padding-left: 40px;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

}

@media screen and (max-width: 767px) {

  .sec-roots .slider_wrap .slider .slick-slide .slide__txt {

    width: 100%;

    padding: 0;

    margin-top: 2.7rem;

  }

}

.sec-roots .slider_wrap .slider .slick-slide .slide__txt .year {

  margin-bottom: 40px;

}

@media screen and (max-width: 767px) {

  .sec-roots .slider_wrap .slider .slick-slide .slide__txt .year {

    text-align: center;

    width: 16.6rem;

    margin: 0 auto 2rem auto;

  }

}

.sec-roots .slider_wrap .slider .slick-slide .slide__txt .text {

  font-size: 2.2rem;

  line-height: 2.1818181818;

  letter-spacing: 0.08em;

  font-weight: 500;

  color: #fff;

}

@media screen and (max-width: 767px) {

  .sec-roots .slider_wrap .slider .slick-slide .slide__txt .text {

    font-size: 2.4rem;

    line-height: 2.0833333333;

    letter-spacing: 0.16em;

    font-weight: 500;

  }

}

@media screen and (max-width: 767px) {

  .sec-roots .slider_wrap .slick-dots {

    left: 0;

    right: 0;

    bottom: -5rem;

    margin: 0 auto;

  }

  .sec-roots .slider_wrap .slick-dots li {

    width: 2rem;

    height: 2rem;

    padding: 0;

    margin: 0 1.7rem;

  }

  .sec-roots .slider_wrap .slick-dots li button {

    width: 2rem;

    height: 2rem;

    padding: 0;

    margin: 0;

    background: rgba(255, 255, 255, 0.3);

    border-radius: 100%;

  }

  .sec-roots .slider_wrap .slick-dots li.slick-active button {

    background: rgb(255, 255, 255);

  }

}

.sec-roots .slider_wrap .thumbnail {

  width: 100%;

  max-width: 800px;

  margin: 55px auto 0 auto;

}

@media screen and (max-width: 767px) {

  .sec-roots .slider_wrap .thumbnail {

    display: none;

  }

}

.sec-roots .slider_wrap .thumbnail .items {

  position: relative;

  text-align: center;

  cursor: pointer;

}

.sec-roots .slider_wrap .thumbnail .items:not(:last-of-type):after {

  position: absolute;

  right: -11px;

  top: 50%;

  -webkit-transform: translateY(-50%);

          transform: translateY(-50%);

  display: block;

  content: "";

  width: 24px;

  height: 1px;

  background: #fff;

}

.sec-roots .slider_wrap .thumbnail .items .year {

  text-align: center;

  display: inline-block;

  font-size: 3.4rem;

  line-height: 1;

  letter-spacing: 0.06em;

  font-weight: 400;

  color: #fff;

  white-space: nowrap;

  padding: 1px 0;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

  -webkit-transition: 0.4s;

  transition: 0.4s;

}

@media screen and (min-width: 768px) {

  .sec-roots .slider_wrap .thumbnail .items .year:hover {

    opacity: 0.6;

  }

}

.sec-roots .slider_wrap .thumbnail .items .year__txt {

  text-align: center;

  color: #fff;

  font-size: 1.8rem;

  line-height: 2;

  font-weight: 600;

}

.sec-roots .slider_wrap .thumbnail .items.current .year, .sec-roots .slider_wrap .thumbnail .items.slick-current .year {

  color: #000;

  background: #fff;

}

.sec-roots .slider_wrap .thumbnail .slick-track {

  -webkit-transform: unset !important;

          transform: unset !important;

}

.sec-roots .slider_wrap .slick-list,

.sec-roots .slider_wrap .slick-list > .slick-track,

.sec-roots .slider_wrap .slick-list > .slick-track > .slick-slide > div {

  position: relative;

  height: 100%;

}

.sec-roots .slider_wrap .slick-prev, .sec-roots .slider_wrap .slick-next {

  width: 75px;

  height: 130px;

  -webkit-transition: 0.4s;

  transition: 0.4s;

}

@media screen and (min-width: 768px) {

  .sec-roots .slider_wrap .slick-prev:hover, .sec-roots .slider_wrap .slick-next:hover {

    opacity: 0.6;

  }

}

@media screen and (max-width: 767px) {

  .sec-roots .slider_wrap .slick-prev, .sec-roots .slider_wrap .slick-next {

    top: 20rem;

    width: 6.5rem;

    height: 13rem;

  }

}

.sec-roots .slider_wrap .slick-prev:before, .sec-roots .slider_wrap .slick-next:before {

  border-style: solid;

  border-width: 0 1px 1px 0;

  content: "";

  display: inline-block;

  position: absolute;

  height: 8rem;

  width: 8rem;

  border-color: #fff;

  -webkit-transform: rotate(-45deg);

          transform: rotate(-45deg);

  -webkit-transform: rotate(-45deg) translateY(-50%);

          transform: rotate(-45deg) translateY(-50%);

  opacity: 1;

}

@media screen and (max-width: 767px) {

  .sec-roots .slider_wrap .slick-prev:before, .sec-roots .slider_wrap .slick-next:before {

    height: 4rem;

    width: 4rem;

  }

}

@media screen and (max-width: 767px) {

  .sec-roots .slider_wrap .slick-prev:before, .sec-roots .slider_wrap .slick-next:before {

    border-style: solid;

    border-width: 0 1px 1px 0;

    content: "";

    display: inline-block;

    position: absolute;

    height: 10rem;

    width: 10rem;

    border-color: #fff;

    -webkit-transform: rotate(-45deg);

            transform: rotate(-45deg);

    -webkit-transform: rotate(-45deg) translateY(-50%);

            transform: rotate(-45deg) translateY(-50%);

  }

}

@media screen and (max-width: 767px) and (max-width: 767px) {

  .sec-roots .slider_wrap .slick-prev:before, .sec-roots .slider_wrap .slick-next:before {

    height: 5rem;

    width: 5rem;

  }

}

.sec-roots .slider_wrap .slick-next {

  right: 0;

}

.sec-roots .slider_wrap .slick-next:before {

  right: 0;

}

.sec-roots .slider_wrap .slick-prev {

  left: 2rem;

}

.sec-roots .slider_wrap .slick-prev:before {

  left: 0;

  border-style: solid;

  border-width: 0 1px 1px 0;

  content: "";

  display: inline-block;

  position: absolute;

  height: 8rem;

  width: 8rem;

  border-color: #fff;

  -webkit-transform: rotate(135deg);

          transform: rotate(135deg);

  -webkit-transform: rotate(135deg) translateY(50%);

          transform: rotate(135deg) translateY(50%);

}

@media screen and (max-width: 767px) {

  .sec-roots .slider_wrap .slick-prev:before {

    height: 4rem;

    width: 4rem;

  }

}

@media screen and (max-width: 767px) {

  .sec-roots .slider_wrap .slick-prev:before {

    border-style: solid;

    border-width: 0 1px 1px 0;

    content: "";

    display: inline-block;

    position: absolute;

    height: 10rem;

    width: 10rem;

    border-color: #fff;

    -webkit-transform: rotate(135deg);

            transform: rotate(135deg);

    -webkit-transform: rotate(135deg) translateY(50%);

            transform: rotate(135deg) translateY(50%);

  }

}

@media screen and (max-width: 767px) and (max-width: 767px) {

  .sec-roots .slider_wrap .slick-prev:before {

    height: 5rem;

    width: 5rem;

  }

}



/* sec-shiranami

---------------------------------------------------------------------------- */

.sec-shiranami {

  position: relative;

  padding: 90px 0 40px 0;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

}

@media screen and (max-width: 767px) {

  .sec-shiranami {

    padding: 13rem 0 12.6rem 0;

  }

}

.sec-shiranami .l-inner {

  position: relative;

}

.sec-shiranami .flex__img {

  position: absolute;

  left: 10px;

  bottom: -75px;

  width: 330px;

}

@media screen and (max-width: 767px) {

  .sec-shiranami .flex__img {

    position: relative;

    left: 0;

    bottom: auto;

    width: 35.8rem;

    margin: 0 auto;

  }

}

.sec-shiranami .flex__txt {

  margin: 0 0 0 auto;

  width: calc(100% - 330px);

  padding-left: 60px;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

}

@media screen and (max-width: 767px) {

  .sec-shiranami .flex__txt {

    width: 100%;

    padding: 0;

    margin-top: 5rem;

  }

}

.sec-shiranami .flex__txt .sec-title {

  font-size: 7.8rem;

  line-height: 1.2820512821;

  letter-spacing: 0.18em;

  font-weight: 400;

  color: #000;

  margin-left: -20px;

  margin-bottom: 40px;

}

@media screen and (max-width: 767px) {

  .sec-shiranami .flex__txt .sec-title {

    margin-left: 0;

    text-align: center;

    font-size: 10rem;

    line-height: 1.37;

    letter-spacing: 0.22em;

    font-weight: 400;

    margin-bottom: 4.5rem;

  }

}

.sec-shiranami .flex__txt .sec-title .en {

  position: relative;

  left: 25px;

  display: block;

  font-size: 2rem;

  line-height: 1;

  letter-spacing: 0.9em;

  font-weight: 500;

}

@media screen and (max-width: 767px) {

  .sec-shiranami .flex__txt .sec-title .en {

    left: 1.2rem;

    font-size: 2.6rem;

    line-height: 1;

    letter-spacing: 0.9em;

    font-weight: 500;

  }

}

.sec-shiranami .flex__txt .c-text {

  color: #000;

}

.sec-shiranami .flex__txt .btn_wrap {

  margin-top: 40px;

}

@media screen and (max-width: 767px) {

  .sec-shiranami .flex__txt .btn_wrap {

    margin-top: 6rem;

  }

}

@media screen and (max-width: 767px) {

  .sec-shiranami .flex__txt .btn_wrap .c-button {

    margin: 0 auto;

  }

}