@charset "utf-8";
/*
Theme Name: responsive_078
Theme URI: http://c-tpl.com/
Description: responsive_078
Version: 1.0tit
Author: Cloud template
Author URI: http://c-tpl.com/
Tags: simple

	Cloud template v1.0
	 http://c-tpl.com/

	This theme was designed and built by Cloud template,
	whose blog you will find at http://c-tpl.com/

	The CSS, XHTML and design is released under GPL:
	http://www.opensource.org/licenses/gpl-license.php

*/

/* =Reset default browser CSS.
Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {border: 0;font-family: inherit;font-size: 100%;font-style: inherit;font-weight: inherit;margin: 0;outline: 0;padding: 0;vertical-align: baseline;}
:focus {outline: 0;}

ol, ul {list-style: none;}
table {border-collapse: separate;border-spacing: 0;}
caption, th, td {font-weight: normal;text-align: left;}
blockquote:before, blockquote:after,q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
a img {border: 0;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}

body{
font: 12px/1.5 "Lucida Sans Unicode", "Lucida Grande","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
color:#333;
-webkit-text-size-adjust: none;
min-width:730px;
}


/* リンク設定
------------------------------------------------------------*/
a{
margin:0;
padding:0;
text-decoration:none;
outline:0;
vertical-align:baseline;
background:transparent;
font-size:100%;
color:#C4707E;
}

a:hover, a:active{
outline: none;
color:#d680ac;
}

a img:hover{opacity:.8;}


/**** Clearfix ****/
#wrapper:after,nav#mainNav ul:after, nav#mainNav .inner:after, .newsTitle:after, .post:after,.inner:after,ul.news:after{content:""; display: table;clear:both;}
#wrapper,nav#mainNav ul,.newsTitle, .post, nav#mainNav .inner,ul.news{zoom: 1;}


/* フォーム
------------------------------------------------------------*/
input[type="text"], textarea{
vertical-align:middle;
max-width:90%;
line-height:30px;
height:30px;
padding:1px 5px;
border:1px solid #d4d4d7;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
font-size:100%;
color:#555;
background:#fcfcfc;
}

textarea{
height:auto;
line-height:1.5;
}

input[type="submit"],input[type="reset"],input[type="button"], p.readon a{
vertical-align:top;
padding:0 10px;
background: #d680ac;
background: -moz-linear-gradient(top, #d680ac 0%, #bc477d 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d680ac), color-stop(100%,#bc477d));
background: -webkit-linear-gradient(top, #d680ac 0%,#bc477d 100%);
background: -o-linear-gradient(top, #d680ac 0%,#bc477d 100%);
background: linear-gradient(to bottom, #d680ac 0%,#bc477d 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d680ac', endColorstr='#bc477d',GradientType=0 );
border:0;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
line-height:28px;
height:28px;
font-size:120%;
color:#fff;
}

input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover,p.readon a:hover{
background: #bc477d;
background: -moz-linear-gradient(top, #bc477d 0%, #d680ac 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#bc477d), color-stop(100%,#d680ac));
background: -webkit-linear-gradient(top, #bc477d 0%,#d680ac 100%);
background: -o-linear-gradient(top, #bc477d 0%,#d680ac 100%);
background: linear-gradient(to bottom, #bc477d 0%,#d680ac 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bc477d', endColorstr='#d680ac',GradientType=0 );
cursor:pointer;
}
*:first-child+html input[type="submit"]{padding:3px;}


/* レイアウト
------------------------------------------------------------*/
.inner{
margin:0 auto;
padding:0;
max-width:930px;
}

#about #wrapper{
padding:0px;
margin:0px;
width:100%;
background:url(images/conbg2.png);
background-position: top right; 
background-repeat: no-repeat;
}

#order #wrapper{
margin:0px;
width:100%;
background:url(images/conbg3.png);
background-position: top right; 
background-repeat: no-repeat;
}

#contact #wrapper{
margin:0px;
width:100%;
background:url(images/conbg4.png);
background-position: top right; 
background-repeat: no-repeat;
}

#wrapper{
margin:0px;
background:url(images/conbg.jpg);
background-position: top right; 
background-repeat: no-repeat;
}


#toppage #wrapper{
padding:0px;
margin:0px;
background:url(images/conbg5.png);
background-position: top right; 
background-repeat: no-repeat;
}

#content{
clear:both;
position:relative;
z-index:199;
margin: 20px auto;
max-width:700px;
}

#footer{
clear:both;
padding:0px;
color:#fff;
} 



/* ヘッダー
*****************************************************/
#header{
margin:0 auto;
height:74px;
width:100%;
}

