@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=M+PLUS+Rounded+1c:700&display=swap&subset=japanese');
html {
	font-size: 62.5%;
	height: 100%;
}
#contentsWrapper {
	width: 100vw;
	height: auto;
	font-size: 12px;
	font-size: 1.2rem;
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
	line-height: 200%;
	color: #000;
	background-color: #fff;
	overflow-x: hidden;
	overflow-y: auto;
}
#contentsWrapper .dispWide {
	display: block;
}
#contentsWrapper .dispNarrow {
	display: none;
}
img {
  max-width: 100%;
  margin: auto;
}
@media screen and (max-width: 800px) {
	#contentsWrapper .dispWide {
		display: none;
	}
	#contentsWrapper .dispNarrow {
		display: block;
	}
}
#contentsWrapper .cover {
	width: 100%;
	height: auto;
}
#includeFooter {
	position: relative;
	z-index: 50;
}
#contentsWrapper {
	position: relative;
	width: 100%;
	letter-spacing: 0.05em;
	color: #000;
	background-color: #fff;
	box-sizing: border-box;
	overflow: hidden;
	z-index: 10;
}
#contentsWrapper .widthWrapper {
	position: relative;
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
  text-align: center;
}
#contentsWrapper .flexBlock {
	display: -webkit-flex;
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	flex-wrap: wrap;
	flex-direction: row;
	flex-shrink: 0;
	list-style: none;
}
#contentsWrapper .flexCenter {
	justify-content: center;
}
#contentsWrapper .flexBlock > li {
	width: 50%;
}
#contentsWrapper .widthWrapper .innerWrapper .flexBlock > li {
	width: 48%;
	max-width: 516px;
}
#contentsWrapper .widthWrapper .innerWrapper .flexBlock > li:nth-child(n + 3) {
	margin-top: 1em;
}
@media screen and (max-width: 800px) {
	#contentsWrapper .widthWrapper .flexBlock,
	#contentsWrapper .widthWrapper .innerWrapper .flexBlock {
		flex-direction: column;
	}
	#contentsWrapper .widthWrapper .flexBlock > li,
	#contentsWrapper .widthWrapper .innerWrapper .flexBlock > li {
		width: 80%;
		max-width: inherit;
		margin-left: auto;
		margin-right: auto;
	}
	#contentsWrapper .widthWrapper .flexBlock > li + li,
	#contentsWrapper .widthWrapper .innerWrapper .flexBlock > li + li {
		margin-top: 1em;
	}
}
#contentsWrapper .alignCenter {
	text-align: center;
}
#contentsWrapper .alignRight {
	text-align: right;
}
#contentsWrapper .alignLeft {
	text-align: left;
}
#contentsWrapper .fontBold {
	font-weight: bold;
}
#contentsWrapper .fontJp {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-weight: 700;
}
#contentsWrapper .text30 {
	font-size: 30px;
}
#contentsWrapper .text20 {
	font-size: 20px;
}
#contentsWrapper .text18 {
	font-size: 18px;
}
#contentsWrapper .text14 {
	font-size: 14px;
}
#contentsWrapper .text0 {
	font-size: 0;
}
@media screen and (min-width: 801px) and (max-width: 1280px) {
	#contentsWrapper .text30 {
		font-size: 2.34375vw;
	}
	#contentsWrapper .text20 {
		font-size: 1.5625vw;
	}
	#contentsWrapper .text18 {
		font-size: 1.40625vw;
	}
	#contentsWrapper .text14 {
		font-size: 1.09375vw;
	}
}
@media screen and (max-width: 800px) {
	#contentsWrapper .text30 {
		font-size: 4.72vw;
	}
	#contentsWrapper .text20 {
		font-size: 3.245vw;
	}
	#contentsWrapper .text18 {
		font-size: 3.5vw;
	}
	#contentsWrapper .text14 {
		font-size: 2.75vw;
	}
}
#contentsWrapper .lineHeight180 {
	line-height: 180%;
}
#contentsWrapper .marginTop1em {
	margin-top: 1em!important;
}
#contentsWrapper .marginTop2em {
	margin-top: 2em!important;
}
/*footer*/
#specialFooter {
	padding: 2em 3.125%;
	background-color: #fff;
}
#specialFooter > p > span {
	display: inline-block;
	margin: 0 0.5em;
}
@media screen and (max-width: 800px) {
	#specialFooter > p > span {
		display: block;
	}
}
/* sns */
#contentsWrapper .snsBlock {
	position: relative;
	width: 100%;
	height: 20px;
	margin: 0 auto;
	padding: 8px 0;
	overflow: visible;
	display: -webkit-flex;
	display: flex;
	justify-content: center;
	flex-shrink: 0;
}
#contentsWrapper .snsBlock .snsBtn {
	height: 20px;
	margin: 0 4px 0 0;
	line-height: 100%;
	display: block;
}
@media screen and (max-width: 800px) {
	#contentsWrapper .snsBlock {
		margin-top: 1em;
	}
}
/*goToBack*/
#goBack {
  position: fixed;
	bottom: 0;
	right: 0;
	z-index: 50;
}
#goBack a:hover img {
	opacity: 1.00;
}
@media screen and (max-width: 800px) {
  #goBack {
    width: 24%;
  }
}
/*common*/
#contentsWrapper .sectionTitle {
	position: relative;
	color: #4f3518;
	padding-bottom: 1em;
	letter-spacing: 0.25em;
	line-height: 120%;
}
#contentsWrapper .sectionTitle::first-letter {
	color: #e21b1b;
}
#contentsWrapper .sectionTitle::after {
	content: "";
	display: block;
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 18.75%;
	height: 1.5625vw;
	max-height: 20px;
	background-image: url("../images/_svg/decoTitle.svg");
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: contain;
	transform: translateX(-50%);
}
#contentsWrapper .sectionTitle span {
	display: block;
}
@media screen and (max-width: 800px) {
	#contentsWrapper .sectionTitle {
		padding-bottom: 3.25vw;
	}
	#contentsWrapper .sectionTitle::after {
		width: 35%;
		height: 3vw;
		max-height: inherit;
	}
}
#contentsWrapper .borderRadius3 {
	display: block;
	border-radius: 30px;
	overflow: hidden;
}
#contentsWrapper .borderRadius5 {
	position: relative;
	display: block;
	border-radius: 50px;
	overflow: hidden;
}
#contentsWrapper .borderRadius5::after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 8px solid #fff;
	border-radius: 50px;
	box-sizing: border-box;
}
@media screen and (max-width: 800px) {
	#contentsWrapper .borderRadius3,
	#contentsWrapper .borderRadius5,
	#contentsWrapper .borderRadius5::after {
		border-radius: 4vw;
	}
	#contentsWrapper .borderRadius5::after {
		border-width: 1.5vw;
	}
}
#contentsWrapper section {
	padding: 1.5em 0 3em;
	background-position: center top;
	background-repeat: repeat;
}
/*menu*/
.toggleBtn {
	cursor: pointer;
}
#contentsWrapper .toggleContents {
	display: none;
}
#contentsWrapper #specialHeader {
	position: fixed;
	top: 48px;
	width: 100%;
	z-index: 100;
}
#contentsWrapper #specialHeader #menuToggle {
	position: absolute;
	top: 0;
	right: 0;
	width: 14.84375%;
	height: 4.140625vw;
	max-height: 53px;
	background-image: url("../images/btnMenu.png");
	background-position: right top;
	background-repeat: no-repeat;
	background-size: contain;
	cursor: pointer;
}
@media screen and (min-width: 801px) and (max-width: 1280px) {
	#contentsWrapper #specialHeader {
		top: 3.8vw;
	}
}
@media screen and (max-width: 800px) {
	#contentsWrapper #specialHeader #menuToggle {
		width: 18%;
		height: 12vw;
	}
}
@media screen and (max-width: 400px) {
	#contentsWrapper #specialHeader #menuToggle {
		width: 24%;
	}
}
#contentsWrapper #specialHeader #contentsMenu {
	position: absolute;
	top: 0;
	right: 0;
	width: 37.5%;
	max-width: 266px;
}
#contentsWrapper #specialHeader #contentsMenu > ul {
	width: 100%;
	background-color: #f46ca2;
  padding: 0.6vw;
  text-align: center;
}
#contentsWrapper #specialHeader #contentsMenu > ul li {
	position: relative;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 100% auto;
}
#contentsWrapper #specialHeader #contentsMenu > ul li a {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
}
#contentsWrapper #specialHeader #contentsMenu > ul #logo {
	width: 50%;
	margin: 0 28%;
	padding-top: 17%;
	background-image: url("../images/logo.png");
}
#contentsWrapper #specialHeader #contentsMenu > ul li {
	width: 100%;
	padding-top: 31%;
}
#contentsWrapper #specialHeader #contentsMenu > ul #news a {
	background-image: url("../images/menuNewsOff.png");
  background-repeat: no-repeat;
  background-size: auto;
  background-position: center left;
  
}
#contentsWrapper #specialHeader #contentsMenu > ul #news a:hover {
	background-image: url("../images/menuNewsOn.png");
  background-repeat: no-repeat;
  background-size: auto;
  background-position: center left;
  transition: all 0.2s ease;
  -webkit-transition: all 0.2s ease;
  
}
#contentsWrapper #specialHeader #contentsMenu > ul #whats a {
	background-image: url("../images/menuAboutOff.png");
  background-repeat: no-repeat;
  background-size: auto;
  background-position: center left;
}
#contentsWrapper #specialHeader #contentsMenu > ul #whats a:hover {
	background-image: url("../images/menuAboutOn.png");
  background-repeat: no-repeat;
  background-size: auto;
  background-position: center left;
  transition: all 0.2s ease;
  -webkit-transition: all 0.2s ease;
}
#contentsWrapper #specialHeader #contentsMenu > ul #lineup a {
	background-image: url("../images/menuLineupOff.png");
  background-repeat: no-repeat;
  background-size: auto;
  background-position: center left;
  transition: all 0.2s ease;
  -webkit-transition: all 0.2s ease;
}
#contentsWrapper #specialHeader #contentsMenu > ul #lineup a:hover {
	background-image: url("../images/menuLineupOn.png");
  background-repeat: no-repeat;
  background-size: auto;
  background-position: center left;
  transition: all 0.2s ease;
  -webkit-transition: all 0.2s ease;
}
#contentsWrapper #specialHeader #contentsMenu > ul #close {
	width: 100%;
	padding-top: 9%;
	cursor: pointer;
  color: #fff;
}
#contentsWrapper #specialHeader #contentsMenu > ul #close .closeicon {
  display: block;
  position: relative;
  width: 30px;
  height: 30px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #f46ca2;
  margin: 0 auto;
}
#contentsWrapper #specialHeader #contentsMenu > ul #close .closeicon::before, .closeicon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 3px;
  height: 22px;
  background: #fff;
}
#contentsWrapper #specialHeader #contentsMenu > ul #close .closeicon::before {
  transform: translate(-50%,-50%) rotate(45deg);
}
#contentsWrapper #specialHeader #contentsMenu > ul #close .closeicon::after {
  transform: translate(-50%,-50%) rotate(-45deg);
}
@media screen and (max-width: 800px) {
  #contentsWrapper #specialHeader #contentsMenu > ul li {
    padding-top: 12%;
  }
	#contentsWrapper #specialHeader #contentsMenu {
		width: 100%;
		max-width: 100%;
		margin-left: 0;
	}
}
@media screen and (max-width: 620px) {
  #contentsWrapper #specialHeader #contentsMenu > ul li {
    padding-top: 18%;
  }
}

