@charset "UTF-8";
/* CSS Document */

@import url(reset.css);

html { scroll-behavior: smooth; }
img { vertical-align: bottom; }
ul { list-style-type: none; }


::selection { background:#e8355a; color: #fff; }


body {
	font-family: "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", Meiryo, sans-serif;
	font-size: 15px;
	line-height: 1;
}

img.auto { width: 100%; height: auto; }

@keyframes objApr {
	0% { opacity: 0; }
	100% { opacity: 1; }
}

a { transition: .3s; }

/* Google Fonts */
/*
// <weight>: Use a value from 300 to 700
// <uniquifier>: Use a unique and descriptive class name

.cormorant-garamond-<uniquifier> {
  font-family: "Cormorant Garamond", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
*/



/* SP用記述*/
.br4pc { display: none; }
.forPC { display: none; }

/* ロゴ関連 */
.logo_area.hrzntl,
.logo_area.hrzntl > a {
	display: flex;
	justify-content: center;
	align-items: center;
}
.logo_area .cross { position: relative; }
.logo_area .cross::before,
.logo_area .cross::after {
	content: "";
	display: block;
	height: 1px;
	background-color: #fff;
	position: absolute;
	left: 50%;
	top: 50%;
	width: 133%;
}
.logo_area .cross::before { transform: translate(-50%, -50%) rotate(45deg); }
.logo_area .cross::after { transform: translate(-50%, -50%) rotate(-45deg); }
/* ドロワー内 */
nav.drawer .logo_area.hrzntl { column-gap: 16px; }
nav.drawer .logo_area.hrzntl .eureka { width: 130px; }
nav.drawer .logo_area.hrzntl .cross {
	width: 21px;
	height: 21px;
}
nav.drawer .logo_area.hrzntl .kentex { width: 120px; }



/* ハンバーガーボタン */
p.hamburger {
	width: 85px;
	height: 85px;
	position: fixed;
	z-index: 500;
	left: 0;
	top: 0;
	overflow: hidden;
}
@keyframes hmbgApr {
	0% { top: -85px; }
	100% { top: 0; }
}
p.hamburger::before {
	content: "";
	display: block;
	width: 120px;
	height: 120px;
	background-color: #7ce100;
	position: absolute;
	left: 0;
	top: 0;
	transform: translate(-50%, -50%) rotate(45deg);
}
p.hamburger span {
	display: block;
	height: 1px;
	left: 12px;
	background-color: #fff;
	position: absolute;
	transition: all .4s ease;
}
p.hamburger span:first-child {
	top:20px;
	width: 36px
}
p.hamburger span:nth-child(2) {
	top:28px;
	width: 28px
}
p.hamburger span:nth-child(3) {
	top:36px;
	width: 20px
}

p.hamburger.close span:first-child,
p.hamburger.close span:nth-child(2),
p.hamburger.close span:nth-child(3) {
	top: 28px;
	width: 28px
}
p.hamburger.close span:first-child { transform: rotate(45deg); }
p.hamburger.close span:nth-child(2) { transform: rotate(-45deg); }
p.hamburger.close span:nth-child(3) { transform: rotate(-45deg); opacity: 0; }

/* ドロワー */
nav.drawer {
	background-color: rgba(0, 0, 0, .9);
	width: 100%;
	height: 100%;
	top: -100%;
	left: 0;
	position: fixed;
	z-index: 400;
	padding: 60px 0;
	box-sizing: border-box;
	overflow: auto;
	transition: all .5s ease;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
}
nav.drawer.open { top: 0; }
nav.drawer ul.main_nav { margin-top: 48px; }
nav.drawer ul.main_nav li { margin-top: 12px; }
nav.drawer ul.main_nav li a {
	display: block;
	color: #7ce100;
	text-decoration: none;
	font-family: "Cormorant Garamond", serif;
	font-weight: 700;
	font-size: 24px;
	padding: 10px;
}
nav.drawer .order_btn_area { margin-top: 40px; }
nav.drawer .order_btn_area .cap {
	color: #fff;
	font-size: 14px;
}
nav.drawer .order_btn_area a {
	margin-top: 12px;
	display: inline-block;
	border: solid 1px #fff;
	color: #fff;
	text-decoration: none;
	font-family: "Cormorant Garamond", serif;
	font-weight: 700;
	font-size: 25px;
	padding: 8px 60px;
}



/* PageUpボタン */
.pageup {
	position: fixed;
	right: 10px;
	bottom: 10px;
	width: 100px;
	z-index: 200;
	transition: .3s;
	transform: translate(0, 108px);
}
.pageup.show {
	transform: translate(0, 0);
}
.pageup a { display: block; }



/* タイトル・メイン画像 */
.logo_kv {
	min-height: 100dvh;
	transition: .3s;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
}
.logo_kv .logo_area {
	min-height: 46dvh;
	background-color: #000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px 0 0;
}
.logo_kv .logo_area p { margin: 0 auto; }
.logo_kv .logo_area p.eureka,
.logo_kv .logo_area p.kentex {
	width: 61.8vw;
	max-width: 240px;
}
.logo_kv .logo_area p.cross {
	margin: 20px auto 24px;
	width: 34px;
	height: 34px;
}
.logo_kv .kv {
	min-height: 54dvh;
	background: url(../images/main.jpg) center center / cover no-repeat;
}

/* 言語切替ボタン */
p.langbtn {
	position: fixed;
	z-index: 500;
	right: 10px;
	top: 12px;
}
p.langbtn a {
	display: block;
	border: solid 1px #7ce100;
	color: #7ce100;
	background-color: rgba(0, 0, 0, .3);
	text-decoration: none;
	font-family: "Cormorant Garamond", serif;
	font-weight: 700;
	font-size: 14px;
	padding: 5px 21px 5px 12px;
	position: relative;
}
p.langbtn a::before { 
	content: "";
	display: block;
	position: absolute;
	right: 7px;
	top: 50%;
	transform: translate(0, -50%);
	width: 7px;
	height: 10px;
	background: url(../images/icon_arrow.svg) center center / contain no-repeat;
}
p.langbtn.eng a {
	font-family: sans-serif;
	font-size: 13px;
	padding: 6px 21px 4px 12px;
}


/* コンテンツ部 */
main {
	padding-top: 100dvh;
	position: relative;
}
.wrapper { padding: 0 4vw; }
.txt_green_shadow {
	text-shadow: 0px 1px 8px rgba(124, 225, 0, .6), 1px 0px 8px rgba(124, 225, 0, .6), 0px -1px 8px rgba(124, 225, 0, .6), -1px 0px 8px rgba(124, 225, 0, .6), 1px 1px 8px rgba(124, 225, 0, .6), 1px -1px 8px rgba(124, 225, 0, .6), -1px 1px 8px rgba(124, 225, 0, .6), -1px -1px 8px rgba(124, 225, 0, .6);
}
.panel {
	margin: 0 4vw;
	padding: 24px 20px 16px;
	backdrop-filter: blur(20px);
	background-color: rgba(0, 0, 0, 0.1);
	border: 1px solid rgba(124, 225, 0, 1);
	border-radius: 6px;
	box-shadow: 0px 0px 3px 3px rgba(124, 225, 0, .4) inset;
	color: #fff;
}
.panel .ttl {
	font-size: 24px;
	line-height: 1.3;
	font-weight: 700;
	text-align: center;
}
.panel .txt { line-height: 1.6; }
.panel .ttl + .txt { margin-top: 18px; }
.panel .txt + .txt { margin-top: 12px; }
.panel .txt .txtL {
	font-size: 21px;
	font-weight: 700;
	padding: 0 3px;
}

/* marker */
.panel .txt span {
	line-height: 1.5;
	display: inline-block;
	background-repeat: repeat-x;
	background-size: 200% 100%;
	background-position: 0 1em;
	transition: all 1.6s ease;
	background-image: linear-gradient(to left, #e8355a 50%, transparent 50%);
}
.panel .txt span.marker { background-position-x: -100%; }



/* 注記 */
#about .pic span,
#model .pic span,
#preorder .watch span,
.cont .spec_cont .pic span {
	color: #000;
	margin-top: 8px;
	display: inline-block;
	font-size: 11px;
	line-height: 1.4;
	text-indent: -1.3em;
	text-align: left;
}
#about .pic span,
#model .pic span,
#preorder .watch span.eng {
	text-indent: -0.8em;
}
.cont .spec_cont .pic { position: relative; }
.cont .spec_cont .pic span {
	color: #fff;
	margin-top: 0;
	text-indent: 0;
	width: 100%;
	padding: 2px 5px;
	position: absolute;
	bottom: 0;
	left: 0;
	background-color: rgba(0, 0, 0, .6);
}
.cont .spec_cont .pic span.eng {
	text-indent: -.8em;
	padding-left: calc(5px + .8em);
}


/* About Watch */
#about {
	padding: 9vh 0;
	min-height: 100vh;
	background: url(../images/bg_about_sp.jpg) center bottom / cover no-repeat;
}
#about .panel .ttl {
	font-family: "Cormorant Garamond", serif;
	font-size: 32px;
	font-weight: 500;
	line-height: 1;
}
#about .pic {
	width: 53vw;
	margin: 6.5vh 0 0 auto;
}

