/* =Typography
-----------------------------------------------------------------------------*/
body {
	background-color:#AEAEAE;
}

body#home {
	background:url(../img/mainimage.jpg) center bottom no-repeat #AEAEAE;
}

h1, h2, h3, h4, h5 {
	font-family: 'Oswald', 'Trebuchet MS', Helvetica, Arial, sans-serif;
}
h2, h3 {
	font-weight: normal;
}
/* =Links
-----------------------------------------------------------------------------*/
/* =Common
-----------------------------------------------------------------------------*/
img, #feedback, #banner, #intro li {
	border-radius: 3px;
}

a {
    text-decoration:none;
}

a:hover{
	color:mediumblue!important;
    text-decoration:under;
}

/* =Layout
-----------------------------------------------------------------------------*/
.wrapper {
	padding:0 0 10px 0;
	width: 94%;
	max-width: 1300px;
	margin: auto;
	border-bottom:8px solid #555;
	box-shadow: 0 1px 3px rgba(25, 25, 25, 0.6);
	background-color:rgba(255,255,255,0.9)
}

/* =Header
-----------------------------------------------------------------------------*/
#header {
	padding-top: 15px;
	background-color:rgb(171, 124, 75);
	border-top:5px solid #555;
	border-bottom: .8em solid #fff;
}
#header h1 {
	float: left;
	font-size: 32px;
	margin-top: 1px;
	margin-bottom: 0;
	padding-left:0.2em;
	color: rgba(0, 0, 0, .9);
	text-shadow: 1px 1px 5px #fff;
}
#header h2 {
	font-size: .85em;
	padding-top: 0.5em;
	color: rgba(0, 0, 0, .8);
	padding-left:0.7em;
	clear:both;
	text-shadow: 1px 1px 2px #bbb;
}

#header nav {
	margin-bottom: 0;
	float: right;
	text-transform: uppercase;
}

#header .nav-g li{
	text-shadow: 1px 1px 2px #eee;
}

#header .nav-g li a{
	color:white
}


/* =Promo
-----------------------------------------------------------------------------*/
#promo {
	margin-bottom: 1.5em;
	background:url(../img/mainimage.jpg)  center top no-repeat;
	background-size: cover;
	height:512px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

#control {
	margin-top:-87px;
	margin-bottom:20px;
	text-align:right;
	padding-right:10px;
}

#control .arrow {

}

/* =Nav
-----------------------------------------------------------------------------*/


/* =Misc
-----------------------------------------------------------------------------*/
#intro {
}


#intro .unit-padding{
	font-size:13px;
}

#intro .unit-padding h3,
#beta-inner h3.widget-header,
#gamma-inner h3.widget-header
{
	border-left:5px solid #808000;
	text-indent:5px;
	font-size:18px;
}

#works #container {
	position: relative;
	padding-bottom: 10px;
	width:100%;
	min-height:1200px;
}
.grid {
	background: #fff;
	box-shadow: 0 1px 3px rgba(34, 25, 25, 0.4);
	float: left;
	font-size: 12px;
	margin: 8px;
	min-height: 100px;
	padding: 15px;
	width: 220px;
	transition: top 1s ease, left 1s ease;
}
.grid h2 {
	border-bottom: 1px solid #ccc;
	color: #222;
	display: block;
	font-size: 15px;
	margin: 10px 0;
	padding: 0 0 5px;
	letter-spacing: 1px;
}
.grid p {
	color: #555;
}
.grid img {
	border: none;
	margin-left:auto;
	margin-right:auto;
}
.grid .meta {
	color: #777;
	font-style: italic;
	text-align: right;
}
.grid .imgholder img {
	background: #ccc;
	display: block;
	max-width: 100%;
}


.aboutus, .contact {
	padding:1.5em;
	margin:12px 8px;
	box-shadow: 0 1px 3px rgba(34, 25, 25, 0.6);
	background-color:white;
}

.aboutus h1, .contact h1, #works #container h1{
	border-left:5px solid #808000;
	text-indent:5px;
	font-size:18px;
	margin-bottom:20px;
}

 #works #container h1{
	margin-left:6px;
	margin-top:6px;
 }

.contact dl,
.contact .button,
.naiyou
{
	margin: 0 auto;
	max-width:600px;
}
.contact input, .contact textarea {
	width:99%;
	margin-top:5px;
	margin-bottom:5px;
}
.contact textarea {
	min-height:10em;
}

.contact .button{
	text-align:right;
}
.contact .button input {
	width:auto
}
.naiyou{
	padding-bottom:20px;
}

/* =blog
-----------------------------------------------------------------------------*/

.hidden {
    display:none;
}

.search-results-header,
.archive-title {
    margin-left:20px;
    border-left:solid 8px #369;
    padding-left:0.2em;
    color:rgba(0, 0, 0, .8);
}

