/**
Theme Name: Astar child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astar-child
Template: astra
*/

/*問い合わせフォーム */

/*Contact Form 7カスタマイズ*/
/*スマホContact Form 7カスタマイズ*/
@media(max-width:500px){
.inquiry th,.inquiry td {
 display:block!important;
 width:100%!important;
 border-top:none!important;
 -webkit-box-sizing:border-box!important;
 -moz-box-sizing:border-box!important;
 box-sizing:border-box!important;
}
.inquiry tr:first-child th{
 border-top:1px solid #d7d7d7!important;
}
/* 必須・任意のサイズ調整 */	
.inquiry .haveto,.inquiry .any {	
font-size:10px;
}}
/*見出し欄*/
.inquiry th{
 text-align:left;
 font-size:14px;
 color:#444;
 padding-right:5px;
 width:30%;
 background:#f7f7f7;
 border:solid 1px #d7d7d7;
}
/*通常欄*/
.inquiry td{
 font-size:13px;
 border:solid 1px #d7d7d7;	
}
/*横の行とテーブル全体*/
.entry-content .inquiry tr,.entry-content table{
 border:solid 1px #d7d7d7;	
}
/*必須の調整*/
.haveto{
 font-size:7px;
 padding:5px;
 background:#ff9393;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:relative;
 bottom:1px;
}
/*任意の調整*/
.any{
 font-size:7px;
 padding:5px;
 background:#93c9ff;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:relative;
 bottom:1px;
}
/*ラジオボタンを縦並び指定*/
.verticallist .wpcf7-list-item{
 display:block;
}
/*送信ボタンのデザイン変更*/
#formbtn{
 display: block;
 padding:15px;
 width:350px;
 background:#ffaa56;
 color:#fff;
 font-size:18px;
 font-weight:bold;	 
 border-radius:2px;
 margin:25px auto 0;
}
/*送信ボタンマウスホバー時*/
#formbtn:hover{
 background:#fff;
 color:#ffaa56;
 border:2px solid #ffaa56;
}


/*-----------------*/
/*勤怠管理各ボタン設定*/
/*---start---------*/

/* 共通のフォームスタイル */
.kintai-kanri-form {
    max-width: 500px;
    margin: 0 auto;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: #f9f9f9;
}

.kintai-kanri-form label {
    font-weight: bold;
    margin-bottom: 5px;
    display: block;
}

.kintai-kanri-form input[type="text"],
.kintai-kanri-form input[type="password"],
.kintai-kanri-form select {
    width: 100%;
    padding: 8px;
    margin-bottom: 15px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

/* ログインボタンと新規登録ボタンを横並びに配置 */
.kintai-kanri-buttons {
    display: flex;                 /* フレックスボックスで横並び */
    justify-content: space-between; /* ボタン間にスペースを設定 */
    gap: 20px;                     /* ボタン間の隙間を20pxに設定 */
    margin-top: 20px;              /* ボタンとフォームの間に余白を追加 */
    margin-bottom: 20px;           /* ボタン下に余白を追加 */
}

button#kintai-kanri-login-btn,
a.button.orange {
    display: inline-flex;           /* フレックスボックスで中央揃え */
    justify-content: center;        /* 横方向の中央揃え */
    align-items: center;            /* 縦方向の中央揃え */
    width: 144px;                   /* ボタンの幅 */
    height: 72px;                   /* ボタンの高さ */
    font-size: 16px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    text-align: center;
    text-decoration: none;          /* リンクの下線を削除 */
}

button#kintai-kanri-login-btn {
    background-color: #007bbb;      /* ログインボタンの背景色 */
    color: white;
}

a.button.orange {
    background-color: orange;       /* 新規登録ボタンの背景色 */
    color: white;
}

a.button.orange:hover {
    background-color: darkorange;   /* 新規登録ボタンのホバー時の色 */
}

/* ボタンホバー時の効果 */
button#kintai-kanri-login-btn:hover,
a.button.orange:hover {
    opacity: 0.9;
}

/* 出勤・退勤ボタンのスタイル */
input#kintai-kanri-clock-in-btn,
input#kintai-kanri-clock-out-btn {
    width: 144px;
    height: 72px;
    color: white;
    font-size: 16px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    display: flex;                 /* フレックスボックスで中央揃え */
    justify-content: center;        /* 横方向の中央揃え */
    align-items: center;            /* 縦方向の中央揃え */
    text-align: center;             /* 文字の中央揃え */
    margin-bottom: 10px;            /* ボタン下に余白を追加 */
}

input#kintai-kanri-clock-in-btn {
    background-color: #38b48b;      /* 出勤ボタンの色 */
}

