@charset "utf-8";

/*reset------------------------------------------------------------------------------------------------------*/

html, body, div, object, iframe, video,
h1, h2, h3, h4, h5, h6, p,
img, b, i, em, a, span,
dl, dt, dd, ol, ul, li,
form, label, input, select, textarea, button,
table, caption, tbody, tfoot, thead, tr, th, td,
main, article, aside, footer, header, nav, section {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	line-height: 1;
	letter-spacing: 0;
	font-weight: 400;
	text-align: left;
	vertical-align: middle;
	background: transparent;
	background-repeat: no-repeat;
	text-decoration: none;
	border-radius: 0;
}
html { font-family: sans-serif; }
body {
	background: #fff;
	min-width: 320px;
}
main, article, aside, footer, header, nav, section,
dl, dt, dd, ol, ul, li { display: block; }
ol, ul { list-style: none; }
table {
	border-collapse: collapse;
	border-spacing: 0;
}
img {
	width: 100%;
	height: auto;
	font-size: 0;
	line-height: 0;
}
img[width="1"] { width: 1px; }
a, span, b, em, i, label {
	color: inherit;
	line-height: inherit;
	font-weight: inherit;
	font-family: inherit;
	letter-spacing: inherit;
	text-decoration: inherit;
	text-align: inherit;
	vertical-align: inherit;
}
textarea { resize: vertical; }
a, th, button { text-align: center; }
h1, h2, h3, h4, h5, h6, p { vertical-align: baseline; }
td { vertical-align: top; }
*, *::before, *::after { box-sizing: border-box; }
h1, h2, h3, h4, h5, h6 { line-height: 1.1; }
button, input { line-height: 1.2; }
p, li, th, td, dt, dd, textarea { line-height: 1.5; }

/*scroll bar*/
::-webkit-scrollbar { width: 12px; }
::-webkit-scrollbar-track {
	background: #fff;
	border-left: solid 1px #ececec;
}
::-webkit-scrollbar-thumb {
	background: #ccc;
	border-radius: 12px;
}

/*common------------------------------------------------------------------------------------------------------*/

/*link button*/
a, button, input[type="submit"], .btn {
	cursor: pointer;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	transition: opacity 0.25s, transform 0.05s;
}
a:active, button:active, input[type="submit"]:active, .btn:active { opacity: 0.5; }
button:active, input[type="submit"]:active, .btn:active { transform: scale(0.9); }
@media (min-width: 769px){
	a:hover, button:hover, input[type="submit"]:hover, .btn:hover, .pc_btn:hover { opacity: 0.5; }
	.pc_btn {
		cursor: pointer;
		-webkit-tap-highlight-color: rgba(0,0,0,0);
		transition: opacity 0.25s, transform 0.05s;
	}
	.pc_btn:active {
		opacity: 0.5;
		transform: scale(0.9);
	}
}
@media (max-width: 768px){
	.sp_btn {
		cursor: pointer;
		-webkit-tap-highlight-color: rgba(0,0,0,0);
		transition: opacity 0.25s, transform 0.05s;
	}
	.sp_btn:active {
		opacity: 0.5;
		transform: scale(0.9);
	}
}

/*display none*/
@media (min-width: 769px){
	.pc_no { display: none; }
}
@media (max-width: 768px){
	.sp_no { display: none; }
}

/*float*/
.clearfix::after {
	content: "";
	height: 0;
	display: block;
	clear: both;
}
.flt-l { float: left; }
.flt-r { float: right; }
@media (min-width: 769px){
	.pc_flt-l { float: left; }
	.pc_flt-r { float: right; }
}
@media (max-width: 768px){
	.sp_flt-l { float: left; }
	.sp_flt-r { float: right; }
}

/*list*/
.list-maru li, .list-ten li, .list-kome li {
	position: relative;
	padding-left: 1.3em;
}
.list-maru li::before, .list-ten li::before, .list-kome li::before {
	position: absolute;
	top: 0;
	left: 0;
}
.list-maru li::before { content: "\25CF"; } /*●*/
.list-ten li::before { content: "\30FB"; } /*・*/
.list-kome li::before { content: "\203B"; } /*※*/

/*lazyload*/
.lazyload { opacity: 0; }
.lazyloaded {
	opacity: 1;
	transition: opacity 0.75s, transform 0.75s;
}

