@charset "UTF-8";
body {
  min-width: 0;
  font-family: 游ゴシック, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', sans-serif;
}

.sp {
  display: none;
}

.pc {
  display: block;
}

#footer span.pc {
  display: inline;
}

#top-container #container {
  width: 100%;
}

#top-container #top-rotation-banner {
  width: 100%;
  margin: 0;
  max-height: 590px;
}

#top-container #top-rotation-banner #js-slider-1 {
  width: 100%;
}

/* ロード時にフェード表示するようにする */
#top-container #top-rotation-banner .slider-3 {
  display: block;
  opacity: 0;
  transition: opacity 1.5s linear;
}

#top-container #top-rotation-banner .slider-3.slick-initialized {
  display: block;
  opacity: 1;
}

#top-container #top-rotation-banner #js-slider-1 button {
  visibility: hidden;
}

#top-container #top-rotation-banner #js-slider-1:hover button {
  visibility: visible;
}

#top-container #top-rotation-banner .slider-3 .slick-slide {
  margin: 0 2.5px;
  padding: 0;
  position: relative;
}

#top-container #top-rotation-banner .slider-3 .slick-slide .slide-img {
  max-width: 1024px;
  width: 100%;
  max-height: 432px;
  height: 25.8vw;
  transition: all 0.6s ease 0.4s;
  opacity: 0.6;
  overflow: hidden;
}

#top-container #top-rotation-banner .slider-3 .slick-slide.slick-current .slide-img {
  opacity: 1;
}

#top-container #top-rotation-banner .slider-3 .slick-slide .slide-img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 1 !important;
}

#top-container #top-rotation-banner .slider-3 .slick-slide .slide-img img:hover {
  opacity: 1 !important;
}

#top-container #top-rotation-banner .slider-3 .slick-arrow {
  width: 80px;
  height: 80px;
  cursor: pointer;
  border: none;
  outline: none;
  font-size: 0;
  position: absolute;
  top: 43%;
  z-index: 1;
}

#top-container #top-rotation-banner .slider-3 .slick-arrow::before {
  content: '';
  display: block;
  position: absolute;
  top: 24px;
  z-index: 10;
}

#top-container #top-rotation-banner .slider-3 .slick-next {
  background: url(/static/images/gallery_banner/yajirushi_R_80.png) no-repeat;
  background-size: contain;
  right: 17.6%;
}

#top-container #top-rotation-banner .slider-3 .slick-prev {
  background: url(/static/images/gallery_banner/yajirushi_L_80.png) no-repeat;
  background-size: contain;
  left: 17.6%;
}

#top-container #top-rotation-banner .slider-3 .slick-next:hover,
#top-container #top-rotation-banner .slider-3 .slick-prev:hover {
  opacity: 0.6;
}

#top-container #top-rotation-banner .slider-3 .slick-next::before {
  left: 20px;
}

#top-container #top-rotation-banner .slider-3 .slick-prev::before {
  border-width: 0 0 3px 3px;
  right: 22px;
}

/*重要なお知らせ
------------------*/
#top-important-news {
  max-width: 1100px;
  width: 90%;
  margin: 50px auto;
  text-align: center;
  border: 1px solid #FF0000;
  font-size: 1em;
  font-weight: bold;
  line-height: 1.3;
}

#top-important-news p span {
  display: block;
  padding: 14px 0;
  opacity: 1;
  transition: 0.2s;
}

#top-important-news p a:hover {
  opacity: 0.6;
  transition: 0.2s;
}

#top-important-news span {
  color: #FC011C;
}

/*ニュースリリース・新商品・メディア掲載情報
------------------*/
/* 切り替えボタン */
#info-switching-btn {
  display: flex;
  justify-content: space-around;
  max-width: 930px;
  width: 95%;
  border: 2px solid #1750AB;
  box-sizing: border-box;
  margin: 30px auto 0;
  cursor: pointer;
}

#info-switching-btn .switching-btn-item {
  max-width: 260px;
  width: 33.3%;
  padding: 2.1%;
  text-align: center;
  font-size: 1.25em;
  font-weight: bold;
  color: #1750AB;
  position: relative;
}

#info-switching-btn .switching-btn-item .arrow {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-top: solid 2px #1750AB;
  border-right: solid 2px #1750AB;
  transform: rotate(135deg);
  vertical-align: top;
  margin: 2% 0 0 3%;
  position: absolute;
}

#info-switching-btn .switching-btn-item.active .arrow {
  display: none;
}

.switching-btn-item.active {
  color: #fff !important;
  background-color: #004DA2 !important;
  position: relative;
}

#info-switching-btn .switching-btn-item.active::after {
  content: "";
  margin: auto;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 7px solid transparent;
  border-left: 7px solid transparent;
  border-top: 11px solid #014e9e;
  border-bottom: 0;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
}

#info-switching-btn .switching-btn-item:nth-of-type(2) {
  border-right: 2px solid #004DA2;
  border-left: 2px solid #004DA2;
}

#info-switching-btn .switching-btn-item:nth-of-type(3) {
  border-right: 2px solid #004DA2;
}

#info-switching-slides {
  max-width: 1110px;
  width: 90%;
  margin: 50px auto 0;
  padding: 0;
  position: relative;
}

