@charset "utf-8";
/*-----------------------------------------------
 * レスポンシブは基本スタイルを引き継ぐ（PCファースト）
 * @media screen and (max-width:768px)
-------------------------------------------------*/
/*-----------------------------------------------
 * Reset, root
 * Bace
 * Header
 * Footer
 * Parts
 * Sub page
 * Top
 * News
 * System
 * Character
 * Cookie policy
 * Products
 * Special
-------------------------------------------------*/
/*-----------------------------------------------
 * 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;}

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@700&display=swap');

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

	/* メインで使用するサイズやカラー */
	--main-font-size: 16px;
	--main-font-family: 'Noto Serif JP',serif;

	/* color */
	--color-main: 19,38,52; /* #132634 */
	--color-off-white: 253,252,232; /* #fdfce8 */
	--color-red: 187,58,56; /* #bb3a38 */
	--color-right-green: 134,205,174; /* #86cdae */

	/* 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:768px){
	:root {
		--common-min-width: 100%;
		--common-min-height: auto;
		--main-font-size: 12px;

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

/*-----------------------------------------------
 * Bace
-------------------------------------------------*/
body{
	-webkit-text-size-adjust: 100%;
	background-color:#3b767b;
	color:#fff;
	font-family: var(--main-font-family);
	font-feature-settings:"palt";
	font-size: var(--main-font-size);
	font-weight:300;
	letter-spacing: 0.07em;
	line-height: 1.8;
	word-wrap: break-word;
}
a{ color: #000;}
a:hover{ text-decoration: none; }
.ah { transition: opacity .3s ease; }
.ah:hover { opacity: .7; }
::selection{
	background:#6ccfee;
	color:#fff;
}
::-moz-selection{
	background:#6ccfee;
	color:#fff;
}
@media screen and (max-width:768px){
	.sp{ display: block; }
	.pc{ display: none; }
	.ah:hover { opacity: 1; }
}
@media screen and (min-width:769px){
	html {
		scrollbar-color:#fefded #132534;
		scrollbar-width:thin;
	}
	body {
		scrollbar-gutter: stable;
	}
	.sp{display:none}
	#fullWrap{
		min-width:1200px;
	}
	::-webkit-scrollbar{
		width:4px;
		height:4px;
	}
	::-webkit-scrollbar-track{
		background-color:#fefded;
	}
	::-webkit-scrollbar-thumb{
		background-color:#132534;
		border-radius:3px
	}
}

/**
 * font
 */
.font-jost{
	font-family:'Jost',sans-serif;
	font-feature-settings:"ss01";
	letter-spacing:0;
	font-weight:500;
}
.font-notosans {
	font-family: 'Noto Sans JP', sans-serif;
}

/**
 * Wrap
 * 大枠のwrap指定
 */
/* fullWrap */
#fullWrap {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	position: relative;
	z-index: 1;
}
.barba-container {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

/* 遷移時のアニメーション */
#fullWrap.is-ani{
	animation: goRotate 10s forwards;
}
@keyframes goRotate {
    0% {
    	transform: rotate(0);
    	opacity: 1;
    }
	20% {
		opacity: 0;
	}
    100% {
    	transform: rotate(5deg);
    	opacity: 0;
    }
}
#fullWrap.is-aniadd{
	animation: backRotate 3s forwards;
}
@keyframes backRotate {
    0% {
    	transform: rotate(-5deg);
    	opacity: 0;
    }
    100% {
    	transform: rotate(0);
    	opacity: 1;
    }
}

/**
 * loading
 */
.loading {
	overflow: hidden;
	pointer-events: none;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 9999;
}
#waveCanvasWrap {
	width: 100%;
	height: calc(100% + 200px);
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 1;
	transform: translateY(100%);
	transition: transform 6s cubic-bezier(0.25, 1, 0.5, 1);
	opacity: .9;
}
.loading.is-active #waveCanvasWrap {
	transform: translateY(0);
}

/* bg */
#waveCanvasWrap:before {
	content: "";
	background-color: #337576;
	width: 100%;
	height: calc(100% - 200px);
	position: absolute;
	bottom: 0;
	left: 0;
}

/* canvas */
#waveCanvas {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
}


/*-----------------------------------------------
 * Header
-------------------------------------------------*/
.header {
	display: flex;
	align-items: center;
	width: 100%;
	height: 80px;
	min-width: var(--common-min-width);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
}
.header:before {
	content: "";
	background-color: rgb(var(--color-off-white));
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 0;
	pointer-events: none;
}
@media screen and (max-width:768px){
	.header {
		display: block;
		height: 0;
		padding: 0;
	}
	.header:before {
		content: "";
		background-color: rgba(42,78,81,.9);
		-webkit-backdrop-filter: blur(8px);
		backdrop-filter: blur(8px);
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		z-index: 0;
		pointer-events: none;
	}
}

/* inner */
.header__inner {
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 1;
}
@media screen and (max-width:768px){
	.header__inner {
		-webkit-overflow-scrolling: touch;
		width: 100%;
		height: 100%;
		overflow-y: auto;
		overscroll-behavior: contain;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1;
	}
}

/* logo */
.header__logo {
	width: 96px;
	height: 48px;
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 24px;
}
.header__logo > a {
	background: url(/wp-content/themes/gift_2023/assets/img/common/logo.png) no-repeat center / contain;
	display: block;
	width: 100%;
	height: 100%;
}
@media screen and (max-width:768px){
	.header__logo {
		width: min(calc(190 / var(--vw-min) * 100vw), 190px);
		height: min(calc(96 / var(--vw-min) * 100vw), 96px);
		margin-bottom: calc(120 / var(--vw-min) * 100vw);
		position: relative;
		top: auto;
		bottom: auto;
		left: auto;
	}
	.header__logo > a {
		background-image: url(/wp-content/themes/gift_2023/assets/img/common/logo_w.png);
	}
}

/**
 * headerNav
 */
.headerNav,
.headerNav__inner,
.headerNav__cont {
	width: 100%;
	height: 100%;
	position: relative;
}
.headerNav__cont {
	display: flex;
	align-items: center;
}
@media screen and (max-width:768px){
	.headerNav {
		height: calc(100% + 1px);
	}
	.headerNav__inner {
		display: flex;
		align-items: center;
		justify-content: center;
		height: auto;
		min-height: 100%;
		margin: 0 auto;
		position: relative;
	}
	.headerNav__cont {
		display: block;
		height: auto;
		margin: 100px 0 40px;
		position: static;
	}
}

/* right */
.headerNav__cont__right {
	display: flex;
	margin-top: -0.5em;
	margin-left: auto;
}
@media screen and (max-width:768px){
	.headerNav__cont__right {
		display: block;
		margin-top: 40px;
		margin-left: 0;
	}
}

/**
 * headerNavLists
 */
.headerNavLists {
	height: 100%;
	display: flex;
	align-items: center;
}
@media screen and (max-width:768px){
	.headerNavLists {
		width: 100%;
		height: auto;
		display: block;
	}
}

/* item */
.headerNavLists__item {
	margin-left: 24px;
	position: relative;
}
@media screen and (max-width:768px){
	.headerNavLists__item {
		display: flex;
		align-items: center;
		justify-content: center;
		margin-left: 0;
		padding-bottom: 10px;
	}
	.headerNavLists__item:not(:first-child) {
		margin-top: 20px;
	}
}

/* standby */
.headerNavLists__item.is-standby {
	pointer-events: none;
	opacity: .6;
}

/* link */
.headerNavLists__link {
	color: rgb(var(--color-main));
	display: block;
	position: relative;
	text-decoration: none;
}
@media screen and (max-width:768px){
	.headerNavLists__link {
		color: #fff;
		display: inline-block;
	}
}

/* text */
.headerNavLists__text {
	display: block;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 0.01em;
	line-height: 1;
	position: relative;
}
@media screen and (max-width:768px){
	.headerNavLists__text {
		font-size: 18px;
	}
}

/* hover, is-active */
.headerNavLists__text:before {
	content: "";
	background-color: rgb(var(--color-red));
	border-radius: 4px;
	width: 100%;
	height: 4px;
	position: absolute;
	bottom: -0.3em;
	left: 0;
	z-index: 0;
	transform: scale(0, 1);
	transform-origin: right top;
	transition: transform .3s ease;
}
.headerNavLists__link:is(:hover, .is-active) .headerNavLists__text:before {
	transform-origin: left top;
	transform: scale(1, 1);
}
.headerNavLists__text {
	transition: color .3s ease;
}
.headerNavLists__link:is(:hover, .is-active) .headerNavLists__text {
	color: rgb(var(--color-red));
}
@media screen and (max-width:768px){
	.navBtnWrap {
		width: 50px;
		height: 50px;
		position: absolute;
		top: 12px;
		right: 12px;
		z-index: 2;
	}
	.navBtn {
		background-color: rgb(var(--color-right-green));
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		width: 100%;
		height: 100%;
		position: relative;
		text-decoration: none;
	}
	.navBtn__lineWrap {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-between;
		width: 20px;
		height: 10px;
		position: relative;
	}
	.navBtn--line {
		background-color: rgb(var(--color-main));
		border-radius: 2px;
		display: block;
		width: 100%;
		height: 2px;
		position: relative;
	}
	.navBtn:after {
		content: "MENU";
		font-size: 10px;
		line-height: 1;
		margin-top: 0.6em;
	}
}

/* scroll animation */
@media screen and (min-width:769px){
	.header__logo,
	.header:before {
		opacity: 0;
		transition: opacity .4s ease;
	}
	.header.is-scroll .header__logo,
	.header.is-scroll:before {
		opacity: 1;
	}
	.headerNavLists {
		transition: transform .4s ease;
	}
	.header.is-scroll .headerNavLists {
		transform: translateX(130px);
	}

	/* 下層時の処理 */
	body.sub .header:before,
	body.sub .header__logo {
		opacity: 1 !important;
	}
	body.sub .headerNavLists {
		transform: translateX(130px) !important;
	}
}

/**
 * active sp
 */
 @media screen and (max-width:767px){
	.header__inner,
	.header:before {
		transform: translateX(100%);
		transition: transform .5s var(--easing-outquart);
	}
	.header.is-active .header__inner,
	.header.is-active:before {
		transform: translateX(0);
	}

	/* btn */
	.navBtn {
		transition: background-color .3s ease;
	}
	.navBtn.is-active {
		background-color: #fff;
	}

	/* text */
	.navBtn.is-active:after {
		content: "CLOSE";
	}

	/* line */
	.navBtn--line {
		transition: transform .3s ease,
					opacity .3s ease;
	}
	.navBtn.is-active .navBtn--line:nth-child(1) {
		transform: rotate(30deg);
		top: 4px;
	}
	.navBtn.is-active .navBtn--line:nth-child(2) {
		transform: rotate(-30deg);
		bottom: 4px;
	}
}

/**
 * headBgmLang
 */
 .headBgmLang {
	display: flex;
	align-items: center;
	height: 80px;
	margin-left: auto;
	padding-right: 24px;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 1000;
}
@media screen and (max-width:768px){
	.headBgmLang {
		align-items: flex-start;
		flex-direction: column-reverse;
		height: auto;
		margin-left: 0;
		padding-right: 0;
		right: auto;
		top: 16px;
		left: 12px;
		opacity: 0;
		pointer-events: none;
		transition: opacity .3s ease;
	}
	.headBgmLang.is-active {
		opacity: 1;
		pointer-events: auto;
	}
}

/* bgm */
.headBgmLang__bgm{
	width:150px;
	display:flex;
	justify-content:space-between;
	align-items: center;
	font-size:16px;
	color: rgb(var(--color-main));
	height:22px;
	line-height:1.375;
	padding-top:1px;
	position: relative;
	z-index:4999;
}
@media screen and (max-width:768px){
	.headBgmLang__bgm{
		color: #fff;
		width: 122px;
		font-size: 12px;
	}
}

