@charset "UTF-8";
/* CSS Document */

*, *::before, *::after {
  box-sizing: border-box;
}
html {
  -webkit-text-size-adjust: 100%;
  font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 62.5%;
  color: #444;
}
main {
  display: block; /* for IE */
}
.pc-only {
  display: none;
}
.clearfix::after {
	content: "";
	display: table;
	clear: both;
}

@media (min-width: 768px) {
  .pc-only {
    display: block;
  }
  .sp-only {
    display: none;
  }
}

/******************************
@media (min-width: 576px) { ... }
@media (min-width: 768px) { ... }
@media (min-width: 992px) { ... }
@media (min-width: 1200px) { ... }
******************************/



/******************************
 header
******************************/

header {
  border-bottom: 3px solid #f90;
  background-color: #6bc7f1;
}
/* h-bar */

.h-bar-wrap {
  background-color: #f90;
}
.h-bar {
  height: 50px;
  display: flex;
  align-items: center;
  padding-left: 10px;
}
.h-logo {
  margin-right: auto;
}
.h-logo img {
  width: 117px;
  height: auto;
  vertical-align: middle;
} 
.h-bar-login-name {
  font-size: 1.3rem;
  line-height: 1.2;
  font-weight: bold;
  background-color: #fffadb;
  padding: 3px 5px 2px;
  border-radius: 3px;
}
.h-bar-sp-wrap {
  position: relative;
}
#h-bar-sp {
  position: fixed;
  z-index: 999;/*ナビのスタート位置と形状*/
  top:50px;
  right: -120%;
  width: 100%;
  height: 100vh;/*ナビの高さ*/
  background-color: rgba(0, 0, 0, 0.5);
  transition: all 0.6s;
}
#h-bar-sp.panelactive{
  right: 0;/*アクティブクラスがついたら位置を0に*/
}
#h-bar-sp.panelactive #h-bar-nav-scroll { /*ナビのスクロール（数が増えた場合）*/
  position: fixed;
  z-index: 999; 
  width: 100%;
  height: 100vh;/*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.h-bar-nav-sp {
  z-index: 999;
}
.h-bar-nav-sp li {
  list-style: none;
}
.h-bar-nav-sp li a {
  padding: 7px 15px;
  display: block;
  text-decoration: none;
  font-size: 1.6rem;
  color: #42250f;
  background-color: #fff;
  border-bottom: 1px solid #ccc;
}
.h-bar-nav-sp li img {
  width: 30px;
  height: 30px;
  vertical-align: middle;
  margin-right: 10px;
}
.openbtn {
  position: relative;
  z-index: 9999;/*ボタンを最前面に*/
  cursor: pointer;
  width: 50px;
  height:50px;
}
.openbtn span {
  display: inline-block;
  transition: all .4s;
  position: absolute;
  left: 14px;
  height: 3px;
  border-radius: 2px;
  background-color: #42250f;
  width: 24px;
}
.openbtn span:nth-of-type(1) {
  top: 15px; 
}
.openbtn span:nth-of-type(2) {
  top: 23px;
}
.openbtn span:nth-of-type(3) {
  top: 31px;
}
.openbtn.active span:nth-of-type(1) {
  top: 18px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 24px;
}
.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}
.openbtn.active span:nth-of-type(3) {
  top: 30px;
  left: 18px;
  transform: translateY(-6px) rotate(45deg);
  width: 24px;
}
.h-bar-pc-wrap {
  display: none;
}

@media (min-width: 768px) {
  .h-bar {
    padding-right: 10px;
  }
  .h-bar-login-name {
    font-size: 1.5rem;
    padding: 4px 8px 3px;
    order: 3;
  }
  .h-bar-sp-wrap {
    display: none;
  }
  .h-bar-pc-wrap {
    display: block;
  }
  .h-bar-nav-pc {
    height: 50px;
    margin-right: 15px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  .h-bar-nav-pc li {
    list-style: none;
    font-size: 1.3rem;
    margin-left: 15px;
  }
  .h-bar-nav-pc a {
    text-decoration: none;
    color: #42250f;
  }
  .h-bar-nav-pc li img {
    width: 30px;
    height: 30px;
    vertical-align: middle;
    margin-right: 5px;
  }
}

@media (min-width: 992px) {
  .h-bar {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* h-main */

.h-main-wrap {
  background-image: url(../images/head-bg.png);
  background-position: bottom;
  background-size: cover;
  padding: 20px 10px 15px;
}
.h-main-left {
  margin-bottom: 20px;
}
.h-main-logo-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 580px;
  margin-left: auto;
  margin-right: auto;
}
.h-main-h1-outer {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 5px;
}
.h-main-h1-img {
  width: 26%;
  max-width: 140px;
}
.h-main-h1-img img {
  width: 100%;
  height: auto;
}
.h-main-h1 {
  color: #42250f;
  font-size: 1.4rem;
  font-feature-settings: "palt";
  line-height: 1.4;
  margin-bottom: 10px;
  margin-right: 5px;
  text-align: center;
}
.h-main-h1 span {
  font-size: 1.3rem;
  display: block;
}
.h-main-logo img {
  width: 100%;
  height: auto;
}
.h-main-logo {
  width: 40%;
  max-width: 150px;
  height: auto;
  margin-right: 4%;
}
.h-main-logo-text {
  width: 56%;
  font-size: 1.2rem;
}
.balloon {
  position: relative;
  display: inline-block;
  padding: 8px;
  background: #fff;
  border-radius: 15px;
  border: solid 2px #42250f;
}
.balloon:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -24px;
  margin-top: -12px;
  border: 12px solid transparent;
  border-right: 12px solid #FFF;
  z-index: 2;
}
.balloon:after {
  content: "";
  position: absolute;
  top: 50%;
  left: -29px;
  margin-top: -14px;
  border: 14px solid transparent;
  border-right: 14px solid #42250f;
  z-index: 1;
}
.balloon p {
  margin: 0;
  padding: 0;
}
.h-main-logo-text a {
  display: block;
  text-align: center;
  background-color: #f90;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  padding: 5px;
  border-radius: 5px;
  margin-top: 5px;
}
.h-main-logo-text a:hover {
  background-color: #f80;
}
.h-nav-list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin-left: auto;
  margin-right: auto;
}
.h-nav-list li:not(:last-of-type) {
  margin-right: 10px;
}
.h-nav-list a {
  display: block;
  background-color: #fffadb;
  padding: 10px;
  border-radius: 5px;
  text-decoration: none;
  font-size: 1.2rem;
  font-weight: bold;
  color: #42250f;
  border: 1px solid #bda47d;
  margin-bottom: 5px;
}
.h-nav-list a:hover {
  background-color: #fff7bf;
}

@media (min-width: 768px) {
  .h-main-wrap {
    padding: 20px 15px;
  }
  .h-main-h1 {
    font-size: 2.4rem;
  }
  .h-main-h1 span {
    font-size: 1.6rem;
    margin-top: 5px;
  }
  .h-nav-list a {
    font-size: 1.4rem;
    margin-bottom: 0;
  }
}

