@charset "utf-8";
html, body {
    font-size: 14px;
    font-family: "Open Sans","Hiragino Sans","ヒラギノ角ゴシック",'Hiragino Kaku Gothic ProN','Kozuka gothic pro', 'Meiryo', 'sans-serif',"ヒラギノ角ゴ ProN W3","Helvetica Neue",Helvetica,Arial,sans-serif !important;
    color: #5d5d5d;
    -webkit-text-size-adjust: 100%;
    background: url("../img/bg.png");
    word-wrap: break-word;
}
a {
    color: #84cb45;
    text-decoration: none;
    /* animation */
    transition-property: background;
    transition-duration: 0.25s;
    transition-timing-function: ease-out;
}
a:hover {
    text-decoration: underline;
}

img {
    max-width: 100%;
    height: auto;
}

ul {
    margin: 0;
    padding: 0;
}

li {
    list-style: none;
}

hr {
    border-top: 1px solid #dbdcd9;
}

#content {
    margin: 0 auto;
    max-width: 768px;
    height: 100%;
    background: url("../img/bg.png");
    padding-top: 55px;
}

#content.container {
    padding-top: 95px;
}

.container {
    max-width: 768px;
    padding: 0;
}

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



/* Header (gnavi)----------------------------------------------------*/
#header {
    position: fixed;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 999;
}
#header .inner {
    background: #faf8f8;
    box-shadow: 1px 1px 2px #d6d6d6;
    width: 100%;
    height: 55px;
    overflow: hidden;
    display: block;
    position: relative;
}

#header table {
    width: 100%;
}
#header td {
    vertical-align: middle;
    text-align: center;
    height: 55px;
    overflow: hidden;
    padding: 0;
    margin: 0;
}

#header .logo {
    margin: 0;
    padding: 0;
}
#header .logo img {
    width: 117px;
    height: 36px;
}
#header .logo span {
    display: block;
    font-size: 16px;
    line-height: 40px;
    height: 40px;
    overflow: hidden;
}
#header .logo a {
    color: #333;
}
#header .logo a:hover {
    text-decoration: none;
}
#header .l, #header .r {
    width: 65px;
    background: #333;
}
#header .l a, #header .r a {
    display: block;
    padding: 16px;
    height: 55px;
    font-size: xx-small;
    color: #fff;
}
#header .r a {
    padding-top: 12px;
    padding-right: 12px;
    padding-left: 12px;
}




/* gnav-------------------------------------------------------------*/

#modal,.menu-background {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(33,33,33,0.3);
    z-index: 999998;
    display: none;
}
#gnav {
    display: none;
    position: fixed;
    right: -240px;
    top: 83px;
    width: 240px;
    background-color: #333;
    z-index: 999999;
    box-shadow: 1px 1px 3px rgba(0,0,0,0.4);
    height: auto;
    max-height: calc(100% - 83px);
    overflow: auto;
}
@media (max-width: 961px) {
    #gnav {
        top: 63px;
    }
}
#gnav ul {
    margin: 0;
    padding: 0;
}
#gnav ul li {
    display: block;
    margin: 0;
    padding: 0;
}
#gnav ul li a {
    display: block;
    padding: 0 10px;
    color: #fff;
    font-size: 14px;
    line-height: 44px;
    height: 44px;
    overflow: hidden;
    border-bottom: 1px solid #666;
}
#gnav ul li:last-child a {
    border-bottom: 0;
}
#gnav ul li a:hover {
    text-decoration: none;
    background-color: #555;
}


/* user icos--------------------------------------------------------*/
.usericon-large {
    border: #84cc46 solid 2px;
    box-sizing: border-box;
    background: #FFF;
    -moz-border-radius: 100px;
    -webkit-border-radius: 100px;
    border-radius: 100px;
    padding: 2px;
}
.usericon-large img {
    border-radius: 100px;
}

.usericon-small {
    width: 130px;
    height: 130px;
    border: #84cc46 solid 2px;
    box-sizing: border-box;
    background: #FFF;
    -moz-border-radius: 100px;
    -webkit-border-radius: 100px;
    border-radius: 100px;
}


