@charset "utf-8";
/* CSS Document */

.music_wrap{
   position: relative;
   overflow: hidden;
   width: 100%;
   margin-top: 30px;
}
   @media screen and (max-width: 1024px) {
      .music_wrap{
      } 
   }
   @media screen and (max-width: 600px) {
      .music_wrap{
      } 
   }


.music_wrap2{
   position: relative;
   width: min(95% , 1000px);
   margin: 0 auto 0 auto;
}
   @media screen and (max-width: 600px) {
      .music_wrap2{
         width: 100%;
      } 
   }



.music_inner_wrap{
   position: relative;
   width: 100%;
   padding: 0 40px;
}
   @media screen and (max-width: 1024px) {
      .music_inner_wrap{
         padding: 0 20px;
      } 
   }
   @media screen and (max-width: 600px) {
      .music_inner_wrap{
         padding: 0 0px;
      } 
   }
 
 .music_inner_wrap2{
   position: relative;
   width: 100%;
   padding: 0 40px;
   margin-bottom: 50px;
}
   @media screen and (max-width: 1024px) {
      .music_inner_wrap2{
         padding: 0 20px;
      } 
   }
   @media screen and (max-width: 600px) {
      .music_inner_wrap2{
         padding: 0 0px;
      } 
   }
 

.music_cont_wrap{
   position: relative;
   width: 100%;
   display: flex;
   justify-content: space-between;
   flex-wrap: wrap;
}
   @media screen and (max-width: 600px) {
      .music_cont_wrap{
      } 
   }


.music_cont_wrap .op_wrap{
   position: relative;
   width: 49%;
}
   @media screen and (max-width: 1024px) {
      .music_cont_wrap .op_wrap{
         width: 100%;
         margin-bottom: 60px;
         border-bottom: rgba(181,181,181,1.00) 2px dotted;
      } 
   }


.music_cont_wrap .ed_wrap{
   position: relative;
   width: 49%;
}
   @media screen and (max-width: 1024px) {
      .music_cont_wrap .ed_wrap{
         width: 100%;
      } 
   }



.i_music_cont{
   position: relative;
   width: 100%;
   text-align: center;
   color: rgba(145,0,145,1.00);
   font-weight: 900;
   font-size: 140%;
   font-family: "Kaisei Tokumin", serif;
   line-height: 1.4;
   letter-spacing: 3px;
}
   @media screen and (max-width: 1200px) {
      .i_music_cont{
         font-size: 140%;
      } 
   }
   @media screen and (max-width: 600px) {
      .i_music_cont{
         font-size: 4vw;
      }
   }

.i_music_cont span{
   position: relative;
   display: inline-block;
}

.i_music_cont span:before {
   content: "";
   position: absolute;
   left: -1.2em;
   top: 0.2em;
   background-image: url("../images/tmp/k_005.png");
   background-repeat: no-repeat;
   width: 1em;
   height: 1em;
   background-size: contain;
   vertical-align: middle;
}

.i_music_cont span:after {
   content: "";
   position: absolute;
   right: -1.2em;
   top: 0.2em;
   background-image: url("../images/tmp/k_005.png");
   background-repeat: no-repeat;
   width: 1em;
   height: 1em;
   background-size: contain;
   vertical-align: middle;
}


.music_list_title{
   font-family: "Kaisei Tokumin", serif;
   font-size: 200%;
   font-weight: 900;
   line-height: 1.4;
   color: rgba(190,0,120,1.00);
   text-align: center;
   margin-bottom: 10px;
}
   @media screen and (max-width: 1200px) {
      .music_list_title{
      font-size: 200%;
      } 
   }
   @media screen and (max-width: 600px) {
      .music_list_title{
      font-size: 7vw;
      } 
   }


.music_list_artist01{
   font-size: 140%;
   font-weight: 600;
   text-align: center;
}
   @media screen and (max-width: 600px) {
      .music_list_artist01{
      font-size: 5.5vw;
      } 
   }


