@charset "UTF-8";

/* =======================================
　　カラムのコントロール
======================================= */

@media screen and (max-width: 480px) {
    .cc-m-hgrid-column {
        width: 100% !important; /*スマートフォン表示では縦並びにする*/
    }
}



/* =======================================
　　表のコントロール
======================================= */

table {
    width: 100%; /*表の全体幅をコンテンツ幅一杯まで広げる*/
    border-collapse: collapse; /*線を重ねる。外側の余白もJimdo側で設定したい場合はこの記述を消す*/
}


/* =======================================
　　水平線のコントロール
======================================= */

.hr {
    border-bottom-width: 1px;
    border-color: #666666;
    height: 1px;
    border-bottom-style: solid !important; /*罫線*/
}


/* =======================================
　　リストのコントロール（リスト・定義リストの調整）
======================================= */

.j-text ol, .j-text ul {
    margin-top: .5rem;
    margin-bottom: .5rem;
    padding-left: 2rem;
}
.j-text ol li, .j-text ul li {
    padding-right: 0 !important;
    right: 0 !important;
}
.j-text dd {
    margin: 0;
}



/* =======================================
　　画像のコントロール
======================================= */

figcaption {
    font-size: 1.2rem !important; /*キャプションの文字サイズ*/
}


@media screen and (max-width: 480px) {
    .cc-m-textwithimage .cc-m-image-align-1, .cc-m-textwithimage .imgleft, .j-textWithImage .cc-m-image-align-1, .j-textWithImage .imgleft
    .cc-m-textwithimage .cc-m-image-align-2, .cc-m-textwithimage .imgright, .j-textWithImage .cc-m-image-align-2, .j-textWithImage .imgright {
        margin: .4rem 0 !important; /*画像つき文章のスマホ時の余白調整）*/
    }
}



/* =======================================
　　ブログのコントロール
======================================= */

/*ブログページの調整ここから*/
a.j-blog-page--tag {/*テーマのリンク*/
    text-decoration: none !important;
}
.j-blog-meta a:hover {/*ブログタイトルのリンクマウスオン時*/
    color: #333;
}
.j-blog-meta h2 {/*ブログタイトル*/
    margin: 0 !important;
    font-size: 2.2rem !important;
}
/*ブログページの調整ここまで*/


/*ブログ記事のフォーム・ゲストブック・ブログコメント欄の調整ここから*/
dl.zend_form>div {
    margin-bottom: 2rem;/*要素ごとの上下間隔*/
}

input[type=text], input[type=email], input[type=date],select, textarea {
    font-size: 16px !important;/*:iPhoneでクリック時に拡大することを避ける*/
}

.j-formnew input, .j-formnew textarea,/*フォームBOX枠*/
.j-comment input, .j-comment textarea /*ゲストブックBOX枠*/{
    border: 1px solid #666 !important;
}

label input[type=radio],label input[type=checkbox],.cc-m-form-view-input-wrapper input[type=checkbox] {/*ラジオボタン・シングル＆複数チェックボックス*/
    width: 20px !important;
    height: 20px !important;
    vertical-align: middle !important;
}

ul.com-list-noava li {/*デザイン的に不要な区切りボーダーの削除（ゲストブック＆ブログ）*/
    border: none !important;
}

button.button, input[type=button], input[type=submit] {/*送信ボタン*/
    padding: .2rem 2rem !important;
    margin: 1rem 0 0 !important;
    font-size: 15px !important;
}

dl.zend_form input[type=checkbox] {/*ブログのコメント欄のプライバシーポリシーチェックボックス*/
    width: 20px !important;
    height: 20px !important;
    vertical-align: middle !important;
}

/*ブログ記事のフォーム・ゲストブック・ブログコメント欄の調整ここまで*/



/*------ ブログ記事の編集画面を１カラムに（2カラム時のサイドバーを非表示）ここから ------*/
@media screen and (min-width: 769px) {
    
    /*ブログ記事編集画面*/
    .cc-page.cc-page-blog main {
        max-width: 810px; /* ※ブログ記事プレビューの幅に合わせる*/
        width: 100%;
        margin: 0 auto;
    }
    .cc-page.cc-page-blog aside {
        display: none;
    }
    
    
    /*ブログ記事プレビュー*/
    .cc-page.cc-page-blog.cc-pagemode-default main {
        max-width: 810px; /* ※ブログ記事編集画面の幅もここの値に合わせる*/
        width: 70%;
        margin: 0;
        min-height: 50rem;
        padding: 3rem;
        background: #FFF;
        box-sizing: border-box;
    }
    .cc-page.cc-page-blog.cc-pagemode-default aside {
        display: block;
    }
}

/*------ ブログ記事の編集画面を１カラムに（2カラム時のサイドバーを非表示）ここまで ------*/



/* =======================================
　　ショップのコントロール
======================================= */

/*商品ここから*/
@media screen and (min-width: 481px) {
    /*画像*/
    .cc-shop-product-img {
        float: left;
        max-width: 50%;
        min-width: 0;
    }
    
    /*テキスト*/
    .cc-shop-product-desc {
        overflow: hidden;
        padding-top: 0;
    }
}

@media screen and (max-width: 480px) {
    .cc-shop-product-img {
        max-width: 100% !important;
        width: 100% !important;
        margin-right: 0 !important;
        min-width: 100% !important;
    }
    .cc-shop-product-img-confines {
        width: 100% !important;
        margin-bottom: 1rem;
    }
    
    .sz-lens, .sz-stage {
        visibility: hidden !important;
    }
    .sz-thumb {
        cursor: crosshair!important;
        cursor: default !important;
    }
    .cc-shop-product-desc {
        overflow: visible !important;
    }
}
/*商品ここまで*/


/*商品カタログここから*/
@media screen and (max-width: 480px) {
    .cc-webview-product .cc-webview-product-image {
        width: 100% !important;
    }
}
/*商品カタログここまで*/


/*カートアイコンここから*/
.j-cart {/*アイコン位置*/
    top: 6rem !important;
    right: .5rem !important;
}
.j-cart.is-empty {
    display: none;/*カラのときは非表示に*/
}
/*カートアイコンここまで*/



/* =======================================
　　その他コントロール
======================================= */

/*------ パスワード保護領域ここから ------*/

/*パスワード保護入力フォーム*/
input[type=password] {
    font-size: 2rem !important;
}

/*------ パスワード保護領域ここまで ------*/


/*------ フッターリンクエリアここから ------*/
@media screen and (max-width: 480px) {
    #contentfooter {
        display: flex;
        flex-direction: column;
    }
    .leftrow {
        width: 100% !important;
    }
    .rightrow {
        width: 100% !important;
        display: none;
    }
    .jimdo-free-footer-ad.jimdo-kddi-footer {
        display: flex;
        flex-direction: column;
    }
    a.jimdo-footer-branding.pull-left {
        width: 100% !important;
    }
    p.pull-left {
        margin: 3.5rem 0 0 !important;
    }
}
/*------ フッターリンクエリアここまで ------*/


/*----- ※注：フリープランにおいて、CSS等で広告を強制的に非表示とすることは規約で禁止されています。 ------*/