@charset "utf-8";
/*
Theme Name: tsubame
Theme URI: https://niigatainsatsu.co.jp/tsubame_making

フォント一覧：
font-family: 'Noto Sans JP', sans-serif;　（ゴシック）
font-family: 'Roboto', sans-serif;　（英文）
font-family: "Roboto Condensed", sans-serif;　（英文：細身）
font-family: "Great Vibes", cursive;　（筆記体）
font-family: "Zen Old Mincho", serif;　（明朝）
*/

/*-----------------------------------------------
　基本設定
--------------------------------------------------*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

h4{
  display: inline;
}

html{
  font-family: 'Noto Sans JP', sans-serif;
  scroll-behavior: smooth;
  overflow-x: hidden;
}

body {
  font-size: 14px;
  font-weight: 400;
  line-height: 1.8;
  letter-spacing: 0.08em;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

nav ul, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

a {
  text-decoration: none;
  color: #000;
}
a.anchor {
  display: block;
  padding-top: 80px;
  margin-top: -80px;
}

*, *:before, *:after {
    box-sizing: border-box;
}

:root {
  --main-color1: #0091db;
  --main-color2: #0f2c64;
  --main-color3: #ed7a94;
  --text-color: #4b4b4b;
  --font-size-L: clamp(2.4rem, calc(2.2rem + 0.625vw), 2.9rem);
}

::selection {
  background-color: #cdedfd;
}


/*-----------------------------------------------
　共通設定
--------------------------------------------------*/
/*-- 大枠 --*/
.general{
  width: 100vw;
  min-width: 1000px;
  margin-top: -65px;
  color: var(--text-color);
}
/*-- //大枠 --*/

/*-- 共通ボタン --*/
.tubame__btn{
  position: relative;
  width: fit-content;
  margin-top: 60px;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 16px;
  font-weight: 700;
  z-index: 5;
}
.tubame__btn a{
  display: inline-block;
  padding-left: 70px;
  color: var(--main-color1);
  transition: all .3s ease-in-out;
}
.tubame__btn a:hover{
  color: var(--main-color2);    
}
.tubame__btn span{
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%) translateX(0);
  width: 60px;
  height: 60px;
  background-color: #fff;
  border: 1px solid var(--main-color1);
  border-radius: 50%;
  transition: all .3s ease-in-out;
}
.tubame__btn:hover span{
  background-color: var(--main-color1);
  transform: translateY(-50%) translateX(0);
}
.tubame__btn span::before{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 16px;
  height: 2px;
  background: var(--main-color1);
}
.tubame__btn span::after{
  content: '';
  position: absolute;
  top: 50%;
  left: 55%;
  width: 10px;
  height: 10px;
  border-top: 2px solid var(--main-color1);
  border-right: 2px solid var(--main-color1);
  -webkit-transform: rotate(45deg);
  transform: translateY(-50%) translateX(-50%) rotate(45deg);
}
.tubame__btn:hover span::before{
  background: #fff;
  transform: translateY(-50%) translateX(-50%);
}
.tubame__btn:hover span::after{
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: rotate(45deg);
  transform: translateY(-50%) translateX(-50%) rotate(45deg);
}
/*-- //共通ボタン --*/

/*-- 共通見出し --*/
.common__headline{
  margin-bottom: 40px;
  font-size: 20px;
  font-weight: 700;
}
.common__headline p{
  font-family: "Roboto Condensed", sans-serif;
  font-size: 80px;
  font-weight: 700;
  color: var(--main-color1);
  line-height: 1;
}
/*-- //共通見出し --*/

/*-- 共通見出し2 --*/
.common__headline2{
  margin-bottom: 40px;
  font-size: 16px;
  font-weight: 500;
}
.common__headline2 h2{
  font-weight: 500;
}
.common__headline2 p{
  font-family: "Roboto Condensed", sans-serif;
  font-size: 50px;
  font-weight: 900;
  color: var(--main-color1);
  line-height: 1;
}
.common__headline2 span{
  margin-right: 15px;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--main-color1);
  line-height: 1;
}
/*-- //共通見出し2 --*/

/*-- 共通見出し --*/
.common__headline3{
  margin: 140px 0 40px;
  font-size: 16px;
  font-weight: 500;
}
.common__headline3 p{
  font-family: "Roboto Condensed", sans-serif;
  font-size: 55px;
  font-weight: 700;
  color: var(--main-color1);
  line-height: 1;
}
/*-- //共通見出し --*/

