@charset "UTF-8";
/* 共通 */
html, body {
  background: url(img/sp-bg.gif) no-repeat #f7bad5;
  background-size: contain;
  margin: 0;
  padding: 0;
  font-family: "小塚ゴシック Pr6N", sans-serif;
}

/* body */
*, *::before, *::after {
  box-sizing: border-box;
}

a {
  text-decoration: none;
}

/* org_start */
#org_start {
  background: url(img/OP2.svg) no-repeat;
  background-position: center center;
  background-size: cover;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9000;
}

/* mordal */
.modal {
  display: none;
  position: fixed;
  z-index: 9999;
  top: 0;
  width: 100%;
  height: 100vh;
}

.modal_bg {
  background: rgba(0, 0, 0, 0.8);
  position: absolute;
  z-index: 999;
  width: 100%;
  height: 100vh;
}

.modal_sp {
  position: relative;
  overflow: auto;
  height: 90%;
}

.modal_spimg, .modal_spximg, .modal_spp, .modal_pcimg, .modal_pcximg, .modal_pcp {
  position: absolute;
  z-index: 999;
  left: 0;
  right: 0;
}

.modal_spimg {
  top: 20px;
  margin: 0 auto;
  width: 88%;
}

.modal_spximg {
  top: calc(0px + 102vw);
  width: 10%;
  max-width: 35px;
  margin: 0 4% 0 90%;
}

.modal_spp {
  top: calc(30px + 102vw);
  width: 88%;
  margin: 0 auto;
  color: #fff;
  font-size: 12px;
  height: 100px;
}

.modal_pcimg, .modal_pcximg, .modal_pcp {
  display: none;
}

.modal_yellow {
  color: #fffa00;
}

.modal-weight {
  font-weight: 700;
}

.modal_spp a, .modal_pcp a {
  color: #fff;
  z-index: 1000;
}

.top-kochira {
  text-decoration: underline;
  color: #fffa00 !important;
}

/* sp-top */
#sp-top {
  padding-top: 164%;
  position: relative;
  overflow: hidden;
}

#sp-bg img {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
}

/* top */
#top {
  display: none;
}

#org_wrapper {
  display: none;
}

#org_wrapper:before {
  content: "";
  display: block;
  padding-top: 173%;
}

#org_content {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

/* top_banner */
.black_back {
  width: 98%;
  margin: 0 1%;
  padding-top: 20px;
  padding-bottom: 10px;
  background: #f0a8e3;
  border-radius: 12px;
}

.sp-top_banner-rose {
  position: relative;
}

.sp-top_banner-rose-left img {
  position: absolute;
  width: 35%;
  top: -4vw;
  left: -1.1vw;
}

.sp-top_banner-rose-right img {
  position: absolute;
  width: 35%;
  top: -6vw;
  right: -1.1vw;
}

.pc-top_banner-rose, .pc-top_banner-rose-left img, .pc-top_banner-rose-right img {
  display: none;
}

/* top_banner_area_contents */
#top_banner_area_contents {
  display: flex;
  margin: 10px auto 20px;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 20px;
}

.top_banner_area_contents_about {
  width: 100px;
  margin-right: 20px;
}

.top_banner_area_contents_contact {
  width: 141px;
  margin-right: 20px;
}

.top_banner_area_contents_twitter {
  width: 24px;
}

#top_banner_area_contents div img {
  width: 100%;
}

/* top_banner_img */
#top_banner_area_img {
  position: relative;
  overflow: hidden;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
}

#top_banner_area_img1 {
  width: 100%;
}

.banner1-pc {
  display: none;
}

.banner1-sp {
  width: 94%;
  max-width: 695px;
  margin-left: 3%;
}

.banner2 {
  width: 94%;
  margin-left: 3%;
}

.banner1-sp img, .banner1-pc img, .banner2 img, .banner3 img {
  width: 100%;
  border-radius: 6px;
}

.banner1-sp img {
  border-radius: 16px;
}

.twitter_banner {
  position: relative;
  height: 300px;
  width: 94%;
  margin-left: 3%;
  margin-bottom: 7px;
}

.twitter-timeline {
  border-radius: 6px;
  min-width: 0 !important;
}

.banner3 {
  width: 94%;
  margin-left: 3%;
}

#org_content0 {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  overflow: scroll;
}

/* item */
.item-head-wrap {
  width: 100vw;
  position: relative;
  overflow: hidden;
}

.item-head {
  width: 320px;
  height: 80px;
  margin: 0 auto;
}

