﻿@charset "utf-8";
html{
	-webkit-text-size-adjust: 100%;
}
html.close {
	overflow:hidden;
	height:100%;
}
body {
	font-family: "Noto Sans JP", sans-serif;
	font-size:3.6vw;
	font-weight:500;
	text-align:center;
	color:#1A1311;
	line-height:1.9;
	letter-spacing:0.06em;
//	font-feature-settings: "palt";
}

@media screen and (min-width:769px){
	body {
		font-size:min(1.6vw,16px);
	}
}

.en{
	font-family: "Roboto", sans-serif;
}

a {
	color:#1A1311;
	transition : opacity 0.4s;
	-webkit-transition : opacity 0.4s;
	opacity:1;
	outline:none;
}

@media screen and (min-width:769px){
	a {
		transition : opacity 0.4s;
		-webkit-transition : opacity 0.4s;
	}
	a:hover {
		opacity: 0.7;
	}
}

img{
	max-width:100%;
	height:auto;
	vertical-align:bottom;
}


.only_pc{
	display:none !important;
}
.only_sp{
	display:block !important;
}
.only_sp_i{
	display:inline-block !important;
}
.only_sp_f{
	display: -webkit-flex !important;
	display: flex !important;
}

@media screen and (min-width:769px){
	.only_pc{
		display:block !important;
	}
	.only_sp,
	.only_sp_i,
	.only_sp_f{
		display:none !important;
	}
}

#wrapper{
	overflow:hidden;
}
.inner{
	width:88%;
		margin:auto;
}

@media screen and (min-width:769px){
	.inner{
		max-width:1080px;
		width:90%;
	}
}


/* 色関係 */
.white{
	color:#fff;
}
.gray{
	color:#C3C4CC;
}
.bg_gray{
	background-color:#EFF0F2;
}
.bg_black{
	color:#fff;
	background-color:#1A1311;
}
.green{
	color:#0CBA6E;
}
.bg_green{
	color:#fff;
	background-color:#02A55E;
}
.bg_blue{
	color:#fff;
	background-color:#4169E1;
}
.orange{
	color:#E36900;
}
.bg_orange{
	color:#fff;
	background-color:#E36900;
}




/* 書式 */
.text_left{
	text-align:left !important;
}
.text_right{
	text-align:right !important;
}
.text_center{
	text-align:center !important;
}

.bold{
	font-weight:bold;
}
.heavy{
	font-weight:900;
}

.blc{
	display:block;
}

.marker{
	line-height:1.9;
	display:inline-block;
	margin:0.3em 0.3em 0.3em 0;
	padding:0 0.3em 0 0.5em;
	border-radius:0.2em;
}
.marker.ml{
	margin-left:0.3em;
}

.stroke{
	-webkit-text-stroke: 0.6vw #1A1311;
	paint-order: stroke;
}
.stroke2{
	-webkit-text-stroke: 1px #1A1311;
}

@media screen and (min-width:769px){
	.stroke{
		-webkit-text-stroke: 3px #1A1311;
		paint-order: stroke;
	}
}


/* .btn */
.btn{
	width:84%;
	line-height:3.6;
	margin:1em auto 0;
	padding:0;
	display:block;
	font-size:4.1vw;
	font-weight:bold;
	text-align:center;
	letter-spacing:0.05em;
	text-indent:0.05em;
	border-radius:100px;
	position:relative;
}
.btn.bg_green{
	background-image:url(../images/icon_easy.png);
	background-repeat:no-repeat;
	background-position:0.5em center;
	background-size:2.5em auto;
	box-shadow:0 2px 4px rgba(2,165,94,0.3);
}
.btn.bg_blue{
	background-image:url(../images/icon_mail.png);
	background-repeat:no-repeat;
	background-position:0.5em center;
	background-size:2.5em auto;
	box-shadow:0 2px 4px rgba(65,105,225,0.3);
}
.btn:after{
	content:'';
	display:block;
	width:0.55em;
	height:0.55em;
	border-top:2px solid;
	border-right:2px solid;
	position:absolute;
	right:1.6em;
	top:50%;
	transform:translateY(-50%) rotate(45deg);
}

@media screen and (min-width:769px){
	.btn{
		width:auto;
		line-height:3.6;
		margin:1em auto 0;
		font-size:min(1.4vw,20px);
	}
}


/* header */
header{
	width:100%;
	height:75px;
	padding-left:20px;
	display:flex;
	justify-content:space-between;
	align-items:center;
	position:absolute;
	z-index:100;
}
header .head_logo{
	display:block;
	width:124px;
}
header .head_nav{
	width:100%;
	height:100dvh;
	background-color:#EFF0F2;
	position:fixed;
	top:0;
	left:0;
	display:none;
}
header .head_nav .nav_head{
	width:100%;
	height:75px;
	padding-left:20px;
	display:flex;
	justify-content:space-between;
	align-items:center;
	position:absolute;
	z-index:100;
}
header .head_nav ul{
	padding-top:75px;
	background-color:#fff;
}
header .head_nav ul li{
	font-size:15px;
	text-align:left;
	border-top:1px solid #E2E3E5;
}
header .head_nav ul li a{
	display:block;
	line-height:3.5;
	padding-left:1.5em;
	letter-spacing:0.03em;
	position:relative;
}
header .head_nav ul li a:after{
	content:'';
	display:block;
	width:0.55em;
	height:0.55em;
	border-top:2px solid;
	border-right:2px solid;
	position:absolute;
	right:1.6em;
	top:50%;
	transform:translateY(-50%) rotate(45deg);
}
header .head_nav ul li.btn_list{
	padding-top:1.5em;
	background-color:#EFF0F2;
}
header .head_nav ul li.btn_list .btn{
	width:min(84%,326px);
	font-size:16px;
}
header nav .hour{
	margin-top:1.5em;
	font-size:12px;
	letter-spacing:0.06em;
	text-indent:0.06em;
}

