/* @import url('https://fonts.cdnfonts.com/css/helvetica-neue-55'); */

:root {

  --color-black: #000000;
  --color-hover: #505050;
  --color-white: #ffffff;
  --color-red: #E11A1A;

  --font-family-main:   font-family:
                        "Helvetica Neue",
                        "Helvetica",
                        Arial,
                        sans-serif;

  --title-font-size: 2.3rem;
  --subtitle-font-size: 1.4rem;
  --accent-font-size: 1.1rem;
  --desc-font-size: 1rem;

  --window-border: solid 1px var(--color-black);
  --window-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;

}

html{
  margin: 0;
  padding: 0;
  font-size: clamp(14px, 1.2vw, 18px);
}
*{
  /* cursor: none !important; */
  box-sizing: border-box;
}
body{
  margin: 0;
  padding: 0;

  font-family:
  "Helvetica Neue",
  "Helvetica",
  Arial,
  sans-serif;
}
h1,h2,h3,h4,h5,h6,p,a,li{
  font-family: var(--font-family-main);
  margin: 0;
}
h1,h2,h3,h4,h5,h6{
  font-size: 1rem;
  font-weight: normal;
}
.uppercase{
  text-transform: uppercase;
}
a{
  text-decoration: none;
  cursor: pointer;
  color: var(--color-black);
}
ul{
  margin: 0;
  padding: 0;
}
li{
  list-style: none;
}










/* -------------------------------------------------- */

/* header */

header{
  width: 100vw;
  height: auto;
  padding: 0;
  margin: 0;

  position: relative;
  z-index: 1000;
}
  .header__inner{
    width: 100vw;
    height: auto;
  }
    .default__header{
      position: relative;
      
      width: 100%;
      height: 44px;

      border-bottom: solid 1px var(--color-black);
      border-top: solid 1px var(--color-black);
    }
      .default__header .logo{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);

        display: flex;
        justify-content: center;
        align-items: center;
      }
        .default__header .logo h1,a,img{
          width: auto;
          height: 1rem;
        }
      .default__header__inner{
        width: 100%;
        height: 100%;
        padding: 0 16px;

        display: flex;
        justify-content: end;
      }
        .menu{
          
        }
          .menu .menu__list{
            width: auto;
            height: 100%;

            display: flex;
            align-items: center;
            justify-content: end;
            gap: 2rem;
          }
        .language__selector{
          width: auto;
          height: 100%;
        }
        .language__selector.pc{
          display: block;
        }
        .language__selector.sp{
          display: none;
        }
          .language__selector__inner{
            width: auto;
            height: 100%;

            display: flex;
            align-items: center;
            gap: 5px;
          }
            .language__selector__inner li p{
              font-size: var(--accent-font-size);
              font-weight: 700;
            }
            .language__selector__inner li a{
              font-size: var(--accent-font-size);
              color: var(--color-black);
            }
            .language__selector__inner li a:hover{
              color: var(--color-hover);
            }
    .navigation__header{
      position: relative;

      width: 100%;
      height: 44px;

      border-bottom: solid 1px var(--color-black);
    }
      .navigation__header .social__navigation{
        width: calc(100% - 100px);
        padding-left: 100px;
        height: 44px;
        position: absolute;
        top: 0;
        left: 0;

        display: flex;
        justify-content: center;
        align-items: center;
      }
        .navigation__header .social__navigation .social__list{
          width: 100%;
          height: 44px;
          display: flex;
          align-items: center;
          justify-content: center;
          gap: 2rem;
        }
          .navigation__header .social__navigation .social__list li a{
            font-size: var(--accent-font-size);
            color: var(--color-black);
            text-align: center;
            display: flex;
            flex-direction: column;
            justify-content: center;
          }
            .music__link__wrapper .music__link{
              width: auto;
              height: 44px;
              width: 100px;
              display: flex;
              align-items: center;
              justify-content: center;
            }
              .navigation__header .social__navigation .social__list .music__link__wrapper:hover .pull__down__btn{
                display: flex !important;
              }
              .navigation__header .social__navigation .social__list .music__link__wrapper:hover .music__link{
                padding-top: 1px;
              }
              .navigation__header .social__navigation .social__list .music__link__wrapper .pull__down__btn{
                position: relative;
                z-index: 400;

                height: 88px;
                display: none;
                /* display: flex; */
                flex-direction: column;

                margin-bottom: -87px;
              }
              .navigation__header .social__navigation .social__list .music__link__wrapper .pull__down__btn__item{
                position: relative;
                z-index: 400;


                height: 44px;
                width: 100px;
                display: flex;
                align-items: center;
                justify-content: center;
                background-color: var(--color-white);

                color: var(--color-black);
              }
      .navigation__header__inner{
        width: 100%;
        height: 100%;
        padding: 0 16px;

        display: flex;
        justify-content: end;
      }
      .navigation__header .header__navigation{
        width: 100%;
        height: 100%;

        padding: 0 16px;
      }
      .navigation__header.sp{
        display: none;
      }
        .navigation__header .header__navigation ul{
          height: 100%;
          display: flex;
          justify-content: space-between;
          align-items: center;
        }


/* -------------------------------------------------- */

/* footer */

footer{
  width: 100vw;
  height: 44px;
  padding: 0;
  margin: 1rem 0;
}
  .footer__inner{
    width: 100vw;
    height: auto;
  }
    .footer__content{
      width: 100vw;
      height: 44px;
      padding: 0 1.5rem;

      display: flex;
      justify-content: space-between;
      align-items: center;

      border-top: var(--window-border);
      border-bottom: var(--window-border);
    }
      .footer__content ul{
        width: auto;
        height: 100%;

        display: flex;
        align-items: center;
        gap: 1.5rem;
      }
        .footer__content ul li a{
          display: flex;
          align-items: center;
          gap: 0.5rem;
        }
          .footer__content ul li a p{
            text-transform: uppercase;
            font-size: var(--accent-font-size);
          }















@media screen and (max-width: 765px){
  
/* -------------------------------------------------- */

/* header */
  .navigation__header .social__navigation .social__list {
    font-size: 0.9rem;
    gap: 0.7rem;
  }
  .navigation__header .social__navigation .social__list li a{
    font-size: 0.9rem;
  }
  .music__link__wrapper .music__link{
    width: 60px;
  }
  .navigation__header .social__navigation .social__list .music__link__wrapper .pull__down__btn__item{
    width: 60px;
  }
  .menu{
    display: none;
  }
  .navigation__header.sp{
    display: block;
  }

  .language__selector.pc{
    display: none;
  }
  .language__selector.sp{
    display: block;
  }

/* -------------------------------------------------- */

/* footer */

  .footer__content{
    width: 100%;
    display: flex;
    justify-content: center;
  }
  .footer__content .copyright{
    display: none;
  }

}