@charset "utf-8";

/* CSS INFORMATION -====================================================
File name : top.css
Description : TOPページCSS
===================================================================== */


/* =====================================================================
*    #header
* =================================================================== */

.header {
    position: relative;
}


/* .mainvisual */

.header .mainvisual {
    position: relative;
}

.header .mainvisual .inner>* {
    position: relative;
    z-index: 2;
}

.header_bottom {
    background-color: #ffe100;
    padding: calc(25 / 750 * 100%) 0;
}

.header_bottom::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    background: url(../images/common/bg_line.jpg) repeat-x top left;
    background-size: calc(500 / 750 * 100%) auto;
    width: 100%;
    padding-top: calc(20 / 750 * 100%);
}

.header .mainvisual .inner .site_ttl {
    width: calc(409 / 670 * 100%);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 3;
    margin: calc(-280 / 670 * 100%) auto 0;
}

.header .mainvisual .inner .img_onair {
    width: calc(640 / 670 * 100%);
    margin: 0 auto;
}

.epgTitle {
    color: #ff610c;
}

.addBox {
    width: 86%;
    margin: 3rem auto 0;
    padding: 1rem;
    font-size: 1.1em;
    line-height: 1.5;
    border: #ff610c solid 2px;
}

.addBox dd {
    margin-top: 10px;
}

@media screen and (min-width:700px) {
    .addBox {
        text-align: center;
    }
    .addBox dd {
        margin-top: 5px;
        text-align: left;
    }
}

@media screen and (min-width:700px) {
    .header .mainvisual {}
    .header .mainvisual::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        background: url(../images/top/bg_mv_L.jpg) repeat-x center right/auto 100%;
        width: calc(50% - 645px);
        height: 100%;
    }
    .header .mainvisual::after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        background: url(../images/top/bg_mv_R.jpg) repeat-x center left/auto 100%;
        width: calc(50% - 645px);
        height: 100%;
    }
    .header_bottom {
        padding: 0;
    }
    .header_bottom .inner {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 100%;
        margin: auto;
        padding: 0;
        max-width: 1280px;
    }
    .header_bottom::before {
        display: none;
    }
    .header .mainvisual .inner .site_ttl {
        width: calc(286 / 1280 * 100%);
        margin-top: calc(89 / 1280 * 100%);
    }
    .header .mainvisual .img_mainvisual {
        max-width: 1290px;
        margin-left: auto;
        margin-right: auto;
    }
    .header .mainvisual .inner .img_onair {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        width: calc(448 / 1200 * 100%);
        margin: calc(292 / 1280 * 100%) auto 0;
    }
    .addBox {
        width: 760px;
    }
}

@media screen and (min-width:1280px) {
    .header .mainvisual {}
    .header .mainvisual .inner .site_ttl {}
    .header .mainvisual .inner .img_onair {}
}

@media screen and (min-width:2000px) {
    .header .mainvisual {}
}


/* =====================================================================
*    #main
* =================================================================== */

.main {}

@media screen and (min-width:700px) {
    .main {}
}


/* .banner
---------------------------------------------------------- */

.main .banner {
    background-color: #fff;
}

.main .banner .banner_item_list {
    width: 78.125%;
    padding-top: 13.4375%;
    padding-bottom: 4.6875%;
    margin: auto;
}

.main .banner .banner_item_list .banner_item {
    padding-bottom: 10%;
}

.main .banner .banner_item_list02 {
    width: 100%;
    margin: 0 auto;
}

.main .banner .banner_item_list02 .banner_item {
    padding: 5% 0;
}

.bnr_present {
    width: calc(460 / 670 * 100%);
    margin: calc(60 / 670 * 100%) auto 0;
}

