@charset "utf-8";
/* CSS Document */

/* ================================================================= */
/* ocnk083 -  ヘッダーナビのカテゴリ一覧  */
/* ================================================================= */

/* 大枠 */
.ocnk083.responsive .custom_nav_link {
	padding: 20px 10px;
}
.ocnk083.responsive:is(.touch032,.touch_modern) .custom_nav_link {
	padding: 10px 0 0;
}

/* カテゴリ一覧 */
.ocnk083.responsive .popup_menu_custom .custom_category_menu {
	display: grid;
	column-gap: 15px;
	justify-content: center;
	grid-auto-flow: dense;
}

/* 最小1列：min_column1 */
.ocnk083.responsive .popup_menu_custom .min_column1 .custom_category_menu {
	grid-template-columns: repeat(1, minmax(0, 1fr));
	columns: 1;
}

/* 最小2列：min_column2 */
.ocnk083.responsive .popup_menu_custom .min_column2 .custom_category_menu {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	columns: 2;
}

/* 3列 */
@media only screen and (min-width: 800px) {
	.ocnk083.responsive .popup_menu_custom :is(.min_column1,.min_column2) .custom_category_menu {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		columns: 3;
	}
}

/* 4列 */
@media only screen and (min-width: 1200px) {
	.ocnk083.responsive .popup_menu_custom :is(.min_column1,.min_column2) .custom_category_menu {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		columns: 4;
	}
}

/* 5列　※ocnk028適用時 */
@media only screen and (min-width: 1400px) {
	/* 5列 */
	.ocnk083.ocnk028.responsive .popup_menu_custom :is(.min_column1,.min_column2) .custom_category_menu {
		grid-template-columns: repeat(5, minmax(0, 1fr));
		columns: 5;
	}
}

/* 6列 ※フルスクリーンのみ */
@media only screen and (min-width: 1600px) {
	.ocnk083.ocnk028.responsive.touch_fullscreen .popup_menu_custom :is(.min_column1,.min_column2) .custom_category_menu {
		grid-template-columns: repeat(6, minmax(0, 1fr));
		columns: 6;
	}
}

/* 各カテゴリ枠 */
.ocnk083.responsive .popup_menu_custom .custom_category_menu .custom_category_menu_list {
	padding: 10px 0;
}

/* カテゴリ一覧タイトル */
.ocnk083.responsive .popup_menu_custom .custom_category_menu .custom_category_title {
	border-bottom: 1px solid #E0DFE3;
	padding: 0;
}

/* 各タイトル/各メニュー装飾リセット */
.ocnk083.responsive .popup_menu_custom .custom_category_menu .inner_main_nav .nav_btn {
	background-image: none;
	background-color: transparent;
	border: none;
}

/* カテゴリ一覧各メニュー下線 */
.ocnk083.responsive .popup_menu_custom .custom_category_menu ul.inner_main_nav .nav_btn {
	border-bottom: 1px solid #F1F1F1;
	font-weight: 500;
}

/* 通常テンプレート */
/* 各タイトル */
.ocnk083.responsive .popup_menu_custom .custom_category_menu .custom_category_title .nav_btn {
	padding: 5px 0;
	margin-bottom: 0;
	font-weight: 700;
}
/* 各メニュー */
/* 画像なし */
.ocnk083.responsive .popup_menu_custom .custom_category_menu ul.inner_main_nav .nav_btn {
	padding: 10px 5px 10px 5px;
	margin-bottom: 0;
}

/* 画像がない場合にbeforeで画像と同じ縦幅を作成する */
/*
.ocnk083.responsive .popup_menu_custom .custom_category_menu:has(.has_categoryimage) .custom_category_title:not(.has_categoryimage) .nav_btn {
	display: flex;
	align-items: center;
}
.ocnk083.responsive .popup_menu_custom .custom_category_menu:has(.has_categoryimage) .custom_category_title:not(.has_categoryimage) .nav_btn::before {
	content: "";
	width: 1px;
	height: 40px;
	display: inline-block;
	margin: 5px 0;
}
*/
/* 画像あり */
.ocnk083.responsive .popup_menu_custom .custom_category_menu ul.inner_main_nav .has_image_nav_btn {
	padding: 5px 0;
	margin-bottom: 0;
}
/* 全商品 */
.ocnk083.responsive .popup_menu_custom .custom_category_menu ul.inner_main_nav .custom_menu_all_link_wrapper .nav_btn {
	padding: 0 5px 10px;
}
/* 画像削除 */
.ocnk083.responsive .popup_menu_custom .custom_category_menu ul.inner_main_nav .custom_menu_all_link_wrapper .itemlist_categoryimage {
	display: none;
}

