@charset "utf-8";
/* CSS Document */

/* -------------------------------------------------------------------
 Loading
-------------------------------------------------------------------- */
#loader {
	width: 60px;
	height: 60px;
	position: fixed;
	_position: absolute; /* IE6対策 */
	top: 50%;
	left: 50%;
	margin-top: -30px; /* heightの半分のマイナス値 */
	margin-left: -30px; /* widthの半分のマイナス値 */
	z-index: 302;
	display: none;
}

#fade {
	width: 100%;
	height: 100%;
	background-color: #717071;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 301;
	display: none;
}

/* -------------------------------------------------------------------
 bx-slider
-------------------------------------------------------------------- */
#sliderWrap .bx-wrapper .bx-viewport {
	background: none;
	border: none;
	box-shadow: none;
	left: 0;
}
#sliderWrap .bx-wrapper .bx-controls-direction a {
	width: 102px;
    height: 102px;
	margin: 0;
    position: absolute;
    text-indent: -9999px;
    z-index: 9999;
}
#sliderWrap .bx-wrapper .bx-prev {
/*	background: url(../img/btn_slider_prev.png) no-repeat left top;*/
	left: -150px;
}
#sliderWrap .bx-wrapper .bx-prev:hover {
	background-position: left -102px;
}
#sliderWrap .bx-wrapper .bx-next {
/*	background: url(../img/btn_slider_next.png) no-repeat left top;*/
	right: -150px;
}
#sliderWrap .bx-wrapper .bx-next:hover {
	background-position: left -102px;
}

/* 背景画像はブラウザにFit */
#section1,
#section2,
#section3,
#section4,
#section5,
#section6,
#section7 {
	background-size: cover;
}
#section1 {
	background-image: url(/img/top_bg.jpg);
}
#section2 {
	background-image: url(/img/s02_bg.jpg);
}
#section3 {
	background-image: url(/img/s03_bg.jpg);
}
#section4 {
	background-image: url(/img/s04_bg.jpg);
}
#section5 {
	background-image: url(/img/s05_bg.jpg);
}
#section6 {
	background-image: url(/img/s06_bg.jpg);
}
#section7 {
	background-image: url(/img/s07_bg.jpg);
}

.section{
	text-align:center;
}
.sectionInner {
	width: 1000px;
	height: 500px;
	position: absolute;
	left: 50%;
	margin-left: -500px;
	top: 50%;
	margin-top: -250px;
}
.nextBtn a:hover {
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}

/* -------------------------------------------------------------------
 TOP
-------------------------------------------------------------------- */
/* 発売予定 */
#yotei {
	width: 140px;
	height: 140px;
	position: absolute;
	right: 202px;
	top: 0;
	z-index: 1;
}
#s01L {
	width: 575px;
	margin: 100px 0 0 35px;
	float: left;
}
#s01R {
	width: 138px;
	float: right;
	text-align: right;
	position: relative;
}
#s01Item {
	width: 138px;
	/*width: 250px; 予約受付中の場合*/
	height: 465px;
	/*position: absolute; 予約受付中の場合
	left: 657px;
	top: 0;
	z-index: 2;*/
	position: absolute;
	right: 36px;
	top: 0;
	z-index: 2;
}
#s01ItemTxt {
	position: absolute;
	z-index: 1;
	right: 102px;
	top: 87px;
}
#s01_nextBtn {
	width: 225px;
	height: 41px;
	position: absolute;
	padding: 0;
	left: 50%;
	margin-left: -112px;
	bottom: -20px;
}

/* -------------------------------------------------------------------
 Section02
-------------------------------------------------------------------- */
#section2Inner {
	display: table;
}
#s02Txt {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	line-height: 3;
	color: #000;
	padding: 80px 80px 110px;
	background: url(/img/s02_bg_txt.png) no-repeat center center;
	display: none;
}
#s02_nextBtn {
	width: 40px;
	height: 40px;
	position: absolute;
	padding: 0;
	left: 50%;
	margin-left: -20px;
	bottom: -20px;
}

/* -------------------------------------------------------------------
 Section03
-------------------------------------------------------------------- */
#s03LImg {
	width: 500px;
	float: left;
}
#s03RTxt {
	width: 435px;
	float: right;
	text-align: left;
	color: #000;
	padding-top: 20px;
	line-height: 1.8;
	margin-right: 20px;
}
#s03_nextBtn {
	width: 40px;
	height: 40px;
	position: absolute;
	padding: 0;
	left: 50%;
	margin-left: -20px;
	bottom: -20px;
}

