@charset "UTF-8";
/*라이브룸 퍼센트 5인 UI 사이드바온오프 통합*/
@media only screen and (min-width: 1824px) and (max-width: 1871px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.96%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.64%;
  }
}

@media only screen and (min-width: 1776px) and (max-width: 1823px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.95%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.62%;
  }
}

@media only screen and (min-width: 1734px) and (max-width: 1775px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.94%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.60%;
  }
}

@media only screen and (min-width: 1692px) and (max-width: 1733px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.93%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.58%;
  }
}

@media only screen and (min-width: 1650px) and (max-width: 1691px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.92%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.56%;
  }
}

@media only screen and (min-width: 1614px) and (max-width: 1649px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.91%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.54%;
  }
}

@media only screen and (min-width: 1578px) and (max-width: 1613px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.9%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.52%;
  }
}

@media only screen and (min-width: 1542px) and (max-width: 1577px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.89%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.5%;
  }
}

@media only screen and (min-width: 1509px) and (max-width: 1541px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.88%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.48%;
  }
}

@media only screen and (min-width: 1476px) and (max-width: 1508px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.87%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.46%;
  }
}

@media only screen and (min-width: 1445px) and (max-width: 1475px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.86%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.44%;
  }
}

@media only screen and (min-width: 1419px) and (max-width: 1444px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.85%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.42%;
  }
}

@media only screen and (min-width: 1389px) and (max-width: 1418px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.84%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.4%;
  }
}

@media only screen and (min-width: 1362px) and (max-width: 1388px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.83%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.38%;
  }
}

@media only screen and (min-width: 1338px) and (max-width: 1361px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.82%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.36%;
  }
}

@media only screen and (min-width: 1311px) and (max-width: 1337px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.81%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.34%;
  }
}

@media only screen and (min-width: 1290px) and (max-width: 1310px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.8%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.32%;
  }
}

@media only screen and (min-width: 1266px) and (max-width: 1289px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.79%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.3%;
  }
}

@media only screen and (min-width: 1242px) and (max-width: 1265px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.78%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.28%;
  }
}

@media only screen and (min-width: 1221px) and (max-width: 1241px) {
  .videoAreaWrap .videoArea.unit5 .videoUnit {
    width: 32.77%;
  }
  .videoAreaWrap.sideOn .unit5 .videoUnit {
    width: 32.26%;
  }
}

/*라이브룸 퍼센트 6인*/
@media only screen and (min-width: 1386px) and (max-width: 1646px) {
  .videoAreaWrap .videoArea.unit6 .videoUnit {
    width: calc(33.21% - 5px);
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1385px) {
  .videoAreaWrap .videoArea.unit6 .videoUnit {
    width: calc(33.19% - 5px);
  }
  .videoAreaWrap.sideOn .unit6 .videoUnit {
    width: 32.54%;
  }
}

/*라이브룸 퍼센트 6인 사이드바 열렸을 때*/
@media only screen and (min-width: 1773px) and (max-width: 1824px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.62%;
  }
}

@media only screen and (min-width: 1724px) and (max-width: 1772px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.6%;
  }
}

@media only screen and (min-width: 1678px) and (max-width: 1723px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.58%;
  }
}

@media only screen and (min-width: 1647px) and (max-width: 1677px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.56%;
  }
}

@media only screen and (min-width: 1594px) and (max-width: 1646px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.54%;
  }
}

@media only screen and (min-width: 1555px) and (max-width: 1593px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.52%;
  }
}

@media only screen and (min-width: 1517px) and (max-width: 1554px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.5%;
  }
}

@media only screen and (min-width: 1482px) and (max-width: 1516px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.48%;
  }
}

@media only screen and (min-width: 1448px) and (max-width: 1483px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.46%;
  }
}

@media only screen and (min-width: 1415px) and (max-width: 1447px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.44%;
  }
}

@media only screen and (min-width: 1384px) and (max-width: 1414px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.42%;
  }
}

@media only screen and (min-width: 1355px) and (max-width: 1383px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.4%;
  }
}

@media only screen and (min-width: 1326px) and (max-width: 1354px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.38%;
  }
}

@media only screen and (min-width: 1299px) and (max-width: 1325px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.36%;
  }
}

@media only screen and (min-width: 1273px) and (max-width: 1298px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.34%;
  }
}

@media only screen and (min-width: 1248px) and (max-width: 1272px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.32%;
  }
}

@media only screen and (min-width: 1224px) and (max-width: 1247px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.3%;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1223px) {
  .videoAreaWrap.sideOn .videoArea.unit6 .videoUnit {
    width: 32.28%;
  }
}

/*라이브룸 퍼센트 7인*/
@media only screen and (min-width: 1783px) and (max-width: 1865px) {
  .videoAreaWrap .videoArea.unit7 .videoUnit {
    width: 24.57%;
  }
}

@media only screen and (min-width: 1705px) and (max-width: 1782px) {
  .videoAreaWrap .videoArea.unit7 .videoUnit {
    width: 24.55%;
  }
}

@media only screen and (min-width: 1634px) and (max-width: 1704px) {
  .videoAreaWrap .videoArea.unit7 .videoUnit {
    width: 24.53%;
  }
}

@media only screen and (min-width: 1569px) and (max-width: 1633px) {
  .videoAreaWrap .videoArea.unit7 .videoUnit {
    width: 24.51%;
  }
}

