/* 共通 */
*{
    box-sizing: border-box;
    margin: 0;
}
body .mainContents {
    font-family: "Noto Sans JP","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック体", YuGothic, "游ゴシック Medium", "YuGothic M", "メイリオ", Meiryo, sans-serif!important;
    overflow: hidden;
    color: #000;
}
.mainContents .mainContentsIn {
    margin: 0;
}
.mainContents section {
    margin: 0;
    min-width: auto;
    max-width: none;
}
.headerArea img, .footerArea img, .mainContents img {
    vertical-align: top;
}
img {
    height: auto;
    max-width: 100%;
    vertical-align: middle;
}
.show {
    opacity: 1 !important;
}
p{
    margin: 0;
}
p a{
    color: #0099FF!important;
    text-decoration: underline;
}
a:hover{
    opacity: 0.5;
    text-decoration: none;
}
.sectionInner {
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
}
@media (max-width: 768px){
    .sectionInner {
        max-width: 89.6vw;
        width: 100%;
        margin: 0 auto;
    }
}
/* /---------- */


/* header,footer */
@media(min-width: 769px) {
    .mainContents .sp {
        display: none !important;
    }
    .pc-hide {
        display: none !important;
    }
    .pagefooter_totop {
        transition: all 0.5s;
        opacity: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        justify-content: center;
        align-items: center;
        position: fixed;
        right: 10px;
        bottom: 25px;
        background: #0099ff;
        height: 45px;
        width: 45px;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        border-radius: 50%;
        z-index: 1001;
    }
    .pagefooter_totop a {
        display: block;
        width: 100%;
        height: 100%;
        text-indent: -999em;
    }
    .pagefooter_totop img {
        width: 16px;
        height: 9px;
        margin-bottom: 2px;
        vertical-align: baseline;
        position: absolute;
        top: 48%;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
    }
    .mainContents img {
        max-width: 100%;
    }
    .pageHeader {
        border-bottom: 1px solid #CCCCCC !important;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .pageHeader h1 {
        padding: 18px 22px;
        margin: 0 !important;
    }
    .pageHeader h1 img {
        width: 110px;
        height: auto;
    }
    .pageHeader .sns {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-right: 20px;
    }
    .pagefooter {
        padding: 11px 20px 110px !important;
        display: -webkit-box !important;
        display: -webkit-flex !important;
        display: -ms-flexbox !important;
        display: flex !important;
        justify-content: space-between !important;
        -webkit-justify-content: space-between !important;
        flex-wrap: nowrap !important;
        -webkit-flex-wrap: nowrap !important;
    }
    .pagefooter_logo {
        flex-basis: 135px;
        -webkit-flex-basis: 135px;
        max-width: 135px;
        margin: 0 !important;
    }
    .pagefooter_logo img {
        width: 110px;
        height: auto;
    }
    .pagefooter_nav {
        flex: 1;
        font-size: 13px;
    }
    .pagefooter_nav ul {
        padding: 15px 0 0;
        margin: 0 !important;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        justify-content: flex-start;
        -webkit-justify-content: flex-start;
        flex-wrap: nowrap;
        -webkit-flex-wrap: nowrap;
    }
    .pagefooter_nav li {
        margin-top: -2px;
        border-left: 1px solid #333333;
        padding: 0 20px;
    }

    .pagefooter_nav li:first-child {
        border: none;
    }
    .pagefooter_nav a {
        color: #333333;
        text-decoration: none;
    }
    .pagefooter small {
        padding-top: 15px;
        font-size: 13px;
    }
}
@media (max-width: 768px){
    .pc {
        display: none !important;
    }
    .pageHeader {
        border-bottom: 1px solid #CCCCCC;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .pageHeader h1 {
        padding: 18px 22px;
        margin: 0 !important;
    }
    .pageHeader h1 img {
        width: 110px;
        height: auto;
    }
    .pageHeader .sns {
        display: flex;
        align-items: center;
        gap: 2.66vw;
        margin-right: 5.33vw;
    }

    .pagefooter {
        /* with button */
        /* padding-bottom: 18vw; */

        /* without button */
        padding-bottom: 44vw;
    }
    .pagefooter_logo {
        display: none;
    }
    .pagefooter_totop a {
        margin-top: 20px;
        background: url('../img/footer_btn01-sp@2x.png?1536157024') center center no-repeat;
        background-size: 58px 35px;
        width: 58px;
        height: 35px;
        text-indent: -9999px;
        display: inline-block;
        width: 100%;
        height: 100px;
    }
    .pagefooter_nav li {
        border-top: 1px solid #CCCCCC;
    }
    .pagefooter_nav a {
        display: block;
        text-align: center;
        color: #333333;
        text-decoration: none;
        padding: 23px 0;
    }
    .pagefooter small {
        border-top: 1px solid #CCCCCC;
        display: block;
        text-align: center;
        padding: 15px;
        font-size: 13px;
    }
}
/* /---------- */


/* #kvArea */
#kvArea {
    text-align: center;
    background: #f0f0f0;
}
#kvArea img{
    width: 100vw;
}

@media (max-width: 768px){

}
/* /---------- */


