@charset "UTF-8";
/* 日本語 charset "utf-8 */
@keyframes test { 0% { background-position: left center; }
  100% { background-position: -1733px center; } }
@keyframes bg-move { 0% { width: 0; }
  100% { width: 100%; left: 180px; } }
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
/*要素のフォントサイズやマージン・パディングをリセットしています*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

/*行の高さをフォントサイズと同じにしています*/
body { line-height: 1; }

/*新規追加要素のデフォルトはすべてインライン要素になっているので、section要素などをブロック要素へ変更しています*/
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

/*nav要素内ulのマーカー（行頭記号）を表示しないようにしています*/
/*nav ul { list-style:none;
}*/
ol, ul { list-style: none; }

/*引用符の表示が出ないようにしています*/
blockquote, q { quotes: none; }

/*blockquote要素、q要素の前後にコンテンツを追加しないように指定しています*/
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

/*a要素のフォントサイズなどをリセットしフォントの縦方向の揃え位置を親要素のベースラインに揃えるようにしています*/
a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

/* ins要素のデフォルトをセットし、色を変える場合はここで変更できるようにしています */
ins { background-color: #ff9; color: #000; text-decoration: none; }

/* mark要素のデフォルトをセットし、色やフォントスタイルを変える場合はここで変更できるようにしています
また、mark要素とは、文書内の検索結果で該当するフレーズをハイライトして、目立たせる際に使用するようです。*/
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }

/*テキストに打ち消し線が付くようにしています*/
del { text-decoration: line-through; }

/*IEではデフォルトで点線を下線表示する設定ではないので、下線がつくようにしています
また、マウスオーバー時にヘルプカーソルの表示が出るようにしています*/
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }

/*隣接するセルのボーダーを重ねて表示し、間隔を0に指定しています*/
table { border-collapse: collapse; border-spacing: 0; }

/*水平罫線のデフォルトである立体的な罫線を見えなくしています*/
hr { display: block; height: 1px; border: 0; border-top: 1px solid #cccccc; margin: 1em 0; padding: 0; }

/*縦方向の揃え位置を中央揃えに指定しています*/
input, select { vertical-align: middle; }

/*画像を縦に並べた時に余白が出ないように*/
img { vertical-align: top; font-size: 0; line-height: 0; }

/*box-sizingを全ブラウザに対応*/
*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }

