﻿/* =================================
	Index CSS
================================= */

/*	.tbs-topics
============================== */

div.tbs-topics {
	text-align:left;
	border: solid 1px #797979;
}
div.tbs-topics h2 {
	color:#231816;
	font-family: alwyn-new-rounded-web, sans-serif;
	font-weight: 700;
	font-style: normal;
}
div.tbs-topics section p.tolist a span {
	color:#000;
}
@media all and (min-width: 768px) {
div.tbs-topics {
	border-radius:25px;
	padding:24px 5px 1px;
	width:980px;
	margin:0 auto 40px;
}
}
@media all and (max-width: 767px) {
div.tbs-topics {
	padding:12px 4% 1px;
	margin-bottom:20px;
	border-radius:15px;
}
}

﻿.slider-unit {
}
.slider-unit {
	position:relative;
}
.slider-unit h2 {
	color:#3b3f4a;
	line-height:1.5;
	-moz-font-feature-settings: "palt";
	-webkit-font-feature-settings: "palt";
	font-feature-settings: "palt";
	margin-bottom:0.5em;
}
.slider-unit p.tolist {
	position:absolute;
	top:0;
}
.slider-unit p.tolist a {
	color:#81899d;
	text-decoration:none;
}
.slider-unit p.tolist a:after {
	content:"";
	display:inline-block;
	width:16px;
	height:16px;
	position:absolute;
	right:0;
	top:50%;
	margin-top:-8px;
	background-image:url(/um/v8/img/slider_tolist.svg);
}
.slider-unit p.tolist a span {
	display:inline-block;
	position:absolute;
	right:20px;
	top:50%;
	margin-top:-0.5em;
	width:5.5em;
	text-align:center;
}
@media all and (min-width: 768px) {
.slider-unit h2 {
	font-size:165%;
	padding-left:40px;
}
.slider-unit p.tolist {
	right:40px;
	height:36px;
}
}
@media all and (max-width: 767px) {
.slider-unit h2 {
	font-size:140%;
	padding-left:0px;
}
.slider-unit p.tolist {
	font-size:87.5%;
	right:12px;
	height:27px;
}
}





/*	slider
============================== */
.slider-unit ul {
	list-style-type:none;
}
.slider-unit ul li > span,
.slider-unit ul li a {
	display:block;
}

.slider-unit div.outer {
	overflow:hidden;
}
.slider-unit div.outer ul {
	-webkit-transform: translateZ(0);
	overflow:hidden;
	list-style-type:none;
	/* font-family:sans-serif; */

/*	display: -webkit-box;
	display: -ms-flexbox;
	display: flex; */

}
.slider-unit div.outer ul li {
	float:left;
}
.slider-unit div.outer ul li a {
	/* 要検証 */
	height:100%;
	text-decoration:none;
	color:#2a2b2e;
	background-color:#fff;
	line-height:1.5;
}
.slider-unit div.outer ul li a span,
.slider-unit div.outer ul li a span img {
	display:block;
}
.slider-unit div.outer ul li a > span.thumb {
	position:relative;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
	/* background-color:#c0c4ce; */
}
.slider-unit div.outer ul li a > span.lazy-done {
	-webkit-animation: fadeIn 700ms;
	animation: fadeIn 700ms;
}
.slider-unit div.outer li a span.dte,
.slider-unit div.outer li a span.hdr, .slider-unit div.outer li a span.ftr {
	color:#81899d;
}
.slider-unit div.outer li a span.ots {
	color:#3b3f4a;
}
.slider-unit div.outer li a span.hdr, .slider-unit div.outer li a span.ftr {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-height:1.75em;
}
.slider-unit div.outer li a span.ttl {
	overflow: hidden;
	margin-bottom:0.2em;
}
.slider-unit div.outer li a span.dte {
	margin-bottom:0.2em;
}
.slider-unit div.outer li a span.ttl b {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
}
@media all and (min-width: 768px) {
.slider-unit {
	margin-bottom:45px;
/*	margin-bottom:15px; */
}
.slider-unit div.outer {
	margin:0 40px;
}
.slider-unit div.outer ul.inner li:not(:last-child) {
	/* IE 対策のため px で指定する */
	margin-right:9px;
}
.slider-unit div.outer ul.inner li,
.slider-unit div.outer ul.inner li a > span img {
	width:280px;
}
.slider-unit div.outer ul.inner li a:hover {
	color:#000;
}
.slider-unit div.outer ul.inner li a > span img {
	height:158px;
}
.slider-unit div.outer ul li a > span.txtarea {
	padding:14px 20px;
}
.slider-unit div.outer li a span.ttl {
	height:3em;
}
.slider-unit div.outer li a span b {
	-webkit-line-clamp: 2;
}
.slider-unit div.outer li a span.dte,
.slider-unit div.outer li a span.hdr, .slider-unit div.outer li a span.ftr {
	font-size:87.5%;
}
.slider-unit div.outer li a span.ots {
	font-size:75%;
}
}
@media all and (max-width: 767px) {
.slider-unit {
	margin-bottom:25px;
/*	margin-bottom:10px; */
}
.slider-unit div.outer ul.inner li:not(:last-child) {
	/* IE 対策のため px で指定する */
	margin-right:4px;
}
.slider-unit div.outer ul.inner li,
.slider-unit div.outer ul.inner li a > span img {
	width:177px;
}
.slider-unit div.outer ul.inner li a span img {
	height:100px;
}
.slider-unit div.outer ul li a > span.txtarea {
	padding:8px 12px;
}
.slider-unit div.outer li a span.ttl {
	height:4.5em;
}
.slider-unit div.outer li a span b {
	font-size:87.5%;
	-webkit-line-clamp: 3;
}
.slider-unit div.outer li a span.dte,
.slider-unit div.outer li a span.hdr, .slider-unit div.outer li a span.ftr {
	font-size:75%;
}
.slider-unit div.outer li a span.ots {
	font-size:62.5%;
}
}

