"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.BetweenPcAndMobile = exports.Between = exports.Larger = exports.Smaller = exports.MediaQuerySize = void 0;
const react_1 = require("@emotion/react");
exports.MediaQuerySize = {
    Mobile: 768,
    PC: 1024,
};
const Smaller = (style) => (0, react_1.css) `
	@media (max-width: ${exports.MediaQuerySize.Mobile}px) {
		${style}
	}
`;
exports.Smaller = Smaller;
const Larger = (style) => (0, react_1.css) `
	@media (min-width: ${exports.MediaQuerySize.Mobile + 1}px) {
		${style}
	}
`;
exports.Larger = Larger;
const Between = (style) => (0, react_1.css) `
	@media (min-width: ${exports.MediaQuerySize.Mobile + 1}px) and (max-width: ${exports.MediaQuerySize.PC + 30}px) {
		${style}
	}
`;
exports.Between = Between;
const BetweenPcAndMobile = (PcStyle, MobileStyle) => (0, react_1.css) `
	@media (min-width: ${exports.MediaQuerySize.Mobile + 1}px) {
		${PcStyle}
	}
	@media (max-width: ${exports.MediaQuerySize.Mobile}px) {
		${MobileStyle}
	}
`;
exports.BetweenPcAndMobile = BetweenPcAndMobile;
