@charset "UTF-8";
#footer_sitemap ul {
  justify-content: flex-start; }

#footer_sitemap ul li {
  width: 30rem; }

#main_contents,
#FooterArea {
  font-size: 16px !important; }

@media screen and (min-width: 768px) {
  #main_contents {
    padding: 0 0 8rem !important; } }
@media screen and (max-width: 767px) {
  #main_contents {
    padding: 0 0 6rem !important; } }

/* 既存スタイルリセット
*******************************************************/
body.topPage #Contents {
  padding-left: 0 !important;
  padding-right: 0 !important; }

body.topPage #Contents .GridSet {
  width: auto;
  margin: 0 !important; }

body.topPage #Contents .GridSet .Grid4 {
  padding: 0 !important; }

body.topPage h2, body.topPage h2 span {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: #333333; }

body.topPage .LinkListStyle1 {
  margin-bottom: 0; }

body.topPage .LinkListStyle1 li a {
  color: #595959; }

body.topPage button:focus {
  outline: none; }

/* 共通
*******************************************************/
.contentsBlock {
  width: 100%;
  max-width: 995px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px;
  padding-right: 15px;
  box-sizing: border-box; }

.topTitle {
  margin-bottom: 8px !important;
  padding-bottom: 15px !important;
  border-bottom: solid 1px #a6a6a6 !important;
  text-align: center; }

.topSubTitle {
  margin-bottom: 15px;
  text-align: center;
  font-size: 90%;
  color: #595959; }

.topText01 {
  text-align: center;
  font-size: 90%;
  color: #595959; }

.topicsBtnCover {
  width: 100%;
  max-width: 320px;
  margin: 0 auto; }

.topBtn01 {
  display: inline-block;
  width: 100%;
  padding: 12px;
  border: solid 1px #a6a6a6;
  border-radius: 50px;
  background-color: #ffffff;
  box-sizing: border-box;
  text-align: center;
  text-decoration: none !important;
  font-size: 100%;
  color: #595959 !important;
  transition: 0.2s; }

.topBtn01:hover {
  background-color: #595959;
  color: #ffffff !important; }

.topBtn01 span {
  padding-right: 22px;
  background: url("/image/jp/r1/icon/icon_link_right_l_gray_hd.gif") right 2px center no-repeat;
  background-size: 16px 16px; }

.topBtn01:hover span {
  padding-right: 22px;
  background: url("/image/jp/r1/icon/icon_link_right_l_white_hd.gif") right center no-repeat;
  background-size: 16px 16px; }

/* スライダーエリア
*******************************************************/
#sliderArea {
  background-color: #142451;
  position: relative; }

#sliderArea ul#topSlider {
  position: relative;
  z-index: 11; }

#sliderArea ul#topSlider li a {
  display: block;
  text-decoration: none; }

#sliderArea ul#topSlider li a .sliderTable {
  display: flex;
  flex-direction: row-reverse;
  width: 100%;
  height: 550px; }

#sliderArea ul#topSlider li a .sliderTable .sliderTdImage {
  overflow: hidden;
  width: calc(1077px + ((100vw - 1290px)/2)); }

#sliderArea ul#topSlider li a .sliderTable .sliderTdImage p {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 550px;
  animation-duration: 7.0s;
  animation-fill-mode: forwards;
  opacity: 0;
  transition: 0.2s; }

#sliderArea ul#topSlider li a .sliderTable .sliderTdImage p img {
  width: 100%;
  height: 550px; }

#sliderArea ul#topSlider li.slick-current a .sliderTable .sliderTdImage p {
  animation-name: open; }

#sliderArea ul#topSlider li.slick-current.stopImg a .sliderTable .sliderTdImage p {
  animation-play-state: paused; }

@keyframes open {
  from {
    opacity: 1;
    transform: scale(1); }
  to {
    opacity: 1;
    transform: scale(1.15); } }
