@charset "UTF-8";
/* リセットCSS
----------------------------------------*/
h1, h2, h4, h4, h5, h6, div, p, ul, li, dl, dt, dd, table, tr, td, img {
  margin: 0;
  border: 0;
  padding: 0;
}

.clfx::after {
  content: "";
  display: block;
  clear: both;
}

/* コンテナ
----------------------------------------*/
div#wrap-container {
  padding: 0;
  width: 100%;
}

div#container {
  width: 100%;
  height: 100%;
  position: relative;
  font-family: 'Roboto', 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-feature-settings: "palt";
  margin: 0 0 80px;
}

/* SP非表示
----------------------------------------*/
.sp {
  display: none;
}

/* ボックスの外枠
----------------------------------------*/
div.outer-box {
  width: 980px;
  margin: 0 auto;
}

/* タイトル
----------------------------------------*/
#container h1 {
  border-bottom: 1px solid #cccccc;
  font-size: 1.9em;
  line-height: 1.2;
  margin: 0 auto 15px;
  padding-bottom: 0;
  width: 980px;
  letter-spacing: 1.5px;
}

#container h1.driver {
  margin: 0 auto 35px;
}

/* リード文 */
div#read {
  font-size: 1.05em;
  margin: 3.2% auto 3.8%;
  padding: 0 1.5%;
  line-height: 1.55;
  letter-spacing: 0.6px;
}

/* ダウンロードリンク */
div.download-link {
  text-align: center;
  margin: 0 auto 2%;
  width: 87.6%;
}

div.download-link ul {
  display: flex;
  justify-content: space-between;
}

/* ソフトウェア画面 */
div.use-image {
  background-color: #EEEEEE;
  padding: 0 0 1.5%;
  margin: 12.6% 0 0;
}

div.use-image h2 {
  background-color: #3AA7EA;
  font-size: 2.8em;
  text-align: center;
  color: #FFFFFF;
  padding: 2.2% 0 1.8%;
  letter-spacing: 2px;
}

img.soft-disp {
  display: block;
  margin: 2% auto 8.3%;
}

#mac img.soft-disp {
  display: block;
  margin: 2% auto 1.1%;
}

div.outer-box h3 {
  text-align: center;
  font-size: 1.5em;
  margin: 5.4% auto 0;
  padding: 0 0 .8%;
  color: #4F86BE;
  border-bottom: 2px solid #4F86BE;
  width: 92%;
  letter-spacing: -1px;
}

div.mac-os h3 {
  text-align: center;
  font-size: 1.5em;
  margin: 10.5% auto 0;
  width: 100%;
  letter-spacing: 1px;
}

div.use-cont ul {
  width: 66%;
  margin: 2% auto 0;
  display: flex;
  justify-content: space-between;
}

div.use-cont ul li span {
  display: block;
  text-align: center;
  margin: 3% 0 0;
  line-height: 1.5;
}

p.wariate-att {
  font-size: 0.9em;
  line-height: 1.4;
  text-indent: -1em;
  margin: 2.2% 0 0 .5%;
  padding: 0 0 0 3.5%;
  letter-spacing: -.3px;
}

div#mac p.wariate-att {
  font-size: 0.9em;
  line-height: 1.4;
  text-indent: -1em;
  margin: 3% 0 0 .5%;
  padding: 0 0 .5% 3.5%;
  letter-spacing: -.3px;
}

div.use-cont p.note {
  color: #3AA7EA;
  font-size: 0.9em;
  text-align: right;
  margin: 0 9.2% 6% 0;
}

/* 割り当て機能一覧 */
div#function {
  margin: 8% 0 0;
}

div#function h3,
div#other-function h3 {
  font-size: 1.6em;
  text-align: center;
  padding: 2.2% 0 .6%;
  width: 100%;
  letter-spacing: .3px;
}

div.function-outer {
  margin: 3.9% 0 0;
}

div.mac-os div.function-outer {
  margin: 2.6% 0 0;
}

div#function table,
div#other-function table {
  border-left: 1px solid #CCCCCC;
  border-top: 1px solid #CCCCCC;
  border-collapse: collapse;
  width: 100%;
}

div.mac-os table {
  border-left: 1px solid #CCCCCC;
  border-top: 1px solid #CCCCCC;
  border-collapse: collapse;
  width: 100%;
}

div.function-l {
  float: left;
  width: 48%;
  margin-left: 1.5%;
}

div.other-function-l {
  float: left;
  width: 20%;
  margin-left: 1.5%;
  margin-top: 2.5%;
}

div.function-r {
  float: right;
  width: 48%;
  margin-right: 1.5%;
}

div.other-function-r {
  float: right;
  width: 76%;
  margin-right: 1.5%;
}

div.function-l tr th,
div.function-r tr th,
div.other-function-l tr th,
div.other-function-r tr th {
  background-color: #76B1CF;
  color: #FFFFFF;
  font-size: 1.15em;
  border-bottom: 1px solid #CCCCCC;
  border-right: 1px solid #CCCCCC;
  padding: 2.5% 0 2%;
}

