/* CSS Document */

@charset "UTF-8";

#pageOther.pageFair #container .bg {
	background:url(images/bg.png) repeat-y;
	max-width:960px;
	margin:0 auto;
	line-height:0;
}

#pageOther.pageFair #container h1 { margin: 0;}
#pageOther.pageFair #container h1 + .contents-menu { padding: 0; margin: -4px auto 0 auto;}


#pageOther.pageFair #container #illumination h2  { background-color: #083770;}
#pageOther.pageFair #container #event h2  { background-color: #08654a;}
#pageOther.pageFair #container #cm h2     { background-color: #b01e23;}

#pageOther.pageFair #container .inpage-menu {
  overflow: hidden;
  padding: 1.5em 0 0.8em 0;
  background: linear-gradient(#e6c45d, #ffffff);
}
#pageOther.pageFair #container .inpage-menu ul {
	display:flex;
	flex-wrap: wrap;
	justify-content: center;
}
#pageOther.pageFair #container .inpage-menu ul li {
	display: flex;
}
#pageOther.pageFair #container .inpage-menu ul li a {
  padding-left:10px;
  padding-right:10px;
  text-align: center;
  font-size: 100%;
  padding-bottom: 1.8em;
}
#pageOther.pageFair #container .inpage-menu ul li a::after {
  right:47%;
  top: auto;
  bottom: 5%;
}

/*
#pageOther.pageFair #container .inpage-menu ul li.home a {			background-color:#f49d4e;}
#pageOther.pageFair #container .inpage-menu ul li.home a:hover {	background-color:#f18a39;}
*/
#pageOther.pageFair #container .inpage-menu ul li.home a {		background-color:#e10707;}
#pageOther.pageFair #container .inpage-menu ul li.home a:hover {	background-color:#c40b0b;}
#pageOther.pageFair #container .inpage-menu ul li.present a {		background-color:#00903d;}
#pageOther.pageFair #container .inpage-menu ul li.present a:hover {	background-color:#007026;}
#pageOther.pageFair #container .inpage-menu ul li.gourmet a {		background-color:#ea0d65;}
#pageOther.pageFair #container .inpage-menu ul li.gourmet a:hover {	background-color:#d71864;}
#pageOther.pageFair #container .inpage-menu ul li.coordinate a {	background-color:#e4007f;}
#pageOther.pageFair #container .inpage-menu ul li.coordinate a:hover {	background-color:#cc003f;}
#pageOther.pageFair #container .inpage-menu ul li.illumination a {		background-color:#083770;}
#pageOther.pageFair #container .inpage-menu ul li.illumination a:hover {background-color:#02244d;}
#pageOther.pageFair #container .inpage-menu ul li.event a {			background-color:#08654a;}
#pageOther.pageFair #container .inpage-menu ul li.event a:hover {	background-color:#044935;}
#pageOther.pageFair #container .inpage-menu ul li.cm a {			background-color:#b01e23; padding-top:2em;}
#pageOther.pageFair #container .inpage-menu ul li.cm a:hover {		background-color:#970f13;}

#pageOther.pageFair #container div#present div,
#pageOther.pageFair #container div#emifull div,
#pageOther.pageFair #container div#home div,
#pageOther.pageFair #container div#gourmet div,
#pageOther.pageFair #container div#event div {
	line-height:0;
}
#pageOther.pageFair #container #event div.bg {
  background: url(images/event_bg.png) repeat-y left top;
  background-size: 100% auto;
  padding: 50px;
}
#pageOther.pageFair #container #event div.bg img {
  margin-bottom: 1em;
}

@media screen and (min-width: 961px) {
#pageOther.pageFair #container .inpage-menu ul {
	padding: 0 1.5%;
}
#pageOther.pageFair #container .inpage-menu ul li {
	width:calc(100% / 4);
	margin:0;
	padding: 0.5%;
}
#pageOther.pageFair #container div#sweets div,
#pageOther.pageFair #container div#jewelry div,
#pageOther.pageFair #container div#item div {
	margin:-10px auto 0 auto;
}
#pageOther.pageFair #container #cm .movie {
  max-width: 760px;
  margin: 0 auto;
}
}

@media only screen and (min-width: 769px) and (max-width: 960px) {
#pageOther.pageFair #container h1 {
	margin:-3vw -3vw 0 -3vw;
}