#sliderArea ul#topSlider li a .sliderTable .sliderTdImage p img.slideInImg01 {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 10; }

#sliderArea ul#topSlider li.slick-current a .sliderTable .sliderTdImage p img.slideInImg01 {
  animation-delay: 3.0s;
  animation-duration: 1.0s;
  animation-fill-mode: forwards;
  animation-name: fadeout; }

#sliderArea ul#topSlider li.slick-current.stopImg a .sliderTable .sliderTdImage p img.slideInImg01 {
  animation-play-state: paused; }

#sliderArea ul#topSlider li a .sliderTable .sliderTdImage p img.slideInImg02 {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 11;
  opacity: 0; }

#sliderArea ul#topSlider li.slick-current a .sliderTable .sliderTdImage p img.slideInImg02 {
  animation-delay: 3.0s;
  animation-duration: 1.0s;
  animation-fill-mode: forwards;
  animation-name: fadein; }

#sliderArea ul#topSlider li.slick-current.stopImg a .sliderTable .sliderTdImage p img.slideInImg02 {
  animation-play-state: paused; }

@keyframes fadeout {
  from {
    opacity: 1; }
  to {
    opacity: 0; } }
@keyframes fadein {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
/*
#sliderArea ul#topSlider li:nth-child(1) a .sliderTable .sliderTdImage p img {
    background: url("/image/top/renew2023/img_slider01.jpg") center center no-repeat;
    background-size: cover;
} <!-- 画像1枚の場合はこちら↑ -->
*/
#sliderArea ul#topSlider li:nth-child(1) a .sliderTable .sliderTdImage p img.slideInImg01 {
  background: url("/image/top/renew2023/img_slider01_01.png") center center no-repeat;
  background-size: cover; }

#sliderArea ul#topSlider li:nth-child(1) a .sliderTable .sliderTdImage p img.slideInImg02 {
  background: url("/image/top/renew2023/img_slider01_02.png") center center no-repeat;
  background-size: cover; }

#sliderArea ul#topSlider li:nth-child(2) a .sliderTable .sliderTdImage p img.slideInImg01 {
  background: url("/image/top/renew2023/img_slider02_01.png") center center no-repeat;
  background-size: cover; }

#sliderArea ul#topSlider li:nth-child(2) a .sliderTable .sliderTdImage p img.slideInImg02 {
  background: url("/image/top/renew2023/img_slider02_02.png") center center no-repeat;
  background-size: cover; }

#sliderArea ul#topSlider li:nth-child(3) a .sliderTable .sliderTdImage p img.slideInImg01 {
  background: url("/image/top/renew2023/img_slider03_01.png") center center no-repeat;
  background-size: cover; }

#sliderArea ul#topSlider li:nth-child(3) a .sliderTable .sliderTdImage p img.slideInImg02 {
  background: url("/image/top/renew2023/img_slider03_02.png") center center no-repeat;
  background-size: cover; }

#sliderArea ul#topSlider li:nth-child(4) a .sliderTable .sliderTdImage p img.slideInImg01 {
  background: url("/image/top/renew2023/img_slider04_01.png") center center no-repeat;
  background-size: cover; }

#sliderArea ul#topSlider li:nth-child(4) a .sliderTable .sliderTdImage p img.slideInImg02 {
  background: url("/image/top/renew2023/img_slider04_02.png") center center no-repeat;
  background-size: cover; }

#sliderArea ul#topSlider li:nth-child(5) a .sliderTable .sliderTdImage p img.slideInImg01 {
  background: url("/image/top/renew2023/img_slider05_01.png") center center no-repeat;
  background-size: cover; }

#sliderArea ul#topSlider li:nth-child(5) a .sliderTable .sliderTdImage p img.slideInImg02 {
  background: url("/image/top/renew2023/img_slider05_02.png") center center no-repeat;
  background-size: cover; }