input#kintai-kanri-clock-out-btn {
    background-color: #c53d43;      /* 退勤ボタンの色 */
}

/* ボタンホバー時の効果 */
button#kintai-kanri-login-btn:hover,
a.button.orange:hover,
input#kintai-kanri-clock-in-btn:hover,
input#kintai-kanri-clock-out-btn:hover {
    opacity: 0.9;
}

/* ログアウトボタンのスタイル */
button.kintai-kanri-logout {
    width: 96px;                  /* 幅を2/3に設定 */
    height: 36px;                 /* 高さを半分に設定 */
    background-color: #dcdddd;    /* 背景色 */
    color: black;                 /* テキスト色 */
    font-size: 16px;
    border: none;                 /* 枠線を削除 */
    border-radius: 5px;           /* 角を丸くする */
    cursor: pointer;
    text-align: center;
    display: inline-flex;         /* フレックスボックスで中央揃え */
    justify-content: center;      /* 横方向の中央揃え */
    align-items: center;          /* 縦方向の中央揃え */
    text-decoration: none;        /* テキストの下線を削除 */
}

/* ログアウトボタンのホバー時の効果 */
button.kintai-kanri-logout:hover {
    background-color: #b0b0b0;    /* ホバー時に少し濃い色に */
    opacity: 0.9;                 /* ホバー時のエフェクト */
}

/* メッセージ表示のスタイル */
.kintai-kanri-message {
    margin-top: 20px;
    padding: 10px;
    border: 1px solid #38b48b;  /* 枠線の色を出勤ボタンと合わせる */
    background-color: #f0fff0;  /* 背景色を淡い緑に */
    color: #38b48b;            /* 文字色を出勤ボタンと合わせる */
    border-radius: 5px;
}

.kintai-kanri-message p {
    margin: 0 0 5px;
}

/* エラーメッセージのスタイル */
.kintai-kanri-error-message {
    margin-top: 20px;
    padding: 10px;
    border: 1px solid #c53d43;  /* エラーメッセージの枠線は退勤ボタンの色に合わせる */
    background-color: #ffe5e5;  /* 背景色は淡い赤に */
    color: #c53d43;            /* エラーメッセージの文字色を赤に */
    border-radius: 5px;
}

/* 備考欄のスタイル */
.kintai-kanri-remarks {
    margin-top: 20px;
}

.kintai-kanri-remarks label {
    font-weight: bold;
    margin-bottom: 5px;
    display: block;
}

.kintai-kanri-remarks textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 16px;
    resize: vertical;
    min-height: 60px;
}

/* 備考欄ホバー時の効果 */
.kintai-kanri-remarks textarea:hover {
    border-color: #007bbb;
    background-color: #f9f9f9;
}

/* 雇用形態のラジオボタンのスタイルを調整 */
div > input[type="radio"] {
    margin-right: 10px;
    margin-left: 10px;
}

/* 動的に追加される手当の入力欄 */
.add-more {
    background-color: #38b48b;
    color: white;
    border: none;
    border-radius: 5px;
    padding: 5px 10px;
    cursor: pointer;
    margin-left: 10px;
}

.add-more:hover {
    opacity: 0.8;
}

/* 雇用形態に基づくフィールドのスタイル */
.kintai-kanri-form label {
    font-weight: bold;
    margin-bottom: 5px;
    display: block;
}

/* 手当入力欄の動的追加ボタンのスタイル */
button.add-more {
    background-color: #007bbb;
    color: white;
    border: none;
    padding: 5px 10px;
    margin-left: 10px;
    cursor: pointer;
    border-radius: 4px;
}

button.add-more:hover {
    background-color: #005f8b;
}

/* フォームの全体レイアウト */
.kintai-kanri-form {
    max-width: 500px;
    margin: 0 auto;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: #f9f9f9;
}

/* エラーメッセージのスタイル */
.kintai-kanri-error-message {
    color: red;
    font-weight: bold;
    margin-top: 10px;
}

/* 備考欄のスタイル */
.kintai-kanri-remarks {
    margin-top: 20px;
}

.kintai-kanri-remarks label {
    font-weight: bold;
    margin-bottom: 5px;
    display: block;
}

.kintai-kanri-remarks textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 16px;
    resize: vertical;
    min-height: 60px;
}

/* 備考欄ホバー時の効果 */
.kintai-kanri-remarks textarea:hover {
    border-color: #007bbb;
    background-color: #f9f9f9;
}

