@charset "utf-8";

/* 各種変数
--------------------------------------------------------- */
:root {
  --font-biz-size-base: 16px;
  --font-biz-size-m: 22px;
  --font-biz-size-l: 25px;
  --border-biz-radius: 14px;
}

/* 共通系
--------------------------------------------------------- */
#content {
  padding-top: 58px;
}

/* 大枠余白調整 */
.area-outer {
  padding: 0;
}

.inner {
  padding: 45px 25px;
  max-width: 100%;
}

.inner.is-page-content {
  max-width: 100%;
  padding-top: 40px;
}

/* pc・sp表示出し分け */
.pc-only {
  display: none;
}

.sp-only {
  display: block;
}

/* header
--------------------------------------------------------- */
.header-biz .inner {
  padding: 12px 20px;
  height: 54px;
}

.header-logo {
  width: 180px;
}

/* スクロールした時 */
.header-biz.js_scroll .header-logo {
  transform: scale(0.9) translateX(-10px);
}

.header-biz.js_scroll .inner {
  padding: 10px 15px;
}

/* SPメニュー調整 */
.header-item {
  display: block;
  width: 100%;
  height: 0;
  overflow: hidden;
  background: var(--color-biz-gradation-blue);
  position: fixed;
  top: 54px;
  left: 0;
  transition: all 0.4s;
}

.header-gnav {
  margin: 10px 0 40px;
  position: relative;
}

.header-gnav::after {
  content: "";
  width: calc(100% - 50px);
  border-bottom: 1px solid #fff;
  position: absolute;
  left: 25px;
  bottom: -10px;
}

.header-gnav > ul,
.header-gnav > ul > li {
  margin: 0;
}

.header-gnav a {
  display: block;
  color: #fff;
  padding: 15px 25px;
}

.header-gnav a::after {
  display: none;
}

.header-gnav a:hover {
  color: #fff;
  text-decoration: underline;
}

/* SPメニューボタン */
.btn-sp-menu {
  width: 32px;
  height: 32px;
  background: var(--color-biz-blue);
  border-radius: 999em;
  position: relative;
}

.btn-sp-menu > .btn-sp-menu-border {
  width: 18px;
  height: 2px;
  background: #fff;
  border-radius: 999em;
  position: absolute;
  left: 7px;
  transition: all 0.2s;
}

.btn-sp-menu > .btn-sp-menu-border:nth-child(1) {
  top: 9px;
}

.btn-sp-menu > .btn-sp-menu-border:nth-child(2) {
  top: 15px;
}

.btn-sp-menu > .btn-sp-menu-border:nth-child(3) {
  bottom: 9px;
}

/* SPメニューボタン押 */
.header-biz.js_menu-active {
  background: #fff;
}

.header-item.js_menu-active {
  height: 100vh;
}

.btn-sp-menu.js_menu-active > .btn-sp-menu-border:nth-child(1) {
  width: 19px;
  top: 15px;
  transform: rotate(45deg);
}

.btn-sp-menu.js_menu-active > .btn-sp-menu-border:nth-child(2) {
  opacity: 0;
}

.btn-sp-menu.js_menu-active > .btn-sp-menu-border:nth-child(3) {
  width: 19px;
  top: 15px;
  transform: rotate(-45deg);
}

/* footer
--------------------------------------------------------- */
.footer-biz .inner {
  padding: 30px 15px;
}

/* btn
--------------------------------------------------------- */
.btn {
  font-size: 21px;
  max-width: 310px;
}

/* ボタンサイズ */
.btn.is-size-m {
  font-size: 18px;
}

.btn.is-size-s {
  font-size: 16px;
  max-width: 310px;
}

/* ボタンヘッダー用 */
.btn.is-header {
  background: #fff;
  color: var(--color-biz-blue);
  width: 300px;
  padding: 14px 2em;
  margin: 20px auto;
}

.btn.is-header::before {
  display: none;
}

.btn.is-header.is-header-document {
  padding: 16px 2em;
}

.btn.is-header.is-header-contact {
  background: rgba(255, 255, 255, 0);
  border-color: #fff;
  color: #fff;
}

.btn-wrap {
  margin-top: 35px;
}

/* 共通系ttl
--------------------------------------------------------- */

/* タイトルサイズ大 */
.ttl-lead {
  margin-bottom: 40px;
}

/* タイトルサイズ中 */
.ttl-lead-second {
  margin-bottom: 20px;
}

/* タイトルサブテキスト */
.ttl-lead .ttl-sub {
  font-size: 17px;
}

/* タイトルセクション */
.ttl-section {
  margin-bottom: 35px;
}

/* タイトル下リード文 */
.ttl-lead-text {
  background-size: 26px auto;
  padding: 5px 0 0 35px;
  margin-bottom: 40px;
}

/* ページ上部タイトル */
.ttl-page-top {
  padding: 20px 0;
  margin: 0;
}

/* list-flex
--------------------------------------------------------- */
.list-flex-pc {
  display: block;
}

.list-flex-pc > li {
  width: 100%;
}