

.mp-main{
border-bottom: 2px solid #e6e6e6;
padding-bottom: 50px;
margin-bottom: 70px;
}

@media only screen and (max-width:480px){
.mp-main{
padding-bottom: 30px;
margin-bottom: 50px;
}
}

.mp-form{
max-width:900px;
margin:auto;
}

/*----------------------------
タブ
----------------------------*/
.mp-wrap {
margin-top: 40px;
}

/* タブ */
.mp-tabs {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
border-bottom: 2px solid #e6e6e6;
gap: 10px;
}

.mp-tab {
color: #333333;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
justify-content: center;
align-items: center;
padding: 15px 18px;
border: none;
background: none;
cursor: pointer;
}


.mp-tab.active {
font-weight: 600;
color: #3071b9;
margin-bottom: -2px;
border-bottom: 4px solid #3071b9;
}

.mp-tab span{
font-size: 0.75em;
color: #ffffff;
font-weight: 600;
line-height: 0;
background: #3071b9;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
justify-content: center;
align-items: center;
width: 18px;
height: 18px;
border-radius: 50%;
margin-left: 5px;
}


/* パネル */
.mp-panel {
display: none;
margin: 50px 0 0;
}

.mp-panel.active {
display: block;
}

@media only screen and (max-width:620px){
.mp-wrap{ margin-top: 20px;}

.mp-tab{
font-size: 0.875em;
padding: 15px 12px;
}
}

@media only screen and (max-width:480px){
.mp-panel {
margin: 30px 0 0;
}

.mp-wrap{ margin-top: 0;}

.mp-tabs {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
border: none;
}

.mp-tab{
width: 48%;
font-size: 0.825em;
padding: 10px 3px;
border: 1px solid #3071b9;
border-radius: 5px;
padding: 7px 5px;
}

.mp-tab.active{
color: #ffffff;
background: #3071b9;
}

.mp-tab.active span{
color: #3071b9;
background: #ffffff;
}

.mp-tab span{
margin-left: 5px;
}

}



/*----------------------------
共通箇所
----------------------------*/
/* タイトル */
.post-mypage h2{
font-size: 1.25em;
color: #3071b9;
margin-bottom: 20px;
}

@media only screen and (max-width: 480px){
.post-mypage h2{
font-size: 1.125em;
}


}



/* カード内のフォーム */
.mp-card{
background:#ffffff;
border:1px solid #e6e6e6;
box-shadow:0 3px 12px rgba(0,0,0,.04);
border-radius:12px;
padding:30px;
margin-bottom: 40px;
}

.mp-card h3{
font-size: 1.125em;
color: #3071b9;
margin-bottom: 0;
}

.mp-card h3 span{
font-size: 0.875em;
}

.mp-card dl{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
align-items: baseline;
padding:16px 0;
border-bottom:1px solid #e6e6e6;
}

.mp-card dl:last-child{
border-bottom:none;
padding-bottom: 0;
}

.mp-card dt{
width:320px;
font-weight:600;
color:#717071;
}

.mp-required{
font-size: 0.625em;
font-weight: 600;
display: inline-block;
line-height: 1;
display: inline-block;
margin-left: 6px;
padding: 4px;
color: #ffffff; 
background: #d0121b;
border-radius: 3px;
vertical-align: middle;
}


.mp-card dd{
flex:1;
line-height: 1.2em;

}

.mp-card dd span{
font-size: 0.75em;
color: #d0121b;
}

.mp-card input{
margin-bottom:5px;
}


/* マイページ内のデザイン */
.post-mypage .d-flex{
justify-content: flex-start;
align-items: flex-start;
}

/* 一覧 */
.post-mypage .archive-post{
width: 18%;
margin-right: 2.5%;
margin-bottom: 40px;
}

.post-mypage .archive-post:nth-of-type(5n){
margin-right: 0;
}
/* 投稿削除 */
.mp-header.d-flex{
justify-content: space-between;
}

.all-clear-text{
cursor:pointer;
color:#3071b9;
font-size:14px;
text-decoration:underline;
}

