/*	やってみようよ、番組編
============================== */

/*	h2
============================== */
.titleArea h2{
	width: 256px; height: 170px;
	background-position: center center;
    background-repeat: no-repeat;
	background-size: contain;
	background-image: url(../img/try_prog/h2.png?2405);
	text-indent: -9999px;
	margin: 0 auto;
}
@media all and (min-width: 768px) {
	.titleArea h2{ width: 275px; height: 200px;}
}

@media all and (max-width: 767px) {
	.titleArea h2{ width:150px; height: 110px;}
}

/*	contents
============================== */

ul.listArea { letter-spacing: -.4em;}
ul.listArea li { display: inline-block; vertical-align: top; letter-spacing: 0em; line-height: 1.5; }

ul.listArea h3 { padding: 10px 0 3px; color: #ec6a06; text-align: center;}

ul.listArea li figure span {
	display: block;
	position: relative;
	background-size: 100%;
	background-position: center center;
	height: 0;
    padding: 56.26% 0 0;
}
ul.listArea li figure span img {
	display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }
ul.listArea li figure {
    width: 100%;
    margin: 0;
    box-sizing: border-box;
  }

.listArea a:hover figure { opacity:0.8;}

ul.listArea li h4 { background-color: #e4031e; color:#fff; text-align: center; font-size: 1.1em; padding: 0.2em 0;}

.btn { margin-bottom: 40px;}
.btn a {
  display: block;
  border-radius: 8px;
  background-repeat: no-repeat;
  background-position: center center;
background-color: #fd6925;
	background-image: url(../img/try_prog/btn_all.png?2405);
  text-indent: -9999px;
	margin: 0 auto;
}
.btn a:hover { opacity:0.8;}

@media all and (min-width: 768px) {
	.wrap {width:1004px;}
	ul.listArea { padding: 0; }
	ul.listArea li {width:310px; padding-bottom: 40px;}
	ul.listArea li:nth-child(3n-1) {margin: 0 24px; }
	ul.listArea h3 {font-size: 1.1em;}
	
	.btn a {
		background-size: 290px 45px;
		width: 320px; height: 75px;
	}
}

@media all and (max-width: 767px) {
	.wrap {width:98%; margin: 0 auto;}
	ul.listArea li {width:46%; margin: 0 2%; padding-bottom: 25px;}
	.listArea h3 { padding: 8px 0 3px; font-size: 1.0em;}
	ul.listArea .date {font-size: 0.8em; line-height: 1.5em;}
	ul.listArea .txt {font-size: 0.8em; line-height: 1.5em;}
	ul.listArea h3 {font-size: 0.9em;}
	.btn a {
		background-size: 220px 34px;
		width: 240px!important; height: 60px!important;
	}
}


