@charset "UTF-8";

/* ---------------------------------------------
	スタイルリセット
--------------------------------------------- */
html, body, div,
h1, h2, h3, h4, h5, h6,
p, pre, blockquote,
ul, ol, li, dl, dt, dd, address {margin: 0; padding: 0;}
ul, ol {list-style: none;}
img {border: none; vertical-align:bottom; }

/* ---------------------------------------------
	汎用クラス
--------------------------------------------- */
/* clearfix ------------ */
.clearfix:after {
	content: "";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.clearfix {display: inline-block;}

/* Hide from MacIE €*/
* html .clearfix { height: 1px; }
.clearfix { display: block; }
/* End Hide from MacIE */

/* ---------------------------------------------
	タイポグラフィー
--------------------------------------------- */
body {
	font-family: ヒラギノ角ゴ ProN W3,Hiragino Kaku Gothic ProN,"メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Lucida Grande", "Avenir Next", Arial, Verdana, sans-serif;
}
/*@media all and (-ms-high-contrast:none) {
	body{
		font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W4", "Hiragino Kaku Gothic Pro", "Lucida Grande", Verdana, "ＭＳ Ｐゴシック", sans-serif;
	}
}*/

html>/**/body { font-size: 16px; line-height: normal;overflow-x: hidden; } /* except Win IE */

h1, h2, h3, h4, h5, h6 {font-size: 100%;}

/* ---------------------------------------------
	基本項目
--------------------------------------------- */
html, body {height:100%; color:#333333;}
h1, h2, h3, h4, h5, h6, p, dt, dd, li{
	background:  url("../img/spacer.gif") repeat 0px 0px;
	max-height: 100%;
}

/*共通スタイル*/
.bold {font-weight:bold;}
.center{text-align:center;}

a:link { color:#63b6d0; text-decoration:none; font-weight:normal;}
a:visited { color:#63b6d0; text-decoration:none;}
a:hover { color:#63b6d0; text-decoration:none;}
a:active { color:#63b6d0; text-decoration:none;}

.clears{ clear:both;}
.fLeft{float: left;}
.fRight{float: right;}

.mt10{margin-top: 10px;}
.mt15{margin-top: 15px;}
.mt20{margin-top: 20px;}
.mt25{margin-top: 25px;}
.mt30{margin-top: 30px;}

body{
    -webkit-text-size-adjust:100% !important;
    background-color: #fff;
}
.displaysp{ display: none;}
.cx_smartphoneview .displaypc{ display: none;}
.cx_smartphoneview .displaysp{ display: block;}

#fp-wrap{
    border-top: solid 1px #ccc;
    border-bottom: solid 1px #ccc;
    background: rgb(242,249,255);
    background: -moz-linear-gradient(top,  rgba(242,249,255,1) 0%, rgba(214,244,255,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(242,249,255,1)), color-stop(100%,rgba(214,244,255,1)));
    background: -webkit-linear-gradient(top,  rgba(242,249,255,1) 0%,rgba(214,244,255,1) 100%);
    background: -o-linear-gradient(top,  rgba(242,249,255,1) 0%,rgba(214,244,255,1) 100%);
    background: -ms-linear-gradient(top,  rgba(242,249,255,1) 0%,rgba(214,244,255,1) 100%);
    background: linear-gradient(to bottom,  rgba(242,249,255,1) 0%,rgba(214,244,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f9ff', endColorstr='#d6f4ff',GradientType=0 );
    background-attachment: fixed;
}
#fp-l{
    background-color: #fff;
    box-shadow: 1px 1px 60px 60px #fff;
}

/* ---------------------------------------------
	グローバルヘッダー
--------------------------------------------- */
#hdrWrap{
    width: 100%;
    background-color: #fff;
    padding: 10px 0 0;
}
#mainV h1{
    /* background: url("../photo/mainVisual_cx.jpg") no-repeat 0 0; */
    width: 640px;
    height: 640px;
    text-indent: -300%;
    overflow: hidden;
    white-space: nowrap;
}
.webp #mainV h1{
    background: url("../photo/mainVisual_cx.webp") no-repeat center center;
    background-size: contain;
}
.no-webp #mainV h1{
    background: url("../photo/mainVisual_cx.jpg") no-repeat center center;
    background-size: contain;
}
#mainV h1 a{
    display: block;
    width: 640px;
    height: 640px;
}
#global-header,
#global-footer{
    width: 640px;
    box-sizing: border-box;
    border-bottom: solid 2px #63b6d0;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    margin: 0 auto;
    text-align: center;
}
/*#global-header h1{
    float: left;
}
#global-header h1 a{
    display: block;
    background: url("../img/haruko_logo_nav.png") no-repeat center 0;
    width: 224px;
    height: 54px;
    background-size: contain;
    text-indent: -300%;
    overflow: hidden;
    white-space: nowrap;
    margin: 10px 0 10px 12px;
}*/
#global-header .nav_list,
#global-footer .nav_list{
    /*float: right;*/
    display: inline-block;
    padding: 17px 0 0;
}
#global-header .nav_list > li,
#global-footer .nav_list > li{
    min-width: 50px;
    float: left;
    margin: 0 12px;
    text-align: center;
    position: relative;
}
#global-header .nav_list > li a,
#global-footer .nav_list > li a{
    display: block;
    font-size: 88%;
    color: #333;
}
#global-header .nav_list li a:hover{ color: #63b6d0;}
#global-header .nav_list > li > a::before,
#global-footer .nav_list > li > a::before{
    content: "";
    display: block;
    height: 26px;
    background-size: contain;
    margin: 0 auto 3px;
}
#global-header .nav_list > li.summary > a::before,
#global-footer .nav_list > li.summary > a::before{
    background: url("../img/icn_summary.svg") no-repeat center 0;
    width: 26px;
}
#global-header .nav_list > li.ticket > a::before,
#global-footer .nav_list > li.ticket > a::before{
    background: url("../img/icn_ticket.svg") no-repeat center 2px;
    width: 32px;
}
#global-header .nav_list > li.gameInfo > a::before,
#global-footer .nav_list > li.gameInfo > a::before{
    background: url("../img/icn_game.svg") no-repeat center 0;
    width: 34px;
}
#global-header .nav_list > li.movie > a::before,
#global-footer .nav_list > li.movie > a::before{
    background: url("../img/icn_movie.svg") no-repeat center 2px;
    width: 34px;
}
#global-header .nav_list > li.goods > a::before,
#global-footer .nav_list > li.goods > a::before{
    background: url("../img/icn_goods.svg") no-repeat center 2px;
    width: 38px;
}
#global-header .nav_list > li.tvInfo > a::before,
#global-footer .nav_list > li.tvInfo > a::before{
    background: url("../img/icn_tv.svg") no-repeat center 0;
    width: 32px;
}
#global-header .nav_list > li.history > a::before,
#global-footer .nav_list > li.history > a::before{
    background: url("../img/icn_history.svg") no-repeat center 0;
    width: 32px;
}
#global-header .nav_list > li.stream > a::before,
#global-footer .nav_list > li.stream > a::before{
    background: url("../img/icn_stream.svg") no-repeat center 2px;
    width: 32px;
}
#global-footer{
    zoom:1.8;
    width: 100%;
    padding-bottom: 10px;
}
/*#global-footer .nav_list > li a{ font-size: 100%;}*/


