@charset "UTF-8";

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 100;
  src: url('/sales/assets/fonts/NotoSansJP-Thin.woff2') format('woff2'),
    url('/sales/assets/fonts/NotoSansJP-Thin.woff') format('woff'),
    url('/sales/assets/fonts/NotoSansJP-Thin.otf') format('opentype');
  font-display: swap;
}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 200;
  src: url('/sales/assets/fonts/NotoSansJP-Light.woff2') format('woff2'),
    url('/sales/assets/fonts/NotoSansJP-Light.woff') format('woff'),
    url('/sales/assets/fonts/NotoSansJP-Light.otf') format('opentype');
  font-display: swap;
}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 300;
  src: url('/sales/assets/fonts/NotoSansJP-DemiLight.woff2') format('woff2'),
    url('/sales/assets/fonts/NotoSansJP-DemiLight.woff') format('woff'),
    url('/sales/assets/fonts/NotoSansJP-DemiLight.otf') format('opentype');
  font-display: swap;
}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 400;
  src: url('/sales/assets/fonts/NotoSansJP-Regular.woff2') format('woff2'),
    url('/sales/assets/fonts/NotoSansJP-Regular.woff') format('woff'),
    url('/sales/assets/fonts/NotoSansJP-Regular.otf') format('opentype');
  font-display: swap;
}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 500;
  src: url('/sales/assets/fonts/NotoSansJP-Medium.woff2') format('woff2'),
    url('/sales/assets/fonts/NotoSansJP-Medium.woff') format('woff'),
    url('/sales/assets/fonts/NotoSansJP-Medium.otf') format('opentype');
  font-display: swap;
}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 700;
  src: url('/sales/assets/fonts/NotoSansJP-Bold.woff2') format('woff2'),
    url('/sales/assets/fonts/NotoSansJP-Bold.woff') format('woff'),
    url('/sales/assets/fonts/NotoSansJP-Bold.otf') format('opentype');
  font-display: swap;
}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 900;
  src: url('/sales/assets/fonts/NotoSansJP-Black.woff2') format('woff2'),
    url('/sales/assets/fonts/NotoSansJP-Black.woff') format('woff'),
    url('/sales/assets/fonts/NotoSansJP-Black.otf') format('opentype');
  font-display: swap;
}


