@charset "utf-8";

@import url("color.css");

/*===============================================
●smart.css  画面の横幅が640pxまで
===============================================*/
@media screen and (max-width:640px){
img{
max-width: 100%;
height: auto;
width /***/:auto;　
}
/*共通部分*/
html{
	height:100%;
}
body{
	font:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:12px;
	letter-spacing:0.1em;
	height:100%;
}
#container{
	min-height:100%;
	height:auto;	
	background-image:url(./../img/back_leaf.jpg);
	background-repeat:repeat-y;
	background-position:center top;
}

header{
	background:url(./../img/head_bg.jpg) repeat-x;
	width:100%;
	height:40px;
}
header h1{
	color:#FFFFFF;
	font-size:14px;
	background:transparent;
	font-weight:normal;
}
#head_icon{
	width:50px;	
}
footer{
	width:100%;
	height:90px;
	position:relative;
	bottom:0px;
}
#ft_bar{
	width:100%;
	height:26px;
	background-color:#;
	position:absolute;
	top:64px;
}
#ft_icon{
	width:100%;
	text-align:center;
	position:absolute;
	top:23px;
}
footer p{
	position:absolute;
	top:64px;
	color:#FFF;
	font-size:14px;
	height:25px;
	margin-top:4px;
	width:100%;
	text-align:center;
	letter-spacing:0px;
}
address{
	text-align:right;
	margin-right:20px;
	font-style:normal;
	position:relative;
	z-index:6;
}
address strong{
	font-size:12px;
}
address strong a{
	font-style:normal;
	text-decoration:none;
	color:#000000;
}
address strong a:hover{
	color:#999999;	
}

.left{
	float:left;
}
.right{
	float:right;
}


/*================================
サブページ共通部品
==================================*/
video{
	width:100%;
}

#content_box{
	margin-top:10px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	display:table;

}
#sub_menu{
	padding-bottom:0px;
	min-height:350px;
	height:auto;
	margin-bottom:15px;
/*	padding-left:20px;*/
	padding-bottom:20px;
	display:table-row-group;
	float:none;
}
#sub_menu_foot{
	background:url(./../img/list3.png) no-repeat #d1ceca 10px;
	height:38px;
	line-height:40px;
	color:#FFFFFF;
	font-size:18px;
	padding-left:40px;
	margin-top:25px;
	font-weight:normal;
	margin-left: 20px;
}
#sub_menu_snd_title{
	background:url(./../img/icon_snd2.jpg) no-repeat #e0a396 0px;
	height:40px;
	line-height:40px;
	color:#333;
	font-size:18px;
	padding-left:40px;
	margin-bottom:15px;
	font-weight:normal;
	margin-top:50px;
}
.sub_menu_snd{
	width:240px;
	background: url(./../img/submenu_cursol.png) no-repeat #d1ceca 0px;
	height:39px;
	line-height:39px;
	color:#333;
	font-size:16px;
	letter-spacing:0px;
	padding-left:40px;
	border-bottom:1px dashed #ccc;
	display:inline-block;
	margin-left: 20px;
}
.sub_menu_talk{
	width:240px;
	background: url(./../img/submenu_cursol.png) no-repeat #d1ceca 0px;
	height:39px;
	line-height:39px;
	color:#FFFFFF;
	font-size:14px;
	letter-spacing:0px;
	padding-left:40px;
	border-bottom:1px dashed #ccc;
	display:inline-block;
	margin-bottom:10px;
	margin-left: 20px;
}


#footer2 {
    background-color: #c78198;
    bottom: 0;
    height: 26px;
    width: 100%;
}
#footer2 p{
	position:absolute;
	top:4px;
	color:#FFF;
	font-size:80%;
	height:21px;
	margin-top:0px;
	width:100%;
	text-align:center;
}

#sub_content{
	padding-bottom:0px;
	display:table-header-group;
	float:none;
}

#inyou{
	text-align:right;
	margin-top:30px;
	line-height:1.4em;
}



/*==================================
sub01用
===================================*/

#t_path{
	height:auto;
	line-height:20px;
	margin-left:auto;
	margin-right:auto;
