/* ---------------------------------------------------------
top
----------------------------------------------------------*/
.inner{
  position: relative;
  width: 1000px;
  margin: 0 auto;
  padding: 50px 0;
}
@media only screen and (max-width: 768px) {
  .inner{
    width:100%;
    padding: 30px 4% 0;
  }
}

.fcOrange{
  color: #FB8712;
}
.fcRed{
  color:#FF3333;
}
.fcBlue{
    color: #00316C;
}
.fs06em{
  font-size: 0.6em;
}
.fs12em{
  font-size: 1.2em;
}
.fs15em{
  font-size: 1.5em;
}
.fs16em{
  font-size: 1.6em;
}
@media only screen and (max-width: 768px) {
.fs16em{
  font-size: 1.4em;
}
}
.fs22em{
  font-size: 2.2em;
}
.b{
  font-weight: bold;
}
.mt15{
  margin-top: 15px;
}
.mb50{
  margin-bottom: 50px;
}
.pt20{
  padding-top: 20px;
}
.pb20{
  padding-bottom: 20px;
}
.pb15{
  padding-bottom: 15px;
}
.fl{
  float: left;
}
.fr{
  float: right;
}
.tar{
  text-align: right;
}
.lh1em{
  line-height: 1em;
  padding: 0.4em 0 0.3em;
}
a:link{
  cursor: pointer;
  text-decoration: none;
}
input[type="submit"],a img{
  transition: opacity 0.3s ease-out;
}
input[type="submit"]:hover, a img:hover{
  opacity: 0.5;
}
.totop{
  position: fixed;
  right: 50px;
  bottom: 50px;
}

.no1_img{
  position: absolute;
  top: 5%;
    right: 20%;
    width: 15%;
}

@media only screen and (max-width: 768px) {
.totop{
  position: fixed;
  right: 1%;
  bottom: 1%;
  width: 50px;
  height: 50px;
}

.no1_img{ right: 5%;width: 20%; }
}

/* ---------------------------------------------------------
header
----------------------------------------------------------*/
.logo {
  overflow: hidden;
  width: 199px;
  height: 0;
  margin: 0 auto auto 10px;
  padding-top: 31px;
  background: url(../images/logo_01_sp.png) no-repeat 50% 50%;
  background-size: contain;
}
.manga{
  position:absolute;
  top:5%;
  right:10%;
}
@media only screen and (max-width: 767px) {
.manga{
  width: 90%;
  position:absolute;
  top:5%;
  right:5%;
}
}
@media only screen and (min-width: 768px) {
  .logo {.manga{
    position:absolute;
    top:5%;
    right:10%;
  }
    margin: 0 auto auto 0;
    background-image: url(../images/logo_01_pc.png);
  }
}
.header_contents {
  margin: 0 auto;
  padding: 0;
  position: relative;
}
.header_contents .tel {
  position: absolute;
  right: 10px;
  top: 0;
  width: 127px;
}
@media only screen and (min-width: 768px) {
  .header_contents {
    width: 728px;
  }
  .header_contents .tel {
    right: 0;
    width: 197px;
  }
  .form_contents {
    width: 728px;
    margin: 0 auto;
    padding: 0;
  }
  .form_contents p.lead_txt2{
    padding: 30px 0 0 0;
    text-align: left;
  }
}

/* ---------------------------------------------------------
mainVisual
----------------------------------------------------------*/
#mainVisual.noVideo {
  overflow: hidden;
  height: 0;
  width: 100%;
  padding-bottom: 56.25%;
  background: url(../images/img-mv.png) no-repeat center top;
  background-size: cover;
}

#mainVisual.noVideo .ttl {
  overflow: hidden;
  height: 0;
  width: 46.5625%;
  padding-bottom: 13.67188%;
}

#mainVisual.noVideo .ttl img {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

@media screen and (max-width: 640px) {
  #mainVisual.noVideo {
    padding-bottom: 100%;
  }
}

#mainVisual {
  position: relative;
}

#mainVisual.bgOn {
  background: url(../images/img-mv.png) no-repeat center top;
  background-size: cover;
}

#mainVisual video {
  vertical-align: top;
}

#mainVisual .ph {
  position: relative;
}

#mainVisual .ttl {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  text-align: center;
}

.bgDot {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../images/video_dot.png) repeat center top;
}

.bgDot img {
  width: 100%;
}

#mainVisual .scroll {
  position: absolute;
  bottom: 3.125%;
  width: 100%;
  text-align: center;
}

#mainVisual .spmain img {
  display: none;
}

