@charset "UTF-8";

/*resetCSS*/
html, body, h1, h2, h3, h4,
ul, ol, dl, li, dt, dd, p, div, span,
img, a, table, tr, th, td, figure {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: normal;
  font-size: 100%;
  vertical-align: baseline;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
 
article, header, footer, aside, figure, figcaption, nav, section {
  display: block;
}

button{
	background-color: transparent;
	border: none;
	cursor: pointer;
	outline: none;
	padding: 0;
	appearance: none;
}

/*resetCSS*/

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
/* 2 */
}

/* 100%=1em=1rem＝16px  remの設定
https://www.pc-koubou.jp/magazine/23912*/
html {
  font-size: 100%;
}

body {
	-webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
	margin: 0;
	line-height: 1.5;
	font-weight: 300;
}

/*paddingを、幅に含めないようにする→普通にいれる*/
* {
  box-sizing: border-box;
}
 
ol, ul {
  list-style: none;
  list-style-type: none;
}
.text-center {
  text-align: center;
}

@media screen and (max-width: 415px){
.text-center-sp {
	text-align: center;
}
}

/* ----------------------------------------------------------------
	font size
	https://type-scale.com/
-----------------------------------------------------------------*/
h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: 400;
	line-height: 1.5;
	margin: 0;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	letter-spacing: 0.05em;
}

h1 {
	font-size: 2.369rem;
}

h2 {
	font-size: 1.777rem;
}

h3 {
	font-size: 1.333rem;
}

h4 {
	font-size: 1rem;
}

p,
a,
button {
	font-size: 1rem;
  line-height: 1.8;
}

time{
	font-size: 0.8rem;
}

p {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

a{
	text-decoration: none;
	display: inline-block;
}

@media screen and (min-width: 769px){
h1 {
	font-size: 3.157rem;
}

h2 {
	font-size: 2.369rem;
}

h3 {
	font-size: 1.777rem;
}

h4 {
	font-size: 1.333rem;
}	

time {
	font-size: 1rem;
}
}

@media screen and (min-width: 1441px){
h1 {
	font-size: 4.209rem;
}

h2 {
	font-size: 3.157rem;
}

h3 {
	font-size: 2.369rem;
}

h4 {
	font-size: 1.777rem;
}

h5 {
	font-size: 1.333rem;
}

h6 {
	font-size: 1rem;
}
}

/* ----------------------------------------------------------------
	font-color
-----------------------------------------------------------------*/
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
time {
	color:#4D4D4D;
}

.color-white{
	color: #ffffff;
}

.color-blue{
	color: #3C63AF;
}


.color-red{
	color: #F9363E;
}

/* ----------------------------------------------------------------
	font-style
-----------------------------------------------------------------*/
body {
	font-family: Georgia,'Vollkorn','Noto Serif JP', 'Times New Roman', Times, serif;

}

.en-text{
	font-family: Georgia,'Vollkorn','Noto Serif JP', 'Times New Roman', Times, serif;
}

/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
.font-bold {
	font-weight: 600;
}

.text-shadow{
	text-shadow: 7px 7px 25px #000000;
}

/* ----------------------------------------------------------------
	img style
-----------------------------------------------------------------*/
a:hover img {
  filter: alpha(opacity＝70);
  -moz-opacity: 0.7;
  opacity: 0.7;
  /*画像を70%の不透明度に
  もし50%にしたいときは
  上から50、0.5、0.5にします*/
}

img{
	width: 100%;
	display: block;
}

/* ----------------------------------------------------------------
	button Styles
-----------------------------------------------------------------*/
.button {
  display: inline-block;
  width: 200px;
  height: 54px;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
  position: relative;
  z-index: 3;
  background-color: #3A67BF;
  border: 2px solid #3A67BF;
  color: #fff;
  line-height: 50px;
  font-size: 1rem;
}

.button::before,
.button::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
  left: 0;
  width: 100%;
  height: 50%;
  background-color: #3A67BF;
}

.button,
.button::before,
.button::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.button:hover {
  background-color: #fff;
  border-color: #3A67BF;
  color: #3A67BF;
}
.button::before {
  top: 0;
}
.button::after {
  bottom: 0;
}
.button:hover::before,
.button:hover::after {
  height: 0;
  background-color: #3A67BF;
}

@media screen and (max-width: 768px){
  .button {
    width: 150px;

} 
}


/* ----------------------------------------------------------------
	banner-layout
-----------------------------------------------------------------*/
.banner_button_layout{
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 40px;
}



.banner_button_text{
	font-size: 18px;
}

