@charset "utf-8";

.pc {
    display:block;
}

span.pc {
    display:inline-block;
}

.sp {
    display:none;
}

span.sp {
    display:none;
}

/*------------------------------------------------------------
  トップページ
------------------------------------------------------------*/

#conts .txtShin {
  margin: -3px 0 28px;
  font-size: 2.8em;
  font-weight: bold;
  line-height: 1.45;
}

#conts p span {
  color: #cc0000;
}

#conts h2 {
  margin-bottom: 2px;
  color: #333;
  font-size: 2.2em;
}

#conts h2 span {
  padding: 10px 10px 6px 84px;
  min-width: 139px;
  display: inline-block;
  border-radius: 23px;
  position: relative;
  behavior: url(/js/pie.htc);
  background: #EFE790 url(../img/kaitori/img01.gif) no-repeat 27px center;
}

#conts .h3Ttl02 span {
  background: #DCE8C0 url(../img/kaitori/img02.gif) no-repeat 30px center;
}

#conts .h3Ttl03 span {
  background: #86CBBF url(../img/kaitori/img03.gif) no-repeat 33px center;
}

#conts .h3Ttl04 span {
  background: #BBB3D8 url(../img/kaitori/img04.gif) no-repeat 22px center;
}

#conts .h3Ttl05 span {
  background: #F8C5AB url(../img/kaitori/img05.gif) no-repeat 26px center;
}

#conts .listUl {
  margin-right: -15px;
  padding-bottom: 60px;
  width: 668px;
  overflow: hidden;
  position: relative;
}

#conts .listUl:after {
  width: 648px;
  height: 1px;
  position: absolute;
  left: 0;
  bottom: 30px;
  background-color: #666;
  content: "";
}

#conts .listUl03:after {
  display: none;
}

#conts .listUl05:after {
  display: none;
}

#conts .listUl li {
  margin: 20px 15px 0 0;
  width: 152px;
  float: left;
}

#conts .listUl li span {
  padding: 0 0 3px 21px;
  display: block;
  font-size: 1.95em;
  letter-spacing: 1px;
  background: url(../img/common/icon04.gif) no-repeat left 4px;
}

#conts .listUl .liStyle span {
  letter-spacing: 1px;
}

#conts .listUl02 li span {
  background: url(../img/common/icon05.gif) no-repeat left 4px;
}

#conts .listUl03 li span {
  background: url(../img/common/icon06.gif) no-repeat left 4px;
}

#conts .listUl04 li span {
  background: url(../img/common/icon07.gif) no-repeat left 4px;
}

#conts .listUl05 li span {
  background: url(../img/common/icon08.gif) no-repeat left 4px;
}

#main .compensate {
  margin-bottom: 50px;
  border-radius: 10px;
  background-color: #FFF;
  box-shadow: 3px 3px 5px #c2bcb3;
  position:relative;
  top:0;
  left:0;
}

#main .compensate .text {
    position:absolute;
    top:25px;
    left:50%;
    text-align:center;
    font-size:2.3em;
    font-weight:bold;
    width:315px;
    margin-left:-157.5px;
}

#main .compensate .text span {
    color:#91004f;
}

/* SmatPhones */
@media (max-width:979px) {

    .pc {
        display:none !important;
    }

    span.pc {
        display:none !important;
    }

    .sp {
        display:block;
    }

    span.sp {
        display:inline-block;
    }

    #gHeader {
        background-image: url("");
        display:block;
    }

    #gHeader .inner {
        width:95% !important;
        padding:0 !important;
        margin:20px auto;
    }

    #gHeader .inner .title {
        float:none;
        width:100%;
    }

    #gHeader .inner .title img {
        max-width:100%;
        display:block;
        margin:0 auto;
    }

    #gHeader .inner .area {
        display:none;
    }

    #main {
        padding-top:25px;
        padding-bottom:28px;
        width:90% !important;
        margin:0 auto;
    }

    #conts .listUl .liStyle span {
        height:auto !important;
        letter-spacing:1.0px !important;
    }

    #conts .listUl {
        width:100% !important;
        margin:0 auto !important;
    }

    #conts .listUl li {
        width:48% !important;
        margin-right:0 !important;
    }

    #conts .listUl li img {
        width:100% !important;
    }

    #conts .listUl li:nth-child(2n+1) {
        float:left !important;
    }

    #conts .listUl li:nth-child(2n) {
        float:right !important;
    }

    #main .compensate {
    }

    #main .compensate img {
        width:100% !important;
    }

    #main .compensate .text {
        top:20%;
        left:25% !important;
        width:50% !important;
        text-align:center;
        font-size:13px;
        margin-left:0 !important;
    }

}

/* iPhone6のみ */
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) {

    .pc {
        display:none !important;
    }

    span.pc {
        display:none !important;
    }

    .sp {
        display:block;
    }

    span.sp {
        display:inline-block;
    }

    #gHeader {
        background-image: url("");
        display:block;
    }

    #gHeader .inner {
        width:95% !important;
        padding:0 !important;
        margin:20px auto;
    }

    #gHeader .inner .title {
        float:none;
        width:100%;
    }

    #gHeader .inner .title img {
        max-width:100%;
        display:block;
        margin:0 auto;
    }

    #gHeader .inner .area {
        display:none;
    }

    #main {
        padding-top:25px;
        padding-bottom:28px;
        width:90% !important;
        margin:0 auto;
    }

    #conts .listUl .liStyle span {
        height:auto !important;
        letter-spacing:1.0px !important;
    }

    #conts .listUl {
        width:100% !important;
        margin:0 auto !important;
    }

    #conts .listUl li {
        width:48% !important;
        margin-right:0 !important;
    }

    #conts .listUl li img {
        width:100% !important;
    }

    #conts .listUl li:nth-child(2n+1) {
        float:left !important;
    }

    #conts .listUl li:nth-child(2n) {
        float:right !important;
    }

    #main .compensate {
    }

    #main .compensate .text {
        top:15px;
        text-align:center;
        font-size:1.3em;
    }

}

/* iPhone6 Plus ~ ちょっと大きいスマホまで */
@media only screen and (min-device-width : 414px) and (max-device-width : 736px) {

    .pc {
        display:none !important;
    }

    span.pc {
        display:none !important;
    }

    .sp {
        display:block;
    }

    span.sp {
        display:inline-block;
    }

    #gHeader {
        background-image: url("");
        display:block;
    }

    #gHeader .inner {
        width:95% !important;
        padding:0 !important;
        margin:20px auto;
    }

    #gHeader .inner .title {
        float:none;
        width:100%;
    }

    #gHeader .inner .title img {
        max-width:100%;
        display:block;
        margin:0 auto;
    }

    #gHeader .inner .area {
        display:none;
    }

    #main {
        padding-top:25px;
        padding-bottom:28px;
        width:90% !important;
        margin:0 auto;
    }

    #conts .listUl .liStyle span {
        height:auto !important;
        letter-spacing:1.0px !important;
    }

    #conts .listUl {
        width:100% !important;
        margin:0 auto !important;
    }

    #conts .listUl li {
        width:48% !important;
        margin-right:0 !important;
    }

    #conts .listUl li img {
        width:100% !important;
    }

    #conts .listUl li:nth-child(2n+1) {
        float:left !important;
    }

    #conts .listUl li:nth-child(2n) {
        float:right !important;
    }

    #main .compensate {
    }

    #main .compensate .text {
        top:15px;
        text-align:center;
        font-size:1.3em;
    }

}