/*#global-header .nav_list > li > div{
    position: absolute;
    top: 58px;
    left: -110px;
    width: 260px;
    background-color: rgba(220,220,220,0.9);
    padding: 20px;
    text-align: left;
    display: none;
}
#global-header .nav_list > li > div li{
    padding: 0.4em 0;
}
#global-header .nav_list > li > div a::after{
    content: "";
    display: block;
    background: url("../img/cursor_ss.png") no-repeat 0 0;
    width: 20px;
    height: 20px;
    float: left;
    margin: 0 5px 0 0;
    background-size: contain;
}
#global-header .nav_list > li > div a:hover{
    color: #333;
    text-decoration: underline;
}

#global-header #navBtn_sp{
    position: relative;
    border-left: solid 2px #aaa;
    width: 56px;
    height: 56px;
    float: right;
    cursor: pointer;
    display: none;
}
#global-header #navBtn_sp span{
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 30px;
    height: 4px;
    background-color: #555;
    border-radius: 2px;
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
    transition: all 200ms ease-out;
}
#global-header #navBtn_sp span:nth-of-type(1){ top: 16px;}
#global-header #navBtn_sp span:nth-of-type(2){ top: 26px;}
#global-header #navBtn_sp span:nth-of-type(3){ top: 36px;}
#global-header #navBtn_sp.on span:nth-of-type(1){
    transform: rotate(45deg) translate3d(10px, 8px, 0);
    -webkit-transform: rotate(45deg) translate3d(10px, 8px, 0);
	-moz-transform: rotate(45deg) translate3d(10px, 8px, 0);
	-ms-transform: rotate(45deg) translate3d(10px, 8px, 0);
    -webkit-transform-origin: top center;
    -moz-transform-origin: top center;
    -ms-transform-origin: top center;
    transform-origin: top center;
    transition: all 200ms ease-out;
}
#global-header #navBtn_sp.on span:nth-of-type(3){
    transform: rotate(-45deg) translate3d(6px, -6px, 0);
    -webkit-transform: rotate(-45deg) translate3d(6px, -6px, 0);
	-moz-transform: rotate(-45deg) translate3d(6px, -6px, 0);
	-ms-transform: rotate(-45deg) translate3d(6px, -6px, 0);
    -webkit-transform-origin: bottom center;
    -moz-transform-origin: bottom center;
    -ms-transform-origin: bottom center;
    transform-origin: bottom center;
    transition: all 200ms ease-out;
}
#global-header #navBtn_sp.on span:nth-of-type(2){
    opacity: 0.0;
}*/
/*

@media screen and (max-width: 870px) { 
    #whole{ padding-top: 56px;}
    #global-header .nav_list{
        display: none;
        width: 100%;
        height: 100vh;
        position: absolute;
        background-color: rgba(255,255,255,0.9);
        top: 56px;
        left: 0;
        float: none;
        margin: 0;
        padding: 30px 20px;
        box-sizing: border-box;
        -ms-transform: translate3d(870px, 0, 0);
        -webkit-transform: translate3d(870px, 0, 0);
        -moz-transform: translate3d(870px, 0, 0);
        -webkit-transition: -webkit-transform 0.4s ease-out;
        -ms-transition: -ms-transform 0.4s ease-out;
        transition: transform 0.4s ease-out;
    }
    #global-header .nav_list.on{
        display: block;
        -ms-transform: translate3d(0px, 0, 0);
        -webkit-transform: translate3d(0px, 0, 0);
        -moz-transform: translate3d(0px, 0, 0);
    }
    #global-header .nav_list > li{
        float: none;
        text-align: left;
        margin: 0 0 0.6em;
        border-bottom: solid 1px #888;
        padding-bottom: 0.6em;
    }
    #global-header .nav_list > li > a::before{
        margin: 0 0 0 0;
        float: left;
    }
    #global-header .nav_list > li.summary > a::before,
    #global-header .nav_list > li.ticket > a::before,
    #global-header .nav_list > li.gameInfo > a::before,
    #global-header .nav_list > li.movie > a::before,
    #global-header .nav_list > li.goods > a::before,
    #global-header .nav_list > li.tvInfo > a::before,
    #global-header .nav_list > li.history > a::before{
        width: 38px;
        margin-left: -45px;
    }
    #global-header .nav_list > li > a{ line-height: 26px; padding-left: 45px;}
    #global-header .nav_list > li > div{
        position: relative;
        top: auto;
        left: 0;
        width: 100%;
        padding: 0px;
        text-align: left;
        display: block;
        background: none;
    }
    #global-header .nav_list > li > div li{
        padding: 10px 0 10px 45px;
    }
    #global-header .nav_list > li > div li:nth-last-of-type(1){ padding-bottom: 0;}
    #global-header .nav_list > li > div li a{ font-size: 80%;}
    
    #global-header #navBtn_sp{ display: block;}
    #global-header{ height: 56px;}
    #global-header h1 a{
        width: 193px;
        margin: 5px 10px;
        height: 46px;
    }
}
*/



