@charset "UTF-8";
/*----------------------
 * 1.  GENERAL
 *   1.1 Main Wrapper
 *   1.2 Section
 *   1.3 Margin
 *   1.4 Text
 *   1.5 Background
 *   1.6 Button
 *   1.7 Icon
 *   1.8 Box
 *      1.8.1 boxW
 *      1.8.2 blue-box
 *      1.8.3 waku-box
 *      1.8.4 gray-box
 *      1.8.5 line-table-box
 *   1.9 Breadcrumb
 *   1.10 Cate Title
 *   1.11 Cate Main Visual
 * 2.  PRODUCT-SOLUTION
 *   2.1 Category top page
 *      2.1.2 Menu
 *      2.1.3 Case
 *      2.1.4 Circle Box text
 *      2.1.5 Chigau
 *      2.1.6 Item
 *           2.1.6.1 Item-pict
 *           2.1.6.2 Item-box
 *           2.1.6.3 Item-graybox
 *   2.2 Detail page
 *      2.2.1 Top detail
 *      2.2.2 Item detail
 *      2.2.3 Tokucho
 *      2.2.4 Shiyo
 *   2.3 Zenbun Search
 *      2.3.1 Button Contact
 *      2.3.2 Top
 *      2.3.3 Check List
 *      2.3.4 Tokuchou
 *      2.3.5 Price
 *   2.4 Server Dropdown
 *   2.5 Network Storage
 *   2.6 P2P
 *       2.6.1 Service
 *       2.6.2 Features
 *   2.7 Legacy table
 * 3.  REPORT
 *      3.1 Top page
 *      3.2 Detail page
 *           3.2.1 Related Report
 * 4.  SUPPORT
 *      4.1 Faq
 *      4.2 Download
 * 5.  CASE
 *   5.1 Detail page
 * 6.  NEWS
 * 7.  FEATURE
 *   7.1 Reason
 *   7.2 Guidance
 *   	7.2.1 Timeline
 *   		7.2.1.1 company-history
 *   7.3 Quality
 * 8. COMPANY
 * 	8.1 Message
 * 	8.2 Profile
 * 	8.3 Access & Policy
 * 9. SITEMAP
 * 10. CONTACT
 * 	10.1 Thanks Page
 * 11. SIDE
 * 12. PAGINATION
 * 13. RECRUIT
 *   13.1 Top
 *   13.2 New Graduate / Mid Career
 *   13.3 Message
 *   13.4 Benefit Program
 *   13.5 Interview
 *   13.6 Entry Form
 *   13.7 Contact Btn
 * 14. P2P 追加 170808 (by kuma)
 *   14.1 P2P Cate Nav
 *   14.2 P2P Menu
 *   14.3 Consult Box
 *   14.4 Top page
 *   14.5 Features Page
 * 15. 追加 170905 (by kuma)
 * 16. 追加 PRODUCT-SOLUTION / Super Micro 170926 (by kuma)
 * 17. 追加 PRODUCT-SOLUTION / TOP 171003 (by kuma)
 * 18. 追加 CONTACT/ORDER MADE 171110 (by kuma)
 * 19. 追加 CONTACT 171206 (by kuma)
 * 20. 追加 RECRUIT 180111 (by kuma)
 * 21. 追加 RECRUIT 180208 (by kuma)
 * 22. 追加 ISO LOGO 180718 (by kuma)
 * 23. 修正 ISO LOGO 180809 (by kuma)
 * 24. 修正 pagination 180821 (by kuma)
 * 25. 修正 recruit 190111 (by kuma)
 * 26. 追加 recruit slider TOP 190118 (by kuma)
 * 27. 追加 form 190123
 * 28. 修正 NEWS pagination 190222 (by kuma)
 * 29. 修正 CONTCTボタン 190617
 * 30. 修正 投稿のエレメントの追加 190712
 * 31. 修正 P2Pコラム 記事下部の情報ボックス レポート 191106
 * 32. 修正 製品詳細ページ カタログダウンロードボタンの追加 191129 (by kuma)
 * 33. 修正 CONTACT アドレスを画像に変更 200204
 * 34. 修正　『ファナティック ハード入替サービス』に関するコラムにグレーボックスを追加 200604
 * 35. 修正　『ファナティック ハード入替サービスまるわかりガイド』を追加 201021
 * 36. 修正　製品 特徴ボックス内でのh3タイトルのスタイルを追加（by Naguchi）
 * 37. 修正　製品 特徴ボックス内 table>td にtext-centerを効かせる（by Naguchi）20210326
 * 38. 修正　会社概要ページとダウンロードページのスタイル（by Naguchi）20220131
 */
/*-------------------------------
 * 1.GENERAL
 * ----------------------------*/
/* 1.1 Main Wrapper
 * ------------------------------*/
main#main-wrapper {
  margin: 0;
  padding-top: 40px;
}

@media only screen and (max-width: 767px) {
  main#main-wrapper {
    padding-bottom: 30px;
  }
}

main#main-wrapper .section-ttl {
  margin-bottom: 40px;
}

@media only screen and (max-width: 767px) {
  main#main-wrapper .section-ttl {
    margin-bottom: 30px;
  }
}

main#main-wrapper .section-ttl-txt .anime-line {
  animation-name: line-animation;
  animation-duration: 2s;
  animation-timing-function: ease;
  animation-fill-mode: forwards;
}

main#main-wrapper #tp-consult {
  margin-top: 200px;
}

@media only screen and (max-width: 991px) {
  main#main-wrapper #tp-consult {
    margin-top: 160px;
  }
}

@media only screen and (max-width: 767px) {
  ul.list-disc {
    padding-left: 20px;
    line-height: 1.8;
  }
  ul.list-disc li {
    padding-bottom: 5px;
  }
  ul.list-disc li:last-of-type {
    padding-bottom: 0;
  }
}

.link-imgover:hover {
  filter: alpha(opacity=75);
  opacity: 0.75;
  transition: 0.7s;
}

/* 1.2 Section
 * ------------------------------*/
.section20-wrap {
  margin-bottom: 20px;
}

.section40-wrap {
  margin-bottom: 40px;
}

.section60-wrap {
  margin-bottom: 60px;
}

.section80-wrap {
  margin-bottom: 80px;
}

.section20-wrap,
.section40-wrap,
.section60-wrap,
.section80-wrap {
  position: relative;
}

@media only screen and (max-width: 767px) {
  .section60-wrap,
  .section80-wrap {
    margin-bottom: 40px;
  }
}

/* 1.3 Margin
 * ------------------------------*/
.pt00 {
  padding-top: 0px !important;
}

.pt10 {
  padding-top: 10px !important;
}

.mt00 {
  margin-top: 00px !important;
}

.mt10 {
  margin-top: 10px !important;
}

.mt20 {
  margin-top: 20px !important;
}

.mt30 {
  margin-top: 30px !important;
}

.mt40 {
  margin-top: 40px !important;
}

.mt50 {
  margin-top: 50px !important;
}

.mt60 {
  margin-top: 60px !important;
}

.mt70 {
  margin-top: 70px !important;
}

.mt80 {
  margin-top: 80px !important;
}

.mb00 {
  margin-bottom: 00px !important;
}

.mb10 {
  margin-bottom: 10px !important;
}

.mb15 {
  margin-bottom: 15px !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.mb30 {
  margin-bottom: 30px !important;
}

.mb40 {
  margin-bottom: 40px !important;
}

.mb50 {
  margin-bottom: 50px !important;
}

.mb60 {
  margin-bottom: 60px !important;
}

.mb70 {
  margin-bottom: 70px !important;
}

.mb80 {
  margin-bottom: 80px !important;
}

@media only screen and (max-width: 767px) {
  .mt00-xs {
    margin-top: 00px !important;
  }
  .mt10-xs {
    margin-top: 10px !important;
  }
  .mt20-xs {
    margin-top: 20px !important;
  }
  .mt30-xs {
    margin-top: 30px !important;
  }
  .mt40-xs {
    margin-top: 40px !important;
  }
  .mb00-xs {
    margin-bottom: 00px !important;
  }
  .mb10-xs {
    margin-bottom: 10px !important;
  }
  .mb20-xs {
    margin-bottom: 20px !important;
  }
  .mb30-xs {
    margin-bottom: 30px !important;
  }
  .ml00-xs {
    margin-left: 0 !important;
  }
}

.ml05 {
  margin-left: 5px !important;
}

.ml10 {
  margin-left: 10px !important;
}

.mr05 {
  margin-right: 5px !important;
}

.mr10 {
  margin-right: 10px !important;
}

/* 1.4 Text
 * ------------------------------*/
p {
  font-size: 12px;
  line-height: 1.8;
  letter-spacing: 0.08em;
}

p.letter-spacing00 {
  letter-spacing: 0;
}

p.letter-spacing01 {
  letter-spacing: 0.1em;
}

p.line-height2 {
  line-height: 2;
}

p.line-height235 {
  line-height: 2.35;
}

@media only screen and (max-width: 767px) {
  p.line-height235 {
    line-height: 2;
  }
}

@media only screen and (max-width: 767px) {
  p {
    font-size: 12px;
    letter-spacing: 0;
  }
  .text-left-xs {
    text-align: left !important;
  }
  .text-center-xs {
    text-align: center !important;
  }
}

.f-weight400 {
  font-weight: 400 !important;
}

.f-weight500 {
  font-weight: 500 !important;
}

.f-weight600 {
  font-weight: 600 !important;
}

.txt-link {
  font-size: 12px;
  display: block;
  margin: 0;
  position: absolute;
  top: 45px;
  right: 45px;
}

.txt-link:hover {
  text-decoration: none;
}

@media only screen and (max-width: 991px) {
  .txt-link {
    top: 30px;
    right: 30px;
  }
}

@media only screen and (max-width: 767px) {
  .txt-link {
    position: relative;
    top: 0;
    left: 0;
    text-align: center;
    margin-top: 20px;
  }
}

.txt-blue {
  color: #2b71b8 !important;
}

.txt-gray,
.txt-gray a {
  color: #9fa0a0 !important;
}

.txt-black,
.txt-black a {
  color: #231916 !important;
}

.txt-red,
.txt-red a {
  color: #e50012 !important;
}

.underline-link a {
  text-decoration: underline;
}

.underline-link a:hover {
  text-decoration: none;
}

.f10 {
  font-size: 10px;
}

.f11 {
  font-size: 11px;
}

.f12 {
  font-size: 12px;
}

.f13 {
  font-size: 13px;
}

.f14 {
  font-size: 14px;
}

.f15 {
  font-size: 15px;
}

.f16 {
  font-size: 16px;
}

.f17 {
  font-size: 17px;
}

.f18 {
  font-size: 18px;
}

.f19 {
  font-size: 19px;
}

.f20 {
  font-size: 20px;
}

.f21 {
  font-size: 21px;
}

.f22 {
  font-size: 22px !important;
}

.f23 {
  font-size: 23px !important;
}

.f24 {
  font-size: 24px !important;
}

.f25 {
  font-size: 25px !important;
}

.f26 {
  font-size: 26px !important;
}

.f27 {
  font-size: 27px !important;
}

.f28 {
  font-size: 28px !important;
}

.f29 {
  font-size: 29px !important;
}

.f30 {
  font-size: 30px !important;
}

@media only screen and (max-width: 991px) {
  .f18,
  .f19 {
    font-size: 16px;
  }
  .f20,
  .f21 {
    font-size: 16px;
  }
  .f22,
  .f23 {
    font-size: 18px !important;
  }
  .f24,
  .f25 {
    font-size: 20px !important;
  }
  .f26,
  .f27 {
    font-size: 22px !important;
  }
  .f28,
  .f29 {
    font-size: 24px !important;
  }
  .f30 {
    font-size: 26px !important;
  }
}

@media only screen and (max-width: 767px) {
  .f13,
  .f14 {
    font-size: 12px;
  }
  .f15,
  .f16 {
    font-size: 13px;
  }
  .f17 .f18 {
    font-size: 14px;
  }
  .f19,
  .f20,
  .f21 {
    font-size: 15px;
  }
  .f22,
  .f23,
  .f24 {
    font-size: 16px !important;
  }
  .f28,
  .f29,
  .f30 {
    font-size: 18px !important;
  }
  .f14-xs {
    font-size: 14px !important;
  }
}

.txt-catch,
.txt-p2p {
  margin: 0;
  text-align: center;
  font-weight: 500;
  font-size: 24px;
  line-height: 1.8;
  letter-spacing: 0.08em;
}

@media only screen and (max-width: 767px) {
  .txt-catch,
  .txt-p2p {
    font-size: 16px;
    text-align: left;
  }
}

.txt-p2p {
  font-size: 28px;
  margin-bottom: 20px;
}

@media only screen and (max-width: 767px) {
  .txt-p2p {
    font-size: 16px;
    text-align: center;
  }
}

.txt-read {
  margin: 40px 0 0;
  text-align: center;
  font-weight: 500;
  font-size: 16px;
  line-height: 2.35;
  letter-spacing: 0.05em;
}

@media only screen and (max-width: 767px) {
  .txt-read {
    margin-top: 30px;
    text-align: left;
    font-size: 12px;
    line-height: 2;
  }
}

.sub-blue {
  margin: 0;
  padding: 7px 15px 8px;
  font-size: 18px;
  line-height: 1.45;
  color: #fff;
  letter-spacing: 0.08em;
  text-align: center;
  background-color: #2b71b8;
  position: relative;
}

.sub-blue .txt-link {
  top: 12px;
  right: 20px;
  color: #fff;
}

.sub-blue .txt-link:hover {
  color: #e9ebe8;
}

.sub-line {
  margin: 40px 0 20px;
  padding-bottom: 15px;
  font-size: 18px;
  letter-spacing: 0.08em;
  border-bottom: 1px solid #dbdcdc;
}

.sub-line-side {
  margin: 40px 0 20px;
  padding: 5px 0 5px 15px;
  border-left: 5px solid #2b71b8;
  font-size: 18px;
  line-height: 1.6;
  letter-spacing: 0.08em;
}

@media only screen and (max-width: 767px) {
  .sub-blue {
    font-size: 15px;
  }
  .sub-blue .txt-link {
    display: none;
  }
  .sub-line {
    font-size: 15px;
  }
  .sub-line-side {
    font-size: 15px;
  }
}

/* 1.5 Background
 * ------------------------------*/
.bg-white {
  background-color: #fff;
}

@media only screen and (max-width: 1499px) {
  .bg-white #breadcrumb {
    padding-left: 155px;
  }
}

@media only screen and (max-width: 1199px) {
  .bg-white #breadcrumb {
    padding-left: 178px;
  }
}

@media only screen and (max-width: 991px) {
  .bg-white #breadcrumb {
    padding-left: 0;
  }
}

.bg-gray {
  background-color: #e9ebe8;
}

/* 1.6 Button
 * ------------------------------*/
.btn-more {
  width: 200px;
  margin: 70px auto;
  position: relative;
}

@media only screen and (max-width: 767px) {
  .btn-more {
    width: auto;
    margin: 20px auto;
  }
}

.btn-more span {
  display: inline-block;
  font-size: 20px;
  position: absolute;
  margin: 0;
  top: 0;
  right: 15px;
}

.post-contact-btn {
  display: block;
  width: 300px;
  height: 78px;
  margin: 40px auto 0;
  padding-top: 20px;
  text-align: center;
  vertical-align: middle;
  font-size: 16px;
  color: #2b71b8;
  border: 4px solid #2b71b8;
  line-height: 1.7;
  position: relative;
  transition: color 400ms cubic-bezier(0.42, 0, 0.58, 1);
  z-index: 2;
  box-sizing: border-box;
}

.post-contact-btn:before {
  background: #2b71b8;
  display: block;
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 0%;
  z-index: -1;
  content: "";
  transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
}

.post-contact-btn:hover {
  color: #fff;
  text-decoration: none;
}

.post-contact-btn:hover:before {
  width: 100%;
}

@media only screen and (max-width: 767px) {
  .post-contact-btn {
    width: auto;
    margin-top: 20px;
  }
}

/* 1.7 Icon
 * ------------------------------*/
.icon.icon-align {
  position: relative;
  top: 2px;
  margin-right: 2px;
}

/* 1.8 Box
 * ------------------------------*/
/***** 1.8.1 boxW *****/
.boxW.pd70 {
  padding: 70px !important;
  position: relative;
}

@media only screen and (max-width: 991px) {
  .boxW.pd70 {
    padding: 40px 30px 30px !important;
  }
}

.boxW.pd60_70 {
  padding: 60px 70px !important;
  position: relative;
}

.boxW.pd50_70 {
  padding: 50px 70px !important;
  position: relative;
}

.boxW.line-blue {
  border-top: 2px solid #2b71b8;
}

@media only screen and (max-width: 991px) {
  .boxW.pd60_70,
  .boxW.pd50_70 {
    padding: 30px !important;
  }
}

@media only screen and (max-width: 767px) {
  .boxW.pd70,
  .boxW.pd60_70,
  .boxW.pd50_70 {
    padding: 20px 15px !important;
  }
}

/***** 1.8.2 blue-box *****/
.blue-box {
  padding: 10px 20px 11px;
  color: #fff;
  background-color: #2b71b8;
  border-radius: 6px;
}

.line-blue .blue-box {
  display: list-item;
}

.line-blue .blue-box a {
  color: #fff;
  display: block;
  margin: -10px -20px -11px;
  border-radius: 6px;
}

@media only screen and (max-width: 767px) {
  .line-blue .blue-box {
    display: block;
  }
  .line-blue .blue-box a {
    margin: 0 auto;
  }
}

.blue-box p {
  margin: 0;
}

/***** 1.8.3 waku-box *****/
.waku-box {
  padding: 40px;
  background-color: #fff;
  border: 1px solid #9e9e9f;
}

/***** 1.8.4 gray-box *****/
.gray-box {
  width: auto;
  margin: 10px 0;
  padding: 10px 20px;
  background-color: #e9ebe8;
}

.gray-box p:first-of-type {
  margin-top: 0;
}

.gray-box p:last-of-type {
  margin-bottom: 0;
}

@media only screen and (max-width: 767px) {
  .gray-box {
    padding: 10px;
  }
}

/***** 1.8.5 line-table-box *****/
.line-table-box {
  width: 100%;
  padding: 25px 0;
  display: table;
  vertical-align: middle;
  border-bottom: 1px solid #dbdcdc;
  border-box: box-sizing;
}

@media only screen and (max-width: 767px) {
  .line-table-box {
    padding: 15px 0;
  }
}

.line-table-box:first-of-type {
  margin-top: 50px;
  border-top: 1px solid #dbdcdc;
}

@media only screen and (max-width: 767px) {
  .line-table-box:first-of-type {
    margin-top: 25px;
  }
}

.line-table-box .col-xs-12 {
  display: table-cell;
}

.line-table-box p {
  margin: 0;
}

.line-table-box .f18 {
  padding-left: 24px;
  position: relative;
}

.line-table-box .f18 .txt-blue {
  position: absolute;
  left: 0;
}

/* 1.9 Breadcrumb
 * ------------------------------*/
#breadcrumb {
  height: 40px;
  padding-top: 25px;
  font-size: 10px;
  line-height: 1;
  box-sizing: border-box;
  position: relative;
  z-index: 10;
}

@media only screen and (max-width: 767px) {
  #breadcrumb {
    display: none;
  }
}

#breadcrumb .container {
  width: auto;
}

#breadcrumb a {
  color: #595757;
}

#breadcrumb ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

#breadcrumb ul li {
  display: inline-block;
}

#breadcrumb ul li:after {
  padding: 0 4px;
  content: " / ";
}

#breadcrumb ul li:last-of-type:after {
  content: "";
}

#breadcrumb ul li.active {
  color: #2b71b8;
}

/* 1.10 Cate Title
 * ------------------------------*/
#cate-ttl {
  margin: 1px 0 0;
  height: 80px;
  background-color: #2b71b8;
  color: #fff;
  text-align: center;
  overflow: hidden;
}

@media only screen and (max-width: 767px) {
  #cate-ttl {
    height: 50px;
  }
}

#cate-ttl h2 {
  margin: 0;
  padding-top: 5px;
  font-size: 33px;
  font-family: "Roboto Condensed", sans-serif !important;
  letter-spacing: 0.1em;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 2.35;
  line-height: 1.45;
}

@media only screen and (max-width: 767px) {
  #cate-ttl h2 {
    padding-top: 11px;
    font-size: 20px;
  }
}

#cate-ttl h2 span {
  display: block;
  font-size: 13px;
  letter-spacing: 1em;
  font-weight: 400;
  position: relative;
  left: 0.5em;
}

@media only screen and (max-width: 767px) {
  #cate-ttl h2 span {
    display: inline-block;
    margin-left: 10px;
    font-size: 12px;
  }
}

#cate-ttl h2.ja-only {
  font-size: 28px;
  font-weight: 500;
  letter-spacing: 0.15em;
  padding-top: 20px;
}

@media only screen and (max-width: 767px) {
  #cate-ttl h2.ja-only {
    font-size: 18px;
    padding-top: 13px;
  }
}

#cate-ttl-nav {
  margin: 0;
  height: 40px;
  background-color: #c4c5c5;
  text-align: center;
  overflow: hidden;
  font-size: 12px;
  letter-spacing: 0.1em;
}

@media only screen and (max-width: 991px) {
  #cate-ttl-nav {
    letter-spacing: 0;
    font-size: 10px;
  }
}

#cate-ttl-nav a {
  display: block;
  color: #231916;
  line-height: 1.7;
  padding: 10px 3px;
  text-align: center;
}

#cate-ttl-nav a:hover {
  text-decoration: none;
  color: #fff;
}

@media only screen and (max-width: 991px) {
  #cate-ttl-nav a {
    font-size: 10px;
    line-height: 1.45;
    padding: 13px 3px;
  }
}

@media only screen and (max-width: 479px) {
  #cate-ttl-nav a {
    font-size: 9px;
    padding: 6px 3px 8px;
  }
}

@media only screen and (max-width: 479px) {
  #cate-ttl-nav .container {
    padding-left: 0;
    padding-right: 0;
  }
}

#cate-ttl-nav ul {
  width: 100%;
  height: 40px;
  margin: 0;
  padding: 0;
  list-style-type: none;
  display: table;
  table-layout: fixed;
}

#cate-ttl-nav ul li {
  display: table-cell;
  border-left: 1px solid #e9ebe8;
  position: relative;
  transition: color 400ms cubic-bezier(0.42, 0, 0.58, 1);
  z-index: 2;
  vertical-align: middle;
}

#cate-ttl-nav ul li:last-of-type {
  border-right: 1px solid #e9ebe8;
}

#cate-ttl-nav ul li:before {
  background: #2b71b8;
  display: block;
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 0%;
  z-index: -1;
  content: "";
  transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1);
}

#cate-ttl-nav ul li:hover:before {
  width: 100%;
}

#cate-ttl-nav ul li.active {
  background-color: #2b71b8;
  color: #fff;
}

#cate-ttl-nav ul li.active a {
  color: #fff;
}

@media only screen and (max-width: 479px) {
  #cate-ttl-nav ul li:last-of-type {
    border-right: none;
  }
}

#cate-ttl-nav.recruit {
  background-color: #2b71b8;
}

#cate-ttl-nav.recruit a {
  color: #fff;
}

@media only screen and (max-width: 991px) {
  #cate-ttl-nav.recruit a {
    font-size: 9px;
    padding: 0 3px;
  }
}

#cate-ttl-nav.recruit a:hover {
  color: #2b71b8;
}

#cate-ttl-nav.recruit ul li:before {
  background: #fff;
}

#cate-ttl-nav.recruit ul li.active {
  background-color: #fff;
  color: #2b71b8;
}

#cate-ttl-nav.recruit ul li.active a {
  color: #2b71b8;
}

#cate-ttl-nav .dropdown ul.dropdown-menu {
  display: none;
}

#cate-ttl-nav .dropdown.open ul.dropdown-menu {
  display: block;
  opacity: 1;
}

/* 1.11 Cate Main Visual
 * ------------------------------*/
#cate-main {
  width: 100%;
  height: 425px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: relative;
}

#cate-main.main-feature {
  height: 620px;
  background-image: url(../image/feature/bg-main.jpg);
}

#cate-main.main-feature .main-ttl-txt {
  margin-top: 245px;
}

@media only screen and (max-width: 767px) {
  #cate-main.main-feature .main-ttl-txt {
    margin-top: 150px;
  }
}

#cate-main.main-product-solution {
  height: 620px;
  background-image: url(../image/product-solution/bg-main.jpg);
}

#cate-main.main-product-solution .main-ttl-txt {
  margin-top: 200px;
}

@media only screen and (max-width: 767px) {
  #cate-main.main-product-solution .main-ttl-txt {
    margin-top: 120px;
  }
}

#cate-main.main-product {
  height: 500px;
  background-image: url(../image/product-solution/bg-main-product.png);
}

#cate-main.main-solution {
  height: 500px;
  background-image: url(../image/product-solution/bg-main-solution.jpg);
}

#cate-main.main-server {
  height: 500px;
  background-image: url(../image/product-solution/main_07.jpg);
}

#cate-main.main-fa-pc {
  height: 500px;
  background-image: url(../image/product-solution/bg-main-fa-pc.png);
}

#cate-main.main-pc-workstation {
  height: 500px;
  background-image: url(../image/product-solution/bg-main-pc-workstation.png);
}

#cate-main.main-storage {
  height: 500px;
  background-image: url(../image/product-solution/bg-main-storage.jpg);
}

#cate-main.main-research-lab {
  height: 500px;
  background-image: url(../image/product-solution/bg-main-research-lab.jpg?v=20220415);
}

#cate-main.main-report {
  background-image: url(../image/report/bg-main.jpg);
}

#cate-main.main-support {
  background-image: url(../image/support/bg-main.jpg);
}

#cate-main.main-case {
  background-image: url(../image/case/bg-main.jpg);
}

#cate-main.main-company {
  background-image: url(../image/company/bg-main.jpg?20200313);
}

#cate-main.main-task {
  height: 540px;
  background-image: url(../image/product-solution/bg-main-task.jpg);
}

#cate-main.main-info {
  background-image: url(../image/useful-info/bg-main-info.jpg);
}

#cate-main.main-recruit {
  height: 710px;
  background-image: url(../image/recruit/bg-main.jpg);
  background-repeat: repeat;
}

#cate-main.main-recruit .main-ttl-txt {
  margin-top: 80px;
  color: #2b71b8;
}

@media only screen and (max-width: 767px) {
  #cate-main.main-recruit .main-ttl-txt {
    margin-top: 30px;
  }
}

#cate-main.main-recruit .main-sub {
  color: #2b71b8;
}

#cate-main.main-recruit .main-bigtxt {
  margin-top: 0;
  font-size: 22px;
  color: #2b71b8;
}

@media only screen and (max-width: 991px) {
  #cate-main.main-recruit .main-bigtxt {
    font-size: 20px;
  }
}

@media only screen and (max-width: 767px) {
  #cate-main.main-recruit .main-bigtxt {
    font-size: 13px;
    line-height: 1.7;
  }
}

#cate-main.main-p2p {
  background-image: url(../image/product-solution/bg-main-factory.jpg);
}

#cate-main.main-p2p-top {
  background-image: url(../image/product-solution/bg-main-factory.jpg);
  height: 620px;
}

@media only screen and (max-width: 767px) {
  #cate-main.main-p2p-top {
    background-image: url(../image/product-solution/bg-main-factory-xs.jpg);
  }
}

#cate-main.main-p2p-top .main-ttl {
  height: 520px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
}

#cate-main.main-p2p-top .main-ttl .sub-blue {
  margin: 0 0 25px;
  padding: 12px 15px 10px;
  font-size: 24px;
  line-height: 1;
  font-weight: 600;
}

#cate-main.main-p2p-top .main-ttl .ttl-p2p {
  margin: 0 0 15px;
  font-size: 56px;
  font-weight: 600;
}

@media only screen and (max-width: 767px) {
  #cate-main.main-p2p-top .main-ttl {
    height: 380px;
  }
}

@media only screen and (max-width: 767px) {
  #cate-main.main-p2p-top .main-ttl-txt.jp-txt {
    padding-top: 0;
  }
}

@media only screen and (min-width: 768px) {
  #cate-main.main-p2p-top .main-ttl-txt.jp-txt {
    padding-top: 40px;
    text-transform: none !important;
  }
}

#cate-main.naka-main {
  height: 190px;
}

@media only screen and (max-width: 767px) {
  #cate-main.naka-main {
    height: 100px !important;
  }
}

#cate-main.naka-main.main-feature {
  background-image: url(../image/feature/bg-main-detail.jpg);
}

#cate-main.naka-main.main-report {
  background-image: url(../image/report/bg-main-detail.jpg);
}

#cate-main.naka-main.main-support {
  background-image: url(../image/support/bg-main-detail.jpg);
}

#cate-main.naka-main.main-case {
  background-image: url(../image/case/bg-main-detail.png);
}

#cate-main.naka-main.main-company {
  background-image: url(../image/company/bg-main-detail.jpg?20200313);
}

#cate-main.naka-main.main-recruit {
  height: 350px;
}

#cate-main.naka-main.main-recruit.new-graduate {
  background-image: url(../image/recruit/bg-main-new-graduate.jpg);
}

#cate-main.naka-main.main-recruit.mid-career {
  background-image: url(../image/recruit/bg-main-mid-career.jpg);
}

#cate-main.naka-main.main-recruit.message {
  background-image: url(../image/recruit/bg-main.jpg);
}

#cate-main.naka-main.main-recruit.interview {
  background-image: url(../image/recruit/bg-main-interview.jpg);
}

#cate-main.naka-main.main-recruit.benefit {
  color: #fff;
  background-image: url(../image/recruit/bg-main-benefit.jpg);
}

#cate-main.naka-main.main-recruit.faq {
  background-image: url(../image/recruit/bg-main-faq.jpg);
}

#cate-main.naka-main.main-recruit.news {
  background-image: url(../image/recruit/bg-main.jpg);
}

#cate-main.naka-main.main-recruit.form {
  background-image: url(../image/recruit/bg-main.jpg);
}

#cate-main.naka-main.main-recruit .main-ttl-txt {
  margin-top: 120px;
  color: #fff;
}

@media only screen and (max-width: 767px) {
  #cate-main.naka-main.main-recruit .main-ttl-txt {
    margin-top: 22px;
    font-size: 25px;
  }
}

#cate-main.naka-main.main-recruit .main-sub {
  color: #fff;
}

#cate-main .img {
  margin-top: 55px;
}

@media only screen and (max-width: 767px) {
  #cate-main .img {
    margin-top: 40px;
  }
}

#cate-main .main-ttl {
  text-align: center;
  margin-bottom: 25px;
}

#cate-main .main-ttl-txt {
  display: inline-block;
  margin: 150px 0 0;
  font-size: 68px;
  font-family: "Roboto Condensed", sans-serif !important;
  letter-spacing: 0.1em;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 2.35;
  line-height: 1.2;
  color: #fff;
}

@media only screen and (max-width: 767px) {
  #cate-main .main-ttl-txt {
    font-size: 35px;
  }
}

#cate-main .main-ttl-txt.small {
  font-size: 56px;
  margin-top: 52px;
}

@media only screen and (max-width: 767px) {
  #cate-main .main-ttl-txt.small {
    font-size: 25px;
    letter-spacing: 0.05em;
    margin-top: 22px;
  }
}

#cate-main .main-ttl-txt.small-jp {
  font-size: 45px;
  margin-top: 55px;
}

@media only screen and (max-width: 767px) {
  #cate-main .main-ttl-txt.small-jp {
    font-size: 22px;
    letter-spacing: 0.05em;
    margin-top: 25px;
  }
}

#cate-main .main-ttl-txt.jp-txt {
  font-family: inherit;
  font-size: 40px;
  margin-top: 0;
  padding-top: 25px;
}

@media only screen and (max-width: 991px) {
  #cate-main .main-ttl-txt.jp-txt {
    font-size: 32px;
  }
}

@media only screen and (max-width: 767px) {
  #cate-main .main-ttl-txt.jp-txt {
    font-size: 20px;
  }
}

#cate-main .main-ttl-txt.jp-txt .jp-p2p-txt {
  font-size: 32px;
}

@media only screen and (max-width: 991px) {
  #cate-main .main-ttl-txt.jp-txt .jp-p2p-txt {
    font-size: 25.6px;
  }
}

@media only screen and (max-width: 767px) {
  #cate-main .main-ttl-txt.jp-txt .jp-p2p-txt {
    font-size: 16px;
  }
}

#cate-main .main-ttl-box {
  border: 1px solid #fff;
  color: #fff;
  display: block;
  font-size: 14px;
  line-height: 2;
  margin: 20px auto 0;
  padding: 12px 15px;
  text-align: center;
  width: 340px;
}

@media only screen and (max-width: 767px) {
  #cate-main .main-ttl-box {
    font-size: 12px;
    padding: 4px 8px;
    width: auto;
  }
}

#cate-main .main-txt {
  display: inline-block;
  margin: 25px 0 10px;
  font-size: 56px;
  font-family: "Roboto Condensed", sans-serif !important;
  letter-spacing: 0.1em;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 2.35;
  line-height: 1;
  color: #fff;
}

@media only screen and (max-width: 767px) {
  #cate-main .main-txt {
    font-size: 25px;
  }
}

#cate-main .main-txt.jp-txt {
  font-family: inherit;
  font-size: 40px;
}

@media only screen and (max-width: 991px) {
  #cate-main .main-txt.jp-txt {
    font-size: 32px;
  }
}

#cate-main .main-sub {
  display: block;
  margin: 10px 0 35px;
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.08em;
}

#cate-main .main-bigtxt {
  margin-top: 135px;
  font-size: 24px;
  color: #fff;
  text-align: center;
  letter-spacing: 0.08em;
  line-height: 2;
}

@media only screen and (max-width: 767px) {
  #cate-main .main-bigtxt {
    font-size: 15px;
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 100px;
    text-align: left;
  }
}

#cate-main .main-smalltxt {
  font-size: 16px;
  color: #fff;
  text-align: center;
  letter-spacing: 0.08em;
}

#cate-main .anime-line {
  display: block;
  height: 2px;
  width: 0%;
  margin: 0;
  background-color: #fff;
  animation-name: line-animation;
  animation-duration: 2s;
  animation-timing-function: ease;
  animation-fill-mode: forwards;
}

@media only screen and (max-width: 767px) {
  #cate-main,
  #cate-main.main-feature,
  #cate-main.main-product-solution,
  #cate-main.main-product,
  #cate-main.main-solution,
  #cate-main.main-server,
  #cate-main.main-recruit,
  #cate-main.main-p2p,
  #cate-main.main-p2p-top {
    height: 425px;
  }
}