.banner_button{
	color: #ffffff;
	border: 4px solid #ffffff;
	font-weight: normal;
	z-index: 1;
	overflow: hidden;
	border-radius: 42px;
	width: 300px;
	height: 60px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.banner_button:hover{
	color: #02349D;
	background-color: #ffffff;
}

@media screen and (min-width: 415px){
.banner_button_text{
	font-size: 20px;
}
}

@media screen and (min-width: 768px){
.banner_text, .banner_button_text{
	margin-top: 40px;
}

.banner_button_layout{
	margin-top: 4rem;
}
}

@media screen and (min-width: 1024px){
.banner_contents{
	display: flex;
	justify-content: space-between;
	align-items: center;
	text-align: left;
}

.banner_text, .banner_button_text{
	margin-top: 0px;	
}
}

/* ----------------------------------------------------------------
	sp-hidden,sp-appear,tablet-hidden,tablet-appear
-----------------------------------------------------------------*/
@media screen and (min-width: 415px){
.sp-appear{
	display: none;
}
}

@media screen and (max-width: 414px){
.sp-hidden{
	display: none;
}
}

@media screen and (min-width: 769px){
.tablet-appear{
	display: none;
}
}

@media screen and (max-width: 768px){
.tablet-hidden{
	display: none;
}
}

@media screen and (min-width: 1081px){
.laptop-appear{
	display: none;
}
}

@media screen and (max-width: 1080px){
.laptop-hidden{
	display: none;
}
}

/* ----------------------------------------------------------------
	section_layout
-----------------------------------------------------------------*/


.sub-section{
	padding: 32px 0;
}

.container{
	margin: 0 20px;
}

@media screen and (min-width: 415px){
.container{
	margin: 0 8%;	
}


.sub-section{
	padding: 40px 0;
}
}

@media screen and (min-width: 1200px){
.container{
	margin: 0 2rem;	
}
}

@media screen and (min-width: 1367px){
.container{
	margin: 0 3rem;	
}
}

/* ----------------------------------------------------------------
	section_title
-----------------------------------------------------------------*/
.section_title, .section_sub_title{
	text-align: center;
}

.section_sub_title{
	margin-top: 10px;
}

.section_tertiary_title{
	text-align: center;
	position: relative;
}

.section_tertiary_title:before {
  content: '';
  position: absolute;
  bottom: -16px;
  display: inline-block;
  width: 180px;
  height: 1px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: #707070;
}

@media screen and (min-width: 1367px){
.section_tertiary_title:before {
	width: 320px;
}
}

/* ----------------------------------------------------------------
	js
-----------------------------------------------------------------*/
.fadeIn {
  transform: translate3d(0, 40px,0px);
	transition: all 2.5s ease;
  opacity: 0;
}

.fadeIn.animated {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

.left-fadein{
	transform: translate3d(0, 40px, 0);
	transition: all 2.5s ease;
  opacity: 0;
}

.left-fadein.animated {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

@media screen and (min-width: 415px){
.left-fadein{
	transform: translate3d(-60px, 0px, 0);
	transition: all 700ms ease-out;
  opacity: 0;
}
}
/*---------------------------------------------------*/
/*	1.header
/*---------------------------------------------------*/
.header{
z-index: 999;
background-color:#D9D8DE; 

}

#global-nav {
  /*余白が入らないように*/
  margin: 0;
  /*以下装飾*/
  width: 100%;
  z-index: 998;
  background-color:rgba(255, 255, 255, 0.1); 
}

#global-nav.m_fixed {
  position: fixed;
  left: 0;
  top: 0;
}

.header-content{
  display: flex;
  justify-content: space-between;
  align-items: center;
	padding: 20px;
	width: 100%;
}

.header-left-logo{
  width: 142px;
  height: 50px;
}

.header-right-text{
	display: none;
}

.menu {
	margin: 18px 0px;
	color: #4D4D4D;
  z-index: 999; 

}

.toggle {
/*トグルボタンのスタイルを指定*/
	display: block;
	position: absolute;
	right: 20px;
	top: 30px;
	width: 48px;
	height: 48px;
	cursor: pointer;
	z-index: 1000; 
}

.toggle__icon {
	display: block;
	position: absolute;
	width: 40px;
	border-bottom: solid 2px #4D4D4D;
	-webkit-transition: .35s ease-in-out;
	/*変化の速度を指定*/
	-moz-transition: .35s ease-in-out;
	/*変化の速度を指定*/
	-o-transition: .35s ease-in-out;
	transition: .35s ease-in-out;
	/*変化の速度を指定*/
	left: 6px; }
	.toggle__icon:nth-child(1) {
		top: 9px; }
	.toggle__icon:nth-child(2) {
    /* width: 30px; */
		top: 18px; }
	.toggle__icon:nth-child(3) {
    /* width: 20px; */
		top: 27px; 
}


.toggle.active{
	position: fixed;
	right: 20px;
	top: 30px;
}

.toggle.active span:nth-child(1) {
/* 最初のspanをマイナス45度に */
	top: 18px;
	left: 6px;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg); 
}

.toggle.active span:nth-child(2) {
	/* 2番目のspanを45度に */
	top: 18px;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg); 
}

.toggle.active span:nth-child(3) {
	/* 3番目のspanを45度に */
	top: 18px;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg); 
}

.nav-menu {
	position: fixed;
	z-index: 800;
	top: 0;
	left: 0;
  background-color:#D9D8DE; 
	color: #333333;
	text-align: center;
	width: 100%;
	-webkit-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
	transform: translateY(-100%);
	-webkit-transition: all 0.6s;
	-o-transition: all 0.6s;
	transition: all 0.6s;
	border-bottom: solid 1px #02349D;
  /* ここにopacityで、スクロールで消えるのなくなる   opacity: 0;*/

}

.list {
	width: 100%;
	margin: 0 auto;
	padding: 0; 
}

.list__content {
	font-size: 1.1em;
	list-style-type: none;
	padding: 0;
	width: 100%;
	border-bottom: 1px solid #02349D; 
}

.list__link {
	display: block;
	/*クリックできる領域を広げる*/
	color: #000000;
	padding: 1em 0; 
}