@media (min-width: 992px) {
  .h-main-wrap {
    background-repeat: repeat-x;
    background-size: contain;
    padding: 20px 15px 15px;
  }
  .h-main {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .h-main-left {
    margin-bottom: 0;
  }
  .h-main-h1-outer {
    margin-bottom: 10px;
  }
  .h-main-h1 {
    font-size: 2.8rem;
    margin-right: 10px;
  }
  .h-main-h1 span {
    font-size: 1.8rem;
    margin-top: 5px;
  }
  .h-main-logo {
    max-width: 180px;
  }
  .h-main-logo-text {
    font-size: 1.4rem;
  }
  .balloon {
    padding: 12px 15px;
  }
  .h-nav-list {
    justify-content: space-between;
  }
  .h-nav-list li:not(:last-of-type) {
    margin-right: 10px;
  }
}


/******************************************
 breadcrumb
*******************************************/

.breadcrumb {
  padding: 7px 15px;
}
.breadcrumb li {
  display: inline;
  list-style: none;
}
.breadcrumb li + li::before {
  content: '＞';
  display: inline-block;
  margin: 0 5px;
  color: #aaa;
}
.breadcrumb a {
  text-decoration: none;
  color: #444;
  line-height: 1.2;
}
.breadcrumb li span {
  color: #ccc;
}

@media (min-width: 768px) {
  .breadcrumb {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    font-size: 1.2rem;
  }
}


/******************************************
 bg-container main-content
*******************************************/

.bg-container {
  background-image: url(../images/footer-bg.png),linear-gradient(0deg, rgba(214, 255, 234, 1), rgba(255, 255, 255, 1) 30% 70%, rgba(210, 240, 255, 1));
  background-repeat: repeat-x, no-repeat;
  background-position: bottom;
}
.layout01 .main-container {
  padding: 35px 0 70px;
}

.layout02 .main-container {
  padding: 30px 15px 70px;
}

@media (min-width: 768px) {
  .layout01 .main-container {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    padding: 60px 15px;
  }
  .layout02 .main-container {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    padding: 60px 15px;
  }
  .main-flex {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }
}

/* h2 */

h2 {
  font-size: 2.3rem;
  line-height: 1.4;
  font-weight: bold;
  text-align: center;
  margin-bottom: 20px;
  color: #42250f;
  display: flex;
  align-items: center;
  justify-content: center;
}
h2 img {
  height: 30px;
  width: 30px;
  margin-right: 7px;
}

@media (min-width: 768px) {
  h2 {
    font-size: 2.8rem;
    margin-bottom: 30px;
  }
  h2 img {
    height: 35px;
    width: 35px;
  }
}


/******************************************
 footer
*******************************************/

footer {
  background-color: #fffadb;
}
.f-cont {
  padding: 30px 15px;
}
.f-logo-wrap {
  font-size: 1.2rem;
  text-align: center;
}
.f-logo-wrap img {
  width: 150px;
  height: auto;
}
.mikke-character {
  text-align: center;
  height: auto;
}
.f-prefectures {
  display: none;
}
.copyright {
  padding: 10px;
  background-color: #f90;
  font-size: 1.2rem;
  text-align: center;
  font-family: "Roboto", "Helvetica Neue", arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", meiryo, sans-serif;
}

@media (min-width: 768px) {
  .f-cont {
    padding: 40px 15px 35px;
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    justify-content: space-between;
  }
  .f-logo-wrap {
    width: 250px;
  }
  .f-prefectures-wrap {
    flex: 1;
    margin-left: 50px;
  }
  .f-prefectures {
    display: flex;
    flex-wrap: wrap;
  }
  .f-prefectures li {
    font-size: 1.2rem;
    line-height: 1;
    list-style: none;
    border-right: 1px solid #bda47d;
    padding-right: 10px;
    margin-right: 10px;
    margin-bottom: 12px;
  }
  .f-prefectures a {
    text-decoration: none;
    color: #42250f;
  }
  .f-prefectures a:hover {
    color: #8e7c6f;
  }
}


/******************************************
 search-category
*******************************************/

.search-category {
  margin-bottom: 35px;
}
.btn-estate-wrap h3 {
  background-color: #42250f;
  color: #fff;
  padding: 5px;
  text-align: center;
  font-size: 1.8rem;
}
.btn-estate-wrap li {
  list-style: none;
}
.btn-estate-wrap li a {
  display: flex;
  align-items: center;
  padding: 10px 20px;
  text-decoration: none;
  color: #42250f;
  font-size: 1.6rem;
  line-height: 1.2;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.1rem;
  background-color: #fffadb;
  border-bottom: 2px solid #42250f;
  transition: 0.2s;
}
.btn-estate-wrap li a:hover {
  background-color: #fff7bf;
  transition: 0.2s;
}
.btn-estate-wrap img {
  width: 40px;
  height: auto;
  margin-right: 30px;
}

@media (min-width: 768px) {
  .search-category {
    margin-bottom: 60px;
  }
  .btn-estate-wrap {
    display: flex;
    justify-content: space-between;
  }
  .apartment,
  .house,
  .land {
    width: 32%;
    margin-bottom: 0;
    padding: 10px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  }
  .btn-estate-wrap h3 {
    margin-bottom: 20px;
    border-radius: 5px;
  }
  .btn-apartment,
  .btn-house {
    display: flex;
    justify-content: space-between;
  }
  .btn-land {
    display: flex;
    justify-content: center;
  }
  .btn-apartment li,
  .btn-house li,
  .btn-land li {
    width: 48%;
  }
  .btn-estate-wrap li a {
    display: block;
    text-align: center;
    font-size: 1.6rem;
    line-height: 1.2;
    padding: 15px 5px;
    border: 2px solid #42250f;
    border-radius: 8px;
  }
  .btn-estate-wrap img {
    display: block;
    width: 40px;
    height: auto;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 10px;
  }
}

@media (min-width: 992px) {
  .apartment,
  .house,
  .land {
    padding: 20px;
  }
}


/******************************************
 search-area
*******************************************/

.search-area h2 {
  color: #254612;
}
.search-area-lists {
  border-bottom: 2px solid #254612;
  list-style: none;
}
.search-area-btn {
  height: 100%;
  padding: 12px 20px;
  text-decoration: none;
  color: #254612;
  font-size: 1.6rem;
  line-height: 1.2;
  font-weight: bold;
  letter-spacing: 0.3rem;
  background-color: #e5f6e3;
  border-top: 2px solid #254612;
  transition: 0.2s;
  position: relative;
}
.search-area-btn::after {
  position: absolute;
  content:'';
  display: block;
  width: 12px;
  height: 12px;
  border-right: 2px solid #254612;
  border-bottom: 2px solid #254612;
  top:30%;
  right: 30px;
  transform: rotate(45deg);
  transition: 0.2s;
}
.search-area-btn.close::after{ /*　closeというクラスがついたら形状変化　*/
  top:40%;
  transform: rotate(225deg);
}
.search-prefecture-lists {
  display: none;
  list-style: none;
}
.search-prefecture-lists a {
  display: block;
  text-align: center;
  padding: 12px 20px;
  text-decoration: none;
  color: #254612;
  font-size: 1.6rem;
  line-height: 1.2;
  font-weight: bold;
  background-color: #fff;
  letter-spacing: 0.3rem;
  border-bottom: 1px solid #254612;
  transition: 0.2s;
}
.search-prefecture-lists a:hover {
  color: #f90;
  transition: 0.2s;
}
.search-prefecture-lists li:last-child a {
  border-bottom: none;
}
.search-prefecture-lists li:first-child a {
  border-top: 2px solid #254612;
}

@media (min-width: 768px) {
  .search-area-lists {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border-top: none;
    border-bottom: none;
  }
  .search-area-lists > li {
    width: 23.5%;
    margin-bottom: 20px;
    background-color: #e5f6e3;
    padding: 10px 10px 5px;
    border-radius: 10px;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  }
  .search-area-btn {
    border: none;
    text-align: center;
    background-color: #254612;
    color: #fff;
    border-radius: 5px;
    margin-bottom: 10px;
    padding: 5px;
  }
  .search-area-btn::after {
    content: none;
  }
  .search-prefecture-lists {
    display: block;
    flex-wrap: wrap;
  }
  .search-prefecture-lists li {
    display: inline;
  }
  .search-prefecture-lists a {
    display: inline-block;
    border: none;
    font-size: 1.5rem;
    font-weight: normal;
    padding: 5px 10px;
    letter-spacing: normal;
    background: none;
  }
  .search-prefecture-lists li:first-child a {
    border-top: none;
  }
}

@media (min-width: 992px) {
  .search-area-lists > li {
    padding: 20px 20px 15px;
  }
}











/******************************************
 top-sub-nav01
*******************************************/

.top-sub-nav01 {
  overflow: hidden;
}
.top-sub-nav01-inner {
  padding: 40px 15px;
}
.top-sub-nav01-lists {
  list-style: none;
}
.top-sub-nav01-lists li {
  margin-bottom: 25px;
}
.top-sub-nav01-lists li:last-of-type {
  margin-bottom: 0;
}
.top-sub-nav01-btn {
  display: block;
  text-decoration: none;
  background-color: #fffadb;
  border: 2px solid #bda47d;
  border-radius: 5px;
  padding: 10px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
}
.top-sub-nav01-btn-inner {
  display: flex;
  justify-content: center;
}
.top-sub-nav01-img img {
  width: 100%;
  max-width: 100px;
  height: auto;
}
.top-sub-nav01-img {
  width: 35%;
  display: flex;
  align-items: center;
  justify-content: end;
  margin-right: 5%;
}
.top-sub-nav01-info {
  width: 60%;
}
.top-sub-nav01-ttl {
  font-size: 1.6rem;
  font-weight: bold;
  color: #444;
  margin-bottom: 5px;
}
.top-sub-nav01-text {
  font-size: 1.4rem;
  color: #444;
}

@media (min-width: 768px) {
  .top-sub-nav01-inner {
    margin-left: auto;
    margin-right: auto;
    padding: 70px 15px;
    max-width: 1100px;
  }
  .top-sub-nav01-lists {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
  }
  .top-sub-nav01-lists li {
    margin-bottom: 0;
    width: 32%;
  }
  .top-sub-nav01-btn {
    height: 100%;
    padding: 15px;
  }
  .top-sub-nav01-ttl {
    font-size: 1.7rem;
  }
  .top-sub-nav01-text {
    font-size: 1.5rem;
  }
}

.top-sub-nav01-lists [data-aos="slide-btn"] {
  opacity: 0;
  transition-property: transform, opacity;
}

.top-sub-nav01-lists [data-aos="slide-btn"].aos-animate {
  opacity: 1;
}

.top-sub-nav01-lists [data-aos="slide-btn"]:nth-of-type(odd) {
  transform: translateX(-150px);
}

.top-sub-nav01-lists [data-aos="slide-btn"]:nth-of-type(even) {
  transform: translateX(150px);
}

.top-sub-nav01-lists [data-aos="slide-btn"].aos-animate {
  transform: translateX(0);
}

@media (min-width: 768px) {
  .top-sub-nav01-lists [data-aos="slide-btn"]:nth-of-type(odd) {
      transform: translateY(150px);
  }

  .top-sub-nav01-lists [data-aos="slide-btn"]:nth-of-type(even) {
    transform: translateY(150px);
}

  .top-sub-nav01-lists [data-aos="slide-btn"].aos-animate {
      transform: translateY(0);
  }
}


/******************************************
 top-sub-nav02
*******************************************/

.top-sub-nav02 h3 {
  font-size: 1.8rem;
  margin-bottom: 10px;
}
.top-sub-nav02 p {
  font-size: 1.4rem;
}
.top-sub-nav02 a {
  display: block;
  max-width: 400px;
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
  padding: 10px 0;
  border-radius: 20px;
  background-color: rgba(255, 153, 0, .9);
  border: 2px solid #f90;
  text-decoration: none;
  font-size: 1.4rem;
  font-weight: bold;
  color: #fff;
  transition: 0.3s;
}
.top-sub-nav02 a:hover {
  background-color: rgba(255, 153, 0, .2);
  transition: 0.3s;
}
.top-sub-nav02-contact {
  background-image: url(../images/top-sub-nav02-contact.jpg);
  background-size: cover;
  background-position: center center;
}
.top-sub-nav02-mypage {
  background-image: url(../images/top-sub-nav02-mypage.jpg);
  background-size: cover;
  background-position: center center;
}
.top-sub-nav02-contact-main,
.top-sub-nav02-mypage-main {
  padding: 40px 15px;
  text-align: center;
}

@media (min-width: 768px) {
  .top-sub-nav02 h3 {
    font-size: 2.8rem;
    margin-bottom: 15px;
  }
  .top-sub-nav02 p {
    font-size: 1.6rem;
  }
  .top-sub-nav02-contact-main,
  .top-sub-nav02-mypage-main {
    margin-left: auto;
    margin-right: auto;
    padding: 60px 15px 65px;
    max-width: 1100px;
  }
  .top-sub-nav02 a {
    display: block;
    margin-top: 20px;
    padding: 15px;
    border-radius: 30px;
    font-size: 1.7rem;
  }
}

.top-sub-nav02 [data-aos="slide-btn"] {
  opacity: 0;
  transition-property: transform, opacity;
}
.top-sub-nav02 [data-aos="slide-btn"].aos-animate {
  opacity: 1;
}

/* top-sub-nav02-m ログイン時 */
.top-sub-nav02-mypage-menu {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.top-sub-nav02-mypage-menu li {
  width: 48%;
}

@media (min-width: 768px) {
  .top-sub-nav02-mypage-menu li {
    width: 32%;
  }
}



/******************************************
 top-sub-nav03
*******************************************/

.top-sub-nav03 {
  overflow: hidden;
}
.top-sub-nav03-inner {
  padding: 40px 15px;
}
.top-sub-nav03-inner a {
  display: flex;
  margin-bottom: 25px;
  border: 1px solid #ddd;
  text-decoration: none;
}
.top-sub-nav03-inner a:last-of-type {
  margin-bottom: 0;
}
.top-sub-nav03-img {
  overflow: hidden;
  width: 130px;
  height: 130px;
}
.top-sub-nav03-img img {
  transition: 0.3s;
  vertical-align: top;
  width: 100%;
  height: auto;
}
.top-sub-nav03-inner a:hover img {
  transform: scale(1.1);
  transition: 0.3s;
}
.top-sub-nav03-text {
  color: #444;
  font-size: 1.4rem;
  line-height: 1.4;
  flex: 1;
  padding-right: 10px;
  padding-left: 10px;
  background-color: #fff;
}
.ttop-sub-nav03-inner a:hover .top-sub-nav03-text {
  background-color: #f8fcf9;
}
.top-sub-nav03-text p:first-child {
  margin-top: 10px;
  margin-bottom: 10px;
  font-weight: bold;
  font-size: 1.6rem;
}

@media (min-width: 768px) {
  .top-sub-nav03-inner {
    margin-left: auto;
    margin-right: auto;
    padding: 70px 15px;
    max-width: 1100px;
  }
  .top-sub-nav03-inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .top-sub-nav03-inner a {
    width: 48%;
  }
  .top-sub-nav03-text p:first-child {
    font-size: 1.7rem;
  }
  .top-sub-nav03-text p:last-child {
    font-size: 1.5rem;
  }
  .top-sub-nav03-img {
    width: 140px;
    height: 140px;
  }
}

@media (min-width: 960px) {
  .top-sub-nav03-inner a {
    width: 32%;
    margin-bottom: 0;
  }
}

.top-sub-nav03-inner [data-aos="slide-btn"] {
  opacity: 0;
  transition-property: transform, opacity;
}

.top-sub-nav03-inner [data-aos="slide-btn"].aos-animate {
  opacity: 1;
}

.top-sub-nav03-inner [data-aos="slide-btn"]:nth-of-type(odd) {
  transform: translateX(-150px);
}

.top-sub-nav03-inner [data-aos="slide-btn"]:nth-of-type(even) {
  transform: translateX(150px);
}

.top-sub-nav03-inner [data-aos="slide-btn"].aos-animate {
  transform: translateX(0);
}

@media (min-width: 768px) {
  .top-sub-nav03-inner [data-aos="slide-btn"]:nth-of-type(odd) {
      transform: translateY(150px);
  }

  .top-sub-nav03-inner [data-aos="slide-btn"]:nth-of-type(even) {
    transform: translateY(150px);
  }

  .top-sub-nav03-inner [data-aos="slide-btn"].aos-animate {
      transform: translateY(0);
  }
}





/******************************************
 top-side-m
*******************************************/

.top-side-m {
  background-color: #fffef8;
}
.top-side-m-inner {
  padding: 30px 15px 0;
}
.top-side-m-contents {
  background-color: #fff7bf;
  padding: 15px;
  border-radius: 10px;
}
.top-side-m h3 {
  background-color: #fff7bf;
  color: #42250f;
  text-align: center;
  margin-bottom: 15px;
  line-height: 1;
  font-size: 1.4rem;
  font-weight: bold;
}
.top-side-m-menu {
  background-color: #fff;
  border-radius: 5px;
  padding: 10px 10px 5px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  list-style: none;
}
.top-side-m-menu li {
  width: 45%;
  margin-bottom: 5px;
  padding-left: 1.6em;
  background-image: url(../images/icon-side-link2.png);
  background-repeat: no-repeat;
  background-size: 1.2em auto;
  background-position: left center;
}
.top-side-m-menu a {
  text-decoration: none;
  font-size: 1.2rem;
  color: #444;
}
.top-side-m-menu a:hover {
  color: #f80;
}

@media (min-width: 768px) {
  .top-side-m-inner {
    margin-left: auto;
    margin-right: auto;
    padding: 60px 15px 0;
    max-width: 1100px;
  }
  .top-side-m-contents {
    padding: 20px;
  }
  .top-side-m h3 {
    font-size: 1.6rem;
  }
  .top-side-m-menu {
    padding: 20px 20px 15px;
    justify-content: flex-start;
  }
  .top-side-m-menu li {
    width: auto;
    margin-bottom: 5px;
    margin-right: 5em;
  }
  .top-side-m-menu a {
    font-size: 1.4rem;
  }
}


/******************************************
 aside-bottom
*******************************************/

.aside-bottom {
  background-color: #fffef8;
}
.aside-bottom-inner {
  padding: 30px 15px;
}
.aside-bottom-inner div {
  margin-bottom: 10px;
}
.aside-bottom-inner div:last-of-type {
  margin-bottom: 0;
}
.aside-bottom-inner a {
  background-color: #fff;
  border: 1px solid #ccc;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  font-size: 1.5rem;
  padding: 5px;
  color: #444;
  margin-bottom: 7px;
  transition: 0.2s;
}
.aside-bottom-inner a img {
  width: 40px;
  height: auto;
}
.aside-bottom-inner a:hover {
  background-color: #fffadb;
  transition: 0.2s;
}

@media (min-width: 576px) {
  .aside-bottom-inner {
    margin-left: auto;
    margin-right: auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .aside-bottom-inner div {
    width: 49%;
    margin-bottom: 0;
  }
}

@media (min-width: 768px) {
  .aside-bottom-inner {
    padding: 60px 15px;
    max-width: 1100px;
  }
  .aside-bottom-inner div {
    width: 23%;
  }
  .aside-bottom-inner a {
    padding: 8px;
  }
  .aside-bottom-inner-m {
    justify-content: center;
    gap: 20px;
  }
}


/******************************************
 page_navi ページナビ
******************************************/

.page_navi_top {
  margin-bottom: 5px;
}
.page_navi {
  font-size: 1.2rem;
}
.page_navi strong, .page_navi_top strong {
  color: #f90;
  margin-right: 5px;
}
.page_navi ul {
  text-align: right;
}
.page_navi li {
  display: inline;
  line-height: 1;
}
.page_navi li span {
  color: #fff;
  display: inline-block;
  padding: 5px;
  background-color: #f90;
  border: 1px solid #f90;
  font-weight: bold;
}
.page_navi li a {
  color: #aca19a;
  background-color: #fffadb;
  border: 1px solid #bda47d;
  display: inline-block;
  padding: 5px;
  text-decoration: none;
}

@media (min-width: 768px) {
  .page_navi {
    font-size: 1.4rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
}


/******************************************
 sideメニュー
*******************************************/

/* sidebar more-search */

.more-search-top {
  background-color: #fffadb;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
}
.more-search h2 {
  font-size: 1.8rem;
  border-radius: 10px 10px 0 0;
  background-color: #42250f;
  color: #fff;
  padding: 10px;
  margin-bottom: 0;
}
.more-search h2 img {
  width: 25px;
  height: auto;
}
.more-search-form {
  padding: 20px 10px;
  font-size: 1.2rem;
}
.more-search-form dt {
  font-weight: bold;
  padding-left: 10px;
}
.more-search-form dd {
  padding: 10px;
  background-color: #fff;
  margin-bottom: 10px;
  border: 1px solid #ffebcc;
  border-radius: 3px;
}
.more-search-form-none {
  display: none;
}
.m-s-select-w100 select {
  width: 100%;
}
.m-s-input-w100 input {
  width: 100%;
}
.m-s-label-w50 label {
  width: 32%;
  margin-bottom: 3px;
  display: inline-block;
}
.m-s-label-w100 label {
  width: 100%;
  display: inline-block;
}
.more-search-btn {
  margin-top: 20px;
}
.more-search-btn input {
  display: block;
  width: 100%;
  border-radius: 5px;
  padding: 10px;
  border: none;
  text-align: center;
  text-decoration: none;
  font-weight: bold;
  background-color: #f90;
  color: #fff;
  cursor: pointer;
}
.more-search-btn input:hover {
  background-color: #f80;
}
@media (min-width: 768px) {
  .more-search {
    width: 250px;
    margin-top: 5px;
    margin-right: 40px;
  }
  .more-search-form {
    padding: 20px  15px;
    font-size: 1.4rem;
  }
  .m-s-label-w50 label {
    width: 48%;
  }
}

/* sidebar side-search */

.side-search-select {
  background-color: #fff;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
}
.side-search h2 {
  font-size: 1.8rem;
  border-radius: 10px 10px 0 0;
  background-color: #42250f;
  color: #fff;
  padding: 10px;
  margin-bottom: 0;
}
.side-search h2 img {
  width: 25px;
  height: auto;
}
.side-search-nav {
  padding: 15px 10px;
}
.side-search-nav li {
  list-style: none;
  margin-bottom: 10px;
}
.side-search-nav li:last-child {
  margin-bottom: 0;
}
.side-search-nav a {
  background-color: #fffadb;
  padding: 10px;
  text-decoration: none;
  font-size: 1.2rem;
  font-weight: bold;
  color: #42250f;
  border: 1px solid #bda47d;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.side-search-nav a img {
  width: 25px;
  height: auto;
  margin-right: 10px;
}
.side-search-nav a:hover {
  background-color: #fff7bf;
}

@media (min-width: 576px) {
  .side-search-nav {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 15px;
  }
  .side-search-nav li {
    width: 49%;
  }
}

@media (min-width: 768px) {
  .side-search {
    width: 250px;
    margin-top: 5px;
    margin-right: 40px;
  }
  .side-search-nav {
    display: block;
  }
  .side-search-nav a {
    font-size: 1.4rem;
  }
  .side-search-nav li {
    width: 100%;
  }
}


/* sidebar side-menu-m */

.side-menu-m {
  margin-top: 20px;
  border-radius: 10px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
}
.side-menu-m-contents {
  background-color: #fff7bf;
  padding: 10px;
  border-radius: 10px;
}
.side-menu-m h3 {
  color: #42250f;
  text-align: center;
  margin-bottom: 10px;
  line-height: 1;
  font-size: 1.4rem;
  font-weight: bold;
}
.side-menu-m-list {
  background-color: #fff;
  border-radius: 5px;
  padding: 10px 10px 5px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  list-style: none;
}
.side-menu-m-list li {
  width: 45%;
  margin-bottom: 5px;
  padding-left: 1.6em;
  background-image: url(../images/icon-side-link2.png);
  background-repeat: no-repeat;
  background-size: 1.2em auto;
  background-position: left center;
}
.side-menu-m-list a {
  text-decoration: none;
  font-size: 1.2rem;
  color: #444;
}
.side-menu-m-list a:hover {
  color: #f80;
}

@media (min-width: 768px) {
  .side-menu-m-contents {
    padding: 15px;
  }
  .side-menu-m h3 {
    font-size: 1.6rem;
  }
  .side-menu-m-list {
    justify-content: flex-start;
  }
  .side-menu-m-list li {
    width: 100%;
    margin-bottom: 5px;
    background-size: 1.4em;
    padding-left: 2em;
  }
  .side-menu-m-list a {
    font-size: 1.4rem;
  }
}


/******************************************
 お問い合わせフォーム関連
*******************************************/

.form-main {
  margin-bottom: 40px;
  font-size: 1.2rem;
}
.nec {
  color: #ff0000;
  margin: 0 3px;
}
.form-confirm {
  background-color: #fff;
  padding: 20px 10px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  border: 1px solid #eee;
  border-radius: 10px;
  margin-bottom: 20px;
}
.form-confirm table {
  width: 100%;
  border-collapse: collapse;
  font-feature-settings: "palt";
}
.form-confirm th {
  display: block;
  font-weight: bold;
  padding: 5px;
  text-align: left;
  background-color: #ffebcc;
}
.form-confirm td {
  display: block;
  padding: 10px 5px;
}
.form-head-msg {
  padding-left: 5px;
  padding-right: 5px;
  margin-bottom: 5px;
}
.form-error {
  padding-left: 15px;
  margin-bottom: 5px;
}
.form-error-msg {
  color: #f00;
  font-weight: bold;
}
.form-error-list {
  color: #f00;
  margin-left: 20px;
}
.form {
  background-color: #fff;
  padding: 20px 10px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  border: 1px solid #eee;
  border-radius: 10px;
}
.form table {
  width: 100%;
  border-collapse: collapse;
  font-feature-settings: "palt";
}
.form th {
  display: block;
  font-weight: bold;
  padding: 5px;
  text-align: left;
  background-color: #ffebcc;
}
.form td {
  display: block;
  padding: 10px 5px;
}
.form input {
  padding: 3px;
  vertical-align: middle;
  margin-bottom: 3px;
}
.form input[type="text"] {
  width: 100%;
}
.form input[type="password"] {
  width: 100%;
}
.form .input-width-auto input[type="text"] {
  width: auto;
}
.form-td-row2 label {
  float: left;
  width: 100%;
}
.form textarea {
  width: 100%;
  vertical-align: top;
}
.note {
  width: 100%;
  color: #878787;
  line-height: 160%;
  display: block;
}
.sbmt-box {
  margin-top: 20px;
}
.sbmt input[type="submit"],
.sbmt-back input[type="submit"] {
  width: 100%;
  color: #fff;
  font-size: 1.2rem;
  font-weight: bold;
  display: inline-block;
  padding: 10px;
  border-radius: 5px;
  border: none;
  cursor: pointer;
}
.sbmt {
  margin-top: 10px;
}
.sbmt input[type="submit"] {
  background: #f90;
}
.sbmt-back input[type="submit"] {
  background: #613717;
}
.sbmt input[type="submit"]:hover {
  background: #f80;
}
.sbmt-back input[type="submit"]:hover {
  background: #42250f;
}
.form-comp {
  margin-bottom: 10px;
}

@media (min-width: 768px) {
  .form-main {
    flex: 1;
    order: 2;
    margin-bottom: 0;
    font-size: 1.4rem;
  }
  .form-confirm {
    padding: 20px;
    margin-bottom: 30px;
  }
  .form-confirm tr:nth-of-type(odd) {
    background: #fffef8;
  }
  .form-confirm th {
    display: table-cell;
    width: 60%;
    padding: 15px;
    border: 1px solid #e1d3c9;
    background: none;
    vertical-align: top;
  }
  .form-confirm td {
    display: table-cell;
    width: 40%;
    padding: 15px 10px;
    border: 1px solid #e1d3c9;
  }
  .form-head-msg {
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 10px;
  }
  .form-error {
    padding-left: 20px;
    margin-bottom: 10px;
  }
  .form {
    padding: 20px;
  }
  .form tr:nth-of-type(odd) {
    background: #fffef8;
  }
  .form th {
    display: table-cell;
    width: 30%;
    padding: 15px;
    border: 1px solid #e1d3c9;
    background: none;
    vertical-align: top;
  }
  .form td {
    display: table-cell;
    width: 70%;
    padding: 15px 10px;
    border: 1px solid #e1d3c9;
  }
  .form-td-row2 label {
    width: 49%;
  }
  .form-td-row2 label:nth-child(even) {
    margin-left: 1%;
    width: 49%;
  }
  .sbmt-box {
    display: flex;
    justify-content: center;
  }
  .sbmt {
    width: 49%;
    margin-top: 0;
  }
  .sbmt-back {
    width: 49%;
    margin-right: 2%;
  }
  .sbmt input[type="submit"],
  .sbmt-back input[type="submit"] {
    font-size: 1.4rem;
  }
}


/******************************************
 entry
*******************************************/

.entry-item-wrap {
  margin-bottom: 10px;
}
.entry-item {
  background-color: #fffadb;
  border: 1px solid #bda47d;
  display: flex;
  align-items: center;
}
.entry-item + .entry-item {
  border-top: none;
}
.entry-item ul {
  width: 80%;
  border-right: 1px solid #bda47d;
  padding: 5px;
}
.entry-item li {
  list-style: none;
}
.entry-item-name {
  font-weight: bold;
}
.entry-item-delete {
  width: 20%;
  text-align: center;
  padding: 5px;
}
.entry-item-delete .delete {
  text-decoration: none;
  color: #f90;
}
.entry-item-delete .delete:hover {
  color: #f80;
}

@media (min-width: 768px) {
  .entry-item ul {
    padding: 10px;
  }
}


/******************************************
 ログイン
******************************************/

.login {
  font-size: 1.2rem;
}
.login-head-msg {
  padding-left: 5px;
  padding-right: 5px;
  margin-bottom: 5px;
}
.login-footer-msg {
  text-align: center;
  margin-top: 10px;
}
.login-footer-msg a {
  color: #f90;
  text-decoration: none;
}
.login-footer-msg a:hover {
  color: #f80;
}

@media (min-width: 768px) {
  .login {
    font-size: 1.5rem;
  }
  .login-head-msg {
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 10px;
  }
  .login-footer-msg {
    margin-top: 20px;
  }
}


/******************************************
 退会　mi_user_delete_m
******************************************/

@media (min-width: 768px) {
  .user-delete-info {
    text-align: center;
  }
}


/******************************************
 pass_reminder パスワード再発行
******************************************/

.sbmt input[type="button"] {
  width: 100%;
  color: #fff;
  font-size: 1.2rem;
  font-weight: bold;
  display: inline-block;
  padding: 10px;
  border-radius: 5px;
  border: none;
  cursor: pointer;
}
.sbmt input[type="button"] {
  background: #f90;
}
.sbmt input[type="button"]:hover {
  background: #f80;
}

@media (min-width: 768px) {
  .sbmt input[type="button"] {
    font-size: 1.4rem;
  }
}


/******************************************
 owner_regist 会員登録
******************************************/

/******************************************
 review_celebrate 会員登録
******************************************/

.celebrate-item-wrap {
  margin-bottom: 10px;
}
.celebrate-item {
  background-color: #fffadb;
  border: 1px solid #bda47d;
}
.celebrate-item + .celebrate-item {
  border-top: none;
}
.celebrate-item ul {
  padding: 5px;
}
.celebrate-item li {
  list-style: none;
}
.celebrate-item-check {
  margin-top: 5px;
}
.celebrate .form caption {
  text-align: left;
  font-weight: bold;
  color: #613717;
  margin-bottom: 5px;
}
.celebrate .form table {
  margin-bottom: 10px;
}

@media (min-width: 768px) {
  .celebrate-item ul {
    padding: 10px;
  }
  .celebrate .form table {
    margin-bottom: 20px;
  }
}



/******************************************
 search 検索結果
********************************************/


/* search関連ページ　共通 */

.search-results {
  margin-bottom: 60px;
}
.search-tab {
  display: flex;
  justify-content: center;
  border-bottom: 3px solid #f90;
  margin-bottom: 20px;
}
.search-tab li {
  list-style: none;
  width: 50%;
}
.search-tab a {
  display: block;
  font-size: 1.2rem;
  font-weight: bold;
  color: #42250f;
  text-align: center;
  text-decoration: none;
  background-color: #fffadb;
  border: 1px solid #ffebcc;
  padding: 5px;
  border-radius: 10px 10px 0 0;
}
.search-tab a:hover {
  background-color: #ffebcc;
}
.search-tab .current a {
  background-color: #f90;
  color: #fff;
  border: 1px solid #f90;
}
.search-tab .current a:hover {
  background-color: #f80;
  color: #fff;
  border: 1px solid #f90;
}
@media (min-width: 768px) {
  .search-results {
    flex: 1;
    order: 2;
    margin-bottom: 0;
  }
  .search-tab a {
    font-size: 1.6rem;
    padding: 7px;
  }
  .more-search {
    order: 1;
    margin-right: 40px;
  }
}

/* search-sort 並べ替え */

.search-sort {
  display: flex;
  align-items: center;
  padding: 5px;
  background-color: #e5f6e3;
  border-radius: 10px;
  margin-bottom: 5px;
}
.search-sort-ttl {
  width: 5em;
  text-align: center;
  font-size: 1.2rem;
  font-weight: bold;
  color: #254612;
}
.search-sort ul {
  width: calc(100% - 5em);
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  margin-left: 5px;
}
.search-sort li {
  width: 45%;
}
/* .search-sort li:nth-of-type(-n+3) {
  margin-bottom: 5px;
} */
.search-sort a {
  text-decoration: none;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 3px 5px;
  background-color: #336b33;
  color: #fff;
  text-align: center;
  border-radius: 5px;
  font-size: 1rem;
}
.search-sort a:hover{
  background-color: #254612;
}
.search-sort a img {
  margin: 0 3px;
  max-width: 8px;
  height: auto;
}

@media (min-width: 768px) {
  .search-sort {
    padding: 10px;
    margin-bottom: 10px;
  }
  .search-sort-ttl {
    width: 20%;
    font-size: 1.3rem;
  }
  .search-sort ul {
    width: 80%;
  }
  /* .search-sort li:nth-of-type(-n+3) {
    margin-bottom: 0px;
  } */
  .search-sort a {
    font-size: 1.2rem;
  }
  .search-sort a img {
    max-width: 10px;
  }
}

/* item 物件リスト */

.item {
  background-color: #fff;
  padding: 10px;
  border-radius: 10px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  font-size: 1.2rem;
  margin-bottom: 20px;
  border: 1px solid #eee;
}
.item-head {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
  border-bottom: 1px solid #ccc;
}
.item-head h3 {
  margin-left: 10px;
  font-size: 1.4rem;
}
.item-inner {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}
.item-img {
  width: 35%;
}
.item-img img {
  width: 100%;
  height: auto;
}
.item-detail {
  width: 62%;
}
.item-detail dl {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-top: -5px;
  margin-bottom: 5px;
}
.item-detail dt {
  width: 30%;
  border-bottom: 1px dotted #ccc;
  padding: 5px;
  font-weight: bold;
}
.item-detail dd {
  width: 70%;
  border-bottom: 1px dotted #ccc;
  padding: 5px;
}
.item-detail dd a {
  color: #f90;
  text-decoration: none;
}
.item-bottom > div {
  margin-bottom: 8px;
}
.item-bottom > div:last-child {
  margin-bottom: 0;
}
.item-bottom a {
  display: block;
  border-radius: 5px;
  padding: 10px;
  text-align: center;
  text-decoration: none;
  font-weight: bold;
}
.item-btn-keep {
  background-color: #fffadb;
  color: #42250f;
  border: 1px solid #bda47d;
}
.item-btn-keep:hover {
  background-color: #fff7bf;
}
.item-btn-detail {
  background-color: #f90;
  color: #fff;
}
.item-btn-detail:hover {
  background-color: #f80;
}
.item-btn-contact {
  background-color: #613717;
  color: #fff;
}
.item-btn-contact:hover {
  background-color: #42250f;
}

@media (min-width: 576px) {
  .item-bottom {
    display: flex;
    justify-content: space-between;
  }
  .item-bottom > div {
    width: 32%;
    margin-bottom: 0;
  }
}

@media (min-width: 768px) {
  .item-head {
    margin-bottom: 20px;
  }
  .item-head h3 {
    font-size: 1.8rem;
  }
  .item {
    padding: 20px;
    font-size: 1.4rem;
    margin-bottom: 30px;
  }
  .item:last-of-type {
    margin-bottom: 20px;
  }
  .item-inner {
    margin-bottom: 20px;
  }
  .item-detail dt {
    width: 30%;
  }
  .item-detail dd {
    width: 70%;
  }
  .item-bottom a {
    font-size: 1.4rem;
    padding: 10px 5px;
  }
}

/* item-contact-all チェックした物件をまとめて問い合わせ */

.item-contact-all {
  text-align: center;
  font-size: 1.2rem;
  margin-top: 10px;
}
.item-contact-all a {
  display: block;
  margin-top: 5px;
  padding: 10px;
  border-radius: 5px;
  text-align: center;
  text-decoration: none;
  font-weight: bold;
  background-color: #613717;
  color: #fff;
}
.item-contact-all a:hover {
  background-color: #42250f;
}

@media (min-width: 768px) {
  .item-contact-all {
    font-size: 1.4rem;
  }
}


/******************************************
 search map
********************************************/

.search-map {
  margin-bottom: 10px;
}
#map_canvas {
  width: 100%;
  height: 100%;
}
#map_canvas::before {
  content: "";
  display: block;
  padding-top: 75%;
}
.gm-style .gm-style-iw a {
  color: #444;
  text-decoration: none;
}
.gm-style .gm-style-iw a img {
  width: 100%;
  height: auto;
  margin-bottom: 5px;
}
.gm-style .gm-style-iw a .title {
  color: #f90;
  width: 100%;
  max-height: 2.7em;
  font-size: 1.3rem;
  line-height: 1.4;
  overflow: hidden;
}
.gm-style .gm-style-iw .title strong {
  font-weight: normal;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.gm-style .gm-style-iw a p {
  font-size: 1.1rem;
}

@media (min-width: 768px) {

}


/******************************************
 detail
*******************************************/

.detail h2 {
  font-size: 2rem;
}
.detail-catch {
  font-size: 1.4rem;
  text-align: center;
  margin-bottom: 15px;
}
.detail-update {
  text-align: right;
}
.detail-update span {
  display: block;
}
.detail-contents {
  background-color: #fff;
  margin-top: 10px;
  padding: 10px;
  border-radius: 10px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  font-size: 1.2rem;
  margin-bottom: 20px;
  border: 1px solid #eee;
}
.detail-topinfo {
  display: flex;
  flex-wrap: wrap;
}
.detail-topinfo dt {
  width: 30%;
  font-weight: bold;
  border-bottom: 1px dotted #ccc;
  padding: 5px;
}
.detail-topinfo dd {
  width: 70%;
  border-bottom: 1px dotted #ccc;
  padding: 5px;
}
.detail-topinfo dd ul {
  margin-left: 1.5em;
}
.detail-topinfo dd li:empty {
  display: none;
}

@media (min-width: 768px) {
  .detail h2 {
    font-size: 2.8rem;
  }
  .detail-catch {
    font-size: 1.8rem;
    margin-bottom: 25px;
  }
  .detail-update span {
    display: inline;
    margin-left: 1em;
    font-size: 1.4rem;
  }
  .detail-contents {
    padding: 30px;
    font-size: 1.6rem;
  }
  .detail-topinfo dt {
    padding: 10px 0 10px 20px;
  }
  .detail-topinfo dd {
    padding: 10px;
  }
}

/* detail-option */

.detail-option-ul {
  margin-top: 1%;
  font-size: 1rem;
  text-align: center;
  color: #fff;
  display: flex;
  flex-wrap: wrap;
}
.detail-option-ul li {
  list-style: none;
  background-color: #f90;
  padding: 2px 5px;
  margin-right: 1%;
  margin-bottom: 1%;
  border-radius: 3px;
}

@media (min-width: 576px) { 
  .detail-option-ul {
    font-size: 1.2rem;
  }
 }

@media (min-width: 768px) {
  .detail-option-ul li {
    list-style: none;
    background-color: #f90;
  }
}


/* detail-slide */

.detail-slide-wrap {
  margin-top: 20px;
  margin-bottom: 10px;
}
.detail-slide-img-wrap img {
  width: 100%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}
.detail-slide-img-wrap {
  width: 100%;
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
.detail-slide-caption {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 2;
  width: 100%;
  padding: 5px 10px;
  background: rgba(0, 0, 0, .6);
  color: #fff;
}
.detail-slide-caption:empty {
  display: none;
}
.detail-slide-thumb {
  display: none;
}
.slick-prev,.slick-next {
  z-index:2;
}
.slick-prev {
  left: 10px!important;
}
.slick-next {
  right: 10px!important;
}
.slick-arrow:before{
  content:""!important;
  width: 100%!important;
  height: 100%!important;
  position: absolute;
  top: 0;
  left: 0;
}
.slick-next:before{
  background: url(../images/arrow-r.png)!important;
  background-size: contain!important;
}
.slick-prev:before{
  background: url(../images/arrow-l.png)!important;
  background-size: contain!important;
}

@media (min-width: 768px) {
  .detail-slide-wrap {
    margin-top: 40px;
    margin-bottom: 20px;
  }
  .detail-slide-item {
    background-color: #f0f8ff;
    padding: 20px;
    border-radius: 10px;
  }
  .detail-slide-img-wrap {
    width: 500px;
    height: auto;
    position: relative;
  }
  .detail-slide-caption {
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    padding: 5px 10px;
  }
  .detail-slide-thumb {
    display: block;
  }
  .detail-slide-thumb p {
    padding: 5px;
  }
  .detail-slide-thumb img {
    width: 100%;
    height: auto;
    object-fit: cover;
    aspect-ratio: 3/2;
    border: 1px solid #eee;
  }
}

/* detail-map */

.detail .map {
  margin-bottom: 20px;
}
.detail div#map-canvas {
  width: 100%!important;
  height: 250px!important;
}

@media (min-width: 768px) {
  .detail .map {
    margin-bottom: 40px;
  }
  .detail div#map-canvas {
    width: 100%!important;
    height: 450px!important;
  }
}

/* detail-more */

.detail-more {
  line-height: 1.4;
}
.detail-more h3 {
  text-align: center;
  color: #fff;
  font-size: 1.4rem;
  background-color: #6aa845;
  padding: 3px;
}
.detail-more-row-wrap {
  margin-bottom: 20px;
}
.detail-more-row {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  border: 1px solid #ccc;
  margin-bottom: -1px;
}
.detail-more-row > div:first-child {
  background-color: #effaee;
  padding: 5px;
  width: 25%;
  font-weight: bold;
  border-right: 1px solid #ccc;
}
.detail-more-row > div:last-child {
  background-color: #fff;
  padding: 5px;
  width: 75%;
}
.detail-more-row li {
  list-style: none;
}
.detail-land {
  margin-bottom: 20px;
}
.detail-land .detail-more-row-wrap {
  margin-bottom: 10px;
}
.detail-land h3 {
  margin-bottom: 5px;
}
.detail-land h4 {
  margin-left: 5px;
  color: #6aa845;
}
.legal-constraint li:not(:last-child) {
  border-bottom: 1px dotted #ccc;
  margin-bottom: 5px;
  padding-bottom: 5px;
}
.legal-constraint li:empty {
  display: none;
}

@media (min-width: 768px) {
  .detail-more {
    font-size: 1.4rem;
  }
  .detail-more h3 {
    padding: 10px;
    font-size: 1.5rem;
  }
  .detail-more-row-wrap {
    margin-bottom: 35px;
    display: flex;
    flex-wrap: wrap;
  }
  .detail-more-row {
    width: 50%;
    margin-right: -1px;
  }
  .detail-more-row > div:first-child {
    padding: 10px;
    width: 30%;
  }
  .detail-more-row > div:last-child {
    padding: 10px;
    width: 70%;
    border-right: none;
  }
  .detail-land {
    margin-bottom: 35px;
  }
  .detail-land .detail-more-row-wrap {
    margin-bottom: 15px;
  }
  .detail-land h3 {
    margin-bottom: 10px;
  }
  .detail-land h4 {
    margin-left: 10px;
    color: #6aa845;
  }
}

#showhide-land,
#site-rights-type-detail,
#classification,
#classification-land {
  display: none;
}

 /* detail-free */

.detail-free {
  margin-top: 10px;
  background-color: #fff;
}
.detail-free-item {
  padding: 10px 5px;
  border-bottom: 2px dotted #aaa;
}
.detail-free-item:empty {
  display: none;
}

@media (min-width: 768px) {
  .detail-free {
    margin-top: 20px;
    font-size: 1.5rem;
  }
  .detail-free-item {
    padding: 20px 10px;
  }
}

 /* detail-btn */

.detail-btn {
   margin-top: 20px;
 }
.detail-btn > div {
  margin-bottom: 8px;
}
.detail-btn > div:last-child {
  margin-bottom: 0;
}
.detail-btn a {
  display: block;
  border-radius: 5px;
  padding: 10px;
  text-align: center;
  text-decoration: none;
  font-weight: bold;
}
.detail-btn-keep {
  background-color: #fffadb;
  color: #42250f;
  border: 1px solid #bda47d;
}
.detail-btn-keep:hover {
  background-color: #fff7bf;
}
.detail-btn-contact {
  background-color: #613717;
  color: #fff;
}
.detail-btn-contact:hover {
  background-color: #42250f;
}

@media (min-width: 768px) {
  .detail-btn {
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
  }
  .detail-btn > div {
    width: 48%;
  }
  .detail-btn a {
    padding: 15px;
  }
}

/* detail-mgmt*/

.detail-mgmt {
  background-color: #fff;
  padding: 10px;
  border-radius: 10px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  font-size: 1.2rem;
  margin-bottom: 20px;
  border: 1px solid #eee;
}
.detail-mgmt h3 {
  font-size: 1.6rem;
  line-height: 1.4;
  border-bottom: 2px solid #254612;
  color: #254612;
  margin-bottom: 10px;
}
.detail-mgmt-inner img {
  width: 100%;
  height: auto;
  vertical-align: top;
}
.detail-mgmt-info {
  display: flex;
  flex-wrap: wrap;
  margin-top: 10px;
}
.detail-mgmt-info dt {
  width: 30%;
  font-weight: bold;
  border-bottom: 1px dotted #ccc;
  padding: 5px;
}
.detail-mgmt-info dd {
  width: 70%;
  padding-left: 10px;
  border-bottom: 1px dotted #ccc;
  padding: 5px;
}
.detail-mgmt-info dd a {
  color: #f90;
  text-decoration: none;
}
.detail-mgmt-info dd a:hover {
  color: #f80;
}

@media (min-width: 768px) {
  .detail-mgmt {
    padding: 25px;
  }
  .detail-mgmt h3 {
    font-size: 2rem;
    border-bottom: 3px solid #254612;
    color: #254612;
    margin-bottom: 20px;
  }
  .detail-mgmt-inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    font-size: 1.5rem;
  }
  .detail-mgmt-img {
    width: 32%;
  }
  .detail-mgmt-info {
    width: 65%;
    margin-top: 0;
  }
  .detail-mgmt-info dt {
    padding: 10px;
  }
  .detail-mgmt-info dd {
    padding: 10px;
  }
}


