@charset "utf-8";


/* セリフ体の箇所のフォントを変更したい場合 */
body .serif{ 
font-family: 'Bebas Neue','Noto Serif JP',"Yu Mincho", YuMincho, "HGP明朝B", serif !important;}

/* フォントによってヘッダーフォントサイズを変更する必要がある場合 */
h2{ 
font-size: 50px; font-weight: 400; letter-spacing: 0.2em; 
font-family: 'Bebas Neue','Noto Serif JP',"Yu Mincho", YuMincho, "HGP明朝B", serif !important;
}

#gHeader p.hd_systemBtn a {
font-family: 'Bebas Neue','Noto Serif JP',"Yu Mincho", YuMincho, "HGP明朝B", serif !important;
}
#fixArea nav {
font-family: 'Bebas Neue','Noto Serif JP',"Yu Mincho", YuMincho, "HGP明朝B", serif !important;
}

/* フォントによってSTAFF CATALOGのフォントサイズを変更する必要がある場合*/
#gHeader p.pageTitle{ letter-spacing: 0.2em; font-weight: 400; font-size: 38px;}








/* h2のカラー変更 */

body.dark h2{ color: #fff;}
body.light h2{ color: #222;}
body.dark #gHeader p.pageTitle{color: #fff;}
body.light #gHeader p.pageTitle{color: #222;}

/* グローバルヘッダーシステムボタン形状 */

#gHeader p.hd_systemBtn a {
    display: block;
    width: 68%;
    margin: 0 30px 0 auto;
    padding: 20px 0;
    text-align: center;
    border-radius: 0;
    font-size: 40px;
}

/* ナビゲーションベース：カラー 透明度つき */

#fixArea nav {
    border-top: 0;
    padding: 30px;
    background: none;
}



body.dark #fixArea.faUpper {
  background-image: -webkit-linear-gradient( -90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.8) 30%, rgba(0,0,0,0.6) 65%, rgb(0,0,0,0) 100%);
}
body.dark #fixArea.faUnder {
  background-image: -webkit-linear-gradient( -270deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.8) 30%, rgba(0,0,0,0.6) 65%, rgb(0,0,0,0) 100%);
}
body.light #fixArea.faUpper {
  background-image: -webkit-linear-gradient( -90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.9) 60%, rgba(255,255,255,0.6) 80%, rgb(255,255,255,0) 100%);
}

body.light #fixArea.faUnder {
  background-image: -webkit-linear-gradient( -270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.9) 80%, rgba(255,255,255,0.9) 95%, rgb(255,255,255,0.9) 100%);
}


/*
body.dark #fixArea.faUpper #gHeader{background: #000;}
body.dark #fixArea.faUpper nav {
position: relative; top: -1px;
background-image: -moz-linear-gradient( 90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 50%, rgba(0,0,0,1) 100%);
background-image: -webkit-linear-gradient( 90deg, rgba(0,0,0,0) 0%,  rgba(0,0,0,0.8) 50%,rgba(0,0,0,1) 100%);
}


body.dark #fixArea.faUnder #gHeader{background: #000;}
body.dark #fixArea.faUnder nav {
position: relative; bottom: -1px;
background-image: -moz-linear-gradient( 270deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 50%, rgba(0,0,0,1) 100%);
background-image: -webkit-linear-gradient( 270deg, rgba(0,0,0,0) 0%,  rgba(0,0,0,0.8) 50%,rgba(0,0,0,1) 100%);
}

body.light #fixArea.faUpper #gHeader{background: #fff;}
body.light #fixArea.faUpper nav {
position: relative; top: -1px;
background-image: -moz-linear-gradient( 90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(255,255,255,1) 100%);
background-image: -webkit-linear-gradient( 90deg, rgba(255,255,255,0) 0%,  rgba(255,255,255,0.8) 50%,rgba(255,255,255,1) 100%);
}
body.light #fixArea.faUnder #gHeader{background: #fff;}
body.light #fixArea.faUnder nav {
position: relative; bottom: -1px;
background-image: -moz-linear-gradient( 270deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(255,255,255,1) 100%);
background-image: -webkit-linear-gradient( 270deg, rgba(255,255,255,0) 0%,  rgba(255,255,255,0.8) 50%,rgba(255,255,255,1) 100%);
}
*/

/* ナビゲーションベース：カラー 透明度なし
#fixArea nav{background: #222;}*/




body.dark #fixArea nav li a{ color: #bbb;}
body.light #fixArea nav li a{ color: #333;}




/* プロフィール背景を見やすくするためのグラデーション */