/*-- 共通ページタイトル --*/
.common_title__outer{
  position: relative;
  width: 100vw;
  height: 750px;
}
.common_title__outer::after{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 85%);
  background-color: #ebf6fc;
  z-index: -1;
}
.common_title{
  width: 1000px;
  margin: 0 auto 40px;
  padding-top: 80px;
  font-size: 20px;
  font-weight: 700;
}
.common_title p{
  font-family: "Roboto Condensed", sans-serif;
  font-size: 100px;
  font-weight: 900;
  color: var(--main-color1);
  line-height: 1;
}
.common_title__img{
  position: absolute;
  top: 250px;
  right: 0;
  width: 80%;
  height: 300px;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  overflow: hidden;
}
.common_title__img img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 100%;
  height: 300px;
  object-fit: cover;
}
.common_title__link{
  position: absolute;
  top: 470px;
  left: -1%;
  width: 30%;
  min-width: 400px;
  height: auto;
  padding: 20px 0;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  background-color: #fff;
  box-shadow: 0px 0px 15px -5px #b5b5b6;
}
.common_title__link ul{
  width: 100%;
  padding-left: 40%;
}
.common_title__link ul li{
  width: 100%;
}
.common_title__link ul li p{
  display: inline;
  margin-right: 20px;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--main-color1);
  vertical-align: middle;
}
.common_title__link ul li a{
  display: block;
  padding: 5px 0;
  font-size: 16px;
  font-weight: 500;
  color: var(--text-color);
  transition: all .2s ease-in-out;
}
.common_title__link ul li a:hover{
  color: var(--main-color1);
}
/*-- //共通ページタイトル --*/

/*-- 共通ページタイトル2 --*/
.common_title2__outer{
  position: relative;
  width: 100vw;
  height: 250px;
  margin: 65px 0 100px;
}
.common_title2__bg{
  position: absolute;
  width: 100vw;
  height: 250px;
}
/* 各背景画像 */
.bg_qa{
  background: url(img/common_titile2_bg_qa.jpg) no-repeat center center / cover;
}
.common_title2__title{
  width: 100%;
  height: 100%;
  background-color: rgba(0, 145, 219, 0.65);
  z-index: 2;
}
.common_headline2{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
}
.common_headline2 p{
  margin-bottom: 10px;
  padding-bottom: 10px;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 70px;
  font-weight: 700;
  line-height: 1;
}
/*-- //共通ページタイトル2 --*/


/*-----------------------------------------------
　トップページ
--------------------------------------------------*/
/*-- メインヴィジュアル --*/
.top__main_visual{
  position: relative;
  width: 100%;
  height: 100vh;
  min-height: 750px;
  overflow: hidden;
}
.top__titile{
  margin: 140px 0 0 2%;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 175px;
  font-weight: 900;
  line-height: 0.8;
  color: var(--main-color2);
}
.top__titile h2{
  font-weight: 900;
}
.top__titile p{
  margin: -20px 0 0 20%;
  font-family: "Great Vibes", cursive;
  font-size: 80px;
  font-weight: 300;
  color: var(--main-color1);
  transform: rotate(-5deg);
}
.top__subtitile{
  width: 1000px;
  margin: 80px auto 0;
  font-size: 32px;
  font-weight: 700;
  line-height: 1.5;
}
/*-- //メインヴィジュアル --*/

/*-- スライド設定 --*/
.top__slide {
  position: absolute;
  top: 0;
  right: 0;
  width: 50%;
  height: 100vh;
  display: flex;
  justify-content: space-between;
  z-index: -5;
}
.slide-wrap {
  width: 49.8%;
}
.slide-wrap.bottom {
  justify-content: flex-end;
}
.slide-wrap ul {
  display: flex;
  flex-direction: column-reverse;
  width: 100%;
}
.slide-wrap.top ul:first-child {
  animation: slideTop 100s -50s linear infinite;
}
.slide-wrap.top ul:last-child {
  animation: slideTop2 100s linear infinite;
}
.slide-wrap.bottom ul:first-child {
  animation: slideBottom 100s linear infinite;
}
.slide-wrap.bottom ul:last-child {
  animation: slideBottom2 100s -50s linear infinite;
}
.slide-wrap li {
  position: relative;
  width: 100%;
  height: 300px;
  margin-bottom: -42px;
  clip-path: polygon(0 15%, 100% 0, 100% 85%, 0 100%);
  overflow: hidden;
}
.slide-wrap li img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.slide-wrap.top li {
  width: 100%;
}
.slide-wrap.bottom li {
  width: 100%;
}

@keyframes slideTop {
  0% {
    transform: translateY(100%);
  }
  to {
    transform: translateY(-100%);
  }
}

@keyframes slideTop2 {
  0% {
    transform: translateY(0%);
  }
  to {
    transform: translateY(-200%);
  }
}

@keyframes slideBottom {
  0% {
    transform: translateY(-100%);
  }
  to {
    transform: translateY(100%);
  }
}

@keyframes slideBottom2 {
  0% {
    transform: translateY(-200%);
  }
  to {
    transform: translateY(0);
  }
}
/*-- //スライド設定 --*/

