@charset "utf-8";

/*******************************************************************************
 Serverworks Corporate Site Style (2009.10)
 *******************************************************************************/

/*--------------------------------------------------------------------
  Color Scheme (基本配色)
  --------------------------------------------------------------------
  文字色: #555 (グレー)
  リンク文字色: #33789c (水色)
  --------------------------------------------------------------------*/


/*==============================================================================
  Global Styles (全ページで共通のスタイル)
  ==============================================================================*/

body
{
    color: #555;
    margin-top: 30px;
}

a
{
    color: #33789c;
    text-decoration: none;
}

a:hover
{
    text-decoration: underline;
}

a[target="_blank"]
{
    cursor: alias;
}

/*--------------------------------------------------------------------
  各ページのページタイトルに共通するスタイル
  --------------------------------------------------------------------*/

.page-title h2
{
    background: url(/images/sprite-pagetitles.png) no-repeat;
    text-indent: -9999px;
}

.page-title-text h2
{
    color: #264c72;
    font-size: 2em;
    margin: 50px 0 30px 0;
}

/*--------------------------------------------------------------------
  テキストブラウザ用要素のスタイル
  --------------------------------------------------------------------*/

#skip-lines
{
    display: none;
}

.indicator
{
    display: none;
}


/*==============================================================================
  Utility Navigation Styles ユーティリティナビゲーションバー
  ==============================================================================*/

#utility-nav
{
    list-style: none;
    margin: 50px 0 0 210px;
    padding: 0;
}

#utility-nav li
{
    display: inline;
}

#utility-nav li a
{
    background-image: url(/images/utility.png);
    background-repeat: no-repeat;
    display: block;
    float: left;
    height: 10px;
    margin-left: 10px;
    text-indent: -9999px;
    -webkit-transition: none;
}

#utility-nav li a.sitemap
{
    width: 56px;
    background-position: 0 0;
}

#utility-nav li a.privacypolicy
{
    width: 94px;
    background-position: -56px 0;
}

#utility-nav li a.contact
{
    width: 60px;
    background-position: -150px 0;
}


/*==============================================================================
  Global Navigation Styles グローバルナビゲーションバー
  ==============================================================================*/

#global-nav
{
    list-style: none;
    margin: 74px 0 0 22px;
    padding: 0;
}

#global-nav li
{
    display: inline;
}

#global-nav li a
{
    background-image: url(/images/global-nav.png);
    background-repeat: no-repeat;
    display: block;
    float: left;
    height: 25px;
    width: 73px;
    text-indent: -9999px;
    -webkit-transition: none;
}

#global-nav a.vision
{
    background-position: left -25px;
}

#global-nav a.vision:hover,
#global-nav .current a.vision
{
    background-position: left top;
}

#global-nav a.news
{
    background-position: -73px -25px;
}

#global-nav a.news:hover,
#global-nav .current a.news
{
    background-position: -73px top;
}

#global-nav a.services
{
    background-position: -146px -25px;
}

#global-nav a.services:hover,
#global-nav .current a.services
{
    background-position: -146px top;
}

#global-nav a.corporate
{
    background-position: -219px -25px;
}

#global-nav a.corporate:hover,
#global-nav .current a.corporate
{
    background-position: -219px top;
}

#global-nav a.career
{
    background-position: -292px -25px;
}

#global-nav a.career:hover,
#global-nav .current a.career
{
    background-position: -292px top;
}

#global-nav a.blog
{
    background-position: -365px -25px;
}

#global-nav a.blog:hover,
#global-nav .current a.blog
{
    background-position: -365px top;
}


/*==============================================================================
  Subcategories Styles サブカテゴリ
  ==============================================================================*/

#subcategories
{
    list-style: none;
    margin-top: 105px;
    padding: 0;
}

#subcategories li
{
    display: inline;
}

#subcategories li a
{
    background: url(/images/sprite-subcategories.png) no-repeat;
    display: block;
    float: left;
    height: 10px;
    margin-left: 10px;
    text-indent: -9999px;
    -webkit-transition: none;
}

/*--------------------------------------------------------------------
  Vision subcategories ビジョンカテゴリ以下のサブカテゴリ用スタイル
  --------------------------------------------------------------------*/

#subcategories.vision
{
    margin-left: 25px;
}

#subcategories li a.message
{
    width: 79px;
    background-position: left bottom;
}

#subcategories li a.message:hover
{
    background-position: left -40px;
}

#subcategories li a.origin
{
    width: 59px;
    background-position: left -340px;
}

#subcategories li a.origin:hover
{
    background-position: left -220px;
}

/*--------------------------------------------------------------------
  Services subcategories サービスカテゴリ以下のサブカテゴリ用スタイル
  --------------------------------------------------------------------*/

#subcategories.services
{
    margin-left: 160px;
}

#subcategories li a.cloudworks
{
    width: 77px;
    background-position: left -240px;
}

#subcategories li a.cloudworks:hover
{
    background-position: left -50px;
}

#subcategories li a.servicedevelopment
{
    width: 70px;
    background-position: left -230px;
}

#subcategories li a.servicedevelopment:hover
{
    background-position: left top;
}

/*--------------------------------------------------------------------
  Corporate subcategories 会社情報カテゴリ以下のサブカテゴリ用スタイル
  --------------------------------------------------------------------*/

#subcategories.corporate
{
    margin-left: 25px;
}

#subcategories li a.profile
{
    width: 50px;
    background-position: left -200px;
}

#subcategories li a.profile:hover
{
    background-position: left -260px;
}

#subcategories li a.history
{
    width: 28px;
    background-position: left -70px;
}

#subcategories li a.history:hover
{
    background-position: left -130px;
}

#subcategories li a.managementteam
{
    width: 49px;
    background-position: left -20px;
}

#subcategories li a.managementteam:hover
{
    background-position: left -180px;
}

#subcategories li a.access
{
    width: 46px;
    background-position: left -290px;
}

#subcategories li a.access:hover
{
    background-position: left -80px;
}

#subcategories li a.numbers
{
    width: 136px;
    background-position: left -60px;
}

#subcategories li a.numbers:hover
{
    background-position: left -210px;
}

/*--------------------------------------------------------------------
  Career subcategories 採用情報カテゴリ以下のサブカテゴリ用スタイル
  --------------------------------------------------------------------*/

#subcategories.career
{
    margin-left: -28px;
}

#subcategories li a.job
{
    width: 51px;
    background-position: left -110px;
}

#subcategories li a.job:hover
{
    background-position: left -270px;
}

#subcategories li a.step
{
    width: 78px;
    background-position: left -160px;
}

#subcategories li a.step:hover
{
    background-position: left -320px;
}

#subcategories li a.value
{
    width: 40px;
    background-position: left -190px;
}

#subcategories li a.value:hover
{
    background-position: left -90px;
}

#subcategories li a.boardinterview
{
    width: 86px;
    background-position: left -120px;
}

