@charset "UTF-8";
/*====================================
　早見表
  $conts-width
  $color-yellow  $color-blue
  $font-color-black
  $font-family-gothic  $font-family-mincho

  full-width
  flex-column  flex-center
  media(320px ＝ xs   480px ＝ s   768px ＝ m   1000px ＝ l)
  fs(max,1000～768px,768～480px,480～320px,min)  fs2(max,min)
  mt(max,min) mb mtb  pt pb ptb

====================================*/
/*====================================

/*----------------------------------
  Structure
----------------------------------
1. トップ
  1.1	メインイメージ
  1.2 トップナビ
2. お問い合わせ
3. 見出し

====================================*/
/*----------------------------------
	SETTING
------------------------------------*/
/*  画像調整 */
.img-adjust {
  width: 100%; }

.img-h-adjust {
  height: 100%;
  object-fit: cover; }

/*　タイトル　*/
.ttl-style01 {
  font-size: auto-px(20, 18, 480);
  font-weight: 500;
  border-bottom: 7px solid #83b0c1;
  line-height: 2;
  margin-bottom: 4rem;
  text-align: center;
  width: 240px;
  margin: 0 auto 40px; }
  @media screen and (max-width: 768px) {
    .ttl-style01 {
      margin: 0 auto 20px; } }

.ttl-style02 {
  font-size: auto-px(20, 18, 480);
  font-weight: 500;
  background-color: #83b0c1;
  color: #000;
  text-align: center;
  padding: 10px 0;
  width: 190px;
  margin: 0 auto 30px; }

.title-style03 {
  font-size: 28px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 1px; }

