@charset "UTF-8";

html {
    font-size: 62.5%;
    line-height: 1.5
}

body {
    font-family: "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", Meiryo, "MS PGothic", sans-serif;
    margin: 0;
    padding: 0
}

* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

fieldset,
img {
    border: 0
}

address,
caption,
cite,
code,
dfn,
em,
th,
var {
    font-style: normal;
    font-weight: 400
}

img {
    max-width: 100%;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    vertical-align: bottom
}

dl,
ol,
ul {
    padding: 0;
    margin: 0;
    list-style: none
}

caption,
th {
    text-align: left
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin-top: 0;
    font-size: 100%;
    font-weight: 400
}

p {
    margin: 0;
    line-height: 1.6em
}

q:after,
q:before {
    content: ''
}

abbr,
acronym {
    border: 0
}

a {
    text-decoration: none
}

a img {
    border: none
}

a:link {
    color: #ff4280;
    text-decoration: none
}

a:visited {
    color: #ff4280;
    text-decoration: none
}

a:active,
a:focus,
a:hover {
    color: #ff91b5;
    text-decoration: none
}

.clearfix::after {
    content: " ";
    display: block;
    clear: both
}

#ikemen_header {
    background-color: #000;
    position: relative;
    z-index: 6;
    font-family: "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", Meiryo, "MS PGothic", sans-serif
}

#ikemen_header .container {
    max-width: 1200px;
    margin: 0 auto
}

#ikemen_header ul {
    padding-left: 1em;
    padding-bottom: .5em
}

#ikemen_header ul li {
    margin: .5em 0 0 0;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
    font-size: 1rem;
    line-height: 20px
}

@media screen and (min-width:751px) {
    #ikemen_header ul li {
        font-size: 1.3rem;
        line-height: 24px
    }
}

#ikemen_header ul li a {
    color: #fff
}

#footer {
    font: inherit;
    font-family: inherit;
    font-weight: inherit;
    font-style: inherit;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
    border: 0;
    outline: 0;
    width: 100%;
    background: #000;
    font-size: 12px;
    color: #fff;
    line-height: 3em;
    font-family: "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", Meiryo, "MS PGothic", sans-serif
}

#footer a {
    color: #fff;
    font-size: 14px
}

#footer .ft_sitemap {
    padding: 50px 0;
    overflow: hidden;
    max-width: 1200px;
    margin: 0 auto
}

#footer .footer_cnt {
    float: left;
    padding: 0 36px
}

@media screen and (min-width:751px) {
    .footer_list li {
        list-style: disc;
        list-style-position: inside
    }

    .footer_list li.toggle-wrapper {
        list-style: none
    }

    .footer_list li.toggle-wrapper #js-toggle_list li {
        list-style: disc;
        list-style-position: inside
    }
}

@media screen and (max-width:1139px) {
    #footer .footer_logo_img {
        float: none;
        margin-bottom: 10px
    }
}

#footer .footer_cnt.block_content,
#footer .footer_cnt.block_title {
    border-right: 1px solid #fff
}

#footer .headline {
    font-size: 16px;
    font-weight: 700
}

#footer .footer_bottom {
    background-color: #362623
}

#footer .footer_bottom p {
    text-align: center
}

@media screen and (max-width:750px) {
    #ikemen_header {
        background-color: #000;
        position: relative;
        z-index: 6;
        padding-left: 2%
    }

    #ikemen_header .container {
        width: auto;
        margin: 0 auto
    }

    #ikemen_header ul {
        padding-left: 0;
        padding-bottom: 0
    }

    #ikemen_header ul li {
        margin: .3em 1em 0 0;
        display: inline-block;
        vertical-align: middle;
        font-size: .6em
    }

    #ikemen_header ul li a {
        color: #fff
    }

    #footer .footer_logo_img {
        display: none
    }

    #footer .headline {
        text-align: center;
        display: block;
        padding: 10px;
        color: #fff;
        border-bottom: 1px solid #fff;
        background-color: #8a6c2b;
        font-size: 1em;
        line-height: 1.6
    }

    #footer .footer_list {
        background-color: #000;
        line-height: 1.5;
        text-align: left;
        letter-spacing: 2px
    }

    #footer .footer_list li {
        display: block;
        padding: 10px 3%;
        border-bottom: solid 1px #fff;
        font-size: 1em;
        letter-spacing: 0;
        position: relative
    }

    #footer .footer_list li.toggle-wrapper {
        padding: 0;
        border-bottom: none
    }

    #footer .footer_list li a {
        display: block;
        padding: 0 3%;
        color: #fff;
        font-size: 13px
    }

    #footer .ft_sitemap {
        padding: 0;
        width: 100%;
        margin: 0
    }

    #footer .footer_cnt {
        float: none;
        width: 100%;
        padding: 0
    }

    #footer .footer_cnt.block_content,
    #footer .footer_cnt.block_title {
        border-right: none
    }
}

