/*---------------
reset
---------------*/
*:where(:not(html,iframe,canvas,img,svg,video,audio):not(svg*,symbol*)){all:unset;display:revert}*,*::before,*::after{box-sizing:border-box}
*{margin: 0; padding: 0; text-rendering: optimizeLegibility;}
html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none;scroll-behavior: smooth;}
a{transition: .3s; text-decoration:none;}
a,button{cursor:revert}
ol,ul,menu,summary{list-style:none}
img{display: block;}
table{border-collapse:collapse;}
input,textarea{-webkit-user-select:auto}
textarea{white-space:revert}
meter{-webkit-appearance:revert;appearance:revert}:where(pre){all:revert;box-sizing:border-box}::placeholder{color:unset}:where([hidden]){display:none}:where([contenteditable]:not([contenteditable="false"])){-moz-user-modify:read-write;-webkit-user-modify:read-write;overflow-wrap:break-word;-webkit-line-break:after-white-space;-webkit-user-select:auto}:where([draggable="true"]){-webkit-user-drag:element}:where(dialog:modal){all:revert;box-sizing:border-box}
:root{--black: #010101;--blue: #3fc8d4;--gray: #515151;--white: #fff;}

/*---------------
body
---------------*/
body{
    font: 400 normal 1.6em dnp-shuei-gothic-kin-std, sans-serif;
    line-height:1em;
}
#breadcrumb{
  padding:134px 0 0 0;
}

/*---------------
header
---------------*/
#header{
  width:100%;
  position:fixed;
  z-index:9;
  background:#fff;
}
@media (max-width: 814px) {
  #header{
    width:100%;
    position:relative;
    z-index:9999;
    background:#fff;
  }
  #breadcrumb{
    padding:0 0 0 0;
  }
}
header {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding: 15px 30px 15px 30px;
}

@media (max-width: 960px) {
  header {
    padding: 15px 5vw 15px 5vw;
  }
}

header > div img {
  width: 355px;
}

@media (max-width: 980px) {
  header > div img {
    width: 45vw;
    max-width: 255px;
  }
}

header > div ul {
  width: auto;
}

header > div ul li {
  align-items: center;
  display: flex;
  margin: 0 0 0 20px;
}

@media (max-width: 814px) {
  header > div ul li {
    display: none;
  }
}

header > div ul li:first-child a {
  font-size: 12px;
  color: #000;
  padding: 0 0 0 20px;
  background: url(/assets/img/icon-pin.svg) no-repeat 0 50%;
  background-size: 11px;
  position: relative;
}

header > div ul li:first-child a:hover {
  color: #888;
}

header > div ul li:nth-child(2) a {
  font-size: 12px;
  color: #000;
  padding: 0 0 0 20px;
  background: url(/assets/img/icon-mypage.svg) no-repeat 0 50%;
  background-size: 11px;
  position: relative;
}

header > div ul li:nth-child(2) a:hover {
  color: #888;
}

header > div ul li img {
  width: 24px;
  margin: 0 12px 0 0;
}

header > div ul li address {
  font: 300 normal 20px aktiv-grotesk-condensed, sans-serif;
  border-bottom: 1px dotted #5d5d5d;
  letter-spacing: 0.1em;
}

@media (max-width: 814px) {
  header > div ul li:last-child {
    display: block;
  }
}

header > div ul li:last-child a {
  background: #272727;
  padding: 8px 35px;
  color: #fff;
  font-size: 12px;
  border-radius: 4px;
  display: inline-block;
  line-height: 1em;
}

header > div ul li:last-child a:hover {
  transform: scale(1.1);
  background: #000;
}

/*---------------
global-navigation
---------------*/
body > div > nav {
  max-width: 1240px;
  margin: 0 auto;
  align-items: center;
  padding: 0 60px 16px 60px;
}

body > div > nav ul {
  gap: 30px;
}

@media (max-width: 960px) {
  body > div > nav ul {
    display: none!important;
  }
}

body > div > nav ul li {
  line-height: 0;
}

body > div > nav ul li a {
  font: 500 16px 'Chillax', sans-serif;
  text-decoration: none;
  font-weight: 400;
  color: #000;
  position: relative;
}

body > div > nav ul li a:hover {
  color: #888;
}

body > div > nav ul li a:hover:after {
  width: 100%;
}

body > div > nav ul li a:after {
  content: '';
  display: block;
  position: absolute;
  bottom: -20px;
  left: 0;
  margin: auto;
  justify-content: center;
  height: 1px;
  background-color: #888;
  transition: width 300ms;
  width: 0;
}

/*---------------
footer
---------------*/
#footer-banner{
  width:94vw;
  max-width:1440px;
  margin: 0 auto;
  padding:50px 0 50px 0;
}
#footer-banner li{
  width:23%;
}
@media (max-width: 960px) {
  #footer-banner li{
    width:45%;
    margin:40px auto 0 auto;
  }
}
@media (max-width: 480px) {
  #footer-banner li{
    width:85%;
    margin:40px auto 0 auto;
  }
}
#footer-banner li a{
  display:block;
}
#footer-banner li a img{
  transform: scale(1);
  transition: .3s;
}
#footer-banner li a:hover img{
  border:1px solid #c3c9d0;
  transform: scale(1.05);
}

#footer-banner li span{
  font-size:20px;
  font-weight:600;
  color:#000;
  padding:15px 0 10px 0;
  display:inline-block;
}
#footer-banner li p{
  font-size:15px;
  color:#000;
}
#footer-banner li img{
  width: 100%;
  border: 1px solid #dce1e6;
  border-radius:5px;
}
#footer-nav{
  background:#f9fafb;
}
#footer-nav > div{
  width:94vw;
  max-width:1440px;
  margin: 0 auto;
  padding:50px 0 35px 0;
}
.footer-brand h6{
  width:100%;
  position: relative;
  margin:0 0 30px 0;
}
@media (max-width: 480px) {
  .footer-brand h6{
    width:85vw;
    position: relative;
    margin:0 0 30px 0;
    padding: 0 4.5vw 0 6.5vw;
  }
}
.footer-brand h6:before{
  content:"";
  width:calc(100% - 12em);
  height:1px;
  background: #dce1e6;
  position:absolute;
  top:50%;
  right:0;
}
@media (max-width: 480px) {
  .footer-brand h6:before{
    content:"";
    width:calc(85vw - 12em);
    height:1px;
    background: #dce1e6;
    position:absolute;
    top:50%;
    right:7.5vw;
  }
}
.footer-brand h6 a{
  widht:300px;
  display:inline-block;
  color:#000;
  position: relative;
  padding:0 1.2em 0 0;
}
.footer-brand h6 a:before{
  content:"";
  width:12px;
  height:12px;
  background: url(/assets/img/icon-link.svg) no-repeat;
  background-size:12px;
  position:absolute;
  right:0;
  top:50%;
  margin:-5px 0 0 0;
}
.footer-brand ul{
  flex-wrap: nowrap;
  padding: 0 0 50px 0;
}
.footer-brand ul li{
  width:15%;
}
.footer-brand ul li a{
  width: 100%;
  display: block;
  border: 1px solid #dce1e6;
  border-radius:5px;
}
.footer-brand ul li a:hover{
  transform: scale(1.1);
  border:1px solid #c3c9d0;
}
.footer-brand ul li img{
  width:100%;
  border-radius:5px;
}
@media (max-width: 960px) {
  .footer-brand ul{
    flex-wrap: wrap;
  }
  .footer-brand ul li{
    width:48%;
    margin:20px 0 0 0;
  }
  .footer-brand h6{
    width:100%;
    position: relative;
    margin:0 0 10px 0;
  }
}
@media (max-width: 480px) {
  .footer-brand ul li{
    width:85%;
    margin:20px auto 0 auto;
  }
}

