@charset "utf-8";
/*-----------------------------------------------
 * common.css
 * レスポンシブは基本スタイルを引き継ぐ（PCファースト）
 * @media screen and (max-width:767px)
-------------------------------------------------*/
/*-----------------------------------------------
 * Reset, root
 * Bace
 * Header
 * Footer
 * Modal
 * Parts
 * Scroll animation
-------------------------------------------------*/
/*-----------------------------------------------
 * Reset, root
-------------------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,p,h1,h2,h3,h4,h5,h6,th,td,pre,code,blockquote,form,fieldset,legend,input,textarea,figcaption,figure{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal}li{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}input,textarea,select{*font-size:100%}legend{color:#FFF}hr{display:none}img{vertical-align:bottom}select,input,button,textarea{font-size:99%}table{font-size:inherit;font:100%;border-collapse:collapse;border-spacing:0}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%}.hd{display:block;width:0;height:0;overflow:hidden}.cf:before,.cf:after{content:"";display:table}.cf:after{clear:both}.cf{*zoom:1}article,aside,details,figcaption,figure,footer,header,hgroup,hr,menu,nav,section,main{display:block}*{margin:0;padding:0;box-sizing:border-box;max-height:999999px;outline:none;}*:focus{outline: none;}button{background-color:transparent;border:none;cursor:pointer;outline:none;padding:0;}

:root {
	--common-min-width: 1200px;
	--common-min-height: 640px;

	--common-in-width: 60%;
	--common-in-maxwidth: 1400px;

	/* メインで使用するサイズやカラー */
	--main-font-size: 16px;
	--main-font-family: "source-han-serif-japanese",'Noto Serif JP', "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;

	--font-en: bomboniere, sans-serif;
	/* color */
	--color-gold: 184,144,113;
	--color-gold-dark: 133,83,44;
	--color-gray: 33,33,33;
	--color-red: 149,42,42;
	--color-blue: 44,96,158;
	--color-green: 17,112,26;
	--color-vio: 127,67,137;

	--color-main: 255,255,255;
	--color-sub: 131,247,118;


	/* easing */
	--easing-outquart: cubic-bezier(0.25, 1, 0.5, 1);

	/* vw min 計算 => min(calc(数値 / var(--vw-min) * 100vw), 数値); */
	--vw-min: 1200;
}
@media screen and (max-width:767px){
	:root {
		--common-min-width: 100%;
		--common-min-height: auto;
		--common-in-width: 100%;
		--common-in-maxwidth: 100%;
		--main-font-size: 12px;

		/* vw min 計算 => min(calc(数値 / var(--vw-min) * 100vw), 数値); */
		--vw-min: 750;
	}
}


/*-----------------------------------------------
 * Bace
-------------------------------------------------*/
body{
	-webkit-text-size-adjust: 100%;
	background-color: #000;
	color: #fff;
	font-family: var(--main-font-family);
	font-size: var(--main-font-size);
	font-weight: normal;
	letter-spacing: 0.07em;
	line-height: 1.8;
	word-wrap: break-word;
}
.pc{ display: block; }
.sp{ display: none; }
a{ color: #222; }
a:hover{ text-decoration: none; }
.ah { transition: opacity .3s ease; }
.ah:hover { opacity: .7; }
::selection{
	background: #B7D4F9;
	color: #000;
}
::-moz-selection{
	background: #B7D4F9;
	color: #000;
}
@media screen and (max-width:767px){
	.sp{ display: block; }
	.pc{ display: none; }
	.ah:hover { opacity: 1; }
}

/* scroll bar */
 ::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: #000;
}
::-webkit-scrollbar-thumb {
    background: rgb(var(--color-main));
    margin: 2px;
    box-shadow: none;
}

/* font */
.font-Bellefair { font-family: 'Bellefair', serif; }
.font-e { font-family: var(--font-en) }

/* 平体*/
.font-wide {
	/* width: 95.239%; 
	letter-spacing: 0.2em;
	transform: scale(1.2, 1);
	transform-origin: left;*/
}

/* scroll animation */
.ani-blur {
	-webkit-filter: blur(15px);
	-moz-filter: blur(15px);
	filter: blur(15px);
	opacity: 0;
	transition: all .7s ease-in-out;
}
.ani-blur.is-ani {
	-webkit-filter: blur(0);
	-moz-filter: blur(0);
	filter: blur(0);
	opacity: 1;
}

