html {
    font-size: 11px
  }





  .about .content-img{
    margin:0;
    padding:0;
  }



  .works-box{
    width:auto;
    height:auto;
    background-color:#ffffff;
    padding:40px;
    margin:60px 0;
    box-shadow: 3px 3px 3px rgba(0,0,0,0.1);
  }

  @media screen and (max-width:640px) {

    .works-box{
      width:auto;
      height:auto;
      background-color:#ffffff;
      padding:15px;
      margin:40px 0;
      box-shadow: 3px 3px 3px rgba(0,0,0,0.1);
    }

  }


  .contents-box-nav{
margin:40px 0 -20px 0;
padding:0;
text-align:left;
  }

  .contents-box-nav li{
    margin:0 20px 10px 0;
    padding:0;
    display:inline-block;
      }

      @media screen and (max-width:800px) {


        .contents-box-nav{
          margin:40px 0 0px 0;
          padding:0;
          text-align:left;
            }
          
            .contents-box-nav li{
              margin:0 20px 10px 0;
              padding:0;
              display:inline-block;
                }
      }
  

  .imgwrap {
    overflow: hidden;	/*拡大時にはみ出た部分を隠す*/
    width: 250px;	/*画像の幅*/
    height: 98px;	/*画像の高さ*/
    position: relative;/*相対配置*/
    top:0px;
  }

  @media screen and (max-width:640px) {

    .imgwrap {
      overflow: hidden;	/*拡大時にはみ出た部分を隠す*/
      width: 250px;	/*画像の幅*/
      height: 80px;	/*画像の高さ*/
      position: relative;/*相対配置*/
      top:0px;
    }

    
  }


  .imgwrap img {
    display: block;
    transition-duration: 0.3s;	/*変化に掛かる時間*/
  }
  .imgwrap img:hover {
    transform: scale(1.1);	/*画像の拡大率*/
    transition-duration: 0.3s;	/*変化に掛かる時間*/
  }

  .imgwrap p {
    position: absolute;
    top: 45%;
    left: 50%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    margin: 0 auto;
    padding:0;
    color:#ffffff;

    }

  .imgwrap {
    /* 略 */
    background: #000;
  }
  .imgwrap img {
    opacity: 0.6;	/* 小さくするほど暗くなります */
  }
  .imgwrap img:hover {
    /* 略 */
    opacity: 0.8;	/* 小さくするほど暗くなります */
  }


  
  .contents-box-nav-ad1:after{
    position: absolute;
    top:5px; /* Wherever you go. */
    left: 5%; /* Horizontally centered. */
    margin-left: -25px; /* Half of my width. */
    width: 50px;
	height: 50px;
    margin:auto;
    content: "";
    vertical-align: middle;
    text-align:center;
    background: url(/assets/img/common/contents-arrow01.svg) no-repeat center center;
  }
  
  .contents-box-nav-ad2:after{
    position: absolute;
    top:5px; /* Wherever you go. */
    left: 25%; /* Horizontally centered. */
    margin-left: -25px; /* Half of my width. */
    width: 50px;
	height: 50px;
    margin:auto;
    content: "";
    vertical-align: middle;
    text-align:center;
    background: url(/assets/img/common/contents-arrow01.svg) no-repeat center center;
  }
  
  .contents-box-nav-ad3:after{
    position: absolute;
    top:5px; /* Wherever you go. */
    left: 33%; /* Horizontally centered. */
    margin-left: -25px; /* Half of my width. */
    width: 50px;
	height: 50px;
    margin:auto;
    content: "";
    vertical-align: middle;
    text-align:center;
    background: url(/assets/img/common/contents-arrow01.svg) no-repeat center center;
  }
  


.pc {
  display: block
}

@media only screen and (max-width:640px) {
  .pc {
    display: none
  }
}

.sp {
  display: none
}

@media only screen and (max-width:640px) {
  .sp {
    display: block
  }
}

@media only screen and (min-width:640px) {
  .cardLists {
    max-width: 1465px;
    padding: 40px 20px;
    margin:40px 0 40px -18px;
  }
  .cardLists__wrap {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: stretch
  }
  .cardLists__wrap--top .cardLists__space:after {
    top: 0
  }
  .cardLists__wrap--top .cardLists__item {
    padding-bottom: 2.10526vw
  }
  .cardLists__wrap--bottom .cardLists__space:after {
    bottom: 0
  }
  .cardLists__wrap--bottom .cardLists__item {
    padding-top: 2.10526vw;
    padding-bottom: 2.10526vw
  }
  .cardLists__item {
    width: 29.82456vw;
    max-width: 425px;
    border-bottom: 1px dotted #000
  }
  .cardLists__space {
    width: 5.26316vw;
    max-width: 75px;
    position: relative
  }
  .cardLists__space:after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 1px;
    height: 95%;
    border-left: 1px dotted #000
  }
  .cardLists__term {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    margin-top: 2.80702vw
  }

  .cardLists__termText {
    color: #ff5600;
    font-size: 0.8vw;
    font-weight: 700;
    margin-left: 0w;
    text-align:left;
    line-height:150%;
  }
  .cardLists__desc {
    font-size:12px;
    margin-top: 1.75439vw;
    line-height: 1.75;
    text-align:left;
  }
}

@media only screen and (max-width:640px) {
  .cardLists {
    padding:40px 0;
    margin:0;
  }
  .cardLists__item {
    border-top: 1px dotted #000
  }
  .cardLists__head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    padding:25px 0
  }
  .cardLists__head.is-open .cardLists__headIcon {
    transform: rotate(-180deg);
    transform-origin: center
  }
  .cardLists__headLeft {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    float:left;
  }

  .cardLists__headText {
    font-size: 2.91667vw;
    color: #ff5600;
    font-weight: 700
  }


  .cardLists__termText {
   max-width:270px;
   margin:10px 0 0 0;
  }



  .cardLists__headIcon {
    max-width: 35px;
    width: 7.29167vw;
  }
  .cardLists__body {
    padding: 0 6.25vw;
    opacity: 0;
    visibility: hidden;
    transition: all .8s ease;
    max-height: 0
  }
  .cardLists__body.is-open {
    opacity: 1;
    visibility: visible;
    max-height: 1000px;
    transition: all .8s ease
  }
  .cardLists__desc {
    margin-top: 5.20833vw;
   font-size:12px;
    margin-bottom: 10px;
    text-align:left;
  }
}


ul.news-topics{
  margin:25px 25px 0 0;
  padding:15px;
  border:1px solid #e85710;
  font-size:12px;
}

ul.news-topics li a{
  margin:0;
  padding:0;
  display:block;
  color:#e85710;
  line-height:150%;
}
