@charset "UTF-8";

/* parts.css */

/* index
┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉

	[1] title(h1~h4)
	[2] list
	[3] box
	[4] font
	[5] table
	[6] width
	[7] link
	[8] other

┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉ */


/* ┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉
	[1] title(h1~h4)
┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉ */

/* ----- none-style ----- */

#contents .none-style{
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	background: none;
	border: none;
}

/* ┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉
	[2] list
┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉ */

/* ----- 基本パターン ----- */
#main ul li,
#main ol li ul li,
#main .list01 li{
	margin-bottom: 5px;
	padding-left: 15px;
	background: url(/img/arrow01.gif) no-repeat 0px 0.5em;
}

#main ul li ul li,
#main ol li ul li ul li,
#main ul.list02 li{
	margin-bottom: 2px;
	padding-left: 12px;
	background: url(/img/arrow02.gif) no-repeat 0px 0.66em;
}

#main .list05 li{
	background: url(/img/icon01.gif) left center no-repeat;
}

/* ----- 下矢印アイコン ----- */
#main ul.list04 li{
	margin-bottom: 10px;
	padding-left: 15px;
	background: url(/img/arrow03.gif) no-repeat 0px 0.5em;
}

/* 下矢印アイコン-二階層目 */
#main ul.list04 li ul li{
	display: inline;
	margin-bottom: 5px;
	padding-left: 15px;
	background: url(/img/arrow05.gif) no-repeat 3px 0.5em;
}

/* ----- ビデオアイコン ----- */
#main ul li.list-video{
	padding-left: 25px;
	background: url(/img/icon_video.gif) no-repeat left center;
}

/* ----- 電話アイコン ----- */
#main ul li.list-phone,
.list-phone{
	padding-left: 25px;
	background: url(/img/icon_phone.gif) no-repeat left center;
}

/* ----- FAXアイコン ----- */
#main ul li.list-fax{
	padding-left: 25px;
	background: url(/img/icon_fax.gif) no-repeat left center;
}

/* ----- mailアイコン ----- */
#main ul li.list-mail{
	padding-left: 25px;
	background: url(/img/icon_mail.gif) no-repeat left center;
}

/* ----- リストアイコン非表示 ----- */

#main ul.icon-no li{
	margin: 0px;
	padding: 0px;
	background: none;
}

/* ----- number アイコン ----- */
#main ul li.list-number01{ background: url(/img/number01.gif) no-repeat left top; }
#main ul li.list-number02{ background: url(/img/number02.gif) no-repeat left top; }
#main ul li.list-number03{ background: url(/img/number03.gif) no-repeat left top; }
#main ul li.list-number04{ background: url(/img/number04.gif) no-repeat left top; }
#main ul li.list-number05{ background: url(/img/number05.gif) no-repeat left top; }

#main ul li.list-number01,
#main ul li.list-number02,
#main ul li.list-number03,
#main ul li.list-number04,
#main ul li.list-number05{
	margin-bottom: 25px;
	padding-left: 25px;
}

#main ul li.list-number01 li,
#main ul li.list-number02 li,
#main ul li.list-number03 li,
#main ul li.list-number04 li,
#main ul li.list-number05 li{
	margin-left: 25px;
	padding: 0px;
	background: none;
}

/* ----- li-横並び ----- */
#main ul.float-li li{
	float: left;
	display: inline;
	width: auto;
	margin-top: 15px;
	margin-right: 5px;
	padding-left: 0;
	background: none;
}

/* ----- li-横並び-矢印付き ----- */
#main .float-li-arrow li{
	float: left;
	display: inline;
	padding-right: 15px;
	white-space:nowrap
}

#main .float-li-arrow li a:link,
#main .float-li-arrow li a:visited,
#main .float-li-arrow li a:hover,
#main .float-li-arrow li a:active{
	display:inline-block;
}

#main .float-li-arrow li a.pdf:link,
#main .float-li-arrow li a.pdf:visited,
#main .float-li-arrow li a.pdf:hover,
#main .float-li-arrow li a.pdf:active,
#main .float-li-arrow li a.ppt:link,
#main .float-li-arrow li a.ppt:visited,
#main .float-li-arrow li a.ppt:hover,
#main .float-li-arrow li a.ppt:active{
	display: inline-block;
	padding: 0 0 0 40px !important;
}

