.special_top_title{ /*ページのタイトル画像*/
    margin-top: 20px;
    margin-left: 5.6%;
    height: 32px;
    vertical-align: top;
}
@media only screen and (min-width: 1024px) {
  .special_top_title{
    height: 76px;
    margin-left : 11%;
  }
}

.special_top_jp{ /*ページのタイトル日本語*/
    margin-left: 5.6%;
    line-height: 0px;
    margin-bottom: 20px;
}
@media only screen and (min-width: 1024px) {
  .special_top_jp{
    margin-left: 11%;
  }
}


.Top_explanation{ /*ページの説明文*/
    margin: 40px 5.6%;
}
@media only screen and (min-width: 1024px) {
  .Top_explanation{
    margin-left: 11%;
    margin-right: 11%;
  }
}

@media screen and (min-width: 1024px) {
  .JP_36_Medium {
    font-family: 'Noto Sans JP';
    font-size: 36px;
    font-weight: 500;
  }
  .JP_48_Medium {
    font-family: 'Noto Sans JP';
    font-size: 48px;
    font-weight: 500;
  }
}

@media screen and (max-width: 1023px) {
  .underline_wallpaper{
    margin-right: 20px;
    padding-bottom: 20px;
  }
}
@media screen and (max-width: 1023px) {
  #underline_mobile_middle_wallpaper{
    position: absolute;
    bottom: 40px;
    left: calc(84px - 8px + 5.6%);
    width: calc(100% - 84px - 4.5px + 8px - 5.6%);
    height: 26px;
    display: block;
  }
}
@media screen and (min-width: 1024px) {
  #underline_mobile_middle_wallpaper{
    display: none;
  }
}
@media screen and (max-width: 1023px){
  .underline_icon{
  margin-right: 20px;
  padding-bottom: 20px;
  }
}
@media screen and (max-width: 1023px) {
  #underline_mobile_middle_icon{
    position: absolute;
    bottom: 40px;
    left: calc(131px - 8px + 5.6%);
    width: calc(100% - 131px - 4.5px + 8px - 5.6%);
    height: 26px;
    display: block;
  }
}
@media screen and (min-width: 1024px) {
  #underline_mobile_middle_icon{
    display: none;
  }
}
@media screen and (max-width: 1023px){
  .underline_xheader{
  margin-right: 20px;
  padding-bottom: 20px;
  }
}
@media screen and (max-width: 1023px) {
  #under_line_mobile_left_xheader{
    margin-bottom: 0;
  }
}
@media screen and (max-width: 1023px) {
  #underline_mobile_middle_xheader{
    position: absolute;
    bottom: 40px;
    left: calc(131px - 8px + 5.6%);
    width: calc(100% - 131px - 4.5px + 8px - 5.6%);
    height: 26px;
    display: block;
    margin-bottom: 0;
  }
}
@media screen and (min-width: 1024px) {
  #underline_mobile_middle_xheader{
    display: none;
  }
}
@media screen and (max-width: 1023px) {
  #under_line_mobile_right_xheader{
    margin-bottom: 0;
  }
}
@media screen and (max-width: 1023px){
  .underline_logotheme{
  margin-right: 20px;
  padding-bottom: 20px;
  }
}
@media screen and (max-width: 1023px) {
  #underline_mobile_middle_logotheme{
    position: absolute;
    bottom: 40px;
    left: calc(189px - 8px + 5.6%);
    width: calc(100% - 189px - 4.5px + 8px - 5.6%);
    height: 26px;
    display: block;
    margin-bottom: 0;
  }
}
@media screen and (min-width: 1024px) {
  #underline_mobile_middle_logotheme{
    display: none;
  }
}
@media screen and (max-width: 1023px) {
  .underline_pc{
    display: none;    
  }
}
@media screen and (max-width: 1023px) {
  .underline{
    position: relative;
  }
}
@media screen and (min-width: 1024px) {
  .underline{
    position: relative;
  }
  .underline p{
    position: absolute;
    top: -40px;
  }
}