/* ---------------------------------------------
	コンテンツ
--------------------------------------------- */
body.cx_smartphoneview #mainContents{font-size: 164%;}
#mainContents{ padding: 30px 0 60px;}
.cx_smartphoneview #mainContents{ padding: 30px 20px 0;}
#mainContents > div{
    margin-bottom: 4em;
}
h2{
    font-size: 160%;
    color: #5a5a5a;
    font-weight: 100;
    margin-bottom: 14px;
    line-height: 1.2;
    /*text-align: center;*/
    border-bottom: solid 1px #aaa;
    padding-bottom: 0.3em;
    font-feature-settings: "palt";
}
@media all and (-ms-high-contrast:none) {
    h2{ font-weight: normal;}
}
@media screen and (max-width: 630px) {
    h2{ font-size: 135%;}
}
h2 span{
    font-size: 70%;
}

/* ---------------------------------------------
	お知らせ
--------------------------------------------- */
.news p{
    background-color: #63b6d0;
    color: #fff;
    font-weight: bold;
    line-height: 1.2;
    padding: 0.3em;
    text-align: center;
}

/* ---------------------------------------------
	プレゼント
--------------------------------------------- */
#present a{
    line-height: 1.4;
    display: block;
    text-align: center;
    padding: 0.6em 0;
    background-color: #e4007f;
    color: #fff;
    font-weight: bold;
    cursor: pointer;
    border-radius: 60px;
}
.cx_smartphoneview #present a{
    font-size: 150%;
    letter-spacing: -0.03em;
    margin: 0 0.5em;
}
.cx_displaydevice #present a:hover{ background-color: #ff008e;}

