@charset "UTF-8";
/************************************************************

基本の余白

*************************************************************/
/************************************************************

コンテンツ部分の幅

*************************************************************/
/************************************************************

メディアクエリ

*************************************************************/
/************************************************************

ボーダー

*************************************************************/
/************************************************************

カラーパレット

*************************************************************/
/************************************************************

リンクの色

*************************************************************/
/************************************************************

mixin

*************************************************************/
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W0);
  font-weight: 100;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W1);
  font-weight: 200;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W2);
  font-weight: 300;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W3);
  font-weight: 400;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W4);
  font-weight: 500;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W5);
  font-weight: 600;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W6);
  font-weight: 700;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W7);
  font-weight: 800;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W8);
  font-weight: 900;
}
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

* + * {
  margin-top: 40px;
}

html {
  overflow: auto;
}

body {
  font: 18px "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  background-image: url("../img/bg.png");
  box-sizing: border-box;
  word-break: break-all;
  overflow: hidden;
  margin: 0;
}
body h1, body h2, body h3, body h4, body h5 {
  text-align: center;
  margin-bottom: 40px;
}
body h2 {
  background-color: #0073aa;
  margin: 0px -60px;
  padding: 0 60px;
  padding-top: 20px;
  padding-bottom: 20px;
  min-height: 200px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  margin-bottom: 40px;
}
@media only screen and (min-width: 641px) {
  body h2 {
    font: 2.5em "Hiragino Sans";
    font-weight: 900;
    line-height: 1.5em;
  }
}
body h3 {
  display: flex;
  align-items: center;
}
@media only screen and (min-width: 641px) {
  body h3 {
    font-size: 1.8em;
    font-weight: bold;
  }
}
body h3 img {
  width: 50px;
  margin-right: 20px;
}
@media only screen and (min-width: 641px) {
  body h4 {
    font-size: 1.4em;
  }
}
@media only screen and (min-width: 641px) {
  body h5 {
    font-size: 1.2em;
  }
}
body p + p {
  margin-top: 40px;
}
body p:first-child {
  margin-top: 0;
}
body p:last-child {
  margin-bottom: 0;
}
body ul {
  padding-left: 0;
  margin-left: 0;
  margin-bottom: 40px;
}
body ul li {
  font-weight: bold;
  font-size: 1.2em;
  list-style: none;
  line-height: 30px;
  display: flex;
  align-items: center;
}
body ul li + li {
  margin-top: 20px;
}
@media only screen and (min-width: 641px) {
  body ul li + li {
    margin-top: 40px;
  }
}
body ul li img {
  width: 50px;
  margin-right: 20px;
}
body ol {
  padding: 0;
  margin-bottom: 40px;
}
body ol li {
  list-style: inherit;
}
body dl dt {
  font-weight: bold;
}
body dl dd {
  margin-left: 0;
  padding-left: 0;
}
body img {
  width: 100%;
  height: auto;
}
body div + div {
  margin-top: 20px;
}
@media only screen and (min-width: 641px) {
  body div + div {
    margin-top: 40px;
  }
}
body a:hover {
  opacity: 0.8;
}
body strong {
  color: #E30D21;
}
body table {
  font-size: 10px;
  table-layout: fixed;
  border-collapse: collapse;
  border: 1px solid #231815;
}
body table tr th {
  background-color: #555555;
  font-weight: normal;
  padding: 10px;
}
@media only screen and (min-width: 641px) {
  body table tr th {
    border-bottom: 1px solid #231815;
  }
}
body table tr:first-child th {
  background-color: #EFF8FE;
}
@media only screen and (min-width: 641px) {
  body table tr:first-child th {
    border-left: 1px solid #231815;
  }
}
body table tr td {
  padding: 10px;
  border-bottom: 1px solid #231815;
  box-sizing: border-box;
}
@media only screen and (min-width: 641px) {
  body table tr td {
    border-left: 1px solid #231815;
  }
}
body form input {
  margin-top: 0;
}
body form img {
  display: none;
}
body iframe {
  max-width: 640px;
  margin: auto;
  display: block;
  height: 360px;
}

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

.red {
  color: #E30D21;
}

.blue {
  color: #097bc8;
}

.green {
  color: #04B431;
}

.bgyellow {
  background-color: rgba(255, 255, 0, 0.4);
}

.bold {
  font-family: "Hiragino Sans";
  font-weight: 900;
}

.underline {
  text-decoration: underline;
}

.center {
  text-align: center;
}

.right {
  text-align: right;
}

.small {
  font-size: 0.6em;
}

