@charset "utf-8";

html{
scroll-behavior: smooth;
font-size:62.5%;
font-family: "Zen Kaku Gothic New", sans-serif;
/*
font-family: Verdana, Roboto, "Droid Sans", "游ゴシック", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif;
*/
font-style: normal;
}
body{
background:#bedeec;
font-size:1.6rem;
padding:0;
margin:0;
}
header{
background:#1b2d80;
color:#fff;
padding:3px 0;
font-weight: bold;
text-align:center;
}
header p{
font-size:1.8rem;
padding:0;
margin:0;
}
footer{
background:#1b2d80;
color:#fff;
padding:5px 0;
text-align:center;
}
footer p{
font-size:1.8rem;
padding:0;
margin:0;
}
.main{
margin:0 auto;
padding:20px;
width:90%;
background:#fff;
text-align:center;
}
h1{
font-size:20px;
}
.main-header{
background:#fff;
margin:0 auto;
padding:20px ;
width:90%;
}
.main-header-image{
display: block;
width:100%;
height:auto;
max-width:960px;
margin:0 auto;
}
.main-shokai-info{
background:#fff;
margin-bottom: 40px;
padding:0 20px 20px;
margin:0 auto;
width:auto;
max-width:800px;
border-radius:10px;
border:5px solid #2980b9;
background: #f3f8fc;
}
.main-shokai-info h2{
font-size:2.8rem;
color:#0b629c;
margin-bottom:20px;
padding-bottom:10px;
border-bottom:1px solid #ccc;
}
.main-shokai-info p{
font-size:2rem;
line-height:1.5;
margin:0 auto 20px;
padding:0 20px;
border-radius:5px;
}