/* ---------------------------------------------
	放送スケジュール
--------------------------------------------- */
#oaSchedule h3{
    font-size: 130%;
    font-weight: bold;
    color: #63b6d0;
    line-height: 1.8;
}
#oaSchedule dl{
    padding-bottom: 0.3em;
    margin-bottom: 0.6em;
    border-bottom: dashed 1px #aaa;
    display: flex;
    flex-wrap: wrap;
    line-height: 1.6;
}
#oaSchedule dl > *{ flex-shrink: 0;}
#oaSchedule dt{
    /*float: left;*/
    font-weight: bold;
    width: 9em;
}
#oaSchedule dt::before{
    content: "■";
    color: #e4007f;
    margin-right: 3px;
}
#oaSchedule dd{
    /*padding-left: 8em;*/
}
#oaSchedule dd .ttl{
    /*background-color: #63b6d0;
    color: #fff;*/
    font-weight: bold;
    color: #63b6d0;
}
#oaSchedule dd .ttl span{
    background-color: #63b6d0;
    color: #fff;
    padding: 0.2em 0.3em;
}
.cx_smartphoneview .narrowsp{
    letter-spacing: -0.07em;
    font-size: 90%;
}
#oaSchedule dd span.opt{
    font-size: 76%;
    color: #333;
    font-feature-settings: "palt";
}

.cx_smartphoneview #oaSchedule dl{
    font-size: 94%;
    line-height: 1.4;
    /* line-height: 1.6; */
}
/*.cx_smartphoneview #oaSchedule dt{
    float: none;
    margin-top: 0.5em;
}
.cx_smartphoneview #oaSchedule dd{ padding-left: 0;}*/
/*.cx_smartphoneview #oaSchedule dd{
    padding-left: 6.6em;
}*/
.cx_smartphoneview #oaSchedule dd .ttl{
    line-height: 1.4;
}
.cx_smartphoneview #oaSchedule dd span.opt{ vertical-align: text-bottom;}

#oaSchedule > p{
    line-height: 1.4;
    margin-bottom: 0.4em;
}
.cx_smartphoneview #oaSchedule > p{ font-size: 94%;}
#oaSchedule > a{
    display: block;
    width: 100%;
    font-size: 100%;
    background-color: #63b6d0;
    color: #fff;
    font-weight: 100;
    line-height: 3.0em;
    border-radius: 50px;
    position: relative;
    text-align: center;
}
#oaSchedule > a:hover{ background-color: #3ac0ea;}
#oaSchedule > a::after{
    content: "";
    display: block;
    background: url("../img/cursor_s.svg") no-repeat 0 0;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 50%;
    right: 2%;
    margin: -12px 0 0;
}

.cx_smartphoneview #oaSchedule > a::after{
    width: 36px;
    height: 36px;
    margin: -18px 0 0;
}

/* ---------------------------------------------
	スペシャルサポーター
--------------------------------------------- */
.supporter__mov{
    width: 640px;
    height: 360px;
    /* background-color: #000; */
    margin-top: 1em;
}
.cx_smartphoneview .supporter__mov{
    width: 600px;
    height: 338px;
}
#supporter .photoWrap{
    float: left;
    background-color: #aaa;
    width: 308px;
    height: 360px;
    margin-right: 1em;
    background: url(../photo/supporter_ph_pc.jpg) no-repeat 0 0;
    background-size: contain;
}
.cx_smartphoneview #supporter .photoWrap{
    width: 100%;
    height: 400px;
    float: none;
    margin: 0 0 0.5em;
    background: url(../photo/supporter_ph_sp.jpg) no-repeat 0 0;
}
#supporter .prof dt{
    font-size: 140%;
    font-weight: bold;
    line-height: 1.4;
    color: #63b6d0;
}
#supporter .prof dd{
    font-size: 88%;
    line-height: 1.6;
}
#supporter .catch{
    font-size: 92%;
    background-color: #e4007f;
    color: #fff;
    line-height: 1.4;
    padding: 0.3em 0.4em;
    margin: 0.5em 0 0.8em;
}
#supporter .comment dt{
    font-weight: bold;
    line-height: 1.4;
    padding-bottom: 0.5em;
}
#supporter .comment dt.opt{
    background-color: #63b6d0;
    color: #fff;
    line-height: 1.0;
    padding: 0.3em 0.5em;
    margin: 0.8em 0 0.4em;
}
#supporter .comment dd{
    font-size: 88%;
    line-height: 1.8;
    text-align: justify;
}
#supporter .link{ margin: 1em 0;}
#supporter .link a{
    display: block;
    text-align: center;
    border: solid 4px #e4007f;
    color: #e4007f;
    line-height: 1.6;
    padding: 0.5em 0;
    font-weight: bold;
    font-size: 110%;
}
#supporter .link a span{
    font-size: 88%;
    font-feature-settings: "palt";
}
#supporter .link a:hover{
    background-color: rgba(255, 235, 0, 0.16);
}
.cx_smartphoneview #supporter .link a{
    border: solid 6px #e4007f;
}