/******************************************
 privacy
*******************************************/

.privacy {
  font-size: 1.2rem;
}
.privacy h2 + p {
  margin-bottom: 20px;
}
.privacy dt {
  font-weight: bold;
  margin-bottom: 5px;
}
.privacy dd {
  border-bottom: 1px dotted #ccc;
  margin-bottom: 10px;
  padding-bottom: 10px;
}
.privacy dd ol {
  margin-top: 10px;
  margin-left: 20px;
}

@media (min-width: 768px) {
  .privacy {
    font-size: 1.5rem;
  }
  .privacy h2 + p {
    margin-bottom: 40px;
  }
  .privacy dt {
    margin-bottom: 10px;
  }
  .privacy dd {
    margin-bottom: 20px;
    padding-bottom: 20px;
  }
}


/******************************************
 owner_list
*******************************************/

.owner-lists {
  margin-bottom: 20px;
}
.owner-lists-item {
  background-color: #fff;
  padding: 10px;
  border-radius: 10px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  margin-bottom: 20px;
  border: 1px solid #eee;
  font-size: 1.2rem;
}
.owner-lists-item h3 {
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1.2;
  margin-bottom: 15px;
  border-bottom: 1px solid #ccc;
}
.search-number {
  font-size: 1.2rem;
  margin-bottom: 5px;
}
.owner-lists-flex {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.owner-img {
  width: 35%;
}
.owner-img img {
  width: 100%;
}
.owner-lists-info {
  width: 62%;
}
.owner-lists-info dl {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 5px;
}
.owner-lists-info dt {
  width: 35%;
  padding: 5px;
  border-bottom: 1px dotted #ccc;
  font-weight: bold;
}
.owner-lists-info dd {
  width: 65%;
  padding: 5px;
  border-bottom: 1px dotted #ccc;
}
.owner-lists-info-btn {
  margin-top: 10px;
}
.owner-lists-info-btn a {
  background-color: #fffadb;
  color: #42250f;
  border: 1px solid #bda47d;
  display: block;
  border-radius: 5px;
  padding: 10px;
  text-align: center;
  text-decoration: none;
  font-weight: bold;
}
.owner-lists-info-btn a:hover {
  background-color: #fff7bf;
}

@media (min-width: 768px) {
  .owner-lists {
    flex: 1;
    order: 2;
    margin-bottom: 0;
  }
  .owner-lists-item h3 {
    font-size: 1.6rem;
    margin-bottom: 20px;
  }
  .owner-lists-item {
    font-size: 1.4rem;
    padding: 20px;
    margin-bottom: 30px;
  }
  .owner-lists-item:last-of-type {
    margin-bottom: 20px;
  }
  .owner-lists-info dt {
    padding: 10px;
    width: 30%;
  }
  .owner-lists-info dd {
    padding: 10px;
    width: 70%;
  }
}


/******************************************
 owner_info　詳細
*******************************************/

.owner-info h3 {
  background-color: #613717;
  color: #fff;
  font-size: 1.4rem;
  padding: 5px 10px;
  margin-bottom: 10px;
}

@media (min-width: 768px) {
  .owner-info h3 {
    font-size: 1.6rem;
  }
}

/* owner-detail*/

.owner-detail {
  background-color: #fff;
  padding: 10px;
  border-radius: 10px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  font-size: 1.2rem;
  margin-bottom: 20px;
  border: 1px solid #eee;
}
.owner-detail-img img {
  width: 100%;
  height: auto;
  vertical-align: top;
}
.owner-detail-info {
  display: flex;
  flex-wrap: wrap;
  margin-top: 10px;
}
.owner-detail-info dt {
  width: 30%;
  font-weight: bold;
  border-bottom: 1px dotted #ccc;
  padding: 5px;
}
.owner-detail-info dd {
  width: 70%;
  padding-left: 10px;
  border-bottom: 1px dotted #ccc;
  padding: 5px;
}

@media (min-width: 768px) {
  .owner-detail {
    padding: 25px;
  }
  .owner-detail-inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    font-size: 1.5rem;
  }
  .owner-detail-img {
    width: 32%;
  }
  .owner-detail-info {
    width: 65%;
    margin-top: 0;
  }
  .owner-detail-info dt {
    padding: 10px;
  }
  .owner-detail-info dd {
    padding: 10px;
  }
}

