@charset "UTF-8";
.clearfix::after {
  content: "";
  display: block;
  clear: both; }

/* ==========================================================================
   animation
   @media以下にcss animationの@keyframesを指定するとIEでアニメーションが動作しないので注意。
   ========================================================================== */
@keyframes animationA {
  0% { }
  100% { } }

/* ==========================================================================
   Foundation
   ========================================================================== */
body {
  color: #0000aa;
  font-family: "Noto Sans JP", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  line-height: 1.6;
  letter-spacing: 0.1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }
  @media screen and (max-width: 481px) {
    body {
      font-size: 12px; } }
  @media print, screen and (min-width: 482px) and (max-width: 768px) {
    body {
      font-size: 14px; } }
  @media screen and (min-width: 769px) {
    body {
      font-size: 16px; } }

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0; }

ol,
ul {
  list-style: none; }

img {
  width: 100%;
  height: auto;
  vertical-align: top;
  border: none;
  border-style: none; }
  @media print, screen and (min-width: 482px) and (max-width: 768px) {
    img {
      max-width: 100%; } }
  @media screen and (min-width: 769px) {
    img {
      max-width: 100%; } }

a {
  color: #0000aa;
  text-decoration: none;
  outline: none;
  -webkit-touch-callout: none; }

@media screen and (min-width: 769px) {
  a:hover {
    text-decoration: none; } }

a:focus,
*:focus {
  outline: none; }

body {
  margin: 0; }

@media screen and (min-width: 769px) {
  a {
    opacity: 1;
    transition: opacity .2s ease-in-out; } }

@media screen and (min-width: 769px) {
  a:hover {
    opacity: 0.7; } }

@media screen and (min-width: 769px) {
  a:hover img {
    background-color: rgba(255, 255, 255, 0.01); } }

br.SPbr {
  display: none; }
  @media screen and (max-width: 481px) {
    br.SPbr {
      display: inline; } }

br.PCbr {
  display: inline; }
  @media screen and (max-width: 481px) {
    br.PCbr {
      display: none; } }

.SPview {
  display: none !important; }
  @media screen and (max-width: 481px) {
    .SPview {
      display: block !important; } }

.PCview {
  display: block !important; }
  @media screen and (max-width: 481px) {
    .PCview {
      display: none !important; } }

input, button, textarea, select {
  margin: 0;
  padding: 0;
  background: none;
  font-weight: bold;
  font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
  cursor: pointer; }

select::-ms-expand {
  display: none; }

/* iOSでのデフォルトスタイルをリセット */
input,
textarea {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  appearance: button;
  border: none;
  box-sizing: border-box; }
  input::-webkit-search-decoration,
  textarea::-webkit-search-decoration {
    display: none; }
  input:focus,
  textarea:focus {
    outline-offset: -2px; }

.l-container {
  width: 100%;
  position: relative;
  min-height: 100%;
  margin: 0 auto; }
  @media print, screen and (min-width: 482px) and (max-width: 768px) {
    .l-container {
      max-width: 375px; } }
  @media screen and (min-width: 769px) {
    .l-container {
      max-width: 375px; } }

/* ==========================================================================
   Layout
   ========================================================================== */
.l-footer {
  padding: 20px 0 40px; }
  .l-footer .l-pagetop {
    text-align: center;
    margin: 0 0 10px; }
    .l-footer .l-pagetop .pagetop-btn {
      border: none;
      color: #ee8548;
      font-weight: 900; }
  .l-footer .copyright-wrap {
    color: #999;
    text-align: center;
    line-height: 1.4; }

.l-header {
  width: 100%;
  padding: 10px;
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 100;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: row nowrap;
      flex-flow: row nowrap;
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-align: center;
      align-items: center;
  background-color: transparent;
  transition: .3s background-color; }
  @media print, screen and (min-width: 482px) and (max-width: 768px) {
    .l-header {
      max-width: 375px; } }
  @media screen and (min-width: 769px) {
    .l-header {
      max-width: 375px; } }
  .l-header.is-low {
    background-color: rgba(255, 255, 255, 0.9); }
  .l-header__logo {
    width: 120px;
    font-size: 0; }
  .l-header__btn a {
    padding: 5px 25px 5px 20px;
    background-color: #ee8548;
    color: #fff;
    border-radius: 20px;
    font-weight: bold;
    box-shadow: 0 1px 2px #5e5e5e;
    font-weight: 900;
    position: relative; }
    .l-header__btn a::after {
      content: '';
      display: inline-block;
      width: 5px;
      height: 5px;
      border: 2px solid #fff;
      border-style: none solid solid none;
      top: 50%;
      right: 5px;
      transform: translate(-50%, -50%) rotate(-45deg) skew(-5deg, -5deg);
      transition: border-color 0.3s cubic-bezier(0.445, 0.05, 0.55, 0.95), transform 0.3s cubic-bezier(0.445, 0.05, 0.55, 0.95);
      position: absolute; }

/* ==========================================================================
   Object
   ========================================================================== */
/* Component
   ----------------------------------------------------------------- */
/* Project
   ----------------------------------------------------------------- */
.lp-cta {
  position: relative; }
  .lp-cta .btn {
    width: 350px;
    max-width: 100%;
    position: absolute;
    bottom: 20px;
    left: 50%;
    z-index: 10;
    transform: translate(-50%); }
  .lp-cta--foot {
    padding: 30px 0;
    text-align: center; }
    .lp-cta--foot .btn:not(:last-child) {
      margin-bottom: 20px; }

.lp-voices {
  background-color: #e1f5f4;
  padding-bottom: 20px; }
  .lp-voices-item {
    margin: 0 10px; }

/*
@include sp($point-sp) {}
@include tb($point-tb) {}
@include pc01($point-pc01) {}
@include pc02($point-pc02) {}
*/
/* ==========================================================================
   print
   ========================================================================== */
==== */