@charset "UTF-8";
/* CSS Document */
/*
Theme Name: kohokutechno
Theme URI: https://demo.f-fac.jp/
Author: F-factory
Author URI: https://demo.f-fac.jp/
Description: 最適な電気設備を提案、工事の施工管理を通じて、安全で安心な人々の暮らしに貢献します。
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://demo.f-fac.jp
Text Domain: テーマ名

*/




/*共通スタイル-------------------*/
/*.main {
    padding: 0 1rem;
}*/
/*スムーズスクロール*/
html {
  scroll-behavior: smooth;
}
/* 横スクロール防止 */
* {
  box-sizing: border-box;
}
html, body {
  overflow-x: hidden;
  max-width: 100%;
}

.main {
  overflow-x: hidden;
  max-width: 100%;
}

img {
  max-width: 100%;
  height: auto;
}

.section,
.topSection {
  width: 100%;
  max-width: 100%;
    margin-top: 5rem;
    padding: 6rem 0;
}
figure,
.businessCont,
.recruitCont {
  max-width: 100%;
  overflow: hidden;
}

/*固定要素*/
/*firstAnimation*/
#animationLogo {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  
  /*background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
  display: flex;
  align-items: center;
  justify-content: center;
  
  clip-path: inset(0 100% 0 0);
  animation: revealFromLeft 1s ease-out forwards, 
                       shrinkAndMove 0.8s ease-in forwards 1.5s;
}
@keyframes revealFromLeft {
  to {
    clip-path: inset(0 0 0 0);
  }
}
@keyframes shrinkAndMove {
  to {
    top: 30px;
                left: 30px;
                width: 60px;
                height: 60px;
                font-size: 24px;
                transform: translateY(0);
                opacity: 0;
  }
}
#mainContent {
  opacity: 0;
  animation: fadeIn 0.5s ease-in forwards 2.3s;
}
@keyframes fadeIn {
  to {
    opacity: 1;
  }
}

/*　hamburger　*/
.checkbox {
    display: none;
}
.button {
  position: relative;
  background-color: white;
	background: rgba(255,255,255,0.7);
  height: 5rem;
  width: 5rem;
  border-radius: 50%;
  position: fixed;
  top: 5vh; 
  right: 5vw; 
  z-index: 2000;
  box-shadow: 0 0rem 0.1rem black;
  text-align: center;
}

.background {
  height: 4rem;
  width: 4rem;
  border-radius: 50%;
  position: fixed;
  top: 5.5vh; 
  right: 5.5vw; 
  
	
  z-index: 1000;

  transition: transform 0.8s cubic-bezier(0.86, 0, 0.07, 1);
}
.hambNav .currentLocation {
  color: white;
  text-shadow: 2px 2px 10px #C3D400,
  -2px 2px 10px #C3D400,
  2px 2px 10px #C3D400,
  -2px 2px 10px #C3D400;
}
/*
.dtNavList a.currentLocation,
.siteMap a.currentLocation {
    text-shadow: 
        rgb(195, 212, 0) 2px 2px 10px, 
        rgb(195, 212, 0) -2px 2px 10px, 
        rgb(195, 212, 0) 2px 2px 10px, 
        rgb(195, 212, 0) -2px 2px 10px !important;
    pointer-events: none; /* 任意：現在地にいる時はクリック不可にする場合 
}
    */
  /* トップページ */
body.body.page-home .dtNavList li:nth-child(1) a {
    text-shadow: rgb(195, 212, 0) 2px 2px 10px, rgb(195, 212, 0) -2px 2px 10px !important;
    pointer-events: none !important;
}

/* 工事実績一覧 */
body.body.page-achievements .dtNavList li:nth-child(2) a {
    text-shadow: rgb(195, 212, 0) 2px 2px 10px, rgb(195, 212, 0) -2px 2px 10px !important;
    pointer-events: none !important;
}

/* 会社案内 */
body.body.page-company .dtNavList li:nth-child(3) a {
    text-shadow: rgb(195, 212, 0) 2px 2px 10px, rgb(195, 212, 0) -2px 2px 10px !important;
    pointer-events: none !important;
}

/* 採用情報 */
body.body.page-recruit .dtNavList li:nth-child(4) a {
    text-shadow: rgb(195, 212, 0) 2px 2px 10px, rgb(195, 212, 0) -2px 2px 10px !important;
    pointer-events: none !important;
}  
.hambNav {
  height: 100vh;
  position: fixed;
  top: 0;
  right: -60vw;
  z-index: 1500;
  opacity: 0;
  width: 0;
  transition: all 0.8s;
}

.list {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  list-style: none;
  text-align: center;
  width: 100%;
}
.navItem {
  margin: 1rem;
  font-size: 36px;
}
.navLink:link,
.navLink:visited {
  display: inline-block;
  font-size: 20px;
  font-weight: 300;
  font-weight: bold;
  color: #28408A;
  text-decoration: none;
  text-transform: uppercase;
  background-image: linear-gradient(
    120deg,
    transparent 0%,
    transparent 50%,
    white 50%
  );
  background-size: 220%;
  transition: all 0.4s;
}
.navLink {
  color: #28408A;
}
.navLink:hover,
.navLink:active {
    color: #bbdffb;
  cursor: pointer;
}
/* ★functionality★ */
.checkbox:checked ~ .background {
  transform: scale(80);
}
.checkbox:checked ~ .hambNav {
  opacity: 1;
  width: 100%;
  right: 0;
	background: rgba(255,255,255,0.9);
}

/*  */
/* styling hamb ICON */
.icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.icon,
.icon::before,
.icon::after {
  width: 3rem;
  height: 2px;
  background-color: gray;
  display: inline-block;
}

.icon::before,
.icon::after {
  content: "";
  position: absolute;
  left: 0;
  transition: all 0.2s;
}

.icon::before {
  top: -0.8rem;
}
.icon::after {
  top: 0.8rem;
}

.button:hover icon:before {
  top: -1rem;
}
.button:hover icon::after {
  top: 1rem;
}

.checkbox:checked + .button .icon {
  background-color: transparent;
}

.checkbox:checked + .button .icon::before {
  top: 0;
  transform: rotate(135deg);
}
.checkbox:checked + .button .icon::after {
  top: 0;
  transform: rotate(-135deg);
}
/*下層ページ共有　underPage*/
.underPage .h2,
.underPage .h2nother {
  font-size: 30px;
}
.underPage .vertical{    
        width: 20%;
        writing-mode: vertical-rl;
        text-orientation: upright;        
    }
.basicP {
  padding: 1rem;
}
.headingFlex {
  display: flex;
  justify-content: space-between;
  
}

/*パンくずリスト　bread*/
.underPage .bread {
  display: none;
}

/*テキストスタイル*/
.main,
.recruitToparea {
  color: #28408A;
}
.h1 {
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}
.h1 {
  font-size: 40px;
}
.mainVarea .h1 {
        width: 100%;
        padding-top: 8rem;
        padding-left: 1rem;
        font-size: 25px;
    }
.businessMain .h1,
.companyMain .h1,
.achievementsMain .h1,
.recruitMain .h1,
.singleMain .h1 {
  text-align: center;
}


    .h2 {
        font-weight: bold;
        font-size: 40px;
        
    }
    
    .mintyou {
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
 }
 .tegaki {
  
  font-family: "Zen Kurenaido", sans-serif;
  font-weight: 400;
  font-style: normal;


 }
.h3 {
    font-size: 18px;
    font-weight: bold;
}
.underPage .h3 {
  font-size: 25px;
}
 .txtMintyou {
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
 }
 /*フェードイン*/
  .fadeInSlow {
    opacity: 0;
    transition: opacity 2s ease-out;
  }
  .fadeInSlow.active {
    opacity: 1;
  }
.topH2VerticalBox {
    position: relative;
    display: flex;
    justify-content: space-between;
}
.body {
  font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN", /* ★Safari(Mac/iOS)用の指定 */
    "Hiragino Sans",             /* ★Safari(Mac/iOS)用の指定 */
    Meiryo,
    sans-serif;                  /* ★ゴシック体強制の記述 */
    background-image: url("./img/bg.gif");
}