.footer-nav{
  @media (max-width: 960px) {
    display:none;
  }
}
.footer-nav ul{
  border-top: 1px solid #dce1e6;
  padding:30px 0 0 0;
}
.footer-nav li{
  margin: 0 60px 0 0;
}
.footer-nav li a{
  font-size:17px;
  color:#000;
  position: relative;
  padding: 0 20px 0 0;
}
.footer-nav li a:hover{
  color:#b2b2b2;
}
.footer-nav li a:before{
  content:"";
  width:12px;
  height:12px;
  background: url(/assets/img/icon-link.svg) no-repeat;
  background-size:12px;
  position:absolute;
  right:0;
  top:50%;
  margin:-6px 0 0 0;
}
footer{
  width: 100%;
  background:#0d0d0e;
  padding:25px 0 25px 0;
  @media (max-width: 960px) {
    padding:50px 0 50px 0;
  }
}
footer > div{
  width:94vw;
  margin: 0 auto;
  align-items: center;
}
footer > div > div:nth-child(1){
  @media (max-width: 960px) {
    width:100%;
  }
}
footer > div > div:nth-child(1) p{
  font: 600 normal 16px dnp-shuei-gothic-kin-std, sans-serif;
  color:#fff;
  @media (max-width: 960px) {
    width:100%;
    text-align:center;
  }
}
footer > div > div:nth-child(2){
  @media (max-width: 960px) {
    width:100%;
  }
}
footer > div > div:nth-child(2) > div > div:nth-child(1){
  align-items: center;
}
footer > div > div:nth-child(2) > div > div:nth-child(1) ul{
  @media (max-width: 960px) {
    width:100%;
    justify-content:center;
    padding:0px 0 40px 0;
  }
}
footer > div > div:nth-child(2) > div > div:nth-child(1) ul li{
  padding:0 10px 0 10px;
  @media (max-width: 960px) {
    order:2;
  }
}
footer > div > div:nth-child(2) > div > div:nth-child(1) ul li a{
  color:#fff;
  font-size:14px;
  display:block;
}
footer > div > div:nth-child(2) > div > div:nth-child(1) ul li:last-child{
  padding:0 40px 0 20px;
  margin:0 0 0 10px;
  position:relative;
  @media (max-width: 960px) {
    width:100%;
    justify-content:center;
    text-align:center;
    padding:0 20px 0 20px;
    margin:0 0 20px 0;
    order:1;
    a{
      border:1px solid #595959;
      border-radius:5px;
      margin:30px 0 0 0;
      padding:30px 40px 30px 40px;
      font-size:18px;
      display:inline-block;
    }
  }
}
footer > div > div:nth-child(2) > div > div:nth-child(1) ul li:last-child:before{
    content:"";
    width:2px;
    height:20px;
    border-left:1px dotted #fff;
    position:absolute;
    top:50%;
    left:0;
    margin:-10px 0 0 0;
}
@media (max-width: 960px) {
  footer > div > div:nth-child(2) > div > div:nth-child(1) ul li:last-child:before{
    border-left:none;
  }
}
footer > div > div:nth-child(2) > div > div:nth-child(1) ul li{
  a{
    position: relative;
    &:hover{
      color:#b2b2b2;
      &:after{
        width: 100%;
      }
    }
    &:after{
      content: '';
      display: block;
      position: absolute;
      bottom: -6px;
      left: 0;
      margin: auto;
      justify-content: center;
      height: 1px;
      background-color: #5d5d5d;
      transition: width 300ms;
      width: 0;
    }
  }
}
footer > div > div:nth-child(2) > div > div:nth-child(1) > div{
  align-items:center;
  @media (max-width: 960px) {
    width:100%;
  }
}
footer > div > div:nth-child(2) > div > div:nth-child(1) > div:nth-child(1){
  @media (max-width: 960px) {
    order:2;
  }
}
footer > div > div:nth-child(2) > div > div:nth-child(1) > div:nth-child(2){
  @media (max-width: 960px) {
    justify-content:center;
    padding:30px 0 0 0;
  }
}
footer > div > div:nth-child(2) > div > div:nth-child(1) img{
  width:24px;
  margin:0 12px 0 0;
  filter: invert(99%) sepia(1%) saturate(3529%) hue-rotate(229deg) brightness(115%) contrast(100%);
}
footer > div > div:nth-child(2) > div > div:nth-child(1) address{
  font: 300 normal 20px aktiv-grotesk-condensed, sans-serif;
  color:#fff;
  border-bottom:1px dotted #5d5d5d;
  letter-spacing:0.1em;
  @media (max-width: 960px) {
    font: 300 normal 30px aktiv-grotesk-condensed, sans-serif;
  }
}
footer > div > div:nth-child(2) > div > div:nth-child(2) small{
  font: 400 normal 10px dnp-shuei-gothic-kin-std, sans-serif;
  display:block;
  text-align:right;
  color:#c4c4cc;
  margin:20px 0 0 0;
  @media (max-width: 960px) {
    width:100%;
    text-align:center;
  }
}

