@charset 'utf-8';
/* メニュー用CSS */

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
タブレット以下メニュー
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

/* 基本処理（ハンバーガーメニュー） */
div.main_nav input { display:none; }

/* ハンバーガーメニュー構築 */
label.hnb { border:1px solid #34951a; border-radius:50%; display:inline-block; position:fixed; z-index:100; top:30px; right:20px; transform:translate(0,-50%); overflow:hidden; height:30px; width:30px; }
label.hnb span { background-color:#34951a; display:inline-block; position:absolute; transition:.3s; left:50%; height:1px; width:15px; }
label.hnb span.line_top { top:25%; transform:translate(-50%,1px); }
label.hnb span.line_center { top:50%; transform:translate(-50%,0); }
label.hnb span.line_bottom { bottom:25%; transform:translate(-50%,0); }

/* ハンバーガー動作 */
#menu_ck:checked ~ .hnb span.line_top { top:50%; transition:.3s; transform:translate(-50%,-50%) rotate(45deg); }
#menu_ck:checked ~ .hnb span.line_center { left:-100px; transition:.3s; }
#menu_ck:checked ~ .hnb span.line_bottom { top:50%; bottom:auto; transition:.3s; transform:translate(-50%,-50%) rotate(-45deg); }

/* メニュー部分 */
div.main_nav nav.main_nav_menu { background-color:#34951a; padding:15px; position:fixed; opacity:0; transition:.3s; top:60px; left:0; visibility:hidden; overflow-y:scroll; z-index:9999; max-height:calc( 100vh - 60px ); height:auto; width:100vw; }
div.main_nav nav.main_nav_menu ul li a, label.menu_open { border-bottom:1px solid #fff79975; color:#fff; display:flex; justify-content:space-between; align-items:center; padding:12.5px 15px; width:100%; }
div.main_nav nav.main_nav_menu ul li:last-child a { border-bottom:none; }

/* メニュー動作 */
#menu_ck:checked ~ nav.main_nav_menu { transition:.3s; opacity:1; visibility:visible; }

/* 収納 */
div.main_nav ul.open_menu { display:none; background-color:#ebf4e8; color:#333; transition:.3s; opacity:0; height:0; visibility:hidden; }
div.main_nav ul.open_menu li a span {  color:#333; }
label.menu_open span.turnicon img { transition:.3s; transform:rotate(0deg); }
div.main_nav nav.main_nav_menu ul li ul.open_menu li a { border-bottom:1px solid #ccc; }
div.main_nav nav.main_nav_menu ul li ul.open_menu li:last-child a { border-bottom:none; }

/* 収納物を展開 */
#navck01:checked ~ ul.open_menu, #navck02:checked ~ ul.open_menu, #navck03:checked ~ ul.open_menu, #navck04:checked ~ ul.open_menu, #navck05:checked ~ ul.open_menu { display:block; transition:.3s; opacity:1; height:auto; visibility:visible; }
#navck01:checked ~ label.menu_open span.turnicon img, #navck02:checked ~ label.menu_open span.turnicon img, #navck03:checked ~ label.menu_open span.turnicon img, #navck04:checked ~ label.menu_open span.turnicon img, #navck05:checked ~ label.menu_open span.turnicon img
{ transition:.3s; transform:rotate(180deg); }

@media screen and (min-width:960px) { /* PC幅（メディアクエリ） */

/* ハンバーガーメニューの処理 */
div.main_nav label.hnb { display:none; }

/* メニュー部分 */
div.main_nav { display:none; }

}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
PC用メニュー
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

/* PC版ナビゲーション */
div.pc_nav { display:none; }

@media screen and (min-width:960px) { /* PC幅（メディアクエリ） */

/* ヘッダー下部 */
div.header_bottom { display:flex; justify-content:space-between; align-items:center; margin:auto; max-width:1200px; width:100%; }

/* ヘッダー下部 */
div.h_logo div.table { height:75px; }
div.h_logo div.table h1 img { width:245px; }

/* PC版ナビゲーション */
div.pc_nav { display:block; padding:0 20px 0 0; }
div.pc_nav ul.pc_mega_nav { display:flex; justify-content:flex-end; align-items:flex-start; }
div.pc_nav ul.pc_mega_nav li { margin:0 0 0 20px; }
div.pc_nav ul.pc_mega_nav li a, div.pc_nav ul.pc_mega_nav li label.pc_mega_label { font-size:16px; box-sizing:border-box; display:table; padding:5px 0 0 0; height:75px; }
div.pc_nav ul.pc_mega_nav li a div.mega_box_link, div.pc_nav ul.pc_mega_nav li label.pc_mega_label div.mega_box_label { display:table-cell; vertical-align:middle; height:100%; }
div.pc_nav ul.pc_mega_nav li label.pc_mega_label div.mega_box_label { border-bottom:5px solid #fff; color:#333; transition:.3s; }
div.pc_nav ul.pc_mega_nav li a:link div.mega_box_link, div.pc_nav ul.pc_mega_nav li a:visited div.mega_box_link { border-bottom:5px solid #fff; color:#333; transition:.3s; }
div.pc_nav ul.pc_mega_nav li a:active div.mega_box_link, div.pc_nav ul.pc_mega_nav li a:hover div.mega_box_link { border-bottom:5px solid #34951a; color:#34951a; transition:.3s; }

/* メガドロップ */
div.mega_drop { background-color:#fff; border-top:1px solid #ccc; display:none; transition:.3s; opacity:0; overflow:hidden; position:fixed; top:115px; left:0; z-index:9999; width:100vw; }
ul.pc_mega_nav input { display:none; }
div.drop_menu { display:table; margin:auto; max-width:1200px; width:100%; }
div.drop_title { background-color:#ebf4e8; display:table-cell; width:250px; vertical-align:middle; }
div.drop_title h2 { font-size:18px; font-weight:600; color:#34951a; text-align:center; height:100%; width:100%; vertical-align:middle; }
div.dorp_content div.table { height:200px; }
div.dorp_content ul { display:flex; justify-content:flex-start; align-items:center; flex-wrap:wrap; padding:20px 25px; }
div.pc_nav ul.pc_mega_nav li div.mega_drop div.dorp_content ul li { font-size:15px; margin:0; height:auto; min-width:25%; }
div.pc_nav ul.pc_mega_nav li div.mega_drop div.dorp_content ul li a { border-bottom:1px solid #ccc; display:flex; justify-content:space-between; align-content:center; padding:7.5px 0 5px 0; margin:0 5px 3px 5px; height:auto; }

/* メガドロップ展開時の背景 */
label.drop_back { background-color:rgba(0,0,0,0.5); display:none; backdrop-filter:blur(5px); overflow:hidden; position:fixed; z-index:9998; top:115px; left:0; height:calc( 100vh - 115px ); width:100vw; }

/* メガドロップ動作設定 */
#pc_menu_ck01:checked ~ label.pc_mega_label div.mega_box_label, #pc_menu_ck02:checked ~ label.pc_mega_label div.mega_box_label, #pc_menu_ck03:checked ~ label.pc_mega_label div.mega_box_label , #pc_menu_ck04:checked ~ label.pc_mega_label div.mega_box_label, #pc_menu_ck05:checked ~ label.pc_mega_label div.mega_box_label { border-bottom:5px solid #34951a; color:#34951a;  transition:.3s; }
#pc_menu_ck01:checked ~ div.mega_drop, #pc_menu_ck02:checked ~ div.mega_drop, #pc_menu_ck03:checked ~ div.mega_drop, #pc_menu_ck04:checked ~ div.mega_drop, #pc_menu_ck05:checked ~ div.mega_drop { display:block; transition:.3s; opacity:1; }
#pc_menu_ck01:checked ~ label.drop_back, #pc_menu_ck02:checked ~ label.drop_back, #pc_menu_ck03:checked ~ label.drop_back, #pc_menu_ck04:checked ~ label.drop_back, #pc_menu_ck05:checked ~ label.drop_back { display:block; }
html:has(#pc_menu_ck01:checked, #pc_menu_ck02:checked, #pc_menu_ck03:checked, #pc_menu_ck04:checked, #pc_menu_ck05:checked) { overflow-y:hidden; }

}