.nav-menu.active {
	-webkit-transform: translateY(0%);
	-ms-transform: translateY(0%);
	transform: translateY(0%); 
    /* ここにopacityで、スクロールで消えるのなくなる opacity: 1;*/
  
}

@media screen and (min-width: 415px){
.header-content{
	padding: 20px 60px;
}

.menu {
	margin: 20px 0px;
	color: #4D4D4D;
}

.toggle {
  right: 60px;
	top: 28px;
}

.toggle.active{
  right: 60px;
	top: 28px;
}
}

@media screen and (min-width:1200px) {
.menu-right {
	display:none;
}

.header-content{
	padding: 20px 100px;
}

.menu {
	margin: 0 20px 0 0;
	color: #000000;
}

.menu-margin-right{
	margin-right: 24px;
}

.header-right-text{
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
}

@media screen and (min-width: 1441px){
.header-content{
	padding: 20px 180px;
}

.menu {
	margin-right: 32px;
}

.menu-margin-right{
	margin-right: 40px;
}	
}

/*---------------------------------------------------*/
/*	/1.header
/*---------------------------------------------------*/

/*---------------------------------------------------*/
/*	2.top
/*---------------------------------------------------*/
.top{
	padding: 0px 0 60px;
}

.top_contents{
	display: block;
}

.top_text{
	text-align: left;
  font-size: 1rem;
}

.top_container{
  margin: 0 14rem;
}

@media screen and (max-width: 1200px){
  .top_container{
    margin: 0 6rem;
  }
}

@media screen and (max-width: 760px){
  .top_container{
    margin: 0 4rem;
  }
}

@media screen and (max-width: 415px){
  .top_container{
    margin: 0 2rem;
  }
}

.top_text_wrapper{
	margin-top: 24px;
}

.top_text, .top_button{
	margin-top: 20px;
}

.scroll-image{
	position: fixed;
	bottom: 0%;
  left: 50%;
  -webkit-transform : translate(-50%,-50%);
	transform : translate(-50%,-50%);
	z-index: 999;
}

.scroll-img{
	width: 32px;
	height: 48px;
}

.mainv_back{
  position: relative;
}

.main_copy{
  color: #fff;
  font-size: 2.4rem;
  line-height: 1.8;
  position: absolute;
  font-weight: bold;
  top: 30%;
  left: 0;
  right: 0%;
  /* -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%); */
  text-align: center;
  margin:0;
  padding:0;
  z-index: 1;
}


@media screen and (min-width: 769px){

.top_text{
	text-align: left;
  font-size: 1.5rem;
}

.top_text_wrapper{
	width: 40%;
	margin-top: 0px;
}

.top_image_wrapper{
	width: 100%;
}

.top_text, .top_button{
	margin-top: 40px;
}

.main_copy{
  font-size: 6rem;
  line-height: 1.8;
 
}
.scroll-image{
	position: fixed;
	bottom: 2%;
  left: 50%;
  -webkit-transform : translate(-50%,-50%);
  transform : translate(-50%,-50%);
}

.scroll-img{
	width: 40px;
	height: 60px;
}
}

@media screen and (min-width: 1700px){
.top{
	padding: 200px 0;
}

.top_text_wrapper{
	width: 36%;
}

.top_image_wrapper{
	width: 54%;
}

.top_text, .top_button{
	margin-top: 40px;
}
}

/*---------------------------------------------------*/
/*	/2.top
/*---------------------------------------------------*/

/*---------------------------------------------------*/
/*	3.concept
/*---------------------------------------------------*/
.concept_wrapper{
  height: 100vh;
}

.con_wrap{
  position: relative;
  max-width: 85%;
  margin: 0 auto;
  padding: 0 40px;
}

.ceo_img_wrap{
  position: relative;
}

.title_text{
  position: absolute;
  bottom: 2rem;
  right: 2rem;
  z-index: 4;
  font-weight: 300;
  font-size: 5rem;
}

.title_sub_text{
  position: absolute;
  bottom: 0rem;
  right: 4rem;
  z-index: 4;
  font-weight: 300;
  font-size: 2rem;
}

.ceo_img{
position: absolute;
right: 0;
top: 2rem;
}

.ceo_img_in{
-webkit-box-shadow: 50px 50px 0 0 #dedede;
box-shadow: 50px 50px 0 0 #dedede;
width: 90%;
}

.line{
margin-bottom: 0.5em;
}

.line span {
  display: inline-block;
  background: #000;
  padding: 4px 15px;
  color: #fff;
  font-size: 2rem;
  font-weight: normal;
}

.concept_lead{
position: relative;
margin-bottom: 25px;
-webkit-transform: translateY(50px);
-ms-transform: translateY(50px);
transform: translateY(50px);
/* -webkit-transition: 1.2s 0.6s;
-o-transition: 1.2s 0.6s;
transition: 1.2s 0.6s; */
}

.concept_text{
position: relative;
margin-bottom: 3em;
font-size: 1.1rem;
line-height: 1.8;
}

.concept_lead2 {
  position:  relative;
  z-index: 1;
  padding: 50px;
  width: 60%;
  -webkit-box-shadow:1px 1px 20px 2px #e7e7e7;
  box-shadow: 1px 1px 20px 2px #e7e7e7;
  margin-top: 11rem;
}

.concept_lead2 {
  background:#fff;
  -webkit-transform: translateY(50px);
  -ms-transform: translateY(50px);
  transform: translateY(50px);
  /* -webkit-transition: 1.2s 0.8s;
  -o-transition: 1.2s 0.8s;
  transition: 1.2s 0.8s; */
}

@media screen and (max-width: 1080px){

  .ceo_img{
    position: absolute;
    right: 0;
    top: 8rem;
    }
    

  .concept_lead {
    position: absolute;
    top: 17rem;
  }


  .concept_lead2 {
    position: absolute;
    top: 17rem;
    width: 70%;
  }
}

@media screen and (min-width: 771px){
  .sp_ceo_img_in{
    display: none;
  }
}

@media screen and (max-width: 770px){
  
  .title_text{
  bottom: 2rem;
  right: 12rem;
  }

  .title_sub_text{
    bottom: 0rem;
    right: 14rem;
  }

  .ceo_img {
    position: absolute;
    right: 0;
    top: 6rem;
  }

  .ceo_img_in{
display: none;
  }

.concept_lead {
    position: absolute;
    top: 10rem;
}
  .concept_lead2 {
    position: absolute;
    top: 6rem;
    padding: 5%;
    width: 85%;
}

.line span {
  padding: 4px 15px;
  font-size: 1.6rem;
}

}

@media screen and (max-width: 520px){
  .line span {
    font-size: 1.4rem;
  }

  .title_text{
    bottom: 2rem;
    right: 12rem;
    font-size: 3rem;
    }
  
    .title_sub_text{
      bottom: 0rem;
      right: 12rem;
      font-size: 1.3rem;
    }

    .concept_lead {
      left: 0;
    }

    .concept_lead2 {
      position: absolute;
      top: 6rem;
      left: 0;
      padding: 5%;
      width: 100%;

  }

}


@media screen and (max-width: 420px){
  .line span {
    font-size: 1.2rem;
  }
}

/*---------------------------------------------------*/
/*	/3.concept
/*---------------------------------------------------*/

/*---------------------------------------------------*/
/*	4.Our Business
/*---------------------------------------------------*/
.title,.title_sub{
  text-align: center;
}

.title_sub{
  margin-bottom: 2rem; 
}

.ex_text{
  width: 60%;
  margin:0 auto;
  margin-bottom: 2rem; 
}

.figure_wrap{
  position: relative;
}

.business_button{
  position: absolute;
  top: 50%;
  right: 0;
  left: 0%;
  text-align: center;
}

.button_text{
  position: relative;
  margin-bottom: 3em;
  font-size: 1.1rem;
  line-height: 1.8;
}

@media screen and (max-width: 769px){



  .button_text{
display: none;
  }

.ex_text{
  width: 100%;

}
}
/*---------------------------------------------------*/
/*	/4.Our Business
/*---------------------------------------------------*/



/*---------------------------------------------------*/
/*	5.SDGs
/*---------------------------------------------------*/
.action_wrapper{
  margin-top: 4rem;
}

.action_button{
  text-align: center;
}

/*---------------------------------------------------*/
/*	/5.SDGs
/*---------------------------------------------------*/


/*---------------------------------------------------*/
/*	6.Company
/*---------------------------------------------------*/
.company_wrapper{
  margin-top: 4rem;
  background-color: #D7DADE;
  padding: 2rem 0 8rem;
}

.comp_in{
  display: flex;
  flex-direction: row-reverse;
}


/*** レスポンシブテーブルデザイン ***/
.company_table{
  width:70%;
  overflow: hidden;
  word-break: break-all;
  word-wrap: break-word;
  margin: 5rem 2rem 0 10rem;
}
 
.company_table th{
  padding: 6px 8px 5px;
  border-top: solid 1px #ffffff;
  width: 30%;
  overflow: hidden;
  font-style: normal;
  font-size: 100%;
  text-align: left;
  word-break: break-all;
  word-wrap: break-word;
  vertical-align: top;
  background-color: #D7DADE;
}
 
.company_table td{
padding: 5px 10px;
text-align: left;
vertical-align: top;
color: #4D4D4D;
background-color: #D7DADE;
border-top: solid 1px #fff;
overflow: hidden;
word-break: break-all;
word-wrap: break-word;
}
 
@media (max-width: 400px){
.company_table th{
  width:100%;
  display:block;
  margin: 0 auto;
  border:none;
  border-radius: 3px;
}
.company_table td{
  display: list-item;
  width: 100%;
  border-top: none !important;
}

}
/* table end */

@media screen and (max-width: 769px){
  .comp_in{
    display: block;
    }
  
    .company_table{
      width:100%;
      margin: 0;
    }    

}

/* map */

.access__map {
  -ms-flex-preferred-size: calc(100% - 420px);
  flex-basis: calc(100% - 420px);
  width: calc(100% - 420px);
  max-width: 100%;
  height: auto;
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1;
}

@media (max-width: 1023px){
.access__map {
    width: 100%;
    max-width: 600px;
    margin: 30px auto 0;
}}


@media (max-width: 1023px){
.access__map__embed {
    height: 375px;
}
}


.access__map__embed {
    position: relative;
    background-color: #ccc;
    box-shadow: 30px 30px 0 #4D4D4D;

}


.access__map__embed iframe {
  display: block;
  width: 100%;
  height: 30rem;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}


.access__map__link {
  display: block;
  width: 240px;
  height: 64px;
  position: relative;
  margin: -32px auto 0;
  background-color: #ffffff;
}


.access__map__link:before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: rgb(255, 255, 255);
  position: absolute;
  left: 0;
  bottom: 0;
}


