/* ===========================================
	TBS external_service
=========================================== */

#sns-notice {
	font-size:80%;
	color:#0089d6;
	margin-bottom:10px;
}

/*	nav
=================================== */

/* 3 btns */

nav.di2menu {
	padding-bottom:15px;
}
nav.di2menu ul {
	display:table;
	width:100%;
}
nav.di2menu ul li {
	display:table-cell;
}
nav.di2menu ul.pglink li:last-child {
	padding-right:0;
}
nav.di2menu ul.pglink li a, nav.di2menu ul.pglink li span.nodata {
	display:block;
	color:#333;
	padding:6px;
	font-size:87.5%;
	font-weight:bold;
	text-decoration:none;
	line-height:1.25;
	border-radius:12px;
}
nav.di2menu ul.pglink li a {
	background-color:#ffec66;
	background-image:-moz-linear-gradient(transparent 50%, #ffe003 50%);
	background-image:-webkit-gradient(linear, left top, left bottom, from(transparent),color-stop(0.5,transparent),color-stop(0.5,#ffe003),to(#ffe003));
	background-image:-ms-linear-gradient(transparent 50%, #ffe003 50%);
	background-image:linear-gradient(transparent 50%, #ffe003 50%);
}
nav.di2menu ul.pglink li {
	padding-right:8px;
}
nav.di2menu ul.pglink li a:hover {
	background-color:#ffe003;
	background-image: none;
}
nav.di2menu ul.pglink li span.nodata {
	color:#999;
	background-color:#eaeaea;
	background-image:-moz-linear-gradient(transparent 50%, #e0e0e0 50%);
	background-image:-webkit-gradient(linear, left top, left bottom, from(transparent),color-stop(0.5,transparent),color-stop(0.5,#e0e0e0),to(#e0e0e0));
	background-image:-ms-linear-gradient(transparent 50%, #e0e0e0 50%);
	background-image:linear-gradient(transparent 50%, #e0e0e0 50%);
}
nav.di2menu ul.pglink li span.nodata span.mico {
	background-position:0 -350px;
}
nav.di2menu ul.pglink li a span.mico, nav.di2menu ul.pglink li span span.mico {
	display:block;
	background-image:url(../img/di2_parts.svg);
	background-repeat:no-repeat;
	background-position:0 -150px;
	padding-left:21px;
}
.genre-on .mico {
	background-position:0 -250px;
}

/* hidden archives */

nav.di2menu div.genrehidden {
	overflow:hidden;
	display:none;
}
nav.di2menu div.genrebox {
	background-image:url(../img/di2_parts.svg);
	background-repeat:no-repeat;
	background-position:1.0em top;
	padding-top:10px;
}
nav.di2menu div.genrebox ul {
	padding:0.5em 0 0.5em 1.5em;
	background-color:#eaeaea;
	width:auto;
}
nav.di2menu div.genrebox ul li {
	text-align:center;
	padding-right:1.5em;
	display:inline-block;

}
nav.di2menu div.genrebox ul li a {
	color:#004eb2;
	font-size:87.5%;
	line-height:1.5;
	text-decoration:none;
}
nav.di2menu div.genrebox ul li a:hover {
	text-decoration:underline;
}


/*	section
=================================== */

section.programs {
	padding-bottom:20px;
}

section.programs h2 {
	color:#333;
	font-size:100%;
	height:32px;
	line-height:32px;
	border-top: 3px dotted #bfdcf3;
	border-bottom: 3px dotted #bfdcf3;
	padding:0;
	margin-bottom:20px;
}
section.programs h2:before {
	content:"";
	dislpay:block;
	margin-top:4px;
	width:24px;
	height:24px;
	background-image:url(../img/di2_parts.svg);
	background-repeat:no-repeat;
	background-position:0 -100px;
	float:left;
	border-radius:4px;
	margin-right:8px;
}

/* vtip */

p#vtip {
	display:none;
	position:absolute;
	padding:6px;
	left:5px;
	font-size:80%;
	line-height:1;
	background-color:white;
	border:1px solid #7d8ea7;
	border-radius:5px;
	z-index:9999;
}
p#vtip #vtipArrow {
	position:absolute;
	top:-10px;
	left:5px;
}

/* sns-list */

.sns-list li {
	float:left;
	width:430px;
	border:#bfdcf3 2px solid;
	background-color:#fff;
	box-sizing:border-box;
	border-radius:10px;
	padding:10px;
	margin-bottom:10px;
}
.sns-list li:nth-child(odd) {
	margin-right:10px;
}
.sns-list li span.tmb {
	position:relative;
	float:left;
	margin-right:10px;
	display:block;
	width:73px;
	height:73px;
	background-color:#dfedf9;
    border:4px solid #dfedf9;
}
.sns-list li span.tmb span {
	position:absolute;
	display:block;
	width:73px;
	height:73px;
	background-size:cover;
}
.list-r {
	display:block;
	margin-left:91px;
}
.sns-list li cite {
	display:block;
	margin-bottom:5px;
	font-size:87.5%;
	line-height:1.25;
	font-weight:bold;
	font-style:normal;
}
.sns-list li cite a {
	color:#0089d6;
	text-decoration:none;
}
.sns-list li span.oa {
	display:block;
	font-size:75%;
	line-height:1.25;
}
.sns-list li span.btn-sns {
	display:block;
}
.sns-list li span.btn-fb,
.sns-list li span.btn-tw,
.sns-list li span.btn-yt,
.sns-list li span.btn-ln,
.sns-list li span.btn-ig,
.sns-list li span.btn-gp,
.sns-list li span.btn-twi,
.sns-list li span.btn-igi,
.sns-list li span.btn-tk {
	float:left;
	margin:10px 10px 0 0;
}
.sns-list li span.btn-fb a,
.sns-list li span.btn-tw a,
.sns-list li span.btn-yt a,
.sns-list li span.btn-ln a,
.sns-list li span.btn-ig a,
.sns-list li span.btn-gp a,
.sns-list li span.btn-twi a,
.sns-list li span.btn-igi a,
.sns-list li span.btn-tk a {
	display:block;
	width:40px;
	height:40px;
	background:url(/um/v7/img/gf_sns.png?20220810);
	background-size:cover;
	text-indent:-9999px;
	border-radius:5px;
	outline:none;
}
.sns-list li span.btn-fb a { background-position:0 0; }
.sns-list li span.btn-tw a { background-position:0 -40px; }
.sns-list li span.btn-yt a { background-position:0 -80px; }
.sns-list li span.btn-ln a { background-position:0 -120px; }
.sns-list li span.btn-ig a { background-position:0 -160px; }
.sns-list li span.btn-gp a { background-position:0 -200px; }
.sns-list li span.btn-twi a { background-position:0 -240px; }
.sns-list li span.btn-igi a { background-position:0 -280px; }
.sns-list li span.btn-tk a { background-position:0 -320px; }

#backnumber h2 {
	cursor:pointer;
	margin-bottom:10px;
}
#backnumber h2:hover {
	background-color:#f2f6fa;
}
#backnumber h2 span {
	float:right;
	display:block;
	margin:8px 8px 0 0;
	width:16px;
	height:16px;
	background-image:url(../img/di2_parts.svg);
	background-repeat:no-repeat;
	background-position:0 -150px;
	text-indent:-9999px;
}
#backnumber.bknm-on h2 span {
	background-position:0 -250px;
}
#backnumber .sns-list {
	border-radius:15px;
	background-color:#f2f6fa;
	overflow:hidden;
	height:0;
	box-sizing:border-box;
}
#backnumber .sns-list.bknm-open {
	height:auto;
	padding:10px 10px 1px 10px;
}
#backnumber .sns-list li {
	width:420px;
}


/* ----- poplink ----- */

#poplist li {
	position:fixed;
	display:none;
	z-index:100;
	width:70%;
	margin:0;
	padding:20px;
	background-color:rgba(45,115,180,0.75);
	border-radius:20px;
}
.modal-overlay {
	z-index:99;
	display:none;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:120%;
	background-color:rgba(0,0,0,0.5);
}
.pl-nm {
	color:#fff;
	font-weight:bold;
	font-size:90%;
}
.pl-nt {
	color:#fff;
	font-size:70%;
}
.pl-pc a, .pl-fb a, .pl-tw a, .pl-yt a, .pl-ln a, .pl-ig a, .pl-gp a, .pl-tk a {
	display:block;
	width:70%;
	font-size:87.5%;
	font-weight:bold;
	text-shadow:1px 1px #fff;
	text-align:center;
	color:#2d73b4;
	border-radius:5px;
	background:-moz-linear-gradient(center top, #fff 50%,#eceff2 50%);
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.5, #fff),color-stop(0.5, #eceff2));
	background:-webkit-linear-gradient(top, #fff 50%,#eceff2 50%);
	background:-ms-linear-gradient(top, #fff 50%,#eceff2 50%);
	background:linear-gradient(top, #fff 50%,#eceff2 50%);
	padding:1.0em;
	margin:0.7em auto;
	text-decoration:none;
}

@media all and (min-width: 768px) and (max-width: 979px)  {

/* sns-list */

.sns-list li,
#backnumber .sns-list li {
	width:49.5%;
}

.sns-list li:nth-child(odd) {
	margin-right:1%;
}

}


@media all and (max-width: 767px) {

/* 3 btns */

nav.di2menu ul.pglink li {
	padding-right:4px;
}
nav.di2menu div.genrebox ul {
	padding:0.5em;
}
nav.di2menu div.genrebox ul li {
	padding-right:0;
}
nav.di2menu div.genrebox ul li:after {
	content:"｜";
}
nav.di2menu div.genrebox ul li:last-child:after {
	content:"";
}

/* section */

section.programs {
	padding-bottom:15px;
}
section.programs h2 {
	margin-bottom:10px;
}

/* sns-list */

.sns-list li,
#backnumber .sns-list li {
	float:none;
	width:100%;
	margin-right:0;
}

}