html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}

body {
font-family: ArialMT, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", メイリオ, sans-serif;
}

ol, ul {
list-style: none;
}

table {
border-collapse: collapse;
border-spacing: 0;
}

caption, th, td {
text-align: left;
font-weight: normal;
vertical-align: middle;
}

q, blockquote {
quotes: none;
}

q:before, q:after, blockquote:before, blockquote:after {
content: "";
content: none;
}

a img {
border: none;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
display: block;
}

body {
background-color:#eee;
color: #555555;
}

p {
margin-bottom: 1.214em;
}

a {
color: #36a;
-moz-transition-property: color;
-webkit-transition-property: color;
-o-transition-property: color;
transition-property: color;
-moz-transition-duration: 800ms;
-webkit-transition-duration: 800ms;
-o-transition-duration: 800ms;
transition-duration: 800ms;
}

a:hover {
-moz-transition-property: color;
-webkit-transition-property: color;
-o-transition-property: color;
transition-property: color;
-moz-transition-duration: 300ms;
-webkit-transition-duration: 300ms;
-o-transition-duration: 300ms;
transition-duration: 300ms;
color: #9cd;
}

h1{font-size:1.6em;}
h2{font-size:1.4em;}
h3{font-size:1.3em;}
h4{font-size:1.2em;}
h5,h6{font-size:1.1em;}
h1,h2,h3,h4,h5,h6,p,li,dd{margin:0;line-height:1.5em;}

hgroup h1 {margin-bottom:0px;}

img, embed, object, video {
max-width: 100%;
}

/* Layout ------------------------------------------------------------------ */

body {
font-size: 1em;
}

html > body {
font-size: 14px;
}

body #page {
background:url(../images/back.png);
*zoom: 1;
margin: auto;
width: 100.0%;
max-width: 100%;
}

body #page:after {
content: "";
display: table;
clear: both;
}

body #page #page-header {
clear: both;
margin-left: 0;
margin-right: 0;
padding-left: 10%;
padding-right: 10%;
background-color:#9cd;
padding-top: 0.3em;
*zoom: 1;
}

body #page #page-header:after {
content: "";
display: table;
clear: both;
}

body #page #page-header #logo {
display: inline;
float: left;
width: 29.787%;
margin-right: 2.128%;
}

body #page #page-header #main-menu {
display: inline;
width: 68.085%;
display: inline;
float: right;
margin-right: 0;
#margin-left: -1.695%;
}

body #page #page-header #main-menu ul {
float: right;
}

body #page #page-header #main-menu ul li {
display: inline;
padding:4px 0 0 10px;
}

body #page #page-header #main-menu ul li:after {
padding: 0 4px;
}

body #page #page-header #main-menu ul li:first-child a {
background-image: none;
padding-right: none;
}

body #page #page-header #main-menu ul li:last-child:after {
padding: 0;
}


body #page #main {
clear: both;
padding-left: 10%;
padding-right: 10%;
*zoom: 1;
padding-top: 1.5em;
}

body #page #main:after {
content: "";
display: table;
clear: both;
}

body #page #main header {
padding-bottom: 1em;
}

body #page #main header hgroup h1{
line-height:1.2em;
padding-bottom: 0.3em;
}

body #page #main .column-1 {
display: inline-block;
float: left;
width: 30%;
margin-right: 3%;
padding-left: 0%;
}

body #page #main .column-2 {
display: inline;
float: left;
width: 30%;
margin-right: 3%;
padding-left: 0%;
}

body #page #main .column-3 {
display: inline;
float: left;
width: 30%;
margin-right: 3%;
padding-left: 0%;
}

body #page #main .column-3 .box{
display:inline-block;
border:#ccc 1px solid;
margin-bottom:0.5em;
padding:0.5em;
}

body #page #main .column-3 .box p img{
display:block;
float:right;
margin:0 0 0 8px;
}

body #page #main .column-1 h3, body #page #main .column-2 h3, body #page #main .column-3 h3{
padding-bottom:0.5em;
}

body #page #main .column-1 ul, body #page #main .column-2 ul, body #page #main .column-3 ul {
list-style: square outside;
padding-left:1.5em;
color: #555555;
}

body #page #main .column-1 ul li, body #page #main .column-2 ul li, body #page #main .column-3 ul li {
margin-bottom: 0.3em;
}

body #page #main footer {
width: 93.617%;
display: inline;
margin-right: 0;
#margin-left: -1.695%;
*zoom: 1;
text-align: center;
padding:20px;
}

body #page #main footer:after {
content: "";
display: table;
clear: both;
}

body #page #main footer .col-txt {
display: inline;
float: left;
width: 70.732%;
margin-right: 2.439%;
}