@media screen and (min-width:769px){
	header{
		height:96px;
		padding:0 30px;
		position:fixed;
		transition : background 0.2s;
		-webkit-transition : background 0.2s;
	}
	header.scroll{
		background-color:#fff;
		box-shadow:0 0 5px rgba(0,0,0,0.3);
	}
	header .head_logo{
		width:145px;
	}
	header .head_nav{
		width:auto;
		height:auto;
		background-color:transparent;
		position:static;
		top:auto;
		left:auto;
		display:block;
	}
	header .head_nav ul{
		padding-top:0;
		background-color:transparent;
		display:flex;
		align-items:center;
	}
	header .head_nav ul li{
		margin-left:1.2em;
		font-size:16px;
		text-align:left;
		border-top:none;
	}
	header .head_nav ul li:nth-child(-n+4){
		display:none;
	}
	header .head_nav ul li a{
		display:inline;
		line-height:1.9;
		padding-left:0;
		position:static;
	}
	header .head_nav ul li a:after{
		content:none;
	}
	header .head_nav ul li.btn_list{
		padding-top:0;
		background-color:transparent;
		display:flex;
		align-items:center;
	}
	header .head_nav ul li.btn_list .btn{
		line-height:3.5;
		display:block;
		width:12em;
		margin-top:0;
		font-size:14px;
		background-image:none;
	}
	header .head_nav ul li.btn_list .btn:nth-child(n+2){
		margin-left:1em;
	}
}

@media screen and (min-width:1080px){
	header .head_nav ul li:nth-child(-n+4){
		display:block;
	}
}
@media screen and (min-width:1140px){
	header .head_logo{
		width:185px;
	}
}
@media screen and (min-width:1200px){
	header .head_nav ul li{
		margin-left:2em;
	}
}



/* #btnmenu */
#btnmenu{
	width:55px;
	height:55px;
	margin:0;
	padding:0;
	position:fixed;
	right:0;
	top:0;
	z-index:105;
	cursor:pointer;
	background-color:#1A1311;
}
#btnmenu span{
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 24px;
	height: 1px;
	border-radius:1px;
	margin: -1px 0 0 -12px;
	background: #fff;
	-webkit-transition: .2s;
	transition: .2s;
}
#btnmenu span:before,
#btnmenu span:after{
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 24px;
	height: 1px;
	background: #fff;
	border-radius:2px;
	-webkit-transition: .3s;
	transition: .3s;
}

#btnmenu span:before{
	margin-top: -6px;
}

#btnmenu span:after{
	margin-top: 5px;
}
#btnmenu.close span{
	width:55px;
	height:55px;
	margin-top:-27px;
	margin-left:-27px;
	box-shadow:none;
	background-color:transparent;
	border-radius:0;
}

#btnmenu.close span:before,
#btnmenu.close span:after{
	margin-top: 0;
	background-color:#fff
}

#btnmenu.close span:before{
	width: 24px;
	height: 1px;
	margin: -1px 0 0 15px;
	border-radius:2px;
	-webkit-transform: rotate(-30deg);
	transform: rotate(-30deg);
}
#btnmenu.close span:after{
	width: 24px;
	height: 1px;
	margin: -1px 0 0 15px;
	border-radius:2px;
	-webkit-transform: rotate(-150deg);
	transform: rotate(-150deg);
}


/* main */
main{
}


/* #mv */
#mv{
	padding-top:calc(75px + 5%);
	aspect-ratio:390 / 800;
	background:url(../images/mv_bg_s.webp)no-repeat center center;
	background-size:cover;
}
#mv .cont_wrapper .sec h1{
	line-height:1.4;
	font-size:6.6vw;
	letter-spacing:0.02em;
	padding-left:0.02em;
}
#mv .cont_wrapper .sec .fig{
	margin-top:7%;
}
#mv .cont_wrapper .sec .btn_list{
	margin-top:9%;
}

@media screen and (min-width:769px){
	#mv{
		padding-top:0;
		aspect-ratio:auto;
		background-image:none;
		display:flex;
		position:relative;
	}
	#mv .cont_wrapper{
		width:50%;
		padding-top:96px;
		display:flex;
		justify-content:center;
		align-items:center;
	}
	#mv .cont_wrapper .sec{
		width:min(65%,466px);
	}
	#mv .cont_wrapper .sec h1{
		font-size:min(2.7vw,39px);
		text-align:left;
		white-space:nowrap;
	}
	#mv .cont_wrapper .sec .btn_list{
		margin-top:18%;
	}
	#mv .cont_wrapper .sec .btn_list .btn{
		font-size:min(1.4vw,20px);
	}
	
	#mv .fig{
		width:50%;
		padding:calc(96px + min(3%,70px)) 0 min(9%,130px);
		background:url(../images/mv_bg.webp)no-repeat center center;
		background-size:cover;
		display:flex;
		justify-content:center;
		align-items:center;
	}
	#mv .fig img{
		width:min(81%,586px);
	}

	#mv .scroll{
		line-height:0;
		font-size:min(1.4vw,14px);
		font-weight:normal;
		position:absolute;
		right:30px;
		bottom:0;
		transform:rotate(90deg);
		transform-origin:right center;
	}
	#mv .scroll:after{
		content:'';
		display:inline-block;
		vertical-align:0.3em;
		width:6em;
		height:1px;
		margin-left:1em;
		border-bottom:1px solid;
	}
}


/* .cont */
.cont{
	padding:12% 0 18%;
}
.cont .tit .en{
	line-height:1;
	display:block;
	font-size:4.1vw;
	letter-spacing:0.03em;
	text-indent:0.03em;
}
.cont .tit .jp{
	display:block;
	font-size:6.1vw;
	letter-spacing:0.02em;
	text-indent:0.02em;
}

@media screen and (min-width:769px){
	.cont{
		padding:min(10%,100px) 0;
	}
	.cont .tit .en{
		font-size:min(1.7vw,17px);
	}
	.cont .tit .jp{
		font-size:min(3.6vw,36px);
	}
}


