@charset "UTF-8";
/* =================================================================================================

　TOPページ

================================================================================================= */
/* CSS Document */
/* ----------------------------------------------------------------------------
　メインスライド
---------------------------------------------------------------------------- */
#main_area {
  position: relative;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-bottom: 6rem;
  padding-top: 41.5%;
  background: -webkit-gradient(linear, left top, right top, from(#0b47af), to(#032e7a));
  background: -o-linear-gradient(left, #0b47af 0%, #032e7a 100%);
  background: linear-gradient(to right, #0b47af 0%, #032e7a 100%);
}
@media screen and (max-width: 1024px) {
  #main_area {
    margin-bottom: 4rem;
  }
}
@media screen and (max-width: 800px) {
  #main_area {
    margin-bottom: 3rem;
  }
}
@media screen and (max-width: 592px) {
  #main_area {
    margin-bottom: 2rem;
  }
}
@media screen and (max-width: 592px) {
  #main_area {
    padding-top: 53.5%;
  }
}

#main_area .mix_bg {
  content: "";
  position: absolute;
  top: 0rem;
  left: 0rem;
  width: 100%;
  height: 100%;
  background-color: #0b47af;
  mix-blend-mode: multiply; /* 乗算 */
  z-index: 4;
  display: none;
}
#main_area .mix_bg.active {
  display: block;
  -webkit-animation: mixBgAnime 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) 0s forwards;
          animation: mixBgAnime 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) 0s forwards;
}

@-webkit-keyframes mixBgAnime {
  0% {
    opacity: 0;
    -webkit-transform: scale(1, 0);
            transform: scale(1, 0);
  }
  100% {
    opacity: 0.9;
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
}

@keyframes mixBgAnime {
  0% {
    opacity: 0;
    -webkit-transform: scale(1, 0);
            transform: scale(1, 0);
  }
  100% {
    opacity: 0.9;
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
}
#main_area .copy_wrapper {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0rem;
  left: 0rem;
  z-index: 5;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

#main_area .copy {
  color: #fff;
  position: relative;
  width: 100%;
}

#main_area .copy .copy_inner {
  width: 1240px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 0.7rem 0;
  opacity: 0;
  -webkit-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
  -webkit-transform: translateX(10px);
      -ms-transform: translateX(10px);
          transform: translateX(10px);
}
@media screen and (max-width: 1320px) {
  #main_area .copy .copy_inner {
    width: 95%;
  }
}
#main_area .copy .copy_inner.active {
  opacity: 1;
  -webkit-transform: translateX(0px);
      -ms-transform: translateX(0px);
          transform: translateX(0px);
}

#main_area .copy h1 {
  margin-bottom: 1rem;
  font-size: 2.5rem;
  border-bottom: 1px solid #fff;
  margin-bottom: 0.5rem;
  padding-bottom: 0.5rem;
}
@media all and (max-width: 1366px) {
  #main_area .copy h1 {
    font-size: 2rem;
  }
}
@media screen and (max-width: 1024px) {
  #main_area .copy h1 {
    font-size: 1.5rem;
  }
}
@media screen and (max-width: 592px) {
  #main_area .copy h1 {
    font-size: 1.1rem;
  }
}

#main_area .copy h1 span {
  -webkit-transition: 0.2s ease-in-out;
  -o-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
  border: 1px solid #ff0000;
}

#main_area .copy .text {
  font-size: 1.5rem;
  font-weight: 600;
}
@media screen and (max-width: 1024px) {
  #main_area .copy .text {
    font-size: 1.275rem;
  }
}
@media screen and (max-width: 800px) {
  #main_area .copy .text {
    font-size: 1rem;
  }
}
@media screen and (max-width: 592px) {
  #main_area .copy .text {
    font-size: 0.8rem;
  }
}

#main_area .photo01,
#main_area .photo02,
#main_area .photo03,
#main_area .photo04,
#main_area .photo05,
#main_area .photo06,
#main_area .photo07 {
  display: block;
  position: absolute;
  z-index: 2;
  opacity: 0;
  width: 100%;
}

#main_area .photo01 {
  top: 0rem;
  left: 0rem;
  width: 38.2291667%;
  z-index: 3;
}
@media screen and (max-width: 592px) {
  #main_area .photo01 {
    width: 35.2%;
  }
}
#main_area .photo01.active {
  display: block;
  -webkit-animation: mainAreaPhoto01 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s forwards;
          animation: mainAreaPhoto01 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s forwards;
}

