@charset "UTF-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);

.forPc {
  display: block;
}
.forSp {
  display: none;
}

@media screen and (max-width: 767px) {
  .forPc {
    display: none;
  }
  .forSp {
    display: block;
  }
}

html {
  visibility: hidden;
}
html.wf-active, html.loading-delay {
  visibility: visible;
}

body {
	font-family:'Noto Sans Japanese', sans-serif;
   font-display: swap;
  min-width:1080px;
font-size: 14px;
    line-height: 1.42857143;
    color: #333;
    background-color: #fff;
}

/* header */
#header .inner {
	padding:10px 20px;
	display:flex;
  display: flex;
  /* justify-content: center; */
  align-items: center;
}
#header .inner .logo {
  margin-bottom:0;
}
#header .inner .gnav {
	margin-left:auto;
  display:block;
}
#header .inner .gnav ul {
	display:flex ;
  margin-bottom:0;
}
#header .inner .gnav ul li {
	padding:0 10px;
}
#header .inner .gnav ul li a {
	color:#333;
	text-decoration:none;
}
#header .inner .gnav ul li a {
  position: relative;
  display: inline-block;
  text-decoration: none;
}
#header .inner .gnav ul li a::after {
  position: absolute;
  bottom: -10px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #009844;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: transform .3s;
}
#header .inner .gnav ul li a:hover::after {
  transform: scale(1, 1);
}

#top_info{
  background:#eee;
  text-align:center;
  padding:30px 0;
  font-family: "Yu Mincho", "YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN",'Noto Serif JP', serif;
  font-weight: 400;
  font-style: normal;
  font-size:30px;
  letter-spacing:2px;
}

.main_img {
  position:relative;
  z-index:0;
}
.main_img .img{
  overflow:hidden;
}
.main_img .txt_wrap .block {
    position: absolute;
    top: 17vw;
    left: auto;
    right: auto;
    text-align: center;
    margin: 0 auto;
    width: 100%;
}
.main_img .txt_wrap .block p {
color:#fff;
font-size:16px;
margin-top:15px;
letter-spacing:2px;
}
.main_img .img img {
  width:100%;
}

.news {
  width:1080px;
  margin:0 auto;
  display:flex;
  padding:18px 20px 20px;
align-items: center;
}
.news_txt {
  border-right:1px solid #000;
  margin-right:20px;
  padding-right:20px;
  font-style:italic;
  font-weight:bold;
}
.news_list .date {
  margin-right:20px;
}
.news_list li {
  margin-bottom:0;
}
.news_btn {
  margin-left:auto;
  margin-bottom:0;
}

.group {
  position:relative;
  background:url(../../images/top_img01.png) no-repeat;
  background-size:cover;
  background-position: bottom;
  height:500px;
}
.group_img img {
  width:100%;
}
.group .inner {
  width:1080px;
  margin:0 auto;
  padding:120px 0;
}
.group .inner .box {
  background: rgba(255,255,255,0.7);border-radius:7px;
  width:600px;
  padding:40px 0;
  margin:0 auto;
}
.group .inner .box .group_ttl {
font-size:22px;
text-align:center;
line-height:1.5;
margin-bottom:15px;
font-weight:bold;
}
.group .inner .box  .group_txt {
font-size:16px;
text-align:center;
}
.group_ico {
  position:absolute;
}
.ico_01 {
  left:80px;
  bottom:20px;
}
.ico_01 .img_02 {
  position:absolute;
  bottom:20px;

}
.ico_02 {
  left:180px;
  bottom:0;
}
.ico_03 {
  right:180px;
  bottom:0;
}
.ico_04 {
  right:80px;
  bottom:0;
}
.group_ico span {
  position:relative;
}


.txt_h2 {
font-size:70px;
font-style:italic;
}
.txt_h2_reed {
  margin-bottom:10px;
}
.txt_reed {
  font-size:18px;
}
.aws {
  margin-top: 150px;
}
.works {
  position:relative;
  padding:40px 0 64px;
  background:#f2f2f2;
  overflow:hidden;
}
.works_wrap {
  margin-top:100px;
}
.works_wrap > div:last-child {
  margin-bottom: 24px;
}
.works_wrap:after {
  content: ".";
  display: block;
  height: 0;
  font-size:0;
  clear: both;
  visibility:hidden;
}