/* #mainArea */
.schedule-img{
    margin-top: 40px;
}
.banner-parent{
    position: relative;
}
.sectionInner .banner-parent .banner {
  position: absolute;
  left: 50%; /* 親要素の中心に配置 */
  transform: translateX(-50%); /* 自身の幅の半分だけ左にずらして中央揃え */
  top: 0;
  background-color: #56F5D1;
  margin: 60px auto;
  padding: 30px 0; 
  width: 180vw; 
}
.banner .joinButton{
    display: flex;
    flex-wrap: wrap;
}
@media (max-width: 768px) { /* 768px以下の場合に適用されるメディアクエリ */
    .sectionInner .banner-parent .banner {
        padding: 10px 0;
        height: 50vw;
    }
  .banner .joinButton {
    flex-direction: column; /* ボタンを縦並びにする */
    align-items: center; /* 縦並びになったボタン自体を中央揃えにする */
}
}
#mainArea {
    background: linear-gradient(to bottom, #7EFEC0 0%, #fff 50%,#A5FE90 100% );
    padding: 100px 0 141px;
    text-align: center;
}
#mainArea .textOverview {
    font-size: 20px;
    line-height: 2.2;
    font-weight: bold;
    margin: 50px auto 0;
    position: relative;
}
#mainArea .textOverview.close{
	height: auto;
	overflow: unset;
}
#mainArea .textOverview .js-hide-pc {
    display: none;
}
#mainArea .textOverview .moreBtn {
    background: linear-gradient(rgba(251, 245, 70,0.5) 0%, rgba(251, 245, 70,0.9) 100%);
    width: 100%;
    padding: 0;
    text-align: center;
    position: absolute;
    bottom: -13px;
	left: 0;
	transition: all 0.5s ease-in;
}
#mainArea .textOverview.close .moreBtn {
    background: none;
}
.moreBtn span{
    background: #fff;
    color: #000;
    border: 1px solid #BDBDBD;
    font-size: 18px;
    font-weight: bold;
    max-width: 320px;
    width: 100%;
    min-height: 60px;
    margin: 16px auto 0;
    border-radius: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    cursor: pointer;
}
.moreBtn span::before{
    content: "";
    width: 20px;
    height: 2px;
    background: #000;
    position: absolute;
    top: 50%;
    right: 25px;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 1;
}
.moreBtn span::after{
    content: "";
    width: 20px;
    height: 2px;
    background: #000;
    position: absolute;
    top: 50%;
    right: 25px;
    -webkit-transform: translate(-50%, -50%) rotate(-90deg);
    -ms-transform: translate(-50%, -50%) rotate(-90deg);
    transform: translate(-50%, -50%) rotate(-90deg);
    transition: all .5s;
    z-index: 1;
}
.moreBtn span.active::after{
    -webkit-transform: translate(-50%, -50%) rotate(0deg);
    -ms-transform: translate(-50%, -50%) rotate(0deg);
    transform: translate(-50%, -50%) rotate(0deg);
}

#mainArea .sectionBlock {
    margin: 70px auto 0;
}
#mainArea .sectionBlock a {
    color: #0099FF;
    text-decoration: underline;
}
#mainArea .sectionBlock.js-hide {
    display: none;
}
#mainArea .sectionBlock h4 {
    color: #fff;
    background: #D6337D;
    border: 2px solid #7A0036;
    font-size: 18px;
    font-weight: bold;
    line-height: normal;
    width: 100%;
    min-height: 53px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 35px;
}
#mainArea .sectionBlock .dayBox:not(:first-child) {
    margin-top: 35px;
}
#mainArea .sectionBlock .dayBox dl {
    font-size: 16px;
    line-height: 1.8;
    font-weight: bold;
}
#mainArea .sectionBlock .dayBox dl dd {
    padding-top: 20px;
    margin-top: 10px;
    border-top: 2px solid #000;
}
#mainArea .sectionBlock .dayBox .annotationList {
    font-size: 14px;
    line-height: 2;
    font-weight: 500;
    margin-top: 10px;
}
#mainArea .sectionBlock .dayBox .annotationList li:not(:last-child) {
    margin-bottom: 25px;
}
#mainArea .sectionBlock .closeBtn {
    background: #fff;
    color: #000;
    border: 1px solid #BDBDBD;
    font-size: 18px;
    font-weight: bold;
    max-width: 320px;
    width: 100%;
    min-height: 60px;
    margin: 50px auto 0;
    border-radius: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    cursor: pointer;
}
#mainArea .sectionBlock .closeBtn::before{
    content: "";
    width: 20px;
    height: 2px;
    background: #000;
    position: absolute;
    top: 50%;
    right: 25px;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 1;
}
#mainArea .sectionBlock .closeBtn::after{
    content: "";
    width: 20px;
    height: 2px;
    background: #000;
    position: absolute;
    top: 50%;
    right: 25px;
    -webkit-transform: translate(-50%, -50%) rotate(-90deg);
    -ms-transform: translate(-50%, -50%) rotate(-90deg);
    transform: translate(-50%, -50%) rotate(-90deg);
    transition: all .5s;
    z-index: 1;
}
#mainArea .sectionBlock .closeBtn.active::after{
    -webkit-transform: translate(-50%, -50%) rotate(0deg);
    -ms-transform: translate(-50%, -50%) rotate(0deg);
    transform: translate(-50%, -50%) rotate(0deg);
}

#mainArea .sectionBlock ul.flex {
    display: flex;
    justify-content: center;
    margin: 90px 30px 40px;
}
#mainArea .sectionBlock ul.flex li.flexItem {
    width: calc(100%/2);
    position: relative;
}
#mainArea .sectionBlock ul.flex li.flexItem:not(:last-child) {
    border-right: 2px dashed #000;
    padding-right: 30px;
}
#mainArea .sectionBlock ul.flex li.flexItem:last-child {
    padding-left: 30px;
}
#mainArea .sectionBlock ul.flex li.flexItem h5 {
    display: flex;
    align-items: center;
    justify-content: left;
    font-size: 16px;
    line-height: 1.8;
    font-weight: bold;
}
#mainArea .sectionBlock ul.flex li.flexItem h5 span {
    background: #D6337D;
    color: #fff;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin-right: 14px;
}
#mainArea .sectionBlock ul.flex li.flexItem ul.list {
    font-size: 16px;
    font-weight: bold;
    margin: 16px auto 0;
    text-align: left;
    max-width: max-content;
}
#mainArea .sectionBlock ul.flex li.flexItem ul.list li {
    line-height: 1.8;
}
#mainArea .sectionBlock ul.flex li.flexItem ul.list li.listLarge{
    font-size: 20px;
    line-height: 1.26;
    text-align: center;
}
#mainArea .sectionBlock ul.flex li.flexItem ul.list li span {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.8;
    display: block;
}
#mainArea .sectionBlock ul.flex li.flexItem ul.list li span:first-child{
    margin-top: 15px;
}
#mainArea .sectionBlock .textLarge {
    font-size: 20px;
    line-height: 1.44;
    font-weight: bold;
    margin-top: 35px;
}
#mainArea .sectionBlock .textLarge span {
    color: #F40538;
}

