@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Arabic:wght@300;700&display=swap');
@font-face {
  font-family: 'Dubai';
  src: url('/font/DubaiW23-Medium.woff') format('woff');
}
/* -----------------------------------------------------------
共通
------------------------------------------------------------*/
*{
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
	-webkit-font-smoothing:antialiased !important;
}
body{
  width: 100%;
  position: relative;
  font-size: 16px;
  color: #222;
}
/* font */
body{
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.lang-mode,
.ar.download {
  font-family: 'Dubai','Noto Sans Arabic', sans-serif;
}
p,h1,h2,h3,h4,h5,ul,li,div,p{
  margin: 0;
  padding: 0;
}
li{
  list-style: none;
}
a{
  color: #23ac38;
  outline: none;
}
a:hover{
  text-decoration: none;
}
/* hover transition */
a,
button,
.search_area .sdgs_img_area .search,
.search_all,
.company_table tr,
a img{
  transition: .3s;
}
.back-button{
	display:flex;
	font-size:24px;
	line-height:1;
	align-items:center;
	padding:0;
	padding-top:10px;
	padding-bottom:10px;
	color:#888;
	border-style:none;
	background-color:transparent;
	cursor:pointer;
  text-decoration: none;
}
#detail-company-name{
	font-size:50px;
}
.back-button::before{
	content:'arrow_left';
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  display: inline-block;
  width: 1em;
  height: 1em;
  line-height: 1;
}
.back-button:hover{
	color:#444444;
  text-decoration: none;
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  display: inline-block;
  width: 1em;
  height: 1em;
  line-height: 1;
  text-transform: none;

  /* WebKitブラウザサポート */
  -webkit-font-smoothing: antialiased;
  /* Chrome、Safariサポート */
  text-rendering: optimizeLegibility;

  /* Firefoxサポート */
  -moz-osx-font-smoothing: grayscale;

  /* IEサポート */
  -webkit-font-feature-settings: 'liga';
  font-feature-settings: 'liga';
}
img{
  width: 100%;
}
.bold{
  font-weight: bold;
}
.sp{
  display: none;
}
.btn{
  width: 200px;
  max-width: 200px;
  border-radius: 50px;
  border: solid 1px #23ac38;
  display: block;
  text-align: center;
  padding: 10px;
  text-decoration: none;
  font-size: 18px;
  font-weight: bold;
  margin: 5px;
}
.pagetop {
  position: fixed;
  bottom: 0px;
  right: 20px;
  font-size: 14px;
  line-height: 1;
  z-index: 99;
  opacity:80%;
  -webkit-box-shadow: 2px 2px 5px rgb(139 ,153 ,154 ,.5);
          box-shadow: 2px 2px 5px rgb(139 ,153 ,154 ,.5);
}
.pagetop a {
  background: #efefef;
  text-decoration: none;
  color: #23ac38;
  width: 60px;
  height: 60px;
  text-align: center;
  display: block;
  position: relative;
  line-height: 80px;
}
.pagetop a::before{
  content: "expand_less";
  content: "\e5ce";
  font-family: "Material Icons";
  font-size: 40px;
  position: absolute;
  top: 2px;
  left: calc(50% - 20px);
  line-height: normal;
}
.pagetop a:hover{
  text-decoration: none;
  background: #23ac38;
  color: #fff;
}
.pagetop a:hover::before {
  text-decoration: none;
}
.content{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}
.content p,
.content li{
  line-height: 1.4;
}
p.icon::before{
  font-family: 'Material Icons';
	content: 'arrow_right';
  vertical-align: middle;
  margin-right: 0.2rem;
  color: #23ac38
}
/* -----------------------------------------------------------
header
------------------------------------------------------------*/
header{
  width: 100%;
  margin: 0 auto;
  position: fixed;
  top:0px;
  left:0px;
  height:120px;
  z-index:100; 
  background-color:rgba(255,255,255,0.9);
  border-bottom-style:solid;
  border-bottom-width:1px;
  border-bottom-color:#ddd;
}
.top_area::before{
	content:'';
	display:block;
	height:120px;
}
.login_nav ul,
.g_nav > ul{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
/* title */
.title-area{
  width: 100%;
  max-width: 1200px;
  height: 60px;
  margin: 0 auto;
  display: flex;
  align-items:flex-start;
  justify-content: space-between;
}
.title{
  height: 70px;
  width: auto;
  padding: 16px 0 0;
}
.title a{
  text-decoration: none;
  display: block;
  height: 100%;
}
.title img{
  margin-top:-5px;
  height: 100%;
  width: auto;
}
.title svg {
  width: auto;
}
.title_svg_logo{
  width: 140px;
}
/* login_nav */
.login_nav{
  color: #999;
  margin-top:0px;
}
.login_nav a{
  text-decoration: none;
  padding: 6px 10px;
  width: 9.5rem;
  display: inline-block;
  text-align: center;
  justify-content:space-between;
  color: #22ac39;
  border: solid 1px #22ac39;
  font-size: 16px;
 	margin-top:-1px; 
}
.login_btn a,
.contact_btn a{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 9.5rem;
}
.login_btn a .material-icons,
.contact_btn a .material-icons{
  margin-right: .2rem;
  font-size: 1.2rem;
}
.login_nav .lang-mode a{
	border-style:none;
	width:auto;
}
.sp.lang-mode{
	position:absolute;
	right:80px;
	top:20px;
}
.login_nav .lang-mode a:hover{
	text-decoration:underline;
  color:#22ac39 ;
  background: #fff;
}

.login_nav a:hover{
  background:#22ac39 ;
  color: #fff;
}
.login_nav li{
  margin-right: 1rem;
}
.login_nav li:last-child{
  margin-right: 0;
}
/* g_nav */
.g_nav{
  width: 100%;
  margin: 0 auto;
}
.g_nav ul{
  width: 100%;
  max-width: 1200px;
  margin: 10px auto;
}
.g_nav ul li{
 font-size:20px;
  position: relative;
  border-bottom: solid 3px transparent;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
}
.g_nav ul li a{
  display: block;
  margin: 0 auto;
  display: block;
  position: relative;
  width: 100%;
  text-align: center;
  text-decoration: none;
  padding: 0;
  position: relative;
  height: 2rem;
  line-height: 2rem;
}
/*ホバーエフェクト*/
.g_nav ul li a::after {
  position: absolute;
  content: "";
  display: block;
  width: 100%;
  height: 4px;
background: linear-gradient(98deg, rgba(255,255,255,1) 0%, rgba(35,172,56,1) 50%, rgba(255,255,255,1) 100%);
  bottom: -10px;
  left: 0;
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: center top;
  transform-origin: center top;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.g_nav ul li a:hover::after {
  transform: scale(1, 1);
}
/* -----------------------------------------------------------
member_header
------------------------------------------------------------*/
.member_header{
  background: #23ac38;
  color: #fff;
  height: 80px;
}
/* -----------------------------------------------------------
footer
------------------------------------------------------------*/
footer{
	background-color:#ececec;
  width: 100%;
	padding-left:40px;
	padding-right:40px;
  padding-top: 50px;
  border-top: 1px solid #ddd;
  margin-top: 100px;
}
.footer_inner{
  max-width: 1200px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
/* address_area */
.address_area{
  display: inline-block;
  vertical-align: top;
  min-width: 30em;
  margin-bottom: 60px;
}
.address_area p {
  font-size: 14px;
}
.footer_logo{
  width: 200px;
  margin: 0 0 20px;
}
.copy_area{
  font-size: 14px;
  margin: 20px 0 20px;
  width: 100%;
}
.copy_area p{
  text-align: center!important;
}
.footer_text{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.footer_text span:first-child{
  width: 11rem;
  margin: 0 0 0.2rem;
  font-size: 14px;
  margin-right: 0.5rem;
}
.footer_text img {
  height: 1.5rem;
  width: auto;
  margin-bottom: 0.2rem;
}
.footer_text img:hover {
  opacity: .5;
}
/* -----------------------------------------------------------
top_area
------------------------------------------------------------*/
.top_area{
  margin: 0 auto 30px;
  width: 100%;
  position: relative;
  max-height: 100vh;
}
.slick-track {
  display: flex;
  background: #000;
}
.slick-slide {
  height: auto !important;
}
.keyvisual2{
  position: absolute;
  top: 0;
  display: flex;
  width: 100%;
  height: 100%;
}
.keyvisual2 .filter-glass{
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.4)
}
.top-logo {
  z-index: 1;
  margin: 0px auto;
  width: 50%;
  position: absolute;
  right: 0;
  left: 0;
  top: 30vh; 
}
.top-logo div{
  display: block;
  margin: 0 auto;
}
.top-logo img{
  filter: drop-shadow ( 2px 2px 3px rgba(0,0,0,0.5) ) !important;
  -webkit-filter: drop-shadow( 2px 2px 3px rgba(0,0,0,0.5) ) !important;
}
.catch-copy{
  margin: 20px auto;
  color: #fff;
  text-align: center;
}
/* スライドアニメ */
.top_area {
  overflow: hidden;
}
.slick-img img {
  width: 100%;
}
@keyframes zoomUp {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.15);
  }
}
.add-animation {
  animation: zoomUp 10s linear 0s normal both;
}
/* ドットフィルター */
.layer-dot{
 position: relative;
}
.layer-dot:after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  display: block;
  background-color: rgba(0, 0, 0, .2);
  background-image: radial-gradient(#000 20%, transparent 0), radial-gradient(#000 20%, transparent 0);
  background-position: 0 0, 10px 10px;
  background-size: 4px 4px;
}
.img_area{
  width: 100%;
  margin: 20px auto;
  padding: 40px 80px;
}
/* table-type1 */
.table-type1-area{
  display: flex;
  justify-content: space-between;
  margin: 40px auto;
}
.table-type1-area section{
  width: 48%;
}
.table-type1-area table{
	min-height:450px;
}
.table-type1-area table{
  width: 100%;
  border: solid 1px #ddd;
  border-collapse: collapse;
  border-spacing: 0;
}
.table-type1-area table th{
  border-bottom: solid 1px #fff;
  border-right: solid 1px #fff;
  background: #23ac38;
  color: #fff;
  padding: 10px 20px;
  text-align: left;
  font-size: 18px;
  background: rgb(85,230,255);
  background: linear-gradient(75deg, rgba(135,200,55,1) 0%, rgba(35,172,56,1) 95%);
	text-shadow: 1px 2px 3px #808080;
}
.table-type1-area table td{
  background-color:white;
  border-bottom: solid 1px #ddd;
  padding: 10px;
  padding-bottom:0px;
}
.table-type1-area ul {
  padding-left: 1.5rem;
}
.table-type1-area li{
  list-style: none;
  margin-bottom: .5rem;
  position: relative;
}
ul.section-feed li{
	list-style:none;
	margin-bottom:0.5rem;
	position:relative;
}
ul.section-feed{
    display:block;
    list-style-type:disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
}
.section-feed li::before,
.table-type1-area li::before{
  list-style: none;
  font-family: 'Material Icons';
  content: 'arrow_right';
  color: #23ac38;
  font-size: 10px;
  position: absolute;
  left: -1rem;
  top: 0.3rem;
}

/* table-type2 */
.table-type2-area{
  margin: 40px auto;
}
.table-type2-area table{
  width: 100%;
  /* border-spacing: 10px 5px; */
  border-spacing: 0;
}
.table-type2-area table th{
  padding: 10px;
  background: #5b5b5b;
  color: #fff;
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}
.table-type2-area table td{
  padding: 5px 20px;
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}
.table-type2-area table td:first-child{
  background: #23ac38;
  color: #fff;
  text-align: center;
  font-weight: bold;
  font-size: 18px;
  padding:0 ;
	margin:0;
}
.table-type2-area table td:nth-child(2){
  text-align: left;
width:50%;

}


.table-type2-area table td:nth-child(2) span{
  width: 6rem;
  color: #02afbc;
  text-align: center;
  font-weight: bold;
  border-radius: 10px;
  padding: 10px 20px;
  font-size: 30px;
  display: inline-block;
  font-family: 'Roboto', sans-serif;
}
.btn_area{
  text-align: center;
  margin: 100px auto;
}
a.contact,
button.contact {
  padding: 20px;
  text-align: center;
  color: #23ac38;
  border-radius: 6px;
  font-weight: bold;
  box-shadow: 4px 4px 10px #a1a1a1;
  width: 600px;
  font-size: 40px;
  border: solid 2px #23ac38;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  cursor: pointer;
  background: #fff;
  transition: .3s;
  text-decoration: none;
}
a.contact:hover,
button.contact:hover {
  color: #fff;
  background: #23ac38;
}

button.contact:disabled{
	border-color:#cccccc !important;
	color:#cccccc !important;
	box-shadow:none !important;
	background-color: #ffffff !important;
}
button.contact:disabled:hover{
	border-color:#cccccc;
	color:#cccccc;
	box-shadow:none;
}
a.contact .material-icons,
button.contact .material-icons{
  margin-right: .5rem;
  font-size: 40px;
}
.content h2 {
  font-size: 60px;
  margin: 50px auto 20px;
  color: #23ac38;
  background: -webkit-linear-gradient(0deg, #ACB6E5, #86FDE8);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.content section:first-of-type h2 {
  margin-top: 0;
}
.headline-text {
	color:#333;
  font-size: 30px;
  font-weight: bold;
  text-align: center;
}
.content p {
  margin: 0 auto 20px;
}
/* news */
.news{
  width: 100%;
  margin: 0 auto 100px;
}
.news li{
  border-top: solid 1px #ddd;
}
.news li:last-child{
  border-bottom: solid 1px #ddd;
}
.news li > span,
.news li a{
  text-decoration: none;
  display: block;
  height: 100%;
  width: 100%;
  display: flex;
  color: initial;
  padding: 1rem;
}
.news li a .release_title .release_title_text{
  color: #23ac38;
}
.news li a:hover .release_title .release_title_text{
  text-decoration: underline;
}
.news li:hover {
  background: #fafafa;
}
.news p.release_date{
  margin-right: 1rem;
  margin-bottom: .5rem;
  width: 8rem;
}
.news p.release_date span{
  display: block;
  font-size: 14px;
}
.news .release_title{
  margin: 0;
  border-left: 1px dotted #ddd;
  padding-left: 1rem;
  width: 100%;
}
.news .release_title .presenter{
  font-weight: bold;
  margin-bottom: .2rem;
  display: block;
}
.news .release_title p{
  margin: 0;
}
.news .release_title p .material-icons {
  font-size: 1.2rem;
  margin-left: 0.3rem;
  vertical-align: middle;
  color: #000;
  margin-top: -.2rem;
}
/* -----------------------------------------------------------
search
------------------------------------------------------------*/
main{
  position: relative;
}
.search_area {
  margin-bottom: 20px;
}
.search_area > img{
  max-width: 600px;
  display: block;
}
.search_area .sdgs_img_area img {
  transform: scale(.9, .9);
}
.search_area .sdgs_img_area .search{
  cursor: pointer;
  transform: scale(1, 1);
}
.search_area .sdgs_img_area .search:hover{
  box-shadow: 2px 2px 10px rgb(0, 0, 0, 80%);
}
.search.selection{
  outline: solid 4px #000;
}
.search_all {
  width: 100px;
  height: 100px;
  background: #23ac38;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 40px;
  border: solid 2px #23ac38;
  cursor: pointer;
}
.search_all:hover {
  background: #23ac38;
  color: #fff;
}
/* company_table */
.company_table{
  width: 100%;
  margin: 0 auto 40px;
  border-spacing: 0;
}
.company_table tr{
  cursor: pointer;
}
.company_table tr:hover{
  background: #e9ffed;
}
.company_table th{
  padding: 10px;
  background: #23ac38;
  color: #fff;
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}
.company_table th:first-child{
  width: 30%;
}
.company_table td{
  padding: 10px 10px 0;
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}
.company_table td:first-child{
  border-left: 1px solid #ddd;
  font-weight: bold;
  color: #333;
  text-decoration: underline;
  padding: 1rem;
  width: 50%;
}
.company_table tr:hover td:first-child{
  text-decoration: none;
}
.sdgs_img_area{
  display: flex;
  flex-wrap: wrap;
}
.sdgs_img_area img{
  margin-right: 1%;
  margin-bottom: 10px;
  width: 9%;
  height: auto;
}
.company-detail .sdgs_img_area img{
	width:50px !important;
	height:50px !important;
	margin-right:4px !important;
	
}
.company_table .sdgs_img_area img{
  width: 50px;
}
.search_all {
  margin-right: 0;
  width: 9%;
  height: 0;
  padding-bottom: 8.5%;
  position: relative;
}
.search_all span{
  position: absolute;
  font-size: 2.5rem;
  top: calc(50% - 1.5rem);
}
/* -----------------------------------------------------------
detail
------------------------------------------------------------*/
/* company_detail_area */
.company_detail_area .pdf-container{
  max-width: 600px;
  width: 100%;
}
.pdf_btn_area {
  display: flex;
}
.pdf_btn_area a{
  margin-right: 1rem;
}
.pdf_area{
  display: flex;
  flex-wrap: nowrap;
}
.detail-inner .sdgs_img_area img{
	width:50px !important;
	height:50px !important;
}
.pdf_area div{
  width: 48%;
  margin-bottom: 20px;
  text-align: center;
  margin-right: 2%;
}
.download {
  padding: 10px 1rem;
  margin: 10px 0;
  border: solid 2px #23ac38;
  color: #23ac38;
  background: #fff;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  font-weight: bold;
  text-decoration: none;
}
.download .material-icons{
  margin-right: .5rem;
}
.download.ar .material-icons{
  margin-right: 0;
  margin-left: .5rem;
}
.download .material-icons:nth-child(2){
  margin-right: 0;
  margin-left: .5rem;
}
.download:hover {
  background: #23ac38;
  color: #fff;
}
.pdf-canvas{
  display:none;
}
.pdf-image{
  border-style:solid;
  border-width:1px;
  width:100%;
  min-width:100%;
  height:auto;
}
/* -----------------------------------------------------------
form_area
------------------------------------------------------------*/
.form_area {
  max-width: 800px;
  margin: 0 auto;
}
.form_area label{
  font-size: 16px;
  margin: 20px 0 5px;
  display: block;
}
.form_area input,
.form_area textarea{
  width: 100%;
  padding: 0.5rem;
  font-size: 16px;
  border: solid 1px #676767;
  border-radius: 2px;
}
.form_area input:focus,
.form_area textarea:focus{
  outline: solid 1px #23ac38;
  border: solid 1px #23ac38;
}
.form_area textarea{
  min-height: 100px;
}
.form_area p{
  margin: 40px auto 0;
}
.checkbox_area{
  margin: 50px auto 20px;
  text-align: center;
}
.checkbox_area label{
  text-align: left;
}
/* -----------------------------------------------------------
detail(パーツ設定)
------------------------------------------------------------*/
/* h3 */
.content h3{
color:#333;
  font-size: 32px;
  font-weight: bold;
  margin: 20px auto;
  position: relative;
  padding-left: 20px;
}
.content h3::before{
  content: "";
  width: .5em;
  min-height: 1.2em;
  height: 80%;
  background: #23ac38;
  position: absolute;
  left: 0;
  top: 5%;
}
/* h4 */
.content h4{
  font-size: 15px;
  font-weight: bold;
  margin: 30px auto 10px;
  border-bottom: dotted 1px #23ac38;
  padding-bottom: 5px;
}
/* h5 */
.content h5{
  font-size: 14px;
  font-weight: bold;
  margin: 30px auto 10px;
}

/* -----------------------------------------------------------
 additional
------------------------------------------------------------*/
.img_area.zoom{
	cursor:pointer;
	position:relative;
}
.img_area.zoom::after{
	position:absolute;
  font-family: 'Material Icons';
  content: 'zoom_in';
  font-size: 30px;
  float:right;
  color: #333;
  bottom: 5.6vw;
	right:0px;
}

.company-url{
	padding:10px;
}
.contact-form{
	padding-left:20px;
	padding-right:20px;
}
.contact-form>h2{
	padding-top:10px;
}
.search-condition>h2{
	padding-top:10px;
}
.search-condition{
	padding-left:40px;
	padding-right:40px;
	margin:0 auto;
}
header{
	padding-left:40px;
	padding-right:40px;
}
.detail-inner{
	padding:20px;
	padding-top:0px;
	margin-top:0px;
}
.slick-container{
	position:relative;
}
.ju-cat-intro{
	display:flex;
	align-items:flex-end;
	position:absolute;
	padding:40px;
	top:200px;
	left:0px;
	width:800px;
	max-width:800px;
	height:300px;
	background-color:rgba(255,255,255,0.5);
	-webkit-backdrop-filter:blur(5px) contrast(0.8);
	backdrop-filter:blur(5px) contrast(0.7);
	flex-direction:column;
	align-content:space-around;
	flex-wrap:nowrap;
	justify-content:space-around;
	border-style:solid;
	border-color:white;
	border-width:1px;
	border-left-style:none;
}

.ju-cat-intro.noback{
	width:100%;
	backdrop-filter:none !important;
	background-color:transparent !important;
	border-style:none;
	opacity:0.8;
	position:absolute;
	right:0;
	bottom:150px;
	top:unset;
	left:unset;
}
.ju-cat-intro.glass{
	-webkit-backdrop-filter:blur(3px) contrast(0.7) !important;
	backdrop-filter:blur(3px) contrast(0.7);
	display:flex;
	width:100%;
	height:100%;
	background-color:transparent !important;
	border-style:none;
	opacity:1.0;
	position:absolute;
	right:0;
	bottom:0;
	top:0;
	left:0;
	justify-content:center;
	align-items:center;

	max-width:unset;
}
@media screen and (max-width: 768px) {
	.back-button{
		font-size:16px;
		padding-top:0px;
		padding-bottom:10px;
		margin-left:-10px;
	}
	.company-detail h3{
		font-size:20px;
	}
	#detail-company-name{
		font-size:32px !important;
	}
	.keyvisual{
		margin-bottom:30px !important;
	}
	.keyvisual .top-scroll{
		font-size:24px !important;
	}
	.keyvisual .top-scroll::after{
		font-size:40px !important;
	}
}
.keyvisual .top-scroll{
	color:rgba(255,255,255,1.0);
	font-weight:bold;
	margin:0 auto;
	position:absolute;
	font-size:1.5vw;
	top:50%;
	text-shadow: 1px 2px 5px #222222;
}
.keyvisual .top-scroll::after{
	content:'arrow_downward';
	margin:1.2vw auto;
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 3vw;
  display: block;
  width: 1em;
  height: 1em;
  line-height: 1;
  text-transform: none;
}

.top-scroll {
opacity:0;
animation-name: fadeInAnime;
animation-fill-mode:backwards;
animation-duration:5s;
animation-iteration-count:1;
animation-timing-function:ease;
animation-delay: 0.5s;
animation-direction:normal;
}
em{
	font-weight:bolder;
	font-style:normal;

}

@keyframes fadeInAnime{
  0% {
    opacity: 0;
  }
  40% {
    opacity: 1;
  } 
  40% { margin-top:0px; }
  40% { margin-top:0px; }
  50% {
	margin-top:10px;
  }
  55% {
	margin-top:0px;
  }
  60% {
	margin-top:10px;
  }
  65% {
	margin-top:0px;
  }
  70% {
	margin-top:10px;
  }
  75% {
	margin-top:0px;
  }
  80% {
	opacity:1.0;
  }
  100% {
	opacity:0;
  }
}
.keyvisual{
	display:flex;
	flex-direction:column;
	position:relative;
	align-items:center;
	justify-content:flex-start;
	width:100%;
	height:100%;
	margin-bottom:80px;
}
.keyvisual .filter-glass {
	position:absolute;
	width:100%;
	height:100%;
	left:0;
	right:0;
	bottom:0;
	top:0;
	background-color: rgba(0,0,0,0.4) !important;
}
.keyvisual .top-logo {
  max-width: 1200px;
  width: 50%;
  position: absolute;
  margin: 5% auto;
  display: flex;
  -webkit-filter: brightness(120%);
  filter: brightness(120%);
}
.keyvisual p{
	color:white;
	position:absolute;
	width:100%;
	bottom:0;
	line-height:1.5em;
	font-size:3vw;
	padding:2vw 5vw;
	text-shadow: 1px 2px 5px #222222;
	-webkit-backdrop-filter:blur(3px) contrast(0.7) !important;
	backdrop-filter:blur(3px) contrast(0.7);
}
.keyvisual .top-logo img{
	filter:drop-shadow	  ( 2px 2px 3px rgba(0,0,0,0.5) ) !important;
	-webkit-filter:drop-shadow( 2px 2px 3px rgba(0,0,0,0.5) ) !important;

}
.keyvisual .top-bg{ 
	width:100%;
}

.ju-cat-intro.glass img{
	filter:drop-shadow(1px 2px 3px #808080);
	filter:brightness(150%);
	-webkit-filter:drop-shadow(1px 2px 3px #808080);
	-webkit-filter:brightness(200%);
}

@media screen and (max-width: 800px) {
	.ju-cat-intro.noback{
		width:300px;
		backdrop-filter:none !important;
		background-color:transparent !important;
		border-style:none;
		opacity:0.8;
		position:absolute;
		right:0;
		bottom:50px;
		top:unset;
		left:unset;
	}
}

.ju-cat-intro>img{
	width:400px;
}
.ju-cat-intro p{
	font-size:32px;
	color:white;
	text-shadow: 1px 2px 5px #222222;
}

@media screen and (max-width: 800px) {
	.title-logo{
		margin-top:3px;
		width:140px !important;
		height:unset !important;
    margin-top: 3px!important;
    width: 120px !important;
	}
	.ju-cat-intro{
		width:70%;
		top:70px;	
		height:auto;
		padding:10px;
	}
	.ju-cat-intro>img{
		width:70%;
	}
	.ju-cat-intro p{
		font-size:14px;
	}
	ul.section-feed{
	    padding-inline-start: 20px ;
	}
	.table-type1-area table td{
		padding-left:0px;
	}
	.table-type1-area table th{
		padding:5px;
		min-width:120px;
	}
}

@media screen and (max-width: 768px) {
	.form_area p{
		margin-top:10px;
	}
  .checkbox_area {
    margin: 20px auto 10px;
  }
	.contact-form>h2{
		padding-top:0px;
	}
	#errorinfo h2{
		font-size:30px !important;
	}
	#errorinfo.error h2{
		margin-bottom:10px;
	}
	#errorinfo p{
		font-size:18px !important;
	}
	
		
	.search-condition{
		margin-top:-10px !important;
		padding:0 20px;
	}
	.content.w1200::before{
		margin-top:80px !important;
	}
	#section-company-information::before{
		margin-top:60px !important;
	}
	footer,
	header{
		padding-left:0px;
		padding-right:0px;
	}
}