@media only screen and (max-width: 767px) {
  #cate-main .main-sub {
    margin-bottom: 25px;
    font-size: 12px;
    letter-spacing: 0;
  }
  #cate-main .main-smalltxt {
    font-size: 12px;
  }
}

/*-------------------------------
 * 2.PRODUCT-SOLUTION
 * ----------------------------*/
/*  2.1 Category top page
* ------------------------------*/
/***** 2.1.1 Main Visual *****/
/***** 2.1.2 Menu *****/
#pd-menu ul.pd-menu-list {
  width: 100%;
  padding: 0;
  margin: 0 0 20px;
  list-style-type: none;
  display: table;
  table-layout: fixed;
  border-collapse: separate;
}

#pd-menu ul.pd-menu-list li {
  display: table-cell;
  border-right: 10px solid #e9ebe8;
  border-left: 10px solid #e9ebe8;
  padding: 25px 20px 15px;
  margin: 0;
  background-color: #fff;
  color: #231916;
  position: relative;
}

#pd-menu ul.pd-menu-list.sectopm-company-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
#pd-menu ul.pd-menu-list.sectopm-company-menu li {
  display: flex !important;
  flex-direction: column;
  align-items: center;
}
#pd-menu ul.pd-menu-list.sectopm-company-menu li h3 {
  height: auto;
}
#pd-menu ul.pd-menu-list.sectopm-company-menu:after,
#pd-menu ul.pd-menu-list.sectopm-company-menu li {
  width: 100%;
  max-width: calc(32.33333% - 10px);
  border: none;
}
@media all and (max-width: 768px) {
  #pd-menu ul.pd-menu-list.sectopm-company-menu:after,
  #pd-menu ul.pd-menu-list.sectopm-company-menu li {
    max-width: calc(50% - 10px);
    margin-bottom: 0;
  }
}

/*.row-access.fs17 p {
  font-size: 17px;
}*/
.row-access.fs17 p + p {
  margin-top: 1em;
}
.row-access.fs17 .compliance-content {
  margin-bottom: 0;
}
.row-access.fs17 .compliance-content + .compliance-content {
  margin-top: 60px;
}
/*@media all and (max-width: 768px) {
  .row-access.fs17 p {
    font-size: 12px;
  }
}*/

#pd-menu ul.pd-menu-list li:hover {
  color: #fff;
  background-color: #2b71b8;
  transition: all 700ms;
}

#pd-menu ul.pd-menu-list li:hover h3,
#pd-menu ul.pd-menu-list li:hover h4,
#pd-menu ul.pd-menu-list li:hover p {
  color: #fff;
}

#pd-menu ul.pd-menu-list li .icon {
  display: block;
  width: 73px;
  height: 73px;
  margin: 0 auto;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

#pd-menu ul.pd-menu-list li a {
  display: block;
  color: #231916;
}

#pd-menu ul.pd-menu-list li a:hover {
  color: #fff;
  text-decoration: none;
}

#pd-menu ul.pd-menu-list li h3 {
  color: #2b71b8;
  font-family: "Roboto Condensed", sans-serif !important;
  font-size: 35px;
  font-weight: 700;
  height: 95px;
  letter-spacing: 0.08em;
  line-height: 1.15;
  margin: 16px 0 25px;
  overflow: hidden;
  text-align: center;
  text-transform: uppercase;
}

@media only screen and (max-width: 1199px) {
  #pd-menu ul.pd-menu-list li h3 {
    font-size: 29px;
    height: 60px;
  }
}

#pd-menu ul.pd-menu-list li h3.h-high {
  height: 105px;
}

#pd-menu ul.pd-menu-list li h3.f34 {
  font-size: 34px;
}

@media only screen and (max-width: 1199px) {
  #pd-menu ul.pd-menu-list li h3.f34 {
    font-size: 27px;
  }
}

@media only screen and (max-width: 991px) {
  #pd-menu ul.pd-menu-list li h3.f34 {
    font-size: 20px;
  }
}

@media only screen and (max-width: 767px) {
  #pd-menu ul.pd-menu-list li h3.f34 {
    font-size: 25px;
  }
}

#pd-menu ul.pd-menu-list li h3.f64 {
  height: 110px;
  font-size: 64px;
}

@media only screen and (max-width: 1199px) {
  #pd-menu ul.pd-menu-list li h3.f64 {
    font-size: 54px;
  }
}

@media only screen and (max-width: 991px) {
  #pd-menu ul.pd-menu-list li h3.f64 {
    font-size: 40px;
  }
}

@media only screen and (max-width: 767px) {
  #pd-menu ul.pd-menu-list li h3.f64 {
    font-size: 40px;
  }
}

#pd-menu ul.pd-menu-list li h3.jp {
  font-size: 29px;
  line-height: 1.4;
}

#pd-menu ul.pd-menu-list li h3 span {
  display: block;
  margin-top: 10px;
  font-size: 15px;
  font-weight: normal;
}

#pd-menu ul.h-fixed.pd-menu-list li {
  padding-bottom: 30px;
}

@media only screen and (max-width: 991px) {
  #pd-menu ul.h-fixed.pd-menu-list li {
    padding-bottom: 15px;
  }
}

/* PRODUCT-SOLUTION */
#pd-menu ul.pd-menu-list li .icon.product {
  background-image: url(../image/product-solution/pict-product-blue.png);
}

#pd-menu ul.pd-menu-list li .icon.solution {
  background-image: url(../image/product-solution/pict-solution-blue.png);
}

#pd-menu ul.pd-menu-list li .icon.kadai {
  background-image: url(../image/product-solution/pict-kadai-blue.png);
}

#pd-menu ul.pd-menu-list li:hover .icon.product {
  background-image: url(../image/product-solution/pict-product-white.png);
}

#pd-menu ul.pd-menu-list li:hover .icon.solution {
  background-image: url(../image/product-solution/pict-solution-white.png);
}

#pd-menu ul.pd-menu-list li:hover .icon.kadai {
  background-image: url(../image/product-solution/pict-kadai-white.png);
}

/* SUPPORT */
#pd-menu ul.pd-menu-list li .icon.system {
  background-image: url(../image/support/pict-system-blue.png);
}

#pd-menu ul.pd-menu-list li .icon.faq {
  background-image: url(../image/support/pict-faq-blue.png);
}

#pd-menu ul.pd-menu-list li .icon.download {
  background-image: url(../image/support/pict-download-blue.png);
}

#pd-menu ul.pd-menu-list li .icon.contact {
  background-image: url(../image/support/pict-contact-blue.png);
}

#pd-menu ul.pd-menu-list li:hover .icon.system {
  background-image: url(../image/support/pict-system-white.png);
}

#pd-menu ul.pd-menu-list li:hover .icon.faq {
  background-image: url(../image/support/pict-faq-white.png);
}

#pd-menu ul.pd-menu-list li:hover .icon.download {
  background-image: url(../image/support/pict-download-white.png);
}

#pd-menu ul.pd-menu-list li:hover .icon.contact {
  background-image: url(../image/support/pict-contact-white.png);
}

/* FEATURE */
#pd-menu ul.pd-menu-list li .icon.reason {
  background-image: url(../image/feature/pict-reason-blue.png);
}

#pd-menu ul.pd-menu-list li .icon.guidance {
  background-image: url(../image/feature/pict-guidance-blue.png);
}

#pd-menu ul.pd-menu-list li .icon.quality {
  background-image: url(../image/feature/pict-quality-blue.png);
}

#pd-menu ul.pd-menu-list li .icon.record {
  background-image: url(../image/feature/pict-record-blue.png);
}

#pd-menu ul.pd-menu-list li:hover .icon.reason {
  background-image: url(../image/feature/pict-reason-white.png);
}

#pd-menu ul.pd-menu-list li:hover .icon.guidance {
  background-image: url(../image/feature/pict-guidance-white.png);
}

#pd-menu ul.pd-menu-list li:hover .icon.quality {
  background-image: url(../image/feature/pict-quality-white.png);
}

#pd-menu ul.pd-menu-list li:hover .icon.record {
  background-image: url(../image/feature/pict-record-white.png);
}

/* COMPANY */
#pd-menu ul.pd-menu-list li .icon.message {
  background-image: url(../image/company/pict-message-blue.svg);
}

#pd-menu ul.pd-menu-list li .icon.company {
  background-image: url(../image/company/pict-company-blue.svg);
}

#pd-menu ul.pd-menu-list li .icon.vision {
  background-image: url(../image/company/pict-vision-blue.svg);
}

#pd-menu ul.pd-menu-list li .icon.history {
  background-image: url(../image/company/pict-history-blue.svg);
}

#pd-menu ul.pd-menu-list li .icon.officer {
  background-image: url(../image/company/pict-officer-blue.svg);
}

#pd-menu ul.pd-menu-list li .icon.compliance {
  background-image: url(../image/company/pict-compliance-blue.svg);
}

#pd-menu ul.pd-menu-list li:hover .icon.message {
  background-image: url(../image/company/pict-message-white.svg);
}

#pd-menu ul.pd-menu-list li:hover .icon.company {
  background-image: url(../image/company/pict-company-white.svg);
}

#pd-menu ul.pd-menu-list li:hover .icon.vision {
  background-image: url(../image/company/pict-vision-white.svg);
}

#pd-menu ul.pd-menu-list li:hover .icon.history {
  background-image: url(../image/company/pict-history-white.svg);
}
#pd-menu ul.pd-menu-list li:hover .icon.officer {
  background-image: url(../image/company/pict-officer-white.svg);
}
#pd-menu ul.pd-menu-list li:hover .icon.compliance {
  background-image: url(../image/company/pict-compliance-white.svg);
}

/* USEFUL INFO*/
#pd-menu ul.pd-menu-list li .icon.report {
  background-image: url(../image/useful-info/pict-report-blug.png);
}

#pd-menu ul.pd-menu-list li:hover .icon.report {
  background-image: url(../image/useful-info/pict-report-white.png);
}

#pd-menu ul.pd-menu-list li .icon.blog {
  background-image: url(../image/useful-info/pict-blog-blug.png);
}

#pd-menu ul.pd-menu-list li:hover .icon.blog {
  background-image: url(../image/useful-info/pict-blog-white.png);
}

#pd-menu ul.pd-menu-list li h4 {
  font-size: 14px;
  text-align: center;
  font-weight: normal;
  line-height: 1.8;
}

#pd-menu ul.pd-menu-list li h4.fixed {
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  bottom: 20px;
}

#pd-menu ul.pd-menu-list li p {
  letter-spacing: 0.05em;
}

@media only screen and (max-width: 1199px) {
  #pd-menu ul.pd-menu-list li h3.h-high {
    height: 90px;
  }
  #pd-menu ul.pd-menu-list li h4 {
    font-size: 12px;
  }
}

@media only screen and (max-width: 991px) {
  #pd-menu ul.pd-menu-list li h3 {
    height: 44px;
    font-size: 20px;
  }
  #pd-menu ul.pd-menu-list li h3.h-high {
    height: 70px;
  }
  #pd-menu ul.pd-menu-list li h3.jp {
    font-size: 22px;
  }
  #pd-menu ul.pd-menu-list li h4.fixed {
    position: relative;
    top: 0;
  }
}

@media only screen and (max-width: 767px) {
  #pd-menu ul.pd-menu-list {
    display: block;
  }
  #pd-menu ul.pd-menu-list li {
    display: block;
    margin-bottom: 20px;
    padding: 20px 15px 15px;
    border: none;
  }
  #pd-menu ul.pd-menu-list li h3 {
    height: auto;
    margin: 20px 0;
    font-size: 25px;
  }
  #pd-menu ul.pd-menu-list li h3.h-high {
    height: auto;
  }
  #pd-menu ul.pd-menu-list li h3.jp {
    font-size: 15px;
  }
  #pd-menu ul.pd-menu-list li h4 {
    font-size: 14px;
  }
}

/***** 2.1.3 Case *****/
#pd-case .case-cont {
  margin-top: 65px;
  width: 100%;
  display: table;
  /*table-layout: fixed;*/
  border: 2px solid #eaebe9;
}

#pd-case .case-cont a {
  color: #231916;
}

#pd-case .case-cont a:hover {
  color: #231916;
  text-decoration: none;
}

#pd-case .case-cont:hover {
  border: 2px solid #2b71b8;
  outline: 1px solid #2b71b8;
}

#pd-case .case-box p {
  margin-bottom: 20px;
}

#pd-case .case-box p:last-of-type {
  margin-bottom: 0;
}

#pd-case .case-box {
  display: table-cell;
  width: 50%;
  padding: 40px 50px;
  vertical-align: middle;
}

#pd-case .bg-gray {
  background-color: #eaebe9;
}

@media only screen and (max-width: 991px) {
  #pd-case .case-cont {
    margin-top: 20px;
  }
  #pd-case .case-box {
    padding: 20px;
  }
  #pd-case .case-box p {
    margin-bottom: 10px;
  }
}

@media only screen and (max-width: 767px) {
  #pd-case .case-cont {
    display: block;
  }
  #pd-case .case-box {
    width: 100%;
    display: block;
  }
}

/***** 2.1.4 Circle Box text *****/
#pd-reason .btn-more {
  margin-top: 55px;
}

#pd-reason .circle-box {
  margin: 0 auto 30px;
  padding: 18px 0;
  font-size: 37px;
  line-height: 1;
  color: #fff;
  width: 210px;
  height: 210px;
  border-radius: 105px;
  background-color: #2b71b8;
  box-sizing: border-box;
  text-align: center;
}

#pd-reason .circle-box .txt-cap {
  font-size: 11px;
  font-family: "Roboto Condensed", sans-serif !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

#pd-reason .circle-box .num {
  display: block;
  margin: 0 auto 20px;
  font-size: 44px;
  font-weight: 600;
  letter-spacing: 0.03em;
}

#pd-reason h4 {
  margin: 0;
  font-size: 16px;
  letter-spacing: 0.08em;
  line-height: 1.8;
  text-align: center;
}

@media only screen and (max-width: 991px) {
  #pd-reason .circle-box {
    margin: 0 auto 20px;
    padding: 18px 0;
    font-size: 22px;
    width: 140px;
    height: 140px;
    border-radius: 70px;
  }
  #pd-reason .circle-box .num {
    margin-bottom: 10px;
    font-size: 33px;
  }
}

@media only screen and (max-width: 767px) {
  #pd-reason h4 {
    font-size: 13px;
    text-align: left;
    margin-bottom: 20px;
  }
}

/***** 2.1.5 Chigau *****/
#pd-chigau .row {
  margin-left: -15px;
  margin-right: -15px;
}

@media only screen and (min-width: 992px) {
  #pd-chigau .row {
    margin-left: -40px;
    margin-right: -40px;
  }
}

#pd-chigau .col-sm-4,
#pd-chigau .col-sm-6 {
  padding-top: 15px;
}

@media only screen and (min-width: 992px) {
  #pd-chigau .col-sm-4,
  #pd-chigau .col-sm-6 {
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 40px;
  }
}

#pd-chigau h3 {
  margin: 0 0 5px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: end;
  align-items: flex-end;
  font-size: 18px;
  letter-spacing: 0.05em;
  line-height: 1.7;
  margin-bottom: 25px;
}

#pd-chigau h3 .num {
  display: inline-block;
  margin-right: 15px;
  font-size: 58px;
  letter-spacing: 0.03em;
  color: #2b71b8;
  font-weight: 600;
  line-height: 1;
}

@media only screen and (max-width: 767px) {
  #pd-chigau .col-sm-4 {
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 15px;
  }
  #pd-chigau h3 {
    font-size: 15px;
  }
  #pd-chigau h3 .num {
    font-size: 45px;
  }
}

/***** 2.1.6 Item *****/
.item-sub-header {
  margin: 0;
  height: 35px;
  line-height: 35px;
  background-color: #2b71b8;
  color: #fff;
  font-size: 16px;
  text-align: center;
}

@media only screen and (max-width: 767px) {
  .item-sub-header {
    font-size: 13px;
  }
}

#gpu-table,
#mic-table {
  margin-bottom: 30px;
}

@media only screen and (min-width: 768px) {
  #gpu-table dt,
  #mic-table dt {
    width: 60%;
  }
}

@media only screen and (min-width: 768px) {
  #gpu-table dl dt,
  #gpu-table dl dd,
  #mic-table dl dt,
  #mic-table dl dd {
    padding-top: 5px;
    padding-bottom: 5px;
  }
}

@media only screen and (min-width: 1200px) {
  #gpu-table dl dt,
  #gpu-table dl dd,
  #mic-table dl dt,
  #mic-table dl dd {
    padding-top: 10px;
    padding-bottom: 10px;
  }
}

#gpu-table {
  margin-bottom: 20px;
}

@media only screen and (max-width: 767px) {
  #gpu-table {
    margin-bottom: 40px;
  }
}

.item-gpu-ttl {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: end;
  align-items: flex-end;
}

.item-gpu-ttl small {
  display: block;
}

.item-gpu-ttl h3 {
  margin-left: 16px;
  margin-bottom: 0;
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .item-gpu-ttl h3 {
    font-size: 15px;
  }
}

@media only screen and (min-width: 768px) {
  .item-gpu-ttl h3 {
    font-size: 16px;
  }
}

@media only screen and (min-width: 992px) {
  .item-gpu-ttl h3 {
    font-size: 18px;
  }
}

.item-gpu-ttl h3 small {
  margin-bottom: 5px;
  font-weight: 400;
}

.item-gpu-txt {
  margin-top: 30px;
  margin-bottom: 30px;
}

@media only screen and (min-width: 768px) {
  .item-gpu-txt {
    min-height: 170px;
  }
}

@media only screen and (min-width: 992px) {
  .item-gpu-txt {
    min-height: 148px;
  }
}

@media only screen and (min-width: 1200px) {
  .item-gpu-txt {
    min-height: 125px;
  }
}

.item-square-ttl {
  padding-left: 1.33333em;
  padding-bottom: 15px;
  letter-spacing: 0.1em;
  margin-bottom: 30px;
  position: relative;
  border-bottom: 1px solid #9fa0a0;
}

@media only screen and (max-width: 767px) {
  .item-square-ttl {
    font-size: 15px;
  }
}

@media only screen and (min-width: 768px) {
  .item-square-ttl {
    font-size: 16px;
  }
}

@media only screen and (min-width: 992px) {
  .item-square-ttl {
    font-size: 18px;
  }
}

.item-square-ttl:before {
  content: "■";
  color: #2b71b8;
  position: absolute;
  left: 0;
}

ul.item-list {
  width: 100%;
  margin: 0;
  padding: 0;
  list-style-type: none;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: stretch;
  align-items: stretch;
}

ul.item-list li {
  display: -ms-flexbox;
  display: flex;
  margin: 0 40px 0 0;
  padding: 20px 0;
  width: 47%;
  border-bottom: 1px solid #dbdcdc;
}

ul.item-list li:nth-of-type(1),
ul.item-list li:nth-of-type(2) {
  border-top: 1px solid #dbdcdc;
}

ul.item-list li:nth-child(2n) {
  margin: 0;
}

ul.item-list li strong {
  font-weight: 500;
  display: inline-block;
  margin-bottom: 10px;
}

@media only screen and (max-width: 767px) {
  ul.item-list li strong {
    font-size: 15px;
  }
}

@media only screen and (min-width: 768px) {
  ul.item-list li strong {
    font-size: 16px;
  }
}

@media only screen and (min-width: 992px) {
  ul.item-list li strong {
    font-size: 18px;
  }
}

ul.item-list.wide li {
  width: 100%;
  margin-right: 0;
}

ul.item-list.wide li:nth-of-type(2) {
  border-top: none;
}

ul.item-list.list-full li {
  margin: 0;
  width: 100%;
}

ul.item-list.list-full li:nth-child(2) {
  border-top: none;
}

@media only screen and (max-width: 991px) {
  ul.item-list li {
    margin-right: 20px;
  }
}

@media only screen and (max-width: 767px) {
  ul.item-list li {
    width: 100%;
    margin: 0;
    padding: 10px 0;
  }
  ul.item-list li:nth-of-type(2) {
    border-top: none;
  }
}

/* 2.1.6.1 Item-pict */
.pd-item-pict {
  position: absolute;
  top: -53px;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 100;
}

.pd-item-pict:hover {
  opacity: 0.94;
}

@media only screen and (max-width: 767px) {
  .pd-item-pict {
    position: relative;
    top: 0;
    margin-bottom: 20px;
  }
}

/* 2.1.6.2 item-box */
.pd-item-box {
  background-color: #fff;
  border: 1px solid #9e9e9f;
  padding-top: 15px;
  margin-top: 40px;
  border-box: box-sizing;
  position: relative;
  cursor: pointer;
}

@media only screen and (max-width: 991px) {
  .pd-item-box {
    text-align: center;
  }
}

.pd-item-box:hover {
  border: 1px solid #2b71b8;
  outline: 2px solid #2b71b8;
}

.pd-item-box a {
  color: #231916;
  text-decoration: none;
}

.pd-item-box .box {
  padding: 0 15px 0 30px;
  overflow: hidden;
}

@media only screen and (min-width: 992px) {
  .pd-item-box .box {
    height: 240px;
  }
}

@media only screen and (min-width: 1200px) {
  .pd-item-box .box {
    /*height: 200px;*/
    height: 230px;
  }
}

@media only screen and (max-width: 991px) {
  .pd-item-box .box {
    height: auto;
    min-height: 1px;
    padding: 0 30px;
  }
}

.pd-item-box .img {
  float: left;
  max-width: 220px;
  max-height: 150px;
  margin: 20px 0 0 20px;
}

@media only screen and (max-width: 991px) {
  .pd-item-box .img {
    float: none;
    margin: 0 auto 15px;
  }
}

.pd-item-box .icon-category {
  display: inline-block;
  margin: 0 0 15px;
  padding-left: 8px;
  padding-right: 8px;
  min-width: 88px;
  height: 18px;
  line-height: 17px;
  font-size: 11px;
  text-align: center;
  background-color: #cdcdcd;
  border-radius: 4px;
}

@media only screen and (max-width: 991px) {
  .pd-item-box .icon-category {
    display: block;
    margin-top: 10px;
    height: auto;
    padding: 3px 5px 4px;
    line-height: 1.45;
  }
}

.pd-item-box h4 {
  margin: 0 0 15px;
  font-size: 18.6px;
  font-weight: normal;
  letter-spacing: 0.03em;
  line-height: 1.7;
}

@media only screen and (max-width: 1199px) {
  .pd-item-box h4 {
    font-size: 15px;
  }
}

@media only screen and (max-width: 767px) {
  .pd-item-box h4 {
    margin: 0 15px 15px;
    min-height: 1px;
  }
}

@media only screen and (min-width: 992px) {
  .pd-item-box h4 {
    min-height: 130px;
  }
}

.pd-item-box h4 span {
  display: inline-block;
  margin-bottom: 5px;
  font-size: 15px;
  letter-spacing: 0;
}

@media only screen and (max-width: 1199px) {
  .pd-item-box h4 span {
    font-size: 13px;
  }
}

.pd-item-box ul.label-list {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

@media only screen and (min-width: 992px) {
  .pd-item-box ul.label-list {
    width: 200px;
  }
}

@media only screen and (min-width: 1200px) {
  .pd-item-box ul.label-list {
    width: 250px;
  }
}

@media only screen and (max-width: 991px) {
  .pd-item-box ul.label-list {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    margin: auto;
  }
}

.pd-item-box ul.label-list li {
  width: 50px;
  height: 18px;
  list-style-type: none;
  line-height: 18px;
  margin: 0 8px 8px 0;
  padding: 0;
  float: left;
  font-size: 11px;
  text-align: center;
  color: #fff;
  background-color: #2b71b8;
  border-radius: 4px;
}

.pd-item-box ul.label-list li.red {
  background-color: #e50012;
}

.pd-item-box ul.label-list li.light-blue {
  background-color: #2ca6e0;
}

.pd-item-box ul.label-list li.blue {
  background-color: #036eb7;
}

.pd-item-box ul.label-list li.dark-blue {
  background-color: #182987;
}

.pd-item-box ul.label-list li.orange {
  background-color: #f7b52c;
}

.pd-item-box ul.label-list li.green {
  background-color: #8dc21f;
}

.pd-item-box ul.label-list li.label-01 {
  background-color: #dd6908;
}

.pd-item-box ul.label-list li.label-02 {
  background-color: #edda00;
}

.pd-item-box ul.label-list li.label-03 {
  background-color: #e5a621;
}

.pd-item-box ul.label-list li.label-04 {
  background-color: #d83373;
}

.pd-item-box ul.label-list li.label-05 {
  background-color: #ced500;
}

.pd-item-box ul.label-list li.label-06 {
  background-color: #76b322;
}

.pd-item-box ul.label-list li.label-07 {
  background-color: #009e48;
}

.pd-item-box ul.label-list li.label-08 {
  background-color: #1d6d47;
}

.pd-item-box ul.label-list li.label-09 {
  background-color: #e50011;
}

.pd-item-box ul.label-list li.label-10 {
  background-color: #4fb6b0;
}

.pd-item-box ul.label-list li.label-11 {
  background-color: #2370b2;
}

.pd-item-box ul.label-list li.label-12 {
  background-color: #414c98;
}

.pd-item-box ul.label-list li.label-13 {
  background-color: #75408e;
}

.pd-item-box ul.label-list:before,
.pd-item-box ul.label-list:after {
  content: " ";
  display: table;
}

.pd-item-box ul.label-list:after {
  clear: both;
}

.pd-item-box table {
  clear: both;
  width: 100%;
  margin: 10px 0 0 0;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 12px;
  line-height: 1.6;
}

.pd-item-box table th {
  width: 33%;
  padding: 4px 10px;
  background-color: #2b71b8;
  font-weight: normal;
  color: #fff;
  text-align: center;
  border-right: 1px solid #9e9e9f;
}

.pd-item-box table td {
  width: 33%;
  height: 100px;
  padding: 10px;
  text-align: center;
  background-color: #f9fafa;
  border-right: 1px solid #9e9e9f;
  overflow: hidden;
}

.pd-item-box table th:last-of-type,
.pd-item-box table td:last-of-type {
  border: none;
}

@media only screen and (max-width: 991px) {
  .pd-item-box table td {
    height: auto;
  }
}

.pd-item-box .point-box {
  display: table;
  width: 100%;
  height: 125px;
  margin: 0 0 20px;
  padding: 10px 20px;
  background-color: #e9ebe8;
  font-size: 13px;
  letter-spacing: 0.08em;
  line-height: 1.8;
  border-left: 20px solid #fff;
  border-right: 20px solid #fff;
}

.pd-item-box .point-box div {
  display: table-cell;
  text-align: left;
  vertical-align: middle;
}

.pd-item-box .point-box div.sub {
  width: 55px;
  text-align: center;
}

.pd-item-box .point-box div.sub p {
  font-size: 14px !important;
}

.pd-item-box .point-box ol,
.pd-item-box .point-box p {
  margin: 0 !important;
}

@media only screen and (max-width: 1199px) {
  .pd-item-box .point-box {
    height: 160px;
  }
  .pd-item-box .point-box div.sub p {
    font-size: 13px !important;
  }
}

@media only screen and (max-width: 991px) {
  .pd-item-box .point-box {
    margin-top: 20px;
    height: auto;
  }
}

@media only screen and (max-width: 767px) {
  .pd-item-box .point-box {
    display: block;
    padding: 10px 15px;
    font-size: 12px;
    letter-spacing: 0;
  }
  .pd-item-box .point-box div {
    display: block;
  }
  .pd-item-box .point-box div.sub {
    width: auto;
    text-align: left;
    padding-bottom: 8px;
    margin-bottom: 8px;
    border-bottom: 1px dashed #999;
  }
  .pd-item-box .point-box div.sub p {
    font-size: 12px !important;
  }
  .pd-item-box .point-box ol {
    margin-top: 5px !important;
    margin-left: -18px !important;
  }
}

/* 2.1.6.3 item-graybox */
.pd-item-graybox {
  /*padding-top: 40px;*/
  margin-top: 40px;
  background-color: #eaebe9;
  color: #231916;
}

.pd-item-graybox:hover {
  outline: 3px solid #2b71b8;
}

@media only screen and (max-width: 767px) {
  .pd-item-graybox {
    margin-top: 20px;
  }
}

.pd-item-graybox a {
  display: block;
  color: #231916;
}

.pd-item-graybox a:hover {
  /*color: #fff;*/
  text-decoration: none;
}

/*.pd-item-graybox:hover {
    color: #fff;
    background-color: $brand-primary;
    -webkit-transition: 0.7s;
	-moz-transition: 0.7s;
	-o-transition: 0.7s;
	transition: 0.7s;
}*/
.pd-item-graybox:hover figure i {
  -ms-transform: translateY(0) translateX(0) scale(1);
  transform: translateY(0) translateX(0) scale(1);
  transition: all 0.35s;
  opacity: 1;
  filter: alpha(opacity=100);
}

.pd-item-graybox figure i {
  width: 100%;
  height: 100%;
  position: absolute;
  padding: 0;
  top: 0;
  left: 0;
  z-index: 10;
  display: block;
  background: #2393c8 url(../image/zoom.png) center center no-repeat;
  background: rgba(8, 106, 175, 0.6) url(../image/zoom.png) center center
    no-repeat;
  font-weight: normal;
  -ms-transform: translateY(0) translateX(0) scale(0.25);
  transform: translateY(0) translateX(0) scale(0.25);
  transition: all 0.35s;
  opacity: 0;
  filter: alpha(opacity=0);
}

.pd-item-graybox .img-size {
  height: 200px;
  position: relative;
  overflow: hidden;
  background-color: #fff;
  border-top: 2px solid #eaebe9;
  border-left: 2px solid #eaebe9;
  border-right: 2px solid #eaebe9;
}

.pd-item-graybox:hover .img-size {
  border-top: 2px solid #fff;
  border-left: 2px solid #fff;
  border-right: 2px solid #fff;
}

.pd-item-graybox .img {
  max-width: 240px;
  max-height: 150px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 0;
}

@media only screen and (max-width: 1199px) {
  .pd-item-graybox .img {
    max-width: 200px;
  }
}

@media only screen and (max-width: 991px) {
  .pd-item-graybox .img {
    max-width: 150px;
  }
}

@media only screen and (max-width: 767px) {
  .pd-item-graybox .img-size {
    height: auto;
    padding: 20px 10px;
  }
  .pd-item-graybox .img {
    position: relative;
  }
  .pd-item-graybox .img {
    max-width: 240px;
  }
}

.pd-item-graybox h4 {
  width: 300px;
  height: 108px;
  margin: 0;
  font-size: 15px;
  letter-spacing: 0.05em;
  text-align: center;
  padding: 12px;
  line-height: 1.4;
  display: table-cell;
  vertical-align: middle;
  overflow: hidden;
}

.pd-item-graybox h4 span {
  font-size: 11px;
  font-weight: normal;
}

@media only screen and (max-width: 991px) {
  .pd-item-graybox h4 {
    font-size: 13px;
    height: 114px;
  }
}

@media only screen and (max-width: 767px) {
  .pd-item-graybox h4 {
    width: 100%;
    height: auto;
    display: block;
  }
}

/* 2.2 Detail page
 * ------------------------------*/
/***** 2.2.1 Top detail *****/
#pd-top-detail .boxW {
  padding: 40px 40px 30px 40px;
  position: relative;
  overflow: hidden;
}

@media only screen and (max-width: 991px) {
  #pd-top-detail .boxW {
    padding: 30px;
  }
}

@media only screen and (max-width: 767px) {
  #pd-top-detail .boxW {
    padding: 20px 15px;
  }
}

#pd-top-detail h2 {
  font-size: 25px;
  margin: 0 0 50px;
  font-weight: normal;
  letter-spacing: 0.03em;
  line-height: 1.5;
}

#pd-top-detail h2 span {
  display: inline-block;
  margin-bottom: 5px;
  font-size: 20px;
  letter-spacing: 0;
}

#pd-top-detail .img {
  width: auto;
  height: auto;
  margin: 30px auto;
  display: block;
  max-height: 220px;
}

@media only screen and (max-width: 991px) {
  #pd-top-detail .img {
    margin: 10px auto 15px;
    max-height: 225px;
  }
}

@media only screen and (max-width: 767px) {
  #pd-top-detail .img {
    max-width: 220px;
    max-height: 220px;
  }
}

@media only screen and (max-width: 991px) {
  #pd-top-detail h2 {
    font-size: 18px;
    margin-bottom: 20px;
  }
  #pd-top-detail h2 span {
    font-size: 15px;
  }
}

@media only screen and (max-width: 767px) {
  #pd-top-detail h2 {
    font-size: 15px;
    text-align: center;
  }
  #pd-top-detail h2 span {
    font-size: 13px;
  }
}

#pd-top-detail .btn-box {
  width: 92%;
  margin: 0;
  position: relative;
  overflow: hidden;
}

@media only screen and (max-width: 1199px) {
  #pd-top-detail .btn-box {
    width: 100%;
  }
}

#pd-top-detail .btn-box ul.list {
  width: 100%;
  margin: 0;
  padding: 0;
  list-style-type: none;
}

#pd-top-detail .btn-box ul.list li {
  float: left;
  width: 49%;
  margin: 0 9px 9px 0;
  height: 70px;
  line-height: 67px;
  text-align: center;
  overflow: hidden;
  font-size: 15px;
  letter-spacing: 0.1em;
  border: 1px solid #9e9e9f;
  position: relative;
  transition: color 400ms cubic-bezier(0.42, 0, 0.58, 1);
  z-index: 2;
  background-color: #2b71b8;
}

#pd-top-detail .btn-box ul.list li.blue {
  background-color: #2b71b8;
}

#pd-top-detail .btn-box ul.list li.white {
  background-color: #fff;
}

#pd-top-detail .btn-box ul.list li:last-of-type {
  margin-right: 0;
}

#pd-top-detail .btn-box ul.list li a {
  display: block;
  color: #fff;
}

#pd-top-detail .btn-box ul.list li.single {
  width: 100%;
}

#pd-top-detail .btn-box ul.list li.blue a {
  color: #fff;
}

#pd-top-detail .btn-box ul.list li.white a {
  color: #231916;
}

#pd-top-detail .btn-box ul.list li a:hover {
  text-decoration: none;
  color: #231916;
}

#pd-top-detail .btn-box ul.list li.blue a:hover {
  color: #231916;
}

#pd-top-detail .btn-box ul.list li.white a:hover {
  color: #fff;
}

#pd-top-detail .btn-box ul.list li:before {
  background-color: #2b71b8;
  display: block;
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 0%;
  z-index: -1;
  content: "";
  transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
}

#pd-top-detail .btn-box ul.list li.blue:before {
  background-color: #fff;
}

#pd-top-detail .btn-box ul.list li.white:before {
  background-color: #2b71b8;
}

#pd-top-detail .btn-box ul.list li:hover:before {
  width: 100%;
}

