@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=M+PLUS+1p:300,400,500,700,800,900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Montserrat:200,300,400&display=swap');
@import url('https://fonts.googleapis.com/css?family=Montserrat+Alternates:600,700,800&display=swap');
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap");

/* DECO____________________________*/
/*.img_deco{
  position: absolute;
  top: 50%;
  left: -100px;
  transform: rotate(-20deg);
}*/


/* topMainVisual____________________________*/
#kv {
  position: relative;
}

#kv .arr {
  position: absolute;
  left: calc(50% - 30px);
  bottom: 15vh;
  width: 60px;
  height: 60px;
  cursor: pointer;
}

#kv .arr a {
  position: relative;
  display: block;
  margin: auto;
  width: 60px;
  height: 60px;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 100%;
  transition: 0.8s;
}

#kv .arr a:hover {
  text-decoration: none;
  background: rgba(255, 255, 255, 0.6);
}

#kv .arr a::before {
  content: '';
  display: block;
  z-index: 3;
  width: 10px;
  height: 10px;
  border-width: 2px 2px 0 0;
  border-style: solid;
  -webkit-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  transform: rotate(135deg);
  position: absolute;
  top: calc(50% - 5px);
  left: calc(50% - 5px);
  border-color: #FFF;
}

#kv .arr a:hover::before {
  border-color: #AAA;
}

.topMainVisual .slick-slide {
  height: 100vh;
}

.topMainVisual .slick-slide img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform-origin: center center;
  transform: translate(-50%, -50%) scale(1);
  transition: 5s ease-out;
  max-width: none;
  max-height: 100vh;
  width: auto;
  height: 100vh;
}

/* .topMainVisual .slick-slide.slick-active img {
  transform: translate(-50%, -50%) scale(1.05);
} */
.topMainVisual {
  /*margin-top: 70px;*/
  position: relative;
}

.topMainVisual .titl {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  z-index: 1;
  text-align: center;
  color: #FFF;
  font-size: 60px;
  line-height: 1.2;
}

.topMainVisual .sp_on {
  display: none;
}
.mainTextArea{
  max-width: 1200px;
  width: 100%;
  margin: auto;
  position: relative;
  height: 100%;
}

@media all and (max-width: 979px) {

  /*.topMainVisual .slick-slide{height: 50vh; }*/
  .topMainVisual .titl {
    font-size: 40px;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    width: 100%;
  }
  
}

@media all and (max-width: 690px) {
  .topMainVisual .slick-slide img {
    width: auto;
    height: 100%;
  }

  .topMainVisual .slick-slide.slick-active img {
    transform: translate(-50%, -50%) scale(1);
  }

  .topMainVisual .pc_on {
    display: none;
  }

  .topMainVisual .sp_on {
    display: block;
  }
}

/*見出し 共通 ____________________________*/

.topTitl {
  font-size: 35px;
  line-height: 1.2;
  text-align: center;
  font-weight: 300;
  font-family: 'Montserrat', '游ゴシック', 'YuGothic', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  margin-bottom: 40px;
  color: #444;
}

.titleLeadtxt {
  color: #666;
  font-size: 28px;
  line-height: 1.4;
  text-align: center;
  margin-bottom: 20px;
}

@media only screen and (max-width: 979px) {
  .topTitl {
    font-size: 2em;
    margin-bottom: 20px;
  }

  .titleLeadtxt {
    font-size: 20px;
  }
}

@media only screen and (max-width: 690px) {
  .titleLeadtxt {
    text-align: left;
    font-size: 18px;
  }

  .titleLeadtxt br {
    display: none;
  }
}


/*VISION
_________________________________________*/
#vision {
  padding-top: 180px;
  margin-top: -180px;
}

.vision_blocks {
  position: relative;
  max-width: 1200px;
  margin: auto;
}

.vision_blocks .inner {
  position: relative;
  padding-top: 20px;
  top: -120px;
  background-color: #FFF;
}

.vision_blocks .inner::before {
  content: "";
  border-style: solid;
  border-width: 100px 35px 0 0;
  border-color: transparent #ffffff transparent transparent;
  position: absolute;
  left: -35px;
  top: 0px;
}

.vision_blocks .inner::after {
  content: "";
  border-style: solid;
  border-width: 100px 0px 0 35px;
  border-color: transparent transparent transparent #ffffff;
  position: absolute;
  right: -35px;
  top: 0px;
}

@media only screen and (max-width: 690px) {
  .vision_blocks {
    margin-bottom: 40px;
  }

  .vision_blocks .inner {
    top: auto;
    margin-top: -100px;
  }
}