/* ニュースリリース */
.new-icon {
  position: relative;
}

.new-icon::after {
  content: "";
  background: url(/static/images/header_new_2209/icn_new_red.png) no-repeat;
  background-size: contain;
  width: 40px;
  height: 40px;
  position: absolute;
  top: 0;
  left: 0;
}

div#info-slider-mediaposting .new-icon::after {
  background: none;
}

#js-slider-2, #js-slider-3, #js-slider-4, #js-slider-8 {
  display: block;
  width: 100%;
  max-height: 346px;
}

.info-slider .slick-slide {
  margin: 0 26px;
  padding: 0;
  position: relative;
  max-width: 180px;
  height: auto;
}

.info-slider .slick-slide .slide-img {
  max-width: 1280px;
  width: 100%;
  max-height: 180px;
  transition: all 0.6s ease 0.4s;
  overflow: hidden;
}

.info-slider .slick-slide .slide-img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.info-slider .slick-arrow {
  width: 60px;
  height: 60px;
  cursor: pointer;
  border: none;
  outline: none;
  font-size: 0;
  position: absolute;
  top: 22%;
  z-index: 1;
}

.info-slider .slick-arrow::before {
  content: '';
  display: block;
  position: absolute;
  top: 24px;
}

.info-slider .slick-next {
  background: url(/static/images/gallery_banner/yajirushi_R_80.png) no-repeat;
  background-size: contain;
  left: 101%;
}

.info-slider .slick-prev {
  background: url(/static/images/gallery_banner/yajirushi_L_80.png) no-repeat;
  background-size: contain;
  right: 103%;
}

.info-slider .slick-next::before {
  left: 20px;
}

.info-slider .slick-prev::before {
  border-width: 0 0 3px 3px;
  right: 22px;
}

.slide-text {
  margin: 5px 0 0;
  font-size: 0.8125em;
  line-height: 1.6;
  letter-spacing: 0.05em;
}

.slide-text .date .cate {
  display: inline-block;
  font-size: 0.76923em;
  color: #fff;
  background-color: #666666;
  border-radius: 8px;
  padding: 0 4px;
  margin: 0 0 0 5px;
  vertical-align: top;
}

.slide-text .name {
  display: block;
  margin: 5px 0 0;
  font-size: 1em;
  line-height: 1.4;
  font-weight: bold;
  text-decoration: none;
}

.slide-text .cap {
  margin: 0;
  font-size: 1em;
  line-height: 1.6;
}

.slide-text .rel-cnt {
  font-size: 0.92em;
  margin: 0 0 10px;
  line-height: 1.4;
  color: #3b9ed6;
}

.slide-text .media-icon {
  width: 100%;
  margin: 8px 0;
}

.slide-text .media-icon img {
  width: 100%;
}

.slide-text .link-btn {
  display: block;
  background: #9F9F9F;
  max-width: 120px;
  margin: 7px 0 0;
  padding: 0 6px 0;
  box-sizing: border-box;
  color: #fff;
}

.slide-text p.media-icon .link-btn {
  display: block;
  background: #FFF;
  width: 100%;
  max-width: 100%;
  margin: 7px 0 0;
  padding: 0;
  box-sizing: border-box;
  color: #fff;
}

#info-slider-newsrelease, #info-slider-newproduct, #info-slider-mediaposting, #info-whats-new-news {
  opacity: 0;
  width: 100%;
  height: 0;
  transition: .2s;
  position: absolute;
  top: -3000px;
  z-index: 0;
}

#info-slider-newsrelease a, #info-slider-newproduct a, #info-slider-mediaposting a, #info-whats-new-news a {
  pointer-events: none;
}

#info-slider-newsrelease.active, #info-slider-newproduct.active, #info-slider-mediaposting.active, #info-whats-new-news.active {
  display: block;
  height: 100%;
  opacity: 1;
  transition: .2s;
  position: static;
  z-index: 100;
}

#info-slider-newsrelease.active a, #info-slider-newproduct.active a, #info-slider-mediaposting.active a, #info-whats-new-news.active a {
  pointer-events: auto;
}

#info-whats-new-news.active .sp {
  display: block;
}

#info-whats-new-news h3 {
  display: none;
}

#info-whats-new-news #whats-new-news {
  margin: 0;
}

/* ロード時にフェード表示するようにする */
#info-slider-newsrelease.active .info-slider {
  display: block;
  opacity: 0;
  transition: opacity 0.8s linear;
}

#info-slider-newsrelease.active .info-slider.slick-initialized {
  display: block;
  opacity: 1;
}

.other-link-area {
  text-align: center;
  margin: 5px 0 0;
}

.info-link-btn {
  display: block;
  width: 52%;
  max-width: 240px;
  margin: 2.2% auto 0;
  padding: 0.6em 0;
  border: 1px solid;
  border-radius: 20px;
  font-size: 0.875em;
  font-weight: bold;
  line-height: 1.6;
  letter-spacing: 0.05em;
  text-align: center;
  color: #1750AB;
  background-color: #fff;
  position: relative;
  z-index: 10;
}

div.info-link-btn-taiou {
  text-align: center;
}