a { text-decoration: none; color: #000; }

button { padding: 0; margin: 0; }

button { background-color: transparent; border: none; cursor: pointer; outline: none; padding: 0; appearance: none; }

select { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; outline: none; background: transparent; }

* { font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; -ms-font-feature-settings: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; word-break: break-all; }

h1, h2, h3 { font-weight: 100; letter-spacing: 1px; }

.wrapper { overflow: hidden; position: relative; }
.wrapper .steps-link { background-image: url(../images/common/steps.png); background-repeat: no-repeat; background-size: 100%; width: 180px; height: 32px; margin-right: 10px; }
.wrapper .steps-link:hover { opacity: 0.6; }
.wrapper .zozo-link { background-image: url(../images/common/zozo.png); background-repeat: no-repeat; background-size: 100%; width: 114px; height: 32px; }
.wrapper .zozo-link:hover { opacity: 0.6; }
/* .wrapper .zozo-link:hover { background-image: url(../images/common/zozo_hover.png); } */
.wrapper .raku-link:hover { opacity: 0.6; }
.wrapper header.header { position: fixed; z-index: 10; top: 0; left: 0; width: 100%; height: 80px; border-bottom: 1px black solid; background-color: white; padding-left: 64px; padding-right: 24px; display: flex; justify-content: space-between; align-items: center; }
.wrapper header.header .link-block { display: flex; justify-content: flex-start; align-items: center; }
.wrapper header.header .link-block2 { display: flex; align-items: center; }
.wrapper header.header .link-block h1 { margin-right: 90px; width: 220px; }
.wrapper header.header .link-block h1 img.logo { height: 32px; margin-right: 24px; }
.wrapper header.header .link-block h1 img.logo-sub { height: 32px; }
.wrapper header.header .link-block nav.header-nav ul.parent-list { display: flex; justify-content: flex-start; align-items: center; }
.wrapper header.header .link-block nav.header-nav ul.parent-list > li { position: relative; display: flex; justify-content: center; align-items: center; height: 80px; margin-right: 36px; }
.wrapper header.header .link-block nav.header-nav ul.parent-list > li.current::after { content: ''; position: absolute; bottom: 0; left: 0; display: block; width: 100%; height: 3px; background-color: black; }
.wrapper header.header .link-block nav.header-nav ul.parent-list > li > a { display: inline-block; }
.wrapper header.header .link-block nav.header-nav ul.parent-list > li > a:hover { background: black; color: white; }
.wrapper header.header .link-block nav.header-nav ul.parent-list > li > a p { font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 16px; }
.wrapper header.header .link-block nav.header-nav ul.parent-list > li.type-child:hover ul.child-list { display: block; z-index: 1; }
.wrapper header.header .link-block nav.header-nav ul.parent-list > li.type-child:hover .border { display: block; }
.wrapper header.header .link-block nav.header-nav ul.parent-list > li.type-child .border { display: none; width: 1px; height: 80px; position: absolute; background: #000; top: 50px; }
.wrapper header.header .link-block nav.header-nav ul.parent-list > li ul.child-list { display: none; width: 104px; position: absolute; background-color: white; border: solid 1px black; top: 60px; padding: 10px; }
.wrapper header.header .link-block nav.header-nav ul.parent-list > li ul.child-list li { margin-bottom: 5px; }
.wrapper header.header .link-block nav.header-nav ul.parent-list > li ul.child-list li a { display: flex; justify-content: flex-start; align-items: center; }
.wrapper header.header .link-block nav.header-nav ul.parent-list > li ul.child-list li a:hover { background: black; color: white; }
.wrapper header.header .link-block nav.header-nav ul.parent-list > li ul.child-list li a::before { content: '-'; display: inline-block; }
.wrapper header.header .link-block nav.header-nav ul.parent-list > li ul.child-list li a p { font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 16px; }
.wrapper header.header .link-zozo img { width: auto; height: 32px; }
.wrapper footer.footer { width: 100%; height: 80px; border-top: 1px black solid; background-color: white; padding-left: 64px; padding-right: 16px; display: flex; justify-content: space-between; align-items: center; z-index: 0; }
.wrapper footer.footer nav.header-nav { display: flex; justify-content: flex-start; align-items: center; }
.wrapper footer.footer nav.header-nav ul.parent-list > li { position: relative; display: flex; justify-content: flex-start; align-items: center; margin-right: 24px; }
.wrapper footer.footer nav.header-nav ul.parent-list > li:first-of-type { margin-bottom: 13px; }
.wrapper footer.footer nav.header-nav ul.parent-list > li > a { display: inline-block; }
.wrapper footer.footer nav.header-nav ul.parent-list > li > a:hover { background: black; color: white; }
.wrapper footer.footer nav.header-nav ul.parent-list > li > a p { font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 13px; }
.wrapper footer.footer nav.header-nav ul.parent-list > li > a p::before { content: '-'; display: inline-block; margin-right: 4px; }
.wrapper footer.footer ul.outside-list { display: flex; justify-content: center; align-items: center; }
.wrapper footer.footer ul.outside-list > li { position: relative; display: flex; justify-content: flex-start; align-items: center; margin-right: 8px; }
.wrapper footer.footer ul.outside-list > li > a { display: inline-block; }
.wrapper footer.footer ul.outside-list > li > a.bnr-zozo { position: relative; display: block; background-size: 100%; background-image: url(../images/front-page/bnr_zozo.png); width: 114px; }
.wrapper footer.footer ul.outside-list > li > a.bnr-zozo:hover { background-image: url(../images/front-page/bnr_zozo_hover.png); }
.wrapper footer.footer ul.outside-list > li > a.bnr-zozo:after { content: ''; display: block; padding: 28.07018% 0 0; }
.wrapper .copyright { position: fixed; width: 40px; height: 100vh; z-index: 11; left: 0; top: 0; text-align: right; border-bottom: 1px black solid; border-right: 1px black solid; background-color: white; }
.wrapper .copyright p { position: absolute; bottom: 25px; left: 50%; right: 50%; margin: auto; font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; width: 14px; }
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) { .wrapper .copyright p { width: 40px; } }
.wrapper .container { margin: 0 auto; width: 1024px; margin-top: calc(80px + 40px); }
.wrapper .pan .wrap { color: white; }
.wrapper .pan .wrap a, .wrapper .pan .wrap span { color: white; font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 14px; display: inline; }
.wrapper .pan .wrap p { display: inline; margin-right: 10px; margin-left: 10px; }
.wrapper .pan .wrap a { text-decoration: underline; display: inline; }
.wrapper .pager-type2 { display: flex; justify-content: center; align-items: center; }
.wrapper .pager-type2 .top { margin-left: 52px; margin-right: 52px; }
.wrapper .pager-type2 .prev a { color: black; font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 14px; }
.wrapper .pager-type2 .next a { color: black; font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 14px; }
.wrapper .pager { display: flex; justify-content: center; align-items: center; margin-bottom: 140px; }
.wrapper .pager--list { display: flex; justify-content: space-between; align-items: center; }
.wrapper .pager--list .prev a { color: black; font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 14px; display: flex; justify-content: center; align-items: center; }
.wrapper .pager--list .next a { color: black; font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 14px; }
.wrapper .pager--list .num { width: 32px; height: 32px; margin-left: 12px; margin-right: 12px; display: flex; justify-content: center; align-items: center; background-color: black; }
.wrapper .pager--list .num.is-current { background-color: #efefef; }
.wrapper .pager--list .num.is-current span { color: black; }
.wrapper .pager--list .num a, .wrapper .pager--list .num span { font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; color: white; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }
.wrapper .free-content p, .wrapper .free-content div { font-family: "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 14px; line-height: 26px; }
.wrapper .free-content a { font-family: "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; text-decoration: underline; color: #0073aa; }
.wrapper .free-content a:hover { color: #00a0d2; }
.wrapper .free-content img { width: auto; height: auto; max-width: 100%; }
.wrapper .free-content img.alignright { display: block; margin: 0 0 0 auto; }
.wrapper .free-content img.alignleft { display: block; margin: 0 auto 0 0; }
.wrapper .free-content img.aligncenter { display: block; margin: 0 auto; }
.wrapper .free-content strong > p, .wrapper .free-content strong span { font-weight: bold; }
.wrapper .free-content ul { padding-left: 30px; }
.wrapper #pagetop .pagetop-block { position: fixed; height: 90px; bottom: 90px; right: 20px; display: flex; flex-direction: column; }
.wrapper #pagetop .pagetop-block::before { content: '>'; display: inline-block; transform: rotate(-90deg); font-size: 20px; }
.wrapper #pagetop .pagetop-block a { margin-top: 10px; display: inline-block; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; transform: rotate(180deg); font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; }