@charset "utf-8";

img{vertical-align:bottom;}

.contents.foster{
  width: 960px;
  margin: 0 auto;
}

div.intro{
  background:url(/foster/images/intro_bg.png) no-repeat;
  width:606px;
  height:100px;
  padding:15px;
  font-size:8pt;
  line-height:1.5;
  color:#580000;
  overflow:hidden;
  text-shadow: 1px -1px 0 rgba(255, 255, 255, 0.2);
}
div.intro h1{
  font-size:20px;
  width: auto;
  background:none;
  text-align:left;
  padding-top:0;
  height:auto;
}
div.intro div.w-470{
  width:470px;
}

h2:not(.catchCopy){
  width: 630px;
  background-size:16px;
  border:none;
  border-radius:4px;
  box-shadow:none;
  padding-top:7px;
  color:#fff;
  margin:5px 0 10px;
}
h2.catchCopy{
  width: auto;
  border:none;
  box-shadow:none;
  padding:0;
}
h2.search_above{
  display:inline;
  color:#555;
  font-weight: bold;
  font-size:16px;
  border:none;
  box-shadow:none;
  padding:0;
}

/*##################### 認定アイコン #####################*/
a.tooltip img{
  vertical-align:middle;
  margin-left:5px;
  float:none;
}
a.tooltip span {
  display: none;
  padding: 5px;
  font-size: 12px;
  margin-left: 8px;
  line-height: 1.6;
}
a.tooltip:hover span{
  display: inline;
  position: absolute;
  background-color: #fff;
  border: 1px solid #cccccc;
  border-radius:4px;
  color: #000000;
  width: 120px;     /* a.tooltip spanに指定すると、IE6以下でspanの領域でマウスが反応してしまう */
  z-index:100;
  font-size:8pt;
}

/* IE6以下にのみ適用 */
a.tooltip:hover span{
  width: 136px;
}


/************** ページング色調整 ***************/
.foster .page_area{
  border-color: #0a725f;
}

.foster div.paging_area a.other_page{
  background-color: #d5e8d4;
}

.foster div.paging_area .current_page{
  background-color: #0a725f;
}

div.paging_area a:link,
div.paging_area a.prev_next:link{
  color: #0a725f;
}

.foster div.paging_area a.prev_next:last-child,
.foster div.paging_area a.prev_next:first-child {
  background-color: #d5e8d4;
}

.foster div.paging_area a:visited {
  color: #0a725f;
}

.foster div.paging_area a:hover{
  color: #F5AD4B;
}

/************** 共通 ***************/
/*-----左コンテンツ-----*/
.mainArea>h2.new_foster{
  width: 615px;
  border: none;
  box-shadow: none;
  font-size: 20px;
  font-weight: bold;
  margin: 0;
  border-bottom: 3px solid #ec6941;
  padding: 10px 10px 5px;
  margin-bottom: 15px;
  background-color: transparent;
  color: #333;
  border-left: none;
  border-radius: 0px;
}