#sliderArea ul#topSlider li:nth-child(6) a .sliderTable .sliderTdImage p img.slideInImg01 {
  background: url("/image/top/renew2023/img_slider06_01.png") center center no-repeat;
  background-size: cover; }

#sliderArea ul#topSlider li:nth-child(6) a .sliderTable .sliderTdImage p img.slideInImg02 {
  background: url("/image/top/renew2023/img_slider06_02.png") center center no-repeat;
  background-size: cover; }

#sliderArea ul#topSlider li a.noLink {
  cursor: default; }

#sliderArea ul#topSlider li a .sliderTable .sliderTdText {
  vertical-align: middle;
  transition: 0.2s; }

#sliderArea ul#topSlider li a .sliderTitle {
  background-color: rgba(46, 46, 46, 0.35);
  box-sizing: border-box;
  color: #fff;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-family: 'din-2014','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
  font-size: 112.5%;
  font-style: normal;
  font-weight: 700;
  height: 225px;
  padding-left: calc((100vw - 1290px)/2);
  position: absolute;
  left: 0;
  top: 50%;
  width: calc(360px + (100vw - 1290px)/2);
  z-index: 2; }

#sliderArea ul#topSlider li a .sliderSubText {
  margin-top: 20px;
  font-size: 80%;
  color: #fff; }

/* slick-dots
*******************************************************/
#sliderArea .slick-dots {
  position: absolute;
  bottom: 14.5px;
  right: calc(84.47058823529412% + 38px + 15px);
  z-index: 1000; }

#sliderArea .slick-dots li {
  float: left;
  padding-right: 10px;
  box-sizing: border-box; }

#sliderArea .slick-dots li button {
  background-color: #cbcbcb;
  background-color: transparent;
  border-radius: 3px;
  border: none;
  cursor: pointer;
  display: block;
  height: 6px;
  overflow: hidden;
  padding: 0;
  position: relative;
  text-indent: 100%;
  white-space: nowrap;
  width: 6px; }

#sliderArea .slick-dots li.slick-active button:hover {
  background-color: #C20000;
  border-radius: 50%;
  display: block;
  height: 6px;
  width: 6px; }

#sliderArea .slick-dots li button::before {
  background-color: #cbcbcb;
  border-radius: 50%;
  content: " ";
  display: block;
  height: 6px;
  position: absolute;
  left: 0;
  top: 0;
  width: 6px;
  z-index: 1001; }

#sliderArea .slick-dots li.slick-active button::after {
  background-color: #C20000;
  border-radius: 50%;
  content: " ";
  display: block;
  height: 6px;
  animation-duration: 7.0s;
  animation-timing-function: linear;
  animation-fill-mode: forwards;
  animation-name: bars;
  position: absolute;
  left: 0;
  top: 0;
  width: 6px;
  z-index: 1002; }

#sliderArea .slick-dots li.slick-active.stopBar button::after {
  animation-play-state: paused; }

@keyframes bars {
  from {
    width: 0%; }
  to {
    width: 100%; } }
/* slick-start-stop
*******************************************************/
#sliderArea .slick-start-stop {
  position: absolute;
  left: -100vh;
  right: calc(84.47058823529412%);
  bottom: 0;
  z-index: 50; }

#sliderArea .slick-start-stop .js-play {
  display: none;
  width: 38px;
  height: 38px;
  background: url("/image/top/renew2023/button_play.png") top center no-repeat;
  background-size: 38px 38px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer; }

#sliderArea .slick-start-stop .js-play:hover {
  background: url("/image/top/renew2023/button_play.png") top center no-repeat;
  background-size: 38px 38px; }

#sliderArea .slick-start-stop .js-stop {
  display: none;
  width: 38px;
  height: 38px;
  background: url("/image/top/renew2023/button_stop.png") top center no-repeat;
  background-size: 38px 38px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer; }

#sliderArea .slick-start-stop .js-stop:hover {
  background: url("/image/top/renew2023/button_stop.png") top center no-repeat;
  background-size: 38px 38px; }