/* #cont1 */
#cont1{
	padding-bottom:0;
}
#cont1 .sec{
	width:94%;
	padding:9% 5% 18%;
	background:url(../images/cont1_bg_s.png)no-repeat center center;
	background-size:100% 100%;
}
#cont1 .sec h2{
	line-height:1.3;
}
#cont1 .sec h2 .fuki{
	line-height:2.6;
	display:inline-block;
	padding:0 2em;
	font-size:4vw;
	letter-spacing:0.02em;
	text-indent:0.02em;
	background-color:#fff;
	border-radius:0.3em;
	position:relative;
}
#cont1 .sec h2 .fuki:after{
	content:'';
	display:block;
	width:1.2em;
	height:0.6em;
	background-color:#fff;
	clip-path:polygon(0 0, 100% 0, 50% 100%);
	position:absolute;
	top:100%;
	left:50%;
	transform:translate(-50%,-1px);
}
#cont1 .sec h2 .normal{
	display:block;
	margin-top:0.5em;
	font-size:7.1vw;
	letter-spacing:0.02em;
	text-indent:0.02em;
}
#cont1 .sec h2 .stroke{
	font-size:10vw;
	letter-spacing:0.03em;
	text-indent:0.03em;
}
#cont1 .sec h2 .green{
	letter-spacing:0.1em;
	text-indent:0.1em;
}
#cont1 .sec h2 .green .large{
	display:inline-block;
	vertical-align:-0.05em;
	font-size:18vw;
	line-height:0.9;
}
#cont1 .sec h2 .white .small{
	font-size:9vw;
}
#cont1 .sec h2 .gray .large{
	font-size:12vw;
}
#cont1 .sec .trouble{
	margin-top:7%;
}
#cont1 .sec .trouble li{
	line-height:1.5;
	margin-top:0.7em;
	padding-left:2.2em;
	font-weight:bold;
	text-align:left;
	letter-spacing:0.02em;
	background:url(../images/icon_batu.svg)no-repeat left center;
	background-size:1.5em auto;
}
#cont1 .bottom{
	display:block;
	width:66%;
	margin:-9% auto 0;
	position:relative;
}

@media screen and (min-width:769px){
	#cont1 .sec{
		width:94%;
		padding:min(5.5%,55px) min(8%,80px) min(7%,70px);
		padding:min(4.6%,55px) min(6.6%,80px) min(5.8%,70px);
		background:url(../images/cont1_bg.png)no-repeat center center;
		background-size:100% 100%;
		display:flex;
		justify-content:space-between;
		align-items:center;
	}
	#cont1 .sec h2{
		width:min(38vw,380px);
		width:min(34vw,380px);
		white-space:nowrap;
	}
	#cont1 .sec h2 .fuki{
		display:block;
		padding:0;
		font-size:min(2vw,20px);
		font-size:min(1.8vw,20px);
		border-radius:0.3em;
	}
	#cont1 .sec h2 .normal{
		font-size:min(3.6vw,36px);
		font-size:min(3.3vw,36px);
	}
	#cont1 .sec h2 .stroke{
		font-size:min(5.3vw,53px);
		font-size:min(4.8vw,53px);
	}
	#cont1 .sec h2 .green .large{
		vertical-align:-0.05em;
		font-size:min(8vw,80px);
		font-size:min(7.2vw,80px);
	}
	#cont1 .sec h2 .white .small{
		font-size:min(4.5vw,45px);
		font-size:min(4.1vw,45px);
	}
	#cont1 .sec h2 .gray .large{
		font-size:min(6.3vw,63px);
		font-size:min(5.7vw,63px);
	}
	#cont1 .sec .trouble{
		width:min(49vw,490px);
		width:min(42.5vw,490px);
		margin-top:0;
	}
	#cont1 .sec .trouble li{
		line-height:1.5;
		margin:0.9em 0;
		font-size:min(1.6vw,18px);
		white-space:nowrap;
	}
	#cont1 .bottom{
		width:min(32.5vw,325px);
		margin:max(-5%,-50px) auto 0;
		position:relative;
	}
}


/* #cont2 */
#cont2{
	padding:4% 0;
}
#cont2 .cont_wrapper:nth-child(n+2){
	padding-top:9%;
}
#cont2 .cont_wrapper .sec{
	text-align:left;
}
#cont2 .cont_wrapper .sec h2 .small{
	display:block;
	padding-left:3.2em;
	font-size:4.3vw;
	letter-spacing:0.02em;
	background:url(../images/logo.png)no-repeat left center;
	background-size:2.5em;
}
#cont2 .cont_wrapper .sec h2 .large{
	margin-top:0.6em;
	line-height:1.5;
	display:block;
	font-size:5.9vw;
	letter-spacing:0.02em;
}
#cont2 .cont_wrapper .sec p{
	margin-top:0.8em;
}
#cont2 .cont_wrapper .sec .bottom{
	line-height:1.5;
	margin-top:0.5em;
	font-size:4.1vw;
}
#cont2 .cont_wrapper .fig{
	margin-top:7%;
}

@media screen and (min-width:769px){
	#cont2{
		padding: 0;
	}
	#cont2 .cont_wrapper{
		display:flex;
		justify-content:space-between;
		align-items:flex-end;
	}
	#cont2 .cont_wrapper:nth-child(n+2){
		padding-top:min(1.5%,15px);
		flex-direction:row-reverse;
	}
	#cont2 .cont_wrapper .sec{
		width:min(45%,460px);
	}
	#cont2 .cont_wrapper .sec h2 .small{
		font-size:min(1.8vw,20px);
	}
	#cont2 .cont_wrapper .sec h2 .large{
		font-size:min(3vw,34px);
	}
	#cont2 .cont_wrapper .sec .bottom{
		margin-top:0.8em;
		font-size:min(1.8vw,20px);
	}
	#cont2 .cont_wrapper .fig{
		width:min(52%,574px);
		margin-top:0;
	}
}