#pd-top-detail .btn-box ul.list:before,
#pd-top-detail .btn-box ul.list:after {
  content: " ";
  display: table;
}

#pd-top-detail .btn-box ul.list:after {
  clear: both;
}

@media only screen and (max-width: 1199px) {
  #pd-top-detail .btn-box ul.list li {
    width: 48.8%;
  }
}

@media only screen and (max-width: 991px) {
  #pd-top-detail .btn-box ul.list li {
    width: 48%;
    height: 50px;
    line-height: 47px;
  }
}

@media only screen and (max-width: 767px) {
  #pd-top-detail .btn-box ul.list li {
    font-size: 12px;
  }
}

#pd-top-detail .btn-box dl.list {
  width: 100%;
  height: 70px;
  margin: 0;
  border: 1px solid #9e9e9f;
  display: table;
  border-collapse: collapse;
}

#pd-top-detail .btn-box dl.list p {
  margin-top: 7px;
}

#pd-top-detail .btn-box dl.list dt {
  width: 70px;
  height: 70px;
  margin: 0;
  display: table-cell;
  background-color: #2b71b8;
  text-align: center;
  vertical-align: middle;
  border-right: 1px solid #9e9e9f;
}

#pd-top-detail .btn-box dl.list dd {
  margin: 0;
  padding-left: 18px;
  padding-right: 18px;
  display: table-cell;
  vertical-align: middle;
}

/***** 2.2.2 Item detail *****/
.pd-item-detail .boxW {
  padding: 60px 70px;
}

@media only screen and (max-width: 991px) {
  .pd-item-detail .boxW {
    padding: 30px;
  }
}

@media only screen and (max-width: 767px) {
  .pd-item-detail .boxW {
    padding: 20px 15px;
  }
}

.pd-item-detail h2 {
  margin: 0;
  padding: 7px 15px 8px;
  font-size: 18px;
  line-height: 1.45;
  color: #fff;
  letter-spacing: 0.08em;
  text-align: center;
  background-color: #2b71b8;
}

@media only screen and (max-width: 767px) {
  .pd-item-detail h2 {
    font-size: 15px;
  }
}

/***** 2.2.3 Tokucho *****/
#pd-tokucho ul.list {
  width: 100%;
  margin: 0;
  padding: 0;
  list-style-type: none;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: stretch;
  align-items: stretch;
}

#pd-tokucho ul.list li {
  display: -ms-flexbox;
  display: flex;
  /*align-items:center;*/
  margin: 0 40px 0 0;
  padding: 20px 0;
  width: 47%;
  border-bottom: 1px solid #dbdcdc;
}

#pd-tokucho ul.list li:nth-of-type(1),
#pd-tokucho ul.list li:nth-of-type(2) {
  border-top: 1px solid #dbdcdc;
}

#pd-tokucho ul.list li:nth-child(2n) {
  margin: 0;
}

#pd-tokucho ul.list li strong {
  font-weight: 500;
  display: inline-block;
  margin-bottom: 10px;
}

@media only screen and (max-width: 991px) {
  #pd-tokucho ul.list li {
    margin-right: 20px;
  }
}

@media only screen and (max-width: 767px) {
  #pd-tokucho ul.list li {
    width: 100%;
    margin: 0;
    padding: 10px 0;
  }
  #pd-tokucho ul.list li:nth-of-type(2) {
    border-top: none;
  }
}

/***** 2.2.4 Shiyo *****/
#pd-shiyo table {
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 13px;
  width: 100%;
}

#pd-shiyo table th {
  background-color: #f9f9f9;
  border: 1px solid #9e9e9f;
  font-weight: normal;
  padding: 1px 15px;
  text-align: center;
}

#pd-shiyo table td {
  background-color: #fff;
  border: 1px solid #9e9e9f;
  padding: 1px 15px;
  text-align: left;
}
/* 37. 修正　製品 特徴ボックス内 table>td にtext-centerを効かせる（by Naguchi） */
#pd-shiyo table td.text-center {
  text-align: center;
}

@media only screen and (max-width: 767px) {
  #pd-shiyo table th,
  #pd-shiyo table td {
    font-size: 12px;
    padding: 1px 5px;
  }
}

/* 36. 修正　製品 特徴ボックス内でのh3タイトルのスタイルを追加（by Naguchi） */
.pd-item-detail h3.blue-ttl {
  margin: 0 0 20px;
  text-align: center;
  font-size: 26px;
  color: #2b71b8;
  letter-spacing: 0.1em;
  line-height: 1.8;
}
@media (max-width: 767px) {
  .pd-item-detail h3.blue-ttl {
    font-size: 15px;
    margin-bottom: 10px;
  }
}
@media (max-width: 991px) {
  .pd-item-detail h3.blue-ttl {
    font-size: 18px;
  }
}

/* 2.3 Zenbun Search
 * ------------------------------*/
#zenbun-wrap {
  overflow: hidden;
}

#zenbun-wrap .bg-white #breadcrumb {
  padding-left: 0;
}

#zenbun-wrap #main-wrapper {
  padding-top: 25px;
  margin-left: -36px;
}

#zenbun-wrap #main-wrapper .container {
  padding-left: 85px;
  padding-right: 55px;
}

@media only screen and (max-width: 991px) {
  #zenbun-wrap #main-wrapper .container {
    padding-left: 55px;
    padding-right: 25px;
  }
}

@media only screen and (max-width: 767px) {
  #zenbun-wrap .container {
    padding-left: 0;
    padding-right: 0;
  }
  #zenbun-wrap #main-wrapper {
    padding-top: 30px;
  }
  #zenbun-wrap #main-wrapper .container {
    padding-left: 35px;
    padding-right: 0;
  }
}

/***** 2.3.1 Button Contact *****/
#zenbun-wrap .btn-contact {
  width: 100%;
  margin: 0 auto 50px;
  text-align: center;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  box-shadow: 1px 5px 5px rgba(0, 0, 0, 0.2);
  background: url(../image/product-solution/zenbun/btn-contact.png) 0 0 repeat-x;
  letter-spacing: 0.08em;
  line-height: 1.7;
}

#zenbun-wrap .btn-contact.last {
  margin-bottom: 70px;
}

#zenbun-wrap .btn-contact a {
  display: block;
  overflow: hidden;
  width: 100%;
  height: 110px;
  padding: 13px 15px;
  color: #fff;
}

#zenbun-wrap .btn-contact a:hover {
  text-decoration: none;
  color: #fff;
}

#zenbun-wrap .btn-contact:hover {
  background: url(../image/product-solution/zenbun/btn-contact-over.png) 0 0
    repeat-x;
  transition: 0.7s;
  transition: 0.7s;
}

#zenbun-wrap .btn-contact .icon {
  display: inline-block;
  width: 36px;
  height: 47px;
  margin-right: 15px;
  background: url(../image/product-solution/zenbun/icon-contact.png) 0 0
    no-repeat;
}

#zenbun-wrap .btn-contact .txt {
  vertical-align: 20%;
  font-size: 30px;
  font-weight: 500;
}

#zenbun-wrap .btn-contact .txt-black {
  font-size: 16px;
}

@media only screen and (max-width: 991px) {
  #zenbun-wrap .btn-contact .txt-black {
    font-size: 14px;
  }
}

@media only screen and (max-width: 767px) {
  #zenbun-wrap .btn-contact {
    margin: 0 auto 30px;
    background-size: cover;
  }
  #zenbun-wrap .btn-contact.last {
    margin: 20px auto 10px;
  }
  #zenbun-wrap .btn-contact:hover {
    background-size: cover;
  }
  #zenbun-wrap .btn-contact a {
    height: auto;
  }
  #zenbun-wrap .btn-contact .txt {
    font-size: 18px;
    vertical-align: 45%;
  }
  #zenbun-wrap .btn-contact .txt-black {
    font-size: 14px;
  }
}

/***** 2.3.2 Top *****/
#zenbun-top {
  width: 105%;
  height: 620px;
  margin-left: -18px;
  margin-right: -17px;
  /*background-color: $brand-primary;*/
  background: url(../image/product-solution/zenbun/bg-main.png) center left
    no-repeat;
  background-size: cover;
  position: relative;
  color: #fff;
}

@media only screen and (max-width: 767px) {
  #zenbun-top {
    width: 115%;
    height: 425px;
    margin-left: -24px;
  }
}

#zenbun-top .txt-area {
  width: 485px;
  padding: 30px;
  /*background-color: $brand-primary;*/
  background-color: rgba(48, 113, 185, 0.85);
  box-sizing: border-box;
  position: absolute;
  top: 35px;
  right: 55px;
}

@media only screen and (max-width: 1199px) {
  #zenbun-top .txt-area {
    right: 45px;
  }
}

@media only screen and (max-width: 991px) {
  #zenbun-top .txt-area {
    right: 35px;
  }
}

@media only screen and (max-width: 767px) {
  #zenbun-top .txt-area {
    width: 300px;
    height: 320px;
    padding: 20px;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
  }
}

#zenbun-top .section-ttl {
  margin-bottom: 30px;
}

#zenbun-top .section-ttl-txt {
  margin: 0;
  font-size: 28px;
  line-height: 1.6;
  letter-spacing: 0.08em;
}

#zenbun-top .anime-line {
  display: block;
  height: 2px;
  width: 10%;
  margin: 20px 0 0;
  background-color: #fff;
  animation-name: line-animation;
  animation-duration: 2s;
  animation-timing-function: ease;
  animation-fill-mode: forwards;
}

@media only screen and (max-width: 1199px) {
  #zenbun-top .section-ttl-txt {
    font-size: 25px;
  }
}

@media only screen and (max-width: 991px) {
  #zenbun-top .section-ttl-txt {
    font-size: 18px;
  }
}

@media only screen and (max-width: 767px) {
  #zenbun-top .section-ttl-txt {
    font-size: 17px;
  }
}

#zenbun-top p {
  font-size: 17px;
  line-height: 2;
  text-align: center;
}

#zenbun-top .img {
  margin-top: 30px;
}

@media only screen and (max-width: 1199px) {
  #zenbun-top .img {
    margin-top: 20px;
  }
}

@media only screen and (max-width: 991px) {
  #zenbun-top p {
    font-size: 14px;
    line-height: 1.8;
  }
}

@media only screen and (max-width: 767px) {
  #zenbun-top p {
    text-align: left;
  }
}

/***** 2.3.3 Check List *****/
.zenbun-check-list {
  margin: 0 0 0 10px;
  padding: 0;
  list-style-type: none;
  font-size: 17px;
  line-height: 1.8;
}

.zenbun-check-list.small-size {
  font-size: 16px;
  margin-left: 0;
}

.zenbun-check-list li {
  width: 100%;
  margin: 0;
  padding: 16px 0;
  border-bottom: 1px dashed #9fa0a0;
  display: table;
}

.zenbun-check-list li:first-of-type {
  padding-top: 0;
}

.zenbun-check-list li:last-of-type {
  padding-bottom: 0;
  border-bottom: none;
}

.zenbun-check-list.small-size.line-bottom li:last-of-type {
  border-bottom: 1px dashed #9fa0a0;
  padding-bottom: 16px;
}

.zenbun-check-list li .icon {
  display: table-cell;
  vertical-align: top;
  width: 49px;
  height: 43px;
  background: url(../image/product-solution/zenbun/icon-check.png) 0 0 no-repeat;
}

.zenbun-check-list.small-size li .icon {
  width: 30px;
  height: 26px;
  background-size: contain;
}

.zenbun-check-list li .txt {
  display: table-cell;
  vertical-align: middle;
  border-left: 20px solid #fff;
}

@media only screen and (max-width: 991px) {
  .zenbun-check-list {
    margin-left: 0;
    font-size: 15px !important;
  }
  .zenbun-check-list li {
    padding: 10px 0 !important;
  }
  .zenbun-check-list li .icon {
    width: 30px;
    height: 26px;
    background-size: contain;
  }
  .zenbun-check-list li .txt {
    border-left: 10px solid #fff;
  }
}

@media only screen and (max-width: 767px) {
  .zenbun-check-list {
    margin-top: 20px;
  }
  .sub-line + .zenbun-check-list.small-size {
    margin-top: -20px;
  }
  .zenbun-check-list li:last-of-type {
    padding-bottom: 10px !important;
    border-bottom: 1px dashed #9fa0a0;
  }
}

/***** 2.3.4 Tokuchou *****/
.zenbun-tokuchou .txt-catch + .sub-tokuchou,
.zenbun-tokuchou .txt-p2p + .sub-tokuchou {
  margin-top: 50px;
}

@media only screen and (max-width: 767px) {
  .zenbun-tokuchou .txt-catch + .sub-tokuchou,
  .zenbun-tokuchou .txt-p2p + .sub-tokuchou {
    margin-top: 30px;
  }
}

.zenbun-tokuchou .sub-tokuchou {
  width: 100%;
  height: 56px;
  margin: 0 0 50px;
  display: table;
  background-color: #2b71b8;
  font-size: 18px;
  color: #fff;
  text-align: center;
  font-weight: 500;
  letter-spacing: 0.08em;
}

@media only screen and (max-width: 767px) {
  .zenbun-tokuchou .sub-tokuchou {
    height: 50px;
    line-height: 1.4;
    margin-bottom: 20px;
    font-size: 13px;
  }
}

@media only screen and (min-width: 992px) {
  .zenbun-tokuchou .sub-tokuchou {
    font-size: 23px;
  }
}

.zenbun-tokuchou .sub-tokuchou + p {
  margin-bottom: 50px;
}

@media only screen and (max-width: 767px) {
  .zenbun-tokuchou .sub-tokuchou + p {
    margin-bottom: 20px;
  }
}

.zenbun-tokuchou .sub-tokuchou div {
  display: table-cell;
  vertical-align: middle;
}

.zenbun-tokuchou .sub-tokuchou .bg-gray {
  width: 140px;
  color: #2b71b8;
  font-size: 18px;
  background-color: #eaebe9;
}

@media only screen and (max-width: 767px) {
  .zenbun-tokuchou .sub-tokuchou .bg-gray {
    width: 80px;
    font-size: 14px;
  }
}

.zenbun-tokuchou .sub-tokuchou .num {
  display: inline-block;
  vertical-align: -10%;
  margin-left: 10px;
  font-size: 42px;
  font-family: "Roboto Condensed", sans-serif !important;
  font-weight: 600;
}

@media only screen and (max-width: 767px) {
  .zenbun-tokuchou .sub-tokuchou .num {
    font-size: 25px;
  }
}

.zenbun-tokuchou .gbox {
  width: auto;
  margin: 10px 0;
  padding: 10px;
  background-color: #e9ebe8;
  border: 1px solid #9e9e9f;
}

.zenbun-tokuchou .gbox:last-of-type {
  margin-bottom: 0;
}

.zenbun-tokuchou .gbox .round-num {
  color: #2b71b8;
  font-size: 120%;
  font-weight: 900;
  line-height: 12px;
}

.diagram {
  width: 100%;
  display: block;
  position: relative;
  background-repeat: no-repeat;
  background-size: contain;
}

@media only screen and (max-width: 767px) {
  .diagram {
    display: none;
  }
}

@media only screen and (min-width: 768px) {
  .diagram {
    display: block;
  }
}

.diagram .remark {
  position: absolute;
  color: #231916;
  letter-spacing: 0.08em;
  font-weight: 500;
  font-size: 8.5px;
  line-height: 1.7;
}

@media only screen and (min-width: 992px) {
  .diagram .remark {
    font-size: 11px;
  }
}

@media only screen and (min-width: 1200px) {
  .diagram .remark {
    font-size: 13px;
  }
}

#dg-merit1 {
  padding-bottom: 66.159%;
}

#remark01-01 {
  top: 2.25%;
  left: 1.8%;
  width: 20%;
}

#remark01-02 {
  top: 2.25%;
  left: 52.5%;
  width: 22%;
}

#remark01-03 {
  top: 2.25%;
  left: 78%;
  width: 20%;
}

#remark01-04 {
  top: 88.25%;
  left: 1.8%;
  width: 20%;
}

#remark01-05 {
  top: 88.25%;
  left: 27.5%;
  width: 20%;
}

#dg-merit4 {
  padding-bottom: 61.299%;
  max-width: 770px;
  margin-left: auto;
  margin-right: auto;
}

@media only screen and (min-width: 768px) {
  #dg-merit4 .remark {
    font-size: 10px;
  }
}

@media only screen and (min-width: 992px) {
  #dg-merit4 .remark {
    font-size: 13px;
  }
}

#remark04-01 {
  top: 27.75%;
  left: 25.5%;
  width: 24%;
}

@media only screen and (min-width: 992px) {
  #remark04-01 {
    top: 24.75%;
  }
}

@media only screen and (min-width: 1200px) {
  #remark04-01 {
    top: 21.25%;
  }
}

#remark04-02 {
  top: 50%;
  left: 25.5%;
  width: 24%;
}

@media only screen and (min-width: 992px) {
  #remark04-02 {
    top: 45.5%;
  }
}

@media only screen and (min-width: 1200px) {
  #remark04-02 {
    top: 38.5%;
  }
}

#dg-merit5 {
  padding-bottom: 63.623%;
  max-width: 877px;
  margin-left: auto;
  margin-right: auto;
}

@media only screen and (max-width: 1199px) {
  #dg-merit5 .remark {
    font-size: 12px;
  }
}

@media only screen and (max-width: 991px) {
  #dg-merit5 .remark {
    font-size: 10px;
  }
}

#remark05-01 {
  top: 2%;
  right: 29%;
  width: 24%;
}

@media only screen and (min-width: 1200px) {
  #remark05-01 {
    top: 1.75%;
  }
}

#remark05-02 {
  top: 2%;
  right: 1%;
  width: 24%;
}

@media only screen and (min-width: 1200px) {
  #remark05-02 {
    top: 1.75%;
  }
}

/***** 2.3.5 Price *****/
#zenbun-price .col-xs-12 {
  padding-top: 60px;
  border-top: 1px solid #9fa0a0;
}

#zenbun-price h2 {
  margin: 0;
  font-size: 30px;
  line-height: 1.8;
  letter-spacing: 0.08em;
  text-align: center;
}

@media only screen and (max-width: 991px) {
  #zenbun-price h2 {
    font-size: 25px;
  }
}

@media only screen and (max-width: 767px) {
  #zenbun-price.section60-wrap {
    margin-bottom: 0;
  }
  #zenbun-price .col-xs-12 {
    padding-top: 30px;
  }
  #zenbun-price h2 {
    font-size: 15px;
  }
}

#zenbun-price .m-size {
  width: 70%;
  margin: 0 auto;
}

@media only screen and (max-width: 991px) {
  #zenbun-price .m-size {
    width: 100%;
  }
}

#zenbun-price dl.list {
  margin: 40px auto 30px;
  width: 100%;
  height: 115px;
  display: table;
  font-size: 27px;
  letter-spacing: 0.08em;
  border: 2px solid #9fa0a0;
}

#zenbun-price dl.list dt,
#zenbun-price dl.list dd {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

#zenbun-price dl.list dt {
  width: 40%;
  color: #fff;
  font-weight: normal;
  background-color: #2b71b8;
}

#zenbun-price dl.list dd {
  width: 60%;
  color: #2b71b8;
}

#zenbun-price dl.list strong {
  font-weight: 500;
  font-size: 35px;
}

@media only screen and (max-width: 991px) {
  #zenbun-price dl.list {
    height: 80px;
    font-size: 22px;
  }
  #zenbun-price dl.list strong {
    font-size: 30px;
  }
}

@media only screen and (max-width: 767px) {
  #zenbun-price dl.list {
    margin: 20px auto;
    height: 60px;
    font-size: 15px;
  }
  #zenbun-price dl.list strong {
    font-size: 20px;
  }
}

/* 2.4 Server dropdown
 * ------------------------------*/
#server-dropdown {
  display: block;
}

#server-dropdown ul.dropdown-menu {
  padding: 0;
  border-radius: 0;
  margin-top: 0;
  border: none;
}

#server-dropdown ul.dropdown-menu li {
  background-color: #2b71b8;
  border-top: 1px solid #fff;
  position: relative;
}

#server-dropdown ul.dropdown-menu li:before {
  background: #fff;
  display: block;
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 0%;
  content: "";
  transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1);
}

@media only screen and (max-width: 767px) {
  #server-dropdown ul.dropdown-menu li {
    background-color: #fff;
    border-top: 1px solid #c4c5c5;
  }
}

@media only screen and (min-width: 768px) {
  #server-dropdown ul.dropdown-menu li:hover:before {
    width: 100%;
  }
  #server-dropdown ul.dropdown-menu li:hover a {
    color: #2b71b8;
  }
}

#server-dropdown ul.dropdown-menu li a {
  font-size: 12px;
  color: #fff;
  padding-top: 6px;
  padding-bottom: 6px;
  transition: color 400ms cubic-bezier(0.42, 0, 0.58, 1);
}

@media only screen and (max-width: 767px) {
  #server-dropdown ul.dropdown-menu li a {
    font-size: 10px;
    color: #2b71b8;
    padding-top: 6px;
    padding-bottom: 6px;
  }
}

@media only screen and (min-width: 768px) {
  #server-dropdown ul.dropdown-menu li a {
    min-width: 222px;
  }
}

@media only screen and (min-width: 768px) {
  #server-dropdown ul.dropdown-menu li a:hover {
    background-color: transparent;
    position: relative;
    z-index: 2;
  }
}

@media only screen and (max-width: 767px) {
  .aketeiru:before {
    background-color: #fff !important;
  }
}

@media only screen and (max-width: 767px) {
  .aketeiru a#server-dropdown-btn {
    color: #2b71b8 !important;
  }
}

/* 2.5 Network Storage
 * ------------------------------*/
.graph-ttl {
  color: #666;
  margin-top: 30px;
  margin-bottom: 10px;
  text-align: center;
  font-weight: 500;
  font-size: 15px;
  display: block;
}

#legend {
  padding-left: 55px;
  padding-right: 10px;
  font-size: 12px;
  color: #666;
  margin-top: 30px;
  margin-bottom: 60px;
  position: relative;
}

@media only screen and (max-width: 767px) {
  #legend {
    margin-top: 10px;
    font-size: 11px;
  }
}

#legend .offsetted {
  font-size: 11px;
  position: absolute;
  text-align: right;
  left: -55px;
}

@media only screen and (max-width: 767px) {
  #legend .offsetted {
    font-size: 10px;
  }
}

#legend > div {
  width: auto;
  display: block;
  box-sizing: border-box;
}

#legend > div:before,
#legend > div:after {
  content: "";
  display: table;
}

#legend > div:after {
  clear: both;
}

#legend > div:first-child > div {
  border-bottom: 1px solid #adadad;
}

#legend > div > div {
  text-align: center;
}

#legend > div > div + div {
  border-left: 1px solid #adadad;
}

/* 2.6 P2P
 * ------------------------------*/
.second-flex p,
.graphP {
  color: #343333;
  font-size: 14px;
  line-height: 2;
}

@media only screen and (max-width: 767px) {
  .second-flex p,
  .graphP {
    font-size: 12px;
    line-height: 1.8;
  }
}

.second-flex .txt-p2p {
  font-size: 28px;
  letter-spacing: 0.01em;
  margin-bottom: 20px;
  text-align: left;
}

@media only screen and (max-width: 767px) {
  .second-flex .txt-p2p {
    font-size: 15px;
    margin-bottom: 15px;
  }
}

.svg-arrow {
  width: 50px;
  height: auto;
  margin-top: 50px;
}

.p2p-blue-box {
  background-color: #2b71b8;
  color: #fff;
  display: block;
  font-size: 14px;
  line-height: 2;
  margin: 20px auto 0;
  padding: 12px 15px;
  text-align: center;
  width: 340px;
}

@media only screen and (max-width: 767px) {
  .p2p-blue-box {
    font-size: 12px;
    padding: 4px 8px;
    width: auto;
  }
}

.main-p2p .pd-item-box {
  padding-top: 0;
  cursor: default;
}

.main-p2p .pd-item-box:hover {
  border-color: #9e9e9f;
  outline: inherit;
}

.main-p2p .pd-item-box table {
  margin-top: 0;
}

.main-p2p .pd-item-box table td img {
  margin-bottom: 15px;
}

.main-p2p-option {
  margin-top: 20px !important;
  margin-bottom: 80px !important;
  padding-bottom: 10px !important;
  background-color: #d9e4ef !important;
}

@media only screen and (max-width: 767px) {
  .main-p2p-option {
    margin-top: 0 !important;
    margin-bottom: 40px !important;
    padding-bottom: 10px !important;
  }
}

.main-p2p-option .section-ttl-txt {
  margin-bottom: 35px !important;
}

.main-p2p-option .boxW {
  padding: 40px 70px !important;
}

@media only screen and (max-width: 991px) {
  .main-p2p-option .boxW {
    padding: 30px !important;
  }
}

@media only screen and (max-width: 767px) {
  .main-p2p-option .boxW {
    padding: 20px 15px !important;
  }
}

.main-p2p-option table {
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 13px;
  width: 100%;
  margin: 10px 0 20px;
  line-height: 1.8;
}

.main-p2p-option table th {
  background-color: #f9f9f9;
  border: 1px solid #9e9e9f;
  font-weight: normal;
  padding: 1px 15px;
  text-align: center;
}

.main-p2p-option table td {
  background-color: #fff;
  border: 1px solid #9e9e9f;
  padding: 1px 15px;
  text-align: left;
}

@media only screen and (max-width: 767px) {
  .main-p2p-option table th,
  .main-p2p-option table td {
    font-size: 12px;
    padding: 1px 5px;
  }
}

@media only screen and (max-width: 767px) {
  .main-p2p-option table {
    margin: 10px 0;
  }
}

.main-p2p-option table th {
  background-color: #f9fafa;
  padding: 3px 10px;
}

.main-p2p-option table td {
  padding: 3px 10px;
}

@media only screen and (max-width: 767px) {
  .main-p2p-option table td,
  .main-p2p-option table th {
    padding: 3px 5px;
  }
}

.topVoice {
  position: relative;
  width: 1000px;
  margin: 0 auto;
  padding: 40px 0 20px;
}

.topVoice .voiceList {
  overflow: hidden;
  margin: 0;
  padding: 0;
}

.topVoice .voiceBox {
  position: relative;
  float: left;
  width: 320px;
  height: 230px;
  box-sizing: border-box;
  padding: 20px;
  margin-right: 20px;
  margin-bottom: 20px;
  background: url(https://www.fanatic.co.jp/baizo/imgs/voice_box.gif) no-repeat
    left top;
  line-height: 200%;
}

.topVoice .voiceBox:last-child {
  margin-right: 0px;
}

.topVoice .voiceBox p {
  font-size: 14px;
  text-align: left;
}

@media only screen and (max-width: 767px) {
  .topVoice .voiceBox p {
    font-size: 12px;
  }
}

.topVoice .voiceBox .name {
  background: url(https://www.fanatic.co.jp/baizo/imgs/voice_icon_name.gif)
    no-repeat left center;
  bottom: 25px;
  left: 20px;
  line-height: 19px;
  padding-left: 35px;
  position: absolute;
  font-size: 12px;
}

/* 2.6.1 Service */
#first-section {
  padding-top: 0;
}

#first-section .sameH {
  margin-bottom: 49px;
}

@media only screen and (max-width: 767px) {
  #first-section .sameH {
    margin-bottom: 35px;
  }
}

@media only screen and (max-width: 479px) {
  #first-section .sameH {
    padding-left: 8.75px;
    padding-right: 8.75px;
  }
}

#first-section .btn-thick {
  margin-top: 35px;
}

#first-section .btn-thick,
#faq .btn-thick {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: center;
  align-content: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  min-height: 78px;
}

/* 2.6.2 Features */
.second-flex {
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 30px;
}

@media only screen and (max-width: 767px) {
  .second-flex {
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

.second-flex .second-flex-img {
  -ms-flex: 0 0 40%;
  flex: 0 0 40%;
  margin-right: 35px;
}

@media only screen and (max-width: 767px) {
  .second-flex .second-flex-img {
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    margin-right: 0;
    margin-bottom: 17.5px;
  }
}

#steps #step-txt {
  margin-top: 35px;
}

@media only screen and (max-width: 767px) {
  #steps .visible-xs {
    width: 180px;
  }
}

@media only screen and (max-width: 479px) {
  #steps .visible-xs {
    width: 130px;
  }
}

.legacy-row {
  margin-top: 30px;
}

.p2p-specs {
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 35px;
  width: 100%;
  -ms-flex-direction: column;
  flex-direction: column;
}

.p2p-specs > div {
  padding: 20px;
  line-height: 1.5;
  display: -ms-flexbox;
  display: flex;
}

@media only screen and (max-width: 767px) {
  .p2p-specs > div {
    padding: 17.5px;
  }
}

.p2p-specs > div:first-child {
  color: #fff;
  background-color: #2b71b8;
  text-align: center;
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  font-size: 14px;
  font-weight: 500;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.p2p-specs > div:nth-child(2) {
  line-height: 1.6;
  background-color: #fff;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  -ms-flex-direction: column;
  flex-direction: column;
}

@media only screen and (max-width: 767px) {
  .p2p-specs > div:nth-child(2) {
    font-size: 12px;
  }
}

.p2p-specs > div:nth-child(2) > div {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  font-size: 12px;
}

.p2p-specs > div:nth-child(2) > div:first-child {
  margin-bottom: 15px;
  -ms-flex: 0 0 180px;
  flex: 0 0 180px;
  -ms-flex-pack: center;
  justify-content: center;
}

@media only screen and (max-width: 767px) {
  .graphP.text-center {
    text-align: left;
  }
}

/* 2.7 Legacy table
-------------------------------*/
#legacy .container > img {
  margin-top: 35px;
}

#legacy p {
  margin-top: 17.5px;
}

.specs {
  display: -ms-flexbox;
  display: flex;
  margin-top: 35px;
  width: 100%;
}

@media only screen and (max-width: 767px) {
  .specs {
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

@media only screen and (min-width: 1200px) {
  .specs {
    min-height: 210px;
  }
}

.specs + .specs {
  margin-top: 17.5px;
}

.specs > div {
  padding: 35px;
  line-height: 1.5;
  display: -ms-flexbox;
  display: flex;
}

@media only screen and (max-width: 767px) {
  .specs > div {
    padding: 17.5px;
  }
}

.specs > div:first-child {
  color: #fff;
  background-color: #6a9ed0;
  text-align: center;
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  font-size: 18px;
  font-weight: 500;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
}

@media only screen and (max-width: 767px) {
  .specs > div:first-child {
    font-size: 15px;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
  }
}

.specs > div:nth-child(2) {
  line-height: 1.6;
  border: 1px solid #ccc;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}

@media only screen and (max-width: 767px) {
  .specs > div:nth-child(2) {
    font-size: 12px;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

.specs > div:nth-child(2) > div {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.specs > div:nth-child(2) > div:first-child {
  -ms-flex: 0 0 180px;
  flex: 0 0 180px;
  -ms-flex-pack: center;
  justify-content: center;
  margin-right: 20px;
}

@media only screen and (max-width: 767px) {
  .specs > div:nth-child(2) > div:first-child {
    margin-bottom: 10px;
    margin-right: 0;
  }
}

/* 2.8 FAQ
-------------------------------*/
@media only screen and (max-width: 767px) {
  #faqtab {
    margin-bottom: 35px;
  }
}

#faqtab .nav-tabs {
  display: -ms-flexbox;
  display: flex;
}

@media only screen and (max-width: 767px) {
  #faqtab .nav-tabs {
    margin: -10px -17.5px -2px;
    overflow-x: scroll;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}

#faqtab .nav-tabs li {
  -ms-flex: 1 0 16.666667%;
  flex: 1 0 16.666667%;
  display: -ms-flexbox;
  display: flex;
}

@media only screen and (max-width: 767px) {
  #faqtab .nav-tabs li {
    -ms-flex: 1 0 33%;
    flex: 1 0 33%;
    margin-bottom: 2px;
  }
}

#faqtab .nav-tabs li.active a {
  background-color: #2b71b8;
}

#faqtab .nav-tabs a {
  width: 100%;
  height: 60px;
  color: #fff;
  background-color: #a8a8b7;
  text-align: center;
  vertical-align: middle;
  line-height: 1.5;
  display: -ms-flexbox;
  display: flex;
  flex-align: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-weight: 500;
  font-size: 12px;
  padding: 10px 0;
}

@media only screen and (max-width: 991px) {
  #faqtab .nav-tabs a {
    height: 45px;
    font-size: 10px;
  }
}

@media only screen and (max-width: 767px) {
  #faqtab .nav-tabs a {
    padding: 7px 0;
  }
}

@media only screen and (max-width: 767px) {
  #faqtab .tab-content {
    margin-left: -17.5px;
    margin-right: -17.5px;
  }
}

#faqtab.p2p-faq .tab-content {
  background-color: #fff;
}

.faqwrap {
  padding: 20px 18px;
  border-left: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
}

@media only screen and (max-width: 767px) {
  .faqwrap {
    font-size: 12px;
    border-left: none;
    border-right: none;
  }
}

.faqwrap .faqrow {
  width: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  text-align: left;
}

.faqwrap .faqrow p {
  font-size: 14px;
}

@media only screen and (max-width: 767px) {
  .faqwrap .faqrow p {
    font-size: 12px;
  }
}

.faqwrap .faqrow:first-child {
  color: #2b71b8;
  padding-bottom: 10px;
  margin-bottom: 17.5px;
  border-bottom: 1px dotted #ccc;
  font-weight: 500;
}

.faqwrap .faqrow:first-child p {
  font-size: 17px;
}

@media only screen and (max-width: 767px) {
  .faqwrap .faqrow:first-child p {
    font-size: 13px;
  }
}

.faqwrap .faqrow:first-child > div:first-child {
  color: #2b71b8;
}

.faqwrap .faqrow > div {
  width: 100%;
  display: -ms-flexbox;
  display: flex;
}

.faqwrap .faqrow > div p:last-child {
  margin-bottom: 0;
}

.faqwrap .faqrow > div:first-child {
  color: #ff7373;
  width: 85px;
  text-align: center;
  display: table-cell;
  font-weight: 600;
  font-size: 42px;
  line-height: 1.45;
  font-family: "Roboto Condensed", sans-serif !important;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  text-transform: uppercase;
}

@media only screen and (max-width: 767px) {
  .faqwrap .faqrow > div:first-child {
    font-size: 22px;
    width: 40px;
    text-align: left;
  }
}

/*-------------------------------
 * 3. REPORT
 * ----------------------------*/
/* 3.1 Top page
 * ------------------------------*/
#report-wrap {
  margin-left: -5px;
  margin-right: -44px;
}

@media only screen and (max-width: 1199px) {
  #report-wrap {
    margin-right: -30px;
  }
}