.bg{
margin:0 auto;
width:970px;
padding:0px;
background:url(images/head_bg.jpg);
background-repeat: no-repeat;
background-position: left top;
height:77px;
}


/* サイト説明文
----------------------------------*/
#header h1{
padding:0px;
font-size:12px;
color:#fff;
font-weight:normal;
float:right;
}

#header p{
margin:0px;
padding:0px;
font-size:80%;
color:#666;
font-weight:normal;
float:right;
}


/* ロゴ (サイトタイトル)
----------------------------------*/
#header h2{
padding:0px;
color: #515151;
height:0px;
visibility:hidden;
}

/* トップページ　メイン画像
----------------------------------*/
#mainImg{
clear:both;
margin:0px;
line-height:0;
text-align:center;
z-index:0;
}

.post{
margin:20px 10px;
}

.toppage h4{
margin:0 0 10px;
font-size:16px;
font-weight:normal;
color:#333;
}


/* 記事ループ
*****************************************************/
.list{
padding:10px 0;
border-bottom:1px dashed #e4e4e4;
}

.list:last-child{border:0;}

.post .list p{padding:0;}

.list span{padding-left:10px;}

/* 新着ループ
*****************************************************/
#leftside dt{
  clear: left;
  float: left;
  margin: 0 0 1em;
  width: 7.5em;
  border-left: solid 8px #fff;
  padding-left: 5px;
  color: #000;
      }

#leftside dd{
  margin-bottom: 1em;
  margin-left: 7.5em;
   }


#sidebar dt{
  margin: 0;
  width: 100%;
  border-bottom: dotted 1px #ccc;
  padding-left: 5px;
  color: #000;
      }

#sidebar dd{
  margin-bottom: 1em;
   }

/* タイポグラフィ
*****************************************************/
.heading{
clear:both;
margin:0 0 15px;
background:url(images/headingBg.png) repeat-x;
}

h2.title{
padding:0px;
font-size:1%;
font-weight:bold;
color:#666;
}


.post p{
margin: 0px 10px 15px;
padding:0px;
}

.post ul{margin: 0 0 5px 0px;}

.post ul li{
margin-bottom:0px;
padding-left:0px;
background:url(images/bullet.png) no-repeat 0 8px;
}

.post ol{margin: 0 0 10px 10px;}

.post ol li{list-style:decimal;}

.post h1{
margin:20px 0;
padding:5px 0 10px;
font-size:150%;
background:url(images/headingBg.png) repeat-x 0 100%;
}

.post h2{
background-image:url(images/subtitle.jpg);
height:30px;
white-space:nowrap;
display: block;
padding-top:1px;
padding-left:40px;
padding-bottom:2px;
font-size:130%;
margin:10px 0;
background-position: top left;
border-bottom:2px solid #bc477d;
}

.title01{
background-image:url(images/top_title01.jpg);
background-repeat: no-repeat;
height:22px;
text-indent:100%;
white-space:nowrap;
display: block;
overflow:hidden;
margin:0px 0px 15px 0px;
padding:0px;
}

.title02{
background-image:url(images/top_title02.jpg);
background-repeat: no-repeat;
height:22px;
text-indent:100%;
white-space:nowrap;
display: block;
overflow:hidden;
margin:30px 0px 15px 0px;
padding:0px;
}


.title03{
background-image:url(images/top_title03.jpg);
background-repeat: no-repeat;
height:22px;
text-indent:100%;
white-space:nowrap;
display: block;
overflow:hidden;
margin:30px 0px 15px 0px;
padding:0px;
}

.title04{
background-image:url(images/top_title04.jpg);
background-repeat: no-repeat;
height:22px;
text-indent:100%;
white-space:nowrap;
display: block;
overflow:hidden;
margin:30px 0px 15px 0px;
padding:0px;
}

