@charset "utf-8";
/* ==========================================================================
	Setting
============================================================================= */

:root {
	
	/* MVスライダー */
	--sliderW: clamp(320px, 40vw, 560px);
	--depth: calc(var(--sliderW) * 1.25);
	--radius: .5rem;
	
	/* ロゴサイズ */
	--logo-size--pc: 240px;
	--logo-size--tab: 180px;
	--logo-size--sp: 120px;
	
	/* フォントサイズ */
	font-size:1.11111111111vw;
	--font-size--2x-small: .5rem;		/* 8px */
	--font-size--x-small: .750rem;		/* 12px */
	--font-size--small: .875rem;		/* 14px */
	--font-size--medium: 1rem;			/* 16px */
	--font-size--large: 1.125rem;		/* 18px */
	--font-size--x-large: 1.5rem;		/* 24px */
	--font-size--2x-large: 2rem;		/* 32px */
	--font-size--3x-large: 2.5rem;		/* 40px */
	--font-size--4x-large: 3rem;		/* 48px */
	--font-size--5x-large: 3.5rem;		/* 56px */
	--font-size--6x-large: 4rem;		/* 64px */
	--font-size--7x-large: 4.5rem;		/* 72px */
	--font-size--8x-large: 5rem;		/* 80px */
	--font-size--9x-large: 5.5rem;		/* 88px */	
	/* フォントファミリー */
	--font-family--jp:'Satoshi', "Noto Sans JP", Roboto, "Helvetica Neue", Arial, sans-serif;
	
	/* ブレークポイント定義 */
	--break-points--smallHeader: 1300px;
	--break-points--tab: 900px;
	--break-points--sp: 768px;
	
	/* 背景カラー */
	--color-bg: #fff;
	--blur-color: hsla(320, 80%, 70%, 0.65);
	--color: pink;
	--blur-1-size: clamp(400px, 60vw, 60vw);
	--blur-2-size: clamp(300px, 40vw, 40vw);
	--blur-3-size: clamp(100px, 10vw, 10vw);
	--blur-amount: clamp(40px, 5vw, 90px);

	/* フォントカラー */
	--color-font:#222;
	--color-font2: rgba(0,0,0,0.8);
	--color-font3: rgba(255,255,255,0.8);
	--color-font4: rgba(0,0,0,0.3);
	--color-font5: rgba(255,255,255,0.3);
	--color-font6: #ddd;
	--key-color:#F7930F;
	
	/* コンテンツ幅 */
	--contents--2x-small: 600px;
	--contents--x-small: 900px;
	--contents--small: 1100px;
	--contents--medium: 1300px;
	--contents--large: 1440px;
	--contents--full: 100%;
	
	/* ヘッダーの高さ */
	--header--heightPc: 150px;
	--header--heightSp: 100px;
	
	/* パッディング幅 */
	--padding--x-small: .5rem;
	--padding--small: 1rem;
	--padding--medium: 1.5rem;
	--padding--large: 2rem;
	--padding--x-large: 2.5rem;
	--padding--2x-large: 3rem;
	--padding--3x-large: 3.5rem;
	--padding--4x-large: 4rem;
	--padding--5x-large: 4.5rem;
	--padding--6x-large: 5rem;
	--padding--7x-large: 5.5rem;
	--padding--tb-sp: 80px;
	--padding--tb-pc: 220px;
	
	/* マージン幅 */
	--margin--x-small: .5rem;
	--margin--small: 1rem;
	--margin--medium: 1.5rem;
	--margin--large: 2rem;
	--margin--x-large: 2.5rem;
	--margin--2x-large: 3rem;
	--margin--3x-large: 3.5rem;
	--margin--4x-large: 4rem;
	--margin--5x-large: 4.5rem;
	--margin--6x-large: 5rem;
	--margin--7x-large: 5.5rem;
	--margin--tb-sp: 80px;
	--margin--tb-pc: 220px;
	
	/* 文字の太さ */
	--font-weight--x-small: 100;
	--font-weight--small: 200;
	--font-weight--medium: 300;
	--font-weight--large: 400;
	--font-weight--x-large: 500;
	--font-weight--2x-large: 600;
	--font-weight--3x-large: 700;
	--font-weight--4x-large: 800;
	--font-weight--5x-large: 900;
	
	/* 行間隔の幅 */
	--line-height--x-small: 1;
	--line-height--small: 1.25;
	--line-height--medium: 1.5;
	--line-height--large: 1.75;
	--line-height--x-large: 2;
	
	/* 文字間隔の幅 */
	--letter-spacing--x-small: 0em;
	--letter-spacing--small: .025em;
	--letter-spacing--medium: .05em;
	--letter-spacing--large: .075em;
	--letter-spacing--x-large: .1em;
	
	/* gap幅 */
	--gap--3x-small: .5rem;
	--gap--2x-small: .750rem;
	--gap--x-small: .5rem;
	--gap--small: 1rem;
	--gap--medium: 1.5rem;
	--gap--large: 2rem;
	--gap--x-large: 2.5rem;
	--gap--2x-large: 3rem;
	--gap--3x-large: 3.5rem;
	--gap--4x-large: 4rem;
	--gap--5x-large: 4.5rem;
	
	/* 透過 */
	--opacity--x-small: .4;
	--opacity--small: .6;
	--opacity--medium: .8;
	--opacity--large: 1;
	
	
	
}