@charset "UTF-8";
/*
  --------------------------------
  Created: 2018.01.15
  Last Modified: 2021.12.10
  --------------------------------
*/

/* common */
#comparison img { width: auto; max-width: 100%; height: auto; }

/* table */
#comparison .comparison_table { position: relative; padding-right: 70px; }
#comparison .comparison_table.is-show { opacity: 1; }
#comparison .comparison_table table { border-collapse: collapse; table-layout: fixed; position: relative; }
#comparison .comparison_table table th { box-sizing: border-box; background-color: #f2f2f2; border: 1px solid #bfbfbf; vertical-align: top; padding: 10px; white-space: nowrap; }
#comparison .comparison_table table thead tr:nth-of-type(1) th { background-color: #ffffff; border-top: none; border-left: 1px solid #ffffff; }
#comparison .comparison_table table td { background-color: #ffffff; box-sizing: border-box; border: 1px solid #bfbfbf; text-align: center; vertical-align: middle; padding: 10px; }
#comparison .comparison_table table thead td { vertical-align: top; }
#comparison .comparison_table .show_all { display: none; text-align: center; }
#comparison .comparison_table .label1 { border-bottom: 1px solid #bfbfbf; background-color: #f2f2f2; padding: 10px; margin: -10px -10px 0 -10px; }
#comparison .comparison_table .label2 { border-bottom: 1px solid #bfbfbf; padding: 10px; margin: 0 -10px; }
#comparison .comparison_table .bt_hidden { padding-top: 10px; width: 200px; }
#comparison .comparison_table .bt_hidden a { background-color: #f2f2f2; border-radius: 5px; color: #333; display: block;  text-align: center; padding: 12px 10px; }
#comparison .comparison_table .bt_hidden a.disabled { pointer-events: none; opacity: 0.4; }
#comparison .comparison_table .bt_hidden a:hover { text-decoration: none; }
#comparison .comparison_table .bt_hidden a:before { background: url(../img/icon_hidden.png) left center/18px auto no-repeat; content: ""; display: inline-block; vertical-align: -0.25em; margin-right: 5px; width: 18px; height: 18px; }
#comparison .comparison_table .thumb { font-size: 0; line-height: 0; padding-top: 10px; width: 200px; }
#comparison .comparison_table .thumb img { width: 200px; }
#comparison .comparison_table .icon_img img { width: 20%; }
#comparison .comparison_table .series_label { border-bottom: 1px solid #bfbfbf; padding: 10px 0; margin: -10px -10px 0 -10px; } 
#comparison .comparison_table .product_label { padding-top: 10px; }
#comparison .comparison_table .product_label a { background: url(../../../shared/img/arr_red.png) left center/6px auto no-repeat; color: #333; display: inline-block; vertical-align: bottom; padding-left: 15px; }

.tablet #comparison .comparison_sp_all { display: block; text-align: center; margin-bottom: 20px; }
.tablet #comparison .sp_swipe { display: block; }
.tablet #comparison .sp_swipe:before { display: block; content: "表組はフリックで左右にスクロール出来ます"; width: 100%; margin-bottom: 25px; padding-bottom: 55px; background: url(../../../shared/img/icon_swipe.png) no-repeat center bottom; background-size: 180px auto; text-align: center; font-size: .88em; }
.tablet #comparison .sp_swipe:after { display: block; content: ""; width: 100%; margin-top: 15px; padding-bottom: 42px; background: url(../../../shared/img/icon_swipe.png) no-repeat center bottom; background-size: 180px auto; }
.tablet #comparison .comparison_table { padding-right: 0; }
.tablet #comparison .comparison_table table { min-width: 0%; }
.tablet #comparison .comparison_table table th { display: none; }
.tablet #comparison .comparison_table .bt_hidden { width: 160px; }
.tablet #comparison .comparison_table .thumb { width: 160px; }
.tablet #comparison .comparison_table .thumb img { width: 160px; }
.tablet #comparison .comparison_table .sp_title { display: table-row; }
.tablet #comparison .comparison_table .sp_title .mid_1 { background-color: #d9d9d9; text-align: left; }
.tablet #comparison .comparison_table .sp_title .mid_2 { background-color: #f2f2f2; text-align: left; }
.tablet #comparison .comparison_table .sp_title .mid_1 span { position: relative; }
.tablet #comparison .comparison_table .sp_title .mid_2 span { position: relative; }
@media only screen and (min-width:768px) {
#comparison .comparison_table .bt_hidden a { transition: background-color .25s ease-out; }
#comparison .comparison_table .bt_hidden a:hover { background-color: #cccccc; }
}
@media only screen and (max-width:767px) {
#comparison .comparison_table { padding-right: 0; }
#comparison .comparison_table table { min-width: 0%; }
#comparison .comparison_table table th { display: none; }
#comparison .comparison_table .bt_hidden { width: 160px; }
#comparison .comparison_table .thumb { width: 160px; }
#comparison .comparison_table .thumb img { width: 160px; }
#comparison .comparison_table .sp_title .mid_1 { text-align: left; display: table-cell !important; }
#comparison .comparison_table .sp_title .mid_2 { text-align: left; display: table-cell !important; }
#comparison .comparison_table .sp_title .mid_1 span { display: inline-block; vertical-align: bottom; position: relative; /* transition: left 0.1s 0.1s ease-out; */ }
#comparison .comparison_table .sp_title .mid_2 span { display: inline-block; vertical-align: bottom; position: relative; /* transition: left 0.1s 0.1s ease-out; */ }
}