.title05{
background-image:url(images/top_title05.jpg);
background-repeat: no-repeat;
height:50px;
text-indent:100%;
white-space:nowrap;
display: block;
overflow:hidden;
margin:30px 0px 15px 0px;
padding:0px;
}



.title06{
background-image:url(images/top_title06.jpg);
background-repeat: no-repeat;
height:50px;
text-indent:100%;
white-space:nowrap;
display: block;
overflow:hidden;
margin:30px 0px 15px 0px;
padding:0px;
}
.title07{
background-image:url(images/top_title07.jpg);
background-repeat: no-repeat;
height:50px;
text-indent:100%;
white-space:nowrap;
display: block;
overflow:hidden;
margin:30px 0px 15px 0px;
padding:0px;
}



.post blockquote {
clear:both;
padding:10px 0 10px 15px;
margin:10px 0 25px 30px;
border-left:5px solid #ccc;
}
 
.post blockquote p{padding:5px 0;}

table{
border: 1px #344b20 solid;
border-collapse: collapse;
border-spacing: 0;
margin:10px 0 20px;
}

table th{
padding:10px;
color:#999;
border: 1px #344b20 solid;
border-width: 0 0 1px 1px;
background:#e9f7dd;
}

table td{
padding:10px;
border: 1px #344b20 solid;
border-width: 0 0 1px 1px;
background:#fff;
}

img.aligncenter {
display: block;
margin:5px auto;
}

img.alignright, img.alignleft{
margin: 0 10px 15px 15px;
display:inline;
}

img.alignleft{margin:10px 15px 15px 10px;}

.alignright{float:right;}
.alignleft{float:left;}

#gallery-1 img{
border:1px solid #eaeaea !important;
padding:5px;
background:#fff;
}

#gallery-1 img:hover{background:#fffaef;}

/* トップ周りのタイポ
*****************************************************/
#content dl{  
}
#content dt{
	float:left;
	padding-top : 10px;
	padding-bottom : 10px;
	padding-left : 10px;
	margin-right:10px;
	font-weight: bold;
	color: #ab326b;
}

#content dt img{  
border:1px solid #ab326b
}

#content dd{
	padding-left : 230px;
	padding-top : 10px;
	padding-right : 10px;
	padding-bottom : 10px;
	margin-bottom : 10px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #7B3939;
}

#link dt{  
  padding-top : 10px;    
  padding-bottom : 5px;
  padding-left : 10px;
  margin-right:10px;
  font-weight: bold;
  font-size: 120%;
  color: #ab326b
}

#link dt img{  
border:1px solid #ab326b
}

#link dd{
  padding-left : 10px;
  padding-right : 10px;
  padding-bottom : 10px;
  width : auto;
  border-bottom:1px dotted #669966;
}

/* カタログ　
-------------*/
.btncatalog {
	-moz-box-shadow:inset 0px 1px 0px 0px #fce2c1;
	-webkit-box-shadow:inset 0px 1px 0px 0px #fce2c1;
	box-shadow:inset 0px 1px 0px 0px #fce2c1;
	background-color:#86454D;
	-webkit-border-top-left-radius:0px;
	-moz-border-radius-topleft:0px;
	border-top-left-radius:0px;
	-webkit-border-top-right-radius:37px;
	-moz-border-radius-topright:37px;
	border-top-right-radius:37px;
	-webkit-border-bottom-right-radius:0px;
	-moz-border-radius-bottomright:0px;
	border-bottom-right-radius:0px;
	-webkit-border-bottom-left-radius:37px;
	-moz-border-radius-bottomleft:37px;
	border-bottom-left-radius:37px;
	text-indent:0;
	border:1px solid #84474C;
	display:inline-block;
	color:#5B3231;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	font-style:normal;
	height:50px;
	line-height:50px;
	width:129px;
	text-decoration:none;
	text-align:center;
	text-shadow:1px 1px 0px #cc9f52;
}
.btncatalog {
	background-color:#D5C1C2;
}
.btncatalog {
	position:relative;
	top:1px;
}

/* お知らせ　
-------------*/
.newsTitle{
clear:both;
margin:0;
padding:7px 10px 10px 0;
font-size:110%;
background:url(images/border.png) repeat-x 0 100%;
}

