/* M+ FONTS BASICS :::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

#home
{
background-color: rgb(102, 102, 102);
}

#about
{
background-color: rgb(206, 203, 200);
}

#design
{
background-color: rgb(165, 195, 165);
}

#about body,
#design body
{
color: #555;
font-family:
"M+ C Type-1 (basic latin) Regular",
"M+ Type-1 (general-j) Regular", sans-serif;
font-size: 90%;
line-height: 190%;
}

body
{
margin: 0;
}

a:link,
a:visited
{
color: #FFF;
text-decoration: none;
}

a:hover
{
color: #999;
}

a:active
{
opacity: 0.0;
}

/* ELEMENTS ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

sup
{
line-height: 0%;
}

ul
{
list-style-type: none;
padding-left: 0;
}

h1,
h2
{
color: #888;
font-weight: normal;
letter-spacing: 0.02em;
line-height: 100%;
}

h1
{
font-family: "M+ C Type-1 (basic latin) Black";
font-size: 110%;
margin-bottom: 2.5em;
}

#about h1
{
margin-top: 5em;
}

#design h1
{
margin-top: 0;
}

h2
{
font-family: "M+ C Type-1 (basic latin) Black";
font-size: 100%;
margin-bottom: 1.6em;
margin-top: 2.5em;
}

pre
{
background-color: rgb(124, 124, 124);
color: #CCC;
font-family: "M+ MN Type-1 (basic latin) Regular";
padding: 1em;
}

/* LOGOTYPE ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

a:hover img.logo_about
{
opacity: 0.5;
}

div.logotype
{
margin: auto;
width: 600px;
}

#home div.logotype
{
position: absolute; right: 0; left: 0;
text-align: center;
}

#about div.logotype,
#design div.logotype
{
position: absolute; right: 0; left: 200px;
text-align: left;
}

/* SPECS :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

div.mplus_specs,
div.download
{
font-family: "M+ C Type-1 (basic latin) Black";
}

div.mplus_specs
{
font-size: 8pt;
letter-spacing: 0.04em;
line-height: 100%;
margin-top: 0.4em;
white-space: nowrap;
}

#home div.mplus_specs,
#home div.download
{
display: none;
}

#home div.mplus_specs a:link,
#home div.mplus_specs a:visited
{
color: rgb(204, 202, 200);
}

#about div.mplus_specs a:link,
#about div.mplus_specs a:visited,
#design div.mplus_specs a:link,
#design div.mplus_specs a:visited
{
color: rgb(102, 102, 102);
}

#home div.mplus_specs a:hover,
#home div.download a:hover,
#about div.mplus_specs a:hover,
#design div.mplus_specs a:hover
{
color: #FFF;
}

#home div.mplus_specs a:hover
{
font-size: 120%;
line-height: 0%;
}

#home div.download
{
font-size: 12pt;
letter-spacing: 0.1em;
margin-top: 7.0em;
}

#home div.download a
{
border-bottom: 4px solid #DDD;
padding-bottom: 0.2em;
}

#home div.download a:hover
{
letter-spacing: 0.2em;
}

/* LANG ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

ul.choose_lang
{
font-family: "M+ P Type-1 (basic latin) Bold";
font-size: 12pt;
letter-spacing: 0.4em;
line-height: 400%;
margin-top: 3.0em;
}

#home ul.choose_lang a:hover
{
color: #FFF;
}

li.choose
{
color: #333;
font-size: 8pt;
letter-spacing: 0.2em;
}

/* NAVIGATION ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

div.navi
{
line-height: 210%;
position: fixed; top: 204px; left: 2em;
}

#design div.navi
{
line-height: 256%;
}

div.navi span.lang,
span.free_download
{
font-family: "M+ C Type-1 (basic latin) Black";
letter-spacing: 0.02em;
}

div.navi ul
{
font-size: 90%;
margin-bottom: 3.0em;
}

#about div.navi ul
{
margin-top: 1.0em;
}

#design div.navi ul
{
margin-top: 1.24em;
}

span.free_download a
{
border-bottom: 4px solid #EEE;
font-size: 120%;
padding-bottom: 0.2em;
}

ul.contents a:link,
ul.contents a:visited
{
color: #444; 
}

ul.contents a:hover
{
color: #FFF;
}

/* CONTENTS ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

div.contents
{
margin: auto;
position: absolute; top: 200px; right: 0; left: 200px;
width: 600px;
}

div.contents div + div
{
margin-top: 1.0em;
}

div.go_top a
{
border-bottom: 4px solid #EEE;
font-family: "M+ C Type-1 (basic latin) Black";
letter-spacing: 0.20em;
padding-bottom: 0.2em;
}

div.go_top
{
margin-top: 2.0em;
text-align: right;
}

span.link_title
{
font-family: "M+ C Type-1 (basic latin) Black";
letter-spacing: 0.02em;
}

div.shaken a:link,
div.shaken a:visited,
div.multi_latin a:link,
div.multi_latin a:visited,
div.style_sample-j a:link,
div.style_sample-j a:visited,
div.style_sample-pc a:link,
div.style_sample-pc a:visited
{
color: #EEE;
}

div.shaken a:hover,
div.multi_latin a:hover,
div.style_sample-j a:hover,
div.style_sample-pc a:hover
{
color: #999;
}

/* MULTILINGUAL ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

div.shaken a
{
font-family: "M+ Type-1 (sample-j) Regular";
font-size: 290%;
line-height: 100%;
}

div.multi_latin a
{
font-family: "M+ P Type-1 (multi latin) Bold";
font-size: 340%;
line-height: 100%;
}

div.shaken,
div.multi_latin
{
margin-bottom: 1.0em;
margin-top: 1.0em;
}

table.lang_list
{
margin-top: 1.0em;
width: 600px;
}

/* MULTIWEIGHT::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

div.weight_sample-j1 span,
div.weight_sample-em span
{
font-size: 400%;
line-height: 100%;
}

div.weight_sample-j1
{
margin-top: 1.0em;
}

div.weight_sample-em
{
margin-top: 0.6em;
}

div.weight_sample-j1 span.thin
{
font-family: "M+ Type-1 (sample-j) Thin";
opacity: 0.4;
}
div.weight_sample-j1 span.light
{
font-family: "M+ Type-1 (sample-j) Light";
opacity: 0.5;
}
div.weight_sample-j1 span.regular
{
font-family: "M+ Type-1 (sample-j) Regular";
opacity: 0.6;
}
div.weight_sample-j1 span.medium
{
font-family: "M+ Type-1 (sample-j) Medium";
opacity: 0.7;
}
div.weight_sample-j1 span.bold
{
font-family: "M+ Type-1 (sample-j) Bold";
opacity: 0.8;
}
div.weight_sample-j1 span.heavy
{
font-family: "M+ Type-1 (sample-j) Heavy";
opacity: 0.9;
}
div.weight_sample-j1 span.black
{
font-family: "M+ Type-1 (sample-j) Black";
opacity: 1.0;
}

div.weight_sample-em span.thin
{
font-family: "M+ M Type-1 (basic latin) Thin";
opacity: 0.4;
}
div.weight_sample-em span.light
{
font-family: "M+ M Type-1 (basic latin) Light";
opacity: 0.5;
}
div.weight_sample-em span.regular
{
font-family: "M+ M Type-1 (basic latin) Regular";
opacity: 0.6;
}
div.weight_sample-em span.medium
{
font-family: "M+ M Type-1 (basic latin) Medium";
opacity: 0.7;
}
div.weight_sample-em span.bold
{
font-family: "M+ M Type-1 (basic latin) Bold";
opacity: 0.8;
}

/* MULTISTYLE-J ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

div.style_sample-j span.j1
{
font-family: "M+ Type-1 (sample-j) Light";
}
div.style_sample-j span.j2
{
font-family: "M+ Type-2 (sample-j) Light";
}

div.style_sample-j span
{
font-size: 1000%;
line-height: 100%;
}

div.style_sample-j
{
margin-bottom: 0.8em;
margin-top: 0.4em;
}

/* MULTISTYLE-E ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

div.style_sample-pc span.p1
{
font-family: "M+ P Type-1 (basic latin) Heavy";
}
div.style_sample-pc span.c1
{
font-family: "M+ C Type-1 (basic latin) Heavy";
}
div.style_sample-pc span.m1
{
font-family: "M+ M Type-1 (basic latin) Regular";
}

div.style_sample-pc span.mn1
{
font-family: "M+ MN Type-1 (basic latin) Medium";
}

div.style_sample-pc span
{
font-size: 400%;
line-height: 100%;
}

div.style_sample-pc
{
margin-bottom: 1.0em;
margin-top: 1.0em;
}

/* WEB FONTS :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

div.font_change
{
margin-bottom: 1.5em;
margin-top: 1.5em;
}

span.font_change a,
span.change_c2 a
{
border: 1px solid #DDD;
padding: 0.5em 1.0em 0.5em 1.0em;
}

span.notes
{
color: #888;
}

/* COPYRIGHT :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

div.copyright
{
font-size: 80%;
letter-spacing: 0.04em;
margin-bottom: 2.0em;
padding-top: 8.0em;
}

/* DESIGN ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

ul.weight_list
{
}

div.sample_bgj,
div.sample_bge,
div.sample_bgem
{
color: #FFF;
line-height: 0%;
opacity: 0.2;
}

div.sample_bgj
{
font-size: 2000%;
margin-bottom: 0.4em;
position: relative; top: -0.29em; left: 0.20em;
}

div.sample_bge,
div.sample_bgem
{
font-size: 2160%;
}

div.sample_bge
{
letter-spacing: -0.02em;
margin-bottom: 0.4em;
position: relative; top: -0.28em; left: 0.24em;
}

div.sample_bgem
{
letter-spacing: 0.00em;
margin-bottom: 0.55em;
position: relative; top: -0.12em; left: 0.26em;
}

div.j1
{
font-family: "M+ Type-1 (sample-j) Regular";
}

div.j2
{
font-family: "M+ Type-2 (sample-j) Regular";
}

div.p1
{
font-family: "M+ P Type-1 (basic latin) Regular";
}

div.p2
{
font-family: "M+ P Type-2 (basic latin) Regular";
}

div.c1
{
font-family: "M+ C Type-1 (basic latin) Regular";
}

div.c2
{
font-family: "M+ C Type-2 (basic latin) Regular";
}

div.m1
{
font-family: "M+ M Type-1 (basic latin) Regular";
}

div.m2
{
font-family: "M+ M Type-2 (basic latin) Regular";
}

div.mn1
{
font-family: "M+ MN Type-1 (basic latin) Regular";
}

div.sample_shaken
{
font-size: 290%;
}

div.sample_kana
{
font-size: 135%;
letter-spacing: 0.035em;
line-height: 160%;
padding-top: 0.0em;
}

div.sample_en1,
div.sample_en1m
{
font-size: 320%;
}

div.sample_en1m
{
letter-spacing: 0.00em;
}

div.sample_en2,
div.sample_en2m
{
font-size: 145%;
line-height: 140%;
padding-top: 0.0em;
}

div.sample_en2
{
letter-spacing: 0.08em;
}

div.sample_en2m
{
letter-spacing: 0.20em;
}