#subcategories li a.boardinterview:hover
{
    background-position: left -280px;
}

#subcategories li a.staffinterview
{
    width: 119px;
    background-position: left -100px;
}

#subcategories li a.staffinterview:hover
{
    background-position: left -10px;
}

#subcategories li a.questions
{
    width: 34px;
    background-position: left -170px;
}

#subcategories li a.questions:hover
{
    background-position: left -330px;
}

/*--------------------------------------------------------------------
  Blog subcategories ブログカテゴリ以下のサブカテゴリ用スタイル
  --------------------------------------------------------------------*/

#subcategories.blog
{
    margin-left: 230px;
}

#subcategories li a.ceoblog
{
    width: 60px;
    background-position: left -310px;
}

#subcategories li a.ceoblog:hover
{
    background-position: left -250px;
}

#subcategories li a.recruitblog
{
    width: 59px;
    background-position: left -300px;
}

#subcategories li a.recruitblog:hover
{
    background-position: left -150px;
}

#subcategories li a.techblog
{
    width: 60px;
    background-position: left -30px;
}

#subcategories li a.techblog:hover
{
    background-position: left -140px;
}


/*==============================================================================
  Subcategories Navigation Styles サブカテゴリナビゲーション
  ==============================================================================*/

#subcategory-nav
{
    font-size: .8em;
    font-weight: bold;
    margin-top: 30px;
    text-align: center;
}

#subcategory-nav a
{
    margin-left: 5px;
    margin-right: 5px;
}


/*==============================================================================
  Footer Styles (フッタ部のスタイル)
  ==============================================================================*/

#footer
{
    margin: 30px auto 60px auto;
}

#footer .border
{
    border-top: 3px solid #666;
    margin-top: 0;
}

#footer .services
{
    font-size: .8em;
    line-height: 1.5;
    margin-top: .5em;
}

#footer .copyright
{
    margin-top: .5em;
    text-align: right;
}


/*==============================================================================
  Content Styles (コンテンツ部の共通スタイル)
  ==============================================================================*/

#content img
{
    border: none;
}

#content h3
{
    color: #333;
    font-size: 1.2em;
    margin: 1em 0;
}

#content h4
{
    font-size: 1.1em;
    margin: 1em 0;
}

#content p
{
    font-size: .9em;
    line-height: 1.7;
    margin: 1em 0;
}

#content ul
{
    line-height: 1.7;
    list-style-type: disc;
    margin: 1em 0 1em 3em;
}

#content ul li
{
    background: url(/images/list-mark-darkblue.png) no-repeat 0 0.5em;
    font-size: .9em;
    padding-left: 17px;
    list-style: none;
}

#content ol
{
    line-height: 1.7;
    list-style-type: decimal;
    margin: 1em 0 1em 3em;
    font-size: .9em;
}

#content ol li
{
    font-size: .9em;
}

#content li.lightblue
{
    background: url(/images/list-mark.png) no-repeat 0 0.5em;
    padding-left: 17px;
    list-style: none;
}

#content dl
{
    line-height: 1.7;
}
#content dt
{
    padding: .5em 0;
}
#content dd
{
    padding: .5em 0;
}

#content .circle-darkblue-1
{
    background: url(/images/circle-darkblue-1.png) no-repeat;
    height: 20px;
    padding-left: 24px;
}
#content .circle-darkblue-2
{
    background: url(/images/circle-darkblue-2.png) no-repeat;
    height: 20px;
    padding-left: 24px;
}
#content .circle-darkblue-3
{
    background: url(/images/circle-darkblue-3.png) no-repeat;
    height: 20px;
    padding-left: 24px;
}
#content .circle-darkblue-4
{
    background: url(/images/circle-darkblue-4.png) no-repeat;
    height: 20px;
    padding-left: 24px;
}
#content .circle-darkblue-5
{
    background: url(/images/circle-darkblue-5.png) no-repeat;
    height: 20px;
    padding-left: 24px;
}
#content .circle-darkblue-6
{
    background: url(/images/circle-darkblue-6.png) no-repeat;
    height: 20px;
    padding-left: 24px;
}
#content .circle-darkblue-7
{
    background: url(/images/circle-darkblue-7.png) no-repeat;
    height: 20px;
    padding-left: 24px;
}
#content .circle-darkblue-8
{
    background: url(/images/circle-darkblue-8.png) no-repeat;
    height: 20px;
    padding-left: 24px;
}
#content .circle-darkblue-9
{
    background: url(/images/circle-darkblue-9.png) no-repeat;
    height: 20px;
    padding-left: 24px;
}
#content .circle-darkblue-10
{
    background: url(/images/circle-darkblue-10.png) no-repeat;
    height: 20px;
    padding-left: 24px;
}

#content .circle-large-1
{
    background: url(/images/circle-large-1.png) no-repeat;
    height: 40px;
    padding-left: 44px;
}
#content .circle-large-2
{
    background: url(/images/circle-large-2.png) no-repeat;
    height: 40px;
    padding-left: 44px;
}
#content .circle-large-3
{
    background: url(/images/circle-large-3.png) no-repeat;
    height: 40px;
    padding-left: 44px;
}
#content .circle-large-4
{
    background: url(/images/circle-large-4.png) no-repeat;
    height: 40px;
    padding-left: 44px;
}
#content .circle-large-5
{
    background: url(/images/circle-large-5.png) no-repeat;
    height: 40px;
    padding-left: 44px;
}
#content .circle-large-6
{
    background: url(/images/circle-large-6.png) no-repeat;
    height: 40px;
    padding-left: 44px;
}
#content .circle-large-7
{
    background: url(/images/circle-large-7.png) no-repeat;
    height: 40px;
    padding-left: 44px;
}
#content .circle-large-8
{
    background: url(/images/circle-large-8.png) no-repeat;
    height: 40px;
    padding-left: 44px;
}
#content .circle-large-9
{
    background: url(/images/circle-large-9.png) no-repeat;
    height: 40px;
    padding-left: 44px;
}
#content .circle-large-10
{
    background: url(/images/circle-large-10.png) no-repeat;
    height: 40px;
    padding-left: 44px;
}

#content .breadcrumbs
{
    font-size: .8em;
    margin-top: 10px;
}


/*==============================================================================
  Top Page Styles (トップページ用のスタイル)
  ==============================================================================*/

#top-page #tagline
{
    margin-top: 50px;
}

#top-page #tagline h2
{
    color:  #000;
    font-size: 1.7em;
}

#top-page #introduction
{
    background: url(/images/illustration-release.png) no-repeat 100% 0;
    height: 80px;
    width: 940px;
}

#top-page #introduction p
{
    font-size: 1em;
    width: 620px;
}

#top-page #services-container
{
    background-color: #4990e2;
}

#top-page #services-container #services
{
    float: left;
    margin: 10px;
    width: 500px;
}

#top-page #services-container #services .content
{
    margin-left: 80px;
}