/*scroll fade in*/
.fade {
	opacity: 0;
	transform: translateY(20px);
}
.faded {
	opacity: 1;
	transform: none;
	transition: opacity 0.75s, transform 0.75s;
}

/*accordion box*/
@media (min-width: 769px){
	.sp_acc-box { display: block !important; }
}
@media (max-width: 768px){
	.sp_acc-box {
		display: none;
		opacity: 0;
		transition: opacity 0.5s;
	}
	.sp_acc-box.sp_active { opacity: 1; }
}

/*background blur box*/
.bg-blur {
	width: 100%;
	height: 100%;
	position: absolute;
	overflow: hidden;
	top: 0;
	left: 0;
	z-index: -1;
}
.bg-blur img {
	width: calc(100% + 5vw);
	height: calc(100% + 5vw);
	object-fit: cover;
	filter: blur(10px);
	position: absolute;
	top: -2.5vw;
	left: -2.5vw;
}


/*base------------------------------------------------------------------------------------------------------*/

html {
	font-size: 18px;
	color: #555;
}
body { padding: 100px 0; }
@media (max-width: 768px){
	html { font-size: 15px; }
	body { padding: 100px 0; }
}

/*z-index------------------------------------------------------------------------------------------------------*/

.header { z-index: 40; }
.footer { z-index: 40; }
.nav { z-index: 60; }
.nav-sheet { z-index: 0; }
.back { z-index: 80; }
@media (max-width: 768px){
	.header { z-index: 40; }
	.footer { z-index: 40; }
	.nav { z-index: 100; }
	.nav-sheet { z-index: 80; }
	.back { z-index: 60; }
}

/*back------------------------------------------------------------------------------------------------------*/

.back {
	position: fixed;
	display: block;
	width: 96px;
	height: 96px;
	bottom: calc(112px + 20px);
	right: 20px;
}
@media (max-width: 768px){
	.back {
		width: 14vmin;
		height: 14vmin;
		bottom: calc(33vw + 3.5vmin);
		right: 3.5vmin;
	}
}

/*nav-sheet------------------------------------------------------------------------------------------------------*/

.nav-sheet { display: none; }
@media (max-width: 768px){
	.nav-sheet {
		width: 100%;
		height: 200%;
		position: fixed;
		display: block;
		opacity: 0;
		background: rgba(255,255,255,0.5);
		-webkit-backdrop-filter: blur(15px);
		backdrop-filter: blur(15px);
		top: -50%;
		left: 100%;
		transition: opacity 0.25s;
	}
	.nav-sheet:hover { cursor: pointer; }
	.nav-sheet.sp_active {
		opacity: 1;
		left: 0;
	}
}

/*wrap------------------------------------------------------------------------------------------------------*/

.wrap {
	margin-left: auto;
	margin-right: auto;
	width: calc(100% - (20px * 2));
}
.wrap-max { width: 100%; }
.mw-1300 { max-width: 1300px; }
.mw-1200 { max-width: 1200px; }
@media (max-width: 768px){
	.wrap { width: calc(100% - (3.5vmin * 2)); }
}

/*layout------------------------------------------------------------------------------------------------------*/

/*title------------------------------------------------------------------------------------------------------*/

/*header------------------------------------------------------------------------------------------------------*/

.header {}
@media (max-width: 768px){
	.header {}
}

/*footer------------------------------------------------------------------------------------------------------*/

.footer {}
@media (max-width: 768px){
	.footer {}
}

/*fv------------------------------------------------------------------------------------------------------*/

.fv {}
@media (max-width: 768px){
	.fv {}
}

/*nav------------------------------------------------------------------------------------------------------*/

.nav {}
@media (max-width: 768px){
	.nav {
		background: #00c;
		width: 640px;
		height: 100%;
		opacity: 0;
		position: fixed;
		overflow-y: auto;
		top: 0;
		right: -640px;
		transition: right 0.25s cubic-bezier(0,1,0,1), opacity 0.25s cubic-bezier(0,1,0,1);
	}
	.nav.sp_active {
		opacity: 1;
		right: -320px;
	}
}

/*copy------------------------------------------------------------------------------------------------------*/

.copy {
	background: #e4276e;
	color: #fff;
	text-align: center;
	font-size: 15px;
	line-height: 32px;
}
@media (max-width: 768px){
	.copy {
		font-size: 12px;
		line-height: 24px;
	}
}

/*sec------------------------------------------------------------------------------------------------------*/