@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Fugaz+One&display=swap");
@import url("https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@300;500;700&display=swap");
html {
  scroll-behavior: smooth;
}

.wrapper {
  background-image: none;
  padding: 0;
}

.mainConts {
  position: relative;
}
.mainConts .logo {
  position: absolute;
  z-index: 66;
  top: 26px;
  right: calc(50% + 470px);
}
.mainConts .logo a {
  max-width: 155px;
  display: block;
}
@media screen and (max-width: 1300px) {
  .mainConts .logo {
    right: inherit;
    left: 3%;
    width: 140px;
    top: 20px;
  }
}
@media screen and (max-width: 768px) {
  .mainConts .logo {
    left: 3%;
    width: 100px;
    top: 10px;
  }
}
.mainConts {
  padding: 0;
}
@media screen and (max-width: 768px) {
  .mainConts {
    padding: 0;
  }
}

.crush_txt_ttl {
  font-size: 50px;
  text-align: center;
  color: rgb(148, 45, 196);
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  .crush_txt_ttl {
    font-size: 40px;
    margin-bottom: 25px;
  }
}
.crush_txt_ttl em {
  display: block;
  max-width: 400px;
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .crush_txt_ttl em {
    max-width: 300px;
  }
}
@media screen and (max-width: 550px) {
  .crush_txt_ttl em {
    max-width: 250px;
  }
}
.crush_txt_ttl span {
  line-height: 1.2;
  display: block;
  text-align: center;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 18px;
  font-weight: 500;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  color: #6b6867;
}
@media screen and (max-width: 768px) {
  .crush_txt_ttl span {
    font-size: 15px;
  }
}

.gaba_txt_ttl {
  font-size: 50px;
  text-align: center;
  color: rgb(58, 190, 22);
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  .gaba_txt_ttl {
    font-size: 40px;
    margin-bottom: 25px;
  }
}
.gaba_txt_ttl em {
  display: block;
  max-width: 400px;
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .gaba_txt_ttl em {
    max-width: 300px;
  }
}
@media screen and (max-width: 550px) {
  .gaba_txt_ttl em {
    max-width: 250px;
  }
}
.gaba_txt_ttl span {
  line-height: 1.2;
  display: block;
  text-align: center;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 18px;
  font-weight: 500;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  color: #6b6867;
}
@media screen and (max-width: 768px) {
  .gaba_txt_ttl span {
    font-size: 15px;
  }
}

.aloe_txt_ttl {
  font-size: 50px;
  text-align: center;
  color: #12bd26;
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  .aloe_txt_ttl {
    font-size: 40px;
    margin-bottom: 25px;
  }
}
.aloe_txt_ttl em {
  display: block;
  max-width: 400px;
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .aloe_txt_ttl em {
    max-width: 300px;
  }
}
@media screen and (max-width: 550px) {
  .aloe_txt_ttl em {
    max-width: 250px;
  }
}
.aloe_txt_ttl span {
  line-height: 1.2;
  display: block;
  text-align: center;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 18px;
  font-weight: 500;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  color: #6b6867;
}
@media screen and (max-width: 768px) {
  .aloe_txt_ttl span {
    font-size: 15px;
  }
}

.limited_txt_ttl {
  font-size: 50px;
  text-align: center;
  color: rgb(254, 86, 68);
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  .limited_txt_ttl {
    font-size: 40px;
    margin-bottom: 25px;
  }
}
.limited_txt_ttl em {
  display: block;
  max-width: 400px;
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .limited_txt_ttl em {
    max-width: 300px;
  }
}
@media screen and (max-width: 550px) {
  .limited_txt_ttl em {
    max-width: 250px;
  }
}
.limited_txt_ttl span {
  line-height: 1.2;
  display: block;
  text-align: center;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 18px;
  font-weight: 500;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  color: #6b6867;
}
@media screen and (max-width: 768px) {
  .limited_txt_ttl span {
    font-size: 15px;
  }
}

#movie {
  position: relative;
  margin-bottom: 120px;
  padding: 0 2%;
}
@media screen and (max-width: 768px) {
  #movie {
    margin-bottom: 90px;
    padding: 0 5%;
  }
}
#movie .inner_area {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  background-color: #cfe7da;
  border-radius: 30px;
  padding: 60px 1%;
}
@media screen and (max-width: 768px) {
  #movie .inner_area {
    margin: 0 auto 60px;
    padding: 30px 3%;
    border-radius: 30px;
  }
}
@media screen and (max-width: 450px) {
  #movie .inner_area {
    padding: 30px 10px;
    border-radius: 30px;
    margin: 0 auto 50px;
  }
}
#movie .inner_area .movie_ttl {
  width: 100%;
  margin: 0 auto;
  text-align: center;
}
#movie .inner_area li {
  margin-top: 80px;
  display: flex;
}
@media screen and (max-width: 768px) {
  #movie .inner_area li:first-child {
    margin-top: 10px;
  }
}
@media screen and (max-width: 768px) {
  #movie .inner_area li {
    margin-top: 70px;
  }
}
#movie .inner_area li .crush_movie {
  background: url("../img/movie_back.png") no-repeat center/contain;
  width: 55%;
  max-width: 600px;
}
@media screen and (max-width: 768px) {
  #movie .inner_area li .crush_movie {
    width: 86%;
  }
}
#movie .inner_area li .crush_movie .thumb {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
#movie .inner_area li .crush_movie .thumb img {
  width: 100%;
  overflow: hidden;
  padding: 30px 45px 20px;
}
@media screen and (max-width: 500px) {
  #movie .inner_area li .crush_movie .thumb img {
    padding: 15px 25px 10px;
  }
}
#movie .inner_area li .crush_movie .thumb .obento {
  padding: 40px 90px;
}
@media screen and (max-width: 1000px) {
  #movie .inner_area li .crush_movie .thumb .obento {
    padding: 30px 70px;
  }
}
@media screen and (max-width: 500px) {
  #movie .inner_area li .crush_movie .thumb .obento {
    padding: 20px 40px;
  }
}
#movie .inner_area li .crush_movie {
  /*a {
  	position: relative;
  	display: flex;
  	justify-content: center;
  	align-items: center;
  	figure {
  		img {
  			width: 100%;
  			overflow: hidden;
  			padding: 30px 45px 20px;
  			@include break (500) {
  				padding: 15px 25px 10px;
  			}
  		}
  		.obento {
  			padding: 40px 90px;
  			@include break (1000) {
  				padding: 30px 70px;
  			}
  			@include break (500) {
  				padding: 20px 40px;
  			}
  		}
  	}&:hover {
  		img {
  			@include transition;
  			transform: scale(1.06);
  		}
  	}
  }*/
}
#movie .inner_area .movie_left {
  position: relative;
}
#movie .inner_area .movie_left .crush_txt {
  position: absolute;
  right: 130px;
  bottom: 0;
  width: 45%;
  max-width: 494px;
}
@media screen and (max-width: 768px) {
  #movie .inner_area .movie_left .crush_txt {
    bottom: -60px;
    right: 0;
    width: 50%;
  }
}
#movie .inner_area .movie_right {
  position: relative;
  flex-direction: row-reverse;
}
#movie .inner_area .movie_right .crush_txt {
  position: absolute;
  left: 160px;
  bottom: 0;
  width: 45%;
  max-width: 460px;
}
@media screen and (max-width: 768px) {
  #movie .inner_area .movie_right .crush_txt {
    bottom: -50px;
    left: 0;
    width: 50%;
  }
}
#movie .crush_btn {
  width: 100%;
  max-width: 350px;
  margin: 20px auto;
}
@media screen and (max-width: 768px) {
  #movie .crush_btn {
    width: 100%;
    margin: 10px auto 40px;
  }
}
#movie .crush_btn .crushbtn {
  display: table;
  width: 100%;
  max-width: 350px;
  height: 70px;
  border-radius: 35px;
  background-color: #ffffff;
  border: #db3d93 3px solid;
  box-shadow: 0px 7px 0 0 #db3d93;
  transition: all 0.3s;
}
@media screen and (max-width: 768px) {
  #movie .crush_btn .crushbtn {
    height: 50px;
    border-radius: 25px;
    width: 80%;
    margin: 0 auto;
  }
}
#movie .crush_btn .crushbtn a {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  font-size: 21px;
  font-weight: bold;
  letter-spacing: 0.05em;
  position: relative;
  color: #db3d93;
}
@media screen and (max-width: 768px) {
  #movie .crush_btn .crushbtn a {
    font-size: 16px;
  }
}
#movie .crush_btn .crushbtn:hover {
  transform: translateY(7px);
  box-shadow: 0px 0px 0 0 #db3d93;
}