@media only screen and (max-width: 767px) {
  #report-wrap {
    margin-right: -5px;
  }
}

ul.report-list {
  width: 100%;
  margin: 0;
  padding: 0;
  list-style-type: none;
  display: -ms-box;
  display: -webkit-flexbox;
  display: -moz-flexbox;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -ms-flex;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

ul.report-list li {
  margin: 0 10px 20px;
  padding: 0;
  width: 30%;
}

ul.report-list.col-4 li {
  width: 23.15%;
}

@media only screen and (max-width: 1199px) {
  ul.report-list.col-4 li {
    width: 22.8%;
  }
}

@media only screen and (max-width: 991px) {
  ul.report-list li {
    width: 29%;
  }
  ul.report-list.col-4 li {
    width: 22%;
  }
}

@media only screen and (max-width: 767px) {
  ul.report-list li,
  ul.report-list.col-4 li {
    margin: 0 10px 15px 5px;
    width: 46.5%;
  }
  #report-wrap ul.report-list li:nth-child(2n),
  ul.report-list.col-4 li:nth-child(2n) {
    margin-right: 0;
  }
}

.report-box {
  background-color: #fff;
}

.report-box .icon {
  height: 18px;
  color: #fff;
  background-color: #2b71b8;
  display: table;
  font-size: 11px;
  line-height: 17px;
  text-align: center;
  margin: 20px auto 10px;
  padding-left: 8px;
  padding-right: 8px;
  min-width: 88px;
  border-radius: 4px;
}

@media only screen and (max-width: 767px) {
  .report-box .icon {
    height: auto;
    padding: 3px 5px 4px;
    font-size: 10px;
    line-height: 1.45;
  }
}

.report-box:hover .icon {
  color: #2b71b8;
  background-color: #fff;
}

.report-box a {
  display: block;
  color: #231916;
}

.report-box a:hover,
.report-box a:hover .txt-gray {
  color: #fff;
  text-decoration: none;
}

.report-box:hover {
  color: #fff;
  background-color: #2b71b8;
  transition: 0.7s;
}

.report-box:hover a,
.report-box:hover a .txt-gray {
  color: #fff;
}

.report-box .txt {
  padding: 15px 20px 10px;
}

.report-box .txt p.f14 {
  line-height: 1.6 !important;
}

@media only screen and (max-width: 767px) {
  .report-box .txt {
    padding: 10px;
  }
}

/* 3.2 Detail page
 * ------------------------------*/
#report-detail-wrap .col-xs-12 {
  padding-right: 45px;
}

#report-detail-wrap .report-box-wrap {
  padding: 50px 60px;
  border: 1px solid #dbdcdc;
}

@media only screen and (max-width: 767px) {
  #report-detail-wrap .report-box-wrap {
    padding: 15px;
  }
}

#report-detail-wrap .sub {
  margin: 0 0 15px;
  color: #2b71b8;
  font-size: 24px;
  line-height: 1.45;
  letter-spacing: 0.1em;
}

#report-detail-wrap .img {
  margin: 30px auto;
}

#report-detail-wrap .txt p {
  margin: 0 0 30px;
  font-size: 15px;
  letter-spacing: 0.09em;
  line-height: 2.35;
}

#report-detail-wrap p {
  font-size: 14px;
  line-height: 2;
}

@media only screen and (max-width: 767px) {
  #report-detail-wrap p {
    font-size: 12px;
  }
}

#report-detail-wrap img {
  max-width: 100%;
  height: auto;
}

#report-detail-wrap a {
  word-wrap: break-word;
}

@media only screen and (max-width: 767px) {
  #report-detail-wrap .col-xs-12 {
    padding-right: 15px;
  }
  #report-detail-wrap .sub {
    font-size: 15px;
    letter-spacing: 0;
  }
  #report-detail-wrap .img {
    margin: 20px auto;
  }
  #report-detail-wrap .txt p {
    margin-bottom: 10px;
    font-size: 12px;
    letter-spacing: 0;
    line-height: 2;
  }
}

#report-detail-wrap .icon {
  display: inline-block;
  margin-left: 20px;
  padding-left: 8px;
  padding-right: 8px;
  min-width: 88px;
  height: 18px;
  line-height: 17px;
  font-size: 11px;
  text-align: center;
  color: #fff;
  background-color: #2b71b8;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
}

#report-detail-wrap a:hover .icon {
  text-decoration: none;
}

@media only screen and (max-width: 767px) {
  #report-detail-wrap .icon {
    min-width: 60px;
    height: auto;
    margin-left: 10px;
    padding: 3px 5px 4px;
    font-size: 10px;
    line-height: 1.45;
  }
}

#report-detail-wrap hr {
  margin: 40px auto;
  border-top: 1px solid #dbdcdc;
}

@media only screen and (max-width: 767px) {
  #report-detail-wrap hr {
    margin: 15px auto;
  }
}

/***** 3.2.1 Related Report *****/
#report-related {
  padding-top: 70px;
  background-color: #e9ebe8;
}

#report-related #report-wrap {
  margin-left: -20px;
  margin-right: -30px;
}

#report-related #report-wrap ul.report-list li {
  margin: 0 10px 20px;
  padding: 0;
  width: 23%;
}

@media only screen and (max-width: 991px) {
  #report-related #report-wrap ul.report-list li {
    width: 29%;
  }
}

@media only screen and (max-width: 767px) {
  #report-related #report-wrap {
    margin-left: -5px;
    margin-right: -5px;
  }
  #report-related #report-wrap ul.report-list li {
    margin: 0 10px 15px 5px;
    width: 46.5%;
  }
  #report-related #report-wrap ul.report-list li:nth-child(2n) {
    margin-right: 0;
  }
}

#report-related .section-ttl {
  padding-bottom: 30px;
}

@media only screen and (max-width: 767px) {
  #report-related {
    padding-top: 40px;
  }
  #report-related .section-ttl {
    padding-bottom: 0;
  }
}

/*-------------------------------
 * 4. SUPPORT
 * ----------------------------*/
/* 4.1 Faq
 * ------------------------------*/
ul#faq-tab {
  width: 620px;
  margin: 0 auto;
  padding: 0;
  list-style-type: none;
}

ul#faq-tab li {
  float: left;
  width: 310px;
  padding: 8px 25px;
  text-align: center;
  font-size: 19px;
  letter-spacing: 0.08em;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  background-color: #fff;
  border-bottom: 1px solid #dbdcdc;
}

ul#faq-tab li:first-of-type {
  margin-left: 0;
}

ul#faq-tab li a {
  color: #2b71b8;
  display: block;
}

ul#faq-tab li a:hover {
  color: #fff;
  text-decoration: none;
}

ul#faq-tab li:hover {
  transition: 0.7s;
  background-color: #2b71b8;
}

ul#faq-tab li.active {
  background-color: #2b71b8;
}

ul#faq-tab li.active a {
  color: #fff;
}

ul#faq-tab:before,
ul#faq-tab:after {
  content: " ";
  display: table;
}

ul#faq-tab:after {
  clear: both;
}

@media only screen and (max-width: 767px) {
  ul#faq-tab {
    width: 100%;
  }
  ul#faq-tab li {
    width: 50%;
    font-size: 13px;
    letter-spacing: 0;
    padding: 8px 5px;
  }
}

#faq-cont .accordion {
  border-bottom: 1px solid #9e9e9f;
}

#faq-cont .accordion-heading {
  font-size: 18px;
  line-height: 1.8;
  letter-spacing: 0.08em;
  border-top: 1px solid #9e9e9f;
  border-left: 1px solid #9e9e9f;
  border-right: 1px solid #9e9e9f;
  position: relative;
}

#faq-cont .accordion-heading a {
  padding: 14px 35px 14px 25px;
  color: #231916;
  display: block;
}

#faq-cont .accordion-heading a:hover {
  text-decoration: none;
}

#faq-cont .accordion-heading .txt,
#faq-cont .accordion-inner .txt {
  display: table-cell;
  vertical-align: middle;
  padding-left: 15px;
}

#faq-cont .icon-faq {
  display: table-cell;
  font-weight: 600;
  font-size: 32px;
  line-height: 1.45;
  font-family: "Roboto Condensed", sans-serif !important;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

@media only screen and (max-width: 767px) {
  #faq-cont .icon-faq {
    font-size: 22px;
  }
}

#faq-cont .accordion-heading .icon-faq {
  color: #2b71b8;
  vertical-align: -10%;
}

#faq-cont .accordion-heading .icon {
  position: absolute;
  top: 30%;
  right: 10px;
  color: #9fa0a0;
  font-weight: 400;
}

@media only screen and (max-width: 767px) {
  #faq-cont .accordion-heading {
    font-size: 13px;
  }
  #faq-cont .accordion-heading a {
    padding: 10px 30px 10px 15px;
  }
  #faq-cont .accordion-heading .txt {
    padding-left: 10px;
  }
}

#faq-cont .accordion-inner {
  padding: 10px 25px 15px;
  border-left: 1px solid #9e9e9f;
  border-right: 1px solid #9e9e9f;
  display: -ms-flexbox;
  display: flex;
}

#faq-cont .accordion-inner p {
  font-size: 14px;
}

#faq-cont .accordion-inner .icon-faq {
  color: #b5b5b6;
  margin-right: 15px;
}

@media only screen and (max-width: 767px) {
  #faq-cont .accordion-inner {
    padding: 10px 15px;
  }
  #faq-cont .accordion-inner .icon-faq {
    margin-right: 10px;
  }
}

/* 4.2 Download
 * ------------------------------*/
.support-download {
  margin: 0 auto 50px;
}

.support-download dl {
  width: 80%;
  margin: 0 auto;
  display: table;
}

.support-download dl dt,
.support-download dl dd {
  display: table-cell;
}

.support-download dl dt {
  text-align: right;
  padding-right: 20px;
  font-size: 20px;
  letter-spacing: 0.08em;
  font-weight: 500;
}

@media only screen and (max-width: 1199px) {
  .support-download dl {
    width: 100%;
  }
}

@media only screen and (max-width: 991px) {
  .support-download {
    margin-bottom: 20px;
  }
}

@media only screen and (max-width: 767px) {
  .support-download dl {
    display: block;
  }
  .support-download dl dt,
  .support-download dl dd {
    display: block;
  }
  .support-download dl dt {
    text-align: left;
    font-size: 15px;
    margin-bottom: 5px;
  }
}

.support-download form {
  margin: 0;
}

.support-download .box-search {
  width: 440px;
  height: 52px;
  margin: 0 0 20px;
  padding-left: 10px;
  border: 1px solid #9e9e9f;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  box-shadow: inset 1px 1px 2px #ccc;
  background: linear-gradient(#eeeeee, #fff);
  color: #999;
}

.support-download .btn-search {
  cursor: pointer;
  display: inline-block;
  margin-left: -6px;
  vertical-align: 0;
  width: 50px;
  height: 52px;
  background: url(../image/support/btn-search.png) 0 0 no-repeat;
  border: none;
}

/* Safari & Chrome */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  .support-download .btn-search {
    vertical-align: -49%;
  }
}

.support-download .btn-search:hover {
  filter: alpha(opacity=75);
  opacity: 0.75;
  transition: 0.7s;
}

@media only screen and (max-width: 991px) {
  .support-download .box-search {
    width: 330px;
  }
}

@media only screen and (max-width: 767px) {
  .support-download .box-search {
    width: 270px;
    height: 41px;
    margin-bottom: 10px;
    font-size: 12px;
  }
  .support-download .btn-search {
    width: 40px;
    height: 42px;
    background-size: contain;
    margin-left: -8px;
    vertical-align: -5%;
  }
}

@media only screen and (-webkit-min-device-pixel-ratio: 0) and (max-width: 767px) {
  .support-download .btn-search {
    vertical-align: -40%;
  }
}

@media only screen and (-webkit-min-device-pixel-ratio: 0) and (max-width: 480px) {
  .support-download .btn-search {
    vertical-align: -50%;
  }
}

@media only screen and (max-width: 320px) {
  .support-download .box-search {
    width: 220px;
  }
}

.support-download-manual input.btn {
  height: 70px;
  line-height: 1.7;
  margin-bottom: 80px;
  font-weight: 500;
  font-size: 17px;
  letter-spacing: 0.08em;
  color: #fff;
  background-color: #2b71b8;
  border: 3px solid #2b71b8;
}

.support-download-manual input.btn:hover {
  color: #2b71b8;
  background-color: #fff;
  transition: 0.7s;
}

@media only screen and (max-width: 991px) {
  .support-download-manual input.btn {
    margin-bottom: 40px;
  }
}

@media only screen and (max-width: 767px) {
  .support-download-manual input.btn {
    margin-bottom: 20px;
    font-size: 15px;
  }
  .support-download .txt-red {
    line-height: 1.6;
  }
  .waku-box.download {
    padding: 10px;
  }
}

/*-------------------------------
 * 5. CASE
 * ----------------------------*/
/* 5.1 Detail page
 * ------------------------------*/
#case-detail-wrap .ttl {
  margin: 0 0 20px;
  text-align: center;
  font-size: 26px;
  color: #2b71b8;
  letter-spacing: 0.1em;
  line-height: 1.8;
}

#case-detail-wrap .sub {
  margin: 0 0 60px;
  text-align: center;
  font-size: 18px;
  letter-spacing: 0.1em;
  line-height: 1.8;
  font-weight: normal;
}

#case-detail-wrap h4 {
  margin: 0 0 40px;
  text-align: center;
  font-size: 24px;
  letter-spacing: 0.1em;
  line-height: 1.8;
  font-weight: normal;
}

@media only screen and (max-width: 991px) {
  #case-detail-wrap .ttl {
    font-size: 18px;
  }
  #case-detail-wrap .sub {
    font-size: 15px;
    margin-bottom: 30px;
  }
  #case-detail-wrap h4 {
    font-size: 18px;
    margin-bottom: 20px;
  }
}

@media only screen and (max-width: 767px) {
  #case-detail-wrap .ttl {
    font-size: 15px;
    margin-bottom: 10px;
  }
  #case-detail-wrap .sub {
    font-size: 13px;
    margin-bottom: 20px;
  }
  #case-detail-wrap h4 {
    font-size: 15px;
    margin-top: 25px;
    margin-bottom: 10px;
  }
}

#case-detail-wrap dl {
  width: 100%;
  display: table;
  border-top: 1px solid #9fa0a0;
  border-right: 1px solid #9fa0a0;
  border-bottom: 1px solid #9fa0a0;
  margin-bottom: 0;
}

@media only screen and (max-width: 767px) {
  #case-detail-wrap dl {
    display: block;
    border-left: 1px solid #9fa0a0;
  }
}

#case-detail-wrap dl dt,
#case-detail-wrap dl dd {
  display: table-cell;
  padding: 15px 20px;
  font-size: 14px;
  letter-spacing: 0.08em;
}

@media only screen and (max-width: 767px) {
  #case-detail-wrap dl dt,
  #case-detail-wrap dl dd {
    display: block;
    width: 100%;
    font-size: 12px;
    padding: 5px 15px;
    text-align: center;
  }
}

#case-detail-wrap dl dt {
  background-color: #eaebe9;
  border-left: 1px solid #9fa0a0;
  text-align: center;
  font-weight: normal;
}

@media only screen and (max-width: 767px) {
  #case-detail-wrap dl dt {
    border-left: none;
  }
}

#case-detail-wrap p {
  font-size: 14px;
  line-height: 2;
}

@media only screen and (max-width: 767px) {
  #case-detail-wrap p {
    font-size: 12px;
  }
}

#case-detail-wrap dl {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 60px 0;
}

@media only screen and (max-width: 991px) {
  #case-detail-wrap dl {
    margin: 20px 0 30px;
  }
}

#case-detail-wrap dl dt,
#case-detail-wrap dl dd {
  padding: 15px 20px;
  font-size: 14px;
  letter-spacing: 0.08em;
}

@media only screen and (max-width: 767px) {
  #case-detail-wrap dl dt,
  #case-detail-wrap dl dd {
    font-size: 12px;
  }
}

@media only screen and (min-width: 768px) {
  #case-detail-wrap dl dt,
  #case-detail-wrap dl dd {
    -ms-flex: 1 0 33.33333%;
    flex: 1 0 33.33333%;
  }
  #case-detail-wrap dl dt:nth-child(1),
  #case-detail-wrap dl dd:nth-child(1) {
    -ms-flex-order: 1;
    order: 1;
  }
  #case-detail-wrap dl dt:nth-child(3),
  #case-detail-wrap dl dd:nth-child(3) {
    -ms-flex-order: 2;
    order: 2;
  }
  #case-detail-wrap dl dt:nth-child(5),
  #case-detail-wrap dl dd:nth-child(5) {
    -ms-flex-order: 3;
    order: 3;
  }
  #case-detail-wrap dl dt:nth-child(2),
  #case-detail-wrap dl dd:nth-child(2) {
    -ms-flex-order: 4;
    order: 4;
  }
  #case-detail-wrap dl dt:nth-child(4),
  #case-detail-wrap dl dd:nth-child(4) {
    -ms-flex-order: 5;
    order: 5;
  }
  #case-detail-wrap dl dt:nth-child(6),
  #case-detail-wrap dl dd:nth-child(6) {
    -ms-flex-order: 6;
    order: 6;
  }
}

@media only screen and (min-width: 768px) {
  #case-detail-wrap dl dd {
    border-left: 1px solid #9fa0a0;
  }
}

.case-box-wrap {
  padding: 60px;
  background-color: #fff;
  border: 1px solid #dbdcdc;
}

@media only screen and (max-width: 767px) {
  .case-box-wrap {
    margin: 0;
    padding: 15px;
  }
}

.case-box-wrap hr {
  margin-top: 30px;
  margin-bottom: 40px;
  border: 0;
  border-top: 1px solid #dbdcdc;
}

.case-detail-box {
  margin-bottom: 80px;
}

.case-detail-box:last-of-type {
  margin-bottom: 0;
}

.case-detail-box .txt {
  padding-left: 30px;
  padding-right: 30px;
}

@media only screen and (max-width: 991px) {
  .case-detail-box {
    margin-bottom: 20px;
  }
  .case-detail-box img {
    margin-top: 15px;
  }
  .case-detail-box .txt {
    padding-top: 15px;
    padding-left: 15px;
    padding-right: 15px;
  }
}

/*-------------------------------
 * 6. NEWS
 * ----------------------------*/
#news-wrap,
#otoiawase-wrap {
  margin-top: -20px;
}

#news-wrap .section-ttl-txt,
#otoiawase-wrap .section-ttl-txt {
  color: #2b71b8;
  font-size: 56px;
}

@media only screen and (max-width: 767px) {
  #news-wrap,
  #otoiawase-wrap {
    margin-top: 0;
  }
  #news-wrap .section-ttl-txt,
  #otoiawase-wrap .section-ttl-txt {
    font-size: 25px;
  }
}

#news-wrap .ttl-line,
#otoiawase-wrap .ttl-line {
  margin: 28px 50px 60px;
  padding-bottom: 5px;
  font-family: "Roboto Condensed", sans-serif !important;
  letter-spacing: 0.1em;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1.45;
  color: #2b71b8;
  font-size: 33px;
  border-bottom: 1px solid #dbdcdc;
  position: relative;
}

#news-wrap .ttl-line .ttl-line-sub,
#otoiawase-wrap .ttl-line .ttl-line-sub {
  display: inline-block;
  margin-left: 5px;
  color: #231916;
  font-size: 13px;
  letter-spacing: 0.03em;
}

#news-wrap .ttl-line .txt-link,
#otoiawase-wrap .ttl-line .txt-link {
  display: block;
  margin: 0;
  position: absolute;
  top: 25px;
  right: 0;
  font-size: 12px;
}

@media only screen and (max-width: 767px) {
  #news-wrap .ttl-line,
  #otoiawase-wrap .ttl-line {
    margin: 0 15px 20px;
    border-bottom: none;
    text-align: center;
    font-size: 25px;
  }
  #news-wrap .ttl-line .ttl-line-sub,
  #otoiawase-wrap .ttl-line .ttl-line-sub {
    display: block;
    margin-top: 9px;
    font-size: 12px;
  }
  #news-wrap .ttl-line .txt-link,
  #otoiawase-wrap .ttl-line .txt-link {
    position: relative;
    top: 0;
    left: 0;
    text-align: center;
    margin-top: 30px;
  }
}

#news-wrap .waku-box,
#otoiawase-wrap .waku-box {
  padding: 60px;
  background-color: #fff;
  border: 1px solid #dbdcdc;
  margin: 0 50px;
}

@media only screen and (max-width: 767px) {
  #news-wrap .waku-box,
  #otoiawase-wrap .waku-box {
    margin: 0;
    padding: 15px;
  }
}

#news-wrap .txt-detail p,
#otoiawase-wrap .txt-detail p {
  font-size: 14px;
  line-height: 2.35;
  margin-bottom: 30px;
}

#news-wrap .txt-detail p:last-of-type,
#otoiawase-wrap .txt-detail p:last-of-type {
  margin-bottom: 0;
}

@media only screen and (max-width: 767px) {
  #news-wrap .txt-detail p,
  #otoiawase-wrap .txt-detail p {
    font-size: 12px;
    line-height: 1.8;
    margin-bottom: 10px;
  }
}

#news-wrap ul.news-list,
#otoiawase-wrap ul.news-list {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

#news-wrap ul.news-list li,
#otoiawase-wrap ul.news-list li {
  padding: 40px 0;
  border-bottom: 1px solid #dbdcdc;
}

#news-wrap ul.news-list li:first-of-type,
#otoiawase-wrap ul.news-list li:first-of-type {
  padding-top: 0;
}

#news-wrap ul.news-list li:last-of-type,
#otoiawase-wrap ul.news-list li:last-of-type {
  border-bottom: none;
  padding-bottom: 0;
}

#news-wrap ul.news-list.detail li:last-of-type,
#otoiawase-wrap ul.news-list.detail li:last-of-type {
  border-bottom: 1px solid #dbdcdc;
  padding-bottom: 40px;
  margin-bottom: 40px;
}

#news-wrap ul.news-list li .img,
#otoiawase-wrap ul.news-list li .img {
  float: left;
  width: 135px;
}

#news-wrap ul.news-list li a,
#otoiawase-wrap ul.news-list li a {
  display: block;
  color: #231916;
}

#news-wrap ul.news-list li a:focus,
#otoiawase-wrap ul.news-list li a:focus {
  overflow: visible;
}

#news-wrap ul.news-list li .txt,
#otoiawase-wrap ul.news-list li .txt {
  padding-left: 165px;
}

#news-wrap ul.news-list li .txt a,
#otoiawase-wrap ul.news-list li .txt a {
  color: #231916;
}

#news-wrap ul.news-list li .sub,
#otoiawase-wrap ul.news-list li .sub {
  margin: 10px 0;
  font-size: 15px;
  line-height: 2;
  letter-spacing: 0.08em;
  font-weight: normal;
}

#news-wrap ul.news-list.detail li .sub,
#otoiawase-wrap ul.news-list.detail li .sub {
  margin-top: 0;
}

#news-wrap ul.news-list li:before,
#otoiawase-wrap ul.news-list li:before,
#news-wrap ul.news-list li:after,
#otoiawase-wrap ul.news-list li:after {
  content: " ";
  display: table;
}

#news-wrap ul.news-list li:after,
#otoiawase-wrap ul.news-list li:after {
  clear: both;
}

@media only screen and (max-width: 767px) {
  #news-wrap ul.news-list li,
  #otoiawase-wrap ul.news-list li {
    padding: 15px 0;
  }
  #news-wrap ul.news-list.detail li:last-of-type,
  #otoiawase-wrap ul.news-list.detail li:last-of-type {
    padding-bottom: 15px;
    margin-bottom: 15px;
  }
  #news-wrap ul.news-list li .img,
  #otoiawase-wrap ul.news-list li .img {
    width: 80px;
  }
  #news-wrap ul.news-list li .txt,
  #otoiawase-wrap ul.news-list li .txt {
    padding-left: 95px;
  }
  #news-wrap ul.news-list li .txt .txt-gray,
  #otoiawase-wrap ul.news-list li .txt .txt-gray {
    margin-bottom: 0;
  }
  #news-wrap ul.news-list li .sub,
  #otoiawase-wrap ul.news-list li .sub {
    margin-top: 0;
    font-size: 12px;
    letter-spacing: 0;
  }
}

#news-wrap ul.news-list li .icon,
#otoiawase-wrap ul.news-list li .icon {
  display: inline-block;
  margin-left: 20px;
  padding-left: 8px;
  padding-right: 8px;
  min-width: 88px;
  height: 18px;
  line-height: 17px;
  font-size: 11px;
  text-align: center;
  color: #fff;
  background-color: #2b71b8;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
}

#news-wrap ul.news-list li a:hover .icon,
#otoiawase-wrap ul.news-list li a:hover .icon {
  text-decoration: none;
}

@media only screen and (max-width: 767px) {
  #news-wrap ul.news-list li .icon,
  #otoiawase-wrap ul.news-list li .icon {
    min-width: 60px;
    height: auto;
    margin-left: 10px;
    padding: 3px 5px 4px;
    font-size: 10px;
    line-height: 1.45;
  }
}

@media only screen and (max-width: 767px) {
  #news-wrap .txt-detail img {
    max-width: 100% !important;
    height: auto !important;
  }
}

/*-------------------------------
 * 7. FEATURE
 * ----------------------------*/
/* 7.1 Reason
 * ------------------------------*/
#feature-reason-list .col-xs-12 {
  padding: 25px 150px 20px;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
}

@media only screen and (max-width: 1199px) {
  #feature-reason-list .col-xs-12 {
    padding-left: 100px;
    padding-right: 100px;
  }
}

@media only screen and (max-width: 991px) {
  #feature-reason-list .col-xs-12 {
    padding-left: 60px;
    padding-right: 60px;
  }
}

@media only screen and (max-width: 767px) {
  #feature-reason-list .col-xs-12 {
    padding: 15px 15px 10px;
  }
}

#feature-reason-list ul.list {
  width: 100%;
  margin: 0;
  padding: 0;
  list-style-type: none;
  display: table;
  table-layout: fixed;
}

#feature-reason-list ul.list li {
  display: table-cell;
  text-align: center;
}

#feature-reason-list ul.list li .img {
  transition: opacity 400ms cubic-bezier(0.215, 0.61, 0.355, 1);
}

#feature-reason-list ul.list li a {
  color: #231916;
}

#feature-reason-list ul.list li a:first-child {
  display: block;
  margin: 0 auto;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

#feature-reason-list ul.list li a:nth-child(2) {
  color: #231916;
  display: inline-block;
  font-size: 13px;
  margin-top: 15px;
}

@media only screen and (max-width: 767px) {
  #feature-reason-list ul.list li a:nth-child(2) {
    font-size: 11px;
    margin-top: 10px;
  }
}

#feature-reason-list ul.list li a:hover,
#feature-reason-list ul.list li a.hovered {
  text-decoration: none;
}

#feature-reason-list ul.list li a:hover img,
#feature-reason-list ul.list li a.hovered img {
  opacity: 0;
}

#feature-reason-list ul.list li.reason1 a:first-child {
  background-image: url(../image/feature/pict-fapc-white.png);
}

#feature-reason-list ul.list li.reason2 a:first-child {
  background-image: url(../image/feature/pict-server-white.png);
}

#feature-reason-list ul.list li.reason3 a:first-child {
  background-image: url(../image/feature/pict-storage-white.png);
}

#feature-reason-list ul.list li.reason4 a:first-child {
  background-image: url(../image/feature/pict-pcwork-white.png);
}

#feature-reason-list ul.list li.reason5 a:first-child {
  background-image: url(../image/feature/pict-solution-white.png);
}

#feature-reason-list ul.list li .img,
#feature-reason-list ul.list li a:first-child {
  width: 90px;
  height: 90px;
}

@media only screen and (max-width: 767px) {
  #feature-reason-list ul.list li .img,
  #feature-reason-list ul.list li a:first-child {
    width: 55px;
    height: 55px;
  }
}

#feature-reason p {
  font-size: 14px;
  line-height: 2;
}

@media only screen and (max-width: 767px) {
  #feature-reason p {
    font-size: 12px;
  }
}

#feature-reason .txt-area {
  padding: 50px;
  overflow: hidden;
  box-sizing: border-box;
}

@media only screen and (max-width: 1199px) {
  #feature-reason .txt-area {
    padding: 40px;
  }
}

@media only screen and (max-width: 767px) {
  #feature-reason .txt-area {
    height: auto;
    padding: 20px 15px;
  }
}

#feature-reason .txt-area h2 {
  margin: 0 0 20px;
  font-size: 38px;
  line-height: 1;
  font-weight: 500;
  letter-spacing: 0.1em;
  position: relative;
}

@media only screen and (max-width: 991px) {
  #feature-reason .txt-area h2 {
    font-size: 28px;
  }
}

@media only screen and (max-width: 767px) {
  #feature-reason .txt-area h2 {
    font-size: 25px;
    margin-bottom: 15px;
  }
}

#feature-reason .txt-area h2 .txt-cap {
  display: block;
  font-size: 16px;
  font-family: "Roboto Condensed", sans-serif !important;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: #2b71b8;
}

@media only screen and (max-width: 991px) {
  #feature-reason .txt-area h2 .txt-cap {
    font-size: 12px;
    margin-bottom: 3px;
  }
}

#feature-reason .txt-area h2 .num {
  display: inline-block;
  margin-right: 12px;
  font-size: 67px;
  font-family: "Roboto Condensed", sans-serif !important;
  font-weight: 600;
  letter-spacing: 0.03em;
  color: #2b71b8;
}

@media only screen and (max-width: 991px) {
  #feature-reason .txt-area h2 .num {
    font-size: 45px;
  }
}

#feature-reason .txt-area h2 .sub {
  position: absolute;
  font-weight: 500;
}

@media only screen and (max-width: 991px) {
  #feature-reason .txt-area h2 .sub {
    font-size: 11px;
    top: 10px;
  }
}

@media only screen and (min-width: 992px) {
  #feature-reason .txt-area h2 .sub {
    font-size: 14px;
  }
}

#feature-reason .txt-area h2 p {
  font-size: 14px;
  line-height: 2;
}

@media only screen and (max-width: 767px) {
  #feature-reason .txt-area h2 p {
    font-size: 12px;
  }
}

@media only screen and (max-width: 1199px) {
  #feature-reason .txt-area p.f14 {
    font-size: 13px;
  }
}

@media only screen and (max-width: 991px) {
  #feature-reason .txt-area p.f14 {
    font-size: 12px;
  }
}

#feature-reason .img-area {
  overflow: hidden;
  padding: 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

#feature-reason .img-area.reason01 {
  background-image: url(../image/feature/ph-reason01.jpg);
}

#feature-reason .img-area.reason02 {
  background-image: url(../image/feature/ph-reason02.jpg);
}

#feature-reason .img-area.reason03 {
  background-image: url(../image/feature/ph-reason03.jpg);
}

#feature-reason .img-area.reason04 {
  background-image: url(../image/feature/ph-reason04.jpg);
}

#feature-reason .img-area.reason05 {
  background-image: url(../image/feature/ph-reason05.jpg);
}

#feature-reason .row-flex {
  -ms-flex-line-pack: stretch;
  align-content: stretch;
}

@media only screen and (max-width: 767px) {
  #feature-reason .row-flex {
    display: block;
  }
}

#feature-reason .row-flex > .col-xs-6,
#feature-reason .row-flex > .col-sm-6,
#feature-reason .row-flex > .col-md-6,
#feature-reason .row-flex > .col-lg-6,
#feature-reason .row-flex > .col-xs-7,
#feature-reason .row-flex > .col-sm-7,
#feature-reason .row-flex > .col-md-7,
#feature-reason .row-flex > .col-lg-7,
#feature-reason .row-flex > .col-xs-8,
#feature-reason .row-flex > .col-sm-8,
#feature-reason .row-flex > .col-md-8,
#feature-reason .row-flex > .col-lg-8,
#feature-reason .row-flex > .col-xs-9,
#feature-reason .row-flex > .col-sm-9,
#feature-reason .row-flex > .col-md-9,
#feature-reason .row-flex > .col-lg-9,
#feature-reason .row-flex > .col-xs-10,
#feature-reason .row-flex > .col-sm-10,
#feature-reason .row-flex > .col-md-10,
#feature-reason .row-flex > .col-lg-10,
#feature-reason .row-flex > .col-xs-11,
#feature-reason .row-flex > .col-sm-11,
#feature-reason .row-flex > .col-md-11,
#feature-reason .row-flex > .col-lg-11,
#feature-reason .row-flex > .col-xs-12,
#feature-reason .row-flex > .col-sm-12,
#feature-reason .row-flex > .col-md-12,
#feature-reason .row-flex > .col-lg-12 {
  display: block;
}

@media only screen and (max-width: 767px) {
  #feature-reason .img-area {
    height: 200px;
  }
}

#feature-reason-tantou h2 {
  margin: 0 0 20px;
  font-size: 32px;
  font-weight: 500;
  color: #2b71b8;
  letter-spacing: 0.08em;
  line-height: 1.8;
  text-align: center;
}

#feature-reason-tantou h3 {
  margin: 0 0 60px;
  font-size: 23px;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1.8;
  text-align: center;
}

@media only screen and (max-width: 991px) {
  #feature-reason-tantou h2 {
    font-size: 25px;
  }
  #feature-reason-tantou h3 {
    margin-bottom: 40px;
    font-size: 20px;
  }
}

@media only screen and (max-width: 767px) {
  #feature-reason-tantou h2 {
    font-size: 17px;
  }
  #feature-reason-tantou h3 {
    margin-bottom: 10px;
    font-size: 14px;
  }
  #feature-reason-tantou .row-flex {
    display: block;
  }
  #feature-reason-tantou .row-flex .btn {
    margin-top: 15px;
  }
}

/* 7.2 Guidance
 * ------------------------------*/
#feature-guidance .guidance-img {
  width: 170px;
  display: block;
  margin: -40px auto 0;
}

@media only screen and (max-width: 767px) {
  #feature-guidance .guidance-img {
    width: 120px;
    height: auto;
    margin-top: -20px;
  }
}

#feature-guidance .point {
  height: 190px;
  padding: 20px 15px;
  text-align: center;
  border-right: 1px solid #9fa0a0;
  border-bottom: 1px solid #9fa0a0;
  overflow: hidden;
  box-sizing: border-box;
}

#feature-guidance .point:nth-child(2n) {
  border-right: none;
}

#feature-guidance .point p {
  font-size: 15px;
  letter-spacing: 0;
  line-height: 2;
}

#feature-guidance .point .num {
  display: block;
  margin-bottom: 10px;
  font-family: "Roboto Condensed", sans-serif !important;
  letter-spacing: 0.03em;
  font-weight: 600;
  font-size: 44px;
  color: #2b71b8;
  line-height: 1;
}