#mainArea .watchBlock table {
    margin-top: 60px;
    border-collapse: separate;
    border-spacing: 5px 10px;
    width: 100%;
    text-align: center;
}
#mainArea .watchBlock table thead th {
    background: #F7659D;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.8;
    text-align: center;
    padding: 13px;
    border:#000 2px solid;
    border-radius: 20px 0 0 0;
}
#mainArea .watchBlock table thead th.spoox{
    background: #1DECCF;
    color: #000;
    border-radius: 0 20px 0 0 ;
}
#mainArea .watchBlock table thead th:nth-child(1){
    background: transparent;
}
#mainArea .watchBlock table thead th span.logo {
    display: block;
    margin-bottom: 7px;
}
#mainArea .watchBlock table tbody td {
    background: #FFE1EC;
    color: #000;
    text-align: center;
    width: calc(100%/3);
    height: 80px;
    padding: 12px;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.75;
    border: solid 2px #000;
}
#mainArea .watchBlock table tbody td.spoox{
    background-color: #fff;
    color: #000;
}
#mainArea .watchBlock table tbody td:nth-child(1) {
    background: #54F5D5;
    color: #000;
    font-size: 16px;
    font-weight: bold;
    line-height: normal;
    border: solid 2px #000;
}
#mainArea .watchBlock table tbody td:nth-child(1) span {
    font-size: 12px;
    font-weight: 400;
}
#mainArea .watchBlock table tbody td span.icon {
    display: block;
    margin-bottom: 4px;
}
#mainArea .watchBlock table tbody td p.textRed {
    color: #F40538;
    font-weight: bold;
}
#mainArea .watchBlock table tbody td p.textRed span {
    font-size: 26px;
    line-height: 0.8;
}
#mainArea .watchBlock table tbody td p.textBold {
    font-weight: bold;
    line-height: 1.6;
}
#mainArea .watchBlock table tbody td p.textBold + p.textBold {
    margin-top: 4px;
}
#mainArea .watchBlock table tbody td p.textBold span {
    font-size: 18px;
    line-height: 1.16;
}
#mainArea .watchBlock table tbody td p.textSmall {
    line-height: 1.5;
    margin-top: 8px;
}
#mainArea .watchBlock table tbody td p.textLarge {
    font-size: 14px;
    line-height: 1.5;
    font-weight: bold;
    margin-top: 0;
}

#mainArea .watchBlock .tabList {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 8px;
    margin-top: 60px;
}
#mainArea .watchBlock .tabList li {
    width: calc(100%/2);
    text-align: center;
    border-radius: 4px;
    background: #BDBDBD;
    color: #575757;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.8;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
#mainArea .watchBlock .tabList li.active{
    background: #D6337D;
    color: #fff;
    position: relative;
    cursor: pointer;
    padding: 13px 11px;
}
#mainArea .watchBlock .tabList li:nth-child(2) {
    padding: 8px;
}
#mainArea .watchBlock .tabList li.active:nth-child(2) {
    background-color: #1DECCF;
    color: #000;
    padding: 11px;
}
#mainArea .watchBlock .tabList li.active::before {
    content: "";
    position: absolute;
    bottom: -12px;
    right: 0;
    left: 0;
    margin: auto;
    width: 0;
    height: 0;
    border-style: solid;
    border-right: 17px solid transparent;
    border-left: 17px solid transparent;
    border-top: 14px solid #D6337D;
    border-bottom: 0;
    cursor: inherit;
}
#mainArea .watchBlock .tabList li.spoox.active::before{
    border-top: 14px solid #1DECCF;
}
#mainArea .watchBlock .tabList li:nth-child(2) img{
    width: 100px !important;
}
#mainArea .watchBlock .tabContents {
    background: #D5FEF4;
    padding: 40px;
    display: none;
}
#mainArea .watchBlock .tabContents.active {
    display: block;
}
#mainArea .watchBlock .tabContents dl.stepBox {
    background: #fff;
    border: 1px solid #D6337D;
    width: 100%;
    padding: 20px;
    position: relative;
    border-radius: 20px;
}
#mainArea .watchBlock .tabContents.spoox dl.stepBox {
    border: 1px solid #1DECCF;
}
#mainArea .watchBlock .tabContents dl.stepBox:not(:first-child) {
    margin-top: 42px;
}
#mainArea .watchBlock .tabContents dl.stepBox dt {
    background-color: #FF69B4; /* ピンク色（少し濃いめのピンク） */
    color: #ffffff; /* テキストの色を白に */
    font-weight: bold; /* 太字 */
    text-align: center; /* テキストを中央揃え */
    padding: 10px 0; /* 上下の余白 */
    margin: -20px -20px 0;
    border-radius: 20px 20px 0 0;
}
#mainArea .watchBlock .tabContents.spoox dl.stepBox dt{
    background-color: #1DECCF;
    color: #000;
}
#mainArea .watchBlock .tabContents dl.stepBox dd {
    font-size: 16px;
    line-height: 400;
    line-height: 1.8;
    margin-top: 15px;
}
#mainArea .watchBlock .tabContents dl.stepBox:not(:first-child):before {
    content: "";
    position: absolute;
    top: -30.5px;
    left: 0;
    right: 0;
    margin: auto;
    width: 0;
    height: 0;
    border-style: solid;
    border-right: 29px solid transparent;
    border-left: 29px solid transparent;
    border-top: 22px solid #D6337D;
    border-bottom: 0;
}
#mainArea .watchBlock .tabContents .flexApp {
    background: #F2FAFF;
    border: 1px solid #0099FF;
    border-radius: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 9px 24px 9px 13px;
    margin-top: 20px;
}
#mainArea .watchBlock .tabContents .flexApp .textBox {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 3px;
}
#mainArea .watchBlock .tabContents .flexApp .textBox .text {
    font-size: 16px;
    font-weight: bold;
    line-height: 1.6;
    text-align: left;
}
#mainArea .watchBlock .tabContents .flexApp .btnBox {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}
#mainArea .watchBlock .tabContents .notesList {
    margin-top: 16px;
    text-align: left;
}
#mainArea .watchBlock .tabContents .notesList li {
    font-size: 12px;
    line-height: 1.8;
}
#mainArea .watchBlock .tabContents .pointApp {
    padding-top: 32px;
    padding-bottom: 10px;
    margin-top: 32px;
    border-top: 2px dotted #000000;
}
#mainArea .watchBlock .tabContents .pointApp .textHead {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 37px;
}
#mainArea .watchBlock .tabContents .pointApp .flexPoint {
    display: flex;
    gap: 20px;
}
#mainArea .watchBlock .tabContents .pointApp .flexPoint .flexItem {
    position: relative;
    background: #F2FAFF;
    border: 1px solid #0099FF;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: calc(100%/2);
    min-height: 149px;
    font-weight: bold;
    padding: 33px 25px 25px;
}
#mainArea .watchBlock .tabContents .pointApp .flexPoint .flexItem span.textStep {
    background: #0099FF;
    color: #fff;
    border-radius: 20px;
    font-size: 16px;
    min-width: 120px;
    padding: 6px;
    margin: 0 auto;
    position: absolute;
    top: -17px;
}
#mainArea .watchBlock .tabContents .pointApp .flexPoint .flexItem .text {
    font-size: 18px;
    line-height: 1.8;
}
#mainArea .watchBlock .tabContents .pointApp .flexPoint .flexItem .text span {
    color: #F40538;
}