.all-clear-text:hover{
opacity:.7;
}

@media only screen and (max-width: 768px){
.post-mypage .d-flex{
justify-content: space-between;
}

.post-mypage .archive-post{
width: 48.2%;
margin-right: 0;
}

.post-mypage .archive-post:nth-of-type(2n){
margin-right: 0;
}

}

@media only screen and (max-width: 480px){
.post-mypage .archive-post .moreBtn{
font-size: 0.75em;
padding: 5px 8px;
}

.post-mypage .archive-post .post-description p{
font-size: 0.875em;
}

.post-mypage .archive-post .post-description ul li{
font-size: 0.625em;
}

.post-mypage .archive-post .post-description ul li::before{
padding-left: 15px;
height: 15px;
}

}


/* メッセージ-キーワード */
.mp-message {
font-size: 14px;
line-height: 1.5em;
margin-bottom: 20px!important;
padding: 12px 16px;
border: 1px solid #3071b9;
border-radius: 6px;
background: rgb(18,116,204,0.2);
color: #3071b9;
}

/* エラーメッセージ */
.mp-error {
font-size: 14px;
line-height: 1.5em;
margin-bottom: 20px;
padding: 12px 16px;
border: 1px solid #d0121b;
border-radius: 6px;
background: rgb(195,13,35,0.1);
color: #d0121b;
}


/*----------------------------
プロフィール
----------------------------*/
.profile-wrap{
max-width:900px;
margin: 0 auto;
}

.profile-return-btn{
font-weight: 600;
margin-bottom: 30px;
}

.profile-return-btn a{
color: #d0121b;
display: block;
transition: transform 0.4s ease;
}

.profile-return-btn a:hover{
transform: translateX(-15px);
}


/*----------------------------
応募履歴
----------------------------*/
.mypage-application-table-wrap {
overflow-x: auto;
}

.mypage-application-table {
width: 100%;
border-collapse: collapse;
}

.mypage-application-table th,
.mypage-application-table td {
padding: 12px;
border: 1px solid #717071;
text-align: left;
vertical-align: top;
}

.mypage-application-table th {
width: 12%;
color: #ffffff;
background: #92c6ec;
letter-spacing: 0.08em;
white-space: nowrap;
}

.mypage-application-table th:nth-of-type(2){
width: 8%;
}

.mypage-application-table th:nth-of-type(3),
.mypage-application-table th:nth-of-type(5){
width: 20%;
}

.mypage-application-table th:last-of-type{
width: 10%;
}

.mypage-application-table td {
line-height: 1.6;
}


@media only screen and (max-width: 768px) {
.mypage-application-table-wrap {
overflow-x: visible;
}

.mypage-application-table {
width: 100%;
border-collapse: separate;
border-spacing: 0;
}

.mypage-application-table thead {
display: none;
}

.mypage-application-table tbody,
.mypage-application-table tr,
.mypage-application-table td {
display: block;
width: 100%;
box-sizing: border-box;
}

.mypage-application-table tr {
margin-bottom: 20px;
border: 1px solid #717071;
}

.mypage-application-table td {
padding: 10px 12px 10px 34%;
border: 0;
border-bottom: 1px solid #717071;
position: relative;
min-height: 42px;
word-break: break-word;
}

.mypage-application-table td:last-child {
border-bottom: 0;
}

/* 項目名 */
.mypage-application-table td::before {
content: attr(data-label);
color: #ffffff;
position: absolute;
left: 0;
top: 0;
width: 30%;
height: 100%;
box-sizing: border-box;
display: flex;
align-items: center;
padding: 10px;
background: #92c6ec;
font-weight: bold;
border-right: 1px solid #717071;
}

}

@media only screen and (max-width: 480px) {
.mypage-application-table tr,
.mypage-application-table td{
    font-size: 0.75em;
}

.mypage-application-table td{
    padding: 10px 12px 10px 32%;
}

.mypage-application-table td::before {
	padding: 5px;
}

}