/* owner-photo */

.owner-photo {
  display: none;
}

@media (min-width: 768px) {
  .owner-photo {
    display: block;
  }
  .owner-photo img {
    width: 100%;
  }
  .owner-photo ul {
    margin-top: 30px;
    display: flex;
    justify-content: space-between;
  }
  .owner-photo li {
    list-style: none;
    width: 32%;
    border: 1px solid #ccc;
    padding: 10px;
  }
}

/* owner-access */

.owner-access {
  margin-top: 20px;
  font-size: 1.2rem;
}
.owner-map {
  margin-bottom: 10px;
}
.owner-map div#map-canvas {
  width: 100%!important;
  height: 250px!important;
}
.owner-address dt {
  font-weight: bold;
  padding: 5px;
}
.owner-address dd {
  padding: 5px;
  border-bottom: 1px dotted #ccc;
}

@media (min-width: 768px) {
  .owner-access {
    font-size: 1.5rem;
    margin-top: 40px;
  }
  .owner-access-inner {
    display: flex;
    justify-content: space-between;
  }
  .owner-map {
    width: 35%;
    margin-bottom: 0;
  }
  .owner-address {
    width: 63%;
  }
  .owner-address dl {
    display: flex;
    flex-wrap: wrap;
  }
  .owner-address dt {
    width: 30%;
    padding: 10px;
    border-bottom: 1px dotted #ccc;
  }
  .owner-address dd {
    width: 67%;
    padding: 10px;
  }
}