/*----------------- #crush_contents ---------------------*/
#crush_top {
  position: relative;
  background: #ecfeff;
  padding: 100px 0 120px;
}
@media screen and (max-width: 1000px) {
  #crush_top {
    padding: 10px 5% 60px;
  }
}
#crush_top .inner_area {
  position: relative;
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  #crush_top .inner_area {
    width: 100%;
  }
}
#crush_top .top {
  margin: 100px auto 140px;
  position: relative;
}
@media screen and (max-width: 768px) {
  #crush_top .top {
    margin: 50px auto;
  }
}
#crush_top .top::before {
  content: url("../img/crush_top_bg_01.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: -80px;
  left: -90px;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  #crush_top .top::before {
    transform: scale(0.5);
    top: -60px;
    left: 60px;
  }
}
#crush_top .top::after {
  content: url("../img/crush_top_bg_02.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  bottom: 0;
  right: -30px;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  #crush_top .top::after {
    display: none;
  }
}
#crush_top .top .inner {
  display: flex;
  width: 100%;
  max-width: 950px;
  margin: 0 auto;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  z-index: 10;
}
@media screen and (max-width: 768px) {
  #crush_top .top .inner {
    display: block;
  }
}
#crush_top .top .inner .txt_contents .ttl {
  color: rgb(148, 45, 196);
  font-weight: bold;
  margin-bottom: 55px;
}
@media screen and (max-width: 768px) {
  #crush_top .top .inner .txt_contents .ttl {
    margin-bottom: 25px;
  }
}
#crush_top .top .inner .txt_contents .ttl p {
  font-size: 23px;
}
@media screen and (max-width: 768px) {
  #crush_top .top .inner .txt_contents .ttl p {
    font-size: 18px;
  }
}
#crush_top .top .inner .txt_contents .ttl h2 {
  font-size: 55px;
  line-height: 70px;
}
@media screen and (max-width: 768px) {
  #crush_top .top .inner .txt_contents .ttl h2 {
    font-size: 30px;
    line-height: 1.5;
  }
}
@media screen and (max-width: 768px) {
  #crush_top .top .inner .txt_contents .txt .type_ribbon {
    width: 60%;
  }
}
#crush_top .top .inner .txt_contents .txt p {
  margin-top: 25px;
}
@media screen and (max-width: 768px) {
  #crush_top .top .inner .txt_contents .txt p {
    margin-top: 15px;
    font-size: 14px;
  }
}
@media screen and (max-width: 768px) {
  #crush_top .top .inner .img_contents {
    text-align: right;
    position: absolute;
    top: 75px;
    right: 0;
  }
}
@media screen and (max-width: 768px) {
  #crush_top .top .inner .img_contents img {
    width: 35%;
  }
}
#crush_top .tokuho {
  width: 100%;
  max-width: 700px;
  margin: 0 auto 80px;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho {
    margin: 80px auto 50px;
  }
}
#crush_top .tokuho .point_box {
  position: relative;
}
#crush_top .tokuho .point_box::before {
  content: url("../img/tkh_bg.png");
  transform: scale(1);
  display: inline-block;
  position: absolute;
  top: -103px;
  right: 50px;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box::before {
    transform: scale(0.75);
    top: -91px;
    right: 10px;
  }
}
#crush_top .tokuho .point_box .ttl {
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgb(148, 45, 196);
  border-radius: 50px 50px 0 0;
  padding: 20px 0;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .ttl {
    border-radius: 40px 40px 0 0;
    padding: 15px 5%;
  }
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .ttl img {
    width: 20%;
  }
}
#crush_top .tokuho .point_box .ttl h3 {
  font-size: 30px;
  line-height: 1.5;
  color: #fff;
  padding-left: 20px;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .ttl h3 {
    font-size: 18px;
    padding-left: 10px;
  }
}
#crush_top .tokuho .point_box .ttl h3 span {
  font-size: 24px;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .ttl h3 span {
    font-size: 18px;
  }
}
#crush_top .tokuho .point_box .point {
  background: #fff;
  border-radius: 0 0 50px 50px;
  border: 3px solid rgb(148, 45, 196);
  padding: 40px 0;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .point {
    border-radius: 0 0 40px 40px;
    padding: 30px 5%;
  }
}
#crush_top .tokuho .point_box .point ul {
  max-width: 600px;
  margin: 0 auto;
}
#crush_top .tokuho .point_box .point ul li {
  color: rgb(148, 45, 196);
  font-weight: bold;
  font-size: 30px;
  line-height: 1.5;
  padding-left: 100px;
  position: relative;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .point ul li {
    font-size: 18px;
    padding-left: 70px;
  }
}
#crush_top .tokuho .point_box .point ul li:first-child {
  padding-bottom: 35px;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .point ul li:first-child {
    padding-bottom: 25px;
    border-bottom: 4px dotted;
  }
}
#crush_top .tokuho .point_box .point ul li:first-child::before {
  content: url("../img/tkh_nmb_01.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: -10px;
  left: 0;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .point ul li:first-child::before {
    transform: scale(0.65);
    top: -16px;
    left: -9px;
  }
}
#crush_top .tokuho .point_box .point ul li:first-child::after {
  content: url("../img/dotted_line_tkh.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  bottom: 0;
  left: 0;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .point ul li:first-child::after {
    display: none;
    transform: scale(0.48);
    left: -150px;
  }
}
#crush_top .tokuho .point_box .point ul li:nth-child(2) {
  padding-top: 20px;
  padding-bottom: 35px;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .point ul li:nth-child(2) {
    padding-top: 15px;
    padding-bottom: 20px;
    border-bottom: 4px dotted;
  }
}
#crush_top .tokuho .point_box .point ul li:nth-child(2)::before {
  content: url("../img/tkh_nmb_02.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: 30px;
  left: 0;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .point ul li:nth-child(2)::before {
    transform: scale(0.65);
    top: 0;
    left: -9px;
  }
}
#crush_top .tokuho .point_box .point ul li:nth-child(2)::after {
  content: url("../img/dotted_line_tkh.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  bottom: 0;
  left: 0;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .point ul li:nth-child(2)::after {
    display: none;
    transform: scale(0.48);
    left: -150px;
  }
}
#crush_top .tokuho .point_box .point ul li:last-child {
  padding-top: 20px;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .point ul li:last-child {
    padding-top: 15px;
  }
}
#crush_top .tokuho .point_box .point ul li:last-child::before {
  content: url("../img/tkh_nmb_03.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: 10px;
  left: 0;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .point ul li:last-child::before {
    transform: scale(0.65);
    top: 0;
    left: -9px;
  }
}
#crush_top .tokuho .point_box .point p {
  max-width: 600px;
  margin: 40px auto;
  line-height: 1.5;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .point p {
    margin: 30px auto;
    font-size: 14px;
  }
}
#crush_top .tokuho .point_box .point h4 {
  text-align: center;
  font-size: 20px;
  line-height: 1.5;
  color: rgb(148, 45, 196);
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .point_box .point h4 {
    font-size: 18px;
  }
}
#crush_top .tokuho .tokuho_what {
  background: rgb(148, 45, 196);
  border-radius: 50px;
  margin-top: 30px;
  padding: 30px 50px;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .tokuho_what {
    border-radius: 40px;
    margin-top: 20px;
    padding: 25px 10%;
  }
}
#crush_top .tokuho .tokuho_what .ttl {
  color: #fff8a6;
  font-size: 30px;
  font-weight: bold;
  padding-bottom: 10px;
  padding-left: 15px;
  position: relative;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .tokuho_what .ttl {
    font-size: 18px;
  }
}
#crush_top .tokuho .tokuho_what .ttl::after {
  content: "";
  display: inline-block;
  width: 5px;
  height: 35px;
  background-color: #fff8a6;
  position: absolute;
  top: 12px;
  left: 0;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .tokuho_what .ttl::after {
    width: 3px;
    height: 25px;
    top: 6px;
  }
}
#crush_top .tokuho .tokuho_what p {
  color: #fff;
  line-height: 1.5;
}
@media screen and (max-width: 768px) {
  #crush_top .tokuho .tokuho_what p {
    font-size: 14px;
  }
}
#crush_top .lineup {
  position: relative;
}
#crush_top .lineup::before {
  content: url("../img/lineup_c_bg_l.png");
  transform: scale(1);
  display: inline-block;
  position: absolute;
  bottom: 0;
  left: -80px;
}
@media screen and (max-width: 768px) {
  #crush_top .lineup::before {
    display: none;
  }
}
#crush_top .lineup::after {
  content: url("../img/lineup_c_bg_r.png");
  transform: scale(1);
  display: inline-block;
  position: absolute;
  bottom: 0;
  right: -80px;
}
@media screen and (max-width: 768px) {
  #crush_top .lineup::after {
    display: none;
  }
}
#crush_top .lineup .prod_list {
  display: flex;
  width: auto;
  margin: 0 auto;
  max-width: 1000px;
  justify-content: center;
}
#crush_top .lineup .prod_list li {
  width: 30%;
  margin: 0 1%;
  text-align: center;
  border-radius: 20px;
  background-color: white;
  box-shadow: 1px 2px 9px 0px rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 768px) {
  #crush_top .lineup .prod_list li {
    width: 50%;
  }
}
#crush_top .lineup .prod_list li a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: #000000;
  padding: 10px 5px 90px;
  position: relative;
}
#crush_top .lineup .prod_list li a .img {
  margin-bottom: 5px;
}
#crush_top .lineup .prod_list li a .name {
  line-height: 1.4;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #crush_top .lineup .prod_list li a .name {
    font-size: 16px;
    line-height: 0.8;
  }
}
#crush_top .lineup .prod_list li a .name span {
  font-size: 15px;
}
@media screen and (max-width: 768px) {
  #crush_top .lineup .prod_list li a .name span {
    display: block;
    font-size: 12px;
    line-height: 1.4;
  }
}
#crush_top .lineup .prod_list li a .dtl_btn {
  color: rgb(148, 45, 196);
  border: rgb(148, 45, 196) 2px solid;
  width: 100%;
  position: absolute;
  bottom: 30px;
  left: calc(50% - 100px);
  max-width: 200px;
  margin: 0 auto;
  height: 44px;
  display: table;
  border-radius: 22px;
  transition: all 0.3s;
}
@media screen and (max-width: 768px) {
  #crush_top .lineup .prod_list li a .dtl_btn {
    width: 85%;
    height: 40px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  }
}
#crush_top .lineup .prod_list li a .dtl_btn span {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  font-size: 16px;
  line-height: 1.4;
  text-decoration: none;
  position: relative;
}
@media screen and (max-width: 768px) {
  #crush_top .lineup .prod_list li a .dtl_btn span {
    font-size: 14px;
  }
}
#crush_top .lineup .prod_list li a .dtl_btn span::after {
  color: rgb(148, 45, 196);
  position: absolute;
  top: calc(50% - 7px);
  right: 18px;
  display: inline-block;
  content: "▲";
  transform: rotate(90deg);
  font-size: 12px;
}
@media screen and (max-width: 768px) {
  #crush_top .lineup .prod_list li a .dtl_btn span::after {
    top: 9px;
    right: 14px;
  }
}
#crush_top .lineup .prod_list li a .dtl_btn:hover {
  color: #fff;
  background: rgb(148, 45, 196);
}
#crush_top .lineup .prod_list li a .dtl_btn:hover span::after {
  color: #fff;
}

