/*----------------------------------
便利設定
----------------------------------*/

body {
    margin: 0;
    padding: 0;
    background: url('https://xn--o9jm342uiqa336buugl5ot2h4u6bi7x.com/wp-content/themes/responsive_078/images/bg.png');
    font: 12px/1.5 "Lucida Sans Unicode", "Lucida Grande","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
    color: #333333;
    line-height: 1.8;
}

.clear {
    clear: both;
}

a {
    color: #bc477d;
    text-decoration: underline;
}

a:hover {
    color: #bc477d;
    text-decoration: none;
}

.back-black {
    background: #000000;
}

.back-silver {
    background: #C0C0C0;
}

.back-gold {
    background: #FFD700;
}

.back-pink {
    background: #F2A1A9;
}

.back-red {
    background: #ff0000;
}

.back-beige {
    background: #F1DBB1;
}

.back-green {
    background: #008000;
}

.back-blue {
    background: #0000ff;
}

.back-purple {
    background: #800080;
}

.back-yellow {
    background: #ffff00;
}


/* This css button was generated by css-button-generator.com ここから */
.css_btn_class {
    -moz-border-radius:8px;
    -webkit-border-radius:8px;
    border-radius:8px;
    border:1px solid #cccccc;
    padding:9px 18px;
    text-decoration:none;
    background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ffffff), color-stop(100%, #f6f6f6) );
    background:-moz-linear-gradient( center top, #ffffff 5%, #f6f6f6 100% );
    background:-ms-linear-gradient( top, #ffffff 5%, #f6f6f6 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6');
    background-color:#ffffff;
    display:inline-block;
    text-shadow:1px 1px 0px #ffffff;
    -webkit-box-shadow:inset 1px 1px 0px 0px #ffffff;
    -moz-box-shadow:inset 1px 1px 0px 0px #ffffff;
    box-shadow:inset 1px 1px 0px 0px #ffffff;
}.css_btn_class:hover {
    background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #f6f6f6), color-stop(100%, #ffffff) );
    background:-moz-linear-gradient( center top, #f6f6f6 5%, #ffffff 100% );
    background:-ms-linear-gradient( top, #f6f6f6 5%, #ffffff 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff');
    background-color:#f6f6f6;
}.css_btn_class:active {
    position:relative;
    top:1px;
}
#search-button a, #search-button a:hover, #search-button a:visited{
    color: #333333;
}
/* This css button was generated by css-button-generator.com ここまで */


/*----------------------------------
ヘッダー
----------------------------------*/

#header {
    width: 100%;
}

#header-bar {
    background: url('https://xn--o9jm342uiqa336buugl5ot2h4u6bi7x.com/wp-content/themes/responsive_078/images/bgDark.png');
}

#header-description{
    color: #FFFFFF;
    width: 940px;
    font-size: 80%;
    padding: 5px 0;
    margin: 0 auto;
}

#header-frame{
    width: 940px;
    margin: 0 auto;
}

#header-logo{
    padding: 20px 0 10px 0;
    width: 275px;
}


/*----------------------------------
メイン
----------------------------------*/

#wrapper {
    width: 940px;
    margin: 0 auto;
    padding: 10px 0 0 0;
    background: #FFFFFF;
    border-radius: 10px 10px 0 0;
    box-shadow: 0 0 3px #ccc;
}


/*----------------------------------
検索ボックス
----------------------------------*/

#search-box {
    width: 580px;
    margin: 0 auto;
    padding: 5px 0 20px 0;
}

#search-header {
    margin: 0 0 5px 0;
}

#search-header-logo {
    width: 240px;
    float: left;
}

#search-header-logo a img{
    width: 240px;
}

#search-header-description {
    color: #888888;
    font-size: 95%;
    width: 300px;
    float: left;
    padding: 8px 0 0 10px;
}

#search-box form {
    margin: 0;
}

#search-input{
    width: 500px;
    float: left;
}

#search-text {
    width: 500px;
    height: 40px;
    font-size: 200%;
}

#search-button {
    width: 62px;
    float: left;
    margin: 0 0 0 5px;
}


/*----------------------------------
検索ナビ
----------------------------------*/

#search-navi-wrapper {
    width: 140px;
    padding: 0 20px 0 20px;
    float: left;
}

#search-navi {
    width: 140px;
}

.navi-title-top {
    width: 140px;
    font-size: 130%;
    font-weight: bold;
}