@media screen and (min-width:700px) {
    .main .banner {
        width: 100%;
        position: relative;
    }
    .main .banner::before {
        content: "";
        width: 100%;
        height: 0;
        padding-top: 2.34375%;
        display: block;
        background-color: #FFF;
        position: absolute;
        top: 0;
        left: 0;
        margin-top: -2.34375%;
    }
    .main .banner .banner_item_list {
        width: 73.4375%;
        letter-spacing: -.40em;
        text-align: center;
        padding-top: 3.90625%;
        padding-top: 1%;
        padding-bottom: 3.90625%;
    }
    .main .banner .banner_item_list .banner_item {
        width: 26.5958%;
        display: inline-block;
        vertical-align: top;
        padding-bottom: 0;
        margin: auto 2.1277%;
    }
    .main .banner .banner_item_list02 {
        width: 78.125%;
        margin: 0 auto;
    }
    .bnr_present {
        position: relative;
        width: calc(670 / 1000 * 100%);
        margin: calc(50 / 1000 * 100%) auto 0;
    }
    .bnr_present a::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(255, 0, 100, 0.5);
        border-radius: calc(20 / 670 * 100em);
        opacity: 0;
        transition: .3s ease;
        z-index: 1;
    }
    .bnr_present a:hover::before {
        opacity: 1;
    }
}

@media screen and (min-width:1280px) {
    .main .banner::before {
        padding-top: 30px;
        margin-top: -30px;
    }
}


/* .sns
---------------------------------------------------------- */

.sns {
    background-color: transparent;
    padding-top: 5.3125%;
}

@media screen and (min-width: 700px) {
    .sns {
        padding: 1.5% 0;
        max-width: 200px;
    }
}


/* .pickup
---------------------------------------------------------- */

.main .pickup {
    position: relative;
}

.pickup .contents_ttl {}

.contents_catch {
    text-align: center;
    margin-top: 5.3125%;
}

.contents_catch strong {
    position: relative;
    color: #333333;
    line-height: 1.25em;
    font-weight: 700;
    padding: 0 2em;
    box-sizing: border-box;
    display: inline-block;
}

.contents_catch strong::before,
.contents_catch strong::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    background: url(../images/common/icon_shape1.png) no-repeat center;
    background-size: 100% auto;
    width: calc(24 / 670 * 100%);
    height: 100%;
}

.contents_catch strong::after {
    left: auto;
    right: 0;
}

@media screen and (min-width:640px) {}

@media screen and (min-width:700px) {
    .contents_catch {
        margin-top: 2.65625%;
    }
    .contents_catch strong {
        line-height: 1.25em;
    }
}

@media screen and (min-width:1280px) {}


/* .pickup_list */

.pickup .pickup_list {
    margin: auto;
}

.pickup .pickup_list li {
    background-color: #fff;
    border: 2px solid #d9d9d9;
    box-shadow: 0px 4px 0px 0px #d9d9d9;
    border-radius: 15px;
    overflow: hidden;
    margin: 7.8125% auto 0;
}

.pickup .pickup_list a {
    width: 100%;
    display: block;
    position: relative;
    font-size: 1.1em;
    text-decoration: none;
    color: #3d3b33;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 6.4286% 7.1429% 7.1429%;
}

.pickup .pickup_list .pickup_ttl_wrap {
    position: relative;
    overflow: hidden;
}

.pickup .pickup_list .pickup_ttl_wrap::after {
    content: "";
    width: 100%;
    height: 0;
    display: block;
    padding-top: 1.25%;
    position: absolute;
    bottom: 0;
    left: 0;
}

.pickup .pickup_list .icon::before {
    content: "";
    width: 15.7143%;
    height: 0;
    padding-top: 15.7143%;
    display: block;
    float: left;
    margin-bottom: 7.0834%;
}

.pickup .pickup_list .bn_special {
    margin-bottom: 6.25%;
}

.pickup .pickup_list .pickup_ttl {
    line-height: 1.25em;
    font-weight: bold;
    padding: 1.4em 4.1667% 0.7em 20.8334%;
}

.pickup .pickup_list .special .pickup_ttl {
    padding-left: 4.1667%;
}

.pickup .pickup_list .pickup_date {
    font-size: 0.9em;
    color: #aaa;
    position: absolute;
    top: 0;
    left: 20.8334%;
}

.pickup .pickup_list .special .pickup_date {
    left: 4.1667%;
}

