@charset "UTF-8";

:root {
	/* font size  */
	--siteFont-ratio: 1;

	--siteFont-inc-l: calc(var(--pt-fontSize-root) * 0.25);
	--siteFont-inc-xl: calc(var(--pt-fontSize-root) * 0.4);
	--siteFont-inc-xxl: calc(var(--pt-fontSize-root) * 0.65);
	--siteFont-inc-xxxl: calc(var(--pt-fontSize-root) * 0.9);

	--minFontSize-xs: 11px;
	--minFontSize-s: 12px;
	--minFontSize-m: 14px;
	--minFontSize-l: 16px;
	--minFontSize-xl: 18px;
	--minFontSize-xxl: 20px;
	--minFontSize-xxxl: 22px;

	--inputPadding: calc(0.4em + 0.6rem);
	--lineHeight: 1.36;

	/* wp heading */
	--wp-headingSize-h1: 2.2em;
	--wp-headingSize-h2: 2em;
	--wp-headingSize-h3: 1.8em;
	--wp-headingSize-h4: 1.6em;
	--wp-headingSize-h5: 1.4em;
	--wp-headingSize-h6: 1.2em;

	/*  with themeOption -------------------------------------------------------------------------------------------------------------------- */

	/* Colors */
	--pt-bg-body: #fff;
	--pt-color-highlight: #5be7a1;
	--pt-text-color-primary: #000;
	--pt-text-color-secondary: #000;
	--pt-text-color-action: #1ab768;
	--pt-text-color-over-highlight: #000;
	/* show more */
	--pt-bg-single-header: #f9f9f9;
	--pt-text-color-single-header: var(--pt-text-color-primary);
	--pt-bg-comment: rgba(235, 237, 239, 0.4);
	--pt-border-color: rgba(161, 162, 168, 0.35);
	--pt-input-border-color: var(--pt-border-color);
	--pt-bg-popup: #111215;
	--pt-text-color-popup: #fff;
	--pt-bg-button: rgb(235, 237, 239);
	--pt-text-color-button: var(--pt-text-color-primary);

	/* menu */
	--pt-bg-menu: var(--pt-bg-body);
	--pt-text-color-menu: var(--pt-text-color-primary);
	--pt-bg-submenu: #111215;
	--pt-text-color-submenu: #fff;
	/* side */
	--pt-side-menu-bg-color: #000;
	--pt-side-menu-text-color: #fff;

	/* fonts */
	--pt-fontFamily-body: "alpinenewalps-regular", sans-serif;
	--pt-fontFamily-normalMenu: var(--pt-fontFamily-body);
	--pt-fontFamily-title: var(--pt-fontFamily-body);
	--pt-fontFamily-sideMenu: var(--pt-fontFamily-title);

	--pt-fontWeight-body: 400;
	--pt-fontWeight-link: 500;
	--pt-fontWeight-title: 600;
	--pt-fontWeight-normalMenu: var(--pt-fontWeight-link);
	--pt-fontWeight-sideMenu: var(--pt-fontWeight-title);

	--pt-letter-spacing: 0;

	/* without themeOption -------------------------------------------------------------------------------------------------------------------- */
	--pt-bg-mask: rgba(41, 42, 44, 0.7);
	--pt-bg-translucent: rgba(0, 0, 0, 0.03);
	--pt-bg-code: #1d2944;
	--pt-text-color-code: #e6e8ef;

	/* size  */
	--pt-border-width: 1px;
	--pt-border-bold: calc(4px + 0.1em);

	--pt-gap-m-x: 3.2vw;
	--pt-gap-m-y: 3.2vw;

	--pt-textarea-width: 46rem;

	--pt-btn-m: max(calc(var(--pt-fontSize-root) * 1.8 + 2vmin), 36px);

	--pt-widget-width: calc(100px + 17vw);
	--videoRatio: 0.5625;

	--pt-fontSize-xxxl: max(calc(var(--pt-fontSize-root) * var(--siteFont-ratio) + var(--siteFont-inc-xxxl)),
			var(--minFontSize-xxxl));
	--pt-fontSize-xxl: max(calc(var(--pt-fontSize-root) * var(--siteFont-ratio) + var(--siteFont-inc-xxl)),
			var(--minFontSize-xxl));
	--pt-fontSize-xl: max(calc(var(--pt-fontSize-root) * var(--siteFont-ratio) + var(--siteFont-inc-xl)),
			var(--minFontSize-xl));
	--pt-fontSize-l: max(calc(var(--pt-fontSize-root) * var(--siteFont-ratio) + var(--siteFont-inc-l)),
			var(--minFontSize-l));

	--pt-fontSize-m: max(calc(var(--pt-fontSize-root) * var(--siteFont-ratio) * 1),
			var(--minFontSize-m));
	--pt-fontSize-s: max(calc(var(--pt-fontSize-root) * var(--siteFont-ratio) * 0.85),
			var(--minFontSize-s));
	--pt-fontSize-xs: max(calc(var(--pt-fontSize-root) * var(--siteFont-ratio) * 0.7),
			var(--minFontSize-xs));

	--pt-admin-bar: 0px;
	--header-minHeight: 0px;
	--pt-transition-button: color 0.15s, background 0.15s;

	/* for wp block */
	--wp-fontRatio: 1.125;
	--wp-textareaFontSize: calc(var(--pt-fontSize-root) * var(--wp-fontRatio));
	--wp-list-gap: 0.8525rem;
	--wp-list-left-gap: 0.9525em;
	--wp-block-gap: 1.525rem;
}

.admin-bar {
	--pt-admin-bar: 32px;
}

.pt-border-width-m {
	--pt-border-width: 2px;
}

.pt-letter-spacing-1 {
	--pt-letter-spacing: -0.04em;
}

.pt-letter-spacing-2 {
	--pt-letter-spacing: -0.02em;
}

.pt-letter-spacing-4 {
	--pt-letter-spacing: 0.02em;
}

.pt-letter-spacing-5 {
	--pt-letter-spacing: 0.04em;
}

@media (max-width: 782px) {
	.admin-bar {
		--pt-admin-bar: 46px;
	}
}