/* reset
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, dialog, figure, footer, header, hgroup, menu, nav,
section, time, mark, audio, video
  -webkit-box-sizing: border-box
  -moz-box-sizing: border-box
  box-sizing: border-box
  margin: 0
  padding: 0
  border: 0
  outline: 0
  font-size: 100%

body
  background: #fff
  font-family: 'Noto Sans CJK JP', 'Noto Sans JP', Hiragino Kaku Gothic ProN, "ヒラギノ角ゴ ProN W3", Hiragino Sans, "ヒラギノ角ゴシック", Roboto, "Droid Sans", YuGothic, "游ゴシック", Meiryo, "メイリオ", Verdana, "ＭＳ Ｐゴシック", sans-serif
  font-size: 12px
  font-weight: 400
  letter-spacing: 0em
  color: #595757

.lato
  font-family: 'Lato', sans-serif
  font-weight: 400

p, h1, h2, h3, h4
  color: #595757

a
  display: block
  color: #595757
  text-decoration: none

h1, h2, h3, h4
  font-size: 100%
  font-weight: bold
  line-height: 100%

ul
  list-style: none

img
  -webkit-backface-visibility: hidden
  backface-visibility: hidden
  vertical-align: top
  border: none
  object-fit: contain

table
  border-collapse: collapse
  border-spacing: 0

input, button, select, textarea
  -webkit-appearance: none

input
  &[type="text"], &[type="mail"], &[type="password"]
    padding: 0
    border: none
    border-radius: 0
    background: none
    outline: none

button
  padding: 0
  border: none
  background: none

*:focus
  outline: none

/* reset_end

.none
  opacity: 0

.pc_co
  display: block !important

.sp_co
  display: none !important

@media (max-width: 768px)
  .pc_co
    display: none !important

  .sp_co
    display: block !important


.c_more_btn
  width: 300px
  margin: 0 auto
  text-align: center
  a
    display: block
    border-radius: 30px
    box-sizing: border-box
    line-height: 60px
    font-size: 24px
    font-weight: 400
    letter-spacing: 0.01em
    background: #EFEFEF
    transition: .3s all
    cursor: pointer
    &:hover
      opacity: 0.8

.c_contet
  width: 100%
  margin: 0 auto

.c_bg_gray
  background: #EFEFEF
  .c_footer
    background: #EFEFEF

.c_nav_area
  position: relative
  overflow: hidden

.c_header
  position: fixed
  top: 0px
  z-index: 100
  width: 100%
  &.add_absolute
    position: absolute
  &_inner
    position: relative
    .logo
      position: absolute
      top: 17px
      left: 17px
    .glo_nav_btn
      position: absolute
      top: 20px
      right: 20px
      z-index: 10
      display: inline-block
      transition: all .4s
      box-sizing: border-box
      width: 30px
      height: 25px
      background: none
      border: none
      appearance: none
      cursor: pointer
      span
        display: inline-block
        transition: all .4s
        box-sizing: border-box
        position: absolute
        left: 0
        width: 100%
        height: 3px
        &:nth-of-type(1)
          top: 0
          background: #6CD378
        &:nth-of-type(2)
          top: 11px
          background: #F0EF09
        &:nth-of-type(3)
          bottom: 0
          background: #FD7DA9
      &.active
        span
          height: 3px
          &:nth-of-type(1)
            background: #4C4948
            transform: translateY(12px) rotate(-35deg)
          &:nth-of-type(2)
            opacity: 0
            background: #4C4948
          &:nth-of-type(3)
            background: #4C4948
            transform: translateY(-10px) rotate(35deg)
    .glo_nav
      position: absolute
      top: 0px
      right: 0px
      height: 100vh
      width: 270px
      padding: 156px 0 0 52px
      background: #fff
      transform: translateX(280px)
      transition: .5s all
      box-shadow: -3px 0px 10px rgba(0,0,0,0.1)
      @media(max-width: 374px)
        padding: 110px 0 0 52px
      &.active
        transform: translateX(0px)
      &.loading
        transition: 0s all
      .glo_nav_list
        &_item
          margin-bottom: 36px
          @media(max-width: 374px)
            margin-bottom: 35px
          .ttl
            display: flex
            &::before
              display: inline-block
              content: ""
              width: 10px
              height: 10px
              margin: 8px 14px 0 0
              border-radius: 10px
          &:nth-child(1),&:nth-child(4),&:nth-child(7)
            .ttl
              &::before
                background: #FD7DA9
          &:nth-child(2),&:nth-child(5),&:nth-child(8)
            .ttl
              &::before
                background: #F0EF09
          &:nth-child(2)
            .ttl
              height: 26px
          &:nth-child(3),&:nth-child(6),&:nth-child(9)
            .ttl
              &::before
                background: #6CD378
          &:last-child
            margin-bottom: 0px
          .route_n_link_list
            padding: 30px 0 0 23px
            @media(max-width: 374px)
              padding: 23px 0 0 23px
            li
              display: flex
              margin-bottom: 26px
              @media(max-width: 374px)
                margin-bottom: 20px
              &::before
                display: inline-block
                content: ""
                width: 9px
                height: 9px
                margin: 16px 14px 0 0
                border-radius: 9px
                background: #595757
              &:last-child
                margin-bottom: 0px
              .num
                margin-bottom: 6px
                line-height: 1
              .name
                font-size: 12px
                font-weight: 400
                line-height: 1.5
                letter-spacing: 0.1em


.c_footer
  width: 100%
  margin: 0 auto
  padding: 0px 30px 30px
  background: #fff
  .logo
    margin-bottom: 60px
  .text
    margin-bottom: 25px
    .link
      margin-bottom: 34px
      p
        margin-bottom: 15px
        &:hover
          a
            text-decoration: none
        a
          font-size: 14px
          font-weight: 400
          line-height: 1
          letter-spacing: 0.05em
          text-decoration: underline
        &:last-child
          margin-right: 0
      .inside
        margin-bottom: 34px
      .outside
        p
          a
            &::after
              content: ""
              display: inline-block
              width: 15px
              height: 15px
              margin: 0px 0 -1px 6px
              background: url('/sp/img/common/footer_link_arrow.png') no-repeat center/contain
    .info
      font-size: 12px
      font-weight: 400
      line-height: 21px
      letter-spacing: 0.05em
  .copy_right
    font-family: 'Lato', sans-serif
    font-size: 12px
    font-weight: 400
    line-height: 1
    letter-spacing: 0.05em

.c_top_scroll
  display: none
  position: absolute
  right: 20px
  bottom: 616px
  z-index: 1
  border-radius: 40px
  background: #6CD378
  transition: .3s all
  a
    width: 60px
    height: 43px
    padding-top: 17px
    text-align: center