.pickup .pickup_list .pickup_lead {
    line-height: 1.6em;
    position: relative;
    padding-bottom: 8.3334%;
    margin-top: 6.25%;
}

.pickup .pickup_list .pickup_lead::after {
    content: "";
    width: 8.3334%;
    height: 0;
    padding-top: 8.3334%;
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
}

@media screen and (min-width:640px) {
    .pickup .pickup_list li {
        border-radius: 30px;
    }
}

@media screen and (min-width:700px) {
    .pickup .pickup_list {
        margin: 3.90625% auto auto;
    }
    .pickup .pickup_list li {
        margin: 2.9412% auto 0;
    }
    .pickup .pickup_list a {
        overflow: hidden;
        padding: 2.9412% 3.9216% 3.9216%;
    }
    .pickup .pickup_list a::after {
        content: "";
        width: 100%;
        height: 100%;
        display: block;
        background-color: rgba(255, 255, 255, 0.6);
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
        -webkit-transition: opacity 0.2s ease;
        transition: opacity 0.2s ease;
    }
    .pickup .pickup_list a:hover::after {
        opacity: 1;
    }
    .pickup .pickup_list .pickup_ttl_wrap::after {
        padding-top: 0.532%;
    }
    .pickup .pickup_list .icon::before {
        width: 5.3192%;
        padding-top: 5.3192%;
        margin-bottom: 2.3405%;
    }
    .pickup .pickup_list .bn_special {
        width: 21.2766%;
        float: left;
        margin-bottom: 0;
        margin-right: 3.1915%;
    }
    .pickup .pickup_list .pickup_ttl {
        padding-right: 6.383%;
        padding-left: 8.5107%;
    }
    .pickup .pickup_list .special .pickup_ttl {
        padding-right: 8.4508%;
        padding-left: 4.2254%;
    }
    .pickup .pickup_list .pickup_date {
        left: 8.5107%;
    }
    .pickup .pickup_list .pickup_lead {
        line-height: 1.6em;
        padding: 2.1277% 3.1915% 0;
        margin-top: 0;
    }
    .pickup .pickup_list .special .pickup_lead {
        padding-left: 27.6596%;
    }
    .pickup .pickup_list .pickup_lead::after {
        width: 2.1277%;
        padding-top: 2.1277%;
        top: 0;
        bottom: auto;
        margin-top: -5.3192%;
        margin-right: 2.1277%;
    }
}


/* .trend
---------------------------------------------------------- */

.main .trend {
    background: url(../images/common/bg_deco_gray.jpg) repeat center;
    background-size: calc(299 / 750 * 100%) auto;
    position: relative;
}

.main .trend::after {}

.trend .contents_ttl {
    position: relative;
}

.trend .contents_catch strong::before,
.trend .contents_catch strong::after {
    background-image: url(../images/common/icon_shape2.png);
}

.trend .week_ttl {
    position: relative;
    line-height: 1.3em;
    font-weight: bold;
    background-color: #fff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 15px;
    overflow: hidden;
    /*	border: 2px solid #ff0064;*/
    padding: 2% 7.375% 2% 28%;
    margin: 6.25% auto auto;
    box-shadow: 0px 2px 0px 3px #ff0064;
}

.trend .week_ttl::before {
    content: '';
    position: absolute;
    vertical-align: middle;
    color: #fff;
    top: 0;
    bottom: 0;
    margin: auto;
    left: 0;
    width: 23%;
    height: 100%;
    background: url(../images/top/bg_feature.jpg) no-repeat center/cover;
}

.trend .week_date {
    color: #ff0064;
    font-size: 1.1em;
    line-height: 1.25em;
    font-weight: bold;
    text-align: center;
    margin-top: 7.8125%;
}

@media screen and (min-width:640px) {
    .main .trend {}
    .trend .week_ttl {
        border-radius: 30px;
    }
}

