@charset "UTF-8";
/*****************************************************
base
*****************************************************/

body {
	background: #fff;
}

a {
	cursor: pointer;
	transition: .3s;
}

a:hover {
	cursor: pointer;
	text-decoration: none;
	opacity: 0.7;
}

a:active {
	text-decoration: none;
}

#fair p {
	letter-spacing: 0;
}

.animation {
	opacity: 0;
	visibility: hidden;
	transition: 1s;
	transform: translateY(80px);
}

.active {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.fadein {
	opacity: 0;
	transform: translateY(5px);
	transition: all 1.0s;
}

.fadein.show {
	opacity: 1;
	transform: translateY(0);
}

.fadein.show:nth-of-type(1) {
	transition-delay: 0.2s;
}

.fadein.show:nth-of-type(2) {
	transition-delay: 0.6s;
}

.fadein.show:nth-of-type(3) {
	transition-delay: 0.8s;
}

.fadein.show:nth-of-type(4) {
	transition-delay: 1s;
}

.fadein.show:nth-of-type(5) {
	transition-delay: 1.2s;
}

.fadein.show:nth-of-type(6) {
	transition-delay: 1.4s;
}

.fadein.show:nth-of-type(7) {
	transition-delay: 1.6s;
}

.fadein.show:nth-of-type(8) {
	transition-delay: 1.8s;
}

.fadein.show:nth-of-type(9) {
	transition-delay: 2s;
}

.fadein.show:nth-of-type(10) {
	transition-delay: 2.2s;
}

.fadein.show:nth-of-type(11) {
	transition-delay: 2.4s;
}

.fadein.show:nth-of-type(12) {
	transition-delay: 2.6s;
}

.fadein.show:nth-of-type(13) {
	transition-delay: 2.8s;
}

.fadein.show:nth-of-type(14) {
	transition-delay: 3s;
}

.fadein.show:nth-of-type(15) {
	transition-delay: 3.2s;
}

.fadein.show:nth-of-type(16) {
	transition-delay: 3.4s;
}

.fadein.show:nth-of-type(17) {
	transition-delay: 3.6s;
}

.fadein.show:nth-of-type(18) {
	transition-delay: 3.8s;
}

.fadein.show:nth-of-type(19) {
	transition-delay: 4s;
}

.mt30 {
	margin-top: 30px !important;
}

.mb10 {
	margin-bottom: 10px !important;
}

.mb-30 {
	margin-bottom: -30px !important;
}

.mb20 {
	margin-bottom: 20px !important;
}

.mb30 {
	margin-bottom: 30px !important;
}

.mb60 {
	margin-bottom: 60px !important;
}

.ml10 {
	margin-left: 10px !important;
}

.ml20 {
	margin-left: 20px !important;
}

.mr10 {
	margin-right: 10px !important;
}

.mr20 {
	margin-right: 20px !important;
}

.txt__center {
	text-align: center;
}
.txt__left {
	text-align: left;
}
.txt__right {
	text-align: right;
}
/*****************************************************
font family
*****************************************************/
.u-font-mincho {
	font-family: "貂ｸ譏取悃", YuMincho, "繝偵Λ繧ｮ繝取�譛� ProN W3", "Hiragino Mincho ProN", "HG譏取悃E", "�ｭ�ｳ �ｰ譏取悃", "�ｭ�ｳ 譏取悃", serif;
}
.font__min {
	font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}

/*****************************************************
Layout
*****************************************************/

.contents {
	width: 100%;
	overflow: hidden;
}

/*****************************************************
Object/Component
*****************************************************/
.sp-only {
	display: none;
}

.pc-only {
	display: block;
}

@media screen and (max-width: 768px) {
	.sp-only {
		display: block;
	}
	.pc-only {
		display: none;
	}
}
/*****************************************************
LP繝壹�繧ｸ逕ｨ
*****************************************************/
/* kv */
.main-visual {
	position: relative;
  width: 100%;
  height: calc(1487/2800*100vw);
}
.main-visual__logo {
  position: absolute;
  background: #fff;
  padding: 10px 30px;
	max-width: 394px;
	top: 0;
	left: 0;
  z-index: 99;
}
.main-visual__wrap {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
	/* max-width: 1400px; */
  width: 100%;
  height: 100%;
	margin: auto;
}
.main-visual__title {
	position: absolute;
	margin: 0 auto 0;
  top: 0;
	left: 0;
  transform: translate(0,0);
	margin: calc(100/2800*100vw) 0 0 calc(170/2800*100vw);
  z-index: 2;
}
.main-visual__title img {
	width: calc(1506/2800*100vw);
}
.main-visual__bg {
  position: absolute;
	width: 100%;
  top: 0;
	left: 0;
  z-index: 0;
}
.main-visual__bg img {
	width: 100%;
	height: calc(1487/2800*100vw);
	/* max-height: 1158px; */
}
.main-visual__text {
	position: absolute;
  top: 0;
	right: 0;
	margin: calc(100/2800*100vw) calc(100/2800*100vw) 0 0;
	z-index: 1;
}
.main-visual__text img {
	width: calc(512/2800*100vw);
}

@media screen and (max-width: 1200px) and (min-width: 769px) {
	/* .main-visual__title {
		margin: calc(200/2800*100vw) auto 0;
		left: 50%;
    transform: translate(-50%,0%);
	}
	.main-visual__title img {
		width: calc(1200/2800*100vw);
	} */
}

@media screen and (max-width: 768px) {
	/* kv */
	.main-visual {
		position: relative;
	  width: 100%;
	  height: calc(934/768*100vw);
	}
	.main-visual__logo {
	  position: absolute;
	  background: #fff;
	  padding: calc(10/768*100vw) calc(30/768*100vw);
		max-width: 394px;
	  width: 50%;
	  z-index: 3;
	}
	.main-visual__wrap {
	  position: relative;
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  width: 100%;
	  height: 100%;
	}
	.main-visual__title {
		position: absolute;
		left: auto;
		right: 0;
		margin: calc(60/768*100vw) calc(50/768*100vw) 0 0;
		width: calc(357/768*100vw);
		transform: translate(0%,0%);
	  z-index: 2;
	}
	.main-visual__title img {
		width: calc(357/768*100vw);
	}
	.main-visual__bg {
	  position: absolute;
	  top: 0;
	  z-index: 0;
	}
	.main-visual__bg img {
		height: calc(934/768*100vw);
	}
	.main-visual__text {
		position: absolute;
	  bottom: 0;
		right: 0;
		margin: calc(50/768*100vw) calc(20/768*100vw) 0 0;
		z-index: 1;
	}
	.main-visual__text img {
		width: calc(204/768*100vw);
	}
}

/* 共通デザイン */
.section {
	position: relative;
  margin: 0 auto;
  padding: 0;
  width: 100%;
}
section:not(.kv_wrap) {
    margin-bottom: 0;
}
.section__wrap {
  margin: auto;
	max-width: 1350px;
	padding: 0 0 20px;
}
.section__full {
  margin: auto;
	width: 100%;
	padding: 0 0 30px;
}
.section__bg--w {
	background: #fff;
	margin: 50px auto;
	padding: 20px 0 0;
}
.content__title {
	text-align: center;
  max-width: 1200px;
  margin: 0 auto 20px;
  padding: 15px 0;
}
.content__text {
	font-size: 20px;
	line-height: 1.5;
}
.content__text--border {
	border: 1px solid #fff;
	color: #fff;
	font-size: 20px;
	line-height: 1.4;
	text-align: center;
	padding: 5px 10px;
	max-width: 960px;
	margin: 50px auto 0;
}
.main__content {
	margin: 20px auto 30px;
}
.content__column {
	display: flex;
	justify-content: center;
}
.column__medium {
	align-items: center;
}
.column__wrap {
	flex-wrap: wrap;
}
.content__img--center {
	text-align: center;
  max-width: 1050px;
  margin: 0 auto;
}
.content__text--small,.text__small {
	font-size: 12px;
	line-height: 1.5;
}
.content__note,.text__small {
	font-size: 10px;
	line-height: 1.3;
}
.content__bg1 {
	background: #f5edd3;
}
.content__bg2 {
	background: #fff;
}
.content__bg3 {
	background: #d98c41;
}
.content__bg4 {
	background: #93bd3b;
}

@media screen and (max-width: 768px) {
	/* 共通デザイン */
	.contents {
		overflow: hidden;
	}
	.section {
		position: relative;
	  margin: 0 auto;
	  padding: 0;
	  width: 100%;
	}
	.section__wrap {
	  margin: auto;
		max-width: 750px;
		padding: 0 3% calc(40/768*100vw);
	}
	.section__full {
	  margin: auto;
		width: 100%;
		padding: 0;
	}
	.section__bg--w {
		margin: 5%;
		padding: 0 0 calc(20/768*100vw);
	}
	.content__title {
		text-align: center;
	  max-width: 1050px;
	  margin: 0 auto 20px;
	  padding: 15px 0;
	}
	.content__text {
		font-size: 3vw;
		line-height: 1.5;
	}
	.content__text--border {
		font-size: 3.5vw;
		line-height: 1.4;
		padding: 5px 10px;
		margin: calc(50/768*100vw) auto 0;
	}
	.main__content {
		margin: calc(20/768*100vw) 5% calc(30/768*100vw);
	}
	.content__hero {
	  margin: 0 auto calc(20/768*100vw);
	  padding: 0 0 calc(15/768*100vw);
	}
	.content__img--center {
		text-align: center;
	  max-width: 1050px;
	  margin: calc(70/768*100vw) auto calc(20/768*100vw);
	}
	.text__small {
		font-size: 2vw;
	}
}

/* campaign */
section.campaign {
	margin-top: 20px;
	margin-bottom: 50px;
}
.campaign {
	position: relative;
	width: 1350px;
	height: 812px;
	z-index: 0;
}
.campaign::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	background: url(/fair/202307_summerfestival/assets/after/images/img-present-pc.jpg) no-repeat;
	background-size: cover;
	background-position: center;
	width: 100%;
	height: 100%;
	margin: auto;
	z-index: -1;
}
.campaign .content__title {
	position: relative;
	text-align: center;
	padding: 20px 0 0;
	width: 840px;
}
/* .campaign .content__title::before {
	content: "";
	position: absolute;
	top: 50%;
	left: -200px;
	background: url(/fair/202307_summerfestival/assets/after/images/img-title-left-pc.png) no-repeat;
	background-size: contain;
	background-position: center;
	width: 178px;
	height: 221px;
	margin: auto;
	transform: translate(0,-50%);
	z-index: -1;
} */
.campaign .present-col {
	position: relative;
	width: 1000px;
	margin: 0 auto;
}
.campaign .present-col::before {
	content: "";
	position: absolute;
	top: 15%;
	right: -18%;
	background: url(/fair/202307_summerfestival/assets/after/images/img-present-item-pc.png) no-repeat;
	background-size: contain;
	background-position: center;
	width: 500px;
	height: 423px;
	margin: auto;
	transform: translate(0,-50%);
	z-index: 1;
}
.campaign .present-img {
	width: 460px;
	padding-left: 30px;
}
.campaign .present-text {
	width: 830px;
	margin: 0 auto;
}
.campaign .present-schedule {
	width: 830px;
	margin: 0 auto;
	padding-top: 10px;
}
.campaign .present-description {
	color: #595858;
	font-size: 20px;
	font-feature-settings: "palt";
	line-height: 1.5;
}
.campaign .present-detail {
	margin: 25px 0 20px;
}
.campaign .present-detail dl {
	margin-bottom: 10px;
}
.campaign .present-detail dt {
	background: #c40018;
	border-radius: 5px;
	color: #fff;
	display: inline-block;
	font-size: 15px;
	line-height: 1.3;
	text-align: center;
	vertical-align: top;
	width: 120px;
	padding: 1px 0;
}
.campaign .present-detail dd {
	display: inline-block;
	font-size: 16px;
	margin-left: 10px;
	font-feature-settings: "palt";
}
.campaign .present-note {
	color: #251e1c;
	font-size: 12px;
	line-height: 1.5;
}