#mainArea .annotationBlock {
    font-size: 14px;
    font-weight: 500;
    line-height: 2;
    text-align: left;
    border: #000 solid 2px;
    padding: 10px 35px 35px;
}
.artist-images {
  display: flex; 
  flex-wrap: wrap; 
  gap: 15px; 
  justify-content: center; 
}

.artist-images img {
  flex: 0 0 calc(33.33% - 10px);
  max-width: calc(33.33% - 10px);
  height: auto;
  box-sizing: border-box;
}
.artist-grid {
  display: grid; 
  grid-template-columns: repeat(3, 1fr); 
  gap: 15px; 
  justify-items: center; 
  align-items: center; 
}

.artist-grid .full-width-image {
  grid-column: span 2; 
  width: 100%; 
  height: auto; 
}


@media (max-width: 768px){
    #mainArea {
        padding: 18.66vw 0 32vw;
    }
    #mainArea .textOverview {
        font-size: 4.8vw;
        margin: 12vw auto 0;
    }
    #mainArea .textOverview.close{
        height: auto;
        overflow: unset;
    }
    #mainArea .textOverview .js-hide-sp {
        display: none;
    }
    #mainArea .textOverview .moreBtn {
        background: linear-gradient(rgba(251, 245, 70,0.5) 0%, rgba(251, 245, 70,0.9) 100%);
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 2.54vw;
        left: 0;
        transition: all 0.5s ease-in;
    }
    .artist-images img {
        flex: 0 0 calc(50% - 7.5px); 
        max-width: calc(50% - 7.5px);
    } 
    .artist-grid {
        grid-template-columns: repeat(2, 1fr); 
    }
    .artist-grid img {
    order: unset;  
   }

   .artist-grid img[src*="the boys.png"] { 
     order: 2; 
   }
  
  .artist-grid img[src*="txt.png"] { 
    grid-column: span 2; 
    order: 1; 
  }
  /* .artist-grid .full-width-image{
    width: 100%;
  } */
    .moreBtn span{
        border: 0.26vw solid #BDBDBD;
        font-size: 4.26vw;
        max-width: none;
        min-height: 17.59vw;
        margin: 6.66vw auto 0;
        border-radius: 9.33vw;
    }
    .moreBtn span::before{
        content: "";
        width: 5.33vw;
        height: 0.53vw;
        background: #000;
        position: absolute;
        top: 50%;
        right: 6.66vw;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        z-index: 1;
    }
    .moreBtn span::after{
        content: "";
        width: 5.33vw;
        height: 0.53vw;
        background: #000;
        position: absolute;
        top: 50%;
        right: 6.66vw;
        -webkit-transform: translate(-50%, -50%) rotate(-90deg);
        -ms-transform: translate(-50%, -50%) rotate(-90deg);
        transform: translate(-50%, -50%) rotate(-90deg);
        transition: all .5s;
        z-index: 1;
    }
    .moreBtn span.active::after{
        -webkit-transform: translate(-50%, -50%) rotate(0deg);
        -ms-transform: translate(-50%, -50%) rotate(0deg);
        transform: translate(-50%, -50%) rotate(0deg);
    }

    #mainArea .sectionBlock {
        margin: 16vw auto 0;
    }
    #mainArea .sectionBlock h4 {
        border: 0.53vw solid #7A0036;
        font-size: 4.8vw;
        min-height: 14.13vw;
        margin: 0 auto 9.33vw;
    }
    #mainArea .sectionBlock .dayBox:not(:first-child) {
        margin-top: 9.33vw;
    }
    #mainArea .sectionBlock .dayBox dl {
        font-size: 4.26vw;
    }
    #mainArea .sectionBlock .dayBox dl dd {
        padding-top: 5.33vw;
        margin-top: 2.66vw;
        border-top: 0.53vw solid #000;
    }
    #mainArea .sectionBlock .dayBox .annotationList {
        font-size: 3.73vw;
        margin-top: 2.66vw;
    }
    #mainArea .sectionBlock .dayBox .annotationList li:not(:last-child) {
        margin-bottom: 6.66vw;
    }
    #mainArea .sectionBlock .closeBtn {
        border: 0.26vw solid #BDBDBD;
        font-size: 4.26vw;
        max-width: none;
        min-height: 17.59vw;
        margin: 10.66vw auto 0;
        border-radius: 9.33vw;
    }
    #mainArea .sectionBlock .closeBtn::before{
        content: "";
        width: 5.33vw;
        height: 0.53vw;
        background: #000;
        position: absolute;
        top: 50%;
        right: 6.66vw;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        z-index: 1;
    }
    #mainArea .sectionBlock .closeBtn::after{
        content: "";
        width: 5.33vw;
        height: 0.53vw;
        background: #000;
        position: absolute;
        top: 50%;
        right: 6.66vw;
        -webkit-transform: translate(-50%, -50%) rotate(-90deg);
        -ms-transform: translate(-50%, -50%) rotate(-90deg);
        transform: translate(-50%, -50%) rotate(-90deg);
        transition: all .5s;
        z-index: 1;
    }
    #mainArea .sectionBlock .closeBtn.active::after{
        -webkit-transform: translate(-50%, -50%) rotate(0deg);
        -ms-transform: translate(-50%, -50%) rotate(0deg);
        transform: translate(-50%, -50%) rotate(0deg);
    }

    #mainArea .sectionBlock ul.flex {
        display: flex;
        justify-content: center;
        flex-direction: column;
        margin: 180px 0 0;
    }
    #mainArea .sectionBlock ul.flex li.flexItem {
        width: 100%;
    }
    #mainArea .sectionBlock ul.flex li.flexItem:not(:last-child) {
        border-right: none;
        border-bottom: 0.53vw dashed #000;
        padding-right: 0;
        padding-bottom: 9.33vw;
        padding-top: 40px;
    }
    #mainArea .sectionBlock ul.flex li.flexItem:last-child {
        padding-left: 0;
        padding-top: 9.33vw;
    }
    #mainArea .sectionBlock ul.flex li.flexItem h5 {
        text-align: left;
        font-size: 4.26vw;
    }
    #mainArea .sectionBlock ul.flex li.flexItem h5 span {
        width: 5.86vw;
        height: 5.86vw;
        margin-right: 1.6vw;
    }
    #mainArea .sectionBlock ul.flex li.flexItem ul.list {
        font-size: 4.26vw;
        margin: 4vw 0 0;
    }
    #mainArea .sectionBlock ul.flex li.flexItem ul.list li span:nth-child(1) {
        margin-top: 3.2vw;
    }
    #mainArea .sectionBlock ul.flex li.flexItem ul.list li span {
        font-size: 3.73vw;
    }
    #mainArea .sectionBlock ul.flex li.flexItem ul.list li.listLarge {
        font-size: 5.33vw;
        text-align: left;
    }
    #mainArea .sectionBlock .textLarge {
        font-size: 5.33vw;
        margin-top: 10.66vw;
    }

    #mainArea .sectionBlock .table{
        margin-top: 16vw;
    }
    #mainArea .sectionBlock .table .tableHead {
        display: flex;
        justify-content: space-between;
        gap: 1.33vw;
        margin-bottom: 0.8vw;
    }
    #mainArea .sectionBlock .table .tableHead li {
        font-size: 4.26vw;
        font-weight: bold;
        line-height: 1.8;
        padding: 3.46vw;
        background: #F7659D;
        color: #fff;
        width: calc(100%/2);
        border-radius: 20px 0 0 0;
        border: #000 solid 2px;
    } 
    #mainArea .sectionBlock .table .tableHead li.spoox{
        background: #1DECCF;
        border-radius: 0 20px 0 0;
        color: #000;
    }
    #mainArea .sectionBlock .table .tableHead li span.logo {
        display: block;
        margin-bottom: 1.33vw;
    }
    #mainArea .sectionBlock .table .tableHead li span.logo img{
        width: 90px;
    }
    #mainArea .sectionBlock .table .tableHead li.spoox span.logo img{
        width: 110px;
    }
    #mainArea .sectionBlock .table dl:not(:last-child) {
        margin-bottom: 0.8vw;
    }
    #mainArea .sectionBlock .table dl dt {
        background: #09E2A1;
        font-size: 4.26vw;
        font-weight: bold;
        line-height: 1.8;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        min-height: 18.66vw;
        width: 100%;
        margin-bottom: 0.8vw;
        border: solid 2px #000;
    }
    #mainArea .sectionBlock .table dl dt span {
        font-size: 3.2vw;
    }
    #mainArea .sectionBlock .table .tableList {
        display: flex;
        justify-content: space-between;
        gap: 1.33vw;
        width: 100%;
    }
    #mainArea .sectionBlock .table .tableList li {
        background: #FFF;
        width: calc(100%/2);
        min-height: 70px;
        padding: 4.53vw 1.66vw;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        border: solid 2px #000;
    }
    #mainArea .sectionBlock .table .tableList li.sky{
        background: #FFE1EC;
    }
    #mainArea .sectionBlock .table dl dd {
        font-size: 3.2vw;
        line-height: 1.75;
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 18.66vw;
        width: 100%;
    }
    #mainArea .sectionBlock .table dl dd span.icon {
        display: block;
        margin-bottom: 0.8vw;
    }
    #mainArea .sectionBlock .table dl dd span.icon img {
        width: 6.4vw;
        height: 6.4vw;
    }
    #mainArea .sectionBlock .table dl dd p.textRed {
        color: #F40538;
        font-weight: bold;
    }
    #mainArea .sectionBlock .table dl dd p.textRed span {
        font-size: 6.93vw;
    }
    #mainArea .sectionBlock .table dl dd p.textBold {
        font-weight: bold;
        line-height: 1.6;
    }
    #mainArea .sectionBlock .table dl dd p.textBold + p.textBold {
        margin-top: 1.06vw;
    }
    #mainArea .sectionBlock .table dl dd p.textBold span {
        font-size: 4.8vw;
        line-height: 1.16;
    }
    #mainArea .sectionBlock .table dl dd p.textSmall {
        margin-top: 2.13vw;
    }
    #mainArea .sectionBlock .table dl dd p.textLarge {
        font-size: 3.73vw;
        margin: 0;
    }

    #mainArea .watchBlock .tabList {
        gap: 2.66vw;
        margin-top: 16vw;
    }
    #mainArea .watchBlock .tabList li {
        border-radius: 1.06vw;
        font-size: 4.26vw;
        padding: 2vw 3.73vw;
        display: block;
    }
    #mainArea .watchBlock .tabList li.active{
        background: #D6337D;
        color: #fff;
        position: relative;
        cursor: pointer;
        padding: 2vw 3.73vw 3vw;
    }
    #mainArea .watchBlock .tabList li.spoox.active{
        background: #1DECCF;
    }
    #mainArea .watchBlock .tabList li:nth-child(2) {
        padding: 4.3vw 2.93vw;
    }
    #mainArea .watchBlock .tabList li.active:nth-child(2) {
        padding: 4.1vw 2.93vw;
    }
    #mainArea .watchBlock .tabList li.active::before {
        content: "";
        position: absolute;
        bottom: -3.2vw;
        right: 0;
        left: 0;
        margin: auto;
        width: 0;
        height: 0;
        border-style: solid;
        border-right: 4.53vw solid transparent;
        border-left: 4.53vw solid transparent;
        border-top: 3.73vw solid #D6337D;
        border-bottom: 0;
        cursor: inherit;
    }
    #mainArea .watchBlock .tabList li.active:nth-child(2)::before{
        border-top: 3.73vw solid #1DECCF;
    }
    #mainArea .watchBlock .tabList li:nth-child(1) span {
        display: inline-flex;
    }
    #mainArea .watchBlock .tabList li:nth-child(1) img {
        width: 18.13vw;
        height: auto;
        position: relative;
        top: 1vw;
    }
    #mainArea .watchBlock .tabList li:nth-child(2) img {
        width: 20vw !important;
        height: auto;
        /* position: relative; */
        /* top: 1vw; */
    }
    #mainArea .watchBlock .tabList li:nth-child(2) span {
        display: inline-block;
        margin-bottom: 0;
    }
    #mainArea .watchBlock .tabContents {
        padding: 8vw 2.66vw;
    }
    #mainArea .watchBlock .tabContents dl.stepBox {
        border: 0.26vw solid #D6337D;
        padding: 5.33vw 3vw;
    }
    #mainArea .watchBlock .tabContents dl.stepBox:not(:first-child) {
        margin-top: 11.2vw;
    }
    #mainArea .watchBlock .tabContents dl.stepBox dt {
        font-size: 4.26vw;
        margin: -5.3vw -3vw 0;
    }
    #mainArea .watchBlock .tabContents dl.stepBox dd {
        font-size: 4.26vw;
        margin-top: 3.2vw;
        text-align: left;
    }
    #mainArea .watchBlock .tabContents dl.stepBox:not(:first-child):before {
        content: "";
        position: absolute;
        top: -8.13vw;
        left: 0;
        right: 0;
        margin: auto;
        width: 0;
        height: 0;
        border-style: solid;
        border-right: 7.73vw solid transparent;
        border-left: 7.73vw solid transparent;
        border-top: 5.86vw solid #D6337D;
        border-bottom: 0;
    }
    #mainArea .watchBlock .tabContents .flexApp {
        background: #F2FAFF;
        border: 0.26vw solid #0099FF;
        border-radius: 2.66vw;
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: column;
        padding: 13.66vw 9.86vw 6.66vw;
        margin-top: 13.33vw;
        position: relative;
    }
    #mainArea .watchBlock .tabContents .flexApp .textBox {
        display: block;
    }
    #mainArea .watchBlock .tabContents .flexApp .textBox img {
        position: absolute;
        top: -10.66vw;
        right: 0;
        left: 0;
        margin: auto;
        width: 24vw;
        height: auto;
    }
    #mainArea .watchBlock .tabContents .flexApp .textBox .text {
        font-size: 4.26vw;
        text-align: center;
    }
    #mainArea .watchBlock .tabContents .flexApp .btnBox {
        flex-direction: column;
        gap: 4vw;
        margin-top: 5.33vw;
    }
    #mainArea .watchBlock .tabContents .notesList {
        margin-top: 4vw;
    }
    #mainArea .watchBlock .tabContents .notesList li {
        font-size: 3.2vw;
    }
    #mainArea .watchBlock .tabContents .pointApp {
        padding-top: 9.33vw;
        padding-bottom: 2.66vw;
        margin-top: 9.33vw;
        border-top: 0.53vw dotted #000000;
    }
    #mainArea .watchBlock .tabContents .pointApp .textHead {
        font-size: 4.8vw;
        margin-bottom: 8vw;
    }
    #mainArea .watchBlock .tabContents .pointApp .flexPoint {
        display: flex;
        flex-direction: column;
        gap: 9.33vw;
    }
    #mainArea .watchBlock .tabContents .pointApp .flexPoint .flexItem {
        border: 0.26vw solid #0099FF;
        border-radius: 2.66vw;
        width: 100%;
        min-height: auto;
        font-weight: bold;
        padding: 8.53vw 3.46vw 5.33vw;
    }
    #mainArea .watchBlock .tabContents .pointApp .flexPoint .flexItem span.textStep {
        border-radius: 4.8vw;
        font-size: 4.26vw;
        min-width: 32vw;
        height: 8.53vw;
        padding: 0.8vw;
        margin: 0 auto;
        position: absolute;
        top: -4.53vw;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    #mainArea .watchBlock .tabContents .pointApp .flexPoint .flexItem .text {
        font-size: 4.8vw;
        line-height: 1.8;
    }
    #mainArea .watchBlock .tabContents .pointApp .flexPoint .flexItem .text span {
        color: #F40538;
    }
    
    #mainArea .annotationBlock {
        font-size: 3.73vw;
    }
}
/* /---------- */


