/* 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 h2 {
	line-height:1.4;
	font-weight: bold;
	padding: 1em 0;
	background:#ed70a0;
}
#pageOther.pageFair #container h2 small {
	display: block;
	position: relative;
	font-weight: normal;
	font-size: 80%;
}
#pageOther.pageFair #container div#gourmet h2 {	background:#f13f91;}
#pageOther.pageFair #container section#point h2 {	background:#fff100; color :#000;}
#pageOther.pageFair #container #cm h2 {		background:#FF933C}
#pageOther.pageFair #container #insta h2 {		background:#60499B;}

#pageOther.pageFair #container .inpage-menu {
  overflow: hidden;
  padding: 1.5em 0 0.8em 0;
  background: linear-gradient(#ffe991, #ffffff);
}
#pageOther.pageFair #container .inpage-menu ul {
	display: -ms-flexbox;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	justify-content: center;
}
#pageOther.pageFair #container .inpage-menu ul li {
	width:22%;
	margin:0 1% 2%;
}
#pageOther.pageFair #container .inpage-menu ul li a {
  padding: 20px 0 30px;
  text-align: center;
  font-size: 15px;
  font-weight: bold;
}
#pageOther.pageFair #container .inpage-menu ul li a::after {
  right:48.5%;
  top: auto;
  bottom: 5%;
}
#pageOther.pageFair #container .inpage-menu ul li.emifulls a {		background-color:#EA538A;}
#pageOther.pageFair #container .inpage-menu ul li.emifulls a:hover {background-color:#b12f5e;}
#pageOther.pageFair #container .inpage-menu ul li.fashion a {		background-color:#5DCABC;}
#pageOther.pageFair #container .inpage-menu ul li.fashion a:hover {	background-color:#35978a;}
#pageOther.pageFair #container .inpage-menu ul li.gourmet a {		background-color:#F64D5B;}
#pageOther.pageFair #container .inpage-menu ul li.gourmet a:hover {	background-color:#d43946;}
#pageOther.pageFair #container .inpage-menu ul li.strawberry a {		background-color:#F64D5B;}
#pageOther.pageFair #container .inpage-menu ul li.strawberry a:hover {	background-color:#d43946;}
#pageOther.pageFair #container .inpage-menu ul li.goods a {			background-color:#5BB431;}
#pageOther.pageFair #container .inpage-menu ul li.goods a:hover {	background-color:#418820;}
#pageOther.pageFair #container .inpage-menu ul li.point a {			background-color:#F3EB54; color: #000;}
#pageOther.pageFair #container .inpage-menu ul li.point a:hover {	background-color:#d3cc41;}
#pageOther.pageFair #container .inpage-menu ul li.insta a {			background-color:#60499B;}
#pageOther.pageFair #container .inpage-menu ul li.insta a:hover {		background-color:#3a276b;}
#pageOther.pageFair #container .inpage-menu ul li.cm a {			background-color:#FF933C;}
#pageOther.pageFair #container .inpage-menu ul li.cm a:hover {		background-color:#db7e32;}
#pageOther.pageFair #container .inpage-menu ul li.otoku a {			background-color:#F8A5C5; color: #000;}
#pageOther.pageFair #container .inpage-menu ul li.otoku a:hover {		background-color:#bd6d8c;}
#pageOther.pageFair #container .inpage-menu ul li a small {
	display: block;
	position: relative;
	margin-bottom: 3px;
	font-weight: normal;
}
#pageOther.pageFair #container .inpage-menu ul li a small::before,
#pageOther.pageFair #container h2 small::before {	content: "＼"; margin: 0 3px;}
#pageOther.pageFair #container .inpage-menu ul li a small::after,
#pageOther.pageFair #container h2 small::after  {	content: "／"; margin: 0 3px;}


#pageOther.pageFair #container section#goods p,
#pageOther.pageFair #container section#point p,
#pageOther.pageFair #container section#fashion p,
#pageOther.pageFair #container section#gourmet p {
	line-height:0;
}

#pageOther.pageFair #container .comment {
	margin: 3em;
}
#pageOther.pageFair #container .comment p {
	line-height: 1.4;
	margin: 1em 0 0 0;
}
#pageOther.pageFair #container .comment p a.btnNormal {
	font-size: 110%;
}
#pageOther.pageFair #container .text {
	margin: 2em 0;
}
#pageOther.pageFair #container .text p {
	line-height: 1.4;
	margin-top: 2em;
}
#pageOther.pageFair #container .text p img {
	max-width: 100%;
}

/* エミフルズコレクション */
#pageOther.pageFair #container #emifulls p {
	line-height: 1.6;
	margin:0 0 1.5em;
}
#pageOther.pageFair #container #emifulls ul {
	line-height: 1.6;
	margin:0 1vw 1.5em;
}
#pageOther.pageFair #container #emifulls li {
	margin-bottom: 8px;
	display: inline-block;
	margin-right:15px;
	font-weight: bold;
}

#pageOther.pageFair #container #emifulls li strong {
	position: relative;
	background: #fff;
	padding: 3px 8px 2px 20px;
	margin: 0 10px 0 0;
	display:inline-block;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}
