@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300&family=Spartan:wght@400;500;600&display=swap');

/* 共通
------------------------------------------------------------*/
html {
}
body {
  text-align: center;
  overflow-x: hidden;
}
.pc {
  display: block !important;
}
.sp {
  display: none !important;
}
.wrapper {
  position: relative;
  width: 100%;
  background: #fff;
}

/* more */
a.more {
  padding: 0 0 3px 45px;
  background: linear-gradient(currentColor, currentColor) right 100px center / 25px 1px no-repeat;
  transition: all .4s;
  text-decoration: none;
  color: #000;
}
a.more:hover {
  opacity: 1;
  background: linear-gradient(currentColor, currentColor) right 100px center / 10px 1px no-repeat;
}



/*メニュー
***********************************************************/
.menu-btn {
  padding: 30px;
  display: block;
}
#menu {
  position: fixed;
  top: 32px;
  right: 30px;
  z-index: 99999;
}
#menu a {
  display:block;
  box-sizing: border-box;
    opacity: 1 !important;
}
.menu-trigger,
.menu-trigger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}
.menu-trigger {
  position: relative;
  width: 30px;
  height: 21px;
  display:block;
}
.menu-trigger span {
  position: absolute;
  right: 0;
  width: 100%;
  height: 1px;
  background: #595656;
  text-align: right;
}
.menu-trigger span:nth-of-type(1) {
  top: 0;
  right: 0;
  width: 80%;
}
.menu-trigger span:nth-of-type(2) {
  top: 10px;
  width: 60%;
  right: 0;
}
.menu-trigger span:nth-of-type(3) {
  bottom: 0;
  right: 0;
}
.menu-trigger.active span:nth-of-type(1) {
  -webkit-transform: translateY(10px) rotate(-45deg);
  transform: translateY(10px) rotate(-45deg);
  background: #fff;
  width: 100%;
}
.menu-trigger.active span:nth-of-type(2) {
  opacity: 0 !important;
}
.menu-trigger.active span:nth-of-type(3) {
  -webkit-transform: translateY(-10px) rotate(45deg);
  transform: translateY(-10px) rotate(45deg);
  background: #fff;
}
.menu-btn {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 200;
}
.menu {
    position: fixed;
    display: table;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-width: 100%;
    min-height: 100%;
    -webkit-transition: all .5s;
    transition: all .5s;
    visibility: hidden;
    opacity: 0;
  background: #fff;
    z-index: 100;

}
.menu .menuInner {
  margin: 0 auto;
  padding: 0 30px;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}