/* 共通のフォームスタイル */
.kintai-kanri-form-group {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.kintai-kanri-form-group label {
    width: 30%; /* ラベルの横幅を30%に設定 */
    font-weight: bold;
}

.kintai-kanri-form-group input[type="text"],
.kintai-kanri-form-group input[type="password"],
.kintai-kanri-form-group select {
    width: 65%; /* 入力欄の横幅を65%に設定 */
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

/* ボタンスタイルを他の画面に合わせる */
.kintai-kanri-register-btn {
    width: 144px;  /* 他のボタンと同じサイズに設定 */
    height: 72px;
    background-color: #007bbb;
    color: white;
    font-size: 16px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.kintai-kanri-register-btn:hover {
    opacity: 0.9;
}

/* ログイン・新規登録ボタンの配置 */
.kintai-kanri-buttons {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}


/* パスワードを忘れた場合のリンクスタイル */
.kintai-kanri-lost-password {
    margin-top: 10px;
    text-align: right;
}

.kintai-kanri-lost-password a {
    color: #007bbb;
    text-decoration: none;
}

.kintai-kanri-lost-password a:hover {
    text-decoration: underline;
}

/* ユーザー編集画面のスタイル */
.kintai-kanri-edit-user-form {
    max-width: 600px;
    margin: 0 auto;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: #f9f9f9;
}

.kintai-kanri-edit-user-form label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}

.kintai-kanri-edit-user-form input[type="text"],
.kintai-kanri-edit-user-form input[type="password"] {
    width: 100%;
    padding: 8px;
    margin-bottom: 15px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.kintai-kanri-edit-user-form button {
    background-color: #007bbb;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.kintai-kanri-edit-user-form button:hover {
    opacity: 0.9;
}

/* 新規登録ボタンのスタイル */
.kintai-kanri-register-btn {
    width: 144px;
    height: 72px;
    background-color: orange;
    color: white;
    font-size: 16px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.kintai-kanri-register-btn:hover {
    background-color: darkorange;
    opacity: 0.9;
}

/* エラーメッセージのスタイル */
.kintai-kanri-error-message {
    color: red;
    font-size: 14px;
}

/* 成功メッセージのスタイル */
.kintai-kanri-success-message {
    color: green;
    font-size: 14px;
}

/* 共通のフォームスタイル */
.kintai-kanri-form {
    max-width: 500px;
    margin: 0 auto;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: #f9f9f9;
}

.kintai-kanri-form label {
    font-weight: bold;
    margin-bottom: 5px;
    display: block;
}

.kintai-kanri-form input[type="text"],
.kintai-kanri-form input[type="password"],
.kintai-kanri-form select {
    width: 100%;
    padding: 8px;
    margin-bottom: 15px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

/* ログインボタンと新規登録ボタンのサイズとレイアウトを一致させる */
.kintai-kanri-buttons {
    display: flex;                 
    justify-content: space-between;
    gap: 20px;                     
    margin-top: 20px;              
    margin-bottom: 20px;           
}

button#kintai-kanri-login-btn,
.kintai-kanri-register-btn {
    display: inline-flex;         
    justify-content: center;       
    align-items: center;           
    width: 144px;                 
    height: 72px;                 
    font-size: 16px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
}

button#kintai-kanri-login-btn {
    background-color: #007bbb;
    color: white;
}

.kintai-kanri-register-btn {
    background-color: orange;
    color: white;
}

.kintai-kanri-register-btn:hover {
    background-color: darkorange;
    opacity: 0.9;
}

/* 各フォーム要素を縦並びにするためのレイアウト調整 */
.kintai-kanri-form-group {
    display: block;
    margin-bottom: 15px;
}

/* ボタンホバー時のエフェクト */
button#kintai-kanri-login-btn:hover,
.kintai-kanri-register-btn:hover {
    opacity: 0.9;
}

/* 新規登録画面のフォーム全体のスタイル */
.kintai-kanri-form {
    max-width: 500px;          /* フォームの幅を調整 */
    margin: 0 auto;            /* 中央寄せ */
    padding: 20px;             /* 内側の余白 */
    border: 1px solid #ddd;    /* 枠線 */
    border-radius: 5px;        /* 角を丸くする */
    background-color: #f9f9f9; /* 背景色 */
}

/* 各フォームフィールド（ラベルと入力欄）を縦に並べる */
.kintai-kanri-form-group {
    display: block;            /* 各フィールドをブロック要素にする（縦並び） */
    margin-bottom: 15px;       /* 各フィールド間に余白を追加 */
}

.kintai-kanri-form-group label {
    font-weight: bold;         /* ラベルを太字にする */
    margin-bottom: 5px;        /* ラベルと入力欄の間に余白を追加 */
    display: block;            /* ラベルをブロック要素にして、縦並びにする */
}

.kintai-kanri-form-group input[type="text"],
.kintai-kanri-form-group input[type="password"],
.kintai-kanri-form-group select {
    width: 100%;               /* 入力欄の幅を100%に設定 */
    padding: 8px;              /* 入力欄の内側の余白 */
    border: 1px solid #ccc;    /* 枠線を設定 */
    border-radius: 4px;        /* 角を丸くする */
    box-sizing: border-box;    /* パディングを含めたサイズを設定 */
}

/* 登録ボタンのスタイル */
.kintai-kanri-register-btn {
    width: 144px;              /* ボタンの幅を設定 */
    height: 72px;              /* ボタンの高さを設定 */
    background-color: orange;  /* ボタンの背景色 */
    color: white;              /* ボタンの文字色 */
    font-size: 16px;           /* ボタンの文字サイズ */
    border: none;              /* 枠線を削除 */
    border-radius: 5px;        /* 角を丸くする */
    cursor: pointer;           /* ポインタを変更 */
}

.kintai-kanri-register-btn:hover {
    background-color: darkorange; /* ホバー時の背景色 */
    opacity: 0.9;                /* ホバー時の透明度変更 */
}

/* 登録ボタンと他の要素を適切に配置する */
.kintai-kanri-buttons {
    display: flex;
    justify-content: center;    /* ボタンを中央寄せ */
    margin-top: 20px;           /* 上部に余白を追加 */
}

/* エラーメッセージや成功メッセージのスタイル */
.kintai-kanri-error-message {
    color: red;                 /* エラーメッセージの色 */
    font-size: 14px;
    margin-top: 10px;
}

.kintai-kanri-success-message {
    color: green;               /* 成功メッセージの色 */
    font-size: 14px;
    margin-top: 10px;
}

/*--- 20240921 ADD start ---/

/*--- 20240921 ADD start ---/

/* 新規登録画面のレイアウト修正 */

/* フォーム全体のスタイル */
.kintai-kanri-form {
    max-width: 500px; /* フォームの幅を500pxに制限 */
    margin: 0 auto; /* フォームを中央に配置 */
    padding: 20px; /* 内側の余白を追加 */
    border: 1px solid #ddd; /* 枠線を追加 */
    border-radius: 5px; /* 角を丸くする */
    background-color: #f9f9f9; /* 背景色を淡いグレーに設定 */
}

/* 各フィールドのスタイル */
.kintai-kanri-form-group {
    display: block; /* 各項目をブロック要素として縦並びにする */
    margin-bottom: 15px; /* 各フィールドの間に余白を設ける */
}

.kintai-kanri-form-group label {
    font-weight: bold; /* ラベルを太字にする */
    margin-bottom: 5px; /* ラベルと入力欄の間に余白を追加 */
    display: block; /* ラベルをブロック要素にして縦並びにする */
}

.kintai-kanri-form-group input[type="text"],
.kintai-kanri-form-group input[type="password"],
.kintai-kanri-form-group select {
    width: 100%; /* 入力欄の幅を100%に設定 */
    padding: 8px; /* 内側の余白を追加 */
    margin-bottom: 10px; /* 各フィールドの間に余白を追加 */
    border: 1px solid #ccc; /* 枠線の色をグレーに設定 */
    border-radius: 4px; /* 角を丸くする */
    box-sizing: border-box; /* パディングを含むボックスサイズを設定 */
}

/* 登録ボタンのスタイル */
.kintai-kanri-register-btn {
    width: 144px; /* ボタンの幅を144pxに設定 */
    height: 72px; /* ボタンの高さを72pxに設定 */
    background-color: orange; /* ボタンの背景色をオレンジに設定 */
    color: white; /* ボタンの文字色を白に設定 */
    font-size: 16px; /* ボタンの文字サイズを16pxに設定 */
    border: none; /* ボタンの枠線を削除 */
    border-radius: 5px; /* ボタンの角を丸くする */
    cursor: pointer; /* マウスカーソルをポインタに変更 */
}

.kintai-kanri-register-btn:hover {
    background-color: darkorange; /* ホバー時の背景色を暗いオレンジに設定 */
    opacity: 0.9; /* ホバー時の透明度を少し下げる */
}

/* ボタン配置 */
.kintai-kanri-buttons {
    display: flex; /* フレックスボックスを使用して配置 */
    justify-content: center; /* ボタンを中央揃えにする */
    margin-top: 20px; /* 上部に余白を追加 */
}

/*--- 20240921 ADD end ---/



/*--- 20240921 ADD end ---/

/*---END---------*/