@charset "utf-8";
/*------------------------------------------------------------
マッチングサイト
------------------------------------------------------------*/
.order_box1{
overflow:hidden;
}
.content_area{
}
h2{
text-align:center;
color:#66D000;
font-weight:bold;
font-size:1.8em;
/*font-family:"メイリオ", Meiryo;*/
margin:0.5em auto 2em auto;
}
/*タブ切り替え全体のスタイル*/
.tabs {
  width:100%;
  margin: 0 auto;
text-align:left;
position:relative;
}
.tab_item {
  margin: 0 0 0 10px;
padding:0;
}
/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}
/*タブ切り替えの中身のスタイル*/
.tab_content {
  display: none;
  padding: 0;
  clear: both;
  overflow: hidden;
}
/*選択されているタブのコンテンツのみを表示*/
#wanttobuy:checked ~ #wanttobuy_content,
#wanttosell:checked ~ #wanttosell_content {
  display: block;
}
/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
}
.matchingnotice{
width:50%;
margin:0 0 0 0;
position:relative;
top:55px; 
left:265px
}




/*---------------------------
  買いたい方
----------------------------*/
#wanttobuy_content{
margin-top:-9px;
border-top:solid 10px #EA5B00;
text-align:center;
overflow: hidden;
}
#wanttosell_content{
margin-top:-9px;
border-top:solid 10px #005DAD;
text-align:center;
overflow: hidden;
}
#wanttobuy_genre{
padding:0 0 2em 0;
}
#wanttobuy_companylist{
padding:0 0 2em 0;
}
#wanttobuy_messagemgr{
text-align:center;
padding:0 0 2em 0;
}
#wanttobuy_message{
text-align:center;
padding:0 0 2em 0;
overflow: hidden;
}
.wanttobuy_h3{
text-align:left;
margin:20px 0 0 0;
padding:0.4em 0 0.4em 1em;
width:50%;
background-color:#EA5B00;
color:#fff;
font-weight:bold;
 overflow: hidden;
border-radius: 0px 10px 10px 0px / 0px 10px 10px 0px;
float:left;
}
.wanttobuy_h3 h3{
display:inline;
}
.wanttobuy_h3 span{
font-size:0.8em;
float:right;
padding:0.3em 0 0em 1em;
}
.wanttobuy_header{
margin:0px 0 20px 0;
overflow: hidden;
}
.message_btn{
margin:15px 0px 0px 20px;
float:right;
}
.back_btn{
/*margin:27px 0 0 10px;*/
margin:0 0 0 10px;
float:right;
clear:both;
}
.back_genre_btn{
/*margin:27px 10px 0 0px;*/
margin:0 10px 0 0px;
float:right;
}
ul.genre{
clear: both;
padding-left:0;
margin:30px 0 0 0;
overflow:hidden;
}
ul.genre li{
/*width:100px;*/
width:120px;
height:200px;
margin:0 33px 90px 33px;
font-size:0.8em;
float:left;
position: relative;
}
ul.companylist{
clear: both;
padding-left:0;
margin:10px 0 20px 0;
overflow:hidden;
border-bottom:dotted 1px #EA5B00;
}
ul.companylist li{
border-top:dotted 1px #EA5B00;
width:100%;
height:auto;
margin:0 0px 0px 0px;
padding:0 0 0 0;
font-size:0.8em;
float:left;
}
ul.companylist li .complist_img{
/*width:20%;*/
width:250px;
height: 70px;
object-fit: contain;
margin:10px 10px 10px 0px;
float:left;
}
ul.companylist li .comp_img{
width:26%;
float:left;
}
ul.companylist li .comp_data{
width:50%;
text-align:left;
margin:10px 0px 10px 20px;
float:left;
}
ul.companylist li .comp_name{
margin:0 0px 0px 0px;
font-size:1em;
font-weight:bold;
}
ul.companylist li .location{
margin:0 0px 0px 0px;
font-size:0.9em;
color:#4169e1;
}
ul.companylist li .overview{
margin:0 0px 0px 0px;
font-size:0.9em;
}
ul.companylist li .send_message_img{
margin:20px 0px 20px 0;
float:right;
}
.massage_copmbox{
margin:0px auto 0 auto;
width:86%;
}
h4.copm_box_title{
text-align:left;
margin:28px 0 0 0;
padding:12px 10px 12px 10px;
display:inline;
background-color:#EA5B00;
color:#fff;
font-weight:bold;
clear: both;
float:left;
font-size: 16px;
}
h4.copm_box_title2{
text-align:left;
margin:30px 0 0 0;
padding:12px 10px 12px 10px;
display:inline;
background-color:#005DAD;
color:#fff;
font-weight:bold;
clear: both;
float:left;
font-size: 16px;
}
ul.copm_box{
margin:0 auto 0 auto;
padding:0px 0px 0px 0px;
clear: both;
border:solid 1px #ccc;
/*border-top:dotted 1px #EA5B00;*/
overflow: hidden;
}
ul.copm_box li{
/*border-top:dotted 1px #EA5B00;*/
/*border-bottom:dotted 1px #EA5B00;*/
margin:0px 0 0 0;
padding:5px 0 5px 0;
overflow: hidden;
border-bottom: 1px solid #dbdfe2;
}
.copm_box_compname{
display:inline;
width: 300px;
margin:0px 0 0 1em;
float:left;
font-size:14px;
}
.copm_box_right{
overflow: hidden;
float:right;
}
.copm_box_date{
font-size:0.6em;
/*margin:0.4em 1em 0 0em;*/
margin:0 1em 0 0em;
float:right;
clear: both;
}
.copm_box_icon{
margin:0 0.5em 0 0em;
float:right;
}
.no_send_message{
font-size:1em;
color:#ffa500;
margin:0 0 0 1em;
}
.no_receive_message{
font-size:1em;
color:#00bfff;
margin:0 0 0 1em;
}
.message_partner{
}
ul.message{
margin:0px auto 0 auto;
clear: both;
border:solid 1px #ccc;
overflow: hidden;
padding-left:0;
}
.message_send{
margin:0px 1em 0 1em;
padding:1em;
width:70%;
float:right;
text-align:right;
overflow: hidden;
}
.customer_name_s{
margin-right:2em;
display:inline;
float:right;
background-image:url("../img/matching/hukidasi_send.gif");
background-repeat:no-repeat;
background-position:left bottom;
padding:10px 0 0 70px;
}
.message_date_s{
margin:1.5em 0 0 2em;
font-size:0.6em;
float:left;
}
.message_send .message_text{
text-align:left;
padding:1em;
background-color:#D3EDF9;
border-radius: 1em 1em 1em 1em / 1em 1em 1em 1em;
clear: both;
}
.message_receive{
margin:0px 1em 0 1em;
padding:1em;
width:70%;
float:left;
text-align:left;
overflow: hidden;
}
.customer_name_r{
margin-left:2em;
display:inline;
float:left;
background-image:url("../img/matching/hukidasi_receive.gif");
background-repeat:no-repeat;
background-position:right bottom;
padding:10px 70px 0 0;
}
.message_date_r{
margin:1.5em 2em 0 0em;
font-size:0.6em;
float:right;
}
.message_receive .message_text{
text-align:left;
padding:1em;
background-color:#FFFBC4;
border-radius: 1em;
clear: both;
}
.message_input{
width:62%;
text-align:left;
margin:1em 0 0 0;
float:right;
overflow: hidden;
}
/*
textarea{
text-algin:right;
margin:0 0 0 0;
padding:1em;
font-size:1em;
float:left;
border-radius: 1em;
}
*/
.btnsend{
width:5em;
height:1.4em;
font-weight:bold;
/*float:right;*/
font-size:1.2em;
border-radius: 0.6em;
background-color:#EA5B00;
border:none;
color:#fff;
margin-top:20px;
margin-left:500px;
margin-bottom:20px;
cursor : pointer;
}

