@charset "utf-8";
/* CSS Document */
body {
	overflow: hidden;
}
h1,h2,h3,h4,h5,p,li,a,
.f-mincho {
  font-family: "Zen Old Mincho", serif;
  font-weight: 600;
  font-style: normal;
	letter-spacing: 0.025em;
	color: #000;
}
body,
.text-en,
.headerNav a .text_en,
.f-gothic {
	font-size: 14px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  font-style: normal;
}
@media screen and (min-width: 1101px) {
	br.only_sp1100 {
		display: none;
	}
}
@media screen and (max-width: 767px) {
	body {
		font-size: 3.8vw;
	}
}
footer {
	background-color: #000;
	padding: 60px 40px 100px; 
}
footer .footerIn {
	width: 100%;
	max-width: 1920px;
	position: relative;
	padding-bottom: 50px;
}
footer .footerIn h2 {
	position: absolute;
	left: 0;
	top: 0;
}
footer .footerIn h2 img {
	width: 205px;
	height: auto;
}
footer ul {
	display: block;
	text-align: right;
	padding-top: 25px;
}
footer ul li {
	display: inline-block;
	margin-right: 2.0em;
}
footer ul li:nth-last-child(1) {
	margin-right: 0;
}
footer ul li a {
	display: block;
	font-size: 16px;
	color: #FFF;
}
footer .copy {
	font-size: 16px;
	text-align: center;
	color: #FFF;
}
.ctaArea {
	background-color: #000;
	position: fixed;
	bottom: -100px;
	left: 0;
	z-index: 900;
	padding: 10px 0;
	width: 100%;
	transition: 0.5s all ease;
}
.scrolled .ctaArea {
	bottom: 0;
}
.ctaArea .ctaIn ul {
	text-align: center;
	font-size: 0;
}
.ctaArea .ctaIn ul li {
	display: inline-block;
	vertical-align: middle;
	margin-right: 15px;
}
.ctaArea .ctaIn ul li.btn {
	margin-left: 0;
	padding-left: 10px;
}
.ctaArea .ctaIn ul li.sns img {
	width: 36px;
	height: auto;
}
.ctaArea .ctaIn ul li a {
	display: block;
}
.ctaArea .btn.redBtn a {
  position: relative;
  display: block;
  width: 400px;
  height: 54px;
  background-color: #b60101;
  margin: 0 auto;
  overflow: hidden;
}
.ctaArea .btn.redBtn a .texts > span.text_jp {
  font-size: 20px;
  line-height: 1.0;
}
.ctaArea .btn.redBtn a .texts > span.text_en {
  font-size: 18px;
  line-height: 1.3;
}
.gotop {
	cursor: pointer;
	display: table-cell;
	width: 58px;
	height: 58px;
	border: 1px solid #000;
	background-color: #FFF;
	position: fixed;
	right: 40px;
	bottom: -120px;
	z-index: 901;
	transition: 0.5s all ease;
}
.scrolled .gotop {
	bottom: 40px;
}
.gotop::after {
	content: "";
	display: table-cell;
	width: 26px;
	height: 28px;
	background: center / auto 100% url("../img/gotoparrow.png") no-repeat;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
}
.end .gotop {
	bottom: 210px;
}
.wrap {
	background-color:#FFF;
	position: relative;
}

.wrap header {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	z-index: 999;
}
.scrolled .wrap header {
	position: fixed;
	left: 0;
	top: -100px;
	background-color: #FFF;
	transition: 0.3s all ease;
}
.scrolled.scrolled02 .wrap header {
	position: fixed;
	left: 0;
	top: 0;
}

