@charset "utf-8";

/* CSS Document */






/********************************************************************/



/* HTMLタグ要素 */



/********************************************************************/



body {

    padding: 0px;

    margin: 0px;

    background-color: #FFFFFF;

    color: #333333;

}



A,

A:link,

A:visited,

A:hover,

A:active {

    color: #666666;

    text-decoration: none;

    font-weight: bold;

    outline: none;

}



.use_hover A:hover {

    color: #333333;

}



h1,

h2,

h3,

h4,

h5,

h6 {

    font-weight: bold;

    margin-bottom: 5px;

}



h1 {

    font-size: 161.6%;

}



h2 {

    font-size: 146.5%;

}



h3 {

    font-size: 131%;

}



h4 {

    font-size: 123.1%;

}



h5 {

    font-size: 116%;

}



h6 {

    font-size: 108%;

}





/********************************************************************/



/* 大外 */



/********************************************************************/



#container {

    font-size: 108%;

}





/********************************************************************/



/* トップページコンテンツ */



/********************************************************************/



.main_box,

.side_box {

    margin-bottom: 50px;

}



.recently .section_title h2 {

    padding-left: 80px;

}



.main_recently_item_box {

    padding-top: 15px;

}



@media screen and (max-width: 710px) {

    .recently .section_title h2 {

        padding-left: 0px;

        padding-right: 0px;

    }



    .page_title_right_edge .global_btn,

    .section_title_right_edge .inner_title_btn {

        top: 0%;

        right: 10px;

    }

    

    .page_title_right_edge .global_iconleft .general_btn,

    .section_title_right_edge .global_iconleft .general_btn {

        padding: 0px 5px;

    }

}



/* もっと見る */

.top_page_body .general_btn,

.free_page_body .general_btn {

    padding: 10px 20px;

    border-radius: 25px;

}



/* 自由記入欄 */

#contents_top .custom_space,

#contents_bottom .custom_space,

#footer_free_top .custom_space,

#min_contents_bottom .custom_space {

    padding: 5px;

}





/********************************************************************/



/* キャッチフレーズ欄 */



/********************************************************************/



/* キャッチフレーズ */

.copy {

    min-height: 18px;

    padding: 5px 5px 0px;

    font-size: 85%;

}





/********************************************************************/



/* ヘッダー */



/********************************************************************/



#header {

    position: relative;

    background-color: #FFFFFF;

}



/* 検索ボタン */

.search_form .btn_color_common {

    background-color: #A6A6A6;

    color: #FFFFFF;

}



.search_form .btn_color_common,

.search_form A.btn_color_common:link,

.search_form A.btn_color_common:visited,

.search_form A.btn_color_common:hover,

.search_form A.btn_color_common:active {

    border-radius: 5px;

}





/********************************************************************/



/* ショップ名 */



/********************************************************************/



/* ショップ名ロゴ */

.shoplogo {

    padding: 5px;

}



.use_hover .shoplogo A:hover img {

    opacity: 0.8;

}



/* ショップ名テキスト */

.shoptext {

    padding: 5px 0px;

    min-height: 40px;

    margin-right: auto;

}



.shoptext A {

    font-size: 116%;

    margin: 0px;

}





/********************************************************************/



/* 文字サイズ */



/********************************************************************/



.font_setting {

    padding: 5px 5px 10px;

    text-align: center;

}



.header_font_setting .set_font_title {

    color: #000000;

}



/* 文字サイズ画像 */

.set_font_normal,

.set_font_large {

    width: 45px;

    height: 30px;

    background-repeat: no-repeat;

    background-position: left top;

    -webkit-background-size: 45px 60px;

    background-size: 45px 60px;

}



/* 普通画像 */

.set_font_normal {

    background-image: url(../images/font_default.gif);

}



/* 大画像 */

.set_font_large {

    margin-left: 5px;

    background-image: url(../images/font_large.gif);

}



/* 文字サイズ画像マウスオーバー、選択中 */

.use_hover .font_setting .set_font_normal:hover,

.use_hover .font_setting .set_font_large:hover,

.font_setting .nav_on {

    background-position: left bottom;

}





/********************************************************************/



/* ヘッダーナビ */



/********************************************************************/



/* 各ナビゲーション */

.inner_header_nav .nav_btn {

    color: #666666;

}



.use_hover .inner_header_nav .nav_btn:hover {

    background-color: #EAEAEA;

}





/*************************************************************/



/* 検索 */



/*************************************************************/



.search_bar .search {

    background-color: #F5F5F5;

}





/*************************************************************/



/* グローバルナビゲーション */



/*************************************************************/



.global_nav {

    border-bottom: 1px solid #A6A6A6;

}



/* 各ナビゲーション */

.inner_global_nav .nav_btn {

    background-image: url(../images/navi_line_bg.gif);

    background-position: right center;

    background-repeat: no-repeat;

    color: #000000;

    font-weight: normal;

    text-align: center;

}



.use_hover .inner_global_nav .nav_btn:hover {

    background-color: #EAEAEA;

}



.global_nav_item:first-child .nav_btn {

    background-image: url(../images/navi_line_bg.gif),url(../images/navi_line_bg.gif);

    background-position: right center,left center;

}





/********************************************************************/



/* 開閉ナビゲーション */



/********************************************************************/



.inner_popup_nav_area,

.inner_popup_menu_area {

    background-color: #FFFFFF;

    color: #000000;

}



/* 各ナビゲーション */

.inner_popup_nav .nav_btn {

    background-color: #FFFFFF;

    border-top: 1px solid #A6A6A6;

    font-weight: normal;

}



.use_hover .inner_popup_nav .nav_btn:hover {

    background-color: #EAEAEA;

}



/* 開閉ナビゲーション閉じるボタン */

.nav_close_box .nav_close {

    background-color: #A6A6A6;

}



.use_hover .nav_close_box .nav_close:hover {

    opacity: 0.8;

}





/********************************************************************/



/* メインナビゲーション */



/********************************************************************/



/* 各ナビゲーション */

.inner_side_nav .nav_btn,

.inner_main_nav .nav_btn {

    background-color: #FFFFFF;

    border-bottom: 1px solid #666666;

    color: #000000;

}



.use_hover .inner_side_nav .nav_btn:hover ,

.use_hover .inner_main_nav .nav_btn:hover {

    border-bottom: 1px solid #666666;

    color: #333333;

}



/* フリーページナビゲーション背景 */

.freepage_nav .inner_freepage_nav .nav_btn {

    background-color: #FFFFFF;

    border-bottom: 1px solid #666666;

    color: #666666;

}



.use_hover .freepage_nav .inner_freepage_nav .nav_btn:hover {

    border-bottom: 1px solid #666666;

    color: #333333;

}





/********************************************************************/



/* カテゴリ、特集ナビゲーション */



/********************************************************************/



.itemlist_nav {

    margin-top: 15px;

}



/* 各ナビゲーション */

.inner_itemlist_nav .nav_btn {

    background-color: #FFFFFF;

    border-bottom: 1px solid #666666;

    color: #666666;

}



.use_hover .inner_itemlist_nav .nav_btn:hover {

    border-bottom: 1px solid #666666;

    color: #333333;

}





/********************************************************************/



/* サイドメニュー */



/********************************************************************/



/* サイドメニュー枠 */

.open_side_col .side_container {

    background-color: #FFFFFF;

}



/* サイドカテゴリ一覧 */

.side_itemlist_nav {

    padding: 0px 1px;

}



/* サブカテゴリ　第二階層 */

.side_itemlist_nav .sub_menu_link {

    padding: 10px 24px 10px 10px;

}



/* サブカテゴリ背景 */

.side_itemlist_nav .sub_menu_link {

    background-color: #F5F5F5;

    border-top: none;

    border-left: 1px solid #E0DFE3;

    border-right: 1px solid #E0DFE3;

    border-bottom: 1px solid #E0DFE3;

}



/* マウスオーバー */

.use_hover .side_itemlist_nav .side_itemlist_nav_link:hover {

    background-color: #F5F5F5;

}





/********************************************************************/



/* フッターナビゲーション */



/********************************************************************/



.footer_nav {

    background-color: #F7F5F2;

}



.footer_nav_item .nav_btn {

    border-bottom: 1px solid #333333;

}





/********************************************************************/



/* タイトル */



/********************************************************************/



.page_title h1,

.page_title h2,

.main_box h2{

    background-color: transparent;

}



.page_box .page_title h1:after,

.page_box .page_title h2:after,

.main_box h2:after {

    position: absolute;

    bottom: -5px;

    left: 50%;

    -webkit-transform: translateX(-50%);

    transform: translateX(-50%);

    display: inline-block;

    width: 50px;

    height: 1px;

    content: '';

    background-color: #000000;

}



@media screen and (min-width: 710px) {

    .page_box .page_title h1:after,

    .page_box .page_title h2:after,

    .main_box h2:after {

        bottom: -20px;

    }

}



.itemdetail .page_title h1:after,

.lower_link_box .main_box .section_title h2:after {

    background-color: transparent;	

}



.page_title h1 .title_text,

.page_title h2 .title_text,

.main_box h2 .title_text {

    display: inline-block;

	padding: 0px;

	position: relative;

	z-index: 1;	

}



.page_title h1.detail_page_title .title_text {

    padding-left: 0px;

	padding-right: 0px;	

}



.lower_link_box .main_box .section_title h2 .title_text {

    display: inline;

	background-color: transparent;

	padding: 0px;

}



.side_box .section_title h2,

.main_box .section_title h2,

.main_box .page_title h2 {

    padding: 10px 0px;

	margin-top: 10px;

    margin-bottom: 20px;

    color: #A6A6A6;

	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;

    text-align: center;

}



@media screen and (min-width: 710px) {

    .side_box .section_title h2,

    .main_box .section_title h2,

    .main_box .page_title h2 {

		margin-top: 50px;

        margin-bottom: 55px;

    }

}



.lower_link_box .main_box .section_title h2 {

    padding: 10px;

	margin-top: 0px;

	margin-bottom: 0px;

	text-align: left;

	background-color: #EAEAEA;

}



.main_desc {

    margin-bottom: 10px;

	text-align: center;

}



@media screen and (min-width: 710px) {

    .main_desc {

	    margin-bottom: 30px;	

	}

}



.main_desc li {

    text-align: left;

}





/********************************************************************/



/* 第二階層タイトル */



/********************************************************************/



/* 第二階層各ページタイトル */

.page_box .page_title h1,

.page_box .page_title h2,

.page_box .recently .section_title h2,

.page_box .use_emphasis_title .section_title h2 {

    padding: 15px 0px 10px;

    margin-bottom: 25px;

    color: #000000;

	text-align: center;

}



@media screen and (min-width: 710px) {

    .page_box .page_title h1,

    .page_box .page_title h2,

    .page_box .recently .section_title h2,

    .page_box .use_emphasis_title .section_title h2 {

        padding-bottom: 0px;

        margin-bottom: 40px;

    }

}



.page_box .page_title h2 .title_text {

    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;

}



.itemdetail .page_title h1 {

    background-color: transparent;

	text-align: left;

	padding-left: 15px;

	padding-right: 15px;	

}



.fix_center .page_box .page_title_right_edge h2,

.fix_center .page_box .section_title_right_edge h2 {

    padding-right: 0px;

}





/********************************************************************/



/* 第二階層サブタイトル */



/********************************************************************/



/* 各ページサブタイトル */

.page_box .section_title h2,

.page_box .section_title h3 {

    padding: 10px;

    color: #000000;

	background-color: #EAEAEA;

    text-align: center;

    font-weight: bold;

}



.page_box .detail_contents .section_title h2,

.page_box .detail_contents .section_title h3 {

    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;

}



.free_page_body .page_box .section_title h2 {

    background-color: #FFFFFF;

}



