@charset "utf-8";
@import url("import_custom_pc.css");

/************************************************
 import css
************************************************ */
/* トップページ */
#container {
width: 100%;
max-width: 1300px;
min-width: 980px;
}
.LC_Page_Index #container {
width: 100%;
max-width: 1300px;
min-width: 980px;
}

/* 商品一覧 */
.plg_Raku2_LC_Page_Products_List #container {
width: 100%;
max-width: 1300px;
min-width: 980px;
}

/* 商品詳細ページ */
.plg_Raku2_LC_Page_Products_Detail #container {
width: 100%;
max-width: 1300px;
min-width: 980px;
}

.slick-slide img {
width: 980px;
}

#main_column.colnum2{
float: none!important;
width: auto;
padding-left: 255px;
padding-right: 10px;
}

#main_column.colnum1 #mypagecolumn,
.custom_page #faqarea{
width: 100%;
}

/*---------------------------------------
headerエリア
---------------------------------------*/

.raku2_theme01 #header_wrap{
	border-bottom: 1px solid #ccc;
	margin-bottom: 30px;
}
body .raku2_theme01 #header_wrap #site_description {
    max-width: 1500px;
    margin: 4px auto;
    width: 98%;
    font-size: 12px;
    line-height: 1.4;
}
body .raku2_theme01 #header_wrap #header {
    max-width: 1500px;
    display: flex;
    align-items: end;
    justify-content: space-around;
    width: 98%;
    height: auto;
    min-height: 44px;
    margin: 4px auto 14px;
    padding: 0;
}
.raku2_theme01 .-flex0{
	flex-grow: 0;
}
.raku2_theme01 .-flex1{
	flex-grow: 1;
}
.raku2_theme01 .-flex2{
	flex-grow: 2;
}
.raku2_theme01 .-flex3{
	flex-grow: 3;
}
.raku2_theme01 .-box{
	width: 100%;
}
.raku2_theme01 .logo_area {
	margin: 0;
	width: auto;
	text-align: left;
}
.raku2_theme01 .logo_area img {
	max-height: 40px;
}

/* ロゴ見出し */
.raku2_theme01 #header_wrap .logo_area h1 {
    margin: 0;
    padding: 0;
    line-height: 1;
}

/* ロゴ画像 */
.raku2_theme01 #header_wrap .logo_area h1 img {
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 42px;
}

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

.raku2_theme01 #header_wrap #header .block_outer #search_area {
    padding: 0 0 3px 0;
}

/* フォーム全体。項目間隔は gap */
body .raku2_theme01 #header_wrap #header .block_outer #search_area form#search_form {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0;
    border: 0;
    border-bottom: 1px solid #9ca3af;
    border-radius: 0;
    background: transparent;
    overflow: hidden;
    width: 360px;
    max-width: 100%;
    box-sizing: border-box;
    margin-left: auto;
}

/* カテゴリ選択の外枠：100px */
body .raku2_theme01 #header_wrap #header .block_outer #search_area form#search_form > dl.formlist {
    flex: 0 0 100px;
    width: 100px;
    min-width: 0;
    margin: 0;
    padding: 0;
}

/* 入力欄の外枠：残りの幅 */
body .raku2_theme01 #header_wrap #header .block_outer #search_area form#search_form > dl.formlist.-box {
    flex: 1 1 0;
    width: auto;
}

/* 各入力要素の余白を解除 */
body .raku2_theme01 #header_wrap #header .block_outer #search_area form#search_form > dl.formlist > dd {
    float: none;
    width: 100%;
    margin: 0;
    padding: 0;
}

/* 検索ボタンの外枠：38px */
body .raku2_theme01 #header_wrap #header .block_outer #search_area form#search_form > p {
    position: relative;
    flex: 0 0 38px;
    margin: 0;
    padding: 0;
}

/* 入力中の下線：境界線 1px ＋ 影 1px */
body .raku2_theme01 #header_wrap #header .block_outer #search_area form#search_form:focus-within {
    border-bottom-color: var(--main-color);
    box-shadow: 0 1px 0 var(--main-color);
}

