@charset "utf-8";

/*---------------------------------------------
	Browser Default Initialization
  ---------------------------------------------*/

html {
overflow-y: scroll;
}

body, div, dl, dt, dd, ul, ul li, h1, h2, h3, h4, h5, h6,
pre, form, fieldset, input, textarea, p, blockquote, th, td,
section, nav, article, aside, hgroup, header, address,
figure, figcaption {
margin: 0;
padding: 0;
line-height: 140%;
}
address, caption, cite, code, dfn, em, strong, th, var {
font-style: normal;
font-weight: normal;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
caption, th {
text-align: left;
}
q:before ,q:after {
content: '';
}
object, embed {
vertical-align: top;
}
legend {
display: none;
}
h1, h2, h3, h4, h5, h6 {
font-size: 100%;
font-weight: 900;
}
img, abbr, acronym, fieldset {
border: 0;
}
img {
vertical-align: top;
-ms-interpolation-mode: bicubic;
width: auto;
height: auto;
}
ul li {
list-style-type: none;
}

/* ------ Body ------ */

body {
font-family: 'Noto Sans Japanese', sans-serif;
color: #221814;
font-size: 100%;
line-height: 160%;
text-align: left;
letter-spacing: -0.001em;		/* iOS4でのテキストの隙間への対応 */
-webkit-text-size-adjust: 100%;		/* 文字サイズの自動調整機能のキャンセル */
font-weight:600;
background:#fff;
width: 100%;
min-width: 1000px;
}

@media screen and (max-width: 640px) {
body {
font-size:80%;
min-width: 100%;	
}
img {
width: 100%;
height: auto;
max-width:auto;
}
}


/* ------ Anchor ------ */

a {
outline: none;
-webkit-transition: 0.3s ease-in-out;  
-moz-transition: 0.3s ease-in-out;  
-o-transition: 0.3s ease-in-out;  
transition: 0.3s ease-in-out; 
}

a:link {
text-decoration: none;
color: #221814;
}
a:visited {
text-decoration: none;
color: #221814;
}
a:hover {
text-decoration: underline;
color: #221814;
}
a:active {
text-decoration: underline;
color: #221814;
}

a img{
-webkit-transition: 0.3s ease-in-out;  
-moz-transition: 0.3s ease-in-out;  
-o-transition: 0.3s ease-in-out;  
transition: 0.3s ease-in-out; 	
}
a:hover img{
filter:alpha(opacity=80); /*IE*/
-moz-opacity:0.8; /*FF*/
opacity:0.8;
}

.clear{clear:both;}

/* ------ display ------ */

.pc{display:block;}
.sp{display:none;}

@media screen and (max-width: 640px) {
.pc{display:none;}
.sp{display:block;}
}


/* 
  Clearfix
------------------------------------------- */
.cf:before,
article:before{
  content:"";
  display: table;
}
.cf:after,
article:after{
  content:"";
  display: table;
  clear:both;
}


/* 
  All Layout
------------------------------------------- */
.inner{
width:1000px;
margin:0 auto;	
}

@media screen and (max-width: 640px) {
.inner{
width:100%;
padding:0;	
}
}


/* 
  Header Layout
------------------------------------------- */
#header{
background:url(./images/bg01.gif) repeat;	
}
#header h1{
float:left;
padding:12px 0 12px 60px;
}
#header .info{
float:right;
}
#header .info h2{
font-size:80%;
text-align:right;
font-weight:normal;
padding:8px 0;
}
#header .info ul{
text-align:right;	
}
#header .info ul li{
float:left;
margin:0 0 15px 8px;	
}
@media screen and (max-width: 640px) {
#header{
padding:10px 0;	
}
#header h1{
width:100%;
padding:0;
float:none;
text-align:center;	
}
#header h1 img{
width:60%;	
}
#header .info{
float:none;	
}
#header .info h2{
text-align:center;	
}
#header .info ul{
letter-spacing: -.40em;
text-align:center;	
}
#header .info ul li{
float:none;
display:inline-block;
letter-spacing: normal;
width:43%;
margin:0 1.5%;	
}
#header .info ul li.pc{
display:none;	
}
}

/* 
  MainImage Layout
------------------------------------------- */
#mainImg{
width:100%;
text-align:center;	
}
#mainImg img{
/*width:auto;*/
width: 100%;
}
@media screen and (max-width: 640px) {
#mainImg{
padding:0;
clear:both;	
}
#mainImg img{
width:100%;
}
}

/* 
main Layout
------------------------------------------- */
#container{
clear:both;	
}
#container article{
margin-bottom:40px;	
}
@media screen and (max-width: 640px) {
#container article{
margin-bottom:25px;	
}
}