.product_review_list_area .section_title h3 {

    text-align: left;

    background-color: #FFFFFF;

}



.page_box .recently .section_title h2,

.page_box .use_emphasis_title .section_title h2 {

    background-color: transparent;

	padding: 10px 0px;	

}



.page_box #cart_preview .section_title h3 {

    margin-bottom: 10px;

}



.page_box .help_contents .section_title h4 {

    margin-top: 10px;

}



.page_box .section_title h4 {

    padding: 10px 5px;

	border-bottom: 1px solid #A6A6A6;

}



.page_box .page_contents .search_result_title h3 {

    margin-top: 10px;

}



.page_box .ajax_item_box .section_title h2::after,

.page_box .ajax_item_box .section_title h3::after {

    display: none;

}





/********************************************************************/



/* 第二階層小項目タイトル */



/********************************************************************/



.contents_title {

    padding: 8px 5px;

	background-color: #EAEAEA;

    font-weight: bold;

    font-size: 116%;

    color: #000000;

}



.rules_title {

    font-weight: bold;

}





/********************************************************************/



/* フォームタイトル */



/********************************************************************/



.form_title {

    border-bottom: 1px solid #A6A6A6;

    padding: 8px 5px;

    font-weight: normal;

    font-size: 116%;

    color: #000000;

}



.shoppingcart_page_body .page_box .form_area .form_title {

	border-bottom: 1px dotted #A6A6A6;

}



.form_inner_title {

    border-bottom: 1px dotted #A6A6A6;

    font-weight: bold;

    color: #000000;

}





/********************************************************************/



/* タイトル文字サイズ */



/********************************************************************/



.page_title h1,

.page_title h2,

.section_title h1,

.section_title h2 {

    font-size: 138.5%;

    font-weight: normal;

	font-weight: bold;

}



.page_title h1 .title_text,

.page_title h2 .title_text,

.main_box h2 .title_text {

	font-size: 100%;

}



.recently h2 .title_text {

    font-size: 90%;	

}



@media screen and (min-width: 375px) {

    .recently h2 .title_text {

        font-size: 93%;	

    }

}



@media screen and (min-width: 710px) {

    .page_title h1 .title_text,

    .page_title h2 .title_text,

    .main_box h2 .title_text {

	    font-size: 200%;

    }

}



.lower_link_box .main_box .section_title h2 .title_text {

    font-size: 100%;	

}



.page_title h3,

.section_title h3 {

    margin: 0px;

    font-size: 116%;

    font-weight: normal;

}



.page_box .section_title h2,

.page_box .section_title h3 {

    margin: 0px 2px;

}



.page_title h4,

.page_title h5,

.page_title h6,

.section_title h4,

.section_title h5,

.section_title h6 {

    margin: 0px;

    font-size: 100%;

    font-weight: bold;

}



.shoppingcart_page_body .section_title h4 {

    margin: 0px;

    font-size: 116%;

    font-weight: normal;

}





/********************************************************************/



/* メインコンテンツ */



/********************************************************************/



/********************************************************************/



/* 一覧

・写真のみ表示

・説明付き表示

・商品一覧ページ(写真のみ、説明付き)

・最新情報、店長日記

・ソート

*/



/********************************************************************/





/*--------------------------------------*/



/* 写真のみ表示  */



/*--------------------------------------*/



/* サムネイル写真 */

.layout_photo .list_item_photo {

    padding: 5px 0;

    text-align: center;

}



/* 一覧枠 */

.layout_photo .list_item_data {

    padding: 5px 1px;

	text-align: left;

}



/* もっと見る */

.more_item {

    padding: 20px 5px 20px 5px;

    text-align: center;

}



@media screen and (min-width: 710px) {

    .more_item {

        padding-top: 40px;

    }

}



.more_item .general_btn {

    padding: 10px 30px;

    font-size: 85%;

    font-weight: normal;

    color: #A6A6A6;

    border: 1px solid #A6A6A6;

}



.use_hover .more_item .general_btn:hover {

    background-color: #A6A6A6;

    color: #FFFFFF;

}



#container .more_item .general_btn .fa {

    color: #A6A6A6;

}



.use_hover #container .more_item .general_btn:hover .fa {

    color: #FFFFFF;

}



/* 写真のみ文字サイズ */

.layout_photo .item_data_link {

    font-size: 93%;

}



.layout_photo .item_data_link .goods_name {

    font-size: 116%;

}



.layout_photo .col2 .item_data_link {

    font-size: 93%;

}





/*--------------------------------------*/



/* 説明付き */



/*--------------------------------------*/



/* リンク */

.layout_column_text .list_item_box,

.layout_text .not_link {

    border-bottom: 1px solid #000000;

}



.list_item_data p.item_desc {

    color: #000000;

}





/*--------------------------------------*/



/* 商品一覧  */



/*--------------------------------------*/



/* 商品、記事一覧マウスオーバー */

.use_hover .item_list .item_data_link:hover,

.use_hover .item_list .list_item_link:hover {

    opacity: 0.7;

}



/* 商品名 */

.item_name {

    font-weight: bold;

}



.list_item_data p.item_name {

    margin-bottom: 3px;

}



/* 販売価格 */

.price {

    padding: 2px 0px;

    color: #000000;

    font-weight: bold;

}



.price .selling_price,

.price .regular_price {

    padding: 2px 0px;

}



/* 通常販売価格 */

.price .regular_price {

    color: #000000;

    font-weight: normal;

    display: block;

}



.item_box .text_layout .regular_price {

    display: inline;

}



/* 希望小売価格、税込価格 */

.item_box .retail_price,

.item_box .tax_incl_price {

    color: #666666;

    font-weight: normal;

    word-break: normal;

}



/* 在庫あり */

.stock {

    color: #666666;

    font-size: 93%;

}



/* 在庫僅か */

.lowstock {

    color: #990000;

}



/* 在庫なし */

.soldout,

.variation_stock_list .data_table .soldout {

    color: #777777;

}



/* レビュー件数 */

.item_info .review_number {

    color: #000000;

}



/* 商品一覧ランキングNo. */

.rankno {

    color: #000000;

    border: 1px solid #A6A6A6;

	width: 40px;

	height: 40px;

	border-radius: 40px;

	line-height: 40px;

	white-space: nowrap;

}





/*--------------------------------------*/



/* 記事一覧  */



/*--------------------------------------*/



/* タイトル */

.list_subject {

    padding: 5px 0px;

}



/* 日付 */

.date {

    color: #000000;

    font-size: 93%;

    font-weight: normal;

}





/*--------------------------------------*/



/* ソート */



/*--------------------------------------*/



.sort {

    border-bottom: 1px solid #A6A6A6;

}



.sort_toggle .toggle_open {

    padding: 7px;

    background-color: #EAEAEA;

    border: 1px solid #A6A6A6;

    border-top-left-radius: 5px;

    border-top-right-radius: 5px;

    border-bottom: none;

}



.sort_toggle .toggle_open:hover {

    background-color: #D6D6D6;

}



/* ソート項目枠 */

.sort_item {

    padding: 10px;

    border-left: 1px solid #A6A6A6;

    border-right: 1px solid #A6A6A6;

    border-bottom: 1px solid #A6A6A6;

}



.sort_box {

    padding: 5px;

    margin: 3px;

    border-bottom: 1px solid #EAEAEA;

}



.sort_item .global_btn {

    padding: 5px;

    text-align: center;

}



/* 件数 */

.item_count {

    font-size: 93%;

}





/********************************************************************/



/* 写真 */



/********************************************************************/



#photo .fix_center {

    max-width: 100%;

}



#photo {

    background-color: #FFFFFF;

}





/********************************************************************/



/* スライド */



/********************************************************************/



/* スライド送りボタン */

.slider_box .swiper-pagination-bullet,

.swipe_list .pointer span {

    display: inline-block;

    width: 8px;

    height: 8px;

    border: 1px solid #A6A6A6;

    border-radius: 50%;

    cursor: pointer;

}



/* 現スライド */

.slider_box .swiper-pagination-bullet-active,

.swipe_list .pointer span.current {

    background-color: #A6A6A6;

    border: 1px solid #A6A6A6;

}



#photo .slider_box .swiper-pagination-bullet,

#photo .swipe_list .pointer span,

#photo .slider_box .swiper-pagination-bullet-active,

#photo .swipe_list .pointer span.current {

    border: none;

}



/* 前へ、次へアイコン */

.swipe_list .pointer_box span.pointer_prev,

.swipe_list .pointer_box span.pointer_next,

.swiper-button-prev,

.swiper-button-next {

    width: 25px;

    height: 25px;

    background-color: #FFFFFF;

    border: 1px solid #A6A6A6;

    border-radius: 50%;

    display: inline-block;

    cursor: pointer;

}



.use_hover .swiper-button-prev:hover,

.use_hover .swiper-button-next:hover {

    background-color: #A6A6A6;

}



.use_hover .slider_box .swiper-button-disabled:hover {

    background-color: #F5F5F5;

}



.swiper-button-next.swiper-button-disabled,

.swiper-button-prev.swiper-button-disabled {

    pointer-events: none;

}



/* 前へアイコン画像 */

.swipe_list .pointer_box span.pointer_prev,

.swiper-button-prev {

    background-image: url(../images/icon_prev.png);

    -webkit-background-size: 20px 40px;

    background-size: 20px 40px;

}



.use_hover .swipe_list .pointer_box span.pointer_prev:hover,

.use_hover .itemlist_box .swiper-button-prev:hover {

    background-image: url(../images/icon_prev_on.png);

}



/* 次へアイコン画像 */

.swipe_list .pointer_box span.pointer_next,

.swiper-button-next {

    background-image: url(../images/icon_next.png);

    -webkit-background-size: 20px 40px;

    background-size: 20px 40px;

}



.use_hover .swipe_list .pointer_box span.pointer_next:hover,

.use_hover .itemlist_box .swiper-button-next:hover {

    background-image: url(../images/icon_next_on.png);

}



@media screen and (max-width: 840px) {

    .swipe_list .pointer_box span.pointer_prev,

    .swipe_list .pointer_box span.pointer_next,

    .swiper-button-prev,

    .swiper-button-next {

        -webkit-background-size: 10px 20px;

        background-size: 10px 20px;

        background-color: #FFFFFF;

    }

}





/********************************************************************/



/* 第二階層 */



/********************************************************************/



.page_box {

    color: #000000;

}



/* 共通説明 */

.page_desc {

    padding: 10px;

}



/* 共通ボックス */

.global_info {

    background-color: #FFFFFF;

    border: 1px solid #A6A6A6;

    padding: 10px;

}



.popup_page #main_container,

.popup_page .btn_box {

    padding-bottom: 0px;

    margin-bottom: 0px;

}



.popup_page .page_contents {

    background-color: #EAEAEA;

    padding-top: 1px;

}





/********************************************************************/



/* 商品詳細 */



/********************************************************************/



/* 商品情報　各ブロック */

.detail_section {

    border-bottom: 1px solid #A6A6A6;

}



/* 商品情報　商品名 */

.detail_item_data h1,

.detail_item_data .item_name {

    font-size: 123.1%;

    font-weight: bold;

    margin-bottom: 10px;

}



/* 商品詳細　価格エリアdivタグ間余白 */

.detail_item_data .section_box {

    margin-bottom: 10px;

}



/* 商品詳細　価格エリア項目間余白 */

.detail_item_data .section_box p {

    margin-bottom: 5px;

}



/* 商品詳細　販売価格 */

.detail_item_data .selling_price {

    font-size: 123.1%;

    word-break: normal;

}



/* 商品詳細　販売価格金額 */

.detail_item_data .selling_price .figure {

    font-weight: bold;

}



/* 商品詳細　通常販売価格 */

.detail_item_data .regular_price {

    font-size: 85%;

}