.navi-title {
    width: 140px;
    font-size: 130%;
    font-weight: bold;
    margin: 20px 0 0 0;
}

.navi-title-bottom {
    height: 10px;
    background: url('https://xn--o9jm342uiqa336buugl5ot2h4u6bi7x.com/wp-content/themes/responsive_078/images/bg.png') repeat;
    border-radius: 4px 4px 4px 4px;
    margin: -10px 0 0 0;
}

.navi-color {
    width: 25px;
    height: 25px;
    border-radius: 8px 8px 8px 8px;
    margin: 3px;
    float: left;
}

.navi-content {
    font-size: 110%;
}

#navi-description {
    font-size: 90%;
    color: #666666;
    padding: 10px 0;
    line-height: 1.3;
}


/*----------------------------------
検索結果
----------------------------------*/

#search-result-wrapper {
    width: 760px;
    float: right;
}

#search-result {
    padding: 0 20px 0 0;
}

#content-title {
    font-size: 180%;
    line-height: 1.3;
    padding: 0 10px 10px 10px;
    font-weight:bold;
    color:#666;
    background:url('https://xn--o9jm342uiqa336buugl5ot2h4u6bi7x.com/wp-content/themes/responsive_078/images/headingBg.png') repeat-x 0 100%;
}

.item-box {
    width: 140px;
    float: left;
    margin: 0 8px 12px 0;
    text-align: center;
    line-height: 1.3;
}

.item-image-box {
    width: 140px;
    height: 140px;
    margin: 0 auto 5px auto;
    border: 1px solid #CCCCCC;
}

.item-image {
    height: 140px;
    margin: 0 auto 5px auto;
}

.item-name {
    text-align: left;
}

.item-name a, .item-name a:hover {
    text-decoration: none;
}

.item-price {
    text-align: left;
    font-weight: bold;
    color: #000000;
}

.store-name {
    color: #666666;
    font-weight: normal;
    font-size: 90%;
}

#search-pager {
    text-align: center;
    margin: 20px auto;
}

#brand_description {
    margin: 40px auto;
    text-align: center;
    color: #666666;
}

#brand_description_title {
}

#brand_description_content {
    text-align: left;
}

#brand-list dt {
    font-size: 150%;
    text-align: center;
}

#brand-list dd {
    margin: 10px 0 40px 10px;
}



/*----------------------------------
フッター
----------------------------------*/

#footer {
    width: 940px;
    margin: 0 auto;
    padding: 0;
    border-radius: 0 0 10px 10px;
    box-shadow: 0 0 3px #ccc;
    color: #FFFFFF;
    background: url('https://xn--o9jm342uiqa336buugl5ot2h4u6bi7x.com/wp-content/themes/responsive_078/images/bgDark.png');
}

#footer-link {
    padding: 20px 10px;
}

#footer-link a, #footer-link a:hover, #footer-link a:visited {
    color: #FFFFFF;
    text-decoration: none;
}

#copyright {
    clear:both;
    text-align:center;
    font-size:90%;
}



/*----------------------------------
幅959px以下から 1カラム表示
----------------------------------*/
@media only screen and (max-width: 959px){
    #header, #header-description, #header-frame, #wrapper, #footer {width:100%;}
    #wrapper img{max-width:100%;}

    #search-navi-wrapper {
        width: 90%;
        padding: 0 10px;
        float: none;
    }

    #search-navi {
        width: 100%;
    }

    .navi-title-top {
        width: 100%;
    }

    .navi-title {
        width: 100%;
    }

    #search-result-wrapper {
        width: 90%;
        float: none;
    }

    #search-result {
        margin: 0 20px 0 20px;
        padding: 0;
    }
}



/*----------------------------------
幅640px以下から
----------------------------------*/
@media only screen and (max-width: 640px){
    #header-description {
        line-height: 1.3;
    }

    #header-frame{
        text-align: center;
    }

    #header-logo{
        padding: 10px 0 10px 0;
    }

    #search-box {
        width: 100%;
    }

    #search-header {
        margin: 0 0 5px 10px;
    }

    #search-header-description {
        padding: 0;
    }

    #search-input {
        width: 70%;
        margin: 0 0 0 10px;
    }

    #search-text {
        width: 100%;
    }

    #search-result-wrapper {
        width: 100%;
        padding: 0;
    }

    #search-result {
        margin: 0 10px;
    }

    #search-navi-wrapper {
        width: 90%;
    }

}