@charset "UTF-8";
/* ---------------------------------------
  TITLE : HANSHIN Tigers
  URI : hanshintigers.jp
  (C) HANSHIN Tigers.
--------------------------------------- */

@import "/common/css/format.css";

/* SP
--------------------------------------- */
@media only screen and (max-width: 640px) {
	body {
		background: #FFE100;
		font-size: 14px;
		line-height: 1;
	}
	ul.disc {
		margin-left: 10px;
	}
	ul.disc li {
		list-style: disc;
		margin-left: 1em;
		font-size: 14px;
		line-height: 1.4;
	}
	.red {
		color: #FF0000;
	}

	.hide_sp {
		display: none;
	}
	header .pc {
		display: none !important;
	}
	header .sp {
		width: 100%;
		max-width: 100%;
	}
	footer {
		display: table;
		position: relative;
		width: 100%;
		height: 139px;
		background: url(./img/20160624/footer_sp.png) center center no-repeat ,  url(./img/20160624/footer_sp_bg.png) 0 0 repeat-x;
		background-size: cover , contain;
	}





	footer p {
		padding-top: 100px;
		text-align: center;
		color: #FFFFFF;
	}



	footer#yerrow {
		display: table;
		position: relative;
		width: 100%;
		height: 139px;
		background: url(./img/20160624/footer_sp_yerrow.png) center center no-repeat ,  url(./img/20160624/footer_sp_bg_yerrow.png) 0 0 repeat-x;
		background-size: cover , contain;
	}

		footer#yerrow  p {
		padding-top: 150px;
		text-align: center;
		color: #FFFFFF;
	}


	#contents {
	    margin-top:80px;
	    padding:1em 1.5em;
	    line-height:1.5;
	}
	#contents p {
	    margin-bottom:1em;
	}



	.hamburger__icon,
	.hamburger__icon:before,
	.hamburger__icon:after {
	    background-color: #fff;
	}

	.text-center {
	    text-align: center;
	}
