body, body * {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
/*    -webkit-user-select: none; */
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
body {
    font-family: "HiraKakuProN-W3", "verdana";
    background-color: #000;
    margin: 0 auto;
    background: #000 url(../image/campaign/sp_bg_main_page.jpg) no-repeat;
    background-size: 100%;
    background-attachment: fixed;
}
img {
    max-width: 100%;
    vertical-align: baseline;
}
.alert {
    color: #FF0;
    font-weight: bold;
    font-size: 10px;
    text-shadow: 1px 1px 1px #000, -1px 1px 1px #000, 1px -1px 1px #000, -1px -1px 1px #000;
}
.notice {
    max-width: 700px;
    padding-top: 20px;
    margin: 0 auto;
    position: relative;
}
.notice > .menu > .btn1,
.notice > .menu > .btn2,
.notice > .menu > .btn3 {
    position: absolute;
    bottom: 9px;
    width: 64px;
    height: 30px;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.notice > .menu > .btn1.touched,
.notice > .menu > .btn2.touched,
.notice > .menu > .btn3.touched {
    -webkit-transform: scale(.95);
    transform: scale(.95);
}
.notice > .menu > .btn1 {
    background-image: url('../image/info/btn1.png');
    left: 28px;
}
.notice > .menu > .btn2 {
    background-image: url('../image/info/btn2.png');
    left: 119px;
}
.notice > .menu > .btn3 {
    background-image: url('../image/info/btn3_new.png');
    right: 28px;
}
.notice > .content {
    -webkit-overflow-scrolling: touch;
    margin-top: 10px;
    margin: 0 auto;
}
.notice > .content::-webkit-scrollbar {
    all: unset;
    width: 8px;
    background-color: transparent;
    background-image: url('../image/info/common_scrollbar_9slice.png');
    background-repeat: no-repeat;
    background-size: 6px 120%;
    background-position: center center;
}
.notice > .content::-webkit-scrollbar-thumb {
    all: unset;
    background-color: #444;
    background: -webkit-linear-gradient(left, transparent 0%, transparent 10%, #444 11%, #444 100%);
    background: linear-gradient(to right, transparent 0%, transparent 10%, #444 11%, #444 100%);
}
.notice > .content > ul > li {
    position: relative;
    padding-bottom: 7px;
    margin-bottom: 10px;
    background-image: url('../image/info/info_bar.png');
    background-size: 268px auto;
    background-repeat: no-repeat;
    background-position: center bottom;
}
.notice > .content > ul > li > .footer::after {
    content: '';
    display: block;
    clear: both;
}
.notice > .content > ul > li > .footer > .title {
    float: left;
    margin-left: 2px;
    height: 20px;
    line-height: 20px;
    font-size: 12px;
    color: #FFF;
    font-weight: bold;
    text-shadow: 1px 1px 1px #000, -1px 1px 1px #000, 1px -1px 1px #000, -1px -1px 1px #000;
}
.notice > .content > ul > li > .footer > .btn {
    float: right;
    margin-right: 1px;
    display: block;
    width: 52px;
    height: 20px;
    background-image: url('../image/info/info_button_detail.png');
    background-size: 100% auto;
    background-repeat: no-repeat;
    cursor: pointer;
}
.notice > .content > ul > li > .footer > .btn.touched {
    -webkit-transform: scale(.95);
    transform: scale(.95);
}
.notice > .content > ul > li > .date {
    background-size: auto 16px;
    background-repeat: no-repeat;
    background-position: center center;
    text-align: right;
    overflow: hidden;
    color: #FFF;
    text-shadow: 1px 1px 1px #000, -1px 1px 1px #000, 1px -1px 1px #000, -1px -1px 1px #000;
    font-size: 10px;
    line-height: 16px;
    height: 16px;
    padding-right: 2px;
}
.notice > .content > ul > li > .date.type0 {
    background-image: url('../image/info/info_rabel_0.png');
}
.notice > .content > ul > li > .date.type1 {
    background-image: url('../image/info/info_rabel_1.png');
}
.notice > .content > ul > li > .date.type2 {
    background-image: url('../image/info/info_rabel_2.png');
}
.notice > .content > ul > li > .date.type3 {
    background-image: url('../image/info/info_rabel_3.png');
}
.notice > .content > ul > li > .date.type4 {
    background-image: url('../image/info/info_rabel_4.png');
}






.info {
    font-weight: bold;
    text-shadow: 0 0 1px #f6deaa;
    line-height: 1.4;
}
.info h1 {
    text-align: center;
    margin: 10px 0;
    text-decoration: underline;
}
.info h2 {
    font-size: 13px;
    margin: 10px 0 5px;
}
.info h3 {
    font-size: 12px;
    margin: 10px 0 5px;
}
.info p {
    margin-top: 5px;
}
.info hr {
    border-color: #333;
    border-width: 1px;
}
.info .center {
    text-align: center;
}
.info .left {
    text-align: left;
}
.info .right {
    text-align: right;
}
.info .red {
    color: #F00;
}
.info .green {
    color: #090;
}
.info .blue {
    color: #06F;
}
.info .orange {
    color: #F80;
}
.info .yellow {
    color: #FF0;
}
.info .purple {
    color: #F0F;
}
.info .aqua {
    color: #0FF;
}
.info .box-red,
.info .box-yellow,
.info .box-white {
    margin: 5px 0;
    padding: 0 5px 5px 5px;
    border-radius: 4px;
}
.info .box-white {
    background-color: rgba(255, 255, 255, .7);
    border: solid 1px #FFF;
}
.info .box-red {
    background-color: rgba(255, 128, 128, .7);
    border: solid 1px #F88;
}
.info .box-yellow {
    background-color: rgba(255, 255, 128, .7);
    border: solid 1px #FF8;
}
.notice > .back {
    display: block;
    position: absolute;
    z-index: 15;
    left: 8px;
    bottom: 8px;
    cursor: pointer;
    width: 62px;
    height: 32px;
    background-image: url('../image/help_ui_atlus.png');
    background-size: 320px auto;
    background-repeat: no-repeat;
    background-position: 0 -66px;
}
.notice > .back.touched {
    background-position: -70px -66px;
}


.event1-wrap {
  width: 96%;
  max-width: 720px;
  margin: 0 auto;
}
.event1-top, .event1-bottom {
  width: 100%;
  margin: -1px auto;
  padding-top: 13%;
}
.event1-top {
  background: url(../image/campaign/win_upper.png);
  background-size: 100%;
}
.event1-bottom {
  background: url(../image/campaign/win_under.png);
  background-size: 100%;
}
.event1-body {
  position: relative;
  text-align: center;
  background: url(../image/campaign/win_midle.png) repeat-y;
  background-size: 100% 104px;
}
.sentence-head {
  max-width: 90%;
}
.sentence {
  margin: 0 30px;
  max-width: 96%;
}
.event1-body p {
  margin: 0 auto 20px;
  text-align: left;
}
.movie-head {
  margin-bottom: 10px;
  text-align: left;
  font-size: 1.6em;
  font-weight: bold;
}
.movie-title {
  padding: 0.4em 0 0.2em;
  text-align: left;
  font-size: 1.6em;
  font-weight: bold;
  color: #444;
}

.head-unlock {
    padding-top: 6px;
    width: 100%;
    height: 32px;
    background: url(../image/campaign/title00.png) no-repeat;
    background-size: 100%;
    color: #fff;
    text-shadow: 0 0 1px #000, 0 0 1px #4d3d21, 0 0 1px #4d3d21;
}
.head-linear {
    color: #ce2424;
    text-shadow: 0 0 1px #fdd, 0 0 1px #fff, 0 0 1px #fff;
}
.source-link {
    display: block;
    margin-bottom: 1.5em;
    text-decoration: none;
    font-weight: normal;
    font-size: 0.8em;
    color: #7d4d00;
}
.note {
    text-align: left;
    font-weight: normal;
}

.pt02 {padding-top: 0.2em;}
.mt2 {margin-top: 2em;}
.mb1 {margin-bottom: 1em;}
.tcenter {text-align: center;}