@charset "utf-8";
/*
Theme Name: responsive_001
Theme URI: http://neko-no-te.biz/
Description: responsive_001
Version: 1.0
Author: Tomohiro Nakayama
Author URI: http://neko-no-te/
Tags: simple
*/

/* =Reset default browser CSS.
html5doctor.com Reset Stylesheet v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
-------------------------------------------------------------- */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
body {
    line-height:1;
     height: 100%;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}
nav ul {
    list-style:none;
}
blockquote, q {
    quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}
a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}
/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000; 
    font-style:italic;
    font-weight:bold;
}
del {
    text-decoration: line-through;
}
abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}
table {
    border-collapse:collapse;
    border-spacing:0;
}
/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}
input, select {
    vertical-align:middle;
}



/* 共通設定
------------------------------------------------------------*/
body{
font: 12px/1.5 "メイリオ", Meiryo,  "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
color:#333;
-webkit-text-size-adjust: none;
background:#555 url(img/bg.png);
}

body,html {
	height: 100%;
}



/**** リンク ****/

a{
margin:0;
padding:0;
text-decoration:none;
outline:0;
vertical-align:baseline;
background:transparent;
font-size:100%;
color:#780000;
}

a:hover, a:active{
outline: none;
color:#c80000;
}

a img:hover{opacity:.8;}



/**** Clearfix ****/

.clearfix:after{
  content: "."; 
  display: block; 
  height: 0; 
  font-size:0;	
  clear: both; 
  visibility:hidden;
}
	
.clearfix {display: inline-block;} 

/* Hides from IE Mac */
* html .clearfix {height: 1%;}
.clearfix {display:block;}
/* End Hack */ 


.size-full {
	max-width: 100%;
}

.size-half {
	max-width: 50%;
}

.alignleft {
	float: left;
	margin: 0 10px 10px 0;
}

.aligncenter {
	text-align: center;
}

.more {
	text-align: right;
}

/* フォーム
------------------------------------------------------------*/



/* レイアウト
------------------------------------------------------------*/

#wrap {
	width: 960px;
	background: url("img/wrap_bg.png") repeat-y 0pt 50pt;
	margin: 0px auto;
	position: relative;
	height:auto !important; /*IE6対策*/
	height: 100%; /*IE6対策*/
	min-height: 100%;
}

#header {
	float: left;
	width: 280px;
	margin-bottom: 20px;
}



#nav {
	float: left;
	width: 280px;
	margin: 0;
}

#main {
	float: right;
	width: 680px;
	margin-bottom: 20px;
	padding-top: 70px;
	min-height: 800px;
	background: url("img/tel.png") top right no-repeat;

}

#main_inner {
	margin: 0 25px 0 10px;
}

#sidebar {
	float: left;
	width: 260px;
	margin: 0 10px;
}

#footer {
	width: 940px;
	margin: 0 auto;
	content: ""; 
	display: block; 
	clear: both;
	background-color: #eee;
	border-top: 1px dotted #ccc;
}






/* ヘッダー
*****************************************************/
#header h1 {
	height: 140px;
	width: 280px;
	margin: 0;
}

#header h1 a{
	display: block;
	height: 140px;
	width: 260px;
	margin: 0 auto;
	text-indent: -9999px;
	overflow: hidden;
	background: url("img/title_logo_off.png") no-repeat top left;
}

#header h1 a:hover{
}

/* サイト説明文
----------------------------------*/


/* ナビ
----------------------------------*/

#nav ul {
	width: 260px;
	border-top: 1px solid #780000;
	margin: 0 auto;
}

#nav ul li{
	border-bottom: 1px dotted #780000;
}

#nav ul li a{
	display: block;
	padding: 8px 20px;
}

.li_menu {
	text-indent: -9999px;
	overflow: hidden;
}

#li_about a {
	background: url("img/li_about.png") no-repeat bottom left;
}

#li_about a:hover {
	background: #eee url("img/li_about_on.png") no-repeat bottom left;
}

#li_step a {
	background: url("img/li_step.png") no-repeat bottom left;
}