/* .touch32/.touch_modernテンプレート */
/* 各タイトル */
.ocnk083.responsive:is(.touch032, .touch_modern) .popup_menu_custom .custom_category_menu .custom_category_title .nav_btn {
	padding: 5px 0;
}
/* 各メニュー */
/* 画像なし */
.ocnk083.responsive:is(.touch032, .touch_modern) .popup_menu_custom .custom_category_menu ul.inner_main_nav .nav_btn {
	padding: 10px 5px 10px 20px;
}
/* 画像あり */
.ocnk083.responsive:is(.touch032, .touch_modern) .popup_menu_custom .custom_category_menu ul.inner_main_nav .has_image_nav_btn {
	padding: 5px 0;
}
/* 全商品 */
/* アイコン変更 */
.ocnk083.responsive:is(.touch032, .touch_modern) .popup_menu_custom .custom_category_menu .custom_menu_all_link_wrapper .nav_btn.has_image_nav_btn {
	position: relative;
	padding: 5px 5px 10px 20px;
}
.ocnk083.responsive:is(.touch032, .touch_modern) .popup_menu_custom .custom_category_menu .custom_menu_all_link_wrapper .nav_btn.has_image_nav_btn::before {
	content: "\e909";
	font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    font-family: ocnkiconf !important;
	position: absolute;
	top: 5px;
	left: 10px;
	transition: transform .15s linear;
}

/* マウスオーバーアニメーション */
.ocnk083.responsive.use_hover .popup_menu_custom .custom_category_menu .custom_menu_all_link_wrapper .nav_btn.has_image_nav_btn:hover::before {
	webkit-transform: translate(2px);
    transform: translate(2px);
	transition: transform .15s linear;
}

/* =================================================================
   レスポンシブ840px以上
   ================================================================= */

@media only screen and (min-width: 840px) {
	.ocnk083.responsive .custom_nav_link {
		padding: 20px;
	}
}


/* 各テンプレ指定
 # ================================================================= */

/* 1番 */
.ocnk083.responsive:is(.touch001,.touch003,.touch004) .popup_menu_custom .custom_category_menu .custom_category_title {
	border-color: #D9D9D9;
}
.ocnk083.responsive:is(.touch001,.touch003,.touch004) .popup_menu_custom .custom_category_menu ul.inner_main_nav .nav_btn {
	border-color: #E0DFE3;
}

/* 2番 */
.ocnk083.responsive.touch002 .popup_menu_custom .custom_category_menu .custom_category_title {
	border-color: #555555;
}
.ocnk083.responsive.touch002 .popup_menu_custom .custom_category_menu ul.inner_main_nav .nav_btn {
	border-color: #3333334D;
}

/* 3番 */
.ocnk083.responsive.touch003 .popup_menu_custom .custom_category_menu .inner_main_nav .nav_btn {
	background-color: #F5F5F5;
	color: #006CD8;
}

/* 黒背景 */
.ocnk083.responsive:is(.touch005,.touch013) .popup_menu_custom .custom_category_menu .custom_category_title {
	border-color: #666666;
}
.ocnk083.responsive:is(.touch005,.touch013) .popup_menu_custom .custom_category_menu ul.inner_main_nav .nav_btn {
	border-color: #4444444D;
}

/* 6番 */
.ocnk083.responsive.touch006 .popup_menu_custom .custom_category_menu .inner_main_nav .nav_btn {
    background-color: #F3EBE3;
    color: #000;
}
.ocnk083.responsive.touch006 .popup_menu_custom .custom_category_menu .custom_category_title {
	border-color: #A69D80;
}
.ocnk083.responsive.touch006 .popup_menu_custom .custom_category_menu ul.inner_main_nav .nav_btn {
	border-color: #A69D804D;
}

