@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Geologica:wght@100;200&display=swap');
body { width: 100%; font-family: "Geologica", "Yu Gothic Medium", "游ゴシック Medium", "YuGothic", "游ゴシック体", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Meiryo", "メイリオ", "Osaka", "MS PGothic", "arial", "helvetica", "sans-serif"; font-size: 16px; color: #262626; }
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0; line-height: 1.8; vertical-align: bottom; }
ul, ol { list-style-type: none; }
img { width: 100%; }
a { color: #28a4d5; transition : all 0.2s; text-decoration: none; }
a:hover { opacity: 0.8; }
.pc { display: block !important; }
.sp { display: none !important; }
.center { text-align: center; }
.bg--white { background-color: #fff; }
.bg--gray { background-color: #f0f0f0; }
.border--solid { border: solid 1px #ddd; }

/*-- マージン --*/
.bottom-space0 { margin-bottom: 0 !important; }
.bottom_space10 { margin-bottom: 10px !important; }
.bottom_space20 { margin-bottom: 20px !important; }
.bottom_space30 { margin-bottom: 30px !important; }
.bottom_space50 { margin-bottom: 50px !important; }
.bottom_space80 { margin-bottom: 80px !important; }
.bottom_space100 { margin-bottom: 100px !important; }

/*-- header --*/
.header__logo { position: fixed; z-index: 4; width: 100px; height: auto; top: 0; left: 0; }
.header__copy { position: absolute; top: 40px; right: 40px; font-size: 16px; }

/*-- ハンバーガーメニュー --*/
.hamburger { display: block; position: fixed; z-index: 3; width: 100px; height: 100px; top: 100px; left: 0; text-align: center; cursor: pointer; background-color: #262626; }
.hamburger span { display: block; position: absolute; width: 24px; height: 4px ; left: 38px; background: #fff; -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
.hamburger span:nth-child(1) { top: 38px; }
.hamburger span:nth-child(2) { top: 48px; }
.hamburger span:nth-child(3) { top: 58px; }
/* ハンバーガーメニュー × */
.hamburger.active span:nth-child(1) { top: 48px; left: 38px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg); }
.hamburger.active span:nth-child(2),.hamburger.active span:nth-child(3) { top: 48px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg); }

/*-- グローバルナビ --*/
nav.global-nav { position: fixed; z-index: 2; width: 300px; height: 100%; top: 0; left: 0; text-align: center; background: #262626; transform: translateX(-100%); transition: all 0.4s; }
nav.global-nav ul { width: 100%; padding-top: 100px; background: #262626; }
nav.global-nav ul li { width: 100%; }
nav.global-nav ul li a { display: block; padding: 1.5em 0; font-size: 20px; font-weight:lighter; color: #fff; }
nav.global-nav.active { transform: translateX(0%); }

/*-- レイアウト --*/
.common__contents { width: 100%; padding: 60px 0; }
.common__inner { width: 800px; margin: 0 auto; }

/*-- 見出し --*/
.heading--style01 { margin-bottom: 10px; font-size: 58px; font-weight: normal; text-align: center; }

/*-- テキスト --*/
.copy { margin-bottom: 30px; font-size: 24px; }
.note { font-size: 13px; }

/*-- ボタン --*/
.link-btn--black { width: 280px; margin: 0 auto 10px; }
.link-btn--black > a { display: block; padding: 0.6em; font-size: 17px; text-decoration: none; text-align: center; color: #fff; background-color: #262626; border-radius: 30px; box-shadow: 0 3px 5px 0 rgba(0, 0, 0, .3); }
#pagetop-btn { position: fixed; width: 60px; height: auto; right: 20px; bottom: 20px; }

/*-- contact --*/
.contact { width: 100%; padding: 60px 0; background-color: #f0f0f0; }

/*-- footer --*/
.footer { width: 100%; padding-top: 50px; color: #fff; background-color: #262626; }
.footer a { font-weight:lighter; color: #fff; }
.footer__content { display: flex; flex-wrap: wrap; justify-content: space-between; width: 800px; margin: 0 auto 20px; }
.footer__company { width: 300px; border-right: solid 1px #4d4d4d; }
.footer__logo { width: 250px; height: auto; margin-bottom: 30px; }
.footer__company p { font-size: 12px; }
.footer__nav { width: 450px; }
.footer__nav ul { display: flex; flex-wrap: wrap; justify-content: start; }
.footer__nav li { margin-right: 30px; }
.footer__nav li:last-child { margin-right: 0; }
.footer__copyright { width: 100%; padding: 0.5em 0 1.5em; font-size: 18px; text-align: center; }

/*-- スクロールエフェクト --*/
.scroll_up { transition: 0.6s ease-in-out; transform: translateY(30px); opacity: 0; }
.scroll_up.on { transform: translateY(0); opacity: 1.0; }

@media screen and (max-width: 767px) {
  body { font-size: 15px; }
  a:hover { opacity: 1; }
  .pc { display: none !important; }
  .sp { display: block !important; }

  /*-- マージン --*/
  .bottom_space10 { margin-bottom: 1% !important; }
  .bottom_space20 { margin-bottom: 2% !important; }
  .bottom_space30 { margin-bottom: 3% !important; }
  .bottom_space50 { margin-bottom: 5% !important; }
  .bottom_space80 { margin-bottom: 8% !important; }
  .bottom_space100 { margin-bottom: 10% !important; }

  /*-- header --*/
  .header__logo { width: 60px; }
  .header__copy { top: 10px; right: 10px; font-size: 12px; text-align: right; }

  /*-- ハンバーガーメニュー --*/
  .hamburger { width: 60px; height: 60px; top: 60px; }
  .hamburger span { width: 20px; height: 3px ; left: 20px; background: #fff; }
  .hamburger span:nth-child(1) { top: 20px; }
  .hamburger span:nth-child(2) { top: 28px; }
  .hamburger span:nth-child(3) { top: 36px; }
  /* ハンバーガーメニュー × */
  .hamburger.active span:nth-child(1) { top: 28px; left: 20px; }
  .hamburger.active span:nth-child(2),.hamburger.active span:nth-child(3) { top: 28px; }

  /*-- グローバルナビ --*/
  nav.global-nav { width: 230px; }
  nav.global-nav ul { padding-top: 60px; }
  nav.global-nav ul li a { padding: 1.0em 0; font-size: 17px; }

  /*-- レイアウト --*/
  .common__contents { width: 100%; padding: 10% 0; }
  .common__inner { width: 100%; padding: 0 5%; }

  /*-- 見出し --*/
  .heading--style01 { margin-bottom: 5%; font-size: 34px; }

  /*-- テキスト --*/
  .copy { margin-bottom: 5%; font-size: 15px; }
  .note { font-size: 12px; }

  /*-- ボタン --*/
  .link-btn--black { width: 240px; margin-bottom: 2%;　}
  .link-btn--black > a { font-size: 15px; }
  #pagetop-btn { width: 50px; right: 10px; bottom: 10px; }

  /*-- contact --*/
  .contact { width: 100%; padding: 10% 5%; }

  /*-- footer --*/
  .footer { padding-top: 10%; }
  .footer__content { width: 100%; margin-bottom: 3%; }
  .footer__company { width: 100%; margin-bottom: 8%; text-align: center; border-right: none; }
  .footer__logo { width: 210px; margin: 0 auto 8% }
  .footer__company p { display: inline-block; text-align: left; }
  .footer__nav { width: 100%; }
  .footer__nav li { width: 50%; margin-right: 0; }
  .footer__nav li:nth-child(odd) { border-right: solid 1px #4d4d4d; }
  .footer__nav li > a { display: block; padding: 0.8em 0; font-size: 16px; text-align: center; border-bottom: solid 1px #4d4d4d; }
  .footer__nav li:nth-child(1), .footer__nav li:nth-child(2) { border-top: solid 1px #4d4d4d; }
  .footer__copyright { font-size: 15px; }
}