.headBgmLang__bgm a{
	text-decoration:none;
	transition:all 0.3s ease;
}
@media screen and (min-width:769px){
	.headBgmLang__bgm a:hover{
		color:#ba3a38;
	}
}
@media screen and (max-width:768px){
	.headBgmLang__bgm a{
		color: #fff;
	}
}
.headBgmLang__bgmIcon{
	width:51px;
	position:absolute;
	left:56px;
	top:0;
	height:22px;
}
.headBgmLang__bgmIcon:before {
	content: "";
	display: block;
	background-color: rgb(var(--color-main));
	-webkit-mask: url(/wp-content/themes/gift_2023/assets/img/common/icon_bgm-off.svg) no-repeat left top / contain;
	mask: url(/wp-content/themes/gift_2023/assets/img/common/icon_bgm-off.svg) no-repeat left top / contain;
	width: 100%;
	height: 100%;
}
.headBgmLang__bgmIcon.on:before{
	-webkit-mask-image:url(/wp-content/themes/gift_2023/assets/img/common/icon_bgm-on.svg);
	mask-image:url(/wp-content/themes/gift_2023/assets/img/common/icon_bgm-on.svg);
}
@media screen and (max-width:768px){
	.headBgmLang__bgmIcon {
		left: 40px;
	}
	.headBgmLang__bgmIcon:before {
		background-color: #fff;
	}
}
.headBgmLang__bgmWave{
	position:absolute;
	width:14px;
	height:16px;
	bottom:3px;
	right:0;
	display:flex;
	justify-content:space-between;
	align-items:flex-end;
}
.headBgmLang__bgmWave span{
	width:2px;
	height:2px;
	background:#000;
}
@media screen and (max-width:768px){
	.headBgmLang__bgmWave span{
		background:#fff;
	}
}
.headBgmLang__bgmIcon.on .headBgmLang__bgmWave span:nth-child(1){
	animation:bgmwave 0.8s linear infinite;
}
.headBgmLang__bgmIcon.on .headBgmLang__bgmWave span:nth-child(2){
	animation:bgmwave .66s linear infinite;
}
.headBgmLang__bgmIcon.on .headBgmLang__bgmWave span:nth-child(3){
	animation:bgmwave 1.1s linear infinite;
}
.headBgmLang__bgmIcon.on .headBgmLang__bgmWave span:nth-child(4){
	animation:bgmwave .7s linear infinite;
}
@keyframes bgmwave{
	0%{
		height:100%;
	}
	20%{
		height:2px;
	}
	30%{
		height:40%;
	}
	50%{
		height:10%;
	}
	65%{
		height:90%;
	}
	78%{
		height:2px;
	}
	90%{
		height:60%;
	}
	100%{
		height:0;
	}
}

/**
 * headBgmLang__lang
 */
.headBgmLang__lang {
	display: flex;
	align-items: center;
	margin-left: 40px;
}
.headBgmLang__lang > dt {
	color: rgb(var(--color-main));
	font-size: 16px;
	margin-right: 24px;
}
@media screen and (max-width:768px){
	.headBgmLang__lang {
		margin-left: 0;
		margin-bottom: 12px;
	}
	.headBgmLang__lang > dt {
		color: #fff;
		font-size: 12px;
		margin-right: 12px;
	}
}

/* langLists */
.headBgmLang__langLists {
	display: flex;
	align-items: center;
}
.headBgmLang__langLists > li:not(:first-child) {
	margin-left: 8px;
}

/* a */
.headBgmLang__langLists > li a {
	border-radius: 24px;
	border: 1px solid rgb(var(--color-main));
	color: rgb(var(--color-main));
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 24px;
	font-size: 16px;
	text-decoration: none;
}
@media screen and (max-width:768px){
	.headBgmLang__langLists > li a {
		border: 1px solid #fff;
		font-size: 12px;
		color: #fff;
	}
}

/* hover active */
.headBgmLang__langLists > li a {
	transition: color .3s ease,
				background-color .3s ease,
				border .3s ease;
}
.headBgmLang__langLists > li a:is(:hover, .is-active) {
	background-color: rgb(var(--color-red));
	border-color: rgb(var(--color-red));
	color: #fff;
}


/*-----------------------------------------------
 * Footer
-------------------------------------------------*/
.footer{
	background:#000;
	margin-top: auto;
	position:relative;
	z-index: 1;
}
.footer__inner{
	width:880px;
	margin:0 auto;
	padding:80px 0 40px;
}
@media screen and (max-width:768px){
	.footer__inner{
		width:93.6vw;
		margin:0 auto;
		padding:12.8vw 0;
	}
}
.footer__logo1{
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	padding-bottom:10px;
}
.footer__logo1 li{
	margin:0 20px 30px;
}
@media screen and (max-width:768px){
	.footer__logo1{
		padding-bottom:6.4vw;
	}
	.footer__logo1 li{
		margin:0 2.6666vw 4vw;
		height:7.4666vw;
	}
	.footer__logo1 li img{
		height:7.4666vw;
		width:auto;
	}
}
.footer__logo2{
	display:flex;
	justify-content:center;
	align-items:center;
	flex-wrap:wrap;
	padding-bottom:10px;
}
.footer__logo2 li{
	margin:0 20px 30px;
}
@media screen and (max-width:768px){
	.footer__logo2{
		padding-bottom:12.8vw;
	}
	.footer__logo2 li{
		margin:0 2.6666vw;
		height:11.2vw;
	}
	.footer__logo2 li img{
		height:11.2vw;
		width:auto;
	}
}
.footer__caution{
	font-size:12px;
	line-height:2;
	text-align:center;
	margin-bottom:20px;
}
@media screen and (max-width:768px){
	.footer__caution{
		font-size:2.1333vw;
		margin-bottom:10vw;
	}
}
.footer__copyright{
	font-size:12px;
	text-align:center;
	color:rgba(255,255,255,.4);
}
@media screen and (max-width:768px){
	.footer__copyright{
		font-size:2.6666vw;
	}
}
.footer__policy {
	text-align: center;
	margin-bottom:20px;
}
.footer__policy a {
	color:#FFF;
	font-size:12px;
}
@media screen and (max-width: 768px) {
	.footer__policy {
		margin-bottom:10vw;
	}
	.footer__policy a {
		font-size:2.6666vw;
	}
}
.footer__scroll{
	position:absolute;
	right:80px;
	top:80px;
	transform:rotate(180deg);
}
.footer__scroll a{
	display:block;
	width:40px;
	height:80px;
	position:relative;
	text-decoration:none;
	color:#fff;
	writing-mode:vertical-rl;
	pointer-events:auto;
}
.footer__scroll-1{
	position:absolute;
	left:0;
	top:0;
	width:4px;
	height:100%;
	background:#666;
	border-radius:2px
}
.footer__scroll-1:before{
	content:'';
	position:absolute;
	left:0;
	width:100%;
	height:0;
	background:#FFF;
	animation:ms1 1s linear infinite;
	overflow:hidden;
}
.footer__scroll-2{
	position:absolute;
	left:2px;
	bottom:-2px;
	width:16px;
	height:4px;
	background:#666;
	border-radius:2px;
	transform:rotate(-45deg);
	transform-origin:left bottom;
	overflow:hidden;
}
.footer__scroll-2:before{
	content:'';
	position:absolute;
	left:0;
	width:0;
	height:100%;
	background:#fff;
	animation:ms2 1s linear infinite;
	animation-delay:0.25s;
}
@media screen and (max-width:768px){
	.footer__scroll{
		right:6.4vw;
		top:-9.6vw;
	}
	.footer__scroll a{
		width:6.4vw;
		height:16vw;
	}
	.footer__scroll-1{
		width:2px;
	}
	.footer__scroll-2{
		left:1px;
		bottom:-1px;
		width:3vw;
		height:2px;
	}
}

/**
 * textLinkLists
 */
.footer__textLinkLists {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 20px;
}
@media screen and (max-width:768px){
	.footer__textLinkLists {
		margin-bottom: 10vw;
	}
}

/* li */
.footer__textLinkLists > li {
	position: relative;
}
.footer__textLinkLists > li:not(:first-child) {
	margin-left: 2em;
	padding-left: 2em;
}
.footer__textLinkLists > li:not(:first-child):before {
	content: '';
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 1px;
	height: 1em;
	background: rgba(255,255,255,.4);
}

/* a */
.footer__textLinkLists > li a {
	color: #fff;
	font-size: 12px;
}
@media screen and (max-width:768px){
	.footer__textLinkLists > li a {
		font-size: 2.6666vw;
	}
}

@keyframes ms1{
	0%{
		top:0;
		height:0;
	}
	25%,75%{
		top:0;
		height:100%;
	}
	100%{
		top:100%;
		height:0;
	}
}
@keyframes ms2{
	0%{
		left:0;
		width:0;
	}
	25%,75%{
		left:0;
		width:100%;
	}
	100%{
		left:100%;
		width:0;
	}
}


/*-----------------------------------------------
 * Parts
-------------------------------------------------*/
/**
 * langBgm
 */
.langBgm {
	display: none;
}
@media screen and (max-width:768px){
	.langBgm {
		display: flex;
		align-items: flex-start;
		flex-direction: column-reverse;
		position: absolute;
		right: auto;
		top: 16px;
		left: 12px;
		z-index: 100;
	}

	/* bgm */
	.langBgm__bgm{
		width: 122px;
		display:flex;
		justify-content:space-between;
		align-items: center;
		font-size: 12px;
		color: rgb(var(--color-main));
		height:22px;
		line-height:1.375;
		padding-top:1px;
		position: relative;
		z-index:4999;
	}
	.langBgm.is-subpage .langBgm__bgm{
		color: #fff;
	}

	.langBgm__bgm a{
		color: rgb(var(--color-main));
		text-decoration:none;
		transition:all 0.3s ease;
	}
	.langBgm.is-subpage .langBgm__bgm a{
		color: #fff;
	}

	.langBgm__bgmIcon{
		width:51px;
		position:absolute;
		left: 40px;
		top:0;
		height:22px;
	}
	.langBgm__bgmIcon:before {
		content: "";
		display: block;
		background-color: rgb(var(--color-main));
		-webkit-mask: url(/wp-content/themes/gift_2023/assets/img/common/icon_bgm-off.svg) no-repeat left top / contain;
		mask: url(/wp-content/themes/gift_2023/assets/img/common/icon_bgm-off.svg) no-repeat left top / contain;
		width: 100%;
		height: 100%;
	}
	.langBgm__bgmIcon.on:before{
		-webkit-mask-image:url(/wp-content/themes/gift_2023/assets/img/common/icon_bgm-on.svg);
		mask-image:url(/wp-content/themes/gift_2023/assets/img/common/icon_bgm-on.svg);
	}
	.langBgm.is-subpage .langBgm__bgmIcon:before {
		background-color: #fff;
	}

	.langBgm__bgmWave{
		position:absolute;
		width:14px;
		height:16px;
		bottom:3px;
		right:0;
		display:flex;
		justify-content:space-between;
		align-items:flex-end;
	}
	.langBgm__bgmWave span{
		width:2px;
		height:2px;
		background:rgb(var(--color-main));
	}
	.langBgm.is-subpage .langBgm__bgmWave span{
		background: #fff;
	}
	.langBgm__bgmIcon.on .langBgm__bgmWave span:nth-child(1){
		animation:bgmwave 0.8s linear infinite;
	}
	.langBgm__bgmIcon.on .langBgm__bgmWave span:nth-child(2){
		animation:bgmwave .66s linear infinite;
	}
	.langBgm__bgmIcon.on .langBgm__bgmWave span:nth-child(3){
		animation:bgmwave 1.1s linear infinite;
	}
	.langBgm__bgmIcon.on .langBgm__bgmWave span:nth-child(4){
		animation:bgmwave .7s linear infinite;
	}
}
@keyframes bgmwave{
	0%{
		height:100%;
	}
	20%{
		height:2px;
	}
	30%{
		height:40%;
	}
	50%{
		height:10%;
	}
	65%{
		height:90%;
	}
	78%{
		height:2px;
	}
	90%{
		height:60%;
	}
	100%{
		height:0;
	}
}

/**
 * langBgm__lang
 */
@media screen and (max-width:768px){
	.langBgm__lang {
		display: flex;
		align-items: center;
		margin-bottom: 12px;
	}
	.langBgm__lang > dt {
		color: rgb(var(--color-main));
		font-size: 12px;
		margin-right: 12px;
	}
	.langBgm.is-subpage .langBgm__lang > dt {
		color: #fff;
	}

	/* langLists */
	.langBgm__langLists {
		display: flex;
		align-items: center;
	}
	.langBgm__langLists > li:not(:first-child) {
		margin-left: 8px;
	}

	/* a */
	.langBgm__langLists > li a {
		border-radius: 24px;
		border: 1px solid rgb(var(--color-main));
		color: rgb(var(--color-main));
		display: flex;
		align-items: center;
		justify-content: center;
		width: 40px;
		height: 24px;
		font-size: 12px;
		text-decoration: none;
	}
	.langBgm.is-subpage .langBgm__langLists > li a {
		border-color: #fff;
		color: #fff;
	}

	/* hover active */
	.langBgm__langLists > li a {
		transition: color .3s ease,
					background-color .3s ease,
					border .3s ease;
	}
	.langBgm__langLists > li a:is(.is-active) {
		background-color: rgb(var(--color-red));
		border-color: rgb(var(--color-red));
		color: #fff;
	}

	.langBgm.is-subpage .langBgm__langLists > li a:is(.is-active) {
		border-color: rgb(var(--color-red));
	}
}


/**
 * linkA
 */
.linkA {
	background-color: #000;
	border: 2px solid #fff;
	border-radius: 24px;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 48px;
	font-size: 20px;
	text-decoration: none;
}
@media screen and (max-width:768px){
	.linkA {
		border-radius: calc(72 / var(--vw-min) * 100vw);
		height: calc(72 / var(--vw-min) * 100vw);
		font-size: calc(24 / var(--vw-min) * 100vw);
	}
}

/* hover */
@media screen and (min-width:769px){
	.linkA {
		transition: color .3s ease,
					background-color .3s ease;
	}
	.linkA:hover {
		background-color: #fff;
		color: #000;
	}
}