/* Reset
------------------------------------ */
html, body, div, span,
p, blockquote,
del, dfn, em, img, small, strong, b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, menu, nav, section, summary,
time, mark, audio, video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;}
h1, h2, h3, h4, h5, h6{margin:0;padding:0;font-weight:normal;}
body{line-height:1;-webkit-font-smoothing:antialiased;/*safari :hover用*/}
ol, ul{list-style:none;}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;}
table{border-collapse:collapse;border-spacing:0;}
input, select{vertical-align:middle;}
input[type=submit], input[stype=text], input[type=button]{border-radius:0;-webkit-appearance:none;}
*{box-sizing:border-box;}
/* baseStyle
------------------------------- */
html, body{width:100%;font-size:62.5%;}
body{min-width:1120px;background:#fff;color:#363636;  font-family: 'Noto Sans Japanese', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ',
  Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
;font-size:1.4em;line-height:1.5;}
a,
a:hover{color:#005eb4;text-decoration:none;}
a:hover{text-decoration:underline;}

/* 各種ヘッダー */
.contents-header {
  margin-bottom: 0;
  width: 100%;
  height: 174px;
  background-color: #d5e4f2;
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
}
.contents-header.map_scroll{background-image:url(../img/img_main_mapscroll.jpg?v01);}
.contents-header.search_word{background-image:url(../img/img_main_searchword.jpg?v01);}
.contents-header.address_zip{background-image:url(../img/img_main_addresszip.jpg?v01);}
.contents-header-ttl {
  width: 940px;
  height: 100%;
  padding: 0 20px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-flow: row nowrap;
}
.contents-header span {
  color: #fff;
  font-size: 30px;
  font-weight: 500;
}
/* 枠 */
.wrapper {
  padding-top: 80px;
}
.l-contents,
.tabs-wrap{margin:0 auto;width:900px;}
.l-contents{margin:0 auto;padding:30px 50px 50px;width:900px;position:relative;background:#f9f9f9;}
.l-contents.top{background:#fff;}

/* 汎用見出し */
.contents-ttl{margin-bottom:20px;border-left:4px solid #005eb4;color:#005eb4;font-size:2.0rem;}
.contents-ttl span{padding-left:10px;display:block;}
.text{font-size:1.3rem;}
.text + .text{margin-top:1.0rem;}
.strong{color:#4087c7;}
.btn{display:inline-block;border-radius:20px;color:#fff;text-align:center;line-height:40px;}
.btn:link,.btn:visited,.btn:hover,.btn:active{color:#fff;text-decoration:none;}
.btn.common{height:36px;border-radius: 50px;background:#005eb4;line-height:36px;position:static;}
.btn:hover{opacity:.8;}
.remarks{margin-top:15px;padding:20px;background:#edf3f9;border-radius:5px;}
.contents-small-ttl{margin-bottom: 5px;color:#005eb4;}
.remarks .circle-list li{font-size: 1.3rem;line-height:inherit;}
/*　コンテンツページ
------------------------------- */
.detail ~ .detail{margin-top:50px;}
/* 概要 */
.feature-list{margin-top:20px;padding:15px;border:1px solid #7cabd6;border-radius:5px;background:#fff;color:#005eb4;font-size:1.6rem;}
.feature-list li{padding:5px 0 5px 27px;background:url(../img/icon_check.png) no-repeat left center;line-height:1;}
.feature-list-ttl{padding:5px 0 5px 27px;background:url(../img/icon_check.png) no-repeat left center;line-height:1;color:#005eb4;font-size:1.6rem;}
.feature-list-text{padding:5px 0 0 27px;}
.feature-list-text + .feature-list-ttl{margin-top: 16px;}
/* 表示サンプル */
.sample-wrap{margin-top:20px;border:1px solid #7cabd6;background:#edf3f9;overflow:hidden;}
.map{width:618px;height:440px;float:left;border-right:1px solid #7cabd6;overflow:hidden;}
.sample-btn{width:180px;float:right;}
.sample-btn li{padding:15px 10px 15px 25px;display:block;border-bottom:1px solid #7cabd6;background:#edf3f9 url(../img/icon_map_arrow01.png) no-repeat 10px center;color:#005eb4;font-size:1.2rem;line-height:1;cursor:pointer;}
.sample-btn li:hover,.sample-btn li:focus{background-color:#d5e4f2;background-image:url(../img/icon_map_arrow01.png);}
.sample-wrap .sample-btn .active{background-color:#005eb4;background-image:url(../img/icon_map_arrow02.png);color:#fff;}

.sample-wrap.sample-source-wrap{border-radius:5px 5px 0 0;}
.sample-wrap.sample-source-wrap .sample-btn .active{cursor: inherit;}
/*ソースサンプル*/
.sample-source {width: 100%;float: none;display:flex;justify-content: flex-start;align-items: center;flex-flow: row nowrap;border-bottom:1px  solid #7cabd6;}
.sample-source li{width:150px;border-right: 1px  solid #7cabd6;border-bottom: none;}
.sample-source li a{display:block;padding:15px 10px 13px 25px;font-size: 1.3rem;background:#edf3f9 url(../img/icon_map_arrow01.png) no-repeat 10px center;color:#005eb4;line-height:1;cursor:pointer;}
.sample-source .active{display:block;padding:15px 10px 13px 25px;font-size: 1.3rem;background:#005eb4 url(../img/icon_map_arrow02.png) no-repeat 10px center;color:#fff;line-height:1;cursor: inherit;}
.sample-source-body {padding:20px;background:#fff;}
.sample-source-ttl{font-weight: bold;}
.sample-source-em-color{color:#005eb4;}
.sample-source-code {margin-top:10px;height: 240px;border:1px solid #dddddd;}
.sample-source-code pre {width: 100%;height: 100%;margin: 0;padding: 10px;overflow:auto;}
.sample-source-code pre code{line-height: 1.5;
font-family: Menlo, Consolas, 'DejaVu Sans Mono', monospace,sans-serif;}
.sample-source-code pre.prettyprint{border:none;}
.sample-source-body em {color:#f5a100;font-style:normal;}
.sample-source-code + .sample-source-ttl{margin-top:30px;}
.sample-source-code + .text{margin-top: 10px;margin-bottom: 10px;}
.sample-source-body .trial-em-ttl {margin-bottom:0;text-decoration:underline;}
.sample-source-body .trial-info-now {display:block;padding:20px 16px;background:#fff5ea;text-decoration:none;color:#363636;}
.trial-info-now:hover .trial-em-ttl{text-decoration:none;}
/* 導入費用 */
.price-ttl{margin-left:20px;padding-left:35px;height:35px;background:url(../img/bg_price_ttl.gif) no-repeat left center;color:#fff;font-size:1.8rem;line-height:35px;}
.price{padding:50px;background:#fff;}
.price-list{width:50%;float:left;font-size:0;}
.price-list dt,
.price-list dd{display:inline-block;font-size:1.4rem;}
.price-list dt{width:127px;height:44px;border:1px solid #005eb4;color:#005eb4;font-weight:bold;font-size:1.8rem;text-align:center;line-height:44px;}
.price-list dd{padding-left:20px;width:223px;}
.cost01 dd{padding-right:10px;}
.price-text{padding-top:30px;clear:both;}
.price .btn-wrap{padding:0;text-align:center;}
.price .btn{width:336px;}

.price-show-ttl{height:50px;background:#005eb4;border-radius:5px 5px 0 0;color:#fff;font-size:2rem;line-height:50px;text-align:center;font-size:0;cursor: pointer;}
.price-show-ttl-inner {position:relative;display: inline-block;line-height:1;vertical-align: middle;font-size: 20px;}
.price-show-ttl-inner::before{display: inline-block;content: '';margin-top: 0;margin-right: 10px;background: url(../img/icon_toggle.png) no-repeat center center;width: 18px;height: 20px;vertical-align: middle;}
.is-active .price-show-ttl-inner::before{display:none;}
.click-display {font-size: 13px;}
.price-show{padding:20px;background:#fff;border:1px solid #7cabd6;border-top: none;border-radius:0 0 5px 5px;}
/* よくあるご質問 */
.faq-ttl{padding-bottom:10px;border-bottom:1px solid #005eb4;color:#005eb4;font-size:1.8rem;text-align:center;line-height:1;}
.faq-list{padding:25px 20px 0;font-size:0;}
.faq-list span{display:inline-block;}
.faq-list-a{margin-top:12px;margin-bottom:24px;}
.faq-list-a + .faq-list-q{padding-top:24px;border-top:1px solid #b3b3b3;}
.faq-q,
.faq-q-text{vertical-align:middle;}
.faq-a,
.faq-a-text{vertical-align:top;}
.faq-q,
.faq-a{width:32px;height:32px;font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;color:#fff;font-size:2.0rem;text-align:center;line-height:32px;}
.faq-q{background:#005eb4;}
.faq-a{background:#f7931e;}
.faq-q-text,
.faq-a-text{padding-left:12px;width:calc(100% - 32px);}
.faq-q-text{font-size:1.6rem;margin-top: -3px;}
.faq-a-text{font-size:1.4rem;}
.faq-more{width:100%;height:40px;display:block;border:1px solid #c0cedb;background:#c0cedb;color:#fff;text-align:center;line-height:40px;}
.faq-more:link,
.faq-more:visited,
.faq-more:link:hover{color:#fff;}
.faq-more:hover{border:1px solid #999;}
.faq-more span{padding-right:25px;display:inline-block;background:url(../img/icon_morelink.png) no-repeat right center;}
/* 電話バナー */
.tel{text-align:center;}
/* お問い合わせバナー */
.contact-btn{padding:0 15px;width:350px;height:60px;display:block;position:fixed;right:-350px;bottom:10px;z-index:10;border:2px solid #005eb4;border-radius:10px 0 0 10px;background:rgba(255,224,0,1) url(../img/icon_contact_arrow.png) no-repeat 190px center;font-size:1.7rem;line-height:56px;transition:background-color .3s ease;}
.contact-btn:hover{background-color:rgba(255,224,0,.5);text-decoration:none;}
/* 申し込みフロー */
.flow{margin-bottom:50px;width:100%;overflow:hidden;}
.flow-unit{width:240px;float:left;}
.flow-unit.step02{width:320px;}
.flow-step{height:40px;display:block;border-top:1px solid #005eb4;border-bottom:1px solid #005eb4;font-weight:normal;font-size:1.6rem;line-height:38px;}
.step01 .flow-step{padding-left:15px;border-left:1px solid #005eb4;}
.step02 .flow-step{padding-left:75px;background:url(../img/img_flow.gif) no-repeat left center;}
.step03 .flow-step{padding-left:55px;border-right:1px solid #005eb4;background:#005eb4;color:#fff;}
.flow-text{padding-top:15px;}
.step01 .flow-text{padding-left:10px;}
.step02 .flow-text{padding-right:40px;padding-left:40px;}
.step03 .flow-text{padding-right:10px;}
/*　iframe
------------------------------- */
.contact-wrap{margin:50px auto 0;width:800px;}
.contact-form{width:100%;height:830px;display:block;border:0;}
.contact-lead{padding:20px 0 30px 30px;font-size:1.2rem;}
.contact-lead span{color:#f00;}
/*　thanks
------------------------------- */
.thanks{padding-top:50px;text-align:center;margin-top: 50px;}
.thanks strong{color:#005eb4;font-size:2.0rem;}
.thanks strong ~ p{margin-top:20px;}

/*　footer
------------------------------- */
.glb-footer{padding:50px 0;font-size:1.2rem;text-align:center;}
.glb-footer ul {margin-bottom: 10px;font-size: 0;}
.glb-footer ul li{
  display: inline-block;
}
.glb-footer ul li + li {
  border-left: 1px solid #ccc;
}
.glb-footer a {
  padding: 0 5px;font-size:1.2rem;
}
/*　other
------------------------------- */
.single-line{vertical-align:middle;}
.multi-line{vertical-align:top;}
.services::after,
.tabs::after{display:block;content:"";clear:both;}


/* 共通ヘッダー(spなし)
------------------------------- */

.l-header {
  width: 100%;
  min-width: 1120px;
  height: 80px;
  padding: 22px 0;
  background: rgba(255, 255, 255, 1.0);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1001;
  border-bottom: 1px solid #919191;
}

.l-header.page {
  position: static;
}

.l-header .container {
  max-width: 1200px;
  min-width: 1120px;
  padding: 0 20px;
  margin: 0 auto;
}

.l-header .container.clearfix {
  overflow: inherit;
}

.l-header .container .logo {
  float: left;
  padding-top: 4px;
  text-decoration: none;
}

.l-header .container .logo a {
  display: block;
  color: #121212;
  font-weight: 700;
}

.l-header .container .logo a img {
  display: inline-block;
  width: auto;
  height: 35px;
  vertical-align: middle;
}

.l-header .container .logo a p {
  display: inline-block;
  margin-top: -3px;
  margin-left: 10px;
  vertical-align: middle;
}
.logo a .logo-text-pc {
  display: inline-block;
  margin-top: -3px;
  margin-left: 10px;
  vertical-align: middle;
  font-size: 15px;
}

.l-header .container .logo a .logo-text-sp {
  display: none;
}

/* l-gNav */
.l-gNav {
  float: right;
  width: 552px;
  position: relative;
  z-index: 1;
}
.l-gNav.clearfix {
  overflow: inherit;
}
.l-gNav .nav-text {
  display: block;
  float: left;
  text-align: right;
}
.l-gNav .nav-text li {
  display: inline-block;
  margin-left: 26px;
}
.l-gNav .nav-text li:first-child {
  margin-left: 0;
}
.l-gNav .nav-text li a {
  display: block;
  color: #121212;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 36px;
  background: url(/sales/assets/images/common/icn_arrow_navi3.png) no-repeat 0 11px;
  padding-left: 24px;
}
.l-gNav .nav-btn {
  text-align: right;
}
.l-gNav .nav-btn li {
  display: inline-block;
  width: 150px;
  margin-left: 12px;
}
.l-gNav .nav-btn li.nav-dl {
  display: inline-block;
  position: relative;
  width: 150px;
  height: 2rem;
}
.l-gNav .nav-btn li a {
  display: block;
  padding: 8px 5px 10px 5px;
  border: 2px solid #f98b09;
  background-color: #f98b09;
  border-radius: 5px;
  color: #fff;
  font-size: 16px;
  font-weight: 900;
  text-align: center;
  line-height: 1;
}
.l-gNav .nav-btn li.nav-dl a {
  border: 2px solid #053994;
  background-color: #053994;
  color: #fff;
  line-height: 1;
  font-weight: 900;
}
.button-menu-wrap {
  display: none;
}

/**/
.nav-text-menu {
  visibility: hidden;
  opacity: 0;
  transition: 0.3s opacity 0s linear,0.1s visible 0s linear;
  width: 196px;
  position: absolute;
  top: 91%;
  left: 0;
  z-index: 1;
}

.l-gNav .nav-text-menu li {
  margin-left: 0;
  display: block;
}

.l-gNav .nav-text-menu li a {
  padding: 16px 16px;
  font-size: 1.6rem;
  background: #EDF6FC;
  border-bottom: 1px solid #fff;
  text-align: left;
  line-height: 1.1;
}

.nav-text-menu a:where(:hover,:focus) {
  opacity: 0.9 !important;
}

.nav-text-menu li a::before {
  content: '';
  display: inline-block;
  margin-right: 2px;
  border: 6px solid transparent;
  border-left-color: #053994;
  border-width: 4px 5px;
  position: relative;
  top: -3px;
}

.nav-text > li:first-child:where(:hover,:focus) .nav-text-menu{
  visibility: visible;
  opacity: 1;
}

/* ぱんくず(spなし)
------------------------------- */

.l-topicPath {
  margin-bottom: 20px;
  padding: 20px 0;
}

.l-topicPath .container {
  max-width: 940px;
  margin: 0 auto;
  padding: 0 20px;
}

.l-topicPath ol li {
  font-size: 13px;
  font-size: 1.3rem;
  line-height: 1;
  display: inline-block;
}

.l-topicPath ol li a {
  color: #919191;
  text-decoration: underline;
}

.l-topicPath ol li a:hover, .l-topicPath ol li a:active, .l-topicPath ol li a:focus {
  text-decoration: none;
}

.l-topicPath-arrow {
  padding-left: 30px;
  position: relative;
}

.l-topicPath-arrow:before {
  content: "";
  display: block;
  width: 5px;
  height: 7px;
  background: url(/sales/assets/images/common/icn_arrow_breadcrumb.png) no-repeat top left;
  position: absolute;
  top: 0;
  left: 10px;
  bottom: 0;
  margin: auto;
}

/* 資料ダウンロードボタン付き(spなし)
------------------------------- */
.m-container {
  max-width: 1470px;
  min-width: 1120px;
  width: calc(100% - 40px);
  margin: 0 auto;
  position: relative;
}

.m-container.small {
  max-width: 1120px;
}
.m-contact-box {
  width: 100%;
  min-width: 1120px;
  height: 165px;
  padding: 40px 0 35px 0;
  background: #fff;
}
.m-contact-box {
  padding-bottom: 90px;
}
.m-contact-box.download {
  background: #fff;
  line-height: 1;
}

.m-contact-box.download .document {
  width: 33%;
  padding: 0 4%;
  text-align: center;
  float: left;
}

.m-contact-box.download .document .button-container {
  width: 285px;
  margin: 27px auto 0 auto;
}

.m-contact-box.download .tel {
  width: 31%;
  padding: 0 4%;
}

.m-contact-box.download .tel .middle {
  font-size: 33px;
  font-size: 3.3rem;
}

.m-contact-box.download .tel .middle span {
  padding-left: 11%;
}

.m-contact-box.download .form {
  width: 33%;
  padding: 0 4%;
  text-align: center;
}

.m-contact-box.download .form .button-container {
  width: 285px;
  margin: 13px auto 0 auto;
}

.m-contact-box.download .document .button-container {
  width: 285px;
  margin: 27px auto 0 auto;
}

.m-contact-box .tel, .m-contact-box .form {
  width: 50%;
  float: left;
}
.m-contact-box.download .tel {
  width: 31%;
  padding: 0 4%;
}
.m-contact-box .tel .top {
  font-weight: 500;
  font-size: 16px;
  font-size: 1.6rem;
}
.m-contact-box.download .tel .middle {
  margin-top: 10px;
  font-weight: 700;
  font-size: 33px;
  font-size: 3.3rem;
}

.m-contact-box.download .tel .middle span {
  padding-left: 11%;
  background: url(/sales/assets/images/common/icn_tel.png) no-repeat center left/10% auto;
}
.m-contact-box .tel .bottom {
  font-size: 16px;
  font-size: 1.6rem;
}
.m-contact-box .tel .bottom {
  margin-top: 10px;
  font-weight: 500;
}

.m-contact-box.download .document .button-container {
  width: 285px;
  margin: 27px auto 0 auto;
}

.m-contact-box.download .document .button-container {
  width: 285px;
  margin: 27px auto 0 auto;
}
.m-button01 {
  width: 100%;
  display: block;
  padding: 17px 0;
  background: url(/sales/assets/images/common/icn_button01_arrow.png) no-repeat center right 15px, #121212;
  border: none;
  cursor: pointer;
  font-family: 'Noto Sans Japanese';
  font-weight: 500;
  color: #fff;
  font-size: 16px;
  font-size: 1.6rem;
  text-align: center;
  position: relative;
  z-index: 2;
}
.m-button01:link,.m-button01:visited,.m-button01:active {
  color: #fff;
}
.button-container .m-button01.navy, .m-button01.navy {
  background-color: #053994;
}

.clearfix {
  zoom: 1;
  overflow: hidden;
}

.button-container .m-button01.orange, .button-container-case .m-button01.orange {
  background: url(/sales/assets/images/common/icn_button01_arrow.png) no-repeat center right 15px, #f98b09;
}

.m-contact-box .form p {
  font-weight: 500;
  font-size: 16px;
  font-size: 1.6rem;
}

/* 共通フッター(spなし)
------------------------------- */
.l-footer {
  width: 100%;
  min-width: 1120px;
  padding: 0;
  background: #121212;
}

.l-footer .list-copyright {
  float: right;
}

.l-footer .list-copyright ul li {
  padding: 0 25px;
  /* border-left: 1px solid #fff; */
  float: left;
}

.l-footer .list-copyright ul li:first-child {
  padding-left: 0;
  border-left: none;
}

.l-footer .list-copyright ul li:last-child {
  padding-right: 0;
}

.l-footer .list-copyright ul li a {
  display: block;
  color: #fff;
  font-size: 15px;
  font-weight: 400;
}

.l-footer .list-copyright p {
  margin-top: 10px;
  color: #7e7e7e;
  font-size: 14px;
  font-size: 1.4rem;
  text-align: right;
}

.l-footer .logo {
  float: left;
}

.l-footer .logo a {
  display: block;
}

.l-footer .logo img {
  margin: 2px auto;
  max-width: none;
  height: 35px;
  width: auto;
}

.l-footer .m-container.small {
  height: 100px;
  max-width: 1200px;
  min-width: 1120px;
  padding: 22px 20px;
}


/* コンテンツ直下のボタン(spなし)
------------------------------- */
.btn-wrap {
  width: 100%;
  padding: 80px 0 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: row nowrap;
}

.btn-wrap .button-container_lower {
  margin: 0;
  width: 340px;
}
.btn-wrap .button-container_lower:first-child {
  margin-right: 35px;
}
.btn-wrap .button-container_lower:first-child {
  margin-right: 35px;
}

.btn {
  width: 100%;
  display: block;
  height: 56px;
  color: #ffffff;
  text-align: center;
  border-radius: 4px;
  position: relative;
}
.btn > span {
  line-height: normal;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: row nowrap;
  font-size: 16px;
  font-weight: 500;
}
.btn::after {
  content: '';
  width: 10px;
  height: 10px;
  border: 3px solid #fff;
  border-width: 3px 3px 0 0;
  position: absolute;
  top: 50%;
  right: 18px;
  margin-top: -6px;
  transform: rotate(45deg);
}
.btn-dl {
  background: #053994;
}
.btn.btn-trial {
  color: #053994;
  background: #fff;
  border: 2px solid #053994;
}
.btn.btn-trial::after {
  border-color: #053994;
}
.btn-wrap .button-container_lower > .btn-trial > span {
  height: 100%;
}
.btn.btn-trial .tag {
  margin-top: 2px;
  font-size: 13px;
  padding: 2px 8px 2px;
  color: #fff;
  background: #f98b09;
  letter-spacing: 1px;
  margin-right: 5px;
}
.btn.btn-back {
  width: 380px;
  color: #053994;
  background-color: #fff;
  border: 2px solid #053994;
  position: relative;
}
.btn-back::after {
  content: '';
  width: 10px;
  height: 10px;
  border: 3px solid #053994;
  border-width: 3px 3px 0 0;
  position: absolute;
  top: 50%;
  left: 18px;
  margin-top: -6px;
  transform: rotate(-135deg);
}

.btn-estimate {
  background: #f98b09;
}

/* api提供サービスINDEX(spなし)
------------------------------- */
.m-section {
  width: 100%;
  background: #EEF5FB;
}
.bg-white {
  width: 100%;
  background: #fff;
}
.m-section-inner {
  width: 800px;
  padding-top: 80px;
  padding-bottom: 80px;
  margin: 0 auto;
}
.ttl-section-api {
  color: #005EB4;
  font-weight: bold;
  font-size: 40px;
  margin-bottom: 32px;
  text-align: center;
  line-height: 1;
}
.ttl-section-api_sub {
  display: block;
  color: #121212;
  font-size: 15px;
  text-align: center;
  margin-bottom: 5px;
}
.m-title03 {
  margin-top: 40px;
  margin-bottom: 30px;
  padding-bottom: 12px;
  border-bottom: 2px solid #005EB4;
  font-family: 'Noto Sans Japanese';
  font-weight: 500;
  color: #005EB4;
  line-height: 1.25;
  padding-bottom: 10px;
  font-size: 19px;
  font-size: 1.9rem;
}
.box-4c {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 12px 12px;
}
.card-top {
  height: 100%;
  display: block;
  padding: 20px 5px;
  color: #121212;
  background: #fff;
}
.card-top:hover {
  text-decoration: none;
}
.card-top:hover .card-ttl {
  color: #121212;
}
.card-top .card-fig {
  width: 80px;
  margin: 0 auto 10px;
}
.card-top .card-fig img {
  width: 100%;
  height: auto;
}
.card-top .card-ttl {
  text-align: center;
  font-size: 14px;
  font-weight: 500;
}

.section-index .btn-wrap {
  padding-top: 40px;
  padding-bottom: 40px;
}
/* hover
------------------------------- */
.l-header a, .l-footer a, .l-nav-menu a, .button-container a, .caseintro-wrap a img, .m-button01,a.card-top {
  transition: 0.2s opacity 0s linear;
  opacity: 1;
}

.l-header a:hover, .l-footer a:hover, .l-nav-menu a:hover, .button-container a:hover, .caseintro-wrap a img:hover, .m-button01:hover ,a.card-top:hover{
  opacity: 0.7;
  text-decoration: none;
}

.l-header a:focus, .l-footer a:focus, .l-nav-menu a:focus, .button-container a:focus, .caseintro-wrap a img:focus, .m-button01:focus ,a.card-top:focus{
  opacity: 0.7;
  text-decoration: none;
}

/* 旧Top(meta表示用に残し)
------------------------------- */
.inner{margin:0 auto;width:900px;overflow:hidden;}
.top-header{padding-top:28px;width:100%;height:376px;background:#d5e4f2 url(../img/img_main.jpg) no-repeat center top;background-size:cover;text-align:right;}
.intro{padding-bottom:45px;}
.lead-list{margin-top:1.4rem;}
.btn.application{width:390px;height:40px;background:#f7931e;font-size:2.2rem;line-height:40px;}
.btn.application:hover{background:#ffab4b;}
.intro .btn-wrap{margin-top:45px;text-align:center;}
.services{height:321px;position:relative;background:#f9f9f9;}
.services ~ .services{margin-top:45px;}
.services-ttl{padding:0 0 15px 60px;position:relative;border-bottom:1px solid #005eb4;color:#005eb4;font-size:2.8rem;line-height:1;}
.services-icon{position:absolute;left:0;bottom:10px;}
.services-image{width:373px;}
.services-detail{padding:30px 24px;width:calc(100% - 373px);height:100%;position:relative;}
.services-detail > p{margin-top:24px;}
.services:nth-of-type(odd) .services-detail,
.services:nth-of-type(even) .services-image{float:left;}
.services:nth-of-type(even) .services-detail,
.services:nth-of-type(odd) .services-image{float:right;}
.services-detail .btn-wrap{position:absolute;}
.services-detail .btn-wrap{width:100%;position:absolute;left:0;bottom:30px;}
.services-detail .btn{margin:0 auto;width:270px;display:block;font-size:1.8rem;}