@charset 'UTF-8';

/*
    http://asamuzak.jp/
    template.css
    CSSファイル読み込み / CSS3用advanced / 携帯用handheld / プリント用CSS
*/

/*  CSS3先行実装ブラウザ向けの置き換え指定  */
@media screen {
html, html * {
    box-sizing : content-box;
}
h1, #global-navigation, #breadcrumbs-list {
    opacity : 0.8;
}
#global-navigation li {
    box-sizing : border-box;
}
#contents-container, #utility > *, #foot-note {
    opacity : 0.9;
}
}

@media screen and (color) {
/* general */
h1 {
    text-shadow : 0px 1px 1px rgb(255, 255, 240),
                  0px -1px 1px rgb(68, 33, 27);
}
h1 span:not([class]) {
    display : inline-block;
    -moz-transform : matrix(-1, 0, 0, 1, 0, 0);
    -webkit-transform : matrix(-1, 0, 0, 1, 0, 0);
    -o-transform : matrix(-1, 0, 0, 1, 0, 0);
    -ms-transform : matrix(-1, 0, 0, 1, 0, 0);
    transform : matrix(-1, 0, 0, 1, 0, 0);
}
h2 {
    border-top-color : rgba(255, 255, 240, 0.3);
    text-shadow : -1px 1px 1px rgba(255, 255, 240, 0.5);
}
h3 {
    border-top-color : rgba(255, 255, 240, 0.3);
    background : rgba(244, 164, 96, 0.6);
}
h4 {
    border-top-color : rgba(255, 255, 240, 0.3);
    background : rgba(204, 204, 102, 0.6);
}
blockquote[title][cite]:after {
    word-wrap : break-word;
}
pre {
    word-wrap : break-word;
}
form {
    opacity : 0.8;
}
fieldset {
    border-radius : 8px;
    background-clip : border-box;
}
ins, ins *, ins:before {
    background : rgba(238, 232, 170, 0.8);
}

/* document structure */
/* header */
#global-navigation {
    border-top-color : rgba(255, 255, 240, 0.5);
    border-left-color : rgba(255, 255, 240, 0.5);
    border-right-color : rgba(255, 255, 240, 0.5);
    border-top-left-radius : 8px;
    border-top-right-radius : 8px;
    -webkit-background-clip : border-box;
    background-clip : border-box;
    background : -webkit-gradient(radial, left bottom, 0, left bottom, 66, from(rgba(178, 34, 34, 0.8)), to(rgb(178, 34, 34)));
    background : -webkit-radial-gradient(left bottom, cover, rgba(178, 34, 34, 0.8), rgb(178, 34, 34) 33%);
    background : -moz-radial-gradient(left bottom, cover, rgba(178, 34, 34, 0.8), rgb(178, 34, 34) 33%);
    background : radial-gradient(left bottom, cover, rgba(178, 34, 34, 0.8), rgb(178, 34, 34) 33%);
}
#global-navigation a, #global-navigation a:link, #global-navigation a:visited {
    display : block;
    text-shadow : 0 -1px 1px rgba(107, 74, 43, 0.5);
    -moz-transition-property : background, background-image;
    -webkit-transition-property : background, background-image;
    -o-transition-property : background, background-image;
    transition-property : background, background-image;
    -moz-transition-duration : 0.5s;
    -webkit-transition-duration : 0.5s;
    -o-transition-duration : 0.5s;
    transition-duration : 0.5s;
    -moz-transition-timing-function : ease-out;
    -webkit-transition-timing-function : ease-out;
    -o-transition-timing-function : ease-out;
    transition-timing-function : ease-out;
}
#global-navigation li:nth-child(1) a, #global-navigation li:nth-child(1) a:link, #global-navigation li:nth-child(1) a:visited {
    border-top-left-radius : 5px;
}
#global-navigation li:last-child a, #global-navigation li:last-child a:link, #global-navigation li:last-child a:visited {
    border-top-right-radius : 5px;
}
#global-navigation a:hover {
    display : block;
    background-image : url(../svg/effects.svg#global_nav_hover);
    background-image : -webkit-gradient(linear, left top, right top, from(rgb(178, 34, 34)), color-stop(0.5, rgb(210, 180, 140)), to(rgb(178, 34, 34)));
    background-image : -webkit-linear-gradient(left, rgb(178, 34, 34), rgb(210, 180, 140), rgb(178, 34, 34));
    background-image : -moz-linear-gradient(left, rgb(178, 34, 34), rgb(210, 180, 140), rgb(178, 34, 34));
    background-image : linear-gradient(left, rgb(178, 34, 34), rgb(210, 180, 140), rgb(178, 34, 34));
    background-image : linear-gradient(to right, rgb(178, 34, 34), rgb(210, 180, 140), rgb(178, 34, 34));
    background-size : 100% 100%;
    text-shadow : 0 1px 1px rgba(255, 255, 240, 0.5), 0 -1px 1px rgba(107, 74, 43, 0.5);
}
#breadcrumbs-list {
    margin : 0;
    border-left-color : rgba(255, 255, 240, 0.5);
    border-right-color : rgba(255, 255, 240, 0.5);
    -webkit-background-clip : border-box;
    background-clip : border-box;
}
/* contents */
#contents-container {
    border-left-color : rgba(255, 255, 240, 0.5);
    border-right-color : rgba(255, 255, 240, 0.5);
    background : rgba(250, 250, 210, 0.9);
    -webkit-background-clip : border-box;
    background-clip : border-box;
    opacity : 1.0;
}
/* contents - utility */
#utility {
    border-left-color : rgba(255, 255, 240, 0.7);
    border-bottom-color : rgba(255, 255, 240, 0.7);
    border-bottom-left-radius : 10px;
    -webkit-background-clip : padding-box;
    background-clip : padding-box;
}
#utility > * {
    background : rgba(210, 180, 140, 0.9);
    opacity : 1.0;
}
#site-search {
    opacity : 0.9;
}
#utility-list {
    border-bottom-left-radius : 9px;
}
/* entry */
div.comment, div.ans,
article.comment {
    border-top : 1px inset rgba(238, 232, 170, 0.3);
    border-right : 1px outset rgba(238, 232, 170, 0.3);
    border-bottom : 1px inset rgba(238, 232, 170, 0.3);
    border-left : 1px outset rgba(238, 232, 170, 0.3);
    border-radius : 8px;
    background : rgba(238, 232, 170, 0.8);
    background-clip : border-box;
}
/* footer */
#foot-note {
    border-left-color : rgba(255, 255, 240, 0.5);
    border-right-color : rgba(255, 255, 240, 0.5);
    border-bottom-color : rgba(255, 255, 240, 0.5);
    border-bottom-left-radius : 8px;
    border-bottom-right-radius : 8px;
    -webkit-background-clip : border-box;
    background-clip : border-box;
}
/* entry common */
.pre {
    word-wrap : break-word;
}
.datainfo, .qainfo {
    border-radius : 8px;
    background-clip : border-box;
}
}

