/* <system section="theme" selected="natural"> */
    /* CSS Document */
    @import 'https://fonts.googleapis.com/css?family=Josefin+Sans:600';
@import url('https://fonts.googleapis.com/css?family=M+PLUS+Rounded+1c');
    /* @Main
    ====================================== */
    body {
      margin: 0;
      padding: 0;
      color: #5a5a5a;
      background-color: #a9a9a9;
      font-family: 'Josefin Sans', 'Gill Sans', 'Helvetica', 'Arial', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
      -moz-transition: all 1s ease;
      -webkit-transition: all 1s ease;
    }
    
    
    .codoc-entry {max-width:230px;}
    .codoc-entry .codoc-support {background:#fff;padding:1px;margin:1px;}
    .codoc-entry .codoc-support .codoc-btn {border:2px solid #000;}
    .codoc-entry .codoc-support-title {font-size:1px;height:0px;}
    
    .codoc-support .codoc-support-title 
    
    #title a, #blog-title #blog-description{
    font-family: 'M PLUS Rounded 1c', sans-serif;
    color:#4d4c61;
    font-size:31px;
   
    }
    
    .entry-title a{color:#4d4c61;}
    
    a {
      color: #111111;
      text-decoration: none;
      -webkit-transition: 0.3s ease;
      -webkit-transition-property: opacity,border,color,background;
      -moz-transition: 0.3s ease;
      -moz-transition-property: opacity,border,color,background;
      -o-transition: 0.3s ease;
      -o-transition-property: opacity,border,color,background;
      transition: 0.3s ease;
      transition-property: opacity,border,color,background;
    }
    a:hover {
      text-decoration: underline;
    }
    a:visited {
      color: #50b5b5;
    }
    pre {
      padding: 15px;
      background: #fafafa;
      border-radius: 3px;
      -webkit-border-radius: 3px;
      -moz-border-radius: 3px;
      box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    }
    /* @Container
    ====================================== */
    #container {
      text-align: center;
      margin: 60px  auto;
      width: 800px;
      padding: 50px;
      background: #fff;
      border-radius: 7px;
      -webkit-border-radius: 7px;
      -moz-border-radius: 7px;
    }
    /* @Blog-Title
    ====================================== */
    #blog-title {
      text-align: left;
      margin: 0 0 40px 0;
    }
    #blog-title h1 {
      font-size: 28 px;
      display: inline-block;
      *display: inline;
      *zoom: 1;
      font-weight: normal;
    }
    #blog-title h1 a:hover {
      text-decoration: none;
    }
    header h2 {
      color: #454545;
      text-shadow: 0 1px 0 white;
      font-size: 12px;
      margin: 0 0 0 10px;
      display: inline-block;
      *display: inline;
      *zoom: 1;
      font-weight: normal;
    }
    /* @Custom Header-image */
    .header-image-enable #blog-title #title {
      padding: 20px 0 0 20px;
    }
    /* @Top-box and Navigation Module
    ====================================== */
    #top-box,
    #top-editarea,
    #bottom-editarea {
      text-align: left;
      font-size: 13px;
    }
    .breadcrumb {
      margin-bottom: 20px;
    }
    /* @Content-Box
    ====================================== */
    #main {
      width: 650px;
      margin: 0 auto;
      text-align: center;
      position: relative;
      left: 20px;
    }
    #main-inner {
      text-align: left;
    }
    #box2 {
      width: 650px;
      -moz-transition: all 1s ease;
      -webkit-transition: all 1s ease;
      margin: 0px auto;
      position: relative;
      left: 20px;
    }
    #box2-inner {
      clear: both;
    }
    #bottom-box {
      clear: both;
    }
    #box2:after {
      content: " ";
      display: block;
      height: 0;
      visibility: hidden;
      clear: both;
    }
    /* @Section,Article
    ====================================== */
    section.day {
      margin-bottom: 40px;
    }
    .entry {
      margin: 0 0 48px 0;
      position: relative;
      width: 100%;
      -moz-transition: all 1s ease;
      -webkit-transition: all 1s ease;
    }
    .entry-header {
      padding: 0px;
      margin: 0px;
      position: relative;
      font-size: 12px;
    }
    .categories {
      margin-top: 3px;
    }
    .categories a {
      text-decoration: none;
      color: #888;
      margin-right: 15px;
    }
    .categories a:before {
      content: '\25B8';
      color: #9ed7d7;
    }
    .categories a:hover {
      text-decoration: underline;
      color: #289c9c;
    }
    .date {
      text-align: center;
      color: #000080;
      font-size: 16px;
      margin-bottom: 0.3em;
     }
    .entry-date {
      width: 60px;
      height: 75px;
      margin: 0 0 0px 0;
      position: absolute;
      left: -90px;
      top: 0px;
      font-weight: normal;
      line-height: 30px;
      border: 1px solid #000080;
      border-radius: 5px;
    }
    .entry-date a{color:#000080;}
    
    .entry-date .date-year {
      height: 20px;
      position: relative;
      top: 48px;
      margin: 0;
      display: block;
    }
    .entry-date .date-month {
      height: 20px;
      margin: 0;
      display: block;
      position: relative;
      top: -20px;
    }
    .entry-date .date-day {
      margin: 0;
      display: block;
      font-size: 30px;
      height: 35px;
      position: relative;
      top: -18px;
    }
    .entry-date .hyphen {
      display: none;
    }
    .entry-title {
      text-align: left;
      margin: 0;
      font-size: 18px;
      font-weight: normal;
      line-height: 1.3;
    }
    .entry-title a {
      position: relative;
    }
    .entry-header p {
      padding: 0;
      margin: 0;
    }
    .entry-header-menu a {
      width: 60px;
      display: block;
      text-align: center;
      padding: 5px 0;
      border: 1px solid #d7f3f3;
      font-size: 13px;
      position: absolute;
      left: -90px;
      top: 95px;
      color: #289c9c;
      border-radius: 5px;
    }
    .entry-header-menu a:hover {
      background: #F0F9F9;
      text-decoration: none;
    }
    .entry .entry-category-area {
      padding: 5px 0;
      margin: 0;
      color: #aaa;
      font-size: 70%;
    }
    .entry .entry-category a {
      color: #454545;
      margin-left: 5px;
      background: #fff;
      padding: 3px 6px;
      border: 1px solid #ddd;
      border-radius: 3px;
      -webkit-border-radius: 3px;
      -moz-border-radius: 3px;
    }
    .entry .entry-category :hover {
      color: #fff;
      text-decoration: none;
      background: -moz-linear-gradient(top, #3888da 0%, #256fba 100%);
      border: 1px solid #256fba;
    }
    .entry-footer {
      display: block;
      margin-top: 30px;
      color: #454545;
      font-size: 13px;
    }
    .entry-footer .social-buttons {
      margin: 10px 0;
    }
    .entry-footer-section {
      color: #aaa;
      padding-bottom: 8px;
      margin: 0;
    }
    .entry-footer-section .author {
      font-size: 14px;
    }
    .entry-footer-time,
    .entry-footer-comments,
    .entry-footer-trackbacks {
      text-transform: uppercase;
    }
    .pager {
      margin-bottom: 30px;
      text-align: left;
    }
    .pager a {
      display: inline;
      font-size: 12px;
      font-weight: normal;
      margin: 10px 0;
      padding: 1px;
      border-bottom: 3px solid #E1F5F5;
      color: #289C9C;
      text-transform: uppercase;
      -webkit-transition: 0.3s ease;
      -webkit-transition-property: opacity,border,color,background;
      -moz-transition: 0.3s ease;
      -moz-transition-property: opacity,border,color,background;
      -o-transition: 0.3s ease;
      -o-transition-property: opacity,border,color,background;
      transition: 0.3s ease;
      transition-property: opacity,border,color,background;
      line-height: 1.5;
      word-wrap: break-word;
      display: inline-block;
      max-width: 300px;
    }
    .pager a:hover {
      text-decoration: none;
      border-bottom: 3px solid #6ccccc;
    }
    .pager-prev {
      margin-right: 1em;
    }
    #google_afc_user .visible_url a {
      text-transform: uppercase;
    }
    /* @Entry TextStyle
    ====================================== */
    .entry-content {
      font-size: 13px;
      line-height: 1.8;
      margin: 0.5em 0;
      font-family: 'Helvetica', 'Arial', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    }
    .entry-content a {
      color: #ea80a8;
    }
    .entry-content img {
      max-width: 650px;
    }
    .entry-content p {
      margin: 0.8em 0;
    }
    .entry-content h1,
    .entry-content h2,
    .entry-content h3,
    .entry-content h4,
    .entry-content h5,
    .entry-content h6 {
      margin: 1em 0 0.5em 0;
    }
    .entry-content h1 {
      font-size: 160%;
    }
    .entry-content h2 {
      font-size: 150%;
    }
    .entry-content h3 {
      font-size: 140%;
    }
    .entry-content h4 {
      font-size: 120%;
    }
    .entry-content h5 {
      font-size: 110%;
    }
    .entry-content h6 {
      font-size: 100%;
    }
    .entry blockquote {
      padding: 15px;
      margin: 1em 0;
      border: 1px solid #ddd;
      border-radius: 3px;
      -webkit-border-radius: 3px;
      -moz-border-radius: 3px;
    }
    .entry blockquote p {
      margin-top: 0;
      margin-bottom: 0;
    }
    .entry-content ul,
    .entry-content ol {
      margin: 0 0 0 1.5em;
      padding: 0;
    }
    .entry-content table {
      border-collapse: collapse;
      border-spacing: 0;
    }
    .entry-content table th,
    .entry-content table td {
      border: 1px solid #ddd;
      padding: 5px 10px;
    }
    .entry-content table th {
      background: #fafafa;
    }
    a.keyword {
      color: #5A5A5A;
      text-decoration: none;
      border-bottom: 1px solid #DEDEDE;
    }
    pre.lang-aa {
      font-size: 12px;
      line-height: 13px;
    }
    /* @Comment
    ====================================== */
    .entry-comment {
      border-top: 1px dashed #289c9c;
    }
    .entry-comment:nth-child(1) {
      border-top: 1px dashed #289c9c;
    }
    .entry-comment:last-child {
      border-bottom: 1px dashed #289c9c;
    }
    .comment {
      margin: 0 0 10px 0;
      padding: 0;
    }
    .comment li {
      list-style: none;
      padding: 8px 0;
    }
    .comment-user-name {
      margin: 0;
      font-size: 14px;
    }
    .comment-content {
      line-height: 1.7;
      font-family: 'Helvetica', 'Arial', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    }
    .comment-content p {
      margin: 0.5em 0;
      word-wrap: break-word;
    }
    .comment-metadata {
      display: inline;
      color: #aaa;
      text-transform: uppercase;
    }
    .comment-metadata a {
      color: #aaa;
      text-transform: uppercase;
    }
    .leave-comment-title {
      font-size: 12px;
      font-weight: normal;
      margin: 10px 0;
      padding: 1px;
      display: inline;
      border-bottom: 3px solid #f0cbe3;
      color: #ea80a8;
      text-transform: uppercase;
      -webkit-transition: 0.3s ease;
      -webkit-transition-property: opacity,border,color,background;
      -moz-transition: 0.3s ease;
      -moz-transition-property: opacity,border,color,background;
      -o-transition: 0.3s ease;
      -o-transition-property: opacity,border,color,background;
      transition: 0.3s ease;
      transition-property: opacity,border,color,background;
    }
    .leave-comment-title:hover {
      border-bottom: 3px solid #ea80a8;
      text-decoration: none;
    }
    /* @Module
    ====================================== */
    .hatena-module {
      font-size: 12px;
      text-align: left;
      margin-bottom: 50px;
    }
    .hatena-module-title,
    .hatena-module-title a,
    .hatena-module-title a:hover,
    .hatena-module-title a:visited {
      text-align: left;
      font-size: 18px;
      font-weight: normal;
      margin-bottom: 30px;
      padding-bottom: 3px;
      color: #000080;
    }
    .hatena-module-body ul {
      margin: 0;
      padding: 0;
      list-style: none;
      line-height: 1.5;
    }
    #box2 .hatena-module {
      width: 160px;
      float: left;
      margin-right: 50px;
    }
    #box2 .hatena-module-body ul li {
      padding: 0.4em 0;
    }
    .hatena-module-body ul li {
      padding: 0.8em 0;
    }
    .hatena-module-body ul li a {
      color: #5A5A5A;
    }
    .hatena-module-body ul li a:hover {
      color: #db86bd;
    }
    .hatena-module li.archive {
      margin-top: 10px;
    }
    .hatena-module li.archive a {
      color: #289C9C;
    }
    .urllist-item {
      border-bottom: 1px solid #ddd;
    }
    /* @Module::Profile
    ====================================== */
    .hatena-module-profile .id {
      display: block;
      line-height: 2;
      font-size: 14px;
    }
    .hatena-module-profile .id a {
      color: #db86bd;
      font-size: 16px;
    }
    .profile-icon {
      border: 1px solid #ccc;
    }
    .hatena-module-profile .profile-description {
      margin: 0 0 10px 0;
      line-height: 1.5;
    }
    /* @Module::Search
    ====================================== */
    form.search-form {
      margin-top: 10px;
    }
    form.search-form input {
      border: 1px solid #c2e2e2;
      vertical-align: middle;
    }
    .search-form .search-module-input {
      width: 110px;
      padding: 3px;
      margin: 0;
      font-size: 12px;
      border-radius: 12px;
      -webkit-border-radius: 12px;
      -moz-border-radius: 12px;
    }
    .search-form .search-module-button {
      height: 23px;
      width: 23px;
      border: none;
      text-indent: -999px;
      margin-left: -3px;
      *margin-left: -3px;
      cursor: pointer;
      background: #c2e2e2 url('https://cdn.blog.st-hatena.com/images/theme/search_w.png?version=aea1a28e6f753353077a798593744c') 50% 50% no-repeat;
      border-radius: 12px;
      -webkit-border-radius: 12px;
      -moz-border-radius: 12px;
    }
    /* @Footer-Area-Module
    ====================================== */
    #footer-box {
      clear: both;
    }
    #footer-area1,
    #footer-area2,
    #footer-area3,
    #footer-area4 {
      width: 220px;
      float: left;
    }
    #footer-area1,
    #footer-area2,
    #footer-area3 {
      margin-right: 40px;
    }
    #footer-area4:after {
      content: "";
      display: block;
      height: 0;
      visibility: hidden;
      clear: both;
    }
    /* @Footer
    ====================================== */
    #footer {
      clear: both;
      text-align: center;
      padding: 10px 0 10px 0;
      font-size: small;
      margin: auto 1em;
    }
    #footer a {
      color: #454545;
    }
    #footer a:hover {
      color: #256fba;
      text-decoration: none;
    }
    /* @HATENA-EMBED
    ====================================== */
    /* ---STANDARD
    .hatena-embed {
        padding-left: 20px;
        margin: 1em 0;
    }
    
    .hatena-embed.fotolife,
    .hatena-embed.twitpic {
    padding:0;
    margin:0;
    border: none;
    background: transparent;
    display: inline;
    }
    
    .hatena-embed.hatena-bookmark {
    background:url('https://cdn.blog.st-hatena.com/images/admin/curation/services/hatena-bookmark.png?version=aea1a28e6f753353077a798593744c') no-repeat left 3px;
    }
    
    .hatena-embed.foursquare {
    background:url('https://cdn.blog.st-hatena.com/images/admin/curation/services/foursquare.png?version=aea1a28e6f753353077a798593744c') no-repeat left 3px;
    }
    
    .hatena-embed.hatena-coco {
    background:url('https://cdn.blog.st-hatena.com/images/admin/curation/services/hatena-coco.png?version=aea1a28e6f753353077a798593744c') no-repeat left 3px;
    }
    
    .hatena-embed.hatena-haiku {
    background:url('https://cdn.blog.st-hatena.com/images/admin/curation/services/hatena-haiku.png?version=aea1a28e6f753353077a798593744c') no-repeat left 3px;
    }
    
    .hatena-embed.twitter {
    background:url('https://cdn.blog.st-hatena.com/images/admin/curation/services/twitter.png?version=aea1a28e6f753353077a798593744c') no-repeat left 3px;
    }
    
    */
    /* @HATENA-EMBED(FOTOLIFE,TWITPIC)
    ====================================== */
    .hatena-embed.hatena-fotolife,
    .hatena-embed.twitpic {
      padding: 10px 10px 30px 10px;
      margin: 1em 0;
      background: transparent;
      display: inline-block;
      border: 1px solid #dfdfdf;
      box-shadow: 0 1px 5px rgba(0, 0, 0, 0.16);
      background: #fff;
      text-align: center;
    }
    .hatena-embed.hatena-fotolife {
      background: #fff url('https://cdn.blog.st-hatena.com/images/theme/hatena-embed/embed-fotolife.png?version=aea1a28e6f753353077a798593744c') no-repeat right bottom;
    }
    .hatena-embed.twitpic {
      padding: 10px 10px 10px 10px;
    }
    .hatena-embed.hatena-fotolife .hatena-embed-image,
    .hatena-embed.twitpic .hatena-embed-image {
      display: inline-block;
      max-width: 600px;
    }
    .hatena-embed.hatena-fotolife .hatena-embed-body,
    .hatena-embed.hatena-fotolife .hatena-embed-body a,
    .hatena-embed.twitpic .hatena-embed-body,
    .hatena-embed.twitpic .hatena-embed-body a {
      text-align: center;
      font-family: 'Homemade Apple', cursive;
      color: #454545;
      font-size: 16px;
      margin-top: 10px;
    }
    /* @HATENA-EMBED(COCO,4SQ)
    ====================================== */
    .hatena-embed.hatena-coco,
    .hatena-embed.foursquare {
      margin: 1em 0;
      box-shadow: 0 1px 5px rgba(0, 0, 0, 0.16);
    }
    .hatena-embed.hatena-coco {
      border: 1px solid #e2d279;
      padding: 20px 30px;
      background: #faf9e6 url('https://cdn.blog.st-hatena.com/images/theme/hatena-embed/embed-coco.png?version=aea1a28e6f753353077a798593744c') no-repeat right bottom;
    }
    .hatena-embed.hatena-coco .hatena-embed-image,
    .hatena-embed.foursquare .hatena-embed-image {
      width: 100px;
      height: 100px;
    }
    .hatena-embed.foursquare {
      border: 1px solid #C1D5DB;
      padding: 20px 30px;
      background: #E6EFF2 url('https://cdn.blog.st-hatena.com/images/theme/hatena-embed/embed-4sq.png?version=aea1a28e6f753353077a798593744c') no-repeat right bottom;
    }
    /* @HATENA-EMBED(BOOKMARK)
    ====================================== */
    .hatena-embed.hatena-bookmark {
      padding: 15px 15px 15px 70px;
      margin: 1em 0;
      background: transparent;
      border: 1px solid #dfdfdf;
      box-shadow: 0 1px 5px rgba(0, 0, 0, 0.16);
      background: #fff url('https://cdn.blog.st-hatena.com/images/theme/hatena-embed/embed-bookmark.png?version=aea1a28e6f753353077a798593744c') no-repeat 10px top;
      position: relative;
    }
    .hatena-embed.hatena-bookmark a {
      text-decoration: underline;
    }
    .hatena-embed.hatena-bookmark .hatena-embed-image {
      max-height: 50px;
    }
    /* @HATENA-EMBED(HAIKU)
    ====================================== */
    .hatena-embed.hatena-haiku {
      padding: 15px 15px 15px 70px;
      margin: 1em 0;
      background: transparent;
      border: 1px solid #dfdfdf;
      box-shadow: 0 1px 5px rgba(0, 0, 0, 0.16);
      background: #fff url('https://cdn.blog.st-hatena.com/images/theme/hatena-embed/embed-haiku.png?version=aea1a28e6f753353077a798593744c') no-repeat 5px 5px;
    }
    /* @HATENA-EMBED(MONOLITH)
    ====================================== */
    .hatena-embed.hatena-monolith {
      width: 580px;
      padding: 15px;
      margin: 1em 0;
      background: transparent;
      border: 1px solid #dfdfdf;
      box-shadow: 0 1px 5px rgba(0, 0, 0, 0.16);
      background: #fff url('https://cdn.blog.st-hatena.com/images/theme/hatena-embed/embed-monolith.png?version=aea1a28e6f753353077a798593744c') no-repeat right bottom;
    }
    .hatena-embed.hatena-monolith .hatena-embed-image {
      display: block;
      float: left;
      max-width: 98px;
      border: 1px solid #dfdfdf;
    }
    .hatena-embed.hatena-monolith .hatena-embed-body {
      float: left;
      width: 470px;
      margin-left: 10px;
    }
    .hatena-embed.hatena-monolith:after {
      content: "";
      display: block;
      height: 0;
      visibility: hidden;
      clear: both;
    }
    /* @HATENA-EMBED(TWITTER)
    ====================================== */
    .hatena-embed.twitter {
      padding: 10px 0;
      margin: 1em 0;
      border-bottom: 1px dotted #757575;
      border-top: 1px dotted #757575;
    }
    /* @HATENA-EMBED(ATND)
    ====================================== */
    .hatena-embed.atnd {
      padding: 10px 0;
      margin: 1em 0;
      border-bottom: 1px dotted #757575;
      border-top: 1px dotted #757575;
      font-family: 'PT Sans Caption', Helvetica, 'ヒラギノ角ゴ Pro W3', 'HiraKakuProN-W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
    }
    .hatena-embed-detail.atnd-detail {
      font-size: 20px;
      font-weight: bold;
      color: #262626;
    }
    .hatena-embed-detail.atnd-detail:hover {
      color: #EA1F00;
      text-decoration: none;
    }
    .hatena-embed.atnd .content-body {
      font-size: 12px;
      color: #222;
    }
    /* @About
    ====================================== */
    .page-about dt {
      font-size: 14px;
      color: #289C9C;
    }
    .page-about dd {
      margin-left: 0;
      margin-bottom: 30px;
    }
    /* @Archive
    ====================================== */
    .page-archive #main-inner section {
      padding-bottom: 40px;
    }
    .page-archive .archive-entry .date {
      width: auto;
      border: none;
      height: auto;
      text-align: left;
      position: static;
    }
    .page-archive .archive-entry .entry-title {
      font-size: 18px;
      margin: 0 0 0.3em 0;
      line-height: 1.5;
    }
    .page-archive .archive-entry p {
      font-size: 12px;
      margin: 1em 0;
    }
    
    /* </system> */
    
    /* <system section="background" selected="default"> */
    /* default */
    /* </system> */
    #wrapper {
        float: left;
        width: 620px;
    }
    
    #box2 {
        float: left;
        text-align: left;
        transition: all 1s ease 0s;
        width: 180px;
    }
    #container {
        width: 1000px;
        overflow : hidden;
    }
    #wrapper {
        float: left;
        width: 820px;
    }
    
    #box2 {
        float: left;
        text-align: left;
        transition: all 1s ease 0s;
        width: 180px;
    }

.profile-description {
font-size:15px;
text-align: left;
}



.haten-urllist a{
font-size:16px;
text-align: left;
}

.hatena-module-body a{
font-size:12px;
text-align: left;
}