@media screen and (min-width:700px) {
    .main .trend {
        background-size: calc(299 / 1280 * 100%) auto;
    }
    .main .trend::after {
        padding-top: 2.34375%;
    }
    .trend .contents_ttl {}
    .trend .week_ttl {
        width: calc(700 / 1000 * 100%);
        line-height: 1.3637em;
        position: relative;
        padding: 1.5% 3% 1.5% 16.5%;
        margin: 2.7344% auto auto;
        box-sizing: border-box;
    }
    .trend .week_ttl::before {
        width: 21.5%;
        -webkit-background-size: cover;
        background-size: cover;
    }
    .trend .week_date {
        line-height: 1.1112em;
        margin-top: 3.90625%;
    }
}

@media screen and (min-width:1280px) {
    .main .trend {
        background-size: 299px auto;
    }
}


/* .week_item_list */

.ttl_present {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background: url(../images/momotan/bg_ribbon.png) no-repeat center/contain;
    padding: 0.6em 0.5em 0.7em;
    font-size: 0.9em;
    font-weight: bold;
    color: #ff0064;
    z-index: 4;
    text-align: center;
    margin-top: -1em;
}

.trend .week_item_list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: auto;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.trend .week_item_list .week_item {
    position: relative;
    margin-top: 6.6667%;
    width: 46.4286%;
}

.week_item_inner {
    border: 2px solid #ff0064;
    box-shadow: 0px 3px 0px 0px rgba(255, 0, 100, 1);
    vertical-align: top;
    letter-spacing: normal;
    background-color: #fff;
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    height: 100%;
}

.trend .week_item_list .week_item::after {
    content: "";
    width: 7.6924%;
    height: 0;
    padding-top: 7.6924%;
    display: block;
    background: url(../images/common/icon_arrow_momotan.jpg) no-repeat center top;
    background-size: 100% auto;
    position: absolute;
    bottom: 0;
    right: 0;
    margin-bottom: 11.5385%;
    margin-right: 11.5385%;
}

.trend .week_item_list .week_item a {
    width: 100%;
    display: block;
    text-decoration: none;
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 11.5385% 11.5385% 23.077%;
}

.week_item_inner::before {
    content: '';
    position: absolute;
    background: url(../images/common/icon_shape1.png) no-repeat center/contain;
    top: 0;
    left: 0;
    width: 7%;
    padding-top: 7%;
    border: 1em solid #fff;
    border-radius: 50%;
    z-index: 1;
}

.week_item_inner a::after {
    content: '';
    position: absolute;
    background: url(../images/common/icon_shape2.png) no-repeat center/contain;
    top: 0;
    right: 0;
    width: 7%;
    padding-top: 7%;
    border: 1em solid #fff;
    border-radius: 50%;
}

.btn_weekdetail .week_item_inner::before,
.btn_weekdetail .week_item_inner a::after {
    display: none;
}

.trend .week_item_list .week_item .photo {
    width: 64.6154%;
    border-radius: 10px;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: 11.5385% auto auto;
}

.trend .week_item_list .week_item .name {
    line-height: 1.25em;
    color: #ff0064;
    font-weight: bold;
    position: relative;
    padding-top: 105%;
    word-break: break-all;
}

.trend .week_item_list .week_item .name::before {
    content: "";
    width: 100%;
    height: 0;
    padding-top: 3%;
    display: block;
    background-color: #ff0064;
    position: absolute;
    top: 0;
    left: 0;
    margin-top: 94%;
}

.trend .week_item_list .btn_weekdetail .week_item_inner {
    background: url(../images/common/bg_deco_pink.jpg) repeat center/contain;
    background-size: 70% auto;
    height: 100%;
}

.trend .week_item_list .btn_weekdetail::after {
    background: url(../images/common/icon_arrow_white.png) no-repeat center top;
    background-size: 100% auto;
}

.trend .week_item_list .week_item.btn_weekdetail a {
    height: 100%;
    padding: 11.5385% 7.6924% 23.077%;
}

.trend .week_item_list .week_item.btn_weekdetail a img {
    position: relative;
    margin-top: 20%;
}

@media screen and (min-width:640px) {
    .trend .week_item_list .week_item {
        border-radius: 20px;
    }
    .trend .week_item_list .week_item .photo {
        border-radius: 20px;
    }
}