.btndisclose{
width:14em;
height:1.6em;
font-weight:bold;
font-size:0.8em;
border-radius: 0.6em;
background-color:#EA5B00;
border:none;
color:#fff;
float:left;
padding: 2px 0 0 0;
cursor : pointer;
}

/*---------------------------
  売りたい方
----------------------------*/
#wanttosell_genre{
padding:0 0 2em 0;
}
#wanttosell_companylist{
padding:0 0 2em 0;
}
#wanttosell_messagemgr{
text-align:center;
padding:0 0 2em 0;
}
#wanttosell_message{
text-align:center;
padding:0 0 2em 0;
overflow: hidden;
}
.wanttosell_h3{
text-align:left;
margin:20px 0 0 0;
padding:0.4em 0 0.4em 1em;
width:50%;
background-color:#005DAD;
color:#fff;
font-weight:bold;
 overflow: hidden;
border-radius: 0px 10px 10px 0px / 0px 10px 10px 0px;
float:left;
}
.wanttosell_h3 h3{
display:inline;
}
.wanttosell_h3 span{
font-size:0.8em;
float:right;
padding:0.3em 0 0em 1em;
}
.sell_companylist table{
width:100%;
}
.sell_companylist table th {
color:#fff;
font-size:0.8em;
background: #7799AC;
font-weight:bold;
padding:0.5em auto 0.3em;
}
.sell_companylist table td {
/*background: #eee;*/
background: #e6e6fa;
/*font-size:0.8em;*/
font-size:0.7em;
padding:0.2em;
height: 48px;
}
table tr:nth-child(odd) td {
background: #fff;
}
h4.copm_box_title3{
text-align:left;
margin:20px 0 0 0;
padding:0.4em 1em 0.4em 1em;
display:inline;
background-color:#005DAD;
color:#fff;
font-weight:bold;
clear: both;
float:left;
}
h4.copm_box_title4{
text-align:left;
margin:20px 0 0 0;
padding:0.4em 1em 0.4em 1em;
display:inline;
background-color:#EA5B00;
color:#fff;
font-weight:bold;
clear: both;
float:left;
}
.footer{
height:auto;
}
.environment {
height:auto;
text-align:center;
}
.content_area{
clear:both;
background-color:#f00;
}
/*---------------------------
  共通
----------------------------*/
/* ジャンル一覧件数表示 */
/*
.badge {
  position: absolute;
  font-size: 16px;
  line-height: 18px;
  border-radius: 50%;
  width: 18px;
  height: 18px;
  background-color: #ff0000;
  border: 4px solid #ff0000;
  color: #ffffff;
  text-align: center;
  left:80px;
}
*/
.corpnum {
  padding: 1px 28px 1px 28px;
  font-size: 90%;
  /*color: white;*/
  color: #0000cd;
  border-radius: 6px;
  box-shadow: 0 0 3px #ddd;
  white-space: nowrap;
  background-color: #e6e6fa;
}