/*
	nav {
		background: #000000;
	}
	nav .wrap {
		margin: 0 auto;
		height: 50px;
	}
	nav p {
		float: left;
		width: 181px;
		height: 50px;
	}
	nav p img {
		width: 181px;
		height: 50px;
	}
	nav ul {
		float: right;
	}
	nav li {
		float: left;
		color: #8D8D8D;
		height: 50px;
		line-height: 50px;
		font-size: 12px;
	}
	nav li:after {
		content: " ｜ ";
	}
	nav li:last-child:after {
		content: none;
	}
	nav a {
		color: #FFFFFF !important;
		text-decoration: none;
	}
*/
	article h2 {
		height: 45px;
		text-align: center;
		background: #FFFFFF url(./img/20160624/bg_st.gif) 0 0 repeat-x;
		background-size: auto 45px;
	}
	article h2 img {
		width: 145px;
		height: 45px;
	}
	article h3 {
		font-size: 18px;
		font-weight: bold;
	}
	article h3 span {
		display: table;
	}
	article h4 {
		line-height: 1.4;
		font-size: 14px;
		font-weight: bold;
	}
	article p {
		margin-top: 10px;
		font-size: 12px;
		line-height: 1.4;
	}
	article .hall {
		background: url(./img/20160624/i_hall.png) right center no-repeat;
		background-size: 42px 13px;
		padding-right: 50px;
	}
	article .museum {
		background: url(./img/20160624/i_museum.png) right center no-repeat;
		background-size: 42px 13px;
		padding-right: 50px;
	}
	article .gourmet {
		background: url(./img/20160624/i_gourmet.png) right bottom no-repeat;
		background-size: 42px 13px;
		padding-right: 50px;
		padding-top:20px;
	}
	article .goods {
		background: url(./img/20160624/i_goods.png) right center no-repeat;
		background-size: 42px 13px;
		padding-right: 50px;
	}
	article .sns {
		background: url(./img/20160624/i_sns.png) right center no-repeat;
		background-size: 42px 13px;
		padding-right: 50px;
	}
	section {
		margin: 0 10px;
	}
	#concept {
		margin-top: 20px;
		border-top: 2px solid #000000;
	}
	#concept .lead {
		margin: 0;
		padding: 10px;
		border-bottom: 2px solid #000000;
	}
	#concept .lead p.t1 {
		margin-bottom: 10px;
		font-size: 14px;
		font-weight: bold;
	}
	#concept .lead p.t2 {
		font-weight: bold;
	}
	#concept .movie_unit {
		margin: 10px;
	}
	#concept .movie_unit h4 {
		margin-bottom: 10px;
		font-size: 16px;
		font-weight: bold;
		text-align: center;
	}
	#concept .cc {
		margin: 0 10px;
	}
	#concept .cc img {
		width: 100%;
	}
	#ticket .wrap_bg {
		padding-bottom: 20px;
		background: #362F00 url(./img/20160624/bg_ticket_sp.png) top center no-repeat;
		background-size: auto;
	}
	#ticket .unit_1 {
		padding: 10px;
		margin: 0;
	}
	#ticket .unit_1_2.team_s {
		padding-bottom: 10px;
		border-bottom: 1px dotted #FFFFFF;
	}
	#ticket .unit_1_2.team_d {
		padding: 10px 0;
		border-bottom: 1px dotted #FFFFFF;
	}
	#ticket .unit_1_2 dt {
		text-align: center;
	}
	#ticket .unit_1_2 dt img {
		width: 110px;
	}
	#ticket .unit_1_2 dd {
		margin-top: 10px;
		line-height: 1.3;
		color: #FFFFFF;
		font-size: 16px;
		font-weight: bold;
		text-align: center;
	}
	#ticket .unit_2 p {
		margin-top: 0;
		color: #FFFFFF;
		font-size: 16px;
		font-weight: bold;
		text-align: center;
	}
	#ticket .unit_2 .btn {
		margin-top: 10px;
	}
	#ticket .unit_2 .btn img {
		width: 100%;
	}
	#ticket .unit_3 {
		margin-top: 10px;
		padding: 10px;
		border: 3px solid #A28D00;
		background: #FFFFFF;
	}
	#ticket .unit_3_1 h3 {
		text-align: center;
	}
	#ticket .unit_3_1 h3 img {
		width: 200px;
	}
	#ticket .unit_3_1 h4 img {
		width: 100%;
	}
	#ticket .unit_3_1 h4,
	#ticket .unit_3_1 p {
		margin-top: 10px;
		text-align: center;
	}
	#ticket .unit_3_1 p {
		font-weight: bold;
	}
	#ticket .unit_3_2 {
		text-align: center;
	}
	#ticket .unit_3_2 img {
		width: 200px;
	}
	#event {
	}
	#event .unit_1 {
		padding: 20px 0;
	}
	#event .unit_1_1 h4 {
		margin: 10px 0;
	}
	#event .unit_1_2 {
		margin-top: 10px;
		text-align: center;
	}
	#event .unit_1_2 img {
		width: 100%;
		max-width: 400px;
	}
	#event .unit_2 {
		margin: 0;
		padding: 20px 10px;
		background: #000000 url(./img/20160624/bg_event_pc.png) top center no-repeat;
		background-size: auto;
	}
	#event .unit_2_1 {
		padding-bottom: 10px;
		color: #FFFFFF;
	}
	#event .unit_2_1 h4 {
		margin-top: 20px;
	}
	#event .unit_2_2 {
	}
	#event .unit_2_2 {
		margin-top: 10px;
		padding-top: 85px;
		background: url(./img/20160624/ticket_mark_s2.png) top center no-repeat;
		background-size: 100px 76px;
	}
	#event .unit_2_3 {
		margin-top: 10px;
		padding-top: 69px;
		background: url(./img/20160624/ticket_mark_d2.png) top center no-repeat;
		background-size: 100px 59px;
	}
	#event .unit_2_2_1 {
		padding-bottom: 10px;
	}
	#event .unit_2_2_1 dt {
		display: table-cell;
		width: 640px;
		height: 65px;
		line-height: 1.2;
		background: #FFE100;
		font-weight: bold;
		text-align: center;
		vertical-align: middle;
	}
	#event .unit_2_2_1 dt .d {
		font-size: 14px;
	}
	#event .unit_2_2_1 dt .n {
		font-size: 18px;
	}
	#event .unit_2_2_1 dt .n2 {
		font-size: 14px;
	}
	#event .unit_2_2_1 dt .z {
		font-size: 12px;
	}
	#event .unit_2_2_1 dd {
		padding: 10px 0;
		border-right: 2px solid #FFE100;
		border-bottom: 2px solid #FFE100;
		border-left: 2px solid #FFE100;
		text-align: center;
				color:#ffffff;
		font-weight:bold;
		line-height:1.5em;
		background-color: rgba(0,0,0,0.6);
		font-size:12px;
	}

	#event .unit_2_2_1 dd p{
		margin:0 10px;
		text-align:left;
	}

	#event .unit_2_3 .unit_2_2_1 dt {
		background: #FFFD11;
	}
	#event .unit_2_3 .unit_2_2_1 dd {
		border-right: 2px solid #FFFD11;
		border-bottom: 2px solid #FFFD11;
		border-left: 2px solid #FFFD11;

	}
	#event .unit_2_2_1 dd img {
		width: 100px;
		margin-bottom:10px;

	}

	#event .unit_2_2_1 dd ul{
		padding:10px 20px;
	}


		#event .unit_2_2_1 dd ul.left li {
		list-style:disc;
		color: #ffe100;
	}

		#event .unit_2_2_1 dd ul.right li {
		list-style:disc;
		color: #fffd11;
	}


	#event .unit_2_2_1 dd ul.left li span,
	#event .unit_2_2_1 dd ul.right li span {
		color: #ffffff;
	}


	#event .unit_2_4 {
		padding: 20px;
		border: 2px solid #FFB100;
	}
	#event .unit_2_4_1 dt {
		color: #FFB100;
		line-height: 1.4;
		font-size: 16px;
		font-weight: bold;
	}
	#event .unit_2_4_1 dd {
		margin-top: 10px;
		color: #FFFFFF;
		line-height: 1.4;
		font-size: 12px;
	}
	#event .unit_2_4_2 {
		margin-top: 10px;
		text-align: center;
	}
	#event .unit_2_4_2 img {
		width: 100%;
	}
	#event .unit_3 {
		padding: 20px 0;
		/*border-bottom: 2px solid #000000;*/
	}
	#event .unit_3 .wrap {
	}
	#event .unit_3_1 {
		margin-bottom: 10px;
	}
	#event .unit_3_1 h4 {
		margin: 10px 0;
	}
	#event .unit_3_1 p {
		text-align: center;
	}
	#event .unit_3_1 p img {
		width: 200px;
	}
	#event .unit_3_2 {
		text-align: center;
	}
	#event .unit_3_2 img {
		width: 100%;
		max-width: 300px;
	}