/* programArea */
.programArea {
    padding: 140px 0 100px;
}
.programArea h3 {
    text-align: center;
    margin: 0 auto 50px;
}
.programArea .programWrapper {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 18px 20px;
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
}
.programArea .programItem {
    background: #fff;
    max-width: 285px;
    width: calc(100%/4);
    border-radius: 10px;
    position: relative;
    border: 1px solid #000;
}
.programArea .programItem a:hover {
    text-decoration: none;
}
.programArea .programItem .programInner {
    padding: 10px 20px 10px;
}
.programArea .programItem .img {
    width: 100%;
    max-height: 161px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    vertical-align: middle;
    background: #000000;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    overflow: hidden;
}
.programArea .programItem .img img {
    width: auto;
    max-height: 161px;
}
.programArea .programItem .copy {
    font-size: 12px;
    line-height: 1.6;
}
.programArea .programItem .category {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 10px 0 0;
}
.programArea .programItem .category li.text {
    color: #CB191C;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
    padding: 0 5px;
    border: 1px solid #CB191C;
    border-radius: 5px;
}
.programArea .programItem .category li img {
    width: 45px;
    height: auto;
}
.programArea .programItem h4.title {
    font-size: 16px;
    line-height: 1.8;
    font-weight: bold;
    margin: 9px 0 0;
    z-index: 1;
}
.programArea .programItem .schedule {
    font-size: 14px;
    line-height: 1.8;
    margin: 15px 0 0;
}
.programArea .programItem .flex {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 10px 15px;
    margin: 15px 0 0;
}
.programArea .programItem .flex .imgBox {
    display: flex;
    align-items: baseline;
    gap: 5px;
}
.programArea .programItem .flex .imgBox img {
    border: 1px solid #C5C5C5;
    padding: 1px;
    max-width: 46px;
}
.programArea .programItem .flex .imgBox img:not(:last-child) {
    margin-right: 5px;
}
.programArea .programItem .flex .textBox {
    font-size: 14px;
    line-height: 1.8;
}
@media (max-width: 1200px){
    .programArea .programWrapper {
        justify-content: center;
    }
    .programArea .programItem {
        width: calc(100%/3);
    }
}
@media (max-width: 768px){
    .programArea {
        padding: 29.33vw 0 21.33vw;
    }
    .programArea h3 {
        text-align: center;
        margin: 0 auto 12.26vw;
    }
    .programArea .programWrapper {
        display: flex;
        justify-content: flex-start;
        flex-wrap: wrap;
        gap: 5.06vw 2.66vw;
        max-width: 88vw;
        width: 100%;
        margin: 0 auto;
    }
    .programArea .programItem {
        max-width: 42.66vw;
        width: calc(100%/2);
        border-radius: 2.66vw;
        border: 0.26vw solid #000;
    }
    .programArea .programItem .programInner {
        padding: 2.13vw 2.66vw 2.13vw;
    }
    .programArea .programItem .img {
        width: 100%;
        max-height: 24vw;
        border-top-left-radius: 2.66vw;
        border-top-right-radius: 2.66vw;
    }
    .programArea .programItem .img img {
        width: auto;
        max-height: 24vw;
    }
    .programArea .programItem .copy {
        font-size: 2.93vw;
    }
    .programArea .programItem .category {
        gap: 2.66vw;
        margin: 2.66vw 0 0;
    }
    .programArea .programItem .category li.text {
        font-size: 3.13vw;
        padding: 0 1.06vw;
        border: 0.26vw solid #CB191C;
        border-radius: 0.8vw;
    }
    .programArea .programItem .category li img {
        width: 9.33vw;
        height: auto;
    }
    .programArea .programItem h4.title {
        font-size: 3.46vw;
        margin: 4vw 0 0;
    }
    .programArea .programItem .schedule {
        font-size: 3.2vw;
        line-height: 1.73;
        margin: 2.66vw 0 0;
    }
    .programArea .programItem .flex {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        gap: 2.66vw 3.2vw;
        margin: 4vw 0 0;
    }
    .programArea .programItem .flex .imgBox {
        display: flex;
        align-items: baseline;
        gap: 1.33vw;
    }
    .programArea .programItem .flex .imgBox img {
        border: 0.26vw solid #C5C5C5;
        padding: 0.26vw;
        max-width: 9.6vw;
    }
    .programArea .programItem .flex .imgBox img:not(:last-child) {
        margin-right: 1.33vw;
    }
    .programArea .programItem .flex .textBox {
        font-size: 3.2vw;
        line-height: 1.5;
    }

}
/* /---------- */