.works_box {
  position:relative;
  margin-bottom:-100px;
}
.works_box.right {
  display:flex;
  justify-content: flex-end;
}
.works_box.center {
  display: flex;
  justify-content:center;
}
.works_inner {
  display:flex ;
  position:relative;
/*   width:1080px;
  margin:0 auto; */
}
.works_aws-box {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/*splash start*/
.works_box div.img{
    background-size: 100%;
}
.works_box div.img img{
    opacity: 1;
	/*transition: opacity 1s ease-out;
    transition-delay: 2s;*/
}
.aws div.img {
  margin-top: 96px;
  margin-bottom: 24px;
}
.aws div.img img {
  max-width: 240px;
}
.works_box.sej .img{
    background-image: url('/images/top_works01_20230406.png');
}
.works_box.ah .img{
    background-image: url('/images/top_works04_1_20230406.png');
}
.works_box.loft .img{
    background-image: url('/images/top_works02.png');
}
/*splash end*/

.works_anime.right .works_inner .img{
	margin-right: 20px;
}
.works_anime.right .works_inner .img.splash{
	margin-left: -20px;
}
.works_box.right .works_inner {
  right:0;
  justify-content: flex-end;
  /*padding-right:20px;*/
  padding-left:0;
}
.works_txt {
  padding-left:20px;
}
.works_txt--aws {
  padding-left: 0;
}
.works_box .img {
  margin-bottom:-50px;
}
.works_box .img.splash {
    position: absolute;
    top: 0;
    opacity: 1;
    transition: opacity 1s ease-out;
    transition-delay: 2s;
}

.works_box.left .img.splash{
    left:0;
}
.works_box.right .img.splash{
    right:0;
}

.works_anime.right .works_box .img.splash {
    right: 20px;
}
.works_ttl {
  font-size:40px;
  font-weight:bold;
  border-bottom:2px solid #000;
  margin-bottom:15px;
  padding-bottom:15px;
}
.works_box.left:after {
position:absolute;
top: 80px;
left:0;
z-index:-1;
border-radius:0 10px 10px 0;
width:57%;
box-shadow:5px 5px 60px 0px rgba(174,174,174,0.4);
}

.works_box .works_txt02 {
    margin-bottom: 15px;
    font-size: 16px;
    color: #000;
    font-weight: bold;
}

.works_box.right:after {
  position:absolute;
top: 80px;
right:0;
z-index:-1;
border-radius:10px 0 0 10px;
width:57%;
box-shadow:5px 5px 60px 0px rgba(174,174,174,0.4);
}

.sej:after {
display:block;
content:"";
height:200px;
background:#319e61;

}
.loft:after {
display:block;
content:"";
height:200px;
background:#f8d43f;
}
.ah:after {
display:block;
content:"";
height:200px;
border-radius:0 10px 10px 0;
background:#e8303f;
}
.all:after {
display:block;
content:"";
height:200px;
border-radius:0 10px 10px 0;
background:#53a7d1;
}
.works .txt_reed {
  padding:0 15px;
}
.recruit {
  position:relative;
}

.recruit .recruit_txt {
  position:absolute;
  top:40px;
  left:150px;
}
.recruit .recruit_txt .txt_reed,
.recruit .recruit_txt .btn_radius {
  display:table-cell;
}

.btn_radius a {
  display:inline-block;
  text-align:center;
  border:2px solid #000;
  padding:3px 30px 3px 20px;
  border-radius:19px;
  color:#000;
  position:relative;
  font-size:12px;
  font-weight:bold;
  text-decoration:none;
}
.btn_radius a:after {
  content:"→";
  display:block;
  position:absolute;
  right:10px;
  top:-2px;
  font-size:18px;
}
.btn_radius a:hover {
  text-decoration:none;
}
.btn_radius a:hover:after {
  text-decoration:none;
-webkit-animation: arrow .6s cubic-bezier(.6,0,0,1);
animation:arrow .6s cubic-bezier(.6,0,0,1);

}
@keyframes arrow {
  from {
    -webkit-transform: translate3d(-100%, 0, 0) ;
    transform: translate3d(-100%, 0, 0) ;
    opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;

  }
}

@-webkit-keyframes arrow {
  from {
    -webkit-transform: translate3d(-100%, 0, 0) ;
    transform: translate3d(-100%, 0, 0) ;
    opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;

  }
}

.sec {
  position:relative;
}
.sec_txt {
  position:absolute;
  color:#fff;
  top:40px;
  right:150px;
}
.sec_txt p {
  text-align:right;
}
.sec_txt .btn_radius a {
  color:#fff;
  border-color:#fff;
}


/* footer */
#footer {
  background:#1e1e1e;
  color:#fff;
  padding:50px 0;
}
#footer a {
  color:#fff;
}
#footer .inner {
  width:1080px;
  margin:0 auto;
  padding:0 20px;
}
.foot_list {
  display:flex;
  justify-content:         space-between;

  margin-bottom:50px;
}
.foot_list ul {
  margin-bottom:0;
}
.foot_list li {
  margin-bottom:10px;
  font-size:16px;
}
.foot_list .ttl {
  font-size:20px;
  /*font-weight:bold;*/
}
.foot_list02 {
  display:flex;
  justify-content:center;
  margin-bottom:50px;
  font-size:16px;
}
.foot_list02 li {
  padding:0 20px;
  position:relative;
}
.foot_list02 li:after {
  display:block;
  content:"";
  border-right:1px solid #fff;
  position:absolute;
  width: 1px;
  height: 10px;
  right:0;
  top: 6px;
}
.foot_list02 li:last-child:after {
  display:none;
}
.foot_list03 {
  display:flex;
  justify-content:center;
  margin-bottom:50px;
}
.foot_list03 li{
  padding:0 20px;
}
#footer .copy {
  text-align:left;
  float:left;
  font-size:11px;
  line-height:1.6;
}
#footer .copy_wrap {
    overflow: hidden;
    clear: both;
}
#footer .copy_wrap .hd {
    float:right;
}
#footer .copy_wrap .hd img {
  width:40px;
}
.notimg_content {
  padding:80px 0;
}