/**
 * wp_pagenavi
 */
.wp-pagenavi {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 80px;
	font-family: 'Jost',sans-serif;
    font-feature-settings: "ss01";
	font-weight: 500;
    letter-spacing: 0;
}
@media screen and (max-width:768px){
	.wp-pagenavi {
		margin-top: calc(100 / var(--vw-min) * 100vw);
	}
}

/* page, current */
.wp-pagenavi .page,
.wp-pagenavi .current {
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	font-size: 20px;
	line-height: 1;
	margin: 0 8px;
}
@media screen and (max-width:768px){
	.wp-pagenavi .page,
	.wp-pagenavi .current {
		width: calc(48 / var(--vw-min) * 100vw);
		height: calc(48 / var(--vw-min) * 100vw);
		font-size: calc(24 / var(--vw-min) * 100vw);
		margin: 0 0.5em;
	}
}

.wp-pagenavi .page {
	background-color: #000;
	border: 2px solid #fff;
	color: #fff;
	text-decoration: none;
}
.wp-pagenavi .current {
	background-color: rgb(var(--color-right-green));
	border-radius: 50%;
	color: #000;
}

/* hover */
.wp-pagenavi .page {
	transition: background-color .3s ease,
				border-color .3s ease,
				color .3s ease;
}
.wp-pagenavi .page:hover {
	background-color: rgb(var(--color-right-green));
	border-color: rgb(var(--color-right-green));
	color: #000;
}

/**
 * backTo
 */
.backTo {
	width: 240px;
	margin: 80px auto 0;
}
@media screen and (max-width:768px){
	.backTo {
		width: calc(300 / var(--vw-min) * 100vw);
		margin: calc(100 / var(--vw-min) * 100vw) auto 0;
	}
}

/**
 * subContTitle
 */
.subContTitle {
	line-height: 1;
	font-size: 48px;
	color: rgb(var(--color-right-green));
	text-align: center;
}
@media screen and (max-width:768px){
	.subContTitle {
		font-size: calc(60 / var(--vw-min) * 100vw);
	}
}

/**
 * swiper parts
 */
/* Nav */
.c-swiperNav {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 120px;
	height: 120px;
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	z-index: 100;
}
.c-swiperNav:before {
	content: '';
	box-sizing: border-box;
	width: 60px;
	height: 60px;
	margin: auto;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	transform: rotate(45deg);
    transition: all 0.3s ease;
}
@media screen and (max-width:768px){
	.c-swiperNav {
		width: calc(120 / var(--vw-min) * 100vw);
		height: calc(120 / var(--vw-min) * 100vw);
	}
	.c-swiperNav:before {
		width: calc(60 / var(--vw-min) * 100vw);
		height: calc(60 / var(--vw-min) * 100vw);
		opacity: .6;
	}
}

/* prev, next */
.c-swiperNav.is-prev {
	left: 0;
}
.c-swiperNav.is-next {
	right: 0;
}
.c-swiperNav.is-prev:before {
	border-left: 4px solid #FFF;
    border-bottom: 4px solid #FFF;
	left: 26%;
}
.c-swiperNav.is-next:before {
	border-top: 4px solid #FFF;
	border-right: 4px solid #FFF;
	right: 26%;
}

/* hover */
@media screen and (min-width:769px){
	.c-swiperNav:hover.is-prev:before {
		right: 18%;
	}
	.c-swiperNav:hover.is-next:before {
		left: 18%;
	}
}

/* c-swiperPager */
.c-swiperPager {
	font-size: 16px;
	text-align: center;
}
@media screen and (max-width:768px){
	.c-swiperPager {
		font-size: calc(24 / var(--vw-min) * 100vw);
	}
}


/*-----------------------------------------------
 * Sub page
-------------------------------------------------*/
/**
 * subMain
 */
.subMain {
	position: relative;
	z-index: 1;
}

/* article */
.subArticle {
	padding-top: 80px;
	position: relative;
	z-index: 1;
}
@media screen and (max-width:768px){
	.subArticle {
		padding-top: 0;
	}
}

/* bg */
.subMain__bg{
	background:#3b767b;
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	z-index: 0;
	/* padding-top:30%; */
}
/* @media screen and (max-width:768px){
	.subMain__bg{
		padding-top:calc(96vh - 51.4666vw);
	}
} */
#subMain__bg__falls{
	position:fixed;
	left:0;
	top:0;
	right:0;
	padding-top:62.5%;
}
@media screen and (max-width:768px){
	#subMain__bg__falls{
		/* top:calc(100vh - 62.5vw); */
		height: 100%;
		padding-top:0;
	}
}
.subMain__bg__fall0{
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
}
.subMain__bg__fall1{
	background:url(/wp-content/themes/gift_2023/assets/img/common/fall1.png) no-repeat center center / contain;
}
.subMain__bg__fall2{
	background:url(/wp-content/themes/gift_2023/assets/img/common/fall2.png) no-repeat center center / contain;
}
.subMain__bg__fall3{
	background:url(/wp-content/themes/gift_2023/assets/img/common/fall3.png) no-repeat center center / contain;
}
.subMain__bg__fall4{
	background:url(/wp-content/themes/gift_2023/assets/img/common/fall4.png) no-repeat center center / contain;
}
.subMain__bg__fall5{
	background:url(/wp-content/themes/gift_2023/assets/img/common/fall5.png) no-repeat center center / contain;
}
.subMain__bg__fall6{
	background:url(/wp-content/themes/gift_2023/assets/img/common/fall6.png) no-repeat center center / contain;
}
@media screen and (max-width:768px){
	.subMain__bg__fall1{
		background-image:url(/wp-content/themes/gift_2023/assets/img/common/fall1_sp.png);
	}
	.subMain__bg__fall2{
		background-image:url(/wp-content/themes/gift_2023/assets/img/common/fall2_sp.png);
	}
	.subMain__bg__fall3{
		background-image:url(/wp-content/themes/gift_2023/assets/img/common/fall3_sp.png);
	}
	.subMain__bg__fall4{
		background-image:url(/wp-content/themes/gift_2023/assets/img/common/fall4_sp.png);
	}
	.subMain__bg__fall5{
		background-image:url(/wp-content/themes/gift_2023/assets/img/common/fall5_sp.png);
	}
	.subMain__bg__fall6{
		background-image:url(/wp-content/themes/gift_2023/assets/img/common/fall6_sp.png);
	}
}
.subMain__bg:before{
	content:'';
	position:relative;
	height:100%;
	box-shadow:0px 0px 250px 0px #284d54 inset;
	display:block;
	mix-blend-mode:difference;
}
@media screen and (max-width:768px){
	.subMain__bg:before{
		content: none;
		/* box-shadow:0px 0px 20vw 0px #284d54 inset; */
	}
}
.subMain__bg__line{
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	display:flex;
	flex-direction:column;
	justify-content:flex-end;
}
.subMain__bg__line:before{
	content:'';
	position:sticky;
	left:0;
	bottom:0;
	width:100%;
	padding-top:60%;
	background:url(/wp-content/themes/gift_2023/assets/img/top/bottom.png) no-repeat center bottom / 100% auto;
}
@media screen and (max-width: 768px){
	.subMain__bg__line:before{
		background:url(/wp-content/themes/gift_2023/assets/img/top/bottom-s.png) no-repeat center bottom / 100% auto;
	}
}

/**
 * subHeader
 */
.subHeader {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 80px 0;
}
@media screen and (max-width:768px){
	.subHeader {
		padding: calc(200 / var(--vw-min) * 100vw) 0 calc(80 / var(--vw-min) * 100vw);
	}
}

/* title */
.subHeader__title {
	line-height: 1;
	font-size: 60px;
	color: rgb(var(--color-right-green));
	text-align: center;
}
@media screen and (max-width:768px){
	.subHeader__title {
		font-size: calc(72 / var(--vw-min) * 100vw);
		order: 2;
	}
}

/* logo */
@media screen and (max-width:768px){
	.subHeader__logo {
		width: min(calc(190 / var(--vw-min) * 100vw), 190px);
		height: min(calc(96 / var(--vw-min) * 100vw), 96px);
		margin-bottom: calc(90 / var(--vw-min) * 100vw);
		order: 1;
	}
	.subHeader__logo img {
		width: 100%;
	}
}


/*-----------------------------------------------
 * Top
-------------------------------------------------*/
#loading{
	background:rgba(252,251,233,1);
	position:fixed;
	left:0;
	top:0;
	bottom:0;
	right:0;
	z-index:10000;
}
#bgmStarter{
	-webkit-overflow-scrolling: touch;
	overflow: auto;
	position:fixed;
	left:0;
	top:0;
	right:0;
	bottom:0;
	z-index:5000;
	background:rgba(252,251,233,.8);
	-webkit-backdrop-filter:blur(8px);
	backdrop-filter:blur(8px);
}
.bgmStarter__inner {
	width: 100%;
	height: 100%;
	position: relative;
}
.bgmStarter__cont__inner {
	padding: 50px 0;
}
.bgmStarter__cont {
	display: flex;
    justify-content: center;
    align-items: center;
    height: auto;
    width: 100%;
    min-height: 100%;
    margin: 0 auto;
    position: relative;
}
.bgm__catch {
	margin:0 auto 45px;
	width:30%;
	opacity:0;
}
.bgm__catch img {
	display: block;
	width:100%;
	height:auto;
}
@media screen and (max-width:768px){
	.bgm__catch {
		width:50%;
		margin:0 auto 9.6vw;
	}
}
.bgmStarter__logo{
	width:388px;
	margin:0 auto;
}
.bgmStarter__logo img{
	width:100%;
	height:auto;
}
@media screen and (max-width:768px){
	.bgmStarter__logo{
		width:48.8vw;
	}
}
.bgmStarter__title{
	font-size:max(48px,4vw);
	line-height:1;
	padding-top:2.5%;
	text-align:center;
	letter-spacing:0;
	color:#000;
}
@media screen and (max-width:768px){
	.bgmStarter__title{
		font-size:6.4vw;
		padding-top:9.6vw;
	}
}
.bgmStarter__switch{
	width:136px;
	margin:0 auto;
	padding-top:40px;
	display:flex;
	justify-content:space-between;
}
.bgmStarter__switch li{
	width:48px;
}
.bgmStarter__switch li a{
	display:block;
	text-align:center;
	text-decoration:none;
	line-height:1;
}
.bgmStarter__switch li a span{
	display:block;
	height:48px;
	border:1px solid #000;
	border-radius:50%;
	position:relative;
	margin-bottom:16px;
	transition:all 0.6s ease;
}
.bgmStarter__switch li a:hover span{
	background:#337576;
	border-color:#337576;
	transition:none;
}
.bgmStarter__switch li a span:before{
	content:'';
	position:absolute;
	top:12px;
	left:0;
	right:0;
	bottom:12px;
	background:#000;
	transition:all 0.6s ease;
}
.bgmStarter__switch li a:hover span:before{
	background:#FFF;
	transition:none;
}
.bgmStarter__on span:before{
	-webkit-mask:url(/wp-content/themes/gift_2023/assets/img/common/icon_bgm-on.svg) no-repeat center center / contain;
	mask:url(/wp-content/themes/gift_2023/assets/img/common/icon_bgm-on.svg) no-repeat center center / contain;
}
.bgmStarter__off span:before{
	-webkit-mask:url(/wp-content/themes/gift_2023/assets/img/common/icon_bgm-off.svg) no-repeat center center / contain;
	mask:url(/wp-content/themes/gift_2023/assets/img/common/icon_bgm-off.svg) no-repeat center center / contain;
}
@media screen and (max-width:768px){
	.bgmStarter__switch{
		width:36.2666vw;
		padding-top:5vw;
	}
	.bgmStarter__switch li{
		width:12.8vw;
	}
	.bgmStarter__switch li a{
		font-size:3.2vw;
	}
	.bgmStarter__switch li a span{
		height:12.7vw;
		margin-bottom:3vw;
	}
}
#contentWrap{
	position:relative;
	z-index: 1;
}
.bg{
	background:#3b767b;
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	padding-top:30%;
}
@media screen and (max-width:768px){
	.bg{
		padding-top:calc(96vh - 51.4666vw);
	}
}
#falls{
	position:fixed;
	left:0;
	top:0;
	right:0;
	padding-top:62.5%;
}
@media screen and (max-width:768px){
	#falls{
		top:calc(100vh - 62.5vw);
	}
}
.fall0{
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
}
.fall1{
	background:url(/wp-content/themes/gift_2023/assets/img/top/fall1.png) no-repeat center center / contain;
}
.fall2{
	background:url(/wp-content/themes/gift_2023/assets/img/top/fall2.png) no-repeat center center / contain;
}
.fall3{
	background:url(/wp-content/themes/gift_2023/assets/img/top/fall3.png) no-repeat center center / contain;
}
.fall4{
	background:url(/wp-content/themes/gift_2023/assets/img/top/fall4.png) no-repeat center center / contain;
}
.fall5{
	background:url(/wp-content/themes/gift_2023/assets/img/top/fall5.png) no-repeat center center / contain;
}
.fall6{
	background:url(/wp-content/themes/gift_2023/assets/img/top/fall6.png) no-repeat center center / contain;
}
.fall7{
	background:url(/wp-content/themes/gift_2023/assets/img/top/fall7.png) no-repeat center center / contain;
}
.fall8{
	background:url(/wp-content/themes/gift_2023/assets/img/top/fall8.png) no-repeat center center / contain;
}
.bg:before{
	content:'';
	position:relative;
	height:100%;
	box-shadow:0px 0px 250px 0px #284d54 inset;
	display:block;
	mix-blend-mode:difference;
}
@media screen and (max-width:768px){
	.bg:before{
		box-shadow:0px 0px 20vw 0px #284d54 inset;
	}
}
.bg__line{
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	display:flex;
	flex-direction:column;
	justify-content:flex-end;
}
.bg__line:before{
	content:'';
	position:sticky;
	left:0;
	bottom:0;
	width:100%;
	padding-top:60%;
	background:url(/wp-content/themes/gift_2023/assets/img/top/bottom.png) no-repeat center bottom / 100% auto;
}
@media screen and (max-width: 768px){
	.bg__line:before{
		background:url(/wp-content/themes/gift_2023/assets/img/top/bottom-s.png) no-repeat center bottom / 100% auto;
	}
}
.mv{
	position:relative;
	min-height:100vh;
	z-index:12;
}
.mv:before{
	content:'';
	position:relative;
	width:100%;
	padding-top:53.3333%;
	display:block;
}
@media screen and (max-width:768px){
	.mv{
		min-height:120vw;
		height:100vh;
	}
	.mv:before{
		padding-top:96vh;
	}
}
.mv__main{
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background:url(/wp-content/themes/gift_2023/assets/img/top/mv.png) no-repeat center top / 100% auto;
	padding-top:6.6666%;
}
@media screen and (max-width:768px){
	.mv__main{
		background:url(/wp-content/themes/gift_2023/assets/img/top/mv-s.png) no-repeat center bottom / 100% auto;
		padding-top:max(27vh,24.4vw);
		bottom:unset;
		height:96vh;
		min-height:120vw;
	}
	.mv__main:before{
		content:'';
		position:absolute;
		left:0;
		top:0;
		right:0;
		height:calc(96vh - 40vw);
		min-height:calc(120vw - 40vw);
		background:#fefded;
		z-index:-1;
	}
}
.mv__logo{
	width:25%;
	margin:0 auto;
}
.mv__logo img{
	width:100%;
}
@media screen and (max-width:768px){
	.mv__logo{
		width:48.8vw;
	}
}
.mv__catch {
	width:30%;
	margin:0 auto 45px;
}
.mv__catch img {
	display: block;
	width:100%;
	height:auto;
}
@media screen and (max-width:768px){
	.mv__catch {
		width:50%;
		margin:0 auto 9.6vw;
	}
}
.mv__date{
	height:max(42px,2.6vw);
	line-height:1;
	margin-top:2.5%;
	text-align:center;
	letter-spacing:0;
	color:#000;
	margin-bottom:40px;
	font-weight: 700;
}
.mv__date img {
	height:100%;
	width:auto;
}
@media screen and (max-width:768px){
	.mv__date{
		height:6.4vw;
		margin-top:4.6vw;
		margin-bottom:6.4vw;
	}
}
.mv__award{
	position:absolute;
	left:24px;
	top:90px;
	width:130px;
	height:94px;
	background:url(/wp-content/themes/gift_2023/assets/img/top/award.png) no-repeat center center / contain;
}
@media screen and (max-width:768px){
	.mv__award{
		left:calc(20 / var(--vw-min) * 100vw);
		top:calc(192 / var(--vw-min) * 100vw);
		width:22.4vw;
		height:16.2666vw;
	}
}

