@import "/common/css/suggest.css";



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

公文日本語教室　各国共通スタイルの設定

/jpn/common/css/common.css



09.08.24

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



/* HEADER ------------------------------------- */



#pageheader {

	padding-bottom: 17px;

	border-bottom: 3px solid #7DCDF4;

}



/* 共通クラス --------------------------------- */



/*-- TABLE --*/



table.Basic th,

table.Basic td {

	background: #FFFFFF;

}



/*-- TR 縦方向の揃え --*/



table tr.vtop th,

table tr.vtop td {

	vertical-align: top;

}



/*-- TR 行揃え --*/



table tr.cener th,

table tr.center td {

	text-align: center;

}



table tr.left th,

table tr.left td {

	text-align: left;

}



table tr.right th,

table tr.right td {

	text-align: right;

}



/*-- セル 行揃え --*/



table tr th.center,

table tr td.center {

	text-align: center;

}



table tr th.left,

table tr td.left {

	text-align: left;

}



table tr th.right,

table tr td.right {

	text-align: right;

}



/*-- TITLE --*/

h1 {color: #00A0E9; margin-bottom: 10px; border-bottom: 2px solid #7DCDF4; font-size: 185.75%; line-height: 200%;}

h2 {color: #333333; margin-top: 15px; font-size: 150%; line-height: 150%;}

h3 {color: #00b3d5; margin-top: 15px; font-size: 114.5%; line-height: 120%;}

h4 {color: #333333; margin-top: 10px; font-size: 107.5%; line-height: 120%;}

h5 {color: #00A0E9; margin-top: 7px; font-size: 100%; line-height: 120%;}



h1.nrm {border: none;}



/*-- PARAGRAPH --*/



p {font-size: 100%; line-height: 140%;}

#contentMain p {margin-top: 7px;}



/*-- CLASS --*/



.SS {font-size: 77%; line-height: 100%;}

.S {font-size: 85.75%; line-height: 120%;}

.M {font-size: 100%; line-height: 140%;}

.L {font-size: 114.5%; line-height: 180%;}

.LL {font-size: 150%; line-height: 180%;}



/* テキストの装飾 */



strong {

	font-weight: bold;

}



em {

	color: #00A0D2;

	font-style: normal;

}



ul,

ol,

li,

dl,

dt,

dd,

form {

	margin: 0;

	padding: 0;

}



ul,

ol {

	list-style: none;

}



/* HR */



hr {

	border-width: 1px 0px 0px 0px;

	border-style: solid;

	border-color: #CCCCCC;

	height: 1px;

}

.WN {font-weight: normal;}

.c_grn {color: #557630;}

.c_sky {color: #00B3D5;}



/* 汎用クラス --------------------------------- */



/* columns */



*.col-l {

	/* 横幅は適宜指定 */

	float: left;

}



*.col-r {

	/* 横幅は適宜指定 */

	float: right;

}



/* columns */



*.cut-l {

	/* 横幅は適宜指定 */

	margin: 0 20px 12px 0;

	float: left;

}



*.cut-r {

	/* 横幅は適宜指定 */

	margin: 0 0 10px 20px;

	float: right;

}



/* 並列リスト */



ul.row,

dl.row {

	display: inline-block;

}



ul.row,

dl.row {

	/* \*/

	display: block;

	/*  */

}



ul.row:after,

dl.row:after {

	height: 0;

	visibility: hidden;

	display: block;

	clear: both;

	content: ".";

}



ul.row li,

dl.row dt,

dl.row dd {

	width: auto;

	float: left;

	/* for Windows Internet Explorer 5.5 */

	voice-family: "\"}\"";

	voice-family: inherit;

	white-space: nowrap;

}



/* clear */



*.clear {

	clear: both;

}



/* clearfix */



#langNavi,

#globalNavi,

#pagebody,

div.intro,

div.section,

*.clearfix {

	display: inline-block;

}



#langNavi,

#globalNavi,

#pagebody,

div.intro,

div.section,

*.clearfix {

	/* \*/

	display: block;

	/*  */

}



#langNavi:after,

#globalNavi:after,

#pagebody:after,

div.intro:after,

div.section:after,

*.clearfix:after {

	height: 0;

	visibility: hidden;

	display: block;

	clear: both;

	content: ".";

}



/* 矢印アイコン付きリンク */



p.arr {

	text-indent: -16px;

	padding-left: 16px;

	font-size: 100%;

	line-height: 150%;

}



p.arr img.ico {

	position: relative;

	top: -2px;

}



/* 矢印アイコン付きリンク（通常ピンク） */



ul.arr li {

	background: url(/common_new/images/ico_arrow_pink_circle.gif) no-repeat 0 0.25em;

	margin-top: 3px;

	padding-left: 14px;

}



/* 前の画面に戻る */



ul.ftPrev {

	margin-top: 20px;

	padding-top: 7px;

	border-top: 2px solid #D6D6D6;

}



ul.ftPrev li,

ul.prev li {

	background: url(/common_new/images/ico_arrow_pink_circle_left.gif) no-repeat 0 0.25em;

	margin-top: 3px;

	padding-left: 14px;

}



/* 矢印アイコン付きリンク（グレイ） */



ul.arrGray li {

	background: url(/common_new/images/ico_arrow_gray_circle.gif) no-repeat 0 0.25em;

	margin-top: 3px;

	padding-left: 14px;

}



/* icon */



img.ico {

	margin-right: 5px;

	vertical-align: text-bottom;

}



/* notice */



*.notice {

	color: #557630;

	font-weight: bold;

}



#contentMain ul.notice {

	padding: 10px 0 0 20px;

	list-style: disc;

}



/* return */



*.return {margin-top: 10px;}



/* section */



div.section {

	margin-bottom: 15px;

}



/* headerNavi --------------------------------- */



/* langNavi */



#langNavi {

	background: #DFF2FC;

	margin: 1px 0;

	padding: 3px 15px;

	width: 870px;

}



#langNavi li {

	margin: 0 0 0 15px;

	float: right;

}



#langNavi img {

	display: block;

}



/* globalNavi */



#globalNavi {

	background: #00A0E9;

	width: 900px;

}



#globalNavi li {

	float: left;

}



#globalNavi img {

	vertical-align: top;

}



