/*
*******************************************************************************************************
# /ja/products/select-c/css/index.css
*******************************************************************************************************
*/

/*------------------------------------
	Override
------------------------------------*/
.wrp-section {
	position: relative;
}
.wrp-section-inner {
	padding-top: 32px;
}


/*------------------------------------
	parts
------------------------------------*/

/* title
------------------------------------*/
.ttl-step {
	margin-bottom: 25px;
	font-size: 23px;
	color: #7F8894;
}

.sttl-subhead {
	margin-bottom: 15px;
	font-size: 18px;
}

.sttl-table {
	margin-bottom: 10px;
	font-weight: bold;
}


/* other
------------------------------------*/
/* caption */
.box-caption {
	margin-bottom: 32px;
	padding: 15px 30px;
	background-color: #EFF0F3;
}

/* table */
.list-table li {
	padding: 10px 16px 14px;
	border-bottom: solid 1px #CCCCCC;
}
.list-table li:nth-child(odd) {
	background-color: #F7F7F7;
}

.list-table li .sttl {
	font-weight: bold;
	margin-bottom: 6px;
	line-height: 1.4;
}
.list-table li .sttl span {
	display: inline;
	margin-left: 10px;
	font-weight: normal;
	font-size: 13px;
}

.list-table li .input input {
	width: 180px;
	height: 28px;
}
.list-table li .input .unit {
	display: inline-block;
	margin-left: 4px;
}
.list-table li .input select {
	min-width: 180px;
	height: 28px;
}
.list-table li .thumb {
	margin-top: 20px;
}
.list-table li .thumb img {
	width: 120px;
	height: 120px;
}

/* box-autocal */
.box-autocal {
	margin-top: 40px;
	border: solid 5px #EEEEEE;
}
.box-autocal li {
	float: left;
	width: 50%;
}
.box-autocal li > .box-inner {
	margin: 24px 0 28px 50px;
}
.box-autocal li .input.text {
	font-size: 23px;
	font-weight: bold;
}
.box-autocal li .input .unit {
	margin-left: 5px;
	font-size: 15px;
	font-weight: normal;
}
.box-autocal li .input input {
	width: 216px;
	font-size: 15px;
	font-weight: normal;
}

/* data-table */
.data-table {
	width: 100%;
	line-height: 1.6;
}

.data-table tr:first-child > * {
	border-top: solid 1px #CCCCCC;
}

.data-table th,
.data-table td {
	padding: 8px 24px 8px 24px;
	border-bottom: solid 1px #CCCCCC;
	text-align: left;
	vertical-align: top;
	font-size:14px;
}

.data-table th .sttl-th {
	display: table;
}
.data-table th .sttl-th > span {
	display: table-cell;
	vertical-align: top;
}

.data-table th .sub-head {
	font-weight: bold;
}
.data-table th .sub-text {
	display: inline-block;
	padding: 2px 0 0 10px;
	font-size: 13px;
}

.data-table td {
	background-color: #F7F7F7;
	border-left: solid 1px #DDDDDD;
}
.data-table td .unit {
	display: inline-block;
	margin-left: 8px;
}

.data-table thead th {
	border-top: none !important;
	font-weight: bold;
}

.data-table .text-error {
	display: none;
}
.data-table .error .text-error {
	display: block;
	margin-top: 2px;
	color: #CE4844;
}
.data-table tr.error td,
.data-table td.error {
	background-color: #FFEBEB;
	color: #CE4844;
}
.data-table .text-note {
	display: block;
	margin-top: 2px;
}

/* input table */
.data-input {
	position: relative;
}

.data-input .sttl {
	margin-bottom: 70px;
}

.data-input .endurance {
	position: absolute;
	width: 67%;
	top: 40px;
	left: 33%;
}
.data-input .endurance .input input {
	width: 200px;
}
.data-input .endurance .input .unit {
	display: inline-block;
	margin-left: 11px;
	font-size: 18px;
}

.table-input {
	width: 100%;
	text-align: left;
}
.table-input thead th {
	padding: 0 0 10px 27px;
	border-bottom: solid 1px #CCCCCC;
	font-weight: bold;
}

.table-input tbody th,
.table-input tbody td {
	height: 56px;
	padding-top: 14px;
	padding-bottom: 14px;
	border-bottom: solid 1px #CCCCCC;
	vertical-align: middle;
	text-align: left;
}
.table-input tbody th {
	width: 33%;
	padding-left: 15px;
	font-weight: bold;
}
.table-input tbody td {
	width: 33.5%;
	padding-left: 27px;
	padding-right: 27px;
	border-left: solid 1px #DDDDDD;
	background-color: #F7F7F7;
}
.table-input tbody td {
	background-color: #F7F7F7;
}

.table-input input {
	width: 180px;
	height: 28px;
}
.table-input select {
	min-width: 180px;
	height: 28px;
}
.table-input .input .unit {
	display: inline-block;
	margin-left: 6px;
}
.table-input .text-error {
	display: none;
}