/*---------------
breadcrumb
---------------*/
#breadcrumb{
  background:#f1f4f7;
}
#breadcrumb ul{
  width:94vw;
  max-width:1440px;
  margin: 0 auto;
  padding:6px 0 4px 0;
  display:flex;
}
@media (max-width: 480px) {
  #breadcrumb ul{
    overflow-x: scroll;

    /* テキストを改行しないようにする */
    word-break: keep-all;
    white-space: nowrap;
  }
}
#breadcrumb ul li{
  color:#000;
  font-size:13px;
  position:relative;
  margin: 0 17px 0 0;
}
#breadcrumb ul li:after{
  content:"　　>";
  font-size:10px;
  vertical-align:1px;
}
#breadcrumb ul li:last-child:after{
  content:"";
}
#breadcrumb ul li a{
  font-size:13px;
  color:#000;
  display:inline-block;
  font-weight:500;
}
#breadcrumb ul li a:hover{
  color:#888;
}
#breadcrumb ul li span{
  width: 30em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/*---------------
itemsearch
---------------*/
#itemsearch{
  padding:13px 0 13px 0;
  background:#f9fafb;
  border-bottom: 1px solid #d5dae0;
}
#itemsearch > form > div{
  align-items: center;
  width:94vw;
  margin: 0 auto;
  max-width:1440px;
}
.titlesearch{
  width:110px;
}
.titlesearch p{
  font-size:15px;
  padding: 0 0 0 20px;
  background: url(/assets/img/icon-search.png) 0 50% no-repeat;
  background-size:13px;
}
#itemsearch select{
  position: relative;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background:#fff;
  padding:10px 30px 10px 10px;
  margin:0 10px 0 0;
  border:1px solid #d5dae0;
  border-radius:4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#brandsearch select{
  width: 20em;
}
#categorysearch select{
  width: 25em;
}
#featuresearch select{
  width: 25em;
}
.serch-style {
  position: relative;
}
.serch-style:after {
  content: "";
  position: absolute;
  right: 20px;
  top: 50%;
  margin:-1px 0 0 0;
  width: 6px;
  height: 6px;
  border-top: 1px solid #000;
  border-left: 1px solid #000;
  pointer-events: none;
  transform: translateY(-50%) rotate(-135deg);
}
.btnsearch input{
  padding:11px 20px 11px 20px;
  background:#000;
  border:none;
  color:#fff;
  border-radius:3px;
  transition: .3s;
}
.btnsearch input:hover{
  background:#888;
}
@media (max-width: 1240px) {
  #itemsearch{
    padding:30px 0 30px 0;
  }
  #itemsearch select{
    width:calc(94vw - 40px);
    margin:15px 0 10px 0;
  }
  #brandsearch select{
    width:calc(94vw);
    margin:15px 0 10px 0;
  }
  #categorysearch select{
    width:calc(94vw);
    margin:15px 0 10px 0;
  }
  #featuresearch select{
    width:calc(94vw);
    margin:15px 0 10px 0;
  }
  .btnsearch input{
    width:calc(94vw);
    margin:15px 0 10px 0;
  }
  .serch-style:after {
    margin:3px 0 0 0;
  }
}

/*---------------
keywordsearch
---------------*/
#keywordsearch{
  align-items: center;
  width:94vw;
  max-width:1080px;
  margin: 0 auto;
  background:#f1f4f7;
  border:1px solid #d5dae0;
  border-radius:3px;
  padding:20px;
}
#keywordsearch p{
  font-size:15px;
  padding: 0 0 0 20px;
  background: url(/assets/img/icon-search.png) 0 50% no-repeat;
  background-size:13px;
}
#box-keyword input{
  position: relative;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background:#fff;
  padding:10px 30px 10px 10px;
  margin:0 10px 0 0;
  border:1px solid #d5dae0;
  width:50em;
  border-radius:4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#box-keyword input::placeholder {
  color: #bbb;
}

@media (max-width: 960px) {
}
@media (max-width: 1240px) {
  #box-keyword input{
    width:calc(1080px - 40px);
    margin:10px 0 0 0;
  }
  #keywordsearch .btnsearch input{
    width:calc(1080px - 40px);
    margin:15px 0 10px 0;
  }
}
@media (max-width: 1080px) {
  #box-keyword input{
    width:calc(94vw - 40px);
  }
  #keywordsearch .btnsearch input{
    width:calc(94vw - 40px);
  }
}

/*---------------
section h2
---------------*/
section{
  background:#f9fafb;
  padding:0 0 120px 0;
}
section h2{
  width:94vw;
  max-width:1080px;
  margin: -120px auto 0 auto;
  padding:200px 0 20px 0;
}
section h2 span{
  position:relative;
  font-size:26px;
  display:block;
  padding:0 0 20px 30px;
}
section h2 span:before{
  content:"";
  width:3px;
  height:40px;
  background:#000;
  position:absolute;
  top:50%;
  left:0;
  margin:-30px 0 0 0;
}
section h2 span:after{
  content:"";
  width:100%;
  height:1px;
  background:#d5dae0;
  position:absolute;
  bottom:0;
  left:0;
}
@media (max-width: 960px) {
  section h2 span{
    text-align:center;
    padding:0 0 20px 0;
  }
  section h2 span:before{
    content:"";
    width:40px;
    height:3px;
    background:#000;
    position:absolute;
    top:0;
    left:50%;
    margin:-30px 0 0 -20px;
  }
  section h2 span:after{
    content:none;
  }
}


/*---------------
address
---------------*/
address{
  font: 400 normal 30px aktiv-grotesk-condensed, sans-serif;
}

/*---------------
main
---------------*/
main:not(#top){
  width: 90vw;
  margin: 0 auto;
  padding: 90px 0 147px 0;
  @media (max-width: 834px) {
    width: 100vw;
  }
}
main:not(#top) section{
  padding: 90px 10vw 90px 10vw;
  background: #fff;
  border-radius: 50px;
  @media (max-width: 834px) {
    padding: 90px 6vw 90px 6vw;
  }
}

