@charset "utf-8";
@import url('https://fonts.googleapis.com/earlyaccess/notosansjapanese.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');

/* フォント参考
font-family: ta-koigokoro, sans-serif;
font-weight: 400;
font-style: normal;

font-family: fot-tsukuaoldmin-pr6n, sans-serif;
font-weight: 300;
font-style: normal;

font-family: noto-sans-cjk-jp, sans-serif;
font-weight: 100;
font-style: normal; */

/* ローディング中のスタイル */
/* .wf-loading .font-adobe {
	opacity: 0;
} */

/* フォント読み込み完了後のスタイル */
/* .wf-active .font-adobe {
	opacity: 1;
	transition: opacity 0.3s ease;
} */

/* フォント読み込み失敗時のスタイル */
/* .wf-inactive .font-adobe {
	opacity: 1;
} */
* {
    padding: 0;
    margin: 0;
}
a{
  text-decoration: none;
  color:inherit;

}
ul,li{
  list-style: none;
}
.hide{display: none;}
body{
  font-family: noto-sans-cjk-jp, sans-serif;
  font-size: 16px;
  color: #42425e;
  letter-spacing: .1em;
  text-align: justify;
  font-weight: 300;
  font-feature-settings: "palt";
}
/* トップページ　メイン */
.pc{display: block;}
.sp{display: none;}
.header-area{display: flex; }
.header-logo{width: 300px; padding: 10px;}
.header-logo img{width: 100%;}
.ul-nav{
  display: flex;
  width: 250px;
  position: absolute;
  color: #42425e;
  font-size: 16px;
  left: 40%;
  justify-content: space-between;
}
.ul-nav li{width: 20%; writing-mode: vertical-lr; letter-spacing: 0.2em;}
.ul-nav li:before{
  display: inline-block; 
  content:''; 
  width: 2px; 
  height: 30px; 
  margin-bottom: 10px;
}
.btn-contact{
  position: fixed;
  display: flex; 
  background-color: #00a1e9; 
  width: 50px; 
  align-items: center; 
  justify-content: center;
  border-radius: 0px 20px 20px 0px;
  z-index: 500;
  top: 150px;
}

.btn-contact p{padding:50px 0; width: 30px; writing-mode: vertical-lr; color: #FFF;}

.main-title01 h1{
  font-size: 2.5vw;
  font-family: a-otf-ryumin-pr6n, serif;
  font-weight: 300;
  font-style: normal;
  position: absolute;
  padding:  20px 0px 20px 50px;
  width: 50%;
  background-color: #FFF;
  right: 0;
  top: 180px;
  z-index: 500;
  letter-spacing: 0.1em;
}
.main-title01 h1 span{color: #00a1e9;}
.top-view{margin-top: 170px;}
/* ----------------------------スライダー-------------------------------- */
.swiper {
  width: 100%;
  max-width: 100%;
  height: 600px;
  margin: 0 auto;
}

.swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* ナビゲーション共通 */
.swiper-button-prev,
.swiper-button-next {
  width: 30px!important;
  height: 30px!important;
  background-color: #FFF;
  border-radius: 50%;
  color: #fff;
  transition: background-color 0.3s, transform 0.3s;
}
/* 矢印のサイズ調整（Swiper標準アイコン） */
.swiper-button-prev::after,
.swiper-button-next::after {
  font-size: 15px!important;
  font-weight: bold;
}

/* 位置調整 */
.swiper-button-prev {
  left: 16px;
}

.swiper-button-next {
  right: 16px;
}

/* ホバー時 */
.swiper-button-prev:hover,
.swiper-button-next:hover {
  background-color: rgba(0, 0, 0, 0.75);
  transform: scale(1.1); 
}
/* ------------------------------------------------------------ */
/* ----------------------------ナビの傍線-------------------------------- */
#home-top .home .li-nav01:before{
  background-color: #00a1e9;
}
#company .home .li-nav02:before{
  background-color: #00a1e9;
}
#quality .home .li-nav03:before{
  background-color: #00a1e9;
}
#works .home .li-nav04:before{
  background-color: #00a1e9;
}
#recruit .home .li-nav05:before{
  background-color: #00a1e9;
}
#contact .home .li-nav06:before{
  background-color: #00a1e9;
}
/* ----------------------------ナビの傍線-------------------------------- */
/* ハンバーガー--------------------------------------------- */
.hamburger{
  display: none;
  position: fixed;
  /* border-radius: 50%; */
  background-color: #00a1d1; 
  text-align: center;
  top: 10px;
  right: 10px;
  width: 40px;
  height: 40px;
  cursor: pointer;
  transition: 0.5s;
  border: 1px solid #FFF;
  z-index: 999;
}
.inner_line {
  display: block;
  position: absolute;
  right: 10px;
  width: 20px;
  height: 3px;
  background-color: #000000;
  transition: 0.1s;
  border-radius: 4px;
}
.inner_line-0 {
  display: block;
  position: absolute;
  right: 10px;
  width: 20px;
  height: 3px;
  background-color: #FFF;
  transition: 0.1s;
  border-radius: 4px;
}
#line1 {
  top: 10px;
}
#line2 {
  top: 18px;
}
#line3 {
  bottom: 10px;
}