@media screen and (max-width: 640px) {
  #mainVisual video {
    display: none;
  }
  #mainVisual .scroll {
    display: none;
  }
  #mainVisual .spmain img {
    display: block;
    width: 100%;
  }
  #mainVisual .ph,
  #mainVisual .ttl {
    display: none;
  }
}

#mainVisual .scroll img {
  width: 3.42857143%;
  max-width: 48px;
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
}


/* ---------------------------------------------------------
satei
----------------------------------------------------------*/
.satei{
    text-align: center;
    position: relative;
    margin: 10px 0 0;
    clear: both;
}
.satei p{
  color: #00316C;
  font-weight: bold;
  font-size: 1.4em;
  padding-bottom: 15px;
}
input{
  padding: 12px 10px;
}
input.btn_submit {
  cursor: pointer;
  display: block;
  width: 450px;
  height: 65px;
  border: none;
  text-indent: -9999px;
  background: url(../images/submitBtn.jpg) no-repeat 0 0;
  margin:30px auto 20px;
}
input.name{
  width: 400px;
}
input.number{
  width: 120px;
}
@media screen and (max-width: 768px) {
input.btn_submit {
  width: 70%;
  background-size:contain;
}
input.name{
  width: 55%;
}
input.number{
  width: 20%;
}
}

/* ---------------------------------------------------------
見出し
----------------------------------------------------------*/
.subttl{
  text-align: center;
  background-color: #F4F4F4;
  padding:60px 0;
}
.subttl h3{
  display: inline-block;
  color: #00316C;
  font-size: 1.7em;
  font-weight: bold;
  background:url(../images/h3_bg.png) bottom repeat-x;
  background-size: 20px;
  padding-bottom: 5px;
}
@media only screen and (max-width: 768px) {
.subttl{
  padding:40px 0;
}
.subttl h3{
  font-size: 1.4em;
}
}
/* ---------------------------------------------------------
case1
----------------------------------------------------------*/
.case1 .l-column{
  width: 610px;
  padding: 15px;
  color: #00316C;
  float: left;
}
@media screen and (max-width: 768px) {
.case1 .l-column{
  width: 100%;
  padding: 1%;
  color: #00316C;
  float: none;
}
}
.case1 .dltable{
  width: 580px;
  padding: 10px 20px 0;
  background-color: #F4F4F4;
}
@media only screen and (max-width: 768px) {
.case1 .dltable{
  width: 100%;
  padding: 1%;
}
}
.case1 .l-column:before{
  content:url(../images/img_case1.jpg);
}
.case1 .row1 {
  width: 20%;
}
.case1 .row2 {
  width: 30%;
  text-align: right;
}
.case1 .row3 {
  width: 20%;
}
.case1 .row4 {
  width: 30%;
  text-align: right;
}
@media only screen and (max-width: 768px) {
.case1 .row1 {
  width: 18%;
}
.case1 .row2 {
  width: 27%;
  text-align: right;
}
.case1 .row3 {
  width: 18%;
}
.case1 .row4 {
  width: 32%;
  text-align: right;
}
}
.case1 .adjust{
  margin-top: -0.6em;
}
.case1 dl {
  display: flex;
  flex-wrap: wrap;
  justify-content: left;
  text-align: center;
  font-size: 1.3em;
  font-weight: bold;
  color: #00316C;
}
.case1 dl:last-child {
  border-bottom: none;
}
.case1 dl dt {
  padding: 10px 0;
  color: #333;
}
.case1 dl dd {
  padding: 10px 0;
}
.explain{
  width: 580px;
  padding: 15px 40px 10px;
  color: #00316C;
  background-color: #F4F4F4;
  font-weight: bold;
  clear: both;
  margin-top: 50px;
}
@media only screen and (max-width: 768px) {
.explain{
  width: 100%;
  padding: 5%;
  margin: 0;
}
}
.f-column{
  width: 100%;
  clear: both;
}
.f-column table{
  width: 100%;
}
.f-column table th,.f-column table td{
  border: solid 1px #333333;
  padding: 10px;
}
.f-column table th{
  background-color: #E2E2E2
}
.f-column table .tbl1{
  width: 40%;
}
.f-column table .tbl2{
  width: 28%;
}
.f-column table .tbl3{
  width: 16%;
}
.f-column table .tbl4{
  width: 16%;
}


/* ---------------------------------------------------------
case2
----------------------------------------------------------*/
.case2 .inner:before{
  content:url(../images/img_case2.jpg);
}
.case2 .caselist{
  padding: 30px 40px 25px;
  color: #00316C;
  background-color: #F4F4F4;
  font-weight: bold;
  font-size: 1.4em;
}
@media only screen and (max-width: 768px) {
.case2 .caselist{
  padding: 30px 20px 25px;
}
}
.case2 .r-column{
  padding: 15px;
  color: #00316C;
  float: right;
}