.slider-event div.outer li a span.ttl {
	overflow: visible;
	height: auto;
	margin-bottom:auto;
}
.slider-event div.outer li a span.ttl b {
	display: inline;
	overflow: visible;
	-webkit-box-orient: none;
	-webkit-line-clamp: none;
}

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

@media print {
	.slider-unit div.outer ul.inner li a > span.thumb img {
		background-color:#fff !important;
	}
}


/* ctrl */
@media all and (min-width: 768px) {
.slider-unit ul.ctrl li {
	position:absolute;
	top:50%;
	margin-top:-20px;
}
.slider-unit ul.ctrl li.ctrl-lef {
	left:0;
}
.slider-unit ul.ctrl li.ctrl-rig {
	right:0;
}
.slider-unit ul.ctrl li a {
	width:40px;
	height:40px;
	background-image:url(/um/v8/img/slider_arrow.svg);
	background-repeat:no-repeat;
	background-size:80px 40px;
	text-indent:110%;white-space:nowrap;overflow:hidden;
	/* background-color:#f0d6a8; */
}
.slider-unit ul.ctrl li.ctrl-lef a {
	background-position:0 0;
}
.slider-unit ul.ctrl li.ctrl-rig a {
	background-position:-40px 0;
}
.slider-unit ul.ctrl li a.hidebtn {
	opacity:0.25;
	cursor:default;
}
.slider-unit ul.ctrl li.ctrl-lef a:not(.hidebtn):hover {
	background-position:0 0;
}
.slider-unit ul.ctrl li.ctrl-rig a:not(.hidebtn):hover {
	background-position:-40px 0;
}
}
@media all and (max-width: 767px) {
.slider-unit ul.ctrl {
	display:none;
}
}


/*///////////////// h1 video ////////////////*/
#titleArea{position:relative;overflow: hidden;}
h1  {
margin: 0 auto;
width: 100%;
left: 0;
right: 0;
top: 0;
bottom: 0;
}
#video {
overflow: hidden;
width: 100%;
}
video {
min-width: 100%;
position: absolute;
}


@media all and (min-width: 768px) {
#titleArea {margin: 100px 0;}
#video {
height:294px;
}
video {
max-height:294px;
min-height:294px;
}
}

@media all and (max-width: 767px) {
#titleArea {margin: 5vh 0;}
#video {
height: 12vh;
}
video {
max-height: 12vh;
min-height: 12vh;
}
}

