@charset "utf-8";
/* CSS Document */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

html {
  -ms-text-size-adjust: 100%;  /* IE on Windows Phone用 */
  -webkit-text-size-adjust: 100%;  /* iOS用 */
  font-family: Tahoma, Geneva, sans-serif;
}
 
img {
    display: block;
    max-width: 100%;
    height: auto;
    text-align: center;
}

body {
    margin: 0;
    font-family: "Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    /* [disabled]background-color: #f0f8ff; */
}

header {
    height: 60px;
    width: 100%;
    padding: 0px 15px;
    /* [disabled]background-color: rgba(255,255,255,0.90); */
    position: fixed;
    top: 0;
    z-index: 10;
    display: flex;
	background-color: #ffffff;
}

.logo {
  font-size: 0px;
  background: url("img/logo_msma.png");
  background-repeat: no-repeat;
  margin:10px;
	width: 270px;
	height: 36px;
}

nav {
  margin: 0 0 0 auto;
}

ul {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
}

a {
    color: #0000CC;
    text-decoration: none;
    display: block;
    line-height: 60px;
    padding: 0 20px;
}

.sm {
  display: none;
}


/**********************************　
以下、ハンバーガーメニューの設定　
************************************/


  #hamburger {
    /* [disabled]background-color: #313382; */
    position: relative;
    cursor: pointer;
    margin: 0 0 0 auto;
    height: 60px;
    width: 60px;
  }

  .icon span {
    position: absolute;
    left: 15px;
    width: 30px;
    height: 4px;
    background-color: #231815;
    border-radius: 8px;
    transition: ease 0.75s;
  }

  .icon span:nth-of-type(1) {
    top: 16px;
  }
  .icon span:nth-of-type(2) {
    top: 28px;
  }
  .icon span:nth-of-type(3) {
    bottom: 16px;
  }

  .close span:nth-of-type(1) {
    transform: rotate(45deg);
    top: 28px;
  }

  .close span:nth-of-type(2) {
    opacity: 0;
  }

  .close span:nth-of-type(3) {
      transform: rotate(-45deg);
      top: 28px;
  }

  .sm {
    top: 60px;
    left: 0px;
    position: absolute;
    z-index: 10;
    width: 100%;
    background-color: #D1D0C2;
  }
.sm li{
	text-align: center;
}

  ul {
    flex-direction: column;
  }

  a {
    border-top: solid 0.5px rgba(255, 255, 255, 0.6);
  }



/*wrapper*/
#warpper { /* 小画面、中画面 */
  width: 100%;
    padding: 60px 15px 0px 15px;
}
@media only screen and (min-width:961px) { /* 大画面 */
  #warpper {
    max-width: 1160px;
    padding: 60px 15px 0px 15px;
	margin:0px auto;
 }
}

/*contents*/
#gaiyou a{
	padding:0px;
	line-height: normal;
	
}
.kouen{
	padding-top:30px;
}
h2 {
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	border-bottom: solid #C1000B 1px;
	margin:30px 0px;
}

#event{
	padding:0px 50px;
}

#event h2{
	font-size: 22px;
	font-weight: bold;
	color:#ffffff;
	background-color: #ff0000;
	page;5px;
	display: inline-block;
	margin-bottom: 0px;
	padding:0px 5px;
}
#ticket_a{
	margin-top: 60px;
}
#ticket {
	 display: flex;
    flex-wrap: wrap;
    gap:30px;
	justify-content: space-between; 
}
.t{
  padding: 30px;
  width: calc((100% - 30px ) / 2);
}
.t th{
	padding:15px;
}
.t td{
	padding:15px;
}
#access {
	 display: flex;
    flex-wrap: wrap;
    gap:30px;
	justify-content: space-between; 
}
.a{
  padding: 30px;
  width: calc((100% - 30px ) / 2);
}
.a td{
	padding:5px;
}