/* Change background by document window */
@media  screen and (color) and (min-width : 2561px), screen and (color) and (min-height : 1703px) {
body, #utility {
    background : url(../img/img_3008_sepia.jpg) center no-repeat fixed;
}
h2 {
    background : url(../img/img_3008.jpg) center no-repeat fixed;
}
}

@media  screen and (color) and (max-width : 2560px) and (max-height : 1702px) {
body, #utility {
    background : url(../img/img_2560_sepia.jpg) center no-repeat fixed;
}
h2 {
    background : url(../img/img_2560.jpg) center no-repeat fixed;
}
}

@media  screen and (color) and (max-width : 1920px) and (max-height : 1277px) {
body, #utility {
    background : url(../img/img_1920_sepia.jpg) center no-repeat fixed;
}
h2 {
    background : url(../img/img_1920.jpg) center no-repeat fixed;
}
}

@media  screen and (color) and (max-width : 1600px) and (max-height : 1064px) {
body, #utility {
    background : url(../img/img_1600_sepia.jpg) center no-repeat fixed;
}
h2 {
    background : url(../img/img_1600.jpg) center no-repeat fixed;
}
}

@media  screen and (color) and (max-width : 1440px) and (max-height : 957px) {
body, #utility {
    background : url(../img/img_1440_sepia.jpg) center no-repeat fixed;
}
h2 {
    background : url(../img/img_1440.jpg) center no-repeat fixed;
}
}

@media  screen and (color) and (max-width : 1280px) and (max-height : 851px) {
body, #utility {
    background : url(../img/img_1280_sepia.jpg) center no-repeat fixed;
}
h2 {
    background : url(../img/img_1280.jpg) center no-repeat fixed;
}
}

@media  screen and (color) and (max-width : 1120px) and (max-height : 745px) {
body, #utility {
    background : url(../img/img_1120_sepia.jpg) center no-repeat fixed;
}
h2 {
    background : url(../img/img_1120.jpg) center no-repeat fixed;
}
}

@media  screen and (color) and (max-width : 960px) and (max-height : 638px) {
body, #utility {
    background : url(../img/img_960_sepia.jpg) center no-repeat fixed;
}
h2 {
    background : url(../img/img_960.jpg) center no-repeat fixed;
}
}

