<p class="pt32 pl32">下部引き出しパネル内「Assets」に設定用style(base style)を記載</p>
<p class="pt32 pl32">下部引き出しパネル内「Assets」に設定用style(base style)を記載</p>
/* No context defined. */
  • Content:
    @charset "UTF-8";
    /**
     * # base.scss
     * (1) A modern CSS reset
     * (2) Composite custom styles in normalize.css + reset.css (Eric Mayer's). Inspired by Elad Shechter's RESET
     * (3) Other useful initialization
     * (4) For A11Y / WAI-ARIA
     */
    /**
     * ----------
     * (1) A modern CSS reset
     */
    body *, *::before, *::after {
      box-sizing: border-box;
    }
    
    body, h1, h2, h3, h4, p, figure, blockquote, dl, dd {
      margin: 0;
    }
    
    ul[role=list], ol[role=list] {
      list-style: none;
    }
    
    html:focus-within {
      scroll-behavior: smooth;
    }
    
    body {
      min-height: 100vh;
      text-rendering: optimizeSpeed;
      line-height: 1.5;
    }
    
    a:not([class]) {
      -webkit-text-decoration-skip: ink;
      text-decoration-skip-ink: auto;
    }
    
    img, picture {
      max-width: 100%;
      display: block;
    }
    
    @media (prefers-reduced-motion: reduce) {
      html:focus-within {
        scroll-behavior: auto;
      }
    }
    /**
     * ----------
     * (2) Composite custom styles in normalize.css + reset.css
     * normalize.css
     */
    /**
     * 1. Correct the inheritance and scaling of font size in all browsers.
     * 2. Correct the odd `em` font sizing in all browsers.
     */
    code, kbd, samp {
      /* 1 */
      font-family: monospace;
      /* 2 */
      font-size: 1em;
    }
    
    /**
     * Prevent `sub` and `sup` elements from affecting the line height in all browsers.
     */
    sub, sup {
      position: relative;
      vertical-align: baseline;
      line-height: 0;
      font-size: 75%;
    }
    
    sub {
      bottom: -0.25em;
    }
    
    sup {
      top: -0.5em;
    }
    
    /**
     * 1. Change the font styles in all browsers.
     */
    button, input, optgroup, select, textarea {
      /* 1 */
      margin: 0;
      line-height: 1.15;
      font-family: inherit;
      font-size: 100%;
    }
    
    /**
     * Remove the inheritance of text transform in Edge, Firefox, and IE.
     * 1. Remove the inheritance of text transform in Firefox.
     */
    button, select {
      /* 1 */
      text-transform: none;
    }
    
    /**
     * Correct the inability to style clickable types in iOS and Safari.
     */
    button,
    [type=button],
    [type=reset],
    [type=submit],
    [role=button] {
      cursor: pointer;
      -webkit-appearance: button;
      -moz-appearance: button;
      appearance: button;
    }
    
    /**
     * Remove the inner border and padding in Firefox.
     */
    button::-moz-focus-inner,
    [type=button]::-moz-focus-inner,
    [type=reset]::-moz-focus-inner,
    [type=submit]::-moz-focus-inner {
      padding: 0;
      border-style: none;
    }
    
    /**
     * Restore the focus styles unset by the previous rule.
     */
    button:-moz-focusring,
    [type=button]:-moz-focusring,
    [type=reset]:-moz-focusring,
    [type=submit]:-moz-focusring {
      outline: 1px dotted ButtonText;
    }
    
    /**
     * Correct the padding in Firefox.
     */
    fieldset {
      padding: 0.35em 0.75em 0.625em;
    }
    
    /**
     * 3. Remove the padding so developers are not caught out when they zero out
     *    `fieldset` elements in all browsers.
     */
    legend {
      /* 3 */
      white-space: normal;
      color: inherit;
    }
    
    /**
     * Correct the cursor style of increment and decrement buttons in Chrome.
     */
    [type=number]::-webkit-inner-spin-button,
    [type=number]::-webkit-outer-spin-button {
      height: auto;
    }
    
    /**
     * 1. Correct the odd appearance in Chrome and Safari.
     */
    [type=search] {
      /* 1 */
      outline-offset: -2px;
      -webkit-appearance: textfield;
      -moz-appearance: textfield;
      appearance: textfield;
    }
    
    /**
     * reset.css
     */
    a {
      text-decoration: none;
      color: hsl(240deg, 100%, 47%);
      cursor: pointer;
    }
    
    button {
      padding: 0;
      border-width: 0;
      background-color: transparent;
      color: inherit;
      cursor: pointer;
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
    }
    
    figure {
      margin: 0;
    }
    
    input::-moz-focus-inner {
      margin: 0;
      padding: 0;
      border: 0;
    }
    
    ul, ol, dd {
      list-style: none;
      margin: 0;
      padding: 0;
    }
    
    h1, h2, h3, h4, h5, h6 {
      margin: 0;
      font-size: inherit;
      font-weight: inherit;
    }
    
    p {
      margin: 0;
    }
    
    cite {
      font-style: normal;
    }
    
    fieldset {
      margin: 0;
      padding: 0;
      border-width: 0;
    }
    
    /**
     * ----------
     * (3) Other useful initialization
     */
    html {
      /* All browsers without overlaying scrollbars */
      -webkit-text-size-adjust: 100%;
      -moz-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
      text-size-adjust: 100%;
      font-size: 100%;
      /* for using REM units */
      overflow-y: scroll;
      /* apply a natural box layout model to all elements, but allowing components to change */
      box-sizing: border-box;
    }
    
    /**
     * personal initialization style
     */
    body {
      min-height: 100vh;
      margin: 0;
      line-height: 1.5;
      font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica Neue, Arial, Roboto, Yu Gothic, YuGothic, Hiragino Sans, Meiryo, sans-serif;
      font-weight: 400;
      -webkit-font-feature-settings: "pkna" 1;
      font-feature-settings: "pkna" 1;
      color: var(--text-normal-color);
      box-sizing: border-box;
      direction: ltr;
    }
    
    /**
     * personal initialization style
     */
    a:hover,
    a:focus {
      text-decoration: none;
    }
    
    address {
      margin-bottom: 1rem;
      line-height: inherit;
      font-style: normal;
    }
    
    img {
      height: auto;
      max-width: 100%;
      border-style: none;
      vertical-align: middle;
    }
    
    svg {
      vertical-align: middle;
      overflow: hidden;
    }
    
    table {
      border-collapse: collapse;
    }
    
    caption {
      padding-top: 0.75rem;
      padding-bottom: 0.75rem;
      caption-side: bottom;
      text-align: left;
      color: hsl(208deg, 7%, 46%);
    }
    
    th {
      text-align: inherit;
    }
    
    label {
      display: inline-block;
      margin-bottom: 0.5rem;
    }
    
    /* Remove the default button styling in all browsers */
    button,
    input,
    select,
    textarea {
      border-style: none;
      background-color: transparent;
      color: inherit;
    }
    
    dfn {
      font-style: normal;
    }
    
    /* Replace pointer cursor in disabled elements */
    [disabled] {
      cursor: default;
    }
    
    /* Specify text selection background color and omit drop shadow */
    ::-moz-selection {
      background-color: hsl(213deg, 92%, 85%);
      text-shadow: none;
      /* Required when declaring ::selection */
      color: hsl(0deg, 0%, 0%);
    }
    
    ::selection {
      background-color: hsl(213deg, 92%, 85%);
      text-shadow: none;
      /* Required when declaring ::selection */
      color: hsl(0deg, 0%, 0%);
    }
    
    ::-webkit-input-placeholder {
      color: hsl(0deg, 0%, 44%);
    }
    
    :-ms-input-placeholder {
      color: hsl(0deg, 0%, 44%);
    }
    
    ::-moz-placeholder {
      color: hsl(0deg, 0%, 44%);
    }
    
    :-moz-placeholder-shown {
      color: hsl(0deg, 0%, 44%);
    }
    
    :-ms-input-placeholder {
      color: hsl(0deg, 0%, 44%);
    }
    
    :placeholder-shown {
      color: hsl(0deg, 0%, 44%);
    }
    
    /**
     * ----------
     * (4) For A11Y / WAI-ARIA
     * A11Y
     */
    [tabindex="-1"]:focus {
      outline: none !important;
    }
    
    /* Define your own focus-ring style for all interactive elements */
    a:focus-visible,
    audio:focus-visible,
    button:focus-visible,
    details:focus-visible,
    summary:focus-visible,
    embed:focus-visible,
    iframe:focus-visible,
    img[usemap]:focus-visible,
    input:not([hidden]):focus-visible,
    keygen:focus-visible,
    label:focus-visible,
    object[usemap]:focus-visible,
    select:focus-visible,
    textarea:focus-visible,
    video:focus-visible,
    dialog:focus-visible,
    div:focus-visible,
    section:focus-visible {
      outline: 0.125rem solid var(--focusring-color);
      outline-offset: 0.0625rem;
    }
    
    /**
     * WAI-ARIA
     */
    /* Specify the progress cursor of updating elements */
    [aria-busy=true] {
      cursor: progress;
    }
    
    /* Specify the pointer cursor of trigger elements */
    [aria-controls] {
      cursor: pointer;
    }
    
    /* Specify the unstyled cursor of disabled, not-editable, or otherwise inoperable elements */
    [aria-disabled] {
      cursor: default;
    }
  • URL: /components/raw/base-style/base-style.css
  • Filesystem Path: src/components/8-utility/base-style/base-style.css
  • Size: 7.3 KB
  • Content:
    /**
     * web font使用時の書き方参考
     * web font使用は、描画パフォーマンスを阻害する大きなボトルネックなので濫用禁止
     * 和文web fontの使用は特に推奨しない。欧文は1~2ウェイト程度使用は許容
     */
    
    /* 欧文フォント */
    @font-face {
      font-family: "Brandon Grotesque Medium";
      font-style: normal;
      font-weight: normal;
      src: url(../font/BrandonGrotesque/Brandon_med.woff2) format(woff2), url(../font/BrandonGrotesque/Brandon_med.woff) format(woff);
    }
    @font-face {
      font-family: "Brandon Grotesque Bold";
      font-style: normal;
      font-weight: normal;
      src: url(../font/BrandonGrotesque/Brandon_bld.woff2) format(woff2), url(../font/BrandonGrotesque/Brandon_bld.woff) format(woff);
    }
    @font-face {
      font-family: "Brandon Text Regular";
      font-style: normal;
      font-weight: normal;
      src: url(../font/BrandonText/BrandonText-Regular.woff2) format(woff2), url(../font/BrandonText/BrandonText-Regular.woff) format(woff);
    }
    @font-face {
      font-family: "Brandon Text Medium";
      font-style: normal;
      font-weight: normal;
      src: url(../font/BrandonText/BrandonText-Medium.woff2) format(woff2), url(../font/BrandonText/BrandonText-Medium.woff) format(woff);
    }
    @font-face {
      font-family: "Brandon Text Bold";
      font-style: normal;
      font-weight: normal;
      src: url(../font/BrandonText/BrandonText-Bold.woff2) format(woff2), url(../font/BrandonText/BrandonText-Bold.woff) format(woff);
    }
    
    /* 和文フォント */
    @font-face {
      font-family: "Noto Sans JP";
      font-style: normal;
      font-weight: 400;
      src: url(../font/NotoSansCJKjp-subset/NotoSansJp-Regular.woff2) format(woff2), url(../font/NotoSansCJKjp-subset/NotoSansJp-Regular.woff) format(woff);
    }
    @font-face {
      font-family: "Noto Sans JP";
      font-style: bold;
      font-weight: 700;
      src: url(../font/NotoSansCJKjp-subset/NotoSansJp-Bold.woff2) format(woff2), url(../font/NotoSansCJKjp-subset/NotoSansJp-Bold.woff) format(woff);
    }
    @font-face {
      font-family: "Noto Serif JP";
      font-style: normal;
      font-weight: 400;
      src: url(../font/NotoSerifCJKjp-subset/NotoSerifJp-Regular.woff2) format(woff2), url(../font/NotoSerifCJKjp-subset/NotoSerifJp-Regular.woff) format(woff);
    }
    @font-face {
      font-family: "Noto Serif JP";
      font-style: bold;
      font-weight: 700;
      src: url(../font/NotoSerifCJKjp-subset/NotoSerifJp-Bold.woff2) format(woff2), url(../font/NotoSerifCJKjp-subset/NotoSerifJp-Bold.woff) format(woff);
    }
  • URL: /components/raw/base-style/font-face-style.css
  • Filesystem Path: src/components/8-utility/base-style/font-face-style.css
  • Size: 2.4 KB
  • Content:
    /**
     * ## variable
     * ### CSS variable (CSS custom properties for cascading variables)
     */
    
    :root {
      --base-font: -apple-system, BlinkMacSystemFont, Segoe UI, Hiragino Kaku Gothic ProN, Hiragino Sans, BIZ UDPGothic, Meiryo, sans-serif;
      --english-font-print: Arial, sans-serif;
      --12px-rem: 0.75rem;
      --14px-rem: 0.875rem;
      --18px-rem: 1.125rem;
      --20px-rem: 1.25rem;
      --24px-rem: 1.5rem;
      --28px-rem: 1.75rem;
      --32px-rem: 2rem;
      --36px-rem: 2.25rem;
      --40px-rem: 2.5rem;
      --48px-rem: 3rem;
      --black: hsla(0, 0%, 20%, 1);
      --white: hsla(0, 100%, 100%, 1);
      --contrast-limit-gray: hsla(0, 0%, 47%, 1);
      --text-normal-color: var(--black);
      --border-color: var(--contrast-limit-gray);
      --focusring-color: hsla(217, 99%, 71%, 1);
      --ease-in-quad: cubic-bezier(.55, .085, .68, .53);
      --ease-out-quad: cubic-bezier(.25, .46, .45, .94);
      --ease-in-out-quad: cubic-bezier(.455, .03, .515, .955);
      --ease-in-cubic: cubic-bezier(.55, .055, .675, .19);
      --ease-out-cubic: cubic-bezier(.215, .61, .355, 1);
      --ease-in-out-cubic: cubic-bezier(.645, .045, .355, 1);
      --textbox-shadow: 0 10px 15px -3px hsla(0, 0%, 0%, .2), 0 4px 6px -2px hsla(0, 0%, 0%, .1);
      --textbox-bg: hsla(0, 0%, 100%, .925);
      --textbox-hover-shadow: 0 12px 12px 0 hsla(0, 0%, 0%, .14), 0 5px 7px 0 hsla(0, 0%, 0%, .065);
      --in-transition: color .15s var(--ease-in-out-quad), background-color .15s var(--ease-in-out-quad), transform .15s var(--ease-in-out-quad);
      --out-transition: color .2s var(--ease-out-quad), background-color .2s var(--ease-in-out-quad), transform .2s var(--ease-in-out-quad);
      --carousel-fade: opacity .7s var(--ease-in-quad);
      --carousel-switch-effect: var(--in-transition), var(--carousel-fade);
    }
  • URL: /components/raw/base-style/variables-style.css
  • Filesystem Path: src/components/8-utility/base-style/variables-style.css
  • Size: 1.7 KB

No notes defined.