.item-head img {
  position: absolute;
  width: 320px;
  padding-top: 57px;
  top: 0;
  left: 0;
}

.sp-star img {
  position: absolute;
  width: 100%;
  margin-top: -140px;
}

.star img {
  display: none;
}

.item_column {
  padding-top: 52px;
  padding-bottom: 0;
}

.item_column2 {
  padding-top: 52px;
  padding-bottom: 10px;
}

.item_column_row {
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
}

.item_column_row a {
  width: 45%;
  margin: 0 0 0 3.33%;
}

.item_column_row div img {
  width: 100%;
  border-radius: 9px;
  word-break: break-all;
  background-color: #fff;
}

.ranking1, .ranking2, .ranking3, .ranking4-9, .ranking10-12 {
  position: absolute;
  top: -5px;
  left: -5px;
  width: 24px !important;
  height: 24px;
  font-size: 14px;
  line-height: 24px;
  border-radius: 50%;
  margin: 0;
  padding: 0;
  text-align: center;
  color: #fff;
}

.item_name, .item_price {
  width: 95%;
  color: #4a4643;
  font-size: 12px;
  padding-left: 16px;
  margin: 0;
  font-weight: bold;
  line-height: 16px;
  letter-spacing: 0.13em;
  font-family: kozuka-gothic-pr6n, sans-serif;
  font-style: normal;
  word-break: break-all;
}

.item_price {
  margin-bottom: 22px;
  font-size: 11px;
  line-height: 26px;
  letter-spacing: 0.2em;
  font-family: kozuka-gothic-pr6n, sans-serif;
  font-style: normal;
}