/* ComingSoon */
/* .ComingSoon {
    background: #fff;
    padding: 140px 0 100px;
    text-align: center;
}
.ComingSoon .text {
    font-family: 'Gibson', sans-serif;
    font-size: 48px;
    font-weight: bold;
    line-height: 1.2;
}
@media (max-width: 768px){
    .ComingSoon {
        padding: 32vw 0 29.33vw;
    }
    .ComingSoon .text {
        font-size: 9.6vw;
    }
} */
/* /---------- */


 /* #floatArea */
#floatArea{
    background: rgb(255, 255, 255, 0.8);
    width: 100%;
    height: 90px;
    position: fixed;
    bottom: 0;
    z-index: 1001;
    display: none;
}
#floatArea.show {
    display: block;
}
#floatArea .img{
    position: relative;
    width: 100%;
    height: 100%;
}
#floatArea a{
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 320px;
    width: 100%;
    min-height: 60px;
    margin: 0;
    color: #fff;
    border-radius: 35px;
    position: relative;
    font-size: 18px;
    font-weight: bold;
}
#floatArea .joinButton{
    display: flex;
    justify-content: center;
    gap: 30px;
    padding-top: 15px;
}
#floatArea a span {
    margin-right: 6px;
}
#floatArea .joinButton a {
    background: #FF6869;
}
#floatArea .joinButton a img {
    width: 47px;
    height: auto;
}
#floatArea .joinButton a:nth-child(1)::before {
    content: "";
    background: url(/inkigayo2024/img/icon_arrow_right.svg);
    width: 18px;
    height: 18px;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 25px;
    margin: auto;
}
#floatArea .joinButton a:nth-child(2) {
    background: #000;
}
#floatArea .joinButton a:nth-child(2)::before {
    content: "";
    background: url(/inkigayo2024/img/icon_arrow_right02.svg);
    width: 18px;
    height: 18px;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 25px;
    margin: auto;
}
#floatArea a:nth-child(2) span {
    margin-right: 0;
}
#floatArea .joinButton a:nth-child(2) img {
    width: 94px;
    height: auto;
}


