@charset "euc-jp";

/* detail_1column

案件詳細ページのみで使用するスタイル

------------------------------------------------ */

/* detail1_column メインカラム
------------------------------------------------ */

/* 見出し */
.matter h2 {
    height: auto;
    clear: both;
    margin-bottom: 15px;
    padding: 7px 0 9px 5px;
    border: none;
    border-bottom: #2879c4 2px solid;
    background-color: #fff;
    font-size: 23px;
    color: #3b3b3b;
}
.matter h3 {
    clear: both;
    border-bottom: #2879c4 1px solid;
    background: url(../../img/15/detail/ico_arrow7.gif) no-repeat 10px 15px;
    margin-bottom: 15px;
    padding-left: 25px;
    letter-spacing: 1px;
    font-size: 18px;
    color: #3b3b3b;
}
.matter h4 {
    font-weight: bold;
    font-size: 17px;
}
.matter h5 {
    border-top: #2879c4 2px solid;
    margin-bottom: 10px;
    padding: 15px 0 0 15px;
    font-size: 17px;
}


/* 案件詳細
------------------------------------------------ */
.matter .detail_left,
.matter .detail_right {
    width: 450px;
    box-sizing: border-box;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
}
.matter .detail_left {
    min-height: 200px;
    height: auto;
    position: relative;
    float: left;
    padding: 20px 20px 5px;
    border: 1px solid #e0e0e0;
    background: #fff;
}
.matter .detail_left .detail1 .thumnail {
    width: 150px;
    height: 100px;
    box-sizing: border-box;
    float: left;
    padding-top: 20px;
    border: #ebebeb 1px solid;
    background: #f5f5f5;
    text-align: center;
    vertical-align: middle;
}
.matter .detail_left .detail1 .thumnail img {
    margin: 0;
    padding: 0;
    vertical-align: bottom;
}
.matter .detail_left .detail1 .thumnail a img:hover {
    opacity: 0.7;
}
.matter .detail_left .detail1 .point_status {
    width: 245px;
    height: 100px;
    box-sizing: border-box;
    float: right;
    border-bottom: #959595 1px dotted;
}
.matter .detail_left .detail1 .point_status .ico_point {
  display: block;
  margin: 20px 0 15px;
  padding-left: 20px;
  background: url(../../img/15/icon/ico_coin1.png) no-repeat 0 0;
  font-size: 23px;
}
.matter .detail_left .detail1 .point_status .usually {
  display: table-cell;
  padding: 0 12px 0 0;
  vertical-align: top;
  letter-spacing: 0;
  font-size: 16px;
  color: #363636;
}
.matter .detail_left .detail1 .point_status del {
  padding: 0 12px 0 3px;
}
.matter .detail_left .detail1 .point_status .point {
  display: table-cell;
  background-position: 0 0;
  padding-left: 0;
  background: none;
  vertical-align: top;
  font-size: 35px;
}
.matter .detail_left .detail1 .point_status .friendbonus {
  letter-spacing: 0;
  font-size: 14px;
}
.matter .detail_left .detail1 .point_status .friendbonus .buy {
  display: inline-block;
  margin-right: 2px;
  font-size: 12px;
}
.matter .detail_left .detail2 {
    padding-top: 15px;
    clear: both;
}
.matter .detail_left .detail2 a.favorite {
    float: left;
    margin-right: 20px;
}
.matter .detail_left .detail2 .favorite img:hover {
    opacity: 0.6;
}
.matter .detail_left .detail3 {
    width: 235px;
    float: left;
    font-size: 12px;
}
.matter .detail_left .detail3 p span.txt {
    display: block;
    padding-left: 85px;
}
.matter .detail_left .detail3 p span.addpointtime,
.matter .detail_left .detail3 p span.category {
    width: 85px;
    display: block;
    float: left;
}
.matter .detail_left:after,
.matter .detail_left:before {
    top: 50px;
    left: 448px;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
}
.matter .detail_left:after {
    width: 40px;
    height: 87px;
    background: url(../../img/15/detail/img_arow.gif) no-repeat 0 0;
}
.matter .detail_right {
    float: right;
    margin-bottom: 20px;
}
.matter .detail_right .detail4 {
    height: 200px;
    float: right;
    box-sizing: border-box;
    margin-bottom: 5px;
    padding: 15px 25px 25px;
    border: #f0bd00 1px solid;
    background: #fef8e3;
    text-align: center;
}
.matter .detail_right .detail4 .comment1 {
    font-size: 18px;
}
.matter .detail_right .detail4 .comment1 li span {
    height: 40px;
    display: inline-block;
    padding-top: 5px;
}
.matter .detail_right .detail4 .comment1 .strange {
    font-weight: bold;
    color: #ff4467;
}
.matter .detail_right .detail4 img.pointsave:hover {
    opacity: 0.6;
}
.matter .detail_right .detail4 .comment2 {
    margin-top: 15px;
    font-size: 15px;
}
.matter .detail_right .txt {
    text-align: right;
    font-size: 11px;
}
/* Tポイント */
.matter .detail_right .detail4 .tpoint {
    padding-left: 38px;
    background: url(../../img/15/detail/ico_tpoint.gif) no-repeat 0 1px;
}
/* 紹介ボーナスとは */
.matter .about_bonus {
  width: 150px;
  position: absolute;
  right: 0;
  bottom: -25px;
  text-align: right;
}
/* お買い物保証とは */
.matter .about_safe {
  width: 150px;
  position: absolute;
  right: 140px;
  bottom: -25px;
  text-align: right;
}