.topH2Vertical,
.h3Vertical {    
        width: 20%;
        writing-mode: vertical-rl;
        text-orientation: upright;        
    }
.topMain .h2Vertical::after {
    position: relative;
    top: -9.5rem;
    right: 2rem;
    content: "Recruitment";
    font-size: 15px;
    writing-mode: vertical-rl;
    text-orientation: mixed;
}
/*usiness .h2Bg,
.recruitment .h2Bg,
 .companyMain .h2Bg {
    position: absolute;
    
}
    */
    .h2Bg {
    position: absolute;
    /*
    z-index: -1;
    */
}
    
.topMain .h2Bg img {
  position: relative;
  top: -1rem;
  left: 1rem;
  max-width: calc(100vw - 2rem); /* 画面幅を超えないように */
  animation: rotate 5s linear infinite;
}
.companyMain .h2Bg img {
  position: relative;
  top: -1rem;
  left: 1rem;
  max-width: calc(100vw - 2rem); /* 画面幅を超えないように */
  z-index: -1;
    animation: rotate 5s linear infinite;
}
@keyframes rotate {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }
}
.business p,
.recruitment p {
    width: 100%;
    padding-top: 1rem;
}
/*header-------------------------*/
.header {
  background-color: #0a2578;
}
.header .logo {
  width:100%;
  padding: 1rem;
  
}
.logo img {
  width: 250px;  
}
.dtNav {
  display: none;
}
.pageTopBtn p {
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  margin: 0;
  font-size: 15px;
  bottom: 13px;
  position: absolute;
}
.pageTopBtn{
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 80px;
  right: -80px;
  bottom: calc(50% - 40px);
  color: #fff;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  border: 0;
  background: #ff648d;
  transition: .2s;
  letter-spacing: 3px;
  font-weight: bold;
  z-index: 2000;
}
.contactBtn {
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 80px;
  right: -80px;
  bottom: calc(20% - 40px);
  color: #fff;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  border: 0;
  background: #4AB0FF;
  transition: .2s;
  
  letter-spacing: 1px;
  font-weight: bold;
  z-index: 2000;
}
.contactBtn .p {
    font-size: 14px;
  }
.pageTopBtn span,
.contactBtn span {
padding-bottom: 1rem;
}
/*.pageTopBtn i {
  position: absolute;
  font-size: 30px;
  color: #FFF;
  top: 15px;
  font-weight: 300;
}*/
.isActive {
  opacity: 0.6;
  visibility: visible;
  right: -2px;
}

/*footer----------------------*/
.footer {
    height: 600px;
    position: relative;
    background-image: linear-gradient(
    0deg, rgba(15, 62, 140, 1), rgba(255, 255, 255, 1)
  );
}
.footerContetWrap {
  width: 80%;
  padding-top: 6rem;
  margin: auto;
  color: white;
}
.footerLogo {
    text-align: center;
}
.footerContetWrap p {
  margin-top: 1rem;
  text-align: center;
  text-shadow: 2px 2px 10px #0a2578;
}
.footerLogo img {
  width: 25px;
}
.siteMap {
  margin: 2.5rem 0;
}
.siteMap ul {
  display: flex;
  justify-content: space-between;
}
.siteMap li {
  text-shadow: 2px 2px 10px #0a2578;
  writing-mode: vertical-rl;
  text-orientation: upright;
}
.siteMap li::before {
  display: inline-block;
  content: "▼";  
  color: #F66A9B;  
}
.siteMap li:hover::before {
  animation: bound 1s infinite;
}
@keyframes bound {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}
.siteMapContact {
text-align: center;
}
.siteMapContact a {
  display: inline-block;
  width: 100%;
  padding: 4px 0;
  border: 1px solid white;
  
}
.siteMapContact a:hover {
  background-color: #fff;
  color: #28408A;
}
/*
.siteMapContact ul {
  display: flex;
  justify-content: center;
}

.siteMapContact li:nth-child(1) {
  margin-right: 1rem;
}

*/
.footer .footerBg {
  position: absolute;
  bottom: 0;  
  width: 100%;
}

/*トップページ toppage----------------*/
.topMain .h2 {

}
.textCenter {
  text-align: center;
}
.moveBtn {
  padding-top: 6rem;
}
.topBtn {
  position: relative;
  padding: 1rem 1.5rem;
  border: 0;
  font-size: 1rem;
  letter-spacing: 0.2rem;
  border-radius: 8px;
  color: #fff;
  background-color: #28408A;
  overflow: hidden;
}
.topBtn::before {
  content: '';
  position: absolute;
  top: 0;
  left: -150%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.6) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  transform: skewX(-20deg);
}
.topBtn:hover::before {
  translate: 300% 0;
  transition: .5s;
}

.mainVarea {
        background-image: url("./img/mainV_pc-2.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        height: 1000px;
    }
.topMessage {
        height: 10rem;
        background-image: linear-gradient(
    180deg, 
    rgba(15, 62, 140, 1) 0%,
    rgba(15, 62, 140, 1) 50%,
     rgba(255, 255, 255, 1)100%
  );
    }
    .mainVarea h1 {
      color: #fff;
      letter-spacing: 2px;
      line-height: 3rem;
    }
    .Blur {
      display: inline-block;
      position: relative;
      animation: flicker 2s ease-in-out infinite;
      animation-delay: 1s;
    }
    .Blur::before {
      content: "";
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 120%;
      height: 120%;
      background: radial-gradient(circle, rgba(255, 247, 0, 0.6), transparent);
      filter: blur(10px);
      z-index: -1;
      opacity: 0;
      animation: glow 2s ease-in-out infinite;
      animation-delay: 1s;
    }
    @keyframes flicker {
      0%, 100% {
        transform: translateY(0px);
      }
      
      
    }
    @keyframes glow {
      0%, 100% {
        opacity: 0.4;
        transform: translate(-50%, -50%) scale(1);
      }
      50% {
        opacity: 0.8;
        transform: translate(-50%, -50%) scale(1.1);
      }
    }
.businessKindWrap {
  margin-top: 2rem;
  }

.businessCont img {
        width: 100%;
    }
.businessContR {
  
        clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 30% 100%);
}
.businessContL {
        clip-path: polygon(0 0%, 50% 0%, 70% 100%, 0% 100%);
}
.business .h2Message,
.recruitment .h2Message,
.president .h2Message {
  width: 60%;
  line-height: 1.3rem;
  letter-spacing: 0.1rem;
}
.business .strengths {
  display: flex;
  justify-content: center;
  
  margin-top: 1rem;
  padding-top: 1rem;
}
.business .strengPeace, .business .strengEfficiency {
        text-align: center;
    }

.business .strengPeace,
.business .strengEfficiency {
  width: 100%;
}
.business .strengPeace img,
 .business .strengEfficiency img {
  width: 100px;
  height: 100px;
}
.strengPeace figcaption,
.strengEfficiency figcaption {
  font-weight: bold;
}
.business .strengths img {
      display: block;
      
      margin: 0 auto;
      animation: bounce 1s alternate infinite;
    }
    @keyframes bounce {
      0% {
      transform:translateY(-20%) scale(1,1);
      }
      80% {
      transform:translateY(0%) scale(1,1);
      }
      100% {
      transform:translateY(0%) scale(1.1,0.9);
      }
    }
.recruitment,
.recruitMain .place,
.interviewMain .schedule {  
    background-color: #f7fdfb;
}
.timeLineWrap {
  
  margin-top: 4rem;
}
.recruitment .h2Box {
  margin-bottom: 2rem;
}
.recruitment .h3,
.recruitMain .h3 {
      margin: 1.5rem 0;
      text-align: center;
    }