#li_step a:hover {
	background: #eee url("img/li_step_on.png") no-repeat bottom left;
}

#li_event a {
	background: url("img/li_event.png") no-repeat bottom left;
}

#li_event a:hover {
	background: #eee url("img/li_event_on.png") no-repeat bottom left;
}

#li_success a {
	background: url("img/li_success.png") no-repeat bottom left;
}

#li_success a:hover {
	background: #eee url("img/li_success_on.png") no-repeat bottom left;
}

#li_document a {
	background: url("img/li_document.png") no-repeat bottom left;
}

#li_document a:hover {
	background: #eee url("img/li_document_on.png") no-repeat bottom left;
}

#li_info a {
	background: url("img/li_info.png") no-repeat bottom left;
}

#li_info a:hover {
	background: #eee url("img/li_info_on.png") no-repeat bottom left;
}

#li_policy a {
	background: url("img/li_policy.png") no-repeat bottom left;
}

#li_policy a:hover {
	background: #eee url("img/li_policy_on.png") no-repeat bottom left;
}

#li_faq a {
	background: url("img/li_faq.png") no-repeat bottom left;
}

#li_faq a:hover {
	background: #eee url("img/li_faq_on.png") no-repeat bottom left;
}

#li_contact a {
	background: url("img/li_contact.png") no-repeat bottom left;
}

#li_contact a:hover {
	background: #eee url("img/li_contact_on.png") no-repeat bottom left;
}


/* ロゴ (サイトタイトル)
----------------------------------*/


/* 
----------------------------------*/
#main {
	font-size: 16px;
}

#main p{
	margin-bottom: 10px;
}

#main h2 {
	font-size: 1.2em;
	margin: 10px 0;
	padding: 10px;
	background: #fff url("img/bg.png");
	border: 1px solid #c80000;
	border-radius: 5px;
}

#main h3 {
	font-size: 1em;
	margin: 10px 0 5px;
	color: #c80000;
}

#main #sub_title {
	width: 100%;
	max-width: 100%;
	border: 1px solid #999;
	background: url("../images/title1.jpg") no-repeat top left;
}

#main #sub_title p{
	font-size: 1.2rem;
	color: #fff;
	text-align: right;
	margin: 40px 20px 20px;
}

#main ul {
	list-style: none;
}

/* 石彫り工芸について
----------------------------------*/

#aboutBody #main table {
	list-style: none;
	width: 90%;
	margin: 20px auto 40px;
	padding: 1em;
}

#aboutBody #main table tr{

}

#aboutBody #main table tr td{
	border: 1px solid #333;
	padding: 10px 20px;
}

#aboutBody #main table tr td.left{
	font-size: 1.1em;
	font-weight: bold;
	width: 120px;
}



#aboutBody #main dl dd{
	font-size: 1.1em;
	font-weight: bold;
	margin: 0 0 15px 220px;
	float: left;
}


/* 商品の紹介
----------------------------------*/

#serviceBody .eyecatch {
	float: left;
	margin: 0 10px 10px 0;
}

#serviceBody .step {
	background: #fff;
}

#serviceBody .step_inner{
	padding: 0 10px 10px;
}

#serviceBody .step_inner img{
	background-color: #fff;
	padding: 5px;
	border: 1px solid #ccc;
}

#gallery li a{
	float: left;
	margin: 5px;
	border: solid #ccc 1px;
}

#gallery li a img{
	float: left;
	margin: 5px;
}

/* お問い合わせから完成まで
----------------------------------*/

#stepBody .eyecatch {
	float: left;
	margin: 0 10px 10px 0;
}

#stepBody .step {
	padding-bottom: 60px;
	background: #fff url("img/arrow_down.png") no-repeat bottom center;
}

#stepBody .step_inner{
	padding: 0 10px 10px;
	border: 1px dotted #ccc;
	overflow: hidden;
	min-height: 180px;
}

#stepBody .step_inner h3:first-letter{
	font-size: 1.8em;
}

#stepBody .step_inner img{
	background-color: #fff;
	padding: 5px;
	border: 1px solid #ccc;
}

