body{
margin:0;
background-color:#eeeeee;
}
table{
border-collapse:collapse;
}
h2{
margin:5px;
}
h3{
margin:5px;
}

/*ヘッダー*/

.header {
  background: transparent;
}

/* 各ページタイトル下線 */
.pa-title{
margin-top:150px;
font-size:24px;
font-weight: 600;
border-bottom:solid 1px #ccc;
width: 1100px;
padding-bottom: 10px;
}

/* 各ページタイトル下画像 */
.page-img{/*----画像img----*/
width:1100px;
}


/* 下層ページ */
.sub-page .header {
  background: #eeeeee;
  backdrop-filter: blur(6px);
}

/*会社概要ページ*/

.gai-j{
  display: flex;
  flex-direction: column;
max-width: 1100px;
margin: 0 auto;
gap:20px;
}
.gai01{
display: flex;
flex-direction: column;
}
.gai0{/*カラム親div1*/
margin-top: 20px;
display: flex;  
padding-top:30px;
}
/*カラム左div1*/
.gai1{
flex:1;
width:500px;
}
/*カラム右div2*/
.gai2{
margin-top: 20px;
flex:1;
width:500px;
}
.gai3{
margin-top:10px;
}

.pc1{
width:500px;
}
.photo-column {
  display: flex;
  flex-direction: column; /* 縦並びにする */
  gap: 20px;               /* 写真の間隔 */
}
.migi1{
text-align: right;
}

/*table1*/
.g-ta11{
padding:5px;
font-size:1.5em;
border-width:1;
border-color:#cccccc;
border-style:solid;
}
.g-ta11 td{
  padding:5px;
}

/*-----IT事業部ページ------*/

.itimage{
margin:10px;
width:500px;
}

#it00{
max-width: 1100px;
margin: 0 auto;
}
.img-i01{
width:500px;
}

.it01{
margin-top:150px;
font-size:24px;
font-weight: 600;
border-bottom:solid 1px #ccc;
width: 1100px;
padding-bottom: 10px;
}

#it02{
display: flex;          /* 横並びにする */
max-width: 1100px;
margin: 0 auto;
}
.it03{
flex:1;
width:500px;
margin:20px;
}
.it04{
border: 3px solid #cccccc;
border-radius: 12px;
padding: 16px;
flex:1;
width:500px;
margin:20px;
}

/*-----リフォーム------*/

.gai-j{
max-width: 1100px;
margin: 0 auto;
}
.refo1{
width:1500px;
}
.shadow02 {
color: #fff;
text-shadow: 2px 2px 1px #333;
}
.building {
padding: 15px;
text-align: center;
border: solid 3px #c03;  /*線*/
border-radius: 12px;
background-color:#ffaa00;
}
.service{
height:150px;
}
.p-ser{
margin-bottom: 30px;
}
.shadow2{
color:#ffffff;
text-shadow: 1px 1px 1px #ff0000
}

/*----親div----*/
.re-t01{
display: flex;
gap: 20px;
}
/*----子div----*/
.re-t02{
flex: 1 1 0;
margin: 0;
padding:20px;
}
/*----END リフォーム----*/

/*----------採用情報ページ開始-----------*/
#sa01{/*----全体div----*/
max-width: 1100px;
margin: 0 auto;
}

.saiyou-i1{/*----画像div----*/
}

.syo-kakomi{
background: #ccddee;
padding-bottom: 20px;
margin-bottom: 15px;
}
.s-p1{
margin: 5px auto;
}

.s-oya{/*----採用情報枠の親----*/
display: flex;
gap: 10px;
align-items: flex-start;
margin:15px 0 10px 0;
}
.s-oya p{
margin:0;
}
.sa-title{
font-size:24px;
font-weight: 600;
margin:10px 0 10px 10px;/*--上・右・下・左--*/
padding: 30px 10px 15px 10px;
border-bottom:solid 1px #ccc;
width: 1050px;
}