#s03Img1 {
	position: absolute;
	top: 180px;
	left: 210px;
	display: none;
}
#s03Img2 {
	position: absolute;
	top: -10px;
	left: -5px;
	opacity: 0;
}




/* -------------------------------------------------------------------
 Section04
-------------------------------------------------------------------- */
#section4Inner img {
	display: inline;
}
#s04S01 {
	width: 1000px;
	text-align: center;
	line-height: 2;
}
#s04S02 li {
	width: 150px;
	float: left;
	margin: 20px 3px;
	opacity: 0;
}
#s04S02 {
	width: 936px;
	margin: 0 auto;
}
#s04S01,
#s04S02 li {
}
#s04_nextBtn {
	width: 40px;
	height: 40px;
	position: absolute;
	padding: 0;
	left: 50%;
	margin-left: -20px;
	bottom: -20px;
}
/* -------------------------------------------------------------------
 Section05（スライドあり）
-------------------------------------------------------------------- */
#s05SlideInner {
	width: 3000px;
}
#s05SlideWrap {
	width: 1000px;
	height: 500px;
	overflow: hidden;
	text-align: center;
}
.s05Slide {
	width: 1000px;
	height: 500px;
	float: left;
}
/* スライド1枚目 */
#s05HikidashiWrap {
	width: 1000px;
	position: relative;
}
#s05Item {
	position: absolute;
	left: 50%;
	top: 0;
	margin-left: -65px;
	z-index: 5;
}

#s05S01Hikidashi {
	width: 1000px;
	height: 440px;
	position: absolute;
	left: 0;
	top: 0;
	background: url(/img/s05_s01_bg.png) no-repeat center -5px;
	z-index: 1;
}
#hikidashiTxt01 {
	position: absolute;
	left: 158px;
	top: 35px;
	display: none;
}
#hikidashiTxt02 {
	position: absolute;
	left: 20px;
	top: 115px;
	display: none;
}
#hikidashiBtnOrganic {
	position: absolute;
	left: 140px;
	top: 140px;
	display: none;
}
#hikidashiTxt02Note {
	position: absolute;
	left: 190px;
	top: 190px;
	display: none;
}
#hikidashiBtnOrganic a:hover {
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
#hikidashiTxt03 {
	position: absolute;
	left: 10px;
	top: 220px;
	display: none;
}
#hikidashiBtnSeibun {
	width: 90px;
	height: 40px;
	line-height: 40px;
	color: #fff;
	background: url(/img/s05_s01_btn_seibun.png) no-repeat left top;
	padding-left: 40px;
	position: absolute;
	left: 15px;
	bottom: 0;
	cursor: pointer;
	display: none;
}
#hikidashiBtnSeibun:hover {
	cursor: pointer;
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
#hikidashiTxt04 {
	position: absolute;
	right: 70px;
	top: 32px;
	display: none;
}
#hikidashiTxt05 {
	position: absolute;
	right: 40px;
	top: 110px;
	display: none;
}
#hikidashiTxt06 {
	position: absolute;
	right: 40px;
	top: 234px;
	display: none;
}
#hikidashiTxt07 {
	position: absolute;
	right: 325px;
	top: 288px;
	display: none;
}
#hikidashiBtnEco {
	position: absolute;
	right: 15px;
	bottom: 0;
	cursor: pointer;
}
#hikidashiBtnEco:hover {
	cursor: pointer;
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
.fukidashiIc {
	padding-left: 20px;
	background: url(/img/ic_fukidashi.png) no-repeat 0 5px;
}
#hikidashiNote {
	position: absolute;
	left: 10px;
	bottom: -30px;
}
#s05Slide01Ttl,
#s05Item,
#s05S01Hikidashi,
#hikidashiBtnEco {
}
#s05S01Hikidashi .fukidashiIc {
	position: absolute;
	left: 15px;
	bottom: -25px;
}

/* スライド2枚目 */
#s05Slide02 {
	height: 460px;
}