/*catchVisual*/
#contentsWrapper .catchVisual {
	width: 100vw;
  margin: 0 auto;
  padding-bottom: 6.0em;
  background-image: url("../images/bgTop.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  text-align: center;
  border-bottom: 10px solid #f56ca2;
  box-sizing: border-box;
}
#contentsWrapper .catchVisual p {
  padding-bottom: 4.0em;
}
#contentsWrapper .catchVisual li.slick-slide {
  padding-bottom: 3.0em;
}
#contentsWrapper .catchVisual ul {
  max-width: 1350px;
  max-height: 640px;
  margin: 0 auto;
}
#contentsWrapper .catchVisual li img {
  box-shadow: 20px 20px 10px 0 rgb(203 185 199);
}
/* Dots */
#contentsWrapper .catchVisual .slick-dots {
	display: -webkit-flex;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	flex-direction: row;
	flex-shrink: 0;
	list-style: none;
	width: 100%;
	height: 3.90625vw;
	max-height: 50px;
}
#contentsWrapper .catchVisual .slick-dots li {
	width: 1.111111vw;
	max-width: 20px;
	height: 1.111111vw;
	max-height: 20px;
	background-color: transparent;
	border-radius: 100%;
	overflow: hidden;
}
#contentsWrapper .catchVisual .slick-dots li + li {
	margin-left: 28px;
}
#contentsWrapper .catchVisual .slick-dots li button {
	display: block;
	color: transparent;
	font-size: 0;
	line-height: 0;
	background-color: #fff;
	border: none;
	outline: none;
	-webkit-transition: all 0.15s ease;
	transition: all 0.15s ease;
  position: relative
}
#contentsWrapper .catchVisual .slick-dots li button::before {
	content: "";
	width: 20px;
	height: 20px;
	position: absolute;
	top: -2px;
	left: -2px;
	border: 4px solid #f56ca2;
	border-radius: 50%;
	box-sizing: border-box;
}
#contentsWrapper .catchVisual .slick-dots li button:hover,
#contentsWrapper .catchVisual .slick-dots li.slick-active button {
	background-color: #ffd3ec;
}
#contentsWrapper .catchVisual .slick-dots li button:hover {
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
@media screen and (min-width: 801px) and (max-width: 1500px) {
	#contentsWrapper .catchVisual .slick-dots li + li {
		margin-left: 2.1875vw;
	}
  #contentsWrapper .catchVisual li img {
    max-width: 92%;
  }
  #contentsWrapper .catchVisual p {
    padding-bottom: 4.0vw;
  }
  #contentsWrapper .catchVisual p img {
    max-width: 45%;
  }
}
@media screen and (max-width: 800px) {
  #contentsWrapper .catchVisual p {
    padding-bottom: 4.0vw;
  }
  #contentsWrapper .catchVisual p img {
    max-width: 45%;
  }
	#contentsWrapper .catchVisual {
		height: 74.375vw;
	}
  #contentsWrapper .catchVisual li img {
    max-width: 92%;
    box-shadow: 8px 8px 6px 0 rgb(203 185 199);
  }
	#contentsWrapper .catchVisual .slider,
	#contentsWrapper .catchVisual .slider li {
		width: 100vw;
		height: 44.875vw;
	}
}
@media screen and (max-width: 620px) {
	#contentsWrapper .catchVisual {
		height: 80.375vw;
	}
	#contentsWrapper .catchVisual .slider,
	#contentsWrapper .catchVisual .slider li {
		width: 100vw;
		height: 43.875vw;
	}
	/* Dots */
	#contentsWrapper .catchVisual .slick-dots {
		height: 7.5vw;
	}
	#contentsWrapper .catchVisual .slick-dots li {
		width: 2.25vw;
		height: 2.25vw;
	}
	#contentsWrapper .catchVisual .slick-dots li + li {
		margin-left: 3.125vw;
	}
}