/* Top--------------------------------------------------------------*/
.top {
    position: relative;
    height: 330px;
    background-image: url("../img/top.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center bottom;
    margin: 0 auto;
    box-sizing: border-box;
    border: red solid 0px;
}
.copy {
    font-size: 17px;
    font-weight: bold;
    color: #FFF;
    text-shadow: 1px 1px 3px #333;
    line-height: 30px;
    padding: 15px;
}


/* Top - search--------------------------------------------------*/
#search {
    position: absolute;
    bottom: 0px;
    margin: 0 auto;
    width: 100%;
    padding: 20px;
}

#search p {
    font-size: 18px;
    padding-bottom: 10px;
    color: #FFF;
    font-weight: bold;
    text-shadow: 1px 1px 3px #333;
}

.searchform {
    position: relative;
}

.keywords {
    color :#6f6f6f;
    font-size: 20px;
    width: 77%;
    height: 43px;
    border: none;
    padding: 4px;
    border-radius: 3px;
    background: rgba(255,255,255,0.8);
}

.searchBtn {
    position: absolute;
    top: 0;
    right: 0;
    background: #84cc46;
    border-radius: 2px;
    width: 20%;
    height: 43px;
    font-size: 1.2em;
    color: #FFF;
    border-style: none;
    padding: 4px;
}


/* Section--------------------------------------------------------*/
.section {
    width: 100%;
    height: auto;
    box-sizing: border-box;
    position: relative;
}

.section h1,.section h2 {
    position: relative;
    background: #84cb45;
    line-height: 250%;
    text-indent: 10px;
    color: #fff;
    font-weight: bold;
    font-size: 15px;
    margin: 0;
    padding: 0;
}
.section h:after,.section h2:after {
    top: 100%;
    left: 30px;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(132, 203, 69, 0);
    border-top-color: #84cb45;
    border-width: 15px;
    margin-left: -15px;
}
.section-body {
    padding: 20px 12px;
}
/* bunner---------------------------------------------------------*/
.banner-item {
    margin: 8px 0;
}

/* Signup---------------------------------------------------------*/
.fb-login {
    margin:  0 auto;
    display: block;
    width: 276px;
    height: 42px;
}


/* Top - Signup---------------------------------------------------*/
.signup {
    padding: 0px 30px;
}

.signup a {
    /* color: #6f6f6f; */
    font-size: 18px;
    width: 100%;
}


/* Top - Review----------------------------------------------------*/
/* Cleaner, but slightly less support: use "50%" as value */
.top-review {
    width: 100%;
}

.top-review-keeper-icon {
    width: 25%;
    float: left;
    text-align: center;
}

.keeper-name{
    font-size: 15px;
    font-weight: bold;
}

.top-review-keeper-icon .image {
    width: 96%;
    height: 96%;
    padding: 2%;
    /* border: 2px solid #84cb45; ellipse */
    border-radius: 50%;
    overflow: hidden;
    text-align: center;
    margin: 0 auto;
    margin-bottom: 5px;
}

.top-review-keeper-icon .image img {
    width: 100%;
    height: 100%;
    max-height: 120px;
    max-width: 120px;
    border-radius: 50%;
    overflow: hidden;
}

.top-reviewmessage {
    float: right;
    vertical-align: top;
    width: 72%;
    margin-left: -180px;
}

.messageballoon {
    position: relative;
    background: #ffffff;
    width: 95%;
    margin-right: 7px;
    min-height: 120px;
    margin-left: auto;
    margin-bottom: 15px;
    padding: 5px;
    border-radius: 2px;
    box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
}

