@charset "UTF-8";
/*=======================================
	breakpoint
=======================================*/
/*=======================================
	hover
=======================================*/
/*=======================================
	中央配置
=======================================*/
/*=======================================
	可変レスポンシブ
=======================================*/
/* PC */
/* TB */
/* SP */
/*=======================================
	ブラウザ別
=======================================*/
/* Safari */
/* Firefox */
/*-------------------------
-common
- section_border
- direction_mark
- page_ttl
- intro_sec
- accessibility_sec
- residence_sec
- redevelopment_sec
- contents_nav
-------------------------*/
/*============================
common
============================*/
.cmn_hd_txt {
  font-size: 2.1rem;
  line-height: 2.2;
}
@media screen and (max-width: 768px) {
  .cmn_hd_txt {
    font-size: 1.25rem;
  }
}

/*============================
section_border
============================*/
.section_border {
  margin-bottom: 66.2px;
}
@media screen and (max-width: 768px) {
  .section_border {
    margin-bottom: 29.1px;
  }
}

/*============================
direction_mark
============================*/
.direction_mark {
  position: absolute;
  bottom: 28.5px;
  right: 0px;
}
@media screen and (max-width: 768px) {
  .direction_mark {
    width: 24.835px;
    right: 7%;
    bottom: 8%;
  }
}

.caption01 {
  font-size: 1.2rem;
}
@media screen and (max-width: 768px) {
  .caption01 {
    font-size: 0.9rem;
  }
}

/*============================
#page_ttl
============================*/
#page_ttl {
  background: url(../concept/img/kv.jpg) no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  #page_ttl {
    background: url(../concept/img/kv_sp.jpg) no-repeat center bottom;
    background-size: cover;
  }
}

/*============================
#intro_sec
============================*/
#intro_sec {
  margin-bottom: 60px;
}
@media screen and (max-width: 768px) {
  #intro_sec {
    margin-bottom: 30px;
  }
}
#intro_sec .inner .st01 {
  margin-bottom: 75px;
}
@media screen and (max-width: 768px) {
  #intro_sec .inner .st01 {
    margin-bottom: 35px;
  }
}
#intro_sec .inner .logo {
  max-width: 420px;
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  #intro_sec .inner .logo {
    max-width: 210px;
    margin-bottom: 15px;
  }
}
#intro_sec .inner .logo img {
  -webkit-filter: brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(7481%) hue-rotate(314deg) brightness(98%) contrast(100%);
          filter: brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(7481%) hue-rotate(314deg) brightness(98%) contrast(100%);
}

/*============================
#accessibility_sec
============================*/
#accessibility_sec {
  margin-bottom: 177.5px;
}
@media screen and (max-width: 768px) {
  #accessibility_sec {
    margin-bottom: 55px;
  }
}
#accessibility_sec .inner .txt01:nth-child(1 of .txt01) {
  margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
  #accessibility_sec .inner .txt01:nth-child(1 of .txt01) {
    margin-bottom: 16.9px;
  }
}
#accessibility_sec .inner .txt01:nth-child(2 of .txt01) {
  margin-bottom: 60px;
}
@media screen and (max-width: 768px) {
  #accessibility_sec .inner .txt01:nth-child(2 of .txt01) {
    margin-bottom: 12.5px;
  }
}
#accessibility_sec .inner .catch03 {
  margin-bottom: 40.3px;
}
@media screen and (max-width: 768px) {
  #accessibility_sec .inner .catch03 {
    margin-bottom: 27.9px;
  }
}
#accessibility_sec .inner .map {
  position: relative;
  max-width: 773.86px;
  margin: 0 auto 84.2px;
  width: 85%;
}
@media screen and (max-width: 768px) {
  #accessibility_sec .inner .map {
    width: 100%;
    margin-bottom: 31.55px;
  }
}
#accessibility_sec .inner .map .img {
  position: relative;
}
#accessibility_sec .inner .map .svg_line {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#accessibility_sec .inner .map .svg_line svg {
  filter: drop-shadow(0px 3px 10px red);
  -webkit-filter: drop-shadow(0px 3px 10px red);
}
#accessibility_sec .inner .map .svg_line #line {
  stroke: white;
  stroke-width: 8;
  stroke-dasharray: 250;
  stroke-dashoffset: 250;
  background-clip: padding-box;
}
@media screen and (max-width: 768px) {
  #accessibility_sec .inner .map .svg_line #line {
    stroke-width: 10;
  }
}
@-webkit-keyframes dash {
  to {
    stroke-dashoffset: 0;
  }
}
@keyframes dash {
  to {
    stroke-dashoffset: 0;
  }
}
#accessibility_sec .inner .map .circle {
  position: absolute;
  top: -16.5%;
  left: -80.6%;
  z-index: 1;
}
@media screen and (max-width: 820px) {
  #accessibility_sec .inner .map .circle {
    top: -17%;
    left: -80.5%;
  }
}
@media screen and (max-width: 768px) {
  #accessibility_sec .inner .map .circle {
    top: -17.1%;
    left: -80.5%;
  }
}
#accessibility_sec .inner .map .circle .elem {
  width: 25px;
  height: 25px;
  background-color: #fff;
  border-radius: 50%;
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
  -webkit-filter: blur(2px) drop-shadow(0px 0px 10px rgba(255, 0, 0, 0.5));
          filter: blur(2px) drop-shadow(0px 0px 10px rgba(255, 0, 0, 0.5));
}
@media screen and (max-width: 768px) {
  #accessibility_sec .inner .map .circle .elem {
    width: 2.6666666667vw;
    height: 2.6666666667vw;
  }
}
#accessibility_sec .inner .map.fadeIn .svg_line #line {
  -webkit-animation: dash 2s linear forwards;
          animation: dash 2s linear forwards;
}
#accessibility_sec .inner .map .caption01 {
  right: -53px;
  bottom: 32px;
}
@media screen and (max-width: 768px) {
  #accessibility_sec .inner .map .caption01 {
    right: 8.5%;
    bottom: -5px;
  }
}
#accessibility_sec .inner .img_area {
  max-width: 871px;
  margin: 0 auto;
}
#accessibility_sec .inner .img_area .img {
  margin-bottom: 22.9px;
}
@media screen and (max-width: 768px) {
  #accessibility_sec .inner .img_area .img {
    margin-bottom: 8.35px;
  }
}