@media screen and (max-width: 1023px) {
  .underline_mobile_left{
    display: block;
    position: absolute;
    bottom: 40px;
    left: calc(5.6% - 8px);
    height: 26px;
    margin-bottom: 0;
  }
}
@media only screen and (min-width: 1024px) {
  .underline_mobile_left{
    display: none;    
  }
}

@media screen and (max-width: 1023px) {
  .underline_mobile_right{
    display: block;
    position: absolute;
    bottom: 40px;
    right: 0;
    height: 26px;
    margin-bottom: 0;
  }
}
@media only screen and (min-width: 1024px) {
  .underline_mobile_right{
    display: none;    
  }
}

.attention{
  width: 88.88%;
  margin: 40px 0;
}
.attention h2 {
  display: flex;
  align-items: center;
}
.attention h2::after {
  content: "";
  background-color: #000000;
  height: 1px;
  display: inline-block;
  flex-grow: 1;
  margin-left: 12px;
}
.border {
  height: 1px;
  background-color: #000000;
  margin-left : 5.6%;
  margin-right: 0px;
}
@media screen and (min-width: 1024px) {
  .border {
    margin-left : 11%;
  }
  
}

.logouse_text{ /*ロゴ使用許諾のテキスト*/
    margin-right: 20px;
    margin-top: 0px;
}

main ul{ /*禁止事項位置*/
    margin-left: 5.6%;
}
@media only screen and (min-width: 1024px) {
  main ul{
    margin-left: 11%;
  }
}

.prohibit{
  margin-left: 5.6%;
  color:#FF0084;
}
@media only screen and (min-width: 1024px) {
  .prohibit{
    margin-left: 11%;
  }
}
.element_heading{ /*各要素の見出し*/
    margin-left: 5.6%;
    color:#FF0084;
}
@media only screen and (min-width: 1024px) {
  .element_heading{
    margin-left: 11%;
    color: white;
    top: 25px;
  }
}

/*rec系は'ロゴの使用について'行*/
.rectangle30{
    height: 30px;
    width: 4px;
    background-color: #FF0084;
}
@media only screen and (min-width: 1024px) {
  .rectangle30{
    height: 48px;
  }
}

.rechead{
    display: flex;
}

.rechetext{
    margin-top: 0;
    height: 30px;
    padding-left: 12px;
}

.recuse{
    margin-left: 5.6%;
}
@media only screen and (min-width: 1024px) {
  .recuse{
    margin-left: 11%;
  }
}

.symbol_top_text{ /*symbol markの見出しテキスト*/
    margin-left: 5.6%;
}
@media only screen and (min-width: 1024px) {
  .symbol_top_text{
    margin-left: 11%;
  }
}