/*	font-size:14px;*/
}
#sub01_c_title{
	height:75px;
	padding-left:20px;
	padding-top:10px;
	position:relative;
	margin-bottom:20px;
}
#sub01_c_title h1{
	font-size:42px;
	line-height:50px;
	height:50px;
	margin-top:0px;
	/*border-left:3px solid #eee;
	padding-left:10px;*/
}
#sub01_c_title h2{
	font-size:18px;
	position:absolute;
	top:50px;
	right:15px;
}
.sub01_c_clm{
	margin-left:auto;
	margin-right:auto;
	margin-bottom:10px;
}
.sub01_c_clm h3{
	font-weight:normal;
	height:30px;
	font-size:16px;
	line-height:30px;
	padding-left:15px;
}
.sub01_c_clm p {
	padding:20px;
	font-size:15px;
	letter-spacing:1px;
	line-height:1.3em;
}
.sub01_c_clm #course_desc {
	padding:20px;
	font-size:15px;
	letter-spacing:1px;
	line-height:1.3em;
}
#sub01_aside{
	display:none;
}
#sub01_aside_in{
	font-size:14px;
	margin:auto;
}



/*==================================
pro02用
===================================*/


#t_path2{
	height: auto;
	/*min-height:25px;*/
	line-height:20px;
	margin-left:auto;
	margin-right:auto;
/*	font-size:14px;*/
}
#t_path2>a:first-child span{
	display:none;
}
.pro_menu_snd{
	margin:2px;
	min-height:50px;

}
	.pro_menu_snd span{
		cursor:pointer;
	}
.pro_menu_snd:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.25em;
}
.pro_menu_snd li{
	font-size:120%; /*18px;*/
	padding-top:18px;
	padding-bottom:5px;
	display: inline-block;
	vertical-align: middle;
	letter-spacing:0px;

}
.pro_menu_snd li a{
	padding-left:50px;
}
#pro_box_target{
	float:none;
	min-height:320px;
	margin-bottom:15px;
	margin-right:0px;
}
#pro_box_target p{
	padding:20px;
	line-height:1.5em;
	font-size:130%; /*18px;*/
}
#pro_box_explanation{
	float:none;
	height:320px;
	margin-bottom:15px;
	margin-right:0px;
}
#pro_box_explanation p{
	padding:20px;
	line-height:1.5em;
	font-size:120%; /* 18px; */
}
#pro_box_trans{
	height:auto;
}
#pro_box_trans p{
	padding-top:20px;
	padding-left:20px;
	line-height:1.3em;
	font-size:120%; /* 18px; */
}
#pro_box_snd{
	margin:auto;
	text-align:right;
}
.pro_child_menu li{
	/*height:30px;*/
	height: auto !important;
	line-height:30px;
	padding-left:40px;
	font-size:16px;
}
#pro_child_menu0,#pro_child_menu1,#pro_child_menu2,#pro_child_menu3{
	height:0px;
	visibility:hidden;
}
#pro_child_menu0:target{
	height:auto;
	visibility:visible;
}
#pro_child_menu1:target{
	height:auto;
	visibility:visible;
}
#pro_child_menu2:target{
	height:auto;
	visibility:visible;
}
#pro_child_menu3:target{
	height:auto;
	visibility:visible;
}
#pro_menu_foot_box {
	height: 50px;
}
#pro_box_center {
	padding: 15px;
	font-size: 11pt;
	height: auto;
}
.pro_menu_foot, .pro_menu_foot2{
	float: left;
	width:50px;
	height:38px;
	line-height:40px;
	font-size:14px;
	padding-left:30px;
	font-weight:normal;
	margin-bottom:5px;
	margin-right: 15px;
}
#pro_th_menu_box{
        overflow:auto;
}
.pro_th_menu_foot{
        float: right;
        width:50px;
        height:40px;
        line-height:40px;
        font-size:14px;
        padding-left:30px;
        font-weight:normal;
        margin-bottom:5px;
        margin-right: 5px;
}
.pro_th_menu_foot2{
        float: left;
        width:50px;
        height:40px;
        line-height:40px;
        font-size:14px;
        padding-left:30px;
        font-weight:normal;
        margin-bottom:5px;
        margin-right: 5px;
}
.pro_th_prev_page{
        float:left;
	font-size:16px;
	margin-top:10px;
	width:210px;
	height:20px;
	white-space: nowrap;
	overflow:hidden;
	text-overflow: ellipsis;
}
.pro_th_next_page{
        float:right;
	font-size:16px;
	margin-top:10px;
	width:210px;
	height:20px;
	white-space: nowrap;
	overflow:hidden;
	text-overflow: ellipsis;
	text-align:right;
}
.pro_inline{
	width:100%;
	margin-bottom:0px;
}
.sub_menu_add{
	margin-left:7px;
}


/*==================================
dia03用
===================================*/


