@charset "utf-8";

/* ---------- ヘッダー ---------- */

#header                                          { width: 100%; height: 65px; margin: 0 auto; padding: 0; border: none; color: #000000; }
#header-content                                  { position: relative; display: block; width: 1225px; margin: 0 auto; padding: 0; border: none; }
#header-content.wide                             { width: 1285px; }
#header-content                                  { width: 1366px; }


/* ---------- ロゴと画面タイトル ---------- */
#header h1                                       { float: left; width: auto; height: 100%; line-height: 60px; font-size: 20px; color: #7ea2bc; vertical-align: bottom; white-space: nowrap; overflow: hidden; }
#header h1                                       { background: transparent url("../../img/hpc/limited/logo.png") 10px 5px no-repeat; }
#header h1 a                                     { display: block; margin: 10px 0 0 15px; width: 171px; height: 50px; text-indent:-99999px; cursor: pointer; }


/* ---------- システムのご紹介へのリンク(HPCのみ) ---------- */

#header #system_introduction                     { position: absolute; top: 7px; right: 190px; width: 180px; height: 50px; }
#header #system_introduction a                   { display: block; height: 100%; margin: 0; border: none; padding: 0px; text-indent: -999999px; }
#header #system_introduction a                   { background: transparent url("../../img/hpc/limited/suketto_web_banner2.png") left top no-repeat; }
#header #system_introduction a:hover             { background-position: left bottom; }

/* ---------- サポートサイトへのリンク(HPCのみ) ---------- */

#header #support_site                            { position: absolute; top: 7px; right: 0; width: 180px; height: 50px; }
#header #support_site a                          { display: block; height: 100%; margin: 0; border: none; padding: 0px; text-indent: -999999px; }
#header #support_site a                          { background: transparent url("../../img/hpc/limited/spp_top.png") left top no-repeat; }
#header #support_site a:hover                    { background-position: left bottom; }

/* ---------- 画面タイトル ---------- */

#header #title                                   { position: absolute; top: 0; left: 150px; line-height: 65px; color: #25213f; color: #595959; font-size: 30px; white-space: nowrap; overflow: hidden; }


/* ---------- リンク・ユーザ情報 ---------- */

#header #user_info                               { float: right; margin: 9px 10px 10px 10px; height: 100%; line-height: 20px; z-index: 3; }
#header #user_info p                             { text-align: right; white-space: nowrap; }
#header #user_info p.folder                      { position: absolute; left: 0; bottom: 0; height: 50%; }
#header #user_info p.link                        { white-space: nowrap; }
#header #user_info p.link a                      { padding-left: 11px; background: transparent url("../../img/hpc/back.arrow.logout.png") left center no-repeat; vertical-align: middle; }
#header #user_info p.link a:hover                { color: #7ea2bc; }
#header #user_info p.link a.support              { margin: 0 30px 0 0; }
#header #user_info p.link a.mypageadmin          { margin: 0 30px 0 0; }
#header #user_info p.name span                   { color: #ff0000; }


/* ---------- キャビネットボタン ---------- */

#header #user_info button[name=sharedFolder]     { height: 24px; margin: 0 10px 0 0; border: 1px solid #225533; padding: 2px 5px; background-color: #225533; font-size: 12px; line-height: 20px; color: #ffffff; text-align: center; vertical-align: middle; }
#header #user_info button[name=sharedFolder]     { border-radius: 3px; }


/* ---------- メニュー切り替えボタン ---------- */

#header #user_info button[name=switchMenu]       { height: 24px; margin: 0 20px 0 0; border: 1px solid #2c3e50; padding: 2px 5px; background-color: #2c3e50; font-size: 12px; line-height: 20px; color: #ffffff; text-align: center; vertical-align: middle; }
#header #user_info button[name=switchMenu]       { border-radius: 3px; }


/* ---------- 新UI切り替えボタン ---------- */

#header .switch-ui                               { float: right; margin: 12px 20px 0 0; }
#header .switch-ui button[name=switchUI]         { height: 40px; margin: 0; border: 1px solid #2c3e50; padding: 2px 10px; background-color: #2c3e50; text-align: center; vertical-align: middle; }
#header .switch-ui button[name=switchUI]         { border-radius: 3px; }
#header .switch-ui button[name=switchUI]         { animation: blinkUISwitch 1.5s infinite alternate; } @keyframes blinkUISwitch { 0% { opacity: 100%; } 60% { opacity: 100%; } 100% { opacity: 0%; } }
#header .switch-ui button[name=switchUI] span    { font-size: 15px; line-height: 30px; color: #ffffff; letter-spacing: -2px; }
#header .switch-ui button[name=switchUI] span i  { margin: 0 0 0 5px; padding: 0 6px 0 3px; font-size: 15px; line-height: 24px; color: #2c3e50;  background-color: #ffffff; }