/*
# 追加差分用

Vueプロジェクトへ取り込む際に注意

## 変更点

* `/public/css/additional_diff.css`
  - このCSSファイル。
* `\resources\views\layouts\auth.blade.php`
  - このCSSを読み込むために`<link>`タグを追記。
  - 共通レイアウト用にHTML改修。
  - ロゴ画像も差し替え。
* `\resources\views\views\member\register.blade.php`
* `\resources\views\views\member\login.blade.php`
* `\resources\views\views\freelance\register.blade.php`
* `\resources\views\views\freelance\login.blade.php`
  - ソーシャルログインにアイコンを追加
* `\public\img\logo-*.svg`
  - ロゴ画像を追加
* `\public\img\social`
  - ソーシャルログイン用アイコンを追加
*/

html,
body {
    height: 100%;
    background-color: #f6f4ed;
}

body > div {
    height: 100%;
}

header {
    display: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 10;
}

header > div {
    height: 56px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    background-color: #26aada;
}

main {
    max-width: 640px;
    margin: 0 auto;
}

footer {
    position: sticky;
    top: 100vh;
}

footer > div {
    padding: 16px;
    color: #fff;
    background-color: #26aada;
}

footer > div > div {
    max-width: 640px;
    margin: 0 auto;
}

footer > div > div > div {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.copyright {
    font-size: 12px;
}