.table-input .error input,
.table-input .error select {
	border-color: #CE4844;
	background-color: #FFEBEB;
}
.table-input .error .text-error {
	display: block;
	margin-top: 5px;
	color: #CE4844;
}
.table-input .text-note {
	display: block;
	margin-top: 5px;
	font-size: 13px;
}

.table-input .comment_text {
	display: block;
	font-size: 13px;
}

.table-input td.btn-area {
	padding-left: 0;
	border-left: none;;
	background-color: #ffffff;
}
.table-input .btn-result {
	width: 256px;
}
.table-input .btn-result a {
	position: relative;
	display: block;
	border: solid 1px #cccccc;
	border-radius: 4px;
	text-align: left;
	color: #111111;
}
.table-input .btn-result a:hover {
	border: solid 1px #0090d7;
	background-color: #eff0f3;
	text-decoration: none;
}
.table-input .btn-result a.disabled {
	border: solid 1px #dddddd;
	color: #cccccc;
}
.table-input .btn-result a.disabled:hover {
	background-color: #ffffff;
	cursor: default;
}

.table-input .btn-result a .btn-inner {
	padding: 12px 12px 12px 48px;
}
.table-input .btn-result .icn-checkbox {
	position: absolute;
	left: 12px;
	top: 50%;
	width: 23px;
	height: 23px;
	margin-top: -12px;
	border: solid 1px #cfcfcf;
	border-radius: 20px;
	line-height: 1;
}
.table-input .btn-result .icn-checkbox::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 7px;
	display: block;
	margin-top: -7px;
	width: 5px;
	height: 8px;
	border-right: 3px solid #eeeeee;
	border-bottom: 3px solid #eeeeee;
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	z-index: 1;
}
.table-input .btn-result.checked a {
	border: solid 1px #0090d7;
	background-color: #eff0f3;
}
.table-input .btn-result.checked .icn-checkbox {
	background-color: #0090d7;
	border-color: #0176b0;
}
.table-input .btn-result.checked .icn-checkbox::after {
	border-color: #ffffff;
}



/* button */
.mod-button {
	max-width: 452px;
	margin: 0 auto;
}

.mod-product-button{
	max-width: 250px;
	margin: 0 auto;
}

.mod-button__inner {
	display: block;
	padding: 15px 10px;
	border-radius: 4px;
	background-color: #0090d7;
	text-align: center;
	font-size: 16px;
	line-height: 1.2;
	color: #fff;
	transition: background-color 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}

.mod-button__inner:hover {
	color: #fff;
	background-color: #0176b0;
	text-decoration: none;
}

.mod-button--gray .mod-button__inner {
	background-color: #7f8894;
}

/* utility */
.u-mt10 {
	margin-top: 10px !important;
}
.u-mt20 {
	margin-top: 20px !important;
}
.u-mt30 {
	margin-top: 30px !important;
}
.u-mt40 {
	margin-top: 40px !important;
}
.u-mt50 {
	margin-top: 50px !important;
}
.u-mt80 {
	margin-top: 80px !important;
}
.u-mb180 {
	margin-bottom: 180px !important;
}

.u-txt-center {
	text-align: center !important;
}
.u-txt-right {
	text-align: right !important;
}

/*------------------------------------
	Layout
------------------------------------*/

/* step section
------------------------------------*/
.section-step {
	margin-bottom: 40px;
	padding-top: 48px;
}

/* step2
------------------------------------*/
.step2-title {
	margin: 0 0 20px 0;
	font-weight: bold;
	font-size: 18px;
}

.step2-product-image  {
	margin-left: 58px;
}

.step2-product-image > img {
	width: 260px;
}

.step2-result {
	margin-bottom: 80px;
}

.step2-img  {
	width: 260px;
	margin: 0 auto;
}

.step2-img > a {
	display: block;
}


/* office */
.box-office {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

.box-office .list-offices {
	flex: 0 0 24%;
}

.box-office .list-offices dd {
	margin-bottom: 0;
}

.box-office .list-offices .pic {
	margin-top: 25px;
}

.box-office .list-offices .pic img {
	width: 100%;
	height: auto;
}

.list-offices dt {
	margin-bottom: 30px;
	padding-top: 25px;
	border-top: solid 1px #dddddd;
	font-size: 20px;
}

.list-offices dd {
	margin-bottom: 45px;
}

.list-offices dd .sttl-offices {
	font-weight: bold;
}

.list-offices dd .text-english {
	margin-top: 20px;
	padding-left: 20px;
	border-left: solid 1px #111111;
	font-size: 13px;
}


/* loading
------------------------------------*/
.loading {
	background-image: url("../img/loading.gif");
	background-position: center center;
	background-repeat: no-repeat;
	min-height: 70px;
}

/* error popup */
.box-error-navi .list-navi-category li a {
	float: left;
	width: 48%;
	position: relative;
	display: block;
	border: solid 1px #cccccc;
	border-radius: 4px;
	color: #111111;
	margin: 13px 0 6px 0;
}

/* error
------------------------------------*/
.box-error-navi .list-navi-category li a.right-spec {
	margin-right: 4%;
}

.box-error-navi .list-navi-category li a:hover {
	border: solid 1px #0090d7;
	background-color: #eff0f3;
	text-decoration: none;
}

.box-error-navi .list-navi-category li a .list-name {
	text-align: center;
}

.box-error-navi .list-navi-category:before, .box-error-navi .list-navi-category:after {
	content: "";
	display: table;
}

.box-error-navi .list-navi-category:after {
	clear: both;
}

label#t-error.error,
label#wa-error.error,
label#l-error.error,
label#step2_t-error.error,
label#step2_wa-error.error,
label#step2_l-error.error {
	color: #CE4844;
	background-color: #FFEBEB;
	margin-left: 15px;
}


