@charset "UTF-8";
.clearfix {
  width: 100%; }

.clearfix:after {
  content: "";
  display: block;
  clear: both; }

#headerglobal {
  position: relative; }
  #headerglobal nav.pc {
    position: relative; }
    #headerglobal nav.pc div#company {
      width: 204px;
      height: 70px;
      margin: 0;
      padding: 0;
      position: absolute;
      top: 0;
      left: 0; }
    #headerglobal nav.pc #firstNav {
      height: 70px;
      padding: 0 0 0 207px;
      margin: 0; }
      #headerglobal nav.pc #firstNav > ul {
        position: absolute;
        list-style: none;
        padding: 0;
        margin: 0; }
        #headerglobal nav.pc #firstNav > ul > li {
          position: relative;
          float: left;
          padding: 0;
          margin: 0;
          width: 90px;
          height: 70px; }
          #headerglobal nav.pc #firstNav > ul > li > div.tab {
            width: 90px;
            height: 70px;
            position: relative;
            overflow: hidden; }
            #headerglobal nav.pc #firstNav > ul > li > div.tab > span {
              width: 90px;
              height: 60px;
              display: inline-block;
              position: absolute;
              bottom: -30px;
              left: 0;
              -moz-transition-duration: 0.5s;
              -webkit-transition-duration: 0.5s;
              -o-transition-duration: 0.5s;
              -ms-transition-duration: 0.5s;
              -moz-transition: bottom 0.5s ease 0, z-index 0.5s ease 0;
              -webkit-transition: bottom 0.5s ease 0, z-index 0.5s ease 0;
              -o-transition: bottom 0.5s ease 0, z-index 0.5s ease 0;
              -ms-transition: bottom 0.5s ease 0, z-index 0.5s ease 0; }
              #headerglobal nav.pc #firstNav > ul > li > div.tab > span a {
                display: block;
                width: 87px;
                height: 60px;
                background: #FFFFFF;
                border-top-right-radius: 10px;
                border-top-left-radius: 10px;
                font-size: 0.8em;
                font-weight: bold;
                padding: 3px 7px 0;
                position: absolute;
                bottom: 0px;
                z-index: 100;
                -moz-transition-duration: 0.5s;
                -webkit-transition-duration: 0.5s;
                -o-transition-duration: 0.5s;
                -ms-transition-duration: 0.5s; }
              #headerglobal nav.pc #firstNav > ul > li > div.tab > span a:hover {
                text-decoration: none; }
              #headerglobal nav.pc #firstNav > ul > li > div.tab > span a.motion {
                z-index: 300; }
              #headerglobal nav.pc #firstNav > ul > li > div.tab > span p {
                position: absolute;
                bottom: -30px;
                left: 7px;
                font-size: 0.5em;
                color: #2B833A;
                font-weight: bold;
                z-index: 100;
                -moz-transition-duration: 0.5s;
                -webkit-transition-duration: 0.5s;
                -o-transition-duration: 0.5s;
                -ms-transition-duration: 0.5s;
                -moz-transition: bottom 0.5s ease 0, z-index 0.5s ease 0;
                -webkit-transition: bottom 0.5s ease 0, z-index 0.5s ease 0;
                -o-transition: bottom 0.5s ease 0, z-index 0.5s ease 0;
                -ms-transition: bottom 0.5s ease 0, z-index 0.5s ease 0; }
              #headerglobal nav.pc #firstNav > ul > li > div.tab > span p.motion {
                bottom: 11px;
                z-index: 300; }
              #headerglobal nav.pc #firstNav > ul > li > div.tab > span img {
                position: absolute;
                bottom: -40px;
                right: 8px;
                width: 50px;
                z-index: 100;
                -moz-transition-duration: 0.5s;
                -webkit-transition-duration: 0.5s;
                -o-transition-duration: 0.5s;
                -ms-transition-duration: 0.5s;
                -moz-transition: bottom 0.5s ease 0, z-index 0.5s ease 0;
                -webkit-transition: bottom 0.5s ease 0, z-index 0.5s ease 0;
                -o-transition: bottom 0.5s ease 0, z-index 0.5s ease 0;
                -ms-transition: bottom 0.5s ease 0, z-index 0.5s ease 0; }
              #headerglobal nav.pc #firstNav > ul > li > div.tab > span img.motion {
                bottom: 5px;
                z-index: 300; }
            #headerglobal nav.pc #firstNav > ul > li > div.tab > span.motion {
              bottom: 0px; }
          #headerglobal nav.pc #firstNav > ul > li > div.balloon {
            display: none;
            padding: 0;
            margin: 0;
            position: absolute;
            top: 70px;
            left: -35px;
            z-index: 300; }
            #headerglobal nav.pc #firstNav > ul > li > div.balloon > ul {
              padding: 0;
              margin: 20px 0 0;
              list-style: none;
              border: 1px solid #dddddd;
              box-shadow: rgba(51, 51, 51, 0.5) 3px 3px 10px 0px;
              -webkit-box-shadow: rgba(51, 51, 51, 0.5) 3px 3px 10px 0px;
              -moz-box-shadow: rgba(51, 51, 51, 0.5) 3px 3px 10px 0px; }
              #headerglobal nav.pc #firstNav > ul > li > div.balloon > ul > li {
                position: relative;
                background: #FFFFFF; }
                #headerglobal nav.pc #firstNav > ul > li > div.balloon > ul > li p {
                  display: none; }
                #headerglobal nav.pc #firstNav > ul > li > div.balloon > ul > li a {
                  display: block;
                  width: 150px;
                  color: #2B833A;
                  background: #FFFFFF;
                  font-size: 0.8em;
                  padding: 5px 10px;
                  font-weight: bold;
                  border-radius: 0; }
                #headerglobal nav.pc #firstNav > ul > li > div.balloon > ul > li a:hover {
                  text-decoration: none;
                  color: #FFFFFF;
                  background: #2B833A; }
            #headerglobal nav.pc #firstNav > ul > li > div.balloon ul:after {
              height: 16px;
              width: 30px;
              content: url("../images/bg_balloonTop.png");
              position: absolute;
              top: 3px;
              left: 60px; }
  #headerglobal #socialBtn {
    position: absolute;
    top: 10px;
    right: 125px;
    z-index: 200; }
  #headerglobal #globallinks.pc {
    position: absolute;
    top: 0;
    right: 0;
    padding: 5px;
    z-index: 200;
    width: 120px; }
    #headerglobal #globallinks.pc #headerlanguages {
      padding-right: 10px; }
    #headerglobal #globallinks.pc .globalsearch .globalsearchinput {
      min-height: inherit;
      padding: 3px 5px;
      width: 110px;
      font-size: 0.5em;
      line-height: initial; }