.ranking1 {
  background: linear-gradient(#efdbcd, #DBB400);
}

.ranking2 {
  background: linear-gradient(#efdbcd, #9FA0A0);
}

.ranking3 {
  background: linear-gradient(#efdbcd, #97461a);
}

.ranking4-9, .ranking10-12 {
  background: #f7bad5;
}

.ranking10-12 {
  font-size: 14px;
  letter-spacing: -3px;
  padding-right: 3px;
}

/* button */
.btn {
  background: #d0aad6;
  color: #fff;
  height: 40px;
  width: 84%;
  margin: 30px 8% 52px;
  font-size: 12px;
  letter-spacing: 0.2em;
  font-family: "ヒラギノ丸ゴ ProN", sans-serif;
  text-align: center;
  border-radius: 6px;
  border: none;
  cursor: pointer;
  outline: 0;
}

.btn img {
  position: absolute;
  width: 12px;
  margin: 2.5px 0 0 6px;
}

/* otherbanner */
.otherbanner {
  width: 98%;
  margin: 6px 1%;
  padding-bottom: 10px;
}

#otherbanner_area_img {
  position: relative;
  overflow: hidden;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
}

.banner4 img {
  width: 100%;
  border-radius: 6px;
}

.banner4 {
  width: 94%;
  margin-left: 3%;
  margin-top: 3%;
}

.fadein1, .fadein3, .fadein7, .fadein10, .fadein11, .fadein13, .fadein14, .fadein16, .fadein17, .fadein18, .fadein20 {
  opacity: 0;
  visibility: hidden;
  transition: 1s;
  transform: translateY(100px);
}

.active1, .active3, .active7, .active10, .active11, .active13, .active14, .active16, .active17, .active18, .active20 {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.fadein6 {
  opacity: 0;
  visibility: hidden;
  transition: 1s;
  transform: translateY(-100px);
}

.active6 {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.fadein2, .fadein5 {
  opacity: 0;
  visibility: hidden;
  transition: 1s;
  transform: translateX(-100px);
}

.active2, .active5 {
  opacity: 1;
  visibility: visible;
  transform: translateX(0px);
}

.fadein9, .fadein12 {
  opacity: 0;
  visibility: hidden;
  transition: 1s;
  transform: translateX(-300px);
}

.active9, .active12 {
  opacity: 1;
  visibility: visible;
  transform: translateX(0px);
}

.fadein4, .fadein8 {
  opacity: 0;
  visibility: hidden;
  transition: 1s;
  transform: translateX(100px);
}

.active4, .active8 {
  opacity: 1;
  visibility: visible;
  transform: translateX(0px);
}

.fadein15, .fadein19 {
  opacity: 0;
  visibility: hidden;
  transition: 1s;
  transform: translateX(300px);
}

.active15, .active19 {
  opacity: 1;
  visibility: visible;
  transform: translateX(0px);
}

/********** 550px **********/
@media screen and (min-width: 550px) {
  /* 共通 */
  html, body {
    background: url(img/bg.svg) no-repeat #f7bad5;
    background-size: contain;
  }
  /* modal */
  .modal_pc {
    position: relative;
    overflow: auto;
    height: 90%;
  }
  .modal_sp, .modal_spimg, .modal_spximg, .modal_spp {
    display: none;
  }
  .modal_pcimg {
    display: block;
    top: 60px;
    margin: 0 auto;
    width: 94%;
    max-width: 980px;
  }
  .modal_pcximg {
    display: block;
    top: calc(31px + 46.041vw);
    max-width: 40px;
    margin-left: auto;
    margin-right: 1%;
  }
  .modal_pcp {
    display: block;
    top: calc(75px + 46.041vw);
    height: 200px;
    width: 90%;
    max-width: 980px;
    margin: 30px auto 0;
    color: #fff;
    font-size: 15px;
  }
  /* sp-top */
  #sp-top {
    display: none;
  }
  /* top */
  #top {
    display: block;
    margin: 0 auto;
    padding-top: 39%; /* 1357 / 3200 * 100 = 42.41% */
    position: relative;
    overflow: hidden;
  }
  #bg img {
    position: absolute;
    top: 0;
    width: 100%;
  }
  #org_wrapper {
    position: relative;
    width: 100%;
    display: block;
  }
  #org_wrapper:before {
    content: "";
    display: block;
    padding-top: 50%;
  }
  #org_content {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
  }
  /* top_banner */
  .black_back {
    width: 96%;
    margin: 0 2%;
    z-index: 10;
  }
  .sp-top_banner-rose, .sp-top_banner-rose-left img, .sp-top_banner-rose-right img {
    display: none;
  }
  .pc-top_banner-rose {
    display: block;
    position: relative;
  }
  .pc-top_banner-rose-left img {
    display: block;
    position: absolute;
    width: 15%;
    top: -1.5vw;
    left: -0.9vw;
  }
  .pc-top_banner-rose-right img {
    display: block;
    position: absolute;
    width: 15%;
    top: -1.5vw;
    right: -0.9vw;
  }
  /* top_banner_area_contents */
  #top_banner_area_contents {
    margin: 40px auto 50px;
  }
  .top_banner_area_contents_about {
    width: 150px;
    margin-right: 40px;
  }
  .top_banner_area_contents_contact {
    width: 212px;
    margin-right: 40px;
  }
  .top_banner_area_contents_twitter {
    width: 36px;
  }
  /* top_banner_img */
  /* #top_banner_area_img { display: flex; } */
  #top_banner_area_img0 {
    display: flex;
  }
  #top_banner_area_img1 {
    width: 64%;
  }
  .banner1-sp {
    display: none;
  }
  .banner1-pc, .banner2 {
    display: block;
    width: 95.3%;
    margin-left: 4.7%;
  }
  .twitter_banner {
    height: auto;
    width: 30%;
    margin-left: 3%;
  }
  #top_banner_area_img2 {
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    width: 96%;
  }
  .banner3 {
    width: 49%;
    margin: 0;
  }
  .banner3:nth-child(even) {
    margin-left: 1%;
  }
  /* item */
  .item-head {
    width: 417px;
  }
  .item-head img {
    width: 417px;
    padding-top: 50px;
  }
  .item_column, .item_column2 {
    padding-top: 88px;
  }
  .item_column_row {
    width: 500px;
    margin: 0 auto;
  }
  .item_column_row a {
    width: auto;
    margin: 0;
  }
  .item_column_row div {
    width: 220px;
    margin: 0 0 0 20px;
  }
  .sp-star {
    display: none;
  }
  .star img {
    display: block;
    position: absolute;
    width: 100%;
    margin-top: -142px;
  }
  /* button */
  .btn div {
    width: 225px;
    margin: 0 auto;
    padding-right: 16px;
  }
  .btn img {
    margin-right: 10px;
  }
  /* otherbanner */
  .otherbanner {
    width: 96%;
    margin: 6px 2%;
  }
  #otherbanner_area_img2 {
    display: flex;
    flex-wrap: wrap;
    margin: 10px auto;
    width: 96%;
    max-width: 1400px;
  }
  .banner4 {
    width: 49%;
    margin: 0;
  }
  .banner4:nth-child(even) {
    margin-left: 1%;
  }
}
/********** 750px **********/
@media screen and (min-width: 750px) {
  /* top_banner */
  /* .black_back { width: 700px; } */
  /* top_banner_img */
  /* #top_banner_area_img { display: flex; } */
  #top_banner_area_img1 {
    display: flex;
    width: 76%;
  }
  #top_banner_area_img2 {
    width: 97%;
    margin: 0;
    margin-left: 1.5%;
  }
  .banner1-pc {
    width: 65%;
    margin-left: 2%;
  }
  .banner2 {
    width: 31.6%;
    max-width: 334px;
    margin-left: 2%;
  }
  .twitter_banner {
    width: 21%;
    max-width: 334px;
    margin-left: 1.8%;
    margin-bottom: 7px;
  }
  .banner3 {
    width: 23.65%;
  }
  .banner3:nth-child(even), .banner3:nth-child(3) {
    margin-left: 1.8%;
  }
  /* item */
  .item_column_row {
    width: 700px;
  }
  .item_column_row div {
    margin: 0 0 0 10px;
  }
  /* otherbanner */
  #otherbanner_area_img2 {
    width: 97%;
    margin: 0 auto;
  }
  .banner4 {
    width: 23.65%;
    margin-top: 6px;
  }
  .banner4:nth-child(even), .banner4:nth-child(3), .banner4:nth-child(7), .banner4:nth-child(11) {
    margin-left: 1.8%;
  }
}
/********** 1000px **********/
@media screen and (min-width: 1000px) {
  /* top_banner */
  /* .black_back { width: 950px; } */
  /* top_banner_area_contents */
  .top_banner_area_contents_about {
    width: 200px;
    margin-right: 40px;
  }
  .top_banner_area_contents_contact {
    width: 282px;
    margin-right: 40px;
  }
  .top_banner_area_contents_twitter {
    width: 48px;
  }
  /* item */
  .item_column_row {
    width: 950px;
  }
  .item_column_row div {
    margin: 0 0 0 14px;
  }
  /* button */
  .btn_wrapper {
    width: 807px;
    margin: 0 auto;
  }
  .btn {
    width: 807px;
    margin: 30px auto 52px;
  }
}
/********** 1020.83px **********/
@media screen and (min-width: 1020.83px) {
  .modal_pcximg {
    top: 504px;
    left: 974px;
    margin: 0 auto;
  }
  .modal_pcp {
    top: 546px;
  }
}
/********** 1200px **********/
@media screen and (min-width: 1300px) {
  /* item */
  .item_column_row {
    width: 1184px;
  }
}
/********** 1600px **********/
@media screen and (min-width: 1600px) {
  #bg1-1onpu, #bg1-2onpu, #bg1-3onpu, #bg1-4light, #bg1-5light, #bg1-6, #bg2, #bg3, #bg4 {
    position: absolute;
    width: 1600px;
    margin: 0 auto;
    top: 0;
  }
  #bg1-1onpu img, #bg1-2onpu img, #bg1-3onpu img, #bg1-4light img, #bg1-5light img, #bg1-6 img, #bg2 img, #bg3 img, #bg4 img {
    position: relative;
  }
  #bg2 img {
    left: 350px;
  }
  #bg3 img {
    left: 915px;
  }
  #bg4 img {
    left: 94px;
  }
  #org_wrapper:before {
    padding-top: 750px;
  }
  /* top_banner */
  .black_back {
    margin: 0 auto;
    padding-bottom: 38px;
    z-index: 2;
  }
  .banner2 img:nth-child(1) {
    margin-bottom: 5px;
  }
  .banner3 img {
    width: 328px;
  }
  .pc-top_banner-rose-left img {
    width: 230px;
    top: -23px;
    left: -14px;
  }
  .pc-top_banner-rose-right img {
    width: 240px;
    top: -25px;
    right: -13px;
  }
  /* item */
  .star {
    width: 1600px;
    margin: 0 auto;
  }
  .star img {
    width: 1600px;
    margin-top: -240px;
  }
  .item_column_row {
    width: 1460px;
  }
  .item_column_row div {
    margin: 0 0 0 20px;
  }
  /* otherbanner */
  .otherbanner {
    padding-bottom: 38px;
  }
  #otherbanner_area_img2 {
    width: 97%;
  }
  .banner4 img {
    width: 328px;
  }
}
/*--コンテンツロード----------------------------------------------------------*/
#load_content {
  position: fixed;
  width: 100vw;
  height: 100vh;
  background-color: #fff;
  z-index: 2000;
  top: 0;
  left: 0;
}