/* fullWrap */
#fullWrap {
	display: flex;
	flex-direction: column;
	min-width: var(--common-min-width);
	min-height: 100vh;
	position: relative;
	z-index: 1;
}

/* sub loading */
.subLoading {
	background-color: #000;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 9999;
}

.contentsWrap{
	position: relative;
}
/*-----------------------------------------------
 * Header
-------------------------------------------------*/
.header {
	width: 100%;
	pointer-events: none;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	z-index: 999;
}
@media screen and (max-width:767px){
	.header {
		position: fixed;
		height: auto;
	}
}

/* inner */
.header__inner {
	width:280px;
	pointer-events: all;
	height: 100vh;
	position: sticky;
	left: 0;
	top: 0;
}
@media screen and (max-width:767px){
	.header {
		pointer-events: none;
	}
	.header.is-active {
		pointer-events: auto;
	}
	.header__inner {
		-webkit-backdrop-filter: blur(8px);
		backdrop-filter: blur(8px);
		background-color: rgba(0,0,0,.75);
		-webkit-overflow-scrolling: touch;
		width: 100%;
		height: 100%;
		overflow-y: auto;
		overscroll-behavior: contain;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1;
	}
}

/**
 * headerNav
 */
.headerNav,
.headerNav__inner {
	width: 100%;
	height: 100%;
}
.headerNav__cont {
	display: flex;
	flex-direction: column;
	height: 100vh;
	min-height: var(--common-min-height);
}
@media screen and (max-width:767px){
	.headerNav {
		height: calc(100% + 1px);
		position: relative;
	}
	.headerNav__inner {
		display: flex;
		align-items: center;
		justify-content: center;
		height: auto;
		min-height: 100%;
		margin: 0 auto;
		position: relative;
	}
	.headerNav__cont {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: auto;
		margin: 60px 0;
		position: relative;
	}
}

/* title */
.headerNav__title {
	width: 158px;
	margin-top: 30px;
	margin-bottom: 40px;
	margin-left: 40px;
	pointer-events: auto;
}
.headerNav__title img {
	width: 100%;
}
@media screen and (max-width:767px){
	.headerNav__title {
		width: calc(340 / var(--vw-min) * 100vw);
		margin-top: 0;
		margin-bottom: 40px;
		margin-left: auto;
		margin-right: auto;
	}
}

/**
 * headerNavLists
 */
.headerNavLists {
	width: 250px;
	margin-top: auto;
	margin-bottom: 40px;
	pointer-events: auto;
}
.headerNavLists__item {
	display: table;
}
.headerNavLists__item:not(:first-child) {
	margin-top: 14px;
}
@media screen and (max-width:767px){
	.headerNavLists {
		width: 100%;
		margin-bottom: 0;
	}
	.headerNavLists__item {
		display: block;
	}
	.headerNavLists__item:not(:first-child) {
		margin-top: calc(30 / var(--vw-min) * 100vw);
	}
}

/* a */
.headerNavLists__item a {
	color: rgb(var(--color-main));
	display: table;
	font-size: 18px;
	line-height: 1;
	padding-left: 40px;
	position: relative;
	text-decoration: none;
}
.headerNavLists__item > a > span {
	display: inline-block;
	position: relative;
	z-index: 1;
}
.headerNavLists__item.is-portal > a > span {
	display: inline-flex;
	align-items: center;
}
.headerNavLists__item.is-portal > a > span:after {
	content: "";
	background-color: rgb(var(--color-main));
	-webkit-mask: url(../img/common/icon/icon_blank.svg) no-repeat center / contain;
	mask: url(../img/common/icon/icon_blank.svg) no-repeat center bottom 30% / contain;
    width: 11px;
    height: 24px;
    margin-left: 8px;
}
@media screen and (max-width:767px){
	.headerNavLists__item > a {
		font-size: calc(38 / var(--vw-min) * 100vw);
		width: 100%;
		padding-left: 0;
		text-align: center;
	}
	.headerNavLists__item > a > span {
		transform-origin: center;
	}
	.headerNavLists__item.is-portal > a > span:after {
		width: calc(22 / var(--vw-min) * 100vw);
		height: calc(38 / var(--vw-min) * 100vw);
		margin-left: calc(16 / var(--vw-min) * 100vw);
	}
}

/**
 * share
 */
