@charset "UTF-8";
/* CSS Document */
.noto700 {font-weight:700;}
body{  -webkit-text-size-adjust: 100%;}
/* --------- --------- --------- --------- ---------
	ローディング
--------- --------- --------- --------- --------- */
#loader-bg {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;left: 0px;
	background: #fff;
	z-index: 9998;
}
#loader {
	display: none;
	position: fixed;
	top: 50%;left: 50%;
	width: 137px;
	height: 137px;
	margin-top: -54px;
	margin-left: -64px;
	text-align: center;
	color: #fff;
	z-index: 9999;
}
#loader img{
	width:137px;
	height:137px;
}
@media screen and (max-width : 550px ){	
#loader {
	width: 68.5px;
	height: 68.5px;
	margin-top:-44px;
	margin-left:-34px;
}
#loader img{
	width:68.5px;
	height:68.5px;
}
}
/* --------- --------- --------- --------- ---------
	ヘッダー
--------- --------- --------- --------- --------- */
#header{
	position:relative;
}
#header_menu_area{
	height:419px;
	width:100%;
	background:url(top_material/index_material/hedaer_backimage.png) no-repeat center;
	position:absolute;
	z-index:1;
}
#header_menu_area_hasei{
	height:378px;
	width:100%;
	background:url(top_material/index_material/hedaer_backimage_hasei.png) no-repeat center;
	position:absolute;
	z-index:1;
}
#h_menu_warp{
	display:block;
	margin:0 auto;
	width:1000px;
	position:relative;
}
.h_logo{
	width:275px;
	padding-top:40px;
	position:relative;
	display:block;margin:0 auto;
}
.h_logo a span{
	widht:273.5px;
	height:100px;
	display:block;
	margin:0 auto;
	background:url(top_material/index_material/header_logo.png) no-repeat center;
	background:url(top_material/index_material/header_logo_ie8.png) no-repeat center\9;
	background-size:273px 100px;
}
@media screen and (max-width : 1000px ){
#h_menu_warp{
	width:100%;
	position:relative;
}
}
@media screen and (max-width : 768px ){	
#header_menu_area{
	height:380px;
	background-image:url(top_material/index_material/header_back_900.png);
	background-size:2721px 380px;
}
#header_menu_area_hasei{
	height:302px;
	background-image:url(top_material/index_material/header_back_900_hasei.png);
	background-size:1997px 302px;
}
.h_logo{
	padding-top:35px;
	position:relative;
}
.h_logo a span{
	widht:234px;
	height:85px;
	background-image:url(top_material/index_material/header_logo_900.png);
	background-size:234px 85px;
}
}
@media screen and (max-width : 550px ){	
#header_menu_area{
	height:160px;
	background-image:url(top_material/index_material/header_back_400.png);
	background-size:1146px 160px;
}
#header_menu_area_hasei{
	height:160px;
	background-image:url(top_material/index_material/header_back_400.png);
	background-size:1146px 160px;
}
.h_logo{
	padding-top:20px;
}
.h_logo a span{
	widht:137px;
	height:50px;
	background-image:url(top_material/index_material/header_logo_500.png);
	background-size:137px 50px;
}
}
.shop_btn{
	position:absolute;
	top:85px;right:72px;
	-webkit-transition: opacity 0.2s ease;
    -moz-transition: opacity 0.2s ease;
    -o-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;	
}
.shop_btn:hover{
	filter: alpha(opacity=80);
	-moz-opacity:0.8;
	opacity:0.8;
}
#sp_btn{
	display:none;	
}
@media screen and (max-width : 1024px ){.shop_btn{top:50px;right:72px;}}
@media screen and (max-width : 768px ){
.shop_btn{
	display:none;
}
#sp_btn{
	width:210px;
	margin:0 auto;
	display:block;
	padding-top:30px;
}
.f_btn,.i_btn,.s_btn{
	width:50px;
	height:50px;
	background-size:50px 50px;	
	float:left;
}
#sp_btn:after{
	display:block;
	clear:both;
	content:"";	
}
.f_btn{
	background-image:url(top_material/index_material/sp_facebook_btn.png);	
	margin-right:30px;
}
.i_btn{
	background-image:url(top_material/index_material/sp_insta_btn.png);	
}
.s_btn{
	background-image:url(top_material/index_material/sp_shop_btn.png);
	margin-left:30px;
}
}
@media screen and (max-width : 550px ){	
#sp_btn{
	width:120px;
	margin:0 auto;
	display:block;
	padding-top:10px;
}
.f_btn,.i_btn,.s_btn{
	width:30px;
	height:30px;
	background-size:30px 30px;	
	float:left;
}
.f_btn{
	background-image:url(top_material/index_material/sp_facebook_btn.png);	
	margin-right:15px;
}
.i_btn{
	background-image:url(top_material/index_material/sp_insta_btn.png);	
}
.s_btn{
	background-image:url(top_material/index_material/sp_shop_btn.png);
	margin-left:15px;
}
}