/*-----------------//#crush_contents---------------------*/
/*----------------- #gaba_contents ---------------------*/
#first_contents {
  background: #f4fff5;
}
@media screen and (max-width: 768px) {
  #first_contents .anc {
    padding: 0 5%;
  }
}
#first_contents .anc ul {
  /*display: flex;
  justify-content: space-between;
  max-width: 910px;
  margin: 0 auto;*/
  display: flex;
  justify-content: center;
  max-width: 1000px;
  margin: 0 auto;
  gap: 10px;
}
@media screen and (max-width: 768px) {
  #first_contents .anc ul {
    display: block;
    text-align: center;
  }
}
#first_contents .anc ul a {
  display: inline-block;
  text-decoration: none;
}
@media screen and (max-width: 768px) {
  #first_contents .anc ul a {
    display: block;
    margin-bottom: 10px;
  }
}
#first_contents .anc ul a li {
  width: 270px;
  margin: 0 auto;
  height: 65px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 33px;
  background: #fff;
  font-weight: bold;
  font-size: 18px;
  padding-left: 13px;
  transition: all 0.3s;
  position: relative;
}
@media screen and (max-width: 768px) {
  #first_contents .anc ul a li {
    width: 100%;
    height: 55px;
    font-size: 16px;
    padding: 0;
  }
}
#first_contents .anc ul a li::after {
  content: "";
  position: absolute;
  top: 45%;
  right: 25px;
  border: 6px solid transparent;
}
#first_contents .anc ul a .anc_btn_crush {
  color: rgb(148, 45, 196);
  border: rgb(148, 45, 196) 3px solid;
  position: relative;
}
#first_contents .anc ul a .anc_btn_crush::before {
  content: url("../img/nav_crush_pkg.png");
  transform: scale(0.8);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: 5px;
  left: 25px;
}
@media screen and (max-width: 768px) {
  #first_contents .anc ul a .anc_btn_crush::before {
    top: -1px;
    left: 25px;
  }
}
#first_contents .anc ul a .anc_btn_crush::after {
  border-top: 7px solid rgb(148, 45, 196);
}
#first_contents .anc ul a .anc_btn_crush:hover {
  color: #fff;
  background: rgb(148, 45, 196);
}
#first_contents .anc ul a .anc_btn_crush:hover::after {
  border-top: 7px solid #fff;
}
#first_contents .anc ul a .anc_btn_aloe {
  color: rgb(18, 189, 38);
  border: rgb(18, 189, 38) 3px solid;
  position: relative;
}
#first_contents .anc ul a .anc_btn_aloe::before {
  content: url("../img/nav_aloe_pkg.png");
  transform: scale(0.8);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: 5px;
  left: 18px;
}
@media screen and (max-width: 768px) {
  #first_contents .anc ul a .anc_btn_aloe::before {
    top: -1px;
    left: 25px;
  }
}
#first_contents .anc ul a .anc_btn_aloe::after {
  border-top: 7px solid rgb(18, 189, 38);
}
#first_contents .anc ul a .anc_btn_aloe:hover {
  color: #fff;
  background: rgb(18, 189, 38);
}
#first_contents .anc ul a .anc_btn_aloe:hover::after {
  border-top: 7px solid #fff;
}
#first_contents .anc ul a .anc_btn_gaba {
  color: rgb(29, 125, 36);
  border: rgb(29, 125, 36) 3px solid;
  position: relative;
}
#first_contents .anc ul a .anc_btn_gaba::before {
  content: url("../img/nav_gaba_pkg.png");
  transform: scale(0.8);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: 5px;
  left: 18px;
}
@media screen and (max-width: 768px) {
  #first_contents .anc ul a .anc_btn_gaba::before {
    top: -1px;
    left: 25px;
  }
}
#first_contents .anc ul a .anc_btn_gaba::after {
  border-top: 7px solid rgb(29, 125, 36);
}
#first_contents .anc ul a .anc_btn_gaba:hover {
  color: #fff;
  background: rgb(29, 125, 36);
}
#first_contents .anc ul a .anc_btn_gaba:hover::after {
  border-top: 7px solid #fff;
}
#first_contents .anc ul a .anc_btn_limited {
  color: rgb(254, 86, 68);
  border: rgb(254, 86, 68) 3px solid;
  position: relative;
}
#first_contents .anc ul a .anc_btn_limited::before {
  content: url("../img/nav_limited_pkg.png");
  transform: scale(0.8);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: 5px;
  left: 18px;
}
@media screen and (max-width: 768px) {
  #first_contents .anc ul a .anc_btn_limited::before {
    top: -1px;
    left: 25px;
  }
}
#first_contents .anc ul a .anc_btn_limited::after {
  border-top: 7px solid rgb(254, 86, 68);
}
#first_contents .anc ul a .anc_btn_limited:hover {
  color: #fff;
  background: rgb(254, 86, 68);
}
#first_contents .anc ul a .anc_btn_limited:hover::after {
  border-top: 7px solid #fff;
}