.timeLineHover {    
    width: 50%;
    
}
.timeLineWrap {
  text-align: center;
}
.timeLineWrap a:hover {
  opacity: 0.5;
  
}
.timeLineWrap img {
  display: block;
  width: 50%;
  margin: auto;    
  height: auto;
   
}
.yurayura {
  transform-origin: center bottom;
  animation: yurayura 2s linear infinite;
}
@keyframes yurayura {
  0%, 100% {
    transform: rotate(10deg);
  }
  50% {
    transform: rotate(-10deg);
  }
}
.timeLineWrap p:first-child {  
  font-weight: bold;
}
.senahirai {
  padding-bottom: 1rem;
  color: #F66A9B;
  
}
.blinking {
  animation: blinking 2s ease-in-out 1s infinite forwards;
}
@keyframes blinking {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}

/*.interviewImgL img:hover,
.interviewImgR img:hover {
    animation: bounce 1s infinite ease-in-out; 
}*/
@keyframes bounce {
  0%, 100% {
    translate: 0;
  }
  50% {
    translate: 0 -10px;
  }
}
/*.company {
  position: relative;
}*/

.company h2 {
    text-align: center;
    
}
.h2HorizontalBox {
  position: relative;
  z-index: 10;
}
.h2HorizontalBox .h2 span {
    
    font-size: 30px;
    
}
    
.companyInfo {
  margin: 7rem 0;
}
.companyInfo img {
  width: 100%;
}
.companyInfo p {
  text-align: center;
        margin-top: 3rem;
        line-height: 2rem;
	    
}
.FormBtn {
        display: block;
        width: 100%;
        max-width: 300px;
        margin: 40px auto 0;
        padding: 15px 30px;
        background-color: #28408A;
        color: white;
        border: none;
        border-radius: 4px;
        font-size: 18px;
        font-weight: bold;
        cursor: pointer;
        transition: background-color 0.3s ease;
    }
.FormBtn:hover {
  background-color: #00A0A0;
}
.topMain .aboutSekou {
	margin-top: 1rem;
  padding: 0 1.5rem;
	line-height: 1.5rem;
}

.companyIconWrap {
  margin-top: 6rem;
  }

.companyIconWrap ul {
  display: flex;
  justify-content: space-between;
  width: 90%;
  margin: 0 auto;
}
.companyIconWrap li {
  text-align: center;
}
.companyIconWrap h3 {
  margin-bottom: 2rem;
  text-align: center;
}

    /*共通スタイル*/
    .h2Box {
    padding: 0 0.5rem;
}
    /*テキストスタイル*/
    
	
    
    .topMessage p {
        padding: 0 1rem;
        color: white;
        letter-spacing: 0.2rem;
        line-height: 1.5rem;
    }
    
    .char {
      padding-top: 2rem;
      padding-bottom: 2rem;
        font-size: 18px;
        color: #fff;
    }
        
    .business figure {
      height: 129px;
      overflow: visible;
    }
    figure.businessCont:nth-of-type(-n+3) {
  margin-bottom: 2rem;
}
.animateOnScroll {
            opacity: 0;
            transition: opacity 0.8s ease-out, transform 0.8s ease-out;
        }
        
.slideRight {
  transform: translateX(100px);
  
}
  .slideRight.active {
            opacity: 1;
            transform: translateX(0);
        }
.slideLeft {
  transform: translateX(-100px);
  
}
.slideLeft.active {
            opacity: 1;
            transform: translateX(0);
        }
        
.slideinLeft {
  animation: slideinLeft 2s;
  animation-iteration-count: 1;
}
@keyframes slideinLeft {
  0% {
    transform: translateX(430px);
  }
  100% {
    transform: translateX(0);
  }
}
    .businessContR {
      position: relative;
    }
    .businessContR figcaption {
      position: absolute; 
      top: 0;
      right: 0;
      width: auto;
      margin: 0.5rem;
      background-color: #fff;
      background-color: rgba(255, 255, 255, 0.8);
      
    }
    .businessContL {
      position: relative;
    }
    .businessContL figcaption {
      position: absolute; 
      top: 0;
      left: 0;
      width: auto;
      margin: 0.5rem;
      background-color: #fff;
      background-color: rgba(255, 255, 255, 0.8);
      
    }
    .recruitCont {
      position: relative;
    }
    .recruitCont img {
      width: 100%;
      height: auto;
    }
    .recruitCont figcaption {
      width: 12rem;
      margin-left: 1rem;
      position: absolute;
      top: 1rem;
      font-size: 15px;
      line-height: 1.5rem;
      
    }

/*事業内容と実績 toppage----------------*/
.underPage .overview {
  margin-top: 4rem;
  padding: 2rem 0;
}

.underPage .h1 {
  padding: 1rem 0;
  margin-bottom: 1rem;
  text-align: center;
}
.main .overview img,
.companyMain .treat {
  width: 100vw;
  max-width: 100%;
}
.underPage .overview p {
  margin-top: 1rem;
  padding: 0 0.5rem;;
}
.businessMain .section,
.companyMain .section {
  padding: 0 0 2rem 0;
}
.businessMain .syomei,
 .businessMain .joho,
 .businessMain .keho {
  margin-top: 10rem;
}

.businessMain .moveBtn {
  padding-top: 2rem;
}
.businessMain .h3img,
.businessMain .h2img {  
  width: 70%;
  height: 250px;
  line-height: 1.3rem;
  letter-spacing: 0.1rem;
}

.businessMain .h3img img:nth-child(1) {
    width: 100%;
}
/*
.businessMain .kindItem p {
  padding: 0 1rem;
}
*/
/*投稿ページ-------------------*/
.achievementsMain .flexContainer {
  display: block;   
}
.achievementsItem {
  margin-bottom: 6rem;
  padding: 0 1rem;
}

.achievementsMain .h3 {
  position: relative;
  padding: 3rem 0;
}
.achievementsMain .h3::before {
  position: absolute;
  top: -10px;;
  content: url(./img/h2Bg.png);
  z-index: -10;
}
.achievementsItem img {
  width: 100%;  
}
/*
.achievementsMain .textWrap {
  padding: 1rem 0;
}
  
.achievementsMain .name {
  font-size: 20px;
  border-bottom: #4AB0FF 1px solid;
}
.achievementsMain .text {
  padding-top: 1rem;
}
*/
.achievementsMain .moveBtn {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  
  margin: auto;
}
.categoryBtn,
.detailBtn {
    position: relative;
    padding: 1rem 1.5rem;
    border: 0;
    width: 45%;
    margin: 5px;
    font-size: 1rem;
    letter-spacing: 0.2rem;
    border-radius: 45px;
    color: #fff;
    background-color: #28408A;
    overflow: hidden;
    transition-property: background-color;/*変化させたいプロパティを指定*/
    transition-duration: 1s;/*要素が変化するまでの時間を指定*/
}
.categoryBtn:hover,
.detailBtn:hover {
    color: #28408A;
    background-color: #fff;
    border: #28408A 1px solid;
}

/*実績一覧ページ--------------------------------------*/

.singleMain .section {

}

.achievementsMain .overview img {
  width: 100vw;
  max-width: 100%;
}

/*実績個別ページ-----------------------*/
.singleMain .moveBtn {
  padding-top: 0;
}
.singleMain .singleSection {
  background-color: #f7fdfb;
}
/*実績個別ページ------------------*/
.singleMain .h3,
.singleWrap p,
.singleMain .explanation {
  margin: 1rem 1rem;
  }
  /*
  .singleMain .h3,
  .singleMain .
  .singleMain .explanation {
    margin: 1rem 0;
  }
    */
  .singleMain .singleImgWrap {
    margin: 1rem 1rem;;
  }
  .singleWrap img, 
  .singleMain .singleImgWrap img {
    width: 100%;
  }
  .singleMain figure {
    margin-bottom: 1rem;
  }
  .singleImgWrap figcaption {
  padding-top: 0.51rem;
  font-size: 13px;
}

