@charset "utf-8";

/* =================================================================
		Clearfix
================================================================= */

.home-about-chart:after,
.home-member-list:after {
 content: ".";
 display: block;
 height: 0;
 clear: both;
 visibility: hidden;
 line-height: 0;
}


/* =================================================================
		Home
================================================================= */


/* base for pc */

@media screen and (min-width: 768px) {
 #container.scroll {
  margin-top: 288px;
 }
 #key {
  background: url(../img/home/key_01_l.jpg) center top / cover no-repeat;
  position: relative;
  z-index: 0;
  overflow: hidden;
 }
 @keyframes keyimage {
  0% {
   filter: blur(4px);
  }
  100% {
   filter: blur(0);
  }
 }
 #key:before {
  content: '';
  background: inherit;
  position: absolute;
  top: -5px;
  left: -5px;
  right: -5px;
  bottom: -5px;
  z-index: -1;
  animation: keyimage 2.5s linear 1;
  animation-fill-mode: forwards;
 }
 #key .inner {
  position: relative;
  width: 80%;
  /*height: 54vw;*/
  height: 90vh;
  max-width: 1200px;
  margin: 0 auto;
 }
 #key .txt {
  color: #fff;
  position: absolute;
  bottom: 6.4em;
 }
 #key .txt .maincopy {
  font-family: 'Oswald', sans-serif;
  font-weight: lighter;
  font-size: 13em;
  line-height: 1;
  margin: 0 0 .1em;
 }
 #key .txt p {
  font-family: 'Oswald', sans-serif;
  font-weight: normal;
  font-size: 3em;
  line-height: 1.1;
  letter-spacing: .02em;
  text-indent: .1em;
 }
 .btn-recruit {
  width: 148px;
  height: 148px;
  transform: rotate(45deg);
  overflow: hidden;
  margin: -128px 60px -20px auto;
 }
 /*.btn-recruit {
    width: 148px;
    height: 148px;
    transform: rotate(45deg);
    overflow: hidden;
    margin: -128px 60px 0 auto;
  }*/
 .btn-recruit a {
  width: 100%;
  height: 100%;
  background-color: #ff4e91;
  display: block;
  color: #fff;
  text-decoration: none;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -o-transition: 0.2s;
  -ms-transition: 0.2s;
  transition: 0.2s;
 }
 .btn-recruit a:hover {
  background-color: #00e89e;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
  transition: 0.4s;
 }
 .btn-recruit a span {
  width: 90%;
  display: block;
  text-align: center;
  transform: rotate(-45deg);
  margin: 0 auto;
 }
 .btn-recruit a span.en {
  font-size: 2.2em;
  letter-spacing: .05em;
  font-family: 'Oswald', sans-serif;
  position: relative;
  left: -16px;
  top: 38px;
 }
 .btn-recruit a span.jp {
  font-size: 1.2em;
  line-height: 1.4;
  margin: 23px 0 0 27px;
 }
 .ttl-home-section {
  font-size: 3.7em;
  font-family: 'Oswald', sans-serif;
  font-weight: normal;
  text-align: center;
  letter-spacing: .1em;
  margin: 0 0 .6em;
 }
 .home-concept {
  overflow: hidden;
 }
 .home-concept .inner {
  width: 1000px;
  margin: 0 auto;
  padding: 5.8em 0 10em;
  position: relative;
 }
 .home-concept .ttl-home-section {
  position: relative;
  z-index: 2;
 }
 .home-concept h3 {
  font-size: 1.9em;
  font-weight: 500;
  letter-spacing: .1em;
  margin: 0 0 .8em;
  position: relative;
  z-index: 2;
 }
 .home-concept .exp {
  font-size: 1.2em;
  line-height: 2.3;
  font-weight: 500;
  letter-spacing: .1em;
  margin: 0 0 1.4em;
  position: relative;
  z-index: 2;
 }
 .home-concept .inner .pct-concept {
  position: absolute;
  right: -18%;
  line-height: 0;
  bottom: 0;
  z-index: 1;
  filter: blur(6px);
  transform: scale(1.1);
  opacity: 0;
 }
 .home-concept .inner .pct-concept.showclear {
  filter: blur(0);
  transform: scale(1);
  opacity: 1;
  -webkit-transition: 1.6s;
  -moz-transition: 1.6s;
  -o-transition: 1.6s;
  -ms-transition: 1.6s;
  transition: 1.6s;
 }
 .home-news {
  background: url(../img/home/bg_news.jpg) center top / cover no-repeat;
 }
 .home-news .inner {
  width: 1000px;
  margin: 0 auto;
  padding: 5em 0 6.5em;
 }
 .home-news .ttl-home-section {
  color: #fff;
 }
 .home-news dl {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: stretch;
  margin: 0 0 4.5em;
 }
 .home-news dt,
 .home-news dd {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  padding: 24px 0;
 }
 .home-news dt {
  width: 15%;
  font-size: 1.4em;
  color: #bde9ff;
  font-family: 'Oswald', sans-serif;
  font-weight: lighter;
  letter-spacing: .1em;
 }
 .home-news dd {
  width: 85%;
 }
 .home-news dd a,
 .home-news dd span {
  color: #fff;
  font-size: 1.4em;
  text-decoration: none;
 }
 .home-news .btn-toall {
  text-align: center;
 }
 .home-news .btn-toall a {
  font-size: 1.3em;
  border: 2px solid #fff;
  text-decoration: none;
  color: #fff;
  background: url(../img/parts/ico_arrow_wh.png) right 8% center no-repeat;
  padding: .8em 2.4em .8em 1.9em;
  transition: all 0.3s;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
 }
 .home-news .btn-toall a:hover {
  background: #fff url(../img/parts/ico_arrow.png) right 8% center no-repeat;
  color: #11346a;
  transition: all 0.3s;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
 }
 .home-service {
  background-image: url(../img/home/bg_service.jpg);
  background-repeat: no-repeat;
  animation: ab-service 10s linear 1;
  animation-fill-mode: forwards;
 }
 @keyframes ab-service {
  0% {
   background-position: right 65% top -18%;
  }
  100% {
   background-position: right -10% top 0;
  }
 }
 .home-service .inner {
  width: 1000px;
  margin: 0 auto;
  padding: 5em 0 6.5em;
 }
 .home-service .ttl-home-section {
  margin-bottom: 40px;
 }
 .service-block {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: stretch;
  margin: 0 0 110px;
 }
 .service-block .txt {
  width: 430px;
 }
 .service-block .pct {
  width: 536px;
 }
 .service-block .service-logo {
  text-align: center;
  margin-bottom: 1.2em;
 }
 .service-block .exp {
  font-size: 1.2em;
  margin: 0 0 1.4em;
 }
 .home-service .btn-link {
  text-align: center;
 }
 .home-service .btn-link a {
  width: 370px;
  margin: 0 auto;
  font-size: 1.2em;
  display: block;
  padding: .5em 10px .5em 0;
 }
 .home-service .btn-toall {
  text-align: center;
 }
 .home-service .btn-toall a {
  font-size: 1.3em;
  border: 2px solid #000;
  text-decoration: none;
  background: transparent url(../img/parts/ico_arrow.png) right 8% center no-repeat;
  color: #000;
  padding: .8em 2.4em .8em 1.9em;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -ms-transition: 0.3s;
  transition: 0.3s;
 }
 .home-service .btn-toall a:hover {
  background: #000 url(../img/parts/ico_arrow_wh.png) right 8% center no-repeat;
  color: #fff;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -ms-transition: 0.3s;
  transition: 0.3s;
 }
 .home-recruit {
  background: #f0f0f0;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: stretch;
 }
 .home-recruit .txt {
  width: 58%;
  background-image: url(../img/home/bg_recruit.jpg);
  background-repeat: no-repeat;
  animation: ab-recruit 10s linear 1;
  animation-fill-mode: forwards;
  padding: 5em 6%;
 }
 @keyframes ab-recruit {
  0% {
   background-position: right -200px top -20%;
  }
  100% {
   background-position: right 0 top 0;
  }
 }
 .home-recruit .txt .ttl-home-section {
  text-align: left;
 }
 .home-recruit .txt h3 {
  font-size: 2em;
  font-weight: 500;
  margin: 0 0 .9em;
 }
 .home-recruit .txt .exp {
  font-size: 1.25em;
  margin: 0 0 1.9em;
 }
 .home-recruit .txt .btn-link a {
  background-color: #fff;
 }
 .home-recruit .pct {
  text-align: center;
  width: 42%;
  overflow: hidden;
  text-align: left;
 }
}