/*============================
#residence_sec
============================*/
#residence_sec {
  background: url("../concept/img/residence_bg.jpg") no-repeat;
  background-size: cover !important;
  color: #fff;
  padding-top: 184.8px;
  margin-bottom: 182.7px;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  #residence_sec {
    background: url("../concept/img/residence_bg_sp.jpg") no-repeat;
    padding-top: 56.1px;
    margin-bottom: 66.6px;
  }
}
#residence_sec::after {
  content: "";
  width: 100%;
  height: 283px;
  display: inline-block;
  background: #fff;
  position: absolute;
  left: 0;
  bottom: 0;
}
@media screen and (max-width: 768px) {
  #residence_sec::after {
    height: 26.6927083333vw;
  }
}
#residence_sec .inner {
  position: relative;
  z-index: 1;
}
#residence_sec .inner .catch02 {
  margin-bottom: 80px;
}
@media screen and (max-width: 768px) {
  #residence_sec .inner .catch02 {
    margin-bottom: 37.5px;
  }
}
#residence_sec .inner .catch03 {
  margin-bottom: 45.3px;
}
@media screen and (max-width: 768px) {
  #residence_sec .inner .catch03 {
    margin-bottom: 10.9px;
  }
}
#residence_sec .inner .txt01 {
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  #residence_sec .inner .txt01 {
    margin-bottom: 38.5px;
  }
}
#residence_sec .inner .img {
  position: relative;
}
@media screen and (max-width: 768px) {
  #residence_sec .inner .img {
    width: 97.22%;
  }
}
#residence_sec .inner .img.left {
  margin-left: calc(50% - 50vw);
  margin-bottom: 37px;
}
@media screen and (max-width: 768px) {
  #residence_sec .inner .img.left {
    margin-bottom: 30px;
  }
}
#residence_sec .inner .img.left .caption01 {
  color: initial;
}
@media screen and (max-width: 768px) {
  #residence_sec .inner .img.left .caption01 {
    color: #fff;
  }
}
#residence_sec .inner .img.right {
  margin-right: calc(50% - 50vw);
  margin-left: auto;
}
@media screen and (max-width: 768px) {
  #residence_sec .inner .img.right .caption01 {
    left: auto;
    right: 6px;
  }
}
#residence_sec .inner .img .cmn_hd_txt {
  margin-bottom: 32.6px;
}
@media screen and (max-width: 768px) {
  #residence_sec .inner .img .cmn_hd_txt {
    margin-bottom: 16.3px;
  }
}