@media  screen and (color) and (max-width : 800px) and (max-height : 532px) {
body, #utility {
    background : url(../img/img_800_sepia.jpg) center no-repeat fixed;
}
h2 {
    background : url(../img/img_800.jpg) center no-repeat fixed;
}
#root-container {
    width : 90%;
}
}

@media  screen and (color) and (max-width : 640px) and (max-height : 426px) {
body, #utility {
    background : url(../img/img_640_sepia.jpg) center no-repeat fixed;
}
h2 {
    background : url(../img/img_640.jpg) center no-repeat fixed;
}
#root-container {
    width : 90%;
}
#global-navigation li {
    display : inline-block;
}
}

/*  携帯端末用CSS   */
@media handheld {
/* general */
body {
    background : url(../img/img_640.jpg) center no-repeat fixed;
}
h1 {
    padding : 0.5em 0;
    text-align : center;
}
h2 {
    border : 0;
    padding : 0.5em;
    color : rgb(64, 0, 0);
    text-indent : 0;
    background : url(../img/img_640_sepia.jpg) center no-repeat fixed;
}
h3 {
    margin : 0;
    border-top : 1px solid rgb(244, 164, 96);
    border-bottom : 1px solid rgb(244, 164, 96);
    padding : 0.5em 0;
    background : none;
    text-indent : 0;
}
h4 {
    margin : 0;
    border-top : 1px solid rgb(204, 204, 102);
    border-bottom : 1px solid rgb(204, 204, 102);
    padding : 0.5em 0;
    background : none;
    text-indent : 0;
}
h5, h6 {
    padding : 0.5em 0;
}
th, td {
    border : 1px solid rgb(168,0,47);
    padding : 0;
}
td {
    vertical-align : top;
}
dl {
    margin : 0.5em 0;
}
dd {
    margin-left : 0.5em;
    padding-left : 0;
}
dd ol, dd ol li {
    margin : 0;
    padding : 0;
}
ul {
    margin : 0.5em;
    padding : 0 0 0 0.5em;
}
ol {
    margin : 0.5em;
    padding : 0 0 0 0.5em;
}
ol > li {
    display : list-item;
    margin-left : 0.5em;
}
blockquote {
    margin : 0.5em;
    padding : 0.5em;
}
blockquote[title]:after, blockquote[title][cite]:after {
    margin-right : 0.5em;
}

/* HTML5 */
article, aside, dialog, figure, footer, header, hgroup, menu, nav, section {
    margin : 0;
    border : 0;
    padding : 0;
}

ins:before {
    content : "[追記] ";
}
code ins:before {
    content : "";
}
a:hover, a:active {
    background : inherit;
}
/* document structure */
/* root */
#root-container {
    margin : 0;
    padding-top : 1em;
    width : 100%;
    max-width : 100%;
}

/* header */
#global-navigation {
    border : 0;
    padding : 0.5em;
    line-height : 1;
}
#global-navigation li {
    display : inline;
    border : 0;
    padding : 0;
    width : 100%;
    max-width : 100%;
}
#global-navigation a {
    display : inline;
    display : inline-block;
    font-weight : normal;
}
#global-navigation a:link, #global-navigation a:visited {
    font-weight : normal;
    text-decoration : underline;
}
#global-navigation a:hover, #global-navigation a:active {
    background : inherit;
    font-weight : normal;
    text-decoration : underline;
}
#breadcrumbs-list {
    border : 0;
    padding : 0.5em;
}
#breadcrumbs-list ol:before {
    font-weight : normal;
}

/* contents */
#contents-container {
    border : 0;
    padding : 0 0 0.5em 0;
    position : static;
}
/* contents - utility */
#utility {
    margin : 0;
    border : 0;
    float : none;
    position : static;
    width : 100%;
    max-width : 100%;
    background : none;
}
#site-search {
    padding-top : 0.5em;
}
#site-search fieldset {
    padding : 0.5em;
}
#site-search p {
    margin : 0;
    line-height : 1;
}
#site-search input[type="text"] {
    width : auto;
}
#utility-list {
    display : none;
}

/* contents */
/* contents - entry */
.entry-container, .entry-container > * {
    line-height : 1;
}
.entry-container > h2 {
    line-height : 1;
}
.entry-container > p, .entry-container > dl, #more {
    padding-left : 0.5em;
    padding-right : 0.5em;
}
.entry-container > ins {
    margin-left : 0.5em;
    margin-right : 0.5em;
}
.entry-container > ins > p, .entry-container > ins > dl {
    margin-left : 0.5em;
    margin-right : 0.5em;
}
.entry-extended {
    margin-bottom : 1em;
    padding-left : 0.5em;
}
.entry-extended:before {
    font-weight : normal;
}
.entry-footer {
    margin : 0 0 0.5em 0;
    text-align : left;
}
.entry-footer li {
    display : inline;
    display : inline-block;
    padding : 0 0.5em;
}

