/* ///// color ///////////////////////////////// */
:root {
   --basecolor: #666666;
   --color_red: #ff005b;
   --color-lightpurple: #f0dfff;
}

/* /////////////////////////////////////////////  */
@import url("https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c&family=Noto+Sans+JP:wght@400;600&display=swap");

* {
   margin: 0;
   padding: 0;
}

html {
   scroll-behavior: smooth;
}

body {
   position: relative;
   z-index: 0;
   overflow-x: hidden;
   background-color: #ffffff;
   color: var(--basecolor);
   font-weight: 400;
   font-family: "Noto Sans JP", "Hiragino Sans", "Meiryo", "serif";
   line-height: 1.4;

   -webkit-text-size-adjust: 100%;
   -webkit-text-size-adjust: none;
}

img {
   width: 100%;
}

a {
   color: inherit;
   text-decoration: none;
   transition: .3s;
}

a:hover,
a:hover:after {
   opacity: .5;
}

p {
   width: 100%;
}


/* ///// layout ///////////////////////////////// */
section,
article,
footer {
   display: flex;
   position: relative;
   align-items: center;
   flex-direction: column;
   width: 100%;
   text-align: center;
}

.l_sectioninner {
   padding: 4% 0;
}

.l_sectioninner_bottom {
   padding-bottom: 4%;
}

/* width */
.l_width_inner {
   margin: 0 auto;
   width: 87%;
}

@media (max-width: 768px) {
   .l_width_inner {
      width: 95%;
   }
}

.l_widht_medium {
   margin: 0 auto;
   width: 89%;
}

/* ///// component ///////////////////////////////// */
/* ttl */
.c_ttl {
   padding: 1% 0.5%;
   width: 100%;
   background-color: var(--color-lightpurple);
}

.c_ttl2 {
   padding: 1% 0.5%;
   width: 100%;
   background-color: #8c73e5;
}

.c_ttl img {
   width: auto;
   height: 2.5vw;
   vertical-align: bottom;
}

.c_ttl2 img {
   width: auto;
   height: 2.5vw;
   vertical-align: bottom;
}

@media (max-width:769px) {
   .c_ttl img {
      height: 5vw;
   }

   .c_ttl2 img {
      height: 5vw;
   }
}

.c_ttl_line {
   margin: 6% auto 4%;
   padding: 1% 0;
   width: 100%;
   border: solid 1px var(--basecolor);
   border-radius: 13px;
   letter-spacing: .2vw;
   font-weight: normal;
   font-family: "M PLUS Rounded 1c", sans-serif;
}

.c_ttl_line_red {
   border: solid 1px var(--color_red);
   color: var(--color_red);
}

.c_ttl_line_point {
   padding: 0.3em 0.3em 0.3em 0.9em;
   box-sizing: border-box;
   margin: 1em auto 0.5em;
   width: 100%;
   border-bottom: solid 1px var(--basecolor);
   position: relative;
}

.c_ttl_line_point::before {
   content: "";
   width: 0.3em;
   height: 1em;
   position: absolute;
   display: block;
   background-color: var(--basecolor);
   top: calc(50% - 0.5em);
   left: 0.3em;
}

.c_ttl_imgline {
   border: solid min(0.9vw, 14px) transparent;
   padding: 0 0.5em;
   box-sizing: border-box;
   margin: 1em auto 0.5em;
   width: 100%;
   border-image: url(../images/lineimg.png) 14;
}

/* txt-size */
.c_txts_s {
   font-size: min(2.8vw, 14px);
}

.c_txts_m {
   font-size: min(3.3vw, 17px);
}

.c_txts_l {
   letter-spacing: .2vw;
   font-size: min(4.5vw, 25px);
}

@media (min-width:1025px) {
   .c_txts_s {
      font-size: 1.2vw;
   }

   .c_txts_m {
      font-size: 1.7vw;
   }

   .c_txts_l {
      letter-spacing: .3vw;
      font-size: 2.5vw;
   }
}

/* txt-weight */
.c_txtw_bold {
   font-weight: bold;
}

/* txt-align */
.c_txta_left {
   text-align: left;
}