#socialBtn .blog {
  background: #1E98B9;
  padding: 0px 10px;
  font-size: 0.7em;
  font-weight: bold;
  border-radius: 3px;
  margin: -1px 0 0;
  position: absolute;
  top: 0px;
  left: -108px;
  line-height: 2.0em;
  text-decoration: none;
  color: #fff;
  border: 1px solid #2B833A; }
#socialBtn .blog:hover {
  opacity: 0.7; }

#smpMenuBtn {
  background: #f5f5f5;
  border-radius: 10px;
  padding: 10px 20px 11px;
  font-size: 2.0em;
  color: #2B833A;
  float: right;
  cursor: pointer;
  position: absolute;
  top: 9px;
  right: 20px;
  z-index: 500; }

#smpMenuBtn.motion {
  position: fixed; }

nav.mbl {
  display: none;
  width: 100%;
  position: relative;
  padding: 0 0 10px; }
  nav.mbl #mblMenu {
    background: #F5F5F5;
    position: absolute;
    top: 70px;
    right: 0;
    z-index: 200;
    border-radius: 10px;
    width: 0;
    overflow: hidden;
    padding: 0 0 10px;
    -moz-transition-duration: 0.5s;
    -webkit-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -moz-transition: width 0.5s ease 0;
    -webkit-transition: width 0.5s ease 0;
    -o-transition: width 0.5s ease 0;
    -ms-transition: width 0.5s ease 0; }
    nav.mbl #mblMenu dl {
      background: #FFFFFF;
      border-radius: 10px;
      margin: 0 10px; }
      nav.mbl #mblMenu dl dt {
        width: 320px;
        padding: 5px 10px; }
        nav.mbl #mblMenu dl dt p {
          float: left;
          width: 200px;
          font-size: 0.8em;
          margin: 5px 10px 0; }
        nav.mbl #mblMenu dl dt i {
          float: left;
          width: 200px;
          height: 10px;
          font-size: 0.5em;
          padding: 0 10px; }
        nav.mbl #mblMenu dl dt img {
          float: left;
          height: 30px; }
      nav.mbl #mblMenu dl dd {
        font-size: 0.8em;
        font-weight: bold;
        padding: 10px; }
        nav.mbl #mblMenu dl dd ul {
          list-style: none;
          margin: 0;
          padding: 0 0 0 20px; }
          nav.mbl #mblMenu dl dd ul li {
            border-radius: 20px; }
            nav.mbl #mblMenu dl dd ul li a {
              text-decoration: none;
              display: block;
              padding: 5px 10px; }
            nav.mbl #mblMenu dl dd ul li a:hover {
              color: #FFFFFF; }
          nav.mbl #mblMenu dl dd ul li:hover {
            background: #2B833A; }
  nav.mbl #mblMenu.motion {
    width: 320px; }

/********************
 * サイト共通
 ********************/
#body {
  font-family: "Lucida Grande", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, メイリオ, sans-serif;
  font-size: 1.5em;
  line-height: 1.8em;
  color: #333; }