#container h2{
text-align:center;
font-size:255%;
color:#fff;
background:#3b2c13;
padding:20px 0;	
}
@media screen and (max-width: 640px) {
#container h2{
font-size:125%;
padding:7px 0;
}
}

/*--- .contactArea(お問い合わせ) ---*/
#container .contactArea{
background:url(./images/bg01.gif) repeat;	
}

/* type01 */
#container .contactArea.type01 .inner{
padding:45px 25px 40px;
width:950px;
position:relative;	
}
#container .contactArea.type01 img{
float:left;
margin-right:30px;	
}
#container .contactArea.type01 .conts{
overflow:hidden;
text-align:center;	
}
#container .contactArea.type01 .conts img,
#container .contactArea.type01 ul li img{
float:none;
margin:0;	
}
#container .contactArea.type01 .conts p{
margin-bottom:10px;	
}
#container .contactArea.type01 ul{
position:absolute;
top:0;
right:25px;	
}
#container .contactArea.type01 ul li{
float:left;
margin-left:8px;	
}
@media screen and (max-width: 640px) {
#container .contactArea.type01 .inner{
padding:35px 5% 15px;
width:90%;
position:relative;	
}
#container .contactArea.type01 img{
float:none;
margin:0 0 15px;	
}
#container .contactArea.type01 .conts{
padding:0 8% 15px;	
}
#container .contactArea.type01 .conts img{
width:100%;
max-width:300px;	
}
#container .contactArea.type01 ul{
right:0;
left:0;
margin:auto;
text-align:center;
letter-spacing: -.40em;
}
#container .contactArea.type01 ul li{
display:inline-block;
float:none;
letter-spacing: normal;	
}
#container .contactArea.type01 ul li img{
width:auto;
height:25px;
margin:0;	
}
}

/* type02 */
#container .contactArea.type02{
border-top:#3b2c13 solid 20px;
border-bottom:#3b2c13 solid 20px;
}
#container .contactArea.type02.no-border{
border-bottom:none;
margin-bottom:0;	
}
#container .contactArea.type02 .inner{
padding:10px 0 20px;
position:relative;	
}
#container .contactArea.type02 p{
margin-bottom:10px;	
}
#container .contactArea.type02 .conts{
overflow:hidden;
padding:0 15px;	
}
#container .contactArea.type02 .conts img,
#container .contactArea.type02 ul li img{
float:none;
margin:0;	
}
#container .contactArea.type02 .conts p{
margin-bottom:0;
float:left;
}
#container .contactArea.type02 .conts a{
float:right;
margin-top:10px;	
}
#container .contactArea.type02 ul{
position:absolute;
top:10px;
right:25px;	
}
#container .contactArea.type02 ul li{
float:left;
margin-left:8px;	
}
@media screen and (max-width: 640px) {
#container .contactArea.type02 .inner{
padding:15px 0 15px;
width:100%;	
}
#container .contactArea.type02 img{
float:none;	
}
#container .contactArea.type02 p{
margin-bottom:10px;	
}
#container .contactArea.type02 p img{
float:left;
width:45%;
max-width:auto;
margin:0 0 10px 15px;
}
#container .contactArea.type02 .conts{
padding:0 12%;
clear:both;
text-align:center;
}
#container .contactArea.type02 p.clear img,
#container .contactArea.type02 .conts p img{
float:none;
width:100%;
margin:0;	
}
#container .contactArea.type02 .conts p{
text-align:center;
width:100%;
margin-bottom:10px;
}
#container .contactArea.type02 p img,
#container .contactArea.type02 a img{
max-width:300px;	
}
#container .contactArea.type02 p.clear img{
max-width:100%;	
}
#container .contactArea.type02 .conts a{
float:none;
}
#container .contactArea.type02 ul{
float:right;
text-align:center;
letter-spacing: -.40em;
position:static;
padding-right:5px;
width:35%;
}
#container .contactArea.type02 ul li{
display:inline-block;
float:none;
letter-spacing: normal;
margin:0;
width:50%;
}
#container .contactArea.type02 ul li img{
margin:0;	
}
}

/*--- #sec01(こんなお悩み・ご希望 ありませんか？) ---*/
#container #sec01{
margin-bottom:0;	
}
#container #sec01 p{
text-align:center;
margin-bottom:40px;	
}
#container #sec01 p:last-child{
margin-bottom:5px;	
}
.onayami_wrap{
	background-image: url(images/onayami_back.png);
	background-position: center;
	padding: 70px 0;
	background-size: cover;
	margin-bottom: 50px;
	background-repeat: no-repeat;
}
@media screen and (max-width: 640px) {
#container #sec01 p{
margin-bottom:10px;	
}
#container #sec01 p:last-child img{
width:65%;	
}
}

