/* CSS INFORMATION -====================================================
File name : top.css
Description :
===================================================================== */

/* =====================================================================
*    mv
* =================================================================== */
.header {
}

.mv {
    background: url(../images/bg_mv_circle_sp.png) no-repeat left top, url(../images/bg_mv_dot.png) repeat left top;
    background-size: 100% auto, calc(22 / 750 * 100%) auto;
}

.mv .inner {
    width: 100%;
}

.mv_ttl {
    width: calc(377 / 750 * 100%);
    position: absolute;
    top: 0;
    left: 0;
    margin: calc(66 / 750 * 100%) 0 0 calc(30 / 750 * 100%);
}

.mv_photo {
}

.mv_share {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: calc(130 / 750 * 100%);
    position: absolute;
    top: 0;
    right: 0;
    margin: calc(10 / 750 * 100%) calc(30 / 750 * 100%) 0 0;
}

.mv_share li {
    width: calc(58 / 130 * 100%);
}
    
    .x_button {
        width: 80%;
        margin: auto;
        display: block;
    }
@media screen and (min-width: 768px) {
    .mv {
        background: url(../images/bg_mv_circle_pc.png) repeat-x center center, url(../images/bg_mv_dot.png) repeat center top;
        background-size: calc(1559 / 1100 * 100%) auto, calc(22 / 1100 * 100%) auto;
    }

    .mv_ttl {
        width: calc(387 / 1100 * 100%);
        margin: calc(6 / 1100 * 100%) 0 0 calc(48 / 1100 * 100%);
    }

    .mv_photo {
        width: calc(649 / 1100 * 100%);
        margin: 0 calc(48 / 1100 * 100%) 0 auto;
    }

    .mv_share {
        width: calc(90 / 1100 * 100%);
        margin: calc(10 / 1100 * 100%) calc(48 / 1100 * 100%) 0 0;
    }

    .mv_share li {
        width: calc(40 / 90 * 100%);
    }

    .mv_share li a:hover {
        opacity: 0.7;
    }
    
    .x_button {
        width: 80%;
        margin: auto;
        display: block;
    }

}

@media screen and (min-width: 1100px) {
    .mv {
        background-size: 1559px auto, 22px auto;
    }
}


/* =====================================================================
*    main
* =================================================================== */
.sec_ttl {
    width: calc(431 / 690 * 100%);
    margin: 0 auto;
    padding: calc(55 / 690 * 100%) 0 calc(30 / 690 * 100%);
    position: relative;
    z-index: 2;
}

@media screen and (min-width: 768px) {
    .sec_ttl {
        width: calc(288 / 864 * 100%);
        padding: calc(35 / 864 * 100%) 0 calc(32 / 864 * 100%);
    }
    
}


/* =====================================================================
*    what
* =================================================================== */
.what {
    padding: calc(30 / 750 * 100%) 0 calc(48 / 750 * 100%);
    background: url(../images/bg_pink_over_sp.png) no-repeat left top, url(../images/bg_pink_under_sp.png) no-repeat left bottom #e62e87;
    background-size: 100% auto;
}

.onair {
    margin: 0 auto calc(30 / 750 * 100%);
}

.what_frame {
    position: relative;
    background: url(../images/bg_what_frame_sp.png) no-repeat left top;
    background-size: 100% auto;
    padding: 0 0 0.5%;
}

.what_txt {
    width: calc(535 / 690 * 100%);
    margin: 0 auto calc(80 / 690 * 100%);
}

.what_subttl {
    width: calc(431 / 690 * 100%);
    margin: 0 auto calc(30 / 690 * 100%);
}

.what_nav {

}

.what_nav li {
    margin: 0 0 5%;
}

.what_nav li:last-child {
    margin: 0;
}

.what_nav_photo {
    width: calc(196 / 690 * 100%);
    margin: 0 auto calc(20 / 690 * 100%);
}

.what_nav_name {

}

.what_nav_name dt {
    width: calc(365 / 690 * 100%);
    margin: 0 auto 2%;
}

.what_nav li:last-child .what_nav_name dt {
    width: calc(245 / 690 * 100%);
}

.what_nav_name dd {
    width: calc(590 / 690 * 100%);
    margin: 0 auto;
    color: #fff;
    font-size: 1.1rem;
    line-height: 1.4;
}