.newsTitle{
padding:20px 10px;
color:#666;
background:url(images/headingBg.png) repeat-x 0 100%;
}

.newsTitle h3{
float:left;
font-weight:normal;
}
.newsTitle h3{
font-weight:bold;
}

.newsTitle p{
float:right;
padding:0 0 0 10px;
font-size:80%;
background:url(images/arrow2.png) no-repeat 0 5px;
}
.newsTitle p{
padding:5px 0 5px 10px;
background-position:0 50%;
}

.news p{
clear:both;
padding-bottom:2px;
border-bottom:1px dashed #e4e4e4;
}

.news p:last-child{border:0;}

.news p a{
display:block;
padding:5px 0;
color:#333;
font-style:italic;
font:italic 110% "Palatino Linotype", "Book Antiqua", Palatino, serif;
}

.news a span{
color:#515151;
font:normal 90% Arial, 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
}

.news span{padding-left:10px;}

.news a:hover span{color:#d680ac;}


/* トップページ */
#content .newsTitle h3{font-size:120%;}


/* フッター
*****************************************************/
#footer a{color:#fff;}

#footer .boxWrap{
width:930px;
margin-right:-40px;
}

#footer .box{
float:left;
width:450px;
margin-right:40px;
padding:20px 0;
}

.box .widgetWrap, .box section.widget ul{
padding:0 0 0 7px;
margin-top:0;
background:transparent;
border:0;
}

.box section.widget li a{
background:url(images/arrowWhite.png) no-repeat 0 12px;
border:0;
}

.box section.widget li a:hover{background-position:2px 12px;}

#footer h3{
padding:5px;
margin-bottom:10px;
font-size:120%;
font-weight:bold;
background:url(images/border2.png) repeat-x 0 100%;
}

.contact p{
padding:3px 0 3px 32px;
margin-bottom:3px;
font-size:110%;
background:url(images/iconHome.png) no-repeat 4px 0;
}

.contact p.mail{background-image:url(images/iconMail.png);}
.contact p.tel{background-image:url(images/iconTel.png);}
.contact p.fax{background-image:url(images/iconFax.png);}
.contact p.tw{background-image:url(images/iconTW.png);}
.contact p.fb{background-image:url(images/iconFB.png);}

#copyright{
clear:both;
padding:10px 0;
text-align:center;
font-size:90%;
color:#fff;
background-color: #5e171b;
}




/* page navigation
------------------------------------------------------------*/
.pagenav{
clear:both;
width: 100%;
height: 30px;
margin: 5px 0 20px;

}

.prev{float:left}

.next{float:right;}

#pageLinks{
clear:both;
color:#4f4d4d;
text-align:center;
}


/* トップページ 最新記事4件
------------------------------------------------------------*/
ul#banners,ul.post{
width:970px;
margin-right:-20px;
padding-bottom:20px;
}

ul#banners li,ul.post li{
float:left;
width:220px;
margin-right:20px;
}

ul.post{
padding:0;
background:transparent;
border:0;
}

ul.post img{
max-width:220px;
height:auto;
}

ul.post h3{
margin:10px 0;
padding-bottom:5px;
font-size:14px;
font-weight:normal;
color:#333;
border:0;
}

p.readon a{
padding:3px 10px;
font-size:95%;
}

ul#banners:after{content:""; display: table;clear:both;}
ul#banners{zoom: 1;}


/* PCメニュー
------------------------------------------------------------*/


a#menu{display:none;}


nav#mainNav{
	margin: 0px;
	width: 100%;
	height: 68px;
	background: url(images/navbg.jpg);
}

#navul{
margin: 0 auto;
height:68px;
width:970px;
}

nav#mainNav ul{
position:relative;
z-index:200;
margin: 0 auto;
height:68px;
padding-left: 247px;
list-style: none;
background: url(images/menu.jpg);
background-repeat: no-repeat;
}

nav#mainNav ul li {
  float: left;
}

nav#mainNav ul li a {
  display: block;
  height: 68px;
  overflow: hidden;
  background: url(images/menu.jpg) 0 0;
  text-indent: 100%;
  white-space: nowrap;
  margin-left: 1px;
}