.access__map__link__button {
  display: block;
  width: 100%;
  height: 64px;
  background-color:#3A67BF;
  opacity: 1!important;
}


.access__map__link__label {
  font-weight: 400;
  font-style: normal;
  display: block;
  text-align: center;
  font-size: 18px;
  line-height: 24px;
  padding: 20px 0;
  color: #fff;
}


.access__map__link__gradient {
  position: absolute;
  width: 80px;
  height: 2px;
  left: 50%;
  bottom: 0;
  -webkit-transform: translate(-50%);
  -ms-transform: translate(-50%);
  transform: translate(-50%);
  z-index: 1;
  background-color: rgb(255, 255, 255);
  -webkit-transition: width .5s cubic-bezier(.19,1,.22,1);
  -o-transition: width .5s cubic-bezier(.19,1,.22,1);
  transition: width .5s cubic-bezier(.19,1,.22,1);
}
/* map end */

/* .gmap {
  height: 0;
  overflow: hidden;
  padding-bottom: 56.25%;
  position: relative;
  }
  
  .gmap iframe {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  } */

/*---------------------------------------------------*/
/*	6./Company
/*---------------------------------------------------*/


/*---------------------------------------------------*/
/*	7.news
/*---------------------------------------------------*/
.News_wrapper{
  padding: 4rem 0;
}