/*@media all and (max-width: 290px) {
#video {
height: 15vh;
}
video {
max-height: 15vh;
min-height: 15vh;
}*/
}
/*画面サイズが変わっても常に動画の中央が表示されるようにする*/
/*動画よりも画面が横に長くなるとき用*/
@media (aspect-ratio: 16/9), (min-aspect-ratio: 16/9) {
video {
width: 100%;
top: 0;
transform: translateY(0);
}
}
/*動画よりも画面が縦に長くなるとき用*/
@media (max-aspect-ratio: 16/9) {
video {
height: 100%;
left: 50%;
transform: translateX(-50%);
}
}

/*	#mainLogo
============================== */
h1 #mainLogo {
	text-align:left; position: relative;
}
h1 #mainLogo span{
	display:block;
}
h1 #mainLogo > span {
	background-repeat:no-repeat;
	background-position:center center;
	background-size:contain;
	padding-top:30%;
}
h1 #mainLogo span.lazy-done {
	-webkit-animation: fadeIn 1200ms;
	animation: fadeIn 1200ms;
}
h1 #mainLogo span span {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	text-indent:-9999px;white-space:nowrap;overflow:hidden;
}



@media all and (min-width: 768px) {
h1 #mainLogo {
	width:95%;
	margin:0 auto 2em;
}
	h1 #mainLogo { margin-bottom: 1em;}
}
@media all and (max-width: 767px) {
h1 #mainLogo {
	width:95%;
	margin:0 auto 1em;
}
	h1 #mainLogo { margin-bottom: 0.5em;}
}



/*	.unit
============================== */
.unit > article {
	border: solid 1px #797979;
}
main div.unit article header {
	text-align:center;
	background-color:#fff;
}
main div.unit article header h2 {
	background-image: -webkit-gradient(linear, left top, right top, from(hsla(13,67%,74%,1)), color-stop(0.45, hsla(47,63%,78%,1)), color-stop(0.55, hsla(47,63%,78%,1)), to(hsla(127,35%,81%,1)));
	background-image: -webkit-linear-gradient(left, hsla(13,67%,74%,1), hsla(47,63%,78%,1) 45%, hsla(47,63%,78%,1) 55%, hsla(127,35%,81%,1));
	background-image: linear-gradient(to right, hsla(13,67%,74%,1), hsla(47,63%,78%,1) 45%, hsla(47,63%,78%,1) 55%, hsla(127,35%,81%,1));
}
main div.unit article header h2:after {
	margin-top:0.25em;
}
main div.video article header h2:after {
	content:"VIDEOS";
}
main div.onair article header h2:after {
	content:"ON AIR";
}
main div.bnrs article header h2:after {
	content:"PROGRAMS";
}
main div.unit article header h2 span,
main div.unit article header h2:after {
	display:block;
	text-align:center;
	line-height:1.5;
	color:#000;
	text-shadow:0 2px 2px hsla(0, 0%, 100%, .5);
}
main div.unit article header h2 span:after {
	display:block;
	content:"";
	background-color:#000;
	margin:0 auto;
}

main article h2 {
	color:#231816;
	line-height:1.5;
	margin-bottom:0.75em;
}

main > .unit > article section h3 {
	line-height:1.5;
	margin-bottom:0.25em;
}
main > .unit > article section p.date {
	color:#333;
	font-weight:bold;
	margin-bottom:0.75em;
}
main > .unit > article section p.txt {
	text-align: justify;
	text-justify: inter-ideograph; /* IE のみ、こちらも必要 */
	line-height:1.75;
}
main > .unit > article > section p.txt:not(:last-child) {
	margin-bottom:1.5em;
}


.intro section h3 { text-align: center; padding-bottom: 0.5em; }
.intro section h3 span {background: linear-gradient(transparent 50%, rgba(50,174,182,0.4) 50%); padding: 5px 10px; display: inline-block; text-align: center;}

.notes {padding-left:1em; text-indent:-1em; text-align: left; }

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

.unit:not(:last-child) {
	margin-bottom:30px;
}
.unit > article {
	border-radius:25px;
	padding:35px 50px 50px;
	border: solid 1px #797979;
}
main div.unit article header {
	padding:3px;
	-webkit-box-shadow:0 8px 0 0 hsla(0,0%,0%,0.1);
	box-shadow:0 8px 0 0 hsla(0,0%,0%,0.1);
	margin-bottom:30px;
}
main div.unit article header h2 {
	border:2px solid #fff;
	padding:8px;
}
main div.unit article header h2 span {
	font-size:175%;
}
main div.unit article header h2 span:after {
	width:284px;
	height:2px;
}

