@charset "UTF-8";



/* [[=====================================================================]] */
/* [[▼body / #container common]] */
/*===========================================================================*/
body {
	/*color: #333;*/
	/*background: #eee url(https://secure.haj.co.jp/enquete/image/enq_custom/bg.gif) repeat-y center top;*/
}

#container {
	margin: 0 auto;
	background: #fff;
}

a { color: #00f; text-decoration: none;}
a:visited { color: #039; }
a:hover { color: #00f; text-decoration: underline;}
a:active { color: #003; }



/* [[=====================================================================]] */
/* [[▼#header / .inner]] */
/*===========================================================================*/
#header {
	width: 100%;
	padding: 0 20px;
	box-sizing: border-box;
	box-shadow: 0 0 6px 0 rgba(0, 0, 0, .2);
}

#header .inner {
	display: flex;
	max-width: 900px;
    min-height: 80px;
    justify-content: flex-start;
    align-items: center;
    gap: .5rem;
    margin: 0 auto;
	@media (max-width: 640px) {
		flex-direction: column;
	    padding: 1rem 0.5rem 0.5rem;
	}
}

/* ------------------------------------------------------------------------- */
/* [[┠ h1]] */
/*===========================================================================*/
#header h1 {
	flex-shrink: 0;
    width: 300px;
    height: 17px;
    overflow: hidden;
    text-indent: -9999em;
    background: url(https://secure.haj.co.jp/hajsite_common/haj_site_logo/haj_1_1_24.png) no-repeat left top;
    background-size: 300px 17px;
}

/* [[┃┗ img]] */
/*___________________________________________________________________________*/
#header h1 img {
	max-width: 300px;;
}

/* ------------------------------------------------------------------------- */
/* [[┗ ul.pageNavi]] */
/*===========================================================================*/
#header .pageNavi {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	width: 100%;
	padding: 0.5rem 0;
	text-align: right;
}

/* [[　┗ li]] */
/*___________________________________________________________________________*/
#header .pageNavi li {
	display: inline;
	padding: 0 10px;
	font-size: 12px;
	color: #999;
	@media (max-width: 640px) {
		text-align: center;
	}
}

/* [[　　┗ a]] */
/*---------------------------------------------------------------------------*/
#header .pageNavi li a {
	color: #999;
}

#header .pageNavi li a:hover {
	color: #00f;
	text-decoration: underline;
}



/* [[=====================================================================]] */
/* [[▼#contents / .inner]] */
/*===========================================================================*/
#contents {
	width: 100%;
	padding: 0 20px 40px 20px;
	box-sizing: border-box;
}

#contents .inner {
	max-width: 900px;
	margin: 0 auto;
}

/* ------------------------------------------------------------------------- */
/* [[┠ h2：アンケート名]] */
/*===========================================================================*/
#contents h2 {
	position: relative;
    margin-bottom: 3rem;
    font-size: 1.5rem;
    line-height: 2rem;
    text-align: center;
    font-weight: bold;
}

#contents h2:before {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -1rem;
	display: inline-block;
	width: 300px;
	height: 3px;
	transform: translateX(-50%);
	background-color: #fcd113;
}

#contents h2:first-child,
#contents h2.pngbg {
	margin-top: 4rem;
}

/* ------------------------------------------------------------------------- */
/* [[┠ ul.errorInfo：エラーメッセージ]] */
/*===========================================================================*/
#contents .errorInfo {
	margin: 10px 0 0 0;
	padding: 0 10px;
	border: solid 5px #f00;
	-webkit-border-radius:8px;
	-moz-border-radius:8px;
	border-radius:8px;
}

/* [[┃┗ li]] */
/*___________________________________________________________________________*/
#contents .errorInfo li {
	padding: 10px 0;
	border-top: dotted 1px #ccc;
	color: #f00;
	font-weight: bold;
	font-size: 14px;
}

#contents .errorInfo li:first-child {
	border-top: none;
}

/* ------------------------------------------------------------------------- */
/* [[┠ .category]] */
/*===========================================================================*/
#contents .category {
	margin: 40px 0 0 0;
}

#contents h2 + .category,
#contents .errorInfo + .category,
#contents p.confInfo + .category {
	margin-top: 10px;
}

