@charset "UTF-8";

body {
  margin: 0;
}

/*フォントサイズをremで表示する為の基準の数値*/
/*100％の場合16pxになるので、62.5で10pxとなる*/
html { font-size: 62.5%; 
}

a {
text-decoration: none;
}


img {
  border: none;
}


/*ヘッダー部分全体100パーセント部分*/
header {
  background-color: #000080 ; 
  background-image:url(../introduce/img/machinami-w.png);
  background-repeat:repeat-x;
  background-position:right bottom;
  width:100%;
  border-style:none none solid none;
  border-width: 1px;
  border-color: #000080;
  margin:0px;
  
}


/*ヘッダー部分の中のBOX部分。autoによる中央揃え*/

.hbox1 {
  background-color: #ffffff;
  width:960px;
  margin-left: auto;
  margin-right: auto;
  margin-top:2px;
  margin-bottom:0px;
  padding: 1px;
  border-style: none;
  
}
  
/*ヘッダー横並び用ボックス*/
.hbox2 {
  display: flex;
  justify-content: space-between;
}




/*ヘッダーフォント　営業時間・定休日等*/

.shop1 {
  display: block;
  font-size:1.4rem;
  font-family: sans-serif;
  
}


/*spanタグで改行させる為blockにする*/
.shop2 {
  display: block;
}




/*電話番号用装飾*/
.tel {
  color: #000000;/*文字色*/
  font-size:1.6rem;
  font-weight: bold;
  font-family: sans-serif;
  padding: 0.6rem;/*文字周りの余白*/
  display: inline-block;
  background: #ffd700;/*背景色*/
  vertical-align: middle;
  border-radius: 25px 25px 25px 25px;/*左側の角を丸く*/

}



h1 {
font-size:1.4rem;
color : #000000 ;
margin-left:10px;
margin-top:0px;
margin-bottom:0px;
font-family: sans-serif;
}

/*ナビ部分100％部分*/
.nbox1{
  background-color: #fffaf0;
  width:100%;
  height:60px;
  margin-left: auto;
  margin-right: auto;
  margin-top:0px;
  margin-bottom:0px;
  padding: 1px;
  border-style:none none solid none;
  border-width: 1px;
  border-color: #000080;
  
}

/*ナビ部分ピクセル幅指定部分*/
.nbox2{
  width:950px;
  height:auto;
  margin-left: auto;
  margin-right: auto;
  margin-top:0px;
  margin-bottom:0px;
  padding: 1px;
  border-style: none;
  
}


/*ヘッダーナビゲーションメニュー*/
.navi1{
   list-style-type:none;
   padding: 0;
   width:100%;
   display: flex;
   text-align: left;
   justify-content: space-around;
}




/*ボタン装飾*/

.bot1 {
    background-color: #fffaf0;
    color: #000000;
    display: block;
    padding: 6px;
    position: relative; /* position: relative;で矢印の位置を基点とさせます */
    text-align: center;
    text-decoration: none;
    width:160px;
    height:22px;
    font-size: 16px;
    font-family: sans-serif;
}

.bot1::after{
/* 擬似要素で矢印アイコンをつくる */
    content: '';
    border: 0;
    border-top: solid 2px #808080;
    border-right: solid 2px #808080;
    display: inline-block;
    width: 10px;
    height: 10px;
    /* 矢印アイコンの位置を設定 */
    position: absolute;
    top: 50%;
    right: 5px;
    transform: translateY(-50%) rotate(45deg); /* rotate(45deg)で矢印を回転（向きを変更）させる */
}


.bot1:hover {
  font-weight: bold;
  color: #000000;
}


/*ボタン装飾2。当該ページ用リンク無しボタン*/
.bot2 {
    background-color: #fffaf0;
    color: #000000;
    display: block;
    padding: 6px;
    position: relative; /* position: relative;で矢印の位置を基点とさせます */
    text-align: center;
    text-decoration: none;
    width:160px;
    height:22px;
    font-size: 16px;
    font-weight: bold;
    font-family: sans-serif;
}