main article h2 {
	font-size:150%;
}
main > .unit > article section h3 {
	font-size:125%;
}
main > .unit > article p.date {
	font-size:112.5%;
}
main > .unit > article section p.txt {
	font-size:100%;
}
main > .unit > article > section:not(:last-child) {
	margin-bottom:40px;
}
	
	section .box:not(:last-child) { padding-bottom: 1.5em; margin-bottom: 1.5em; /*border-bottom: dotted 1px #ccc;*/
	background-size: 8px 1px;
  background-image: linear-gradient(to right, #ccc 4px, transparent 4px);
  background-repeat: repeat-x;
  background-position: left bottom;
  }
	section .set:not(:last-child) { padding-bottom: 2em;}
	.intro section h3 { font-size: 140%!important;}
}
@media all and (max-width: 767px) {
main > .unit {
}
.unit:not(:last-child) {
	margin-bottom:20px;
}
.unit > article {
	border-radius:15px;
	padding:15px;
	border: solid 1px #797979;
}
main div.unit article header {
	padding:2px;
	-webkit-box-shadow:0 4px 0 0 hsla(0,0%,0%,0.1);
	box-shadow:0 4px 0 0 hsla(0,0%,0%,0.1);
	margin-bottom:15px;
}
main div.unit article header h2 {
	border:1px solid #fff;
	padding:4px;
}
main div.unit article header h2 span:after {
	width:180px;
	height:1px;
}
main div.unit article header h1:after, main div.unit article header h2:after {
	font-size:87.5%;
}
	
main section h2 {
	font-size:112.5%;
}
main > .unit > article section h3 {
	font-size:100%;
}
main > .unit > article section p.txt {
	font-size:87.5%;
}
main > .unit > article > section:not(:last-child) {
	margin-bottom:20px;
}
	
	section .box:not(:last-child) { padding-bottom: 1em;}
	section .set:not(:last-child) { padding-bottom: 1em;}
}
@media all and (min-width: 500px) and (max-width: 767px) {
main div.unit article header h2 span {
	font-size:150%;
}
}
@media all and (max-width: 499px) {
main div.unit article header h2 span {
	font-size:125%;
}
}




div.movie {
	text-align:left;
}
div article p.copy {
	font-weight:bold;
	text-align:center;
	line-height:1.5;
	margin-bottom:1.25em;
	font-family: m-plus-rounded-1m, sans-serif;
	font-weight: 700;
	font-style: normal;
}
div article p.copy > span {
	background: linear-gradient(transparent 50%, #ffbcbe 50%); padding: 5px 10px; display: inline-block; text-align: center;
}
div article p.copy > span:first-child {
	padding-left:0.5em;
}
div article p.copy > span:last-child {
	padding-right:0.5em;
}

div article p:not(.copy) {
	text-align:left;
	line-height:1.8;
}
div article p:not(.copy):not(:last-child) {
	margin-bottom:1.0em;
}

@media all and (min-width: 768px) {
div.movie {
	width:980px;
	margin:0 auto 40px;
}
div article p.copy {
	font-size:150%;
}
}
@media all and (max-width: 767px) {
div.movie {
	margin:0 0 20px;
}
div article p.copy {
	font-size:112.5%;
}
div article p:not(.copy){
	font-size:87.5%;
}
}


/*	#outline #logo
============================== */
#outline #logo {
	text-align:left; position: relative;
}
#outline #logo span{
	display:block;
}
#outline #logo > span {
	background-repeat:no-repeat;
	background-position:center center;
	background-size:contain;
	padding-top:56.112%;
}
#outline #logo span.lazy-done {
	-webkit-animation: fadeIn 1200ms;
	animation: fadeIn 1200ms;
}
#outline #logo span span {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	text-indent:-9999px;white-space:nowrap;overflow:hidden;
}



@media all and (min-width: 768px) {
#outline #logo {
	width:95%;
	margin:0 auto 1em;
}
}
@media all and (max-width: 767px) {
#outline #logo {
	width:95%;
	margin:0 auto 0.5em;
}
}




/*	project
============================== */