.header__shareListsArea {
	display: flex;
	align-items: center;
	position: absolute;
	right: 32px;
	bottom: 32px;
	pointer-events: auto;
}
.header__shareListsArea > dt {
	font-size: 15px;
	line-height: 1;
	margin-right: 16px;
}
@media screen and (max-width:767px){
	.header__shareListsArea {
		position: relative;
		right: inherit;
		bottom: inherit;
		margin-top: 40px;
	}
}

/* lists */
.header__shareLists {
	display: flex;
}
.header__shareLists > li {
	width: 30px;
    height: 30px;
}
.header__shareLists > li:not(:first-child) {
	margin-left: 6px;
}
.header__shareLists > li > a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	position: relative;
	text-decoration: none;
}

.header__shareLists > li > a:before {
	content: "";
	background-color: #fff;
	display: block;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
	transition: background-color .4s ease;
}

/* icon */
.header__shareLists > li.is-x > a:before {
	width: 18px;
	height: 18px;
	-webkit-mask-image: url(../img/common/sns/icon_x.svg);
	mask-image: url(../img/common/sns/icon_x.svg);
}
.header__shareLists > li.is-facebook > a:before {
	width: 20px;
	height: 20px;
	-webkit-mask-image: url(../img/common/sns/icon_fb.svg);
	mask-image: url(../img/common/sns/icon_fb.svg);
}
.header__shareLists > li.is-line > a:before {
	width: 20px;
	height: 21px;
	-webkit-mask-image: url(../img/common/sns/icon_line.svg);
	mask-image: url(../img/common/sns/icon_line.svg);
}

/**
 * snsLink
 */
.header__snsLink {
	display: flex;
	align-items: center;
	position: absolute;
	right: 40px;
	top: 40px;
	pointer-events: auto;
}
.header__snsLink.is-sponly {
	display: none;
}
.header__snsLink > dt {
	color: rgb(var(--color-main));
	font-size: 15px;
	line-height: 1;
	margin-right: 28px;
}
.header__snsLink > dd {
	flex: none;
	width: 50px;
    height: 50px;
}
@media screen and (max-width:767px){
	.header__snsLink {
		display: none;
	}
	.header__snsLink.is-sponly {
		display: flex;
	}
	.header__snsLink {
		position: fixed;
		right: auto;
		top: auto;
		left: 10px;
		bottom: 10px;
		z-index: 10;
		opacity: 0;
		pointer-events: none;
		transition: opacity .4s ease;
	}
	.header.is-active .header__snsLink {
		opacity: 1;
		pointer-events: auto;
	}
}