.flex-content-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
}

.flex-content-wrap.flex-sb {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media screen and (min-width:751px) {
    .tw-area {
        width: 39.5%
    }

    .game-area {
        width: 53%
    }
}

.content_wrapper {
    background-color: #06040f;
    position: relative
}

.fixed-btn-wrapper {
    width: 100%
}

.audio-btn-wrap {
    width: 18.125%;
    min-width: 35px;
    position: absolute;
    top: -5%;
    right: 2%
}

@media screen and (min-width:751px) {
    .audio-btn-wrap {
        width: 15%;
        max-width: 240px
    }
}

.audio-btn-wrap.fixed {
    position: fixed;
    top: 20px;
    right: auto;
    z-index: 1000
}

.audio-btn {
    width: 100%;
    background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/sp/collabo/btn_bgm_on_iv.png) no-repeat top left;
    background-size: 100%;
    padding-top: calc(120 / 116 * 100%);
    cursor: pointer
}

@media screen and (min-width:751px) {
    .audio-btn {
        background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/pc/collabo/btn_bgm_on_iv.png) no-repeat top left;
        background-size: 100%;
        padding-top: calc(240 / 231 * 100%)
    }
}

.audio-btn.play {
    background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/sp/collabo/btn_bgm_off_iv.png) no-repeat top left;
    background-size: 100%
}

@media screen and (min-width:751px) {
    .audio-btn.play {
        background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/pc/collabo/btn_bgm_off_iv.png) no-repeat top left;
        background-size: 100%
    }
}

.main-image {
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    position: relative
}

.main-image .main-bg {
    width: 100%;
    background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/sp/main/main_bg.jpg) no-repeat top left;
    background-size: 100%;
    padding-top: calc(1275 / 640 * 100%)
}

@media screen and (min-width:751px) {
    .main-image .main-bg {
        background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/pc/main/main_bg.jpg) no-repeat top left;
        background-size: 100%;
        padding-top: calc(2476 / 1600 * 100%)
    }
}

.main-image .text-effect {
    width: 24.5312%;
    background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/sp/main/main_txt_01.png) no-repeat top left;
    background-size: 100%;
    padding-top: calc(326 / 157 * 24.5312%);
    position: absolute;
    top: -1.9%;
    left: 4.3%;
    display: none
}

@media screen and (min-width:751px) {
    .main-image .text-effect {
        width: 22.4375%;
        background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/pc/main/main_txt_01.png) no-repeat top left;
        background-size: 100%;
        padding-top: calc(690 / 359 * 22.4375%);
        top: 0;
        left: 6.7%
    }
}

.main-image .main-image-wrapper {
    width: 100%;
    margin: 0 auto;
    position: absolute;
    top: 28.5%;
    left: 0;
    right: 0
}

@media screen and (min-width:751px) {
    .main-image .main-image-wrapper {
        top: 35.2876%;
        margin-top: 0
    }
}

.main-image .logo-content {
    margin-bottom: 25px
}

@media screen and (min-width:751px) {
    .main-image .logo-content {
        margin-bottom: 0
    }

    .main-image .logo-content .logo {
        width: 73.3125%;
        max-width: 1173px;
        margin: 0 auto
    }
}

.main-image .main-text {
    width: 91.25%;
    margin: 0 auto
}

@media screen and (min-width:751px) {
    .main-image .main-text {
        width: 61.125%;
        margin: -40px auto 0;
        max-width: 978px
    }
}

.main-image .message-content {
    margin-bottom: 2.5%
}

@media screen and (min-width:751px) {
    .main-image .message-content {
        margin-bottom: 40px
    }
}