#load_content .op_image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-size: cover;
  transition: 0.5s;
}

#load_content .op_image.active {
  opacity: 1;
}

#load_content .op_image div.op1 {
  background: url(img/OP2.gif) no-repeat;
  background-position: center center;
  background-size: cover;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9000;
  opacity: 0;
  transition: 1s;
  -moz-transition-delay: 1s;
  -webkit-transition-delay: 1s;
  -o-transition-delay: 1s;
  -ms-transition-delay: 1s;
}

.op1text {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 18.67px;
  margin: auto;
  width: 150px;
}

/********** 550px **********/
@media screen and (min-width: 550px) {
  .op1text {
    width: 250px;
    bottom: 31.11px;
  }
}
#load_content .op_image div.active {
  opacity: 1;
}

.loader {
  margin: calc(50vh - 50px) auto 0;
  font-size: 4px !important;
  width: 0.8em;
  height: 0.8em;
  border-radius: 50%;
  position: relative;
  text-indent: -9999em;
  animation: load5 1.1s infinite ease;
  transform: translateZ(0);
}

.nowloading {
  font-size: 16px !important;
  color: gray;
  width: 150px !important;
  margin: 20px auto 0 !important;
  text-align: center !important;
}
@keyframes load5 {
  0%, 100% {
    box-shadow: 0em -2.6em 0em 0em #fff, 1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2), 2.5em 0em 0 0em rgba(0, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(0, 0, 0, 0.2), 0em 2.5em 0 0em rgba(0, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(0, 0, 0, 0.2), -2.6em 0em 0 0em rgba(0, 0, 0, 0.5), -1.8em -1.8em 0 0em rgba(0, 0, 0, 0.7);
  }
  12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 0, 0, 0.7), 1.8em -1.8em 0 0em #fff, 2.5em 0em 0 0em rgba(0, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(0, 0, 0, 0.2), 0em 2.5em 0 0em rgba(0, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(0, 0, 0, 0.2), -2.6em 0em 0 0em rgba(0, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(0, 0, 0, 0.5);
  }
  25% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 0, 0, 0.5), 1.8em -1.8em 0 0em rgba(0, 0, 0, 0.7), 2.5em 0em 0 0em #fff, 1.75em 1.75em 0 0em rgba(0, 0, 0, 0.2), 0em 2.5em 0 0em rgba(0, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(0, 0, 0, 0.2), -2.6em 0em 0 0em rgba(0, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2);
  }
  37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(0, 0, 0, 0.5), 2.5em 0em 0 0em rgba(0, 0, 0, 0.7), 1.75em 1.75em 0 0em #fff, 0em 2.5em 0 0em rgba(0, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(0, 0, 0, 0.2), -2.6em 0em 0 0em rgba(0, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2);
  }
  50% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2), 2.5em 0em 0 0em rgba(0, 0, 0, 0.5), 1.75em 1.75em 0 0em rgba(0, 0, 0, 0.7), 0em 2.5em 0 0em #fff, -1.8em 1.8em 0 0em rgba(0, 0, 0, 0.2), -2.6em 0em 0 0em rgba(0, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2);
  }
  62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2), 2.5em 0em 0 0em rgba(0, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(0, 0, 0, 0.5), 0em 2.5em 0 0em rgba(0, 0, 0, 0.7), -1.8em 1.8em 0 0em #fff, -2.6em 0em 0 0em rgba(0, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2);
  }
  75% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2), 2.5em 0em 0 0em rgba(0, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(0, 0, 0, 0.2), 0em 2.5em 0 0em rgba(0, 0, 0, 0.5), -1.8em 1.8em 0 0em rgba(0, 0, 0, 0.7), -2.6em 0em 0 0em #fff, -1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2);
  }
  87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2), 2.5em 0em 0 0em rgba(0, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(0, 0, 0, 0.2), 0em 2.5em 0 0em rgba(0, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(0, 0, 0, 0.5), -2.6em 0em 0 0em rgba(0, 0, 0, 0.7), -1.8em -1.8em 0 0em #fff;
  }
}
/* header */
header {
  position: sticky;
  top: 0;
  z-index: 10;
  height: 50px;
  background: #eeb3e2;
  opacity: 0.9;
}

