body {
  /*background: $thin-yellow;*/
  background: $bg;
  color: $font-color;
}
a {
    color: $black;
    
    &:hover {
      text-decoration: none;
    }
}

.l-contents {
    margin: 0px;

    &__top {
      position: relative;
    }

    &__disp {
      max-width: $cwidth;
      margin: 0px auto;
    }
}

.active {
  background-color: $active;
}

.require {
  border: 1px solid $require;
  color: $require;
  padding: 2px 3px;
  margin-left: 5px;
}

.require_applicable {
  border: 1px solid $require_applicable;
  color: $require_applicable;
  padding: 2px 3px;
  margin-left: 5px;
}
div[class*=modal-contents-set] {
  width: 70% !important;
  margin: 0 ;
  padding: 10px 20px ;
  border: 2px solid #aaa ;
  background: #fff ;
  position: fixed ;
  display: none ;
  z-index: 2 ;

  & table {

    & tr {}

    & td {

      & a {
        margin: 0 auto;
      }
    }
  }

  & .title_own {
    position: relative;
    display: inline-block;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: lightyellow;

    & span {
      position: absolute;
      display: inline-block;
      left: 0;
      top: 50%;
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%);
      width :90px;
      text-align:center;
    }
  }

  & .title_other {
    position: relative;
    display: inline-block;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: lightgreen;

    & span {
      position: absolute;
      display: inline-block;
      left: 0;
      top: 50%;
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%);
      width :90px;
      text-align:center;
    }
  }

  & .title_mansion {
    position: relative;
    display: inline-block;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: lightblue;

    & span {
      position: absolute;
      display: inline-block;
      left: 0;
      top: 50%;
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%);
      width :90px;
      text-align:center;
    }
  }
}
div[class*=modal-contents] {
  width: 50% ;
  margin: 0 ;
  padding: 10px 20px ;
  border: 2px solid #aaa ;
  background: #fff ;
  position: fixed ;
  display: none ;
  z-index: 2 ;
}

#modal-overlay {
  z-index: 1 ;
  display: none ;
  position: fixed ;
  top: 0 ;
  left: 0 ;
  width: 100% ;
  height: 120% ;
  background-color: rgba( 0,0,0, 0.75 ) ;
}

.cal_picker {
  background-image: url(#{$admin_img_path}icon_calendar.png);
  background-repeat: no-repeat;
  background-position: right 8% center;
}

.button-link {
  color: #00f ;
  text-decoration: underline ;
}

.button-link:hover {
  cursor: pointer ;
  color: #f00 ;
}

.regist__div {
  text-align: center;
  padding: 10px 0;
  background: linear-gradient(#{$gd-direction}, $gd-start, $gd-end); 
}

#council_presence_area, #council_cost_area {
  display: none;
}

#spring_area, #spring_cost_area, #spring_kind_area {
  display: none;
}

#land_condition1_area, #land_condition2_area, #land_condition3_area {
  display: none;
}

#land_status_area {
  display: none;
}

#land_delivery_area {
  display: none;
}

#land_condition_area1, #land_condition_area2 {
  display: none;
}

#road_burden_area1, #road_burden_area2 {
  display: none;
}

#easement_area {
  display: none;
}

#set_area {
  display: none;
}

#city_plan_area {
  display: none;
}

#classfication_area {
  display: none;
}

#event_schedule_area1, #event_schedule_area2 {
  display: none;
}

.u-radio {
  display: none;

    &:checked + label:after {
      border: 1px solid $light-green;
    }

    &__label {
        box-sizing: border-box;
        -webkit-transition: background-color 0.2s linear;
        transition: background-color 0.2s linear;
        position: relative;
        display: inline-block;
        margin: 0px 20px 0px 0px;
        padding: 5px 12px 5px 42px;
        border-radius: 8px;
        vertical-align: middle;
        cursor: pointer;

        &:before {
            -webkit-transition: opacity 0.2s linear;
            transition: opacity 0.2s linear;
            position: absolute;
            top: 50%;
            left: 19px;
            display: block;
            margin-top: -6px;
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background-color: $light-green;
            content: '';
            opacity: 0;
            input[type=radio]:checked + & {
            opacity: 1;
            }
        }

        &:after {
            -webkit-transition: border-color 0.2s linear;
            transition: border-color 0.2s linear;
            position: absolute;
            top: 50%;
            left: 15px;
            display: block;
            margin-top: -10px;
            width: 16px;
            height: 16px;
            border: 1px solid $light-glay;
            border-radius: 8px;
            content: '';
        }
    }
}

.u-checkbox {
  position: relative;
  word-break: break-all;
  margin-bottom: 0px;
  padding: 5px 0px;

  &__obj {
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    border-radius: 0;
    outline: none;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;

    & + span:before, + span:after {
      position: absolute;
      top: 2px;
      // left: 14px;
      left: 0px;
      display: inline-block;
      content: '';
      box-sizing: border-box;
    }
    & + span:before {
      z-index: 0;
      background-color: transparent;
      width: 16px;
      height: 16px;
      border: 1px $light-glay solid;
      border-radius: 5px;
    }

    & + span:after {
      z-index: 1;
      margin: 5px 8px;
      width: 6px;
      height: 9px;
    }

    &:checked + span::before {
      background-color: $light-green;
    }
    &:checked + span::after {
      border: 2px solid #fff;
      border-width: 0 2px 2px 0;
      -webkit-transform: rotate(45deg);
          -ms-transform: rotate(45deg);
              transform: rotate(45deg);
      position: absolute;
      // left: 11px;
      left: -3px;
      top: 0px;
    }
  }

  &__text {
    display: inline-block;
    position: relative;
    // padding: 0 30px 0 42px;
    padding: 0 15px 0 20px;
  }
}