/* owner-rating */

.owner-rating {
  margin-top: 20px;
  font-size: 1.2rem;
}
.owner-rating-inner {
  padding: 0 5px;
}
.owner-rating ul {
  margin-top: 5px;
  margin-left: -10px;
}
.owner-rating li {
  list-style: none;
  margin-left: 10px;
}
.owner-rating li img {
  width: 80px;
  margin-left: 5px;
}

@media (min-width: 768px) {
  .owner-rating {
    margin-top: 30px;
    font-size: 1.5rem;
  }
}

/* owner-review */

.owner-review {
  margin-top: 20px;
  font-size: 1.2rem;
}
.owner-review-box-wrap {
  margin-top: 5px;
}
.owner-review-box {
  background-color: #e5f6e3;
  padding: 10px;
  border: 1px solid #ccc;
  margin-bottom: 10px;
}
.owner-review-box:last-of-type {
  margin-bottom: 5px;
}
.owner-review-text {
  margin-top: 5px;
  padding: 5px;
  background-color: #fff;
}
.owner-comment {
  border-top: 1px dotted #ccc;
  margin-top: 5px;
  padding-top: 5px;
}

@media (min-width: 768px) {
  .owner-review {
    margin-top: 30px;
    font-size: 1.5rem;
  }
  .owner-review-box {
    padding: 15px;
    margin-bottom: 15px;
  }
  .owner-review-box p {
    font-size: 1.2rem;
  }
  .owner-review-box .owner-review-text {
    font-size: 1.4rem;
    padding: 10px;
  }
  .owner-comment {
    margin-top: 10px;
    padding-top: 10px;
  }
}

