picture {
  display: block;
	width: 100%;
}

img {
  width: 100%;
  object-fit: contain;
}
.commonSubSection__box {
  position: relative;
	background: rgba(255,255,255,.6);
  border-radius: 6px;
  @media screen and (max-width:768px) {
    border-radius: 8px;
  }
}

.header {
  position: relative;
  z-index: auto;
  pointer-events: none;
}
body:not(.p-top) .header__menuBtn {
  position: fixed;
}
body:not(.p-top) .header__content {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.header__inLine {
	position: relative;
	height:min(calc(40 / var(--vw-min) * 100vw),40px);
	overflow: hidden;
	background:var(--color-yellow);
  @media screen and (max-width:768px) {
    height: calc(24 / var(--vw-min) * 100vw);
  }
}
.header__inLine--bule {
  background: var(--color-blue);
}
.header__deco {
	content:'';
	position: absolute;
	top:0;
	left:0;
  width: min(calc(320 / var(--vw-min) * 100vw),320px);
  height: min(calc(320 / var(--vw-min) * 100vw),320px);
	background:url(../img/live/deco_header.svg) no-repeat center center / contain;
  z-index: -1;
  @media screen and (max-width:768px) {
    width: calc(144 / var(--vw-min) * 100vw);
    height: calc(144 / var(--vw-min) * 100vw);
  }
}
.header__deco--right {
  right:0;
  left: initial;
  transform: rotate(90deg);
}
.header__inLine:before {
	content:'';
	position: absolute;
	left:0;
	right:0;
	top:min(calc(10.5 / var(--vw-min) * 100vw),10.5px);
	height:min(calc(19 / var(--vw-min) * 100vw),19px);
	background:url(../img/common/deco_entext.png) repeat-x 0 0 / auto min(calc(19 / var(--vw-min) * 100vw),19px);
	animation:inLine-text 30s linear infinite reverse;
  @media screen and (max-width:768px) {
    background:url(../img/common/deco_entext.png) repeat-x 0 0 / auto calc(12 / var(--vw-min) * 100vw);
    top: calc(5.5 / var(--vw-min) * 100vw);
    height: calc(12 / var(--vw-min) * 100vw);
  }
}

.commonSubSection__box--color-purple {
  box-shadow: 6px 6px 0 #BFCDFF;
  @media screen and (max-width:768px) {
    box-shadow: 5px 5px 0 #BFCDFF;
  }
}

.commonSubSection__box--color-pink {
  box-shadow: 6px 6px 0 rgba(255,149,201,.5);
}

.commonSubSection__title {
  padding: min(calc(28 / var(--vw-min) * 100vw),28px) 0;
  font-size: min(calc(40 / var(--vw-min) * 100vw),40px);
  letter-spacing: 0.02em;
  line-height: min(calc(48 / var(--vw-min) * 100vw),48px);
  font-weight: 700;
  color: #fff;
  border-radius: 6px 6px 0 0;
  position: relative;
  @media screen and (max-width:768px) {
    padding: calc(9 / var(--vw-min) * 100vw) 0;
    font-size: calc(18 / var(--vw-min) * 100vw);
    line-height: calc(30 / var(--vw-min) * 100vw);
    border-radius: 8px 8px 0 0;
  }
}

.commonSubSection__title:before,
.commonSubSection__title:after {
	content:'';
	position: absolute;
  top: min(calc(8 / var(--vw-min) * 100vw),8px);
  width: min(calc(24 / var(--vw-min) * 100vw),24px);
	height:min(calc(24 / var(--vw-min) * 100vw),24px);
	background:url(../img/live/deco_section_title.svg) no-repeat center center / cover;
  @media screen and (max-width:768px) {
    width: calc(16 / var(--vw-min) * 100vw);
    height: calc(16 / var(--vw-min) * 100vw);
    top: calc(5 / var(--vw-min) * 100vw);
  }
}

.commonSubSection__title:before {
  left: min(calc(8 / var(--vw-min) * 100vw),8px);
  @media screen and (max-width:768px) {
    left: calc(5 / var(--vw-min) * 100vw);
  }
}

.commonSubSection__title:after {
  right: min(calc(8 / var(--vw-min) * 100vw),8px);
  transform: rotate(90deg);
  @media screen and (max-width:768px) {
    right: calc(5 / var(--vw-min) * 100vw);
  }
}

.commonSubSection__title--color-purple {
  background: linear-gradient(180deg, #CFC8FF 0%, #8C8EEF 100%);
  text-shadow: 0 0 min(calc(8 / var(--vw-min) * 100vw),8px) #8373FF;
}

.commonSubSection__title--color-pink {
  background: linear-gradient(180deg, #FFBFDE 0%, #FF95C9 100%);
  text-shadow: 0 0 min(calc(8 / var(--vw-min) * 100vw),8px) #FF5FBD;
}

.commonSubSection__content {
  border-radius: 0 0 6px 6px;
  padding: min(calc(64 / var(--vw-min) * 100vw),64px) min(calc(80 / var(--vw-min) * 100vw),80px) min(calc(80 / var(--vw-min) * 100vw),80px);
  @media screen and (max-width:768px) {
    padding: calc(24 / var(--vw-min) * 100vw) calc(17 / var(--vw-min) * 100vw) calc(32 / var(--vw-min) * 100vw);
    border-radius: 0 0 8px 8px;
  }
}

.commonSubSection__content--color-purple {
  border: 3px solid #8C8EEF;
  border-top: none;
}

.commonSubSection__content--color-pink {
  border: 3px solid #FF95C9;
  border-top: none;
}

.localNav {
  margin-bottom: min(calc(84 / var(--vw-min) * 100vw),84px);
  @media screen and (max-width:768px) {
    margin-bottom: calc(31 / var(--vw-min) * 100vw);
  }
}
.localNav__lists {
  display: flex;
	align-items: center;
  justify-content: space-between;
  gap: min(calc(26 / var(--vw-min) * 100vw),26px);
  @media screen and (max-width:768px) {
    gap: calc(9 / var(--vw-min) * 100vw);
    flex-wrap: wrap;
    justify-content: flex-start;
  }
}
.localNav__lists--vr {
  justify-content: center;
  gap: min(calc(24 / var(--vw-min) * 100vw),24px);
  @media screen and (max-width:768px) {
    gap: calc(9 / var(--vw-min) * 100vw);
    justify-content: flex-start;
  }
}
.localNav__item {
  width: calc((100% - (min(calc(26 / var(--vw-min) * 100vw),26px) * 3)) / 4);
  height:min(calc(52 / var(--vw-min) * 100vw),52px);
  display: flex;
  border-radius: 100px;
  background: var(--color-purple);
  @media screen and (max-width:768px) {
    width: calc((100% - calc(9 / var(--vw-min) * 100vw)) / 2);
    height: calc(40 / var(--vw-min) * 100vw);
  }
}
.localNav__lists--vr .localNav__item {
  width: min(calc(264 / var(--vw-min) * 100vw),264px);
  height: min(calc(52 / var(--vw-min) * 100vw),52px);
  @media screen and (max-width:768px) {
    width: calc((100% - calc(9 / var(--vw-min) * 100vw)) / 2);
    height: calc(40 / var(--vw-min) * 100vw);
  }
}
.localNav__link {
  width: 100%;
  display: flex;
	position: relative;
	justify-content: center;
	align-items: center;
	text-decoration: none;
	color:#fff;
  background: linear-gradient(180deg, #CFC8FF 0%, #8C8EEF 100%);
  border-radius: 100px;
	font-size:min(calc(24 / var(--vw-min) * 100vw),24px);
	line-height:1;
	font-weight: 400;
	transform:translateY(max(calc(-4 / var(--vw-min) * 100vw),-4px));
	transition:all 0.3s ease;
}
.localNav__link:hover {
	transform: translateY(0);
}
.localNav__link:before {
	content:'';
	position: absolute;
	left:min(calc(9 / var(--vw-min) * 100vw),9px);
	bottom:min(calc(6 / var(--vw-min) * 100vw),6px);
	width:min(calc(24 / var(--vw-min) * 100vw),24px);
	height:min(calc(18 / var(--vw-min) * 100vw),18px);
	background:var(--color-purple);
	-webkit-mask:url(../img/common/btn_deco.svg) no-repeat center center / contain;
	mask:url(../img/common/btn_deco.svg) no-repeat center center / contain;
  @media screen and (max-width:768px) {
    width: calc(16 / var(--vw-min) * 100vw);
    height: calc(12 / var(--vw-min) * 100vw);
  }
}
.localNav__link:after {
	content:'';
	position: absolute;
	width:min(calc(12 / var(--vw-min) * 100vw),12px);
	height:min(calc(6 / var(--vw-min) * 100vw),6px);
	right:min(calc(20 / var(--vw-min) * 100vw),20px);
	top:50%;
	margin-top: 0;
	background:url(../img/common/icon_inverted_triangle.svg) no-repeat center center / contain;
  @media screen and (max-width:768px) {
    width: calc(8 / var(--vw-min) * 100vw);
    height: calc(4 / var(--vw-min) * 100vw);
    right: calc(10 / var(--vw-min) * 100vw);
    margin-top: calc(-3 / var(--vw-min) * 100vw);
  }
}
.localNav__link {
  color:#fff;
	font-size:min(calc(16 / var(--vw-min) * 100vw),16px);
	line-height:min(calc(24 / var(--vw-min) * 100vw),24px);
	font-weight: 500;
  @media screen and (max-width:768px) {
    letter-spacing: 0;
    font-size: calc(12 / var(--vw-min) * 100vw);
    line-height: calc(20 / var(--vw-min) * 100vw);
  }
}

.common__deco-pine {
	content:'';
	position: absolute;
	width: min(calc(298 / var(--vw-min) * 100vw),298px);
	height: min(calc(224 / var(--vw-min) * 100vw),224px);
	background:url(../img/live/deco_pine.svg) no-repeat center center / contain;
  @media screen and (max-width:768px) {
    width: calc(158 / var(--vw-min) * 100vw);
    height: calc(120 / var(--vw-min) * 100vw);
  }
}

.deco-mic {
  content:'';
	position: absolute;
  top: max(calc(32 / var(--vw-min) * 100vw),32px);
  right: min(calc(48 / var(--vw-min) * 100vw),48px);
  width: min(calc(106 / var(--vw-min) * 100vw),106px);
  height: min(calc(136 / var(--vw-min) * 100vw),136px);
	background:url(../img/live/deco_blue_mic.png) no-repeat center center / contain;
  @media screen and (max-width:768px) {
    top: calc(9 / var(--vw-min) * 100vw);
    right: calc(19 / var(--vw-min) * 100vw);
    width: calc(62 / var(--vw-min) * 100vw);
    height: calc(80 / var(--vw-min) * 100vw);
  }
}

.deco-nui {
  content:'';
	position: absolute;
  top: max(calc(-57 / var(--vw-min) * 100vw),-57px);
  left: max(calc(39 / var(--vw-min) * 100vw),39px);
  width: min(calc(153 / var(--vw-min) * 100vw),153px);
  height: min(calc(160 / var(--vw-min) * 100vw),160px);
	background:url(../img/live/deco_pink_nui.png) no-repeat center center / contain;
  @media screen and (max-width:768px) {
    top: calc(-24 / var(--vw-min) * 100vw);
    left: calc(18 / var(--vw-min) * 100vw);
    width: calc(76 / var(--vw-min) * 100vw);
    height: calc(80 / var(--vw-min) * 100vw);
  }
}

.deco-music--orange {
  content:'';
	position: absolute;
  top: min(calc(70 / var(--vw-min) * 100vw),70px);
  right: min(calc(104 / var(--vw-min) * 100vw),104px);
  width: min(calc(48 / var(--vw-min) * 100vw),48px);
  height: min(calc(45 / var(--vw-min) * 100vw),45px);
	background:url(../img/live/deco_orange_music.png) no-repeat center center / contain;
  @media screen and (max-width:768px) {
    top: calc(30 / var(--vw-min) * 100vw);
    right: calc(17 / var(--vw-min) * 100vw);
    width: calc(28 / var(--vw-min) * 100vw);
    height: calc(26 / var(--vw-min) * 100vw);
  }
}

.deco-music--purple {
  content:'';
	position: absolute;
  left: min(calc(84 / var(--vw-min) * 100vw),84px);
  top: min(calc(65 / var(--vw-min) * 100vw),65px);
  width: min(calc(50 / var(--vw-min) * 100vw),50px);
  height: min(calc(64 / var(--vw-min) * 100vw),64px);
	background:url(../img/live/deco__purple_music.png) no-repeat center center / contain;
  @media screen and (max-width:768px) {
    top: calc(26 / var(--vw-min) * 100vw);
    left: calc(10 / var(--vw-min) * 100vw);
    width: calc(28 / var(--vw-min) * 100vw);
    height: calc(36 / var(--vw-min) * 100vw);
  }
}

.deco-speaker {
  content:'';
	position: absolute;
  top: max(calc(-9 / var(--vw-min) * 100vw),-9px);
  right: min(calc(60 / var(--vw-min) * 100vw),60px);
  width: min(calc(152 / var(--vw-min) * 100vw),152px);
  height: min(calc(132 / var(--vw-min) * 100vw),132px);
	background:url(../img/live/deco_blue_speaker.png) no-repeat center center / contain;
  @media screen and (max-width:768px) {
    top: calc(-8 / var(--vw-min) * 100vw);
    right: calc(-12 / var(--vw-min) * 100vw);
    width: calc(83 / var(--vw-min) * 100vw);
    height: calc(72 / var(--vw-min) * 100vw);
  }
}

.footer {
  margin-top: min(calc(200 / var(--vw-min) * 100vw), 200px);
  z-index: 2;
  @media screen and (max-width:768px) {
    margin-top: calc(118 / var(--vw-min) * 100vw);
  }
}

@keyframes inLine-text {
	0% {
		background-position: 0 0;
	}
	100% {
		background-position: min(calc(1286 / var(--vw-min) * 100vw),1286px) 0;
	}
}