.btn_ {
  &search {
    &::before {
      background-image: url(#{$admin_img_path}icon_search.png);
    }
  }

  &reference {
    &::before {
      background-image: url(#{$admin_img_path}icon_reference.png);
    }
  }

  &decision {
    &::before {
      background-image: url(#{$admin_img_path}icon_arrow_right.png);
    }
  }

  &position {
    &::before {
      background-image: url(#{$admin_img_path}icon_map.png);
    }
  }

  &allcheck {
    width: 180px !important;
    &::before {
      background-image: url(#{$admin_img_path}icon_checked.png);
    }
  }

  &imagesave {
    width: 120px !important;
    &::before {
      background-image: url(#{$admin_img_path}btn_register_green.png);
      left: 5px !important;
    }
  }

  &search, &reference, &decision, &position, &allcheck, &imagesave {
    margin: 5px 10px;
    border-radius: 5px;
    // background-color: $light-green;
    background: linear-gradient(#{$green_btn_direction}, $green_btn_start, $green_btn_end);
    border: 1px solid $green_btn_text;
    color: $green_btn_text;
    padding: 10px 30px;
    position: relative;
    width: 180px;
    cursor: pointer;

    &::after {
      display: block;
      width: 8px;
      height: 8px;
      // border-top: solid 2px $white;
      // border-right: solid 2px $white;
      -webkit-transform: rotate(45deg);
      transform: rotate(45deg);
      content: ' ';
      position: absolute;
      right: 5px;
      top: 17px;
    }

    &::before {
      content: '';
      display: inline-block;
      width: 20px;
      height: 20px;
      background-repeat: no-repeat;
      background-size: contain;
      vertical-align: middle;
      left: 15px;
      top: 10px;
      position: absolute;
    }
  }

  &gray {
    margin: 5px 10px;
    border-radius: 5px;
    // background-color: $light-green;
    // background: linear-gradient(#{$green_btn_direction}, $green_btn_start, $green_btn_end);
    background-color: $gray_btn_bg;
    border: 1px solid $gray_btn_text;
    color: $gray_btn_text;
    padding: 10px 30px;
    position: relative;
    width: 180px;
    cursor: pointer;

    &::after {
      display: block;
      width: 8px;
      height: 8px;
      -webkit-transform: rotate(45deg);
      transform: rotate(45deg);
      content: ' ';
      position: absolute;
      right: 5px;
      top: 17px;
    }

    &::before {
      content: '';
      display: inline-block;
      width: 20px;
      height: 20px;
      background-repeat: no-repeat;
      background-size: contain;
      vertical-align: middle;
      left: 15px;
      top: 10px;
      position: absolute;
    }
  }
  &gray::before {
    background-image: url(#{$admin_img_path}icon_plus_gray.png);
  }
  &pink {
    background-color: #fc3698;
    border: 1px solid #fc3698;
    color: $white;
    border-radius: 5px;
  }
}


.mt5 { margin-top: 5px; }
.mt10 { margin-top: 10px; }
.mr5 { margin-right: 5px; }
.mr10 { margin-right: 10px; }
.mb5 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.ml5 { margin-left: 5px; }
.ml10 { margin-left: 10px; }

.w50  { width: 50px;  }
.w65  { width: 65px;  }
.w75  { width: 75px;  }
.w80  { width: 80px;  }
.w85  { width: 85px;  }
.w100 { width: 100px; }
.w115 { width: 115px; }
.w120 { width: 120px; }
.w125 { width: 125px; }
.w150 { width: 150px; }
.w155 { width: 155px; }
.w160 { width: 160px; }
.w175 { width: 175px; }
.w200 { width: 200px; }
.w210 { width: 210px; }
.w220 { width: 220px; }
.w230 { width: 230px; }
.w250 { width: 250px; }
.w300 { width: 300px; }
.w350 { width: 350px; }
.w400 { width: 400px; }
.w450 { width: 450px; }
.w500 { width: 500px; }

.sold_disp_area {
  height: 500px;
  overflow: auto;
}
.sold_list {
  width:100%;
  table-layout: fixed;
  background-color: $table_bg;

  & th, td {
      padding: 5px 10px 5px 10px;
      border: 1px solid $table_border;
  }
  & tr {
    height: 35px;
  }
}
.sold_list_con {
  width:100%;
  table-layout: fixed;
  background-color: $table_bg;

  & tr:nth-child(odd) td {
    background: #D5EEF2;
  }

  & th, td {
      padding: 5px 10px 5px 10px;
      border: 1px solid $table_border;
  }
  & tr {
    height: 35px;
  }
}