@media screen and (max-width: 768px) {
	/* campaign */
	section.campaign {
		margin-top: calc(20/768*100vw);
		margin-bottom: calc(30/768*100vw);
	}
	.campaign {
		position: relative;
		width: calc(750/768*100vw);
	  height: calc(1661/768*100vw);
		z-index: 0;
	}
	.campaign::before {
		content: "";
	  position: absolute;
	  top: 0;
	  left: 0;
		right: 0;
	  background: url(/fair/202307_summerfestival/assets/after/images/img-present-sp.jpg) no-repeat;
	  background-size: cover;
		background-position: center;
		width: 100%;
		height: 100%;
		margin: auto;
		z-index: -1;
	}
	.campaign .content__title {
		position: relative;
		width: calc(597/768*100vw);
		margin: 0 auto;
		padding: calc(100/768*100vw) 0 0;
	}
	/* .campaign .content__title::before {
		content: "";
	  position: absolute;
	  top: 0;
	  left: calc(-50/768*100vw);
	  background: url(/fair/202307_summerfestival/assets/after/images/img-title-left-sp.png) no-repeat;
	  background-size: contain;
		background-position: center;
		width: calc(150/768*100vw);
		height: calc(184/768*100vw);
		margin: auto;
		transform: translate(0,0);
		z-index: -1;
	} */
	.campaign .present-col {
		flex-wrap: wrap;
		width: calc(620/768*100vw);
		margin: 0 auto;
	}
	.campaign .present-col::before {
		content: none;
	}
	.campaign .present-img {
		width: 90%;
		padding-top: calc(10/768*100vw);
		padding-left: 0;
		margin: 0 auto;
	}
	.campaign .present-text {
		width: 100%;
		padding-top: calc(20/768*100vw);
	}
	.campaign .present-schedule {
		width: 100%;
		margin: 0 auto;
		padding-top: 10px;
	}
	.campaign .present-description {
		font-size: 3.2vw;
		line-height: 1.4;
	}
	.campaign .present-detail {
		margin: 0 0 calc(20/768*100vw);
	}
	.campaign .present-detail dl {
		margin-bottom: calc(10/768*100vw);
	}
	.campaign .present-detail dt {
		display: inline-block;
		font-size: 3.2vw;
		line-height: 1.3;
		vertical-align: baseline;
		width: 120px;
		padding: 1px 0;
	}
	.campaign .present-detail dd {
		display: inline-block;
		font-size: 2.8vw;
		line-height: 1.3;
		margin-left: 0;
		width: 100%;
	}
	.campaign .present-note {
		font-size: 2.5vw;
		line-height: 1.5;
	}
}

/* note */
.note {
  background: #fff;
	padding: 30px 20px 90px;
}
.note__inner {
  max-width: 1400px;
  margin: auto;
}
.icon-note {
	width: 19px;
	margin-right: 5px;
	vertical-align: middle;
}
.note__text {
	color: #231815;
	display: inline-block;
	font-size: 12px;
  line-height: 1.6;
}
.note__text-2 {
	color: #231815;
	display: inline-block;
	font-size: 10px;
  line-height: 1.5;
}
@media screen and (max-width: 768px) {
	/* note */
	.note {
		max-width: initial;
	  padding: calc(40/768*100vw) 5% calc(70/768*100vw);
	}
	.note__inner {
	  width: 100%;
	  margin: auto;
	}
	.icon-note {
		margin-right: 10px;
		vertical-align: middle;
		width: 30px;
	}
	.note__top {
		display: block;
		font-size: 3.5vw;
	}
	.note__text {
		display: block;
		font-size: 3.5vw;
	  line-height: 1.5;
	}
	.note__text-2 {
		font-size: 2.5vw;
	  line-height: 1.4;
	}
}