div.function-l tr td,
div.function-r tr td,
div.other-function-l tr td,
div.other-function-r tr td {
  font-size: 0.9em;
  border-bottom: 1px solid #CCCCCC;
  border-right: 1px solid #CCCCCC;
}

div.function-l tr td:nth-of-type(1):not(.power) {
  background-color: #E1F5FE;
  text-align: center;
  width: 39.5%;
  padding: 4% 0 4%;
}

tr td:nth-of-type(1):not(.power) {
  background-color: #E1F5FE;
  text-align: center;
  width: 39.5%;
  padding: 4% 0 4%;
}

.other-function-r tr td:nth-of-type(1):not(.power) {
  background-color: #E1F5FE;
  text-align: center;
  width: 26.5%;
  padding: 4% 0 4%;
}

div#other-function .other-function-r tr td.low {
  padding: 2.5% 0 2.5%;
}

div.function-l tr td:nth-of-type(2) {
  width: 100%;
  line-height: 1.3;
  padding: 1.4% 0 .8% 4%;
}

table#right-top tr td:nth-of-type(2) {
  width: 100%;
  line-height: 1.3;
  padding: 1.4% 0 .8% 4%;
}

div.mac-os .function-r tr td:nth-of-type(2) {
  width: 100%;
  line-height: 1.3;
  padding: 1.4% 4% .8% 4%;
}

div.mac-os .other-function-r tr td:nth-of-type(2) {
  width: 100%;
  line-height: 1.3;
  padding: 1.4% 4% .8% 4%;
}

div.function-outer tr td.power {
  background-color: #ccc !important;
  color: #000;
  text-align: center;
  font-weight: 700;
}

table#presenter td {
  width: 62% !important;
}

table#presenter {
  width: 110%;
}

div.function-r table#presenter tr td.cap {
  line-height: 1.4;
  text-align: left;
  background-color: #fff;
  border-bottom: 3.5px solid #ccc;
  font-size: .85em;
  padding: 0 3% 0 5%;
}

div.function-r table#presenter tr td.last-cap {
  border-bottom: 1px solid #ccc;
}

td.four {
  padding: 4% 1% 2.5% 4% !important;
}

div p.note {
  color: #3AA7EA;
  font-size: 0.9em;
  text-align: right;
  margin: 2% 0 -1%;
  letter-spacing: -.3px;
}

/* テーブル調節padding */
tr td.gap {
  padding: 4% 0 3% !important;
}

td#shortcut-key {
  padding: 7% 0 5%;
}

td#repeat {
  padding: 5% 0 3%;
}

td#hot-key {
  padding: 2.5% 0 2%;
}

td#multimedia {
  padding: 2.5% 0 2%;
}

td#scroll {
  padding: 2.6% 0 2%;
}

td#page-up {
  padding: 4.5% 0 3%;
}

td#volume-j {
  padding: 4% 0 4%;
}

td.power {
  padding: 3% 0 2%;
}

td#pre {
  padding: 3% 0 2%;
}

td.p-items {
  padding: 1% 0 0 !important;
}

td#back {
  padding: 4.5% 0 3.5%;
}

td#firder {
  padding: 5% 0 3%;
}

/* 対応製品一覧 */
div#taiou h2 {
  background-color: #2B989F;
  font-size: 2em;
  text-align: center;
  color: #FFFFFF;
  padding: 2.3% 0 2%;
}

div.menu {
  text-align: center;
  margin: 3.5% 0 3%;
}

div.menu a {
  display: inline-block;
}

div.menu a:nth-of-type(1),
div.menu a:nth-of-type(2) {
  margin: 0 0.3% 0 0;
}

div#taiou div#bluetooth h3 {
  border-bottom: 2px solid #0175A8;
  font-size: 1.6em;
  color: #0175A8;
  padding: 0 0 0.7% 1%;
  margin: 0 0 3.5% 1%;
  text-align: left;
  width: 97%;
  letter-spacing: .5px;
}

div#taiou div#bluetooth h3 span.attnote {
  display: inline-block;
  font-size: 0.8rem;
  font-weight: normal;
  text-align: center;
  color: #FF0000;
  margin: 0 0 0 1%;
}

div#taiou div#wireless h3 {
  border-bottom: 2px solid #AD0212;
  font-size: 1.6em;
  color: #AD0212;
  padding: 0 0 0.5% 1%;
  margin: 0 0 3.5% 1%;
  text-align: left;
  width: 97%;
  letter-spacing: .5px;
}

div#taiou div#wired h3 {
  border-bottom: 2px solid #2F8034;
  font-size: 1.6em;
  color: #2F8034;
  padding: 0 0 0.5% 1%;
  margin: 0 0 3.5% 1%;
  text-align: left;
  width: 97%;
  letter-spacing: .5px;
}

div#taiou ul {
  padding: 0 1.5% 0 2%;
}

div#taiou ul li {
  width: 23%;
  float: left;
  margin: 0 2.5% 6% 0;
}

div#taiou ul li a {
  display: block;
}

div#taiou ul li a:hover {
  opacity: 0.6;
}