/* カテゴリ選択 */
body .raku2_theme01 #header_wrap #header .block_outer #search_area form#search_form select {
    width: 100px;
    height: 38px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--main-color);
    outline: 0;
}

/* キーワード入力欄 */
body .raku2_theme01 #header_wrap #header .block_outer #search_area form#search_form input[type="text"] {
    min-width: 0;
    width: 100%;
    height: 38px;
    padding: 0 4px;
    box-sizing: border-box;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #191919;
    outline: 0;
}

/* 検索ボタンと虫眼鏡 */
body .raku2_theme01 #header_wrap #header .block_outer #search_area .submit_btn {
    width: 38px;
    height: 38px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background-color: transparent;
    background-image: none;
    cursor: pointer;
    transition: opacity 0.15s ease;
}

/* 虫眼鏡：形はマスク、色はメインカラー。クリックは下のボタンに通す */
body .raku2_theme01 #header_wrap #header .block_outer #search_area form#search_form > p::before {
    content: "";
    position: absolute;
    inset: 0;
    background-color: var(--main-color);
    --search-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round'%3E%3Ccircle cx='10' cy='10' r='6.5'/%3E%3Cpath d='M15 15l6 6'/%3E%3C/svg%3E");
    -webkit-mask: var(--search-icon) center / 22px 22px no-repeat;
    mask: var(--search-icon) center / 22px 22px no-repeat;
    pointer-events: none;
    transition: opacity 0.15s ease;
}

body .raku2_theme01 #header_wrap #header .block_outer #search_area form#search_form > p:hover::before {
    opacity: 0.65;
}

/* 検索ボタンのホバー */
body .raku2_theme01 #header_wrap #header .block_outer #search_area .submit_btn:hover {
    background-color: transparent;
    opacity: 0.65;
}

/* 検索ボタンのフォーカス */
body .raku2_theme01 #header_wrap #header .block_outer #search_area .submit_btn:focus-visible {
    outline: 2px solid var(--main-color);
    outline-offset: -2px;
}

/* 標準のパスワード入力指定は依存先未確認のため維持 */
.raku2_theme01 #header_wrap #header .block_outer #search_area form#search_form input[type='password'] {
    width: 95%;
    border: none;
    padding: 2px;
    background-color: #eeeeee;
    outline: 0;
}

/* -------------カートエリア------------- */

	.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea{
	display: flex;
	align-items: end;
	justify-content: right;
}
.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea .userarea_name{
	text-align: right;
	margin: 0 10px 0 20px;
	font-size: 90%;	
}
.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea .userarea_cart_btn,
.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea .userarea_new_btn,
.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea .userarea_mypage_btn,
.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea .userarea_login_btn,
.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea .userarea_history_btn,
.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea .userarea_favorite_btn {
    position: relative;
    font-size: 78%;
    margin-left: 2px;
    width: 66px;
    text-align: center;
    flex-shrink: 0; /* 幅が縮まないよう追加 */
}

/* アイコンのサイズ・位置を統一 */
.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea .userarea_cart_btn img,
.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea .userarea_new_btn img,
.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea .userarea_mypage_btn img,
.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea .userarea_login_btn img,
.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea .userarea_history_btn img,
.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea .userarea_favorite_btn img {
    position: absolute;
    left: 50%;
    top: -34px;
    width: 28px;
    height: 28px;
    transform: translateX(-50%);
}

/* カート数量：既存の指定を維持 */
.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea .userarea_cart_btn .quantity {
    position: absolute;
    top: -40px;
    left: 38px;
    background: var(--accent-color);
    border-radius: 50%;
    width: 20px;
    height: 20px;
    text-align: center !important;
    line-height: 20px;
    z-index: 9;
}

/* -------------特典------------- */