@media not all and (min-width: 768px) {
  .t {
    width: 100%;
  }
  .a {
    width: 100%;
  }
  .contents_s1 {
    width: 100%;
  }
}
.s1{
	 display: flex;
    flex-wrap: wrap;
    gap:30px;
	justify-content: space-between; 
}
.contents_s1{
  padding: 20px;
}
.s2{
	 display: flex;
    flex-wrap: wrap;
    gap:30px;
	justify-content: space-between; 
}
.s3{
	 display: flex;
    flex-wrap: wrap;
    gap:30px;
	justify-content: space-between; 
}
.contents_s3{
  padding: 20px;
}
.s4{
	 display: flex;
    flex-wrap: wrap;
    gap:30px;
	justify-content: space-between; 
}
.contents_s4{
  padding: 20px;
}

@media only screen and (min-width:961px) { /* 大画面 */

	
div .contents1{
	position: relative;
	cursor:pointer;
	overflow:hidden;
	margin:10px;
	height:850px;
}
    div .contents1 p{
    	margin:0px;
		padding:5px;
    	background-color:#000000;
    	position:relative;
    	top:100px;
    	color:#ffffff;
    }
div .contents2{
	cursor:pointer;
	overflow:hidden;
	margin:10px;
	height:653px;
}
    div .contents2 p{
    	margin:0px;
		padding:5px;
    	background-color:#000000;
    	position:relative;
    	top:100px;
    	color:#ffffff;
    }
div .contents_s1_1{
	cursor:pointer;
	overflow:hidden;
	margin:10px;
	height:299px;
}
    div .contents_s1_1 p{
    	margin:0px;
		padding:5px;
    	background-color:#000000;
    	position:relative;
    	top:100px;
    	color:#ffffff;
		width:226px;
		height:199px;
    }
div .contents_s1_2{
	cursor:pointer;
	overflow:hidden;
	margin:10px;
	height:299px;
}
    div .contents_s1_2 p{
    	margin:0px;
		padding:5px;
    	background-color:#000000;
    	position:relative;
    	top:100px;
    	color:#ffffff;
		width:300px;
		height:210px;
    }
div .contents_s1_3{
	cursor:pointer;
	overflow:hidden;
	margin:10px;
	height:299px;
}
    div .contents_s1_3 p{
    	margin:0px;
		padding:5px;
    	background-color:#000000;
    	position:relative;
    	top:100px;
    	color:#ffffff;
		width:408px;
		height:199px;
    }
div .contents_s2_1{
	cursor:pointer;
	overflow:hidden;
	margin:10px;
	height:315px;
}
    div .contents_s2_1 p{
    	margin:0px;
		padding:5px;
    	background-color:#000000;
    	position:relative;
    	top:100px;
    	color:#ffffff;
		width:550px;
		height:215px;
    }
div .contents_s2_2{
	cursor:pointer;
	overflow:hidden;
	margin:10px;
	height:315px;
}
    div .contents_s2_2 p{
    	margin:0px;
		padding:5px;
    	background-color:#000000;
    	position:relative;
    	top:100px;
    	color:#ffffff;
		width:444px;
		height:215px;
    }
div .contents_s3_1{
	cursor:pointer;
	overflow:hidden;
	margin:10px;
	height:380px;
}
    div .contents_s3_1 p{
    	margin:0px;
		padding:5px;
    	background-color:#000000;
    	position:relative;
    	top:100px;
    	color:#ffffff;
		width:218px;
		height:280px;
    }
div .contents_s3_2{
	cursor:pointer;
	overflow:hidden;
	margin:10px;
	height:346px;
}
    div .contents_s3_2 p{
    	margin:0px;
		padding:5px;
    	background-color:#000000;
    	position:relative;
    	top:100px;
    	color:#ffffff;
		width:328px;
		height:246px;
    }
div .contents_s3_3{
	cursor:pointer;
	overflow:hidden;
	margin:10px;
	height:350px;
}
    div .contents_s3_3 p{
    	margin:0px;
		padding:5px;
    	background-color:#000000;
    	position:relative;
    	top:150px;
    	color:#ffffff;
		width:392px;
		height:215px;
    }
div .contents_s4_1{
	cursor:pointer;
	overflow:hidden;
	margin:10px;
	height:440px;
}
    div .contents_s4_1 p{
    	margin:0px;
		padding:5px;
    	background-color:#000000;
    	position:relative;
    	top:150px;
    	color:#ffffff;
		width:245px;
		height:310px;
    }
div .contents_s4_2{
	cursor:pointer;
	overflow:hidden;
	margin:10px;
	height:550px;
}
    div .contents_s4_2 p{
    	margin:0px;
		padding:5px;
    	background-color:#000000;
    	position:relative;
    	top:150px;
    	color:#ffffff;
		width:190px;
		height:426px;
    }
div .contents_s4_3{
	cursor:pointer;
	overflow:hidden;
	margin:10px;
	height:620px;
}
    div .contents_s4_3 p{
    	margin:0px;
		padding:5px;
    	background-color:#000000;
    	position:relative;
    	top:200px;
    	color:#ffffff;
		width:189px;
		height:490px;
    }
div .contents_s4_4{
	cursor:pointer;
	overflow:hidden;
	margin:10px;
	height:600px;
}
    div .contents_s4_4 p{
    	margin:0px;
		padding:5px;
    	background-color:#000000;
    	position:relative;
    	top:200px;
    	color:#ffffff;
		width:189px;
    }

}
	
	
	
