@charset "UTF-8";


@media screen and (max-width: 767px) {
	header { width: 100%; height: 100vh; position: relative; background: url("../img/common/bg.png") 0 0 repeat; }	
	.mainCopy { position: absolute; top: 35%; left: 4%; z-index: 30;  }
	.mainCopy h2 { font-weight: 700; font-size: 2.4em; }
	.mainCopy p { font-weight: 700; font-size: 1.1em; margin-bottom: 0px; line-height: 1.7; margin-bottom: 5px; }
	
	.catch { position: absolute; width: 80vw; top: 10%; left: 2%; transform: rotate(-10deg); opacity: 0.85; z-index: 20; }
	.catch02 { position: absolute; width: 90vw; top: 57%; left: 2%; opacity: 0.6; z-index: 20; }
	
	.mv01 { position: absolute; left: -4%; bottom: 12%; width: 60vw; transform: rotate(-6deg); z-index: 10; }
	.mv01 img { border-radius: 10px; box-shadow: 6px 6px 10px 0px rgba(0, 0, 0, 0.2);}
	.mv02 { position: absolute; right: -2%; top: 18%; width: 50vw; transform: rotate(6deg); z-index: 10; }
	.mv02 img { border-radius: 10px; box-shadow: 6px 6px 10px 0px rgba(0, 0, 0, 0.2);}
	.mv03 { position: absolute; right: 4%; bottom: -2%; z-index: 10; width: 55vw; transform: rotate(0deg); z-index: 10; }
	.mv03 img { border-radius: 10px; box-shadow: 6px 6px 10px 0px rgba(0, 0, 0, 0.2);}
	
	.ovry { background-image: linear-gradient(330deg, rgba(187, 255, 239, 1), rgba(236, 237, 203, 1) 40%, rgba(248, 227, 183, 1) 60%, rgba(255, 207, 227, 1)); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; opacity: 0.25;}
}
@media screen and (max-width: 375px) {
}
@media screen and (min-width: 376px) and (max-width: 391px) {
}
@media screen and (min-width: 392px) and (max-width: 767px) {
}
@media screen and (min-width: 768px) {
	header { width: 100%; height: 100vh; position: relative; background: url("../img/common/bg.png") 0 0 repeat; }
	
	.mainCopy { position: absolute; top: 50%; left: 35%; z-index: 30;  }
	.mainCopy h2 { font-weight: 700; font-size: 3.0em; }
	.mainCopy p { font-weight: 700; font-size: 1.5em; margin-bottom: 0px; }
	
	.catch { position: absolute; width: 40vw; top: 20%; left: 8%; transform: rotate(-10deg); opacity: 0.85; z-index: 10; }
	.catch02 { position: absolute; width: 30vw; top: 70%; left: 40%; opacity: 0.6; z-index: 10; }
	
	.mv01 { position: absolute; left: 4%; bottom: 6%; width: 25vw; transform: rotate(-6deg); z-index: 20; }
	.mv01 img { border-radius: 10px; box-shadow: 6px 6px 10px 0px rgba(0, 0, 0, 0.2);}
	.mv02 { position: absolute; right: 4%; top: 15%; width: 22vw; transform: rotate(6deg); z-index: 20; }
	.mv02 img { border-radius: 10px; box-shadow: 6px 6px 10px 0px rgba(0, 0, 0, 0.2);}
	.mv03 { position: absolute; right: -1%; bottom: -4%; z-index: 10; width: 22vw; transform: rotate(0deg); z-index: 20; }
	.mv03 img { border-radius: 10px; box-shadow: 6px 6px 10px 0px rgba(0, 0, 0, 0.2);}
	
	.ovry { background-image: linear-gradient(330deg, rgba(187, 255, 239, 1), rgba(236, 237, 203, 1) 40%, rgba(248, 227, 183, 1) 60%, rgba(255, 207, 227, 1)); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; opacity: 0.25;}
}
@media screen and (min-width: 768px) and (max-width: 899px) {
	.mainCopy { position: absolute; top: 40%; left: 6%; z-index: 30;  }
	.mainCopy h2 { font-size: 2.7em; }
	.mainCopy p { font-size: 1.3em; margin-bottom: 0px; }
	
	.catch { position: absolute; width: 50vw; top: 15%; left: 4%; transform: rotate(-10deg); }
	.catch02 { position: absolute; width: 60vw; top: 52%; left: 30%; }
	
	.mv01 { position: absolute; left: -2%; bottom: 10%; width: 40vw; transform: rotate(-6deg); z-index: 20; }
	.mv02 { position: absolute; right: -2%; top: 15%; width: 35vw; transform: rotate(6deg); z-index: 20; }
	.mv03 { position: absolute; right: -1%; bottom: -4%; z-index: 10; width: 45vw; transform: rotate(0deg); z-index: 20; }
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
	.mainCopy { position: absolute; top: 40%; left: 20%; z-index: 30;  }
	.mainCopy h2 { font-size: 3.0em; }
	.mainCopy p { font-size: 1.3em; margin-bottom: 0px; }
	
	.catch { position: absolute; width: 50vw; top: 15%; left: 4%; transform: rotate(-10deg); }
	.catch02 { position: absolute; width: 50vw; top: 60%; left: 40%; }
	
	.mv01 { position: absolute; left: -2%; bottom: 2%; width: 35vw; transform: rotate(-6deg); z-index: 20; }
	.mv02 { position: absolute; right: -2%; top: 15%; width: 25vw; transform: rotate(6deg); z-index: 20; }
	.mv03 { position: absolute; right: -1%; bottom: -6%; z-index: 10; width: 30vw; transform: rotate(0deg); z-index: 20; }
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
	.mainCopy { position: absolute; top: 40%; left: 20%; z-index: 30;  }
	.mainCopy h2 { font-size: 3.0em; }
	.mainCopy p { font-size: 1.3em; margin-bottom: 0px; }
	
	.catch { position: absolute; width: 50vw; top: 15%; left: 4%; transform: rotate(-10deg); }
	.catch02 { position: absolute; width: 50vw; top: 60%; left: 40%; }
	
	.mv01 { position: absolute; left: -2%; bottom: 2%; width: 35vw; transform: rotate(-6deg); z-index: 20; }
	.mv02 { position: absolute; right: -2%; top: 15%; width: 25vw; transform: rotate(6deg); z-index: 20; }
	.mv03 { position: absolute; right: -1%; bottom: -6%; z-index: 10; width: 30vw; transform: rotate(0deg); z-index: 20; }
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
}
@media screen and (min-width: 1390px) and (max-width: 1489px) {
}
@media screen and (min-width: 1490px) and (max-width: 1589px) {
}
@media screen and (min-width: 1590px) {
}