.music_list_artist02{
   font-size: 100%;
   font-weight: 400;
   text-align: center;
   margin-bottom: 20px;
}

.music_list_create{
   font-size: 100%;
   font-weight: 400;
   text-align: center;
   margin-bottom: 40px;
}

/* 詳細ページ */


h1.music{
   text-align: center;
   font-size: 160%;
   font-family: "Kaisei Tokumin", serif;
   letter-spacing: 5px;
}
   @media screen and (max-width: 600px) {
      h1.music{
         font-size: 4.5vw;
         letter-spacing: 0;
      }
   }


h2.music{
   font-family: "Kaisei Tokumin", serif;
   text-align: center;
}

.music_title_wrap{
   position: relative;
   text-align: center;
   margin: 0 auto 50px auto;
}


.music_title_wrap{
   position: relative;
   text-align: center;
   margin: 0 auto 50px auto;
}



.music_wrap .ch_link_box{
   /*font-family: YakuHanMP, 'Noto Serif JP', serif;*/
   text-align: center;
   margin: auto;
   margin-bottom: 40px;
   line-height: 1.4;
}
.music_wrap .ch_link_box a{
   color: rgba(255,255,255,1.00);
   padding: 6px 20px;
   font-size: 120%;
   font-weight: 600;
   background-color: rgba(133,163,213,1.00);
   border-radius: 20px;
   display: inline-block;
}

   @media screen and (max-width: 480px) {
      .music_wrap .ch_link_box{
         font-size: 3.6vw;
      }
   }

.music_wrap .ch_link_box a:hover{
   background-color: rgba(236,109,128,1.00);
}


.music_ich{
   font-family: 'M PLUS Rounded 1c', sans-serif;
   transform: rotate(0.03deg);
   font-size: 100%;
   text-align: center;
   font-weight: 700;
   color: rgba(87,46,18,1.00);
   line-height: 1.2;
}
   @media screen and (max-width: 600px) {
      .music_ich{
          font-size: 3.0vw;
      }
   }


.music_i01{
   font-family: 'M PLUS Rounded 1c', sans-serif;
   font-size: 160%;
   font-weight: 700;
  color: rgba(236,109,128,1.00);
  transform: rotate(0.03deg);
}
   @media screen and (max-width: 600px) {
      .music_i01{
          font-size: 140%;
      }
   }


.music_i02{
   font-family: "Kaisei Tokumin", serif;
   transform: rotate(0.03deg);
   font-size: 180%;
   text-align: center;
   font-weight: 700;
   color: rgba(145,0,145,1.00);
   line-height: 1.4;
}
   @media screen and (max-width: 600px) {
      .music_i02{
          font-size: 5.5vw;
      }
   }

.music_i02_02{
   font-family: "Kaisei Tokumin", serif;
   transform: rotate(0.03deg);
   font-size: 200%;
   text-align: center;
   font-weight: 700;
   color: rgba(145,0,145,1.00);
   line-height: 1.4;
   margin-bottom: 15px;
}
   @media screen and (max-width: 600px) {
      .music_i02_02{
          font-size: 5.5vw;
      }
   }

.music_i03{
   font-family: 'M PLUS Rounded 1c', sans-serif;
   font-size: 180%;
   font-weight: 700;
   color: rgba(76,60,52,1.00);
   margin-bottom: 10px;
  transform: rotate(0.03deg);
}
   @media screen and (max-width: 600px) {
      .music_i03{
          font-size: 160%;
      }
   }

.music_i03_02{
   font-family: 'M PLUS Rounded 1c', sans-serif;
   font-size: 140%;
   font-weight: 700;
   color: rgba(76,60,52,1.00);
   margin-bottom: 10px;
  transform: rotate(0.03deg);
}
   @media screen and (max-width: 600px) {
      .music_i03_02{
          font-size: 120%;
      }
   }


