@charset "utf-8";

#other_box {
	width: 1260px;
	margin: 0 auto;
	padding: 5% 0;
	clear:both;
}

@media screen and (max-width: 1280px) {
#other_box {
	width: 1000px;
}
}

@media screen and (max-width: 800px) {
#other_box {
	width: 100%;
}
}

#other_box h2{
  font-family: 'Lora', serif;
  font-weight: 200;
  text-align: center;
  color: #4f4d47;
  font-size:2em;
  margin-bottom:2%;
}

@media screen and (max-width: 568px) {
#other_box h2{
  font-size:1.8em;
}
}

#other_box2 {
	width: 95%;
	margin: 0 auto;
	padding: 5% 0;
	clear:both;
}

@media screen and (max-width: 1280px) {
#other_box2 {
	width: 100%;
}
}


#other_box2 h2{
  font-family: 'Source Sans Pro', sans-serif!important;
  font-weight: 200;
  text-align: center;
  color: #4f4d47;
  font-size:2em;
  margin-bottom:2%;
}

@media screen and (max-width: 568px) {
#other_box2 h2{
  font-size:1.8em;
}
}

.ttl_text {
	font-size:0.9em;
	text-align: center;
	margin:0 auto;
	padding: 0 0 5%;
	font-weight:200;
}

.sys_but{
	margin:5%;
	font-size:0.9em;
	text-align: center;
	margin:0 auto;
	padding: 0 0 5%;
	font-weight:200;
	}

