/*-----------------------------------------------------------
    Theme Name: ichigekisou
    Theme URI:
    Description:
    Version: 1.0.0
-------------------------------------------------------------*/

/*-----------------------------------------------------------
    1.  General Styles
    2.  top-image
    3.  header
    4.  header-nav
    5.  main
    6.  image-holder
    7.  contents
    8.  news-content
    9.  heading-large
    10. heading-medium
    11. heading-small
    12. separator-ruler
    13. code-frame
    14. footer
    15. footer-nav
    16. Responsive Section  */


/*-----------------------------------------------------------
    1. General Styles
-------------------------------------------------------------*/

body{
    font-family: "Meiryo"; /* フォント指定 */
    background-color:#0b1d2c; /* 一番後ろの背景色 */
    overflow-x: hidden;
  }


a,p,td{
    color:#333;
    font-size:11px;
}


ul{
    list-style: none;
    margin:0px; /* margin初期化 */
    padding-inline-start: 0px; /* padding-inline-startの初期化 */
}

li{
    display: inline-block;
    position: relative;
}

table{
    border:1px solid #999; /* テーブル表の枠 */
}

td{
    padding:10px 15px; /* テーブル表 数値周りの余白 */
}

textarea{
    font-size:11px;
}

.vertical{
    color:#fff;/* バーティカルバー色指定 */
    font-size:11px;/* バーティカルバーフォントサイズ指定 */
}

.container-01{
    width:728px; /* コンテナの横幅 */
    margin:0 auto; /* コンテナ 中央寄せ */
    overflow: hidden;
}

.frame{
    padding:64px;
    background-color:#FFFFFF;
    background-repeat:no-repeat;
    background-image: url(../img/frame01.svg), /* コンテンツ部分の背景 左上 */
                      url(../img/frame02.svg), /* コンテンツ部分の背景 右上 */
                      url(../img/frame03.svg), /* コンテンツ部分の背景 左下 */
                      url(../img/frame04.svg) /* コンテンツ部分の背景 右下 */
                      ;
    background-position: top left,
                         top right,
                         bottom left,
                         bottom right;
}


.text-box-01{
    font-size:11px;/* テキスト記入部分フォントサイズ */
    height:18px;/* テキスト記入部分高さ */
    position: relative;/* テキスト記入部分位置調整 */
    top:-2px;/* テキスト記入部分位置調整 */
    margin:0px 5px;/* テキスト記入部分余白調整 */
}

.button-01{
    height:18px;/* ボタン高さ */
    font-size: 7px;/* ボタンフォントサイズ */
    border: 1px solid;
    text-align: center;
    color: #333;
    border-radius: 2px;
    position: relative;
    top:-2px;
}

.button-01:hover{
    opacity: 0.8;
    cursor: pointer;
}

.link-list a{
    color:#fff;
    padding:10px 10px;
}

/* テキスト記入部分・ボタン選択時のアウトライン初期化 */
input[type="text"]:focus {
    outline: 0;
  }

input[type="button"]:focus {
    outline: 0;
}

textarea{
    outline: 0;
}

.newsbody{
    white-space: pre;
}


/*-----------------------------------------------------------
    2. top-image
-------------------------------------------------------------*/




/*-----------------------------------------------------------
    3. header
-------------------------------------------------------------*/




/*-----------------------------------------------------------
    4. header-nav
-------------------------------------------------------------*/

.header-nav{
    background-color: #333;/* ヘッダーナビ背景色指定 */
}

.header-nav a{
    color:#fff; /* ヘッダーナビ文字色指定 */
    padding:10px 15px;
    display:inline-block;
}

.bg-navsub {
    background-color: #112;/* ヘッダーナビ背景色指定 */
}

/*-----------------------------------------------------------
    5. main
-------------------------------------------------------------*/




/*-----------------------------------------------------------
    6. image-holder
-------------------------------------------------------------*/




/*-----------------------------------------------------------
    7. contents
-------------------------------------------------------------*/




/*-----------------------------------------------------------
    8. news-content
-------------------------------------------------------------*/

.news-content-title{
    font-size:15px;
    font-weight: bold;
}



/*-----------------------------------------------------------
    9. heading-large
-------------------------------------------------------------*/

.heading-large h3{
    font-size:18px;
    font-weight: bold;
    padding-left: 25px;
    background: url(../img/heading-large-icon.svg) no-repeat left top; /* 見出しタイトル 大アイコン */
}


/*-----------------------------------------------------------
    10. heading-medium
-------------------------------------------------------------*/

.heading-medium h3{
    font-size:15px;
    font-weight: bold;
    padding-left: 22px;
    background: url(../img/heading-medium-icon.svg) no-repeat left top; /* 見出しタイトル 中アイコン */
}



/*-----------------------------------------------------------
    11. heading-small
-------------------------------------------------------------*/

.heading-small h3{
    font-size:11px;
    font-weight: bold;
    padding-left: 20px;
    background: url(../img/heading-small-icon.svg) no-repeat left top; /* 見出しタイトル 小アイコン */
}

.heading-xs h3{
    font-size:10px;
    font-weight: bold;
    padding-left: 1em;
    text-decoration: underline;
}

/*-----------------------------------------------------------
    12. separator-ruler
-------------------------------------------------------------*/




/*-----------------------------------------------------------
    13. code-frame
-------------------------------------------------------------*/

.code-frame {
    position: relative;
    margin: 0;
    padding: 50px 40px 15px;
    background-color:#333;
}

.code-frame-title {
    position: absolute;
    display: inline-block;
    top: 0px;
    left: 0px;
    padding: 5px 20px;
    height: 30px;
    line-height: 25px;
    font-size: 15px;
    background-color:rgba(255, 255, 255, 0.5);
    color: #333;
    font-weight: bold;
}

.code-frame p {
    margin-bottom: 15px;
    padding: 0;
    color:#fff;
    font-weight: bold;
    font-size:11px;
}


/*-----------------------------------------------------------
    14. footer
-------------------------------------------------------------*/

.footer{
    background-color: #333;/* フッターナビ背景色指定 */
}

.copyright p{
    color:#fff;
    margin-bottom:0;
}


/*-----------------------------------------------------------
    15. footer-nav
-------------------------------------------------------------*/



.footer-nav a{
    color:#fff; /* フッターナビ文字色指定 */
    padding:10px 15px;
    display:inline-block;
}



/*-----------------------------------------------------------
    16. Responsive Section
-------------------------------------------------------------*/
@media(max-width:728px){
    .container-01{
        width:90%;
    }

    .container-01 img{
        width:100%
    }

    .frame{
        padding:40px 20px;
    }

}

.form-join {
    max-width: 60%;
    background-color: #B8D0E0;
    /* just in case there no content*/
    padding: 1.0rem 1.5rem 0.2rem;
    margin: 0 auto 1.5rem;
    -moz-border-radius: 0.6rem;
    -webkit-border-radius: 0.6rem;
    border-radius: 0.6rem;
}

.col-form-label {
  font-size: 0.75rem;
}


/*-----------------------------------------------------------
    Now loading
-------------------------------------------------------------*/

#loading {
  display: table;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background-color: #000;
  opacity: 0.7;
}

#loading .loadingMsg {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  padding-top: 140px;
  background: url("../img/loader-000.gif") center center no-repeat;
}