/*--- #sec02(選ばれる理由・特徴) ---*/
#container #sec02{
background:#3b2c13;
}
#container #sec02 .inner{
padding:0 40px 40px;
width:920px;	
}
#container #sec02 h2{
padding:15px 0;
background:url(./images/title_border.gif) repeat-x 0 50%;	
}
#container #sec02 h2 span{
background:#3b2c13;
display:inline-block;
padding:0 .5em;
}
#container #sec02 .post{
background:#fff;
padding:0 30px;	
}
#container #sec02 .imgR,
#container #sec02 .imgL{
padding:30px 0;	
}
#container #sec02 .imgR dl,
#container #sec02 .imgL dl{
overflow:hidden;	
}
#container #sec02 .imgR dl dt,
#container #sec02 .imgL dl dt{
color:#3b2c13;
border-bottom:#000 dotted 1px;
font-size:140%;
padding-bottom:5px;
margin-bottom:10px;	
}
#container #sec02 .imgR dl dt span,
#container #sec02 .imgL dl dt span{
display:inline-block;
background:#5d5353;
color:#fff;
width:75px;
text-align:center;
line-height:52px;
font-size:190%;
margin-bottom:5px;
font-family:Arial, Helvetica, sans-serif;	
}
#container #sec02 .imgR dl dd,
#container #sec02 .imgL dl dd{
	
}
#container #sec02 .imgR img{
margin-left:20px;
float:right;	
}
#container #sec02 .imgL img{
margin-right:20px;
float:left;	
}
@media screen and (max-width: 640px) {
#container #sec02 .inner{
padding:0 3% 20px;
width:94%;	
}
#container #sec02 .post{
padding:0 5% 10px;	
}
#container #sec02 .imgR,
#container #sec02 .imgL{
padding:15px 0;	
}
#container #sec02 .imgR img,
#container #sec02 .imgL img{
margin:0 0 10px;
float:none;	
}
#container #sec02 .imgR dl dt,
#container #sec02 .imgL dl dt{
font-size:130%;	
}
#container #sec02 .imgR dl dt span,
#container #sec02 .imgL dl dt span{
width:50px;
line-height:35px;
font-size:140%;
}
}

/*--- #sec03(取扱ブランド) ---*/
#container #sec03 h2{
margin-bottom:25px;	
}
#container #sec03 .inner{
letter-spacing: -.40em;
text-align:center;
}
#container #sec03 li{
display:inline-block;
letter-spacing: normal;
margin:15px 25px;
}
@media screen and (max-width: 640px) {
#container #sec03 li{

margin:5px 10px;
}
#container #sec03 li img{
width:auto;
height:50px;	
}
}

/*--- #sec04(取扱ブランド) ---*/
#container #sec04{
background:url(./images/top_sec04_bg02.jpg) no-repeat 50% 50%;
-moz-background-size:cover;
background-size:cover;
padding:50px 0;	
}
#container #sec04 .inner{
width:920px;
background:rgba(255,255,255,0.7) url(./images/top_sec04_bg01.png) no-repeat 100% 100%;
box-shadow: 2px 2px 5px #3b2c13;
}
#container #sec04 .inner h2{
text-align:left;
padding:5px 20px;	
}
#container #sec04 .inner h3{
color:#3b2c13;
font-size:185%;
padding:30px 0 10px 20px;
line-height:1.6;
}
#container #sec04 .inner p{
padding:0 20px 30px;
line-height:1.7;	
}
@media screen and (max-width: 640px) {
#container #sec04{
padding:20px 5%;
width:90%;	
}
#container #sec04 .inner{
width:100%;
-moz-background-size:45% auto;
background-size:45% auto;
}
#container #sec04 .inner h3{
font-size:130%;
padding:10px 0 10px 20px;
}
}

/*--- #sec05(会社概要) ---*/
#container #sec05{
background:url(./images/bg01.gif) repeat;
margin-bottom:0;
}
#container #sec05 .inner{
padding:30px 130px 70px;
width:740px;	
}
#container #sec05 .map{
background:#cbcccc;	
height:355px;
width:100%;
}
#container #sec05 .list{
color:#3b2c13;
font-size:170%;
margin-bottom:20px;	
}
#container #sec05 .list dl{
border:#5b472a solid 1px;
border-bottom:none;
display:table;
width:100%;	
}
#container #sec05 .list dl:nth-child(odd){
background:#f5f3f5;	
}
#container #sec05 .list dl:nth-child(even){
background:#fff;	
}
#container #sec05 .list dl:last-child{
border-bottom:#5b472a solid 1px;
}
#container #sec05 .list dl dt{
border-right:#5b472a solid 1px;
display:table-cell;
vertical-align:top;
padding:1.5% 3%;
width:35%;
text-align:center;	
}
#container #sec05 .list dl dd{
display:table-cell;
vertical-align:top;
padding:1.5% 3%;	
}
@media screen and (max-width: 640px) {
#container #sec05 .inner{
padding:15px 5% 30px;
width:90%;	
}
#container #sec05 .map{	
height:170px;
}
#container #sec05 .list{
font-size:100%;
margin-bottom:15px;	
}
}