#gaba_contents {
  position: relative;
  padding: 100px 0 120px;
}
@media screen and (max-width: 768px) {
  #gaba_contents {
    padding: 50px 0 60px;
  }
}
#gaba_contents .inner_area {
  position: relative;
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
}
@media screen and (max-width: 1000px) {
  #gaba_contents .inner_area {
    width: 100%;
    padding: 0 5%;
  }
}
#gaba_contents .top {
  margin: 80px auto 60px;
  position: relative;
}
@media screen and (max-width: 768px) {
  #gaba_contents .top {
    margin: 0 auto;
  }
}
#gaba_contents .top::before {
  content: url("../img/gaba_top_bg_01-sm.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: -80px;
  left: -90px;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  #gaba_contents .top::before {
    transform: scale(0.5);
    top: -60px;
    left: 60px;
  }
}
#gaba_contents .top::after {
  content: url("../img/gaba_top_bg_03-sm.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  bottom: -20px;
  right: -50px;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  #gaba_contents .top::after {
    display: none;
  }
}
#gaba_contents .top .inner {
  display: flex;
  width: 100%;
  max-width: 950px;
  margin: 0 auto;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  z-index: 10;
}
@media screen and (max-width: 768px) {
  #gaba_contents .top .inner {
    display: block;
  }
}
#gaba_contents .top .inner .txt_contents .ttl {
  color: rgb(58, 190, 22);
  font-weight: bold;
  margin-bottom: 55px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .top .inner .txt_contents .ttl {
    margin-bottom: 25px;
  }
}
#gaba_contents .top .inner .txt_contents .ttl p {
  font-size: 23px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .top .inner .txt_contents .ttl p {
    font-size: 18px;
  }
}
#gaba_contents .top .inner .txt_contents .ttl h2 {
  font-size: 55px;
  line-height: 70px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .top .inner .txt_contents .ttl h2 {
    font-size: 30px;
    line-height: 1.5;
  }
}
#gaba_contents .top .inner .txt_contents .ttl h2 span {
  color: #1d7d24;
}
@media screen and (max-width: 768px) {
  #gaba_contents .top .inner .txt_contents .txt .type_ribbon {
    width: 70%;
  }
}
#gaba_contents .top .inner .txt_contents .txt p {
  margin-top: 25px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .top .inner .txt_contents .txt p {
    margin-top: 15px;
    font-size: 14px;
  }
}
#gaba_contents .top .inner .txt_contents .txt b {
  font-size: 22px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .top .inner .txt_contents .txt b {
    font-size: 20px;
  }
}
#gaba_contents .top .inner .txt_contents .txt span {
  color: rgb(58, 190, 22);
  font-size: 25px;
  font-weight: bold;
  background: linear-gradient(transparent 60%, #ffff74 60%);
}
@media screen and (max-width: 768px) {
  #gaba_contents .top .inner .txt_contents .txt span {
    font-size: 22px;
  }
}
#gaba_contents .top .inner .txt_contents .txt .note {
  font-size: 13px;
  line-height: 1.5;
}
#gaba_contents .top .inner .txt_contents .txt .s_txt {
  font-size: 20px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .top .inner .txt_contents .txt .s_txt {
    font-size: 16px;
    margin-top: 0;
  }
}
#gaba_contents .top .inner .img_contents {
  margin-right: 70px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .top .inner .img_contents {
    text-align: right;
    position: absolute;
    top: 72px;
    right: 0;
    margin-right: 0;
    width: 27%;
  }
}
#gaba_contents .pkg_top {
  display: flex;
  justify-content: space-around;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 768px) {
  #gaba_contents .pkg_top {
    display: block;
  }
}
#gaba_contents .pkg_top .pkg_gaba_title {
  display: flex;
  gap: 30px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .pkg_top .pkg_gaba_title {
    gap: 10px;
  }
}
#gaba_contents .pkg_top .pkg_gaba_title .ribbon_pkg {
  width: 400px;
  -o-object-fit: contain;
     object-fit: contain;
}
@media screen and (max-width: 768px) {
  #gaba_contents .pkg_top .pkg_gaba_title .ribbon_pkg {
    width: 80%;
  }
}
#gaba_contents .pkg_top .pkg_gaba_title .gaba_label {
  height: 120px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .pkg_top .pkg_gaba_title .gaba_label {
    height: auto;
    width: 20%;
    margin: 0 0 0 auto;
  }
}
#gaba_contents .pkg_top .pkg_gaba_con {
  display: flex;
  gap: 80px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .pkg_top .pkg_gaba_con {
    justify-content: center;
    gap: 30px;
  }
}
#gaba_contents .pkg_top .pkg_gaba_con .pkg_gaba {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 768px) {
  #gaba_contents .pkg_top .pkg_gaba_con .pkg_gaba {
    margin-bottom: 50px;
  }
}
#gaba_contents .pkg_top .pkg_gaba_con .pkg_gaba {
  /*.ribbon_pkg{
    @include break {
      width: 90%;
    }
  }*/
}
#gaba_contents .pkg_top .pkg_gaba_con .pkg_gaba .pkg_name {
  line-height: 1.4;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  padding: 20px 0 25px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .pkg_top .pkg_gaba_con .pkg_gaba .pkg_name {
    font-size: 23px;
  }
}
#gaba_contents .pkg_top .pkg_gaba_con .pkg_gaba .pkg_img01 {
  position: relative;
}
@media screen and (max-width: 768px) {
  #gaba_contents .pkg_top .pkg_gaba_con .pkg_gaba .pkg_img01 {
    width: 80%;
  }
}
#gaba_contents .pkg_top .pkg_gaba_con .pkg_gaba {
  /*.pkg_img02{
    right: -28px;
  }*/
  /*a {
    display: inline-block;
    text-decoration: none;
    @include break {
        display: block;
        margin-bottom: 10px;
    }
    .anc_btn_pkg_gaba{
      color: rgb(255, 80, 146);
      border: rgb(255, 80, 146) 3px solid;
      position: relative;
        &::after {
          content: "";
          position: absolute;
          top: 45%;
          right: 25px;
          border: 6px solid transparent;
          border-top: 7px solid rgb(255, 80, 146);
        }
        &:hover {
          color: #fff;
          background:  rgb(255, 80, 146);
          &::after {
            border-top: 7px solid #fff;
          }
        }
    }
    .anc_btn_pkg_allilose{
      color:  rgb(0, 145, 219);
      border:  rgb(0, 145, 219) 3px solid;
      position: relative;
        &::after {
          content: "";
          position: absolute;
          top: 45%;
          right: 25px;
          border: 6px solid transparent;
          border-top: 7px solid rgb(0, 145, 219);
      }
      &:hover {
        color: #fff;
        background:  rgb(0, 145, 219);
        &::after {
          border-top: 7px solid #fff;
        }
      }
    }
    .anc_btn_pkg_gaba,.anc_btn_pkg_allilose{
        //共通部分
      width: 290px;
      margin: 0 auto;
      height: 65px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 33px;
      background: #fff;
      font-weight: bold;
      font-size: 18px;
      padding-left: 13px;
      -moz-transition: all 0.3s;
      -webkit-transition: all 0.3s;
      -o-transition: all 0.3s;
      -ms-transition: all 0.3s;
      transition: all 0.3s;
      position: relative;
        @include break {
            //width: 100%;
            height: 55px;
            font-size: 16px;
            padding: 0;
        }
  }
  }*/
}
#gaba_contents .gaba, #gaba_contents .allilose {
  margin: 80px;
  display: flex;
  background-color: #ccf1cf;
  flex-direction: column;
  align-items: center;
  border-radius: 20px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .gaba, #gaba_contents .allilose {
    margin: auto;
  }
}
#gaba_contents .gaba p, #gaba_contents .allilose p {
  color: #3abe16;
  position: relative;
  padding: 3rem 1.5rem 1rem;
  font-size: 1.5rem;
  font-weight: bold;
  text-align: center;
  line-height: 35px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .gaba p, #gaba_contents .allilose p {
    font-size: 18px;
    padding: 1rem 1.5rem 1rem;
  }
}
#gaba_contents .gaba p ::before, #gaba_contents .gaba p ::after, #gaba_contents .allilose p ::before, #gaba_contents .allilose p ::after {
  position: absolute;
  top: 0.8rem;
  height: 1.8rem;
  content: "";
}
#gaba_contents .gaba p ::before, #gaba_contents .allilose p ::before {
  border-left: solid 3px;
  left: 0;
  top: 55px;
  transform: rotate(-30deg);
}
@media screen and (max-width: 768px) {
  #gaba_contents .gaba p ::before, #gaba_contents .allilose p ::before {
    top: 20px;
  }
}
#gaba_contents .gaba p ::after, #gaba_contents .allilose p ::after {
  border-right: solid 3px;
  right: 0;
  top: 55px;
  transform: rotate(30deg);
}
@media screen and (max-width: 768px) {
  #gaba_contents .gaba p ::after, #gaba_contents .allilose p ::after {
    top: 20px;
  }
}
#gaba_contents .gaba p span, #gaba_contents .allilose p span {
  font-size: 30px;
}
#gaba_contents .gaba h2, #gaba_contents .allilose h2 {
  text-align: center;
  line-height: 30px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .gaba h2, #gaba_contents .allilose h2 {
    font-size: 20px;
    line-height: 27px;
  }
}
#gaba_contents .gaba .recommend, #gaba_contents .allilose .recommend {
  max-width: 700px;
  margin: 0 auto 50px;
  text-align: center;
  position: relative;
  top: 15px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .gaba .recommend, #gaba_contents .allilose .recommend {
    width: 90%;
    margin: auto;
    top: 10px;
  }
}
#gaba_contents .gaba .stress, #gaba_contents .allilose .stress {
  position: relative;
  max-width: 950px;
  margin: 0 auto 80px;
  padding: 40px 0;
  border-radius: 50px;
  background: #fff;
}
#gaba_contents .gaba .stress .pc, #gaba_contents .allilose .stress .pc {
  width: 660px;
  padding: 0 50px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .gaba .stress, #gaba_contents .allilose .stress {
    margin: 25px 10px;
    padding: 20px;
    border-radius: 20px;
  }
}
#gaba_contents .gaba .stress img, #gaba_contents .allilose .stress img {
  margin: 0 auto;
}
#gaba_contents {
  /* .allilose{
     background-color: #d8ebff;

     p{
       color: #0091db;

       ::before {
         @include break {
           left: 40px;
         }
       }
       ::after {
         @include break {
           right: 40px;
         }
       }
     }
     @include break {
       margin-top: 30px;
     }

   }*/
}
#gaba_contents .lineup {
  position: relative;
  z-index: 99;
}
@media screen and (max-width: 768px) {
  #gaba_contents .lineup {
    margin-top: 30px;
  }
}
#gaba_contents .lineup::before {
  content: url("../img/lineup_g_bg_l-sm.png");
  transform: scale(1);
  display: inline-block;
  position: absolute;
  bottom: 0;
  left: -80px;
  z-index: -10;
}
@media screen and (max-width: 768px) {
  #gaba_contents .lineup::before {
    display: none;
  }
}
#gaba_contents .lineup::after {
  content: url("../img/lineup_g_bg_r-sm.png");
  transform: scale(1);
  display: inline-block;
  position: absolute;
  bottom: 0;
  right: -80px;
  z-index: -10;
}
@media screen and (max-width: 768px) {
  #gaba_contents .lineup::after {
    display: none;
  }
}
#gaba_contents .lineup .prod_list {
  display: flex;
  width: auto;
  margin: 0 auto;
  max-width: 1000px;
  justify-content: center;
  flex-wrap: wrap;
}
#gaba_contents .lineup .prod_list li {
  width: 30%;
  margin: 0 1%;
  text-align: center;
  border-radius: 20px;
  background-color: white;
  box-shadow: 1px 2px 9px 0px rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 768px) {
  #gaba_contents .lineup .prod_list li {
    width: 48%;
  }
  #gaba_contents .lineup .prod_list li:nth-child(3) {
    margin-top: 10px;
  }
}
#gaba_contents .lineup .prod_list li a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: #000000;
  padding: 10px 5px 90px;
  position: relative;
}
#gaba_contents .lineup .prod_list li a .img {
  margin-bottom: 5px;
}
#gaba_contents .lineup .prod_list li a .name {
  line-height: 1.4;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #gaba_contents .lineup .prod_list li a .name {
    font-size: 16px;
    line-height: 0.8;
  }
}
#gaba_contents .lineup .prod_list li a .name span {
  font-size: 15px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .lineup .prod_list li a .name span {
    display: block;
    font-size: 12px;
    line-height: 1.4;
  }
}
#gaba_contents .lineup .prod_list li a .dtl_btn {
  color: rgb(58, 190, 22);
  border: rgb(58, 190, 22) 2px solid;
  width: 100%;
  position: absolute;
  bottom: 30px;
  left: calc(50% - 100px);
  max-width: 200px;
  margin: 0 auto;
  height: 44px;
  display: table;
  border-radius: 22px;
  transition: all 0.3s;
}
@media screen and (max-width: 768px) {
  #gaba_contents .lineup .prod_list li a .dtl_btn {
    width: 85%;
    height: 40px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  }
}
#gaba_contents .lineup .prod_list li a .dtl_btn span {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  font-size: 16px;
  line-height: 1.4;
  text-decoration: none;
  position: relative;
}
@media screen and (max-width: 768px) {
  #gaba_contents .lineup .prod_list li a .dtl_btn span {
    font-size: 14px;
  }
}
#gaba_contents .lineup .prod_list li a .dtl_btn span::after {
  color: rgb(58, 190, 22);
  position: absolute;
  top: calc(50% - 7px);
  right: 18px;
  display: inline-block;
  content: "▲";
  transform: rotate(90deg);
  font-size: 12px;
}
@media screen and (max-width: 768px) {
  #gaba_contents .lineup .prod_list li a .dtl_btn span::after {
    top: 9px;
    right: 14px;
  }
}
#gaba_contents .lineup .prod_list li a .dtl_btn:hover {
  color: #fff;
  background: rgb(58, 190, 22);
}
#gaba_contents .lineup .prod_list li a .dtl_btn:hover span::after {
  color: #fff;
}
#gaba_contents .lineup .prod_list li a .sub {
  margin-top: 10px;
}
#gaba_contents .lineup .prod_list li a .sub span {
  font-size: 12px;
  line-height: 1.5;
}
#gaba_contents .lineup {
  /* p {
       font-size: 13px;
       margin-top: 25px;
       text-align: center;
       @include break {
           font-size: 12px;
           margin-top: 10px;
       }

   }*/
}

