@charset "utf-8";

/*========================================================
service/css/service_note.css
========================================================*/

a {
	color:#2f50b3;
	text-decoration:none;
}

a :hover{
	color:#2f50b3;
	text-decoration:underline;
}

#pageBody #content{
	float:left;
	width:960px;
}

#pageBody #content .ttlimg{
	margin:0 0 14px 0;
	width:960px;
}

#pageBody #content .blocktext ul{
	float:left;
	margin:0 0 15px 0;
	width:960px;
}

#pageBody #content .blocktext ul li{
	font-size:100%;
}

#pageBody #content .blocktext h1{
	font-size:120%;
	font-weight:bold;
	margin:0 0 10px 0;
}

#pageBody #content .blocktext h1 img{
	float:left;
	margin:0 10px 3px 0;
}

#pageBody #content .blocktext h2{
	font-size:120%;
	font-weight:bold;
	margin:0 0 10px 0;
}

#pageBody #content .blocktext h2 img{
	float:left;
	margin:0 10px 3px 0;
}

table.serviceForm {
	margin-top: 0.2em;
	margin-bottom: 1em;
	border-collapse: separate;
	border-spacing: 2px;
	width: 100%;
}

table.serviceForm th, table.serviceForm td {
	padding: 4px 6px;
}

table.serviceForm th {
	background: #eaeaea;
	text-align: left;
	font-size: 120%;
	font-weight: bold;
}

table.serviceForm th span{
	font-size: 80%;
	font-weight: normal;
}

table.serviceForm td {
	background: #f7f8f0;
}

.mb24  {
	margin-bottom:24px;
}

.mb48  {
	margin-bottom:48px;
}

.pause-detail {
	margin-left: 25px;
}

.resume-date-container {
	display: flex;
	flex-direction: row;
}

.resume-date-input {
	width: 160px;
	cursor: text;
}

.resume-date-cmp {
	width: 70%;
}

.message-input {
	width: 400px; 
	height: 48px; 
	ime-mode: active;
}

.input-label {
	display: inline-block;
	cursor: pointer;
}

.gray.info {
	margin-left: 20px;
}

@media screen and (max-width: 480px) {
.radio_area ul{
    list-style-type:none;
}
 
 
.radio_area ul li{
    border-bottom:solid 1px #EEE;
}
 
.radio_area ul li:first-child{
    border-top:solid 1px #EEE;
}

.radio_area ul li:after{
    content:"";
    display: block;
    clear: both;
    height: 0;
    visibility:hidden;
}
 
.radio_area ul li input{
    float:left;
    opacity: 0;
}

.radio_area ul li input[type="radio"]:checked + label {
    background-color: #F08080;
    color:#FFF;
}
 
.radio_area ul li label{
    display:block;
    width:100%;
    padding:0 0 16px 10px;
}

.radio_area ul li label:hover{
    cursor:pointer;
}
}

@media screen and (max-width: 750px) {
	body table.serviceForm td input, body table.serviceForm td select, body table.serviceForm td textarea {
		width: auto !important;
	}

	.mail-header {
		margin-top: 24px;
	}

	body table.serviceForm td input[type="text"],
	body table.serviceForm td input[type="email"] {
		height: 25px;
	}

	.resume-date-container {
		flex-direction: column;
		margin-bottom: 5px;
	}

	.resume-date-cmp {
		width: 100%;
	}

	body table.serviceForm td .resume-date-cmp input[type="month"] {
		width: 65% !important;
		min-width: 160px;
		height: 25px;
	}

	.gray.info {
		margin-left: 0px;
	}

	.gray.suspension {
		margin-bottom: 5px;
	}
}

@media screen and (max-width: 380px) {
	body table.serviceForm td .resume-date-cmp input[type="month"] {
		width: 100% !important;
	}
}

/*========================================================
common/css/base_new.css
========================================================*/

/* @import "header.css"; import廃止→cssを下記に展開 2021.10 sasaki */
/* @import "footer.css"; import廃止→cssを下記に展開 2021.10 sasaki */
/* @import "search.css"; import廃止→cssを下記に展開 2021.10 sasaki */
/*===========================================================
    header.css
===========================================================*/

.breadcrumb-page, .header-pc-wrap, .header-top-wrap, .header-bottom-wrap {
    width: 100%;
    margin: 0 auto;
}


@media screen and (min-width: 1367px) {
    .breadcrumb-page, .header-pc-wrap, .header-top-wrap, .header-bottom-wrap {
        width: 1366px;
    }
}

@media screen and (max-width: 1366px) {
    .breadcrumb-page, .header-pc-wrap, .header-top-wrap, .header-bottom-wrap {
        width: 1000px;
    }

}


/*===========================================================
    footer.css
===========================================================*/


/*===========================================================
    以下、従来のbase_new.css  (import廃止→cssを下記に展開 2021.10 sasaki)
===========================================================*/

/* # footer
---------------------------------------------------------------------------- */
/*----- 優良紹介事業バナー対応 sasaki-s 2020/6/29 */

/*----- 優良紹介事業バナー対応 sasaki-e 2020/6/29 */


/* # pageBody classes
---------------------------------------------------------------------------- */


/* # ぱんくず構造化
---------------------------------------------------------------------------- */

/* # 20190329追加
---------------------------------------------------------------------------- */

/* new css 2021 */

/* .box-category-link /css/top_new.cssに移動 2021/10 sasaki */
/* #searcheConditions リネームして/css/top_new.cssに移動 2021/10 sasaki */
/* .box-category-top /css/top_new.cssに移動 2021/10 sasaki */

/*========================================================
common/css/responsive_new.css
========================================================*/
