@charset "UTF-8";

/*-----------------------------------------------
_ Default Style Clear
-----------------------------------------------*/
all {  
border:0; 
line-height:1.4; 
margin:0;  
padding:0;
outline:0;   
vertical-align:baseline;
word-spacing: 1px;
font-size: 14px;
font-family: Arial, sans-serif;
}  


div.main_contents {
	min-height: 500px;
	margin: 0;
	padding: 0
}

:focus {
outline:0;
}  


.pointback_campaign img {
border:none;
text-decoration:none;
}  

.pointback_campaign ul, .pointback_campaign li {
list-style-type:none;
}  


/* Font
--------------------------------------------- */
@font-face {
	font-family: HuiFontP109;
	src: url('../font/HuiFontP109.ttf') format('truetype');
}

/*-----------------------------------------------
_ Default Style Clear
-----------------------------------------------*/

body {
	margin: 0;
	font-family: Arial, sans-sans-serif;
	background-image: url(../images/bg.png);
}

img {
	border-style:none;
}

ruby{
	color: red;
}

/*-----------------------------------------------
_ all
-----------------------------------------------*/

#all{
	width: 980px;
	float: left;
	font-family: Hiragino Maru Gothic Pro, HG丸ゴシックM-PRO, verdana, arial, sans-serif;
	color: #666666;
	text-decoration: none;
	background-color: #fff;
	padding: 20px;
	margin-top: 10px;
}



div#all a:link {
	color: #FF9933;
}
div#all a:visited {
	color: #FF9933;
}
div#all a:hover {
	color: #66cc99;
	text-decoration: none;
}
div#all a:active {
	color: #66cc99;
	text-decoration: none;
}

/* Font
--------------------------------------------- */

	.socialicon{
		width: 960px;
		height: 22px;
		margin-top: 10px;
		text-align: right;
	}
	
	.socialicon_other{
		width: 960px;
		height: 22px;
	}
	
	.twitter-share-button {
	    width: 84px!important;
	}
	
	.g {
	    width: 20px!important;
	}
	

/*-----------------------------------------------
_ top_img
-----------------------------------------------*/

.top{
	width: 960px;
	height: 400px;
	float: left;
	background-repeat: no-repeat;
	margin-top: 5px;
	background:url(../images/head.png) no-repeat;
}
	
	.top_top{
		padding:30px 30px 30px 30px;
		font-family: Hiragino Maru Gothic Pro, HG丸ゴシックM-PRO, verdana, arial, sans-serif;
	}
	
		.top_top p{
			text-shadow: 2px 2px 0px #fff; 
			font-size: 18px;
			color: #22B573;
			height: 27px;
			width: 900px;
		}
		
		.top_top h1{
			text-shadow: 2px 2px 0px #fff;
			font-weight: 100;
			color:#ED1E79;
			height: 60px;
			width: 900px;
		}
		
		.top_top h2{
			text-shadow: 2px 2px 0px #fff;
			font-weight: 100;
			padding-top: 20px;
			height: 52px;
			width: 900px;
			font-size: 24px;
		}
		
	.top .socialicon{
		width: 730px;
		height: 22px;
		float: right;
		margin-top: 30px;
		text-align: right;
	}
	
	.top .socialicon_other{
		width: 536px;
		height: 22px;
	}
	
	.top .twitter-share-button {
	    width: 84px!important;
	}
	
	.top .g {
	    width: 20px!important;
	}
	
	.top .detail{
		width: 960px;
		height: 270px;
		float: left;
		padding-top: 20px;
	}
	
		.top .detail .detail_in{
			padding-right: 40px;
			padding-left: 40px;
			text-align: center;
		}
		
			.top .detail .detail_in p{
				font-size: 18px;
			}

/*-----------------------------------------------
_ about_pointback
-----------------------------------------------*/

.about_pointback{
	width: 960px;
	height: 460px;
	float: left;
	margin-top: 30px; 
}

		.about_pointback .about_text{
			padding: 0px 60px 35px 60px;
		
		}

			.about_pointback .about_text p{
				color: #666;
				text-align: center;
			}	
			
div.entry {
width: 380px;
height: 45px;
clear: both;
border: 1px solid #CCC;
padding: 2px;
display: inline-block;
margin: 50px 0 0 190px;
-moz-box-shadow:#777 0px 2px 6px;
-webkit-box-shadow: #777 0px 2px 6px;
box-shadow: #777 0px 2px 6px;
-moz-border-radius: 18px;
-webkit-border-radius: 18px;
border-radius: 18px;
background-color: #ded8d8;
}


div.entry p a {
color: #F9F7B8;
font-size: 1.5em;
display: block;
text-decoration: none;
font-weight: bold;
text-align: center;
background-color: #665a61;
padding: 5px 20px 2px;
text-decoration: none;
-moz-border-radius: 18px;
-webkit-border-radius: 18px;
border-radius: 18px;
height: 38px;
line-height: 38px;
}
div.entry p a:hover {
background-color: #5b4552;
}