#sliderArea .slick-start-stop .js-play.current, #sliderArea .slick-start-stop .js-stop.current {
  display: block; }

/* スライダー下のナビゲーション
*******************************************************/
#designArea {
  background-color: #142451;
  width: 100%; }

#designArea #designAreaIn {
  margin: 0 auto;
  max-width: 1275px;
  position: relative;
  z-index: 20; }

#designArea .contentsBlock {
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 0 auto;
  max-width: none;
  padding: 0;
  position: relative;
  width: 1077px; }

#designArea .contentsBlock::before {
  background-color: #142451;
  content: "";
  display: block;
  height: 48px;
  position: absolute;
  left: -198px;
  top: 0;
  width: 198px; }

#designArea .col {
  position: relative;
  width: 215.4px; }

#designArea .col .designTitle {
  border: none;
  color: #fff;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: 'din-2014','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
  font-size: 100%;
  font-style: normal;
  font-weight: 400;
  height: 48px;
  letter-spacing: 0.075em;
  line-height: 1.22em;
  margin: 0;
  padding: 0;
  position: relative;
  text-align: left;
  text-decoration: none;
  width: 100%; }

#designArea .col:nth-of-type(1) .designTitle {
  background: url("/image/top/renew2023/number_01.png") no-repeat 90% 0/auto 80%; }

#designArea .col:nth-of-type(2) .designTitle {
  background: url("/image/top/renew2023/number_02.png") no-repeat 90% 0/auto 80%; }

#designArea .col:nth-of-type(3) .designTitle {
  background: url("/image/top/renew2023/number_03.png") no-repeat 90% 0/auto 80%; }

#designArea .col:nth-of-type(4) .designTitle {
  background: url("/image/top/renew2023/number_04.png") no-repeat 90% 0/auto 80%; }

#designArea .col:nth-of-type(5) .designTitle {
  background: url("/image/top/renew2023/number_05.png") no-repeat 90% 0/auto 80%; }

#designArea .col .designTitle::before {
  background-color: #fff;
  content: "";
  display: block;
  height: 60%;
  position: absolute;
  left: 0;
  top: 0;
  transform: translateY(40%);
  width: 1px; }

#designArea .col:last-child .designTitle::after {
  background-color: #fff;
  content: "";
  display: block;
  height: 60%;
  position: absolute;
  right: 0;
  top: 0;
  transform: translateY(40%);
  width: 1px; }

#designArea .col .designTitle span {
  background: url("/image/top/renew2023/icon_link_down_white.png") right center no-repeat;
  background-size: 12px 8px;
  color: #fff;
  padding-right: 22px; }

#designArea .col .designTitle:hover span {
  background: url("/image/top/renew2023/icon_link_down_blue.png") right center no-repeat;
  background-size: 12px 8px;
  color: #4081bc;
  transition-duration: .3s; }

#designArea .col .designLinkList {
  background-color: #142451;
  box-sizing: border-box;
  display: none;
  padding: 10px 15px 15px;
  position: absolute;
  width: 100%; }

#designArea .col .designTitle + .designLinkList.active {
  background-color: #142451;
  position: absolute;
  left: 0;
  top: 48px; }

#designArea .col .designLinkList li {
  line-height: 200%; }

#designArea .col .designLinkList li a {
  padding-right: 17px;
  background: url("/image/top/renew2023/icon_link_right_white.png") right center no-repeat;
  background-size: 8px 12px;
  color: #fff;
  display: block;
  text-decoration: none; }

#designArea .col .designLinkList li a:hover {
  background: url("/image/top/renew2023/icon_link_right_blue.png") right center no-repeat;
  background-size: 8px 12px;
  color: #4081bc;
  transition-duration: .3s; }

/* banner area
*******************************************************/
#bannerArea {
  padding: 50px 0 0 0; }

