.ttl-c {
	line-height: 1;
}
.ttl-c .fz20 {
	letter-spacing: 1px;
}
.ttl-c .fz30 {
	letter-spacing: 0.2em;
}

@media screen and (min-width: 768px) {
.ttl-c .fz20 {
	letter-spacing: 1px;
}
.ttl-c .fz30 {
	letter-spacing: 6px;
}
}
#sec1 {
	padding-top: 15vw;
	padding-bottom: 20vw;
	position: relative;
}
#sec1::before {
	content: "";
	background: url(../img/index/cloud_02.png) no-repeat top center;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
	width: 150%;
	height: 578px;
	position: absolute;
	top: -10vw;
	left: -63vw;
}
#sec1 .ttl-c {
    text-align: center;
    line-height: 1;
    position: relative;
    margin: 0 -8vw 8vw;
}
#sec1 .ttl-c::before {
	content: "";
	background: url(../img/concept/sec1_circle.png) no-repeat center;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
	width: 120px;
	height: 120px;
	position: absolute;
	top: -24px;
	left: calc(50% - 205px);
}
#sec1 .ttl-c dt {
	margin-bottom: 30px;
}

#sec1 .ttl-c .fz30 {
	letter-spacing: 0.1em;
}
#sec1 .text {
	flex-direction: row-reverse;
}
#sec1 .text p {
}
#sec1 .text p + p {
	margin-top: 15px;
}
#sec1 .deco {
	width: 90px;
	position: absolute;
	right: 5vw;
	bottom: -20vw;
}

@media screen and (min-width: 768px) {
#sec1 {
	padding-top: 150px;
	padding-bottom: 132px;
}
#sec1::before {
	width: 1202px;
	height: 578px;
	top: -100px;
	left: -109px;
	opacity: .5;
}
#sec1 .ttl-c {
	margin-bottom: 85px;
	margin-left: 0;
	margin-right: 0;
}
#sec1 .ttl-c::before {
	width: 148px;
	height: 148px;
	top: -40px;
	left: calc(50% - 262px);
}
#sec1 .ttl-c dt {
	margin-bottom: 39px;
	letter-spacing: 1.5px;
}

#sec1 .ttl-c .fz30 {
	letter-spacing: 6px;
}

#sec1 .text {
	width: 763px;
	margin: 0 auto;
	flex-direction: row-reverse;
	letter-spacing: 4px;
}
#sec1 .text p {
	height: 465px;
	line-height: 40px;
}
#sec1 .text p + p {
	margin-bottom: 10px;
	margin-top: 0;
}
#sec1 .deco {
	width: 97px;
	right: 84px;
	bottom: 0;
}
}
#sec2 {
	position: relative;
}
#sec2::before, #sec2::after {
	content: "";
	background: url(../img/shared/bg03.jpg);
	position: absolute;
	right: 0;
	width: 95vw;
	z-index: -1;
	top: 15vw;
	height: 206vw;
}
#sec2::after {
	height: 1079px;
	left: 0;
	right: auto;
	width: 95vw;
	bottom: 0;
	top: auto;
}
#sec2 .set1 {
	position: relative;
	z-index: 1;
}
#sec2 .set1::before {
    content: "";
    background: url(../img/index/sec5_bgshadow_sp.png) repeat-x center;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    position: absolute;
    top: 15vw;
    left: 0;
    right: 0;
    height: 351vw;
}
#sec2 .set1 .photo-1 {
	width: 70vw;
	height: 80vw;
	margin-left: -8vw;
	margin-bottom: 9vw;
}
#sec2 .set1 .photo-2 {
	width: 35vw;
	height: 40vw;
	position: absolute;
	top: 89vw;
	right: 5vw;
}
#sec2 .set1 .box {
	margin-left: auto;
	position: relative;
	z-index: 2;
}
#sec2 .set1 .box .ttl-c {
	margin-bottom: 8vw;
}
#sec2 .set1 .box .ttl-c dt {
	margin-bottom: 18px;
}
#sec2 .set1 .box .ttl-c dd span {
	display: block;
	margin-bottom: 20px;
}
#sec2 .set1 .box .text {
	margin-bottom: 0;
}
#sec2 .set1 .box .text p + p {
	margin-top: 0;
}
#sec2 .set2 {
	position: relative;
	z-index: 2;
	padding-top: 25vw;
	padding-bottom: 15vw;
}
#sec2 .set2 .photo-3 {
	width: 95vw;
	height: 80vw;
	margin-left: auto;
	margin-bottom: -117px;
}
#sec2 .set2 h3 {
	width: 50px;
	height: 280px;
	position: relative;
	top: 0;
	line-height: 50px;
	letter-spacing: 0.2em;
	margin: 0 auto 6vw;
}
#sec2 .set2 h3::after {
	content: "";
	border-left: 1px solid #ffffff;
	width: 1px;
	left: 50%;
	margin-left: -1px;
	height: 60px;
	bottom: 0;
	position: absolute;
}
#sec2 .set2 h3 span {
	display: block;
	text-align: left;
	padding-right: 35px;
	padding-top: 41px;
}
#sec2 .set2 .text {
}