/* ポイント獲得条件 タブ
------------------------------------------------ */
.matter .detail_action {
    overflow: hidden;
    clear: both;
    margin-bottom: 25px;
}
.matter .tab_list{overflow:hidden;}
.matter .tab_list li{
    float:left;
    background:#ccc;
    margin-right: 5px;
    cursor: pointer;
}
.matter .tab_list li:nth-child(1) {
    margin-left: 5px;
}
.matter .tab_list li p {
    padding: 11px 12px 9px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    border: #ccc 1px solid;
    background: #ececec;
    color: #3a3a3a;
}
.matter .tab_list li p:hover {
    border: #5a9fdf 1px solid;
    background: #c6def5;
}
.matter .tab_list li.select p {
    position: relative;
    padding: 12px 12px 15px;
    -webkit-border-top-left-radius: 2px;
    -webkit-border-top-right-radius: 2px;
    -moz-border-radius-topleft: 2px;
    -moz-border-radius-topright: 2px;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    border: none;
    background :#5a9fdf;
    font-size: 15px;
    color: #fff;
}
.matter .tab_list li.select p:before {
    width: 0;
    height: 0;
    content: '';
    display: inline-block;
    position: absolute;
    top: 37px;
    left: 50%;
    border-top: #ffea06 5px solid;
    border-bottom:5px solid transparent;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    margin-left: -3px;
}
.matter .detail_list li{
    border-top: #5a9fdf 2px solid;
    border-bottom: #ccc 1px solid;
    border-left: #ccc 1px solid;
    border-right: #ccc 1px solid;
    padding: 20px 20px 15px;
}
.matter .detail_list span {
    font-weight: bold;
    color: #ff4467;
}
.matter .hidden {display:none;}

/* 開催中のサービス
------------------------------------------------ */
.matter .now_service p {
    margin-bottom: 20px;
}
.matter .now_service ul {
    margin-bottom: 25px;
}
.matter .now_service li {
    display: table-cell;
}
.matter .now_service li:nth-child(1) {
    padding-right: 15px;
}
.matter .now_service a {
    display: block;
}
.matter .now_service img {
    margin: 0;
    padding: 0;
    vertical-align: bottom;
}

/* この〇〇を見た人はこちらの〇〇もみています
   あたたが最近閲覧した案件からのおすすめ
   最近チェックした案件
------------------------------------------------ */
.matter .matter_list {
    overflow: hidden;
    margin-bottom: 25px;
    padding: 0 5px;
}
.matter .matter_list li {
    width: 235px;
    box-sizing: border-box;
    float: left;
    text-align: center;
}
.matter .matter_list li {
    padding: 0 1px;
    border-right: #ccc 1px solid;
}
.matter .matter_list li .name {
    margin-bottom: 10px;
    text-decoration: none;
    font-weight: normal;
}
.matter .matter_list li .point {
    margin: 5px 0;
    font-size: 23px;
}
.matter .matter_list li .addpointtime {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: 0;
    font-size: 11px;
    color: #3a3a3a;
}
.matter .matter_list li:nth-child(4) {
    border-right: none;
}
.matter .matter_list li a{
    display: block;
    padding: 15px 10px;
    background-color: #fff;
    text-decoration: none;
}
.matter .matter_list li a:hover {
    background-color: #fef5d1;
    text-decoration: none;
}

/* その他のショップを見る
------------------------------------------------ */
.matter .shop_list {
    overflow: hidden;
    clear: both;
    margin-bottom: 20px;
    padding: 15px 15px 5px;
    border: #ccc 1px solid;
    background: #ededed;
}
.matter .shop_list ul {
    margin: 10px 0 0 7px;

}
.matter .shop_list li {
    height: 18px;
    float: left;
    border-right: #b3b3b3 1px solid;
    margin: 0 0 12px;
    padding: 0 20px 0;
    font-size: 12px;
}
.matter .shop_list li:nth-child(1) {
    padding-left: 0;
}
.matter .shop_list li:last-child {
    border-right: none;
}
.matter .shop_list p {
    clear: both;
    text-align: right;
}
.matter .shop_list p a {
    position:relative;
    padding-right: 20px;
    text-decoration: none;
    font-weight: bold;
    color: #767676;
}
.matter .shop_list p a:hover {
    text-decoration: underline;
}

.matter .shop_list p a:before {
    border:8px solid transparent;
    border-top-color:#ededed;
    border-bottom-width:0;
    bottom: 9px;
    content:"";
    display:block;
    left:170px;
    position:absolute;
    width:0;
    z-index:1;
}
.matter .shop_list p a:after {
    border:8px solid transparent;
    border-top-color:#767676;
    border-bottom-width:0;
    bottom: 7px;
    content:"";
    display:block;
    left:170px;
    position:absolute;
    width:0;
}

/* 遷移後 */
.matter #transition {
    margin-bottom: 20px;
}