/* txt-coler */
.c_txtc_red {
   color: var(--color_red);
}

/* txt-indent */
.c_txt_indent {
   padding-left: -1rem;
   text-indent: -1rem;
}

/* ///// infomaition ///////////////////////////////// */
/* sammary */
.p_info_pic {
   position: relative;
   margin-top: 5%;
}

.p_info_pic_btn {
   display: flex;
   position: absolute;
   top: 76%;
   left: 50%;
   width: 30%;
   transform: translateX(-50%);
}

.p_info_pic_btn a {
   width: 45%;
}

.p_info_pic_btn a:first-child {
   margin-right: 20%;
}

.special_btn01 {
   width: 70%;
   margin: 5% 0% 0%;
}

.special_btn02 {
   width: 85%;
   margin: 3% 0% 5%;
}

/* .p_goods_btn {
     width: 90%;
     margin: 0 auto 9%;
  } */

.p_info_btn {
   display: flex;
   margin: 3% auto;
   flex-wrap: wrap;
   justify-content: center;
}

.p_info_btn a {
   padding: 2%;
   min-width: min(250px, 100%);
   box-sizing: border-box;
   width: 33%;
}

/* access */
.p_access_map {
   display: flex;
   flex-direction: row;
}

@media (max-width: 769px) {
   .p_access_map {
      flex-direction: column;
   }
}

.p_access_map iframe {
   width: min(42%, 726px);
   aspect-ratio: 363/200;
}

@media (max-width: 769px) {
   .p_access_map iframe {
      width: 100%;
   }
}

.p_access_map_txt {
   margin-left: 2%;
}

@media (max-width:769px) {
   .p_access_map_txt {
      margin-top: 2%;
      margin-left: 0;
   }
}

/* ///// goods ///////////////////////////////// */
.p_goods_img {
   position: relative;
}

.p_goods_btn {
   position: absolute;
   display: flex;
   justify-content: space-between;   
}

.p_goods_btn img {
   width: 100%;
   height: auto;
}

.p_btn_buy {
   display: block;
   width: min(9.6vw,192px);
}

.p_goods_btn_01-1 {
   top: 35.5%;
   left: 21.3%;
   width: 57.3%;
}

.p_goods_btn_01-2 {
   top: 63.4%;
   left: 11.8%;
   width: 76.5%;
}

.p_goods_btn_01-2 .p_btn_buy:nth-of-type(2){
   transform: translateX(-10%);
}

.p_goods_btn_01-2 .p_btn_buy:nth-of-type(4){
   transform: translateX(10%);
}


.p_goods_btn_01-3 {
   top: 92.1%;
   left: 21.3%;
   width: 57.3%;
}

.p_goods_btn_02 {
   top: 90%;
   left: 15.2%;
   width: 69.7%;
}

.p_goods_btn_02 .p_btn_buy:nth-of-type(2){
   transform: translateX(-10%);
}

.p_goods_btn_02 .p_btn_buy:nth-of-type(3){
   transform: translateX(8%);
}

.p_goods_btn_03 {
   top: 88.9%;
   left: 23.3%;
   width: 55%;
}

.p_goods_btn_04 {
   top: 87.5%;
   left: 23.3%;
   width: 55%;
}

.p_goods_btn_05 {
   top: 91.6%;
   left: 23.1%;
   width: 52%;
}

.p_goods_btn_06 {
   top: 78.6%;
   left: 61%;
   width: 11%;
}

.p_goods_btn_06 .p_btn_buy {
   width: min(11vw,203px);
}

.p_goods_btn_07-1 {
   top: 53%;
   left: 13%;
   width: 74%;
}

.p_goods_btn_07-2 {
   top: 90.3%;
   left: 35.5%;
   width: 31.8%;
}

.p_goods_btn_08 {
   top: 85.6%;
   left: 22.8%;
   width: 54.3%;
}

.p_goods_btn_09-1 {
   top: 35.1%;
   left: 9.6%;
   width: 80.8%;
}

.p_goods_btn_09-2 {
   top: 57.9%;
   left: 9.6%;
   width: 77.8%;
}

.p_goods_btn_09-2 .p_btn_buy:nth-of-type(2){
   transform: translateX(-29%);
}