@media screen and (min-width: 768px) {
#sec2 {
	position: relative;
}
#sec2::before, #sec2::after {
	right: 0;
	width: calc(50% + 437px);
	height: 266px;
	z-index: -1;
	top: 76px;
}
#sec2::after {
	height: 1079px;
	left: 0;
	right: auto;
	width: calc(50% + 223px);
	bottom: 0;
	top: auto;
}
#sec2 .set1 {
	margin-bottom: 0;
}
#sec2 .set1::before {
	position: absolute;
	top: -350px;
	left: 0;
	right: 0;
	height: 1663px;
	background: url(../img/index/sec5_bgshadow.png) repeat-x top center;
	-webkit-background-size: auto;
	background-size: auto;
}
#sec2 .set1 .photo-1 {
	width: 590px;
	height: 745px;
	margin-left: -80px;
	margin-bottom: -486px;
}
#sec2 .set1 .photo-2 {
	width: 392px;
	height: 556px;
	top: 340px;
	right: -80px;
}
#sec2 .set1 .box {
	width: 375px;
	margin-left: auto;
	margin-right: 243px;
}
#sec2 .set1 .box .ttl-c {
	margin-bottom: 116px;
}
#sec2 .set1 .box .ttl-c dt {
	margin-bottom: 31px;
	letter-spacing: 2px;
}
#sec2 .set1 .box .ttl-c dd span {
	margin-bottom: 33px;
	letter-spacing: 4px;
}
#sec2 .set1 .box .text {
}
#sec2 .set1 .box .text p + p {
	margin-top: 41px;
}
#sec2 .set2 {
	padding-top: 232px;
	padding-bottom: 146px;
}
#sec2 .set2 .photo-3 {
	width: 727px;
	height: 526px;
	margin-bottom: -225px;
}
#sec2 .set2 h3 {
	width: 45px;
	height: 375px;
	position: absolute;
	top: -148px;
	left: 179px;
	margin: 0;
	letter-spacing: 7px;
}
#sec2 .set2 h3::after {
	width: 1px;
	left: 50%;
	margin-left: -1px;
	height: 98px;
	bottom: 0;
	position: absolute;
}
#sec2 .set2 h3 span {
	text-align: right;
}
#sec2 .set2 .text {
	width: 405px;
}
}
#sec3 {
	position: relative;
	z-index: 3;
}
#sec3 .set1 {
	position: relative;
}
#sec3 .set1 .ttl-c {
	position: absolute;
	top: 35%;
	left: 0;
	z-index: 2;
	text-align: center;
	width: 100%;
}
#sec3 .set1 .ttl-c dt {
	margin-bottom: 0;
}
#sec3 .set1 .ttl-c dd {
	line-height: 50px;
}
#sec3 .set1 .ob-img {
	height: 67vw;
}
#sec3 .set2 {
	background: url(../img/concept/sec3_shadow.png) no-repeat center top;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
	padding-top: 10vw;
	padding-bottom: 15vw;
	position: relative;
}
#sec3 .set2::before {
	content: "";
	background: url(../img/index/cloud_02.png) no-repeat center top;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
	width: 150%;
	height: 578px;
	position: absolute;
	bottom: -27vw;
	left: -54vw;
}
#sec3 .set2 .photo-1 {
	width: 80vw;
	height: 60vw;
	margin-bottom: 10vw;
	margin-left: -9vw;
}
#sec3 .set2 .photo-2 {
	height: 80vw;
	margin-left: auto;
	margin-right: -9vw;
	margin-bottom: 7vw;
}
#sec3 .set2 .text {
	position: relative;
	z-index: 2;
}
#sec3 .set3 {
	position: relative;
}
#sec3 .set3 .photo-3 {
	margin-left: auto;
	height: 64vw;
}
#sec3 .set3 .box {
	padding-top: 10vw;
}
#sec3 .set3 .box h3 {
	text-align: center;
	margin-bottom: 5vw;
	line-height: 48px;
}
#sec3 .set3 .box .text {
	margin-bottom: 0;
}