.generation-link-btn {
  display: inline-block;
  width: 52%;
  max-width: 240px;
  margin: 2.2% 1% 0;
  padding: 0.6em 0;
  border: 1px solid;
  border-radius: 20px;
  font-size: 0.875em;
  font-weight: bold;
  line-height: 1.6;
  letter-spacing: 0.05em;
  text-align: center;
  color: #1750AB;
  background-color: #fff;
  position: relative;
  z-index: 10;
}

.generation-link-btn {
  display: none;
}

.info-link-btn:hover, .generation-link-btn:hover {
  color: #FC011C;
}

.supported-link-btn {
  display: inline-block;
  width: 52%;
  max-width: 240px;
  margin: 2.2% 1% 0;
  padding: 0.6em 0;
  border: 1px solid;
  border-radius: 20px;
  font-size: 0.875em;
  font-weight: bold;
  line-height: 1.6;
  letter-spacing: 0.05em;
  text-align: center;
  color: #1750AB;
  background-color: #fff;
  position: relative;
  z-index: 10;
}

/*  新商品・おすすめ製品のご提案チラシ
------------------*/
#ad-flyer {
  background-color: #F5F5F5;
  width: 100%;
  margin: 30px 0 0;
  padding: 22px 0 32px;
  position: relative;
  z-index: 10;
}

#ad-flyer h3 {
  text-align: center;
  font-size: 2em;
  font-weight: bold;
  line-height: 1.6;
}

#ad-flyer .ad-flyer-block .ad-flyer-item .right {
  margin: -1% 0 0 3.5%;
}

.ad-flyer-block {
  display: flex;
  justify-content: center;
  max-width: 1070px;
  width: 95%;
  margin: 10px auto 0;
}

.ad-flyer-block .ad-flyer-item {
  display: flex;
  max-width: 522.61px;
  width: 48%;
  height: 160px;
  border: 2px solid #C1C1C1;
  border-radius: 4px;
  background-color: #fff;
  cursor: pointer;
  align-items: center;
  color: #333;
}

.ad-flyer-block .ad-flyer-item:nth-of-type(1) {
  margin: 0 12px 0 0;
}

.ad-flyer-block .ad-flyer-item:nth-of-type(2) {
  margin: 0 0 0 12px;
}

/* カタログ（ダミー用記述） */
.ad-flyer-block .ad-flyer-item.dammy {
  height: auto;
  background: none;
  border: none;
}

.ad-flyer-block .ad-flyer-item.dammy img {
  width: 99.501%;
}

.ad-flyer-block .ad-flyer-item:hover {
  color: #333;
  opacity: .6;
}

.ad-flyer-block .ad-flyer-item .left {
  display: inline-block;
  margin: 0 0 0 7.5%;
  width: 24.5%;
  height: 100%;
  position: relative;
}

.ad-flyer-block .ad-flyer-item .left img {
  position: absolute;
  width: 100%;
  height: 90%;
  box-shadow: 0px -2px 6px 0px #d1d1d1;
  object-fit: cover;
  object-position: top;
  bottom: 0;
}

.ad-flyer-block .ad-flyer-item .right {
  display: inline-block;
  vertical-align: top;
  margin: 4.2% 0 0;
}

.ad-flyer-block .ad-flyer-item .right .date {
  font-size: 0.85em;
  line-height: 1.6;
  font-weight: bold;
  color: #FF0000;
  letter-spacing: 0.02em;
}

.ad-flyer-block .ad-flyer-item .right .date.osu {
  color: #009DFF;
}

.ad-flyer-block .ad-flyer-item .right .cap {
  font-size: 0.9em;
  line-height: 1.6;
  margin: 2px 0 0;
  letter-spacing: 0.04em;
}

.ad-flyer-block .ad-flyer-item .right .name {
  margin: 0;
  font-size: 1.8em;
  line-height: 1.4;
  font-weight: bold;
}

.ad-flyer-block .ad-flyer-item .right .name span {
  display: block;
  margin: 4px 0 0 0px;
  padding: 2px 12px;
  border-radius: 2em;
  font-size: 0.65em;
  font-weight: bold;
  color: #fff;
  width: 127px;
  text-align: center;
}

.ad-flyer-block .ad-flyer-item .right .name span.shin {
  background-color: #EC162E;
}

.ad-flyer-block .ad-flyer-item .right .name span.osu {
  background-color: #009DFF;
}

.introduction-contents {
  border-bottom: 1px solid #D9D9D9;
}

.introduction-contents h3 {
  font-size: 2em;
  text-align: center;
}

#top-container #top-rotation-banner .slick-prev::before {
  border-width: 0 0 3px 3px;
  right: 22px;
}

#top-container #top-rotation-banner .slick-dots {
  text-align: center;
  margin: 0.6% 0 0;
}

#top-container #top-rotation-banner .slick-dots li {
  display: inline-block;
}

#top-container #top-rotation-banner .slick-dots button {
  display: block;
  width: 14px;
  height: 14px;
  margin: 6.6px;
  font-size: 0;
  padding: 0;
  border: 0;
  outline: none;
  cursor: pointer;
  background: #bcbcbc;
  border-radius: 50%;
}

#top-container #top-rotation-banner .slick-dots .slick-active button {
  background: #0a467d;
}

