@charset "UTF-8";
/* CSS Document */

.img_gray {
	filter: grayscale(100%);
}

/*-
	PC版（769px以上）ここから
------------------------------------------------- */
@media screen and (min-width:769px), print{

	#privilege a {
		background-image: url("../images/privilege_PC_list.png");
		height: 101px;
		background-size: 100%;
		background-repeat: no-repeat;
		width: 1100px;
		display: block;
		margin: auto;
	}

	#title {
		margin-left: 0;
		margin-right: 0;
	}
	#title ul#shortcut{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		width: 1100px;
		margin: 70px auto 0;
	}
	#title ul#shortcut li{
		display: block;
		width: 200px;
		margin: 10px 0;
		background-image: url("../images/menu_arrow.png");
		background-repeat: no-repeat;
		background-position: right 12px center;
		background-size: 10px auto;
	}
	#title ul#shortcut li a{
		display: block;
		width: 100%;
		text-align: center;
		padding: 7px;
		color: #000000;
		border: 1.5px solid #707070;
		border-radius: 7px;
	}

	#bn_smartcode a {
		border: solid 1px #000;
		border-radius: 30px;
		padding: 0 50px;
		margin: 50px auto 0;
		width: 500px;
		display: block;
	}
	#bn_smartcode a img {
		width:100%;
	}

	.area1{
		display: block;
		font-size: 16px;
		font-weight: bold;
		color: #FFFFFF;
		padding: 5px 22px;
		margin: 15px auto;
		background-color: #EA9A00;
	}
	
	.list dl.area2,
	#ticket dl.area2,
	#store dl.area2{
		margin: 15px 0;
	}
	.list dl.area2 dt,
	#ticket dl.area2 dt,
	#store dl.area2 dt{
		display: block;
		position: relative;
		font-size: 16px;
		font-weight: bold;
		padding: 5px 22px;
		background-color: #F1F1F1;
		cursor: pointer;
	}
	.list dl.area2 dt::after,
	#ticket dl.area2 dt::after,
	#store dl.area2 dt::after{
		content: "＋";
		display: block;
		position: absolute;
		top: 50%;
		right: 20px;
		transform: translateY(-50%);
		font-size: 30px;
	}
	.list dl.area2.open dt::after,
	#ticket dl.area2.open dt::after,
	#store dl.area2.open dt::after{
		content: "－";
	}
	
	.list dl.area2 dd,
	#ticket dl.area2 dd,
	#store dl.area2 dd{
		display: none;
	}
	
	.list dl.area2 dd ul,
	#store dl.area2 dd ul,
	#ticket ul{
		/*padding: 0 20px;*/
	}
	.list dl.area2 dd ul li,
	#store dl.area2 dd ul li,
	#ticket ul li{
		display: flex;
		position: relative;
		padding: 10px 20px;
		border-bottom: 1.5px solid #F1F1F1;
	}
	/*
	#store dl.area2 dd ul li::before,
	#ticket ul li::before{
		content: "";
		display: block;
		position: absolute;
		left: 8px;
		top: 50%;
		transform: translateY(-50%);
		width: 25px;
		height: 25px;
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
	}
	
	#store dl.area2 dd ul li.tw::before{ background-image: url("../images/tw.png"); }
	#store dl.area2 dd ul li.li::before{ background-image: url("../images/li.png"); }
	#store dl.area2 dd ul li.in::before{ background-image: url("../images/in.png"); }
	#store dl.area2 dd ul li.fa::before{ background-image: url("../images/fa.png"); }
	#store dl.area2 dd ul li.hp::before{ background-image: url("../images/hp.png"); }
	#store dl.area2 dd ul li.no::before{ background-image: url("../images/no.png"); }
	*/
	
	.list dl.area2 dd ul li p,
	#store dl.area2 dd ul li p,
	#ticket ul li p{
		padding: 0 5px;
	}
	.list dl.area2 dd ul li .name,
	#store dl.area2 dd ul li .name,
	#ticket ul li .name{
		width: 350px;
	}
	.list dl.area2 dd ul li .address,
	#store dl.area2 dd ul li .address,
	#ticket ul li .address{
		width: calc(100% - 350px - 320px);
	}
	/*
	#store dl.area2 dd ul li p:nth-of-type(2),
	#ticket ul li p:nth-of-type(2){
		width: calc(100% - 400px);
	}
	*/
	.list dl.area2 dd ul li .link,
	#store dl.area2 dd ul li .link,
	#ticket ul li .link{
		display: flex;
		width: 320px;
		justify-content: right;
	}
	.list dl.area2 dd ul li .link p,
	#store dl.area2 dd ul li .link p,
	#ticket ul li .link p{
		padding: 0 5px;
	}
	.list dl.area2 dd ul li .link .privilege,
	#store dl.area2 dd ul li .link .privilege,
	#ticket ul li .link .privilege{
		margin-left: 10px;
		width: 65px;
  display: none;
	}
	.list dl.area2 dd ul li .link .privilege a,
	#store dl.area2 dd ul li .link .privilege a,
	#ticket ul li .link .privilege a{
		background-color:#ff593f;
		font-weight: bold;
		color:#FFF;
		padding: 2px 10px;
		border-radius: 10px;
		text-align: center;
		width: 100%;
		box-sizing: border-box;
	}
	.list dl.area2 dd ul li .link a img,
	#store dl.area2 dd ul li .link a img,
	#ticket ul li .link a img
	{
		width: 30px;
	}
	
	#store .area2 + .area1{
		margin-top: 30px;
	}
	
	#ticket .area1{
		margin-bottom: 5px;
	}
	
	/*
	#ticket ul{
		padding-left: 25px;
	}
	#ticket ul li{
		display: inline-block;
		margin-bottom: 8px;
		width: 33%;
	}
	#ticket ul li::before{
		content: "・";
	}
	*/
	
	#boshu #boshuFrame{
		display: block;
		padding-bottom: 40px;
		background-color: #F1F9CB;
		background-image: url("../images/boshu_pc.png");
		background-repeat: no-repeat;
		background-position: center top 40px;
		background-size: 350px auto;
		border-radius: 20px;
	}
	#boshu h3{
		height: 100px;
	}
	#boshu .linkButton{
		display: block;
		position: relative;
		width: 700px;
		margin: 0 auto;
		transition: 0.2s ease-in-out;
	}
	#boshu .linkButton a{
		display: block;
		position: relative;
		font-size: 18px;
		font-weight: bold;
		color: #FFFFFF;
		padding: 18px;
		text-align: center;
		background-color: #00913A;
		border-radius: 10px;
		box-shadow: 0px 4px 0 0 rgba(116, 116, 116, 0.2);
		transition: 0.2s ease-in-out;
		background-image: url("../images/arrow.png");
		background-repeat: no-repeat;
		background-position: center right 20px;
		background-size: 10px;
	}
	#boshu .linkButton:hover{
		transform: translateY(4px);
	}
	#boshu .linkButton:hover a{
		opacity: 1;
		box-shadow: none;
	}

	#boshu .linkButton img{
		display: block;
		width: 40px;
		position: absolute;
		top: -15px;
		right: 95px;
	}
	
	
}
/*-
	SP版（768px以下）ここから
------------------------------------------------- */
@media screen and (max-width: 768px) {

	#privilege a {
		background-image: url("../images/privilege_SP_list.png");
		background-size: 100%;
		background-repeat: no-repeat;
		background-position: center;
		max-width: 340px;
		height: 76px;
		display: block;
		margin: auto;
	}

	#title ul#shortcut{
		display: block;
		width: 85%;
		margin: 40px auto 0;
	}
	#title ul#shortcut li{
		display: block;
		width: 100%;
		margin: 18px 0;
		background-image: url("../images/menu_arrow.png");
		background-repeat: no-repeat;
		background-position: right 12px center;
		background-size: 10px auto;
	}
	#title ul#shortcut li a{
		display: block;
		width: 100%;
		text-align: center;
		padding: 7px;
		color: #000000;
		border: 1.5px solid #707070;
		border-radius: 7px;
	}

	#bn_smartcode a {
		border: solid 2px #000;
		border-radius: 10px;
		padding: 5px 50px;
		margin: 20px auto 0;
		width: 85%;
		display: block;
	}
	#bn_smartcode a img {
		width:100%;
	}


	.area1{
		display: block;
		font-size: 16px;
		font-weight: bold;
		color: #FFFFFF;
		padding: 5px 18px;
		margin: 12px auto;
		background-color: #EA9A00;
	}
	
	.list dl.area2,
	#ticket dl.area2,
	#store dl.area2{
		margin: 12px 0;
	}
	.list dl.area2 dt,
	#ticket dl.area2 dt,
	#store dl.area2 dt{
		display: block;
		position: relative;
		font-size: 16px;
		font-weight: bold;
		padding: 5px 18px;
		background-color: #F1F1F1;
		cursor: pointer;
	}
	.list dl.area2 dt::after,
	#ticket dl.area2 dt::after,
	#store dl.area2 dt::after{
		content: "＋";
		display: block;
		position: absolute;
		top: 50%;
		right: 10px;
		transform: translateY(-50%);
		font-size: 20px;
	}
	.list dl.area2.open dt::after,
	#ticket dl.area2.open dt::after,
	#store dl.area2.open dt::after{
		content: "－";
	}
	
	.list dl.area2 dd,
	#ticket dl.area2 dd,
	#store dl.area2 dd{
		display: none;
	}
	
	.list dl.area2 dd ul,
	#store dl.area2 dd ul,
	#ticket ul{
		/*padding-left: 5px;*/
	}
	.list dl.area2 dd ul li,
	#store dl.area2 dd ul li,
	#ticket ul li{
		display: block;
		position: relative;
		padding: 10px 5px;
		border-bottom: 1.5px solid #F1F1F1;
	}
	/*#store dl.area2 dd ul li::before,
	#ticket ul li::before{
		content: "";
		display: block;
		position: absolute;
		left: 8px;
		top: 10px;
		width: 25px;
		height: 25px;
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
	}
	
	#store dl.area2 dd ul li.tw::before{ background-image: url("../images/tw.png"); }
	#store dl.area2 dd ul li.li::before{ background-image: url("../images/li.png"); }
	#store dl.area2 dd ul li.in::before{ background-image: url("../images/in.png"); }
	#store dl.area2 dd ul li.fa::before{ background-image: url("../images/fa.png"); }
	#store dl.area2 dd ul li.hp::before{ background-image: url("../images/hp.png"); }
	#store dl.area2 dd ul li.no::before{ background-image: url("../images/no.png"); }*/
	
	.list dl.area2 dd ul li p,
	#store dl.area2 dd ul li p,
	#ticket ul li p{
		display: block;
	}
	.list dl.area2 dd ul li .link,
	#store dl.area2 dd ul li .link,
	#ticket ul li .link{
		/*-display: flex;-*/
		/*-width: 320px;-*/
		/*-justify-content: left;-*/
		/*-flex-flow: wrap;-*/
		display: grid;
		grid-template-columns: repeat(7, 40px);
		place-items: center center;
	}
	.list dl.area2 dd ul li .link p,
	#store dl.area2 dd ul li .link p,
	#ticket ul li .link p{
		padding: 5px;
		font-size: 12px;
	}
	.list dl.area2 dd ul li .link .privilege,
	#store dl.area2 dd ul li .link .privilege,
	#ticket ul li .link .privilege{
 display: none;
		/*-width: 100%;
		padding: 0 10px;-*/
	}
	.list dl.area2 dd ul li .link .privilege a,
	#store dl.area2 dd ul li .link .privilege a,
	#ticket ul li .link .privilege a{
		background-color:#ff593f;
		font-weight: bold;
		color:#FFF;
		padding: 2px;
		border-radius: 6px;
		text-align: center;
		width: 100%;
		box-sizing: border-box;
		line-height: 24px;
	}
	.list dl.area2 dd ul li .link a img,
	#store dl.area2 dd ul li .link a img,
	#ticket ul li .link a img{
		width: 30px;
	}
	
	#store .area2 + .area1{
		margin-top: 25px;
	}
	
	#ticket .area1{
		margin-bottom: 5px;
	}
	
	/*
	#ticket ul{
		padding-left: 15px;
	}
	#ticket ul li{
		display: block;
		margin-bottom: 8px;
	}
	#ticket ul li::before{
		content: "・";
	}
	*/
	
	#boshu #boshuFrame{
		display: block;
		padding-bottom: 40px;
		background-color: #F1F9CB;
		background-image: url("../images/boshu_sp.png");
		background-repeat: no-repeat;
		background-position: center top 50px;
		background-size: 250px auto;
		border-radius: 20px;
	}
	#boshu h3{
		height: 110px;
	}
	#boshu .linkButton{
		display: block;
		position: relative;
		width: 87%;
		margin: 0 auto;
		transition: 0.2s ease-in-out;
	}
	#boshu .linkButton a{
		display: block;
		position: relative;
		font-size: 16px;
		font-weight: bold;
		color: #FFFFFF;
		line-height: 1.3;
		padding: 15px 25px;
		text-align: center;
		background-color: #00913A;
		border-radius: 10px;
		box-shadow: 0px 4px 0 0 rgba(116, 116, 116, 0.2);
		background-image: url("../images/arrow.png");
		background-repeat: no-repeat;
		background-position: center right 15px;
		background-size: 10px;
	}
	#boshu .linkButton a span{
		display: inline-block;
	}

	#boshu .linkButton img{
		display: block;
		width: 40px;
		position: absolute;
		top: -15px;
		left: calc(50% + 45px);
	}









}