.main-intro{
display: block;
background:#fff;
margin:20px auto 0;
padding:20px;
width:auto;
max-width:800px;
}
.main-intro p{
font-size:2.2rem;
line-height:1.5;
margin:0 auto;
padding:0 20px;
border-radius:5px;
}
.main-intro span {
background-image: linear-gradient(transparent 50%, #ffff66 50%);
padding: 0;
}

/*
----------------------
求人リストへのリンクボタン
*/
.main-link-joblist{

}
.main-link-joblist ul{
list-style:none;
padding:0;
margin:0;

}
.main-link-joblist li{
display: inline-block;
text-align:center;
}

.main-link-joblist li a{
width: 400px;
/*
border:1px solid #60baff;
background:#ceeaff;
text-decoration:none;
border-bottom:3px solid #60baff;
*/
border:1px solid #e0cf6e;
background:#ffebce;
text-decoration:none;
border-bottom:3px solid #cfb84f;
color:#333;
font-weight:bold;
font-size:2.6rem;
display:block;
line-height:1.5;
padding:15px 40px;
border-radius:5px ;
transition:0.3s;
margin: 0 10px;
}

.main-link-joblist li a:hover{
color:#333;
background:#fdff98;
border-radius:5px;
}
.main-link-joblist ul li a svg{
display: inline-block;
margin-right:10px;
}

/*
----------------------
仮登録 誘導ボタン
*/
.main-entrynavi{

}
.main-entrynavi ul{
list-style:none;
padding:0;
margin:0;

}
.main-entrynavi li{
display: inline-block;
text-align:center;
}
.main-entrynavi li:last-child::before{
content:"オススメ！";
display:block;
font-weight: bold;
position: relative;
bottom:-20px;
width:50%;
margin: 0 auto;
font-size: 1.6rem;
padding: 3px 20px;
border-radius: 20px;
background:#db3434;
color:#fff;
margin-bottom:10px;

}
.main-entrynavi li a{
width: 230px;
border:1px solid #60baff;
background:#ceeaff;
text-decoration:none;
border-bottom:3px solid #60baff;
color:#333;
font-weight:bold;
font-size:2.6rem;
display:block;
line-height:1.5;
padding:15px 40px;
border-radius:5px ;
transition:0.3s;
margin: 0 10px;
}

.main-entrynavi li a:hover{
color:#fff;
background:#3498db;
border-radius:5px;
}
.main-entrynavi ul li a svg{
display: inline-block;
margin-right:10px;
}


.entryinfo{
background:#edf3f8;
padding:15px 20px;
margin:40px auto 20px;
width:auto;
max-width:810px;
border-radius:10px;
font-size: 1.8rem;
}

.entryinfo-tel-intro{
margin:20px auto;
padding:20px;
background:#fff;
border-radius:5px;
}
.entryinfo h2{
font-size:2.6rem;
margin-bottom:10px;
padding-bottom:10px;
border-bottom:1px solid #ccc;
color:#094f7e;

}
.entryinfo h2 svg{
margin-right:10px;
}
.tel-button{
display:block;
max-width: 230px;
border:1px solid #ffa760;
color:#fff;
background:#eb7d00;
text-decoration:none;
font-weight:bold;
font-size:3rem;
line-height:1.5;
padding:10px 25px;
border-radius:5px;
transition:0.3s;
margin: 0 auto;
}
.tel-button:hover{
color:#fff;
background:#ffb25a;
border-radius:5px;
}
.tel-button span {
    display:block;
    font-size:1.5rem;
}
.entryinfo-tel-list{
display: block;
margin:30px auto;
}
.entryinfo-tel-list h3{
font-size:2rem;
margin-bottom:10px;
border-bottom:1px solid #ccc;
}
.entryinfo-tel-list p{
font-size:1.8rem;
line-height:1.5;
margin:0;
padding:0;
}
.map-button{
display:inline-block;
border:1px solid #ffa760;
color:#fff;
background:#eb7d00;
text-decoration:none;
font-weight:bold;
font-size:1.6rem;
line-height:1.5;
padding:2px 12px;
border-radius:5px ;
transition:0.3s;
margin: 0 auto 0 10px;
}
.map-button:hover{
color:#fff;
background:#ffb25a;
border-radius:5px;
}
.shokai-terms-wrapper{
  margin-top: -20px;
}

/*
==================================================
フォーム用スタイル
*/

/* フォームコンテナ */
.shokai-entryform {
max-width: 800px;
margin: 20px auto;
padding: 25px;
background-color: #fff;
border-radius: 8px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

/* ヘッダー */
.shokai-entryform h3 {
font-size: 2.4rem;
color: #2c3e50;
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 2px solid #3498db;
}

/* フォーム説明文 */
.shokai-entryform > p {

color: #555;
}

.note-required span{
font-size: 14px;
color: #e74c3c;
padding: 10px;
}

/* 必須項目の表示 */
/*
.shokai-entryform > p:nth-child(3) {
font-size: 14px;
color: #e74c3c;
margin-bottom: 25px;
padding: 10px;
background-color: #fff5f5;
border-left: 4px solid #e74c3c;
}
*/

/* フォーム項目コンテナ */
.shokai-entryform-item{
width:500px;
margin:auto;
display: grid;
grid-template-columns: 150px auto;
gap: 10px 0;
align-items: center;
border-bottom:1px dotted #ccc;
}
.shokai-entryform-item.address{
align-items:normal;
}

.shokai-entryform-item p{
text-align: left;
}
.shokai-entryform-item p label{
display:inline-block;
}
/* フォーム項目ラベル */
.shokai-entryform-item > p:first-child {
font-weight: bold;
margin-bottom: 8px;
color: #2c3e50;
/*position: relative;*/
text-align: center;
}

/* 必須項目のマーク（全ての項目に適用する場合） */
.shokai-entryform-item.required > p:first-child::after {
content: "*";
color: #e74c3c;
margin-left: 5px;
}

/* 入力フィールド共通スタイル */
input[type="text"], 
input[type="email"], 
input[type="tel"], 
input[type="number"],
input[type="file"],
select, 
textarea {
width: 100%;
padding: 10px;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 16px; 
box-sizing: border-box;
}

/* 入力フィールドフォーカス時 */
input:focus, 
select:focus, 
textarea:focus {
border-color: #3498db;
box-shadow: 0 0 0 3px rgba(52, 152, 219, 0.2);
outline: none;
}

.shokai-entryform-item.name p{
width: 100%;
}
/* 名前・フリガナ入力欄の調整 */
.shokai-entryform-item.name input{
width: 150px;
display: inline-block;
}

/* ラジオボタンラベルを作成 */
.shokai-entryform-item.gender label {
border:1px solid #999;
border-radius:30px;
padding:10px 20px;
margin:0 10px;
}
.shokai-entryform-item.gender label:has(input:checked) {
background-color: #fff9d5;

}

/* 生年月日セレクトボックス調整 */
.shokai-entryform-item.birthday input {
width: 70px;
}

.shokai-entryform-item.birthday select {
width: 60px;
margin-right: 5px;
padding-right: 5px;
}


/* 年月日のテキスト */
.shokai-entryform-item.birthday p:last-child span {
margin: 0 5px;
white-space: nowrap;
}



/* 
-------------------------------------------------------
住所 */

.shokai-entryform-item.address span{
display:block;
margin-top:15px;
}
.shokai-entryform-item.address span:first-child{
margin-top: 0;
}

.shokai-entryform-item.address select{
width:100px;
display:inline-block;
}
.shokai-entryform-item.address input{
width:350px;
display:inline-block;
}
.shokai-entryform-item.address input:first-of-type {
width: 100px;
margin-left:5px;
}


/* 
-------------------------------------------------------
電話・メール */
.shokai-entryform-item.phone input,
.shokai-entryform-item.mailaddress input{
width:350px;
display:block;
margin:0 auto;

}

.shokai-entryform-item.inquiry textarea{
width:350px;
display:block;
margin:0 auto;
} 

/* ファイル選択ボタン */
input[type="file"] {
padding: 8px;
background-color: #f8f8f8;
}

/* 送信ボタンコンテナ */
.shokai-entryform-action {
text-align: center;
margin-top: 30px;
}

/* 送信ボタン */

.shokai-entryform-action input {
background-color: #eb7d00;
color: white;
border: none;
padding: 12px 50px;
font-size: 2.6rem;
border-radius: 4px;
cursor: pointer;
transition: background-color 0.3s;
font-weight: bold;
}

.shokai-entryform-action input:hover {
color: #fff;
background: #ffb25a;
border-radius: 5px;
}

/* テキストエリア調整 */
textarea {
min-height: 120px;
resize: vertical;
}

/* エラー表示用 */
.error {
color: #e74c3c;
font-size: 14px;
margin-top: 5px;
display: block;
}

input.error-field, 
select.error-field, 
textarea.error-field {
border-color: #e74c3c;
background-color: #fff9f9;
}

/* 規約用 */
.shokai-terms{
width:auto;
max-width:600px;
height:120px;
overflow: auto;
border:1px solid #ddd;
margin: 20px auto;
padding: 10px 20px;
background:#fff;
border-radius:5px;
text-align: left;
}
.shokai-terms p{
font-size:1.4rem;
line-height:1.5;
margin:0;
padding:0;
}
.shokai-terms .title{
font-size:2rem;
margin-bottom:10px;
padding-bottom:5px;
border-bottom:1px solid #ccc;
}
.shokai-terms .kitei-section{
margin:20px 0;
}

.shokai-terms .kitei-section p.sub-title{
font-size:1.8rem;
margin-bottom:10px;
padding-bottom:10px;
border-bottom:1px solid #ccc;
}
.shokai-terms .kitei-section ul{
list-style:disc inside;
padding:0;
margin:20px 0;
}
.shokai-terms .kitei-section ul li{
font-size:1.4rem;
line-height:1.5;
margin:0;
padding:0 0 5px 20px;
position:relative;
}
.kitei-inquiry{
margin:20px 0;
padding:0 20px;
background:#fff;
border-radius:5px;
}
/* 
------------------------------------------------------
モバイル対応（レスポンシブデザイン） */
@media (max-width: 768px) {

    .main{
    width:calc(100% - 40px);
    }
    .main-header{
    width: 100%;
    padding:0;
    height: auto;
    }
    .main-header h1{
    padding:0;
    margin: 0;
    }
    .main-header-image {
    margin:0; 
    padding:0;
    width:100%;
    }

    .main-shokai-info p{
    font-size: 1.5rem;
    padding: 0;
    }
    .main-intro{
    padding: 10px 20px;
    margin: 20px auto;
    }
    .main-intro p {
    font-size: 1.5rem;
    line-height: 1.5;
    padding: 0;
    }
    .main-link-joblist li,
    .main-entrynavi li{
        width: 100%;
        max-width: 400px;
    }
    .main-link-joblist li{
        margin-bottom: 30px;
    }
    .main-link-joblist li a {
    width: auto;
    font-size:1.7rem;
    padding:15px 15px;
    }
    .main-entrynavi li a {
    width: auto;
    font-size:2.2rem;
    padding:15px 40px;
    }
    .entryinfo{
    font-size: 1.5rem;
    }

    .entryinfo-tel-intro{
    font-size: 1.6rem;
    }

    .entryinfo h2{
    font-size:2rem;
    }
    .tel-button {
    font-size:2.8rem;
    }
    .tel-button span {
    display:block;
    font-size:1.25rem;
    }
    .entryinfo-tel-list p {
    font-size: 1.5rem;
    }

    .shokai-entryform {
    padding: 15px;
    margin: 10px 0;
    }

    .shokai-entryform h1 {
    font-size: 20px;
    }
    .shokai-entryform h3 {
    font-size: 2rem;
    }

    /* フォーム項目コンテナ */
    .shokai-entryform-item{
    width:auto;
    margin:auto;
    display: block;
    border-bottom:1px dotted #ccc;
    }

    .shokai-entryform-item > p:first-child {
        text-align: left;
        font-size: 1.8rem;
        font-weight: bold;
    }

    /* 名前・フリガナ入力欄（モバイル） */

    .shokai-entryform-item.name input,
    .shokai-entryform-item.name-furigana input{
    width: 100%;
    display: block;
    margin-bottom: 10px;
    }


    .shokai-entryform-item.name p:last-child,
    .shokai-entryform-item.name-furigana p:last-child{
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
    align-items: center;
    }

    /* ラジオボタン（モバイル） */
    /*
    .shokai-entryform-item.gender > p:last-child {
    flex-direction: column;
    align-items: stretch;
    }
    */
    .shokai-entryform-item.gender p {
    text-align: center;
    }
    .shokai-entryform-item.gender p label {
    width: auto;

    }


    /* 生年月日（モバイル） - 一行に収まるよう改善 */
    .shokai-entryform-item.birthday p:last-child {
    margin-left:5px;
    }

    .shokai-entryform-item.birthday input {
    width: 70px;
    margin-right: 2px;
    }

    .shokai-entryform-item.birthday select {
    width: 50px;
    padding: 10px 2px;
    margin-right: 2px;
    }

    /* 年月日のラベル（モバイル） */
    .shokai-entryform-item.birthday p:last-child span {
    font-size: 14px;
    margin: 0 2px;
    }

    /* 住所（モバイル） */
    .shokai-entryform-item.address span {
    display: block;
    margin-top: 5px;
    }
    .shokai-entryform-item.address span:first-child {
    margin-top: 0;
    }
    .shokai-entryform-item.address select {
    width: 100%;
    margin-bottom: 10px;
    } 
    .shokai-entryform-item.address input {
    width: 100%;
    margin-bottom: 10px;
    }

    /* 電話・メール（モバイル） */
    .shokai-entryform-item.phone input{
    width: 100%;
    margin-bottom: 10px;
    }

    /* メール（モバイル） */
    .shokai-entryform-item.mailaddress input{
    width: 100%;
    margin-bottom: 10px;
    }

    /* お問合せ内容（モバイル） */
    .shokai-entryform-item.inquiry textarea{
    width: 100%;
    margin-bottom: 10px;
    }

    /* 履歴書・職務経歴書（モバイル） */
    .shokai-entryform-item.resume input,
    .shokai-entryform-item.career input{
    width: 100%;
    font-size:90%;
    margin-bottom: 10px;
    }

    .shokai-terms .title {
    font-size: 1.5rem;
    }
    .shokai-terms p {
    font-size: 1.3rem;
    }
    .shokai-terms .kitei-section p.sub-title {
    font-size: 1.4rem;
    }
    .shokai-terms .kitei-section ul li {
    font-size: 1.3rem;
    }
    /* 送信ボタン（モバイル） */
    .shokai-entryform-action input {
    width: 90%;
    padding: 15px;
    }

    footer p{
    font-size: 1.2rem;
    padding: 0 10px;
    }
}
/*
モバイル ここまで
------------------------------------------------------
*/

/* 入力補助スタイル */
.input-helper {
font-size: 12px;
color: #7f8c8d;
margin-top: 5px;
}

/* フォーム進捗表示（オプション） */
.form-progress {
margin-bottom: 30px;
display: flex;
justify-content: space-between;
position: relative;
}

.form-progress::before {
content: "";
position: absolute;
top: 15px;
left: 0;
right: 0;
height: 2px;
background: #ddd;
z-index: 1;
}

.progress-step {
position: relative;
z-index: 2;
background: #fff;
width: 30px;
height: 30px;
border-radius: 50%;
border: 2px solid #ddd;
display: flex;
align-items: center;
justify-content: center;
font-weight: bold;
}

.progress-step.active {
border-color: #3498db;
background: #3498db;
color: white;
}