/*---------------
Layout
---------------*/
.box-fl{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.box-st{
  display: flex;
  justify-content: start;
  flex-wrap: wrap;
  align-items:center;
}

/*---------------
Module
---------------*/
.button{
  font: 400 15px 'Chillax', sans-serif;
  margin:-10px 0 0 0;
  text-decoration: none;
  display: inline-block;
  padding: 8px 50px 8px 50px;
  color: #000;
  background: #fff;
  border: 8px solid #efeded;
  border-radius: 35px;
  box-shadow: inset 0 0 3px rgba(0,0,0,.35);
  transition: .3s;
  &:hover{
    color: #fff;
    background: #000;
    border-color: #292b35;
    transform:scale(1.15,1.15);
  }
}
.update-list{
  background: #f4f4f4;
  border-radius: 6px;
  padding: 15px 40px 13px 35px;
  @media (max-width: 576px) {
    padding: 15px 20px 13px 20px;
  }
  li{
    font-size: 15px;
    position: relative;
    padding: 5px 0 5px 14px;
    text-align: justify;
    line-height: 1.4em;
    &:before{
      content: "";
      width: 5px;
      height: 5px;
      border-radius: 100%;
      background: var(--blue);
      position: absolute;
      left: 0;
      top: 13px;
    }
  }
}
.btn-group-control {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;

    .page-back {
        &.page-forward {
            a {
                padding: 0 38px 0 0;
                &:before{
                    right: 0;
                    left: unset;
                }

                &:after{
                    right: -1px;
                    left: unset;
                    transform: rotate(45deg);
                }

                &:hover {
                    &:before{
                        right: -3px;
                    }
                    &:after {
                        right: -4px;
                    }
                }
            }
        }
    }

}
.page-back{
  padding:40px 0 80px 0;
  text-align:center;
  @media (max-width: 834px) {
    text-align: center;
    margin: 0 0 0 -25px;
  }
  a{
    text-decoration: none;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    transition: .3s;
    padding: 0 0 0 38px;
    position: relative;
    &:before{
      content: "";
      width: 26px;
      height: 1px;
      background: #000;
      position: absolute;
      bottom: 2px;
      left: 0;
      transition: .3s;
    }
    &:after{
      content: "";
      width: 10px;
      height: 1px;
      background: #000;
      position: absolute;
      bottom: 6px;
      left: -1px;
      transform: rotate(-45deg);
      transition: .3s;
    }
    &:hover{
      color:#888;
      &:before{
        left: -3px;
      }
      &:after{
        content: "";
        width: 10px;
        height: 1px;
        background: #000;
        position: absolute;
        bottom: 6px;
        left: -4px;
        transform: rotate(-45deg);
      }
    }
  }
}

.page-back-small{
  width:94vw;
  max-width:1080px;
  margin: 0 auto;
  text-align:left;
  & span{
    border-bottom:1px dotted #888;
    padding:0 0 5px 0;
    margin:0 30px 0 0;
  }
  & a{
    text-decoration: none;
    color: #000;
    font-size: 12px;
    font-weight: 600;
    transition: .3s;
    padding: 0 0 0 20px;
    position: relative;
    &:before{
      content: "";
      width: 5px;
      height: 1px;
      background: #000;
      position: absolute;
      top: 50%;
      left: -1px;
      margin:1px 0 0 0;
      transform: rotate(45deg);
      transition: .3s;
    }
    &:after{
      content: "";
      width: 5px;
      height: 1px;
      background: #000;
      position: absolute;
      top: 50%;
      left: -1px;
      margin:-2px 0 0 0;
      transform: rotate(-45deg);
      transition: .3s;
    }
    &:hover{
      color:#888;
      &:before{
        left: -3px;
      }
      &:after{
        bottom: 6px;
        left: -4px;
      }
    }
  }
}

@media (max-width: 480px) {
  .page-back-small{
    margin: 20px auto;
  }
}
/*---------------
menu
---------------*/
.menu-container {
  position: fixed;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index:10;
}
.menu-button {
  width: 40px;
  height: 40px;
  background: #000;
  display: block;
  position: fixed;
  top: 50%;
  left: 20px;
  cursor: pointer;
  z-index: 2;
  border-radius:100%;
  margin: -20px 0 0 0;
  transition: .3s;
  @media (max-width: 834px) {
    top: calc(100lvh - 5vw - 20px);
    left: calc(5vw);
  }
}
.menu-button:hover{
  transform:scale(1.25,1.25);
}
.menu-button div{
  position: relative;
  width: 41px;
  height: 41px;
}
.menu-button div span{
  display: block;
  width: 15px;
  height: 1px;
  background-color: #fff;
  transition: 0.4s;
}
.menu-button div span:nth-child(1){
  position: absolute;
  right: 9px;
  top: 50%;
  margin: -2px 0 0 0;
}
.menu-button div span:nth-child(2){
  position: absolute;
  left: 9px;
  top: 50%;
  margin: 2px 0 0 0;
}
.menu-button div span:nth-child(3){
  position: absolute;
  left: 9px;
  top: 50%;
  margin: 2px 0 0 0;
}
.menu-button:hover span:nth-child(1) {
  width: 18px;
  top: 50%;
  left: 11px;
  margin: -1px 0 0 0;
}
.menu-button:hover span:nth-child(2) {
  transform: rotate(45deg) translate(8px, -13px);
  width: 10px;
  left: 7px;
  top: 50%;
  margin: -1px 0 0 0;
}
.menu-button:hover span:nth-child(3) {
  transform: rotate(-45deg) translate(-2px, 3px);
  width: 10px;
  left: 21px;
  top: 50%;
  margin: -1px 0 0 0;
}
#menu-toggle:checked ~ .menu-button span:nth-child(1) {
  width: 18px;
  top: 50%;
  left: 12px;
  margin: -1px 0 0 0;
}
#menu-toggle:checked ~ .menu-button span:nth-child(2) {
  transform: rotate(-45deg) translate(8px, -13px);
  width: 10px;
  left: 13px;
  top: 50%;
  margin: 10px 0 0 0;
}
#menu-toggle:checked ~ .menu-button span:nth-child(3) {
  transform: rotate(45deg) translate(-2px, 3px);
  width: 10px;
  left: 13px;
  top: 50%;
  margin: 2px 0 0 0;
}
#menu-toggle {
  display: none;
}
.menu {
  position: fixed;
  top: 0;
  left: -120%;
  width: 100%;
  height: 100%;
  background: #f0f0f0;
  transition: 0.7s;
  z-index: 1;
  overflow-y: auto;
  transform: scale(1.2);
  border-radius: 0 100% 100% 0;
  @media (max-width: 576px) {
    border-radius: 0 100% 0 0;
  }
}
#menu-toggle:checked ~ .menu {
  left: 0;
  transform: scale(1);
  border-radius: 0 0 0 0;
}
.menu ul {
  list-style: none;
  padding: 60px 20px 60px 120px;
  display:flex;
  flex-flow: column;
  justify-content:space-around;
  height: 100dvh;
  @media (max-width: 576px) {
    padding: 20vw 0 20vw 18vw;
  }
  li{
    line-height: 1.06em;
    a{
      font-size: 24px;
      background: linear-gradient(135deg, #333 0%, #333 100%);
          background: -webkit-linear-gradient(-45deg, #333 0%, #333 100%);
          -webkit-background-clip: text;
          -webkit-text-fill-color: transparent;
      font-weight: 600;
      transition: .3s;
      text-decoration: none;
      &:before{
        content: "/";
      }
      &:hover{
        background: linear-gradient(135deg, #000 0%, #333 100%);
          background: -webkit-linear-gradient(-45deg, #000 0%, #333 100%);
          -webkit-background-clip: text;
          -webkit-text-fill-color: transparent;
        letter-spacing: 0.1em;
      }
    }
  }
}
.page-title_big{
  line-height: 1em;
  font-weight: 600;
  display: block;
  padding: 0 0 20px 0;
  margin: 0 0 0 -2px;
  @media (max-width: 576px) {
    font-size: 8vw;
  }
}
.page-title_sub{
  font-size: 14px;
  font-weight: 600;
  line-height: 1em;
  display: block;
  padding: 0 0 60px 0;
}
.cont-title_sub{
  font-size: 14px;
  font-weight: 600;
  line-height: 1em;
  padding: 0 0 0 0;
}
.cont-title_sub > div:nth-child(2){
  @media (max-width: 740px) {
    display:none;
  }
}
.cont-title_sub p{
  font: 400 26px 'Chillax', sans-serif;
  padding: 3px 40px 2px 0;
  background-image : linear-gradient(to bottom, #000, #000 2px, transparent 2px, transparent 6px);
  background-size: 2px 6px;
  background-position: right bottom;
  background-repeat: repeat-y;
  line-height: 1.1em;
  @media (max-width: 576px) {
    font: 400 26px 'Chillax', sans-serif;
    padding: 0 20px 0px 0;
    line-height: 1em;
  }
}
.cont-title_sub span{
  display:block;
  font-size:18px;
  padding:10px 0 0 30px;
  font-weight:400;
  @media (max-width: 576px) {
    font-size:14px;
    padding:6px 0 0 15px;
  }
}
.area-center{
  text-align: center;
}

/*---------------
sub-contact
---------------*/
.sub-contact{
  position: fixed;
  right:0;
  top:50%;
  z-index:5;
  margin:-65px 0 0 0;
}
.sub-contact > div{
  position:relative;
}
.sub-contact > div > div{
  position: relative;
}
.sub-contact > div > div img{
  width:30px;
  display:inline;
  vertical-align:-10px;
  margin:-3px 10px 0 0;
}
.sub-contact > div:nth-child(1) div a{
  font-size:14px;
  display:block;
  background:#000;
  color:#fff;
  width:210px;
  padding:17px 20px 13px 16px;
  border-radius:5px 0 0 5px;
  position:absolute;
  right:-153px;
}

.sub-contact > div:nth-child(1) div a:hover{
  right:0;
}
.sub-contact > div:nth-child(2) div a{
  font-size:14px;
  display:block;
  background:#1dbb7e;
  color:#fff;
  width:210px;
  padding:17px 20px 13px 16px;
  border-radius:5px 0 0 5px;
  position:absolute;
  top:58px;
  right:-153px;
}
.sub-contact > div:nth-child(2) div a:hover{
  right:0;
}


/*---------------
products-top
---------------*/
#products-top{
}
#products-top ul{
  width:94vw;
  max-width:1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(
    auto-fill,
    minmax(22.5%, 1fr)
  );
  column-gap: 25px;
  row-gap: 25px;
}
#products-top ul li{
}
#products-top ul li .products-top-list{
  position:relative;
  background:#fff;
  height:144px;
  border: 1px solid #dce1e6;
  border-radius:5px;
  display:flex;
  justify-content: center;
  align-items: center;
}
#products-top li a img{
  display:inline-block;
  width: auto;
  margin: 0 auto;
  max-height:144px;
  z-index:0;
  position: relative;
  padding:20px;
}
#products-top ul li a div:before{
  content:"";
  width:12px;
  height:12px;
  background: url(/assets/img/icon-link.svg) no-repeat;
  background-size:12px;
  position:absolute;
  bottom:10px;
  right:10px;
  margin:-6px 0 0 0;
  z-index:1;
}
#products-top li a div{
  transform: scale(1);
  transition: .3s;
}
#products-top li a:hover div{
  border:none;
  transform: scale(1.05);
  position:relative;
  border:1px solid #dce1e6;
}