@media screen and (min-width:700px) {
    .ttl_present {
        padding: 0.7em 0.5em 0.8em;
    }
    .trend .week_item_list {
        width: 79.6875%;
        padding-top: 1.5625%;
    }
    .trend .week_item_list::after {
        content: "";
        width: 31.3726%;
        display: block;
    }
    .trend .week_item_list .week_item {
        width: 30%;
        margin-top: 1em;
        cursor: pointer;
    }
    .trend .week_item_list .week_item a::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(255, 0, 100, 0.5);
        opacity: 0;
        -webkit-transition: .3s;
        transition: .3s;
        z-index: 3;
    }
    .trend .week_item_list .week_item a:hover::before {
        opacity: 1;
    }
    .trend .week_item_list .week_item::after {
        width: 6.25%;
        padding-top: 6.25%;
        margin-bottom: 9.375%;
        margin-right: 6.25%;
    }
    .trend .week_item_list .week_item a {
        height: 100%;
        padding: 9.375% 6.25% 15.625%;
    }
    .trend .week_item_list .week_item a:hover::before {
        opacity: 1;
    }
    .week_item_inner::before,
    .week_item_inner a::after {
        width: 5%;
        padding-top: 5%;
        border-width: .6em;
    }
    .trend .week_item_list .week_item .photo {
        width: 52.5%;
        margin: 9.375% auto auto;
    }
    .trend .week_item_list .week_item .name {
        line-height: 1.25em;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding: 77.1429% 0 3% 22%;
    }
    .trend .week_item_list .week_item .name::before {
        padding-top: 1.7858%;
        margin-top: 70.7143%;
    }
    .trend .week_item_list .week_item .name::after {
        content: "";
        width: 17.8572%;
        height: 0;
        padding-top: 17.8572%;
        display: block;
        background: url(../images/common/icon_momotan.jpg) no-repeat center top;
        background-size: 100% auto;
        position: absolute;
        top: 0;
        left: 0;
        margin-top: 78.5715%;
    }
    .trend .week_item_list .week_item.btn_weekdetail a {
        padding: 10% 12% 27%;
    }
}


/* .movie
---------------------------------------------------------- */

.main .movie {
    background-color: #ffd904;
    position: relative;
    padding-bottom: 18.75%;
}

.main .movie::after {
    content: "";
    width: 100%;
    height: 0;
    padding-top: 4.6875%;
    display: block;
    background: url(../images/top/bg_movie_bottom.png) repeat-x center bottom;
    background-size: auto 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}

.main .movie::before {
    content: "";
    width: 90.625%;
    height: 0;
    padding-top: 114.0625%;
    display: block;
    background: url(../images/common/bg_movie_sp.jpg) no-repeat center top;
    background-size: 100% auto;
    position: absolute;
    top: 0;
    left: 50%;
    margin: 40.625% auto auto -45.3125%;
}

.movie .contents_ttl {
    width: 62.5%;
    position: relative;
    padding-top: 10.9375%;
    margin: auto;
}

.movie .contents_ttl::before {
    content: "";
    width: 172.5%;
    height: 0;
    padding-top: 45%;
    display: block;
    background: url(../images/top/bg_movie_ttl_sp.png) no-repeat center top;
    background-size: 100% auto;
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -86.25%;
}

.movie .contents_catch {
    text-align: center;
    margin-top: 6.25%;
}

.movie .contents_catch strong {
    color: #333333;
    line-height: 1.25em;
    font-family: "Rounded Mplus 1c";
    font-weight: 700;
}

.movie .week_date {
    line-height: 1.25em;
    font-weight: bold;
    text-align: center;
    margin-top: 6.25%;
}

.movie .week_bc_wrap {
    width: 87.5%;
    position: relative;
    background: url(../images/top/bg_movie_week_bc.jpg) repeat center top;
    background-size: 5.3125% auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 15px;
    overflow: hidden;
    padding: 3.125%;
    margin: 7.8125% auto auto;
}

.movie .week_bc_wrap .week_bc {
    background-color: #ffd904;
    border-radius: 5px;
    padding: 1.9231%;
}

