@charset "UTF-8";
/* ============================================================

 * www.creative-id.net
 * layout.css
 *
 * copyright : creative iD
 * author    : creative iD
 
============================================================ */

/*
 * layout
 */
body { background: #e6ecee url(../img/bg.jpg) top center; }
#container {  }
#container #container-inner { width: 1000px; margin: 0 auto; }
#content { float: right; width: 708px; min-height: 1024px; background: url(../img/content_bg.png) repeat-y; }
#content-inner { min-height: 768px; padding: 105px 34px 85px 34px; }
#content-inner h2.ttl-cont { height: 30px; }
#content ul#pankuzu { width: 640px; margin-bottom: 25px; padding: 10px 0; border-top: solid #dce5e7 1px; border-bottom: solid #dce5e7 1px; }
#content ul#pankuzu li { font-size: 85%; float: left; margin-right: 10px; padding-right: 12px; background: url(../img/ico_arrow3.gif) no-repeat center right; }
#content .description { font-size: 93%; line-height: 1.8; margin-bottom: 30px; }


#side { float: left; width: 220px; }
#side-inner { margin: auto; padding: 100px 0 25px 0; }
#side h1 a { position: relative; text-indent: -9999px; width: 156px; height: 44px; margin-left: -6px; margin-bottom: 55px; display: block; background: url(../img/side_logo.png) no-repeat; }
#side #catch { margin-bottom: 100px; }
#side #global-navi { }
#side #global-navi a { display: block; background: none; }
#side #global-navi ul { }
#side #global-navi ul li { padding: 10px 0; border-bottom: solid #fff 1px; }
#addr { padding: 1px; background: url(../img/pat_dotted.gif); }
#addr-inner { padding: 13px; background-color: #f9f7ed; filter: alpha(opacity=90); -moz-opacity: 0.90; opacity: 0.90; }


#container #container-inner #bnr {  }
#pagetop { text-align: right; margin: 75px 0 0 0; }
/*
#footer a:link { color: #ddd9ca; text-decoration: underline; background: none; }
#footer a:visited { color: #ddd9ca; text-decoration: underline; }
#footer a:hover { color: #3f3323; text-decoration: underline; background-color: #f5d800; }
#footer a:active { color: #ddd9ca; text-decoration: none; background-color: #f5d800; }
*/
#footer { clear: both; width: 640px; margin: 0 34px 64px 34px;  border-top: solid #dce5e7 1px; }
#footer #footer-inner { margin: auto; padding: 5px 0 0 0; }
#footer #footer-inner #copyright { text-indent: -9999px; width: 258px; height: 13px; margin: 0; background: url(../img/copyright.gif) no-repeat }




/*
 * element
 */
.ttl-1 { font-size: 100%; line-height: 1.8; color: #89979c; margin-bottom: 15px; padding-bottom: 4px; border-bottom: solid #dce5e7 1px; }
.ttl-2 { color: #fff; padding: 5px 12px; display:inline-block; background-color: #3f3323; }
.ico-arr { padding-left: 21px; background: url(../img/ico_arrow.gif) no-repeat 0px 2px; }


table.list-1 { width: 100%; margin-bottom: 12px; }
table.list-1 th { width: 20%; background-color: #fcfcfc; }
table.list-1 th,
table.list-1 td { font-size: 93%; line-height: 1.8; padding: 10px 12px; border: solid #dce5e7 1px; }




/*
 * top
 */
#content #news { width: 640px; height: 240px; padding: 20px 0; background: url(../img/info_bg.gif) no-repeat; }
#content #news #news-inner { overflow: auto; width: 590px; height: 220px; margin: 10px auto 10px auto; }
#content #news #news-inner dl { font-size: 85%; line-height: 1.8; margin-bottom: 2px; }
#content #news #news-inner dl dt  { float: left; width: 75px; }
#content #news #news-inner dl dd  { float: right; width: 495px; }

/***** [ slideshow ] *****/
#slideshow { width: 640px; height: 198px; margin-bottom: 25px; padding: 15px 0 15px 0; background: url(../img/index_recentworks_bg.gif) no-repeat; }
#slideshow .slides-nav { margin: 0 0 5px 10px; }
#slideshow .slides-nav li {	float: left; margin-right: 5px; }
#slideshow .slides-nav li a { overflow: hidden; width: 10px; height: 10px; text-indent: -9999px; display: block; background: url(../img/btn.gif) no-repeat; }
#slideshow .slides-nav:after { height:0; visibility: hidden; content: "."; display: block; clear: both; }
.js #slideshow .slides-nav li.on,
.js #slideshow .slides-nav li.on a { background: url(../img/btn_on.gif) no-repeat; }
#slideshow .slides { }
#slideshow .slides ul li img { /*margin: 0 10px; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd;*/ }




/*
 * works
 */
#content #works-thumblist { position: relative; margin-left: -31px; margin-bottom: 75px; }
#content #works-thumblist ul li { width: 300px; float: left; margin: 10px 0 10px 32px; }
#content #works-thumblist ul li img { margin-bottom: 10px; border: solid #ddd 1px; }
#content #works-thumblist ul li p { width: 300px; display: block; }
#content #works-detail { margin-bottom: 15px; }
#content #works-detail .txt { float: left; width: 365px; margin-right: 25px; display: inline; }
#content #works-detail .txt h4 { font-size: 100%; line-height: 1.8; color: #353f44; margin-bottom: 3px; }
#content #works-detail .cap { float: right; width: 250px; }
#content #works-detail .cap img { border: solid #ddd 1px; }
#content #works-detail .works-items { font-size: 85%; line-height: 1.6; color: #89979c; text-align: right; margin-bottom: 20px; padding-bottom: 3px; border-bottom: solid #d9e3e7 1px; /*padding: 2px 6px; background-color: #f4f7f7;*/ }
#content #works-detail .works-type { font-size: 93%; line-height: 1.6; font-weight: normal; color: #89979c; margin-bottom: 5px; }




/*
 * price
 */
table.list-1 { width: 100%; margin-bottom: 12px; }
table.list-1 th { width: 20%; background-color: #fcfcfc; }
table.list-1 th,
table.list-1 td { font-size: 93%; line-height: 1.8; padding: 8px 12px; border: solid #dce5e7 1px; }
table.list-1 td.price { text-align: right; width: 20%; }
table.list-1 td input { margin: 3px 0; }




/*
 * inquiry
 */
table.form-1 { width: 100%; margin-bottom: 12px; }
table.form-1 th { width: 20%; background-color: #fcfcfc; }
table.form-1 th,
table.form-1 td { font-size: 93%; line-height: 1.8; padding: 8px 12px; border: solid #dce5e7 1px; }
table.form-1 td input { margin: 3px 0; }




/*
 * clear
 */
#content ul#pankuzu,
#content #works-thumblist,
#content #info #info-inner dl,
#content #works-detail,
#content-inner,
#footer { display: inline-block; }

#content ul#pankuzu:after,
#content #works-thumblist:after,
#content #info #info-inner dl:after,
#content #works-detail:after,
#content-inner:after,
#footer:after { clear: both; display: block; content: ""; }




/*
 * hack
 */
* html #container #container-inner { position: relative; }
* html #content #works-thumblist { margin-left: -61px; }
* html #content #works-thumblist ul li { float: left; margin: 10px 0 10px 32px; }