#blog aside#tools{
    text-align:right;
    padding-top: 8px;
}

#blog aside#tools div,
#blog aside#tools h3{
    display:inline-block;
}

#blog aside#tools h3{
    width:10px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}
/*
#blog aside#tools div input#search,
.widget-content input#search {
    width:auto;
    height:23px;
    margin:5px 0 5px 5px;
    padding-right:0;
    border:1px solid #d0d0d0;
    -moz-border-radius:5px 0 0 5px;
    -webkit-border-radius:5px 0 0 5px;
    border-radius: 5px 0 0 5px;
}
*/

/*#blog aside#tools div input#button,
.widget-content input#button {
    height:27px;
    width:50px;
    border:1px solid #d0d0d0;
     -moz-border-radius:0 5px 5px 0;
     -webkit-border-radius:0 5px 5px 0;
     border-radius: 0 5px 5px 0;
}*/

#beta {
    margin-bottom:2em;
}

.widget-search .widget-content{
    letter-spacing: -.40em;
    margin-right:20px;
}

.widget-sign-in {
    margin-right:8px;
}

.widget-content form{
    margin:0;
}


input,select{
    vertical-align:middle;
}

#comments dl,
#comments .button,
#comments #comments-open-footer
{
        max-width:600px;
}
#comments #comments-open-footer{
    max-width:575px;
    padding-right:15px;
}

#comments input#comment-author,
#comments input#comment-email,
#comments input#comment-url,
#comments textarea {
        width:95%;
        margin-top:5px;
        margin-bottom:5px;
	    border:1px solid #d0d0d0;
    	-moz-border-radius:5px;
   		-webkit-border-radius:5px;
   		border-radius: 5px;
        height:23px;
}

#comments textarea {
        min-height:10em;
}

#comments-open-captcha .label {
	margin-bottom:10px;
}

#captcha_code {
		border:1px solid #d0d0d0;
        -moz-border-radius:5px;
        -webkit-border-radius:5px;
        border-radius: 5px;
		margin-bottom:5px;
        height:23px;
}