/* a */
.header__snsLink > dd > a {
	border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .2);
	display: block;
    width: 100%;
    height: 100%;
	position: relative;
}
.header__snsLink > dd > a:before {
	content: "";
    background-color: rgb(var(--color-main));
    display: block;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
	width: 16px;
    height: 16px;
    -webkit-mask-image: url(../img/common/sns/icon_x.svg);
    mask-image: url(../img/common/sns/icon_x.svg);
	margin: auto;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

/* svg */
.header__snsLink > dd > a svg {
    margin-top: -1px;
    margin-left: -1px;
    transform: rotate(-90deg);
}
.header__snsLink > dd > a svg circle {
    fill: transparent;
    stroke: rgb(var(--color-main));
    stroke-width: 1;
    animation: bCircle-out .8s forwards;
}
.header__snsLink > dd > a:hover svg circle {
    animation: bCircle .8s forwards;
}
@keyframes bCircle {
    0% {
        stroke-dasharray: 0 157; /*-- 円の直径(50)x3.14 --*/
    }
    26% {
        stroke-dasharray: 0 157;
    }
    100% {
        stroke-dasharray: 157 157;
    }
}
@keyframes bCircle-out {
    0% {
        stroke-dasharray: 157 157; /*-- 円の直径(50)x3.14 --*/
    }
    26% {
        stroke-dasharray: 157 157;
    }
    100% {
        stroke-dasharray: 0 157;
    }
}

/**
 * navBtn
 */
@media screen and (max-width:767px){
	.header__navBtnWrap {
		background-color: #000;
		border: 1px solid rgb(var(--color-main));
		border-radius: 50%;
		width: 54px;
		height: 54px;
		overflow: hidden;
		position: absolute;
		top: 10px;
		right: 10px;
		z-index: 2;
		pointer-events: all;
	}
	.header__navBtnWrap:before {
		content: "";
		border: 1px solid rgb(var(--color-main));
		border-radius: 50%;
		width: calc(100% - 6px);
		height: calc(100% - 6px);
		margin: auto;
		pointer-events: none;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
	}
	.header__navBtn {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		width: 100%;
		height: 100%;
		position: relative;
		text-decoration: none;
	}
	.header__navBtn__lineWrap {
		width: 30px;
		height: 10px;
		position: relative;
	}
	.header__navBtn--line {
		mask: url(../img/common/new_deco/menu_line.svg) no-repeat center / contain;
		background-color: #FFF;
		display: block;
		width: 100%;
		height: 3px;
		margin: auto;
		position: absolute;
	}
	.header__navBtn--line:nth-child(1) {
		top: 0;
	}
	.header__navBtn--line:nth-child(2) {
		bottom: 0;
	}
	.header__navBtn:after {
		content: "MENU";
		color: rgb(var(--color-main));
		font-family: mrs-eaves-roman-petite-caps, serif;
		font-size: 10px;
		line-height: 1;
		margin-top: 3px;
	}
}

/* hover */
.headerNavLists__item > a {
	transition: color .4s ease;
}
.headerNavLists__item > a:is(:hover, .is-active) {
	color: #000;
}
.headerNavLists__item > a:before {
	content: "";
	background-color: rgb(var(--color-sub));
	width: 0;
	height: 18px;
	margin: auto;
	position: absolute;
	top: 1px;
	bottom: 0;
	left: 0;
	transition: width .4s var(--easing-outquart);
}
.headerNavLists__item > a:is(:hover, .is-active):before {
	width: 118%;
}
.headerNavLists__item.is-portal > a > span:after {
	transition: background-color .3s ease;
}
.headerNavLists__item.is-portal > a:is(:hover, .is-active) > span:after {
	background-color: #000;
}

/* active */
@media screen and (max-width:767px){
	.header__inner {
		transform: translateX(100%);
		transition: transform .5s var(--easing-outquart);
	}
	.header.is-active .header__inner {
		transform: translateX(0);
	}
	.header__navBtn--line {
		transition: transform .3s ease,
					opacity .3s ease;
	}
	.header__navBtn.is-active .header__navBtn--line:nth-child(1) {
		transform: rotate(24deg);
		top: 2px;
	}
	.header__navBtn.is-active .header__navBtn--line:nth-child(2) {
		transform: rotate(-24deg);
		bottom: 5px;
	}

	.header__navBtn.is-active:after {
		content: "CLOSE";
	}

	.headerNavLists__item > a:before {
		height: calc(38 / var(--vw-min) * 100vw);
	}
	.headerNavLists__item > a:is(:hover, .is-active):before {
		width: 100%;
	}
}

/*-----------------------------------------------
 * Footer
-------------------------------------------------*/
.footer {
	padding-bottom: 100px;
	background-color: #000;
	overflow: hidden;
	position: relative;
}
@media screen and (max-width:767px){
	.footer {
		padding-top: calc(48 / var(--vw-min) * 100vw);
		padding-bottom: calc(144 / var(--vw-min) * 100vw);
	}
}

/* emLists */
.footerEmLists {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: var(--common-in-width);
	max-width: var(--common-in-maxwidth);
	margin: 0 auto;
}
.footerEmLists > li {
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	width: 108px;
	height: 128px;
}
@media screen and (max-width:767px){
	.footerEmLists {
		padding: 0 calc(64 / var(--vw-min) * 100vw);
	}
	.footerEmLists > li {
		width: calc(108 / var(--vw-min) * 100vw);
		height: calc(127 / var(--vw-min) * 100vw);
	}
}

.footerEmLists > li:nth-child(1) { background-image: url(../img/common/logo/em_1.png); }
.footerEmLists > li:nth-child(2) { background-image: url(../img/common/logo/em_2.png); }
.footerEmLists > li:nth-child(3) { background-image: url(../img/common/logo/em_3.png); }
.footerEmLists > li:nth-child(4) { background-image: url(../img/common/logo/em_4.png); }

/* slide */
.footer__slide {
	width: 100%;
    height: 102px;
    overflow: hidden;
	position: relative;
	margin-top: 50px;
}
.footer__slide:before,
.footer__slide:after {
	content: "";
	background: rgb(0,0,0);
	width: 25%;
	height: 100%;
	position: absolute;
	top: 0;
	z-index: 2;
}
.footer__slide:before { background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); left: 0; }
.footer__slide:after { background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); right: 0; }
@media screen and (max-width:767px){
	.footer__slide {
		height: calc(100 / var(--vw-min) * 100vw);
		margin-top: calc(60 / var(--vw-min) * 100vw);
	}
}
.footer__slide > div {
	background-image: url(../img/common/new_deco/deco_text_bb.svg);
	background-repeat: repeat-x;
    background-position: 0 0;
    background-size: auto;
	width: 100%;
	height: 100%;
	animation: slideani_1 40s linear infinite;
}
@keyframes slideani_1 {
	from { background-position: 1763px 0; }
	to   { background-position: 0 0; }
}
@media screen and (max-width:767px){
	.footer__slide > div {
		background-size: cover;
	}
}

