@charset "utf-8";
/* このファイルはUTF-8のBOMなし(UTF-8N)で保存しています */

/**
 * CSS Information
 * ===============================================================
 *
 * Site URL:  http://
 * File name: module.css
 * Summary:   モジュール用スタイル
 * Author:    CrEa., Inc.
 *
 * -----------------------------------
 *
 * TOC:
 *     =1    modules
 *
 * ===============================================================
*/



/** =1
 * ========================================
 * modules
 * ========================================
 */


h1 {
	padding: 10px;
}

h2 {
	margin-bottom: 1em;
}

h3 {
	margin-bottom: 0.5em;
}


.l-informationNav p.pickup {
	text-align: center;
	margin-bottom: 20px;
}
.l-informationNav p.pickup img {
	max-width: 700px;
	width: 100%;
}
.l-informationNav dt {

}
.l-informationNav dd {
	color: #B6090D;
	font-weight: bold;
	font-size: 20px;
	text-align: center;
	line-height: 1.25em;
}
.l-informationNav dd span.year {
	font-weight: bold;
}

.l-informationNav dd.description {
	-webkit-text-shadow: 2px 2px 1px #FFFFFF,
	    -2px 2px 1px #FFFFFF,
	    2px -2px 1px #FFFFFF,
	    -2px -2px 1px #FFFFFF;
	-moz-text-shadow: 2px 2px 1px #FFFFFF,
	    -2px 2px 1px #FFFFFF,
	    2px -2px 1px #FFFFFF,
	    -2px -2px 1px #FFFFFF;
	text-shadow: 2px 2px 1px #FFFFFF,
	    -2px 2px 1px #FFFFFF,
	    2px -2px 1px #FFFFFF,
	    -2px -2px 1px #FFFFFF;
}

.l-informationNav dd.link li {
	display: block;
	width: 250px;
}
.l-informationNav .younglion dd.link li {
	margin: 0 auto;
}
.l-informationNav dd.link li a {
	display: block;
	padding: 3px;
	border: 2px solid #4e9fb3;
	background: #FFFFFF;
	color: #028bac;
	font-weight: bold;
	text-decoration: none;
}

	/* -- >>> styles for narrow layout ----- */
	@media screen and (max-width: 735px) {
		.l-informationNav dt {
			margin-bottom: 0.125em;
		}
		.l-informationNav dd {
			font-size: 110%;
		}
		.l-informationNav dd span.year {
			display: block;
		}
		.l-informationNav dd.link li {
			width: 80%;
			margin: 0 auto;
		}
	}



/***========= OTODAMA'15 =========***/
#otodama {
	padding-bottom: 3em;
	margin-bottom: 5em;
	border-bottom: 10px dotted #a3dde5;
}
#otodama .section.description h2 {
	text-align: center;
	margin-bottom: 2em;
}
#otodama .section.description p.copy {
	text-align: center;
	font-weight: bold;
	font-size: 110%;
	color: #333;
	margin-bottom: 1.5em;
}
#otodama .section.description p.copy.serif {
	font-size: 150%;
	margin-bottom: 2em;
}
#otodama .section.description p span {
	display: block;
	font-weight: bold;
}
	/* -- >>> styles for narrow layout ----- */
	@media screen and (max-width: 599px) {
		#otodama .section.description p.copy {
			font-size: 105%;
		}
		#otodama .section.description p.copy.serif {
			font-size: 125%;
		}
		#otodama .section.description p.copy {
			text-align: left;
		}
		#otodama .section.description p.copy span {
			display: inline;
			font-weight: bold;
		}
	}


#otodama .section.artist {
	overflow: hidden;
	margin-right: -4px;
	margin-bottom: 3em;
}
#otodama .section.artist .list {
	float: left;
	width: 400px;
	margin-right: 4px;
	margin-bottom: 20px;
	padding: 10px 9px 10px 19px;
}
#otodama .section.artist h4 {
	margin-right: 10px;
	margin-bottom: 20px;
}
#otodama .section.artist h4 img {
	width: 100%;
}
#otodama .section.artist .list.day_0905 h4 {
	text-align: left;
}
#otodama .section.artist .list.day_0906 h4 {
	text-align: right;
}
#otodama .section.artist .list.day_0905 {
	background: #faebec;
}
#otodama .section.artist .list.day_0906 {
	background: #ecf3f9;
}
#otodama .section.artist .list .more {
	font-size: 120%;
	font-weight: bold;
	line-height: 200px;
}

	/* -- >>> styles for narrow layout ----- */
	@media screen and (max-width: 735px) {
		#otodama .section.artist .list {
			float: none;
			width: 100%;
			margin-right: 0;
			padding: 10px 0;
		}
		#otodama .section.artist .list .more {
			font-size: 110%;
			font-weight: bold;
			line-height: 150px;
		}
		#otodama .section.artist h4 {
			margin-right: 10px;
			margin-left: 10px;
		}
	}

