@charset "utf-8";

img {
    pointer-events: none;
}
.mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider,
.mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider:nth-of-type(-n+3){
    display: none!important;
}
.mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider.slick-slider.slick-initialized,
.mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider:nth-of-type(-n+3).slick-initialized{
    display: block!important;
}
.LoadingWrapper{
    position: relative;
}

@media(min-width: 769px) {
    /* Loadingアニメーション */
    .osusume_wrap .LoadingWrapper{
        min-height: 370px;
    }
    .genre_wrap .LoadingWrapper{
        min-height: 328px;
        margin: 0 auto 40px;
    }
    .LoadingWrapper .loading{
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: rgba(0,0,0,0.8);
        border-radius: 4px;
        color: #fff;
    }
    .LoadingWrapper .loading .l-parts{
        font-size: 20px;
        color: #fff;
        font-weight: 300;
        text-align: center;
        position: absolute;
        width: 217px;
        height: 217px;
        top: calc(50% - 108px);
        left: calc(50% - 108px);
    }

    .LoadingWrapper .loading .loading-circle{
        background: url(../img/load_circle.png) no-repeat center center;
        animation: loading-circle 1.5s cubic-bezier(0.445, 0.05, 0.55, 0.95) infinite;
    }
    @keyframes loading-circle {
        0% {transform: rotate(0deg);}
        100% {transform: rotate(360deg);}
    }

    .LoadingWrapper .loading .loading-txt{
        font-size: 18px;
        color: #fff;
        top: 50%;
        margin-top: -15px;
        animation: loading-txt 1.5s infinite;
    }

    @keyframes loading-txt {
        0% {opacity: 0;}
        50% {opacity: 1;}
        100% {opacity: 0;}
    }

    /* -- common -- */
    body {
        font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック体", YuGothic, "游ゴシック Medium", "YuGothic M", "メイリオ", Meiryo, sans-serif;
    }
    .mainContents .sp {
        display: none !important;
    }

    .mainContents .mainContentsIn {
        max-width: 100%;
        margin: 0 auto;
    }

    .mainContents section {
        max-width: 100%;
        margin: 0 auto;
    }

    .mainContents img {
        max-width: 100%;
    }

    .mainContents a {
        color: #000000;
    }

    /* -- kvArea -- */
    .mainContents .kvArea {
        text-align: center;
    }

    .mainContents .kvArea h1.kv {
        margin: 0 auto 50px;
    }

    .mainContents .kvArea .tit {
        position: relative;
        padding: 0 0 25px;
        margin: 0 auto 30px;
        font-size: 30px;
        font-weight: bold;
    }

    .mainContents .kvArea .tit::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 50%;
        width: 80px;
        height: 4px;
        background: #0099ff;
        transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
    }

    .mainContents .kvArea .txt {
        margin: 0 auto 35px;
        font-size: 16px;
        line-height: 1.7;
    }

    .mainContents .kvArea .txt>span {
        font-weight: bold;
        color: #fe295f;
    }

    .mainContents .kvArea .link_col{
        margin: 0 80px 80px;
    }
    .mainContents .kvArea .link_col ul {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
    }

    .mainContents .kvArea .link_col ul li {
        margin: 0 20px 0 0;
        border-right: 1px solid #dcdcdc;
    }

    .mainContents .kvArea .link_col ul li:last-child {
        margin: 0;
        border-right: none;
    }
    .mainContents .kvArea .link_col ul li:nth-child(3) {
        margin: 0;
        border-right: none;
    }

    .mainContents .kvArea .link_col ul li a {
        position: relative;
        margin: 0 auto;
        padding: 6px 30px;
        font-size: 18px;
        font-weight: bold;
        text-decoration: underline;
        color: #0099ff;
        box-sizing: border-box;
    }

    .mainContents .kvArea .link_col ul li a::before {
        content: "";
        position: absolute;
        top: 12px;
        left: 5px;
        width: 6px;
        height: 6px;
        border-top: 2px solid #0099ff;
        border-right: 2px solid #0099ff;
        transform: rotate(135deg);
        -ms-transform: rotate(135deg);
    }

    .mainContents .kvArea .link_col ul li a:hover {
        opacity: 0.5;
    }

    /* -- joinArea -- */
    .mainContents .joinArea {
        background: #f4f4f4;
    }

    .mainContents .joinArea .joinAreaIn {
        max-width: 1200px;
        margin: 0 auto;
        padding: 60px 0;
        text-align: center;
    }

    .mainContents .joinArea .joinAreaIn h2.tit {
        margin: 0 auto 30px;
        font-size: 24px;
        font-weight: bold;
    }

    .mainContents .joinArea .joinAreaIn .txt {
        margin: 0 auto 20px;
        font-size: 16px;
    }

    .mainContents .joinArea .joinAreaIn .btn_col {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0 auto 20px;
    }

    .mainContents .joinArea .joinAreaIn .btn_col > div {
        margin: 0 20px 0 0;
    }

    .mainContents .joinArea .joinAreaIn .btn_col > div:nth-child(even) {
        margin: 0;
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn {
        width: 360px;
        margin: 0 20px 0 0;
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn:last-child {
        margin: 0;
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn>a {
        position: relative;
        display: block;
        width: 100%;
        padding: 20px 30px;
        font-size: 18px;
        font-weight: bold;
        text-align: center;
        border-radius: 60px;
        box-sizing: border-box;
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn>a:hover {
        text-decoration: none;
        opacity: 0.5;
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn>a.join {
        background: #fe295f;
        color: #ffffff;
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn>a.flow {
        border: 2px solid #0099ff;
        background: #ffffff;
        color: #0099ff;
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn>a.join::after {
        content: "";
        position: absolute;
        top: 28px;
        right: 22px;
        width: 7px;
        height: 7px;
        border-top: 2px solid #ffffff;
        border-right: 2px solid #ffffff;
        transform: rotate(45deg);
        -ms-transform: rotate(45deg);
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn>a.flow::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 26px;
        width: 19px;
        height: 25px;
        background: url(/service/portal/present/16days/img/icon_joinArea01.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn>a.flow::after {
        content: "";
        position: absolute;
        top: 28px;
        right: 22px;
        width: 7px;
        height: 7px;
        border-top: 2px solid #0099ff;
        border-right: 2px solid #0099ff;
        transform: rotate(45deg);
        -ms-transform: rotate(45deg);
    }

    .mainContents .joinArea .joinAreaIn .point {
        margin: 0 auto;
        font-size: 12px;
    }

    /* -- searchArea -- */
    .mainContents .searchArea {
        margin: 50px auto 0;
    }

    .mainContents .searchArea .tit {
        margin: 0 auto 34px;
        padding: 100px 0 0 0;
        text-align: center;
    }
    .mainContents .searchArea .joinArea .joinAreaIn h2.tit{
        padding-top: 0;
    }

    .mainContents .searchArea .tit p.plus {
        display: inline-block;
        width: 480px;
        height: 95px;
        margin: 0 auto;
        padding: 20px 0 0 82px;
        font-size: 36px;
        text-align: left;
        line-height: 1;
        font-weight: bold;
        background: url(/service/portal/present/16days/img/bg_searchArea_plus.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
        color: #fff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .tit h2 {
        margin: 15px auto 0 auto;
        font-size: 26px;
        line-height: 1;
        font-weight: bold;
        color: #0099ff;
    }

    .mainContents .searchArea .tit h2 span {
        border-bottom: 4px solid #ffe664;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_list {}

    .mainContents .searchArea .service_list ul {
        display: flex;
        justify-content: center;
        align-items: flex-end;
        margin: 0 auto;
    }

    .mainContents .searchArea .service_list ul li {
        position: relative;
        width: 320px;
        margin: 0 10px 0 0;
        padding: 25px 30px;
        font-size: 22px;
        line-height: 1;
        font-weight: bold;
        text-align: center;
        box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.13);
        -ms-box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.13);
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_list ul li.basic {
        border: 4px solid #0099ff;
        background: #ffffff;
        color: #0099ff;
    }

    .mainContents .searchArea .service_list ul li.premium {
        border: 4px solid #00025b;
        background: #ffffff;
        color: #00025b;
    }

    .mainContents .searchArea .service_list ul li.hikari {
        border: 4px solid #ff5300;
        background: #ffffff;
        color: #ff5300;
    }

    .mainContents .searchArea .service_list ul li.basic::before {
        content: "";
        position: absolute;
        bottom: 4px;
        right: 4px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 0 10px 10px;
        border-color: transparent transparent #0099ff transparent;
    }

    .mainContents .searchArea .service_list ul li.premium::before {
        content: "";
        position: absolute;
        bottom: 4px;
        right: 4px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 0 10px 10px;
        border-color: transparent transparent #00025b transparent;
    }

    .mainContents .searchArea .service_list ul li.hikari::before {
        content: "";
        position: absolute;
        bottom: 4px;
        right: 4px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 0 10px 10px;
        border-color: transparent transparent #ff5300 transparent;
    }

    .mainContents .searchArea .service_list ul li.active{
        padding: 40px 30px;
    }
    .mainContents .searchArea .service_list ul li.active::after {
        content: "";
        position: absolute;
        bottom: -24px;
        left: 50%;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 20px 20px 0 20px;
        border-color: #ffffff transparent transparent transparent;
        transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
    }

    .mainContents .searchArea .service_list ul li.basic.active {
        border: 4px solid #ffffff;
        background: #0099ff;
        color: #ffffff;
    }

    .mainContents .searchArea .service_list ul li.premium.active {
        border: 4px solid #ffffff;
        background: #00025b;
        color: #ffffff;
    }

    .mainContents .searchArea .service_list ul li.hikari.active {
        border: 4px solid #ffffff;
        background: #ff5300;
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents {
        display: none;
        margin: -40px 0 0;
    }

    .mainContents .searchArea .service_contents.active {
        display: block;
    }

    /* -- bangumiArea -- */
    .mainContents .searchArea .service_contents .bangumiArea {
        padding: 100px 0;
        border-bottom: 3px solid #ffffff;
        background-color: #0099ff;
        background-image: url(/service/portal/present/16days/img/bg_service_contents01.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: top center;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .bangumiArea .bangumiAreaIn {
        max-width: 1200px;
        margin: 0 auto;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap {
        margin: 0 20px 40px;
        padding: 20px 20px;
        /* background: url(/service/portal/present/16days/img/bg_stripe.png);
        background-repeat: repeat; */
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap>h3.tit {
        margin: 0 auto 20px;
        padding: 12px 0;
        font-size: 28px;
        line-height: 1;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        background: #80ccff;
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap>h3.tit span {
        position: relative;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap>h3.tit span::before {
        content: "";
        position: absolute;
        top: -22px;
        left: -57px;
        width: 47px;
        height: 54px;
        background: url(/service/portal/present/16days/img/icon_osusume01.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider {}

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .prev,
    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .next {
        position: absolute;
        top: 50%;
        display: inline-block;
        width: 20px;
        height: 20px;
        border: 4px;
        border-style: solid;
        border-color: #ffffff #ffffff transparent transparent;
        overflow: hidden;
        text-indent: -999em;
        cursor: pointer;
        z-index: 1;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .prev {
        left: -25px;
        transform: translate(0, -50%) rotate(225deg);
        -ms-transform: translate(0, -50%) rotate(225deg);
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .next {
        right: -25px;
        transform: translate(0, -50%) rotate(45deg);
        -ms-transform: translate(0, -50%) rotate(45deg);
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slide-dots {
        position: absolute;
        bottom: -60px;
        left: 50%;
        margin: 0;
        text-align: center;
        transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slide-dots li {
        display: inline-block;
        margin: 0 15px;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slide-dots li button {
        position: relative;
        margin: 0;
        padding: 0;
        border: none;
        border-radius: 0;
        background: none;
        outline: none;
        text-indent: -9999px;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slide-dots li button::before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        width: 12px;
        height: 12px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.5);
        text-indent: 0px;
        transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slide-dots li.slick-active button::before {
        background: rgba(255, 255, 255, 1);
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents {
        width: 360px;
        margin: 0 10px;
        background: #ffffff;
        outline: none;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .img01 {
        position: relative;
        display: block;
        overflow: hidden;
        width: 100%;
        height: 202px;
        margin: 0;
        background: #000000;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .img01 img {
        position: absolute;
        top: 50%;
        left: 50%;
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn {
        padding: 5px 20px 20px;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .cols {
        display: flex;
        justify-content: left;
        align-items: center;
        flex-wrap: wrap;
        margin: 0 auto;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .copyright {
        margin: 0 0 10px;
        font-size: 12px;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .genre {
        margin: 0 10px 10px 0;
        padding: 3px 10px;
        font-size: 12px;
        font-weight: bold;
        background: #0099ff;
        color: #ffffff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .date {
        margin: 0 0 10px;
        font-size: 12px;
        font-weight: bold;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .title {
        margin: 0 0 15px;
        font-size: 16px;
        font-weight: bold;
        line-height: 1.5;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .cid {
        margin: 0 10px 20px 0;
        font-size: 12px;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .chname {
        margin: 0 0 20px;
        font-size: 12px;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .synopsis {
        display: none;
        margin: 0 0 10px;
        font-size: 14px;
        line-height: 1.5;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .more {
        position: relative;
        margin: 0;
        padding: 14px 0;
        font-size: 14px;
        text-align: center;
        border: 2px solid #94D4FF;
        background: #ffffff;
        color: #0099ff;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .more::before {
        content: "";
        position: absolute;
        top: 50%;
        right: 8px;
        width: 16px;
        height: 2px;
        background: #94D4FF;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .more::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 15px;
        width: 2px;
        height: 16px;
        background: #94D4FF;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .more.active::after {
        content: none;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .more:hover {
        opacity: 0.5;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .synopsis:empty+.more {
        display: none;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap {
        margin: 0 40px;
        padding: 70px 0 0 0;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap>h3.tit {
        margin: 0 auto 20px;
        padding: 0;
        font-size: 28px;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap>h3.tit span {
        position: relative;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap>h3.tit span::before {
        content: "";
        position: absolute;
        top: -5px;
        left: -54px;
        width: 39px;
        height: 39px;
        background: url(/service/portal/present/16days/img/icon_genre01.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_title {
        margin: 0 0 20px;
        padding: 10px 0;
        font-size: 24px;
        line-height: 1;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        background-color: #80ccff;
        /* background: url(/service/portal/present/16days/img/bg_stripe.png);
        background-repeat: repeat; */
        color: #ffffff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider {
        margin: 0 auto 40px;
        max-height: 400px;
        /*
        overflow-y: hidden;
        */
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .prev,
    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .next {
        position: absolute;
        top: 50%;
        display: inline-block;
        width: 20px;
        height: 20px;
        border: 4px;
        border-style: solid;
        border-color: #ffffff #ffffff transparent transparent;
        overflow: hidden;
        text-indent: -999em;
        cursor: pointer;
        z-index: 1;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .prev {
        left: -25px;
        transform: translate(0, -50%) rotate(225deg);
        -ms-transform: translate(0, -50%) rotate(225deg);
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .next {
        right: -25px;
        transform: translate(0, -50%) rotate(45deg);
        -ms-transform: translate(0, -50%) rotate(45deg);
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents {
        width: 360px;
        margin: 0 10px;
        background: #ffffff;
        outline: none;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .img01 {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        overflow: hidden;
        width: 100%;
        height: 202px;
        margin: 0;
        background: #000000;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .img01 a {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .img01 img {
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .slider_contentsIn {
        padding: 5px 20px 20px;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .slider_contentsIn .cols {
        display: flex;
        justify-content: left;
        align-items: center;
        flex-wrap: wrap;
        margin: 0 auto;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .slider_contentsIn .copyright {
        margin: 0 0 10px;
        font-size: 12px;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .slider_contentsIn .date {
        margin: 0 0 10px;
        font-size: 12px;
        font-weight: bold;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .slider_contentsIn .title {
        margin: 0 0 15px;
        font-size: 16px;
        font-weight: bold;
        line-height: 1.5;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .slider_contentsIn .cid {
        margin: 0 10px 0 0;
        font-size: 12px;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .slider_contentsIn .chname {
        margin: 0;
        font-size: 12px;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap>.more {
        position: relative;
        width: 360px;
        margin: 0 auto;
        padding: 14px 0;
        font-size: 14px;
        font-weight: bold;
        text-align: center;
        border: 2px solid #ffffff;
        background: #0099ff;
        color: #ffffff;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap>.more::before {
        content: "";
        position: absolute;
        top: 50%;
        right: 8px;
        width: 16px;
        height: 2px;
        background: #ffffff;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap>.more::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 15px;
        width: 2px;
        height: 16px;
        background: #ffffff;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap>.more:hover {
        opacity: 0.5;
    }


    /* -- scheduleArea -- */
    .mainContents .searchArea .service_contents .scheduleArea {
        padding: 76px 0 100px;
        border-bottom: 3px solid #ffffff;
        background-color: #0099ff;
        background-image: url(/service/portal/present/16days/img/bg_service_contents02.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: top center;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn {
        max-width: 1200px;
        margin: 0 auto;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn>h3.tit {
        margin: 0 auto 42px;
        padding: 0;
        font-size: 28px;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn>h3.tit span {
        position: relative;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn>h3.tit span::before {
        content: "";
        position: absolute;
        top: -4px;
        left: -64px;
        width: 49px;
        height: 42px;
        background: url(/service/portal/present/16days/img/icon_schedule01.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn>h3.tit+.subtit {
        margin: 0 auto 38px;
        font-size: 16px;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    /*
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select {
        position: relative;
        margin: 0 40px 50px;
        padding: 15px 17px;
        border: 3px solid #ffffff;
        border-bottom: none;
        background: rgba(255, 255, 255, 0.2);
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select::before {
        content: "";
        position: absolute;
        bottom: -20px;
        left: 50%;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 20px 20px 0 20px;
        border-color: rgba(255, 255, 255, 0.25) transparent transparent transparent;
        transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select::after {
        content: "";
        position: absolute;
        bottom: -14px;
        left: 50%;
        width: 21px;
        height: 21px;
        border: 3px;
        border-style: solid;
        border-color: #ffffff #ffffff transparent transparent;
        transform: translate(-50%, 0) rotate(135deg);
        -ms-transform: translate(-50%, 0) rotate(135deg);
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select>p.tit {
        margin: 0 auto 17px;
        padding: 0;
        font-size: 24px;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select>p.genre_select_list {
        position: relative;
        display: flex;
        justify-content: left;
        align-items: center;
        height: 50px;
        margin: 0;
        padding: 0 20px;
        font-size: 16px;
        font-weight: bold;
        background: #ffffff;
        box-sizing: border-box;
        cursor: pointer;
        display: none;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select .genre_list {
        position: relative;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select .genre_list::before {
        content: "";
        position: absolute;
        bottom: -18px;
        left: -20px;
        width: calc(50% + 5px);
        height: 3px;
        background: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select .genre_list::after {
        content: "";
        position: absolute;
        bottom: -18px;
        right: -20px;
        width: calc(50% + 5px);
        height: 3px;
        background: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul {
        position: relative;
        display: flex;
        justify-content: left;
        flex-wrap: wrap;
        width: 100%;
        margin: 0 auto;
        padding: 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        z-index: 10;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul li {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 19.4%;
        height: 50px;
        margin: 0 0.66% 0 0;
        padding: 0 0.75%;
        font-size: 14px;
        font-weight: bold;
        text-align: center;
        background: #ffffff;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul li:nth-child(5n) {
        margin-right: 0;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul li:nth-child(n+6) {
        margin-top: 0.6%;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul li:hover {
        opacity: 0.75;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul li:last-child {
        border: none;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul li.active {
        border: 2px solid #ffffff;
        background: none;
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul li.active:hover {
        opacity: 1;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select {
        position: relative;
        margin: 0 40px 50px;
        padding: 15px 0 0 0;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select::before {
        content: "";
        position: absolute;
        bottom: -20px;
        left: 50%;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 20px 20px 0 20px;
        border-color: rgba(255, 255, 255, 0.25) transparent transparent transparent;
        transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select::after {
        content: "";
        position: absolute;
        bottom: -14px;
        left: 50%;
        width: 21px;
        height: 21px;
        border: 3px;
        border-style: solid;
        border-color: #ffffff #ffffff transparent transparent;
        transform: translate(-50%, 0) rotate(135deg);
        -ms-transform: translate(-50%, 0) rotate(135deg);
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select>p.tit {
        margin: 0 auto 17px;
        padding: 0;
        font-size: 24px;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select>p.date_select_list,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select>p.time_select_list {
        display: none;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select .time_list {
        position: relative;
        display: flex;
        justify-content: left;
        margin: -7px auto 0;
        padding: 15px 0;
        border: 3px solid #ffffff;
        border-bottom: none;
        background: #40b3ff;
        background: rgba(255, 255, 255, 0.25);
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select .time_list::before {
        content: "";
        position: absolute;
        bottom: -3px;
        left: -3px;
        width: calc(48.4% + 5px);
        height: 3px;
        background: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select .time_list::after {
        content: "";
        position: absolute;
        bottom: -3px;
        right: -3px;
        width: calc(48.4% + 5px);
        height: 3px;
        background: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select .time_list .txt {
        width: 15%;
        margin: 0 auto;
        font-size: 18px;
        font-weight: bold;
        text-align: center;
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select .time_list ul {
        width: 85%;
        display: flex;
        margin: 0 auto;
        font-size: 18px;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select .time_list ul li {
        color: rgba(255, 255, 255, 0.5);
        cursor: pointer;
        margin-right: 3px;
        padding: 0 10px;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select .time_list ul li:hover {
        opacity: 0.75;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select .time_list ul li.active {
        color: #ffffff;
        font-weight: bold;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select .time_list ul li.disabled {
        display: none;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date {
        display: flex;
        margin: 0 60px;
        padding: 0 0 4px 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        z-index: 10;
        position: relative;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li {
        display: block;
        background: #ffffff;
        font-weight: bold;
        font-size: 22px;
        color: #000000;
        text-align: center;
        width: 138px;
        height: 60px;
        margin: 0 5px 0 0;
        padding: 8px 17px 0;
        border: 3px solid #fff;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer;
        outline: none;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li span {
        font-size: 14px;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li.day0 {
        color: #e53935;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li.day6 {
        color: #1976d2;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li.active {
        background: #40b3ff;
        color: #ffffff;
        height: 67px;
        border-bottom: 3px solid #40b3ff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li:hover {
        opacity: 0.75;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li.active:hover {
        opacity: 1;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date .slick-arrow {
        width: 60px;
        height: 60px;
        position: absolute;
        top: 0;
        margin: 0;
        padding: 0;
        text-indent: -999em;
        background-repeat: no-repeat;
        background-position: center center;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date .slick-arrow.prev {
        left: -60px;
        background-image: url('/service/portal/present/16days/img/icon_arrow_prev.png');
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date .slick-arrow.next {
        right: -60px;
        background-image: url('/service/portal/present/16days/img/icon_arrow_next.png');
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date .slick-arrow:hover {
        opacity: 0.75;
    }
    */

    /* copy */
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .select_wrap{
        display: flex;
        width: 1120px;
        margin: 0 40px 45px;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select {
        width: 380px;
        display: flex;
        /* align-items: center; */
        justify-content: space-between;
        position: relative;
        margin: 0;
        padding: 5px 0 0 0;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select>p.tit {
        margin: 0;
        padding: 10px 0 0 0;
        font-size: 24px;
        line-height: 1;
        font-weight: bold;
        text-align: left;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select {
        width: 740px;
        display: flex;
        position: relative;
        margin: 0;
        /* height: 60px; */
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select .date_select_content{
        width: 370px;
        height: 60px;
        display: flex;
        /* align-items: center; */
        justify-content: space-between;
        margin-left: 18px;
        padding-left: 18px;
        padding: 5px 0 0 18px;
        border-left: 2px solid #fff;
        /* justify-content: space-between; */
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select p.tit {
        margin: 0;
        padding: 10px 0 0 0;
        font-size: 24px;
        line-height: 1;
        font-weight: bold;
        text-align: left;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select p.genre_select_list,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select p.date_select_list,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select p.time_select_list {
        position: relative;
        display: flex;
        justify-content: left;
        align-items: center;
        width: 200px;
        height: 50px;
        margin: 0;
        padding: 0 10px;
        font-size: 14px;
        line-height: 1;
        font-weight: bold;
        background: #ffffff;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select p.genre_select_list::after,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select p.date_select_list::after,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select p.time_select_list::after {
        content: '';
        display: inline-block;
        width: 15px;
        height: 10px;
        position: absolute;
        top: 50%;
        right: 10px;
        margin-top: -5px;
        background: url('/service/portal/present/16days/img/icon_arrow_down.png') no-repeat 0 0;
        background-size: contain;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select p.genre_select_list.active::after,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select p.date_select_list.active::after,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select p.time_select_list.active::after {
        background-image: url('/service/portal/present/16days/img/icon_arrow_up.png');
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select .genre_list,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select .date_list,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select .time_list {
        width: 200px;
        position: relative;
        z-index: 1;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.time {
        display: none;
        width: 100%;
        margin: 0 auto;
        padding: 0;
        border: 2px solid #eaeaea;
        background: #ffffff;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        position: absolute;
        z-index: 10;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul li,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.time li {
        display: block;
        background: #ffffff;
        font-weight: bold;
        font-size: 14px;
        line-height: 1;
        color: #000000;
        border-bottom: 2px solid #eaeaea;
        padding: 15px 10px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul li:hover,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li:hover,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.time li:hover {
        background: #eaeaea;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul li:last-child,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li:last-child,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.time li:last-child {
        border: none;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li.day0 {
        color: #e53935;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li.day6 {
        color: #1976d2;
    }
/* copy */
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select {
        margin: 0 40px;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select>.tit {
        margin: 0 auto 17px;
        padding: 0;
        font-size: 24px;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list {
        margin: 0 0 40px;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul {}

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li {
        margin: 0 0 10px;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name {
        position: relative;
        display: flex;
        justify-content: left;
        align-items: center;
        margin: 0;
        height: 80px;
        border-bottom: none;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name.active {
        border-bottom: 2px solid #0099ff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name::before {
        content: "";
        position: absolute;
        top: 50%;
        right: 17px;
        width: 16px;
        height: 2px;
        background: #0099ff;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 24px;
        width: 2px;
        height: 16px;
        background: #0099ff;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name.active::after {
        content: none;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name .logo {
        width: 80px;
        height: 100%;
        padding: 5px;
        background: #ffffff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name .name {
        position: relative;
        display: flex;
        justify-content: left;
        align-items: center;
        width: calc(100% - 80px);
        height: 100%;
        margin: 0;
        padding: 0 50px 0 21px;
        font-size: 18px;
        font-weight: bold;
        border-left: 2px solid #0099ff;
        background: #ffffff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name .name::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        width: 50px;
        height: 100%;
        background: #f4f4f4;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table {
        position: relative;
        display: none;
        background: #ffffff;
        padding: 30px 0;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 80px;
        height: 100%;
        background: #f4f4f4;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table .table_col {
        position: relative;
        display: flex;
        justify-content: left;
        margin: 0 0 20px;
        z-index: 2;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table .message{
        position: relative;
        display: none;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table.empty::before{
        display: none;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table.empty .message{
        padding: 0 0 0 20px;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table.empty .message p{
        margin: 0;
        padding: 0;
        font-size: 16px;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table .table_col:last-child {
        margin: 0;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table .table_col .start {
        width: 80px;
        margin: 0;
        font-size: 16px;
        font-weight: bold;
        text-align: center;
        color: #0099ff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table .table_col .title {
        width: calc(100% - 80px);
        margin: 0;
        padding: 0 50px 0 23px;
        font-size: 16px;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select>.more {
        position: relative;
        width: 360px;
        margin: 0 auto;
        padding: 14px 0;
        font-size: 14px;
        font-weight: bold;
        text-align: center;
        border: 2px solid #ffffff;
        background: #0099ff;
        color: #ffffff;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select>.more::before {
        content: "";
        position: absolute;
        top: 50%;
        right: 8px;
        width: 16px;
        height: 2px;
        background: #ffffff;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select>.more::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 15px;
        width: 2px;
        height: 16px;
        background: #ffffff;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select>.more:hover {
        opacity: 0.5;
    }


    /* -- chArea -- */
    .mainContents .searchArea .service_contents .chArea {
        padding: 80px 0 100px;
        border-bottom: 3px solid #ffffff;
        background-color: #0099ff;
        background-image: url(/service/portal/present/16days/img/bg_service_contents02.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: top center;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn {
        max-width: 1200px;
        margin: 0 auto;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn>h3.tit {
        margin: 0 auto 50px;
        padding: 0;
        font-size: 28px;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn>h3.tit span {
        position: relative;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn>h3.tit span::before {
        content: "";
        position: absolute;
        top: -4px;
        left: -60px;
        width: 51px;
        height: 45px;
        background: url(/service/portal/present/16days/img/icon_ch01.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select {
        position: relative;
        margin: 0 40px 40px;
        padding: 17px 17px;
        border: 3px solid #ffffff;
        border-bottom: none;
        background: rgba(255, 255, 255, 0.25);
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select::before {
        content: "";
        position: absolute;
        bottom: -20px;
        left: 50%;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 20px 20px 0 20px;
        border-color: rgba(255, 255, 255, 0.25) transparent transparent transparent;
        transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select::after {
        content: "";
        position: absolute;
        bottom: -14px;
        left: 50%;
        width: 21px;
        height: 21px;
        border: 3px;
        border-style: solid;
        border-color: #ffffff #ffffff transparent transparent;
        transform: translate(-50%, 0) rotate(135deg);
        -ms-transform: translate(-50%, 0) rotate(135deg);
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select>p.tit {
        margin: 0 auto 17px;
        padding: 0;
        font-size: 24px;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select>p.genre_select_list {
        position: relative;
        display: flex;
        justify-content: left;
        align-items: center;
        height: 50px;
        margin: 0;
        padding: 0 20px;
        font-size: 16px;
        font-weight: bold;
        background: #fff;
        box-sizing: border-box;
        cursor: pointer;
    }
    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select>p.genre_select_list.active {
        color: #8c8c8c;
        background: #eaeaea;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select .genre_list {
        position: relative;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select .genre_list::before {
        content: "";
        position: absolute;
        bottom: -20px;
        left: -20px;
        width: calc(50% + 5px);
        height: 3px;
        background: #ffffff;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select .genre_list::after {
        content: "";
        position: absolute;
        bottom: -20px;
        right: -20px;
        width: calc(50% + 5px);
        height: 3px;
        background: #ffffff;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select ul {
        display: none;
        width: 100%;
        margin: 0 auto;
        padding: 0;
        border: 2px solid #eaeaea;
        background: #ffffff;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        z-index: 10;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select ul li {
        display: block;
        background: #ffffff;
        font-weight: bold;
        font-size: 16px;
        color: #000000;
        border-bottom: 2px solid #eaeaea;
        padding: 10px 17px 10px 30px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select ul li.active,
    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select ul li:hover {
            background: #e5f5ff;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap {
        margin: 0 40px 40px;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents {
        margin: 0 0 40px;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents:last-child {
        margin: 0;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_title {
        margin: 0 0 20px;
        padding: 10px 0;
        font-size: 24px;
        line-height: 1;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        background-color: #80ccff;
        /* background: url(/service/portal/present/16days/img/bg_stripe.png);
        background-repeat: repeat; */
        color: #ffffff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list {
        display: flex;
        justify-content: left;
        flex-wrap: wrap;
        margin: 0;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list .genre_list_body {
        position: relative;
        display: flex;
        justify-content: left;
        align-items: center;
        width: 49.5%;
        margin: 0;
        height: 80px;
        border-bottom: none;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list .genre_list_body:nth-child(odd) {
        margin-right: 1%;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list .genre_list_body:nth-child(n+3) {
        margin-top: 10px;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list .genre_list_body .cnl-cnl-logo {
        width: 80px;
        height: 100%;
        padding: 5px;
        background: #ffffff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list .genre_list_body .cnl-cnl-name {
        position: relative;
        display: flex;
        justify-content: left;
        align-items: center;
        width: calc(100% - 80px);
        height: 100%;
        margin: 0;
        padding: 0 50px 0 21px;
        font-size: 18px;
        font-weight: bold;
        border-left: 2px solid #0099ff;
        background: #ffffff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list_note {
        margin: 10px 0 0;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list_note li {
        position: relative;
        margin: 0;
        padding: 0 0 0 14px;
        font-size: 14px;
        line-height: 1.7;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list_note li::before {
        content: '\203B';
        position: absolute;
        top: 0;
        left: 0;
        font-size: 14px;
        line-height: 1.7;
    }
    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list_note li a {
        text-decoration: underline;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn>.more {
        position: relative;
        width: 360px;
        margin: 0 auto;
        padding: 14px 0;
        font-size: 14px;
        font-weight: bold;
        text-align: center;
        border: 2px solid #ffffff;
        background: #0099ff;
        color: #ffffff;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn>.more::before {
        content: "";
        position: absolute;
        top: 50%;
        right: 8px;
        width: 16px;
        height: 2px;
        background: #ffffff;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn>.more::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 15px;
        width: 2px;
        height: 16px;
        background: #ffffff;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn>.more:hover {
        opacity: 0.5;
    }


    /* -- osusumeArea -- */
    .mainContents .searchArea .service_contents .osusumeArea {
        padding: 80px 0 100px;
        border-bottom: 3px solid #ffffff;
        background-color: #0099ff;
        background-image: url(/service/portal/present/16days/img/bg_service_contents02.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: top center;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .osusumeArea .osusumeAreaIn {
        max-width: 1120px;
        margin: 0 auto;
    }

    .mainContents .searchArea .service_contents .osusumeArea .osusumeAreaIn>h3.tit {
        margin: 0 auto 50px;
        padding: 0;
        font-size: 28px;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }
    .mainContents .searchArea .service_contents #premium_osusumeArea .osusumeAreaIn>h3.tit,
    .mainContents .searchArea .service_contents #hikari_osusumeArea .osusumeAreaIn>h3.tit{

    }

    .mainContents .searchArea .service_contents .osusumeArea .osusumeAreaIn>h3.tit span {
        position: relative;
    }

    .mainContents .searchArea .service_contents #basic_osusumeArea .osusumeAreaIn>h3.tit span::before {
        content: "";
        position: absolute;
        top: 0;
        left: -82px;
        width: 64px;
        height: 46px;
        background: url(/service/portal/present/16days/img/icon_kihon.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
    }


    /* -- attArea -- */
    .mainContents .attArea {}

    .mainContents .attArea .attAreaIn {
        max-width: 1200px;
        margin: 0 auto;
        padding: 60px 0;
    }

    .mainContents .attArea .attAreaIn .tit {
        margin: 0 20px;
        font-size: 14px;
        font-weight: bold;
        line-height: 1.7;
    }

    .mainContents .attArea .attAreaIn>ul {
        margin: 0 20px;
    }

    .mainContents .attArea .attAreaIn>ul li {
        position: relative;
        margin: 0;
        padding: 0 0 0 14px;
        font-size: 14px;
        line-height: 1.7;
        box-sizing: border-box;
    }

    .mainContents .attArea .attAreaIn>ul li::before {
        content: '・';
        position: absolute;
        top: 0;
        left: 0;
        font-size: 14px;
        line-height: 1.7;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box {
        background: #ffffff;
        box-sizing: border-box;
        border: 2px solid #0099ff;
        margin: 40px 0 0;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box>p {
        color: #0099ff;
        font-size: 22px;
        font-weight: bold;
        position: relative;
        cursor: pointer;
        margin: 0;
        padding: 30px 65px 24px 27px;
        line-height: 1;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box>p::before {
        content: "";
        width: 40px;
        height: 40px;
        background: #cdcdcd;
        border-radius: 50%;
        position: absolute;
        top: 50%;
        right: 0;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box>p::after {
        content: "";
        width: 20px;
        height: 2px;
        background: #ffffff;
        position: absolute;
        top: 50%;
        right: 20px;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box>p.active>span::after {
        content: "";
        width: 2px;
        height: 20px;
        background: #ffffff;
        position: absolute;
        top: 50%;
        right: 38px;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn {
        padding: 25px 30px 35px 26px;
        border-top: 2px solid #0099ff;
        display: none;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note {
        margin: 0;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note>li {
        font-size: 14px;
        text-indent: -1.5em;
        padding-left: 1.5em;
        margin: 7px 0 0;
        font-weight: bold;
        line-height: 1.75;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note>li:first-child {
        margin: 0;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note>li::before {
        content: "※";
        padding-right: 0.5em
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note>li>ul.list-disc {
        margin: 10px 0 0 -0.6em;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note>li>ul.list-disc>li {
        font-size: 14px;
        text-indent: 0;
        font-weight: bold;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note>li>ul.list-disc>li::before {
        content: '・';
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note>li>ul.list-disc>li>span {
        padding-right: 14px;
    }
   
	/*158_SPCC_WEB-11416　追記*/
	.attAreaIn a {
        color: #09f;
    } 
}
@media (min-width: 769px) and (max-width:1300px) {
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .select_wrap{
        width: auto;
        justify-content: center;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select{
        display: block;
        width: auto;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select>p.tit{
        text-align: center;
        margin: 0 0 15px;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select{
        height: auto;
        width: auto;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select .date_select_content{
        display: block;
        width: auto;
        height: auto;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select p.tit{
        text-align: center;
        margin: 0 0 15px;
    }
}
@media(max-width: 768px) {
    /* Loadingアニメーション */
    .LoadingWrapper{
        min-height: 83.2vw;
        margin: 0 auto 10.66vw;
    }
    .LoadingWrapper .loading{
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: rgba(0,0,0,0.8);
        border-radius: 4px;
        color: #fff;
        font-size: 24px;
    }
    .LoadingWrapper .loading .l-parts{
        font-size: 20px;
        color: #fff;
        font-weight: 300;
        text-align: center;
        position: absolute;
        width: 150px;
        height: 150px;
        top: calc(50% - 75px);
        left: calc(50% - 75px);
    }

    .LoadingWrapper .loading .loading-circle{
        background: url(../img/load_circle.png) no-repeat center center;
        animation: loading-circle 1.5s cubic-bezier(0.445, 0.05, 0.55, 0.95) infinite;
        background-size: contain;
    }
    @keyframes loading-circle {
        0% {transform: rotate(0deg);}
        100% {transform: rotate(360deg);}
    }

    .LoadingWrapper .loading .loading-txt{
        font-size: 14px;
        color: #fff;
        top: 50%;
        margin-top: -15px;
        animation: loading-txt 1.5s infinite;
    }

    @keyframes loading-txt {
        0% {opacity: 0;}
        50% {opacity: 1;}
        100% {opacity: 0;}
    }

    /* -- common -- */
    body {
        font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック体", YuGothic, "游ゴシック Medium", "YuGothic M", "メイリオ", Meiryo, sans-serif;
    }

    .mainContents .pc {
        display: none !important;
    }

    .mainContents .mainContentsIn {
        margin: 0 auto;
    }

    .mainContents section {
        margin: 0 auto;
    }

    .mainContents img {
        width: 100%;
        height: 100%;
        max-width: 100%;
        object-fit: cover;
    }

    .mainContents a {
        color: #000000;
    }

    /* -- kvArea -- */
    .mainContents .kvArea {
        text-align: center;
    }

    .mainContents .kvArea h1.kv {
        margin: 0 auto 5.33vw;
    }

    .mainContents .kvArea .tit {
        position: relative;
        padding: 0 0 3.99vw;
        margin: 0 3.99vw 5.33vw;
        font-size: 4.79vw;
        font-weight: bold;
    }

    .mainContents .kvArea .tit::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 50%;
        width: 21.33vw;
        height: 4px;
        background: #0099ff;
        transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
    }

    .mainContents .kvArea .txt {
        margin: 0 3.99vw 8.66vw;
        font-size: 3.73vw;
        line-height: 1.7;
    }

    .mainContents .kvArea .txt>span {
        font-weight: bold;
        color: #fe295f;
    }

    .mainContents .kvArea .link_col{
        margin: 0 10.66vw 10.66vw;
    }
    .mainContents .kvArea .link_col ul {
        display: block;
        /* display: flex;
        justify-content: center;
        align-items: center; */
    }

    .mainContents .kvArea .link_col ul li {
        /* margin: 0 5.33vw 0 0; */
        margin: 0;
    }

    .mainContents .kvArea .link_col ul li:last-child {
        margin: 0;
    }

    .mainContents .kvArea .link_col ul li:last-child a {
        border-right: none;
    }

    .mainContents .kvArea .link_col ul li a {
        position: relative;
        margin: 0 auto;
        padding: 0.39vw 0 0.39vw 5.86vw;
        /* padding: 0.39vw 5.86vw; */
        font-size: 3.73vw;
        font-weight: bold;
        text-decoration: underline;
        /* border-right: 1px solid #dcdcdc; */
        color: #0099ff;
        box-sizing: border-box;
    }

    .mainContents .kvArea .link_col ul li a::before {
        content: "";
        position: absolute;
        top: 1.59vw;
        left: 0.66vw;
        width: 1.33vw;
        height: 1.33vw;
        border-top: 2px solid #0099ff;
        border-right: 2px solid #0099ff;
        transform: rotate(135deg);
        -ms-transform: rotate(135deg);
    }

    .mainContents .kvArea .link_col ul li a:hover {
        opacity: 0.5;
    }

    /* -- joinArea -- */
    .mainContents .joinArea {
        background: #f4f4f4;
    }

    .mainContents .joinArea .joinAreaIn {
        margin: 0 9.59vw;
        padding: 10.66vw 0;
        text-align: center;
    }

    .mainContents .joinArea .joinAreaIn h2.tit {
        margin: 0 auto 4.66vw;
        font-size: 4.79vw;
        font-weight: bold;
    }

    .mainContents .joinArea .joinAreaIn .txt {
        margin: 0 auto 4.66vw;
        font-size: 3.73vw;
    }

    .mainContents .joinArea .joinAreaIn .btn_col {
        margin: 0 auto 5.33vw;
    }

    .mainContents .joinArea .joinAreaIn .btn_col > div {
        margin: 0 auto 2.66vw;
    }

    .mainContents .joinArea .joinAreaIn .btn_col > div:last-child {
        margin: 0 auto;
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn {
        width: 80.79vw;
        margin: 0 auto 2.66vw;
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn:last-child {
        margin: 0 auto;
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn>a {
        position: relative;
        display: block;
        width: 100%;
        padding: 4.66vw 5.99vw;
        font-size: 4.26vw;
        font-weight: bold;
        text-align: center;
        border-radius: 13.33vw;
        box-sizing: border-box;
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn>a:hover {
        text-decoration: none;
        opacity: 0.5;
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn>a.join {
        background: #fe295f;
        color: #ffffff;
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn>a.flow {
        border: 2px solid #0099ff;
        background: #ffffff;
        color: #0099ff;
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn>a.join::after {
        content: "";
        position: absolute;
        top: 5.76vw;
        right: 3.99vw;
        width: 1.59vw;
        height: 1.59vw;
        border-top: 3px solid #ffffff;
        border-right: 3px solid #ffffff;
        transform: rotate(45deg);
        -ms-transform: rotate(45deg);
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn>a.flow::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 6.66vw;
        width: 3.73vw;
        height: 5.19vw;
        background: url(/service/portal/present/16days/img/sp/icon_joinArea01.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
    }

    .mainContents .joinArea .joinAreaIn .btn_col .btn>a.flow::after {
        content: "";
        position: absolute;
        top: 5.76vw;
        right: 3.99vw;
        width: 1.59vw;
        height: 1.59vw;
        border-top: 3px solid #0099ff;
        border-right: 3px solid #0099ff;
        transform: rotate(45deg);
        -ms-transform: rotate(45deg);
    }

    .mainContents .joinArea .joinAreaIn .point {
        margin: 0 auto;
        font-size: 2.66vw;
        line-height: 1.5;
    }

    /* -- searchArea -- */
    .mainContents .searchArea {
        margin: 10.66vw auto 0;
    }

    .mainContents .searchArea .tit {
        margin: 0 auto 5.33vw;
        padding: 10.667vw 0 0;
        text-align: center;
    }
    .mainContents .searchArea .joinArea .joinAreaIn h2.tit{
        padding-top: 0;
    }

    .mainContents .searchArea .tit p.plus {
        display: inline-block;
        width: 69.333vw;
        height: 14vw;
        margin: 0 auto;
        padding: 3.333vw 0 0 12vw;
        font-size: 5.333vw;
        line-height: 1;
        font-weight: bold;
        text-align: left;
        background: url(/service/portal/present/16days/img/bg_searchArea_plus.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
        color: #fff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .tit h2 {
        margin: 1.333vw auto 0 auto;
        font-size: 4.26vw;
        font-weight: bold;
        line-height: 1.8;
        color: #0099ff;
    }

    .mainContents .searchArea .tit h2 span {
        border-bottom: 4px solid #ffe664;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_list {
        margin: 0 3.99vw;
    }

    .mainContents .searchArea .service_list ul {
        display: flex;
        justify-content: center;
        align-items: flex-end;
        margin: 0 auto;
    }

    .mainContents .searchArea .service_list ul li {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 32%;
        height: 16vw;
        margin: 0 2% 0 0;
        font-size: 3.19vw;
        font-weight: bold;
        line-height: 1.5;
        text-align: center;
        box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.13);
        -ms-box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.13);
        box-sizing: border-box;
        cursor: pointer;
    }
    .mainContents .searchArea .service_list ul li.active{
        height: 20vw;
    }

    .mainContents .searchArea .service_list ul li:last-child {
        margin: 0;
    }

    .mainContents .searchArea .service_list ul li.basic {
        border: 4px solid #0099ff;
        background: #ffffff;
        color: #0099ff;
    }

    .mainContents .searchArea .service_list ul li.premium {
        border: 4px solid #00025b;
        background: #ffffff;
        color: #00025b;
    }

    .mainContents .searchArea .service_list ul li.hikari {
        border: 4px solid #ff5300;
        background: #ffffff;
        color: #ff5300;
    }

    .mainContents .searchArea .service_list ul li.basic::before {
        content: "";
        position: absolute;
        bottom: 4px;
        right: 4px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 0 2.13vw 2.13vw;
        border-color: transparent transparent #0099ff transparent;
    }

    .mainContents .searchArea .service_list ul li.premium::before {
        content: "";
        position: absolute;
        bottom: 4px;
        right: 4px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 0 2.13vw 2.13vw;
        border-color: transparent transparent #00025b transparent;
    }

    .mainContents .searchArea .service_list ul li.hikari::before {
        content: "";
        position: absolute;
        bottom: 4px;
        right: 4px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 0 2.13vw 2.13vw;
        border-color: transparent transparent #ff5300 transparent;
    }
    .mainContents .searchArea .service_list ul li.active::after {
        content: "";
        position: absolute;
        bottom: calc(-2.66vw - 3px);
        left: 50%;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 2.66vw 2.66vw 0 2.66vw;
        border-color: #ffffff transparent transparent transparent;
        transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
    }

    .mainContents .searchArea .service_list ul li.basic.active {
        border: 4px solid #ffffff;
        background: #0099ff;
        color: #ffffff;
    }

    .mainContents .searchArea .service_list ul li.premium.active {
        border: 4px solid #ffffff;
        background: #00025b;
        color: #ffffff;
    }

    .mainContents .searchArea .service_list ul li.hikari.active {
        border: 4px solid #ffffff;
        background: #ff5300;
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents {
        display: none;
        margin: -7.99vw 0 0;
    }

    .mainContents .searchArea .service_contents.active {
        display: block;
    }

    /* -- bangumiArea -- */
    .mainContents .searchArea .service_contents .bangumiArea {
        padding: 14.667vw 0 10.66vw;
        border-bottom: 3px solid #ffffff;
        background-color: #0099ff;
        background-image: url(/service/portal/present/16days/img/sp/bg_service_contents01.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: top center;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .bangumiArea .bangumiAreaIn {
        margin: 0 3.99vw;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap {
        margin: 0 0 15.99vw;
        padding: 3.99vw 3.99vw;
        /* background: url(/service/portal/present/16days/img/bg_stripe.png);
        background-repeat: repeat; */
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap>h3.tit {
        margin: 0 auto 3.99vw;
        padding: 3.19vw 0;
        font-size: 4.26vw;
        line-height: 1;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        background: #80ccff;
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap>h3.tit span {
        position: relative;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap>h3.tit span::before {
        content: "";
        position: absolute;
        top: -3.59vw;
        left: -9.46vw;
        width: 8.13vw;
        height: 9.46vw;
        background: url(/service/portal/present/16days/img/sp/icon_osusume01.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider {}

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .prev,
    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .next {
        position: absolute;
        top: 50%;
        display: inline-block;
        width: 3.99vw;
        height: 3.99vw;
        border: 6px;
        border-style: solid;
        border-color: #ffffff #ffffff transparent transparent;
        overflow: hidden;
        text-indent: -999em;
        cursor: pointer;
        z-index: 1;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .prev {
        left: -5.33vw;
        transform: translate(0, -50%) rotate(225deg);
        -ms-transform: translate(0, -50%) rotate(225deg);
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .next {
        right: -5.33vw;
        transform: translate(0, -50%) rotate(45deg);
        -ms-transform: translate(0, -50%) rotate(45deg);
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slide-dots {
        position: absolute;
        bottom: -10.66vw;
        left: 50%;
        margin: 0;
        text-align: center;
        transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slide-dots li {
        display: inline-block;
        margin: 0 3.46vw;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slide-dots li button {
        position: relative;
        margin: 0;
        padding: 0;
        border: none;
        border-radius: 0;
        background: none;
        outline: none;
        text-indent: -9999px;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slide-dots li button::before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        width: 2.39vw;
        height: 2.39vw;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.5);
        text-indent: 0px;
        transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slide-dots li.slick-active button::before {
        background: rgba(255, 255, 255, 1);
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents {
        width: 100%;
        margin: 0;
        background: #ffffff;
        outline: none;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .img01 {
        position: relative;
        display: block;
        overflow: hidden;
        width: 100%;
        height: 47.19vw;
        margin: 0;
        background: #000000;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .img01 a{
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .img01 img {
        position: absolute;
        top: 50%;
        left: 50%;
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn {
        padding: 1.33vw 3.99vw 2.66vw;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .cols {
        display: flex;
        justify-content: left;
        align-items: center;
        flex-wrap: wrap;
        margin: 0 auto;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .copyright {
        margin: 0 0 3.99vw;
        font-size: 2.66vw;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .genre {
        margin: 0 2.66vw 3.99vw 0;
        padding: 0.66vw 2.66vw;
        font-size: 2.66vw;
        font-weight: bold;
        background: #0099ff;
        color: #ffffff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .date {
        margin: 0 0 3.99vw;
        font-size: 2.66vw;
        font-weight: bold;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .title {
        margin: 0 0 3.99vw;
        font-size: 3.46vw;
        font-weight: bold;
        line-height: 1.5;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .cid {
        margin: 0 2.66vw 3.99vw 0;
        font-size: 2.66vw;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .chname {
        margin: 0 0 3.99vw;
        font-size: 2.66vw;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .synopsis {
        display: none;
        margin: 0 0 3.99vw;
        font-size: 3.19vw;
        line-height: 1.5;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .more {
        position: relative;
        margin: 0;
        padding: 2.39vw 0;
        font-size: 3.19vw;
        text-align: center;
        border: 1px solid #96d5ff;
        background: #ffffff;
        color: #20a6ff;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .more::before {
        content: "";
        position: absolute;
        top: 50%;
        right: 2.26vw;
        width: 2.13vw;
        height: 0.26vw;
        background: #96d5ff;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .more::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 2.26vw;
        width: 2.13vw;
        height: 0.26vw;
        background: #96d5ff;
        transform: translate(0, -50%) rotate(90deg);
        -ms-transform: translate(0, -50%) rotate(90deg);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .more.active::after {
        content: none;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .more:hover {
        opacity: 0.5;
    }

    .mainContents .searchArea .service_contents .bangumiArea .osusume_wrap .osusume_slider .slider_contents .slider_contentsIn .synopsis:empty+.more {
        display: none;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap {
        margin: 0 3.99vw;
        padding: 0;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap>h3.tit {
        margin: 0 auto 5.33vw;
        padding: 0;
        font-size: 5.33vw;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap>h3.tit span {
        position: relative;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap>h3.tit span::before {
        content: "";
        position: absolute;
        top: -0.26vw;
        left: -9.86vw;
        width: 6.53vw;
        height: 6.53vw;
        background: url(/service/portal/present/16days/img/sp/icon_genre01.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_title {
        margin: 0 0 3.99vw;
        padding: 1.86vw 0;
        font-size: 4.26vw;
        line-height: 1;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        background-color: #80ccff;
        /* background: url(/service/portal/present/16days/img/bg_stripe.png);
        background-repeat: repeat; */
        color: #ffffff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider {
        margin: 0 auto 10.66vw;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .prev,
    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .next {
        position: absolute;
        top: 50%;
        display: inline-block;
        width: 3.99vw;
        height: 3.99vw;
        border: 6px;
        border-style: solid;
        border-color: #ffffff #ffffff transparent transparent;
        overflow: hidden;
        text-indent: -999em;
        cursor: pointer;
        z-index: 1;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .prev {
        left: -5.33vw;
        transform: translate(0, -50%) rotate(225deg);
        -ms-transform: translate(0, -50%) rotate(225deg);
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .next {
        right: -5.33vw;
        transform: translate(0, -50%) rotate(45deg);
        -ms-transform: translate(0, -50%) rotate(45deg);
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents {
        width: 100%;
        margin: 0;
        background: #ffffff;
        outline: none;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .img01 {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        overflow: hidden;
        width: 100%;
        height: 47.19vw;
        margin: 0;
        background: #000000;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .img01 img {
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .slider_contentsIn {
        padding: 1.33vw 3.99vw 3.33vw;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .slider_contentsIn .cols {
        display: flex;
        justify-content: left;
        align-items: center;
        flex-wrap: wrap;
        margin: 0 auto;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .slider_contentsIn .copyright {
        margin: 0 0 3.99vw;
        font-size: 2.66vw;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .slider_contentsIn .date {
        margin: 0 0 3.99vw;
        font-size: 2.66vw;
        font-weight: bold;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .slider_contentsIn .title {
        margin: 0 0 3.99vw;
        font-size: 3.46vw;
        font-weight: bold;
        line-height: 1.5;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .slider_contentsIn .cid {
        margin: 0 2.66vw 0 0;
        font-size: 2.66vw;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap .genre_slider .slider_contents .slider_contentsIn .chname {
        margin: 0;
        font-size: 2.66vw;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap>.more {
        position: relative;
        width: 100%;
        margin: 0 auto;
        padding: 3.19vw 0;
        font-size: 3.19vw;
        font-weight: bold;
        text-align: center;
        border: 2px solid #ffffff;
        background: #0099ff;
        color: #ffffff;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap>.more::before {
        content: "";
        position: absolute;
        top: 50%;
        right: 2.26vw;
        width: 2.13vw;
        height: 0.26vw;
        background: #ffffff;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap>.more::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 2.26vw;
        width: 2.13vw;
        height: 0.26vw;
        background: #ffffff;
        transform: translate(0, -50%) rotate(90deg);
        -ms-transform: translate(0, -50%) rotate(90deg);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .bangumiArea .genre_wrap>.more:hover {
        opacity: 0.5;
    }


    /* -- scheduleArea -- */
    .mainContents .searchArea .service_contents .scheduleArea {
        padding: 9.99vw 0 10.66vw;
        border-bottom: 3px solid #ffffff;
        background-color: #0099ff;
        background-image: url(/service/portal/present/16days/img/sp/bg_service_contents02.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: top center;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn {
        margin: 0 3.99vw;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn>h3.tit {
        margin: 0 auto 5.33vw;
        padding: 0;
        font-size: 5.33vw;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn>h3.tit span {
        position: relative;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn>h3.tit span::before {
        content: "";
        position: absolute;
        top: -0.26vw;
        left: -10.93vw;
        width: 8.26vw;
        height: 7.06vw;
        background: url(/service/portal/present/16days/img/sp/icon_schedule01.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn>h3.tit+.subtit {
        margin: 0 auto 7.33vw;
        font-size: 3.73vw;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select {
        position: relative;
        margin: 0 3.99vw;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select p.tit {
        margin: 7.99vw auto 3.99vw;
        padding: 0;
        font-size: 4.26vw;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select {
        position: relative;
        margin: 0 3.99vw 7.99vw;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select p.tit {
        margin: 7.99vw auto 3.99vw;
        padding: 0;
        font-size: 4.26vw;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select p.genre_select_list,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select p.date_select_list,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select p.time_select_list {
        position: relative;
        display: flex;
        justify-content: left;
        align-items: center;
        height: 13.33vw;
        margin: 0;
        padding: 0 3.99vw;
        font-size: 3.46vw;
        font-weight: bold;
        background: #ffffff;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select p.genre_select_list::after,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select p.date_select_list::after,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select p.time_select_list::after {
        content: '';
        display: inline-block;
        width: 4vw;
        height: 2.66vw;
        position: absolute;
        top: 50%;
        right: 2.66vw;
        margin-top: -1.33vw;
        background: url('/service/portal/present/16days/img/icon_arrow_down.png') no-repeat 0 0;
        background-size: contain;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select p.genre_select_list.active::after,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select p.date_select_list.active::after,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select p.time_select_list.active::after {
        background-image: url('/service/portal/present/16days/img/icon_arrow_up.png');
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select .genre_list,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select .date_list,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select .time_list {
        position: relative;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.time {
        display: none;
        width: 100%;
        margin: 0 auto;
        padding: 0;
        border: 2px solid #eaeaea;
        background: #ffffff;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        z-index: 10;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul li,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.time li {
        display: block;
        background: #ffffff;
        font-weight: bold;
        font-size: 3.46vw;
        color: #000000;
        border-bottom: 2px solid #eaeaea;
        padding: 2.66vw 3.99vw;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul li:hover,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li:hover,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.time li:hover {
        background: #eaeaea;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .genre_select ul li:last-child,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li:last-child,
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.time li:last-child {
        border: none;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li.day0 {
        color: #e53935;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .date_select ul.date li.day6 {
        color: #1976d2;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select {
        margin: 0 auto;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select>.tit {
        margin: 0 auto 3.99vw;
        padding: 0;
        font-size: 4.26vw;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list {
        margin: 0 0 7.99vw;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul {}

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li {
        margin: 0 0 1.33vw;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name {
        position: relative;
        display: flex;
        justify-content: left;
        align-items: center;
        margin: 0;
        height: 13.33vw;
        border-bottom: none;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name.active {
        border-bottom: 2px solid #0099ff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name::before {
        content: "";
        position: absolute;
        top: 50%;
        right: 2.26vw;
        width: 2.13vw;
        height: 0.26vw;
        background: #0099ff;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 2.26vw;
        width: 2.13vw;
        height: 0.26vw;
        background: #0099ff;
        transform: translate(0, -50%) rotate(90deg);
        -ms-transform: translate(0, -50%) rotate(90deg);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name.active::after {
        content: none;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name .logo {
        width: 13.33vw;
        height: 100%;
        padding: 1.33vw;
        background: #ffffff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name .name {
        position: relative;
        display: flex;
        justify-content: left;
        align-items: center;
        width: calc(100% - 13.33vw);
        height: 100%;
        margin: 0;
        padding: 0 6.66vw 0 3.73vw;
        font-size: 3.19vw;
        font-weight: bold;
        border-left: 2px solid #0099ff;
        background: #ffffff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_name .name::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        width: 6.66vw;
        height: 100%;
        background: #f4f4f4;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table {
        position: relative;
        display: none;
        background: #ffffff;
        padding: 4.66vw 0;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 13.33vw;
        height: 100%;
        background: #f4f4f4;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table::after {
        content: "";
        position: absolute;
        top: 0;
        left: 13.33vw;
        width: 2px;
        height: 100%;
        background: #0099ff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table .table_col {
        position: relative;
        display: flex;
        justify-content: left;
        margin: 0 0 3.99vw;
        z-index: 2;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table .message{
        position: relative;
        display: none;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table.empty::before,
   .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table.empty::after{
            display: none;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table.empty .message{
        padding: 0 0 0 2.66vw;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table.empty .message p{
        margin: 0;
        padding: 0;
        font-size: 3.19vw;
    }
    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table .table_col:last-child {
        margin: 0;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table .table_col .start {
        width: 13.33vw;
        margin: 0;
        font-size: 2.93vw;
        font-weight: bold;
        line-height: 1.5;
        text-align: center;
        color: #0099ff;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select .ch_list ul li .ch_table .table_col .title {
        width: calc(100% - 13.33vw);
        margin: 0;
        padding: 0 6.66vw 0 3.73vw;
        font-size: 3.19vw;
        line-height: 1.5;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select>.more {
        position: relative;
        width: 100%;
        margin: 0 auto;
        padding: 3.19vw 0;
        font-size: 3.19vw;
        font-weight: bold;
        text-align: center;
        border: 2px solid #ffffff;
        background: #0099ff;
        color: #ffffff;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select>.more::before {
        content: "";
        position: absolute;
        top: 50%;
        right: 2.26vw;
        width: 2.13vw;
        height: 0.26vw;
        background: #ffffff;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select>.more::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 2.26vw;
        width: 2.13vw;
        height: 0.26vw;
        background: #ffffff;
        transform: translate(0, -50%) rotate(90deg);
        -ms-transform: translate(0, -50%) rotate(90deg);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .scheduleArea .scheduleAreaIn .ch_select>.more:hover {
        opacity: 0.5;
    }


    /* -- chArea -- */
    .mainContents .searchArea .service_contents .chArea {
        padding: 10.66vw 0 10.66vw;
        border-bottom: 3px solid #ffffff;
        background-color: #0099ff;
        background-image: url(/service/portal/present/16days/img/sp/bg_service_contents02.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: top center;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn {
        margin: 0 3.99vw;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn>h3.tit {
        margin: 0 auto 7.99vw;
        padding: 0;
        font-size: 5.33vw;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn>h3.tit span {
        position: relative;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn>h3.tit span::before {
        content: "";
        position: absolute;
        top: 0;
        left: -11.33vw;
        width: 7.73vw;
        height: 6.79vw;
        background: url(/service/portal/present/16days/img/sp/icon_ch01.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select {
        position: relative;
        margin: 0 3.99vw 10.66vw;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select>p.tit {
        margin: 0 auto 3.99vw;
        padding: 0;
        font-size: 4.26vw;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select>p.genre_select_list {
        position: relative;
        display: flex;
        justify-content: left;
        align-items: center;
        height: 13.33vw;
        margin: 0;
        padding: 0 3.99vw;
        font-size: 3.46vw;
        font-weight: bold;
        background: #ffffff;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select>p.genre_select_list.active {
        color: #8c8c8c;
        background: #eaeaea;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select .genre_list {
        position: relative;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select ul {
        display: none;
        width: 100%;
        margin: 0 auto;
        padding: 0;
        border: 2px solid #eaeaea;
        background: #ffffff;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        z-index: 10;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select ul li {
        display: block;
        background: #ffffff;
        font-weight: bold;
        font-size: 3.46vw;
        color: #000000;
        border-bottom: 2px solid #eaeaea;
        padding: 2.66vw 3.99vw 2.66vw 6.4vw;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select ul li.active,
    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_select ul li:hover {
            background: #e5f5ff;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap {
        margin: 0 3.99vw 7.99vw;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents {
        margin: 0 0 10.66vw;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents:last-child {
        margin: 0;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_title {
        margin: 0 0 3.99vw;
        padding: 1.86vw 0;
        font-size: 4.26vw;
        line-height: 1;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        background-color: #80ccff;
        /* background: url(/service/portal/present/16days/img/bg_stripe.png);
        background-repeat: repeat; */
        color: #ffffff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list {
        margin: 0;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list .genre_list_body {
        position: relative;
        display: flex;
        justify-content: left;
        align-items: center;
        margin: 0 0 1.33vw;
        height: 13.33vw;
        border-bottom: none;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list .genre_list_body .cnl-cnl-logo {
        width: 13.33vw;
        height: 100%;
        padding: 1.33vw;
        background: #ffffff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list .genre_list_body .cnl-cnl-name {
        position: relative;
        display: flex;
        justify-content: left;
        align-items: center;
        width: calc(100% - 13.33vw);
        height: 100%;
        margin: 0;
        padding: 0 6.66vw 0 3.73vw;
        font-size: 3.19vw;
        font-weight: bold;
        border-left: 2px solid #0099ff;
        background: #ffffff;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list_note {
        margin: 2.66vw 0 0;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list_note li {
        position: relative;
        margin: 0;
        padding: 0 0 0 2.66vw;
        font-size: 2.66vw;
        line-height: 1.7;
        box-sizing: border-box;
    }
    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list_note li a {
        text-decoration: underline;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn .genre_wrap .genre_contents .genre_list_note li::before {
        content: '\203B';
        position: absolute;
        top: 0;
        left: 0;
        font-size: 2.66vw;
        line-height: 1.7;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn>.more {
        position: relative;
        margin: 0 3.99vw;
        padding: 3.19vw 0;
        font-size: 3.19vw;
        font-weight: bold;
        text-align: center;
        border: 2px solid #ffffff;
        background: #0099ff;
        color: #ffffff;
        box-sizing: border-box;
        cursor: pointer;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn>.more::before {
        content: "";
        position: absolute;
        top: 50%;
        right: 2.26vw;
        width: 2.13vw;
        height: 0.26vw;
        background: #ffffff;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn>.more::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 2.26vw;
        width: 2.13vw;
        height: 0.26vw;
        background: #ffffff;
        transform: translate(0, -50%) rotate(90deg);
        -ms-transform: translate(0, -50%) rotate(90deg);
        z-index: 2;
    }

    .mainContents .searchArea .service_contents .chArea .chAreaIn>.more:hover {
        opacity: 0.5;
    }



    /* -- chArea -- */
    .mainContents .searchArea .service_contents .osusumeArea {
        padding: 10.66vw 0 10.66vw;
        border-bottom: 3px solid #ffffff;
        background-color: #0099ff;
        background-image: url(/service/portal/present/16days/img/sp/bg_service_contents02.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: top center;
        box-sizing: border-box;
    }

    .mainContents .searchArea .service_contents .osusumeArea .osusumeAreaIn {
        margin: 0 3.99vw;
    }

    .mainContents .searchArea .service_contents .osusumeArea .osusumeAreaIn>h3.tit {
        margin: 0 auto 7.99vw;
        padding: 0;
        font-size: 5.33vw;
        font-weight: bold;
        text-align: center;
        text-shadow: 2px 2px 2px rgba(6, 0, 1, 0.75);
        color: #ffffff;
    }

    .mainContents .searchArea .service_contents .osusumeArea .osusumeAreaIn>h3.tit span {
        display: inline-block;
        background: url(/service/portal/present/16days/img/icon_kihon.png);
        background-size: 12.933vw auto;
        background-repeat: no-repeat;
        background-position: center top;
        position: relative;
        padding-top: 12vw;
    }

    .mainContents .searchArea .service_contents #premium_osusumeArea .osusumeAreaIn>h3.tit span,
    .mainContents .searchArea .service_contents #hikari_osusumeArea .osusumeAreaIn>h3.tit span{
        background: none;
        padding-top: 0;
    }

    /* .mainContents .searchArea .service_contents .osusumeArea .osusumeAreaIn>h3.tit span::before {
        content: "";
        position: absolute;
        top: 0;
        left: -6.4vw;
        width: 12.933vw;
        height: 8.933vw;
    } */



    /* -- attArea -- */
    .mainContents .attArea {}

    .mainContents .attArea .attAreaIn {
        margin: 0 auto;
        padding: 10.66vw 0;
    }

    .mainContents .attArea .attAreaIn .tit {
        margin: 0 3.99vw;
        font-size: 3.73vw;
        font-weight: bold;
        line-height: 1.7;
    }

    .mainContents .attArea .attAreaIn>ul {
        margin: 0 3.99vw;
    }

    .mainContents .attArea .attAreaIn>ul li {
        position: relative;
        margin: 0;
        padding: 0 0 0 3.73vw;
        font-size: 3.73vw;
        line-height: 1.7;
        box-sizing: border-box;
    }

    .mainContents .attArea .attAreaIn>ul li::before {
        content: '・';
        position: absolute;
        top: 0;
        left: 0;
        font-size: 3.73vw;
        line-height: 1.7;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box {
        background: #ffffff;
        box-sizing: border-box;
        border: 0.3vw solid #0099ff;
        margin: 10.66vw 3.99vw 0;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box>p {
        color: #0099ff;
        font-size: 4.3vw;
        font-weight: bold;
        position: relative;
        cursor: pointer;
        margin: 0;
        padding: 1.8vw 10.6vw 1.7vw 3.1vw;
        line-height: 1.5;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box>p::before {
        content: "";
        width: 7.2vw;
        height: 7.2vw;
        background: #cdcdcd;
        border-radius: 50%;
        position: absolute;
        top: 50%;
        right: -1.2vw;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box>p::after {
        content: "";
        width: 4vw;
        height: 0.55vw;
        background: #ffffff;
        position: absolute;
        top: 50%;
        right: 2vw;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box>p.active>span::after {
        content: "";
        width: 0.55vw;
        height: 4vw;
        background: #ffffff;
        position: absolute;
        top: 50%;
        right: 5.5vw;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn {
        padding: 2.5vw 3.6vw 4vw;
        border-top: 0.3vw solid #0099ff;
        display: none;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note {
        margin: 0;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note>li {
        font-size: 3.6vw;
        text-indent: -1.5em;
        padding-left: 1.5em;
        margin: 3.1vw 0 0;
        font-weight: bold;
        line-height: 1.75;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note>li:first-child {
        margin: 0;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note>li::before {
        content: "※";
        padding-right: 0.5em
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note>li>ul.list-disc {
        margin: 2.6vw 0 0 -0.2em;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note>li>ul.list-disc>li {
        font-size: 2.9vw;
        text-indent: 0;
        font-weight: bold;
        line-height: 1.5;
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note>li>ul.list-disc>li::before {
        content: '・';
    }

    .mainContents .attArea .attAreaIn .sixteen-white-box div.sixteen-white-boxIn>ul.list-note>li>ul.list-disc>li>span {
        padding-right: 3.1vw;
    }

	/*158_SPCC_WEB-11416　追記*/
   .attAreaIn a {
        color: #09f;
    }  
}

#programCopyright{
    margin-top: 20px;
}
#programCopyright div{
    display: none;
}
#programCopyright div.active{
    display: block;
}