/*-- トップ　概要 --*/
.top_outline__outer{
  position: relative;
  width: 100vw;
  margin-top: -120px;
  padding-bottom: 100px;
  background-color: #e0f2fb;
  clip-path: polygon(0 7%, 100% 0, 100% 100%, 0% 100%);
}
.top_outline__textout{
  position: relative;
  width: 100vw;
  padding-top: 150px;
}
.top_outline__text{
  position: relative;
  width: 1000px;
  margin: 0 auto;
  font-size: 16px;
  font-weight: 700;
  line-height: 2;
  z-index: 4;
}
.top_outline__text p{
  margin-bottom: 20px;
  font-size: 28px;
  font-weight: 700;
  color: var(--main-color1);
  line-height: 1.8;
}
.top_outline__img{
  position: absolute;
  top: 0;
  right: 0;
  width: 350px;
  height: 410px;
  border-radius: 5px;
  overflow: hidden;
  z-index: 2;
}
.top_outline__img img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
}
.top_outline__copy{
  position: absolute;
  bottom: -100px;
  right: -1%;
  font-family: "Roboto Condensed", sans-serif;
  text-align: right;
  font-size: 170px;
  font-weight: 900;
  line-height: 0.8;
  color: #fff;
  z-index: 5;
}
/* 横スライド */
.top_outline__scroll{
  width: 100vw;
  margin-top: 140px;
}
@keyframes infinity-scroll-left {
  from {
    transform: translateX(0);
  }
    to {
    transform: translateX(-100%);
  }
}
.scroll-infinity__wrap {
  display: flex;
  overflow: hidden;
}
.scroll-infinity__list {
  display: flex;
  list-style: none;
  padding: 0
}
.scroll-infinity__list--left {
  animation: infinity-scroll-left 50s infinite linear 0.5s both;
}
.scroll-infinity__item {
  width: calc(100vw / 5);
  margin: 0 10px;
}
.scroll-infinity__item img {
  width: 100%;
}
/* 横スライド */
/*-- //トップ　概要 --*/


/*-- トップ　インタビュー --*/
.top_interview__outer{
  position: relative;
  width: 100vw;
  margin-top: 100px;
  padding-bottom: 60px;
}
.top_interview__outer::after{
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100vw;
  height: 50%;
  background-color: #e0f2fb;
  border-bottom-left-radius: 50%;
  border-bottom-right-radius: 50%;
  z-index: -2;
}
.top_interview__title{
  width: 1000px;
  margin: 0 auto;
}
.top_interview__btn{
  width: fit-content;
  margin: 0 auto;
}
/* スライダー */
.top_interview__inner{
  width: 150vw;
  margin-left: -25vw;
}
.slider {
  width: 100%;
  margin:0 auto;
}
.slider li a{
  display: block;
  transition: all .3s ease-in-out;
}
.slider li a:hover{
  opacity: 0.8;
}
.slider .slick-slide{
  margin: 0 40px !important;
}
.slider img {
   width:100%;
   height:auto;
}

/* コンテンツ装飾 */
.interview_box__outer{
  width: 100%;
}
.interview_box__department{
  display: inline-block;
  margin: 0 0 -25px 20px;
  padding: 5px 25px;
  font-size: 32px;
  font-weight: 700;
  color: var(--main-color1);
  background-color: #fff;
  border-radius: 5px;
}
.interview_box__img{
  position: relative;
  width: 100%;
  height: 250px;
  border-radius: 8px;
  overflow: hidden;
  z-index: -1;
}
.interview_box__img::after{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 145, 219, 0.2);
  transition: all .3s ease-in-out;
}
.slider li a:hover .interview_box__img::after{
  background-color: rgba(0, 145, 219, 0.1);
}
.interview_box__img img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 100%;
  height: 250px;
  object-fit: cover;
  transition: all .3s ease-in-out;
}
.slider li a:hover .interview_box__img img{
  transform: translateY(-50%) translateX(-50%) scale(1.1,1.1);
}
.interview_box__text{
  position: absolute;
  top: 50%;
  left: 5%;
  transform: translateY(-50%);
  font-size: 24px;
  font-weight: 900;
  color: #fff;
  z-index: 1;
}
.interview_box__name{
  width: 100%;
  margin-top: 10px;
  font-size: 25px;
  font-weight: 700;
  color: var(--text-color);
}
.interview_box__name p{
  display: inline;
  margin-left: 10px;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 12px;
  font-weight: 300;
}
/* //コンテンツ装飾 */

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/
.slider .slick-slide {
   margin:0 10px;
}

/* 矢印の設定 */
/* 戻る、次へ矢印の位置 */
.slick-prev, 
.slick-next {
  position: absolute;
  top: -80px;
  right: 0;
  width: 50px;
  height: 50px;
  background-color: var(--main-color1);
  border-radius: 50%;
  cursor: pointer;
  outline: none;
}
.slick-prev::after, 
.slick-next::after{
  content: '';
  position: absolute;
  top: 50%;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  height: 15px;
  width: 15px;
}
.slick-prev::after {
  left: 55%;
  transform: translateY(-50%) translateX(-50%) rotate(-135deg);
}
.slick-next::after {
  left: 45%;
  transform: translateY(-50%) translateX(-50%) rotate(45deg);
}
.slick-prev {
  right: 24%;
}
.slick-next {
  right: 20%;
}