.menu .menuInner ul {
  letter-spacing: 2px;
}
.menu .menuInner ul li {
  margin: 30px 0 0;
}
.menu .menuInner ul li:first-child{
  margin: 0;
}
.menu .menuInner ul li a {
  font-size: 18px;
  color: #5a5757;
  text-decoration: none;
  font-family: 'Spartan';
  font-weight: 500;
}
.menu .menuInner ul li ul {
  padding:  20px 0;
  text-align: center;
  /*text-align: left;
  width: 170px;*/
}
.menu .menuInner ul li ul li {
  margin: 20px auto 0;
  line-height: 1;
}
.menu .menuInner ul li ul li a {
  margin: 0;
  padding: 0;
  font-size: 12px;
  font-weight: 400;
}
.menu .menuInner ul.icon_ul {
  margin: 50px auto 0;
  width: 100px;
  display: -webkit-box;
  display: flex;
  justify-content: center;
  align-items: center;
}
.menu .menuInner ul li.nav-project {
  background: -moz-linear-gradient(left,  #69d3eb 0%, #f6c5b8 45%, #dbc43a 100%);
  background: -webkit-linear-gradient(left,  #69d3eb 0%,#f6c5b8 45%,#dbc43a 100%);
  background: linear-gradient(to right,  #69d3eb 0%,#f6c5b8 45%,#dbc43a 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: all .4s;
  display: inline-block;
}
.menu .menuInner ul.icon_ul li:first-child {
  margin: 0;
  width: 28px;
}
.menu .menuInner ul.icon_ul li:last-child {
  margin: 0;
  width: 32px;
}
.menu .menuInner p:last-child {
  margin: 30px auto 0;
  padding: 10px 0 0;
  width: 200px;
}
.menu .menuInner ul.other_ul {
  margin: 40px auto 0;
  padding: 0;
  font-size: 12px;
  font-weight: 400;
}
.menu .menuInner ul.other_ul li {
  margin: 20px auto 0;
  line-height: 1;
}
.menu .menuInner ul.other_ul li a {
  padding: 3px 17px;
  font-size: 12px;
  background: url(/common/images/obj_blank.png) no-repeat top right/10px auto;
}


/* 開閉用ボタンがクリックされた時のスタイル */
.open .menu {
    cursor: url(/common/images/cross.svg),auto;
    -webkit-transition: all .5s;
    transition: all .5s;
    visibility: visible;
    opacity: 1;
}



/* header
***********************************************************/
header {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 100;
}
h1 {
  width: 160px;
}
.header-inner {
  padding: 30px;
  box-sizing: border-box;
  display: -webkit-box;
  display: flex;
  flex-wrap: nowrap;
  -webkit-box-pack: justify;
  justify-content: space-between;
  align-items: center;
  background: #fff;
}
.header-right ul {
}
.header-right ul li {
  margin-right: 36px;
  display: inline-block;
  font-weight: 500;
}
.header-right ul li a {
  color: #000;
  letter-spacing: 2px;
  text-decoration: none;
}
.header-right ul li.nav-project {
  background: -moz-linear-gradient(left,  #69d3eb 0%, #f6c5b8 45%, #dbc43a 100%);
  background: -webkit-linear-gradient(left,  #69d3eb 0%,#f6c5b8 45%,#dbc43a 100%);
  background: linear-gradient(to right,  #69d3eb 0%,#f6c5b8 45%,#dbc43a 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: all .4s;
}
.header-right ul li.nav-project:hover {
  opacity: 0.5;
}
.header-right ul li.nav-project:hover a {
  opacity: 1;
}
.header-right ul li.nav-icon01 {
  margin-right: 20px;
  width: 23px;
}
.header-right ul li.nav-icon02 {
  margin-right: 0;
  width: 20px;
}




/* footer
***********************************************************/
footer {
  padding: 3vw 0 2vw;
  background: #5a5757;
}
footer p:first-child {
  margin: 0 auto;
  width: 129px;
}
footer ul.footernav {
  margin: 0 auto;
  padding: 2vw 0 0;
  max-width: 740px;
  display:flex !important;
  justify-content: space-between;
  align-items: flex-start;
}
footer ul.footernav li.level2 {
  position: relative;
}
footer ul.footernav li a {
  color: #fff !important;
  font-size: 13px;
  text-decoration: none;
  font-family: 'Spartan';
  font-weight: 500;
}
footer ul.footernav li {
  display: block !important;
}
footer ul.footernav ul {
  margin: 6px 0 0;
  position: absolute;
  display: block !important;
  text-align: left;
  width: 200px;
}
footer ul.footernav ul li {
  margin: 6px 0 0 0;
}
footer ul.footernav ul li a {
  color: #fff !important;
  font-size: 10px;
  text-decoration: none;
  font-weight: 400;
  letter-spacing: 0;
}
footer ul.footernav li.nav-icon01 {
  width: 23px;
}
footer ul.footernav li.nav-icon02 {
  margin-right: 0;
  width: 20px;
}
footer p:last-child {
  padding: 5vw 0 0;
  color: #b8b7b7 !important;
  font-size: 10px;
  text-decoration: none;
  font-weight: 400;
  text-align: center;
}
footer p {
  font-size: 10px !important;

}
footer p a {
  color: #fff !important;
  text-decoration: none !important;
  font-size: 10px !important;
}



/*改行調整
***********************************************************/
@media screen and (min-width:1401px) {
.br2::before {
  content: "\A" ;
  white-space: pre ;
}
}



/*全体（1400px以下）
***********************************************************/
@media screen and (max-width:1400px) {

/* 共通 */
.br::before {
  content: "\A" ;
  white-space: pre ;
}


}



/*全体（1300px以下）
***********************************************************/
@media screen and (max-width:1300px) {


}


/*全体（1000px以下）
***********************************************************/
@media screen and (max-width:1000px) {


}


/*全体（820px以下）
***********************************************************/
@media screen and (max-width:820px) {

/* 共通 */
.wrapper {
  overflow-x: hidden; /* 何故かモバイルサイズの時に横に余白発生のため */
}
a {
  opacity: 1 !important;
}
ul,p,dl,label,input {
}
.pc {
  display: none !important;
}
.sp {
  display: block !important;
}
.header-right {
  display: none;
}

a.more {
  padding: 0 0 0 45px;
}
.recruit_wrapper {
  margin: 32vw auto 0;
  padding: 0 20px;
}

/* header */
.header-inner {
  padding: 20px 20px;
}

/* menu */
.menu-btn {
  padding: 25px 20px 0;
}
#menu {
  top: 26px;
  right: 20px;
}


/* footer */
footer {
  padding: 9vw 30px 6vw;
}
footer .footernav.pc {
  display: none !important;
}
footer p:first-child {
  margin: 0 auto;
  width: 104px;
}
footer .footernav {
  padding: 6vw 0 0;
  display:flex !important;
  justify-content: space-between;
  align-items: flex-start;
  text-align: left;
}
footer .footernav ul:first-child {
  width: 60%;
  text-align: left;
}
footer .footernav ul:last-child {
  width: 40%;
  text-align: left;
}
footer .footernav li {
  margin: 10px 0 0;
  display: block !important;
}
footer .footernav li.level2 {
  position: relative;
}
footer .footernav li a {
  color: #fff !important;
  font-size: 12px;
  text-decoration: none;
  font-family: 'Spartan';
}
footer .footernav ul ul {
  margin: 6px 0 0;
  position: absolute;
  display: block !important;
  text-align: left;
  width: 200px !important;
}
footer .footernav ul ul li {
  margin: 3px 0 0 0;
}
footer .footernav ul ul li a {
  color: #fff !important;
  font-size: 10px;
  text-decoration: none;
  font-weight: 400;
  letter-spacing: 0;
}
footer .footernav li.nav-icon01 {
  width: 23px;
}
footer .footernav li.nav-icon02 {
  margin-right: 0;
  width: 20px;
}
footer p:last-child {
  padding: 12vw 0 0;
  color: #b8b7b7 !important;
  font-size: 10px;
  text-decoration: none;
  font-weight: 400;
  text-align: center;
}
footer ul.nav-icon  {
  margin: 0 auto 0 !important;
  padding: 20vw 0 0 !important;
  display:flex !important;
  justify-content: center;
  align-items: center;
  width: 70px;
}
footer ul.nav-icon .nav-icon01 {
  width: 24px;
}
footer ul.nav-icon .nav-icon02 {
  width: 20px;

}

}