/* パスワード */
.mp-password-text{
font-size: 0.75em;
color:#666;
margin-bottom: 10px;
line-height:1.8;
}

.mp-password-btn{
font-size: 0.875em;
color:#333333;
font-weight:600;
display:inline-flex;
align-items:center;
padding:8px 10px;
border:1px solid #333333;
border-radius:5px;
transition: ease .4s;
}

.mp-password-btn:hover{
color:#ffffff;
background:#333333;
}


/* 申請ボタン */
.mp-edit-box{
text-align:center;
padding: 35px;
margin-top:40px;
}

.mp-edit-box h3{
font-size: 1.125em;
margin-bottom:5px;
}

.mp-edit-box p{
font-size: 0.875em;
margin-bottom: 20px;
}


/* 背景あり */
.mypage-profile .mp-edit-box{
background:#e6e6e6;
border-radius:12px;
}

@media only screen and (max-width:620px){
.mp-card dt{
width:100%;
margin-bottom: 0.3em;
}
}

@media only screen and (max-width:480px){
.mp-card{padding: 20px;}
.mp-edit-box{padding: 20px;}

.mp-card dt,
.mp-card dd{
font-size: 0.875em;
}

.mp-btn a,
.mp-from-btn {
padding: 8px 12px;
}

}


/*----------------------------
フォームボタン
----------------------------*/
.mp-btn a,
.mp-from-btn,
.mp-auth-wrap button,
#wp-submit,
#wpmem_register_form .buttons,
#wpmem_register_form input[type="submit"]{
color: #ffffff;
display: inline-block;
border: 2px solid #3071b9;
background: #3071b9;
border-radius:5px;
padding: 10px 15px;
transition: ease .4s;
cursor: pointer;
}

.mp-btn a:hover,
.mp-from-btn:hover,
.mp-auth-wrap button:hover,
#wp-submit:hover,
#wpmem_register_form .buttons:hover,
#wpmem_register_form input[type="submit"]:hover{
color:#3071b9;
background:#ffffff;
}



/*----------------------------
応募内容の確認
----------------------------*/
.mp-application-form{
max-width:900px;
margin:auto;
}


.mp-application-form h2 {
font-size: 1.25em;
margin-bottom: 20px;
}

.mp-application-form p{
font-size: 1.125em;
margin: 0;
}


.mp-note{
font-size: 0.875em;
margin-bottom:25px;
}

.mp-form dl{
border-bottom:1px solid #e6e6e6;
padding: 40px 0;
}

.mp-form dl:last-of-type{margin: 0;}

.mp-form dt{
line-height: 1.4em;
font-weight:bold;
}

.mp-form dt a{
font-size: 0.825em;
color: #d0121b;
border-bottom: 1px solid #d0121b;
}

.mp-form input,
.mp-form select{
width:100%;
padding:10px 14px;
border:1px solid #e6e6e6;
border-radius:6px;
font-size:15px;
}

@media only screen and (max-width:768px){
.mp-form dl{
padding: 25px 0;
}

}


/*----------------------------
ログイン・新規会員
----------------------------*/
.mp-guest{
max-width: 700px;
margin: 0 auto;
text-align: center;
}

.mp-guest-text{
margin-bottom:30px;
}

.mp-guest-card{
display:flex;
gap:20px;
justify-content:center;
margin-bottom: 30px;
}

.mp-guest-box{
width: 40%;
}

.mp-guest-box a{
display: block;
padding:24px;
border:1px solid #e6e6e6;
border-radius:12px;
text-decoration:none;
color:#333333;
transition:.2s;
background:#fff;
}


.mp-guest-box h3{
margin-bottom:6px;
}

.mp-guest-box p{
font-size:0.75em;
margin: 0;
}

/*ログイン */
#wpmem_login, #wpmem_msg, #wpmem_reg, .wpmem_msg{
max-width:900px;
margin: 0 auto!important;
}

#wpmem_reg{
max-width:900px;
margin: 0 auto;
padding:30px;
background:#fff;
border:1px solid #e6e6e6;
border-radius:12px;
}