/*sec01 news*/
#contentsWrapper #sec01 {
  background-image: url("../images/bgNews.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
}
#contentsWrapper #sec01 .widthWrapper {
  position: relative;
}
#contentsWrapper #sec01 .widthWrapper ul {
  line-height: 2.2;
  background-image: url("../images/newsTitleBw.png");
  background-repeat: repeat-y;
  background-size: contain;
  background-position: center;
  padding: 10em 10em 3.0em;
  margin: 4.0em 0;
}
#contentsWrapper #sec01 .widthWrapper ul::before {
  content: '';
  position: absolute;
  top: -4em;
  left: 0;
  width: 100%;
  height: 20vw;
  max-height: 244px;
  background-image: url("../images/newsTitleTop.png");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: contain;
}
#contentsWrapper #sec01 .widthWrapper ul::after {
  content: '';
  position: absolute;
  bottom: -5.0em;
  left: 0;
  width: 100%;
  height: 10vw;
  max-height: 111px;
  background-image: url("../images/newsTitleBottom.png");
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: contain;
}
#contentsWrapper #sec01 .widthWrapper li {
  color: #f46ca2;
  text-align: left;
}
#contentsWrapper #sec01 .widthWrapper li a {
  text-decoration: none;
  color: #f46ca2;
}
#contentsWrapper #sec01 .widthWrapper li a:hover {
  color: #f46ca2;
}