/*TOPICS
_________________________________________*/
.topics_blocks {
  margin-bottom: 80px;
}

.topicslider .inn__ {
  padding: 0 10px;
  -webkit-transition: all .5s cubic-bezier(.04, .435, .315, .9);
  transition: all .5s cubic-bezier(.04, .435, .315, .9);
  border-bottom: 6px solid transparent;
}

.topicslider .foto {
  position: relative;
  height: 180px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  margin-bottom: 15px;
}

.topicslider .cate {
  position: absolute;
  bottom: 0;
  right: 0;
  display: inline-block;
  padding: 3px 1em;
  text-align: center;
  color: #333;
  background-color: rgba(255, 255, 255, 0.6);
}

/*.topicslider .cate.release{background-color: #3EA15D; }
.topicslider .cate.case{background-color: #D63474; }
.topicslider .cate.knowhow{background-color: #5B9FDE; }
.topicslider .cate.news{background-color: #FF6600; }*/
.topicslider time {
  font-size: 14px;
  line-height: 1.2;
  color: #666;
  margin-bottom: 10px;
}

.topicslider .titl {
  font-size: 18px;
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-bottom: 10px;
}

/*DOTS*/
.topicslider.slick-dotted.slick-slider {
  margin-bottom: 70px;
}

.topicslider .slick-dots {
  bottom: -30px;
}

.topicslider .slick-dots li {
  height: 4px;
  width: 30px;
  margin: 0 4px;
}

.topicslider .slick-dots li button {
  height: 100%;
  width: 100%;
  padding: 0;
  background-color: #DDD;
}

.topicslider .slick-dots li.slick-active button {
  background-color: #ababab;
}

/*ARROWS*/
.topicslider .slick-prev {
  left: -40px;
}

.topicslider .slick-next {
  right: -20px;
}

.topicslider .slick-next,
.topicslider .slick-prev {
  width: auto;
  height: auto;
}

.topicslider .slick-next:before,
.topicslider .slick-prev:before {
  opacity: 1;
  content: "";
  width: 25px;
  height: 25px;
  border: solid #CCC;
  border-width: 1px 1px 0 0;
  -webkit-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
}

.topicslider .slick-prev:before {
  -webkit-transform: rotate(225deg);
  -o-transform: rotate(225deg);
  -moz-transform: rotate(225deg);
  transform: rotate(225deg);
}

/*hover*/
.topicslider .inn__:hover {
  text-decoration: none;
  /*border-bottom: 6px solid #FF6600;*/
}

.topicslider .inn__:hover img {
  opacity: 1;
}

@media only screen and (max-width: 690px) {
  .topics_blocks {
    margin-bottom: 60px;
  }

  .topicslider.slick-dotted.slick-slider {
    margin-bottom: 50px;
  }

  .topicslider .slick-dots {
    bottom: -25px;
  }
}

/*SERVICE
_________________________________________*/
.srv__blocks {
  margin-bottom: 80px;
}

.srv__blocks .col {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
  font-size: 16px;
  line-height: 1.6;
  width: 32.4%;
  height: 380px;
}

.srv__blocks .col+.col {
  margin-left: 1.4%;
}

.srv__blocks .inn__.cl01 {
  background: url(../image/top_srv_01.jpg)no-repeat center top /cover;
}

.srv__blocks .inn__.cl02 {
  background: url(../image/top_srv_02.jpg)no-repeat center top /cover;
}

.srv__blocks .inn__.cl03 {
  background: url(../image/top_srv_03.jpg)no-repeat center top /cover;
}

.srv__blocks .inn__ {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  padding: 2em;
  -webkit-transition: 1.6s;
  transition: 1.6s;
  overflow: hidden;
}

.srv__blocks .inn__::after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 70%;
  height: 70%;
  transform: translate(-50%, -50%);
  -webkit-transition: 0.8s;
  transition: 0.8s;
  z-index: 0;
}

.srv__blocks .inn__.cl01::after {
  background-color: rgba(224, 82, 41, 0.7);
}

.srv__blocks .inn__.cl02::after {
  background-color: rgba(91, 159, 222, 0.7);
}

.srv__blocks .inn__.cl03::after {
  background-color: rgba(62, 161, 93, 0.7);
}

.srv__blocks .inn__>div {
  position: relative;
  text-align: center;
  flex: 1;
  line-height: 1.2;
  z-index: 1;
}

.srv__blocks .titl {
  font-size: 28px;
  font-weight: 600;
  color: #FFF;
}