/* award2 */
.mv__award2 {
	position: absolute;
	left: 164px;
	top: 97px;
	width: 130px;
	height: 80px;
	background: url(/wp-content/themes/gift_2023/assets/img/top/award_2.png) no-repeat center center / contain;
}
/* award3 */
.mv__award3 {
	position: absolute;
	left: 304px;
	top: 80px;
	width: 110px;
	height: 110px;
	background: url(/wp-content/themes/gift_2023/assets/img/top/award_3.png) no-repeat center center / contain;
}
@media screen and (max-width:768px){
	.mv__award2 {
		top: calc(198 / var(--vw-min) * 100vw);
		left: calc(200 / var(--vw-min) * 100vw);
		width: calc(170 / var(--vw-min) * 100vw);
		height: calc(103 / var(--vw-min) * 100vw);
	}
	.mv__award3 {
		top: calc(182 / var(--vw-min) * 100vw);
		left: calc(383 / var(--vw-min) * 100vw);
		width: calc(140 / var(--vw-min) * 100vw);
		height: calc(140 / var(--vw-min) * 100vw);
	}
}

/* award4 */
.mv__award4 {
	position: absolute;
	left: 304px;
	top: 200px;
	width: 110px;
	height: 66px;
	background: url(/wp-content/themes/gift_2023/assets/img/top/award_4.png) no-repeat center center / contain;
}
@media screen and (max-width:768px){
	.mv__award4 {
		width: calc(180 / var(--vw-min) * 100vw);
		height: calc(84 / var(--vw-min) * 100vw);
		top: calc(212 / var(--vw-min) * 100vw);
		right: calc(30 / var(--vw-min) * 100vw);
		left: auto;
	}
}

.mv__storeLink {
	color: #000;
	line-height: 1;
	font-size: 30px;
	margin-bottom: 16px;
	text-align: center;
}
@media screen and (max-width:768px){
	.mv__storeLink {
		font-size: calc(36 / var(--vw-min) * 100vw);
		margin-bottom: calc(20 / var(--vw-min) * 100vw);
	}
}

.mv__productLists {
	display: flex;
    justify-content: center;
    width: 640px;
    margin: 0 auto 20px;
    flex-wrap: wrap;
    align-items: center;
	
}
.mv__productLists > li {
	width: calc((100% - 20px) / 2);
	margin-bottom: 10px;
	padding: 0 1%;
}
.mv__productLists > li > a.is-package {
	font-weight: bold;
}
@media screen and (max-width:768px){
	.mv__productLists {
		width: 100%;
		margin: 0 auto calc(20 / var(--vw-min) * 100vw);
		padding: 0;
		flex-wrap: nowrap;
		flex-direction: column;
		align-items: center;
	}
	.mv__productLists > li {
		/*width: calc((100% - calc(20 / var(--vw-min) * 100vw)) / 2);*/
		width: 50%;
		margin-bottom: 1vw;
	}
	.mv__productLists > li:nth-child(2) {
		margin-left: 0;
	}
}

.mv__scroll{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	pointer-events:none;
	padding-left:40px;
	padding-top:20.5%;
}
.mv__scroll a{
	display:block;
	width:40px;
	height:80px;
	position:relative;
	text-decoration:none;
	color:#000;
	writing-mode:vertical-rl;
	pointer-events:auto;
}
.mv__scroll-1{
	position:absolute;
	left:0;
	top:0;
	width:4px;
	height:100%;
	background:#ccc;
	border-radius:2px
}
.mv__scroll-1:before{
	content:'';
	position:absolute;
	left:0;
	width:100%;
	height:0;
	background:#000;
	animation:ms1 1s linear infinite;
	overflow:hidden;
}
@keyframes ms1{
	0%{
		top:0;
		height:0;
	}
	25%,75%{
		top:0;
		height:100%;
	}
	100%{
		top:100%;
		height:0;
	}
}
.mv__scroll-2{
	position:absolute;
	left:2px;
	bottom:-2px;
	width:16px;
	height:4px;
	background:#ccc;
	border-radius:2px;
	transform:rotate(-45deg);
	transform-origin:left bottom;
	overflow:hidden;
}
.mv__scroll-2:before{
	content:'';
	position:absolute;
	left:0;
	width:0;
	height:100%;
	background:#000;
	animation:ms2 1s linear infinite;
	animation-delay:0.25s;
}
@keyframes ms2{
	0%{
		left:0;
		width:0;
	}
	25%,75%{
		left:0;
		width:100%;
	}
	100%{
		left:100%;
		width:0;
	}
}
@media screen and (max-width:768px){
	.mv__scroll{
		left:6.4vw;
		top:auto;
		bottom: 30vw;
		width:unset;
		height:unset;
		padding-left:0;
		padding-top:0;
	}
	.mv__scroll a{
		display:block;
		width:6.4vw;
		height:16vw;
		font-size:3.2vw;
	}
	.mv__scroll-1{
		width:2px;
	}
	.mv__scroll-2{
		left:1px;
		bottom:-1px;
		width:3vw;
		height:2px;
	}
}
.about{
	min-height:100vh;
	position:relative;
	z-index:11;
}
.about__wrap{
	min-height:100vh;
	display:flex;
	flex-wrap:wrap;
}
.about__left{
	min-height:100vh;
	padding:0 80px;
	width:50%;
	position:relative;
}
.about__left:before{
	content:'';
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	background:rgba(0,0,0,.4);
}
@media screen and (max-width:768px){
	.about__left{
		min-height:1px;
		padding:12.8vw 6.4vw;
		width:100%;
		position:relative;
	}
}
.about__inner{
	position:sticky;
	left:0;
	top:0;
	width:100%;
	padding:80px 0;
}
@media screen and (max-width:768px){
	.about__inner{
		position:relative;
		left:unset;
		top:unset;
		padding:0 0;
	}
}
.about__title{
	line-height:1;
	font-size:48px;
	color:#86cdae;
	margin-bottom:60px;
}
@media screen and (max-width:768px){
	.about__title{
		font-size:8vw;
		margin-bottom:9.8vw;
		text-align:center;
	}
}
.about__text{
	color:#FFF;
	line-height:3;
	letter-spacing:0.05em;
}
@media screen and (max-width:768px){
	.about__text{
		font-size:3.2vw;
	}
}
.about__right{
	position:sticky;
	left:0;
	top:0;
	overflow:hidden;
	width:50%;
	height:100vh;
	display:flex;
	background:#000;
}
@media screen and (max-width:768px){
	.about__right{
		position:relative;
		width:100%;
		height:56.25vw;
	}
}
.about__movie{
	transform:translate(-50%,-50%);
	position:absolute;
	left:50%;
	top:50%;
}
.about__movieLink{
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	z-index:5000;
}
.about__movieCircle{
	width:101px;
	height:101px;
	position:absolute;
	right:40px;
	bottom:40px;
}
.about__movieCircle:before{
	content:'';
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	background:url(/wp-content/themes/gift_2023/assets/img/common/circle_trailer.svg) no-repeat center center / contain;
	animation:rotate 15s ease infinite;
}
@keyframes rotate{
	0%{
		transform:rotate(0);
	}
	100%{
		transform:rotate(720deg);
	}
}
.about__movieCircle:after{
	content:'';
	position:absolute;
	width:28px;
	left:50%;
	top:0;
	bottom:0;
	margin-left:-14px;
	background:url(/wp-content/themes/gift_2023/assets/img/common/icon_play.svg) no-repeat center center / contain;
}
@media screen and (max-width:768px){
	.about__movieCircle{
		width:16.2666vw;
		height:16.2666vw;
		right:4.6666vw;
		bottom:4.6666vw;
	}
	.about__movieCircle:after{
		width:4.6666vw;
		margin-left:-2.3333vw;
	}
}
.slide{
	position:relative;
}
.slide__lists{
	display:flex;
	position:relative;
}
@media screen and (max-width:768px){
	.slide:before{
		content:'';
		z-index:50;
		position:absolute;
		left:50%;
		top:50%;
		width:12.8vw;
		height:12.8vw;
		border:1px solid #FFF;
		border-radius:50%;
		background:url(/wp-content/themes/gift_2023/assets/img/common/icon_onmodal.svg) no-repeat center center / 6.4vw 6.4vw;
		pointer-events:none;
		margin-left:-6.4vw;
		margin-top:-6.4vw;
	}
	.slide:after{
		content:'SELECT PHOTOS';
		position:absolute;
		left:0;
		top:50%;
		right:0;
		margin-top:9vw;
		text-align:center;
		color:#FFF;
		font-family:'Jost',sans-serif;
		font-feature-settings:"ss01";
		font-weight:500;
		font-size:3.2vw;
		z-index:55;
	}
}
.slide__list{
	width:25%;
}
@media screen and (max-width:768px){
	.slide__list{
		width:40%;
	}
}
.slide__list a{
	display:block;
	position:relative;
	pointer-events:auto;
}
.slide__list a:before{
	content:'';
	position:absolute;
	right:24px;
	bottom:24px;
	width:80px;
	height:80px;
	background:rgba(0,0,0,.4) url(/wp-content/themes/gift_2023/assets/img/common/icon_onmodal.svg) no-repeat center center / 40px 40px;
	border-radius:50%;
	opacity:0;
	transition:all 0.3s ease;
}
.slide__list a:hover:before{
	opacity:1;
}
@media screen and (max-width:768px){
	.slide__list a:before{
		display:none;
	}
}
.slide__list img{
	display:block;
	width:100%;
	height:auto;
}
.btn-circle{
	position:absolute;
	bottom:24px;
	width:80px;
	right:24px;
	height:80px;
	display:block;
	transform:rotate(-90deg);
}
.btn-circle circle{
	fill:transparent;
	stroke:#FFF;
	stroke-width:1px;
	stroke-dasharray:0 126;
	transition:all 0.3s linear;
}
.slide__list a:hover .btn-circle circle{
	stroke-dasharray:126 126;
}
@media screen and (max-width:768px){
	.btn-circle{
		display:none;
	}
}
.swiper-wrapper{transition-timing-function:linear}
.spec{
	padding:160px 0;
	position:relative;
}
@media screen and (max-width:768px){
	.spec{
		padding:12.8vw 0 calc(140 / var(--vw-min) * 100vw);
	}
}
.spec:before{
	content:'';
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background:rgba(0,0,0,.2);
}
.spec__inner{
	position:relative;
	width:942px;
	margin:0 auto;
}
@media screen and (max-width:768px){
	.spec__inner{
		width:87.2vw;
		margin:0 auto;
	}
}
.spec__title{
	font-size:48px;
	text-align:center;
	line-height:1;
	color:#86cdae;
	margin-bottom:60px;
}
@media screen and (max-width:768px){
	.spec__title{
		font-size:8vw;
		margin-bottom:10vw;
	}
}
.spec__list{
	display:flex;
	flex-wrap:wrap;
	padding:10px 0;
}
@media screen and (max-width:768px){
	.spec__list{
		padding:2.4vw 0;
	}
}
.spec__list dt{
	width:183px;
	white-space:nowrap;
	position:relative;
	font-size:16px;
	color:#86cdae;
	line-height:2.5;
	padding-right:24px;
	text-align:right;
}
.spec__list dt:before{
	content:'';
	position:absolute;
	right:0;
	top:10px;
	height:20px;
	width:1px;
	background:#FFF;
}
@media screen and (max-width:768px){
	.spec__list dt{
		width:auto;
		font-size:3.2vw;
		padding-right:3.2vw;
		margin-right:3.2vw;
		line-height:2.6;
	}
	.spec__list dt:before{
		top:2.4vw;
		height:3.7333vw;
	}
}
.spec__list dd{
	padding-left:23px;
	font-size:20px;
	color:#FFF;
	/* flex:1; */
	width: calc(100% - 183px);
	word-break: break-all;
}
@media screen and (max-width:768px){
	.spec__list dd{
		padding-left:0;
		font-size:3.4vw;
		flex:unset;
		line-height:2.4;
		width: 100%;
	}
}