@media screen and (max-width: 800px) {
#contentsWrapper #sec01 .widthWrapper ul {
  line-height: 1.6;
  padding: 18vw 10vw 4.0vw;
  margin: 4.0vw 0;
}
#contentsWrapper #sec01 .widthWrapper ul::before {
  top: -6.0vw;
  left: 0;
}
#contentsWrapper #sec01 .widthWrapper ul::after {
  bottom: -8.0vw;
  left: 0
}
}

/*sec02 concept*/
#contentsWrapper #sec02 {
	background-image: url("../images/bgConcept.jpg");
  background-repeat: no-repeat;
  background-position: top right;
  background-size: cover;
  border-bottom: 10px solid #fff;
  box-sizing: border-box;
}
#contentsWrapper #sec02 .widthWrapper p {
  padding-top: 2.0em;
}
@media screen and (max-width: 1280px) {
  #contentsWrapper #sec02 .widthWrapper {
    width: 98%;
  }
}
/*sec03 lineup*/
#contentsWrapper #sec03 {
	background-color: #ffd8d8;
  padding: 0;
  position: relative;
  z-index: -1;
}
#contentsWrapper #sec03::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 765px;
  background-image: url("../images/bgLineupTop.png");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
}
#contentsWrapper #sec03::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 765px;
  background-image: url("../images/bgLineupBottom.png");
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: cover;
  z-index: -1;
}
#contentsWrapper #sec03 ul {
  padding: 4.0em 0;
}
#contentsWrapper #sec03 li {
  padding: 3.0em 0;
  position: relative;
}
#contentsWrapper #sec03 li span {
  position: absolute;
  top: calc(100% - 500px);
  box-shadow: 10px 10px 10px rgb(120 120 120 / 45%);
}
/*#contentsWrapper #sec03 li:nth-child(2n-1) span {
  left: 40px;
}
#contentsWrapper #sec03 li:nth-child(2n) span {
  right: 40px;
}*/
#contentsWrapper #sec03 li:nth-child(2n) span {
  left: 40px;
}
#contentsWrapper #sec03 li:nth-child(2n-1) span {
  right: 40px;
}
#contentsWrapper #sec03 li a span {
  transition: all 0.2s ease;
  -webkit-transition: all 0.2s ease;
}
#contentsWrapper #sec03 li a:hover span {
  transition: all 0.2s ease;
  -webkit-transition: all 0.2s ease;
  box-shadow: none;
  top: calc(100% - 490px);
}
/*#contentsWrapper #sec03 li:nth-child(2n-1) a:hover span {
  left: 50px;
}
#contentsWrapper #sec03 li:nth-child(2n) a:hover span {
  right: 30px;
}*/
#contentsWrapper #sec03 li:nth-child(2n) a:hover span {
  left: 50px;
}
#contentsWrapper #sec03 li:nth-child(2n-1) a:hover span {
  right: 30px;
}
/*animation*/
.item{
　transform: translateY(20px);
  opacity: 0;
  transition: .5s;
}
.item.show{
  transform: translateY(0);
  opacity: 1;
}

