/*------------------
Fixed
-------------------*/
#pageTitle ul,
#pagenav ul,
dl.formQue,
.section .wideBox .bdy, 
.section .leftBox50 .bdy,
.section .rightBox50 .bdy,
dl.formQue dd ul.inline,
.btn_area {
	height: auto !important;
}
#my_form {
	overflow: hidden;
}

/*------------------
Utility
-------------------*/
@media screen and (min-width: 980px) {
	.invisible-desktop {
		display: none !important;
	}
}
@media screen and (max-width: 979px) {
	.invisible-mobile {
		display: none !important;
	}
	img {
		max-width: 100%;
		height: auto;
	}
	#header {
		display: flex;
		justify-content: space-between;
		width: 100%;
		height: auto;
		padding-left: 3%;
		padding-right: 3%;
	}
	#header h1 {
		float: none;
	}
	#header .infoBox {
		float: none;
	}
	#header .infoBox .linkBox {
		top: auto;
		left: auto;
		width: 100%;
		padding-top: 8px;
		text-align: right;
	}
	#content,
	#pageTitle {
		width: 100%;
		padding-left: 3%;
		padding-right: 3%;
		box-sizing: border-box;
	}
	#pageTitle {
		line-height: 1.4;
		min-height: auto;
	}
	#pageTitle li {
		font-size: 1.5em;
		padding: 3%;
	}
	.w10, .w20, .w30, .w40, .w50, .w60, .w70, .w80, .w90 {
		width: 100%;
		box-sizing: border-box;
	}
	.scrollable {
		position: relative;
		width: 100%;
		background: linear-gradient(to left, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.2)) 0 0/20px 100%, linear-gradient(to right, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.2)) right/20px 100%;
		background-repeat: no-repeat;
		background-attachment: scroll;
		overflow-x: auto;
	}
	.scrollable table {
		width: 860px;
		background: linear-gradient(to left, rgba(255, 255, 255, 0), white 15px) 0 0/50px 100%, linear-gradient(to right, rgba(255, 255, 255, 0), white 15px) right/50px 100%;
		background-repeat: no-repeat;
		background-attachment: local;
	}
	table.resultTable th,
	table.resultTable td {
		font-size: 0.875em;
	}
	table.resultTable thead th.th01 {
		position: sticky;
		left: 0;
		width: 150px;
	}
	table.resultTable tbody th {
		position: sticky;
		left: 0;
		background-color: #fff;
	}
	.disp_simple {
		padding-left: 0;
	}
	.disp_simple p {
		line-height: inherit;
	}
	.line_2 { margin-bottom: 1em; }
	#pagenav li {
		margin-right: 5px;
		margin-bottom: 5px;
	}
	#pagenav li span {
		font-size: 0.875em;
		padding-left: 14px;
		padding-right: 14px;
	}
	ul.btnNormal li {
		font-size: 1.125em;
		margin-bottom: 0;
	}
	ul.btnNormal li a {
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}
	/*S --- 2023/11/10 DEL ichimura 追加改修対応  */
	/*ul.btnLarge2 li {
		margin-bottom: 0;
	}*/
	/*E --- 2023/11/10 DEL ichimura 追加改修対応  */
	.input-flex {
		display: flex;
		flex-basis: 0;
		flex-grow: 1;
		flex-shrink: 1;
	}
	.input-flex.align-items-center {
		align-items: center;
	}
	.input-flex span {
		white-space: nowrap;
	}
	.select-year {
		flex-basis: auto;
		width: 44%;
	}
	.select-month,
	.select-day {
		flex-basis: auto;
		width: 28%;
	}
	.form-note {
		font-size: 0.688em;
		align-self: center;
		text-align: right;
	}
	.mb {
		margin-bottom: 1em;
	}
	.mb-0 {
		margin-bottom: 0 !important;
	}
	.mr {
		margin-right: 1em;
	}
	.ml {
		margin-left: 1em;
	}
	.mb-sm {
		margin-bottom: 0.5em;
	}
	.mr-sm {
		margin-right: 0.5em;
	}
	.ml-sm {
		margin-left: 0.5em;
	}
	.pb-0 {
		padding-bottom: 0 !important;
	}
	.mobile-message {
		font-size: 0.875em;
		padding-bottom: 14px;
	}
	h2 {
		font-size: 1.25rem;
		height: auto;
		line-height: 1.3;
		padding-top: 6px;
		padding-bottom: 6px;
	}
	h2.orange {
		font-size: 1.25rem !important;
		height: auto !important;
		line-height: 1.3 !important;
	}
	
	.user-footer .user-footer__lower{
    	flex-direction: column;
    	align-items: center;
  	}

  	.user-footer .user-footer__lower .user-footer__link-list,
  	.user-footer .user-footer__lower .copyright{
   	 	margin-bottom: 0.5rem;
    	text-align: center;
  	}
  
	.user-footer .user-footer-info{
    	flex-direction: column;
    	align-items: center;
  	}

  	.user-footer .tel-item,
  	.user-footer .hours-item{
    	justify-content: center;
  	}

  	.user-footer .tel-title{
    	margin-right: 0;
  	}
  	
  	.user-footer .user-footer__lower .user-footer__link-list{
    	flex-wrap: wrap;
    	justify-content: center;
  	}

  	.form-section .btn--extend {
    	padding: 0.25rem 2rem;
  	}
  	
  	.user-footer .company-info{
    	text-align: center;
  	}
	
}