.bannerBlock {
  margin: 0 auto;
  max-width: 1275px;
  width: 100%; }

.bannerBlock .banner {
  margin-bottom: 45px;
  width: 100%; }

.bannerBlock .banner a {
  display: block;
  position: relative; }

.bannerBlock .banner a::after {
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  content: "";
  display: block;
  height: 22px;
  position: absolute;
  top: 50%;
  right: 50px;
  transform: rotate(45deg) translateY(-60%);
  width: 22px; }

.bannerBlock .banner a:hover::after {
  right: 40px;
  transition-duration: .5s; }

.bannerBlock .banner a .textArea {
  color: #fff;
  position: absolute;
  left: 12.15686274509804%;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1; }

.bannerBlock .banner a .textArea .subText {
  font-family: "Lexend", sans-serif;
  font-optical-sizing: auto;
  font-size: 1rem;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.1em; }

.bannerBlock .banner a .textArea .mainText {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-size: 1.5rem;
  font-weight: 500;
  font-style: normal; }

.bannerBlock .banner a:hover .ImgOnlyStyle img {
  opacity: .8;
  transition-duration: .5s; }

/* solution area
*******************************************************/
#solutionArea {
  padding: 40px 0 50px 0;
  background: url("/image/top/renew2023/bg_solution.png") top center no-repeat;
  background-size: cover; }

#solutionArea .col3Block {
  width: 100%;
  margin-top: 50px; }

#solutionArea .col3Block .col {
  float: left;
  width: 32.549019607%;
  min-height: 225px;
  margin-right: 1.176470588%;
  margin-bottom: 15px;
  padding: 15px;
  border: solid 1px #bfbfbf;
  border-top-right-radius: 12px;
  border-bottom-left-radius: 12px;
  background-color: #ffffff;
  box-sizing: border-box; }

#solutionArea .col3Block .col:nth-child(3n) {
  margin-right: 0; }

#solutionArea .col3Block .colEmpty {
  display: table;
  border: none !important;
  background-color: transparent !important; }

#solutionArea .col3Block .colEmptyIn {
  display: table-cell;
  text-align: center;
  vertical-align: middle; }

.solutionLink dt {
  margin-bottom: 20px; }

.solutionLink dt a {
  padding-right: 22px;
  background: url("/image/jp/r1/icon/icon_link_right_l_hd.gif") right 2px center no-repeat;
  background-size: 16px 16px;
  text-decoration: none;
  font-size: 120%;
  font-weight: bold;
  color: #595959; }

.solutionLink dt a:hover {
  background: url("/image/jp/r1/icon/icon_link_right_l_hd.gif") right center no-repeat;
  background-size: 16px 16px;
  text-decoration: underline; }

/* topics area
*******************************************************/
#topicsArea {
  padding: 50px 0; }