/* ドットナビゲーションの設定 */
.slick-dots {
  text-align:center;
  margin: 30px 0 0 0;
}
.slick-dots li {
  display:inline-block;
  margin:0 5px;
}
.slick-dots button {
  color: transparent;
  outline: none;
  width: 100px;/*ドットボタンのサイズ*/
  height: 6px;/*ドットボタンのサイズ*/
  display: block;
  background: #bfe4f6;
  border: 0;
  cursor: pointer;
}
.slick-dots .slick-active button{
  background: var(--main-color1);/*ドットボタンの現在地表示の色*/
}
/* //スライダー */
/*-- //トップ　インタビュー --*/

/*-- トップ　ツバメ工業について --*/
.top_about__outer{
  position: relative;
  width: 100vw;
  margin-top: 140px;
}
.top_about__inner{
  display: flex;
  justify-content: space-between;
  width: 1000px;
  margin: 0 auto;
}
.top_about__btn{
  width: 50%;
}
.top_about__btn ul{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.top_about__btn ul li{
  width: 248px;
  height: 248px;
  overflow: hidden;
}
.top_about__btn ul li:nth-child(n + 3){
  margin-top: 4px;
}
.top_about__btn ul li a{
  display: block;
  width: 100%;
  height: 100%;
  transition: all .3s ease-in-out;
}
/* ホバー要素 */
.top_about__btn ul li a:hover .top_about__btn_img{
  background-color: rgba(0, 145, 219, 0.3);
}
.top_about__btn_img{
  position: relative;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 145, 219, 0.65);
  transition: all .3s ease-in-out;
}
.top_about__btn_text{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 100%;
  text-align: center;
  color: #fff;
}
.top_about__p1{
  font-family: "Roboto Condensed", sans-serif;
  font-size: 65px;
  font-weight: 900;
  line-height: 1;
}
.top_about__p2{
  position: relative;
  margin: -10px 0 10px;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 28px;
  font-weight: 700;
}
.top_about__p2::after{
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100px;
  border-bottom: 1px solid #fff;
}
.top_about__p3{
  font-size: 16px;
  font-weight: 700;
}
.top_about__bg1,
.top_about__bg2,
.top_about__bg3,
.top_about__bg4{
  position: relative;
}
.top_about__bg1::after{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 100%;
  height: 100%;
  background: url(img/top_about__bg1.jpg) no-repeat center center / cover;
  transition: all .3s ease-in-out;
  z-index: -1;
}
.top_about__bg2::after{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 100%;
  height: 100%;
  background: url(img/top_about__bg2.jpg) no-repeat center center / cover;
  transition: all .3s ease-in-out;
  z-index: -1;
}
.top_about__bg3::after{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 100%;
  height: 100%;
  background: url(img/top_about__bg3.jpg) no-repeat center center / cover;
  transition: all .3s ease-in-out;
  z-index: -1;
}
.top_about__bg4::after{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 100%;
  height: 100%;
  background: url(img/top_about__bg4.jpg) no-repeat center center / cover;
  transition: all .3s ease-in-out;
  z-index: -1;
}
.top_about__bg1:hover::after,
.top_about__bg2:hover::after,
.top_about__bg3:hover::after,
.top_about__bg4:hover::after{
  transform: translateY(-50%) translateX(-50%) scale(1.1, 1.1);
}
.top_about__text{
  width: 45%;
}
.top_about__img{
  position: absolute;
  bottom: 0;
  right: -1%;
  width: 47%;
  height: 335px;
  border-radius: 10px;
  overflow: hidden;
}
.top_about__img img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 100%;
  height: 335px;
  object-fit: cover;
}
.circle1{
  position: absolute;
  top: -100px;
  left: -330px;
  width: 750px;
  height: 750px;
  background-color: #f0f8fd;
  border-radius: 50%;
  z-index: -3;
}
.circle2{
  position: absolute;
  top: 120px;
  right: -150px;
  width: 500px;
  height: 500px;
  background-color: #f0f8fd;
  border-radius: 50%;
  z-index: -3;
}
/*-- //トップ　ツバメ工業について --*/

/*-- トップ　ワークスタイル --*/
.top_work__outer{
  position: relative;
  width: 1000px;
  margin: 140px auto 0;
}
.top_work__img1{
  position: absolute;
  top: 0;
  left: 45%;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  overflow: hidden;
}
.top_work__img2{
  position: absolute;
  top: 40%;
  right: 0;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  overflow: hidden;
}
.top_work__img1 img,
.top_work__img2 img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  height: 100%;
}
.circle3{
  position: absolute;
  top: 90px;
  left: 25%;
  width: 500px;
  height: 500px;
  background-color: #f0f8fd;
  border-radius: 50%;
  z-index: -3;
}
/*-- //トップ　ワークスタイル --*/

