@charset "utf-8";

:root {

	/* サイズ */
	--Size_10: 1.0rem;
	--BaseSize: var(--Size_10);

	
	/* 白 #FFFFFF */
	--Color_FF: rgba( 255, 255, 255, 1.00 );
	--Color_FF100: rgba( 255, 255, 255, 1.00 );
	--Color_FF080: rgba( 255, 255, 255, 0.80 );
	--Color_FF060: rgba( 255, 255, 255, 0.60 );
	--Color_FF040: rgba( 255, 255, 255, 0.40 );
	--Color_FF020: rgba( 255, 255, 255, 0.20 );
	--Color_FF000: rgba( 255, 255, 255, 0.00 );
	
	/* 白 #F5F5F5 */
	--Color_BG: #f3f4f0;
	
	/* 白 #D4D4D4 */
	--Color_D4: rgba( 212, 212, 212, 1.00 );

	/* グレー */
	--Color_1D100: rgba( 29, 29, 29, 1.00 );
	--Color_1D090: rgba( 29, 29, 29, 0.90 );
	--Color_1D080: rgba( 29, 29, 29, 0.80 );
	--Color_1D070: rgba( 29, 29, 29, 0.70 );
	--Color_1D060: rgba( 29, 29, 29, 0.60 );
	--Color_1D050: rgba( 29, 29, 29, 0.50 );
	--Color_1D040: rgba( 29, 29, 29, 0.40 );
	--Color_1D030: rgba( 29, 29, 29, 0.30 );
	--Color_1D020: rgba( 29, 29, 29, 0.20 );
	--Color_1D010: rgba( 29, 29, 29, 0.10 );
	--Color_1D005: rgba( 29, 29, 29, 0.05 );
	--Color_1D000: rgba( 29, 29, 29, 0.00 );
	

	/* 神田カラー #6f5091 */
	--Color_K: #6f5091;
	--Color_K100: rgba( 111, 80, 145, 1.00 );
	--Color_K090: rgba( 111, 80, 145, 0.90 );
	--Color_K080: rgba( 111, 80, 145, 0.80 );
	--Color_K070: rgba( 111, 80, 145, 0.70 );
	--Color_K060: rgba( 111, 80, 145, 0.60 );
	--Color_K050: rgba( 111, 80, 145, 0.50 );
	--Color_K040: rgba( 111, 80, 145, 0.40 );
	--Color_K030: rgba( 111, 80, 145, 0.30 );
	--Color_K020: rgba( 111, 80, 145, 0.20 );
	--Color_K010: rgba( 111, 80, 145, 0.10 );
	--Color_K005: rgba( 111, 80, 145, 0.05 );
	--Color_K000: rgba( 111, 80, 145, 0.00 );

	/* 大阪カラー #975785 */
	--Color_O: #975785;
	--Color_O100: rgba( 151, 87, 133, 1.00 );
	--Color_O090: rgba( 151, 87, 133, 0.90 );
	--Color_O080: rgba( 151, 87, 133, 0.80 );
	--Color_O070: rgba( 151, 87, 133, 0.70 );
	--Color_O060: rgba( 151, 87, 133, 0.60 );
	--Color_O050: rgba( 151, 87, 133, 0.50 );
	--Color_O040: rgba( 151, 87, 133, 0.40 );
	--Color_O030: rgba( 151, 87, 133, 0.30 );
	--Color_O020: rgba( 151, 87, 133, 0.20 );
	--Color_O010: rgba( 151, 87, 133, 0.10 );
	--Color_O005: rgba( 151, 87, 133, 0.05 );
	--Color_O000: rgba( 151, 87, 133, 0.00 );

	/* 那覇カラー #8f2e14 */
	--Color_N: #ee7948;
	--Color_N100: rgba( 238, 121, 72, 1.00 );
	--Color_N090: rgba( 238, 121, 72, 0.90 );
	--Color_N080: rgba( 238, 121, 72, 0.80 );
	--Color_N070: rgba( 238, 121, 72, 0.70 );
	--Color_N060: rgba( 238, 121, 72, 0.60 );
	--Color_N050: rgba( 238, 121, 72, 0.50 );
	--Color_N040: rgba( 238, 121, 72, 0.40 );
	--Color_N030: rgba( 238, 121, 72, 0.30 );
	--Color_N020: rgba( 238, 121, 72, 0.20 );
	--Color_N010: rgba( 238, 121, 72, 0.10 );
	--Color_N005: rgba( 238, 121, 72, 0.05 );
	--Color_N000: rgba( 238, 121, 72, 0.00 );

	/* 那覇カラー */
	--Color_N1: #ee7948;
	/* 那覇カラー */
	--Color_N2: #917347;
	/* 那覇カラー */
	--Color_N3: #8f2e14;
	/* 那覇カラー */
	--Color_N4: #165e83;

	
	--Border-radius_L: calc( 200 * var(--BaseSize) );
	--Border-radius_S: calc( .5 * var(--BaseSize) );
	--Border-radius_Top: var(--Border-radius_S) var(--Border-radius_S) 0 0;
	--Border-radius_Bottom: 0 0 var(--Border-radius_S) var(--Border-radius_S);
	--Border-radius_Right: var(--Border-radius_S) 0 0 var(--Border-radius_S);
	--Border-radius_Left: 0 var(--Border-radius_S) var(--Border-radius_S) 0;
	
	

	/* ギミック */
	--Transition_02s: all 0.2s ease;
	--Transition_04s: all 0.4s ease;
	--Transition_06s: all 0.6s ease;
	--Transition_08s: all 0.8s ease;
	--Transition_10s: all 1.0s ease;

	/* フィルタ */
	--backdrop-filter_blur: blur(12px);
	
	/* グラデーション */
	--Linear-gradient_BTN0: linear-gradient(235deg, var(--Color_A000), var(--Color_1D000), var(--Color_A000));
	--Linear-gradient_BTN: linear-gradient(235deg, var(--Color_A100), var(--Color_1D100), var(--Color_A100));

	/* 変形 */
	--Transform_rZ: rotateZ(-0.004turn) scale(1);

	/* シャドウ */
	--Box-shadow: 2px 4px 12px rgba(29,29,29,.6);

	--Theme-100: var(--Color_1D100);
	--Theme-090: var(--Color_1D090);
	--Theme-080: var(--Color_1D080);
	--Theme-070: var(--Color_1D070);
	--Theme-060: var(--Color_1D060);
	--Theme-050: var(--Color_1D050);
	--Theme-040: var(--Color_1D040);
	--Theme-030: var(--Color_1D030);
	--Theme-020: var(--Color_1D020);
	--Theme-010: var(--Color_1D010);
	--Theme-005: var(--Color_1D005);
}