.dog-area{
  margin:5px 0 -10px 0;
  text-align:right;
  font-size:12px;
}
.dog-area a{color:#777;}


/*----------------------------------------
里親詳細
----------------------------------------*/
.detailAreaWrap{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 15px;
}

.inputAreaWrap .inputInfoWrap h2,
.detailAreaWrap h2{
  font-size: 16px !important;
  border-bottom: none!important;
  background: #02735f;
  padding: 5px 15px;
  width: 100%;
  box-sizing: border-box;
  color: #fff;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  margin: 0 0 15px 0;
}

.detailAreaWrap .decision h2{
  background: #e84580;
}

.detailAreaWrap .exdate h2{
  background: #cab483;
}

.detailAreaWrap .draft h2,
.detailAreaWrap .end h2{
  background: #878787;
}

.detailAreaWrap .pause h2{
  background: #337ab7;
}

.detailAreaWrap .catPhoto{
  width: 445px;
}
.catDetail_wrap{
  width: 504px;
}
.detailAreaWrap .catDetail{
  width: 500px;
  min-height: 430px;
  background: #fff;
}

.detailAreaWrap .wanted{
  border: 2px solid #0a725f;
}

.detailAreaWrap .decision{
  border: 2px solid #e84580;
}

.detailAreaWrap .exdate{
  border: 2px solid #cab483;
}

.detailAreaWrap .end,
.detailAreaWrap .draft{
  border: 2px solid #878787;
}

.detailAreaWrap .pause{
  border: 2px solid #337ab7;
}

.detailAreaWrap .detailInfo{
  margin: 0 13px 10px 13px;
}

.detailAreaWrap .detailInfo .counter{
  padding: 7.5px 0;
}

.detailAreaWrap .detailInfo h3{
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 10px;
}
.detailAreaWrap .detailInfo .fa-paper-plane.exist{
  color: #ff52b6;
}
.detailAreaWrap .detailInfo .detailTxt {
  margin-bottom: 15px;
}
.detailAreaWrap .detailInfo table {
  width: 100%;
}

.detailAreaWrap .detailInfo td{
  font-size: 15px;
  padding: 8px 10px;
  border-left: none;
  border-right: none;
}

.detailAreaWrap .detailInfo td span{
  display: inline-block;
  padding: 3px 5px;
}

.detailAreaWrap .detailInfo td:nth-child(odd){
  color: #666;
  background: #f4f4f4;
  width: 25%;
  font-weight: bold;
}

.detailAreaWrap .detailInfo td:nth-child(even){
  width: 94%;
}

.detailAreaWrap .detailInfo .harf>td{
  background: #fff;
  width: 100%;
  padding: 0;
}

.detailAreaWrap .detailInfo table td{
  border: none;
}

.detailAreaWrap .detailInfo table .detailArea>tr{
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

.detailAreaWrap .detailInfo .harf table td:nth-child(odd){
  color: #666;
  background: #f4f4f4;
  width: 25%;
  font-weight: bold;
}

.detailAreaWrap .detailInfo .harf table td:nth-child(even){
  width: 25%;
  color: #333;
  font-size: 16px;
  font-weight: normal;
}

.detailAreaWrap .detailInfo .title .counter img{
  height: 16px;
  margin-right: 3px;
  vertical-align: -4px;
}

.detailAreaWrap .detailInfo	.extendLimitBtn {
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  color: #fff !important;
  display: inline-block;
  font-size: 12px;
  padding: 4px;
  white-space: nowrap;
  text-align:center;
}
.detailAreaWrap .detailInfo .extendLimitBtn {
  background: #32559f;
  width: 70px;
  float: right;
}
.detailAreaWrap .detailInfo .extendLimitBtn:hover {
  opacity: 0.7;
}

.detailAreaWrap .detailInfo	.btn_list a{
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  color: #fff !important;
  display: inline-block;
  font-size: 16px;
  padding: 5px;
  white-space: nowrap;
  text-align:center;
}
.detailAreaWrap .detailInfo	.btn_list a:hover{
  opacity: 0.7;
}
.detailAreaWrap .detailInfo	.btn_list .messageBtn {
  background: #ee2a6b;
  width: 180px;
}
.detailAreaWrap .detailInfo	.btn_list .editBtn {
  background: #63a428;
  width: 60px;
}
.detailAreaWrap .detailInfo	.btn_list .discoveryBtn {
  background: #ee2a6b;
  width: 60px;
}
.detailAreaWrap .detailInfo	.btn_list .endBtn {
  background: #bbb;
  width: 80px;
}
.detailAreaWrap .detailInfo	.btn_list .restartBtn {
  background: #63a428;
  width: 100px;
}

.catDetail_wrap .ins-banner{
  margin-top: 10px;
  display: block;
}
.catDetail_wrap .ins-banner img{
  width: 504px;
}

.detailAreaWrap .interaction_area_sns .fa{
  font-size: 40px;
}

.detailAreaWrap .catPhoto .mainPhoto{
  display: table-cell;
  width: 445px;
  height: 305px;
  text-align: center;
  vertical-align: middle;
}

.detailAreaWrap .catPhoto .mainPhoto {
  display: table-cell;
  width: 445px;
  height: 331px;
  text-align: center;
  vertical-align: middle;
  background: #fff;
  border: 2px solid #02735f;
  border-radius: 5px;
}

.detailAreaWrap .catPhoto .mainPhoto img{
  width: auto;
  height: auto;
  max-width: 445px;
  max-height: 331px;
  vertical-align: middle;
}

.detailAreaWrap .catPhoto li{
  width: 32%;
  height: auto;
  margin: 2% 0 0 0;
}
.detailAreaWrap .photoSelectList{
  display: flex;
  flex-wrap: wrap;
}
.detailAreaWrap .photoSelectList li {
  max-height: 110px;
  overflow: hidden;
  display: flex;
  align-items: center;
}
.detailAreaWrap .catPhoto li img {
  width: 100%;
  height: auto;
}
.detailAreaWrap .catPhoto li:last-child{
  margin-right: 0;
}
.detailAreaWrap .catPhoto li:nth-child(3n-1) {
  margin: 2% 2% 0 2%;
}
.detailAreaWrap .photoSelectList img:hover{
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}
.detailAreaWrap

.detailBlockWrap .detailBlock{
  background: #fff;
  padding: 15px;
  margin-bottom: 15px;
}

.detailBlockWrap .detailBlock .chara,
.detailBlockWrap .detailBlock .situation{
  width: 48.5%;
}

.detailBlockWrap .detailBlock .title{
  font-size: 16px;
  font-weight: bold;
  border-bottom: 1px solid #d2d2d2;
  margin-bottom: 10px;
}

.contents_body_bottom h3{
  display: block;
  padding: 0 5px 5px;
  border-bottom: #6c4033 solid 2px;
  font-size: 110%;
  margin-bottom: 10px;
}

.commonArea div{
  width: 50%;
}

.commonArea div a,
.commonArea div span{
  width: 95%;
}

a.favBtn,
.favBtnNeedLogin{
  background: #f4ab01!important;
}

a.favBtn.registed,
span.applied{
  background: #666666!important;
}

p.fav.check_fav{
  text-align: right;
}

.check_fav a.favBtn,
.check_fav a.favBtn.registed,
.check_fav .favBtnNeedLogin,
.check_fav span.applied{
  font-size: 23px;
  padding: 0;
  background: transparent!important;
  line-height: 1;
}
.check_fav a.favBtn{
  line-height: 1;
}

.check_fav a.favBtn i,
.check_fav a i{
  color: #ccc!important;
}

.check_fav a.favBtn.registed i{
  color: #f4ab01!important;
}

a.appliBtn,
a.applyManage{
  background: #ed4580!important;
}

.messageArea div:nth-child(odd){
  padding-right: 2%;
  width: 36%;
}

.messageArea div:nth-child(even){
  padding-left: 2%;
  width: 60%;
}

.messageArea div p:first-child{
  border-bottom: 1px dotted #ccc;
  margin-bottom: 5px;
  font-weight: bold;
}

a.fosterBtn,
span.fosterBtn{
  display: inline-block;
  padding: 3px 5px;
  background: #63a428;
  text-align: center;
  color: #fff;
  text-decoration: none;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  font-size: 15px;
}
a.btnDeleteDraft,
span.btnDeleteDraft{
  padding: 5px 5px;
  background: #d84937;
  font-size: 12px;
  line-height: 1;
}

.pdfLinkBtn a{
  background: #fff8f8;
  border: 2px solid #c93c2b;
  border-radius: 5px;
  color: #d84937 !important;
  display: inline-block;
  font-size: 15px;
  font-weight: bold;
  height: 20px;
  padding: 4px 10px 6px 10px;
  text-align: center;
  white-space: nowrap;
  width: 150px;
}

.pdfLinkBtn a:hover{opacity: 0.7;}

.inputAreaWrap span.required {
    font-size: 12px;
    background-color: #cc0000;
    color: #fff;
    padding: 0 5px 0;
    margin-right: 15px;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}

a.fosterBtn:hover{
  opacity: 0.7;
}

.messageArea a.fosterBtn{
  padding: 3px 8px;
}

a.fosterBtn.statusStopBtn,
a.fosterBtn.copyBtn{
  background: #999;
}

a.fosterBtn.restartBtn {
  background: #337ab7;
}

a.fosterBtn.decideBtn{
  background: #ee2a6b;
}

a.fosterBtn.longBtn{
  background: #337ab7;
}

a.fosterBtn.endBtn{
  background: #cab483;
}

.contents_body_bottom_left{
  float: left;
  width: 640px;
}

.message{
  background: #fff;
  padding: 10px;
}

.message h3{
  border-bottom: 1px solid #ed4681;
  padding-bottom: 5px;
  margin-bottom: 5px;
  font-size: 16px;
  font-weight: bold;
}


/*----------------------------------------
里親詳細_左コンテンツ
----------------------------------------*/
.statusArea div{
  background: #fff;
  padding: 10px;
  margin-bottom: 10px;
}

.statusArea h3{
  border-bottom: 1px solid #458f76;
  padding-bottom: 5px;
  margin-bottom: 5px;
  font-size: 15px;
  font-weight: bold;
}

.applicant{
  background: #fff;
  border: 1px solid #02735f;
}

.applicant h3{
  background: #458f76;
  padding: 3px 5px;
  color: #fff;
  font-size: 110%;
}

.applicant .userInfo>a{
  width: 90px;
  /*height: 90px;*/
  overflow: hidden;
}

.applicant .userInfo>div{
  width: 520px;
  height: auto;
}

.applicant .userInfo .date{
  border-bottom: 1px solid #ccc;
  padding-bottom: 3px;
  margin-bottom: 3px;
}
.applicant .userInfo .date.has-group{
  margin-top: -8px;
}
.applicant .userInfo .name{
  font-weight: 500;
  font-size: 16px;
  padding-bottom: 5px;
}
.applicant .userInfo .name.nintei{
  padding-bottom: -5px;
}
.applicant .userInfo .name img{
  vertical-align: middle;
  margin-left: 5px;
}
.applicant .userInfo .name a{
  color: #1067b7;
}
.applicant .userInfo .name a:hover{
  color: #ff8410;
}
.applicant .userInfo .number a{
  color: #1067b7;
  font-weight: 500;
}
.applicant .userInfo .number .item-name{
  margin-right: 5px;
}
.userInfo>a{
  width: 50px;
}

.userInfo>div{
  width: 240px;
  height: 40px;
}

.userInfo .date{
  padding-bottom: 7px;
  margin-bottom: 7px;
}

.conditions{
  background: #fff;
  border: 1px solid #02735f;
  padding: 10px;
}

.conditions h3{
  border-bottom: 1px solid #ccc;
  padding-bottom: 5px;
  margin-bottom: 5px;
  font-size: 15px;
  font-weight: bold;
}

/* ---------- 親コメント ---------- */
.question h3{
  display: block;
  padding: 0 5px 5px;
  border-bottom: #6c4033 solid 2px;
  font-size: 16px;
  font-weight: bold;
  margin: 0 0 10px 0;
}

.comment_parent{
  background: #fff;
}

/* ---------- ゲストからのコメント ---------- */
.comment_item {
  margin: 10px;
  background: #fdfdfd;
  border: #ddd solid 1px;
  border-radius: 6px;
}

.comment_info {
  display: table;
  width: 100%;
  border-radius:6px 6px 0 0;
}
.comment_parent .comment_info div{
  background-color: #fefaf5;
}
.comment_info_name,
.comment_info_thumb {
  display:table-cell;
  vertical-align: middle;
}

.comment_info_id {
  display:table-cell;
  padding: 5px;
  text-align: right;
  font-size:80%;
}
.comment_info_id span {
  color: #999;
  font-size:13px;
}

.comment_info_name {
  padding-left: 10px;
  line-height: 16px;
}
.comment_info_name .date{
  font-size:13px;
  color:#666;
}
.comment_info_name a{
  font-size:14px;
  font-weight: bold;
}

.comment_info_info span{
  color:#999;
}
.comment_info_thumb {
  width: 35px;
  padding: 5px 5px 5px 0;
  padding: 5px 0 5px 5px;
  border-radius:6px 0 0 0;
}

.owner .comment_info_info {
  border-radius:0 6px 0 0;
}
.comment_info_thumb img {
  width: 35px;
  height: 35px;
  border-radius: 5px;
  vertical-align: middle;
}

.comment_text {
  padding: 10px 10px 5px 10px;
}
.comment-body-delete {
  color: #888;
}

.commentBtn {
  display: none;
  width: 250px;
}

.re_comment_box {
  padding-right: 5px;
  box-sizing: border-box;
  display: table;
  width: 100%;
  width: 100%;
}

.re_comment_box .comment_text{
  padding-top:0;
  padding-left:3px;
}

.foster_re_comment {
  border-top: 1px solid #d8d8d8;
}

.foster_re_comment:nth-child(2) {
  padding-left: 40px;
}

.foster_re_comment:nth-child(n+3) {
  padding-left: 40px;
}

.foster_re_comment .comment_info {
  padding-top:7px;
}

/* ---------- コメント返信設定 ---------- */
.reply_btn{
  text-align: center;
  border: 1px solid #ddd6d6;
  background: #f4f2f2;
  width: 80px;
  cursor: pointer;
  border-radius: 5px;
  padding: 2px 0px;
  float:right;
  margin-bottom: 8px;
  margin-right:6px;
  
  text-decoration:none;
  letter-spacing: 1px;
  font-size: 11px;
  color: #8c5353 !important;
}

.reply_btn:hover{
  color: #8c5353 !important;
  opacity: 0.7;
}

.btn{
  text-align: center;
}

.contents_body_bottom .provideBtn{
  text-align: center;
  margin-top: 30px;
}

.contents_body_bottom .provideBtn a:hover{
  opacity: 0.8;
}

.contents_body_bottom .provideBtn a {
  display: inline-block;
  border: 1px solid #D35400;
  padding: 10px;
  background: #ec6941;
  width: 240px;
  text-align: center;
  color: #fff;
  text-decoration: none;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  font-size: 16px;
}
/* ---------- コメントフォーム ---------- */
.comment_write_area .comment-write-title {
  border: solid #ea731c;
  border-width: 0 0 2px 0;
  font-weight: bold;
  width: 100%;
  padding: 5px;
  margin: 0 0 15px 0;
  box-sizing: border-box;
  -webkit-box-shadow: none;
  box-shadow: none;
  font-size: 11pt;
}

.comment_write_area .comment-write-title .fa-comment {
  color: #2368A4;
}

.comment_write_area .comment-write-title a.fancyboxCloseBtn {
  font-size: 14px;
  text-decoration: none;
  font-weight: normal;
  color: #777;
}
.comment_write_area .comment-write-title a.fancyboxCloseBtn:hover {
  color: #ee924d;
}
.comment_write_area #comment_form textarea{
  margin: 0 auto;
  width: 98%;
  font-size: 16px;
}



/* ---------- 質問するボタン ---------- */
.question.provideBtn{
  text-align: center;
  margin: 10px 0 30px;
}

.question.provideBtn a:hover{
  opacity: 0.7;
}

.question.provideBtn a {
  display: inline-block;
  border: 1px solid #D35400;
  padding: 5px 10px;
  background: #ec6941;
  width: 240px;
  text-align: center;
  color: #fff;
  text-decoration: none;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  font-size: 16px;
}

.snsArea{
  padding: 10px 10px 5px 10px;
}

.interaction_area_sns{
  padding: 0 5px;
}

.snsArea h3{
  border-bottom: 1px solid #F5AD4B;
  margin-bottom: 8px;
  font-weight: bold;
  font-size: 15px;
}

.snsArea,
.appliStatus,
.recruitArea{
  background: #fff;
  margin-bottom: 10px;
}

.costArea {
  margin-bottom: 5px;
  border: 1px solid #458f76;
  background: #fff;
}
.costArea h3{
  background: #458f76;
}
.costArea>div {
  padding: 10px;
}
.costArea .costRow{
  padding:8px;
  border-bottom: 1px solid #ddd;
  font-size: 15px;
}
.costArea .costRow:last-child{
  border-bottom: none;
}
.costArea .costRow.total{
  background: #f7f7f7;
  font-weight: bold;
  color: #444;
}
.costArea .costType {
  float: left;
}
.costArea .cost {
  float: right;
}
.costLinkArea{
  margin: 0 0 10px;
  text-align: right;
}
.costLinkArea .costLink{
  display: inline-block;
  padding: 9px 10px 7px;
  background: #fff;
  border-radius: 5px;
  color: #458f76;
  line-height: 1;
}
.costLinkArea .costLink:hover{
  background: #f3fffd;
}

.appliStatus{
  border: 1px solid #ed4681;
}
.appliStatus .alliRow {
  border-bottom: 1px solid #ccc;
}
.appliStatus .alliRow:last-child {
  border-bottom: none;
}
.appliStatus .alliRow a.user-name{color: #1067b7; font-size:14.5px;}
.appliStatus .alliRow a.user-name:hover{color: #ff8410;}
.recruitArea{
  border: 1px solid #666666;
}

.recruitArea h3{
  border: 1px solid #666666;
}

.recruitArea .recruitRow {
  display: flex;
  align-content: center;
  border-bottom: 1px solid #ccc;
}
.recruitArea .recruitRow:last-child {
  border-bottom: none;
}
.recruitArea .recruitRow_img,
.recruitArea .recruitRow_img{
  width: 50px;
  height: 50px;
}
.recruitArea .recruitRow_txt{
  padding: 5px 10px;
  width: calc( 100% - 70px );
}
.recruitArea .recruitRow .title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.recruitArea .recruitRow .title a{color: #1067b7;}
.recruitArea .recruitRow .title a:hover{color: #ff8410;}

.costArea h3,
.appliStatus h3,
.recruitArea h3{
  padding: 3px 5px;
  color: #fff;
  display: table;
  width: 288px;
  font-size: 15px;
}

.costArea h3 span.title{
  display: table-cell;
  vertical-align: middle;
}

.appliStatus h3{
  background: #ed4681;
}

.recruitArea h3{
  background: #666666;
}

/*####### 変更履歴ポップアップ #######*/
.costArea .costHistory a{
  color: #458f76;
  background-color: #fff;
  border-radius: 5px;
  padding: 1px 8px;
  display: inline-block;
  font-size:11px;
}
.costArea .costHistory a:hover{
  opacity: 0.8;
}
#costHistoryPop{
  max-height: 800px!important;
}

#costHistoryPop table{
  width: 100%;
}
#costHistoryPop table th{
  background-color: #d5e8d4;
  color: #0a725f;
  font-size: 105%;
  font-weight: bold;
  text-align: center;
}
#costHistoryPop table th,
#costHistoryPop table td{
  border: 1px solid #0a725f;
  width: 16%;
}
#costHistoryPop .costHistoryTitle{
  border: solid #ea731c;
  border-width: 0 0 2px 0;
  font-weight: bold;
  width: 100%;
  padding: 5px;
  margin: 0 0 15px 0;
  box-sizing: border-box;
  -webkit-box-shadow: none;
  box-shadow: none;
  font-size: 11pt;
}
#costHistoryPop .costHistoryTitle a.fancyboxCloseBtn{
  font-size: 14px;
  text-decoration: none;
  font-weight: normal;
  color: #777;
}
#costHistoryHeader .fa-history{
  color: #2368A4;
}