/*-----------------//#gaba_contents---------------------*/
/*----------------- #aloe_contents ---------------------*/
#aloe_contents {
  position: relative;
  background: #fffbe6;
  padding: 100px 0 120px;
}
@media screen and (max-width: 768px) {
  #aloe_contents {
    padding: 50px 0 60px;
  }
}
#aloe_contents .inner_area {
  position: relative;
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
}
@media screen and (max-width: 1000px) {
  #aloe_contents .inner_area {
    width: 100%;
    padding: 0 5%;
  }
}
#aloe_contents .top {
  margin: 80px auto 120px;
  position: relative;
}
@media screen and (max-width: 768px) {
  #aloe_contents .top {
    margin: 0 auto;
  }
}
#aloe_contents .top::before {
  content: url("../img/aloe_top_bg_01.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: -80px;
  left: -90px;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  #aloe_contents .top::before {
    transform: scale(0.5);
    top: -60px;
    left: 60px;
  }
}
#aloe_contents .top::after {
  content: url("../img/aloe_top_bg_02.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  bottom: 0;
  right: -30px;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  #aloe_contents .top::after {
    display: none;
  }
}
#aloe_contents .top .inner {
  display: flex;
  width: 100%;
  max-width: 950px;
  margin: 0 auto;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  z-index: 10;
}
@media screen and (max-width: 768px) {
  #aloe_contents .top .inner {
    display: block;
  }
}
#aloe_contents .top .inner .txt_contents .ttl {
  color: rgb(18, 189, 38);
  font-weight: bold;
  margin-bottom: 55px;
}
@media screen and (max-width: 768px) {
  #aloe_contents .top .inner .txt_contents .ttl {
    margin-bottom: 25px;
  }
}
#aloe_contents .top .inner .txt_contents .ttl p {
  font-size: 23px;
}
@media screen and (max-width: 768px) {
  #aloe_contents .top .inner .txt_contents .ttl p {
    font-size: 18px;
  }
}
#aloe_contents .top .inner .txt_contents .ttl h2 {
  font-size: 55px;
  line-height: 70px;
}
@media screen and (max-width: 768px) {
  #aloe_contents .top .inner .txt_contents .ttl h2 {
    font-size: 30px;
    line-height: 1.5;
  }
}
@media screen and (max-width: 768px) {
  #aloe_contents .top .inner .txt_contents .txt .type_ribbon {
    width: 70%;
  }
}
#aloe_contents .top .inner .txt_contents .txt p {
  margin-top: 25px;
}
@media screen and (max-width: 768px) {
  #aloe_contents .top .inner .txt_contents .txt p {
    margin-top: 15px;
    font-size: 14px;
  }
}
@media screen and (max-width: 768px) {
  #aloe_contents .top .inner .img_contents {
    text-align: right;
    position: absolute;
    top: 98px;
    right: 0;
    margin-top: 10px;
  }
}
@media screen and (max-width: 768px) {
  #aloe_contents .top .inner .img_contents img {
    width: 35%;
  }
}
#aloe_contents .lineup {
  position: relative;
}
@media screen and (max-width: 768px) {
  #aloe_contents .lineup {
    margin-top: 30px;
  }
}
#aloe_contents .lineup::before {
  content: url("../img/lineup_a_bg_l.png");
  transform: scale(1);
  display: inline-block;
  position: absolute;
  bottom: 0;
  left: -80px;
}
@media screen and (max-width: 768px) {
  #aloe_contents .lineup::before {
    display: none;
  }
}
#aloe_contents .lineup::after {
  content: url("../img/lineup_a_bg_r.png");
  transform: scale(1);
  display: inline-block;
  position: absolute;
  bottom: 0;
  right: -80px;
}
@media screen and (max-width: 768px) {
  #aloe_contents .lineup::after {
    display: none;
  }
}
#aloe_contents .lineup .prod_list {
  display: flex;
  width: auto;
  margin: 0 auto;
  max-width: 1000px;
  justify-content: center;
}
#aloe_contents .lineup .prod_list li {
  width: 30%;
  margin: 0 1%;
  text-align: center;
  border-radius: 20px;
  background-color: white;
  box-shadow: 1px 2px 9px 0px rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 768px) {
  #aloe_contents .lineup .prod_list li {
    width: 50%;
  }
}
#aloe_contents .lineup .prod_list li a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: #000000;
  padding: 10px 5px 90px;
  position: relative;
}
#aloe_contents .lineup .prod_list li a .img {
  margin-bottom: 5px;
}
#aloe_contents .lineup .prod_list li a .name {
  line-height: 1.4;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #aloe_contents .lineup .prod_list li a .name {
    font-size: 16px;
    line-height: 0.8;
  }
}
#aloe_contents .lineup .prod_list li a .name span {
  font-size: 15px;
}
@media screen and (max-width: 768px) {
  #aloe_contents .lineup .prod_list li a .name span {
    display: block;
    font-size: 12px;
    line-height: 1.4;
  }
}
#aloe_contents .lineup .prod_list li a .dtl_btn {
  color: rgb(18, 189, 38);
  border: rgb(18, 189, 38) 2px solid;
  width: 100%;
  position: absolute;
  bottom: 30px;
  left: calc(50% - 100px);
  max-width: 200px;
  margin: 0 auto;
  height: 44px;
  display: table;
  border-radius: 22px;
  transition: all 0.3s;
}
@media screen and (max-width: 768px) {
  #aloe_contents .lineup .prod_list li a .dtl_btn {
    width: 85%;
    height: 40px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  }
}
#aloe_contents .lineup .prod_list li a .dtl_btn span {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  font-size: 16px;
  line-height: 1.4;
  text-decoration: none;
  position: relative;
}
@media screen and (max-width: 768px) {
  #aloe_contents .lineup .prod_list li a .dtl_btn span {
    font-size: 14px;
  }
}
#aloe_contents .lineup .prod_list li a .dtl_btn span::after {
  color: rgb(18, 189, 38);
  position: absolute;
  top: calc(50% - 7px);
  right: 18px;
  display: inline-block;
  content: "▲";
  transform: rotate(90deg);
  font-size: 12px;
}
@media screen and (max-width: 768px) {
  #aloe_contents .lineup .prod_list li a .dtl_btn span::after {
    top: 9px;
    right: 14px;
  }
}
#aloe_contents .lineup .prod_list li a .dtl_btn:hover {
  color: #fff;
  background: rgb(18, 189, 38);
}
#aloe_contents .lineup .prod_list li a .dtl_btn:hover span::after {
  color: #fff;
}