/* #cont3 */
#cont3{
	margin-top:24%;
	padding-top:0;
}
#cont3 .fig_top{
	width:64%;
	display:inline-block;
	transform:translateY(-45%);
}
#cont3 .tit{
	margin-top:-9%;
}
#cont3 .service{
	margin-top:7%;
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
}
#cont3 .service li{
	width:42vw;
	margin-top:4%;
	padding-bottom:5%;
	background-color:#fff;
	border-radius:0.3em;
	overflow:hidden;
}
#cont3 .service li .num{
	display:block;
	width:4em;
	line-height:1.9;
	font-size:4.1vw;
	font-weight:bold;
	text-align:center;
	border-radius:0 0 0.4em 0;
}
#cont3 .service li .num:before{
	content: '特徴';
	font-size:2.8vw;
	margin-right:0.3em;
	vertical-align:0.15em;
}
#cont3 .service li h3{
	height:6em;
	line-height:1.4;
	font-size:4.15vw;
	letter-spacing:0.02em;
	padding-left:0.02em;
	display:flex;
	justify-content:center;
	align-items:center;
}
#cont3 .service li h3 .tit_wrapper > .large{
	font-size:4.8vw;
}
#cont3 .service li h3 .tit_wrapper .stroke{
	font-size:6.9vw;
}
#cont3 .service li h3 .tit_wrapper .stroke.large{
	line-height:1;
	font-size:16.1vw;
}
#cont3 .service li h3 .tit_wrapper .stroke.middle{
	line-height:1;
	font-size:10.2vw;
}
#cont3 .service li h3 .tit_wrapper .stroke.small{
	font-size:5.1vw;
}
#cont3 .service li p{
	line-height:1.5;
	padding:0 9%;
	font-size:3.3vw;
	text-align:left;
}

@media screen and (min-width:769px){
	#cont3{
		margin-top:min(7%,70px);
	}
	#cont3 .fig_top{
		width:min(30%,300px);
		transform:translateY(-20%);
	}
	#cont3 .tit{
		margin-top:0;
	}
	#cont3 .service{
		margin-top:min(2%,20px);
	}
	#cont3 .service li{
		width:min(31.5%,340px);
		margin-top:min(3.5%,35px);
		padding-bottom:2%;
		border-radius:0.5em;
	}
	#cont3 .service li .num{
		width:4.5em;
		font-size:min(2.2vw,24px);
		border-radius:0 0 0.4em 0;
	}
	#cont3 .service li .num:before{
		font-size:min(1.5vw,16px);
	}
	#cont3 .service li h3{
		height:4.5em;
		font-size:min(2.7vw,30px);
	}
	#cont3 .service li h3 .tit_wrapper > .large{
		font-size:min(3.1vw,34px)
	}
	#cont3 .service li h3 .tit_wrapper .stroke{
		font-size:min(4.8vw,53px);
	}
	#cont3 .service li h3 .tit_wrapper .stroke.large{
		font-size:min(10.3vw,114px);
	}
	#cont3 .service li h3 .tit_wrapper .stroke.middle{
		font-size:min(5.7vw,62px);
	}
	#cont3 .service li h3 .tit_wrapper .stroke.small{
		font-size:min(3.6vw,40px);
	}
	#cont3 .service li p{
		padding:0;
		font-size:min(1.5vw,16px);
		text-align:center;
	}
}


/* #cont4 */
#cont4{
}
#cont4 .voice{
	width:84%;
	counter-reset: listnum;
}
#cont4 .voice li{
	margin-top:22%;
	padding:0 9% 9%;
	border:0.5vw solid #02A55E;
	border-radius:0.8em;
	text-align:left;
}
#cont4 .voice li figure:after{
	counter-increment: listnum;
	content: 'VOICE.' counter(listnum, decimal-leading-zero);
	font-size:3.8vw;
	font-weight:bold;
	letter-spacing:0.03em;
	color:#02A55E;
	display:block;
	margin-top:-21%;
}
#cont4 .voice li figure img{
	display:block;
	width:27.7vw;
	margin:auto;
	transform:translateY(-50%);
}
#cont4 .voice li h3{
	line-height:1.4;
	margin-top:0.3em;
	font-size:4.6vw;
	letter-spacing:0.06em;
}
#cont4 .voice li p{
	margin-top:1em;
	line-height:1.7;
	letter-spacing:0.02em;
}
#cont4 .bottom{
	margin-top:1.5em;
	font-size:3.3vw;
	letter-spacing:0.06em;
	text-indent:0.06em;
}

@media screen and (min-width:769px){
	#cont4 .voice{
		width:90%;
		margin-top:min(10%,100px);
		display:flex;
		justify-content:space-between;
	}
	#cont4 .voice li{
		width:min(31.5%,340px);
		margin:0;
		padding:0 3.5% 3.5%;
		border:2px solid #02A55E;
		border-radius:0.8em;
	}
	#cont4 .voice li figure:after{
		font-size:min(1.4vw,15px);
		margin-top:-21%;
	}
	#cont4 .voice li figure img{
		width:min(13vw,140px);
	}
	#cont4 .voice li h3{
		margin-top:0.3em;
		font-size:min(1.75vw,21px);
	}
	#cont4 .bottom{
		margin-top:1.5em;
		font-size:min(1.3vw,13px);
	}
}


/* #cont5 */
#cont5{
}
#cont5 .cat ul{
	display:flex;
	justify-content:space-between;
}
#cont5 .cat ul li .btn{
	width:8em;
	line-height:3;
	font-size:3.3vw;
	font-weight:normal;
	letter-spacing:0.06em;
	text-indent:0.06em;
	color:#8E8E8E;
	background-color:#fff;
	box-shadow:0 2px 3px rgba(0,0,0,0.1);
}
#cont5 .cat ul li .btn:after{
	content:none;
}
#cont5 .cat ul li .btn.active{
	font-weight:bold;
	color:#fff;
	background-color:#02A55E;
}

#cont5 .works{
	width:84%;
}
#cont5 .works li{
	margin-top:9%;
}
#cont5 .works li figure img{
	width:100%;
	aspect-ratio:840 / 492;
	object-fit: cover;
	object-position:center top;
	border-radius:0.3em;
}
#cont5 .works li figure figcaption{
	line-height:1.6;
	margin-top:3%;
	text-align:left;
}
#cont5 .works li figure figcaption .plan{
	display:block;
	font-size:3.1vw;
	font-weight:bold;
	letter-spacing:0.03em;
	color:#8E8E8E;
}
#cont5 .works li figure figcaption .client{
	display:block;
	font-size:4.6vw;
	letter-spacing:0.06em;
}
#cont5 .works li figure figcaption .url{
	display:block;
	font-size:3.3vw;
	font-weight:normal;
	letter-spacing:0.02em;
	word-break: break-all;
}
#cont5 .btn_list{
	max-width: 300px;
	margin: 30px auto 0;
}
#cont5 .btn.bg_green{
  background-image: none;	
}

