/**
 *
 *  Top Page Layout
 *
 **/
.top__main {
  zoom: 1;
  position: relative;
}

.top__main:before, .top__main:after {
  content: "";
  display: table;
}

.top__main:after {
  clear: both;
}

.top__content {
  box-sizing: border-box;
}

.top__content__title {
  font-family: 'Open Sans Condensed', sans-serif;
  font-size: 281.25%;
  margin-bottom: 11px;
}

.top__content__subtitle {
  font-size: 100%;
}

.top__work {
  position: relative;
  width: 630px;
  height: 630px;
}

.top__work img {
  width: 100%;
}

.top__work:hover .top__work__text {
  display: table;
}

.top__work__text {
  box-sizing: border-box;
  display: none;
  font-size: 100%;
  padding: 10px;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.top__work__text__inner {
  background-color: rgba(27, 27, 27, 0.5);
  color: #fff;
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}

.top__work__text__copyright {
  display: block;
  font-size: 81.25%;
  margin-top: 12px;
}
.top__work__text__copyright100 {
  font-size: 100%;
}

.top__work__text__copyright span{
  display: block;
  padding-top:0.5em;
}

.top__work01 {
  float: left;
}

.top__work02 {
  float: left;
}

.top__work03 {
  float: left;
  text-align: center;
  position: absolute;
  top: 1575px;
  left: 315px;
  width: 630px;
  z-index: 1;
}

.top__news {
  float: left;
  padding-top: 62px;
  padding-right: 18px;
  padding-left: 30px;
  width: 315px;
  height: 315px;
}

.top__news__title__a {
  color: #000;
}

.top__news__title__a:hover {
  color: #00aae7;
}

.top__news__list {
  margin-top: 40px;
}

.top__news__list__item {
  font-size: 81.25%;
  line-height: 1.5;
  margin-bottom: 5px;
}

.top__news__list__item__a {
  color: #000;
}

.top__news__list__item__a:hover {
  color: #00aae7;
}

.top__news__list__item__a:before {
  color: #00aae7;
  content: '\f138';
  font-family: FontAwesome;
  margin-left: 0px;
  margin-right: 5px;
}

.top__news__list__item__date {
  display: block;
}

.top__service {
  background-color: #00aae7;
  color: #fff;
  float: left;
  padding-top: 62px;
  padding-left: 30px;
  width: 315px;
  height: 315px;
}

.top__service__a:hover .top__service__title {
  color: #fff600;
}

.top__service__a:hover .top__service__subtitle {
  color: #fff600;
}

.top__opakis {
  background-color: #000;
  color: #fff;
  float: left;
  padding: 56px 33px 0 33px;
  width: 630px;
  height: 630px;
}

.top__opakis__title__sub {
  font-size: 81.25%;
}

.top__opakis__a{ color:#fff;}
.top__opakis__a:hover{ color:#fff600;}

.top__opakis__movie {
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: 0 50%;
  cursor: pointer;
  margin: 70px auto 0;
  width: 90%;
  position: relative;
  padding-top: 56.25%;
}

.top__opakis__movie iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

.top__opakis__movie.active {
  background-image: none !important;
}

.top__opakis__moive__inner {
  background: url("../images/btn_youtubeButton_off.png") center no-repeat;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.top__opakis__moive__inner:hover {
  background: url("../images/btn_youtubeButton_on.png") center no-repeat;
}

.top__making {
  zoom: 1;
  background-color: #00aae7;
  box-sizing: border-box;
  color: #fff;
  float: left;
  position: absolute;
  top: 630px;
  left: 0;
  width: 630px;
  height: 315px;
}

.top__making:before, .top__making:after {
  content: "";
  display: table;
}

.top__making:after {
  clear: both;
}

.top__making__block {
  box-sizing: border-box;
  float: left;
  width: 315px;
  height: 315px;
}

.top__making__block img {
  width: 100%;
}

.top__making__block--title {
  padding-top: 57px;
  padding-left: 27px;
}

.top__making__a {
  display: block;
}

.top__making__a:hover .top__making__title {
  color: #fff600;
}

.top__making__a:hover .top__making__subtitle {
  color: #fff600;
}

.top__about {
  float: left;
  padding-top: 57px;
  padding-left: 27px;
  width: 315px;
  height: 315px;
}

.top__about__a {
  color: #000;
  display: block;
}

.top__about__a:hover .top__about__title {
  color: #00aae7;
}

.top__about__a:hover .top__about__subtitle {
  color: #00aae7;
}

.top__recruit {
  background-color: #00aae7;
  color: #fff;
  float: left;
  padding-top: 56px;
  padding-left: 26px;
  width: 315px;
  height: 315px;
}

.top__recruit__a {
  display: block;
}

.top__recruit__a:hover .top__recruit__title {
  color: #fff600;
}

.top__recruit__a:hover .top__recruit__subtitle {
  color: #fff600;
}

.top__people {
  color: #fff;
  float: left;
  position: absolute;
  top: 1260px;
  left: 0;
  width: 630px;
  height: 630px;
  z-index: 0;
}

.top__people__block {
  float: left;
  width: 315px;
  height: 315px;
}

.top__people__block img {
  width: 100%;
}

.top__people__block--title {
  background-image: url("../images/bg_people.jpg");
  background-repeat: no-repeat;
  background-position: left top;
  background-size: 100%;
  box-sizing: border-box;
  padding-top: 56px;
  padding-left: 25px;
}

.top__people__a {
  color: #fff;
  display: block;
}

.top__people__a:hover .top__people__title {
  color: #fff600;
}

.top__people__a:hover .top__people__subtitle {
  color: #fff600;
}

.top__people__a:hover .top__people__item__hover {
  background-image: url("../images/img_onmouse.png");
  background-repeat: no-repeat;
  background-size: 100% auto;
}

.top__people__inner {
  position: relative;
}

.top__people__item__triangle {
  background-image: url("../images/icon_triangle.png");
  background-repeat: no-repeat;
  background-size: 100% auto;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.top__people__item__triangle2 {
  background-image: url("../images/icon_triangle2.png");
  background-repeat: no-repeat;
  background-size: 100% auto;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.top__people__item__hover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.top__talk {
  box-sizing: border-box;
  float: left;
  padding-top: 56px;
  padding-right: 20px;
  padding-left: 29px;
  margin-left: 945px;
  width: 315px;
  height: 315px;
}

.top__talk a {
  color: #000;
}

.top__talk a:hover .top__talk__header {
  color: #00aae7;
}

.top__talk__subtitle {
  letter-spacing: -0.05em;
  line-height: 1.4;
}

.top__talk__list {
  margin-top: 19px;
}

.top__talk__list__item {
  font-size: 87.5%;
  line-height: 1.4;
  margin-bottom: 5px;
}

.top__talk__list__item__date {
  display: block;
}

.top__talk__list__item__a {
  color: #000;
}

.top__talk__list__item__a:hover {
  color: #00aae7;
}

.top__talk__list__item__a:before {
  color: #00aae7;
  content: '\f138';
  font-family: FontAwesome;
  margin-left: 0px;
  margin-right: 5px;
}

.top__sns {
  position: relative;
  float: left;
  z-index: 0;
}

.top__sns__list {
  zoom: 1;
}

.top__sns__list:before, .top__sns__list:after {
  content: "";
  display: table;
}

.top__sns__list:after {
  clear: both;
}

.top__sns__list__item {
  background-color: #00aae7;
  float: left;
  position: relative;
  width: 315px;
  height: 315px;
}

.top__sns__list__item:first-child {
  margin-right: 630px;
}

.top__sns__list__item__inner {
  display: table;
  width: 100%;
  height: 100%;
}

.top__sns__list__item__a {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}

.top__sns__list__item__a:hover .fa-twitter {
  color: #fff600;
}

.top__sns__list__item__a:hover .fa-facebook {
  color: #fff600;
}

.fa-twitter {
  color: #fff;
  font-size: 400%;
}

.fa-facebook {
  color: #fff;
  font-size: 400%;
}

/*# sourceMappingURL=style.css.map */

.top__making__a:hover,
.top__opakis a:hover,
.top__extra__wrapper a:hover,
.top__making a:hover,
.top__people a:hover,
.top__talk a:hover,
.top__work a:hover,
.top__sns a:hover{ opacity:1;}