#main .float-li-arrow li a.word:link,
#main .float-li-arrow li a.word:visited,
#main .float-li-arrow li a.word:hover,
#main .float-li-arrow li a.word:active,
#main .float-li-arrow li a.excel:link,
#main .float-li-arrow li a.excel:visited,
#main .float-li-arrow li a.excel:hover,
#main .float-li-arrow li a.excel:active{
	display: inline-block;
	padding: 0 0 0 50px !important;
}

#main .float-li-arrow li a.window:link,
#main .float-li-arrow li a.window:visited,
#main .float-li-arrow li a.window:hover,
#main .float-li-arrow li a.window:active{
	padding: 0 0 3px 20px !important;
}

/* ----- li04-横並び-矢印付き ----- */
#main .float-list04 li{
	float: left;
	display: inline;
	width: auto;
	margin-right: 15px;
	margin-bottom: 10px;
	padding-left: 15px;
	background: url(/img/arrow03.gif) no-repeat 0px 0.5em;
}

#main .float-list04 li a.pdf{
	padding: 0 0 0 40px !important;
}

/* ----- ol ナンバリングをアルファベットに変更 ----- */
#main ol.ol-alpha li{ list-style-type: lower-alpha; }

/* ----- 注意書き (※) ----- */
/* ----- pdf ----- */
p.pdf{
	background: url(/img/icon_pdf.gif) no-repeat left 0.4em;
	margin-bottom: 5px;
	padding-left:40px;
	padding-top:2px;
	font-size: 85%;
}

span.filesize{
	padding: 2px;
	background: #d6d6d4;
	font-size: 85%;
}

/* ----- pdf ----- */
a.pdf{
	background: url(/img/icon_pdf.gif) no-repeat left 0.2em;
	padding: 0 0 0 40px;
}

/* ----- excel ----- */
a.excel{
	background: url(/img/icon_excel.gif) no-repeat left 0.2em;
	padding: 0 0 0 50px;
}

/* ----- word ----- */
a.word{
	background: url(/img/icon_word.gif) no-repeat left 0.2em;
	padding: 0 0 0 50px;
}

/* ----- ppt ----- */
a.ppt{
	background: url(/img/icon_ppt.gif) no-repeat left 0.2em;
	padding: 0 0 0 40px;
}

/* ----- window ----- */
a.window{
	background: url(/img/icon_window.gif) no-repeat left 0.3em;
	padding: 0 0 3px 20px;
}

/* ----- dl01 ----- */
dl.dl01{
	margin-top: 5px;
	margin-bottom: 15px;
	line-height: 1.6;
}

dl.dl01 dt{
	clear: both;
	float: left;
	width: 6em;
	font-weight: bold;
	color: #004cc6;
}

dl.dl01 dd{ padding-left: 6.5em; }

/* ----- dl01-w8em ----- */
dl.dl01-w8em dt{ width: 8em; }
dl.dl01-w8em dd{ padding-left: 9em; }

/* ----- dl01-w14em ----- */
dl.dl01-w14em dt{ width: 14em; }
dl.dl01-w14em dd{ padding-left: 15em; }

/* ----- dl02 ----- */
dl.dl02{
	margin-top: 5px;
	line-height: 1.6;
}

dl.dl02 dt{
	clear: both;
	margin-top: 15px;
	margin-bottom: 15px;
	padding-bottom: 5px;
	padding-left: 18px;
	background: #fff url(/img/bg_point01.gif)  top left no-repeat;
	border-bottom: #ccc solid 1px;
	font-weight: bold;
}

/* ┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉
	[3] box
┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉ */

.box-left{ float: left; width: 47%; }
.box-right{ float: right; width: 47%; }

#sub-contents .box-left h2,
#sub-contents .box-right h2,
#sub-contents .box-left h3,
#sub-contents .box-right h3{
	margin-top: 35px;
	margin-bottom: 15px;
	padding: 8px 0;
	background: none;
	border-top: #004cc6 solid 3px;
	border-bottom: #ccc dotted 1px;
	font-size: 100%;
	font-weight: bold;
}

.box-left p, .box-right p{
	margin-bottom: 10px;
}

.box-left hr, .box-right hr{
	clear: both;
	height: 1px;
	border: none;
	border-top: 1px #ccc solid;
}