@media screen and (min-width:769px){
	#cont5 .cat ul{
		justify-content:center;
	}
	#cont5 .cat ul li{
		margin:0.3em;
	}
	#cont5 .cat ul li .btn{
		line-height:2.8;
		width:10.5em;
		font-size:min(1.7vw,17px);
	}

	#cont5 .works{
		max-width:880px;
		width:90%;
		display:flex;
		justify-content:space-between;
		flex-wrap:wrap;
	}
	#cont5 .works li{
		width:min(48%,420px);
		margin-top:5%;
	}
	#cont5 .works li figure img{
		border-radius:0.3em;
	}
	#cont5 .works li figure figcaption .plan{
		font-size:min(1.4vw,14px);
	}
	#cont5 .works li figure figcaption .client{
		font-size:min(2vw,20px);
	}
	#cont5 .works li figure figcaption .url{
		font-size:min(1.4vw,14px);
	}
}


/* #cont6 */
#cont6{
}
#cont6 .plan > li{
	margin-top:7%;
	overflow:hidden;
}
#cont6 .plan > li h3{
	line-height:1.3;
	padding:5% 0;
	display:flex;
	justify-content:center;
	align-items:center;
	flex-direction:column;
	border-radius:0.8em 0.8em 0 0;
}
#cont6 .plan > li h3 .small{
	font-size:4.1vw;
	letter-spacing:0.02em;
	text-indent:0.02em;
}
#cont6 .plan > li h3 .large{
	font-size:6.1vw;
	letter-spacing:0.02em;
	text-indent:0.02em;
}
#cont6 .plan > li .sec{
	padding:5% 0 9%;
	border:2px solid #02A55E;
	border-top:none;
	border-radius: 0 0 0.8em 0.8em;
}
#cont6 .plan > li:last-child .sec{
	border:2px solid #E36900;
}
#cont6 .plan > li .sec h4{
	display:flex;
	justify-content:center;
	align-items:center;
}
#cont6 .plan > li .sec h4 .month{
	font-size:4.8vw;
	writing-mode: vertical-rl;
}
#cont6 .plan > li .sec h4 .price{
	line-height:1.2;
	font-size:14.8vw;
}
#cont6 .plan > li .sec h4 .price .small{
	font-size:7vw;
	font-weight:500;
}
#cont6 .plan > li .sec h4 .yen{
	line-height:1;
	font-size:6.9vw;
	display:flex;
	justify-content:center;
	align-items:center;
	flex-direction:column-reverse;
}
#cont6 .plan > li .sec h4 .yen .tax{
	font-size:2.8vw;
}
#cont6 .plan > li .sec .lead{
	margin:3% 0 5%;
	font-size:4.1vw;
	font-weight:bold;
}
#cont6 .plan > li .sec .lead .marker{
	margin:0.1em 0;
	padding:0 0.8em;
	letter-spacing:0.06em;
	text-indent:0.06em;
}
#cont6 .plan > li .sec .point{
	margin:0 5%;
	padding-left:1.5em;
}
#cont6 .plan > li .sec .point li{
	margin-top:0.5em;
	line-height:1.4;
	list-style:disc;
	text-align:left;
	letter-spacing:0.02em;
}
#cont6 .plan > li .sec .recommend{
	margin-top:5%;
}
#cont6 .plan > li .sec .recommend dt{
	margin:0 5%;
	font-size:4.1vw;
	font-weight:bold;
	display:flex;
	justify-content:space-between;
	align-items:center;
}
#cont6 .plan > li .sec .recommend dt:before,
#cont6 .plan > li .sec .recommend dt:after{
	content:'';
	display:block;
	width:4em;
	height:1px;
	background-color:#CDCED3;
}

#cont6 .bottom_sec{
	margin-top:7%;
	padding:7% 0;
	border:2px solid #CDCED3;
	border-radius:0.8em;
}
#cont6 .bottom_sec h3{
	line-height:1.5;
	font-size:4.8vw;
	letter-spacing:0.06em;
	padding-left:0.06em;
}
#cont6 .bottom_sec .page{
	margin-top:3%;
	padding:0 5%;
}
#cont6 .bottom_sec .page dt{
	margin-bottom:1.5%;
	font-size:4.1vw;
	font-weight:bold;
	display:flex;
	justify-content:space-between;
	align-items:center;
}
#cont6 .bottom_sec .page dt:before,
#cont6 .bottom_sec .page dt:after{
	content:'';
	display:block;
	width:3.5em;
	height:1px;
	background-color:#CDCED3;
}
#cont6 .bottom_sec .page .marker{
	padding:0 0.5em;
	font-size:3.8vw;
	font-weight:bold;
	letter-spacing:0.06em;
	text-indent:0.06em;
}
#cont6 .bottom_sec .caution{
	line-height:1.5;
	margin:3% 7% 0;
	padding-left:1em;
	font-size:3.1vw;
	text-align:left;
	text-indent:-1em;
	letter-spacing:0.06em;
}