/* [[┃┠ h3]] */
/*___________________________________________________________________________*/
#contents .category h3 {
	margin: 30px 0 0 0;
	padding: 8px;
	color: #333;
	font-weight: bold;
	font-size: 14px;
	background: #fcd113;
}

#contents .category h3:first-child {
	margin-top: 0;
}

/* [[┃┠ p or div.read or div.attention]] */
/*___________________________________________________________________________*/
/*[memo]
#contents p = p.confInfo = 最終確認画面使用
-----------------------------------------------------------------------------*/
#contents p,
#contents .category p,
#contents .category .read,
#contents .category .attention {
	padding: 10px 0 0 0;
	font-size: 14px;
}

#contents .category p + p,
#contents .category p + .read,
#contents .category p + .attention,
#contents .category .read + p,
#contents .category .read + .read,
#contents .category .read + .attention,
#contents .category .attention + p,
#contents .category .attention + .read,
#contents .category .attention + .attention {
	margin-top: 10px;
	border-top: dotted 1px #ccc;
}

#contents .category p:first-child,
#contents .category .read:first-child,
#contents .category .attention:first-child {
	padding-top: 0;
}

/* [[┃┠ .document：個人情報同意書]] */
/*___________________________________________________________________________*/
#contents .category .document {
	margin: 20px 0 0 0;
	padding: 9px 9px 0 9px;
	background: #f6f6f6;
	-webkit-border-radius:8px;
	-moz-border-radius:8px;
	border-radius:8px;
}

#contents .category .document:first-child {
	margin-top: 0;
}

/* [[┃┃┠ iframe]] */
/*---------------------------------------------------------------------------*/
#contents .category .document .frameWrap {
	width: auto;
	height: 150px;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	border: solid 1px #ddd;
}
#contents .category .document iframe {
	width: 100%;
	height: 100%;
	border: none;
	background: #fff;
	display: block;
}

/* [[┃┃┗ p.hajPrivacy]] */
/*---------------------------------------------------------------------------*/
#contents .category .document p.hajPrivacy {
	margin-top: 0;
	padding-top: 0;
	border-top: none;
	/* ▲継承リセット */
	text-align: center;
	padding: 10px 0;
}

/* [[┃┠ dl.ask：設問]] */
/*___________________________________________________________________________*/
#contents .category .ask {
	margin: 10px 0 0 0;
	padding: 10px 0 0 0;
	border-top: solid 1px #ccc;
}

#contents .category .ask:first-child {
	margin-top: 0;
}

/* [[┃┃┠ dt：質問内容]] */
/*---------------------------------------------------------------------------*/
/* [[┃┃┃┠ span.askNumber：番号]] */
/*--------------------------------------------------*/
#contents .category .ask dt .askNumber {
	display: block;
	float: left;
	width: 58px;/* 60px */
	margin: 0 10px 0 0;
	padding: 5px 0;
	border: solid 1px #999;
	color: #333;
	font-weight: bold;
	font-size: 12px;
	text-align: center;
	background: #fff;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
}

#contents .category .ask.error dt .askNumber {
	color: #fff;
	border: solid 1px #f00;
	background: #f00;
}

/* [[┃┃┃┗ span.askText：内容]] */
/*--------------------------------------------------*/
#contents .category .ask dt .askText {
	display: block;
	overflow: hidden;
	zoom: 1;
	padding: 4px 0 0 0;/* .askNumber 同値 */
	color: #000;
	font-weight: bold;
	font-size: 14px;
}

#contents .category .ask.error dt .askText {
	color: #f00;
}

/* [[┃┃┗ dd]] */
/*---------------------------------------------------------------------------*/
#contents .category .ask dd {
	padding: 10px 0 0 70px;
	font-size: 14px;
}

/* [[┃┃　┠ input / select / textarea]] */
/*--------------------------------------------------*/
#contents .category .ask dd input,
#contents .category .ask dd select {
	vertical-align: middle;
	margin: 0 5px 0 0;
}

#contents .category .ask dd input[type=text] {
    padding: 8px;
    border: solid 1px #ccc;
    border-radius: 4px;
    font-size: 14px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

#contents .category .ask dd textarea {
	width: 100%;
    height: 120px;
    padding: 8px;
    border: solid 1px #ccc;
    border-radius: 4px;
    font-size: 16px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/* [[┃┃　┗ label / span.explain]] */
/*--------------------------------------------------*/
#contents .category .ask dd label,
#contents .category .ask dd .explain {
	vertical-align: middle;
	margin: 0 5px 0 0;
}