/* 商品詳細　希望小売価格、税込価格 */

.detail_item_data .retail_price,

.detail_item_data .tax_incl_price {

    color: #666666;

    font-weight: normal;

}



/* 商品詳細　販売価格ラベル */

.detail_item_data .selling_price {

    font-weight: normal;

}



/* 商品詳細　在庫 */

.detail_item_data .stock {

    font-size: 108%;

    font-weight: bold;

}



/* 商品情報　商品説明 */

.item_desc {

    margin: 0px;

}



/* 価格変動注意書き */

.price_desc {

    font-size: 77%;

}



/* 商品仕様 */

.detail_spec_data {

    margin: 0px;

}



/* 他の写真枠 */

.other_item_data {

    margin: 0px;

}



.other_item_data .global_photo {

    text-align: center;

}



/* 他の写真説明 */

.other_photo_desc {

    margin: 0px;

}



/* ソーシャルツール */

.social_tool {

    padding-bottom: 5px;

}



/* バリエーション在庫表 */

.variation_stock_list {

    margin-bottom: 5px;

}



.variation_selection_box button {

    border-radius: 5px;

}



/* バリエーション、オーダーメイド項目間余白 */

.variation_item,

.order_item {

    padding-top: 5px;

    padding-bottom: 5px;

}



/* オーダーメイド項目 */

.order_item {

    border-bottom: 1px dotted #A6A6A6;

}



.ordermade .bottompos {

    border-bottom: none;

}



/* 在庫数のラベルなし */

.hidden_stock .stocklist_data {

    text-align: center;

}



/* バリエーション在庫選択中背景 */

.variation_stock_list .data_table .selected_item {

    background-color: #D6D6D6;

    color: #000000;

}



.variation_stock_list .data_table .selected_data {

    background-color: #D6D6D6;

}





/*--------------------------------------*/

/* バリエーション選択のポップアップ */



/* ポップアップ枠 */

.popup_variation,

.popup_area {

    background-color: #FFFFFF;

    border: 1px solid #E0DFE3;

}



.popup_variation_selection,

.popup_section {

    border-bottom: 1px solid #E0DFE3;

}



/* バリエーション項目ボタン */

.popup_variation_button,

.item_selection_button {

    background-color: #F5F5F5;

    border: 2px solid #CCCCCC;

}



/* 選択中 */

.selected_option .popup_variation_button,

.selected_option .item_selection_button {

    background-color: #EAEAEA;

    border: 2px solid #000000;

    color: #000000;

}



/* 変更、選択してくださいボタン */

.popup_variation_edit_button,

.popup_variation_select_button,

.item_select_operation_button {

    background-image: url(../images/btn_main.gif);

    background-position: left bottom;

    background-repeat: repeat-x;

    background-color: #F5F5F5;

    color: #333333;

}



.popup_variation_value,

.variation_selection_value,

.item_selection_value {

    color: #000000;

    font-weight: bold;

}



/* 選択済み枠 */

.variation_selection_box .validation_selection_selected_all,

.use_hover .variation_selection_box .validation_selection_selected_all:hover {

    background-color: #EAEAEA;

    border: 2px solid #A6A6A6;

    color: #000000;

}



.validation_selection_selected_all .variation_selection_msg_text {

    background-color: #666666;

    color: #FFFFFF;

}





/*--------------------------------------*/

/* サムネイル写真 */



.thumbnail {

    margin-top: 5px;

}



/* サムネイル写真 */

.thumbnail .thumbnail_btn {

    border: 2px solid #FFFFFF;

}



.thumbnail .current .thumbnail_btn {

    border: 2px solid #000000;

}



/* サムネイル写真枠サイズ */

.thumbnail_listbox {

    width: 60px;

}





/*************************************************************/



/* レビュー */



/*************************************************************/



.large_rating_icon .rating_point {

    font-size: 153.9%;

}



.medium_rating_icon .rating_point {

    font-size: 123.1%;

}



/* 星ポイント */

.rating_point {

    margin-left: 10px;

    color: #EF9D35;

}



/* レビュー数 */

.review_number {

    margin-left: 10px;

}



/* グラフ */

.bar_graph {

    background-color: #EF9D35;

}



/* 年代 */

.rating_age {

    font-size: 93%;

}



/* 分析レポート内レビュー数 */

.rating_number A {

    font-size: 93%;

}



/* レビュー一覧 */

.review_data {

    border-bottom: 1px dotted #000000;

}



.mypagereview_contents .review_data {

    border-bottom: none;

}



/* レビュータイトル */

.review_title {

    font-size: 123.9%;

    font-weight: bold;

}



.product_review_item .page_title {

    margin-bottom: 30px;

}



.product_review_item .page_title .title_note,

.item_box .page_title .title_note {

    display: block;

	margin-top: 5px;

	font-size: 77%;

}



@media screen and (min-width: 710px) {

	.product_review_item .page_title .title_note,

	.item_box .page_title .title_note {

	    font-size: 85%;

    }

}



.itemdetail .review_data .review_title,

.mypagereview_contents .review_data .review_title {

    font-size: 108%;

}



/* 登録日 */

.review_postdate {

    background-color: #EAEAEA;

}



/* メモ */

.review_note {

    border-top: 1px solid #A6A6A6;

    border-bottom: 1px solid #A6A6A6;

}



.detail_page_body .review_note {

    border-top: 1px solid #A6A6A6;

    border-bottom: none;

}



/* ショップオーナー返信 */

.owner_note {

    border-bottom: 1px solid #A6A6A6;

}



/* ショップオーナーヘッダー */

.owner_header {

    font-size: 93%;

    color: #00BF60;

}



/* ショップオーナー登録日 */

.owner_postdate {

    display: inline-block;

    margin-left: 5px;

}



/* 参考質問数字 */

.user_number {

    font-size: 123.9%;

    font-weight: bold;

    color: #EF9D35;

}



/* 参考質問ボタン */

.review_vote_btn {

    display: block;

    margin-top: 5px;

}



/* 商品一覧レビュー数 */

.itemlist .review_number {

    font-size: 85%;

    margin-left: 5px;

}



/* 商品詳細レビュー数 */

.review_list .review_number {

    font-size: 93%;

}



/* 商品詳細ヘッダー */

.detail_review_header {

    padding-top: 10px;

}



/* 商品詳細、マイページレビュー管理ボタン */

.review_admin .global_btn {

    border-top: 1px solid #EAEAEA;

    text-align: center;

}



.detail_review_header .global_btn {

    text-align: center;

}





/********************************************************************/



/* ログイン */



/********************************************************************/



/* ID、PW枠 */

.signin_box .id_box,

.signin_box .pass_box {

    margin: 0px;

}



/* ID、PWタイトル */

.signin_box .id_title,

.signin_box .pass_title {

    margin-bottom: 10px;

    border-bottom: 1px solid #A6A6A6;

    font-size: 116%;

    font-weight: bold;

}



.signin_box .password .global_link {

    font-size: 85%;

}



/* 新規登録枠 */

#register_form {

    padding-top: 20px;

    border-top: 1px solid #A6A6A6;

}





/********************************************************************/



/* カート */



/********************************************************************/



/* カートの中身各枠 */

.inner_cart_data {

    margin-bottom: 10px;

    border: 1px solid #A6A6A6;

    background-color: #FFFFFF;

    border-radius: 5px;

}



/* 各項目枠 */

.cart_section {

    border-top: 1px dotted #A6A6A6;

}



/* 区切り線 */

.top_separator {

    border-top: 1px solid #A6A6A6;

}



.bottom_separator {

    border-bottom: 1px solid #A6A6A6;

}



/* 各項目ラベル */

.cart_label {

    font-weight: normal;

}



/* ボタン中央寄せ */

.cart_inner_btn {

    text-align: center;

}



/* 小計、送料 */

.cart_sub_total_price,

.cart_shipping_charge {

    text-align: right;

}



/* 合計 */

.cart_footer {

    text-align: right;

}



.grand_total {

    display: inline-block;

    border-bottom: 2px solid #A6A6A6;

    margin-bottom: 15px;

}



.grandtotal_price {

    font-size: 153.9%;

    color: #990000;

}



/* 買い物を続ける */

.continue_shopping {

    text-align: right;

    border-top: 1px solid #A6A6A6;

    border-bottom: 1px solid #A6A6A6;

}



/* 送り主、お届け先追加変更ボタン */

.cart_recipient .global_btn {

    text-align: center;

}



/* お届け先名 */

.cart_recipient_title {

    border-left: 5px solid #A6A6A6;

}



/* ラジオボタン選択の強調表示 */

.checked_row {

    background-color: #EAEAEA;

}



.form_area .checked_row > .form_title,

.form_inner_area .checked_row > .form_inner_title {

    color: #000000;

}



.checked_row .global_info {

    background-color: #FFFFFF;

    padding: 10px;

}



/* リピータ向け決済機能用 */

.inner_global_info {

    padding: 0px;

}



/* クーポン/ポイント枠 */

.toggle_box .cart_point,

.toggle_box .box_padding,

.toggle_box .cart_point_notice {

    margin: 1px;

}





/* クーポン/ポイント変更時の金額を更新ボタン欄、強調表示背景 */

.notice_box .form_btn_spad {

    background-color: #FFFEBF;

}



#cart_remarks,

#cart_quantity,

#cart_questionnaire {

    margin-top: 10px;

}



.shoppingcart_page_body .page_box .section_title h3 {

    padding: 10px;

    background-color: #EAEAEA;

    font-weight: bold;

    text-align: left;

    color: #000000;

}





/*************************************************************/



/* ステップ表 */



/*************************************************************/



.step_list {

    margin: 10px 0px;

    padding: 0px 2px;

}



/* ステップ表 各枠背景 */

.step_data {

    background-color: #EAEAEA;

    border-bottom: 1px solid #A6A6A6;

    border-right: 1px solid #FFFFFF;

    text-align: center;

}



/* ステップ表 右端 */

.step_list .posright .step_data {

    border-right: none;

}



/* ステップ表 各枠　現ページ */

.step_check .step_data {

    background-color: #A6A6A6;

}



/* ステップ表 文字 */

.step_data span {

    color: #A6A6A6;

}



/* ステップ表 ステップ数 */

.step_data .step_number {

    font-family: Arial, Helvetica, sans-serif;

    font-weight: bold;

}



/* ステップ表 現ページ文字 */

.step_check .step_data span {

    color: #FFFFFF;

}





/********************************************************************/



/* 最新情報、店長日記 */



/********************************************************************/



/* 日付 */

.article_date {

    border-bottom: 1px dotted #A6A6A6;

    margin-bottom: 10px;

}



.format {

    font-size: 77%;

}



/* 記事 */

.ph_article {

    font-size: 108%;

}



/* バックナンバー */

.count_number {

    font-size: 93%;

}





/********************************************************************/



/* ご利用案内 */



/********************************************************************/



/* 上部ページ内リンクのナビゲーション */

.anchor_nav_area .nav_btn {

    background-color: #FFFFFF;

    border: 1px solid #A6A6A6;

}



.use_hover .anchor_nav_area .nav_btn:hover {

    background-color: #EAEAEA;

	border: 1px solid #A6A6A6;

}



.anchor_nav_area {

    margin-bottom: 25px;

}



.help .section_title h3 {

    text-align: left;

}



/* 各ブロック */

.help_contents .inner_contents_box {

    margin-bottom: 10px;

}



.help_step,

.help_payment {

    padding-bottom: 5px;

}



/* 説明各ブロック */

.help_data {

    margin-top: 10px;

    margin-bottom: 10px;

    font-size: 93%;

}



/* 推奨環境 */

#spec_contents dt {

    font-weight: bold;

    padding-bottom: 5px;

}



#spec_contents dd {

    border: 1px dotted #A6A6A6;

}





/********************************************************************/