@media only screen and (max-width: 1199px) {
  #feature-guidance .point p {
    font-size: 14px;
  }
}

@media only screen and (max-width: 991px) {
  #feature-guidance .point p {
    font-size: 12px;
  }
}

@media only screen and (max-width: 767px) {
  #feature-guidance .point {
    height: auto;
    padding: 20px 0 10px;
    text-align: left;
    border-right: none;
  }
  #feature-guidance .point .num {
    font-size: 33px;
    text-align: center;
  }
}

/***** 7.2.1 Timeline *****/
.timeline {
  margin: 0;
  padding: 20px 0 60px;
  list-style-type: none;
  position: relative;
}

@media only screen and (max-width: 767px) {
  .timeline {
    padding: 0;
  }
}

.timeline:before {
  top: 0;
  bottom: 0;
  position: absolute;
  content: " ";
  width: 5px;
  /*background-color: #9fa0a0;*/
  background: url(../image/flow-dot.png) center center repeat-y;
  left: 50%;
  margin-left: -1.5px;
}

@media only screen and (max-width: 767px) {
  .timeline:before {
    display: none;
  }
}

.timeline li {
  width: 100%;
  margin: 0 0 20px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
}

.timeline li:before,
.timeline li:after {
  content: "";
  display: table;
}

.timeline li:after {
  clear: both;
}

@media only screen and (max-width: 767px) {
  .timeline li {
    margin-bottom: 25px;
  }
}

.timeline li div {
  vertical-align: middle;
}

@media only screen and (max-width: 767px) {
  .timeline li,
  .timeline li div {
    display: block;
  }
}

/** panel arrows **/
.timeline li .timeline-panel {
  width: 48%;
  padding-right: 50px;
  position: relative;
}

.timeline li .timeline-panel p {
  display: block;
  margin: 0;
  background: #eaebe9;
  font-size: 14px;
  padding: 25px 30px;
}

.timeline li .timeline-panel:before {
  position: absolute;
  top: 50%;
  right: -50px;
  display: block;
  width: 50px;
  border-top: 2px solid #eaebe9;
  content: " ";
}

.timeline li .timeline-panel:after {
  position: absolute;
  top: 50%;
  right: -50px;
  display: block;
  width: 50px;
  border-top: 2px solid #eaebe9;
  content: " ";
}

.timeline li .timeline-panel.noarrow:before,
.timeline li .timeline-panel.noarrow:after {
  top: 0;
  right: 0;
  display: none;
  border: 0;
}

/**** IE *****/
@media all and (-ms-high-contrast: none) {
  .timeline li .timeline-panel:before {
    top: 50%;
  }
}

@media only screen and (max-width: 767px) {
  .timeline li .timeline-panel {
    width: 100%;
    padding-right: 0;
  }
  .timeline li .timeline-panel p {
    padding: 15px;
  }
  .timeline li .timeline-panel:before,
  .timeline li .timeline-panel:after {
    display: none;
  }
}

.timeline li .timeline-panel.timeline-right {
  padding-right: 0;
  padding-left: 50px;
}

.timeline li .timeline-panel.timeline-right:before {
  border-left-width: 0;
  border-right-width: 50px;
  background: none;
  left: -50px;
  right: auto;
}

.timeline li .timeline-panel.timeline-right:after {
  border-left-width: 0;
  border-right-width: 50px;
  left: -50px;
  right: auto;
}

@media only screen and (max-width: 767px) {
  .timeline li .timeline-panel.timeline-right {
    padding-left: 0;
  }
}

.timeline li .timeline-panel.sub-left {
  padding-right: 55px;
  background: none;
  text-align: right;
}

.timeline li .timeline-panel.sub-right {
  padding-left: 55px;
  background: none;
  text-align: left;
}

.timeline li .timeline-panel.sub-left h2,
.timeline li .timeline-panel.sub-right h2 {
  margin: 0;
  color: #2b71b8;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.08em;
}

@media only screen and (max-width: 767px) {
  .timeline li .timeline-panel.sub-left {
    padding-right: 0;
    text-align: left;
  }
  .timeline li .timeline-panel.sub-right {
    padding-left: 0;
  }
  .timeline li .timeline-panel.sub-left h2,
  .timeline li .timeline-panel.sub-right h2 {
    margin: 4px 0 15px 30px;
    font-size: 15px;
  }
}

/** timeline circle icons **/
.timeline li .tl-circ {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 50%;
  text-align: center;
  background: #2b71b8;
  color: #fff;
  width: 40px;
  height: 40px;
  line-height: 40px;
  margin-left: -20px;
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  z-index: 100;
  font-size: 24px;
  font-weight: 600;
  font-family: "Roboto Condensed", sans-serif !important;
}

@media only screen and (max-width: 767px) {
  .timeline li .tl-circ {
    margin: 0;
    left: 0;
    width: 25px;
    height: 25px;
    line-height: 25px;
    margin-left: 0;
    font-size: 20px;
  }
}

/** timeline end 納品 **/
.timeline-end-nouhin {
  display: block;
  width: 280px;
  height: 52px;
  margin: 0 auto;
  line-height: 51px;
  text-align: center;
  background: #2b71b8;
  color: #fff;
  border-radius: 20px;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.2em;
}

@media only screen and (max-width: 767px) {
  .timeline-end-nouhin {
    width: auto;
    height: 40px;
    line-height: 40px;
    font-size: 15px;
    margin-bottom: 5px;
    border-radius: 10px;
  }
}

/* 7.2.1.1 timeline company-history */
.timeline.cm-history {
  padding: 0 0 30px;
}

.timeline.cm-history li:first-of-type {
  background-color: #fff;
}

.timeline.cm-history li .timeline-panel {
  width: 55%;
  padding-right: 70px;
}

.timeline.cm-history li .timeline-panel.timeline-right {
  padding-right: 0;
  padding-left: 70px;
}

.timeline.cm-history li .timeline-panel:before {
  right: -80px;
}

.timeline.cm-history li .timeline-panel:after {
  right: -80px;
}

.timeline.cm-history li .timeline-panel.timeline-right:before {
  left: -80px;
}

.timeline.cm-history li .timeline-panel.timeline-right:after {
  left: -80px;
}

@media only screen and (max-width: 767px) {
  .timeline.cm-history {
    padding-bottom: 0;
  }
  .timeline.cm-history li {
    margin-bottom: 20px;
  }
  .timeline.cm-history li:last-of-type {
    margin-bottom: 0;
  }
  .timeline.cm-history li .timeline-panel {
    width: 100%;
    padding-right: 0;
  }
  .timeline.cm-history li .timeline-panel.timeline-right {
    padding-left: 0;
  }
}

.timeline.cm-history li .tl-day {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 50%;
  margin-left: -40px;
  text-align: center;
  width: 80px;
  height: 60px;
  line-height: 1.6;
  color: #2b71b8;
  background-color: #fff;
  font-size: 17px;
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .timeline.cm-history li .tl-day {
    position: relative;
    left: 0;
    margin: 0 0 10px 0;
    width: auto;
    height: auto;
    text-align: left;
  }
}

/* 7.3 Quality
 * ------------------------------*/
#feature-quality .boxW {
  padding: 70px 55px !important;
}

@media only screen and (max-width: 991px) {
  #feature-quality .boxW {
    padding: 40px !important;
  }
}

@media only screen and (max-width: 767px) {
  #feature-quality .boxW {
    padding: 15px !important;
  }
}

#feature-quality .row {
  margin-bottom: 60px;
}

#feature-quality .row:last-of-type {
  margin-bottom: 0;
}

#feature-quality .row .col-xs-12 {
  padding-right: 30px;
  padding-left: 30px;
}

#feature-quality h2 {
  margin: 50px 0 30px;
  padding-bottom: 10px;
  font-size: 19px;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1.7;
  border-bottom: 1px solid #9fa0a0;
}

@media only screen and (max-width: 1199px) {
  #feature-quality h2 {
    margin-top: 0;
  }
}

@media only screen and (max-width: 991px) {
  #feature-quality .row {
    margin-bottom: 40px;
  }
  #feature-quality .row .col-xs-12 {
    padding-right: 15px;
    padding-left: 15px;
  }
  #feature-quality h2 {
    margin-bottom: 10px;
    font-size: 15px;
  }
}

@media only screen and (max-width: 767px) {
  #feature-quality .row {
    margin-bottom: 20px;
  }
  #feature-quality h2 {
    margin: 10px 0;
  }
}

/*-------------------------------
 * 8. COMPANY
 * ----------------------------*/
/* 8.1 Message
 * ---------------------------*/
#message-wrap p {
  font-size: 14px;
  line-height: 2;
}

@media only screen and (max-width: 767px) {
  #message-wrap p {
    font-size: 12px;
  }
}

#message-wrap h3 {
  margin: 0 0 37px;
  font-size: 25px;
  line-height: 1.9;
  letter-spacing: 0.08em;
  position: relative;
  left: 0.04em;
}

@media only screen and (max-width: 767px) {
  #message-wrap h3 {
    margin: 0 0 20px;
    font-size: 18px;
  }
}

#message-wrap h4 {
  font-size: 18px;
  margin-bottom: 65px;
  display: block;
  letter-spacing: 0.08em;
  position: relative;
  left: 0.04em;
}

@media only screen and (max-width: 767px) {
  #message-wrap h4 {
    font-size: 14px;
    margin-bottom: 30px;
  }
}

#message-wrap .row {
  margin-left: -27px;
  margin-right: -27px;
}

@media only screen and (max-width: 991px) {
  #message-wrap .row {
    margin-left: -17.5px;
    margin-right: -17.5px;
  }
}

#message-wrap .col-xs-12 {
  padding-left: 27px;
  padding-right: 27px;
}

@media only screen and (max-width: 991px) {
  #message-wrap .col-xs-12 {
    padding-left: 17.5px;
    padding-right: 17.5px;
  }
}

#message-wrap .line-height2 {
  text-align: justify;
}

#message-wrap .line-height2 + .line-height2 {
  margin-top: 27px;
}

/* 8.2 Profile
 * ---------------------------*/
#profile-wrap .row {
  margin-left: -26px;
  margin-right: -26px;
}

#profile-wrap .row .col-xs-12 {
  padding-left: 26px;
  padding-right: 26px;
}

#profile-wrap .row-ttl {
  margin-top: 84px;
  margin-bottom: 40px;
}

@media only screen and (max-width: 767px) {
  #profile-wrap .row-ttl {
    margin-top: 40px;
    margin-bottom: 0;
  }
}

#profile-wrap dd .row {
  margin-left: -10px;
  margin-right: -10px;
}

#profile-wrap dd .row .col-xs-12 {
  padding-left: 10px;
  padding-right: 10px;
}

@media only screen and (min-width: 768px) {
  #profile-table1 dt {
    width: 30%;
  }
}

@media only screen and (min-width: 992px) {
  #profile-table1 dl dt,
  #profile-table1 dl dd {
    padding-top: 31px;
    padding-bottom: 31px;
  }
}

@media only screen and (min-width: 1200px) {
  #profile-table1 dl dt,
  #profile-table1 dl dd {
    padding-top: 23px;
    padding-bottom: 23px;
  }
}

@media only screen and (max-width: 767px) {
  #profile-table2 dl {
    border-top: none;
  }
}

@media only screen and (min-width: 768px) {
  #profile-table2 dt {
    width: 30%;
  }
}

/* 8.3 Access & Policy
 * ---------------------------*/
.row-access + .row-access {
  margin-top: 80px;
}

@media only screen and (max-width: 767px) {
  .row-access + .row-access {
    margin-top: 40px;
  }
}

.row-access .square-ttl {
  padding-left: 1.33333em;
  padding-bottom: 15px;
  letter-spacing: 0.1em;
  margin-bottom: 30px;
  position: relative;
  border-bottom: 1px solid #9fa0a0;
}

@media only screen and (max-width: 767px) {
  .row-access .square-ttl {
    font-size: 15px;
  }
}

@media only screen and (min-width: 768px) {
  .row-access .square-ttl {
    font-size: 16px;
  }
}

@media only screen and (min-width: 992px) {
  .row-access .square-ttl {
    font-size: 18px;
  }
}

.row-access .square-ttl:before {
  content: "■";
  color: #2b71b8;
  position: absolute;
  left: 0;
}

.row-access p {
  font-size: 13px;
}

@media only screen and (max-width: 767px) {
  .row-access p {
    font-size: 12px;
  }
}

.row-policy .square-ttl {
  margin-top: 40px;
  margin-bottom: 20px;
  line-height: 1.5;
}

.row-policy ul,
.row-policy ol {
  margin: 10px 0;
  padding: 0;
  list-style-type: disc;
}

.row-policy ul li,
.row-policy ol li {
  margin: 0 0 0 20px;
  padding: 0;
  font-size: 13px;
  line-height: 1.8;
  letter-spacing: 0.08em;
}

@media only screen and (max-width: 767px) {
  .row-policy ul li,
  .row-policy ol li {
    font-size: 12px;
    letter-spacing: 0;
  }
}

.row-policy ol {
  list-style-type: lower-alpha;
}

.row-policy ol li {
  margin-left: 25px;
}

.row-policy .txt-box {
  float: right;
}

.row-policy .txt-box:before,
.row-policy .txt-box:after {
  content: "";
  display: table;
}

.row-policy .txt-box:after {
  clear: both;
}

.row-policy .waku-box {
  margin: 20px 0;
  padding: 10px 20px;
}

.row-policy .waku-box p {
  margin: 0;
}

.row-policy .waku-box p + p {
  margin-top: 10px;
}

.row-policy table {
  width: 100%;
  margin: 20px 0;
  font-size: 13px;
  line-height: 1.8;
  letter-spacing: 0.08em;
  border-collapse: collapse;
}

@media only screen and (max-width: 767px) {
  .row-policy table {
    font-size: 12px;
    letter-spacing: 0;
  }
}

.row-policy table th,
.row-policy table td {
  padding: 5px 10px;
  border: 1px solid #ccc;
}

.row-policy table th {
  text-align: center;
  font-weight: normal;
  background-color: #e9ebe8;
}

/*-------------------------------
 * 9. SITEMAP
 * ----------------------------*/
#sitemap-wrap a {
  color: #231916;
}

#sitemap-wrap .square-ttl {
  font-size: 15px;
  margin: 0;
  border-bottom: none;
}

@media only screen and (max-width: 767px) {
  #sitemap-wrap .square-ttl {
    font-size: 13px;
  }
}

#sitemap-wrap ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  font-size: 13px;
  line-height: 1.8;
  letter-spacing: 0.08em;
}

#sitemap-wrap ul li ul {
  margin-top: 0.5em;
  margin-bottom: 0.75em;
  margin-left: 48px;
}

#sitemap-wrap ul li ul li {
  margin-bottom: 0.25em;
  position: relative;
}

#sitemap-wrap ul li ul li::before {
  content: "";
  position: absolute;
  top: -0.5em;
  left: -16px;
  width: 10px;
  height: calc(100% + 0.75em);
  border-left: 1px solid #231916;
}

#sitemap-wrap ul li ul li:last-child::before {
  height: calc(1em + 0.25em);
}

#sitemap-wrap ul li ul li::after {
  content: "";
  position: absolute;
  top: 0.75em;
  left: -16px;
  width: 10px;
  border-bottom: 1px solid #231916;
}

@media only screen and (max-width: 767px) {
  #sitemap-wrap ul {
    font-size: 12px;
    letter-spacing: 0;
  }
}

/*-------------------------------
 * 10. CONTACT
 * ----------------------------*/
#otoiawase-wrap .section-ttl-ja h3.section-ttl-txt {
  color: #231916;
  font-size: 24px;
}

@media only screen and (max-width: 767px) {
  #otoiawase-wrap .section-ttl-ja h3.section-ttl-txt {
    font-size: 19px;
  }
}

#otoiawase-wrap .input-lg {
  font-size: 14px;
  font-weight: 300;
}

@media only screen and (max-width: 767px) {
  #otoiawase-wrap .input-lg {
    font-size: 12px;
  }
}

@media only screen and (max-width: 767px) {
  #otoiawase-wrap label {
    font-size: 13px;
  }
}

#otoiawase-wrap .hissu {
  color: #fff;
  background-color: #ee0101;
  display: inline-block;
  margin-left: 10px;
  line-height: 1;
  letter-spacing: 0.05em;
  padding: 3px 4px;
  font-weight: 300;
  font-size: 75%;
}

#otoiawase-wrap .tel {
  text-align: center;
  font-family: "Roboto Condensed", sans-serif !important;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-rendering: geometricPrecision;
  color: #2b71b8;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  letter-spacing: 0.05em;
  line-height: 1.6;
}

@media only screen and (max-width: 767px) {
  #otoiawase-wrap .tel {
    font-size: 27px;
  }
}

@media only screen and (min-width: 768px) {
  #otoiawase-wrap .tel {
    font-size: 24px;
  }
}

@media only screen and (min-width: 992px) {
  #otoiawase-wrap .tel {
    font-size: 35px;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }
  #otoiawase-wrap .tel:first-of-type {
    -ms-flex-pack: end;
    justify-content: flex-end;
  }
}

@media only screen and (min-width: 1200px) {
  #otoiawase-wrap .tel {
    font-size: 50px;
  }
}

#otoiawase-wrap .tel .area {
  color: #2b71b8;
  background-color: #fff;
  display: inline-block;
  font-weight: bold;
  text-align: center;
  line-height: 1;
  position: relative;
  color: #fff;
  background-color: #2b71b8;
  font-weight: 500;
  border-radius: 4px;
  margin-right: 15px;
}

@media only screen and (max-width: 767px) {
  #otoiawase-wrap .tel .area {
    font-size: 12px;
    padding: 5px 10px;
  }
}

@media only screen and (min-width: 768px) {
  #otoiawase-wrap .tel .area {
    font-size: 15px;
    padding: 7px 10px;
  }
}

@media only screen and (min-width: 992px) {
  #otoiawase-wrap .tel .area {
    font-size: 18px;
    padding: 10px 15px;
  }
}

@media only screen and (min-width: 1200px) {
  #otoiawase-wrap .tel .area {
    font-size: 23px;
  }
}

#agreeCnt {
  height: 200px;
  overflow-y: scroll;
  margin: 20px 0 5px;
  padding: 25px 35px;
  background: #f5f5f5;
  box-sizing: border-box;
}

@media only screen and (max-width: 767px) {
  #agreeCnt {
    font-size: 12px;
  }
}

@media only screen and (max-width: 767px) {
  .show-input-form a {
    word-break: break-all;
  }
}

.ssl_wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 20px;
}

@media only screen and (max-width: 767px) {
  .ssl_wrap {
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
  }
}

.ssl_wrap > div:first-child {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.ssl_wrap > div:not(:first-child) {
  padding-left: 15px;
}

@media only screen and (max-width: 767px) {
  .ssl_wrap > div:not(:first-child) {
    padding-left: 0;
  }
}

.mw_wp_form_confirm .hide-confirm {
  display: none;
}

.mw_wp_form_confirm p.f18 {
  margin-bottom: 15px;
}

.mw_wp_form_confirm .hissu {
  display: none !important;
}

@media only screen and (min-width: 768px) {
  .mw_wp_form_confirm .form-group {
    display: -ms-flexbox;
    display: flex;
  }
}

@media only screen and (max-width: 767px) {
  .mw_wp_form_confirm .form-group {
    padding-left: 15px;
    padding-right: 15px;
  }
}

.mw_wp_form_confirm .form-group.mt20,
.mw_wp_form_confirm .form-group.mt30 {
  margin-top: 0 !important;
  margin-bottom: 0;
}

.mw_wp_form_confirm .form-group.mt30 label,
.mw_wp_form_confirm .form-group.mt30 div {
  border-top: 1px solid #dbdcdc;
}

@media only screen and (max-width: 767px) {
  .mw_wp_form_confirm .form-group.mt30 div {
    border-top: none;
  }
}

.mw_wp_form_confirm .form-group label,
.mw_wp_form_confirm .form-group > div {
  border-bottom: 1px solid #dbdcdc;
  border-right: 1px solid #dbdcdc;
  padding-top: 10px;
  padding-bottom: 10px;
}

.mw_wp_form_confirm .form-group label {
  background-color: #efefef;
  border-left: 1px solid #dbdcdc;
  margin-bottom: 0;
}

@media only screen and (max-width: 767px) {
  .mw_wp_form_confirm .form-group > div {
    border-left: 1px solid #dbdcdc;
  }
}

.mw_wp_form_confirm .form-group .txt-red {
  display: none;
}

.mw_wp_form_confirm .form-group .hidden-confirm {
  display: none;
}

.line-table-box .formError,
.contact-form-wrap .formError {
  position: static !important;
  margin-top: 0 !important;
}

.line-table-box .formError .formErrorContent,
.contact-form-wrap .formError .formErrorContent {
  padding: 0;
  color: #ee0101;
  background-color: transparent;
  box-shadow: 0 0 0px #000;
  border: none;
  font-weight: 500;
}

.line-table-box .formError .formErrorArrow,
.contact-form-wrap .formError .formErrorArrow {
  display: none;
}

.nameformError + input,
.name_kanaformError + input,
.emailformError + input,
.company_nameformError + input {
  border-color: #ee0101;
  background-color: #ffefef;
}

.hurry label span {
  font-weight: bold;
  font-size: 15px;
  display: block;
  margin-top: -4px;
}

#checkbox_02-1 + span {
  font-size: 15px;
}

@media only screen and (max-width: 767px) {
  .hurry label span {
    display: block;
    margin-top: 0;
    line-height: 1.5;
    font-size: 13px;
  }
  #checkbox_02-1 + span {
    font-size: 13px;
  }
}

/* 10.1 Thanks Page
 * ---------------------------*/
#otoiawase-wrap .row-thanks .section-ttl {
  margin-bottom: 20px !important;
}

@media only screen and (max-width: 767px) {
  #otoiawase-wrap .row-thanks .section-ttl {
    margin-bottom: 0 !important;
  }
  #otoiawase-wrap .row-thanks .section-ttl-txt {
    font-size: 14px !important;
  }
}

#otoiawase-wrap .row-thanks .waku-box.info {
  width: 400px;
  padding: 20px !important;
  margin: 40px auto !important;
  background-color: #f1f1f1 !important;
}

#otoiawase-wrap .row-thanks .waku-box.info p {
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 2 !important;
}

@media only screen and (max-width: 767px) {
  #otoiawase-wrap .row-thanks .waku-box.info {
    width: auto;
    margin: 20px auto !important;
    padding: 15px !important;
  }
  #otoiawase-wrap .row-thanks .waku-box.info p {
    font-size: 12px !important;
    line-height: 1.8 !important;
  }
}

/*-------------------------------
 * 11. SIDE
 * ----------------------------*/
#side-wrap {
  padding-left: 10px;
}

@media only screen and (max-width: 767px) {
  #side-wrap {
    margin-top: 20px;
  }
}

#side-wrap .sub {
  margin: 40px 0 20px;
  padding: 15px 18px;
  font-size: 14px;
  line-height: 1.45;
  letter-spacing: 0.08em;
  color: #fff;
  background-color: #2b71b8;
}

#side-wrap .sub:first-of-type {
  margin-top: 0;
}

@media only screen and (max-width: 767px) {
  #side-wrap {
    padding-left: 15px;
  }
  #side-wrap .sub {
    margin-top: 20px;
    letter-spacing: 0;
  }
}

#side-wrap div.list ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

#side-wrap div.list ul a {
  color: #231916;
  display: block;
  font-weight: 500;
}

#side-wrap div.list ul a .wpp-thumbnail {
  display: block;
}

#side-wrap div.list ul li {
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.08em;
  margin: 0 0 20px;
  position: relative;
}

#side-wrap div.list ul li:before,
#side-wrap div.list ul li:after {
  content: " ";
  display: table;
}

#side-wrap div.list ul li:after {
  clear: both;
}

@media only screen and (max-width: 767px) {
  #side-wrap div.list ul li {
    margin-bottom: 10px;
    letter-spacing: 0;
  }
}

#side-wrap div.list ul.wpp-list li {
  font-size: 12px;
  min-height: 80px;
  overflow: hidden;
  display: -ms-flexbox;
  display: flex;
}

@media only screen and (max-width: 767px) {
  #side-wrap div.list ul.wpp-list li {
    margin-bottom: 20px;
  }
}

#side-wrap div.list ul.wpp-list li a:first-child {
  height: 80px;
  width: 80px !important;
  margin-right: 15px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  display: block;
}

#side-wrap div.list ul.wpp-list li img {
  width: 80px;
  height: 80px;
  margin: 0;
}

#side-wrap div.list ul.wpp-list li .num {
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 25px;
  height: 25px;
  line-height: 25px;
  background-color: #2b71b8;
  color: #fff;
  text-align: center;
  font-family: "Roboto Condensed", sans-serif !important;
}

#side-wrap ul.list {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

#side-wrap ul.list a {
  color: #231916;
  display: block;
  font-weight: 500;
}

#side-wrap ul.list a .wpp-thumbnail {
  display: block;
}

#side-wrap ul.list li {
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.08em;
  margin: 0 0 20px;
  position: relative;
}

#side-wrap ul.list li:before,
#side-wrap ul.list li:after {
  content: " ";
  display: table;
}

#side-wrap ul.list li:after {
  clear: both;
}

@media only screen and (max-width: 767px) {
  #side-wrap ul.list li {
    margin-bottom: 10px;
    letter-spacing: 0;
  }
}

#side-wrap ul.list.ph li {
  font-size: 12px;
  min-height: 80px;
  overflow: hidden;
  display: -ms-flexbox;
  display: flex;
}

@media only screen and (max-width: 767px) {
  #side-wrap ul.list.ph li {
    margin-bottom: 20px;
  }
}

#side-wrap ul.list.ph li a:first-child {
  height: 80px;
  width: 80px !important;
  margin-right: 15px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  display: block;
}

#side-wrap ul.list.ph li img {
  width: 80px;
  height: 80px;
  margin: 0;
}

#side-wrap ul.list.ph li .num {
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 25px;
  height: 25px;
  line-height: 25px;
  background-color: #2b71b8;
  color: #fff;
  text-align: center;
  font-family: "Roboto Condensed", sans-serif !important;
}

#side-wrap ul.category-list {
  padding-left: 0;
}

#side-wrap ul.category-list li {
  list-style: none;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 2;
}

#side-wrap ul.category-list li + li {
  margin-top: 15px;
}

#side-wrap ul.category-list li a {
  color: #231916;
}

#side-wrap div.list ul.wpp-list li a:first-child {
  position: relative;
  overflow: visible;
}

#side-wrap div.list ul li:before {
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 25px;
  height: 25px;
  line-height: 25px;
  background-color: #2b71b8;
  color: #fff;
  text-align: center;
  font-family: "Roboto Condensed", sans-serif !important;
  z-index: 3;
}

/*-------------------------------
 * 12. PAGINATION
 * ----------------------------*/
.pagination {
  display: block;
  padding: 0;
  margin: 40px auto 0;
  letter-spacing: 0.08em;
  line-height: 1.8;
  font-size: 15px;
  text-align: center;
}

@media only screen and (max-width: 767px) {
  .pagination {
    margin: 30px auto 20px;
    font-size: 12px;
    letter-spacing: 0;
  }
}

.pagination.navigation {
  margin-bottom: 80px;
}

@media only screen and (max-width: 767px) {
  .pagination.navigation {
    margin-bottom: 0;
  }
}

.pagination a {
  width: 100%;
  display: inline-block;
  padding: 6px 16px;
  margin-bottom: 5px;
  text-decoration: none;
  color: #231916;
  background-color: #fff;
  border: 1px solid #dbdcdc;
  margin: 0;
  position: relative;
  transition: all 400ms cubic-bezier(0.445, 0.05, 0.55, 0.95);
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

@media only screen and (min-width: 992px) {
  .pagination a {
    width: 30vw;
  }
}

@media only screen and (min-width: 1200px) {
  .pagination a {
    width: 29vw;
  }
}

@media only screen and (min-width: 1500px) {
  .pagination a {
    width: 24vw;
  }
}

.pagination a:hover {
  color: #fff;
  background-color: #2b71b8;
}

.pagination a:before,
.pagination a:after {
  font-size: 111%;
  line-height: 0.5;
  position: absolute;
  top: 16px;
}

@media only screen and (max-width: 767px) {
  .pagination a:before,
  .pagination a:after {
    top: 14px;
  }
}

.pagination a[rel="prev"] {
  padding-left: 30px;
}

.pagination a[rel="prev"]:before {
  content: "\66";
  font-family: "fanatic" !important;
  transform: rotateY(180deg);
  display: inline-block;
  left: 10px;
}

.pagination a[rel="next"] {
  padding-right: 30px;
}

.pagination a[rel="next"]:after {
  content: "\66";
  font-family: "fanatic" !important;
  display: inline-block;
  right: 10px;
}

@media only screen and (max-width: 767px) {
  .pagination a {
    margin-bottom: 5px;
  }
}

@media only screen and (min-width: 768px) {
  .pagination a {
    margin-bottom: 5px;
  }
}

.page-numbers.current {
  display: inline-block;
  padding: 3px 10px;
  color: #fff;
  background-color: #2b71b8;
  border: 1px solid #2b71b8;
}

.prev.page-numbers,
.next.page-numbers {
  border: none;
}

.prev.page-numbers:hover,
.next.page-numbers:hover {
  color: #2b71b8;
  background-color: #fff;
}

/*-------------------------------
 * 13. RECRUIT
 * ----------------------------*/
/* 13.1 Top Page
 * ---------------------------*/
.recruit-btn {
  margin: 50px auto;
}

@media only screen and (max-width: 767px) {
  .recruit-btn {
    margin: 30px auto;
  }
}

.recruit-btn .btn {
  height: 90px;
  font-size: 26px;
  letter-spacing: 0.1em;
  border-width: 3px;
}

@media only screen and (max-width: 767px) {
  .recruit-btn .btn {
    height: 60px;
    font-size: 16px;
    border-width: 2px;
  }
}

#tp-recruit-news {
  padding-top: 40px;
  margin-bottom: 80px;
}

@media only screen and (max-width: 767px) {
  #tp-recruit-news {
    margin-bottom: 40px;
  }
}

#tp-recruit-news .news ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

#tp-recruit-news .news ul li {
  width: 100%;
  display: table;
  margin: 0 0 20px;
  padding: 0 0 20px;
  border-bottom: 1px solid #cfcfd0;
}

#tp-recruit-news .news ul li:last-of-type {
  margin-bottom: 0;
}

#tp-recruit-news .news ul li div {
  display: table-cell;
  vertical-align: middle;
}

#tp-recruit-news .news ul li a {
  display: block;
  color: #231916;
}

@media only screen and (max-width: 767px) {
  #tp-recruit-news .news ul li {
    display: block;
    margin-bottom: 10px;
    padding-bottom: 10px;
  }
  #tp-recruit-news .news ul li div {
    display: inline-block;
  }
}

#tp-recruit-news .news ul li .icon {
  width: 95px;
}

#tp-recruit-news .news ul li .icon span {
  display: inline-block;
  width: 80px;
  height: 30px;
  line-height: 28px;
  padding: 0 5px;
  text-align: center;
  font-size: 13px;
  color: #fff;
}

#tp-recruit-news .news ul li .icon span.new-graduate {
  background-color: #53b9cb;
}

#tp-recruit-news .news ul li .icon span.mid-career {
  background-color: #005ba2;
}

#tp-recruit-news .news ul li .icon span.other {
  background-color: #a8a9a9;
}

@media only screen and (max-width: 767px) {
  #tp-recruit-news .news ul li .icon {
    width: 85px;
  }
  #tp-recruit-news .news ul li .icon span {
    width: 70px;
    height: 25px;
    line-height: 23px;
    font-size: 12px;
    margin-bottom: 5px;
  }
}

#tp-recruit-news .news li .txt {
  font-size: 16px;
  line-height: 1.8;
}

#tp-recruit-news .news li .day {
  width: 70px;
  color: #9fa0a0;
  font-size: 10px;
}

@media only screen and (max-width: 767px) {
  #tp-recruit-news .news li .txt {
    font-size: 12px;
    padding-left: 0;
  }
}

#tp-recruit-news .txt-link {
  top: -40px;
  right: 25px;
}

#tp-recruit-news .txt-detail p {
  font-size: 14px;
  line-height: 2.35;
  margin-top: 15px;
}

@media only screen and (max-width: 767px) {
  #tp-recruit-news .txt-link {
    margin-bottom: -20px;
  }
  #tp-recruit-news .txt-detail p {
    font-size: 12px;
    line-height: 1.8;
    margin-top: 10px;
  }
}

#tp-case.recruit {
  margin-bottom: 80px;
  padding: 80px 0 0;
  background-color: #2b71b8;
  color: #fff;
}

@media only screen and (max-width: 767px) {
  #tp-case.recruit {
    margin-bottom: 40px;
    padding-top: 40px;
  }
}

#tp-case.recruit .anime-line {
  background-color: #fff;
}

#case-slider.recruit {
  margin-top: 0;
}

#tp-links.recruit {
  margin-top: 0;
}

#tp-links.recruit .boxW {
  padding: 34px 15px;
}

@media only screen and (max-width: 991px) {
  #tp-links.recruit .boxW {
    padding: 27px;
  }
}

@media only screen and (max-width: 767px) {
  #tp-links.recruit .boxW {
    padding: 15px;
  }
}

#tp-consult.recruit .box-ttl {
  color: #2b71b8;
  margin-bottom: 15px;
}

#tp-consult.recruit .btn {
  height: 130px;
  font-size: 20px;
}

@media only screen and (max-width: 991px) {
  #tp-consult.recruit .btn {
    font-size: 15px;
  }
}

@media only screen and (max-width: 767px) {
  #tp-consult.recruit .btn {
    height: 78px;
    font-size: 14px;
  }
}

@media only screen and (max-width: 767px) {
  #tp-consult.recruit .row-flex {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  #tp-consult.recruit .row-flex > div + div {
    margin-top: 17.5px;
  }
  #tp-consult.recruit .row-flex div:first-of-type {
    margin-top: -10px;
  }
  #tp-consult.recruit .box-ttl {
    font-size: 16px;
    margin-top: 40px;
  }
}

#tp-consult.recruit.new-career .sub-blue {
  margin-top: 40px;
}

@media only screen and (max-width: 767px) {
  #tp-consult.recruit.new-career .sub-blue {
    margin-top: 20px;
  }
}

#tp-consult.recruit.new-career .box-ttl {
  margin-top: 30px;
  margin-bottom: 15px;
}

@media only screen and (max-width: 991px) {
  #tp-consult.recruit.new-career .box-ttl {
    margin-top: 30px;
  }
}

@media only screen and (max-width: 767px) {
  #tp-consult.recruit.new-career .box-ttl {
    margin-top: 20px;
  }
}

