@charset "UTF-8";
/*-----------------------------------------------------

  About CSS

    - Index
    - Topics
		- Japan

-----------------------------------------------------*/
/*-----------------------------------------------------

  Index

-----------------------------------------------------*/

.about-index .en-ttl01 {
	width: 50px;
}

@media screen and (max-width: 768px) {
	.about-index .en-ttl01 {
		margin: 0 auto 12px auto;
		width: 101px;
		height: 22px;
	}
}

/*-----------------------------------------------------
  catch-img
-----------------------------------------------------*/
.about-index .catch-img {
	top: -81px;
}
	.about-index .catch-img p {
		text-align: right;
	}
		.about-index .catch-img img {
			display: inline-block;
			margin: 0 -200px 0 0;
		}
@media screen and (max-width: 768px) {
	.about-index .catch-img p {
		text-align: center;
	}
		.about-index .catch-img img {
			display: inline;
			max-width: 100%;
			width: 96%;
			height: auto;
			margin: 0;
		}
}


/*-----------------------------------------------------
  article01
-----------------------------------------------------*/
.about-index .article01 .first-c {
	margin-right: 132px;
}
.about-index .article01 p:nth-child(2) {
	position: absolute;
	top: -68px;
	right: -118px;
	margin-bottom: 0;
}
@media screen and (max-width: 768px) {
	.about-index .article01 .first-c {
		width: 100%;
		margin-right: 0;
	}
	.about-index .article01 p:nth-child(2) {
		position:static;
		margin: 0;
		top:0;
		right:0;
		text-align:center;
	}
	.about-index .article01 p:nth-child(2) img {
		max-width: 100%;
		padding-top:20px;
		width: 50%;
	}		
}


/*-----------------------------------------------------
  article02
-----------------------------------------------------*/
.about-index .article02 > dl {
	float: left;
	width: 364px;
	margin: 0;
}
.about-index .article02 > dl:nth-child(2n) {
	float: right;
}
	.about-index .article02 .ttl {
		margin: 0 0 14px;
		color: #626469;
		font-size: 22px;
		font-size: 2.2rem;
		text-align: center;
		font-weight: bold;
	}
		.about-index .article02 .pic {
			margin: 0 0 10px;
			text-align: center;
		}
			.about-index .article02 .pic img {
				max-width: 90%;
			}
		.about-index .article02 .txt01 {
			width: 320px;
			margin: 0 auto 20px;
		}
			.about-index .article02 .txt01 dt {
				margin: 0 0 10px;
				padding: 8px 5px 5px;
				background: #eaeaea;
				border-radius: 14px;
				font-size: 14px;
				font-size: 1.35rem;
				text-align: center;
			}
			.about-index .article02 .txt01 dd {
				margin: 0 10px;
			}
		.about-index .article02 .txt02 {
			width: 350px;
			margin: 0 auto;
		}
			.about-index .article02 .txt02 dt {
				margin: 0 0 8px;
				color: #626469;
				font-size: 16px;
				font-size: 1.6rem;
				font-weight: bold;
			}
@media screen and (max-width: 768px) {
	.about-index .article02 > dl {
		width: 100%;
		float: none;
		margin-bottom: 20px;
	}
	.about-index .article02 > dl:nth-child(2n) {
		float: none;
	}
	.about-index .article02 > dl:last-child {
		margin-bottom: 0;
	}
		.about-index .article02 .ttl {
			margin-bottom: 6px;
		}
			.about-index .article02 .txt01 {
				width: 80%;
				margin-bottom: 10px;
			}
				.about-index .article02 .txt01 dt {
					margin-bottom: 5px;
				}
			.about-index .article02 .txt02 {
				width: 100%;
			}
				.about-index .article02 .txt02 dt {
					color: #626469;
					font-size: 1.6rem;
					font-weight: bold;
				}
}