/* 特定商取引法 */



/********************************************************************/



/* 各欄枠 */

.contents_desc {

    padding: 10px 5px;

}





/********************************************************************/



/* メールマガジン */



/********************************************************************/



/* 登録、解除タイトル */

.mailmagazine_box .mailmagazine_subscribe_title,

.mailmagazine_box .mailmagazine_unsubscribe_title {

    border-bottom: 1px solid #A6A6A6;

    margin-bottom: 10px;

    font-size: 116%;

    font-weight: bold;

}





/********************************************************************/



/* マイページ */



/********************************************************************/



/* ポイント */

.member_contents .point_number {

    font-size: 138.5%;

    font-weight: bold;

    color: #990000;

}



/* リンク枠 */

.link_box .global_iconleft {

    display: block;

    margin-bottom: 10px;

}



/* 注意書き */

.mypage_note {

    font-size: 93%;

    line-height: 140%;

}



/* マイページ共通　送り主　お届け先 */

.mypage_recipient {

    padding: 5px 0px;

    font-size: 108%;

}





/*************************************************************/



/* 購入履歴 */



/*************************************************************/



/* 商品名 */

.history_data_list .item_name {

    font-weight: normal;

    color: #000000;

}



.mypage_history_detail_contents .cart_price_box {

    margin-bottom: 20px;

}





/*************************************************************/



/* 送り主、お届け先 */



/*************************************************************/



/* 住所 */

.recipient_data_list .user_address {

    font-weight: normal;

    color: #000000;

}





/*************************************************************/



/* お気に入り */



/*************************************************************/



/* 登録日、メモ */

.item_registration_date,

.item_memo {

    font-size: 93%;

}



/* 商品説明 */

.favorite_contents .item_desc {

    padding: 5px 0px;

    margin: 5px 0px;

    border-top: 1px dotted #A6A6A6;

    border-bottom: 1px dotted #A6A6A6;

}



/* メモ */

.item_memo_text {

    background-color: #EAEAEA;

    border: 1px solid #A6A6A6;

    color: #000000;

}





/*************************************************************/



/* 複数選択 */



/*************************************************************/



/* 複数削除 */

.bulk_btn {

    padding-top: 5px;

    padding-bottom: 5px;

}



/* 複数選択 */

.inner_bulk_check_box {

    background-color: #F5F5F5;

}



.layout_column_text .inner_bulk_check_box,

.layout_text .inner_bulk_check_box {

    background-color: #F5F5F5;

}



.bulk_mode .layout_column_text .list_item_box,

.bulk_mode .layout_column_text .not_link,

.bulk_mode .layout_text .not_link {

    border-bottom: none;

}



/* 一括削除時の下部ボタン枠 */

.bulk_mode .fixed_bottom {

    background-color: #F5F5F5;

    border-top: 1px solid #333333;

}



/* 数量表示バッジ */

.badge {

    background-color: #FF0000;

    font-family: Arial, Helvetica, sans-serif;

    color: #FFFFFF;

}





/*************************************************************/



/* 掲示板 */



/*************************************************************/



/* 記事枠 */

.post_box {

    margin-bottom: 5px;

}



/* 記事枠レス */

.post_box_res {

    padding-left: 20px;

}



/* 記事ヘッダー */

.post_box .data_table .cell_header,

.post_box .data_table .cell_data {

    background-color: #EAEAEA;

    font-weight: normal;

}



/* 記事ヘッダー下部余白 */

.post_box .data_table {

    margin-bottom: 5px;

}



/* 記事ヘッダー中央寄せ */

.post_box .res_cell,

.post_box .toggle_cell,

.post_box .replay_cell {

    text-align: center;

}



.post_title,

.post_user,

.post_day,

.post_number {

    padding: 2px 0px;

}



/* 記事タイトル */

.post_title {

    font-weight: bold;

    font-size: 14px;

}



/* 記事ユーザー */

.post_user {

    font-size: 11px;

}



/* 記事投稿日 */

.post_day {

    font-size: 11px;

}



/* 記事No */

.post_number {

    font-size: 13px;

}



/* URL */

.post_url {

    font-size: 13px;

}



/* 記事コメント */

.bbs_comments {

    border: 1px solid #A6A6A6;

}



/* 記事検索 */

.bbs_search .btn_color_common,

.bbs_search A.btn_color_common:link,

.bbs_search A.btn_color_common:visited,

.bbs_search A.btn_color_common:hover,

.bbs_search A.btn_color_common:active {

    border-radius: 5px;

}



/* 検索文字強調 */

.result_emphasis {

    background-color: #FFFF73;

}



/* 検索前に戻る */

.bbs_search .global_link {

    margin-left: 10px;

}



/* 記事開閉 */

#bbs_toggle {

    border-top: 1px solid #A6A6A6;

    border-bottom: 1px solid #A6A6A6;

}



/* 記事投稿欄 */

.bbs_post_form {

    border: 1px solid #A6A6A6;

}



#bbs_post, #bbs_edit {

    padding-top: 20px;

}



#bbs_post.upper_bbs_post_box {

    padding-top: 0px;

}



#bbs_post.contents_box {

    padding-bottom: 30px;

}



@media screen and (max-width: 840px) {

    #bbsedit_contents .search_label {

        min-width: 80px;

    }

    #bbsedit_contents .dispinlineblock {

        display: block;

    }

}





/*************************************************************/



/* 関連ページ */



/*************************************************************/



/* 内容 */

.link_desc_box {

    border-top: 1px solid #000000;

}





/*************************************************************/



/* 私が店長です */



/*************************************************************/



/* スタッフ画像 */

.staff_photo,

.pstaff_photo {

    text-align: center;

    margin-top: 10px;

}



/* プロフィール項目 */

.staff_contents dt,

.pstaff_contents dt {

    border-top: 1px solid #000000;

    font-weight: bold;

}



/* プロフィール内容 */

.staff_contents dd,

.pstaff_contents dd {

    border-top: 1px solid #000000;

}



.staff_profile_desc {

    background-color: #EAEAEA;

}





/********************************************************************/



/* カレンダー */



/********************************************************************/



/* カレンダーヘッダー */

.calendar_data {

    padding: 15px 0px;

}



.cal_month {

    padding-bottom: 15px;

    text-align: center;

}



.cal_month .prev_month,

.cal_month .next_month,

.cal_month .this_month {

    padding: 0px 10px;

}



.cal_month span.prev_month,

.cal_month span.next_month {

    padding: 0px 5px;

    font-weight: bold;

    cursor: pointer;

    color: #A6A6A6;

}



/* 今月 */

.this_month {

    font-size: 123.1%;

    font-weight: bold;

}



.side_col .this_month {

    font-size: 14px;

    padding: 0px;

}



.side_col .next_month,

.side_col .prev_month {

    font-size: 13px;

    padding: 0px;

}



/* カレンダー枠線 */

.calendar_data .data_table th.cell_header,

.calendar_data .data_table td.cell_data {

    border: 1px solid #A6A6A6;

}



/* カレンダー曜日セル */

.calendar_data .cal_day_header {

    font-size: 85%;

}



/* カレンダー各セル */

.calendar_data .data_table .cal_day_cell {

    width: 14%;

    height: 60px;

    vertical-align: top;

}



/* 日曜日 */

.sun .cal_day {

    color: #CC0000;

}



/* 土曜日 */

.sat .cal_day {

    color: #3399CC;

}



/* 今日 */

.calendar_data .today {

    font-weight: bold;

}



/* イベント一覧 */

.event_list li {

    border-bottom: 1px solid #A6A6A6;

}



/* イベント内容 */

.event_data {

    padding: 10px 0px;

}



/* イベント名 */

.event_name {

    font-weight: bold;

    line-height: normal;

}



/* アイコン画像 */

div.event_icon {

    text-align: center;

}



div.event_icon img {

    margin: 0px 1px;

}



span.event_icon {

    margin-right: 5px;

}



/* 定休日 */

.calendar_data .holiday,

.holiday_icon {

    background-color: #FBFAEA;

}



.holiday_icon {

    border: 1px solid #666666;

    display: inline-block;

    width: 15px;

    height: 15px;

}



/* イベント説明 */

.event_desc {

    font-size: 93%;

    padding: 5px;

}



/* 左右カラム */

.side_col .cal_day {

    font-size: 85%;

}



.side_col .data_table th.cell_header,

.side_col .data_table td.cell_data {

   padding: 2px;

}



.side_col .calendar_data .data_table .cal_day_cell {

    height: auto;

}





/********************************************************************/



/* table */



/********************************************************************/



/* thタグ、tdタグ */

.data_table .cell_header,

.data_table_header,

.data_table .cell_data {

    padding: 5px;

    border: 1px solid #A6A6A6;

}



/* thタグ */

.data_table .cell_header,

.data_table_header {

    background-color: #EAEAEA;

    color: #000000;

}



/* tdタグ */

.data_table .cell_data {

    background-color: #FFFFFF;

    color: #000000;

}





/********************************************************************/



/* フォーム */



/********************************************************************/



.list_icon_circle {

    color: #000000;

}



/* フォーム項目 */

.form_element,

.form_inner_element {

    padding: 10px;

}



/* 必須項目 */

.require {

    color: #CC0000;

    font-weight: bold;

}



abbr.require {

    border: none;

    cursor: default;

}



/* 注意書き */

span.cell_note {

    font-size: 85%;

    font-weight: normal;

}



/* メールアドレス欄 */

.confirm_email {

    border-color: #E0DFE3;

    background-color: #EAEAEA;

}





/********************************************************************/



/* 入力エリア */



/********************************************************************/



/* 標準 */

.form_data .defaultsize {

    width: 170px;

}



/* 特小 */

.form_data .xsmallsize {

    width: 60px;

}



/* 小 */

.form_data .smallsize {

    width: 80px;

}



/* 大 */

.form_data .largesize {

    max-width: 500px;

    width: 97%;

}





/********************************************************************/



/* フォームエラー */



/********************************************************************/



/* 個別エラー表示 */

.form_error {

    border: 5px solid #FF0000;

    border-radius: 5px;

    margin: 0px 5px;

}



/* フォーム上部エラー表示 */

.error_box {

    border: 1px solid #FF0000;

    border-radius: 5px;

}



/* 商品詳細エラー表示 */

.detail_page_body .error_box {

    margin: 10px;

}



/* エラー表示　※赤枠内文字 */

.error_status {

    color: #FF0000;

    font-size: 93%;

    padding-left: 5px;

}



/* エラー時入力エリア背景色 */

.page_box .edit_form .error_row input,

.page_box .edit_form .error_row select,

.page_box .edit_form .error_row textarea {

    background-color: #FFF0F0;

}



/* エラーアイコン */

.error_icon .fa {

    background-color: #FF0000;

    border: 1px solid #FFFFFF;

    box-shadow: 0px 0px 0px 1px #FF0000;

    color: #FFFFFF;

}



/* フォーム上部OK表示 */

.ok_box {

    border: 1px solid #00B200;

    border-radius: 5px;

}



/* OK表示 ※緑枠内文字 */

.ok_status {

    color: #00B200;

    font-size: 93%;

    padding-left: 5px;

}



/* OK表示アイコン位置調整 */

.ok_status img {

    padding-right: 3px;

}



/* OK時入力エリア背景色 */

.page_box .edit_form .ok_row input,

.page_box .edit_form .ok_row select,

.page_box .edit_form .ok_row textarea,

.page_box .edit_form .error_row .ok_input {

    background-color: #EEFFEE;

}



/* OKアイコン */

.ok_icon .fa {

    background-color: #00B200;

    border: 1px solid #FFFFFF;

    box-shadow: 0px 0px 0px 1px #00B200;

    color: #FFFFFF;

}



/* 重要な注意書き色 */

.note_color {

    color: #CC0000;

}





