@charset "Shift_JIS";

/*---------------------------------------------

Page CSS

for sumitomo-rd-mansion.jp
coded by d-spica at 2011-01-19
linked to "good-design/index.html"

-----------------------------------------------

Basic Layout

  div#page
  
    div#header
      h1

    div#main
      div.section.about
        h2
      div.section.recent
        h2
      div.section.archives
        h2
        div.archive
          h3
          dl
      div.section.summary
        h2
        h3
        p
      div.section.photo
        p
      div.section.detail
        div
        table
      p.footnote
      
    div#footer
      ul.nav
      p.nav
      p.credit

---------------------------------------------*/

@import url(default.css);
@import url(../js/jquery.s-functions.css);


body {
  margin: 0;
  padding: 0;
  background: #000 ;
  line-height: 1.4;
  color: #FFF;
}


/* Page Area */

#page {
  margin: 0 auto;
  padding: 0 15px;
  width: 960px;
}


/* Header Area */

#header {
}


/* Navigation Area */

#navigation {
  margin-top: 20px;
}

#navigation ul {
  overflow: hidden;
  margin-right: -2px;
  width: 960px;
  background-color:#333;
}

#navigation ul li {
  float: left;
  margin-right: 1px;
  margin-bottom:1px;
}

#navigation ul li a:hover {
  text-decoration: none;
}


/* Main Area */

#main {
  background: #FFF;
  padding: 30px 20px 10px;
  color: #000;
}

#main h2,
#main h3,
#main p,
#main ul,
#main dl {
  margin-bottom: 10px;
}

#main div.section {
  margin-bottom: 35px;
  font-size: 108%;
  zoom: 1;
}

#main div.section:after {
  content: '';
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

#main div.section h2 {
  font-size: 158%;
}

#main .photo img,
#main .photos img {
  margin-bottom: 3px;
}

#main p.nav-back {
  margin-top: -30px;
  text-align: right;
}

#lightBox #main p.nav-back {
  display: none;
}

#main p.nav-guide a:hover img,
#main p.nav-back a:hover img {
  filter: alpha(opacity=70);
  -moz-opacity: 0.7;
  opacity: 0.7;
}

.sub #main .footnote {
  margin-bottom: 40px;
}

.sub #main ul.nav {
  text-align: center;
  font-size: 93%;
}

.sub #main ul.nav li {
  display: inline;
  margin-left: 6px;
  margin-right: 6px;
}

.sub #main ul.nav li a,
.sub #main ul.nav li span {
  padding: 2px 4px;
}

.sub #main ul.nav li a {
  color: #666;
}

.sub #main ul.nav li a:hover,
.sub #main ul.nav li span {
  background: #999;
  text-decoration: none;
  color: #FFF;
}


/*    About Section */

#main div.about {
  padding-left: 40px;
}

#main div.about h2 {
  margin-left: -40px;
	float: left;
}
#main div.about #gdm {
	float: right;
}
#main div.about p {
	clear: both;
}



/*    gdaward Section */

#main h2 {margin-bottom:30px;}

#main div.gdaward {
  position: relative;
}

#main div.gdaward.layout01 .photo {
	float:left;
	margin-left:0px;
	margin-right:20px;
}
#main div.gdaward.layout02 .photo {
	float:right;
	margin-left:20px;
}
#main div.gdaward .copy {
	margin-bottom:20px;
}
#main div.gdaward .nav-guide {text-align:right;}



/*    Recent Section */

#main div.recent {
  position: relative;
  border-bottom: solid 2px #DCC19A;
  padding-left: 560px;
  padding-bottom: 18px;
  min-height: 480px;
}

* html #main div.recent {
  height: 480px;
}

#main div.recent h2 {
  margin: 0 0 30px -560px;
}

#main div.recent p.photo {
  position: absolute;
  top: 110px;
  left: 0;
  width: 530px;
  font-size: 72%;
  color: #666;
}

#main div.recent ul.photos {
  overflow: hidden;
  margin-left: -4px;
  width: 364px;
  font-size: 72%;
  color: #666;
}

#main div.recent ul.photos li {
  float: left;
  margin: 0 0 10px;
  padding-left: 4px;
  width: 178px;
}

#main div.recent p.nav-guide {
  text-align: right;
}

#main div.recent p.button {
  position: absolute;
  bottom: 18px;
  right: 0;
  text-align: right;
}

#main div.recent p.button a {
  display: block;
  margin-top: 8px;
}


