@charset "UTF-8";
@media screen and (min-width: 768px),print {  /* 3枚表示のbxslider
-------------------------------------*/



#m-sl{ overflow: hidden; width: 100%; min-height: 1180px; background-color: #999;}
#m-sl figure{ width: 100%; display: block; text-align: center; padding-top: 300px;}
.side-fix { display: none;}

#top #g-nav{ width: 100%; height: 120px; }
#top .g-nav-box{ width: 100%; position: relative;  min-width: 1260px;}
#top header{ display: none; }
#top .navi-inner{ margin: 0px; text-align: left; padding-left: 20px;  }
#top .g-nav-btn{ position: absolute; top: 0; right: 0; }
#top .g-nav-box .sns-list{ position: absolute; top: 0; left: 860px; }



/* concept -------------------------------------*/
#concept{ color: #fff; width: 100%; margin: 0 auto 100px auto; padding: 122px 0; background: url(../images/index/concept-back.jpg) no-repeat center top; min-height: 860px; }
#concept h2{ text-align: center; font-size: 42px; font-weight: normal; margin-bottom: 33px; letter-spacing: 16.8px;}
#concept h2 span{ display: block; margin-bottom: 70px;}
#concept p{ font-size: 15px; margin-bottom: 33px; letter-spacing: 6px; }
#concept .btn{ text-align: center; }
#concept .inner-Box{ width: 1100px; margin: 0 auto; text-align: center }


/* kodawari -------------------------------------*/
#kodawari{  }
#kodawari h2{ font-size: 22px; text-align: center; margin-bottom: 30px; letter-spacing: 4.4px; }
#kodawari h2 span{ display: block; margin-bottom: 10px;}
#kodawari ul{ margin-bottom: 60px; background: #000; min-width: 1250px;}
#kodawari ul li{ width: 50%; float: left;  }
#kodawari ul li img{ width: 100%; }

/* svc -------------------------------------*/
#svc{ color: #fff; width: 100%; margin: 0 auto 0px auto; padding: 122px 0 0px 0; background: url(../images/index/svc-back.jpg) no-repeat center top #161519; min-height: 1750px; }
h2.svc-ttl{ font-size: 22px; text-align: center; margin-bottom: 30px; letter-spacing: 4.4px; }
h2.svc-ttl span{ display: block; margin-bottom: 10px;}
#svc p{ font-size: 15px; margin-bottom: 33px; letter-spacing: 6px; }
#svc .btn{ text-align: center; }
#svc .inner-Box{  }
#svc .inner-contents01{ width: 1180px; position: relative; height: 500px; margin: 0 auto; }
#svc .inner-contents01 h3{ font-size: 32px; letter-spacing: 6.4px; color: #c3ac1e; margin-bottom: 60px; }
#svc .inner-contents01 .text-bb{ width: 600px; margin-bottom: 72px; line-height: 32px;}
#svc .inner-contents01 figure{ position: absolute; left: 450px; bottom: -70px; }
#svc .svc-list{ position: relative; z-index: 5; max-width: 1400px; width: 100%; min-width: 1250px; margin: 0 auto 140px auto; }
#svc .svc-list li{ width: 24%; float: left; margin-right: 1.3%; }
#svc .svc-list li img{ width: 100%;}
#svc .svc-list li:nth-child(4n){ margin-right: 0;}
#svc .svc-list2{ width: 1220px; margin: 0 auto;  }
#svc .svc-list2 li{ color: #fff; padding-top: 40px; padding-left: 40px; position: relative; margin-right: 18px; float: left; width: 590px; height: 220px; background: url(../images/index/svc-mini.png)no-repeat left top; }
#svc .svc-list li:nth-child(2n){ margin-right: 0;}
#svc .svc-list2 li img{ position: absolute; top: -40px; right: 40px; }
#svc .svc-list2 li h3{ font-size: 24px; color: #c3ac1e; letter-spacing: 4.8px; margin-bottom: 20px; }
#svc .svc-list2 li p{ line-height: 19px; width: 230px; }
#svc .svc-list2 li a p{ color: #fff; font-size: 12px; }


/* case -------------------------------------*/
#case{ width: 100%; margin: 0 auto 110px auto; padding: 0px 0 80px 0; background: #161519; position: relative;}
#case h2{letter-spacing: 6.4px; color: #fff; text-align: center; font-size: 2em; font-weight: bold; margin-bottom: 0px; position: relative; top: -60px;}
#case h2 img{ margin-bottom: 25px; }
#case .sub-tit{ color: #fff; text-align: center; margin-bottom: 25px;letter-spacing: 6.4px;  position: relative; top: -60px;}

#case .btn{ width: 1200px; text-align: right; position: relative; top: -40px; margin: 0 auto; margin-bottom: -0px;  }
#case .inner-Box{ width: 100%; margin: 0 auto; }
#case .system-list{ margin-bottom: 20px; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#case .system-list li{ width: 25%; background: #161519; position: relative; color: #fff;}
#case .system-list li a{ color: #fff;}
#case .system-list li .icon{ position: absolute; bottom: 20px; right: 20px; }
#case .system-list li:nth-child(2n){ background: #23262a;}
#case .system-list li a:hover{ text-decoration: none; }
#case .system-pic{ width: 100%; height: 330px; overflow: hidden; text-align: center; position: relative}
#case .system-pic img{ width: 100%; height: 330px; }
#case .system-date{ position: absolute; bottom: 20px; left: 20px; font-size: 20px;}
#case .system-ttl-01{ padding: 20px 20px 40px 20px; font-size: 14px; margin-bottom: 20px; line-height: 1.4; }
#case .system-category-set { margin-bottom: 15px;}
#case .system-category{ left: 0px; bottom: 0px; font-size: 16px; color: #fff; text-align: center; padding: 12px 33px; display: inline-block; position: absolute}
#case .icon01{ background: #db3716; }
#case .icon02{ background: #cd9f56; }
#case .icon03{ background: #2b6590; }
#case .icon04{ background: #366733; }
#case .icon05{ background: #444; }
#case .icon06{ background: #555; }
#case .system-icon02{ padding: 5px 10px; background: #ccc; position: absolute; top: 35px; left: 0; }

.slider-3mai-Box { overflow: hidden; position: relative; width: 100%; margin-bottom: 50px; background: url(../images/index/voice-back.jpg) no-repeat center top 50px;}
.slider-3mai-Box .slider-3mai { position: relative; left: 50%; width: 3750px; margin-left: -1875px; }
.slider-3mai-Box .slider-3mai li { width: 1200px !important; }
.slider-3mai-Box .bx-wrapper .bx-controls-direction a { position: absolute; top: 34%; outline: 0; width: 60px; height: 60px; text-indent: -9999px; z-index: 9999; }
.slider-3mai-Box .bx-wrapper .bx-prev { left: 1270px; background-image: url(../images/index/bx-l.jpg); background-position: 0 0; }
.slider-3mai-Box .bx-wrapper .bx-next { right: 1270px; background-image: url(../images/index/bx-r.jpg); background-position: 0 0; }

/* voice -------------------------------------*/
.slider-3mai-Box .system-pic{ width: 100%; height: 220px; margin-bottom: 20px; overflow: hidden; text-align: center; }
.slider-3mai-Box .inner-bb{ width: 560px; margin: 0 auto; position: relative; }
.slider-3mai-Box .inner-bb .icon{ position: absolute; bottom: 0px; right: 0px; }
.slider-3mai-Box .system-pic{ width: 100%; height: 420px; margin-bottom: 20px; overflow: hidden; text-align: center; }
.slider-3mai-Box .system-pic img{ width: 100%; height: 420px; }
.slider-3mai-Box .system-customer{ font-size: 14px; font-weight: 400; margin-bottom: 10px; line-height: 1.4; }
.slider-3mai-Box .system-ttl-01{ font-size: 1em; margin-bottom: 20px; line-height: 1.4; }
.slider-3mai-Box .system-category{ margin-bottom: 10px; font-size: 0.75em; font-weight: bold; color: #fff; text-align: center; padding: 3px; background-color: rgba(35, 24, 21, 0.7);}

.voicett{ width: 1200px; margin: 0 auto; position: relative; height: 10px; }
.voicett h2{ position: absolute; left: 136px; z-index: 4; }
.voicett p{ position: absolute; right: 0px; top: -20px; z-index: 4; }


#blog-news{  background: url(../images/index/fftt-back.jpg) no-repeat center top; width: 100%; margin: 0 auto; padding: 0px; }
.btm-ttl{ text-align: center; }

.ssn-list{ width: 1110px; margin: 0 auto 40px auto; }
.ssn-list li{ float: left; margin-right: 20px; }
.ssn-list li:nth-child(4n){ margin-right: 0px; }
#seo-text{ width: 1110px; margin: 0 auto 70px auto; color: #898989;line-height: 24px; font-size: 13px; }

#blog-news .info-inner-Box{ width: 1200px; margin: 0 auto 50px auto; background: #fff; padding: 70px 80px;  }

/* blog -------------------------------------*/
#blog{ width: 500px; float: left; margin-right: 40px; position: relative; }
#blog h2{ position: absolute; left: 0px; }
#blog .btn{ text-align: center; }
#blog .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 10px 50px; font-size: 1em; text-align: center; display: inline-block; background: #000; }
#blog .btn a:hover{ background: #333; text-decoration: none; }
#blog .inner-Box{ }
#blog .system-list{ width: 430px; margin-left: 70px; overflow-y:scroll; height: 290px; }
#blog .system-list li{ width: 100%; overflow: hidden; background: #fff; border-bottom: 1px dotted #ccc; margin-bottom: 20px; padding-bottom: 20px; }
#blog .system-list li a:hover{ text-decoration: none; }
#blog .system-pic{ width: 18%; margin-right: 2%; height: auto; overflow: hidden; text-align: center; float: left;}
#blog .system-pic img{ max-width: 100%; height: auto; }
#blog .system-txt { width: 80%; float: left;}
#blog .system-date{ font-size: 0.75em; margin-bottom: 10px;color: #b8a469; }
#blog .system-date::before{ content: "■"; }
#blog .system-ttl{ width: 80%; font-size: 1em; line-height: 1.4; }
#blog .system-category{ font-size: 0.625em; color: #fff; text-align: center; padding: 3px; background-color: #111; width: 30%; margin-bottom: 10px;}
#blog .blog-icon01{ background: #111; }
#blog .blog-icon02{ background: #222; }
#blog .blog-icon03{ background: #333; }
#blog .blog-icon04{ background: #444; }
#blog .blog-icon05{ background: #555; }
#blog .blog-icon06{ background: #666; }
#blog .system-icon02{ padding: 5px 10px; background: #ccc; position: absolute; top: 35px; left: 0; }

/* topics -------------------------------------*/
#topics{ width: 500px; float: left; position: relative}
#topics h2{ position: absolute; left: 0px; }
#topics .btn{ text-align: center; }
#topics .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 10px 50px; font-size: 1em; text-align: center; display: inline-block; background: #000; }
#topics .btn a:hover{ background: #333; text-decoration: none; }
#topics .inner-Box{ }
#topics .system-list{ width: 430px; margin-left: 70px; overflow-y:scroll; height: 290px;}
#topics .system-list li{ width: 100%; overflow: hidden; background: #fff; position: relative; border-bottom: 1px dotted #ccc; margin-bottom: 20px; padding-bottom: 20px; }
#topics .system-list li a:hover{ text-decoration: none; }
#topics .system-date{ font-size: 0.75em; margin-bottom: 10px;color: #b8a469; }
#topics .system-date::before{ content: "■"; }
#topics .system-ttl{ width: 80%; font-size: 1em; line-height: 1.4; }
#topics .system-category{ font-size: 0.625em; color: #fff; text-align: center; padding: 3px; background-color: #111; width: 30%; margin-bottom: 10px;}
#topics .icon01{ background: #111; }
#topics .icon02{ background: #222; }
#topics .icon03{ background: #333; }
#topics .icon04{ background: #444; }
#topics .icon05{ background: #555; }
#topics .icon06{ background: #666; }
#topics .system-icon02{ padding: 5px 10px; background: #ccc; position: absolute; top: 35px; left: 0; }


}

@media screen and (max-width: 767px) {

#bx-sra {}

/* concept -------------------------------------*/
#concept{ color: #fff; width: 100%; margin: 0 auto 100px auto; padding: 30% 0 70% 0; background: url(../images/index/sp-concept-back.jpg) no-repeat center top; background-size: 100% auto; }
#concept h2{ text-align: center; font-size: 18px; font-weight: normal; margin-bottom: 20px; letter-spacing: 16.8px;}
#concept h2 span{ display: block; margin-bottom: 40px;}
#concept p{ font-size: 13px; margin-bottom: 30px; letter-spacing: 6px; line-height: 160%; }
#concept .btn{ text-align: center; }
#concept .inner-Box{ width: 100%; margin: 0 auto; text-align: center }

/* kodawari -------------------------------------*/
#kodawari{  }
#kodawari h2{ font-size: 22px; text-align: center; margin-bottom: 30px; letter-spacing: 4.4px; }
#kodawari h2 span{ display: block; margin-bottom: 10px;}
#kodawari ul{ margin-bottom: 60px; background: #000;}
#kodawari ul li{  }


/* svc -------------------------------------*/
#svc{ color: #fff; width: 100%; margin: 0 auto 0px auto; background: #161519; }
h2.svc-ttl{ font-size: 22px; text-align: center; margin-bottom: 30px; letter-spacing: 4.4px; }
h2.svc-ttl span{ display: block; margin-bottom: 10px;}
#svc p{ font-size: 14px; margin-bottom: 33px; letter-spacing: 6px; }
#svc .btn{ text-align: center; }
#svc .inner-Box{  }
#svc .inner-contents01{  position: relative; margin: 0 auto; }
#svc .inner-contents01 h3{ margin-bottom: 0px; }
#svc .inner-contents01 .text-bb{ width: 96%; margin: 0 auto; line-height: 180%; }
#svc .inner-contents01 figure{ position: absolute; left: 450px; bottom: -70px; }
#svc .svc-list{ position: relative; z-index: 5; width: 100%; top: -80px; margin: 0 auto 0px auto; }
#svc .svc-list li{ width: 44%; float: left; margin-left: 4%; margin-bottom: 20px; }
#svc .svc-list li img{ width: 100%;}
#svc .svc-list li:nth-child(4n){ margin-right: 0;}
#svc .svc-list2{ margin: 0 auto; }
#svc .svc-list2 li{ color: #fff; padding-left: 45%; padding-top: 40px; position: relative; background: url(../images/index/svc-mini.png)no-repeat right top; background-size: 100% auto; min-height: 160px; }
#svc .svc-list li:nth-child(2n){ margin-right: 0;}
#svc .svc-list2 li img{ position: absolute; top: -10px; left: 3%; width: 35%; }
#svc .svc-list2 li h3{ font-size: 18px; color: #c3ac1e; letter-spacing: 4.8px; margin-bottom: 10px; }
#svc .svc-list2 li p{ line-height: 15px; }
#svc .svc-list2 li a p{ color: #fff; font-size: 12px; }

/* case -------------------------------------*/
#case{ width: 100%; margin: 0 auto 0px auto; padding: 0px 0 80px 0; background: #161519; position: relative;}
#case h2{letter-spacing: 6.4px; color: #fff; text-align: center; font-size: 18px; font-weight: 400; margin-bottom: 10px; }
#case h2 img{ margin-bottom: 10px; }
#case .sub-tit{ font-size: 14px; color: #fff; text-align: center; margin-bottom: 25px;letter-spacing: 6.4px;}

#case .btn{ text-align: right; position: relative; top: -40px; margin: 0 auto; margin-bottom: -0px;  }
#case .inner-Box{ width: 100%; margin: 0 auto; }
#case .system-list{ margin-bottom: 20px; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#case .system-list li{ width: 50%; background: #161519; position: relative; color: #fff;}
#case .system-list li a{ color: #fff;}
#case .system-list li .icon{ position: absolute; bottom: 20px; right: 20px; }
#case .system-list li:nth-child(2n){ background: #23262a;}
#case .system-list li a:hover{ text-decoration: none; }
#case .system-pic{ width: 100%; height: 230px; overflow: hidden; text-align: center; position: relative}
#case .system-pic img{ width: 100%; height: 230px; }
#case .system-date{ position: absolute; bottom: 20px; left: 20px; font-size: 20px;}
#case .system-ttl-01{ padding: 20px 20px 40px 20px; font-size: 14px; margin-bottom: 20px; line-height: 1.4; }
#case .system-category-set { margin-bottom: 15px;}
#case .system-category{ left: 0px; bottom: 0px; font-size: 16px; color: #fff; text-align: center; padding: 12px 33px; display: inline-block; position: absolute}
#case .icon01{ background: #db3716; }
#case .icon02{ background: #cd9f56; }
#case .icon03{ background: #2b6590; }
#case .icon04{ background: #366733; }
#case .icon05{ background: #444; }
#case .icon06{ background: #555; }
#case .system-icon02{ padding: 5px 10px; background: #ccc; position: absolute; top: 35px; left: 0; }


/* voice -------------------------------------*/
#voice{ width: 100%; margin: 0 auto; padding: 15% 0; background: #fff;}
#voice h2{ text-align: center; font-size: 1.4rem; font-weight: bold; margin-bottom: 10%;}
#voice .btn{ text-align: center; }
#voice .inner-Box{ width: 100%; margin: 0 auto; }
#voice .system-list{ background: url(../images/index/voice-back.jpg) no-repeat center top 20px; }
#voice .system-list li{ width: 90%; margin: 0 5%; background: #fff; position: relative; margin-bottom: 4%; line-height: 1.4; padding: 1%; }
#voice .system-list li:nth-child(2n){ margin-right: 0;}
#voice .system-list li:nth-child(n+3){ display: none;}
#voice .system-list li a:hover{ text-decoration: none; }
#voice .system-pic{ width: 100%; height: 120px; margin-bottom: 5%; overflow: hidden; text-align: center; }
#voice .system-pic img{ width: 100%; height: 120px; }
#voice .system-customer{ font-size: 0.8rem; margin-bottom: 5%; }
#voice .system-ttl-01{ font-size: 0.9rem; margin-bottom: 5%; }
#voice .system-category{ }

#blog-news{ width: 100%; margin: 0 auto; background: #e8eae8; }
#blog-news .info-inner-Box{ width: 96%; padding: 1% 3%; background: #fff; margin: 0 auto; }

/* blog -------------------------------------*/
#blog{ width: 100%; margin: 0 auto; padding: 4% 3%;}
#blog h2{ text-align: center; font-size: 1.4rem; font-weight: bold; margin-bottom: 10%; }
#blog .btn{ text-align: center; }
#blog .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 3%; text-align: center; display: block; background: #000; }
#blog .btn a:hover{ background: #333; text-decoration: none; }
#blog .inner-Box{ width: 100%; margin: 0 auto; }
#blog .system-list{ margin-bottom: 10%; overflow-y:scroll; height: 200px; }
#blog .system-list li{ width: 100%; background: #fff; overflow: hidden; position: relative; border-bottom: 1px dotted #ccc; margin-bottom: 5%; padding-bottom: 5%; }
#blog .system-list li a:hover{ text-decoration: none; }
#blog .system-pic{ width: 28%; margin-right: 2%; height: auto !important; overflow: hidden; text-align: center; float: left;}
#blog .system-pic img{ max-width: 100%; height: auto !important; }
#blog .system-txt { width: 70%; float: right; }
#blog .system-date{ font-size: 0.8rem; margin-bottom: 3%;color: #b8a469; }
#blog .system-date::before{ content: "■"; }
#blog .system-ttl{ width: 100%; font-size: 0.9rem; margin-bottom: 5%; }
#blog .system-category{ width: 28%; font-size: 0.7rem; color: #fff; text-align: center; padding: 3px; background-color: #111; width: 50%; margin-bottom: 3%;}


/* topics -------------------------------------*/
#topics{ width: 100%; padding: 15% 3%;}
#topics h2{ text-align: center; font-size: 1.4rem; font-weight: bold; margin-bottom: 10%; }
#topics .btn{ text-align: center; }
#topics .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 3%; text-align: center; display: block; background: #000; }
#topics .btn a:hover{ background: #333; text-decoration: none; }
#topics .inner-Box{ width: 100%; margin: 0 auto; }
#topics .system-list{ margin-bottom: 10%; overflow-y:scroll; height: 200px; }
#topics .system-list li{ width: 100%; background: #fff; overflow: hidden; position: relative; border-bottom: 1px dotted #ccc; margin-bottom: 5%; padding-bottom: 5%; }
#topics .system-list li a:hover{ text-decoration: none; }
#topics .system-date{ font-size: 0.8rem; margin-bottom: 3%;color: #b8a469; }
#topics .system-date::before{ content: "■"; }
#topics .system-ttl{ width: 100%; font-size: 0.9rem; margin-bottom: 5%; }

.ssn-list{  }
.ssn-list{ width: 96%; margin: 0 auto 10px auto; padding: 3%; }
.ssn-list li{ margin-bottom: 10px; }
.ssn-list li:nth-child(3){ width: 49%; float: left; margin-right: 2%; }
.ssn-list li:nth-child(4){ width: 49%; float: left; margin-right: 0px; }
#seo-text{ width: 94%; margin: 0 auto 20px auto; color: #898989;line-height: 24px; font-size: 13px; }


}
@media screen and (max-width: 380px) {
  #case .system-list .system-pic { height: 120px; }
  #case .system-list .system-pic img { height: 120px; }
  #casetax-catego .system-list .system-pic { height: 120px; }
  #casetax-catego .system-list .system-pic img { height: 120px; }
  #casetax-reform .system-list .system-pic { height: 120px; }
  #casetax-reform .system-list .system-pic img { height: 120px; }
  #voice .system-list .system-pic { height: 120px; }
  #voice .system-list .system-pic img { height: 120px; }
}
@media screen and (max-width: 321px) {
  #case .system-list .system-pic { height: 100px; }
  #case .system-list .system-pic img { height: 100px; }
  #casetax-catego .system-list .system-pic { height: 100px; }
  #casetax-catego .system-list .system-pic img { height: 100px; }
  #casetax-reform .system-list .system-pic { height: 100px; }
  #casetax-reform .system-list .system-pic img { height: 100px; }
  #voice .system-list .system-pic { height: 100px; }
  #voice .system-list .system-pic img { height: 100px; }
}