ul.section-headline-image{
	width:100%;
	list-style: none;
	padding-left: 0;
	display: flex;
	flex-wrap: nowrap;	
}
ul.section-headline-image>li{
	display:flex;
	align-items:center;
}
ul.section-headline-image>li:first-child{
	padding:10px;
}
ul.section-headline-image>li:first-child{
	max-width:400px;
}
ul.section-headline-image li:nth-child(2) {
	justify-content:center;
	flex-direction:column;
	align-content:flex-start;
}

ul.section-headline-image li img{
	width:100%;
}

th{
	font-weight:unset !important;
}

.table-business-model tr td{
	height:200px;
	background-size:cover !important;
	background-color:white;
	font-weight:unset !important;
}
.table-business-model tr td:first-child span{
	text-shadow: 1px 2px 5px #222222;
	font-size:24px;
	backdrop-filter:blur(1px) contrast(0.8);
	-webkit-backdrop-filter:blur(2px) contrast(0.8);
	width:100%;
	height:100%;
	display:flex;
	padding:10px;
	justify-content:center;
	align-items:center;
  font-weight: bold;
}
.table-business-model tr td:nth-child(2) span{
	width:120px;
	text-align:end;
	font-size:48px;
	display: inline-block;
	background: linear-gradient(90deg, #4158D0, #C850C0 30%, #FFCC70);
	background: -webkit-linear-gradient(0deg, #4158D0, #C850C0 30%, #FFCC70);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
span.num{
	font-size:40px;
	background: linear-gradient(90deg, #4158D0, #C850C0 30%, #FFCC70);
	background: -webkit-linear-gradient(0deg, #4158D0, #C850C0 30%, #FFCC70);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
div.main_text{
	max-width:1200px;
}
.content{
	width:100%;
	max-width:none;
	flex:auto;
}
#section-company-information::before,
.content.w1200::before{
	content:'';
	display:block;
	margin-top:160px;
}
/* member */
.member_header + main #section-company-information::before,
.member_header + main .content.w1200::before{
	margin-top:120px;
}
.content.w1200{
	max-width:1200px;
}
.content section{
	margin:0 auto 0px;
	max-width:1200px;
}
.table-type1-area section{
	padding:5px;
	
}
#section-company-information,
#section-fields,
#section-goals{
	padding:20px 0px;
	margin:0px auto 0px;
	max-width:none !important;
	background-color:#f5f5f5;
}
#section-company-information{
	margin-top:-10px;
	padding-top:20px;
	padding-bottom:0px;
}
.divider-top {
    top: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
	fill:#f5f5f5;
}
.divider-bottom {
	fill:#f5f5f5;
    bottom: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
}
.wmax .sdgs_img_area{
	padding-top:20px;
}
section.wmax{
	width:100% !important;
}
.section-inner{
	margin:0 auto;
	max-width:1200px !important;
}
.table-business-model tr td.clean{
	background:url(/img/fields/clean.jpg);
}
.table-business-model tr td.ccs{
	background:url(/img/fields/ccs.jpg);
}
.table-business-model tr td.recycle{
	background:url(/img/fields/recycling.jpg);
}
.table-business-model tr td.water{
	background:url(/img/fields/water.jpg);
}
.table-business-model tr td.bio{
	background:url(/img/fields/bio.jpg);
}
.table-business-model tr td.food{
	background:url(/img/fields/food.jpg);
}
.table-business-model tr td.health{
	background:url(/img/fields/health.jpg);
}

.table-business-model tr td.space{
	background:url(/img/fields/space.jpg);
}

.table-business-model tr td{
	background-position:center !important;
}
@media screen and (max-width: 768px) {
	.top_area::before{
		content:'';
		display:block;
		height:60px;
	}
	.table-business-model tr td:nth-child(2) span{
		width:60px;
	}
	ul.section-headline-image{
		justify-content:center;
		flex-wrap:wrap;
	}
	.table-type2-area table th{
		font-size:12px;
	}
	.footer_logo img{
		width:100px;	
	}
	.address_area>p{
		text-align:center;
	}
	.company_table .sdgs_img_area img{
		padding-bottom:0px !important;
	}	
	.company_table .sdgs_img_area td{
		vertical-align:middle;
	}
}

.content section,
.section-inner,
.btn_area,
.main_text{
  width:90% ;
}
#section-company-information,
#section-fields,
#section-goals{
  width:100%;
}

/* -----------------------------------------------------------
Contact Form
------------------------------------------------------------*/
div.center{
	width:100%;
	margin:0 auto;
	display:flex;
	flex-direction:column;
	align-items:center;
}
.btn_area.email{
	margin: 0 auto;
	padding-left:0px;
	padding-right:0px;
	margin-top:10px;
	margin-bottom:30px;
}
.btn_area.email button{
	margin-bottom:20px;
}
.btn_area.email .privacy{
	text-align:left;
}
.ECM_CheckboxInput {
padding-top:0px !important;
margin-top:0px !important;
padding: 12px 8px;
display: inline-flex !important;
align-items: center;
flex-wrap:wrap;
cursor: pointer;
}
.ECM_CheckboxInput-Input {
width: 0;
opacity: 0;
}
.ECM_CheckboxInput:hover > .ECM_CheckboxInput-DummyInput{
background: #CCCCCC;
}
.ECM_CheckboxInput-Input:focus + .ECM_CheckboxInput-DummyInput{
background: #CCCCCC;
}
.ECM_CheckboxInput-Input:checked + .ECM_CheckboxInput-DummyInput {
background: #555555;
}
.ECM_CheckboxInput-Input:checked + .ECM_CheckboxInput-DummyInput::before {
content: "";
display: block;
position: absolute;
top: 50%;
left: 50%;
width: 35%;
height: 2px;
transform: translate(-5px, 6px) rotateZ(-135deg);
transform-origin: 1px 1px;
background: #FFFFFF;
}
.ECM_CheckboxInput-Input:checked + .ECM_CheckboxInput-DummyInput::after {
content: "";
display: block;
position: absolute;
top: 50%;
left: 50%;
width: 70%;
height: 2px;
transform: translate(-5px, 6px) rotateZ(-45deg);
transform-origin: 1px 1px;
background: #FFFFFF;
}
.ECM_CheckboxInput-DummyInput {
position: relative;
top: 0;
left: 0;
display: block;
width: 24px;
height: 24px;
background: #F5F5F5;
box-shadow: 0 1px 4px rgba(0,0,0, .4) inset;
}
.ECM_CheckboxInput-LabelText {
margin-left: 12px;
width: calc(100% - 3rem);
}
.bgimg4{
background-attachment:fixed;
background-color: #FFF66F;
width: 100%;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25'%3E%3Cdefs%3E%3ClinearGradient id='a' gradientUnits='userSpaceOnUse' x1='0' x2='0' y1='0' y2='100%25' gradientTransform='rotate(258,842,424)'%3E%3Cstop offset='0' stop-color='%23FFF66F'/%3E%3Cstop offset='1' stop-color='%23008837'/%3E%3C/linearGradient%3E%3Cpattern patternUnits='userSpaceOnUse' id='b' width='300' height='250' x='0' y='0' viewBox='0 0 1080 900'%3E%3Cg fill-opacity='0.03'%3E%3Cpolygon fill='%23444' points='90 150 0 300 180 300'/%3E%3Cpolygon points='90 150 180 0 0 0'/%3E%3Cpolygon fill='%23AAA' points='270 150 360 0 180 0'/%3E%3Cpolygon fill='%23DDD' points='450 150 360 300 540 300'/%3E%3Cpolygon fill='%23999' points='450 150 540 0 360 0'/%3E%3Cpolygon points='630 150 540 300 720 300'/%3E%3Cpolygon fill='%23DDD' points='630 150 720 0 540 0'/%3E%3Cpolygon fill='%23444' points='810 150 720 300 900 300'/%3E%3Cpolygon fill='%23FFF' points='810 150 900 0 720 0'/%3E%3Cpolygon fill='%23DDD' points='990 150 900 300 1080 300'/%3E%3Cpolygon fill='%23444' points='990 150 1080 0 900 0'/%3E%3Cpolygon fill='%23DDD' points='90 450 0 600 180 600'/%3E%3Cpolygon points='90 450 180 300 0 300'/%3E%3Cpolygon fill='%23666' points='270 450 180 600 360 600'/%3E%3Cpolygon fill='%23AAA' points='270 450 360 300 180 300'/%3E%3Cpolygon fill='%23DDD' points='450 450 360 600 540 600'/%3E%3Cpolygon fill='%23999' points='450 450 540 300 360 300'/%3E%3Cpolygon fill='%23999' points='630 450 540 600 720 600'/%3E%3Cpolygon fill='%23FFF' points='630 450 720 300 540 300'/%3E%3Cpolygon points='810 450 720 600 900 600'/%3E%3Cpolygon fill='%23DDD' points='810 450 900 300 720 300'/%3E%3Cpolygon fill='%23AAA' points='990 450 900 600 1080 600'/%3E%3Cpolygon fill='%23444' points='990 450 1080 300 900 300'/%3E%3Cpolygon fill='%23222' points='90 750 0 900 180 900'/%3E%3Cpolygon points='270 750 180 900 360 900'/%3E%3Cpolygon fill='%23DDD' points='270 750 360 600 180 600'/%3E%3Cpolygon points='450 750 540 600 360 600'/%3E%3Cpolygon points='630 750 540 900 720 900'/%3E%3Cpolygon fill='%23444' points='630 750 720 600 540 600'/%3E%3Cpolygon fill='%23AAA' points='810 750 720 900 900 900'/%3E%3Cpolygon fill='%23666' points='810 750 900 600 720 600'/%3E%3Cpolygon fill='%23999' points='990 750 900 900 1080 900'/%3E%3Cpolygon fill='%23999' points='180 0 90 150 270 150'/%3E%3Cpolygon fill='%23444' points='360 0 270 150 450 150'/%3E%3Cpolygon fill='%23FFF' points='540 0 450 150 630 150'/%3E%3Cpolygon points='900 0 810 150 990 150'/%3E%3Cpolygon fill='%23222' points='0 300 -90 450 90 450'/%3E%3Cpolygon fill='%23FFF' points='0 300 90 150 -90 150'/%3E%3Cpolygon fill='%23FFF' points='180 300 90 450 270 450'/%3E%3Cpolygon fill='%23666' points='180 300 270 150 90 150'/%3E%3Cpolygon fill='%23222' points='360 300 270 450 450 450'/%3E%3Cpolygon fill='%23FFF' points='360 300 450 150 270 150'/%3E%3Cpolygon fill='%23444' points='540 300 450 450 630 450'/%3E%3Cpolygon fill='%23222' points='540 300 630 150 450 150'/%3E%3Cpolygon fill='%23AAA' points='720 300 630 450 810 450'/%3E%3Cpolygon fill='%23666' points='720 300 810 150 630 150'/%3E%3Cpolygon fill='%23FFF' points='900 300 810 450 990 450'/%3E%3Cpolygon fill='%23999' points='900 300 990 150 810 150'/%3E%3Cpolygon points='0 600 -90 750 90 750'/%3E%3Cpolygon fill='%23666' points='0 600 90 450 -90 450'/%3E%3Cpolygon fill='%23AAA' points='180 600 90 750 270 750'/%3E%3Cpolygon fill='%23444' points='180 600 270 450 90 450'/%3E%3Cpolygon fill='%23444' points='360 600 270 750 450 750'/%3E%3Cpolygon fill='%23999' points='360 600 450 450 270 450'/%3E%3Cpolygon fill='%23666' points='540 600 630 450 450 450'/%3E%3Cpolygon fill='%23222' points='720 600 630 750 810 750'/%3E%3Cpolygon fill='%23FFF' points='900 600 810 750 990 750'/%3E%3Cpolygon fill='%23222' points='900 600 990 450 810 450'/%3E%3Cpolygon fill='%23DDD' points='0 900 90 750 -90 750'/%3E%3Cpolygon fill='%23444' points='180 900 270 750 90 750'/%3E%3Cpolygon fill='%23FFF' points='360 900 450 750 270 750'/%3E%3Cpolygon fill='%23AAA' points='540 900 630 750 450 750'/%3E%3Cpolygon fill='%23FFF' points='720 900 810 750 630 750'/%3E%3Cpolygon fill='%23222' points='900 900 990 750 810 750'/%3E%3Cpolygon fill='%23222' points='1080 300 990 450 1170 450'/%3E%3Cpolygon fill='%23FFF' points='1080 300 1170 150 990 150'/%3E%3Cpolygon points='1080 600 990 750 1170 750'/%3E%3Cpolygon fill='%23666' points='1080 600 1170 450 990 450'/%3E%3Cpolygon fill='%23DDD' points='1080 900 1170 750 990 750'/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Crect x='0' y='0' fill='url(%23a)' width='100%25' height='100%25'/%3E%3Crect x='0' y='0' fill='url(%23b)' width='100%25' height='100%25'/%3E%3C/svg%3E");
background-size: cover;
}
#errorinfo{
display: flex;
flex-direction:column;
width: 100%;
padding: 30px;
position: fixed;
margin: 0 auto;
background-color: rgba(35,172,56,0.9);
top: calc(100vh - 80%);
color: white;font-size: 30px;	
}
.errorinfo-inner{
	margin:0 auto;
	max-width:1200px;
}
#errorinfo.error{
	color:#ff0000;
	background-color:#c9f922 !important;
}
.keyvisual .top-logo img.logo-shadow{
	filter:drop-shadow	  ( 2px 2px 3px rgba(0,0,0,0.5) ) !important;
	-webkit-filter:drop-shadow( 2px 2px 3px rgba(0,0,0,0.5) ) !important;
}
.keyvisual .top-logo img.logo-glow{
	filter:drop-shadow	  ( 2px 2px 3px rgba(255,255,255,0.5) ) !important;
	-webkit-filter:drop-shadow( 2px 2px 3px rgba(255,255,255,0.5) ) !important;
}
.keyvisual .top-logo img.logo-border-w{
	filter:
		drop-shadow( 1px 1px 1px rgba(255,255,255,1) )
		drop-shadow( -1px -1px 1px rgba(255,255,255,1) )
		 !important;
	-webkit-filter:
			drop-shadow( 1px 1px 1px rgba(255,255,255,1) ) 
			drop-shadow( -1px -1px 1px rgba(255,255,255,1)  )
		  !important;
}
.keyvisual .top-logo img.logo-border-b{
	filter:
			drop-shadow( 1px 1px 1px rgba(0,0,0,1) )
			drop-shadow( 1px 1px 1px rgba(0,0,0,1) )
		 !important;
	-webkit-filter:
			drop-shadow( 1px 1px 1px rgba(0,0,0,1) ) 
			drop-shadow( -1px -1px 1px rgba(0,0,0,1)  )
		  !important;
}
.keyvisual .top-logo img.logo-border-w-shadow{
	filter:
		drop-shadow( 1px 1px 1px rgba(255,255,255,1) )
		drop-shadow( -1px -1px 1px rgba(255,255,255,1) )
			drop-shadow( 2px 2px 5px rgba(0,0,0,1) ) 
		 !important;
	-webkit-filter:
			drop-shadow( 1px 1px 1px rgba(255,255,255,1) ) 
			drop-shadow( -1px -1px 1px rgba(255,255,255,1)  )
			drop-shadow( 2px 2px 5px rgba(0,0,0,1) ) 
		  !important;
}
.content.news_sec h2.news_h2{
  font-size: 35px;
  background: none;
  color: #222;
      -webkit-background-clip: unset;
    -webkit-text-fill-color: unset;
    margin-bottom: 4%;
}
.content.news_sec .des{
  margin-bottom: 3%;
}
.content.news_sec .des.last{
  margin-bottom: 5%;
}
.content.news_sec h3.news_h3{
  font-size: 25px;
  padding-left: 30px;
}
.content.news_sec h3.news_h3:before{
  width: 0.3em;
}
.content.news_sec td{
  border-left: solid 1px #e6e6e6;
  border-bottom: solid 1px #e6e6e6;
  width: 35%;
  padding: 2% 3%;
}
.content.news_sec table{
  border-top: solid 1px #e6e6e6;
  border-right: solid 1px #e6e6e6;
  margin-bottom: 5%;
}
.content.news_sec td:nth-child(1){
  width: 30%;
}
.content.news_sec tr:nth-child(1) td{
  background: #23ac38;
  color: #fff;
}
.content.news_sec .img_block{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
}
.content.news_sec .img_block .img{
  width: 49%;
  margin: 0 2% 3% 0;
}
.content.news_sec .img_block .img:nth-child(2n){
  margin-right: 0;
}
.flex_box{
  display: flex;
  flex-flow: row wrap;
  justify-content: left;
}
.flex_box.revers{
  flex-direction: row-reverse;
}
.flex_box.right{
    justify-content: right;
}
.flex_box.center{
    justify-content: center;
}
.cij_box .box{
  width: 32%;
  margin-right: 2%;
  text-align: center;
  position: relative;
  top: 0;
    -moz-transition: .5s;
    -webkit-transition: .5s;
    -o-transition: .5s;
    -ms-transition: .5s;
    transition: .5s;
}
.cij_box .box:nth-child(3n){
  margin-right: 0;
}
.cij_box .box .cij_comp{
    color: #333;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
}
.cij_box .box a{
  text-decoration: none;
}
.cij_box .box:hover{
  background:#f8f8f8;
  top: -15px;
  box-shadow: 3px 3px 18px 0px rgba(0, 0, 0, 0.1);
}
.cij_box{
  margin-bottom: 3%;
}
/* -----------------------------------------------------------
SP
------------------------------------------------------------*/
@media screen and (max-width: 768px) {
    /* -----------------------------------------------------------
  共通
  ------------------------------------------------------------*/
  .sp{
    display: block;
  }
  .btn{
    width: 46%;
  }
  .btn_area{
    margin: 50px auto 30px;
  }
  a.contact, button.contact{
    font-size: 20px;
  }
  a.contact .material-icons,
   button.contact .material-icons{
    font-size: 26px;
  }
  .g_nav ul li a::after{
    content: none;
  }
  /* -----------------------------------------------------------
  header
  ------------------------------------------------------------*/
  header{
    height: auto;
    min-height: 3em;
  }
  .member_header{
    height: auto;
  }
  .login_nav{
    display: none;
  }
  .sp_menu{
    width: 50px;
    height: 50px;
    cursor: pointer;
    margin: 0 auto;
    position: absolute;
    right: 10px;
    top: 5px;
    z-index: 1000;
  }
  .sp_menu span{
    display: block;
    margin: 0;
    border: none;
    width: 50%;
    height: 3px;
    background: #23ac38;
    -webkit-transform-origin:0% 50%;
        -ms-transform-origin:0% 50%;
            transform-origin:0% 50%;
    position: absolute;
    top: 12px;
    left: 25%;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
  }
  .sp_menu span:nth-of-type(2){
      top: 21px;
  }
  .sp_menu span:nth-of-type(3){
      top: 30px;
  }
  .sp_menu_active {
    position: fixed;
  }
  .sp_menu_active .sp_menu{
    border-radius: 100%;
    border: solid #fff 2px;
    background: #fff;
  }
  .sp_menu_active .sp_menu span{
    left: 30%;
  }
  .sp_menu_active .sp_menu span:nth-of-type(1){
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
    width: 57%;
  }
  .sp_menu_active .sp_menu span:nth-of-type(2){
    opacity: 0;
  }
  .sp_menu_active .sp_menu span:nth-of-type(3){
    top: 30px;
    -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
            transform: rotate(-45deg);
    width: 57%;
  }
  /* title */
  .title-area{
    width: 100%;
  }
  .title{
    margin: 0 5%;
    padding: 8px 0 0;
  }
  .g_nav{
    position: fixed;
    bottom: auto;
    top: 0;
    background: #fff;
    z-index: 100;
    display: none;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
    margin-bottom:50px;
  }
  .g_nav ul{
    display: block;
    bottom: auto;
    padding: 60px 0 0;
    width: 100%;
    left: 0;
    overflow: auto;
  }
  .sp_menu_active .g_nav ul{
    padding-bottom: 0;
    margin-bottom: 0;
  }
  .sp_menu_active .g_nav{
    display: block;
    height: 100vh;
  }
  .sp_login_nav ul{
    margin-bottom: 20px;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 100%;
    padding: 0;
    margin: 0;
  }
  .sp_login_nav li:first-child{
    border-right: solid 1px #23ac38;
  }
  .g_nav ul li{
    border-bottom: solid 1px #23ac38;
    display: block;
    height: 4rem;
  }
  .g_nav > ul li:first-child{
    border-top: solid 1px #23ac38;
  }
  .g_nav ul li a {
    font-size: 24px;
    display: block;
    height: 100%;
    line-height: 4rem;
  }
  /* -----------------------------------------------------------
  top
  ------------------------------------------------------------*/
  .top_area {
    max-height: 90vw;
  }
  .top-logo {
    top: 100px;
    width: 70%;
  }
  .slick-slider {
    width: 100%;
    margin-right: 0;
  }
  .main_text {
    margin: 40px auto 20px;
    padding-top: 20px;
  }
  .main_text img {
    width: 200px;
    margin-bottom: 10px;
  }
  .main_text p{
    width: auto;
    font-size: 2vh;
    line-height: 1.2;;
  }
  .content h2 {
    font-size: 30px;
    margin: 30px auto 10px;
  }
  .headline-text {
    font-size: 20px;
  }
  .news{
    font-size: 13px;
  }
  .news li > span, .news li a {
    display: block;
    padding: 0.5rem 0;
  } 
  .news p.release_date{
    width: 100%;
    margin-bottom: 0.2rem;
  }
  .news .release_title {
    border-left: none;
    width: 100%;
    padding-left: 0;
  }
  .img_area.zoom::after {
    bottom: auto;
  }
  .table-type1-area{
    display: block;
  }
  .table-type1-area section{
    width: 100%;
  }
  a.contact,
  button.contact{
    width: 100%;
  }
  .table-type2-area table td{
    padding: 10px;
    width: auto;
  }
  .table-type2-area table td:nth-child(2){
    padding: 10px;

  }
  .table-type2-area table td:nth-child(2) span{
    font-size: 32px;
	padding:0;
  }
  .img_area{
    padding: 0;
  }
  .news {
    margin: 0 auto 20px;
  }
  .table-business-model tr td:first-child span{
    font-size: 18px;
  }
  /* -----------------------------------------------------------
  footer
  ------------------------------------------------------------*/
  footer {
   margin-top: 0px;
   padding-top: 0px;
  }
  .copy_area{ 
	font-size:10px;
	color:#333;
  }
  .footer_logo{
	margin-bottom:5px !important;	
  }
  .content, .footer_inner{
    width: 100%;
  }
  .address_area{
    width: 100%;
    min-width: auto;
    margin: 0 auto;
    padding: 20px 5%;
	padding-bottom:0px;
  }
  .footer_text{
    margin-bottom: 1rem;
  }
  .address_area p {
    font-size: 13px;
    text-align: left;
  }
  .copy_area {
    font-size: 12px;
    margin: 50px 0 10px;
    width: 100%;
  }
  .pagetop a {
    background: #efefef;
    color: #23ac38;
    width: 60px;
    height: 60px;
    line-height: 80px;
  }
  .pagetop a:hover{
    text-decoration: none;
    background: #efefef;
    color: #23ac38;
  }
  .pagetop a::before {
    color: #23ac38;
    top: 0;
  }
  /* -----------------------------------------------------------
  detail
  ------------------------------------------------------------*/
  .pdf_area div {
    width: 100%;
  }
  .pdf_area div:last-child {
    margin-bottom: 0;
  }
  .company_detail_area > div {
    padding-left: 0;
  }
/* -----------------------------------------------------------
search
------------------------------------------------------------*/

  .search_area{
    display:flex;
    flex-direction:column;	
  }
  .search_all {
	width:50px !important;
	height:50px !important;
  }
	.search_area .sdgs_img_area img,
	.search_all{
		margin:4px;
	}
  .search_all span{
    font-size: 5vw;
    top: calc(50% - 2.5vw);
  }
  .company_table tr:first-child td{
    border-top: solid 1px #ddd;
  }
  .company_table td:first-child{
    border-left: none;
    border-right: none;
    text-decoration: none;
    padding:5px 10px !important;
    position: relative;
    padding-right: 3rem;
  }
  .company_table td:last-child{
    position: relative;
    padding-right: 3rem;
  }
  .company_table td:last-child::after{
    font-family: 'Material Icons';
    content: '\e409';
    font-size: 30px;
    color: #23ac38;
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
  }
  .company_table .sdgs_img_area img{
	width:50px;
	
  }
  .search_area .sdgs_img_area img{
	width:50px;
	height:50px;
  }

  /* -----------------------------------------------------------
  detail(パーツ設定)
  ------------------------------------------------------------*/
  .content h3{
    margin: 20px auto 10px;
  }
/* -----------------------------------------------------------
  news(パーツ設定)
  ------------------------------------------------------------*/
  .content.news_sec h2.news_h2{
    font-size: 25px;
    margin-bottom: 8%;
  }
  .content.news_sec .des{
    margin-bottom: 6%;
  }
  .content.news_sec .des.last{
    margin-bottom: 10%;
  }
  .content.news_sec h3.news_h3{
    font-size: 18px;
  }
  .content.news_sec td{
    font-size: 14px;
  }
  .content.news_sec table{
    margin-bottom: 10%;
  }
  .content.news_sec .img_block .img{
    width: 100%;
    margin-right: 0;
    margin-bottom: 5%;
  }
  .cij_box .box .logo{
    margin-bottom: 0;
  }
  .cij_box .box .cij_comp{
    font-size: 12px;
  }
}

@media screen and (max-width: 320px) {
  .table-type2-area {
    overflow: scroll;
  }
}