/* ===================================================================
   variables.css
   TicketDive本番サイトのグローバルCSS変数(:root)・ベースリセットを抽出。
   出典: 本番サイトの /_next/static/css/6a3c58ddf5d1756e.css
   目的: fd30ee9cf531f512.css / a4fa526974c27acd.css が参照している
        var(--b1) 等のCSS変数はこのファイルには定義されていないため、
        本番CSSから該当ブロックのみを切り出してここに配置する。
   =================================================================== */

@font-face {
    font-family: Bebas Neue;
    src: url(https://ticketdive.com/_next/static/media/BEBAS-NEUE-REGULAR.f8cd6b7d.ttf) format("truetype"),
         url(https://ticketdive.com/_next/static/media/BEBAS-NEUE-REGULAR.fa736280.woff2) format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

:root {
    --max-width: 1100px;
    --border-radius: 12px;
    --foreground-rgb: 0, 0, 0;
    --background-start-rgb: 214, 219, 220;
    --background-end-rgb: 255, 255, 255;
    --tile-start-rgb: 239, 245, 249;
    --tile-end-rgb: 228, 232, 233;
    --callout-rgb: 238, 240, 241;
    --callout-border-rgb: 172, 175, 176;
    --card-rgb: 180, 185, 188;
    --card-border-rgb: 131, 134, 135;
}

* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

body, html {
    max-width: 100vw;
    font-size: 10px;
}

body, button, html, pre, select {
    font-family: Hiragino Sans, Hiragino Kaku Gothic ProN, Helvetica Neue, Arial, Meiryo, sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
}

body { color: var(--b1); }
a { color: inherit; }

:root {
    --b0: #000000;
    --b1: #4f4745;
    --b2: #4f4745;
    --b3: #919191;
    --b4: #c4c4c4;
    --b5: #212121;
    --w1: #ffffff;
    --w2: #f8f8fa;
    --w3: #f7f7f7;
    --w4: #efefef;
    --w5: #e5e5e5;
    --red1: #ff0000;
    --blue1: #5ab9ff;
    --blue1-bg: #edf7ff;
    --yellow1: #f9bb00;
    --yellow1-bg: #fff5e9;
    --primary-color: #5ab9ff;
    --primary-button-color: linear-gradient(90deg, #7bc3e2, #489afb);
    --primary-bg-color: #edf7ff;
    --secondary-color: #f5a232;
    --main-gradient: linear-gradient(90deg, #f3981c, #e95389 27%, #8c93c3 49%, #2badd7 75%, #363483);
    --sub-gradient: linear-gradient(90deg, #ffc148, #ffa25b);
    --secondary-gradient: linear-gradient(90deg, #7bc3e2, #489afb);
    --background-gradient: linear-gradient(0deg, #f3f9ff, rgba(255, 255, 255, 0));
    --preview-color: #eaa31a;
    --error-color: #d24e4e;
    --warning-color: #eaa31a;
    --date-label-color: linear-gradient(90deg, #7bc3e2, #489afb);
}

h1, h2, h3, h4, h5, h6, li, p { color: var(--b1); }
a, h1, h2, h3, h4, h5, h6, label, li, ol, p, pre, span, ul { line-height: 100%; }
h1, h2, h3 { font-weight: 600; }
a { text-decoration: none; }
strong { font-weight: 700; }
fieldset { border: none; padding: 0; margin: 0; }
svg { width: 100%; }
input[type=checkbox] { width: 16px; height: 16px; }

.enFont {
    font-family: Bebas Neue, Hiragino Sans, Hiragino Kaku Gothic ProN, Helvetica Neue, Arial, Meiryo, sans-serif;
}
.helvetica {
    font-family: Helvetica, Arial, Meiryo, sans-serif;
}
.mainGradient path, .mainGradient svg { fill: url(#mainGradient); }
.button-radius { border-radius: 2.4rem; }