/*|||||||||||||||||||||||||||||
発音モジュール用文章欄
|||||||||||||||||||||||||||||||*/

.pro_c_clm{
	margin-left:auto;
	margin-right:auto;
	margin-bottom:10px;
}
.pro_c_clm h3{
	font-weight:bold;
	height:30px;
	font-size:18px;
	line-height:30px;
	padding-left:15px;
}
.pro_c_clm .p{
	padding:16px;
	font-size:16px;
	letter-spacing:1px;
	line-height:1.5em;
}
.pro_c_clm .p img{
	margin-right:0px;
}
.pro_c_clm p{
	margin-bottom:10px;
}
.pro_c_clm td{
	padding-right:2px;
}
.pro_th_in_title{
	background-color:#d1ceca;
	color:#333;
	font-weight:normal;
	height:34px;
	font-size:18px;
	line-height:34px;
	padding-left:15px;
	margin-top:20px;
	margin-bottom:20px;
}
.pro_main_contents{
	font-size:16px;
}
.pro_main_contents table{
	border:solid 1px #aaa;
}
.pro_main_contents tr{
	border:solid 1px #aaa;
}
.pro_main_contents td{
	border:solid 1px #aaa;
}
.pro_main_contents th{
	border:solid 1px #aaa;
}
.pro_th_navi_box{
	margin-top:20px;
	margin-bottom:20px;
}
.pro_th_navi_item{
	font-size:16px;
}
.pro_th_class_box{
	margin-top:10px;
}


.gra_ques_sec {
	margin-top: 20px;
	margin-bottom: 20px;
}

.ques_text {
	line-height: 2.5;
}

.ques_box {
	height: auto;
	padding: 5px 10px;
}

.ques_number {
	line-height: 3.5;
}

.ques_item_box {
	margin-top: 20px;
	padding-left: 20px;
}

.pro_in_menu_container {
	margin-bottom: 20px;
	line-height: 45px;
	font-size: 16px;
	text-align: center;
	float: left;
	width: 270px;
}

.pro_in_menu_container a {
	color: #333;
	text-decoration: none;
}

.pro_in_menu {
	background-image:url(../img/top_cursor.png);
	width: 120px;
	height: 40px;
	float: left;
	margin-right: 10px;
}

.pro_in_menu_off {
	width: 120px;
	height: 40px;
	float: left;
	margin-right: 10px;
}

/**
 * ドラッグアンドドロップ
 */
.match_drag_ul {
	padding: 5px 10px;
	width: 240px;
	float: left;
	margin-right: 15px;
}

.match_drag_ul li {
	height: 40px;
	border: solid 1px #AAAAAA;
	margin-bottom: 25px;
	padding: 5px;
	line-height: 40px;
	text-align: center;
	background-color: #FFFFFF;
	cursor: move;
}

.match_drop_ul {
	padding: 5px 0px;
	width: 240px;
	float: left;
}

.match_drop_ul li {
	height: 40px;
	border: solid 1px #AAAAAA;
	margin-bottom: 25px;
	padding: 5px;
	line-height: 40px;
	text-align: right;
	background-color: #EDE8E4;
}

/**
 * sort用ドラッグアンドドロップ
 *
 */
.sort_p_mg {
	margin: 0px 5px;
}

.sort_drag_box {
	display: inline-block;
	width: 40px;
	border-bottom: dotted 1px #AAAAAA;
	text-align: center;
}

.sort_drag_ul {
	border: solid 1px #AAAAAA;
	padding: 5px 10px;
	padding-top: 15px;
	margin-top: 20px;
	margin-bottom: 20px;
}

.sort_drag_ul li {
	float: none;
	width: auto;
	height: 40px;
	padding: 5px 10px;
	line-height: 32px;
	border: solid 1px #AAAAAA;
	margin-right: 10px;
	margin-bottom: 10px;
	background-color: #FFFFFF;
	cursor : move;
	padding-top: 15px;
}

/**
 * 理論編：練習問題
 */
.pro_exercise_box {
	margin-top : 20px;
	margin-bottom: 20px;
}

.pro_exercise_box a {
	display: block;
	width: 120px;
	text-decoration: none;
}

.pro_in_exercises_button {
	width : 120px;
	height: 40px;
	text-align : center;
	line-height: 40px;
	background-color : #FFAAFF;
	text-decoration : none;
	color : #000000;
}

/* 付け足し */
#dia_uc_left {
	vertical-align:top;
	padding:5px;
}

}