@media screen and (max-width: 450px) {	
  	.user-footer .tel-item,
  	.user-footer .hours-item{
    	flex-direction: column;
    	align-items: center;
  	}
	
}

@media screen and (max-width: 767px) {
	#header {
		flex-direction: column;
	}
	#header h1 {
		width: 100%;
	}
	#header .infoBox {
		width: 100%;
	}
	.box,
	.section .wideBox .title {
		padding: 8% 4%;
	}
	.section .wideBox .bdy {
		padding: 0 !important;
		height: auto;
	}
	table.resultTable th,
	table.resultTable td {
		font-size: 0.813em;
	}
	.section:last-child {
		margin-bottom: 0;
	}
}

@media screen and (max-width: 560px) {
	ul.btn-vertical-mobile {
		display: flex;
		flex-direction: column;
	}
	ul.btn-vertical-mobile > li {
		width: 100%;
	}
	ul.btn-vertical-mobile > li:not(:last-child) {
		margin-bottom: 12px;
	}
}


/*------------------
Rules
-------------------*/
@media screen and (max-width: 767px) {
	.ruleArea .rule_contents,
	.ruleArea .privacy_contents {
		padding: 1em 1em 5em 1em;
	}
	.ruleArea .rule_contents h3, 
	.ruleArea .privacy_contents h3 {
		font-size: 1.25em;
	}
}

/*------------------
Login
-------------------*/
@media screen and (max-width: 767px) {
	/*S --- 2023/08/22 DEL inoue 旧ログイン画面デザイン  */
/*
	.login-buttons__item:nth-child(1) {
		margin-bottom: 20px;
	}
*/
	/*E --- 2023/08/22 DEL inoue 旧ログイン画面デザイン  */
	.login-buttons .submitButton {
		width: 100%;
	}
	dl.formLogin dd {
		margin-bottom: 0;
	}
/*S --- 2023/08/21 ADD inoue ログイン画面デザイン修正対応  */
	.login-design	 {
		display: block;
	}
	/*S --- 2023/11/10 UPD ichimura 追加改修対応  */
	/*.login-design-firstStep{
		height:120px;
	}*/
	.login-design-firstStep{
		height:45px;
	}
	/*E --- 2023/11/10 UPD ichimura 追加改修対応  */
/*E --- 2023/08/21 ADD inoue ログイン画面デザイン修正対応  */
}
@media screen and (min-width: 768px) {
	/*S --- 2023/08/22 DEL inoue 旧ログイン画面デザイン  */
/*
	.login-buttons {
		display: flex;
		justify-content: space-between;
	}
	.login-buttons__item:nth-child(1) {
		width: 40%;
	}
	.login-buttons__item:nth-child(2) {
		width: 55%;
	}
*/
	/*E --- 2023/08/22 DEL inoue 旧ログイン画面デザイン  */
/*S --- 2023/08/21 ADD inoue ログイン画面デザイン修正対応  */
	.login-design	 {
		display: flex;
	}
	/*S --- 2023/11/10 UPD ichimura 追加改修対応  */
	/*.login-design-firstStep{
		height:230px;
	}*/
	.login-design-firstStep{
		height:45px;
	}
	/*E --- 2023/11/10 UPD ichimura 追加改修対応  */
/*E --- 2023/08/21 ADD inoue ログイン画面デザイン修正対応  */
	
}