/* wrap */
#comparison .comparison_table_wrap { overflow: hidden; position: relative; width: 100%; max-width: 1078px; }

/* base table */
#comparison .comparison_table_base {}
@media (min-width:768px) {
#comparison .comparison_table_base { overflow: hidden !important; }
.tablet #comparison .comparison_table_base { overflow-x: auto !important; }
.tablet #comparison .comparison_table_base table { left: auto !important; }
}
@media only screen and (max-width:767px) {
#comparison .comparison_table_base { overflow-x: auto; }
#comparison .comparison_table_base table { left: auto !important; }
}

/* top table */
#comparison .comparison_table_head { background-color: #ffffff; position: absolute; top: 0px; overflow: hidden; width: 100%; z-index: +2; }
#comparison .comparison_table_head.is-fixed { position: fixed; width: calc(100% - 96px); max-width: 1078px; }
#comparison .comparison_table_head table thead tr:nth-of-type(1) td { border-top: none; }
#comparison .comparison_table_head .show_all { display: none; }
#comparison .comparison_table_head .label1 { display: none; }
#comparison .comparison_table_head .label2 { display: none; }
#comparison .comparison_table_head .bt_hidden { display: none; }
#comparison .comparison_table_head .thumb { margin-top: -10px; }
#comparison .comparison_table_head .left { position: absolute; top: 0px; left: 0px; overflow: hidden; height: 100%; }
@media (min-width:768px) {
#comparison .comparison_table_head { overflow: hidden !important; }
.tablet #comparison .comparison_table_head { overflow-x: auto !important; }
.tablet #comparison .comparison_table_head table { left: auto !important; }
.tablet #comparison .comparison_table_head .left { display: none !important; }
}
@media only screen and (max-width:767px) {
#comparison .comparison_table_head { overflow-x: auto; }
#comparison .comparison_table_head table { left: auto !important; }
#comparison .comparison_table_head.is-fixed { left: 15px; width: calc(100% - 15px); }
#comparison .comparison_table_head .left { display: none !important; }
}

/* left table */
#comparison .comparison_table_left { background-color: #ffffff; position: absolute; top: 0px; left: 0px; overflow: hidden; height: 100%; z-index: +1; }
#comparison .comparison_table_left .show_all { display: block; }
@media (min-width:768px) {
.tablet #comparison .comparison_table_left { display: none !important; }
}
@media only screen and (max-width:767px) {
#comparison .comparison_table_left { display: none !important; }
}

/* prev next */
#comparison .comparison_navi { position: absolute; top: 0px; width: 100%; z-index: +3; }
#comparison .comparison_navi.is-fixed { position: fixed; width: calc(100% - 26px); max-width: 1148px; }
#comparison .slide_nav { background-color: transparent; }
#comparison .slide_nav.prev { display: none; top: 0px; left: 130px; }
#comparison .slide_nav.next { top: 0px; right: 0px; }
@media (min-width:768px) {
.tablet #comparison .comparison_navi { display: none !important; }
}
@media only screen and (max-width:767px) {
#comparison .comparison_navi { display: none !important; }
}

/* spec_classification */
.spec_classification { margin: 1.703% 0 0; padding: 1.703%; background-color: #f5f5f5; }
.spec_classification::after { content: ""; display: block; clear: both; }
.spec_classification_txt { width: 47.826%; float: left; font-size: 13px; line-height: 1.8; color: #333; font-weight: 300; }
.spec_classification_img { width: 50.903%; float: left; margin: 0 0 0 1.022%; }
.spec_classification_img img { width: auto; max-width: 100%; height: auto; }
@media only screen and (max-width:767px) {
.spec_classification { margin: 5.172% 0 0; padding: 6.896% 5.172% 6.379%; background-color: #f5f5f5; }
.spec_classification::after { content: ""; display: block; clear: both; }
.spec_classification_txt { width: 100%; font-size: 10px; line-height: 1.8; color: #333; font-weight: 300; }
.spec_classification_img { width: 100%; margin: 2.068% 0 0; }
.spec_classification_img img { width: auto; max-width: 100%; height: auto; }
}