#products-top li span{
  line-height:1.3em;
}
#products-top li span.tag-brand{
  font-size:17px;
  font-weight:600;
  display:block;
  padding:10px 0 2px 2px;
}
#products-top li span.products-category{
  font-size:15px;
  font-weight:600;
  color:#000;
  display:block;
  padding:0 0 0 2px;
  letter-spacing:-0.5px;
}
#products-top li p{
  font-size:15px;
  color:#000;
  padding:5px 0 0 0;
  line-height:1.5em;
}

@media (max-width: 980px) {
  #products-top ul{
    grid-template-columns: repeat(
      auto-fill,
      minmax(30%, 1fr)
    );
  }
}
@media (max-width: 768px) {
  #products-top ul{
    grid-template-columns: repeat(
      auto-fill,
      minmax(40%, 1fr)
    );
  }
}
@media (max-width: 576px) {
  #products-top ul{
    grid-template-columns: repeat(
      auto-fill,
      minmax(100%, 1fr)
    );
  }
}

/*---------------
result-keywordsearch
---------------*/

#result-keywordsearch ul{
  width:94vw;
  max-width:1080px;
  margin: 0 auto;
}
#result-keywordsearch > p{
  color:#888;
  font-size:17px;
  text-align:center;
  padding:0 0 80px 0;
}
#result-keywordsearch > p span{
  color:#000;
  padding:0 0 0 20px;
}
#result-keywordsearch li{
  margin: 0 0 20px 0;
  padding:20px 0 0 0;
  border-top: 1px solid #dce1e6;
}
#result-keywordsearch li a{
  color:#000;
}
#result-keywordsearch li span{
  font-size:14px;
}
#result-keywordsearch li span.products-model{
  font-size:20px;
  display:block;
  font-weight:600;
}
#result-keywordsearch li p{
  font-size:16px;
}
#result-keywordsearch li a:hover p{
  color:#888;
  text-decoration: none;
}
@media (max-width: 980px) {
  #result-keywordsearch > p span{
    color:#000;
    padding:0 0 0 0;
    display:block;
  }
}