#contents .category .ask dd textarea + .explain {
	display: block;
	margin-right: 0px;
	margin-top: 5px;
}

/* [[┃┠ table.present：プレゼント]] */
/*___________________________________________________________________________*/
#contents .category .present {
	width: 100%;
	margin: 10px 0 0 0;
	border: solid 5px #eee;
}

#contents .category .present:first-child {
	margin-top: 0;
}

/* [[┃┃┠ th]] */
/*---------------------------------------------------------------------------*/
#contents .category .present th {
	width: 90%;
	vertical-align: middle;
	padding: 10px;
	border-top: solid 5px #eee;
	color: #000;
	font-weight: bold;
	font-size: 14px;
	background: #fff;
}

#contents .category .present tr.error th {
	color: #f00;
	background: #fcc;
}

/* [[┃┃┃┗ input]] */
/*--------------------------------------------------*/
#contents .category .present th input {
	vertical-align: middle;
	margin: 0 5px 0 0;
}

/* [[┃┃┗ td]] */
/*---------------------------------------------------------------------------*/
#contents .category .present td {
	width: 10%;
	vertical-align: middle;
	padding: 10px;
	border-top: solid 5px #eee;
	text-align: center;
	background: #fff;
}

#contents .category .present tr.error td {
	background: #fcc;
}

/* [[┃┗ table.userData：個人情報入力]] */
/*___________________________________________________________________________*/
#contents .category .userData {
	width: 100%;
	margin: 10px 0 0 0;
}

#contents .category .userData:first-child {
	margin-top: 0;
}

/* [[┃　┠ th]] */
/*---------------------------------------------------------------------------*/
#contents .category .userData th {
	width: 10%;
	padding: 10px;
	border: solid 1px #ccc;
	font-size: 14px;
	white-space:nowrap;
	background: #fffff6;
}

#contents .category .userData tr.error th {
	color: #f00;
	background: #fcc;
}

/* [[┃　┗ td]] */
/*---------------------------------------------------------------------------*/
#contents .category .userData td {
	width: 90%;
	padding: 10px;
	font-size: 14px;
	border: solid 1px #ccc;
}

#contents .category .userData tr.error td {
	background: #fcc;
}

/* [[┃　　┠ input / select / textarea]] */
/*--------------------------------------------------*/
#contents .category .userData td input,
#contents .category .userData td select {
	vertical-align: middle;
	margin: 0 5px 0 0;
}

#contents .category .userData td input[type=text],
#contents .category .userData td input[type=tel] {
    padding: 8px;
    border: solid 1px #ccc;
    border-radius: 4px;
    font-size: 14px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

input::placeholder {
	color: #ccc;
	opacity: 1;
}

#contents .category .userData td br + label + input,
#contents .category .userData td br + label + select,
#contents .category .userData td br + .explain + input,
#contents .category .userData td br + .explain + select {
	margin-top: 10px;
}

/* [[┃　　┗ label / span.explain]] */
/*--------------------------------------------------*/
#contents .category .userData td label,
#contents .category .userData td .explain {
	vertical-align: middle;
	margin: 0 5px 0 0;
}

#contents .category .userData td br + label,
#contents .category .userData td br + .explain {
	display: inline-block;
	margin-top: 10px;
}

/* [[┃┗ .takuji_block：託児利用]] */
/*___________________________________________________________________________*/
#contents .category .takuji_block {
	margin-top: 10px;
}

/* ------------------------------------------------------------------------- */
/* [[┗ ul.userJudge：ボタン]] */
/*===========================================================================*/
#contents .userJudge {
	display: flex;
	flex-direction: row-reverse;
	justify-content: center;
	align-items: center;
	margin: 40px 0 0 0;
	padding: 10px;
	text-align: center;
	background: #eee;
	-webkit-border-radius:8px;
	-moz-border-radius:8px;
	border-radius:8px;
	@media (max-width: 640px) {
		flex-direction: column;
		gap: 1rem;
		padding: 20px;
	}
}

/* [[┃┗ li]] */
/*___________________________________________________________________________*/
/*[memo]
下記class名があります
li.agreeNo = 同意しない
li.agreeYes = 同意して次へ進む
li.nextStep = 次画面へ
li.backStep = 戻る
-----------------------------------------------------------------------------*/
#contents .userJudge li {
	margin: 0 10px;
    @media (max-width: 640px) {
		width: 100%;
	}
}

