@charset "UTF-8";
@media only screen and (min-width: 769px) {
  .fv {
    background: url("../img/bgFv.jpg") top center no-repeat;
    -moz-background-size: cover;
         background-size: cover;
    width: 100%;
    height: 100vh;
    min-height: 700px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .fv__inner {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    min-height: 480px;
  }
  .fv__innerLeft {
    width: 265px;
    text-align: center;
  }
  .fv__innerLeft .txt {
    line-height: 0;
    width: 100%;
  }
  .fv__innerLeft .txt img {
    width: 100%;
    height: auto;
  }
  .fv__innerLeft .btn {
    margin-top: 50px;
  }
  .fv__innerLeft .btn a {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    color: #fff;
    font-size: 2.1rem;
    font-weight: 700;
    width: 250px;
    height: 40px;
    background: #cfbc62;
    font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", sans-serif;
    color: #fff;
  }
  .fv__innerRight {
    width: 278px;
    line-height: 0;
    margin-left: 103px;
  }
  .fv__innerRight img {
    width: 100%;
    height: auto;
    -webkit-filter: drop-shadow(25px 25px 4px rgba(0, 0, 0, 0.5));
            filter: drop-shadow(25px 25px 4px rgba(0, 0, 0, 0.5));
  }
  .lifetime {
    text-align: center;
    padding: 114px 0 0;
  }
  .lifetime h2 {
    font-size: 3.2rem;
    line-height: 60px;
    font-weight: 600;
    letter-spacing: 0.1em;
    color: #3a3a3a;
  }
  .lifetime .txt {
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 400;
    letter-spacing: 0.15em;
    margin-top: 30px;
    font-family: kozuka-gothic-pr6n, sans-serif;
    font-weight: 400;
  }
  .lifetime .more {
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
    text-align: center;
    margin-top: 28px;
  }
  .lifetime .more::after {
    position: absolute;
    content: "";
    width: 4.91px;
    height: 168.49px;
    background: url("../img/arDown.svg") 0 0 no-repeat;
    -moz-background-size: contain;
         background-size: contain;
    left: 50%;
    -webkit-transform: translateX(-50%);
       -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    top: 100%;
  }
  .lifetime .more span {
    display: inline-block;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
    font-size: 2rem;
    line-height: 70px;
    font-weight: 600;
    font-family: "Noto Serif JP", serif;
    padding: 7px 0;
  }
  .lifetime .more span::before, .lifetime .more span::after {
    position: absolute;
    content: "";
    width: 62.13px;
    height: 14.496px;
    background: url("../img/quarCircle.svg") 0 0 no-repeat;
    -moz-background-size: contain;
         background-size: contain;
    left: 50%;
    -webkit-transform: translateX(-50%);
       -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
  }
  .lifetime .more span::before {
    top: 0;
  }
  .lifetime .more span::after {
    bottom: 0;
    -webkit-transform: translateX(-50%) scaleY(-1);
       -moz-transform: translateX(-50%) scaleY(-1);
        -ms-transform: translateX(-50%) scaleY(-1);
            transform: translateX(-50%) scaleY(-1);
  }
  .cbd {
    margin-top: 150px;
  }
  .cbd__row {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
  }
  .cbd__row.active .cbd__left::before, .cbd__row.active .cbd__left img {
    opacity: 1;
    -webkit-transform: translateY(0);
       -moz-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
  }
  .cbd__row.active .cbd__right {
    opacity: 1;
    -webkit-transform: translateY(0);
       -moz-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
  }
  .cbd__left {
    width: 480px;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .cbd__left::before {
    position: absolute;
    content: "";
    width: 488px;
    height: 572px;
    background: #f1ebd0;
    left: -95px;
    top: -75px;
    z-index: -1;
    opacity: 0;
    -webkit-transform: translateY(100px);
       -moz-transform: translateY(100px);
        -ms-transform: translateY(100px);
            transform: translateY(100px);
    -webkit-transition: all 1s ease 0s;
    -o-transition: all 1s ease 0s;
    -moz-transition: all 1s ease 0s;
    transition: all 1s ease 0s;
  }
  .cbd__left img {
    width: 100%;
    height: auto;
    opacity: 0;
    -webkit-transform: translateY(100px);
       -moz-transform: translateY(100px);
        -ms-transform: translateY(100px);
            transform: translateY(100px);
    -webkit-transition: all 1s ease 0.3s;
    -o-transition: all 1s ease 0.3s;
    -moz-transition: all 1s ease 0.3s;
    transition: all 1s ease 0.3s;
  }
  .cbd__right {
    width: -webkit-calc(100% - 480px);
    width: -moz-calc(100% - 480px);
    width: calc(100% - 480px);
    padding: 80px 0 0 55px;
    opacity: 0;
    -webkit-transform: translateY(100px);
       -moz-transform: translateY(100px);
        -ms-transform: translateY(100px);
            transform: translateY(100px);
    -webkit-transition: all 1s ease 0.6s;
    -o-transition: all 1s ease 0.6s;
    -moz-transition: all 1s ease 0.6s;
    transition: all 1s ease 0.6s;
  }
  .cbd__right h2 {
    font-size: 3.2rem;
    line-height: 0.8;
    font-weight: 600;
    font-family: "Noto Serif JP", serif;
    letter-spacing: 0.1em;
  }
  .cbd__right h2 span {
    display: inline-block;
    font-size: 8rem;
    line-height: 0.8;
    margin-top: 40px;
    position: relative;
    padding: 0 25px 0 5px;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .cbd__right h2 span::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 22.5px;
    background: url("../img/line.png") 0 0 no-repeat;
    -moz-background-size: contain;
         background-size: contain;
    left: 0;
    bottom: -15px;
    z-index: -1;
  }
  .cbd__right .txt {
    margin-top: 70px;
    font-size: 1.6rem;
    line-height: 38px;
    font-family: kozuka-gothic-pr6n, sans-serif;
    font-weight: 400;
    letter-spacing: 0.1em;
  }
  .expected {
    margin-top: 150px;
  }
  .expected__row {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
  }
  .expected__row.active .expected__right::before, .expected__row.active .expected__right img {
    opacity: 1;
    -webkit-transform: translateY(0);
       -moz-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
  }
  .expected__row.active .expected__left {
    opacity: 1;
    -webkit-transform: translateY(0);
       -moz-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
  }
  .expected__left {
    width: -webkit-calc(100% - 480px);
    width: -moz-calc(100% - 480px);
    width: calc(100% - 480px);
    padding-right: 98px;
    opacity: 0;
    -webkit-transform: translateY(100px);
       -moz-transform: translateY(100px);
        -ms-transform: translateY(100px);
            transform: translateY(100px);
    -webkit-transition: all 1s ease 0.6s;
    -o-transition: all 1s ease 0.6s;
    -moz-transition: all 1s ease 0.6s;
    transition: all 1s ease 0.6s;
  }
  .expected__left h2 {
    font-size: 3.2rem;
    line-height: 0.8;
    font-weight: 600;
    font-family: "Noto Serif JP", serif;
    letter-spacing: 0.1em;
  }
  .expected__left .img {
    line-height: 0;
    margin-top: 50px;
  }
  .expected__left .img img {
    width: 100%;
    height: auto;
  }
  .expected__right {
    width: 480px;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .expected__right::before {
    position: absolute;
    content: "";
    width: 488px;
    height: 572px;
    background: #f1ebd0;
    right: -95px;
    top: -75px;
    z-index: -1;
    opacity: 0;
    -webkit-transform: translateY(100px);
       -moz-transform: translateY(100px);
        -ms-transform: translateY(100px);
            transform: translateY(100px);
    -webkit-transition: all 1s ease 0s;
    -o-transition: all 1s ease 0s;
    -moz-transition: all 1s ease 0s;
    transition: all 1s ease 0s;
  }
  .expected__right img {
    width: 100%;
    height: auto;
    opacity: 0;
    -webkit-transform: translateY(100px);
       -moz-transform: translateY(100px);
        -ms-transform: translateY(100px);
            transform: translateY(100px);
    -webkit-transition: all 1s ease 0.3s;
    -o-transition: all 1s ease 0.3s;
    -moz-transition: all 1s ease 0.3s;
    transition: all 1s ease 0.3s;
  }
  .expected__btn {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-top: 65px;
  }
  .expected__btn a {
    display: inline-block;
    line-height: 0;
    width: 663px;
  }
  .expected__btn a img {
    width: 100%;
    height: auto;
  }
  .cannabis {
    height: 800px;
    background: url("../img/bgLeaf.jpg") top center no-repeat;
    -moz-background-size: cover;
         background-size: cover;
    margin-top: 115px;
    padding: 90px 0 80px;
    text-align: center;
  }
  .cannabis h2 {
    font-size: 3.2rem;
    line-height: 0.8;
    font-weight: 600;
    font-family: "Noto Serif JP", serif;
    letter-spacing: 0.1em;
  }
  .cannabis .txt {
    font-size: 1.5rem;
    line-height: 42px;
    font-weight: 400;
    margin-top: 50px;
    font-family: kozuka-gothic-pr6n, sans-serif;
  }
  .cannabis ul {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-top: 70px;
  }
  .cannabis ul li {
    width: 178px;
    height: 250px;
    display: block;
    text-align: center;
    font-family: "Noto Serif JP", serif;
    line-height: 0.8;
    font-weight: 700;
    letter-spacing: 0.1em;
    padding: 42px 0 0 0;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .cannabis ul li + li {
    margin-left: 45px;
  }
  .cannabis ul li::before {
    position: absolute;
    content: "";
    width: -webkit-calc(100% + 20px);
    width: -moz-calc(100% + 20px);
    width: calc(100% + 20px);
    height: -webkit-calc(100% + 20px);
    height: -moz-calc(100% + 20px);
    height: calc(100% + 20px);
    background: #F8F8FA;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
       -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    z-index: -2;
  }
  .cannabis ul li::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background: #FCFCFC;
    top: 0;
    left: 0;
    z-index: -1;
  }
  .cannabis ul li * {
    width: 100%;
    display: block;
  }
  .cannabis ul li span {
    font-size: 2.6rem;
  }
  .cannabis ul li em {
    font-size: 5rem;
    font-style: normal;
    margin-top: 31px;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .cannabis ul li em::before {
    position: absolute;
    content: "";
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
       -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
  .cannabis ul li em.eksu::before {
    width: 145px;
    height: 145px;
    background: url("../img/eksu.svg") 0 0 no-repeat;
    -moz-background-size: contain;
         background-size: contain;
  }
  .cannabis ul li em.maru::before {
    width: 175px;
    height: 175px;
    background: url("../img/maru.svg") 0 0 no-repeat;
    -moz-background-size: contain;
         background-size: contain;
  }
  .cannabis ul li small {
    font-size: 1.9rem;
    margin-top: 80px;
  }
  .wave {
    height: 500px;
    background: url("../img/bgWave.jpg") bottom center no-repeat;
    -moz-background-size: cover;
         background-size: cover;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: end;
       -moz-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
  }
  .wave__text {
    line-height: 0;
    width: 269px;
    padding: 0 0 86px;
  }
  .wave__text img {
    width: 100%;
    height: auto;
  }
  .wave__fig {
    width: 180px;
    line-height: 0;
    margin-left: 100px;
    padding: 0 0 55px;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .wave__fig img {
    width: 100%;
    height: auto;
  }
  .enjoy {
    padding: 50px 0 0;
  }
  .enjoy h2 {
    text-align: center;
    font-size: 2.1rem;
    line-height: 43px;
    font-weight: 400;
    font-family: kozuka-gothic-pr6n, sans-serif;
    letter-spacing: 0.2em;
    color: #000;
  }
  .enjoy h2 span {
    display: inline-block;
    font-weight: 700;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .enjoy h2 span::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 11px;
    background: url("../img/line02.png") 0 0 no-repeat;
    -moz-background-size: contain;
         background-size: contain;
    bottom: 7px;
    z-index: -1;
  }
  .enjoy__list {
    margin-top: 69px;
  }
  .enjoy__listAr {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
  }
  .enjoy__listAr .right {
    width: 439px;
    position: relative;
  }
  .enjoy__listAr .right img {
    width: 100%;
    height: auto;
  }
  .enjoy__listAr .left {
    width: -webkit-calc(100% - 439px);
    width: -moz-calc(100% - 439px);
    width: calc(100% - 439px);
  }
  .enjoy__listAr .left .tag {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 1.8rem;
    font-weight: 700;
    font-family: kozuka-gothic-pr6n, sans-serif;
    color: #fff;
    background: #000;
    height: 34px;
    width: 190px;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    letter-spacing: 0.4em;
  }
  .enjoy__listAr .left h3 {
    font-size: 3.2rem;
    line-height: 0.8;
    font-weight: 600;
    letter-spacing: 0.1em;
    margin-top: 57px;
  }
  .enjoy__listAr .left .txt {
    margin-top: 30px;
    position: relative;
    font-size: 1.6rem;
    line-height: 38px;
    font-family: kozuka-gothic-pr6n, sans-serif;
    font-weight: 400;
    padding: 0 0 45px 30px;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
    border-left: 1px solid #3a3a3a;
  }
  .enjoy__listAr .left .txt::after {
    position: absolute;
    content: "";
    width: 4px;
    height: 8px;
    background: url("../img/halfArrow.png") bottom no-repeat;
    -moz-background-size: 100% auto;
         background-size: 100% auto;
    left: 0;
    bottom: 0;
  }
  .enjoy__listAr .left .note {
    margin-top: 12px;
    padding: 30px 25px 27px 27px;
    font-size: 1.8rem;
    line-height: 44px;
    letter-spacing: 0.1em;
    font-family: kozuka-gothic-pr6n, sans-serif;
    font-weight: 700;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .enjoy__listAr .left .note.withB {
    padding-bottom: 10px;
  }
  .enjoy__listAr .left .note::after {
    position: absolute;
    content: "";
    width: -webkit-calc(100% + 80px);
    width: -moz-calc(100% + 80px);
    width: calc(100% + 80px);
    height: 100%;
    background: #F7F3E4;
    top: 0;
    z-index: -1;
    left: 0;
  }
  .enjoy__listAr .left .note span {
    display: inline-block;
    font-weight: 700;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .enjoy__listAr .left .note span::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 11px;
    background: url("../img/line03.png") right bottom no-repeat;
    -moz-background-size: contain;
         background-size: contain;
    bottom: 7px;
    z-index: -1;
  }
  .enjoy__listAr .left .note .btn {
    margin-top: -67px;
  }
  .enjoy__listAr .left .note .btn img {
    width: 595px;
    vertical-align: top;
  }
  .enjoy__listAr + .enjoy__listAr {
    margin-top: 192px;
  }
  .enjoy__listAr:nth-child(even) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
       -moz-box-orient: horizontal;
       -moz-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
  }
  .enjoy__listAr:nth-child(even) .left {
    padding-left: 55px;
  }
  .enjoy__listAr:nth-child(even) .left .note::after {
    left: inherit;
    right: -25px;
  }
  .relaxing {
    margin-top: 170px;
    background: url("../img/bgWave.jpg") bottom center no-repeat;
    -moz-background-size: cover;
         background-size: cover;
  }
  .relaxing h2 {
    text-align: center;
  }
  .relaxing h2 span {
    font-size: 3.6rem;
    line-height: 0.8;
    font-weight: 600;
    letter-spacing: 0.1em;
    padding: 0 29px;
    display: inline-block;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .relaxing h2 span::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 22px;
    background: url("../img/lineBig.png") right center no-repeat;
    -moz-background-size: contain;
         background-size: contain;
    left: 0;
    bottom: -16px;
    z-index: -1;
  }
  .relaxing__row {
    margin-top: 100px;
    padding: 0 0 62px 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .relaxing__left {
    width: 505px;
  }
  .relaxing__title span {
    font-size: 2rem;
    line-height: 48px;
    font-weight: 700;
    font-family: kozuka-gothic-pr6n, sans-serif;
    letter-spacing: 0.1em;
  }
  .relaxing__title h3 {
    line-height: 0;
    margin-top: 23px;
  }
  .relaxing__title h3 img {
    width: 375px;
    height: auto;
  }
  .relaxing__txt {
    font-size: 1.8rem;
    line-height: 38px;
    letter-spacing: 0.1em;
    font-family: kozuka-gothic-pr6n, sans-serif;
    font-weight: 400;
    margin-top: 50px;
  }
  .relaxing__btn {
    margin-top: 40px;
  }
  .relaxing__btn a {
    display: inline-block;
    line-height: 0;
  }
  .relaxing__btn a:hover {
    opacity: 1;
  }
  .relaxing__btn a:hover img {
    opacity: 1;
    -webkit-transform: scale(1.03);
       -moz-transform: scale(1.03);
        -ms-transform: scale(1.03);
            transform: scale(1.03);
  }
  .relaxing__btn a img {
    width: 100%;
    height: auto;
  }
  .relaxing__right {
    width: 232px;
    margin-left: 130px;
    line-height: 0;
  }
  .relaxing__right img {
    width: 100%;
    height: auto;
  }
  .news {
    margin-top: 95px;
    margin-bottom: 65px;
  }
  .news h2 {
    font-size: 3.7rem;
    line-height: 0.8;
    font-weight: 600;
    text-align: center;
  }
  .news__inner {
    max-width: 800px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  .news__inner ul {
    border-top: 1px solid #d1be63;
    margin-top: 40px;
  }
  .news__inner ul li {
    padding: 11px 0 23px;
    border-bottom: 1px solid #d1be63;
  }
  .news__inner ul li a {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
  }
  .news__inner ul li a time {
    width: 110px;
    font-size: 1.4rem;
    line-height: 60px;
    font-weight: 700;
    letter-spacing: 0.1em;
    font-family: kozuka-gothic-pr6n, sans-serif;
  }
  .news__inner ul li a article {
    width: -webkit-calc(100% - 110px);
    width: -moz-calc(100% - 110px);
    width: calc(100% - 110px);
    padding: 0 30px 0 0;
  }
  .news__inner ul li a article h3 {
    font-size: 2.2rem;
    line-height: 1.5;
    font-weight: 600;
    letter-spacing: 0.1em;
    padding: 13px 0;
  }
  .news__inner ul li a article p {
    font-size: 1.6rem;
    line-height: 30px;
    font-weight: 400;
    font-family: kozuka-gothic-pr6n, sans-serif;
    letter-spacing: 0.1em;
    margin-top: 7px;
  }
  .news__btn {
    text-align: center;
    margin-top: 50px;
  }
  .news__btn a {
    display: inline-block;
    line-height: 0;
    width: 662px;
  }
  .news__btn a img {
    width: 100%;
    height: auto;
  }
}

@media screen and (max-width: 768px) {
  .fv {
    height: 180.55556vw;
    background: url("../img/bgFv_sp.jpg") top center no-repeat;
    -moz-background-size: cover;
         background-size: cover;
    width: 100%;
    position: relative;
  }
  .fv__inner {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    height: 100%;
    padding: 26.38889vw 0 0;
  }
  .fv__innerLeft {
    width: 42.36111vw;
    text-align: center;
  }
  .fv__innerLeft .txt {
    line-height: 0;
    width: 100%;
  }
  .fv__innerLeft .txt img {
    width: 100%;
    height: auto;
  }
  .fv__innerLeft .btn {
    position: absolute;
    bottom: 4.16667vw;
    left: 50%;
    -webkit-transform: translateX(-50%);
       -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
  }
  .fv__innerLeft .btn a {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    color: #fff;
    font-size: 3.61111vw;
    font-weight: 700;
    width: 90.27778vw;
    height: 8.33333vw;
    background: #cfbc62;
    font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", sans-serif;
    color: #fff;
  }
  .fv__innerRight {
    width: 38.33333vw;
    margin-top: 11.11111vw;
    line-height: 0;
  }
  .fv__innerRight img {
    width: 100%;
    height: auto;
    -webkit-filter: drop-shadow(3.47222vw 3.47222vw 0.55556vw rgba(0, 0, 0, 0.5));
            filter: drop-shadow(3.47222vw 3.47222vw 0.55556vw rgba(0, 0, 0, 0.5));
  }
  .lifetime {
    text-align: center;
    padding: 18.05556vw 0 0;
  }
  .lifetime h2 {
    font-size: 5.13889vw;
    line-height: 9.02778vw;
    font-weight: 600;
    letter-spacing: 0.1em;
    color: #3a3a3a;
  }
  .lifetime .txt {
    font-size: 2.77778vw;
    line-height: 6.94444vw;
    font-weight: 400;
    letter-spacing: 0.15em;
    margin-top: 8.33333vw;
    font-family: kozuka-gothic-pr6n, sans-serif;
    font-weight: 400;
  }
  .lifetime .more {
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
    text-align: center;
    margin-top: 7.63889vw;
  }
  .lifetime .more::after {
    position: absolute;
    content: "";
    width: 0.60208vw;
    height: 25.71847vw;
    background: url("../img/arDown.svg") 0 0 no-repeat;
    -moz-background-size: contain;
         background-size: contain;
    left: 50%;
    -webkit-transform: translateX(-50%);
       -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    top: 100%;
  }
  .lifetime .more span {
    display: inline-block;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
    font-size: 4.16667vw;
    line-height: 10.69444vw;
    font-weight: 600;
    font-family: "Noto Serif JP", serif;
    padding: 0.97222vw 0;
  }
  .lifetime .more span::before, .lifetime .more span::after {
    position: absolute;
    content: "";
    width: 9.57014vw;
    height: 2.23292vw;
    background: url("../img/quarCircle.svg") 0 0 no-repeat;
    -moz-background-size: contain;
         background-size: contain;
    left: 50%;
    -webkit-transform: translateX(-50%);
       -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
  }
  .lifetime .more span::before {
    top: 0;
  }
  .lifetime .more span::after {
    bottom: 0;
    -webkit-transform: translateX(-50%) scaleY(-1);
       -moz-transform: translateX(-50%) scaleY(-1);
        -ms-transform: translateX(-50%) scaleY(-1);
            transform: translateX(-50%) scaleY(-1);
  }
  .cbd {
    margin-top: 36.11111vw;
  }
  .cbd__left {
    width: 54.86111vw;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
    margin-top: 16.38889vw;
    padding-left: 8.61111vw;
  }
  .cbd__left::before {
    position: absolute;
    content: "";
    width: 46.38889vw;
    height: 54.44444vw;
    background: #f1ebd0;
    left: 0;
    top: -5.55556vw;
    z-index: -1;
    opacity: 0;
    -webkit-transform: translateY(13.88889vw);
       -moz-transform: translateY(13.88889vw);
        -ms-transform: translateY(13.88889vw);
            transform: translateY(13.88889vw);
    -webkit-transition: all 1s ease 0s;
    -o-transition: all 1s ease 0s;
    -moz-transition: all 1s ease 0s;
    transition: all 1s ease 0s;
  }
  .cbd__left img {
    width: 100%;
    height: auto;
    opacity: 0;
    -webkit-transform: translateY(13.88889vw);
       -moz-transform: translateY(13.88889vw);
        -ms-transform: translateY(13.88889vw);
            transform: translateY(13.88889vw);
    -webkit-transition: all 1s ease 0.3s;
    -o-transition: all 1s ease 0.3s;
    -moz-transition: all 1s ease 0.3s;
    transition: all 1s ease 0.3s;
  }
  .cbd__left.active::before {
    -webkit-transform: translateY(0);
       -moz-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  .cbd__left.active img {
    -webkit-transform: translateY(0);
       -moz-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  .cbd__right {
    width: 100%;
  }
  .cbd__right h2 {
    font-size: 4.86111vw;
    line-height: 0.8;
    font-weight: 600;
    font-family: "Noto Serif JP", serif;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .cbd__right h2 span {
    display: inline-block;
    font-size: 11.11111vw;
    line-height: 0.8;
    margin-top: 5.55556vw;
    position: relative;
    padding: 0 3.47222vw 0 3.47222vw;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .cbd__right h2 span::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 3.125vw;
    background: url("../img/line.png") 0 0 no-repeat;
    -moz-background-size: contain;
         background-size: contain;
    left: 0;
    bottom: -2.08333vw;
    z-index: -1;
  }
  .cbd__right .txt {
    margin-top: 8.33333vw;
    font-size: 2.77778vw;
    line-height: 6.94444vw;
    font-family: kozuka-gothic-pr6n, sans-serif;
    font-weight: 400;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .expected {
    margin-top: 18.05556vw;
  }
  .expected__left {
    width: 100%;
  }
  .expected__left h2 {
    font-size: 4.86111vw;
    line-height: 0.8;
    font-weight: 600;
    font-family: "Noto Serif JP", serif;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .expected__left .img {
    line-height: 0;
    margin-top: 5.55556vw;
    text-align: center;
  }
  .expected__left .img img {
    width: 82.36111vw;
    height: auto;
  }
  .expected__right {
    width: 54.86111vw;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
    margin-top: 8.33333vw;
    padding-right: 8.61111vw;
  }
  .expected__right::before {
    position: absolute;
    content: "";
    width: 46.38889vw;
    height: 54.44444vw;
    background: #f1ebd0;
    right: 0;
    top: -5.55556vw;
    z-index: -1;
    opacity: 0;
    -webkit-transform: translateY(13.88889vw);
       -moz-transform: translateY(13.88889vw);
        -ms-transform: translateY(13.88889vw);
            transform: translateY(13.88889vw);
    -webkit-transition: all 1s ease 0s;
    -o-transition: all 1s ease 0s;
    -moz-transition: all 1s ease 0s;
    transition: all 1s ease 0s;
  }
  .expected__right img {
    width: 100%;
    height: auto;
    opacity: 0;
    -webkit-transform: translateY(13.88889vw);
       -moz-transform: translateY(13.88889vw);
        -ms-transform: translateY(13.88889vw);
            transform: translateY(13.88889vw);
    -webkit-transition: all 1s ease 0.3s;
    -o-transition: all 1s ease 0.3s;
    -moz-transition: all 1s ease 0.3s;
    transition: all 1s ease 0.3s;
  }
  .expected__right.active::before {
    -webkit-transform: translateY(0);
       -moz-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  .expected__right.active img {
    -webkit-transform: translateY(0);
       -moz-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  .expected__btn {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-top: 6.11111vw;
  }
  .expected__btn a {
    display: inline-block;
    line-height: 0;
    width: 85.41667vw;
  }
  .expected__btn a img {
    width: 100%;
    height: auto;
  }
  .cannabis {
    background: url("../img/bgLeaf_sp.jpg") 0 0 no-repeat;
    -moz-background-size: contain;
         background-size: contain;
    margin-top: 18.75vw;
    padding: 10.41667vw 0 13.88889vw 6.66667vw;
  }
  .cannabis h2 {
    font-size: 4.86111vw;
    line-height: 0.8;
    font-weight: 600;
    font-family: "Noto Serif JP", serif;
    letter-spacing: 0.1em;
  }
  .cannabis .txt {
    font-size: 2.77778vw;
    line-height: 6.94444vw;
    font-weight: 400;
    margin-top: 7.63889vw;
    font-family: kozuka-gothic-pr6n, sans-serif;
  }
  .cannabis ul {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 9.72222vw;
    padding-left: 1.38889vw;
  }
  .cannabis ul li {
    width: 24.72222vw;
    height: 34.72222vw;
    display: block;
    text-align: center;
    font-family: "Noto Serif JP", serif;
    line-height: 0.8;
    font-weight: 700;
    letter-spacing: 0.1em;
    padding: 5.83333vw 0 0 0;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .cannabis ul li + li {
    margin-left: 6.25vw;
  }
  .cannabis ul li::before {
    position: absolute;
    content: "";
    width: -webkit-calc(100% + 2.77778vw);
    width: -moz-calc(100% + 2.77778vw);
    width: calc(100% + 2.77778vw);
    height: -webkit-calc(100% + 2.77778vw);
    height: -moz-calc(100% + 2.77778vw);
    height: calc(100% + 2.77778vw);
    background: #F8F8FA;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
       -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    z-index: -2;
  }
  .cannabis ul li::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background: #FCFCFC;
    top: 0;
    left: 0;
    z-index: -1;
  }
  .cannabis ul li * {
    width: 100%;
    display: block;
  }
  .cannabis ul li span {
    font-size: 3.61111vw;
  }
  .cannabis ul li em {
    font-size: 6.94444vw;
    font-style: normal;
    margin-top: 4.30556vw;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .cannabis ul li em::before {
    position: absolute;
    content: "";
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
       -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
  .cannabis ul li em.eksu::before {
    width: 20.13889vw;
    height: 20.13889vw;
    background: url("../img/eksu.svg") 0 0 no-repeat;
    -moz-background-size: contain;
         background-size: contain;
  }
  .cannabis ul li em.maru::before {
    width: 24.30556vw;
    height: 24.30556vw;
    background: url("../img/maru.svg") 0 0 no-repeat;
    -moz-background-size: contain;
         background-size: contain;
  }
  .cannabis ul li small {
    font-size: 2.63889vw;
    margin-top: 11.11111vw;
  }
  .wave {
    height: 47.91667vw;
    background: url("../img/bgWave.jpg") bottom center no-repeat;
    -moz-background-size: cover;
         background-size: cover;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: end;
       -moz-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
  }
  .wave__text {
    line-height: 0;
    width: 31.66667vw;
    padding: 0 0 9.72222vw;
  }
  .wave__text img {
    width: 100%;
    height: auto;
  }
  .wave__fig {
    width: 20.83333vw;
    line-height: 0;
    margin-left: 11.80556vw;
    padding: 0 0 4.02778vw;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .wave__fig img {
    width: 100%;
    height: auto;
  }
  .enjoy {
    padding: 5.55556vw 0 0;
  }
  .enjoy h2 {
    text-align: center;
    font-size: 3.05556vw;
    line-height: 5.97222vw;
    font-weight: 400;
    font-family: kozuka-gothic-pr6n, sans-serif;
    letter-spacing: 0.2em;
    color: #000;
  }
  .enjoy h2 span {
    display: inline-block;
    font-weight: 700;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .enjoy h2 span::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 1.52778vw;
    background: url("../img/line02.png") 0 0 no-repeat;
    -moz-background-size: contain;
         background-size: contain;
    bottom: 0.97222vw;
    z-index: -1;
  }
  .enjoy__list {
    margin-top: 14.16667vw;
    padding-left: 0;
    padding-right: 0;
  }
  .enjoy__listAr {
    position: relative;
  }
  .enjoy__listAr .right {
    width: 39.58333vw;
    position: absolute;
    top: 0;
  }
  .enjoy__listAr .right img {
    width: 100%;
    height: auto;
  }
  .enjoy__listAr .left {
    width: 100%;
  }
  .enjoy__listAr .left .tag {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 2.5vw;
    font-weight: 700;
    font-family: kozuka-gothic-pr6n, sans-serif;
    color: #fff;
    background: #000;
    height: 4.86111vw;
    width: 27.77778vw;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    letter-spacing: 0.4em;
  }
  .enjoy__listAr .left h3 {
    font-size: 4.58333vw;
    line-height: 0.8;
    font-weight: 600;
    letter-spacing: 0.1em;
    margin-top: 6.94444vw;
  }
  .enjoy__listAr .left .txt {
    margin-top: 5.55556vw;
    position: relative;
    font-size: 2.77778vw;
    line-height: 5.27778vw;
    font-family: kozuka-gothic-pr6n, sans-serif;
    font-weight: 400;
    padding: 0 0 4.86111vw 4.16667vw;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
    border-left: 1px solid #3a3a3a;
  }
  .enjoy__listAr .left .txt::after {
    position: absolute;
    content: "";
    width: 1.11111vw;
    height: 2.22222vw;
    background: url("../img/halfArrow.png") bottom no-repeat;
    -moz-background-size: 100% auto;
         background-size: 100% auto;
    left: -1px;
    bottom: 0;
  }
  .enjoy__listAr .left .txt br {
    display: none;
  }
  .enjoy__listAr .left .note {
    margin-top: 2.77778vw;
    padding: 3.47222vw 3.47222vw 4.16667vw 6.94444vw;
    font-size: 2.91667vw;
    line-height: 6.25vw;
    letter-spacing: 0.1em;
    font-family: kozuka-gothic-pr6n, sans-serif;
    font-weight: 700;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
    background: #F7F3E4;
  }
  .enjoy__listAr .left .note span {
    display: inline-block;
    font-weight: 700;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .enjoy__listAr .left .note span::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 1.52778vw;
    background: url("../img/line03.png") right bottom no-repeat;
    -moz-background-size: contain;
         background-size: contain;
    bottom: 0.97222vw;
    z-index: -1;
  }
  .enjoy__listAr .left .note .btn {
    padding-right: 6.94444vw;
  }
  .enjoy__listAr + .enjoy__listAr {
    margin-top: 13.88889vw;
  }
  .enjoy__listAr:nth-child(odd) {
    padding-left: 6.94444vw;
  }
  .enjoy__listAr:nth-child(odd) .right {
    right: 0;
  }
  .enjoy__listAr:nth-child(odd) .left h3, .enjoy__listAr:nth-child(odd) .left .txt {
    width: 51.38889vw;
  }
  .enjoy__listAr:nth-child(odd) .left .note {
    margin-left: -6.94444vw;
  }
  .enjoy__listAr:nth-child(even) .right {
    left: 0;
  }
  .enjoy__listAr:nth-child(even) .left {
    padding-right: 6.94444vw;
    padding-left: 43.33333vw;
  }
  .enjoy__listAr:nth-child(even) .left .note {
    margin-right: -6.94444vw;
    margin-left: -43.33333vw;
  }
  .relaxing {
    margin-top: 31.11111vw;
  }
  .relaxing h2 {
    text-align: center;
  }
  .relaxing h2 span {
    font-size: 4.58333vw;
    line-height: 0.8;
    font-weight: 600;
    letter-spacing: 0.1em;
    padding: 0 4.02778vw;
    display: inline-block;
    position: relative;
    -webkit-transform: translateZ(0);
       -moz-transform: translateZ(0);
            transform: translateZ(0);
  }
  .relaxing h2 span::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 3.05556vw;
    background: url("../img/lineBig.png") right center no-repeat;
    -moz-background-size: contain;
         background-size: contain;
    left: 0;
    bottom: -2.22222vw;
    z-index: -1;
  }
  .relaxing__row {
    padding: 0 0 0 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
       -moz-box-orient: vertical;
       -moz-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
  .relaxing__left {
    width: 100%;
    margin-top: 7.63889vw;
  }
  .relaxing__title {
    text-align: center;
  }
  .relaxing__title span {
    font-size: 2.91667vw;
    line-height: 7.08333vw;
    font-weight: 700;
    font-family: kozuka-gothic-pr6n, sans-serif;
    letter-spacing: 0.1em;
  }
  .relaxing__title h3 {
    line-height: 0;
    margin-top: 2.63889vw;
  }
  .relaxing__title h3 img {
    width: 55.55556vw;
    height: auto;
  }
  .relaxing__txt {
    font-size: 3.05556vw;
    line-height: 6.52778vw;
    letter-spacing: 0.1em;
    font-family: kozuka-gothic-pr6n, sans-serif;
    font-weight: 400;
    margin-top: 7.63889vw;
    text-align: center;
  }
  .relaxing__btn {
    margin-top: 9.72222vw;
    padding: 0 6.94444vw;
  }
  .relaxing__btn a {
    display: inline-block;
    line-height: 0;
  }
  .relaxing__btn a img {
    width: 100%;
    height: auto;
  }
  .relaxing__right {
    width: 100%;
    line-height: 0;
    background: url("../img/bgWave.jpg") bottom center no-repeat;
    -moz-background-size: cover;
         background-size: cover;
    text-align: center;
    padding: 0 0 6.25vw;
    height: 49.58333vw;
    margin-top: 13.88889vw;
  }
  .relaxing__right img {
    width: 20.83333vw;
    height: auto;
  }
  .news {
    margin-top: 29.44444vw;
    margin-bottom: 12.5vw;
  }
  .news h2 {
    font-size: 5.13889vw;
    line-height: 0.8;
    font-weight: 600;
    text-align: center;
  }
  .news__inner {
    width: 100%;
    padding: 0 6.11111vw;
  }
  .news__inner ul {
    border-top: 1px solid #d1be63;
    margin-top: 4.02778vw;
  }
  .news__inner ul li {
    padding: 3.47222vw 0 3.19444vw;
    border-bottom: 1px solid #d1be63;
  }
  .news__inner ul li a {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 100%;
  }
  .news__inner ul li a time {
    width: 100%;
    font-size: 1.80556vw;
    line-height: 5.13889vw;
    font-weight: 700;
    letter-spacing: 0.1em;
    font-family: kozuka-gothic-pr6n, sans-serif;
  }
  .news__inner ul li a article {
    width: 100%;
    margin-top: 2.08333vw;
  }
  .news__inner ul li a article h3 {
    font-size: 3.05556vw;
    line-height: 1.5;
    font-weight: 600;
    letter-spacing: 0.05em;
    padding: 0.97222vw 0;
  }
  .news__inner ul li a article p {
    font-size: 2.5vw;
    line-height: 4.16667vw;
    font-weight: 400;
    font-family: kozuka-gothic-pr6n, sans-serif;
    letter-spacing: 0.05em;
    margin-top: 1.38889vw;
  }
  .news__btn {
    text-align: center;
    margin-top: 9.02778vw;
    padding: 0 6.11111vw;
  }
  .news__btn a {
    display: inline-block;
    line-height: 0;
    width: 100%;
  }
  .news__btn a img {
    width: 100%;
    height: auto;
  }
}

.boxoverlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1900;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  background: rgba(0, 0, 0, 0.49);
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  -moz-transition: all 0.5s;
  transition: all 0.5s;
}