.spec__store {
	width: 300px;
	margin: 30px auto;
}
.spec__store--ja {
	font-weight: bold;
}
@media screen and (max-width:768px){
	.spec__store {
		width: calc(300 / var(--vw-min) * 100vw);
		margin: calc(30 / var(--vw-min) * 100vw) auto;
	}
}

.twitter{
	padding:80px 0 160px;
	position:relative;
}
@media screen and (max-width:768px){
	.twitter{
		padding:6.4vw 0 25.6vw;
	}
}
.twitter:before{
	content:'';
	position:absolute;
	left:0;
	top:0;
	bottom:0;
	right:0;
	background:rgba(0,0,0,.2);
}
.twitter__inner{
	position:relative;
	width:480px;
	margin:0 auto;
}
@media screen and (max-width:768px){
	.twitter__inner{
		width:74.4vw;
	}
}
.twitter__title{
	font-size:48px;
	text-align:center;
	line-height:1;
	color:#86cdae;
	margin-bottom:60px;
}
@media screen and (max-width:768px){
	.twitter__title{
		font-size:8vw;
		margin-bottom:12.8vw;
	}
}
.twitter__widget{
	height:400px;
	border:2px solid #72b09a;
	border-radius:24px;
	background:#000;
	overflow:auto;
	margin-bottom:40px;
	scrollbar-width:none;
}
.twitter__widget::-webkit-scrollbar{
		width:0;
		height:0;
	}
@media screen and (max-width:768px){
	.twitter__widget{
		height:53.3333vw;
		margin-bottom:6.4vw;
		border-radius:3.2vw;
	}
}
.twitter__button{
	width:320px;
	margin:0 auto;
}
.twitter__button a{
	display:flex;
	justify-content:center;
	align-items:center;
	height:48px;
	border:2px solid #FFF;
	border-radius:24px;
	font-size:20px;
	text-decoration:none;
	transition:all 0.3s ease;
	background:#000;
	color:#FFF;
	padding-top:3px;
}
.twitter__button a:hover{
	background:#FFF;
	color:#000;
}
@media screen and (max-width:768px){
	.twitter__button{
		width:48.8vw;
	}
	.twitter__button a{
		height:9.6vw;
		border-radius:4.8vw;
		font-size:3.2vw;
		padding-top:3px;
	}
}