/* entry - comment / entry - trackback */
div.entry-comment, div.entry-trackback,
section.entry-comment, section.entry-trackback {
    padding-left : 0.5em;
    padding-right : 0.5em;
    line-height : 1;
}
#trackback {
    clear : none;
}
div.entry-comment h3, div.entry-trackback h3,
section.entry-comment h3, section.entry-trackback h3 {
    margin-top : 0.5em;
    border-top : none;
    padding : 0 0.5em;
    background : inherit;
}
div.comment,
article.comment {
    margin : 0;
    padding : 0.5em;
}
div.comment + div.comment,
article.comment + article.comment {
    border-top : 1px dotted rgb(178, 34, 34);
}
.comment-footer, .trackback-footer {
    clear : none;
}
.comment-footer li, .trackback-footer li {
    display : inline;
    display : inline-block;
    padding-left : 0.5em;
}
.entry-trackbacks dd {
    margin-left : 0.5em;
}
#comments_form > fieldset {
    margin : 0;
    padding : 0.5em;
}
#comment-text {
    max-width : 100%;
}
#ping-uri {
    display : inline;
    border : 0;
    padding : 0;
}

/* footer */
#footer-container {
    padding-bottom : 0;
    position : static;
    clear : none;
}
#generator {
    padding : 0 0.5em;
    position : static;
    background : rgb(210, 180, 140);
}
#foot-note {
    border : 0;
    padding : 0 0.5em;
    position : static;
    font-weight : normal;
    text-align : left;
}
#foot-note a:link, #foot-note a:visited, #foot-note a:active, #foot-note a:hover {
    padding : 0;
    background : inherit;
    text-decoration : underline;
}

/* contents.css */
.sample, #comment-preview .comment, #comment-preview > form, .search-result, .entry-container #site-search {
    margin : 0.5em;
}
.search-result .entry-footer li {
    padding-left : 0.5em;
}
.entry-container #site-search fieldset {
    padding : 0.5em;
}

/* quick links */
.qlnk {
    margin-left : 0.5em;
    padding : 0;
}
.qlnk li {
    display : inline;
    display : inline-block;
    margin : 0;
    float : none;
    width : auto;
}

/* hiyaketai qa */
p.qainfo {
    margin : 0.5em;
}
div.ques {
    padding : 0 0.5em;
}
div.ans {
    margin : 0.5em 0;
    padding : 0.5em;
}

/* photos */
.img_l, .img_r {
    float : none;
}

/* movabletype 82 */
blockquote[cite="http://www.code-404.net/article/2006/04/06/mime-type4xhtml11"] ins:before {
    content : "";
}
}

/*  印刷用CSS   */
@media print {
* {
    opacity : 1.0;
    background : transparent;
}
body {
    margin : 0;
    border : 0;
    padding : 0;
    width : 100%;
    max-width : 100%;
    color : #000;
    background-color : #fff;
    background-image : none;
}

h2 {
    border-top : 1px solid #cd5c5c;
    background-image : none;
}

h1, h2, h3, h4, h5, h6 {
    page-break-after : avoid;
    page-break-inside : avoid;
}

blockquote, pre {
    page-break-inside : avoid;
}

a[href]:after {
    content : ' [' attr(href) ']';
    font-size : smaller;
}
a[href][title]:after {
    content : ' [' attr(title) ' : ' attr(href) ']';
    font-size : smaller;
}

q[title]:after {
    content : close-quote ' [' attr(title) ']';
    font-size : smaller;
}

#root-container, #contents-container, #contents, #footer-container {
    margin : 0;
    border : 0;
    padding : 0;
    width : 100%;
    max-width : 100%;
}
#breadcrumbs-list {
    border : none;
}
#footer-container > * {
    border : none;
}

#header-container a[href]:after, #header-container a[href][title]:after {
    content : '';
}
#global-navigation {
    border : 1px solid #b22222;
}

#utility {
    display : none;
}

.entry-footer a[href]:after {
    content : '';
}

a[href="#comments_form"] {
    display : none;
}
#comments_form {
    display : none;
}

#footer-container a[href]:after {
    content : '';
}

.qlnk a[href]:after {
    content : '';
}

.dummyShadow {
    display : none;
}
}