header div {
  width: 100%;
}

header p {
  width: 290px;
  margin: 0 auto;
  font-size: 10px;
  text-align: center;
  color: #fff;
}

header p:nth-child(2) {
  font-size: 22px;
  font-family: "Belgrano", serif;
}

.header_parts {
  padding-top: 13px;
}

.header-title-img {
  width: 180px;
  margin: 0 auto;
}

.header-title-img img {
  width: 100%;
}

/* menu */
#hamburger {
  position: sticky;
  right: 30px;
  top: 60px;
  z-index: 10;
}

.menu-trigger, .menu-trigger span {
  display: inline-block;
  transition: all 0.4s;
  box-sizing: border-box;
}

.menu-trigger {
  position: absolute;
  top: -35px;
  right: 15px;
  width: 24px;
  height: 20px;
  cursor: pointer;
}

.menu-trigger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 1px;
  background: #fff;
}

.menu-trigger::before {
  position: absolute;
  content: "";
  top: -15px;
  left: -5px;
  font-size: 10px !important;
  letter-spacing: 3px;
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -o-transform: scale(0.8);
  transition: all 0.4s;
  transform: scale(0.8);
}

.menu-trigger.active::before {
  content: "";
  letter-spacing: 1px;
  top: -17px;
  left: -5px;
}