/********************************************************************/



/* アイコン */



/********************************************************************/



/* ヘッダーナビボタン */

.inner_header_nav .header_nav_item .fa {

    color: #000000;

}



/* グローバルナビ */

.inner_global_nav .fa {

    color: #000000;

}



.global_iconleft .fa {

    padding-right: 5px;

}



.global_iconright .fa {

    padding-left: 5px;

}



/* 閉じる、削除ボタン */

.close_btn_box .fa,

.delete_btn_box .fa {

    color: #000000;

}



.nav_close_btn .fa {

    color: #FFFFFF;

}



/* フッター下部ボタン */

.fixed_corner_button .fa {

    font-size: 40px;

    color: #FFFFFF;

}



.use_hover .fixed_corner_button:hover .fa {

    color: #000000;

}



/* +-開閉ボタン */

.open_icon .fa,

.close_icon .fa {

    color: #000000;

}



/* 説明付き一覧表示調整 */

.right_side_list_icon {

    position: absolute;

    right: 5px;

    top: 50%;

    margin-top: -11px;

    font-size: 22px;

}



/* 矢印アイコン */

#container .fa-chevron-right,

#container .fa-chevron-down,

#container .fa-chevron-up {

    color: #000000;

}



#container .custom_toggle_button .fa-chevron-down {

    color: #A6A6A6

}





/********************************************************************/



/* ボタン */



/********************************************************************/



/* アイコンボタン枠 */

.icon_btn {

    padding: 0px 3px;

    border: 1px solid #A6A6A6;

    background-color: #FFFFFF;

    border-radius: 5px;

}



.use_hover .icon_btn:hover {

    border: 1px solid #A6A6A6;

    background-color: #EAEAEA;

}



/* +-開閉ボタン枠 */

.open_icon,

.close_icon {

    border: 1px solid #CCCCCC;

    background-color: #FFFFFF;

}



.use_hover A:hover .open_icon,

.use_hover A:hover .close_icon,

.use_hover abbr:hover .open_icon,

.use_hover abbr:hover .close_icon {

    background-color: #D1D1D1;

}



/* 汎用ボタン */

.general_btn {

    padding: 0px 5px;

    border: solid 1px #A6A6A6;

    background-color: #FFFFFF;

    border-radius: 5px;

    display: inline-block;

}



.use_hover .general_btn:hover {

    background-color: #EAEAEA;

}



.standard_btn {

    padding: 10px 20px;

    border: solid 1px #E0DFE3;

    background-color: #FFFFFF;

    border-radius: 5px;

    display: inline-block;

}



.use_hover .standard_btn:hover {

    border: 1px solid #E0DFE3;

    background-color: #F5F5F5;

}



/* 右端ボタン */

.page_title_right_edge .general_btn,

.section_title_right_edge .general_btn {

    background-color: #FFFFFF;

    border: 1px solid #A6A6A6;

    border-radius: 5px;

    color: #666666;

}



.use_hover .page_title_right_edge .general_btn:hover,

.use_hover .section_title_right_edge .general_btn:hover {

    background-color: #EAEAEA;

    color: #666666;

}



/* 画像リンク */

.use_hover .photo_link:hover {

    opacity: 0.7;

}





/*************************************************************/



/* フォームボタン */



/*************************************************************/



/* フォームボタンマウスオーバー */

.use_hover .global_btn input:hover,

.use_hover button:hover,

.use_hover .global_btn A:hover {

    opacity: 0.8;

}



/* ボタンサイズXXS */

.global_btn .btn_size_xxsmall {

    width: 30px;

    height: 30px;

}



/* ボタンサイズXS */

.global_btn .btn_size_xsmall {

    width: 50px;

    height: 30px;

}



/* ボタンサイズS */

.global_btn .btn_size_small {

    width: 70px;

    height: 30px;

}



/* ボタンサイズM */

.global_btn .btn_size_medium {

    width: 90px;

    height: 30px;

}



.global_btn A.btn_size_xxsmall,

.global_btn A.btn_size_xsmall,

.global_btn A.btn_size_small,

.global_btn A.btn_size_medium,

.global_btn A.btn_size_auto {

    line-height: 30px;

}



/* ボタンサイズL */

.global_btn .btn_size_large {

    width: 130px;

    height: 35px;

}



.global_btn A.btn_size_large {

    line-height: 35px;

}



/* ボタンサイズXL */

.global_btn .btn_size_xlarge {

    width: 180px;

    height: 40px;

    font-size: 116%;

}



.global_btn A.btn_size_xlarge {

    line-height: 40px;

}



/* ボタンサイズXXL */

.global_btn .btn_size_xxlarge {

    width: 281px;

    height: 50px;

    font-size: 123%;

}



.global_btn A.btn_size_xxlarge {

    line-height: 50px;

}



/* ボタンサイズ横幅auto */

.global_btn .btn_size_auto {

    height: 30px;

    width: auto;

    padding: 0px 20px;

}



/* ボタンサイズ小文字 */

.font_size_small {

    font-size: 77%;

}



/* 縦2段積みボタン */

.under_global_btn {

    display: block;

    margin-top: 30px;

}



/* 商品詳細 */

.detail_item_data .add_cart .global_btn {

    display: block;

    text-align: center;

    margin: 10px 0px;

}



/* 下部配置ボタン */

.form_btn {

    text-align: center;

    margin: auto;

    padding: 20px 0;

}



/* 下部ボタン上部注意書き */

.global_bottom_info {

    border-bottom: 1px solid #E0DFE3;

}



/* ログインページ新規登録余白調整 */

#register_form .form_btn {

    padding: 0px;

}



/* Aタグボタン */

.global_btn A {

    font-weight: normal;

}



/* 外部決済ボタン */

.outside_btn_box {

    background-color: #EAEAEA;

    border: 1px solid #A6A6A6;

}



/* 楽天決済用 */

.payment_method_desc {

    margin-bottom:10px;

}





/*--------------------------------------*/



/* ボタン色 */



/*--------------------------------------*/

/* 色通常 */

/* フォームボタン全般 */

.btn_color_common {

    background-color: #333333;

    color: #FFFFFF;

}



.btn_color_common,

A.btn_color_common:link,

A.btn_color_common:visited,

A.btn_color_common:hover,

A.btn_color_common:active {

    color: #FFFFFF;

    border-radius: 25px;

}



.use_hover .btn_color_common:hover {

    color: #FFFFFF;

}



/* 色強調 */

.btn_color_emphasis {

    background-color: #A6A6A6;

    border-radius: 25px;

}



.btn_color_emphasis,

A.btn_color_emphasis:link,

A.btn_color_emphasis:visited,

A.btn_color_emphasis:hover,

A.btn_color_emphasis:active {

    color: #FFFFFF;

    border-radius: 25px;

}



.use_hover .btn_color_emphasis:hover {

    color: #FFFFFF;

}





/*************************************************************/



/* パンくずリスト */



/*************************************************************/



/* パンくずリスト */

.breadcrumb_list {

    font-size: 85%;

}





/********************************************************************/



/* ポップアップ */



/********************************************************************/



/* ポップアップの背景 */

.overlay_area .modal_skin {

    background-color: #FFFFFF;

    border: 1px solid #CCCCCC;

}





/********************************************************************/



/* ロード、ページャー */



/********************************************************************/



/* 読み込み中アイコン画像 */

.loading,

.initial_loading {

    background: url(../images/load_icon.gif);

    background-repeat: no-repeat;

    background-position: center center;

    -webkit-background-size: 25px 25px;

    background-size: 25px 25px;

}



.entry_box .loading {

    background-image: url(../images/load_entry_icon.gif);

    -webkit-background-size: 25px 25px;

    background-size: 25px 25px;

}



/* 一覧ページャー */

.pager {

    margin: 5px 0px;

    text-align: center;

}



/* 現ページ */

.pager strong {

    min-width: 20px;

    min-height: 20px;

    padding: 3px;

    margin: 0px 1px;

    border: 1px solid #A6A6A6;

    background-color: #A6A6A6;

    color:#FFFFFF;

}



/* 各ページ */

.pager .pager_btn {

    min-width: 20px;

    min-height: 20px;

    margin: 0px 1px;

    padding: 3px;

    border: 1px solid #A6A6A6;

    background-color: #FFFFFF;

    text-decoration: none;

    color: #A6A6A6;

}



.use_hover .pager .pager_btn:hover {

    border: 1px solid #A6A6A6;

    background-color: #A6A6A6;

    color: #FFFFFF;

}





/********************************************************************/



/* グローバルサイトリンク */



/********************************************************************/



/* リンク一覧 */

.site_list_dropdown {

    background-color: #FFFFFF;

    box-shadow: 5px 5px 10px rgba(0,0,0,0.4),-5px 5px 10px rgba(0,0,0,0.4);

}



/* 各リンク先 */

.layout_dropdown .site_list_data {

    border-bottom: 1px solid #E0DFE3;

}



/* 各リンク文字 */

.global_site .site_list_dropdown .nav_btn,

#inner_footer .layout_dropdown .site_list_data .nav_btn {

    color: #000000;

}



.use_hover .global_site .site_list_dropdown .nav_btn:hover,

.use_hover #inner_footer .layout_dropdown .site_list_data .nav_btn:hover {

    color: #666666;

    background-color: #F5F5F5;

}



/* リスト表示タイトル */

#inner_footer .layout_dropdown .site_list_title .nav_btn {

    background-image: none;

    background-color: #FFFFFF;

    color: #000000;

}





/********************************************************************/



/* フッター */



/********************************************************************/



/* PCサイトボタン */

.footer_pc_site_box {

    height: 30px;

    padding: 15px 0px 15px 0px;

    position: relative;

    background-color: #F7F5F2;

    box-sizing: content-box;

    text-align: center;

}



.pc_site_btn .pc_site_link {

    width: 80px;

    margin: auto;

    padding: 8px 8px 8px 30px;

    display: inline-block;

    background-image: url(../images/icon_pc.png);

    -webkit-background-size: 30px 30px;

    background-size: 30px 30px;

    background-repeat: no-repeat;

    background-position: 5px center;

    background-color: #FFFFFF;

    border: 1px solid #CCCCCC;

    border-radius: 5px;

    box-sizing: content-box;

    font-size: 12px;

    text-align: center;

    color: #000000;

}



.use_hover .pc_site_btn .pc_site_link:hover {

    color: #000000;

    opacity: 0.8;

}



/* フッター */

.footer_area {

    background-color: #F7F5F2;

    border-top: 1px solid #000000;

}



#footer {

    text-align: center;

}



.footer_upper_link_box .continued_link_box {

    border-left: 1px solid #666666;

}



/* ページトップへ戻るボタン */

.fixed_corner_button {

    width: 45px;

    height: 45px;

    border-radius: 10px;

    background-color: #A6A6A6;

    text-align: center;

}



.move_to_add_cart .corner_covering_item,

.use_hover .move_to_add_cart:hover .corner_covering_item {

    color: #A6A6A6;

}



/* フッター下部バナー */

.footer_banner {

    text-align: center;

}



.footer_banner .banner_box {

    margin: 15px 5px 5px 5px;

}



.use_hover .footer_banner .banner_box A:hover {

    opacity: 0.8;

}





/********************************************************************/



/* Powered by おちゃのこネット

※上記の文言は共用ドメインコースをご利用の場合に表示されます。

必須項目ですので、下記の編集は許可されていません。

・文言の削除

・文字色を薄くする

・文字サイズを小さくする */



#ochanoko {

    padding: 5px;

    text-align: center;

    font-size: 12px;

}



#ochanoko A {

    font-size: 12px;

}



/********************************************************************/





/* # =================================================================

# 

# ↓　おちゃのこネットデザイン作成プラン　↓

#             2021.8.3 upload

# 

# ================================================================= */



/* 全体 */