.raku2_theme01 #header_wrap #header_benefits a{
	background-color: #EFE56E;
	margin: 0 auto;
	border-radius: 8px;
	color: #1D1D1D;
	width: 98%;
	max-width: 1500px;
}
.raku2_theme01 #header_wrap #header_benefits a h2{
	background-color: var(--accent-color);
	text-align: right;
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
	padding: 8px 2vw;
	margin-right: 2vw;
}
.raku2_theme01 #header_wrap #header_benefits a,
.raku2_theme01 #header_wrap #header_benefits a ul li{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	flex-direction: row;
}
.raku2_theme01 #header_wrap #header_benefits a ul{
	display: flex;
	align-items: center;
}
.raku2_theme01 #header_wrap #header_benefits a ul li{
	font-weight: 600;
	font-size: 0.8rem;
	margin: 5px 0;
}
.raku2_theme01 #header_wrap #header_benefits a ul li span{
	margin: 0 0.5vw;
	background-color: #fff;
	border-radius: 5px;
	padding: 8px 4px;
	width: 30px;
	text-align: center;
}
.raku2_theme01 #header_wrap #header_benefits a ul li span img{
	max-width: 22px;
}

/* -------------headerナビ------------- */

.raku2_theme01 #header_wrap #gloval_navi{
	border-bottom: none;
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	max-width: 1500px;
	margin: 18px auto;
	font-size: 90%;
	width: 98%;
}
.raku2_theme01 #header_wrap #gloval_navi > ul{
	width: auto;
	margin: 0;
	display: flex;
	justify-content: space-between;
}
.raku2_theme01 #header_wrap #gloval_navi .shoppingt_btn > li > a,
.raku2_theme01 #footer_wrap #footer #info_area .shoppingt_btn a{
	background-color: var(--main-color);
	border-radius: 30px;
	color: #fff!important;
	padding: 12px 1.5vw;
	margin: 0 5px;
	min-width: 7vw;
	display: block
}
.raku2_theme01 #header_wrap #gloval_navi .shoppingt_btn li.header_cat_btn a:after{
	color: #fff;
}
.raku2_theme01 #header_wrap #gloval_navi .use_btn > li > a{
	position: relative;
	padding: 0 0 0 1em;
	margin: 0 0 0 1.5vw;
	color: #191919;
}
.raku2_theme01 #header_wrap #gloval_navi .use_btn > li > a::before {
	position: absolute;
	top: 50%;
	left: 0px;
	transform: translateY(-50%);
	width: 0px;
	height: 0px;
	border: 0.3em solid transparent;
	border-left: 0.4em solid var(--main-color);
	content: "";
}
#gloval_navi .header_catwrap ul.tree1-outer{
	top: 40px;
    left: 42%;
}

/*---------------------------------------
mainエリア
---------------------------------------*/

.LC_Page_Index #container{
	max-width: 1500px;
	margin: 0 auto;
}
.LC_Page_Index div#main_column > div{
	margin-top: 15px;
}
.bx-wrapper img{
	border-radius: 8px;
}

#leftcolumn .raku2_theme01 .block_outer #category_area h2,
#main_column .raku2_theme01 .recommend_list h2,
#main_column .history_list h2,
.raku2_theme01 #footer_wrap #footer #footer_category_area h2,
.raku2_theme01 #footer_wrap #footer #use_area h2,
.raku2_theme01 #footer_wrap #footer #info_area h2,
.raku2_theme01 .block_outer #exclusive_benefits_area h2,
.raku2_theme01 .block_outer #choose_area h2{
	background-color: transparent;
	color: #000;
	font-size: 140%;
	font-weight: 600;
	text-align: left;
	padding: 10px;
	margin: 0;
	border: none;
}
.raku2_theme01 #footer_wrap #footer #footer_category_area h2,
.raku2_theme01 #footer_wrap #footer #info_area h2,
.raku2_theme01 #footer_wrap #footer #use_area h2{
	font-size: 115%;
}