/* 7番 */
.ocnk083.responsive.touch007 .popup_menu_custom .custom_category_menu .inner_main_nav .nav_btn {
    background-color: #FFF;
    color: #000;
}

/* 9番 */
.ocnk083.responsive.touch009 .popup_menu_custom .custom_category_menu .inner_main_nav .nav_btn {
    background-color: #FFF;
    color: #000;
}

/* 10番 */
.ocnk083.responsive.touch010 .popup_menu_custom .custom_category_menu .inner_main_nav .nav_btn {
    background-color: #FFF;
    color: #000;
}

/* 17番 */
.ocnk083.responsive.touch017 .popup_menu_custom .custom_category_menu .inner_main_nav .nav_btn {
    color: #000;
}
/* 17番、18番 */
.ocnk083.responsive:is(.touch017,.touch018) .popup_menu_custom .custom_category_menu .custom_category_title {
	border-color: #000000;
}
.ocnk083.responsive:is(.touch017,.touch018) .popup_menu_custom .custom_category_menu ul.inner_main_nav .nav_btn {
	border-color: #3333334D;
}

/* 25番 */
.ocnk083.responsive.touch025 .popup_menu_custom .custom_category_menu .custom_category_title {
	border-color: #59493F;
}
.ocnk083.responsive.touch025 .popup_menu_custom .custom_category_menu ul.inner_main_nav .nav_btn {
	border-color: #59493F4D;
}


/* スマホ開閉時
 # ================================================================= */

/* 画像ありタイトル */
.ocnk083.responsive .popup_menu_custom .custom_category_menu .custom_toggle_box .custom_category_title.has_categoryimage .nav_btn {
	padding: 5px 0px;
}

/* 画像なしタイトル */
.ocnk083.responsive .popup_menu_custom .custom_category_menu .custom_toggle_box .custom_category_title:not(.has_categoryimage) .nav_btn {
	padding: 15px 5px;
}

/* スマホ開閉時：閉じているときは余白リセット */
.ocnk083.responsive .popup_menu_custom .custom_category_menu .custom_toggle_box.toggle_closed .custom_toggle_area {
	padding: 0;
}

.ocnk083.responsive .popup_menu_custom .custom_category_menu .custom_toggle_box.toggle_closed .inner_title_text {
	padding-right: 25px;
}

@media only screen and (min-width: 840px) {
	.ocnk083.responsive .popup_menu_custom .sp_toggle .custom_category_menu .custom_toggle_box .custom_category_title:not(.has_categoryimage) .nav_btn {
		padding: 5px 0;
	}
}

/* =================================================================
   レスポンシブ840px以上
   ================================================================= */

/* タイトルのリンク無効/アイコン非表示 */
@media only screen and (min-width: 840px) {
	.ocnk083.responsive .popup_menu_custom .sp_toggle .custom_category_menu .custom_toggle_box.toggle_closed .custom_toggle_area {
		padding: 10px 0;
	}
	.ocnk083.responsive .popup_menu_custom .sp_toggle .custom_category_menu .custom_toggle_box .custom_category_title .nav_btn {
		pointer-events: none;
	}
	.ocnk083.responsive .popup_menu_custom .sp_toggle .custom_category_menu .custom_toggle_box .custom_category_title .nav_btn .right_side_nav_icon {
		display: none;
	}
	
	/* 840px以上では開閉を強制表示 */
	.ocnk083.responsive .popup_menu_custom .sp_toggle .custom_category_menu .custom_toggle_box.toggle_closed .custom_toggle_area {
		display: block!important;
		height: auto!important;
		overflow: visible!important;
		pointer-events: all!important;
	}
}






.ocnk083.responsive .inner_custom_category_menu {
	display: grid;
  grid-row: span 2;
  grid-template-rows: subgrid;
}

.ocnk083.responsive .inner_custom_category_menu .custom_category_title {
	display: flex;
	align-items: center;
}