.demandTxtWrap .ttlWrap {
  margin-bottom: 1rem;
  text-align: center;
}
.demandTxtWrap .ttlWrap p {
  
  font-weight: bold;
}
/*会社案内　company.html-------------------*/
.companyMain .h2,
.companyMain .timeline {
  margin-left: 1rem;
}
.companyMain .timeline {
  margin-top: 4rem;
}
.companyMain .h2Box {
  padding: 0;
}
.timeline {
  list-style: none;
}
.timeline > li {
  margin-bottom: 60px;
}
.internalLink {
  margin: 5rem 3rem;
  width: calc(100% - 6rem);
}
.internalLink ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1.5rem;
}
.internalLink li {
  padding: 0.5rem;
  font-weight: bold;
  border: 1px solid #28408A;
  border-radius: 8px;
  background-color: #28408A;
  color: #fff;
}
.internalLink li:hover,
.recruitInLink li:hover {
  transform: translateY(-5px);
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
   
}
.companyMain .h2Box .h2 {
  text-align: start;
}
.companyMain .h2Box {
  width: 100%;
}
.companyMain .h2Box .h2Message img {
  width: 100%;
}
.companyMain .h2Message img:nth-child(1) {
    display: inline-block;
}
.companyMain .h2Message img:nth-child(2) {
    display: none;
}
.president p {  
  margin: 1rem 1rem;
  letter-spacing: 0.1rem;
  line-height: 1.5rem;
}
.presidentName {
	text-align: right;
	font-weight: bold;
}

.explanation {  
  padding: 1rem;
  border-top: 1px solid #28408A;
  border-bottom: 1px solid #28408A;
}
.explanation:nth-child(n+2) {
  margin-top: 0.3rem;
}
.companyOverview .h2Box,

.history .h2Box,
.history .timeline
 {
  margin-right: 1rem;
  margin-left: 1rem;
}
 
.timeline
 {
  margin-top: 4rem;
  margin-right: 4rem;
  margin-left: 4rem;
  margin-bottom: 1.5rem;   
} 
.companyDetailLy {
  background-image: url(./img/timeLineSmp.jpg);
  background-size: cover;
  background-color:rgba(255,255,255,0.8);
background-blend-mode:lighten;
}

.companyDetail {
    margin: 2rem 1rem;
  margin-top: 5rem;  
  padding-bottom: 1.5rem;
  }
.companyDetail dd {
	margin: 0.5rem 0; 
}
.partnerName {
  margin-top: 4rem;
  margin-bottom: 1.5rem;
  margin-right: 1rem;
  margin-left: 1rem;
}
.companyOverview .explanation {
  margin: 1rem 0;
}
.timelineDate {
  margin-bottom: 0.5rem;
  font-weight: bold;
}
.partnerName {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  }
  .partnerName p {
    padding: 1rem;	
  }

.partnerName a {
    color: #00A0A0 !important;
  text-decoration: underline !important;	
  }
.partner {
  margin-bottom: 4rem;
}
/*採用情報　recruit-------------------------*/
.recruitHeader {
  background-color: #fff;
}

.recruitMainVarea {
  position: relative;
  background-image: url(./img/top_recruet-smh.jpg);
  background-repeat: no-repeat;
  background-size: auto;
  height: 800px;
  z-index: 1;  
}
.recruitMainVarea a {
  position: relative;
  bottom: -85%;
}
.recruitMainVarea .subCopy {
  position: absolute;
  top: 15%;
  left: 5%;
  font-size: 25px;
  line-height: 2rem;
  color: #fff;
}
.recruitMainVarea .mainCopy {
  position: absolute;
  top: 35%;
  left: 20%;
  font-size: 40px;
  line-height: 4rem;
  letter-spacing: 0.5rem;
  color: #28408A;
    text-shadow: 
    1px 1px 0 #44D3D4,
    -1px -1px 0 #44D3D4,
    -1px 1px 0 #44D3D4,
    1px -1px 0 #44D3D4;
}
.recruitMainVarea .entryBtn {
  position: absolute;
  top: 85%;
  
text-align: center;
}
.recruitMainVarea .entryBtn img {
  
  width: 60%;
}
.recruitInLink ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 85%;
  margin: auto;
  padding-top: 2rem;
}
.recruitInLink li {
  padding: 0.5rem;
}
.recruitInLink li::before {
  display: inline-block;
  padding-right: 0.5rem;
  content: "▶";
  color: #F66A9B;
}
.recruitMain .section {
  margin-top: 0;
}
.recruitMain .placeSection,
.recruitMain .eventSection {
  background-color: #f7fdfb;
}
.h3headingWrap p,
.placeItemWrap,
.demandTxtWrap,
.interviewItem {
  
  margin: 1rem 1rem;
}
.recruitTop p {
  margin-top: 2rem;
  margin-left: 1rem;
  margin-right: 1rem;
  text-align: center;
  line-height: 1.5rem;
}
.recruitMain .h2 {
  position: relative;
  font-size: 30px;
  text-align: center;
}

