@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap");
/*==================================
reset
==================================*/
html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  font-weight: normal; }

body {
  line-height: 1; }

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block; }

nav ul {
  list-style: none; }

blockquote,
q {
  quotes: none; }

blockquote:before, blockquote:after {
  content: none; }

q:before, q:after {
  content: none; }

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none; }

mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold; }

del {
  text-decoration: line-through; }

abbr[title],
dfn[title] {
  border-bottom: 1px dotted;
  cursor: help; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0; }

input,
select {
  vertical-align: middle; }

ol,
ul {
  list-style: none; }

/* テキスト装飾 */
.fz-ss {
  font-size: 75% !important;
  font-weight: normal; }

.fz-s {
  font-size: 87.5% !important;
  font-weight: bold; }

.fz-sl {
  font-size: 106% !important;
  font-weight: bold; }

.fz-l {
  font-size: 125% !important;
  font-weight: bold; }

.fz-m {
  font-size: 150% !important;
  font-weight: bold; }

.fz-lm {
  font-size: 162.5% !important;
  font-weight: bold; }

.fz-ll {
  font-size: 187.5% !important;
  font-weight: bold; }

.fz-xl {
  font-size: 225% !important;
  font-weight: bold; }

.ac1-color {
  color: #ff666f; }

.ac2-color {
  color: #ff9000; }

.ac3-color {
  color: #068ba3; }

body {
  font-size: 16px;
  font-weight: 400;
  width: 100%;
  font-family: 'Noto Sans JP', sans-serif; }
  @media screen and (max-width: 750px) {
    body {
      font-size: 3vw;
      -webkit-text-size-adjust: 100%; }
      body .pc {
        display: none !important; } }
  @media screen and (min-width: 751px) {
    body a {
      transition: 0.3s; }
      body a:hover {
        opacity: 0.8; }
    body a[href*="tel:"] {
      text-decoration: none;
      pointer-events: none; }
    body .sp {
      display: none !important; } }
  body * {
    box-sizing: border-box;
    outline: none; }
  body img {
    width: 100%;
    max-width: auto; }

/*==================================
main
==================================*/
main#lpTop {
  width: 100%;
  max-width: 750px;
  margin: 0 auto; }

/* lpTopFv */
#lpTopFv {
  position: relative; }
  #lpTopFv h1 {
    font-size: 0; }
  #lpTopFv .lpTopFvRankingBtn {
    position: absolute;
    width: 59%;
    top: 51%;
    left: 19.5%; }
  #lpTopFv .lpTopFvBox {
    position: absolute;
    width: 84%;
    bottom: 5%;
    left: 8%;
    margin: 0 auto;
    padding: 2.5em 2em 2em 2em;
    background: rgba(255, 255, 255, 0.9);
    border-radius: 1em; }
    @media screen and (max-width: 750px) {
      #lpTopFv .lpTopFvBox {
        width: 100%;
        left: 0;
        bottom: 3%;
        padding: 1.5em 1.2em 1em 1.2em; } }
  #lpTopFv table.lpTopFvTable {
    width: 100%;
    border-top: 2px solid #009bdc;
    font-size: 105%; }
    @media screen and (max-width: 750px) {
      #lpTopFv table.lpTopFvTable {
        font-size: 100%; } }
    #lpTopFv table.lpTopFvTable th {
      padding: 1.4em 1em;
      background: #c1e2f3;
      border-bottom: 2px solid #009bdc;
      line-height: 1.4;
      text-align: center;
      vertical-align: middle; }
      @media screen and (max-width: 750px) {
        #lpTopFv table.lpTopFvTable th {
          padding: 1em 0.5em; } }
    #lpTopFv table.lpTopFvTable td {
      padding: 1.4em 0 1.4em 1.5em;
      border-bottom: 2px solid #009bdc;
      line-height: 1.4;
      vertical-align: middle; }
      @media screen and (max-width: 750px) {
        #lpTopFv table.lpTopFvTable td {
          padding: 1em 0 1em 1em; } }
      #lpTopFv table.lpTopFvTable td label {
        margin: 0 1.3em 0 0; }
        @media screen and (max-width: 750px) {
          #lpTopFv table.lpTopFvTable td label {
            margin: 0 1em 0 0; } }
        #lpTopFv table.lpTopFvTable td label:last-child {
          padding-right: 0; }
      #lpTopFv table.lpTopFvTable td input {
        margin: 0 0.8em 0 0;
        padding: 0;
        transform: scale(1.9); }
        @media screen and (max-width: 750px) {
          #lpTopFv table.lpTopFvTable td input {
            margin: 0 0.4em 0 0;
            transform: scale(1.2); } }
  #lpTopFv .lpTopFvSearchBtn {
    width: 62%;
    max-width: 323px;
    margin: 2em auto 0 auto; }
    @media screen and (max-width: 750px) {
      #lpTopFv .lpTopFvSearchBtn {
        width: 50%;
        margin-top: 1em; } }
    #lpTopFv .lpTopFvSearchBtn input {
      width: 100%; }