/*============================
#redevelopment_sec
============================*/
#redevelopment_sec {
  margin-bottom: 250px;
}
@media screen and (max-width: 768px) {
  #redevelopment_sec {
    margin-bottom: 76.1px;
  }
}
#redevelopment_sec .inner .catch02 {
  margin-bottom: 80px;
}
@media screen and (max-width: 768px) {
  #redevelopment_sec .inner .catch02 {
    margin-bottom: 55.75px;
  }
}
#redevelopment_sec .inner .catch03 {
  margin-bottom: 40.4px;
}
@media screen and (max-width: 768px) {
  #redevelopment_sec .inner .catch03 {
    margin-bottom: 12.75px;
  }
}
#redevelopment_sec .inner .txt01 {
  margin-bottom: 81.9px;
}
@media screen and (max-width: 768px) {
  #redevelopment_sec .inner .txt01 {
    margin-bottom: 28.5px;
  }
}
#redevelopment_sec .inner .grid_area {
  margin-bottom: 115.8px;
}
@media screen and (max-width: 768px) {
  #redevelopment_sec .inner .grid_area {
    margin-bottom: 50.65px;
  }
}
#redevelopment_sec .inner .grid_area .grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(4, 1fr);
  gap: 16px;
  grid-template-rows: 350px 181px 181px 350px;
  grid-template-columns: 59.9% 38.88%;
  margin-bottom: 10.9px;
}
@media screen and (max-width: 768px) {
  #redevelopment_sec .inner .grid_area .grid {
    gap: 6.5px;
    grid-template-columns: 50% 48.54%;
    grid-template-rows: 143.5px 125px 125px 143.5px;
    margin-bottom: 7.85px;
  }
}
#redevelopment_sec .inner .grid_area .grid > div {
  background-size: cover !important;
  background-position: center !important;
  position: relative;
}
#redevelopment_sec .inner .grid_area .grid > div .caption01 {
  font-size: 1.2rem;
}
@media screen and (max-width: 768px) {
  #redevelopment_sec .inner .grid_area .grid > div .caption01 {
    font-size: 0.9rem;
  }
}
#redevelopment_sec .inner .grid_area .grid .div1 {
  grid-column: span 2/span 2;
  background: url("../concept/img/redevelopment_img01.jpg") no-repeat;
}
@media screen and (max-width: 768px) {
  #redevelopment_sec .inner .grid_area .grid .div1 {
    background: url("../concept/img/redevelopment_img01_sp.jpg") no-repeat;
  }
}
#redevelopment_sec .inner .grid_area .grid .div2 {
  grid-row: span 2/span 2;
  grid-row-start: 2;
  background: url("../concept/img/redevelopment_img02.jpg") no-repeat;
}
@media screen and (max-width: 768px) {
  #redevelopment_sec .inner .grid_area .grid .div2 {
    background: url("../concept/img/redevelopment_img02_sp.jpg") no-repeat;
  }
}
#redevelopment_sec .inner .grid_area .grid .div3 {
  grid-row-start: 2;
  background: url("../concept/img/redevelopment_img03.jpg") no-repeat;
}
@media screen and (max-width: 768px) {
  #redevelopment_sec .inner .grid_area .grid .div3 {
    background: url("../concept/img/redevelopment_img03_sp.jpg") no-repeat;
  }
}
#redevelopment_sec .inner .grid_area .grid .div4 {
  grid-column-start: 2;
  grid-row-start: 3;
  background: url("../concept/img/redevelopment_img04.jpg") no-repeat;
}
@media screen and (max-width: 768px) {
  #redevelopment_sec .inner .grid_area .grid .div4 {
    background: url("../concept/img/redevelopment_img04_sp.jpg") no-repeat;
  }
}
#redevelopment_sec .inner .grid_area .grid .div5 {
  grid-column: span 2/span 2;
  grid-row-start: 4;
  background: url("../concept/img/redevelopment_img05.jpg") no-repeat;
}
@media screen and (max-width: 768px) {
  #redevelopment_sec .inner .grid_area .grid .div5 {
    background: url("../concept/img/redevelopment_img05_sp.jpg") no-repeat;
  }
}
#redevelopment_sec .inner > .img {
  margin-bottom: 68.9px;
  position: relative;
}
@media screen and (max-width: 768px) {
  #redevelopment_sec .inner > .img {
    margin-bottom: 30.75px;
  }
}

/*============================
contents_nav
============================*/
.contents_nav .vertical_txt01 {
  display: none;
}/*# sourceMappingURL=concept.css.map */