/* ---------------------------------------------
	動画集
--------------------------------------------- */
.movWrap h3{
    font-size: 110%;
    color: #63b6d0;
    line-height: 1.2;
    padding-top: 1em;
    padding-bottom: 0.5em;
    /*display: none;*/
    border-top: dashed 1px #aaa;
}
.movWrap h2 + h3{
    padding-top: 0;
    border: none;
}
.movWrap > ul{
    display: flex;
    flex-wrap: wrap;
    /*border-bottom: dashed 1px #aaa;*/
    /*margin-bottom: 1em;*/
    padding-bottom: 0.3em;
    display: none;
}
.movWrap > ul li{
    display: none;
    flex-shrink: 0;
    width: 32%;
    margin: 0 2% 1em 0;
    box-shadow: 1px 1px 10px rgba(0,0,0,0.16);
    border-bottom: solid 5px #fff;
    -ms-transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0px, 0);
    -moz-transform: translate3d(0, 0px, 0);
    -webkit-transition: border-bottom 0.2s, -webkit-transform 0.2s ease-out;
    -ms-transition: border-bottom 0.2s, -ms-transform 0.2s ease-out;
    transition: border-bottom 0.2s, transform 0.2s ease-out;
}
.movWrap > ul li:nth-of-type(3n){ margin-right: 0;}
.cx_smartphoneview .movWrap > ul li{
    width: 49%;
}
.cx_smartphoneview .movWrap > ul li:nth-of-type(3n){ margin-right: 2%;}
.cx_smartphoneview .movWrap > ul li:nth-of-type(2n){ margin-right: 0;}

.movWrap > ul > li:hover{
    border-bottom: solid 5px #63b6d0;
    -ms-transform: translate3d(0, -5px, 0);
    -webkit-transform: translate3d(0, -5px, 0);
    -moz-transform: translate3d(0, -5px, 0);
}

.movWrap .thum{ position: relative; overflow: hidden;}
.movWrap .thum img{ width: 100%; height: auto;}
.movWrap .minna .thum img{
    width: 240%; height: auto;
    margin-left: -70%;
}
.movWrap .thum::after{
    content: "";
    display: block;
    position: absolute;
    bottom: 5px;
    right: 5px;
    background: url("../img/playIcn.png") no-repeat;
    width: 30px;
    height: 30px;
    background-size: contain;
    border: solid 3px rgba(255,255,255,0.6);
    border-radius: 50%;
}
.cx_smartphoneview .movWrap .thum::after{
    width: 50px;
    height: 50px;
    border: solid 4px rgba(255,255,255,1);
}
.cx_displaydevice .movWrap > ul > li:hover .thum::after{ border: solid 3px rgba(255,255,255,1.0);}