/* home for mobile */

@media screen and (max-width: 767px) {
 #key {
  background: url(../img/home/key_01_s.jpg) center top / cover no-repeat;
  padding: 21% 0 14%;
  position: relative;
  z-index: 0;
  overflow: hidden;
 }
 #key:before {
  content: '';
  background: inherit;
  position: absolute;
  top: -5px;
  left: -5px;
  right: -5px;
  bottom: -5px;
  z-index: -1;
  animation: keyimage 1.8s linear 1;
  animation-fill-mode: forwards;
 }
 @keyframes keyimage {
  0% {
   filter: blur(8px);
  }
  100% {
   filter: blur(0);
  }
 }
 #key .txt {
  color: #fff;
 }
 #key .txt .maincopy {
  font-family: 'Oswald', sans-serif;
  font-weight: lighter;
  font-size: 11em;
  line-height: 1;
  text-align: center;
  margin: 0 0 .1em;
 }
 #key .txt p {
  font-family: 'Oswald', sans-serif;
  font-weight: normal;
  font-size: 3.4em;
  line-height: 1.1;
  letter-spacing: .02em;
  text-indent: .1em;
  text-align: center;
 }
 .btn-recruit {
  width: 118px;
  height: 118px;
  transform: rotate(45deg);
  overflow: hidden;
  position: relative;
  z-index: 30;
  margin: -2.1em 1em 0 auto;
 }
 .btn-recruit a {
  width: 100%;
  height: 140%;
  background-color: #ff4e91;
  display: block;
  color: #fff;
  text-decoration: none;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -o-transition: 0.2s;
  -ms-transition: 0.2s;
  transition: 0.2s;
 }
 .btn-recruit a:hover {
  background-color: #00e89e;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
  transition: 0.4s;
 }
 .btn-recruit a span {
  width: 90%;
  display: block;
  text-align: center;
  transform: rotate(-45deg);
  margin: 0 auto;
 }
 .btn-recruit a span.en {
  font-size: 2em;
  letter-spacing: .05em;
  font-family: 'Oswald', sans-serif;
  position: relative;
  left: -13px;
  top: 26px;
 }
 .btn-recruit a span.jp {
  font-size: 1.1em;
  line-height: 1.4;
  margin: 13px 0 0 25px;
 }
 .ttl-home-section {
  font-size: 3.2em;
  font-family: 'Oswald', sans-serif;
  font-weight: normal;
  text-align: center;
  letter-spacing: .1em;
  margin: 0 0 .4em;
 }
 .home-concept {
  background: url(../img/home/bg_concept.jpg) right 40% bottom 0 / 180% auto no-repeat;
  position: relative;
  margin-top: -2em;
 }
 .home-concept:before {
  z-index: 0;
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.6);
 }
 .home-concept .inner {
  width: 88%;
  z-index: 20;
  position: relative;
  margin: 0 auto;
  padding: 4em 0 7em;
 }
 .home-concept .inner .pct-concept {
  display: none;
 }
 .home-concept h3 {
  font-size: 1.9em;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: .1em;
  text-align: center;
  margin: 0 0 .8em;
 }
 .home-concept .exp {
  font-size: 1.2em;
  line-height: 2.3;
  font-weight: 500;
  letter-spacing: .1em;
  margin: 0 0 1.4em;
 }
 .home-concept .exp br {
  display: none;
 }
 .home-news {
  background: url(../img/home/bg_news.jpg) center top / cover no-repeat;
  margin-top: -93px;
 }
 .home-news .inner {
  width: 88%;
  margin: 0 auto;
  padding: 5em 0 6.5em;
 }
 .home-news .ttl-home-section {
  color: #fff;
 }
 .home-news dl {
  margin-bottom: 3em;
 }
 .home-news dt {
  font-size: 1.3em;
  color: #bde9ff;
  font-family: 'Oswald', sans-serif;
  font-weight: lighter;
  letter-spacing: .1em;
  display: inline;
  margin: 0 0 4em;
  padding: .2em 2.7em 0 0;
 }
 .home-news dd {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  margin: 0 0 1.4em;
  padding: 0 0 1.4em;
 }
 .home-news dd a,
 .home-news dd span {
  color: #fff;
  font-size: 1.3em;
  text-decoration: none;
 }
 .home-news .btn-toall {
  text-align: center;
 }
 .home-news .btn-toall a {
  font-size: 1.3em;
  border: 2px solid #fff;
  text-decoration: none;
  color: #fff;
  background: url(../img/parts/ico_arrow_wh.png) right 8% center no-repeat;
  padding: .9em 2.4em .7em 1.9em;
 }
 .home-service {
  background: url(../img/home/bg_service.jpg) right 34% top 0 / 130% auto no-repeat;
 }
 .home-service .inner {
  width: 88%;
  margin: 0 auto;
  padding: 5em 0 6.5em;
 }
 .home-service .ttl-home-section {
  margin-bottom: .3em;
 }
 .service-block {
  padding: 0 0 2.6em;
  margin: 0 0 2.6em;
  border-bottom: 1px solid #e1e1e1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
 }
 .service-block .pct {
  width: 80%;
  position: relative;
  left: -1em;
  margin: 1.9em auto 0;
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 1;
 }
 .service-block .pct img {
  width: 100%;
 }
 .service-block .txt {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 2;
 }
 .service-block .service-logo {
  width: 84%;
  text-align: center;
  margin-bottom: 1.2em;
  margin: .8em auto .4em;
 }
 .service-block .service-logo img {
  width: 100%;
 }
 .service-block .exp {
  font-size: 1.2em;
  margin: 0 0 1.8em;
 }
 .home-service .btn-toall {
  text-align: center;
 }
 .home-service .btn-toall a {
  font-size: 1.3em;
  border: 2px solid #000;
  text-decoration: none;
  background: url(../img/parts/ico_arrow.png) right 8% center no-repeat;
  color: #000;
  padding: .9em 2.4em .7em 1.9em;
 }
 .home-recruit {
  background: #f0f0f0;
 }
 .home-recruit .txt {
  background: url(../img/home/bg_recruit.jpg) right top / 100% auto no-repeat;
  padding: 4em 10% 5em;
 }
 .home-recruit .txt h3 {
  font-size: 2em;
  font-weight: 500;
  margin: 0 0 .7em;
 }
 .home-recruit .txt h3 br {
  display: none;
 }
 .home-recruit .txt .exp {
  font-size: 1.25em;
  margin: 0 0 1.9em;
 }
 .home-recruit .txt .btn-link a {
  background-color: #fff;
 }
 .home-recruit .pct {
  line-height: 0;
 }
 .home-recruit .pct img {
  width: 100%;
 }
}
