@charset "UTF-8";

.pageTitle{
  margin-top: .75rem;
}

.guideContent{
  display: flex;
  margin-top: .75rem;
}
.guideLists{
  width: 23.675%;
  background-color: #ccd0dd;
  margin-right: 2%;
  padding: .4rem;
}
.searchForm{
  display: flex;
}
.searchForm input{
  width: 0;
  margin-right: 0.4rem;
  flex: 1;
}
a.submit{
  width: 2rem;
}
.guideAcordion{
  margin-top: .75rem;
}
.guideAcordion dt,
.guideAll dt{
  background-color: #282828;
  margin-top: .45rem;
}
.guideAcordion dt:first-child{
  margin-top: 0;
}
.guideAcordion dt a,
.guideAll dt{
  display: block;
  font-size: .575rem;
  line-height: .75rem;
  padding: 0.35rem;
  color: #fff;
}
.guideAcordion dt a:hover{
  color: #aba7a9;
}
.guideAcordion li a:hover,
.guideAll li a:hover{
  color: #db5e22;
}
.guideAll dt{
  margin: 0;
  /* padding: 0 .4rem; */
  color: #fff;
}
.guideAcordion ul{
  display: none;
}
.guideAcordion li,
.guideAll li{
  background-color: #f0f0f0;
  /* padding: .3rem; */
  margin-bottom: 2px;
}
.guideAcordion li a,
.guideAll li a{
  display: block;
  color: #282828;
  font-size: .575rem;
  line-height: .75rem;
  padding: 0.35rem;
}
.guideAcordion dt{
  position: relative;
}
.guideAcordion dt:before,
.guideAcordion dt:after{
  content: "";
  display: inline-block;
  width: 0.416rem;
  height: 0.083rem;
  margin: auto;
  background-color: #ccd0dd;
  position: absolute;
  top: 50%;
  bottom: 50%;
  right: 0.4rem;
  pointer-events: none;
}
.guideAcordion dt:after{
  transform: rotate(90deg);
  transition: .3s
}
.guideAcordion dt.open:after{
  transform: rotate(0deg);
}
.guideRight{
  width: 74.325%;
}
.guideAll{
  display: flex;
  flex-wrap: wrap;
}
.guideAll > div{
  width: 32%;
  margin-bottom: .75rem;
}
.guideAll > div:nth-child(3n + 2){
  margin: 0 2%;
}


/* 詳細 */
.guideDetailHeader{
  background-color: #282828;
}
.guideDetailHeader h3{
  font-size: .833rem;
  color: #fff;
  line-height: 1.7rem;
  padding: 0 .4rem;
}
.guideDetailText{
  font-size: .665rem;
  margin-top: 2%;
  line-height: 1rem;
}
.guideDetailText img{
  width: 70%;
}

.spBlock{
  display: none;
}


/* 検索結果 */
.searchResultList{
  margin-top: 1rem;
}
.searchResultList > div{
  margin-top: .5rem;
}
.searchResultList dt a{
  color: #da5e22;
  text-decoration: underline;
  font-size: .75rem;
}
.searchResultList dt a:hover{
  color: #3c508e;
}
.searchResultList dd{
  font-size: .6rem;
  line-height: 1rem;
}



/* タブレット対応 */
@media screen and (max-width:640px) {
  .guideMain .guideRight{
    display: none;
  }
  .guideLists{
    width: 100%;
    padding: .5rem;
  }
  .guideResult .guideContent{
    display: block;
  }
  .guideResult .guideRight{
    width: 100%;
    margin-top: .7rem;
  }
  .searchResultList > div{
    margin-top: 1rem;
  }
  .searchResultList dt a{
    font-size: .8rem;
    line-height: 1.4rem;
  }
  .searchResultList dd{
    font-size: .7rem;
  }

  .guideAcordion dt a, .guideAll dt a,
  .guideAcordion li a, .guideAll li a{
    font-size: .8rem;
    line-height: 1rem;
    padding: .5rem .6rem;
  }

  .guideAcordion dt:before,
  .guideAcordion dt:after{
    width: 0.75rem;
    height: 0.125rem;
    right: .5rem;
  }
  .guideAcordion li, .guideAll li{
    padding: 0;
  }

  /* 検索結果 */
  .guideResult .guideLists{
    margin: 1.25rem 0;
  }


  /* 詳細 */
  .guideDetailWrap .guideContent{
    display: block;
  }
  .guideDetailWrap .guideAcordion,
  .guideResult .guideAcordion{
    display: none;
  }
  .guideDetailWrap .guideRight{
    width: 100%;
    margin-top: .75rem;
  }
  .guideDetailWrap .guideDetailHeader h3{
    font-size: .95rem;
    line-height: 1.25rem;
    padding: .45rem .5rem;
  }
  .guideDetailWrap .guideDetailText{
    font-size: .8rem;
    line-height: 1.2rem;
  }
  .spBlock{
    display: block;
  }
  .guideAcordion.db{
    margin: 0;
  }

  a.submit{
    width: 3rem;
  }


}