@charset "utf-8";
#media .icon-link:before {
  color: #ed4e9e;
  vertical-align: middle;
  margin-right: 0.5em;
}

#media .program {
	margin: 50px 0 50px;
	padding: 50px;
	border: 1px solid #e0e0e0;
}

#media #cooperation {
	margin-top: 50px;
}

#media .center {
	text-align: center;
}

#media h3 {
	margin: 40px 0 10px; 
	background-color: #f5f5f5;
	padding: 10px;
	text-align: center;
}

#media h4 {
	margin: 40px 0 10px; 
	padding: 10px;
	text-align: center;
}

#media h4 span {
	display: inline-block;
	border-bottom: solid 3px #e2e2e2;
	padding: 0 20px 5px;
}

#media .item-wrapper {
	display: block;
	display: flex;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
}

#media .item p a {
	display: block;
	margin-top: 10px;
	padding:10px;
	background-color: #8f8f8e;
 	border: 1px solid #8f8f8e;
	border-radius: 10px;
	box-shadow:0px 4px 0px 0px #545453;
	color: #ffffff;
	font-size: 1.2em;
	text-decoration: none;
	text-align: center;
}

#media .item p.soldout {
	display: block;
	margin-top: 10px;
	padding:10px;
	background-color: #8f8f8e;
 	border: 1px solid #8f8f8e;
	border-radius: 10px;
	color: #ffffff;
	font-size: 1.2em;
	text-decoration: none;
	text-align: center;
}

#media .item p a:hover {
  -ms-transform: translateY(5px);
  -webkit-transform: translateY(5px);
  transform: translateY(5px);
  border-bottom: none;
  box-shadow: none;
  text-decoration: none;
}

#media .actors {
	margin-top: 20px;	
}

#media #cooperation h2 {
	margin-bottom: 20px;
}

#media .form a {
	display: block;
	margin-top: 10px;
	padding:10px;
	background-color: #ed4e9e;
 	border: 1px solid #ed4e9e;
	border-radius: 10px;
	box-shadow:0px 4px 0px 0px #a42c68;
	color: #ffffff;
	font-size: 1.2em;
	text-decoration: none;
	text-align: center;
}

#media .form a:hover {
  -ms-transform: translateY(5px);
  -webkit-transform: translateY(5px);
  transform: translateY(5px);
  border-bottom: none;
  box-shadow: none;
  text-decoration: none;
}

#media .nowrap {
	white-space: nowrap;
}

#media .br {
	word-wrap: break-word;
    overflow-wrap: break-word;
}

#media .youtube {
	width: 100%;
	margin-top: 40px;
	text-align: center;
}

@media screen and ( min-width:521px ){ /* tablet&PC */
#media .icon-link {
	text-align: right;
	font-size: 1.2em;
}

#media h2 {
	text-align: center;
}
	
#media h3 {
	font-size: 1.4em;
	font-weight: bold;
}
	
#media h4 {
	font-size: 1.3em;
	font-weight: bold;
}
	
#media .item-wrapper .item {
	-webkit-flex-basis: 33.3%;
	-ms-flex-basis: 33.3%;
	flex-basis: 33.3%;
	margin-bottom: 60px;
}
	
#media .item-wrapper .item p,
#media .item-wrapper .item h5 {
	padding: 10px;
}
	
#media .actors {
	text-align: center;		
	font-size: 1.4em;
}
	
#media #cooperation p {
	text-align: center;
	margin-bottom: 20px;
}
	
#media .form a {
	width: 30%;
	margin: 10px auto 0;
}

#media .item p a,
#media .item p.soldout {
	padding: 15px 10px 15px;
}
	
#media .form a {
	padding: 20px 10px 20px;
}
	
#media .youtube iframe {
	width: 560px;
	height: 315px;
}

#media .mt40_pc {
	margin-top: 40px;
}
	
#media .exp {
	width: 60%;
	margin: 0 auto 0;
	font-size: 1.2em;
}
	
}


@media screen and ( max-width:520px ){/* SP */
#media .program {
	margin: 30px 0 30px;
	padding: 20px 5px 20px;
}
	
#media #cooperation {
	margin-top: 30px;
}
	
#media h2 {
	background-color: #ffffff;
	padding: 0;
	font-size: 98%;
	font-weight: normal;
}

#media .center img {
	width: 70%;
}
		
#media h3 {
	margin: 20px 0 10px; 
}
	
#media h4 {
	margin: 20px 0 10px; 
}
	
#media .item-wrapper .item {
    -webkit-flex-basis: 50%;
    -ms-flex-basis: 50%;
    flex-basis: 50%;
    margin-bottom: 30px;
  }
	
#media .item-wrapper .item p,
#media .item-wrapper .item h5 {
	padding: 5px;
}
	
#media #cooperation h2 {
	font-size: 1.5em;
	font-weight: bold;
}
	
#media .br::before {
	content: "\A" ;
	white-space: pre ;
}
	
#media .youtube {
	margin-top: 20px;
}
	
#media .mt20_sp {
	margin-top: 20px;
}
	
}