body #page #main footer .col-txt p {
font-size: 1em;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
-o-border-radius: 7px;
-ms-border-radius: 7px;
-khtml-border-radius: 7px;
border-radius: 7px;
padding:0.6em 1em;
margin-bottom: 1em;
line-height: 1.2em;
display: block;
background-color: #ccc;
}

body #page #main footer .col-btn {
display: inline;
width: 100%;
display: inline;
margin-right: 0;
#margin-left: -1.695%;
float: left;
}

body #page #main footer .col-btn a {
color: white;
text-decoration: none;
display: block;
width: 100%;
font-size: 1em;
line-height: 1.2em;
padding:0.5em 0;
border-bottom: 1px solid #915d10;
border-top: 1px solid #efd18f;
border-left: 1px solid #e3ad4c;
border-right: 1px solid #b47c17;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
-o-border-radius: 7px;
-ms-border-radius: 7px;
-khtml-border-radius: 7px;
border-radius: 7px;
text-shadow: rgba(0, 0, 0, 0.6) 0px 1px 1px;
-moz-box-shadow: rgba(255, 255, 255, 0.2) 0 0 5px 1px inset;
-webkit-box-shadow: rgba(255, 255, 255, 0.2) 0 0 5px 1px inset;
-o-box-shadow: rgba(255, 255, 255, 0.2) 0 0 5px 1px inset;
box-shadow: rgba(255, 255, 255, 0.2) 0 0 5px 1px inset;
background-image: url('../images/noise.png?1310054484'), -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #dfa21e), color-stop(33.333%, #dc9b1d), color-stop(66.667%, #d88f1a), color-stop(100%, #d58818));
background-image: url('../images/noise.png?1310054484'), -webkit-linear-gradient(top, #dfa21e, #dc9b1d, #d88f1a, #d58818);
background-image: url('../images/noise.png?1310054484'), -moz-linear-gradient(top, #dfa21e, #dc9b1d, #d88f1a, #d58818);
background-image: url('../images/noise.png?1310054484'), -o-linear-gradient(top, #dfa21e, #dc9b1d, #d88f1a, #d58818);
background-image: url('../images/noise.png?1310054484'), -ms-linear-gradient(top, #dfa21e, #dc9b1d, #d88f1a, #d58818);
background-image: url('../images/noise.png?1310054484'), linear-gradient(top, #dfa21e, #dc9b1d, #d88f1a, #d58818);
}

body #page #main footer .col-btn a:hover {
background-image: url('../images/noise.png?1310054484'), -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #dea21e), color-stop(33.333%, #eaa51f), color-stop(66.667%, #e5971a), color-stop(100%, #d68818));
background-image: url('../images/noise.png?1310054484'), -webkit-linear-gradient(top, #dea21e, #eaa51f, #e5971a, #d68818);
background-image: url('../images/noise.png?1310054484'), -moz-linear-gradient(top, #dea21e, #eaa51f, #e5971a, #d68818);
background-image: url('../images/noise.png?1310054484'), -o-linear-gradient(top, #dea21e, #eaa51f, #e5971a, #d68818);
background-image: url('../images/noise.png?1310054484'), -ms-linear-gradient(top, #dea21e, #eaa51f, #e5971a, #d68818);
background-image: url('../images/noise.png?1310054484'), linear-gradient(top, #dea21e, #eaa51f, #e5971a, #d68818);
}

body #page #secondary {
clear: both;
margin-left: 0;
margin-right: 0;
padding-left: 10%;
padding-right: 10%;
*zoom: 1;
padding-top: 1em;
}

body #page #secondary:after {
content: "";
display: table;
clear: both;
}

body #page #secondary header {
clear: both;
padding-bottom: 2em;
}

body #page #secondary header:after {
content: "";
display: table;
clear: both;
}

body #page #secondary .column-1 {
display: inline;
float: left;
width: 30%;
margin-right: 3%;
padding-left: 0%;
}

body #page #secondary .column-2 {
display: inline;
float: left;
width: 30%;
margin-right: 3%;
padding-left: 0%;
}

body #page #secondary .column-3 {
display: inline;
float: left;
width: 30%;
margin-right: 3%;
padding-left: 0%;
}

body #page #secondary .column-1 h3, body #page #secondary .column-2 h3, body #page #secondary .column-3 h3{
padding-bottom:0.5em;
}




