/* hasList */

/* アイテムリスト…商品には使わない。商品はproduct */
.itemList{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 48px;
}
.itemList li{
  width: 470px;
  height: 96px;
  margin-bottom: 8px;
}

.itemList li a{
  width: 100%;
  height: 100%;
  font-size: 24px;
  font-weight: bold;
  background: #e0d8bf;
  transition: .1s;
  display: flex;
  justify-content: center;
  align-items: center;
}
.itemList li:hover a,
.itemList li a.current{
  background: #95260d !important;
  color: #ede7d4 !important;
}
/* //アイテムリスト */

/* pager */
.pager{
  position: absolute;
  top: 300px;
  width: 100%;
}
.pager ul{
  display: flex;
  justify-content: space-between;
}
.pager li{
  width: 70px;
  text-align: center;
  margin: 0 32px;
  position: relative;
  z-index: 1;
  font-weight: bold;
  cursor: pointer;
}
.pager li a{
  color: #05060d;
  transition: .3s;
  padding: 70px 18px 0;
  margin-top: -70px;
}
.pager li::before{
  font-family: FontAwesome;
  content: "\f104";
  display: block;
  font-size: 32px;
  margin: -4px 4px 36px 0;
  font-weight: normal;
  color: #fff;
  line-height: 0;
}
.pager li:last-child::before{
  content: "\f105";
  margin-right: -4px;
}
.msBrowser.ie .pager li::before{
  margin-top: -16px;
}
.pager li::after{
  line-height: 0;
  content: "◆";
  position: absolute;
  top: 0;
  left: 0;
  font-size: 70px;
  color: #dbd0c8;
  z-index: -1;
  transition: .3s;
}
.pager li:hover a{
  color: #65666d;
}
.pager li:hover::after{
  color: #b59f97;
}
/* //pager */

/* 狭小 */
@media only screen and (max-width: 1170px){
  .pager,
  .pager li{
    position: static;
  }
  .pager{
    padding: 0 0 32px;
  }
  .pager li{
    margin: 0;
    width: auto;
  }
  .pager li::before,
  .pager li:last-child::before,
  .pager li::after{
    content: none;
  }
  .pager li a{
    margin: 0;
    padding: 16px;
    background-color: #95260d;
    color: #fff;
  }
  .pager li:first-child a::before,
  .pager li:last-child a::after{
    font-family: FontAwesome;
    margin: 0;
    font-weight: normal;
    line-height: 0;
  }
  .pager li:first-child a::before{
    content: "\f104";
    margin-right: 8px;
  }
  .pager li:last-child a::after{
    content: "\f105";
    margin-left: 8px;
  }
}/* このとじカッコは消さないこと */

/* //hasList */@charset "utf-8";

/* 共通 */
main{
  overflow: hidden;
}
.headList{
  width: 800px;
  margin: 0 auto 120px;
}
.headList .itemList li{
  position: relative;
  width: 240px;
  height: 50px;
}
.headList .itemList li a{
  color: #95260d;
  background-color: #fff;
  font-size: 18px;
}
.headList .itemList li a::after{
  font-family: FontAwesome;
  content: "\f107";
  position: absolute;
  right: 16px;
}

.secContent .decorated_dia{
  top: -58px;
  margin-bottom: -42px;
  margin-top: 0;
}
.secContent .decorated_dia::before,
.secContent .decorated_dia::after{
  content: none;
}
/* //共通 */

/* index */
.index .lead{
  background: url(/img/knowledge/topImg.png) no-repeat 16px 80px;
}
.index .lead p{
  margin-left: 270px;
}

.contentIndex{
  display: flex;
  justify-content: space-between;
  margin-bottom: 32px;
}
.contentIndex dl{
  background-color: #e0d8bf;
  padding: 32px;
  width: 470px;
}
.contentIndex dt,
.contentIndex dd li{
  position: relative;
}
.contentIndex dt{
  font-size: 32px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 16px;
}
.contentIndex dt a{
  color: #95260d;
  display: block;
  transition: .3s;
}
.contentIndex dt a:hover{
  background: #95260d;
  color: #ede7d4;
}
.contentIndex dd .itemList li{
  height: 50px;
}
.contentIndex dd .itemList li a{
  background-color: #ede7d4;
}
.contentIndex dt a::after,
.contentIndex dd .itemList li a::after{
  font-family: FontAwesome;
  content: "\f105";
  position: absolute;
  right: 16px;
}
.contentIndex .itemList{
  margin-bottom: 16px;
}
/* //index */

