/*---------------------
レイアウト共通クラス
----------------------*/
html {
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}
body {
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  background-color:#FBFBFD;
  width:100%; box-sizing : border-box !important;
  height:100vh;
}

/*---------------------
企業レイアウト
----------------------*/
.company p, div{font-size:14px; color:#455a64 !important;}
/*.company p, div{font-size:14px; color:#455a64 !important;}*/
.company h4{color:#455a64 !important;}
.company label{font-size:14px; margin-top:10px; color:#455a64 !important;}
.comapny p{font-family: apple-system-lf-sp, "M PLUS Rounded 1c", sans-serif;}
body.company{background-color:white !important;}
.badge{vertical-align:top; margin-left:10px; border-radius:4px;}
.btn-lg{padding:8px 12px; width:120px; font-size:14px; border-radius:35px;}
.companyMainBlock{width:100%; margin:0px;  display:inline-block;
padding:0% 0% 50px 0%; margin:0px; overflow:initial;}

/*---------------------
共通クラス
----------------------*/
.row:before, .row:after { width:0px; }
.nomargin{margin:0px !important;}
.nopadding{padding:0px !important;}
.page-link{width:50px !important; border:none !important; }
.page-item {margin:auto !important;}
.page-item.active .page-link{background-color:#9C4A3C !important; border-color:#9C4A3C !important; color:white !important;}
.pagination>li>a, .pagination>li>span{color:#9C4A3C !important;}
.pc-600{width:600px;}
.width100per{width:100% !important;}
.inlineBlock{display:inline-block;}
.pcOnly{display:block;}
.spOnly{display:none !important;}
.width-600{width:600px !important;}
.shadow{box-shadow: 0 0 8px gray;}
.marginTop20{margin-top:20px;}
.toast-message{color:white !important;}
button{
  -moz-appearance: none;
  -webkit-appearance: none;
}
input{font-size:14px;}
textarea{font-size:14px;}
p{font-size:14px;}
.pagination{
  margin:0px;
  text-align:left;
  padding-left:0px;
}
.page-item{
  display: table;
  float:left;
  margin-right:1px;
}
.page-link{
  text-decoration:none;
  text-align:center;
  border:1px solid #9C4A3C;
  display:block;
  color:#9C4A3C;
  padding:8px 10px;
  height:35px;
  width:35px;
  border-radius:2px;
  background-color:white;
  display: table-cell;
}
select{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	padding: 5px 20px;
	/* 2609 ここは元から「#」が抜けていて、ブラウザに無視されている指定です。
	   select はサイト中の全プルダウンに効く要素セレクタなので、
	   有効にすると今まで色のなかったプルダウンが一斉に塗りつぶされます。
	   今回は見た目を変えないため、無効のまま残しています。 */
	border: 1px solid 54BEDB;
	background: 54BEDB;
	color:white;
	background: url(arrow01.png) right 50% no-repeat, -webkit-linear-gradient(top, 54BEDB 0%,54BEDB 100%);
	background: url(arrow01.png) right 50% no-repeat, linear-gradient(to bottom, 54BEDB 0%,54BEDB 100%);
	background-size: 20px, 100%;
}
button{
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}
div{color:#393939;}
textarea{width:100%; border-style:solid; border-width:1px; border-color:#a9a9a9; border-radius:5px;
  text-align:left;}
.blocktitle{font-size:15px; margin:0px 0px 10px 0px; font-weight:normal; float:left; margin-top:10px;}
a:hover{
    text-decoration: none;
    filter:alpha(opacity=80);
        -moz-opacity:0.8;
        -khtml-opacity: 0.8;
        opacity: 0.8;
    transition-duration:1s;}
h2.title{font-size:20px; color:#9C4A3C; width:100%;}
.headTitle{color:#9C4A3C; font-weight:bold; font-size: 16px;}
h4,h2{font-weight:bold;}
.sidebar{width:340px; margin:10px 0px 0px 50px;
  display:inline-block !important; vertical-align:top;}
.disablePaging{color:#6c757d !important;}
.page-item.disabled .page-link {
  color: #6c757d !important;
}
.font24{font-size:24px;}

/* Modal */
*{
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
.modal{
  display: none;
  height: 100vh;
  position: fixed;
  top: 0;
  width: 100%;
}
.modal__bg{
  background: rgba(0,0,0,0.8);
  height: 100vh;
  position: absolute;
  width: 100%;
}
ul {
  list-style: none;
}
.modal__content{
  background: #fff;
  left: 50%;
  padding: 40px;
  position: absolute;
  top: 50%;
  transform: translate(-50%,-50%);
  width: 60%;
}
.modal-dialog{margin-top:35vh;}
/* Modal */
.pointNone{pointer-events: none;}

/* エラーメッセージ */
p.errormsg{margin:0px 0px 10px 0px; color:#fa8072; font-size:12px;}
input.errors{border-color:#fa8072 !important;}
textarea.errors{border-color:#fa8072 !important;}

/* フォーム */
textarea.base{
  width:100%;
  height:100px;
  border-style:solide; border-width:1px; border-color:#808080;
  border-color:#a9a9a9;
  border-radius:5px;
}
p.confirm{
  margin:0px 0px 10px 0px;
  color:#393939;
}
.nodecoration{text-decoration:none;}
.marginAuto{margin:auto;}
.mainBlock{width:calc(100% - 450px); margin:0px;  display:inline-block;
padding:0% 0% 50px 0%; margin:0px; overflow:initial;}
@media screen and (max-width:769px)
{
  .block_top{padding-top:0px; width:100% !important; margin:auto; padding:0px;}
  .pc-600{width:100% !important;}
  .pcOnly{display:none !important;}
  .spOnly{display:block !important;}
  .width-600{width:100% !important;}
  .sidebar{width:100%; padding:10px 25px; display:inline-block; vertical-align:top;
    margin:0px;}
    .modal__content{
      background: #fff;
      left: 50%;
      padding: 40px;
      position: absolute;
      top: 50%;
      transform: translate(-50%,-50%);
      width: 90%;
    }
}

/*---------------------
個別ブロック
----------------------*/
.block_top{width:100%; padding:50px 0px 0px 5%;}
.company_top{padding:20px 30%;width:100%; }
.footer_cont{
  color:white; float:left;
  width:100px; font-size:14px;
  text-decoration:none;
  margin:12px 10px;
}
p{margin:10px 0px;}
div.auth{width:600px; margin:0px;  float:left; padding:10px 0% 30px 0%; margin:0px; width:40%; margin-left:30%;}
html.top1{width:100%; height:1700px; margin:0px; float:left;}
body.top1{width:100%; height:1700px; margin:0px; float:left;}
div.top1{width:100%; min-height:2060px; margin:0px;  float:left; padding:0% 0% 0px 0%; margin:0px; }
div.top2{width:100%; height:540px; background-color:#9C4A3C; text-align:center;}
div.top21{padding-top:90px; color:white;}
p.top211{font-size:30px; margin-bottom:10px;}
p.top212{font-size:15px; margin:0px;}
div.top22{margin-top:50px; text-align:center;}
.threadList{width:100%; vertical-align:top;}
html{width:100%; min-height:600px; margin:0px; float:left;}
body{width:100%; min-height:600px; margin:0px; float:left;}
div.main{width:100%; min-height:650px; margin:0px;  float:left; padding:0% 0% 0px 0%; margin:0px; }
html.detail{width:100%; min-height:1000px; margin:0px; float:left;}
body.detail{width:100%; min-height:1000px; margin:0px; float:left;}
div.detail{width:100%; min-height:1560px; margin:0px;  float:left; padding:0% 0% 0px 0%; margin:0px; }
div.detail-child{width:50%; min-height:80px;  padding:0px 0px 0px 0%;}
div.block{width:98%; margin-top:0px; min-height:210px; border-radius:5px; background-color:white; padding:5px 1%; padding-bottom:10px;
	display:inline-block;
}
td.label{background-color:#9C4A3C; color:white; border-radius:25px; font-size:11px; text-align:center; margin-right:10px; padding:3px 10px;}
td.label2{background-color:#9C4A3C; color:white; border-radius:25px; font-size:11px; text-align:center; margin-right:10px; padding:5px 10px;}
div.content{width:100%; padding:10px 2%; color:#393939; min-height:100px; border-radius:5px; background-color:white; font-size:15px;}
.content_nocolor{width:96%; padding:10px 2%; color:#393939; min-height:200px; border-radius:5px; font-size:15px;}
p.name{margin:0px; font-size:20px; color:#393939;}
p.comment{margin:0px; font-size:14px; color:#393939;}
p.sub-title{margin-left:10px; margin-bottom:0px; font-weight:bold;}
p.sub-body{border-width:1px; margin:0px 10px 0px 10px; padding:5px 0px 0px 10px;}
div.buttonArea{float:left; width:100%; text-align:center;}
a.button{display:inline-block; background-color:#9C4A3C; color:white; width:180px; padding:5px 10px; text-align:center; border-radius:25px; text-decoration:none; margin:auto; margin-top:20px; font-size:14px;}
input.button{background-color:#9C4A3C; color:white; width:180px; padding:5px 10px; text-align:center; border-radius:25px; text-decoration:none; margin:auto; margin-top:20px; font-size:14px; border-color:#9C4A3C; display:inline-block;}
input.button:hover{color: #222; text-decoration: none; opacity: 0.85;}
.threadImg{width:100%; height:auto;}
/* 2609 商品一覧の画像を角丸に。figure側は overflow:hidden なので
   ホバー時の半透明マスクも同じ形に切り抜かれる */
figure.hover-parent{border-radius:8px;}
.threadImg{border-radius:8px;}
/* 2609 ヘッダーのアイコン左に置く「マイページ」の文言。
   Bootstrapのa:hover/a:focusで下線が出るため、状態を問わず下線を消す */
/* display:inline-block にしているのは、aタグ側で引かれる下線（ブラウザの設定や
   拡張機能で強制される場合を含む）がこの文字を横切れないようにするため。
   2609 「文字の下半分に線がかかる」の原因は下線ではなく、既存の
   「p span」ルール（マーカーペン風の背景 linear-gradient）だった。
   headerTitle は <p> なので、その中の <span> が全部この装飾を受けていた。
   background をここで打ち消す。 */
.mypageLabel{display:inline-block; font-size:14px; font-weight:bold; vertical-align:middle; margin-right:8px; text-decoration:none;
  background:none; background-image:none;}
/* 2609 ヘッダー右上に並べる補助リンク（企業マイページ／企業ログアウトなど） */
.headerLinks{position:absolute; right:70px; top:16px; white-space:nowrap;}
.headerLinks a{display:inline-block; color:#fff; margin-left:24px; text-decoration:none;}
.headerLinks a:hover,
.headerLinks a:focus{color:#fff; text-decoration:none;}
p.headerTitle a,
p.headerTitle a:link,
p.headerTitle a:visited,
p.headerTitle a:hover,
p.headerTitle a:focus,
p.headerTitle a:active{text-decoration:none !important;}
.user_login{padding:0px 30%;}
.regis3 .badge-danger{
  vertical-align: text-bottom;
}

@media screen and (max-width:769px)
{
  .user_login{padding:0px 2%;}
  .mainBlock{width:100%; margin:0px;  display:inline-block;
  padding:0% 0% 50px 0%; margin:0px; overflow:initial;}
  .threadImg{width:100%; height:auto;}
  div.main{min-height:100vh;}
  .block_top{width:100%; padding:30px 2% 0px 2% !important;}
  .company_top{width:100%; padding:30px 4% 0px 4%;}
  div.auth{width:100%; margin:0px;  float:left; padding:10px 2% 30px 2%; margin:0px;}
  div.top2{width:94%; padding:0px 3%; height:540px; background-color:#9C4A3C; text-align:center;}
	div.top3{margin-top:0px; text-align:center; min-height:450px; border-width:1px; border-color:#a9a9a9;  padding-bottom:20px;
  background-color:#C8EFEA; padding-top:20px; float:left;}
  p.top31{font-size:30px; color:#393939; margin:20px 0px 0px 0px; float:left; width:100%; text-align:center;}
  p.top31{font-size:30px; color:#393939; margin:20px 0px 0px 0px;}
  div.top32{width:80%; height:220px; margin:20px 0px 0px 10%; padding:20px 1% 10px 1%; border-radius:10px; float:left; background-color:white;}
  img.top321{width:110px;  height:110px; border-radius:100%;}
  p.top34{font-size:12px; color:#0C3C50; margin:0px;}
  p.top35{font-size:20px; color:#0C3C50; margin:0px 0px 10px 0px;}
  div.detail-child{width:100% !important; min-height:80px;  padding:0px 2% 0px 2%;}
  a.button{display:inline-block; background-color:#9C4A3C; color:white; width:130px; padding:5px 10px; text-align:center; border-radius:25px; text-decoration:none; margin:auto; margin-top:20px; font-size:14px;}
  input.button{width:130px;  background-color:#9C4A3C; color:white; padding:5px 10px; text-align:center; border-radius:25px; text-decoration:none; margin:auto; margin-top:20px; font-size:14px; border-color:#9C4A3C; display:inline-block;}
  .back{background-color:#393939 !important; border-color:#393939 !important; margin-right:20px !important;}
  .threadList{width:100%; vertical-align:top;}
  .sumBlock{
    min-height:80px;
  }
  .data-detail .col-12{padding:0px;}
  .data-detail th{font-size:11px; text-align:center;}
  .data-detail td{font-size:11px; text-align:center;}
}

@media screen and (max-width:300px)
{
  .threadList{width:100%; vertical-align:top;}
  .title{font-size:12px !important;}
}

/* --------------------------------------------
個別ブロックv2
--------------------------------------------*/
.back{background-color:#393939 !important; border-color:#393939 !important; margin-right:20px !important;}
a.button2{background-color:#a9a9a9; color:white; width:120px; padding:5px 10px; text-align:center; border-radius:25px; text-decoration:none; margin:auto;
margin-top:5px; font-size:12px; display:inline-block;}
button.button{background-color:#9C4A3C; color:white; width:180px; padding:5px 10px; text-align:center; border-radius:25px; text-decoration:none; margin:auto; margin-top:20px; font-size:14px; border-color:#9C4A3C; margin:20px 0px 0px 0px; display:inline-block;}
button.button:hover{text-decoration: none; opacity: 0.85;}
button.submit{display:block; background-color:#9C4A3C; color:white; width:180px; padding:5px 10px; text-align:center; border-radius:25px; text-decoration:none; margin:auto;
margin-top:20px; font-size:14px; border-color:#9C4A3C;}
button.submit:hover{text-decoration: none; opacity: 0.85;}
.blocktitle{font-size:15px; margin:0px 0px 10px 0px; font-weight:normal; float:left; margin-top:10px;}
a:hover{text-decoration: none; opacity: 0.85;}
html.top1{width:100%; height:1700px; margin:0px; float:left;}
body.top1{width:100%; height:1700px; margin:0px; float:left;}
div.top1{width:100%; min-height:2060px; margin:0px;  float:left; padding:0% 0% 50px 0%; margin:0px; }
div.top2{width:100%; height:170px; background-color:#9C4A3C; text-align:center;}
br.sp{display:none;}
p.top211{font-size:30px; margin-bottom:10px;}
h1.top211{font-size:25px; margin:0px 0px 10px 0px; }
div.top21{padding-top:30px !important; color:white; text-align:left; padding-left:70px;}
p.top212{font-size:15px; margin:0px;}
div.top22{margin-top:50px; text-align:center;}
div.form{border-style:solid; padding:2%; width:100%; margin-left:0%; min-height:150px; padding-bottom:10px;
background-color:white; border-color:white; border-radius:5px; padding-bottom:20px;}

@media screen and (max-width:769px)
{
  div.top2{width:100%; height:140px; background-color:#9C4A3C; text-align:center; padding:0px 3%;}
	br.sp{display:block;}
  p.top211{font-size:25px; margin-bottom:5px;}
  div.top21{padding-top:15px !important; color:white; text-align:left; padding-left:10px;}
  div.form{border-style:solid; padding:2%; width:100%; margin-left:0%; min-height:250px; padding-bottom:10px;
    background-color:white; border-color:white; border-radius:5px; padding-bottom:20px;}
}

/* --------------------------------------------
個別ブロックv3
--------------------------------------------*/
video {
  width: 100%;
  max-width: 1080px; /* 最大でも1080px以下に */
}

/*---------------------
フォント系
----------------------*/
.font12{font-size:12px;}
.font13{font-size:13px;}
.font14{font-size:14px;}
.font16{font-size:16px;}
.font18{font-size:18px;}
.font20{font-size:20px;}
.bold{font-weight:bold;}
.underline{text-decoration:underline;}
.text-thin{color:#aab8c2 !important;}
.text-blue{color:#2A6496 !important;}  /* 2609 4.4:1 で基準未満だったので少し濃くした（5.1:1） */
.text-black{color:#646464 !important;}
.text-active{color:#9C4A3C !important;}
.baseColor{color:#60727C}
.required{color:red;}
.borderBase{border-color:#9C4A3C;}
.nopadding{padding:0px !important;}
.capcha{width:300px;}
.pc-padding-30{padding:30px 0px 0px 0px;}
.sortLink{width:100%; margin-bottom:20px; display:block;}

/*---------------------
商品登録画面
----------------------*/

p span {
  position: relative;
  background: linear-gradient(transparent 60%, #EFDDD6 60%);
}

/*---------------------
ボタン系
----------------------*/
.baseButton{background-color:#9C4A3C; margin-top:20px; color:white;
  border-color:#9C4A3C; width:150px; padding:8px 20px; border-radius:35px;}
.baseButtonLg{background-color:#9C4A3C; margin-top:20px; color:white;
  border-color:#9C4A3C; width:200px; padding:12px 20px; border-radius:35px;}
.baseButtonOuter{background-color:white; margin-top:20px; color:#9C4A3C;
  border-color:#9C4A3C; width:150px; padding:6px 10px; border-radius:15px;}
.baseButtonInner{background-color:#9C4A3C; margin-top:20px; color:white;
    border-color:#9C4A3C; width:150px; padding:6px 10px; border-radius:15px;}
.btn-outline-info{border-color:#9C4A3C;}
.backButton{background-color:#393939; margin-top:20px; color:white !important;
border-color:#393939; width:150px; padding:12px 20px; border-radius:35px;}
.btn-login{
	width:240px; border-radius:4px;
	padding:12px 12px;
	color: #333;
    background-color: #fff;
    border-color: #ccc;
}
.btn-login-a{
	width:240px; border-radius:4px;
	padding:12px 12px;
	color: #fff;
    background-color: #9C4A3C;
    border-color: #ccc;
}

.btn-login-c{
	width:240px; border-radius:4px;
	padding:12px 12px;
	color: #fff;
    background-color: #9C4A3C;
    border-color: #ccc;
}

/*--------------------------------------------
Fontタイプ
--------------------------------------------*/
.type1{font-size:12px;}
.type2{font-size:20px;}
/* .type3{font-size:26px; color:#9C4A3C;} */
.type3{font-size:26px; color:#9C4A3C;}
.color_fucus{color:#9C4A3C;}

/*---------------------
一覧テーブル
----------------------*/
.opacity{
  transition-duration:1s;
}
a{
  transition-duration:1s;
}
.opacity:hover{
  text-decoration: none;
  filter:alpha(opacity=80);
      -moz-opacity:0.8;
      -khtml-opacity: 0.8;
      opacity: 0.8;
  transition-duration:1s;
}
td.list{
  width:8%;
  text-align:center;
  font-size:12px;
  padding:3px 0px 3px 0px;
  color:#808080;
}
a.list{
  background-color:#E7D5CF;
  text-decoration:none;
  border-radius:2px;
  color:white;
  padding:7px;
  font-size:10px;
  text-align:center;
  width:50%;
  margin-left:25%;
  height:100%;
}
.loginBlock{padding-top:150px;}
.top_image{width:80%; float:right;}
.reportBlock{width:600px;}

@media screen and (max-width:769px)
{
  .reportBlock{width:100%;}
  .top_image{width:100%; float:right;}
  .loginBlock{padding-top:10px; text-align:center !important;}
  .pc-padding-30{padding:0px 0px 0px 0px;}
  a.list{
    background-color:#E7D5CF;
    text-decoration:none;
    border-radius:2px;
    color:white;
    padding:7px;
    font-size:10px;
    text-align:center;
    width:70%;
    margin-left:5%;
    height:100%;
  }
  div.centerBlock{width:100% !important; min-height:650px !important; margin:0px !important;  float:left; padding:2% 2% 0px !important;}
  h2.title{font-size:16px;}
  .threadTitle{color:#1e90ff; font-size:24px !important; font-weight:bold; margin-bottom:0px !important;}
  .fontSp14{font-size:14px;}

}

/*---------------------
アクティブスタイル
----------------------*/
.active{
   background-color:#9C4A3C !important;
   color:white !important;
}

/*---------------------
個別ブロックv3
----------------------*/
.alert{margin-top:10px;}
/*---------------------
ヘッダー
----------------------*/
.fixMargin{margin-top:60px;}
div.headerBase{width:100%; position:relative;
height:55px; padding:8px 0px 8px 0px; margin:0px; float:left;  width:100% !important; background-color:#C58579;}
p.headerTitle{margin:0px 0px 0px 0px; color:#9C4A3C; font-size:25px; font-weight:bold; width:100%; text-align:left; color:white; padding-left:50px;}
p.headerTitleChild{margin:0px 0px 0px 0px; color:#9C4A3C; font-size:25px; float:left; font-weight:bold; text-align:center; color:white;}
p.footerTitle{margin:0px 0px 0px 0px; color:#9C4A3C; font-size:25px; float:left; font-weight:bold; width:100%; text-align:center; color:white;}
.headerSecond{display:inline-block; width:100%; padding:5px; border-bottom:solid; border-width:1px;border-color:#E7D5CF;}
.copyTitle{padding-left:20px; line-height:29px;}
.headerSearch{border-color:#E7D5CF; width:300px;
  border-style:solid; border-width:1px; padding:3px; padding-left:10px;
  border-radius:5px;}
.headerThird{display:inline-block; width:100%; padding:5px; border-bottom:solid; border-width:1px; border-color:#E7D5CF;}
.headerNewsBlock{display:inline-block; width:100%; padding:0px;}

/*---------------------
フッター
----------------------*/
div.footerBlock{width:100%; padding:10px 10px 0px 10px;  background-color:#C58579; margin:0px; float:left; text-align:center; height:50px;}
.footerChild{text-align:center; padding:0px; height:40px;}

/*---------------------
共通ブロック
----------------------*/
div.centerBlock{width:50%; min-height:1560px; margin:0px;  float:left; padding:2% 0% 0px 0%; margin:0px 25%;}
input.baseText{width:100%; border-style:solid; border-width:1px; border-color:#a9a9a9; border-radius:5px; height:30px; padding:3px; margin-bottom:5px;}
.categorySelect{background-color:white; color:#9C4A3C; border-color:#9C4A3C; border-radius:5px;}
.wordBreak{word-break:break-all;}
.categoryImg{width:90px; border-radius:5px;}
.categoryImgThread{width:70px; border-radius:5px;}
.categoryImgMiddle{width:70px; border-radius:5px;}
.alignTop{vertical-align:top;}
.alignMiddle{vertical-align:middle;}
.commentTop{color:#646464; font-size:17px; font-weight:bold; margin-bottom:0px !important;}
.thumbImg{height:200px; border-radius:5px; margin:10px auto; max-width:100%;}
.ogpImg{width:100px; border-radius:5px; max-height:150px; min-height:60px;}
.mainBlockTitle{font-size:20px; text-align:center; width:100%; color:#9C4A3C;}
.mainBlockTitleSmall{font-size:16px; text-align:center; width:100%; color:#9C4A3C;}
.pagingBlock{width:100%; float:left; margin-top:10px; text-align:left; margin-bottom:20px;}
.pagingBlockDetail{margin-bottom:0px; padding:0px 20% 10px; width:100%; min-height:0px; display:inline-block;}
.topSortBlock{display:inline-block; width:100%; padding:5px; border-bottom:solid; border-width:1px; border-color:#E7D5CF;}
.tableCell{display:table-cell;}
.ogpRight{width:75%; margin-left:10px;}

/*---------------------
エラーページ
----------------------*/
div.errorBlock{width:100%; min-height:2060px; margin:0px;  float:left; padding:0% 0% 0px 0%; margin:0px; }
.errorTitle{width:100%; font-size:20px; color:#646464; font-weight:bold; text-align:center; margin-top:30px;}
div.errorTitleChild{border-style:none; padding:30px; width:100%; margin-left:0%; min-height:200px; padding-bottom:10px; }

/*---------------------
サイドバーブロック
----------------------*/
.tagBlock{border-style:solid; border-width:1px; border-color:#e9eef1; display:inline-block; margin-bottom:20px;padding:5px;}
.categoryBlock{border-style:solid; border-width:1px; border-color:#e9eef1; display:inline-block; margin-bottom:20px; padding:5px;}
.categoryImgSmall{width:50px; border-radius:5px;}
.tagBlockPC{border-style:solid; border-width:1px; border-color:#e9eef1; display:inline-block; margin-bottom:10px; padding:5px;}

/*---------------------
スレッド一覧関連ブロック
----------------------*/
.threadListChild{width:100%; padding:10px; overflow:hidden;}
p.threadTitle{color:#1e90ff; font-size:17px; font-weight:bold; margin-bottom:0px !important;}
.searchBlock{padding-top:0px; margin:auto; padding:0px; display:inline-block; padding-top:30px;}
.modal-open {
  padding-right: 0px !important;
}
body{padding-right: 0px !important;}
.mypageBlock{width: calc(100% - 250px); height:100vh;}

/*---------------------
スレッド詳細関連ブロック
----------------------*/
.badge-danger{background-color:#dc3545 !important;}
.threadDetailBlock{margin-bottom:0px; padding:0px 10px; width:100%; margin-top:20px; min-height:0px; display:inline-block;}
.threadDetailRelate{width:100%; float:left; padding:0px 10px; padding-bottom:10px; text-align:center; margin-top:20px;}
.threadDetailCategory{width:100%; float:left; padding:0px 10px; padding-bottom:10px; text-align:center; margin-top:20px;}
.snsBlock{margin-bottom:0px; padding:0px; min-height:0px; display:table;}

span.setting{display:block; color:#a9a9a9; width:100%; font-size:12px;}
html.regis1{width:100%; min-height:1700px; margin:0px; float:left;}
body.regis1{width:100%; min-height:1700px; margin:0px; float:left;}
div.regis1{width:50%; min-height:1560px; margin:0px;  float:left; padding:2% 0% 0px 0%; margin:0px 25%;}
.regis2{width:100%; font-size:20px; color:#646464; font-weight:bold; text-align:center; margin-top:30px;}
div.regis3{border-style:solid; padding:30px; width:100%; margin-left:0%; min-height:200px; padding-bottom:10px;
background-color:white; border-color:white; border-radius:5px; padding-bottom:20px;}
div.buttonArea{
   width:100%;
   text-align:center;
   padding:2%;
}
div.buttonArea2{
   width:48%;
   margin-left:24%;
   text-align:center;
   padding:2%;
}
a.facebook{
  background-color:#3B5998; border-style:solid; border-width:1px; border-color:#3B5998; padding:5px 0px; font-size:12px; color:white; margin-top:10px; width:100%; border-radius:35px; margin-bottom:10px; display:block; text-align:center; text-decoration:none;
}
a.twitter{
  background-color:#1da1f2; border-style:solid; border-width:1px; border-color:#1da1f2; padding:5px 0px; font-size:12px; color:white; margin-top:10px; width:100%; border-radius:35px; margin-bottom:10px; display:block; text-align:center; text-decoration:none;
}
input.regis41{width:100%; border-style:solid; border-width:1px; border-color:#a9a9a9;
  border-radius:5px; height:30px; padding:3px; margin-bottom:5px;}
input.regis42{background-color:#9C4A3C; border-style:solid; border-width:1px; border-color:#9C4A3C; padding:5px 10px 5px 10px; font-size:12px; color:white; margin-top:10px; width:100%; border-radius:35px; margin-bottom:10px;}
input.regis43{background-color:#0059CF; border-style:solid; border-width:1px; border-color:#0059CF; padding:5px 10px 5px 10px; font-size:12px; color:white; margin-top:10px; width:100%; border-radius:5px;}
input.regis43:hover{color: #222; text-decoration: none; opacity: 0.85;}
input.regis42:hover{color: #222; text-decoration: none; opacity: 0.85;}
.unker_popup{z-index:1000; position:absolute; width:600px; height:200px; top:100;}
.unker_child{margin-bottom:5px; min-height:150px; max-height:200px; overflow-y:scroll;}
.unker_top{color:#646464; font-size:17px; font-weight:bold; margin-bottom:0px !important;}

figure.hover-parent {
  width: 100%;
  height: auto;
  position: relative;
  margin-bottom: 10px;
  overflow: hidden;
}
figcaption.hover-mask {
  width: 100%;
  height: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0,0,0,0.5);
  opacity: 0;
  color: #fff;
  display: flex;
  align-items: center;
  text-align: center;
  padding: 30px;
}
figcaption.hover-mask {
  opacity: 1;
  transition:all 0.6s ease;
  left: -100%;
}
figure.hover-parent:hover .hover-mask {
  left: 0;
}
.pf-footer-social svg {
  fill: #999;
  height: 30px;
  opacity: 1;
  width: 30px;
}
.social li {
  display: inline-block;
  padding-right:10px;
}
.social{margin-top:30px;}
.site-footer, .site-footer a {
  color: #D44A7A;
}
.text-blue{color:blue;}
.footer-text{margin-top:4px;}
.user_order{width:500px; }
.image_detail{max-height:500px; margin:auto; display:block;}
@media screen and (max-width:769px)
{
    .fixMargin{margin-top:60px;}
    .image_detail{width:100%; margin:auto; display:block;}
    .user_order{width:100%; }
    figure.hover-parent {
      width: 100%;
    }
    figcaption.hover-mask {
      width: 100%;
    }
    .cheerButton{position:fixed; width:60%; margin:0px 20%;
      text-align: center; bottom: 30; z-index:100; padding:14px 0px;}
    .threadTitle{font-size:20px !important; font-weight:bold;}
    .mypageBlock{width: 100%; padding:0px 20px;}
    p.headerTitle{padding-left:10px;}
    div.header1{width:70% !important; height:55px; padding:8px 0px 8px 0px; background-color:white; margin:0px; float:left; color:#9C4A3C;}
    div.regis1{width:100%; min-height:1560px; margin:0px;  float:left; padding:5% 2% 0px 2%; margin:0px;}
    div.buttonArea2{
    width:100%;
    margin:0px;
    margin-top:10px;
    text-align:center;
    padding:2%;
    }
    .headerSearch{border-color:#E7D5CF; width:200px;
      border-style:solid; border-width:1px; padding:3px; padding-left:10px;
      border-radius:5px;}
    p.regis2{color:#393939; margin-left:0%; width:100%;}
    div.regis3{border-style:solid; padding:20px; width:100%; margin-left:0%; min-height:190px; padding-bottom:10px;
    background-color:white; border-color:white; border-radius:5px; padding-bottom:20px;}
    a.facebook{background-color:#3B5998; border-style:solid; border-width:1px; border-color:#3B5998; padding:5px 0px; font-size:12px; color:white; margin-top:10px; width:100%; border-radius:35px; margin-bottom:10px; display:block; text-align:center;
    text-decoration:none;}
    a.twitter{background-color:#1da1f2; border-style:solid; border-width:1px; border-color:#1da1f2; padding:5px 0px; font-size:12px; color:white; margin-top:10px; width:100%; border-radius:35px; margin-bottom:10px; display:block; text-align:center;
      text-decoration:none;}
    .pagingBlockDetail{margin-bottom:0px; padding:0px 5% 10px; width:100%; min-height:0px; display:inline-block;}
    .snsBlock{margin-bottom:0px; padding:0px 0%; min-height:0px; display:table;}
    .overflow{overflow:hidden;}
    .capcha{width:250px;}
    p.footerTitle{margin:0px 0px 0px 0px; color:#9C4A3C; font-size:20px; float:left; font-weight:bold; width:100%; text-align:center; color:white;}
    input[type=text] {
      font-size: 16px;
      /* transform: scale(0.8); */
    }
}
.bold{font-weight:bold;}
/* 続きを読む */
.text_1 {line-height: 24px;}
.readmore-btn_1 {
  text-align: right;
  display: none;
}
.text_2 {line-height: 24px;}
.readmore-btn_2 {
  text-align: right;
  display: none;
}
.text_3 {line-height: 24px;}
.readmore-btn_3 {
  text-align: right;
  display: none;
}

.itemLabel {
    max-height: 66px;
    width: 100%;
}
.itemLabelChild{
    padding: 4px 8px;
    border-radius:4px;
    color:white;
    margin: 4px 0px;
}

/* 2609 報酬のバッジ
   報酬額は申込ごとに企業が決めるため、商品に登録された金額は「目安」と明記する。
   中身の長さに合わせて幅を決める。白文字＋明るい緑は読みづらいので文字色を濃くする。 */
.itemLabelBonus{
    display:inline-block;
    width:auto;
    max-width:100%;
    padding:4px 10px;
    color:#fff;
    font-size:12px;
    font-weight:bold;
    line-height:1.4;
    white-space:nowrap;
    background-image:none;
}
/* p span の蛍光ペン装飾が乗ってしまうので打ち消す */
.itemLabelBonusYen{
    margin-left:6px;
    padding-left:6px;
    border-left:1px solid rgba(255,255,255,0.45);
    font-weight:normal;
    background:none;
    background-image:none;
}

/* 2609 商品詳細（インフルエンサー側）の報酬の説明
   p span の蛍光ペン装飾が乗らないよう background を明示して打ち消している。 */
.itemBonusBox{
    max-width:640px;
    margin:16px auto 20px;
    padding:14px 16px;
    border:1px solid #CBE3D6;
    border-radius:10px;
    background-color:#F1F8F4;
    background-image:none;
}
.itemBonusHead{
    margin:0px 0px 8px;
    font-size:15px;
    font-weight:bold;
    color:#2C6B49;
    background:none;
    background-image:none;
}
.itemBonusAmt{
    display:inline-block;
    margin-left:10px;
    padding:2px 10px;
    border-radius:10px;
    background-color:#2C6B49;
    background-image:none;
    color:#fff;
    font-size:12px;
    font-weight:normal;
}
.itemBonusNote{
    margin:0px;
    font-size:13px;
    line-height:1.8;
    color:#41524A;
    background:none;
    background-image:none;
}
.itemBonusLink{
    margin:8px 0px 0px;
    font-size:13px;
    background:none;
    background-image:none;
}
.itemBonusLink a{color:#2C6B49; text-decoration:underline;}

/* タブレット */
@media (max-width: 1020px) and (min-width: 768px) {
  .mainBlock{width:100%; margin:0px;  float:left; padding:0% 20%; margin:0px; overflow:hidden;}
  .cheerButton{position:fixed; width:60%; margin:0px 0%;
    text-align: center; bottom: 30; z-index:100; padding:14px 0px;}

  /* 2609 この幅ではサイドバーが商品一覧の上に積まれる。
     ジャンルリンクが縦一列に並ぶと約450px分の高さを占め、
     商品が画面外まで押し下げられていたため、横並びで折り返す。
     PC幅（1021px以上）の見た目には影響しない。 */
  .sidebar{width:100%; margin:10px 0px 0px 0px; padding:0px 20px 10px;}
  .sidebar .sortLink{width:auto; display:inline-block; margin:0px 10px 10px;}
  .sidebar .sortHead{display:block; width:100%; margin:0px 0px 8px;}
  .sidebar > .text-center > br{display:none;}
  .sidebar .sidebarSub{margin-top:4px;}
}

/*==========================================================
  2609 画面表示・画面遷移の改善（A〜F）
  ここから下は追記部分です。既存の記述には手を入れていません。
==========================================================*/

/*----------------------------------------------------------
  A ログイン状態を色で見分ける
  企業側の画面（company レイアウト）はヘッダー・フッターを濃紺にする。
  インフルエンサー側は従来どおり赤のまま。
  URLを見なくても、いま「どちら側」にいるかが一目で分かるようにする狙い。
----------------------------------------------------------*/
body.companySide div.headerBase{background-color:#8C3B2E;}
body.companySide div.footerBlock{background-color:#8C3B2E;}
/* 企業側であることを示す小さな見出し */
/* こちらも headerTitle（<p>）の中の <span> なので、
   「p span」のマーカー装飾を background の一括指定で打ち消しておく */
.sideBadge{display:inline-block; font-size:12px; font-weight:normal; line-height:1;
  letter-spacing:1px; padding:5px 10px; margin-left:14px; border-radius:12px;
  vertical-align:middle; background:rgba(255,255,255,0.22); background-image:none; color:#fff;}

/*----------------------------------------------------------
  C パンくずリスト
  いまどこにいるか／どこへ戻れるかを常に出しておく。
----------------------------------------------------------*/
.breadcrumbNav{width:100%; text-align:left; padding:0px 0px 14px;}
.breadcrumbList{list-style:none; margin:0px; padding:0px; font-size:12px; line-height:1.8;}
.breadcrumbItem{display:inline; color:#60727C; white-space:nowrap;}
.breadcrumbItem + .breadcrumbItem::before{content:"\003E"; margin:0px 8px; color:#697579;}
.breadcrumbItem a{color:#60727C; text-decoration:underline;}
.breadcrumbItem a:hover{color:#9C4A3C;}
.breadcrumbCurrent{color:#333; font-weight:bold;}

/*----------------------------------------------------------
  E 絞り込み状態の表示
  いまどの条件で一覧を見ているのかを画面に出し、×で解除できるようにする。
----------------------------------------------------------*/
.filterBar{width:100%; text-align:left; padding:0px 0px 16px;}
.filterBarLabel{font-size:12px; color:#60727C; margin-right:8px;}
.filterTag{display:inline-block; font-size:12px; line-height:1; padding:7px 10px;
  margin:0px 8px 8px 0px; border-radius:14px; background-color:#F7EFEC;
  border:1px solid #E7D5CF; color:#9C4A3C; text-decoration:none; white-space:nowrap;}
.filterTag:hover,
.filterTag:focus{background-color:#F0E2DD; color:#9C4A3C; text-decoration:none;}
.filterTag .filterTagX{margin-left:8px; font-weight:bold;}
.filterCount{font-size:12px; color:#60727C;}
/* サイドバーで選択中のジャンルを目立たせる */
a.sortLink.sortLinkActive{font-weight:bold; color:#9C4A3C;}

/*----------------------------------------------------------
  F 未ログイン時トップの商品プレビュー
  中身をぼかして見せ、登録すると全部見られることを伝える。
----------------------------------------------------------*/
.teaserBlock{width:100%; padding:40px 5% 60px; text-align:center;}
.teaserHead{font-size:16px; color:#60727C; font-weight:bold; margin-bottom:6px;}
.teaserSub{font-size:13px; color:#6A767B; margin-bottom:20px;}
.teaserGrid{display:block; font-size:0px; margin:0px auto; max-width:760px;}
.teaserCell{display:inline-block; width:33.3333%; padding:5px; vertical-align:top;}
.teaserCell img{width:100%; height:auto; border-radius:8px; display:block;
  filter:blur(6px); -webkit-filter:blur(6px);
  /* ぼかすと画像の端が薄くなるので、少し拡大して枠いっぱいに見せる */
  transform:scale(1.12); -webkit-transform:scale(1.12);}
.teaserCellInner{position:relative; overflow:hidden; border-radius:8px;
  background-color:#EEE; }
.teaserLockRow{margin-top:18px;}
.teaserLock{display:inline-block; font-size:13px; color:#60727C;}
@media screen and (max-width:769px){
  .teaserBlock{padding:30px 5% 40px;}
  .teaserCell{width:50%;}
}

/*----------------------------------------------------------
  D スマホ用の下部タブバー
  スマホではマイページもログアウトもハンバーガーの中に隠れているため、
  よく使う導線だけ画面下に出しっぱなしにする。PCでは表示しない。
----------------------------------------------------------*/
.tabBar{display:none;}
.tabBarSpacer{display:none;}
@media screen and (max-width:769px){
  .tabBar{display:block; position:fixed; left:0px; right:0px; bottom:0px; z-index:200;
    background-color:#fff; border-top:1px solid #E2E5E7;
    box-shadow:0px -1px 4px rgba(0,0,0,0.08);
    padding:0px; margin:0px; font-size:0px; text-align:center;
    padding-bottom:constant(safe-area-inset-bottom);
    padding-bottom:env(safe-area-inset-bottom);}
  .tabBarItem{display:inline-block; width:33.3333%; padding:7px 2px 6px;
    color:#60727C; text-decoration:none; vertical-align:top;}
  .tabBarItem:hover,
  .tabBarItem:focus{color:#9C4A3C; text-decoration:none;}
  .tabBarItem i{display:block; font-size:18px; line-height:1; margin-bottom:3px;}
  .tabBarItem span{display:block; font-size:10px; line-height:1.2;}
  .tabBarItem.tabBarCurrent{color:#9C4A3C;}
  /* タブバーの下に本文が隠れないよう、同じ高さの余白を置く。
     body には style="padding:0px !important" が直接書かれていて
     CSS側から上書きできないため、空のブロックで場所を確保している。 */
  .tabBarSpacer{display:block; width:100%; height:60px;}
  body.companySide .tabBarItem:hover,
  body.companySide .tabBarItem:focus,
  body.companySide .tabBarItem.tabBarCurrent{color:#8C3B2E;}
}

/*==========================================================
  2609 企業↔インフルエンサー チャット
==========================================================*/

/* 一覧に置く「チャット」ボタンと未読バッジ */
.btn-chat{background-color:#fff; border:1px solid #9C4A3C; color:#9C4A3C;
  white-space:nowrap; font-size:13px; padding:5px 12px; border-radius:16px;}
.btn-chat:hover,
.btn-chat:focus{background-color:#F7EFEC; color:#9C4A3C; text-decoration:none;}
body.companySide .btn-chat{border-color:#8C3B2E; color:#8C3B2E;}
body.companySide .btn-chat:hover,
body.companySide .btn-chat:focus{background-color:#F5EBE8; color:#8C3B2E;}
.chatBadge{display:inline-block; min-width:18px; margin-left:6px; padding:1px 5px;
  background-color:#9C4A3C; color:#fff; font-size:11px; font-weight:bold;
  line-height:16px; border-radius:9px; text-align:center; vertical-align:middle;}
body.companySide .chatBadge{background-color:#8C3B2E;}

/* チャット画面の枠 */
.chatWrap{max-width:720px; margin:0px auto; text-align:left;
  border:1px solid #E2E5E7; border-radius:10px; overflow:hidden; background-color:#fff;}

/* 上部：相手の名前と商品名 */
.chatHead{position:relative; padding:12px 16px 12px 70px;
  border-bottom:1px solid #E2E5E7; background-color:#FAFBFC;}
.chatBack{position:absolute; left:14px; top:50%; margin-top:-10px;
  font-size:12px; color:#60727C; text-decoration:none; white-space:nowrap;}
.chatBack:hover{color:#9C4A3C; text-decoration:none;}
.chatHeadMain{min-height:20px;}
.chatPartner{margin:0px; font-size:15px; font-weight:bold; color:#222; line-height:1.3;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.chatItemName{margin:2px 0px 0px; font-size:11px; color:#6A767B; line-height:1.3;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

/* 本文エリア（ここだけスクロールする） */
.chatBody{height:58vh; min-height:280px; overflow-y:auto; -webkit-overflow-scrolling:touch;
  padding:16px; background-color:#F5F7F8;}
.chatEmpty{text-align:center; color:#6A767B; font-size:13px; padding:40px 0px; margin:0px;}

/* 日付の区切り */
.chatDate{text-align:center; margin:10px 0px 14px;}
.chatDate span{display:inline-block; padding:3px 12px; border-radius:12px;
  background-color:rgba(0,0,0,0.06); color:#60727C; font-size:11px;}

/* 2609 システムからのお知らせ（仮払い・完了報告・検収・振込）
   吹き出しではなく、中央に置いた1枚のカードとして出す。
   p span の蛍光ペン装飾が乗らないよう background を明示して打ち消している。 */
.chatSystem{text-align:center; margin:14px 0px 16px;}
.chatSystemBox{display:inline-block; max-width:86%; text-align:left;
  padding:10px 14px; border-radius:10px; border:1px solid #EDCFC8;
  background-color:#F7F1EE; background-image:none; color:#8C3B2E;}
.chatSystemMark{display:inline-block; margin-bottom:4px; padding:1px 8px; border-radius:9px;
  background-color:#8C3B2E; background-image:none; color:#fff; font-size:10px; font-weight:bold;
  letter-spacing:0.04em;}
.chatSystemText{margin:0px; font-size:13px; line-height:1.7; word-break:break-word; word-wrap:break-word;
  background:none; background-image:none;}
.chatSystemText a{color:#8C3B2E; text-decoration:underline; word-break:break-all;}
.chatSystemTime{display:block; margin-top:4px; font-size:10px; color:#7A6A66;}

/* 吹き出し */
.chatRow{margin-bottom:14px; overflow:hidden;}
.chatBubble{display:inline-block; max-width:76%; padding:9px 13px; border-radius:14px;
  font-size:14px; line-height:1.6; word-break:break-word; word-wrap:break-word; vertical-align:bottom;}
.chatText{margin:0px;}
.chatMeta{font-size:10px; color:#6A767B; line-height:1.4; display:inline-block;
  vertical-align:bottom; padding:0px 4px 2px;}
.chatRead{display:block; color:#9C4A3C; font-weight:bold;}

/* 自分の発言：右寄せ */
.chatMine{text-align:right;}
.chatMine .chatBubble{background-color:#FFE4D6; color:#3A2A22; text-align:left;
  border-bottom-right-radius:4px;}
.chatMine .chatMeta{text-align:right;}
body.companySide .chatMine .chatBubble{background-color:#DCE6F2; color:#1B2A3A;}

/* 相手の発言：左寄せ */
.chatTheirs{text-align:left;}
.chatTheirs .chatBubble{background-color:#fff; color:#222; border:1px solid #E2E5E7;
  border-bottom-left-radius:4px;}

/* 吹き出しの中の画像 */
.chatImgLink{display:block; margin-top:6px;}
.chatBubble .chatImg{display:block; max-width:100%; width:auto; height:auto;
  max-height:260px; border-radius:8px;}
.chatBubble a{color:#1F6FB2; text-decoration:underline; word-break:break-all;}

/* 入力欄 */
.chatForm{border-top:1px solid #E2E5E7; padding:10px 12px 12px; background-color:#fff;}
.chatInputRow{display:block; width:100%; white-space:nowrap; font-size:0px;}
.chatAttach{display:inline-block; width:40px; height:40px; line-height:40px;
  text-align:center; font-size:19px; color:#6A767B; cursor:pointer; margin:0px;
  border-radius:20px; vertical-align:bottom;}
.chatAttach svg{display:inline-block; vertical-align:middle; margin-top:-2px;}
.chatAttach:hover{background-color:#F0F2F3; color:#9C4A3C;}
body.companySide .chatAttach:hover{color:#8C3B2E;}
#chatImage{display:none;}
.chatTextarea{display:inline-block; width:calc(100% - 118px); margin:0px 6px;
  border:1px solid #D6DADC; border-radius:18px; padding:9px 14px;
  font-size:16px; line-height:1.5; resize:none; overflow-y:auto; max-height:120px;
  vertical-align:bottom; background-color:#fff; color:#222;}
.chatTextarea:focus{outline:none; border-color:#9C4A3C;}
body.companySide .chatTextarea:focus{border-color:#8C3B2E;}
.chatSend{display:inline-block; width:60px; height:40px; padding:0px; border:none;
  border-radius:20px; background-color:#9C4A3C; color:#fff; font-size:14px;
  font-weight:bold; cursor:pointer; vertical-align:bottom;}
.chatSend:hover{opacity:0.85;}
.chatSend[disabled]{background-color:#C9CDD0; cursor:default; opacity:1;}
body.companySide .chatSend{background-color:#8C3B2E;}
.chatHint{margin:8px 0px 0px; font-size:11px; color:#6A767B; text-align:center;}

/* 添付のプレビュー */
.chatPreview{display:none; position:relative; margin-bottom:10px; padding:8px 40px 8px 8px;
  border:1px solid #E2E5E7; border-radius:8px; background-color:#FAFBFC;}
.chatPreview img{display:inline-block; max-width:64px; max-height:64px; height:auto;
  border-radius:6px; vertical-align:middle;}
.chatPreviewName{display:inline-block; margin-left:10px; font-size:12px; color:#60727C;
  vertical-align:middle; word-break:break-all;}
.chatPreviewClear{position:absolute; right:8px; top:50%; margin-top:-14px;
  width:28px; height:28px; padding:0px; border:none; border-radius:14px;
  background-color:#E2E5E7; color:#60727C; font-size:16px; line-height:28px; cursor:pointer;}
.chatPreviewClear:hover{background-color:#D0D4D6;}

@media screen and (max-width:769px){
  /* 親の余白が左右非対称なので、負のマージンで広げるとはみ出す。幅いっぱいのまま使う */
  .chatWrap{border-left:none; border-right:none; border-radius:0px; margin:0px; max-width:100%;}
  .chatBody{height:auto; min-height:50vh; max-height:56vh; padding:12px;}
  .chatBubble{max-width:82%;}
  .chatTextarea{width:calc(100% - 112px); font-size:16px;}
  .chatSend{width:56px;}
}

/* 会員登録なしの申込（チャット不可）の表示 */
.chatNa{color:#697579; font-size:13px;}

/* 2609 企業マイページの「商品を登録する」ボタン */
.btn-addItem{background-color:#8C3B2E; border:1px solid #8C3B2E; color:#fff;
  font-size:14px; padding:8px 18px; border-radius:20px; white-space:nowrap;}
.btn-addItem:hover,
.btn-addItem:focus{background-color:#7A2C20; border-color:#7A2C20; color:#fff; text-decoration:none;}

/*==========================================================
  2609 仮払い（エスクロー）
==========================================================*/

/* 状態のバッジ */
.escStatus{display:inline-block; font-size:11px; font-weight:bold; line-height:1;
  padding:4px 9px; border-radius:11px; white-space:nowrap; vertical-align:middle;}
.escWait     {background-color:#FFF3E0; color:#B26A00; border:1px solid #FFD8A8;}
.escPaid     {background-color:#E7F5EC; color:#1B7F3B; border:1px solid #B9E3C6;}
.escReported {background-color:#F7EFEC; color:#9C4A3C; border:1px solid #E7D5CF;}
.escAccepted {background-color:#F5EBE8; color:#8C3B2E; border:1px solid #E2D0CA;}
.escDone     {background-color:#EEEFF0; color:#60727C; border:1px solid #D6DADC;}
.escCancelled{background-color:#F4F4F4; color:#6E757A; border:1px solid #DDD;
  text-decoration:line-through;}

/* 仮払いボタン */
.btn-escrow{background-color:#8C3B2E; border:1px solid #8C3B2E; color:#fff;
  font-size:13px; padding:6px 14px; border-radius:18px; white-space:nowrap;}
.btn-escrow:hover,
.btn-escrow:focus{background-color:#7A2C20; border-color:#7A2C20; color:#fff; text-decoration:none;}
.btn-escrow.btn-sm{font-size:12px; padding:4px 10px;}
.btn-escrow[disabled]{background-color:#C9CDD0; border-color:#C9CDD0; cursor:default;}

/* 仮払い画面 */
.escWrap{max-width:640px; margin:0px auto; text-align:left;
  border:1px solid #E2E5E7; border-radius:10px; background-color:#fff; padding:20px;}
.escHead{border-bottom:1px solid #E2E5E7; padding-bottom:14px; margin-bottom:16px;}
.escBack{font-size:12px; color:#60727C; text-decoration:none;}
.escBack:hover{color:#8C3B2E;}
.escTitle{margin:8px 0px 4px; font-size:19px; font-weight:bold;}
.escSub{margin:0px; font-size:12px; color:#6A767B; line-height:1.6;}
.escNow{font-size:13px; margin:0px 0px 14px;}

/* 進行状況 */
.escSteps{font-size:0px; margin:0px 0px 18px; white-space:nowrap; overflow-x:auto;}
.escStep{display:inline-block; font-size:11px; color:#697579; padding:5px 10px;
  border:1px solid #E2E5E7; border-radius:14px; margin-right:6px; background-color:#fff;}
.escStepDone{color:#8C3B2E; border-color:#8C3B2E; background-color:#F5EBE8; font-weight:bold;}

.escTable{width:100%; border-collapse:collapse; margin:0px 0px 16px; font-size:14px;}
.escTable th,.escTable td{border:1px solid #E2E5E7; padding:9px 12px;}
.escTable th{background-color:#F7F9FB; text-align:left; font-weight:normal; width:52%;}
.escTable td.escNum{text-align:right;}
.escTable tr.escStrong th,.escTable tr.escStrong td{background-color:#F5EBE8; font-weight:bold;}

.escForm{margin-top:6px;}
.escLabel{display:block; font-size:13px; font-weight:bold; margin-bottom:6px;}
.escInputRow{white-space:nowrap; margin-bottom:12px;}
.escInput{display:inline-block; width:180px; font-size:16px; text-align:right;}
.escYen{display:inline-block; margin-left:8px; font-size:14px;}
.escCalc{background-color:#F7F9FB; border:1px solid #E2E5E7; border-radius:8px;
  padding:12px 14px; margin-bottom:14px;}
.escCalc p{margin:0px 0px 4px; font-size:13px;}
.escCalc p:last-child{margin-bottom:0px;}
/* 2609 報酬額が上限を超えたときの注意書き。金額の内訳と入れ替わりで出る */
.escOver{background-color:#F7EFEC; border:1px solid #9C4A3C; border-radius:8px;
  padding:12px 14px; margin-bottom:14px; font-size:13px; color:#7A3427; font-weight:bold;}
.escNote{font-size:12px; color:#60727C; line-height:1.8; margin:10px 0px;}

/* 2609 レビュー（相互評価） ------------------------------------------- */
.doneCount{margin:10px 0px 4px; font-size:14px;}
.doneCountNum{font-size:22px; padding:0px 4px; color:#9C4A3C; font-weight:bold;}
.doneCountNote{font-size:11px; color:#6A767B;}
.revStars{color:#A8762F; letter-spacing:1px; white-space:nowrap;}
.revNone{color:#6A767B;}
.revDone{display:inline-block; font-size:12px; color:#3B211D; background-color:#F0E2DD;
  border-radius:10px; padding:1px 8px; white-space:nowrap;}
.revRateLink{font-size:12px; text-decoration:none;}
.revOpen{color:#3D6B52;}
.revWait{color:#8F6B00;}
.revEdit{font-size:11px;}
.btn-review{background-color:#9C4A3C; border:1px solid #9C4A3C; color:#FFFFFF;
  font-size:12px; padding:3px 10px; white-space:nowrap;}
.btn-review:hover{background-color:#843A2E; border-color:#843A2E; color:#FFFFFF;}
.revWrap{max-width:640px; margin:0px auto; padding:10px 0px 30px;}
.revTitle{margin-bottom:6px;}
.revItem{font-size:13px; color:#4A4A4A; margin-bottom:14px;}
.revLead{font-size:13px; line-height:1.9; text-align:left; margin-bottom:14px;}
.revRule{background-color:#F7EFEC; border:1px solid #E7D5CF; border-radius:8px;
  padding:12px 14px; font-size:12px; line-height:1.9; text-align:left; margin-bottom:18px;}
.revLocked{background-color:#F7F9FB; border:1px solid #E2E5E7; border-radius:8px;
  padding:12px 14px; font-size:13px; text-align:left; margin-bottom:14px;}
.revForm .revLabel{display:block; font-size:13px; font-weight:bold; margin:16px 0px 6px;}
.revStarPick{display:flex; flex-direction:column; gap:4px;}
.revStarOpt{font-size:15px; font-weight:normal; cursor:pointer; margin:0px;}
.revStarOpt input{margin-right:8px;}
.revText{font-size:14px;}
.revSmall{font-size:11px; color:#6A767B; line-height:1.8; margin-top:6px;}
.revSummary{background-color:#F7EFEC; border:1px solid #E7D5CF; border-radius:8px;
  padding:14px; text-align:left; margin-bottom:18px;}
.revSummaryName{font-size:15px; font-weight:bold; margin:0px 0px 6px;}
.revSummarySns{font-size:12px; font-weight:normal; color:#6A767B;}
.revSummaryLine{font-size:14px; margin:0px 0px 4px;}
.revCard{border:1px solid #E2E5E7; border-radius:8px; padding:12px 14px; margin-bottom:10px;}
.revCardHead{font-size:12px; margin:0px 0px 6px;}
.revCardBy{margin-left:8px; color:#4A4A4A;}
.revCardDate{margin-left:8px; color:#6A767B;}
.revBody{font-size:13px; line-height:1.9; margin:0px; white-space:pre-wrap; word-break:break-all;}
.revEmpty{font-size:13px; color:#6A767B; padding:20px 0px;}
.itemRev{margin-top:26px; padding-top:18px; border-top:1px solid #E2E5E7;}
.itemRevHead{font-size:15px; font-weight:bold; margin-bottom:10px;}
.itemRevCard{border:1px solid #E2E5E7; border-radius:8px; padding:10px 12px; margin-bottom:8px;}
.itemRevCardHead{font-size:12px; margin:0px 0px 4px;}
.itemRevBy{margin-left:8px; color:#4A4A4A;}
.itemRevDate{margin-left:8px; color:#6A767B;}
.itemRevBody{font-size:13px; line-height:1.9; margin:0px; white-space:pre-wrap; word-break:break-all;}
.itemRevNote{font-size:11px; color:#6A767B; line-height:1.8; margin-top:8px;}

/* 2609 商品詳細ページの作り直し ----------------------------------------
   載せている項目と文言は変えず、並べ方だけを整えたもの。
   ・スマホは縦1列。下に申し込みバーを出しておく
   ・900px以上は2カラム。左の写真は画面に追従させる            */
.idPage{max-width:980px; margin:0px auto; padding:0px 16px 40px; text-align:left;}
.idTop{display:block;}
.idGallery{margin-bottom:18px;}
.idImgLink{display:block;}
.idImg{width:100%; max-height:420px; object-fit:contain; background-color:#FAF7F6;
  border:1px solid #F0E4E0; border-radius:12px; padding:8px;}
.idSummary{min-width:0px;}
.idGiftId{display:inline-block; font-size:11px; letter-spacing:0.04em; color:#8A5247;
  background-color:#F7EFEC; border:1px solid #E7D5CF; border-radius:999px;
  padding:2px 10px; margin:0px 0px 10px;}
.idName{font-size:20px; line-height:1.6; font-weight:bold; margin:0px 0px 10px; word-break:break-all;}
.idRevLink{margin:0px 0px 14px; font-size:14px;}
.idRevLink a{text-decoration:none;}
.idRevLink a:hover{text-decoration:underline;}
.idCtaWrap{margin:16px 0px 10px;}
.idCta{display:block; width:100%; background-color:#9C4A3C; border:1px solid #9C4A3C;
  color:#FFFFFF; font-size:17px; font-weight:bold; padding:14px 10px; border-radius:8px;
  text-decoration:none;}
.idCta:hover,
.idCta:focus{background-color:#843A2E; border-color:#843A2E; color:#FFFFFF; text-decoration:none;}
.idActions{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:12px 0px 0px;}
.idOfficial{border-radius:30px;}
.idLike{border-radius:30px;}
.idGuest{font-size:13px; line-height:1.9; margin-top:14px; background-color:#F7F9FB;
  border:1px solid #E2E5E7; border-radius:8px; padding:10px 12px;}
.idInfo{margin-top:26px; padding-top:18px; border-top:1px solid #E2E5E7;}
.idInfoRow{margin-bottom:14px;}
.idInfoLabel{font-size:13px; font-weight:bold; margin:0px 0px 4px;}
.idInfoBody{font-size:14px; line-height:1.9; margin:0px; white-space:pre-wrap; word-break:break-all;}
.idFormWrap{margin-top:26px; scroll-margin-top:70px;}
.idForm{width:100% !important; border:1px solid #E2E5E7; border-radius:12px;
  padding:20px 18px; background-color:#FFFFFF;}
.idFormTitle{margin:0px 0px 6px; font-size:18px;}
.idFormLead{font-size:13px; color:#4A4A4A; margin:0px 0px 8px;}
.idFormBody{width:100% !important;}
.idFormBody label{display:block; font-size:13px; font-weight:bold; margin:14px 0px 5px;}
.idFormBody .form-control{font-size:15px;}
.idFormGroup{font-size:13px; font-weight:bold; color:#8A5247; margin:20px 0px 0px;
  padding-bottom:5px; border-bottom:1px solid #E7D5CF;}
.idLimit{background-color:#F7EFEC; border:1px solid #9C4A3C; border-radius:8px;
  padding:12px 14px; font-size:13px; line-height:1.9; color:#7A3427; margin-bottom:6px;}
.idSubmitArea{margin-top:22px;}
.idSubmit{width:100%; background-color:#9C4A3C; border:1px solid #9C4A3C; color:#FFFFFF;
  font-size:17px; font-weight:bold; padding:13px 10px; border-radius:8px;}
.idSubmit:hover,
.idSubmit:focus{background-color:#843A2E; border-color:#843A2E; color:#FFFFFF;}
.idSubmit[disabled]{background-color:#C8BEBB; border-color:#C8BEBB; cursor:not-allowed;}
.idPolicy{font-size:12px; line-height:1.9; margin-top:12px;}
.idFooter{margin-top:80px;}
.idBar{display:none;}
#reviews{scroll-margin-top:70px;}

@media screen and (min-width:900px)
{
  .idTop{display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
    gap:28px; align-items:start;}
  .idGallery{position:sticky; top:70px; margin-bottom:0px;}
  .idImg{max-height:460px;}
  .idName{font-size:22px;}
  .idCta{font-size:18px;}
  .idForm{padding:26px 28px;}
}

@media screen and (max-width:769px)
{
  .idPage{padding:0px 14px 30px;}
  /* 下タブバー（高さ60px）と重ならないように、その上へ浮かせる */
  .idBar{display:flex; position:fixed; left:0px; right:0px; bottom:60px; z-index:150;
    align-items:center; gap:10px; padding:8px 12px; background-color:rgba(255,255,255,0.97);
    border-top:1px solid #E2E5E7; box-shadow:0px -2px 8px rgba(0,0,0,0.06);}
  .idBarName{flex:1 1 auto; min-width:0px; font-size:12px; color:#4A4A4A;
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .idBarBtn{flex:0 0 auto; background-color:#9C4A3C; border:1px solid #9C4A3C;
    color:#FFFFFF; font-size:14px; font-weight:bold; padding:9px 20px; border-radius:8px;
    text-decoration:none;}
  .idBarBtn:hover,
  .idBarBtn:focus{background-color:#843A2E; border-color:#843A2E; color:#FFFFFF; text-decoration:none;}
  /* バーのぶん、いちばん下の余白を足しておく */
  .idFooter{margin-top:40px; padding-bottom:60px;}
}
.escBox{border:1px solid #E2E5E7; border-radius:8px; padding:14px; background-color:#FAFBFC;}
.escBoxTitle{margin:0px 0px 8px; font-size:15px; font-weight:bold;}

/* 商品登録フォームの報酬入力 */
.rewardInputRow{white-space:nowrap; margin-bottom:10px;}
.rewardInput{display:inline-block; width:180px; font-size:16px; text-align:right;}
.rewardYen{display:inline-block; margin-left:8px;}
.rewardCalc{background-color:#F7F9FB; border:1px solid #E2E5E7; border-radius:8px;
  padding:12px 14px;}
.rewardCalc p{margin:0px 0px 4px; font-size:13px;}
.rewardCalc p:last-child{margin-bottom:0px;}
.rewardCalcHead{font-weight:bold; color:#8C3B2E;}

/* 振込先口座の登録 */
.bankWrap{max-width:560px; margin:0px auto; text-align:left;}
.bankTitle{margin:0px 0px 8px; font-size:19px; font-weight:bold;}
.bankLead{font-size:13px; color:#60727C; line-height:1.8; margin-bottom:18px;}
.bankCurrent{border:1px solid #B9E3C6; background-color:#F2FAF5; border-radius:8px;
  padding:12px 14px; margin-bottom:18px; font-size:13px;}
.bankCurrentTitle{margin:0px 0px 6px; font-weight:bold; color:#1B7F3B;}
.bankCurrent p{margin:0px 0px 3px;}
.bankSmall{font-size:12px; color:#6A767B; line-height:1.7; margin:4px 0px 0px;}
.bankForm .bankLabel{display:block; font-size:13px; font-weight:bold; margin:14px 0px 4px;}
.bankAlert{display:inline-block; font-size:11px; font-weight:bold; padding:2px 8px;
  border-radius:10px; background-color:#F7EFEC; color:#9C4A3C; border:1px solid #E7D5CF;
  margin-left:6px; vertical-align:middle;}
.bankOk{display:inline-block; font-size:11px; font-weight:bold; padding:2px 8px;
  border-radius:10px; background-color:#E7F5EC; color:#1B7F3B; border:1px solid #B9E3C6;
  margin-left:6px; vertical-align:middle;}

@media screen and (max-width:769px){
  .escWrap{padding:14px;}
  .escTable th{width:48%;}
  .escInput,.rewardInput{width:140px;}
}

/*=====================================================================
  2609 配色の調整（en.hashgift.org と同じサーモン系にそろえたことに伴うもの）

  帯の色 #C58579 は淡いため、白文字だとコントラストが 2.3:1 しかなく、
  小さい文字は読めない。そこで
    ・大きいロゴ「Hashgift」（25px）だけ白のまま＝参考サイトの見た目を保つ
    ・ナビやコピーライトなどの小さい文字は濃茶 #3B211D（5.9:1）
  としている。企業側の帯 #8C3B2E は濃いので白文字のままでよい。
=====================================================================*/

/* --- 帯の上の小さい文字（インフルエンサー側） --- */
.headerLinks a,
.headerLinks a:link,
.headerLinks a:visited,
.headerLinks a:hover,
.headerLinks a:focus{color:#3B211D;}
.footer-text,
.footer-text a,
.footer-text a:link,
.footer-text a:visited,
.footer-text a:hover,
.footer-text a:focus{color:#3B211D; text-decoration:none;}

/* --- 帯の上の小さい文字（企業側は帯が濃いので白のまま） --- */
body.companySide .headerLinks a,
body.companySide .headerLinks a:link,
body.companySide .headerLinks a:visited,
body.companySide .headerLinks a:hover,
body.companySide .headerLinks a:focus{color:#fff;}
body.companySide .footer-text,
body.companySide .footer-text a,
body.companySide .footer-text a:link,
body.companySide .footer-text a:visited,
body.companySide .footer-text a:hover,
body.companySide .footer-text a:focus{color:#fff;}

/* --- ヘッダー2段目（マイページ帯）。元は inline の orange だった --- */
.headerBaseSecond{background-color:#D6A79C !important;}
.headerBaseSecond .headerTitle a,
.headerBaseSecond .headerTitle a:link,
.headerBaseSecond .headerTitle a:visited,
.headerBaseSecond .headerTitle a:hover,
.headerBaseSecond .headerTitle a:focus{color:#3B211D !important;}
.headerBaseSecond .mypageLabel{color:#3B211D;}
.headerLogout,
.headerLogout:link,
.headerLogout:visited,
.headerLogout:hover,
.headerLogout:focus{color:#3B211D; text-decoration:none;}

/* --- 帯の中の小さなラベル（マイページ／企業向け）は下地を少し濃くして読めるようにする --- */
.mypageLabel{background-color:rgba(255,255,255,0.45); color:#3B211D;}
.sideBadge{background-color:rgba(74,36,32,0.18); color:#fff;}

/* 帯の上の大きいロゴは、参考サイトどおり白のままにしている。
   #C58579 に白は 2.3:1 と数値上は不足するため、ごく薄い影で輪郭を出して
   見えづらさを補っている（企業側は帯が濃いので影は不要）。 */
p.headerTitle a{text-shadow:0px 1px 2px rgba(74,36,32,0.45);}
body.companySide p.headerTitle a{text-shadow:none;}

/*----------------------------------------------------------
  2609 登録情報の確認・変更（インフルエンサー）
  SNS・連絡先・振込先口座を1ページにまとめたもの。
  p span の蛍光ペン装飾が乗らないよう background を明示して打ち消している。
----------------------------------------------------------*/
.profWrap{max-width:560px; margin:0px auto; text-align:left;}
.profTitle{margin:0px 0px 8px; font-size:19px; font-weight:bold;}
.profLead{font-size:13px; color:#697579; line-height:1.8; margin-bottom:22px;
  background:none; background-image:none;}
.profSection{margin:26px 0px 10px; padding:6px 12px; border-radius:6px;
  background-color:#F5EBE8; background-image:none;
  color:#8C3B2E; font-size:14px; font-weight:bold;}
.profForm .profLabel{display:block; font-size:13px; font-weight:bold; margin:14px 0px 4px;}
.profSmall{font-size:12px; color:#6A767B; line-height:1.7; margin:4px 0px 0px;
  background:none; background-image:none;}
.profReadonly{display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:9px 12px; border:1px solid #E2E5E7; border-radius:6px; background-color:#F7F8F9;}
.profReadonlyValue{font-size:14px; word-break:break-all;}
.profChange{white-space:nowrap; font-size:13px; color:#9C4A3C; text-decoration:underline;}
.profBankBlock{margin-top:34px; padding-top:8px; border-top:1px solid #E2E5E7;}
.profBankCurrent{border:1px solid #CBE3D6; background-color:#F1F8F4; border-radius:8px;
  padding:12px 14px; margin-bottom:16px; font-size:13px; line-height:1.8;}
.profBankCurrentTitle{margin:0px 0px 6px; font-weight:bold; color:#2C6B49;
  background:none; background-image:none;}
.profBankCurrent p{margin:0px 0px 3px; background:none; background-image:none;}
.profBankNone{border:1px solid #F0C36D; background-color:#FEF9EC; border-radius:8px;
  padding:12px 14px; margin-bottom:16px; font-size:13px;}

/* 申込フォームの「ご登録の内容を入れてあります」の案内 */
.orderPrefillNote{font-size:12px; line-height:1.8; color:#697579;
  padding:9px 12px; margin:0px 0px 14px; border-radius:6px;
  background-color:#F5EBE8; background-image:none;}
.orderPrefillNote a{color:#9C4A3C; text-decoration:underline;}

@media (max-width: 767px) {
  .profReadonly{flex-direction:column; align-items:flex-start; gap:4px;}
}

/* 2609 退会画面の注意書き（同じユーザーネームでは再登録できない旨） */
.exitWarn{border:1px solid #F0C36D; background-color:#FEF9EC; background-image:none;
  border-radius:8px; padding:12px 14px; font-size:13px; line-height:1.9; color:#5A4520;}
.exitWarn b{color:#8E3223;}

/* ==================================================================
   2609 商品一覧の作り直し
   ・カードの大きさをそろえ、写真→商品名→いいね の順に統一
   ・目印（NEW／報酬あり）は写真の上に重ねる
   ・スマホは2列、タブレット3列、PC4列
   ================================================================== */
.ilPage{max-width:1180px; margin:0px auto; padding:0px 16px 40px; text-align:left;}
.ilHead{font-size:16px; font-weight:bold; margin:26px 0px 12px; padding-left:10px;
  border-left:4px solid #9C4A3C; color:#3B211D;}
.ilHead:first-of-type{margin-top:8px;}
.ilGrid{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px;
  margin:0px 0px 6px;}
/* 2609 Bootstrap の .row::before / ::after は、グリッドの中では「升目を1つ使う
   見えない箱」になってしまい、1枚目のカードの左が空いて見えていた。
   row クラス自体は外したが、他のCSSが同じことをしても崩れないよう消しておく。 */
.ilGrid::before,
.ilGrid::after{content:none !important; display:none !important;}
.ilEmpty{font-size:14px; color:#6E6560; padding:30px 0px;}
.ilPager{margin-top:26px; text-align:center;}
.ilPager .pagination{justify-content:center; display:inline-flex; flex-wrap:wrap;}
.ilFooter{margin-top:80px;}

/* カード本体。グリッドの子なので Bootstrap の col- の幅指定は打ち消す */
.itemCol{width:auto !important; max-width:none !important; flex:none !important;
  padding:0px !important; display:block !important; float:none !important;}
.itemCard{display:block; height:100%; border:1px solid #E4DDD9; border-radius:12px;
  background-color:#FFFFFF; overflow:hidden; text-decoration:none; color:#2E2A28;
  transition:box-shadow 0.15s ease, transform 0.15s ease;}
.itemCard:hover,
.itemCard:focus{text-decoration:none; color:#2E2A28;
  box-shadow:0px 4px 14px rgba(59,33,29,0.12); transform:translateY(-2px);}
.itemCardImgWrap{position:relative; width:100%; padding-top:100%; overflow:hidden;
  background-color:#F4F0EE;}
.itemCardImg{position:absolute; top:0px; left:0px; width:100%; height:100%;
  object-fit:cover; display:block;}
.itemCardTag{position:absolute; top:8px; left:8px; z-index:2; display:inline-block;
  font-size:11px; font-weight:bold; line-height:1; color:#FFFFFF; padding:5px 9px;
  border-radius:4px; letter-spacing:0.02em;}
.itemCardBonus{position:absolute; right:8px; bottom:8px; z-index:2; display:inline-block;
  font-size:11px; font-weight:bold; line-height:1.3; color:#FFFFFF; padding:5px 9px;
  border-radius:4px; text-align:right;}
.itemCardBonusYen{display:block; font-size:10px; font-weight:normal; margin-top:2px;}
.itemCardBody{padding:10px 12px 12px;}
.itemCardGift{font-size:10px; color:#6E6560; margin:0px 0px 3px; letter-spacing:0.02em;}
.itemCardName{font-size:13px; line-height:1.55; font-weight:bold; margin:0px 0px 8px;
  color:#2E2A28; max-height:3.1em; overflow:hidden;}
.itemCardLike{font-size:13px; color:#6E6560; margin:0px;}
.itemCardLike i{color:#9C4A3C; font-size:15px; margin-right:5px;}

@media screen and (min-width:770px)
{
  .ilGrid{grid-template-columns:repeat(3, minmax(0, 1fr)); gap:18px;}
  .itemCardName{font-size:14px;}
}
/* サイドバー（450px）があるぶん、4列にするのは画面が十分広いときだけ */
@media screen and (min-width:1600px)
{
  .ilGrid{grid-template-columns:repeat(4, minmax(0, 1fr));}
}
@media screen and (max-width:769px)
{
  .ilPage{padding:0px 12px 24px;}
  .ilHead{font-size:15px; margin:20px 0px 10px;}
  .ilFooter{margin-top:40px; padding-bottom:20px;}
}

/* ==================================================================
   2609 商品登録ページ（/company）の作り直し
   ・入力欄を内容のまとまりごとにカードへ分ける
   ・ラベルと欄の間隔をそろえ、欄を大きくする
   ・スマホは下に送信ボタンへの導線を出す
   ================================================================== */
.cpPage{max-width:720px; margin:0px auto; padding:20px 16px 40px; text-align:left;}
.cpCard{border:1px solid #E4DDD9; border-radius:12px; background-color:#FFFFFF;
  padding:20px 20px 22px; margin-bottom:16px;}
.cpIntro{background-color:#FAF8F7;}
.cpLead{font-size:14px; line-height:1.9; margin:0px 0px 14px; text-align:center;}
.cpHowTitle{font-size:14px; margin:0px 0px 6px;}
.cpHow{margin:0px 0px 6px; padding-left:22px; font-size:14px; line-height:1.9;}
.cpHow li{margin-bottom:2px;}
.cpExample{margin-top:10px;}
.cpExample summary{cursor:pointer; font-size:14px; font-weight:bold; color:#8C3B2E;}
.cpForm label{display:block; font-size:13px; font-weight:bold; margin:18px 0px 6px;
  line-height:1.7;}
.cpCard > label:first-child,
.cpCard > .form-group > label:first-child{margin-top:0px;}
.cpForm .form-control{font-size:15px;}
.cpForm textarea.form-control{line-height:1.8;}
.cpFile{display:block; font-size:13px; padding:8px 0px;}
.cpHint{color:#337ab7 !important; font-size:12px; margin:0px 0px 6px; line-height:1.8;}
.cpNote{font-size:12px; color:#6E6560; line-height:1.9; margin:10px 0px 0px;}
.cpRadios{display:flex; flex-wrap:wrap; gap:8px 18px; margin:2px 0px 0px;}
.cpRadiosCol{flex-direction:column; gap:6px;}
.cpRadio{display:inline-flex !important; align-items:center; gap:6px;
  font-weight:normal !important; font-size:14px !important; margin:0px !important;
  cursor:pointer;}
.cpRadio input{margin:0px;}
.cpSubmitArea{margin-top:24px; scroll-margin-top:70px;}
.cpSubmit{width:100%; background-color:#9C4A3C; border:1px solid #9C4A3C; color:#FFFFFF;
  font-size:17px; font-weight:bold; padding:14px 10px; border-radius:8px;}
.cpSubmit:hover,
.cpSubmit:focus{background-color:#843A2E; border-color:#843A2E; color:#FFFFFF;}
.cpPolicy{font-size:12px; line-height:1.9; margin-top:14px;}
.cpBar{display:none;}

@media screen and (max-width:769px)
{
  .cpPage{padding:14px 12px 30px;}
  .cpCard{padding:16px 14px 18px; border-radius:10px;}
  /* 下タブバー（高さ60px）と重ならないように、その上へ浮かせる */
  .cpBar{display:flex; position:fixed; left:0px; right:0px; bottom:60px; z-index:150;
    align-items:center; padding:8px 12px; background-color:rgba(255,255,255,0.97);
    border-top:1px solid #E4DDD9; box-shadow:0px -2px 8px rgba(0,0,0,0.06);}
  .cpBarBtn{flex:1 1 auto; background-color:#9C4A3C; border:1px solid #9C4A3C;
    color:#FFFFFF; font-size:15px; font-weight:bold; padding:11px 10px; border-radius:8px;
    text-decoration:none; text-align:center;}
  .cpBarBtn:hover,
  .cpBarBtn:focus{background-color:#843A2E; border-color:#843A2E; color:#FFFFFF; text-decoration:none;}
  .cpPolicy{padding-bottom:70px;}
}

/* ==================================================================
   2609 企業の登録情報（確認・変更）
   ================================================================== */
.cprofWrap{max-width:560px; margin:0px auto; padding:10px 0px 30px;}
.cprofTitle{margin-bottom:6px;}
.cprofLead{font-size:13px; line-height:1.9; text-align:left; margin-bottom:18px;
  background-color:#F7EFEC; border:1px solid #E7D5CF; border-radius:8px; padding:12px 14px;}
.cprofSection{font-size:13px; font-weight:bold; color:#8C3B2E; margin:24px 0px 0px;
  padding-bottom:5px; border-bottom:1px solid #E7D5CF; text-align:left;}
.cprofForm .cprofLabel{display:block; font-size:13px; font-weight:bold; margin:16px 0px 6px;}
.cprofForm .form-control{font-size:15px;}
.cprofReadonly{display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  background-color:#FAF8F7; border:1px solid #E4DDD9; border-radius:6px; padding:9px 12px;}
.cprofReadonlyValue{font-size:14px; word-break:break-all;}
.cprofChange{font-size:12px; white-space:nowrap;}
.cprofSmall{font-size:12px; color:#6E6560; line-height:1.9; margin:6px 0px 0px; text-align:left;}
.cprofPassBlock{margin-top:30px; padding-top:6px; border-top:1px solid #E4DDD9;}

/* 2609 商品登録ページ：ギフティングであることの説明 */
.cpGift{background-color:#FFFFFF; border:1px solid #E7D5CF; border-left:4px solid #9C4A3C;
  border-radius:8px; padding:14px 16px; margin:0px 0px 16px;}
.cpGiftHead{font-size:14px; font-weight:bold; color:#8C3B2E; margin:0px 0px 8px; line-height:1.7;}
.cpGiftBody{font-size:13px; line-height:1.9; margin:0px;}

/* 2609 アイコン（旧：プロフィール写真）。
   マイページでは表示だけ、変更は専用ページ（/mypage/icon）で行う。 */
.iconNow{margin:0px 0px 8px;}
.iconNowImg{width:80px; height:80px; border-radius:100%; object-fit:cover;
  border:1px solid #E2E5E7; background-color:#F7F8F9;}
.iconLink{margin:6px 0px 14px; font-size:13px;}
/* 変更ページ側。左にいまのアイコン、右に説明を並べる */
.profWrap .iconNow{display:flex; align-items:center; gap:12px;}
.iconNowNone{display:inline-flex; align-items:center; justify-content:center; flex:none;
  font-size:12px; color:#6A767B; width:80px; height:80px; border-radius:100%;
  border:1px dashed #C9D0D4; text-align:center;}
.iconNowNoneText{font-size:12px; color:#6A767B;}
.iconFile{display:block; margin:6px 0px 0px;}
.iconPreview{margin:12px 0px 0px;}
.iconPreview img{width:120px; height:120px; border-radius:100%; object-fit:cover;
  border:1px solid #E2E5E7;}