.mp-login-form{
max-width:480px;
margin:60px auto 0;
padding:30px;
background:#fff;
border:1px solid #eee;
border-radius:12px;
text-align:center;
}

.mp-login-form input{
margin-bottom: 20px;
}


@media only screen and (max-width: 480px){
.mp-login-form{
padding: 20px;
margin: 20px auto 0;
}

}


/*会員登録 */
#wpmem_login, 
#wpmem_reg{
font-family: '游ゴシック Medium', '游ゴシック体', 'Yu Gothic', YuGothic, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Meiryo, メイリオ, 'MS PGothic', 'ＭＳ Ｐゴシック', sans-serif!important;
color: #333333!important;
}

#wpmem_login fieldset, 
#wpmem_reg fieldset{
margin: 0!important;
}

#wpmem_login legend, 
#wpmem_reg legend{
font-size: 1.25em!important;
color: #3071b9;
margin-bottom: 30px!important;
}

/* チェックボックス */
.wpmem_field label,
.mp-checkbox label {
display: inline-flex;
align-items: center;
gap: 6px;
}

.wpmem_field input[type="checkbox"],
.mp-checkbox input[type="checkbox"] {
width: auto;
margin: 0;
}

.div_multicheckbox {
display: flex;
flex-wrap: wrap;
gap: 6px 16px;
}

.multicheckbox-item {
display: inline-flex;
align-items: center;
gap: 4px;
white-space: nowrap;
}

#wpmem_register_form .multicheckbox-item label{
margin: 0;
}

#wpmem_register_form .multicheckbox-item input{
width: auto;
}

.mp-checkbox{
margin-bottom: 8px;
display: block;
}


/* フォーム入力 */
.mp-auth-wrap input,
#loginform input{
width:100%;
padding:12px 14px;
border:1px solid #e6e6e6;
border-radius:8px;
box-sizing:border-box;
}

.mp-auth-wrap button{
margin-top: 20px;
}


/* リンク */
.mp-auth-links{
margin-top:15px;
font-size:13px;
}

.mp-auth-links a{
margin: 0 5px;
}


/* フィールド全体 */
#wpmem_register_form fieldset{
border:none;
padding:0;
}

/* ラベル */
#wpmem_register_form label{
display:block;
margin-top:15px;
}

/* input/select全部統一 */
#wpmem_register_form input,
#wpmem_register_form select{
width:100%;padding:12px 14px;
border:1px solid #e6e6e6;
border-radius:8px;
font-size:14px;
box-sizing:border-box;
}


/* 必須表示 */
.req-text{
font-size:0.75em;
margin-top:10px;
}

#wpmem_reg .div_text,
#wpmem_reg .div_select{
margin-bottom:30px!important;
}

#wpmem_reg legend{
font-weight:bold;
margin-bottom:15px;
}


/* お気に入りの調整 */
.mypage article ul{display: block;}
.mypage article ul li{width: 100%;text-align: justify;}


.mypage ul li,
.register_links li{
font-size: 1.25em;
width: 48%;
text-align: center;
}

.mypage ul li a,
.register_links li a{
color: #ffffff;
background: #717071;
border: 2px solid #717071;
display: block;
letter-spacing: 0.1em;
padding: 15px;
border-radius: 15px;
transition: ease .4s;
}

.mypage ul li a:hover,
.register_links li a:hover{
color: #717071;
background: #ffffff;
}


@media only screen and (max-width: 480px){
.mypage ul li,
.register_links li{font-size: 0.875em;}
.mypage ul li a,
.register_links li a{
padding: 6px;
border-radius: 10px;
}

}


/* single.phpに記載されているボタン */
/* お気に入り */
/* ボタンデザイン */
.mem-add-favorite {
color: #ffffff;
padding: 5px 16px;
border-radius: 4px;
border: 1px solid #3071b9;
background: #3071b9;
cursor: pointer;
transition: all .2s ease;
margin-bottom: 30px;
cursor: pointer;
}

/* ボタンデザイン */
.mem-add-favorite.is-active{
background: #b4b4b5;
border-color: #b4b4b5;
}