.bot2::after{
/* 擬似要素で矢印アイコンをつくる */
    content: '';
    border: 0;
    border-top: solid 2px #000080;
    border-right: solid 2px #000080;
    display: inline-block;
    width: 10px;
    height: 10px;
    /* 矢印アイコンの位置を設定 */
    position: absolute;
    top: 50%;
    right: 5px;
    transform: translateY(-50%) rotate(45deg); /* rotate(45deg)で矢印を回転（向きを変更）させる */
}



/* ページタイトルｈ２用 */
.paget {
  width:960px;
  margin-top:30px;
  margin-bottom:0px;
  margin-left: auto;
  margin-right: auto;
}  




h2 {
  padding: 6px 10px;/*上下 左右の余白*/
  color: #000000;/*文字色*/
  background: transparent;/*背景透明に*/
  border-left: solid 8px #87ceeb;/*左線*/
  border-bottom: solid 2px #87ceeb;
  font-size:2.2rem;
  margin-left:6px;
  margin-top:10px;
  margin-bottom:6px;
  font-family: sans-serif;
}



#main {
  background-color: #ffffff;
  width:990px;
  margin-top:15px;
  margin-left:auto;
  margin-right:auto;
}  




h3 {
 font-size:1.4rem;
 color:#000000;
 font-family: sans-serif;
}



.bk {
  background-color: #ffffff;
  width:960px;
  margin-top:20px;
  border-radius:6px;
  padding:14px;
  box-sizing:border-box;
  border: 1px solid #696969;
  margin-left:auto;
  margin-right:auto;
}  

/*物件詳細div外枠*/
.bk2 {
  background-color: #ffffff;
  border-bottom: 2px dotted #000000;
  padding-right:10px;
  display:flex;
}

/*物件詳細div左側・外観画像*/
.bk3 {
 background-color:#ffffff;
 width:122px;
}

/*物件詳細div右側・物件名号室*/
.bk4 {
 margin-left:10px;
 padding-left:2px;
 background-color:#ffffff;
}


/*物件名テキスト*/
.bname {
 border-bottom: 1px dotted #696969;
 font-weight: bold;
 font-size:1.4rem;
 font-family: sans-serif;
}

/*号室テキスト*/
.brno {
 font-size:1.4rem;
 font-family: sans-serif;
 border-left: 1px solid #333;
 border-right: 1px solid #333;
}

.brno + .brno {
  border-left: 0;
  border-right: 1px solid #333;
}




/*物件詳細divが入っているテーブル*/
table{
 border:solid 1px #ede4cd;
 border-collapse:collapse;
 width:900px;
 margin-bottom:15px;
 margin-left: auto;
 margin-right: auto;
}

th{
 border:solid 1px #ede4cd;
 width:80px;
 padding:10px;
 background-color:#ede4cd;
 vertical-align: middle;
}

td {
 width:350px;
 background-color:#ffffff;
 padding:10px;
}





/*フッターの下に隙間ができないようにする。absolute*/
footer {
  background-color:#000080;
  width:100%;
  margin-top:60px;
  margin-bottom:0px;
  padding-top:0px;
  position:absolute;
} 

/*フッターの上の色違いの部分*/
.fobi {
  background-color:#fffaf0;
  width:100%;
  height:60px;
  margin-top:0px;
  margin-bottom:0px;
  padding-top:5px;
  padding-bottom:5px;
} 

/*フッターの上の色違いの部分に入れる幅をピクセル指定したボックス*/
.fbox1 {
  width:950px;
  height:50px;
  margin-left: auto;
  margin-right: auto;
  padding:2px;
}

/*ロゴ画像ボックスとコピーライト部分を入れるボックス*/
.fbox2 {
  width:1000px;
  margin-left: auto;
  margin-right: auto;
  background-color:#000080;
}

/*ナビを囲んだボックスセンター配置*/
nav {
  margin-left: auto;
  margin-right: auto;
}


/*ナビの中のリストを横並びにさせるflexそして位置を均等に*/
.fnav {
  color:#000000;
  font-size:14px;
  list-style-type:none;
  display: flex;
  justify-content: space-between;
}

/*フッター中のロゴ画像を右寄せ*/
.flogo {
  background:#000080;
  padding-top:20px;
  text-align:right;
}

.copy {
  text-align:center;
  font-size:1.2rem;
  font-family: sans-serif;
  color:#ffffff;
}