@-webkit-keyframes mainAreaPhoto01 {
  0% {
    top: -100%;
    opacity: 0;
  }
  100% {
    top: 0%;
    opacity: 1;
  }
}

@keyframes mainAreaPhoto01 {
  0% {
    top: -100%;
    opacity: 0;
  }
  100% {
    top: 0%;
    opacity: 1;
  }
}
#main_area .photo02 {
  bottom: 0rem;
  left: 14.2%;
  width: 41.71875%;
}
@media screen and (max-width: 592px) {
  #main_area .photo02 {
    width: 53.5%;
    left: 4%;
  }
}
#main_area .photo02.active {
  display: block;
  -webkit-animation: mainAreaPhoto02 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s forwards;
          animation: mainAreaPhoto02 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s forwards;
}

@-webkit-keyframes mainAreaPhoto02 {
  0% {
    bottom: -100%;
    opacity: 0;
  }
  100% {
    bottom: 0%;
    opacity: 1;
  }
}

@keyframes mainAreaPhoto02 {
  0% {
    bottom: -100%;
    opacity: 0;
  }
  100% {
    bottom: 0%;
    opacity: 1;
  }
}
#main_area .photo03 {
  top: 0rem;
  left: 34.9%;
  width: 48.4%;
}
@media screen and (max-width: 592px) {
  #main_area .photo03 {
    width: 62.5%;
    left: 30.5%;
  }
}
#main_area .photo03.active {
  display: block;
  -webkit-animation: mainAreaPhoto03 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s forwards;
          animation: mainAreaPhoto03 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s forwards;
}

@-webkit-keyframes mainAreaPhoto03 {
  0% {
    top: -100%;
    opacity: 0;
  }
  100% {
    top: 0%;
    opacity: 1;
  }
}

@keyframes mainAreaPhoto03 {
  0% {
    top: -100%;
    opacity: 0;
  }
  100% {
    top: 0%;
    opacity: 1;
  }
}
#main_area .photo04 {
  bottom: 0rem;
  right: 0rem;
  width: 38.28125%;
}
@media screen and (max-width: 592px) {
  #main_area .photo04 {
    width: 35.5%;
  }
}
#main_area .photo04.active {
  display: block;
  -webkit-animation: mainAreaPhoto04 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s forwards;
          animation: mainAreaPhoto04 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s forwards;
}

@-webkit-keyframes mainAreaPhoto04 {
  0% {
    bottom: -100%;
    opacity: 0;
  }
  100% {
    bottom: 0%;
    opacity: 1;
  }
}

@keyframes mainAreaPhoto04 {
  0% {
    bottom: -100%;
    opacity: 0;
  }
  100% {
    bottom: 0%;
    opacity: 1;
  }
}
#main_area .photo05 {
  bottom: 0rem;
  left: 0rem;
  mix-blend-mode: screen;
  width: 19.5%;
  z-index: 4;
}
@media screen and (max-width: 592px) {
  #main_area .photo05 {
    width: 10%;
  }
}
#main_area .photo05.active {
  display: block;
  -webkit-animation: mainAreaPhoto05 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s forwards;
          animation: mainAreaPhoto05 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s forwards;
}

@-webkit-keyframes mainAreaPhoto05 {
  0% {
    bottom: -100%;
    left: 0rem;
    opacity: 0;
  }
  100% {
    bottom: 0%;
    left: 0rem;
    opacity: 1;
  }
}

@keyframes mainAreaPhoto05 {
  0% {
    bottom: -100%;
    left: 0rem;
    opacity: 0;
  }
  100% {
    bottom: 0%;
    left: 0rem;
    opacity: 1;
  }
}
#main_area .photo06 {
  top: 0rem;
  left: 80.7%;
  width: 5.02083333%;
  z-index: 4;
}
@media screen and (max-width: 592px) {
  #main_area .photo06 {
    width: 6.5%;
    left: 89.5%;
  }
}
#main_area .photo06.active {
  display: block;
  -webkit-animation: mainAreaPhoto06 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s forwards;
          animation: mainAreaPhoto06 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s forwards;
}

