@charset "UTF-8";

/* animation
-----------------------------------*/






/* ++++++++++++++++++++++++++++++++++++++++++++++    PC    ++++++++++++++++++++++++++++++++++++++++++++++  */
/* 801px ~ */
@media screen and (min-width: 801px), print {


	#main {
		padding-top: 64px;
		position: relative;
		overflow: hidden;
	}
		
	.top {
		position: relative;
	}
	.top-container {
		overflow: hidden;
		position: relative;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.top .top-container .tit {
		font-size: 139px;
		line-height: 0.6;
		position: absolute;
		color: rgba(255,255,255,0.2);
		top: 0;
		right: -0.5em;
		z-index: 2;
		font-weight: 400;
		letter-spacing: 0.5em;
	}
	.top .top-container > div {
		position: relative;
	}
	.top .wrap01{
		width: calc(48% - 3px);
		height: 443px;
		margin-bottom: 6px;
		position: relative;
	}
	.top .wrap02{
		width: calc(52% - 3px);
		height: 443px;
		margin-bottom: 6px;
	}
	.top .wrap03{
		width: calc(30% - 3px);
		height: 259px;
	}
	.top .wrap04{
		width: calc(40% - 6px);
		height: 259px;
	}
	
	/* top見出し */
		.top .wrap01 .txt-box {
			position: absolute;
			width: 100%;
			bottom: 0;
			left: 0;
			color: white;
			box-sizing: border-box;
			font-weight: 500;

		}
			.top .wrap01 .txt-box .num{
				background-color: black;
				line-height: 1;
				display: inline-block;
				vertical-align: bottom;
				padding: 0 10px 0 22px;
				transform: translateX(-10px);
				transition: 1.0s;
				opacity: 0;
				z-index: 1;
			}
				.top .wrap01 .txt-box.right .num{
					padding: 0 32px 0 10px;
				}
				.top .top-container.on .wrap01 .txt-box .num{
					transform: translateX(0);
					opacity: 1.0;
				}
			.top .wrap01 .txt-box .lead{				
				display: block;				
			}
				.top .wrap01 .txt-box .lead > span{
					display: block;
					font-size: 0;
				}
				.top .wrap01 .txt-box .lead span.line{
					display: inline-block;
					padding: 3px 10px 3px 20px;
					overflow: hidden;
					position: relative;
					font-size: 2.3vw;
					font-size:clamp(20px, 2vw, 28px);
					font-weight: 500;
					transform: translateX(-10px);
					transition: 1.0s;
					opacity: 0;
					z-index: 1;
				}	
				.top .wrap01 .txt-box.right .lead span.line{
					padding: 3px 30px 3px 10px;
				}
				.people06 .top .top-container .wrap01 .txt-box .lead span.line{
					font-feature-settings: "palt";
				}
				.top .top-container.on .wrap01 .txt-box .lead span.line{
					transform: translateX(0);
					opacity: 1.0;
				}
					.top .wrap01 .txt-box .lead span:nth-of-type(2) span.line{
						transition: 1.0s 0.2s;
					}
				.top .wrap01 .txt-box .lead span.line:before{
					content: '';
					display: block;
					position: absolute;
					width: 100%;
					height: 100%;
					left: 0;
					top: 0;
					background-color: #0a9bcd;
					transition: 0.8s 0.2s;
					transform: translateX(-100%);
					z-index: -1;
				}
					.top .wrap01 .txt-box .lead span:nth-of-type(2) span.line:before{
						transition: 0.8s 0.4s;
					}
					.top .wrap01 .txt-box .lead span:nth-of-type(3) span.line:before{
						transition: 0.8s 0.6s;
					}
				.top .top-container.on .wrap01 .txt-box .lead span.line:before{
					transform: translateX(0);
				}
	
	
	/* topプロフィール */
	.top .wrap05{
		width: calc(30% - 3px);
		height: 259px;
		background-color: black;
		position: relative;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		justify-content: center;
		align-items: center;
		color: white;
		font-weight: 400;
	}
		.top .wrap05 .profile{
			position: absolute;
			top: 0;
			left: 0;
			background-color: #0a9bcd;
			padding: 3px 5px 2px;
			line-height: 1em;
		}
			.top .wrap05 .txt-box .name{
				font-size: 20px;
			}
			.top .wrap05 .txt-box .en{
				color: #0a9bcd;
			}
	
	
	

	
	
	
	
	.sec {
		position: relative;
	}
	.sec .bg {
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}
	.sec .contents .tit{
		font-size: 25px;
		font-weight: 500;
		color: white;
		padding: 0 20px;
		box-sizing: border-box;
		position: relative;
		letter-spacing: 0.16em;
	}
	.sec .contents .tit h2{
		font-size: 25px;
		font-weight: 500;
		color: white;
		padding: 0 20px;
		box-sizing: border-box;
		position: relative;
		letter-spacing: 0.16em;
	}
	.sec .contents .tit::before{
		content: "";
		display: block;
		background-size: contain;
	}
	.sec .contents h3{
		margin-top: 60px;
		font-size: 25px;
		letter-spacing: 0.08em;
		font-weight: 500;
	}
	.sec .contents p{
		line-height: 2.2;
		letter-spacing: 0.08em;
		margin-top: 45px;
		text-align: justify;
		line-break: strict;
    	word-wrap: break-word;
    	overflow-wrap: break-word;
	}
	.sec .contents p.small{
		margin-top: 16px;
		font-size: 12px;
	}
	
	
	.sec01{
		margin-top: 180px;
	}
	.sec01 .bg{
		width: 70%;
		height: 408px;
	}
	.sec01 .contents{
		margin-top: -22px;
		width: 70%;
		min-width: 800px;
		margin-right: 0;
		margin-left: auto;
	}
	.sec01 .contents .tit{
		background-color: #f06400;
	}
	.sec01 .contents .tit::before{
		background-image: url("../img/icon01.png");
		width: 102px;
		height: 44px;
		position: absolute;
		z-index: 1;
		top: 20px;
		left: 82px;
	}
	.sec01 .contents p{
		width: 780px;
	}
	
	
	
	.sec02 {
		width: 1040px;
		margin: auto;
		margin-top: 160px;
	}
	.sec02 .bg {
		position: absolute;
		top: 0;
		right: 0;
		z-index: -1;
		width: 514px;
		height: 706px;
	}
	
	.sec02 .contents {
		padding-top: 130px;
	}
	.sec02 .contents .tit{
		display: inline-block;
		background-color: #0a9bcd;
		padding-left: calc(50vw - 520px);
		margin-left: calc((50vw - 520px)*-1);
	}
	.career .sec02 .contents .tit{
		padding-right: 60px;
	}
	.sec02 .contents .tit::before{
		content: "";
		display: block;
		background-image: url("../img/icon02.png");
		background-size: contain;
		width: 102px;
		height: 44px;
		position: absolute;
		z-index: 1;
		top: 20px;
		right: 145px;
	}
	.career .sec02 .contents .tit::before{
		right: 17px;
	}
	.sec02 .contents p{
		width: calc(100% - 554px);
	}
	
	
	
	
	.sec03{
		margin-top: 160px;
	}
	.sec03 .bg-box{
		width: 1040px;
		margin: auto;
	}
	.sec03 .bg{
		width: 918px;
		height: 528px;
	}
	.sec03 .contents{
		margin-top: -22px;
		width: 70%;
		min-width: 820px;
		margin-right: 0;
		margin-left: auto;
	}
	.sec03 .contents .tit{
		background-color: #6e3cbe;
	}
	.sec03 .contents .tit::before{
		
		content: none;
	}
	.sec03 .contents .tit::after{
		content: "";
		display: block;
		background-size: contain;
		background-image: url("../img/icon03.png");
		width: 206px;
		height: 85px;
		position: absolute;
		z-index: 1;
		top: -30px;
		left: 595px;
	}
	.career .sec03 .contents .tit::after{
		left: 375px;
	}
	.sec03 .contents p{
		width: 780px;
	}
	
	.sec04 {
		margin-top: 180px;
	}
	.sec04 .bg {
		width: 100%;
		height: 582px;
	}
	.sec04 .contents {
		width: 848px;
		margin: auto;
		margin-top: -22px;
	}
	.sec04 .wrapper .tit{
		display: inline-block;
		background-color: #f06400;
		padding-left: calc(50vw - 424px);
		padding-right: 170px;
		margin-left: calc((50vw - 424px)*-1);
		
		font-size: 25px;
		font-weight: 500;
		color: white;
/*		padding: 0 20px;*/
		box-sizing: border-box;
		position: relative;
		letter-spacing: 0.16em;
	}
	.sec04 .wrapper .tit::before{
		content: "";
		display: block;
		background-image: url("../img/icon04.png");
		background-size: contain;
		width: 162px;
		height: 86px;
		position: absolute;
		z-index: 1;
		top: -57px;
		right: 0;
	}
	
	
	.sec05 {
		margin-top: 180px;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
	}
	.sec05 .contents p {
		margin-top: 0;
		line-height: 1.2;
	}
	.sec05 > div {
		padding-bottom: 95px;
		width: 50%;
	}
	.sec05 .deco_area {
		width: 0;
	}
	.sec05 > div .img-box{
		width: 85px;
		margin: auto;
		text-align: center;
		margin-top: -40px;
	}
	
	.sec05 .sub_tit{
		text-align: center;
		margin-top: 3px;
	}
	.sec05 .contents h2{
		text-align: center;
		font-weight: 500;
	}
	.sec05 .contents {
				width: 70%;
		margin: auto;
	}
		.sec05 .shedule {
			background-color: rgba(0, 155, 205, 0.25);
		}
	.sec05 .shedule .contents h2{
		font-size: 16px;
		margin-top: 40px;
	}
	.sec05 .shedule .timeline {

		margin-top: 40px;
	}
	.sec05 .shedule .timeline li{
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		align-items: flex-start;
	}
	.sec05 .shedule .timeline li:not(:first-child){
		margin-top: 25px;
	}
	.sec05 .shedule .timeline .time {
		width: 100px;
		flex-shrink: 0;
		margin-right: 30px;
		position: relative;
	}
	.sec05 .shedule .timeline li:not(:last-child) .time::after {
		content: "";
		display: block;
		width: 50px;
		height: calc(100% - 40px);
		border-right: 4px dotted #0a9bcd;
		margin-top: 10px;
	}
	.sec05 .shedule .timeline .en{
		color: #0a9bcd;
		font-size: 32px;
		text-align: center;
	}
	.sec05 .shedule .timeline dt{
		font-size: 18px;
		margin-bottom: 10px;
		font-weight: 500;
	}
	
	.sec05 .shedule .timeline dd{
		text-align: justify;
		line-break: strict;
    	word-wrap: break-word;
    	overflow-wrap: break-word;
	}
	
	
	
	.sec05 .topics {
		background-color: rgba(245, 180, 0, 0.3);
	}
	.sec05 .topics .contents h2 {
		font-size: 18px;
		margin-top: 40px;
	}
	.sec05 .topics .contents p {
		margin-top: 45px;
		line-height: 2.2;
		letter-spacing: 0.08em;
	}
	
	.sec05 .topics .contents .img-box {
		width: 100%;
		height: 0px;
		margin-top: 45px;
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
		
		/* 縦横比固定 */
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		padding-top: 62.3%;
	}
	
	
	
	.career .top .tit {
		letter-spacing: 0.45em;
		text-align: right;
		right: -0.45em;
			bottom: -0.15em;
		top: auto;
		font-size: 139px;
		line-height: 1;
	}
	.career .top .wrap01{
		width: 100%;
		height: 47vw;
	}
	.career .top .wrap01 .lead-box{
		text-align: right;
		top: 15%;
	}
	.career .top .wrap05 {
		width: 25.7%;
		min-width: 360px;
		height: 26%;
		min-height: 165px;
		bottom: 0;
		left: 0;
		position: absolute;
		z-index: 1;
	}
	.career .top .wrap05 .txt-box {
/*		width: 25.7%;*/
		display: flex;
		height: 100%;
		justify-content: center;
		align-items: center;
	}
	
	
	
	
	.career_wrap {
		background-color: #f1f1f1;
		padding: 50px 0;
	}
	.career_wrap .wrap {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
	}
	.career_wrap .wrap > div .content {
		margin-top: 25px;
		height: 100%;
	}
	.career_wrap .tit{
		font-size: 18px;
		font-weight: 500;
	}
	.career_wrap .step{
		width: 35%;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		flex-direction: column;
	}
	.career_wrap .step .content{
		padding-left: 35px;
		position: relative;
	}
	.career_wrap .now-job .content{
		
	}
	
	.now-job  h3{
		margin-top: 25px;
		font-size: 25px;
		letter-spacing: 0.08em;
		font-weight: 500;
	}
	.career_wrap .content p{
		line-height: 2.2;
		text-align: justify;
		line-break: strict;
    	word-wrap: break-word;
    	overflow-wrap: break-word;
	}
	.career_wrap .step .content dl{
		padding-bottom: 30px;
	}
	.career_wrap .step .content dl{
		position: relative;
	}
	.career_wrap .step .content dl::before{
		content: "";
		display: block;
		width: 15px;
		height: 15px;
		background-color: #fff;
		border: solid 2px #0a9bcd;
		border-radius: 15px;
		position: absolute;
		top: 4px;
		left: -32px;
		z-index: 1;
	}
	.career_wrap .step .content dl::after{
/*
		content: "";
		display: block;
		width: 5px;
		height: 100%;
		background-color: #00b176;
		position: absolute;
		top: 4px;
		left: -25px;
*/
	}
	.career_wrap .step .content::after{
		content: "";
		display: block;
		width: 5px;
		height: calc(100% - 20px);
		background-color: #0a9bcd;
		position: absolute;
		top: 4px;
		left: 10px;
	}
	.career_wrap .step .content::before{
		content: "";
		display: block;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 10px 10px 0 10px;
		border-color: #0a9bcd transparent transparent transparent;
		position: absolute;
		bottom: 10px;
		left: 2px;
	}
	
	.career_wrap .now-job{
		width: 65%;
		padding-left: 45px;
	
		
	}
	
	
	/* animation
	------------------------------------------------------------------*/		
	/* topの画像 */
	.top .top-container > .fade_ramdom,
	.top .top-container > .wrap05{
		background-color: #dfdfdf;
		z-index: 1;
		padding: 10px;
		box-sizing: border-box;
	}
	.top .top-container > .fade_ramdom:before{
		content: '';
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		opacity: 0;
		transition: 1.0s;
	}
	.top .top-container > .fade_ramdom.on:before{
		opacity: 1.0;
	}
	.top .top-container .wrap05 .profile,
	.top .top-container .wrap05 .txt-box{		
		opacity: 0;
		transition: 1.0s 0.4s;
	}
	.top .top-container.on .wrap05 .profile,
	.top .top-container.on .wrap05 .txt-box{		
		opacity: 1.0;
	}
	.top .top-container .wrap05:before{
		content: '';
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		opacity: 0;
		background-color: #000;
		transition: 1.0s 0.4s;
		z-index: -1;
	}
	.top .top-container.on .wrap05:before{
		opacity: 1.0;
		
	}
	
	
	
	/*people01
	------------------------------------------------------------------*/		
	.people01 .top .wrap01:before{
		background: url("../img/people01/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people01 .top .wrap02:before{
		background: url("../img/people01/top02.jpg") no-repeat center;
		background-size: cover;
	}
	.people01 .top .wrap03:before{
		background: url("../img/people01/top03.jpg") no-repeat center;
		background-size: cover;
	}
	.people01 .top .wrap04:before{
		background: url("../img/people01/top04.jpg") no-repeat center;
		background-size: cover;
	}
	.people01 .sec01 .bg{
		background-image: url("../img/people01/ph01.jpg");
	}
	
	.people01 .sec02 .bg {
		background-image: url("../img/people01/ph02.jpg");
	}
	
	.people01 .sec03 .bg{
		background-image: url("../img/people01/ph03.jpg");
	}
	.people01 .sec04 .bg {
		background-image: url("../img/people01/ph04.jpg");
	}
		
	.people01 .sec05 .topics .contents .img-box {
		background-image: url("../img/people01/topics.jpg");
	}
	
	
	/*people02
	------------------------------------------------------------------*/		
	.people02 .top .wrap01:before{
		background: url("../img/people02/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people02 .top .wrap02:before{
		background: url("../img/people02/top02.jpg") no-repeat center;
		background-size: cover;
	}
	.people02 .top .wrap03:before{
		background: url("../img/people02/top03.jpg") no-repeat center;
		background-size: cover;
	}
	.people02 .top .wrap04:before{
		background: url("../img/people02/top04.jpg") no-repeat center;
		background-size: cover;
	}
	.people02 .sec01 .bg{
		background-image: url("../img/people02/ph01.jpg");
	}
	
	.people02 .sec02 .bg {
		background-image: url("../img/people02/ph02.jpg");
	}
	
	.people02 .sec03 .bg{
		background-image: url("../img/people02/ph03.jpg");
	}
	.people02 .sec04 .bg {
		background-image: url("../img/people02/ph04.jpg");
	}
		
	.people02 .sec05 .topics .contents .img-box {
		background-image: url("../img/people02/topics.jpg");
	}
	/*people03
	------------------------------------------------------------------*/		
	.people03 .top .wrap01:before{
		background: url("../img/people03/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people03 .top .wrap02:before{
		background: url("../img/people03/top02.jpg") no-repeat center;
		background-size: cover;
	}
	.people03 .top .wrap03:before{
		background: url("../img/people03/top03.jpg") no-repeat center;
		background-size: cover;
	}
	.people03 .top .wrap04:before{
		background: url("../img/people03/top04.jpg") no-repeat center;
		background-size: cover;
	}
	.people03 .sec01 .bg{
		background-image: url("../img/people03/ph01.jpg");
	}
	
	.people03 .sec02 .bg {
		background-image: url("../img/people03/ph02.jpg");
	}
	
	.people03 .sec03 .bg{
		background-image: url("../img/people03/ph03.jpg");
	}
	.people03 .sec04 .bg {
		background-image: url("../img/people03/ph04.jpg");
	}
		
	.people03 .sec05 .topics .contents .img-box {
		background-image: url("../img/people03/topics.jpg");
	}
	
	/*people04
	------------------------------------------------------------------*/		
	.people04 .top .wrap01:before{
		background: url("../img/people04/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people04 .top .wrap02:before{
		background: url("../img/people04/top02.jpg") no-repeat center;
		background-size: cover;
	}
	.people04 .top .wrap03:before{
		background: url("../img/people04/top03.jpg") no-repeat center;
		background-size: cover;
	}
	.people04 .top .wrap04:before{
		background: url("../img/people04/top04.jpg") no-repeat center;
		background-size: cover;
	}
	.people04 .sec01 .bg{
		background-image: url("../img/people04/ph01.jpg");
	}
	
	.people04 .sec02 .bg {
		background-image: url("../img/people04/ph02.jpg");
	}
	
	.people04 .sec03 .bg{
		background-image: url("../img/people04/ph03.jpg");
	}
	.people04 .sec04 .bg {
		background-image: url("../img/people04/ph04.jpg");
	}
		
	.people04 .sec05 .topics .contents .img-box {
		background-image: url("../img/people04/topics.jpg");
	}
	
	/*people05
	------------------------------------------------------------------*/	
	.people05 .top .wrap01:before{
		background: url("../img/people05/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people05 .top .wrap02:before{
		background: url("../img/people05/top02.jpg") no-repeat center;
		background-size: cover;
	}
	.people05 .top .wrap03:before{
		background: url("../img/people05/top03.jpg") no-repeat center;
		background-size: cover;
	}
	.people05 .top .wrap04:before{
		background: url("../img/people05/top04.jpg") no-repeat center;
		background-size: cover;
	}
	.people05 .sec01 .bg{
		background-image: url("../img/people05/ph01.jpg");
	}
	
	.people05 .sec02 .bg {
		background-image: url("../img/people05/ph02.jpg");
	}
	
	.people05 .sec03 .bg{
		background-image: url("../img/people05/ph03.jpg");
	}
	.people05 .sec04 .bg {
		background-image: url("../img/people05/ph04.jpg");
	}
		
	.people05 .sec05 .topics .contents .img-box {
		background-image: url("../img/people05/topics.jpg");
	}
	
	/*people06
	------------------------------------------------------------------*/		
	.people06 .top .wrap01:before{
		background: url("../img/people06/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people06 .top .wrap02:before{
		background: url("../img/people06/top02.jpg") no-repeat center;
		background-size: cover;
	}
	.people06 .top .wrap03:before{
		background: url("../img/people06/top03.jpg") no-repeat center;
		background-size: cover;
	}
	.people06 .top .wrap04:before{
		background: url("../img/people06/top04.jpg") no-repeat center;
		background-size: cover;
	}
	.people06 .sec01 .bg{
		background-image: url("../img/people06/ph01.jpg");
	}
	
	.people06 .sec02 .bg {
		background-image: url("../img/people06/ph02.jpg");
	}
	
	.people06 .sec03 .bg{
		background-image: url("../img/people06/ph03.jpg");
	}
	.people06 .sec04 .bg {
		background-image: url("../img/people06/ph04.jpg");
	}
		
	.people06 .sec05 .topics .contents .img-box {
		background-image: url("../img/people06/topics.jpg");
	}
	
	/*people07
	------------------------------------------------------------------*/		
	.people07 .top .wrap01:before{
		background: url("../img/people07/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people07 .top .wrap02:before{
		background: url("../img/people07/top02.jpg") no-repeat center;
		background-size: cover;
	}
	.people07 .top .wrap03:before{
		background: url("../img/people07/top03.jpg") no-repeat center;
		background-size: cover;
	}
	.people07 .top .wrap04:before{
		background: url("../img/people07/top04.jpg") no-repeat center;
		background-size: cover;
	}
	.people07 .sec01 .bg{
		background-image: url("../img/people07/ph01.jpg");
	}
	
	.people07 .sec02 .bg {
		background-image: url("../img/people07/ph02.jpg");
	}
	
	.people07 .sec03 .bg{
		background-image: url("../img/people07/ph03.jpg");
	}
	.people07 .sec04 .bg {
		background-image: url("../img/people07/ph04.jpg");
	}
	.people07 .sec05 .topics .contents .img-box {
		background-image: url("../img/people07/topics.jpg");
	}
	
	/*people08
	------------------------------------------------------------------*/		
	.people08 .top .wrap01:before{
		background: url("../img/people08/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people08 .sec01 .bg{
		background-image: url("../img/people08/ph01.jpg");
	}
	
	.people08 .sec02 .bg {
		background-image: url("../img/people08/ph02.jpg");
	}
	
	.people08 .sec03 .bg{
		background-image: url("../img/people08/ph03.jpg");
	}
	.people08 .sec04 .bg {
		background-image: url("../img/people08/ph04.jpg");
	}
	.people08 .sec05 .topics .contents .img-box {
		background-image: url("../img/people08/topics.jpg");
	}
	
	/*people09
	------------------------------------------------------------------*/	
	.people09 .top .wrap01:before{
		background: url("../img/people09/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people09 .sec01 .bg{
		background-image: url("../img/people09/ph01.jpg");
	}
	
	.people09 .sec02 .bg {
		background-image: url("../img/people09/ph02.jpg");
	}
	
	.people09 .sec03 .bg{
		background-image: url("../img/people09/ph03.jpg");
	}
	.people09 .sec04 .bg {
		background-image: url("../img/people09/ph04.jpg");
	}
	.people09 .sec05 .topics .contents .img-box {
		background-image: url("../img/people09/topics.jpg");
	}
	
	
	
	
	.deco_area {
	}
		.deco {
			position: absolute;
			z-index: 1;
			width: 4vw;
			height: 12px;
		}
		.sec01 .deco02, .sec03 .deco01, .sec04 .deco02, .sec04 .deco04, .career .top .deco05 {
			width: 12vw;
		}
			.sec01 .deco02, .sec03 .deco01, .sec04 .deco02, .sec04 .deco04, .career .top .deco05 {
				height: 28px;
			}
		.top .deco, .sec01 .deco, .sec02 .deco, .sec03 .deco, .sec04 .deco, .sec05 .deco, .sec06 .deco {
		}
		.top .deco01 {
			top: 30%;
			left: 0%;
		}
		.top .deco02 {
			bottom: 30%;
			left: 23%;
		}
		.top .deco03 {
			bottom: 28%;
			left: 19%;
		}
			.people04 .top .deco02 {
				left: 4%;
			}
			.people04 .top .deco03 {
				left: 0;
			}
		.top .deco04 {
			top: 41%;
			right: calc(50% - 3px);
		}
		.top .deco05 {
			bottom: 5%;
			right: calc(30% + 6px);
		}
		.top .deco06 {
			top: 36.5%;
			right: 4%;
		}
		.top .deco07 {
			top: 35%;
			right: 0%;
		}
		.career .top .deco01 {
			top: 30%;
			left: 0%;
		}
		.career .top .deco02 {
			top: 30%;
			left: 23%;
		}
		.career .top .deco03 {
			top: calc(40% + 28px);
			left: 12vw;
		}
		.career .top .deco04 {
			top: 52%;
			right: 35%;
		}
		.career .top .deco05 {
			top: 40%;
			left: 0;
		}
		.career .top .deco06 {
			top: 66.5%;
			right: 4%;
		}
		.career .top .deco07 {
			top: calc(66.5% - 12px);
			right: 0%;
		}
	
		.sec01 .deco01 {
			top: -6%;
			right: 18%;
		}
		.sec01 .deco02 {
			top: 0;
			right: 23%;
		}
		.sec01 .deco03 {
			top: 72%;
			left: 0%;
		}
		.sec01 .deco04 {
			top: 73.5%;
			left: 4%;
		}
		.sec02 .deco01 {
			top: 0;
			right: calc(514px - 4vw);
		}
		.sec02 .deco02 {
			top: 12px;
			right: 514px;
		}
		.sec03 .deco01 {
			top: -28px;
			left: calc(50% - 520px);
		}
		.sec03 .deco02 {
			top: 0;
			left: calc(50% - 520px - 4vw);
		}
		.sec03 .deco03 {
			top: 11%;
			left: calc(50% - 520px - 2vw);
		}
		.sec04 .deco01 {
			top: -40px;
			right: 12vw;
		}
		.sec04 .deco02 {
			top: -28px;
			right: 0;
		}
		.sec04 .deco03 {
			bottom: -5%;
			right: 12vw;
		}
		.sec04 .deco04 {
			bottom: calc(-5% + 12px);
			right: 0;
		}
		.sec05 .deco01 {
			top: -12px;
			left: 4vw;
		}
		.sec05 .deco02 {
			top: 0;
			left: 0;
		}
		.sec05 .deco03 {
			top: 32%;
			right: 0;
		}
			.deco span {
				position: absolute;				
				top: 0;
			}
			
			.on .deco span {
				
			}
			.top .deco01 span {
				left: 0;
				background-color: #fff;
				transition: 0.3s 0.9s;
			}
			.top .deco02 span {
				right: 0;
				background-color: #f5b400;
				transition: 0.3s 1.5s;
			}
			.top .deco03 span {
				left: 0;
				background-color: #f06400;
				transition: 0.3s 0.7s;
			}
			.top .deco04 span {
				right: 0;
				background-color: #f06400;
				transition: 0.3s 2.1s;
			}
			.top .deco05 span {
				left: 0;
				background-color: #6e3cbe;
				transition: 0.3s 1.3s;
			}
			.career .top .deco05 span {
				left: 0;
				background-color: #0a9bcd;
				transition: 0.3s 1.3s;
			}
			.top .deco06 span {
				right: 0;
				background-color: #0a9bcd;
				transition: 0.3s 1.9s;
			}
			.top .deco07 span {
				left: 0;
				background-color: #6e3cbe;
				transition: 0.3s 0.5s;
			}
			.sec01 .deco01 span {
				left: 0;
				background-color: #f06400;
				transition: 0.3s 0.9s;
			}
			.sec01 .deco02 span {
				right: 0;
				background-color: #0a9bcd;
				transition: 0.3s 1.5s;
			}
			.sec01 .deco03 span {
				left: 0;
				background-color: #f5b400;
				transition: 0.3s 0.7s;
			}
			.sec01 .deco04 span {
				right: 0;
				background-color: #0a9bcd;
				transition: 0.3s 2.1s;
			}
			.sec02 .deco01 span {
				left: 0;
				background-color: #6e3cbe;
				transition: 0.3s 0.9s;
			}
			.sec02 .deco02 span {
				right: 0;
				background-color: #f5b400;
				transition: 0.3s 1.5s;
			}
			.sec03 .deco01 span {
				left: 0;
				background-color: #f06400;
				transition: 0.3s 0.9s;
			}
			.sec03 .deco02 span {
				right: 0;
				background-color: #6e3cbe;
				transition: 0.3s 1.5s;
			}
			.sec03 .deco03 span {
				left: 0;
				background-color: #f5b400;
				transition: 0.3s 0.7s;
			}
			.sec04 .deco01 span {
				left: 0;
				background-color: #0a9bcd;
				transition: 0.3s 0.9s;
			}
			.sec04 .deco02 span {
				right: 0;
				background-color: #f5b400;
				transition: 0.3s 1.5s;
			}
			.sec04 .deco03 span {
				left: 0;
				background-color: #0a9bcd;
				transition: 0.3s 0.7s;
			}
			.sec04 .deco04 span {
				right: 0;
				background-color: #f5b400;
				transition: 0.3s 2.1s;
			}
			.sec05 .deco01 span {
				left: 0;
				background-color: #0a9bcd;
				transition: 0.3s 0.9s;
			}
			.sec05 .deco02 span {
				right: 0;
				background-color: #6e3cbe;
				transition: 0.3s 1.5s;
			}
			.sec05 .deco03 span {
				left: 0;
				background-color: #0a9bcd;
				transition: 0.3s 0.7s;
			}
	
/*
			.on .deco span {
				width: 100% !important;
			}
*/
			.deco.on span {
			}
}




/* ++++++++++++++++++++++++++++++++++++++++++++++    sp    ++++++++++++++++++++++++++++++++++++++++++++++  */
/* ~ 800px */
@media only screen and (min-width: 800px) and (max-width: 1040px) {
	.sec02 .contents .tit {
		padding-left: 30px;
		margin-left: 0;
	}
	.sec02 .contents h3 {
		padding-left: 30px;
}
	.sec02 .contents p {
		width: calc(100% - 584px);
		padding-left: 30px;
}
	.sec04 .wrapper .tit{
		padding-left: calc(520px - 424px);
	}
	
}

/* ++++++++++++++++++++++++++++++++++++++++++++++    sp    ++++++++++++++++++++++++++++++++++++++++++++++  */
/* ~ 800px */
@media only screen and (max-width: 800px) {

	#main {
		padding-top: 50px;
		position: relative;
		overflow: hidden;
	}

	.top {
		position: relative;
	}
	.top-container {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.top .top-container .tit {
		font-size: 57px;
		line-height: 0.6;
		position: absolute;
		color: rgba(255,255,255,0.2);
		top: 0;
		right: -0.5em;
		z-index: 2;
		font-weight: 400;
		letter-spacing: 0.5em;
	}
	.top .top-container > div {
		position: relative;
	}
	.top .top-container .wrap01{
		width: 100%;
		height: 350px;
		margin-bottom: 6px;
		position: relative;
	}
		.top .wrap01 .txt-box {
			position: absolute;
			width: 100%;
			bottom: 0;
			left: 0;
			color: white;
			box-sizing: border-box;
			font-weight: 500;
		}
			.top .wrap01 .txt-box .num{
				background-color: black;
				line-height: 1;
				display: inline-block;
				vertical-align: bottom;
				padding: 0 10px 0 11px;
				transform: translateX(-10px);
				transition: 1.0s;
				opacity: 0;
				z-index: 1;
			}
				.top .top-container.on .wrap01 .txt-box .num{
					transform: translateX(0);
					opacity: 1.0;
				}
			.top .wrap01 .txt-box .lead{				
				display: block;				
			}
				.top .wrap01 .txt-box .lead > span{
					display: block;
					font-size: 0;
				}
				.top .wrap01 .txt-box .lead span.line{
					display: inline-block;
					padding: 3px 10px 3px 10px;
					overflow: hidden;
					position: relative;
					font-size: 2.3vw;
					font-size:clamp(19px, 2vw, 34px);
					font-weight: 500;
					transform: translateX(-10px);
					transition: 1.0s;
					opacity: 0;
					z-index: 1;
				}
				.top .top-container.on .wrap01 .txt-box .lead span.line{
					transform: translateX(0);
					opacity: 1.0;
				}
					.top .wrap01 .txt-box .lead span:nth-of-type(2) span.line{
						transition: 1.0s 0.2s;
					}
				.top .wrap01 .txt-box .lead span.line:before{
					content: '';
					display: block;
					position: absolute;
					width: 100%;
					height: 100%;
					left: 0;
					top: 0;
					background-color: #0a9bcd;
					transition: 0.8s 0.2s;
					transform: translateX(-100%);
					z-index: -1;
				}
					.top .wrap01 .txt-box .lead span:nth-of-type(2) span.line:before{
						transition: 0.8s 0.4s;
					}
					.top .wrap01 .txt-box .lead span:nth-of-type(3) span.line:before{
						transition: 0.8s 0.6s;
					}
				.top .top-container.on .wrap01 .txt-box .lead span.line:before{
					transform: translateX(0);
				}
	
	.top .wrap02{
		width: calc(33.3% - 3px);
		height: 80px;
		margin-bottom: 6px;
	}
	.top .wrap03{
		width: calc(33.3% - 3px);
		height: 80px;
	}
	.top .wrap04{
		width: calc(33.3% - 6px);
		height: 80px;
	}
	.top .wrap05{
		width: 100%;
		font-weight: 400;
		font-size: 12px;
		flex-shrink: 0;
		padding: 20px 5% 20px 5%;
		box-sizing: border-box;
		background-color: black;
		position: relative;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		justify-content: center;
		align-items: center;
		color: white;
	}
		.top .wrap05 .profile{
			position: absolute;
			top: 0;
			left: 0;
			background-color: #0a9bcd;
			padding: 3px 5px 2px;
			line-height: 1em;
		}
			.top .wrap05 .txt-box .name{
				font-size: 20px;
			}
			.top .wrap05 .txt-box .en{
				color: #0a9bcd;
			}
	
	
	.sec {
		position: relative;
		margin-top: 80px;
	}
	.sec .bg{
		width: 100%;
		height: 200px;
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
	}
	.sec .contents{
		box-sizing: border-box;
		width: 100%;
		padding: 0 5%;
		margin-top: -22px;
		margin-right: 0;
		margin-left: auto;
	}
		.sec .contents .tit{
			display: inline-block;
			background-color: #f5b400;
/*			width: 95vw;*/
			margin-left: -6%;
			font-size: 20px;
			font-weight: 500;
			color: white;
			padding: 0 20px;
			box-sizing: border-box;
			position: relative;
			letter-spacing: 0.16em;
			text-align: justify;
			line-break: strict;
			word-wrap: break-word;
			overflow-wrap: break-word;
		}
		.sec .contents .tit::before{
			width: 55px;
			height: 44px;
			position: absolute;
			z-index: 1;
			content: "";
			display: block;
			background-size: contain;
			background-repeat: no-repeat;
		}
		.sec .contents h3{
			margin-top: 35px;
			font-size: 18px;
			letter-spacing: 0.08em;
			font-weight: 500;
			text-align: justify;
			line-break: strict;
			word-wrap: break-word;
			overflow-wrap: break-word;
		}
		.sec .contents p{
			line-height: 2.2;
			letter-spacing: 0.08em;
			margin-top: 20px;
			text-align: justify;
			line-break: strict;
			word-wrap: break-word;
			overflow-wrap: break-word;
		}
		.sec .contents p.small{
			font-size: 11px;
		}
	
	
	.sec{
	}
	
	.sec01 {
		margin-top: 100px;
	}
	.sec01 .contents .tit{
		background-color: #f06400;
	}
	.sec01 .contents .tit::before{
		background-image: url("../img/icon01.png");
		width: 55px;
		height: 44px;
		top: 21px;
		left: 97px;
		transform: rotate(355deg);

	}
	
	.sec02 .contents .tit{
		background-color: #0a9bcd;
		font-weight: 400;
	}
	.sec02 .contents .tit::before{
		background-image: url("../img/icon02.png");
		width: 55px;
		top: 21px;
		height: 44px;
		left: 114px;
		transform: rotate(355deg);
	}
	.career .sec02 .contents .tit{
		padding-right: 50px;
	}
	.career .sec02 .contents .tit::before{
		left: 158px;
	}
	.sec03 .contents .tit{
		background-color: #6e3cbe;
		font-weight: 400;
	}
	.sec03 .contents .tit::before{
		background-image: url("../img/icon03.png");
		width: 125px;
		height: 68px;
		right: 35px;
		bottom: -30px;
		left: auto;
		top: auto;
	}
	.career .sec03 .contents .tit::before{
/*		background: none;*/
		left: 20px;
	}
	.sec04 .wrapper .tit{
/*			width: 95vw;*/
			font-size: 20px;
			font-weight: 500;
			color: white;
			padding: 0 20px;
			box-sizing: border-box;
			position: relative;
			letter-spacing: 0.16em;
		background-color: #f06400;
		padding-right: 140px;
	}
	.career .sec04 .wrapper .tit{
		padding-right: 130px;
	}
	.sec04 .wrapper .tit::before{
		position: absolute;
		z-index: 1;
		content: "";
		display: block;
		background-size: contain;
		background-repeat: no-repeat;
		background-image: url("../img/icon04.png");
		width: 125px;
		height: 68px;
		right: 0;
		bottom: auto;
		left: auto;
		top: -35px;
	}
	.sec04 .wrapper .contents h3{
/*		margin-top: 55px;*/
	}
	.sec05 {
		margin-top: 100px;
	}
	.sec05 .contents p {
		margin-top: 0;
		line-height: 1.2;
	}
	.sec05 .shedule, .sec05 .topics {
		padding-bottom: 60px;
		width: 100%;
	}
	.sec05 > div .img-box{
		width: 60px;
		margin: auto;
		text-align: center;
	}
	.sec05 .sub_tit{
		text-align: center;
		margin-top: 3px;
	}
	.sec05 .contents h2{
		text-align: center;
		font-weight: 500;
	}
	.sec05 .contents {
		width: 100%;
		margin: auto;
	}
		.sec05 .shedule {
			padding-top: 30px;
			background-color: rgba(0, 155, 205, 0.25);
		}
	.sec05 .shedule .contents h2{
		font-size: 16px;
		margin-top: 20px;
		font-weight: 500;
	}
	.sec05 .shedule .timeline {
/*		font-weight: 500;*/
		margin-top: 40px;
	}
	.sec05 .shedule .timeline li{
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		align-items: flex-start;
	}
	.sec05 .shedule .timeline li:not(:first-child){
		margin-top: 25px;
	}
	.sec05 .shedule .timeline .time {
		width: 70px;
		flex-shrink: 0;
		margin-right: 10px;
		position: relative;
	}
	.sec05 .shedule .timeline li:not(:last-child) .time::after {
		content: "";
		display: block;
		width: 35px;
		height: calc(100% - 30px);
		border-right: 4px dotted #0a9bcd;
		margin-top: 10px;
	}
	.sec05 .shedule .timeline .en{
		color: #0a9bcd;
		font-size: 24px;
		text-align: center;
	}
	.sec05 .shedule .timeline dt{
		font-size: 17px;
		margin-bottom: 5px;
		font-weight: 500;
		
	}
	.sec05 .shedule .timeline dd{
		text-align: justify;
		line-break: strict;
    	word-wrap: break-word;
    	overflow-wrap: break-word;
	}
	
	
	
	.sec05 .topics {
			padding-top: 40px;
		background-color: rgba(245, 180, 0, 0.3);
	}
	.sec05 .topics .contents h2 {
		font-size: 18px;
		font-weight: 500;
		margin-top: 20px;
		line-break: strict;
    	word-wrap: break-word;
    	overflow-wrap: break-word;
	}
	.sec05 .topics .contents p {
		margin-top: 45px;
		line-height: 2.2;
		letter-spacing: 0.08em;
	}
	
	.sec05 .topics .contents .img-box {
		width: 100%;
		margin-top: 45px;
	}
	.sec05 .topics .contents .img-box {
		width: 100%;
		height: 0px;
		margin-top: 45px;
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
		
/*		縦横比固定*/
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		padding-top: 62.3%;
	}
	
	.career .top .tit {
		line-height: 0.8;
		font-size: 36px;
	}
	.career .top .wrap05 {
		position: absolute;
		top: 100%;
		margin-top: 6px;
	}
	.career .top .wrap05 .txt-box{
		position: relative;
		width: auto;
	}
	.career .top .wrap05 .txt-box p{
		display: inline;
	}
	
	.career_wrap {
		margin-top: 100px;
		background-color: #f1f1f1;
		padding: 50px 0;
	}
	.career_wrap .wrap {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		flex-direction: column;
	}
	.career_wrap .wrap > div {
		width: 100%;
		padding: 0 5%;
		box-sizing: border-box;
	}
	.career_wrap .wrap > div .content {
		margin-top: 16px;
		height: 100%;
	}
	.career_wrap .tit{
		font-size: 16px;
		font-weight: 500;
	}
	.career_wrap .step{
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		flex-direction: column;
	}
	.career_wrap .step .content{
		padding-left: 35px;
		position: relative;
	}
	.career_wrap .now-job {
		margin-top: 32px;
	}
	.career_wrap .now-job .content{
		
	}
	.now-job  h3{
		margin-top: 8px;
		font-size: 18px;
		letter-spacing: 0.08em;
		font-weight: 500;
		text-align: justify;
		line-break: strict;
    	word-wrap: break-word;
    	overflow-wrap: break-word;
	}
	.career_wrap .content p{
		line-height: 2.2;
		text-align: justify;
		line-break: strict;
    	word-wrap: break-word;
    	overflow-wrap: break-word;
	}
	.career_wrap .step .content dl{
		padding-bottom: 24px;
	}
	.career_wrap .step .content dl{
		position: relative;
		text-align: justify;
		line-break: strict;
    	word-wrap: break-word;
    	overflow-wrap: break-word;
	}
	.career_wrap .step .content dl::before{
		content: "";
		display: block;
		width: 15px;
		height: 15px;
		background-color: #fff;
		border: solid 2px #0a9bcd;
		border-radius: 15px;
		position: absolute;
		top: 4px;
		left: -32px;
		z-index: 1;
	}
	.career_wrap .step .content dl::after{
/*
		content: "";
		display: block;
		width: 5px;
		height: 100%;
		background-color: #00b176;
		position: absolute;
		top: 4px;
		left: -25px;
*/
	}
	.career_wrap .step .content::after{
		content: "";
		display: block;
		width: 4px;
		height: calc(100% - 6px);
		background-color: #0a9bcd;
		position: absolute;
		top: 4px;
		left: 10px;
	}
	.career_wrap .step .content::before{
		content: "";
		display: block;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 10px 10px 0 10px;
		border-color: #0a9bcd transparent transparent transparent;
		position: absolute;
		bottom: 0;
		left: 2px;
	}
	.career .sec01 {
		margin-top: 0;
	}
	/* animation
	------------------------------------------------------------------*/		
	/* topの画像 */
	/* topの画像 */
	.top .top-container > .fade_ramdom,
	.top .top-container > .wrap05{
		background-color: #dfdfdf;
		z-index: 1;
	}
	.top .top-container > .fade_ramdom:before{
		content: '';
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		opacity: 0;
		transition: 1.0s;
	}
	.top .top-container > .fade_ramdom.on:before{
		opacity: 1.0;
	}
	.top .top-container .wrap05 .profile,
	.top .top-container .wrap05 .txt-box{		
		opacity: 0;
		transition: 1.0s 0.4s;
	}
	.top .top-container.on .wrap05 .profile,
	.top .top-container.on .wrap05 .txt-box{		
		opacity: 1.0;
	}
	.top .top-container .wrap05:before{
		content: '';
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		opacity: 0;
		background-color: #000;
		transition: 1.0s 0.4s;
		z-index: -1;
	}
	.top .top-container.on .wrap05:before{
		opacity: 1.0;
		
	}
	
	/*people01
	------------------------------------------------------------------*/		
	.people01 .top .wrap01:before{
		background: url("../img/people01/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people01 .top .wrap02:before{
		background: url("../img/people01/top02.jpg") no-repeat center;
		background-size: cover;
	}
	.people01 .top .wrap03:before{
		background: url("../img/people01/top03.jpg") no-repeat center;
		background-size: cover;
	}
	.people01 .top .wrap04:before{
		background: url("../img/people01/top04.jpg") no-repeat center;
		background-size: cover;
	}
	.people01 .sec01 .bg{
		background-image: url("../img/people01/ph01.jpg");
	}
	
	.people01 .sec02 .bg {
		background-image: url("../img/people01/ph02.jpg");
		background-position: top 10% center;
	}
	
	.people01 .sec03 .bg{
		background-image: url("../img/people01/ph03.jpg");
	}
	.people01 .sec04 .bg {
		background-image: url("../img/people01/ph04.jpg");
	}
		
	.people01 .sec05 .topics .contents .img-box {
		background-image: url("../img/people01/topics.jpg");
	}
	
	/*people02
	------------------------------------------------------------------*/		
	.people02 .top .wrap01:before{
		background: url("../img/people02/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people02 .top .wrap02:before{
		background: url("../img/people02/top02.jpg") no-repeat center;
		background-size: cover;
	}
	.people02 .top .wrap03:before{
		background: url("../img/people02/top03.jpg") no-repeat center;
		background-size: cover;
	}
	.people02 .top .wrap04:before{
		background: url("../img/people02/top04.jpg") no-repeat center;
		background-size: cover;
	}
	.people02 .sec01 .bg{
		background-image: url("../img/people02/ph01.jpg");
	}
	
	.people02 .sec02 .bg {
		background-image: url("../img/people02/ph02.jpg");
		background-position: top 10% center;
	}
	
	.people02 .sec03 .bg{
		background-image: url("../img/people02/ph03.jpg");
	}
	.people02 .sec04 .bg {
		background-image: url("../img/people02/ph04.jpg");
	}
		
	.people02 .sec05 .topics .contents .img-box {
		background-image: url("../img/people02/topics.jpg");
	}
	
	/*people03
	------------------------------------------------------------------*/		
	.people03 .top .wrap01:before{
		background: url("../img/people03/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people03 .top .wrap02:before{
		background: url("../img/people03/top02.jpg") no-repeat center;
		background-size: cover;
	}
	.people03 .top .wrap03:before{
		background: url("../img/people03/top03.jpg") no-repeat center;
		background-size: cover;
	}
	.people03 .top .wrap04:before{
		background: url("../img/people03/top04.jpg") no-repeat center;
		background-size: cover;
	}
	.people03 .sec01 .bg{
		background-image: url("../img/people03/ph01.jpg");
	}
	
	.people03 .sec02 .bg {
		background-image: url("../img/people03/ph02.jpg");
		background-position: top 17% center;
	}
	
	.people03 .sec03 .bg{
		background-image: url("../img/people03/ph03.jpg");
	}
	.people03 .sec04 .bg {
		background-image: url("../img/people03/ph04.jpg");
	}
		
	.people03 .sec05 .topics .contents .img-box {
		background-image: url("../img/people03/topics.jpg");
	}
	/*people04
	------------------------------------------------------------------*/		
	.people04 .top .wrap01:before{
		background: url("../img/people04/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people04 .top .wrap02:before{
		background: url("../img/people04/top02.jpg") no-repeat center;
		background-size: cover;
	}
	.people04 .top .wrap03:before{
		background: url("../img/people04/top03.jpg") no-repeat center;
		background-size: cover;
	}
	.people04 .top .wrap04:before{
		background: url("../img/people04/top04.jpg") no-repeat center;
		background-size: cover;
	}
	.people04 .sec01 .bg{
		background-image: url("../img/people04/ph01.jpg");
	}
	
	.people04 .sec02 .bg {
		background-image: url("../img/people04/ph02.jpg");
		background-position: top 20% center;
	}
	
	.people04 .sec03 .bg{
		background-image: url("../img/people04/ph03.jpg");
	}
	.people04 .sec04 .bg {
		background-image: url("../img/people04/ph04.jpg");
	}
		
	.people04 .sec05 .topics .contents .img-box {
		background-image: url("../img/people04/topics.jpg");
	}
	
	/*people05
	------------------------------------------------------------------*/		
	.people05 .top .wrap01:before{
		background: url("../img/people05/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people05 .top .wrap02:before{
		background: url("../img/people05/top02.jpg") no-repeat center;
		background-size: cover;
	}
	.people05 .top .wrap03:before{
		background: url("../img/people05/top03.jpg") no-repeat center;
		background-size: cover;
	}
	.people05 .top .wrap04:before{
		background: url("../img/people05/top04.jpg") no-repeat center;
		background-size: cover;
	}
	.people05 .sec01 .bg{
		background-image: url("../img/people05/ph01.jpg");
	}
	
	.people05 .sec02 .bg {
		background-image: url("../img/people05/ph02.jpg");
		background-position: top 28% center;
	}
	
	.people05 .sec03 .bg{
		background-image: url("../img/people05/ph03.jpg");
	}
	.people05 .sec04 .bg {
		background-image: url("../img/people05/ph04.jpg");
	}
		
	.people05 .sec05 .topics .contents .img-box {
		background-image: url("../img/people05/topics.jpg");
	}
	/*people06
	------------------------------------------------------------------*/		
	.people06 .top .wrap01:before{
		background: url("../img/people06/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people06 .top .wrap02:before{
		background: url("../img/people06/top02.jpg") no-repeat center;
		background-size: cover;
	}
	.people06 .top .wrap03:before{
		background: url("../img/people06/top03.jpg") no-repeat center;
		background-size: cover;
	}
	.people06 .top .wrap04:before{
		background: url("../img/people06/top04.jpg") no-repeat center;
		background-size: cover;
	}
	.people06 .sec01 .bg{
		background-image: url("../img/people06/ph01.jpg");
	}
	
	.people06 .sec02 .bg {
		background-image: url("../img/people06/ph02.jpg");
		background-position: top 12% center;
	}
	
	.people06 .sec03 .bg{
		background-image: url("../img/people06/ph03.jpg");
		background-position: top;
	}
	.people06 .sec04 .bg {
		background-image: url("../img/people06/ph04.jpg");
	}
		
	.people06 .sec05 .topics .contents .img-box {
		background-image: url("../img/people06/topics.jpg");
	}
	
	/*people07
	------------------------------------------------------------------*/
	.people07 .top .wrap01:before{
		background: url("../img/people07/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people07 .top .wrap02:before{
		background: url("../img/people07/top02.jpg") no-repeat center;
		background-size: cover;
	}
	.people07 .top .wrap03:before{
		background: url("../img/people07/top03.jpg") no-repeat center;
		background-size: cover;
	}
	.people07 .top .wrap04:before{
		background: url("../img/people07/top04.jpg") no-repeat center;
		background-size: cover;
	}
	.people07 .sec01 .bg{
		background-image: url("../img/people07/ph01.jpg");
	}
	
	.people07 .sec02 .bg {
		background-image: url("../img/people07/ph02.jpg");
		background-position: top;
	}
	
	.people07 .sec03 .bg{
		background-image: url("../img/people07/ph03.jpg");
	}
	.people07 .sec04 .bg {
		background-image: url("../img/people07/ph04.jpg");
	}
	.people07 .sec05 .topics .contents .img-box {
		background-image: url("../img/people07/topics.jpg");
	}
	/*people08
	------------------------------------------------------------------*/
	.people08 .top .wrap01:before{
		background: url("../img/people08/top01.jpg") no-repeat top center;
		background-size: cover;
	}
	.people08 .sec01 .bg{
		background-image: url("../img/people08/ph01.jpg");
	}
	
	.people08 .sec02 .bg {
		background-image: url("../img/people08/ph02.jpg");
		background-position: top 21% center;
	}
	
	.people08 .sec03 .bg{
		background-image: url("../img/people08/ph03.jpg");
	}
	.people08 .sec04 .bg {
		background-image: url("../img/people08/ph04.jpg");
	}
	.people08 .sec05 .topics .contents .img-box {
		background-image: url("../img/people08/topics.jpg");
	}
	/*people09
	------------------------------------------------------------------*/		
	.people09 .top .wrap01:before{
		background: url("../img/people09/top01.jpg") no-repeat center;
		background-size: cover;
	}
	.people09 .sec01 .bg{
		background-image: url("../img/people09/ph01.jpg");
	}
	
	.people09 .sec02 .bg {
		background-image: url("../img/people09/ph02.jpg");
		background-position: top 35% center;
	}
	
	.people09 .sec03 .bg{
		background-image: url("../img/people09/ph03.jpg");
	}
	.people09 .sec04 .bg {
		background-image: url("../img/people09/ph04.jpg");
	}
	.people09 .sec05 .topics .contents .img-box {
		background-image: url("../img/people09/topics.jpg");
	}
	
	
	
	
	.deco_area {
	}
		.deco {
			position: absolute;
			z-index: 0;
			width: 12vw;
			height: 12px;
		}
			.sec01 .deco02, .sec03 .deco01, .sec04 .deco02, .sec04 .deco04 {
				width: 32vw;
			}
			.sec01 .deco02, .sec03 .deco01, .sec04 .deco02, .sec04 .deco04 {
				height: 20px;
			}
		.top .deco, .sec01 .deco, .sec02 .deco, .sec03 .deco, .sec04 .deco, .sec05 .deco, .sec06 .deco {
		}
		.top .deco01 {
			top: 10%;
			left: 0%;
		}
		.top .deco02 {
			bottom: 54%;
			left: 21%;
		}
		.top .deco03 {
			bottom: 28%;
			left: 19%;
		}
		.top .deco04 {
			top: 23%;
			right: 0;
		}
		.top .deco05 {
			bottom: 32.4%;
			right: 12vw;
		}
		.top .deco06 {
			bottom: 30%;
			right: 0%;
		}
		.top .deco07 {
			bottom: 6%;
			left: 0%;
		}
		.sec01 .deco01 {
			top: -6%;
			right: -2%;
		}
		.sec01 .deco02 {
			top: 0;
			right: -10%;
		}
		.sec01 .deco03 {
			bottom: -0.8%;
			left: -8%;
		}
		.sec01 .deco04 {
			bottom: -2%;
			left: 4%;
		}
		.sec02 .deco01 {
			top: -12px;
			right: 12vw;
		}
		.sec02 .deco02 {
			top: 0;
			right: 0;
		}
		.sec03 .deco01 {
			top: -20px;
			left: 0;
		}
		.sec03 .deco02 {
			top: 2%;
			left: -4%;
		}
		.sec03 .deco03 {
			top: 11%;
			left: calc(50% - 520px - 2vw);
		}
		.sec04 .deco01 {
			top: -32px;
			right: 32vw;
		}
		.sec04 .deco02 {
			top: -20px;
			right: 0;
		}
		.sec04 .deco03 {
			bottom: calc(-3% + 20px);
			right: 32vw;
		}
		.sec04 .deco04 {
			bottom: -3%;
			right: 0;
		}
		.sec05 .deco01 {
			top: -12px;
			left: 12vw;
		}
		.sec05 .deco02 {
			top: 0;
			left: 0;
		}
		.sec05 .deco03 {
			bottom: 46%;
			right: 0;
		}
			.deco span {
				position: absolute;				
				top: 0;
				width: 0;
			}
			
			.on .deco span {
				width: 0 !important;
			}
			.top .deco01 span {
				left: 0;
				background-color: #fff;
				transition: 0.3s 0.9s;
			}
			.top .deco02 span {
				right: 0;
				background-color: #f5b400;
				transition: 0.3s 1.5s;
			}
			.top .deco03 span {
				left: 0;
				background-color: #fff;
				transition: 0.3s 0.7s;
			}
			.top .deco04 span {
				right: 0;
				background-color: #f06400;
				transition: 0.3s 2.1s;
			}
			.top .deco05 span {
				left: 0;
				background-color: #6e3cbe;
				transition: 0.3s 1.3s;
			}
			.top .deco06 span {
				right: 0;
				background-color: #0a9bcd;
				transition: 0.3s 1.9s;
			}
			.top .deco07 span {
				left: 0;
				background-color: #6e3cbe;
				transition: 0.3s 0.5s;
			}
			.sec01 .deco01 span {
				left: 0;
				background-color: #f06400;
				transition: 0.3s 0.9s;
			}
			.sec01 .deco02 span {
				right: 0;
				background-color: #0a9bcd;
				transition: 0.3s 1.5s;
			}
			.sec01 .deco03 span {
				left: 0;
				background-color: #f5b400;
				transition: 0.3s 0.7s;
			}
			.sec01 .deco04 span {
				right: 0;
				background-color: #0a9bcd;
				transition: 0.3s 2.1s;
			}
			.sec02 .deco01 span {
				left: 0;
				background-color: #6e3cbe;
				transition: 0.3s 0.9s;
			}
			.sec02 .deco02 span {
				right: 0;
				background-color: #f5b400;
				transition: 0.3s 1.5s;
			}
			.sec03 .deco01 span {
				left: 0;
				background-color: #f06400;
				transition: 0.3s 0.9s;
			}
			.sec03 .deco02 span {
				right: 0;
				background-color: #6e3cbe;
				transition: 0.3s 1.5s;
			}
			.sec03 .deco03 span {
				left: 0;
				background-color: #f5b400;
				transition: 0.3s 0.7s;
			}
			.sec04 .deco01 span {
				left: 0;
				background-color: #0a9bcd;
				transition: 0.3s 0.9s;
			}
			.sec04 .deco02 span {
				right: 0;
				background-color: #f5b400;
				transition: 0.3s 1.5s;
			}
			.sec04 .deco03 span {
				left: 0;
				background-color: #0a9bcd;
				transition: 0.3s 0.7s;
			}
			.sec04 .deco04 span {
				right: 0;
				background-color: #f5b400;
				transition: 0.3s 2.1s;
			}
			.sec05 .deco01 span {
				left: 0;
				background-color: #0a9bcd;
				transition: 0.3s 0.9s;
			}
			.sec05 .deco02 span {
				right: 0;
				background-color: #6e3cbe;
				transition: 0.3s 1.5s;
			}
			.sec05 .deco03 span {
				left: 0;
				background-color: #0a9bcd;
				transition: 0.3s 0.7s;
			}
	
/*
			.on .deco span {
				width: 100% !important;
			}
*/
			.deco.on span {
				width: 100% !important;
			}
	
	
	
	
}