/*-----------------------------------------------
_ attention
-----------------------------------------------*/

.attention{
	width: 960px;
	height: 500px;
	float: left;
	margin-top: 20px;
}

		.attention .attention_text{
			float: left;
			background-repeat: no-repeat;
			background-image: url(../images/subsub_main.png);
			width: 249px;
			height: 355px;
			margin-right: 55px;
		
		}
		
			.attention .attention_text .at_te_in{
				padding: 60px 20px 20px 20px;
			}
			
				.attention .attention_text .at_te_in p{
					font-size: 13px;
				}

	
	.attention_attention{
		padding: 20px 0px 0px 50px;
		float: left;
		width: 920px;
		height: 50px;
	}
	
		.attention_attention p{
			font-size: 12px;
			color: red;
		}
		
/*-----------------------------------------------
_ italian_lesson
-----------------------------------------------*/

.italian_lesson{
	width: 960px;
	height: 80px;
	float: left;
}

.pointback_category{
	width: 920px;
	height: 250px;
	float: left;
	padding: 0px 20px 0px 20px;
	margin-bottom: 30px;
}

	.pointback_category .category_each{
		height: 40px;
		float: left;
		padding-top: 20px;
	}
	
	.pointback_category .category_each_last{
		width: 900px;
		height: 40px;
		float: left;
		padding-top: 20px;
	}
	
		.pointback_category .category_each_last p{
			font-size: 24px;
		}
	
		.pointback_category .category_each p{
			font-size: 24px;
		}

	.italian_lesson_menu{
		width: 960px;
		height: 150px;
		float: left;
		background-repeat: no-repeat;
		background-position: left;
		background-image: url(../images/recommended.png);
	}
	
		.italian_lesson_menu ul{
			padding-left: 300px;
			line-height: 50px;
		}
			
			.italian_lesson_menu ul li{
				font-size: 20px;
			}


.lesson_1{
	width: 960px;
	height: 1490px;
	float: left;
}

.lesson_2{
	width: 960px;
	height: 500px;
	float: left;
}

.lesson_3{
	width: 960px;
	height: 640px;
	float: left;
	margin-top: 40px;
}

	.lesson_name{
		width: 960px;
		height: 40px;
		float: left;
	}
	
	.lessons{
		width: 960px;
		height: 560px;
		float: left;
	}
	
		.lesson_l{
			width: 470px;
			height: 150px;
			float: left;
			margin-right: 10px;
			border: 1px #ccc solid;
			padding: 10px;
			margin-top: 20px;
			-webkit-border-radius: 7px;
			-moz-border-radius: 7px;
			border-radius: 7px;
			background-color: #fff;
		}
		
		.lesson_r{
			width: 470px;
			height: 150px;
			float: left;
			margin-left: 10px;
			border: 1px #ccc solid;
			padding: 10px;
			margin-top: 20px;
			-webkit-border-radius: 7px;
			-moz-border-radius: 7px;
			border-radius: 7px;
			background-color: #fff;
		}
		
		.lesson_0{
			width: 448px;
			height: 102px;
			float: left;
			margin-left: 10px;
			margin-top: 20px;
		}
		
		.lesson_one_image{
			width: 100px;
			height: 100px;
			float: left;
			margin-right: 20px;
			margin-bottom: 10px;
		}
		
			.lesson_one_image img:hover{
				opacity:0.7;
				filter: alpha(opacity=70);
				-ms-filter: "alpha( opacity=70 )";
				background: #fff;
			}
			
		.lesson_one_text{
			width: 328px;
			height: 100px;
			float: left;
			margin-bottom: 10px;
		}
		
		.lesson_one_text table{
			font-size: 10px;
		}
			
			.lesson_one_text table tbody{
				font-size: 10px;
			}
		
		.lesson_bottom{
			width: 448px;
			height: 60px;
			float: left;
			padding-top:10px;
			border-top: 1px solid #ccc;
		}
		
		.lesson_description{
			width: 378px;
			height: 60px;
			margin-right: 10px;
			float: left;
		}
			
		
		.tutor_img{
			width: 60px;
			height: 60px;
			float: left;
		}
		
			.tutor_img img:hover{
				opacity:0.7;
				filter: alpha(opacity=70);
				-ms-filter: "alpha( opacity=70 )";
				background: #fff;
			}
/*-----------------------------------------------
_ recommended tutor and lesson
-----------------------------------------------*/

	.about_pointback .recommended_box{
		padding: 80px 120px 35px 120px;
	}

		.about_pointback .recommended_box .recommended_tutor{
			width: 350px;
			height: 60px;
			float: left;
		}
			
			.about_pointback .recommended_box .recommended_tutor .recommended_tutor_img{
				width: 60px;
				height: 60px;
				float: left;
				margin-right: 20px;
			}
		
		.about_pointback .recommended_box .recommended_tutor .recommended_tutor_name{
			width: 250px;
			height: 35px;
			float: left;
		}
		
			.about_pointback .recommended_box .recommended_tutor .recommended_tutor_name p{
				font-size: 28px;
				padding: 0;
				margin: 0;
			}
		
		.about_pointback .recommended_box .recommended_tutor .recommended_tutor_disc{
			width: 250px;
			height: 25px;
			float: left;
		}
		
			.about_pointback .recommended_box .recommended_tutor .recommended_tutor_disc p{
				font-size: 13px;
			}
			
		
