.root#index .mv {
  width: 100%;
  overflow: hidden;
  font-size: 0;
}

.root#index .mv__slider {
  width: 1030px;
  margin-left: auto;
  margin-right: auto;
}

@media only screen and (max-width: 767px) {
  .root#index .mv__slider {
    width: 100%;
  }
}

.root#index .mv__slider .slick-slide > div {
  padding: 0 15px;
}

.root#index .mv__slider__eachSlider {
  position: relative;
  text-align: center;
}

.root#index .mv__slider__eachSlider:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: #006FFF;
  transition: all 0.4s ease 0.4s;
}

@media only screen and (max-width: 767px) {
  .root#index .mv__slider__eachSlider:before {
    width: 100%;
    right: 0;
  }
}

.root#index .mv__slider__eachSlider:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  transition: all 0.4s ease;
}

@media only screen and (max-width: 767px) {
  .root#index .mv__slider__eachSlider:after {
    width: 100%;
    right: 0;
  }
}

@media only screen and (max-width: 767px) {
  .root#index .mv__slider__eachSlider {
    padding: 0;
  }
}

.root#index .mv__slider__eachSlider > a {
  display: inline-block;
}

.root#index .mv__slider .slick-list {
  overflow: visible;
}

.root#index .mv__slider .slick-prev {
  position: absolute;
  top: 50%;
  left: -5px;
  transform: translateY(-50%);
  display: block;
  background-image: url(../../images/root/mv_arrow@2x.png);
  width: 40px;
  height: 68px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  z-index: 10;
  cursor: pointer;
}

.root#index .mv__slider .slick-next {
  position: absolute;
  top: 50%;
  right: -5px;
  transform: translateY(-50%) rotate(180deg);
  display: block;
  background-image: url(../../images/root/mv_arrow@2x.png);
  width: 40px;
  height: 68px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  z-index: 10;
  cursor: pointer;
}

.root#index .mv__slider .slick-dots {
  width: 100%;
  font-size: 0;
  text-align: center;
  opacity: 0;
  transition: all 0.4s ease 0.4s;
  margin-top: 20px;
}

@media only screen and (max-width: 767px) {
  .root#index .mv__slider .slick-dots {
    margin-top: 10px;
  }
}

.root#index .mv__slider .slick-dots > li {
  display: inline-block;
  margin-left: 10px;
  margin-bottom: 15px;
}

.root#index .mv__slider .slick-dots > li:first-child {
  margin-left: 0;
}

@media only screen and (max-width: 767px) {
  .root#index .mv__slider .slick-dots > li {
    margin-bottom: 10px;
  }
}

.root#index .mv__slider .slick-dots > li > button {
  width: 50px;
  height: 4px;
  background-color: #606060;
  cursor: pointer;
}

@media only screen and (max-width: 767px) {
  .root#index .mv__slider .slick-dots > li > button {
    width: 10px;
  }
}

.root#index .mv__slider .slick-dots > li.slick-active > button {
  background-color: #006FFF;
}

.root#index .mv__slideArrowBtns {
  text-align: center;
  opacity: 0;
  transition: all 0.4s ease 0.4s;
  margin-top: 20px;
}

.root#index .mv__slideArrowBtns__eachBtn {
  position: relative;
  width: 40px;
  height: 40px;
  border: 1px solid #2E2D33;
  display: inline-block;
  vertical-align: middle;
  overflow: visible;
}

@media only screen and (max-width: 767px) {
  .root#index .mv__slideArrowBtns__eachBtn {
    width: 30px;
    height: 30px;
  }
}

.root#index .mv__slideArrowBtns__eachBtn:before {
  content: "";
  width: 32px;
  height: 5px;
  background-size: contain;
  background-image: url(/assets/images/common/arrow_pager.svg);
  background-position: center center;
  background-repeat: no-repeat;
  display: block;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translate(15px, -50%);
  transition: 0.2s transform cubic-bezier(0.23, 1, 0.32, 1);
}