.h-style_border {
  border-bottom: 1px solid #333; }

.in-page-title {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center; }
  .in-page-title .page-title__text {
    color: #fff;
    background-color: #336699;
    text-align: center;
    width: 240px;
    margin: 0 auto;
    padding: 20px 0;
    font-size: auto-px(20, 18, 480);
    font-weight: 500; }
    .in-page-title .page-title__text span {
      display: block;
      font-size: auto-px(16, 13, 480);
      font-weight: 400; }

.company .in-page-title {
  background-image: url(../images/bg-pg__company.jpg); }

.works .in-page-title {
  background-image: url(../images/bg-pg__works.jpg); }

.recruit .in-page-title {
  background-image: url(../images/bg-pg__recruit.jpg); }

.contact .in-page-title {
  background-image: url(../images/bg-pg__contact.jpg); }

/*　ボタン　*/
.btn-style01 {
  width: 180px;
  background-color: #000;
  padding: 10px 0;
  text-align: center; }
  .btn-style01 a {
    display: block;
    color: #fff;
    text-decoration: none;
    background-image: url(../images/icon-arrow.svg);
    background-size: 20px;
    background-position: 10px center;
    background-repeat: no-repeat; }

.btn-style02 {
  display: block;
  font-size: auto-px(18, 16, 480);
  background-color: #317979;
  color: #fff;
  margin: 0 auto;
  padding: 20px 0;
  width: 180px;
  text-align: center; }
  .btn-style02:hover {
    color: #fff;
    background-color: #317979a1;
    text-decoration: none; }

/*　テキスト　*/
p {
  font-size: auto-px(16, 14, 480);
  font-feature-settings: "palt";
  line-height: 1.7; }

.txt-l {
  font-size: auto-px(30, 24, 480); }

/*　flex　*/
.align-items-c {
  align-items: center; }

@media print, (min-width: 768px) {
  .list-style01 {
    display: flex;
    flex-wrap: wrap;
    border-bottom: 1px solid #ddd; }
    .list-style01 dt {
      width: 20%;
      text-align: center;
      display: flex;
      flex-direction: column;
      justify-content: center;
      border-top: 1px solid #ddd; }
    .list-style01 dd {
      width: 80%;
      border-right: 1px solid #ddd;
      display: flex;
      flex-direction: column;
      justify-content: center;
      border-top: 1px solid #ddd; } }
.list-style01 dt {
  box-sizing: border-box;
  padding: 1.8em;
  margin: 0px;
  background-color: #e2e2e2;
  color: #000; }
.list-style01 dd {
  box-sizing: border-box;
  padding: 1.8em;
  margin: 0px;
  background-color: #bbd4dd; }
  @media screen and (max-width: 767px) {
    .list-style01 dd {
      border: 1px solid #ddd;
      border-top: none; }
      .list-style01 dd .ul {
        text-align: left; } }

/*----------------------------------
	COMMON
------------------------------------*/
.bnr-wrap__wh {
  color: #fff;
  display: block;
  transition: all 0.5s 0s ease; }
  .bnr-wrap__wh:hover {
    opacity: 0.7;
    transition: all 0.5s 0s ease; }

.bnr-set__v01 .img {
  line-height: 0; }
  .bnr-set__v01 .img img {
    width: 100%; }
.bnr-set__v01 .txt {
  text-align: center;
  background-color: #00000063;
  padding: 20px 0; }
  .bnr-set__v01 .txt h3 {
    margin-bottom: 10px;
    display: block;
    background-image: url(../images/icon-arrow.svg);
    background-size: 20px;
    background-position: 36% center;
    background-repeat: no-repeat; }

.bnr-set__v02 .img {
  line-height: 0; }
  @media (max-width: 768px) {
    .bnr-set__v02 .img {
      margin-bottom: 0px !important; } }
  .bnr-set__v02 .img img {
    width: 100%; }
.bnr-set__v02 .txt {
  text-align: center;
  background-color: #003366;
  padding: 20px 0;
  box-sizing: border-box; }
  .bnr-set__v02 .txt .center-box02__cell {
    width: 80%; }
    @media (max-width: 768px) {
      .bnr-set__v02 .txt .center-box02__cell {
        position: relative;
        margin-bottom: 0px !important; } }
    .bnr-set__v02 .txt .center-box02__cell h3 {
      margin-bottom: 10px;
      padding-bottom: 30px;
      display: block;
      border-bottom: 1px solid #fff;
      letter-spacing: 1em;
      font-size: auto-px(28, 22, 480);
      font-weight: 400; }
    .bnr-set__v02 .txt .center-box02__cell p {
      margin: 0;
      font-size: auto-px(16, 14, 480); }

.box-set__v01 .img {
  line-height: 0; }
  @media (max-width: 768px) {
    .box-set__v01 .img {
      margin-bottom: 0px !important; } }
  .box-set__v01 .img img {
    width: 100%; }
.box-set__v01 .txt {
  text-align: center;
  background-color: #e2e2e2;
  padding: 20px 0;
  box-sizing: border-box; }
  .box-set__v01 .txt .center-box02__cell {
    width: 80%; }
    @media (max-width: 768px) {
      .box-set__v01 .txt .center-box02__cell {
        position: relative;
        margin-bottom: 0px !important; } }
    .box-set__v01 .txt .center-box02__cell h3 {
      margin-bottom: 20px;
      font-size: auto-px(22, 18, 480);
      font-weight: 500; }

/*----------------------------------
	PAGE::TOP
------------------------------------*/
/* トップのスライドショー */
.full .slide {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 100vh;
  margin: 0; }
  .full .slide.main01 {
    background-image: url(../images/pg-top__slide01.jpg); }
  .full .slide.main02 {
    background-image: url(../images/pg-top__slide02.jpg); }
  .full .slide.main03 {
    background-image: url(../images/pg-top__slide03.jpg); }
.full .slick-dots {
  bottom: 4%;
  z-index: +1; }

/* トップのメインビジュアル */
.inpage-mainimg.page-title {
  background: url("../images/pg-bg.jpg") no-repeat center center;
  background-size: cover;
  height: 280px; }

.page-title {
  position: relative; }
  .page-title .page-title__text {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
    text-align: center;
    width: 40%;
    padding: 4rem 0;
    font-size: auto-px(28, 24, 480);
    font-weight: 500;
    color: #fff;
    letter-spacing: .2em;
    line-height: 1.6;
    background-color: #00000023; }
    @media (max-width: 1000px) {
      .page-title .page-title__text {
        width: 100%; } }
    .page-title .page-title__text span {
      display: block; }

.inpage-mainimg .page-title__text {
  top: 75%; }

.home .sect01 p {
  margin: 0 auto;
  max-width: 700px; }
  @media screen and (max-width: 480px) {
    .home .sect01 p {
      width: 96%;
      margin: auto; } }

/*----------------------------------
	PAGE::WORKS
------------------------------------*/
.work-box {
  background-color: #e2e2e2;
  padding: 20px;
  margin-bottom: 30px; }
  .work-box .work-box__in {
    width: 98%;
    margin: 0 auto; }
    .work-box .work-box__in .txt {
      padding-top: 70px; }
      @media screen and (max-width: 768px) {
        .work-box .work-box__in .txt {
          padding-top: 0px; } }
      .work-box .work-box__in .txt .ttl {
        font-size: 18px;
        margin-bottom: 20px; }

/*----------------------------------
	PAGE::CONTACT
------------------------------------*/
.contact .sect01 {
  text-align: center; }
  .contact .sect01 .tel-box {
    font-size: auto-px(24, 20, 480); }
    .contact .sect01 .tel-box span {
      display: block;
      font-size: auto-px(16, 14, 480); }

/*----------------------------------
	PAGE::RECRUIT
------------------------------------*/
@media screen and (max-width: 480px) {
  .recruit .sect01 p {
    width: 96%;
    margin: auto; } }

/*----------------------------------
	0. アニメーション
------------------------------------*/
.scroll-fade {
  transform: translate3d(0, -10px, 0);
  transition: 1s;
  opacity: 0; }

.scroll-fade.animated {
  transform: translate3d(0, 0, 0);
  opacity: 1; }