.music_i04{
   font-family: 'M PLUS Rounded 1c', sans-serif;
   font-size: 100%;
   font-weight: 600;
   color: rgba(76,60,52,1.00);
  transform: rotate(0.03deg);
}
   @media screen and (max-width: 600px) {
      .music_i04{
          font-size: 98%;
      }
   }

.music_onsale{
   font-family: "Kaisei Tokumin", serif;
   transform: rotate(0.03deg);
   font-size: 180%;
   font-weight: 700;
   margin: 0 auto 30px auto;
   color: rgba(190,0,120,1.00);
   text-align: center;
}
   @media screen and (max-width: 600px) {
      .music_onsale{
          font-size: 5.0vw;
      }
   }

.music_thema_wrap{
   position: relative;
   width: 100%;
   display: flex;
   justify-content: center;
   margin-bottom: 50px;
   padding-top: 10px;
}

.music_inner{
   position: relative;
   padding: 0 0px;
   color: var(--main-txt2-color);
   font-size: 100%;
   line-height: 1.8;
   margin-bottom: 0;
}
   @media screen and (max-width: 480px) {
      .music_inner{
          padding: 0 0;
      }
   }


.music_a_wrap{
   position: relative;
   width: 100%;
   display: flex;
   justify-content: space-between;
   flex-wrap: wrap;
   margin-bottom: 30px;
}
   @media screen and (max-width: 480px) {
      .music_a_wrap{
          margin-bottom: 20px;
      }
   }


.music_a_wrap .jk_wrap{
   width: 49%;
   aspect-ratio: 1 / 1;
}
   @media screen and (max-width: 800px) {
      .music_a_wrap .jk_wrap{
          width: 90%;
          margin: auto;
          margin-bottom: 20px;
      }
   }
   @media screen and (max-width: 480px) {
      .music_a_wrap .jk_wrap{
          width: 100%;
      }
   }



.music_a_wrap .jk_wrap img{
   border: rgba(147,114,34,1.00) 1px solid;
   box-sizing: border-box;
   width: 100%;
   height: 100%;
   object-fit: contain;
}

.music_a_wrap .detail_wrap{
   width: 48%;
   margin-top: 10px;
}
   @media screen and (max-width: 800px) {
      .music_a_wrap .detail_wrap{
          width: 100%;
      }
   }

.music_i05{
  color: rgba(236,109,128,1.00);
  padding-bottom: 5px;
  position: relative;
  font-weight: 800;
  line-height: 1.4;
  font-size: 110%;
  font-family: YakuHanJP, 'Zen Maru Gothic', serif; 
  transform: rotate(0.03deg);
  border-bottom: rgba(172,172,172,1.00) 2px dotted;
}

.music_rec_warp{
   position: relative;
   width: 100%;
   padding-left: 20px;
   line-height: 1.6;
   margin-bottom: 15px;
}
   @media screen and (max-width: 480px) {
      .music_rec_warp{
         padding-left: 0;
      }
   }


.music_rec_warp .rec_title{
   font-size: 120%;
   font-weight: 600;
}

.music_rec_warp .rec_cat{
   font-size: 90%;
   padding-left: 10px;
}
   @media screen and (max-width: 480px) {
      .music_rec_warp .rec_cat{
         padding-left: 5vw;
         font-size: 80%;
      }
   }

.music_rec_warp .artist_txt{
   margin-left: 20px;
   font-size: 90%;
}

.music_comment{
   border: rgba(236,109,128,1.00) 1px solid;
   background-color: rgba(255,243,245,1.00);
   padding: 20px 30px 30px 30px;
   box-sizing: border-box;
   margin-bottom: 40px;
}
   @media screen and (max-width: 600px) {
      .music_comment{
          padding: 20px 15px 30px 15px;
      }
   }