/*-----------------------------
	foods
------------------------------*/

	#foods {
		padding: 20px 0;
		border-bottom: 4px solid #000000;
	}
	#foods .logo{
		width: 300px;
		margin: 20px auto 0 auto;
	}
	#foods .logo img{
		width: 100%;
		height: auto;
	}
	#foods .unit_1 h4 {
		margin: 10px 0;
		padding: 10px 0;
		line-height: 1.2;
		color: #FFFFFF;
		font-size: 18px;
		font-weight: bold;
		text-align: center;
		background: #FF3C00;
	}
	#foods .unit_1 p {
		font-size: 14px;
		font-weight: bold;
	}
	#foods .unit_2 {
		margin-top: 10px;
	}
	#foods .unit_2 h5 {
		margin: 20px 0 10px 0;
		font-size: 16px;
		font-weight: bold;
		text-align: center;
	}
	#foods .unit_2_2 ul,
	#foods .unit_2_3 ul {
		display: flex;
		flex-wrap: wrap;
	}
	#foods .unit_2_2 li,
	#foods .unit_2_3 li {
		margin-top: 5px;
		width: 50%;
		text-align: center;
	}
	#foods .unit_2_2 li img,
	#foods .unit_2_3 li img {
		width: 150px;
	}

	#foods .unit_l{
		width: 100%;
	}
	#foods .unit_r{
		width: 100%;
		margin-top: 15px;
	}

	#foods .unit_2 ,
	#foods .unit_3 {
		margin: 0 10px;
		padding: 15px;
		background: #FFF;
		overflow: hidden;
		border-bottom: 2px solid #000000;
	}
	#foods .unit_4 {
		margin: 0 10px;
		background: #FFF;
		padding: 15px;
		overflow: hidden;
	}

	#foods .unit_2 dt {
		font-size: 16px;
		font-weight: bold;
	}
	#foods .unit_2 dd {
		font-size: 14px;
		font-weight: bold;
		line-height: 1.2;
		padding: 5px 0 10px 16px;
	}
	#foods .unit_2 dd span.s{
		font-size: 12px;
	}
	#foods .unit_2 p.indent{
		text-indent: -1em;
		margin-left: 1em;
		color: #FF0000;
	}
	#foods .unit_r img{
		width: 100%;
		height: auto;
	}

	#foods .unit_3 h5,
	#foods .unit_4 h5{
		color: #FF3C00;
		font-size: 18px;
		font-weight: bold;
	}
	#foods .unit_3 h6{
		clear: both;
		font-size: 14px;
		font-weight: bold;
	}
	#foods .culumn3{
		overflow: hidden;
		text-align: center;
		width: 100%;
	}
	#foods .culumn3 li{
		width: 230px;
		display: inline-block;
		margin: 20px 10px auto;
	}
	#foods .culumn3 li dt{
		font-size: 14px;
		font-weight: bold;
		text-align: center;
	}
	#foods .culumn3 li dd img{
		width: 100%;
		height: auto;
	}

	#foods .unit_3 .price{
		background: #FFE100;
		border: 2px solid #ff9000;
		padding: 5px;
		text-align: center;
		font-size: 12px;
		font-weight: bold;
		margin: 20px 0;
	}
	#foods .unit_3 .price span{
		font-size: 14px;
	}

	#foods .unit_3 ul.indent li{
			font-size: 12px;
			line-height: 1.4;
			text-indent: -1em;
			margin-left: 1em;
	}

	#foods .unit_4 .menu li{
		width: 100%;
		display: inline-block;
		padding: 10px;
		margin-top: 10px;
		border: 2px solid #FFE100;
		overflow: hidden;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	#foods .unit_4 .menu li img{
		width: 100%;
		height: auto;
	}
	#foods .unit_4 .menu li p{
		font-size: 12px;
		line-height: 1.8;
	}
	#foods .unit_4 .menu li p span.yb{
		background: #FFE100;
		font-weight: bold;
	}

	#foods .unit_5{
			border-top: 2px solid #000000;
			background: #FFE100;
			margin: 20px 0 0 0 !important;
		}
	#foods .unit_5 .wrap{
			margin: 0 10px;
		}
	#foods .unit_5 img{
			width: 100%;
			height: auto;
		}
	#foods .unit_5_1{
			overflow: hidden;
		}
	#foods .unit_5_1_1{
			width: 100%;
		}
	#foods .unit_5_1_2{
			width: 100%;
		}
	#foods .unit_5 dl{
			margin-top: 10px;
		}
	#foods .unit_5 dt{
	    width: 100%;
			padding: 10px 0 0 0;
	    line-height: 1.2;
	    background: #ffb100;
	    font-weight: bold;
	    text-align: center;
	    vertical-align: middle;
			font-size: 18px;
		}

	#foods .unit_5 dd{
	    background: #ffb100;
			padding: 5px 10px 10px 10px;
			text-align: center;
		}
	#foods .unit_5 dd p{
			margin-bottom: 10px;
		}
	#foods p.link{
		text-align:center;
		font-size:20px;
		margin-bottom: 0 ;
	}

	#foods .unit_6{
		width: 100%;
		border-top: 2px solid #000000;
		padding: 0 0 20px 0;
		margin: 20px 0 0 0;
	}
	#foods .unit_6 h3{
		padding-bottom: 10px;
	}
	#foods .unit_6 .wrap{
		margin: 0 10px;
	}

	#foods .unit_6 .inner_wrap{
	 padding: 20px 10px;
	 background: #FFF;
	 overflow: hidden;
	}

	#foods .unit_6  dt {
		font-size: 18px;
		font-weight: bold;
		color: #FF3C00;
		text-indent: -1em;
		margin-left: 1em;

	}
	#foods .unit_6  dd {
		font-size: 16px;
		font-weight: bold;
		line-height: 1.2;
		padding: 0 0 0 18px;
	}
	#foods .unit_6 #torkshow {
		border-top: 2px solid #000000;
	}


	#foods .unit_6 #torkshow ul{
		font-size: 12px;
		margin-top: 20px;
		border-top: 1px solid #ccc;
	}
	#foods .unit_6 #torkshow ul li{
		padding: 5px 0;
		border-bottom: 1px solid #ccc;
		line-height: 1.4;
	}
	#foods .unit_6 #torkshow ul li span{
			font-weight: bold;
	}
	#foods .unit_6 #torkshow ul li span.talent{
		display: inline-block;
		background: #FFB100;
	}