/*    Archives Section */
   
#main div.archives {
  margin: 0 -20px;
} 

* html #main div.archives {
  margin-bottom: 35px;
}

*:first-child+html #main div.archives {
  margin-bottom: 35px;
}

#main div.archives h2 {
  margin: 0 20px 20px;
}

#main div.archives div.archive {
  float: left;
  margin: 0 20px 35px;
  border-bottom: solid 5px #333;
  width: 440px;
  font-size: 93%;
  display: inline; /* for IE */
}

#main div.archives div.archive h3 {
  background: #000;
  padding: 5px 10px;
  font-size: 100%;
  font-weight: normal;
  color: #FFF;
}

#main div.archives div.archive dl {
  position: relative;
  padding-right: 215px;
  min-height: 150px;
}

* html #main div.archives div.archive dl {
  height: 150px;
}

#main div.archives div.archive dl dt {
  margin-bottom: 5px;
  border-bottom: dotted 1px #D00422;
  padding-bottom: 5px;
}

#main div.archives div.archive dl dd.photo {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 77%;
  color: #666;
}

#main div.archives div.archive dl dt em {
  display: block;
  font-size: 124%;
  color: #D00422;
}

#main div.archives div.archive p.nav-guide a {
  margin-right: 8px;
}
  

/*    Summary Section */

#main div.summary {
  padding: 0 20px;
}

#main div.summary #gdm {
  float: right;
}

#main div.summary h2 {
  display: inline;
/*  display: inline-block;*/
  padding: 4px 8px;
  background: #000;
  font-size: 93%;
  font-weight: normal;
  color: #FFF;
}

#main div.summary h3 {
  margin: 5px 0 30px;
  font-size: 158%;
}

#main div.summary h3 .note {
  font-size: 64%;
  font-weight: normal;
}

#main div.summary p {
  padding-left: 10px;
  border-left: solid 5px #000;
  font-size: 143%;
  color: #666;
}


/*    Photo Section */

#main div.photo {
  float: left;
/*  overflow: hidden; */
  padding-left: 20px;
  width: 510px; /* メイン写真の幅 + 10px */
}

#main div.photo p {
  float: left;
  margin: 0 10px 10px 0;
  width: 245px;
  text-align: center;
}

#main div.photo p.main-photo {
  margin-bottom: 30px;
  width: 500px;
}

#main div.photo p img {
  margin-bottom: 0;
  vertical-align: bottom;
}

#main div.photo p.note {
  clear: left;
  float: none;
  width: 500px;
  text-align: right;
  font-size: 77%;
}


/*    Detail Section */

#main div.detail {
  float: right;
  padding-right: 20px;
  width: 350px;
}

#main div.detail div {
  margin-bottom: 30px;
  min-height: 375px; /* メイン写真の高さ */
}

* html #main div.detail div {
  height: 375px; /* メイン写真の高さ */
}

#main div.detail div.square {
  min-height: 500px; /* メイン写真の高さ */
}

* html #main div.detail div.square{
  height: 500px; /* メイン写真の高さ */
}


#main div.detail table {
  margin-bottom: 15px;
  width: 100%;
}

#main div.detail table th,
#main div.detail table td {
  padding: 4px 6px;
  border: solid 1px #999;
}

#main div.detail table th {
  width: 6em;
  background: #F4F4F4;
  white-space: nowrap;
  text-align: center;
  font-weight: normal;
}

#main div.detail table td .note {
  font-size: 86%;
}

#main .footnote {
  clear: both;
  font-size: 70%;
}



/* Footer Area */

#footer {
  padding: 15px 5px 30px;
  font-size: 77%;
}

#footer ul.nav {
  margin-bottom: 0;
  border-left: solid 1px #FFF;
  line-height: 1.1;
}

#footer ul.nav li {
  display: inline;
  border-right: solid 1px #FFF;
  padding-left: 8px;
  padding-right: 8px;
}

#footer ul.totop {
  margin: -1.1em 0 10px 800px;
  border-left: none;
  border-right: none;
  text-align: right;
}

#footer ul.totop li {
  border-left: none;
  border-right: none;
}

#footer p.credit {
  text-align: right;
  color: #999;
}



/* All Ground Parts */


em,
strong {
  color: #D00422;
}

hr {
  height: 0;
  visibility: hidden;
  clear: both;
}


/* --- Link */

a {
  color: #FFF;
}

#main a {
  color: #333;
}

a:hover {
  text-decoration: underline;
}