/*##################### fixedバナー #####################*/
.fixedBnr{
  background: rgba(0, 0, 0, 0.7);
  padding: 10px 0;
  position: fixed;
  z-index: 999;
  width: 100%;
  bottom: 0;
}

.fixedBnr .commonArea{
  width: 960px;
  margin: 0 auto;
  text-align: center;
}

.fixedBnr .commonArea a{
  width: 20%;
}

.fixedBnr .commonArea a.appliBtn:hover{
  opacity: 1;
  background: #f27da6!important;
}


/*##################### TOP上部の説明ブロック #####################*/
.main-introduce-area .intro{
  width:586px;
}

.main-introduce-area{
  width: 636px;
  background-color: #fff;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  margin-bottom: 10px;
}

.main-introduce-inner{
  padding: 0 10px 0 10px;
}

.main-introduce-area h2{
  width: 636px;
  margin: 0;
  padding: 0;
}

.main-introduce-area h2 img{
  width: auto;
  max-width: 100%;
  height: 98px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  -webkit-top-border-left-radius: 5px;
  -webkit-top-border-right-radius: 5px;
  -moz-border-top-left-radius: 5px;
  -moz-border-top-right-radius: 5px;
}

.main-introduce-inner .harfBox h3 img{
  width: auto;
  max-width: 100%;
}