/*------------------
Menu
-------------------*/
@media screen and (max-width: 979px) {
	.menu-container {
		display: flex;
		justify-content: space-between;
	}
	.menu-container .left50, 
	.menu-container .right50 {
		float: none;
		width: 49%;
	}
}
@media screen and (max-width: 767px) {
	.menu-container {
		flex-direction: column;
		align-items: center;
	}
	.menu-container .left50, 
	.menu-container .right50 {
		width: auto;
	}
	.information-container h2 {
		height: auto;
	}
	.information-container h2 span {
		display: block;
		font-size: 0.875em;
		line-height: 1.4;
		float: none !important;
		padding-bottom: 5px;
	}
	.information-container dl.info {
		display: flex;
		flex-wrap: wrap;
		font-size:0.875em;
		height: auto;
		max-height: 132px;
	}
	.information-container dl.info dt,
	.information-container dl.info dd {
		float: none;
		line-height: 1.4;
		padding-top: 4px;
		padding-bottom: 4px;
		box-sizing: border-box;
	}
	.information-container dl.info dt {
		width: 120px;
		border-bottom: 1px solid #ddd;
		padding-left: 12px;
	}
	.information-container dl.info dd {
		width: calc(100% - 120px);
		padding-left: 12px;
		padding-right: 12px;
		margin-bottom: 0;
	}
}

/*------------------
Result
-------------------*/
.doctor-message {
	display: flex;
	margin-bottom: 15px;
}
.doctor-message__img {
	width: 150px;
	margin-right: 20px;
}
.metabolic {
	margin-bottom: 8px;
}
.metabolic-table {
	width: 100%;
	line-height: 1.3;
	border-collapse: collapse;
	border-bottom: 1px solid #000;
	text-align: center;
}
.metabolic-table thead tr {
	border-bottom: 1px solid #000;
}
.metabolic-table thead th {
	position: relative;
	vertical-align: middle;
}
.metabolic-table thead tr th:nth-child(1),
.metabolic-table tbody tr th:nth-child(1)  {
	position: sticky;
	left: 0;
	background-color: #fff;
	z-index: 1;
}
.metabolic-table tbody tr {
	border-bottom: 1px dotted #000;
}
.metabolic-table td,
.metabolic-table th {
	padding: 6px;
	font-weight: normal;
}
.metabolic-table .good,
.metabolic-table .bad {
	display: block;
	padding: 8px;
}
.metabolic-table .good {
	background-color: cyan;
}
.metabolic-table .bad {
	color: red;
	background-color: pink;
}
.metabolic-table .plus {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
}
.metabolic-table .plus > span { 
	margin-left: 22px;
}
.metabolic-table .small {
	font-size: 0.8em;
}