.mem-add-favorite span{
color: #fac03d;
}

.mem-add-favorite.is-active span{
color: #ffffff;
}



/*----------------------------
マイページの類似求人
----------------------------*/
.mypage-history-related{
margin-bottom: 40px;
}

.mypage-history-related h2,
.mypage-application-related h2{
margin-left: 50px;
}

.resemble-post{
border: 2px solid #3071b9;
border-radius: 20px;
padding: 20px;
margin: 0 10px;
}

.resemble-post a{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
justify-content: space-between;
}

.resemble-post .post-thumbnail{
width: 45%;
}

.resemble-post .post-description{
width: 52%;
}

.resemble-post .post-description h3{
font-size: 1.125em;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
line-clamp: 1;
}

.resemble-post .post-description ul li{
font-size: 0.875em;
margin-bottom: 0.3em;
}

.resemble-post .post-description p{
font-size: 1.125em;
font-weight: 600;
margin-top: 0.5em;
text-align: right;
}

.resemble-post .post-description .jobmore{
font-size: 0.75em;
padding: 2px 10px;
margin-top: 15px;
}


@media only screen and (max-width: 480px){
.mypage-history-related{
margin-bottom: 0;
width: 92%;
margin: 0 auto 30px;
}

.mypage-history-related h2,
.mypage-application-related h2{
margin-left: 0;
text-align: center;
}


.resemble-post .post-thumbnail,
.resemble-post .post-description{
width: 100%;
}

.resemble-post .post-thumbnail{margin-bottom: 10px;}

.resemble-post{
padding: 15px;
border-radius: 10px;
}

.resemble-post .post-description h3{
font-size: 1em;
}

.resemble-post .post-description ul li{
font-size: 0.75em;
line-height: 1.4em;
}

.resemble-post .post-description ul li::before{
padding-left: 18px;
height: 18px;
}

.resemble-post .post-description p{font-size: 1em;}

}


/*----------------------------
応募ボタンに関して
----------------------------*/

#apply-box{text-align: center;}


/* 応募する前のログイン・会員登録のボタン*/
.memberBtn{
font-size: 1.25em;
font-weight: 600;
margin-bottom: 30px;
}

.memberBtn a{
color: #ffffff;
border: 3px solid #d0121b;
background: #d0121b;
text-align: center;
transition: ease .4s;
padding: 19px 15px;
border-radius: 15px;
display: block;
}


/* 応募ボタン */
.jobBtn{
max-width: 300px;
margin: 0 auto;

}

.jobBtn a{
display: block;
transition: ease .4s;
}

.jobBtn a:hover{
transform: scale(1.05);	
}

.jobBtn a:hover img{
opacity: 1;
}


/* 応募済みボタン */
.jobBtn .jobBtn-sent{
font-size: 1.125em;
border: 3px solid #b4b4b5;
background: #b4b4b5;
width: 100%;
padding: 15px;
margin-bottom: 15px;
}


@media only screen and (max-width: 520px){
.jobBtn{max-width: 220px;}

.jobBtn .jobBtn-sent{
padding: 10px;
}

}


/*----------------------------
お気に入りの有無
----------------------------*/
.favorite-status{
width: 50px;
}

.favorite-status img{
width: 100%;
}




/**
 * =====================================================
 * 利用規約モーダル用CSS
 * helpers.php の members_terms_modal_markup() から読み込まれる
 * =====================================================
 */

/*
 * サイトのフロートボタン等がこれより高いz-indexを
 * 持っていても上に来ないよう、十分大きな値にしている
 */
