@charset "shift_jis";

/*《ページ全体に適用されるもの》*/

  
  
body{
    -webkit-text-size-adjust : 100%!important ;
    word-wrap: break-word;

}

/*《強調のstrongは太字に》*/
strong{
    font-weight: bold
}

/*《直言タイトル部分》*/
hr{
    margin: .5em 0;
}

div.subject {
    font-size: 14pt;
	font-weight: bold;
    text-align: left; float: left;
    margin: 0 0 0 10px;
    }

/*《特別直言タイトル部分》*/

hr{
    margin: .5em 0;
}

div.exsubject {
    font-size: 14pt;
	font-weight: bold;
	font-color: #ff0000;
    text-align: left; float: left;
    margin: 0 0 0 10px;
    }

/*《直言日付部分》*/
div.date {
    font-size: 14pt;
	font-weight: bold;
    text-align: right;
    margin: 0 50px 0 0;
    }

/*全ての画像に適用されるもの*/
img{
    max-width: 100%;
    height: auto;
    }

/*※htmlの「<div id="article">」以下にしか適用されない*/
/*行間は1.5文字分*/
#article {
        /*背景色*/
    background-color: #fcfcfc;
    color: #222222;
    line-height:1.8;
    font-family: 'ＭＳ Ｐゴシック', 'MS PGothic', メイリオ, Meiryo, Osaka, sans-serif;
}

/*リンクテキストの色*/
#article a:link{
    color: #11c;
}

/*カーソルを当てた時のリンクの色*/
#article a:hover{
    color: #04c;
    text-decoration: none;
}

/*すでに訪問したリンクテキストの色*/
#article a:visited{
    color: #639;
}

/*《記事中原則段落の最初は2字分インデント》*/
#article > p {
    text-indent: 2em;
    }

/*《記事中の画像に適用されるもの》*/
#article img{
    box-shadow: 1px 1px  2px 2px #888;
    border-radius: .1em;
    margin: 1em 1em;
    }

/*《見出し1》(下線つき)*/
#article h1 {
    font-size: 120%;
    font-weight: bold;
	padding-bottom: 1px;
	border-bottom: 1px solid #ccc;
    margin: 2em 0 0 0;
}

/*《見出し2》*/
#article h2 {
    font-size: 100%;
    font-weight: bold;
    margin: 1.5em 0 0 0;
}

/*《引用文に適用するもの》*/
#article blockquote {
    box-shadow:1px 1px 3px 1px #999;
    margin: 1.5em;
    padding: 1em 1.5em;
    background: #f9fbfc;
    border-radius: 4px;
}    

/*《原則引用文中の段落に適用するもの》*/
#article blockquote > p {
    text-indent: 1em;
    margin: .5em 0;
}

/*《引用文中の最初の段落だけに適用するもの》*/
#article blockquote > p:nth-of-type(1) {
    margin-top: 0.2em;
}

/*《引用文中の最後の段落だけに適用するもの》*/
#article blockquote > p:nth-last-of-type(1) {
    margin-bottom: 0.2em;
}


/*★以下、html内に「class="◎◎"」で適用されるもの★*/
/*例：「<p class="hang">」,「<blockquote class="bgred">」*/

/*【インデントなし】 「class="noindent"」*/
#article .noindent {
    text-indent: 0;
}

/*【頭出し・ぶら下げインデント】「class="hang"」*/
#article .hang {
    margin-left: 1em;
    text-indent: -1em;
}

/*【背景色 白】*/
#article .bgwhite {
    background-color: #fcfcfc;
}

/*【背景色 薄い水色】*/
#article .bgskyblue {
    background-color: #f9fbfc;
}

/*【背景色 薄い青】*/
.bgblue {
    background-color: #f2f5fc;
}

/*【背景色 薄い緑】*/
#article .bggreen {
    background-color: #f9fcfa;
}

/*【背景色 薄いオレンジ】*/
#article .bgorange {
    background-color: #fcfaf9;
}

/*【背景色 薄い赤】*/
#article .bgred {
    background-color: #fff7f9;
}

.serif{
    font-family:"游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "Roboto Slab" , Garamond , "Times New Roman" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
}

/*以下、スマートフォン対応用*/
/*スマートフォン用 画面幅480pxまで*/
@media screen and (max-width: 480px) {

    /*《直言タイトル部分》*/
    div.subject {
        float: none;
        }
    /*《直言日付部分》*/
    div.date {
        margin: 0 1em 0 0 ;
        }
    
    /*《記事中の画像》*/
    #article img{
        max-width: 80%!important;
        height: auto!important;
        }
    #article img { 
        float : none !important;
        margin: 1em auto!important;
        display:block!important;
        max-height: 350px!important;
        width: auto!important;
        box-shadow: 2px 2px  5px 3px #888;
        }

    /*記事中の画像*/
    #article > p {
        text-indent: 1em ;
        }
    
    /*《記事中の引用文に適用》*/
    #article blockquote {
        box-shadow:1px 1px 3px 1px #999;
        margin: .3em;
        padding: 1em 1.2em;
        background: #f9fbfc;
        border-radius: 4px;
        }    
    
}