@charset "utf-8";
@charset "utf-8";
@charset "utf-8";
@charset "utf-8";
@charset "utf-8";
@charset "utf-8";
@charset "utf-8";
@charset "utf-8";






 @import url("https://fonts.googleapis.com/css?family=M+PLUS+1p:400,700&display=swap");
@import url("https://fonts.googleapis.com/css?family=M+PLUS+Rounded+1c:400,700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap");
* {
margin: 0;
padding: 0;
}
body {
background: #FFF;
color: #333;
font-family: "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size: 90%;
text-align: center;
-webkit-text-size-adjust: none;
}
p {
text-align: justify;
text-justify: inter-ideograph;
}
p.nm {
margin-bottom: 0px !important;
}
h1, h2, h3, h4 {
font-size: 100%;
}
hr {
margin-bottom: 1em;
border: 0px;
border-bottom: 1px dashed #BBBBBB;
}
table {
border-collapse: collapse;
border-spacing: 0;
empty-cells: show;
}
th {
font-weight: normal;
text-align: left;
}
img {
vertical-align: bottom;
max-width: 100%;
height: auto;
-webkit-backface-visibility: hidden;
} a { text-decoration: none; }
a img { border: none; }
@media print, screen and (min-width:769px){
a:active, a:hover {
filter:alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
cursor: pointer;
transition: all 0.3s ease 0s;
} }   .b  { font-weight: bold; } .fs { font-size: 85%; } .fm { font-size: 110%; }  .cen { text-align: center; } .lft { text-align: left; } .rit { text-align: right; } .vtop { vertical-align: top; } .vbtm { vertical-align: bottom; } .ind { text-indent: -0.5em; } .img_lft { float: left; margin-right: 20px; }
.img_rit { float: right; margin-left: 20px; }  .disabled {
ime-mode: disabled;
border: 1px solid #A5ACB2;
padding: 2px;
} .active {
ime-mode: active;
border: 1px solid #A5ACB2;
padding: 2px;
}  .cb { clear: both; } .cf:after,
.cb:after,
.box:after,
.main:after {
clear: both;
display: block;
overflow: hidden;
height: 0px;
content: "";
}
 #container h3.sub,