@-webkit-keyframes mainAreaPhoto06 {
  0% {
    top: -100%;
    opacity: 0;
  }
  100% {
    top: 0%;
    opacity: 1;
  }
}

@keyframes mainAreaPhoto06 {
  0% {
    top: -100%;
    opacity: 0;
  }
  100% {
    top: 0%;
    opacity: 1;
  }
}
#main_area .photo07 {
  top: 0rem;
  right: 0%;
  mix-blend-mode: screen;
  width: 16.71875%;
  z-index: 4;
}
@media screen and (max-width: 592px) {
  #main_area .photo07 {
    width: 7%;
  }
}
#main_area .photo07.active {
  display: block;
  -webkit-animation: mainAreaPhoto07 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s forwards;
          animation: mainAreaPhoto07 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s forwards;
}

@-webkit-keyframes mainAreaPhoto07 {
  0% {
    top: -100%;
    opacity: 0;
  }
  100% {
    top: 0%;
    opacity: 1;
  }
}

@keyframes mainAreaPhoto07 {
  0% {
    top: -100%;
    opacity: 0;
  }
  100% {
    top: 0%;
    opacity: 1;
  }
}
/* ----------------------------------------------------------------------------
　事業案内
---------------------------------------------------------------------------- */
#business {
  width: 1240px;
  margin: 0 auto 3.5rem;
}
@media screen and (max-width: 1320px) {
  #business {
    width: 95%;
  }
}
@media screen and (max-width: 592px) {
  #business {
    width: 90%;
  }
}
@media screen and (max-width: 1024px) {
  #business {
    margin-bottom: 3rem;
  }
}
@media screen and (max-width: 800px) {
  #business {
    margin-bottom: 2rem;
  }
}
@media screen and (max-width: 592px) {
  #business {
    margin-bottom: 1.5rem;
  }
}

#business h2 {
  text-align: center;
  margin-bottom: 4.5rem;
  font-size: 1.8rem;
  line-height: 120%;
  position: relative;
  color: #333;
}
#business h2:after {
  content: "";
  width: 2px;
  height: 25px;
  background-color: #333;
  position: absolute;
  left: 50%;
  top: 130%;
}
@media screen and (max-width: 592px) {
  #business h2:after {
    height: 15px;
  }
}
@media screen and (max-width: 1024px) {
  #business h2 {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 800px) {
  #business h2 {
    font-size: 1.4rem;
    margin-bottom: 3.5rem;
  }
}
@media screen and (max-width: 592px) {
  #business h2 {
    margin-bottom: 3rem;
  }
}

#business ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

#business ul li {
  width: 32%;
  margin-bottom: 1.5rem;
}
@media screen and (max-width: 592px) {
  #business ul li {
    width: 48.5%;
    margin-bottom: 1rem;
  }
}

#business ul li a {
  display: block;
  text-decoration: none;
  position: relative;
  overflow: hidden;
}

#business ul li a .copy {
  position: absolute;
  left: 0rem;
  bottom: 0rem;
  padding: 1rem;
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media screen and (max-width: 592px) {
  #business ul li a .copy {
    padding: 0.5rem;
  }
}
#business ul li a .copy:after {
  content: "";
  position: absolute;
  left: 0rem;
  top: 10%;
  z-index: 1;
  background-color: #153950;
  mix-blend-mode: multiply; /* 乗算 */
  -webkit-transform: skewY(13deg);
      -ms-transform: skewY(13deg);
          transform: skewY(13deg);
  width: 125%;
  height: 150%;
  -webkit-transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -o-transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
@media screen and (max-width: 592px) {
  #business ul li a .copy:after {
    width: 140%;
  }
}

#business ul .real-estate a .copy:after {
  background-color: #EC6D34;
  mix-blend-mode: multiply; /* 乗算 */
}

#business ul li a:hover .copy:after {
  width: 150%;
  height: 250%;
  -webkit-transform: skewY(20deg);
      -ms-transform: skewY(20deg);
          transform: skewY(20deg);
}

#business ul li:nth-child(4) a .copy:after {
  background-color: #035309;
}

#business ul li:nth-child(5) a .copy:after {
  background-color: #41BFB1;
}

#business ul li:nth-child(6) a .copy:after {
  background-color: #41219A;
}