/* Not Found
---------------*/
#not-found h2.ttl.align-c {
    font-size: 80px;
    font-weight: bold;
    color: #ccc;
}

#not-found p.leed.align-c {
    font-size: 40px;
}

#not-found .inner > p {
    max-width: 1040px;
    margin: 0 auto;
    padding: 35px;
    font-size: 18px;
    line-height: 2em;
    background: #f2f2f3;
}

@media screen and (max-width: 767px) {
body {
  min-width:auto;
}
body.fix{
	position: fixed;
  width:100%;
  overflow:hidden;
}

/* header */
#header.fix {
  position:fixed;
  width:100%;
  background:#fff;
  z-index:10;
}
#header.fix + #content {
  position:relative;
  top:57px;
  z-index:-1;
}
#header .inner {
	display:block;
	text-align:center;
	position:relative;
  padding:10px 15px;
}
#header .inner .gnav {
    width: 90%;
    height: 100%;
    transition: all 0.4s;
    transform: translate(-100%);
    position: fixed;
    left: 0;
    z-index: 10;
    background-color: #fff;
    /*padding-left:25px;*/
}
#header .inner .gnav.open {
 transform: translate(0);
 z-index:10000 !important;
}
#nav_btn {
  position: absolute;
  top:17px;
  left:16px;
  height: 24px;
  width: 24px;
  display: inline-block;
  box-sizing: border-box;
}
#nav_btn,
#nav_btn span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}
#nav_btn {
  /* position: relative; */
  width: 22px;
  height: 18px;
}
#nav_btn span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: #444;
  border-radius: 4px;
}
#nav_btn span:nth-of-type(1) {
  top: 0;
}
#nav_btn span:nth-of-type(2) {
  top: 8px;
}
#nav_btn span:nth-of-type(3) {
  bottom: 0;
}