#container .mp {
font-family: 'M PLUS 1p', sans-serif;
}
#container .mpr,
#page_title .sub,
#policy h4 {
font-family: 'M PLUS Rounded 1c', sans-serif;
}
#top_company_list .wrap .box table tr th,
#top_company_other_list .wrap .box table tr th,
#container .sans,
#faq dl dt {
font-family: 'Noto Sans JP', sans-serif;
} .red { color: #ff0a34; } .pick { color: #0200FF; } .thin { color: #666666; } .blue { color: #096ad6; } .yellow { color: #f6ff00; }  a:link, a:visited {
color: #096ad6;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}  #menu li.on a,
#menu li a:hover {
border-color: #0200FF;
} #header .contact .btn {
background: #0200FF;
} #container h3.sub:before {
background: #096ad6;
} #footer {
background-color: #096ad6;
} @media only screen and (max-width: 768px) { #switchBtnArea #switchBtn {
background: #096ad6;
}
} #header {
height: 81px;
padding: 15px;
text-align: left;
} #header h1.title {
float: left;
height: 40px;
display: flex;
display: -webkit-flex;
align-items: center;
-webkit-align-items: center;
} #menu {
position: absolute;
right: 0;
top: 0;
}
#menu ul {
overflow: hidden;
}
#menu li {
float: left;
width: 145px;
border-right: 1px solid #e5e5e5;
list-style: none;
}
#menu li a {
display: block;
width: 100%;
height: 111px;
box-sizing: border-box;
padding-top: 60px;
color: #333;
font-size: 15px;
text-align: center;
text-decoration: none;
background: rgba(255, 255, 255, 0.8) url(//www.hikaku-navi.bz/img/menu/menu01.png) no-repeat center top 25px;
}
#menu li:nth-of-type(2) a {
background-image: url(//www.hikaku-navi.bz/img/menu/menu02.png);
}
#menu li:nth-of-type(3) a {
background-image: url(//www.hikaku-navi.bz/img/menu/menu03.png);
}
#menu li.link_faq a {
background-image: url(//www.hikaku-navi.bz/img/menu/menu04.png);
}
#menu li.link_information_provision a {
background-image: url(//www.hikaku-navi.bz/img/menu/menu05.png);
}
#menu li.link_info a {
background-image: url(//www.hikaku-navi.bz/img/menu/menu06.png); }
#menu li.on a,
#menu li a:hover {
filter:alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
background: rgba(9, 106, 214 , 0.8) url(//www.hikaku-navi.bz/img/menu/menu01_on.png) no-repeat center top 25px;
color: #fff;
}
#menu li.on:nth-of-type(2) a,
#menu li:nth-of-type(2) a:hover {
background-image: url(//www.hikaku-navi.bz/img/menu/menu02_on.png);
}
#menu li.on:nth-of-type(3) a,
#menu li:nth-of-type(3) a:hover {
background-image: url(//www.hikaku-navi.bz/img/menu/menu03_on.png);
}
#menu li.link_faq.on a,
#menu li.link_faq a:hover {
background-image: url(//www.hikaku-navi.bz/img/menu/menu04_on.png);
}
#menu li.link_information_provision.on a,
#menu li.link_information_provision a:hover {
background-image: url(//www.hikaku-navi.bz/img/menu/menu05_on.png);
}
#menu li.link_info.on a,
#menu li.link_info a:hover {
background-image: url(//www.hikaku-navi.bz/img/menu/menu06_on.png);
} #page_title {
overflow: hidden;
position: relative; text-align: center;
}
#page_title p {
text-align: center;
} #page_title:before,
#page_title:after {
position: absolute;
left: 0;
display: block;
width: 100%;
height: 1px;
content: "";
}
#page_title:before {
top: 0;
box-shadow: 0px 3px 8px rgba(0,0,0,0.2);
}
#page_title:after {
bottom: 0;
box-shadow: 0px -3px 8px rgba(0,0,0,0.2);
}
#page_title .top img {
width: 100%;
}
#page_title .sub {
padding: 180px 0 50px;
background: #b2d1ed;
text-align: center;
font-size: 40px;
color: #096AD6;
line-height: 1.2em;
}
#page_title .sub span {
display: block;
font-size: 30px;
color: #6BA6E6;
} #agreement_title_box,
#ranking_title_box,
#feature_title_box,
#faq_title_box,
#policy_title_box,
#information_provision_box,
#information_title_box,
#news_title_box {
position: relative;
height: 350px;
}
#agreement_title_box {
background: url(//www.hikaku-navi.bz/img/agreement/bg_title.jpg?20220315) center right / cover no-repeat !important;
} #ranking_title_box {
background: url(//www.hikaku-navi.bz/img/ranking/bg_title.jpg) center right / cover no-repeat !important;
}
#feature_title_box {
background: url(//www.hikaku-navi.bz/img/feature/bg_title.jpg) center right / cover no-repeat !important;
}
#faq_title_box {
background: url(//www.hikaku-navi.bz/img/faq/bg_title.jpg?20220315) center right / cover no-repeat !important;
}
#policy_title_box {
background: url(//www.hikaku-navi.bz/img/policy/bg_title.jpg?20220315) center right / cover no-repeat !important;
}
#information_provision_box {
background: url(//www.hikaku-navi.bz/img/information_provision/bg_title.jpg?20220325) center right / cover no-repeat !important;
}
#information_title_box {
background: url(//www.hikaku-navi.bz/img/info/bg_title_info.jpg?20220325) center right / cover no-repeat !important;
}
#news_title_box {
background: url(//www.hikaku-navi.bz/img/info/bg_title_news.jpg?20220315) center right / cover no-repeat !important;
}
#agreement_title_box #agreement_title,
#ranking_title_box #ranking_title,
#feature_title_box #feature_title,
#faq_title_box #faq_title,
#policy_title_box #policy_title,
#information_title_box #information_title,
#news_title_box #news_title,
#information_provision_box #information_provision_title {
position: absolute;
top: 50%;
left: 50px;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
z-index: 999;
}    #container {
overflow: hidden;
text-align: left;
line-height: 1.6;
}
#container p {
margin-bottom: 1em;
}
#container p.nm {
margin-bottom: 0;
}
#container h3.sub {
position: relative;
margin-bottom: 40px;
padding-bottom: 5px;
font-size: 23px;
font-weight: normal;
text-align: center;
}
#container h3.sub:before {
position: absolute;
left: 50%;
bottom: 0;
display: block;
width: 50px;
height: 2px;
margin-left: -25px;
content: "";
} .main {
clear: both;
} #footer {
padding: 40px 0 0;
}
#footer, #footer a {
color: #fff;
}
#footer .wrap {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#footer .wrap .box, #footer .wrap .link {
width: 50%;
}
#footer .wrap .box {
display:flex;
flex-wrap:wrap;
align-items: center;
justify-content: space-between;
}
#footer .wrap .box .photo {
width: calc(100% - 370px);
padding-right: 30px;
box-sizing: border-box;
}
#footer .wrap .box dl {
width: 350px;
}
#footer .wrap .box dl dt {
font-size: 21px;
font-weight: bold;
text-align: left;
margin-bottom: 20px;
}
#footer .wrap .box dl dd ul li {
margin-bottom: 10px;
}
#footer .wrap .box dl dd ul li:before {
content: "・";
}
#footer ul {
list-style: none;
}
#footer ul li {
text-align: left;
}
#footer .link {
overflow: hidden;
}
#footer .link ul {
float: left;
border-left: 1px solid #fff;
padding-left: 20px;
margin-right: 50px;
}
#footer .link ul li {
text-align: left;
position: relative;
padding-left: 20px;
margin-bottom: 10px;
}
#footer .link ul li::before{
content: '';
width: 6px;
height: 6px;
border: 0px;
border-top: solid 2px #fff;
border-right: solid 2px #fff;
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
position: absolute;
top: 50%;
left: 0;
margin-top: -4px;
}
#footer .link ul li a {
color: #FFF;
}
#footer .link ul li a:hover {
text-decoration: underline;
} #copyright {
height: 30px;
line-height: 30px;
font-size: 11px;
color: #ccc;
} #page_top {
width: 50px;
height: 50px;
position: fixed;
right: 0;
bottom: 0;
background: #89B8EC;
opacity: 0.6;
z-index: 99;
}
#page_top a {
position: relative;
display: block;
width: 50px;
height: 50px;
text-decoration: none;
z-index: 999;
}
#page_top a::before{
content: "↑";
font-weight: 900;
font-size: 25px;
color: #fff;
position: absolute;
width: 25px;
height: 25px;
top: 0;
bottom: 0;
right: 0;
left: 0;
margin: auto;
text-align: center;
}  #page_navi {
clear: both;
margin-bottom: 40px;
padding-top: 30px;
color: #999;
font-size: 12px;
line-height: 1;
}
#page_navi li {
display: inline;
}
#page_navi li+li {
margin-left: 8px;
}
#page_navi li+li:before {
content: ">";
margin-right: 8px;
}
#page_navi a { text-decoration: none; color: #096ad6; } .tbl {
width: 100%;
}
.tbl th,
.tbl td {
padding: 10px;
border: 1px solid #BBBBBB;
}
.tbl th {
white-space: nowrap;
background: #EEEEEE;
} p.attention {
margin-left: 1em;
text-indent: -1em;
}
  .mb {
margin-bottom: 80px;
}
.pt {
padding-top: 80px;
}
.pb {
padding-bottom: 80px;
} .bg_wide {
position: relative;
}
.bg_wide::before {
position: absolute;
left: 0;
top: 0;
display: block;
width: 100vw;
height: 100%;
margin-left: calc(((100vw - 100%) / 2) * -1);
margin-right: calc(((100vw - 100%) / 2) * -1);
content: "";
z-index: -1;
}
@media only screen and (max-width: 1150px) {
.bg_wide::before {
width: calc(100% + 50px);
margin-left: -25px;
margin-right: 0;
}
} #top_about {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#top_about .item {
width: 340px;
}
#top_about .item .ico {
margin-bottom: 0;
text-align: center;
}
#top_about .item .ico img {
display: inline !important;
}
#top_about dl {
position: relative;
width: 340px;
box-sizing: border-box;
border-top: 2px solid #096ad6;
}
#top_about dl dt {
position: relative;
background: #fff;
border: 1px solid #ccc;
border-top: none;
text-align: center;
font-size: 22px;
font-weight: bold;
padding: 20px 0;
}
#top_about dl dt:after, #top_about dl dt:before {
position: absolute;
width: 0;
height: 0;
left: calc(50% - 11px);
transform:rotate(180deg);
border: solid transparent;
border-width: 0 11px 12px 11px; content: "";
}
#top_about dl dt:before {
bottom: -12px;
border-bottom-color: #ccc;
}
#top_about dl dt:after {
bottom: -10.5px; border-bottom-color: #fff;
}
#top_about dl dd {
padding: 25px 25px 60px;
overflow: hidden;
position: relative;
border: 1px solid #ccc;
border-top: none; }
#top_about dl dd.close {
height: 200px;
} #top_about dl dd .ico {
position: absolute;
top: -150px;
left: calc(50% - 23px);
}
#top_about dl:nth-of-type(2) dd .ico {
left: calc(50% - 53px);
}
#top_about dl:nth-of-type(3) dd .ico {
left: calc(50% - 44px);
}
#top_about dl dd .txt a {
text-decoration: underline;
}
#top_about dl dd .btn {
position: absolute;
display: block;
width: 100%;
height: 100px;
text-align: center;
left: 0;
bottom: 0;
background : -moz-linear-gradient(50% 100% 90deg,rgba(255, 255, 255, 1) 21.88%,rgba(255, 255, 255, 0) 100%);
background : -webkit-linear-gradient(90deg, rgba(255, 255, 255, 1) 21.88%, rgba(255, 255, 255, 0) 100%);
background : -webkit-gradient(linear,50% 100% ,50% 0% ,color-stop(0.2188,rgba(255, 255, 255, 1) ),color-stop(1,rgba(255, 255, 255, 0) ));
background : -o-linear-gradient(90deg, rgba(255, 255, 255, 1) 21.88%, rgba(255, 255, 255, 0) 100%);
background : -ms-linear-gradient(90deg, rgba(255, 255, 255, 1) 21.88%, rgba(255, 255, 255, 0) 100%);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#FFFFFF' ,GradientType=0)";
background : linear-gradient(0deg, rgba(255, 255, 255, 1) 21.88%, rgba(255, 255, 255, 0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF',endColorstr='#FFFFFF' , GradientType=0);
cursor: pointer;
}
#top_about dl dd .btn img {
position: absolute;
bottom: 10px;
left: calc(50% - 9px)
}
#top_search .bg_wide:before {
background: url(//www.hikaku-navi.bz/img/top/bg.jpg) no-repeat center /cover;
}
#top_search .bg_wide h3 {
color: #fff;
text-align: center;
font-size: 33px;
padding: 41px 0;
}
#top_search .search_area h3 {
font-size: 32px; color: #096ad6;
margin-bottom: 30px;
}
#top_search .search_area table {
border-left: 2px solid #81d0ef;
position: relative;
margin-bottom: 50px;
width: 100%;
}
#top_search .search_area table tr th, #top_search .search_area table tr td {
border: 1px solid #ccc;
padding: 15px;
}
#top_search .search_area table tr th {
width: 214px;
box-sizing: border-box;
text-align: center;
vertical-align: top;
background: rgba(89, 173, 217, 0.1);
color: #096ad6;
font-size: 18px;
}
#top_search .search_area table tr td span {
display: inline-block;
min-width: 140px;
}
#top_search .search_area table tr td input {
vertical-align: middle;
margin-right: 5px;
}
#top_search .search_area .btn {
display: inline-block;
border: 1px solid rgb(226, 9, 45);
border-radius: 9px;
}
#top_search .search_area input[type="submit"] {
display: block;
color: #fff;
background : -moz-linear-gradient(50% 0% -90deg,rgba(253, 108, 132, 1) 0%,rgba(226, 9, 45, 1) 100%);
background : -webkit-linear-gradient(-90deg, rgba(253, 108, 132, 1) 0%, rgba(226, 9, 45, 1) 100%);
background : -webkit-gradient(linear,50% 0% ,50% 100% ,color-stop(0,rgba(253, 108, 132, 1) ),color-stop(1,rgba(226, 9, 45, 1) ));
background : -o-linear-gradient(-90deg, rgba(253, 108, 132, 1) 0%, rgba(226, 9, 45, 1) 100%);
background : -ms-linear-gradient(-90deg, rgba(253, 108, 132, 1) 0%, rgba(226, 9, 45, 1) 100%);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#FD6C84', endColorstr='#E2092D' ,GradientType=0)";
background : linear-gradient(180deg, rgba(253, 108, 132, 1) 0%, rgba(226, 9, 45, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FD6C84',endColorstr='#E2092D' , GradientType=0);
border: 1px solid #fff;
font-size: 27px;
width: 309px;
height: 49px;
box-sizing: border-box;
padding-bottom: 5px;
border-radius: 9px;
cursor: pointer;
}
#top_search .search_area input[type="submit"]:hover {
filter:alpha(opacity=70);
-moz-opacity: 0.7;
opacity: 0.7;
} #top_search .comingsoon {
display: -webkit-flex;
display: flex;
-webkit-justify-content: center;
justify-content: center;
flex-wrap: wrap;  -webkit-align-items: center; align-items: center; }
#top_search .comingsoon p {
margin-bottom: 0;
}
#top_search .comingsoon .txt {
position: relative;
font-size: 18px;
background: #096ad6;
border-radius: 5px;
padding: 10px;
color: #FFF;
}
#top_search .comingsoon .txt::after {
position: absolute;
top: calc(50% - 16px);
left: -16px;
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 16px 20px 16px 0;
border-color: transparent #096ad6 transparent transparent;
}
#top_link:before {
background: #f2f2f2;
}
#top_link .wrap {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#top_link .wrap a {
display: block;
box-shadow: 2px 2px 10px rgba(0,0,0,0.2);
box-sizing: border-box;
border: 5px solid #096ad6;
border-radius: 19px;
background: #fff;
width: 340px;
padding: 40px 0 20px;
color: #333;
}
#top_link .wrap a .box {
position: relative;
}
#top_link .wrap a .box .ico {
text-align: center;
position: absolute;
top: -85px;
left: calc(50% - 37px);
}
#top_link .wrap a .box h3 {
color: #0054d9;
font-size: 25px;
margin-bottom: 10px;
}
#top_company_list h3 {
font-size: 35px;
margin-bottom: 20px; }
#top_company_list h4 {
font-weight: normal;
margin-bottom: 50px;
}
#top_company_list .wrap {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
flex-wrap: wrap;
}
#top_company_list .wrap .box {
border-top: 2px solid #096ad6;
width: 530px;
margin-bottom: 50px;
}
#top_company_list .wrap .box dl {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
box-shadow: 1px 0 3px rgba(0,0,0,0.2);
}
#top_company_list .wrap .box dl dt {
position: relative;
} #top_company_list .wrap .box dl dd {
padding: 10px;
}
#top_company_list .wrap .box table {
box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
}
#top_company_list .wrap .box table tr {
border-top: 1px solid #ccc;
}
#top_company_list .wrap .box table tr th, #top_company_list .wrap .box table tr td {
padding: 10px 20px;
}
#top_company_list .wrap .box table tr th {
width: 110px;
background : rgba(89, 173, 217, 0.1);
color: #096ad6;
vertical-align: top;
}
#top_company_list .wrap .box table tr td {
font-size: 13.8px;
}
#top_company_other_list {
margin-bottom: 140px;
}
#top_company_other_list .wrap .box table tr:last-child {
height: 4em;
}
#top_company_other_list h3 {
text-align: center;
background: #096ad6;
color: #fff;
font-size: 25px;
line-height: 44px;
}
#top_company_other_list .wrap {
border: 1px solid #ccc;
padding: 30px 25px 0;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
flex-wrap: wrap;
overflow-y: scroll;
height: 280px;
}
#top_company_other_list .wrap .box {
box-shadow: 2px 2px 10px rgba(0,0,0,0.2);
border-top: 2px solid #096ad6;
width: 510px;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
margin-bottom: 30px;
}
#top_company_other_list .wrap .box dl {
position: relative;
width: 175px;
}
#top_company_other_list .wrap .box dt {
margin-bottom: 10px;
}
#top_company_other_list .wrap .box dd {
position: absolute;
bottom: 5px;
left: 20px;
text-align: center;
color: #096ad6;
font-size: 16px;
font-weight: bold;
}
#top_company_other_list .wrap .box dd .fs {
font-size: 12px;
}
#top_company_other_list .wrap .box dd .fm {
font-size: 30px;
}
#top_company_other_list .wrap .box table {
width: 335px;
}
#top_company_other_list .wrap .box table tr:not(:last-of-type) {
border-bottom: 1px solid #ccc;
}
#top_company_other_list .wrap .box table tr th, #top_company_other_list .wrap .box table tr td {
padding: 5px 9px;
word-break: break-all;
}
#top_company_other_list .wrap .box table tr th {
width: 80px;
background : rgba(89, 173, 217, 0.1);
color: #096ad6;
vertical-align: top;
white-space: nowrap;
}
#top_company_search_result {
margin-bottom: 140px;
}
#top_company_search_result .btn{
cursor:pointer;
}
#top_company_search_result .wrap .box table tr:last-child {
height: 4em;
}
#top_company_search_result h3 {
text-align: center;
background: #096ad6;
color: #fff;
font-size: 25px;
line-height: 44px;
}
#top_company_search_result_con{
display:none;
}
#top_company_search_result .wrap {
border: 1px solid #ccc;
padding: 30px 25px 0;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
flex-wrap: wrap;
}
#top_company_search_result .wrap .box {
box-shadow: 2px 2px 10px rgba(0,0,0,0.2);
border-top: 2px solid #096ad6;
width: 510px;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
margin-bottom: 30px;
}
#top_company_search_result .wrap .box dl {
position: relative;
width: 175px;
}
#top_company_search_result .wrap .box dt {
margin-bottom: 10px;
}
#top_company_search_result .wrap .box dd {
position: absolute;
bottom: 5px;
left: 20px;
text-align: center;
color: #096ad6;
font-size: 16px;
font-weight: bold;
}
#top_company_search_result .wrap .box dd .fs {
font-size: 12px;
}
#top_company_search_result .wrap .box dd .fm {
font-size: 30px;
}
#top_company_search_result .wrap .box table {
width: 335px;
}
#top_company_search_result .wrap .box table tr:not(:last-of-type) {
border-bottom: 1px solid #ccc;
}
#top_company_search_result .wrap .box table tr th, #top_company_search_result .wrap .box table tr td {
padding: 5px 9px;
word-break: break-all;
}
#top_company_search_result .wrap .box table tr th {
width: 80px;
background : rgba(89, 173, 217, 0.1);
color: #096ad6;
vertical-align: top;
white-space: nowrap;
}
#top_score {
margin-top: -50px;
padding-top: 150px;
}
#top_score .bg:before {
background: #f2f2f2;
}
#top_score h3 {
position: relative;
top: -210px;
margin-bottom: -170px;
text-align: center;
}
#top_score .wrap {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
flex-wrap: wrap;
}
#top_score .wrap dl {
width: 340px;
background: #fff;
margin-bottom: 40px;
}
#top_score .wrap dt {
border-bottom: 1px solid #096ad6;
}
#top_score .wrap dt .sans {
display: inline-block;
width: 43px;
height: 43px;
line-height: 43px;
text-align: center;
color: #fff;
font-size: 21px;
background: #096ad6;
}
#top_score .wrap dt .txt {
font-size: 18px;
line-height: 37px;
color: #096ad6;
font-weight: bold;
padding-left: 15px;
}
#top_score .wrap dd {
padding: 15px;
}
#top_professional {
padding-top: 50px;
}
#top_professional .bg:before {
background: url(//www.hikaku-navi.bz/img/top/bg02.jpg) no-repeat center /cover;
}
#top_professional h3 {
font-size: 33px;
color: #fff;
padding: 72px 0;
line-height: 1.75;
}
#top_professional .bg02:before {
background: #f2f2f2;
}
#top_professional .box {
background: #fff;
padding: 50px;
position: relative;
top: -50px;
margin-bottom: -50px;
}
#top_professional .box .prof {
margin-bottom: 50px;
}
#top_professional .box .prof, #top_professional .wrap {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#top_professional .box .prof .img {
width: 303px;
margin-bottom: 0;
}
#top_professional .box .prof table {
width: 680px;
}
#top_professional .box .prof table tr {
border-bottom: 1px solid #0054d9;
}
#top_professional .box .prof table tr th, #top_professional .box .prof table tr td {
padding: 5px;
}
#top_professional .box .prof table tr th {
padding-top: 10px;
}
#top_professional .box .prof table tr:first-of-type th, #top_professional .box .prof table tr:first-of-type td {
padding-top: 0;
}
#top_professional .box .prof table tr th {
color: #555;
font-weight: bold;
width: 150px;
vertical-align: top;
}
#top_professional .box .prof table tr td {
line-height: 1.5;
}
#top_professional .box .prof table tr td a {
text-decoration: underline;
}
#top_professional .box .prof table tr td img {
margin-left: 15px;
vertical-align: middle;
}
#top_professional .wrap dl {
width: 485px;
}
#top_professional .wrap dl dt {
border-left: 4px solid #096ad6;
font-size: 18px;
font-weight: bold;
padding-left: 15px;
margin-bottom: 30px;
}
#top_information {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#top_information .top_info {
width: 530px;
}
#top_information h3 {
font-size: 24px;
font-weight: normal;
color: #fff;
padding: 5px 0;
background: url(//www.hikaku-navi.bz/img/top/bg_rit.png) no-repeat right, #096ad6 url(//www.hikaku-navi.bz/img/top/bg_lft.png) no-repeat left;
text-align: center;
line-height: 45px;
position: relative;
box-sizing: border-box;
}
#top_information h3:after {
content: "";
position: absolute;
width: 0;
height: 0;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-top: 13px solid #096ad6;
left: calc(50% - 15px);
bottom: -13px;
}
#top_information h3 span:before, #top_information h3 span:after {
content: "";
background: url(//www.hikaku-navi.bz/img/top/line_lft.png) no-repeat;
height: 32px;
width: 17px;
position: relative;
top: 5px;
display: inline-block;
margin-right: 15px;
}
#top_information h3 span:after {
background-image: url(//www.hikaku-navi.bz/img/top/line_rit.png);
margin-right: 0;
margin-left: 15px;
}
#top_information .box {
border: 1px solid #096ad6;
padding: 30px 20px 20px;
position: relative;
}
#top_information .box .in {
height: 430px;
overflow-x: auto;
}
#top_information .box dl {
border-bottom: 1px dashed #CCCCCC;
padding-bottom: 10px;
margin-bottom: 10px;
display: -webkit-flex;
display: flex;
-webkit-justify-content: flex-start;
justify-content: flex-start;
flex-wrap: wrap; }
#top_information .box dt {
color: #666;
width: 100px;
}
#top_information .box dd {
width: calc( 100% - 100px );
}
#top_information .box dd a {
color: #000;
text-decoration: underline;
}
#top_information .box p.rit {
margin-bottom: 0;
position: absolute;
right: -1px;
bottom: 0;
}
#top_information .box p.rit a {
display: inline-block;
width: 57px;
height: 57px;
background: url(//www.hikaku-navi.bz/img/top/bg_rit2.png) no-repeat;
}
#top_information .box p.rit a span {
color: #fff;
transform:rotate(-45deg);
display: inline-block;
padding-top: 25px;
padding-right: 15px;
}
#top_company_other_list .blind {
display: none;
} #ranking .box {
box-shadow: 1px 0 3px rgba(0,0,0,0.2);
margin-bottom: 50px;
}
#ranking .box .bg_blue {
background: #0054d9;
position: relative;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#ranking .box .bg_blue:before {
content: "";
background: url(//www.hikaku-navi.bz/img/ranking/rank01.png) no-repeat center /100%;
width: 65px;
height: 51px;
position: absolute;
top: -5px;
left: 15px;
}
#ranking .box:nth-of-type(2) .bg_blue:before {
background-image: url(//www.hikaku-navi.bz/img/ranking/rank02.png);
}
#ranking .box:nth-of-type(3) .bg_blue:before {
background-image: url(//www.hikaku-navi.bz/img/ranking/rank03.png);
}
#ranking .box .bg_blue h3 a {
text-decoration: underline;
font-size: 28px;
color: #fff;
line-height: 52px;
padding-left: 95px;
}
#ranking .box .bg_blue .mpr {
color: #fff;
font-size: 12px;
font-weight: bold;
text-align: center;
padding: 8px 15px 0 0;
line-height: 1;
}
#ranking .box .bg_blue .mpr .top {
font-size: 38px;
line-height: 1;
margin: 0 5px;
}
#ranking .box .bg_blue .mpr .bottom {
font-size: 17px;
}
#ranking .box .in {
padding: 30px;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#ranking .box .in .lft {
width: 330px;
}
#ranking .box .in .lft .btn {
display: inline-block;
border: 1px solid rgb(226, 9, 45);
border-radius: 9px;
margin-top: 10px;
margin-bottom: 0;
}
#ranking .box .in .lft .btn a {
display: block;
color: #fff;
background : -moz-linear-gradient(50% 0% -90deg,rgba(253, 108, 132, 1) 0%,rgba(226, 9, 45, 1) 100%);
background : -webkit-linear-gradient(-90deg, rgba(253, 108, 132, 1) 0%, rgba(226, 9, 45, 1) 100%);
background : -webkit-gradient(linear,50% 0% ,50% 100% ,color-stop(0,rgba(253, 108, 132, 1) ),color-stop(1,rgba(226, 9, 45, 1) ));
background : -o-linear-gradient(-90deg, rgba(253, 108, 132, 1) 0%, rgba(226, 9, 45, 1) 100%);
background : -ms-linear-gradient(-90deg, rgba(253, 108, 132, 1) 0%, rgba(226, 9, 45, 1) 100%);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#FD6C84', endColorstr='#E2092D' ,GradientType=0)";
background : linear-gradient(180deg, rgba(253, 108, 132, 1) 0%, rgba(226, 9, 45, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FD6C84',endColorstr='#E2092D' , GradientType=0);
border: 1px solid #fff;
font-size: 27px;
width: 309px;
height: 49px;
box-sizing: border-box;
padding-bottom: 5px;
border-radius: 9px;
text-align: center;
}
#ranking .box .in .lft .btn a:after {
content: url(//www.hikaku-navi.bz/img/ranking/btn.png);
position: relative;
top: 1px;
left: 10px;
}
#ranking .box .in .rit {
width: 688px;
text-align: left;
}
#ranking .box .in .rit .point .label {
display: inline-block;
background: #00a9d9;
color: #fff;
border-radius: 5px 5px 0 0;
margin-bottom: 0;
line-height: 27px;
padding: 0 8px;
}
#ranking .box .in .rit .point .waku {
border: 1px solid #00a9d9;
padding: 15px;
margin-bottom: 10px;
}
#ranking .box .in .rit .point .waku ul {
list-style: none;
}
#ranking .box .in .rit .point .waku ul li {
background: url(//www.hikaku-navi.bz/img/ranking/chk.png) no-repeat left top 3px;
padding-left: 25px;
margin-bottom: 10px;
}
#ranking .box .in .rit .point .waku ul li:last-of-type {
margin-bottom: 0;
}
#ranking .box .in .rit table {
width: 100%;
}
#ranking .box .in .rit table tr {
border-top: 1px solid #ccc;
}
#ranking .box .in .rit table tr:last-of-type {
border-bottom: 1px solid #ccc;
}
#ranking .box .in .rit table tr th, #ranking .box .in .rit table tr td {
padding: 7px;
}
#ranking .box .in .rit table tr th {
background : rgba(89, 173, 217, 0.1);
color: #096AD6;
}
#ranking h4 {
padding: 6px 0 8px;
background: #096ad6;
color: #fff;
font-size: 25px;
text-align: center;
line-height: 1.2;
}
#ranking .under4 .box {
overflow: auto;
padding: 15px;
height: 155px;
border: 1px solid #ccc;
}
#ranking .under4 .blind {
display: none;
}
#ranking .under4 table {
width: 100%;
}
#ranking .under4 table tr {
border-top: 1px solid #ccc;
}
#ranking .under4 table tr:nth-of-type(2) {
border-top: none;
}
#ranking .under4 table tr:last-of-type {
border-bottom: 1px solid #ccc;
}
#ranking .under4 table tr th {
text-align: center;
background: rgba(89, 173, 217, 0.1);
color: #096ad6;
}
#ranking .under4 table tr th,#ranking .under4 table tr td {
border-right: 1px solid #ccc;
padding: 5px;
}
#ranking .under4 table tr th:last-of-type,#ranking .under4 table tr td:last-of-type {
border-right: none;
}
#ranking .under4 table tr td {
padding: 10px;
}
#ranking .under4 table tr td a {
text-decoration: underline;
}
#ranking .under4 table tr td.sans {
font-weight: bold;
}
#ranking .under4 table tr td.sans .rank {
display: inline-block;
background: url(//www.hikaku-navi.bz/img/ranking/rank.png) no-repeat;
width: 30px;
height: 22px;
box-sizing: border-box;
padding-top: 4px;
text-align: center;
color: #fff;
font-size: 12px;
margin-right: 5px;
}
#ranking .under4 table tr td.mpr {
color: #096ad6;
font-size: 12px;
font-weight: bold;
text-align: center;
}
#ranking .under4 table tr td.mpr .top {
font-size: 38px;
line-height: 1;
}
#ranking .under4 table tr td.mpr .bottom {
font-size: 17px;
} #feature .pick {
color: #0054d9;
}
#feature .about {
position: relative;
border-top: 3px solid #0054d9;
}
#feature .about h3 {
margin-bottom: 20px;
padding: 20px 0;
font-size: 35px;
border-bottom: 2px dotted #bbb;
}
#feature .about h4 {
margin-bottom: 15px;
padding-left: 10px;
border-left: 4px solid #096ad2;
font-size: 20px;
line-height: 1.2;
}
#feature .about .btn a {
display: block;
width: 280px;
background: linear-gradient(top, #fd6c84, #e2092d);
background: -ms-linear-gradient(top, #fd6c84, #e2092d);
background: -moz-linear-gradient(top, #fd6c84, #e2092d);
background: -webkit-linear-gradient(top, #fd6c84, #e2092d);
border: 1px solid #e2092d;
border-radius: 10px;
box-shadow: 0 0 0 1px #fff inset, 0 0 10px rgba(0,0,0,0.2);
color: #fff;
font-size: 27px;
line-height: 50px;
text-align: center;
}
#feature .about .btn a {
}
#feature .about ul:not(.list) {
margin-left: 1.5em;
}
#feature .about .list {
margin-bottom: 20px;
}
#feature .about .list li {
display: inline-block;
margin-right: 10px;
padding: 5px 15px 3px;
background: #fff0f4;
border: 1px solid #e2092d;
color: #e2092d;
line-height: 1.3;
}
@media print, screen and (min-width: 641px){ #feature .about {
padding-left: calc(30% + 30px);
font-size: 110%;
}
#feature .about .photo {
position: absolute;
top: 0;
left: 0;
width: 30%;
}
} #feature .box {
padding: 50px;
background: #f2f2f2;
}
#feature .box h4 {
margin-bottom: 25px;
padding: 5px 10px;
background: #0054d9;
color: #fff;
font-size: 25px;
font-weight: 500;
line-height: 1.3;
} #feature .note,
#feature .price {
margin-bottom: 30px;
background: #fff;
font-size: 110%;
}
#feature .note dt {
padding: 25px;
background: #eef7fb;
color: #0054d9;
box-sizing: border-box;
}
#feature .note dd {
padding: 25px;
box-sizing: border-box;
}
#feature .price {
border-left: 2px solid #0054d9;
}
#feature .price dt {
padding: 15px;
color: #0054d9;
}
#feature .price dd {
padding: 15px;
}
#feature .price01 { display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#feature .price02 dt {
border-bottom: 1px solid #ccc;
}
#feature .price02 dd {
padding: 20px;
}
#feature .price02 dd th {
background: #eef7fb;
}
#feature .price02 dd th,
#feature .price02 dd td {
padding: 6px;
text-align: center;
line-height: 1.4;
}
@media print, screen and (min-width: 641px){ #feature .note { display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#feature .note dt {
width: 160px;
}
#feature .note dd {
width: calc(100% - 160px);
}
} #feature .voice dl:not(:last-child) {
margin-bottom: 20px;
}
#feature .voice dt {
font-weight: bold;
text-align: center;
}
#feature .voice dt img {
display: block;
margin: 0 auto 5px;
}
#feature .voice dd {
position: relative;
padding: 25px;
background: #fff;
border-radius: 30px;
box-sizing: border-box;
}
@media print, screen and (min-width: 641px){ #feature .voice dl { display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: space-between;
}
#feature .voice dt {
width: 110px;
}
#feature .voice dd {
width: calc(100% - 125px);
}
#feature .voice dd::before {
position: absolute;
content: "";
top: 30px;
left: -25px;
border: 10px solid transparent;
border-right: 15px solid #fff;
}
} #faq {
background: #F4F4F4;
}
#faq dl {
margin-bottom: 20px;
}
#faq dl dd {
padding: 10px;
}
#faq dl dt {
display: table;
font-size: 16px;
background: #FFF;
color: #096ad6;
}
#faq dl dt span.no {
display: inline-block;
margin-right: 10px;
width: 43px;
height: 43px;
line-height: 43px;
text-align: center;
color: #fff;
font-size: 21px;
background: #096ad6;
}
#faq dl dt span.txt_f {
display: table-cell;
width: 100%;
text-align: left;
}
#faq dl dd {
display: none;
position: relative;
padding-left: 40px;
}
#faq dl dd:before {
position: absolute;
top: 10px;
left: 18px;
content: "A";
color: #AAA;
} #agreement h4,
#policy h4 {
font-size: 110%;
margin-bottom: 5px;
}
#agreement ol,
#policy ol {
margin-left: 20px;
margin-bottom: 20px;
} #mailform .tbl {
margin: 20px 0;
}
#mailform .tbl th {
vertical-align: top;
}
#mailform .tbl th .need {
float: right;
padding: 1px 10px;
background: #096ad6;
border-radius: 5px;
color: #FFFFFF;
font-size: 13px;
}
#mailform .btn input {
width: 200px;
height: 50px;
background: #096ad6;
border: 1px solid #096ad6;
border-radius: 30px;
box-shadow: 0 -2px 0 rgba(0,0,0,0.2) inset;
color: #FFFFFF;
font-size: 16px;
font-family: "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
cursor: pointer;
}
#mailform .btn input+input {
background: #F4F4F4;
border-color: #DDDDDD;
color: #666666;
}
#mailform .tbl input[type="text"], #mailform .tbl textarea {
width: 100%;
box-sizing: border-box;
}
#mailform .tbl textarea {
display: block;
}
#mailform .tbl input.wno {
width: 100px;
}
 @media only screen and (max-width: 768px) {
#menu {
display: none;
}
#menuOverlay {
top: 0;
left: 0;
width: 100%;
height: 100%;
display: none;
position: fixed;
z-index: 9997; }
#switchBtnArea {
position: fixed;
top: 0;
right: 0;
width: 100%;
z-index: 99999;;
} #switchBtnArea #switchBtn {
top: 0;
right: 0;
width: 44px;
height: 50px;
display: block;
position: absolute;
z-index: 9998;
}
#switchBtnArea #switchBtn:after{
position: absolute;
content:"MENU";
top: 3px;
left: 50%;
margin-left: -1.5em;
font-size: 80%;
color: #fff;
}
#switchBtnArea #switchBtn span {
right: 20%;
width: 60%;
height: 4px;
display: block;
position: absolute;
background-color: #fff;
border-radius: 5px;
transition: all 0.2s linear;
}
#switchBtnArea #switchBtn span:nth-of-type(1) {
top: 22px;
-webkit-transform: rotate(0);
transform: rotate(0);
}
#switchBtnArea #switchBtn span:nth-of-type(2) {
top: 30px;
-webkit-transform: scale(1);
transform: scale(1);
}
#switchBtnArea #switchBtn span:nth-of-type(3) {
bottom: 8px;
-webkit-transform: rotate(0);
transform: rotate(0);
} #switchBtnArea #switchBtn.btnClose { }
#switchBtnArea #switchBtn.btnClose span:nth-of-type(1) {
top: 31px;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
#switchBtnArea #switchBtn.btnClose span:nth-of-type(2) {
-webkit-transform: scale(0);
transform: scale(0);
}
#switchBtnArea #switchBtn.btnClose span:nth-of-type(3) {
bottom: 15px;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
} #rwdMenuWrap {
top: 0;
left: -241px;
width: 241px;
height: 100%;
overflow: auto;
position: fixed;
z-index: 9999;
}
#rwdMenuWrap ul {
width: 100%;
}
#rwdMenuWrap ul li {
width: 100%;
border-bottom: #DDDDDD 1px solid;
}
#rwdMenuWrap ul li a {
position: relative;
display: block;
padding: 15px;
background: rgb(9, 106, 214, 0.7);
color: #FFF;
text-align: left;
text-decoration: none;
}
#rwdMenuWrap ul li a:after {
content: '';
margin-top: -4px;
top: 50%;
right: 15px;
width: 8px;
height: 8px;
color: #888;
font-size: 1em;
font-weight: bold;
line-height: 1.2em;
display: block;
position: absolute;
border-top: 2px solid #FFF;
border-right: 2px solid #FFF;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
}
@media only screen and (max-width: 320px){
#rwdMenuWrap {
left: -186px;
width: 186px;
}
}
 @media only screen and (max-width: 768px) and (min-width: 641px){
.dsp_smt { display: none; }
#footer .contact .txt span {
display: inline-block;
margin-left: 10px;
}
#page_title .sub {
font-size: 30px;
}
#page_title .sub span {
font-size: 20px;
}
#agreement_title_box .title_r img {
max-height: 200px;
}
} @media only screen and (max-width: 768px) {
.dsp_hp { display: none; }  #header {
display: none;
} #container h3.sub {
margin-bottom: 30px;
font-size: 20px;
}
#page_title .sub {
position: relative;
top: -70px;
margin-bottom: -70px;
}
.main {
padding-left: 15px;
padding-right: 15px;
}
#main, #navi {
clear: both;
padding-bottom: 30px;
} #agreement_title_box,
#ranking_title_box,
#feature_title_box,
#faq_title_box,
#policy_title_box,
#information_provision_box,
#information_title_box,
#news_title_box {
height: 200px;
}
#agreement_title_box img,
#ranking_title_box img,
#feature_title_box img,
#faq_title_box img,
#policy_title_box img,
#information_provision_box img,
#information_title_box img,
#news_title_box img {
height: 50px;
width: auto;
}  #footer {
padding: 20px 0 0;
}
#footer .wrap .box {
width: 100%;
}
#footer .wrap .box::after {
display: none;
}
#footer .wrap .box .photo {
width: 150px;
padding-right: 0;
}
#copyright {
height: 30px;
line-height: 30px;
}
#page_title .top img.dsp_tbs {
width: auto;
position: absolute;
left: 5px;
top: 5px;
} #page_navi {
margin-bottom: 20px;
padding-top: 15px;
font-size: 11px;
} .mb { margin-bottom: 40px; }
.pt { padding-top: 40px; }
.pb { padding-bottom: 40px; } .pad_anchor {
margin-top: -50px;
padding-top: 50px;
} #top_about {
display: block;
padding-bottom: 30px;
margin-bottom: 50px;
}
#top_about dl {
display: inline-block;
vertical-align: top;
width: 100%;
}
#top_about dl dt {
padding: 10px 0;
}
#top_about dl dd {
padding: 25px 15px 40px;
}
#top_search .bg_wide h3 {
padding: 30px 0;
}
#top_search .search_area h3 {
font-size: 18px;
} #top_search .search_area table {
border-left: none;
}
#top_link {
padding-top: 60px;
}
#top_link .wrap a {
width: 32%;
border-width: 3px;
padding: 40px 10px 10px;
}
#top_link .wrap a .box p.nm {
text-align: left;
}
#top_company_list .wrap {
display: block;
}
#top_company_list .wrap .box {
display: inline-block;
margin: 0 15px;
vertical-align: top;
}
#top_company_list .wrap .box table tr td {
white-space: normal;
}
#top_company_other_list .wrap {
margin-bottom: 50px;
padding: 15px 0;
height: 165px;
overflow-y: auto;
overflow: auto;
white-space: nowrap; }
#top_company_other_list .wrap::-webkit-scrollbar {
height: 5px;
}
#top_company_other_list .wrap::-webkit-scrollbar-track {
background: #F1F1F1;
}
#top_company_other_list .wrap::-webkit-scrollbar-thumb {
background: #BCBCBC;
}
#top_company_other_list .wrap .box {
margin: 0 15px;
white-space: normal;
}
#top_score h3 {
top: -180px;
}
#top_score {
margin-top: -50px;
padding-top: 150px;
}
#top_score .wrap dl {
width: 100%;
margin-bottom: 20px;
}
#top_score .wrap dl dt {
position: relative;
cursor: pointer;
}
#top_score .wrap dl dt:after {
content: "";
position: absolute;
top: 9px;
right: 20px;
width: 10px;
height: 10px;
border: 3px solid;
border-color:  transparent transparent #ccc #ccc;
transform: rotate(-45deg);
}
#top_score .wrap dl dd {
display: none;
}
#top_professional h3 {
padding-top: 30px;
}
#top_professional .box {
padding: 20px;
}
#top_professional .box .prof .img {
width: 25%;
}
#top_professional .box .prof table {
width: 70%;
}
#top_professional .wrap dl {
width: 49%;
padding: 0 15px;
}
#top_information .top_info {
width: 48%;
}  #ranking .box .bg_blue h3 a {
font-size: 25px;
}
#ranking .box .bg_blue .mpr {
padding: 12px 15px 0 0;
}
#ranking .box .bg_blue .mpr .top {
font-size: 30px;
}
#ranking .box .in {
padding: 15px;
display: block;
}
#ranking .box .in .lft, #ranking .box .in .rit {
width: 100%;
}
#ranking .box .in .lft .img {
text-align: center;
}
#ranking .box .in .lft .btn {
margin: 15px auto;
display: block;
width: 300px;
}
#ranking .box .in .lft .btn a {
width: 100%;
}
#ranking .under4 .txt {
padding: 20px;
} #feature .about h3 {
padding: 15px 0;
font-size: 30px;
}
#feature .about .btn {
text-align: right;
}
#feature .about .btn a {
display: inline-block;
width: 220px;
line-height: 40px;
font-size: 20px;
}
#feature .box {
padding: 30px;
} #mailform .tbl {
border-bottom: 1px solid #BBB;
}
#mailform .tbl th,
#mailform .tbl td {
display: block;
width: auto;
border-bottom: none;
}
#mailform .tbl input[type="text"],
#mailform .tbl textarea {
font-size: 120%;
}
#mailform .btn input {
width: 120px;
} }
 @media only screen and (max-width: 640px){
body { font-size: 85%; }
.dsp_hp, .dsp_hpt { display: none; } #header h1.title img {
max-height: 7vw;
} #wrap, #footer {
min-width: 320px;
}
#container h3.sub {
margin-bottom: 20px;
font-size: 18px;
} #agreement_title_box,
#ranking_title_box,
#feature_title_box,
#faq_title_box,
#policy_title_box,
#information_provision_box,
#information_title_box,
#news_title_box {
height: 150px;
}
#agreement_title_box #agreement_title,
#ranking_title_box #ranking_title,
#feature_title_box #feature_title,
#news_title_box #news_title,
#faq_title_box #faq_title,
#policy_title_box #policy_title,
#information_provision_box #information_provision_title,
#information_title_box #information_title,
#news_title_box #news_title {
top: calc( 50% + 10px );
left: 5px;
}
#agreement_title_box #agreement_title img,
#ranking_title_box #ranking_title img,
#feature_title_box #feature_title img,
#news_title_box #news_title img,
#faq_title_box #faq_title img,
#information_provision_box #information_provision_title img,
#information_title_box #information_title img,
#news_title_box #news_title img {
height: 40px;
width: auto;
}
#policy_title_box #policy_title img {
height: 40px;
width: auto;
} #footer {
padding: 20px 0 0;
}
#footer .wrap .box {
width: 100%;
}
#footer .wrap .box .photo {
width: calc(100% - 260px);
}
#footer .wrap .box dl {
width: 240px;
}
#footer .wrap .box dl dt {
font-size: 18px;
}
@media only screen and (max-width: 320px){
#footer .wrap .box .photo {
width: calc(100% - 220px);
}
#footer .wrap .box dl {
width: 210px;
font-size: 90%;
}
#footer .wrap .box dl dt {
font-size: 16px;
}
} #copyright {
height: auto;
line-height: 1.6;
padding: 5px 0;
}
#page_title .top img.dsp_tbs {
width: 180px;
}
#page_title .sub {
padding: 130px 0 30px;
font-size: 20px;
line-height: 1.2em;
}
#page_title .sub span {
font-size: 15px;
} .mb { margin-bottom: 30px; }
.pt { padding-top: 30px; }
.pb { padding-bottom: 30px; } #top_about dl dt {
padding: 8px 0 5px;
font-size: 18px;
}
#top_search .bg_wide h3 {
font-size: 18px;
}
#top_search .search_area table {
width: auto;
}
#top_search .search_area table tr th, #top_search .search_area table tr td {
display: block;
padding: 5px;
margin-bottom: -1px;
}
#top_search .search_area table tr th {
width: 100%;
}
#top_search .search_area input[type="submit"] {
width: 280px;
box-sizing: border-box;
font-size: 18px;
} #top_search .comingsoon .txt {
font-size: 16px;
}
#top_search .comingsoon .txt::after {
position: absolute;
top: -16px;
left: calc(50% - 20px);
content: "";
height: 0;
border-style: solid;
border-width:  0 16px 20px 16px;
border-color: transparent transparent #096ad6 transparent;
}
#top_search .search_area table {
margin: 0 auto 50px;
}
#top_link .wrap {
display: block;
}
#top_link .wrap a {
width: 100%;
border-radius: 10px;
margin-bottom: 35px;
}
#top_link .wrap a:last-of-type {
margin-bottom: 0;
}
#top_link .wrap a .box .ico {
top: -67px;
left: calc(50% - 30px);
}
#top_link .wrap a .box .ico img {
width: 60px;
}
#top_link .wrap a .box h3 {
font-size: 18px;
}
#top_company_list h3 {
font-size: 18px;
}
#top_company_list h4 {
margin-bottom: 20px;
}
#top_company_other_list .wrap {
height: 190px;
}
#top_company_list .wrap .box {
padding-bottom: 5px;
}
#top_company_list .wrap .box table tr th, #top_company_list .wrap .box table tr td {
padding: 5px;
}
#top_company_list .wrap .box table tr th {
width: 80px;
}
#top_company_other_list h3 {
font-size: 18px;
}
#top_company_other_list .wrap .box {
margin: 0 15px 15px;
}
#top_company_other_list .wrap .box dl {
width: 115px;
}
#top_company_other_list .wrap .box dd {
left: 5px;
}
#top_company_other_list .wrap .box dd .fs {
display: block;
font-size: 11px;
}
#top_company_other_list .wrap .box table {
width: 100%;
}
#top_company_other_list .wrap .box table tr th,
#top_company_other_list .wrap .box table tr td {
padding: 5px;
font-size: 12px;
}
#top_professional h3 {
font-size: 18px;;
}
#top_professional .box {
padding: 10px;
}
#top_professional .box .prof {
display: block;
}
#top_professional .box .prof .img, #top_professional .box .prof table {
width: 100%;
}
#top_professional .box .prof .img {
text-align: center;
margin-bottom: 20px;
}
#top_professional .box .prof table th, #top_professional .box .prof table td {
display: block;
}
#top_professional .wrap {
display: block;
}
#top_professional .wrap::-webkit-scrollbar {
height: 5px;
}
#top_professional .wrap::-webkit-scrollbar-track {
background: #F1F1F1;
}
#top_professional .wrap::-webkit-scrollbar-thumb {
background: #BCBCBC;
}
#top_professional .wrap dl {
width: 300px;
display: inline-block;
vertical-align: top;
}
#top_professional .wrap dl dt {
margin-bottom: 15px;
}
#top_professional .wrap dl dd {
white-space: normal;
}
#top_information {
display: block;
}
#top_information .box .in {
height: 500px;
overflow-x: auto;
}
#top_information .top_info {
width: 100%;
margin-bottom: 30px;
}
#top_information .top_info:last-of-type {
margin-bottom: 0;
}
#top_information h3 {
font-size: 20px;
line-height: 50px;
}
#top_information h3 span:before, #top_information h3 span:after {
height: 22px;
width: 10px;
background-size: 100% auto;
} #top_info dt {
float: none;
width: auto;
}
#top_info dd {
margin-left: 0;
}  #ranking .box {
margin-bottom: 30px;
}
#ranking .box .bg_blue {
display: block;
}
#ranking .box .bg_blue:before {
width: 40px;
background-size: 100% auto;
left: 5px;
top: 0;
}
#ranking .box .bg_blue h3 a {
font-size: 23px;
padding-left: 50px;
padding-bottom: 5px;
line-height: 50px;
display: inline-block;
}
#ranking .box .bg_blue .mpr {
text-align: right;
color: #FFF;
padding: 0 5px 5px;
margin-bottom: 0;
}
#ranking .box .bg_blue .mpr .top {
font-size: 35px;
}
#ranking .box .bg_blue .mpr .bottom {
font-size: 20px;
}
#ranking .box .in {
padding: 10px;
}
#ranking .box .in .lft .btn {
width: 250px
}
#ranking .box .in .lft .btn a {
font-size: 20px;
padding-top: 5px;
}
#ranking .box .in .lft .btn a:after  {
top: 5px;
}
#ranking .box .in .rit .point .waku {
padding: 10px;
}
#ranking .box .in .rit table tr th {
white-space: nowrap;
}
#ranking .box .in .rit table tr th, #ranking .box .in .rit table tr td {
padding: 5px;
font-size: 12px;
}
#ranking .under4 .box {
padding: 5px;
height: 155px;
}
#ranking .under4 table tr td {
padding: 3px;
}
#ranking .under4 table tr td.sans .rank {
width: 25px;
background-size: 100% auto;
font-size: 10px;
margin-right: 3px;
display: block;
}
#ranking .under4 table tr td a {
font-size: 12px;
overflow-wrap: anywhere;
}
#ranking .under4 table tr td.mpr {
font-size: 10px;
}
#ranking .under4 table tr td.mpr .top {
font-size: 20px;
}
#ranking .under4 table tr td.mpr .bottom {
font-size: 14px;
} #faq dl dt {
padding-bottom: 5px;
} #feature .about h3 {
padding: 10px 0;
font-size: 21px;
}
#feature .about h4 {
font-size: 18px;
}
#feature .about .photo {
overflow: hidden;
height: 230px;
text-align: center;
}
#feature .about .btn {
margin: 20px 0;
text-align: center;
}
#feature .about .btn a {
width: 250px;
}
#feature .about .list li {
margin-right: 5px;
padding: 5px 10px 3px;
} #feature .box {
padding: 15px;
}
#feature .box h4 {
margin-bottom: 20px;
font-size: 21px;
} #feature .note,
#feature .price {
margin-bottom: 20px;
font-size: 100%;
}
#feature .note dt,
#feature .note dd,
#feature .price dt,
#feature .price dd,
#feature .price02 dd {
padding: 10px;
} #feature .voice dl:not(:last-child) {
margin-bottom: 20px;
}
#feature .voice dt {
padding-left: 5px;
margin-bottom: 20px;
text-align: left; display: flex;
align-items: center;
}
#feature .voice dt img {
width: 50px;
margin: 0 15px 0 0;
}
#feature .voice dd {
padding: 15px;
border-radius: 15px;
}
#feature .voice dd::before {
position: absolute;
content: "";
top: -25px;
left: 20px;
border: 10px solid transparent;
border-bottom: 15px solid #fff;
} }
 @media only screen and (max-width: 1230px) {
#menu li { width: 130px }
}
@media print, screen and (min-width:769px){
.dsp_tbs, .dsp_smt { display: none; }
.cen_pc { text-align: center; }
.fl { float: left; } .fr { float: right; }  #header {
position: absolute;
top: 0;
left: 0;
width: calc(100% - 30px);
z-index: 99;
} #wrap, #footer {
min-width: 1150px;
}
#header {
width: 100%;
min-width: 1150px;
box-sizing: border-box;
z-index: 9999;
}
#container {
padding-bottom: 200px;
}
.main {
width: 1100px;
margin: auto;
}
#main {
float: left;
width: 840px;
}
#navi {
float: right;
width: 220px;
} #footer {
box-sizing: border-box;
position: relative;
min-height: 200px;
margin-top: -200px;
} #top_company_other_list .wrap .box {
width: 525px;
}
#top_company_other_list .wrap {
padding: 10px 10px 0;
height: 420px;
}
#top_company_other_list .wrap .box {
margin-bottom: 15px;
}
#top_company_list .wrap .box:nth-last-of-type(-n+2),
#top_score .wrap dl:nth-last-of-type(-n+3){
margin-bottom: 0;
}  #top_search .comingsoon .txt {
margin-left: 30px;
}
#top_search .search_tbl {
position: relative;
padding-left: 111px;
}
#top_search .search_area table {
margin-bottom: 30px;
}
#top_search .search_area table:before {
content: "";
position: absolute;
left: -111px;
bottom: 0;
background: url(//www.hikaku-navi.bz/img/top/robot.png);
width: 122px;
height: 206px;
} #feature .about .btn {
position: absolute;
top: 20px;
right: 0;
}  html, body, #wrap {
height: 100%;
}
body > #wrap {
height: auto;
min-height: 100%;
}/*\*/* html .cf {
height: 1%;
}
.cf {
display: block;
}/**/ }