/*---------------
news-top
---------------*/
#news{
  width:94vw;
  max-width:1080px;
  margin: 0 auto;
}
#news input {
  display: none;
}
#news{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#news label {
  width:calc(210px - 10px);
    text-align:center;
    margin:10px 0 0 0;
    font-size:14px;
    padding:13px 0 13px 0;
    margin:0 1px 0 1px;
    background:#fff;
    border:1px solid #dce1e6;
  display: block;
  cursor: pointer;
  order: -1;
  font-weight:600;
}
@media (max-width: 1080px) {
  #news label {
    width:calc(19vw - 10px);
    text-align:center;
    margin:10px 0 0 0;
    font-size:14px;
    padding:13px 0 13px 0;
    margin:0 1px 0 1px;
    background:#fff;
    border:1px solid #dce1e6;
  }
}
#news .content {
  display: none;
  width: 100%;
}
#news .inner {
  opacity: 0;
}
#news input:checked + .btn_tab {
  background: #888;
  color:#fff;
}
#news input:checked + .btn_tab + .content {
  display: block;
}
#news input:checked + .btn_tab + .content .inner {
  animation: fadeIn 1.5s forwards;
}
#news ul{
  margin: 20px 0 0 0;
}
#news li{
  padding:10px 0 10px 0;
}
#news a{
  display: block;
  background:#fff;
  padding:20px 40px 20px 40px;
  border-radius:5px;
  border:1px solid #f0f0f0;
}
#news a div{
  color:#000;
}
#news a time{
  display:inline-block;
  width:110px;
  font-size:13px;
}
#news a span{
  width:140px;
  display:inline-block;
  background:#000;
  color:#fff;
  text-align:center;
  font-size:11px;
  padding:0 20px 0 20px;
}
#news a p{
  font-size:17px;
  color:#000;
  margin:3px 0 0 0;
  text-align:left;
}
@media (max-width: 1080px) {
  #news a p{
    width:100%;
    margin:10px 0 0 0;
  }
}
@keyframes fadeIn {
  0% { opacity: 0;}
  100% { opacity: 1;}
}

/*---------------
news-detail
---------------*/
#news-detail{
  width:94vw;
  max-width:1080px;
  margin: 0 auto;
}
#news-detail > div{
  display:flex;
  justify-content: start;
  padding:30px 0 20px 0;
}
#news-detail div.news-img{
  width:180px;
  margin:0 80px 0 0;
}
#news-detail div.news-img img{
  width:100%;
  min-width:180px;
  display:block;
  margin:0 auto;
}
#news-detail div.news-caption p{
  font-size:18px;
  line-height:1.8em;
}
#news-detail time{
  display:inline-block;
  width:110px;
  font-size:13px;
}
#news-detail span{
  width:140px;
  display:inline-block;
  background:#000;
  color:#fff;
  text-align:center;
  font-size:11px;
  padding:1px 20px 1px 20px;
}
#news-detail h3{
  font-size:22px;
  color:#000;
  margin:10px 0 0 0;
  line-height:1.4em;
}
#news-detail ul{
  padding:20px 0 0 0;
}
#news-detail ul li{
  margin:0 50px 0 0;
}
#news-detail ul li a{
  color:#000;
  font-size:18px;
  font-weight:600;
  position:relative;
  padding:0 20px 0 0;
}
#news-detail ul li a:before{
  content:"";
  width:12px;
  height:12px;
  background: url(/assets/img/icon-link.svg) no-repeat;
  background-size:12px;
  position:absolute;
  top:50%;
  right:0;
  margin:-6px 0 0 0;
  z-index:1;
}
#news-detail ul li a:hover{
  color:#888;
}
@media (max-width: 480px) {
  #news-detail > div{
    flex-wrap:wrap;
  }
  #news-detail div.news-img{
    width:100%;
    margin:0 0 40px 0;
  }
  #news-detail div.news-img img{
    width:100%;
    display:block;
    margin:0 auto;
  }
  #news-detail div.news-caption p{
    width:100%;
    font-size:18px;
    line-height:1.8em;
  }
  #news-detail ul{
    padding:0 0 0 0;
  }
  #news-detail ul li{
    margin:30px 0 0 0;
  }
}

/*---------------
ブランド別
---------------*/
.color-hengstler{
  color:#ba000b;
}
.color-gems{
  color:#02b190;
}
.color-thomson{
  color:#1b437e;
}
.color-setra{
  color:#1c57cf;
}
.color-anderson-negele{
  color:#6ccf1c;
}
.color-namco{
  color:#ee3a43;
}
.products-namco .category-brand{
  color:#ee3a43;
}
.products-namco .category-title{
  color:#ee3a43;
}
.products-hengstler .category-brand{
  color:#ba000b;
}
.products-hengstler .category-title{
  color:#ba000b;
}
.products-gems .category-brand{
  color:#02b190;
}
.products-gems .category-title{
  color:#02b190;
}
.products-thomson .category-brand{
  color:#1b437e;
}
.products-thomson .category-title{
  color:#1b437e;
}
.products-setra .category-brand{
  color:#1b437e;
}
.products-setra .category-title{
  color:#1b437e;
}
.products-anderson-negele .category-brand{
  color:#1b437e;
}
.products-anderson-negele .category-title{
  color:#1b437e;
}

section.products-namco h2 span:before{
  background:#ee3a43;
}
@media (max-width: 960px) {
  section.products-namco h2 span:before{
    background:#ee3a43;
  }
}
section.products-hengstler h2 span:before{
  background:#ba000b;
}
@media (max-width: 960px) {
  section.products-hengstler h2 span:before{
    background:#ba000b;
  }
}
section.products-gems h2 span:before{
  background:#02b190;
}
@media (max-width: 960px) {
  section.products-gems h2 span:before{
    background:#02b190;
  }
}
section.products-thomson h2 span:before{
  background:#1b437e;
}
@media (max-width: 960px) {
  section.products-thomson h2 span:before{
    background:#1b437e;
  }
}
section.products-setra h2 span:before{
  background:#1b437e;
}
@media (max-width: 960px) {
  section.products-setra h2 span:before{
    background:#1b437e;
  }
}
section.products-anderson-negele h2 span:before{
  background:#1b437e;
}
@media (max-width: 960px) {
  section.products-anderson-negele h2 span:before{
    background:#1b437e;
  }
}
section.products-namco .header-model ul li a{
  color:#ee3a43;
  background:#fff;
  border:1px solid #ee3a43;
}
section.products-namco .header-model ul li a:hover{
  color:#fff;
  background:#ee3a43;
  border:1px solid #ee3a43;
}
section.products-hengstler .header-model ul li a{
  color:#ba000b;
  background:#fff;
  border:1px solid #ba000b;
}
section.products-hengstler .header-model ul li a:hover{
  color:#fff;
  background:#ba000b;
  border:1px solid #ba000b;
}
section.products-gems .header-model ul li a{
  color:#02b190;
  background:#fff;
  border:1px solid #02b190;
}
section.products-gems .header-model ul li a:hover{
  color:#fff;
  background:#02b190;
  border:1px solid #02b190;
}
section.products-thomson .header-model ul li a{
  color:#1b437e;
  background:#fff;
  border:1px solid #1b437e;
}
section.products-thomson .header-model ul li a:hover{
  color:#fff;
  background:#1b437e;
  border:1px solid #1b437e;
}
section.products-setra .header-model ul li a{
  color:#1b437e;
  background:#fff;
  border:1px solid #1b437e;
}
section.products-setra .header-model ul li a:hover{
  color:#fff;
  background:#1b437e;
  border:1px solid #1b437e;
}
section.products-anderson-negele .header-model ul li a{
  color:#1b437e;
  background:#fff;
  border:1px solid #1b437e;
}
section.products-anderson-negele .header-model ul li a:hover{
  color:#fff;
  background:#1b437e;
  border:1px solid #1b437e;
}

