@charset "utf-8";

:root {
  --color-gray:#999;
  --color-nvidia: #76b900;
}

.spec-wrapper{
  width:100%;
}

.spec-wrapper #specsheet-rtx50xx .u-pc-width{
  padding:0;
  width:100%;
}

#specsheet-rtx50xx table {
  width:100%;
  table-layout: fixed;
  font-size:clamp(14px, 0.818rem + 0.24vw, 16px);
  line-height:1.2;
}

#specsheet-rtx50xx th,
#specsheet-rtx50xx td{
  position:relative;
  padding:1em;
  border-top:1px solid var(--color-gray);
  border-bottom:1px solid var(--color-gray);
  border-left:none;
  border-right:none;
  vertical-align:middle;
  text-align:left;
}

#specsheet-rtx50xx thead th,
#specsheet-rtx50xx thead td{
  background:var(--color-nvidia);
  color:#fff;
  font-weight:700;
}

#specsheet-rtx50xx tbody th{
  background:#ccc;
  font-weight:700;
  width:160px;
}

#specsheet-rtx50xx tbody td{
  background:#fff;
}

#specsheet-rtx50xx th::before,
#specsheet-rtx50xx td::before{
  position:absolute;
  content:'';
  width:1px;
  height:100%;
  top:0;
  left:0;
  background:var(--color-gray);
}
#specsheet-rtx50xx th::after,
#specsheet-rtx50xx td::after{
  position:absolute;
  content:'';
  width:1px;
  height:100%;
  top:0;
  left:100%;
  background:var(--color-gray);
}

@media screen and (max-width: 767px) {
  #specsheet-rtx50xx .u-pc-width {
    width: 92vw;
    margin: 0 auto;
  }
  #specsheet-rtx50xx .scroll-table {
    width: 100%;
    overflow-x: auto;
  }

  #specsheet-rtx50xx table{
    width:fit-content;
    table-layout: auto;
  }
  #specsheet-rtx50xx thead th:first-child,
  #specsheet-rtx50xx tbody th{
    position:sticky;
    z-index:+2;
    width:100px;
    top:0;
    left:0;
  }
  .spec-wrapper #specsheet-rtx50xx .u-pc-width{
    width:100%;
  }
}