/*-----------------------------------------------
_ recommended_tutors
-----------------------------------------------*/

.recommended_tutors{
	width: 960px;
	height: 3250px;
	float: left;
	margin-top: 40px;
	background-image: url(../images/bg.png);
	background-repeat: no-repeat;
	background-position: bottom;
}

	.recommended_tutors .a_tutor{
		width: 960px;
		height: 100px;
		float: left;
	}
		
		.recommended_tutors .a_tutor .a_tutor_img{
			width:100px;
			height: 100px;
			float: left;
			margin-right: 20px;
		}
		
		.recommended_tutors .a_tutor .a_tutor_name{
			width: 840px;
			height:45px;
			float: left;
			vertical-align: text-top;
		}
		
			.recommended_tutors .a_tutor .a_tutor_name p{
				font-size: 30px;
			}
			
		.recommended_tutors .a_tutor .a_tutor_disc{
			width: 840px;
			height:55px;
		}
			
			.recommended_tutors .a_tutor .a_tutor_disc p{
				font-size:14px;
			}
		
		.recommended_tutors .a_lesson{
			width:418px;
			float: left;
			border: solid #ccc 1px;
			margin-top: 20px;
			padding:15px 20px 20px 20px;
			-webkit-border-radius: 10px;
			-moz-border-radius: 10px;
			-o-border-radius: 10px;
			-khtml-border-radius: 10px;
			border-radius: 10px;
		}
		
			.recommended_tutors .a_lesson .a_lesson_img{
				width: 80px;
				height: 80px;
				margin: 5px 20px 10px 0px;
				float: left;
			}
			
			.a_lesson_img img:hover{
				opacity:0.7;
				filter: alpha(opacity=70);
				-ms-filter: "alpha( opacity=70 )";
				background: #fff;
			}

			
			.recommended_tutors .a_lesson .a_lesson_title{
				width: 318px;
				height: 80px;
				margin: 0px 0px 10px 0px;
				float: left;
			}
			
			.recommended_tutors .a_lesson .a_lesson_feedback{
				width: 418px;
				height: 75px;
				float: left;
				background-color: #e0e0cc;
				-webkit-border-radius: 10px;
				-moz-border-radius: 10px;
				-o-border-radius: 10px;
				-khtml-border-radius: 10px;
				border-radius: 10px;	
			}
			
				.recommended_tutors .a_lesson .a_lesson_feedback .feedback_in{
					padding:5px;
				}
		

/*-----------------------------------------------
_ button_module
-----------------------------------------------*/

.button_module{
	width: 900px;
	height: 60px;
	float: left;
	margin: 0px 60px 0px 30px;
}

/*-----------------------------------------------
_ about_cafetalk2
-----------------------------------------------*/
.contents footer{
	margin: 0 0 0 -5px!important;
	padding-top:30px;
}

.neo88{
	float:left;
	width:15px;
	height:11px;
	background:#de7c63;
	border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	-ms-border-radius:4px
	}

.neo88::after{
	content:'';
	position:relative;
	top:10px;
	left:6px;
	width:0;
	height:0;
	float:left;
	border:2px solid transparent;
	border-top-color:#de7c63;
	border-right-color:#de7c63;
	}



/*-----------------------------------------------
_ fukidashi
-----------------------------------------------*/

	.chat-bubble {
		background-color:#fff; /*背景色*/
		border:2px solid #cccc00;/*ボーダーの設定*/
		padding:5px;/*ボックス内の幅*/
		position:relative;/*位置の指定はrelativeで*/
		width:800px;
		height:42px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		-o-border-radius: 10px;
		-khtml-border-radius: 10px;
		border-radius: 10px;
		margin: 45px 0px 0px 120px;
	}
	
	.chat-bubble-arrow-border {
		border-color: transparent #cccc00 transparent transparent; /*三角の向き　下向き 左向き 上向き 右向き*/
		border-style: solid;
		border-width: 10px;　/*三角の横幅*/
		height:0;/*セルの内側を消す*/
		width:0;/*セルの内側を消す*/
		position:absolute;/*位置の指定はabsoluteで*/
		bottom:20px;/*上下の位置調整*/
		left:-20px;/*左右の位置調整*/
	}
	
	.chat-bubble-arrow {
		border-color: transparent #fff transparent transparent;/*三角の向き　下向き 左向き 上向き 右向き*/
		border-style: solid;
		border-width: 10px;
		height:0;
		width:0;
		position:absolute;
		bottom:20px;/*上下の位置調整*/
		left:-17px;/*左右の位置調整*/
	}