.menu-trigger span:nth-of-type(1) {
  top: 0;
}

.menu-trigger span:nth-of-type(2) {
  top: 9px;
}

.menu-trigger span:nth-of-type(3) {
  bottom: 0;
}

.menu-trigger.active span:nth-of-type(1) {
  transform: translateY(7px) rotate(-45deg);
}

.menu-trigger.active span:nth-of-type(2) {
  opacity: 0;
}

.menu-trigger.active span:nth-of-type(3) {
  transform: translateY(-11px) rotate(45deg);
}

#blind_menu {
  display: none;
  width: 100%;
  position: absolute;
  z-index: 10;
  overflow: hidden;
  height: calc(100vh - 40px);
  top: 40px;
  right: -100%;
  background: #f0a9c3;
  transition: 0.4s;
}

#blind_menu.open_menu {
  right: 0px;
}

#menu_list_sp {
  position: absolute;
  top: calc(45% - 210px);
  width: 100%;
  height: 420px;
  list-style: none;
  padding: 40px 10px 0;
}

.menu_item {
  z-index: 10000;
  font-family: "Lobster Two", cursive, sans-serif;
  font-size: 20px;
  font-weight: bold;
  line-height: 20px;
  text-align: center;
  padding-bottom: 30px;
}

.menu_item a {
  color: #fff;
  display: inline-block;
  letter-spacing: 6px;
}

.menu_item a:hover {
  letter-spacing: 14px;
}

#fixed .social {
  position: absolute;
  right: 2%;
  top: 60px;
}

/********** 550px **********/
@media screen and (min-width: 550px) {
  /* header */
  header {
    height: 48px;
  }
  .header_parts {
    padding-top: 7px;
  }
  .header-title-img {
    width: 240px;
  }
  #blind_menu {
    top: 48px;
  }
  .menu_item {
    font-size: 30px;
    line-height: 36px;
  }
  .menu-trigger {
    position: absolute;
    top: -39px;
  }
}
/* footer */
#org_footer {
  padding: 100px 0;
  background: #f7bad5;
}

#org_footer p {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  color: #fff;
  font-size: 12px;
  font-family: "ヒラギノ丸ゴ ProN", sans-serif;
  text-align: center;
  letter-spacing: 0.2em;
}

.not_received_info {
  -webkit-text-decoration: underline white !important;
          text-decoration: underline white !important;
}

/********** 1000px **********/
@media screen and (min-width: 1000px) {
  /* footer */
  #org_footer div {
    display: flex;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto;
  }
  #org_footer div p:nth-child(1) {
    margin-right: 20px;
  }
}
/********** about **********/
/* ファーストビュー */
#about-firstv {
  display: none;
}

#sp-about-firstv {
  padding-top: 177.87%; /* 1334 / 750 * 100 */
  position: relative;
  overflow: hidden;
  margin-bottom: 100px;
}

#sp-about-bg1 img, #sp-about-bg2 img, #sp-about-bg3 img, #sp-about-bg4 img {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
}

#sp-about-bg1 img {
  z-index: 4;
}

#sp-about-bg2 img {
  z-index: 3;
  top: 22vw;
}

#sp-about-bg3 img {
  z-index: 2;
  top: 19vw;
}

#sp-about-bg4 img {
  z-index: 1;
  top: -10.7vw;
}