.project h4, .project p, .comment h4, .set h4, .set h5, table.staff {
	font-weight:bold;
	text-align:center;
	line-height:1.5;
	margin-bottom:1.0em;
	font-family: m-plus-rounded-1m, sans-serif;
	font-weight: 700;
	font-style: normal;
}
.linkBox h4 {margin-bottom:0em;}
.project h4 span, .comment h4 span, .set h4 span {
	background: linear-gradient(transparent 50%, rgba(231,247,115,1) 50%); padding: 2px 5px; display: inline-block; text-align: center;
}
.project p { font-weight: bold; text-align: center!important;}

.project .box {
	width:100%;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap:8px;
	padding:0px;
	margin-bottom: 1.25em;
}
.project ul.box li {position: relative;}
.project ul.box li span.img { width: 100%; height: 0; padding-top: 56.666%;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
border: solid 1px #eee;}
.project ul.box li span.img img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-indent: 110%;
    white-space: nowrap;
    overflow: hidden;
}

table.staff {
 border-collapse:collapse;
 border-spacing:0;
 margin: 0.5em auto 2em;
 letter-spacing: 0.05em;
	line-height: 1.5em;	
}
table.staff th ,
table.staff td {
    vertical-align: baseline;
	text-align: left;
}
table.staff th {white-space: nowrap;}
table.staff td span { display: inline-block;}

dl.narrator dt, dl.narrator dd {
	color:#333;
	font-weight:bold;
	line-height:1.75;
}
dl.narrator dt {
	float:left;
}
dl.narrator {
	margin-bottom:0.5em;
}
dl.narrator dd {
	padding-left:4.5em;
}

@media all and (min-width: 768px) {
.intro .project { padding-bottom: 2em;}
.project h4, .comment h4, .set h4 {
	font-size:110%;
}
	.project p {font-size:150%!important;}
	.project ul.box li {width:calc((100% - 8*4px)/5);}
	
	table.staff{ font-size: 1.1em;}
	table.staff th ,
	table.staff td {
		padding-bottom: 0.3em;
}
	table.staff th {text-align: right; padding-right: 0.5em;}
	#outline table.staff td { width: 30em;}
}

@media all and (max-width: 767px) {
.intro .project { padding-bottom: 1em;}
.project h4, .comment h4, .set h4 {
	font-size:90%;
}
	.project p {font-size:120%!important;}
	.project ul.box li {width:calc((100% - 8*2px)/3);}
	
	table.staff{ font-size: 1em;}
	table.staff th ,
	table.staff td {
 display: block; text-align: center;
}
	table.staff td {
		padding-bottom: 1em;
}
	table.staff.cast th ,
	table.staff.cast td { display: inline-block;
width:50%; padding-bottom: 0.3em; vertical-align: top;
}
	table.staff.cast th { text-align: right;}
	table.staff.cast td { text-align: left;}
	.intro table.staff { margin-bottom: 0;}

dl.narrator {
	font-size:0.9em;
}
}


