@charset "UTF-8";

/*===============================================
タブレット用　画面の横幅が601px〜959pxまで
===============================================*/
@media screen and (min-width: 601px) and (max-width:959px){

.topContents, .topMessage, .infoTop, .news, .estate, .pickup, .other, .link, .media{
	margin:0 auto;
	text-align:center;
	overflow:hidden;
}


/*TOPスライダー*/
.topslider{
	margin: auto;
	width: 100%;
	overflow:hidden;
}
.topslider{
	background-color: #f3f5f7;
	margin: auto;
                                margin-top: 1rem;
}
.topslider .inner{
	width: 100%;
	margin: auto;
                                position: relative;
}
.topslider li{
                                width: 96%;
                                list-style: none;
                                display: inline-block;
                                margin-top: 1rem;
                                border: 1px solid #c3d3d3;
}
.topslider li dl{
                                display: flex;
                                flex-wrap: wrap;
                                justify-content: space-between;
                                background: #ffffff;
                                padding: 0% 0% 6% 0%;
}
.topslider li dl dt{
                                width: 100%;
                                top: 0.7em;
                                overflow: hidden;
}
.topslider li dl dd{
                                width: 100%;
                                margin: 0% 6%;
                                overflow: hidden;
                                text-align: justify;
                                position: relative;
}
.topslider li dl dd span{
	position: absolute;
	top: 1.5em;
	display: inline-block;
	width: 40%;
	padding: 0em;
	text-align: center;
                                font-size: 0.4rem;
	font-weight:600;
	background-color: #111;
	color: #fff;
}
.topslider li dl dd p.title{
                                font-size: 0.8rem;
                                font-weight:600;
                                margin-top: 30px;
                                text-align: left;
}
.topslider li dl dd p.link{
                                font-size: 0.7rem;
                                font-weight:600;
                                margin-top: 10px;
                                text-align: left;
}
.topslider li dl dd div.icon {
                                position: absolute;
                                display: block;
                                width: 6px;
                                height: 6px;
                                border-top: solid 1px #111;
                                border-right: solid 1px #111;
                                -webkit-transform: rotate(45deg);
                                transform: rotate(45deg);
                                top: 18px;
                                right: 4px;
}

/*TOPINFO　休業案内など*/
.topinfo{
	margin: auto;
	margin-top:0px;
	text-align: center;
	width: 90%;
}
.topinfo div.box{
	width: 100%;
	margin-top: 1rem;
                                font-size: 1.2rem;
	line-height: 1.8;
	border: 1px solid #111111;
}
.topinfo div.box h2{
                                font-size: 1.2rem;
	font-weight:600;
	color: #ff0000;
	margin: 0px 0px 1rem 0px;
	margin-top: 1rem;
}
.topinfo div.box p{
                                font-size: 0.9rem;
	color: #000;
	margin: 0px 0px 1rem 0px;
}

/*SH コンセプト*/
.shconcept{
	margin-top:0px;
	text-align: justify;
}
.shconcept div.box{
	width: 96%;
	margin: auto;
	margin-top: 5rem;
                                font-size: 1rem;
	text-align: justify;
	line-height: 2.4;
}
.shconcept div.box h2{
                                font-size: 2rem;
	font-weight:600;
	line-height: 1.8;
	color: #000;
	margin: 0px 0px 2rem 0px;
	letter-spacing: 0.2rem;
	text-align: justify;
}
.shconceptContainer {
	width: 100%;
                                margin: auto;
                                display: flex;
	flex-wrap: wrap; /*子要素の折り返し*/
                                justify-content:space-between /*子要素の均等配置*/
}
.shconceptContainer div.item {
	width: 48%;
                                font-size: 0.9rem;
                                padding: 0%;
                                position: relative;
                                margin-top: 2rem;
}

.shconceptContainer div.item div.contents {
	width: 100%;
                                position: absolute;
                                display: block;
                                bottom: -1.5rem;
                                left: 1.5rem;
}

.shconceptContainer div.item div.contents h3 {
                                font-size: 1.5rem;
	letter-spacing: 0.1rem;
	font-weight:600;
	color: #000;
	margin: 0px 0px 0rem 0px;
}
.shconceptContainer div.item div.contents p {
                                font-size: 0.8rem;
}
.shconceptContainer div.item div.contents div.icon {
                                position: absolute;
                                display: block;
                                width: 8px;
                                height: 8px;
                                border-top: solid 2px #111;
                                border-right: solid 2px #111;
                                -webkit-transform: rotate(45deg);
                                transform: rotate(45deg);
                                top: 1.5rem;
                                right: 1rem;
}



/*ニュースエリアPC*/
.news{
	width: 100%;
	margin-top: 80px;
	background-color: #e5f2fd;
                                background:linear-gradient(90deg,#030459 0%,#030459 50%,#e5f2fd 50%,#e5f2fd 100%);

}
.news .inner{
	width: 96%;
	margin: auto;
	padding: 40px 0;
                                position: relative;
}
.newstxt_box{
                                position: absolute;
                                top: 4em;
                                left: 0%;
	width: 30%;
}
.newstxt_box h3{
                                font-size: 2rem;
	text-align: left;
	font-weight: 600;
	color: #fff;
	padding: 0%;
                                position: absolute;
	letter-spacing: 0.3em;
                                font-family: 'Open Sans', Arial, Roboto, "Droid Sans", 見出ゴMB31, MidashiGoPro-MB31, "游ゴシック体", YuGothic, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
}
.newstxt_box h3 p{
                                font-size: 1rem;
	font-weight: 600;
	letter-spacing: 0.7em;
}
.news_box{
	width: 65%;
	padding: 0%;
	margin: 0;
	box-sizing: border-box;
                                margin: 0 0 0 auto;
}
.news_box li{
                                width: 100%;
                                list-style: none;
                                display: block;
                                margin-bottom: 7px;
}
.news_box li dl{
                                display: flex;
                                flex-wrap: wrap;
                                justify-content: space-between;
                                position: relative;
                                background: #ffffff;
}
.news_box li dl dt{
                                width: 100%;
                                font-size: 0.7rem;
                                font-weight: bold;
                                line-height: 1.2em;
                                position: absolute;
                                top: 1.5em;
                                left: 18%;
	text-align: left;
}
.news_box li dl dt span.topics{
	background-color: #df0101;
	color: #fff;
                                padding: 4px;
                                margin-right: 4px;
	width: 30%;
	text-align: center;
}
.news_box li dl dt span.event{
	background-color: #ffd700;
	color: #333;
                                padding: 4px;
                                margin-right: 4px;
	width: 30%;
	text-align: center;
}
.news_box li dl dt span.blue{
	background-color: #3366FF;
	color: #fff;
                                padding: 4px;
                                margin-right: 4px;
	width: 30%;
	text-align: center;
}
.news_box li dl dt span.work {
	background-color: #d2b48c;
	color: #fff;
                                padding: 4px;
                                margin-right: 4px;
	width: 30%;
	text-align: center;
}
.news_box li dl dt span.data{
                                padding: 4px;
	display: inline-block;
	width: 30%;
	text-align: center;
}
.news_box dd{

}
.news_box dd.icon{
                                width: 16%;
                                min-height: 6vw;
                                margin: 0;
                                overflow: hidden;
                                position: relative;

}
.news_box dd.icon img{
                                height: 100%;
                                width: 100%;
                                object-fit: cover;
                                font-family: 'object-fit: cover;';
}
.news_box dd.title{
                                font-size: 0.8rem;
                                width: 81.5%;
                                font-weight: bold;
	text-align: left;
                                overflow: hidden;
	margin-top:2.8em;
	margin-bottom: 0.3em;
	margin-right: 0.3em;
                                left: 0%;
}
.newsbtn {
	margin-top: 80px;
                                font-size: 1rem;
	font-weight:600;
	letter-spacing: 0.3rem;
                                position: absolute;
                                top: 10rem;
                                left: 0%;
}


/* ************************************************ 
エステート　PC
 * ************************************************ */
.estate{
	width: 96%;
	margin: auto;
}
.estate .inner{
	width: 100%;
	margin: auto;
	margin: 6rem 0rem 4rem 0rem;
                                position: relative;
}
.estatetxt_box{
                                position: absolute;
                                top: -1em;
                                left: 0%;
	width: 30%;
}
.estatetxt_box h3{
                                font-size: 2rem;
	text-align: left;
	font-weight: 600;
	color: #5f9ea0;
	letter-spacing: 0.3em;
                                font-family: 'Open Sans', Arial, Roboto, "Droid Sans", 見出ゴMB31, MidashiGoPro-MB31, "游ゴシック体", YuGothic, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
}
.estatetxt_box h3 p{
                                font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	color: #5f9ea0;
}
.estatetxt_box .txt{
                                font-size: 0.9rem;
	font-weight: 300;
	text-align: justify;
	line-height: 2.4em;
	letter-spacing: 0.2em;
	color: #333;
	margin-top:40px;
}
ul.estate_box{
                                display:flex;
                                justify-content:space-between;
                                padding:  0px;
                                flex-wrap: wrap;
	width: 65%;
                                margin: 0 0 0 auto;
	text-align:center;
	overflow:hidden;
}
.estate_box{
                                display:flex;
                                justify-content:space-between;
                                padding:  0px;
                                flex-wrap: wrap;
	width: 65%;
                                margin: 0 0 0 auto;
	text-align:center;
	overflow:hidden;
}
.estate_box li{
                                width: 27%;
                                list-style: none;
	display: inline-block;
                                margin-bottom: 20px;
                                padding: 2%;
	border: 1px solid #c3d3d3;
}
.estate_box::after {
                                content: "";
                                display: block;
                                width: 31%;
                                height: 0;
}
.estate_box li dl{
                                display: flex;
                                flex-wrap: wrap;
                                justify-content: space-between;
                                position: relative;
                                background: #ffffff;
}
.estate_box li dl dt{
                                width: 100%;
                                top: 0.7em;
                                overflow: hidden;
}
.estate_box li dl dd{
                                width: 100%;
                                margin: 0;
                                overflow: hidden;
                                text-align: justify;
                                font-size: 0.8rem;
}
.estate_box li dl dd p.title{
                                font-size: 1rem;
                                font-weight:600;
                                margin-top: 8px;
                                text-align: left;

}
.estate_box li dl dd span{
	position: absolute;
	top: 0em;
	display: inline-block;
	width: 28%;
	padding: 0em;
	text-align: center;
                                font-size: 0.7rem;
	font-weight:600;
}
.estate_box li dl dd span.akiya{
	background-color: #ffff00;
	color: #111;
	display: block;
}
.estate_box li dl dd span.tochi{
	background-color: #adff2f;
	color: #111;
	display: block;
}
.estate_box li dl dd span.chintai{
	background-color: #ff69b4;
	color: #fff;
	display: block;
}
.estatebtn {
	margin-top: 140px;
                                font-size: 1rem;
	font-weight:600;
	letter-spacing: 0.2rem;
                                position: absolute;
                                top: 20rem;
                                left: 0%;
}


/* NEWアイコン */
.new > p:nth-child(1)::after {
  display        : inline-block;       /* インラインボックス定義  */
  content        : "NEW";              /* 表示する文字            */
  background     : #ff0000;            /* 背景色                  */
  color          : #ffffff;            /* 文字色                  */
  font-weight    : bold;               /* 太字                    */
  font-size      : 100%;               /* ベースの文字サイズ      */
  letter-spacing : 2px;               /* 文字間隔詰め            */
  line-height    : 0.9;                  /* 1行の高さ               */
  vertical-align : top;                /* 基準の高さ位置          */
  margin         : 2px;                  /* 外余白なし              */
  padding        : 2px;                /* 反転時の内余白          */
  transform      : scale(0.6)          /* 文字サイズ変更          */
                   translateX(-30%);    /* 横位置調整              */
                                       /* ブリンクのアニメ指定    */
  animation      : newAnime .7s infinite alternate;
}
@keyframes newAnime {
   0% { color      : #ff0000;          /* ブリンク時の文字色      */
        background : #ffffff;          /* ブリンク時の背景色      */
      }
 100% { color      : #ffffff;          /* ブリンク時の文字色      */
        background : #ff0000;          /* ブリンク時の背景色      */
      }
}



/* ************************************************ 
ピックアップエリア
 * ************************************************ */

.pickup{
	background-color: #193b57;
	margin-top:0;
}
.pickup .inner{
                                width: 96%;
                                margin: auto;
                                margin-top: 3rem;
}
.pickup h3{
                                text-align: center;
                                color: #fff;
                                padding: 0 5%;
                                margin-bottom: 2rem;
                                font-size: 1.4rem;
                                font-family: 'Open Sans', Arial, Roboto, "Droid Sans", 見出ゴMB31, MidashiGoPro-MB31, "游ゴシック体", YuGothic, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
}
.pickup h3 span{
                                font-size: 0.8rem;
                                display: block;
                                text-align: center;
}
.pickupContainer {
                                width:100%;
                                display: flex;
                                flex-wrap: wrap; /*子要素の折り返し*/
                                justify-content:space-between /*子要素の均等配置*/
}
.pickupContainer div.item {
                                width: 32%;
                                margin-bottom: 3rem;
                                font-size: 0.9rem;
                                margin-top: 0px;
                                background: #ffffff;
                                padding: 0%;
}
.pickupContainer div.item p {
                                margin: 0 1rem;
                                margin-top: 0.5rem;
                                font-size: 1rem;
                                font-weight:600;
                                text-align: justify;
}
.pickupContainer div.item div.link{
                                font-size: 0.8rem;
                                font-weight:600;
                                text-align: left;
                                margin: 1rem 1rem 0 1rem;
                                padding: 0.5rem 0rem;
                                position: relative;
	border-top: 1px solid #ddd;
}
.pickupContainer div.item div.icon {
                                position: absolute;
                                display: block;
                                width: 6px;
                                height: 6px;
                                border-top: solid 1px #111;
                                border-right: solid 1px #111;
                                -webkit-transform: rotate(45deg);
                                transform: rotate(45deg);
                                top: 1rem;
                                right: 4px;
}





/* ************************************************ 
コンセプトハウス　SP
 * ************************************************ */

.conceptHouse {
	margin: auto;
	width: 96%;
	overflow:hidden;
}

.conceptHouse h3{
	text-align: center;
	color: #111;
	padding: 0 5%;
	margin-top: 4rem;
	margin-bottom: 2rem;
                                font-size: 2rem;
	letter-spacing: 0.1rem;
                                font-family: 'Open Sans', Arial, Roboto, "Droid Sans", 見出ゴMB31, MidashiGoPro-MB31, "游ゴシック体", YuGothic, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
}
.conceptHouse h3 span{
                                font-size: 0.8rem;
	display: block;
	text-align: center;
}
.conceptHouse p{
                                font-size: 1rem;
}
.conceptHouseContainer {
	width:100%;
                                display: flex;
	flex-wrap: wrap; /*子要素の折り返し*/
                                justify-content:space-between /*子要素の均等配置*/
}
.conceptHouseContainer div.item {
	width: 31.5%;
                                margin-bottom: 3rem;
                                font-size: 0.9rem;
	margin-top: 40px;
                                border: 1px solid #c3d3d3;
	padding-bottom: 1rem;
}
.conceptHouseContainer div.item h4 {
                                font-size: 1.2rem;
	font-weight: 600;
	color: #111;
	margin: 0% 5%;
	margin-top: 1rem;
}
.conceptHouseContainer div.item p {
	margin-top: 1rem;
                                font-size: 0.8rem;
	font-weight:400;
	text-align: justify;
	color: #666;
	margin: 0% 5%;
}



/* ************************************************ 
ブログ
 * ************************************************ */
.media {
	background-color: #f3f6f5;
}
.media .inner {
	width: 96%;
	margin: auto;
	margin-top: 100px;
}
.media section.blog h3 {
                                font-size: 1.2rem;
	font-weight:600;
	padding: 0.5em 0;
}

.media section.blog div.blogContainer {
                                width: 100%;
                                display: flex;
	flex-wrap: wrap; /*子要素の折り返し*/
                                justify-content:space-between /*子要素の均等配置*/
}
.media section.blog div.blogContainer div.item {
	width: 31.5%;
                                margin-bottom: 3rem;
                                font-size: 0.9rem;
	margin-top: 40px;
                                border: 1px solid #c3d3d3;
	padding-bottom: 1rem;
}


.media section.blog div.blogContainer div.item dl {
	overflow: hidden;
	padding: 0 0 25px 0;
}
.media section.blog div.blogContainer div.item dt {
	display:block;
                                width: 100%;
}
.media section.blog div.blogContainer div.item dd {
	margin-top: 1rem;
	display: inline-block;
                                width: 90%;
                                font-size: 1rem;
	text-align: justify;
}
.media section.blog div.blogContainer div.item dd span {
	display: block;
                                font-size: 0.8rem;
	color: #858585;
}
.blogbtn {
	margin-top: 20px;
                                font-size: 1rem;
	font-weight:600;
	letter-spacing: 0.2rem;

}

/* ************************************************ 
目視録・リンク
 * ************************************************ */
.other{
	margin: auto;
	width: 96%;
                                margin-top: 80px;
                                margin-bottom: 80px;
	text-align: left;
	overflow:hidden;
                                display:flex;
}
.other .mokushi{
                                width: 48%;
	display: inline-block;
                                margin-bottom: 0px;
	border-right: 1px solid #999;
	padding: 0% 3% 0% 0%;
}
.other .mokushi h4{
	text-align: center;
	color: #111;
	padding: 0 5%;
	margin-bottom: 2rem;
                                font-size: 1.2rem;
	letter-spacing: 0.1rem;
                                font-family: 'Open Sans', Arial, Roboto, "Droid Sans", 見出ゴMB31, MidashiGoPro-MB31, "游ゴシック体", YuGothic, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
}
.other .mokushibtn{
	text-align: center;
                                font-size: 0.8rem;
}
.other dl{
	margin-top: 10px;
	padding: 0%;
}
.other dt{
	width: 100%;
}
.other dd{
	width: 90%;
	margin: 20px auto;
                                font-size: 0.8rem;
	text-align: center;
}
.other .link{
	margin: auto;
                                width: 50%;
	margin-top: 0rem;
	padding: 0% 0% 0% 2%;
}
.other .link h4{
	font-weight:600;
	text-align: center;
	color: #111;
	margin-top: 0rem;
	margin-bottom: 2rem;
                                font-size: 1.2rem;
	letter-spacing: 0.1rem;
                                font-family: 'Open Sans', Arial, Roboto, "Droid Sans", 見出ゴMB31, MidashiGoPro-MB31, "游ゴシック体", YuGothic, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
}
.other .link ul{
                                width: 100%;
                                margin-top: 0px;
}
.other .link li{
                                width: 46%;
                                list-style: none;
                                display: inline-block;
                                margin-top: 0px;
                                border: 1px solid #c3d3d3;
}





/*swiperカスタマイズ*/
.swiper-container {
padding-bottom: 38px; /* 画像下の余白調整（25pxじゃなくてもいいです） */
}
.swiper-slide {
text-align: center;
}




}