/* スペック紹介 */
.bg_fixed .bg {
	min-height: 100vh;
	background: center center / cover no-repeat;
	position: sticky;
	top: 0;
}
.bg_fixed .bg.bg1 { background-image: url(../images/bg_spec_1.jpg) ; }
.bg_fixed .bg.bg2 { background-image: url(../images/bg_spec_2.jpg) ; }
.bg_fixed .wrapper {
	margin-top: -100vh;
	padding-bottom: 60px;
	position: relative;
}

/* NIRVASH type ZERO Model */
#model { padding-top: 60px; }
#model .pic {
	width: 220px;
	margin: 30px auto;
}

/* 各種スペック */
.cont {
	margin-top: 60px;
	padding-top: 40px;
}
.sec_ttl {
	font-family: "Cormorant Garamond", serif;
	font-size: 38px;
	font-weight: 700;
	color: #fff;
	line-height: 1.4;
	text-align: center;
	text-shadow: 0px 1px 8px rgb(232, 53, 90, .6), 1px 0px 8px rgba(232, 53, 90, .6), 0px -1px 8px rgba(232, 53, 90, .6), -1px 0px 8px rgba(232, 53, 90, .6), 1px 1px 8px rgba(232, 53, 90, .6), 1px -1px 8px rgba(232, 53, 90, .6), -1px 1px 8px rgba(232, 53, 90, .6), -1px -1px 8px rgba(232, 53, 90, .6);
	letter-spacing: .05em;
	padding-left: .05em;
}
.cont .sec_ttl + .spec_cont { margin-top: 30px; }
.cont .spec_cont + .spec_cont { margin-top: 60px; }
.cont .spec_cont .panel { margin: 15px 0 0; }