/* owner-property*/

.owner-property {
  margin-top: 20px;
}
.owner-property dl {
  font-size: 1.2rem;
  border: 1px solid #ccc;
  border-bottom: none;
  display: flex;
  flex-wrap: wrap;
}
.owner-property dl:last-of-type {
  border-bottom: 1px solid #ccc;
}
.owner-property dt {
  font-weight: bold;
  padding: 5px;
  border-bottom: 1px dotted #ccc;
  width: 100%;
  background-color: #fffadb;
}
.owner-property dd {
  padding: 5px;
  width: 33.3%;
  border-right: 1px dotted #ccc;
}
.owner-property dd.owner-property-btn {
  border-right: none;
  text-align: center;
  padding: 5px 2px;
}
.owner-property dt a {
  color: #613717;
  text-decoration: none;
}
.owner-property dt a:hover {
  color: #42250f;
}
.owner-property-btn a {
  background-color: #f90;
  color: #fff;
  padding: 5px;
  border-radius: 5px;
  text-decoration: none;
}
.owner-property-btn a:hover {
  background-color: #f80;
}

@media (min-width: 768px) {
  .owner-property {
    margin-top: 30px;
  }
  .owner-property dl {
    font-size: 1.5rem;
  }
  .owner-property dt {
    padding: 10px;
    width: 49%;
    border-bottom: none;
    border-right: 1px dotted #ccc;
  }
  .owner-property dd {
    padding: 10px;
    width: 17%;
  }
  .owner-property dd.owner-property-btn {
    padding: 10px 5px;
  }
  .owner-property-btn a {
    padding: 5px 10px;
    font-size: 1.4rem;
  }
}