/*-----------------//#aloe_contents---------------------*/
/*----------------- #limited_contents ---------------------*/
#limited_contents {
  position: relative;
  background: #ffe3d7;
  padding: 100px 0 120px;
}
@media screen and (max-width: 768px) {
  #limited_contents {
    padding: 50px 0 60px;
  }
}
#limited_contents .inner_area {
  position: relative;
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
}
@media screen and (max-width: 1000px) {
  #limited_contents .inner_area {
    width: 100%;
    padding: 0 5%;
  }
}
#limited_contents .top {
  margin: 80px auto 120px;
  position: relative;
}
@media screen and (max-width: 768px) {
  #limited_contents .top {
    margin: 0 auto;
  }
}
#limited_contents .top::before {
  content: url("../img/limited_top_bg_01.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: -80px;
  left: -90px;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  #limited_contents .top::before {
    transform: scale(0.5);
    top: -60px;
    left: 60px;
  }
}
#limited_contents .top::after {
  content: url("../img/limited_top_bg_02.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  bottom: 0;
  right: -30px;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  #limited_contents .top::after {
    display: none;
  }
}
#limited_contents .top .inner {
  display: flex;
  width: 100%;
  max-width: 950px;
  margin: 0 auto;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  z-index: 10;
}
@media screen and (max-width: 768px) {
  #limited_contents .top .inner {
    display: block;
  }
}
#limited_contents .top .inner .txt_contents .ttl {
  color: rgb(254, 86, 68);
  font-weight: bold;
  margin-bottom: 55px;
}
@media screen and (max-width: 768px) {
  #limited_contents .top .inner .txt_contents .ttl {
    margin-bottom: 25px;
  }
}
#limited_contents .top .inner .txt_contents .ttl p {
  font-size: 23px;
}
@media screen and (max-width: 768px) {
  #limited_contents .top .inner .txt_contents .ttl p {
    font-size: 18px;
  }
}
#limited_contents .top .inner .txt_contents .ttl h2 {
  font-size: 55px;
  line-height: 70px;
}
@media screen and (max-width: 768px) {
  #limited_contents .top .inner .txt_contents .ttl h2 {
    font-size: 30px;
    line-height: 1.5;
  }
}
@media screen and (max-width: 768px) {
  #limited_contents .top .inner .txt_contents .txt .type_ribbon {
    width: 70%;
  }
}
#limited_contents .top .inner .txt_contents .txt p {
  margin-top: 25px;
}
@media screen and (max-width: 768px) {
  #limited_contents .top .inner .txt_contents .txt p {
    margin-top: 15px;
    font-size: 14px;
  }
}
@media screen and (max-width: 768px) {
  #limited_contents .top .inner .img_contents {
    text-align: right;
    position: absolute;
    top: 50px;
    right: 0;
    margin-top: 10px;
  }
}
@media screen and (max-width: 768px) {
  #limited_contents .top .inner .img_contents img {
    width: 35%;
  }
}
#limited_contents .lineup {
  position: relative;
}
@media screen and (max-width: 768px) {
  #limited_contents .lineup {
    margin-top: 30px;
  }
}
#limited_contents .lineup::before {
  content: url("../img/lineup_l_bg_l.png");
  transform: scale(1);
  display: inline-block;
  position: absolute;
  bottom: 0;
  left: -80px;
}
@media screen and (max-width: 768px) {
  #limited_contents .lineup::before {
    display: none;
  }
}
#limited_contents .lineup::after {
  content: url("../img/lineup_l_bg_r.png");
  transform: scale(1);
  display: inline-block;
  position: absolute;
  bottom: 0;
  right: -80px;
}
@media screen and (max-width: 768px) {
  #limited_contents .lineup::after {
    display: none;
  }
}
#limited_contents .lineup .prod_list {
  display: flex;
  width: auto;
  margin: 0 auto;
  max-width: 1000px;
  justify-content: center;
}
#limited_contents .lineup .prod_list li {
  width: 30%;
  margin: 0 1%;
  text-align: center;
  border-radius: 20px;
  background-color: white;
  box-shadow: 1px 2px 9px 0px rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 768px) {
  #limited_contents .lineup .prod_list li {
    width: 50%;
  }
}
#limited_contents .lineup .prod_list li a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: #000000;
  padding: 10px 5px 90px;
  position: relative;
}
#limited_contents .lineup .prod_list li a .img {
  margin-bottom: 5px;
}
#limited_contents .lineup .prod_list li a .name {
  line-height: 1.4;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #limited_contents .lineup .prod_list li a .name {
    font-size: 16px;
    line-height: 0.8;
  }
}
#limited_contents .lineup .prod_list li a .name span {
  font-size: 15px;
}
@media screen and (max-width: 768px) {
  #limited_contents .lineup .prod_list li a .name span {
    display: block;
    font-size: 12px;
    line-height: 1.4;
  }
}
#limited_contents .lineup .prod_list li a .dtl_btn {
  color: rgb(254, 86, 68);
  border: rgb(254, 86, 68) 2px solid;
  width: 100%;
  position: absolute;
  bottom: 30px;
  left: calc(50% - 100px);
  max-width: 200px;
  margin: 0 auto;
  height: 44px;
  display: table;
  border-radius: 22px;
  transition: all 0.3s;
}
@media screen and (max-width: 768px) {
  #limited_contents .lineup .prod_list li a .dtl_btn {
    width: 85%;
    height: 40px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  }
}
#limited_contents .lineup .prod_list li a .dtl_btn span {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  font-size: 16px;
  line-height: 1.4;
  text-decoration: none;
  position: relative;
}
@media screen and (max-width: 768px) {
  #limited_contents .lineup .prod_list li a .dtl_btn span {
    font-size: 14px;
  }
}
#limited_contents .lineup .prod_list li a .dtl_btn span::after {
  color: rgb(254, 86, 68);
  position: absolute;
  top: calc(50% - 7px);
  right: 18px;
  display: inline-block;
  content: "▲";
  transform: rotate(90deg);
  font-size: 12px;
}
@media screen and (max-width: 768px) {
  #limited_contents .lineup .prod_list li a .dtl_btn span::after {
    top: 9px;
    right: 14px;
  }
}
#limited_contents .lineup .prod_list li a .dtl_btn:hover {
  color: #fff;
  background: rgb(254, 86, 68);
}
#limited_contents .lineup .prod_list li a .dtl_btn:hover span::after {
  color: #fff;
}