#leftcolumn .raku2_theme01 .block_outer #category_area h2 span,
#main_column .raku2_theme01 .recommend_list h2 span,
#main_column .history_list h2 span,
.raku2_theme01 #footer_wrap #footer #footer_category_area h2 span,
.raku2_theme01 .block_outer #exclusive_benefits_area p,
.raku2_theme01 .block_outer #choose_area p{
	font-size: 80%;
	color: var(--main-color);
	margin: 0 15px;
	font-weight: 600;
}
#main_column .raku2_theme01 .recommend_list{
	margin-bottom: 0;
}
#main_column .raku2_theme01 .recommend_list .block_body{
	padding: 0 0 10px;
}
#main_column .raku2_theme01 #main_category_area ul{
	display: flex;
	align-items: flex-start;
	margin-bottom: 30px;
	text-align: center;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
}
#main_column .raku2_theme01 #main_category_area ul li{
	margin-bottom: 30px;
}
#main_column .raku2_theme01 #main_category_area ul img{
	max-width: 185px;
	margin: 10px;
}
#main_slide_image .bxslider li img{
	width: 980px;
}

/*---------------------------------------
leftエリア
---------------------------------------*/


#leftcolumn{
	margin-left: 1%;
}
.side_column .block_body{
	border: none;
}

/* -------------カテゴリ------------- */

#leftcolumn .raku2_theme01 .block_outer #category_area li.level1 p a{
	position: relative;
	display: block;
	padding: 12px 10px;
	color: #191919;
	text-decoration: none;
}
#leftcolumn .raku2_theme01 .block_outer #category_area li.level1 p a:before{
	content: '';
	width: 6px;
	height: 6px;
	border: 0;
	border-top: solid 2px  var(--main-color); /* 変更#847563; */
	border-right: solid 2px  var(--main-color); /* 変更#847563; */
	position: absolute;
	top: 50%;
	right:10px;
	margin-top: -4px;
	transform: rotate(45deg);
}
#leftcolumn .raku2_theme01 .block_outer #category_area li.level1:nth-child(odd) {
	background: #EEEEEE; /* 変更F0EBE6 */
}

/* -------------カレンダー------------- */

#leftcolumn .raku2_theme01 .block_outer #calender_area table {
	width: 100%;
	 margin: 0 auto 20px;
}
#leftcolumn .raku2_theme01 .block_outer #calender_area table .month {
	background: var(--main-color); /* 変更847563; */
	color: #fff; /* 追加 */
	border-radius: 30px;
	padding: 5px 0px;
	margin: 10px 0;
}
#leftcolumn .raku2_theme01 .block_outer #calender_area th {
	border-bottom: 1px solid transparent!important;
	background-color: transparent!important;
}
#leftcolumn .raku2_theme01 .block_outer #calender_area table td{
	border-bottom: none!important;
	border-right: none!important;
	padding: 6px;
}
#leftcolumn .raku2_theme01 .block_outer #calender_area .off {
	color: #b34848;
	background-color: #fbe9e9;
}
#leftcolumn .raku2_theme01 .block_outer #calender_area .today {
	background-color: var(--ms-back-color); /* 変更#efe56e; */
	font-weight: bold;
}
#leftcolumn #calender_area .block_body {
    padding-top: 0;
}
/* 商品カテゴリと営業日カレンダーの間隔 */
#leftcolumn #calender_area {
    padding-top: 20px;
}
/*---------------------------------------
fooderエリア
---------------------------------------*/

.raku2_theme01 #footer_wrap  {
	border-top: none;
	background-color: #E3E1E1; /* 変更#e4dfda */
	padding: 0;
}
.raku2_theme01 #footer_wrap #footer {
	max-width: 1500px;
	width: 98%;
	display: flex;
	align-items: flex-start;
	margin: 40px auto;
}

/* -------------バナーエリア------------- */

.raku2_theme01 #footer_wrap #footer_banner{
	padding-top: 30px;
	padding-bottom: 30px;
	background-color: #fff;
}
.raku2_theme01 #footer_wrap #footer_banner #banner_area{
	max-width: 1500px;
	margin: 0 auto;
}
.raku2_theme01 #footer_wrap #footer_banner #banner_area div{
	margin: 10px;
}
.raku2_theme01 #footer_wrap #footer_banner #banner_area div img{
	width: 100%;
}
.raku2_theme01 #footer_wrap #copyright #company_area .logo_area{
	margin: 0 30px 0 0;
}

/* -------------fooderナビ------------- */