.banner .img{
    position: relative;
    width: 100%;
    height: 100%;
}
.banner a{
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 320px;
    width: 100%;
    min-height: 60px;
    margin: 0;
    color: #fff;
    border-radius: 35px;
    position: relative;
    font-size: 18px;
    font-weight: bold;
}
.banner .joinButton{
    display: flex;
    justify-content: center;
    gap: 30px;
    padding-top: 15px;
}
.banner a span {
    margin-right: 6px;
}
.banner .joinButton a {
    background: #FF6869;
}
.banner .joinButton a img {
    width: 47px;
    height: auto;
}
.banner .joinButton a:nth-child(1)::before {
    content: "";
    background: url(/inkigayo2024/img/icon_arrow_right.svg);
    width: 18px;
    height: 18px;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 25px;
    margin: auto;
}
.banner .joinButton a:nth-child(2) {
    background: #000;
}
.banner .joinButton a:nth-child(2)::before {
    content: "";
    background: url(/inkigayo2024/img/icon_arrow_right02.svg);
    width: 18px;
    height: 18px;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 25px;
    margin: auto;
}
.banner a:nth-child(2) span {
    margin-right: 0;
}
.banner .joinButton a:nth-child(2) img {
    width: 94px;
    height: auto;
}
@media (max-width: 768px){
    #floatArea{
        height: 43.2vw;
    }
    #floatArea a{
        display: flex;
        justify-content: center;
        align-items: center;
        max-width: 85.33vw;
        width: 100%;
        min-height: 17.59vw;
        margin: 0 auto;
        color: #fff;
        border-radius: 8.79vw;
        position: relative;
        font-size: 4.8vw;
        font-weight: bold;
    }
    #floatArea .joinButton{
        display: flex;
        justify-content: center;
        gap: 2.66vw;
        font-weight: bold;
        flex-direction: column;
    }
    #floatArea a span {
        margin-right: 1.6vw;
    }
    #floatArea .joinButton a img {
        width: 15.73vw;
        height: auto;
    }
    #floatArea .joinButton a:nth-child(1)::before {
        content: "";
        background: url(/inkigayo2024/img/icon_arrow_right.svg);
        width: 4.8vw;
        height: 4.8vw;
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 6.66vw;
        margin: auto;
    }
    #floatArea .joinButton a:nth-child(2) {
        background: #000;
    }
    #floatArea .joinButton a:nth-child(2)::before {
        content: "";
        background: url(/inkigayo2024/img/icon_arrow_right02.svg);
        width: 4.8vw;
        height: 4.8vw;
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 6.66vw;
        margin: auto;
    }
    #floatArea a:nth-child(2) span {
        margin-right: 0;
    }
    #floatArea .joinButton a:nth-child(2) img {
        width: 25.06vw;
        height: auto;
    }
    


    .banner{
        height: 43.2vw;
    }
    .banner a{
        display: flex;
        justify-content: center;
        align-items: center;
        max-width: 85.33vw;
        width: 100%;
        min-height: 17.59vw;
        margin: 0 auto;
        color: #fff;
        border-radius: 8.79vw;
        position: relative;
        font-size: 4.8vw;
        font-weight: bold;
    }
    .banner .joinButton{
        display: flex;
        justify-content: center;
        gap: 2.66vw;
        font-weight: bold;
        flex-direction: column;
    }
    .banner a span {
        margin-right: 1.6vw;
    }
    .banner .joinButton a img {
        width: 15.73vw;
        height: auto;
    }
    .banner .joinButton a:nth-child(1)::before {
        content: "";
        background: url(/inkigayo2024/img/icon_arrow_right.svg);
        width: 4.8vw;
        height: 4.8vw;
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 6.66vw;
        margin: auto;
    }
    .banner .joinButton a:nth-child(2) {
        background: #000;
    }
    .banner .joinButton a:nth-child(2)::before {
        content: "";
        background: url(/inkigayo2024/img/icon_arrow_right02.svg);
        width: 4.8vw;
        height: 4.8vw;
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 6.66vw;
        margin: auto;
    }
    .banner a:nth-child(2) span {
        margin-right: 0;
    }
    .banner .joinButton a:nth-child(2) img {
        width: 25.06vw;
        height: auto;
    }
}

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