/*-----------------------------------------------------
  article03
-----------------------------------------------------*/
.about-index .article03 {
	background: url(../img/index_bg_global01.gif) no-repeat 0 120px;
}
	.about-index .article03 > :first-child {
		width: 750px;
		margin: 0 auto 40px;
	}
	.about-index .article03 div {
		position: relative;
		height: 480px;
	}
		.about-index .article03 div p {
			position: absolute;
			width: 262px;
			height: 262px;
		}
		.about-index .article03 div > :nth-child(1) {
			top: 0;
			left: 200px;
		}
		.about-index .article03 div > :nth-child(2) {
			top: 104px;
			left: 722px;
		}
		.about-index .article03 div > :nth-child(3) {
			top: 250px;
			left: 12px;
		}
		.about-index .article03 div > :nth-child(4) {
			top: 200px;
			left: 435px;
		}
			.about-index .article03 div img {
				max-width: 100%;
			}
@media screen and (max-width: 768px) {
	.about-index .article03 {
		background-position: center top;
		background-size: 100%;
	}
		.about-index .article03 > :first-child {
			width: 100%;
			margin-bottom: 8px;
		}
			.about-index .article03 p.global-txt{
				padding-top:120px;
				
			}
			.about-index .article03 div {
				height: auto;
				margin-top:10px;
			}
			
				.about-index .article03 div p {
					position: static;
					text-align:center;
					width: 100%;
					height: auto;
					margin: 0 0 20px;
				}
				.about-index .article03 div p img{
					width: 66%;
				}
				.about-index .article03 div :nth-child(2n) {
				}
				.about-index .article03 > :last-child img {
					/*width: 54%;*/
					width: 90%;
					text-align:left;
					height:auto;
					max-width: 286px;
				}
				
}


/*-----------------------------------------------------

  Topics

-----------------------------------------------------*/

.about-topics .en-ttl01 {
	width: 71px;
}

@media screen and (max-width: 768px) {
	.about-topics .en-ttl01 {
		margin: 0 auto 12px auto;
		width: 143px;
		height: 22px;
	}
}


/*-----------------------------------------------------
  article01
-----------------------------------------------------*/
.about-topics .article01 {
	width: 1000px;
}
	.about-topics .article01 li {
		float: left;
		width: 308px;
		margin: 0 38px 52px 0;
	}
	.about-topics .article01 li:last-child {
		margin-right: 0;
	}
	.about-topics .article01 .col2  {
		margin-left: 172px;
	}
	.about-topics .article01 ul:last-child li {
		margin-bottom: 0;
	}
@media screen and (max-width: 768px) {
	.about-topics .article01 {
		width: 93.75%;
	}
		.about-topics .article01 li {
			float: none;
			width: 100%;
			margin: 0 0 22px;
			text-align: center;
		}
		.about-topics .article01 li:last-child {
			margin-right: 0;
		}
		.about-topics .article01 .col2 {
			margin-left: 0;
		}
		.about-topics .article01 ul:last-child li {
			margin-bottom: 22px;
		}
		.about-topics .article01 ul:last-child li:last-child {
			margin-bottom: 0;
		}
			.about-topics .article01 li img {
				max-width: 90%;
			}
}