@media only screen and (max-width: 767px) {
  .root#index .mv__slideArrowBtns__eachBtn:before {
    transform: translate(10px, -50%);
    width: 23px;
  }
}

.root#index .mv__slideArrowBtns__eachBtn[data-ui="next"] {
  transform: rotate(180deg);
  margin-left: 40px;
}

@media only screen and (max-width: 767px) {
  .root#index .mv__slideArrowBtns__eachBtn[data-ui="next"] {
    margin-left: 30px;
  }
}

.root#index .mv__slideArrowBtns__eachBtn:hover {
  cursor: pointer;
}

.root#index .mv__slideArrowBtns__eachBtn:hover:before {
  transform: translate(0, -50%);
  background-image: url(/assets/images/common/arrow_pager_on.svg);
}

.root#index .mv.is-animated .mv__slider__eachSlider:before {
  width: 0;
}

.root#index .mv.is-animated .mv__slider__eachSlider:after {
  width: 0;
}

.root#index .mv.is-animated .slick-dots {
  opacity: 1;
}

.root#index .mv.is-animated .mv__slideArrowBtns {
  opacity: 1;
}

.root#index .serviceAndSolution {
  padding-top: 120px;
  padding-bottom: 60px;
}

@media only screen and (max-width: 767px) {
  .root#index .serviceAndSolution {
    padding-top: 60px;
    padding-bottom: 30px;
  }
}

.root#index .serviceAndSolution__hl {
  margin-bottom: 25px;
}

.root#index .serviceAndSolution__rt {
  text-align: center;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.71428571429;
  margin-bottom: 30px;
}

@media only screen and (max-width: 767px) {
  .root#index .serviceAndSolution__rt {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.root#index .serviceAndSolution__serviceList {
  margin-bottom: 40px;
}

.root#index .serviceAndSolution__serviceList__item {
  width: 298px;
  float: left;
  margin-left: 48px;
}

@media only screen and (max-width: 767px) {
  .root#index .serviceAndSolution__serviceList__item {
    width: 100%;
    float: none;
    margin-left: 0;
    margin-bottom: 35px;
  }
}

.root#index .serviceAndSolution__serviceList__item:first-child {
  margin-left: 0;
}

@media only screen and (max-width: 767px) {
  .root#index .serviceAndSolution__serviceList__item:last-child {
    margin-bottom: 0;
  }
}

.root#index .serviceAndSolution__serviceList__item__anchor {
  display: block;
  transition: 0.4s all cubic-bezier(0.23, 1, 0.32, 1);
}

.root#index .serviceAndSolution__serviceList__item__anchor__photo {
  position: relative;
  overflow: hidden;
}

.root#index .serviceAndSolution__serviceList__item__anchor__photo:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: #006FFF;
  transition: all 0.4s ease 0.4s;
}

.root#index .serviceAndSolution__serviceList__item__anchor__photo:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  transition: all 0.4s ease;
}

.root#index .serviceAndSolution__serviceList__item__anchor > dl {
  position: relative;
  padding: 15px 10px;
  opacity: 0;
  transition: all 0.4s ease 0.4s;
}

.root#index .serviceAndSolution__serviceList__item__anchor > dl:before {
  content: "";
  display: block;
  background-color: #006FFF;
  width: 0;
  height: 2px;
  position: absolute;
  top: 0;
  left: 0;
  transition: 0.4s all cubic-bezier(0.23, 1, 0.32, 1);
}

.root#index .serviceAndSolution__serviceList__item__anchor > dl > dt {
  font-size: 19px;
  font-size: 1.9rem;
  font-weight: 500;
  margin-bottom: 5px;
  color: #2A2A2A;
}

@media only screen and (max-width: 767px) {
  .root#index .serviceAndSolution__serviceList__item__anchor > dl > dt {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

.root#index .serviceAndSolution__serviceList__item__anchor > dl > dt > span {
  font-size: 12px;
  font-size: 1.2rem;
  display: inline-block;
  margin-left: 5px;
}