/* pagetop */
.footer__pagetop {
	width: 40px;
	height: 140px;
	margin: 50px auto;
}
@media screen and (max-width:767px){
	.footer__pagetop {
		width: calc(60 / var(--vw-min) * 100vw);
		height: calc(200 / var(--vw-min) * 100vw);
		margin: calc(60 / var(--vw-min) * 100vw) auto;
	}
}

.footer__pagetop > a {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
}
.footer__pagetop > a:before,
.footer__pagetop > a:after {
	content: "";
	background: rgb(0,0,0);
	width: 100%;
	height: 50%;
	position: absolute;
	z-index: 2;
}
.footer__pagetop > a:before { background: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); top: 0; }
.footer__pagetop > a:after { background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); bottom: 0; }
.footer__pagetop > a > span {
	background-color: rgb(var(--color-main));
	display: block;
	width: 1px;
	height: 100%;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}
.footer__pagetop > a > span:before {
	content: "";
	background-color: rgb(var(--color-main));
	-webkit-mask: url(../img/common/icon/icon_arrow_top.svg) no-repeat center / contain;
	mask: url(../img/common/icon/icon_arrow_top.svg) no-repeat center / contain;
	width: 22px;
	height: 12px;
	margin: auto;
	position: absolute;
	bottom: 0;
	right: 0;
	left: -10px;
	z-index: 2;
	animation: recirclemove 1.6s ease-in-out infinite,
				recirlemovehide 1.6s ease-out infinite;
}
@media screen and (max-width:767px){
	.footer__pagetop > a > span:before {
		width: calc(28 / var(--vw-min) * 100vw);
		height: calc(18 / var(--vw-min) * 100vw);
		left: -1.7vw;
	}
}

@keyframes recirclemove{
	0%{bottom:20%;}
   100%{bottom:80%;}
}
@keyframes recirlemovehide{
	0%{opacity:0}
   50%{opacity:1;}
  80%{opacity:0.9;}
  100%{opacity:0;}
}

/**
 * footerBnrLists
 */
.footerBnrLists {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 760px;
	margin: 0 auto 60px;
}
@media screen and (max-width:767px){
	.footerBnrLists {
		width: calc(620 / var(--vw-min) * 100vw);
		margin: 0 auto calc(60 / var(--vw-min) * 100vw);
	}
}

/* li */
.footerBnrLists > li {
	width: 240px;
}
.footerBnrLists > li:nth-child(n + 4) {
	margin-top: 20px;
}
.footerBnrLists > li:not(:nth-child(3n + 1)) {
	margin-left: 20px;
}
.footerBnrLists > li img {
	width: 100%;
}
@media screen and (max-width:767px){
	.footerBnrLists > li {
		width: calc((100% - calc(20 / var(--vw-min) * 100vw)) / 2);
	}
	.footerBnrLists > li:nth-child(n + 4) {
		margin-top: 0;
	}
	.footerBnrLists > li:nth-child(n + 3) {
		margin-top: calc(20 / var(--vw-min) * 100vw);
	}
	.footerBnrLists > li:not(:nth-child(3n + 1)) {
		margin-left: 0;
	}
	.footerBnrLists > li:not(:nth-child(2n + 1)) {
		margin-left: calc(20 / var(--vw-min) * 100vw);
	}
}