body, .page_box .detail_contents .section_title h2, .page_box .detail_contents .section_title h3, .page_box .page_title h2 .title_text {

font-family: 'Montserrat','Noto Sans JP', sans-serif;

}

A, A:link, A:visited, A:hover, A:active {

color: #000;

transition: 0.3s;

}

A:hover img {

opacity: 0.7;

}

.page_title h1 .title_text, .page_title h2 .title_text, .main_box h2 .title_text {

font-size: 100%;

}

.side_box .section_title h2, .main_box .section_title h2, .main_box .page_title h2 {

font-family: 'Montserrat','Noto Sans JP', sans-serif;

color: #000;

font-size: 14px;

letter-spacing: 3px;

font-weight: 400;

}

.page_box .page_title h1::after, .page_box .page_title h2::after, .main_box h2::after {

width: 0;

height: 0;

background-color: transparent;

}

.main_box .section_title h2::before {

font-family: 'Montserrat', sans-serif;

display: block;

font-size: 20px;

padding-bottom: 10px;

font-weight: 700;

}

.whatnew .section_title h2::before {

content: "NEWS & TOPICS";

}

.item_pickup .section_title h2::before {

content: "RECOMMEND";

}

.recently .section_title h2::before {

content: "RECENTLY ITEMS";

}

.more_item .general_btn {

color: #000;

border: 5px solid #000;

border-radius: 0;

font-size: 14px;

font-weight: 600;

font-family: 'Montserrat', sans-serif;

letter-spacing: 2px;

background-color: #fff;

}

.more_item .general_btn .fa::before {

content: "";

}

.more_item::after {

content: "";

display: block;

width: 100%;

height: 5px;

background-color: #000;

position: absolute;

top: 50%;

transform: translateY(-50%);

z-index: -1;

}

.more_item {

position: relative;

padding: 30px 0;

}

.use_hover .more_item .general_btn:hover {

background-color: #000;

}

.btn_color_emphasis {

background-color: #FFF;

box-shadow: none;

border: 5px solid #000;

}

.btn_color_emphasis, A.btn_color_emphasis:link, A.btn_color_emphasis:visited, A.btn_color_emphasis:hover, A.btn_color_emphasis:active {

color: #000;

border-radius: 0px;

}

.top_page_body .global_btn .btn_size_large {

height: 50px;

}

.layout_photo .list_item_cell .selectoptioninput, .layout_photo .list_item_cell .cartinput {

margin-bottom: 0px;

}

.selectoptioninput .button_text, .cartinput .button_text {

font-weight: bold;

letter-spacing: 2px;

}

.selectoptioninput .fa, .cartinput .fa {

padding-right: 10px;

}

.responsive #container .list_item_cell {

margin-bottom: 10px;

}

.use_hover .btn_color_emphasis:hover {

background-color: #000;

}

.use_hover .global_btn input:hover, .use_hover button:hover, .use_hover .global_btn A:hover {

opacity: 1;

}

.dispinlineb {

display: inline-block;

}

#main_container {

padding-bottom: 0;

}

.layout_photo .list_item_data {

max-width: 160px;

margin: 0 auto;

}

.btn_color_common, A.btn_color_common:link, A.btn_color_common:visited, A.btn_color_common:hover, A.btn_color_common:active {

border-radius: 0px;

}

.back_to_top {

z-index: 1;

}

.use_hover .fixed_corner_button:hover {

background-color: #333;

}

.use_hover .fixed_corner_button:hover .fa {

color: #fff;

}

#shoppingcart_page_step0 .registerinput, #shoppingcart_page_step1 .nonmemberregisterinput, #shoppingcart_page_step1 .memberregisterinput {

border: 5px solid #000;

line-height: 40px;

box-shadow: none;

}

/* トップコンテンツ表示調整 */

.wide_layout .top_page_body .fix_center, .wide_layout #header .fix_center {

max-width: 100%;

}

.wide_layout .footer_nav .fix_center {

max-width: 1200px;

margin: 0 auto;

justify-content: center;

}

.main_box {

margin-bottom: 0px;

}

.main_section, .top_mainbox {

padding: 20px 0px 30px;

}

.main_free_box .top_mainbox .inner_top_mainbox {

max-width: 1200px;

margin: 0 auto;

}

.responsive .has_inside_pagination .swiper-pagination .swiper-pagination-bullet {

width: 10px;

height: 10px;

border-radius: 50%;

}

.whatnew, .item_pickup, .recently {

max-width: 1400px;

margin: 0 auto;

}

.main_free_box .custom_space {

overflow: visible;

}

.mainfree_box {

padding: 50px 10px;

}

.inner_mainfree_box {

flex-wrap: wrap;

max-width: 1400px;

margin: 0 auto;

padding: 0;

}

#contents {

padding-top: 80px;

}

.top_page_body #contents {

padding-top: 0px;

}

.has_min_nav #contents {

padding-top: 0px;

}

.step_data {

border-bottom: 1px solid #000;

}

.step_check .step_data {

background-color: #000;

}

.selectoptioninput .fa, .cartinput .fa {

font-size: 18px;

}

.pager strong {

border: 1px solid #000;

background-color: #000;

}

.pager .pager_btn {

border: 1px solid #000;

color: #000;

}

.use_hover .pager .pager_btn:hover {

border: 1px solid #000;

background-color: #000;

}

/* ヘッダー */

.inner_header_area {

height: 80px;

padding: 0 50px 0 10px;

}

.header_logo {

align-items: center;

}

.inner_header_nav .nav_btn {

border-radius: 0;

}

.use_hover .inner_header_nav .nav_btn:hover {

background-color: #F5F3EF;

}

.globalnavlist {

margin: 0;

padding: 0;

list-style: none;

}

.globalnavbtn {

padding: 0 5px;

}

.globalnavbtn > A {

padding: 0 15px;

font-size: 16px;

font-weight: 600;

letter-spacing: 1px;

display: inline-block;

display: flex;

align-items: center;

justify-content: center;

height: 100px;

}

.dropdwn_menu {

width: 100%;

display: none;

position: absolute;

left: 0;

top: 0;

padding: 30px 15px;

background-color: #F5F3EF;

}

.dropdwn_menu ul, .dropdwn_menu li {

width: 100%;

}

#globalnav ul.dropdwn ul.dropdwn_menu {

padding-top: 20px;

}

.subnavbox .itemname {

font-weight: normal;

font-size: 12px;

padding: 0px 0px 0px 5px;

}

.nav-open {

overflow: hidden;

}

.nav-open .site_header.open {

overflow: auto

}

.nav-open #globalnav {

min-height: 105vh;

padding-top: 50px;

}

.min_header .shop_name_box .shoptext {

font-family: 'Noto Sans JP', sans-serif;

font-size: 20px;

letter-spacing: 3px;

}

.toggle_btn {

display: none;

}

.design_header_nav_opened body {

overflow: hidden;

}

.subnavbtn .fa-solid {

font-size: 30px;

}

.subnavbtn .menu_list .fa-solid {

font-size: 22px;

padding-left: 15px;

}

.menu_btn h3 {

font-size: 16px;

font-weight: 600;

}

.menu_btn h3 span {

display: block;

padding-bottom: 10px;

}

.subnavbtn {

width: calc(100%/3);

padding: 10px;

}

.subnavbtn .menu_btn {

border-bottom: 2px solid #000;

padding: 10px 5px;

margin-bottom: 10px;

font-size: 12px;

}

.menu_list {

list-style: none;

padding: 5px;

}

.dropdwn_menu .menu_list A {

font-weight: 600;

display: block;

}

.menu_list li {

margin-bottom: 10px;

}

.standard_header #header_area {

position: fixed;

background-color: #FFF;

max-width: 100%;

}

.popup_nav_box {

top: 60px;

}

.min_header .popup_nav_box {

top: 0;

}

.nav_close_box .nav_close {

background-color: #000;

}

.shoptext A {

font-size: 20px;

}

.has_min_nav header {

height: 45px;

}

.has_opened_popup_menu .min_header .popup_base {

height: calc(100vh - 45px);

}

/* スライド */

#photo {

max-height: 850px;

overflow: hidden;

padding-right: 0px;

margin-top: 80px;

}

#photo img {

height: 300px;

width: 100%;

}

.wide_layout .has_wide_photo .top_image_slide .swiper-button-prev {

left: 0px;

margin-left: 0;

}

.wide_layout .has_wide_photo .top_image_slide .swiper-button-next {

right: 0px;

margin-right: 0;

}

.top_image_slide .swiper-button-next, .top_image_slide .swiper-button-prev {

background-color: transparent;

}

/* 商品検索 */

.search_bar .search_box {

width: 65%;

background-color: #FFFFFF;

border: none;

box-shadow: none;

padding: 0px;

border-radius: 0px;

}

.search_form .searchinput {

background-color: #000000;

box-shadow: none;

width: 50px;

height: 26px;

border-radius: 0px;

}

.search_bar .search {

padding: 10px;

background-color: #F5F3EF;

}

.header_area .search_bar {

display: flex;

align-items: center;

padding: 0px 20px;

}

.search_close,

.use_hover .search_close:hover {

top: 50%;

transform: translateY(-50%);

border: none;

background-color: transparent;

height: 21px;

}

.result_emphasis {

background-color: #F5F3EF;

}

/* プレースホルダーをフォーカスで非表示 */

#header_area .search input:focus::-webkit-input-placeholder, #header_area .search input:focus::-moz-placeholder, #header_area .search input:focus::-ms-input-placeholder, #header_area .search input:focus::placeholder {

color: transparent;

}

/* オートコンプリート背景色 */

#header_area .search input:-webkit-autofill, input:focus:-webkit-autofill {

-webkit-box-shadow: 0 0 0 100px rgb(245, 245, 245) inset!important;

}

/* フォーカスのボーダー削除 */

:focus {

outline: none;

}

/* SNSシェア */

.sns_share {

position: relative;

transform: rotate(0deg);

top: 0;

right: 0;

margin: 30px 0;

}

.inner_sns_share {

justify-content: center;

align-items: center;

}

.sns_ttl {

font-weight: 600;

letter-spacing: 2px;

position: relative;

padding-right: 30px;

font-size: 12px;

}

.sns_btn_box {

align-items: center;

}

.sns_btn {

padding: 0px 10px;

transform: rotateZ(0deg);

}

.sns_btn img {

height: 20px;

width: auto;

}

/* 最新情報 */

.top_page_body .news_photo, .whatnew_page_body .news_photo {

border-radius: 50%;

overflow: hidden;

}

.top_page_body .news_photo img, .whatnew_page_body .news_photo img {

object-fit: cover;

width: 80px;

height: 80px;

}

.whatnew_list .list_item_box {

border-bottom: 0px;

}

/* コンセプト */

.concept_box {

max-width: 1400px;

margin: 0 auto;

}

.inner_concept_box {

display: block;

height: auto;

}

.concept_logo {

background-color: #F5F3EF;

padding: 50px 10px;

min-width: auto;

text-align: center;

}

.concept_logo_sub {

padding: 0;

}

.concept_logo_sub img {

max-width: 150px;

}

.concept_image img {

height: 300px;

object-fit: cover;

width: 100%;

max-width: 1000px;

}

.concept_text {

font-weight: 600;

color: #000;

letter-spacing: 2px;

text-align: left;

display: inline-block;

margin: 50px auto 0;

}

.cafeimage {

justify-content: flex-end;

padding-top: 20px;

padding-bottom: 50px;

}

.cafeimage img {

padding-left: 20px;

}

/* 商品ピックアップ */

.free_pickup {

background-color: #F5F3EF;

}

.inner_pickup_box {

flex-wrap: wrap;

max-width: 1400px;

margin: 0 auto;

padding: 50px 0;

}

.pickup_item {

width: 100%;

padding: 10px 10px 30px;

}