.p_goods_btn_09-2 .p_btn_buy:nth-of-type(3){
   transform: translateX(-30%);
}

.p_goods_btn_09-2 .p_btn_buy:nth-of-type(4){
   transform: translateX(-15%);
}

.p_goods_btn_09-3 {
   top: 91.6%;
   left: 16%;
   width: 68%;
}

.p_goods_btn_10-1 {
   top: 36.1%;
   left: 9.6%;
   width: 80.8%;
}

.p_goods_btn_10-2 {
   top: 59.2%;
   left: 9.5%;
   width: 79.4%;
}

.p_goods_btn_10-2 .p_btn_buy:nth-of-type(2){
   transform: translateX(-30%);
}

.p_goods_btn_10-2 .p_btn_buy:nth-of-type(3){
   transform: translateX(-23%);
}

.p_goods_btn_10-2 .p_btn_buy:nth-of-type(4){
   transform: translateX(-11%);
}

.p_goods_btn_10-3 {
   top: 93.1%;
   left: 16%;
   width: 68%;
}

.p_goods_btn_11-1 {
   top: 89.6%;
   left: 16.6%;
   width: 42.6%;
}

.p_goods_btn_11-2 {
   top: 89.6%;
   left: 73.8%;
   width: 10.6%;
}

.p_goods_btn_12 {
   top: 86.1%;
   left: 29%;
   width: 42%;
}

.p_goods_btn_13-1 {
   top: 49.6%;
   left: 9.1%;
   width: 81.6%;
}

.p_goods_btn_13-2 {
   top: 93%;
   left: 37.2%;
   width: 25.1%;
}

.p_goods_btn_14-1 {
   top: 51.8%;
   left: 27.8%;
   width: 44.4%;
}

.p_goods_btn_14-2 {
   top: 91.5%;
   left: 17%;
   width: 65.9%;
}

.p_goods_btn_14-2 .p_btn_buy:nth-of-type(2){
   transform: translateX(-14%);
}

.p_goods_btn_14-2 .p_btn_buy:nth-of-type(3){
   transform: translateX(-7%);
}

.p_goods_btn_15-2 {
   top: 85.4%;
   left: 19.1%;
   width: 61.8%;
}

.p_specialgoods_btn_01 {
   top: 89.2%;
   left: 31.5%;
   width: 30.2%;
}

.p_specialgoods_btn_02-1 {
   top: 51.3%;
   left: 13.3%;
   width: 73.5%;
}

.p_specialgoods_btn_02-2 {
   top: 92.8%;
   left: 13.3%;
   width: 73.5%;
}


/* ///// novelty ///////////////////////////////// */


/* ///// fotter ///////////////////////////////// */
.p_link {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   justify-content: space-around;
   margin: 0 auto;
   width: 100%;
   list-style: none;
}

.p_link:not(:first-child) {
   margin-top: 3%;
}

.p_link_artistx {
   width: 35%;
}

@media (max-width:769px) {
   .p_link_artistx {
      width: 48%;
   }
}

.p_link_melon {
   width: 15%;
}

@media (max-width:769px) {
   .p_link_melon {
      margin-top: 5%;
      width: 30%;
   }
}

.p_link_melonx {
   width: 25%;
}

@media (max-width:769px) {
   .p_link_melonx {
      margin-top: 5%;
      width: 50%;
   }
}

.p_link_info {
   width: 48%;
}

@media (max-width:769px) {
   .p_link_info {
      margin-top: 5%;
      width: 90%;
   }
}

.p_link_cregit {
   margin: 5% auto;
   width: 60%;
}

@media (max-width:769px) {
   .p_link_cregit {
      margin: 8% auto 15%;
      width: 80%;
   }
}

/* ///// utility ///////////////////////////////// */
/* margin-top */
.u_mt_s {
   margin-top: 1.5%;
}

.u_mt_m {
   margin-top: 3%;
}

/* ///// responseve ///////////////////////////////// */
.pc {
   display: block;
}

.sp {
   display: none;
}

@media (max-width: 768px) {
   .pc {
      display: none;
   }

   .sp,
   .br {
      display: block;
   }
}