/*-----------------//#limited_contents---------------------*/
/*----------------- case ---------------------*/
.case {
  background: repeating-linear-gradient(90deg, #fde0e5 0, #fde0e5 17px, #fdd7dd 17px, #fdd7dd 34px);
  width: 100%;
  padding: 80px 0 150px;
}
@media screen and (max-width: 768px) {
  .case {
    padding: 50px 5% 70px;
  }
}
.case .inner_area {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
}
.case .inner_area::before {
  content: url("../img/case_pkg_bg_l.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: 440px;
  left: -80px;
}
@media screen and (max-width: 1000px) {
  .case .inner_area::before {
    display: none;
  }
}
.case .inner_area::after {
  content: url("../img/case_pkg_bg_r.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: 15%;
  right: -80px;
}
@media screen and (max-width: 1000px) {
  .case .inner_area::after {
    display: none;
  }
}
.case .inner_area h2 {
  color: rgb(255, 80, 146);
  font-size: 60px;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 768px) {
  .case .inner_area h2 {
    font-size: 25px;
  }
}
.case .inner_area h2 span {
  font-size: 40px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .case .inner_area h2 span {
    font-size: 20px;
  }
}
.case .inner_area h2 span::before {
  content: url("../img/slash_l.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: -1px;
  left: -30px;
}
.case .inner_area h2 span::after {
  content: url("../img/slash_r.png");
  transform: scale(1);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: -1px;
  right: -30px;
}
.case .inner_area .img_box {
  text-align: center;
  margin: 80px 0 0;
}
@media screen and (max-width: 768px) {
  .case .inner_area .img_box {
    margin: 40px 0 0;
  }
}
@media screen and (max-width: 768px) {
  .case .inner_area .img_box img {
    width: 100%;
    margin-bottom: 30px;
  }
  .case .inner_area .img_box img:last-child {
    margin-bottom: 0;
  }
}

/*-----------------//case---------------------*/
.puru img {
  animation: purupuru2 0.5s linear 2;
}

@keyframes purupuru2 {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-10deg);
  }
  100% {
    transform: rotate(0deg);
  }
}

.under_contents {
  background: #e6fdea;
  padding: 100px 0;
}
@media screen and (max-width: 768px) {
  .under_contents {
    padding: 50px 0;
  }
}

#insta {
  position: relative;
  padding: 0 2%;
}
@media screen and (max-width: 768px) {
  #insta {
    padding: 0 5%;
  }
}
#insta .inner_area {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}
#insta .inner_area .widget {
  position: relative;
  max-width: 765px;
  width: 100%;
  margin: 0 auto;
}
#insta .inner_area .widget iframe {
  max-width: 765px;
  width: 100%;
  height: 765px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  #insta .inner_area .widget iframe {
    height: 100%;
    min-height: 450px;
  }
}
@media screen and (max-width: 450px) {
  #insta .inner_area .widget iframe {
    height: 100%;
    min-height: 320px;
  }
}

