@charset "utf-8";

/* サイト名 基本設定CSS */


/*

    1. 共通設定
    2. フォント・リンク設定
    3. 段落設定
    4. 汎用セレクタ

*/

/* -------------------------------------------
    1. 共通設定
  ------------------------------------------- */

* {
  margin: 0;
  padding: 0;
}

html,body {
  height: 100%;
  margin: 0px;
  font-size: 62.5%;
  line-height: 18px;
  color: #333333;
  background: #000;
  word-wrap: break-word;
}

.clear {
  clear: both;
}

img {
  vertical-align: baseline;
  -ms-interpolation-mode: bicubic;
  max-width: 100%;
}

a img {
  border: 0;
}

.clearfix:after {
  content: ".";  /* 新しい要素を作る */
  display: block;  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  font-size: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*¥*//*/
  height: auto;
  overflow: hidden;
  /**/
}

/* -------------------------------------------
    2. フォント・リンク設定
  ------------------------------------------- */

/* ------------ フォント ------------ */

body {
  font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
}


/* ------------ フォントカラー ------------ */

/* 例えば共通の色を付けたいときなどに使う
.fc-org {
  color: #FF6600;
}
*/

/* ------------ リンク ------------ */

a {
  color: #00AFF0;
  overflow: hidden;
  outline: none;
  transition-property: all;
  transition: 0.3s linear;
}

a:hover {
  color: #444;
  opacity: 0.8;
}

/* ------------ 選択時 ------------ */

/*

::selection {
  background: #ffdddd;
  color: #000;
}

::-moz-selection {
  background: #ffdddd;
  color: #000;
}

*/

/* -------------------------------------------
    3. 段落設定
  ------------------------------------------- */

#container {
  margin: 0;
  padding: 0;
  max-width: 1920px;
}

div#container {
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: 0;
  text-align: left;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

#main {
  width: 1000px;
  margin: 0 auto;
  height: auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

#header {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  padding: 35px 0 20px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

#footer {
  width: 100%;
  margin: 0 auto;
  padding: 0 0 10px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.wrapper {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  position: relative;
}

/* -------------------------------------------
    4. 汎用セレクタ
  ------------------------------------------- */

/* ------------ マージン ------------ */

.mt-10 { margin-top: 10px !important; }
.mt-20 { margin-top: 20px !important; }
.mt-30 { margin-top: 30px !important; }
.mt-40 { margin-top: 40px !important; }

.mb-10 { margin-bottom: 10px !important; }
.mb-20 { margin-bottom: 20px !important; }
.mb-30 { margin-bottom: 30px !important; }
.mb-40 { margin-bottom: 40px !important; }

.ml-10 { margin-left: 10px !important; }
.ml-20 { margin-left: 20px !important; }
.ml-30 { margin-left: 30px !important; }
.ml-40 { margin-left: 40px !important; }

.mr-10 { margin-right: 10px !important; }
.mr-20 { margin-right: 20px !important; }
.mr-30 { margin-right: 30px !important; }
.mr-40 { margin-right: 40px !important; }

/* ------------ パディング ------------ */

.pt-10 { padding-top: 10px !important; }
.pt-20 { padding-top: 20px !important; }
.pt-30 { padding-top: 30px !important; }
.pt-40 { padding-top: 40px !important; }

.pb-10 { padding-bottom: 10px !important; }
.pb-20 { padding-bottom: 20px !important; }
.pb-30 { padding-bottom: 30px !important; }
.pb-40 { padding-bottom: 40px !important; }

.pl-10 { padding-left: 10px !important; }
.pl-20 { padding-left: 20px !important; }
.pl-30 { padding-left: 30px !important; }
.pl-40 { padding-left: 40px !important; }

.pr-10 { padding-right: 10px !important; }
.pr-20 { padding-right: 20px !important; }
.pr-30 { padding-right: 30px !important; }
.pr-40 { padding-right: 40px !important; }