/* spec
------------------------------------*/
.step1_search_space {
	height: 50px;
}


/* section-inner
------------------------------------*/

.wrp-sub-section-inner {
	max-width: 1208px;
	margin: 0 auto;
	padding: 36px 0px 0;
}

.wrp-sub-section-inner .text-lead {
	margin-bottom: 54px;
	line-height: 1.6;
}

.wrp-sub-section-inner .wrp-sub-btn {
	display: table;
	margin: 0 auto;
}

.wrp-sub-section-inner .wrp-sub-btn:after {
	content: "";
	display: block;
	clear: both;
}

.wrp-sub-section-inner .btn-detail {
	float: left;
	margin: 0 50px;
}

.wrp-sub-section-inner .btn-detail a {
	display: table;
	border-radius: 0;
}

.wrp-sub-section-inner .btn-detail .btn-inner {
	width: 390px;
	padding-top: 21px;
	padding-bottom: 21px;
	font-size: 21px;
	line-height: 1.371428571;
}

.wrp-sub-section-inner .link-back {
	float: right;
	margin: 0 50px;
	font-size: 21px;
	line-height: 1.371428571;
	text-align: center;
}

.wrp-sub-section-inner .link-back a {
	position: relative;
	display: inline-block;
	padding: 22px 40px 22px 22px;
	color: #111;
	text-decoration: none;
}

.wrp-sub-section-inner .link-back a:before,
.wrp-sub-section-inner .link-back a:after {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	display: block;
	width: 24px;
	height: 1px;
	background-color: #0090d7;
}

.wrp-sub-section-inner .link-back a:before {
	margin-top: -5px;
	-webkit-transform: rotate(22deg);
	-ms-transform: rotate(22deg);
	transform: rotate(22deg);
}

.wrp-sub-section-inner .link-back a:after {
	margin-top: 5px;
	-webkit-transform: rotate(151deg);
	-ms-transform: rotate(151deg);
	transform: rotate(151deg);
}

.result-table .column-download {
    padding-right: 15px;
}

.result-table .column-download .btn-inner, .result-table .column-spec .btn-inner {
    border: solid 1px #20a0e4;
    font-size: 14px;
}

.result-table .column-modelnumber .btn-inquiry, .result-table th.column-modelnumber p .btn-inquiry {
    margin: 5px auto 0;
    margin-bottom: 5px;
}

@media screen and (max-width: 1200px) {
	.list-results > li {
		display: flex;
		padding: 20px 20px;
		border-bottom: solid 1px #dddddd;
	}

	.list-results > li > * {
		display: block;
	}

	.list-results > li .category-img {
		float: none;
		width: 161px;
		padding-left: 0px;
		margin-left: 20px;
	}

	.list-results > li .category-name {
		float: left;
		padding: 15px 20px 20px 20px;
		width: 270px !important;
		min-width: 270px !important;
		display: table;
	}

	.list-results > li .category-name .sttl {
		font-size: 24px;
		color: #7f8894;
	}

	.list-results > li .category-name .sttl span {
		margin-right: 5px;
		color: #111111;
	}

	.list-results > li .list-category {
		width: auto;
		*zoom: 1;
		display: block;
	}

	.list-results > li .list-category:before, .list-results > li .list-category:after {
		content: "";
		display: table;
	}

	.list-results > li .list-category:after {
	clear: both;
	}

	.list-results > li .list-category li.active {
		border: solid 1px #cccccc;
		background-color: #ffffff;
		color: #111111;
	}

	.result-table tbody td {
		height: 100px;
	}

	.result-table .column-spec, .result-table th.column-spec {
		width: 70px;
		padding-right: 0;
	}

/*
	.result-table .column-modelnumber, .result-table th.column-modelnumber p {
		padding-right: 0;
	}

	.result-table .column-modelnumber .btn-inquiry, .result-table th.column-modelnumber p .btn-inquiry {
		position: static;
		width: 188px;
		margin: 10px auto 0;
	}*/
}