#stepBody .step_inner img#shotai,
#stepBody .step_inner img#mojiiro{
	padding: 0 0 20px;
	border: none;
}

#stepBody .step_inner .shape,
#stepBody .step_inner .color {
	width: 50%;
	float: left;
}


/* 価格表
----------------------------------*/

#priceBody #main table{
	font-size: 0.9em;
	width: 100%;
	background: #fff;
}

#priceBody #main table tr{
}

#priceBody #main table tr td{
	border: 1px solid #ccc;
	padding: 2px 3px;
	text-align: center;
	vertical-align: middle;
}

#priceBody #main table tr td dl{
	font-size: 0.8em;
	margin: 0;
}

#priceBody #main table tr td img{
}

/* 個人情報保護
----------------------------------*/

#policyBody #main p {
	text-indent: 1em;
}

#policyBody #main h3 {
	margin: 30px 0 10px;
}

#policyBody #main ul {
	margin: 30px;
}

#policyBody #main #madoguchi {
	margin: 30px 50px;
	padding: 10px;
	border: 1px solid #ccc;
	background-color: #eee;
}

/* お問い合わせ　資料請求
----------------------------------*/
#documentBody #main section,
#contactBody #main section {
	margin: 20px auto 40px;
}

#documentBody #main #phone,
#contactBody #main #phone {
	margin: 20px auto;
	padding: 10px 20px;
	width: 250px;
	border: 1px solid #c80000;
}

#documentBody #main form,
#contactBody #main form {
	width: 95%;
	background: #eee;
	margin-top: 30px;
}

#documentBody #main form dl,
#contactBody #main form dl{
	margin: 10px;
}

#documentBody #main form dl dt,
#contactBody #main form dl dt{
	float: left;
	width: 25%;
	margin-top: 1em;
}

#documentBody #main form dl dd,
#contactBody #main form dl dd{
	float: left;
	width: 75%;
	margin-top: 1em;
}

#documentBody #main form p,
#contactBody #main form p{
	width: 100%;
	padding: 20px 0;
	text-align: center;
}

/* サイドバー　ウィジェット
*****************************************************/
#sidebar section {
	margin: 50px 10px 0 0;
}

#sidebar ul {
	list-style: none;
}

#sidebar .contact {
	margin: 0 0 30px 10px;
	padding: 10px 10px 0;
	border: 1px dotted #999;
	background: #eee;
}

#sidebar .box {
	margin-top: 10px;
}

#sidebar .contact h4{
	font-size: 14px;
	color: #780000;
	padding-left: 5px;
	margin-bottom: 5px;
	border-left: 3px solid #780000;
}

#sidebar .contact p{
	margin-bottom: 10px;
}

#sidebar .qr img{
	margin: 0 10px;
	float: left;
}

#sidebar .qr p{
	padding: 10px 0;
}

#side_info {
	background: url("img/side_info.png") no-repeat top center;
	text-indent: -9999px;
	height: 24px;
	overflow: hidden;
}

#side_mobile {
	background: url("img/side_mobile.png") no-repeat top center;
	text-indent: -9999px;
	height: 24px;
	overflow: hidden;
}


/* Voice
-------------*/
#voiceBody #main section {
	margin: 30px 0;
	border-bottom: 1px dotted #ccc;
}

#voiceBody #info {
	font-size: 0.8em;
	margin: 50px 30px 0;
}

/* トップページ */

#topBody #main .post {
	width: 100%;
}

#topBody #main .post .post_item{
	width: 100%;
	margin: 10px 0;
}

#topBody #main .post .post_item img{
	float: left;
	margin: 0 15px 10px 0;
	width: 45%;
}


#topBody #news ul{
	width: 90%;
	margin: 10px auto 10px;
}

#topBody #news li{
	margin: 0;
	border-bottom: 1px dotted #ccc;
}

#topBody #news li a{
	display: block;
	padding: 5px 10px;
}

#topBody #news li a:hover{
	background: #ccc;
}

/* フッター
*****************************************************/

#footer ul{
	list-style: none;
	text-align: center;
	padding: 10px 0;
}

