@media screen and (min-width:961px) {
            body {
                margin-left: auto;
                /* 左側マージンを自動的に空ける */
                margin-right: auto;
                /* 右側マージンを自動的に空ける */
                margin-top: 0px;
                /* 右側マージンを自動的に空ける */
                padding: 0px;
                /* ページ全体のpadding */
                text-align: center;
                /* 下記のautoに未対応用のセンタリング */
                width: 770px;
            }
            #zentai {
                text-align: left;
                /* 中身を左側表示に戻す */
                width: 100%;
                /* 幅を決定する */
            }
            #hatenablogcard {
                margin: 0 auto;
                width: 500px;
            }
            #hatenahtmlcode {
                width: 600px;
            }
        }
        /*tablet用のcssを記述*/

        @media only screen and (min-width:376px) and (max-width:960px) {
            body {
                margin: 0px;
            }
            #zentai {
                text-align: left;
                /* 中身を左側表示に戻す */
                /*width:100%;*/
                /* 幅を決定する */
            }
            img {
                max-width: 100%;
                height: auto;
                width/***/
                : auto;
            }
            #hatenablogcard {
                margin: 0 auto;
                width: 500px;
            }
            #hatenahtmlcode {
                width: 600px;
            }
        }
        /*スマホ用のcssを記述*/

        @media screen and (max-width:375px) {
            body {
                margin: 0px;
            }
            #zentai {
                text-align: left;
                /* 中身を左側表示に戻す */
                /*width:100%;*/
                /* 幅を決定する */
            }
            img {
                max-width: 100%;
                height: auto;
                width/***/
                : auto;
            }
            #hatenahtmlcode {
                max-width: 90%;
            }
        }

        #head {
            /*margin:auto;*/
            padding: 20px;
            background-color: #007fff;
            color: #fff;
        }

        h1 {
            font-size: 30px;
        }

        h1 a {
            font-size: 30px;
            color: #fff;
            text-decoration: none;
        }

        .iosapplink {
          display: block;
          position: relative;
          top:-13px;
        }
        .iosapplink a{
          background-color: #000;
          font-size: 15px;
          color: #fff;
          text-decoration: none;
          float:right;
          margin-bottom: 0px;
          padding-right: 10px;
          padding-left: 10px;
          padding-top: 5px;
          padding-bottom: 5px;
        }

        .main {
            /*margin:auto;*/
            border: solid 1px #000;
            padding: 10px;
            text-align: center;
        }

        input.url {
            width: 290px;
            height: 30px;
        }

        button.sakusei {
            background-color: #248;
            color: #fff;
            border-style: none;
            font-weight: bold;
            font-size: 16px;
            padding:10px 10px;
        }

        code {
            overflow: auto;
            resize: horizontal;
        }

        pre {
            overflow: auto;
            white-space: pre-wrap;
            word-wrap: break-word;
        }

        .csscode {
            text-align: center;
            border:solid 1px #000;
            word-wrap: break-word;
        }

        .csscopy {
            display: none;
        }

        button.csshyouji {
            background: #ff0000;
            color: #fff;
            font-weight: bold;
            font-size: 16px;
            padding:10px;
            margin:10px;
            border-style: none;
        }

        .prettyprint {
            text-align: left;
        }

        .footer {
            text-align: center;
            background: #cfdfff;
            color: #000000;
            margin: auto;
            padding: 5px;
            width: auto;
            height:auto;

        }

.footer li {
	display: inline-block;
	vertical-align: top;
}

        .footer a {
            color: #000000;
        }