/*body #page #secondary .column-3 .col-btn {
display: inline;
width:100%;
display: inline;
margin-right: 0;
#margin-left: -1.695%;
float: left;
text-align:center;
}

body #page #secondary .column-3 .col-btn a {
color: white;
text-decoration: none;
display: block;
width: 100%;
font-size: 1em;
line-height: 1.2em;
padding:0.5em 0;
border-bottom: 1px solid #915d10;
border-top: 1px solid #efd18f;
border-left: 1px solid #e3ad4c;
border-right: 1px solid #b47c17;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
-o-border-radius: 7px;
-ms-border-radius: 7px;
-khtml-border-radius: 7px;
border-radius: 7px;
text-shadow: rgba(0, 0, 0, 0.6) 0px 1px 1px;
-moz-box-shadow: rgba(255, 255, 255, 0.2) 0 0 5px 1px inset;
-webkit-box-shadow: rgba(255, 255, 255, 0.2) 0 0 5px 1px inset;
-o-box-shadow: rgba(255, 255, 255, 0.2) 0 0 5px 1px inset;
box-shadow: rgba(255, 255, 255, 0.2) 0 0 5px 1px inset;
background-image: url('../images/noise.png?1310054484'), -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #dfa21e), color-stop(33.333%, #dc9b1d), color-stop(66.667%, #d88f1a), color-stop(100%, #d58818));
background-image: url('../images/noise.png?1310054484'), -webkit-linear-gradient(top, #dfa21e, #dc9b1d, #d88f1a, #d58818);
background-image: url('../images/noise.png?1310054484'), -moz-linear-gradient(top, #dfa21e, #dc9b1d, #d88f1a, #d58818);
background-image: url('../images/noise.png?1310054484'), -o-linear-gradient(top, #dfa21e, #dc9b1d, #d88f1a, #d58818);
background-image: url('../images/noise.png?1310054484'), -ms-linear-gradient(top, #dfa21e, #dc9b1d, #d88f1a, #d58818);
background-image: url('../images/noise.png?1310054484'), linear-gradient(top, #dfa21e, #dc9b1d, #d88f1a, #d58818);
}

body #page #secondary .column-3 .col-btn a:hover {
background-image: url('../images/noise.png?1310054484'), -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #dea21e), color-stop(33.333%, #eaa51f), color-stop(66.667%, #e5971a), color-stop(100%, #d68818));
background-image: url('../images/noise.png?1310054484'), -webkit-linear-gradient(top, #dea21e, #eaa51f, #e5971a, #d68818);
background-image: url('../images/noise.png?1310054484'), -moz-linear-gradient(top, #dea21e, #eaa51f, #e5971a, #d68818);
background-image: url('../images/noise.png?1310054484'), -o-linear-gradient(top, #dea21e, #eaa51f, #e5971a, #d68818);
background-image: url('../images/noise.png?1310054484'), -ms-linear-gradient(top, #dea21e, #eaa51f, #e5971a, #d68818);
background-image: url('../images/noise.png?1310054484'), linear-gradient(top, #dea21e, #eaa51f, #e5971a, #d68818);
}*/


body #page #secondary .column-3 #illustration img {
vertical-align: bottom;
}

body #page #page-footer {
clear:both;

bottom:0;
*zoom: 1;
padding:4px 0;
background-color: #9cd;
margin:0;
}

body #page #page-footer:after {
content: "";
display: table;
clear: both;
}

body #page #page-footer p {
text-align:center;
color:#fff;
letter-spacing: 0.1em;
font-size:0.85em;
}

body #page #page-footer a {
color: #fff;
}

body #page #page-footer a:hover {
color: #fff;
}


body #page .like{ padding:8px 0;
vertical-align:top;}
body #page .like img{ margin-right:10px;}


body #page #main .cambox{
display:inline-block;
width:43%;
float:left;
margin-right:3%;
border:1px #ccc solid;
padding:1em;
margin-bottom:2em;
}

body #page #main .cambox img{
float:left;
margin-right:1em;}


body #page #main blockquote{
display:inline-block;
border:1px solid #36a;
margin:0 0 2em 0;
padding:1em;
width:93%;
}

body #page #main blockquote ul{
border:0;
margin:0;
list-style:none;
}

body #page #main blockquote ul li{
clear:both;
border:0;
margin:0;
padding:8px 0;
list-style:none;
}

body #page #main blockquote ul li input{
float:left;
vertical-align:middle;
}
body #page #main blockquote ul li label{
width:8em;
float:left;
}
body #page #main blockquote div{
float:left;
margin-right:2em;
}

body #page #main blockquote .inline{
display:inline-block;
border:1px solid #ccc;
padding:1em;
height:8em;
overflow:auto;
font-size:0.85em;
margin-bottom:1em;
}




body #page .pdb{padding-bottom:300px;}