div#taiou ul li a:hover img {
  opacity: 1 !important;
}

div#taiou ul li:nth-of-type(4n) {
  margin: 0 0 5%;
}

div#taiou ul li img.product {
  width: 100%;
  border: 1px solid #CFCFCF;
  margin: 4% 0 4.5%;
}

span.icon {
  display: inline-block;
  font-size: 1.1em;
  font-weight: 700;
  color: #333333;
  text-align: center;
  padding: 3.5% 0 3%;
  border-radius: 0.35em;
  width: 28%;
}

span.small {
  background-color: #FFDF63;
}

span.mid {
  background-color: #A6D73D;
}

span.large {
  background-color: #39C6A6;
}

span.hinban {
  display: block;
  font-size: 1.05em;
  font-weight: 700;
  text-align: center;
}

span.hinban img {
  vertical-align: -1px;
  margin: 0 1% 0 0;
}

a.btn-soft {
  margin: 2% auto 0;
  text-align: center;
}

p.serial {
  font-size: 0.9em;
  width: 90%;
  margin: 5.5% 0 0 2.5%;
  line-height: 1.4;
}

/* 対応OS */
div#os h2 {
  text-align: center;
  font-size: 1.6em;
  margin: 10% auto 3%;
  padding: 0 0 .7%;
  color: #4F86BE;
  border-bottom: 3px solid #4F86BE;
  width: 100%;
}

div#os p {
  font-size: 2.2em;
  font-weight: 700;
  text-align: center;
  margin: 2.5% 0 9.8%;
}

div#os p span.attnote {
  display: block;
  font-size: 0.85rem;
  font-weight: normal;
  text-align: center;
  color: #FF0000;
  margin: 1% 0 0;
}

div#mac-os {
  margin: 10% 0 9.7%;
}

div#mac-os p {
  font-size: 2.2em;
  font-weight: 700;
  text-align: center;
  margin: 2.5% 0 0;
}

div#mac-os h2 {
  text-align: center;
  font-size: 1.6em;
  margin: 10.7% auto 3.4%;
  padding: 0 0 .7%;
  color: #4F86BE;
  border-bottom: 3px solid #4F86BE;
  width: 100%;
}

div.download {
  text-align: center;
  margin: 0 0 13.1%;
}

div.download p {
  font-size: 1.15em;
  margin: 0 0 1.1%;
  letter-spacing: -1px;
  font-weight: 700;
}

/* ドライバー */
div#driver-mac {
  margin: 16% 0 0;
}

div#driver-win h2,
div#driver-mac h2 {
  font-size: 1.95em;
  text-align: center;
  color: #FFFFFF;
  background-color: #3AA7EA;
  padding: 2.5% 0;
  margin: 0 0 5.5%;
}

div#driver-mac h2 {
  background-color: #2B989F;
}

div#driver-win dl,
div#driver-mac dl {
  padding: 0 2%;
  margin: 0 0 8%;
}

div#driver-win dl dt,
div#driver-mac dl dt {
  text-indent: -1.2em;
  margin: 0 0 1.8% 1.2em;
  font-size: 1.1em;
  line-height: 1.5;
}

div#driver-win dl dt.noindent,
div#driver-mac dl dt.noindent {
  text-indent: 0;
  margin: 0 0 0 0;
}

div#driver-win dl dd,
div#driver-mac dl dd {
  text-align: center;
}

div.mfs {
  text-align: center;
  margin: 15% 0 4%;
}

div.mfs p {
  font-size: 1.45em;
  margin: 0 0 1.3%;
  letter-spacing: -1px;
  font-weight: 700;
}

div.download p.driver {
  margin: 3.5% 0 0;
}

p.driver a {
  display: inline-block;
  background-color: #3AA7EA;
  color: #FFFFFF;
  letter-spacing: 0;
  font-weight: 400;
  padding: 1% 0;
  border-radius: 2em;
  transition: 0.2s;
  opacity: 1;
  width: 452px;
}

p.driver a:hover {
  transition: 0.2s;
  opacity: 0.6;
  text-decoration: none;
}

div#menu-driver {
  text-align: center;
  font-size: 1.15em;
  margin: 0 0 7.2%;
}

div#menu-driver a:nth-of-type(1) {
  margin: 0 23px 0 0;
}

div.title-banner {
  margin: 0 0 3%;
}

div#driver-menu {
  text-align: center;
  margin: 0 0 9%;
}

div#driver-menu a {
  display: inline-block;
}

div#driver-menu a:nth-of-type(1) {
  margin: 0 1.3% 0 0;
}

/* 「WindowsによってPCが保護されました」と表示されてしまう場合 */
a.win11-protect {
  display: block;
  margin: 3% auto 4%;
  width: 615px;
  padding: 2% 0;
  border: 1px solid #AAA;
  border-radius: 0.4em;
  background-color: #FAFAFA;
  font-size: 1.1em;
  text-align: center;
  transition: 0.2s;
}

a.win11-protect:hover {
  background-color: #DFDFDF;
  color: #1C64B3;
}
