@charset "utf-8";

*,
*::before,
*::after {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
/*-----------------------------------------------
 * 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 {
	/* デザインサイズ */
	--vw-min: 1200;
	--vh-min: 640;
	--max-percent: 1.6;/* 1920/1200 */

	/* フォント  */
	--font-ja: "Noto Sans JP", sans-serif;
	--font-serif: "Noto Serif JP", serif;
	--font-main: 'Noto Sans JP', "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;

	/* カラー */
	--color-blue: #0072ff;
	--color-blue-light: #00a6ff;
	--color-blue-deep: #0058c7;
	--color-text: #1a1a1a;
	--color-muted: #666;
	--color-bg: #f0f7ff;
	--color-white: #fff;
	--radius: 8px;

	/* easing */
	--easing-outquart: cubic-bezier(0.25, 1, 0.5, 1);
}
@media screen and (max-width:768px){
	:root {
		--vw-min: 750;
	}
}


html {
	-webkit-text-size-adjust: 100%;
}

body {
	color: var(--color-text);
	font-family: var(--font-main);
	font-feature-settings: "palt";
	font-size: 16px;
	font-weight: 400;
	letter-spacing: 0.04em;
	line-height: 1.7;
	min-height: 100vh;
	word-wrap: break-word;
}
/**
 * Wrap
 * 大枠のwrap指定
 */
/* fullWrap */
#fullWrap {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	position: relative;
	z-index: 1;
	padding: min(calc(40 / var(--vw-min) * 100vw), 40px) 0 min(calc(80 / var(--vw-min) * 100vw), 80px);
}
#fullWrap::after {
	position: fixed;
	content: "";
	background-image: url(../img/bg.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	z-index: -1;
}

img {
	border: 0;
	max-width: 100%;
	vertical-align: bottom;
}

a {
	color: inherit;
	text-decoration: none;
}

ul {
	list-style: none;
}

.header {
	margin-bottom: 36px;
	text-align: center;
}

.header__logo {
	margin: 0 auto 8px;
	width: min(calc(350 / var(--vw-min) * 100vw), 350px);
}

@media screen and (max-width:768px){
	.header__logo {
		width: calc(400 / var(--vw-min) * 100vw);
	}
}

.header__logo a {
	display: block;
}

.header__logo img {
	display: block;
	height: auto;
	width: 100%;
}

.main {
	flex: 1;
	width: min(calc(500 / var(--vw-min) * 100vw), 500px);
	margin: 0 auto;
}
@media screen and (max-width:768px){
	.main {
		width: 100%;
		padding: 0 calc(40 / var(--vw-min) * 100vw);
	}
}

.linkLists{
	display: flex;
	flex-direction: column;
	gap: min(calc(20 / var(--vw-min) * 100vw), 20px);
}

.linkItem__link {
	align-items: center;
    background: rgba(255, 255, 255, .3);
    backdrop-filter: blur(8px);
	border: 1px solid var(--color-blue-light);
	border-radius: var(--radius);
	box-shadow: 0 min(calc(4 / var(--vw-min) * 100vw), 4px) min(calc(16 / var(--vw-min) * 100vw), 16px) rgba(0, 114, 255, 0.08);
	color: var(--color-text);
	display: flex;
	font-size:min(calc(18 / var(--vw-min) * 100vw), 18px);
	font-weight: 500;
	gap: min(calc(10 / var(--vw-min) * 100vw), 10px);
	justify-content: center;
	padding: min(calc(14 / var(--vw-min) * 100vw), 14px) min(calc(20 / var(--vw-min) * 100vw), 20px);
	text-align: center;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
	height: min(calc(90 / var(--vw-min) * 100vw), 90px);
	position: relative;
}

@media screen and (max-width:768px){
	.linkItem__link {
		font-size:calc(26 / var(--vw-min) * 100vw);
		height: calc(120 / var(--vw-min) * 100vw);
	}
}
.linkItem__ic {
	background-color: currentColor;
	display: block;
	flex-shrink: 0;
	height: min(calc(32 / var(--vw-min) * 100vw), 32px);
	width: min(calc(32 / var(--vw-min) * 100vw), 32px);
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
	position: absolute;
	left: min(calc(30 / var(--vw-min) * 100vw), 30px);
	top: 50%;
	transform: translateY(-50%);
}
@media screen and (max-width:768px){
	.linkItem__ic {
		height: calc(40 / var(--vw-min) * 100vw);
		width: calc(40 / var(--vw-min) * 100vw);
		left: calc(30 / var(--vw-min) * 100vw);
	}
}

.linkItem__ic.ic_official {
	-webkit-mask-image: url(../img/icon_home.svg);
	mask-image: url(../img/icon_home.svg);
}

.linkItem__ic.ic_x {
	-webkit-mask-image: url(../img/icon_x.svg);
	mask-image: url(../img/icon_x.svg);
	width: min(calc(28 / var(--vw-min) * 100vw), 28px);
}
@media screen and (max-width:768px){
	.linkItem__ic.ic_x {
		width: calc(34 / var(--vw-min) * 100vw);
	}
}

.linkItem__ic.ic_tiktok {
	-webkit-mask-image: url(../img/icon_t.svg);
	mask-image: url(../img/icon_t.svg);
}

.linkItem__ic.ic_instagram {
	-webkit-mask-image: url(../img/icon_ig.svg);
	mask-image: url(../img/icon_ig.svg);
}

.linkItem__ic.ic_line {
	-webkit-mask-image: url(../img/icon_line.svg);
	mask-image: url(../img/icon_line.svg);
}

.linkItem__ic.ic_spotify {
	-webkit-mask-image: url(../img/icon_spotify.svg);
	mask-image: url(../img/icon_spotify.svg);
}

.linkItem__ic.ic_youtube {
	-webkit-mask-image: url(../img/icon_yt.svg);
	mask-image: url(../img/icon_yt.svg);
}

.linkItem__ic.ic_form {
	-webkit-mask-image: url(../img/icon_form.svg);
	mask-image: url(../img/icon_form.svg);
}

a.linkItem__link:hover {
	background: var(--color-blue);
	border-color: var(--color-blue);
	box-shadow: 0 8px 24px rgba(0, 114, 255, 0.28);
	color: var(--color-white);
	transform: translateY(-2px);
}

a.linkItem__link:active {
	background: var(--color-blue-deep);
	border-color: var(--color-blue-deep);
	transform: translateY(0);
}

.linkItem__link.is-soon {
	background: #f5f5f5;
	border-color: #e0e0e0;
	box-shadow: none;
	color: var(--color-muted);
	cursor: default;
	pointer-events: none;
}

.linkItem__link.is-soon {
    background: rgba(255, 255, 255, .3);
    backdrop-filter: blur(8px);
    border-color: #e0e0e0;
    box-shadow: none;
    color: var(--color-muted);
    cursor: default;
    pointer-events: none;
}

.linkItem__txt {
	line-height: 1.2;
}
.linkItem__link.is-soon .linkItem__txt,
.linkItem__link.is-soon .linkItem__ic {
	opacity: 0.5;
}

@media (hover: none) {
	a.linkItem__link:hover {
		background: var(--color-white);
		border-color: var(--color-blue-light);
		box-shadow: 0 4px 16px rgba(0, 114, 255, 0.08);
		color: var(--color-text);
		transform: none;
	}

	a.linkItem__link:active {
		background: var(--color-blue);
		border-color: var(--color-blue);
		color: var(--color-white);
	}
}