/* パンく'z
----------------------------------------------- */
@media (min-width:1040px){
  #breadcrumb {
    background: #47ccfe;
    margin-bottom: 0;
  }
  #breadcrumb ol {
    background: none;
    padding-top: 10px;
  }
  #breadcrumb ol li {
    background-image: url(/img/default/breadcrumb-white.gif);
    color: #fff;
  }
  #breadcrumb a {
    color: #fff;
  }
} /* EO min1040 */


/* 1カラムにする
----------------------------------------------- */
.single-post #main,
.single-post .w336 #main,
.single-post #contents,
.single-post .w336 #contents {
  clear: both;
  float: none;
  padding: 0;
  width: auto;
}

@media (max-width:1039px){
  .single-post .outer {
    margin: 0 -3.5%;
    padding: 0 3.5%;
  }
} /* Eo max1039 */

@media (min-width:1040px){
  .single-post .container {
    padding-right: 0;
    padding-left: 0;
    width: auto;
  }
  .single-post .box,
  .single-post #breadcrumb ol {
    margin: 0 auto;
    max-width: 1000px;
  }
} /* Eo min1040 */

@media (min-width:730px){
  .single-post .outer {
    background: #00B1F4;
    color: #FFF;
    margin-bottom: 1em;
    padding: 20px 0;
  }
  .single-post .post p {
    font-size: 18px;
    line-height: 1.6em;
  }
} /* Eo min730 */



/* 見出し
----------------------------------------------- */
@media (min-width:730px){
  .single-post #contents .post h2 {
    background: none;
    border: none;
    border-bottom: 1px #CCC solid;
    font-size: 2.5em;
    font-weight: bold;
    text-align: center;
    line-height: 1.4em;
    padding: 0;
    position: relative;
  }
  .single-post #contents .post h2.plate {
    color:#111;
  }
  .single-post #contents .post h2::after {
    border-bottom: 2px #09F solid;
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: 1px;
    width: 100%;
  }
  .single-post #contents .post h3,
  .single-post #contents .s-heading {
    font-size: 1.8em;
  }
} /* Eo min730 */


/* キャッチ
----------------------------------------------- */
.single-post #contents .post .catch {
  color: #111;
}
@media (min-width:730px){
  .single-post #contents .post .catch {
    font-size: 1.5em;
    font-weight: bold;
    text-align: center;
  }
  .single-post #contents .post .outer .catch {
    color: #FFF;
  }
} /* Eo min730 */


/* 一覧を見るボタン
----------------------------------------------- */
#contents .box .more {
  clear: both;
  text-align: center;
}
#contents .box .more a {
  background: #00B1F4;
  background: -webkit-linear-gradient(top, #00B1F4, #009CD7);
  background: linear-gradient(#00B1F4, #009CD7);
  border: 1px #008DC3 solid;
  border-radius: 3px;
  color: #FFF;
  display: inline-block;
  text-align: center;
  text-decoration: none;
  padding: 0.2em 1em;
}
#contents .box .more a:hover {
  background: #65DCFE;
  background: -webkit-linear-gradient(top, #65DCFE, #009CD7);
  background: linear-gradient(#65DCFE, #009CD7);
}


/* コンセプト（city-concept）
----------------------------------------------- */
#mainImg {
  background: #47ccfe;
  border-bottom: 0;
}
#mainImg img {
  max-width: 1000px;
  margin-bottom: 0;
  width: 100%;
}

.concept h1 {
  background: none;
  border: none;
  margin: 0.5em 0;
}

@media (max-width:729px){
  .concept h1 {
    background: #09F;
    color: #FFF;
    padding: 0.2em 0.5em;
  }
}/* Eo max729 */

@media (min-width:730px){
  .concept .catch {
    text-align: center;
  }
  .concept h1 {
    font-size: 2.5em;
    font-weight: bold;
    text-align: center;
  }
} /* Eo min730 */


/* 事例
----------------------------------------------- */
#contents ul.results-withumb li {
  background: #F5FCFF;
  border: 1px #E6F0F4 solid;
}


/* 修理費用
----------------------------------------------- */
#contents .price ul li {
  border: 2px #35C6FE solid;
  border-radius: 3px;
}
#contents .price ul li > span {
  display: block;
  padding: 0.5em 0;
}
#contents .price ul li span span {
  display: inline-block;
  font-size: 1.2em;
  font-weight: bold;
  padding-left: 1em;
}
#contents .price ul li > span + span {
  border-top: 1px #CCC dotted;
}