.info{
  text-align: center;
width: 80%;
margin: 0 auto;
}

.info dl {
  border-bottom: 1px solid #ccc;
  padding: 10px 0;
  font-size: 1rem;
  }
  .info dt {
  padding-bottom: 6px;
  font-size: 1rem;

  }
  
  @media screen and (min-width: 768px) {
  .info dt {
  clear: left;
  float: left;
  width: 22%;
  }
  .info dd {
  margin-left: 16%;
  }
  }


  @media screen and (max-width: 767px) {
  .News_wrapper{
    padding: 1rem 0;
  }
}


/*---------------------------------------------------*/
/*	7.contact-banner
/*---------------------------------------------------*/
.contact-banner{
	background-color: #D7DADE;
  padding: 5rem 0 3rem;
}

.contact_txt_in{
  display: block;
}

.contact_container{
  margin: 0 16rem;
}

.banner_text{
  font-size: 1.4rem;
  line-height: 1.8;
  
}

@media screen and (max-width: 768px) {
  .contact_container{
    margin: 0 4rem;
  }
  .banner_text{
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 420px) {
  .contact_container{
    margin: 0 2rem;
  }
  .banner_text{
    font-size: 1rem;
  }
}

.sns_in{
  margin: 1rem auto;
}
.sns_icon{
display: flex;
justify-content: center;
align-items:center;
}
/*---------------------------------------------------*/
/*	8.footer-menu
/*---------------------------------------------------*/
.footer-menu{
	margin-top: 16px;
}

.footer-menu-margin-top{
	margin-top: 0;
}

.footer-menu-margin-right, .footer-menu-sp-margin-right{
	margin-right: 0;
}

.footer-menu_contents{
	display: none;
}

@media screen and (min-width: 415px){
.footer-menu_wrapper{
	display: flex;
	justify-content: center;
	align-items: center;
}

.footer-menu_wrapper:nth-child(2){
	margin-top: 32px;
}

.footer-menu{
	margin-right: 16px;
}

.footer-menu{
	margin-top: 0px;
}
}

@media screen and (min-width: 870px){
.footer-menu_contents{
	display: flex;
	justify-content: center;
	align-items: center;
}

.footer-menu_wrapper:nth-child(2){
	margin-top: 0px;
}


.footer-menu, .footer-menu-sp-margin-right{
	margin-right: 32px;
}

.footer-menu-margin-right{
	margin-right: 0;
}
}

@media screen and (min-width: 1024px){
.footer-menu{
	margin-right: 40px;
}
}

/*---------------------------------------------------*/
/*	9.footer-menu
/*---------------------------------------------------*/

.footer_logo{
  width: 20%;
  margin: 0 auto;
}

.footer-sub-menu-section{
	background-color: #F4F5F7;
}

.footer-sub-menu_wrapper > li:nth-child(n+2){
	margin-top: 20px;
}

.copyright{
	font-size: 12px;
	margin-top: 20px;
  text-align: center;
}

@media screen and (min-width: 870px){
.footer-sub-menu_contents{
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}

.copyright{
	margin-top: 0px;
}

.copyright{
	font-size: 16px;
	margin-top: 20px;
}

.footer_logo{
  width: 5%;
}

}

@media screen and (min-width: 1367px){
.footer-sub-menu_wrapper{
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.footer-sub-menu_wrapper > li:nth-child(n+1){
	margin: 0 0 0 40px;
}
}

/*---------------------------------------------------*/
/*	10.vision
/*---------------------------------------------------*/


.mv_wrap{
  background-color: #DADBDF;
  padding: 1rem 0;
}
.vision{
  margin-top: 2rem;

}

.vision_belt{
  font-size: 4rem;
  color: #fff;
  background-color: #000000;
  padding: 1rem 4rem;
  width: 60%;
  text-align: end;
  z-index: 2;

}

.vs_container{
  width: 40%;
  margin: 0 2rem 0 auto;
}

.vm_title{
  font-size: 4rem;
  margin: 2rem 0 3rem;
}

.back_logo{
  width: 30%;
  position: absolute;
  top: 20rem;
  left:  6rem;
  z-index: 1;
}

.vm_text{  
  font-size: 1.2rem; 
  width: 80%;
  line-height: 2;
}

.ms_container{
  width: 60%;
  margin: 0 0 0 8rem;
}


.mission_belt{
  position: relative;
  font-size: 4rem;
  color: #000000;
  background-color: #fff;
  padding: 1rem 4rem;
  width: 60%;
  margin: 6rem 0 0 auto;
  text-align: start;
  z-index: 2;
}

.policy{
  margin-top: 4rem;
  height: 100vh;
}

.policy_belt{
  color: #4D4D4D;
  background-color: #fff;
  position: relative;
  font-size: 2rem;
  padding: 1rem 4rem;
  width: 60%;
  text-align: end;
}

.seven_wrap{
  position: relative;
}

.seven_img{
  margin: 0 0 0 auto;
  width: 40%;
  position: absolute;
  top: -6rem;
  right: 0;
}


table {
  margin: 14rem auto 0rem 8rem;
}

.seven_i th {
  color: #fff;
  padding: 10px;
  font-size: 1.25rem;
  text-align: left;
}

.seven_i td {
  padding: 10px;
  font-size: 1.25rem;
}

@media screen and (max-width: 1280px) {
  .seven_img{
    width: 30%;
  }
}

@media screen and (max-width: 900px) {
  .policy_belt{
    width: 80%;
    font-size: 1.25rem;
  }
  .seven_img{
    width: 46%;
    margin-top: 6rem;
  }


  table {
    margin: 26rem auto 0rem 1rem;
  }
  

}

@media screen and (max-width: 640px) {

  .policy_belt{
    width: 95%;
    padding: 1rem 2rem;
  }

  .seven_i {
    width: 95%;
  }


  .each_i{
    width: 100%;
  }

  .seven_i th {

    font-size: 14px;
  }
  
  .seven_i td {
    font-size: 14px;
  }
}

@media screen and (max-width: 500px){
.seven_i {
    margin: 16rem auto 0rem 1rem;
}
}

@media screen and (max-width: 1120px){

  .vision{
    margin-top: 0;
  }

  .back_logo {
    width: 60%;
    top: 14rem;
  }

.mission_belt,.vision_belt{
font-size: 2.441rem;
width: 80%;
padding: 0.5rem 1.2rem;
}

.mission_belt{
  margin-top: 4rem;
}

.vm_title{
  font-size: 3.5rem;  
}

.vm_text{  
  font-size: 1.25rem; 
  width: 95%;
}

.vs_container{
width: 60%;

}
.ms_container{
  width: 80%;
  margin: 0 0 0 4rem;
}
}

@media screen and (max-width: 1120px){
  .vm_title{
    font-size: 2.5rem;  
  }

}
@media screen and (max-width: 500px){

  .vision{
    margin-top: 0;
  }

  .back_logo {
    width: 60%;
    top: 14rem;
  }

.mission_belt,.vision_belt{
font-size: 1.953rem;
width: 80%;
padding: 0.5rem 1.2rem;
}

.mission_belt{
  margin-top: 4rem;
}

.vm_title{
  font-size: 1.563rem;  
}

.vm_text{  
  font-size: 1rem; 
  width: 95%;
}

.vs_container{
width: 80%;

}
.ms_container{
  width: 80%;
  margin: 0 0 0 4rem;
}
}


/* 代表挨拶 */

.ceo_belt{
  position: relative;
  font-size: 3rem;
  padding: 1rem 3rem;
  z-index: 2;
  color: #fff;
  background-color: #000000;
  width: 60%;
  text-align: end;
}

.ceo_mess_img{
  width: 70%;
  height: auto;
  margin: -2rem 0 0 auto;

}

.mess_container{
  margin: 0 16%;

}

.on_line span{
  font-size: 2.441rem;
  font-weight: bold;
}

.img_mess{
  position: relative;
}

.ceo_on_text{
position: absolute;
bottom: 1rem;
}

.ceo_maintext_in{
  margin-top: 2rem;
}

.last_mess{
font-weight: bold;
margin-top: 3rem;
}

.ceo_sign{
  margin: 2rem 0 0 auto;
  text-align: right;
}

.ceo_sign_img{
  width: 20%;
  height: auto;
  margin: 0 0 0 auto;
}

@media screen and (max-width: 1200px){
.last_mess{
  font-size: 2rem;
}
}

@media screen and (max-width: 900px){
  .mess_container{
    margin: 0 8%;
  }

  .ceo_mess{
    margin-top: 12rem;
  }
  }

  @media screen and (max-width: 700px){
  .ceo_mess{
    margin-top: 18rem;
  }
  .on_line span {
    font-size: 1.953rem;
  }

  .ceo_belt{
    position: relative;
    font-size: 2.441rem;
    padding: 0.5rem 1.2rem;
}
}

@media screen and (max-width: 640px){
  .ceo_mess{
    margin-top: 7rem;
  }
}

@media screen and (max-width: 640px){
  .ceo_belt {
    font-size: 1.563rem;
  }

  .on_line span {
    font-size: 1.25rem;
}

.last_mess{
  font-size: 1.55rem;
}

.mess_container{
  margin: 0 4%;
}

}

@media screen and (max-width: 420px){
.ceo_mess {
    margin-top: 5rem;
    
}
.last_mess{
  font-size: 1.25rem;
}

.ceo_sign_img{
  width: 40%;
}
}



/*---------------------------------------------------*/
/*	11.Business
/*---------------------------------------------------*/

.all_business_back{
  background-color: #DADBDF;
  }
  
.wrap {
  position: relative;
  display: flex;
  align-items: center;
}

.top_text_in{
  padding: 20px;
  flex-basis: 60%;
  box-sizing: border-box;
  z-index: 2;
  margin:4rem 0 0 8rem;
  text-align: end;
}

.top_right_img_in{
  display: grid;
  position: absolute;
  top: 2rem;
  right: 0;
}

.top_right_img{
  width: 80%;
  height: auto;
  margin: 0 0 0 auto;
}

.top_title,.top_sub_title{
  background-color: #ffffff;
}

.top_title{
font-size: 3.52rem;
padding: 1rem 1rem;

}

.top_sub_title{
  font-size: 1.953rem;
  padding: 0.5rem 1rem;
  margin-top: 2rem;

}

@media screen and (max-width: 650px){

  .top_right_img{
    width: 80%;
  }
  .top_title{
    font-size: 2.441rem;
  }

  .top_sub_title{
    font-size: 1.25rem;
  }
}

@media screen and (max-width: 440px){

  .top_right_img{
    width: 90%;
  }
  .top_title{
    font-size: 1.563rem;
    padding: 0.5rem 0.5rem;
  }

  .top_sub_title{
    font-size: 1rem;
    padding: 0.2rem 0.5rem;
  }

  .top_text_in {
    padding: 20px;
    flex-basis: 60%;
    box-sizing: border-box;
    z-index: 2;
    margin: 2rem 0 0 0rem;
  }
}

.business_top_title{
  text-align: center;
  font-size: 1.563rem;
  line-height: 2;
  margin-top: 2rem;
}

.biz_point_in{
  display: flex;
  margin-top: 4rem;
}

.biz_point{
flex-basis: 32%; /* 要素の幅指定 */
margin-right: 2%;
border-right: solid 1px gray;
padding-right: 1%;
}



.biz_en{
  font-size: 1.5rem;
  margin-bottom: 1rem;
  margin-right: 2%;

}


.business{
  height: 90vh;
}

@media screen and (max-width: 900px){

  .business{
    height: 70vh;
  }
}
@media screen and (max-width: 600px){
  .business{
    height: 54vh;
  }
  .biz_point_in{
    display: block;
    margin-top: 1.5rem;
margin-bottom: 4rem;

  }
  .biz_point{
    flex-basis: 80%; /* 要素の幅指定 */
    margin: 4% 0;
    border-right: 0px;
    border-bottom: solid 1px gray;
    padding-bottom: 1%;
      }
  .business_top_title{
    text-align: center;
    font-size: 1.2rem;
  }
  .biz_en{
    font-size: 1rem;
  }
}
@media screen and (max-width: 600px){
  .business{
    height: 50vh;
  }
}

  @media screen and (max-width: 450px){
    .business{
      height: 38vh;
    }


  .business_top_title{
    font-size: 1rem;
  }
  }

  /* 個別事業バナー */

  .biz_wrap {
    position: relative;
    display: flex;
    align-items: center;
  }


.estate_wrap{
  height: 90vh;
  margin: 4rem 0 0 auto;
}

.welf_wrap{
  height: 100vh;
  margin: 0rem 0 0 auto;
}

.klim_wrap{
  height: 70vh;
  margin: 0rem 0 0 auto;
}

  .ex_text_in{
    padding: 2rem 5rem;
    flex-basis: 60%;
    box-sizing: border-box;
    z-index: 2;
    margin:8rem 0 0 auto;
    text-align: end;
    background-color: white;
  }

  .reverse_text{
    /* margin:4rem auto 0 0 ; */
    padding: 2rem 5rem;
    flex-basis: 60%;
    box-sizing: border-box;
    z-index: 2;
    text-align: end;
    background-color: white;
  }

  .sales_text{
        margin:4rem auto 0 0 ;
        padding: 2rem 5rem;
        flex-basis: 60%;
        box-sizing: border-box;
        z-index: 2;
        text-align: end;
        background-color: white;
  }

 .welf_text{
  margin:16rem auto 0 0 ; 
 }

.service_img_in{
  display: grid;
  position: absolute;
  top: 2rem;
  left: 0;
}  

.reverse_img_in{
  display: grid;
  position: absolute;
  top: 2rem;
right: 0;
}

.service_img{
  width: 80%;
}

.reverse_img{
  width: 80%;
  margin: 0 0 0 auto;
}

.title_con{
  display: flex;
  align-items: flex-start;
}

.title_con_tusin{
  display: block;
}

.service_title{
  font-size: 1.563rem ;
}

.service_logo_img{
  width: 30%;
  height: auto;
  margin-left: 2rem;
}

.service_text{
  text-align: left;
  margin-top: 3rem;
}

.ser_bu{
  margin-top: 3rem;
}

.bu_text{
  font-size: 12px;
  margin-top: 0.5rem;
}

.tusin_wrap,.arch_wrap,.event_wrap{
  margin-top: 8rem;
}


.beauty_wrap,.event_wrap{
  height: 70vh;
}

.sales_wrap{
  height: 70vh;
}

@media screen and (max-width: 1000px){
.service_logo_img{
  width: 40%;
  height: auto;
}
}

@media screen and (max-width: 800px){
  .ex_text_in {
    padding: 1rem 1rem;
    flex-basis: 74%;
}

.reverse_text{
  padding: 1rem 1rem;
  flex-basis: 74%;
}


}

@media screen and (max-width: 600px){

  .ex_text_in {
    flex-basis: 95%;
    margin: 4rem 0 0 auto;
}

.sales_wrap{
  height: 60vh;
}
.reverse_text{
  flex-basis: 100%;
}

.service_img_in,.reverse_img_in {
  top: 0rem;
}

.service_img {
  width: 100%;
}

.top_margin{
  margin-top: 10rem;
}


.tusin_wrap{
  margin-top: 4rem;
}

.img_up{
  top: -5rem;
}

.img_down{
  top: 2rem; 
}

.service_title {
  font-size: 1.2rem;
}
.each_serv {
  height: 80vh;
}
.welf_text{
  margin:10rem auto 0 0 ; 
 }

 .arch_text{
       margin:14rem auto 0 0 ;
 }
.event_wrap{
  height: 60vh;
}

.beauty_wrap{
  height: 100vh;
}

}

/* 通信事業 */

.service_sub_title{
  font-size: 2.441rem;
}

@media screen and (max-width: 600px){
.service_sub_title{
  font-size: 1.2rem;
}
}
/* SDGsへの取り組み */

.sdgs_ex_in{
  display: flex;
  margin: 0 auto;
  width: 80%;
  justify-content: space-between;
}

.sdgs_text{
  padding:0 2rem 1rem;
  width: 50%;
}

.sdgs_img{
  width: 130%;
}

.sdgs_icon_in {
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.sdgs_icon {
  padding: 20px;
  margin-bottom: 20px;
  text-align: center;
  list-style-type: none;
  flex-basis: 32%;
  box-sizing: border-box;
}

.sdgs_icon:not(:nth-child(3n)) {
  margin-right: 2%;
}

.sdgs_icon_img{
  width: 60%;
  margin: 0 auto 1rem;
}


@media screen and (max-width: 800px){
  .sdgs_ex_in{
    display: block;
  }

  .sdgs_img{
    width: 100%;
  }
  
  .sdgs_icon_in {
    padding: 0;
    display: block;
  }

.sdgs_text{
margin-top: 2rem;
padding: 0;
    width: 100%;
  }
}

/* contact thanks */


/*オープニングアニメーション */
.shutter{
  position:fixed;
  top:0;
  left:0;
  right:0;
  bottom:0;
  background-color:#2c2c2c;
  z-index:9999;
}

.shutter::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  background-color: rgb(255, 255, 255);
  width: 0;
  height: 1px;
}

.shutter {
  -webkit-animation: byeShutter 2.6s forwards;
          animation: byeShutter 2.6s forwards;
}
.shutter::before {
  -webkit-animation: shutterOpen 2.6s forwards;
          animation: shutterOpen 2.6s forwards;
}

.content {
  -webkit-animation: contentScale 2.6s forwards;
          animation: contentScale 2.6s forwards;
}

@keyframes byeShutter {
  70% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
    z-index: -1;
  }
}
@keyframes shutterOpen {
  0% {
    width: 0;
    height: 1px;
  }
  50% {
    width: 100%;
    height: 1px;
  }
  90% {
    width: 100%;
    height: 100%;
  }
  100% {
    width: 100%;
    height: 100%;
  }
}

@keyframes contentScale {
  70% {
    -webkit-transform: perspective(800px) scale(0.9) rotateX(15deg);
            transform: perspective(800px) scale(0.9) rotateX(15deg);
  }
  100% {
    -webkit-transform: perspective(800px) scale(1) rotateX(0);
            transform: perspective(800px) scale(1) rotateX(0);
  }
}

/* オープニングend */

/* メインV */
.tracking-in-contract-bck {
	-webkit-animation: tracking-in-contract-bck 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) 2s backwards;
	        animation: tracking-in-contract-bck 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) 2s backwards;
}


/**
 * ----------------------------------------
 * animation tracking-in-contract-bck
 * ----------------------------------------
 */
 @-webkit-keyframes tracking-in-contract-bck {
  0% {
    letter-spacing: 1em;
    -webkit-transform: translateZ(400px);
            transform: translateZ(400px);
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
    opacity: 1;
  }
}
@keyframes tracking-in-contract-bck {
  0% {
    letter-spacing: 1em;
    -webkit-transform: translateZ(400px);
            transform: translateZ(400px);
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
    opacity: 1;
  }
}



/* 下層 */

/**
 * ----------------------------------------
 * animation slide-in-right
 * ----------------------------------------
 */

 .slide-in-right {
	-webkit-animation: slide-in-right 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s both;
	        animation: slide-in-right 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s both;
}


 @-webkit-keyframes slide-in-right {
  0% {
    -webkit-transform: translateX(1000px);
            transform: translateX(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes slide-in-right {
  0% {
    -webkit-transform: translateX(1000px);
            transform: translateX(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}

/**
 * ----------------------------------------
 * animation slide-in-right
 * ----------------------------------------
 */


 .sf-footer,.formrun-logo,.sf-footer-pr {
  display: none!important;
}