.bottomArea h3.title{
  border-bottom: 2px solid #F5AD4B;
  padding: 5px 7px;
  font-size: 14px;
  font-weight: bold;
}

.bottomArea h3.title:before{
  content: "\f02e";
  font-family: FontAwesome;
  color: #F5AD4B;
  margin-right: 5px;
  font-size: 15px;
}

.main-introduce-area .txtBox>div{
  width: 100%;
}

.main-introduce-area .harfBox>div{
  width: 300px;
}

.main-introduce-area .txtBox .txtArea{
  padding: 5px 3px 10px;
}

.bottomArea .txtBox .txtArea{
  padding: 10px 3px 0 3px;
}

.main-introduce-area .txtBox .txtArea p,
.bottomArea .txtBox .txtArea p{
  padding: 0 3px 3px 3px;
  font-size: 12px;
  line-height: 1.2rem;
}

.main-introduce-area .txtBox .txtArea span.more{
  display: block;
}

.main-introduce-area .topTxt .txtArea{
  padding: 8px 0 0 0;
}

.main-introduce-area .topTxt .imgArea{
  padding: 1.5% 0%;
  margin: 0 auto;
  width: calc(100% - 76%);
}

.main-introduce-area .topTxt .imgArea img{
  width: 100%;
}

.main-introduce-area .more a{
  display: inline-block;
  margin: 0 auto;
  padding: 2px 5px;
  border: 1px solid #4b9e82;
  border-radius: 4px;
  background:#4b9e82;
  color: #fff !important;
  font-size: .75rem;
  text-align: center;
  white-space: nowrap;
}