.movWrap .category{
    background-color: #63b6d0;
    color: #fff;
    line-height: 1.2;
    padding: 3px 10px;
    font-size: 88%;
}
.movWrap > ul > li dt{
    font-weight: bold;
    font-size: 94%;
    padding: 10px 10px 4px;
    line-height: 1.2;
}
.movWrap .cap{
    font-size: 80%;
    padding: 0 10px 10px;
    line-height: 1.4;
}
.movWrap > ul > li a{ color: #333;}

.movWrap > a{
    display: block;
    width: 100%;
    font-size: 100%;
    background-color: #63b6d0;
    color: #fff;
    font-weight: 100;
    line-height: 3.0em;
    border-radius: 50px;
    position: relative;
    text-align: center;
    margin-bottom: 1.6em;
}
.movWrap > a:hover{ background-color: #3ac0ea;}
.movWrap > a::after{
    content: "";
    display: block;
    background: url("../img/cursor_s.svg") no-repeat 0 0;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 50%;
    right: 2%;
    margin: -12px 0 0;
    transform: rotate(90deg);
}
.movWrap > a.on::after{ transform: rotate(-90deg);}

.cx_smartphoneview .movWrap > a::after{
    width: 36px;
    height: 36px;
    margin: -18px 0 0;
}

/* ---------------------------------------------
	データ放送
--------------------------------------------- */
#data_present{
    background-color: #faf9e5;
    padding: 1em 1.2em 1.2em;
    position: relative;
}
.cx_smartphoneview #data_present{ padding: 0.8em;}
#data_present::after{
    content: "";
    display: block;
    background: url("../img/vabo.svg") no-repeat 0 0;
    position: absolute;
    top: 0.5em;
    right: 0;
    width: 4em;
    height: 4em;
    background-size: contain;
    
}
#data_present h2{
    color: #63b6d0;
    border-bottom: dotted 2px #63b6d0;
    padding-top: 0.1em;
    padding-bottom: 0.1em;
    margin-bottom: 0.3em;
}
.cx_smartphoneview #data_present h2{
    font-size: 138%;
    margin-bottom: 0.3em;
    padding-bottom: 0;
}
#data_present h2 + p{
    font-size: 116%; line-height: 1.4;
    font-weight: bold;
    padding-bottom: 0.5em;
}
.cx_smartphoneview #data_present h2 + p{
    font-size: 108%;
    line-height: 1.4;
    font-feature-settings: "palt";
}
#data_present .photoWrap{
    float: left;
    width: 27%;
    margin-right: 1em;
    position: relative;
    z-index: 555;
}
.cx_smartphoneview #data_present .photoWrap{
    width: 30%;
    margin-right: 0.6em;
}
#data_present .photoWrap img{ width: 100%;  height: auto;}
#data_present a{
    display: block;
    width: 100%;
    font-size: 100%;
    background-color: #63b6d0;
    color: #fff;
    font-weight: 100;
    line-height: 3.0em;
    border-radius: 50px;
    position: relative;
    text-align: center;
    z-index: 333;
}
.cx_smartphoneview #data_present a{ margin-top: 0.3em;}
#data_present a:hover{ background-color: #3ac0ea;}
#data_present a.comingsoon{
    background-color: #aaa;
    color: #eee;
    opacity: 0.6;
}
#data_present a.comingsoon:hover{ background-color: #aaa;}
#data_present a::after{
    content: "";
    display: block;
    background: url("../img/cursor_s.svg") no-repeat 0 0;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 50%;
    right: 2%;
    margin: -12px 0 0;
}
#data_present a.comingsoon::after{
    opacity: 0.5;
}
.cx_smartphoneview #data_present a::after{
    width: 36px;
    height: 36px;
    margin: -18px 0 0;
}
#data_present p.intro{
    font-size: 94%;
    line-height: 1.9;
    font-feature-settings: "palt";
    padding-bottom: 0.5em;
}
#data_present p.intro span,
#data_present h2 + p span{
    font-weight: bold;
    color: #e4007f;
}
/* ---------------------------------------------
	Twitter
--------------------------------------------- */
#twWrap{ position: relative;}
#twWrap h2{ margin-bottom: 5px;}
#twWrap a#twLink{
    display: block;
    position: absolute;
    top: -6px;
    right: 0;
    background-color: #1da1f2;
    color: #fff;
    font-weight: bold;
    line-height: 1.8;
    padding: 3px 10px;
    border-radius: 5px;
}
#twWrap a#twLink:hover{ background-color: #0088db;}
@media all and (-ms-high-contrast:none) {
	#twWrap a#twLink{
		font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W4", "Hiragino Kaku Gothic Pro", "Lucida Grande", Verdana, "ＭＳ Ｐゴシック", sans-serif;
	}
}
#twWrap > div{
    /*box-shadow: 1px 1px 15px rgba(0,0,0,0.16);*/
    border: solid 1px #ccc;
}

/* -------------------------------------
	Twitter
------------------------------------- */
/*.cx_displaydevice #twitterWrap{
    border-bottom: solid 1px #aaa;
    padding-bottom: 1em;
    margin-bottom: 1em;
    width: 350px;
}
.cx_displaydevice #twitterWrap h2{
    font-weight: bold !important;
    color: #072174;
    font-size: 180%;
    line-height: 1.2;
    border-left: solid 0.2em #a28843;
    padding-left: 0.3em;
}*/
.h2Wrap{
    border-bottom: solid 1px #aaa !important;
    margin-bottom: 14px !important;
    display: -webkit-box !important;
    display: flex !important;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    justify-content: space-between;
    padding-bottom: 0.3em !important;
}
#twitterWrap h2{
    border: none;
    margin-bottom: 0;
    padding-bottom: 0;
}
#twitterWrap h2::before{
    content: "";
    display: inline-block;
    background: url("../img/twIcn.png") no-repeat 0 center;
    width: 1.2em;
    height: 1.2em;
    background-size: contain;
    vertical-align: bottom;
    margin-right: 0.2em;
}
#twitterWrap .h2Wrap a{
    background-color: #1082f4;
    color: #fff !important;
    padding: 0.2em 1.2em;
    border-radius: 3em;
}
#twitterWrap > a{
    display: block;
    background-color: #1082f4;
    width: 80%;
    margin: 0 auto;
    text-align: center;
    font-size: 94%;
}
.cx_smartphoneview #twitterWrap > a{ width: 100% !important;}
#twitterWrap > a{
    display: block;
    width: 100%;
    font-size: 100%;
    background-color: #1082f4;
    color: #fff;
    font-weight: 100;
    line-height: 3.0em;
    border-radius: 50px;
    position: relative;
    text-align: center;
}
#twitterWrap > a::after{
    content: "";
    display: block;
    background: url("../img/cursor_s.svg") no-repeat 0 0;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 50%;
    right: 2%;
    margin: -12px 0 0;
}

.cx_smartphoneview #twitterWrap > a::after{
    width: 36px;
    height: 36px;
    margin: -18px 0 0;
}

