@charset "UTF-8";

/* Template & Designed by Towako. */
/* https://ninawas.me */

/* ウェブフォントの読み込み */
@import url('https://fonts.googleapis.com/css2?family=Cedarville+Cursive&family=Noto+Sans+JP&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;600;800&display=swap&subset=japanese');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css');
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;600;700&display=swap');
/* ここまで */

:root {
	--color-base: #fff; /* 背景色 */
	--color-main: #C1D2EC; /* リンク色部分 */
	/* --color-main: #E47362; 赤い部分 */
	--color-accent: #efefef; /* 灰色の部分 */
	--font-primary: 'Noto Sans JP', Meiryo, メイリオ, sans-serif; /* 日本語フォント */
	--color-text: #333; /* 文字の色 */
	--color-menu: #3F3F3F; /* 文字の色 */
	--font-alphanumeric: 'Outfit', sans-serif; /* 英数フォント */
	--font-icon: 'Font Awesome 6 Free'; /* アイコンフォント */
	--font-h: 'Barlow', serif; /* adobeフォント */
	--tega-E: #cbf1fc; /* 文字の色 */
	--switch-bg: #E5E5E5;
    --switch-slider: #fff;
    --transition-time: 0.3s;
}

html.Dark {
    --color-base: #444444; /* 背景色 */
	--color-text: #e9e9f1; /* 文字の色 */
	--color-main: #C1D2EC; /* 赤い部分 */
	--color-menu: #C1D2EC; /* 文字の色 */
	--tega-E: #94aed5; /* 文字の色 */
	--switch-bg: #34323D;
    --switch-slider: #202027;
	--pass-bg-color: #444444;
}

/* 全体に適用する */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-weight: normal;
}

@media screen and (min-width: 1367px) {
	html{ font-size:62.5%;}}
@media screen and (max-width: 1366px) {
	html{ font-size:50%;}}
@media screen and (max-width: 800px) {
	html{ font-size:90%;}}
@media screen and (max-width: 500px) {
	html{ font-size:62.5%;}}

@media screen and (min-width: 769px) {
	:root {
		--margin-base: 5rem;
		--border-radius: 0.5rem;
	}

	body{
		font-size: 1.5rem;
	}
}

@media screen and (max-width: 768px) {
	:root {
		--margin-base: 3rem;
		--border-radius: 0.3rem;
	}

	body{
		font-size: 1.2rem;
	}
}