.movie .week_bc .week_bc_inner {
    width: 100%;
    padding-top: 56.25%;
    position: relative;
}

.movie .week_comment {
    width: 87.5%;
    line-height: 1.5em;
    text-align: center;
    margin: 4.6875% auto auto;
}

.movie .week_guest {
    width: 76.5625%;
    line-height: 1.1em;
    font-weight: bold;
    text-align: center;
    border-radius: 15px;
    background-color: #fff;
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 3.125% 7.8125% 3.125% 10.9375%;
    margin: 7.8125% auto auto;
}

.movie .week_guest::after {
    content: "";
    width: 21.2245%;
    height: 0;
    padding-top: 22.8572%;
    display: block;
    background: url(../images/top/bg_movie_guest.png) no-repeat center top;
    background-size: 100% auto;
    position: absolute;
    top: 0;
    left: 0;
    margin: -6.5307% auto auto -11.0205%;
}

@media screen and (min-width:640px) {
    .main .movie {
        padding-bottom: 120px;
    }
    .main .movie::after {
        padding-top: 30px;
    }
    .main .movie::before {
        width: 580px;
        padding-top: 730px;
        margin: 260px auto auto -290px;
    }
    .movie .week_bc_wrap {
        border-radius: 30px;
    }
    .movie .week_bc_wrap .week_bc {
        border-radius: 10px;
    }
    .movie .week_guest {
        border-radius: 30px;
    }
}

@media screen and (min-width:700px) {
    .main .movie {
        padding-bottom: 9.375%;
    }
    .main .movie::after {
        padding-top: 2.34375%;
    }
    .main .movie::before {
        width: 131.25%;
        padding-top: 64.0625%;
        background: url(../images/common/bg_movie_pc.jpg) no-repeat center top;
        background-size: 100% auto;
        margin: 11.71875% auto auto -65.625%;
    }
    .movie .contents_ttl {
        width: 31.25%;
        padding-top: 8.59375%;
    }
    .movie .contents_ttl::before {
        width: 217.5%;
        padding-top: 75%;
        background: url(../images/top/bg_movie_ttl_pc.png) no-repeat center top;
        background-size: 100% auto;
        margin-left: -108.75%;
        margin-bottom: -45%;
    }
    .movie .contents_catch {
        margin: 3.125% auto auto;
    }
    .movie .contents_catch strong {
        line-height: 1.25em;
    }
    .movie .week_date {
        line-height: 1.2em;
        margin-top: 3.125%;
    }
    .movie .week_bc_wrap {
        width: 59.375%;
        background: url(../images/top/bg_movie_week_bc.jpg) repeat center top;
        background-size: 2.65625% auto;
        padding: 1.5625%;
        margin: 3.59375% auto auto;
    }
    .movie .week_bc_wrap .week_bc {
        padding: 1.3889%;
    }
    .movie .week_comment {
        width: 59.375%;
        line-height: 1.7em;
        font-weight: bold;
        text-align: center;
        margin: 2.34375% auto auto;
    }
    .movie .week_guest {
        width: 31.25%;
        line-height: 1.3637em;
        padding: 1.171875% 3.90625%;
        margin: 3.125% auto auto;
    }
    .movie .week_guest::after {
        width: 21.75%;
        padding-top: 23.5%;
        margin: -7% auto auto -12.5%;
    }
}

@media screen and (min-width:1280px) {
    .main .movie {
        padding-bottom: 120px;
    }
    .main .movie::after {
        padding-top: 30px;
    }
    .main .movie::before {
        width: 1680px;
        padding-top: 820px;
        margin: 150px auto auto -840px;
    }
}


/* .btn_more */

.movie .btn_more {
    width: 62.5%;
    position: relative;
    margin: 7.8125% auto 1.5625%;
}

.movie .btn_more::before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    background-color: #c44b0a;
    border-radius: 200px;
    position: absolute;
    bottom: 0;
    left: 0;
    margin-bottom: -2.5%;
}

.movie .btn_more a {
    width: 100%;
    display: block;
    position: relative;
}