@media screen and (min-width: 768px) {
    .what {
        padding: calc(50 / 1100 * 100%) 0;
        background: url(../images/bg_pink_over_pc.png) no-repeat center top, url(../images/bg_pink_under_pc.png) no-repeat center bottom #e62e87;
        background-size: calc(1700 / 1100 * 100%) auto;
    }

    .onair {
        width: calc(310 / 1100 * 100%);
        margin: calc(-235 / 1100 * 100%) 0 0 calc(48 / 1100 * 100%);
        position: absolute;
        top: 0;
        left: 0;
    }

    .what_frame {
        width: calc(864 / 1100 * 100%);
        background: url(../images/bg_what_frame_pc.png) no-repeat left top;
        background-size: 100% auto;
        padding: 0 0 1%;
        margin: 0 auto;
    }

    .what_txt {
        width: calc(688 / 864 * 100%);
        margin: 0 auto calc(50 / 864 * 100%);
    }

    .what_subttl {
        width: calc(288 / 864 * 100%);
        margin: 0 auto calc(30 / 864 * 100%);
    }

    .what_nav {
        width: calc(594 / 864 * 100%);
        margin: 0 auto;
    }

    .what_nav li {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .what_nav_photo {
        width: calc(130 / 594 * 100%);
        margin: 0;
    }

    .what_nav_name {
        width: calc(444 / 594 * 100%);
    }

    .what_nav_name dt {
        width: calc(244 / 444 * 100%);
        margin: 0 0 2%;
    }

    .what_nav_name dd {
        width: 100%;
        margin: 0;
        font-size: 1.35rem;
        line-height: 1.6;
    }

    .what_nav li:last-child .what_nav_name dt {
        width: calc(164 / 444 * 100%);
    }
}

@media screen and (min-width: 1100px) {
    .what {
        padding: 50px 0;
        background-size: 1700px auto;
    }
}


/* =====================================================================
*    info
* =================================================================== */
.info {
    padding: calc(48 / 750 * 100%) 0;
    background: url(../images/bg_mv_dot.png) repeat center top;
    background-size: calc(22 / 750 * 100%) auto;
}

.info_frame {
    position: relative;
}

.info_frame::before, .info_frame::after {
    content: "";
    display: block;
    width: 100%;
    padding-top: calc(26 / 690 * 100%);
    background: url(../images/bg_info_over_sp.png) no-repeat left top;
    background-size: 100% auto;
}

.info_frame::after {
    background: url(../images/bg_info_under_sp.png) no-repeat left top;
    background-size: 100% auto;
}

.info_bg {
    background: url(../images/bg_info_center_sp.png) repeat-y left top;
    background-size: 100% auto;
    padding: calc(30 / 690 * 100%) 0;
}

.info .sec_ttl {
    padding: 0;
    margin: 0 auto calc(30 / 690 * 100%);
}

.info_list {
    width: calc(590 / 690 * 100%);
    margin: 0 auto;
}

.info_list li {
    margin: 0 0 7%;
}

.info_list li:last-child {
    margin: 0;
}

.info_txt dt {
    position: relative;
    padding: 0 0 2.5% 2.1em;
    margin: 0 0 2%;
    font-size: 1.3rem;
    font-weight: bold;
    line-height: 1.5;
    border-bottom: 3px dotted #adadad;
}

.info_txt dt::before {
    content: "";
    display: inline-block;
    width: 1.45em;
    height: 1.45em;
    background: url(../images/img_info_heart.png) no-repeat left top;
    background-size: 100% auto;
    position: absolute;
    top: 0;
    left: 0;
}

.info_txt dd {
    font-size: 1.1rem;
    line-height: 1.5;
}

.info_photo {
    margin: 3% 0 0;
}

/* .info_photo img {
    border: 2px solid #f3e500;
}
 */

@media screen and (min-width: 768px) {
    .info {
        padding: calc(50 / 1100 * 100%) 0;
        background-size: calc(22 / 1100 * 100%) auto;
    }

    .info_frame {
        width: calc(864 / 1100 * 100%);
        margin: 0 auto;
    }

    .info_frame::before, .info_frame::after {
        padding-top: calc(26 / 864 * 100%);
        background: url(../images/bg_info_over_pc.png) no-repeat left top;
        background-size: 100% auto;
    }

    .info_frame::after {
        background: url(../images/bg_info_under_pc.png) no-repeat left top;
        background-size: 100% auto;
    }

    .info_bg {
        background: url(../images/bg_info_center_pc.png) repeat-y left top;
        background-size: 100% auto;
        padding: calc(30 / 864 * 100%) 0 calc(20 / 864 * 100%);
    }

    .info_list {
        width: calc(762 / 864 * 100%);
        margin: 0 auto;
    }

    .info_list li {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        margin: 0 0 4%;
    }

    .info_txt {
        width: calc(432 / 762 * 100%);
        -webkit-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        margin: 0;
    }

    .info_txt dt {
        padding: 0 0 1% 1.9em;
        font-size: 2.3rem;
        border-width: 2px;
    }

    .info_txt dt::before {
        width: 1.56em;
        height: 1.56em;
        margin: -0.15em 0 0;
    }

    .info_txt dd {
        font-size: 1.45rem;
    }

    .info_photo {
        -ms-flex-preferred-size: calc(300 / 762 * 100%);
        flex-basis: calc(300 / 762 * 100%);
        margin: 3% 0 0 3.5%;
    }
}

@media screen and (min-width: 1100px) {
    .info {
        padding: 50px 0;
        background-size: 22px auto;
    }
}


/* =====================================================================
*    entame
* =================================================================== */
.entame {
    padding: calc(48 / 750 * 100%) 0;
    background: url(../images/bg_entame.png) repeat center top;
    background-size: calc(260 / 750 * 100%) auto;
}

.entame .sec_ttl {
    padding: 0;
    margin: 0 auto calc(20 / 690 * 100%);
}

.entame_onair {
    color: #f3e500;
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 1.5;
    text-align: center;
    margin: 0 0 2%;
}

.entame_onair span {
    display: block;
    font-weight: bold;
}

.entame_frame {
    position: relative;
}

.entame_frame::before, .entame_frame::after {
    content: "";
    display: block;
    width: 100%;
    padding-top: calc(26 / 690 * 100%);
    background: url(../images/bg_info_over_sp.png) no-repeat left top;
    background-size: 100% auto;
}

.entame_frame::after {
    background: url(../images/bg_info_under_sp.png) no-repeat left top;
    background-size: 100% auto;
}

.entame_bg {
    background: url(../images/bg_info_center_sp.png) repeat-y left top;
    background-size: 100% auto;
    padding: calc(30 / 690 * 100%) 0 calc(4 / 690 * 100%);
}

.entame_cate {

}



.entame .info_list li {
    border-bottom: 3px dotted #999;
    padding: 0 0 5.5%;
    margin: 0 0 4%;
}

.entame .info_list li:last-child {
    border-bottom: 0;
    padding: 0;
    margin: 0;
}

.entame .info_txt {
}

.entame .info_txt dt {
    border: 0;
    padding: 0;
    margin: 0;
}

.entame .info_txt dt::before {
    display: none;
}

.entame_txt_cate {
    display: inline-block;
    padding: 1% 1.5%;
    margin: 0 0 2.5%;
    font-size: 0.9rem;
    line-height: 1;
    background-color: #e62e87;
    color: #fff;
}

.entame_txt_ttl {
    display: block;
    font-size: 1.2rem;
    font-weight: bold;
    line-height: 1.5;
}

.entame .info_txt dd {
    font-size: 0.95rem;
    line-height: 1.7;
}

.entame .info_photo img {
    border-color: #fff;
}

.info_txt dd a {
  display: inline;
  color: #000;
  text-decoration: none;
  border-bottom: 1px dotted #000;
}

.info_txt dd a:hover {
  color: #e62e87;
  border-bottom: 1px dotted #e62e87;
}

.info_txt dd a::before {
  content: "» ";
}

@media screen and (min-width: 768px) {
    .entame {
        padding: calc(50 / 1100 * 100%) 0;
        background-size: calc(260 / 1100 * 100%) auto;
    }

    .entame .sec_ttl {
        width: calc(288 / 1100 * 100%);
        margin: 0 auto calc(20 / 1100 * 100%)
    }

    .entame_onair {
        font-size: 2.7rem;
    }

    .entame_onair span {
        display: inline-block;
        position: relative;
    }

    .entame_onair span::after {
        content: "・";
        display: inline-block;
    }

    .entame_onair span:last-child::after {
        display: none;
    }

    .entame_frame {
        width: calc(864 / 1100 * 100%);
        margin: 0 auto;
    }

    .entame_frame::before, .entame_frame::after {
        padding-top: calc(26 / 864 * 100%);
        background: url(../images/bg_info_over_pc.png) no-repeat left top;
        background-size: 100% auto;
    }

    .entame_frame::after {
        padding-top: calc(100 / 864 * 100%);
        background: url(../images/bg_info_under_pc.png) no-repeat left top;
        background-size: 100% auto;
        /* margin: calc(-74 / 864 * 100%) 0 0; */
    }

    .entame_bg {
        background: url(../images/bg_info_center_pc.png) repeat-y left top;
        background-size: 100% auto;
        padding: calc(20 / 864 * 100%) 0 calc(21 / 864 * 100%);
    }

    .entame .info_list li {
        padding: 0 0 4%;
        margin: 0 0 4%;
        border-width: 2px;
    }

    .entame_txt_cate {
        padding: 0.4em 0.6em 0.28em;
        margin: 0 0 0.7em;
        font-size: 1.5rem;
    }

    .entame_txt_ttl {
        font-size: 2rem;
    }

    .entame .info_txt dd {
        font-size: 1.6rem;
    }
}

@media screen and (min-width: 1100px) {
    .entame {
        padding: 50px 0;
        background-size: 260px auto;
    }
}


/* =====================================================================
*    twitter
* =================================================================== */
.twitter {
    padding: calc(48 / 750 * 100%) 0;
    background: url(../images/bg_mv_dot.png) repeat center top;
    background-size: calc(22 / 750 * 100%) auto;
}

.twitter_frame {
    position: relative;
    margin-top: 4%;
}

.twitter_frame::before, .twitter_frame::after {
    content: "";
    display: block;
    width: 100%;
    padding-top: calc(26 / 690 * 100%);
    background: url(../images/bg_twitter_sp.png) no-repeat left top;
    background-size: 100% auto;
}

.twitter_frame::after {
    background: url(../images/bg_info_under_sp.png) no-repeat left top;
    background-size: 100% auto;
}

.twitter_bg {
    background: url(../images/bg_info_center_sp.png) repeat-y left top;
    background-size: 100% auto;
    padding: calc(30 / 690 * 100%) 0;
}

.twitter .sec_ttl {
    padding: 0;
    margin: 0 auto calc(30 / 690 * 100%);
}

.twitter_box {
    width: calc(540 / 690 * 100%);
    height: 16.5em !important;
    margin: 0 auto;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
}

.twitter_box iframe {
    width: 500px !important;
}

@media screen and (min-width: 768px) {
    .twitter {
        padding: calc(50 / 1100 * 100%) 0;
        background-size: calc(22 / 1100 * 100%) auto;
    }

    .twitter_frame {
        width: calc(864 / 1100 * 100%);
        margin: 4% auto 0;
    }

    .twitter_frame::before, .twitter_frame::after {
        padding-top: calc(26 / 864 * 100%);
        background: url(../images/bg_twitter_pc.png) no-repeat left top;
        background-size: 100% auto;
    }

    .twitter_frame::after {
        background: url(../images/bg_info_under_pc.png) no-repeat left top;
        background-size: 100% auto;
    }

    .twitter_bg {
        background: url(../images/bg_info_center_pc.png) repeat-y left top;
        background-size: 100% auto;
        padding: calc(30 / 864 * 100%) 0 calc(10 / 864 * 100%);
    }

    .twitter .sec_ttl {
        margin: 0 auto calc(30 / 864 * 100%)
    }

    .twitter_box {
        height: 22em !important;
    }

    .twitter_box iframe {
        width: 100% !important;
    }
}

@media screen and (min-width: 1100px) {
    .twitter {
        padding: 50px 0;
        background-size: 22px auto;
    }
}
/* =====================================================================
*    バナーエリア　2019.10.21追記
* =================================================================== */
.special_bnr{
	width:750px;
	margin:10px auto 50px;
}
@media screen and (max-width: 768px) {
.special_bnr{
	width:90%;
	margin:10px auto 50px;
}
}