.main-image .anniversary-inner {
    width: 93.75%;
    margin: 0 auto 20px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

@media screen and (min-width:751px) {
    .main-image .anniversary-inner {
        width: 79.125%;
        max-width: 1266px
    }
}

.main-image .anniversary-inner .logo-3rd {
    width: 33.1667%
}

.main-image .anniversary-inner .tweet-wrap {
    width: 62.5%
}

#collabo.collabo-content {
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    background-color: #290f3b;
    padding-bottom: 30px
}

#collabo .container {
    width: 95%;
    margin: 20px auto 0
}

#collabo .inner-img {
    width: 95%;
    max-width: 1000px;
    margin: 0 auto 40px
}

#collabo .inner-text {
    font-size: 12px;
    font-size: 3.2vw;
    color: #fff;
    margin-bottom: 40px
}

@media screen and (min-width:751px) {
    #collabo .inner-text {
        font-size: 22px
    }
}

#collabo .inner-text.center {
    text-align: center
}

#collabo .btn-iv {
    width: 73.75%;
    max-width: 674px;
    margin: 0 auto;
    text-align: center
}

#collabo .btn-iv a {
    display: block
}

#eventCalendar.campaign-content {
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    background-image: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/sp/event/eve_bg.jpg);
    background-repeat: repeat-y;
    background-size: 100%;
    padding-bottom: 30px
}

@media screen and (min-width:751px) {
    #eventCalendar.campaign-content {
        background-image: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/pc/event/eve_bg.jpg)
    }
}

#eventCalendar .content-third-cp {
    position: relative;
    margin-bottom: 30px
}

#eventCalendar .cp-month {
    width: 96.875%;
    margin-left: auto
}

#eventCalendar .cp-item-wrapper {
    position: relative;
    width: 93.5938%;
    margin: 0 auto
}

@media screen and (min-width:751px) {
    #eventCalendar .cp-item-wrapper {
        width: 91%;
        max-width: 1276px;
        margin: 0 auto 30px
    }
}

#eventCalendar .cp-line {
    width: 19.5326%;
    position: relative
}

#eventCalendar .cp-line .cp-line-inner {
    width: 3px;
    height: 100%;
    margin: 0 auto;
    background-color: #fff
}

@media screen and (min-width:751px) {
    #eventCalendar .cp-line .cp-line-inner {
        width: 14px
    }
}

#eventCalendar .cp-line::after {
    content: "";
    width: 19.6581%;
    padding-top: 19.6581%;
    background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/sp/event/eve_dot.png) no-repeat top left;
    background-size: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto
}

@media screen and (min-width:751px) {
    #eventCalendar .cp-line::after {
        width: 19.2%;
        padding-top: 19.2%;
        background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/pc/event/eve_dot.png) no-repeat bottom left;
        background-size: 100%
    }
}

#eventCalendar .cp-item-content {
    width: 80.4674%
}

#eventCalendar .item-detail {
    position: relative;
    margin-bottom: 20px
}

@media screen and (min-width:751px) {
    #eventCalendar .item-detail {
        margin-bottom: 40px
    }
}

#eventCalendar .item-detail .detail-bnr {
    width: 100%;
    position: relative
}

#eventCalendar .item-detail .detail-bnr.new::after {
    content: "";
    width: 17.0124%;
    padding-top: calc(42 / 82 * 17.0124%);
    background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/sp/event/eve_new.png) no-repeat bottom left;
    background-size: 100%;
    position: absolute;
    top: -10px;
    right: -2.4%
}

@media screen and (min-width:751px) {
    #eventCalendar .item-detail .detail-bnr.new::after {
        top: -20px;
        background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/pc/event/eve_new.png) no-repeat bottom left;
        background-size: 100%
    }
}

#eventCalendar .item-detail .detail-day {
    width: 24.2738%;
    position: absolute;
    top: 25%;
    left: -24.2738%
}

.contents.content-about {
    width: 100%;
    position: relative;
    padding-bottom: 5%;
    padding: 5% 0;
    background: #171733
}

@media screen and (min-width:751px) {
    .contents.content-about {
        border-top: 5px solid #a6905e
    }

    .contents.content-about:before {
        content: none
    }

    .contents.content-about:after {
        content: none
    }
}

.contents.content-about .container {
    width: 95%;
    max-width: 1600px;
    position: relative;
    z-index: 10;
    padding-top: 5%;
    margin: 0 auto
}

.contents.content-about .game-detail-wrapper {
    display: block
}