.main-introduce-area .more a:hover{
  border: 1px solid #458f76;
  background:#458f76;
}

.main-introduce-area .more a:before{
  content: "\f061";
  font-family: FontAwesome;
  margin-right: 5px;
}

.main-introduce-area .more a:hover{
  color: #ff6c00;
}

.main-introduce-area .miniTitle{
  font-size: 14px;
}


/*質問欄の注意文*/
.commentAtten{
  border:1px solid #cb5300;
  background:#fff;
  padding:10px;
  margin: 20px 10px 0;
}

/*20201109追記 index一覧でしか使いません*/
.fosterIndex{
	display:flex;
	align-items: center;
}
.fosterIndex_detail{
	padding-left:10px;
}
.fosterIndex_detail .group{
	font-size:12px;
	font-weight:normal;
}


/*----------------------------------------
 2025/06 TOPリニューアル
----------------------------------------*/
.introBox{
  margin: 0 0 15px;
}
h2.mainIntroduce-heading{
  margin: 0;
  padding: 0;
  width: 100%;
}
h2.mainIntroduce-heading a{
  position: relative;
  display: block;
  padding: 20px;
  height: 130px;
  background: url(/foster/images/top_bnr-pc.jpg) no-repeat center / contain;
}
h2.mainIntroduce-heading a:hover{
  opacity: .7;
}
h2.mainIntroduce-heading a > div{
  width: 564px;
  margin-left: auto;
}
h2.mainIntroduce-heading a img{
  width: 430px;
  margin: 0 0 18px;
}
.mainIntroduce-text{
  margin-top: -5px;
  background: #fff;
  font-size: 13px;
  line-height: 1.5;
}
.numBlock{
  display: flex;
  justify-content: flex-end;
  gap: 20px;
}
.numBlock-item{
  padding: 5px 10px;
  border-radius: 3px;
  background: rgba(255, 255, 255, .8);
  color: #333;
  font-size: 16px;
}
.numBlock-item span{
  font-size: 18px;
  font-weight: bold;
}
.numBlock-item .fa-paw{
  color: #880000;
}
.numBlock-item .fa-heart{
  color: #ed4580;
}

.postsList_img .check_fav{
  position: absolute;
  right: 5px;
  bottom: 5px;
  width: 36px;
  height: 36px;
}
.postsList_img .check_fav a.favBtn,
.postsList_img .check_fav a.favBtnNeedLogin{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #fff!important;
  opacity: .9;
}
.postsList_img .check_fav a.favBtn:hover,
.postsList_img .check_fav a.favBtnNeedLogin:hover{
  opacity: .7;
}
.postsList_img .check_fav a.favBtn.registed,
.postsList_img .check_fav a.favBtn:hover,
.postsList_img .check_fav a.favBtnNeedLogin:hover{
  background: #f4ab01 !important;
}
.postsList_img .check_fav a.favBtn.registed i,
.postsList_img .check_fav a.favBtn:hover i,
.postsList_img .check_fav a.favBtnNeedLogin:hover i{
  color: #fff!important;
}