@media screen and (max-width: 979px) {
	.result-wrapper #ui-tab .ui-tabs-panel {
		height: auto;
		padding: 3%;
	}
	ul#result_tab {
		display: flex !important;
		flex-wrap: wrap;
		background: #77c2b7;
		box-sizing: border-box;
		padding: 6px;
	}
	#ui-tab ul#result_tab li {
		float: none !important;
		width: calc(33.333% - 4px) !important;
		margin: 2px;
		border-bottom-width: 1px;
		box-sizing: border-box;
	}
	#ui-tab ul#result_tab li a {
		display: block;
		padding: 10px;
		text-align: center;
		box-sizing: border-box;
	}
	#ui-tab ul#result_tab li a span {
		width: 100% !important;
	}
	#ui-tab ul#result_tab .ui-tabs-anchor {
		float: none !important;
	}
	ul#result_tab .ui-corner-all, 
	ul#result_tab .ui-corner-top, 
	ul#result_tab .ui-corner-left, 
	ul#result_tab .ui-corner-tl {
		border-radius: 4px !important;
	}
	.result-container {
		display: flex;
		flex-wrap: wrap;
		margin-top: 15px;
		margin-bottom: 15px;
	}
	.result-container * {
		box-sizing: border-box;
	}
	.result-list {
		width: 50%;
	}
	.result-list:not(:last-child) {
		border-right: 1px solid #fff;
	}
	.result-list__item {
		display: flex;
		background-color: #fee6cc;
		line-height: 1.4;
	}
	.result-list__item:not(:last-child) {
		border-bottom: 1px solid #fff;
	}
	.result-list__item.border {
		border-bottom: 1px solid #fff;
	}
	.result-list__caption {
		flex: 1;
		font-size: 1em;
		padding: 8.5px;
		border-right: 1px solid #fff;
	}
	.result-list__caption span {
		font-size: 0.813em;
	}
	.result-list__caption.sm {
		line-height: 1.2;
		padding-top: 4px;
		padding-bottom: 4px;
	}
	.result-list__caption.sm span {
		display: block;
	}
	.result-list__result {
		color: #fff;
		width: 30px;
		background-color: #eaeaea;
	}
	.result-list__result span {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
	}
	.result-list__result.multiple span {
		font-size: 0.813em;
		height: 50%;
	}
	.result-list__result.multiple span:first-child {
		border-bottom: 1px solid #fff;
	}
	.result-icons {
		margin-right: 0 !important;
	}
	.doctor-message__balloon {
		flex: 1;
		height: auto !important;
	}
	.metabolic-result {
		font-size: 1.25em !important;
		line-height: 1.4 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
		text-align: center !important;
	}
	.metabolic-result:last-child {
		margin-top: 8px;
	}
	#resultModal {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		margin-left: auto !important;
		margin-top: auto !important;
		width: 100% !important;
		height: 100% !important;
		overflow-y: auto;
		box-sizing: border-box;
	}
	ul.inLine {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	ul.inLine li {
		width: 32% !important;
	}
}
@media screen and (max-width: 767px) {
	.result-list {
		width: 100%;
	}
	.result-list:not(:last-child) {
		border-bottom: 1px solid #fff;
		border-right: none;
	}
	.result-icons table {
		margin-right: auto !important;
	}
	.result-icons table,
	.result-icons table tbody,
	.result-icons table th {
		display: block;
	}
	.result-icons table tr {
		display: flex;
		flex-wrap: wrap;
	}
	.result-icons table td {
		width: 50%;
		margin-bottom: 8px;
		box-sizing: border-box;
	}
	.totalResult {
		margin-top: 20px;
	}
	ul.inLine li {
		width: 48% !important;
	}
	.metabolic-table {
		table-layout: auto;
	}
	.metabolic-table th,
	.metabolic-table td {
		font-size: 0.875em;
	}
	.metabolic-table tr > th:nth-child(1) {
		width: 12%;
	}
	.metabolic-table tr > th:nth-child(2) {
		width: 25%;
	}
}
@media screen and (max-width: 560px) {
	#ui-tab ul#result_tab li {
		width: calc(50% - 4px) !important;
	}
	.doctor-message__img {
		width: 110px;
	}
	table.lifeStyle td {
		padding: 6px !important;
		vertical-align: middle;
	}
	table.lifeStyle td:not(.answer),
	table.lifeStyle tr:first-child td {
		font-size: 0.813em !important;
	}
	table.lifeStyle td:not(.answer) {
		vertical-align: top;
	}
	table.lifeStyle tr .answer {
		/*S --- 2023/02/10 UPD Inoue スマホ版の生活習慣の回答幅固定  */
		/* width: auto; */
		width: 70px;
		/*E --- 2023/02/10 UPD Inoue スマホ版の生活習慣の回答幅固定  */
	}
}

/*------------------
Monshin
-------------------*/
dl.formQue dd ul.stressCheck,
dl.formQue dd ul.inline2 {
	height: auto;
}
.q-how-match__item:first-child {
	margin-right: 4em;
}
.sticky-table {
	width: 100%;
	text-align: center;
	white-space: nowrap;
	border: none;
	border-collapse: separate;
	border-spacing: 0;
	table-layout: fixed;
}
.sticky-table th {
	position: sticky;
	background-color: #fff;
	font-weight: normal;
}
.sticky-table thead th {
	top: 0;
}
.sticky-table tbody th {
	left: 0;
}
.q-container {
	width: 100%;
	padding-bottom: 2em;
}
.q-table th,
.q-table td {
	width: 20%;
	border-bottom: 1px solid #EDEDED;
	padding: 1em;
	box-sizing: border-box;
}