@media only screen and (max-width: 767px) {
  .root#index .serviceAndSolution__serviceList__item__anchor > dl > dt > span {
    font-size: 10px;
    font-size: 1rem;
  }
}

.root#index .serviceAndSolution__serviceList__item__anchor > dl > dd {
  font-size: 12px;
  font-size: 1.2rem;
  color: #999999;
  font-family: sofia-pro, sans-serif;
  font-weight: 400;
  font-style: normal;
}

@media only screen and (max-width: 767px) {
  .root#index .serviceAndSolution__serviceList__item__anchor > dl > dd {
    font-size: 10px;
    font-size: 1rem;
  }
}

.root#index .serviceAndSolution__serviceList__item__anchor:hover {
  box-shadow: 2px 1px 27px 0 rgba(0, 0, 0, 0.12);
}

.root#index .serviceAndSolution__serviceList__item__anchor:hover > dl:before {
  width: 100%;
}

.root#index .serviceAndSolution__serviceList__item__anchor:hover > dl > dt {
  color: #006FFF;
}

.root#index .serviceAndSolution__serviceList__item.is-animated .serviceAndSolution__serviceList__item__anchor__photo:before {
  width: 0;
}

.root#index .serviceAndSolution__serviceList__item.is-animated .serviceAndSolution__serviceList__item__anchor__photo:after {
  width: 0;
}

.root#index .serviceAndSolution__serviceList__item.is-animated .serviceAndSolution__serviceList__item__anchor > dl {
  opacity: 1;
}

.root#index .serviceAndSolution__btn {
  width: 240px;
  margin-left: auto;
  margin-right: auto;
}

.root#index .works {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding-top: 60px;
  padding-bottom: 60px;
}

@media only screen and (max-width: 767px) {
  .root#index .works {
    padding-top: 30px;
    padding-bottom: 30px;
  }
}

.root#index .works__hl {
  margin-bottom: 25px;
}

.root#index .works__rt {
  text-align: center;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.71428571429;
  margin-bottom: 30px;
}

@media only screen and (max-width: 767px) {
  .root#index .works__rt {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.root#index .works__slideArrowBtns {
  position: absolute;
  top: 20px;
  right: 0;
}

@media only screen and (max-width: 767px) {
  .root#index .works__slideArrowBtns {
    position: static;
    /*text-align: right;*/
    text-align: center;
    margin-bottom: 20px;
  }
}

.root#index .works__slideArrowBtns__eachBtn {
  position: relative;
  width: 40px;
  height: 40px;
  border: 1px solid #2E2D33;
  display: inline-block;
  vertical-align: middle;
  overflow: visible;
}

@media only screen and (max-width: 767px) {
  .root#index .works__slideArrowBtns__eachBtn {
    width: 30px;
    height: 30px;
  }
}

.root#index .works__slideArrowBtns__eachBtn:before {
  content: "";
  width: 32px;
  height: 5px;
  background-size: contain;
  background-image: url(/assets/images/common/arrow_pager.svg);
  background-position: center center;
  background-repeat: no-repeat;
  display: block;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translate(15px, -50%);
  transition: 0.2s transform cubic-bezier(0.23, 1, 0.32, 1);
}

@media only screen and (max-width: 767px) {
  .root#index .works__slideArrowBtns__eachBtn:before {
    transform: translate(10px, -50%);
    width: 23px;
  }
}

.root#index .works__slideArrowBtns__eachBtn[data-ui="next"] {
  transform: rotate(180deg);
  margin-left: 40px;
}

@media only screen and (max-width: 767px) {
  .root#index .works__slideArrowBtns__eachBtn[data-ui="next"] {
    margin-left: 30px;
  }
}

.root#index .works__slideArrowBtns__eachBtn:hover {
  cursor: pointer;
}

.root#index .works__slideArrowBtns__eachBtn:hover:before {
  transform: translate(0, -50%);
  background-image: url(/assets/images/common/arrow_pager_on.svg);
}