#recipe {
  position: relative;
  margin-top: 90px;
}
@media screen and (max-width: 768px) {
  #recipe {
    padding: 0 2%;
    margin-top: 40px;
  }
}
#recipe .inner_area {
  max-width: 1200px;
  margin: 0 auto 120px;
  padding: 0 90px;
}
@media screen and (max-width: 768px) {
  #recipe .inner_area {
    width: 90%;
    margin: 0 auto;
    padding: 0;
  }
}
#recipe .inner_area .copy_txt {
  text-align: center;
  margin-bottom: 30px;
  font-size: 16px;
}
@media screen and (max-width: 768px) {
  #recipe .inner_area .copy_txt {
    text-align: left;
    font-size: 14px;
  }
}
#recipe .inner_area .copy_txt em {
  color: #f5167a;
  font-weight: bold;
}
#recipe .inner_area .btn_box {
  width: 100%;
  max-width: 650px;
  margin: 0 auto 30px;
  display: flex;
  justify-content: -webkit- space-between;
  justify-content: space-between;
}
@media screen and (max-width: 768px) {
  #recipe .inner_area .btn_box {
    display: block;
  }
}
#recipe .inner_area .btn_box > li {
  width: 49%;
  max-width: 300px;
}
@media screen and (max-width: 768px) {
  #recipe .inner_area .btn_box > li {
    width: 100%;
    margin-bottom: 20px;
  }
}
#recipe .inner_area .btn_box > li .snsbtn {
  display: table;
  width: 100%;
  max-width: 300px;
  height: 60px;
  border-radius: 30px;
  background-color: #ffffff;
  transition: all 0.3s;
}
@media screen and (max-width: 768px) {
  #recipe .inner_area .btn_box > li .snsbtn {
    height: 50px;
    border-radius: 25px;
    width: 80%;
    margin: 0 auto;
  }
}
#recipe .inner_area .btn_box > li .snsbtn:hover {
  transform: translateY(7px);
}
#recipe .inner_area .btn_box > li .snsbtn a {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 0.05em;
  position: relative;
}
#recipe .inner_area .btn_box > li .snsbtn a:before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  margin: 5px 20px -5px 0;
}
#recipe .inner_area .btn_box > li .snsbtn.insta {
  border: #ec518f 3px solid;
  box-shadow: 0px 7px 0 0 #ec518f;
}
#recipe .inner_area .btn_box > li .snsbtn.insta a {
  color: #ec518f;
}
#recipe .inner_area .btn_box > li .snsbtn.insta a:before {
  background: url("/common_n/img/icn_insta.png") no-repeat center center/100% auto;
}
#recipe .inner_area .btn_box > li .snsbtn.insta:hover {
  box-shadow: 0px 0px 0 0 #ec518f;
}
#recipe .inner_area .btn_box > li .snsbtn.youtube {
  border: #fc3939 3px solid;
  box-shadow: 0px 7px 0 0 #fc3939;
}
#recipe .inner_area .btn_box > li .snsbtn.youtube a {
  color: #fc3939;
}
#recipe .inner_area .btn_box > li .snsbtn.youtube a:before {
  background: url("/common_n/img/icn_youtube.png") no-repeat center center/100% auto;
}
#recipe .inner_area .btn_box > li .snsbtn.youtube:hover {
  box-shadow: 0px 0px 0 0 #fc3939;
}
#recipe .inner_area .deco_ttl {
  margin-bottom: 20px;
}
#recipe .inner_area .deco_ttl:before {
  content: "";
  display: block;
  width: 60px;
  height: 50px;
  background: url("../img/ttl_recipe_img.png") no-repeat center center/100% auto;
  margin: 0 auto 5px;
}
#recipe .inner_area .deco_ttl {
  position: relative;
  text-align: center;
  font-size: 30px;
  font-weight: bold;
  letter-spacing: 0.05em;
}
#recipe .inner_area .recipe_area {
  max-width: 580px;
  width: 100%;
  margin: 0 auto;
  border-radius: 20px;
  border: #f5167a 3px solid;
  background-color: #ffffff;
}
#recipe .inner_area .recipe_area h4 {
  border-radius: 17px 17px 0 0;
  background-color: #f5167a;
  text-align: center;
  color: #ffffff;
  font-size: 18px;
  font-weight: bold;
  padding: 5px 10px;
}
#recipe .inner_area .recipe_area .recipe_inner {
  padding: 20px 40px;
}
@media screen and (max-width: 768px) {
  #recipe .inner_area .recipe_area .recipe_inner {
    padding: 20px 6%;
  }
}
#recipe .inner_area .recipe_area .recipe_inner .recipe_list > li {
  margin-bottom: 5px;
}
#recipe .inner_area .recipe_area .recipe_inner .recipe_list > li a {
  display: inline-block;
  text-indent: -1em;
  padding-left: 1em;
  line-height: 1.5;
  color: #f5167a;
  text-decoration: none;
}
#recipe .inner_area .recipe_area .recipe_inner .recipe_list > li a:hover {
  text-decoration: underline;
}
@media screen and (max-width: 768px) {
  #recipe .inner_area .recipe_area .recipe_inner .recipe_list > li a {
    font-size: 14px;
  }
}

.fixBnr {
  position: absolute;
  top: 250px;
  right: 0;
  width: 70px;
  height: 340px;
  transition: all 0.3s;
  z-index: 999;
}
.fixBnr:hover {
  opacity: 0.7;
}
@media screen and (max-width: 540px) {
  .fixBnr {
    display: none;
    top: inherit;
    bottom: 10px;
    height: auto;
    width: 80%;
    right: 10%;
    text-align: center;
  }
  .fixBnr:hover {
    opacity: 1;
  }
}
.fixBnr.fxBnr {
  top: 0;
  display: block;
  position: fixed;
  z-index: 999;
  max-width: 70px;
}
@media screen and (max-width: 540px) {
  .fixBnr.fxBnr {
    bottom: 0px;
    top: inherit;
    max-width: 100%;
  }
}/*# sourceMappingURL=page.css.map */