.topicsLinkList {
  max-width: 850px;
  margin: 40px auto 50px auto;
  border-top: solid 1px #d9d9d9; }

.topicsLinkList > li {
  display: table;
  width: 100%;
  border-bottom: solid 1px #d9d9d9;
  text-decoration: none; }

.topicsLinkList > li .topicsYmd {
  display: table-cell;
  width: 140px;
  padding: 15px 0;
  font-size: 90%;
  color: #595959; }

.topicsLinkList > li .topicsLink {
  display: table-cell;
  padding: 10px 0;
  font-size: 90%;
  color: #595959; }

/* service area
*******************************************************/
#serviceArea {
  padding: 50px 0;
  background-color: #f2f2f2; }

.serviceLinkList {
  margin: 50px 0 0 0; }

.serviceLinkList li {
  float: left;
  width: 145px;
  margin-right: 19px;
  margin-bottom: 50px; }

.serviceLinkList li:nth-child(6n) {
  margin-right: 0; }

.serviceLinkList li a {
  display: block;
  text-align: center;
  text-decoration: none; }

.serviceLinkList li a .serviceCircle {
  display: block;
  width: 145px;
  height: 145px;
  margin-bottom: 10px;
  border: solid 1px #142451;
  border-radius: 145px;
  background-color: #ffffff;
  box-sizing: border-box;
  transition: 0.2s; }

.serviceLinkList li a:hover .serviceCircle {
  background-color: #ecfdfe !important; }

.serviceLinkList li:nth-child(1) a .serviceCircle {
  background: #ffffff url("/image/top/renew2023/icon_service01.png") center center no-repeat;
  background-size: 90px; }

.serviceLinkList li:nth-child(2) a .serviceCircle {
  background: #ffffff url("/image/top/renew2023/icon_service02.png") center center no-repeat;
  background-size: 90px; }

.serviceLinkList li:nth-child(3) a .serviceCircle {
  background: #ffffff url("/image/top/renew2023/icon_service03.png") center center no-repeat;
  background-size: 90px; }

.serviceLinkList li:nth-child(4) a .serviceCircle {
  background: #ffffff url("/image/top/renew2023/icon_service04.png") center center no-repeat;
  background-size: 90px; }

.serviceLinkList li:nth-child(5) a .serviceCircle {
  background: #ffffff url("/image/top/renew2023/icon_service05.png") center center no-repeat;
  background-size: 90px; }

.serviceLinkList li:nth-child(6) a .serviceCircle {
  background: #ffffff url("/image/top/renew2023/icon_service06.png") center center no-repeat;
  background-size: 90px; }

.serviceLinkList li a .serviceText {
  padding-right: 17px;
  background: url("/image/jp/r1/icon/icon_link_right_hd.gif") right 2px center no-repeat;
  background-size: 16px 16px;
  font-size: 90%;
  color: #595959; }

.serviceLinkList li a:hover .serviceText {
  background: url("/image/jp/r1/icon/icon_link_right_hd.gif") right center no-repeat;
  background-size: 16px 16px;
  text-decoration: underline; }

/* project area
*******************************************************/
#projectArea {
  padding: 50px 0; }

#projectArea .col3Block {
  width: 100%;
  margin-top: 50px; }

#projectArea .col3Block a.col {
  position: relative;
  float: left;
  display: block;
  width: 32.549019607%;
  min-height: 330px;
  margin-right: 1.176470588%;
  margin-bottom: 40px;
  padding-bottom: 30px;
  background-color: #f2f2f2;
  box-sizing: border-box;
  text-decoration: none;
  line-height: 140%;
  transition: 0.2s; }

#projectArea .col3Block a.col:hover {
  background-color: #dddddd; }

#projectArea .col3Block a.col:nth-child(3n) {
  margin-right: 0; }

#projectArea .col3Block a.col .projectColImage img {
  width: 100%;
  height: auto; }

#projectArea .col3Block a.col .projectColText {
  display: block;
  padding: 15px; }

#projectArea .col3Block a.col .projectColText .pctArrow {
  padding-right: 17px;
  background: url("/image/jp/r1/icon/icon_link_right_hd.gif") right 2px center no-repeat;
  background-size: 16px 16px;
  font-size: 80%;
  color: #595959; }

#projectArea .col3Block a.col:hover .projectColText .pctArrow {
  text-decoration: underline;
  background: url("/image/jp/r1/icon/icon_link_right_hd.gif") right 0px center no-repeat;
  background-size: 16px 16px; }

#projectArea .col3Block a.col .projectColText .pctDivision {
  position: absolute;
  bottom: 10px;
  left: 15px;
  font-size: 70%;
  color: #595959; }

.projectBtnCover {
  width: 100%;
  max-width: 320px;
  margin: 10px auto 0 auto; }

/* clearFix
*******************************************************/
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0; }

*:first-child + html .clearfix {
  zoom: 1; }

.serviceLinkList:after,
.col3Block:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0; }

*:first-child + html .serviceLinkList,
*:first-child + html .col3Block {
  zoom: 1; }