/* modal */
.modal {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1002;
    -webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
    transition: opacity 0.3s ease, visibility 0.3s ease;
  }
  .modal.-show {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
  .modal-window {
    position: absolute;
    left: 50%;
    top: 50%;
    width: calc(100% - 20px);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
  }
  .simulation .modal-window {
    width: 100%;
    height: calc(100% - 214px);
    top: 0;
  }
  .c-contract-cv__btn__select {
  max-width: 500px;
  min-width: 310px;
  font-size: 15px;
  line-height: 1.4em;
  text-align: center;
  padding: 10px 35px 10px 25px;
  min-height: 54px;
  font-weight: 500;
  border-radius: 100px;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  position: relative;
  -webkit-transition: background 0.2s;
  transition: background 0.2s;
  }
  .c-contract-cv__btn__select .basic-join {
  font-size: 17px;
    margin-right: 0.4em;
  }
  #modal-confirm .c-contract-ac__trigger::after {
  transition: 0.2s;
  -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
  }
  #modal-confirm .c-contract-ac__trigger.active::after {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
  }
  #modal-confirm .j-contract-ac__content {
  display: none;
  }
  @media screen and (max-width: 768px) {
  .simulation .modal-window {
    width: 100%;
    height: calc(100% - 57.8vw);
    top: 0;
    }
  }
  @media screen and (min-width: 769px) {
  .modal-window {
    max-width: 900px;
  }
  }
  
  .modal-window-inner {
  margin-left: auto;
  margin-right: auto;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  overflow: auto;
  display: none;
  }
  @media screen and (max-width: 768px) {
  .modal-window-inner {
    max-height: calc(100vh - 120px);
  }
  }
  .modal-window-inner.-show {
  display: block;
  }
  
  .modal-close {
  border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 30px;
    height: 30px;
    position: absolute;
    top: 0;
    right: 0;
    background: url(https://www.skyperfectv.co.jp/global/assets/images/icon/icon_close_white.svg) center center no-repeat;
    background-size: 30px 30px;
    cursor: pointer;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    overflow: hidden;
  }
  .modal-window-scroll {
    position: relative;
    z-index: 2;
  }
  
  
  .modal-inner-contents {
  padding: 0;
  text-align: center;
  }
  @media screen and (min-width: 769px) {
    .modal-inner-contents {
        padding: 52px 0 0;
    }
  }
  @media screen and (max-width: 768px) {
    .modal-inner-contents {
        padding: 6.66vw 0 0;
    }
  }
  
  
  @media screen and (min-width: 769px) {
  .modal.-show {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    overflow:auto;
  }
  .modal-bg {
    position: sticky;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  background: rgba(0,0,0,0.6);
  }
  }
  @media screen and (max-width: 768px) {
    .modal-bg {
        position: sticky;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
    background: rgba(0,0,0,0.6);
    }
    .modal-window {
        position: absolute;
        left: 50%;
        width: calc(100% - 20px);
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
        top: 50%;
    }
  }
  
  @media all and (-ms-high-contrast: none) {
  .modal-bg {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
  }
  }
  @-moz-document url-prefix() {
  .modal-bg {
    position: sticky;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
  }
  }