#footer ul li{
	margin: 0 5px;
	display: inline;
}

#footer ul li a:hover{
	background: #ccc;
}

#footer-inner {
	width: 100%;
	height: 100%;
}
#footer #footer-map {
	margin: 20px;
	float: left;
}

#footer #footer-contact {
	margin: 20px;
	float: right;
}

#footer #copyright {
	text-align: center;
	padding-bottom: 10px;
}

#toTop a{
	position: fixed;
	width: 55px;
	height: 55px;
	bottom: 20px;
	right: 20px;
	background: url("img/arrow_up.png")no-repeat center bottom;
	text-indent: -9999px;
}


/* 959px以下から 1カラム表示
------------------------------------------------------------*/
@media only screen and (max-width: 959px){

#wrap {
	width: 95%;
	margin: 0 auto;
	background-image: none;
	background-color: #fff;
}

#header {
	width: 100%;
	padding: 0;
	margin: 0;
	background-color: #fff;
}

#header h1 {
	background: url("img/logo2.png") center top no-repeat;
}

#nav {
	background: #fff;
	width: 100%;
	padding: 0;
}

#main {
	width: 100%;
	margin: 0 auto 10px;
	background-image: none;
}

#sidebar {
	width: 100%;
	background: #fff;
	margin: 0;
}

#sidebar #mobile{
	display: none;
}

#footer {
	width: 100%;
	margin: 0;
	padding: 20px 0 10px;
	position:relative;
}

#footer ul,
#footer #footer-inner{
	display: none;
}

#nav {
	background: #fff;
	width: 100%;
	padding: 0;
}

#nav ul {
	width: 95%;
	margin: 0 auto;
}

#nav ul li{
	float: left;
	width: 33.3%;
	border-bottom: 1px dotted #780000;
}

}


/* 幅620px以下から
------------------------------------------------------------*/
@media only screen and (max-width: 620px){
#wrap {
	width: 100%;
	margin: 0 auto;
}

#header {
	padding: 0;
	margin: 0 0 10px;
	background: #fff url("img/bg.png");
}

#header h1{
	width: 260px;
	margin: 0 auto;
}

#nav ul li a{
	margin: 0;
}

#main {
	background-image: none;
	margin: 0 auto 10px;
}

#sidebar {
}

#footer {
	font-size: .75em;
}



#nav ul{
	width: 100%;
}

#nav ul li{
	float: left;
	width: 100%;
}

#topBody #main .post .post_item{
	float: none;
	margin: 10px 0;
	width: 100%;
}

#topBody #main #news ul{
	width: 100%;
	margin: 0;
}

#topBody #main #news ul li span {
	display: block;
}

#serviceBody #main #main_inner section img{
	float: none;
}

#stepBody #main #main_inner .step_inner .shape {
	width: 100%;
}

#stepBody #main #main_inner .step_inner .color{
	width: 100%;
	float: none;
}

#stepBody #main #main_inner .step_inner .color img{
	float: none;
}



#documentBody #main section,
#contactBody #main section {
	margin: 0px auto 20px;
}

#documentBody #main #phone,
#contactBody #main #phone {
	margin: 10px auto;
	padding: 5px 10px;
	width: 90%;
	border: 1px solid #c80000;
}

#documentBody #main form,
#contactBody #main form {
	width: 95%;
	background: #eee;
	margin-top: 20px;
}

#documentBody #main form dl,
#contactBody #main form dl{
	margin: 5px;
}

#documentBody #main form dl dt,
#contactBody #main form dl dt{
	float: none;
	width: 100%;
	margin-top: 1em;
}

#documentBody #main form dl dd,
#contactBody #main form dl dd{
	float: none;
	width: 100%;
	margin-top: 1em;
}

#documentBody #main form p,
#contactBody #main form p{
	width: 100%;
	padding: 10px 0;
	text-align: center;
}


#policyBody #main #madoguchi {
	margin: 10px 20px;
	padding: 5px;
	border: 1px solid #ccc;
	background-color: #eee;
}

.size-half {
	max-width: 100%;
}

.alignleft {
	float: none;
	margin: 0;
}



}