.pitem_image {

position: relative;

}

.pitem_image img {

max-width: 640px;

width: 100%;

}

.item_ttl {

position: absolute;

background-color: #000;

color: #FFF;

padding: 10px 15px;

text-align: center;

letter-spacing: 2px;

font-size: 14px;

}

.pitem_desc {

position: relative;

margin-top: -12px;

padding: 0 5px;

letter-spacing: 0px;

}

.itemname {

font-size: 18px;

font-weight: 500;

display: flex;

align-items: center;

padding-bottom: 15px;

}

.itemname .fa {

padding-left: 20px;

}

.fa-arrow::before {

content: "";

width: 24px;

height: 20px;

background-image: url(../images/icon_arrow.png);

background-repeat: no-repeat;

background-position: center;

background-size: contain;

display: inline-block;

}

.itemtxt {

font-weight: 400;

}

.itemname_ds {

padding-right: 15px;

}

.itemname span.itemname_ps {

font-size: 80%;

}

.shippingfree img {

max-width: 100%;

padding-bottom: 30px;

}

/* アイテムカテゴリ */

.category_wrap {

width: 100%;

height: 300px;

}

.category_wrap A, .cbox {

display: block;

height: 100%;

}

.category_wrap.flex_layout {

flex-wrap: wrap;

}

.category_wrap.flex_layout .cbox {

width: 50%;

}

.category_wrap .flex_layout {

height: 50%;

}

.cbox {

padding: 5px;

position: relative;

}

.cg2, .cg3, .cg4, .cg5 {

width: 50%;

}

.multi {

height: 100%;

background-size: cover;

background-position: center;

}

.cg1 .multi {

background-image: url(../images/cbg1.jpg);

}

.cg2 .multi {

background-image: url(../images/cbg2.jpg);

}

.cg3 .multi {

background-image: url(../images/cbg3.jpg);

}

.cg4 .multi {

background-image: url(../images/cbg4.jpg);

}

.cg5 .multi {

background-image: url(../images/cbg5.jpg);

}

.multi A {

background-color: rgba(0, 0, 0, 0.5);

}

.use_hover .multi A:hover {

background-color: rgba(0, 0, 0, 0.2);

}

.category_name {

color: #fff;

position: absolute;

top: 50%;

left: 50%;

transform: translate(-50%, -50%);

font-size: 14px;

letter-spacing: 1px;

display: inline-block;

width: 100%;

text-align: center;

}

.roast {

width: 100%;

padding: 30px 0 0;

display: block;

}

.roast_wrap {

width: 100%;

padding: 10px 0;

text-align: center;

}

.roast .roast_wrap {

border-bottom: 5px solid #000;

}

.roast .roast_wrap:last-child {

border-bottom: 0px;

}

.roast_level {

font-size: 20px;

padding: 10px 0;

}

.roast_text {

font-weight: 500;

letter-spacing: 1px;

padding-bottom: 10px;

font-size: 12px;

}

.roast_text br {

display: none;

}

.roast_wrap img {

max-width: 100px;

}

.inner_roast_wrap {

display: flex;

justify-content: space-around;

align-items: center;

}

.roast_desc {

text-align: left;

width: 50%;

}

/* 焙煎機紹介 */

.free_roastmc {

background-image: url(../images/coffee_bg.jpg);

background-size: 250px;

background-repeat: no-repeat;

background-position: top right;

padding-top: 200px;

}

.free_roastmc .inner_mainfree_box {

display: block;

}

.roast_left {

width: 100%;

}

.roast_left .inner_roastmc_box {

background-color: #F5F3EF;

padding: 10px;

}

.inner_roastmc_box img {

max-width: 670px;

object-fit: cover;

width: 100%;

}

.roast_right {

width: 100%;

padding-top: 30px;

}

.roast_right .inner_roastmc_box {

display: block;

justify-content: flex-end;

}

.top_bracket {

text-align: center;

line-height: 30px;

position: relative;

letter-spacing: 0px;

color: #000;

margin: 0 0 30px;

padding: 30px;

top: 10px;

font-size: 16px;

font-weight: 500;

max-width: 430px;

left: 50%;

transform: translateX(-50%);

}

.top_bracket::before {

content: "[";

position: absolute;

left: 0;

top: 38%;

transform: translateY(-50%);

font-size: 120px;

font-weight: 300;

}

.top_bracket::after {

content: "]";

position: absolute;

right: 0;

top: 38%;

transform: translateY(-50%);

font-size: 120px;

font-weight: 300;

}

h4.bracket_emh {

margin-bottom: 20px;

font-size: 18px;

}

.machine_desc, .wholesale_desc {

font-size: 14px;

letter-spacing: 1px;

font-weight: 500;

padding: 0 0 30px;

line-height: 2;

}

.machine_desc {

max-width: 450px;

margin: 0 auto;

}

.wholesale_desc {

padding: 0 10px;

}

.roast_right img {

display: block;

padding: 10px;

max-width: 300px;

width: 100%;

margin-left: auto;

}

.wholesale {

background-color: #F5F3EF;

margin-top: 50px;

flex-direction: column;

}

.wholesale .top_bracket {

top: 0;

margin: 20px 0;

}

.wholesale_image {

width: 100%;

height: 300px;

order: 2;

}

.wholesale_image img {

width: 100%;

height: 100%;

object-fit: cover;

object-position: top center;

}

.wholesale_contact {

text-align: center;

padding-top: 50px;

margin-bottom: 50px;

}

.wholesale_contact A {

background-color: #FFF;

padding: 20px 30px;

border: 5px solid #000;

letter-spacing: 2px;

display: inline-block;

}

.wholesale_contact A:hover {

background-color: #000;

color: #fff;

}

/* 最近チェックしたアイテム */

.main_recently_item_box {

background-color: #F5F5F5;

padding: 50px 0;

}

.swipe_list .pointer_box span.pointer_next, .swiper-button-next, .use_hover .swipe_list .pointer_box span.pointer_next:hover, .use_hover .itemlist_box .swiper-button-next:hover {

background-image: url(../images/next_btn.png);

}

.swipe_list .pointer_box span.pointer_prev, .swiper-button-prev, .use_hover .swipe_list .pointer_box span.pointer_prev:hover, .use_hover .itemlist_box .swiper-button-prev:hover {

background-image: url(../images/prev_btn.png);

}

.swipe_list .pointer_box span.pointer_next:hover, .use_hover .itemlist_box .swiper-button-next:hover, .use_hover .swipe_list .pointer_box span.pointer_prev:hover, .use_hover .itemlist_box .swiper-button-prev:hover {

background-color: #E5E5E5

}

.swipe_list .pointer_box span.pointer_prev, .swipe_list .pointer_box span.pointer_next, .swiper-button-prev, .swiper-button-next {

background-color: #F5F5F5;

border: 0px;

background-size: 20px 33px;

}

.slider_box .swiper-pagination-bullet-active, .swipe_list .pointer span.current {

background-color: #000;

border: 1px solid #000;

}

.slider_box .swiper-pagination-bullet, .swipe_list .pointer span {

border: 1px solid #000;

}

.recently_reset .fa::before {

content: "";

}

.recently .section_title_right_edge .global_iconleft A {

padding: 10px 20px;

border-radius: 0;

background-color: #F5F5F5;

letter-spacing: 2px;

}

/* フッター */

.footer_area, .footer_nav {

background-color: #FFF;

border: 0px;

}

#inner_footer_free_top {

overflow: hidden;

}

.cafeintro .inner_mainfree_box {

justify-content: center;

flex-direction: column;

}

.cafe_desc {

padding-right: 0px;

width: 100%;

}

.inner_cafe_desc {

position: relative;

top: 0;

transform: none;

text-align: center;

padding-bottom: 30px;

}

.cafe_image {

text-align: center;

}

.cafe_image img {

width: 500px;

}

.f_logo {

text-align: center;

}

.f_sns_share {

justify-content: center;

padding-bottom: 40px;

}

.f_sns_share img {

max-width: 20px;

width: 100%;

}

.sns_logo {

padding: 35px;

}

.cafe_data {

display: inline-block;

font-weight: 500;

text-align: left;

}

.desc_ttl {

min-width: 80px;

}

.cafe_data > div {

padding-bottom: 10px;

}

.f_map {

max-width: 1400px;

max-height: 450px;

margin: 0 auto;

}

.f_map iframe {

width: 100%;

height: 250px;

}

#copyright {

font-weight: 500;

font-size: 12px;

}

.footer_nav_item .nav_btn {

border-bottom: none;

padding: 0 10px;

}

.footer_nav_item .nav_btn .menu_nav_icon::before {

content: "";

}

.responsive .footer_nav {

margin-top: 50px;

}

.inner_footer_nav {

border-top: 5px solid #000000;

padding-top: 20px;

padding-bottom: 20px;

}

.wide_layout .footer_nav .fix_center {

max-width: 1400px;

}

.fixed_corner_button {

border-radius: 50%;

background-color: #000;

}

.responsive .inner_footer_nav .menu_nav_icon {

width: 0px;

}

.responsive .footer_nav_item {

margin-bottom: 20px;

}

.fixed_corner_button .fa {

font-size: 32px;

margin-top: 3px;

}

.jpn_version .move_to_add_cart .shopping_cart_icon {

margin-top: 6px;

}

/* inview */

.inviewfadeIn {

opacity: 0;

transition: 0.8s;

}

.fadeIn {

opacity: 1.0;

}

.inviewUp {

transform: translate(0, 40px);

-webkit-transform: translate(0, 40px);

transition-duration:0.8s;

}

.Up {

transform: translate(0, 0);

-webkit-transform: translate(0, 0);

}

.inviewDown {

transform: translate(0, -40px);

-webkit-transform: translate(0, -40px);

transition-duration:0.8s

}

.Down {

transform: translate(0, 0);

-webkit-transform: translate(0, 0);

}

font[color$="FFFBFF"] {

color: #000;

}

@media screen and (max-width: 979px) {

/* ヘッダー */

.site_header {

align-items: center;

display: flex;

height: 100%;

opacity: 0;

padding: 0;

position: fixed;

visibility: hidden;

width: 100%;

z-index: 2;

transition: .5s;

background-color: #F5F3EF;

top: 0px;

left: 0px;

}

.site_header.open {

opacity: 1;

visibility: visible;

/*height: calc(100vh + 200px);*/

overflow-y: scroll;

/*margin-top: 80px;*/

}

.sp_menu{

display: block;

position: fixed;

top: 40px;

right: 10px;

width: 25px;

height: 25px;

margin: 0 auto;

cursor: pointer;

transition: .5s;

z-index: 9999;

}

.sp_menu .bar {

display: inline-block;

width: 25px;

height: 2px;

background-color: #000;

position: absolute;

left: 0;

transition: .25s ease-in-out;

}

#bar01 {top: 0;}

#bar02 {top: 9px;}

#bar03 {top: 18px;}

.active .bar{

background-color: #000;

}

.active #bar01 {

top: 11px;

transform: rotate(45deg);

}

.active #bar02 {width: 0;}

.active #bar03 {

top: 11px;

transform: rotate(135deg);

}

#globalnav {

width: 90%;

position: absolute;

top: 0px;

left: 50%;

transform: translateX(-50%);

-webkit-transform: translateX(-50%);

}

#globalnav .globalnavbtn {

width: 100%;

max-width: inherit;

}

#globalnav .btn_menu {

margin-bottom: 15px;

border: 3px solid #000000;

}

#globalnav .globalnavbtn A {

font-size: 16px;

padding-left: 0px;

}

#globalnav .globalnavbtn A:hover {

color: #555;

}

ul.globalnavlist > li.btn_menu > A {

cursor: default;

}

#globalnav .dropdwn_menu {

display: block!important;

width: auto!important;

position: relative!important;