/**
 * footerLinkLists
 */
 .footerLinkLists {
	display: flex;
	align-items: center;
	justify-content: center;
}
.footerLinkLists > li {
	position: relative;
}
.footerLinkLists > li:not(:first-child) {
	margin-left: 1em;
	padding-left: 1em;
}
.footerLinkLists > li:not(:first-child):before {
	content: '';
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 1px;
	height: .8em;
	background: rgba(255,255,255,.4);
}
.footerLinkLists > li a {
	color: #fff;
	font-size: 18px;
	line-height: 2;
	text-decoration: none;
	white-space: nowrap;
}
@media screen and (max-width:767px){
	.footerLinkLists {
		justify-content: center;
		margin-top: calc(80 / var(--vw-min) * 100vw);
	}
	.footerLinkLists > li a {
		font-size: calc(26 / var(--vw-min) * 100vw);
	}
}

/* caution */
.footer__caution {
	color: #fff;
	font-size: 12px;
	letter-spacing: 0;
	opacity: .4;
	margin-top: 60px;
	text-align: center;
}
.footer__copyright {
	color: #fff;
	display: block;
	font-size: 12px;
	letter-spacing: 0.1em;
	opacity: .4;
	margin-top: 20px;
	text-align: center;
}
@media screen and (max-width:767px){
	.footer__caution {
		font-size: calc(20 / var(--vw-min) * 100vw);
		margin-top: calc(80 / var(--vw-min) * 100vw);
	}
	.footer__copyright {
		font-size: calc(20 / var(--vw-min) * 100vw);
		margin-top: 2em;
	}
}


.bg_txt_top{
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: max(calc(-118 / var(--vw-min)* 100vw), -118px);
    height: min(calc(236 / var(--vw-min)* 100vw), 236px);
    background: url(../img/common/deco/deco_bg_txt.svg) repeat 0 0 / auto 100%;
    clip-path: inset(0);
    z-index: 10;
    animation: bg_decotext 80s linear infinite;
	opacity: .2;
}
.bg_txt_btm {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: max(calc(-118 / var(--vw-min)* 100vw), -118px);
    height: min(calc(236 / var(--vw-min)* 100vw), 236px);
    background: url(../img/common/deco/deco_bg_txt.svg) repeat 0 0 / auto 100%;
    clip-path: inset(0);
    z-index: 10;
    animation: bg_decotext 80s linear infinite reverse;
	opacity: .2;
}
.footer__grd{
	pointer-events: none;
	display: block;
	width: 100%;
	height: 100%;
	left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
	z-index: 11;
	background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 90%, rgba(0, 0, 0, 1) 100%);
}
@media screen and (max-width:767px){
	.bg_txt_top{
		top: max(calc(-68 / var(--vw-min)* 100vw), -68px);
		height: min(calc(136 / var(--vw-min)* 100vw), 136px);
		background: url(../img/common/deco/deco_bg_txt.svg) repeat 0 0 / auto 100%;
		animation: bg_decotext 180s linear infinite;
		opacity: .3;
	}
	.bg_txt_btm {
		bottom: max(calc(-68 / var(--vw-min)* 100vw), -68px);
		height: min(calc(136 / var(--vw-min)* 100vw), 136px);
		background: url(../img/common/deco/deco_bg_txt.svg) repeat 0 0 / auto 100%;
		animation: bg_decotext 180s linear infinite reverse;
		opacity: .3;
	}
}
@keyframes bg_decotext {
	0% {
		background-position: 0 0;
	}
	100% {
		background-position: 7316px 0;
	}
}
/*-----------------------------------------------
 * Modal
-------------------------------------------------*/
/**
 * modalBox
 * 基盤のモーダル
 */
 .modalBox{
	-webkit-overflow-scrolling: touch;
	-webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    background-color: rgba(0, 0, 0, .6);
	display: none;
	width: 100%;
	height: 100%;
	overflow: auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
}
.oneModal{
	display: none;
	width: 100%;
	height: 100%;
	min-width: var(--common-min-width);
	position: relative;
	z-index: 1;
}
.oneModal.is-show {
	display: block;
}

/* oneModalIn */
.oneModalIn{
	display: flex;
	justify-content: center;
	align-items: center;
	height: auto;
	width: 100%;
	min-height: 100%;
	margin: 0 auto;
	position: relative;
}
.oneModalIn__cont{
	padding: 50px 0;
}
@media screen and (max-width:767px){
	.oneModalIn{
		min-width: 100%;
	}
	.oneModalIn__cont{
		width: 100%;
	}
}

/**
 * closeBtn
 */
.closeBtn{
	width: 90px;
	height: 90px;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 2;
}
@media screen and (max-width:767px){
	.closeBtn{
		width:60px;
		height:60px;
	}
}