.lpTopBg {
  background: url("../images/index_bg.jpg") left top repeat-y;
  background-size: 100% auto; }

/* lpTopRanking */
#lpTopRanking h2 {
  position: relative;
  z-index: +1; }
#lpTopRanking .lpTopRankingBox {
  width: 93.9%;
  margin: -6em 0 0 2.9%;
  padding: 7em 1em 3.5em 1em;
  background: #fff;
  border-radius: 0 0 1em 1em; }
  @media screen and (max-width: 750px) {
    #lpTopRanking .lpTopRankingBox {
      overflow-x: scroll; } }
#lpTopRanking table.lpTopRankingTable {
  width: 100%;
  font-weight: bold;
  line-height: 1.4; }
  @media screen and (max-width: 750px) {
    #lpTopRanking table.lpTopRankingTable {
      width: 700px; } }
  #lpTopRanking table.lpTopRankingTable th {
    width: calc((100% - 14px) / 5);
    padding: 0.8em 0.5em;
    border: 1px solid #009bdc;
    text-align: center; }
  #lpTopRanking table.lpTopRankingTable td {
    width: calc((100% - 14px) / 5);
    padding: 0.8em 0.5em;
    border: 1px solid #009bdc;
    text-align: center; }
    #lpTopRanking table.lpTopRankingTable td > p:first-child {
      font-size: 110%;
      font-weight: bold; }
    #lpTopRanking table.lpTopRankingTable td.rank1 {
      background: #fffcaf;
      border-right: 5px solid #009bdc;
      border-left: 5px solid #009bdc; }
  #lpTopRanking table.lpTopRankingTable tr.name .rank1 {
    border-top: 5px solid #009bdc; }
  #lpTopRanking table.lpTopRankingTable tr.link .rank1 {
    border-bottom: 5px solid #009bdc; }
  #lpTopRanking table.lpTopRankingTable tr.link td {
    padding: 1.5em 0.5em;
    line-height: 1; }
  #lpTopRanking table.lpTopRankingTable p.ac1-color,
  #lpTopRanking table.lpTopRankingTable p.ac2-color,
  #lpTopRanking table.lpTopRankingTable p.ac3-color {
    line-height: 1; }
    #lpTopRanking table.lpTopRankingTable p.ac1-color.lh,
    #lpTopRanking table.lpTopRankingTable p.ac2-color.lh,
    #lpTopRanking table.lpTopRankingTable p.ac3-color.lh {
      font-weight: bold;
      line-height: 1.4; }
  #lpTopRanking table.lpTopRankingTable p.size1 {
    font-size: 350%;
    line-height: 1.4; }
  #lpTopRanking table.lpTopRankingTable p.size2 {
    padding: 0.2em 0;
    font-size: 350%;
    font-weight: bold; }
  #lpTopRanking table.lpTopRankingTable .hyoka {
    margin-top: 0.5em;
    font-size: 105%; }
  #lpTopRanking table.lpTopRankingTable .hyoka + img + img {
    margin-top: 0.5em; }
  #lpTopRanking table.lpTopRankingTable .brand {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.5em;
    height: 4em; }
  #lpTopRanking table.lpTopRankingTable .officialsiteBtn {
    margin-top: 0.5em; }