#business ul li a .copy .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: #fff;
  font-weight: 600;
  font-size: 1.7rem;
  line-height: 130%;
  margin-bottom: 0.5rem;
  position: relative;
  z-index: 2;
}
@media all and (max-width: 1366px) {
  #business ul li a .copy .title {
    font-size: 1.3rem;
  }
}
@media screen and (max-width: 1024px) {
  #business ul li a .copy .title {
    font-size: 1rem;
  }
}
@media screen and (max-width: 800px) {
  #business ul li a .copy .title {
    font-size: 1rem;
  }
}
@media screen and (max-width: 592px) {
  #business ul li a .copy .title {
    font-size: 0.875rem;
    margin-bottom: 0.3rem;
  }
}
#business ul li a .copy .title span {
  font-size: 1.2rem;
}
@media all and (max-width: 1366px) {
  #business ul li a .copy .title span {
    font-size: 0.8rem;
  }
}
@media screen and (max-width: 1024px) {
  #business ul li a .copy .title span {
    font-size: 0.7rem;
  }
}
@media screen and (max-width: 800px) {
  #business ul li a .copy .title span {
    font-size: 0.7rem;
  }
}
#business ul li a .copy .btn {
  background: url("/img/icon_circle_gray.svg") right 0.8rem top 50% no-repeat;
  background-size: 15px auto;
  background-color: #fff;
  text-align: center;
  font-weight: 600;
  padding: 0.2rem 0;
  position: relative;
  z-index: 2;
  color: #333;
}
@media screen and (max-width: 800px) {
  #business ul li a .copy .btn {
    font-size: 0.8rem;
  }
}
#business ul li a .photo img {
  width: 100%;
}

/* ----------------------------------------------------------------------------
　追加バナーエリア
---------------------------------------------------------------------------- */
#add_bnr {
  background-color: #b7c6d8;
  padding: 2.5rem 0;
}

#add_bnr ul {
  width: 1240px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media screen and (max-width: 1320px) {
  #add_bnr ul {
    width: 95%;
  }
}
@media screen and (max-width: 592px) {
  #add_bnr ul {
    width: 90%;
    display: block;
  }
}

#add_bnr li {
  width: 49.3%;
  position: relative;
}
@media screen and (max-width: 592px) {
  #add_bnr li {
    width: 100%;
    margin-bottom: 1.5rem;
  }
  #add_bnr li:last-child {
    margin-bottom: 0rem;
  }
}
#add_bnr li img {
  width: 100%;
  border-radius: 10px;
}
#add_bnr li .cs {
  position: absolute;
  top: 0rem;
  left: 0rem;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-radius: 10px;
  color: #fff;
  font-size: 2rem;
}

#add_bnr li a {
  display: block;
  text-decoration: none;
}
#add_bnr li a:hover {
  opacity: 0.8;
}

/* ----------------------------------------------------------------------------
　青グラデ背景
---------------------------------------------------------------------------- */
.bg_blue {
  background: -webkit-gradient(linear, left top, right top, from(#8BEDFF), to(#4280D6));
  background: -o-linear-gradient(left, #8BEDFF 0%, #4280D6 100%);
  background: linear-gradient(to right, #8BEDFF 0%, #4280D6 100%);
  padding: 2.5rem 0 1rem;
}

.bg_blue .flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 1240px;
  margin: 0 auto 1.5rem;
}
@media screen and (max-width: 1320px) {
  .bg_blue .flex {
    width: 95%;
  }
}
@media screen and (max-width: 592px) {
  .bg_blue .flex {
    width: 90%;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}

#message,
#about {
  width: 19.3%;
}
@media screen and (max-width: 592px) {
  #message,
#about {
    width: 48.5%;
    margin-bottom: 1rem;
  }
}

#message a,
#about a {
  display: block;
  background-color: #fff;
  text-decoration: none;
  -webkit-transition: 0.4s ease-in-out;
  -o-transition: 0.4s ease-in-out;
  transition: 0.4s ease-in-out;
}
#message a:hover,
#about a:hover {
  opacity: 0.8;
}

#message a .title,
#about a .title {
  text-align: center;
  padding: 2rem 0;
}
@media screen and (max-width: 592px) {
  #message a .title,
#about a .title {
    padding: 0.7rem 0 0.6rem;
  }
}