/* スペック表 */
.spec_table_area { margin-top: 80px; }
.spec_table_area .spec_table {
	display: grid;
	grid-template-columns: 98px auto;
	row-gap: 1px;
}
.spec_table_area .spec_table + .spec_table { margin-top: 1px; }
.spec_table_area .spec_table .ttl,
.spec_table_area .spec_table .spec {
	font-size: 13px;
	padding: 4px 8px 2px;
	line-height: 1.3;
}
.spec_table_area .spec_table .ttl {
	background-color: rgba(0, 0, 0, .8);
	color: #fff;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	text-align: right;
}
.spec_table_area .spec_table .spec {
	color: #000;
	background-color: rgba(255, 255, 255, .8);
}



/* プレオーダー */
#preorder { text-align: center; }
#preorder .bg {
	position: sticky;
	top: 0;
	height: 100vh;
	background: url(../images/bg_preorder.jpg) center center / cover no-repeat;
}
#preorder .wrapper {
	padding-top: 60px;
	min-height: calc(100vh - 56px);
	display: flex;
	align-items: center;
	justify-content: center;
}
#preorder .watch {
	padding-left: 20px;
	width: 250px;
	margin: 20px auto 0;
}
#preorder .panel { background-color: rgba(0, 0, 0, .3); }
#preorder .panel.price_bg {
	margin-top: 10px;
	display: inline-block;
	padding: 16px 36px;
  font-weight: 700;
}
#preorder .panel.price_bg .price { font-size: 15px; }
#preorder .panel.price_bg .limited {
	margin-top: 8px;
	font-size: 18px;
}
#preorder .panel.price_bg .price span,
#preorder .panel.price_bg .limited span { margin: 0 5px; }
#preorder .panel.price_bg .price span { font-size: 21px; }
#preorder .panel.price_bg .limited span { font-size: 28px; }
#preorder .dlvry { margin-top: 40px; }
#preorder .dlvry p {
	display: inline-block;
	font-size: 20px;
	color: #fff;
	font-weight: 700;
}
#preorder .panel.btn_area {
	margin: 12px auto 0;
	padding: 20px 15px;
	max-width: 480px;
}
#preorder .panel.btn_area.kentex_only { max-width: 320px; }
#preorder .panel.btn_area .lead { font-size: 18px; }
#preorder .panel.btn_area .btns {
	margin-top: 16px;
	display: flex;
	column-gap: 10px;
}
#preorder .panel.btn_area .btns li { flex: 1; }
#preorder .panel.btn_area .btns li a {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	box-sizing: border-box;
	border-radius: 4px;
	box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}
#preorder .panel.btn_area .btns li.kentex a {
	background-color: #002C5D;
	padding: 16px 20px;
}
#preorder .panel.btn_area .btns li.animate a {
	background-color: #fff;
	padding: 10px;
}
#preorder .panel.btn_area .btns li.yodobashi a {
	background-color: #fff;
	padding: 10px;
}