.s-hidari-1{/*--採用情報枠の子左--*/
flex:1;
text-align: left;
margin-left: 20px;
}
.s-migi-1{/*----採用情報枠の子右----*/
flex:3;
display: flex;
flex-direction: column;
gap: 0px;
text-align: left;
}
.s-migi-1 p {
margin: 0 0 4px 0;
line-height: 1.6;
}
.s-bun1{/*--spanの文字--*/
font-size: 16px;
margin-left: 25px;
color: #333;
}
.oubo1{
font-weight: 600;
font-size: 30px;
}

#oubo01{
scroll-margin-top: 100px; /* ← ヘッダーの高さ分リンクする時上げる */
background: #eeeeaa;
padding-bottom: 20px;
margin-bottom: 15px;
}
.oubo-ko{
padding: 0 20px 4px 20px;
}

/* お問合せページここから */
.form0{
  max-width: 600px;      /* 横幅制限（重要） */
  margin: 100px 0 20px 0 ;    /* 上下余白 + 横中央 */
  margin-left: auto;
  margin-right: auto;
  padding: 10px 20px 20px 30px;
  background: #ffffff;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.icon1{
  display:flex;
  align-items: center; /* 縦位置を揃える */
  justify-content: center;
  gap: 10px;           /* 文字と画像の間隔 */
  margin-bottom: 20px;
}

.contact-wrap{
  display: flex;
  justify-content: center;
}

.btn-icon{
  width: 60px;
  height: 60px;
}

.contact-btn {
  display: inline-flex;       /* ←ここ重要 */
  align-items: center;        /* 縦中央揃え */
  gap: 8px;                   /* 文字と画像の間 */
  padding: 12px 24px;
  background: linear-gradient(145deg, #4da3ff, #0066cc);

  color: #ffffff;
  text-decoration: none;
  border-radius: 6px;
  font-weight: bold;
  font-size :36px;

   /* 影（これが一番重要） */
  box-shadow: 
    0 4px 0 #004a99,      /* 下の濃い影（押し込み表現） */
    0 6px 10px rgba(0,0,0,0.2); /* ふんわり影 */

  transition: 0.3s;
}

/* ホバー時 */
.contact-btn:hover {
  background-color: #0056b3;
  transform: translateY(-2px);
}

/* クリック時 */
.contact-btn:active {
  transform: translateY(0);
}

.tel{
max-width: 600px; 
margin: 20px 0 20px 0 ;    /* 上下余白 + 横中央 */
margin-left: auto;
margin-right: auto;
padding: 10px 20px 20px 30px;
background: #ffffff;
border-radius: 10px;
box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
#toi1{
margin-left: 20px;
font-size: 20px;
font-weight: 600;
}
.map-n{
width:100px;
height: auto;
}
.den1{
  font-size: 18px;
  padding-left :120px;
}
.den2{
  padding-left :120px;
  font-size: 30px;
  display: flex;
  align-items: center; /* 縦位置を揃える */
  gap :10px;
}
.icon-d1{
  width: 50px;
  height:65px;
}

.error-box {
  background: #ffecec;
  border: 1px solid red;
  padding: 10px;
  margin-bottom: 20px;
}

.error-box li {
  color: red;
}

.error-input {
  border: 2px solid red;
  background: #fff5f5;
}

/* お問合せページここまで */

/* PHPの問い合わせフォーム（今は使わない）*/

.form0 input[type="text"],
.form0 input[type="email"],
.form0 select {
  width: 100%;
  padding: 10px;
  margin-top: 5px;
  margin-bottom: 15px;
  border: 1px solid #ccc;
  border-radius: 5px;
}

.form0 textarea {
  resize: none;      /* 手動リサイズ禁止（好み） */
  overflow: hidden;  /* スクロールバー消す */
  width: 100%;
  padding: 10px;
  margin-top: 5px;
  margin-bottom: 15px;
  border: 1px solid #ccc;
  border-radius: 5px;
}

.form0 button {
  width: 100%;
  padding: 12px;
  background: #333;
  color: #fff;
  border: none;
  border-radius: 5px;
  font-size: 16px;
  cursor: pointer;
}

.form0 button:hover {
  background: #555;
}

.form0 label {
  font-weight: bold;
}

/* PHPの問い合わせフォームEND*/