.music_comment.ed{
   padding: 20px 30px 0 30px;
}
   @media screen and (max-width: 600px) {
      .music_comment.ed{
          padding: 20px 15px 0 15px;
      }
   }


.music_prof_name{
   font-family: 'M PLUS Rounded 1c', sans-serif;
   font-size: 160%;
   font-weight: 700;
   color: rgba(76,60,52,1.00);
   margin-bottom: 20px;
}

/* オリ特 */

.tokuten_wrap{
   position: relative;
   width: 100%;
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
   flex-wrap: wrap;
   border-bottom: rgba(126,76,67,0.20) 3px dotted;
   padding-bottom: 10px;
   margin-bottom: 30px;
}

.tokuten_wrap .pic_box{
   width: 25%;
   border: rgba(126,76,67,1.00) 1px solid;
   box-sizing: border-box;
   aspect-ratio: 1 / 1;
}
   @media screen and (max-width: 600px) {
      .tokuten_wrap .pic_box{
         width: 80%;
         margin: auto;
         margin-bottom: 20px;
      }
   }


.tokuten_wrap .pic_box img{
   width: 100%;
   height: 100%;
   object-fit: contain;
}

.tokuten_wrap .txt_box{
   width: 73%;
}
   @media screen and (max-width: 600px) {
      .tokuten_wrap .txt_box{
         width: 100%;
      }
   }

.pkg_b_cart_wrap{
   margin: 30px 0 15px 0;
}
   @media screen and (max-width: 600px) {
      .pkg_b_cart_wrap{
         margin: 20px auto 15px auto;
         text-align: center;
         width: 80%;
      }
   }


.pkg_b_cart_wrap a{
   background-color: rgba(190,0,120,0.02);
   color: rgba(126,76,67,1.00);
   padding: 6px 20px;
   display: inline-block;
   font-weight: 600;
   text-decoration: none;
   transition: all 0.2s;
   border: rgba(190,0,120,1.00) 1px solid;
}
   @media screen and (max-width: 600px) {
      .pkg_b_cart_wrap a{
         width: 100%;
         text-align: center;
      }
   }


.pkg_b_cart_wrap a:hover{
   background-color: rgba(190,0,120,1.00);
   color: rgba(255,255,255,1.00);
}

h2.music{
   font-size: 130%;
   font-family: "Kaisei Tokumin", serif;
   margin-bottom: 30px;
}

h2.music_tokuten{
   font-size: 110%;
   font-family: "Kaisei Tokumin", serif;
   margin-bottom: 10px;
}


.music_shuroku_flex{
   position: relative;
   width: 100%;
   display: flex;
   justify-content: space-between;
   flex-wrap: wrap;
}

.music_shuroku_flex .music_sh_left_wrap{
   width: 45%;
}
   @media screen and (max-width: 1024px) {
      .music_shuroku_flex .music_sh_left_wrap{
         width: 100%;
      }
   }

.music_shuroku_flex .music_sh_right_wrap{
   width: 55%;
}
   @media screen and (max-width: 1024px) {
      .music_shuroku_flex .music_sh_right_wrap{
         width: 100%;
      }
   }


.music_shuroku_wrap{
   margin-bottom: 30px;
}


.music_shuroku_title{
   font-size: 120%;
   font-family: "Kaisei Tokumin", serif;
   line-height: 1.2;
   margin-bottom: 10px;
}

.music_shuroku_title.charasong{
   font-size: 110%;
   display: flex;
   justify-content: flex-start;
}

.music_shuroku_title.charason .music_listno{
   width: 3em;
}
.music_shuroku_title.charason .music_listtitle{
   width: calc(100% - 3em);
}

.music_shuroku_title span{
   font-size: 90%;
}
   @media screen and (max-width: 600px) {
      .music_shuroku_title span{
         margin-left: 20px;
         font-size: 75%;
      }
   }