/* [[┃　┗ input]] */
/*---------------------------------------------------------------------------*/
#contents .userJudge li input {
	min-width: 120px;
	cursor: pointer;
}
#contents .userJudge li.agreeYes input,
#contents .userJudge li.nextStep input {
	width: 300px;
    color: #333;
    font-size: 1.125rem;
    line-height: 1.75rem;
    text-align: center;
    font-weight: 700;
    padding: 1rem;
    border: none;
    border-radius: 100px;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .2);
    box-sizing: border-box;
    background: linear-gradient(to bottom, #ffe385 0, #fecc2b 100%);
    @media (max-width: 640px) {
		width: 100%;
	}
}
#contents .userJudge li.agreeYes {
	order: 1;
}
#contents .userJudge li.agreeNo {
	order: 2;
}
#contents .userJudge li.backStep input {
	width: 140px;
    color: #333;
    font-size: 1.125rem;
    line-height: 1.75rem;
    text-align: center;
    font-weight: 700;
    padding: 1rem;
    border: solid 1px #ccc;
    border-radius: 100px;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .2);
    box-sizing: border-box;
    background-color: #fafafa;
    @media (max-width: 640px) {
		width: 100%;
		padding: .5rem 1rem;
	}
}
#contents .userJudge li.agreeNo input {
	width: 140px;
    color: #777;
    font-size: 1.125rem;
    line-height: 1.75rem;
    text-align: center;
    font-weight: normal;
    padding: 1rem;
    border: solid 1px #ccc;
    border-radius: 100px;
    box-sizing: border-box;
    background-color: #fafafa;
    @media (max-width: 640px) {
		width: 100%;
		padding: .5rem 1rem;
	}
}

/* [[┃　┗ .notice]] */
/* ------------------------------------------------------------------------- */
.notice {
	display: block;
	margin-top: 5px;
	font-size: 12px;
	color: #aaa;
}

/* [[=====================================================================]] */
/* [[▼#footer / .inner]] */
/*===========================================================================*/
#footer {
	padding: 10px 20px 20px 20px;
	border-top: solid 1px #d6d6d6;
	border-bottom: solid 1px #d6d6d6;
	background: #f3f3f3;
}

#footer .inner {
	/* 未指定 */
}

/* ------------------------------------------------------------------------- */
/* [[┠ ul.pageNavi]] */
/*===========================================================================*/
#footer .pageNavi {
	margin: 10px 0 0 0;
	text-align: center;
}

/* [[┃┗ li]] */
/*___________________________________________________________________________*/
#footer .pageNavi li {
	display: inline;
	padding: 0 10px;
	border-right: solid 1px #ccc;
	font-size: 12px;
	color: #666;
}

#footer .pageNavi li:first-child {
	border-left: solid 1px #ccc;
}

/* [[┃　┗ a]] */
/*---------------------------------------------------------------------------*/
#footer .pageNavi li a {
	text-decoration: underline;
	color: #666;
}

#footer .pageNavi li a:hover {
	color: #00f;
	text-decoration: underline;
}

/* ------------------------------------------------------------------------- */
/* [[┠ p.copyRight]] */
/*===========================================================================*/
#footer .copyRight {
	margin: 10px 0 0 0;
	text-align: center;
	color: #999;
	font-size: 10px;
}

/* [[┃┗ a]] */
/*___________________________________________________________________________*/
#footer .copyRight a {
	color: #999;
}

#footer .copyRight a:hover {
	color: #00f;
	text-decoration: underline;
}






/* [[=====================================================================]] */
/* [[▽print style]] */
/*===========================================================================*/
@media print {
pre {
	white-space: pre-wrap;
	white-space: -moz-pre-wrap;
	white-space: -o-pre-wrap;
	white-space: -pre-wrap;
	word-wrap: break-word;
}



}/*△print style*/



/* [[=====================================================================]] */
/* [[▽clearfix]] */
/*===========================================================================*/
#contents .category .ask dt,
.clearfix
{ zoom:1; }

#contents .category .ask dt:after,
.clearfix:after
{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	font-size: 0;
	line-height: 0;
}

* html #contents .category .ask dt,
* html .clearfix
{
	display:inline-table;
	/*\*/display:block;/**/
}