@media only screen and (min-width: 1509px) and (max-width: 1568px) {
  .videoAreaWrap .videoArea.unit7 .videoUnit {
    width: 24.49%;
  }
}

@media only screen and (min-width: 1454px) and (max-width: 1508px) {
  .videoAreaWrap .videoArea.unit7 .videoUnit {
    width: 24.47%;
  }
}

@media only screen and (min-width: 1402px) and (max-width: 1453px) {
  .videoAreaWrap .videoArea.unit7 .videoUnit {
    width: 24.45%;
  }
}

@media only screen and (min-width: 1355px) and (max-width: 1401px) {
  .videoAreaWrap .videoArea.unit7 .videoUnit {
    width: 24.43%;
  }
}

@media only screen and (min-width: 1310px) and (max-width: 1354px) {
  .videoAreaWrap .videoArea.unit7 .videoUnit {
    width: 24.41%;
  }
}

@media only screen and (min-width: 1269px) and (max-width: 1309px) {
  .videoAreaWrap .videoArea.unit7 .videoUnit {
    width: 24.39%;
  }
}

@media only screen and (min-width: 1229px) and (max-width: 1268px) {
  .videoAreaWrap .videoArea.unit7 .videoUnit {
    width: 24.37%;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1228px) {
  .videoAreaWrap .videoArea.unit7 .videoUnit {
    width: 24.35%;
  }
}

/*라이브룸 퍼센트 7인 사이드바 열렸을 때*/
@media only screen and (min-width: 1784px) and (max-width: 1918px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.45%;
  }
}

@media only screen and (min-width: 1736px) and (max-width: 1783px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.43%;
  }
}

@media only screen and (min-width: 1691px) and (max-width: 1735px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.41%;
  }
}

@media only screen and (min-width: 1649px) and (max-width: 1690px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.39%;
  }
}

@media only screen and (min-width: 1610px) and (max-width: 1648px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.37%;
  }
}

@media only screen and (min-width: 1574px) and (max-width: 1609px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.35%;
  }
}

@media only screen and (min-width: 1540px) and (max-width: 1573px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.33%;
  }
}

@media only screen and (min-width: 1507px) and (max-width: 1539px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.31%;
  }
}

@media only screen and (min-width: 1478px) and (max-width: 1506px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.29%;
  }
}

@media only screen and (min-width: 1448px) and (max-width: 1477px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.27%;
  }
}

@media only screen and (min-width: 1420px) and (max-width: 1447px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.25%;
  }
}

@media only screen and (min-width: 1394px) and (max-width: 1419px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.23%;
  }
}

@media only screen and (min-width: 1370px) and (max-width: 1393px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.21%;
  }
}

@media only screen and (min-width: 1346px) and (max-width: 1369px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.19%;
  }
}

@media only screen and (min-width: 1324px) and (max-width: 1345px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.17%;
  }
}

@media only screen and (min-width: 1283px) and (max-width: 1323px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.13%;
  }
}

@media only screen and (min-width: 1254px) and (max-width: 1282px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.1%;
  }
}

@media only screen and (min-width: 1227px) and (max-width: 1253px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.07%;
  }
}

@media only screen and (min-width: 1201px) and (max-width: 1226px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.04%;
  }
}

@media only screen and (min-width: 1100px) and (max-width: 1200px) {
  .videoAreaWrap.sideOn .videoArea.unit7 .videoUnit {
    width: 24.0%;
  }
}

/*라이브룸 퍼센트 8인*/
@media only screen and (min-width: 1585px) and (max-width: 1743px) {
  .videoAreaWrap .videoArea.unit8 .videoUnit {
    width: calc(24.839% - 5px);
  }
}

@media only screen and (min-width: 1437px) and (max-width: 1584px) {
  .videoAreaWrap .videoArea.unit8 .videoUnit {
    width: calc(24.822% - 5px);
  }
}

@media only screen and (min-width: 1303px) and (max-width: 1436px) {
  .videoAreaWrap .videoArea.unit8 .videoUnit {
    width: calc(24.803% - 5px);
  }
}

@media only screen and (min-width: 1186px) and (max-width: 1302px) {
  .videoAreaWrap .videoArea.unit8 .videoUnit {
    width: calc(24.783% - 5px);
  }
}

/*라이브룸 퍼센트 8인 사이드바 열렸을 때*/
@media only screen and (min-width: 1745px) and (max-width: 1826px) {
  .videoAreaWrap.sideOn .videoArea.unit8 .videoUnit {
    width: calc(24.77% - 5px);
  }
}

@media only screen and (min-width: 1437px) and (max-width: 1744px) {
  .videoAreaWrap.sideOn .videoArea.unit8 .videoUnit {
    width: calc(24.755% - 5px);
  }
}

@media only screen and (min-width: 1309px) and (max-width: 1436px) {
  .videoAreaWrap.sideOn .videoArea.unit8 .videoUnit {
    width: calc(24.725% - 5px);
  }
}

@media only screen and (min-width: 1225px) and (max-width: 1309px) {
  .videoAreaWrap.sideOn .videoArea.unit8 .videoUnit {
    width: calc(24.69% - 5px);
  }
}

@media only screen and (min-width: 1100px) and (max-width: 1224px) {
  .videoAreaWrap.sideOn .videoArea.unit8 .videoUnit {
    width: calc(24.59% - 5px);
  }
}

/*태블릿*/
/*모바일*/