@media screen and (max-width: 979px) {
	h3.check,
	dl.formQue,
	.q-container {
		padding-left: 3%;
		padding-right: 3%;
		box-sizing: border-box;
	}
	h3.check {
		margin-bottom: 25px;
	}
	
	.h3-check-explain {
		padding-left: 3%;
	}
		
	dl.formQue dt {
		width: auto;
	}
	dl.formQue dd li {
		float: none;
	}
	dl.formQue dd ul.stressCheck {
		display: flex;
	}
	.q-how-match__item:first-child {
		margin-right: 1em;
	}
	dl.formQue dd ul.vertical_radio3,
	dl.formQue dd ul.vertical_radio4,
	dl.formQue dd ul.vertical_radio5,
	dl.formQue dd ul.vertical_radio6 {
		height: auto;
	}
	dl.formQue dd ul.inline li,
	dl.formQue dd ul.inlineAlcohol li,
	dl.formQue dd ul.inlineGyomu li {
		display: block;
		width: 100%;
	}
	.q-how-match .from {
		flex-basis: auto;
		width: 35%;
	}
	.q-how-match .to {
		flex-basis: auto;
		width: 65%;
	}
	.q-table {
		white-space: normal;
	}
	.q-table th,
	.q-table td {
		font-size: 0.875em;
		padding: 0.6em;
		vertical-align: middle;
	}
	.disp_simple .subscription_area .q-table td {
		padding: 0.6em !important;
	}
	.q-table thead th,
	.q-table tfoot th
	 {
		vertical-align: top;
	}
	.q-table thead th span,
	.q-table tfoot th span
	 {
		display: block;
		width: 1em;
		line-height: 1;
		margin: auto;
	}
}
@media screen and (max-width: 767px) {
	.q-how-match {
		display: block;
	}
	.q-how-match__item {
		width: 100%;
		/* min-height: 2.5em; */
	}
	.q-how-match__item:first-child {
		margin-right: 0;
	}
	.q-how-match__item + .q-how-match__item {
		margin-top: 0.5em;
	}
}

/*------------------
Subscription
-------------------*/
@media screen and (max-width: 979px) {
	.subscription_area table:not(.sticky-table) tr {
		height: auto !important;
	}
	.subscription_area table:not(.sticky-table),
	.subscription_area table:not(.sticky-table) tbody,
	.subscription_area table:not(.sticky-table) tr,
	.subscription_area table:not(.sticky-table) th,
	.subscription_area table:not(.sticky-table) td {
		display: block;
		width: 100%;
	}
	.subscription_area table:not(.sticky-table) tr {
		margin-bottom: 0.8em;
	}
	.disp_simple .subscription_area table:not(.sticky-table) td:first-child {
		text-align: left;
	}
	.disp_simple .subscription_area table:not(.sticky-table) td:nth-child(2n) {
		padding-left: 0;
	}
	.subscription_area input[type='text'], 
	.subscription_area input[type='number'], 
	.subscription_area input[type='email'], 
	.subscription_area input[type='tel'],
	.subscription_area input[type='password'],
	.subscription_area input[name='password'],
	.subscription_area input[name='passwordConfirm'],
	.subscription_area textarea,
	.subscription_area select {
		font-size: 1em;
		width: 100%;
		padding: 8px;
		box-sizing: border-box;
	}
	.disp_simple .subscription_area {
		padding-bottom: 0;
	}
	.disp_simple .subscription_area table td,
	.disp_simple .subscription_area table tr:nth-child(4) td, 
	.disp_simple .subscription_area table tr:nth-child(9) td, 
	.disp_simple .subscription_area table tr:nth-child(11) td {
		padding-bottom: 0.2em !important;
	}
}

/*------------------
reserve
-------------------*/
@media screen and (max-width: 979px) {
	.harmonizing,
	.harmonizing tbody,
	.harmonizing tr,
	.harmonizing th,
	.harmonizing td {
		display: block;
		width: 100%;
	}
	table.harmonizing td:first-child {
		text-align: left !important;
	}
	.harmonizing input[type='text'] {
		font-size: 1em;
		width: 100%;
		padding: 8px;
		box-sizing: border-box;
	}
	.reserve-confirm-lead {
		line-height: 1.4;
	}
	.reserve-confirm-lead span {
		display: block;
	}
	.reserve-confirm-date span {
		display: block;
	}
}

/*------------------
for number
-------------------*/

.no-spin::-webkit-inner-spin-button,
.no-spin::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
    -moz-appearance:textfield;
}

@media screen and (max-width: 979px){
  td.userIdWrap {
    padding-left: 0px!important;
  }
  
  li.groupPassWrap {
	display: flex;
  	align-items: center;
  	height: 45px;
  }
  
  li.groupPassWrap input[type="button"] {
	margin-left: 10px;
  }
 
 }
 
 @media screen and (min-width: 980px) {
	.userIdWrap .userId{
		width:254px;
	}
}