/* おすすめコンテンツ */
#osusume-area {
  margin: 30px auto 0;
  padding-bottom: 30px;
}

#osusume-area h3 {
  margin-bottom: 23px;
}

#osusume-area .swiper-pagination {
  bottom: 6% !important;
}

#osusume-area .info-link-btn {
  margin-top: 0.8%;
}

#osusume-area .swiper-slide .slide-text {
  height: 7em !important;
}

/* 注目製品 */
#featured-area {
  margin-top: 30px;
  padding-bottom: 30px;
}

#featured-area h3 {
  margin-bottom: 10px;
}

#featured-area .swiper-slide .slide-text {
  text-align: left;
  margin: 12px auto 0;
  max-width: 240px;
  width: 100%;
  height: 6em;
}

#featured-area .swiper-slide.swiper-slide-active .slide-text {
  max-width: 320px;
}

#featured-area .info-link-btn {
  margin-top: 1.5%;
}

/* 対応情報 */
#supported-information {
  margin-top: 30px;
  padding-bottom: 30px;
  border-bottom: 1px solid #D9D9D9;
}

#supported-information h3 {
  margin-bottom: 0;
}

#supported-information .supported-important-list {
  margin: 0.9% auto 0;
  text-align: center;
  font-size: 0.875em;
  font-weight: bold;
  letter-spacing: 0.04em;
}

#supported-information .supported-important-list .supported-important-list-ttl {
  width: 6.7em;
  display: inline-block;
  vertical-align: top;
}

#supported-information .supported-important-list .supported-important-list-inner {
  display: inline-block;
  vertical-align: top;
}

#supported-information .supported-important-list .supported-important-list-inner a {
  margin-bottom: 5px;
}

#supported-information .supported-important-list .supported-important-list-inner .taiou-info-date {
  display: inline-block;
  vertical-align: top;
  margin-bottom: 5px;
}

p.update-sepa {
  margin: 0 0 5px;
}

.supported-information-link {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  max-width: 1130px;
  width: 95%;
  margin: 45.5px auto 0;
  padding-right: 1%;
}

.supported-information-item {
  display: block;
  width: 140px;
  text-align: center;
}

.supported-information-image {
  display: block;
  width: 140px;
  height: 140px;
  text-align: center;
}

.supported-information-image img {
  width: 100%;
  height: auto;
}

.supported-information-text {
  font-size: 1.15em;
  font-weight: bold;
  margin: 7% 0;
  color: #333;
}

#supported-information .info-link-btn {
  margin-top: 3%;
}

/* 製品カテゴリ別の対応情報 */
#supported-category-product {
  margin-top: 40px;
  padding: 40px 0 0;
  border-top: 1px solid #D9D9D9;
}

#supported-category-product .supported-information-item {
  width: 173px;
  height: auto;
  text-align: center;
}

#supported-category-product .supported-information-item .supported-information-image {
  margin: 0 auto 5%;
  height: auto;
  width: 120px;
}

#supported-category-product .supported-information-item .supported-information-text {
  font-size: 1.1em;
  line-height: 1.6;
}

/* 動画で製品紹介 */
.movie_new_icon {
  position: relative;
}

.movie_new_icon::after {
  content: "";
  background: url(/static/images/header_new_2209/icn_new_red.png) no-repeat;
  background-size: contain;
  width: 40px;
  height: 40px;
  position: absolute;
  top: -9%;
  left: -2%;
  opacity: 0.9;
}

#video-introduction-area {
  margin: 60px auto 0;
  border-bottom: 0;
}

#video-introduction-area .swiper-slide .slide-text {
  text-align: left;
  margin: 5% auto 0;
  max-width: 240px;
  width: 100%;
  height: 7em;
}

#video-introduction-area .swiper-slide a {
  display: block;
  position: relative;
}

#video-introduction-area .swiper-slide a img.movie-icon {
  transform: scale(0.646);
  opacity: 0.7 !important;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: auto;
  height: auto;
}

#video-introduction-area .swiper-slide.swiper-slide-active a img.movie-icon {
  transform: scale(0.8603);
  opacity: 0.7 !important;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: auto;
  height: auto;
}

#video-introduction-area .swiper-slide.swiper-slide-active .slide-text {
  max-width: 320px;
}

#video-introduction-area .swiper-slide a.product-link {
  display: inline-block;
  margin: 7px 0 0;
  box-sizing: border-box;
  line-height: 1.4;
}

#video-introduction-area .info-link-btn {
  margin-top: 0.3%;
}

#video-introduction-area .swiper-pagination {
  bottom: 8% !important;
}

/* 製品カテゴリー */
#product-category {
  margin: 30px 0 0;
  padding: 35px 0 30px;
  background: #F5F5F5;
}

#video-introduction-area h3 {
  margin-bottom: -8px;
}

.product-category-box {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  max-width: 1200px;
  width: 93%;
  margin: 3.3% auto 0;
}

.product-category-item {
  max-width: 290px;
  width: 32%;
  height: 230px;
  background: #fff;
  border-radius: 4px;
  margin: 0 0 1.2%;
}

.product-category-image {
  width: 87%;
  height: 150px;
  margin: 7% auto 0;
  background-size: 100% !important;
}