body#KRO {
	--Theme-100: var(--Color_K100);
	--Theme-090: var(--Color_K090);
	--Theme-080: var(--Color_K080);
	--Theme-070: var(--Color_K070);
	--Theme-060: var(--Color_K060);
	--Theme-050: var(--Color_K050);
	--Theme-040: var(--Color_K040);
	--Theme-030: var(--Color_K030);
	--Theme-020: var(--Color_K020);
	--Theme-010: var(--Color_K010);
	--Theme-005: var(--Color_K005);
}

body#ORO {
	--Theme-100: var(--Color_O100);
	--Theme-090: var(--Color_O090);
	--Theme-080: var(--Color_O080);
	--Theme-070: var(--Color_O070);
	--Theme-060: var(--Color_O060);
	--Theme-050: var(--Color_O050);
	--Theme-040: var(--Color_O040);
	--Theme-030: var(--Color_O030);
	--Theme-020: var(--Color_O020);
	--Theme-010: var(--Color_O010);
	--Theme-005: var(--Color_O005);
}

body#NRO {
	--Theme-100: var(--Color_N100);
	--Theme-090: var(--Color_N090);
	--Theme-080: var(--Color_N080);
	--Theme-070: var(--Color_N070);
	--Theme-060: var(--Color_N060);
	--Theme-050: var(--Color_N050);
	--Theme-040: var(--Color_N040);
	--Theme-030: var(--Color_N030);
	--Theme-020: var(--Color_N020);
	--Theme-010: var(--Color_N010);
	--Theme-005: var(--Color_N005);
}

body {
	--Border: 1px var(--Theme-030) solid;
}