@charset "UTF-8";
body,
html {
  font-size: 10px;
  font-family: "Open Sans", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
  font-weight: 400;
  font-style: normal;
}
body{
  width: 100%;
  min-height: 100vh;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: none !important;
  transition: none !important;
  overflow-x: hidden;
  letter-spacing: 0.1rem;
  -webkit-font-feature-settings: "palt";
  font-feature-settings: "palt";
  height: 100%;
  overflow-y: scroll;
  scroll-behavior: smooth;
}
html{
  height: 100%;
  overflow: hidden;
}
a {
  text-decoration: none;
  color: #000000;
}

#f_menu .container{
    position: relative;
    height: 100%;
}

#f_menu {
    width: 100%;
    height: 60px;
    position: fixed;
    top: 0;
    z-index: 200;
    background-color: #174c92;
    -webkit-transform: translateY(-80px);
    transform: translateY(-80px);
    -webkit-transition: 0.4s;
    transition: 0.4s;
}
.page_wrap.scroll #f_menu {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
}
#f_menu .logo {
    width: 150px;
    height: 60px;
    background-image: url("../img/header.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    top: 0;
    bottom: 0;
    right: auto;
    left: 0;
    margin: auto;
}
#f_menu .logo_center {
    width: 250px;
    height: 60px;
    background-image: url("../img/header.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    margin:0 auto;
}
#f_menu .logo a {
    width: 100%;
    height: 100%;
    display: block;
}


.fixed_center {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.flex{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.text {
  font-size: calc((100vw - 40px) / 23);
}

@media screen and (min-width: 600px) {
  .text {
    font-size: calc((100vw - 40px) / 30);
  }
}

@media screen and (min-width: 960px) {
  .text {
    font-size: 1.4rem;
  }
}

@media screen and (min-width: 1024px) {
  .text {
    font-size: 1.8rem;
    line-height: 1.8;
  }
}

main{
    background-color: #fef8f0;
}


@media screen and (min-width: 960px) {
.for_sp {
    display: none !important;
}

  #f_menu {
    height: 80px;
  }
  #f_menu .logo {
    width: 150px;
  }
    #f_menu .logo_center {
    width: 500px;
  }
}

body.scroll #f_menu {
  -webkit-transform: translateY(0px);
          transform: translateY(0px);
}


/*アニメイト*/
.fade_up.start {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-transition: 1s;
    transition: 1s;
}
.fade_up {
    opacity: 0;
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
}