@charset "UTF-8";
/* *****************************
 *
 * Import file to Scss or Sass.
 *
 **************************** */
 /* -----------------------------------------------------------------

 #01　リセット

 ------------------------------------------------------------------ */
* {
  font-style: normal;
  margin: 0px;
  padding: 0px;
  text-decoration: none; }

html {
  font-size: 62.5%;
  line-height: 1.6; }

ul {
  list-style: none; }

fieldset {
  border: 0; }

img {
  border: 0;
  vertical-align: bottom; }

 /* -----------------------------------------------------------------

 #02　基本タグの定義

 ------------------------------------------------------------------ */
body {
  color: #333333;
  font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
  -webkit-font-feature-settings: 'palt' 1;
  font-feature-settings: 'palt' 1;
  background-color: #FFFFFF;
  letter-spacing: 0.05em;
  text-align: left;
  background-repeat: no-repeat;
  width: auto;
  height: 100%;
  margin: 0px auto;
  background-position: top; }

h1, h2, h3 {
  font-weight: 100; }

p {
  text-align: left;
  font-size: 1.3em; }

span {
  font-size: 1em;
  text-align: left; }

em, strong {
  font-style: normal;
  font-weight: 100; }

a img {
  border-style: none;
  outline: medium none; }

object {
  border-style: none;
  outline: medium none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

caption, th {
  text-align: left; }

ol, ul, dl {
  list-style: none; }

a {
  font-size: 1em;
  color: #023461;
  text-decoration: none;
  outline: none;
  -webkit-transition: 0.30s;
  -moz-transition: 0.30s;
  -ms-transition: 0.30s;
  -o-transition: 0.30s;
  transition: 0.30s; }
  a:hover {
    text-decoration: underline;
    opacity: 0.7; }
  a:link {
    outline: medium none; }
  a:visited {
    outline: medium none; }

#wrapper img {
  width: auto;
  height: auto;
  max-width: 100%; }

/* -----------------------------------------------------------------
@mixin
------------------------------------------------------------------ */
.pc {
  display: none !important; }
  @media screen and (min-width: 750px) {
    .pc {
      display: inherit !important; } }

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

#wrapper {
  position: relative;
  width: 100%;
  max-width: 750px;
  margin: 0 auto; }
  #wrapper strong, #wrapper a, #wrapper span, #wrapper img {
    display: block; }
  #wrapper img {
    width: 100%;
    height: auto; }
  #wrapper p,
  #wrapper h2 {
    width: 100%; }
  #wrapper header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10; }
    #wrapper header ul {
      position: relative;
      top: 0;
      left: 0;
      display: flex;
      width: 100%;
      max-width: 750px;
      margin: 0 auto; }
      #wrapper header ul li {
        width: 240px; }
        #wrapper header ul li:first-child {
          width: 270px; }
  #wrapper main {
    position: relative;
    top: 0;
    left: 0;
    padding: 130px 0 0 0; }
    #wrapper main ul {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      width: 680px;
      margin: 0 auto; }
      #wrapper main ul li {
        width: 328px;
        margin: 0 0 48px 0; }
    #wrapper main div {
      position: relative;
      top: 0;
      left: 0; }
      #wrapper main div.mb {
        margin: 0 0 42px 0; }
      #wrapper main div .btn {
        position: absolute;
        bottom: 20px;
        left: 75px;
        width: 630px; }
      #wrapper main div .btn2 {
        position: absolute;
        top: 100px;
        left: 35px;
        width: 680px; }
      #wrapper main div ol {
        display: flex;
        justify-content: space-between;
        position: absolute;
        bottom: 0;
        left: 35px;
        width: 680px;
        margin: 0 auto; }
        #wrapper main div ol li {
          width: 328px; }
  #wrapper footer {
    position: fixed;
    bottom: 0;
    right: 0;
    width: 100%;
    z-index: 10; }
    #wrapper footer p {
      display: flex;
      justify-content: flex-end;
      width: 100%;
      max-width: 750px;
      margin: 0 auto; }
      #wrapper footer p a {
        width: 150px; }
  @media screen and (max-width: 750px) {
    #wrapper header ul li {
      width: 32vw; }
      #wrapper header ul li:first-child {
        width: 36vw; }
    #wrapper main {
      padding: 17.3333333333vw 0 0 0; }
      #wrapper main ul {
        width: 90.6666666667vw; }
        #wrapper main ul li {
          width: 43.7333333333vw;
          margin: 0 0 6.4vw 0; }
      #wrapper main div.mb {
        margin: 0 0 5.6vw 0; }
      #wrapper main div .btn {
        bottom: 2.6666666667vw;
        left: 10vw;
        width: 84vw; }
      #wrapper main div .btn2 {
        top: 13.3333333333vw;
        left: 4.6666666667vw;
        width: 90.6666666667vw; }
      #wrapper main div ol {
        left: 4.6666666667vw;
        width: 90.6666666667vw; }
        #wrapper main div ol li {
          width: 43.7333333333vw; }
    #wrapper footer p a {
      width: 20vw; } }

/*# sourceMappingURL=layout.css.map */