/*category_set*/
#main_contents {
  margin: 0 auto; }
  @media screen and (min-width: 768px) {
    #main_contents {
      width: 127.5rem;
      padding: 4rem 0 18rem !important; } }
  @media screen and (max-width: 767px) {
    #main_contents {
      width: 36rem;
      padding: 4rem 0 8rem !important; } }

/**/
#sort_section {
  position: relative;
  padding: 0;
  width: 100%;
  display: flex;
  flex-direction: column; }
  @media screen and (min-width: 768px) {
    #sort_section {
      margin-top: 5rem; } }
  @media screen and (max-width: 767px) {
    #sort_section {
      margin-top: 3rem; } }

@media screen and (min-width: 768px) {
  #btn_tgl {
    margin: 0 0 0 auto; } }
@media screen and (max-width: 767px) {
  #btn_tgl {
    width: 100% !important; } }

#btn_tgl .sort_icon {
  position: absolute !important;
  display: inline-block;
  transition: ease-out 0.6s all;
  top: 50%;
  background: url("../../img/icon_sort_w.svg") center center no-repeat;
  background-size: contain; }
  @media screen and (min-width: 768px) {
    #btn_tgl .sort_icon {
      margin-top: -7px;
      left: 20px;
      width: 22px;
      height: 15px; } }
  @media screen and (max-width: 767px) {
    #btn_tgl .sort_icon {
      margin-top: -0.7rem;
      left: 2rem;
      width: 2.2rem;
      height: 1.5rem; } }

@media screen and (min-width: 768px) {
  #btn_tgl:hover .sort_icon {
    background: url("../../img/icon_sort_k.svg") center center no-repeat;
    background-size: contain; } }

#btn_tgl .tgl_icon {
  position: absolute !important;
  display: inline-block;
  transition: ease-out 0.6s all;
  top: 50%; }
  @media screen and (min-width: 768px) {
    #btn_tgl .tgl_icon {
      margin-top: -8px;
      right: 20px;
      width: 16px;
      height: 16px; } }
  @media screen and (max-width: 767px) {
    #btn_tgl .tgl_icon {
      margin-top: -0.8rem;
      right: 2rem;
      width: 1.6rem;
      height: 1.6rem; } }

@media screen and (min-width: 768px) {
  #btn_tgl:hover .tgl_icon::after,
  #btn_tgl:hover .tgl_icon::before {
    background: #222; } }

#btn_tgl .tgl_icon::after,
#btn_tgl .tgl_icon::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  display: inline-block;
  width: 100%;
  height: 1px;
  background: #fff; }

#btn_tgl .tgl_icon::before {
  transform: rotate(90deg); }

#btn_tgl.open .tgl_icon::before {
  transform: rotate(0deg); }

#sort_box {
  position: relative;
  width: 100%;
  background: #F4F4F4;
  display: none; }
  @media screen and (min-width: 768px) {
    #sort_box {
      padding: 4rem; } }
  @media screen and (max-width: 767px) {
    #sort_box {
      padding: 3rem 2rem; } }

#sort_box dl {
  position: relative;
  width: 100%;
  border-bottom: #D9D9D9 1px solid; }
  @media screen and (min-width: 768px) {
    #sort_box dl {
      display: flex;
      justify-content: space-between;
      padding: 1.5rem 1rem; } }

#sort_box dl:nth-of-type(1) {
  position: relative;
  width: 100%;
  border-top: #D9D9D9 1px solid; }

#sort_box dl dt {
  position: relative; }
  @media screen and (min-width: 768px) {
    #sort_box dl dt {
      width: 20rem;
      padding: 0 1rem; } }
  @media screen and (max-width: 767px) {
    #sort_box dl dt {
      width: 100%;
      padding: 1.5rem 0rem; } }

#sort_box dl dd {
  position: relative; }
  @media screen and (min-width: 768px) {
    #sort_box dl dd {
      width: 91rem;
      display: block !important; } }
  @media screen and (max-width: 767px) {
    #sort_box dl dd {
      width: 100%;
      padding: 0 0 1.5rem;
      display: none; } }

#sort_box dl dt p,
#sort_box dl dd label {
  position: relative;
  letter-spacing: 0.00em;
  color: #0C0C0C;
  font-weight: 400; }
  @media screen and (min-width: 768px) {
    #sort_box dl dt p,
    #sort_box dl dd label {
      line-height: 1.429em;
      font-size: 14px;
      /*font-size: divceil($fs, 10, rem);*/
      /*
      font-size: divceil(16, 10, rem);
      line-height: divceil(22, 10, rem);
      */ } }
  @media screen and (max-width: 767px) {
    #sort_box dl dt p,
    #sort_box dl dd label {
      line-height: 1.5em;
      font-size: 1.6rem; } }

#sort_box dl dt p {
  font-weight: 700; }

#sort_box dl dd ul {
  position: relative;
  width: 100%;
  display: flex;
  flex-wrap: wrap; }
  @media screen and (min-width: 768px) {
    #sort_box dl dd ul {
      gap: 1.5rem 0; } }
  @media screen and (max-width: 767px) {
    #sort_box dl dd ul {
      flex-direction: column;
      gap: 1rem 0; } }