/* ---------------------------------------------------------
実績
----------------------------------------------------------*/
.jisseki dl dl,.jisseki dl dt,.jisseki dl dd{
  box-sizing: border-box;
}
.jisseki dl{
  font-size: 2em;
  font-weight: bold;
  color: #00316C;
  margin: 50px 0;
}
@media only screen and (max-width: 768px) {
.jisseki dl{
  font-size: 1.4em;
  padding: 0 5%;
  margin: 10px 0;
}
}
.jisseki dl dt{
  width: 55%;
  font-weight: bold;
  float: left;
}
@media only screen and (max-width: 768px) {
.jisseki dl dt{
  width: 60%;
}
}
.jisseki dl dd{
  color:#FF3333;
  font-weight: bold;
}
.jisseki dl dd:before{
  content: "⇒";
  font-weight: bold;
  color: #00316C;
  margin-right: 1em;
}
.jisseki dl dd:after {
  content: '';
  display: block;
  clear: both;
}

/* ---------------------------------------------------------
約束
----------------------------------------------------------*/
.promise{
  color: #00316C;
}
.promise .icn{
  font-size: 1.4em;
  font-weight: bold;
}
.promise .icn:before{
  content: url(../images/img_icn.jpg);
  margin-right: 0;
}
.promise .explain{
  width: 100%;
  padding: 30px 4% 25px;
  color: #00316C;
  background-color: #F4F4F4;
  font-weight: bold;
  font-size: 1.2em;
}
.ams{
  font-size: 2.0em;
  font-weight: bold;
  border: solid 1px #00316C;
  padding: 0.5em 1em 0.4em;
  text-align: center;
  margin: 50px 0; 
}
@media only screen and (max-width: 768px) {
.ams{
  font-size: 1.4em;
  margin: 50px 0 20px;
}
.promise img{
  margin: 0.6em;
}
}

/*--------------------------------------------
一覧ページ 
--------------------------------------------*/
.voice-ttl {
  font-size: 31px;
  font-size: 3.1rem;
  font-weight: bold;
  line-height: 31px;
  color: #00316c;
  padding-top: 60px;
  padding-bottom: 40px;
  text-align: center; }
  @media all and (max-width: 640px) {
    .voice-ttl {
      font-size: 20px;
      font-size: 2rem;
      padding-top: 11.71875%;
      padding-bottom: 9.375%; } }
  .voice-ttl--index {
    padding-top: 90px;
    padding-bottom: 55px; }
    @media all and (max-width: 640px) {
      .voice-ttl--index {
        font-size: 20px;
        font-size: 2rem;
        padding-top: 11.71875%;
        padding-bottom: 9.375%; } }

.voice-posts {
  padding-bottom: 80px; }
  @media all and (max-width: 640px) {
    .voice-posts {
      padding-bottom: 0%; } }
  .voice-posts--index {
    padding-bottom: 50px; }
    @media all and (max-width: 640px) {
      .voice-posts--index {
        padding-bottom: 12.2%; } }
  .voice-posts::after {
    content: "";
    display: table;
    clear: both; }
  @media all and (min-width: 641px) {
    .voice-posts__item {
      float: left;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      width: calc((100% - 100px) / 3); }
      .voice-posts__item:nth-child(3n-1), .voice-posts__item:nth-child(3n-2) {
        margin-right: 50px; }
      .voice-posts__item:nth-child(3n+4) {
        clear: left; }
      .voice-posts__item:not(:nth-child(-n+3)) {
        margin-top: 50px; } }

.post-box {
  position: relative;
  display: block; }
  @media all and (max-width: 640px) {
    .post-box {
      padding-bottom: 8.4375%; }
      .post-box::after {
        content: "";
        display: table;
        clear: both; } }
  .post-box__wraplink {
    display: block; }
    .post-box__wraplink:hover {
      opacity: 0.8; }
  .post-box__img-pc {
    margin-bottom: 15px;
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 200px; }
    @media all and (max-width: 640px) {
      .post-box__img-pc {
        display: none; } }
  .post-box__img-sp {
    float: left;
    background-size: cover;
    background-position: center;
    width: 42.2%;
    height: 84px;
    height: 25.9vw; }
    @media all and (min-width: 641px) {
      .post-box__img-sp {
        display: none; } }
  .post-box__meta {
    margin-bottom: 16px; }
    @media all and (max-width: 640px) {
      .post-box__meta {
        margin-bottom: 5.03%; } }
  .post-box__txt {
    font-size: 15px;
    font-size: 1.5rem;
    font-weight: bold;
    color: #00316c;
    margin-bottom: 20px; }
    @media all and (max-width: 640px) {
      .post-box__txt {
        float: right;
        max-width: 50%;
        font-size: 15px;
        font-size: 1.5rem;
        line-height: 1.53;
        margin-bottom: 5.517%; } }
  .post-box__read-more {
    font-size: 12px;
    font-size: 1.2rem;
    color: #00316c;
    float: right;
    display: inline-block;
    position: relative; }
    @media all and (max-width: 640px) {
      .post-box__read-more {
        font-size: 14px;
        font-size: 1.4rem;
        clear: right; } }
    .post-box__read-more::after {
      content: "";
      display: block;
      height: 1px;
      width: 100%;
      background-color: #00316c;
      position: absolute;
      bottom: 1px;
      -webkit-transition: background-color 0.2s;
      -o-transition: background-color 0.2s;
      transition: background-color 0.2s; }
    .post-box__read-more:hover::after {
      background-color: transparent; }