#xwikicontent {
  overflow: hidden !important; }

#xwikicontent a {
  font-weight: bold;
  text-decoration: underline; }

#xwikicontent a.btn {
  text-decoration: none; }

#xwikicontent h1 a,
#xwikicontent h2 a {
  color: #fff; }

#xwikicontent h1,
#xwikicontent h2,
#xwikicontent h3,
#xwikicontent h4 {
  border-radius: 5px;
  border: 0;
  color: #fff;
  font-weight: bold;
  line-height: 1.4em; }

#xwikicontent h1 {
  background: #2B833A;
  font-size: 1.5em;
  margin: 30px 0 8px;
  padding: 6px 10px 4px; }

#xwikicontent h2 {
  background: #66A671;
  font-size: 1.2em;
  margin: 20px 0 5px;
  padding: 5px 8px 3px; }

#xwikicontent h3,
#xwikicontent h4 {
  border-radius: 16px;
  font-size: 1.0em;
  font-weight: bold;
  margin: 15px 0 5px;
  padding: 8px 10px; }

#xwikicontent h3 {
  background: #DCE9DA;
  color: #2B833A; }

#xwikicontent h4 {
  background: #ddd;
  color: #666; }

#xwikicontent p {
  margin: 0 5px 3px;
  line-height: 1.6em; }

#xwikicontent ul {
  list-style: none;
  margin: -5px 0 10px;
  padding-left: 0; }

#xwikicontent ul li {
  margin: 5px 0;
  padding: 0 0 0 22px;
  background: url(/https/www.htmlhifive.com/ja/wiki/images/list-item-bullet.png) no-repeat 8px 4px;
  font-size: 0.9em;
  line-height: 1.7em; }

/* 汎用的に使える class */
.putCursol:hover {
  opacity: 0.7; }

#xwikicontent .mt10 {
  margin-top: 10px; }

#xwikicontent .mb10 {
  margin-bottom: 10px; }

#xwikicontent .fcW {
  color: #fff; }

/* コード記述部の行間設定 */
div.code {
  line-height: 1.3em; }

/********************
 * グローバルメニュー
 ********************/
#companylogo img {
  margin: 0 3px 0 0; }

/********************
 * ソーシャルボタン
 ********************/
#socialBtn {
  vertical-align: middle; }

.fb_iframe_widget {
  vertical-align: middle;
  width: auto !important;
  display: inline-block !important; }

.twitter {
  display: inline-block;
  vertical-align: middle; }

.fb_iframe_widget > span {
  vertical-align: baseline !important; }

/********************
 * ページトップへ
 ********************/
.gototop a {
  text-decoration: none;
  font-size: 4.0em;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 1001;
  opacity: 0.7; }

/********************
 * スマデバ対応
 ********************/
@media screen and (max-width: 855px) {
  #headerglobal nav.pc #firstNav > ul > li > div.tab > span a {
    font-size: 0.65em; }

  #headerglobal nav.pc #firstNav > ul > li,
  #headerglobal nav.pc #firstNav > ul > li > div.tab,
  #headerglobal nav.pc #firstNav > ul > li > div.tab > span {
    width: 77px; }

  #headerglobal nav.pc #firstNav > ul > li > div.tab > span a {
    padding: 3px 5px 0;
    width: 74px; } }
@media screen and (max-width: 767px) {
  #headerglobal {
    position: relative; }
    #headerglobal nav.pc #firstNav > ul > li {
      width: 50px;
      height: 70px; }
      #headerglobal nav.pc #firstNav > ul > li > div.tab {
        width: 50px;
        height: 70px; }
        #headerglobal nav.pc #firstNav > ul > li > div.tab > span {
          width: 50px; }
          #headerglobal nav.pc #firstNav > ul > li > div.tab > span a {
            width: 47px;
            text-indent: -100px; }
          #headerglobal nav.pc #firstNav > ul > li > div.tab > span p {
            display: none; }
          #headerglobal nav.pc #firstNav > ul > li > div.tab > span img {
            bottom: 35px;
            right: 17px;
            width: 25px; }
          #headerglobal nav.pc #firstNav > ul > li > div.tab > span img.motion {
            bottom: 30px;
            z-index: 300; }
        #headerglobal nav.pc #firstNav > ul > li > div.tab > span.motion {
          bottom: 0px; }
      #headerglobal nav.pc #firstNav > ul > li > div.balloon {
        left: -55px; } }
@media screen and (max-width: 630px) {
  /* コンテンツエリア */
  .main {
    padding: 0; }

  #mainContentArea, #mainEditArea {
    padding: 3px; }

  /* グロナビ */
  nav.pc,
  #socialBtn,
  #globallinks.pc {
    display: none; }

  nav.mbl {
    display: block; }

  /* フッター */
  #footerglobal {
    margin: 0; } }

/*# sourceMappingURL=base.css.map */