/* contentMain -------------------------------- */



#pagebody {

	margin-top: 20px;

	width: 900px;

}



#pagebody #contentMain {

	width: 684px;

	float: left;

}



/* contentNavi -------------------------------- */



#pagebody #contentNavi {

	width: 196px;

	float: right;

}



/* 資料請求・よくある質問・お問い合わせエリア */



#contentNavi #rnCmn {

	background: #F3F3F3 url(../images/bg_rn_upper.gif) no-repeat;

	margin: 0 0 10px;

	padding: 5px 0 0;

}



#contentNavi #rnCmn img {

	vertical-align: top;

}



#contentNavi #rnCmn div.inner {

	background: url(../images/bg_rn_lower.gif) no-repeat 0 100%;

	margin: 0;

	padding: 0 5px 5px;

}



/* 資料請求 */



#contentNavi #rnCmn div.rnRequest {

	background: #FEDB4F url(../images/rn_bg_request.gif) no-repeat;

}



#contentNavi #rnCmn img.rnReq {

	margin: 7px 5px 7px;

}



/* よくある質問・お問い合わせボタン */



#contentNavi #rnCmn img.rnCmnBtn {

	margin-top: 7px;

}





/* FreeCall */



#contentNavi div.freeCall {

	background: url(../images/bg_rn_fc_upper.gif) no-repeat;

	padding-top: 10px;

}



#contentNavi div.freeCall div.inner {

	background: url(../images/bg_rn_fc_lower.gif) no-repeat 0 100%;

	margin-bottom: 10px;

	padding-bottom: 10px;

}



#contentNavi div.freeCall h3 {

	margin-bottom: 7px;

}



#contentNavi div.freeCall p {

	margin: 0 10px;

	font-size: 85.75%;

	line-height: 140%;

}



#contentNavi div.freeCall p.fc {

	color: #557630;

	padding: 0 0 5px 0;

}



#contentNavi div.freeCall p.fc strong {

	font-size: 185.75%;

	font-family: arial,helvetica,Trebuchet MS;

	line-height: 110%;

}