.product-category-image.desk-rack {
  background: url(/static/images/header_new_2209/img_desk_rack.jpg) no-repeat;
}

.product-category-image.storage {
  background: url(/static/images/header_new_2209/img_storage.jpg) no-repeat;
}

.product-category-image.idmg_acc {
  background: url(/static/images/header_new_2209/idmg_acc.jpg) no-repeat;
}

.product-category-image.idmg_yosi {
  background: url(/static/images/header_new_2209/idmg_yosi.jpg) no-repeat;
}

.product-category-image.input {
  background: url(/static/images/header_new_2209/img_input.jpg) no-repeat;
  margin: 5% auto 0;
}

.product-category-image.speaker {
  background: url(/static/images/header_new_2209/img_speaker.jpg) no-repeat;
  margin: 5% auto 0;
}

.product-category-image.lan {
  background: url(/static/images/header_new_2209/img_lan.jpg) no-repeat;
  margin: 5% auto 0;
}

.product-category-image.cable {
  background: url(/static/images/header_new_2209/img_cable.jpg) no-repeat;
  margin: 5% auto 0;
}

.product-category-image.sp_tab {
  background: url(/static/images/header_new_2209/img_sp_tab.jpg) no-repeat;
  margin: 0 auto 8.7%;
}

.product-category-image.tap {
  background: url(/static/images/header_new_2209/img_tap.jpg) no-repeat;
  margin: 0 auto 3.8%;
}

.product-category-image.biz_gy {
  background: url(/static/images/header_new_2209/icn_biz_gy.png) no-repeat;
  height: 130px;
}

.product-category-image.new_gy {
  background: url(/static/images/header_new_2209/icn_new_red.png) no-repeat;
  height: 130px;
}

.product-category-image.search_gy {
  background: url(/static/images/header_new_2209/icn_search_gy.png) no-repeat;
  height: 130px;
}

.product-category-image img {
  max-width: 240px;
  width: 100%;
  border-radius: 4px;
}

.product-category-text {
  text-align: center;
  font-size: 1.125em;
  font-weight: bold;
  margin: 6.5% 0 0;
  color: #333;
}

.product-category-text.two-row {
  margin: 1.5% 0 0;
  line-height: 1.2em;
}

.product-category-image.icon {
  width: 40.9%;
  max-width: 118px;
  margin-top: 11%;
}

.product-category-image.icon02 {
  max-width: 108px;
}

#product-category .info-link-btn {
  margin-top: 0.8%;
}

#product-category .ad-flyer-block {
  display: flex;
  justify-content: space-between;
  max-width: 1070px;
  width: 95%;
  margin: 73px auto 0;
}

#product-category .ad-flyer-block .ad-flyer-item .left img {
  position: absolute;
  width: 100%;
  height: 90%;
  box-shadow: 0px -2px 6px 0px #d1d1d1;
  object-fit: cover;
  object-position: top;
  bottom: 0;
}

#product-category .ad-flyer-block .ad-flyer-item .right {
  display: inline-block;
  vertical-align: top;
  margin: 0 auto 0 4.5%;
  width: 70%;
}

#product-category .ad-flyer-block .ad-flyer-item .right .date {
  font-size: 0.85em;
  line-height: 1.6;
  font-weight: bold;
  color: #FF0000;
  letter-spacing: 0.02em;
}

#product-category .ad-flyer-block .ad-flyer-item .right .cap {
  font-size: 0.875em;
  line-height: 1.6;
  margin: 2px 0 0;
  letter-spacing: 0.04em;
}

#product-category .ad-flyer-block .ad-flyer-item .right .name {
  margin: 0;
  font-size: 1.25em;
  line-height: 1.4;
  font-weight: bold;
}

#product-category .ad-flyer-block .ad-flyer-item .right .name span {
  display: inline-block;
  margin: 0 0 0 20px;
  padding: 0 15px;
  border-radius: 12px;
  font-size: 0.75em;
  font-weight: bold;
  color: #fff;
}

.link-btn-category {
  display: flex;
  justify-content: space-between;
  max-width: 1070px;
  width: 95%;
  margin: 18px auto 0;
}

.category-item {
  display: block;
  width: 24%;
  border: 1px solid #C1C1C1;
  background-color: #fff;
  text-align: center;
  border-radius: 4px;
  padding: 11px 0;
}

.category-item .text {
  display: inline-block;
  vertical-align: middle;
  color: #333;
}

.category-item .icon {
  max-width: 36px;
  vertical-align: middle;
  margin: 0 9px 0 0;
}

.category-item .icon img {
  width: 100%;
  vertical-align: middle;
}

.product-category-image.icon {
  width: 35%;
}

/* 最近チェックした製品 */
#product_checked_recently .info-link-btn {
  margin-top: 2%;
}

#product_checked_recently {
  margin: 4.4% 0 0;
  padding: 0 0 3.7%;
}

.product_checked_recently-slide {
  max-width: 1300px;
  margin: 0 auto;
  padding: 0px 100px;
  box-sizing: border-box;
}

#product_checked_recently h3 {
  margin-bottom: 1%;
}

#product_checked_recently .info-slider .slick-slide {
  margin: 0 12.5px;
  max-width: 160px;
}