.closeBtn a {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
}

/* img */
.closeBtn a:before {
	content: "";
	mask: url(../img/common/icon/icon_close.svg) no-repeat center / contain;
	background-color: #FFF;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

/**
 * iframe
 */
/* common */
.commonIframe{
	width: 100%;
	height: 100%;
	display: block;
}

/* youtube */
.youtubeIframeWrap {
	width: 70%;
	max-width: 159.993vh;
	position: relative;
}
@media screen and (max-width:767px){
	.youtubeIframeWrap {
		width: 100%;
		max-width: 100%;
		margin: 50px 0;
	}
}
.youtubeIframeWrap:before{
	content: "";
	display: block;
	padding-top: 56.25%;
	z-index: 0;
}
.youtubeIframe{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}

/**
 * comment
 */
/* nameWrap */
.commentCont__nameWrap {
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align: center;
}
.commentCont__post {
	color: rgb(var(--color-main));
	font-size: 14px;
}
.commentCont__name {
	font-size: 22px;
}
.commentCont__name--min {
	display: block;
	font-size: 50%;
}
@media screen and (max-width:767px) {
	.commentCont__post {
		font-size: calc(24 / var(--vw-min) * 100vw);
	}
	.commentCont__name {
		font-size: calc(30 / var(--vw-min) * 100vw);
	}
}

/* text */
.commentCont__textWrap {
	margin-top: 1.5em;
}
.commentCont__text {
	font-size: 16px;
	line-height: 2;
	text-align: center;
}
@media screen and (max-width:767px) {
	.commentCont__text {
		font-size: calc(24 / var(--vw-min) * 100vw);
	}
}

/**
 * modal__imgWrap
 */
 .modal__imgWrap {
	display: flex;
	justify-content: center;
	width: 100%;
	height: 100%;
	margin: auto;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	padding: 50px 0;
	pointer-events: none;
}
.modal__imgWrap img {
	max-width: 1000px;
	height: 100%;
	object-fit: contain;
	object-position: center;
	pointer-events: auto;
}
@media screen and (max-width:767px){
	.modal__imgWrap img {
		max-width: 100%;
	}
}

/*-----------------------------------------------
 * Parts
-------------------------------------------------*/
/**
 * contTitle
 */
 .contTitle {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin-bottom: 80px;
}
.contTitle--textWrap{
	filter: drop-shadow(0px 0px 10px #83f776);
}
.contTitle--text {
	font-family: var(--font-en);
	color:rgb(var(--color-main));
	font-size: 32px;
	letter-spacing: 0.2em;
	line-height: 1;
	margin-bottom: 40px;
	display: block;
}
@media screen and (max-width:767px){
	.contTitle {
		margin-bottom: calc(96 / var(--vw-min) * 100vw);
	}
	.contTitle--text {
		font-size: calc(44 / var(--vw-min) * 100vw);
		margin-bottom: calc(46 / var(--vw-min) * 100vw);
	}
}


/* deco */
.contTitle--deco {
	display: flex;
	width: 233px;
	height: 1px;
	position: relative;
}
.contTitle--deco:before {
	content: "";
	background-color: rgb(var(--color-main));
	-webkit-mask: url(../img/common/new_deco/deco_ttl_star.svg) no-repeat center / contain;
	mask: url(../img/common/new_deco/deco_ttl_star.svg) no-repeat center / contain;
	margin: auto;
	width: 17px;
	height: 17px;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
@media screen and (max-width:767px){
	.contTitle--deco {
		width: calc(350 / var(--vw-min) * 100vw);
	}
}

.contTitle--deco > span {
	width: 50%;
	height: 100%;
	position: relative;
}
.contTitle--deco > span:before {
	content: "";
	background-color: rgb(var(--color-main));
	-webkit-mask: no-repeat center / contain;
	mask: no-repeat center / contain;
	width: 67px;
	height: 14px;
	position: absolute;
	top: -6px;
}
.contTitle--deco > span:after {
	content: "";
	background-color: #FFF;
	width: 100%;
	height: 1px;
	position: absolute;
}
.contTitle--deco > span:nth-child(1):after {
	right: 0;
}
.contTitle--deco > span:nth-child(2):after {
	left: 0;
}

.contTitle--deco > span:nth-child(1):before {
	-webkit-mask-image: url(../img/common/new_deco/deco_ttl_left.svg);
	mask-image: url(../img/common/new_deco/deco_ttl_left.svg);
	left: -6px;
}
.contTitle--deco > span:nth-child(2):before {
	-webkit-mask-image: url(../img/common/new_deco/deco_ttl_right.svg);
	mask-image: url(../img/common/new_deco/deco_ttl_right.svg);
	right: -6px;
}
@media screen and (max-width:767px){
	.contTitle--deco > span:before {
		width: 58px;
		height: 12px;
	}
}

/**
 * c-swiperNav
 */
.c-swiperNav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0 22px;
	width: 100%;
	margin-top: 30px;
}
.c-swiperNav .swiper-pagination-bullet {
	border: 1px solid rgb(var(--color-main));
	background-color: transparent;
	width: 8px;
	height: 8px;
	opacity: .4;
	margin: 0 !important;
}
.c-swiperNav .swiper-pagination-bullet-active {
	background-color: rgb(var(--color-sub));
	border: 1px solid rgb(var(--color-sub));
	opacity: 1;
}
@media screen and (max-width:767px){
	.c-swiperNav {
		gap: 0 calc(26 / var(--vw-min) * 100vw);
		margin-top: calc(48 / var(--vw-min) * 100vw);
	}
	.c-swiperNav .swiper-pagination-bullet {
		width: calc(14 / var(--vw-min) * 100vw);
		height: calc(14 / var(--vw-min) * 100vw);
	}
}

/**
 * moreLink
 */
.moreLink {
	width: 64px;
	height: 64px;
}
.moreLink > a {
	border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .2);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	position: relative;
	text-decoration: none;
}

/* text */
.moreLink__textWrap {
	background-color: #000;
    color: rgb(var(--color-main));
    font-size: 16px;
    line-height: 1;
    position: relative;
    z-index: 2;
    margin-left: 44px;
    padding: 5px;
	transition: transform .3s ease;
}
.moreLink > a:hover .moreLink__textWrap {
	transform: translateX(10%);
}
.moreLink__textWrap > span {
	display: inline-block;
}

/* svg */
.moreLink > a svg {
    margin-top: -1px;
    margin-left: -1px;
    transform: rotate(-90deg);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
.moreLink > a svg circle {
    fill: transparent;
    stroke: rgb(var(--color-main));
    stroke-width: 1;
    animation: bCircle-out .8s forwards;
}
.moreLink > a:hover svg circle {
    animation: bCircle .8s forwards;
}
@keyframes bCircle {
    0% {
        stroke-dasharray: 0 200; /*-- 円の直径(64)x3.14 --*/
    }
    26% {
        stroke-dasharray: 0 200;
    }
    100% {
        stroke-dasharray: 200 200;
    }
}
@keyframes bCircle-out {
    0% {
        stroke-dasharray: 200 200; /*-- 円の直径(64)x3.14 --*/
    }
    26% {
        stroke-dasharray: 200 200;
    }
    100% {
        stroke-dasharray: 0 200;
    }
}

/**
 * main
 */
.main {
	position: relative;
	z-index: 1;
}

/**
 * sub page
 */
/* articleCont */
.articleCont {
	padding-top: 180px;
}
@media screen and (max-width:767px){
	.articleCont {
		padding-top: calc(220 / var(--vw-min) * 100vw);
	}
}

/* logo */
@media screen and (max-width:767px){
	.subLogo {
		width: calc(156 / var(--vw-min) * 100vw);
		position: absolute;
		top: calc(30 / var(--vw-min) * 100vw);
		left: calc(30 / var(--vw-min) * 100vw);
	}
	.subLogo img {
		width: 100%;
	}
}

/*-----------------------------------------------
 * Scroll animation
-------------------------------------------------*/
/* contTitle--deco */
.contTitle--deco > span:after {
	width: 0;
	transition: width .4s ease;
}
.contTitle--deco.is-ani > span:after {
	width: 100%;
}
.contTitle--deco > span:before {
	opacity: 0;
	transition: opacity .4s ease,
				transform 1s var(--easing-outquart);
}
.contTitle--deco > span:nth-child(1):before {
	transform: translateX(20%);
}
.contTitle--deco > span:nth-child(2):before {
	transform: translateX(-20%);
}
.contTitle--deco.is-ani > span:before {
	transition-delay: .2s;
	opacity: 1;
	transform: translateX(0);
}