/* メッセージ総件数表示 */
.all_num_msg {
  padding: 4px 6px;
  /*margin-right: 10px;*/
  /*margin-bottom: 2px;*/
  font-size: 12px;
  color: #000000;
  border-radius: 6px;
  /*box-shadow: 0 0 3px #ddd;*/
  white-space: nowrap;
  background-color: #dbdfe2;
  float: left;
  margin-left: 3px;
}

/* メッセージ未読件数表示 */
.unread {
  padding: 3px 6px;
  /*margin-right: 10px;*/
  /*margin-bottom: 2px;*/
  font-size: 75%;
  color: white;
  border-radius: 6px;
  box-shadow: 0 0 3px #ddd;
  white-space: nowrap;
  background-color: #ff0000;
  float: left;
}

/* メッセージ未読件数表示 */
.unread_total {
  position: relative;
  /*top:5px;*/
  top:-20px;
  /*left:20px;*/
  padding: 3px 20px;
  font-size: 72%;
  color: white;
  border-radius: 6px;
  box-shadow: 0 0 3px #ddd;
  white-space: nowrap;
  background-color: #ff0000;
}

.goto_top{
float: right;
}

/* メッセージ受信停止・再開ボタン */
.btn_receive{
width:164px;
height:22px;
font-size:12px;
border-radius: 1em;
background-color:#4169e1;
border:none;
color:#fff;
/*margin:2em 0.5em 0 1em;*/
cursor : pointer;
margin: 5px 0px 0px 81px;
}