.wrap header .headerIn {
	height: 80px;
}
.wrap header .headerIn h1 {
	position: absolute;
	left: 20px;
	top: 15px;
}
.wrap header .headerIn h1 a {
	display: table;
}
.wrap header .headerIn h1 a > span {
	display: table-cell;
	height: 45px;
}
.wrap header .headerIn h1 a > span.logo {
	width: 223px;
	height: 45px;
}
.wrap header .headerIn h1 a > span.logo img {
	width: auto;
	height: 45px;
}
.pages.wrap header .headerIn h1 a > span.logo img {
	display: none;
}
.scrolled .wrap header .headerIn h1 a > span.logo img {
	display: none;
}
.pages.wrap header .headerIn h1 a > span.logo,
.scrolled .wrap header .headerIn h1 a > span.logo {
	background: left center / auto 100% url("../img/logo_black.png") no-repeat;
}

.wrap header .headerIn h1 a > span.text {
	vertical-align: middle;
	text-align: left;
	font-size: 16px;
	color: #FFF;
}
.scrolled .wrap header .headerIn h1 a > span.text {
	color: #000;
}
.wrap header .headerNav {
	position: absolute;
	top: 0;
	right: 0;
	padding: 20px 0;
}
.btn.redBtn {
	display: block;
	text-align: center;
}
.btn.redBtn a {
	position: relative;
	display: block;
	width: 400px;
	height: 90px;
	background-color: #b60101;
	margin: 0 auto;
	overflow: hidden;
}
.btn.redBtn a::before {
	content: "";
	display: table-cell;
	width: 137px;
	height: 138px;
	background: center / 100% auto url("../img/btn_art.png") no-repeat;
	left: 23px;
	bottom: -3px;
	position: absolute;
	opacity: 0.7;
}
.btn.redBtn a .texts {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	width: 100%;
}
.btn.redBtn a .texts > span {
	display: block;
	text-align: center;
	color: #FFF;
}
.btn.redBtn a .texts > span.text_jp {
	font-size: 24px;
	line-height: 1.3;
}
.btn.redBtn a .texts > span.text_en {
	font-size: 20px;
	line-height: 1.5;
}

@media screen and (min-width: 1101px) {

	.wrap header .headerNav > ul {
		display: block;
		font-size: 0;
	}
	.wrap header .headerNav > ul > li {
		display: inline-block;
		border-left: 1px solid #FFF;
		vertical-align: top;
	}
	.wrap header .headerNav > ul > li.only_sp767 {
		display: none;
	}
	.wrap.pages header .headerNav > ul > li {
		border-left: 1px solid #000;
	}
	.scrolled .wrap header .headerNav > ul > li {
		border-left: 1px solid #000;
	}
	.wrap header .headerNav > ul > li.cta {
		display: none;
	}
	.wrap header .headerNav > ul > li > a {
		display: block;
		height: 40px;
		padding: 0 1em;
	}
	.wrap header .headerNav > ul > li > a > span {
		display: block;
		text-align: center;
		color: #FFF;
		line-height: 20px;
	}
	.pages.wrap header .headerNav > ul > li > a > span {
		color: #000;
	}
	.scrolled .wrap header .headerNav > ul > li > a > span {
		color: #000;
	}
	.wrap header .headerNav > ul > li > a > span.text_jp {
		font-size: 16px;
	}
	.wrap header .headerNav > ul > li > a > span.text_en {
		font-size: 15px;
	}
	.wrap header .headerNav .snsList {
		padding: 6px 20px;
	}
	.wrap header .headerNav .snsList > ul {
		display: table;
	}
	.wrap header .headerNav .snsList > ul > li {
		display: table-cell;
		padding-right: 10px;
	}
	.wrap header .headerNav .snsList > ul > li:nth-last-child(1) {
		padding-right: 0;
	}
	.wrap header .headerNav .snsList > ul > li a {
		display: block;
		width: 28px;
		height: 28px;
	}
	.wrap header .headerNav .snsList > ul > li#sns_insta a {
		background: center / 100% auto url("../img/icn_sns_instagram.gif") no-repeat;
	}
	.wrap header .headerNav .snsList > ul > li#sns_x a {
		background: center / 100% auto url("../img/icn_sns_x.gif") no-repeat;
	}
	.wrap header .headerNav .snsList > ul > li#sns_note a {
		background: center / 100% auto url("../img/icn_sns_note.png") no-repeat;
	}
	.pages.wrap header .headerNav .snsList > ul > li#sns_insta a,
	.scrolled .wrap header .headerNav .snsList > ul > li#sns_insta a {
		background: center / 100% auto url("../img/icn_sns_instagram_black.gif") no-repeat;
	}
	.pages.wrap header .headerNav .snsList > ul > li#sns_x a,
	.scrolled .wrap header .headerNav .snsList > ul > li#sns_x a {
		background: center / 100% auto url("../img/icn_sns_x_black.gif") no-repeat;
	}
	.pages.wrap header .headerNav .snsList > ul > li#sns_note a,
	.scrolled .wrap header .headerNav .snsList > ul > li#sns_note a {
		background: center / 100% auto url("../img/icn_sns_note_black.png") no-repeat;
	}
	
	
	@media screen and (min-width: 1101px) and (max-width: 1500px) {
		.wrap header .headerIn h1 a > span.text {
			display: none;
		}	
		.wrap header .headerNav > ul > li > a {
		}
		.wrap header .headerNav > ul > li > a > span.text_jp {
		  font-size: 14px;
		}
	}
}