#pageOther #container section {
    margin: 3vw;
}
.contents-menu {
    margin: 5vw 0 -5vw 0vw;
    text-align: left;
}
#pageOther.pageFair #container .inpage-menu {
  margin: auto -3vw;
}
#pageOther.pageFair #container .inpage-menu ul {
	padding:0 2%;
}
#pageOther.pageFair #container .inpage-menu ul li {
	width:calc(100% / 3);
	margin:0;
	padding: 0.5%;
}
#pageOther.pageFair #container .inpage-menu ul li a {
  font-size: 90%;
  padding-bottom: 1.8em;
}
#pageOther.pageFair #container div#home .sp,
#pageOther.pageFair #container div#present .sp,
#pageOther.pageFair #container div#gourmet .sp,
#pageOther.pageFair #container div#event .sp {
  display: none;
}
#pageOther.pageFair #container #event div.bg {
  padding: 5vw;
}

}

@media only screen and (min-width: 641px) and (max-width: 769px) {
#pageOther.pageFair #container h1 {
	margin:-5vw -5vw 0 -5vw;
}
#pageOther.pageFair #container h2 {
  font-size: 150%;
  margin: 5vw -5vw 2vw -5vw;
}
#pageOther.pageFair #container .contents-menu {
	margin:8vw 0 5vw 0;
	overflow:hidden;
}
#pageOther.pageFair #container h1 + .contents-menu {
	margin:-4px -5vw 0 -5vw;
}
#pageOther.pageFair #container .inpage-menu {
  margin: auto -5vw;
}
#pageOther.pageFair #container .inpage-menu ul {
	padding: 0 7vw;
}
#pageOther.pageFair #container .inpage-menu ul li {
	width:calc(100% / 2);
	margin:0;
	padding: 0.5%;
}
#pageOther.pageFair #container .inpage-menu ul li a {
  padding-bottom: 1.8em;
  font-size: 13px;
}
#pageOther.pageFair #container .inpage-menu ul li a::after {
  right: 48% !important;
}
#pageOther.pageFair #container div#home div,
#pageOther.pageFair #container div#present div,
#pageOther.pageFair #container div#gourmet div,
#pageOther.pageFair #container div#event div {
	margin:-20px -5vw 0 -5vw;
}
#pageOther.pageFair #container #event section {
	padding: 3vw;
}
#pageOther.pageFair #container div#home .sp,
#pageOther.pageFair #container div#gourmet .sp,
#pageOther.pageFair #container div#present .sp,
#pageOther.pageFair #container div#event .sp {
  display: none;
}
}


@media all and (max-width: 640px) {
#pageOther.pageFair #container h1 {
	margin:-5vw -5vw 0 -5vw;
}
#pageOther.pageFair #container .contents-menu {
	margin:8vw 0 5vw;
	overflow:hidden;
}
#pageOther.pageFair #container h1 + .contents-menu {
	margin:-4px -5vw 0 -5vw;
}
#pageOther.pageFair #container .inpage-menu {
  padding: 2vw 0 0;
}
#pageOther.pageFair #container .inpage-menu ul {
	padding:0 2%;
}
#pageOther.pageFair #container .inpage-menu ul li {
	width:calc(100% / 2);
	margin:0;
	padding: 0 1% 2%;
	font-size:13px;
}
#pageOther #container #home div,
#pageOther #container #present div,
#pageOther #container #gourmet div,
#pageOther #container #event div {
  margin: 0 -5vw;
}
#pageOther.pageFair #container #event section div.bg {
	padding: 5vw 10vw;
}
}

@media all and (max-width: 414px) {
#pageOther.pageFair #container section a.btnNormal {
  font-size: 100%;
}
#pageOther.pageFair #container .inpage-menu ul li a {
  font-size:88%;
  padding-left:5px;
  padding-right:5px;
}
#pageOther.pageFair #container .contents-menu ul li a::after {
    font-size: 100%;
}
}

@media all and (max-width: 360px) {
#pageOther.pageFair #container .inpage-menu ul li {
  font-size: 75%;
}
#pageOther.pageFair #container .inpage-menu ul li a {
  font-size: 100%;
}
}

#present .btnWrap {
  margin-top: 30px;
}