/* lpTopReason */
#lpTopReason {
  width: 94%;
  margin: 4em auto 0 auto; }
  #lpTopReason h2 {
    font-size: 0; }
  #lpTopReason .lpTopReasonBg {
    padding: 2em 0 4em 0;
    background: #fff;
    border-radius: 0 0 1em 1em; }
  #lpTopReason h3.acTitle {
    margin-top: 2em;
    cursor: pointer; }
    #lpTopReason h3.acTitle.reason1 {
      margin-top: 0;
      background: url("../images/ti_topreason02_off.png") no-repeat;
      background-size: cover; }
      #lpTopReason h3.acTitle.reason1.open {
        background: url("../images/ti_topreason02_on.png") no-repeat;
        background-size: cover; }
    #lpTopReason h3.acTitle.reason2 {
      background: url("../images/ti_topreason03_off.png") no-repeat;
      background-size: cover; }
      #lpTopReason h3.acTitle.reason2.open {
        background: url("../images/ti_topreason03_on.png") no-repeat;
        background-size: cover; }
    #lpTopReason h3.acTitle.reason3 {
      background: url("../images/ti_topreason04_off.png") no-repeat;
      background-size: cover; }
      #lpTopReason h3.acTitle.reason3.open {
        background: url("../images/ti_topreason04_on.png") no-repeat;
        background-size: cover; }
  #lpTopReason .lpTopReasonBox {
    padding: 1em 8% 4em 8%;
    background: #fff url("../images/line_topreason.png") center bottom no-repeat;
    background-size: 84% auto;
    border-radius: 0 0 1em 1em; }
    #lpTopReason .lpTopReasonBox:last-child {
      background-image: none; }
    #lpTopReason .lpTopReasonBox p {
      margin-top: 1.2em;
      font-size: 110%;
      line-height: 2; }
    #lpTopReason .lpTopReasonBox .fz-s {
      font-weight: normal; }

/* topRankingResult */
#topRankingResult {
  margin-top: 4em; }
  #topRankingResult ul.lpTopRankingTab {
    display: flex;
    justify-content: space-between;
    width: 97.4%;
    margin: 0 auto; }
    #topRankingResult ul.lpTopRankingTab li {
      width: 48.7%;
      border-bottom: 1rem solid #bfecff;
      font-size: 0;
      cursor: pointer; }
      #topRankingResult ul.lpTopRankingTab li.tab1 {
        background: url("../images/btn_rankingtab01_off.png") no-repeat;
        background-size: 100% auto; }
        #topRankingResult ul.lpTopRankingTab li.tab1.active {
          background: url("../images/btn_rankingtab01_on.png") no-repeat;
          background-size: 100% auto;
          border-bottom: 1rem solid #009bdc; }
      #topRankingResult ul.lpTopRankingTab li.tab2 {
        background: url("../images/btn_rankingtab02_off.png") no-repeat;
        background-size: 100% auto; }
        #topRankingResult ul.lpTopRankingTab li.tab2.active {
          background: url("../images/btn_rankingtab02_on.png") no-repeat;
          background-size: 100% auto;
          border-bottom: 1rem solid #009bdc; }
  #topRankingResult .lpTopRankingDetailBox {
    display: none;
    position: relative;
    margin-top: -1em;
    padding: 1.2em 0 4em 0;
    background: #009bdc;
    border-radius: 1.5em 1.5em 0 0;
    z-index: +1; }
    #topRankingResult .lpTopRankingDetailBox.active {
      display: block; }
  #topRankingResult .lpTopRankingDetailBrand {
    width: 94.4%;
    margin: 2em auto 0 auto;
    padding-bottom: 3em;
    background: #fff url("../images/bg_rankingdetail.png") left bottom no-repeat;
    background-size: 100% auto; }
  #topRankingResult .lpTopRankingDetaiChecBtn {
    width: 76.3%;
    max-width: 537px;
    margin: 2em auto 0 auto; }
  #topRankingResult table.lpTopRankingDetaiCol3 {
    width: 96%;
    margin: 0 auto;
    border-left: 1px solid #009bdc;
    border-right: 1px solid #009bdc;
    border-bottom: 1px solid #009bdc; }
    #topRankingResult table.lpTopRankingDetaiCol3 th {
      width: calc(100% / 3);
      padding: 0.8em 0.5em;
      background: #009bdc;
      color: #fff;
      font-size: 110%;
      font-weight: 700;
      text-align: center;
      vertical-align: middle; }
      #topRankingResult table.lpTopRankingDetaiCol3 th:nth-child(2) {
        border-left: 1px solid #fff;
        border-right: 1px solid #fff; }
    #topRankingResult table.lpTopRankingDetaiCol3 td {
      padding: 0.8em 0.5em;
      font-size: 110%;
      font-weight: 700;
      text-align: center;
      vertical-align: middle;
      line-height: 1.4; }
      #topRankingResult table.lpTopRankingDetaiCol3 td:nth-child(2) {
        border-left: 1px solid #009bdc;
        border-right: 1px solid #009bdc; }
  #topRankingResult table.lpTopRankingDetaiCol2 {
    width: 96%;
    margin: 0 auto;
    border-left: 1px solid #009bdc;
    border-right: 1px solid #009bdc;
    border-bottom: 1px solid #009bdc; }
    #topRankingResult table.lpTopRankingDetaiCol2 th {
      width: calc(100% / 2);
      padding: 0.8em 0.5em;
      background: #009bdc;
      color: #fff;
      font-size: 110%;
      font-weight: 700;
      text-align: center;
      vertical-align: middle; }
      #topRankingResult table.lpTopRankingDetaiCol2 th:nth-child(2) {
        border-left: 1px solid #fff; }
    #topRankingResult table.lpTopRankingDetaiCol2 td {
      padding: 0.8em 0.5em;
      font-size: 110%;
      font-weight: 700;
      text-align: center;
      vertical-align: middle;
      line-height: 1.4; }
      #topRankingResult table.lpTopRankingDetaiCol2 td:nth-child(2) {
        border-left: 1px solid #009bdc; }
  #topRankingResult .size1 {
    font-size: 240%;
    font-weight: 700;
    line-height: 1; }
  #topRankingResult .size2 {
    display: inline-block;
    font-size: 180%;
    font-weight: 700;
    line-height: 1; }
  #topRankingResult .lpTopRankingDetailPoint {
    margin-top: 2em; }
    #topRankingResult .lpTopRankingDetailPoint h3 {
      font-size: 0; }
    #topRankingResult .lpTopRankingDetailPoint .lpTopRankingDetailPointBox {
      padding-bottom: 6em;
      position: relative;
      background: url("../images/bg_rankingpoint01.png") left top repeat-y;
      background-size: 100% auto; }
      #topRankingResult .lpTopRankingDetailPoint .lpTopRankingDetailPointBox::after {
        position: absolute;
        display: block;
        content: "";
        width: 100%;
        height: 5em;
        bottom: 0;
        left: 0;
        background: url("../images/bg_rankingpoint02.png") left bottom no-repeat;
        background-size: 100% auto; }
      #topRankingResult .lpTopRankingDetailPoint .lpTopRankingDetailPointBox ul {
        width: 82%;
        margin: 0 auto;
        font-size: 130%; }
        @media screen and (max-width: 750px) {
          #topRankingResult .lpTopRankingDetailPoint .lpTopRankingDetailPointBox ul {
            width: 90%;
            font-size: 110%; } }
        #topRankingResult .lpTopRankingDetailPoint .lpTopRankingDetailPointBox ul li {
          padding: 1.2em 0 1.2em 4.2em;
          background: url("../images/icon_check.png") 1em center no-repeat;
          background-size: 2.2em auto;
          line-height: 1.6;
          border-bottom: 3px dashed #d7d152; }
          @media screen and (max-width: 750px) {
            #topRankingResult .lpTopRankingDetailPoint .lpTopRankingDetailPointBox ul li {
              padding: 1em 0 1em 3em;
              background: url("../images/icon_check.png") 0.4em center no-repeat;
              background-size: 2.2em auto; } }
      #topRankingResult .lpTopRankingDetailPoint .lpTopRankingDetailPointBox sup {
        font-size: 60%;
        font-weight: 700;
        vertical-align: text-top; }
  #topRankingResult ul.lpTopRankingDetailNotice {
    width: 96%;
    margin: 1em auto 0 auto;
    font-size: 80%; }
    #topRankingResult ul.lpTopRankingDetailNotice li {
      padding: 0 0 0 1em;
      text-indent: -1em;
      line-height: 1.8; }

