@charset "EUC-JP";
/* ///////////////////////////////

SOBACHOCO»ÔʬÎà
PCÍÑ

///////////////////////////////
*/

.sobachocoCnt{font-family: "Þ⥴¥·¥Ã¥¯ Medium", "Yu Gothic Medium", "Þ⥴¥·¥Ã¥¯ÂÎ", YuGothic, sans-serif;}
.block{width:950px; margin:50px auto; position:relative; background:url(../sobachoco-04.gif) no-repeat bottom; padding-bottom:50px;}

.bklineup{right:0;  z-index:9999; position:absolute; text-align:right; margin-top:0px}
.bklineup img{width: 60px;}
.fixed { position: fixed; bottom: 30%;  z-index: 10000;}


/*¡üsobactg0*/
#sobactg0{margin:30px auto 50px;}
/*#sobactg0 p{margin:30px 30px 45px;text-align:center}
*/#sobactg0 ol{width:100%; overflow:hidden; margin:0 40px}
#sobactg0 li{float:left; display:inline-block; margin:0 10px}

#sobactg0 .imgbox{overflow:hidden; margin-left:-8px; position:relative;  text-align:center; margin-bottom:80px; clear:both; padding-top:8px!important}
#sobactg0 .imgbox p{float:left; width:230px; margin-left:8px; margin-bottom:8px}
#sobactg0 .imgbox p.imgbox2{margin-left:484px}
#sobactg0 .imgbox p.txtbox{float:clear; position:absolute; top:17px; left:0; width:100%; line-height:1.8em; font-size:16px; text-align:center}
#sobactg0 .imgbox p.txtboxsp{display:none}


/*¡üsobactg1*/
#sobactg1{}
#sobactg1 div {background:url(../sobachoco-02.jpg) no-repeat left top; width:100%;min-height:461px; margin:50px;}
#sobactg1 div h2{padding:30px 0 0 480px}
#sobactg1 div p{margin:30px 0 0 480px; font-size:16px; line-height:2.0em;

}
/*¡üsobactg2*/
#sobactg2{}
#sobactg2 h2{text-align:center; margin-bottom:30px;}
#sobactg2 p{text-align:center; margin: 0 0 30px;}
#sobactg2 .block{}
.howBox{overflow:hidden; width:100%; height:450px; margin-top:50px; padding-top:-50px}
.howBox h3{margin:40px 0 10px 0px; display:inline-block;  float:left; width:100%; text-align:center}
#sobactg2 .howBox p{width: 290px;margin: 0 auto 0px; float:left; font-size:16px; line-height:34px; background:url(../sobachoco-line.gif) }
.bkimg{width:595px; float:right; text-align:right}
.howttl{width:318px; overflow:hidden; display:inline-block; margin-left:50px; text-align:center}

.howLeft{}
.howRight{}
.howBox.howLeft .howttl{float:left;}
.howBox.howRight .howttl{float:right; margin:0 50px 0 0}
.howBox.howRight h3{float:right!important; text-align:center;}
.howRight.howBox p{margin:30px 15px 0; float:left}

/*¡üsobactg3*/
#sobactg3 h2{text-align:center; margin:100px 0 60px;}
#sobactg3 ul.itemCnt li{width:150px; color:#333; height:260px; vertical-align:top}
img.itemImg{padding:0 10px; width:130px; margin-bottom:0px}
.itemInfo span.Name{font-size:12px; text-align:center; display:block}
.itemInfo span.Name small{font-size:11px; text-align:center; display:block; margin:5px auto}
.itemInfo p.Price{text-align:center!important; display:block; color:#a09917}


#sobactg3 ul.itemCnt{padding:5px 5px 5px 60px}


.bkimg1,
.bkimg3,
.bkimg5{position:absolute; top: 0px; right:0px; z-index:998; width:595px; float:right; text-align:right; height:425px}
.bkimg2,
.bkimg4,
.bkimg6{position:absolute; top: 10px; left:0px; z-index:996; width:595px; float:left; text-align:left; height:425px}
.animate_item{
	position: absolute;
	top: 0;
	left: 0;
	z-index:996;
	opacity:0;
}
.animate_item.fadeIn{
	-webkit-animation-duration: 2.4s;
	animation-duration: 2.4s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn;
	z-index:997;
}
.animate_item.fadeOut{
	-webkit-animation-duration: 2s;
	animation-duration: 2s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-name: fadeOut;
	animation-name: fadeOut;
	z-index:996;
}
@-webkit-keyframes fadeIn{
	from{opacity: 0;}
	to{opacity: 1;}
}
@keyframes fadeIn{
	from{opacity: 0;}
	to{opacity: 1;}
}
@-webkit-keyframes fadeOut{
	from{opacity: 1;}
	to{opacity: 0;}
}
@keyframes fadeOut{
	from{opacity: 1;}
	to{opacity: 0;}
}


/*animation*/
.move2{transition: 0.8s; opacity: 0; transform: translate(0,60px); -webkit-transform: translate(0,60px); }
.move2on{opacity: 1.0; transform: translate(0,0); -webkit-transform: translate(0,0);}

.anime1 {animation-duration: 1s;animation-name: slidein;}

@keyframes fadein {
from {opacity:0;}
to {}
}