#message a h2,
#about a h2 {
  color: #333;
  font-size: 1.9rem;
  line-height: 120%;
  margin-bottom: 0.3rem;
}
@media screen and (max-width: 1024px) {
  #message a h2,
#about a h2 {
    font-size: 1.5rem;
  }
}
@media screen and (max-width: 800px) {
  #message a h2,
#about a h2 {
    font-size: 1.3rem;
  }
}
@media screen and (max-width: 592px) {
  #message a h2,
#about a h2 {
    margin-bottom: 0.1rem;
  }
}

#message a .en,
#about a .en {
  color: #666;
  font-weight: 600;
  font-size: 1rem;
}
@media screen and (max-width: 800px) {
  #message a .en,
#about a .en {
    font-size: 0.875rem;
  }
}

#message a .photo img,
#about a .photo img {
  width: 100%;
}

#news {
  width: 56%;
}
@media screen and (max-width: 592px) {
  #news {
    width: 100%;
    margin-top: 1rem;
  }
}

#news .title {
  background-color: #1344b5;
  color: #fff;
  padding: 0.5rem 1.5rem;
  margin-bottom: 1.3rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media screen and (max-width: 592px) {
  #news .title {
    margin-bottom: 1rem;
    padding: 0.5rem 1rem;
  }
}

#news .title h2 {
  font-size: 2.3rem;
  line-height: 120%;
  letter-spacing: 5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media all and (max-width: 1366px) {
  #news .title h2 {
    font-size: 2rem;
  }
}
@media screen and (max-width: 1024px) {
  #news .title h2 {
    font-size: 1.5rem;
    letter-spacing: 3px;
  }
}
#news .title h2 span {
  font-size: 1rem;
  margin-left: 1rem;
  line-height: 120%;
  letter-spacing: 0px;
}
@media screen and (max-width: 800px) {
  #news .title h2 span {
    font-size: 0.8rem;
    margin-left: 0.5rem;
  }
}

#news .title .btn_all a {
  color: #fff;
  font-weight: 600;
  text-decoration: none;
  background: url("../img/icon_circle_white.svg") right 0rem top 50% no-repeat;
  background-size: 15px auto;
  padding: 0 20px 0 0;
}
@media screen and (max-width: 800px) {
  #news .title .btn_all a {
    font-size: 0.875rem;
  }
}
#news .title .btn_all a:hover {
  opacity: 0.8;
}

#news .scroll.scroll_on {
  height: 346px;
  overflow-y: scroll;
  -webkit-overflow-scrolling: auto;
  padding-right: 0.5rem;
}
@media screen and (max-width: 592px) {
  #news .scroll.scroll_on {
    height: 250px;
  }
}

#news .scroll::-webkit-scrollbar {
  width: 5px;
}

#news .scroll::-webkit-scrollbar-thumb {
  background-color: #1858C6;
}

#news ul li {
  background-color: rgba(255, 255, 255, 0.8);
  margin-bottom: 1rem;
}
#news ul li:last-child {
  margin-bottom: 0rem;
}

#news ul li a {
  color: #333;
  padding: 0.8rem 1.2rem;
  text-decoration: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media screen and (max-width: 592px) {
  #news ul li a {
    display: block;
    padding: 0.5rem 0.8rem;
  }
}
#news ul li a:hover {
  opacity: 0.8;
}

#news ul li .date {
  font-size: 1.275rem;
  font-weight: 600;
  margin-right: 1rem;
}
@media screen and (max-width: 800px) {
  #news ul li .date {
    font-size: 1.125rem;
  }
}
#bnr {
  width: 1240px;
  margin: 0 auto 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media screen and (max-width: 1320px) {
  #bnr {
    width: 95%;
  }
}
@media screen and (max-width: 800px) {
  #bnr {
    width: 95%;
    display: block;
  }
}
@media screen and (max-width: 592px) {
  #bnr {
    width: 90%;
  }
}

/* ツイッター */
#bnr .bnr_twitter {
  width: 49.2%;
}
@media screen and (max-width: 800px) {
  #bnr .bnr_twitter {
    width: 100%;
    margin-bottom: 1rem;
  }
}
#bnr .bnr_twitter img {
  width: 100%;
}

#bnr .bnr_cleaning a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: #fff;
  border-radius: 10px;
  text-decoration: none;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: 100%;
  color: #333;
  -webkit-transition: 0.4s ease-in-out;
  -o-transition: 0.4s ease-in-out;
  transition: 0.4s ease-in-out;
}
#bnr .bnr_cleaning a:hover {
  opacity: 0.8;
}