.box-grey{
	margin-bottom: 20px;
	padding: 15px;
	background: #eee;
}

.box-blue{
	display: block;	
	margin-bottom: 20px;
	padding: 20px;
	background: #d6ebf9;
	border: #8dcaf2 solid 1px;
}

.box-grey-border{
	margin-bottom: 20px;
	padding: 15px;
	border: 1px #ccc solid;
	background: #eee;
}

.box-white{
	margin-bottom: 20px;
	padding: 20px;
	border: 1px #ccc solid;
	background: #fff;
}

/* ┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉
	[4] font
┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉ */

.red { color: #FF0000; }
.red-bold { color: #FF0000; font-weight: bold; }
.blue { color: #004cc6; }
.blue-bold { color: #004cc6; font-weight: bold; }
.bold { font-weight: bold; }
.italic { font-style: italic; }
.normal { font-style: normal; }
.font-centuryold{ font-family: "Century Old Style" , 'Times New Roman', 'Century Sclool Book', "sans-serif"; }
.no-ime { ime-mode:disabled; }

/* ┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉
	[5] table
┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉ */

table{
	clear: both;
	margin-bottom: 20px;
	width: 100%;
	border-collapse: separate;
	border-spacing: 2px;
}

table thead th, table thead td{
	padding: 5px 8px;
	background-image: none;
	background-color: #004cc6;
	border: solid 1px #043989;
	font-weight: bold;
	color: #fff;
}

table tfoot th, table tfoot td{
	padding: 5px 8px;
	background-image: none;
	background-color: #eee;
	border: solid 1px #ccc;
	font-weight: normal;
}

table th{
	padding: 7px 5px 7px 18px;
	background: #fff url(/img/bg_point01.gif) top left no-repeat;
	border: solid 1px #CCC;
	text-align: left;
	vertical-align: top;
	font-weight: normal;
}

table .tbl-darkblue{
	padding: 5px 8px;
	background-image: none;
	background-color: #004cc6;
	border: solid 1px #043989;
	font-weight: bold;
	color: #fff;
}

table .tbl-blue{
	padding: 5px 8px;
	background-image: none;
	background-color: #d6ebf9;
	border: solid 1px #8dcaf2;
}

table .tbl-gray{
	padding: 5px 8px;
	background-image: none;
	background-color: #eeeeee;
	border: solid 1px #CCC;
}

table td{
	padding: 5px 8px;
	border: solid 1px #CCC;
	background-color: #FFF;
}

/* ┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉
	[6] width
┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉ */

.w-5percent{ width: 5%; }
.w-10percent{ width: 10%; }
.w-15percent{ width: 15%; }
.w-20percent{ width: 20%; }
.w-30percent{ width: 30%; }
.w-35percent{ width: 35%; }
.w-40percent{ width: 40%; }
.w-45percent{ width: 45%; }
.w-50percent{ width: 50%; }
.w-60percent{ width: 60%; }
.w-65percent{ width: 65%; }
.w-70percent{ width: 70%; }

.w-400px{ width: 400px; }
.w-450px{ width: 450px; }

/* ┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉
	[7] link
┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉ */

.link-black a:link,
.link-black a:visited{
	color: #333;
	text-decoration: none;
}

.link-black a:hover,
.link-black a:active{
	color: #004cc6;
	text-decoration: none;
}

/* ┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉
	[8] other
┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉┉ */

#main .layout-pattern01 h3,
#main .layout-pattern01 h4{
	margin-bottom: 0px;
}

#main .layout-pattern01 ul{
	padding: 15px;
	background-color: #eee;
}

/* ----- tab ----- */
#main ul.tab{
	display: inline-block;
	margin-top: 20px;
	border-bottom: #004cc6 solid 1px;
}

/* clearfix */
#main ul.tab:after{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

/* Hides from IE-mac \*/
* html #main ul.tab {height: 1%;}
#main ul.tab {display: block;}
/* End hide from IE-mac */

#main ul.tab li{
	float: left;
	width: auto;
	margin-bottom: 0;
	padding-left: 0;
	background: none;
}

#main ul.tab li a:link,
#main ul.tab li a:visited,
#main ul.tab li a:hover,
#main ul.tab li a:active{
	display: block;
	margin-right: 3px;
	padding: 5px 15px;
	border-top: #ccc solid 1px;
	border-right: #ccc solid 1px;
	border-left: #ccc solid 1px;
	color: #333;
	text-decoration: none;
}