/*-- トップ　会社概要 --*/
.top_business__outer{
  position: relative;
  display: flex;
  justify-content: right;
  width: 100vw;
  margin-top: 140px;
}
.top_business__text{
  width: 45%;
}
.top_business__img{
  position: absolute;
  top: 0;
  left: -1%;
  width: 50%;
  height: 100%;
  border-radius: 10px;
  overflow: hidden;
}
.top_business__img img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 100%;
  height: 300px;
  object-fit: cover;
}
/*-- //トップ　会社概要 --*/

/*-- トップ　Q & A --*/
.top_qa__outer{
  width: 100vw;
  margin-top: 140px;
  padding: 60px 0;
  background-color: #f4f4f4;
}
.top_qa__inner{
  display: flex;
  justify-content: space-between;
  width: 1000px;
  margin: 0 auto;
}
.top_qa__title{
  color: var(--text-color) !important;
}
.top_qa__contents{
  width: 60%;
}
.top_qa__btn{
  width: fit-content;
  margin: -60px auto 0;
}
/*-- //トップ　Q & A --*/


/*-----------------------------------------------
　会社概要
--------------------------------------------------*/
/*-- 経営理念 --*/
.business_idea__outer{
  position: relative;
  width: 100vw;
  padding: 60px 0;
  background-color: #ededed;
  z-index: -2;
}
.business_idea__inner{
  width: 1000px;
  margin: 0 auto;
}
.business_idea__text{
  font-size: 28px;
  font-weight: 700;
  color: var(--main-color1);
}
.business_idea__img{
  position: absolute;
  bottom: 0;
  right: 5%;
  width: 460px;
}
.business_idea__img img{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: -1;
}
/*-- //経営理念 --*/

/*-- 会社概要 --*/
.business_outline__outer{
  position: relative;
  width: 100vw;
}
.business_outline__inner{
  width: 1000px;
  margin: 0 auto;
  padding: 80px 0;
}
.business_outline__list{
  width: 100%;
}
.business_outline__list th,
.business_outline__list td{
  padding: 25px 0;
  border-top: 1px dotted #9fa0a0;
}
.business_outline__list tr:last-of-type th,
.business_outline__list tr:last-of-type td{
  border-bottom: 1px dotted #9fa0a0;
}
.business_outline__list th{
  width: 20%;
  padding-left: 3em;
  text-align: left;
  font-weight: 400;
  vertical-align: middle;
}
.business_outline__list td{
  text-align: justify;
}
.business_outline__copy{
  position: absolute;
  top: -5px;
  left: -85px;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 140px;
  font-weight: 900;
  writing-mode: vertical-rl;
  white-space: nowrap;
  color: #f4f4f4;
  z-index: -10;
}
/*-- //会社概要 --*/

/*-- 組織図 --*/
.business_chart__inner{
  width: 1000px;
  margin: 40px auto;
}
.business_chart__inner img{
  width: 100%;
  margin-top: 30px;
}
/*-- //組織図 --*/

/*-- 代表メッセージ --*/
.business_message__outer{
  position: relative;
  width: 100vw;
  margin-top: 50px;
  padding: 80px 0;
  background-color: #ededed;
  z-index: -3;
}
.business_message__inner{
  width: 1000px;
  margin: 0 auto;
}
.business_message__text{
  line-height: 2.2;
}
.message__text1{
  margin-bottom: 20px;
  font-size: 20px;
  font-weight: 700;
  color: var(--main-color2);
}
.message__text2{
  display: inline;
  margin-right: 20px;
  font-size: 20px;
  font-weight: 700;
}
.message__img1{
  display: block;
  width: 600px;
  margin-bottom: 30px;
}
.message__img2{
  width: 150px;
  margin-left: 20px;
  vertical-align: middle;
}
.business_message__img{
  position: absolute;
  bottom: 0;
  right: 0;
  width: 450px;
  z-index: -1;
}
.business_message__img img{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}
/*-- //代表メッセージ --*/