@media screen and (max-width: 1024px) {
div .contents1 p{
	display:none !important;
	}
div .contents2 p{
	display:none !important;
	}
div .contents_s1_1 p{
	display:none !important;
	}
div .contents_s1_2 p{
	display:none !important;
	}
div .contents_s1_3 p{
	display:none !important;
	}
div .contents_s2_1 p{
	display:none !important;
	}
div .contents_s2_2 p{
	display:none !important;
	}
div .contents_s3_1 p{
	display:none !important;
	}
div .contents_s3_2 p{
	display:none !important;
	}
div .contents_s3_3 p{
	display:none !important;
	}
div .contents_s4_1 p{
	display:none !important;
	}
div .contents_s4_2 p{
	display:none !important;
	}
div .contents_s4_3 p{
	display:none !important;
	}
div .contents_s4_4 p{
	display:none !important;
	}
}


.map{
	width: 100%;
	height: 400px;
	padding:3px;
}

#coupon{
	margin:0px auto;
	width:860px;
	padding:10px;
}

img.displayed {
    display: block;
    margin-left: auto;
    margin-right: auto; }

/*footer*/
footer {
  width: 100%;
  clear: both;
  padding-bottom: 50px;
}
.footer_content {
  max-width: 1160px;
  margin:0px auto;
	text-align: center;
}

/*gotop*/
html{
    scroll-behavior: smooth;
}
.gotop{
    display: block;
    width: 60px;
    height: 60px;
    box-sizing: border-box;
    background: #FFF;
    border: 1px solid #999;
    padding-top: 30px;
    text-align: center;
    letter-spacing: -1px;
    font-size: 85%;
    text-decoration: none;
    color: #333;
    opacity: 0.5;
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 10000;
}
.gotop::before{
    content: "";
    display: block;
    border-top: 2px solid #333;
    border-right: 2px solid #333;
    width: 25%;
    height: 25%;
    top: 25%;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    transform: rotate(-45deg);
}
.gotop:hover{
    opacity: 1;
}
@media(max-width:750px){
    .gotop{
        width: 40px;
        height: 40px;
        text-indent: -9999px;
        opacity: 1;
        border: none;
        background: none;
        bottom: 10px;
        right: 10px;
    }
    .gotop::before{
        bottom: 0;
    }
}