.modal{
	position:fixed;
	left:0;
	top:0;
	right:0;
	bottom:0;
	z-index:5000;
	background:rgba(59,118,123,.6);
	display:none;
	-webkit-backdrop-filter:blur(8px);
	backdrop-filter:blur(8px);
}
.modal__inner{
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	overflow:auto;
	overscroll-behavior:none;
}
.modal__cont{
	padding:80px;
	min-height:100vh;
	display:flex;
	justify-content:center;
	align-items:center;
	position: relative;
	z-index:50;
	pointer-events: none;
}
@media screen and (max-width:768px){
	.modal__cont{
		padding:12.8vw 0;
		min-height:calc(100vh + 1px);
	}
}
.modal__movieWrap {
	display: flex;
	justify-content: center;
	align-items: center;
	height: auto;
	width: 100%;
	min-height: 100%;
	margin: 0 auto;
	position: relative;
}
.modal__movie{
	width: 70%;
	max-width: 159.993vh;
	position: relative;
}
.modal__movie:before {
	content: "";
    display: block;
    padding-top: 56.25%;
	position: relative;
    z-index: 0;
}
@media screen and (max-width:768px){
	.modal__movie{
		width: 100%;
		max-width: 100%;
	}
}
.modal__movie iframe{
	width:100%;
	height:100%;
	display:block;
	position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
.modal__img{
	position:absolute;
	left:80px;
	top:80px;
	bottom:80px;
	right:80px;
	display:flex;
	justify-content:center;
	align-items:center;
}
@media screen and (max-width:768px){
	.modal__img{
		left:0;
		right:0;
		top:12.8vw;
		bottom:12.8vw;
	}
}
.modal__img img{
	max-width:100%;
	width:auto;
	max-height:100%;
	height:auto;
	pointer-events: auto;
	transition: all 0.3s ease;
}
.modal__close{
	position:absolute;
	right:0;
	top:0;
	width:100%;
	height:100%;
}
.modal__close a{
	display:block;
	position:absolute;
	right:0;
	top:0;
	width:80px;
	height:80px;
	overflow:hidden;
}
.modal__close a:before,
.modal__close a:after{
	content:'';
	position:absolute;
	left:-20px;
	right:-20px;
	top:50%;
	margin-top:-2px;
	height:4px;
	background:#FFF;
	transition:all 0.3s ease;
}
.modal__close a:before{
	transform:rotate(45deg)
}
.modal__close a:after{
	transform:rotate(-45deg)
}
.modal__close a:hover:before,
.modal__close a:hover:after{
	background:#337576;
}
@media screen and (max-width:768px){
/*	.modal__close{
		width:12.8vw;
		height:12.8vw;
	}*/
	.modal__close a{
		width:12.8vw;
		height:12.8vw;
	}
}
.modal__imgNav {
	position: absolute;
	left:0;
	right:0;
	top:50%;
	margin-top:-40px;
	display: flex;
	justify-content: space-between;
	height:80px;
}
.modal__imgNav li {
	width:80px;
	height:80px;
}
.modal__imgNav li a {
	display: block;
	height:80px;
	width:80px;
	position: absolute;
	overflow: hidden;
	pointer-events: auto;
}
.modal__imgNav li a:before {
	content:'';
	position: absolute;
	box-sizing: border-box;
	width:60px;
	height:60px;
	top:50%;
	left:50%;
	margin-top:-30px;
	transform:rotate(45deg);
	transition: all 0.3s ease;
}
.modal__imgNav li:first-child a:before {
	border-left:4px solid #FFF;
	border-bottom:4px solid #FFF;
	margin-left:-12px;
}
.modal__imgNav li:last-child a:before {
	border-top:4px solid #FFF;
	border-right:4px solid #FFF;
	margin-left:-48px;
}
.modal__imgNav li a:hover:before {
	border-color:#337576;
}
@media screen and (max-width:768px){
	.modal__imgNav {
		height:9.6vw;
		margin-top:-4.8vw;
	}
	.modal__imgNav li {
		width:9.6vw;
		height:9.6vw;
	}
	.modal__imgNav li a {
		height:9.6vw;
		width:9.6vw;
	}
	.modal__imgNav li a:before {
		width:8vw;
		height:8vw;
		margin-top:-4vw;
	}
	.modal__imgNav li:first-child a:before {
		margin-left:-2vw;
	}
	.modal__imgNav li:last-child a:before {
		margin-left:-6vw;
	}
	.modal__imgNav li a:hover:before {
		border-color:#FFF;
	}
}
.linkbtn,
.mv__toSteam{
	width: 100%;
	/*width:320px;*/
	margin:0 auto;
}
.linkbtn a,
.mv__toSteam a{
	display:flex;
	justify-content:center;
	align-items:center;
	height:48px;
	border:2px solid #FFF;
	border-radius:32px;
	font-size:20px;
	text-decoration:none;
	transition:all 0.3s ease;
	background:#000;
	color:#FFF;
	padding-top:3px;
	position: relative;
	overflow: hidden;
	font-weight: bold;
}
.linkbtn a:before,
.mv__toSteam a:before {
	content:'';
	position: absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	background:#FFF;
	transition: all 0.3s ease;
}
.linkbtn a.is-package:before {
	content: none;
}
.mv__toSteam a:before {
	-webkit-mask:url(/wp-content/themes/gift_2023/assets/img/common/logo_steam.png) no-repeat center center / auto 125%;
	mask:url(/wp-content/themes/gift_2023/assets/img/common/logo_steam.png) no-repeat center center / auto 125%;
}
.linkbtn a.is-switch:before {
	-webkit-mask:url(/wp-content/themes/gift_2023/assets/img/products/logo_switch.png) no-repeat center center / auto 55%;
	mask:url(/wp-content/themes/gift_2023/assets/img/products/logo_switch.png) no-repeat center center / auto  55%;
}
.linkbtn a.is-ps5:before {
	-webkit-mask:url(/wp-content/themes/gift_2023/assets/img/products/logo_ps5.png) no-repeat center center / auto 55%;
	mask:url(/wp-content/themes/gift_2023/assets/img/products/logo_ps5.png) no-repeat center center / auto 55%;
}
.linkbtn a.is-xbox:before {
	-webkit-mask:url(/wp-content/themes/gift_2023/assets/img/products/logo_xbox.png) no-repeat center center / auto 55%;
	mask:url(/wp-content/themes/gift_2023/assets/img/products/logo_xbox.png) no-repeat center center / auto 55%;
}
.linkbtn a:hover:before,
.mv__toSteam a:hover:before {
	background:#000;
}
.linkbtn a:hover,
.mv__toSteam a:hover{
	background:#FFF;
	color:#000;
}
@media screen and (max-width:768px){
	.linkbtn,
	.mv__toSteam{
		width:100%;
	}
	.linkbtn a,
	.mv__toSteam a{
		height:12.8vw;
		border-radius:6.4vw;
		font-size:3.2vw;
		padding-top:3px;
	}
	.linkbtn a.is-xbox:before {
		-webkit-mask:url(/wp-content/themes/gift_2023/assets/img/products/logo_xbox.png) no-repeat center center / auto 45%;
		mask:url(/wp-content/themes/gift_2023/assets/img/products/logo_xbox.png) no-repeat center center / auto 45%;
	}
}

/**
 * update
 */
.update {
	padding: 80px 0;
	position: relative;
    z-index: 11;
}
@media screen and (max-width:768px){
	.update {
		padding: calc(90 / var(--vw-min) * 100vw) 0;
	}
}

/* inner, cont */
.update__inner {
	display: flex;
	max-width: 1400px;
	margin: 0 auto;
	padding: 0 40px;
}
.update__cont {
	display: flex;
	flex-direction: column;
	width: 50%;
	padding: 0 40px;
}
@media screen and (max-width:768px){
	.update__inner {
		flex-direction: column;
		max-width: 100%;
		padding: 0 calc(48 / var(--vw-min) * 100vw);
	}
	.update__cont {
		width: 100%;
		padding: 0;
	}
	.update__cont:not(:first-of-type) {
		margin-top: calc(80 / var(--vw-min) * 100vw);
	}
}

/* title */
.update__title {
	line-height: 1;
	font-size: 48px;
	color: rgb(var(--color-right-green));
	margin-bottom: 40px;
}
@media screen and (max-width:768px){
	.update__title {
		font-size: calc(60 / var(--vw-min) * 100vw);
		margin-bottom: calc(80 / var(--vw-min) * 100vw);
		text-align: center;
	}
}

/**
 * updateListsWrap
 */
.updateListsWrap {
	margin-top: -31px;
	margin-bottom: 40px;
}
@media screen and (max-width:768px){
	.updateListsWrap {
		margin-top: -4.4vw;
		margin-bottom: calc(50 / var(--vw-min) * 100vw);
	}
}

/* a */
.updateLists__item > a {
	display: block;
	color: #fff;
	font-size: 16px;
	line-height: 2;
	padding: 20px 0;
	position: relative;
	text-decoration: none;
}
.updateLists--time {
	color: rgb(var(--color-right-green));
	font-size: 20px;
}
.updateLists--title {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}
@media screen and (max-width:768px){
	.updateLists__item > a {
		font-size: calc(24 / var(--vw-min) * 100vw);
		padding: calc(20 / var(--vw-min) * 100vw) 0 calc(24 / var(--vw-min) * 100vw);
	}
	.updateLists--time {
		font-size: calc(24 / var(--vw-min) * 100vw);
	}
}

/* line */
.updateLists__line1 {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 4px;
	background: #83a0a4;
	border-radius: 2px;
	z-index: 2;
}
.updateLists__line2 {
	position: absolute;
	right: -2px;
	bottom: 12px;
	width: 16px;
	height: 4px;
	background: #83a0a4;
	border-radius: 2px;
	transform: rotate(45deg);
	transform-origin: left bottom;
	overflow: hidden;
	z-index: 1;
}
.updateLists__line1:after {
	content: "";
	background-color: #fff;
	border-radius: 2px;
	width: 8%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 0;
}
.updateLists__line2:before {
	content: "";
	background-color: #fff;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}
@media screen and (max-width:768px){
	.updateLists__line1,
	.updateLists__line2 {
		height: 3px;
	}
	.updateLists__line2 {
		width: 12px;
		bottom: 8px;
	}
}

/* hover */
@media screen and (min-width:769px){
	.updateLists--title {
		transition: color .3s ease;
	}
	.updateLists__item > a:hover .updateLists--title {
		color: rgb(var(--color-right-green));
	}

	.updateLists__line1:before {
		content: "";
		background-color: rgb(var(--color-right-green));
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		transform: scale(0, 1);
		transform-origin: right top;
		transition: transform .3s ease;
	}
	.updateLists__item > a:hover .updateLists__line1:before {
		transform-origin: left top;
		transform: scale(1, 1);
	}

	.updateLists__line2:after {
		content: "";
		background-color: rgb(var(--color-right-green));
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		transform: scale(0, 1);
		transform-origin: left top;
		transition: transform .3s ease;
	}
	.updateLists__item > a:hover .updateLists__line2:after {
		transition-delay: .2s;
		transform-origin: right top;
		transform: scale(1, 1);
	}
}

/**
 * updateLists__more
 */
.updateLists__more {
	width: 320px;
	margin: auto auto 0;
}
@media screen and (max-width:768px){
	.updateLists__more {
		width: calc(336 / var(--vw-min) * 100vw);
	}
}

/*-----------------------------------------------
 * News
-------------------------------------------------*/
/**
 * common
 */
.newsWrap {
	background-color: rgba(0,0,0,.4);
	min-height: calc(100vh - 300px);
	padding: 80px 0 160px;
}
@media screen and (max-width:768px){
	.newsWrap {
		min-height: calc(100vh - 71.73333vw);
		padding: calc(100 / var(--vw-min) * 100vw) calc(48 / var(--vw-min) * 100vw) calc(160 / var(--vw-min) * 100vw);
	}
}

/**
 * newsLists
 */
.newsListsWrap {
	width: 880px;
	margin: -20px auto 0; /* "item > a"の"padding"分 */
}
@media screen and (max-width:768px){
	.newsListsWrap {
		width: 100%;
	}
}

/* a */
.newsLists__item > a {
	display: block;
	color: #fff;
	font-size: 16px;
	line-height: 2;
	padding: 20px 0;
	position: relative;
	text-decoration: none;
}
.newsLists--time {
	color: rgb(var(--color-right-green));
	font-size: 20px;
}
.newsLists--title {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}
@media screen and (max-width:768px){
	.newsLists__item > a {
		font-size: calc(24 / var(--vw-min) * 100vw);
		padding: calc(20 / var(--vw-min) * 100vw) 0 calc(24 / var(--vw-min) * 100vw);
	}
	.newsLists--time {
		font-size: calc(24 / var(--vw-min) * 100vw);
	}
}

/* line */
.newsLists__line1 {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 4px;
	background: #83a0a4;
	border-radius: 2px;
	z-index: 2;
}
.newsLists__line2 {
	position: absolute;
	right: -2px;
	bottom: 12px;
	width: 16px;
	height: 4px;
	background: #83a0a4;
	border-radius: 2px;
	transform: rotate(45deg);
	transform-origin: left bottom;
	overflow: hidden;
	z-index: 1;
}
.newsLists__line1:after {
	content: "";
	background-color: #fff;
	border-radius: 2px;
	width: 8%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 0;
}
.newsLists__line2:before {
	content: "";
	background-color: #fff;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}
@media screen and (max-width:768px){
	.newsLists__line1,
	.newsLists__line2 {
		height: 3px;
	}
	.newsLists__line2 {
		width: 12px;
		bottom: 8px;
	}
}

/* hover */
@media screen and (min-width:769px){
	.newsLists--title {
		transition: color .3s ease;
	}
	.newsLists__item > a:hover .newsLists--title {
		color: rgb(var(--color-right-green));
	}

	.newsLists__line1:before {
		content: "";
		background-color: rgb(var(--color-right-green));
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		transform: scale(0, 1);
		transform-origin: right top;
		transition: transform .3s ease;
	}
	.newsLists__item > a:hover .newsLists__line1:before {
		transform-origin: left top;
		transform: scale(1, 1);
	}

	.newsLists__line2:after {
		content: "";
		background-color: rgb(var(--color-right-green));
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		transform: scale(0, 1);
		transform-origin: left top;
		transition: transform .3s ease;
	}
	.newsLists__item > a:hover .newsLists__line2:after {
		transition-delay: .2s;
		transform-origin: right top;
		transform: scale(1, 1);
	}
}

/**
 * newsDetail
 */
.newsDetail {
	width: 880px;
	margin: 0 auto;
	padding-bottom: 80px;
	position: relative;
}
.newsDetail:before {
	content: "";
	background: #fff;
	width: 100%;
	height: 4px;
	border-radius: 2px;
	position: absolute;
	bottom: 0;
}
@media screen and (max-width:768px){
	.newsDetail {
		width: 100%;
		padding-bottom: calc(100 / var(--vw-min) * 100vw);
	}
	.newsDetail:before {
		height: 3px;
	}
}

/**
 * title
 */
.newsDetail__title {
	margin-bottom: 40px;
	padding-bottom: 36px;
	position: relative;
}
@media screen and (max-width:768px){
	.newsDetail__title {
		margin-bottom: calc(48 / var(--vw-min) * 100vw);
		padding-bottom: calc(48 / var(--vw-min) * 100vw);
	}
}

/* deco */
.newsDetail__title:before {
	content: "";
	width: 100%;
	height: 4px;
	background: #83a0a4;
	border-radius: 2px;
	position: absolute;
	bottom: 0;
}
@media screen and (max-width:768px){
	.newsDetail__title:before {
		height: 3px;
	}
}

/* time, text */
.newsDetail__time {
	color: rgb(var(--color-right-green));
	display: block;
	font-size: 20px;
}
.newsDetail__text {
	color: rgb(var(--color-right-green));
	display: block;
	font-size: 20px;
	line-height: 2;
}
@media screen and (max-width:768px){
	.newsDetail__time {
		font-size: calc(24 / var(--vw-min) * 100vw);
	}
	.newsDetail__text {
		font-size: calc(28 / var(--vw-min) * 100vw);
	}
}

/**
 * newsDetail__text
 */
 .newsDetail__textWrap {
	font-size: 16px;
	line-height: 2;
	word-break: break-all;
}
@media screen and (max-width:768px){
	.newsDetail__textWrap {
		font-size: calc(24 / var(--vw-min) * 100vw);
	}
}

/* p */
.newsDetail__textWrap > p:not(:first-of-type) {
	margin-top: 30px;
}
@media screen and (max-width:768px){
	.newsDetail__textWrap > p:not(:first-of-type) {
		margin-top: calc(40 / var(--vw-min) * 100vw);
	}
}

/* a */
.newsDetail__textWrap a {
	color: rgb(var(--color-right-green));
}

/* image */
.newsDetail__textWrap img{
    height: auto !important;
    max-width: 100%;
}
.newsDetail__textWrap img.aligncenter {
    margin: 0 auto;
    display: block;
}

/* iframe */
.newsDetail__textWrap .ytifWrap{
    display: block;
    position: relative;
	width: 640px;
	height: 360px;
}
@media screen and (max-width: 767px) {
	.newsDetail__textWrap .ytifWrap{
	    width: 100%;
		height: auto;
	    padding-top: 56.25%;
	}
}
.newsDetail__textWrap iframe[src*="youtube"]{
    border: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

/**
 * newsShareLists
 */
.newsShareLists {
	display: flex;
	align-items: center;
	margin-top: 80px;
}
@media screen and (max-width:768px){
	.newsShareLists {
		justify-content: center;
		margin-top: calc(80 / var(--vw-min) * 100vw);
	}
}

/* dt */
.newsShareLists > dt {
	color: #fff;
	font-size: 16px;
	line-height: 1;
	margin-right: 6px;
}
@media screen and (max-width:768px){
	.newsShareLists > dt {
		font-size: calc(24 / var(--vw-min) * 100vw);
		margin-right: 0;
	}
}

/* dd */
.newsShareLists > dd {
	width: 34px;
	height: 34px;
	margin-left: 10px;
}
@media screen and (max-width:768px){
	.newsShareLists > dd {
		width: calc(48 / var(--vw-min) * 100vw);
		height: calc(48 / var(--vw-min) * 100vw);
		margin-left: calc(48 / var(--vw-min) * 100vw);
	}
}

/* a */
.newsShareLists > dd > a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

/* icon */
.newsShareLists > dd > a:before {
	content: "";
	background-color: #fff;
	display: block;
	-webkit-mask: url(/wp-content/themes/gift_2023/assets/img/common/sns_x.svg) no-repeat center / contain;
	mask: url(/wp-content/themes/gift_2023/assets/img/common/sns_x.svg) no-repeat center / contain;
	width: 20px;
	height: 20px;
}
@media screen and (max-width:768px){
	.newsShareLists > dd > a:before {
		width: 100%;
		height: 100%;
	}
}

.newsShareLists > dd.is-twitter > a:before {
	-webkit-mask-image: url(/wp-content/themes/gift_2023/assets/img/common/sns_x.svg);
	mask-image: url(/wp-content/themes/gift_2023/assets/img/common/sns_x.svg);
}
.newsShareLists > dd.is-facebook > a:before {
	-webkit-mask-image: url(/wp-content/themes/gift_2023/assets/img/common/sns_fb_w.svg);
	mask-image: url(/wp-content/themes/gift_2023/assets/img/common/sns_fb_w.svg);
}
.newsShareLists > dd.is-line > a:before {
	-webkit-mask-image: url(/wp-content/themes/gift_2023/assets/img/common/sns_line_w.svg);
	mask-image: url(/wp-content/themes/gift_2023/assets/img/common/sns_line_w.svg);
}


/*-----------------------------------------------
 * System
-------------------------------------------------*/
/**
 * systemCont
 */
.systemCont {
	padding-bottom: 280px;
}
@media screen and (max-width:768px){
	.systemCont {
		background-color: rgba(0, 0, 0, .4);
		padding-bottom: calc(180 / var(--vw-min) * 100vw);
	}
}

/**
 * systemHead__movie
 */
.systemHead__movieWrap {
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
	pointer-events: none;
	position: relative;
	z-index: 1;
}
.systemHead__movie {
	background-color: #000;
	width: 100%;
	overflow: hidden;
	padding-top: 56.25%;
	position: relative;
}

/* iframe */
.systemHead__movie--iframe {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
}

/**
 * systemHead__textWrap
 */
.systemHead__textWrap {
	width: 880px;
	margin: -170px auto 0;
	position: relative;
	z-index: 2;
}
.systemHead__text {
	font-size: 16px;
	line-height: 3;
}
@media screen and (max-width:768px){
	.systemHead__textWrap {
		width: 100%;
		margin: -13.33333vw auto 0;
		padding: 0 calc(48 / var(--vw-min) * 100vw);
	}
	.systemHead__text {
		font-size: calc(24 / var(--vw-min) * 100vw);
		line-height: 2;
	}
}

/**
 * systemCont__one
 */
.systemCont__one {
	padding-top: 140px;
}
@media screen and (max-width:768px){
	.systemCont__one {
		padding-top: calc(160 / var(--vw-min) * 100vw);
	}
}

/**
 * systemAction
 */
/* topText */
.systemAction__topTextWrap {
	margin-top: 80px;
	margin-bottom: 80px;
}
.systemAction__topText {
	font-size: 16px;
	line-height: 2;
	text-align: center;
}
@media screen and (max-width:768px){
	.systemAction__topTextWrap {
		margin-top: calc(60 / var(--vw-min) * 100vw);
		margin-bottom: calc(60 / var(--vw-min) * 100vw);
		padding: 0 calc(48 / var(--vw-min) * 100vw);

	}
	.systemAction__topText {
		font-size: calc(24 / var(--vw-min) * 100vw);
		text-align: left;
	}
}

/**
 * systemPassengers
 */
/* topText */
.systemPassengers__topTextWrap {
	margin-top: 80px;
	margin-bottom: 80px;
}
.systemPassengers__topText {
	font-size: 16px;
	line-height: 2;
	text-align: center;
}
@media screen and (max-width:768px){
	.systemPassengers__topTextWrap {
		margin-top: calc(60 / var(--vw-min) * 100vw);
		margin-bottom: calc(60 / var(--vw-min) * 100vw);
		padding: 0 calc(48 / var(--vw-min) * 100vw);
	}
	.systemPassengers__topText {
		font-size: calc(24 / var(--vw-min) * 100vw);
		text-align: left;
	}
}

/**
 * slideArea
 */
.system__slideArea {
	position: relative;
	z-index: 2;
}
.system__slideWrap {
	width: 1200px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}
@media screen and (max-width:768px){
	.system__slideWrap {
		width: 100%;
	}
}

/* title */
.system__title {
	color: rgb(var(--color-right-green));
	font-size: 24px;
	position: absolute;
	top: 40px;
	left: 80px;
	z-index: 2;
}
.system__title > span {
	padding: 0 0.5em;
	position: relative;
}
.system__title:before {
	content: "";
	background-color: #000;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 52%;
	transform: translateY(-50%);
	z-index: 0;
}
@media screen and (max-width:768px){
	.system__title {
		font-size: calc(32 / var(--vw-min) * 100vw);
		top: calc(24 / var(--vw-min) * 100vw);
		left: 0;
	}
}

/* img */
.system__slideLists__imgWrap {
	width: 960px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}
.system__slideLists__imgWrap img {
	width: 100%;
	position: relative;
	z-index: 1;
}
@media screen and (max-width:768px){
	.system__slideLists__imgWrap {
		width: 100%;
	}
}

/**
 * slideThumbListsWrap
 */
.system__slideThumbListsWrap {
	width: 100%;
	margin: 0 auto;
	position: relative;
	bottom: 40px;
	z-index: 2;
}
@media screen and (max-width:768px){
	.system__slideThumbListsWrap {
		bottom: calc(24 / var(--vw-min) * 100vw);
	}
}

/* li */
.system__slideThumbLists > li {
	width: 240px;
	overflow: hidden;
	position: relative;
}
.system__slideThumbLists > li a {
	display: block;
	position: relative;
}
.system__slideThumbLists > li img {
	width: 100%;
	position: relative;
	z-index: 1;
}
@media screen and (max-width:768px){
	.system__slideThumbLists > li {
		width: calc(202 / var(--vw-min) * 100vw);
	}
}

/* cover */
.system__slideThumbLists > li a:before {
	content: "";
	background-color: rgba(0, 0, 0, .6);
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
}
.system__slideThumbLists > li a:after {
	content: "";
	background-color: rgba(var(--color-right-green),.4);
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	opacity: 0;
}

/* active */
.system__slideThumbLists > li a:before,
.system__slideThumbLists > li a:after {
	transition: opacity .3s ease;
}
.system__slideThumbLists > li.swiper-slide-active a:before,
.system__slideThumbLists > li a:hover:before {
	opacity: 0;
}
.system__slideThumbLists > li.swiper-slide-active a:after {
	opacity: 1;
}

/**
 * slide animation
 */
/* li */
.system__slideLists li {
	opacity: 0;
	transition: opacity .4s ease;
}
.system__slideLists li.swiper-slide-active {
	opacity: 1;
}

/* title */
.system__title:before {
	width: 0;
	transition: width .4s var(--easing-outquart);
}
.system__slideLists li.swiper-slide-active .system__title:before {
	transition-delay: .7s;
	width: 100%;
}
.system__title > span {
	display: inline-block;
	transform: translateY(20%);
	opacity: 0;
	transition: transform .6s ease,
				opacity .6s ease;
}
.system__slideLists li.swiper-slide-active .system__title > span {
	transition-delay: .9s;
	transform: translateY(0);
	opacity: 1;
}

/* img */
@keyframes slideani {
	from {
		width: 100%;
	}
	to {
		width: 0;
	}
}
.system__slideLists__imgWrap {
	opacity: 0;
	transition: opacity .6s ease;
}
.system__slideLists li.swiper-slide-active .system__slideLists__imgWrap {
	opacity: 1;
}

/*-----------------------------------------------
 * Character
-------------------------------------------------*/
.charaCont {
	background-color: rgba(0, 0, 0, .4);
	padding-top: 80px;
	padding-bottom: 160px;
}
@media screen and (max-width:768px){
	.charaCont {
		padding-top: calc(24 / var(--vw-min) * 100vw);
		padding-bottom: calc(180 / var(--vw-min) * 100vw);
	}
}

/**
 * charaListsWrap
 */
.charaListsWrap {
	width: 614px;
	margin: 80px auto 0;
}
.charaLists {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
@media screen and (max-width:768px){
	.charaListsWrap {
		width: calc(606 / var(--vw-min) * 100vw);
	}
}

/* item */
.charaLists__item {
	width: calc(100% / 3);
	display: flex;
	align-items: center;
	justify-content: center;
}

/* nth-child */
.charaLists__item:nth-child(3n + 1) {
	width: 100%;
	margin-top: -72px;
}
.charaLists__item:not(:nth-child(3n + 1)) {
	margin-top: -102px;
}
@media screen and (max-width:768px){
	.charaLists__item:nth-child(3n + 1) {
		margin-top: -9.6vw;
	}
	.charaLists__item:not(:nth-child(3n + 1)) {
		margin-top: -13.6vw;
	}
}

/* a */
.charaLists__item > a {
	border-radius: 50%;
	display: block;
	width: 204px;
	height: 204px;
	position: relative;
}
@media screen and (max-width:768px){
	.charaLists__item > a {
		width: 27.2vw;
		height: 27.2vw;
	}
}

/* deco */
.charaLists__item > a:before {
	content: "";
	background: url(/wp-content/themes/gift_2023/assets/img/character/chara_thumb_frame.png) no-repeat center / contain;
	width: 100%;
	height: 100%;
	pointer-events: none;
	position: absolute;
	top: 0;
	z-index: 1;
}

/* bg */
.charaLists__item__bg {
	background-color: rgb(var(--color-off-white));
	border-radius: 50%;
	width: calc(100% - 16px);
	height: calc(100% - 16px);
	overflow: hidden;
	margin: auto;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 0;
}
.charaLists__item__bg:before {
	content: "";
	background-color: rgb(var(--color-right-green));
	position: absolute;
	bottom: -200%;
	left: -50%;
	border-radius: 50% 50% / 50% 70%;
	width: 200%;
	height: 200%;
}
@media screen and (max-width:768px){
	.charaLists__item__bg {
		width: calc(100% - calc(16 / var(--vw-min) * 100vw));
		height: calc(100% - calc(16 / var(--vw-min) * 100vw));
	}
}

/* img */
.charaLists__item__imgWrap {
	width: 100%;
	height: 100%;
	margin: auto;
	pointer-events: none;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
}
.charaLists__item__imgWrap img {
	width: 95.59%;
	position: absolute;
	bottom: 7px;
	margin: auto;
	right: 0;
	left: 0;
}
@media screen and (max-width:768px){
	.charaLists__item__imgWrap img {
		bottom: calc(7 / var(--vw-min) * 100vw);
	}
}

/* hover */
.charaLists__item__bg:before {
	transition: bottom 2.5s ease;
}
.charaLists__item > a:hover .charaLists__item__bg:before {
	bottom: -100%;
	animation: wave-anime linear 6s infinite;
}
.charaLists__item > a:before {
	transition: transform 2s ease;
}
.charaLists__item > a:hover:before {
	transform: rotate(90deg);
}
@keyframes wave-anime {
	from {
		transform: rotate(0);
	}
	to {
		transform: rotate(360deg);
	}
}

/**
 * charaModal
 */
.charaModal {
	-webkit-overflow-scrolling: touch;
	background-color: rgba(42,78,81,.9);
	-webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
	overflow: auto;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 10000;
	opacity: 0;
	pointer-events: none;
	transition: opacity .5s ease;
}
.charaModal.is-active {
	opacity: 1;
	pointer-events: auto;
}

/* inner */
.charaModal__inner {
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 1;
}
.charaModal__cont {
	display: flex;
	justify-content: center;
	align-items: center;
	height: auto;
	width: 100%;
	min-width: 1200px;
	min-height: 100%;
	margin: 0 auto;
	position: relative;
}
@media screen and (max-width:768px){
	.charaModal__cont {
		min-width: 100%;
	}
}

/* close */
.charaModal__close {
	display:block;
	position:fixed;
	right:0;
	top:0;
	width:80px;
	height:80px;
	overflow:hidden;
	z-index: 2;
}
.charaModal__close a {
	display: block;
	width: 100%;
	height: 100%;
}
.charaModal__close a:before,
.charaModal__close a:after{
	content:'';
	position:absolute;
	left:-20px;
	right:-20px;
	top:50%;
	margin-top:-2px;
	height:4px;
	background:#FFF;
	transition:all 0.3s ease;
}
.charaModal__close a:before{
	transform:rotate(45deg)
}
.charaModal__close a:after{
	transform:rotate(-45deg)
}
.charaModal__close a:hover:before,
.charaModal__close a:hover:after{
	background:#337576;
}
@media screen and (max-width:768px){
	.charaModal__close {
		width:12.8vw;
		height:12.8vw;
	}
}

/* one */
.charaModal__one {
	display: none;
	width: 100%;
	padding: 80px 0;
	position: relative;
}
@media screen and (max-width:768px){
	.charaModal__one {
		padding: calc(48 / var(--vw-min) * 100vw) 0;
	}
}

/* flex */
.charaModal__flex {
	display: flex;
	width: 980px;
	margin: 0 auto;
}
.charaModal__flex__left,
.charaModal__flex__right {
	width: 50%;
}
@media screen and (max-width:768px){
	.charaModal__flex {
		flex-direction: column;
		width: 100%;
	}
	.charaModal__flex__left,
	.charaModal__flex__right {
		width: 100%;
		padding: 0 calc(90 / var(--vw-min) * 100vw);
	}
	.charaModal__flex__right {
		margin-top: calc(48 / var(--vw-min) * 100vw);
	}
}

/* img */
.charaModal__imgWrap,
.charaModal__imgWrap img {
	width: 100%;
}

/* name */
.charaModal__name {
	color: rgb(var(--color-right-green));
	font-size: 32px;
	font-weight: 700;
	margin-bottom: 1em;
	padding-bottom: 1em;
	position: relative;
}
.charaModal__name:after {
	content: "";
	background-color: rgba(255,255,255,.4);
	border-radius: 4px;
	display: block;
	width: 40px;
	height: 4px;
	position: absolute;
	bottom: 0;
}
@media screen and (max-width:768px){
	.charaModal__name {
		font-size: calc(40 / var(--vw-min) * 100vw);
	}
	.charaModal__name:after {
		width: calc(48 / var(--vw-min) * 100vw);
	}
}

/* text */
.charaModal__text {
	font-size: 16px;
	line-height: 2;
}
@media screen and (max-width:768px){
	.charaModal__text {
		font-size: calc(24 / var(--vw-min) * 100vw);
	}
}

/* pager */
.charaModal__pager {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 120px;
	height: 120px;
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	z-index: 100;
}
.charaModal__pager:before {
	content: '';
	box-sizing: border-box;
	width: 60px;
	height: 60px;
	margin: auto;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	transform: rotate(45deg);
    transition: all 0.3s ease;
}
@media screen and (max-width:768px){
	.charaModal__pager {
		width: calc(120 / var(--vw-min) * 100vw);
		height: calc(120 / var(--vw-min) * 100vw);
	}
	.charaModal__pager:before {
		width: calc(60 / var(--vw-min) * 100vw);
		height: calc(60 / var(--vw-min) * 100vw);
	}
}
.charaModal__pager.is-noPointer {
	pointer-events: none;
}

/* prev, next */
.charaModal__pager.is-prev {
	left: 0;
}
.charaModal__pager.is-next {
	right: 0;
}
.charaModal__pager.is-prev:before {
	border-left: 4px solid #FFF;
    border-bottom: 4px solid #FFF;
	left: 26%;
}
.charaModal__pager.is-next:before {
	border-top: 4px solid #FFF;
	border-right: 4px solid #FFF;
	right: 26%;
}

/* hover */
@media screen and (min-width:769px){
	.charaModal__pager:hover.is-prev:before {
		right: 18%;
	}
	.charaModal__pager:hover.is-next:before {
		left: 18%;
	}
}


/*-----------------------------------------------
 * Cookie policy
-------------------------------------------------*/
/**
 * cookieWrap
 */
.cookieWrap {
	width: 880px;
	margin: 0 auto 280px;
}
@media screen and (max-width:768px){
	.cookieWrap {
		width: 100%;
		margin: 0 auto calc(180 / var(--vw-min) * 100vw);
		padding: 0 calc(48 / var(--vw-min) * 100vw);
	}
}


/*-----------------------------------------------
 * Products
-------------------------------------------------*/
/**
 * productNav
 */
.productNav {
	margin-top: 40px;
}
@media screen and (max-width:768px){
	.productNav {
		width: 100%;
		margin-top: calc(40 / var(--vw-min) * 100vw);
		order: 3;
	}
}

/* lists */
.productNavLists {
	display: flex;
	align-items: center;
	justify-content: center;
}
@media screen and (max-width:768px){
	.productNavLists {
		padding: 0 calc(48 / var(--vw-min) * 100vw);
	}
}

/* li */
.productNavLists > li {
	width: 320px;
}
.productNavLists > li:not(:first-child) {
	margin-left: 20px;
}
.productNavLists > li > a {
	font-weight: 700;
	position: relative;
}
@media screen and (max-width:768px){
	.productNavLists > li {
		width: calc((100% - 10px) / 2);
	}
	.productNavLists > li:not(:first-child) {
		margin-left: 10px;
	}
}

/* arrow */
.productNavLists > li > a:before {
	content: '';
	width: 8px;
	height: 8px;
	border-top: solid 3px #fff;
	border-right: solid 3px #fff;
	position: absolute;
	top: 13px;
	right: 20px;
	transform: rotate(135deg);
	transition: border-color .3s ease;
}
.productNavLists > li > a:hover:before {
	border-color: #000;
}
@media screen and (max-width:768px){
	.productNavLists > li > a:before {
		border-width: 2px;
		width: calc(10 / var(--vw-min) * 100vw);
		height: calc(10 / var(--vw-min) * 100vw);
		top: calc(18 / var(--vw-min) * 100vw);
		right: calc(24 / var(--vw-min) * 100vw);
	}
}

/**
 * productCont
 */
.productCont {
	padding-bottom: 280px;
}
@media screen and (max-width:768px){
	.productCont {
		background-color: rgba(0, 0, 0, .4);
		padding-top: calc(80 / var(--vw-min) * 100vw);
		padding-bottom: calc(180 / var(--vw-min) * 100vw);
	}
}

/**
 * productOne
 */
.productOne {
	margin-bottom: 80px;
}
@media screen and (max-width:768px){
	.productOne {
		margin-bottom: calc(80 / var(--vw-min) * 100vw);
	}
}

/* title */
.productOne__title {
	color: rgb(var(--color-right-green));
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-size: 28px;
	font-weight: 700;
	margin-bottom: 40px;
	position: relative;
	text-align: center;
}
.productOne__title:after {
	content: "";
	background-color: rgba(255,255,255,.4);
	border-radius: 4px;
	display: block;
	width: 40px;
	height: 4px;
	margin-top: 8px;
}
.productOne__title.is-en {
	font-size: 48px;
	font-weight: 500;
}
@media screen and (max-width:768px){
	.productOne__title {
		font-size: calc(36 / var(--vw-min) * 100vw);
		margin-bottom: calc(40 / var(--vw-min) * 100vw);
	}
	.productOne__title:after {
		width: calc(48 / var(--vw-min) * 100vw);
	}
	.productOne__title.is-en {
		font-size: 8vw;
	}
}

/**
 * linkLists
 */
.productOne__linkLists {
	width: 660px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
}
@media screen and (max-width:768px){
	.productOne__linkLists {
		width: 100%;
		display: block;
		padding: 0 calc(48 / var(--vw-min) * 100vw);
	}
}

/* li */
.productOne__linkLists > li {
	width: calc((100% - 20px) / 2);
	height: 80px;
	margin-bottom: 20px;
}
.productOne__linkLists > li:not(:nth-child(2n + 1)) {
	margin-left: 20px;
}
@media screen and (max-width:768px){
	.productOne__linkLists > li {
		width: 100%;
		height: calc(120 / var(--vw-min) * 100vw);
		margin-bottom: 0;
	}
	.productOne__linkLists > li:not(:nth-child(2n + 1)) {
		margin-left: 0;
	}
	.productOne__linkLists > li:not(:first-child) {
		margin-top: calc(20 / var(--vw-min) * 100vw);
	}
}

/* a */
.productOne__linkLists > li > a {
	background-color: #000;
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	text-decoration: none;
}
.productOne__linkLists > li.is-standby > a {
	background-color: #5a5a5a;
	pointer-events: none;
}

/* img */
.productOne__linkLists__img {
	width: 100%;
	height: 46px;
	object-fit: contain;
	object-position: center;
}
.productOne__linkLists__img.is-steam { height: 46px; }
.productOne__linkLists__img.is-switch { height: 32px; }
.productOne__linkLists__img.is-ps5 { height: 34px; }
.productOne__linkLists__img.is-xbox { height: 30px; }
@media screen and (max-width:768px){
	.productOne__linkLists__img {
		height: calc(46 / var(--vw-min) * 100vw);
	}
	.productOne__linkLists__img.is-steam {height: calc(68 / var(--vw-min) * 100vw);}
	.productOne__linkLists__img.is-switch {height: calc(50 / var(--vw-min) * 100vw);}
	.productOne__linkLists__img.is-ps5 {height: calc(52 / var(--vw-min) * 100vw);}
	.productOne__linkLists__img.is-xbox {height: calc(44 / var(--vw-min) * 100vw);}
}

/* cs */
.productOne__linkLists__cs {
	color: #fff;
	font-size: 14px;
	line-height: 1;
	margin-top: 0.5em;
}
@media screen and (max-width:768px){
	.productOne__linkLists__cs {
		font-size: calc(20 / var(--vw-min) * 100vw);
		margin-top: 0.8em;
	}
}

/**
 * deviceLists
 */
.productOne__device {
	color: #fff;
	font-size: 20px;
	text-align: center;
}
@media screen and (max-width:768px){
	.productOne__device {
		font-size: calc(24 / var(--vw-min) * 100vw);
	}
}

/**
 * productTokuten
 */
.productTokuten {
	margin-top: 40px;
}
@media screen and (max-width:768px){
	.productTokuten {
		margin-top: calc(40 / var(--vw-min) * 100vw);
	}
}
.othersList{
	margin-top: 80px;
}
@media screen and (max-width:768px){
	.othersList {
		margin-top: calc(60 / var(--vw-min) * 100vw);
	}
}
/* title */
.productTokuten__title {
	color: rgb(var(--color-right-green));
	font-size: 24px;
	font-weight: 700;
	text-align: center;
}
.productTokuten__title > span {
	background-color: #000;
	padding: 0 0.5em;
}
@media screen and (max-width:768px){
	.productTokuten__title {
		font-size: calc(30 / var(--vw-min) * 100vw);
	}
}

/**
 * productTokutenLists
 */
.productTokutenLists {
	width: 660px;
	margin: 40px auto 0;
	background-color: rgba(0, 0, 0, .4);
	border-radius: 30px;
	padding: 40px;
}
.productTokutenLists .productOne__linkLists{
	width: 100%;

}

@media screen and (max-width:768px){
	.productTokutenLists {
		width: 100%;
		margin: calc(40 / var(--vw-min) * 100vw) auto 0;
		padding: 0 calc(48 / var(--vw-min) * 100vw);

	}
}

/* item, dt, dd */
.productTokutenLists__item {
	/*background-color: rgba(0, 0, 0, .4);
	border-radius: 30px;
	padding: 40px;*/
}
.productTokutenLists__dt {
	font-size: 24px;
	font-weight: 700;
	text-align: center;
}
.productTokutenLists__dd {
	margin-top: 40px;
}
/*othersList*/
.othersList .productTokutenLists__dd {
	margin-top: 0;
}
.othersList .productOne__linkLists > li {
    margin-bottom: 40px;
}
.othersList .productTokutenLists__link {
    margin-top: 20px;
}
@media screen and (max-width:768px){
	.productTokutenLists__item {
		border-radius: calc(30 / var(--vw-min) * 100vw);
		padding: calc(48 / var(--vw-min) * 100vw);
	}
	.productTokutenLists__dt {
		font-size: calc(28 / var(--vw-min) * 100vw);
	}
	.productTokutenLists__dd {
		margin-top: calc(40 / var(--vw-min) * 100vw);
	}
	/*othersList*/
	.othersList .productTokutenLists__dd {
		margin-top: calc(40 / var(--vw-min) * 100vw);
	}
	.othersList .productOne__linkLists > li {
		margin-bottom: 0;
	}
	.othersList .productTokutenLists__link {
		margin-top: 0;
	}



}

/* img */
.productTokutenLists__imgWrap {
	width: 320px;
	margin: 0 auto;
}
.productTokutenLists__imgWrap img {
	width: 100%;
}
.productTokutenLists__imgWrap > figcaption {
	font-size: 16px;
	margin-top: 1em;
	text-align: center;
}
@media screen and (max-width:768px){
	.productTokutenLists__imgWrap {
		width: 100%;
	}
	.productTokutenLists__imgWrap > figcaption {
		font-size: calc(20 / var(--vw-min) * 100vw);
	}
}

/* link */
.productTokutenLists__link {
	font-weight: 700;
	margin-top: 40px;
}
@media screen and (max-width:768px){
	.productTokutenLists__link {
		margin-top: calc(40 / var(--vw-min) * 100vw);
	}
}
/**
 * Special
 */
 /*movie*/
 .special .contentsArea{
	width: 660px;
	margin: 0 auto;
	padding-bottom: 280px;
 }
 .special .contentsTtl{
	color: #000;
    line-height: 1;
    font-size: 30px;
    margin-bottom: 40px;
    text-align: center;
 }
 .special .movieBox{
	display: flex;
	flex-wrap: wrap;
    justify-content: space-between;
 }
 .special .movieBox__item{
	width: 48%;
	margin-bottom: 40px;
 }
 .special .movie_thumb{
	overflow: hidden;
	background-color: #000;
	border-radius: 10px;
 }
 .special .movie_thumb img{
	width: 100%;
	height: auto;
	opacity: .5;
	transition: all .6s ease;
 }
 .special .movie_thumb:hover img{
	transform: scale(1.03);
	opacity: 1;
 }
 .special .movieBox__item a{
	display: flex;
	position: relative;
 }
 .special .movieBox__item .movie_ttl{
	font-size: 16px;
	line-height: 1.6;
	padding: 0 10px;
	margin-top: 10px;
 }
 @media screen and (max-width:768px){
	.special .contentsArea{
		width: 100%;
		padding-bottom: calc(140 / var(--vw-min) * 100vw);
	 }
	 .special .contentsTtl{
		font-size: calc(36 / var(--vw-min) * 100vw);
		margin-bottom: calc(40 / var(--vw-min) * 100vw);
	 }
	 .special .movieBox{
		flex-direction: column;
		align-items: center;
	 }
	 .special .movieBox__item{
		width: 80%;
		margin-bottom: calc(40 / var(--vw-min) * 100vw);
	 }
	 .special .movieBox__item .movie_ttl{
		margin-top: calc(10 / var(--vw-min) * 100vw);
		font-size: calc(16 / var(--vw-min) * 100vw);
	 }
}
 /*movie__movieCircle*/
 .movie__movieCircle{
	width:101px;
	height:101px;
	position:absolute;
	margin: auto;
	right:0;
	bottom:0;
	top: 0;
	left: 0;
	z-index: 2;
}
.movie__movieCircle:before{
	content:'';
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	background:url(/wp-content/themes/gift_2023/assets/img/common/circle_movie.svg) no-repeat center center / contain;
}
.special .movie_thumb:hover .movie__movieCircle:before{
	animation:rotate 15s ease forwards;
}
@keyframes rotate{
	0%{
		transform:rotate(0);
	}
	100%{
		transform:rotate(720deg);
	}
}
.movie__movieCircle:after{
	content:'';
	position:absolute;
	width:28px;
	left:50%;
	top:0;
	bottom:0;
	margin-left:-14px;
	background:url(/wp-content/themes/gift_2023/assets/img/common/icon_play.svg) no-repeat center center / contain;
}
@media screen and (max-width:768px){
	.movie__movieCircle{
		width:16.2666vw;
		height:16.2666vw;
	}
	.movie__movieCircle:after{
		width:4.6666vw;
		margin-left:-2.3333vw;
	}
}