.movie .btn_more a>* {
    position: relative;
}

.movie .btn_more a::before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    background-color: #ff610c;
    border-radius: 200px;
    position: absolute;
    top: 0;
    left: 0;
}

@media screen and (min-width:700px) {
    .movie .btn_more {
        width: 31.25%;
        margin: 3.90625% auto 0.78125%;
    }
    .movie .btn_more a {
        height: 0;
        padding-top: 20%;
    }
    .movie .btn_more a::after {
        content: "";
        width: 100%;
        height: 100%;
        display: block;
        background: url(../images/top/bg_more_hover.png) repeat center top;
        background-size: 17px auto;
        border-radius: 200px;
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
    }
    .movie .btn_more a img {
        position: absolute;
        top: 0;
        left: 0;
    }
    .movie .btn_more a:hover img {
        top: 6.25%;
    }
    .movie .btn_more a:hover::before {
        margin-top: 1.25%;
    }
    .movie .btn_more a:hover::after {
        opacity: 1;
        margin-top: 1.25%;
    }
}


/* .news
---------------------------------------------------------- */

.main .news {
    position: relative;
}

.news .contents_ttl {}

.news .contents_catch strong::before,
.news .contents_catch strong::after {
    background-image: url(../images/common/icon_shape3.png);
}

@media screen and (min-width:640px) {
    .main .news {}
}

@media screen and (min-width:700px) {
    .main .news {}
    .news .contents_ttl {}
    .news .contents_catch {}
    .news .contents_catch strong {}
}

@media screen and (min-width:1280px) {
    .main .news {}
}


/* .news_item_list */

.news .news_item_list {
    background-color: #fff;
    border: 2px solid #d9d9d9;
    box-shadow: 0px 6px 0px 0px #d9d9d9;
    border-radius: 15px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 3.125% 5.25%;
    margin: 6.25% auto auto;
}

.news .news_item_list .date {
    color: #aaaaaa;
    line-height: 1.25em;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 8.3334%;
    padding-bottom: 3.25%;
}

.news .news_item_list .title {
    font-size: 1.1em;
    line-height: 1.6em;
    position: relative;
    padding-bottom: 7.6667%;
}

.news .news_item_list .title:not(:last-of-type) {
    border-bottom: 1px dotted #aaaaaa;
}

.news .news_item_list .title a {
    -webkit-text-decoration: underline solid #ff0064;
    text-decoration: underline solid #ff0064;
    color: #3d3b33;
}

