@import "reset.less";
@import "colors.less";
@import "form.less";


:root {
  --main-text-color: #3E3E3E;
  --main-bg-color: #F6F6F9;
  --font-weight-bold: 600;
}

body {
  font-family: Avenir, "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
  font-size: 14px;
  color: var(--main-text-color);
  line-height: 1;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: var(--font-weight-bold);
}

textarea {
  line-height: 1.4;
}
p {
  line-height: 1.4;
  -webkit-tap-highlight-color: initial;
  -webkit-user-select: initial;
  -webkit-touch-callout: initial;
}


/*
 * for spat
 */
[data-is="app"] {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.app-body {
  height: 100%;
}
spat-nav {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}
.spat-pages {
  position: absolute;
  width: 100%;
  height: 100%;
}
.spat-page {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: var(--main-bg-color);
}
.container {
  max-width: 960px;
  margin: auto;
}


// meltline

each(360 400, {
  .w@{value} {
    width: unit(@value, px);
  }
  .h@{value} {
    height: unit(@value, px);
  }
  .s@{value} {
    width: unit(@value, px);
    height: unit(@value, px);
  }
});