@charset "utf-8";

/***************************************************
PC用および共通設定 974px～
***************************************************/
#container {
  position: relative;
}

main {
  position: relative;
}


.hannari { font-family: "Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif; }
.f105{font-size:105%;}

.main_image{
	background:url("../images/main_pc.jpg") center top;
	background-size:cover;
	height:420px;
}


.wrp_white{
	width:100%;
	background:#FFF;
}


.left_cnt{
	float:left;
	margin:0 20px 0 0;
	width:150px;
}
.right_cnt{
	float:left;
	width:490px;
}

#fixed_menu {
  width: 100%;
  z-index: 100000;
}

/*メニュー*/
.bg_menu{
	background:#FFF;
	padding:0;
	margin:0;
	z-index: 10000;
	position:relative;
	width:100%;
	text-align:center;
	height:65px;
	box-shadow: 3px 3px 2px 1px rgb(0 0 0 / 20%);
}

#menu{
	width:950px;
	margin:0 auto 0;
	height:60px;

}
#menu img{
	vertical-align:middle;
}
#menu ul{
	display:flex;
	justify-content: space-between;
	padding:5px 0;
}

#menu ul li{
	width:20%;
	border-left:1px solid #4f0002;
	text-align:center;
}
#menu ul li:last-child{
	border-right:1px solid #4f0002;
	margin-right:0;
}
#menu ul li a{
	display:block;
}

.fixed {
    position: fixed;
    top: 0;
    width: 100%;
}


/*wrp_gb01*/
#wrp_bg01{
	background:url("../images/back01.jpg")  center top no-repeat #8eeee3;
	width:100%;
	padding:30px 0;
}
#wrp_bg01 p.text{
	text-align:center;
	color:#000;
	margin:3% auto;
	font-size:110%;
}
#box02{
	width:800px;
	margin:auto;
	padding-top:30px;

}
#box01{
	margin:auto;
	padding-top:30px;

}

h2{
	text-align:center;
}
	
.box0201{
	background:#fff8e8;
	margin-bottom:5%;
	padding:3%;
}
.box0201l{
	float:left;
	width:48%;
	margin-right:4%;
}
.box0201r{
	float:right;
	width:48%;
	
}



/*wrp_bg03*/
#wrp_bg03{
	padding:30px 0;
	background:url("../images/back02.jpg") repeat-x center 100%;
}

#box03{
	width:800px;
	margin:auto;
}

.wrp_cnt_box03{
	display:flex;
}
.cnt_box03{
	background:#fff;
	width:44%;
	margin:0 3%;
	padding:5%;
	border:1px solid #844d2a;
	border-radius:25px;
	  box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.1);
}
.cnt_box03 img{
	width:100%;
}
.cnt_box03 .title{
	width:80%;
	margin:5% auto;
}
.cnt_box03 .line{
	background:linear-gradient(transparent 60%, #c2ff00 60%);
}
#box2 ol li  {
  list-style: none;
  padding-left: 1.3em;
  text-indent: -1.3em;
}
.cnt_box03 .box{
	padding:1%;
	width:100%;
	border:1px solid #ff541d;
	color:#ff541d;
	text-align:center;
	margin-top:5%;
}

	
/*wrp_bg04　商品情報*/

#wrp_bg04{
	padding:30px 0;
	background:#FFF;
}

#box04{
	width:800px;
	margin:auto;
}
.wrp_cnt_box04{
	display:flex;
}
.cnt_box04{
	background:#efffdf;
	width:44%;
	margin:0 3%;
	padding:5%;
	  box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.1);
}
.cnt_box04 img{
	width:100%;
	border:1px solid #ccc;
}
.cnt_box04 .btn_detail{

	text-align:center;
}
.cnt_box04 .btn_detail a{
	color:#FFF;
	display:block;
	width:100%;
	background:#e15555;
	  box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.1);
	padding:5% 0;
}
.cnt_box04 .btn_detail a:hover{
	text-decoration:none;
}

/*wrp_bg05 おすすめバナー*/

#wrp_bg05{
	background:#dadada;
	padding:3% 0 0 0;
}

#box_recommend{
	width:974px;
	margin:auto;
}
.tl_recommend{
	width:100%;
	text-align:center;
	margin:0 auto 3%;
	font-size:200%;

}

ul.recommend_banner{
	width:96%;
	margin:0 auto;
}

ul.recommend_banner li{
	width:32%;
	margin:0 2% 2% 0;
	float:left;
	text-align:left;
}
ul.recommend_banner li img{
	width:100%;
	margin-bottom:2%;
}
ul.recommend_banner li:nth-child(3n){
	margin-right:0;
}

.fixed_menu_filler {
  position: relative;
  margin: 0;
  padding: 0;
  height: 0;
}

/***************************************************
タブレット用 768px～973px
***************************************************/

@media only screen and (max-width: 973px){

/*menu*/

.fixed_menu{
	height:100%;
}
.bg_menu{
	height:100%;
}
#menu{
	width:100%;
	height:100%;
}
#menu ul li {
	text-align:center;
}
#menu ul li img{
	width:80%;
	margin:auto;

}

/*おすすめバナー*/

#box_recommend{
	width:98%;
	margin:0 auto 3%;
}



}
/***************************************************
スマートフォン用 ～767px
***************************************************/
@media only screen and (max-width: 767px){

.br-pc{display:none;}
.mt3_sp{margin-top:3%;}
.sp_center{text-align:center;}


/*KV*/
.main_image{
	height:100%;
}


/*menu*/

.fixed_menu{
	height:100%;
}
.bg_menu{
	height:100%;
}
#menu{
	width:100%;
	height:100%;
}
#menu ul li {
	text-align:center;
}
#menu ul li img{
	width:80%;
	margin:auto;

}


/*wrp_bg01*/


#box02{
	width:94%;
	margin:auto;
}
#box01{
	width:94%;
	margin:auto;

}

h2 img{
	width:80%;
	margin:auto;
}
	
.box0201{
	background:#fff8e8;
	margin-bottom:5%;
	padding:3%;
}
.box0201 .menu02_txt{
	text-align:left;
}

.box0201l{
	float:none;
	width:100%;
	margin:0 auto 5%;
	text-align:center;

}
.box0201l img,.box0201r img{
	width:60%;
	margin:auto;}

.box0201r{
	text-align:center;
	float:none;
	width:100%;
	
}



/*wrp_bg03*/

#wrp_bg03{
	padding:30px 0;
	background:url("../images/back02_sp.jpg") repeat-x center 100%;
}

#box03{
	width:86%;
	margin:auto;
}

.wrp_cnt_box03{
	display:block;
}
.cnt_box03{
	background:#fff;
	width:100%;
	margin:10% auto;
	padding:8% 5%;
}

/*wrp_bg04　商品情報*/

#wrp_bg04{
	padding:30px 0;
	background:#FFF;
}

#box04{
	width:86%;
	margin:auto;
}
.wrp_cnt_box04{
	display:block;
}
.cnt_box04{
	background:#efffdf;
	width:100%;
	margin:10% auto;
	padding:5%;
}

.img_glass img{
	width:55%;
	margin:auto;
}








/*おすすめバナー*/
.tl_recommend{
	width:100%;

}
ul.recommend_banner li{
	width:49%;
	margin:0 2% 2% 0;
	float:left;
	text-align:left;
}
ul.recommend_banner li img{
	width:100%;
	margin-bottom:2%;
}
ul.recommend_banner li:nth-child(2n){
	margin-right:0;
}


}