/* 痔の基本情報 */
.secContent{
  padding-bottom: 64px;
}
.secContent .lead{
  margin-bottom: 32px;
}
/* 痔の種類 */
.secContent.type{
  background-color: #e0d8bf;
}
.secContent.type dl{
  position: relative;
  z-index: 1;
}
.secContent.type dl::before{
  overflow: hidden;
  content: "";
  background-repeat: no-repeat;
  position: absolute;
  z-index: -1;
}
.secContent.type dl.bg1::before{
  background-image: url(/img/knowledge/summary/ItemImg01.png);
  width: 302px;
  height: 260px;
  top: 140px;
  right: -72px;
}
.secContent.type dl.bg2::before{
  background-image: url(/img/knowledge/summary/ItemImg02.png);
  background-position: 108% 0;
  width: 333px;
  height: 328px;
  top: 46px;
  left: -116px;
}
.secContent.type dl.bg3::before{
  background-image: url(/img/knowledge/summary/ItemImg03.png);
  background-position: 108% 0;
  width: 505px;
  height: 250px;
  top: -78px;
  right: -76px;
}
.secContent.type dt,
.secContent.type dd{
  margin: 0 auto;
  width: 960px;
}
.secContent.type dt{
  font-size: 24px;
  font-weight: bold;
  padding-bottom: 4px;
  margin-bottom: 8px;
}
.secContent.type dt span{
  border-bottom: 1px solid #95260d;
}

.secContent.type .itemList li a{
  background: #ede7d4;
  text-align: center;
  flex-wrap: wrap;
}
/* //痔の種類 */

/* 痔の原因 */
.secContent.cause{
  background-color: #ede7d4;
}
.secContent.cause .decorated_diaL{
  text-align: left;
  font-size: 32px;
  font-weight: normal;
  color: #05060d;
  margin-bottom: 16px;
}
.secContent.cause .decorated_diaL::after{
  top: 24px;
}
.secContent.cause p{
  line-height: 2;
  margin-bottom: 32px;
}
/* //痔の原因 */

/* 悪化の誘因 */
.secContent.incentive{
  background-color: #e0d8bf;
}
.secContent.incentive dl{
  padding-top: 32px;
  counter-reset: count;
}
.secContent.incentive dt{
  color: #95260d;
  font-size: 24px;
  font-weight: bold;
  padding-left: 60px;
  margin-bottom: 16px;
}
.secContent.incentive dt::before{
  counter-increment: count;
  content: counter(count);
  position: absolute;
  color: #fff;
  left: 18px;
}
.secContent.incentive dt::after{
  top: 20px;
  left: 0;
  font-size: 48px;
  color: #95260d;
}
.secContent.incentive dd{
  margin-bottom: 32px;
}
.secContent.incentive .cautionBlock{
  border: 1px solid #95260d;
  background: url(/img/knowledge/summary/caution.png) 64px 16px no-repeat;
  padding: 16px 16px 48px;
}
.secContent.incentive .cautionBlock h2{
  font-size: 48px;
  margin-bottom: 16px;
}
.secContent.incentive .cautionBlock p{
  width: 70%;
  margin: 0 0 0 auto;
  font-size: 18px;
}
/* //悪化の誘因 */
/* //痔の基本情報 */

/* 予防･対策 */
.remedy dt{
  color: #95260d;
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 8px;
  padding-left: 32px;
}
.remedy dt::after{
  top: 16px;
  left: 0;
  font-size: 24px;
  color: #95260d;
}
/* トイレの習慣改善 */
.secContent.toilet{
  background-color: #e0d8bf;
}
.secContent.toilet dl{
  margin-bottom: 48px;
}
/* //トイレの習慣改善 */

/* 食生活の見直し */
.secContent.meal{
  background-color: #ede7d4;
}
.secContent.meal .dd01{
  background: url(/img/knowledge/remedy/mealImg.png) top left no-repeat;
  padding: 0 0 32px 216px;
}
.secContent.meal .dd01 dl{
border: 1px solid #95260d;
  padding: 16px 16px 0;
}
.secContent.meal>dl{
margin-bottom: 48px;
}
/* //食生活の見直し */

