@charset "UTF-8";

/* service ---------------------------------------*/

.servicewrapper{padding-top: 200px;}

.servicemain{
	padding: 0 50px;
	margin-bottom: 60px;
}

.servicemain-inner{
	max-width: 1140px;
	margin: 0 auto;
	overflow: hidden;
}

.servicemain-head{
	width: 40%;
	float: left;
}

.servicemain-head-inner{
	display:flex;
	justify-content:space-between;
}

.servicemain-link{
	font-size: 12px;
	margin-bottom: 30px;
}

.servicemain-link-list{
	line-height: 2;
	letter-spacing:0.02em;
}

.servicemain-link-list,
.servicemain-link-list a{color:#404040;}

.servicemain-subtitle{float: left;}

.servicemain-image{
	float: right;
	width: 57%;
}

.servicemain-body{
	width: 40%;
	float: left;
}

.servicemain-body p{
	line-height: 1.8;
	font-size: 15px;
	font-weight:300;
}


/* innerlink ---------------------------------------*/

.service-innerlink{margin-bottom: 100px;}
.service-innerlink.col3{padding: 115px 0 10px;}

.service-innerlink ul{
	display:flex;
	justify-content:space-between;
	align-items:center;
	flex-wrap:wrap;
	max-width: 840px;
	margin: 0 auto;
}

.service-innerlink.col3 ul{max-width:640px;}

.service-innerlink ul li{
	width:180px;
	text-align:center;
}

.service-innerlink ul li span{
	display: block;
	cursor: pointer;
	transition: all .25s ease;
	position:relative;
	padding-bottom: 20px;
}

.service-innerlink ul li span::after{
	content: '';
	position:absolute;
	left: 50%;
	top: auto;
	bottom: 0;
	width: 5px;
	height: 5px;
	border-right: 1px solid #707070;
	border-bottom: 1px solid #707070;
	transform: translate(-50% ,0) rotate(45deg);
	transition: all .25s ease;
}

.service-innerlink ul li span img{transition: all .25s ease;}
.service-innerlink ul li span:hover img{transform: rotate(-4deg);}

.service-innerlink ul li span p{
	transition: all .25s ease;
	font-size: 18px;
	line-height: 1.5;
	padding-top: 5px;
}

.service-innerlink ul li span small{
	font-size: 15px;
	font-weight: 300;
	display: block;
	padding-top: 8px;
	line-height: 1;
}

.service-innerlink ul li span:hover::after,
.service-innerlink ul li span:hover p,
.service-innerlink ul li span small{opacity:0.6;}

.scrollamount{
	position: fixed;
	right: 0;
	top: 0;
	background: #000;
	color: #fff;
	font-size: 12px;
	z-index: 10000;
}

.scrollamount span{
	display: inline-block;
	width: 5em;
	text-align: right;
}


/* section common ---------------------------------------*/

.service-padding{
	content: '';
	position:relative;
	height: 200px;
	background: #EDE8DB;
}

.service-padding::after{
	display:block;
	content:'';
	background:#E3DDCF;
	background-size:100%;
	width:410px;
	height:100%;
	position:absolute;
	right: 0;
	top:0;
}

.servicesection{
	background: #EDE8DB;
	position:relative;
}

.servicesection.is-fixed{
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
}


.servicesection.is-end{
	position:absolute;
	left: 0;
	bottom: 0;
	width: 100%;
}

.servicesection-flex{
	display:flex;
}

.servicesection-body{
	width: calc(100% - 410px);
	height: 100vh;
	position:relative;
	padding-top: 90px;
}

.stage{
	position:relative;
	width: 100%;
	height: 100%;
}

.servicesection-side{
	width: 410px;
	background: #E3DDCF;
	display:flex;
	justify-content:space-between;
	align-items:center;
	flex-wrap:wrap;
	padding: 0 70px;
	position:relative;
	max-height: 100vh;
	z-index: 5;
}

.servicesection-side p{
	font-size: 13px;
	line-height: 1.5;
	margin-top: 15px;
}

.servicesection-side-image{}

.servicesection-side-body{}

.servicesection-side-body p{
	font-weight: 300;
	line-height: 1.8;
	font-size: 15px;
	padding-bottom: 70px;
}

.servicesection-side-control{
	font-size: 11px;
	padding-top: 20px;
	display: none;
}

.scrolldown{
	position:absolute;
	right: 260px;
	bottom: 125px;
	transform-origin: left top;
	transform: rotate(90deg);
	width: 122px;
	line-height:1.0;
	letter-spacing:0.05em;
	cursor: pointer;
	transition: all .25s ease;
	z-index: 11;
}

.scrolldown:hover{opacity: 0.7;}

.scrolldown span{
	font-size: 10px;
	display: block;
	position:relative;
}

.scrolldown span::after{
	content: '';
	position:absolute;
	background: url('../img/service/scroll.gif');
	background-size: 100%;
	right: 0;
	top: 50%;
	width: 10px;
	height:  10px;
	transform: translate(0%, -60%) rotate(-90deg);
}

.is-none{display: none !important;}
.is-transparent{opacity:0 !important}
.is-visible{opacity:1 !important}

.service01-wrapper,.service02-wrapper,.service03-wrapper,.service04-wrapper{position:relative;overflow: hidden;}

.service01-wrapper{height: 26000px;}
.service02-wrapper{height: 14000px;}
.service03-wrapper{height: 28000px;}
.service04-wrapper{height: 30000px;}


/* 01 ---------------------------------------*/

/* center */
.stage01-01,
.stage01-pm,
.stage01-icon,
.stage01-02,
.stage01-explain,
.fillcircle,
.stage01-content-body,
.stage01-07-title,
.stage01-09-title,
.stage01-08,
.stage01-circle03,
.stage01-clienttitle,
.stage01-10-title,
.stage01-arrow,
.stage01-11{
	position:absolute;
	left:50%;
	top:50%;
}


/* opacity */

.stage01-01,
.stage01-logo,
.stage01-02-title,
.stage01-explain,
.fillcircle,
.stage01-content-body,
.stage01-07-title,
.stage01-09-title,
.stage01-08,
.stage01-circle02,
.stage01-circle03,
.stage01-clienttitle,
.stage01-10-title,
.stage01-arrow,
.stage01-11{
	transition: all 1.25s ease;
	opacity: 0;
}

.stage01-01{
	width: 550px;
	height: 550px;
	margin: -275px 0 0 -275px;
	transform-origin: center center;
}

.stage01-01.is-small{transform: scale(0.9,0.9);margin: -245px 0 0 -275px;}
.stage01-01.is-large{transform: scale(1.7,1.7) translate(0px,0px);margin:-110px 0 0 245px;}
.stage01-01.is-large-rotate01{transform: scale(1.7,1.7) rotate(95deg) translate(0px,0px);margin:-110px 0 0 245px;}
.stage01-01.is-large-rotate02{transform: scale(1.7,1.7) rotate(195deg) translate(0px,0px);margin:-110px 0 0 245px;}
.stage01-01.is-large-rotate03{transform: scale(1.7,1.7) rotate(273deg) translate(0px,0px);margin:-110px 0 0 245px;}
.stage01-01.is-large-rotate04{transform: rotate(360deg)}
.stage01-01.is-left{transform:translate3d(-140px,0,0);}
.stage01-01.is-leftout{transform:translate3d(-540px,0,0);}
.stage01-01.is-rightout{transform:translate3d(750px,0,0);}
.stage01-01.is-right{transform:translate3d(155px,0,0);}
.stage01-01.is-xsmall{transform: scale(0.7,0.7);}
.stage01-01.is-xsmallleft{transform: scale(0.7,0.7);margin: -275px 0 0 -415px;}

.stage01-circle01{
	width: 100%;
	height: 100%;
}

.stage01-logo{
	position:absolute;
	left: 50%;
	width: 110px;
	top: 175px;
	margin-left: -60px;
}

.stage01-01.is-rightout .stage01-logo,
.stage01-01.is-right .stage01-logo,
.stage01-01.is-xsmall .stage01-logo,
.stage01-01.is-xsmallleft .stage01-logo{top:360px;}

.stage01-pm{
	transform:translate(-50%,-50%);
	width: 75px;
}

.stage01-icon{
	width: 60px;
	margin: 0px 0 0 0px;
	transition: all 1.25s ease;
}

.stage01-icon.icon01{margin:-235px 0 0 -130px;}
.stage01-icon.icon02{margin:-145px 0 0 -223px;}
.stage01-icon.icon03{margin:-23px 0 0 -256px;}
.stage01-icon.icon04{margin:100px 0 0 -218px;}
.stage01-icon.icon05{margin:180px 0 0 -115px;}
.stage01-icon.icon06{margin:195px 0 0 13px;}
.stage01-icon.icon07{margin:140px 0 0 128px;}
.stage01-icon.icon08{margin:28px 0 0 195px;}
.stage01-icon.icon09{margin:-100px 0 0 192px;}
.stage01-icon.icon10{margin:-205px 0 0 118px;}
.stage01-icon.icon11{margin:-258px 0 0 -0px;}

.stage01-01.is-large-rotate01 .stage01-icon{transform:rotate(-95deg);}
.stage01-01.is-large-rotate02 .stage01-icon{transform:rotate(-195deg);}
.stage01-01.is-large-rotate03 .stage01-icon{transform:rotate(-273deg);}
.stage01-01.is-large-rotate04 .stage01-icon{transform:rotate(-360deg);}

.stage01-02{
	width: 494px;
	height: 494px;
	margin: -247px 0 0 -247px;
}

.stage01-02-title{
	position:absolute;
	left:50%;
	top:-50px;
	transform:translate(-50%,0);
	white-space: nowrap;
	font-size: 20px;
	letter-spacing:0.2em;
}

.stage01-explain{
	width: 190px;
	padding-bottom: 1px;
	border-bottom: 1px solid #C9C1A6;
	line-height: 1.4;
	font-size: 14px;
}

.stage01-explain.explain01{transform:translate(-325px,-195px);}
.stage01-explain.explain02{transform:translate(-415px,-132px);}
.stage01-explain.explain03{transform:translate(-440px,0px);}
.stage01-explain.explain04{transform:translate(-405px,120px);}
.stage01-explain.explain05{transform:translate(-305px,205px);}
.stage01-explain.explain06{transform:translate(65px,235px);text-align: right;}
.stage01-explain.explain07{transform:translate(190px,150px);text-align: right;}
.stage01-explain.explain08{transform:translate(250px,50px);text-align: right;}
.stage01-explain.explain09{transform:translate(245px,-60px);text-align: right;}
.stage01-explain.explain10{transform:translate(178px,-168px);text-align: right;}
.stage01-explain.explain11{transform:translate(63px,-235px);text-align: right;}

.stage01-explain > p{
	position:relative;
	display: inline-block;
	padding: 8px 8px;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 300;
    transition: all 1.25s ease;
    transform: translate(0,-10px);
}

.stage01-explain > p::after{
    display:block;
    content:'';
    background:#E3DDCF;
    background-size:100%;
    width:0;
    height:100%;
    position:absolute;
    left: 0;
    top:0;
    transform:translate(0,0);
    transition: all 1.25s ease;
}

.stage01-explain.is-visible > p{transform: translate(0,0);}
.stage01-explain.is-visible > p::after{width:100%;}

.stage01-explain > p span{
	position:relative;
	z-index: 2;
	text-align: justify;
	display: inline-block;
	text-align: left;
	display: block;
}

.fillcircle{
	margin: -73px 0 0 -73px;
	width: 146px;
	height: 146px;
	background: rgba(0,0,0,0.1);
	border-radius:50%;
}

.stage01-fillcircle01{transform: translate(354px,-181px);}
.stage01-fillcircle02{transform: translate(192px,-33px);}
.stage01-fillcircle03{transform: translate(137px,179px);}
.stage01-fillcircle04{transform: translate(327px,-169px);}
.stage01-fillcircle05{transform: translate(175px,-11px);}
.stage01-fillcircle06{transform: translate(131px,204px);}
.stage01-fillcircle07{transform: translate(333px,-182px);}
.stage01-fillcircle08{transform: translate(176px,-31px);}
.stage01-fillcircle09{transform: translate(126px,182px);}
.stage01-fillcircle10{transform: translate(235px,-103px);}
.stage01-fillcircle11{transform: translate(139px,95px);}

.stage01-content-body{
	width: 420px;
	transform:translate(-200px,-46%);
	margin-left: -210px;
}

.stage01-content-body.is-visible{transform:translate(-200px,-50%);}

.stage01-content-title{
	font-size: 20px;
	line-height: 1.3;
}

.stage01-content-title:not(:first-child){
	margin-top: 50px;
}

.stage01-content-text{
	font-size: 14px;
	line-height: 1.7;
	font-weight: 300;
	margin-top: 15px;
}

.stage01-07-title,
.stage01-09-title{
	margin-left: 300px;
	transform:translate(-50%,-50%);
	font-size: 20px;
	line-height: 1.6;
	letter-spacing:0.2em;
	text-align:center;
}

.stage01-08{
	width: 550px;
	height: 550px;
	margin: -275px 0 0 -275px;
	transform-origin: center center;
}

.stage01-08.is-rightout{transform:translate3d(750px,0,0);}
.stage01-08.is-left{transform:translate3d(-140px,0,0);}
.stage01-08.is-leftonlycenter{transform:translate3d(-305px,0,0);}
.stage01-08.is-large{transform:scale(3.7,3.7) translate3d(0,0,0);}
.stage01-08.is-largeleft{transform:scale(3.7,3.7) translate3d(-37px,0,0);}

.stage01-circle02{
	position:absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.stage01-circle03{
	transform:translate(-50%,-50%);
	width: 160px;
}

.stage01-clienttitle{
	margin: -10px 0 0 -40px;
	width: 80px;
}

.stage01-clienttitle.is-rightout{transform:translate3d(750px,0,0);}
.stage01-clienttitle.is-left{transform:translate3d(-140px,0,0);}
.stage01-clienttitle.is-leftonlycenter{transform:translate3d(-305px,0,0);}
.stage01-clienttitle.is-topcenter{transform:translate3d(0,-60px,0);}
.stage01-clienttitle.is-topleft{transform:translate3d(-140px,-60px,0);}

.stage01-10-title{
	font-size: 20px;
	letter-spacing:0.2em;
	transform: translate(0,-180px);
	width: 550px;
	text-align:center;
	margin-left: -580px;
}

.stage01-arrow{
	width: 20px;
	height: 34px;
	margin: -20px 0 0 -190px;
}

.stage01-11{
	transform: translate(0,-50%);
	width: 270px;
	text-align:center;
	margin-left: 170px;
}

.stage01-11-text{
	font-size: 20px;
	letter-spacing:0.2em;
	margin: 30px 0;
}


/* 02 ---------------------------------------*/

/* center */
.centerposition,
.stage02-map,
.stage02-cover01,
.stage02-cover02,
.stage02-cover03,
.stage02-arrow01,
.stage02-arrow02,
.stage02-map-title,
.stage02-02,
.stage02-03,
.stage02-04,
.stage02-02-title01,
.stage02-02-title02,
.stage02-02-text01,
.stage02-02-text02,
.stage02-02-text03,
.stage02-02-text04,
.stage02-circle,
.stage02-03-title,
.stage02-04-title,
.stage02-logo{
	position:absolute;
	left:50%;
	top:50%;
}

/* opacity and animation */

.stage02-cover01,
.stage02-cover02,
.stage02-cover03,
.stage02-map-title,
.stage02-02,
.stage02-03,
.stage02-04,
.stage02-circle,
.stage02-03-title,
.stage02-04-title,
.stage02-logo{
	transition: all 1.25s ease;
	opacity: 0;
}

/* other animation setting */

.stage02-map{
	width: 584px;
	height: 567px;
	margin: -280px 0 0 -292px;
	transform-origin: center center;
	transition: all 1.25s ease;
	line-height: 1;
}

.stage02-map.is-left{transform:translate3d(-130px,0,0);}

.stage02-cover01,
.stage02-cover02,
.stage02-cover03{
	border-radius: 5px;
	background: rgba(195,195,175,0.2);
	border: 1px dashed #707070;
}

.stage02-cover01{
	width:0;
	height: 105px;
	transform: translate3d(-414px,-225px,0);
}

.stage02-cover02{
	width:0;
	height: 280px;
	transform: translate3d(-440px,-70px,0);
}

.stage02-cover03{
	width:0;
	height: 440px;
	transform: translate3d(-440px,-225px,0);
}

.stage02-cover01.is-visible{width:832px;}
.stage02-cover02.is-visible{width:857px;}
.stage02-cover03.is-visible{width:857px;}

.stage02-arrow01,
.stage02-arrow02{
	width: 583px;
	height: 13px;
	margin: -6px 0 0 -292px;
	transition: all 1.25s ease;
	line-height: 1;
}

.stage02-arrow01{transform: translate3d(5px,-75px,0);}
.stage02-arrow02{transform: translate3d(5px,195px,0);}

.stage02-arrow01.is-left{transform: translate3d(-130px,-95px,0);}
.stage02-arrow02.is-left{transform: translate3d(-130px,190px,0);}
.stage02-arrow01.is-leftmiddle{transform: translate3d(-130px,-75px,0);}
.stage02-arrow02.is-leftmiddle{transform: translate3d(-130px,195px,0);}

.stage02-map-title{
	width: 197px;
	height: 37px;
	line-height: 37px;
	transform: translate3d(220px,-270px,0);
	text-align:center;
}

.stage02-map-title.is-visible{transform: translate3d(220px,-290px,0);}

.stage02-map-title .topcorner{
	position:absolute;
	left: 0;
	top: 0;
	width: 100%;
}

.stage02-map-title .topcorner::before,
.stage02-map-title .topcorner::after,
.stage02-map-title .bottomcorner::before,
.stage02-map-title .bottomcorner::after,
.stage02-map-title .topcorner::before,
.stage02-map-title .topcorner::after,
.stage02-map-title .bottomcorner::before,
.stage02-map-title .bottomcorner::after{
	display:block;
	content:'';
	width:5px;
	height:5px;
	position:absolute;
}

.stage02-map-title .topcorner::before{
	left: 0;
	top: 0;
	border-top: 1px solid #707070;
	border-left: 1px solid #707070;
}

.stage02-map-title .topcorner::after{
	right: 0;
	top: 0;
	border-top: 1px solid #707070;
	border-right: 1px solid #707070;
}

.stage02-map-title .bottomcorner::before{
	left: 0;
	bottom: 0;
	border-bottom: 1px solid #707070;
	border-left: 1px solid #707070;
}

.stage02-map-title .bottomcorner::after{
	right: 0;
	bottom: 0;
	border-bottom: 1px solid #707070;
	border-right: 1px solid #707070;
}

.stage02-02,
.stage02-03,
.stage02-04{transform:translate(0,20px);}

.stage02-02.is-visible,
.stage02-03.is-visible,
.stage02-04.is-visible{transform:translate(0,0);}

.stage02-02-title01,
.stage02-02-title02,
.stage02-02-text01,
.stage02-02-text02,
.stage02-02-text03,
.stage02-02-text04{
	text-align:center;
	line-height:1.0;
}

.stage02-02-title01{
	transform:translate3d(188px,-180px,0);
	width: 200px;
}

.stage02-02-title02{
	transform:translate3d(188px,50px,0);
	width: 200px;
}

.stage02-02-text01,
.stage02-02-text02,
.stage02-02-text03,
.stage02-02-text04{
	width:140px;
	font-size: 14px;
}


.stage02-02-text01{transform:translate3d(-415px,-60px,0);}
.stage02-02-text02{transform:translate3d(-270px,-60px,0);}
.stage02-02-text03{transform:translate3d(-125px,-60px,0);}
.stage02-02-text04{transform:translate3d(15px,-60px,0);}

.stage02-circle{
	width: 70px;
	height: 70px;
	color: #fff;
	line-height: 70px;
	text-align:center;
	font-size: 16px;
	font-weight:400;
	border-radius:50%;
	background: #000;
	font-family: 'Noto Sans JP', sans-serif;
}

.stage02-03-circle01{transform:translate3d(370px,-240px,0);}
.stage02-03-circle02{transform:translate3d(370px,-90px,0);}

.stage02-03-title,
.stage02-04-title{
	width: 220px;
	text-align:center;
	font-size: 20px;
	transform:translate3d(190px,235px,0);
	letter-spacing:0.2em;
}

.stage02-logo{
	width: 120px;
	transform:translate3d(230px,-30px,0);
}

.stage02-logo.is-top{transform:translate3d(230px,-150px,0);}

.stage02-04-circle01{transform:translate3d(260px,-90px,0);}
.stage02-04-circle02{transform:translate3d(260px,-10px,0);}
.stage02-04-circle03{transform:translate3d(260px,70px,0);}
.stage02-04-title{}



/* 03 ---------------------------------------*/

.centerpoint,
.stage03-line,
.stage03-step,
.stage03-step-head,
.stage03-step-body{
	position:absolute;
	left: 50%;
	top: 50%;
}

.stage03-step,
.stage03-step-head,
.stage03-step-body{
	transition: all 1.25s ease;
	opacity: 0;
}

.stage03-line{
	content: '';
	height: 400px;
	width: 1px;
	background: #000;
	transition: all 1.25s ease;
	transform: translate3d(-152px,-160px,0);
}

.stage03-line.is-left{
	transform: translate3d(-353px,-160px,0);
	height: 100vh;
}

.stage03-line.is-leftmiddle{
	transform: translate3d(-353px,-49vh,0);
	height: 100vh;
}

.stage03-line.is-leftbottom{
	transform: translate3d(-353px,-100vh,0);
	height: calc(100vh - 130px);
}

.stage03-step{
	width:400px;
	height: 94px;
	background: #EDE8DB;
	z-index: 5;
}

.stage03-step img{width:94px;}
.stage03-step p{
	line-height: 1;
	font-size: 28px;
	letter-spacing:0.2em;
	position:absolute;
	left: 120px;
	top: 50%;
	transform: translate(0,-50%);
}

.stage03-step01{transform: translate3d(-200px,-250px,0);}
.stage03-step02{transform: translate3d(-200px,-108px,0);}
.stage03-step03{transform: translate3d(-200px,34px,0);}
.stage03-step04{transform: translate3d(-200px,176px,0);}

.stage03-step01.is-left{transform: translate3d(-400px,-250px,0);}
.stage03-step01.is-lefttopout{transform: translate3d(-400px,-60vh,0);}
.stage03-step02.is-leftbottomout{transform: translate3d(-400px,50vh,0);}
.stage03-step02.is-left{transform: translate3d(-400px,-250px,0);}
.stage03-step02.is-lefttopout{transform: translate3d(-400px,-60vh,0);}
.stage03-step03.is-leftbottomout{transform: translate3d(-400px,60vh,0);}
.stage03-step03.is-left{transform: translate3d(-400px,-250px,0);}
.stage03-step03.is-lefttopout{transform: translate3d(-400px,-60vh,0);}
.stage03-step04.is-leftbottomout{transform: translate3d(-400px,50vh,0);}
.stage03-step04.is-left{transform: translate3d(-400px,-155px,0);}


.stage03-step-head{z-index: 10;}

.stage03-step01-head{
	transform: translate3d(-30px,-205px,0);
	width: 410px;
}

.stage03-step02-head{
	transform: translate3d(30px,-205px,0);
	width: 350px;
}

.stage03-step03-head{
	transform: translate3d(-30px,-205px,0);
	width: 350px;
}

.stage03-step04-head{
	transform: translate3d(-50px,-110px,0);
	width: 360px;
}

.stage03-step-head img{
	position:absolute;
	left: 0;
	top: 50%;
	transform: translate(-10px,-50%);
	width: 13px;
	transition: all 1.25s ease;
}

.stage03-step-head.is-visible img{transform: translate(0,-50%);}

.stage03-step-head p{
	position:absolute;
	left: 40px;
	top: 50%;
	transform: translate(-10px,-50%);
	width: calc(100% - 40px);
	background: #343434;
	line-height: 1.5;
	padding: 10px 20px;
	color: #fff;
	font-size: 15px;
	letter-spacing:0.2em;
	transition: all 1.25s ease;
}

.stage03-step-head.is-visible p{transform: translate(0,-50%);}

.stage03-step-body{
	z-index: 10;
	transform: translate3d(-280px,-90px,0);
	width: 670px;
}

.stage03-step-body.is-visible{transform: translate3d(-280px,-100px,0);}

.stage03-step04-body{transform: translate3d(-280px,10px,0);}
.stage03-step04-body.is-visible{transform: translate3d(-280px,0px,0);}

.stage03-step-body-flow{}

.stage03-step-body dl{
	display:flex;
	justify-content:space-between;
	align-items:flex-end;
	flex-wrap:wrap;
	line-height: 1.6;
	position:relative;
	margin-bottom: 0px;
}

.stage03-step-body dt{
	position:relative;
	font-size: 18px;
	padding-bottom: 5px;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:400;
	margin-top: 50px;
}

.stage03-step-body dt::before{
    display:block;
    content:'';
    background:#343434;
    width:0;
    height:2px;
    position:absolute;
    left: 0;
    bottom: 0;
    transition: all 1.25s ease;
}

.stage03-step-body.is-visible dt::before{width:100%;}

.stage03-step-body dt::after{
    display:block;
    content:'';
    background:url('../img/service/stage/arrow_d.png') no-repeat left top;
    background-size:100%;
    width:10px;
    height:10px;
    position:absolute;
    left: 3px;
    bottom: -30px;
    transition: all 1.25s ease;
}

.stage03-step-body-flow:first-child dt{margin-top: 0;}
.stage03-step-body-flow:last-child dt::after{display: none;}

.stage03-step-body dd{
	font-size: 14px;
	padding-bottom: 8px;
	letter-spacing:0em;
	position:relative;
	font-family: YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif;
	font-weight: 300;
}

.stage03-step-body dd::after{
    display:block;
    content:'';
    background:#343434;
    width:0;
    height:1px;
    position:absolute;
    left: 0;
    bottom: 0;
    transition: all 1.25s ease;
}

.stage03-step-body.is-visible dd::after{width:100%;}

.stage03-step01-body dt{width:170px;}
.stage03-step01-body dd{width:calc(100% - 175px);}
.stage03-step02-body dt{width:190px;}
.stage03-step02-body dd{width:calc(100% - 195px);}
.stage03-step03-body dt{width:190px;}
.stage03-step03-body dd{width:calc(100% - 195px);}
.stage03-step04-body dt{width:230px;}
.stage03-step04-body dd{width:calc(100% - 235px);}


/* 04 ---------------------------------------*/

.centerpoint,
.stage04-baseline,
.stage04-graph01,
.stage04-graph02,
.stage04-graph03,
.stage04-explain,
.stage04-bottommessage,
.stage04-dotline{
	position:absolute;
	left: 50%;
	top: 50%;
}

.stage04-graph01,
.stage04-graph02,
.stage04-graph03,
.stage04-graph01-bar01::after,
.stage04-graph01-bar02::after,
.stage04-graph02-bar01::after,
.stage04-graph02-bar02::after,
.stage04-graph03-bar01::after,
.stage04-explain,
.stage04-bottommessage{
	transition: all 1.25s ease;
	opacity: 0;
}

.stage04-baseline{
	content: '';
	transform: translate3d(-50%,203px,0);
	width: 100vw;
	height: 1px;
	background: #707070;
	z-index: 5;
}

.stage04-dotline{
	content: '';
	transform: rotate(28deg);
	margin: -216px 0 0 -200px;
	width: 148px;
	height: 1px;
	border-top: 1px dashed #707070;
	transform-origin: left top;
	z-index: 5;
	transition: all 1.25s ease;
}

.stage04-dotline.is-hide{width:0;}

.stage04-graph01{
	width: 140px;
	height: 420px;
	transform: translate3d(-340px,-216px,0);
}

.stage04-graph01.is-center{transform: translate3d(-265px,-216px,0);}

.stage04-graph02{
	width: 140px;
	height: 350px;
	transform: translate3d(-70px,-146px,0);
}

.stage04-graph02.is-left{transform: translate3d(-265px,-146px,0);}

.stage04-graph03{
	width: 140px;
	height: 350px;
	transform: translate3d(200px,-146px,0);
}

.stage04-graph03.is-left{transform: translate3d(-265px,-146px,0);}

.stage04-graph01-title{
	position:absolute;
	left: 0;
	top: -60px;
	width: 100%;
	text-align:center;
	font-size: 24px;
	letter-spacing:0.2em;
	line-height: 1;
	transition: all 1.25s ease;
	transform: translate3d(0,10px,0);
}

.stage04-graph01.is-visible .stage04-graph01-title{transform: translate3d(0,0px,0);}

.stage04-graph02-title,
.stage04-graph03-title{
	position:absolute;
	left: 0;
	top: -80px;
	width: 100%;
	text-align:center;
	line-height: 1;
	transition: all 1.25s ease;
	transform: translate3d(0,10px,0);
}

.stage04-graph02.is-visible .stage04-graph02-title,
.stage04-graph03.is-visible .stage04-graph03-title{transform: translate3d(0,0px,0);}

.stage04-graph02-title small,
.stage04-graph03-title small{
	display: block;
	padding-top: 10px;
	font-family: YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif;
	font-size: 14px;
	line-height: 1.5;
}


.stage04-graph01-bar01{
	position:absolute;
	width: 100%;
	height: 190px;
	left: 0;
	top: 0;
}

.stage04-graph01-bar01::after{
	display:block;
	content:'';
	background:#c7c2b8;
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	bottom: 0;
}

.stage04-graph01-bar01::after{height:0;}
.stage04-graph01.is-visible .stage04-graph01-bar01::after{height:100%;opacity: 0.5;}

.stage04-graph01-bar02{
	position:absolute;
	width: 100%;
	left: 0;
	top: 190px;
	height: 230px;
}

.stage04-graph01-bar02::after{
	display:block;
	content:'';
	background:#a19d94;
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	bottom:0;
}

.stage04-graph01-bar02::after{height:0;}
.stage04-graph01.is-visible .stage04-graph01-bar02::after{height:100%;opacity:1;}

.stage04-graph-text{
	font-family: 'Noto Sans JP', sans-serif;
	width: 100%;
	line-height: 1;
	text-align:center;
	z-index: 10;
}

.stage04-graph02-bar01{
	position:absolute;
	width: 100%;
	height: 120px;
	left: 0;
	top: 0;
}

.stage04-graph02-bar01::after{
	display:block;
	content:'';
	background:url('../img/service/stage/bg_dot.png') repeat;
	background-size: 23px;
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	bottom:0;
}

.stage04-graph02-bar01::after{height:0;}
.stage04-graph02.is-visible .stage04-graph02-bar01::after{height:100%;opacity: 0.5;}

.stage04-graph02-bar02{
	position:absolute;
	width: 100%;
	left: 0;
	top: 120px;
	height: 230px;
}

.stage04-graph02-bar02::after{
	display:block;
	content:'';
	background:#c7c2b8;
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	bottom:0;
}

.stage04-graph02-bar02::after{height:0;}
.stage04-graph02.is-visible .stage04-graph02-bar02::after{height:100%;opacity: 0.5;}


.stage04-graph03-bar01{
	position:absolute;
	width: 100%;
	height: 350px;
	left: 0;
	top: 0;
}

.stage04-graph03-bar01::after{
	display:block;
	content:'';
	background:url('../img/service/stage/bg_dot.png') repeat;
	background-size: 23px;
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	bottom: 0;
}

.stage04-graph03-bar01::after{height:0;}
.stage04-graph03.is-visible .stage04-graph03-bar01::after{height:100%;opacity: 0.5;}


.stage04-graph-text{
	font-family: 'Noto Sans JP', sans-serif;
	width: 100%;
	line-height: 1.4;
	text-align:center;
	z-index: 10;
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,50%);
	transition: all 1.25s ease;
}

.stage04-graph01.is-visible .stage04-graph-text,
.stage04-graph02.is-visible .stage04-graph-text,
.stage04-graph03.is-visible .stage04-graph-text{transform:translate(-50%,-50%);}

.stage04-explain{
	font-family: YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif;
	font-weight:300;
	font-size: 13px;
	padding-left: 110px;
	z-index: 5;
}

.stage04-explain01{transform: translate(-100px,-155px);}
.stage04-explain02{transform: translate(-100px,40px);}
.stage04-explain03{transform: translate(-100px,80px);}
.stage04-explain04{transform: translate(-100px,-120px);}
.stage04-explain05{transform: translate(-100px,-50px);}

.is-visible.stage04-explain01{transform: translate(-100px,-165px);}
.is-visible.stage04-explain02{transform: translate(-100px,30px);}
.is-visible.stage04-explain03{transform: translate(-100px,70px);height:42px;}
.is-visible.stage04-explain03.is-full{transform: translate(-100px,20px);height:145px;}
.is-visible.stage04-explain04{transform: translate(-100px,-130px);}
.is-visible.stage04-explain05{transform: translate(-100px,-60px);}

.stage04-explain03.is-full{transform: translate(-100px,30px);height:145px;}


.explain-line{
	content: '';
	position:absolute;
	left: 0;
	top: 0;
	width: 90px;
	height: 100%;
	display: block;
}


.explain-line::before,
.explain-line::after{
	display:block;
	content:'';
	background:#707070;
	background-size:100%;
	position:absolute;
	transition: all 1.25s ease;
}

.explain-line::before{
	top: 50%;
	left: 0;
	width: 0;
	height: 1px;
}

.stage04-explain.is-visible .explain-line::before{width:100%;}

.explain-line::after{
	right: 0;
	top: 50%;
	transform: translate(0,-50%);
	width: 1px;
	height: 0;
}

.stage04-explain.is-visible .explain-line::after{height:100%;}

.stage04-explain ul li{
	position:relative;
	font-family: YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif;
	font-weight:300;
	font-size: 14px;
	padding-left: 20px;
	letter-spacing:0;
}

.stage04-explain ul li:not(:first-child){margin-top: 20px;}

.stage04-explain ul li::after{
	display:block;
	content:'';
	background:#000;
	background-size:100%;
	width:8px;
	height:8px;
	position:absolute;
	left: 0;
	top:5px;
	background: rgba(159,159,159,0.5);
}

.stage04-explain ul li.is-hide{display: none;}

.stage04-bottommessage{
	transform: translate3d(-430px,240px,0);
	width: 880px;
	line-height: 1.6;
	padding: 15px 0 15px 80px;
	font-size: 18px;
	letter-spacing:0.15em;
}

.stage04-bottommessage span{
	position:absolute;
	left: 0;
	top: 0;
	width: 60px;
	height: 60px;
	line-height: 60px;
	background: #000;
	text-align:center;
	font-size: 30px;
	color: #fff;
	border-radius:50%;
	letter-spacing:0;
}

.stage04-bottommessage-04{text-align:center;}



/* large pc */
@media screen and (min-width: 1921px){


}

/* middle pc */
@media screen and (min-width: 1401px) and (max-width: 1920px){


}

/* small pc */
@media screen and (min-width: 981px) and (max-width: 1366px){

/* 	.servicesection-flex{
		overflow: hidden;
		position:relative;
	}

	.servicesection-body{width:960px;}

	.servicesection-side{
		position:absolute;
		right: 0;
		top: 0;
		width: 410px;
		height: 100%;
		z-index: 6;
	} */


}

/* pc */
@media screen and (min-width: 1367px){

	.servicepc{display: block !important}
	.servicesp{display: none !important}


}

/* pc */
@media screen and (min-width: 981px){



}


/* small pc and sp animation */
@media screen and (max-width: 1366px){

	.servicepc{display: none !important}
	.servicesp{display: block !important}

	.service01-wrapper,
	.service02-wrapper,
	.service03-wrapper,
	.service04-wrapper{overflow: hidden;}

	.service01-wrapper{height: 39000px;}

	.scrolldown-sp{
		position:absolute;
		content: '';
		left: 50%;
		top: 70px;
		transform: translate(-50%,0);
		width: 10px;
		height: 10px;
		background: url('../img/service/scroll.gif') no-repeat center top;
		background-size: 100%;
	}

	/* 01 ---------------------------------------*/


	/* center */
	.sp-stage01-01,
	.sp-stage01-pm,
	.sp-stage01-icon,
	.sp-stage01-02-title,
	.sp-stage01-02-01,
	.sp-stage01-02-02,
	.sp-stage01-explain,
	.sp-fillcircle,
	.sp-stage01-content-body,
	.sp-stage01-07-title,
	.sp-stage01-09-title,
	.sp-stage01-08,
	.sp-stage01-circle03,
	.sp-stage01-clienttitle,
	.sp-stage01-10-title,
	.sp-stage01-arrow,
	.sp-stage01-11{
		position:absolute;
		left:50%;
		top:50%;
	}


	/* opacity */

	.sp-stage01-01,
	.sp-stage01-logo,
	.sp-stage01-02-title,
	.sp-stage01-explain,
	.sp-fillcircle,
	.sp-stage01-content-body,
	.sp-stage01-07-title,
	.sp-stage01-09-title,
	.sp-stage01-08,
	.sp-stage01-circle02,
	.sp-stage01-circle03,
	.sp-stage01-clienttitle,
	.sp-stage01-10-title,
	.sp-stage01-arrow,
	.sp-stage01-11{
		transition: all 1.25s ease;
		opacity: 0;
	}

	.sp-stage01-01{
		width: 320px;
		height: 320px;
		margin: -160px 0 0 -160px;
		transform-origin: center center;
	}

	.sp-stage01-01.is-largeright{transform: scale(1.3,1.3) rotate(18deg) translate(0px,0px);margin:-110px 0 0 5px;}
	.sp-stage01-01.is-large-rotate01{transform: scale(1.3,1.3) rotate(198deg) translate(0px,0px);margin:-110px 0 0 5px;}
	.sp-stage01-01.is-large-rotate02{transform: scale(2.3,2.3) rotate(240deg) translate(0px,0px);margin:-620px 0 0 -65px;}
	.sp-stage01-01.is-large-rotate03{transform: scale(2.3,2.3) rotate(308deg) translate(0px,0px);margin:-620px 0 0 -65px;}
	.sp-stage01-01.is-large-rotate04{transform: scale(2.3,2.3) rotate(375deg) translate(0px,0px);margin:-620px 0 0 -65px;}
	.sp-stage01-01.is-large-rotate05{transform: scale(2.3,2.3) rotate(422deg) translate(0px,0px);margin:-620px 0 0 -65px;}
	.sp-stage01-01.is-large-rotate06{transform: scale(2.3,2.3) rotate(470deg) translate(0px,0px);margin:-620px 0 0 -65px;}
	.sp-stage01-01.is-large-rotate07{transform: scale(2.3,2.3) rotate(534deg) translate(0px,0px);margin:-620px 0 0 -65px;}
	.sp-stage01-01.is-left{transform:translate3d(-50vw,0,0);}
	.sp-stage01-01.is-leftbottom{transform:translate3d(-50vw,90px,0);}
	.sp-stage01-01.is-bottom{transform:translate3d(0px,90px,0);}
	.sp-stage01-01.is-small{transform: scale(0.75,0.75);}
	.sp-stage01-01.is-smalldown{transform: scale(0.75,0.75) translate(0px,62px);}

	.sp-stage01-circle01{
		width: 100%;
		height: 100%;
	}

	.sp-stage01-logo{
		position:absolute;
		left: 50%;
		width: 64px;
		top: 100px;
		margin-left: -32px;
	}

	.sp-stage01-01.is-small .sp-stage01-logo{top:210px;}
	.sp-stage01-01.is-smalldown .sp-stage01-logo{top:210px;}

	.sp-stage01-pm{
		transform:translate(-50%,-50%);
		width: 45px;
		transition: all 1.25s ease;
	}

	.sp-stage01-icon{
		width: 38px;
		margin: 0px 0 0 0px;
		transition: all 1.25s ease;
	}

	.sp-stage01-icon.icon01{margin:-139px 0 0 -76px;}
	.sp-stage01-icon.icon02{margin:-87px 0 0 -132px;}
	.sp-stage01-icon.icon03{margin:-15px 0 0 -151px;}
	.sp-stage01-icon.icon04{margin:56px 0 0 -128px;}
	.sp-stage01-icon.icon05{margin:104px 0 0 -67px;}
	.sp-stage01-icon.icon06{margin:113px 0 0 6px;}
	.sp-stage01-icon.icon07{margin:80px 0 0 74px;}
	.sp-stage01-icon.icon08{margin:15px 0 0 113px;}
	.sp-stage01-icon.icon09{margin:-60px 0 0 111px;}
	.sp-stage01-icon.icon10{margin:-121px 0 0 68px;}
	.sp-stage01-icon.icon11{margin:-151px 0 0 -1px;}

	.sp-stage01-01.is-largeright .sp-stage01-icon{transform:rotate(-18deg);}
	.sp-stage01-01.is-largeright .sp-stage01-pm{transform:translate(-50%,-50%) rotate(-18deg);}

	.sp-stage01-01.is-large-rotate01 .sp-stage01-icon{transform:rotate(-198deg);}
	.sp-stage01-01.is-large-rotate01 .sp-stage01-pm{transform:translate(-50%,-50%) rotate(-198deg);}

	.sp-stage01-01.is-large-rotate02 .sp-stage01-icon{transform:rotate(-240deg);}
	.sp-stage01-01.is-large-rotate02 .sp-stage01-pm{transform:translate(-50%,-50%) rotate(-240deg);}

	.sp-stage01-01.is-large-rotate03 .sp-stage01-icon{transform:rotate(-308deg);}
	.sp-stage01-01.is-large-rotate03 .sp-stage01-pm{transform:translate(-50%,-50%) rotate(-308deg);}

	.sp-stage01-01.is-large-rotate04 .sp-stage01-icon{transform:rotate(-375deg);}
	.sp-stage01-01.is-large-rotate04 .sp-stage01-pm{transform:translate(-50%,-50%) rotate(-375deg);}

	.sp-stage01-01.is-large-rotate05 .sp-stage01-icon{transform:rotate(-422deg);}
	.sp-stage01-01.is-large-rotate05 .sp-stage01-pm{transform:translate(-50%,-50%) rotate(-422deg);}

	.sp-stage01-01.is-large-rotate06 .sp-stage01-icon{transform:rotate(-470deg);}
	.sp-stage01-01.is-large-rotate06 .sp-stage01-pm{transform:translate(-50%,-50%) rotate(-470deg);}

	.sp-stage01-01.is-large-rotate07 .sp-stage01-icon{transform:rotate(-534deg);}
	.sp-stage01-01.is-large-rotate07 .sp-stage01-pm{transform:translate(-50%,-50%) rotate(-534deg);}


	.sp-stage01-02-01{
		width: 300px;
		height: 450px;
		transform: translate3d(-180px,-180px,0);
	}

	.sp-stage01-02-02{
		width: 300px;
		height: 450px;
		transform: translate3d(-180px,-180px,0);
	}

	.sp-stage01-02-title{
		text-align:center;
		transform:translate(-50%,-265px);
		white-space: nowrap;
		font-size: 20px;
		letter-spacing:0.2em;
	}

	.sp-stage01-explain{
		width: 170px;
		padding-bottom: 3px;
		border-bottom: 1px solid #C9C1A6;
		line-height: 1.2;
		font-size: 13px;
	}

	.sp-stage01-explain.explain01{transform:translate(-30px,-220px);}
	.sp-stage01-explain.explain02{transform:translate(-120px,-155px);}
	.sp-stage01-explain.explain03{transform:translate(-130px,-53px);width:130px;}
	.sp-stage01-explain.explain04{transform:translate(-130px,30px);width:123px;}
	.sp-stage01-explain.explain05{transform:translate(-110px,105px);width:155px;}
	.sp-stage01-explain.explain06{transform:translate(-40px,172px);width:185px;}

	.sp-stage01-explain.explain07{transform:translate(-95px,-200px);width:180px;}
	.sp-stage01-explain.explain08{transform:translate(-142px,-125px);width:150px;}
	.sp-stage01-explain.explain09{transform:translate(-133px,-48px);width:115px;}
	.sp-stage01-explain.explain10{transform:translate(-136px,50px);width:145px;}
	.sp-stage01-explain.explain11{transform:translate(-82px,145px);}

	.sp-stage01-explain > p{
		position:relative;
		display: inline-block;
		padding: 7px 8px;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 300;
	    transition: all 1.25s ease;
	    transform: translate(0,0);
	}

	.sp-stage01-explain > p::after{
	    display:block;
	    content:'';
	    background:#E3DDCF;
	    background-size:100%;
	    width:0;
	    height:100%;
	    position:absolute;
	    left: 0;
	    top:0;
	    transform:translate(0,0);
	    transition: all 1.25s ease;
	}

	.sp-stage01-explain.is-visible > p{transform: translate(0,0);}
	.sp-stage01-explain.is-visible > p::after{width:100%;}

	.sp-stage01-explain > p span{
		position:relative;
		z-index: 2;
		text-align: justify;
		display: inline-block;
		text-align: left;
		display: block;
	}

	.sp-fillcircle{
		margin: -57px 0 0 -57px;
		width: 114px;
		height: 114px;
		background: rgba(0,0,0,0.1);
		border-radius:50%;
	}

	.sp-stage01-fillcircle01{transform: translate(-76px,-210px);}
	.sp-stage01-fillcircle02{transform: translate(89px,-158px);}
	.sp-stage01-fillcircle03{transform: translate(-83px,-215px);}
	.sp-stage01-fillcircle04{transform: translate(79px,-157px);}
	.sp-stage01-fillcircle05{transform: translate(-89px,-216px);}
	.sp-stage01-fillcircle06{transform: translate(72px,-153px);}
	.sp-stage01-fillcircle07{transform: translate(-5px,-166px);}
	.sp-stage01-fillcircle08{transform: translate(-82px,-204px);}
	.sp-stage01-fillcircle09{transform: translate(81px,-149px);}
	.sp-stage01-fillcircle10{transform: translate(-78px,-205px);}
	.sp-stage01-fillcircle11{transform: translate(87px,-155px);}

	.sp-stage01-content-body{
		width: 320px;
		transform:translate(-50%,-30px);
	}

	.sp-stage01-content-body.is-visible{transform:translate(-50%,-40px);}

	.sp-stage01-05-01 .sp-stage01-content-body{transform:translate(-50%,60px);}
	.sp-stage01-05-01 .sp-stage01-content-body.is-visible{transform:translate(-50%,50px);}

	.sp-stage01-content-title{
		font-size: 16px;
		line-height: 1.3;
	}

	.sp-stage01-content-title:not(:first-child){margin-top: 30px;}

	.sp-stage01-content-text{
		font-size: 13px;
		line-height: 1.7;
		font-weight: 300;
		margin-top: 15px;
	}

	.sp-stage01-07-title,
	.sp-stage01-09-title,
	.sp-stage01-10-title{
		width: 320px;
		transform:translate(-50%,-255px);
		font-size: 20px;
		line-height: 1.6;
		letter-spacing:0.2em;
		text-align:center;
	}

	.sp-stage01-08{
		width: 320px;
		height: 320px;
		margin: -160px 0 0 -160px;
		transform-origin: center center;
	}

	.sp-stage01-08.is-rightout{transform:translate3d(750px,0,0);}
	.sp-stage01-08.is-top{transform:translate3d(0,-165px,0);}
	.sp-stage01-08.is-large{transform:scale(3.7,3.7) translate3d(0,0,0);}
	.sp-stage01-08.is-largedown{transform:scale(3.7,3.7) translate3d(0,13px,0);}

	.sp-stage01-circle02{
		position:absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}

	.sp-stage01-circle03{
		width: 360px;
		margin: -180px 0 0 -180px;
		transform-origin: center center;
		transform:scale(0.27,0.27);
	}

	.sp-stage01-circle03.is-rightout{transform:scale(0.27,0.27) translate3d(2800px,0,0);}
	.sp-stage01-circle03.is-top{transform:scale(0.27,0.27) translate3d(0,-600px,0);}
	.sp-stage01-circle03.is-large{transform:translate3d(0,0,0);}
	.sp-stage01-circle03.is-largedown{transform:translate3d(0,47px,0);}

	.sp-stage01-clienttitle{
		margin: -5px 0 0 -25px;
		width: 50px;
		height: auto;
	}

	.sp-stage01-clienttitle.is-rightout{transform:translate3d(750px,0,0);}
	.sp-stage01-clienttitle.is-top{transform:translate3d(0,-165px,0);}
	.sp-stage01-clienttitle.is-topcenter{transform:translate3d(0,-45px,0);}
	.sp-stage01-clienttitle.is-topcenterdown{transform:translate3d(0,0px,0);}

	.sp-stage01-arrow{
		width: 20px;
		margin: -100px 0 0 -10px;
	}

	.sp-stage01-11{
		transform: translate(-50%,-260px);
		width: 320px;
		text-align:center;
	}

	.sp-stage01-11-text{
		font-size: 16px;
		line-height: 1.8;
		letter-spacing:0.2em;
	}


	/* 02 ---------------------------------------*/

	/* center */
	.centerposition,
	.stage02-map-sp02,
	.stage02-map-sp03{
		position:absolute;
		left:50%;
		top:50%;
		transition: all 1.25s ease;
	}

	/* opacity and animation */

	.stage02-cover01{
		transition: all 1.25s ease;
		opacity: 0;
	}

	/* other animation setting */

	.stage02-map{
		width: 257px;
		height: 213px;
		margin: -240px 0 0 -130px;
		line-height: 1
	}

	.stage02-map.is-left{transform:translate3d(-38px,15px,0);}
	.stage02-map.is-sp-center{transform:translate3d(0px,0px,0);}

	.stage02-cover01,
	.stage02-cover02,
	.stage02-cover03{
		border-radius: 5px;
		background: rgba(195,195,175,0.2);
		border: 1px dashed #707070;
	}

	.stage02-cover01{
		width:0;
		height: 150px;
		transform: translate3d(-163px,-168px,0);
	}

	.stage02-cover02{
		width:0;
		height: 160px;
		transform: translate3d(-175px,22px,0);
	}

	.stage02-cover03{
		width:0;
		height: 350px;
		transform: translate3d(-175px,-169px,0);
	}

	.stage02-cover01.is-visible{width:331px;}
	.stage02-cover02.is-visible{width:343px;}
	.stage02-cover03.is-visible{width:343px;}

	.stage02-arrow01,
	.stage02-arrow02{
		width: 220px;
		height: 13px;
		margin: -6px 0 0 -115px;
		line-height: 1;
	}

	.stage02-arrow01{transform: translate3d(5px,-5px,0);}
	.stage02-arrow02{transform: translate3d(5px,160px,0);}

	.stage02-arrow01.is-left{transform: translate3d(-35px,2px,0);}
	.stage02-arrow02.is-left{transform: translate3d(-35px,160px,0);}
	.stage02-arrow01.is-leftmiddle{transform: translate3d(-35px,-5px,0);}
	.stage02-arrow02.is-leftmiddle{transform: translate3d(-35px,160px,0);}

	.stage02-arrow01.is-sp-center{transform: translate3d(5px,-5px,0);}
	.stage02-arrow02.is-sp-center{transform: translate3d(5px,160px,0);}

	.stage02-arrow01.is-sp-left{transform: translate3d(-35px,2px,0);}

	.stage02-map-title{
		width: 320px;
		transform: translate3d(-160px,-275px,0);
	}

	.stage02-map-title.is-visible{transform: translate3d(-160px,-285px,0);}

	.stage02-02,
	.stage02-03,
	.stage02-04{transform:translate(0,20px);}

	.stage02-02.is-visible,
	.stage02-03.is-visible,
	.stage02-04.is-visible{transform:translate(0,0);}

	.stage02-02-title01,
	.stage02-02-title02,
	.stage02-02-text01,
	.stage02-02-text02,
	.stage02-02-text03,
	.stage02-02-text04{
		text-align:center;
		line-height:1.0;
	}

	.stage02-02-title01{
		transform:translate3d(92px,-120px,0);
		width: 68px;
		font-size: 14px;
		line-height: 1.4;
		transition: all 1.25s ease;
	}

	.stage02-02-title01.is-down{transform:translate3d(92px,-90px,0);}

	.stage02-02-title02{
		transform:translate3d(92px,70px,0);
		width: 70px;
		font-size: 14px;
		line-height: 1.4;
		transition: all 1.25s ease;
	}
	.stage02-02-title02.is-down{transform:translate3d(92px,110px,0);}

	.stage02-02-text01,
	.stage02-02-text02,
	.stage02-02-text03,
	.stage02-02-text04{
		width:140px;
		font-size: 14px;
		display: none
	}


	.stage02-02-text01{transform:translate3d(-15px,-55px,0);}
	.stage02-02-text02{transform:translate3d(-70px,-55px,0);}
	.stage02-02-text03{transform:translate3d(-25px,-55px,0);}
	.stage02-02-text04{transform:translate3d(15px,-55px,0);}

	.stage02-circle{
		width: 50px;
		height: 50px;
		line-height: 50px;
		font-size: 14px;
	}

	.stage02-03-circle01{transform:translate3d(103px,-150px,0);}
	.stage02-03-circle02{transform:translate3d(103px, 50px,0);}

	.stage02-03-title,
	.stage02-04-title{
		width: 320px;
		font-size: 16px;
		transform:translate3d(-150px,260px,0);
		letter-spacing:0.1em;
	}

	.stage02-logo{
		width: 90px;
		transform:translate3d(85px,-0px,0) rotate(90deg);
	}

	.stage02-logo.is-top{transform:translate3d(85px,-100px,0) rotate(90deg);}

	.stage02-04-circle01{transform:translate3d(105px,-20px,0);}
	.stage02-04-circle02{transform:translate3d(105px,40px,0);}
	.stage02-04-circle03{transform:translate3d(105px,100px,0);}

	/* sp only */

	.stage02-map-sp02{
		width: 257px;
		margin: 20px 0 0 -130px;
	}

	.stage02-map-sp03{
		width: 257px;
		margin: 190px 0 0 -130px;
	}

	.stage02-map-sp02.is-left{transform:translate3d(-38px,10px,0);}
	.stage02-map-sp03.is-left{transform:translate3d(-38px,0,0);}

	.stage02-map-sp02.is-sp-center{transform:translate3d(0px,0px,0);}
	.stage02-map-sp03.is-sp-center{transform:translate3d(0px,0,0);}

	/* 03 ---------------------------------------*/

	.centerpoint,
	.stage03-line,
	.stage03-step,
	.stage03-step-head,
	.stage03-step-body{}

	.stage03-step,
	.stage03-step-head,
	.stage03-step-body{}

	.stage03-line{
		height: 340px;
		transform: translate3d(-110px,-160px,0);
	}

	.stage03-line.is-left{
		transform: translate3d(-130px,-200px,0);
		height: 100vh;
	}

	.stage03-line.is-leftmiddle{
		transform: translate3d(-130px,-49vh,0);
		height: 100vh;
	}

	.stage03-line.is-leftbottom{
		transform: translate3d(-130px,-100vh,0);
		height: calc(100vh - 130px);
	}

	.stage03-step{
		width:300px;
		height: 70px;
	}

	.stage03-step img{width:70px;}

	.stage03-step p{
		font-size: 19px;
		left: 90px;
	}

	.stage03-step01{transform: translate3d(-146px,-190px,0);}
	.stage03-step02{transform: translate3d(-146px,-85px,0);}
	.stage03-step03{transform: translate3d(-146px,20px,0);}
	.stage03-step04{transform: translate3d(-146px,127px,0);}

	/* 10.11ここまで */

	.stage03-step01.is-left{transform: translate3d(-163px,-250px,0);}
	.stage03-step01.is-lefttopout{transform: translate3d(-163px,-60vh,0);}
	.stage03-step02.is-leftbottomout{transform: translate3d(-163px,50vh,0);}
	.stage03-step02.is-left{transform: translate3d(-163px,-250px,0);}
	.stage03-step02.is-lefttopout{transform: translate3d(-163px,-60vh,0);}
	.stage03-step03.is-leftbottomout{transform: translate3d(-163px,60vh,0);}
	.stage03-step03.is-left{transform: translate3d(-163px,-250px,0);}
	.stage03-step03.is-lefttopout{transform: translate3d(-163px,-60vh,0);}
	.stage03-step04.is-leftbottomout{transform: translate3d(-163px,50vh,0);}
	.stage03-step04.is-left{transform: translate3d(-163px,-155px,0);}


	.stage03-step-head{z-index: 10;}

	.stage03-step01-head{
		transform: translate3d(-70px,-150px,0);
		width: 230px;
	}

	.stage03-step02-head{
		transform: translate3d(-70px,-150px,0);
		width: 190px;
	}

	.stage03-step03-head{
		transform: translate3d(-70px,-150px,0);
		width: 230px;
	}

	.stage03-step04-head{
		transform: translate3d(-70px,-60px,0);
		width: 180px;
	}

	.stage03-step-head img{
		position:absolute;
		left: 10px;
		top: 0;
		transform: rotate(90deg) translate(-45px,0);
	}

	.stage03-step-head.is-visible img{transform: rotate(90deg) translate(-35px,0px);}

	.stage03-step-head p{
		left: 0px;
		top: 0;
		transform: translate(0,-10px);
		width: 100%;
		padding: 10px 20px;
		font-size: 13px;
	}

	.stage03-step-head.is-visible p{transform: translate(0,0);}

	.stage03-step-body{
		transform: translate3d(-70px,-50px,0);
		width: 230px;
	}

	.stage03-step-body.is-visible{transform: translate3d(-70px,-60px,0);}
	.stage03-step02-body{transform: translate3d(-70px,-30px,0);}
	.stage03-step02-body.is-visible{transform: translate3d(-70px,-40px,0);}
	.stage03-step03-body{transform: translate3d(-70px,-30px,0);}
	.stage03-step03-body.is-visible{transform: translate3d(-70px,-40px,0);}

	.stage03-step04-body{transform: translate3d(-70px,40px,0);}
	.stage03-step04-body.is-visible{transform: translate3d(-70px,30px,0);}

	.stage03-step-body-flow{}

	.stage03-step-body dl{display: block;}

	.stage03-step-body dt{
		font-size: 16px;
		padding-bottom: 5px;
		margin-top: 43px;
	}

	.stage03-step-body dd{display: none}

	.stage03-step-body dd::after{
	    display:block;
	    content:'';
	    background:#343434;
	    width:0;
	    height:1px;
	    position:absolute;
	    left: 0;
	    bottom: 0;
	    transition: all 1.25s ease;
	}

	.stage03-step-body.is-visible dd::after{width:100%;}

	.stage03-step01-body dt{width:170px;}
	.stage03-step02-body dt{width:190px;}
	.stage03-step03-body dt{width:190px;}
	.stage03-step04-body dt{width:230px;}




	/* 04 ---------------------------------------*/

	.stage04-baseline{transform: translate3d(-50%,163px,0);}

	.stage04-dotline{
		transform: rotate(48deg);
		margin: -131px 0 0 -83px;
		width: 66px;
	}

	.stage04-dotline.is-hide{width:0;}

	.stage04-graph01{
		width: 80px;
		height: 297px;
		transform: translate3d(-163px,-132px,0);
	}

	.stage04-graph01.is-center {transform: scale(1.14) translate3d(-122px,-134px,0);}

	.stage04-graph02{
		width: 80px;
		height: 245px;
		transform: translate3d(-39px,-82px,0);
	}

	.stage04-graph02.is-left{transform: scale(1.14) translate3d(-122px,-88px,0);}

	.stage04-graph03{
		width: 80px;
		height: 245px;
		transform: translate3d(73px,-82px,0);
	}

	.stage04-graph03.is-left{transform: scale(1.14) translate3d(-122px,-88px,0);}

	.stage04-graph01-title{
		top: -30px;
		font-size: 14px;
	}

	.stage04-graph02-title{
		left: 50%;
		top: -50px;
		width: 100%;
		transform: translate3d(-50%,10px,0);
	}

	.stage04-graph02.is-visible .stage04-graph02-title{transform: translate3d(-50%,0,0);}

	.stage04-graph03-title{
		left: 50%;
		top: -50px;
		width: 100%;
		transform: translate3d(-50%,10px,0);
		white-space: nowrap;
	}

	.stage04-graph03.is-visible .stage04-graph03-title{transform: translate3d(-50%,0,0);}

	.stage04-graph01-bar01{height: 138px;}

	.stage04-graph01-bar02{
		top: 137px;
		height: 159px;
	}

	.stage04-graph02-bar01{height: 86px;}
	.stage04-graph02-bar01::after,
	.stage04-graph03-bar01::after{
		background: url(../img/service/stage/bg_dot.png) repeat;
		background-size: 15px;
	}

	.stage04-graph02-bar02{
		top: 86px;
		height: 159px;
	}

	.stage04-graph03-bar01{height: 245px;}

	.stage04-graph02-title small, .stage04-graph03-title small{
		font-size: 11px;
		padding-top: 8px;
		letter-spacing:0em;
	}

	.stage04-graph-text{font-size: 12px;}

	.stage04-explain{
		font-size: 13px;
		padding-left: 40px;
		z-index: 5;
		width: 210px;
	}

	.stage04-explain01{transform: translate(-45px,-132px);}
	.stage04-explain02{transform: translate(-45px,-0px);}
	.stage04-explain03{transform: translate(-45px,27px);}
	.stage04-explain04{transform: translate(-45px,-160px);}
	.stage04-explain05{transform: translate(-45px,-90px);}

	.is-visible.stage04-explain01{transform: translate(-45px,-142px);}
	.is-visible.stage04-explain02{transform: translate(-45px,-10px);}
	.is-visible.stage04-explain03{transform: translate(-45px,17px);height:80px;}
	.is-visible.stage04-explain04{transform: translate(-45px,-170px);}
	.is-visible.stage04-explain05{transform: translate(-45px,-100px);}

	.is-visible.stage04-explain03.is-full{transform: translate(-45px,-33px);height:185px;}
	.stage04-explain03.is-full{transform: translate(-45px,-23px);height:210px;}

	.explain-line{width: 30px;}

	.stage04-explain04 .explain-line::before,
	.stage04-explain04.is-visible .explain-line::before{
		transform: rotate(-45deg);
		top: 60%;
		left: -5px;
		width: 40px;
	}

	.stage04-explain ul li{
		font-size: 13px;
		padding-left: 20px;
		letter-spacing:0;
		margin-top: 0;
		line-height: 1.4;
	}

	.stage04-explain ul li:not(:first-child){margin-top: 0}
	.stage04-explain ul li:not(:last-child){margin-bottom: 10px;}

	.stage04-explain ul li::after{
		display:block;
		content:'';
		background:#000;
		background-size:100%;
		width:8px;
		height:8px;
		position:absolute;
		left: 0;
		top:5px;
		background: rgba(159,159,159,0.5);
	}

	.stage04-explain ul li.is-hide{display: none;}

	.stage04-bottommessage{
		transform: translate3d(-170px,195px,0);
		width: 340px;
		padding: 0px 0 0px 0px;
		font-size: 16px;
		height: 62px;
	}

	.stage04-bottommessage p{
		position:absolute;
		left:80px;
		top:50%;
		transform:translate(0%,-50%);
	}

	.stage04-bottommessage-04 p{top:30%;left:0;}


}



@media screen and (max-width: 980px){

	/* service ---------------------------------------*/

	.servicewrapper{padding-top: 100px;}

	.servicemain{
		padding: 0 30px;
		margin-bottom: 30px;
	}

	.servicemain-inner{overflow:visible;}

	.servicemain-head{
		width: 100%;
		float: none;
	}

	.servicemain-head-inner{
		display:flex;
		justify-content:space-between;
	}

	.servicemain-link{font-size: 11px;}
	.servicemain-link-list{}

	.servicemain-link-list,
	.servicemain-link-list a{color:#404040;}

	.servicemain-subtitle{float: none;}

	.servicemain-image{
		float: none;
		width: auto;
		margin: 0 -30px 40px;
	}

	.servicemain-body{
		width: 100%;
		float: none;
	}

	.servicemain-body p{
		line-height: 1.8;
		font-size: 14px;
	}


	/* innerlink ---------------------------------------*/

	.service-innerlink{
		margin-bottom: 47px;
		padding:0 30px;
	}

	.service-innerlink.col3{padding: 1px 30px 0px;}

	.service-innerlink ul{}

	.service-innerlink.col3 ul{max-width:640px;}

	.service-innerlink ul li{
		width:150px;
		margin-bottom: 10px
	}

	.service-innerlink.col3 ul li:nth-child(1){
		display: block;
		margin-bottom: 0;
		width: 100%;
	}

	.service-innerlink ul li:nth-child(1) span{
		display: inline-block;
		width: 150px;
	}

	.service-innerlink ul li span{}

	.service-innerlink ul li span::after{
		width: 6px;
		height: 6px;
	}

	.service-innerlink ul li span p{
		font-size: 15px;
		padding-top: 8px;
	}

	.service-innerlink ul li span small{
		font-size: 13px;
		padding-top: 6px;
	}

	.service-innerlink ul li span:hover::after,
	.service-innerlink ul li span:hover p,
	.service-innerlink ul li span small{opacity:1;}


	/* section side ---------------------------------------*/

	.servicesection{overflow: hidden;}

	.servicesection-side{
		width: 100%;
		display: block;
		padding: 75px 35px;
	}
	.servicesection-side p{padding-bottom: 0}
	.servicesection-side::after{display: none}

	.servicesection-side-title .title-block{font-size: 20px;}
	.servicesection-side .servicesection-side-title p{margin-top: 10px}
	.servicesection-side-image{text-align:center;}
	.servicesection-side-image img{width:100%;max-width:320px;}
	.servicesection-side-body .title-paragraph{font-size: 15px;}

	.servicesection-side-body p{
		line-height: 1.7;
		font-size: 14px;
		text-align: justify;
	}

	.scrolldown{display: none}


	/* section common ---------------------------------------*/

	.service-padding{
		height: 80px;
		width: 100%;
	}

	.service-padding::after{display: none}

	.servicesection-flex{display: block}
	.servicesection-body{
		width: 100%;
		padding-top: 60px;
		min-height: 650px;
	}

	.servicesection-side{max-height:1000px;}
	.servicesection-side-body{padding-bottom: 0px}




}




@media screen and (max-width: 370px){

	.service-innerlink{padding: 0;}
	.service-innerlink.col3{padding:0;}

}