/* mv */
@media screen and (max-width: 767px) {
	.pc_mv { display: none; }
	.tab_mv { display: none; }
	.sp_mv { display: block; }	
}
@media screen and (min-width: 768px) and (max-width: 1089px) {
	.pc_mv { display: none; }
	.tab_mv { display: block; }
	.sp_mv { display: none; }
}
@media screen and (min-width: 1090px) {
	.pc_mv { display: block; }
	.tab_mv { display: none; }
	.sp_mv { display: none; }
}

/*-- content ------------------------------------------------------------*/
.section-nayami { background: #fff6f6; position: relative; }
.section-nayami .in { position: relative; z-index: 10; }
.section-works .in { position: relative; z-index: 10; }
.section-works .in { position: relative; z-index: 10; }
.section-about .in { position: relative; z-index: 10; }
.section-asc { background: #fffef2; }
@media screen and (max-width: 599px) {
	section .in { padding: 6%; }
	.section-nayami:after { width: 100%; height: 100%; content: ""; background: #fff7ee; position: absolute; top: 0; left: 0; clip-path: polygon(0 50%, 0 100%, 60% 100%); }
	.section-reason { position: relative; }
	.section-reason:after { width: 100%; height: 100%; content: ""; background: #eef9ee; position: absolute; top: 0; left: 0; clip-path: polygon(0 0, 0 50%, 60% 0); z-index: -1; }
	.section-system { position: relative; }
	.section-system:after { width: 100%; height: 100%; content: ""; background: #fff8f4; position: absolute; top: 0; left: 0; clip-path: polygon(0 0, 0 100%, 40% 50%); z-index: -1; }
	.section-works  { position: relative; }
	.section-works:after { width: 100%; height: 100%; content: ""; background: #fffef8; position: absolute; top: 0; left: 0; clip-path: polygon(0 50%, 0 100%, 60% 100%); }
	.section-about { position: relative; }
	.section-about:after { width: 100%; height: 100%; content: ""; background: #f0f5ff; position: absolute; top: 0; left: 0; clip-path: polygon(0 0, 0 50%, 60% 0); z-index: -1; }
}
@media screen and (min-width: 600px) {
	#content { margin: 0vh 0; }
	.section-nayami:after { width: 100%; height: 100%; content: ""; background: #fff7ee; position: absolute; top: 0; left: 0; clip-path: polygon(0 0, 0 100%, 40% 100%); }
	.section-reason { position: relative; }
	.section-reason:after { width: 100%; height: 100%; content: ""; background: #eef9ee; position: absolute; top: 0; left: 0; clip-path: polygon(0 0, 0 100%, 40% 0); z-index: -1; }
	.section-system { position: relative; }
	.section-system:after { width: 100%; height: 100%; content: ""; background: #fff8f4; position: absolute; top: 0; left: 0; clip-path: polygon(0 0, 0 100%, 40% 50%); z-index: -1; }
	.section-works  { position: relative; }
	.section-works:after { width: 100%; height: 100%; content: ""; background: #fffef8; position: absolute; top: 0; left: 0; clip-path: polygon(0 0, 0 100%, 40% 100%); }
	.section-about { position: relative; }
	.section-about:after { width: 100%; height: 100%; content: ""; background: #f0f5ff; position: absolute; top: 0; left: 0; clip-path: polygon(0 0, 0 100%, 40% 0); z-index: -1; }
}

/*-- タイトル -------------------------------------------------------------*/
@media screen and (max-width: 1089px) {
	.ttl01 { text-align: center; margin-bottom: 20px; font-weight: bold; font-size: 1.8em; line-height: 1.5; color: #000; }	
	.ttl01 span.xsmall { font-size: 0.9em; }
	.subttl01 { text-align: center; color: #333; margin-bottom: 10px; font-weight: bold; line-height: 1.5; margin-bottom: 5px; }
	.subttl02 { background: var(--base-color); padding: 5px; text-align: center; color: #fff; }
	.ttlBar { width: 5%; height: 5px; margin: 0 auto 20px;}
	
	.mark { width: 30px; margin: 0 auto 10px; }	
	.movie_icon { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 30px;}
	.nayami { width: 150px; margin: 0 auto 10px; }
	.nayami img { mix-blend-mode: multiply; }
	.icon-mark { width: 60px; margin: 0 auto 10px; }
	.icon-mark-asc { width: 40px; margin: 0 auto 10px; }
	.ttl02 { color: #fff; margin-bottom: 20px; font-weight: bold; font-size: 1.1rem; line-height: 1.5; background: var(--bestar-color); padding: 10px 20px; }
}
@media screen and (min-width: 600px) and (max-width: 1089px) {
	section .in { padding: 5vh 4%; }
	.ttl01 { font-size: 2.0rem; }
	.mark { width: 40px; }	
	.movie_icon { width: 40px;}
	.nayami { width: 200px; margin: 0 auto 20px;}
	.icon-mark { width: 80px; margin: 0 auto 10px;}
	.icon-mark-asc { width: 50px; margin: 0 auto 10px; }
	.ttl01 { font-size: 1.8rem; }
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
	.ttl01 { font-size: 1.8rem; }
	.ttl01 { font-size: 1.4rem; }
}

@media screen and (min-width: 1090px) {
	section .in { max-width: 1260px; width: 96%; margin: 0 auto; padding: 5vh 0; }
	.ttl01 { text-align: center; color: #333; margin-bottom: 40px; font-weight: bold; font-size: 2.0em; line-height: 1.5; }	
	.ttl01 span.xsmall { color: #333; font-size: 0.7em;  }
	.ttlBar { width: 5%; height: 5px; margin: 0 auto 40px;}
	.subttl01 { text-align: center; color: #333; margin-bottom: 10px; font-weight: bold; line-height: 1.0; margin-bottom: 5px; }
	.subttl02 { background: var(--base-color); padding: 5px; text-align: center; color: #fff; }
	.mark { width: 60px; margin: 0 auto 10px; }	
	.movie_icon { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 50px;}
	.nayami { width: 240px; margin: 0 auto 20px; }
	.nayami img { mix-blend-mode: multiply; }
	.icon-mark { width: 80px; margin: 0 auto 10px; }
	.icon-mark-asc { width: 50px; margin: 0 auto 10px; }
	.ttl02 { color: #fff; margin-bottom: 20px; font-weight: bold; font-size: 1.8rem; line-height: 1.5; background: var(--bestar-color); padding: 10px 20px; }	
}
@media screen and (min-width: 1090px) and (min-width: 1189px) {
}
@media screen and (min-width: 1190px) and (min-width: 1289px) {
}
@media screen and (min-width: 1290px) and (min-width: 1389px) {
}

/*-- nayami -------------------------------------------------------------*/
@media screen and (max-width: 1089px) {
	.section-nayami .in { padding-top: 10vh;}
	.nayamiList { max-width: 700px; width: 100%; margin: 0 auto; }
	.nayamiList li { 
		font-size: 1.0rem; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px dotted #dedede; font-weight: bold; line-height: 1.7;
		background: url("../img/common/icon-check.png") left top no-repeat; background-size: 25px; padding-left: 30px; text-indent: 0em;
	}
}
@media screen and (min-width: 1090px) {
	.nayamiList { width: 700px; margin: 0 auto; }
	.nayamiList li { 
		font-size: 1.2rem; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px dotted #dedede; font-weight: bold; 
		background: url("../img/common/icon-check.png") left top no-repeat; background-size: 30px; padding-left: 60px; text-indent: -1em;
	}
}

/*-- solution -------------------------------------------------------------*/
@media screen and (max-width: 899px) {
	.solutionList { display: flex; justify-content: space-between; flex-wrap: wrap; margin-bottom: 5vh; margin-top: 5vh; }
	.solutionList .slList-li { width: 100%; border-radius: 3px; box-shadow: 0px 5px 15px 0px rgba(145, 148, 136, 0.25); position: relative; margin-bottom: 40px; padding: 10% 2% 2%; border: 1px solid #f4f7e8; }
	.solutionList .slList-li .number { position: absolute; top: -25px; left: 50%; transform: translateX(-50%); height: 50px; width: 50px; border-radius: 25px; background:var(--sub-color); color: #fff; display: flex; justify-content: center; align-items: center; outline: 1px solid var(--sub-color); /* 1pxの外枠線 */ outline-offset: 2px; /* 円と外枠の間の隙間の広さ */}
	.solutionList .slList-li h4 { text-align: center; font-size: 1.25em; font-weight: 900; margin-bottom: 40px; position: relative; }
	.solutionList .slList-li h4:after { content: ""; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); width: 50px; height: 3px; margin: 0 auto; background: var(--sub-color); }
	.solutionList .slList-li p { margin-bottom: 40px;}
	.listBox { background: #f4f7e8; padding: 8% 4% 4%; border-radius: 10px; position: relative; }
	.listBox h5 { position: absolute; top: -15px; left: 50%; transform: translateX(-50%); color: #fff; background-image: linear-gradient(90deg, rgba(46, 188, 161, 1), rgba(70, 227, 197, 1)); height: 30px; line-height: 30px; padding: 0 20px; }
	.checkList li { margin-bottom: 10px; font-size: 0.9em; }
	.checkList li:before { content: "\f058"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 0.5em; color:#2ebca1;}
	.checkList li:last-child { margin-bottom: 0; padding-bottom: 0; }
	.sl-icon { width: 120px; margin: 20px auto; }
}
@media screen and (min-width: 599px) and (max-width: 900px) {
	.solutionList .slList-li { width: 45%; }
}
@media screen and (min-width: 900px) {
	.solutionList { display: flex; justify-content: space-between; flex-wrap: wrap; margin-bottom: 5vh; }
	.solutionList .slList-li { width: 24%; border-radius: 3px; box-shadow: 0px 5px 15px 0px rgba(145, 148, 136, 0.25); position: relative; margin-bottom: 40px; padding: 4% 2% 2%;　border: 1px solid #f4f7e8; box-sizing: border-box; }
	.solutionList .slList-li .number { position: absolute; top: -25px; left: 50%; transform: translateX(-50%); height: 50px; width: 50px; border-radius: 25px; background:var(--sub-color); color: #fff; display: flex; justify-content: center; align-items: center; outline: 1px solid var(--sub-color); /* 1pxの外枠線 */ outline-offset: 2px; /* 円と外枠の間の隙間の広さ */}
	.solutionList .slList-li h4 { text-align: center; font-size: 1.25em; font-weight: 900; margin-bottom: 40px; position: relative; }
	.solutionList .slList-li h4:after { content: ""; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); width: 50px; height: 3px; margin: 0 auto; background: var(--sub-color); }
	.solutionList .slList-li p { margin-bottom: 40px;}
	.listBox { background: #f4f7e8; padding: 8% 4% 4%; border-radius: 10px; position: relative; }
	.listBox h5 { position: absolute; top: -15px; left: 50%; transform: translateX(-50%); color: #fff; background-image: linear-gradient(90deg, rgba(46, 188, 161, 1), rgba(70, 227, 197, 1)); height: 30px; line-height: 30px; padding: 0 20px; }
	.checkList li { margin-bottom: 10px; font-size: 0.9em; }
	.checkList li:before { content: "\f058"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 0.5em; color:#2ebca1;}
	.checkList li:last-child { margin-bottom: 0; padding-bottom: 0; }
	.sl-icon { width: 120px; margin: 20px auto; }
}

/*-- ポイント -------------------------------------------------------------*/
@media screen and (max-width: 767px) {
	#anch-point .ttl01 img { width: 60vw; margin: 0 auto 20px; }
	.in-flex { display: flex; justify-content: space-between; align-items: center; flex-direction: column; margin-bottom: 5vh; }
	.in-flex:last-child { margin-bottom: 0px; }
	.in-flex .in-flex-Img { width: 100%; position: relative; order: 1; margin-bottom: 20px; }
	.in-flex .in-flex-Txt { width: 100%; order: 2; }
	.in-flex .in-flex-Txt .ttl01 { text-align: center; margin-bottom: 10px; font-size: 1.2em; color:var(--base-color); }
	.pointDl { margin-bottom: 5px; display: flex; justify-content: center; align-items: center; flex-direction: column; }
	.pointDl dt { background: var(--base-color); color: #fff; padding: 1px 10px; width: fit-content; margin-right: 0.5em; word-break: keep-all; margin-bottom: 5px }
	.pointDl dd { padding: 2px 0px; font-weight: bold; }
	.pointDl dd .roboto { font-size: 1.5em; margin: 0 2px; }
	.in-flex .in-flex-L { margin-bottom: 20px; }
	
	.in-flex02 { margin-bottom: 0; }
	.in-flex02 .in-flex-R { display: none; }
	.in-flex02 .in-flex-L .sp_tab_mini { width: 100%; margin: 20px auto; }
	.in-flex02 .in-flex-L .sp_tab_mini02 { width: 50%; margin: 20px auto; }
	.in-flex02 .in-flex-L { margin-bottom: 20px; }
}
@media screen and (min-width: 768px) {
	.in-flex { display: flex; justify-content: space-between; align-items: center; margin-bottom: 5vh; }
	.in-flex-L { width: 48%; }
	.in-flex-R { width: 48%; }
	.in-flex:last-child { margin-bottom: 0px; }
	.in-flex .in-flex-Img { width: 30%; position: relative; }
	.in-flex .in-flex-Txt { width: 66%; }
	.in-flex .in-flex-Txt .ttl01 { text-align: left; margin-bottom: 10px; }
	.in-flex .in-flex-Txt p { font-size: 1.1em; line-height: 1.7;}
	.pointDl { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 10px; }
	.pointDl dt { background: var(--base-color); color: #fff; padding: 1px 10px;}
	.pointDl dd { padding: 1px 10px; }
	.pointDl dd .roboto { font-size: 1.5em; margin: 0 2px; }
	
	.in-flex-m { max-width: 900px; width: 100%; margin: 0 auto; }
}
@media screen and (min-width: 768px) and (max-width: 889px)  {	
	#anch-point .ttl01 img { width: 40vw; margin: 0 auto 20px; }
	.in-flex { display: flex; justify-content: space-between; align-items: flex-start; }
	.in-flex .in-flex-Img { width: 46%; }
	.in-flex .in-flex-Txt { width: 50%; }
	
	.in-flex02 .in-flex-R { display: none; }
	.in-flex02 .in-flex-L { width: 100%; }
	.in-flex02 .in-flex-L .sp_tab_mini { width: 80%; margin: 20px auto; }
	.in-flex02 .in-flex-L .sp_tab_mini02 { width: 50%; margin: 20px auto; }
	
	#anch-point .in-flex { display: flex; justify-content: space-between; align-items: flex-start; flex-direction: column; }
	#anch-point .in-flex .in-flex-Img { width: 60%; margin: 0 auto 40px; order: 1; }
	#anch-point .in-flex .in-flex-Txt { width: 100%; order: 2; }
	.pointDl { display: flex; justify-content: center; align-items: center; }
	#anch-point h3.ttl01 { text-align: center; }
}
@media screen and (min-width: 900px) and (max-width: 1089px)  {
	#anch-point .ttl01 img { width: 40vw; margin: 0 auto 20px; }
	.in-flex .in-flex-Img { width: 44%; }
	.in-flex .in-flex-Txt { width: 52%; }
}
@media screen and (min-width: 1090px) and (max-width: 1189px)  {
	#anch-point .ttl01 img { width: 40vw; margin: 0 auto 20px; }
	.in-flex .in-flex-Img { width: 42%; }
	.in-flex .in-flex-Txt { width: 54%; }
}
@media screen and (min-width: 1190px) and (max-width: 1289px)  {
}
@media screen and (min-width: 1290px) and (max-width: 1389px)  {
}
@media screen and (min-width: 1390px) and (max-width: 1489px)  {
}

/*-- cv-section -------------------------------------------------------------*/
.cv-section { background-image: linear-gradient(330deg, rgba(187, 255, 239, 1), rgba(236, 237, 203, 1) 40%, rgba(248, 227, 183, 1) 60%, rgba(255, 207, 227, 1)); }
.cv-section .in { padding: 5vh 0;}
.cv-section p.alC.min { color: #000; font-size: 1.5em; font-weight: bold; line-height: 1.0;}
@media screen and (max-width: 599px) {
	.cv-section .in { padding: 3vh 6%;}
	.contact-list { }
	.contact-list li { width: 90%; margin:0 5% 20px;}
	.contact-list li:last-child { margin-right: 0px; }
	.contact-list li:nth-child(1) p { margin-bottom: 0; font-size: 0.8em; }
	.contact-list li:nth-child(1) p.roboto { font-size: 2.4em;line-height: 1.7; }
		.contact-list li:nth-child(1) p.roboto a         { resize: none; }
		.contact-list li:nth-child(1) p.roboto a:link    { color:#000; text-decoration: none; }
		.contact-list li:nth-child(1) p.roboto a:visited { color:#000; text-decoration: none; }
		.contact-list li:nth-child(1) p.roboto a:hover   { color:#000; text-decoration: none; }
		.contact-list li:nth-child(1) p.roboto a:active  { color:#000; text-decoration: none; }
	.contact-list li:nth-child(1) p.roboto a:before { content: "\f095"; font-family: "Font AweSome 5 Free"; font-weight: 900; margin-right: 10px; transform: rotate(-270deg); display: inline-block;} 
	.contact-list li:nth-child(1) p.roboto:hover a:before { content: "\f2a0"; font-family: "Font AweSome 5 Free"; font-weight: 900; margin-right: 10px;}  
	.contact-list li:nth-child(1) p.xsmall { font-size: 0.8em; }
	
	.contact-list li.list-form { background: var(--cv-color); border: var(--cv-color) 1px solid; height: 35px; line-height: 35px; color: #fff; text-align: center; font-size: 0.9em; }
		.contact-list li.list-form a         { resize: none; display: block; }
		.contact-list li.list-form a:link    { color:#fff; text-decoration: none; }
		.contact-list li.list-form a:visited { color:#fff; text-decoration: none; }
		.contact-list li.list-form a:hover   { color:var(--cv-color); text-decoration: none; background:#fff; border-radius: 6px; }
		.contact-list li.list-form a:active  { color:#fff; text-decoration: none; }
	.contact-list li.list-form a:before { content: "\f0e0"; font-family: "Font AweSome 5 Free"; font-weight: 900; margin-right: 10px;} 
	.contact-list li.list-form:hover a:before { content: "\f2b6"; font-family: "Font AweSome 5 Free"; font-weight: 900; margin-right: 10px;}  
	
	.cv-section p.alC.min { color: #000; font-size: 1.2em; }
}
@media screen and (min-width: 600px) {	
	.contact-list { display: flex; justify-content: center; align-items: center; }
	.contact-list li { width: 31%; margin-right: 3.5%;}
	.contact-list li:last-child { margin-right: 0px;  }
	.contact-list li:nth-child(1) { width: auto; }
	.contact-list li:nth-child(1) p { margin-bottom: 0; color:#000; font-size: 0.9rem; }
	.contact-list li:nth-child(1) p.roboto { font-size: 2.4rem;line-height: 1.2; }
		.contact-list li:nth-child(1) p.roboto a         { resize: none; }
		.contact-list li:nth-child(1) p.roboto a:link    { color:#000; text-decoration: none; }
		.contact-list li:nth-child(1) p.roboto a:visited { color:#000; text-decoration: none; }
		.contact-list li:nth-child(1) p.roboto a:hover   { color:#000; text-decoration: none; }
		.contact-list li:nth-child(1) p.roboto a:active  { color:#000; text-decoration: none; }
	.contact-list li:nth-child(1) p.roboto a:before { content: ""; background-image: url("../img/common/sp_h_tel.png"); background-size: 40px; background-repeat: no-repeat; background-position: center; margin-right: 10px; display: inline-block; width: 40px; height: 27px;} 
	.contact-list li:nth-child(1) p.xsmall { font-size: 0.8rem; }
	
	.contact-list li.list-form { background: var(--cv-color); border: var(--cv-color) 1px solid; height: 50px; line-height: 50px; color: #fff; text-align: center; font-size: 1.0rem; border-radius: 6px; max-width: 300px; }
	.contact-list li.list-form:hover { line-height: 47px; }
		.contact-list li.list-form a         { resize: none; display: block; }
		.contact-list li.list-form a:link    { color:#fff; text-decoration: none; }
		.contact-list li.list-form a:visited { color:#fff; text-decoration: none; }
		.contact-list li.list-form a:hover   { color:var(--cv-color); text-decoration: none; background:#fff; border-radius: 6px; }
		.contact-list li.list-form a:active  { color:#fff; text-decoration: none; }
	.contact-list li.list-form a:before { content: "\f0e0"; font-family: "Font AweSome 5 Free"; font-weight: 900; margin-right: 10px;} 
	.contact-list li.list-form:hover a:before { content: "\f2b6"; font-family: "Font AweSome 5 Free"; font-weight: 900; margin-right: 10px;}  
}
@media screen and (min-width: 600px) and (max-width: 899px)  {	
	.contact-list li { width: 40%; margin-right: 2%;}
	.contact-list li.list-form p { margin-bottom: 0; font-size: 0.7rem; }
	.contact-list li.list-form p.roboto { font-size: 2.0rem; }	
	.contact-list li.list-form { height: 50px; line-height: 50px; font-size: 1.0rem; }
	.contact-list li.list-form:hover { line-height: 47px; }
}
@media screen and (min-width: 900px) and (max-width: 1089px)  {	
	.contact-list li { width: 32%; margin-right: 2%;}
	.contact-list li.list-form p { margin-bottom: 0; font-size: 0.7rem; }
	.contact-list li.list-form p.roboto { font-size: 2.0rem; }	
	.contact-list li.list-form { height: 50px; line-height: 50px; font-size: 1.0rem; }
	.contact-list li.list-form:hover { line-height: 47px; }
}

/*-- system -------------------------------------------------------------*/
@media screen and (max-width: 1089px) {
	.background dt { background: var(--base-color); padding: 5px; text-align: center; color: #fff;}
	.background dd { padding: 4%; }
	
	.pointList { margin-bottom: 40px; }
	.pointList li { margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px dotted #dedede; }
	.pointList li:nth-child(3) { margin-bottom: 0px; }
	.pointList li h4 { text-align: center; font-weight: bold; font-size: 1.1em; color: var(--base-color); margin-bottom: 10px; display: flex; justify-content: center; align-items: center; flex-direction: column; }
	.pointList li div { width: 60%; margin: 0 auto; margin-bottom: 20px;}
	.pointList li p { font-size: 0.9em; }
}
@media screen and (min-width: 1090px) {
	.in-960 { max-width: 960px; margin: 0 auto; }
	.background dt { background: var(--base-color); padding: 5px; text-align: center; color: #fff;}
	.background dd { padding: 4%; }
	
	.pointList { display: flex; justify-content: center; margin-bottom: 40px; }
	.pointList li { width: 31%; margin-right: 2%; }
	.pointList li:nth-child(3) { margin-right: 0px; }
	.pointList li h4 { text-align: center; font-weight: bold; font-size: 1.1em; color: var(--base-color); margin-bottom: 10px; display: flex; justify-content: center; align-items: center; flex-direction: column; }
	.pointList li div { width: 60%; margin: 0 auto; margin-bottom: 20px;}
	.pointList li p { font-size: 0.9em; }
}

/*-- faq -------------------------------------------------------------*/
@media screen and (max-width: 767px) {	
	.faqDl { }
	.faqDl dt { background:#f4f4f4; margin-bottom: 10px; font-size: 0.9em; padding:10px 15px; position: relative; cursor: pointer; }
	.faqDl dt:before { content: "Q."; margin-right: 10px; font-family:'Roboto Condensed', sans-serif; font-weight:bold;　font-size:1.2em; color: var(--base-color); }
	.faqDl dt:after { position: absolute; top: 18%; right: 2%; content: "\f067"; font-family: "Font AweSome 5 Free"; font-weight: 900; color: var(--base-color); }
	.faqDl dt.active:after { position: absolute; top: 18%; right: 2%; content: "\f068"; font-family: "Font AweSome 5 Free"; font-weight: 900;  color: var(--base-color); }
	.faqDl dd { padding: 0 20px 20px; font-size: 1.0rem; }
}
@media screen and (min-width: 768px) {	
	.faqDl { }
	.faqDl dt { background:#f4f4f4; margin-bottom: 10px; font-size: 0.9em; padding:10px 15px; position: relative; cursor: pointer; }
	.faqDl dt:before { content: "Q."; margin-right: 10px; font-family:'Roboto Condensed', sans-serif; font-weight:bold;　font-size:1.2em; color: var(--base-color); }
	.faqDl dt:after { position: absolute; top: 18%; right: 2%; content: "\f067"; font-family: "Font AweSome 5 Free"; font-weight: 900; color: var(--base-color); }
	.faqDl dt.active:after { position: absolute; top: 18%; right: 2%; content: "\f068"; font-family: "Font AweSome 5 Free"; font-weight: 900;  color: var(--base-color); }
	.faqDl dd { padding: 0 20px 20px; font-size: 1.0rem; }
}

/*-- list  -------------------------------------------------------------*/
@media screen and (max-width: 767px) {
	.about h4 { color: #2f5597; }
	.strongList { width: 90%; margin: 0 auto;}
	.strongList li { margin: 0 0 40px; position: relative; }
	.listTtl { text-align: center; font-size: 1.05em; margin-bottom: 10px; font-weight: 700; display: flex; justify-content: center; align-items: center; flex-direction: column; flex-wrap: nowrap; line-height: 1.7; position: relative; z-index: 1; color: #2f5597;}
	.listTtl span { display: contents; }
	.strongList li div { margin-bottom: 20px; }
	.sublistTtl { text-align: center; }
}
@media screen and (min-width: 768px) {
	.about h4 { color: #2f5597; }
	.strongList { display: flex; justify-content: center; flex-wrap: wrap; }
	.strongList li { width: 29%; margin: 0 2% 40px; position: relative; }
	.listTtl { text-align: center; font-size: 1.2em; margin-bottom: 20px; font-weight: 700; display: flex; justify-content: center; align-items: center; flex-direction: column; flex-wrap: nowrap; position: relative; z-index: 1; color: #2f5597;}
	.listTtl span { display: contents; }
	.strongList li div { margin-bottom: 20px; }	
	.sublistTtl { text-align: center; }
}
@media screen and (min-width: 768px) and (max-width: 899px) {
	.strongList li { width: 40%; margin: 0 2% 40px; }
	.strongList li:nth-child(3) { width: 40%; margin: 0 30% 40px; }
	.listTtl { font-size: 1.1em; }
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
	.strongList li { width: 40%; margin: 0 2% 40px; }
	.strongList li:nth-child(3) { width: 40%; margin: 0 30% 40px; }
	.listTtl { font-size: 1.1em; }
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
	.listTtl { font-size: 1.1em; }
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
	.listTtl { font-size: 1.1em; }
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
	.listTtl { font-size: 1.1em; }
}
@media screen and (min-width: 1390px) and (max-width: 1489px) {
}
@media screen and (min-width: 1490px) {
}

/*-- Corporate Tbl  -------------------------------------------------------------*/
@media screen and (max-width: 767px) {
	.corpoTbl { width: 100%; }
	.corpoTbl th { background: #2F5597; color: #fff; vertical-align: middle; font-size: 1.1rem; display: block; padding: 6%; }
	.corpoTbl th span { opacity: 0.5; font-family:'Roboto Condensed', sans-serif; display: block; font-size: 0.5em;}
	.corpoTbl td { padding: 6%; display: block; font-size: 0.9rem; }
	.corpoTbl td dl { font-size: 0.9rem; }
	.corpoTbl td dl dt { text-align: center; padding: 4%; background: #f4f4f4; }
	.corpoTbl td dl dd { padding: 4%; }
}
@media screen and (min-width: 768px) {
	.corpoTbl { width: 100%; }
	.corpoTbl th { background: #2F5597; color: #fff; vertical-align: middle; font-size: 1.5rem; width: 24%; }
	.corpoTbl th span { opacity: 0.5; font-family:'Roboto Condensed', sans-serif; display: block; font-size: 0.5em;}
	.corpoTbl td { padding: 0px 20px; }
	.corpoTbl td dl { display: flex; justify-content: flex-start; padding: 5px 0; font-size: 0.9rem; }
	.corpoTbl td dl dt { width: 20%; text-align: center }
	.corpoTbl td dl:nth-child(odd) { background: #f4f4f4; }
}

/*-- works  -------------------------------------------------------------*/
@media screen and (max-width: 767px) {
	.worksList { display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
	.worksList li { width: 48%; margin: 0 1% 20px; }
}
@media screen and (min-width: 768px) {
	.worksList { display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
	.worksList li { width: 21%; margin: 0 2% 40px; }
}

/*-- price  -------------------------------------------------------------*/
@media screen and (max-width: 767px) {
	.price-table { width: 100%; margin-bottom: 20px;}
	.price-table th { padding: 10px; text-align: center; background: #2ebca1; border: 1px solid #d8e9e6; color: #fff; }
	.price-table td { padding: 20px; text-align: left; background: #fff; border: 1px solid #d8e9e6; width: 60%; }
	.price-table td:nth-child(1) { width: 40%; background: #e8fbf8; }
	.priceTtl { text-align: center; font-size: 1.5em; font-weight: 900; margin-bottom: 40px; position: relative; }
	.priceTtl:after { content: ""; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); width: 50px; height: 3px; margin: 0 auto; background: var(--sub-color); }
	
	.costFlex { max-width: 960px; margin: 0 auto; }
	.in-costFlex { margin-bottom: 5vh; }
	.costFlex .number { height: 50px; width: 50px; margin: 0 auto 10px; border-radius: 25px; background:var(--sub-color); color: #fff; display: flex; justify-content: center; align-items: center; outline: 1px solid var(--sub-color); /* 1pxの外枠線 */ outline-offset: 2px; /* 円と外枠の間の隙間の広さ */}
	
	.price-emphasis { font-family: "Oswald", sans-serif; font-weight: 900; font-size: 1.5em; color: #2ebca1; }
}
@media screen and (min-width: 768px) {
	.price-table { width: 100%; margin-bottom: 20px;}
	.price-table th { padding: 10px; text-align: center; background: #2ebca1; border: 1px solid #d8e9e6; color: #fff; }
	.price-table td { padding: 20px; text-align: left; background: #fff; border: 1px solid #d8e9e6; width: 60%; }
	.price-table td:nth-child(1) { width: 40%; background: #e8fbf8; }
	.priceTtl { text-align: center; font-size: 1.5em; font-weight: 900; margin-bottom: 40px; position: relative; }
	.priceTtl:after { content: ""; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); width: 50px; height: 3px; margin: 0 auto; background: var(--sub-color); }
	
	.costFlex { max-width: 960px; margin: 0 auto; }
	.in-costFlex { margin-bottom: 5vh; }
	.costFlex .number { height: 50px; width: 50px; margin: 0 auto 10px; border-radius: 25px; background:var(--sub-color); color: #fff; display: flex; justify-content: center; align-items: center; outline: 1px solid var(--sub-color); /* 1pxの外枠線 */ outline-offset: 2px; /* 円と外枠の間の隙間の広さ */}
	
	.price-emphasis { font-family: "Oswald", sans-serif; font-weight: 900; font-size: 1.5em; color: #2ebca1; }
}


/*-- asc  -------------------------------------------------------------*/
@media screen and (max-width: 767px) {
	.midashi { font-size: 1.2em; font-weight: bold; text-align: center; margin-bottom: 2vh;}
	.midashi02 { font-size: 1.2em; font-weight: bold; text-align: center; margin-top: 0vh;}
	
	.flexL_ttl { font-size: 1.1em; margin-bottom: 20px; font-weight: bold; }
	.ytDl { display: flex; justify-content: flex-start; margin-bottom: 20px; }
	.ytDl dt { background: var(--base-color); color: #fff; padding: 5px 10px; font-size: 0.9em; word-break: keep-all; white-space: nowrap; }
	.ytDl dd { color: #000; padding: 5px 10px; font-size: 0.9em; }
	
	.photoFlex { display: flex; justify-content: center; flex-wrap: wrap; }
	.photoFlex li { width: 50%; margin: 0;}
	.photoFlex li:nth-child(3) { width: 100%; }
}
@media screen and (min-width: 768px) {
	.midashi { font-size: 1.5em; font-weight: bold; text-align: center; margin-bottom: 5vh;}
	.midashi02 { font-size: 1.5em; font-weight: bold; text-align: center; margin-top: 5vh;}
	
	.photoFlex { display: flex; justify-content: center; }
	.photoFlex li { margin: 0 0.25%;}
	
	.flexL_ttl { font-size: 1.5em; margin-bottom: 20px; font-weight: bold; }
	.ytDl { display: flex; justify-content: flex-start; margin-bottom: 20px; }
	.ytDl dt { background: var(--base-color); color: #fff; padding: 5px 10px; text-align: center; font-size: 0.9em; white-space: nowrap; display: flex; justify-content: center; align-items: center; }
	.ytDl dd { color: #000; padding: 5px 20px; }
}
@media screen and (min-width: 768px) and (max-width: 899px) {
	.flexL_ttl { font-size: 1.5em; margin-bottom: 20px; font-weight: bold; text-align: center; }
	.ytDl dt { padding: 5px 10px; font-size: 0.9em; word-break: keep-all; white-space: nowrap; }
	.ytDl dd { padding: 5px 10px; font-size: 0.9em; }
	.tab_alC { text-align: center; }
}

@media screen and (max-width: 767px) {
.ruled-line {
	width: 90%;
	max-width: 700px;
	margin: 0 auto;
	font-size: 15px;
	line-height: 2.3;
	background-image: linear-gradient(180deg, #ddd 1px, transparent 1px);
	background-size: 100% 2.3em;
	background-position: bottom 1px center;
	text-align: left !important;
}
}
@media screen and (min-width: 768px) {
.ruled-line {
  width: 80%;
  max-width: 700px;
  margin: 0 auto;
  font-size: 20px;
  line-height: 2.3;
  background-image: linear-gradient(180deg, #ddd 1px, transparent 1px);
  background-size: 100% 2.3em;
  background-position: bottom 1px center;
}
}