#sort_box dl dd ul li {
  position: relative; }
  @media screen and (min-width: 768px) {
    #sort_box dl dd ul li {
      width: 22.5rem; } }
  @media screen and (max-width: 767px) {
    #sort_box dl dd ul li {
      width: 100%; } }

#sort_box dl#sort_region dd ul {
  position: relative; }
  @media screen and (min-width: 768px) {
    #sort_box dl#sort_region dd ul {
      width: 67.5rem; } }

#sort_box dl#sort_scale dd ul li {
  position: relative; }
  @media screen and (min-width: 768px) {
    #sort_box dl#sort_scale dd ul li {
      width: 45rem; } }

#sort_box dl dd input[type=checkbox] {
  display: inline-block; }

#sort_box dl dd input[type=checkbox] + label {
  position: relative;
  display: inline-block;
  cursor: pointer; }

#sort_box dl dd input[type=checkbox] {
  display: none;
  margin: 0; }

#sort_box dl dd input[type=checkbox] + label {
  padding: 0 0 0 2.5rem; }

#sort_box dl dd input[type=checkbox] + label::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 1.6rem;
  height: 1.6rem;
  margin-top: -0.8rem;
  background: #B3B3B3;
  border-radius: 0.2rem; }

#sort_box dl dd input[type=checkbox]:checked + label::before {
  background: #CC0000;
  border-right: #F4F4F4 solid 1px;
  border-bottom: #F4F4F4 solid 1px; }

#sort_box dl dd input[type=checkbox]:checked + label::after {
  content: "";
  position: absolute;
  top: 50%;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: block; }

#sort_box dl dd input[type=checkbox]:checked + label::after {
  left: 0.3rem;
  width: 1rem;
  height: 0.6rem;
  margin-top: -0.6rem;
  border-left: 1px solid #fff;
  border-bottom: 1px solid #fff;
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg); }

#sort_box .btn_set {
  position: relative;
  width: 100%;
  display: flex;
  align-items: stretch; }
  @media screen and (min-width: 768px) {
    #sort_box .btn_set {
      justify-content: center !important;
      gap: 2.5rem;
      margin-top: 4rem; } }
  @media screen and (max-width: 767px) {
    #sort_box .btn_set {
      flex-direction: column;
      gap: 2rem;
      margin-top: 3rem; } }

#sort_box .btn_set .btn_general,
#sort_box .btn_set .btn_k {
  position: relative; }
  @media screen and (min-width: 768px) {
    #sort_box .btn_set .btn_general,
    #sort_box .btn_set .btn_k {
      width: 315px;
      height: 50px;
      margin: 0 !important; } }
  @media screen and (max-width: 767px) {
    #sort_box .btn_set .btn_general,
    #sort_box .btn_set .btn_k {
      width: 32rem;
      height: 5rem;
      margin: 0; } }

#sort_box dl dt .tgl_icon {
  position: absolute !important;
  transition: ease-out 0.6s all;
  top: 50%; }
  @media screen and (min-width: 768px) {
    #sort_box dl dt .tgl_icon {
      display: none !important; } }
  @media screen and (max-width: 767px) {
    #sort_box dl dt .tgl_icon {
      display: inline-block;
      margin-top: -0.8rem;
      right: 2rem;
      width: 1.6rem;
      height: 1.6rem; } }

#sort_box dl dt .tgl_icon::after,
#sort_box dl dt .tgl_icon::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  display: inline-block;
  width: 100%;
  height: 1px;
  background: #222; }

#sort_box dl dt .tgl_icon::before {
  transform: rotate(90deg); }

#sort_box dl.open dt .tgl_icon::before {
  transform: rotate(0deg); }

@media screen and (max-width: 767px) {
  #sort_box dl dt {
    cursor: pointer; } }

#project_list {
  margin: 0; }
  @media screen and (min-width: 768px) {
    #project_list {
      padding: 4rem 0 0; } }
  @media screen and (max-width: 767px) {
    #project_list {
      padding: 4rem 0 0; } }

#project_count {
  margin-bottom: 20px;
  font-weight: bold;
  font-size: 2rem; }

@media screen and (min-width: 768px) {
  .project_list_box a {
    height: auto; } }

/*
#project_list.default .project_list_box a:nth-of-type(n+11) {
	display: none;
}
*/
#main_contents .end_btn {
  position: relative;
  width: 100%;
  display: flex;
  justify-content: center !important; }
  @media screen and (min-width: 768px) {
    #main_contents .end_btn {
      margin-top: 6rem; } }
  @media screen and (max-width: 767px) {
    #main_contents .end_btn {
      margin-top: 4rem; } }

#main_contents .end_btn.mora_open {
  display: none !important; }

#main_contents .end_btn .btn_general {
  position: relative; }
  @media screen and (min-width: 768px) {
    #main_contents .end_btn .btn_general {
      width: 315px;
      height: 50px; } }
  @media screen and (max-width: 767px) {
    #main_contents .end_btn .btn_general {
      width: 32rem;
      height: 5rem; } }

@media screen and (min-width: 768px) {
  #main_contents .end_btn .btn_general .arrow {
    margin-top: -10px; } }
@media screen and (max-width: 767px) {
  #main_contents .end_btn .btn_general .arrow {
    margin-top: -1rem; } }

#main_contents .end_btn .btn_general .arrow::after {
  transform: rotate(135deg) !important; }