.raku2_theme01 #footer_wrap #footer #category_area,
.raku2_theme01 #footer_wrap #footer #use_area{
	padding: 0 4vw 0 0;
}
.raku2_theme01 #footer_wrap #footer #info_area{
	margin-left: auto;
	text-align: center;
	background-color: #fff;
	border-radius: 10px; /* 変更30px */
	padding: 18px;
}
.raku2_theme01 #footer_wrap #footer #info_area h2{
	text-align: center;
}
.raku2_theme01 #footer_wrap #footer #info_area .tel{
	font-size: 210%;
	font-weight: 600;
	margin-top: -12px;
}
.raku2_theme01 #footer_wrap #footer #info_area p{
	font-size: 90%;
	margin-bottom: 20px;
}

.raku2_theme01 #footer_wrap #footer ul{
	display: flex;
	flex-direction: column;
	background: none;
	text-align: left;
}
.raku2_theme01 #footer_wrap #footer ul li,
.raku2_theme01 #footer_wrap #footer ul li:first-child{
	border: none;
	margin: 0;
	padding: 0;
}
.raku2_theme01 #footer_wrap #footer ul li a{
	display: block;
	padding: 6px 10px;
	text-decoration: none;
}

.raku2_theme01 #footer_wrap #copyright{
	padding-top: 30px;
	padding-bottom: 30px;
}

.raku2_theme01 #footer_wrap #copyright #company_area,
.raku2_theme01 #footer_wrap #footer_banner #banner_area{
	display: flex;
	align-items: flex-start;
	margin-bottom: 30px;
	justify-content: center;
	text-align: left;
}


/*---------------------------------------
加盟店ページ
---------------------------------------*/

#main_column #undercolumn #undercolumn_entry h2.title{
    font-size: 180%;
    border-bottom: 3px solid #857663;
    margin: 30px auto 60px;
    width: 18%;
}
#main_column #undercolumn #undercolumn_entry .progressbar{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-evenly;
    align-items: flex-start;
    margin: 30px auto;
}
#main_column #undercolumn #undercolumn_entry .progressbar li{
    position: relative;
}
#main_column #undercolumn #undercolumn_entry .progressbar li:after{
    position: absolute;
    z-index: -1;
    top: 50px;
    left: 0;
    width: 360px;
    height: 1px;
    content: '';
    background-color: #857663;
}
#main_column #undercolumn #undercolumn_entry .progressbar li.active{
    background-color: #847563!important;
    color: #ffffff!important;
}
#main_column #undercolumn #undercolumn_entry .progressbar li:last-child:after {
    content: none;
}
#main_column #undercolumn #undercolumn_entry .progressbar li.item{
    background-color: #F0EBE6;
    text-align: center;
    color: #847563;
    font-weight: 600;
    padding: 15px 20px;
    border-radius: 8px;
    width: 60px;
}
#main_column #undercolumn #undercolumn_entry .progressbar li.item span{
    display: block;
}
#main_column #undercolumn #undercolumn_entry table,
#main_column #undercolumn #undercolumn_entry table#entry_input th,
#main_column #undercolumn #undercolumn_entry table#entry_input td{
    border: none;
    background-color: transparent;
}
#main_column #undercolumn #undercolumn_entry table#entry_input input[type='text'],
#main_column #undercolumn #undercolumn_entry table#entry_input input[type='password'],
#main_column #undercolumn #undercolumn_entry table#entry_input select{
    height: 40px;
    border: none;
    background-color: #eeeeee;
}
#main_column #undercolumn #undercolumn_entry table#entry_input td .box300{
    width: 90%;
}
#main_column #undercolumn #undercolumn_entry table#entry_input td .box30,
#main_column #undercolumn #undercolumn_entry table#entry_input td .box150{
    width: 50%;
}
#main_column #undercolumn #undercolumn_entry table#entry_input td .box10,
#main_column #undercolumn #undercolumn_entry table#entry_input td .box120{
    width: 25%;
}
#main_column #undercolumn #raku2_kiyaku_text p{
    text-align: center;
}

/*オーダーシート文字フォント*/
td.raku2_list_product_name p {
  font-size: 1.5em;
}