#nav_btn.active span:nth-of-type(1) {
  -webkit-transform: translateY(20px) rotate(-45deg);
  transform: translateY(7px) rotate(-45deg);
}
#nav_btn.active span:nth-of-type(2) {
  opacity: 0;
}
#nav_btn.active span:nth-of-type(3) {
  -webkit-transform: translateY(-20px) rotate(45deg);
  transform: translateY(-8px) rotate(45deg);
}
#header .inner .gnav ul {
	display:inherit;
  padding-top:10px;
}
#header .inner .gnav ul li {
	padding:0 20px;
	text-align:left;
	background: #f2f2f3;
}
#header .inner .gnav ul li:nth-child(even) {
	background: #fff;
}
#header .inner .gnav ul li a {
	padding:15px 0;
}
.main_img .txt_wrap {
    top: 40vw;
}
.main_img .txt_wrap img {
  width:80%;
}
.group .inner .box .group_ttl {
  padding:0 15px;
  font-size:4.5vw;
}
.group_txt {
  padding:0 15px;
}
.nav.open {
    transform: translate(0);
}

#top_info{
  font-size:4vw;
}

.news {
    width: auto;
    display: block;
    padding: 18px 15px;
    align-items: center;
    position:relative;
}
.news_txt {
  border:none;
  margin-bottom:10px;
}
.news_btn {
  position:absolute;
  right:15px;
  top:16px;
}
.group .inner {
  width:100%;
  padding:60px 0;
}
.group .inner .box {
  width:90%;
}
.group_ico img {
  width: calc(100% / 1.5);
}
.ico_01 {
  left:6vw;
}
.ico_02 {
  left:23vw;
}
.ico_03 {
  right:23vw;
}
.ico_04 {
  right:2vw;
}
.aws {
  margin-top: 0;
}
.works_wrap {
  margin-top:50px;
}
.works .txt_reed {
  padding:0 15px;
}
.works_inner {
  width:100%;
  padding:0;
}
.works_inner .img {
  width:30%;
  margin-bottom:0;
}
.works_inner .img img {
  width:100%;
}
.works_txt {
  width:60%;
}
.works_ttl {
  padding-right: 6vw;
  font-size:5.2vw;
  margin-bottom:10px;
  padding-bottom:10px;
}
.works_box .works_txt02 {
  font-size:3.5vw;
  margin-bottom: 2vw;
}
.aws .works_box .works_txt02 {
  letter-spacing: 0.03em;
}
.works_box {
  margin-bottom:20px;
}
.works_box.left:after,
.works_box.right:after {
  width:95%;
  height:29vw;
  top:11vw;
}
.works_box.right .works_inner {
  right:0;
    justify-content: flex-end;
}

.works_box.right .works_inner .works_txt {
  padding-left:44px;
}
.works_box.aws .works_inner .works_txt {
  padding-left: 0;
}

.aws div.img {
  margin: 15vw 0 6.4px;
}

.recruit .recruit_txt {
  top:2vw;
  left:3vw;
}
.recruit .recruit_txt .txt_reed,
.recruit .recruit_txt .btn_radius {
  display:block;
  margin-bottom:15px;
}
.recruit .recruit_txt .btn_radius {
    position: absolute;
    right: 5vw;
    top: 13vw;
}
.sec_txt {
  top:2vw;
  right:3vw;
}
/* footer */
#footer .inner {
  width:100%;
}
#footer .inner li {
  border-bottom:1px solid #fff;
  display:none;
}
#footer .inner .foot_list02 li {
  display:block;
  margin-bottom:10px;
}
#footer .inner li.ttl {
  display:block;
}
.foot_list {
  display:block;
  margin-bottom:0;
}
.foot_list li a {
  display:block;
  padding-bottom:10px;
  margin-left:15px;
  position:relative;
}
.foot_list li a:after {
content:"";
display:block;
position:absolute;
right:  0;
top: 7px;
width: 12px;
height: 12px;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.foot_list li.ttl a {
  margin-left:0;
}
.foot_list02 {
  display:block;
}
.foot_list02 li  {
  padding:0;
  margin-bottom:5px;
}
.foot_list02 li a {
  padding-bottom:10px;
  position:relative;
  display:block;
}
.foot_list02 li a:after {
content:"";
display:block;
position:absolute;
right:  0;
top: 7px;
width: 12px;
height: 12px;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.foot_list .ttl {
  font-size:18px;
}
.foot_list02 li:after {
  display:none;
}
#footer .inner .foot_list02 li:last-child {
  border-bottom:none;
}
#footer .inner .foot_list03 li {
  border-bottom:none;
}
#footer .copy {
  font-size:11px;
  float:none;
}
#footer .copy_wrap .hd {
  float:none;
  margin-top:10px;
}
.foot_list li {
  font-size:14px;
}
.foot_list .ttl {
  font-size:16px;
  /*font-weight:bold;*/
}