#s05Box02L,
#s05Box03L {
	width: 300px;
	height: 460px;
	float: left;
	padding-left: 15px;
	text-align: left;
	position: relative;
}
#s05Box02R,
#s05Box03R {
	width: 630px;
	height: 460px;
	float: right;
	padding-right: 15px;
	text-align: left;
	position: relative;
}

#box02List01 {
	display: table;
	border-collapse: separate;
	border-spacing: 10px 0;
}
#box02List01 li {
	display: table-cell;
	width: 150px;
	height: 130px;
	text-align: center;
	vertical-align: middle;
	color: #fff;
}
#box02List01 .box02List1st {
	background: url(../img/s05_bg_02_01.png) no-repeat center center;
}
#box02List01 .box02List2nd {
	background: url(../img/s05_bg_02_02.png) no-repeat center center;
}
#box02List01 .box02List3rd {
	background: url(../img/s05_bg_02_03.png) no-repeat center center;
}
#box02List01 .box02List4th {
	background: url(../img/s05_bg_02_04.png) no-repeat center center;
}

#s05_prevS01,
#s05_prevS02 {
	position: absolute;
	left: 15px;
	bottom: 0;
	cursor: pointer;
}
#s05_prevS01:hover,
#s05_prevS02:hover {
	cursor: pointer;
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
#s05_nextS03 {
	position: absolute;
	right: 15px;
	bottom: 0;
	cursor: pointer;
}
#s05_nextS03:hover {
	cursor: pointer;
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}

#box03List02 {
	display: table;
	border-collapse: separate;
	border-spacing: 2px 0;
}
#box03List02 li {
	display: table-cell;
	width: 124px;
	height: 160px;
	text-align: center;
	vertical-align: middle;
	color: #fff;
}
#box03List02 .box02List1st {
	background: url(../img/s05_bg_03_01.png) no-repeat center center;
}
#box03List02 .box02List2nd {
	background: url(../img/s05_bg_03_02.png) no-repeat center center;
}
#box03List02 .box02List3rd {
	background: url(../img/s05_bg_03_03.png) no-repeat center center;
}
#box03List02 .box02List4th {
	background: url(../img/s05_bg_03_04.png) no-repeat center center;
}
#box03List02 .box02List5th {
	background: url(../img/s05_bg_03_05.png) no-repeat center center;
}

/* 吹き出し */
.popupBalloon {
	text-align: left;
	position: absolute;
	z-index: 50;
}
#section5Inner {
}
#section5Inner #popup01 {
	width: 610px;
	background: url(../img/bg_fukidashi1_btm.png) no-repeat left bottom;
	padding-bottom: 30px;
	left: 10px;
	top: 20px;
	z-index: 51;
}
.popup01L {
	float: left;
	padding-right: 20px;
}
.popupTtl {
	font-size: 18px;
	line-height: 1.4;
	padding: 15px 20px 15px 10px;
	background: url(../img/bg_fukidashi1_top.png) no-repeat left top;
}
.popupTxt {
	padding: 0 20px 0 10px;
	background: url(../img/bg_fukidashi1_top.png) no-repeat left -30px;
}
#s05Slide03 {
	position: relative;
}
#s05_nextBtn {
	width: 40px;
	height: 40px;
	position: absolute;
	padding: 0;
	left: 50%;
	margin-left: -20px;
	bottom: -20px;
}
.capSup {
	font-size: 77%;
	vertical-align: text-top;
	
}

.s05Txt {
	font-size: 11px;
	text-align: right;
	margin-right: 10px;
}

/* -------------------------------------------------------------------
 Section06
-------------------------------------------------------------------- */

#s06Ttl,
#s06Txt {
	padding-left: 165px;
	text-align: left;
}
#s06L {
	width: 466px;
	float: left;
	position: relative;
	text-align: left;
}
#s06Item {
	position: absolute;
	left: 10px;
	top: -115px;
	z-index: 30;
}
#s06ItemBack {
/*	padding: 0 0 38px 125px;*/
	padding: 0 0 38px 100px;
	opacity: 0;	
}
#s06Graph {
}
#s06R {
	width: 508px;
	float: right;
	padding-right: 15px;
	display: none;
}
#s06BtnList li {
	width: 180px;
	float: left;
	margin-right: 10px;
}
#s06BtnList {
	margin-top: 10px;
}
#s06BtnList #s06BtnList3rd {
	width: 125px;
	margin-right: 0;
}
#section6Inner {
}
#s06R .fukidashiIc {
	margin-left: 15px;
	float: right;
}