.srv__blocks .titl .sub {
  font-size: 15px;
  font-weight: normal;
  display: block;
  margin-bottom: 20px;
}

.srv__blocks .titl::after {
  content: "";
  display: block;
  width: 30px;
  height: 1px;
  margin: 20px auto;
  background-color: #FFF;
}

.srv__blocks .txt {
  text-align: left;
  margin-bottom: 15px;
}

.srv__blocks .txt,
.srv__blocks .btn_detail {
  display: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-100%);
  -webkit-transition: 0.8s;
  transition: 0.8s;
}

.btn_detail {
  text-align: center;
}

.btn_detail a {
  position: relative;
  display: inline-block;
  border-radius: 50px;
  text-align: center;
  padding: 13px 2em;
  background-color: #FFF;
  border: 1px solid #FFF;
}

.btn_detail a::after {
  content: '';
  width: 5px;
  height: 5px;
  border: 0px;
  border-width: 1px 1px 0 0;
  border-style: solid;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -2.5px;
}

.btn_detail a:hover {
  text-decoration: none;
}

.cl01 .btn_detail a {
  color: #E05229;
}

.cl02 .btn_detail a {
  color: #5B9FDE;
}

.cl03 .btn_detail a {
  color: #3EA15D;
}

/*BL-HOVER*/
.srv__blocks .bl-hover .inn__ {
  width: 100%;
  height: 100%;
}

.srv__blocks .bl-hover .inn__::after {
  width: 100%;
  height: 100%;
}

.srv__blocks .bl-hover .txt,
.srv__blocks .bl-hover .btn_detail {
  display: inherit;
  opacity: 1;
  visibility: visible;
  transform: translateY(0%);
}

@media only screen and (max-width: 979px) {
  .srv__blocks .col {
    width: 100%;
    height: 300px;
  }

  .srv__blocks .col+.col {
    margin-left: 0;
  }
}

@media only screen and (max-width: 690px) {
  .srv__blocks {
    margin-bottom: 60px;
  }

  .srv__blocks .col {
    height: auto;
  }

  .srv__blocks .txt,
  .srv__blocks .btn_detail {
    display: inherit;
    opacity: 1;
    visibility: visible;
    transform: translateY(0%);
  }

  .srv__blocks .inn__::after {
    width: 100%;
    height: 100%;
  }
}

/* BIZ BLOCKS
______________________________________________*/
.bizblocks .col {
  position: relative;
}

.bizblocks .fl figure.foto {
  max-width: 500px;
  flex: 1;
}