.messageballoon:after, .messageballoon:before {
    left: -20px;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.messageballoon:after {
    border-color: rgba(255, 255, 255, 0);
    border-right-color: #ffffff;
    border-width: 10px;
    margin-top: -10px;
}

.messageballoon:before {
    border-color: rgba(168, 168, 168, 0);
    border-right-color: rgba(0,0,0,0.2);
    border-width: 11px;
    margin-top: -11px;
}

/* Review - starlevel*/
.starlevel5 {
    background-image: url('../img/starlevels.png');
    background-repeat: no-repeat;
    width: 110px;                 /* 横幅星5つ分 */
    height: 18px;                 /* 高さ星5つ分 */
    margin-bottom: 5px;
}

.star50 { background-position: left top; }
.star40 { background-position: -22px top; }
.star30 { background-position: -44px top; }
.star20 { background-position: -66px top; }
.star10 { background-position: -88px top; }
.star00 { background-position: -110px top; }
.star45 { background-position: -220px top; }
.star35 { background-position: -242px top; }
.star25 { background-position: -264px top; }
.star15 { background-position: -286px top; }
.star05 { background-position: -308px top; }

.fivestar{
    width: 110px;                 /* 横幅星5つ分 */
    height: 18px;                 /* 高さ星5つ分 */
    margin-bottom: 5px;
}


/* Top - Howto--------------------------------------------------------------*/
.howto-box {
    margin: 0 auto;
    text-align: center;
}

.howto-ttl {
    font-size: 20px;
    font-weight: bold;
    margin: 10px 0 2px 0;
}

.howto-txt {
    font-size: 16px;
    line-height: 1.5em
}


/* Top - FAQ----------------------------------------------------------------*/
.faq-box {
    margin-bottom: 15px;
}

.faq-img {
    display: table-cell;
    width: 25%;
}

.faq-txt{
    display: table-cell;
    vertical-align: top;
}

.faq-q {
    font-size: 18px;
    margin: 0 0 5px 15px;
}

.faq-a {
    font-size: 16px;
    margin: 0 0 0 15px;
    line-height: 1.2em;
}


/* Mypage----------------------------------------------------------------*/
.user {
    width: 100%;
    text-align: center;
}

.user-photo > .usericon-large {
    margin: 0 auto;
    width: 120px;
    height: 120px;
}

.user-name {
    padding-top: 10px;
    font-size: 25px;
    font-weight: bold;
    text-align: center;
    display: block;
}

/*Search*/
.search-keywords {
    color :#6f6f6f;
    font-size: 15px;
    width: 77%;
    height: 40px;
    border: #6f6f6f solid 1px;
    padding: 15px;
    border-radius: 3px;
    background: rgba(255,255,255,0.5);
}

/* Keeper Status---------------------------------------------------------*/
.keeper-status{
    list-style: none;
    position: relative;
    width: 100%;
    box-sizing: border-box;
    border: #cdeb8b 1px solid;
    border-radius: 3px;
    padding: 10px;
    overflow: hidden;
    background: #FFF;
    margin-top: 10px;
    margin-bottom: 20px;
    cursor: pointer;
}

.keeper-status > .clearfix > .keeper-icon {
    width: 18%;
    height: 18%;
    float: left;
}

.keeper-status > .clearfix > .keeper-icon .image {
    width: 96%;
    height: 96%;
    padding: 2px;
    border: 2px solid #84cb45;
    border-radius: 50%;
    overflow: hidden;
    text-align: center;
    margin: 0 auto;
    margin-bottom: 5px;
}

.keeper-status > .clearfix > .keeper-icon .image img {
    border-radius: 50%;
    overflow: hidden;
}

.keeper-status > .clearfix > .left{
    width: 46%;
    float: left;
    margin-left: 2%;
    border-right: #ccc solid 1px;
    box-sizing: border-box;
}

.keeper-status > .clearfix > .right {
    width: 30%;
    float: left;
    margin-left: 3%;
    box-sizing: border-box;
    text-align: center;
    border: red solid 0px;
}

/*名前*/
.keeper-status > .clearfix > .left > .name {
    color: #84cc46;
    font-size: 13px;
    font-weight: bold;
}

/*時給*/
.keeper-status > .clearfix > .left > .paymenthour {
    font-size: 10px;
    font-weight: bold;
    background: url("../img/st-pay.png") no-repeat left top 0px;
    padding-left: 15px;
}

/*作業内容*/
.keeper-status > .clearfix > .left > .workingcontents {
    font-size: 10px;
    font-weight: bold;
    background: url("../img/st-work.png") no-repeat left top 0px;
    padding-left: 15px;
    margin-bottom: 5px;
}

.workingcontents-icon1 {
    margin-left: -5px;
}
.workingcontents-icon {
    font-size: 10px;
    font-weight: 100;
}

/*レビュー*/
.keeper-status > .clearfix > .right > .review {
    font-size: 15px;
    font-weight: bold;
}

.review span.review_prefix {
    font-size: 10px;
}

/*合計金額*/
.keeper-status > .clearfix > .right > .total {
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 0;
}

.total span.info {
    font-size: 10px;
    font-weight: 100;
}

/*レビューstarlevel*/
.status-starlevel5 {
    background-image: url('../img/status-starlevels.png');
    background-repeat: no-repeat;
    width: 80px;                 /* 横幅星5つ分 */
    height: 12px;                 /* 高さ星5つ分 */
    margin-bottom: 5px;
    margin-left: auto;
    margin-right: auto;
}

.status-star50 { background-position: left top; }
.status-star40 { background-position: -16px top; }
.status-star30 { background-position: -32px top; }
.status-star20 { background-position: -48px top; }
.status-star10 { background-position: -64px top; }
.status-star00 { background-position: -80px top; }
.status-star45 { background-position: -160px top; }
.status-star35 { background-position: -176px top; }
.status-star25 { background-position: -192px top; }
.status-star15 { background-position: -208px top; }
.status-star05 { background-position: -224px top; }


/* Calendar ----------------------------------------------------------------*/
.schedule .section-body {
    padding: 25px 10px;
}
.calendar {
    width: 100%;
    border-right: 1px solid #ccc;
    border-top: 1px solid #ccc;
}
.calendar th,
.calendar td {
    border-left: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    text-align: center;
    vertical-align: middle;
}
.calendar th {
    background-color: #eee;
    padding: 5px;
}
.calendar td {
    background-color: #fff;
    padding: 5px;
    width: 22%;
    height: 60px;
    cursor: pointer;
}
.calendar td input[type=radio] {
    width: 100%;
    height: 100%;
}
.calendar td:hover {
    background-color: #ffc;
}
.choose_schedule .calendar td.state0,
.calendar td.state2 {
    background-color: #ddd;
}
.choose_schedule .calendar td.state0:hover,
.calendar td.state2:hover {
    background-color: #ddd;
}


/* KeeperSearch ----------------------------------------------------------------*/
.search-bar {
    padding: 0 10px;
    margin-bottom: 10px;
    position: relative;
}
.search-bar .input {
    padding-right: 32px;
}
.search-bar input {
    display: block;
    border: 1px solid #ccc;
    width: 100%;
    height: 33px;
    padding: 7px;
}
.search-bar .search-button {
    display: block;
    width: 33px;
    height: 33px;
    background: url("../img/button_search.png") center center no-repeat;
    background-size: 33px 33px;
    text-indent: -9999px;
    cursor: pointer;
    position: absolute;
    right: 10px;
    top: 0;
}

.section-nav {
    position: absolute;
    right: 0;
    top: 0;
}
/* タスカジさん検索絞り込み */
.section-nav-filter {
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    padding-right: 10px;
}
.refinement-accordion h2:before {
    content: "\25BC"; /* ▼ */
    padding-right: 0.2em;
}
.filter-button {
    margin-top: 7px;
    /* 領域全体にボタンを広げる */
    padding-right: 100%;
    width: 25px;
    height: 25px;
    background: url("../img/filter-button.png") no-repeat center right;
    border: none;
    text-indent: -9999px;
    cursor: pointer;
}
.filter-button.on {
    background-image: url("../img/filter-button-on.png");
}

/*Accordion*/
input[type="checkbox"].on-off{
    display: none;
}

.refinement-accordion ul {
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    margin: 0;
    padding: 0;
    background: #FFF;
}

.refinement-accordion li {
    margin: 20px;
}

.refinement-accordion p {
    font-weight: bold;
    font-size: 15px;
    margin-bottom: 2px;
}

input[type="checkbox"].on-off + ul{
    height: 0;
    overflow: hidden;
}

input[type="checkbox"].on-off:checked + ul{
    height: auto;
    border-bottom: #84cb45 solid 4px;
}

ul.dropdown-menu {
    margin-top: -15px;
}


/*RequestDtail---------------------------------------------------------------*/
.request-day {
    font-weight: bold;
    background: url("../img/request-day.png") no-repeat left top 1px;
    padding-left: 20px;
    margin-left: 8px;
    margin-bottom: 15px;
}

/*message*/
.message-icon-image {
    width: 96%;
    height: 96%;
    padding: 2px;
    border: 2px solid #84cb45;
    border-radius: 50%;
    overflow: hidden;
    text-align: center;
    margin: 0 auto;
    margin-bottom: 5px;
}
.message-icon-image img{
    border-radius:100%;
}

.message-keeper time,
.message-client time {
    margin: 0 20px;
}


/* Message - Keeper----------*/
.message-keeper {
    width: 70%;
    margin-left: auto;
    text-align: right;
    margin-bottom: 10px;
}

.message-keeper-icon {
    width: 20%;
    float: right;
}

.message-keeper-left {
    float: right;
    width: 80%;
}

.message-keeper-left  p{
    font-weight: bold;
    margin-right: 12px;
    margin-bottom: 0;
}

.keeper-balloon {
    position: relative;
    background: #dbf1b5;
    border: 1px solid #9bf556;
    border-radius: 3px;
    padding: 10px;
    margin-right: 10px;
    text-align: left
}
.keeper-balloon:after, .keeper-balloon:before {
    left: 100%;
    top: 10px;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.keeper-balloon:after {
    border-color: rgba(224, 255, 171, 0);
    border-left-color: #e2efca;
    border-width: 5px;
    margin-top: -5px;
}
.keeper-balloon:before {
    border-color: rgba(155, 245, 86, 0);
    border-left-color: #9bf556;
    border-width: 6px;
    margin-top: -6px;
}

/*message-client----------*/
.message-client  {
    border: green solid 0px;
    width: 70%;
    margin-bottom: 10px;
}

.message-client-icon {
    width: 20%;
    float: left;
}

.message-client-left {
    float: left;
    width: 80%;
}

.message-client-left  p{
    margin-left: 12px;
    margin-bottom: 0;
    font-weight: bold;
}
.client-balloon {
    position: relative;
    background: #fffbd9;
    border: 1px solid #f5df89;
    border-radius: 3px;
    padding: 10px;
    margin-left: 10px;
}
.client-balloon:after, .client-balloon:before {
    right: 100%;
    top: 10px;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.client-balloon:after {
    border-color: rgba(255, 251, 217, 0);
    border-right-color: #fffbd9;
    border-width: 5px;
    margin-top: -5px;
}
.client-balloon:before {
    border-color: rgba(245, 223, 137, 0);
    border-right-color: #f5df89;
    border-width: 6px;
    margin-top: -6px;
}


/* Profile-------------------------------------------------------------------*/
.profile {
    background: none;
    border-bottom: #ccc solid 1px;
    padding: 10px 0;
}

.profile:last-child {
    border: none;
}

.profile > label {
    font-size: 14px;
    color: #84cb45;
    font-weight: bold;
    margin-bottom: 3px;
    margin-top: 0;
}

.profile p {
    margin-left: 14px;
    margin-bottom: 0;
}

.keeper-profile-top{
    margin-bottom: 15px;
    font-size: 16px;
    font-weight: bold;
}

.profile-review {
    float: left;
    text-align: center;
    width: 49%;
    border-right: #ccc solid 1px;
    background: url("../img/profile-review.png") no-repeat center center;
}

.profile-star {
    margin: 0 auto;
}

.profile-FB {
    float: right;
    text-align: center;
    width: 49%;
    background: url("../img/profile-FBlike.png") no-repeat center center;
}

.profile-request{
    float: left;
    border-right: #ccc solid 1px;
    text-align: center;
    width: 49%;
    background: url("../img/profile-request.png") no-repeat center center;
}

.profile-cancel {
    float: right;
    text-align: center;
    width: 49%;
    background: url("../img/profile-cancel.png") no-repeat center center;
}

.table>tbody>tr>td {
    border: none;
}

/* Voice---------------------------------------------------------------------*/
.voice-review {
    width: 100%;
}

.voice-icon {
    width: 25%;
    float: left;
    text-align: center;
}

.voice-name{
    font-size: 15px;
    font-weight: bold;
}

.voice-icon .image {
    width: 96%;
    height: 96%;
    padding: 2%;
    border: 2px solid #84cb45;
    border-radius: 50%;
    overflow: hidden;
    text-align: center;
    margin: 0 auto;
    margin-bottom: 5px;
}

.voice-icon .image img {
    border-radius: 50%;
    overflow: hidden;
}

.voice-message {
    float: right;
    vertical-align: top;
    width: 72%;
    margin-left: -180px;
}

.voice-balloon {
    position: relative;
    background: #ffffff;
    width: 95%;
    margin-right: 7px;
    margin-left: auto;
    margin-bottom: 15px;
    padding: 10px;
    border-radius: 2px;
    box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
}

.voice-balloon:after, .messageballoon:before {
    right: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.voice-balloon:after {
    border-color: rgba(255, 255, 255, 0);
    border-right-color: #ffffff;
    border-width: 12px;
    margin-top: -12px;
}
.voice-balloon:before {
    border-color: rgba(168, 168, 168, 0);
    border-right-color: #a8a8a8;
    border-width: 11px;
    margin-top: -11px;
}


/* Request-------------------------------------------------------------------*/
.nav-justified {
    padding: 15px 0;
}

.workingcontents-request {
    margin-bottom: 15px;
}

.workingcontents-request > p {
    color: #84cb45;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 5px;
}

/* Common--------------------------------------------------------------------*/
/*notice - red*/
/*.notice {
  margin: 0;
  margin-bottom: 20px;
  padding: 0;
  list-style: none;
}
.notice li {
  color: #e63737;
  list-style: none;
  background-image: url("../img/notice.png");
  background-position:left top 2px;
  background-repeat:no-repeat;
  padding-left:20px;
  line-height:1.5;
  margin-left:2px;
}
.notice li a {
  color: #e63737;
}
*/
/*notice - green&yellow*/
.request-recents,
.bg-warning {
    background: url("../img/requestcomment.png") left 10px top 13px no-repeat;
    padding: 10px;
    padding-left: 30px;
    line-height: 1.5;
    margin-left: 2px;
    border-radius: 3px;
    border: #efd364 solid 1px;
}
.request-recents,
.notice {
    margin-bottom: 10px;
}
.notice a {
    color: #e63737;
}
.mailto{
    color: #5d5d5d!important;
}

/*Table*/
.tables {
    width: 100%;
    box-sizing: border-box;
    border: #cdeb8b 1px solid;
    border-radius: 3px;
    padding: 10px;
    overflow: hidden;
    background: #FFF;
}

.table > .table {
    margin-bottom: 0;
}

/*Checkbox*/
input[type=checkbox].css-checkbox {
    display:none;
}

.workingcontents-request input[type=checkbox].css-checkbox + label.checkbox-label,
input[type=checkbox].css-checkbox + label.css-label {
    padding-left:24px;
    height:19px;
    display:inline-block;
    line-height:19px;
    background-repeat:no-repeat;
    background-position: 0 0;
    vertical-align:middle;
    cursor:pointer;
    font-weight: 100;
    margin-left: 10px;
}
.workingcontents-request input[type=checkbox].css-checkbox + label.checkbox-label {
    margin-left: 0;
}

.workingcontents-request input[type=checkbox].css-checkbox:checked + label.checkbox-label,
input[type=checkbox].css-checkbox:checked + label.css-label {
    background-position: 0 -19px;
}

.workingcontents-request label.checkbox-label,
label.css-label {
    background-image:url("../img/checkbox.png");
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/*Radio Button*/
input[type=radio].css-radio {
    display:none;
}

.workingcontents-request input[type=radio].css-radio + label.radio-label,
input[type=radio].css-radio + label.css-label {
    padding-left:24px;
    height:19px;
    display:inline-block;
    line-height:19px;
    background-repeat:no-repeat;
    background-position: 0 0;
    vertical-align:middle;
    cursor:pointer;
    font-weight: 100;
    margin-left: 10px;
}
.workingcontents-request input[type=radio].css-radio + label.radio-label {
    margin-left: 0;
}

.workingcontents-request input[type=radio].css-radio:checked + label.radio-label,
input[type=radio].css-radio:checked + label.css-label {
    background-position: 0 -19px;
}

.workingcontents-request label.radio-label,
label.css-label {
    background-image:url("../img/checkbox.png");
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}


input[type=file] {
    max-width: 100%;
}
.auth-confirmed {
    background: url("../img/confirmation.png") no-repeat right 15px top;
    min-height: 30px;
    padding-right: 50px;
}

.auth-unconfirmed {
    background: url("../img/unconfirmed.png") no-repeat right 15px top;
    min-height: 30px;
    padding-right: 50px;
}


/* Icons---------------------------------------------------------------------*/
.icon {
    position: relative;
    top: 2px;
    display: inline-block;
    line-height: 1;
}

.confirmation {
    background: url("../img/confirmation.png") no-repeat center top;
    width: 30px;
    height: 30px;
}

.unconfirmed {
    background: url("../img/unconfirmed.png") no-repeat center top;
    width: 30px;
    height: 30px;
}

.cleaning-on {
    background: url("../img/i-cleaning-on.png") no-repeat center center;
    width: 15px;
    height: 15px;
}

.organize-on {
    background: url("../img/i-organize-on.png") no-repeat center center;
    width: 15px;
    height: 15px;
}

.cooking-on {
    background: url("../img/i-cooking-on.png") no-repeat center center;
    width: 15px;
    height: 15px;
}

.cook_ahead-on {
    background: url("../img/i-cook_ahead-on.png") no-repeat center center;
    width: 15px;
    height: 15px;
}

.laundry-on {
    background: url("../img/i-laundry-on.png") no-repeat center center;
    width: 15px;
    height: 15px;
}

.pet-on {
    background: url("../img/i-pet-on.png") no-repeat center center;
    width: 15px;
    height: 15px;
}

.shopping-on {
    background: url("../img/i-shopping-on.png") no-repeat center center;
    width: 15px;
    height: 15px;
}

.childcare-on {
    background: url("../img/i-child-on.png") no-repeat center center;
    width: 15px;
    height: 15px;
}


.cleaning-off {
    background: url("../img/i-cleaning-off.png") no-repeat center center;
    width: 15px;
    height: 15px;
}

.organize-off {
    background: url("../img/i-organize-off.png") no-repeat center center;
    width: 15px;
    height: 15px;
}

.cooking-off {
    background: url("../img/i-cooking-off.png") no-repeat center center;
    width: 15px;
    height: 15px;
}

.cook_ahead-off {
    background: url("../img/i-cook_ahead-off.png") no-repeat center center;
    width: 15px;
    height: 15px;
}

.laundry-off {
    background: url("../img/i-laundry-off.png") no-repeat center center;
    width: 15px;
    height: 15px;
}

.pet-off {
    background: url("../img/i-pet-off.png") no-repeat center center;
    width: 15px;
    height: 15px;
}

.shopping-off {
    background: url("../img/i-shopping-off.png") no-repeat center center;
    width: 15px;
    height: 15px;
}

.childcare-off {
    background: url("../img/i-child-off.png") no-repeat center center;
    width: 15px;
    height: 15px;
}



.mcal {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border: 1px solid #fff;
}
.mcal th,
.mcal td {
    border-left: 1px solid #fff;
    border-bottom: 1px solid #fff;
    font-weight: normal;
    text-align: left;
    vertical-align: top;
}
.mcal th:first-child,
.mcal td:first-child {
    border-left: 0;
}
.mcal tr:last-child th,
.mcal tr:last-child td {
    border-bottom: 0;
}
.mcal th {
    padding: 5px;
    background: #eee;
    text-align: center;
    width: 14.3%;
}
.mcal td {
    font-size: 9px;
    height: 44px;
    padding: 2px;
}
.mcal td .date {
    display: block;
}
.mcal td .s {
    font-size: 9px;
    display: block;
    color: #fff;
    background-color: #84cb45;
    border-radius: 5px;
    margin-bottom: 2px;
    padding: 1px;
}
.mcal td .s.up {
    background-color: #f55;
    color: #fff;
}
.mcal td .s.down {
    background-color: #ddd;
    color: #999;
}


.review-choise {
    margin-bottom: 10px;
}
.review-choise label {
    font-size: 11px;
}
.review-choice {
    margin-bottom: 10px;
}
.review-choice label {
    font-size: 11px;
}


.rating-input {
    text-align: center;
}
.rating-input span {
    font-size: 30px;
    padding-left: 10px;
    padding-right: 10px;
}

.errorMessage {
    color: #F00;
}
.errorMessage a{
    color: #F00!important;
}

/* for form required item */
label.required:after {
    content: '必須';
    margin-left: 0.2em;
    color: red;
}
label.required_en:after {
    content: 'Required';
    margin-left: 0.2em;
    color: red;
}


/* アイコンに付加した補足をテキスト表示 */
label .glyphicon {
    font-size: x-small;
    margin-left: 0.2em;
}
label .glyphicon:after {
    content: attr(title);
}

.profile-setting-photo{
    max-height: 200px;
    max-width: 200px;
}