padding-bottom: 0px;

}

#globalnav ul.dropdwn ul.dropdwn_menu {

padding-top: 0px;

}

#globalnav .globalnavbtn A, #globalnav .globalnavbtn A:hover {

text-align: left;

position: relative;

}

#globalnav .dropdwn_menu .subnavbtn A {

font-weight: 500;

position: relative;

font-size: 13px;

}

#globalnav .btn_about A::after, #globalnav .btn_contents A::after, #globalnav .btn_option A::after {

content: none;

border-top: none;

border-right: none;

}

#globalnav .dropdwn_menu .subnavbtn A:hover {

border-bottom: none;

}

#globalnav .dropdwn_menu {

padding: 0px;

}

.btn_menu .subnavbox {

opacity: 0;

transition: .3s;

height: 0px;

overflow: hidden;

margin: 0 10px;

}

.btn_menu .is-active .subnavbox {

opacity: 1;

transition: .3s;

height: auto;

overflow: visible;

margin: 0 20px;

}

.globalnavbtn A {

position: relative;

padding: 15px;

cursor: pointer;

font-size: 26px;

text-align: center;

line-height: 1.4;

}

.toggle_btn {

position: absolute;

top: 50%;

right: 10px;

transform: translateY(-50%);

display: block;

width: 20px;

height: 20px;

overflow: hidden;

}

.toggle_btn:before, .toggle_btn:after {

display: block;

content: "";

background-color: #000000;

position: absolute;

width: 10px;

height: 1px;

top: 50%;

left: 50%;

transform: translate(-50%, -50%);

}

.toggle_btn:before {

width: 1px;

height: 10px;

}

.toggle_title.selected .toggle_btn:before {

content: normal;

}

.btn_menu .subnavbox {

display: block;

}

.subnavbtn {

width: 100%;

}

}

@media (max-width: 900px) {

/* ヘッダー */

#hamburger {

background-color: transparent;

position: relative;

cursor: pointer;

margin: 0 0 0 auto;

height: 60px;

width: 60px;

}

}

@media screen and (max-width: 709px) {

/* ヘッダー */

.sp_menu {

top: 30px;

}

.sp_menu.active {

top: 15px;

background-color: #F5F3EF;

}

.header_logo img {

width: 50px;

height: 50px;

}

}

@media screen and (max-width: 499px) {

/* ヘッダー */

#globalnav .globalnavbtn, #globalnav .dropdwn_menu .subnavbtn {

padding: 0px;

}

#globalnav .globalnavbtn A {

font-size: 18px;

padding: 8px 0px;

}

#globalnav .dropdwn_menu .subnavbtn A {

font-size: 12px;

}

.btn_menu .is-active .subnavbox {

margin: 0px 10px;

}

/* 最近チェックしたアイテム */

.recently .section_title_right_edge .recently_reset {

top: -25px;

}

.recently .section_title_right_edge .recently_reset .general_btn {

padding: 5px 10px;

}

}

@media screen and (min-width: 500px) {

/* 全体 */

.main_box .section_title h2::before {

padding-bottom: 20px;

}

.more_item {

padding: 50px 0;

}

.responsive #container .list_item_cell {

margin-bottom: 30px;

}

/* トップコンテンツ表示調整 */

.main_section, .top_mainbox {

padding: 50px 0px;

}

.main_free_box {

padding: 0px;

}

/* ヘッダー */

.subnavbtn .menu_btn {

padding: 10px 15px;

}

.menu_list {

padding: 10px 15px;

}

/* SNSシェア */

.sns_ttl {

padding-right: 135px;

font-size: 14px;

}

.sns_ttl::after {

content: "";

width: 80px;

height: 3px;

background-color: #000;

display: inline-block;

position: absolute;

top: 50%;

transform: translateY(-50%);

margin-left: 30px;

}

.sns_btn img {

height: 30px;

}

/* コンセプト */

.concept_logo {

padding: 50px;

min-width: 400px;

}

.concept_logo_sub {

padding: 50px 0;

}

.concept_logo_sub img {

max-width: 200px;

}

.concept_text {

margin: 0 auto;

}

.cafeimage {

padding-top: 50px;

padding-bottom: 100px;

}

/* 商品ピックアップ */

.item_ttl {

padding: 20px 30px;

letter-spacing: 3px;

font-size: 16px;

}

.pitem_desc {

letter-spacing: 2px;

margin-top: -20px;

}

.itemname {

font-size: 20px;

}

/* アイテムカテゴリ */

.category_wrap {

height: 400px;

}

.cbox {

padding: 15px;

}

.category_name {

font-size: 16px;

letter-spacing: 2px;

}

.roast {

padding: 50px 0 0;

}

.roast_wrap {

padding: 10px;

}

.roast_level {

font-size: 24px;

padding: 30px 0;

}

.roast_text {

font-size: 14px;

padding-bottom: 30px;

}

.roast_text br {

display: block;

}

.roast_wrap img {

max-width: 150px;

}

/* 焙煎機紹介 */

.free_roastmc {

background-size: 350px;

}

.roast_left .inner_roastmc_box {

padding: 50px;

}

.roast_left {

width: 70%;

}

.top_bracket {

letter-spacing: 2px;

margin: 0 0 -90px;

top: -105px;

}

.machine_desc, .wholesale_desc {

padding: 0 0 50px;

}

.wholesale_desc {

padding: 0 50px;

}

.wholesale {

margin-top: 100px;

}

.wholesale .top_bracket {

margin: 50px 0;

}

/* フッター */

.inner_footer_nav {

padding-top: 50px;

}

}

@media screen and (min-width: 600px) {

/* 焙煎機紹介 */

.roast_right {

padding-top: 60px;

}

.roast_right .inner_roastmc_box {

display: flex;

}

.roast_right img {

padding: 20px;

max-width: 400px;

margin-left: 0;

}

/* フッター */

.f_map iframe {

height: 450px;

}

}

@media screen and (min-width: 640px) {

/* スライド */

#photo img {

height: 500px;

}

.wide_layout .has_wide_photo .top_image_slide .swiper-button-prev {

left: 20px;

margin-left: 0;

}

.wide_layout .has_wide_photo .top_image_slide .swiper-button-next {

right: 20px;

margin-right: 0;

}

}

@media screen and (min-width: 700px) {

.layout_photo .list_item_data {

max-width: 250px;

}

}

@media screen and (min-width: 710px) {

/* 全体 */

.side_box .section_title h2, .main_box .section_title h2, .main_box .page_title h2 {

font-size: 16px;

font-weight: bold;

}

.main_box .section_title h2::before {

font-size: 35px;

}

/* トップコンテンツ表示調整 */

.inner_mainfree_box {

padding: 50px 0;

}

#contents {

padding-top: 100px;

}

/* ヘッダー */

.inner_header_area {

height: 100px;

}

/* スライド */

#photo {

margin-top: 100px;

padding-right: 100px;

}

/* SNSシェア */

.sns_share {

position: absolute;

transform: rotate(90deg);

top: 36%;

right: -132px;

margin: 0;

}

.sns_btn {

padding: 0px 10px;

transform: rotateZ(-90deg);

}

/* コンセプト */

.concept_image img {

height: 500px;

}

.cafeimage img {

padding-left: 50px;

max-width: 400px;

}

/* 商品ピックアップ */

.pickup_item {

width: 50%;

padding: 10px;

}

/* アイテムカテゴリ */

.roast {

display: flex;

padding: 100px 0 0;

}

.roast_wrap {

width: calc(100%/3);

}

.roast .roast_wrap {

border-right: 5px solid #000;

border-bottom: 0px;

}

.roast .roast_wrap:last-child {

border-right: 0px;

}

.inner_roast_wrap {

display: block;

}

.roast_desc {

text-align: center;

width: auto;

}

/* 焙煎機紹介 */

.top_bracket {

margin: 0 0 -70px;

top: -120px;

}

h4.bracket_emh {

font-size: 22px;

}

/* フッター */

.responsive .column1 .advanced_flex_wrap .footer_nav_item {

width: auto;

padding: 0 30px;

}

ul.inner_footer_nav li {

border-right: 1px solid #000000;

}

ul.inner_footer_nav li:last-child {

border-right: 0px

}

.footer_nav_item .nav_btn .chevron_right_icon::before {

content: "";

}

}

@media screen and (min-width: 780px) {

/* アイテムカテゴリ */

.category_wrap {

width: 50%;

}

}

@media screen and (min-width: 840px) {

/* コンセプト */

.inner_concept_box {

display: flex;

height: 500px;

}

.concept_logo {

text-align: left;

}

/* 商品ピックアップ */

.pickup_item {

padding: 30px;

}

.pitem_desc {

padding: 0 20px;

}

/* 焙煎機紹介 */

.machine_desc, .wholesale_desc {

letter-spacing: 3px;

line-height: 2.5;

}

}

@media screen and (min-width: 880px) {

/* フッター */

.cafeintro .inner_mainfree_box {

flex-direction: row;

}

.cafe_desc {

padding-right: 50px;

width: 40%;

}

.inner_cafe_desc {

top: 50%;

transform: translateY(-50%);

padding-bottom: 0px;

}

}

@media screen and (min-width: 900px) {

/* フッター */

.responsive .column1 .advanced_flex_wrap .footer_nav_item {

padding: 0 50px;

}

}

@media screen and (min-width: 920px) {

/* 焙煎機紹介 */

.wholesale {

flex-direction: row;

}

.wholesale_image {

width: 50%;

height: auto;

order: 0;

}

.wholesale_image img {

max-width: 530px;

}

}

@media screen and (min-width: 980px) {

/* ヘッダー */

.inner_header_area {

padding: 0 30px;

}

.globalnavbtn > A {

-webkit-transform: perspective(1px) translateZ(0);

transform: perspective(1px) translateZ(0);

position: relative;

overflow: hidden;

}

.globalnavbtn > A::before {

content: "";

position: absolute;

z-index: -1;

left: 0;

right: 100%;

bottom: 0;

height: 3px;

background: #000000;

-webkit-transition-property: right;

transition-property: right;

-webkit-transition-duration: 0.3s;

transition-duration: 0.3s;

-webkit-transition-timing-function: ease-out;

transition-timing-function: ease-out;

}

.globalnavbtn > A:hover::before {

right: 0;

}

.dropdwn_menu {

top: 100px;

}

/* コンセプト */

.inner_concept_box, .concept_image img {

height: 700px;

}

.concept_logo_sub {

padding: 150px 0;

}

.concept_logo_sub img {

max-width: 250px;

}

/* 商品ピックアップ */

.item_ttl {

font-size: 20px;

}

.itemname {

font-size: 25px;

}

.fa-arrow::before {

width: 36px;

height: 30px;

}

/* アイテムカテゴリ */

.category_wrap {

height: 600px;

}

.category_name {

font-size: 20px;

}

.roast_wrap {

padding: 30px;

}

.roast_level {

font-size: 30px;

}

.roast_wrap img {

max-width: 250px;

}

/* 焙煎機紹介 */

.free_roastmc .inner_mainfree_box {

display: flex;

}

.roast_left {

width: 55%;

}

.roast_right {

width: 45%;

padding-top: 400px;

padding-right: 50px;

padding-left: 100px;

}

.roast_right .inner_roastmc_box {

display: block;

}

.roast_right img {

padding: 20px 0;

max-width: 480px;

}

}

@media screen and (min-width: 1100px) {

/* スライド */

#photo {

padding-right: 150px;

}

#photo img {

height: 850px;

}

/* SNSシェア */

.sns_share {

top: 50%;

right: -110px;

}

/* 焙煎機紹介 */

.wholesale {

max-height: 600px;

}

}



/* # =================================================================

# 

# ↑　おちゃのこネットデザイン作成プラン　↑

#             2021.8.3 upload

# 

# ================================================================= */