@media screen and (max-width: 1280px) {
  #contentsWrapper #sec03 .widthWrapper {
    width: 98%;
  }
  #contentsWrapper #sec03 h2 img {
    max-width: 45%;
  }
  #contentsWrapper #sec03 li span {
    width: 70%;
    top: 7.0vw;
    box-shadow: 1.2vw 1.2vw 1.4vw rgb(120 120 120 / 45%);
  }
/*  #contentsWrapper #sec03 li:nth-child(2n-1) span {
    left: 3vw;
  }
  #contentsWrapper #sec03 li:nth-child(2n) span {
    right: 3vw;
  }*/
  #contentsWrapper #sec03 li:nth-child(2n) span {
    left: 3vw;
  }
  #contentsWrapper #sec03 li:nth-child(2n-1) span {
    right: 3vw;
  }
  #contentsWrapper #sec03 li a:hover span {
    top: 8.2vw;
  }
/*  #contentsWrapper #sec03 li:nth-child(2n-1) a:hover span {
    left: 3.2vw;
  }
  #contentsWrapper #sec03 li:nth-child(2n) a:hover span {
    right: 2.8vw;
  }*/
  #contentsWrapper #sec03 li:nth-child(2n) a:hover span {
    left: 3.2vw;
  }
  #contentsWrapper #sec03 li:nth-child(2n-1) a:hover span {
    right: 2.8vw;
  }
  #contentsWrapper #sec03 ul {
    padding: 4.0vw 0;
  }
  #contentsWrapper #sec03 li {
    padding: 4.0vw 0;
  }
}