/*------ base
---------------------------------------*/

.container {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
}
.pc{
	display: block;
}
.sp{
	display: none;
}
@media (max-width: 1024px) {
.container {
	width: 96%;
}
.pc{
	display: none;
}
.sp{
	display: block;
}	
}
@media (max-width: 768px) {
.container {
	width: 92%;
}
}


/*------ header
---------------------------------------*/

.header {
	width: 100%;
	height: 70px;
	position: fixed;
	z-index: 999;
	transition: .3s;
}
.header.index a{
	color: #fff;
}
.header.index a:hover {
	color: #009dde;
	text-decoration: none;
}
.header.index.is-animation{
	background: #fff;
	border-bottom: #dcdcdc solid 1px;
}
.header.index.is-animation a{
	color: #000;
}
.header.index.is-animation a:hover {
	color: #009dde;
	text-decoration: none;
}
.header.next{
	background: #fff;
	border-bottom: #dcdcdc solid 1px;
}
.header h1{
	width: 185px;
	position: absolute;
	top: 16px;
	left: 20px;
}
.header h1 a{
    display: block;
}
.header.index.is-animation h1{
	background: url(../images/img_logo.png) no-repeat center center;
	background-size: 185px 38px;
	text-indent: -9999px;
}
.header ul.nav{
	width: 660px;
	position: absolute;
	top: 21px;
	right: 50px;
	transition: .3s;
}
.en .header ul.nav{
	width: 780px;
}
.cn .header ul.nav{
	width: 600px;
}
.header ul.nav li{
	float: left;
	margin: 0 30px 0 0;
}
.header ul.language{
	width: 80px;
	position: absolute;
	top: 25px;
	right: 20px;
	line-height: 1.2;
}
.header ul.language li:first-child{
	float: left;
	margin: 0 15px 0 0;
	padding: 0 15px 0 0;
	border-right: #332d2b solid 1px;
}
.header.index ul.language li:first-child{
	float: left;
	margin: 0 15px 0 0;
	padding: 0 15px 0 0;
	border-right: #fff solid 1px;
}
.header.index.is-animation ul.language li:first-child{
	border-right: #000 solid 1px;
}
.header .button{
	display: none;
}

@media (max-width: 1024px) {
.header.sp{
    background:  #fff;
}
.header.sp .button{
	display: block;
}
.header.sp a{
	color: #000;
}
.header.sp h1{
	background: url(../images/img_logo.png) no-repeat center center;
	background-size: 185px 38px;
	text-indent: -9999px;
}
.global-nav {
  position: fixed;
  right: -320px; /* これで隠れる */
  top: 0;
  width: 300px; /* スマホに収まるくらい */
  height: 100vh;
  padding-top: 40px;
  background-color: #fff;
  transition: all .6s;
  z-index: 200;
  overflow-y: auto; /* メニューが多くなったらスクロールできるように */
}
.hamburger {
  position: absolute;
  right: 10px;
  top: 10px;
  width: 50px; /* クリックしやすいようにちゃんと幅を指定する */
  height: 50px; /* クリックしやすいようにちゃんと高さを指定する */
  cursor: pointer;
  z-index: 300;
}
.global-nav__list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.global-nav__item {
  text-align: center;
  padding: 0 14px;
}
ul.global-nav__list li.title{
	display: block;
	position: relative;
	padding: 8px 15px;
	font-size: 15px;
	color: #fff;
	outline: none;
	text-decoration: none;
	border-bottom: #ced1d4 solid 1px;
	margin: 0;
	font-weight: bold;
	text-align: center;
	background: #029fdb;
}
.global-nav__item a {
  display: block;
  padding: 8px 0;
  border-bottom: 1px solid #eee;
  text-decoration: none;
  color: #111;
}
.global-nav__item a:hover {
  background-color: #eee;
}
.hamburger__line {
  position: absolute;
  left: 10px;
  width: 30px;
  height: 1px;
  background-color: #111;
  transition: all .6s;
}
.hamburger__line--1 {
  top: 16px;
}
.hamburger__line--2 {
  top: 25px;
}
.hamburger__line--3 {
  top: 34px;
}
.black-bg {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  z-index: 100;
  background-color: #000;
  opacity: 0;
  visibility: hidden;
  transition: all .6s;
  cursor: pointer;
}
/* 表示された時用のCSS */
.nav-open .global-nav {
  right: 0;
}
.nav-open .black-bg {
  opacity: .8;
  visibility: visible;
}
.nav-open .hamburger__line--1 {
  transform: rotate(45deg);
  top: 20px;
}
.nav-open .hamburger__line--2 {
  width: 0;
  left: 50%;
}
.nav-open .hamburger__line--3 {
  transform: rotate(-45deg);
  top: 20px;
}
.header ul.nav{
	display: none;
}
.header ul.language{
	display: none;
}
}