.bizblocks .btn {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.bizblocks .btn a {
  min-width: 300px;
}
@media only screen and (max-width: 980px) {
  .bizblocks .btn {
    position: static;
    transform: translateX(0%);
    margin-top: 20px;
  }

  .bizblocks .btn a {
    min-width: auto;
  }
}
@media only screen and (max-width: 690px) {
  .bizblocks .fl figure.foto {
    width: 100%;
    max-width: none;
    margin-bottom: 20px;
  }

  .bizblocks .txt {
    margin-bottom: 20px;
  }

 
}




/* GLOVAL PROFILE
______________________________________________*/
.gloprof .fl figure.foto {
  max-width: 150px;
  margin-left: auto;
  margin-right: auto;
}

.gloprof .position {
  margin-bottom: 15px;
}


/* INTRO BLOCKS
______________________________________________*/
.IntroBlocks {}

.IntroBlocks .fl {
  display: flex;
  flex-wrap: wrap;
  counter-reset: number;
  border-radius: 5px;
  border: 1px solid;
  padding: 3em 3em 0;
  margin-bottom: 100px;
}

.IntroBlocks .inn_ {
  position: relative;
  flex: inherit;
  width: calc(33.33% - 2em);
  margin-right: 3em;
  margin-bottom: 3em;
}

.IntroBlocks .inn_:nth-child(3n) {
  margin-right: 0;
}

.IntroBlocks .num {
  position: relative;
  border-bottom: 1px solid #DDD;
  padding-bottom: 12px;
  font-size: 22px;
  font-weight: normal;
  padding-left: 1.3em;
}

.IntroBlocks .num::before {
  content: counter(number);
  counter-increment: number 1;
  position: absolute;
  top: 1px;
  left: 0;
  line-height: 1;
  font-weight: bold;
  font-size: 23px;
}

.IntroBlocks .icon {
  display: block;
  margin-bottom: 10px;
}

.IntroBlocks .icon img[src$="svg"] {
  width: 100px;
  height: auto;
}

@media only screen and (max-width: 790px) {
  .IntroBlocks .fl {
    padding: 2em 2em 0;
    margin-bottom: 60px;
  }

  .IntroBlocks .inn_ {
    width: calc(100% / 2 - 2em);
    margin-right: 3em;

  }

  .IntroBlocks .inn_:nth-child(3n) {
    margin-right: 3em;
  }

  .IntroBlocks .inn_:nth-child(even) {
    margin-right: 0;
  }
}

@media only screen and (max-width: 540px) {
  .IntroBlocks .inn_ {
    width: 100%;
    margin-right: 0;
  }

  .IntroBlocks .inn_:nth-child(3n) {
    margin-right: 0;
  }
}


/* FLOW BLOCKS
______________________________________________*/
.flowblocks {
  counter-reset: number;
  position: relative;
  /* padding-left: 40px; */
  /*    background-color: #dedede;
    padding: 3em;*/
}

.flowblocks .col+.col {
  position: relative;
}

.flowblocks .col+.col::after {
  content: "";
  position: absolute;
  top: calc(50% - 5px);
  left: calc(-1.5em - 10px);
  display: block;
  width: 10px;
  height: 10px;
  border-style: solid;
  border-width: 4px 4px 0 0;
  border-color: #4c4c4c;
  transform: rotate(45deg);
}

.flowblocks .col {
  position: relative;
}

.flowblocks .col .num {
  font-size: 10px;
  font-weight: bold;
  text-transform: uppercase;
  padding-bottom: 1em;
  line-height: 1.2;
  display: inline-block;
  text-align: left;
  border-bottom: 1px solid;
  margin-bottom: 20px;
}

.flowblocks .col .num::after {
  content: counter(number);
  counter-increment: number 1;
  font-size: 12px;
  display: inline-block;
  line-height: 1;
}

.flowblocks .col .txtarea {
  padding: 1em 1em;
  text-align: center;
  border-radius: 5px;
  height: 100%;
  background-color: #fff;
  border: 6px solid #f7f7f7;
  box-sizing: border-box;
}

@media only screen and (max-width:690px) {
  .flowblocks .col .txtarea {
    padding: 1em;
  }

  .flowblocks .fl.m3em .col+.col {
    margin-top: 40px;
  }

  .flowblocks .col+.col::after {
    top: calc(-1.5em - 10px);
    left: 50%;
    transform: rotate(135deg);
  }

  .flowblocks .col .foto {
    margin-bottom: 0;
  }
}

.flow_line {
  display: flex;
  border-radius: 5px;
  overflow: hidden;
}

.flow_line li {
  list-style-type: none;
  padding: 1em 2em;
  background-color: #4c4c4c;
  width: 39.5%;
  color: #DDD;
}

.flow_line li:last-child {
  position: relative;
  padding-left: 40px;
  background-color: #6d6d6d;
  color: #DDD;
  width: 60%;
}

.flow_line li:last-child::before {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 26px 0 26px 20px;
  border-color: transparent transparent transparent #4c4c4c;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

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

  .flow_line li,
  .flow_line li:last-child {
    width: 50%;
  }
}

/*COMPANY
_________________________________________*/
.company__blocks {
  display: flex;
  background: url(../image/top_company_bg.jpg)no-repeat right top /cover;
  height: 400px;
}

.company__blocks .inn__ {
  display: flex;
  justify-content: flex-end;
  text-align: right;
}

.company__blocks .topTitl {
  text-align: right;
  margin-bottom: 20px;
}

.company__blocks .leadtxt {
  margin-bottom: 25px;
}

.company__blocks .btn {
  text-align: right;
}

@media only screen and (max-width: 981px) {
  .company__blocks .inn__ {
    max-width: none;
    padding: 2.5em;
  }
}

@media only screen and (max-width: 690px) {
  .company__blocks {
    height: auto;
    margin-bottom: 60px;
  }

  .company__blocks .inn__ {
    text-align: left
  }

  .company__blocks .topTitl,
  .company__blocks .btn {
    text-align: center;
  }
}

/*下層ページ ////////////////////////////////////*/

/*onlinebiz.html_______________________________*/
.onlinebiz_01 .subleadtitl {
  top: -70px;
  margin: 0;
}

.onlinebiz_01 .inner {
  padding: 80px 0
}

.onlinebiz_01 .col {
  position: relative;
  color: #333;
  background-color: #FFF;
}

.onlinebiz_01 .col::after {
  position: absolute;
  left: 0;
  bottom: 0;
  content: "";
  display: block;
  height: 3px;
  width: 0%;
  background-color: #FF6600;
  -webkit-transition: all .3s ease 0s;
  -o-transition: all .3s ease 0s;
  transition: all .3s ease 0s;
}

.onlinebiz_01 .col:hover::after {
  width: 100%;
}

.onlinebiz_01 .col.bl-hover {
  box-shadow: none;
}

.onlinebiz_01 .inn {
  padding: 20px;
}

.onlinebiz_01 .tit {
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 15px;
}

@media only screen and (max-width: 690px) {}

.onlinebiz_02 .col.bl {
  margin-bottom: 40px;
}

.onlinebiz_02 .txtarea {
  /*padding: 20px;*/
}

.onlinebiz_02 .txtarea .tit {
  position: relative;
  padding-left: 20px;
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 10px;
}

.onlinebiz_02 .txtarea .tit::before {
  content: "";
  display: block;
  position: absolute;
  top: 7px;
  left: 0;
  border-width: 5px;
  border-color: #333;
  border-style: solid;
  -webkit-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
  border-radius: 2px;
}

.onlinebiz_02 .bl .txtarea .tit a:hover {
  text-decoration: none;
}

@media only screen and (max-width: 979px) {
  .onlinebiz_02 .col .col {
    width: 100%;
    flex: initial;
    margin-right: 0;
  }

  .onlinebiz_02 .foto {
    height: 150px;
  }
}

@media only screen and (max-width: 690px) {
  .onlinebiz_02 .col {
    width: 100%;
    margin-left: 0;
  }

  .onlinebiz_02 figure {
    height: 150px;
  }
}

.MatchingFig {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

.MatchingFig .deco {
  position: absolute;
  top: 0;
  left: 20px;
}

.MatchingFig .col {
  position: relative;
  border-top: 3px solid;
  color: #083958;
  background-color: #FFF;
  border-bottom: 3px solid;
  padding: 30px 4em 30px 2em;
  flex: 1;
}

.MatchingFig .col.btm {
  padding: 30px 2em 30px 4em;
}

.MatchingFig .col::before,
.MatchingFig .col::after {
  content: "";
  width: 50px;
  height: 0;
  border: solid currentColor;
  border-width: 1px 0 0 0;
  position: absolute;
  right: 0;
}

.MatchingFig .col::before {
  -webkit-transform: rotate(60deg);
  -o-transform: rotate(60deg);
  -moz-transform: rotate(60deg);
  transform: rotate(60deg);
  top: calc(50% - 38px);
}

.MatchingFig .col::after {
  -webkit-transform: rotate(120deg);
  -o-transform: rotate(120deg);
  -moz-transform: rotate(120deg);
  transform: rotate(120deg);
  top: calc(50% + 5px);
}

.MatchingFig .col.btm::before {
  right: auto;
  left: 0;
  transform: rotate(-60deg);
}

.MatchingFig .col.btm::after {
  right: auto;
  left: 0;
  transform: rotate(-120deg);
}

.MatchingFig .col .titl {
  position: relative;
  color: #333;
  margin-bottom: 20px;
}

.MatchingFig .col .titl::before {
  content: "";
  display: inline-block;
  margin-right: 15px;
  vertical-align: middle;
}

.MatchingFig .col.uppr .titl::before {
  width: 40px;
  height: 35px;
  background: url(../image/icon_man.svg)no-repeat center center /contain;
}

.MatchingFig .col.btm .titl::before {
  width: 40px;
  height: 35px;
  background: url(../image/icon_book.svg)no-repeat center center /contain;
}

.MatchingFig .midcol {
  position: relative;
  text-align: center;
  margin: 0 20px;
}

.MatchingFig .midcol .titl {
  font-size: 30px;
  margin-bottom: 30px;
}

.MatchingFig .midcol .logo {
  margin-bottom: 30px;
}

@media only screen and (max-width: 1100px) {
  .MatchingFig {
    display: block;
  }

  .MatchingFig .midcol {
    margin: 30px auto;
  }

  .MatchingFig .midcol .titl {
    font-size: 24px;
    margin-bottom: 20px;
  }

  .MatchingFig .col {
    max-width: 500px;
    width: 100%;
    position: relative;
    padding: 30px;
    left: auto;
    right: auto;
    margin: auto;
  }

  .MatchingFig .col .titl {
    text-align: center;
  }

  .MatchingFig .col.uppr {
    border-bottom: none;
  }

  .MatchingFig .col.btm {
    border-top: none;
    padding: 30px 2em;
  }

  .MatchingFig .midcol .logo img {
    max-width: 300px;
  }

  .MatchingFig .col::before,
  .MatchingFig .col::after {
    right: calc(50% - 10px);
    bottom: 0;
  }

  .MatchingFig .col::before {
    -webkit-transform: rotate(60deg);
    -o-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
    transform: rotate(30deg);
    top: auto;
  }

  .MatchingFig .col::after {
    -webkit-transform: rotate(120deg);
    -o-transform: rotate(120deg);
    -moz-transform: rotate(120deg);
    transform: rotate(150deg);
    top: auto;
    right: calc(50% - 53px);
  }

  .MatchingFig .col.btm::before {
    top: 0;
    right: auto;
    left: calc(50% - 38px);
    transform: rotate(-30deg);
  }

  .MatchingFig .col.btm::after {
    top: 0;
    right: auto;
    left: calc(50% + 5px);
    transform: rotate(30deg);
  }
}

/*GO GETTERS*/
.gogetter-blocks .inner {
  padding: 60px 0 20px;
}

.gogetter-blocks .fl figure.foto {
  max-width: none;
  border-radius: 40px;
  overflow: hidden;
  margin-bottom: 20px;
}

.gogetter-blocks .tit {
  position: relative;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  /*color: #FFF;*/
  margin-bottom: 20px;
}

/*.gogetter-blocks .tit:hover, .gogetter-blocks .bl-hover .tit{
  color: #FFF;
}*/
.gogetter-blocks .tit::after {
  content: "";
  display: inline-block;
  transform: scaleX(1);
  position: absolute;
  left: 0rem;
  right: 0rem;
  top: auto;
  height: 1px;
  background: currentColor;
  transform-origin: center right;
  transition: .8s ease transform;
  z-index: -1;
  bottom: -10px;
}

/*.gogetter-blocks .tit:hover::after, .gogetter-blocks .bl-hover .tit::after {
    transform: scaleX(1);
    transform-origin: center left;
}*/
/*.gogetter-blocks p{
  font-weight: 300;
}*/
@media all and (max-width: 979px) {
  .gogetter-blocks {
    border-radius: 10px;
    width: 95%;
    margin: 0 auto 60px;
  }

  .gogetter-blocks .inner {
    padding: 0;
  }
}

/*CATEGORY　LIST*/
.categoryList {
  border-radius: 5px;
  border: 1px solid;
  padding: 3vh 1.5vw;
  display: flex;
  flex-wrap: wrap;
}

.categoryList dt {
  width: 100%;
  margin-bottom: 18px;
  font-size: 20px;
  font-weight: 600;
  line-height: 1;
}

.categoryList dd {
  width: calc(100% / 4);
}

@media only screen and (max-width: 690px) {
  .categoryList dd {
    width: calc(100% / 2);
  }
}

@media only screen and (max-width: 480px) {
  .categoryList dd {
    width: 100%;
  }
}

/*CATEGORU ICON*/
.categoryIcon figure {
  width: calc(100%/5);
  text-align: center;
  margin-bottom: 50px;
}

.categoryIcon figure img {
  width: 150px;
  height: 150px;
}

@media only screen and (max-width: 979px) {
  .categoryIcon figure img {
    width: 8em;
    height: auto;
  }
}

@media only screen and (max-width: 690px) {
  .categoryIcon figure {
    width: calc(100%/3);
  }
}

@media only screen and (max-width: 480px) {
  .categoryIcon figure {
    width: calc(100%/2);
  }
}

/*エキスパート募集*/
.raisebox {
  position: relative;
  padding: 3em 3em;
  background: url(../image/img_raisebox_bg.jpg)no-repeat center top /cover;
  z-index: 0;
}

/*.raisebox::after{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.8);
  z-index: -1;
}*/
.raisebox,
.raisebox .titl {
  color: #FFF;
  text-align: center;
}

.raisebox .txtarea {
  display: flex;
  flex-direction: column;
}

.raisebox .txt {
  margin-bottom: 20px;
}

.raisebox .btn-wt a {
  border-color: #ffffff;
}

.raisebox .btn-wt a:hover {
  background-color: #3c3c3c;
  color: #FFF;
  border-color: #3c3c3c;
}

@media only screen and (max-width: 690px) {}


/*エキスパート募集*/
.raisebox_ex {
  position: relative;
  padding: 3em 3em;
  background: url(../image/onlinebiz_footer.jpg)no-repeat center top /cover;
  z-index: 0;
}

/*.raisebox::after{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.8);
  z-index: -1;
}*/
.raisebox_ex,
.raisebox_ex .titl {
  color: #FFF;
  text-align: center;
}

.raisebox_ex .txtarea {
  display: flex;
  flex-direction: column;
}

.raisebox_ex .txt {
  margin-bottom: 20px;
}

.raisebox_ex .btn-wt a {
  border-color: #ffffff;
}

.raisebox_ex .btn-wt a:hover {
  background-color: #3c3c3c;
  color: #FFF;
  border-color: #3c3c3c;
}

@media only screen and (max-width: 690px) {}

/*c2c エキスパート募集*/
.c2c_raisebox_ex {
  position: relative;
  padding: 3em 3em;
  background: url(../image/img_ex_bg.jpg)no-repeat center top /cover;
  z-index: 0;
}

/*.raisebox::after{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.8);
  z-index: -1;
}*/
.c2c_raisebox_ex,
.raisebox_ex .titl {
  color: #FFF;
  text-align: center;
}

.c2c_raisebox_ex .txtarea {
  display: flex;
  flex-direction: column;
}

.c2c_raisebox_ex .txt {
  margin-bottom: 20px;
}

.c2c_raisebox_ex .btn-wt a {
  border-color: #ffffff;
}

.c2c_raisebox_ex .btn-wt a:hover {
  background-color: #3c3c3c;
  color: #FFF;
  border-color: #3c3c3c;
}

@media only screen and (max-width: 690px) {}


/*グローバル　エントリー*/
.raisebox_gl {
  position: relative;
  padding: 3em 3em;
  background: url(../image/img_gl_bg.jpg)no-repeat center top /cover;
  z-index: 0;
}

/*.raisebox::after{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.8);
  z-index: -1;
}*/
.raisebox_gl,
.raisebox_gl .titl {
  color: #FFF;
  text-align: center;
}

.raisebox_gl .txtarea {
  display: flex;
  flex-direction: column;
}

.raisebox_gl .txt {
  margin-bottom: 20px;
}

.raisebox_gl .btn-wt a {
  border-color: #ffffff;
}

.raisebox_gl .btn-wt a:hover {
  background-color: #3c3c3c;
  color: #FFF;
  border-color: #3c3c3c;
}

@media only screen and (max-width: 690px) {}

/*-------------------------------------*/

/*COMPANY*/

/*-------------------------------------*/
.company-pagetop {
  color: #6C6C65;
  line-height: 1.2;
  margin-bottom: 100px;
}

.company-pagetop .logo img {
  width: auto;
  margin: 0 auto 30px;
}

.company-pagetop .fl {
  position: relative;
  justify-content: center;
  border: 1px solid #dcdcdc;
  border-radius: 5px;
  padding: 3em 2em 1em;
}

.company-pagetop .col {
  position: relative;
  background-color: rgba(255, 255, 255, 0.7);
  border-radius: 5px;
  width: calc(50% - 7.5em);
  max-width: 400px;
  flex: inherit;
  text-align: center;
}

.company-pagetop .col+.col {
  margin-left: 13em;
}

.company-pagetop .fl::before,
.company-pagetop .fl::after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 80px;
  height: 11px;
  background-color: #6C6C65;
  transform: translate(-50%, -50%);
}

.company-pagetop .fl::after {
  top: 50%;
  width: 11px;
  height: 80px;
}

.company-pagetop ul li {
  list-style-type: none;
  margin-bottom: 25px;
}

.company-pagetop .tit {
  text-align: left;
  font-size: 48px;
  line-height: 1.2;
  text-align: center;
  font-weight: 100;
  margin-bottom: 30px;
  border-bottom: 11px solid #D5D527;
  padding-bottom: 10px;
}

.company-pagetop .leadtxt {
  text-align: center;
  display: block;
  margin-bottom: 10px;
  font-size: 18px;
}

.relationblocks .fl {
  justify-content: space-between;
}

.relationblocks .foto_02 {
  flex: initial;
  margin-left: 2em;
  width: 35%;
  background: url(../image/img_company_08.jpg)no-repeat center top /cover;
}

.relationblocks .foto_02 img {
  display: none;
}

@media only screen and (max-width: 736px) {
  .company-pagetop {
    margin-bottom: 60px;
  }

  .company-pagetop .logo img {
    margin: auto;
  }

  .company-pagetop .tit {
    font-size: 45px;
  }

  .company-pagetop .leadtxt {
    margin-bottom: 5px;
  }

  .company-pagetop .fl {
    display: block;
  }

  .company-pagetop .col {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
  }

  .company-pagetop .col+.col {
    margin-top: 100px;
    margin-left: auto;
  }

  .company-pagetop .fl::before {
    top: 50%;
    width: 60px;
    transform: translate(-50%, -50%);
  }

  .company-pagetop .fl::after {
    top: 50%;
    transform: translate(-50%, -50%);
    height: 60px;
  }
}

@media only screen and (max-width: 690px) {
  .relationblocks .foto_02 {
    width: 100%;
    background: none;
    margin-top: 20px;
    margin-left: 0;
  }

  .relationblocks .foto_02 img {
    display: block;
  }
}

/*-------------------------------------*/

/*VISION*/

/*-------------------------------------*/
.vision-blocks {
  position: relative;
  background: url(../image/img_vision_bg.jpg)no-repeat center center /cover;
  background-attachment: fixed;
  z-index: 1;
  margin-bottom: 120px;
}

.vision-blocks::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.6);
  z-index: -1;
}