/******************************************
 history 閲覧履歴
********************************************/

.history {
  margin-bottom: 40px;
}
.history-item-wrap {
  background-color: #fff;
  padding: 10px;
  border-radius: 10px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  margin-bottom: 20px;
}
.history-item {
  font-size: 1.2rem;
  border: 1px solid #ccc;
  width: 100%;
}
.history-item th {
  font-weight: bold;
  padding: 5px 10px;
  border: 1px solid #ccc;
  background-color: #e5f6e3;
  text-align: left;
}
.history-item th a {
  color: #613717;
  text-decoration: none;
}
.history-item th a:hover {
  color: #42250f;
}
.history-item td {
  padding: 5px 10px;
  border: 1px dotted #ccc;
  vertical-align: middle;
}
.history-item-left {
  width: 60%;
}
.history-item-btn {
  width: 40%;
}
.history-item-btn a {
  padding: 3px 5px;
  border-radius: 5px;
  text-decoration: none;
  text-align: center;
  display: block;
  width: 100%;
}
.history-item-keep {
  background-color: #fffadb;
  color: #42250f;
  border: 1px solid #bda47d;
  margin-bottom: 5px;
}
.history-item-keep:hover {
  background-color: #fff7bf;
}
.history-item-contact {
  border-right: none;
  background-color: #f90;
  color: #fff;
}
.history-item-contact:hover {
  background-color: #f80;
}