#product_checked_recently .info-slider .slick-slide .slide-img {
  max-height: 160px;
}

#product_checked_recently .slick-dots {
  margin-top: 1%;
}

/* 最新情報・お知らせ */
#whats-new-news {
  margin: 50px 0 0;
  border-bottom: 0;
}

#whats-new-news h3 {
  margin-bottom: 11px;
}

.new-news-box {
  max-width: 1200px;
  margin: 0 auto 0;
}

.new-news-item {
  width: 100%;
  max-height: 86px;
  padding: 1.39em 2.1em 0.9em;
  box-sizing: border-box;
  font-size: 0.9375em;
  line-height: 1.6;
  color: #333;
  border-bottom: 1px solid #D9D9D9;
  display: flex;
}

.new-news-item .date {
  width: 8.7em;
  display: inline-block;
  font-weight: bold;
  vertical-align: top;
}

.new-news-item .cate {
  display: inline-block;
  font-weight: bold;
  text-align: center;
  width: 8.8em;
  height: 24px;
  color: #fff;
  margin: 0 1.7em 0 0;
  vertical-align: top;
}

.new-news-item a.info {
  display: inline-block;
  width: 68%;
  padding-bottom: 10px;
}

.new-news-item .cate.pink {
  background-color: #F4757B;
}

.new-news-item .cate.purple {
  background-color: #9D79CA;
}

.new-news-item .cate.blue {
  background-color: #2B78BA;
}

.new-news-item .cate.red {
  background-color: #CC0000;
}

.new-news-item .info {
  display: inline-block;
  letter-spacing: 0.065em;
  color: #333;
}

#whats-new-news .info-link-btn {
  margin-top: 1.5%;
}

/* 公式SNS・メールマガジン登録 */
#official-sns-email {
  background-color: #F8F8F8;
  margin: 50px 0 0;
  padding: 3.6% 0 50px;
  border-bottom: 0;
}

#official-sns-email h3 {
  margin-bottom: 0;
}

#official-sns-email .sns-icon {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 2% auto 0;
  padding: 0 0 0 0.6%;
  max-width: 283px;
}

#official-sns-email .sns-icon a {
  display: block;
  width: 50px;
}

#official-sns-email .sns-icon a img {
  width: 100%;
}

#official-sns-email .mailmaga {
  display: flex;
  width: 95%;
  max-width: 600px;
  margin: 43px auto 0;
  padding: 0.8% 0.9% 0.8% 1.5%;
  box-sizing: border-box;
  background-color: #fff;
  border: 1px solid #D1D1D1;
  border-radius: 4px;
  justify-content: center;
  align-items: center;
}

#official-sns-email .mailmaga .icon {
  max-width: 92px;
  vertical-align: middle;
}

#official-sns-email .mailmaga .text {
  display: inline-block;
  font-size: .85em;
  vertical-align: middle;
  margin: 11px 0 0 22px;
  letter-spacing: 0.03em;
  line-height: 1.6;
  width: 56%;
  color: #333;
}

#official-sns-email .mailmaga .emphasis {
  font-size: 1.65em;
  font-weight: bold;
}

/* サンワチャンネル・サンワダイレクトへの遷移ボタン */
#sanwa-transition {
  display: flex;
  justify-content: space-between;
  max-width: 1065px;
  width: 95%;
  margin: 3.2% auto 0;
  color: #333;
}

.sanwa-transition-btn {
  display: block;
  max-width: 522px;
  margin: 0;
  width: 49%;
  padding: 1.9% 4.9% 2.2%;
  box-sizing: border-box;
  background-color: #fff;
  border: 1px solid #D1D1D1;
  border-radius: 4px;
  text-align: center;
}

.sanwa-transition-btn .text {
  display: block;
  font-size: 1.2em;
  margin: 0px 0 20px;
  color: #333;
}

.sanwa-transition-btn.direct .text {
  margin: 0 0 15px;
}

.sanwa-transition-btn img {
  width: 100%;
}

.sanwa-transition-btn.sanwach .icon {
  width: 75%;
}

.sanwa-transition-btn.direct .icon {
  width: 43.4%;
}

#remind {
  margin-top: 50px;
  padding-bottom: 50px;
  border-bottom: 1px solid #D9D9D9;
}

@media (max-width: 1700px) {
  /* ニュースリリース・新商品・メディア掲載情報 */
  #info-switching-btn {
    margin: 30px auto 0;
  }
}

@media (max-width: 1300px) {
  /* ニュースリリース・新商品・メディア掲載情報 */
  #info-switching-slides {
    width: 75%;
  }
  /* 対応情報 */
  .supported-information-link {
    max-width: 520px;
  }
  /* 製品カテゴリー */
  .product-category-box {
    max-width: 910px;
  }
}

