@charset "UTF-8";

/*250827コンテンツ幅固定*/
div#container {width: 1200px;margin-inline: auto; padding: 0;}



/*ヘッダー用
----------------------------------------------- */

.header02 a { text-decoration: none;}

.header02_info{background: rgba( 51, 51, 51, 0.60 ); height: 40px; width: 100%; color: #fff; text-align: center; line-height: 40px;}
.header02_info a{color: #fff; text-decoration: none;}
.header02_info a:hover{color: #fff; text-decoration: none;}
.header02_infonone{display: none;}
.header02{ top: 0; min-width: 1200px;}
	
.header02_menu { width: 100%; position: fixed; top: 0; z-index: 99; transition: all .6s; min-width: 1200px; margin: 0 auto 14px;}	
.header02 .header02_transform{ position: sticky; top: 0;}
.header02_inner{width: 100%; background:#fff; border-bottom: 2px solid #333;}
.header02_menubox{width: clamp(1260px, 100%, 1500px);padding: 5px 10px; margin: 0 auto; min-height: 60px; box-sizing: border-box;}

@media screen and (min-width:768px) and ( max-width:1200px){
.header02_menubox{width: 880px; margin: 0 auto; min-height: 60px; padding: 5px; box-sizing: border-box;}
}

/*これは色々テストして調整*/
.header02_logo{position: fixed; top: 8px; left: calc((100% - 1200px)/2);z-index:99;}
@media (max-width: 1200px) {.header02_logo{left: 10px;}}

	
.delayed-image{padding-top: 40px; padding-bottom: 0px;}

	
.delayed-image img{width: 100%;}

.delayed-image {
	/* じわっと画像が表示される */
 	animation: fadeIn 3s ease 0s 1 normal;
    -webkit-animation: fadeIn 3s ease 0s 1 normal;
}
 
 
/* じわっと画像が表示される ---------　一度追加していたら不要*/
@keyframes fadeIn { /*上のbody内で呼び出しているアニメーションと名前をそろえる*/
    0% {opacity: 0} /* 始め */
    100% {opacity: 1} /* 終わり */
}
 
/*古いブラウザ用　---------　一度追加していたら不要*/
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}



.header02box_r{ position: relative; float: right; width: 460px; padding-top: 1px; /*overflow: hidden;*/display: flex;justify-content: right;}
.header02_tel{ float: left; width: 154px; line-height: 0; padding: 0 15px; vertical-align: middle;}
.header02_nav{ margin: 0; padding: 0; right: 0px; line-height: 0; /*width: 260px;*/}
.header02_nav ul {display: flex;justify-content: right;justify-items: right;}
.header02_nav li{ float: left; text-align: center; /*border-left: 1px solid #555;*/}
.header02_nav_text{ display: block; font-size: 10px; padding-top: 38px;}


/* .header02_logo_b, .header02_nav {position: absolute;} */

.header02_contact {width: 68px; height: 53px;  background: url(/products/images/common/contact.png) no-repeat 0 0;
    background-size: 46% 41%;
    background-position: center 9px ;line-height: 100%; overflow: hidden;}

.header02_login_w {width: 68px; height: 53px;
    background: url(/products/images/common/login01.png) no-repeat 0 0;
    background-size: 66%;
    background-position: center 4px; line-height: 100%; overflow: hidden;}

.header02_login_r {width: 68px; height: 53px;
    background: url(/products/images/common/login02.png) no-repeat 0 0;
    background-size: 66%;
    background-position: center 4px; line-height: 100%; overflow: hidden;}

/*.header02_store {width: 78px; height: 53px;
    background: url(/products/images/common/store.png) no-repeat 0 0;
    background-size: 41% 51%;
    background-position: center 4px;
    line-height: 100%;
    overflow: hidden;
}*/

.header02_cart {
    line-height: 150%;
}

.header02_cart .header_cartnav{
    background-size: 45%;
    background-position: center 4px;
}

.header02_cart .header_cartnav > a{
    font-size:10px;
    padding-top: 35px;
}

.header02_cart .header_cartnav a.occart:hover{
    opacity: 1.0; 
    background-color: unset;
}

/*カテゴリーから探す用CSS--------------------------------------*/
.category_listtitle { font-size: 18px; padding-bottom: 5px; border-bottom: 3px solid #000; margin-top: 40px; margin-bottom: 10px;}
.block { margin-bottom: 30px; position: relative;}
.category_listallbox { width: 100%; display: flex; flex-wrap: wrap;}
.category_listbox { width: 24%; margin: 0 1% 10px 0; background-color: #f5f5f5;}
.category_listbox a { width: 100%; display: block; text-decoration: none; box-sizing: border-box; color: #666666; padding: 8px;}
.category_areabox { display: flex;}
.category_imgbox { margin-right: 4px;}
.category_text { background-image: url(/user_data/packages/default/img/common/cate_listarrow.jpg); background-repeat: no-repeat; background-position: 7px 10px; padding: 4px 0px 0px 18px; line-height: 1.5; font-size: 12px;;}
.category_listbox img { width: 120px; height: 120px; line-height: 0;}



/*ランキング・商品一覧用
----------------------------------------------- */
/*list_grid切替*/
ul.product_list {position: relative; z-index: 1;}
ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block{float: left; width: 100%; margin: 0 0 3px 0; overflow: hidden; padding: 0; display: table;}
ul.product_list.list > li.ajax_block_product > div#cd-single-item.list_area {padding: 20px 0; border-top: 1px solid #d6d4d4;}
ul.product_list.list > li.ajax_block_product > div#cd-single-item.list_area_first {padding: 0 0 20px 0;}
ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block > div.listphoto{float: left; padding-right: 20px; text-align: center; display: table-cell;}
ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block h3 {color: #26504f; font-size: 14px; font-weight: normal; letter-spacing: 0; line-height: 140%; margin: 0; padding: 0px 20px 0px 0px; width: auto;}
ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block > div.yotpo_start, ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block > div.product_status{float: left; width: calc(100% - 245px);box-sizing: border-box;}
ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block > div.product_status ul.status_icon li {margin: 0 4px 3px 0; float: left; padding: 0; line-height: 0;}
ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block > div.listmiddlebloc{float: left; padding-right: 0; width: calc(100% - 245px); display: table-cell;box-sizing: border-box;}
ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block > div.cart_area {width: 245px; float: none; margin: 0; display: table-cell; vertical-align: top;}

ul.product_list.grid {display: grid;grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr))!important;gap: 10px;}
ul.product_list.grid li {width: auto !important;}

ul.product_list.grid > li.ajax_block_product > div#cd-single-item > div.grid_block{float: left; width: 260px; margin: 0 12px 8px 12px; overflow: hidden;}
ul.product_list.grid > li.grid_col_4{width:25%; float:left; min-height: 1px;}
ul.product_list.grid > li.grid_col_3{width:33.33%; float:left; min-height: 1px;}
ul.product_list.grid > li.grid_col_2{width:50%; float:left; min-height: 1px;}	
ul.product_list.grid > li.ajax_block_product > div#cd-single-item > div.grid_block > div.listphoto {float: none; text-align: center;}	
ul.product_list.grid > li.ajax_block_product > div#cd-single-item > div.grid_block h3 {color: #26504f; font-size: 12px; font-weight: normal; letter-spacing: 0; line-height: 140%; margin: 0 0 7px; padding: 10px 0 5px; border-bottom: dotted 1px #ccc;}
ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block h3 a,
ul.product_list.grid > li.ajax_block_product > div#cd-single-item > div.grid_block h3 a {text-decoration: none; color: #004385;}
ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block h3 a:hover,
ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block h3  a[href]:hover,
ul.product_list.grid > li.ajax_block_product > div#cd-single-item > div.grid_block h3 a:hover,
ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block h3 a[href]:hover	{text-decoration: none; color: #e60000;}
ul.product_list.grid > li.ajax_block_product > div#cd-single-item > div.grid_block ul.status_icon {margin-bottom: 10px; width: 100%;}
ul.product_list.grid > li.ajax_block_product > div#cd-single-item > div.grid_block ul.status_icon li {margin: 0 3px 3px 0; float: left; padding: 0; line-height: 0;}
ul.product_list.grid > li.ajax_block_product > div#cd-single-item > div.grid_block ul.status_icon li:nth-child(even){margin: 0 0px 3px 0;}
ul.product_list.grid > li.ajax_block_product > div#cd-single-item > div.grid_block > div.cart_area {width: 100%; margin: 0; float: right; clear: both;}	
div.list_area {width: 100%; overflow: hidden; clear:both;}
div.list_area_first {width: 100%; overflow: hidden; clear:both;}
div.listmiddlebloc >.breadcrumbs{padding-top: 8px;}
div.listmiddlebloc > .breadcrumbs a{text-decoration:underline; color: #0A4466; padding-right: 8px;}
div.listmiddlebloc > .breadcrumbs a:hover{text-decoration: none; color: #e60000 !important;}

div.listmiddlebloc >.breadcrumbs li{padding-right: 0;}
.pankuzu_top {padding-left: 18px; background: url("/user_data/packages/default/img/common/pankuzu_folder.png") no-repeat left; float: left;}
.list_pagenavi .display, .list_pagenavi .display_m {float: left; margin-top: -4px; margin-bottom:0px; padding-left: 25px; cursor: pointer;}	
.list_pagenavi .display li#grid{opacity: 0.3; background-image:url("/user_data/packages/default/img/n_common/list_change_grid.png"); background-repeat:no-repeat; background-position:0px center; display: block; text-indent: -9999px; width: 24px; height: 24px;}
.list_pagenavi .display li#list{opacity: 0.3; background-image:url("/user_data/packages/default/img/n_common/list_change_view.png"); background-repeat:no-repeat;; display: block; text-indent: -9999px; width: 24px; height: 24px;}
.list_pagenavi .display li#grid.selected, .list_pagenavi .display li#list.selected{opacity: 1; cursor: default;}	
.list_pagenavi .display li, .list_pagenavi .display_m li {float: left; padding-left: 10px; text-align: center;}	
.list_pagenavi .display li a, .list_pagenavi .display_m li a {color: gray; font-size: 11px; line-height: 22px; cursor: pointer; text-decoration:none; top: 20px; left: -15px; position: relative; text-indent: -9999px;}
.list_pagenavi .display li a i, .list_pagenavi .display_m li a i {display: block; font-size: 24px; height: 24px; line-height: 24px; margin-bottom: -3px; color: #e1e0e0;}
.list_pagenavi .display li a:hover i, .list_pagenavi .display_m li a:hover i {color: gray;}
.list_pagenavi .display li.selected a, .list_pagenavi .display_m li.selected a {cursor: default; font-weight: bold; color: #333333;}
.list_pagenavi .display li.selected i, .list_pagenavi .display_m li.selected i {color: #333333;}
.list_pagenavi .display li.display-title, .list_pagenavi .display_m li.display-title {color: #333333; padding: 4px 6px 0 0;}
.relative_product_category_body{width: 100%; padding: 0 10px;}
.relative_product_category_body ul li{width: 33.3%;float: left; background-image: url("/user_data/packages/default/img/hns/sitemap_arrow.gif"); background-position: 1px 0.4em; background-repeat: no-repeat; font-weight: bold; margin: 0 0 10px; padding: 0;}
.relative_product_category_body ul li a{padding: 3px 3px 2px 14px;}

.pricebox{margin-bottom: 5px;}
.pricebox li {
    float: left;
}
.list .listphoto img{width:185px; height: 185px;}
#grid a, #list a[rel~='nofollow']{outline: none !important;}
.product_list_tagline{margin: 5px 0; font-size: 11px;}
ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block > div.cart_area .pricebox{margin-bottom: 10px; line-height: 170%;}
ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block > div.cart_area .pricebox .list_price{font-size: 19px;}
ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block > div.cart_area .pricebox .list_price2{font-size: 16px;} 
.grid .pricebox #selling{display: none;}
.list_pagenavi .display{margin-top: 0px !important;}
.list_pagenavi .display li#grid:hover, .list_pagenavi .display li#list:hover{opacity: 0.5;}
ul.product_list.list > li.ajax_block_product > div#cd-single-item > div.grid_block > div.product_status{margin: 10px 0 5px;}	
.display-title{cursor: text;}
#isotopecontainer .grid a, #isotopecontainer .list a{-webkit-backface-visibility: hidden; backface-visibility: hidden;}	
.grid .listphoto{min-height: 200px;}
.list_pagenavi{font-size: 11px;}

#undercolumn dl.formlist dt {clear: both; display: inline; float: left; font-size: 90%; font-weight: bold; margin: 0 -124px 0 0; padding: 0; width: 124px;}	
#undercolumn dl.formlist dd {margin: 0 0 0 124px; padding: 2px;}	
div.listphoto {float: none; text-align:center;}	
div.grid_block {float: left; width: 210px; margin: 0 12px 15px 12px; overflow: hidden;}
div#whobought_area div.recomendblock {float: left; width: 210px; margin: 0 12px 8px 12px; overflow: hidden; min-height: 400px;}
div.grid_block.col0,  div#whobought_area div.recomendblock.col0 {margin: 0 0 5px 0;}
#three_maincolumn .grid_block {padding: 5px;}	

#two_maincolumn_left .grid_block,  #two_maincolumn_right .grid_block,  #two_maincolumn_left div#whobought_area div.recomendblock,  #two_maincolumn_right div#whobought_area div.recomendblock {padding: 3px;}
#one_maincolumn .grid_block, #one_maincolumn div#whobought_area div.recomendblock {padding: 5px;}
#three_maincolumn div.listrightbloc, #two_maincolumn_left div.listrightbloc, #two_maincolumn_right div.listrightbloc, #one_maincolumn div.listrightbloc {float: none; width: auto;}	
div.listrightbloc h3, div#whobought_area div.recomendblock h3 {color: #26504f; font-size: 12px;  font-weight: normal; letter-spacing: 0; line-height: 140%; margin: 0 0 7px; padding: 10px 0 5px; border-bottom: dotted 1px #ccc;}
div.listrightbloc h3 a, div#whobought_area div.recomendblock h3 a {text-decoration:none; color: #004385;}
div.listrightbloc ul.status_icon li{float: left; padding: 0; margin: 0 4px 3px 0; line-height: 0;}
div.listrightbloc ul.status_icon li:nth-child(even){margin: 0 0px 3px 0;}
.pricebox .price span{font-weight: bold;}
.quantity input.box{width: 154px;}
.cart_area{width: 100%; margin: 0;}
.list_slectbox{width: 100%; margin-bottom: 5px;}	
.cartin_l{width:30px; float:left; line-height: 24px;}
.cartin_r{float:right;}
.list_cart input {margin: 0px auto;}	
.cartattenbox{width: 100%; padding: 8px; border: 1px solid #ccc; color: #eee; background: #ccc; box-sizing: border-box; font-weight: bold; border-radius: 3px; text-align: center;}
div.listrightbloc .pricebox{margin-bottom: 5px;}
.list_price{font-size: 17px; font-weight: bold; color: #e60000; letter-spacing: 0;}
.list_price2{font-size: 14px; font-weight: bold; color: #333; letter-spacing: 0;}
.list_price span{font-size: 13px; font-weight: normal;}
.list_price2 span{font-size: 13px; font-weight: normal;}
.list_leadtime{letter-spacing: 0;}
.de_cart_leadtime_box_ls{font-weight: bold;}
.list_attention{color: #ff6000; line-height: 130%; font-weight: bold; text-align: left;}
.pricebox div.price01 {display: inline-block; _display: inline;}
.oc_normalprice{margin-top: 5px;  margin-bottom:5px; letter-spacing: 0; color: #26504f;}
.oc_normalprice span{text-decoration: line-through;}	
#offbox{color: #fff; padding: 1px 8px; background:#e60000; line-height: 1; text-decoration: none; margin-left: 5px;}		
.mt6{margin-top: 6px;}
	
/*safariのみ*/
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    _::-webkit-full-page-media, _:future, :root .list_itemnumber span{color: #e60000; font-size: 20px; font-weight: bold; padding:0 3px; line-height: 22px;}
	_::-webkit-full-page-media, _:future, :root .sort1, .sort2 {margin-right: 6px;}
	_::-webkit-full-page-media, _:future, :root .list_pagenavi {font-size: 11px;}
}

/*z-index調整*/
div#side_tabbtn01_r, div#side_tabbtn02_r, div#side_tabbtn03_r{z-index: 2!important;}
#pageTop{z-index: 3!important;}	

/*クーポン*/
.yotpo{margin: 2px 0 4px;}
.rank_b_box .coupon_list_info{top: 19px!important; right: 8px!important;}

/*newitem_info*/
.newitem_info {top: 19px !important; right: 84px !important;}

.cartattenbox {width: 100%; padding: 10px; border: 1px solid #ccc; color: #eee; background: #ccc; box-sizing: border-box; font-weight: bold; border-radius: 3px; text-align: center;}
.status_icon img{width:125px; height:30px;}




.category_listtitle{font-size:18px;  font-weight: 600; border-bottom: 3px solid #000; margin-bottom:10px; margin-top:0px; width: 100%;}
.category_listtitle p{ padding:5px 0px; }



/*--関連カテゴリー用CSS
----------------------------------------------- */
#relative_product_category .category_listtitle {width: 100%; margin-bottom: 12px;padding-bottom: 8px;border-bottom: 3px solid #000;}

.relative_product_category_body{ padding: 0 10px; margin-bottom: 50px;}
/*.relative_product_category_body ul li{width: 33.3%; float: none; background-image: url("https://image.office-com.xyz/user_data/packages/default/img/hns/sitemap_arrow.gif"); background-position: 1px 0.4em; background-repeat: no-repeat; font-weight: bold; margin: 0 0 10px; padding: 0;}*/

.relative_product_category_body ul li {width: auto; float: none; background-image: none; border: 1px solid #d8d8d8;border-radius: 7px;padding: 5px 5px 5px 5px; margin: 5px 2px;}
.relative_product_category_body ul li a{padding: 3px 3px 2px 3px; text-decoration: none;}


.relative_product_category_body li{font-size: 12px;  display: inline-block; text-decoration: none;margin: 5px 10px 2px -5px;padding:0 0 0 5px; }



/*--その他のブランドカテゴリー用CSS（直書き）
----------------------------------------------- */

#other_brands_category .category_listtitle  {width: 100%; margin-bottom: 12px;padding-bottom: 8px;border-bottom: 3px solid #000;}

.other_brands_category_body{ padding: 0 10px; margin-bottom: 0px;}
/*.other_brands_category_body ul li{width: 33.3%; float: none; background-image: url("https://image.office-com.xyz/user_data/packages/default/img/hns/sitemap_arrow.gif"); background-position: 1px 0.4em; background-repeat: no-repeat; font-weight: bold; margin: 0 0 10px; padding: 0;}*/

.other_brands_category_body ul li {width: auto; float: none; background-image: none; border: 1px solid #d8d8d8;border-radius: 7px;padding: 5px 5px 5px 5px; margin: 5px 2px;}
.other_brands_category_body ul li a{padding: 3px 3px 2px 3px; text-decoration: none;}


.other_brands_category_body li{font-size: 12px;  display: inline-block; text-decoration: none;margin: 5px 10px 2px -5px;padding:0 0 0 5px; }

/*250815*/
/* 横幅拡張用 */
/* .l2_list_title {
    background-position: center;
    width: 100%;
    min-height: 230px;
    max-height: 300px;
    height: auto !important;
    background-size: cover;
}
.an_link a img {
    display: block;
    margin-inline: auto;
    width: clamp(900px, 100%, 960px);
    height: auto;
}
.img_effect01 img {
    margin-inline: auto;
    width: 100%;
}
.wis_head {
    min-height: 250px;
    background-position: top;
    background-size: cover;
}
.wis_head h2 {
    padding-top: clamp(190px, 32.5px + 12.5vw, 220px)!important;
}
.wis_end img {
    width: 100%;
}
.l2_contents .l2_about .wis_contents:last-of-type {
    display: flow-root;
    overflow: hidden;
} */


/*ページャー
----------------------------------------------- */
#pageTop a {
    display: block;
    padding: 5px;
    width: 155px;
    height: 30px;
    background-color: #333;
    color: #fff;
    text-decoration: none;
    text-align: center;
    line-height: 30px;
    font-size: 13px;}


/*ブランドTOPへ戻るボタン---------------------------------*/

.toplink { bottom: calc(10% - 10px); left: calc(100% - calc(100% - 4% - 110px - 3%));/* width: calc(100% - 4% - 110px - 7%); */ font-size: 16px; padding: 12px 0;}
.btn_nomal { display: block; width: 30%; margin: 40px auto ; padding: 5px 0; background: #fff; text-align: center; color: #000 !important; font-size: 16px; line-height: 1; border-radius: 5px; border: solid 1px;}

.btn_nomal a{text-decoration: none; outline: none;}
.btn_nomal a:link {text-decoration: none; color: #333;}
.toplink a:visited {text-decoration: none; }
.toplink a:hover,  a[href]:hover{/*text-decoration: underline;*/ text-decoration: none; }



/*フッター用
----------------------------------------------- */
#footer02_1 {background:#444; color:#fff; font-size: 11px; line-height: 170%; letter-spacing: 0;}
#footer02_2 {background:#333; color:#fff;}
.footer02box {width: 1200px; margin: 0px auto; padding: 25px 0 30px;}
.footer02_flex {display: flex; list-style: none;}
.footer02_flex_parts {width: 33%; margin-right: 8%; padding: 60px 0 100px; text-align: center;}
.footer02_flex_parts:last-child {margin-right: 0;}
.footer02_flex_parts img {height: 30px;}
.footer02_flex_parts a {color: #fff !important; text-decoration: none;}
.footer02_flex_parts a:hover {color: #bbb !important;}
.footer02_flex_h {width: 174px; margin: 1.4em auto 0.6em; padding: 0 0 0.7em; border-bottom: 1px #888 dashed; font-size: 16px; font-weight: bold; line-height: 1; text-align: center; letter-spacing: 0.05em; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Noto Sans JP", "メイリオ", "Meiryo", sans-serif;}
.footer02_bn {width: 640px; margin: 0px auto 40px;}
.footer02_bn img {width: 100%; margin-bottom: 24px;}

/*商品件数の表示---------------------------------*/
#undercolumn .oc_listbox{display: flex; align-items: center; font-size: 14px; margin-bottom: 6px; margin-top: 50px;}
#undercolumn .list_itemnumber span{color: #333; font-size: 16px;}
/*ページナビゲーション---------------------------------*/
.list_pagenavi{display: flex; flex-direction: row-reverse; width: 100%; justify-content: space-between; align-items: center;}
#page_navi_top{flex: 1;}
#page_navi_top .list_sortbox{float: none; display: flex; justify-content: space-between; align-items: center;}
.list_pager li{border-radius: 3px; height: 24px; box-sizing: border-box;}
.list_pager li a{padding: 3px 8px!important; height: 100%; box-sizing: border-box;}
.list_pager li a:hover{opacity: 0.5}
.pageactive{background: #000; padding: 3px 8px;}
.list_pager li.list_pager_prev a img, .list_pager li.list_pager_next a img{padding: 5px 2px 5px !important;}
.list_sortbox select{height: 24px; border-radius: 3px;}
.list_pagenavi .display, .list_pagenavi .display_m {padding-left: 0;}
.list_pagenavi2 .list_sortbox{display: flex; justify-content: flex-end; align-items: center;}