/*---------------
header-category
---------------*/
.header-category{
  width:94vw;
  max-width:1080px;
  margin: 0 auto;
  padding:40px 0 0 0;
}
.header-category > div{
  align-items: center;
}
.header-category > div > div:nth-child(1){
  width:70%;
}
.header-category > div > div:nth-child(1) img{
  max-width:260px;
  max-height:144px;
}
.header-category > div.no-image > div:nth-child(1){
  width:100%;
}
.header-category > div > div:nth-child(2){
  width:25%;
}
.header-category > div > div:nth-child(2) img{
  width:100%;
}
@media (max-width: 480px) {
  .header-category > div > div:nth-child(1){
    width:100%;
     order:2;
  }
  .header-category > div > div:nth-child(2){
    width:100%;
    order:1;
  }
  .header-category > div > div:nth-child(2) img{
    width:80%;
    margin:20px auto 20px auto;
  }
}

.category-brand{
  font-size:18px;
  font-weight:600;
}
.category-title{
  font-size:28px;
  padding:25px 0 10px 0;
  line-height:1.3em;
}
.category-title span{
  color:#000;
  font-size:22px;
  padding:0 0 0 15px;
  vertical-align:2px;
  font-weight:400;
}
.category-caption{
  font-size:16px;
  text-align:justify;
}

/*---------------
header-model
---------------*/
.header-model{
  align-items: center;
  width:94vw;
  max-width:1080px;
  margin: 30px auto 10px auto;
  background:#f1f4f7;
  border:1px solid #d5dae0;
  border-radius:3px;
  padding:20px;
}
.header-model > div{
  align-items: center;
}
.header-model > div > div:nth-child(1){
  width: 80px;
}
.header-model > div > div:nth-child(2){
  width: calc(100% - 80px);
}
@media (max-width: 480px) {
  .header-model > div > div:nth-child(1){
    width: 100%;
    text-align:center;
    padding: 0 0 10px 0;
  }
  .header-model > div > div:nth-child(2){
    width: calc(100%);
  }
}
.header-model p{
  font-size:14px;
}
.header-model ul li{
  margin:4px 10px;
}
@media (max-width: 480px) {
  .header-model ul li{
    width:100%;
  }
}
.header-model ul li a{
  border:1px solid;
  text-align:center;
  font-size:14px;
  padding:8px 25px 8px 25px;
  display:block;
  border-radius:5px;
}
.box-products-category{
  align-items: center;
  width:94vw;
  max-width:1080px;
  margin:0 auto;
}
.box-products-category p{
  font-size:17px;
  text-align:justify;
  padding: 0 0 20px 0;
}
.box-products-category table{
  width:100%;
  width:1078px;
}
.box-products-category table th{
  background:#f1f4f7;
  border:1px solid #d5dae0;
  text-align:center;
  font-size:14px;
  font-weight:400;
  padding:10px;
  word-break : break-all;
}
.box-products-category table td{
  background:#fff;
  border:1px solid #d5dae0;
  text-align:center;
  font-size:14px;
  font-weight:400;
  padding:10px;
  color:#000;
}
.box-products-category table td > div{
  display:flex;
  justify-content: center;
  align-items: center;
}
.box-products-category table td img{
  width:40px;
  margin:0 5px 0 0;
}
.products-category li{
  margin:5px 0 0 0;
}
.products-category li a{
  display:block;
  border:1px solid #fff;
}

.products-category li a:hover{
  display:block;
  border:1px solid #f0f0f0;
  opacity: 0.4;
}





.table-scroll{
  overflow-x: scroll;
}
#products-category-top{
  background:#fff;
  padding:40px 0 0 0;
}
#products-detail{
  background:#fff;
}

.products-download{
  width:94vw;
  max-width:1080px;
  margin:0 auto;
}
.products-download p.download-notices{
  text-align:right;
  color:#888;
  font-size:12px;
}
.products-detail{
  width:94vw;
  max-width:1080px;
  margin:0 auto;
  align-items: center;
}
.products-detail > div{
  width:100%;
}
.products-detail > div:nth-child(1){
  width:25%;
  display:flex;
  justify-content: center;
  align-items: center;
}
.products-detail > div:nth-child(1) img{
  max-width:260px;
  max-height:260px;
}
.products-detail > div:nth-child(2){
  width:70%;
}
.products-detail > div:nth-child(2) table{
  width:100%;
}
@media (max-width: 480px) {
  .products-detail > div:nth-child(1){
    width:70%;
    margin:0 auto 30px auto;
  }
  .products-detail > div:nth-child(2){
    width:100%;
  }
}
.products-detail > div:nth-child(2) th{
  background:#f1f4f7;
  border:1px solid #d5dae0;
  font-size:14px;
  padding:10px;
  text-align:left;
  width:180px;
}
@media (max-width: 480px) {
  .products-detail > div:nth-child(2) th{
    background:#f1f4f7;
    border:1px solid #d5dae0;
    font-size:14px;
    padding:10px;
    text-align:left;
    width:120px;
  }
}
.products-detail > div:nth-child(2) td{
  border:1px solid #d5dae0;
  padding:10px;
  line-height:1.5em;
  font-size:15px;
}
.products-download > div{
  background:#f1f4f7;
  border:1px solid #d5dae0;
  border-radius:3px;
  padding:10px 10px 10px 20px;
  margin:40px 0 0 0;
  align-items: center;
}
.products-download > div p{
  font-size:14px;
  font-weight:600;
}
.products-download > div ul li{
  margin:4px 5px;
}
@media (max-width: 480px) {
  .products-download > div ul li{
    width:100%;
  }
}
.products-download > div ul li a{
  border:1px solid;
  text-align:center;
  font-size:14px;
  display:inline-block;
  padding:12px 25px 12px 45px;
  border-radius:5px;
  background: url("/assets/img/icon-download.svg") 25px 49% no-repeat #000;
  background-size:11px;
  color:#fff;
  border-radius:5px;
}
@media (max-width: 480px) {
  .products-download > div{
    padding:20px 10px 20px 10px;
  }
  .products-download > div > div{
    width:100%;
  }
  .products-download > div p{
    width:100%;
    text-align:center;
    padding:0 0 10px 0;
  }
  .products-download > div ul li a{
    display:block;
  }
}
.products-download > div ul li a:hover{
  background: url("/assets/img/icon-download.svg") 25px 49% no-repeat #888;
  background-size:11px;
}


