





@charset "UTF-8";

#sub_area h4 span.label10 {top:-2px !important; }

.opportunity {width:100%;max-width:65px;}

.label10:after {
  content: "終了";
  font-size: 12px;
  background: #993f3f;
  color: #fff;
  padding: 0.2em 1em;
  margin-left: .5em;
}

.label8:after {
  content: "不動産情報";
  font-size: 12px;
  background: #ef97c2;
  color: #fff;
  padding: 0.2em 0.8em;
  margin-right: 1em;
}
.works_gallery{
height:auto;
}
.works_gallery .hover-img img {
    width: 100%;
    height: auto;
}
.works_gallery {
    margin-bottom: 3%;
}
.row {
    margin-right: -15px;
    margin-left: -15px;
}


.navi {margin-top:2%;margin-left:2%;}
.navi .next, .navi .prev {background: #cdcdcd;padding: 0.3rem 1rem;color: #fff !important;margin-right:1%;font-size: 1rem;} 

.happyhome_top {width:90%; margin:auto auto 4%;text-align: center;}
.happyhome_top a {width:45%;padding:4%;display: inline-block;margin:auto;}
.happyhome_top a img  {width:100%;}


@media (max-width: 600px) {
.happyhome_top {margin:auto auto 6%;}
.happyhome_top a {width:70%;display:block;text-align: center;}
}
@media (max-width: 400px) {
.happyhome_top a {width:85%;}
}

.gr_mt01 {margin-top:4%;}
.gr_mt02 {margin-top:7%;}
.gr_mt03 {margin-top:2%;}
.gr_mtb {margin-top:2%;margin-bottom:5%;}

@media (max-width:767.9px){
.gr_mt02,.gr_mt03 {margin-top:2%;}
.gr_mt04 {margin-top:-12%;}
.sp_none {height:1px !important;margin-top:-25%;}
}
@media (max-width:480px){
.gr_mt01 {margin-top:8%;}
.gr_mt02 {margin-top:-2%;}
.gr_mt03 {margin-top:0;}
.gr_mt04 {margin-top:-3%;}
.gr_mtb {margin-bottom:0;}
}
.fudousan_link {background:#36907c; padding: 0.8rem 1.5rem;margin-top:5%;display: inline-block;}
.fudousan_link  a {font-size:1.2rem;color: #fff;}
.fudousan_link:hover {opacity: .6;}
.container_grid {
  display: grid;padding: 1% 2% 1%;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr;
  gap: 10px 10px;
  grid-template-areas:
    "item01 item02";
  min-height: 100%;
}


.container_grid02 {
  display: grid;padding: 1% 2% 1%;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr;
  gap: 8px 8px;
  grid-template-areas:
    "item03 item04 item05";
  min-height: 100%;
}

.container_grid03 {
  display: grid;padding: 1% 2% 1%;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr;
  gap: 10px 10px;
  grid-template-areas:
    "item01 item02";
  min-height: 100%;
}


@media (max-width:767.9px){
.container_grid {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 1fr;
	grid-template-areas:
    "item01"
"item02";
}
.container_grid02 {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 1fr 1fr;
	grid-template-areas:
    "item03"
"item04"
"item05";
}
.container_grid03 {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
	grid-template-areas:
    "item01";
}
}

.movie-wrap {
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}
 
.movie-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}


.douga { width:100%; margin:5% auto 20% !important; text-align:center !important;}
.douga li { width:80%; display:block; margin:auto auto 12% !important;}

.youtube {
position: relative;
height: 0;
padding: 30px 0 56.25%;
overflow: hidden;
margin-bottom:10% !important;
margin-top:5%;

}
.youtube iframe {
position: absolute;
top: 0;
left: 0;
width:100% !important;
height:100% !important;
}

#last_douga { margin-bottom:5%;}


@media only screen and (min-width:680px){
.douga li { width:47%; display:inline-block;margin-bottom:4% !important;}
.douga li:nth-child(odd) { margin-right:2% !important;}
.youtube {
margin-bottom:0% !important;
}
}

@media only screen and (min-width:900px){
.youtube {
margin-bottom:-10% !important;
}
.douga { margin-bottom:5%;}
}

@media only screen and (min-width:1080px){
.youtube {margin-bottom:-20% !important;}
.douga li { margin-bottom:12% !important;}
}


#snavi .menu-container .menu ul li a {color: #fff !important;}

#header .contact2 {display:none !important;}
#header .contact2 a img:hover {opacity:.5;}
#header .contact2sp a img.facebook {float:left !important;padding:0 0.5em !important;width:35% !important;}
#header .contact2sp {float:right !important;width:18% !important;margin:0 !important;padding-right:13% !important;margin-top:-5% !important; }

@media screen and (min-width:600px) {
#header .contact2sp {padding-right:10% !important;}
}
@media screen and (min-width:650px) {
#header .contact2sp {width:15% !important;padding-right:8% !important;}
}
@media screen and (min-width:768px) {
#header .contact2sp {width:14% !important;padding-right:6.5% !important;padding-top:1%;}
#mainimg-sp {margin-bottom:5%;}
}
@media screen and (min-width:950px) {
#header .contact2sp {width:12% !important;padding-right:5% !important;padding-top:1.5%;}
}
@media screen and (min-width:1025px) {
#mainimg-sp {margin-bottom:auto;}
}
@media screen and (min-width:1081px) {
#header .contact2sp {display:none;}
#header .contact2 {display:block;float:right !important; vertical-align:middle !important;width:23% !important;margin:0 !important;padding: 2% 1.5% 0 0 !important;vertical-align:middle !important; }
#header .contact2 a img { width:62% !important; padding-left:4% !important;float:left !important;vertical-align:middle !important; }
#header .contact2 a img.facebook {float:left !important;padding-top:0.5% !important;width:12% !important;}
#header{height:65px !important;}
}



@media screen and (min-width:1300px) {
#header .contact2 {width:19% !important;}
}

#header{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  background: rgba(255,255,255,.85);

}
body{
  padding-top: 65px !important;
}

.contact a {
    font-size: 1.6rem;
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', '游明朝', 'Yu Mincho', '游明朝体', 'YuMincho', 'ＭＳ Ｐ明朝', 'MS PMincho', serif;
    padding-left: 1rem;
    padding-right: 1rem;
    color: #fff !important;
    display: inline-block;
    text-align: center;
    border-radius: 1px;
    margin-left: 2px;
    height: 35px;
    line-height: 35px;
}

.contact a.mail_btn {
    background-color: #36907c;
    font-size: 1.6rem;
}

.contact {
    position: relative;
    float: right;
    padding: 9px 2px;
    margin-right: .6%;
    margin-bottom: 8px;
}

.contact a.mail_btn span {
    font-size: 1.3rem;
    padding-left: 0.4rem;
}










/* 固定ヘッダー */
#header{
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  z-index: 9999;
  background: rgba(255,255,255,.85);

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;

  height:65px;
  padding:0 12px;
}
body{ padding-top:65px !important; }