#bnr .bnr_cleaning a .photo {
  width: 42%;
}
@media all and (max-width: 1366px) {
  #bnr .bnr_cleaning a .photo {
    width: 45%;
  }
}
@media screen and (max-width: 1024px) {
  #bnr .bnr_cleaning a .photo {
    width: 50%;
  }
}
@media screen and (max-width: 800px) {
  #bnr .bnr_cleaning a .photo {
    width: 30%;
  }
}
@media screen and (max-width: 592px) {
  #bnr .bnr_cleaning a .photo {
    width: 45%;
  }
}
#bnr .bnr_cleaning a .photo img {
  width: 100%;
  border-radius: 10px 0 0 10px;
}

#bnr .bnr_cleaning a .copy {
  width: 58%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0.5rem;
}
@media all and (max-width: 1366px) {
  #bnr .bnr_cleaning a .copy {
    width: 55%;
  }
}
@media screen and (max-width: 1024px) {
  #bnr .bnr_cleaning a .copy {
    width: 50%;
  }
}
@media screen and (max-width: 800px) {
  #bnr .bnr_cleaning a .copy {
    width: 70%;
  }
}
@media screen and (max-width: 592px) {
  #bnr .bnr_cleaning a .copy {
    width: 55%;
  }
}

#bnr .bnr_cleaning a .copy .text1 {
  font-size: 1.5rem;
  line-height: 120%;
  font-weight: 600;
  margin-bottom: 0.2rem;
}
@media all and (max-width: 1366px) {
  #bnr .bnr_cleaning a .copy .text1 {
    font-size: 1rem;
  }
}
@media screen and (max-width: 1024px) {
  #bnr .bnr_cleaning a .copy .text1 {
    font-size: 0.875rem;
    margin-bottom: 0.1rem;
  }
}
@media screen and (max-width: 800px) {
  #bnr .bnr_cleaning a .copy .text1 {
    font-size: 1rem;
  }
}
#bnr .bnr_cleaning a .copy .text2 {
  font-size: 3rem;
  letter-spacing: -1px;
  line-height: 120%;
  color: #6992D7;
  font-weight: 600;
  margin-bottom: 0.5rem;
}
@media all and (max-width: 1366px) {
  #bnr .bnr_cleaning a .copy .text2 {
    font-size: 1.8rem;
    margin-bottom: 0.3rem;
  }
}
@media screen and (max-width: 1024px) {
  #bnr .bnr_cleaning a .copy .text2 {
    font-size: 1.5rem;
  }
}
@media screen and (max-width: 800px) {
  #bnr .bnr_cleaning a .copy .text2 {
    font-size: 1.7rem;
  }
}
@media screen and (max-width: 592px) {
  #bnr .bnr_cleaning a .copy .text2 {
    font-size: 1.5rem;
  }
}

#bnr .bnr_cleaning a .copy .cap {
  font-size: 0.75rem;
}
@media all and (max-width: 1366px) {
  #bnr .bnr_cleaning a .copy .cap {
    font-size: 0.7rem;
  }
}
@media screen and (max-width: 800px) {
  #bnr .bnr_cleaning a .copy .cap {
    font-size: 0.875rem;
  }
}
@media screen and (max-width: 592px) {
  #bnr .bnr_cleaning a .copy .cap {
    font-size: 0.75rem;
  }
}

/* お問い合わせ */
#bnr .bnr_contact {
  width: 49.2%;
}
@media screen and (max-width: 800px) {
  #bnr .bnr_contact {
    width: 100%;
  }
}

#bnr .bnr_contact a {
  display: block;
  background-color: #fff;
  border-radius: 10px;
  text-decoration: none;
  padding: 0.8rem 1rem;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: 100%;
  color: #333;
  -webkit-transition: 0.4s ease-in-out;
  -o-transition: 0.4s ease-in-out;
  transition: 0.4s ease-in-out;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
#bnr .bnr_contact a:hover {
  opacity: 0.8;
}
@media screen and (max-width: 592px) {
  #bnr .bnr_contact a {
    padding: 0.5rem 1rem;
  }
}