nav#mainNav li.menu01,
nav#mainNav li.menu01 a {
  width: 87px;
}
nav#mainNav li.menu02,
nav#mainNav li.menu02 a {
  width: 168px;
}
nav#mainNav li.menu03,
nav#mainNav li.menu03 a {
  width: 149px;
}
nav#mainNav li.menu04,
nav#mainNav li.menu04 a {
  width: 119px;
}

nav#mainNav li.menu05,
nav#mainNav li.menu05 a {
  width: 97px;
}

nav#mainNav ul li.menu01 a { background-position: -250px 0px;}
nav#mainNav ul li.menu02 a { background-position: -337px 0; }
nav#mainNav ul li.menu03 a { background-position: -505px 0; }
nav#mainNav ul li.menu04 a { background-position: -654px 0; }
nav#mainNav ul li.menu05 a { background-position: -772px 0; }

nav#mainNav ul li a:hover { height: 68px; }
nav#mainNav ul li.menu01 a:hover { background-position: -250px -68px; }
nav#mainNav ul li.menu02 a:hover { background-position: -337px -68px; }
nav#mainNav ul li.menu03 a:hover { background-position: -505px -68px; }
nav#mainNav ul li.menu04 a:hover { background-position: -654px -68px; }
nav#mainNav ul li.menu05 a:hover { background-position: -772px -68px; }

#toggle {
	display: none;
}

@media only screen and (max-width: 480px) {
	#menu {
		display: block;
	}
	#menu li {
		width: 100%;
	}
	
nav#mainNav{
	margin:0px auto;
	width:100%;
	height:68px;
	background: url(images/menu2.jpg);
}

#navul{
margin: 0 auto;
height:30px;
width: 100%;
}

nav#mainNav ul{
position:relative;
z-index:200;
margin: 0 auto;
height:68px;
padding-left: 0px;
list-style: none;
	background: url(images/menu2.jpg);
background-repeat: no-repeat;
}

nav#mainNav ul li {
  float: none;
}

nav#mainNav ul li a {
  display: block;
  height: 30px;
  text-indent:10px;
  overflow: visible;
  background: url() 0 0;
  text-indent: 1px;
  white-space: normal;
  margin-left: 0px;
  background-color: #8b5459;
  border-bottom:#fff solid 1px;
  padding-top:5px;
}


nav#mainNav li.menu01,
nav#mainNav li.menu01 a {
    width: 100%;
}
nav#mainNav li.menu02,
nav#mainNav li.menu02 a {
    width: 100%;
}
nav#mainNav li.menu03,
nav#mainNav li.menu03 a {
    width: 100%;
}
nav#mainNav li.menu04,
nav#mainNav li.menu04 a {
    width: 100%;
}

nav#mainNav li.menu05,
nav#mainNav li.menu05 a {
    width: 100%;
}

nav#mainNav ul li.menu01 a { }
nav#mainNav ul li.menu02 a { }
nav#mainNav ul li.menu03 a { }
nav#mainNav ul li.menu04 a { }
nav#mainNav ul li.menu05 a { }

nav#mainNav ul li a:hover { height: 30px; }
nav#mainNav ul li.menu01 a:hover { }
nav#mainNav ul li.menu02 a:hover { }
nav#mainNav ul li.menu03 a:hover { }
nav#mainNav ul li.menu04 a:hover { }
nav#mainNav ul li.menu05 a:hover { }

	#toggle {
		display: block;
		position: relative;
		width: 100%;
		background-image:images/bg.jpg;
	}
	#toggle a{
		display: block;
		position: relative;
		padding: 20px 0 20px;
		border-bottom: 1px solid #FFF;
		color:#FFF;
		text-align: center;
		text-decoration: none;
	}
	#toggle:before {
		display: block;
		content: "";
		position: absolute;
		top: 50%;
		left: 10px;
		width: 30px;
		height: 30px;
		margin-top: -15px;
	}
	#toggle a:before, #toggle a:after {
		display: block;
		content: "";
		position: absolute;
		top: 50%;
		left: 10px;
		width: 30px;
		height: 6px;
		background: #fff;
	}
	#toggle a:before {
		margin-top:-9px;
	}
	#toggle a:after {
		margin-top: 3px;
	}
}