/* ロゴ */
#header .logo{
  margin:0 !important;
  position:static !important;
  float:none !important;
  line-height:1;
}
#header .logo img{
  display:block;
}

/* 右側 */
#header .header-actions{
  display:flex;
  align-items:center;
  gap:12px;
}

/* 資料請求 */
#header .mail_btn{
  background:#36907c;
  color:#fff !important;
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  height:35px;
  padding:0 12px;
  border-radius:2px;
  white-space:nowrap;
}
#header .mail_btn span{ font-size:1rem; }

/* ハンバーガー：デフォルトは非表示（PCは青ナビ運用） */
#header .drawer-toggle{
  display:none;
  position:static !important;
  margin:0 !important;
}

/* 1080px以下：ハンバーガー表示（SPメニューを使う） */
@media (max-width:1080px){
  #header .drawer-toggle{ display:block; }

}

@media (max-width:768px){
#header .mail_btn span{ font-size:0.8rem; }
}

@media (min-width:1080px){
#header .mail_btn{margin-right:20px;}
}







/* にんじんくらぶ（季刊誌）一覧 + モーダルズーム */
.ninjin_list{list-style:none;margin:0 auto;padding:0;display:flex;flex-wrap:wrap;gap:32px 3%;justify-content:flex-start;}
.ninjin_list li{width:31.33%;box-sizing:border-box;margin:0;}
.ninjin_ttl{font-size:15pt;font-weight:bold;margin-bottom:10px;color:#3c3c3c;letter-spacing:.04em;}
.ninjin_thumb{display:block;position:relative;overflow:hidden;border:1px solid #e2e2e2;border-radius:6px;box-shadow:0 3px 10px rgba(0,0,0,.08);cursor:pointer;background:#fff;transition:box-shadow .25s ease,transform .25s ease;}
.ninjin_thumb:hover{box-shadow:0 8px 20px rgba(0,0,0,.16);transform:translateY(-3px);}
.ninjin_thumb img{display:block;width:100%;height:auto;}
.ninjin_thumb .ninjin_count{position:absolute;right:10px;bottom:10px;background:rgba(0,0,0,.6);color:#fff;font-size:11pt;line-height:1;padding:6px 10px;border-radius:20px;}
.ninjin_thumb .ninjin_zoom{position:absolute;top:10px;right:10px;width:36px;height:36px;border-radius:50%;background:rgba(0,0,0,.55);opacity:0;transition:opacity .25s ease;}
.ninjin_thumb .ninjin_zoom::before{content:"";position:absolute;top:9px;left:9px;width:12px;height:12px;border:2px solid #fff;border-radius:50%;box-sizing:border-box;}
.ninjin_thumb .ninjin_zoom::after{content:"";position:absolute;top:20px;left:20px;width:9px;height:2px;background:#fff;border-radius:1px;transform:rotate(45deg);transform-origin:left center;}
.ninjin_thumb:hover .ninjin_zoom{opacity:1;}
/* modal */
.ninjin_modal{display:none;position:fixed;z-index:9999;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.88);}
.ninjin_modal.open{display:block;}
.ninjin_modal .nm_inner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:94%;max-width:1100px;text-align:center;}
.ninjin_modal .nm_zoombar{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:10px;}
.ninjin_modal .nm_zbtn{appearance:none;border:0;border-radius:6px;background:rgba(255,255,255,.9);color:#222;font-size:14pt;line-height:1;padding:8px 14px;cursor:pointer;font-family:inherit;}
.ninjin_modal .nm_zbtn:hover{background:#fff;}
.ninjin_modal .nm_zlabel{color:#fff;font-size:12pt;min-width:3.6em;letter-spacing:.04em;}
.ninjin_modal .nm_stage{position:relative;}
.ninjin_modal .nm_viewport{max-height:72vh;overflow:auto;-webkit-overflow-scrolling:touch;border-radius:4px;background:rgba(0,0,0,.25);text-align:center;}
.ninjin_modal .nm_img{max-width:100%;max-height:70vh;width:auto;height:auto;display:inline-block;border-radius:4px;box-shadow:0 6px 24px rgba(0,0,0,.5);background:#fff;vertical-align:top;}
.ninjin_modal .nm_caption{color:#fff;font-size:13pt;margin-top:12px;letter-spacing:.05em;}
.ninjin_modal .nm_counter{color:#ddd;font-size:11pt;margin-top:4px;}
.ninjin_modal .nm_close{position:fixed;top:16px;right:24px;z-index:2;color:#fff;font-size:26pt;line-height:1;cursor:pointer;background:none;border:0;padding:0 6px;}
.ninjin_modal .nm_nav{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border:0;border-radius:50%;background:rgba(255,255,255,.85);color:#333;font-size:20pt;line-height:52px;cursor:pointer;transition:background .2s ease;z-index:2;}
.ninjin_modal .nm_nav:hover{background:#fff;}
.ninjin_modal .nm_prev{left:-8px;}
.ninjin_modal .nm_next{right:-8px;}
.ninjin_modal .nm_nav.hide{display:none;}
@media screen and (max-width:768px){
.ninjin_list{gap:26px 4%;margin-top:-10px;}
.ninjin_list li{width:100%;}
.ninjin_ttl{font-size:14pt;}
.ninjin_modal .nm_inner{width:96%;}
.ninjin_modal .nm_close{top:10px;right:12px;font-size:22pt;}
.ninjin_modal .nm_nav{width:34px;height:34px;line-height:34px;font-size:12pt;}
.ninjin_modal .nm_prev{left:2px;}
.ninjin_modal .nm_next{right:2px;}
.ninjin_modal .nm_zbtn{font-size:12pt;padding:10px 12px;}
.ninjin_modal .nm_viewport{max-height:68vh;}
.ninjin_modal .nm_img{max-height:66vh;}
.ninjin_thumb .ninjin_zoom{opacity:1;}
}
