@charset "UTF-8";

/* INDEX
==============================================
 01 Header style
 02 navi style
 03 crumb style
 04 headline style
 05 main contents style
    --> about us
    --> service
    --> contact
 06 English page
============================================== */

body {
width:750px;
}

/* 01 Header style
------------------------------------------------------------------*/
#page .header {
background:url(../img/bg_header.png) 0 -93px repeat-x;
position:relative;
height:100px;
}

#page .header h1 {
background:url(../img/tl_logo2.png) 0 0 no-repeat;
position:absolute; bottom:5%; right:5%;
width:255px;
}

#page .header h1 a {
display:block;
padding-top:80px;
overflow:hidden;
height:0;
}

#page .header p.copy {
background:url(../img/tl_copy2.png) 0 0 no-repeat;
padding-top:20px;
position:absolute; top:5%; left:2%;
overflow:hidden;
height:0;
width:470px;
z-index:1;
}

/* 02 navi style
------------------------------------------------------------------*/
div.navi {
background:url(../img/bg_navi.png) 0 0 repeat-x;
padding-right:20px;
height:35px;
}

div.navi ul {
float:right;
}

div.navi ul li {
float:left;
margin-right:-1px;
width:95px;
}
div.navi ul li.last {
margin-right:0;
}


div.navi ul li.about {
background:url(../img/navi_about.png) 0 0 no-repeat;
}
div.navi ul li.service {
background:url(../img/navi_service.png) 0 0 no-repeat;
}
div.navi ul li.tips {
background:url(../img/navi_tips.png) 0 0 no-repeat;
}
div.navi ul li.blog {
background:url(../img/navi_blog.png) 0 0 no-repeat;
}
div.navi ul li.contact {
background:url(../img/navi_contact.png) 0 0 no-repeat;
}
div.navi ul li.products {
background:url(../img/navi_products.png) 0 0 no-repeat;
}


div.navi ul li a {
display:block;
overflow:hidden;
height:0;
}
div.navi ul li a:link,
div.navi ul li a:visited {
padding-top:31px;
}
div.navi ul li a:hover,
div.navi ul li a:active {
padding-top:35px;
}
div.navi ul li.on a {
padding-top:35px;
}

/* 03 crumb style
------------------------------------------------------------------*/
#crumb { padding:10px 20px; }

#crumb li {
background:url(../img/pt_crumb.png) right no-repeat;
float:left;
padding:0 15px 0 5px;
}

#crumb li.last {
background:none;
padding-right:0;
}

#crumb li a { color:#333; }

#crumb li a:link,
#crumb li a:visited { text-decoration:none; }

#crumb li a:hover,
#crumb li a:active { text-decoration:underline; }


/* 04 headline style
------------------------------------------------------------------*/
#page_main h2 {
margin-bottom:1em;
overflow:hidden;
height:0;
}

#page_main h2.about { 
background:url(../img/h2_about.png) 0 0 no-repeat;
padding-top:55px;
width:550px;
}
#page_main h2.service {
background:url(../img/h2_service.png) 0 0 no-repeat;
padding-top:55px;
width:550px;
}
#page_main h2.contact {
background:url(../img/h2_contact.png) 0 0 no-repeat;
padding-top:55px;
width:550px;
}
#page_main h2.link {
background:url(../img/h2_link.png) 0 0 no-repeat;
padding-top:55px;
width:550px;
}
#page_main h2.license {
background:url(../img/h2_license.png) 0 0 no-repeat;
padding-top:55px;
width:550px;
}

#page_main h2.bbtheme {
background:url(../img/h2_underline.png) bottom no-repeat;
font-size:18px;
padding:0 0 10px 10px;
margin-top:1em;
line-height:1.2;
height:inherit;
}


/* 05 main contents style
------------------------------------------------------------------*/
#page_main { margin:20px auto 60px; }

#page div.about {
background:url(../img/img_about.png) bottom no-repeat; padding-bottom:210px;
width:550px;
}
#page div.service { 
background:url(../img/img_service.png) bottom no-repeat; padding-bottom:210px;
width:550px;
}
#page div.contact {
background:url(../img/img_contact.png) bottom no-repeat; padding-bottom:210px;
width:550px;
}
#page div.link {
width:550px;
}
#page div.license {
width:550px;
}
#page div.bbtheme {
width:650px;
}



/* ----- about us ----- */
#page div.about dl { width:500px; margin:0 auto 30px; }

#page div.about dt,
#page div.about dd { float:left; padding-bottom:1em; font-size:1.1em; }

#page div.about dt { width:80px; float:left; text-align:right; }
#page div.about dd { width:350px; padding-left:1em; float:left; }

/* ----- service ----- */
#page div.service dl { width:450px; margin:0 auto 30px; }

#page div.service dt {
background:url(../img/pt_arrow.png) 0 center no-repeat;
padding-left:20px;
font-weight:bold;
color:#333;
}
#page div.service dd { padding-left:3em; margin-bottom:2em; }

#page div.service ul { padding-left:20px; margin: 5px 0; }
#page div.service ul li { list-style:circle; }

/* ----- contact ----- */

/* ----- link ----- */
#page div.link a {
color:#990033;
text-decoration:underline;
}

#page div.link h3 { 
background:url(../img/pt_arrow.png) 0 5px no-repeat;
color:#000000;
margin-bottom:0.5em;
padding-left:15px;
}

#page div.link p { margin-top:0.5em; }

#page div.link div.ad { margin-bottom:2em; padding:0; }

/* ----- license ----- */
#page div.license h3 { 
background:url(../img/pt_arrow.png) 0 5px no-repeat;
color:#222;
margin-bottom:0.5em;
padding-left:15px;
}

#page div.license p { margin:0.5em 0 2em 1em; }

/* bb theme*/
#page div.bbtheme h3 { 
background:url(../img/pt_arrow.png) 0 5px no-repeat;
color:#222;
margin-bottom:0.5em;
padding-left:15px;
}

#page div.bbtheme h4 { 
background:url(../img/pt_arrow_m.png) 0 5px no-repeat;
color:#222;
margin-bottom:0.5em;
padding-left:10px;
}

#page div.bbtheme p.url {
background:#ffc;
border:1px #ff9 solid;
padding:3px;
}

#page div.bbtheme p.attention {
background:#fff0ff;
border:1px #f99 solid;
padding:3px;
}

#page div.bbtheme div.pagetop {
text-align:right;
font-weight:bold;
}


#page div.bbtheme ul li {
list-style:disc;
margin-bottom:1em;
}

#page div.bbtheme ol li ul li {
list-style:disc;
margin:0.4em 0 0.2em;
}



#page div.bbtheme ol,
#page div.bbtheme ul {
padding-left:30px;
}

#page div.bbtheme ol li {
list-style:decimal;
margin-bottom:1em;
}

#page div.bbtheme img {
border:3px #ccc solid;
}

#page div.bbtheme a {
font-weight:bold;
text-decoration:underline;
}



/* 06 English page
------------------------------------------------------------------*/
div#page_main_en {
margin:10px 20px 30px;
}

div.about_en {
background:url(../img/img_about_en.png) top no-repeat;
padding-top:170px;
}

#page_main_en h2.about_en {
background:url(../img/h2_underline.png) bottom no-repeat;
font-size:18px;
padding:0 0 10px 10px;
margin-top:1em;
line-height:1.2;
}