/*--- #sec06(お問い合わせ) ---*/
#container #sec06 .inner{
width:770px;
padding:25px 115px 0;
}

#container #sec06 .btn{
padding:25px 0 0 240px;	
}

/* table */
#container #sec06 table{
border-collapse: separate;
border-spacing:5px;
width:100%;	
}
#container #sec06 table th{
padding:10px;
vertical-align:top;
width:210px;
}
#container #sec06 table th p{
color:#fff;
font-weight:normal;
background:#3b2c13;
font-size:100%;
width:200px;
padding:2% 0;
text-align:center;
box-shadow: 1px 1px 5px #3b2c13;	
}
#container #sec06 table th span{
font-size:80%;
margin-left:.5em;	
}
#container #sec06 table th strong{
font-size:85%;
font-weight:900;	
}
#container #sec06 table td p{
font-size:100%;
margin:0 0 10px;
text-align:left;
font-weight:600;	
}

/* form */
#container #sec06 input,
#container #sec06 textarea,
#container #sec06 select,
#container #sec06 select option{
font-family: 'Noto Sans Japanese', sans-serif;
}
#container #sec06 input[type="text"],
#container #sec06 textarea,
#container #sec06 select{
border:#999 solid 1px;
width:95%;
font-size:110%;
padding:1% 2%;	
}
#container #sec06 select{
width:auto;
margin:10px 0;
padding:0 2%;	
}
#container #sec06 textarea{
height:280px;
margin-top:10px;	
}
#container #sec06 input[type="submit"],
#container #sec06 a{
color:#fff;
background:#3b2c13;
font-size:130%;
width:200px;
padding:.5% 2%;
box-shadow: 1px 1px 5px #3b2c13;
border:none;
cursor:pointer;
-webkit-transition: 0.3s ease-in-out;  
-moz-transition: 0.3s ease-in-out;  
-o-transition: 0.3s ease-in-out;  
transition: 0.3s ease-in-out;
letter-spacing:.5em;	
}
#container #sec06 a{
letter-spacing:normal;	
}
#container #sec06 input[type="submit"]:hover,
#container #sec06 a:hover{
filter:alpha(opacity=80); /*IE*/
-moz-opacity:0.8; /*FF*/
opacity:0.8;
text-decoration:none;	
}

@media screen and (max-width: 640px) {
#container #sec06{
padding:0 0 25px; 	
}
#container #sec06 .inner{
width:90%;
padding:15px 5% 0;
}

#container #sec06 .btn{
padding:0;
text-align:center;	
}

#container #sec06 table{
border-collapse:collapse;
border-spacing:0;
width:100%;
margin:0;
font-size:100%;
overflow:hidden;
}
#container #sec06 table th,
#container #sec06 table td{
display:list-item;
list-style:none;	
}
#container #sec06 table th{
font-size:100%;
padding:0;
font-weight:600;
width:100%;
}
#container #sec06 table th p{
width:98.5%;	
}
#container #sec06 table th strong{
font-size:100%;	
font-weight:600;
}
#container #sec06 table td{
padding:10px 0 20px;
font-weight:normal;		
}
#container #sec06 table td p{
font-size:100%;
}

#container #sec06 input[type="text"],
#container #sec06 textarea{
padding:5px 3%;
width:92.5%;
}
#container #sec06 select{
margin:0 0 10px;	
}
#container #sec06 textarea{
height:100px;	
}
#container #sec06 input[type="submit"],
#container #sec06 a{
width:70%;
min-width:200px;
padding:3px;
font-size:160%;
font-weight:600;
-webkit-appearance: none;
display:inline-block;	
}
#container #sec06 input[type="submit"],
#container #sec06 a{
font-size:120%;
width:150px;
padding:5px 2%;	
}
}

/* 
Footer Layout
------------------------------------------- */
#footer {
clear: both;
width: 100%;
background: #3b2c13;
color:#fff;
padding:50px 0 150px;
}
#footer address{
text-align:center;
display:block;
font-size:70%;
}
@media screen and (max-width: 640px) {
#footer {
padding:20px 0 50px;
}
}