/* lowerpage-title */
.about-lowerpage-title1,
.about-lowerpage-title2,
.about-lowerpage-title3 {
  margin-bottom: 50px;
}

.about-lowerpage-title3 {
  margin-top: 100px;
}

.about-lowerpage-title1 div {
  width: 239px;
  margin: 0 auto;
}

.about-lowerpage-title2 div {
  width: 262px;
  margin: 0 auto;
}

.about-lowerpage-title3 div {
  width: 164px;
  margin: 0 auto;
}

.about-lowerpage-title1 div img,
.about-lowerpage-title2 div img,
.about-lowerpage-title3 div img {
  width: 100%;
}

.about-lowerpage-title1 p, .about-lowerpage-title2 p, .about-lowerpage-title3 p {
  width: 320px;
  margin: 0 auto;
  color: #fff;
  font-size: 12px;
  text-align: center;
}

/* yoshiki */
.about-yoshiki {
  margin-bottom: 100px;
}

.about-yoshiki1, .about-yoshiki2 {
  width: 90%;
  max-width: 457px;
  margin: 0 auto;
}

.about-yoshiki1 img, .about-yoshiki2 img {
  width: 100%;
  margin-bottom: 30px;
}

.about-yoshiki p {
  width: 90%;
  max-width: 457px;
  margin: 0 auto;
  color: #fff;
  font-size: 12px;
  letter-spacing: 0.2em;
}

/* variations */
.yk_column_row {
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
}

/* .yk_column_row div { width: 30%; margin: 0 0 20px 2.5%; } */
.yk_column_row div {
  width: 25%;
  margin: 0 0 20px 6.25%;
}

.yk_column_row div img {
  width: 100%;
}

.yk_column_row div p {
  color: #fff;
  width: 95%;
  margin: 0;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0.13em;
  text-align: center;
}

/* goods */
.about-goods {
  margin-bottom: 100px;
}

.about-goods div {
  width: 90%;
  max-width: 594px;
  margin: 0 auto;
}

.about-goods div img {
  width: 100%;
  margin-bottom: 30px;
}

.about-goods p {
  width: 90%;
  max-width: 470px;
  margin: 0 auto;
  color: #fff;
  font-size: 12px;
  letter-spacing: 0.2em;
}

/********** 550px **********/
@media screen and (min-width: 550px) {
  /* ファーストビュー */
  #sp-about-firstv {
    display: none;
  }
  #about-firstv {
    display: block;
    padding-top: 45.3%; /* 1450 / 3200 * 100 */
    position: relative;
    overflow: hidden;
    margin-bottom: 100px;
  }
  #about-bg1 img, #about-bg2 img, #about-bg3 img {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
  }
  #about-bg1 img {
    z-index: 3;
  }
  #about-bg2 img {
    z-index: 2;
  }
  #about-bg3 img {
    z-index: 1;
  }
  /* variations */
  .yk_column_row {
    width: 436px;
    margin: 0 auto;
  }
  .yk_column_row div {
    width: 124px;
    margin: 0 0 30px 16px;
  }
}
/********** 750px **********/
@media screen and (min-width: 750px) {
  /* variations */
  .yk_column_row {
    width: 576px;
  }
}
/********** 1000px **********/
@media screen and (min-width: 1000px) {
  /* variations */
  .yk_column_row {
    width: 856px;
  }
}
/********** 1200px **********/
@media screen and (min-width: 1200px) {
  /* yoshiki */
  .about-yoshiki div {
    display: flex;
    width: 976px;
    margin: 0 auto 30px;
  }
  .about-yoshiki1, .about-yoshiki2 {
    margin: 0 0 0 13px;
    height: 305px;
  }
  .about-yoshiki1 img, .about-yoshiki2 img {
    margin-bottom: 80px;
    height: 304px;
  }
  .about-yoshiki p {
    max-width: 900px;
    margin: 0 auto;
    line-height: 1.35em;
  }
  /* goods */
  .about-goods {
    display: flex;
    width: 963px;
    margin: 0 auto 100px;
  }
  .about-goods div {
    margin: 0;
  }
  .about-goods p {
    margin-left: 36px;
    padding-top: 80px;
  }
}
/********** 1600px **********/
/********** contact **********/
.conact-lowerpage-title {
  margin: 100px 0 100px;
}

.conact-lowerpage-title div {
  width: 126px;
  margin: 0 auto;
}

.conact-lowerpage-title div img {
  width: 100%;
}