.splide {
    position: relative;
  }
  .splide img.dl_button {
    opacity: 0;
    position: absolute;
    z-index: 2;
  }
  .splide li.is-active img.dl_button {
    opacity: 1;
  }
  .splide .paginations {
    display: flex !important;
  }
  .splide .pagination {
    margin: 0 7px;
    width: 5px;
    height: 5px;
    background-color: #737373;
  }
  .splide .pagination.is-active {
    background-color: #FF0084;
  }
  .splide .splide_arrow {
    transition: background-position-x 0.3s;
    margin: 0 10px;
    width: 40px;
    height: 40px;
  }
  .splide .splide_arrow svg {
    opacity: 0;
  }
  .splide .splide_arrow.arrow--next {
    background-image: url(/2024/special/splide/arrow_right.svg);

  }

  .splide__slide img{
    opacity: 0; /* 左右のスライドを薄くする */
    transition: .5s; /* ゆっくり */
  }
  .splide__slide.is-visible img {
    opacity: 1; /* 中央のスライドは薄くしない */
    z-index: 1; /* 中央のスライドを一番上にする */
  }

  /* スライド共通のスタイル */
  @media screen and (max-width: 1024px) {
    .splide__slide img{
    opacity: .5; /* 左右のスライドを薄くする */
    transition: .5s;  /*ゆっくり */
  }
  }
  /* アクティブなスライドのスタイル */
  @media screen and (max-width: 1024px) {
    .splide__slide.is-active img {
    opacity: 1; /* 中央のスライドは薄くしない */
    z-index: 1; /* 中央のスライドを一番上にする */
  }
  }  
  .Xheader .splide__slide img{
    opacity: .5; /* 左右のスライドを薄くする */
    transition: .5s; /* ゆっくり */
  }
  .Xheader .splide__slide.is-active img {
    opacity: 1; /* 中央のスライドは薄くしない */
    z-index: 1; /* 中央のスライドを一番上にする */
  }
  .Xheader img:not(.dl_button) {
    width: 100%;
    height: auto;
    margin-bottom: 50px;
  }
  .Xheader .underline img{
    width: auto;
  }

  
  .splide .splide_arrow.arrow--prev {
    background-image: url(/2024/special/splide/arrow_left.svg);
  }
  .wallpapers img.dl_button, .icons img.dl_button {
    transition: transform 0.5s, opacity 0.3s;
  }

  .wallpapers {
    margin: 15px 0 60px;
  }
  .wallpapers img:not(.dl_button) {
    width: 100%;
    height: auto;
    margin-bottom: 50px;
  }
  @media screen and (min-width: 1024px) {
    .wallpapers img:not(.dl_button) {
      width: 100%;
      height: auto;
      margin-bottom: 50px;
    }
  }
  @media only screen and (min-width: 1024px) {
    .wallpapers img.dl_button:hover, .icons img.dl_button:hover {
      transform: translate(50%, -50%) scale(1.1);
    }
  }

  .wallpapers img.dl_button {
    right: 0;
    bottom: 0;
    transform: translate(50%, -50%);
  }

  .icons {
    margin: 15px 0 60px;
  }
  .icons img:not(.dl_button) {
    width: 100%;
    height: auto;
    margin-bottom: 50px;
  }
  .icons img.dl_button {
    right: 12%;
    bottom: 12%;
    transform: translate(50%, -50%);
  }

  .headers {
    margin: 15px 0 60px;
  }
  .header_img {
    position: relative;
  }
  .headers img:not(.dl_button) {
    width: 100%;
    height: auto;
    margin-bottom: 50px;
  }
  .headers img.dl_button {
    right: 0;
    bottom: 30px;
    position: absolute;
  }

  .readme_download{
    text-align: center;
  }
  @media screen and (max-width: 1023px) {
    .readme_download_pc{
      display: none;
    }
  }
  @media screen and (min-width: 1024px) {
    .readme_download_mb{
      display: none;
    }
  }

  .special_title {
    margin-bottom: 20px;
    margin-left: 5.6%;
    margin-right: 20px;
  }
  @media screen and (min-width: 1024px) {
    .special_title {
      margin-left: 11%;
    }
    
  }
  section.logo_download .prev {
    border: #737373 solid 1px;
  }
  .special_logo > img {
    width: 100%;
    height: auto;
    vertical-align: bottom;
  }
  .special_logo{
    width: 77.77%;
    margin: 0 auto;
  }
  .special_logo .logo_description .logo_name {
    transform-origin: left;
    margin: 0px;
    white-space: nowrap;
  }
  .special_logo .logo_description {
    margin: 3px 0 32px;
    display: flex;
    position: relative;
  }
  .special_logo .dl_button {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(50%, -50%);
  }
  .m_JP_8_500{
    font-family: 'Noto Sans JP';
    font-size: 8px;
    font-weight: 500;
  }
  .m_JP_6_500{
    font-family: 'Noto Sans JP';
    font-size: 6px;
    font-weight: 500;
  }
  section.logo_download .symbol_mark_title {
    margin-top: 50px;
  }
  .symbol_mark {
    display: flex;
    justify-content: space-between;
    width: 77.77%;
    margin: 0 auto;
    margin-bottom: 60px;
  }
  .symbol_mark > div .prev {
    width: 100%;
    height: auto;
  }
  .symbol_mark > div .logo_description p {
    transform-origin: left;
  }
  .symbol_mark > div .logo_description {
    position: relative;
  }
  .symbol_mark > div {
    width: calc(50% - 22.5px);
  }
  .symbol_mark > div .logo_description .dl_button {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(50%, -50%);
  }
  .symbol_mark .logo_description .logo_name {
        transform-origin: left;
            margin: 0px;
                white-space: nowrap;
  }