#top-page #services-container #services .icon a
{
    background: url(/images/icons-toppage.png) no-repeat;
    display: block;
    float: left;
    text-indent: -9999px;
    -webkit-transition: none;
}

#top-page #services-container #services .cloudworks .icon a
{
    background-position: left top;
    height: 50px;
    width: 65px;
}

#top-page #services-container #services .cloudworks .icon a:hover
{
    background-position: left -50px;
}

#top-page #services-container #services .service-development .icon a
{
    background-position: left bottom;
    height: 60px;
    width: 70px;
}

#top-page #services-container #services .service-development .icon a:hover
{
    background-position: left -100px;
}

#top-page #services-container #services h3
{
    background: url(/images/arrow-white.png) no-repeat;
    margin: 1em 0 .5em 0;
    padding-left: 25px;
}

#top-page #services-container #services h3 a
{
    color: #fff;
    font-size: 1.1em;
}

#top-page #services-container #services .summary
{
    color: yellow;
    margin: 0;
}

#top-page #services-container #services .description
{
    color: #000;
    font-size: .9em;
    margin-top: 0;
}

#top-page #services-container #showcase
{
    background: url(/images/illustration-verticalline.png) repeat-y top left;
    float: right;
    margin: 10px;
    padding-left: 20px;
    width: 360px;
}

#top-page #services-container #showcase h3
{
    background: url(/images/illustration-showcase.png) no-repeat top left;
    height: 50px;
    margin: 0;
    padding: 0;
    text-indent: -9999px;
    width: 133px;
    z-index: 0;
}

#top-page #services-container #showcase .header,
#top-page #services-container #showcase .description
{
    color: #000;
}

#top-page #headlines img
{
    margin-top: 1em;
}

#top-page #headlines ul
{
    list-style: none;
    margin: 0 0 0 1em;
    padding: 0;
}

#top-page #headlines ul li
{
    background: none;
    font-size: .8em;
    line-height: 1.7;
    list-style: none;
    margin: 0;
    padding: 0;
}

#top-page .banners .staffinterview a
{
    background: url(/images/banner-staffinterview.jpg) no-repeat top left;
    display: block;
    height: 60px;
    margin-left: 20px;
    text-indent: -9999px;
    width: 360px;
    -moz-border-radius: 5px;
    -webkit-transition: none;
    -webkit-border-radius: 5px;
}

#top-page .banners .career a
{
    background: url(/images/banners-top.png) no-repeat left -40px;
    display: block;
    height: 40px;
    text-indent: -9999px;
    width: 380px;
    -webkit-transition: none;
}

#top-page .banners .blog
{
    background: url(/images/banners-top.png) no-repeat left -180px;
    cursor: pointer;
    float: left;
    height: 100px;
    position: relative;
    width: 190px;
    -webkit-transition: none;
}

#top-page .banners .twitter
{
    background: url(/images/banners-top.png) no-repeat left bottom;
    float: right;
    height: 190px;
    position: relative;
    width: 190px;
    -webkit-transition: none;
}

#top-page .banners .blog .recent
{
    font-size: .7em;
    position: absolute;
    top: 40px;
    left: 20px;
    width: 100px;
}

#top-page .banners .twitter .recent
{
    font-size: .7em;
    position: absolute;
    top: 0px;
    left: 15px;
    padding-right: 7px;
}

#top-page #showcase .screenshot
{
    background: url(/images/showcase-kangonavi-thumb.png) no-repeat 50% top;
    height: 163px;
    width: 340px;
    position: absolute;
    top: 46px;
    text-indent: -9999px;
    z-index: 1;
}

#top-page #showcase .header
{
    margin-top: 160px;
}

#top-page #showcase .header .title
{
    font-size: .9em;
    font-weight: bold;
    margin: 0;
}

#top-page #showcase .header .client
{
    font-size: .8em;
    font-weight: bold;
    margin: 0;
}

#top-page #showcase .description p
{
    font-size: .8em;
    line-height: 1.5;
    margin: .5em 0 0 0;
}

#top-page #showcase .more a
{
    background: url(/images/button-more.png) no-repeat left top;
    display: block;
    height: 18px;
    text-indent: -9999px;
    margin-top: 5px;
    width: 82px;
}


/*==============================================================================
  Vision Page Styles (ビジョンページ用のスタイル)
  ==============================================================================*/