/*-----------------------------------------------
　ワークスタイル
--------------------------------------------------*/
/*-- キャリアモデルケース --*/
.work_carrier__outer{
  width: 1000px;
  margin: 60px auto 0;
}
.work_carrier__inner{
  display: flex;
  justify-content: space-between;
  width: 100%;
}
.work_carrier__outer .work_carrier__inner:last-of-type{
  margin-top: 60px;
}
.work_carrier__img{
  position: relative;
  width: 45%;
}
.work_carrier__img img{
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  width: 200px;
}
.work_carrier__img_no{
  width: 50%;
  padding-bottom: 10px;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 32px;
  font-weight: 300;
  line-height: 1;
  border-bottom: 1px solid var(--text-color);
}
.work_carrier__img_no p{
  font-size: 80px;
  font-weight: 700;
}
.work_carrier__circle1{
  position: absolute;
  top: 30%;
  left: 10%;
  width: 260px;
  height: 260px;
  background-color: #e0f2fb;
  border-radius: 50%;
}
.work_carrier__circle2{
  position: absolute;
  top: 55%;
  right: 10%;
  width: 160px;
  height: 160px;
  background-color: #fdeff2;
  border-radius: 50%;
}
.work_carrier__text{
  width: 50%;
}
.work_carrier__text_title{
  width: 100%;
  margin-bottom: 20px;
  font-size: 25px;
  font-weight: 700;
  color: var(--main-color1);
}
.work_carrier__text_years{
  width: 100%;
  font-size: 22px;
  font-weight: 500;
}
.work_carrier__text_years p{
  display: inline;
  margin-left: 20px;
  font-size: 14px;
  font-weight: 300;
}
.work_carrier__text_years ul{
  width: 100%;
  margin: 20px 0;
}
.work_carrier__text_years ul li{
  position: relative;
  margin-bottom: 32px;
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 400;
  background-color: #e0f2fb;
}
.work_carrier__text_years ul li::after{
  content: '';
  position: absolute;
  bottom: -28px;
  left: 50%;
  transform: translateX(-50%);
  width: 30px;
  height: 30px;
  background-color: #e0f2fb;
  clip-path: polygon(50% 50%, 0 0, 100% 0);
}
.work_carrier__text_years ul li:last-of-type::after{
  display: none;
}
.text_years{
  display: inline-block;
  width: 20%;
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  color: var(--main-color1);
}
/*-- //キャリアモデルケース --*/

/*-- 職場環境 --*/
.work_place__outer{
  width: 1000px;
  margin: 100px auto;
}
.work_place__inner{
  width: 100%;
}
.work_place__inner ul{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 100%;
}
.work_place__inner ul li{
  width: 29.5%;
  text-align: justify;
}
.work_place__inner ul li:nth-child(n + 4){
  margin-top: 30px;
}
.work_place__img{
  position: relative;
  width: 100%;
  height: 200px;
  margin-bottom: 10px;
  overflow: hidden;
}
.work_place__img img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 100%;
}
.work_place__inner ul li h3{
  width: 100%;
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: 500;
}
.work_place__inner ul li p h3{
  font-size: 16px;
  font-weight: 400;
}
.work_office__outer{
  position: relative;
  width: 100%;
  padding: 60px 0;
  background-color: #e6e6e6;
  z-index: -3;
}
.work_office__inner{
  display: flex;
  justify-content: space-between;
  width: 1000px;
  margin: 0 auto;
}
.work_office__map{
  width: 40%;
}
.work_office__map_title{
  display: inline-block;
  padding: 8px 25px;
  font-size: 16px;
  font-weight: 500;
  color: #fff;
  background-color: var(--main-color1);
  border-radius: 2em;
}
.work_office__map img{
  width: 100%;
}
.work_office__ad{
  position: relative;
  width: 50%;
}
.work_office__ad ul{
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 100%;
}
.work_office__ad ul li{
  position: relative;
  width: 40%;
  font-size: 13px;
  font-weight: 300;
}
.work_office__ad ul li::after{
  content: '';
  position: absolute;
  top: -5px;
  left: -20px;
  width: 50px;
  height: 50px;
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 50%;
  z-index: -1;
}
.work_office__ad ul li p{
  width: 100%;
  margin-bottom: 10px;
  padding-bottom: 10px;
  font-size: 16px;
  font-weight: 500;
  color: var(--main-color2);
  border-bottom: 1px solid var(--main-color1);
}
.work_office__ad ul li h3{
  width: 100%;
  margin-bottom: 10px;
  padding-bottom: 10px;
  font-size: 16px;
  font-weight: 500;
  color: var(--main-color2);
  border-bottom: 1px solid var(--main-color1);
}
.work_office__ad ul li:nth-child(n + 3){
  margin-top: 30px;
}
/*-- //職場環境 --*/

/*-- 福利厚生 --*/
.work_welfare__outer{
  width: 1000px;
  margin: 100px auto 0;
}
.work_welfare__inner{
  width: 100%;
}
.work_welfare__outer .work_welfare__inner:last-of-type{
  margin-top: 60px;
}
.work_welfare__title{
  width: 100%;
  margin-bottom: 20px;
  padding: 10px 0;
  text-align: center;
  font-weight: 500;
  background-color: #dcdddd;
  border-radius: 2em;
}
.work_welfare__inner ul{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: center;
  width: 100%;
  margin-top: 10px;
}
.work_welfare__inner ul li{
  width: 21%;
  padding: 15px 0;
  text-align: center;
  font-weight: 500;
  border: 1px solid #b5b5b6;
  border-radius: 5px;
}
.work_welfare__inner ul li h4{
  font-weight: 500;
}
.work_welfare__inner ul li:nth-child(n + 5){
  margin-top: 30px;
}
.work_welfare__inner ul li p{
  font-size: 13px;
  font-weight: 300;
}
/*-- //福利厚生 --*/


