@charset 'UTF-8';

/* リセット */

html,body,div,th,td,
ul,ol,li,dl,dt,dd,
form,fieldset,input,textarea,
h1,h2,h3,h4,h5,h6,pre,code,p,blockquote,hr {
margin: 0;
padding: 0;
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, Arial, "Arial Unicode MS", sans-serif;
}

h1,h2,h3,h4,h5,h6 {
font-size: 100%;
font-weight: normal;
}

/*  */

h2{
font-weight: bold;
font-style: normal;
font-size: 180%;
line-height: 1.5em;
}

h3{
font-weight: bold;
font-style: normal;
font-size: 120%;
line-height: 1.5em;
}

#wrapper {
margin: 0px auto;
padding: 0px;
clear: none;
float: both;
/* width: 576px; */ /* WebCT用 */
/* width: 786px; */ /* WebCT用 */
width: 960px; /* 物理媒体配布用 */
}

#header_bar {
/* color: #d77; */
color: #777;
text-decoration: none;
/* background-color: #900; */
background-color: #ddd;
border-left: solid 1px #ddd;
border-right: solid 1px #ddd;
margin: 0px;
padding: 2px 4px 6px;
clear: none;
float: left;
height: 32px;
/* width: 778px; */ /* WebCT用 */
width: 952px; /* 物理媒体配布用 */
font-size: 18pt;
}

#header_bar2 {
/* color: #d77; */
color: #777;
text-decoration: none;
/* background-color: #900; */
background-color: #ddd;
border-left: solid 1px #ddd;
border-right: solid 1px #ddd;
margin: 0px;
padding: 2px 4px 6px;
clear: none;
float: left;
height: 32px;
/* width: 778px; */ /* WebCT用 */
width: 952px; /* 物理媒体配布用 */
font-size: 14pt;
}

#contents {
color: #333;
background-color: #fff;
margin: 0px;
padding: 0px;
clear: none;
float: left;
/* height: 596px; */
/* height: 620px; */
/* height: 768px; */
/* height: 712px; */ /* 768 - (32 + 24)  */
/* height: 644px; */ /* 768 - (32 + 92)  */
/* height: 516px; */ /* 768 - (32 + 92 + 128)  */
/* width: 786px; */ /* WebCT用 */
width: 960px; /* 物理媒体配布用 */
border-left: solid 1px #ddd;
border-right: solid 1px #ddd;
}

#foot_bar {
/*color: #c66;*/
color: #777;
text-decoration: none;
/*background-color: #900;*/
background-color: #ddd;
border-left: solid 1px #ddd;
border-right: solid 1px #ddd;
margin: 0px;
padding: 4px;
clear: none;
float: left;
height: 14px;
/* height: 92px;*/
/* width: 778px; */ /* WebCT用 */
width: 952px; /* 物理媒体配布用 */
}

#foot_l {
    clear: none;
    float: left;
    height: 10px;
    font-size: 80%;
}

#foot_r {
    text-align: right;
    clear: none;
    float: right;
    height: 10px;
    font-size: 80%;
}

#foot_c {
clear: none;
float: left;
height: 18px;
}
#foot_c>a {
    text-decoration: none;
    font-size: 12px;
}
#foot_c>a:link {
    color: #6c6;
}
#foot_c>a:visited {
    color: #6c6;
}
#foot_c>a:active {
    color: #6c6;
}
#foot_c>a:hover {
    color: #6c6;
}


/*  */
#contents>form {
    width: 952px; /* 物理媒体配布用 */
    height: 50px;
    clear: none;
    float: left;
}
#radio {
    width: 952px; /* 物理媒体配布用 */
    height: 42px;
    margin: 0px;
    padding: 4px;
    clear: none;
    float: left;
}

#radio>input {
    width: 188px;
}
#radio>label {
    width: 188px;
}

#c_summay {
    /* width: 952px; */ /* 物理媒体配布用 */
    width: auto;
    height: auto;
    margin: 0px;
    padding: 8px 4px 8px 4px;
    clear: none;
    float: left;
}
#c_summay>h3 {
    width: 952px;
    background-color: #ddd;
}


/* */

/* 言語でフォントを変更 */
.quiz_title {
  font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
  font-size: 26px;
  margin: 8px;
}

/* 言語でフォントを変更 */
.quiz_sentense {
  font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
  font-size: 20px;
  margin: 8px;
}

/* 言語でフォントを変更 */
.quiz_sentense2 {
  font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
  font-size: 20px;
  margin: 8px;
}

.quiz_media_area {
  margin: 8px;
}

/* 言語でフォントを変更 */
.quiz_type_area_input {
  font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
  font-size: 20px;
  margin: 8px;
}

/* 言語でフォントを変更 */
.quiz_type_area_input_answer {
  font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
  font-size: 20px;
  margin: 8px;
}

/* 言語でフォントを変更 */
.quiz_type_area_input_hole {
  font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
  font-size: 20px;
}

.quiz_check_button {
  font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
  font-size: 20px;
  margin: 4px;
  float: none;
}