.cx_displaydevice #twitterWrap .h2Wrap a:hover,
.cx_displaydevice #twitterWrap > a:hover{ background-color: #3097ff;}

#twitterWrap > iframe{
    box-shadow: 1px 1px 10px rgba(0,0,0,0.16);
}

#twEmbed{
	/*height:600px;
	overflow-y:auto;
	background-color: #fff;*/
    /*padding: 2em;*/
    box-sizing: border-box;
    display: flex;
    flex-wrap:wrap;
}
/*.cx_smartphoneview #twEmbed{ padding: 1.2em;}*/

.twPartWrap,
#fp-bhp div.twPartWrap{
    flex-shrink: 0;
    /*width: 49%;
    margin: 0 2% 1em 0;*/
    width: 100% !important;
    margin: 0 0 1em 0 !important;
    background-color: #fff !important;
    box-sizing: border-box;
    padding: 1em !important;
    /*box-shadow: 1px 1px 15px rgba(0,0,0,0.16);*/
}
.twPartWrap:nth-of-type(2n){ margin: 0 0 1em 0;}

/*#twEmbed > div{
    margin: 0 0 20px;
    padding: 0 0 20px;
    border-bottom: 1px solid #ddd;
}*/
#twEmbed .twProfImg{
    width: 36px;
    height: 36px;
    margin: 0 6px 0 0;
    border-radius: 8px;
    overflow: hidden;
    float: left;
}
#twEmbed .twProfImg img{
    width: 100%;
    height: auto;
}
#twEmbed .twName{ line-height: 1.2;}
#twEmbed .twName a,
#fp-bhp #twEmbed .twName a{
    font-size: 88%;
    font-weight: bold;
    color: #333 !important;
    text-decoration: none;
}
#fp-bhp #twEmbed .twName a{ font-size: 12px;}
#twEmbed .twName a span{color: #707070; font-weight: normal;}
#twEmbed .twDate{
    font-size: 88%;
    color: #707070;
    line-height: 1.2;
}
#fp-bhp #twEmbed .twName a span,
#fp-bhp #twEmbed .twDate{ font-size: 12px !important;}
#twEmbed .twText{
    font-size: 94%;
    margin: 8px 0 0;
    white-space: pre-wrap;
    line-height: 1.6;
}
#fp-bhp  #twEmbed p.twText{
    font-size: 110% !important;
    color: #000 !important;
}
#twEmbed .twText a{ color: #06c;}
#twEmbed .twThumCntnr{ margin: 10px 0 0;position: relative;}
#twEmbed .twThumCntnr .video a::before{
    content: "";
    display: block;
    background: url(../img/playIcn.png) no-repeat -93px -40px;
    width: 68px;
    height: 68px;
    position: absolute;
    top:50%;
    top:-webkit-calc(50% - 32px);
    top:-moz-calc(50% - 32px);
    top:calc(50% - 32px);
    left:50%;
    left:-webkit-calc(50% - 32px);
    left:-moz-calc(50% - 32px);
    left:calc(50% - 32px);
}
#twEmbed .twThumCntnr .video a:hover::before{
    background-position: -93px -182px;
}
#twEmbed .twThum1-0{
    width: 100%;
    /*height: 400px;*/
    height: auto;
    overflow: hidden;
}
#twEmbed .twThum1-0 img{
    width: 100%;
    height: auto;
}
#twEmbed .twThum2-0,
#twEmbed .twThum2-1{
    width: 49.5%;
    height: 253px;
    overflow: hidden;
    float: left;
}
#twEmbed .twThum2-0{ margin: 0 1% 0 0;}
#twEmbed .twThum3-0{
    width: 66%;
    height: 338px;
    overflow: hidden;
    float: left;
    margin: 0 1% 0 0;
}
#twEmbed .twThum3-1,
#twEmbed .twThum3-2{
    width: 33%;
    height: 168px;
    overflow: hidden;
}
#twEmbed .twThum3-1{ margin: 0 0 2px;}
#twEmbed .twThum4-0{
    width: 75%;
    height: 380px;
    overflow: hidden;
    float: left;
    margin: 0 1% 0 0;
}
#twEmbed .twThum4-1,
#twEmbed .twThum4-2,
#twEmbed .twThum4-3{
    width: 24%;
    height: 126px;
    overflow: hidden;
}
#twEmbed .twThum4-1,
#twEmbed .twThum4-2{ margin: 0 0 1px;}
#twEmbed .twThum2-0 img,
#twEmbed .twThum2-1 img,
#twEmbed .twThum3-0 img,
#twEmbed .twThum3-1 img,
#twEmbed .twThum3-2 img,
#twEmbed .twThum4-0 img,
#twEmbed .twThum4-1 img,
#twEmbed .twThum4-2 img,
#twEmbed .twThum4-3 img{
    height: 100%;
    width: auto;
}
#twEmbed .twFunc{ margin: 10px 0 0;}
#twEmbed .twFunc li{
    float: left;
    margin: 0 10px 0 0;
}
#twEmbed .twFunc li a{
    background-color: #1082f4;
    color: #fff;
    font-size: 80%;
    padding: 10px 10px;
    border-radius: 5px;
    display: block;
}
#fp-bhp #twEmbed .twFunc li a{ font-size: 12px;}