#vision-page .page-title
{
    background: url(/images/icon-vision.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 30px;
    width: 940px;
}

#vision-page .page-title h2
{
    background-position: left -68px;
    height: 33px;
    width: 409px;
}

#vision-page .tagline
{
    color: #333;
    font-size: 1.2em;
    margin: 0;
}
#vision-page .divider
{
    border-top: 1px solid #e4e5e7;
    margin: 30px 0;
}
#vision-page .block
{
    margin: 0 0 30px 0;
}
#vision-page .block h3
{
    color: #284b71;
    font-size: 1.4em;
    margin: 0 0 30px 0;
}
#vision-page .block h4
{
    color: #333;
    font-size: 1.1em;
    margin: 0;
}
#vision-page .yearly-vision
{
    background-color: #f0e6d6;
    margin: 0;
    padding: 20px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
#vision-page .yearly-vision h3
{
    color: #333;
    font-size: 1.3em;
    text-align: center;
}
#vision-page .yearly-vision h4
{
    color: #333;
    font-size: 1em;
    margin: 40px 0 0 0;
    text-shadow: rgb(255, 255, 255) 0px 1px 1px;
}

/*** Message page specific styles ***/
#message-page .page-title
{
    background: url(/images/icon-vision.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#message-page .page-title h2
{
    background-position: left -101px;
    height: 33px;
    width: 219px;
}
#message-page p.first
{
    margin-top: 0;
}
#message-page p
{
    line-height: 1.7;
    margin: 2em 0;
}
#message-page strong
{
    font-weight: bold;
}
#message-page .signature
{
    text-align: right;
}
#message-page .date
{
    text-align: right;
}
#message-page .signature img
{
    margin-left: 10px;
    position: relative;
}


/*** Value page specific styles ***/

#value-page .page-title
{
    background: url(/images/icon-vision.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}

#value-page .page-title h2
{
    background-position: left -267px;
    height: 33px;
    width: 199px;
}
#value-page #content
{
    margin-bottom: 50px;
}
#value-page .sixvalues
{
    background: url(/images/sprite-sectiontitles.png) no-repeat left -183px;
    width: 270px;
    height: 23px;
    text-indent: -9999px;
}
#value-page ul.tabs
{
    list-style-type: none;
    margin: 17px 0 0 0;
    padding: 0;
}
#value-page ul.tabs li
{
    background: none;
    font-size: .9em;
    height: 22px;
    margin: 10px 0;
}

#value-page .tabs li span
{
    background: url(/images/menu-values-background.png) no-repeat;
    color: #fff;
    cursor: pointer;
    display: block;
    font-size: 14px;
    height: 25px;
    padding: 0 10px;
    width: 200px;
    -webkit-transition: none;
}
#value-page .tabs li span:hover,
#value-page .tabs li span.sel
{
    background: url(/images/menu-values-background-active.png) no-repeat;
}
#value-page #tab1
{
}
#value-page #tab2
{
    display: none;
}
#value-page #tab3
{
    display: none;
}
#value-page #tab4
{
    display: none;
}
#value-page #tab5
{
    display: none;
}
#value-page #tab6
{
    display: none;
}

/*** Origin page specific styles ***/
#origin-page .page-title
{
    background: url(/images/icon-vision.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#origin-page .page-title h2
{
    background-position: left -598px;
    height: 33px;
    width: 166px;
}
#origin-page .section-title
{
    background: url(/images/sprite-sectiontitles.png) no-repeat;
    display: block;
    text-indent: -9999px;
}
#origin-page .server-side-computing
{
    width: 330px;
    height: 23px;
    background-position: left -229px;
}
#origin-page .environment
{
    width: 112px;
    height: 23px;
    background-position: left -69px;
}


/*** News page specific styles ***/
#news-page .page-title
{
    background: url(/images/icon-news.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}

#news-page .page-title h2
{
    background-position: left -300px;
    height: 33px;
    width: 129px;
}
#news-page .entry
{
    line-height: 2;
}
#news-page .entry h3
{
    clear: left;
    float: left;
    font-size: .9em;
    font-weight: normal;
    margin: 0;
    padding: 0;
}
#news-page .entry p
{
    margin: 0;
    padding: 0;
}

/*** News entry page specific styles ***/
#newsentry-page .page-title
{
    background: url(/images/icon-news.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}

#newsentry-page .page-title h2
{
    background-position: left -300px;
    height: 33px;
    width: 129px;
}

#newsentry-page #content h3
{
    font-size: 1.1em;
    font-weight: bold;
    line-height: 1.5;
}


/*** Services page specific styles ***/
#services-page .page-title
{
    background: url(/images/icon-services.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 30px;
    width: 940px;
}

#services-page .page-title h2
{
    background-position: left -831px;
    height: 33px;
    width: 129px;
}

#services-page h3
{
    color: #284b71;
    font-size: 1.4em;
    margin: 30px 0 10px;
}
#services-page h3 a
{
    color: #284b71;
    text-decoration: none;
}
#services-page .service-description
{
    background-color: #eef4fa;
    margin: 0;
    padding: .5em;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}
#services-page .service-description .link
{
    text-align: center;
}
#services-page .service-description .link a
{
    background-color: #60a0de;
    color: #fff;
    display: block;
    font-size: 1em;
    padding: .2em .5em;
    text-decoration: none;
    margin: 0 auto;
    width: 6em;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}
#services-page .service-description .link a:hover
{
    background-color: #284b71;
}
#services-page .link-interview
{
    font-weight: bold;
}


/*** Cloudworks page specific styles ***/

#cloudworks-page .page-title
{
    background: url(/images/icon-services.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 30px;
    width: 940px;
}

#cloudworks-page .page-title h2
{
    width: 474px;
    height: 34px;
    background-position: left -900px;
}

#cloudworks-page .pitch
{
/* background: #eef4fa url(/images/screenshot-cloudworks.png) no-repeat bottom right; */
    border-bottom: 1px solid #ccc;
    height: 310px;
    padding: 0;
}
#cloudworks-page .pitch h3
{
    color: #666;
    font-size: 1.2em;
    line-height: 1.5;
    margin: 20px;
    padding: 0;
    width: 430px;
}
#cloudworks-page .pitch .description
{
    margin: 0 20px 20px 20px;
    padding: 0;
    width: 430px;
}
#cloudworks-page .pitch .button
{
    border: 0;
    margin-left: 20px;
    padding: 0;
}
#cloudworks-page .pitch .button:hover
{
    margin-top: -1px;
}
#cloudworks-page h4
{
    color: #284b71;
    font-size: 1.4em;
}
#cloudworks-page h5
{
    color: #333;
    font-size: 1.2em;
}

/*** Cloud page specific styles ***/

#cloud-page .page-title
{
    background: url(/images/icon-services.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 30px;
    width: 940px;
}

#cloud-page .page-title h2
{
    width: 474px;
    height: 34px;
    background-position: left -930px;

29
}

#cloud-page .pitch
{
    /* background: #eef4fa url(/images/screenshot-cloudworks.png) no-repeat bottom right; */
    border-bottom: 1px solid #ccc;
    height: 310px;
    padding: 0;
}

#cloud-page .pitch h3
{
    color: #666;
    font-size: 1.2em;
    line-height: 1.5;
    margin: 20px;
    padding: 0;
    width: 430px;
}

#cloud-page .pitch2 h3
{
    color: #666;
    font-size: 1.2em;
    line-height: 1.5;
    margin: 20px;
    padding: 0;
}

#cloud-page .pitch .description
{
    margin: 0 20px 20px 20px;
    padding: 0;
    width: 430px;
}
#cloud-page .pitch .button
{
    border: 0;
    margin-left: 20px;
    padding: 0;
}
#cloud-page .pitch .button:hover
{
    margin-top: -1px;
}
#cloud-page h4
{
    color: #284b71;
    font-size: 1.4em;
}
#cloud-page h5
{
    color: #333;
    font-size: 1.2em;
}

/*** Service development page specific styles ***/
#servicedevelopment-page .page-title
{
    background: url(/images/icon-services.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 30px;
    width: 940px;
}
#servicedevelopment-page .page-title h2
{
    width: 195px;
    height: 33px;
    background-position: left -499px;
}
#servicedevelopment-page .pitch
{
    background-color: #eef4fa;
    border-bottom: 1px solid #ccc;
    padding: 0;
}
#servicedevelopment-page .pitch h3
{
    color: #666;
    font-size: 1.2em;
    line-height: 1.5;
    margin: 20px;
    padding: 0;
}
#servicedevelopment-page .pitch .description
{
    font-size: 1em;
    margin: 0 20px 20px 20px;
    padding: 0;
    text-align: right;
}
#servicedevelopment-page h4
{
    color: #284b71;
    font-size: 1.4em;
    margin: 30px 0 0 0;
}
#servicedevelopment-page h5
{
    color: #333;
    font-size: 1.2em;
}
#servicedevelopment-page .metainfo
{
    color: #999;
    font-size: .8em;
    margin: 5px auto 20px 0;
}
#servicedevelopment-page .metainfo th,
#servicedevelopment-page .metainfo td
{
    padding: 3px;
}
#servicedevelopment-page .metainfo th
{
    font-weight: bold;
    text-align: right;
}
#servicedevelopment-page .tag
{
    background-color: #fff8dc;
    border-bottom: 1px solid #dfd5af;
    border-right: 1px solid #dfd5af;
    color: #963;
    font-size: 12px;
    margin: 0px 2px 0px 0px;
    padding: 3px;
    text-decoration: none;
    -moz-border-radius: 3px;
    -webkit-border-radius: 5px;
}
#servicedevelopment-page .screenshot
{
    border: none;
    margin: 30px 0;
}

/*** Corporate page specific styles ***/
#corporate-page .page-title
{
    background: url(/images/icon-corporate.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#corporate-page .page-title h2
{
    width: 133px;
    height: 33px;
    background-position: left -168px;
}
#corporate-page .section-title
{
    background: url(/images/sprite-sectiontitles.png) no-repeat;
    display: block;
    text-indent: -9999px;
}
#corporate-page .profile .section-title
{
    width: 112px;
    height: 23px;
    background-position: left -275px;
}
#corporate-page .history .section-title
{
    width: 72px;
    height: 23px;
    background-position: left -321px;
}
#corporate-page .managementteam .section-title
{
    width: 112px;
    height: 23px;
    background-position: left -620px;
}
#corporate-page .access .section-title
{
    width: 108px;
    height: 23px;
    background-position: left -482px;
}
#corporate-page .numbers .section-title
{
    width: 285px;
    height: 23px;
    background-position: left -23px;
}
#corporate-page a.banner
{
    background-repeat: no-repeat;
    display: block;
    height: 160px;
    text-indent: -9999px;
    width: 300px;
    -webkit-transition: none;
}
#corporate-page .profile a.banner
{
    background-image: url(/images/banner-profile.jpg);
    background-position: left top;
}
#corporate-page .profile a.banner:hover
{
    background-position: left bottom;
}
#corporate-page .history a.banner
{
    background-image: url(/images/banner-history.jpg);
    background-position: left top;
}
#corporate-page .history a.banner:hover
{
    background-position: left bottom;
}
#corporate-page .managementteam a.banner
{
    background-image: url(/images/banner-leadershipteam.jpg);
    background-position: left top;
}
#corporate-page .managementteam a.banner:hover
{
    background-position: left bottom;
}
#corporate-page .access a.banner
{
    background-image: url(/images/banner-access.jpg);
    background-position: left top;
}
#corporate-page .access a.banner:hover
{
    background-position: left bottom;
}
#corporate-page .numbers a.banner
{
    background-image: url(/images/banner-numbers.jpg);
    background-position: left top;
}
#corporate-page .numbers a.banner:hover
{
    background-position: left bottom;
}


/*** Profile page specific styles ***/
#profile-page .page-title
{
    background: url(/images/icon-vision.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#profile-page .page-title h2
{
    width: 133px;
    height: 33px;
    background-position: left -631px;
}
#profile-page .section-title
{
    background: url(/images/sprite-sectiontitles.png) no-repeat;
    display: block;
    text-indent: -9999px;
}
#profile-page .organization
{
    width: 112px;
    height: 23px;
    background-position: left -597px;
}
#profile-page dl
{
    line-height: 1;
}
#profile-page dt
{
    font-size: 1.1em;
    font-weight: bold;
}
#profile-page dd
{
    line-height: 1.5;
    margin-left: 3em;
}
#profile-page dd ol
{
    margin-left: 0;
}
#profile-page dd ol li
{
    background: none;
    list-style-type: decimal;
    margin-left: 2em;
    padding-left: 0;
}
#profile-page dd ul
{
    margin-left: 0;
}

/*** History page specific styles ***/
#history-page .page-title
{
    background: url(/images/icon-vision.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#history-page .page-title h2
{
    width: 67px;
    height: 34px;
    background-position: left -34px;
}
#history-page dl
{
    line-height: 1;
}
#history-page dt
{
    font-size: 1.1em;
    font-weight: bold;
}
#history-page dd
{
    line-height: 1.5;
    margin-left: 3em;
}

/*** Access page specific styles ***/
#access-page .page-title
{
    background: url(/images/icon-vision.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#access-page .page-title h2
{
    width: 127px;
    height: 34px;
    background-position: left -664px;
}
#access-page .section-title
{
    background: url(/images/sprite-sectiontitles.png) no-repeat;
    display: block;
    text-indent: -9999px;
}
#access-page .accessmap
{
    width: 188px;
    height: 23px;
    background-position: left -114px;
}
#access-page .accessstep
{
    width: 149px;
    height: 23px;
    background-position: left -252px;
}

/*** Managemet team page specific styles ***/
#managementteam-page .page-title
{
    background: url(/images/icon-vision.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#managementteam-page .page-title h2
{
    width: 133px;
    height: 34px;
    background-position: left -797px;
}
#managementteam-page .section-title
{
    background: url(/images/sprite-sectiontitles.png) no-repeat;
    display: block;
    text-indent: -9999px;
}
#managementteam-page h4
{
    margin: 0;
}
#managementteam-page ul
{
    margin-bottom: 2em;
}
#managementteam-page .ooishi
{
    width: 207px;
    height: 23px;
    background-position: left -390px;
}
#managementteam-page .suzuki
{
    width: 326px;
    height: 23px;
    background-position: left bottom;
}

/*** Numbers page specific styles ***/
#numbers-page .page-title
{
    background: url(/images/icon-vision.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#numbers-page .page-title h2
{
    width: 421px;
    height: 33px;
    background-position: left -201px;
}
#numbers-page .section-title
{
    background: url(/images/sprite-sectiontitles.png) no-repeat;
    display: block;
    text-indent: -9999px;
}
#numbers-page .numbers1
{
    width: 92px;
    height: 23px;
    background-position: left -436px;
}
#numbers-page .numbers2
{
    width: 112px;
    height: 23px;
    background-position: left -160px;
}
#numbers-page .numbers3
{
    width: 152px;
    height: 23px;
    background-position: left -643px;
}
#numbers-page .numbers4
{
    width: 152px;
    height: 23px;
    background-position: left -46px;
}
#numbers-page .numbers5
{
    width: 112px;
    height: 23px;
    background-position: left -344px;
}
#numbers-page .numbers6
{
    width: 112px;
    height: 23px;
    background-position: left -574px;
}
#numbers-page dl
{
    display: block;
    float: left;
    margin: 0 10px 10px 0;
}
#numbers-page dt
{
    font-size: .8em;
    margin: 0;
    text-align: center;
    padding: 0;
}
#numbers-page dd
{
    margin: 0;
    padding: 0;
}
#numbers-page dd p
{
    background-color: #feffd8;
    margin: 0;
    padding: 1px 3px;
    text-align: center;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
}
#numbers-page strong
{
    font-size: 1.5em;
    font-weight: bold;
}


/*** Career page specific styles ***/
#career-page .page-title
{
    background: url(/images/icon-career.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#career-page .page-title h2
{
    width: 133px;
    height: 33px;
    background-position: left -433px;
}
#career-page p
{
    font-size: .9em;
}
#career-page ul
{
    font-size: .9em;
    margin-left: 0;
}
#career-page .section-title
{
    background: url(/images/sprite-sectiontitles.png) no-repeat;
    display: block;
    text-indent: -9999px;
}
#career-page .job .section-title
{
    width: 112px;
    height: 23px;
    background-position: left -206px;
}
#career-page .step .section-title
{
    width: 170px;
    height: 23px;
    background-position: left -505px;
}
#career-page .value .section-title
{
    width: 93px;
    height: 23px;
    background-position: left top;
}
#career-page .boardinterview .section-title
{
    width: 184px;
    height: 23px;
    background-position: left -528px;
}
#career-page .staffinterview .section-title
{
    width: 240px;
    height: 23px;
    background-position: left -298px;
}
#career-page .questions .section-title
{
    width: 82px;
    height: 23px;
    background-position: left -413px;
}

/*** Job page specific styles ***/
#job-page .page-title
{
    background: url(/images/icon-career.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#job-page .page-title h2
{
    width: 133px;
    height: 33px;
    background-position: left -466px;
}

/*** Programmer job page specific styles ***/
#programmer-page .page-title
{
    background: url(/images/icon-services.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 30px;
    width: 940px;
}
#programmer-page .page-title h2
{
    width: 192px;
    height: 33px;
    background-position: left -366px;
}
#programmer-page .pitch
{
    background-color: #fff;
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 0;
}
#programmer-page .pitch h3
{
    color: #333;
    font-size: 1.4em;
    line-height: 1.5;
    margin: 20px;
    padding: 0;
    text-align: center;
}
#programmer-page .pitch .description
{
    color: #888;
    font-size: 1em;
    margin: 0;
    padding: 0;
}
#programmer-page h4
{
    color: #284b71;
    font-size: 1.4em;
    margin: 60px 0 0 0;
}
#programmer-page h5
{
    color: #333;
    font-size: 1.2em;
}
#programmer-page ul
{
    margin: 1em auto auto 1em;
}
#programmer-page li
{
    font-size: .9em;
}
#programmer-page .link
{
    font-size: 1.2em;
    text-align: center;
    margin-top: 30px;
}

/*** Professional programmer job page specific styles ***/
#professionalprogrammer-page .page-title
{
    background: url(/images/icon-services.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 30px;
    width: 940px;
}
#professionalprogrammer-page .page-title h2
{
    width: 458px;
    height: 33px;
    background-position: left -864px;
}
#professionalprogrammer-page .pitch
{
    background-color: #fff;
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 0;
}
#professionalprogrammer-page .pitch h3
{
    color: #333;
    font-size: 1.4em;
    line-height: 1.5;
    margin: 20px;
    padding: 0;
    text-align: center;
}
#professionalprogrammer-page .pitch .description
{
    color: #888;
    font-size: 1em;
    margin: 0;
    padding: 0;
}
#professionalprogrammer-page h4
{
    color: #284b71;
    font-size: 1.4em;
    margin: 60px 0 0 0;
}
#professionalprogrammer-page h5
{
    color: #333;
    font-size: 1.2em;
}
#professionalprogrammer-page ul
{
    margin: 1em auto auto 1em;
}
#professionalprogrammer-page li
{
    font-size: .9em;
}
#professionalprogrammer-page .link
{
    font-size: 1.2em;
    text-align: center;
    margin-top: 30px;
}

/*** System engineer job page specific styles ***/
#systemengineer-page .page-title
{
    background: url(/images/icon-services.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 30px;
    width: 940px;
}
#systemengineer-page .page-title h2
{
    width: 285px;
    height: 33px;
    background-position: left -532px;
}
#systemengineer-page .pitch
{
    background-color: #fff;
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 0;
}
#systemengineer-page .pitch h3
{
    color: #333;
    font-size: 1.4em;
    line-height: 1.5;
    margin: 20px;
    padding: 0;
    text-align: center;
}
#systemengineer-page .pitch .description
{
    color: #888;
    font-size: 1em;
    margin: 0;
    padding: 0;
}
#systemengineer-page h4
{
    color: #284b71;
    font-size: 1.4em;
    margin: 60px 0 0 0;
}
#systemengineer-page h5
{
    color: #333;
    font-size: 1.2em;
}
#systemengineer-page ul
{
    margin: 1em auto auto 1em;
}
#systemengineer-page li
{
    font-size: .9em;
}
#systemengineer-page .link
{
    font-size: 1.2em;
    text-align: center;
    margin-top: 30px;
}

/*** Cloudworks engineer job page specific styles ***/
#cloudworksengineer-page .page-title
{
    background: url(/images/icon-services.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 30px;
    width: 940px;
}
#cloudworksengineer-page .page-title h2
{
    width: 348px;
    height: 33px;
    background-position: left -962px;
}
#cloudworksengineer-page .pitch
{
    background-color: #fff;
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 0;
}
#cloudworksengineer-page .pitch h3
{
    color: #333;
    font-size: 1.4em;
    line-height: 1.5;
    margin: 20px;
    padding: 0;
    text-align: center;
}
#cloudworksengineer-page .pitch .description
{
    color: #888;
    font-size: 1em;
    margin: 0;
    padding: 0;
}
#cloudworksengineer-page h4
{
    color: #284b71;
    font-size: 1.4em;
    margin: 60px 0 0 0;
}
#cloudworksengineer-page h5
{
    color: #333;
    font-size: 1.2em;
}
#cloudworksengineer-page ul
{
    margin: 1em auto auto 1em;
}
#cloudworksengineer-page li
{
    font-size: .9em;
}
#cloudworksengineer-page .link
{
    font-size: 1.2em;
    text-align: center;
    margin-top: 30px;
}

/*** Job application page specific styles ***/
#application-page h2
{
    font-size: 1.4em;
    text-align: center;
    margin: 30px auto;
}

#application-page td
{
    padding: 4px;
}

#application-page th
{
    background-color: #eff;
    font-size: .9em;
    font-weight: normal;
    padding: 5px;
    text-align: right;
    vertical-align: top;
    width: 200px;
}

#application-page label
{
    font-size: .9em;
    line-height: 1.5;
}

#application-page p
{
    margin: 0 0 10px 0;
}

#application-page p.error
{
    color: #f00;
}

#application-page input[type="text"]
{
    font-size: 1em;
    margin: 0;
    width: 200px;
}

#application-page textarea
{
    font-size: 1em;
    height: 200px;
    margin: 0;
    width: 400px;
}

#application-page .button
{
    margin-top: 30px;
    text-align: center;
}

/*** Step page specific styles ***/
#step-page .page-title
{
    background: url(/images/icon-career.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#step-page .page-title h2
{
    width: 229px;
    height: 34px;
    background-position: left -134px;
}

/*** Board interview page specific styles ***/
#boardinterview-page .page-title
{
    background: url(/images/icon-career.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#boardinterview-page .page-title h2
{
    width: 252px;
    height: 33px;
    background-position: left -698px;
}
#boardinterview-page h4
{
    font-size: 1.2em;
    margin-top: 2em;
}
#boardinterview-page .interviewer
{
    color: #356592;
}
#boardinterview-page .interviewee
{
}
#boardinterview-page .date
{
    text-align: right;
}

/*** Special interview page specific styles ***/
#specialinterview-page .page-title
{
    background: url(/images/icon-career.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#specialinterview-page .page-title h2
{
    width: 346px;
    height: 33px;
    background-position: left -333px;
}
#specialinterview-page h4
{
    font-size: 1.2em;
    margin-top: 2em;
}
#specialinterview-page .photo
{
    margin: 15px 0px 15px 0px;
}
#specialinterview-page .lead
{
    border: 1px #cccccc solid;
    font-size: .9em;
    font-weight: bold;
    margin: 60px 0px 60px 0px;
    padding: 0px 25px 0px 25px;
    color: #64619f;
    background-color: #e5e5f3;
}
#specialinterview-page .interviewer
{
    color: #356592;
    padding: 10px;
}
#specialinterview-page .interviewee
{
}
#specialinterview-page .staff-name
{
    float: left;
    margin-left: -3em;
    font-size: .9em;
    line-height: 1.5;
    padding: 10px;
    color: #009900;
}
#specialinterview-page .remark
{
    font-size: .9em;
    line-height: 1.5;
    padding: 10px;
}
#specialinterview-page .date
{
    text-align: right;
}

/*** Staff interview page specific styles ***/
#staffinterview-page .page-title
{
    background: url(/images/icon-career.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#staffinterview-page .page-title h2
{
    width: 346px;
    height: 33px;
    background-position: left -333px;
}
#staffinterview-page h4
{
    font-size: 1.2em;
    margin-top: 2em;
}
#staffinterview-page .photo
{
    margin: 15px 0px 15px 0px;
}
#staffinterview-page .lead
{
    border: 1px #cccccc solid;
    font-size: .9em;
    font-weight: bold;
    margin: 60px 0px 60px 0px;
    padding: 0px 25px 0px 25px;
    color: #64619f;
    background-color: #e5e5f3;
}
#staffinterview-page .interviewer
{
    color: #356592;
    padding: 10px;
}
#staffinterview-page .interviewee
{
}
#staffinterview-page .staff-name
{
    float: left;
    margin-left: -3em;
    font-size: .9em;
    line-height: 1.5;
    padding: 10px;
    color: #009900;
}
#staffinterview-page .remark
{
    font-size: .9em;
    line-height: 1.5;
    padding: 10px;
}
#staffinterview-page .date
{
    text-align: right;
}

/*** Questions page specific styles ***/
#questions-page .page-title
{
    background: url(/images/icon-career.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#questions-page .page-title h2
{
    width: 83px;
    height: 33px;
    background-position: left -764px;
}
#questions-page p
{
    margin-left: 1em;
}
#questions-page h4
{
    font-size: 1em;
    font-weight: bold;
}


/*** Blog Page specific styles ***/
#blog-page .page-title
{
    background: url(/images/icon-blog.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}

#blog-page .page-title h2
{
    width: 95px;
    height: 33px;
    background-position: left -731px;
}

#blog-page .section-title
{
    background: url(/images/sprite-sectiontitles.png) no-repeat;
    display: block;
    text-indent: -9999px;
}
#blog-page .ceoblog .section-title
{
    width: 129px;
    height: 23px;
    background-position: left -459px;
}
#blog-page .recruitblog .section-title
{
    width: 129px;
    height: 23px;
    background-position: left -551px;
}
#blog-page .techblog .section-title
{
    width: 129px;
    height: 23px;
    background-position: left -137px;
}
#blog-page a.banner
{
    background-image: url(/images/banners-blog.jpg);
    background-repeat: no-repeat;
    display: block;
    height: 160px;
    text-indent: -9999px;
    width: 300px;
    -webkit-transition: none;
}
#blog-page .ceoblog a.banner
{
    background-position: 0 0;
}
#blog-page .ceoblog a.banner:hover
{
    background-position: 0 bottom;
}
#blog-page .recruitblog a.banner
{
    background-position: -300px 0;
}
#blog-page .recruitblog a.banner:hover
{
    background-position: -300px bottom;
}
#blog-page .techblog a.banner
{
    background-position: -600px 0;
}
#blog-page .techblog a.banner:hover
{
    background-position: -600px bottom;
}


/*** Privacy Policy page specific styles ***/
#privacypolicy-page .page-title
{
    margin-top: 50px;
}
#privacypolicy-page .page-title h2
{
    width: 315px;
    height: 34px;
    background-position: left -399px;
}
#privacypolicy-page ol li
{
    font-size: .9em;
    line-height: 2;
    list-style: none;
}
#privacypolicy-page ol li.one
{
    background: url(/images/circle-darkblue-1.png) no-repeat;
    padding-left: 24px;
}
#privacypolicy-page ol li.two
{
    background: url(/images/circle-darkblue-2.png) no-repeat;
    padding-left: 24px;
}
#privacypolicy-page ol li.three
{
    background: url(/images/circle-darkblue-3.png) no-repeat;
    padding-left: 24px;
}
#privacypolicy-page ol li.four
{
    background: url(/images/circle-darkblue-4.png) no-repeat;
    padding-left: 24px;
}
#privacypolicy-page ol li.five
{
    background: url(/images/circle-darkblue-5.png) no-repeat;
    padding-left: 24px;
}
#privacypolicy-page ol li.six
{
    background: url(/images/circle-darkblue-6.png) no-repeat;
    padding-left: 24px;
}
#privacypolicy-page ol li ul
{
}


/*** Sitemap page specific styles ***/
#sitemap-page .page-title
{
    margin-top: 50px;
}
#sitemap-page .page-title h2
{
    width: 181px;
    height: 34px;
    background-position: left top;
}


/*** Contact page specific styles ***/
#contact-page .page-title
{
    margin-top: 50px;
}
#contact-page .page-title h2
{
    width: 198px;
    height: 33px;
    background-position: left -565px;
}
#contact-page .section-title
{
    background: url(/images/sprite-sectiontitles.png) no-repeat;
    display: block;
    margin-bottom: 1em;
    text-indent: -9999px;
}
#contact-page .phone
{
    width: 250px;
    height: 22px;
    background-position: left -92px;
}
#contact-page .mail
{
    width: 225px;
    height: 23px;
    background-position: left -367px;
}
#contact-page .contact-number
{
    font-size: 1.5em;
    font-weight: bold;
    margin: 20px auto;
    text-align: center;
}
#contact-page .note
{
    color: #666;
    font-size: 0.7em;
}

#contact-page td
{
    padding: 4px;
}

#contact-page th
{
    background-color: #eff;
    font-size: .9em;
    font-weight: normal;
    padding: 5px;
    text-align: right;
    vertical-align: top;
    width: 200px;
}

#contact-page label
{
    font-size: .9em;
    line-height: 1.5;
}

#contact-page p
{
    margin: 0 0 10px 0;
}

#contact-page p.error
{
    color: #f00;
}

#contact-page input[type="text"]
{
    font-size: 1em;
    margin: 0;
    width: 200px;
}

#contact-page textarea
{
    font-size: 1em;
    height: 200px;
    margin: 0;
    width: 400px;
}

#contact-page .button
{
    margin-top: 30px;
    text-align: center;
}

/*** 導入事例：ユニメディア ***/
/* リード */
#unimedia-lead
{
  width: 940px;
  text-align: left;
  font-size: .9em;
  margin: 0 auto;
}

#unimedia-lead .left
{
  width: 50%;
  float: left;
  font-weight: bold;
  margin: 0px 10px 0px 10px;
  padding: 10px 10px 10px 20px;
  background-color: #dcdcdc;
}
#unimedia-lead .right
{
  width: 50%;
  font-weight: bold;
  float: left;
  margin: 0px 10px 0px 10px;
  padding: 10px 10px 10px 30px;
  background-color: #dcdcdc;
}

/* トピックレイアウト タイトル*/
#unimedia-title
{
  width: 940px;
  text-align: left;
  font-size: .9em;
  margin: 0 auto;
}

/* トピックタイトル */
#unimedia-title .left
{
  width: 25%;
  float: left;
  font-weight: bold;
  margin: 0px 10px 0px 10px;
  padding: 10px 10px 10px 20px;
  background-color: #dcdcdc;
}
#unimedia-title .middle
{
  width: 20%;
  font-weight: bold;
  float: left;
  margin: 0px 10px 0px 10px;
  padding: 10px 10px 10px 30px;
  background-color: #dcdcdc;
}
#unimedia-title .right
{
  width: 35%;
  font-weight: bold;
  float: left;
  margin: 0px 10px 0px 10px;
  padding: 10px 10px 10px 30px;
  background-color: #dcdcdc;
}

/* トピック */
#unimedia
{
  width: 940px;
  text-align: left;
  font-size: .9em;
  margin: 0 auto;
}

#unimedia .left
{
  width: 25%;
  height: 110px;
  float: left;
  margin: 5px 10px 10px 10px;
  padding: 10px 10px 10px 20px;
  background-color: #ededed;
}

#unimedia .middle
{
  width: 20%;
  height: 110px;
  float: left;
  margin: 5px 10px 10px 10px;
  padding: 10px 10px 10px 30px;
  background-color: #ededed;
}

#unimedia .right
{
  width: 35%;
  height: 110px;
  float: left;
  margin: 5px 10px 10px 10px;
  padding: 10px 10px 10px 30px;
  background-color: #ededed;
}

#unimedia p
{
    font-size: .9em;
    line-height: 1.7;
    margin: 1em 0;
}

#unimedia ul li
{
    font-size: 1.0em;
    list-style-type: disc;
}

/* 本文 */
#unimedia-story
{
    width: 940px;
    text-align: left;
    margin: 30px auto;
}

/* 本文タイトル */
#unimedia-story .title
{
    clear: both;
    width: 100%;
    font-size: 1.2em;
    line-height: 1.5;
    padding: 10px;
    margin: 0px;
    background: #f5f5f5;
}

/* ボディ */
#unimedia-story .story
{
    clear: both;
    width: 100%;
    font-size: 1.0em;
    line-height: 1.5;
    padding: 10px;
    background: #f5f5f5;
}
#unimedia-story p
{
    font-size: .9em;
    line-height: 1.7;
    margin: 1em 0;
}

/* 用語解説 */
#unimedia-glossary
{
  width: 940px;
  text-align: left;
  font-size: .9em;
  margin: 0 auto;
  padding: 40px;
}

#unimedia-glossary .frame
{
  border: 1px #cccccc solid;
  font-size: .9em;
  margin: 60px 0px 60px 0px;
  padding: 0px 25px 0px 25px;
}

#unimedia-glossary ul li
{
    font-size: 1.0em;
    list-style-type: disc;
}

/* ユニメディア紹介 */
#unimedia-corp
{
  width: 940px;
  text-align: left;
  font-size: .9em;
  margin: 0 auto;
}

/* タイトル */
#unimedia-corp .left-title
{
  width: 40%;
  float: left;
  font-weight: bold;
  margin: 0px 10px 0px 10px;
  padding: 10px 10px 10px 20px;
  background-color: #dcdcdc;
}
#unimedia-corp .right-title
{
  width: 40%;
  float: left;
  font-weight: bold;
  margin: 0px 10px 0px 10px;
  padding: 10px 10px 10px 20px;
  background-color: #dcdcdc;
}

/* 本文 */
#unimedia-corp .left
{
  width: 40%;
  height: 180px;
  float: left;
  margin: 5px 10px 10px 10px;
  padding: 10px 10px 10px 20px;
  background-color: #ededed;
}

#unimedia-corp .right
{
  width: 40%;
  height: 180px;
  float: left;
  margin: 5px 10px 10px 10px;
  padding: 10px 10px 10px 20px;
  background-color: #ededed;
}

#unimedia-corp ul li
{
    font-size: 1.0em;
    list-style-type: disc;
}

/*** Picasa Thumbnail styles ***/
#picasaStream img { border: 1px solid #999; margin: 0 5px 5px 0; padding: 3px; }

/*** Junior-Staff interview page specific styles ***/
#junior-staffinterview-page .page-title
{
    background: url(/images/icon-career.png) no-repeat 100% 0;
    height: 60px;
    margin-top: 50px;
    width: 940px;
}
#junior-staffinterview-page .page-title h2
{
    width: 346px;
    height: 33px;
    background-position: left -333px;
}
#junior-staffinterview-page h4
{
    font-size: 1.2em;
    margin-top: 2em;
}
#junior-staffinterview-page .photo
{
    margin: 15px 0px 15px 0px;
}
#junior-staffinterview-page .lead
{
    border: 1px #cccccc solid;
    font-size: .9em;
    font-weight: bold;
    margin: 60px 0px 60px 0px;
    padding: 0px 25px 0px 25px;
    color: #64619f;
    background-color: #e5e5f3;
}
#junior-staffinterview-page .interviewer
{
    color: #356592;
    padding: 10px;
}
#junior-staffinterview-page .interviewee
{
}
#junior-staffinterview-page .staff-name
{
    float: left;
    margin-left: -3em;
    font-size: .9em;
    line-height: 1.5;
    padding: 10px;
    color: #009900;
}
#junior-staffinterview-page .remark
{
    font-size: .9em;
    line-height: 1.5;
    padding: 10px;
}
#junior-staffinterview-page .date
{
    text-align: right;
}

#junior-staffinterview-page .title {
    vertical-align: middle;
}