/* 13.2 New Graduate / Mid Career
 * ---------------------------*/
#recruit-catch {
  margin: -40px 0 80px;
  padding: 40px 0 60px;
  background-color: #fff;
}

@media only screen and (max-width: 767px) {
  #recruit-catch {
    margin-bottom: 40px;
    padding: 30px 0 20px;
  }
}

#recruit-catch.recruit-message {
  padding-bottom: 20px;
}

@media only screen and (max-width: 767px) {
  #recruit-catch.recruit-message {
    padding-bottom: 0;
  }
}

#recruit-catch.recruit-message .txt-catch,
#recruit-catch.recruit-message .txt-p2p {
  font-size: 35px;
}

@media only screen and (max-width: 991px) {
  #recruit-catch.recruit-message .txt-catch,
  #recruit-catch.recruit-message .txt-p2p {
    font-size: 30px;
  }
}

@media only screen and (max-width: 767px) {
  #recruit-catch.recruit-message .txt-catch,
  #recruit-catch.recruit-message .txt-p2p {
    font-size: 16px;
  }
}

#recruit-catch.recruit-message .txt-read {
  font-size: 21px;
  letter-spacing: 0.08em;
  font-weight: 300;
  line-height: 2;
}

@media only screen and (max-width: 991px) {
  #recruit-catch.recruit-message .txt-read {
    margin-top: 30px;
    font-size: 18px;
  }
}

@media only screen and (max-width: 767px) {
  #recruit-catch.recruit-message .txt-read {
    margin-top: 10px;
    font-size: 12px;
    letter-spacing: 0;
    line-height: 1.8;
  }
}

@media only screen and (min-width: 768px) {
  #recruit-catch.recruit-message .txt-catch,
  #recruit-catch.recruit-message .txt-p2p,
  #recruit-catch.recruit-message .txt-read {
    opacity: 0;
    transition: opacity 500ms ease-in-out;
  }
  #recruit-catch.recruit-message .js-display.txt-catch,
  #recruit-catch.recruit-message .js-display.txt-p2p,
  #recruit-catch.recruit-message .js-display.txt-read {
    opacity: 1;
  }
}

#recruit-finding ul.finding-list {
  width: 100%;
  padding: 0;
  margin: 20px 0 0;
  list-style-type: none;
  display: table;
  table-layout: fixed;
  border-collapse: separate;
}

#recruit-finding ul.finding-list li {
  display: table-cell;
  height: 240px;
  vertical-align: middle;
  margin: 0;
  background: #fff url(../image/recruit/icon-finding.png) center center
    no-repeat;
  color: #231916;
  border-top: 3px solid #e9ebe8;
  border-bottom: 3px solid #e9ebe8;
  border-right: 10px solid #e9ebe8;
  border-left: 10px solid #e9ebe8;
  position: relative;
}

#recruit-finding ul.finding-list li a {
  display: block;
  height: 240px;
  padding: 0 15px;
}

#recruit-finding ul.finding-list li a:hover {
  text-decoration: none;
}

#recruit-finding ul.finding-list.job-type li {
  padding-top: 50px;
  vertical-align: top;
  background-image: none;
}

@media only screen and (min-width: 768px) {
  #recruit-finding ul.finding-list.job-type li:hover {
    border: 3px solid #2b71b8;
  }
}

@media only screen and (max-width: 767px) {
  #recruit-finding ul.finding-list {
    display: block;
  }
  #recruit-finding ul.finding-list li {
    display: block;
    float: left;
    width: 50%;
    height: 250px;
    margin-top: 40px;
    padding: 40px 20px 10px;
    border-right: 10px solid #e9ebe8;
    border-left: 5px solid #e9ebe8;
  }
  #recruit-finding ul.finding-list.job-type li {
    padding: 40px 15px 10px;
  }
  #recruit-finding ul.finding-list li:nth-of-type(1),
  #recruit-finding ul.finding-list li:nth-of-type(2) {
    margin-top: 0;
  }
  #recruit-finding ul.finding-list li:nth-of-type(1) {
    border-left: none;
  }
  #recruit-finding ul.finding-list li:nth-child(2n) {
    border-right: none;
  }
  #recruit-finding ul.finding-list li:nth-child(3n) {
    border-left: none;
  }
  #recruit-finding ul.finding-list:before,
  #recruit-finding ul.finding-list:after {
    content: " ";
    display: table;
  }
  #recruit-finding ul.finding-list:after {
    clear: both;
  }
}

#recruit-finding ul.finding-list li .icon {
  display: block;
  width: 70px;
  height: 70px;
  border-radius: 35px;
  background-color: #2b71b8;
  padding-top: 16px;
  text-align: center;
  color: #fff;
  font-size: 38px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.05em;
  font-family: "Roboto Condensed", sans-serif !important;
  box-sizing: border-box;
  position: absolute;
  top: -35px;
  left: 0;
  right: 0;
  margin: auto;
}

@media only screen and (max-width: 991px) {
  #recruit-finding ul.finding-list li .icon {
    width: 54px;
    height: 54px;
    border-radius: 27px;
    padding-top: 12px;
    font-size: 30px;
    top: -27px;
  }
}

#recruit-finding ul.finding-list li .txt {
  margin: 0;
  font-size: 20px;
  letter-spacing: 0.08em;
  font-weight: 500;
  line-height: 1.6;
  text-align: center;
  color: #2b71b8;
}

#recruit-finding ul.finding-list li .txt.f22 {
  font-size: 22px;
}

@media only screen and (max-width: 991px) {
  #recruit-finding ul.finding-list li .txt {
    font-size: 17px !important;
  }
}

@media only screen and (max-width: 767px) {
  #recruit-finding ul.finding-list li .txt {
    font-size: 14px !important;
    letter-spacing: 0;
  }
}

#recruit-finding ul.finding-list.job-type li .sub {
  width: 85%;
  margin: auto;
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 2px solid #2b71b8;
  font-size: 24px;
  letter-spacing: 0.08em;
  font-weight: 500;
  line-height: 1.6;
  text-align: center;
  color: #2b71b8;
}

@media only screen and (max-width: 991px) {
  #recruit-finding ul.finding-list.job-type li .sub {
    width: 100%;
    font-size: 17px;
  }
}

@media only screen and (max-width: 767px) {
  #recruit-finding ul.finding-list.job-type li .sub {
    width: 100%;
    font-size: 15px;
  }
}

#recruit-finding ul.finding-list.job-type .icon-oubo {
  display: block;
  width: 150px;
  height: 18px;
  color: #fff;
  background-color: #2b71b8;
  font-size: 11px;
  line-height: 17px;
  text-align: center;
  margin: 20px auto 10px;
  padding-left: 8px;
  padding-right: 8px;
  min-width: 88px;
  border-radius: 4px;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  bottom: 25px;
}

@media only screen and (max-width: 767px) {
  #recruit-finding ul.finding-list.job-type .icon-oubo {
    width: auto;
    height: auto;
    padding: 3px 5px 4px;
    margin-left: 20px;
    margin-right: 20px;
    font-size: 10px;
    line-height: 1.45;
    bottom: 20px;
  }
}

/* 13.3 Message
 * ---------------------------*/
#feature-reason.recruit-message .row-flex {
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-line-pack: stretch;
  align-content: stretch;
}

#feature-reason.recruit-message .txt-area.bg-blue {
  padding: 90px 0;
  text-align: center;
  color: #fff;
  background-color: #2b71b8;
}

#feature-reason.recruit-message .txt-area.bg-blue h2 {
  margin: 0 0 30px;
  font-size: 38px;
  letter-spacing: 0.08em;
  line-height: 1;
}

#feature-reason.recruit-message .txt-area.bg-blue h3 {
  margin: 0;
  font-size: 25px;
  letter-spacing: 0.08em;
  line-height: 2;
  font-weight: 300;
}

@media only screen and (max-width: 1199px) {
  #feature-reason.recruit-message .txt-area.bg-blue {
    padding: 120px 0;
  }
}

@media only screen and (max-width: 991px) {
  #feature-reason.recruit-message .txt-area.bg-blue {
    padding: 180px 0;
  }
  #feature-reason.recruit-message .txt-area.bg-blue h2 {
    font-size: 30px;
  }
  #feature-reason.recruit-message .txt-area.bg-blue h3 {
    font-size: 20px;
  }
}

@media only screen and (max-width: 767px) {
  #feature-reason.recruit-message {
    margin-bottom: -30px;
  }
  #feature-reason.recruit-message .txt-area.bg-blue {
    padding: 20px 15px;
  }
  #feature-reason.recruit-message .txt-area.bg-blue h2 {
    margin-bottom: 10px;
    font-size: 18px;
    letter-spacing: 0;
    line-height: 1.45;
  }
  #feature-reason.recruit-message .txt-area.bg-blue h3 {
    font-size: 15px;
    letter-spacing: 0;
    line-height: 1.8;
  }
}

/* 13.4 Benefit Program
 * ---------------------------*/
#profile-wrap.recruit-benefit .boxW.box-benefit {
  padding: 70px 70px 0;
}

#profile-wrap.recruit-benefit .boxW.box-other {
  padding: 70px;
}

@media only screen and (max-width: 991px) {
  #profile-wrap.recruit-benefit .boxW.box-benefit {
    padding: 30px 30px 0;
  }
  #profile-wrap.recruit-benefit .boxW.box-other {
    padding: 30px;
  }
}

@media only screen and (max-width: 767px) {
  #profile-wrap.recruit-benefit .boxW.box-benefit {
    padding: 30px 15px 0;
  }
  #profile-wrap.recruit-benefit .boxW.box-other {
    padding: 40px 15px 15px;
  }
}

#profile-wrap .dl-table.recruit dl ol {
  padding-left: 25px;
}

@media only screen and (min-width: 768px) {
  #profile-wrap .dl-table.recruit dl dt {
    width: 37%;
  }
}

@media only screen and (max-width: 767px) {
  #profile-wrap .dl-table.recruit dl dd {
    text-align: left;
  }
}

/* 13.5 Interview
 * ---------------------------*/
#feature-reason.recruit-interview .row-flex {
  height: 420px;
  overflow: hidden;
}

#feature-reason.recruit-interview .txt-area {
  height: 320px;
  padding: 0 30px 0 50px;
  margin: 50px 0;
  border-right: 20px solid #fff;
  overflow: scroll;
  overflow-x: hidden;
}

#feature-reason.recruit-interview .txt-area {
  scrollbar-base-color: #2b71b8;
}

#feature-reason.recruit-interview .txt-area::-webkit-scrollbar {
  width: 5px;
  height: auto;
}

#feature-reason.recruit-interview .txt-area::-webkit-scrollbar-track {
  background: #fff;
}

#feature-reason.recruit-interview .txt-area::-webkit-scrollbar-thumb {
  background: #2b71b8;
}

@media only screen and (max-width: 1199px) {
  #feature-reason.recruit-interview .txt-area {
    height: 340px;
    padding: 0 20px 0 40px;
    margin: 40px 0;
  }
}

@media only screen and (max-width: 991px) {
  #feature-reason.recruit-interview .row-flex {
    height: 330px;
  }
  #feature-reason.recruit-interview .txt-area {
    height: 250px;
  }
}

@media only screen and (max-width: 767px) {
  #feature-reason.recruit-interview .row-flex {
    height: auto;
  }
  #feature-reason.recruit-interview .txt-area {
    border-right: none;
    height: auto;
    padding: 20px 15px;
    margin: 0;
    overflow: auto;
  }
}

#feature-reason.recruit-interview .txt-area .sub {
  margin: 0;
  font-size: 17px;
  line-height: 2;
  color: #2b71b8;
  letter-spacing: 0.03em;
}

#feature-reason.recruit-interview .txt-area .sub span {
  display: block;
  font-size: 14px;
  letter-spacing: 0.08em;
}

#feature-reason.recruit-interview .txt-area strong {
  font-size: 17px !important;
}

@media only screen and (max-width: 767px) {
  #feature-reason.recruit-interview .txt-area .sub {
    font-size: 13px;
    letter-spacing: 0;
  }
  #feature-reason.recruit-interview .txt-area .sub span {
    font-size: 12px;
    letter-spacing: 0;
  }
  #feature-reason.recruit-interview .txt-area strong {
    font-size: 13px !important;
  }
}

#feature-reason.recruit-interview .img-area.interview01 {
  background-image: url(../image/recruit/ph-interview01.jpg);
}

#feature-reason.recruit-interview .img-area.interview02 {
  background-image: url(../image/recruit/ph-interview02.jpg);
}

#feature-reason.recruit-interview .img-area.interview03 {
  background-image: url(../image/recruit/ph-interview03.jpg);
}

#feature-reason.recruit-interview .img-area.interview04 {
  background-image: url(../image/recruit/ph-interview04.jpg);
}

#feature-reason.recruit-interview .img-area.interview05 {
  background-image: url(../image/recruit/ph-interview05.jpg);
}

#feature-reason.recruit-interview .img-area.interview06 {
  background-image: url(../image/recruit/ph-interview06.jpg);
}

/* 13.6 Entry Form
 * ---------------------------*/
.recruit-entry .form-control.small {
  width: 20%;
  display: inline-block;
}

.recruit-entry label .f-normal {
  font-weight: normal;
}

@media only screen and (max-width: 767px) {
  .recruit-entry .section-ttl {
    margin-top: 10px;
  }
  .recruit-entry .form-control.small {
    width: 50%;
  }
}

/* 13.7 Contact Btn
 * ---------------------------*/
.recruit-contact-btn {
  width: 100%;
  margin-top: 60px;
  margin-bottom: 10px;
  display: table;
}

.recruit-contact-btn a {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  height: 100px !important;
  font-size: 25px !important;
  letter-spacing: 0.08em !important;
}

.recruit-contact-btn a:before {
  height: 96px !important;
}

@media only screen and (max-width: 767px) {
  .recruit-contact-btn {
    display: block;
    width: auto;
    margin-top: 20px;
    margin-bottom: 0;
  }
  .recruit-contact-btn a {
    display: block;
    height: 78px !important;
    line-height: 3.4 !important;
    font-size: 15px !important;
    letter-spacing: 0 !important;
  }
  .recruit-contact-btn a:before {
    height: 74px !important;
  }
}

.recruit-contact-wrap {
  padding: 30px 0 80px;
}

@media only screen and (max-width: 767px) {
  .recruit-contact-wrap {
    padding: 20px 0 0;
  }
}

/*-------------------------------
 * 14. P2P 追加 170808 (by kuma)
 * ----------------------------*/
.sub-p2p {
  margin: 10px 0 20px;
  font-size: 22px;
  font-weight: 500;
  text-align: center;
}

.txt-p2p-sup {
  text-align: right;
  margin: 30px 100px 0 0;
}

@media only screen and (max-width: 767px) {
  .sub-p2p {
    margin: 10px 0 20px;
    font-size: 16px;
  }
  .txt-p2p-sup {
    text-align: center;
    margin: 20px 0 0 0;
  }
}

/* 14.1 P2P Cate Nav
 * ---------------------------*/
#cate-ttl-nav.p2p-nav.top-nav {
  width: 100%;
  margin: 0;
  position: absolute;
  bottom: 0;
  left: 0;
}

@media only screen and (max-width: 479px) {
  #cate-ttl-nav.p2p-nav .container {
    padding-left: 0;
    padding-right: 0;
  }
  #cate-ttl-nav a {
    font-size: 8.4px;
    padding-left: 1px;
    padding-right: 1px;
  }
}

/* 14.2 P2P Menu
 * ---------------------------*/
#pd-menu.p2p-menu-wrap .boxW {
  padding: 30px 35px 35px;
}

@media only screen and (max-width: 767px) {
  #pd-menu.p2p-menu-wrap .boxW {
    padding: 15px;
  }
  #pd-menu.p2p-menu-wrap .txt-p2p {
    margin: 0 0 15px;
    font-size: 14px;
    letter-spacing: 0;
  }
}

#pd-menu ul.pd-menu-list.p2p-menu {
  margin: 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-align: stretch;
  align-items: stretch;
  -ms-flex-wrap: no-wrap;
  flex-wrap: no-wrap;
}

#pd-menu ul.pd-menu-list.p2p-menu li {
  display: block;
  width: 16%;
  padding: 0;
  vertical-align: middle;
  border: 3px solid #2b71b8;
  box-sizing: border-box;
}

#pd-menu ul.pd-menu-list.p2p-menu li a {
  padding: 50px 10px 15px;
}

@media only screen and (max-width: 991px) {
  #pd-menu ul.pd-menu-list.p2p-menu {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  #pd-menu ul.pd-menu-list.p2p-menu li {
    width: 32%;
    margin-top: 13px;
  }
}

@media only screen and (max-width: 767px) {
  #pd-menu ul.pd-menu-list.p2p-menu {
    display: block;
  }
  #pd-menu ul.pd-menu-list.p2p-menu li {
    width: auto;
    margin: 0 0 10px;
  }
  #pd-menu ul.pd-menu-list.p2p-menu li:last-of-type {
    margin-bottom: 0;
  }
  #pd-menu ul.pd-menu-list.p2p-menu li a {
    height: 78px;
    padding: 15px 15px 5px;
  }
}

#pd-menu ul.pd-menu-list.p2p-menu li .num {
  display: block;
  position: absolute;
  top: 5px;
  left: 0;
  right: 0;
  margin: auto;
  text-align: center;
  font-size: 24px;
  color: #2b71b8;
}

#pd-menu ul.pd-menu-list.p2p-menu li:hover .num {
  color: #fff;
}

@media only screen and (max-width: 991px) {
  #pd-menu ul.pd-menu-list.p2p-menu li .num {
    top: 0;
  }
}

@media only screen and (max-width: 767px) {
  #pd-menu ul.pd-menu-list.p2p-menu li .num {
    left: 20px;
    top: 13px;
    text-align: left;
    font-size: 20px;
  }
}

#pd-menu ul.pd-menu-list.p2p-menu .txt {
  height: 100px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
}

@media only screen and (max-width: 991px) {
  #pd-menu ul.pd-menu-list.p2p-menu .txt {
    height: auto;
    display: block;
  }
}

#pd-menu ul.pd-menu-list.p2p-menu li h3 {
  display: block;
  height: auto;
  margin: 0 0 10px;
  padding: 0;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.45;
  font-family: "Noto Sans Japanese", "Noto Sans CJK JP", "Noto Sans",
    "游ゴシック", "Yu Gothic", YuGothic, sans-serif !important;
}

#pd-menu ul.pd-menu-list.p2p-menu li h3 span {
  display: block;
  margin-top: 10px;
  font-size: 15px;
  font-weight: 600;
  font-family: "Roboto Condensed", sans-serif !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

@media only screen and (max-width: 1199px) {
  #pd-menu ul.pd-menu-list.p2p-menu li h3 {
    font-size: 17px;
  }
}

@media only screen and (max-width: 991px) {
  #pd-menu ul.pd-menu-list.p2p-menu li h3 {
    font-size: 15px;
  }
  #pd-menu ul.pd-menu-list.p2p-menu li h3 span {
    font-size: 12px;
  }
}

#pd-menu ul.pd-menu-list.p2p-menu li.active {
  background-color: #2b71b8;
  color: #fff;
}

#pd-menu ul.pd-menu-list.p2p-menu li.active .num,
#pd-menu ul.pd-menu-list.p2p-menu li.active h3 {
  color: #fff;
}

/* 14.3 Consult Box
 * ---------------------------*/
#tp-consult.consult-box .boxW {
  position: relative;
  padding: 34px;
}

@media only screen and (max-width: 767px) {
  #tp-consult.consult-box {
    margin-top: 40px;
  }
  #tp-consult.consult-box .boxW {
    padding: 20px;
  }
}

#tp-consult.consult-box .shain-anime {
  top: -120px;
  left: 90px;
}

@media only screen and (max-width: 767px) {
  #tp-consult.consult-box .shain-anime {
    top: -138px;
    left: 50%;
  }
}

#tp-consult.consult-box .box-ttl {
  margin-top: 0;
  margin-bottom: 10px;
}

@media only screen and (max-width: 1199px) {
  #tp-consult.consult-box .box-ttl {
    padding-left: 200px;
    text-align: left;
  }
}

@media only screen and (max-width: 991px) {
  #tp-consult.consult-box .box-ttl {
    font-size: 25px;
  }
}

@media only screen and (max-width: 767px) {
  #tp-consult.consult-box .box-ttl {
    margin-top: 58px;
    padding-left: 0;
    font-size: 16px;
    text-align: left;
  }
  #tp-consult.consult-box .btn {
    margin-top: -10px;
  }
}

/* 14.4 Top Page
 * ---------------------------*/
#p2p-top ul.nayami-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

#p2p-top ul.nayami-list li {
  -ms-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  width: 33%;
  margin: 0;
  padding-bottom: 40px;
  box-sizing: border-box;
}

#p2p-top ul.nayami-list li .txt {
  margin: 20px 0 0;
  font-size: 17px;
  font-weight: 500;
  line-height: 2;
  text-align: center;
  color: #2b71b8;
}

@media only screen and (max-width: 991px) {
  #p2p-top ul.nayami-list li .txt {
    font-size: 15px;
  }
}

@media only screen and (max-width: 767px) {
  #p2p-top ul.nayami-list li {
    width: 50%;
    padding: 0 10px 20px;
  }
  #p2p-top ul.nayami-list li .txt {
    margin-top: 10px;
    font-size: 12px;
    line-height: 1.8;
    text-align: left;
  }
}

/* 14.5 Features Page
 * ---------------------------*/
.p2p-features-table {
  display: table;
  table-layout: fixed;
}

#p2p-features-maker {
  background-color: #fff;
  margin-bottom: -60px;
}

@media only screen and (min-width: 768px) {
  #p2p-features-model .img-model.model-horizontal {
    height: 200px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
  #p2p-features-model .img-model.model-horizontal img {
    width: 100% !important;
  }
  #p2p-features-model .img-model.model-vertical img {
    width: 65% !important;
  }
  #p2p-features-model .img-model.model-vertical-ss img {
    width: 45% !important;
  }
}

@media only screen and (max-width: 767px) {
  #p2p-features-model {
    margin-top: -20px;
  }
  #p2p-features-model .img-model.model-horizontal {
    height: auto;
    display: block;
  }
  #p2p-features-model .img-model.model-vertical img {
    width: 50% !important;
  }
  #p2p-features-model .img-model.model-vertical-ss img {
    width: 50% !important;
  }
}

#p2p-features-model .sub {
  margin: 0 0 5px;
  font-size: 27px;
  line-height: 1.6;
  color: #2b71b8;
  text-align: left;
}

@media only screen and (max-width: 991px) {
  #p2p-features-model .sub {
    font-size: 24px;
  }
}

@media only screen and (max-width: 767px) {
  #p2p-features-model .sub {
    margin-top: 20px;
    font-size: 17px;
    text-align: center;
  }
}

#p2p-features-model .icon-os {
  display: block;
  margin: 10px 0 20px;
  font-size: 20px;
  color: #2b71b8;
  font-weight: 500;
  line-height: 1;
}

#p2p-features-model .icon-os span {
  display: inline-block;
  width: 100px;
  margin: 0 0 0 10px;
  padding: 7px 10px 8px;
  background-color: #2b71b8;
  border-radius: 3px;
  font-size: 14px;
  font-weight: normal;
  color: #fff;
  text-align: center;
  box-sizing: border-box;
}

@media only screen and (max-width: 991px) {
  #p2p-features-model .icon-os span {
    width: 60px;
  }
}

@media only screen and (max-width: 767px) {
  #p2p-features-model .icon-os {
    margin: 10px 0 15px;
    font-size: 14px;
    text-align: center;
  }
  #p2p-features-model .icon-os span {
    margin-left: 7px;
    padding: 5px 5px 6px;
    width: 46px;
    font-size: 11px;
  }
}

#p2p-features-model .gray-box {
  padding: 12px 22px;
}

#p2p-features-model .gray-box p {
  font-size: 15px;
  margin-bottom: 5px;
}

#p2p-features-model .gray-box strong {
  font-size: 15px !important;
}

#p2p-features-model .gray-box ul {
  margin: 5px 0 0 20px;
  padding: 0;
  font-size: 15px;
  line-height: 1.7;
}

#p2p-features-model .gray-box ul li {
  margin: 0;
  padding: 0;
}

@media only screen and (max-width: 767px) {
  #p2p-features-model .gray-box {
    padding: 15px;
  }
  #p2p-features-model .gray-box p {
    font-size: 12px;
  }
  #p2p-features-model .gray-box strong {
    font-size: 13px !important;
  }
  #p2p-features-model .gray-box ul {
    font-size: 12px;
  }
}

#p2p-features-model table {
  clear: both;
  width: 100%;
  margin: 10px 0;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 13px;
  line-height: 1.8;
}

#p2p-features-model table th {
  padding: 3px 10px;
  background-color: #2b71b8;
  font-weight: normal;
  color: #fff;
  text-align: center;
  border: 1px solid #9e9e9f;
}

#p2p-features-model table td {
  width: 77%;
  padding: 3px 10px;
  text-align: left;
  background-color: #fff;
  border: 1px solid #9e9e9f;
}

#p2p-features-model table td.item {
  width: 13%;
  text-align: center;
  background-color: #f9fafa;
}

@media only screen and (max-width: 767px) {
  #p2p-features-model table {
    margin: 5px 0;
    font-size: 12px;
  }
  #p2p-features-model table td {
    width: 70%;
  }
  #p2p-features-model table td.item {
    width: 30%;
  }
}

/*-------------------------------
 * 15. 追加 170905 (by kuma)
 * ----------------------------*/
/* 各カテゴリー Main Visual TOP */
#cate-main {
  margin-top: 44px;
}
@media only screen and (max-width: 767px) {
  #cate-main {
    margin-top: 0;
  }
}

/* 下層ページ Main Visual */
#cate-main.naka-main {
  margin-top: 44px;
}
@media only screen and (max-width: 767px) {
  #cate-main.naka-main {
    margin-top: 0;
  }
}

/* 下層ページ TITLE (青帯) */
#cate-ttl {
  margin-top: 44px;
}
@media only screen and (max-width: 767px) {
  #cate-ttl {
    margin-top: 0;
  }
}

/* 下層ページ TITLE (青帯) + Main Visual */
#cate-main.main-solution,
#cate-main.main-product,
#cate-main.main-fa-pc,
#cate-main.main-server,
#cate-main.main-storage,
#cate-main.main-pc-workstation,
#cate-main.main-research-lab,
#cate-main.main-task {
  margin-top: 0 !important;
}

/* コンテンツ背景白 */
.bg-white #breadcrumb {
  margin-top: 44px;
}
@media only screen and (max-width: 1499px) {
  .bg-white #breadcrumb {
    padding-left: 0;
  }
}
@media only screen and (max-width: 1199px) {
  .bg-white #breadcrumb {
    padding-left: 0;
  }
}

/* 全文検索システムページ */
#zenbun-wrap {
  margin-top: 44px;
}
@media only screen and (max-width: 767px) {
  #zenbun-wrap {
    margin-top: 0;
  }
}

/*-------------------------------
 * 16. 追加 PRODUCT-SOLUTION / Super Micro 170926 (by kuma)
 * ----------------------------*/
.pd-sm-top .pd-sm-logo {
  margin-top: 40px;
  margin-bottom: 40px;
}
.pd-sm-top .pd-sm-txt {
  margin-right: 30px;
}
.pd-sm-top .pd-sm-img {
  margin-left: -2px;
}
@media only screen and (max-width: 1199px) {
  .pd-sm-top .pd-sm-logo {
    width: 200px;
    height: auto;
  }
}
@media only screen and (max-width: 991px) {
  .pd-sm-top .pd-sm-logo {
    float: right;
    width: 130px;
    height: auto;
    margin: 40px 15px;
  }
  .pd-sm-top .pd-sm-txt {
    margin-right: 0;
  }
  .pd-sm-top .pd-sm-txt p {
    font-size: 12px !important;
    line-height: 1.8 !important;
    margin: 15px 0 0 -15px;
  }
}
@media only screen and (max-width: 767px) {
  .pd-sm-top .pd-sm-logo {
    float: none;
    width: 200px;
    height: auto;
    margin: 20px auto;
  }
  .pd-sm-top .pd-sm-txt p {
    font-size: 12px !important;
    margin: 15px;
  }
  .pd-sm-top .pd-sm-img {
    margin-left: 0;
  }
}

.pd-sm-indent {
  margin-bottom: 40px;
  padding-left: 1.3em;
  text-indent: -1.3em;
  font-size: 20px;
  line-height: 1.6;
  color: #2b71b8;
}
@media only screen and (max-width: 991px) {
  .pd-sm-indent {
    font-size: 16px;
  }
}
@media only screen and (max-width: 767px) {
  .pd-sm-indent {
    margin-top: 0;
    margin-bottom: 15px;
    font-size: 15px;
  }
}

.pd-sm-icon {
  text-align: center;
}
.pd-sm-icon .left {
  float: left;
  padding-left: 40px;
}
.pd-sm-icon .right {
  float: right;
  padding-right: 40px;
}
.pd-sm-icon img {
  width: 206px;
  height: 206px;
}
.pd-sm-icon p {
  margin-top: 10px;
}
@media only screen and (max-width: 1199px) {
  .pd-sm-icon .left {
    padding-left: 20px;
  }
  .pd-sm-icon .right {
    padding-right: 20px;
  }
}
@media only screen and (max-width: 991px) {
  .pd-sm-icon .left {
    padding-left: 10px;
  }
  .pd-sm-icon .right {
    padding-right: 10px;
  }
  .pd-sm-icon img {
    width: 180px;
    height: 180px;
  }
}
@media only screen and (max-width: 767px) {
  .pd-sm-icon .left {
    float: none;
    padding-left: 0;
  }
  .pd-sm-icon .right {
    float: none;
    padding-right: 0;
  }
  .pd-sm-icon img {
    width: auto;
    max-width: 100%;
    height: auto;
  }
}

/*-------------------------------
 * 17. 追加 PRODUCT-SOLUTION / TOP 171003 (by kuma)
 * ----------------------------*/
#pd-menu ul.pd-menu-list.pd-top-2cols li {
  padding: 22px 22px 0 22px;
  border: none;
}
#pd-menu ul.pd-menu-list.pd-top-2cols li:nth-child(odd) {
  border-right: 10px solid #e9ebe8;
}
#pd-menu ul.pd-menu-list.pd-top-2cols li:nth-child(even) {
  border-left: 10px solid #e9ebe8;
}
#pd-menu ul.pd-menu-list.pd-top-2cols.cols li {
  padding: 35px 22px !important;
  border: none !important;
}
@media only screen and (max-width: 767px) {
  #pd-menu ul.pd-menu-list.pd-top-2cols li {
    padding: 15px !important;
  }
  #pd-menu ul.pd-menu-list.pd-top-2cols.cols li {
    padding: 20px 15px 15px !important;
  }
  #pd-menu ul.pd-menu-list.pd-top-2cols li:last-of-type {
    padding-bottom: 0;
  }
  #pd-menu ul.pd-menu-list.pd-top-2cols li:nth-child(odd),
  #pd-menu ul.pd-menu-list.pd-top-2cols li:nth-child(even) {
    border: none !important;
  }
}

#pd-menu ul.pd-menu-list.pd-top-2cols li .icon {
  margin: 0;
  width: 85px;
  height: 85px;
}
@media only screen and (max-width: 1199px) {
  #pd-menu ul.pd-menu-list.pd-top-2cols li .icon {
    width: 70px;
    height: 70px;
  }
}
@media only screen and (max-width: 991px) {
  #pd-menu ul.pd-menu-list.pd-top-2cols li .icon {
    width: 50px;
    height: 50px;
  }
}

#pd-menu ul.pd-menu-list.pd-top-2cols li h3 {
  height: auto;
  line-height: 1.45;
  margin: 0;
  text-align: left;
}
#pd-menu ul.pd-menu-list.pd-top-2cols li h3 span {
  display: inline-block;
  margin-left: 15px;
  letter-spacing: 0.05em;
}
@media only screen and (max-width: 767px) {
  #pd-menu ul.pd-menu-list.pd-top-2cols li h3 {
    margin-bottom: 5px;
    font-size: 20px;
  }
  #pd-menu ul.pd-menu-list.pd-top-2cols li h3 span {
    margin-left: 10px;
    font-size: 12px;
    letter-spacing: 0;
  }
}

#pd-menu ul.pd-menu-list.pd-top-2cols li dl.pd-top-list {
  width: 100%;
  display: table;
  margin: 0 0 10px;
  padding: 0;
}
#pd-menu ul.pd-menu-list.pd-top-2cols li dl.pd-top-list dt {
  width: 21%;
  display: table-cell;
  vertical-align: middle;
  padding: 0;
}
#pd-menu ul.pd-menu-list.pd-top-2cols li dl.pd-top-list.cols dt {
  width: 10%;
}

#pd-menu ul.pd-menu-list.pd-top-2cols li dl.pd-top-list dd {
  width: 79%;
  display: table-cell;
  vertical-align: middle;
  padding: 0;
}
#pd-menu ul.pd-menu-list.pd-top-2cols li dl.pd-top-list.cols dd {
  width: 90%;
}

#pd-menu ul.pd-menu-list.pd-top-2cols li dl.pd-top-list dd p {
  margin: 0 !important;
  letter-spacing: 0;
}

@media only screen and (max-width: 767px) {
  #pd-menu ul.pd-menu-list.pd-top-2cols li dl.pd-top-list.cols dt {
    width: 21%;
  }
  #pd-menu ul.pd-menu-list.pd-top-2cols li dl.pd-top-list.cols dd {
    width: 79%;
  }
}

/*---------- TOP MENU LIST ----------*/
.pd-top-menu {
  margin-bottom: 80px;
}
@media only screen and (max-width: 767px) {
  .pd-top-menu {
    margin-bottom: 40px;
  }
}