.in{
  transform: translateX(100%);
}
.line_1,.line_2,.line_3{
  background: #FFF;
}
.line_1 {
  /*-45度回転させる*/
  transform: rotate(-45deg);
  top: 18px!important;
}
.line_2 {
  opacity: 0;
}
.line_3 {
  /*45度回転させる*/
  transform: rotate(45deg);
  bottom: 18.8px!important;
}

.nav{
  position: fixed; 
  width: 100%; 
  background-color: rgba(0, 161, 209, 0.95); 
  height: 100vh;
  z-index: 900;
  transform: translateX(-100%);
  transition: ease .4s;
  display: flex;
  background-image: url(../images/nav-logo.png);
  background-repeat: no-repeat;
  background-position: bottom;
  background-size: contain;
}
.nav-active{transform: translateX(0);}
.ul-nav02{
  color: #fff;
  text-align: center;
  width: 80%;
  padding-top: 50px;
  margin-top: 100px;
  margin: 0 auto;
  font-size: 18px;
}
.ul-nav02 li{padding: 20px 0; border-bottom: 1px dotted #FFF;}

@media (max-width: 800px) {
  .hamburger{display: block;}
  .nav01{display: none;}
}

#top-about{margin-top: 200px;}
.container01{width: 80%;}
.top-2col-right{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.top-2col-img{width: 60%;}
.top-2col-img img{width: 100%;}
.top-2col-text{width: 35%;}
.top-2col-text h2{
  text-align: center;
  font-family: fot-tsukuaoldmin-pr6n, sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 1.5rem;
  line-height: 1.5;
}
.btn01{
  width: 200px; 
  background-color: #00a1d1; 
  color: #FFF;
  text-align: center;
  padding: 15px 0;
  font-weight: 500;
  border-radius: 10px;
  position: relative;
}
.margin50{margin: 50px auto;}
.margin-bottom50{margin-bottom:50px ;}
.margin-bottom200{margin-bottom:200px ;}
.btn01 p:after{content: '＞'; position: absolute; right: 10px;}
.btn_center { margin-left: auto; margin-right: auto;}
.top-title-img{
  display: flex;
  justify-content: flex-end;
}
.top-title-img-area{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 50%;
}
.big-title{
  font-family: noto-sans-cjk-jp, sans-serif;
  font-weight: 100;
  position: absolute; 
  right: 50px; 
  font-size: 8vw; 
  color: #c1c1ca;
  mix-blend-mode: multiply;
  opacity: 0.5;
  line-height: 1;
  z-index: 0;
}
.h2-recruit
{
  font-family: noto-sans-cjk-jp, sans-serif;
  font-weight: 100;
  text-align: center;
  font-size: 8vw; 
  color: #c1c1ca;
  mix-blend-mode: multiply;
  opacity: 0.5;
  line-height: 1;
  margin-left: 30%;
  margin-bottom: 100px;
}
.width50{width: 50%; margin: 0 auto;}
.sticky-container{height: auto;}
.sticky-item{
  display: flex;
  justify-content: end;
  align-items: center;
  position: sticky;
  top: 0;
  text-align: right;
  z-index: 0;
}
/* .sticky-img{width: 45%;} */
.sticky-reverse{justify-content: flex-start; text-align: left;}
.rinen-title,.suv-plan-title,.top-works-title
{width: 600px; margin: 0 auto 80px; text-align: center;}
.top-works-title{margin-bottom: 30px!important;}
.rinen-title h2,.top-works-title h2
{display: inline-block; text-align: center; border-bottom:2px solid #00a1d1; margin-bottom: 20px;}
.suv-plan-title h2{
   font-size: 2.5rem; 
   text-align: center; 
   font-family: fot-tsukuaoldmin-pr6n, sans-serif ;
   font-weight: 200;
   line-height: 1.3;
  }
.padding-bottom400{padding-bottom: 400px;}
.suv-plan-title h3{font-size: 1.5rem; font-weight: 300; margin-bottom: 20px;}
.rinen-title p,.suv-plan-title p
{text-align: justify;}
.article-2col{
  display: flex;
  align-items: center;
  column-gap: 50px;
  margin-bottom: 20px;
}
.article-2col-img{width: 45%;}
.article-2col-img img{width: 100%;}
.article-2col-text{width: 40%;}
.article-2col-text h3{
  position: relative;
  font-family: fot-tsukuaoldmin-pr6n, sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 3.5rem;
  line-height: 0.8;
}
.article-2col-text h3 span{
  position: absolute;
  font-family: ta-koigokoro, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.2rem;
  color: #00a1d1;
  transform: rotateZ(-15deg);
}
.col-reverse{flex-direction: row-reverse;}
.margin20{margin-top: 20px;}
.margin-100{margin-top: -100px;}
.title-reverse{justify-content: left;}
.big-title-reverse{
  left: 50px!important; 
}
.suv-plan-2col{width: 100%; display: flex; justify-content: space-between;}
.suv-quality-area,.suv-office-area
{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 45%; 
  height: 300px; 
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.suv-quality-area{background-image: url(../images/btn-bk-img01.jpg);}
.suv-office-area{background-image: url(../images/btn-bk-img02.jpg);}
.col3-area{display: flex; justify-content: space-between;}
.pos-relative{position: relative;}
.article-3col{width: 30%; text-align: center;}
.article-3col p{font-size: 1.2rem;}
.article-3col img{width: 100%;}
.width70{width: 70%; margin: 0 auto;}
.bak-img-css{
  width: 100%;
  background-image:url(../images/bk-img01.png) ;
  background-repeat: no-repeat;
  background-position: right;
  background-size: contain;
}
.width800{width: 800px; margin: 0 auto;}
.width800-02{width: 800px; margin: 0 auto;}
.item-01{width: 150px; opacity: 0.8;}
.contact02{
            width: 400px; 
            height: 400px; 
            border-radius: 50%; 
            margin: 100px auto; 
            background-color: #00a1e9;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            text-align: center;
            background-image: url(../images/con-img.png);
            background-repeat: no-repeat;
            background-size: cover;
          }
.r-btn02 img{width: 100%;}
.con-area02 img{display: block; margin: -40px auto 10px; width: 100px;}
.con-area02{color: #FFF; }
.con-area02 h2{display: inline-block; border-bottom: 2px solid #FFF;}
.p-tel{font-size: 2rem;}
.p-tel span{font-size: 1rem;}
.con-btn02{width: 200px; border: 1px solid #FFF; margin: 10px auto 0; border-radius: 5px;}
.con-btn02 a p{padding: 10px 0; position: relative;}
.con-btn02 a p:after{content: '＞'; position: absolute; margin-left: 10px;}
.con-img{display: inline-block;}
.footer-area{
  width: 100%;
  height: 500px;
  display: flex;
  flex-wrap: wrap;
}
.footer-info{
  width: 100%; 
  display: flex; 
  align-items: center; 
  text-align: center; 
  color: #FFF; 
  background-color: #00a1d1;
  text-align: center;
}
.footer-info-area{width: 500px; margin: 0 auto;}
.footer-info h2{font-weight: 500;}
.footer-info h3{font-size: 0.8rem; font-weight: 200;}
.footer-map{width: 50%;}
.border{border-bottom: 1px solid #FFF; margin: 10px 0; }
.footer-info p{font-weight: 200;}
.footer-map iframe{width: 100%; height:500px;}
.small-logo{width: 60px;}
.ul-footer{text-align: center; margin-top: 20px; display: flex; justify-content: center;}
.margin-top200{margin-top: 200px;}
.margin-top300{margin-top: 300px;}
/* ------------------------------------------------------------ */
@media (max-width: 800px) {
  .btn-contact{display: none;}
}

.sub-view01{
  width: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  align-items: center;
  height: 400px;
  justify-content: center;
  margin-top: 100px;
}
.sub-view-company{background-image: url(../images/company/sub-view-company.jpg);}
.sub-view-quality{background-image: url(../images/quality/sub-view-quality.jpg);}
.sub-view01 h1{font-size: 3rem; color: #FFF; text-align: center; font-weight: 400; line-height: 0.6;}
.sub-view01 h1 span{font-size: 1rem;  font-family: a-otf-ryumin-pr6n, serif;}
.sub-container{width: 80%; margin: 100px auto;}
.sub-container02{width: 80%; margin: 100px auto;}
.h2-title01{font-size: 1.8rem; text-align: center; border-bottom: 1px solid #00a1d1; color: #00a1d1;}
.width600{width: 600px; margin: 0 auto;}
.sub-con p{margin-top: 20px;}
.sub-con-img01{margin: 80px auto;}
.sub-con-img01 img{width: 100%;}
.sub-con02{border: 1px solid #00a1d1; padding: 50px 0;}
.sub-con02 h3{font-size: 2rem; color: #00a1d1; font-weight: 600; text-align: center;}
.sub-img-area{margin: 30px auto; width: 50%;}
.sub-img-area img{width: 100%;}
.sub-con-2col,.sub-con-2col02
{display: flex; align-items: center; flex-wrap: wrap; row-gap: 50px;}
.sub-con-2col{justify-content: space-between; margin: 50px auto;}
.sub-con-2col02{column-gap: 50px; margin: 100px auto;}
.sub-con-2col-item{display: flex; align-items: center; width: 45%; flex-wrap: wrap; }
.sub-con-2col-item img{width: 90%;}
.p-txt01{ width: 100%;}
.sub-con03{width: 100%; background-color: #d9f1f8; padding: 100px 0;}
.h2-title02{font-size: 2rem; text-align: center; color: #00a1d1;}
.dl-history{display: flex; border-left: 2px solid #00a1d1; flex-wrap: wrap; margin-top: 50px;}
.dl-history dt{width: 20%; padding: 10px 0; margin-left: 20px; position: relative;}
.dl-history dt:before{content: '●'; position: absolute; left: -26px; font-size: 1.2rem; color: #00a1d1;}
.dl-history dd{width: 70%; padding: 10px 0;}
.greeting{text-align: center; margin: 50px auto;}
.profile-area{
  background-color: #d9f1f8; 
  padding: 100px 0;
  background-image:url(../images/company/bk-company.jpg) ;
  background-position: right 30%;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: contain;
}
.width700-02{width: 700px;margin-left: 25%;}
.ul-profile{display: flex; flex-wrap: wrap; margin: 80px auto;}
.ul-profile dt{width: 30%; padding: 10px 0; border-bottom: 1px solid #00a1d1; color: #00a1d1;}
.ul-profile dd{width: 70%; padding: 10px 0; border-bottom: 1px solid #00a1d1;}
.h2-title03{font-size: 2rem; background-color: #00a1d1; width: 100%; text-align: center; color: #FFF; padding: 20px 0; font-weight: 300;}
.h3-title01{text-align: center; color: #00a1d1; font-size: 1.2rem; margin-top: 50px;}
.p-center{text-align: center;}
.map-area{margin: 50px auto;}
.map-area iframe{width: 100%; height: 650px;}
.width75{width: 75%; margin: 0 auto;}
.sub-con-2col-item02{width: 35%;}
.sub-con-2col-item02 img{width: 100%;}
.sub-con-2col-item03{width: 50%;}
.h2-title04{
  font-family:fot-tsukuaoldmin-pr6n, sans-serif;
  font-size: 2rem;
  line-height: 1.5;
  font-weight: 300;
  margin-bottom: 50px;
 }
 .sub-con-2col-item03{width: 45%;}
 .sub-con-2col-item03 img{width: 100%;}
 .h3-title02{line-height: 1.2; margin-bottom: 20px; margin-top: 10px;}
 .h3-title02 span{font-size: 0.8rem; font-weight: 200;}
 .licence-area{ background-color: #FFF; width: 70%; margin: 80px auto; padding: 30px 0;}
 .tbody-area{width: 70%; margin: 0 auto;}
 .tbody-area tbody tr{display: flex;}
 .tbody-area td{padding: 5px 0;}
 .td-bold{width: 100%; font-weight: 500; border-bottom: 1px solid #42425e;}
 .td-width01{width: 80%; }
 .td-width02{width: 20%; text-align: right;}
 .td-border{border-bottom: 1px solid #42425e;}
 .p-note{width: 100%; text-align: right; margin: 0 auto; font-size: 0.8rem;}
 .note02{margin-top: 30px;}
 .h2-title05{color: #00a1d1; margin-bottom: 30px;}
 .tbody-works{margin: 20px auto 50px; width: 80%; font-size: 1.1rem;}
  .tbody-works tbody tr{display: flex; justify-content: space-between;}
 .td-width03{width: 35%; padding: 10px 0; border-bottom: 1px dotted #42425e;}
 .td-width04{width: 65%; padding: 10px 0; border-bottom: 1px dotted #42425e; padding-left: 2%;}
 .td-width05{width: 35%; padding: 10px 0; background-color: #00a1d1; color: #FFF; text-align: center; font-size: 1rem;}
 .td-width06{width: 64%; padding: 10px 0; background-color: #00a1d1; color: #FFF; text-align: center; font-size: 1rem;}
 .works-btn-02{width: 80%; margin: 10px auto; text-align: center; color: #00a1d1;}
 .works-col3-area{display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 80px; width: 100%; row-gap: 40px;}
 .works-area01{width: 100%; display: flex; justify-content:space-between; padding: 50px 80px; background-color: #d9f4fb; flex-wrap: wrap;}
 .w-article-3col{width: 30%;}
 .w-article-3col img{width: 100%;}
 .h3-title06{width: 100%; text-align: center; font-size: 1.5rem; margin-bottom: 50px;}
 .works-area02,.works-area03{width: 48%; padding: 50px 0;}
.works-area02{background-color: #d8e1ee;}
.works-area03{background-color: #FFF7DF;}
 .w-article01{width: 55%; margin: 0 auto;}
 .w-article01 img{width: 100%;}
 .h4-title01{font-size: 1.2rem; font-weight: 500;}
 .sub-view-works{background-image: url(../images/works/sub-view-works.jpg);}
 .sub-view-recruit{width: 100%; margin-top: 100px;}
 .sub-view-recruit-img img{width: 100%;}
.sub-view-recruit-title{width: 70%; margin: -100px auto 0;}
 .sub-view-recruit-title h1{font-size: 0;}
 .sub-view-recruit-title img{width: 100%;}
 .h2-title06{font-size: 2.3rem; color: #00a1d1; line-height: 1.2; margin-bottom: 10px;}
 .rec-ul-col3{display: flex; justify-content: space-between; }
 .rec-ul-col3 li{width: 30%; text-align: center; color: #00a1d1; border: 1px solid #00a1d1; padding: 10px 0; margin-top: 50px; font-weight: 600;}
 .margin-top100{margin-top: 100px;}
 .rec-btn02-txt{position: relative; width: 100%; background-color: #00a1d1; padding: 30px 0; text-align: center; }
 .rec-btn02-txt h3{color: #FFF; margin-bottom: 10px;}
 .rec-btn02-txt h3 span{font-size: 1.5rem;}
 .rec-btn02-txt h3:after{content: '＞'; font-size: 2rem; position: absolute; right: 20px; font-weight: 200; top:60px;}
 .rec-btn02{width: 800px; position: relative; margin: 0 auto;}
 .rec-btn02:before{
  content: ''; 
  background-image: url(../images/recruit/rec-btn01-item.png); 
  width: 250px; 
  height: 250px; 
  position: absolute;
  z-index: 500;
  background-size: contain;
  left: -80px;
  top: -45px;
}
.rec-section02{
  margin-top: 200px;
  width: 100%;
  background-image:url(../images/recruit/rec-bk02.jpg) ;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  padding: 80px 0;
}
.rec-section02 h2{font-size: 2rem; color: #FFF; text-align: center; font-weight: 500; margin-bottom: 50px;}
.rec-section02-img{width: 800px; margin: 0 auto;}
.rec-section02-img img{width: 100%;}
.rec-section02-img p{font-size: 0.8rem; color: #FFF; text-align: right;}
.meta{display: none;}
.rec-col2{display: flex; justify-content: space-between; align-items: center; margin-top: 50px;}
.rec-col-txt{width: 50%;}
.rec-col-img{width: 40%;}
.rec-col-img img{width: 100%;}
.career01{margin-top: 100px;}
.career01 h3{text-align: center; font-size: 2rem;}
.career01 h4{text-align: center; font-size: 1.2rem; background-color: #ccecf6; padding: 10px 0; margin: 20px auto;}
.career01-img{margin-top: 100px;}
.career01-img img{width: 100%;}
.benefit{width: 100%; background-color: #ccecf6; padding: 100px 0;}
.ul-benefit{ margin-top: 50px; display: flex; flex-wrap: wrap; justify-content: space-between; row-gap: 30px;}
.ul-benefit li{
  font-size: 1.2rem;
  font-weight: 500;
  color: #00a1d1;
  width: 22%; 
  height: 75px; 
  text-align: center; 
  display: flex;
  align-items: center;
  background-color: #FFF;
  justify-content: center;
  flex-wrap: wrap;
}
.ul-benefit li span{width: 100%; font-size: 0.8rem; margin-top: -20px;}
.rec-voice{background-image: url(../images/recruit/rec-bk01.png); background-size: contain;}
.rec-voice02{margin-top: 100px;}
.h3-title04{text-align: center; font-size: 1.2rem; color: #00a1d1; border-bottom: 1px solid #00a1d1; margin-bottom: 30px;}
.p-name{ background-color: #00a1d1; color: #FFF; text-align: center; padding: 5px 0; margin-bottom: 30px;}
.h4-title02{font-size: 1.2rem; color: #00a1d1; margin-bottom: 20px;}
.p-title01{color: #00a1d1; margin-top: 30px;}
.p-bold{font-weight: 500;}
.rec-schedule{margin-top: 50px;}
.rec-schedule h3{color: #00a1d1; text-align: center; font-size: 1.2rem;}
.dl-schedule{margin: 50px auto; display: flex; justify-content: space-between; flex-wrap: wrap;}
.dl-schedule dt{width: 10%; padding: 5px 0; border-bottom: 1px dotted #00a1d1; color: #00a1d1;}
.dl-schedule dd{width: 90%; padding: 5px 0; border-bottom: 1px dotted #00a1d1;}
.requirement{background-color: #FFF; width: 80%; margin: 50px auto; padding: 50px 0;}
.h3-title05{text-align: center; color: #00a1d1; font-weight: 500; margin-bottom: 50px; font-size: 1.5rem;}
.dl-rec01{width: 800px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; font-size: 1.1rem;}
.dl-rec01 dt{width: 20%; padding: 10px 0; border-bottom: 1px dotted #00a1d1;}
.dl-rec01 dd{width: 80%; padding: 10px 0; border-bottom: 1px dotted #00a1d1;}
.rec-btn-area,.rec-btn-area02{display: flex; justify-content: center; flex-direction: column; align-items: center;}
.rec-btn-area{margin: 50px auto; }
.rec-btn-area02{margin: 10px auto; }
.p-note02{color: #e60012; margin-top: 10px;}
.p-info{text-align: center; font-size: 1.3rem; font-weight: 500;}
.rec-flow{text-align: center; margin-top: 100px;}
.rec-flow-area{margin: 50px auto;}
.rec-flow-con{border: 1px solid #00a1d1; padding: 20px 0; position: relative;}
.rec-flow-con h4{font-size: 1.5rem; color: #00a1d1; font-weight: 300;}
.rec-flow-con p{font-size: 1.5rem;}
.rec-arrow{margin: 30px auto;}
.h2-title07{font-size: 1.8rem; text-align: center; color: #00a1d1;}
.mcb{position: absolute; right: 5px; top: 9px;}
.sub-view-contact{background-image: url(../images/contact/sub-view-contact.jpg);}
.form-area{background-color: #ccecf6; margin: 80px auto 0; padding: 50px 0;}
.p-note03{text-align: center; font-size: 1.1rem;}
.dl-form{margin: 50px auto; display: flex; flex-wrap: wrap; justify-content: space-between; width: 800px;}
.dl-form dt{width: 25%; padding: 15px 0; border-bottom: 1px solid #42425e;}
.dl-form dd{width: 75%; padding: 15px 0; border-bottom: 1px solid #42425e;}
.input-area,.form-textarea{width: 100%; padding: 5px; font-size: 1.1rem; border: none;}
.form-textarea{height: 100px;}
.dl-form dt span{background-color: #e60012; color: #FFF; font-size: 0.8rem; padding: 3px; margin-left: 10px;}
.btn-form-contact-area{width: 200px; margin: 50px auto 0; position: relative;}
.btn-form-contact{ color: #00a1d1; width: 200px; padding: 10px; background-color: #FFF; border: 1px solid #00a1d1; border-radius: 5px;}
.btn-form-contact{cursor: pointer;}
.btn-form-contact-area:after{content: '＞'; position: absolute; top: 9px; right: 5px; color: #00a1d1;}
.p-contact{text-align: center; font-size: 2.5rem; color: #00a1d1; margin-top: 20px; font-weight: 800;}
.p-contact span{font-size: 1.8rem;}
.sp-2{display:none;}
.dl-works-02{
  display: flex; 
  justify-content: space-between; 
  margin: 100px auto 20px;
  width: 80%;
}
.P-title10{border-bottom: 1px solid #42425e; font-weight: 500;} 
.dl-licence{display: flex; flex-wrap: wrap; justify-content: space-between;}
.dl-licence dt{width: 80%; padding: 2px 0;}
.dl-licence dd{width: 20%; text-align: right; padding: 5px 0;}
.licence-area{width: 70%; margin: 50px auto;}
.licence-cms{width: 70%; margin: 0 auto;}
.dl-licence02 .dl-licence dt{ border-bottom: 1px solid #42425e; font-weight: 500;}
.dl-licence02 .dl-licence dd{ border-bottom: 1px solid #42425e;}
#tech02,#etc01,#etc02,#prom01{margin-top: 20px;}

.td-width-a1{width: 20%; padding: 10px 0; border-bottom: 1px dotted #42425e; font-size: 0.9rem;}
.td-width-a2{width: 60%; padding: 10px 0; border-bottom: 1px dotted #42425e; padding-left: 1%; font-size: 0.9rem;}
.td-width-a3{width: 20%; padding: 10px 0; border-bottom: 1px dotted #42425e; padding-left: 2%; font-size: 0.9rem;}
.td-width-a4{width: 19%; padding: 10px 0; background-color: #00a1d1; color: #FFF; text-align: center; font-size: 0.8rem;}
.td-width-a5{width: 60%; padding: 10px 0; background-color: #00a1d1; color: #FFF; text-align: center; font-size: 0.8rem;}
.td-width-a6{width: 19%; padding: 10px 0; background-color: #00a1d1; color: #FFF; text-align: center; font-size: 0.8rem;}

@media (min-width: 800.1px) {

.quality-intro .sub-con-2col-item03 {
	width: 55% !important;}
	
}

/* ------------------------------------------------------------ */
@media (max-width: 800px) {
body{font-size: 15px; line-height: 1.6;}
.pc{display: none;}
.sp{display: block;}
.header-area{height: 80px;}
.header-logo{width: 50%;}
.top-view{margin-top: 0;}
.main-title01 h1{
  font-size: 1.5rem; 
  writing-mode: vertical-rl; 
  width: 30%; 
  top: 80px; 
  padding: 0; 
  right: 0;
  font-feature-settings: 'pkna';
  padding-right: 10px;
  padding-left: 10px;}
.width50{width: 80%;}
#top-about{margin-top: 50px;}
.rinen-title, .suv-plan-title, .top-works-title{width: 100%; margin: 50px auto;}
.width800{width: 90%;}
.suv-quality-area, .suv-office-area{width: 100%; height: 100px;}
.suv-plan-2col{flex-wrap: wrap; row-gap: 20px;}
.top-2col-right{flex-wrap: wrap; flex-direction: column-reverse; row-gap: 30px;}
.top-2col-img{width: 100%;}
.top-2col-text{width: 100%;}
.container01{width: 80%; margin: 0 auto;}
.contact02{width: 250px; height: 250px;}
.footer-info-area{width: 80%;}
.margin50{margin: 30px auto;}
.btn01{margin: 0 auto;}
.sub-img-area{width: 80%;}
.sticky-item{position: static;}
.big-title{font-size: 3rem; right: auto; opacity: 1;}
.margin-top200{margin-top: 30px;}
.article-2col{flex-direction: column;}
.article-2col-img{width: 80%;}
.article-2col-text{width: 100%;}
.article-2col-text h3{text-align: center; font-size: 2rem;}
.article-2col-text h3 span{font-size: 2rem; margin-top: -50px; left: 0; bottom: 40px; opacity: 0.6;}
.padding-bottom400{padding-bottom: 0;}
.margin-bottom200{margin-bottom: 100px;}
.big-title-reverse{text-align: right; right: 0;}
.suv-plan-title h2{font-size: 1.5rem; color: #00a1d1;}
.suv-plan-title h3{font-size: 1.2rem; ;}
.margin-top300{margin-top: 30px;}
.col3-area{flex-direction: column; row-gap: 30px;}
.article-3col{width: 100%;}
.h2-recruit{font-size: 3rem; margin-left: auto; text-align: center; opacity: 1; margin-bottom: 10px;}
.item-01{position: absolute; margin-top: -80px; z-index: -5; width: 100px; margin-left: -20px;}
.p-tel{font-size: 1.2rem;}
.rec-sp-img{width: 100%; margin-top: 50px;}
.rec-sp-img img{width: 100%;}
.con-area02{margin-top: -50px;}
.con-area02 img{width: 50px; display: none;}
.ul-footer{flex-wrap: wrap;}
.ul-footer li{width: 30%; text-align: right;}
.sp-2{display: inline-block;}
.width600{width: 80%;}
.width700-02{width: 80%; margin: 0 auto;}
.sub-view01{margin-top:0;}
.profile-area{background-image: none; padding: 30px 0;}
.ul-profile{margin: 20px auto;}
.ul-profile dd,.ul-profile dt{width: 100%;}
.ul-profile dt{text-align: center; border-bottom: none; font-weight: 500;}
.sub-container{margin: 50px auto;}
.h2-title02{font-size: 1.3rem;}
.h2-title01{font-size: 1.3rem;}
.sub-con03{padding: 30px 0;}
.dl-history dt{width: 100%; font-weight: 500;}
.dl-history dd{margin-left: 30px; width: 100%;}
.h2-title03{font-size: 1.3rem;}
.width75{width: 80%;}
.map-area iframe{height: 400px;}
.sub-con-2col02{flex-direction: column; margin: 30px auto; row-gap: 20px;}
.sub-con-2col-item02{width: 100%;}
.sub-con-2col-item03{width: 100%;}
.h2-title04{font-size: 1.3rem; margin-bottom: 20px;}
.sub-con-2col{flex-direction: column;}
.sub-con-2col-item{width: 100%;}
.h3-title02{margin-bottom: 0;}
.width70{width: 100%;}
.licence-area{margin: 30px auto; width: 85%;}
.tbody-area{width: 90%;}
.td-width01{width: 80%; border-bottom: 1px dotted #c1c1ca;}
.td-width02{border-bottom: 1px dotted #c1c1ca;}
.tbody-area tbody tr{justify-content: space-between;}
.sub-view-quality{background-position:  20%;}
.sub-view-recruit{margin-top: 0;}
.h2-title06{font-size: 1.2rem;}
.rec-ul-col3{flex-direction: column; justify-content: center; align-items: center;}
.rec-ul-col3 li{width: 80%; margin-top: 30px;}
.width800-02{width: 80%;}
.margin-top100{margin-top: 30px;}
.rec-btn02{width: 80%; margin-top: 150px!important;}
.rec-btn02:before{width: 150px;height: 150px; left: 80px; top: -80px;}
.rec-btn02-txt{padding-top: 80px;}
.rec-btn02-txt h3:after{top:130px ;}
.rec-section02{margin-top: 50px;}
.rec-section02 h2{font-size: 1.5rem;}
.rec-section02-img{width: 70%;}
.rec-col2{flex-direction: column-reverse; row-gap: 20px;}
.rec-col-txt{width: 100%;}
.rec-col-img{width: 80%;}
.career01 h3{font-size:1.5rem ;}
.career01{margin-top: 30px;}
.career01 h4{font-size: 1.1rem;}
.career01-img{margin-top: 30px;}
.benefit{padding: 30px 0;}
.ul-benefit{row-gap: 15px;}
.ul-benefit li{width: 48%; font-size: 0.9rem; height: 50px;}
.ul-benefit li span{font-size: 0.5rem;}
.rec-voice02{margin-top: 30px;}
.dl-schedule{flex-direction: column;}
.dl-schedule dt{width: 100%; border-bottom: none;}
.dl-schedule dd{width: 100%;}
.p-name{font-size: 0.8rem;}
.requirement{width: 90%; margin-top: 30px; padding: 30px 0;}
.dl-rec01{width: 85%;}
.h3-title05{margin-bottom: 30px; font-size: 1.2rem;}
.dl-rec01 dt{width: 100%; text-align: center; color: #00a1d1;}
.dl-rec01 dd{width: 100%; font-size: 1rem;}
.p-note02{text-align: center;}
.p-info{font-size: 1rem;}
.h2-title07{font-size: 1.3rem;}
.rec-flow{margin-top: 30px;}
.rec-flow-con h4{font-size: 1.1rem;}
.rec-flow-con p{font-size: 1.1rem;}
.mcb{width: 100px; position: relative; top: inherit;}
.rec-btn02-txt h3 span{font-size: 1.2rem;}
.sub-con-img01{margin: 30px auto;}
.h2-title05{font-size: 1.2rem; margin-bottom: 10px;}
.tbody-works{width: 100%; font-size: 1rem;}
.tbody-works tr{flex-direction: column;}
.dl-works-02{width: 40%; flex-direction: column; margin: 10PX auto;}
.td-width03{width: 100%; color: #00a1d1; border-bottom: none; padding:10px 0 0px;}
.td-width04{width: 100%; padding-left: 0; padding: 0px 0 10px;}
.td-width05{width: 100%;color: #00a1d1; background-color: #FFF; border-bottom: 1px solid #42425e;}
.td-width06{width: 100%;color: #42425e; background-color: #FFF; }
.w-article-3col{width: 100%;}
.works-area01{width: 100%; padding: 30px 30px; row-gap: 50px;}  
.h3-title06{margin-top: 20px; margin-bottom: 20px;}
.sub-con p{margin-top: 5px;}
.works-area02{width: 100%;}
.works-area03{width: 100%;}
.w-article01{width: 80%;}
.licence-cms {width: 90%;}
.dl-licence dt{border-bottom: 1px dotted #c1c1ca;}
.dl-licence dd{border-bottom: 1px dotted #c1c1ca;}
.sub-container02{width: 100%;}
.dl-form{width: 85%; flex-direction: column;}
.dl-form dt{width: 100%; text-align: center; border-bottom: none;}
.dl-form dd{width: 100%; }
.p-note04{text-align: center;}
.p-contact{font-size: 1.3rem;}
.p-contact span{font-size: 1rem;}
}