.vision-blocks .inner {
  padding: 130px 0 70px;
  line-height: 2.5;
}

@media only screen and (max-width: 690px) {
  .vision-blocks {
    background-attachment: initial;
    margin-bottom: 80px;
  }

  .vision-blocks .inner {
    padding: 50px 0;
    line-height: inherit;
  }
}

/*-------------------------------------*/

/*FUTURE*/

/*-------------------------------------*/
.future-blocks {
  position: relative;
  background: url(../image/img_future_bg.jpg)no-repeat center center /cover;
  background-attachment: fixed;
  z-index: 1;
}

.future-blocks::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.6);
  z-index: -1;
}

.future-blocks .inner {
  padding: 110px 0 30px;
  max-width: 600px;
}

.future-blocks .leadtitl {}

@media only screen and (max-width: 979px) {
  .future-blocks {
    background: none;
    margin-bottom: 60px;
  }

  .future-blocks .inner {
    max-width: none;
    padding: 60px 4% 30px;
    border: 1px solid;
    border-radius: 5px;
  }
}

/*-------------------------------------*/

/*211118_追記　New Service*/

/*-------------------------------------*/
.srv_top {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin-bottom: 60px;
  justify-content: space-between;
}

.srv_top:nth-child(2n) {
  margin-bottom: 80px;
}