#news-top{
  width:94vw;
  max-width:1440px;
  margin: 0 auto;
  padding:50px 0 0 0;
  border-bottom: 1px solid #eaeaea;
  background: #fff;
}
.tab-wrap {
  width:100%;
  margin: -59px auto 0 auto;
  display: flex;
  flex-wrap: wrap;
}
.tab-label {
  color: #fff;
  background:#000;
  white-space: nowrap;
  text-align: center;
  order: -1;
  position: relative;
  z-index: 1;
  cursor: pointer;
  flex: 1;
  height: 59px;
  padding: 15px 0 15px 0;
  border-top: 3px solid #999;
  font-size:18px;
}
.tab-label:not(:last-of-type) {
  margin-right: 1px;
}
.tab-content {
  width: 100%;
  height: 0;
  overflow: hidden;
  opacity: 0;
}
.tab-content{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.tab-content > div:nth-child(1){
  width: 30%;
  max-width: 480px;
  padding:20px;
  display: flex;
  align-items: center;
}
.tab-content > div:nth-child(1) div{
  padding: 0 0 20px 0;
  display:flex;
  align-items: center;
}
.tab-content > div:nth-child(1) h3{
  padding: 2px 20px 0 30px;
  line-height: 1.2em;
  font-weight: 500;
  font-size: 20px;
}
.tab-content > div:nth-child(1) p{
  position: relative;
  font-size:17px;
}
.tab-content p{
  position: relative;
  font-size:15px;
}
.tab-content > div:nth-child(1) p:before{
  content: "";
  width: 7px;
  height: 8px;
  position: absolute;
  top: 6px;
  left: 8px;
}
.tab-content > div:nth-child(1) p a{
  display:inline-block;
  font-size: 13px;
  position: relative;
  padding: 10px 20px 10px 20px;
  border-radius:3px;
  color:#000;
  border:1px solid #000;
}
.tab-content > div:nth-child(1) p a:hover{
  font-size: 13px;
  position: relative;
  border-radius:3px;
  color:#fff;
  background:#000;
  border:1px solid #000;
}
.tab-content > div:nth-child(1) p a:after{
  content: "";
  width: 15px;
  height: 15px;
  position: absolute;
  top: 5px;
  right: 0;
}
.tab-content > div:nth-child(2){
  width: 70%;
  padding:20px;
}
.tab-content > div:nth-child(2) > ul > li{
  border-top: 1px solid #eaeaea;
  padding: 20px;
}
.tab-content > div:nth-child(2) > ul > li time{
  color: #5c5c5c;
  font-weight: 500;
  font-size: 15px;
}
.tab-content > div:nth-child(2) > ul > li time span{
  font-size: 12px;
  padding: 0 3px 0 0;
}
.tab-content > div:nth-child(2) > ul > li:first-child{
  border-top: none;
}
.tab-content > div:nth-child(2) > ul > li ul{
  display: flex;
  flex-wrap: wrap;
}
.tab-content > div:nth-child(2) > ul > li ul li{
  margin: 0 30px 0 0;
}
.tab-content > div:nth-child(2) > ul > li ul li a{
  font-size: 13px;
  border-bottom: 1px dotted;
}
.tab-content > div:nth-child(2) > ul > li ul li a:hover{
  border: none;
}
.tab-content > div:nth-child(2) > ul > li ul li.link-pdf{
  position: relative;
  padding: 0 60px 0 0;
}
.tab-content > div:nth-child(2) > ul > li ul li.link-pdf:after{
  content: "";
  width: 51px;
  height: 10px;
  background: url(/assets/img/icon-link-pdf.png) no-repeat;
  position: absolute;
  top: 9px;
  right: 0;
}
.tab-content > div:nth-child(2) > ul > li ul li.link-zip{
  position: relative;
  padding: 0 60px 0 0;
}
.tab-content > div:nth-child(2) > ul > li ul li.link-zip:after{
  content: "";
  width: 51px;
  height: 10px;
  background: url(/assets/img/icon-link-zip.png) no-repeat;
  position: absolute;
  top: 9px;
  right: 0;
}
.tab-label br{
  display: none;
}
.tab-label span{
  display: inline;
}
@media screen and (max-width: 1080px) {
  #news-top{
    width: 100%;
    border-top: 1px solid #eaeaea;
    border-bottom: none;
    background: #fff;
  }
  .tab-label {
    color: #000;
    background:#fff;
    white-space: nowrap;
    text-align: center;
    order: -1;
    position: relative;
    z-index: 1;
    cursor: pointer;
    flex: 1;
    line-height: 1.3em;
    height: 80px;
    padding: 15px 0 15px 0;
    font-size: 14px;
    align-items: center;
    display: flex;
    justify-content: center;
  }
  .tab-label br{
    display: inline-block;
  }
  .tab-label span{
    display: none;
  }
  .tab-wrap {
    width: 100vw;
    max-width: 1080px;
    margin: -80px auto 0 auto;
    display: flex;
    flex-wrap: wrap;
  }
  .tab-content > div:nth-child(2){
    width: 100%;
    order: 1;
  }
  .tab-content > div:nth-child(1){
    width: 100%;
    padding: 30px 0 80px 0;
    order: 2;
  }
  .tab-content > div:nth-child(2) > ul > li ul li{
    margin: 20px 60px 0 0;
  }
  .tab-content > div:nth-child(2) > ul > li:last-child{
    border-bottom: none;
  }
  .tab-content > div:nth-child(1) h3{
    display: none;
  }
  .tab-content > div:nth-child(1) p{
    text-align: center;
    position: relative;
    padding: 0 20px 0 24px;
    margin-left: calc(50vw - 90px);
  }
  .tab-content > div:nth-child(1) p:before{
    content: "";
    width: 7px;
    height: 8px;
    background: url(/assets/img/icon-list.png) no-repeat;
    position: absolute;
    top: 6px;
    left: 8px;
  }
}

/* アクティブなタブ */
.tab-switch:checked+.tab-label {
  background: #fff;
  color: #000;
  border-top: 3px solid #000;
}
.tab-switch:checked+.tab-label+.tab-content {
  height: auto;
  overflow: auto;
  opacity: 1;
  transition: .5s opacity;
}
/* ラジオボタン非表示 */
.tab-switch {
  display: none;
}

