@charset "UTF-8";

header { position: relative; }
/*.grad { background-image: linear-gradient(90deg, rgba(4, 202, 255, 1), rgba(144, 245, 154, 1)); }*/
.grad { background-image: linear-gradient(90deg, rgba(46, 188, 161, 1), rgba(70, 227, 197, 1)); }
.grad-opa { background-image: linear-gradient(90deg, rgba(46, 188, 161, 1), rgba(70, 227, 197, 0.8)); }
@media screen and (max-width: 767px) {
	header { background: url("../img/common/mainBg.png") center center no-repeat; background-size: cover; position: relative; }
	header .in { background: url("../img/common/mv_sp.png") top center no-repeat; background-size: contain; margin: 0; }
	.headline { position: relative; margin: 0 auto; width: 90%; height: 90vh; z-index: 2; }
	.mainCopy { position: absolute; bottom: 6%; left: 50%; transform: translateX(-50%); width: 100%; margin: 0 auto; }
	.mainCopy .keybox { width: 20vw; margin-right: 4%; }
	.mainCopy .mainCopyTxt {  }
	.mainCopy .mainCopyTxt .tab { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 10px; flex-wrap: wrap; transform: skewY(-3deg); }
	.mainCopy .mainCopyTxt .tab li { background: #ff7878; padding: 2px 20px; color: #fff; margin-right: 1%; white-space: nowrap; font-size: 0.8em; margin-bottom: 5px; }
	.mainCopy .mainCopyTxt h1 { font-size: 1.8em; background-image: linear-gradient(90deg, rgba(46, 188, 161, 1), rgba(70, 227, 197, 0.95)); color: #fff; padding: 10px 20px; white-space: nowrap; font-weight: bold; line-height: 1.5; margin-bottom: 10px; transform: skewY(-3deg); }
	.mainCopy .mainCopyTxt h1 span { font-size: 0.4em; display: block; margin-left: 0.5em;  }
	.mainCopy .mainCopyTxt h2 { font-size: 0.9em; background-image: linear-gradient(90deg, rgba(46, 188, 161, 1), rgba(70, 227, 197, 0.95)); color: #fff; padding: 10px 20px; font-weight: bold; margin-bottom: 40px; text-align: center; transform: skewY(-3deg); }
	.mainCopy .mainCopyTxt .keni { display: flex; justify-content: flex-start; align-items: center; }
	.mainCopy .mainCopyTxt .keni li { margin-right: 2%; }
	.mainCopy .keyList { width: 80%; margin: 0 auto; }
	.mainCopy .keyList li { }
	.mainCopy .keyList li .txt { display: none; }
	.mainCopy .keyList li .roboto { display: flex; justify-content: center; align-items: center; }
	.mainCopy .keyList li h4 { width: 100%; }
}
@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 { background: url("../img/common/mainBg.png") center center no-repeat; background-size: cover; position: relative; }
	header .in { background: url("../img/common/mv_pc.png") center right no-repeat; background-size: cover; }
	.mvImage { width: 80%; margin: 0 0 0 20%; position: absolute; top: 0; right: 0; }
	.headline { position: relative; max-width: 1280px; margin: 0 auto; width: 100%; height: 90vh; z-index: 2; }
	.mainCopy { position: absolute; top: 50%; left: 4%; transform: translateY(-50%); width: 760px; }
	.mainCopy .keybox { width: 20vw; margin-right: 4%; }
	.mainCopy .mainCopyTxt {  }
	.mainCopy .mainCopyTxt .tab { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 10px; transform: skewY(-3deg); }
	.mainCopy .mainCopyTxt .tab li { background: #ff7878; padding: 2px 20px; color: #fff; margin-right: 1%; white-space: nowrap; }
	.mainCopy .mainCopyTxt h1 { font-size: 3.0em; background-image: linear-gradient(90deg, rgba(46, 188, 161, 1), rgba(70, 227, 197, 0.95)); color: #fff; padding: 10px 20px; white-space: nowrap; font-weight: bold; line-height: 1.5; margin-bottom: 10px; transform: skewY(-3deg); }
	.mainCopy .mainCopyTxt h1 span { font-size: 0.4em; display: block; margin-left: 0.5em;  }
	.mainCopy .mainCopyTxt h2 { font-size: 1.2em; background-image: linear-gradient(90deg, rgba(46, 188, 161, 1), rgba(70, 227, 197, 0.95)); color: #fff; padding: 10px 20px; white-space: nowrap; font-weight: bold; margin-bottom: 50px; transform: skewY(-3deg);}
	.mainCopy .mainCopyTxt .keni { display: flex; justify-content: flex-start; align-items: center; }
	.mainCopy .mainCopyTxt .keni li { margin-right: 2%; }
	/*.mainCopy .keyList { transform: skewY(-3deg); }*/
}
@media screen and (min-width: 768px) and (max-width: 899px) {
	.headline { height: 80vh; }
	header .in { background: url("../img/common/mv_tab.png") center right no-repeat; background-size: cover; }
	.mainCopy { width: 60%; }
	.mainCopy .mainCopyTxt .tab { flex-wrap: wrap; }
	.mainCopy .mainCopyTxt h1 { font-size: 2.4em; }
	.mainCopy .mainCopyTxt h2 { font-size: 1.0em; white-space: inherit; }
	.mainCopy .keyList li h4 { font-size: 0.9em; }
	.mainCopy .keyList li .txt { font-size: 0.8em; }
	.mainCopy .mainCopyTxt .tab li { font-size: 0.9em; }
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
	.headline { height: 80vh; }
	header .in { background: url("../img/common/mv_tab.png") center right no-repeat; background-size: cover; }
	.mainCopy { width: 600px; }
	.mainCopy .mainCopyTxt h1 { font-size: 2.6em; }
	.mainCopy .mainCopyTxt h2 { font-size: 1.0em; white-space: inherit; }
	.mainCopy .mainCopyTxt .tab li { font-size: 0.95em; }
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
	.headline { height: 80vh; }
	.mainCopy { width: 600px; }
	.mainCopy .mainCopyTxt h1 { font-size: 2.8em; }
	.mainCopy .mainCopyTxt h2 { font-size: 1.0em; }
	.mainCopy .mainCopyTxt .tab li { font-size: 0.95em; }
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
	.headline { height: 80vh; }
	.mainCopy { width: 700px; }
	.mainCopy .mainCopyTxt h2 { font-size: 1.15em; }
}
@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: #fffcf6; position: relative; }
.section-nayami .in { position: relative; z-index: 10;}
@media screen and (max-width: 599px) {
	section .in { padding: 6%; }
	.section-nayami:after { width: 100%; height: 100%; content: ""; background: #f7f4e6; 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-keybox { position: relative; }
	.section-keybox: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; }
}
@media screen and (min-width: 600px) {
	.section-nayami:after { width: 100%; height: 100%; content: ""; background: #f7f4e6; 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-keybox { position: relative; }
	.section-keybox: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; }
}

/*-- タイトル -------------------------------------------------------------*/
@media screen and (max-width: 1089px) {
	.ttl01 { text-align: center; margin-bottom: 20px; font-weight: bold; font-size: 1.5em; 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: 100px; margin: 0 auto 20px; }
	.nayami img { mix-blend-mode: multiply; }
	.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: 150px; margin: 0 auto 20px;}
	.ttl01 { font-size: 1.3rem; }
}
@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: 180px; margin: 0 auto 20px; }
	.nayami img { mix-blend-mode: multiply; }
	.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) {
	.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;
	}
}

/*-- ポイント -------------------------------------------------------------*/
@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-image: linear-gradient(90deg, rgba(46, 188, 161, 1), rgba(70, 227, 197, 1)); 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-Img:after { content: ""; position: absolute; top: -4%; left: -4%; background: var(--opa-color); width: 96%; height: 100%; z-index: -1; border-radius: 8px; }*/
	.checkList li { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px dotted #dedede; }
	.checkList li:before { content: "├"; margin-right: 0.5em;}
	
	.keyList { }
	.keyList li { margin-bottom: 10px; display: flex; justify-content: flex-start; align-items: center; }
	.keyList li .roboto { background: var(--sub-color); color: #fff; text-align: center; padding: 1px 10px; margin-bottom: 0px; font-size: 0.8rem;}
	.keyList li h4 { color: var(--sub-color); margin-bottom: 0px; text-align: center; font-weight: bold; background: #fff; padding: 10px;  }
	.keyList li h4 span { font-size: 0.7em; display: block; font-weight: normal; }
	.keyList li .txt { padding: 10px 20px 20px;; background: #fff; color: #000; font-size: 0.9em; }
	
	.keyList02 li { display: block; }
	.keyList02 li h4 { padding: 10px 0 0;}
}
@media screen and (min-width: 768px) {
	.in-flex { display: flex; justify-content: space-between; align-items: center; margin-bottom: 5vh; }
	.in-flex:last-child { margin-bottom: 0px; }
	.in-flex .in-flex-Img { width: 40%; position: relative; }
	.in-flex .in-flex-Txt { width: 56%; }
	.in-flex .in-flex-Txt .ttl01 { text-align: left; margin-bottom: 10px; }
	.pointDl { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 10px; }
	.pointDl dt { background-image: linear-gradient(90deg, rgba(46, 188, 161, 1), rgba(70, 227, 197, 1)); color: #fff; padding: 1px 10px;}
	.pointDl dd { padding: 1px 10px; }
	.pointDl dd .roboto { font-size: 1.5em; margin: 0 2px; }
	/*.in-flex .in-flex-Img:after { content: ""; position: absolute; top: -4%; left: -4%; background: var(--opa-color); width: 96%; height: 100%; z-index: -1; border-radius: 8px; }*/
	.checkList li { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px dotted #dedede; }
	.checkList li:before { content: "├"; margin-right: 0.5em;}
	
	.keyList { display: flex; justify-content: space-between; }
	.keyList li { width: 31%; }
	.keyList li .roboto { background: var(--sub-color); color: #fff; text-align: center; padding: 1px 10px; margin-bottom: 0px; font-size: 0.8rem;}
	.keyList li h4 { color: var(--sub-color); margin-bottom: 0px; text-align: center; font-weight: bold; background: #fff; padding: 10px 10px 0;  }
	.keyList li h4 span { font-size: 0.7em; display: block; font-weight: normal; }
	.keyList li .txt { padding: 10px 20px 20px; background: #fff; color: #000; font-size: 0.9em; }
	.in-flex .keyList li .txt { padding: 0px; font-size: 0.9em; }
	.keyList02 li h4 { padding: 10px 0; }
}
@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%; }
	
	#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:url("../img/common/kikaBg.jpg") center center no-repeat; background-size: cover; padding: 2.5vh 0;}
.cv-section p { color: #fff; font-size: 1.1em; }
@media screen and (max-width: 599px) {
	.cv-section { padding: 2.5vh 0;}
	.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:#000; text-decoration: none; }
		.contact-list li.list-form a:visited { color:#000; text-decoration: none; }
		.contact-list li.list-form a:hover   { color:#000; text-decoration: none; background:#fff; }
		.contact-list li.list-form a:active  { color:#000; 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) {	
	.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) 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: "\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.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; }
	.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:#000; text-decoration: none; }
		.contact-list li.list-form a:visited { color:#000; text-decoration: none; }
		.contact-list li.list-form a:hover   { color:#000; text-decoration: none; background:#fff; border-radius: 6px; }
		.contact-list li.list-form a:active  { color:#000; 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; }
	
	.imgFlex { display: flex; justify-content: center;}
	
	.dashBox { margin: 6%; width: 88%; /*border: 1px dashed #333; border-radius: 8px;*/ }
	.dashBox .dashTtl { margin-bottom: 20px; background: var(--base-color); color: #fff; padding: 10px 20px; text-align: left;}
	.dashBox p { margin-bottom: 0px; }
}
@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; }
	
	.imgFlex { display: flex; justify-content: center;}
	
	.dashBox { max-width: 960px; margin: 0 auto; width: 90%; /*padding: 20px; border: 1px dashed #333; border-radius: 8px;*/ }
	.dashBox .dashTtl { margin-bottom: 20px; background: var(--base-color); color: #fff; padding: 10px 20px; text-align: center;}
	.dashBox p { margin-bottom: 0px; }
}

/*-- ポイント -------------------------------------------------------------*/
@media screen and (max-width: 767px) {
	.in-flex_opello .in-flex-Img { width: 100%; position: relative; order: 1; margin-bottom: 20px; }
	.in-flex_opello .in-flex-Txt { width: 100%; order: 2; }
	.in-flex-half { margin-bottom: 20px;}
}
@media screen and (min-width: 768px) {
	.in-flex_opello .in-flex-Img { width: 30%; position: relative; }
	.in-flex_opello .in-flex-Txt { width: 66%; }
	
	.in-flex-half { width: 48%; }
}
@media screen and (min-width: 768px) and (max-width: 889px)  {	
	.in-flex_opello .in-flex-Img { width: 46%; }
	.in-flex_opello .in-flex-Txt { width: 50%; }
}
@media screen and (min-width: 900px) and (max-width: 1089px)  {
	.in-flex_opello .in-flex-Img { width: 44%; }
	.in-flex_opello .in-flex-Txt { width: 52%; }
}
@media screen and (min-width: 1090px) and (max-width: 1189px)  {
	.in-flex_opello .in-flex-Img { width: 42%; }
	.in-flex_opello .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)  {
}