@media (max-width: 768px) {
.header.sp{
    background:  #fff;
}
.header.sp .button{
	display: block;
}
.header.sp a{
	color: #000;
}
.header.sp h1{
	background: url(../images/img_logo.png) no-repeat center center;
	background-size: 185px 38px;
	text-indent: -9999px;
}
.global-nav {
  position: fixed;
  right: -320px; /* これで隠れる */
  top: 0;
  width: 300px; /* スマホに収まるくらい */
  height: 100vh;
  padding-top: 40px;
  background-color: #fff;
  transition: all .6s;
  z-index: 200;
  overflow-y: auto; /* メニューが多くなったらスクロールできるように */
}
.hamburger {
  position: absolute;
  right: 10px;
  top: 10px;
  width: 50px; /* クリックしやすいようにちゃんと幅を指定する */
  height: 50px; /* クリックしやすいようにちゃんと高さを指定する */
  cursor: pointer;
  z-index: 300;
}
.global-nav__list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.global-nav__item {
  text-align: center;
  padding: 0 14px;
}
ul.global-nav__list li.title{
	display: block;
	position: relative;
	padding: 8px 15px;
	font-size: 15px;
	color: #fff;
	outline: none;
	text-decoration: none;
	border-bottom: #ced1d4 solid 1px;
	margin: 0;
	font-weight: bold;
	text-align: center;
	background: #029fdb;
}
.global-nav__item a {
  display: block;
  padding: 8px 0;
  border-bottom: 1px solid #eee;
  text-decoration: none;
  color: #111;
}
.global-nav__item a:hover {
  background-color: #eee;
}
.hamburger__line {
  position: absolute;
  left: 10px;
  width: 30px;
  height: 1px;
  background-color: #111;
  transition: all .6s;
}
.hamburger__line--1 {
  top: 16px;
}
.hamburger__line--2 {
  top: 25px;
}
.hamburger__line--3 {
  top: 34px;
}
.black-bg {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  z-index: 100;
  background-color: #000;
  opacity: 0;
  visibility: hidden;
  transition: all .6s;
  cursor: pointer;
}
/* 表示された時用のCSS */
.nav-open .global-nav {
  right: 0;
}
.nav-open .black-bg {
  opacity: .8;
  visibility: visible;
}
.nav-open .hamburger__line--1 {
  transform: rotate(45deg);
  top: 20px;
}
.nav-open .hamburger__line--2 {
  width: 0;
  left: 50%;
}
.nav-open .hamburger__line--3 {
  transform: rotate(-45deg);
  top: 20px;
}
.header ul.nav{
	display: none;
}
.header ul.language{
	display: none;
}	
}



/*------ main
---------------------------------------*/
.nextPage .mainvisualArea{
	padding: 70px 0 0 0;
}
.nextPage .mainvisualArea .mainvisual{
	background: url(../../images/strength/bg_mainvisual.jpg) no-repeat center center;
	background-size: cover;
	padding: 180px 0;
}
.nextPage .mainContent{
	padding: 60px 0;
}
.nextPage.contactPage .mainContent,
.nextPage.privacyPage .mainContent,
.nextPage.newsPage .mainContent,
.nextPage.sdgsPage .mainContent{
	padding: 130px 0 60px 0;
}

.localNav{
	margin: 0 0 50px 0;
}
.localNav li{
	display: inline-block;
	padding: 0 30px;
	border-right: #332d2b solid 1px;
	line-height: 1.2;
}
.localNav li.active a{
	color: #029fdb;
}
.localNav li:first-child{
	border-left: #332d2b solid 1px;
}