/* --------- --------- --------- --------- ---------
	メインナビ（PC）
--------- --------- --------- --------- --------- */
#nav{
	width:1000px;
	display:block;
	margin:0 auto;
	padding-top:30px;
} 
@media screen and (max-width : 1000px ){
#nav{
	width:100%;
}
}
@media screen and (max-width : 768px ){
#nav{
	display:none;
}
}
#nav ul{
	width:661px;
	display:block;
	margin:0 auto;
} 
#nav ul:after{
	display:block;
	clear:both;
	content:"";	
}
.nav1{
	width:148px;float:left;
}
.nav1 a span,.nav2 a span,.nav3 a span,.nav4 a span,.nav5 a span,
.nav1 a p,.nav2 a p,.nav3 a p,.nav4 a p,.nav5 a p{
	display:block;
	margin:0 auto;
	background-repeat:no-repeat;-webkit-transition:all 0.2s;
	-moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}
.nav1 a p,.nav2 a p,.nav3 a p,.nav4 a p,.nav5 a p{
	margin-top:17px;
}
.nav1 a span{
	width:60px;height:40px;
	background-size:60px 40px;
	background-image:url(top_material/header_menu/menu_icon1.png);
	background-image:url(top_material/header_menu/menu_icon1_ie8.png)\9;
	-webkit-transition:all 0.4s;
	-moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;	
}
.nav1:hover a span,.nav2:hover a span,.nav3:hover a span,.nav4:hover a span,.nav5:hover a span{
	-webkit-transition:all 0.2s;
	-moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
	margin-top:-10px;
}
.nav1 a p{
	width:100px;height:13px;
	background-size:100px 13px;
	background-image:url(top_material/header_menu/menu_title1.png);
	background-image:url(top_material/header_menu/menu1_ie8.png)\9;
}
.nav2{
	width:133px;float:left;
}
.nav2 a span{
	width:60px;height:40px;
	background-size:60px 40px;
	background-image:url(top_material/header_menu/menu_icon2.png);
	background-image:url(top_material/header_menu/menu_icon2_ie8.png)\9;
}
.nav2 a p{
	width:88px;
	height:13px;
	background-size:88px 13px;
	background-image:url(top_material/header_menu/menu_title2.png);
	background-image:url(top_material/header_menu/menu2_ie8.png)\9;
}
.nav3{
	width:105px;float:left;
}
.nav3 a span{
	width:60px;
	height:40px;
	background-size:60px 40px;
	background-image:url(top_material/header_menu/menu_icon3.png);
	background-image:url(top_material/header_menu/menu_icon3_ie8.png)\9;
}
.nav3 a p{
	width:59px;
	height:13px;
	background-size:59px 13px;
	background-image:url(top_material/header_menu/menu_title3.png);
	background-image:url(top_material/header_menu/menu3_ie8.png)\9;
}
.nav4{
	width:136px;float:left;
}
.nav4 a span{
	width:60px;height:40px;
	background-size:60px 40px;
	background-image:url(top_material/header_menu/menu_icon4_2.png);
	background-image:url(top_material/header_menu/menu_icon4_2_ie8.png)\9;
}
.nav4 a p{
	width:71px;height:13px;
	background-size:71px 13px;
	background-image:url(top_material/header_menu/menu_title4.png);
	background-image:url(top_material/header_menu/menu4_ie8.png)\9;
}
.nav5{
	width:133px;float:left;
}
.nav5 a span{
	width:60px;height:40px;
	background-size:60px 40px;
	background-image:url(top_material/header_menu/menu_icon5.png);
	background-image:url(top_material/header_menu/menu_icon5_ie8.png)\9;
}
.nav5 a p{
	width:88px;height:13px;
	background-size:88px 13px;
	background-image:url(top_material/header_menu/menu_title5.png);
	background-image:url(top_material/header_menu/menu5_ie8.png)\9;
}
#nav ul li a {
    text-decoration: none;color: #fff;
} 
#nav ul li img {
	display:block;margin:0 auto; 
} 
.l_border,.r_border{
	width:3px;height:40px;
	float:left;
	border-sizing:border-box;
	margin-top:19px;
	background-image: linear-gradient(to bottom, #ffdd76, #ffdd76 10px, transparent 0px, transparent 10px);
	background-size: 3px 13px;
	background-position: left;background-repeat: repeat-y;
}
.r_border{float:right;}

/* --------- --------- --------- --------- ---------
	フローティングメニュー（PC）
--------- --------- --------- --------- --------- */
.dropmenu li{
  position:relative;
}
.dropmenu2{
  width:200px!important;
  list-style: none;
  position: absolute;
  z-index: 9999;
  left: 0;
  padding-top:20px;
}
.dropmenu2 a{
  display: block;
  background: #fff;
  color: #387F25!important;
  font-size: 14px;
  line-height: 1;
  text-decoration: none;
   padding: 12px 12px;
  box-sizing:border-box;
  text-align: left;
  border-radius:3px;
  -webkit-transition: opacity 0.2s ease;
  -moz-transition: opacity 0.2s ease;
  -o-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
}
.dropmenu2 li{
  width:100%;
  transition: 5s;
}
.dropmenu2{
display:block;
}
.dropmenu2 a:hover{
display:block;
filter: alpha(opacity=80);
-moz-opacity:0.8;
opacity:0.8;
}
.dropmenu li ul li{
  overflow: hidden;
  height: 0;
  transition:0.5s;
}
.dropmenu li:hover ul li{
  overflow: visible!important;
  height: 63px!important;
}
/* --------- --------- --------- --------- ---------
	ティッカー
--------- --------- --------- --------- --------- */
#ticker{
	width:500px;
	position:relative;
	display:block;
	margin:0 auto;
}
#ticker_sp{
	display:none;	
}
.ticker_title{
	width:117px;
	height:30px;
	position:absolute;
	left:0px;
	z-index:1;
	background-image:url(top_material/index_material/ticker_title.png);
	background-image:url(top_material/index_material/ticker_title_ie8.png)\9;
	background-repeat:no-repeat;
	background-size:117px 30px;
}
.tickercontainer {
width: 500px; 
height: 30px;
background:#ebf2e9; 
padding: 0;
margin-top:38px;
border-radius:15px;
overflow: hidden; 
}
@media screen and (max-width : 768px ){
.tickercontainer {margin-top:35px;}
}
@media screen and (max-width : 550px ){
#ticker{
display:none;
}
#ticker_sp{
display:block;
width:100%;
position:relative;
top:131px;
margin:0 auto;
}
#ticker_sp .tickercontainer {
width:100%;
height: 30px;
background:#fff;
padding:0;
margin-top:0px;
border-radius:0px;
overflow:hidden;
}
#ticker_sp .ticker_title_sp{
width:25%;height:30px;
position:absolute;
z-index:1;
background:url(top_material/index_material/ticker_sp_title_back.png) no-repeat;
}
ul.newsticker { /* that's your list */
position: relative;
left:0px;
top:0px;
margin: 0;
padding: 0;

}
#ticker_sp .ticker_title_sp img{
width:80%;
display:block;
position:absolute;
top: 0;right: 0;bottom: 0;left: 0;margin: auto;
}
}
.tickercontainer .mask {
position: relative;
left:10px;top:0px;
overflow: hidden;
}
ul.newsticker li {
float: left;
padding: 0;white-space:nowrap;
}
ul.newsticker li p{
font-size:12px;
color:#736e6e;
padding-top:9px;
padding-bottom:9px;
}
ul.newsticker li p:hover{
	cursor:default;
}
ul.newsticker { /* that's your list */
position: relative;
left: 600px;
margin: 0;
padding: 0;
}
ul.newsticker a {
color:#30723D;
white-space: nowrap;
-webkit-transition: opacity 0.4s ease;
-moz-transition: opacity 0.4s ease;
-o-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
} 
ul.newsticker a {
filter: alpha(opacity=80);
-moz-opacity:0.8;
opacity:0.8;	
}
@media screen and (max-width : 650px ){
    #ticker_sp .tickercontainer .mask {
    position: relative;
    left: 10px;top: 0px;
    overflow: hidden;
    }
    #ticker_sp ul.newsticker li p{
    font-size:12px !Important;
    color:#303030;
    padding-top:9px;
    padding-bottom:0px;
    }
    #ticker_sp ul.newsticker li,
    #ticker_sp ul.newsticker li p.noto{
    font-size:12px !Important;
        
    }
}