@media (min-width: 768px) {
  .history {
    flex: 1;
    order: 2;
    margin-bottom: 0;
  }
  .history-item-wrap {
    padding: 25px;
  }
  .history-item {
    font-size: 1.4rem;
  }
  .history-item-left {
    width: 70%;
  }
  .history-item-btn {
    width: 30%;
  }
}


/******************************************
 favo_list キープリスト
********************************************/

.favo {
  margin-bottom: 40px;
}
.favo-item-wrap {
  background-color: #fff;
  padding: 10px;
  border-radius: 10px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  margin-bottom: 20px;
}
.favo-item {
  font-size: 1.2rem;
  border: 1px solid #ccc;
  width: 100%;
}
.favo-item th {
  font-weight: bold;
  padding: 5px 10px;
  border: 1px solid #ccc;
  background-color: #e5f6e3;
  text-align: left;
}
.favo-item th a {
  color: #613717;
  text-decoration: none;
}
.favo-item th a:hover {
  color: #42250f;
}
.favo-item td {
  padding: 5px 10px;
  border: 1px dotted #ccc;
  vertical-align: middle;
}
.favo-item-left {
  width: 60%;
}
.favo-item-btn {
  width: 40%;
}
.favo-item-btn a {
  padding: 3px 5px;
  border-radius: 5px;
  text-decoration: none;
  text-align: center;
  display: block;
  width: 100%;
}
.favo-item-contact {
  border-right: none;
  background-color: #f90;
  color: #fff;
  margin-bottom: 5px;
}
.favo-item-contact:hover {
  background-color: #f80;
}
.favo-item-del {
  background-color: #fffadb;
  color: #42250f;
  border: 1px solid #bda47d;
}
.favo-item-del:hover {
  background-color: #fff7bf;
}

@media (min-width: 768px) {
  .favo {
    flex: 1;
    order: 2;
    margin-bottom: 0;
  }
  .favo-item-wrap {
    padding: 25px;
  }
  .favo-item {
    font-size: 1.4rem;
  }
  .favo-item-left {
    width: 70%;
  }
  .favo-item-btn {
    width: 30%;
  }
}


/******************************************
 entry-list 物件お問い合わせ履歴
********************************************/

.entry-hist {
  margin-bottom: 40px;
}
.entry-hist-item-wrap {
  background-color: #fff;
  padding: 10px;
  border-radius: 10px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  margin-bottom: 20px;
}
.entry-hist-item {
  font-size: 1.2rem;
  border: 1px solid #ccc;
  width: 100%;
}
.entry-hist-item th {
  font-weight: bold;
  padding: 5px 10px;
  border: 1px solid #ccc;
  background-color: #e5f6e3;
  text-align: left;
}
.entry-hist-item th a {
  color: #613717;
  text-decoration: none;
}
.entry-hist-item th a:hover {
  color: #42250f;
}
.entry-hist-item td {
  padding: 5px 10px;
  border: 1px dotted #ccc;
  vertical-align: middle;
}
.entry-hist-item-left{
  width: 60%;
}
.entry-hist-item-review {
  width: 40%;
}
.entry-hist-item-review a {
  display: block;
  padding: 3px 5px;
  border-radius: 5px;
  text-decoration: none;
  text-align: center;
  border-right: none;
  background-color: #f90;
  color: #fff;
  width: 100%;
  max-width: 15em;
  margin-left: auto;
  margin-right: auto;
}
.entry-hist-item-review a:hover {
  background-color: #f80;
}

@media (min-width: 768px) {
  .entry-hist {
    flex: 1;
    order: 2;
    margin-bottom: 0;
  }
  .entry-hist-item-wrap {
    padding: 25px;
  }
  .entry-hist-item {
    font-size: 1.4rem;
  }
  .entry-hist-item-left{
    width: 70%;
  }
  .entry-hist-item-review {
    width: 30%;
  }
}





/******************************************
 通常ページ　共通
********************************************/

.btn-normal {
  display: block;
  text-align: center;
  background-color: #f90;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  padding: 10px;
  border-radius: 5px;
  margin-top: 5px;
}
.btn-normal:hover {
  background-color: #f80;
}

@media (min-width: 768px) {
  .btn-normal {
    width: 49%;
    margin-left: auto;
    margin-right: auto;
  }
}


/******************************************
 about ご利用方法
********************************************/

.about-contents {
  background-color: #fff;
  padding: 10px;
  border-radius: 10px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  margin-bottom: 20px;
  font-size: 1.2rem;
}
.about-contents h3 {
  margin-top: 15px;
  margin-bottom: 10px;
  font-size: 1.4rem;
  color: #42250f;
  border-bottom: 1px solid #42250f;
}
.about-flow-list {
  margin-bottom: 20px;
}
.about-flow-item {
  background-color: #fffef8;
  padding: 10px;
  margin-bottom: 28px;
  border: 1px solid #e1d3c9;
  border-radius: 5px;
  text-align: center;
  position: relative;
}
.about-flow-item::after {
  display: block;
  content: url(../images/arrow-down.png);
  position: absolute;
  bottom: -26px;
  left: 50%;
  transform: translateX(-50%);
}
.about-flow-item:last-of-type:after {
  content: '';
}

@media (min-width: 768px) {
  .about {
    flex: 1;
    order: 2;
    margin-bottom: 0;
  }
  .about-contents {
    padding: 25px;
    font-size: 1.4rem;
  }
  .about-contents h3 {
    margin-top: 30px;
    margin-bottom: 30px;
    font-size: 1.6rem;
  }
  .about-flow-list {
    margin-bottom: 40px;
  }
  .about-flow-item {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
  }
  .about-flow-item::after {
    bottom: -30px;
  }
}