/* 作業前にまず背景画像を開いて適切なグラデーション・単色・ボタン背景色を決める　*/

/* まず、カレントカラーを定義し、複数箇所にコピーする　*/
/*

background: #a3721b;

background-image: -moz-linear-gradient( 90deg, rgb(255,238,179) 0%, rgb(221,191,86) 49%, rgb(171,117,0) 100%);
background-image: -webkit-linear-gradient( 90deg, rgb(255,238,179) 0%, rgb(221,191,86) 49%, rgb(171,117,0) 100%);
background-image: -ms-linear-gradient( 90deg, rgb(255,238,179) 0%, rgb(221,191,86) 49%, rgb(171,117,0) 100%);

*/

/* 表紙ページの外枠 デザインによっては bgのalphaをゼロに。*/

.loginForm {
    background: rgba(255, 255, 255, 0.5);
    border-radius: 10px;
}


/*----------------------------------------------------------------------------------------------------------------*/
/* 表紙まわり */
/*----------------------------------------------------------------------------------------------------------------*/

/*----------------------------------*/
/* ms01 */
/*----------------------------------*/

/* 表紙ページのボタンカラー */
.ms01 .topBtns .topListBtn01{

  background-image: -moz-linear-gradient( 45deg, rgb(16,25,92) 0%, rgb(37,86,165) 100%);
  background-image: -webkit-linear-gradient( 45deg, rgb(16,25,92) 0%, rgb(37,86,165) 100%);
  background-image: -ms-linear-gradient( 45deg, rgb(16,25,92) 0%, rgb(37,86,165) 100%);

color:#fff;
}
.ms01 .topBtns .topListBtn02{

  background-image: -moz-linear-gradient( 45deg, rgb(190,190,190) 0%, rgb(190,190,190) 100%);
  background-image: -webkit-linear-gradient( 45deg, rgb(0,0,0) 0%, rgb(190,190,190) 100%);
  background-image: -ms-linear-gradient( 45deg, rgb(0,0,0) 0%, rgb(190,190,190) 100%);

color:#fff;
}

/*----------------------------------*/
/* ms02 */
/*----------------------------------*/

/* MS02は文字の設定をlightテーマなら黒文字、blackテーマなら白文字で出しわけ設定済みの為、基本的にカラー設定は行わない */


/*----------------------------------------------------------------------------------------------------------------*/
/* 一覧ページ：ナビゲーション */
/*----------------------------------------------------------------------------------------------------------------*/

/*----------------------------------*/
/* ms01 */
/*----------------------------------*/

/* ms01 nav ナビゲーションのオフ状態：背景カラー　*/
body.ms01 #fixArea nav{background: rgba(255, 255, 255 ,0.3);}
body.ms01 #gHeader {background: rgba(255, 255, 255 ,0.5);}
body.ms01 #fixArea.faUnder nav{background: rgba(255, 255, 255 ,0.8);}
body.ms01 #fixArea.faUnder #gHeader {background: rgba(255, 255, 255 ,1);}

/* ms01 a ナビゲーションのオフ状態：文字カラー */

body.ms01 #fixArea nav li a{
  background-image: -moz-linear-gradient( 45deg, rgb(222,222,222) 0%, rgb(255,255,255) 100%);
  background-image: -webkit-linear-gradient( 45deg, rgb(222,222,222) 0%, rgb(255,255,255) 100%);
  background-image: -ms-linear-gradient( 45deg, rgb(222,222,222) 0%, rgb(255,255,255) 100%);
    border: 1px solid #fff;

color: #333;
}

/* ms01 a.now ナビゲーションの選択状態：カラー ：　テーマに合わせて要変更　*/

.ms01 #fixArea nav li a.now {
    color: #fff;
  background-image: -moz-linear-gradient( 45deg, rgb(16,25,92) 0%, rgb(37,86,165) 100%);
  background-image: -webkit-linear-gradient( 45deg, rgb(16,25,92) 0%, rgb(37,86,165) 100%);
  background-image: -ms-linear-gradient( 45deg, rgb(16,25,92) 0%, rgb(37,86,165) 100%);

}



/*----------------------------------*/
/* ms02 */
/*----------------------------------*/

/* ms02 ナビゲーションの選択状態：カラー：ms02は背景カラー設定からクリップを行うことでグラデ文字へ*/
/* グラデは１個上のものと共通*/

.ms02 #fixArea nav li a{ color:#000; opacity: 0.8;}
.ms02 #fixArea nav li a.now {
  background:#000;
  color: red;
  -webkit-background-clip: text; 
  -webkit-text-fill-color: transparent; 
}



/*----------------------------------------------------------------------------------------------------------------*/
/* ここからはあまり手をつけずOK */

/*
・料金システムのボタンカラー：基本的にデフォルトのブラックボタン
・アワードの背景カラー：基本的にブラックを50%透過にする
・一覧ページの背景色を黒に設定：背景画像を使用するため基本的に変更する必要なし
・スタイル直下の背景を読み込む処理：CSSに紐づく背景色を設定中
*/

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



/* 料金システムボタンカラー */

#gHeader p.hd_systemBtn a {
background: #000;
color: #fff;
border: 1px solid #666;
}

/* 基本的にデフォルトのままとする */



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


/* アワードの背景カラー */

/* アワードの背景カラー */

.awardBg {
    color: #fff;
    background: rgba(0,0,0,0.5);
}
/* 基本的に黒を50%透過で汎用的に使えるようにする */


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


body#topPage {
    background: #000;
    background-image: none;
}

/* 背景 ：　スタイル直下の背景を読み込む処理*/

body.dark {
    background: #000 url(images/bg.jpg) no-repeat center top;background-size:cover;
    background-attachment: fixed;
}
body.light {
    background: #fff url(images/bg.jpg) no-repeat center top;background-size:cover;
    background-attachment: fixed;
}

body#topPage::before {
    position:fixed;
    top:0;
    left:0;
    z-index:-1;
    width:100vw;
    height:100vh;
    background:url("images/bg.jpg") no-repeat center center;
    -webkit-background-size:cover;
    background-size:cover;
    content:"";
}

body#indexPage{
    background: #111 url(images/bg_index.jpg) no-repeat center center;background-size:cover;    
}

body#indexPage.dark .loginForm h1 img{ filter: drop-shadow(0 0 10px #000);}
body#indexPage.light .loginForm h1 img{ filter: drop-shadow(0 0 10px #fff);}