.recruitMain .h2::before {
  position: absolute;  
  top: -200%;
  left: 0;  
}
.recruitMain .hWorkPlace::before {
  content: url(./img/txtworkPlace.gif);
  width: 100%;
}
.recruitMain .hworkDemand::before {
  content: url(./img/txtdemand.gif); 
  width: 100%; 
}
.recruitMain .hinterview::before {
  content: url(./img/txtinterview.gif);
  width: 100%;
}
.recruitMain .hevent::before {
  content: url(./img/txtevent.gif);
  width: 100%;
}
.recruitMain .hflow::before {
  content: url(./img/txtflow.gif);
  width: 100%; 
  z-index: -2;
}
.recruitMain .placeItemWrap,
.recruitMain .demandTxtWrap,
.recruitMain .interviewWrap,
.recruitMain .iventWrap,
.flowItemWrap {  
  padding-top: 5rem;
}
.iventItemWrap {
	padding: 0 1rem;	
}
.iventItemWrap　.h3{
	
}
.iventItemWrap .ivenTable table {
	margin-bottom: 1rem;
}
.iventItemWrap p {
	font-weight: bold;
}
.recruitMain .interviewWrap {
  margin: 0;
}
.recruitMain .placeItemWrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  
}
.recruitMain .placeItem {
  width: 45%;
  margin: 0.5rem;
  padding: 0.5rem;
  border: 1px solid #28408A;
  background-color: #fff;
  text-align: center;
}
.recruitMain .barGraphWrap {
  position: relative;
  height: 50px;
  
}
.recruitMain .graph {
  
  height: 30px;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  
  border-radius: 0 4px 4px 0;
}
.recruitMain .barGraphWrap .pink90 { 
  width: 90%;
  background: #F66A9B;  
}
.recruitMain .barGraphWrap .blue90 { 
  width: 90%;
  background: #4AB0FF;  
}
.recruitMain .barGraphWrap .blue10 { 
  width: 10%; 
  background: #4AB0FF;  
}
.recruitMain .barGraphWrap .pink10 { 
  width: 10%; 
  background: #F66A9B;  
}
.recruitMain .graph span {
  font-size: 14px;
  color: #ffffff;
}
.placeItem .graphTtl {
  font-weight: bold;
}
.placeItem .graphValue {
  font-size: 13px;
}
.barGraphWrap .graph {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px;
  animation: graphAnim 3s forwards;
}
@keyframes graphAnim {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
.placeSection .table {
  width: 100%;
}
.barGraphWrap {
  overflow: hidden;
}
.placeItemWrap .placeValueCenter {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 60%;
}
.placeItemWrap .placeValueHoliday p {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 60%;
	width: 100%;
	padding: 0.5rem;
}
.recruitMain .topMargin {
  margin-top: 0.5rem;
}

.recruitMain .interviewItem {
  text-align: center;
}
.recruitMain .interviewItem p {
  margin-top: 1rem;
  margin-bottom: 1rem;
}
.recruitMain .interviewItemLeft {
  margin-bottom: 3rem;
}
.recruitMain .iventWrap .iventItemCenter {
  text-align: center;
}
.recruitMain .flowItemWrap {
  display: flex;
  justify-content: space-between;
}
.recruitMain .flowItemWrap img,
.recruitMain .flowItemWrap .flowTxt {
  width: 30%;
}
.recruitMain .flowItemWrap .flowTxt table {
  width: 100%;
  text-align: center;
}

@keyframes infinity-scroll-left {
from {
  transform: translateX(0);
}
  to {
  transform: translateX(-100%);
}
}
.scroll-infinity__wrap {
  display: flex;
  overflow: hidden;
  margin-bottom: 3rem;
}
.scroll-infinity__list {
  display: flex;
  list-style: none;
  padding: 0
}
.scroll-infinity__list--left {
  animation: infinity-scroll-left 15s infinite linear 0.5s both;
}
.scroll-infinity__item {
  width: calc(100vw / 2);
  padding: 0 1rem;
}
.scroll-infinity__item>img {
  width: 100%;
}

.iventItemWrap:first-child {
 margin-bottom: 8rem; 
}
.recruitMain .flowItemWrap table {
  height: 100%;
}
.recruitMain .flowItemWrap table td {
  vertical-align: middle;
  
}
.recruitMain .flowItemWrap table tr:nth-child(odd) {
  font-size: 20px;
  border: solid 1px #28408A;
}
.recruitMain .wave span {
  display: inline-block;
  font-size: 1rem;
  font-weight: 700;
  animation: wave 1.2s ease-in-out infinite;
}
.wave span:nth-child(1) {
  animation-delay: 0s;
}
.wave span:nth-child(2) {
  animation-delay: 0.08s;
}
.wave span:nth-child(3) {
  animation-delay: 0.16s;
}
.wave span:nth-child(4) {
  animation-delay: 0.24s;
}
.wave span:nth-child(5) {
  animation-delay: 0.32s;
}
.wave span:nth-child(6) {
  animation-delay: 0.40s;
}
.wave span:nth-child(7) {
  animation-delay: 0.48s;
}
.wave span:nth-child(8) {
  animation-delay: 0.56s;
}
.wave span:nth-child(9) {
  animation-delay: 0.64s;
}
.wave span:nth-child(10) {
  animation-delay: 0.72s;
}
.wave span:nth-child(11) {
  animation-delay: 0.80s;
}
.wave span:nth-child(12) {
  animation-delay: 0.88s;
}
.wave span:nth-child(13) {
  animation-delay: 0.96s;
}
.wave span:nth-child(14) {
  animation-delay: 1.04s;
}
@keyframes wave {
  0%,
  100% {
    
    color: #222;
  }
  50% {
    
    color: #ff7a7a;
  }
} {

}
/*一日の流れ　dayFlow--------------------*/
.timeline {
      max-width: 600px;
      margin: 0 auto;
      padding: 0.5rem;
      position: relative;
    }

    .timeline-item {
      display: flex;
      margin-bottom: 3rem;
      position: relative;
    }

    .timeline-item:not(:last-child)::after {
      content: '';
      position: absolute;
      left: 50px;
      top: 100px;
      width: 2px;
      height: calc(100% + 3rem);
      background-color: #1a3a7d;
    }

    .time-badge {
      width: 100px;
      height: 100px;
      background-color: #1a3a7d;
      border-radius: 50% 50% 0 0;
      display: flex;
      align-items: center;
      justify-content: center;
      color: white;
      font-size: 2rem;
      font-weight: bold;
      flex-shrink: 0;
      position: relative;
      z-index: 1;
    }

    .timeline-content {
      flex: 1;
      margin-left: 2rem;
      background-color: white;
      padding: 1.5rem;
      border-radius: 4px;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }
    .schedule .h3Ttl {
      margin-left: 1rem;
      margin-bottom: 2rem;
     }
    .timeline-title {
      font-size: 1.25rem;
      font-weight: bold;
      color: #1a3a7d;
      margin-bottom: 0.75rem;
      padding-bottom: 0.5rem;
      border-bottom: 2px solid #1a3a7d;
    }
    .timeline-content img {
      width: 100%;
    }
    .timeline-description {
      color: #333;
      line-height: 1.8;
      font-size: 0.95rem;
    }



  /*募集要項　requirements----------------------*/
  .requirementsMain {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .requirementsSection {
    margin-top: 0;
  }
  .requirementsMain .recruitInLink ul {    
    width: 100%;
    margin: auto;
    
}
.requirementsSection table {
  width: 100%;
  border-collapse: collapse;
}
.requirementsMain table th {
  padding: 1rem;
  border: 1px solid #fff;
  word-break: break-all; /* 文字溢れ対策 */
  vertical-align: middle; /* 上下中央揃え（お好みで） */
}
 
.requirementsMain table td {
  padding: 1rem;
  border: 1px solid #28408A;
  word-break: break-all; /* 文字溢れ対策 */
  vertical-align: middle; /* 上下中央揃え（お好みで） */
}
.requirementsMain table th {
  background-color: #28408A;
  color: #fff;
}
.entryBtnWrap {
  height: 50px;
  text-align: center;
}
.entryBtn {
  background-color: #fff;
  border: solid 2px #28408A;
  color: #28408A;
  border-radius: 35px;
  padding: 1rem 1.5rem;
  text-decoration: none;
  font-size: 20px;
  box-shadow: 0 5px 0 #28408A;
  display: inline-block;
  transition: .3s;
}
.entryBtn:hover {
  color: #28408A;
  transform: translateY(5px);
  box-shadow: 0 0 0 #28408A;
}
.entryBtnWrap {
  margin: 4rem 0;
}
.entryBtnWrap a {
  letter-spacing: 0.1rem;
}
/*お問合せ　contact---------------*/
/* お問合せフォーム 入力欄の左寄せ上書き */
.contactMain .Form-Item input[type="text"],
.contactMain .Form-Item input[type="email"],
.contactMain .Form-Item textarea {
  text-align: left;
}
.FormBtn {
      text-align: center;
    }
.wpcf7-form-control {
      text-align: center;
    }
.contactMain p {
  text-align: left;
}
.contactSection {
  margin-top: 0;
}
.Form {
  margin-top: 80px;
  margin-left: auto;
  margin-right: auto;
  max-width: 720px;
}

.Form-Item-FileInput {
      display: none;
    }
    

    .Form-Item-filearea {
      
      margin-top: 18px;
      padding-left: 1em;
      padding-right: 1em;
    }
    .Form-Item-FileLabel {
      display: inline-block;
      padding: 10px 20px;
      background-color: #4AB0FF;
      color: white;
      border-radius: 5px;
      cursor: pointer;
      transition: background-color 0.3s;
    }
    
    .Form-Item-FileLabel:hover {
      background-color: #28408A;
    }
    
    .Form-Item-FileList {
      margin-top: 10px;
      padding: 10px;
      background-color: #f9f9f9;
      border-radius: 5px;
      min-height: 40px;
    }
    
    .Form-Item-FileList-Item {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 8px;
      margin: 5px 0;
      background-color: white;
      border: 1px solid #ddd;
      border-radius: 3px;
    }
    
    .Form-Item-FileList-Item-Name {
      flex: 1;
      margin-right: 10px;
      word-break: break-all;
    }
    
    .Form-Item-FileList-Item-Size {
      margin-right: 10px;
      color: #666;
      font-size: 0.9em;
    }
    
    .Form-Item-FileList-Item-Remove {
      background-color: #f44336;
      color: white;
      border: none;
      padding: 5px 10px;
      border-radius: 3px;
      cursor: pointer;
      font-size: 0.9em;
    }
    
    .Form-Item-FileList-Item-Remove:hover {
      background-color: #da190b;
    }
    
    .Form-Item-FileList-Empty {
      color: #999;
      text-align: center;
      padding: 10px;
    }
    
    .Form-Item-FileNote {
      margin-top: 1rem;
      font-size: 0.85em;
      color: #666;
    }

    /* お問い合わせフォーム入力エリアのスタイル */

/* テキスト入力フィールド（氏名・メールアドレス） */
.Form-Item input[type="text"],
.Form-Item input[type="email"],
.Form-Item .yourName,
.Form-Item .user-email {
  width: 100%;
  padding: 12px 16px;
  border: 2px solid #28408A;
  border-radius: 4px;
  font-size: 16px;
  background-color: #fff;
  transition: border-color 0.3s ease;
}

/* テキストエリア（お問い合わせ内容） */
.Form-Item textarea,
.Form-Item .message {
  width: 100%;
  min-height: 150px;
  padding: 12px 16px;
  border: 2px solid #28408A;
  border-radius: 4px;
  font-size: 16px;
  background-color: #fff;
  resize: vertical;
  transition: border-color 0.3s ease;
}

/* フォーカス時のスタイル */
.Form-Item input[type="text"]:focus,
.Form-Item input[type="email"]:focus,
.Form-Item textarea:focus {
  outline: none;
  border-color: #00A0A0;
  box-shadow: 0 0 0 3px rgba(0, 160, 160, 0.1);
}

/* ファイルアップロードエリア */
.Form-Item-filearea {
  padding: 20px;
  border: 2px dashed #28408A;
  border-radius: 4px;
  background-color: #f8f9fa;
}

/* ファイル入力 */
.Form-Item .FormItemFileInput {
  padding: 10px;
  border: 1px solid #28408A;
  border-radius: 4px;
  background-color: #fff;
  cursor: pointer;
}

/* ファイルリスト表示エリア */
.Form-Item-FileList {
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #ddd;
  border-radius: 4px;
  background-color: #fff;
  min-height: 40px;
}

/* プレースホルダーのスタイル */
.Form-Item input::placeholder,
.Form-Item textarea::placeholder {
  color: #999;
  opacity: 1;
}






    /*404----------------------*/
    .notFoundDiscription {
      margin: 2rem 0;
    }
    .notFoundTxt {
      padding: 2rem 1rem;
      background-color: #f7fdfb;
    }
@media screen and (max-width: 480px) {
  .Form {
    margin-top: 40px;
  }
}
.Form-Item {
  border-top: 1px solid #ddd;
  padding-top: 24px;
  padding-bottom: 24px;
  width: 100%;
  display: flex;
  align-items: center;
}

  .Form-Item {
    padding-left: 14px;
    padding-right: 14px;
    padding-top: 16px;
    padding-bottom: 16px;
    flex-wrap: wrap;
  }

.Form-Item:nth-child(5) {
  border-bottom: 1px solid #ddd;
}
.Form-Item-Label {
  width: 100%;
  max-width: 248px;
  letter-spacing: 0.05em;
  font-weight: bold;
  font-size: 18px;
}
@media screen and (max-width: 480px) {
  .Form-Item-Label {
    max-width: inherit;
    display: flex;
    align-items: center;
    font-size: 15px;
  }
}
.Form-Item-Label.isMsg {
  margin-top: 8px;
  margin-bottom: auto;
}
@media screen and (max-width: 480px) {
  .Form-Item-Label.isMsg {
    margin-top: 0;
  }
}

.Form-Item-Label-Required {
  border-radius: 6px;
  margin-right: 8px;
  padding-top: 8px;
  padding-bottom: 8px;
  width: 48px;
  display: inline-block;
  text-align: center;
  background: #5bc8ac;
  color: #fff;
  font-size: 14px;
}
  
@media screen and (max-width: 480px) {
  .Form-Item-Label-Required {
    border-radius: 4px;
    padding-top: 4px;
    padding-bottom: 4px;
    width: 32px;
    font-size: 10px;
  }
}
.Form-Item-Input {
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-left: 40px;
  padding-left: 1em;
  padding-right: 1em;
  height: 48px;
  flex: 1;
  width: 100%;
  max-width: 410px;
  background: #eaedf2;
  font-size: 18px;
}
@media screen and (max-width: 480px) {
  .Form-Item-Input {
    margin-left: 0;
    margin-top: 18px;
    height: 40px;
    flex: inherit;
    font-size: 15px;
  }
}
.Form-Item-Textarea {
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-left: 40px;
  padding-left: 1em;
  padding-right: 1em;
  height: 216px;
  flex: 1;
  width: 100%;
  max-width: 410px;
  background: #eaedf2;
  font-size: 18px;
}
@media screen and (max-width: 480px) {
  .Form-Item-Textarea {
    margin-top: 18px;
    margin-left: 0;
    height: 200px;
    flex: inherit;
    font-size: 15px;
  }
}
@media ( min-width : 640px ){
.Form-Btn {  
  margin-top: 32px;  
  padding-top: 20px;
  padding-bottom: 20px;
  width: 280px;
  font-size: 20px;
}

}

  .Form-Btn {
    display: block;
    margin-top: 24px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 8px;
    padding-bottom: 8px;
    width: 160px;
    font-size: 16px;
    text-align: center;
    border-radius: 6px;
    letter-spacing: 0.05em;
  background: #5bc8ac;
  color: #fff;
  font-weight: bold;
  box-shadow: 0 4px 0 #00A0A0;
  }
.Form-Btn:hover {
  transform: translateY(4px);
  box-shadow: none;
}
/* for Desktop  url:https://www.webcreatorbox.com/blog/css-timeline*/
@media ( min-width : 480px ){
  .timeline > li {
    overflow: hidden;
    margin: 0;
    position: relative;
  }
  .timelineDate {
    width: 110px;
    float: left;
    margin-top: 20px;
  }
  .timelineContent {
    width: 75%;
    float: left;
    border-left: 3px #e5e5d1 solid;
    padding-left: 30px;
    padding-top: 20px;
  }
  .timelineContent:before {
    content: '';
    width: 12px;
    height: 12px;
    background: #6fc173;
    position: absolute;
    left: 106px;
    top: 24px;
    border-radius: 100%;
  }
}
/*DT/デスクトップのスタイル＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊*/
@media screen and (min-width: 480px) {

  /*共通スタイル-------------*/

  
  .header {
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 5000;
    transition: background 0.3s ease;
  }
  .header.scrolled {
    background: rgba(10, 37, 120, 0.3);
    backdrop-filter: blur(10px);
  }
  .headerWrap {
    display: flex;
    justify-content: space-between;
  }
  .dtNav ul {
    display: flex;
    height: 100%;
  }
  .dtNavList li {
    width: 8rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15px;
    color: #ffffff;
  }
  .dtNavList li::before {
    width: 0;
    height: 0;
    content: "";
    background-color: transparent;
    border-radius: 50%;
    transition: 0.3s;
  }
  .dtNavList li:hover::before {
    width: 0.25em;
    height: 0.25em;
    margin-right: 10px;
    background-color: #fff;
  }
  .navWrap {
    display: none;
  }
  .dtNav {
    display: block;
    
    
  }
  .dtNav ul {
    position: static;
  }
  
  /*パンくずリスト　bread*/
.underPage .bread {
  display: block;
  margin: 1rem 0;
}
  .section {
    padding: 20rem 0;
  }
  .footer {
    height: 1200px;
  }
  .siteMap li {
    font-size: 20px;
  }
  .siteMap {
    margin: 7rem 0;
  }
  .siteMapContact li {
    padding: 10px;
  }
  .siteMapContact li:hover {
    background-color: #fff;
  }
  .siteMapContact {
    width: 30%;
    margin: auto;
}
  /*テキスト*/
  .h1 {
    padding-left: 4rem;
    font-size: 100px;
    font-weight: bold;
  }
  .mainVarea .h1 {
    font-size: 50px;
    font-weight: normal;
    letter-spacing: 0.5rem;
  }
  .topMain .h2 {
    font-size: 100px;
    font-weight: bold;
  }
  .h2 {
    font-size: 50px;
    font-weight: bold;
  }
  .underPage .h2 {
  font-size: 50px;
  }
  .topH2Vertical::after {
    top: -23rem;
    right: 5rem;
    font-size: 30px;
  }
  .h3 {
    font-size: 40px;
  }
  .p {
    font-size: 25px;
  }

  /*button/ボタン*/
  .moveBtn {
    padding-top: 15rem;
  }
  .topBtn {
    padding: 2rem 3rem;
    font-size: 2rem;
    
  }
  /*toppage/トップページ---------------------------*/
    .mainVarea {
      background-image: url(./img/mainV_pc-2.jpg);
    }
    .topMessage {
      height: 15rem;
    }
    .topMessage p {
      width: 75%;
      margin: auto;
      text-align: center;
      line-height: 2rem;
      font-size: 25px;
    }
    .char {
            opacity: 0;
            display: inline-block;
            animation: fadeInChar 0.1s forwards;
            padding-top: 2rem;
      padding-bottom: 2rem;
        font-size: 30px;
        color: #fff;
        }

        @keyframes fadeInChar {
            to {
                opacity: 1;
            }
        }
    .topMessage .text {
      font-size: 30px;
    }
    .mainVarea h1 {
      letter-spacing: 4px;
      line-height: 5rem;
      opacity: 0;
      animation: fadeIn 1.5s ease-in forwards;
      animation-delay: 2.8s;
    }
    @keyframes fadeIn {
      from {
        opacity: 0;
        
      }
      to {
        opacity: 1;
        
      }
    }
    .businessKindWrap {
    margin-top: 12rem;
}
    .businessContR {
      clip-path: none;
    }
    
    .h2Box {
      height: 30rem; 
      padding: 0 2rem;
    }
	.companyOverview .h2Box {
      height: 10rem; 
      padding: 0 2rem;
    }
    .business .h2Bg,
    .recruitment .h2Bg,
    .company .h2Bg {      
      left: 4rem;
    }
    .business .h2Bg img,
    .recruitment .h2Bg img,
    .company .h2Bg img {
      width: 400px;      
    }
    .business .h2Message,
    .recruitment .h2Message {
      width: 50%;
      padding-top: 4rem;
      padding-right: 6rem;
      line-height: 2.5rem;
    }
    
    .business .strengths {
      
      justify-content: center;
      margin-top: 4rem;
      height: 200px;
    }
    .business .strengths img {      
      width: 100%;
      height: auto;
    }
    
    .business .strengPeace figcaption,
    .business .strengEfficiency figcaption {
            font-weight: bold;
            font-size: 20px;
    }
    .business .strengPeace {
            margin-right: 4rem;
    }
      
    
    
    figure.businessCont:nth-of-type(-n+3) {
      margin-bottom: 5rem;
    }
    .business figure {
      height: 450px;
    }
    .businessContR {
      clip-path:polygon(50% 0%, 100% 0%, 100% 100%, 30% 100%);
    }
    .businessContR figcaption,
    .businessContL figcaption {
      font-size: 40px;
    }

    /*recruet/採用情報*/
    .recruitCont figcaption {
      width: 45rem;
      top: 10rem;
      font-size: 30px;
      line-height: 5rem;
    }
    .recruitment .h3,
    .companyIconWrap h3 {
      margin-top: 8rem;
      margin-bottom: 5rem; 
    }
    .companyInfo {
      margin: 19rem 0;
    }
    .h2HorizontalBox::before {
      left: 43rem;
      font-size: 30px;
      font-family: "Noto Serif JP", serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
    }
    .companyIconWrap li {
      display: inline-block;
      width: 200px;
      height: 250px;
    }
    .companyIconWrap li img {
      width: 200px;
    }
    .companyIconWrap li p {
      margin-top: 1rem;      
    }
    .siteMapContact li:nth-child(1) {
    margin-right: 6rem;
}
.recruitCont img {
    width: 100%;
    height: 600px;
    object-fit: cover;
}
.timeLineWrap p {
    font-size: 25px;
}
.timeLineWrap img {    
    width: 30%;    
}
.company .h2Box {
    height: 0;
    
}
.companyInfo p {
  text-align: center;
    margin-top: 3rem;
    line-height:2rem;
}
/*事業内容と実績ページ　business*/
.section {
    margin-top: 8rem;    
}

.underPage .overview p {
    width: 70%; 
    margin: 2rem auto;
    line-height: 1.5rem;
    font-size: 20px;
} 
.businessMain .h3 {
    font-size: 60px;
}
.businessMain .h3img {
    width: 70%;
    height: auto;    
}
.businessMain .h3img img:nth-child(1) {
   width: 100%;
}
.headingFlex {
  
  height: 900px;
}
.businessMain .kindItem p {
    padding: 0 1rem;
    margin: 2rem 0;
}
.businessMain .moveBtn {
    padding-top: 4rem;
}
.businessMain .syomei, .businessMain .joho, .businessMain .keho {
    margin-top: 20rem;
}
 .topMain .aboutSekou  {
  padding: 0 2rem;
}
.topMain .aboutSekou p,
	.topMain .aboutSekou-2 p{
  padding-left: 30rem;
  letter-spacing: 0.1rem;
  line-height: 2rem;
}
.business p {
  font-size: 25px;
}
/*実績一覧ページ---------------*/
.achievementsMain .section {
  
  padding: 0;
}
.singleMain .moveBtn {
  padding-top: 0;
}
.categoryBtn {    
    margin: 2rem;   
    font-size: 2rem;   
}

.achievementsMain .moveBtn {
    padding: 1rem;
    width: 90%;    
}

.achievementsMain .flexContainer {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}
.achievementsItem {
  width: 30%;
    margin-bottom: 6rem;
    padding: 0 1rem;
}

.companyIconWrap ul {
  width: 70%;
}
/*実績個別ページ------------------*/

.singleSection {
  padding: 4rem 0;
} 
.singleWrap img {
  width: 100%;
  
}
.singleWrap dt {
  padding-bottom: 1rem;
  font-weight: bold;
}
.singleImgWrap {
  display: flex;
  flex-wrap: wrap;
  
}
.singleImgWrap figure {
  width: 30%;
  margin: 1rem;
}
.singleImgWrap figure img {
  width: 100%;
}
/*会社案内　company.html-------------------*/
.internalLink ul {
  gap: 4rem;
}
.internalLink li {
  padding: 0.5rem 1rem;
  font-size: 20px;
}
.companyMain .h2Message img:nth-child(1) {
    display: none;
    width: 100%;
}
.companyMain .h2Message img:nth-child(2) {
    display: inline-block;
}
.president p { 
  width: 70%;
  margin: 1rem auto;
  font-size: 20px;
	line-height: 2rem;
} 
.companyMain .h2 {
  margin: 0;
}
.companyMain .h2Bg {
    position: absolute;
    width: 30%;
}
.companyOverview .h2Bg {
    position: absolute;
    width: 30%;
	z-index: 10;
}
.h2Bg img {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    animation: rotate 5s 
linear infinite;
}
.companyMain .h2Box .h2 {
  width: 80%;
  margin: auto;
  padding-top: 5rem;
}
.companyMain .h2Box .h2nother {

  padding-top: 5rem;
  font-size: 50px;
}
.explanation dl {
  
  font-size: 25px;
}

.companyDetail {
  width: 40%;
  
  margin: 0 auto;
  padding-top: 15rem;  
  padding-bottom: 1.5rem;
  
}
.president .headingFlex {
        height: auto;
    }
.explanation dt {  
  margin-bottom: 1rem;
  padding-bottom: 1rem;
  
}
.timeline {
    max-width: 55%;
    margin: 0 auto;
    padding: 1rem;
    position: relative;
    
}
  .history .h2Box {
    margin: 0;
  }
   .history .timeline {
    margin: 5rem auto;
}
.timeline ul {
  width: 100%;
}
.timeline li {
  font-size: 25px;
}
.partnerName {
    width: 70%;
    margin: 4rem auto;
    gap: 0;
}
.partnerName p {
    padding: 1rem;
}
/*採用情報　recruit----------------*/
.recruitMainVarea .subCopy {    
    top: 40%;
    left: 5%;
    font-size: 50px;
    line-height: 4rem;
    text-shadow: 2px 2px 10px #28408A ,
-2px 2px 10px #28408A ,
2px -2px 10px #28408A ,
-2px -2px 10px #28408A;
}
.recruitMainVarea {    
  background-image: url(./img/top_recruet-pc-2.jpg);
  background-size: cover;
}
.recruitMainVarea .mainCopy {    
    top: 10%;
    left: 70%;
    font-size: 70px;
    line-height: 5rem;
    letter-spacing: 1rem;
    
}
.recruitMainVarea a {  
  position: absolute;
    width: 100%;
    height: 30%;
    top: 85%;
    text-align: center;
    z-index: 20;
}
 .recruitHeader .dtNavList li {        
        color: #28408A;
    }
.recruitInLink ul {    
  margin-top: 7rem;
    padding-top: 6rem;
}
.recruitInLink li:nth-child(n+2) {
    padding-left: 3rem;
}
.recruitTop .h1 {
  padding
}
.recruitMain p,
.recruitMain .table td {
  margin-bottom: 1.5rem;
  font-size: 25px;
  text-align: center;
}
	.recruitTop p {
		line-height: 3rem;
	}
.recruitMain .years {
  width: 50%;
}
.h3headingWrap p, .placeItemWrap, .demandTxtWrap, .interviewItem {
    margin: 4rem 1rem;
}
.recruitMain .placeItem:nth-child(n+3) {
    padding: 1.5rem;
    
}
.recruitMain .table {
    margin: auto;
    
}
.recruitMain .wave span {  
  font-size: 2rem;
}
.recruitSection .explanation {
    padding-top: 2rem;
    padding-bottom: 2rem;
}
.recruitMain .barGraphWrap:first-child {
    margin-top: 1.5rem;
}
.recruitMain .interviewWrap {
  display: flex;
  justify-content: space-between;
}
.interviewItemRight, .interviewItemLeft {
  padding: 1.5rem;
}
.recruitMain .iventWrap .iventItemCenter img {
    width: 50%;
}
.eventSection .ivenTable {
  padding: 1rem;
}
.eventSection .ivenTable p {
  margin-bottom: 0.5rem;
}
.eventSection .ivenTable p:nth-child(n+2) {
        margin-top: 2rem;
    }

.recruitMain .ivenTable table {
  margin: auto;
	padding-bottom: 1.3rem;
}
.recruitMain .ivenTable table td {
  padding: 0.5rem;
  font-size:20px;
}

/*.recruitMain .flowItemWrap table td {
    vertical-align: middle;
}*/
.recruitMain .flowItemWrap table tr:nth-child(odd) {
  font-size: 25px;
}

.recruitMain .placeItem {    
    padding: 1.5rem;    
}
.placeValue:nth-child(1) {
	margin-bottom: 0.5rem;
}
/*社員インタビュー　interview*/

.employeeYamada, .employeesatoh {
    background-image: url(./img/interviewBg-pc.gif);
    
}
.interviewMain .dateWrap {
    
    justify-content: space-around;
}
.interview .recruitInLink li {
    font-size: 30px;
    padding: 2rem;
}
.interviewMain .dateWrap .post,
.interviewMain .interviewSection .coment,
.interviewMain .interviewSection table {
    font-size: 25px;
}
.dateWrap .name {
    font-size: 50px;
}
.interviewMain .interviewSection table td {
  letter-spacing: 0.2rem;
}
.interviewSection table th {
    padding-top: 2rem;
    }
.interviewMain .schedule .h3 {
  padding-bottom: 5rem;
    text-align: center;
}
.scheduleSectionSubTtl {
	margin-bottom: 0.5rem;
	text-align: center;
}
.schedule .h3Ttl {
    font-size: 30px;
}
/*募集要項　requirements-----------------------*/
.requirementsSection {
  margin-top: 0;
  width: 70%;
  max-width: 70%;
  margin: 0 auto;
  padding-top: 6rem; 
}
.requirementsSection table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed; /* 列の幅を固定するために重要 */
}
.requirementsSection tbody {
    display: flex;
    flex-wrap: wrap;
    gap: 0; /* 余白をなくす */
  }

  .requirementsSection tr {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    text-align: left;
    margin: 0; /* マージンをリセット */
  }

  .requirementsSection th {
    width: 30%;    
    padding: 1rem;    
  }

  .requirementsSection td {
    width: 70%;   
  }

  /*お問合せ　contact---------------*/

.contactSection {
  margin-top: 0;
  padding-top: 10rem;
}

.Form-Item-filearea {
      margin-left: 40px;
      
      padding-left: 1em;
      padding-right: 1em;
    }


/* お問い合わせフォーム 整列スタイル */

/* フォーム全体のコンテナ */
.Form {
  max-width: 800px;
  margin: 0 auto;
  padding: 20px;
}

/* 各フォーム項目 */
.Form-Item {
  
  margin-bottom: 30px;
  width: 100%;
}

/* ラベル部分の統一スタイル */
.Form-Item-Label {
  display: flex;
  align-items: center;
  justify-content: flex-start; 
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: bold;
  color: #28408A;
  white-space: nowrap; /* PC画面で改行させない */
}

/* 必須ラベル */
.Form-Item-Label-Required {
  display: inline-flex;
  align-items: center;
  justify-content: center; /* テキストを中央に */
  background-color: #dc3545;
  color: white;
  padding: 4px 12px;
  border-radius: 4px;
  font-size: 14px;
  margin-right: 10px;
  white-space: nowrap;
  min-width: 50px; /* 最小幅を設定して中央揃えを安定させる */
}

/* 任意の場合の色変更 */
.Form-Item-Label-Required.optional {
  background-color: #6c757d;
}

/* テキスト入力フィールド（氏名・メールアドレス） */
.Form-Item input[type="text"],
.Form-Item input[type="email"],
.Form-Item .yourName,
.Form-Item .user-email {
  width: 100%;
  padding: 12px 16px;
  border: 2px solid #28408A;
  border-radius: 4px;
  font-size: 16px;
  background-color: #fff;
  transition: border-color 0.3s ease;
  box-sizing: border-box;
}

/* テキストエリア（お問い合わせ内容） */
.Form-Item textarea,
.Form-Item .message {
  width: 100%;
  min-height: 150px;
  padding: 12px 16px;
  border: 2px solid #28408A;
  border-radius: 4px;
  font-size: 16px;
  background-color: #fff;
  resize: vertical;
  transition: border-color 0.3s ease;
  box-sizing: border-box;
}

/* フォーカス時のスタイル */
.Form-Item input[type="text"]:focus,
.Form-Item input[type="email"]:focus,
.Form-Item textarea:focus {
  outline: none;
  border-color: #00A0A0;
  box-shadow: 0 0 0 3px rgba(0, 160, 160, 0.1);
}

/* ファイルアップロードエリア */
.Form-Item-filearea {
  width: 100%;
  padding: 20px;
  border: 2px dashed #28408A;
  border-radius: 4px;
  background-color: #f8f9fa;
  box-sizing: border-box;
}

/* ファイル入力 */
.Form-Item .FormItemFileInput {
  width: 100%;
  padding: 10px;
  border: 1px solid #28408A;
  border-radius: 4px;
  background-color: #fff;
  cursor: pointer;
  box-sizing: border-box;
}

/* ファイルリスト表示エリア */
.Form-Item-FileList {
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #ddd;
  border-radius: 4px;
  background-color: #fff;
  min-height: 40px;
}

/* ファイル注釈 */
.Form-Item-FileNote {
  margin-top: 8px;
  font-size: 14px;
  color: #666;
}

/* 送信ボタン 
.FormBtn {
  display: block;
  width: 100%;
  max-width: 300px;
  margin: 40px auto 0;
  padding: 15px 30px;
  background-color: #28408A;
  color: white;
  border: none;
  border-radius: 4px;
  font-size: 18px;
  font-weight: bold;
  cursor: pointer;
  transition: background-color 0.3s ease;
}


.FormBtn:hover {
  background-color: #00A0A0;
}
*/
/* プレースホルダーのスタイル */
.Form-Item input::placeholder,
.Form-Item textarea::placeholder {
  color: #999;
  opacity: 1;
}



/*404----------------------*/
    .notFoundDiscription {
      margin: 5rem 0;
    }
    
    .notFoundTxt p {
      width: 80%;
      margin: auto;
      font-size: 25px;
      letter-spacing: 0.2rem;
    }
}
/* PC画面での調整 */
@media (min-width: 769px) {
  .Form {
    max-width: 900px;
    padding: 40px;
  }
  
  .Form-Item-Label {
    font-size: 18px;
    white-space: nowrap; /* PC画面で「必須、応募書類アップロード」を改行させない */
  }
  
  .Form-Item-Label-Required {
    font-size: 15px;
    padding: 5px 14px;
  }
  
  .Form-Item input[type="text"],
  .Form-Item input[type="email"],
  .Form-Item textarea {
    font-size: 18px;
  }

}