body.dark .profile >.inner {
padding:30px 0;
  background-image: -moz-linear-gradient( 90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 33%,  rgba(0,0,0,0.6) 66%,rgba(0,0,0,0) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgba(0,0,0,0) 0%,  rgba(0,0,0,0.6) 33%, rgba(0,0,0,0.6) 66%,rgba(0,0,0,0) 100%);
  background-image: -ms-linear-gradient( 90deg, rgba(0,0,0,0) 0%,  rgba(0,0,0,0.6) 33%, rgba(0,0,0,0.6) 66%,rgba(0,0,0,0) 100%);
}


body.light .profile >.inner {
padding:30px 0;
  background-image: -moz-linear-gradient( 90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(255,255,255,1) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(255,255,255,1) 100%);
  background-image: -ms-linear-gradient( 90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(255,255,255,1) 100%);
}


/* このスタイルの場合、グローバルヘッダー背景を透明化する */
.faUpper #gHeader{ background: none;}
.faUnder #gHeader{ 
   background: rgba(0,0,0,0);}



/* 固定メニューエリアの背景処理・上部・下部固定でグラデーションを逆にすることを注意 */

/* 90deg */

/* 270deg */


/* 90deg 
body.light #fixArea.faUpper {
background-color: none;
  background-image: -moz-linear-gradient( 90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(255,255,255,1) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(255,255,255,1) 100%);
  background-image: -ms-linear-gradient( 90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(255,255,255,1) 100%);
}
*/

/* ナビゲーションの形状 */


#fixArea nav li a{
background: none;
border:none;
border-radius: 0;
box-shadow:none;
font-size: 50px;
padding: 20px;
}



/* アワードの背景処理 */

.awardBg {
    border: none;
}

/* ビッグアワードエリア */

body.light .bigAwardLabel {
    border:none;
    background: none;
    font-style: italic;
    background: rgba(255,255,255,0.5);
}
body.dark .bigAwardLabel {
    border:none;
    background: none;
    font-style: italic;
    background: rgba(0,0,0,0.5);
}


/* プロフィールページのアワード（ミニ）*/

.award li {
    text-align: center;
    padding: 10px;
}



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



/* 表紙メニューの枠の背景透明度 */

body#indexPage .loginForm {
    background: rgba( 0,0,0,0);
}


/* 表紙ページのサブタイトルを消す */

body#indexPage p.subTitle {
    display: none;
}



/* 通常ボタン */

body#indexPage .topBtns .topListBtn {
    background: #222;
    border-radius: 10px;
    color: #fff;
    box-shadow: 0px 0px 0px 2px #111;
}


/* 表紙ページのボタンの日英テキスト調整 */

body#indexPage .topBtns .topListBtn span.eng{ display: block; font-size: 30px; letter-spacing: 0.2em; margin-bottom: 5px;}
body#indexPage .topBtns .topListBtn span.jpn{  display: block; font-size: 24px; line-height: 1em;margin-bottom: 0}



/* 文字だけボタン */


/* 斜体ボタン */

body#indexPage .loginForm h1 {
    width: 60%;
    margin-bottom: 60px;
}

body#indexPage.dark .topBtns .topListBtn {
    background: none;
    border-radius: 0;
    color: #fff;
    box-shadow:none;
     width: 80%;
  text-shadow: 0px 0px 10px rgba(0, 0, 0, 1),0px 0px 20px rgba(0, 0, 0, 1);
}

body#indexPage.light .topBtns .topListBtn {
    background: none;
    border-radius: 0;
    color: #111;
    box-shadow:none;
     width: 80%;
  text-shadow: 0px 0px 10px rgba(255, 255, 255, 1),0px 0px 20px rgba(255, 255, 255, 1);
}


body#indexPage .topBtns .topListBtn span.eng{ display: block; font-size: 100px; letter-spacing: 0em; margin-bottom: 5px; line-height:0.4em;}
body#indexPage .topBtns .topListBtn span.jpn{  display: none}



body#indexPage.dark .topBtns .topListBtn01{
    border: none;
  color: #fff;
}
body#indexPage.light .topBtns .topListBtn01{
    border: none;
  color: #000;
}

body#indexPage.dark .topBtns .topListBtn02{
    border: none;
  color: #ccc;
}
body#indexPage.light .topBtns .topListBtn02{
    border: none;
  color: #666;
}

/* リンク：ベースカラー ：とりあえず固定でOK */

.dark a:link{ color:#fff;text-decoration: none;}
.dark a:visited{ color:#fff;text-decoration: none;}
.dark a:active{ color:#fff;text-decoration:none;}
.dark a:hover{ color:#fff;text-decoration:none;}

.light a:link{ color:#222;text-decoration: none;}
.light a:visited{ color:#222;text-decoration: none;}
.light a:active{ color:#222;text-decoration:none;}
.light a:hover{ color:#222;text-decoration:none;}

.dark body {color:#fff;}
.light body {color:#000;}