@media (max-width: 979px) {
  /* ニュースリリース・新商品・メディア掲載情報 */
  #info-switching-slides {
    max-width: 650px;
    width: 90%;
    margin: 70px auto 0;
    padding: 0;
  }
  #top-container #top-rotation-banner .slider-3 .slick-arrow {
    width: 60px;
    height: 60px;
    cursor: pointer;
    border: none;
    outline: none;
    font-size: 0;
    position: absolute;
    top: 43%;
    z-index: 1;
  }
  /* 新商品・おすすめ製品のご提案チラシ */
  .ad-flyer-block .ad-flyer-item .right .cap {
    font-size: 0.775em;
    letter-spacing: 0;
  }
  .ad-flyer-block .ad-flyer-item .right .name {
    font-size: 1em;
  }
  /* 製品カテゴリー */
  #product-category .ad-flyer-block .ad-flyer-item .right .cap {
    letter-spacing: 0;
  }
  .category-item {
    font-size: 0.8em;
  }
  #product-category .ad-flyer-block .ad-flyer-item .right .name {
    font-size: 1em;
  }
}

@media (max-width: 768px) {
  .introduction-contents h3 {
    font-size: 1.5em;
    text-align: center;
  }
  /* ニュースリリース・新商品・メディア掲載情報 */
  #info-switching-slides {
    max-width: 415px;
  }
  #info-switching-btn {
    width: 85%;
  }
  #info-switching-btn .switching-btn-item {
    font-size: 1.0375em;
  }
  #info-switching-btn .switching-btn-item .arrow {
    width: 4px;
    height: 4px;
  }
  /* 新商品・おすすめ製品のご提案チラシ */
  #ad-flyer h3 {
    font-size: 1.5em;
  }
  .ad-flyer-block {
    display: block;
    width: 85%;
  }
  .ad-flyer-block .ad-flyer-item {
    display: flex;
    max-width: 500px;
    width: 100%;
    height: 7em;
    margin: 0 auto 2em;
    align-items: center;
  }
  .info-slider .slick-next {
    left: 98%;
  }
  .info-slider .slick-prev {
    right: 98%;
  }
  .info-slider .slick-arrow {
    width: 30px;
    height: 30px;
    top: 25%;
  }
  /* おすすめコンテンツ */
  #osusume-area .swiper-pagination {
    bottom: 9% !important;
  }
  /* 注目製品 */
  #featured-area .swiper-pagination {
    bottom: 8% !important;
  }
  #featured-area .info-link-btn {
    margin: 0 auto;
  }
  /* 製品カテゴリー */
  .product-category-box {
    max-width: 500px;
  }
  .product-category-item {
    max-width: 290px;
    width: 47%;
    height: 11em;
    margin: 0 0 4%;
  }
  .product-category-image.desk-rack {
    background: url(/static/images/header_new_2209/sp_icon/icn_desk.png) no-repeat;
  }
  .product-category-image.storage {
    background: url(/static/images/header_new_2209/sp_icon/icn_storage.png) no-repeat;
  }
  .product-category-image.idmg_acc {
    background: url(/static/images/header_new_2209/sp_icon/idmg_acc.png) no-repeat;
  }
  .product-category-image.idmg_yosi {
    background: url(/static/images/header_new_2209/sp_icon/icn_paper.png) no-repeat;
  }
  .product-category-image.input {
    background: url(/static/images/header_new_2209/sp_icon/icn_mouse.png) no-repeat;
  }
  .product-category-image.speaker {
    background: url(/static/images/header_new_2209/sp_icon/icn_speaker.png) no-repeat;
  }
  .product-category-image.lan {
    background: url(/static/images/header_new_2209/sp_icon/icn_lan.png) no-repeat;
  }
  .product-category-image.sp_tab {
    background: url(/static/images/header_new_2209/sp_icon/icn_sp_tab.png) no-repeat;
  }
  .product-category-image.tap {
    background: url(/static/images/header_new_2209/sp_icon/icn_tap.png) no-repeat;
  }
  .product-category-image.cable {
    background: url(/static/images/header_new_2209/sp_icon/icn_cable.png) no-repeat;
  }
  .product-category-image.biz_gy {
    background: url(/static/images/header_new_2209/icn_biz_gy.png) no-repeat;
    height: 47%;
  }
  .product-category-image.search_gy {
    background: url(/static/images/header_new_2209/icn_search_gy.png) no-repeat;
    height: 47%;
  }
  .product-category-image {
    width: 90px;
    height: 90px;
    margin: 7% auto 0 !important;
  }
  #product-category .ad-flyer-block {
    display: block;
    width: 85%;
  }
  .link-btn-category {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 500px;
    width: 85%;
    margin: 4% auto 0;
  }
  .category-item {
    width: 48%;
    margin: 0 0 2%;
    text-align: left;
    padding: 1% 0 1% 4%;
    box-sizing: border-box;
  }
  /* 最新情報・お知らせ */
  .new-news-box {
    width: 90%;
    margin: 1% auto 0;
  }
  .new-news-item .info {
    display: block;
  }
  .new-news-item {
    max-height: 100%;
    padding: 0.95em 1.8em;
    font-size: 0.8375em;
  }
  /* 公式SNS・メールマガジン登録 */
  .sanwa-transition-btn .text {
    font-size: 1em;
  }
}