/* --------- --------- --------- --------- ---------
	スライダー
--------- --------- --------- --------- --------- */
#pc_slider{
	position:relative;
	top:347px;
	z-index:-1;
}
#sp_slider{
	display:none;
	position:relative;
	z-index:0;
}
.sp-image:hover{
	cursor:default;	
}
.s_b_l{
	width:100%;
	height:81px;
	background:url(top_material/index_material/header_bottom_line.png);
	background-repeat:no-repeat;
	background-position:center;
	position:absolute;
	bottom:-388px;
	z-index:5;
}
@media screen and (max-width : 768px ){
#pc_slider{display:none;}
#sp_slider{
	display:block;
	top:308px;
	z-index:0;
}
.s_b_l{bottom:-379px;z-index:999;}
}
@media screen and (max-width : 550px ){
#sp_slider{top:131px;}
.s_b_l{display:none;}
}
/* --------- --------- --------- --------- ---------
	右側の直接販売のボタン
--------- --------- --------- --------- --------- */
#l-img{
	position:fixed;
	top:100px;right:0px;
	z-index:100;
	-webkit-transition: opacity 0.4s ease;
    -moz-transition: opacity 0.4s ease;
    -o-transition: opacity 0.4s ease;
    transition: opacity 0.4s ease;
}
#l-img:hover{
filter: alpha(opacity=80);
-moz-opacity:0.8;
opacity:0.8;
}
#l-img img{
	width:164px;height:160px;
}
@media screen and (max-width : 768px ){#l-img{display:none;}}
/* --------- --------- --------- --------- ---------
	ページトップ
--------- --------- --------- --------- --------- */
#page-top {
    position:fixed;
	bottom:20px;right:20px;font-size: 80%;
}
#page-top a {cursor:pointer;}
#move-page-top:hover{
	filter: alpha(opacity=80);
	-moz-opacity:0.6;opacity:0.6;		
}