/*基本設定*/
body,p,h1,h2,h3,h4,h5,ul,form,button { padding: 0; margin: 0; }
li,ol { list-style: none;}
h4 {font-size:1.125em; line-height: 1.25; margin-bottom: 0.25rem; }
select ,input { border-color: #CCC;     padding-block: 0;    padding-inline: 0;}
main {display:flex; position:relative; min-height: calc( 100vh - 53px );}
aside {
  position:relative; width:248px; background: rgba(204,45,50,1); color:#FFF;
  height: calc( 100vh - 53px ); overflow-y: scroll; scrollbar-width:thin;
  scrollbar-color: transparent #fff;
  transition: width 0.2s;
  font-size:0.92em;
}
article {
  position:relative; width:calc( 100vw - 280px); padding:20px 16px;
  height: calc( 100vh - 93px ); overflow-y: scroll; scrollbar-width:thin;

  color:#546088;
}
a {text-decoration: none; transition: all 0.15s; }
button { border-radius: 8px; border: 1px solid #BBB; padding: 6px 26px; font-size: 16px; background: #FFF; color:#666; cursor: pointer; }
button span { margin-left: 8px;}



/*ヘッダー メニュー周り*/
header { height: 100%; overflow: hidden; background-color:#cc2d32; padding: 4px 0; width:100%; }

.menu_txt { font-size:0.8em;}
.burger_menu_btn { width:50px; text-align: center; cursor: pointer; float: left; color:#FFF; }

.logo_btn { position: absolute; left: 0px; width:248px; text-align: center; padding: 0 4px; }
.logo_btn img { height: 28px; margin-top: 8px; }

.cart_btn {
  float: right; margin-right: 6px; padding: 12px 19px; background: #ffd43b;
  color:#001c40; margin-top: -4px; font-size: 0.92em; font-weight: bold; border-radius: 0 0 7px 7px;
  cursor: pointer;
}
.logout_btn {
  float: right; margin-right: 6px; padding: 12px 19px; margin-top: -4px;
  font-size: 0.92em; border-radius: 0 0 7px 7px; background: rgba(255,255,255,0.3);
  color:#FFF; cursor: pointer;
}
.login_user { position: absolute; left: 248px; color:#FFF; font-weight: bold; line-height:43px; }

/*レフトナビ*/
.aside_btn { height:42px; padding: 0 0 0 16px; line-height:42px;  }
.manu_list .aside_btn { background: rgba(255,255,255,0.15);}
.menu_open_close { background: rgba(255,255,255,0.3); float: right; padding: 0; margin: 0; width:38px; text-align: center; font-size:1.1em; cursor: pointer;}

.manu_list ul li a { display: block; color:#FFF; }
.manu_list ul li a:hover { background:rgba(255,255,255,0.48); }
.manu_list ul li a span { margin-left: 6px; font-weight: bold; font-size: 1.06em;}

.sub_manu_list ul li a {display: block; color:#ffcff5; font-weight:bold; }
.sub_manu_list ul li a:hover { color:#FFFFFF; }
.sub_manu_list ul li a span { margin-left: 6px; font-size: 1.04em;}

.manu_list ul li.sub_list a { padding-left: 28px; background:rgba(255,255,255,0.3); }
.manu_list ul li.sub_list a:hover { padding-left: 28px; background:rgba(255,255,255,0.4); }

nav.cart { margin: 20px 12px; }
nav.cart ul.cart_sum_list {background: #FFF; border-radius: 8px; height: 100%; overflow: hidden; color:#212529; font-size: 0.96em;}
nav.cart ul.cart_sum_list li { padding: 9px 14px; border-bottom: 1px solid #CCC;}
nav.cart ul.cart_sum_list li.summary { border-bottom: none; background: #ffc9cc; color:#C00;  font-weight: bold;}
nav.cart ul.cart_sum_list li.title { background: #EFEFEF; text-align: center; }
nav.cart ul.cart_sum_list .price { float: right;}

.fav_sublist.hide { display: none; line-height: 126px; }


/*検索フォーム*/
.serch_form_area { border-radius: 8px; background:#f4f1e8; padding: 14px; }
.serch_sec_list {height:100%; overflow: hidden; font-weight: bold;}
.serch_sec_list li { float:left; padding: 6px 16px; background: #FFF; border:solid 1px #6c757d; border-right:none; }
.serch_sec_list li:last-of-type { border-right:solid 1px #6c757d; border-top-right-radius: 8px; border-bottom-right-radius: 8px; }
.serch_sec_list li:first-of-type { border-top-left-radius: 8px; border-bottom-left-radius: 8px; }
.serch_sec_list li.selected {background: #6c757d; color:#FFF; }
.serch_sec_list li span { margin-left: 4px;}

.serch_prm_list { height:100%; overflow: hidden; font-weight: bold; margin-top: 16px; font-weight: normal;}
.serch_prm_list li.prm_title {
  float:left; border:solid 1px #CCC; border-right:none; padding:0 16px; width:76px; text-align: center;
  background:#e9ebf2; border-top-left-radius: 8px; border-bottom-left-radius: 8px; font-size:0.92em; line-height:36px;
}
.serch_prm_list li.prm_value {
  float:left; border:solid 1px #CCC;background:#FFF; border-top-right-radius: 8px; border-bottom-right-radius: 8px; height: 36px;
  width:calc( 100% - 113px );
}
.serch_prm_list li.prm_value select {
  width:100%; height:36px; border: none;
  border-top-right-radius: 8px; border-bottom-right-radius: 8px; padding-left: 8px;
}
.serch_prm_list li.prm_value input[type=text] {
  width:calc( 100% - 8px ); height:36px; border: none;
  border-top-right-radius: 8px; border-bottom-right-radius: 8px; padding:0 0 0 8px;
}
.cat_select_area {height: 100%; overflow: hidden;}
.cat_select_area .serch_prm_list { float: left ; margin-right: 20px; width:40%; min-width:460px;}
.cat_select_area .serch_prm_list.categoly_select { width:inherit; min-width: 260px; }

.serch_pm_area { width:80%; min-width:620px;}

.serch_btm_area { margin-top: 16px; text-align: right;}
.serch_submit { border: #cc2d32; background:#cc2d32; color: #FFF; }
.serch_reset:hover { background: #6b757d; color: #FFF; }


/*商品一覧エリア*/
.serch_result_header { margin: 16px 0; }
.result_ng_msg { border: 3px solid #ccc; padding: 16px ; text-align: center; background: #fafafa;}

.serch_result_header select { height: 32px; border-radius: 5px; padding: 0 12px; }
.serch_result_header ul { height: 100%; overflow: hidden; }
.serch_result_header ul li { float: left;  line-height: 32px;}
.serch_result_header ul li:nth-child(n+2)  { float: right; margin-left: 20px; }

.serch_result_body { border-top: 1px solid #CCC; margin-bottom: 60px; }

.serch_result_body > ul {height: 100%; overflow: hidden; padding: 16px; border-bottom: 1px solid #CCC; display: flex;}
.serch_result_body .item_img_li { height: 100px ; width:100px; border:1px solid #CCC; }
.serch_result_body .item_img_li .list_item_img { max-width:100px; max-height: 100px;  }

.serch_result_body .item_code { font-size:1.2em; font-weight: bold;}
.serch_result_body .item_prm_li { padding: 5px 20px; width:calc( 100% - 754px );}
.serch_result_body .item_prm_li .ico_area {margin-top: 5px;}
.serch_result_body .item_prm_li .ico_style_1,
.serch_result_body .item_prm_li .ico_style_2,
.serch_result_body .item_prm_li .ico_style_3 { border-radius: 20px; color:#FFF; padding: 3px 18px; font-weight: bold; font-size: 0.9em; }
.serch_result_body .item_prm_li .ico_style_1 { background:#1E88A8; }
.serch_result_body .item_prm_li .ico_style_2 { background:#0C346E; }
.serch_result_body .item_prm_li .ico_style_3 { background:#1C3840; }
.serch_result_body .ico_futeikan {color:#FFF; background: #000; border-radius: 20px; padding: 2px 12px; font-size: 0.9em; margin-left: 8px; font-weight: bold;}
.serch_result_body .item_prm_li .zaiko { margin-left: 20px; color:#BBB; font-size: 0.9em;}

.serch_result_body .item_fav_li { color:#CCC; width:120px; position: relative; }
.serch_result_body .item_fav_li .selected { color:#cc2d32; }
.serch_result_body .item_fav_li .fav_li { display: block; float: left; width:40px ; text-align: center; position: relative; cursor: pointer; }
.serch_result_body .item_fav_li .fav_li .fav_type { position: absolute; top:3px; left:15px; color:#FFF;}
.serch_result_body .item_fav_li > div { width:100%; position: absolute; left: 0 ; top:64px;}

.serch_result_body .item_fav_li,
.serch_result_body .item_order_num_li,
.serch_result_body .item_price_li { display: flex; align-items: center; justify-content:flex-end; height: 100px; margin-left: 20px; flex-wrap: wrap; }

.serch_result_body ul>li.item_price_li { font-size: 1.2em; font-weight: bold; width:180px;}
.serch_result_body .item_price_li span {font-size:0.8em; margin-left: 5px;}
.serch_result_body .item_price_li span.zeiritsu {font-weight: normal;}

.serch_result_body .fav_priority { display: flex; align-items: center; height: 100px; float: right; margin-left: 20px; }

.serch_result_body .item_order_num_li { width:252px; position: relative; }
.serch_result_body .item_order_num_li > div { position: absolute; left:0; top:70px; }
.serch_result_body .item_order_num_li > ul { line-height: 38px; height: 40px ; overflow: hidden; }
.serch_result_body .item_order_num_li > ul > li { float: left; }
.serch_result_body .item_order_num_li > ul > li .order_cnt {
  height: 35px; border: none; width:60px; text-align: right;
  font-size: 1.1em; padding: 0 8px;
}
.serch_result_body .item_order_num_li > ul > li.cont_btn { width:38px; text-align: center; border: 1px solid #223355; cursor: pointer; }
.serch_result_body .item_order_num_li > ul > li.count {  border-top: 1px solid #223355; border-bottom: 1px solid #223355; position: relative; width:100px;}
.serch_result_body .item_order_num_li > ul > li.count [name=order_cnt] { position: absolute; top:0; height:38px;}
.serch_result_body .item_order_num_li > ul > li.count span { padding: 0 5px; float: right;}
.serch_result_body .item_order_num_li > ul > li.tani_count_up { border: 1px solid #283d5e; border-left: none; width:64px; text-align: center; cursor: pointer; }
.serch_result_body .item_order_num_li > ul > li.tani_count_up { border-top-right-radius: 8px; border-bottom-right-radius: 8px; background:#546088; color:#FFF; }
.serch_result_body .item_order_num_li > ul > li.tani_count_up.disabled { background:#FFF; color:#546088; cursor:default; }
.serch_result_body .item_order_num_li > ul > li.count_down  { border-top-left-radius: 8px; border-bottom-left-radius: 8px;  background: #223355; color:#FFF;}
.serch_result_body .item_order_num_li > ul > li.count_down.disabled { background:#FFF; color:#546088; cursor:default; }
.serch_result_body .item_order_num_li > ul > li.count_up { background: #223355; color:#FFF; }

.serch_result_area .cart_button_area {
    position: fixed; z-index: 100; bottom: 0; background: #dfdfdf;;
    width:calc( 100vw - 288px );
    padding:16px 20px; margin-left: -26px;
    text-align: right;
}
.serch_result_area .cart_button_area .cart_in_btn {
    font-size: 1.1em; font-weight: bold; line-height:40px; border-radius: 40px;
    background: #cc2d32; color:#FFF;
}
.serch_result_body .sort_ctr { display: flex; align-items:center; justify-content:center; }
.serch_result_body .sort_ctr>li {
    border: 1px solid #AAA; border-radius: 5px; height: 36px ; width:36px; line-height: 36px; text-align: center;
    margin-left: 8px; cursor: pointer;
}
.serch_result_body .sort_ctr>li.selected { background: #cc2d32; border:#cc2d32; color:#FFF; }



/* ログイン */
.login { background:#cc2d32; height: 100vh; position: relative; color :#546088; }
.login .login_form img { width:120px; }
.login .login_form {
  width:360px; height:380px; position: absolute; top: 0; bottom: 0; left:0; right:0; margin: auto; background: #FFF;
  border-radius: 8px; padding: 40px 20px; text-align: center;
}
.login .login_form h3 { margin: 20px 0 8px 0;}
.login .login_form input[type=tel],
.login .login_form input[type=password]{ width:calc( 100% - 22px ); font-size: 1.1em; margin-top: 22px; border:none;
  border-bottom:1px solid #CCC;
  padding: 6px 10px;
}
.login .login_form button { border: none; width:100%; color:#000; line-height:38px; font-weight: bold; margin-top: 20px; background: #ccc;  }
.login .login_form button[type=submit] { background: #ffd43b;  }

.login .login_form .login_err { margin-top: 20px; font-weight: bold; color:#C00;}