#main ul.tab li a:link,
#main ul.tab li a:visited{ background-color: #eee; }
#main ul.tab li a:hover,
#main ul.tab li a:active{ background-color: #d6ebf9; }

#main ul.tab li.on a:link,
#main ul.tab li.on a:visited,
#main ul.tab li.on a:hover,
#main ul.tab li.on a:active{
	display: block;
	background-color: #004cc6;
	border-top: #004cc6 solid 1px;
	border-right: #004cc6 solid 1px;
	border-left: #004cc6 solid 1px;
	color: #fff;
	font-weight: bold;
	text-decoration: none;
}

/* ----- Scroll Bar ----- */
/* Scroll Bar Master Styling Starts Here */
/* All comments can be freely removed from the css */

.scrollgeneric {
line-height: 1px;
font-size: 1px;
position: absolute;
top: 0; left: 0;
}
.vscrollerbase {
width: 12px;
background-color: #eee;
}
.vscrollerbar {
width: 12px;
background-color: #004cc6;
}
.hscrollerbase {
height: 12px;
background-color: #eee;
}
.hscrollerbar {
height: 12px;
background-color: #004cc6;
}

.scrollerjogbox {
width: 12px;
height: 12px;
top: auto; left: auto;
bottom: 0px; right: 0px;
background-color: gray;
}

/* ----- border ----- */
.border-top-blue{
	clear: both;
	margin-top: 3px;
	padding-top: 5px;
	border-top: 1px #004cc6 solid;
}

.img-border{
	padding: 1px;
	background-color: #ccc;
	border: #eee solid 3px;
}

/* ----- ページャー用ID　pager ----- */
#main ul.pager{
	clear: both;
	padding-top: 35px;
	text-align: center;
}

#main ul.pager li{
	display:inline;
	margin: 0 2px 0 0;
	padding: 0;
	background-color:#fff;
	background-image: none;
	font-size: 85%;
}

ul.pager li a{
	text-decoration:none;
	border:1px solid #ccc;
	padding:1px 7px;
}

ul.pager li a:hover,
ul.pager li a:active{
	color: #004cc6;
	background-color: #d6ebf9;
	border:1px solid #8dcaf2;
}

span.current_page{
	padding:1px 7px;
	background-color: #004cc6;
	border:1px solid #004cc6;
	color: #fff;
	text-decoration: none;
}

/* ----- 戻るリンク用クラス back-page ----- */
#main .back-page a:link,
#main .back-page a:visited,
#main .back-page a:hover,
#main .back-page a:active{
	padding-left: 15px;
	background: url(/img/arrow04.gif) no-repeat 0px 0.5em;
}

/* ----- hidden ----- */
.hidden{
	display: none;
}

/* ----- スタイルリセット ----- */
#sub-contents #main .style-reset{
	float: none;
	margin: 0;
	padding: 0;
	background: none;
	border: none;
}

/* ----- 2011/8/26　大谷追加 ----- */
/* ----- 注意 ----- */
.caution {
background: url(/lesson/img/bg_caution.gif) 5px 3px no-repeat #eee;
}

.caution dt{
	clear:both;
	float:left;
	padding: 2px 0 0 30px;
	width: 4em;
	font-weight: bold;
	color: #f30;
}

.caution dd {
	padding-top: 2px;
	padding-left: 7em;
}

/* ----- 予備知識----- */
.bg_knowledge {
	background-image: url(/lesson/img/bg_knowledge.gif) ;
  background-position: 0px 0px;
  background-repeat:no-repeat;
  margin-top:25px;
  margin-bottom:10px;
}


.bg_knowledge dt{
	clear:both;
	float:left;
	padding: 2px 0 0 10px;
	width: 5em;
	font-weight: bold;
	color: #004cc6;
}

.bg_knowledge dd {
	padding-top: 2px;
	padding-left: 7em;
}

/* ----- lang ----- */
dl.lang{
	margin-top: 5px;
	margin-bottom: 15px;
	line-height: 1.6;
}

dl.lang dt{
	clear: both;
	float: left;
	width: 8em;
	font-weight: bold;
	color: #004cc6;
}

dl.lang dd{ padding-left: 8.5em; }

