@charset "utf-8";

/*ホイップる*/

/* -------------------------------------------------------------------
	メインイメージ
------------------------------------------------------------------- */

.mainimage {
	border:0 solid #ccc;
	height:400px;
	color:#999;
	margin-bottom:30px;
}


/* -------------------------------------------------------------------
	バナーエリア
------------------------------------------------------------------- */

.banner {
	margin-bottom:20px;
}

.banner a {
	display:block;
	float:left;
	width:210px;
	margin-right:27px;
}

.banner a.last {
	float:right;
	margin-right:0;
}

.banner a.nomargin {
	margin:0;
}

/* -------------------------------------------------------------------
	box
------------------------------------------------------------------- */

.box {
	width:900px;
	margin:0 auto 20px;
}

.box h2 {
	width:900px;
	height:45px;
	text-indent:-9876px;
	outline:none;
	/*background:url("img/box_top_news.png") no-repeat 0 0;*/
	position:relative;
}

.box .inner {
	border-top: none;
	border-right:1px solid #8cbef0;
	border-bottom:1px solid #8cbef0;
	border-left:1px solid #8cbef0;
	padding:20px;
}

.box h2 a {
	position:absolute;
	right:10px;
	top:5px;
	display:block;
	width:80px;
	height:25px;
	outline:none;
	text-indent:0;
}

/* -------------------------------------------------------------------
	新着情報
------------------------------------------------------------------- */
.news h2 {
	background:url("img/box_top_news.png") no-repeat 0 0;
}


/* -------------------------------------------------------------------
	ロングバナー
------------------------------------------------------------------- */

.long_banner {
	width:850px;
	height:100px;
	margin:0 auto 20px;
}

.long_banner a {
	background:#fff url("img/what.png") no-repeat 0 0;
	display:block;
	width:850px;
	height:100px;
	text-indent:-9876px;
	outline:none;
}


.long_banner2 {
	width:850px;
	height:100px;
	margin:0 auto 20px;
}

.long_banner2 a {
	background:#fff url("img/lesson.png") no-repeat 0 0;
	display:block;
	width:850px;
	height:100px;
	text-indent:-9876px;
	outline:none;
}

/* -------------------------------------------------------------------
	しょうひんカタログ
------------------------------------------------------------------- */

.products_bg{/*紫水玉*/
	background:url("img/box_bg_products.gif") repeat;
}


.products h2 {
	background:url("img/box_top_products.png") no-repeat 0 0;
}

.products h3 {
	margin:0 auto 20px;
	width:834px;
}

.products .box1 {
	width:830px;
	margin:0 auto 20px;
}

.products .box1 a {
	display:block;
	width:250px;
	/*border:1px solid #ddd;*/
	float:left;
	margin-right:40px;
	text-decoration: none;
}

.products .box1 a.nomargin {
	margin:0;
}

.products .box2 {
	width:830px;
	margin:0 auto;
}

.products .box2 a {
	display:block;
	width:380px;
	float:left;
}

.products .box1 a.last,
.products .box2 a.last {
	float:right;
	margin-right:0;
}


/* -------------------------------------------------------------------
	動画
------------------------------------------------------------------- */

.movie_bg{/*ピンク水玉*/
	background:url("img/box_bg_movie.gif") repeat;
}


.movie h2 {
	background:url("img/box_top_movie.png") no-repeat 0 0;
}

.movie .box1 {
	width:830px;
	margin:0 auto;
}

.movie .box1 a {
	display:block;
	width:248px;
	/*border:1px solid #ddd;*/
	float:left;
	margin-right:40px;
	outline:none;
	text-decoration:none;
}

.movie .box1 a.last {
	float:right;
	margin-right:0;
}

.movie .box1 a.nomargin {
	margin:0;
}

.movie_text{
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #333;
	font-size:12px;
	margin: 0;
	padding: 0;
	}
	
.new_red{
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #F00;
	font-size:12px;
	margin: 0;
	padding: 0;
	}	

/* -------------------------------------------------------------------
	レッスンムービー
------------------------------------------------------------------- */

.lessen_bg{/*みどり水玉*/
	background:url("img/box_bg_lessen.gif") repeat;
}



.lessen h2 {
	background:url("img/box_top_lessen.png") no-repeat 0 0;
}

.lessen .box1 {
	padding-bottom:20px;
}

.lessen .box2 {
	margin:0;
}

.lessen .box1 a {
	display:block;
	width:208px;
	border:1px solid #ddd;
	float:left;
	margin-right:6px;
	outline:none;
}

.lessen .box1 a.last {
	float:right;
	margin-right:0;
}

.lessen .box1 a.nomargin {
	margin:0;
}

.lessen a.btn {
	display:block;
	background:#fff url("img/lessen_btn.png") no-repeat 0 0;
	text-indent:-9876px;
	outline:none;
	width:340px;
	height:80px;
	margin:0 auto;
	padding:0;
}

/* -------------------------------------------------------------------
	ぷっちぐみ
------------------------------------------------------------------- */

.pucchi_bg{/*青水玉*/
	background:url("img/box_bg_pucchi.gif") repeat;
}



.pucchi h2 {
	background:url("img/box_top_pucchi.png") no-repeat 0 0;
}

.pucchi .box1 {
	width:830px;
	margin:0 auto;
	padding-bottom:10px;
}

.pucchi .box1 a {
	display:block;
	width:260px;
	float:left;
	margin-right:25px;
	outline:none;
}

.pucchi .box1 a.last {
	float:right;
	margin-right:0;
}

.pucchi .box1 a.nomargin {
	margin:0;
}

/* -------------------------------------------------------------------
	例外処理
------------------------------------------------------------------- */

#container #btn-left a,
#container #btn-right a,
#container li a {
	outline:none;
}

