@charset "utf-8";
/*reset*/
/*******************************************************************/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,select,textarea,p,blockquote,th,td { margin: 0; padding: 0;}
address,caption,cite,code,dfn,em,strong,th,var { font-style: normal;}
table { border-collapse: collapse; border-spacing: 0;}
object,embed { vertical-align: top;}
hr,legend { display: none;}
h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight: normal;}
img { border: 0; vertical-align: bottom;}
ol, ul { margin: 0;}
a:link { color: #163053; text-decoration: underline;}
a:visited { color: #163053; text-decoration: none;}
a:hover { color: #E30D02; text-decoration: none;}
a:active { color: #163053; text-decoration: none;}
.center { text-align: center;}
.fr { float: right;}
.fl { float: left;}
.clear { clear: both;}
.right { text-align: right;}
strong { font-size: 108%; color: #0162A9;}
.large { font-size: 138.5%;}
.small { font-size: 80.0%;}


/*LAYOUT*/
/*******************************************************************/
body { text-align: center; background: #EDEDED url(../images/back.gif) center 0 repeat-x; font: 81.25% "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; color: #222;}
#container { text-align: left; font-size: 100%; line-height: 1.8;}
#wrap { width: 980px; margin: 0 auto; background: url(../images/in.jpg) 0 0 repeat-y;}
#main { padding: 40px; background: url(../images/top.jpg) 0 0 no-repeat;}
#header, #bread, .in { position: relative; width: 960px; margin: 0 auto;}


/*HEADER*/
/*******************************************************************/
#header { position: relative; height: 160px; margin-bottom: 10px; z-index: 10;}
h1, #header p { padding: 5px 0; font-size: 85%;}
#logo { position: absolute; top: 62px; left: 0;}
#header p { position: absolute; top: 0; right: 0;}
#header dl { position: absolute; top: 58px; right: 0;}
#header dt, #header dd { float: left;}
#header > ul { position: absolute; top: 132px; left: 0;}
#header > ul > li { position: relative; float: left; list-style: none;}
#header > ul > li > a { height: 28px; background-image: url(../images/btn.gif);}
#header > ul > li#btn01 > a { width: 117px; background-position: 0 0;}
#header > ul > li#btn02 > a { width: 116px; background-position: -117px 0;}
#header > ul > li#btn03 > a { width: 130px; background-position: -233px 0;}
#header > ul > li#btn04 > a { width: 130px; background-position: -363px 0;}
#header > ul > li#btn05 > a { width: 130px; background-position: -493px 0;}
#header > ul > li#btn06 > a { width: 116px; background-position: -623px 0;}
#header > ul > li#btn07 > a { width: 102px; background-position: -739px 0;}
#header > ul > li#btn08 > a { width: 119px; background-position: -841px 0;}
#header > ul > li#btn01 > a:hover, #header > ul > li#btn01 > a.current { background-position: 0 -28px;}
#header > ul > li#btn02 > a:hover, #header > ul > li#btn02 > a.current { background-position: -117px -28px;}
#header > ul > li#btn03 > a:hover, #header > ul > li#btn03 > a.current { background-position: -233px -28px;}
#header > ul > li#btn04 > a:hover, #header > ul > li#btn04 > a.current { background-position: -363px -28px;}
#header > ul > li#btn05 > a:hover, #header > ul > li#btn05 > a.current { background-position: -493px -28px;}
#header > ul > li#btn06 > a:hover, #header > ul > li#btn06 > a.current { background-position: -623px -28px;}
#header > ul > li#btn07 > a:hover, #header > ul > li#btn07 > a.current { background-position: -739px -28px;}
#header > ul > li#btn08 > a:hover, #header > ul > li#btn08 > a.current { background-position: -841px -28px;}
#header > ul > li ul { pointer-events: none; opacity: 0; box-shadow: 0 5px 5px rgba(0,0,0,.16); position: absolute; top: 100%; left: 0; width: 100%; list-style: none;  background: #FFF; color: #222; transition: .2s ease-out;}
#header > ul > li:hover ul { pointer-events: auto; opacity: 1;}
#header > ul > li ul a { display: block; padding: 4px 10px; border-top: 1px solid #CCC; text-decoration: none; font-weight: bold;}
#bread { font-size: 85%;}


/*FOOTER*/
/*******************************************************************/
#footer { clear: both; background: #F5F5F5 url(../images/footer.gif) 0 0 repeat-x;}
#footer .in { padding: 20px 0;}
#footer h5 { float: left; padding-right: 15px; font-weight: bold;}
#footer p { display: block; float: left; padding-bottom: 15px; font-size: 85%; line-height: 1.6;}
#footer a { text-decoration: none;}
#footer .pt { position: absolute; top: 0; right: 0;}
#sitemap { clear: both; margin: 15px 0; padding-top: 15px; background: url(../images/line.gif) 0 0 repeat-x;}
#sitemap dl { float: left; padding: 0 15px; background: url(../images/vline.gif) 0 0 repeat-y; font-size: 93%;}
#sitemap dt { padding: 0 0 5px 10px; background: url(../images/arrow.gif) 0 6px no-repeat; font-weight: bold;}
#sitemap dd { float: left; padding: 0 5px;}
#sitemap dd div { padding-left: 15px; background: url(../images/dot.gif) 0 4px no-repeat;}
#sitemap dd ol { margin-left: 20px;}
#sitemap dd li { list-style: circle; font-size: 93%;}
#footer address { padding-top: 15px; text-align: center; background: url(../images/line.gif) 0 0 repeat-x; font-size: 77%;}


/*SIDE*/
/*******************************************************************/
#aside { float: right; width: 270px;}
.info { position: relative; padding-bottom: 20px;}
.info div { position: absolute; top: 190px; left: 27px;}
.info div img { padding-bottom: 10px;}
.banner li { padding-bottom: 20px; list-style: none;}
#aside h4 a { display: block; padding: 5px 10px; background: #323134; font-size: 108%; font-weight: bold; text-decoration: none; color: #FFF;}
.menu { margin-bottom: 20px; background: url(../images/menu.png) 0 0 no-repeat;}
.menu li { list-style: none;}
.menu li a, .menu li h5 { display: block; margin-bottom: 0!important; padding: 6px 0 6px 20px; background: #EDEDED url(../images/off.gif) 10px center no-repeat; border-top: #FFF solid 1px; border-bottom: #D8D8D8 solid 1px; color: #000;}
.menu li a:hover, .menu li a.current,
.menu li h5:hover, .menu li h5.current { background: #E30D02 url(../images/on.gif) 10px center no-repeat; color: #FFF;}
.menu li ol { margin-bottom: 5px; border-right: #CCC solid 1px; border-left: #CCC solid 1px;}
.menu li li a { display: block; padding: 6px 0 6px 36px; background: #FFF url(../images/soff.gif) 20px center no-repeat; border-top: #FFF solid 1px; border-bottom: #D8D8D8 solid 1px; color: #000;}
.menu li li a:hover, .menu li li a.current { background: #FFF url(../images/son.gif) 20px center no-repeat; color: #163053;}


/*MAIN*/
/*******************************************************************/
#contents { float: left; width: 600px;}
h2 { margin-bottom: 30px;}
h2.st { height: 100px; padding-left: 30px; background: url(../images/title.jpg) 0 0 no-repeat; line-height: 4; font-size: 197%; letter-spacing: 0.2em; color: #FFF;}
h3 { margin-bottom: 10px;}
h3.st { height: 34px; margin-bottom: 15px; padding-left: 15px; background: url(../images/sub.jpg) 0 0 no-repeat; line-height: 2.2; font-size: 116%; font-weight: bold; letter-spacing: 0.2em;}
h3.st span { font-size: 77%; font-weight: normal; letter-spacing: 0;}
h4.st { margin-bottom: 10px; padding: 0 10px; background: #EDEDED; border-left: #E30D02 solid 7px; font-size: 108%; font-weight: bold;}
#contents p { margin-bottom: 30px;}
.ol, .ul { margin: 0 0 30px 30px;}
.ts { width: 100%; margin-bottom: 40px; border-top: #999 solid 1px; border-left: #999 solid 1px;}
.ts th, .ts td { padding: 6px 10px; border-right: #999 solid 1px; vertical-align: middle; line-height: 1.4;}
.ts th { text-align: left; background: #E5E5E5; border-bottom: #999 solid 1px; color: #000; font-size: 93%; font-weight: bold;}
.ts td { border-bottom: #999 solid 1px;}
.ts td.dot { border-bottom: #CCC dotted 1px;}
.ts td.dotr { border-right: #CCC dotted 1px;}


/*index*/
.harf { width: 435px;}
.harf2 { width: 265px;}
.list h4 { padding-bottom: 5px;}
.list li { float: left; width: 200px; height: 132px; margin-left: 35px; list-style: none;}
.list ol li { float: none; width: auto; height: auto; margin: 0; font-size: 93%;}
.list ol li a, .arrow li a { display: block; padding-left: 14px; background: url(../images/arrow.gif) 2px 6px no-repeat; color: #000;}
.list ol li a:hover, .arrow li a:hover { background-color: #E30D02; color: #FFF;}
.list li.first { clear: left; margin-left: 0;}
.topics { clear: both; margin-bottom: 24px; line-height: 1.4;}
.topics dt { float: left; width: 80px; padding: 4px 0 4px 15px; background: url(../images/dot.gif) 0 5px no-repeat; font-size: 85%; color: #163053;}
.topics dd { padding: 4px 0 4px 100px; border-bottom: #CCC dotted 1px;}
.topics dd a { font-weight: bold;}
.topics dd span { display: block; font-size: 85%; color: #666;}
.greeting { font-size: 93%;}


/*page*/
.arrow { padding-bottom: 20px;}
.arrow li { margin-bottom: 6px; padding-bottom: 6px; background: url(../images/line.gif) 0 bottom repeat-x; list-style: none;}
.arrow li p { margin: 0 0 0 14px!important; font-size: 85%; color: #666;}
.space li { clear: both; margin-bottom: 15px; padding-bottom: 15px; background: url(../images/line.gif) 0 bottom repeat-x; list-style: none;}
.space .fr { padding-left: 15px;}
form .long { width: 500px;}
.attention { color: #F00;}
.line { margin-top: 50px; padding-top: 50px; border-top: #E30D02 solid 4px;}


/*HACK*/
/*******************************************************************/
/*indent*/
#header > ul > li > a, .btn a { display: block; background-repeat: no-repeat; text-indent: -9999px; overflow: hidden;}

/*clear*/
.space li, .cf { display: inline-block;}
.space li:after, .cf:after { content: "."; clear: both; display: block; height: 0; visibility: hidden;}
/*Hides from IE-mac\*/
* html .space li, * html .cf {height:1%;}
.space li, .cf { display:block;}
/*End hide from IE-mac*/
