@charset "UTF-8";
/* ========================================================= common
========================================================= */
/* --------------------------------------------------------- base
--------------------------------------------------------- */
/* リセット
--------------------------------------------------------- */
/* 要素のフォントサイズやマージン・パディングをリセットしています */
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%; font-weight: normal; vertical-align: baseline; background: transparent; }

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

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

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

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

/* 画像の下に隙間ができてしまうのを防ぎます */
img { vertical-align: top; font-size: 0; line-height: 0; }

/* 全体に関わるスタイル
--------------------------------------------------------- */
body { background-color: #fff; color: #222; font-family: 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif; letter-spacing: 0.1em; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; width: 100%; min-width: 980px; }

::selection { background-color: #ff9326; color: #fff; }

::-moz-selection { background-color: #ff9326; color: #fff; }

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

a:hover { opacity: 0.7; }

body, .anchor_nav.is-fixed .anchor_nav__movable_area, .is-fixed + .head_area::before { min-width: 1000px; }

/* --------------------------------------------------------- util
--------------------------------------------------------- */
/* float関連 */
.u-clearfix { zoom: 1; }

.u-clearfix:after { content: ''; display: block; clear: both; }

.u-fl { float: left !important; }

.u-fr { float: right !important; }

/* text align */
.u-al { text-align: left !important; }

.u-ar { text-align: right !important; }

.u-ac { text-align: center !important; }

/* その他汎用クラス
--------------------------------------------------------- */
.u-inner_width { width: 960px; margin: 0 auto; }

/* --------------------------------------------------------- z-index
--------------------------------------------------------- */
.anchor_nav.is-fixed .anchor_nav__movable_area { z-index: 9; }

/* ========================================================= modules
========================================================= */
/* --------------------------------------------------------- anchor
--------------------------------------------------------- */
/* anchor_nav
--------------------------------------------------------- */
.anchor_nav { height: 86px; font-size: 16px; line-height: 86px; }

.anchor_nav__movable_area { background-color: #fff; }

.anchor_nav.is-fixed .anchor_nav__movable_area { position: fixed; top: 0; right: 0; left: 0; }

.anchor_nav__nav { display: table; table-layout: fixed; }

.anchor_nav__item { display: table-cell; white-space: nowrap; vertical-align: top; }

.anchor_nav__item:nth-child(1) { text-align: left; }

.anchor_nav__item:nth-child(2) { text-align: right; }

.anchor_nav__item:nth-child(3) { text-align: right; }

.anchor_nav__item a { display: inline-block; position: relative; padding: 0 20px 0 34px; vertical-align: top; }

.anchor_nav__item a::before { content: ''; position: absolute; top: 30px; left: 0; width: 24px; height: 26px; background-repeat: no-repeat; }

.anchor_nav__item a::after { content: ''; position: absolute; top: 38px; right: 0; width: 15px; height: 10px; background: url(../img/icon-arrow.png) no-repeat; }

/* anchor_target
--------------------------------------------------------- */
.anchor_target { padding-top: 86px; margin-top: -86px; }

/* --------------------------------------------------------- download_bts
--------------------------------------------------------- */
.download_bts { line-height: 0; }

.download_bts__bt { display: inline-block; vertical-align: top; }

/* download_bts--small */
.download_bts--small { padding-top: 25px; }

.download_bts--small .download_bts__bt { padding-right: 20px; }

/* download_bts--large */
.download_bts--large { position: relative; padding: 80px 0 84px; background-color: #fff; text-align: center; }

.download_bts--large .download_bts__bt { padding: 0 15px; }

/* --------------------------------------------------------- footer
--------------------------------------------------------- */
.footer { position: relative; background-color: #eee; }

.footer__sns_bts { float: left; padding-top: 21px; }

.footer__sns_bts__bt { display: inline-block; padding-right: 20px; line-height: 20px; vertical-align: top; }

.footer__sns_bts__bt a { vertical-align: top; }

.footer__sns_bts__bt a img { vertical-align: middle; }

.footer__copyright { float: right; color: #888; font-size: 11px; line-height: 62px; }

/* --------------------------------------------------------- header
--------------------------------------------------------- */
.header { padding: 17px 14px 16px; line-height: 0; }

.header__logo a:hover { opacity: 1; }

/* --------------------------------------------------------- head_area
--------------------------------------------------------- */
.head_area { position: relative; padding-top: 68px; background-repeat: no-repeat; background-position: center 86px; background-size: cover; background-attachment: fixed; color: #fff; text-align: center; }

.head_area a { color: #fff; }

.head_area__headline { position: relative; padding-bottom: 48px; background-repeat: no-repeat; background-position: center top; font-size: 28px; }

.head_area__text { position: relative; font-size: 16px; line-height: 2.0; }

/* head_area--01 */
.head_area--about { padding-bottom: 102px; background-image: url(../img/bg-about.jpg); background-position: 50% 100%; }