#contents .price ul li span.type {
  background: #35C6FE;
  color: #FFF;
  font-size: 1.5em;
  text-align: center;
}
#contents .price ul li span.cost span {
  color: #C00;
}
#contents .price ul li img ~ span {
  margin: 0 1em;
}

@media (min-width:730px) {
  #contents .price ul {
    display: flex;
    flex-wrap: wrap;
  }
} /* Eo min730 */


/* 原因
----------------------------------------------- */
#contents .cause ul li > span {
  display: block;
  padding: 0.5em 0;
  background: #0066CC;
  color: #FFF;
  font-size: 1.5em;
  text-align: center;
  max-width: 315px;
  margin: 0 auto;
}
#contents .cause ul + p {
  color: #C33;
  font-weight: bold;
}
@media (min-width:730px){
  #contents .cause ul + p {
    font-size: 1.5em;
  }
}/* Eo min730 */


/* 施工方法
----------------------------------------------- */
#contents .sekou ol li {
  position: relative;
}
#contents .sekou ol li span {
  display: block;
}
#contents .sekou ol li img + span {
  font-size: 1.3em;
  font-weight: bold;
  text-align: center;
  margin-bottom: 0.5em;
}

@media (max-width:729px){
  #contents .sekou ol li:nth-of-type(n+2):after {
    content: "";
    position: absolute;
    top: -2em;
    left: 48%;
    border-top: 19px solid #0099FF;
    border-right: 12px solid transparent;
    border-left: 12px solid transparent;
  }
} /* Eo max729 */

@media (min-width:730px){
  #contents .sekou ol li:nth-of-type(n+2):after {
    content: "";
    position: absolute;
    top: 5em;
    left: -9%;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-left: 19px solid #0099FF;
  }
}/* Eo min730 */


/* 失敗しない方法
----------------------------------------------- */
#contents .point ul li {
  position: relative;
}
#contents .point ul li span {
  display: block;
}
#contents .point ul li img + span {
  border-bottom: 1px #0066CC solid;
  font-size: 1.3em;
  font-weight: bold;
  text-align: center;
  margin-bottom: 0.5em;
}
#contents .point ul li span + span {
  color: #111;
}


/* お伺いできる地域
----------------------------------------------- */
#contents .area .area-list ul:not(.rosen) {
  /*background-color: #f0f0f0;*/
  margin: 0 0 1em;
  padding: 15px 0 10px;
}
#contents .area .area-list ul:not(.rosen):after {
  content: "";
  display: block;
  clear: both;
}
#contents .area .area-list ul:not(.rosen) li {
  border-radius: 0.5em;
  float: left;
  list-style: none;
  line-height: 1.5em;
  margin: 0 0 0.5em 2.5%;
  padding: 0 0 0 20px;
}
#contents .area .area-list ul.town li {
  background: #DFDFDF;
}
#contents .area .area-list ul.station li {
  background: #E8E8F9;
}
#contents .area .area-list ul:not(.rosen) li img {
  display: block;
  margin: 0 auto 0.5em;
}

/* 路線 */
#contents .area .area-list ul.rosen {
  text-align: center;
}
#contents .area .area-list ul.rosen li {
  display: inline-block;
}
#contents .area .area-list ul.rosen li + li:before {
  content: "・";
}

@media (max-width:729px){
  #contents .area .area-list ul:not(.rosen) li {
    width: 31.66%;
  }
  #contents .area .area-list ul:not(.rosen) li:nth-child(3n+1) {
    clear: both;
    margin-left: 0;
  }
} /* Eo max729 */

@media (min-width:730px){
  .single-post #contents .area h3 {
    border-bottom: 1px solid #007bc1;
    font-size: 1.8em;
    text-align: center;
    margin-bottom: 0.5em;
  }
  .single-post #contents .area h3 span {
    background: url(/img/block/icon/train-white.png) no-repeat left top, url(/img/block/icon/train-white.png) no-repeat right top;
    padding: 0 65px;
  }
  #contents .area .area-list ul:not(.rosen) li {
    width: 14.58%;
  }
  #contents .area .area-list ul:not(.rosen) li:nth-child(6n+1) {
    clear: both;
    margin-left: 0;
  }
} /* Eo min730 */


/* 雨樋修理事例一覧
----------------------------------------------- */
.results-list > p {
  font-weight: bold;
}
.results-list li {
  border-bottom: 1px dashed #999;
  color: #06c;
  line-height: 1.6em;
  list-style-position: inside;
  margin-left: -1em;
  padding: 0.4em 0 0.4em 1em;
  text-indent: -1em;
}
.results-list li a {
  text-decoration: none;
}
@media (min-width:730px){
  .results-list > p {
    text-align: center;
  }
} /* Eo min730 */