.conact-lowerpage-title p {
  width: 320px;
  margin: 0 auto;
  color: #fff;
  font-size: 12px;
  text-align: center;
}

.contact-top-img {
  width: 90%;
  max-width: 636px;
  margin: 0 auto;
}

.contact-top-img img {
  width: 100%;
}

.contact-text {
  margin-top: 50px;
}

.contact-text p {
  width: 90%;
  max-width: 510px;
  letter-spacing: 0.1em;
  margin: 0 auto;
  color: #fff;
  font-size: 16px;
  line-height: 24px;
}

.contact-text p:nth-child(4) {
  margin: 20px auto 50px;
}

.contact-text p:nth-child(5) {
  color: #fff600;
  margin-bottom: 20px;
  text-align: center;
}

.contact-text p a {
  color: #fff;
}

/* コンタクトフォーム */
#contactform {
  background: #f7bad5;
  padding: 50px 0 30px;
}

#contactform input, #contactform textarea, .wpcf7-select {
  width: 100%;
  padding: 10px;
  border-radius: 4px;
  border: none;
  outline: none;
  font-size: 14px;
  font-family: "小塚ゴシック Pr6N", sans-serif;
}

.wpcf7-select {
  padding-left: 6px;
}

#contactform input {
  height: 36px;
}

.wpcf7 {
  width: 90%;
  max-width: 800px;
  margin: 0 auto;
}

#contactform label {
  padding-left: 6px;
  color: #fff;
  font-size: 16px;
  line-height: 20px;
  letter-spacing: 0.2em;
}

.wpcf7-submit {
  background: #fff;
  font-size: 16px;
  letter-spacing: 0.2em;
}

.wpcf7-submit:hover {
  background: gray;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form .wpcf7-response-output {
  font-size: 16px;
  color: #dc3232;
  border: none;
}

/********** charatai2021 **********/
/* ファーストビュー */
#charatai2021-firstv {
  padding-top: 40.2%;
  position: relative;
  overflow: hidden;
  margin: 80px 0;
} /* 643 / (1281/width80%) * 100 */
#charatai2021-bg img {
  position: absolute;
  width: 80%;
  top: 0;
  margin: 0 10%;
}

/* ファーストビューtext*/
.charatai2021-text {
  margin-bottom: 80px;
}

.charatai2021-text p {
  width: 90%;
  max-width: 725px;
  letter-spacing: 0.1em;
  margin: 0 auto;
  color: #fff;
  font-size: 12px;
  line-height: 20px;
}

.charatai2021-text p:nth-child(1),
.charatai2021-modal-text p:nth-child(1) {
  color: #fffa00;
  font-weight: bold;
  text-align: center;
  margin-bottom: 20px;
}

/* charatai2021-modal */
.charatai2021-modal-bg {
  background: #62028f;
  padding: 80px 0;
}

.charatai2021-modal {
  display: none;
}

.charatai2021-modal-sp {
  width: 80%;
  margin: 0 auto 50px;
}

.charatai2021-modal-sp img {
  width: 100%;
}

.charatai2021-modal-text p {
  width: 90%;
  max-width: 600px;
  margin: 0 auto;
  color: #fff;
  font-size: 12px;
  line-height: 20px;
}

.charatai2021-modal-text p a {
  color: #fff;
}

/********** 550px **********/
@media screen and (min-width: 550px) {
  .charatai2021-modal-sp {
    display: none;
  }
  .charatai2021-modal {
    display: block;
    width: 80%;
    max-width: 900px;
    margin: 0 auto 50px;
  }
  .charatai2021-modal img {
    width: 100%;
  }
  .charatai2021-text p, .charatai2021-modal-text p {
    font-size: 16px;
    line-height: 24px;
  }
}
/********** 750px **********/
@media screen and (min-width: 750px) {
  /* ファーストビュー */
  #charatai2021-firstv {
    padding-top: 0;
  }
  #charatai2021-bg {
    width: 640px;
    margin: 0 auto;
  }
  #charatai2021-bg img {
    position: relative;
    width: 100%;
    margin: 0;
  }
  /* ファーストビューtext*/
  .charatai2021-text {
    margin-bottom: 80px;
  }
  .charatai2021-text p {
    width: 60%;
  }
  .charatai2021-text p:nth-child(1),
  .charatai2021-modal-text p:nth-child(1) {
    color: #fffa00;
    font-weight: bold;
    text-align: center;
    margin-bottom: 20px;
  }
}/*# sourceMappingURL=style.css.map */