/* フッタ */
footer.page_foot {
	position: relative;
	color: #fff;
	background-color: #000;
	text-align: center;
}
footer.page_foot ul.sns{
	padding: 16px 0;
	display: flex;
	justify-content: center;
	align-items: center;
	column-gap: 30px;
}
footer.page_foot ul.sns li.instagram { width: 24px; }
footer.page_foot ul.sns li.x { width: 22px; }
footer.page_foot ul.sns li.youtube { width: 34px; }
footer.page_foot ul.sns li a { display: block; }
footer.page_foot .copy_area {
	border-top: 1px solid rgba(255, 255, 255, .6);
	padding: 10px 5px;
}
footer.page_foot .copy {
	font-size: 12px;
	line-height: 1.6;
}



@media only screen and (min-width:960px) {
	/* PC用記述 */
	a[href^="tel:"] { pointer-events: none; }
	a.fade:hover { opacity: .6; }
	
	.br4sp { display: none; }
	.br4pc { display: inline; }
	.forSP { display: none; }
	.forPC { display: block; }


	/* 言語切替ボタン */
	p.langbtn {
		right: 20px;
		top: 20px;
	}
	p.langbtn a {
		font-size: 18px;
		padding: 5px 28px 5px 16px;
	}
	p.langbtn a::before { 
		right: 10px;
		width: 10px;
		height: 14px;
	}
	p.langbtn a:hover { background-color: rgba(255, 255, 255, .2); }
	p.langbtn.eng a {
		font-size: 16px;
		padding: 6px 28px 4px 16px;
	}

	/* PageUpボタン */
	.pageup {
		right: 20px;
		bottom: 10px;
		width: 120px;
		transform: translate(0, 125px);
	}
	.pageup a { transform-origin: 57% 33%; }
	.pageup a:hover {
		transform: translate(20%, 20%) rotate(134deg);
	}

	/* PC用ヘッダ */
	header.forPC {
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		background-color: rgba(0, 0, 0, .9);
		z-index: 100;
		padding: 12px 24px;
		transform: translate(0, -100%);
		transition: .3s;
	}
	header.forPC.show { transform: translate(0, 0); }
	header.forPC .logo_area.hrzntl { display: block; }
		header.forPC .logo_area.hrzntl > a {
		column-gap: 16px;
		justify-content: flex-start;
	}
	header.forPC .logo_area.hrzntl .eureka { width: 120px; }
	header.forPC .logo_area.hrzntl .cross {
		width: 18px;
		height: 18px;
	}
	header.forPC .logo_area.hrzntl .kentex { width: 112px; }



	/* タイトル・メイン画像 */
	.logo_kv { display: flex; }
	.logo_kv .logo_area { width: 32%; }
	.logo_kv .logo_area p.eureka,
	.logo_kv .logo_area p.kentex {
		width: 20vw;
		max-width: 320px;
	}
	.logo_kv .logo_area p.cross {
		margin: 40px auto 48px;
		width: 40px;
		height: 40px;
		}
	.logo_kv .kv { flex: 1; }


	/* コンテンツ部 */
	.wrapper {
		padding: 0 20px;
		max-width: 1200px;
		margin: 0 auto;
	}
	.panel {
		margin: 0;
		padding: 36px 36px 32px;
	}
	.panel .ttl { font-size: 32px; }
	.panel .txt { font-size: 16px; }
	.panel .ttl + .txt { margin-top: 30px; }
	.panel .txt + .txt { margin-top: 18px; }
	.panel .txt .txtL { font-size: 24px; }
	
	
	
	/* 注記 */
	#about .pic span,
	#model .pic span,
	#preorder .watch span,
	.cont .spec_cont .pic span  {
		margin-top: 10px;
		font-size: 12px;
	}
	#about .pic span,
	#model .pic span {
		text-indent: 0;
		white-space: nowrap;
	}
	.cont .spec_cont .pic span { text-align: right; }
	#about .pic span.eng,
	#model .pic span.eng {
		text-indent: -.8em;
		white-space: wrap;
	}
	
	
	
	/* About Watch */
	#about {
		padding: 100px 0 30px 30%;
		background: url(../images/bg_about_pc.jpg) 50% 40% / cover no-repeat;
		display: flex;
		align-items: center;
	}
	#about .wrapper {
		display: flex;
		align-items: center;
		justify-content: flex-start;
	}
	#about .panel .ttl { font-size: 40px; }
	#about .panel {
		order: 1;
		flex: 1;
		max-width: 480px;
		transform: translate(-16px, -20%);
		position: relative;
	}
	#about .pic {
		width: 360px;
		margin: 0;
		position: relative;
		z-index: 1;
	}

	/* ページナビ */
	.page_nav {
		position: fixed;
		left: 0;
		top: 160px;
		backdrop-filter: blur(20px);
		background-color: rgba(0, 0, 0, 0.3);
		z-index: 400;
		transition: .3s;
		transform: translate(-100%, 0);
		padding: 30px 30px;
		border-radius: 0 6px 6px 0;
		border: 1px solid rgba(255, 255, 255, 0.3);
		border-left: none;
	}
	.page_nav.show { transform: translate(0, 0); }
	.page_nav ul li { margin-top: 24px; }
	.page_nav ul li:first-child { margin-top: 0; }
	.page_nav ul li a {
		font-family: "Cormorant Garamond", serif;
		font-weight: 700;
		text-decoration: none;
		color: #fff;
		font-size: 21px;
		letter-spacing: .05em;
	}
	.page_nav ul li a:hover { color: #7ce100; }

	/* ページナビ領域 */
	.pc_nav_area { padding-left: 160px; }

	/* NIRVASH type ZERO Model */
	#model .wrap_pc {
		margin-top: 30px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	#model .pic {
		width: 320px;
		margin: 0;
	}
	#model .panel {
		width: 480px;
		margin-left: 30px;
	}


	/* 各種スペック */
	.cont {
		margin-top: 40px;
		padding-top: 80px;
	}
	.sec_ttl { font-size: 48px; }
	.cont .spec_cont {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.cont .spec_cont .pic { width: 49%; }
	.cont .spec_cont .panel {
		margin: 0;
		width: 49%;
	}
	.cont .spec_cont:nth-child(even) .pic { order: 1; }
	.cont .spec_cont .panel { margin: 0; }

	/* スペック表 */
	.spec_table_area .spec_table {
		margin-top: 36px;
		width: 100%;
		grid-template-columns: 1fr 5fr;
	}
	.spec_table_area .spec_table.clm4 { grid-template-columns: 1fr 2fr 1fr 2fr; }
	.spec_table_area .spec_table .ttl {
		justify-content: center;
		text-align: center;
	}
	.spec_table_area .spec_table .ttl,
	.spec_table_area .spec_table .spec {
		font-size: 15px;
		padding: 8px 20px;
	}



	/* Pre-order */
	#preorder .wrapper {
		padding-top: 80px;
		min-height: 0;
		display: block;
	}
	#preorder .watch {
		padding-left: 30px;
		width: 380px;
	}
	#preorder .panel.price_bg {
		margin-top: 0;
		position: absolute;
		top: 560px;
		left: calc(50% + 150px);
	}
	#preorder .panel.price_bg .price { font-size: 16px; }
	#preorder .panel.price_bg .limited {
		margin-top: 12px;
		font-size: 21px;
	}
	#preorder .panel.price_bg .price span { font-size: 28px; }
	#preorder .panel.price_bg .limited span { font-size: 36px; }
	#preorder .dlvry p { font-size: 24px; }
	#preorder .panel.btn_area {
		margin: 20px auto 0;
		padding: 24px 30px;
		max-width: 640px;
	}
	#preorder .panel.btn_area.kentex_only { max-width: 380px; }
	#preorder .panel.btn_area .lead { font-size: 21px; }
	#preorder .panel.btn_area .btns {
		margin-top: 24px;
		column-gap: 20px;
	}
	#preorder .panel.btn_area .btns li.kentex a { padding: 24px 36px; }
	#preorder .panel.btn_area .btns li.kentex a:hover { background-color: rgba(0, 43, 93, 0.6); }
	#preorder .panel.btn_area .btns li.animate a { padding: 20px; }
	#preorder .panel.btn_area .btns li.animate a:hover { background-color: rgba(255, 255, 255, 0.6); }
	#preorder .panel.btn_area .btns li.yodobashi a { padding: 20px; }
	#preorder .panel.btn_area .btns li.yodobashi a:hover { background-color: rgba(255, 255, 255, 0.6); }


	/* フッタ */
	footer.page_foot ul.sns{
		padding: 20px;
		justify-content: flex-end;
		column-gap: 48px;
	}
	footer.page_foot ul.sns li.instagram { width: 30px; }
	footer.page_foot ul.sns li.x { width: 26px; }
	footer.page_foot ul.sns li.youtube { width: 40px; }
	footer.page_foot .copy_area {
		padding: 100px 20px 10px;
		display: flex;
		justify-content: flex-end;
		column-gap: 12px;
	}

}