.sys_but a{color:#FFF;text-decoration: none;padding:6px 10px 6px 10px;background-color:#000;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;}
.sys_but a:hover{color:#FFF;text-decoration:none;background-color:#AAA;}

.w30{
	width:33.3%;
	box-sizing: border-box;
	padding: 0 3% 0 3%;
	float: left;
	margin:0 0 5%;
}

@media screen and (max-width: 800px) {
.w30{
	width:50%;
	padding: 0 2% 0 2%;
}
}

@media screen and (max-width: 568px) {
.w30{
	width:96%;
	padding: 0 0 0 3%;
}
}

/* item_box
--------------------------------------- */
.item_box{
	width: 100%;
	font-size:1em!important;
}
.item{
	width: 100%;
}

.item_box a div.item {color: #4f4d47;background-color:#FFF;}
.item_box a:hover div.item  { opacity: 0.7; }
.item_box a {text-decoration:none!important;}

.item_box img{
	width: 100%;
	height:auto;
}

.item_box h3{
font-size:1.6em;
font-weight:550;
padding:0;
margin-bottom:0;
text-align: center;
font-family: 'Source Sans Pro', sans-serif!important;
}

.item_box p{
font-size:0.9em;
padding:0 0 0 0;
margin-bottom:0px;
text-align: center;
}

@media screen and (max-width: 568px) {
.item_box p{
font-size:0.8em;
}
}

.item_box a div.item {color:#333;padding:0 1.8%;background-color:#FFF;}
.item_box a {text-decoration:none!important;}


/* item_thum
--------------------------------------- */
.item_thum{
	width: 80%;
	margin:0 10% 5%;
	float:left;
}

@media screen and (max-width: 1280px) {
.item_thum{
	width: 96%;
	margin:0 2% 2%;
}
}

.item_thum li{
	width: 25%;
	box-sizing: border-box;
	padding:0 1%;
	float:left;
}

.item_thum li img{
	width: 100%;
	height:auto;
}

.item_thum li a:hover { opacity: 0.7; }

/* item_thum2
--------------------------------------- */
.item_thum2{
	width: 60%;
	margin:0 auto 5%;
}

@media screen and (max-width: 1280px) {
.item_thum2{
	width: 96%;
	margin:0 2% 2%;
}
}
.item_thum2 li{
	width: 33%;
	box-sizing: border-box;
	padding:0 1%;
	float:left;
}

.item_thum2 li img{
	width: 100%;
	height:auto;
}

.item_thum2 li a:hover { opacity: 0.7; }

/* item_info
--------------------------------------- */
.item_info {
	box-sizing: border-box;
	width: 100%;
	float: left;
	padding: 0 1.5% 0 1.5%;
	margin-bottom:5%;
}

.item_info h3{
	width: 96%;
	padding-top:2%;
	padding-bottom:2%;
	margin-left:auto;
	margin-right:auto;
	text-align: center;
	clear:both;
}

.item_info p{
	width: 96%;
	margin-left:auto;
	margin-right:auto;
	line-height:1.8;
	text-align: center;
}

.item_info .price{
	font-size:120%;
	margin-bottom:5%!important;
}

@media screen and (max-width: 1280px) {
.item_info h3{
	width: 98%;
	padding-top:10%;
}

.item_info p{
	width: 98%;
}
}

@media screen and (max-width: 800px) {
.item_info h3{
	padding-top:4%;
	padding-bottom:1%;
	font-size:1.1em;
	text-align: left;
}

.item_info p{
	line-height:1.6;
	font-size:0.9em;
	text-align: left;
}
}

@media screen and (max-width: 568px) {
.item_info h3{
font-size:1em;
width: 90%;
}

.item_info p{
	font-size:0.8em;
	width: 90%;
}
.item_info .price{
	font-size:130%;
}
}

/* item_info
--------------------------------------- */
.item_info2 {
	box-sizing: border-box;
	width: 100%;
	float: left;
	padding: 0 1.5% 0 1.5%;
	margin-bottom:5%;
}

.item_info2 h3{
	width: 96%;
	padding-top:3%;
	padding-bottom:3%;
	margin-left:auto;
	margin-right:auto;
}

.item_info2 p{
	width: 96%;
	margin-left:auto;
	margin-right:auto;
	line-height:1.8;
}

@media screen and (max-width: 1280px) {
.item_info2 h3{
	width: 98%;
}

.item_info2 p{
	width: 98%;
}
}

@media screen and (max-width: 800px) {
.item_info2 h3{
	padding-top:4%;
	padding-bottom:1%;
	font-size:1.1em;
}

.item_info2 p{
	line-height:1.6;
	font-size:0.9em;
}
}

@media screen and (max-width: 568px) {
.item_info2 h3{
font-size:1em;
width: 96%;
}

.item_info2 p{
	font-size:0.8em;
	width: 96%;
}
}

/* thumb
--------------------------------------- */
.thumb { margin: 20px 2.5% 50px 2.5%;position: relative;width:45%;float:left;z-index: 0;}
.thumb img {
	display: block;
	width: 95%;
	height: auto;
	margin-bottom:3%;
	float:left;
}

@media screen and (max-width: 800px) {
.thumb { width:100%;margin: 0 0 5% 0;}
}

.thumb2 { margin: 20px auto 0;position: relative;width:45%;z-index: 0;}
.thumb2 img {
	display: block;
	width: 95%;
	height: auto;
	margin-bottom:3%;
	float:left;
}

@media screen and (max-width: 800px) {
.thumb2 { width:100%;margin: 0 0 5% 0;}
}

.main-photo{
	width: 93%;
	height: auto;
	margin-bottom:0;
	float:left;
	z-index:0;
}

.main-photo img {
	display: block;
	width: 100%;
	height: auto;
}

.main-photo p {
	font-size:0.7em;
	text-align: center;
}

.thumb ul {
	margin: 2% 0 0!important;
	width:4%;
	float:right;
	position: relative;
}

.thumb2 ul {
	margin: 0 !important;
	width:4%;
	float:right;
	position: relative;
}

@media screen and (max-width: 800px) {
.main-photo{
	width: 100%;
	height: auto;
	margin-bottom:3%;
	float:none;
}

.thumb ul {
	margin: 0 auto;
	width:100%;
	position: relative;
}
.thumb2 ul {
	margin: 0 auto;
	width:100%;
	position: relative;
}
}

.thumb li {
	margin:0 3% 3px 3%!important;
	width:94%;
	height:auto;
	font-size:0.6em;
	text-align: center!important;
	line-height:1.2;
}

.thumb li img{
	width:96%;
	height:auto;
	padding:2px;
	margin:0 auto 3px!important;
}

.thumb2 li {
	margin:0 3% 3px 3%!important;
	width:94%;
	height:auto;
	font-size:0.6em;
	text-align: center!important;
	line-height:1.2;
}

.thumb2 li img{
	width:96%;
	height:auto;
	padding:2px;
	margin:0 auto 3px!important;
}

@media screen and (max-width: 800px) {
.thumb li {
	float:left;
	margin:0 10px 5% 0;
	width:28px;
	height:60px;
}

.thumb li img{
	width:24px;
	height:auto;
	padding:2px;
}
.thumb2 li {
	float:left;
	margin:0 10px 5% 0;
	width:28px;
	height:60px;
}

.thumb2 li img{
	width:24px;
	height:auto;
	padding:2px;
}
}


.thumb li a img {
	border:1px solid #eee;
	}
	
.thumb li a:hover img {
	border: 1px solid #ccc;
	}

.thumb2 li a img {
	border:1px solid #eee;
	}
	
.thumb2 li a:hover img {
	border: 1px solid #ccc;
	}
		
.retn{
	margin-top:0;
	font-size:0.8em;
	text-align: center;
	letter-spacing	: 0.05em;
}

.retn a{color:#FFF;text-decoration:none;padding:5px 10px 5px 10px;background-color:#A0A0A0;-webkit-border-radius:7px;-moz-border-radius:7px;border-radius:7px;}
.retn a:hover{color:#6E6E6E;text-decoration:none;background-color: #eeeff7;}

/* concept
--------------------------------------- */
#c_bg {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 0;
	min-height:800px;
	position:relative;
	background-repeat:no-repeat;
	-moz-background-size:100% auto;
	background-size:100% auto; 
	background-position:center top;
	}

.concept_box{
	width: 35%;
	height:727px;
	margin-left: -250px;
	padding: 6% 3% 0;
	background: #666;
	background: rgba(0, 0, 0, 0.6);
	position: absolute;
	top: 0;
	left: 50%;
	}

@media screen and (max-width: 1280px) {
.concept_box{
	width: 46%;
	height:606px;
	margin-left: -240px;
	padding: 6% 2.5% 0;
	}
}
	
.nakata_box{
	width: 95%;
	max-width:1000px;
	margin: 0 auto;
	padding: 0 2% 0 3%;
	background: none;
	position:relative;
	}
	
#c_photo {
	display:none;
	}
	
@media screen and (max-width: 800px) {
#c_bg {
	display:none!important;
	}

#c_photo {
	display:block;
	}
	
.concept_box{
	width: 95%;
	height:auto;
	margin: 0 auto;
	padding: 3% 2% 2% 3%;
	background: none;
	position:relative;
	left: 0%;
	}
}

.concept_box h2{
	color:#FFF!important;
	}

.ttl_cs01 {
	font-size:1em;
	text-align: center;
	margin:0 auto;
	padding: 1% 0 3%;
	color:#FFF;
	font-weight:300;
}

.ttl_cs02 {
	font-size:0.8em;
	color:#FFF;
	font-weight:200;
	line-height:1.8;
}

.ttl_nk01 {
	font-size:1em;
	text-align: center;
	margin:0 auto;
	padding: 1% 0 3%;
	font-weight:300;
}

.ttl_nk02 {
	font-size:0.9em;
	font-weight:200;
	line-height:1.8;
	padding: 0 0 0.5%;
}

@media screen and (max-width: 800px) {
.concept_box h2{
	color: #4f4d47!important;
	}
	
	
	.ttl_cs01 {
	font-size:1em;
	color: #4f4d47;
}

.ttl_cs02 {
	font-size:0.8em;
	color: #4f4d47;
}

	.ttl_nk01 {
	font-size:1em;
}

.ttl_nk02 {
	font-size:0.8em;
}
}

@media screen and (max-width: 568px) {
.concept_box h2{
	font-size:1.5em!important;
	}
	}

/* blog
--------------------------------------- */
.blog_entry{
	width: 95%;
	max-width:1000px;
	margin: 0 auto;
	padding: 0 2.5% 0 2.5%;
	}

@media screen and (max-width: 568px) {
.blog_entry{
	width: 97%;
	padding: 0 1.5% 0 1.5%;
	}
	}
	
.blog_entry h3{
	width: 95%;
	margin: 0 auto;
	padding: 1% 2% 0.5% 3%;
	border-top:1px solid #CCC;
	border-bottom:1px solid #CCC;
	}

.blog_entry h3 a {
	text-decoration: none;
}
.blog_entry h3 a:hover {
	text-decoration: none;
}

@media screen and (max-width: 568px) {
.blog_entry h3{
	font-size:14px;
	}
	}
	
.blog_entry .entry_box{
    font-size:0.8em;
	width:94%;
	margin:0;
	line-height:1.7;
	padding:2% 3% 3%;
	}

@media screen and (max-width: 568px) {
.blog_entry .entry_box{
	line-height:1.6;
	padding:2%;
	}
	}
	
.blog_entry .entry_box img{
    max-width:750px;
	height:auto;
	margin:10px 0;
	}

@media only screen and  (max-width: 800px) {
.blog_entry .entry_box img{
    max-width:750px;
	width:100%;
	height:auto;
	margin:5px 0;
	}
}
	
.entry_fotter{
	width:96%;
	margin:0 auto 5%;
	text-align: right;
	padding:1% 2% 5px;
	border-top:1px dotted #CCC;
	font-size:0.8em;
	}

/* .pageNav ページ送り
================================================== */
.pageNav {
	margin: 10px 0 10px;
	padding: 10px 10px 5px;
	text-align: center;
}

.pageNav li {
	display: inline;
	font-size   : 0.8em;
	margin: 5px 2px 5px;
	padding: 0;
	-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;
}

.pageNav li a {
	display: inline-block;
	margin-bottom: 5px;
	padding: 5px 13px;
	background: #eeeff7;
	text-decoration: none;
	vertical-align: middle;
	-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;
}

.pageNav li a:hover {
	color: #FFF;
	background: #AAAAAA;
	-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;
}

.blog_list {
	font-size   : 0.8em;
	text-align	: center;
	padding : 10px 10px 10px 10px;
	}

.blog_list a{
	color		: #0C77D4;
	text-decoration	: underline;
	}

.blog_list a:hover{
	color		: #0C77D4;
	text-decoration	: none;
	}
	
/* rslides
--------------------------------------- */
.rslides {
  margin: 0 auto 0;
  }


.rslides_tabs {
  list-style: none;
  padding: 0;
  background: rgba(0,0,0,.25);
  box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
  -moz-box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
  -webkit-box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
  font-size: 18px;
  list-style: none;
  margin: 0 auto 50px;
  max-width: 540px;
  padding: 0 0;
  text-align: center;
  width: 100%;
  }

.rslides_tabs li {
  display: inline;
  float: none;
  margin-right: 1px;
  }

.rslides_tabs a {
  width: auto;
  line-height: 20px;
  padding: 9px 20px;
  height: auto;
  background: transparent;
  display: inline;
  }

.rslides_tabs li:first-child {
  margin-left: 0;
  }

.rslides_tabs .rslides_here a {
  background: rgba(255,255,255,.1);
  color: #fff;
  font-weight: bold;
  }
  
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides li {
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  margin-bottom:0;
  }
  
/* contact
--------------------------------------- */
.contact_box{
	width: 100%;
	margin: 0 auto;
	}

.contact_box p{
font-size:0.8em;
text-align: center;
}

.contact_box table{
	width		: 99%;
	border	: 1px solid #cccccc;
	margin : 0 auto 10px;
	}
	
.contact_box th,
.contact_box td{
	border-right	: 1px solid #cccccc;
	border-bottom	: 1px dotted #C0C0C0;
	font-size:0.9em;
	line-height:1.8;
	}
	
.contact_box th{
	background	: #F2F2F2;
	width:20%;
	padding		: 10px;
	text-align: center;
	font-weight:550;
	}

.contact_box td{
	padding		: 10px 10px 10px 20px;
	}

.contact_box input{
	padding		: 5px;
	}

.contact_box select{
	padding		: 5px 0 5px 0;
	letter-spacing:0.1em;
	}
		
.contact_box .btn_send{
	text-align	: center;
	}
	
.contact_box .btn_send input{
	padding		: 10px;
	}

@media screen and (max-width: 568px) {
.contact_box th,
.contact_box td{
	font-size:0.7em;
	line-height:1.6;
	}

.contact_box th{
	width:30%;
	padding		: 5px;
	}
	
	.contact_box p{
text-align: left;
padding-left:2%;
padding-right:2%;
}
}

/* contact
--------------------------------------- */
.shop_list {
	width: 1000px;
	margin: 0 auto;
	padding: 0 0 5%;
}

@media screen and (max-width: 800px) {
.shop_list {
	width: 94%;
}
}

.shop_list:after {
	content: "";
	clear: both;
	display: block;
}

.shop_list h3{
  font-weight: 400;
  color: #333;
  font-size:1.2em;
  margin-bottom:0;
  width:96%;
  border-bottom:0.5px solid #898989;
  padding:8px 2% 5px;
  letter-spacing:0.4em;
}

@media screen and (max-width: 568px) {
.shop_list h3{
  font-size:1em;
}
}


.shop_list li{
  width:96%;
  font-size:0.9em;
  margin:0;
  border-bottom:0.5px dotted #ccc;
  padding:0 2% 1%;
  float:left;
}

.shop_list .name{
  float:left;
  font-weight:600!important;
  width:25%;
}

.shop_list .add{
  float:left;
  padding-left:5%;
  width:40%;
}

.shop_list .phone{
  float:left;
  padding-left:5%;
}

@media screen and (max-width: 800px) {
.shop_list p{
  line-height:1.6;
}

.shop_list .name{
  width:96%;
  padding:0 2% 1%;
}
.shop_list .add{
  padding:0 2% 1%;
  width:auto;
}
.shop_list .phone{
  padding:0 2% 1%;
  width:auto;
}

}

/* brand_info
--------------------------------------- */
.brand_info {
	box-sizing: border-box;
	width: 100%;
	float: left;
	padding: 0 1.5% 0 1.5%;
	margin-bottom:5%;
}

.brand_info h3 {
	font-size:1.4em;
	text-align: center;
	margin:0 auto;
	padding: 1% 0 3%;
	font-weight:300;
}

@media screen and (max-width: 800px) {
.brand_info h3{
	font-size:1.1em;
	color: #4f4d47;
}
}

.brd_comment{
	width: 62%;
	margin-left:2%;
	float:left;
}

@media screen and (max-width: 568px) {
.brand_info h3 {
	padding: 1% 0 1%;
}

.brd_comment{
	width: 98%;
	margin-left:1%;
	float:none;
}
}

.brd_comment p{
	line-height:1.8;
	font-size:15px;
}


.brd_photo{
	width: 30%;
	margin-right:1%;
	float:right;
}

@media screen and (max-width: 1280px) {
.brd_photo{
	margin-top:2.5%;
}
}

@media screen and (max-width: 568px) {
.brd_photo{
	width: 70%;
	float:none;
	margin:2% auto 0;
}
}

.brd_photo img{
	width: 100%;
	height:auto;
}

.brand_info .br_ttl{
	font-size:120%;
	margin-bottom:4%!important;
	
}

@media screen and (max-width: 568px) {
.brand_info .br_ttl{
	text-align: center;
	font-size:16px;
}
.brd_comment p{
	line-height:1.6;
	font-size:13px;
	margin-bottom:5px!important;
}
}

/* brand_thum
--------------------------------------- */
.brand_thum{
	width: 96%;
	margin:0 2% 5%;
	float:left;
}

@media screen and (max-width: 800px) {
.brand_thum{
	margin:0 2% 2%;
}
}

@media screen and (max-width: 568px) {
.brand_thum{
	width: 100%;
	margin:1% 0;
}
}

.brand_thum ul{
	margin-top:2%;
	float:left;
}

.brand_thum li{
	width: 50%;
	box-sizing: border-box;
	padding:0.5% 1%;
	float:left;
}

@media screen and (max-width: 568px) {
.brand_thum li{
	width: 100%;
	padding:2%;
}
}

.brand_thum li img{
	width: 100%;
	height:auto;
}

.brand_thum li a:hover { opacity: 0.7; }