/* 受信停止ボタン */
.btnsuspend{
width:74px;
height:28px;
/*font-weight:bold;*/
float:right;
font-size:0.7em;
border-radius: 1em;
background-color:#DC143C;
border:none;
color:#fff;
margin:0 0.5em 0 0em;
cursor : pointer;
}

.msgsuspended{
  padding: 2px 109px 0 109px;
  font-size: 80%;
  /*font-weight:bold;*/
  color: white;
  border-radius: 1em;
  box-shadow: 0 0 3px #ddd;
  white-space: nowrap;
  background-color: #696969;
  float: right;
  margin:0 0.5em 0 0em;
}

/* メッセージ送信画面 */
.message_area_header {
  width:700px;
  margin:0 auto 0 auto;
}
.message_area {
  width:700px;
  border:1px solid gray;
  margin:0 auto 0 auto;
  clear: both;
}
.message_area_btn_back {
  float: right;
  margin:0 0 10px 0;
}
.message_area_btn_genre {
  float: right;
  margin:0 10px 10px 0;
}
.corp_no{
  float: left;
  font-family:"メイリオ", Meiryo;
  font-size:1em;
  color: #4169e1;
}
.corp_name{
  float: left;
  font-family:"メイリオ", Meiryo;
  font-size:0.8em;
  color: #ff8c00;
}
.inTextarea {
  width: 580px;
  height: 230px;
  line-height: 1.2em;
  font-family:"メイリオ", Meiryo;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  -o-border-radius: 5px;
  -ms-border-radius: 5px;
  border:#a9a9a9 1px solid;
  -moz-box-shadow: inset 0 0 5px rgba(0,0,0,0.2),0 0 2px rgba(0,0,0,0.3);
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2),0 0 2px rgba(0,0,0,0.3);
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2),0 0 2px rgba(0,0,0,0.3);
  padding:5px 10px;
  resize: vertical;
  outline: none;
}
.inTextarea:focus {
  border:solid 1px #32CD32;
}
.oldmessage_title {
  display:inline-block;
  color: #ff8c00;
  font-size:0.8em;
  margin:0 0 5px 0;
  float: left;
}
.oldmessage_date {
  display:inline-block;
  font-size:0.6em;
  margin:5px 0 5px 0;
  float: right;
}
.oldmessage {
  width: 380px;
  height: 140px;
  resize: none;
}

/*---------------------------
  headに直接記述されていたもの
----------------------------*/
.tab_content {
  display: none;
}
.is-active-item {
  display: block;
}

.tab_btn {
margin-left:10px;
  /*font-size: 24px;*/
  /*padding: 5px;*/
  /*background-color: #E0F2F7;*/
  display: inline-block; /* ボタンを横並びに。flexboxなどでも可 */
  opacity: 1.0;  /* 非アクティブなボタンは半透明にする */
  /*border-radius: 5px 5px 0 0;*/
}
.is-active-btn {
  opacity: 1;  /* アクティブなボタンは半透明を解除 */
  /*color: #00BFFF;*/ /* 文字色も変える */
}

.info_msg{
    float: left;
    font-size: 16px;
    margin: 4px 0px 0px 0px;
    border: 1px solid #000000;
    color: #e00a0a;
    text-align: left;
    padding:10px 10px;
}