.voice-meta__tag {
  font-size: 13px;
  font-size: 1.3rem;
  line-height: 1;
  padding: 0.3em 0.92em 0.3em 1.15em;
  display: inline-block;
  margin-bottom: 5px;
  margin-right: 10px; }
  @media all and (max-width: 640px) {
    .voice-meta__tag {
      font-size: 12px;
      font-size: 1.2rem;
      margin-bottom: 8px;
      vertical-align: middle; } }
  .voice-meta__tag--buy {
    background-color: #00a8ff;
    color: #fff;
    letter-spacing: 0.225em; }
  .voice-meta__tag--sell {
    background-color: #f20070;
    color: #fff;
    letter-spacing: 0.225em; }
  .voice-meta__tag--single {
    font-size: 18px;
    font-size: 1.8rem;
    margin-bottom: 10px;
    margin-right: 18px; }
    @media all and (max-width: 640px) {
      .voice-meta__tag--single {
        font-size: 12px;
        font-size: 1.2rem;
        margin-bottom: 8px;
        margin-right: 10px; } }

.voice-meta__buyer {
  font-size: 14px;
  font-size: 1.4rem;
  color: #000; }
  .voice-meta__buyer--single {
    font-size: 16px;
    font-size: 1.6rem; }
    @media all and (max-width: 640px) {
      .voice-meta__buyer--single {
        font-size: 14px;
        font-size: 1.4rem; } }

.voice-meta__time {
  display: block;
  font-size: 14px;
  font-size: 1.4rem;
  color: #000; }
  .voice-meta__time--single {
    font-size: 16px;
    font-size: 1.6rem; }
    @media all and (max-width: 640px) {
      .voice-meta__time--single {
        font-size: 14px;
        font-size: 1.4rem; } }
    @media all and (min-width: 641px) {
      .voice-meta__time--single.voice-meta__time--sell {
        margin-left: 3em; } }
  .voice-meta__time--sell {
    display: inline-block; }

.voice-meta__house {
  font-size: 14px;
  font-size: 1.4rem;
  color: #000;
  display: inline-block;
  margin-bottom: 3px; }
  .voice-meta__house--single {
    font-size: 16px;
    font-size: 1.6rem; }
    @media all and (max-width: 640px) {
      .voice-meta__house--single {
        font-size: 14px;
        font-size: 1.4rem; } }

.voice-hr {
  border-top-color: #233d65;
  border-bottom-color: transparent;
  border-width: 1px;
  margin: 0; }

.voice-nav {
  padding: 80px 0 115px; }
  @media all and (max-width: 640px) {
    .voice-nav {
      padding-top: 11.71875%;
      padding-bottom: 8.4375%; } }
  @media all and (min-width: 641px) {
    .voice-nav__list {
      margin-right: -5%;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
      .voice-nav__list::after {
        content: "";
        display: table;
        clear: both; } }
  @media all and (min-width: 641px) {
    .voice-nav__item {
      display: block;
      width: 28.33%;
      float: left;
      margin-right: 5%; }
      .voice-nav__item:nth-child(3n+4) {
        clear: left; }
      .voice-nav__item:not(:nth-child(-n+3)) {
        margin-top: 5%; } }
  @media all and (max-width: 640px) {
    .voice-nav__item:not(:last-of-type) {
      margin-bottom: 11.71875%; } }
  .voice-nav__link {
    display: block; }
  .voice-nav__thumb {
    margin-bottom: 25px; }
  .voice-nav__img {
    width: 100%;
    height: auto; }
  .voice-nav__ttl {
    color: #1b2e53;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1;
    font-weight: bold;
    margin-bottom: 15px; }
  .voice-nav__txt {
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1.71;
    color: #181818; }