.txt_h2 {
  font-size:10vw;
}
/* Not Found
---------------*/
#not-found .head h2.ttl{
    font-size: 45px;
}
#not-found p.leed.align-c {
    font-size: 28px;
}

#not-found .inner > p {
    padding: 20px;
    font-size: 16px;
}
#header .inner .gnav ul li a {
  display:block;
}
#header .inner .gnav ul li a::after {
display:none;
}
table colgroup {
  display:none;
}
}

.fontItalic {
  font-style:italic;
}
.officer_name {
  font-family: ro-nikkatsu-sei-kai-std, serif;
font-weight: 400;
font-style: normal;
}

/* pagetop */
#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 20px;
  bottom: 100px;
  z-index:10;
  background:#fff;
  display:none;
}
#page_top a{
    display:  inline-block;
    color: #000;
    text-decoration:  none;
    border: 2px solid #000;
    position:  relative;
    height: 50px;
    width: 50px;
}
#page_top a::before{
    content:  '';
    width: 15px;
    height: 15px;
    display:  block;
    border-top: solid 2px;
    border-right: solid 2px;
    transform: rotate(-45deg);
    position:  absolute;
    top: 7px;
    bottom:  0;
    left:  0;
    right:  0;
    margin:  auto;
}
/* Loading 02
---------------*/
@media screen and (max-width: 767px) {
#page_top{
  bottom: 50px;
}
}

@keyframes album {
  0% {
    opacity: 0;
  }

  12.5% {
    opacity: 1;
  }

  37.5% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}
@-webkit-keyframes album {
  0% {
    opacity: 0;
  }

  12.5% {
    opacity: 1;
  }

  37.5% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}
/* .ico_01 img {
  animation-name: album;
  animation-duration: 10s;
  animation-iteration-count: infinite;
  opacity: 0;
} */

.ico_01 .img_02 {
  animation-delay:5s;
}

.advanced {
  margin-top: 80px;
  max-width: 580px;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .advanced {
    margin-top: 16vw;
    max-width: 75%;
  }
}

.advanced__img {
  max-width: 104px;
}
@media screen and (max-width: 767px) {
  .advanced__img {
    max-width: none;
  }
}
.advanced__img img {
  width: 100%;
}

.advanced__txt {
  margin-left: 40px;
  max-width: 400px;
  font-weight: bold;
  text-align: left;
}
@media screen and (max-width: 767px) {
  .advanced__txt {
    margin-left: 8%;
    max-width: 60%;
  }
}

.advanced__mainTxt {
  margin-left: -8px;
  padding-left: 16px;
  font-size: 16px;
  border-left: 3px solid #fa0;
}
@media screen and (max-width: 767px) {
  .advanced__mainTxt {
    font-size: 3vw;
  }
}

.advanced__subTxt {
  margin-top: 24px;
  font-size: 14px;
}
@media screen and (max-width: 767px) {
  .advanced__subTxt {
    margin-top: 2vw;
    font-size: 2.4vw;
  }
}

.aws_ttl {
  position: relative;
}

.aws_ttl:after {
  content: "";
  position: absolute;
  margin-left: 28px;
  width: 64px;
  height: 54px;
  background: url(/images/AWS_logo_RGB.png) no-repeat bottom center / contain;
}

@media screen and (max-width: 767px) {
  .aws_ttl:after {
    margin-left: 3.64vw;
    width: 8.32vw;
    height: 6.92vw;
  }
}

@media screen and (max-width: 767px) {
  .works_txt--aws {
    width: 75%;
  }
}