/* lpTopRankingDetailVoice */
.lpTopRankingDetailVoice {
  margin-top: 3em;
  font-size: 105%; }
  .lpTopRankingDetailVoice .voiceLeftImg {
    display: flex;
    width: 100%;
    margin-top: 1.5em; }
    .lpTopRankingDetailVoice .voiceLeftImg .voiceImg {
      width: 19.4%; }
    .lpTopRankingDetailVoice .voiceLeftImg .voiceNote {
      width: 76.6%;
      padding: 2em;
      background: #bfecff;
      border-radius: 1em;
      line-height: 1.8; }
  .lpTopRankingDetailVoice .voiceRightImg {
    display: flex;
    flex-direction: row-reverse;
    width: 100%;
    margin-top: 1.5em; }
    .lpTopRankingDetailVoice .voiceRightImg .voiceImg {
      width: 20%; }
    .lpTopRankingDetailVoice .voiceRightImg .voiceNote {
      width: 76%;
      padding: 2em;
      background: #bfecff;
      border-radius: 1em;
      line-height: 2; }

/*----------------------------------------------------------------------------------------
	content
---------------------------------------------------------------------------------------- */
#content {
  width: 100%;
  max-width: 750px;
  margin: 0 auto; }

/*----------------------------------------------------------------------------------------
	searchSort
---------------------------------------------------------------------------------------- */
.searchSort {
  margin: 2em 0 0 0; }
  .searchSort .searchSortInner {
    display: flex;
    justify-content: space-between;
    width: 96%;
    margin: 0 auto; }
    .searchSort .searchSortInner div {
      width: 32%;
      cursor: pointer; }
  .searchSort .searchSortPrice {
    background: url(../images/btn_search01_off.png) center center no-repeat;
    background-size: contain; }
    .searchSort .searchSortPrice.current {
      background: url(../images/btn_search01_on.png) center center no-repeat;
      background-size: contain; }
  .searchSort .searchSortSterilization {
    background: url(../images/btn_search02_off.png) center center no-repeat;
    background-size: contain; }
    .searchSort .searchSortSterilization.current {
      background: url(../images/btn_search02_on.png) center center no-repeat;
      background-size: contain; }
  .searchSort .searchSortEcomode {
    background: url(../images/btn_search03_off.png) center center no-repeat;
    background-size: contain; }
    .searchSort .searchSortEcomode.current {
      background: url(../images/btn_search03_on.png) center center no-repeat;
      background-size: contain; }