@media (max-width: 519px) {
  #top-container #top-rotation-banner {
    width: 100%;
    margin: 14px 0 0;
    max-height: 540px;
    height: 42.5vw;
  }
  #top-container #top-rotation-banner .slider-3 .slick-slide .slide-img {
    max-height: 540px;
    height: 43.5vw;
  }
  .slick-dots button {
    width: 10px;
    height: 10px;
  }
  #top-rotation-banner .slick-dots {
    text-align: center;
    margin: 3.6% 0 0;
  }
  /* ニュースリリース・新商品・メディア掲載情報 */
  #info-switching-btn {
    width: 95%;
    margin: 16.5% auto 0;
  }
  #info-switching-btn .switching-btn-item {
    font-size: 0.7375em;
  }
  #info-switching-slides {
    width: 85%;
    margin: 3% auto 0;
  }
  .info-slider .slick-slide {
    margin: 0px 15px;
  }
  .info-slider .slick-slide .slide-img img {
    width: 90%;
    margin: 0 auto;
  }
  .slide-text {
    margin: 6% auto 0;
    font-size: 0.6em;
    line-height: 1.6;
    letter-spacing: 0;
    width: 90%;
  }
  .slide-text .date {
    letter-spacing: -0.05em;
  }
  .slide-text .date .cate {
    padding: 0 6%;
    margin: 0 0 0 1.2em;
    min-width: 30%;
    text-align: center;
  }
  .slide-text .name {
    margin: 5% 0 0;
    line-height: 1.3;
  }
  .info-link-btn {
    width: fit-content;
    min-width: 170px;
    padding: 1.3% 4%;
    font-size: 0.75em;
    margin: 5% auto 0;
  }
  /* 新商品・おすすめ製品のご提案チラシ */
  #ad-flyer {
    background-color: #F5F5F5;
    width: 100%;
    margin: 8% 0 0;
    padding: 5.9% 0;
  }
  #ad-flyer h3 {
    font-size: 0.75em;
  }
  .ad-flyer-block {
    display: block;
    width: 75%;
    margin: 3% auto 0;
  }
  .ad-flyer-block .ad-flyer-item {
    height: 4.4em;
    margin: 0 auto 1em;
  }
  #ad-flyer .ad-flyer-block .ad-flyer-item .right {
    margin: 0 0 0 3%;
    font-size: 0.8em;
  }
  .ad-flyer-block .ad-flyer-item .right .name span {
    margin: 0 0 0 13px;
    padding: 0 6px;
    font-size: 0.75em;
  }
  /* おすすめコンテンツ */
  .introduction-contents h3 {
    font-size: 0.9em;
    text-align: center;
  }
  #osusume-area {
    margin: 6.6% auto 0;
    padding: 0 0 8%;
    height: auto;
  }
  /* 注目製品 */
  #featured-area {
    margin-top: 7.7%;
    padding-bottom: 7.7%;
  }
  /* 対応情報 */
  #supported-information {
    margin-top: 7.9%;
    padding-bottom: 10%;
    border-bottom: 1px solid #D9D9D9;
  }
  #supported-information .supported-important-list {
    margin: 4.5% auto 0;
    text-align: center;
    font-size: 0.6em;
    font-weight: bold;
  }
  #supported-information .supported-important-list .icon {
    display: inline-block;
    color: #004DA2;
  }
  #supported-information .supported-important-list .text {
    display: inline-block;
    vertical-align: middle;
  }
  #supported-information .supported-important-list .deta {
    margin-right: 1em;
  }
  .supported-information-link {
    margin: 6% auto 0;
    width: 80%;
  }
  .supported-information-item {
    display: block;
    width: 27%;
    text-align: center;
    margin: 0 0 7%;
  }
  .supported-information-image {
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;
  }
  .supported-information-image {
    display: block;
    width: 100%;
    height: auto;
  }
  .supported-information-text {
    font-size: 0.85em;
    font-weight: bold;
    margin: 7% 0 0;
  }
  .new-icon::after {
    width: 30px;
    height: 30px;
  }
  /* 製品カテゴリ別の対応情報 */
  #supported-category-product .supported-information-item {
    display: block;
    width: 27%;
    text-align: center;
    margin: 0 0 7%;
  }
  /* 動画でご紹介 */
  #video-introduction-area {
    margin: 7.4% auto 0;
    border-bottom: 0;
  }
  /* 製品カテゴリー */
  #product-category {
    margin: 10% 0 0;
    padding: 8% 0 5%;
    background: #F5F5F5;
  }
  .product-category-box {
    width: 88%;
    margin: 4.3% auto 0;
  }
  .product-category-item {
    max-width: 290px;
    width: 47%;
    height: 7.6em;
    margin: 0 0 4%;
  }
  .product-category-image {
    width: 50px;
    height: 50px;
    margin: 10% auto 0 !important;
  }
  .product-category-text {
    text-align: center;
    font-size: 0.75em;
    font-weight: bold;
    margin: 14.5% 0 0;
  }
  .product-category-text.two-row {
    margin: 9.5% 0 0;
  }
  .product-category-image.icon {
    width: 31.9%;
  }
  .product-category-image.biz_gy {
    height: 35%;
  }
  .product-category-image.search_gy {
    height: 35%;
  }
  #product-category .info-link-btn {
    margin-top: 3%;
  }
  /* 最近チェックした製品 */
  .product_checked_recently-slide {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
  }
  #product_checked_recently .info-slider .slick-arrow {
    display: none !important;
  }
  /* 公式SNS・メールマガジン登録 */
  .sanwa-transition-btn .text {
    font-size: .9em;
  }
}