#otodama .section.artist .list .headliner {
	position: relative;
	margin:0 auto 0;
}
/*
	@media screen and (min-width: 736px) {
	#otodama .section.artist .list .headliner {
		width:360px;
		height:324px;
	}
}
@media screen and (max-width: 735px) {
	#otodama .section.artist .list .headliner {
		width:320px;
		height:288px;
	}
}

	#otodama .section.artist .list .headliner img {
	width: 100%;
}
*/
#otodama .section.artist .list .headliner .icon-headliner {
	position: absolute;
	bottom:0;
	right: 0px;
	width: 120px;
	height: 50px;
	background: 50% 50% no-repeat;
	background-size:cover;
}
#otodama .section.artist .list.day_0905 .headliner .icon-headliner {
	background-image: url(/otodama/15/src/pc/image/teaser/headliner_red.png)
}
#otodama .section.artist .list.day_0906 .headliner .icon-headliner {
	background-image: url(/otodama/15/src/pc/image/teaser/headliner_blue.png)
}

@media screen and (max-width: 499px) {
	#otodama .section.artist .list li .headliner{
		width:160px;
		height:160px;
	}
	#otodama .section.artist .list li:nth-child(2n+1){
		clear:left;		
	}

}
@media screen and (min-width: 500px) and (max-width: 735px) {
	#otodama .section.artist .list li .headliner{
		width:120px;
		height:120px;
	}
	#otodama .section.artist .list li:nth-child(3n+1){
		clear:left;		
	}

}
@media screen and (min-width: 736px) {
	#otodama .section.artist .list li .headliner{
		width:190px;
		height:190px;
	}
	#otodama .section.artist .list li:nth-child(2n+1){
		clear:left;		
	}
}
#otodama .section.artist .list li {
	position: relative;
	float: left;
	width: 190px;
	margin: 0 10px 10px 0;
}
#otodama .section.artist .list li img {
	width: 100%;
}
#otodama .section.artist .list li .icon-new {
	position: absolute;
	top: 6px;
	left: -8px;
	width: 56px;
	height: 37px;
	background: 50% 50% no-repeat;
}
#otodama .section.artist .list.day_0905 li .icon-new {
	background-image: url(/otodama/15/src/pc/image/teaser/new_red.png)
}
#otodama .section.artist .list.day_0906 li .icon-new {
	background-image: url(/otodama/15/src/pc/image/teaser/new_blue.png)
}
	/* -- >>> styles for narrow layout ----- */
	@media screen and (max-width: 499px) {
		#otodama .section.artist .list li {
			max-width: 200px;
			width: 48%;
		}
		#otodama .section.artist .list.day_0905 li,
		#otodama .section.artist .list.day_0906 li {
			margin: 0 1% 10px 1%;
		}
	}
	/* -- >>> styles for narrow layout ----- */
	@media screen and (min-width: 500px) and (max-width: 735px) {
		#otodama .section.artist .list li {
			max-width: 200px;
			width: 31%;
		}
		#otodama .section.artist .list.day_0905 li,
		#otodama .section.artist .list.day_0906 li {
			margin: 0 1% 10px 1%;
		}
	}
	/* -- >>> styles for narrow layout ----- */
	@media screen and (max-width: 735px) {
		#otodama .section.artist .list ul {
			margin-right: 10px;
			margin-left: 10px;
		}
	}


#otodama .section.info {
}
#otodama .section.info p {
	color: #000;
	font-size: 120%;
	font-weight: bold;
	padding: 20px 0 0;
	text-align: center;
	line-height: 1.4;
}
#otodama .section.info p span.strong {
	color: #BC121A;
	font-size: 115%;
	font-weight: bold;
}
#otodama .section.info p span.strong.day {
	font-size: 145%;
}

	/* -- >>> styles for narrow layout ----- */
	@media screen and (max-width: 735px) {
		#otodama .section.info p span.strong {
		}
		#otodama .section.info p span.strong.day {
			display: block;
		}
	}




#otodama .section.ticket dl {
	overflow: hidden;
	padding-top: 10px;
}
#otodama .section.ticket dt {
	float: left;
	width: 10em;
	line-height: 1.2;
	padding: 10px 10px 0px;
	color: #BC121A;
	font-size: 130%;
	font-weight: bold;
}