/* -------------------------------------
	Instagram
------------------------------------- */
.instaWrap h2::before{
    content: "";
    display: inline-block;
    background: url("../img/instaIcn.png") no-repeat 0 center;
    width: 1.2em;
    height: 1.2em;
    background-size: contain;
    vertical-align: bottom;
    margin-right: 0.2em;
}
.instaWrap .embed{
    display: flex;
    flex-wrap: wrap;
    width: 620px;
    margin: 0 auto;
}
.cx_smartphoneview .instaWrap .embed{ width: 600px;}
.instaWrap .embed li{
    flex-shrink: 0;
    width: 200px;
    height: 200px;
    margin: 0 10px 10px 0;
    overflow: hidden;
    background-color: #efe4ca;
    /*display: flex;*/
}
.cx_smartphoneview .instaWrap .embed li{
    width: 194px;
    height: 194px;
    margin: 0 9px 9px 0;
}
.instaWrap .embed li:nth-of-type(3n){ margin-right: 0;}
/*.instaWrap .embed li img{ flex-shrink: 0; opacity: 0;}*/
.instaWrap .embed li.ll img{ width: 100%; height: auto;}
.instaWrap .embed li.ww img{ width: auto; height: 100%;}
.instaWrap .embed li a{
    width: 200px; height: 200px;
    display: block;
    text-align: center;
    background-size: contain;
}
.cx_smartphoneview .instaWrap .embed li a{
    width: 194px;
    height: 194px;
}

.instaWrap > a{
    display: block;
    width: 100%;
    font-size: 100%;
    background-color: #ac10db;
    color: #fff;
    font-weight: 100;
    line-height: 3.0em;
    border-radius: 50px;
    position: relative;
    text-align: center;
}
.instaWrap > a::after{
    content: "";
    display: block;
    background: url("../img/cursor_s.svg") no-repeat 0 0;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 50%;
    right: 2%;
    margin: -12px 0 0;
}
.cx_smartphoneview .instaWrap > a::after{
    width: 36px;
    height: 36px;
    margin: -18px 0 0;
}
.cx_displaydevice .instaWrap > a:hover{ background-color: #ce21ed;}

/* -------------------------------------
	解説陣
------------------------------------- */
#castWrap > ul{
    display: flex;
}
#castWrap > ul > li{
    flex-shrink: 0;
    width: 50%;
    box-sizing: border-box;
    text-align: center;
}
#castWrap > ul > li:nth-of-type(1){
    border-right: solid 1px #aaa;
    padding-right: 1%;
}
#castWrap > ul > li:nth-of-type(2){padding-left: 1%;}
#castWrap dt{
    background-color: #63b6d0;
    color: #fff;
    font-weight: bold;
    font-size: 110%;
    line-height: 1.4;
    padding: 0.2em 0;
}
#castWrap dd{
    font-size: 104%;
    font-weight: bold;
    line-height: 1.2;
    margin: 0.5em 0;
    padding-bottom: 0.5em;
    border-bottom: dashed 1px #aaa;
}
#castWrap dd span{
    font-size: 88%;
    font-weight: normal;
}
#castWrap dd:nth-last-of-type(1){ margin-bottom: 0;}

/* -------------------------------------
	
------------------------------------- */
#bull_link a{
    display: block;
    background: url("https://www.haruko-volley.com/img/bull_bnr_pc.jpg") no-repeat 0 0;
    width: 640px;
    height: 90px;
    margin: 10px auto 60px;
}

.cx_smartphoneview #bull_link a{
    background: url("https://www.haruko-volley.com/img/bull_bnr_sp.jpg") no-repeat 0 0;
    width: 94%;
    height: 0;
    padding-top: 21.44%;
    background-size: contain;
}


/*#fp-bhp #fp-bhp-infomain,*/
#fp-bhp #fp-bhp-twitter{ display: none !important;}
#gbfooter{ position: relative; z-index: 9999;}
@media screen and (max-width: 750px) and (orientation: portrait), (max-width: 1013px) and (orientation: landscape){
    /*.sp_display #gbheader #nav_upper #nav_upper__main{ position: relative !important;}*/
    /*.sp_display #gbheader #nav_upper .cx_header_content::after,*/
    .sp_display #gbheader #nav_upper .cx_header_content #nav_upper__sub,
    body.sp_display::after{ display: none !important;}
    .sp_display #gbfooter p{ font-size: 3vw !important; line-height: 1.4 !important;}
}