/*----------------------------------------------------------------------------------------
searchResult
---------------------------------------------------------------------------------------- */
.searchResult {
  margin-top: 1.5em;
  padding: 1.5em 0 4em 0;
  background: #009bdc;
  border-radius: 1.5em 1.5em 0 0; }

/*----------------------------------------------------------------------------------------
	searchResultItem
---------------------------------------------------------------------------------------- */
.searchResultItem {
  width: 94.4%;
  margin: 0 auto 2em auto;
  padding-bottom: 3em;
  background: #fff url("../images/bg_rankingdetail.png") left bottom no-repeat;
  background-size: 100% auto; }
  .searchResultItem:last-child {
    margin-bottom: 0; }
  .searchResultItem .searchResultItemBtn {
    width: 75.9%;
    max-width: 537px;
    margin: 2em auto 0 auto; }

.searchResultNone {
  width: 94.4%;
  margin: 0 auto 2em auto;
  padding: 3em 0;
  background: #fff;
  border-radius: 1.2em;
  text-align: center; }

.searchResultTopLink {
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
  padding: 0 0 3em 0;
  background: #009bdc;
  font-size: 120%;
  text-align: center; }
  .searchResultTopLink a {
    color: #fff;
    text-decoration: none; }

/*==================================
outlone
==================================*/
.lead {
  width: 90%;
  margin: 0 auto;
  padding: 2em 0 0 0;
  font-size: 110%;
  line-height: 1.8; }

.outlineHead {
  width: 90%;
  margin: 2em auto 0 auto;
  background-color: #bfecff;
  border-radius: 3em;
  font-size: 180%;
  padding: 0.5em 1em;
  font-family: "fot-tsukubrdgothic-std", sans-serif;
  font-weight: 700;
  font-style: normal; }

.outlineBody {
  width: 82%;
  margin: 2em auto 0 auto;
  line-height: 1.8; }
  .outlineBody dt {
    font-weight: bold;
    color: #009bdc;
    font-size: 130%; }
  .outlineBody dd {
    padding: 1em 0 3em 0;
    font-size: 110%; }

.TopLink {
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
  padding: 2em 0;
  font-size: 120%;
  text-align: center; }
  .TopLink a {
    border-bottom: 1px solid #252525;
    color: #252525;
    text-decoration: none; }

/*==================================
company
==================================*/
#company {
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
  padding-bottom: 2em; }
  #company .company > div {
    display: table;
    width: 90%;
    margin: 2em auto 0 auto; }
    #company .company > div > div {
      display: table-cell;
      vertical-align: top;
      padding: 0.5em 0;
      font-size: 120%;
      line-height: 1.8; }
      #company .company > div > div:first-child {
        width: 30%; }

.notice {
  width: 90%;
  margin: 3em auto 0 auto;
  font-size: 80%;
  line-height: 1.8; }

/*==================================
footer
==================================*/
footer#lpTopFooter {
  padding: 2em 0 1.5em 0;
  background: #252525;
  color: #fff;
  font-size: 120%; }
  footer#lpTopFooter ul.lpTopFooterNav {
    display: flex;
    justify-content: center; }
    footer#lpTopFooter ul.lpTopFooterNav li {
      padding: 0 1em; }
    footer#lpTopFooter ul.lpTopFooterNav a {
      border-bottom: 1px solid #fff;
      color: #fff;
      text-decoration: none; }
  footer#lpTopFooter .copyright {
    margin-top: 1.5em;
    font-weight: 400;
    text-align: center; }