/* ライフスタイルの見直し */
.secContent.lifestyle{
  background-color: #e0d8bf;
}
/* //ライフスタイルの見直し */
/* //予防･対策 */


/* 狭小 */
@media only screen and (max-width: 959px){
  .secContent{
    padding: 0 16px 64px;
  }
  .contentIndex{
    flex-direction: column;
    align-items: center;
  }
  .index .lead{
    padding: 0 16px;
  }
  .secContent.type .itemList li{
    width: 47%;
  }
  .secContent.type dt,
  .secContent.type dd{
    width: 100%;

}/* このとじカッコは消さないこと */
@media only screen and (max-width: 800px){
    .headList{
      width: 100%;
    }
}/* このとじカッコは消さないこと */

/* スマホ以下 */
@media only screen and (max-width: 767px){
  .headList,
  .contentIndex dl,
  .secContent.type dt,
  .secContent.type dd,
  .itemList li,
  .secContent.type .itemList li,
  .secContent.incentive .cautionBlock p{
    width: 100%;
  }
  /* 共通 */
  .headList{
    padding: 0 16px;
  }
  .secContent{
    padding: 0 16px 80px;
  }
  .secContent:last-child{
    padding-bottom: 16px;
  }
  .itemList{
    flex-direction: column;
    align-items: center;
  }
  .itemList li a{
    flex-direction: column;
  }
  .headList p{
    text-align: center;
    margin-bottom: 32px;
  }
  /* //共通 */

  /* index */
  .index .lead{
    background-position: center 48px;
    background-size: 128px;
    padding: 0 16px;
  }
  .index .lead h1{
    margin-bottom: 188px;
  }
  .index .lead p{
    margin: 0 0 16px 0;
  }
  .contentIndex{
    flex-direction: column;
    margin-bottom: 0;
  }
  .contentIndex dl{
    padding: 16px 16px 0 16px;
  }
  .contentIndex dt{
    font-size: 24px;
    margin-bottom: 8px;
  }
  .contentIndex .itemList.long li{
    height: 80px;
  }
  /* //index */


/* 痔の基本情報 */
/* 痔の種類 */
  .secContent.type dl{
    margin-bottom: 32px;
  }
  .secContent.type dl::before{
    content: none;
  }
  .secContent.type .itemList{
    width: 100%;
  }
  .secContent.type .itemList li{
    height: 48px;
  }
  .secContent.type .itemList li a{
    font-size: 18px;
    padding-left: 16px;
    text-align: left;
    flex-direction: column;
    align-items: flex-start;
    flex-wrap: nowrap;
  }
  .secContent.type .itemList li span{
    font-size: 14px;
  }
  .secContent.type .itemList li a::after{
    font-family: FontAwesome;
    content: "\f105";
    position: absolute;
    right: 16px;
  }
  /* //痔の種類 */

  /* 痔の原因 */
  .secContent.cause .decorated_diaL{
    font-size: 24px;
  }
/*  .secContent.incentive dt{
    padding-left: 60px;
    margin-bottom: 16px;
  }*/
/*  .secContent.incentive dt::before{
    left: 18px;
  }*/
/*  .secContent.incentive dt::after,
  .remedy dt::after{
    left: 0;
  }*/
  .secContent.incentive .cautionBlock{
    background-position: 50% 95%;
    padding-bottom: 216px;
  }
  .secContent.incentive .cautionBlock p{

  }
  /* //痔の原因 */

  /* 予防･対策 */
  .remedy dt{
    padding-left: 32px;
    margin-bottom: 16px;
  }
  /* 食生活の見直し */
  .secContent.meal .dd01{
    background: none;
    padding: 0;
  }
  .secContent.meal .dd01 dl{
    margin-bottom: 16px;
  }
  .secContent.meal .dd01 dl dt{
    padding-left: 0;
  }
  .secContent.meal .dd01 dl dt span{
    display: block;
  }
  .secContent.meal .dd01 dl dd{
    background: url(/img/knowledge/remedy/mealImg.png) top center /104px no-repeat;
    padding: 96px 0 0 0;}
}/* このとじカッコは消さないこと */