#pageOther.pageFair #container #emifulls li strong::after {
	top: 10%;
	left: 9px;
	font-family: 'FontAwesome';
	content: "\f105";
	position: absolute;
}
#pageOther.pageFair #container #emifulls li strong a,
#pageOther.pageFair #container #emifulls li span a {
	text-decoration: underline;
}
#pageOther.pageFair #container #emifulls li strong a:hover,
#pageOther.pageFair #container #emifulls li span a:hover {
	text-decoration: none;
}
#pageOther.pageFair #container #emifulls li strong {	border:1px solid #a98667;}
#pageOther.pageFair #container #emifulls li.marina strong {	border:1px solid #22ac52;}
#pageOther.pageFair #container #emifulls li.yume strong {	border:1px solid #ea5514;}
#pageOther.pageFair #container #emifulls li.rina strong {	border:1px solid #f97599;}
#pageOther.pageFair #container #emifulls li.seika strong {	border:1px solid #ff2c48;}

#pageOther.pageFair #container #emifulls li strong,
#pageOther.pageFair #container #emifulls li strong a {	color:#a98667;}
#pageOther.pageFair #container #emifulls li.marina strong,
#pageOther.pageFair #container #emifulls li.marina strong a {	color:#22ac52;}
#pageOther.pageFair #container #emifulls li.yume strong,
#pageOther.pageFair #container #emifulls li.yume strong a {	color:#ea5514;}
#pageOther.pageFair #container #emifulls li.rina strong,
#pageOther.pageFair #container #emifulls li.rina strong a {	color:#f97599;}
#pageOther.pageFair #container #emifulls li.seika strong,
#pageOther.pageFair #container #emifulls li.seika strong a {	color:#ff2c48;}


@media screen and (min-width: 961px) {
#pageOther.pageFair #container section {
	padding-bottom: 50px;
}
#pageOther.pageFair #container #cm .movie {
  max-width: 760px;
  margin: 0 auto;
}
#pageOther.pageFair #container h2 small {
	display: inline-block;
	padding-right: 0.5em;
}
#pageOther.pageFair #container .comment {
	margin: 3em 0;
}
#pageOther.pageFair #container .comment p {
	font-size: 110%;
}
#pageOther.pageFair #container .text p {
	font-size: 110%;
}
}

@media only screen and (min-width: 769px) and (max-width: 960px) {
#pageOther.pageFair #container h1 {
	margin:-3vw -3vw 0 -3vw;
}
#pageOther.pageFair #container h2 {
  font-size: 150%;
}

#pageOther #container section {
	margin: 3vw 0vw;
}
#pageOther #container section#main {
	margin: 3vw;
}
.contents-menu {
    margin: 5vw 3vw -5vw 3vw;
    text-align: left;
}
.indexPoint p {
	margin: auto 3vw;
}
#pageOther.pageFair #container .btnNormal {
    width: 460px;
    margin: 0 auto;
}
#pageOther.pageFair #container .inpage-menu {
  margin: auto -3vw;
}
}

@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 -5vw 5vw -5vw;
	overflow:hidden;
}
#pageOther.pageFair #container h1 + .contents-menu {
	margin:-4px -5vw 0 -5vw;
}
#pageOther.pageFair #container .inpage-menu {
  margin: auto 0;
  padding: 2vw 0 0 1vw;
}
#pageOther.pageFair #container .inpage-menu ul li {
	width:47%;
}
#pageOther.pageFair #container .inpage-menu ul li a {
  font-size: 13px;
}
#pageOther.pageFair #container .inpage-menu ul li a::after {
  right: 48% !important;
}
#pageOther.pageFair #container section#fashion,
#pageOther.pageFair #container section#goods,
#pageOther.pageFair #container section#point,
#pageOther.pageFair #container section#gourmet,
#pageOther.pageFair #container section#emifulls {
	margin:0vw auto 0 auto;
}
}

@media only screen and (min-width: 641px) {
#pageOther.pageFair div.contents .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 -5vw 5vw -5vw;
	overflow:hidden;
}
#pageOther.pageFair #container h1 + .contents-menu {
	margin:-4px -5vw 0 -5vw;
}
#pageOther.pageFair #container .inpage-menu {
  margin: auto 0;
  padding: 2vw 0 0 0;
}
#pageOther.pageFair #container .inpage-menu ul li {
	width:47%;
	font-size:84%;
}
#pageOther #container section#fashion,
#pageOther #container section#goods,
#pageOther #container section#gourmet,
#pageOther #container section#emifulls {
  margin: 0;
}
#pageOther #container section#point {
  margin: 0 2vw;
  }
}

@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:100%;
}
#pageOther.pageFair #container .inpage-menu ul li a small {
  font-size:88%;
}
#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 {
  height: 7em;
  font-size: 100%;
}
}


.youtube-tate {
	width: 100%;
	max-width: 320px;
	aspect-ratio: 9 / 16;
	position: relative;
	margin: 20px auto;
}
.youtube-tate iframe {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.movie-tate {
	display: none;
}
@media screen and (min-width: 961px) {
	.movie-tate {
		display: none;
	}
}
@media all and (max-width: 640px) {
	.movie {
		display: none;
	}
	.movie-tate {
		display: block;
	}
}