/*-----------------------------------------------
　事業案内
--------------------------------------------------*/
/*-- 事業案内 --*/
.about__outer{
  position: relative;
  width: 100%;
  margin-bottom: 100px;
}
.about__inner{
  width: 1000px;
  margin: 0 auto;
}
.about__inner_text{
  width: 1000px;
  margin: 0 auto;
}
.about__inner_text p{
  display: block;
  margin-bottom: 20px;
  font-size: 25px;
  font-weight: 700;
  color: var(--main-color1);
}
.about__inner_img{
  position: absolute;
  top: 0;
  right: 0;
  width: 650px;
  max-width: 45%;
  height: 500px;
  overflow: hidden;
  clip-path: polygon(0 0, 100% 0, 100% 90%, 20% 100%);
  z-index: -1;
}
.about__inner_img img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 100%;
  height: 500px;
  object-fit: cover;
}
.about__inner_circle{
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 360px;
  height: 360px;
  background-color: #f0f8fd;
  border-radius: 50%;
  z-index: -2;
}
/*-- //事業案内 --*/

/*-- 部署紹介 --*/
.about_department__outer{
  position: relative;
  width: 100vw;
  margin-top: 150px;
  padding: 60px 0;
  background-color: #ebf6fc;
  z-index: -2;
}
.about_department__title{
  width: 1000px;
  margin: 0 auto 30px;
}
.about_department__inner{
  display: flex;
  justify-content: space-between;
  width: 1000px;
  margin: 0 auto 100px;
}
.about_department__text{
  width: 45%;
  text-align: justify;
  line-height: 2;
}
.about_department__name{
  position: relative;
  width: 100%;
  padding: 10px 0 10px 2em;
  font-size: 25px;
  font-weight: 500;
  color: var(--main-color1);
}
.about_department__name p{
  position: absolute;
  top: -40px;
  left: -10px;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 80px;
  font-weight: 900;
  color: #fff;
  z-index: -1;
}
.about_department__img{
  position: relative;
  width: 100%;
  overflow: hidden;
}
.department_img__right{
  margin-right: -50%;
  clip-path: polygon(7% 0, 100% 0, 100% 100%, 0 100%);
}
.department_img__right img{
  position: absolute;
  top: 50%;
  left: -15%;
  transform: translateY(-50%);
  width: 100%;
  height: auto;
  object-fit: cover;
}
.department_img__left{
  margin-left: -50%;
  clip-path: polygon(0 0, 93% 0, 100% 100%, 0 100%);
}
.department_img__left img{
  position: absolute;
  top: 50%;
  right: -15%;
  transform: translateY(-50%);
  width: 100%;
  height: auto;
  object-fit: cover;
}
/*-- //部署紹介 --*/


/*-----------------------------------------------
　インタビュー
--------------------------------------------------*/
.interview__title{
  position: relative;
  width: 100vw;
  height: 600px;
}
.interview__img{
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 600px;
  overflow: hidden;
}
.interview__img img{
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;
  min-height: 600px;
  object-fit: cover;
}
.interview__text_outer{
  position: relative;
  width: 1000px;
  height: 100%;
  margin: 0 auto;
}
.interview__text{
  position: absolute;
  bottom: 0;
  left: 0;
}
.interview__copy{
  margin-bottom: 20px;
  font-size: 38px;
  font-weight: 900;
  color: var(--main-color1);
}
.interview__name{
  margin-bottom: 30px;
  font-size: 30px;
  font-weight: 900;
}
.interview__department{
  display: inline;
  padding: 10px 25px;
  font-size: 35px;
  font-weight: 700;
  color: var(--main-color1);
  background-color: #fff;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
/*-- 内容 --*/
.interview_content__outer{
  width: 1000px;
  margin: 80px auto;
}
.interview_content__inner1{
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin-bottom: 50px;
}
.interview_content__img1{
  position: relative;
  width: 40%;
  min-height: 350px;
  border-radius: 5px;
  overflow: hidden;
}
.interview_content__img1 img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  height: 100%;
}
.interview_content__img2{
  position: relative;
  width: 80%;
  margin: 25px auto 0;
  min-height: 220px;
  border-radius: 5px;
  overflow: hidden;
}
.interview_content__img2 img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 100%;
}
.interview_content__text1{
  width: 55%;
  text-align: justify;
  font-size: 15px;
  line-height: 2.2;
}
.interview_content__text2{
  width: 45%;
  text-align: justify;
  font-size: 15px;
  line-height: 2.2;
}
.interview_content__title{
  width: 100%;
  margin-bottom: 25px;
  font-size: 22px;
  font-weight: 500;
  line-height: 1.8;
  color: var(--main-color1);
}
.interview_content__title h2{
  display: inline;
  font-weight: 500;
}
.interview_content__title p{
  display: inline-block;
  width: 55px;
  height: 55px;
  margin-right: 20px;
  padding-left: 0.35em;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 30px;
  font-weight: 700;
  color: #fff;
  background-color: var(--main-color1);
  border-radius: 50%;
}