@media screen and (min-width:751px) {
    .contents.content-about .game-detail-wrapper {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
}

.list_contents_item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column
}

@media screen and (min-width:751px) {
    .list_contents_item {
        height: 100%
    }
}

@media screen and (max-width:750px) {
    .list_contents_item {
        width: 100%
    }
}

.tw_timeline {
    width: 100%
}

.tw_timeline iframe {
    width: 740px !important
}

.follow-btn {
    width: 62.8947%;
    margin: 5% auto;
    max-width: 478px
}

.tweet-btn {
    width: 62.8947%;
    margin: 5% auto;
    max-width: 227px
}

@media screen and (min-width:751px) {
    .game-wrapper {
        position: relative
    }
}

.spec-wrap {
    width: 97%;
    margin: 5% auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

@media screen and (min-width:751px) {
    .spec-wrap {
        width: 90%;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start
    }
}

.spec-wrap .logo {
    width: 37.1929%
}

.spec-wrap .spec-text {
    width: 55.4385%
}

.spec-wrap .spec-text .text {
    color: #fff;
    font-size: 1em
}

.dl-btn-list {
    width: 90%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin: 0 auto 5%;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media screen and (min-width:751px) {
    .dl-btn-list {
        width: 55.4385%;
        position: absolute;
        right: 0;
        bottom: 40%
    }
}

.dl-btn-list li {
    width: 45%
}

.dl-btn-list li:first-child {
    width: 38.5%
}

@media screen and (min-width:751px) {
    .dl-btn-list li:last-child {
        margin-right: 10%
    }
}

.dl-btn-list li a {
    display: block
}

.content-btn {
    text-align: center
}

.modal-content {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    z-index: 9999;
    background: rgba(0, 0, 0, .9);
    display: none;
    font-family: "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", Meiryo, "MS PGothic", sans-serif
}

.modal-content .modal-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0 auto
}

.modal-content .close-btn {
    width: 10.5%;
    position: fixed;
    top: 4.3vw;
    right: 5vw;
    max-width: 123px;
    cursor: pointer;
    z-index: 9999
}

.modal-content .modal-inner {
    position: relative;
    margin: 0 auto;
    height: 100%
}

.modal-content .modal-inner .iframe-wrapper {
    height: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch
}

.modal-content .modal-inner iframe {
    width: 100%;
    height: 100%
}

.loading-anim {
    position: fixed;
    z-index: 99999;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    text-align: center
}

.loading-anim:after,
.loading-anim:before {
    line-height: 1;
    position: fixed;
    z-index: 99;
    right: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 50%;
    margin-right: auto;
    margin-left: auto;
    content: ' ';
    -webkit-transition: all .3s cubic-bezier(.785, .135, .15, .86) 0s;
    transition: all .3s cubic-bezier(.785, .135, .15, .86) 0s;
    -webkit-transition-delay: .3s;
    transition-delay: .3s;
    background-color: #be8a40
}

.loading-anim::before {
    top: 0
}

.loading-anim::after {
    bottom: 0
}

.loading-anim-line {
    line-height: 1;
    position: fixed;
    z-index: 100;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: inline-block;
    overflow: hidden;
    width: 150px;
    height: 1.25em;
    margin: auto;
    -webkit-transition: all .3s cubic-bezier(.785, .135, .15, .86) 0s;
    transition: all .3s cubic-bezier(.785, .135, .15, .86) 0s;
    -webkit-transition-delay: .6s;
    transition-delay: .6s;
    text-align: center
}

.loading-anim-line:before {
    font-size: 1.25em;
    font-weight: 700;
    font-style: normal;
    line-height: 1;
    display: block;
    content: 'ローディング';
    -webkit-animation: loadingAnim_text 1s ease .1s infinite alternate both;
    animation: loadingAnim_text 1s ease .1s infinite alternate both;
    color: #fff;
    will-change: opacity
}

.loading-anim-line:after {
    position: absolute;
    z-index: 100;
    top: 0;
    bottom: 0;
    left: 0;
    display: block;
    width: 0;
    height: 100%;
    margin: auto auto auto 0;
    content: ' ';
    -webkit-animation: loadingAnim 2s ease-in-out .1s infinite normal backwards;
    animation: loadingAnim 2s ease-in-out .1s infinite normal backwards;
    background-color: #fff;
    will-change: transform, width
}

.loaded .loading-anim:before {
    height: 0;
    -webkit-transform: translateY(-1%);
    -ms-transform: translateY(-1%);
    transform: translateY(-1%)
}

.loaded .loading-anim:after {
    height: 0;
    -webkit-transform: translateY(1%);
    -ms-transform: translateY(1%);
    transform: translateY(1%)
}

.loaded .loading-anim-line {
    overflow: hidden;
    height: 0
}

.loaded .loading-anim-line:after,
.loaded .loading-anim-line:before {
    -webkit-animation: none;
    animation: none
}

.loaded .loading-anim-line:before {
    content: ""
}

@-webkit-keyframes loadingAnim {
    0% {
        width: 0
    }

    100% {
        width: 100%;
        -webkit-transform: translate(100%);
        transform: translate(100%)
    }
}

@keyframes loadingAnim {
    0% {
        width: 0
    }

    100% {
        width: 100%;
        -webkit-transform: translate(100%);
        transform: translate(100%)
    }
}

@-webkit-keyframes loadingAnim_text {
    0% {
        opacity: 1;
        color: #cba166
    }

    50% {
        color: #333
    }

    100% {
        opacity: .5;
        color: #fff
    }
}

@keyframes loadingAnim_text {
    0% {
        opacity: 1;
        color: #cba166
    }

    50% {
        color: #333
    }

    100% {
        opacity: .5;
        color: #fff
    }
}

.op-anim {
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/sp/op/op_bg.jpg) no-repeat center;
    background-size: cover;
    z-index: 9999
}