.root#index .works__slider {
  width: 376px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 40px;
}

@media only screen and (max-width: 767px) {
  .root#index .works__slider {
    width: 86%;
  }
}

.root#index .works__slider__eachSlide {
  padding: 0 10px;
}

.root#index .works__slider__eachSlide__photo {
  position: relative;
  overflow: hidden;
}

.root#index .works__slider__eachSlide__photo:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: #006FFF;
  transition: all 0.4s ease 0.4s;
}

.root#index .works__slider__eachSlide__photo:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  transition: all 0.4s ease;
}

.root#index .works__slider__eachSlide__status {
  padding: 20px;
  background-color: #fff;
  opacity: 0;
  transition: all 0.4s ease 0.4s;
}

.root#index .works__slider__eachSlide__status:before {
  content: "";
  display: block;
  background-color: #006FFF;
  width: 0;
  height: 2px;
  position: absolute;
  top: 0;
  left: 0;
  transition: 0.4s all cubic-bezier(0.23, 1, 0.32, 1);
}

.root#index .works__slider__eachSlide__status__title {
  color: #2A2A2A;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 500;
  margin-bottom: 20px;
}

.root#index .works__slider__eachSlide__status__publisher {
  color: #2A2A2A;
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: 10px;
  line-height: 1.66666666667;
}

.root#index .works__slider__eachSlide__status__publisher > a {
  text-decoration: underline;
  color: #2A2A2A;
  display: inline-block;
}

.root#index .works__slider__eachSlide__status__publisher > a[target="_blank"] {
  background-image: url(/assets/images/common/icon_blank.svg);
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 13px auto;
  padding-right: 20px;
}

.root#index .works__slider__eachSlide__status__publisher > a:hover {
  text-decoration: none;
}

.root#index .works__slider__eachSlide__status__copyright {
  color: #999999;
  font-size: 10px;
  font-size: 1rem;
  font-family: sofia-pro, sans-serif;
  font-weight: 400;
  font-style: normal;
}

.root#index .works__slider .slick-list {
  overflow: visible;
}

.root#index .works__slider.is-animated .works__slider__eachSlide__photo:before {
  width: 0;
}

.root#index .works__slider.is-animated .works__slider__eachSlide__photo:after {
  width: 0;
}

.root#index .works__slider.is-animated .works__slider__eachSlide__status {
  opacity: 1;
}

.root#index .works__btn {
  width: 240px;
  margin-left: auto;
  margin-right: auto;
}

.root#index .news {
  padding-top: 60px;
  padding-bottom: 60px;
}

@media only screen and (max-width: 767px) {
  .root#index .news {
    padding-top: 30px;
  }
}

.root#index .news__hl {
  margin-bottom: 25px;
}

.root#index .news__tabContents {
  position: relative;
  margin-bottom: 40px;
}

.root#index .news__tabContents__tab {
  display: inline-block;
  position: absolute;
  top: -90px;
  right: 0;
}

@media only screen and (max-width: 767px) {
  .root#index .news__tabContents__tab {
    display: block;
    position: static;
    margin-bottom: 30px;
  }
}

.root#index .news__btn {
  width: 240px;
  margin-left: auto;
  margin-right: auto;
}

.root#index .companyAndRecruit__eachMenu {
  width: 50%;
  float: left;
  text-align: center;
  padding: 50px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

@media only screen and (max-width: 767px) {
  .root#index .companyAndRecruit__eachMenu {
    width: 100%;
    float: none;
    padding: 30px;
  }
}

.root#index .companyAndRecruit__eachMenu[data-menu="company"] {
  background-image: url(../../images/root/company_bg@2x.png);
}

.root#index .companyAndRecruit__eachMenu[data-menu="recruit"] {
  background-image: url(../../images/root/recruit_bg@2x.png);
}

.root#index .companyAndRecruit__eachMenu__hl {
  margin-bottom: 30px;
}