.srv_top .leadtxt{
  color: #666;
  font-size: 28px;
  line-height: 1;
  text-align: left;
  margin: 35px 0 24px 0;
}

.srv_top .subtxt{
  color: #444;
  font-size: 15px;
  line-height: 1.4;
  text-align: left;
  margin-bottom: 40px;
}

.srv_top .col{
  flex-wrap: wrap;
  width: 48%;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  align-content: center;
}

.srv_top .img{
  width: 50%;
}

.srv_top .img img{
  margin-right: 0;
}

.srv_top:nth-child(2n).srv_top .img img {
  margin-left: 0;
}

.srv_top .btn_top a {
  background-color: #333;
  color: #fff;
  padding: 15px;
  width: 245px;
  display: inline-block;
  border: #333 1px solid;
  border-radius: 4px;
  position: relative;
}

.srv_top .btn_top a:hover {
  text-decoration: none;
  background-color: #fff;
  color: #333;
}

.srv_top a::before{
  content: '';
    display: block;
    right: 12px;
    z-index: 3;
    width: 6px;
    height: 6px;
    border-width: 2px 2px 0 0;
    border-style: solid;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    margin-top: -3px;
}

.srv_top_txt{
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  margin: 20px 0 60px;
  width: 85%;
}

.srv_top_textbox{
  display: flex;
  align-items: center;
  justify-content: center;
}

@media only screen and (max-width: 980px){
  .pc_br{
    display: none;
  }
  .srv_top .col{
    align-content: baseline;
    width: 50%;
  }

  .srv_top:nth-child(2n) {
    margin-bottom: 80px;
  }

  .srv__blocks .col{
    height: auto;
  }

  .srv_top .img {
    width: 45%;
  }

}

@media only screen and (max-width: 690px){
  .srv_top{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-bottom: 30px;
  }

  .srv_top .col{
    order: 2;
    width: 100%;
  }

  .srv_top .col figure{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }

  .srv_top .leadtxt{
    text-align: center;
  }

  .srv_top .btn_top {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }

  .srv_top .img {
    width: 85%;
  }

  .srv_top:nth-child(2n) {
    margin-bottom: 40px;
  }

  .srv_top_txt {
    margin: 0 0 40px;
  }

}