.pd-top-menu .sub-blue {
  font-size: 24px;
  font-family: "Roboto Condensed", sans-serif !important;
  letter-spacing: 0.1em;
  font-weight: 600;
  text-transform: uppercase;
}
.pd-top-menu .sub-blue span {
  display: inline-block;
  margin: 0 10px;
  font-size: 14px;
  font-weight: 500;
}
@media only screen and (max-width: 991px) {
  .pd-top-menu .sub-blue {
    font-size: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .pd-top-menu .sub-blue {
    font-size: 18px;
  }
  .pd-top-menu .sub-blue span {
    font-size: 12px;
  }
}

.pd-top-menu .pd-top-menu-cols {
  height: 200px;
  margin: 40px 0 0;
  padding: 0;
  display: block;
  background-color: #fff;
  overflow: hidden;
}
.pd-top-menu .pd-top-menu-cols a {
  color: #231916;
}
.pd-top-menu .pd-top-menu-cols a:hover {
  text-decoration: none;
}
.pd-top-menu .pd-top-menu-cols:hover {
  outline: 3px solid #2b71b8;
  transition: all 700ms;
}
@media only screen and (max-width: 767px) {
  .pd-top-menu .pd-top-menu-cols {
    height: auto;
    margin-top: 20px;
    display: block;
  }
}

.pd-top-menu .pd-top-menu-cols .pd-top-table-box {
  width: 100%;
  display: table;
}
.pd-top-menu .pd-top-menu-cols .pd-top-table-box .img-area {
  width: 25%;
  display: table-cell;
}
.pd-top-menu .pd-top-menu-cols .pd-top-table-box .img-area img {
  width: auto;
  height: 202px;
}
.pd-top-menu .pd-top-menu-cols .pd-top-table-box .txt-area {
  width: 75%;
  display: table-cell;
  padding: 0 30px;
  vertical-align: middle;
}
@media only screen and (max-width: 1199px) {
  .pd-top-menu .pd-top-menu-cols .pd-top-table-box .img-area {
    width: 28%;
  }
  .pd-top-menu .pd-top-menu-cols .pd-top-table-box .txt-area {
    width: 72%;
  }
}
@media only screen and (max-width: 991px) {
  .pd-top-menu .pd-top-menu-cols .pd-top-table-box .img-area {
    width: 40%;
  }
  .pd-top-menu .pd-top-menu-cols .pd-top-table-box .txt-area {
    width: 60%;
  }
}
@media only screen and (max-width: 767px) {
  .pd-top-menu .pd-top-menu-cols .pd-top-table-box .img-area {
    width: 100%;
    display: block;
  }
  .pd-top-menu .pd-top-menu-cols .pd-top-table-box .img-area img {
    height: auto;
  }
  .pd-top-menu .pd-top-menu-cols .pd-top-table-box .txt-area {
    width: 100%;
    display: block;
    padding: 15px 15px 10px;
  }
}

.pd-top-menu .pd-top-menu-cols dl.pd-top-menu-list {
  width: 100%;
  display: table;
  margin: 0 0 7px;
  padding: 0;
  overflow: hidden !important;
}
.pd-top-menu .pd-top-menu-cols dl.pd-top-menu-list dt {
  width: 13%;
  display: table-cell;
  vertical-align: middle;
  padding: 0;
}
.pd-top-menu .pd-top-menu-cols dl.pd-top-menu-list dd {
  width: 87%;
  display: table-cell;
  vertical-align: middle;
  padding: 0;
}
@media only screen and (max-width: 991px) {
  .pd-top-menu .pd-top-menu-cols dl.pd-top-menu-list dt {
    width: 20%;
  }
  .pd-top-menu .pd-top-menu-cols dl.pd-top-menu-list dd {
    width: 80%;
  }
}
@media only screen and (max-width: 767px) {
  .pd-top-menu .pd-top-menu-cols dl.pd-top-menu-list {
    margin: 0;
  }
  .pd-top-menu .pd-top-menu-cols dl.pd-top-menu-list dt {
    width: 23%;
  }
  .pd-top-menu .pd-top-menu-cols dl.pd-top-menu-list dd {
    width: 77%;
  }
}

.pd-top-menu .pd-top-menu-cols .icon {
  display: inline-block;
  width: 78px;
  height: 78px;
  margin: 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
@media only screen and (max-width: 1199px) {
  .pd-top-menu .pd-top-menu-cols .icon {
    width: 65px;
    height: 65px;
  }
}
@media only screen and (max-width: 991px) {
  .pd-top-menu .pd-top-menu-cols .icon {
    width: 50px;
    height: 50px;
  }
}

.pd-top-menu .pd-top-menu-cols .icon.server {
  background-image: url(../image/product-solution/pict-server-blue.png);
}
.pd-top-menu .pd-top-menu-cols .icon.storage {
  background-image: url(../image/product-solution/pict-storage-blue.png);
}
.pd-top-menu .pd-top-menu-cols .icon.workstation {
  background-image: url(../image/product-solution/pict-workstation-blue.png);
}
.pd-top-menu .pd-top-menu-cols .icon.research-lab {
  background-image: url(../image/product-solution/pict-research-lab-blue.png);
}
.pd-top-menu .pd-top-menu-cols .icon.fapc {
  background-image: url(../image/product-solution/pict-fapc-blue.png);
}
.pd-top-menu .pd-top-menu-cols .icon.video {
  background-image: url(../image/product-solution/pict-video-blue.png);
}
.pd-top-menu .pd-top-menu-cols .icon.edge {
  background-image: url(../image/product-solution/pict-edge-blue.png);
}
.pd-top-menu .pd-top-menu-cols .icon.data {
  background-image: url(../image/product-solution/pict-data-blue.png);
}

.pd-top-menu .pd-top-menu-cols h3 {
  color: #2b71b8;
  font-family: "Roboto Condensed", sans-serif !important;
  font-size: 43px;
  font-weight: 600;
  letter-spacing: 0.1em;
  line-height: 1.15;
  margin: 0 0 15px;
  text-transform: uppercase;
}
.pd-top-menu .pd-top-menu-cols h3.jp {
  font-size: 30px;
}
.pd-top-menu .pd-top-menu-cols h3 span {
  display: inline-block;
  margin-left: 15px;
  font-size: 15px;
  font-weight: normal;
  letter-spacing: 0.05em;
  vertical-align: 20%;
}
.pd-top-menu .pd-top-menu-cols h3 span.block {
  display: block;
  margin-left: 0;
  margin-bottom: 15px;
}
@media only screen and (max-width: 1199px) {
  .pd-top-menu .pd-top-menu-cols h3 {
    font-size: 29px;
  }
  .pd-top-menu .pd-top-menu-cols h3.jp {
    font-size: 24px;
  }
}
@media only screen and (max-width: 991px) {
  .pd-top-menu .pd-top-menu-cols h3.jp {
    font-size: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .pd-top-menu .pd-top-menu-cols h3 {
    margin-bottom: 5px;
    font-size: 20px;
    letter-spacing: 0.1em;
  }
  .pd-top-menu .pd-top-menu-cols h3.jp {
    font-size: 17px;
  }
  .pd-top-menu .pd-top-menu-cols h3 span {
    margin-left: 10px;
    font-size: 12px;
    letter-spacing: 0;
  }
  .pd-top-menu .pd-top-menu-cols h3 span.block {
    margin: 0 0 10px;
  }
}

/*-------------------------------
 * 18. 追加 CONTACT/ORDER MADE 171110 (by kuma)
 * ----------------------------*/
.contact-ordermade .form-group {
  margin: 0 15px;
  padding-bottom: 15px;
  border-bottom: 1px dashed #ccc;
}
.contact-ordermade .form-group .col-xs-12 {
  padding-left: 0;
  padding-right: 0;
}

/*-------------------------------
 * 19. 追加 CONTACT 171206 (by kuma)
 * ----------------------------*/
#otoiawase-wrap.contact-top-wrap .waku-box {
  margin-top: 30px;
  padding-top: 40px;
}
#otoiawase-wrap.contact-top-wrap .sub-blue {
  margin-bottom: 20px;
}
#otoiawase-wrap.contact-top-wrap .btn-thick {
  margin-top: 20px;
  min-height: 78px;
}
@media only screen and (max-width: 767px) {
  #otoiawase-wrap.contact-top-wrap .waku-box {
    margin-top: 10px;
    padding-top: 15px;
  }
  #otoiawase-wrap.contact-top-wrap .sub-blue {
    margin-bottom: 10px;
  }
  #otoiawase-wrap.contact-top-wrap .btn-thick {
    margin-top: 10px;
  }
}

/*-------------------------------
 * 20. 追加 RECRUIT 180111 (by kuma)
 * ----------------------------*/
#profile-wrap .dl-table.recruit dl ul {
  padding-left: 20px;
}
@media only screen and (max-width: 991px) {
  #recruit-finding ul.finding-list.job-type .icon-oubo {
    width: auto;
    margin-left: 10px;
    margin-right: 10px;
  }
}

/*-------------------------------
 * 21. 追加 RECRUIT 180208 (by kuma)
 * ----------------------------*/
#recruit-finding ul.finding-list.job-type li .txt {
  padding-top: 20px;
  font-size: 19px !important;
}
@media only screen and (max-width: 1199px) {
  #recruit-finding ul.finding-list.job-type li .txt {
    font-size: 17px !important;
  }
}
@media only screen and (max-width: 767px) {
  #recruit-finding ul.finding-list.job-type li {
    padding: 40px 10px 10px;
  }
  #recruit-finding ul.finding-list.job-type li .txt {
    padding-top: 10px;
    font-size: 15px !important;
  }
}
@media only screen and (max-width: 320px) {
  #recruit-finding ul.finding-list.job-type li .txt {
    font-size: 14px !important;
  }
}

/*-------------------------------
 * 22. 追加 ISO LOGO 180718 (by kuma)
 * ----------------------------*/
#iso-logo-wrap {
  text-align: center;
}
#iso-logo-wrap .iso-logo-area .iso-logo {
  display: block;
  margin: 0 auto 30px;
  width: auto;
  height: 130px;
}
@media only screen and (max-width: 767px) {
  #iso-logo-wrap .iso-logo-area .iso-logo {
    margin-top: 0;
    height: 80px;
  }
}

footer .iso-logo-area {
  margin: 10px 0;
}
footer .iso-logo-area .p-logo {
  display: inline-block;
  margin: 0 0 10px;
  padding: 0;
}
footer .iso-logo-area .iso-logo {
  display: inline-block;
  margin: -10px 2px 0 0;
  padding: 0;
  width: auto;
  height: 75px;
}
footer .iso-logo-area .footerBan {
  padding: 0;
}
footer .iso-logo-area a .footerBan:hover {
  opacity: 0.8;
  transition: 0.7s;
}
@media only screen and (max-width: 1199px) {
  footer .iso-logo-area .p-logo {
    width: auto;
    height: 60px;
  }
  footer .iso-logo-area .iso-logo {
    width: auto;
    height: 60px;
  }
}
@media only screen and (max-width: 991px) {
  footer .iso-logo-area .p-logo {
    height: 75px;
  }
  footer .iso-logo-area .iso-logo {
    height: 75px;
  }
  footer .iso-logo-area .footerBan {
    display: block;
  }
}
@media only screen and (max-width: 767px) {
  footer .iso-logo-area {
    margin: 0 auto 20px;
    text-align: center;
  }
  footer .iso-logo-area .p-logo {
    margin-right: 0;
  }
  footer .iso-logo-area .iso-logo {
    margin-right: 0;
  }
  footer .iso-logo-area .footerBan {
    width: auto;
    margin-left: auto;
    margin-right: auto;
  }
  footer .iso-logo-area .footerBan.kenkoukeiei {
    height: 63px;
  }
  footer .iso-logo-area .footerBan.seiwajuku {
    height: 61px;
  }
}

/*-------------------------------
 * 23. 修正 ISO LOGO 180809 (by kuma)
 * ----------------------------*/
#iso-logo-wrap .iso-logo-area .iso-logo {
  margin: 20px auto 15px;
}
#iso-logo-wrap .iso-logo-area .p-logo {
  margin: 5px auto 0;
}
@media only screen and (max-width: 767px) {
  #iso-logo-wrap .iso-logo-area .iso-logo {
    margin: 10px auto;
  }
  #iso-logo-wrap .iso-logo-area .p-logo {
    margin: 0 auto;
  }
}

footer .iso-logo-area .iso-logo {
  display: block;
  margin: 0 0 10px;
  width: 240px !important;
  height: auto !important;
}
@media only screen and (max-width: 1199px) {
  footer .iso-logo-area .iso-logo {
    width: 190px !important;
  }
}
@media only screen and (max-width: 991px) {
  footer .iso-logo-area .iso-logo {
    width: 237px !important;
  }
}
@media only screen and (max-width: 767px) {
  footer .iso-logo-area .iso-logo {
    width: 198px !important;
    margin: 0 auto;
  }
}

footer .iso-logo-area .bnr-table {
  width: 240px;
  display: table;
}
footer .iso-logo-area .bnr-table .bnr-p-logo {
  width: 75px;
  display: table-cell;
  vertical-align: top;
}
footer .iso-logo-area .bnr-table .bnr-p-logo .p-logo {
  width: 75px;
  height: auto;
}
footer .iso-logo-area .bnr-table .bnr-right {
  width: 160px;
  display: table-cell;
  vertical-align: top;
  text-align: right;
}
footer .iso-logo-area .bnr-table .bnr-right .seiwajuku {
  width: 158px;
  height: auto;
  margin-top: -2px;
}
@media only screen and (max-width: 1199px) {
  footer .iso-logo-area .bnr-table {
    width: 190px;
  }
  footer .iso-logo-area .bnr-table .bnr-p-logo {
    width: 60px;
  }
  footer .iso-logo-area .bnr-table .bnr-p-logo .p-logo {
    width: 60px;
  }
  footer .iso-logo-area .bnr-table .bnr-right {
    width: 125px;
  }
  footer .iso-logo-area .bnr-table .bnr-right .seiwajuku {
    width: 123px;
  }
}
@media only screen and (max-width: 991px) {
  footer .iso-logo-area .bnr-table {
    width: 237px;
  }
  footer .iso-logo-area .bnr-table .bnr-p-logo {
    width: 75px;
  }
  footer .iso-logo-area .bnr-table .bnr-p-logo .p-logo {
    width: 75px;
  }
  footer .iso-logo-area .bnr-table .bnr-right {
    width: 157px;
  }
  footer .iso-logo-area .bnr-table .bnr-right .seiwajuku {
    width: 155px;
    float: right;
  }
}
@media only screen and (max-width: 767px) {
  footer .iso-logo-area .bnr-table {
    width: 202px;
    margin: 10px auto;
  }
  footer .iso-logo-area .bnr-table .bnr-p-logo .p-logo {
    width: 52px;
  }
  footer .iso-logo-area .bnr-table .bnr-right {
    width: 145px;
  }
  footer .iso-logo-area .bnr-table .bnr-right .seiwajuku {
    width: 140px;
  }
}

/*-------------------------------
 * 24. 修正 pagination 180821 (by kuma)
 * ----------------------------*/
.pagination a {
  width: auto !important;
  display: inline-block !important;
  padding: 3px 10px !important;
}
.page-numbers.current {
  display: inline-block !important;
  position: relative !important;
  top: -17px !important;
}
@media only screen and (max-width: 767px) {
  .page-numbers.current {
    top: -15px !important;
  }
}

/* safari only */
_::-webkit-full-page-media,
_:future,
:root .page-numbers.current {
  top: 0 !important;
}

/*-------------------------------
 * 25. 修正 recruit 190111 (by kuma)
 * ----------------------------*/
#recruit-finding ul.finding-list.flexbox.job-type {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: flex-start;
  align-content: flex-start;
}
#recruit-finding ul.finding-list.flexbox.job-type li {
  display: block;
  flex-basis: 30%;
  height: 260px;
  margin: 0 5px 50px;
}
#recruit-finding ul.finding-list.flexbox.job-type li a {
  height: 260px;
}
@media only screen and (max-width: 991px) {
  #recruit-finding ul.finding-list.flexbox.job-type li {
    margin-left: 0;
    margin-right: 0;
  }
}
@media only screen and (max-width: 767px) {
  #recruit-finding ul.finding-list.flexbox.job-type li {
    flex-basis: 47%;
    height: 230px;
    float: none !important;
    margin: 40px 0 0;
    border-right: none !important;
    border-left: none !important;
  }
  #recruit-finding ul.finding-list.flexbox.job-type li a {
    height: 240px;
  }
  #recruit-finding ul.finding-list.flexbox.job-type li:nth-of-type(1),
  #recruit-finding ul.finding-list.flexbox.job-type li:nth-of-type(2) {
    margin-top: 0;
  }
  #recruit-finding ul.finding-list.flexbox.job-type li:nth-of-type(odd) {
    margin-right: 7px;
  }
  #recruit-finding ul.finding-list.flexbox.job-type li:nth-child(even) {
    margin-left: 7px;
  }
}

#recruit-finding ul.finding-list.job-type li .txt.small {
  font-size: 18px !important;
}
@media only screen and (max-width: 1199px) {
  #recruit-finding ul.finding-list.job-type li .txt.small {
    font-size: 16px !important;
  }
}
@media only screen and (max-width: 767px) {
  #recruit-finding ul.finding-list.job-type li .txt.small {
    font-size: 14px !important;
  }
}
@media only screen and (max-width: 320px) {
  #recruit-finding ul.finding-list.job-type li .txt.small {
    font-size: 13px !important;
  }
}

/*-------------------------------
 * 26. 追加 recruit slider TOP 190118 (by kuma)
 * ----------------------------*/
#case-slider-recruit {
  margin-top: 0;
}
@media only screen and (max-width: 767px) {
  #case-slider-recruit {
    margin-top: 30px;
  }
}

#case-slider-recruit .slick-track > div {
  background-color: #fff;
  border-left: 1px solid #e9ebe8;
}
#case-slider-recruit .slick-track > div:hover .slider-content {
  color: #fff;
  background-color: #2b71b8;
}
#case-slider-recruit .slick-track > div:hover a {
  text-decoration: none;
}

#case-slider-recruit .slick-track > div .icon {
  height: 18px;
  color: #fff;
  background-color: #2b71b8;
  display: table;
  font-size: 11px;
  line-height: 19px;
  text-align: center;
  margin: 20px auto 10px;
  padding-left: 8px;
  padding-right: 8px;
  min-width: 88px;
  border-radius: 4px;
}
#case-slider-recruit .slick-track > div:hover .icon {
  color: #2b71b8;
  background-color: #fff;
}
@media only screen and (max-width: 767px) {
  #case-slider-recruit .slick-track > div .icon {
    height: auto;
    padding: 3px 5px 4px;
    font-size: 10px;
    line-height: 1.45;
  }
}

#case-slider-recruit + .container .btn {
  margin-top: 75px;
  margin-bottom: 30px;
}
@media only screen and (max-width: 767px) {
  #case-slider-recruit + .container .btn {
    margin-top: 40px;
    margin-bottom: 15px;
  }
}

/* ----------------------------*/
/* 27. 追加 form 190123
* ------------------------------*/
.rbox {
  width: auto;
  margin: 10px 0;
  padding: 10px;
  border-radius: 4px;
  border: 1px solid #e50000;
  background: #fbefed;
}

/*-------------------------------
 * 28. 修正 NEWS pagination 190222 (by kuma)
 * ----------------------------*/
#news-wrap .pagination a[rel="prev"] {
  padding-left: 35px !important;
}
#news-wrap .pagination a[rel="next"] {
  padding-right: 35px !important;
}
#news-wrap .pagination a:before,
.pagination a:after {
  top: 13px;
}
@media only screen and (max-width: 767px) {
  #news-wrap .pagination a {
    display: block;
    width: 100% !important;
  }
  #news-wrap .pagination a[rel="prev"] {
    padding-left: 20px !important;
  }
  #news-wrap .pagination a[rel="next"] {
    padding-right: 20px !important;
  }
  #news-wrap .pagination a:before,
  .pagination a:after {
    top: 11px;
  }
}

/*-------------------------------
 * 29. 修正 CONTCTボタン 190617
 * ----------------------------*/
.btn-large {
  font-size: 20px !important;
  padding-bottom: 12px !important;
  line-height: 1.8 !important;
}
.btn-large .icon-fanatic-right {
  margin-right: 10px !important;
  margin-left: -10px !important;
}
@media only screen and (max-width: 767px) {
  .btn-large {
    font-size: 16px !important;
    line-height: 1.7 !important;
  }
  .btn-large .icon-fanatic-right {
    margin-left: -5px !important;
  }
}
@media only screen and (max-width: 320px) {
  .btn-large {
    font-size: 14px !important;
  }
}

/*-------------------------------
* 30. 修正 投稿のエレメントの追加 190712
* ----------------------------*/
.sub-center-line {
  margin: 40px 0 20px;
  overflow: hidden;
  text-align: center;
  font-weight: normal;
  font-size: 16px;
}
.sub-center-line span {
  position: relative;
  display: inline-block;
  margin: 0;
  padding: 0 20px;
  text-align: left;
}
.sub-center-line span::before,
.sub-center-line span::after {
  position: absolute;
  top: 50%;
  content: "";
  width: 400%;
  height: 1px;
  background-color: #000;
}
.sub-center-line span::before {
  right: 100%;
}
.sub-center-line span::after {
  left: 100%;
}
@media only screen and (max-width: 991px) {
  .sub-center-line span {
    padding: 0 10px;
    font-size: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .sub-center-line {
    margin: 30px 0 15px;
  }
  .sub-center-line span {
    font-size: 13px;
  }
}

hr.line-black {
  margin: 25px auto 40px !important;
  border-color: #000 !important;
}
@media only screen and (max-width: 767px) {
  hr.line-black {
    margin: 15px auto 30px !important;
  }
}

/*-------------------------------
* 31. 修正 P2Pコラム 記事下部の情報ボックス レポート 191106
* ----------------------------*/
.download-wrap {
  padding: 30px;
  background-color: #f1f1f1;
  font-size: 14px;
}
.download-wrap img {
  display: block;
  max-width: 100%;
  margin: 0 auto !important;
}
@media screen and (max-width: 767px) {
  .download-wrap {
    padding: 20px;
    font-size: 13px;
  }
  .download-wrap img {
    width: 70%;
    height: auto;
  }
}

.download-cont {
  max-width: 700px;
  margin: 0 auto;
}

.download-cont dl.dl-sub {
  width: 100%;
  padding-bottom: 12px;
  margin: 0 0 15px;
  display: table;
  border-bottom: 3px double #ccc;
}
.download-cont dl.dl-sub dt {
  width: 80px;
  display: table-cell;
  vertical-align: top;
  text-align: center;
}
.download-cont dl.dl-sub dt .box {
  display: block;
  padding: 7px 5px 10px;
  background: #f05423;
  color: #fff;
  line-height: 1.3;
  font-weight: 500;
  letter-spacing: 0.05em;
}
.download-cont dl.dl-sub dt .num {
  display: inline-block;
  font-size: 24px;
  font-weight: 600;
}
.download-cont dl.dl-sub dd {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  padding-left: 20px;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .download-cont dl.dl-sub dt {
    width: 60px;
    font-size: 12px;
  }
  .download-cont dl.dl-sub dt .box {
    line-height: 1.5;
    padding: 8px 3px 10px;
  }
  .download-cont dl.dl-sub dt .num {
    font-size: 16px;
  }
  .download-cont dl.dl-sub dd {
    font-size: 15px;
    padding-left: 13px;
  }
}

.download-box {
  width: 100%;
  display: table;
  margin: 25px auto 0;
}
.download-box .left {
  width: 45%;
  display: table-cell;
  vertical-align: top;
}
.download-box .right {
  width: 55%;
  display: table-cell;
  vertical-align: top;
}
.download-box .list-box {
  background: #fff;
  margin: 0 0 0 15px;
  padding: 15px;
}
.download-box .list-box ul {
  margin: -10px 0 0 -15px;
  line-height: 2;
  list-style-type: disc;
  font-size: 13px;
}
@media screen and (max-width: 991px) {
  .download-box {
    display: block;
  }
  .download-box .left,
  .download-box .right {
    width: 100%;
    display: block;
  }
  .download-box .list-box {
    margin: 25px 0 0;
  }
}

.btn-download {
  display: block;
  font-size: 24px;
  line-height: 1.4;
  padding: 10px;
  font-weight: 600;
  max-width: 700px;
  margin: 30px auto 0;
  color: #fff;
  border-radius: 4px;
  text-align: center;
  background: url(../../p2p-windows2008/img/arrow5.png) right center no-repeat
    #c41313;
  transition: 0.7s;
}
.btn-download:hover {
  color: #fff;
  background: url(../../p2p-windows2008/img/arrow5.png) right center no-repeat
    #c30;
}
@media screen and (max-width: 991px) {
  .btn-download {
    margin: 25px auto;
    font-size: 16px;
    padding-top: 8px;
    background-size: 40px 25px;
  }
  .btn-download:hover {
    background-size: 40px 25px;
  }
}

/*-------------------------------
* * 32. 修正 製品詳細ページ カタログダウンロードボタンの追加 191129 (by kuma)
* ----------------------------*/
#pd-top-detail.download .img {
  margin-top: 60px;
}
.icon-download {
  display: block;
  position: absolute;
  top: 20px;
  left: 30px;
  margin: 0;
  width: 40px;
  height: 26px;
  background: url(../image/product-solution/icon-download-blue.svg) 0 0
    no-repeat;
}
a:hover .icon-download {
  background-image: url(../image/product-solution/icon-download.svg);
}
@media only screen and (max-width: 991px) {
  #pd-top-detail.download .img {
    margin-top: 40px;
  }
  .icon-download {
    width: 30px;
    height: 19px;
    top: 14px;
    left: 20px;
  }
}
@media only screen and (max-width: 767px) {
  #pd-top-detail.download .img {
    margin-top: 10px;
  }
}

/*-------------------------------
 * * 33. 修正 CONTACT アドレスを画像に変更 200204
 * ----------------------------*/
.img-mail {
  display: inline-block;
  margin: 0 10px 0 0;
  width: 250px;
  height: 23px;
}
@media only screen and (max-width: 767px) {
  .img-mail {
    width: 220px;
    height: 20px;
  }
}

/*-------------------------------
* * 34. 修正　『ファナティック ハード入替サービス』に関するコラムにグレーボックスを追加 200604
* ----------------------------*/
#report-detail-wrap .gbox {
  background: #eaebe9;
  font-size: 14px;
  padding: 25px 30px;
}
#report-detail-wrap .gbox hr {
  margin-top: 20px;
  margin-bottom: 20px;
}

/*-------------------------------
* * 35. 修正　『ファナティック ハード入替サービスまるわかりガイド』を追加 201021
* ----------------------------*/
#document_request_box {
  margin-top: 40px;
}
#document_request_box.gbox {
  position: relative;
}
#document_request_box.gbox.blue,
#document_request_form.gbox.blue {
  background-color: #ddebf6;
}
#document_request_box .sub {
  font-size: 20px;
  margin-bottom: 20px;
}
#document_request_box .bg-yellow {
  display: inline-block;
  background-color: #fffd56;
  margin: 3px 0;
  line-height: 1.7;
  padding: 0 2px;
  font-weight: 600;
}
#document_request_box .img-yadokari {
  width: 230px;
  height: auto;
  position: absolute;
  top: 30px;
  right: 30px;
  margin: 0;
}
#document_request_box p {
  margin: 0 0 10px;
}
@media only screen and (max-width: 1199px) {
  #document_request_box .sub {
    font-size: 17px;
  }
  #document_request_box .img-yadokari {
    width: 180px;
    top: 20px;
    right: 20px;
  }
}
@media only screen and (max-width: 991px) {
  #document_request_box .img-yadokari {
    width: 150px;
  }
}
@media only screen and (max-width: 767px) {
  #document_request_box.gbox {
    padding: 20px 15px 25px;
  }
  #document_request_box .sub {
    font-size: 15px;
    margin-bottom: 10px;
  }
  #document_request_box .img-yadokari {
    width: 130px;
    right: 15px;
  }
}
@media only screen and (max-width: 320px) {
  #document_request_box .sub {
    font-size: 13px;
  }
  #document_request_box .img-yadokari {
    width: 110px;
  }
}

#document_request_form .row {
  margin-left: 0;
  margin-right: 0;
}
#document_request_form .col-xs-12 {
  padding-left: 0;
  padding-right: 0;
}
#document_request_form.gbox {
  padding-top: 15px;
  padding-bottom: 10px;
}
#document_request_form form p {
  margin: 0;
}
#document_request_form .form-control {
  font-size: 14px;
}
#document_request_form .formbox-s {
  width: 25%;
}
#document_request_form .hissu {
  color: #fff;
  background-color: #ee0101;
  display: inline-block;
  margin-left: 10px;
  line-height: 1;
  letter-spacing: 0.05em;
  padding: 3px 4px;
  font-weight: 300;
  font-size: 75%;
}
#document_request_form #agreeCnt {
  height: 160px;
  padding: 15px 20px;
  margin: 15px 0 10px;
}
#document_request_form #agreeCnt p {
  font-size: 12px !important;
  line-height: 1.8 !important;
}
#document_request_form .well .catchtext {
  font-size: 13px;
}
#document_request_form .well .f12 {
  font-size: 12px !important;
}
@media only screen and (max-width: 991px) {
  #document_request_form .col-xs-12 {
    padding-left: 0;
    padding-right: 0;
  }
}
@media only screen and (max-width: 767px) {
  #document_request_form .formbox-s {
    width: 28%;
  }
  #document_request_form.gbox {
    padding: 5px 15px;
  }
  #document_request_form #agreeCnt {
    height: 115px;
    padding: 10px 15px;
  }
  #document_request_form #agreeCnt p {
    font-size: 11px !important;
  }
  #document_request_form .well .catchtext {
    font-size: 12px;
  }
  #document_request_form .well .f12 {
    font-size: 11px !important;
  }
}

.LV_bgc {
  background: #ffdede !important;
}
.formError {
  position: static !important;
  margin: 0 0 3px !important;
}
.formError .formErrorContent {
  width: 100% !important;
  background-color: transparent !important;
  position: relative !important;
  color: #e50012 !important;
  font-weight: 500 !important;
  min-width: 1px !important;
  font-size: 11px !important;
  border: none !important;
  box-shadow: none !important;
  -moz-box-shadow: none !important;
  -webkit-box-shadow: none !important;
  -o-box-shadow: none !important;
  border-radius: 0 !important;
  -moz-border-radius: 0 !important;
  -webkit-border-radius: 0 !important;
  -o-border-radius: 0 !important;
  line-height: 1.5 !important;
}
.formError .formErrorArrow div {
  display: none !important;
}
.formError + input,
.formError + select,
.formError + textarea {
  border-color: #ee0101 !important;
  background-color: #ffefef !important;
}

#document-request-wrap .bg-white {
  padding-top: 60px;
}
#document-request-wrap #main-wrapper {
  padding: 20px 60px 0;
}
#document-request-wrap .section-ttl-ja {
  text-align: center;
  margin-bottom: 40px;
}
#document-request-wrap .bg-yellow {
  display: inline-block;
  background-color: #fffd56;
  margin: 3px 0;
  line-height: 1.7;
  padding: 0 2px;
  font-weight: 600;
}
#document-request-wrap .document-request-txt {
  position: relative;
}
#document-request-wrap .document-request-txt p {
  font-weight: 600;
  text-align: center;
}
#document-request-wrap .document-request-txt .img-yadokari {
  position: absolute;
  top: 80px;
  right: 0;
  margin: 0;
}
@media only screen and (max-width: 1199px) {
  #document-request-wrap #main-wrapper {
    padding: 20px 50px 0;
  }
}
@media only screen and (max-width: 991px) {
  #document-request-wrap #main-wrapper {
    padding: 20px 30px 0;
  }
  #document-request-wrap .bg-white {
    padding-top: 0;
  }
  #document-request-wrap .txt-catch {
    font-size: 20px;
  }
}
@media only screen and (max-width: 767px) {
  #document-request-wrap #main-wrapper {
    padding: 90px 0 0;
  }
  #document-request-wrap {
    font-size: 13px !important;
  }
  #document-request-wrap .txt-catch {
    font-size: 15px;
    text-align: center;
  }
  #document-request-wrap .section-ttl-ja {
    margin-bottom: 20px;
  }
  #document-request-wrap .section-ttl-txt {
    font-size: 16px;
  }
  #document-request-wrap .document-request-txt {
    margin: 20px 0 0;
  }
  #document-request-wrap .document-request-txt .col-xs-12 {
    padding: 0 2px;
  }
  #document-request-wrap .document-request-txt .img-yadokari {
    display: none;
  }
  #document-request-wrap .document-request-txt p {
    text-align: left;
  }
}

#document_request_box {
  margin-top: 40px;
}
#document_request_box .waku-box {
  margin: 0;
  padding: 40px 50px 30px;
  border: 1px solid #dbdcdc;
}
#document_request_box form p {
  margin: 0;
}
#document_request_box .form-control {
  font-size: 14px;
}
#document_request_box .formbox-s {
  width: 25%;
}
#document_request_box .hissu {
  color: #fff;
  background-color: #ee0101;
  display: inline-block;
  margin-left: 10px;
  line-height: 1;
  letter-spacing: 0.05em;
  padding: 3px 4px;
  font-weight: 300;
  font-size: 75%;
}
#document_request_box .sub-blue {
  margin: 0 0 30px !important;
  padding: 7px 10px 8px !important;
  font-size: 18px !important;
  line-height: 1.45 !important;
  color: #fff !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
}
#document_request_box .f18 {
  font-size: 18px !important;
}
#document_request_box .well {
  background-color: #f5f5f5 !important;
  border: 1px solid #e3e3e3 !important;
  border-radius: 4px !important;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05) !important;
}
#document_request_box p {
  font-size: 12px !important;
}
#document_request_box p.catchtext {
  font-size: 16px !important;
  line-height: 2.5;
}
#document_request_box #agreeCnt {
  margin: 15px 0 10px;
}
#document_request_form #agreeCnt p {
  font-size: 12px !important;
  line-height: 1.8 !important;
}
@media only screen and (max-width: 991px) {
  #document_request_box .waku-box {
    padding: 30px;
  }
}
@media only screen and (max-width: 767px) {
  #document_request_box {
    margin-top: 20px;
  }
  #document_request_box .col-xs-12 {
    padding: 0;
  }
  #document_request_box .formbox-s {
    width: 28%;
  }
  #document_request_box .sub-blue {
    padding-bottom: 9px !important;
    margin-bottom: 15px !important;
    font-size: 14px !important;
  }
  #document_request_box .f18 {
    font-size: 14px !important;
  }
  #document_request_box .waku-box {
    padding: 15px;
  }
  #document_request_box #agreeCnt {
    height: 115px;
    padding: 10px 15px;
  }
  #document_request_box #agreeCnt p {
    font-size: 11px !important;
  }
  #document_request_box .well {
    padding: 15px;
  }
  #document_request_box p {
    font-size: 11px !important;
  }
  #document_request_box p.catchtext {
    font-size: 12px !important;
    line-height: 1.8 !important;
  }
}

.LV_bgc {
  background: #ffdede !important;
}
.formError {
  position: static !important;
  margin: 0 0 3px !important;
}
.formError .formErrorContent {
  width: 100% !important;
  background-color: transparent !important;
  position: relative !important;
  color: #e50012 !important;
  font-weight: 500 !important;
  min-width: 1px !important;
  font-size: 11px !important;
  border: none !important;
  box-shadow: none !important;
  -moz-box-shadow: none !important;
  -webkit-box-shadow: none !important;
  -o-box-shadow: none !important;
  border-radius: 0 !important;
  -moz-border-radius: 0 !important;
  -webkit-border-radius: 0 !important;
  -o-border-radius: 0 !important;
  line-height: 1.5 !important;
}
.formError .formErrorArrow div {
  display: none !important;
}
.formError + input,
.formError + select,
.formError + textarea {
  border-color: #ee0101 !important;
  background-color: #ffefef !important;
}