/*-----------------------------------------------------
  topics-modal
-----------------------------------------------------*/
#modal-overlay{
	z-index: 1;
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 120%;
	background-color: #f2f2f2;
	opacity: 0.92;
}
.topics-modal {
	z-index: -1;
	opacity: 0;
	position:absolute;
	top: 0;
	width: 1000px;
	margin: 0 auto;
}
.topics-modal.show {
	z-index: 2;
}
.iPhone .topics-modal.show,
.iPad .topics-modal.show {
	-webkit-transform: translate3d(0,0,0);
}

	.topics-modal .btn-close {
		text-align: right;
	}
		.topics-modal .btn-close p {
			cursor: pointer;
			display: inline-block;
			width: 68px;
			height: 68px;
			margin: 0 0 28px;
			color: #009530;
			background: #ffffff;
			border: 2px solid #009530;
			border-radius: 50%;
			text-align: center;
		}
		.topics-modal .btn-close p:hover {
			color: #3dcd58;
			border: 2px solid #3dcd58;
		}
			.topics-modal .modal {
				float: left;
				width: 1000px;
			}
				.topics-modal .modal .txt {
					float: left;
					width: 482px;
					margin: 0 0 0 46px;
				}
					.topics-modal .modal .txt dt {
						margin: 0 0 16px;
						color: #009530;
						font-size: 32px;
						font-size: 3.2rem;
					}
					.topics-modal .modal .txt dt img {
						display: block;
						margin: 0 0 10px;
					}
					.topics-modal .modal .txt dd p {
						margin: 0 0 10px;
					}
				.topics-modal .modal .pic {
					float: right;
					width: 446px;
				}
	.topics-modal .modal-pager {
		margin: 54px 0 0;
		text-align: center;
	}
		.topics-modal .modal-pager li {
			display: inline-block;
			margin: 0 5px 0 0;
		}
			.topics-modal .modal-pager a {
				display: block;
				padding: 20px 23px;
				border: 2px solid #009530;
				border-radius: 6px;
				line-height: 1;
				text-decoration: none;
				background:#FFFFFF;
			}
			.topics-modal .modal-pager a:hover {
				color: #3dcd58;
				border-color: #3dcd58;
			}
			.topics-modal .modal-pager .selected a {
				color: #86949c;
				border-color: #86949c;
			}
@media screen and (max-width: 768px) {
/*#modal-overlay{
	 opacity: 1;
}*/
	.topics-modal {
		width: 93.75%;
	}
		.topics-modal .modal {
			width: 100%;
		}
		.topics-modal .btn-close p {
			width: 34px;
			height: 34px;
			margin: 0 0 14px;
		}
			.topics-modal .btn-close img {
				width: 34px;
				height: auto;
			}
			.topics-modal .modal .txt {
				float: none;
				width: 100%;
				margin: 0 0 10px;
			}
			.topics-modal .modal .pic {
				float: none;
				width: 100%;
				text-align: center;
			}
		.topics-modal .modal-pager {
			display: none !important;
		}
}




/*-----------------------------------------------------

  Japan

-----------------------------------------------------*/

.about-japan .en-ttl01 {
	width: 148px;
}

@media screen and (max-width: 768px) {
	.about-japan .en-ttl01 {
		margin: 0 auto 12px auto;
		width: 297px;
		height: 22px;
	}
}

/*-----------------------------------------------------
  ci01,ci02,ci03
-----------------------------------------------------*/
.about-japan .ci01 {
	top: -48px;
}
	.about-japan .ci01 p {
		text-align: right;
	}
		.about-japan .ci01 img {
			display: inline-block;
			margin: 0 -190px 0 0;
		}
.about-japan .ci02 {
	top: 56px;
}
	.about-japan .ci02 img {
		display: inline-block;
		margin: 0 0 0 -110px;
	}
@media screen and (max-width: 768px) {
	.about-japan .ci01,
	.about-japan .ci02 {
		display: none;
	}
	.about-japan .ci03 {
		width: 100%;
		margin-right: 0;
		margin-left: 0;
	}
	 .about-japan .ci03 img {
		 width: 100%;
	 }
}

/*-----------------------------------------------------
  article01
-----------------------------------------------------*/
.about-japan .article01 {
	width: 590px;
}
@media screen and (max-width: 768px) {
	.about-japan .article01 {
		width: 93.75%;
	}
}


/*-----------------------------------------------------
  article02
-----------------------------------------------------*/
.about-japan .article02 dl {
	float: left;
	width: 280px;
	margin: 0 72px 0 0;
}
.about-japan .article02 dl:last-child {
	margin-right: 0;
}
	.about-japan .article02 dt {
		margin: 0 0 24px;
		font-weight: bold;
		font-size: 18px;
		font-size: 1.8rem;
		text-align: center;
	}
		.about-japan .article02 dd .pic {
			width: 245px;
			margin: 0 auto 16px;
			text-align: center;
		}
			.about-japan .article02 dd div {
				margin: 0 auto;
			}
			.about-japan .article02 dd div p {
				margin: 0 0 10;
				font-size: 14px;
				font-size: 1.35rem;
			}