@media screen and (min-width: 768px) {
#sec3 {
	margin-bottom: 0;
}
#sec3 .set1 {
	margin-bottom: 0;
}
#sec3 .set1 .ttl-c {
	top: 42%;
	text-align: center;
}
#sec3 .set1 .ttl-c dt {
	margin-bottom: 6px;
	letter-spacing: 2px;
}
#sec3 .set1 .ttl-c dd {
	line-height: 70px;
}
#sec3 .set1 .ob-img {
	height: 700px;
}
#sec3 .set2 {
	background: url(../img/concept/sec3_shadow.png) no-repeat center top;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
	padding-top: 52px;
	padding-bottom: 160px;
}
#sec3 .set2::before {
	width: 1202px;
	height: 578px;
	bottom: -74px;
	left: -150px;
	opacity: .6;
}
#sec3 .set2 .photo-1 {
	width: 602px;
	height: 398px;
	margin-bottom: 48px;
	margin-left: 0;
}
#sec3 .set2 .photo-2 {
	width: 903px;
	height: 563px;
	margin-right: 0;
	margin-bottom: 0;
}
#sec3 .set2 .text {
	position: absolute;
	top: 85px;
	right: 10px;
	width: 615px;
	letter-spacing: 3.2px;
}
#sec3 .set3 {
	margin-bottom: 0;
}
#sec3 .set3 .photo-3 {
	margin-left: auto;
	width: 390px;
	height: 340px;
	margin-right: 100px;
}
#sec3 .set3 .box {
	padding-top: 0px;
	padding-left: 43px;
	width: 620px;
}
#sec3 .set3 .box h3 {
	margin-bottom: 56px;
	line-height: 48px;
	letter-spacing: 5px;
}
#sec3 .set3 .box .text {
	margin-bottom: 0;
}
}
#sec4 {
	position: relative;
	z-index: 2;
	padding-bottom: 15vw;
	padding-top: 15vw;
}
#sec4::before {
	content: "";
	background: url(../img/index/sec5_bgshadow.png) repeat-x top center;
	position: absolute;
	top: -144vw;
	left: 0;
	right: 0;
	height: 1663px;
}
#sec4::after {
	content: "";
	background: url(../img/shared/bg03.jpg);
	position: absolute;
	right: 0;
	z-index: -1;
	bottom: 0;
	top: 37vw;
	width: 97vw;
}
#sec4 .set1 {
	margin-bottom: 8vw;
}
#sec4 .set1 .ttl-c {
	position: absolute;
	top: 20vw;
	left: 0;
	width: 185px;
	text-align: center;
	z-index: 2;
}
#sec4 .set1 .ttl-c dt {
	margin-bottom: 10px;
}
#sec4 .set1 .ttl-c dd {line-height: 50px;}
#sec4 .set1 .photo {
	height: 74vw;
	width: 80vw;
	margin-right: -9vw;
	margin-left: auto;
}
#sec4 .set2 {
	position: relative;
}
#sec4 .set2 .photo {
	height: 70vw;
}
#sec4 .set2 .text {margin-bottom: 10vw;}

@media screen and (min-width: 768px) {
#sec4 {
	margin-bottom: 0;
	padding-bottom: 103px;
	padding-top: 251px;
}
#sec4::before {
	top: -670px;
	left: 0;
	right: 0;
	height: 1663px;
}
#sec4::after {
	right: 0;
	width: calc(50% + 504px);
	z-index: -1;
	bottom: 0;
	top: 0;
}
#sec4 .set1 {
	margin-bottom: 65px;
}
#sec4 .set1 .ttl-c {
	top: 289px;
	left: 0;
	width: 312px;
}
#sec4 .set1 .ttl-c dt {
	margin-bottom: 15px;
}
#sec4 .set1 .ttl-c dd {
	line-height: 70px;
}
#sec4 .set1 .photo {
	height: 700px;
	width: 991px;
	margin-right: -150px;
}
#sec4 .set2 {
	margin-bottom: 0;
}
#sec4 .set2 .photo {
	width: 597px;
	height: 476px;
}
#sec4 .set2 .text {
	padding-top: 121px;
	width: 462px;
	margin-bottom: 0;
}
}
#sec5 {
	padding-top: 25vw;
	padding-bottom: 20vw;
	position: relative;
}
#sec5 .title {
	position: relative;
}
#sec5 .title h2 {
	position: absolute;
	top: -30px;
	right: 20px;
	width: 120px;
	height: 321px;
	z-index: 2;
	line-height: 50px;
	letter-spacing: 0.2em;
}
#sec5 .title h2 span {
	display: block;
	text-align: right;
}
#sec5 .title .photo {
	width: 100%;
	height: 80vw;
}
#sec5 .box {padding-top: 5vw;}
#sec5 .box .text {
	margin-bottom: 10vw;
}
#sec5 .box .text .bnr__shared {
	right: 473px;
}

@media screen and (min-width: 768px) {
#sec5 {
	padding-top: 187px;
	padding-bottom: 191px;
}
#sec5 .title {
	width: 680px;
}
#sec5 .title h2 {
	top: -25px;
	right: 38px;
	width: 120px;
	height: 461px;
	z-index: 2;
	line-height: 70px;
	letter-spacing: 9px;
}
#sec5 .title h2 span {
	text-align: right;
}
#sec5 .title .photo {
	width: 100%;
	height: 567px;
}
#sec5 .box {
	width: 454px;
	padding-top: 178px;
	padding-left: 4px;
}
#sec5 .box .text {
	margin-bottom: 121px;
	letter-spacing: 3.2px;
}
#sec5 .box .text .bnr__shared {
	right: 473px;
}
}


@media screen and (min-width: 767px) and (max-width: 1299px) {
	#sec5 .box,
	#sec2 .set2 .text {
		padding-left: 30px;
	}
	#sec4 .set2 .text {
		padding-right: 100px;
	}
	#sec5 .title {
		width: 54%;
	}
	#sec5 .title h2 {
		right: 100px;
	}
	#sec3 .set2 .text {
        width: 53%;
        letter-spacing: 0.06em;
	}
	
	
	
}