@charset "shift_jis";
.box-link a.btn.orange {background:#ea5076; }
.box-link a.btn.orange:hover {background:#ea5076; opacity:0.7;}
.box-link a.btn.green {background:#1dc7b8;}
.box-link a.btn.green:hover {background:#1dc7b8; opacity:0.7;}
.box-link a.btn.blue {background:#3a8de9;}
.box-link a.btn.blue:hover {background:#3a8de9; opacity:0.7;}
.header-ranking-detail .ranking-information p.title-img {padding:10px 42px 15px; background-color:#fff; margin:0;}
.main-contents .ranking .ranking-box {background-color: #fff;}
/* ** ranking-comparison-top ** */
#comparison {background-color: #eee; padding: 0 20px 20px;}
.comparison-title {background-color:#0d3182; color:#fff; text-align:left; border-bottom:2px solid #fff; margin:0 auto 0;}
.comparison-title span {display:block; text-align:center; padding:8px 10px; font-size:20px; font-weight:bold;}
.comparison-area {width:auto; max-height: 680px; overflow:hidden; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; margin:0 auto 2px; transition:max-height 1s ease;}
.comparison-area.table-open {max-height:2000px;}
.comparison-table {border-collapse:collapse; border-spacing:0; width:1800px; border-right:2px solid #0d3182; border-bottom:2px solid #0d3182;}
.comparison-table th,
.comparison-table td {padding:15px 5px; width:100px; max-width:100px; height:auto; border-left:1px solid #c7d0e3; border-bottom:1px solid #c7d0e3; text-align:center; vertical-align:middle; background-color:#fff;}
.comparison-table th {padding:10px 5px;}
.comparison-table td {height: 91px;}
.comparison-table .table-h {background-color:#f7fdff;}
.comparison-table tr:nth-child(2n+1) td {background-color:#fdfdfd;}
.comparison-table th:first-child,
.comparison-table td:first-child {border-left:1px solid #0d3182;}
.comparison-table tr:nth-child(2) th:first-child {border-left:1px solid #c7d0e3;}
.comparison-table tr:first-child th {border-top:2px solid #0d3182; border-bottom:1px solid #0d3182; background-color:#f3f7ff;}
.comparison-table tr:first-child th.noborder {border-bottom:1px solid #c7d0e3; background-color:#f3f7ff;}
.comparison-table tr:nth-child(2) th {border-bottom:1px solid #0d3182; background-color:#f3f7ff;}
.comparison-table th.company-rank,
.comparison-table td.company-rank {width:70px; max-width:70px;}
.comparison-table th.company-name,
.comparison-table td.company-name {width:171px; max-width:171px;}
.comparison-table th.company-name .logo {display:flex; justify-content:center; align-items:center; height:80px;}
.comparison-table th.company-name .logo img {width:80px; height:auto;}
.comparison-table th.company-name a {color:#18a; text-decoration:underline;}
.comparison-table th.company-name a:hover {text-decoration:none; opacity:0.8;}
.comparison-table th.company-spread {width:185px; max-width:185px;}
.comparison-table td.ranking-point span {color:#e66; font-weight:bold; font-size:120%;}
.comparison-table td.water-price span {display:block; -webkit-box-orient:vertical; display:-webkit-box; -webkit-line-clamp:3; overflow:hidden; text-align:left;}
.comparison-table td.btn-table-official span {display:table; width:100%;}
.comparison-table td.btn-table-official span a {display:table-cell; width:80px; height:40px; background-color:#3a8de9; vertical-align:middle; color:#fff; border-radius:4px; text-decoration:none;
	box-shadow: 2px 2px 0px 0px rgba(88, 88, 88, 0.2);}
.comparison-table td.btn-table-official span a:hover {opacity:0.8;}
.comparison-table .cell-fixed {position:sticky; top:0; left:0;}
.comparison-table .cell-fixed::before {content:""; position:absolute; top:0; left:-1px; width:99%; height:100%; z-index:-1; border-left:2px solid #0d3182; border-right:1px solid #c7d0e3;}
.comparison-table .cell-fixed2 {position:sticky; top:0; left:73px;}
.comparison-table .cell-fixed2::before {content:""; position:absolute; top:0; left:0; width:99%; height:100%; z-index:-1;  border-right:1px solid #c7d0e3;}
.comparison-table tr td.comparison-rank {color:#999;}
.comparison-table tr td.comparison-rank01 {font-weight:bold; color:#e66; font-size:110%; background-color:#fffdf0;}
.comparison-table tr td.comparison-rank01 span {display:inline-block; background:url(https://life-cdn.oricon.co.jp/img/common/icon-rank-gold.png) 50% 0 no-repeat; background-size:12px auto; padding-top:11px;}
.comparison-table tr td.comparison-rank02 {font-weight:bold; color:#e66; font-size:110%; background-color:#f5f9ff;}
.comparison-table tr td.comparison-rank02 span {display:inline-block; background:url(https://life-cdn.oricon.co.jp/img/common/icon-rank-silver.png) 50% 0 no-repeat; background-size:12px auto; padding-top:11px;}
.comparison-table tr td.comparison-rank03 {font-weight:bold; color:#e66; font-size:110%; background-color:#fff8f3;}
.comparison-table tr td.comparison-rank03 span {display:inline-block; background:url(https://life-cdn.oricon.co.jp/img/common/icon-rank-bronze.png) 50% 0 no-repeat; background-size:12px auto; padding-top:11px;}
.comparison-table tr td span.amazing {font-weight: bold;}
.comparison-table tr td span.awesome {color: #f00;}
.comparison-table tr td img.rank-icon {width: 26px; height: auto;}
.comparison-table tr td img.crown {width: 52px;}

.table-display-btn {margin:2px auto 2px;}
.table-display-btn p a {display:block; text-align:center; font-size:90%; color:#0d3182; padding:5px 10px; border:1px solid #0d3182; background-color:#f3f7ff;}
.table-display-btn p a:after {content:""; display:inline-block; vertical-align:middle; color:#0d3182; line-height:1; width:6px; height:6px; border:1px solid #0d3182; border-left:0; border-bottom:0; box-sizing:border-box; margin-left:10px; margin-bottom:2px;
	transform:translateY(-25%) rotate(135deg);}
.table-display-btn p a:hover {opacity:0.6;}
.table-display-btn p a.table-open:after {transform:translateY(25%) rotate(-45deg);}
.annotation {margin:2px auto 2px;}
.annotation p {font-size: 10px;}