/*-----------------------------------------------
　Q & A
--------------------------------------------------*/
.qa__outer{
  width: 850px;
  margin: 0 auto;
}
.qa_link__outer{
  width: 100%;
  margin-bottom: 60px;
}
.qa_link__outer ul{
  display: flex;
  justify-content: center;
  width: 100%;
}
.qa_link__outer ul li{
  width: 230px;
  margin: 0 40px;
}
.qa_link__outer ul li a{
  display: block;
  padding: 15px 0;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  color: #fff;
  transition: all .2s ease-in-out;
}
.qa_link__outer ul li a:hover{
  opacity: 0.7;
}
/*　各リンク設定　*/
.qa_link01{
  position: relative;
  background-color: var(--main-color1);
}
.qa_link02{
  position: relative;
  background-color: var(--main-color3);
}
.qa_link03{
  position: relative;
  background-color: var(--main-color2);
}
.qa_link01 span,
.qa_link02 span,
.qa_link03 span{
  position: absolute;
  top: 50%;
  right: -20px;
  transform: translateY(-50%) translateX(0);
  width: 40px;
  height: 40px;
  background-color: #fff;
  border-radius: 50%;
  transition: all .3s ease-in-out;
}
.qa_link01 span{
  border: 1px solid var(--main-color1);
}
.qa_link02 span{
  border: 1px solid var(--main-color3);
}
.qa_link03 span{
  border: 1px solid var(--main-color2);
}
.qa_link01 span::before,
.qa_link02 span::before,
.qa_link03 span::before{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 2px;
  height: 16px;
}
.qa_link01 span::after,
.qa_link02 span::after,
.qa_link03 span::after{
  content: '';
  position: absolute;
  top: 55%;
  left: 50%;
  width: 10px;
  height: 10px;
  transform: translateY(-50%) translateX(-50%) rotate(-225deg);
}
.qa_link01 span::before{
  background: var(--main-color1);
}
.qa_link01 span::after{
  border-top: 2px solid var(--main-color1);
  border-right: 2px solid var(--main-color1);
}
.qa_link02 span::before{
  background: var(--main-color3);
}
.qa_link02 span::after{
  border-top: 2px solid var(--main-color3);
  border-right: 2px solid var(--main-color3);
}
.qa_link03 span::before{
  background: var(--main-color2);
}
.qa_link03 span::after{
  border-top: 2px solid var(--main-color2);
  border-right: 2px solid var(--main-color2);
}
/*　//各リンク設定　*/

.qa__inner{
  width: 100%;
  margin-bottom: 80px;
}
.qa__inner_title{
  width: 100%;
  margin-bottom: 15px;
  padding-bottom: 15px;
  font-size: 20px;
  font-weight: 700;
  border-bottom: 1px dotted #9fa0a0;
}
.qa_title01{
  color: var(--main-color1);
}
.qa_title02{
  color: var(--main-color3);
}
.qa_title03{
  color: var(--main-color2);
}
.qa__accordion-area{
  width: 100%;
  margin:0 auto;
  font-size: 14px;
  font-weight: 400;
}
.qa__accordion-area li{
  margin: 10px 0;
}
.qa__accordion-area section {
  border-bottom: 1px dotted #b5b5b6;
}
.qa__accordion-area h3 {
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 700;
}

/* qa用アコーディオン装飾 */
.qa__accordion-area .title {
  position: relative;/*+マークの位置基準とするためrelative指定*/
  cursor: pointer;
  padding: 15px;
  font-weight: 700;
  color: var(--text-color);
  transition: all .5s ease;
}
.qa__accordion-area .title p {
  display: inline-block;
  margin-right: 20px;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 30px;
  font-weight: 700;
}
.p_01 {
  color: var(--main-color1);
}
.p_02 {
  color: var(--main-color3);
}

/*アイコンの＋と×*/
.qa__accordion-area .title::before,
.qa__accordion-area .title::after{
  position: absolute;
  content:'';
  width: 15px;
  height: 2px;
  background-color: var(--text-color); 
}
.qa__accordion-area .title::before{
  top: 48%;
  right: 15px;
  transform: rotate(0deg);
}
.qa__accordion-area .title::after{    
  top:48%;
  right: 15px;
  transform: rotate(90deg);
}

/*　closeというクラスがついたら形状変化　*/
.qa__accordion-area .title.close::before{
  transform: rotate(45deg);
}
.qa__accordion-area .title.close::after{
  transform: rotate(-45deg);
}

.qa__list{
  width: 100%;
}
.qa__list ul{
  display: block;
  width: 100%;
}
.qa__list ul li{
  position: relative;
  width: 100%;
  text-align: justify;
}
/* //qa用アコーディオン装飾 */