@media screen and (max-width: 768px) {
	.about-japan .article02 dl {
		float: none;
		width: 100%;
		margin: 0 0 20px;
	}
	.about-japan .article02 dl:last-child {
		margin: 0;
	}
		.about-japan .article02 dd .pic {
			width: 60%;
		}
			.about-japan .article02 dd .pic img {
				width: 100%;
			}
		.about-japan .article02 dd div {
			width: 75%;
		}
}


/*-----------------------------------------------------
  article03
-----------------------------------------------------*/
.about-japan .article03 table {
	width: 100%;
}
	.about-japan .article03 .year {
		padding: 0 20px 40px 0;
		color: #3dcd58;
		vertical-align: top;
		text-align: left;
		font-size: 22px;
		font-size: 2.2rem;
		line-height: 1;
	}
	.about-japan .article03 .large .year {
		font-size: 30px;
		font-size: 3rem;
	}
	.about-japan .article03 .txt-cell {
		position: relative;
		padding: 0 0 40px 34px;
		vertical-align: top;
	}
		.about-japan .article03 .txt-cell:after {
			z-index: -1;
			content: '';
			position: absolute;
			display: block;
			top: 0.5em;
			left: 0;
			width: 2px;
			height: 100%;
			background: #eaeaea;
		}
		.about-japan .article03 tr:last-child .txt-cell:after {
			height: 0;
		}
		.about-japan .article03 .txt-cell:before {
			content: '';
			position: absolute;
			top: 8px;
			left: -3px;
			width: 8px;
			height: 8px;
			border-radius: 50%;
			background: #626469;
		}
		.about-japan .article03 .large .txt-cell:before {
			top: 6px;
			left: -5px;
			width: 12px;
			height: 12px;
		}
		.about-japan .article03 .pic {
			float: right;
			width: 240px;
		}
		.about-japan .article03 .txt {
			float: left;
			width: 360px;
		}
		.about-japan .article03 .txt p{
			padding-bottom:20px;
			
		}
		.about-japan .article03 ul {
			margin: 0 0 0 1em;
		}
		.about-japan .article03 li {
			text-indent: -1em;
		}
		
@media screen and (max-width: 768px) {
	.about-japan .article03 .pic {
		float: none;
		width: auto;
	}
		.about-japan .article03 .pic img {
			width: 60%;
		}
	.about-japan .article03 .txt {
		float: none;
		width: auto;
		margin: 0 0 15px;
	}
}


/*-----------------------------------------------------
  article04
-----------------------------------------------------*/
.about-japan .article04 p {
	float: left;
	text-align:right;
}
	.about-japan .article04 img {
			width:450px;
			height:auto;
			margin-left:40px;
		}
		
.about-japan .article04 ul {
	float: right;
	width: 400px;
	margin: 100px 40px 0 0;
}
	.about-japan .article04 li {
		position: relative;
		margin: 0 0 18px;
		padding: 0 0 0 20px;
		font-size: 17px;
		font-size: 1.7rem;
		line-height: 1.4;
	}
		.about-japan .article04 li:before {
			content: '';
			display: block;
			position: absolute;
			top: 10px;
			left: 0;
			width: 10px;
			height: 4px;
		}
		.about-japan .article04 li:first-child:before {
			background: #2d994f;
		}
		.about-japan .article04 li:nth-child(2):before {
			background: #1aa1db;
		}
		.about-japan .article04 li:nth-child(3):before {
			background: #2d2c89;
		}
		.about-japan .article04 li:nth-child(4):before {
			background: #2d2c89;
		}
		.about-japan .article04 li:nth-child(5):before {
			background: #ea8e38;
		}
		.about-japan .article04 li:nth-child(6):before {
			background: #b42953;
		}
			.about-japan .article04 span {
				font-size: 13px;
				font-size: 1.3rem;
			}
			
@media screen and (max-width: 768px) {
	.about-japan .article04 p {
		float: none;
		text-align: center;
	}
		.about-japan .article04 img {
			width: 90%;
			margin-left:0;
		}
	.about-japan .article04 ul {
		float: none;
		width: 100%;
		margin: 20px 0 0;
	}
}