.mp-terms-modal {
	position: fixed;
	inset: 0;
	z-index: 2147483000;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 0.25s ease;
}
.mp-terms-modal.is-open {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}
.mp-terms-modal-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.5);
}
.mp-terms-modal-box {
	position: relative;
	max-width: 1000px;
	width: 92%;
	height: 80vh;
	margin: 5vh auto;
	background: #fff;
	border-radius: 8px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transform: translateY(16px) scale(0.98);
	transition: transform 0.25s ease;
}
.mp-terms-modal.is-open .mp-terms-modal-box {
	transform: translateY(0) scale(1);
}
.mp-terms-modal-close {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 36px;
	height: 36px;
	border: none;
	background: rgba(255, 255, 255, 0.9);
	border-radius: 50%;
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	z-index: 1;
}
.mp-terms-modal-body {
	flex: 1;
	width: 100%;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	box-sizing: border-box;
	padding: 40px 0;
}
.mp-terms-modal-body .content-wrapper{
	padding: 0;
}
.mp-terms-modal-body .fixity-tit{
	font-size: 2.5em;
	padding: 20px 0 30px;
}
.mp-terms-modal-body h2{
	font-size: 1.25em;
}
.mp-terms-modal-body .fixity-col h3{
	font-size: 1em;
	margin-bottom: 0.5em;
}
.mp-terms-modal-body .fixity-col ul li,
.mp-terms-modal-body .fixity-col p{
	font-size: 0.875em;
	line-height: 1.6em;
}
.mp-terms-modal-loading {
	text-align: center;
	color: #888;
	padding: 40px 0;
}
.mp-terms-modal-footer {
	flex: 0 0 auto;
	padding: 12px 16px;
	border-top: 1px solid #eee;
	text-align: center;
	background: #fff;
}
.mp-terms-modal-confirm {
	display: inline-block;
	min-width: 220px;
	padding: 10px 24px;
	background: #333;
	color: #fff;
	border: none;
	border-radius: 4px;
	font-size: 14px;
	cursor: pointer;
	transition: background 0.2s ease;
}
.mp-terms-modal-confirm:disabled {
	background: #ccc;
	color: #888;
	cursor: not-allowed;
}
/* 閉じた直後、下のボタンを誤って連続クリックしないためのガード */
.mp-terms-click-guard {
	position: fixed;
	inset: 0;
	z-index: 2147483000;
	background: transparent;
}

@media only screen and (max-width: 520px){
.mp-terms-modal-body .fixity-tit{
	font-size: 1.5em;
	padding: 0 0 10px;
}

.mp-terms-modal-body h2{
	font-size: 1em;
}

.mp-terms-modal-body .fixity-col h3{
	font-size: 0.825em;
	padding: 0.2em 0 0.2em 0.5em;
}
.mp-terms-modal-body .fixity-col ul li,
.mp-terms-modal-body .fixity-col p{
	font-size: 0.75em;
	line-height: 1.4em;
}
}



/* ==================================================
スマホ 用フォーム調整
================================================== */
@media only screen and (max-width:480px){

.mp-form input,
.mp-form select {
font-size: 14px;
padding: 7px 10px;
}


input[type="date"] {
color: #333333!important;
-webkit-appearance: none !important;
appearance: none !important;
display: block !important;
width: 100% !important;
max-width: 100% !important;
box-sizing: border-box !important;
min-width: 0 !important;
height: 40px !important;
min-height: 0 !important;
padding: 7px 10px!important;
background-color: #ffffff !important;
text-align: left !important;
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2'><rect x='3' y='4' width='18' height='18' rx='2'/><path d='M16 2v4M8 2v4M3 10h18'/></svg>") !important;
background-repeat: no-repeat !important;
background-position: right 14px center !important;
background-size: 20px !important;
}


input[type="date"]::-webkit-date-and-time-value {
  text-align: left !important;
  margin: 0 !important;
  min-width: 0 !important;
  width: 100% !important;
}

input[type="date"]::-webkit-datetime-edit,
input[type="date"]::-webkit-datetime-edit-fields-wrapper {
  text-align: left !important;
  justify-content: flex-start !important;
  padding: 0 !important;
}

/* チェックボックス */
.mp-card dd input[type="checkbox"] {
-webkit-appearance: checkbox;
appearance: auto;
width: 14px !important;
    height: 14px !important;
padding: 0 !important;
margin: 0 8px 0 0 !important;
box-sizing: border-box !important;
}

}

}