@media screen and (min-width:769px){
	#cont6 .plan{
		max-width:980px;
		margin-top:min(5%,50px);
		display:flex;
		justify-content:space-between;
	}
	#cont6 .plan > li{
		width:min(49%,480px);
		margin-top:0;
	}
	
	#cont6 .plan > li h3{
		line-height:1.3;
		padding:7% 0;
		flex-direction:row;
		border-radius:0.8em 0.8em 0 0;
	}
	#cont6 .plan > li h3 .small{
		font-size:min(1.8vw,18px);
		margin-right:0.15em;
	}
	#cont6 .plan > li h3 .large{
		font-size:min(3vw,30px);
	}
	#cont6 .plan > li .sec{
		padding:3% 0 7%;
	}
	#cont6 .plan > li .sec h4 .month{
		font-size:min(2vw,22px);
	}
	#cont6 .plan > li .sec h4 .price{
		font-size:min(5.8vw,64px);
	}
	#cont6 .plan > li .sec h4 .price .small{
		font-size:min(2.9vw,32px);
	}
	#cont6 .plan > li .sec h4 .yen{
		font-size:min(2.7vw,30px);
	}
	#cont6 .plan > li .sec h4 .yen .tax{
		font-size:min(1vw,11px);
	}
	#cont6 .plan > li .sec .lead{
		margin:3% 0 5%;
		font-size:min(1.8vw,20px);
	}
	#cont6 .plan > li .sec .lead .marker{
		margin:0.1em 0;
		padding:0 0.8em;
		letter-spacing:0.06em;
		text-indent:0.06em;
	}
	#cont6 .plan > li .sec .point{
		margin:0 5%;
	}
	#cont6 .plan > li .sec .recommend{
		margin-top:5%;
	}
	#cont6 .plan > li .sec .recommend dt{
		font-size:min(1.6vw,18px);
	}
	
	#cont6 .bottom_sec{
		max-width:980px;
		margin-top:min(2%,20px);
		padding:min(2.5%,25px) 0;
	}
	#cont6 .bottom_sec h3{
		font-size:min(2.4vw,26px);
	}
	#cont6 .bottom_sec .page{
		margin-top:min(1.5%,15px);
		padding:0 min(10.9vw,120px);
		display:flex;
		justify-content:space-between;
		flex-wrap:wrap;
	}
	#cont6 .bottom_sec .page dt{
		width:100%;
		margin-bottom:0;
		font-size:min(1.6vw,18px);
	}
	#cont6 .bottom_sec .page dt:before,
	#cont6 .bottom_sec .page dt:after{
		content:'';
		width:14em;
	}
	#cont6 .bottom_sec .page .marker{
		padding:0 0.5em;
		font-size:min(1.8vw,20px);
	}
	#cont6 .bottom_sec .caution{
		display:inline-block;
		margin:min(1%,10px) 0 0;
		padding-left:1em;
		font-size:min(1.3vw,14px);
	}
}


/* #cont7 */
#cont7{
	padding-top:0;
}
#cont7 .tbl{
	width:94%;
	margin-top:5%;
	font-size:2.8vw;
	border-radius:1em;
	overflow:hidden;
}
#cont7 .tbl th,
#cont7 .tbl td{
	height:3em;
	font-weight:bold;
	letter-spacing:0.06em;
	text-indent:0.06em;
	border:2px solid #fff;
}
#cont7 .tbl td:first-of-type{
	width:35%;
	background-color:#D6F7E8;
}
#cont7 .tbl td:last-of-type{
	width:35%;
	background-color:#FCEADA;
}
#cont7 .tbl th:first-of-type{
	padding-left:1em;
	text-align:left;
}
#cont7 .tbl tr:first-child th{
	height:3.8em;
}
#cont7 .tbl tr:first-child th:nth-child(2){
	border-radius:1em 0 0 0;
}
#cont7 .tbl tr:nth-child(2) th:first-child{
	border-radius:1em 0 0 0;
}
#cont7 .tbl td img{
	width:1.7em;
}

@media screen and (min-width:769px){
	#cont7 .tbl{
		width:90%;
		max-width:880px;
		margin-top:min(5%,50px);
		font-size:min(1.6vw,16px);
		border-radius:0.8em;
	}
	#cont7 .tbl th,
	#cont7 .tbl td{
		height:3.2em;
	}
	#cont7 .tbl td:first-of-type{
		width:40%;
	}
	#cont7 .tbl td:last-of-type{
		width:40%;
	}
	#cont7 .tbl th:first-of-type{
		padding-left:1.5em;
	}
	#cont7 .tbl tr:first-child th{
		font-size:min(1.9vw,19px);
		height:3.2em;
	}
	#cont7 .tbl tr:first-child th:nth-child(2){
		border-radius:0.6em 0 0 0;
	}
	#cont7 .tbl tr:nth-child(2) th:first-child{
		border-radius:0.8em 0 0 0;
	}
	#cont7 .tbl td img{
		width:1.7em;
	}
}


/* #cont8 */
#cont8{
}
#cont8 .flow{
	counter-reset: listnum;
}
#cont8 .flow li{
	margin-top:2.4em;
	padding:0.6em 0 0.6em 1em;
	background-color:#fff;
	display:flex;
	align-items:center;
	position:relative;
	border-radius:0.5em;
}
#cont8 .flow li:before{
	counter-increment: listnum;
	content: counter(listnum, decimal-leading-zero);
	font-family: "Roboto", sans-serif;
	font-size:4.1vw;
	font-weight:bold;
	display:block;
	width:2.8em;
	height:2.8em;
	line-height:2.9;
	color:#fff;
	background-color:#02A55E;
	border-radius:100%;
}
#cont8 .flow li:first-child{
	margin-top:1.5em;
}
#cont8 .flow li:nth-child(n+2):after{
	content:'';
	display:block;
	width:2.2em;
	height:1.1em;
	background:url(../images/icon_arrow.svg)no-repeat center top;
	background-size:100% auto;
	position:absolute;
	bottom:calc(100% + 1.2em);
	left:50%;
	transform:translate(-50%,50%);
}
#cont8 .flow li figure{
	display:flex;
	align-items:center;
	font-size:4.1vw;
	margin-left:0.5em;
}
#cont8 .flow li figure img{
	width:3.5em;
}
#cont8 .flow li figure figcaption{
	line-height:1em;
	font-weight:bold;
	letter-spacing:0.06em;
	text-align:left;
	margin-left:1em;
	flex:1;
}
#cont8 .flow li figure figcaption .small{
	display:block;
	margin-top:0.3em;
	font-size:3.5vw;
	font-weight:normal;
	letter-spacing:0.02em;
	text-indent:-0.5em;
}

