@media (max-width: 769px) {
  .sec {
    margin-bottom: 50px;
    font-size: 13px;
  }
  img {
    -webkit-touch-callout:none;
      -webkit-user-select:none;
      -moz-touch-callout:none;
      -moz-user-select:none;
      touch-callout:none;
      user-select:none;
    }
    img {
      user-drag: none;
      -webkit-user-drag: none;
      -moz-user-select: none;
    }
  #CONTENTS.sec {
    margin-bottom: 200px;
  }

  #RECRUIT__CONCEPT.sec,
  #NEWS.sec,
  .sec.contact,
  #PROJ.sec {
    margin-bottom: 80px;
  }

  #NEWS__POST.sec,
  #CONTACTINT.sec.contact,
  .sec.contactform {
    margin-bottom: 50px;
  }

  #BUSINESS__INTRO.sec {
    margin-bottom: 70px;
  }

  #BUSINESS.sec,
  .sec.HR {
    margin-bottom: 0;
  }

  h2.base__ttl {
    font-size: 30px;
    padding-left: 43px;
    margin-bottom: 30px;
    margin-left: -6%;
  }

  h2.base__ttl::before {
    width: 30px;
  }

  h2.center__ttl {
    font-size: 20px;
    margin-bottom: 40px;
    padding-top: 30px;
    line-height: 2;
  }

  h2.center__ttl span {
    font-size: 18px;
    margin-top: 30px;
  }

  h2.center__ttl.TLine span {
    font-size: 20px;
    margin-top: 0;
  }

  h2.center__ttl::before {
    top: -100px;
    height: 100px;
  }

  h2.center__ttl__bottom {
    font-size: 12px;
    margin-bottom: 60px;
  }

  h2.center__ttl__bottom span {
    font-size: 50px;
  }

  h2.center__ttl__bottom::after {
    bottom: -45px;
    height: 30px;
  }

  h2.nobdr__ttl {
    font-size: 20px;
    margin-bottom: 50px;
  }

  h3.interview__ttl {
    font-size: 30px;
  }

  .outer {
    margin: auto;
  }

  .inner {
    max-width: initial;
    margin: auto 2%;
  }

  .inner.wide {
    max-width: initial;
  }

  .basic__inner {
    max-width: initial;
    margin: auto 5%;
  }

  .SubImage {
    height: 30vh;
    margin-bottom: 50px;
  }

  .SubImage img,
  .SubImage picture {
    -o-object-position: center;
    object-position: center;
    font-family: "object-fit: cover; object-position: center;";
  }

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

    HERO

    -------------------------------- */
  .hero {
    position: relative;
    width: calc(100% - 40px);
    height: 29.5vh;
    margin-left: 45px;
  }

  .post__HR .hero {
    height: auto;
  }

  .recruit__HR .hero__slide__photo img,
  .recruit__HR .hero__slide__photo picture {
    -o-object-position: center;
    object-position: center;
    font-family: "object-fit: cover; object-position: center;";
  }

  h1.hero__ttl {
    left: -30px;
    bottom: -48px;
    font-size: 60px;
    letter-spacing: 0;
    text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff;
  }

  h1.hero__ttl span {
    font-size: 16px;
  }

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

    NEWS

    -------------------------------- */
  .flexed.newswrap {
    display: block;
  }

  .news__left {
    width: 100%;
    margin-top: 90px;
  }

  .news__categories {
    margin-bottom: 80px;
  }

  .news__categories ul li {
    margin-bottom: 18px;
  }

  .news__list .news__box {
    width: 106%;
    margin-bottom: 50px;
  }

  .news__list .news__box a::before {
    top: 12px;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  .news__list .news__box a::after {
    top: 9px;
    -webkit-transform: translateY(0) rotate(45deg);
    transform: translateY(0) rotate(45deg);
  }

  .pagenations {
    font-size: 22px;
    margin-top: 50px;
  }

  #PROJECT__POST .pagenations {
    margin: 50px 5% 0;
  }

  .pagenation {
    font-size: 22px;
    margin-top: 50px;
    padding: 15px 0 0 5%;
  }

  #PROJECTLIST .pagenation {
    margin: 0 5% 150px;
  }

  #WORKSLIST .pagenation {
    margin: 0 0 50px;
  }

  #WORKS__POST .pagenations {
    margin: 0 5%;
  }

  .pagenation .current {
    border-bottom: 1px solid #231815;
  }

  .pagenation a.prev {
    padding-right: 46px;
    margin-right: 0;
    right: 55px;
  }

  .pagenation a.prev::after {
    display: none;
  }

  .pagenation a div.pagepnt {
    height: 46px;
    padding-right: 0;
  }

  .pagenation a.prev div.pagepnt {
    padding-right: 0;
    padding-left: 0;
    width: 46px;
  }

  .pagenation a div.pagepnt::before {
    width: 46px;
    height: 46px;
  }

  .pagenation a div.pagepnt::after {
    width: 46px;
    height: 46px;
    background: url(../images/common/icon_arrow_sml02.svg) center no-repeat;
    background-size: 15px 15px;
  }

  .pagenation a.prev div.pagepnt::after {
    background: url(../images/common/icon_arrow_sml02.svg) center no-repeat;
    background-size: 15px 15px;
  }

  .pagenation a div.pagepnt:hover::after {
    background: url(../images/common/icon_arrow_sml02.svg) center no-repeat;
    background-size: 15px 15px;
  }

  .pagenation a.prev div.pagepnt p {
    display: none;
  }

  .paging {
    padding: 0 5%;
  }

  .paging span.dots {
    border-bottom: none;
    padding-top: 8px;
    font-size: 18px;
  }

  .prevandnext.lastpost {
    width: 46px;
  }

  .prevandnext ul li.paging-prev {
    position: relative;
    padding-right: 46px;
    margin-right: 55px;
  }

  .prevandnext ul li.paging-prev::after {
    display: none;
  }

  .prevandnext ul li a {
    height: 46px;
    padding-right: 0;
  }

  .prevandnext ul li.paging-prev a {
    padding-right: 0;
    padding-left: 0;
  }

  .prevandnext ul li a::before {
    width: 46px;
    height: 46px;
  }

  .prevandnext ul li a::after {
    width: 46px;
    height: 46px;
    background: url(../images/common/icon_arrow_sml02.svg) center no-repeat;
    background-size: 15px 15px;
  }

  .prevandnext ul li.paging-prev a::after {
    background: url(../images/common/icon_arrow_sml02.svg) center no-repeat;
    background-size: 15px 15px;
  }

  .prevandnext ul li a:hover::after {
    background: url(../images/common/icon_arrow_sml02.svg) center no-repeat;
    background-size: 15px 15px;
  }

  .prevandnext ul li p {
    display: none;
  }

  .news__right {
    width: 100%;
    margin-top: 100px;
    font-size: 14px;
    min-height: 260px;
  }

  .news__right h2 {
    font-size: 30px;
    padding-bottom: 0;
    line-height: 1;
    padding-left: 43px;
    margin-left: -6%;
    margin-bottom: 20px;
  }

  .news__right h2::after {
    left: 0;
    right: auto;
    bottom: auto;
    top: 50%;
    width: 30px;
    height: 1px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
  }

  .news__right ul.archive {
    width: 72px;
    margin: auto;
    font-size: 20px;
    font-size: 1.25rem;
    line-height: 1;
  }

  .news__right ul.archive li {
    margin-bottom: 20px;
  }

  .news__right ul.archive li a:hover {
    opacity: 1;
    border-bottom: 1px solid #000;
  }

  /* ------------------------------- */
  .news__post__inner,
  .project__post__inner {
    max-width: initial;
  }

  .news__post__title {
    margin: 0 5% 50px;
  }

  .news__post__cats {
    font-size: 12px;
    margin-bottom: 30px;
  }

  .news__post__cats .post__date {
    font-size: 14px;
  }

  .news__post__title h2 {
    font-size: 18px;
  }

  .news__post__mainimg {
    margin-bottom: 50px;
  }

  .news__post__content {
    margin: 0 auto 50px;
    padding: 0 5% 50px;
  }

  .news__post__content p,
  .news__post__content h3,
  .news__post__content img {
    margin-bottom: 20px;
  }

  .news__post__content h3 {
    font-size: 15px;
  }

  .news__post__inner .pagenations {
    margin: 0 5%;
  }

  .backtopage a {
    font-size: 30px;
  }

  .backtopage a::before {
    top: 50%;
    width: 12px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
  }

  .backtopage a::after {
    top: 50%;
    width: 8px;
    height: 8px;
    -webkit-transform: translateY(-50%) rotate(-45deg);
    transform: translateY(-50%) rotate(-45deg);
  }

  #NEWS__CATEGORIES .news__post__inner {
    margin: 0 5%;
  }

  #NEWS__CATEGORIES .news__categories {
    margin-bottom: 80px;
  }

  .news_cat_select select {
    width: 100%;
    font-size: 16px;
  }

  /* ------------------------------- */
  .project__list {
    padding-bottom: 0;
  }

  .project__list.flexed {
    display: block;
  }

  .project__box {
    max-width: initial;
    width: 100%;
    margin: 0 0 100px;
    padding-right: 5%;
  }

  .project__box:nth-child(odd) {
    margin-top: 0;
  }

  .project__box:nth-child(even) {
    padding-right: 0;
    padding-left: 5%;
    margin-top: 0;
  }

  .project__box:first-child {
    margin-top: 0;
  }

  .project__box:nth-child(2) {
    margin-top: 0;
  }

  .project__box__txt {
    display: block;
    padding: 10px 0 0 0;
    margin-top: 20px;
  }

  .project__box:nth-child(odd) .project__box__txt {
    margin-left: 5%;
  }

  .project__box__year {
    font-size: 30px;
    width: 100px;
  }

  .project__box__year::after {
    width: 60px;
  }

  .project__box__title {
    margin-left: 100px;
  }

  .project__box__logo img {
    height: 35px;
    margin-top: 20px;
  }

  .aboutDesign {
    padding: 0;
  }

  .aboutDesign.flexed {
    display: block;
  }

  .aboutDesign__logo {
    width: 100%;
    text-align: left;
    margin-bottom: 50px;
  }

  .aboutDesign__logo img {
    height: 70px;
  }

  .aboutDesign__txt {
    width: auto;
  }

  .aboutDesign__txt h3.bsn__ttl {
    font-size: 20px;
    margin-bottom: 50px;
  }

  #PROJECTLIST .inner.wide {
    margin: auto;
  }

  .ttl__bottom_gd {
    padding: 0 0 100px;
  }

  .ttl__bottom_gd img {
    height: 30px;
  }

  .project__post__title {
    margin-bottom: 50px;
  }

  .project__post__title div {
    width: 238px;
    margin-bottom: 30px;
  }

  .project__post__title h2 p {
    padding-top: 10px;
  }

  .project__post__title h2 p.en01 {
    font-size: 31px;
    padding: 0 40px 20px 0;
    margin-right: 10px;
  }

  .project__post__title h2 p.en01::after {
    width: 60px;
  }

  .project__post__title h2 span,
  .project__box__title span {
    font-size: 12px;
  }

  .projectslides {
    margin-bottom: 50px;
  }

  .projectslide__main {
    margin-bottom: 5px;
  }

  .projectslide__main button.slick-arrow,
  .projectslide__main button.slick-arrow:active,
  .projectslide__main button.slick-arrow:visited,
  .projectslide__main button.slick-arrow:focus,
  .projectslide__main button.slick-arrow:link {
    display: none !important;
  }

  .projectslide__main button.slick-arrow:hover {
    opacity: 0;
  }

  .projectslide__sub {
    overflow: hidden;
    margin: 0 -2px 25px;
  }

  .project__icons ul {
    margin: auto 5%;
  }

  .project__icons ul li {
    width: 30%;
    margin-right: 5%;
  }

  .project__details {
    display: block;
    padding-bottom: 100px;
  }

  .project__datas {
    width: 100%;
    max-width: initial;
    margin-bottom: 100px;
    font-size: 12px;
  }

  .project__datas h3,
  .works__cats h3,
  .works__brandnews h3 {
    font-size: 30px;
    padding-left: 43px;
    margin-bottom: 30px;
  }

  .project__datas h3::before,
  .works__cats h3::before,
  .works__brandnews h3::before {
    width: 30px;
  }

  .project__datas__dls dl {
    margin: 0 5%;
  }

  .project__datas__dls dl dt {
    width: 25%;
  }

  .project__datas__dls dl dd {
    width: 75%;
  }

  .project__post__content {
    width: 90%;
    max-width: initial;
    margin: auto;
  }

  .project__post__content h4,
  .project__post__content img {
    margin-top: 50px;
  }

  .project__post__content h4 {
    margin-bottom: 10px;
  }

  .project__post__content h5 {
    font-size: 24px;
    margin: 30px 0 10px;
  }

  .project__post__content h5:first-of-type {
    margin-top: 50px;
  }

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

    WORKS

    -------------------------------- */
  .works__post__title {
    margin: 0 5% 50px;
  }

  .works__post__title h2 {
    margin-bottom: 50px;
    font-size: 16px;
  }

  .works__post__title h2 span {
    font-size: 13px;
    margin-top: 15px;
  }

  .worksimgs {
    margin-bottom: 50px;
  }

  .worksimgs__eyecatch {
    margin-bottom: 50px;
  }

  .grid {
    margin: 0 5%;
  }

  .grid-sizer,
  .grid-item {
    width: 100%;
    margin-bottom: 30px;
  }

  .gutter-sizer {
    width: 0;
  }

  .works__details {
    display: block;
    padding-bottom: 100px;
  }

  .works__details .project__datas {
    width: 90%;
    margin: auto auto 100px;
  }

  .works__details .project__datas h3 {
    margin-left: -6%;
  }

  .works__cats,
  .works__brandnews {
    width: 90%;
    margin: auto auto 100px;
  }

  .works__brandnews {
    padding-bottom: 0;
    margin-bottom: 50px;
  }

  .works__cats ul {
    padding-top: 0;
  }

  .works__cats ul li {
    margin: 20px 15px 0 0;
  }

  #WORKSCAT .works__cats {
    width: 100%;
    margin-bottom: 0;
  }

  .works__cats h3 {
    margin-bottom: 20px;
    margin-left: -6%;
  }

  .works__list {
    padding-top: 50px;
    padding-bottom: 100px;
  }

  .works__list::after {
    display: none;
  }

  .works__brandnews h3 {
    margin-left: -6%;
  }

  .works__brandnews ul {
    margin-top: 30px;
  }

  .works__box {
    margin-top: 50px;
  }

  .works__box:nth-child(1),
  .works__box:nth-child(2),
  .works__box:nth-child(6),
  .works__box:nth-child(7),
  .works__box:nth-child(11),
  .works__box:nth-child(12),
  .works__box:nth-child(16),
  .works__box:nth-child(17) {
    width: 100%;
  }

  .works__box:nth-child(3),
  .works__box:nth-child(4),
  .works__box:nth-child(5),
  .works__box:nth-child(8),
  .works__box:nth-child(9),
  .works__box:nth-child(10),
  .works__box:nth-child(13),
  .works__box:nth-child(14),
  .works__box:nth-child(15),
  .works__box:nth-child(18),
  .works__box:nth-child(19),
  .works__box:nth-child(20) {
    width: 100%;
  }

  .works__brandnews ul li {
    position: relative;
    width: 100%;
    margin-bottom: 50px;
  }

  .works__brandnews ul li a ~ p.imgzm img,
  .works__brandnews ul li a ~ p.imgzm picture,
  .works__box a ~ p.imgzm img,
  .works__box a ~ p.imgzm picture {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: 2s cubic-bezier(0.1, 0.55, 0.2, 1);
    transition: 2s cubic-bezier(0.1, 0.55, 0.2, 1);
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    font-family: "object-fit: cover; object-position: center;";
  }

  .works__brandnews ul li a:hover ~ p.imgzm img,
  .works__brandnews ul li a:hover ~ p.imgzm picture,
  .works__box a:hover ~ p.imgzm img,
  .works__box a:hover ~ p.imgzm picture {
    -webkit-transform: scale(1.07);
    transform: scale(1.07);
  }

  .works__brandnews ul li p {
    margin-bottom: 20px;
  }

  .works__box h4 {
    margin-top: 20px;
  }

  .works__brandnews ul li h4,
  .works__box h4 {
    font-size: 15px;
  }

  .works__brandnews ul li h4 span,
  .works__box h4 span {
    font-size: 12px;
    margin-top: 10px;
  }

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

    RECRUIT

    -------------------------------- */
  #BUSINESS__TOCHI__INTRO .inner .flexed {
    display: block;
  }

  .intro__txt {
    width: 100%;
    font-size: 15px;
  }

  .intro__ttl {
    font-size: 24px;
    margin-top: 50px;
  }

  #BUSINESS__TOCHI__INTRO .intro__ttl {
    text-align: left;
    margin-bottom: 50px;
  }

  .intro__txt__inner.bsn__inner {
    margin-top: 40px;
  }

  .intro__ttl span {
    display: block;
  }

  .intro__txt__inner,
  #PROJECT__INTRO .intro__txt__inner {
    width: 100%;
    margin: 25px 0 0 auto;
  }

  .intro__txt p:last-child,
  .concept__txt p:last-child,
  #BUSINESS__NEW__INTRO .intro__txt p:last-child {
    margin-bottom: 0;
  }

  #BUSINESS__NEW__INTRO .intro__txt p {
    margin-bottom: 40px;
  }

  #BUSINESS__TOCHI__INTRO .intro__txt {
    width: 100%;
    line-height: 2.2;
  }

  .concept__ttl {
    width: 100%;
    padding-right: 0;
    font-size: 20px;
    margin: auto auto 50px;
  }

  .concept__txt {
    width: 100%;
    padding-left: 0;
  }

  .concept__txt p {
    margin-bottom: 30px;
  }

  /* ------------------------------- */
  #RECRUIT__NEWS .flexed,
  #PROJECT__NEWS .flexed {
    display: block;
  }

  .news__box {
    width: 100%;
    padding-bottom: 20px;
    margin-bottom: 50px;
  }

  .news__box p.date {
    font-size: 12px;
  }

  .news__box p.date span {
    font-size: 14px;
  }

  .news__box a::before {
    top: 12px;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  .news__box a::after {
    top: 9px;
    -webkit-transform: translateY(0) rotate(45deg);
    transform: translateY(0) rotate(45deg);
  }

  #RECRUIT__NEWS .tolist,
  #PROJECT__NEWS .tolist {
    margin: 50px 0 auto auto;
  }

  /* ------------------------------- */
  .flexed.staffs {
    display: block;
  }

  .staffs__box {
    width: 100%;
    margin-bottom: 150px;
  }

  .staffs__box:nth-child(even) {
    margin-top: 0;
  }

  .staffs__box__inner {
    width: 100%;
    margin: auto;
  }

  .staffs__img {
    width: 112%;
    margin: 0 -6% 30px;
  }

  .staffs__box h3 {
    font-size: 24px;
    margin-bottom: 20px;
  }

  .addedheading__staff {
    font-size: 20px;
  }

  /* ------------------------------- */
  #RECRUIT__INTERVIEW h2.center__ttl {
    margin-bottom: 30px;
  }

  .interview__box .flexed {
    display: block;
    margin-bottom: 100px;
  }

  .interview__box .flexed:last-child {
    margin-bottom: 150px;
  }

  .interview__img,
  .contact__img {
    width: 112%;
    text-align: left;
    margin: auto -6% 30px;
  }

  .interview__img02 {
    width: 112%;
    text-align: left;
    margin: auto -6% 30px;
  }

  .interview__img.IntMrno,
  .interview__img02.IntMrno {
    margin-right: -6%;
  }

  .interview__img.IntMlno,
  .interview__img02.IntMlno,
  .contact__img.IntMlno {
    margin-left: -6%;
    text-align: left;
  }

  .interview__img.IntMrno img,
  .interview__img.IntMrno picture,
  .interview__img.IntMlno img,
  .interview__img.IntMlno picture,
  .contact__img.IntMlno img,
  .contact__img.IntMlno picture {
    width: 100%;
  }

  .interview__txt,
  .contact__txt {
    width: 100%;
    margin-bottom: 100px;
  }

  .interview__name {
    margin-bottom: 30px;
  }

  .interview__name span.jpn01 {
    font-size: 16px;
    margin-bottom: 20px;
  }

  .interview__txt p.interview__name__sub {
    font-size: 24px;
  }

  h4.interview__ttl,
  .contact__txt h2 {
    font-size: 20px;
    padding-left: 40px;
    line-height: 1;
    margin-left: -6%;
  }

  h4.interview__ttl::before,
  .contact__txt h2::before {
    width: 30px;
  }

  /* ------------------------------- */
  .detail__box {
    max-width: initial;
    margin: 40px auto 0;
  }

  .detail__box h3.detals__ttl {
    font-size: 24px;
    margin-bottom: 50px;
  }

  .details__table {
    display: block;
    padding-bottom: 15px;
    margin-bottom: 20px;
    line-height: 2;
  }

  .details__table dt {
    width: 100%;
    margin-bottom: 10px;
  }

  .details__table dd {
    width: 100%;
  }

  .sub__table {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .details__table .sub__table dt {
    width: 25%;
    font-size: 13px;
    margin-bottom: 0;
  }

  .details__table .sub__table dd {
    width: 75%;
  }

  .details__table .sub__table__wide dt {
    width: 45%;
  }

  .details__table .sub__table__wide dd {
    width: 55%;
  }

  /* ------------------------------- */
  .details__table2__wrap {
    flex-wrap: wrap;
    margin-bottom: 40px;
  }

  .details__table2 {
    margin-bottom: 80px;
    width: 100%;
  }

  .details__table2 dt {
    height: auto;
    padding-bottom: 2em;
  }

  .details__table2 dd p {
    height: auto;
    padding-bottom: 2em;
  }

  .details__entry__wrap {
    margin-bottom: 120px;
  }

  .details__entry__wrap p {
    text-align: left;
  }

  /* ------------------------------- */
  .recruit__logo {
    width: 100%;
  }

  #RECRUIT__CONTACT .flexed {
    display: block;
  }

  .contact__txt .tolist {
    margin-top: 50px;
  }

  /* ------------------------------- */
  .note__link {
  }

  .note__link .flexed {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 50px;
  }

  .note__link .note__logo {
    margin-bottom: 26px;
  }

  .note__link .note__logo .logo__img {
    margin: 0 0 17px;
    width: 128px;
  }

  .note__link .note__txt {
    width: 100%;
  }

  .note__link .tolist {
    margin: 0 0 0 auto;
  }

  .note__link .tolist a {
    margin: 0 0 0 auto;
  }

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

    BUSINESS

    -------------------------------- */
  #BUSINESS__INTRO .intro__ttl {
    font-size: 48px;
    line-height: 1.5;
  }

  #BUSINESS__INTRO .intro__ttl span {
    font-size: 40px;
  }

  #BUSINESS__INTRO .intro__txt__inner {
    margin-top: 70px;
  }

  .business__subtitle {
    font-size: 20px;
  }

  .business__subtitle span {
    display: block;
    font-size: 18px;
    margin-right: 0;
  }

  .flexed.comandpd {
    display: block;
  }

  .comandpd__img {
    position: relative;
    top: auto;
    left: auto;
    width: 112%;
    margin: auto -6%;
  }

  .comandpd__img ul {
    display: block;
  }

  .reverse .comandpd__img ul {
    flex-flow: row;
  }

  .comandpd__img ul li:first-child,
  .reverse .comandpd__img ul li:last-child {
    max-width: initial;
    width: 71.43%;
    margin: 0 auto 30px 0;
  }

  .comandpd__img ul li:last-child,
  .reverse .comandpd__img ul li:first-child {
    max-width: initial;
    width: 85%;
    margin: 0 0 0 auto;
  }

  .reverse .comandpd__img ul li:first-child {
    margin: 0 auto 30px 0;
  }

  .reverse .comandpd__img ul li:last-child {
    margin: 0 0 0 auto;
  }

  .comandpd__txt {
    width: 100%;
    margin-top: -6.5%;
  }

  .comandpd__txt h2 {
    font-size: 14px;
    margin-bottom: 30px;
  }

  .comandpd__txt h2 span {
    font-size: 50px;
    letter-spacing: 0.05em;
  }

  .comandpd__txt h3 {
    margin-bottom: 50px;
    font-size: 24px;
  }

  .comandpd__txt h3 span {
    display: inline;
  }

  .comandpd__txt p {
    margin-bottom: 20px;
  }

  .comandpd__txt p.comandpd__tags {
    margin-bottom: 50px;
    font-size: 11px;
  }

  .comandpd__txt .tolist a {
    margin: 0 -3.75% 0 auto;
  }

  .reverse .comandpd__txt .tolist a {
    margin: 0 auto 0 0;
  }

  /* ------------------------------- */
  .flexed.csr__box {
    display: block;
  }

  .flexed.csr__box.bsnver,
  #BUSINESS__WORKS .flexed.csr__box {
    margin-bottom: 150px;
  }

  .flexed.csr__box.onlytxt {
    margin-bottom: 100px;
  }

  .csr__box.wmax {
    margin-bottom: 150px;
  }

  .csr__box__img,
  .csr__box__img.w670,
  .csr__box__img.w660,
  .csr__box__img.w630,
  .csr__box__img.w620,
  .csr__box__img.w540,
  .csr__box__img.w500 {
    width: 112%;
    margin: 0 -6% 30px;
  }

  .csr__box__img.tate {
    text-align: center;
    width: 112%;
  }

  .csr__box__img.tate img,
  .csr__box__img.tate picture {
    max-width: initial;
  }

  .csr__box__txt {
    width: 100%;
    margin-right: 0;
    line-height: 2;
  }

  .reverse .csr__box__txt {
    margin-left: 0;
  }

  .csr__box.wmax .csr__box__txt {
    width: 100%;
    margin-left: 0;
  }

  #BUSINESS__HIRAYA .csr__box__txt {
    margin-top: 30px;
  }

  .csr__logo {
    max-width: 150px;
    width: 25%;
    margin: auto auto 30px;
  }

  #BUSINESS__WORKS .csr__logo {
    max-width: initial;
    width: 100%;
    text-align: center;
  }

  #BUSINESS__WORKS .csr__logo.workslogo01 {
    height: 75px;
  }

  #BUSINESS__WORKS .csr__logo.workslogo02 {
    height: 70px;
  }

  #BUSINESS__WORKS .csr__logo.workslogo03 {
    height: 83px;
  }

  #BUSINESS__WORKS .csr__logo.workslogo04 {
    height: 77px;
  }

  #BUSINESS__WORKS .csr__logo.workslogo05 {
    height: 29px;
  }

  #BUSINESS__WORKS .csr__logo img {
    height: 100%;
    width: auto;
  }

  .csr__box__txt p.csr__gooddesign {
    height: auto;
    width: 50%;
    margin-bottom: 50px;
  }

  .csr__box__txt p.csr__best100 {
    height: auto;
    width: 55%;
    margin-bottom: 50px;
  }

  .csr__gooddesign img,
  .csr__best100 img {
    width: 100%;
    height: auto;
  }

  .csr__details h3 {
    line-height: 1;
    margin-bottom: 30px;
    font-size: 14px;
  }

  .csr__details h3 span {
    font-size: 50px;
    margin-bottom: 15px;
  }

  .csr__box__txt h3.bsn__ttl {
    margin: 30px auto 50px;
    font-size: 24px;
  }

  .renov__details h3.bsn__ttl {
    font-size: 20px;
    margin: 0 auto 50px;
  }

  .renov__details h4.bsn__ttl {
    font-size: 20px;
    margin-bottom: 50px;
  }

  .renov__details .csr__box__txt h3.bsn__ttl {
    margin-bottom: 50px;
  }

  .csr__box__txt h3.bsn__ttl__line,
  .csr__box__txt h4.bsn__ttl__line,
  .csr__box__txt h3.bsn__ttl__lineB {
    font-size: 20px;
    padding-left: 20px;
    margin-bottom: 30px;
  }

  .csr__box__txt h3.bsn__ttl__lineB {
    font-size: 30px;
  }

  .csr__box__txt h4.bsn__ttl__line {
    margin-bottom: 50px;
  }

  .csr__box__txt h3.bsn__ttl__line::before,
  .csr__box__txt h4.bsn__ttl__line::before,
  .csr__box__txt h3.bsn__ttl__lineB::before {
    width: 35px;
    left: -6%;
    top: 11px;
  }

  .csr__box__txt h3.bsn__ttl__sml {
    font-size: 20px;
    margin-bottom: 50px;
    text-align: center;
  }

  .csr__box__txt h3.bsn__ttl__sml span.en01 {
    font-size: 18px;
    margin-right: 0;
    display: block;
  }

  #BUSINESS__HIRAYA .csr__box__txt h3.bsn__ttl {
    margin-bottom: 50px;
  }

  #BUSINESS__HIRAYA .reverse .csr__box__txt h3.bsn__ttl {
    margin-bottom: 15px;
  }

  #BUSINESS__WORKS .csr__details h3 {
    margin-bottom: 50px;
  }

  #BUSINESS__WORKS .csr__details h3 span {
    font-size: 41px;
  }

  #BUSINESS__HIRAYA .csr__box__txt h4 {
    font-size: 15px;
  }

  .csr__details h4 {
    font-size: 24px;
    margin-bottom: 30px;
  }

  .csr__details h4 span {
    display: inline;
  }

  .bsnver .csr__box__txt p.jpn01 {
    margin-bottom: 30px;
    font-size: 14px;
  }

  .csr__box__txt ul.hiraya {
    display: block;
    width: 100%;
    height: auto;
    margin: 30px auto 50px;
  }

  .csr__box__txt ul.hiraya li:first-child {
    width: 183px;
    margin: auto;
  }

  .csr__box__txt ul.hiraya li:last-child {
    width: 165px;
    margin: auto;
    padding-top: 15px;
  }

  .csr__details .tolist,
  .csr__box__txt .tolist.urls,
  .csr__box__txt .tolist.mt100,
  .tolist.doboku {
    margin-top: 50px;
  }

  .csr__box__txt .typeoftochi h4 {
    font-size: 18px;
    margin-bottom: 15px;
  }

  .csr__box__txt .typeoftochi h3 {
    margin-bottom: 15px;
    line-height: 1;
  }

  .bsnver .csr__box__txt .typeoftochi p {
    margin-bottom: 30px;
  }

  #BUSINESS__CONNECT .bsnver .csr__box__txt .typeoftochi p {
    margin-bottom: 50px;
  }

  .bsnver .tolist p {
    margin: 0 -3.5% 7px auto;
  }

  .csr__box__subtitle {
    line-height: 1;
    margin-bottom: 30px;
  }

  .csr__box__subtitle span {
    font-size: 30px;
    margin-bottom: 15px;
  }

  /* ------------------------------- */
  .project__wrap {
    display: block;
  }

  .project__wrap__img {
    width: 100%;
    margin-bottom: 50px;
  }

  .project__wrap__img ul {
    width: 112%;
    height: auto;
    margin: auto -6%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  .project__wrap__img li {
    position: relative;
    width: 48%;
  }

  .project__wrap__img li:first-child {
    top: auto;
    left: auto;
  }

  .project__wrap__img li:last-child {
    bottom: auto;
    right: auto;
    margin-top: 25px;
  }

  .project__wrap__txt {
    width: 100%;
    margin-right: 0;
  }

  .project__wrap__txt h2 {
    margin-bottom: 30px;
    font-size: 14px;
  }

  .project__wrap__txt h2 span {
    font-size: 50px;
    margin-bottom: 15px;
  }

  h3.projectheading3 {
    font-size: 24px;
    letter-spacing: 0;
  }

  #FORSALE h3.projectheading3 {
    font-size: 24px;
    margin-top: 50px;
    margin-bottom: 50px;
  }

  .project__design {
    width: 85%;
    margin-bottom: 40px;
  }

  .project__txt {
    margin-bottom: 50px;
  }

  .project__txt p {
    margin-bottom: 30px;
  }

  /* ------------------------------- */
  #CONTENTS .flexed {
    display: block;
  }

  .contents__lnk {
    width: 100%;
    margin-bottom: 50px;
  }

  .contents__lnk a {
    display: inline-block;
    padding-left: 55px;
    font-size: 13px;
    margin-bottom: 30px;
  }

  .contents__lnk a::before {
    width: 46px;
    height: 46px;
  }

  .contents__lnk a::after {
    width: 46px;
    height: 46px;
    background: url("../images/common/icon_arrow_sml02.svg") center no-repeat;
    background-size: 15px 15px;
  }

  .contents__lnk a:hover::after {
    background: url("../images/common/icon_arrow_sml02.svg") center no-repeat;
    background-size: 15px 15px;
  }

  .contents__lnk a span {
    display: block;
    font-size: 25px;
    line-height: 1;
  }

  .contents__lnk p {
    font-size: 12px;
  }

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

    RENOVATION

    -------------------------------- */
  h5.bs {
    font-size: 15px;
    margin-bottom: 15px;
  }

  h5.bs.jpn01 {
    font-size: 16px;
    font-size: 1rem;
    font-weight: normal;
  }

  .renov__details .csr__box__img {
    margin-bottom: 50px;
  }

  ul.renvchk01 li {
    margin-bottom: 15px;
    padding-left: 40px;
    background-size: 25px auto;
    line-height: 1.8;
  }

  ul.renvchk02 li {
    background-size: 25px auto;
    padding: 0 0 12px 40px;
    margin-bottom: 8px;
    line-height: 1.8;
  }

  .bsnver .csr__box__txt p.renov__gooddesign {
    margin: 50px 5%;
  }

  .bsnver .csr__box__txt p.renov__gooddesign img {
    width: 100%;
    height: auto;
  }

  p.caption {
    margin-left: 5%;
  }

  .renovation__flow {
    margin-bottom: 200px;
  }

  .renovation__flow__list {
    width: 100%;
    margin: 0 auto 50px;
  }

  .renovation__flow__list ul li {
    width: 25%;
  }

  .renovation__flow__list ul li p {
    position: relative;
    width: 100%;
    height: 40px;
  }

  .renovation__flow__list ul li p::after {
    position: absolute;
    content: "";
    top: 15px;
    right: -3.5%;
    width: 10px;
    height: 10px;
  }

  .renovation__flow__list ul li p img {
    width: 40px;
  }

  .renovation__flow__list ul li span {
    font-size: 15px;
    margin-top: 15px;
  }

  .renovation__flow.flexed {
    display: block;
  }

  .renovation__flow__box {
    width: 100%;
    line-height: 2.2;
    margin-bottom: 100px;
    margin-top: 0;
  }

  .renovation__flow__box:last-child {
    margin-top: 0;
  }

  .renovation__flow__box:nth-child(odd) img {
    margin-left: -6%;
    width: 106%;
  }

  .renovation__flow__box:nth-child(even) img {
    margin-right: -6%;
    width: 106%;
  }

  .renovation__flow__box h4 {
    font-size: 20px;
    margin: 30px 0;
    padding: 5px 0 0 70px;
  }

  .renovation__flow__box:nth-child(odd) h4 img,
  .renovation__flow__box:nth-child(even) h4 img {
    width: auto;
    margin: auto;
  }

  .renovation__flow__box h4 img {
    position: absolute;
    left: 0;
    top: 0;
    height: 50px;
  }

  .renovation__flow__box h5 {
    margin-bottom: 20px;
  }

  .renovation__flow__box h5.txtC {
    text-align: center;
  }

  ul.check10 li {
    width: 25%;
    font-size: 11px;
    margin-bottom: 30px;
  }

  ul.check10::after {
    content: "";
    width: 50%;
  }

  .renovation__flow__box:nth-child(odd) ul.check10 li img,
  .renovation__flow__box:nth-child(even) ul.check10 li img {
    margin-bottom: 5px;
    width: 75%;
  }

  .renovation__flow__box:nth-child(even) .rescuezu img {
    margin-right: 0;
    width: 100%;
  }

  .renov__details .slick-dotted.slick-slider {
    padding-bottom: 0;
  }

  .BeforeandAfter.flexed {
    display: block;
    margin-bottom: 0;
  }

  .BeforeandAfter::after {
    display: none;
  }

  .BeforeandAfter__before,
  .BeforeandAfter__after {
    width: 100%;
  }

  .BeforeandAfter__before ul,
  .BeforeandAfter__after ul {
    width: 112%;
    margin: 0 -6%;
  }

  .BeforeandAfter__before ul.slick-dotted.slick-slider,
  .BeforeandAfter__after ul.slick-dotted.slick-slider {
    padding-bottom: 50px;
  }

  .BeforeandAfter h4.interview__ttl,
  .contact__txt h2 {
    font-size: 30px;
    padding-left: 45px;
    margin-bottom: 20px;
  }

  .BeforeandAfter__after h4.interview__ttl {
    text-align: right;
  }

  .BeforeandAfter__after h4.interview__ttl::before {
    left: auto;
    right: 2.75em;
  }

  .flexed.csr__box.bsnver.naked {
    margin-bottom: 200px;
  }

  .naked .csr__box__img {
    width: 100%;
    margin: 0 auto 50px;
  }

  .naked .tolist a {
    width: 85%;
    margin: 0 -3.5% 0 auto;
  }

  .naked .tolist a span.arrows {
    padding-top: 0;
  }

  .naked .tolist a.viewall02 {
    font-size: 14px;
  }

  ul.ordinalist li {
    margin: 0 0 10px 1em;
  }

  .tolist.tocontact a {
    margin: 0 auto 0 0;
  }

  .caut {
    font-size: 12px;
    line-height: 1.8;
  }

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

    COMMON

    -------------------------------- */
  .basic__box {
    padding-bottom: 25px;
    margin-bottom: 20px;
  }

  .basic__box h2,
  .basic__box h3 {
    font-size: 20px;
    margin-bottom: 10px;
  }

  .contactform .basic__box h2 {
    font-size: 24px;
  }

  .contactform .basic__box h2.txtC {
    font-size: 20px;
  }

  .basic__box h2.txtC {
    text-align: center;
    margin-bottom: 30px;
  }

  h2.basic__head {
    font-size: 20px;
    margin-bottom: 50px;
    text-align: center;
  }

  .contact .basic__box h3 {
    font-size: 24px;
    margin-bottom: 30px;
  }

  .basic__box h3.sideline {
    font-size: 50px;
    margin-bottom: 50px;
    padding-left: 20px;
  }

  .basic__box h3.sideline span {
    font-size: 24px;
    margin-left: -20px;
    line-height: 1.6;
  }

  .basic__box h3.sideline::before {
    width: 33px;
    top: 27px;
    left: -6%;
  }

  .contact .basic__box h3.small,
  .contact .basic__box h4 {
    margin-bottom: 15px;
  }

  .basic__box ul,
  .inner__basic {
    margin-left: 20px;
  }

  .basic__box ul.num li {
    margin-bottom: 30px;
  }

  .contact .basic__box ul.list li {
    padding-right: 10px;
    margin-right: 10px;
    line-height: 1;
  }

  #CONTACTINT .mb150 {
    margin-bottom: 100px;
  }

  .basic__box.nobdr.mb200 {
    margin-bottom: 150px;
  }

  .contact .basic__box .flexed {
    display: block;
  }

  .base__flex__box {
    width: 100%;
    margin-bottom: 50px;
  }

  .base__flex__box .tolist a {
    width: 240px;
    margin: 0 0 0 0;
  }

  .basic__box .contactNum,
  .renov__details .contactNum {
    display: block;
  }

  .basic__box .contactNum span,
  .renov__details .contactNum span {
    display: block;
    font-size: 12px;
    padding-left: 38px;
  }

  .award__logo__box {
    height: auto;
    margin-bottom: 50px;
  }

  .award__logo__box div {
    max-height: 32px;
    max-width: calc(50% - 30px);
  }

  /* FORMS */
  .contactform .txtC {
    text-align: center;
  }

  .contactform .basic__box.nobdr.mb150 {
    margin-bottom: 100px;
  }

  .forms {
    width: 100%;
    margin: auto;
  }

  .forms__dl.flexed {
    display: block;
    margin-bottom: 30px;
  }

  .forms__dl.mb80 {
    margin-bottom: 50px;
  }

  .forms__dt {
    width: 100%;
    font-size: 15px;
    padding-left: 0;
    padding-top: 0;
    margin-bottom: 10px;
  }

  .forms__dt span.attn-red {
    left: -17px;
    top: 4px;
    font-size: 20px;
  }

  .forms__dd {
    width: 100%;
  }

  .form__last__attn {
    margin-top: 50px;
  }

  .form__btn__set {
    margin-top: 50px;
  }

  .form__btn__set {
    margin-top: 35px;
  }

  .confirms .form__btn__set {
    flex-direction: column-reverse;
  }

  .forms .form__btn__set__send {
    display: block;
  }

  .forms .form__btn__set__send input[type="submit"],
  .forms a.fakeformbtn {
    font-size: 16px;
    width: 100%;
    padding-left: 15px;
  }

  .forms a.fakeformbtn {
    padding-top: 24px;
  }

  .confirms .forms .form__btn__set__back {
    width: auto;
  }

  .confirms .forms .form__btn__set__back::after {
    left: 0;
  }

  .confirms .forms .form__btn__set__back::before {
    left: -1px;
  }

  .confirms .forms .form__btn__set__back button[type="submit"] {
    font-size: 16px;
    width: 65px;
  }

  /* NOTFOUND */
  #NOTFOUND .intro h2 {
    font-size: 20px;
  }

  #NOTFOUND .intro__txt {
    padding-top: 80px;
    margin-bottom: 100px;
    font-size: 13px;
  }

  #NOTFOUND .intro__txt p {
    margin-top: 20px;
  }

  #NOTFOUND .forms {
    margin-bottom: 50px;
  }
}

@media all and (max-width: 769px) {
  form#myform dl {
    display: block;
    margin-bottom: 30px;
  }

  form#myform dl dd {
    width: 100%;
  }

  .forms .form__btn__set__send input[type="submit"],
  .forms a.fakeformbtn {
    font-size: 16px;
    width: 100%;
    padding-left: 15px;
  }

  .forms .form__btn__set__send {
    display: block;
  }

  .form__btn__set__send.form-Back input[type="submit"],
  .forms a.fakeformbtn {
    font-size: 16px;
    width: 100%;
    padding-left: 15px;
  }

  form#myform dl dt {
    position: relative;
    width: 100%;
    font-size: 16px;
    font-size: 1rem;
    padding-left: 0px;
    margin-bottom: 10px;
  }
  .works__box.fadeAnm.anmActive > h4 {
    border: solid 1px #d0d0d0;
    padding: 10px;
  }
  .contactNum {
    margin-bottom: 25px;
  }
}
@media screen and (max-width: 768px) and (orientation: landscape) {
  .hero {
    position: relative;
    width: calc(100% - 40px);
    height: 76.5vh;
    margin: 0 0 140px 40px;
  }
}