/* Media Queries ------------------------------------------------------------ */
@media screen and (min-width: 1500px) {


body #page #secondary hgroup {
text-align: left;
}
}
@media screen and (max-width: 1024px) {

body #page #page-header {
padding-left: 5.085%;
padding-right: 5.085%;
}

body #page #page-header #logo {
display: inline;
float: left;
width: 32.075%;
margin-right: 1.887%;
}

body #page #page-header #main-menu {
display: inline;
width: 66.038%;
display: inline;
float: right;
margin-right: 0;
#margin-left: -1.695%;
}

body #page #main {
padding-left: 5.085%;
padding-right: 5.085%;
clear: both;
padding-bottom: 1.357em;
}

body #page #main .column-1, body #page #main .column-3 {
display: inline;
float: left;
width: 43.396%;
margin-right: 1.887%;
padding-right: 5.66%;
padding-left: 0%;
}

body #page #main .column-2, body #page #main footer {
display: inline;
width: 43.396%;
padding-right: 5.66%;
padding-left: 0%;
float: right;
margin-right: 0;
#margin-left: -1.695%;
}

body #page #main footer {
padding-bottom:20px;
padding-top:20px;
}

body #page #main footer .col-txt {
display: inline;
float: left;
width: 100%;
margin-right: 4.348%;
}

body #page #main footer .col-btn {
width: 100%;
display: inline;
float: right;
margin-right: 0;
#margin-left: -1.695%;
}

body #page #secondary {
padding-left: 5.085%;
padding-right: 5.085%;
}

body #page #secondary header .col-btn {
width: 100%;
display: inline;
float: right;
margin-right: 0;
#margin-left: -1.695%;
}

body #page #secondary .column-1, body #page #secondary .column-3 {
display: inline;
float: left;
width: 43.396%;
margin-right: 1.887%;
padding-right: 5.66%;
padding-left: 0%;
}

body #page #secondary .column-2, body #page #secondary footer {
display: inline;
width: 43.396%;
padding-right: 5.66%;
padding-left: 0%;
float: right;
margin-right: 0;
#margin-left: -1.695%;
}

body #page #secondary .column-3 #illustration {
padding-top: 6.786em;
}

body #page #page-footer {
padding-left: 5.085%;
padding-right: 5.085%;
}
}
@media screen and (max-width: 810px) {

body #page #secondary .column-3 #illustration {
padding-top: 6.786em;
}
}
@media screen and (max-width: 840px) {

body #page #page-header {
padding-left: 5.085%;
padding-right: 5.085%;
}

body #page #page-header #logo {
width: 100%;
display: inline;
float: right;
margin-right: 0;
#margin-left: -1.695%;
text-align: center;
}

body #page #page-header #main-menu {
width: 100%;
display: inline;
float: right;
margin-right: 0;
#margin-left: -1.695%;
padding-bottom:0.2em;
}

body #page #page-header #main-menu ul {
float: none;
text-align: center;
}

body #page #secondary .column-3 #illustration {
padding-top: 8.143em;
}

body #page .pdb{padding-bottom:20px;}

}
@media screen and (max-width: 710px) {

body #page #page-header #main-menu {
width: 100%;
display: inline;
float: right;
margin-right: 0;
#margin-left: -1.695%;
padding-bottom:0.2em;
}

body #page #secondary .column-1{
margin-bottom:20px;
}
body #page #secondary .column-1, body #page #secondary .column-2, body #page #secondary .column-3 {
width: 100%;
display: inline;
float: right;
margin-right: 0;
#margin-left: -1.695%;
}

body #page #secondary .column-1 #illustration, body #page #secondary .column-3 #illustration {
padding-top: 0em;
}
body #page #main .cambox{
width:93%;
}

}
@media screen and (max-width: 480px) {

body #page #page-header #main-menu ul li:after {
padding-bottom:0.2em;
}

body #page #main .column-1, body #page #main .column-2, body #page #main .column-3 {
width: 100%;
display: inline;
float: right;
margin-right: 0;
#margin-left: -1.695%;
padding-left: 0%;
padding-right: 0%;
}

body #page #main footer {
width: 100%;
display: inline;
margin-right: 0;
#margin-left: -1.695%;
padding-left: 0%;
padding-right: 0%;
}

body #page #main footer .col-txt {
display: inline;
float: left;
width: 100%;
margin-right: 1.887%;
}

body #page #main footer .col-btn {
width: 100%;
display: inline;
float: right;
margin-right: 0;
#margin-left: -1.695%;
}

body #page #secondary .column-1, body #page #secondary .column-2, body #page #secondary .column-3 {
width: 100%;
display: inline;
float: right;
margin-right: 0;
#margin-left: -1.695%;
padding-left: 0%;
padding-right: 0%;
}