.root#index .companyAndRecruit__eachMenu__sub {
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 500;
  margin-bottom: 30px;
}

@media only screen and (max-width: 767px) {
  .root#index .companyAndRecruit__eachMenu__sub {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

.root#index .companyAndRecruit__eachMenu__rt {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.71428571429;
  margin-bottom: 30px;
}

@media only screen and (max-width: 767px) {
  .root#index .companyAndRecruit__eachMenu__rt {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.root#index .companyAndRecruit__eachMenu__btn {
  width: 240px;
  margin-left: auto;
  margin-right: auto;
  border: none;
  background-color: #fff;
}

.root#index .contacts {
  padding-top: 90px;
  padding-bottom: 90px;
}

@media only screen and (max-width: 767px) {
  .root#index .contacts {
    padding-top: 45px;
    padding-bottom: 45px;
  }
}

.root#index .contacts__hl {
  display: inline-block;
  vertical-align: middle;
}

@media only screen and (max-width: 767px) {
  .root#index .contacts__hl {
    display: block;
    margin-bottom: 30px;
  }
}

.root#index .contacts__rt {
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.71428571429;
  margin-left: 20px;
}

@media only screen and (max-width: 767px) {
  .root#index .contacts__rt {
    display: block;
    margin-left: 0;
    text-align: center;
    margin-bottom: 30px;
  }
}

.root#index .contacts__selectBox {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 2;
  /*Styling Selectbox*/
}

@media only screen and (max-width: 767px) {
  .root#index .contacts__selectBox {
    position: relative;
    bottom: auto;
    right: auto;
  }
}

.root#index .contacts__selectBox .dropdown {
  position: relative;
  width: 350px;
  display: inline-block;
  background-color: #fff;
  position: relative;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: 500;
  color: #006FFF;
  text-align: center;
  border: 1px solid #006FFF;
  transition: 0.4s all cubic-bezier(0.23, 1, 0.32, 1);
}

.root#index .contacts__selectBox .dropdown:hover {
  box-shadow: 2px 1px 27px 0 rgba(0, 0, 0, 0.12);
}

.root#index .contacts__selectBox .dropdown:after {
  position: absolute;
  top: 50%;
  right: 20px;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-right: 2px solid #006FFF;
  border-bottom: 2px solid #006FFF;
  transform: translateY(-50%) rotate(45deg);
  margin-top: -2px;
}

@media only screen and (max-width: 767px) {
  .root#index .contacts__selectBox .dropdown {
    display: block;
    width: 240px;
    margin-left: auto;
    margin-right: auto;
    font-size: 13px;
    font-size: 1.3rem;
  }
}

.root#index .contacts__selectBox .dropdown .select {
  cursor: pointer;
  display: block;
  padding: 15px;
}

.root#index .contacts__selectBox .dropdown:active {
  background-color: #f8f8f8;
}

.root#index .contacts__selectBox .dropdown.active:hover,
.root#index .contacts__selectBox .dropdown.active {
  background-color: #f8f8f8;
}

.root#index .contacts__selectBox .dropdown.active .select > i {
  transform: rotate(-90deg);
}

.root#index .contacts__selectBox .dropdown .dropdown-menu {
  position: absolute;
  background-color: #fff;
  width: 100%;
  left: 0;
  margin-top: 1px;
  box-shadow: 0 1px 2px #cccccc;
  overflow: hidden;
  display: none;
  overflow-y: auto;
  z-index: 9;
}

.root#index .contacts__selectBox .dropdown .dropdown-menu li {
  padding: 15px;
  cursor: pointer;
}

.root#index .contacts__selectBox .dropdown .dropdown-menu {
  padding: 0;
}

.root#index .contacts__selectBox .dropdown .dropdown-menu li:hover {
  background-color: #f2f2f2;
}

.root#index .contacts__selectBox .dropdown .dropdown-menu li:active {
  background-color: #e2e2e2;
}