@charset "UTF-8";
.sp {
  display: none;
}

body div#wrap-container {
  width: 100%;
  padding: 0;
  font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic, Meiryo, "メイリオ", "Lucida Grande", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
}

#header-utility ul.mainLink {
  display: inline\9;
  float: left\9;
  margin: 0px 0px 0px 0px\9;
  line-height: 1\9;
}

/*ie11*/
@media all and (-ms-high-contrast: none) {
  *::-ms-backdrop, #header-utility ul.mainLink {
    display: inline;
    float: left;
    margin: 0px 0px 0px 0px;
    line-height: 1;
  }
}

/*edge*/
@supports (-ms-accelerator: true) {
  #header-utility ul.mainLink {
    display: inline;
    float: left;
    margin: 0px 0px 0px 0px;
    line-height: 1;
  }
}

body {
  color: #2A3135;
}

body .mid {
  margin-top: 40px;
}

/* コンテナ枠
----------------------------*/
#container a:hover, #container li:hover a {
  opacity: 0.6;
}

.wrapper {
  padding: 60px 0 50px;
}

.wrapper.top {
  padding: 0;
}

.wrapper .container {
  font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic, Meiryo, "メイリオ", "Lucida Grande", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
  width: 980px;
  margin: 0 auto;
  position: relative;
  line-height: 1.6;
}

.wrapper .container h1#ttl {
  border-bottom: 1px solid #CCCCCC;
  font-size: 1.8em;
  margin: 0 auto 30px;
  line-height: 1.2;
  padding-bottom: 0px;
  width: 980px;
}

.hidden {
  display: none;
}

.bg-sky {
  background: #F4F8F9;
}

.bg-lattice {
  background: url(/static/images/seihin_joho/e-desk/edesk_01_15.gif);
}

#main-image {
  text-align: center;
}

#menu-box {
  margin: 0 auto 0px;
  width: 980px;
}

#menu-box li {
  float: left;
  width: 245px;
  height: 45px;
  color: #fff;
  font-size: 1.3333em;
  background-color: #1B4CA4;
  border-right: 1px solid #fff;
  border-top: 1px solid #1B4CA4;
  border-bottom: 1px solid #1B4CA4;
  box-sizing: border-box;
}

#menu-box li.now {
  background-color: #fff;
  border: 1px solid #1B4CA4;
}

#menu-box li.now a {
  color: #1B4CA4;
}

#menu-box li.now a:hover {
  color: #1B4CA4;
}

#menu-box li:hover {
  opacity: 0.6;
  transition: 0.6s;
}

#menu-box li:hover.now {
  background-color: #fff;
  border: 1px solid #1B4CA4;
}

#menu-box li:hover.now a {
  color: #1B4CA4;
}

#menu-box li a {
  color: #fff;
  display: block;
  text-align: center;
  padding: 8px 0 0;
  font-weight: bold;
}

#menu-box li a:hover {
  text-decoration: none;
}

#menu-box li:hover a {
  color: #fff;
}

h2.blue {
  padding-top: 30px;
  color: #265CB2;
  font-weight: bold;
  font-size: 1.8em;
  text-align: center;
  line-height: 1.2;
}

h3.black {
  margin-top: 10px;
  margin-bottom: 10px;
  font-weight: bold;
  font-size: 2.8em;
  text-align: center;
  line-height: 1.2;
}

h2.black {
  padding-top: 10px;
  margin-bottom: 10px;
  font-weight: bold;
  font-size: 2.8em;
  text-align: center;
  line-height: 1.2;
}

h3.sky {
  margin-top: 40px;
  margin-bottom: 15px;
  color: #00B4D5;
  font-weight: bold;
  font-size: 2.2em;
  text-align: center;
  line-height: 1.2;
}

h4.sky {
  margin-top: 40px;
  margin-bottom: 10px;
  color: #00B4D5;
  font-weight: bold;
  font-size: 1.2em;
  line-height: 1.2;
}

.caption {
  text-align: center;
  margin-bottom: 30px;
  line-height: 1.8;
}

.flex-box {
  display: flex;
}

.flex-around {
  justify-content: space-around;
}

.flex-between {
  justify-content: space-between;
}

.center {
  text-align: center;
  position: relative;
}

.left {
  text-align: left !important;
}

.button-blue {
  width: 358px;
  height: 56px;
  margin: 0 auto;
}

.button-blue a {
  color: #fff;
  font-size: 1.4em;
  font-weight: bold;
  display: table-cell;
  width: 358px;
  height: 52px;
  padding-bottom: 3px;
  text-align: center;
  vertical-align: middle;
  background: url(/static/images/seihin_joho/e-desk/edesk_01_08.png) no-repeat;
  margin: 0 auto;
}

.button-blue a:hover {
  text-decoration: none;
  opacity: 0.7;
}

#tokuchu-box .button-blue {
  margin: 4% auto 0;
}

.button-red {
  width: 358px;
  height: 56px;
  margin: 0 auto;
}

.button-red a {
  color: #fff;
  font-size: 1.4em;
  font-weight: bold;
  display: table-cell;
  width: 358px;
  height: 52px;
  padding-bottom: 3px;
  text-align: center;
  vertical-align: middle;
  background: url(/static/images/seihin_joho/e-desk/edesk_01_24.png) no-repeat;
  margin: 0 auto;
}

.button-red a:hover {
  text-decoration: none;
  opacity: 0.7;
}

.bold {
  font-weight: bold;
  font-size: 1.4em;
  line-height: 3em;
}

#build-option p span {
  color: #265cb2;
  font-weight: bold;
}

.pink {
  color: #ff5d94;
}

.hyo .pink {
  display: inline-block;
  margin: 0 0 0 2%;
}

.caution {
  position: absolute;
  bottom: 2%;
  left: 2.5%;
  font-size: 0.95em;
  font-weight: bold;
}

/* 関連 */
.relation-area {
  width: 980px;
  margin: 55px auto 80px;
}

.relation-title {
  font-size: 1.4em;
  letter-spacing: 1.68px;
  color: #fff;
  background-color: #5D626C;
  text-align: center;
  width: 100%;
  padding: 1% 0;
}

.relation-area-inner {
  display: flex;
  justify-content: center;
  margin: 20px auto 0;
}

.relation-area-inner .elation-item-text {
  font-size: 0.9333em;
  text-align: center;
  word-break: keep-all;
  font-weight: bold;
  line-height: 1.3;
}

.relation-area-inner img {
  width: 100%;
}

.relation-product .relation-item {
  width: 120px;
  margin: 0 41px;
}

.relation-page .relation-area-inner {
  margin: 32px 0 0;
}

.relation-page .relation-item {
  text-align: center;
  margin: 0 51px 0;
}

.relation-page .elation-item-img {
  width: 66px;
  margin: 0 auto;
}