/*-----------------------------
			yellow_ultra_menu
------------------------------*/
		#yellow_ultra_menu{
			background: #FFE100 url(./img/20160624/bg_ultramenu.jpg) center bottom  repeat-x;
		}
		#yellow_ultra_menu .wrap{
			margin: 0 10px;
		}

		#yellow_ultra_menu h4{
			margin: 30px auto 20px auto;
			padding: 10px 0;
			line-height: 1.2;
			color: #FFFFFF;
			font-size: 18px;
			font-weight: bold;
			text-align: center;
			background: #FF3C00;
		}

		#yellow_ultra_menu h5 img{
			width: 100%;
			height: auto;
		}

		#yellow_ultra_menu h5{
			margin: 20px auto;
		}
		#yellow_ultra_menu .culumn3{
			overflow: hidden;
			text-align: center;
		}
		#yellow_ultra_menu .culumn3 li{
			width: 49%;
			display: inline-block;
			margin: 0 auto;
		}
		#yellow_ultra_menu .culumn3 li dt{
			width: 49%;
			text-align: center;
			font-weight: bold;
			font-size: 11px;
			line-height: 1.2;
			padding: 10px 0;
			display: table-cell;;
		}

		#yellow_ultra_menu .culumn3 li dd img{
			width: 100%;
			height: auto;
		}

		#yellow_ultra_menu p.catch{
			font-size: 16px;
			line-height: 1.2;
			font-weight: bold;
			color: #FFF;
			text-align: left;
			padding: 10px 0 ;
		}
		#yellow_ultra_menu p.catch br{
			display: none;
		}

	#garden {
		padding: 20px 0;
	}
	#garden .unit_1 {
		margin-bottom: 10px;
	}
	#garden .unit_1 h5 {
		margin: 10px 0 5px 0;
		font-size: 14px;
		font-weight: bold;
	}
	#garden .unit_1 p {
		margin-top: 10px;
		font-size: 14px;
		line-height: 1.4;
	}
	#garden .unit_1 p.note {
		margin-left: 1em;
		text-indent: -1em;
	}
	#garden .unit_2 {
		text-align: center;
	}
	#garden .unit_2 img {
		width: 100%;
		max-width: 400px;
	}
	#museum {
		background:#ffe100;
	}
	#museum .wrap {
		padding: 20px 0;
	}
	#museum .unit_1 h4 {
		margin-top: 10px;
	}
	#museum .unit_2 {
		margin-top: 10px;
		padding: 0 10px;
		background: #F4E0B3;
	}
	#museum .unit_2_1 {
		padding: 10px 0;
		border-bottom: 1px solid #FFB100;
	}
	#museum .unit_2_1:nth-of-type(3) {
		border-bottom: none;
	}
	#museum .unit_2_1 dt {
		line-height: 1.3;
		font-size: 18px;
		font-weight: bold;
	}
	#museum .unit_2_1 dt .s1 {
		font-size: 16px;
	}
	#museum .unit_2_1 dt .s2 {
		line-height: 1;
		font-size: 12px;
	}
	#museum .unit_2_1 dd {
		margin-top: 10px;
		line-height: 1.3;
		font-size: 16px;
	}
	#museum .unit_2_1 .img {
		margin-top: 20px;
		text-align: center;
		font-size: 12px;
	}

	#museum p.link{
		text-align:center;
		font-size:16px;
	}

	#museum .unit_2_1 .img img {
		margin-bottom: 3px;
	}
	/*-----------------------------
		goods
	------------------------------*/
	#goods {
		background: #ffe100;
	}
	#goods .wrap {
		padding: 20px 0;
	}
	#goods .unit_2 {
		margin-top: 10px;
	}
	#goods .unit_2_1 {
		padding: 10px;
		background: #FFFFFF;
	}
	#goods .unit_2_1 h5 {
		margin-bottom: 10px;
		font-size: 20px;
		font-weight: bold;
		color: #FF7200;
	}
	#goods .unit_2_1 h5 span {
		font-size: 16px;
	}
	#goods .unit_2_1 dt {
		line-height: 1.3;
		font-size: 14px;
		font-weight: bold;
	}
	#goods .unit_2_1 dd {
		margin-top: 10px;
		font-size: 12px;
		line-height: 1.4;
	}
	#goods .goods_1 {
		border-bottom: 1px solid #000000;
	}
	#goods .goods_2 dt {
		color: #FF0000;
	}
	#goods .unit_3 {
		margin-top: 10px;
	}
	#goods .unit_2_1_3 {
		margin-top: 10px;
		text-align: center;
	}
	#goods .unit_2_1_3 img {
		width: 100%;
		max-width: 400px;
	}

	#goods p.link{
		font-size: 14px;
		font-weight: bold;
	}


	#tagboard {
		background: #ffe100;
	}
	#tagboard .wrap {
		padding: 20px 0;
	}

	/*-----------------------------
		sponsor
	------------------------------*/


	#sponsor .wrap{
		background: #FFF;
		margin: 20px 10px;
		padding: 10px 0;
	}
	#sponsor .sponsor_l {
		text-align: center;
		margin: 10px 0;
	}
	#sponsor li img{
		width: 100%;
		height: auto;
	}
	#sponsor .sponsor_l li{
		display: inline-block;
		padding-bottom: 20px;
		width: 140px;
	}
	#sponsor .sponsor_m{
		text-align: center;
	}
	#sponsor .sponsor_m li{
		display: inline-block;
		padding-bottom: 10px;
		width: 120px;
	}
	#sponsor .sponsor_s{
		text-align: center;
		margin: 20px;
	}
	#sponsor .sponsor_s li{
		display: inline-block;
		padding:0 20px 10px 0;
		font-size: 12px;
	}
	#sponsor .sponsor_s span.sp img{
			width: 36px;
			height: 12px;
	}
}


}