.quiz_correct_incorrect {
  font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
  font-size: 20px;
  margin: 8px;
}

.sortable_style {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

/* 言語でフォントを変更 */
.quiz_sort_items {
	/* font-family: "SimSun", "Hei", "Times New Roman"; */
	/* font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif; */
	font-family: "Times New Roman";
	margin: 2px 2px 2px 0;
	padding: 1px;
	float: left;
	width: 160px;
	height: 60px;
	/* font-size: 3em; */
	font-size: 28px;
	text-align: center;
    color: #000000;
    background-color: #cccccc;
}

.reaction {
	background-image: url(../image/correct.gif);
	background-repeat: no-repeat;
	background-attachment: scroll;
	width: 640px;
	height: 480px;
	overflow: visible;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -200px;
	margin-left: -300px;
	text-align: left;
}

.correct_answer {
    
}

.player {
}

#sortable_area {
  float: left;
  width: 772px; /* 952px - 180px */
}

/* ダミークラス */
.miss_word_block {
}

/* 正解の文字サイズ */
.correct_answer_size {
    font-size: 28px;
}

/* 正解の文字を表示するフォント */
.lang_font {
	font-family: "SimHei", "Hei", "STHeiti", "STHeiti SC", "Arial Unicode MS", sans-serif;
}

/* １件分のデータを格納・表示する枠 */
.list_outer {
    border-radius: 12px; /* CSS3 */
    -moz-border-radius: 12px; /* firefox */
    -webkit-border-radius: 12px; /* Webkit */
    border: 2px green solid;
    background-color: #cfc;
    width: 768px;
    height: 48px;
    padding: 4px 2px 4px 2px;
    margin: 6px;
}


/* １つのタイトルなどの文字の部分 */
.title_name {
    width: 360px;
	font-family: "SimHei", "Hei", "STHeiti", "STHeiti SC", "Arial Unicode MS", sans-serif;
    font-size: 28px;
	float: left;
}

/*  */
.button_array {
    font-size: 16px;
    height: 48px;
}

.button_array>a {
    width: 128px;
}

.movie_dialog {
    width: 528px;
    height: 304px;
}

.audio_dialog {
    width: 528px;
    height: 304px;
}

.content_area {
    margin: 0px;
    padding: 0px;
    clear: none;
    float: left;
    width: 960px; /* 物理媒体配布用 */
    height: auto;
    color: #000;
    background-color: #ccc;
}

