@charset "UTF-8";
/* CSS Document */
* {
margin: 0;
padding: 0;
}

html{
overflow-y:scroll;
height:100%;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}


body {
color:#333;
text-align: center;
font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Arial,Helvetica,sans-serif;
font-size:88%;
line-height:145%;
margin:0;
}

div article{
text-align:center;
}

blockquote, q {
quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}

input, textarea{
margin: 0;
padding: 0;
}

ol, ul{
list-style:none;
}

table{
border-collapse: collapse; 
border-spacing:0;
height: auto;
max-width: 100%;
width: auto;
}

th,td{
height: auto;
max-width: 100%;
width: auto;
}

caption, th{
text-align: left;
}

a:focus {
outline:none;
}

.clearfix:after {
content: "."; 
display: block;
clear: both;
height: 0;
visibility: hidden;
}

.clearfix {
min-height: 1px;
}

* html .clearfix {
height: 1px;
/*¥*//*/
height: auto;
overflow: hidden;
/**/
}

.br:before {
content: "\A" ;
white-space: pre ;
}

img {
height: auto;
max-width: 100%;
vertical-align: bottom;
width: auto;
}

h3 {
margin-bottom: 5px;
padding:8px 0;
color:#FFF;
background-color: #c2da69;
font-size:300%;
line-height: 1;
font-family: 'Elsie', cursive;
font-weight: bold;
}

h4 {
margin-bottom: 25px;
color:#7E9B13;
font-size: 110%;
line-height: 1;
letter-spacing:0.1em;
font-weight:normal;
}

h5 {
margin-bottom: 3px;
font-size:110%;
line-height: 1;
font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
font-weight: bold;
}

p {
    margin:0;
}

.sp {
display:none;
}

#main {
height: 100%;
margin:0 auto;
top:75px;
margin-bottom: 45px;
}

@media only screen and (min-width:1501px) {
#main {
width: 85%;
}
}

#greeting {
width:90%;
margin:0 auto;
padding-top: 70px;
padding-bottom: 30px;
}

@media screen and (min-width: 1401px) {
#greeting {
width:75%;
}
}

#greeting p.copy {
font-size:200%;
margin-bottom:30px;
letter-spacing:0.05em;
	line-height: 140%;
	color:#553F48;
}

#greeting div.text {
line-height: 185%;
font-size:120%;
}

#about {
padding: 30px 0;
width:100%;
margin:0 auto;
}

#about p {
margin-top: 35px;
line-height: 26px;
}
#about p span {
font-size: 105%;
}

#about ul#tabs {
width:632px;
margin:15px auto 45px;
padding:0;
}
#about ul#tabs li {
float:left;
margin:0 25px;
padding:0;
width:160px;
height:25px;
list-style:none;
}
#about ul#tabs li div {
cursor:pointer;
}
#about ul#tabs li a {
display:block;
width:160px;
height:30px;
}

#about ul#tabs li div.tabs01 {
display:block;
width:160px;
height:30px;
overflow:hidden;
text-indent:-9999px;
background:rgba(0, 0, 0, 0) url(../images/tab_001_off.gif) no-repeat scroll left top;
}
#about ul#tabs li div.tabs01 a:hover {
background:rgba(0, 0, 0, 0) url(../images/tab_001_on.gif) no-repeat scroll left top;
}
#about ul#tabs li div.tabs02 {
display:block;
width:160px;
height:30px;
overflow:hidden;
text-indent:-9999px;
background:rgba(0, 0, 0, 0) url(../images/tab_002_off.gif) no-repeat scroll left top;
}
#about ul#tabs li.active div.tabs02,#about ul#tabs li div.tabs02 a:hover {
background:rgba(0, 0, 0, 0) url(../images/tab_002_on.gif) no-repeat scroll left top;
}

#about ul#tabs li div.tabs03 {
display:block;
width:160px;
height:30px;
overflow:hidden;
text-indent:-9999px;
background:rgba(0, 0, 0, 0) url(../images/tab_003_off.gif) no-repeat scroll left top;
}
#about ul#tabs li.active div.tabs03,#about ul#tabs li div.tabs03 a:hover {
background:rgba(0, 0, 0, 0) url(../images/tab_003_on.gif) no-repeat scroll left top;
}

#about #box1{
line-height: 210%;
font-size:105%;
letter-spacing:0.02em;
}
#about #box1 .text{
width: 80%;
margin: 5px auto 15px auto;
}
#about #box1 .text .large{
font-size:125%;
margin:15px 0;
	color:#553F48;
}