#otodama .section.ticket dd {
	width: 100%;
	padding: 10px 0 10px 14.5em;
	box-sizing: border-box;
	border-bottom: 1px dotted #CCC;
}
#otodama .section.ticket dd .title {
	font-size: 200%;
	display: inline-block;
	padding: 0 0 10px ;
	color: #BC121A;
	font-weight: bold;
	/*text-shadow: 2px 2px 0px #fff,4px 4px 0px #333;*/
	line-height: 1;
}

#otodama .section.ticket dd strong {
	color: #222;
	font-weight: bold;
	font-size: 130%;
}
#otodama .section.ticket dd strong span {
	font-weight: bold;
}

#otodama .section.ticket p.banner {
	margin: 15px;
	text-align: center;
}
#otodama .section.ticket p.banner a {
	padding: 5px;
}

	/* -- >>> styles for narrow layout ----- */
	@media screen and (max-width: 735px) {
		#otodama .section.ticket p.copy {
			font-size: 120%;
		}

		#otodama .section.ticket dl {
			font-size: 100%;
		}
		#otodama .section.ticket dt {
			float: none;
			width: auto;
		}
		#otodama .section.ticket dt.banner {
			width: auto;
		}
		#otodama .section.ticket br.sp{
			display: none;
		}
		#otodama .section.ticket dd {
			padding: 10px 0 10px 0;
		}
		#otodama .section.ticket dd strong span.separator:after {
			content: '';
			display: block;
		}
	}

#otodama .section.blog h3 {
	padding: 1px 10px;
	background: #BE0007;
	color: #FFFFFF;
	font-weight: bold;
	font-size: 150%;
}
#otodama .section.blog h3 span {
	color: #FFFFFF;
	font-weight: bold;
	font-size: 150%;
}
	/* -- >>> styles for narrow layout ----- */
	@media screen and (max-width: 735px) {
		#otodama .section.blog h3 {
			padding: 0 5px;
			font-size: 90%;
		}
	}






/***========= 大阪城音泉 =========***/
#osakajo .section.description .image {
	text-align: center;
}
#osakajo .section.description p,
#osakajo .section.description dl {
	margin-left: 1em;
}
#osakajo .section.description p {
	margin-bottom: 0.5em;
}
#osakajo .section.description p.copy {
	font-weight: bold;
}
#osakajo .section.description p.report {
	border: 3px solid #EE0000;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;
	margin: 0.5em 0.5em 1em 1.5em;
	padding: 10px;
	background: #FFFFFF;
	font-weight: bold;
	font-size: 125%;
	color: #EE0000;
	-webkit-text-shadow: 2px 2px 1px #FFFFFF,
	    -2px 2px 1px #FFFFFF,
	    2px -2px 1px #FFFFFF,
	    -2px -2px 1px #FFFFFF;
	-moz-text-shadow: 2px 2px 1px #FFFFFF,
	    -2px 2px 1px #FFFFFF,
	    2px -2px 1px #FFFFFF,
	    -2px -2px 1px #FFFFFF;
	text-shadow: 2px 2px 1px #FFFFFF,
	    -2px 2px 1px #FFFFFF,
	    2px -2px 1px #FFFFFF,
	    -2px -2px 1px #FFFFFF;
}
#osakajo .section.description dl {
	font-weight: bold;
	font-size: 120%;
}
#osakajo .section.description dt {
	float: left;
	width: 7em;
	margin-bottom: 0.5em;
	padding: 2px 0;
	background: #BC121A;
	color: #FFFFFF;
	font-weight: bold;
	text-align: center;
}

#osakajo .section.description dd {
	width: 100%;
	margin-bottom: 0.5em;
	padding: 2px 0 2px 8em;
	box-sizing: border-box;
	font-weight: bold;
}

#osakajo .section.description dd strong {
	color: #EE0000;
	font-weight: bold;
	font-size: 130%;
}

	/* -- >>> styles for narrow layout ----- */
	@media screen and (max-width: 735px) {
		#osakajo .section.description p.copy {
			font-size: 120%;
		}

		#osakajo .section.description dl {
			font-size: 110%;
		}
		#osakajo .section.description dt {
			float: none;
		}
		#osakajo .section.description dd {
			padding-left: 0;
		}
	}


#osakajo .section.artist .statement {
	margin: 0 auto 15px;
	text-align: center;
}

#osakajo .section.artist .statement p {
	font-weight: bold;
	font-size: 26px;
}

#osakajo .section.artist .statement span {
	display: inline-block;
	padding: 2px 7px;
	background: #BC121A;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	background: #E00;
	color: #FFFFFF;
}