/*	.programs
============================== */
.programs section h3 { text-align: left; border-left: solid 5px #42bdd2; padding: 0.2em 0 0.2em 0.5em; margin-bottom: 0.5em;} 
section h3 span {background: linear-gradient(transparent 50%, #ffbcbe 50%); padding: 5px 10px; display: inline-block; text-align: center;}
.programs section h3 span {background: none;  padding: 5px 0; display: inline-block; text-align: center;}

.programs .progTit { text-align: center;
    font-family: m-plus-rounded-1m, sans-serif;
    font-weight: 700;
    font-style: normal;
	padding-bottom: 1em;
}

.programs .read { text-align: center;
    font-family: m-plus-rounded-1m, sans-serif;
    font-weight: 400;
    font-style: normal;
}
section dl { line-height: 1.75;}
section dl dd { padding: 0 0 0 1em;}

.programs .progCont { padding-bottom: 2em;}

main > .programs article h2 {
	line-height:1.5;
	margin-bottom:0.75em;
}
main > .programs article h2 {
	margin-bottom:0.5em;
}
p.date { margin-bottom: 0.2em;}
main > .programs article p.date, main > .programs article dl.narrator dt, main > .programs article dl.narrator dd {
	color:#333;
	font-weight:bold;
}
main > .programs article p,
main > .programs article dl.narrator dt,
main > .programs article dl.narrator dd {
	line-height:1.75;
}

.programs section .tit{text-align: center;
font-family: m-plus-rounded-1m, sans-serif;
    font-weight: 700;
    font-style: normal;
    line-height: 1.5;
    margin-bottom: 1em;}
.programs section .tit span {
    background: linear-gradient(transparent 50%, rgba(50, 174, 182, 0.4) 50%);
    padding: 5px 10px;
    display: inline-block;
    text-align: center;
}
.movieArea{display: flex;
	flex-wrap: wrap;
	justify-content: center;}
.movieArea .mov-outer { /*width:calc((100% - 20px)/2);*/ width: 100%; margin-bottom:20px;}
/*.movieArea .mov-outer:nth-child(odd){margin-right:20px;}*/
.movieArea li { width:calc((100% - 20px)/2); margin-bottom:20px;}
.movieArea li:nth-child(odd){margin-right:20px;}
.movieArea li span.thum {
    width: 100%;
    height: 0;
    padding-top: 66.666%;
    display: inline-block;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    vertical-align: top;
    margin: 0 0 0 0;
    position: relative;
}
.movieArea li a {position: relative; display: block;}
.movieArea li a .btn {background-repeat: no-repeat;
  background-position: center center;
background-image:url(../img/btn_mov.png);
	background-size: contain;
	width: 60px;
  height: 42px;
	position: absolute;
	top:50%; left:50%; margin: -21px 0 0 -30px;
	opacity: 0.75;
}
.movieArea li span a:hover .btn {opacity: 1.0;}
body.tbs-myt-overlay-on div.tbs-myt-modal div.tbs-myt-overlay {
    background-color: #fff !important;
}
    

@media all and (min-width: 768px) {
main > .unit:not(:last-child) {
	margin-bottom:30px;
}
main > .unit > section, main > .unit > article {
	border-radius:25px;
	padding:35px 50px 50px;
	border: solid 1px #797979;
}

main > .unit.programs > article > section:not(:last-child) {
	margin-bottom:60px;
}
	
main > .programs article h2 {
	font-size:150%;
}
main > .programs article h3 span {
	font-size:150%;
}
main > .programs article p.date {
	font-size:1.1em;
}
	
	.programs .progTit {line-height: 2.2em;}
	.programs .progTit .sizeS {font-size: 1.5em; line-height: 2.5em;}
	.programs .progTit .sizeM {font-size: 1.7em;}
	.programs .progTit .sizeML {font-size: 2.2em;}
	.programs .progTit .sizeL {font-size: 2.4em;}
	
	
	.programs .read {font-size: 1.4em; padding: 1em 0 0.5em;}
	main > .programs article dl { display: inline-block; margin: 0 auto;}
	.programs .set h5 {font-size: 1.2em;}
	.programs section .tit span {
        font-size: 140%;
    }
}
@media all and (max-width: 767px) {
main > .unit:not(:last-child) {
	margin-bottom:20px;
}
main > .unit > section, main > .unit > article {
	border-radius:15px;
	padding:15px;
	border: solid 1px #797979;
}
main > .programs > section > p:not(:last-child) {
	margin-bottom:1.5em;
}
main > .unit.programs > article > section:not(:last-child) {
	margin-bottom:20px;
}
	
section p.comingsoon, article p.comingsoon {margin: 1em 0; font-size: 1.2em!important;}
	section h3 span { font-size: 112.5%;}
	section .box:not(:last-child) { padding-bottom: 1em;}
	section .set:not(:last-child) { padding-bottom: 1em;}
	
	main > .programs article h2 {
	font-size:112.5%;
}
	main > .programs article h3 span {
	font-size:112.5%;
}
	.programs .progTit {line-height: 1.8em;}
	.programs .progTit .sizeS {font-size: 1.0em; line-height: 2.0em;}
	.programs .progTit .sizeM {font-size: 1.3em;}
	.programs .progTit .sizeML {font-size: 1.6em;}
	.programs .progTit .sizeL {font-size: 1.8em;}
	
	.programs .read {font-size: 1.0em;}
main > .programs article p.date{
	font-size:0.9em;
}
	.programs .set h5 {font-size: 1.0em;}
	.programs section .tit span {
        font-size: 112.5%;
    }
	.movieArea li { width:calc((100% - 10px)/2); margin-bottom:10px;}
.movieArea li:nth-child(odd){margin-right:10px;}
	.movieArea li a .btn {
		width: 40px;
		height: 28px;
		margin: -14px 0 0 -20px;
	}
}


/*	div.release
============================== */

div.release > article header h2 {
	text-align:center;
	line-height:1.5;
	margin-bottom:0.75em;
}
@media all and (min-width: 768px) {
div.release > article header h2 {
	font-size:125%;
}
}
@media all and (max-width: 767px) {
div.release > article header h2 {
	font-size:100%;
}
}

/*	div.bkLink
============================== */
#bkLinkArea{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;}
div.bkLink { text-align: center; padding-bottom: 1em;}
div.link { text-align: center; padding-bottom: 0em;}
.linkBox div.link{ padding-bottom: 1.5em;}
div.bkLink p, div.link p {
font-family: m-plus-rounded-1m, sans-serif;
	font-weight: 700;
	font-style: normal;
font-size: 1.2em;
display: inline-block;
transition:0.5s;}
div.bkLink p a { text-decoration: none; border-bottom: solid 3px rgba(34,24,22,1.00); padding:20px 20px 20px 30px; display: block;
background-image:url(../img/arrow.png);
	background-size: 15px 55px;
	background-repeat:no-repeat;
	background-position:left center;
 transition:0.5s;}
div.link p a { text-decoration: none; border-bottom: solid 3px rgba(34,24,22,1.00); padding:15px 20px 15px 35px; display: block;
background-image:url(../img/arrow.png);
	background-size: 15px 55px;
	background-repeat:no-repeat;
	background-position:5px center;
	transition:0.5s;}
div.bkLink p:hover, div.link p:hover{background-color: rgba(50,174,182,0.5);
	border-radius: 18px;
    -webkit-border-radius: 18px;
    -moz-border-radius: 18px;}
div.bkLink p a:hover, div.link p a:hover{border-bottom: solid 3px rgba(34,24,22,0);}
div.link .add, .project .add { display: block; margin-top: -0.5em; text-align: center;}
@media all and (min-width: 768px) {
	#bkLinkArea {width: 600px; margin: 0 auto;}
div.bkLink { width: 300px;}
	div.link p a { width: 180px; text-align: center; margin: 0 15px;}
	div.link .add, .project .add {font-size: 0.9em;}
}
@media all and (max-width: 767px) {
	div.bkLink { margin: 0 0.5em;}
	.linkBox { padding-bottom: 2em!important;}
	div.bkLink p, div.link p { font-size: 87.5%;}
	div.link p { margin-bottom: 0.5em;}
	div.bkLink p a { border-bottom: solid 2px rgba(34,24,22,1.00); padding:15px 15px 15px 15px;background-size: 10px 37px;}
	div.link p a { border-bottom: solid 2px rgba(34,24,22,1.00); padding:10px 15px 10px 25px;background-size: 10px 37px;}
	div.bkLink p:hover, div.link p:hover{
	border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;}
	div.link p a { width: 100px; text-align: center; margin: 0 15px;}
	div.link .add, .project .add {font-size: 0.8em;}
}

/*	.sns-icons
============================== */
div.sns-icons {
	position: relative;
	display:flex;
	justify-content:center;
	align-items:center;
}
div.sns-icons p.tw span, div.sns-icons p.tw a {
	display:block;
}
div.sns-icons p.tw a {
	position:relative;
	height:0;
	padding-top:100%;
	overflow:hidden;
	border-radius:50% 50%;
}
div.sns-icons p.tw a span {
	background-size:300% 300%;
	background-color:#000;
	background-position:left top;
	background-image:url(/um/img/sns_logos.svg?0);
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
div.sns-icons p a { text-decoration: none;}

@media all and (min-width: 768px) {
div.sns-icons {
	padding:0;
}
div.sns-icons p.tw {
	width:80px; margin-right: 0.6em;
}
}
@media all and (max-width: 767px) {
div.sns-icons {
	padding:0;
}
div.sns-icons p.tw {
	width:50px; margin-right: 0.4em;
}
}

/*	tbs-realtime
============================== */
#tbs-realtime { width: 100%; margin: 20px auto 1em auto; background: rgba(255, 255, 255, 1);}
#tbs-realtime a { width: 100%; height: 0; padding-top: 12.89134438305709%; padding-top: calc(140 / 1086 * 100%); background-repeat: no-repeat; -webkit-background-size: contain; background-size: contain; position: relative; display: block;}
#tbs-realtime a:hover { opacity: .75;}
#tbs-realtime a img { width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
@media all and (min-width: 768px) {
#tbs-realtime { width: 80%;}
}