@media screen and (min-width:700px) {
    .news .news_item_list {
        display: flex;
        flex-wrap: wrap;
        padding: 2.5625% 6.125%;
        margin: 8% auto auto;
    }
    .news .news_item_list .date {
        flex-shrink: 0;
        width: 20%;
        line-height: 2.1429em;
        position: relative;
        padding: 2.1277% 0 2.1277% 1.1277%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    .news .news_item_list .date:not(:last-of-type) {
        border-bottom: 1px dotted #aaaaaa;
    }
    .news .news_item_list .date::after {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        margin: auto;
        width: 1.3334%;
        height: 0;
        padding-top: 13.3334%;
        background-color: #e11f51;
    }
    .news .news_item_list .title {
        position: relative;
        width: 80%;
        font-weight: bold;
        line-height: 1.875em;
        padding: 2.1277% 6.383% 2.1277% 3%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    .news .news_item_list .title::before {
        content: '';
        display: block;
        position: absolute;
        top: 50%;
        right: 0;
        transform: translateY(-50%);
        width: 1em;
        padding-top: 1em;
        background: url(../images/common/icon_arrow_momotan.jpg) no-repeat center top;
        background-size: 100% auto;
    }
}


/*  .twitter
---------------------------------------------------------- */

.main .twitter {
    background: url(../images/common/bg_deco_gray.jpg) repeat center;
    background-size: calc(299 / 750 * 100%) auto;
    position: relative;
}

.twitter .contents_ttl {}

.twitter .twitter_feed {
    background: #fff;
    margin: 12% auto 0;
    padding: 2rem 0;
    /* background: url(../images/common/bg_deco_blue.jpg) repeat center; */
    background-size: calc(248 / 750 * 100%) auto;
    border-radius: 22px;
}

.twitter .twitter-timeline {
    margin: 0 auto;
    width: calc(100% - 4rem) !important;
}

.twitter iframe {
    width: 100% !important;
}

.btn_insta {
    margin-top: 6%;
}

@media screen and (min-width: 640px) {}

@media screen and (min-width: 700px) {
    .main .twitter {
        background-size: calc(299 / 1200 * 100%) auto;
    }
    .twitter .contents_ttl {}
    .twitter .twitter_feed {
        width: calc(640 / 1000 * 100%);
        margin: 8% auto 0;
        padding: 4rem 0;
        border-radius: 30px;
        box-sizing: border-box;
    }
    .twitter .twitter-timeline {
        width: calc(100% - 8rem) !important;
    }
    .btn_insta {
        width: calc(640 / 1000 * 100%);
        margin: 5em auto;
    }
    .btn_insta {
        -webkit-transition: .3s;
        -o-transition: .3s;
        transition: .3s;
    }
    .btn_insta:hover {
        opacity: .7;
    }
}

@media screen and (min-width: 1280px) {
    .main .twitter {
        background-size: 299px auto;
    }
}


/* .other
---------------------------------------------------------- */

.other {
    background: url(../images/common/bg_deco.jpg) repeat center;
    background-size: calc(499 / 750 * 100%) auto;
    position: relative;
    padding: calc(60 / 750 * 100%) 0 calc(120 / 750 * 100%);
}

.other .other_btn_list {
    text-align: center;
    letter-spacing: -.40em;
    padding-top: 12.5%;
    padding-bottom: 7.8125%;
}

.other .other_btn_list li {
    margin-bottom: 1em;
}

.other .other_btn_list li a {
    display: block;
    background-color: #fff;
    border-radius: 2rem;
    padding: 3rem 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
}

.other .other_btn_list li a::after {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 0;
    height: 0;
    border-left: 1.5rem solid transparent;
    border-bottom: 1.5rem solid #ff0064;
    margin: 0 1.2rem 1.2rem 0;
}

.other .other_btn_list li:nth-child(1) a img {
    width: calc(159 / 670 * 100%);
    margin: 0 auto;
}

.other .other_btn_list li:nth-child(2) a img {
    width: calc(262 / 670 * 100%);
    margin: 0 auto;
}

@media screen and (min-width:640px) {}

@media screen and (min-width:700px) {
    .other {
        background-size: calc(499 / 1200 * 100%) auto;
        padding: 0;
    }
    .other .other_btn_list {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        justify-content: space-around;
        padding: calc(50 / 1000 * 100%) 0;
    }
    .other .other_btn_list li {
        width: calc(400 / 1000 * 100%);
    }
    .other .other_btn_list li a {
        padding: 6rem 0;
        overflow: hidden;
    }
    .other .other_btn_list li:nth-child(1) a img {
        width: calc(119 / 400 * 100%);
    }
    .other .other_btn_list li:nth-child(2) a img {
        width: calc(196 / 400 * 100%);
    }
    .other .other_btn_list li a::after {
        border-left: 2.5rem solid transparent;
        border-bottom: 2.5rem solid #ff0064;
    }
}

@media screen and (min-width: 1200px) {
    .other {
        background-size: 499px auto;
    }
}


/*
　公式SNSへのリンクボタン
 */

.sns_official {
    width: 85%;
    margin: 10px auto;
}

.sns_official ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.sns_official .sns_official_li {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.sns_official .sns_official_li img {
    width: 90%;
    display: block;
    margin: 0 auto;
}

@media screen and (min-width:700px) {
    .sns_official {
        position: fixed;
        right: 20px;
        bottom: 150px;
        width: auto;
        z-index: 110;
    }
    .sns_official ul {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .sns_official .sns_official_li:first-child {
        margin: 0 0 20px;
    }
}


/* =====================================================================
*    共通：シェアボタン
* =================================================================== */