#osakajo .section.artist .opening {
	text-align: center;
}

#osakajo .section.artist ul {
	position: relative;
	left: 20px;
	width: 800px;
	margin: 0 auto;
}
#osakajo .section.artist li {
	float: left;
	width: 360px;
	margin-right: 40px;
	font-weight: bold;
	font-size: 26px;
}
#osakajo .section.artist li a {
	display: block;
}
#osakajo .section.artist li img {
	width: 100%;
}

	/* -- >>> styles for narrow layout ----- */
	@media screen and (max-width: 735px) {
		#osakajo .section.artist .statement p {
			font-weight: bold;
			font-size: 100%;
		}

		#osakajo .section.artist ul {
			display: table;
			left: 0;
			width: 80%;
			margin: 0 auto;
		}
		#osakajo .section.artist li {
			display: table-cell;
			float: none;
			width: 50%;
			margin: 0;
			padding: 0 5px;
			box-sizing: border-box;
			font-weight: bold;
			font-size: 100%;
		}
	}




#osakajo .section.goods dl {
	margin-bottom: 0.5em;
}
#osakajo .section.goods dd {
	float: left;
	width: 380px;
	padding: 0.5em 1em;
}
#osakajo .section.goods dd.image {
	width: auto;
	padding: 0;
}
#osakajo .section.goods p {
	margin-left: 1em;
}
#osakajo .section.goods p strong {
	font-weight: bold;
	font-size: 150%;
	color: #EE0000;
	-webkit-text-shadow: 2px 2px 1px #FFFFFF,
	    -2px 2px 1px #FFFFFF,
	    2px -2px 1px #FFFFFF,
	    -2px -2px 1px #FFFFFF;
	-moz-text-shadow: 2px 2px 1px #FFFFFF,
	    -2px 2px 1px #FFFFFF,
	    2px -2px 1px #FFFFFF,
	    -2px -2px 1px #FFFFFF;
	text-shadow: 2px 2px 1px #FFFFFF,
	    -2px 2px 1px #FFFFFF,
	    2px -2px 1px #FFFFFF,
	    -2px -2px 1px #FFFFFF;
}
#osakajo .section.goods p.offer {
	margin-top: 1.5em;
	padding-right: 10px;
	text-align: right;
}

	/* -- >>> styles for narrow layout ----- */
	@media screen and (max-width: 735px) {
		#osakajo .section.goods dd {
			float: none;
			width: auto;
		}
		#osakajo .section.goods dd.image {
			margin: 30px;
		}

		#osakajo .section.goods p strong {
			font-size: 110%;
		}
	}




#osakajo .section.ticket dl {
	margin-left: 1em;
}
#osakajo .section.ticket dt {
	width: 7em;
	margin-bottom: 0.5em;
	padding: 2px 0;
	background: #BC121A;
	color: #FFFFFF;
	text-align: center;
}
#osakajo .section.ticket dd {
	margin-bottom: 1.5em;
}
#osakajo .section.ticket .soldout {
	display: inline-block;
	margin-left: 10px;
	padding: 2px 7px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	background: #E00;
	color: #FFFFFF;
}

#osakajo .section.ticket .notes {
	color: #E00;
	font-weight: bold;
}



#osakajo .section.hall .place {
	float: left;
	width: 400px;
	padding: 0 20px;
}
#osakajo .section.hall .place h4 {
	margin-bottom: 0.5em;
	font-weight: bold;
	font-size: 20px;
}
#osakajo .section.hall .place p {
	margin-bottom: 1.5em;
}
#osakajo .section.hall .map {
	float: right;
	width: 400px;
	padding-right: 20px;
}

	/* -- >>> styles for narrow layout ----- */
	@media screen and (max-width: 735px) {
		#osakajo .section.hall .place {
			float: none;
			width: auto;
		}
		#osakajo .section.hall .map {
			float: none;
			width: 80%;
			margin: 0 auto;
			padding: 0;
		}
		#osakajo .section.hall .map iframe {
			width: 100% !important;
		}
	}


	.section.banner p.image img{
		width:100%;
		height:auto;
	}

	.section.banner p.image a{
		width:100%;
		height:auto;
	}
	
	.section.banner{
		border-top: dotted 1px #ccc;
		padding-top:40px;
	}
	.section.banner{
		text-align: center;
	}

@media screen and (min-width: 481px) {
	.section.banner p{
	width:480px;
	margin:0 auto;
	}
}

@media screen and (max-width: 480px) {
	.section.banner p.image{
		width:80%;margin:0 auto 2rem;
	}
}