.music_shuroku_title span.inst{
   font-size: 90%;
   margin-left: 7px;
}
   @media screen and (max-width: 600px) {
      .music_shuroku_title span.inst{
         margin-left: 0px;
         font-size: 75%;
         display: block;
      }
   }


.music_shuroku_title span.inst.charasong{
   font-size: 80%;
}
   @media screen and (max-width: 600px) {
      .music_shuroku_title span.inst.charasong{
         margin-left: 0px;
         font-size: 75%;
      }
   }




.music_shuroku_txt01{
   margin-left: 60px;
   line-height: 1.4;
   font-size: 90%;
   font-family: 'Noto Sans JP', "Helvetica Neue", Helvetica, Arial, "Hiragino Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;
}
   @media screen and (max-width: 600px) {
      .music_shuroku_txt01{
         margin-left: 28px;
      }
   }

.music_shuroku_txt02{
   margin-left: 60px;
   line-height: 1.4;
   font-size: 100%;
   font-family: 'Noto Sans JP', "Helvetica Neue", Helvetica, Arial, "Hiragino Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;
}
   @media screen and (max-width: 600px) {
      .music_shuroku_txt02{
         margin-left: 50px;
      }
   }


.music_shuroku_txt03{
   margin-left: 60px;
   line-height: 1.4;
   font-size: 90%;
   font-family: 'Noto Sans JP', "Helvetica Neue", Helvetica, Arial, "Hiragino Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;
}
   @media screen and (max-width: 600px) {
      .music_shuroku_txt03{
         margin-left: 50px;
      }
   }


.music_haishin_wrap{
   position: relative;
   width: 100%;
   margin: 40px auto 0px auto;
}
   @media screen and (max-width: 800px) {
      .music_haishin_wrap{
         text-align: center;
      }
   }


.music_haishin_wrap span{
   background-color: rgba(145,0,145,1.00);
   display: inline-block;
   padding: 5px 30px;
   color: rgba(255,255,255,1.00);
   font-family: "Kaisei Tokumin", serif;
   font-weight: 700;
   font-size: 120%;
   border-radius: 20px;
   transition: all .6s;
}
   @media screen and (max-width: 600px) {
      .music_haishin_wrap span{
         font-size: 6vw;
      }
   }


.music_haishin_wrap a{
   color: rgba(255,255,255,1.00);
}

.music_haishin_wrap span:hover{
   background-color: rgba(190,0,120,1.00);
}



.music_list_head_wrap{
   position: relative;
   width: 100%;
   display: flex;
   justify-content: space-between;
   margin-bottom: 15px;
}

.music_list_head_wrap .w_c_01_left{
   width: 7%;
}
   @media screen and (max-width: 600px) {
      .music_list_head_wrap .w_c_01_left{
         width: 12%;
      } 
   }

.music_list_head_wrap .w_c_01_center{
   width: 86%;
   background-image: url("../images/chara/list/head_002.png");
   background-size: 100% 100%;
}


.music_list_head_wrap .w_c_01_right{
   width: 7%;
}
   @media screen and (max-width: 600px) {
      .music_list_head_wrap .w_c_01_right{
         width: 12%;
      } 
   }


.music_list_head_wrap .w_c_01_center .i_001{
   position: relative;
   height: 100%;
   width: 100%;
   text-align: center;
   background-image: url("../images/music/i_oped.png");
   background-repeat: no-repeat;
   background-position: center;
   background-size: auto 100%;
}

.music_list_head_wrap .w_c_01_center .i_002{
   position: relative;
   height: 100%;
   width: 100%;
   text-align: center;
   background-image: url("../images/music/i_charasong.png");
   background-repeat: no-repeat;
   background-position: center;
   background-size: auto 100%;
}

.music_list_head_wrap .w_c_01_center .i_003{
   position: relative;
   height: 100%;
   width: 100%;
   text-align: center;
   background-image: url("../images/music/i_soundtrack.png");
   background-repeat: no-repeat;
   background-position: center;
   background-size: auto 100%;
}