@media screen and (max-width: 1100px) {
	.wrap header .headerNav {
	  position: absolute;
	  top: 80px;
	  right: -100%;
	  padding: 50px 30px;
		display: block;
		width: 100%;
		background-color: #000;
		min-height: calc(100vh - 80px);
		overflow-y: scroll;
		transition: 0.3s all ease;
	}
	.wrap header.open .headerIn h1 a > span.logo img {
		display: none;
	}	
	.wrap header.open .headerIn h1 a > span.text {
	  color: #000;
	}
	.wrap header.open {
		background-color: #FFF;
		position: fixed;
		top: 0;
		left: 0;
	}
	.wrap header.open .headerNav {
	  right: 0%;
		overflow-y: scroll;
	}
	
	.wrap header.open .headerIn h1 a > span.logo {
	  background: left center / auto 100% url("../img/logo_black.png") no-repeat;
	}	
	.wrap header .headerNav > ul {
		padding-bottom: 30vh;
	}
	.wrap header .headerNav > ul > li {
		border-bottom: 1px solid #FFF;
	}
	.wrap header .headerNav > ul > li.only_sp767 {
		border-bottom: none;
	}
	.wrap header .headerNav > ul > li.only_sp767 .dotList {
		padding: 4vw 0;
	}
	.wrap header .headerNav > ul > li.only_sp767 .dotList li {
	}
	.wrap header .headerNav > ul > li.only_sp767 .dotList li a {
		display: block;
		position: relative;
		padding-left: 1em;
		font-size: 3.8vw;
		line-height: 11vw;
	}
	.wrap header .headerNav > ul > li.only_sp767 .dotList li a::before {
		content: "";
		display: table-cell;
		width: 1.5vw;
		height: 1.5vw;
		background-color: #FFF;
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		border-radius: 50%;
	}
	.wrap header .headerNav > ul > li.snsList,
	.wrap header .headerNav > ul > li.cta
	{
		border-bottom: none;
	}
	.wrap header .headerNav ul li a {
		display: block;
		color: #FFF;
		line-height: 45px;
	}
	.wrap header .headerNav ul li a span {
		color:#FFF;
		display: inline-block;
		vertical-align: top;
		line-height: 60px;
	}
	.wrap header .headerNav ul li a span.text_jp {
		font-size: 22px;
		padding-right: 1em;
		line-height: 60px;
	}
	.wrap header .headerNav ul li a span.text_en {
		font-size: 20px;
		line-height: 60px;
	}
	.wrap header .headerNav ul li.snsList {
		display: block;
		padding: 55px 0;
	}	
	.wrap header .headerNav ul li.snsList ul {
		display: block;
		text-align: center;
		font-size: 0;
	}	
	.wrap header .headerNav ul li.snsList ul li {
		display: inline-block;
		margin-right: 20px;
	}
	.wrap header .headerNav ul li.snsList ul li:nth-last-child(1) {
		margin-right: 0;
	}
	.wrap header .headerNav ul li.snsList ul li a {
		display: block;
		width: 40px;
		height: 40px;
	}
	.wrap header .headerNav .snsList > ul > li#sns_insta a {
		background: center / 100% auto url("../img/icn_sns_instagram.gif") no-repeat;
	}
	.wrap header .headerNav .snsList > ul > li#sns_x a {
		background: center / 100% auto url("../img/icn_sns_x.gif") no-repeat;
	}
	.wrap header .headerNav .snsList > ul > li#sns_note a {
		background: center / 100% auto url("../img/icn_sns_note_white.png") no-repeat;
	}
	
	.spBtn {
		display: table-cell;
		width: 50px;
		height: 42px;
		background-color: transparent;
		position: absolute;
		right: 20px;
		top: 19px;
	}
	.spBtn .border {
		width: 50px;
		height: 2px;
		background-color: #FFF;
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translateX(-50%) translateY(-50%) rotate(0);
		transition: 0.3s all ease;
	}
	.pages .spBtn .border {
		background-color: #000;
	}
	.scrolled .spBtn .border {
		background-color: #000;
	}
	.spBtn .border:nth-child(1) {
		top: 0;
		transform: translateX(-50%) translateY(0) rotate(0);
	}
	.spBtn .border:nth-child(2) {
		top: 50%;
		transform: translateX(-50%) translateY(-50%) rotate(0);
	}
	.spBtn .border:nth-child(3) {
		top: 42px;
		transform: translateX(-50%) translateY(-100%) rotate(0);
	}
	
	.open .spBtn {
		display: table-cell;
		width: 50px;
		height: 42px;
		background-color: transparent;
		position: absolute;
		right: 20px;
		top: 19px;
	}
	.open .spBtn .border {
		background-color: #000;
		transition: 0.3s all ease;
	}
	.open .spBtn .border:nth-child(1) {
		top: 50%;
		transform: translateX(-50%) translateY(-50%) rotate(225deg);
	}
	.open .spBtn .border:nth-child(2) {
		top: 50%;
		transform: translateX(-50%) translateY(-50%) rotate(0);
		width: 0;
	}
	.open .spBtn .border:nth-child(3) {
		top: 50%;
		transform: translateX(-50%) translateY(-50%) rotate(-225deg);
	}
	
	@media screen and (max-width: 767px) {
		
		.wrap header .headerIn {
		  height: 13vw;
		}
		.wrap header .headerIn h1 {
		  left: 4vw;
		  top: 50%;
			transform: translateY(-50%);
		}
		.wrap header .headerIn h1 a > span.logo {
		  width: 36.0vw;
		  height: 6.6vw;
		}		
		.wrap header .headerIn h1 a > span.logo img {
		  height: 6.6vw;
		}
		.wrap header .headerIn h1 a > span.text {
		  font-size: 2.6vw;
		}
		.wrap header.open .headerIn h1 a > span.logo {
		  background: left center / auto 100% url("../img/logo_black.png") no-repeat;
		}	
		.wrap header .headerIn h1 a > span {
		  display: table-cell;
		  height: 6.6vw;
		}		
		.spBtn {
			width: 6.5vw;
			height: 6.0vw;
			right: 4vw;
			top: 50%;
			transform: translateY(-50%);
		}
		.spBtn .border {
			width: 6.5vw;
			height: 2px;
		}
		.spBtn .border:nth-child(1) {
			top: 0;
			transform: translateX(-50%) translateY(0) rotate(0);
		}
		.spBtn .border:nth-child(2) {
			top: 50%;
			transform: translateX(-50%) translateY(-50%) rotate(0);
		}
		.spBtn .border:nth-child(3) {
			top: 6.0vw;
			transform: translateX(-50%) translateY(-100%) rotate(0);
		}

		.open .spBtn {
			width: 6.5vw;
			height: 6.5vw;
			right: 4vw;
			top: 50%;
			transform: translateY(-50%);
		}
		.open .spBtn .border {
			background-color: #000;
			transition: 0.3s all ease;
		}
		.open .spBtn .border:nth-child(1) {
			top: 50%;
			transform: translateX(-50%) translateY(-50%) rotate(225deg);
		}
		.open .spBtn .border:nth-child(2) {
			top: 50%;
			transform: translateX(-50%) translateY(-50%) rotate(0);
			width: 0;
		}
		.open .spBtn .border:nth-child(3) {
			top: 50%;
			transform: translateX(-50%) translateY(-50%) rotate(-225deg);
		}
		
		.wrap header .headerNav {
			position: absolute;
			top: 13vw;
			right: -100%;
			padding: 6.6vw 4vw;
			display: block;
			width: 100%;
			background-color: #000;
			height: calc(100vh - 13vw);
			overflow-y: scroll;
			transition: 0.3s all ease;
			box-sizing: border-box;
		}
		.wrap header .headerNav ul li a {
			line-height: 13vw;
		}		
		.wrap header .headerNav ul li a span.text_jp {
			font-size: 3.8vw;
			padding-right: 1em;
			line-height: 13vw;
			font-family: "Zen Kaku Gothic New", sans-serif;
			font-weight: 600;
			font-style: normal;
			overflow: hidden;
			
		}		
		.wrap header .headerNav ul li a span.text_en {
			font-size: 3.2vw;
			line-height: 13vw;
		}		
		.wrap header .headerNav ul li.snsList {
			display: block;
			padding: 8vw 0;
		}
		.wrap header .headerNav ul li.snsList ul li {
			margin-right: 3vw;
		}		
		.wrap header .headerNav ul li.snsList ul li a {
			width: 8vw;
			height: 8vw;
		}
		.btn.redBtn a {
		  width: 92vw;
		  height: 16vw;
		}		
		.wrap header .headerNav ul li.cta a span {
			line-height: 12vw;
		}	
		.wrap header .headerNav ul li.cta a span.text_jp {
			font-size: 4.5vw;
			padding-right: 0;
			line-height: 6vw;
		}		
		.btn.redBtn a .texts > span.text_en {
		  font-size: 4vw;
		}

		.btn.redBtn a::before {
		  content: "";
		  display: table-cell;
		  width: 33vw;
		  height: 33vw;
		  background: center / 100% auto url("../img/btn_art.png") no-repeat;

		  left: 6vw;
		  bottom: -1vw;
		  position: absolute;
		  opacity: 0.7;
		}
		.scrolled .spBtn .border {
			background-color: #000;
		}
		footer {
		  padding: 6.6vw 4vw 17vw;
		}
		footer ul {
		  display: none;
		}
		footer .footerIn h2 img {
		  width: 30vw;
		}		
		footer .copy {
		  font-size: 3.8vw;
			padding-top: 1em;
		}
		.ctaArea {
		  padding: 1.8vw 0;
		}		
		.ctaArea .ctaIn ul li {
			display: inline-block;
			vertical-align: middle;
			margin-right: 2vw;
		}
		.ctaArea .ctaIn ul li:nth-last-child(1) {
			margin-right: 0;
		}
		.ctaArea .ctaIn ul li.btn {
			margin-left: 0;
			padding-left: 2.6vw;
		}
		.ctaArea .ctaIn ul li.sns img {
			width: 8vw;
		}
		.ctaArea .ctaIn ul li a {
			display: block;
		}
		.ctaArea .btn.redBtn a {
		  width: 58.6vw;
		  height: 9.3vw;
		}
		.ctaArea .btn.redBtn a .texts > span.text_jp {
		  font-size: 3.8vw;
		}
		.ctaArea .btn.redBtn a .texts > span.text_en {
		  font-size: 3.3vw;
		}
		.gotop {
			cursor: pointer;
			display: table-cell;
			width: 10.6vw;
			height: 10.6vw;
			right: 4vw;
			bottom: -20vw;
		}
		.scrolled .gotop {
			bottom: 16vw;
		}
		.gotop::after {
			width: 6vw;
			height: 6vw;
		}
		.end .gotop {
			bottom: 28vw;
		}
	}
}