 @charset "utf-8";

/* 全体設定 */
body{ font-family: Lato, "Noto Sans JP", "游ゴシック Medium", YuGothic, YuGothicM, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
    font-size: 15px;
    line-height: 150%;
    -webkit-font-smoothing: antialiased;}
ol, ul { list-style: none; }

/* PC共通基本デザイン */
a {text-decoration: none; color:#000000; cursor:pointer; }
a:active { text-decoration:none; color: #dcdcdc;}
a:hover { opacity: 0.8; filter: brightness(110%); text-decoration: none; color: #000;}
a:focus { overflow: hidden;}
a:visited {text-decoration: none; color: #000000;}
img { -webkit-backface-visibility: hidden; }
img :hover { filter: opacity(75%);}
input[type="text"]{ background-color: #ffffff;}
input[type="button"] { outline: none;}

/* PC下空間パーツ */
.bodyspace_box { width: 1000px; height: 250px; margin: 0 auto;}

/* ヘッダーを固定する */
.fs-l-page { position: sticky; top: 0; z-index: 1499;}

/* 翻訳タブデザイン修正 */
.stt-lang-select.bl {width: 180px;}
.stt-lang-select .stt-select .stt-item { font-size: 13px;}

/* ジグザグ用バナー位置修正 */
#zigzag-worldshopping-checkout .src-components-banner-___Banner__banner___ypkM3 .src-components-banner-___Banner__layout-bottom___3c78i { bottom: 100px !important;}

/* 文字色変え */
.yoyaku_link { color: #0066CC; text-decoration: underline;}
.fs-c-variationCart__variationName__stock { font-size: 12px; color: red;}

/* ヘッダー */
.header_back{width:100%; height:60px; background-color: #000000; min-width: 1000px;}
.header_content{width:1000px; height:60px; background-color: #000000; color:#ffffff; font-size: 14px; margin: 0px auto; white-space:nowrap; min-width: 1000px;}
.header_content{ display: flex; justify-content:space-between; flex-wrap: wrap; align-items: center;}
.header_content a { color: #fff;}

/* ヘッダー内要素 */
.top_logo{width:60px; vertical-align: middle; text-align:center; margin-top:5px; margin-left:30px; margin-right:170px;}
.top_logo_img{width:55px; padding-bottom: 4px;}
.top_new_member{height:22px; margin-right: 15px;}
.top_mail_member{height:22px; margin-right: 15px;}
.top_login{height:22px; margin-right: 15px;}
.top_mypage{height:22px; margin-right: 15px;}
.top_coupon{height:22px; margin-right:100px;}
.top_favorite{flex-basis:35px; height:60px;}
.top_fab_icon{flex-basis:28px; margin-top:16px;}
.top_cart{flex-basis:40px; height:60px; position: relative;}
.top_cart_icon{width:28px; margin-top:17px;}
span.fs-client-cart-count { width: 20px; height: 20px; background-color: red; font-size: 12px; border-radius: 50%; text-align: center; display: block; line-height: 20px; position: absolute; top: 5px; right: -5px;}
button.btn.btn-link { height: 53px;}
.top_menu{ height:60px; vertical-align: middle; margin-left:-5px;}
.top_menu_icon{width:28px; margin-top:10px; overflow: hidden;}
.text1 { position: relative;}

/* トップヘッダーのドロップダウン*/
.dropdown-menu.dropdown-menu-right{ font-size: 15px;}
.dropdown:hover .dropdown-menu { display: block;}
  .h6{ width:160px; height:25px; font-size:13px; padding: 3px; border:none; color: #000000; text-align: left; margin: 0 auto; border-top-left-radius: 10px; border-top-right-radius: 10px;}
  .nav { border:none; color: #000000; font-size:0.8em; text-align: center; margin: 0 auto; margin-top: 10px; margin-left: 5px;}
  .nav li{ width:160px; border:none; text-align: left; margin: 0 auto; padding: 3px 0 3px;}
  .nav li a{ border:none; color: #000000;} 
  .nav li a:hover {color:#666666;}
.dropdown-menu {
    position: absolute; /* ここを基準とする */
    top: 60px;          /* ヘッダーの高さに合わせるとズレない */
    width: 990px;
    padding: 30px 20px 20px 35px;
    background: #ffffff;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    filter: drop-shadow(5px 5px 5px rgba(0,0,0,0.6));
    /* margin は絶対に使わない → ズレの原因 */
     margin: 0; }

/* ヘッダーナビのグリッドレイアウト */
  .flex-column{
    height: auto;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 10px 1fr 10px 1fr 10px 1fr 10px 1fr;
    grid-template-columns: repeat(5, 1fr);
    -ms-grid-rows: 600px 10px 600px 10px 600px 10px 600px 10px 600px;
    grid-template-rows: auto;
    grid-gap: 10px;
    grid-auto-flow: row;
  }  .flex-column > *:nth-child(1){
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }  .flex-column > *:nth-child(2){
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }  .flex-column > *:nth-child(3){
    -ms-grid-row: 1;
    -ms-grid-column: 5;
  }  .flex-column > *:nth-child(4){
    -ms-grid-row: 1;
    -ms-grid-column: 7;
  }  .flex-column > *:nth-child(5){
    -ms-grid-row: 1;
    -ms-grid-column: 9;
  }  .flex-column > *:nth-child(6){
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }  .flex-column > *:nth-child(7){
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }  .flex-column > *:nth-child(8){
    -ms-grid-row: 3;
    -ms-grid-column: 5;
  }  .flex-column > *:nth-child(9){
    -ms-grid-row: 3;
    -ms-grid-column: 7;
  }  .flex-column > *:nth-child(10){
    -ms-grid-row: 3;
    -ms-grid-column: 9;
  }  .flex-column > *:nth-child(11){
    -ms-grid-row: 5;
    -ms-grid-column: 1;
  }  .flex-column > *:nth-child(12){
    -ms-grid-row: 5;
    -ms-grid-column: 3;
  }  .flex-column > *:nth-child(13){
    -ms-grid-row: 5;
    -ms-grid-column: 5;
  }  .flex-column > *:nth-child(14){
    -ms-grid-row: 5;
    -ms-grid-column: 7;
  }  .flex-column > *:nth-child(15){
    -ms-grid-row: 5;
    -ms-grid-column: 9;
  }  .flex-column > *:nth-child(16){
    -ms-grid-row: 7;
    -ms-grid-column: 1;
  }  .flex-column > *:nth-child(17){
    -ms-grid-row: 7;
    -ms-grid-column: 3;
  }  .flex-column > *:nth-child(18){
    -ms-grid-row: 7;
    -ms-grid-column: 5;
  }  .flex-column > *:nth-child(19){
    -ms-grid-row: 7;
    -ms-grid-column: 7;
  }  .flex-column > *:nth-child(20){
    -ms-grid-row: 7;
    -ms-grid-column: 9;
  }  .flex-column > *:nth-child(21){
    -ms-grid-row: 9;
    -ms-grid-column: 1;
  }  .flex-column > *:nth-child(22){
    -ms-grid-row: 9;
    -ms-grid-column: 3;
  }  .flex-column > *:nth-child(23){
    -ms-grid-row: 9;
    -ms-grid-column: 5;
  }  .flex-column > *:nth-child(24){
    -ms-grid-row: 9;
    -ms-grid-column: 7;
  }  .flex-column > *:nth-child(25){
    -ms-grid-row: 9;
    -ms-grid-column: 9;
  }

  .cateborder {
    border-left: 1px solid #cccccc;
  }

/* sub_headサブヘッダー内要素 */
.sub_head_back{ width:100%; min-width: 1000px; background-color: #f0f0f0;}
.sub_head{ width:1000px; min-width: 1000px; height:46px; background-color: #f0f0f0; color:#000000; margin: 0px auto; list-style:none; font-size:14px; font-weight: bolder; white-space:nowrap;}
.sub_head{ display: flex; justify-content: space-between; align-items: center;  justify-content: center; min-width: 1000px; padding-top: 4px; padding-left: 0%;}
.sub_head_menu{ width: 120px; vertical-align: middle; margin-bottom: 5px; margin-right: 10px; padding: 2px; box-sizing: border-box;/* 崩れ防止 */}
.sub_head_menu2{ width: 90px; vertical-align: middle; margin-bottom: 5px; margin-right: 30px; padding: 2px; box-sizing: border-box;/* 崩れ防止 */}
.sub_head_menu3{ width:auto; vertical-align: middle; margin-bottom: 5px; margin-right: 30px; padding: 2px; box-sizing: border-box;/* 崩れ防止 */}
.sub_head_menu4{ width: 80px; vertical-align: middle; margin-bottom: 5px; padding: 2px; box-sizing: border-box;/* 崩れ防止 */}

/* 検索フォームデザイン */
.sub_head_menu_search{width:450px; vertical-align: middle; margin-bottom: 4px; margin-left: 1px; padding:2px 0 2px 0; box-sizing: border-box;/* 崩れ防止 */}
/*フォーム全体*/
#form1{
  position:relative;
  width:300px;/*フォームのサイズ*/
  height:46px;
  margin-top:15px; 
  }
  /*検索ボックス*/
  #sbox{
    border:none;
    background:none;
    -webkit-appearance:none;
  position:absolute;
  top: 0px;
  left: 0px;
  outline:0;/*クリック時の青い枠線消す*/	
  width:300px;/*検索フォームの横幅*/ 
  height:30px;/*検索ボックスの高さ*/	
  padding:0 10px;
  border-radius:2px 0 0 2px;/*検索ボックスの角を丸める*/		
  background:#ffffff;/*検索ボックスの背景カラー*/
  font-weight: normal;
  }
  /*検索ボタン*/
  #sbtn{ position:absolute; left: 305px; width:50px; height:30px;  text-align: center; }
  /*検索ボタンマウスオーバー時*/
  #sbtn:hover{ color:#cccccc;/*検索ボタンマウスオーバー時のフォントカラー*/  }

/* クーポンとセールバナーデザイン */
.sub_head_menu_sale{width:178px; vertical-align: middle; margin-bottom: 2px; margin-right: 0px; margin-left: 15px; padding: 2px; box-sizing: border-box;/* 崩れ防止 */
color: rgb(195, 4, 1);  font-size: 22px; letter-spacing: 3px;}
.sub_head_menu_space{width:172px; vertical-align: middle; margin-bottom: 2px; padding: 2px;}

/* クーポン画像URL変更はここ */
.coupon{
    background-image: url(https://cambio.itembox.design/item/topimg/coupon_2000.jpg);
	width: 100%; height: 35px; margin: 0 auto;background-repeat: repeat-x; min-width: 1000px;}

.coupon a { display: block; width: 100%; height: 100%; min-width: 1000px;}

/* セール画像URL変更はここ */
.sale_head{ width:100%; height:37px; margin: 0 auto; background-image : url("https://cambio.itembox.design/item/topimg/header_sale.jpg"); background-repeat: repeat-x; min-width: 1000px;}
.sale_head a { display: block; width: 100%; height: 100%; min-width: 1000px;}

/* フッターコンテンツ部分 */
.footer_content{width: 100%; height:80px; background-color: #000000; color: #ffffff; margin: 0 auto; z-index:100; min-width: 1000px;}
.footer_contentbox{width: 1000px; height:80px; background-color: #000000; color: #ffffff; margin: 0 auto;}
.footer_content a {color:#ffffff;}
.footer_content a :hover { opacity: 0.6; filter: brightness(110%); }

.privacypolicy{ display: inline-block; margin-left:50px; padding-top: 10px; }
.businessdeal{ display: inline-block; padding-top: 10px; }
.corporatesite{ display: inline-block; padding-top: 10px; }
.copyright{ margin: 20px auto 5px 50px; text-align: left;}
.footer_border{ display: inline-block; height:13px; border-right:solid 1px #ffffff; padding-top: 10px;}
.page_top{ display: inline-block; width:130px; height:35px; background-color: #ffffff; color:#000000; border-bottom-left-radius:5px; border-bottom-right-radius:5px;
    padding: 7px 5px; text-align:center; position: absolute; right:30px; margin-top:-2px;}
.page_top a {color:#000000;}
.promotag{width: 100%; height:auto; background-color: #000000;}


/* 以下レフトナビ部分中身 */ 
.member_banner {width:200px; height:auto; margin: 0 0 10px 0;}
.line_banner {width:200px; height:auto; margin: 0 0 10px 0;}
.category_1 {width:100%; height:30px; margin: 0; background-color: #000000; color: #ffffff; text-align: center; vertical-align: middle; padding-top:5px;} 
.category_2 {width:100%; height:30px; margin: 0; background-color: #000000; color: #ffffff; text-align: center; vertical-align: middle; padding-top:5px;} 
.category_3 {width:100%; height:30px; margin: 0; background-color: #000000; color: #ffffff; text-align: center; vertical-align: middle; padding-top:5px;}
.category_mail {width:100%; height: auto; margin: 15px 0; padding: 5% 0; background-color: #ffffff; color: #ffffff; font-size:12px; text-align: center; line-height: 1.5; border: solid 1px #000000;}

.mail_support {color: #000000; font-size:12px; text-align: center; padding-top:25px ;}

.mail_icon {
    margin: 0 auto ;
    font-size: 35px;
    position: relative;
    width: 0;
    height: 0;
    border-right: 0.8em solid transparent;
    border-left: 0.8em solid transparent;
    border-top: 0.6em solid #666666;
    border-radius: 0.1em;
  }

.mail_icon:hover { opacity: 0.6; filter: brightness(110%);}

  /* 下 */
.mail_icon::before {
    position: absolute;
    content: "";
    top: -0.5em;
    left: -0.8em;
    width: 0;
    height: 0;
    border-top: 0.6em solid transparent;
    border-bottom: 0.5em solid #666666;
    border-left: 0.8em solid #666666;
    border-right: 0.8em solid #666666;
    border-radius: 0 0 0.1em 0.1em;
  }

#left-side ul,#left-side_body ul { border: solid 1px #000000; padding: 0 0.5em; position: relative; list-style-type: none;}
#left-side li{ padding: 5px 0; line-height: 1.5;}
.category_1_menu li { border-bottom: 1px dashed; list-style-type: none;}
.category_1_menu li:last-of-type { border-bottom: none;}
.category_2_menu li { border-bottom: 1px dashed; list-style-type: none;}
.category_2_menu li:last-of-type { border-bottom: none;}
.category_3_menu li { border-bottom: 1px dashed; list-style-type: none;}
.category_3_menu li:last-of-type { border-bottom: none;}
#left-side_body ul li { padding: 5px 0; line-height: 1.5; list-style-type: none; }
#left-side_body ul li:last-of-type { border-bottom: none; }
.left li:hover { opacity: 0.6; filter: brightness(110%); }
.category_rubi { font-size: 10px;}
.category_sns{width:100%; height: 60px; margin: 5px 0 20px 0; padding: 5% 0; background-color: #ffffff; color: #ffffff; font-size:12px; text-align: center;}
.sns_icon{ display: inline-block; width:30%; margin: 0 auto;}
.icon_size{width:40px;}


/* その他　箇所不明など */
.fs-c-productListItem__lowInStock { display: none;}