#document-request-wrap .bg-white {
  padding-top: 60px;
}
#document-request-wrap #main-wrapper {
  padding: 20px 60px 0;
}
#document-request-wrap .section-ttl-ja {
  text-align: center;
  font-size: 24px;
  margin-bottom: 40px;
}
#document-request-wrap .row-thanks waku-box {
  margin: 0;
  padding: 50px 50px 30px;
  border: 1px solid #dbdcdc;
}
#document-request-wrap .row-thanks .sub {
  font-size: 22px;
  letter-spacing: 0.1em;
  margin: 0 0 20px;
  text-align: center;
  line-height: 1.5;
}
#document-request-wrap .row-thanks p {
  font-size: 15px !important;
  line-height: 2 !important;
}
#document-request-wrap .row-thanks .gbox {
  width: 40%;
  background: #eaebe9;
  padding: 20px;
  margin: 20px auto;
}
#document-request-wrap .row-thanks .gbox p {
  margin: 0;
}
@media only screen and (max-width: 1199px) {
  #document-request-wrap #main-wrapper {
    padding: 20px 50px 0;
  }
}
@media only screen and (max-width: 991px) {
  #document-request-wrap #main-wrapper {
    padding: 20px 30px 0;
  }
  #document-request-wrap .bg-white {
    padding-top: 0;
  }
  #document-request-wrap .waku-box {
    padding: 30px;
  }
  #document-request-wrap .row-thanks .gbox {
    width: 60%;
  }
}
@media only screen and (max-width: 767px) {
  #document-request-wrap #main-wrapper {
    padding: 80px 0 0;
  }
  #document-request-wrap .row-thanks .waku-box {
    padding: 20px 15px 15px;
  }
  #document-request-wrap .section-ttl-ja {
    margin-bottom: 30px;
    font-size: 19px;
  }
  #document-request-wrap .row-thanks .sub {
    font-size: 14px;
    margin-bottom: 10px;
  }
  #document-request-wrap .row-thanks p {
    font-size: 13px !important;
    line-height: 1.8 !important;
  }
  #document-request-wrap .row-thanks .gbox {
    width: 100%;
    padding: 10px;
  }
}

#document-request-wrap .bg-white {
  padding-top: 60px;
}
#document-request-wrap #main-wrapper {
  padding: 20px 60px 0;
}
#document-request-wrap .section-ttl-ja {
  text-align: center;
  margin-bottom: 40px;
}
#document-request-wrap .txt-catch {
  font-size: 20px;
}
#document-request-wrap .document-request-txt {
  margin-top: 20px;
}
#document-request-wrap .f17 {
  font-size: 17px !important;
}
#document-request-wrap .row-btn .btn {
  margin-top: 20px;
  margin-bottom: 30px;
  font-size: 26px;
  padding: 0;
  height: auto !important;
  min-height: 58px !important;
}
#document-request-wrap .row-btn .btn span {
  margin-right: 7px;
}
@media only screen and (max-width: 1199px) {
  #document-request-wrap #main-wrapper {
    padding: 20px 50px 0;
  }
}
@media only screen and (max-width: 991px) {
  #document-request-wrap #main-wrapper {
    padding: 20px 30px 0;
  }
  #document-request-wrap .bg-white {
    padding-top: 0;
  }
}
@media only screen and (max-width: 767px) {
  #document-request-wrap #main-wrapper {
    padding: 90px 0 0;
  }
  #document-request-wrap .txt-catch {
    font-size: 13px;
    text-align: left;
  }
  #document-request-wrap .section-ttl-ja {
    margin-bottom: 20px;
  }
  #document-request-wrap .document-request-txt {
    margin-top: 10px;
  }
  #document-request-wrap .document-request-txt .col-xs-12 {
    padding: 0 2px;
  }
  #document-request-wrap .row-btn .col-xs-12 {
    padding-left: 0;
    padding-right: 0;
  }
  #document-request-wrap .f17 {
    font-size: 14px !important;
  }
  #document-request-wrap .row-btn .btn {
    margin-bottom: 20px;
    font-size: 15px;
  }
}

/*-------------------------------
* 38. 修正　会社概要ページとダウンロードページのスタイル（by Naguchi）20220131
* ----------------------------*/
.inner-table {
  display: flex;
}
.inner-table div:first-child {
  width: 100px;
}
.inner-table div:last-child {
  flex: 1;
}
@media (max-width: 767px) {
  .inner-table div:first-child {
    width: 50%;
    padding-right: 12px;
    text-align: right;
  }
  .inner-table div:last-child {
    padding-left: 6px;
    text-align-last: left;
  }
}

.dl-border-box {
  max-width: 420px;
  margin-top: 20px;
  padding: 12px;
  border: 1px solid #e5000f;
}
.dl-border-box p {
  margin-bottom: 0;
}
/*# sourceMappingURL=maps/content.css.map */

#report-detail-wrap .kailink .icon {
  background-color: #00a8a9;
}

#news-wrap hr {
  border-top-color: #000;
}
#news-wrap .pagination {
  display: flex;
  gap: 20px;
  justify-content: space-between;
}
#news-wrap .pagination a {
  flex: 1;
  max-width: 50%;
  padding: 10px !important;
}
#news-wrap .pagination a:before,
#news-wrap .pagination a:after {
  top: calc(50% - 3px) !important;
}
@media all and (max-width: 768px) {
  #news-wrap .pagination {
    flex-direction: column;
    gap: 30px;
  }
  #news-wrap .pagination a {
    max-width: 100%;
    width: 100%;
  }
  #news-wrap .txt-detail p {
    font-size: 16px !important;
  }
}

.case_profile {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 30px;
  margin: 50px 0;
}
.case_profile img {
  max-width: 100%;
}
.case_profile .case_profile_detail {
  flex: 1;
}
.case_profile .case_profile_detail p {
  color: #2b71b8;
  margin-bottom: 0;
}
.case_profile .case_profile_detail p strong {
  display: block;
  font-weight: bold;
  font-size: 20px;
  color: #111;
  padding-top: 10px;
  margin-top: 15px;
  border-top: 1px dotted #ccc;
}
@media all and (max-width: 768px) {
  .case_profile {
    gap: 10px;
    margin: 20px 0;
    flex-direction: column;
  }
  .case_profile img {
    max-width: 100%;
  }
  .case_profile .case_profile_detail {
    width: 100%;
  }
  .case_profile .case_profile_detail p strong {
    font-size: 18px;
    padding-top: 5px;
    margin-top: 10px;
  }
}

.timeline li.newwow {
  justify-content: flex-start;
}
.timeline li.newwow:nth-child(odd) {
  justify-content: flex-end;
}
.timeline li .newarrow {
  max-width: calc(50% - 70px);
  padding: 0 !important;
}
.timeline li .newarrow:before {
  right: -40px !important;
}
.timeline li.newwow:nth-child(odd) .newarrow:before {
  left: -40px !important;
}
.timeline li .newarrow:after {
  display: none !important;
}
@media all and (max-width: 768px) {
  .timeline li .newarrow {
    max-width: inherit;
  }
}

/*-------------------------------
* 39. コンプライアンス行動規範ページ　追加　20240906
* ----------------------------*/

.compliance-content {
  margin-bottom: 60px;
}
h2.compliance-first-ttl {
  margin-bottom: 35px;
}
.compliance-sub-ttl {
  font-size: 1.6rem;
}
.compliance-txt-l {
  text-align: right;
  margin-top: 30px;
}

.fs17.row-access p {
  font-size: 14px;
}
@media only screen and (max-width: 767px) {
  .fs17.row-access .square-ttl {
    font-size: 18px;
  }
}

/*-------------------------------
* needs detail20
* ----------------------------*/
.needs20layout {
}
.needs20layout .layout_type2-line {
  display: flex;
  list-style: none;
  margin: 30px 0 0 0;
  padding: 0;
  justify-content: space-between;
  text-align: center;
}
.needs20layout .layout_type2-line li {
  padding: 0;
  margin: 0;
}
.needs20layout .layout_type2-line li img {
  max-width: 100%;
}
.needs20layout .layout_type2-line li .layout_type2-line_cont {
  line-height: 1.7;
  margin-top: 10px;
}
.needs20layout .layout_type2-line li .layout_type2-line_cont strong {
  color: #2b71b8;
  font-weight: normal;
}
@media all and (max-width: 768px) {
  .needs20layout .layout_type2-line {
    gap: 20px;
    flex-wrap: wrap;
  }
  .needs20layout .layout_type2-line li {
    width: calc(50% - 10px);
  }
  .needs20layout .layout_type2-line li .layout_type2-line_cont br {
    display: none;
  }
}

.needs20layout .layout_type2-guru {
  display: flex;
  gap: 30px;
  list-style: none;
  margin: 0 0 30px 0;
  padding: 0;
  justify-content: center;
}
.needs20layout .layout_type2-guru li {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background: #efefef;
  margin: 0;
  padding: 0;
  line-height: 1.7;
  font-size: 16px;
  width: 250px;
  height: 250px;
}
.needs20layout .layout_type2-guru li strong {
  font-weight: bold;
  color: #2b71b8;
  font-size: 20px;
}
.needs20layout .layout_type2-guru li:before {
  content: url("../image/guru.png");
  display: block;
  margin: 0 0 20px 0;
}
@media all and (max-width: 768px) {
  .needs20layout .layout_type2-guru {
    gap: 30px;
    flex-wrap: wrap;
  }
  .needs20layout .layout_type2-guru li {
    border-radius: 10px;
    padding: 20px 0;
    font-size: 16px;
    width: 100%;
    height: auto;
  }
  .needs20layout .layout_type2-guru li strong {
    font-size: 20px;
  }
  .needs20layout .layout_type2-guru li:before {
    margin: 0 0 10px 0;
  }
}

.needs20layout .layout_type2-copy {
  text-align: center;
  font-weight: bold;
  font-size: 20px;
  margin: 80px 0 30px 0;
}
.needs20layout .layout_type2-arrow {
  text-align: center;
  font-weight: bold;
  font-size: 26px;
  color: #2b71b8;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.needs20layout .layout_type2-arrow:before {
  content: "";
  border-right: 50px solid transparent;
  border-top: 30px solid #2b71b8;
  border-left: 50px solid transparent;
}
@media all and (max-width: 768px) {
}

.needs20layout .layout_type2 {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 50px;
}
.needs20layout .layout_type2 + .layout_type2 {
  margin-top: 50px;
}
.needs20layout .layout_type2 .layout_type2-cont {
  flex: 1;
}
.needs20layout .layout_type2 .layout_type2-cont h3 {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 20px;
  border-bottom: 1px dashed #9fa0a0;
  background: none;
  font-size: 16px;
  font-weight: normal;
  color: #000;
  padding: 0 0 15px 0;
  margin: 0 0 15px 0;
}
.needs20layout .layout_type2 .layout_type2-cont h3:before {
  content: "";
  display: inline-block;
  vertical-align: top;
  background: url(../image/product-solution/zenbun/icon-check.png) 0 0 no-repeat;
  width: 30px;
  height: 26px;
  background-size: contain;
}
.needs20layout .layout_type2 .layout_type2-img {
}
.needs20layout .layout_type2 .layout_type2-img img {
  max-width: 100%;
}
@media all and (max-width: 768px) {
  .needs20layout .layout_type2 {
    gap: 20px;
    flex-direction: column-reverse;
  }
  .needs20layout .layout_type2 .layout_type2-cont {
    line-height: 1.5;
  }
  .needs20layout .layout_type2 .layout_type2-cont h3 {
    text-align: left;
    gap: 20px;
  }
  .needs20layout .layout_type2 .layout_type2-img {
    width: 100%;
  }
  .needs20layout .layout_type2 .layout_type2-img img {
    display: block;
    margin: 0 auto;
  }
}

.columnlayout h2:not(.bnrBox h2) {
  border-bottom: 2px solid #1f538b;
  color: #1f538b !important;
  background: none !important;
  padding: 0 0 16px 0 !important;
  font-size: 20px;
}
@media all and (max-width: 768px) {
  .columnlayout h2:not(.bnrBox h2) {
    font-size: 16px;
  }
}

.inlineblock {
  display: inline-block;
}

.gs2Page {
}

.gs2Page .gs2-section p {
  font-size: 16px;
  margin-bottom: 0;
}
.gs2Page .gs2-section p + p {
  margin-top: 30px;
}
.gs2Page .gs2-section .center {
  text-align: center;
}

.gs2Page #l-main__mainvisual {
  width: 100%;
  height: 700px;
  background: url("../image/product-solution/gsp2_mv.jpg") center center
    no-repeat;
  background-size: cover;
  position: relative;
  margin: 0;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media all and (max-width: 768px) {
  .gs2Page #l-main__mainvisual {
    height: inherit;
    padding: calc(700 / 1600 * 50vw) 0 calc(700 / 1600 * 50vw) 3vw;
  }
}

.gs2Page #l-main__mainvisual .gs2Page-logo {
  position: absolute;
  right: 10px;
  bottom: 10px;
}
.gs2Page #l-main__mainvisual .gs2Page-logo img {
  max-width: 150px;
}

@media all and (min-width: 768px) {
  .gs2Page .l-main__mainvisual {
    width: 743px;
  }
}
@media all and (min-width: 992px) {
  .gs2Page .l-main__mainvisual {
    width: 985px;
  }
}
@media all and (min-width: 1200px) {
  .gs2Page .l-main__mainvisual {
    width: 1143px;
  }
}
@media all and (min-width: 1500px) {
  .gs2Page .l-main__mainvisual {
    width: 1155px;
  }
}
.gs2Page .l-main__mainvisual {
  margin-right: auto;
  margin-left: auto;
  padding-left: 17px;
  padding-right: 18px;
  display: flex;
  align-content: center;
}
.gs2Page .l-main__mainvisual .l-main__mainvisual-content {
}
.gs2Page .l-main__mainvisual .l-main__mainvisual-content p {
  font-weight: bold;
  font-size: 32px;
}
.gs2Page .l-main__mainvisual .l-main__mainvisual-content h2 {
  font-weight: bold;
  font-size: 60px;
  margin-top: 20px;
}
@media all and (max-width: 768px) {
  .gs2Page .l-main__mainvisual .l-main__mainvisual-content p {
    font-size: 18px;
  }
  .gs2Page .l-main__mainvisual .l-main__mainvisual-content h2 {
    font-size: 40px;
    margin-top: 20px;
    line-height: 1.2;
  }
}

.gs2Page .gs2-section {
  padding: 100px 0;
}
@media all and (max-width: 768px) {
  .gs2Page .gs2-section {
    padding: 55px 0;
  }
}
.gs2Page .gs2-section:last-child {
  padding-bottom: 0;
}
.gs2Page .gs2-section h2 {
  margin: 0 0 40px 0;
  font-size: 38px;
  font-weight: bold;
  line-height: 2.5rem;
  position: relative;
}
@media all and (max-width: 768px) {
  .gs2Page .gs2-section h2 {
    margin: 0 0 2rem 0;
    font-size: 36px;
    line-height: 1.2;
  }
}
.gs2Page .gs2-section .l-main__introduction-primary {
  display: flex;
  justify-content: space-between;
  gap: 60px;
}
.gs2Page
  .gs2-section
  .l-main__introduction-primary
  .l-main__introduction-content {
  flex: 1.5;
}
.gs2Page
  .gs2-section
  .l-main__introduction-primary
  .l-main__introduction-image {
  flex: 1;
}
.gs2Page
  .gs2-section
  .l-main__introduction-primary
  .l-main__introduction-image
  img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
}
@media all and (max-width: 768px) {
  .gs2Page .gs2-section .l-main__introduction-primary {
    flex-direction: column;
    gap: 40px;
  }
}

.gs2Page .gs2-section.hoppr_section {
  background: #0a112e;
}
.gs2Page .gs2-section.product_section {
  background: #363f60;
}
.gs2Page .gs2-section.feature_section,
.gs2Page .gs2-section.hoppr_section,
.gs2Page .gs2-section.support_section,
.gs2Page .gs2-section.product_section {
  padding-top: 150px;
}
@media all and (max-width: 768px) {
  .gs2Page .gs2-section.feature_section,
  .gs2Page .gs2-section.hoppr_section,
  .gs2Page .gs2-section.support_section,
  .gs2Page .gs2-section.product_section {
    padding-top: 100px;
  }
}
.gs2Page .gs2-section.hoppr_section h2 {
  color: #fff;
}
.gs2Page .gs2-section.product_section h2 {
  color: #fff;
}
.gs2Page .gs2-section h2:before {
  position: absolute;
  top: 0;
  left: 50%;
  content: attr(data-title);
  -webkit-transform: translate(-50%, -100%);
  -ms-transform: translate(-50%, -100%);
  transform: translate(-50%, -100%);
  color: rgba(43, 113, 184, 0.15);
  font-family: "Jost", sans-serif;
  font-size: 250%;
  font-weight: 500;
  white-space: nowrap;
  width: 100%;
  opacity: 0.7;
  z-index: 1;
}
.gs2Page .gs2-section.product_section h2:before {
  color: rgba(255, 255, 255, 0.03);
}

/*.gs2Page .gs2-section.hoppr_section h2:before {
  position: absolute;
  top: 0;
  left: 50%;
  content: attr(data-title);
  -webkit-transform: translate(-50%, -100%);
  -ms-transform: translate(-50%, -100%);
  transform: translate(-50%, -100%);
  color: rgba(43, 113, 184, 0.15);
  font-family: "Jost", sans-serif;
  font-size: 250%;
  font-weight: 500;
  white-space: nowrap;
  width: 100%;
  opacity: 0.7;
  z-index: 1;
}*/
@media all and (min-width: 768px) {
  .gs2Page .gs2-section.hoppr_section h2:before,
  .gs2Page .gs2-section.product_section h2:before {
    font-size: 250%;
  }
}
@media all and (min-width: 1024px) {
  .gs2Page .gs2-section.hoppr_section h2:before {
    font-size: 300%;
  }
  .gs2Page .gs2-section.product_section h2:before {
    font-size: 250%;
  }
}
@media all and (max-width: 768px) {
  .gs2Page .gs2-section.feature_section h2,
  .gs2Page .gs2-section.hoppr_section h2,
  .gs2Page .gs2-section.product_section h2 {
    line-height: inherit !important;
    font-size: 24px;
  }
  .gs2Page .gs2-section.feature_section h2:before,
  .gs2Page .gs2-section.hoppr_section h2:before,
  .gs2Page .gs2-section.product_section h2:before {
    font-size: 100%;
  }
}
.gs2Page .gs2-section.hoppr_section .hoppr_section_inner {
  display: flex;
  gap: 50px;
  margin-top: 50px;
}
@media all and (max-width: 768px) {
  .gs2Page .gs2-section.hoppr_section .hoppr_section_inner {
    flex-direction: column;
  }
}
.gs2Page
  .gs2-section.hoppr_section
  .hoppr_section_inner
  .hoppr_section_inner-item {
  padding: 50px 60px;
  background: #232943;
  flex: 1;
}
.gs2Page .gs2-section.product_section .product_section_inner {
  background: #4a5370;
  padding: 50px 60px 90px;
}
.gs2Page
  .gs2-section.product_section
  .product_section_inner
  + .product_section_inner {
  margin-top: 80px;
}
.gs2Page .gs2-section.product_section .product_section_inner * {
  color: #fff;
}
.gs2Page
  .gs2-section.product_section
  .product_section_inner-item
  + .product_section_inner-item {
  margin-top: 70px;
}
@media all and (max-width: 768px) {
  .gs2Page
    .gs2-section.hoppr_section
    .hoppr_section_inner
    .hoppr_section_inner-item {
    padding: 20px 30px;
  }

  .gs2Page .gs2-section.product_section .product_section_inner {
    padding: 20px 30px;
  }
}
.gs2Page
  .gs2-section.hoppr_section
  .hoppr_section_inner
  .hoppr_section_inner-item
  h3 {
  text-align: center;
  font-weight: bold;
  font-size: 30px;
  margin: 0 0 40px 0;
  color: #fff;
}
.gs2Page .gs2-section.product_section .product_section_inner-item-head {
  text-align: center;
  margin: 0 0 40px 0;
}

.gs2Page .gs2-section.product_section .product_section_inner-item h3 {
  font-weight: bold;
  font-size: 30px;
  color: #fff;
  margin: 0 0 20px 0;
}
.gs2Page .gs2-section.product_section .product_section_inner-item h4 {
  font-weight: bold;
  font-size: 24px;
  color: #fff;
  line-height: 1.25;
  margin: 0 0 20px 0;
}
@media all and (max-width: 768px) {
  .gs2Page
    .gs2-section.hoppr_section
    .hoppr_section_inner
    .hoppr_section_inner-item
    h3 {
    font-size: 20px;
    margin: 0 0 20px 0;
  }
  .gs2Page
    .gs2-section.product_section
    .product_section_inner
    .product_sectiontion_inner-item
    h3 {
    font-size: 20px;
    margin: 0 0 20px 0;
  }
  .gs2Page .gs2-section.product_section .product_section_inner-item h3 {
    font-size: 20px;
  }
  .gs2Page .gs2-section.product_section .product_section_inner-item h4 {
    font-size: 18px;
  }
}
.gs2Page
  .gs2-section.hoppr_section
  .hoppr_section_inner
  .hoppr_section_inner-item
  .hoppr_section_inner-img {
  width: 100%;
  background: #000;
}
.gs2Page
  .gs2-section.hoppr_section
  .hoppr_section_inner
  .hoppr_section_inner-item
  .hoppr_section_inner-img
  img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
}
.gs2Page
  .gs2-section.hoppr_section
  .hoppr_section_inner
  .hoppr_section_inner-item
  .hoppr_section_inner-cont {
  margin-top: 30px;
}
.gs2Page
  .gs2-section.hoppr_section
  .hoppr_section_inner
  .hoppr_section_inner-item
  .hoppr_section_inner-cont
  p {
  color: #fff;
  font-size: 16px;
}

.gs2Page .gs2-section table.l-main__evaluation-table-01 {
  table-layout: fixed;
}
@media all and (max-width: 768px) {
  .gs2Page .gs2-section table.l-main__evaluation-table-01 {
    display: block;
    overflow-x: scroll;
    white-space: nowrap;
  }
}
.gs2Page .gs2-section table.l-main__evaluation-table-01 th:nth-of-type(1) {
  width: 30%;
}
.gs2Page .gs2-section table.l-main__evaluation-table-01 th:nth-of-type(2),
.gs2Page .gs2-section table.l-main__evaluation-table-01 th:nth-of-type(3) {
  width: 35%;
}
.gs2Page .gs2-section table.l-main__evaluation-table-01 th,
.gs2Page .gs2-section table.l-main__evaluation-table-01 td {
  border: 1px solid #ddd;
  vertical-align: middle;
  letter-spacing: 0.05em;
  padding: 5px 20px;
}
.gs2Page .gs2-section table.l-main__evaluation-table-01 th {
  text-align: center;
  font-weight: bold;
  font-size: 18px;
  line-height: 1.2;
  background: #2b71b8;
  color: #fff;
}
.gs2Page .gs2-section table.l-main__evaluation-table-01 tbody th {
  text-align: left;
}
.gs2Page .gs2-section table.l-main__evaluation-table-01 td {
  background: #fff;
  line-height: 1.7;
}
.gs2Page
  .gs2-section
  table.l-main__evaluation-table-01
  tr:nth-of-type(even)
  td {
  background: #f0f1f2;
}
.gs2Page .gs2-section .table-after {
  margin-top: 20px;
  font-size: 16px;
}

.gs2Page .benchmark_inner {
  display: flex;
  gap: 50px;
  margin-top: 50px;
}
@media all and (max-width: 768px) {
  .gs2Page .benchmark_inner {
    flex-direction: column;
    gap: 30px;
    margin-top: 50px;
  }
}
.gs2Page .benchmark_inner .benchmark_inner-title {
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 20px;
  line-height: 1;
}
.gs2Page .benchmark_inner .benchmark_inner-img {
}
.gs2Page .benchmark_inner .benchmark_inner-img img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
}

.gs2Page .l-main__doing-block {
  background-color: #fff;
  border-radius: 20px;
  padding: 0 16px;
  font-size: 18px;
  font-weight: bold;
}

.gs2Page .l-main__doing-block .text-20 {
  font-size: 2rem;
  line-height: 1.5;
}
.gs2Page .l-main__doing-block .text-30 {
  font-size: 3rem;
  line-height: 1.4;
}
.gs2Page .l-main__doing-block .text-36 {
  font-size: 3.6rem;
  line-height: 1.4;
}
@media all and (max-width: 768px) {
  .gs2Page .l-main__doing-block .text-30 {
    font-size: 1.8rem;
  }
  .gs2Page .l-main__doing-block .text-36 {
    font-size: 2rem;
  }
}

.gs2Page .l-main__doing-block.bg-gray {
  background-color: #e9ebe8;
}

@media all and (min-width: 1024px) {
  .gs2Page .l-main__doing-block {
    padding: 0 40px;
  }
}
@media all and (max-width: 768px) {
  .gs2Page .l-main__doing-block + .l-main__doing-block {
    margin-top: 4rem;
  }
}
.gs2Page .l-main__doing-block .l-main__doing-block-title {
  font-size: 18px;
  font-weight: bold;
  line-height: 1.7;
}
.gs2Page .l-main__doing-block .l-main__doing-block-title span {
  display: block;
}
.gs2Page .l-main__doing-block-number {
  color: #2b71b8;
  font-family: "Jost", sans-serif;
  font-weight: bold;
  background-color: #fff;
  border-radius: 50%;
  padding: 10px 15px;
  margin-top: -50%;
  font-size: 36px;
}

.gs2Page .gs2-section h2 {
  position: relative;
}
.gs2Page .gs2-section h2.l-main__h2 {
  display: inline-block;
  font-size: 24px;
  font-weight: bold;
  line-height: 1.5;
  margin-bottom: 1em;
  padding-bottom: 0.5em;
}
.gs2Page .gs2-section h2.l-main__h2:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  top: inherit;
  background-color: #2b7ac2;
  border-radius: 3px;
  width: 60px;
  height: 6px;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
@media all and (min-width: 768px) {
  .gs2Page .gs2-section h2.l-main__h2 {
    font-size: 40px;
  }
}
.gs2Page .gs2-section.feature_section h2 {
  margin-bottom: 80px;
  color: #111;
}
.gs2Page .gs2-section.support_section h2 {
  margin-bottom: 40px;
  color: #111;
}
.gs2Page .gs2-section.feature_section .container,
.gs2Page .gs2-section.support_section .container {
  max-width: 1200px;
}
.gs2Page .gs2-section.feature_section .container h4,
.gs2Page .gs2-section.support_section .container h4 {
  font-size: 24px;
  font-weight: bold;
  margin: 20px 0;
}
@media all and (max-width: 768px) {
  .gs2Page .gs2-section.feature_section .container h4,
  .gs2Page .gs2-section.support_section .container h4 {
    font-size: 20px;
  }
}
.gs2Page .gs2-section.feature_section .container .l-main__doing-content,
.gs2Page .gs2-section.support_section .container .l-main__doing-content {
  background-color: #fff;
  border-radius: 20px;
  padding: 32px 16px;
  margin-top: 30px;
}
.gs2Page .gs2-section.feature_section .container .l-main__doing-content.bg-gray,
.gs2Page
  .gs2-section.support_section
  .container
  .l-main__doing-content.bg-gray {
  background-color: #e9ebe8;
}

@media all and (min-width: 768px) {
  .gs2Page .gs2-section.feature_section .container .l-main__doing-content,
  .gs2Page .gs2-section.support_section .container .l-main__doing-content {
    padding: 48px;
  }
}
.gs2Page .gs2-section.feature_section .container .l-main__doing-content h3,
.gs2Page .gs2-section.support_section .container .l-main__doing-content h3 {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 1em;
  display: flex;
  justify-content: flex-start;
}
.gs2Page .gs2-section.feature_section .container .l-main__doing-content h3 {
  align-items: flex-start;
  gap: 30px;
}
.gs2Page .gs2-section.support_section .container .l-main__doing-content h3 {
  align-items: center;
  gap: 40px;
  margin-top: 0;
}

@media all and (min-width: 768px) {
  .gs2Page .gs2-section.feature_section .container .l-main__doing-content h3 {
    font-size: 36px;
  }
  .gs2Page .gs2-section.support_section .container .l-main__doing-content h3 {
    font-size: 24px;
    line-height: 1.5;
  }
}

.gs2Page
  .gs2-section.feature_section
  .container
  .l-main__doing-content
  h3
  span
  + span {
  flex: 1;
}
.gs2Page
  .gs2-section.support_section
  .container
  .l-main__doing-content
  h3
  span
  + span {
  flex: 1;
}
.gs2Page
  .gs2-section.support_section
  .container
  .l-main__doing-content
  h3
  span.num {
  font-size: 60px;
}
@media all and (max-width: 768px) {
  .gs2Page
    .gs2-section.feature_section
    .container
    .l-main__doing-content
    h3
    span
    + span
    br {
    display: none;
  }

  .gs2Page .gs2-section.support_section .container .l-main__doing-content h3 {
    flex-flow: column;
    gap: 20px;
  }
  .gs2Page
    .gs2-section.support_section
    .container
    .l-main__doing-content
    h3
    span.num {
    font-size: 26px;
  }
}
.c-color-blue {
  color: #2b71b8;
}
.c-font-jost {
  font-family: "Jost", sans-serif;
}

.gs2Page #bottomBtn.btn-box {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: center;
  align-content: center;
  margin: 100px 0 0;
}
.gs2Page #bottomBtn.btn-box div {
  width: 47%;
}
@media all and (max-width: 768px) {
  .gs2Page #bottomBtn.btn-box {
    flex-direction: column;
    gap: 20px;
    margin: 100px 0 0;
  }
  .gs2Page #bottomBtn.btn-box div {
    width: 100%;
  }
}
.gs2Page #bottomBtn .btn-lp {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 125px;
  border-radius: 10px;
  background: url(https://www.fanatic.co.jp/wp-content/themes/fanatic/common/image/lp_202109/btn-bg.png)
    center center no-repeat;
  background-size: cover;
  color: #fff;
  font-size: 24px;
  font-weight: 600;
  text-align: center;
  line-height: 1;
  box-sizing: border-box;
  padding-bottom: 5px;
}
@media all and (max-width: 768px) {
  .gs2Page #bottomBtn .btn-lp {
    font-size: 15px;
    height: 80px;
    line-height: 1.6;
  }
}
.gs2Page #bottomBtn .btn-lp:hover {
  opacity: 0.8;
  text-decoration: none;
}

.hide-pc {
  display: none;
}
@media all and (max-width: 768px) {
  .hide-pc {
    display: inline-block;
  }
}
.list-blue-circle {
  padding-left: 18px;
}
.list-blue-circle li {
  line-height: 1.4;
  text-indent: -18px;
  font-size: 16px;
}
.list-blue-circle li + li {
  margin-top: 10px;
}
.list-blue-circle li::before {
  content: "";
  width: 13px;
  height: 13px;
  border-radius: 100%;
  background: #2b71b8;
  display: inline-block;
  margin: 0 5px 0 0;
  vertical-align: baseline;
}

.product_section_inner-item-flex {
  display: flex;
  gap: 55px;
  align-items: center;
  flex-wrap: wrap;
}

.product_section_inner-item-img img {
  max-width: 100%;
}
.product_section_inner-item-img:has(+ .product_section_inner-item-text) {
  width: 47%;
}
.product_section_inner-item-text {
  width: calc(100% - 47% - 55px);
}
.product_section_inner-item-img:has(+ .product_section_inner-item-table) {
  width: 29%;
  filter: drop-shadow(0px 11px 62px rgba(59, 56, 74, 0.51));
}
.product_section_inner-item-table {
  width: calc(100% - 29% - 55px);
}
.product_section_inner-item-text p {
  line-height: 1.875;
}
.product_section_inner-item-table table {
  background-color: #363f60;
  width: 100%;
  border-top: 1px solid #73757a;
}

.product_section_inner-item-table table th,
.product_section_inner-item-table table td {
  border-bottom: 1px solid #73757a;
  font-weight: normal;
}
.product_section_inner-item-table table th {
  position: relative;
  padding: 7px 15px;
}
.product_section_inner-item-table table th::after {
  content: "";
  border-right: 1px solid #73757a;
  position: absolute;
  height: calc(100% - 14px);
  display: block;
  width: 1px;
  left: 100%;
  top: 7px;
}
.product_section_inner-item-table table td {
  position: relative;
  padding: 7px 25px;
}
.product_section_inner-recommend {
  background: #93873d;
  display: inline-block;
  padding: 3px 10px;
  font-size: 16px;
  line-height: 1.5;
}

.gs2Page.gs3Page #l-main__mainvisual {
  background: url(../image/product-solution/gsp3_mv.jpg) center center no-repeat;
  background-size: cover;
  height: 660px;
}
.gs2Page.gs3Page .l-main__mainvisual .l-main__mainvisual-content p {
  font-size: 36px;
}
.gs2Page.gs3Page .l-main__mainvisual .l-main__mainvisual-content h2 {
  font-size: clamp(40px, 5vw, 82px);
}
@media (min-width: 1200px) {
  .gs2Page.gs3Page .l-main__mainvisual {
    max-width: 1486px;
    width: 100%;
  }
}

@media all and (max-width: 768px) {
  .product_section_inner-item-img:has(+ .product_section_inner-item-text) {
    width: 100%;
  }
  .product_section_inner-item-img:has(+ .product_section_inner-item-table) {
    width: 100%;
  }
  .product_section_inner-item-text {
    width: 100%;
  }
  .product_section_inner-item-table {
    width: 100%;
  }
  .product_section_inner-item-table table th,
  .product_section_inner-item-table table td {
    display: block;
    padding: 10px 20px;
    line-height: 1.5;
  }
  .product_section_inner-item-table table td {
    background: rgb(62 71 103);
  }

  .product_section_inner-item-table table th::after {
    content: none;
  }
  .gs2Page.gs3Page #l-main__mainvisual {
    height: auto;
    padding: calc(700 / 1600 * 50vw) 0 calc(700 / 1600 * 50vw) 3vw;
  }
  .gs2Page.gs3Page .l-main__mainvisual .l-main__mainvisual-content p {
    font-size: 18px;
  }
  .gs2Page.gs3Page .l-main__mainvisual .l-main__mainvisual-content h2 {
    font-size: 38px;
  }
}