#contentNavi div.freeCall span.fctxt {

	text-align: center;

	display: block;

}



/* バナー */



#pagebody #contentNavi div.bnr {

	margin-bottom: 10px;

	display: block;

}



#pagebody #contentNavi div.bnr.rear {

	margin: 0;

}



#contentNavi div.bnrarea {

	padding-bottom:10px;

}





/* Company */



#pagebody #contentNavi div.rnCompany {

	background: #F3F3F3;

	margin-bottom: 10px;

	padding: 15px 10px;

}



#pagebody #contentNavi div.rnCompany h3 {

	color: #557630;

	background: url(../images/hr.gif) no-repeat 0 100%;

	margin: 0 0 7px;

	padding-bottom: 7px;

}



#pagebody #contentNavi div.rnCompany p {

	margin-top: 3px;

	font-size: 85.75%;

	line-height: 140%;

}



#pagebody #contentNavi div.rnCompany ul.arrGray {

	margin-top: 7px;

}



/* popup -------------------------------------- */



#popup #contentMain {

	margin: 10px 15px;

	width: 684px;

}



/* 教室だよりクイズ */

#popup h2.quiz img {

	vertical-align:text-top;

}

#popup .translation {

	font-size:108%;

	padding:3px 0 0 28px;

}

#popup .quiztop {

	text-align:center;

	padding-top:20px;

}

#popup ol.quizlist {

	padding-top:15px;

}

#popup ol.quizlist li {

	display:inline;

	padding-right:25px;

}

#popup ol.quizlist li strong {

	font-weight:bold;

	color:#00a0e9;

}

#popup ruby rt {

	font-weight:normal;

}

#popup .quizbottom {

	background:#F5F2E8;

	padding:20px;

	margin-top:20px;

	width:644px;

}

#popup .quizbottom .readtxt {

	color:#557630;

	font-size:107%;

	font-weight:bold;

}

#popup .quizbottom table.quiztable {

	margin:20px 0 0 80px;

}

#popup table.quiztable th {

	padding:8px 15px 5px;

}

#popup table.quiztable td {

	font-weight:bold;

	font-size:107%;

	width:350px;

}

#popup table.quiztable th input {

	width:35px;

	margin-top:2px;

	text-align:center;

	font-weight:bold;

	color:#00a0e9;

}

#popup .submitBtn {

	text-align:center;

	padding-top:20px;

}

#popup .submitBtn input {

	width:160px;

	margin:0 auto;

}

#popup .inputerror {

	background-color: #FFC0C0;

	padding-bottom:10px;

	margin-top:10px;

}

#popup #confirmation {

	display:block;

}

#popup #correct {

	display:none;

	text-align:center;

	font-size:150%;

	color:#00a0e9;

	padding-top:140px;

	font-weight:bold;

	line-height:1.6;

}

#popup #correct input {

	margin-top:150px;

	width:100px;

}

#popup .quizbottom .txtquestion {

	color:#00a0e9;

}

#popup .quizbottom .txtbox {

	text-align:center;

	padding:15px 0;

}

#popup .quizbottom .inbox {

	padding-bottom:10px;

	margin-top:10px;

}

#popup .quizbottom .txtbox input {

	width:100px;

	padding:10px 0;

	color:#00A0E9;

	text-align:center;

	font-size:18px;

}





/*-- TITLE --*/

#popup #contentMain h1 {color: #00A0E9; margin-bottom: 10px; border-bottom: 2px solid #7DCDF4; font-size: 150%; line-height: 150%;}

#popup #contentMain h2 {color: #333333; margin-top: 15px; font-size: 114.5%; line-height: 120%;}

#popup #contentMain h3 {color: #00b3d5; margin-top: 15px; font-size: 107.5%; line-height: 120%;}

#popup #contentMain h4 {color: #333333; margin-top: 10px; font-size: 100%; line-height: 120%;}

#popup #contentMain h5 {color: #00A0E9; margin-top: 7px; font-size: 85.75%; line-height: 120%;}





/* notice */



#contentMain ul.notice li {

	margin-top: 1em;

}



/* note */



.note {

	color: #FF0000;

}