@charset "UTF-8";

    body {
        /*
        margin: 0;
        padding: 0;
        color: #333333;
        background: #cccccc;
        font-size: 16px;
        font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック',sans-serif;
        */
        /* iphone */
        /* -webkit-text-size-adjust: none; */
        
        margin: 0;
        padding: 0;
        color: #333333;
        background: #cccccc;
        font-size: 12px;
        font-family: font-family: Arial,sans-serif;
        min-width: 320px;
        
         /* iphone */
        -webkit-text-size-adjust: none;
    }

    img {
        vertical-align: bottom;
    }

    a {
        overflow: hidden;
        outline: none;
    }

    a img { 
        border: 0;
    }

    a {
        color: #333333;
        text-decoration: none; 
    }
    a:hover {
        color: #777777;
        text-decoration: none; 
    }
    
    .visible-desktop {
        /* display: block; */
        display: none;
    }

    .visible-phone {
        /* display: none; */
        display: block;
    }

    .hidden-desktop {
        /* display: none; */
        display: block;
    }

    .hidden-phone {
        /* display: block; */
        display: none;
    }

    div.error-message {
        color: #ff0000;
        background-image: none !important;
    }

    h1#title {
        display: none;
    }

    #header {
        /*
        width: 500px;
        margin: 0 auto;
        */
        width: auto;
        margin: 0 auto;
    }

    #body {
        /*
        width: 500px;
        margin: 0 auto;
        */
        width: auto;
        margin: 0 auto;
    }

    #footer {
        /*
        width: 500px;
        margin: 0 auto;
        */
        width: auto;
        margin: 0 auto;
    }

    div.whole {
        /*
        width: 480px;
        margin: 0 auto;
        */
        width: auto;
        margin: 0 10px;
    }
    
    #header div.whole {
        /*
        width: 480px;
        margin: 0 auto;
        */
        width: auto;
        margin: 0;
    }

    #header div.adBox {
        /*
        margin-top: 15px;
        height: 72px;
        background-image: url('../../img/ad-box.png');
        background-position: 0 0;
        background-repeat: no-repeat;
        */
        margin-top: 0px;
        height: 50px;
        background-image: none;
        background-position: 0 0;
        background-repeat: no-repeat;
    }
    
    #header div.adBox div.ad {
        /*
        padding: 6px;
        width: 468px;
        height: 60px;
        */
        padding: 0;
        width: 320px;
        height: 50px;
        margin: 0 auto;
    }

    #header div.blankBox {
        margin-top: 15px;
        height: 128px;
    }

    #body div.navi {
        /*
        height: 40px;
        */
        height: 36px;
    }
    
    #body div.navi div.breadcrumb {
        /*
        line-height: 42px;
        font-size: 12px;
        float: left;
        height: 40px;
        overflow: hidden;
        */
        font-size: 12px;
        float: left;
        line-height: 36px;
        height: 36px;
        overflow: hidden;
    }

    #body div.navi div.breadcrumb a {
        display: inline;
        color: #333333;
        line-height: 36px;
        height: 36px;
        /* border-bottom: 1px solid #333333; */
    }
    
    @-moz-document url-prefix() {
        #body div.navi div.breadcrumb a {
            display: inline;
        }
    }
    
    @media screen and (-webkit-min-device-pixel-ratio:0) {
        #body div.navi div.breadcrumb a {
            display: inline;
        }
    }
    
    #body div.navi div.breadcrumb a:hover {
        color: #777777;
        /* border-bottom: 1px solid #777777; */
    }

    #body div.navi div.pagination {
        /*         
        line-height: 42px;
        font-size: 12px;
        float: right;
        height: 40px;
        overflow: hidden;
        */
        line-height: 36px;
        font-size: 12px;
        float: right;
        height: 36px;
        overflow: hidden;
    }

    #body div.navi div.pagination ul li {
        /* 
        float: left;
        margin-left: 25px;
         */
        float: left;
        display: block;
        margin-left: 5px;
        margin-top: 5px;
        width: 50px;
        height: 26px;
        line-height: 26px;
    }

    #body div.navi div.pagination a {
       /* 
        color: #333333;
         */
        /* border-bottom: 1px solid #333333; */
        display: block;
        width: 50px;
        height: 26px;
        line-height: 26px;
    }
    #body div.navi div.pagination a:hover {
        color: #777777;
        /* border-bottom: 1px solid #777777; */
    }

    #body div.paperBox {
        
    }

    #body div.paperBox div.boxTitle {
        /* 
        height: 10px;
        background-color: #ffffff;
        background-image: url('../../img/paper_top.png');
        background-position: 0 0;
        background-repeat: no-repeat;
        */
        height: 10px;
        background-color: #ffffff;
        background-image: url('../../img/sp/paper_top_l.png'), url('../../img/sp/paper_top_r.png'), url('../../img/sp/paper_top_c.png');
        background-position: 0 0, 100% 0, 0 0;
        background-repeat: no-repeat, no-repeat, repeat-x;
        background-size: 10px 43px, 10px 43px, 1px 43px;
        -webkit-background-size: 10px 43px, 10px 43px, 1px 43px;
        -moz-background-size: 10px 43px, 10px 43px, 1px 43px;
        -o-background-size: 10px 43px, 10px 43px, 1px 43px;
    }
    
    #body div.paperBox div.boxContent {
        /* 
        background-color: #ffffff;
        background-image: url('../../img/paper_middle.png');
        background-position: 0 0;
        background-repeat: repeat-y;
        */
        background-color: #ffffff;
        background-image: url('../../img/sp/paper_middle.png');
        background-position: 0 0;
        background-repeat: repeat;
        background-size: 1px 1px;
        -webkit-background-size: 1px 1px;
        -moz-background-size: 1px 1px;
        -o-background-size: 1px 1px;
    }
    
    #body div.paperBox div.boxFooter {
        /* 
        height: 10px;
        background-color: #ffffff;
        background-image: url('../../img/paper_bottom.png');
        background-position: 0 100%;
        background-repeat: no-repeat;
         */
        height: 10px;
        background-color: #ffffff;
        background-image: url('../../img/sp/paper_bottom_l.png'), url('../../img/sp/paper_bottom_r.png'), url('../../img/sp/paper_bottom_c.png');
        background-position: 0 100%, 100% 100%, 0 0;
        background-repeat: no-repeat, no-repeat, repeat-x;
        background-size: 10px 44px, 10px 44px, 1px 44px;
        -webkit-background-size: 10px 44px, 10px 44px, 1px 44px;
        -moz-background-size: 10px 44px, 10px 44px, 1px 44px;
        -o-background-size: 10px 44px, 10px 44px, 1px 44px;
    }

    #body div.socialButtons {
        /* 
        padding: 0 30px;
        height: 35px;
         */
        padding: 0 10px;
        height: 31px;
        overflow: hidden;
    }

    #body div.socialButtons ul li {
        float: left;
        margin-right: 20px;
    }
    
    #footer div.whole {
        /*
        width: 480px;
        margin: 0 auto;
        */
        width: auto;
        margin: 0;
    }
    
    #footer div.adBox {
        /*
        margin-top: 15px;
        height: 72px;
        background-image: url('../../img/ad-box.png');
        background-position: 0 0;
        background-repeat: no-repeat;
        */
        margin-top: 0px;
        height: 50px;
        background-image: none;
        background-position: 0 0;
        background-repeat: no-repeat;
    }
    
    #footer div.adBox div.ad {
        /*
        padding: 6px;
        width: 468px;
        height: 60px;
        */
        padding: 0;
        width: 320px;
        height: 50px;
        margin: 0 auto;
    }

    #footer p.link {
        height: 34px;
        line-height: 34px;
        text-align: right;
        font-size: 12px;
        
    }

    #footer p.link a {
        color: #666666;
        /* border-bottom: 1px solid #666666; */
    }
    #footer p.link a:hover {
        color: #888888;
        /* border-bottom: 1px solid #888888; */
    }