#s06_nextBtn {
	width: 40px;
	height: 40px;
	position: absolute;
	padding: 0;
	left: 50%;
	margin-left: -20px;
	bottom: -20px;
}


/* 吹き出し */
#s06BtnList a:hover {
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
#section6Inner #popup02,
#section6Inner #popup03,
#section6Inner #popup04 {
	width: 610px;
	background: url(../img/bg_fukidashi2_btm.png) no-repeat left bottom;
	padding-bottom: 30px;
	position: absolute;
}
#section6 .popupTtl {
	background: url(../img/bg_fukidashi2_top.png) no-repeat left top;
	padding: 15px 20px 0 15px;
	font-size: 18px;
	font-weight: bold;
}
#section6 .popupTxt {
	background: url(../img/bg_fukidashi2_top.png) no-repeat left -30px;
	padding: 0 20px 0 10px;
}
#popup02 {
	left: 40px;
	bottom: 80px;
}
#popup03 {
	left: 230px;
	bottom: 80px;
}
#popup04 {
	left: 365px;
	bottom: 80px;
}
.popupBalloon {
	display: none;
}
/* 全成分表示 */
#s05Slide01 {
	position: relative;
}
.s05Popup {
	display: none;
}
.popupArea {
    width: 720px;
	height: 240px;
	background: url(../img/bg_popup.png);
    padding: 10px;
	position:  absolute;
	left: 50%;
	top: 50%;
	margin-top: -120px;
	margin-left: -360px;
}
.popupAreaInner {
    width: 720px;
	height: 240px;
}
.popupArea li {
	height: 205px;
    background-color: #fff;
    border: 1px solid #ccc;
    display: block;
    padding: 15px 20px 20px;
    position: relative;
    text-align: left;
    z-index: 102;
	color: #000;
}

.productsPopupItemHead {
    font-size: 18px;
}

.productsPopupTable {
    border: 1px solid #999999;
    margin-top: 10px;
    width: 100%;
	border-collapse: collapse;
	font-size: 12px;
}

.productsPopupTable th,
.productsPopupTable td {
    padding: 8px 10px;
    vertical-align: top;
}
.productsPopupTable th {
    background-color: #E6E6E6;
    border-right: 1px solid #999999;
    min-width: 70px;
    white-space: nowrap;
}

.popupClose {
    cursor: pointer;
    position: absolute;
    right: 11px;
    top: 11px;
    z-index: 103;
}

/* -------------------------------------------------------------------
 Section07 商品のご購入方法
-------------------------------------------------------------------- */
#s07L {
	width: 575px;
	margin: 10px 0 0 97px;
	float: left;
	text-align: left;
}
#s07R {
	width: 138px;
	padding-right: 93px;
	float: right;
	text-align: right;
}
#s07Ul {
	width: 380px;
	color: #fff;
	font-size: 77%;
	text-align: left;
}

#section7Inner {
	display: none;
}

/* -------------------------------------------------------------------
 Footer
-------------------------------------------------------------------- */
#footerMenuCont {
	width: 100%;
	height: 100%;
	background: url(../common/img/parts/macFFBgHack.png);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 50;
	display: none;
}
#fMenuContIn {
	width: 970px;
	height: 560px;
	background: #000;
	position: fixed;
	top: 50%;
	left: 50%;
	margin-left: -485px;
	margin-top: -280px;
}
#fMenuContIn img {
	vertical-align: bottom;
}
#fMenuTtl {
	text-align: center;
	margin-bottom: 20px;
}
.fMenuListTtl {
	margin-top: 5px;
	color: #999;
	font-weight: normal;
	font-size: 12px;
}
.fMenuListTtl .sub {
	font-size: 10px;
}
#wrapBtnBsList {
	width: 840px;
	height: 560px;
	margin: 0 auto;
	display: table;
	text-align: center;
}
#wrapBtnBsListIn {
	display: table-cell;
	vertical-align: middle;
}
#wrapBtnBsList li {
	width: 160px;
	float: left;
	margin: 0 25px 5px;
}
#wrapBtnBsList ul {
	margin-bottom: 20px;
}
#wrapBtnBsList .fMenuListLast {
	margin-bottom: -5px;
}