@media screen and (min-width:751px) {
    .op-anim {
        background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/pc/op/op_bg.jpg) no-repeat center;
        background-size: cover
    }
}

.op-anim .op-anim-inner {
    position: relative;
    width: 100%;
    height: 100%
}

.op-anim .op-anim-inner .op-text {
    width: 87.875%;
    max-width: 703px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/sp/op/op_text.png) no-repeat center;
    background-size: 100%;
    padding-top: calc(121 / 703 * 87.875%);
    opacity: 0
}

@media screen and (min-width:751px) {
    .op-anim .op-anim-inner .op-text {
        width: 48.45%;
        max-width: 960px;
        background: url(/wp-content/themes/ikemen/title/kakumei/original/images/3rd/pc/op/op_text.png) no-repeat center;
        background-size: 100%;
        padding-top: calc(60 / 960 * 48.45%)
    }
}

.op-anim .op-anim-inner .op-text.anim {
    -webkit-animation: fadeanim 2s ease forwards;
    animation: fadeanim 2s ease forwards
}

.white-out {
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9000;
    background: #fff
}

@-webkit-keyframes fadeanim {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes fadeanim {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

/*ADD event*/
/* .modal-content {
    height: auto;
    min-height: 100%;
} */

.modal-content .content_wrapper {
    width: 95%;
    max-width: 850px;
    margin: 0 auto;
    padding-top: 25%;
    background-color: transparent;
    height: fit-content;
}

@media screen and (min-width:751px) {
    .modal-content .content_wrapper {
        padding-top: 60px
    }
}

.modal-content .img-box {
    text-align: center;
    margin-bottom: 1em
}

.modal-content .movie-box {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    height: 0;
    overflow: hidden
}

.modal-content .movie-box iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.modal-content .modal-title {
    color: #fff;
    font-size: 20px;
    margin-bottom: 1em;
    font-weight: 700;
    padding-bottom: 10px;
    border-bottom: 1px solid #fff
}

.modal-content .sub-section {
    margin-bottom: 6.4rem;
    font-size: 16px;
    color: #fff
}

.modal-content .sub-section:nth-last-of-type(2) {
    margin-bottom: 1.8rem
}

.modal-content .sub-section .sub-title {
    font-weight: 700;
    margin-bottom: 1em
}

.modal-content .sub-section .ttl {
    font-weight: 700
}

.modal-content .sub-section .text {
    margin-bottom: 1em
}

.modal-content .sub-section .text a {
    word-break: break-all;
    color: #fec640
}

.modal-content .sub-section .notes {
    color: #d3d3d3;
    font-size: 14px;
    margin-bottom: 1em
}

.modal-content .btn-tweet {
    width: 60%;
    max-width: 676px;
    margin: 5% auto
}