@media screen and (min-width:769px){
	#cont8{
		padding-bottom:min(18%,180px);
	}
	#cont8 .flow{
		max-width:880px;
		display:flex;
		justify-content:space-between;
	}
	#cont8 .flow li{
		width:min(16.4%,144px);
		margin-top:0;
		padding:0;
		background-color:transparent;
		display:block;
		border-radius:0;
	}
	#cont8 .flow li:before{
		font-size:min(2vw,20px);
		display:block;
		width:2.6em;
		height:2.6em;
		line-height:2.5;
		margin:auto;
		transform:translateY(50%);
		position:relative;
		z-index:1;
	}
	#cont8 .flow li:first-child{
		margin-top:0;
	}
	#cont8 .flow li:nth-child(n+2):after{
		position:absolute;
		bottom:auto;
		top:50%;
		left:auto;
		right:100%;
		transform:translate(-10%,100%) rotate(-90deg);
	}
	#cont8 .flow li figure{
		display:block;
		font-size:min(2vw,20px);
		margin-left:0;
		padding:15%;
		background-color:#fff;
		border-radius:0.5em;
		position:relative;
	}
	#cont8 .flow li figure img{
		width:90%;
	}
	#cont8 .flow li figure figcaption{
		width:100%;
		line-height:1.3;
		letter-spacing:0.06em;
		padding-left:0.06em;
		text-align:center;
		margin-left:0;
		position:absolute;
		top:calc(100% + 0.7em);
		left:0;
	}
	#cont8 .flow li figure figcaption .small{
		margin-top:0.3em;
		font-size:min(1.6vw,16px);
		letter-spacing:0.02em;
		text-indent:0.02em;
	}
}


/* #cont9 */
#cont9{
}
#cont9 .faq{
	margin-top:7%;
}
#cont9 .faq div{
	line-height:1.7;
	margin-top:4%;
	text-align:left;
}
#cont9 .faq div dt{
	padding:1.2em 3em 1.2em 3em;
	font-weight:bold;
	text-indent:-1.8em;
	position:relative;
	border:1px solid #CDCED3;
	box-shadow:0 2px 3px rgba(0,0,0,0.1);
	border-radius:100px;
	cursor:pointer;
}
#cont9 .faq div dt:before{
	content:'Q.';
	line-height:1;
	margin-right:0.2em;
	font-weight:bold;
	letter-spacing:0;
	color:#0CBA6E;
}
#cont9 .faq div dt:after{
	content:'＋';
	display:block;
	width:1.5em;
	height:1.5em;
	line-height:1.4;
	font-size:4.1vw;
	font-weight:normal;
	text-align:center;
	letter-spacing:0;
	text-indent:0;
	background-color:#EFF0F2;
	border-radius:100%;
	position:absolute;
	right:1em;
	top:50%;
	transform:translateY(-50%);
}
#cont9 .faq div dt.close:after{
	content:'－';
	color:#fff;
	background-color:#02A55E;
}

#cont9 .faq div dd{
	padding:1em 1.2em;
	display:none;
}

#cont9 .btn_list{
	max-width: 300px;
	margin: 60px auto 0;
}
#cont9 .btn.bg_green{
  background-image: none;	
}

@media screen and (min-width:769px){
	#cont9 .faq{
		max-width:880px;
		margin-top:min(5%,50px);
	}
	#cont9 .faq div{
		margin-top:min(1.5%,15px);
	}
	#cont9 .faq div dt{
		padding:1.1em 3em 1.1em 3em;
		font-size:min(1.9vw,19px);
		text-indent:-1.5em;
	}
	#cont9 .faq div dt:after{
		width:1.8em;
		height:1.8em;
		line-height:1.7;
		font-size:min(2vw,20px);
	}

	#cont9 .faq div dd{
		padding:1em 2em;
	}
}


/* #cont10 */
#cont10{
}
#cont10 .cont{
	width:100%;
	padding-left:6%;
	padding-right:6%;
	border-radius:2.5em;
}

#cont10 .cont .sec{
	padding:0 9%;
	letter-spacing:0.05em;
	text-align:left;
}
#cont10 .cont .sec h2{
	margin-bottom:0.8em;
	line-height:1.6;
	font-size:7.2vw;
}
#cont10 .cont .sec p{
	line-height:1.9;
	margin-top:1em;
	font-size:4.1vw;
	font-weight:bold;
	letter-spacing:0.04em;
}
#cont10 .cont .sec p .marker{
	margin-top:0.1em;
	margin-bottom:0.1em;
}

#cont10 .cta{
	margin-top:12%;
	padding:12% 0;
	color:#1A1311;
	background-color:#fff;
	border-radius:1em;
}
#cont10 .cta h3 .fuki{
	padding:0 1em;
	font-size:3.6vw;
	font-weight:500;
	letter-spacing:0.02em;
	text-indent:0.02em;
	position:relative;
}
#cont10 .cta h3 .fuki:before{
	content:'';
	display:block;
	width:2px;
	height:110%;
	background-color:#02A55E;
	position:absolute;
	left:0;
	bottom:0;
	transform:rotate(-36deg);
}
#cont10 .cta h3 .fuki:after{
	content:'';
	display:block;
	width:2px;
	height:110%;
	background-color:#02A55E;
	position:absolute;
	right:0;
	bottom:0;
	transform:rotate(36deg);
}

#cont10 .cta h3 .large{
	display:block;
	font-size:5.3vw;
	letter-spacing:0.06em;
	text-indent:0.06em;
}
#cont10 .cta h3 .small{
	display:block;
	font-size:3.1vw;
	font-weight:500;
	letter-spacing:0.02em;
	text-indent:0.02em;
}

@media screen and (min-width:769px){
	#cont10 .cont{
		max-width:1366px;
		width:94%;
		padding:min(7%,100px)  min(8%,140px);
		border-radius:2.5em;
		display:flex;
		align-items:center;
	}

	#cont10 .cont .sec{
		width:min(50%,540px);
		padding:0;
	}
	#cont10 .cont .sec h2{
		font-size:min(3.8vw,47px);
	}
	#cont10 .cont .sec p{
		font-size:min(1.5vw,18px);
	}

	#cont10 .cta{
		width:min(50%,540px);
		margin-top:0;
		padding:5% 0 9%;
		border-radius:2em;
	}
	#cont10 .cta h3 .fuki{
		font-size:min(1.6vw,18px);
	}
	#cont10 .cta h3 .large{
		font-size:min(2.6vw,29px);
	}
	#cont10 .cta h3 .small{
		font-size:min(1.3vw,14px);
	}
	#cont10 .cta .btn_list .btn{
		width:72%;
		font-size:min(1.4vw,20px);
	}
}