.content {
  max-width: 860px;
  width: 100%;
  margin: 0 auto;
}
@media only screen and (min-width: 641px) {
  .content {
    box-shadow: 1px 0 10px 1px #999999;
  }
}

.area .areaInner {
  background-color: white;
  padding: 20px;
  box-sizing: border-box;
}
@media only screen and (min-width: 641px) {
  .area .areaInner {
    padding: 60px;
    padding-top: 20px;
    padding-bottom: 20px;
  }
}

.dspnone {
  display: none;
}

.frame {
  border: 2px dashed #cccccc;
}

.vimeo:hover {
  cursor: pointer;
}

.mgb20 {
  margin-bottom: 10px;
}

.mgb40 {
  margin-bottom: 40px;
}

.mgt20 {
  margin-top: 20px;
}

.mgt40 {
  margin-top: 40px;
}

.mgt80 {
  margin-top: 80px;
}

.mgt100 {
  margin-top: 100px;
}

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

.pc {
  display: none !important;
}
@media only screen and (min-width: 641px) {
  .pc {
    display: block !important;
    margin-top: 0;
  }
}

.area + .area {
  margin-top: 0;
}

.wrapper {
  margin: 0;
}

.sig {
  max-width: 200px;
  margin-left: auto;
  margin-top: 40px;
}

.timer {
  text-align: center;
  padding-top: 20px;
  padding-bottom: 20px;
  font-size: 1.5em;
  background-color: black;
  color: red;
  font-weight: bold;
  margin-top: 0;
  position: relative;
}

.fixed {
  position: fixed;
  width: 100%;
  top: 0;
}

body {
  background-image: none;
}

h1 {
  font-size: 3em;
  text-align: center;
  margin-bottom: 40px;
}

p, dd {
  line-height: 1.5em;
}

dt {
  font-weight: bold;
}

.wrapper {
  font-size: 0.6em !important;
  margin-bottom: 0;
}
.wrapper .main-wrap {
  max-width: 860px;
  margin: 0 auto;
  padding: 20px;
}
.wrapper .main-wrap .content-wrap {
  font-size: 1.5em;
  padding: 20px;
  width: 100% !important;
  border: 1px solid #cccccc;
  box-sizing: border-box;
}
.wrapper .main-wrap .content-wrap + .content-wrap {
  margin-top: 20px;
}
@media only screen and (min-width: 641px) {
  .wrapper .main-wrap .content-wrap + .content-wrap {
    margin-top: 40px;
  }
}

.idea p {
  text-align: center;
  font-size: 1em;
}
@media only screen and (min-width: 641px) {
  .idea p {
    font-size: 1.5em;
  }
}
.idea .lead {
  font-size: 1em;
}
@media only screen and (min-width: 641px) {
  .idea .lead {
    font-size: 2em;
  }
}

.domain li {
  font-size: 0.8em;
}
@media only screen and (min-width: 641px) {
  .domain li {
    font-size: 1.2em;
  }
}
.domain li + li {
  margin-top: 10px;
}
@media only screen and (min-width: 641px) {
  .domain li + li {
    margin-top: 20px;
  }
}

@media only screen and (min-width: 641px) {
  .ceo-message .policy {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: flex-start;
    align-content: space-between;
  }
}
@media only screen and (min-width: 641px) {
  .ceo-message .policy {
    flex-direction: row-reverse;
  }
}
.ceo-message .policy dd {
  width: 100%;
}

.company_info img {
  max-width: 847px;
  width: 100%;
  margin: auto;
  display: block;
  margin-bottom: 40px;
}
.company_info .policy {
  max-width: 600px;
  margin: auto;
}
.company_info .policy dl {
  display: flex;
  border: 1px solid #cccccc;
}
.company_info .policy dl dt {
  padding: 10px;
  min-width: 100px;
}
@media only screen and (min-width: 641px) {
  .company_info .policy dl dt {
    min-width: 150px;
  }
}
.company_info .policy dl dd {
  width: 100%;
  border-left: 1px solid #cccccc;
  padding: 10px;
  margin-top: 0;
}

.footer ul {
  max-width: 720px !important;
}
.footer ul li {
  display: block;
}

h3 {
  line-height: 1.5em;
}
@media only screen and (min-width: 641px) {
  h3 {
    font-size: 30px !important;
  }
}

ul li + li {
  margin-top: 0 !important;
}

ol {
  margin-left: 40px;
}

div + h3 {
  margin-top: 80px;
}

.policy {
  border: #cccccc 1px solid;
  padding: 20px;
}
.policy h3 {
  margin-top: 0;
}