#comments-open-footer{
        text-align:right;
}
#comments-open-footer input,
#contact .button input {
        width:120px;
        border:1px solid #CCCCCC;
        -webkit-box-shadow: #FEFFFF 0px 1px 1px ;-moz-box-shadow: #FEFFFF 0px 1px 1px ; box-shadow: #FEFFFF 0px 1px 1px;
        -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px;
        font-size:14px;font-family:arial, helvetica, sans-serif;
        padding:10px;
        margin:0 0 0 12px;
        text-decoration:none;
        display:inline-block;
        text-shadow: 0px 1px 0 rgba(255,255,255,1);
        font-weight:bold; color: #4A4A4A;
       background-color: #F7F5F6; background-image: -webkit-gradient(linear, left top, left bottom, from(#F7F5F6), to(#DDDDDD));
       background-image: -webkit-linear-gradient(top, #F7F5F6, #DDDDDD);
       background-image: -moz-linear-gradient(top, #F7F5F6, #DDDDDD);
       background-image: -ms-linear-gradient(top, #F7F5F6, #DDDDDD);
       background-image: -o-linear-gradient(top, #F7F5F6, #DDDDDD);
       background-image: linear-gradient(to bottom, #F7F5F6, #DDDDDD);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#F7F5F6, endColorstr=#DDDDDD);

}

#comments-open-footer input:hover{
       border:1px solid #ADADAD;
       background-color: #E0E0E0; background-image: -webkit-gradient(linear, left top, left bottom, from(#E0E0E0), to(#BDBBBC));
       background-image: -webkit-linear-gradient(top, #E0E0E0, #BDBBBC);
       background-image: -moz-linear-gradient(top, #E0E0E0, #BDBBBC);
       background-image: -ms-linear-gradient(top, #E0E0E0, #BDBBBC);
       background-image: -o-linear-gradient(top, #E0E0E0, #BDBBBC);
       background-image: linear-gradient(to bottom, #E0E0E0, #BDBBBC);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#E0E0E0, endColorstr=#BDBBBC);
}

/*#signin-widget-content a:before{content:"[ "}
#signin-widget-content a:after{content:" ]"}*/

#signin-widget-content {
}
#signin-widget-content a{
    text-decoration:none;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius: 5px;
    padding:2px 18px;
    display:block;
    background-color:#398bb3;
    color: #fff;
    background-repeat: repeat-x;
    background-image: -moz-linear-gradient(#2daddc, #398bb3);
    background-image: -ms-linear-gradient(#2daddc, #398bb3);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2daddc), color-stop(100%, #398bb3));
    background-image: -webkit-linear-gradient(#2daddc, #398bb3);
    background-image: -o-linear-gradient(#2daddc, #398bb3);
    background-image: linear-gradient(#2daddc, #398bb3);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#2daddc', endColorstr='#398bb3', GradientType=0);
    border-color: #096eb3
}

.widget-content ul {
    margin-left:1em;
}

.widget-content ul li{
    list-style-type:none;
    margin-left:0;
}
.widget-tag-cloud ul li{
    display: inline-block;
    margin-right:0.8em;
}

#blog article {
	margin:10px;
}
#blog section {
	padding: 30px;
	box-shadow: 0 1px 3px rgba(34, 25, 25, 0.6);
	margin:20px;
	background-color:#FFF;
}
 .unit-75 {
  width: 70%;
  float: left;
}
.unit-25 {
  width: 22.75%;
  float: left;
  margin-top:20px;
}
.asset-header{
	margin-bottom:20px;
}
.asset-meta {
	text-align:right;
}

#page-title {
   font-size: 1.714em;
   line-height: 1.1666em;
   margin-bottom: .4555em;
}

.asset-body p {
    word-wrap:break-word;
}

.asset-footer{
	padding-top:3em;
}

.entry-tags ul li,.entry-categories ul li {
    display:inline-block;
    margin-right:0.8em;
}

.trackbacks-header, .comments-open-header {
   font-size:1.143em;
   line-height:1.5em;
   margin-bottom:.4555em
}

.widget-archive-monthly ul {
    margin-left:1em;
}

.widget-archive-monthly ul,
.widget-archive-monthly  ul li
{
        list-style:none;
}

ul.tree {
        margin: 0 0 0 5px;
        padding: 0;
        list-style: none;
}

ul.tree ul {
        margin: 0 0 0 0px;
        padding: 0;
}

ul.tree li {
        margin: 0;
        padding: 0 0 0 6px;
        background-repeat: no-repeat;
        list-style: none;
}
ul.tree li.tree_end {
        list-style: none;
}

.content-nav{
    text-align:center;
    font-size:2.142em;
    color:rgba(0, 0, 0, .8);
}

.widget-twitter {
    height:600px;
}

iframe#twitter-widget-0{
    height:100%;
}

/* =Footer
-----------------------------------------------------------------------------*/


/* モダンブラウザ（Firefox Opera Safari）対策 */
.clearfix:after{
   content:".";
   display:block;
   height:0;
   clear:both;
   visibility:hidden;
}

/* Win版IE7とMac版IE5対策 */
.clearfix{
   display:inline-block;
}

/* Win版IE5および6対策 */
/* Hides from IE-mac \*/
* html .clearfix{
   height:1px;
}

.clearfix{
   display:block;
}
/* End hide from IE-mac */


/* =Tablet (Portrait)
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
    .wrapper { width: 748px; }
	.grid { width: 208px; }
}


/* =Mobile (Portrait)
-----------------------------------------------------------------------------*/
@media only screen and (max-width: 767px) {
	body{background-image:none}
	.wrapper { width: 300px; }
	.grid { width: 253px; }
	#promo { height:200px; }
	#control {display:none}
	#header h1 { float: none; font-size:1.7em; }
	#header nav { float: none; }
	#header nav ul { padding-bottom:0.5em}
	#header nav ul li { letter-spacing:1px; margin: 0.5em 12px 0 8px;font-size: .85em;padding:0.3em 0.7em; border:solid 1px  rgba(255, 255, 255, 0.4); box-shadow: 1px 1px 2px rgba(34, 25, 25, 0.4);}/**/
	#header nav ul li a:before {display: block;content: "";position: absolute;width: 1.4em;height: 1.4em;margin-top: .25em;margin-left:246px;background:url(../img/menu_arrow.png) no-repeat 0 0;background-size:contain;}
	h1#page-title, .content-nav {font-size: 1.714em}
	.search-results-header, .archive-title{margin-left:3px;}
	#beta{margin:8px;}
	#blog .search-results-container section{margin-bottom:20px}
	#partners ul li { padding-bottom: 1em; text-align: center; }
	#feedback { padding: 1.5em; }
	#banner { text-align: center; margin-bottom: 1.5em; }
	#blocks dt, #blocks dd { float: none; width: auto; }
	#footer section, #footer nav { float: none; }
	#footer nav ul { margin-top: 1em; }
	#footer nav ul li { margin: 0; margin-right: 1em; }
	.unit-75,.unit-25 {clear:both; width:100%;}
	#blog article, #blog section {margin:3px;padding: 5px;}
}


/* =Mobile (Landscape)
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 480px) and (max-width: 767px) {
	body{background-image:none}
	.wrapper { width: 420px; }
	.grid { width: 370px; }
	#header nav ul li a:before {margin-left:358px;}
	#header nav ul li a:after {margin-left:367px;}
	#promo { height:280px; }
	#control {display:none}
}
/* =Mobile (minumam)
-----------------------------------------------------------------------------*/
@media only screen and (max-width: 480px) {
	#comments #comments-open-footer{padding-right:8px}
}