#about #box1 img{
margin-top:20px;
}

#about #box1 .sign{
	margin: 20px auto 0 auto;
	line-height: 140%;
}

#about #box1 .sign .small{
	font-size: 85%;
}

#about #box1 .sign .large{
	font-size: 110%;
color:#333;
}

#about #box2{
}
#about #box2 table{
margin:0 auto;
border-spacing: 10px;
border-collapse: separate;
}

#about #box2 table th{
font-size:106%;
font-weight:bold;
text-align:right;
padding:10px 13px;
border-right:#eb6d82 3px solid;
}
#about #box2 table td{
font-size:106%;
text-align:left;
padding:10px;
}
#about #box3 #gmap{
width:70%;
margin:0 auto;
}

#services {
width:100%;
padding-top: 50px;
margin:0 auto;
}

@media screen and (min-width: 1501px) {
#services {
width:75%;
}
}

#services  ul {
overflow: hidden;
padding: 0 10%;
margin:15px 0 25px 0;
width:80%;
text-align:center;
}

#services li {
width: 30%;
float: left;
}
#services li.left {
margin-right:5%;
}

#services .service{
font-size: 120%;
color:#eb6d82;
letter-spacing:0.1em;
font-weight:bold;
	margin:10px 0;
}

#services .thumbnail img{
border-radius: 50%;
width:60%;
height:60%;
}

#services .detail {
font-size:92%;
margin-top:2px;
text-align:justify;
}

#products {
width:100%;
padding-top: 50px;
text-align:center;
margin:0 auto;
}

@media screen and (min-width: 1501px) {
#products {
width:75%;
}
}

#products ul {
margin:30px auto 0 auto;
text-align:center;
width:80%;
}

#products li {
width: 30%;
float:left;
}

#products li.left {
margin-right:4%;
}

#products .thumbnail img{
border-radius: 10%;
width:100%;
height:80%;
	margin-bottom: 5px;
}

#products .product_name{
	background-color: #eb6d82;
color:#FFF;
font-weight:bold;
font-size:110%;
letter-spacing:0.1em;
	padding: 3px 0 0 0;
	margin: 10px 0;
}

#products .detail{
font-size:92%;
margin-top:3px;
text-align:justify;
}

#products .detail .large{
	font-size: 110%;
margin-bottom: 3px;
}



#contact {
padding:30px 0 50px 0;
text-align:center;
width:100%;
margin:0 auto;
}

@media screen and (min-width: 1501px) {
#contact {
width:60%;
}
}

#contact form{
width:70%;
margin:0 auto;
}

#contact .frame {
padding: 30px;
width:80%;
margin:0 auto;
background-color:#f8eff2;
}

#contact table{
margin:0 auto 20px auto;
width:100%;
border-top:#666666 1px dotted;
border-left:#666666 1px dotted;
border-right:#666666 1px dotted;
background-color:#FFFFFF;
}

#contact table th{
text-align:center;
width:25%;
}

#contact table td{
text-align:left;
width:75%
}

#contact table th,#contact table td{
padding:20px;
border-bottom:#666666 1px dotted;
font-size:86%;
vertical-align:middle;
}

#contact table td .answer{
background:#EDEDED none repeat scroll 0 0;
border:#CCC 1px solid;
padding: 6px 4px;
height: auto;
max-width: 100%;
width:90%;
}

#contact table td .answer01{
width:90%;
}

#contact table td .answer02{
width:40%;
}

#contact table td .answer03{
width:25%;
}

#contact .submit {
width: 100%;
margin:0px;
}
#contact .submit input{
background-color: #eb6d82;
font-size:110%;
font-weight:bold;
color:#fff;
border:0;
padding:20px;
}
#contact .submit input:hover{
background-color: #ccc;
color:#eb6d82;
}


#privacy {
width:80%;
margin:0 auto;
padding: 30px 0;
}

#privacy div {
font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
text-align:justify;
}


@media screen and (min-width: 1501px) {
#privacy {
width:75%;
}
}



#footer {
padding: 30px 50px;
background-color: #666;
text-align: center;
font-size: 	90%;
color: #fff;
}

#footer .banner {
	text-align:center;
}

#footer .banner img {
	margin:20px 5px 0 5px;
	width:130px;
}

.catalog{
    margin: 20px auto 0 auto;
}

.catalog a{
    color: #fff;
    background-color:  #D63538;
    padding:6px 10px;
    text-decoration: none;
}

.catalog a:hover{
    color: #fff;
    background-color:  #A60306;
}