#bnr .bnr_contact a .title {
  text-align: center;
  font-weight: 600;
  position: relative;
  margin-bottom: 0.3rem;
}
#bnr .bnr_contact a .title:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  background-color: #707070;
  top: 50%;
  left: 0%;
}

#bnr .bnr_contact a .title span {
  background-color: #fff;
  font-size: 1.7rem;
  line-height: 120%;
  padding: 0 0.5rem;
  position: relative;
  z-index: 2;
}
@media all and (max-width: 1366px) {
  #bnr .bnr_contact a .title span {
    font-size: 1.275rem;
  }
}
@media screen and (max-width: 1024px) {
  #bnr .bnr_contact a .title span {
    font-size: 1.275rem;
  }
}
@media screen and (max-width: 800px) {
  #bnr .bnr_contact a .title span {
    font-size: 1.275rem;
  }
}
#bnr .bnr_contact a .tel_mail {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

#bnr .bnr_contact a .tel {
  font-size: 2.5rem;
  line-height: 120%;
  font-weight: 600;
  margin-right: 1rem;
}
@media all and (max-width: 1366px) {
  #bnr .bnr_contact a .tel {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 1024px) {
  #bnr .bnr_contact a .tel {
    font-size: 1.125rem;
  }
}
@media screen and (max-width: 800px) {
  #bnr .bnr_contact a .tel {
    font-size: 2rem;
  }
}
@media screen and (max-width: 592px) {
  #bnr .bnr_contact a .tel {
    font-size: 1.6rem;
    letter-spacing: -1px;
  }
}
#bnr .bnr_contact a .tel img {
  width: 2rem;
  margin-right: 0.2rem;
  position: relative;
  top: -0.4rem;
}
@media all and (max-width: 1366px) {
  #bnr .bnr_contact a .tel img {
    width: 1.5rem;
    top: -0.2rem;
  }
}
@media screen and (max-width: 1024px) {
  #bnr .bnr_contact a .tel img {
    width: 0.8rem;
    top: 0rem;
  }
}
@media screen and (max-width: 800px) {
  #bnr .bnr_contact a .tel img {
    width: 1.5rem;
    top: -0.4rem;
  }
}
@media screen and (max-width: 592px) {
  #bnr .bnr_contact a .tel img {
    width: 1rem;
  }
}
#bnr .bnr_contact a .tel span {
  font-size: 1rem;
  line-height: 120%;
  position: relative;
  top: -0.1rem;
}
@media screen and (max-width: 1024px) {
  #bnr .bnr_contact a .tel span {
    font-size: 0.8rem;
  }
}
@media screen and (max-width: 592px) {
  #bnr .bnr_contact a .tel span {
    font-size: 0.7rem;
    margin-left: 0.3rem;
  }
}

#bnr .bnr_contact a .mail {
  background-color: #eee;
  padding: 0.5rem 1rem;
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: 1rem;
  line-height: 120%;
  font-weight: 600;
}
@media all and (max-width: 1366px) {
  #bnr .bnr_contact a .mail {
    font-size: 0.875rem;
  }
}
@media screen and (max-width: 1024px) {
  #bnr .bnr_contact a .mail {
    font-size: 0.7rem;
  }
}
@media screen and (max-width: 800px) {
  #bnr .bnr_contact a .mail {
    font-size: 0.875rem;
  }
}
@media screen and (max-width: 592px) {
  #bnr .bnr_contact a .mail {
    padding: 0.3rem 0.5rem;
  }
}
#bnr .bnr_contact a .mail img {
  width: 2rem;
  margin-right: 0.5rem;
}
@media all and (max-width: 1366px) {
  #bnr .bnr_contact a .mail img {
    width: 1.5rem;
  }
}
@media screen and (max-width: 592px) {
  #bnr .bnr_contact a .mail img {
    width: 1.2rem;
    margin-right: 0.2rem;
  }
}

#bnr .bnr_contact a .cap {
  text-align: center;
  font-size: 1.5rem;
  font-weight: 600;
  margin-top: 0.3rem;
}
@media all and (max-width: 1366px) {
  #bnr .bnr_contact a .cap {
    font-size: 1.125rem;
  }
}
@media screen and (max-width: 1024px) {
  #bnr .bnr_contact a .cap {
    font-size: 0.8rem;
  }
}
@media screen and (max-width: 800px) {
  #bnr .bnr_contact a .cap {
    font-size: 0.875rem;
  }
}