/* footer */
footer{
	padding-top:7%;
}
footer .foot_wrapper .foot_logo{
	display:inline-block;
	width:43%;
}
footer .foot_wrapper nav{
	margin-top:7%;
}
footer .foot_wrapper nav ul{
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
}
footer .foot_wrapper nav ul li{
	width:50%;
	border-top:1px solid #E2E3E5;
}
footer .foot_wrapper nav ul li:nth-child(odd){
	border-right:1px solid #E2E3E5;
}
footer .foot_wrapper nav ul li a{
	display:block;
	line-height:4;
	letter-spacing:0.03em;
	text-indent:0.03em;
}

footer .foot_bottom{
	line-height:1.5;
	padding:9% 0 9% 0.03em;
	font-size:3.3vw;
	font-weight:normal;
	color:#5F5E5E;
	letter-spacing:0.03em;
}
footer .foot_bottom .copy{
	margin-top:1.5em;
}

@media screen and (min-width:769px){
	footer{
		padding-top:min(9%,90px);
	}
	footer .foot_wrapper .foot_logo{
		width:185px;
	}
	footer .foot_wrapper nav{
		margin:min(3%,30px) auto 0;
		max-width:640px;
	}
	footer .foot_wrapper nav ul li{
		width:auto;
		border-top:none;
		font-size:16px;
		margin:0 1em;
	}
	footer .foot_wrapper nav ul li:nth-child(odd){
		border-right:none;
	}
	footer .foot_wrapper nav ul li a{
		display:inline;
		line-height:1.9;
		letter-spacing:0.06em;
		text-indent:0.06em;
		font-size:16px;
	}

	footer .foot_bottom{
		margin-top:min(9%,90px);
		padding:50px 0 50px 0.03em;
		font-size:14px;
	}
	footer .foot_bottom .copy{
		margin-top:1.5em;
	}
}

@media screen and (min-width:1080px){
	footer .foot_wrapper{
		padding:0 30px;
		display:flex;
		justify-content:space-between;
		align-items:center;
	}
	footer .foot_wrapper .foot_logo{
		width:145px;
	}
	footer .foot_wrapper nav{
		max-width:100%;
		margin:0;
	}
	footer .foot_wrapper nav ul li{
		margin:0 0 0 1.2em;
	}
}

@media screen and (min-width:1140px){
	footer .foot_wrapper .foot_logo{
		width:185px;
	}
	footer .foot_wrapper nav ul li{
		margin:0 0 0 2em;
	}
}


/* #to_top */
#topbtn{
		width:15%;
	position:fixed;
	z-index:99;
	right:20px;
	bottom:-200px;
	-webkit-transition: bottom 0.8s;
	transition: bottom 0.8s;
}

@media screen and (min-width:769px){
	#topbtn{
		width:76px;
	}
}


/* #bottom_nav */
#bottom_nav{
	width:100%;
	display:flex;
	justify-content:space-around;
	position:fixed;
	z-index:99;
	right:0;
	bottom:-300px;
	-webkit-transition: bottom 0.8s;
	transition: bottom 0.8s;
}
#bottom_nav a{
	width:48%;
	background-image:none;
}
#bottom_nav a:after{
	content:none;
}
#bottom_nav a:hover{
	opacity:1;
}



/* fadein */
.fadein {
	opacity : 0;
	-webkit-transform : translate(0, 40px);
	transform : translate(0, 40px);
	-webkit-transition-property: transform,opacity;
	transition-property : transform,opacity;
	-webkit-transition-duration: 1s;
	transition-duration : 1s;
}
.fadein_0 {
	opacity : 0.01;
	-webkit-transform : translate(0, 0);
	transform : translate(0, 0);
	-webkit-transition-property: transform,opacity;
	transition-property : transform,opacity;
	-webkit-transition-duration: 1s;
	transition-duration : 1s;
}
.fadein_l {
	opacity : 0;
	-webkit-transform : translate(-50px, 0);
	transform : translate(-50px, 0);
	-webkit-transition-property: transform,opacity;
	transition-property : transform,opacity;
	-webkit-transition-duration: 1s;
	transition-duration : 1s;
}
.fadein_r {
	opacity : 0;
	-webkit-transform : translate(50px, 0);
	transform : translate(50px, 0);
	-webkit-transition-property: transform,opacity;
	transition-property : transform,opacity;
	-webkit-transition-duration: 1s;
	transition-duration : 1s;
}
@media screen and (max-width:750px){
	.fadein_l,
	.fadein_r {
		-webkit-transform : translate(0, 40px);
		transform : translate(0, 40px);
	}
}


.delay1 {
	-webkit-transition-property: transform,opacity;
	transition-property : transform,opacity;
	-webkit-transition-duration: 1s;
	transition-duration : 1s;
	-webkit-transition-delay: 0.2s;
	transition-delay : 0.2s;
}
.delay2 {
	-webkit-transition-property: transform,opacity;
	transition-property : transform,opacity;
	-webkit-transition-duration: 1s;
	transition-duration : 1s;
	-webkit-transition-delay: 0.4s;
	transition-delay : 0.4s;
}
.delay3 {
	-webkit-transition-property: transform,opacity;
	transition-property : transform,opacity;
	-webkit-transition-duration: 1s;
	transition-duration : 1s;
	-webkit-transition-delay: 0.6s;
	transition-delay : 0.6s;
}
.delay4 {
	-webkit-transition-property: transform,opacity;
	transition-property : transform,opacity;
	-webkit-transition-duration: 1s;
	transition-duration : 1s;
	-webkit-transition-delay: 0.8s;
	transition-delay : 0.8s;
}

@media screen and (max-width:750px){
	.delay1,
	.delay2,
	.delay3,
	.delay4,
	.delay5 {
		-webkit-transition-delay: 0s;
		transition-delay : 0s;
	}
}

.fadein.scrollin,
.fadein_0.scrollin,
.fadein_l.scrollin,
.fadein_r.scrollin{
	opacity : 1;
	-webkit-transform : translate(0, 0);
	transform : translate(0, 0);
}