@media (max-width: 768px) {
.nextPage .mainvisualArea{
	padding: 70px 0 0 0;
}
.nextPage .mainvisualArea .mainvisual{
	padding: 60px 0;
}
.nextPage .mainContent{
	padding: 40px 0;
}
.nextPage.contactPage .mainContent,
.nextPage.privacyPage .mainContent,
.nextPage.newsPage .mainContent{
	padding: 110px 0 40px 0;
}

.localNav{
	margin: -40px 0 35px 0;
}
.localNav li{
	display: block;
	margin: 0 auto;
	width: 70%;
	border-right: none;
	border-left: none;
	border-bottom: #332d2b solid 1px;
}
.localNav li:first-child{
	border-right: none;
	border-left: none;
	border-bottom: #332d2b solid 1px;
}
.localNav li a{
	display: block;
	padding: 10px 0;
}
}


/*------ footer
---------------------------------------*/
.footer {
	background: #029fdb;
	color: #fff;
	padding: 60px 0 30px 0;
}
.footer .footerArea h2 {
	width: 200px;
	float: left;
	padding: 20px 0 0 0;
}
.footer .footerArea .footerNav {
	width: 160px;
	float: left;
	margin: 0 15px;
	padding: 5px 0 0 0;
}
.footer .footerArea .footerNav li{
	padding: 0 0 0 20px;
	background: url(../images/icon_arrow.png) no-repeat left center;
	background-size: 14px 14px;
	font-size: 86%;
}
.footer .footerArea .footerNav li a{
	color: #fff;
}
.footer .footerArea .tel01 {
	width: 315px;
	float: left;
}
.footer .footerArea .tel02 {
	width: 290px;
	float: left;
}
.footer .footerArea .tel01 h3,
.footer .footerArea .tel02 h3{
	font-size: 84%;
	margin: 0 0 5px 0;
}
.footer .footerArea .tel01 p,
.footer .footerArea .tel02 p{
	font-size: 84%;
	margin: 5px 0 0 0;
}
.footer .footerArea .tel01 p.telnumber,
.footer .footerArea .tel02 p.telnumber{
	font-size: 180%;
    line-height: 1.0;
	font-weight: bold;
}
.en .footer .footerArea .tel01 p.telnumber,
.en .footer .footerArea .tel02 p.telnumber{
	font-size: 150%;
}
.cn .footer .footerArea .tel01 p.telnumber,
.cn .footer .footerArea .tel02 p.telnumber{
	font-size: 160%;
}

.copyright {
	margin: 50px 0 0 0;
	padding: 30px 0 0 0;
	border-top: #fff solid 1px;
	text-align: center;
}

@media (max-width: 1024px) {
.footer {
	padding: 30px 0;
}
.footer .footerArea h2 {
	width: 100%;
	float: none;
	text-align: center;
	padding: 0;
}
.footer .footerArea h2 img{
	width: 200px;
	height: auto;
}
.footer .footerArea .footerNav {
	display: none;
}
.footer .footerArea .tel01 {
	width: 100%;
	float: none;
	margin: 20px 0 0 0;
	text-align: center;
}
.footer .footerArea .tel01 p.telnumber a,
.footer .footerArea .tel02 p.telnumber a{
	color: #fff;
}
.footer .footerArea .tel02 {
	width: 100%;
	float: none;
	margin: 20px 0 0 0;
	text-align: center;
}
.copyright {
	margin: 30px 0 0 0;
	padding: 15px 0 0 0;
}	
}

@media (max-width: 768px) {
.footer {
	padding: 30px 0;
}
.footer .footerArea h2 {
	width: 100%;
	float: none;
	text-align: center;
	padding: 0;
}
.footer .footerArea h2 img{
	width: 200px;
	height: auto;
}
.footer .footerArea .footerNav {
	display: none;
}
.footer .footerArea .tel01 {
	width: 100%;
	float: none;
	margin: 20px 0 0 0;
	text-align: center;
}
.footer .footerArea .tel01 p.telnumber a,
.footer .footerArea .tel02 p.telnumber a{
	color: #fff;
}
.footer .footerArea .tel02 {
	width: 100%;
	float: none;
	margin: 20px 0 0 0;
	text-align: center;
}
.copyright {
	margin: 30px 0 0 0;
	padding: 15px 0 0 0;
}
}