@charset "utf-8";

html {font-size: 62.5%;}


.kome {font-size: 1.6rem; color: #ff138b;}
*:not(ul).kome::before {content: "※";}

.frame {
    position: relative;
    z-index: 1;
    min-height: 100px;
    padding-bottom: 114px;
    background: #fff;
    border-radius: 26px;
    border-style: solid;
    border-width: 3px 3px 6px 3px;
    text-align: center;
}
.frame::before {
    content: "";
    display: block;
    position: absolute;
    top: 12px;
    left: 12px;
    width: calc(100% - 24px);
    height: calc(100% - 28px);
    border-style: solid;
    border-width: 2px;
    border-radius: 20px;
}
.frame > * {
    position: relative;
    z-index: 1;
}
#sct-1 .frame::before,
#sct-3 .frame::before {
    border-color: #d5ceff;
}
#sct-2 .frame::before {
    border-color: #ffcff1;
}
#sct-1 .frame,
#sct-3 .frame {
    border-color: #8565da;
}
#sct-2 .frame {
    border-color: #e359e5;
}
.sct + .sct {margin-top: 176px;}
.sct .hdg {margin-top: -55px;}
#content {
    padding-bottom: 100px;
    background-image:
        url(https://static.ncsoft.jp/images/event/bns/2005party/bodyBg-1.jpg),
        url(https://static.ncsoft.jp/images/event/bns/2005party/bodyBg-2.jpg),
        url(https://static.ncsoft.jp/images/event/bns/2005party/bodyBg-3.jpg),
        url(https://static.ncsoft.jp/images/event/bns/2005party/bodyBg-4.jpg),
        url(https://static.ncsoft.jp/images/event/bns/2005party/bodyBg-5.jpg);
    background-position-x: center;
    background-position-y: 1140px, 2602px, 4062px, 5524px, 6986px;
    background-repeat: no-repeat;

}
#headArea {
    height: 1140px;
    background: url(https://static.ncsoft.jp/images/event/bns/2005party/headBg.jpg) no-repeat center top;
}
#headArea .main {position: absolute; top: 0; left: -183px; z-index: 1;}
#headArea .main_balloon {
    position: absolute;
    left: 50%;
    top: 0;
    opacity: 0;
    transform: translateX(-50%) scale(.95);
    transform-origin: center bottom;
    transition: all 1s ease-out 1s;
}
#headArea .main_balloon.scaleUp {
    opacity: 1;
    transform: translateX(-50%) scale(1);
}
#headArea .bnsLogo {
    z-index: 2;
}
#bodyArea {
    margin-top: -122px;
}
.sct-3_char-1 {
    margin-left: -14px;
}
.sct-3_char-2 {
    position: absolute;
    bottom: -230px;
    right: -80px;
}
.sct-3_table-3_caption {
    text-align: center;
}
.tableContainer {
    position: relative;
    border: solid 2px #8565da;
    border-radius: 6px;
    overflow: hidden;
    width: 990px;
    margin: 20px auto 0;
}
.table {
    width: 100%;
    margin-bottom: 0;
    font-size: 1.8rem;
}
.table tr > * {
    border-right: solid 1px #8565da;
    border-bottom: solid 1px #8565da;
    vertical-align: middle;
    color: #211880;
}
.table thead tr {
    background: #553DEF;
}
.table thead th {
    color: #fff;
    border-top: none;
}
.table tbody tr:nth-of-type(even) {
    background: #F3F2FF;
}
.table th {
    white-space: nowrap;
}
.table td {
    font-size: 1.6rem;
}
.table tr:last-child > * {
    border-bottom: none;
}

#content #att {
    padding-top: 90px;
    padding-bottom: 170px;
    margin-top: 120px;
    font-size: 1.8rem;
    background: rgba(30,33,50.6);
}
#content #att .inner {
    width: 1050px;
}
#content #att .list {
    margin-top: 15px; color: #8491b8;
}
#content #att dl {
    margin-top: 25px;
}
#content #att dt {
    font-weight: normal; font-family: "Folk medium" !important;
}
#content #att dd {
    margin-top: 5px; color: #8491b8;
}

.balloon {
    position: absolute;
    pointer-events: none;
}
.balloon_1,
.balloon_3 {
    animation: horizontal1 1s ease-in-out infinite alternate;
}
.balloon_2,
.balloon_4 {
    animation: horizontal2 1s ease-in-out infinite alternate;
}
.balloon_1 {
    top: -260px;
    right: -275px;

}
.balloon_2 {
    top: 820px;
    left: -280px;
}
.balloon_3 {
    top: -382px;
    right: -333px;
}
.balloon_4 {
    top: 2160px;
    left: -240px;
}
.balloon img {
    animation: vertical 1s ease-in-out infinite alternate;
}
.balloon_1 img,
.balloon_3 img {
    animation-duration: 1.1s;
}
.balloon_2 img,
.balloon_4 img {
    animation-duration: 1.3s;
}

@-webkit-keyframes horizontal1 {
    0% {transform: translateX(-3px);}
  100% {transform: translateX(0px);}
}

@-webkit-keyframes horizontal2 {
    0% {transform: translateX(3px);}
  100% {transform: translateX(0px);}
}

@-webkit-keyframes vertical {
    0% {transform: translateY(-10px);}
  100% {transform: translateY(0px);}
}