.content_title {
    width: 900px; /* 物理媒体配布用 */
    color: #fff;
    background-color: #666;
    margin: 4px 4px 0px 4px;
    padding: 4px 8px 4px 8px;
    text-align: center;
    font-size: 120%;
    border-top-left-radius: 20px;         /* CSS3 */
    border-top-right-radius: 20px;         /* CSS3 */
   -moz-border-radius-topleft: 20px;    /* Firefox */
   -moz-border-radius-topright: 20px;    /* Firefox */
   -webkit-border-top-left-radius: 20px; /* Safari,Chrome */
   -webkit-border-top-right-radius: 20px; /* Safari,Chrome */
}
.content_title>a {
    text-decoration: none;
    color: #fff;
}
.content_title>a:link { color: #fff; }
.content_title>a:visited { color: #fff; }
.content_title>a:hover   { color: #ff0; }
.content_title>a:active  { color: #fff; }
    
/* サブコンテンツのエリア用(一番下用) */
.content_sub {
    width: 910px; /* 物理媒体配布用 */
/*    height: auto;*/
    height: 130px;
    color: #000;
    background-color: #ccc;
    margin: 0px 0px 0px 22px;
    border-left: 3px #666 solid;
    border-right: 3px #666 solid;
    border-bottom: 3px #666 solid;
    font-size: 120%;
    border-bottom-left-radius: 20px;         /* CSS3 */
    border-bottom-right-radius: 20px;         /* CSS3 */
   -moz-border-radius-bottomleft: 20px;    /* Firefox */
   -moz-border-radius-bottomright: 20px;    /* Firefox */
   -webkit-border-bottom-left-radius: 20px; /* Safari,Chrome */
   -webkit-border-bottom-right-radius: 20px; /* Safari,Chrome */
    clear: none;
    float: left;
}

/* サブコンテンツのエリア用 */
.content_sub2 {
    margin: 0px 0px 0px 22px;
    width: 910px; /* 物理媒体配布用 */
/*    height: auto;*/
    height: 128px;
    color: #000;
    background-color: #ccc;
    border-left: 3px #666 solid;
    border-right: 3px #666 solid;
    font-size: 120%;
    clear: none;
    float: left;
}

/* サブコンテンツ(リンクイメージの列)のエリア用 */
.content_sub3 {
    margin: 0px 0px 0px 22px;
    padding: 0px 0px 0px 0px;
    width: 910px; /* 物理媒体配布用 */
/*    height: auto;*/
    height: 80px;
    color: #000;
    background-color: #ccc;
    border-left: 3px #666 solid;
    border-right: 3px #666 solid;
    border-bottom: 3px #666 solid;
    font-size: 120%;
    border-bottom-left-radius: 20px;         /* CSS3 */
    border-bottom-right-radius: 20px;         /* CSS3 */
   -moz-border-radius-bottomleft: 20px;    /* Firefox */
   -moz-border-radius-bottomright: 20px;    /* Firefox */
   -webkit-border-bottom-left-radius: 20px; /* Safari,Chrome */
   -webkit-border-bottom-right-radius: 20px; /* Safari,Chrome */
    clear: none;
    float: left;
}

/* サブコンテンツ(リンクイメージの列)のエリア用(下に続きあり) */
.content_sub4 {
    margin: 0px 0px 0px 22px;
    padding: 0px 0px 0px 0px;
    width: 910px; /* 物理媒体配布用 */
/*    height: auto;*/
    height: 80px;
    color: #000;
    background-color: #ccc;
    border-left: 3px #666 solid;
    border-right: 3px #666 solid;
    font-size: 120%;
    clear: none;
    float: left;
}

/* サブコンテンツ内の画像リンク用エリア */
.content_sub_imglink {
    width: 128px; /* 物理媒体配布用 */
    height: auto;
    color: #000;
    background-color: #ccc;
    margin: 0px;
    padding: 0px;
    clear: none;
    float: left;
}
.content_sub_imglink>a {
    text-decoration: none;
    color: #ccc;
}
.content_sub_imglink>a:link { color: #ccc; }
.content_sub_imglink>a:visited { color: #ccc; }
.content_sub_imglink>a:hover   { color: #ff0; }
.content_sub_imglink>a:active  { color: #fff; }

/* サブコンテンツ内の画像リンク用エリア */
.content_sub_imglink_empty {
    width: 128px; /* 物理媒体配布用 */
    height: 128px;
    color: #000;
    background-color: #ccc;
    margin: 0px;
    padding: 0px;
    clear: none;
    float: left;
}

/* サブコンテンツ内の画像リンク用エリア */
.content_sub_imglink_empty2 {
    width: 128px; /* 物理媒体配布用 */
    height: 64px;
    color: #000;
    background-color: #ccc;
    margin: 0px;
    padding: 0px;
    clear: none;
    float: left;
}

/* サブコンテンツ内の画像リンク用エリア */
.content_sub_subimglink {
    width: 64px; /* 物理媒体配布用 */
    height: 64px;
    color: #000;
    background-color: #ccc;
    margin: 0px;
    padding: 0px 2px 0px 2px;
    clear: none;
    float: left;
}
.content_sub_subimglink>a {
    text-decoration: none;
    color: #ccc;
}
.content_sub_subimglink>a:link { color: #ccc; }
.content_sub_subimglink>a:visited { color: #ccc; }
.content_sub_subimglink>a:hover   { color: #ff0; }
.content_sub_subimglink>a:active  { color: #fff; }

/* サブコンテンツ内のサブタイトル用エリア */
.content_sub_title {
    width: 782px; /* 物理媒体配布用 */
    height: 32px;
    color: #000;
    background-color: #ccc;
    margin: 0px;
    padding: 0px;
    clear: none;
    float: left;
    font-size: 100%;
    text-align: left;
}
.content_sub_title>a {
    text-decoration: none;
    color: #000;
}
.content_sub_title>a:link { color: #000; }
.content_sub_title>a:visited { color: #000; }
.content_sub_title>a:hover   { color: #ff0; }
.content_sub_title>a:active  { color: #000; }

/* サブコンテンツ内のサブタイトル用エリア */
.content_sub_exp {
    width: 581px; /* 物理媒体配布用 */
    height: auto;
    color: #000;
    background-color: #ccc;
    margin: 0px;
    padding: 8px 0px 0px 0px;
    clear: none;
    float: left;
    font-size: 80%;
    text-align: left;
}

/* サブコンテンツ内のサブタイトル用エリア */
.content_sub_exp2 {
    width: 581px; /* 物理媒体配布用 */
    height: auto;
    color: #000;
    background-color: #ccc;
    margin: 0px;
    padding: 8px 0px 0px 128px;
    clear: none;
    float: left;
    font-size: 80%;
    text-align: left;
}

/* サブコンテンツ内のサブタイトル用エリア */
.content_sub_opt {
    width: 190px; /* 物理媒体配布用 */
    height: auto;
    color: #000;
    background-color: #ccc;
    margin: 0px;
    padding: 0px 0px 0px 4px;
    clear: none;
    float: left;
    font-size: 80%;
    text-align: left;
    border-left: solid 3px #999;
}

/* サブコンテンツ内のサブタイトル用エリア(空、高さは直接指定) */
.content_sub_opt2 {
    width: 190px; /* 物理媒体配布用 */
    height: auto;
    color: #000;
    background-color: #ccc;
    margin: 0px;
    padding: 0px 0px 0px 4px;
    clear: none;
    float: left;
    font-size: 80%;
    text-align: left;
}

/* 説明用 */
.exp4lang {
    width: auto;
    height: auto;
    margin: 0px;
    padding: 32px 8px 4px 32px;
    text-align: left;
}