@charset "UTF-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;600;700;900&family=Rubik:wght@500&display=swap');

.rubik{font-family: 'Rubik', sans-serif;}

.bgWH {background-color: #FFF;}
.bgYE{background-color: #FDA500;}
.bgBLA{background-color: #222222;}
.bgGRE{background-color: #2AAB9F;}
.bgGRY{background-color: #F1F1F1;}
.txtWH {color: #FFF;}
.txtGRE {color: #2AAB9F;}
.txtORE {color: #FDA500;}
.txtRED {color: #EE0000;}
.txtBLU {color: #0F3568;text-decoration: underline;}
.txtGRA {color: #666;}
.borGRE{border: solid 1px #2AAB9F;}
.underB{border-bottom:1px solid #222222;}

.w200 { max-width: 200px; width: 100%;border-radius: 30px;}
.w250 { max-width: 250px; width: 100%;border-radius: 30px;}
.w240 { max-width: 240px; width: 100%;}
.w768 { max-width: 768px; width: 100%;margin:0 auto;}

#page-top {position: fixed;bottom: 40px;right: 40px;width: 60px; z-index:400;}
@media screen and (max-width: 896px) {
	#page-top {position: fixed;bottom: 5px;right: 5px;width: 30px; z-index:400;}
}

.ratioBox {position: relative;width: 100%;height: auto;}
.ratio1-1:before {content: "";display: block;padding-top: 100%; /* 1:1 */}
.ratio2-1:before {content: "";display: block;padding-top: 50%; /* 2:1 */}
.ratio3-2:before {content: "";display: block;padding-top: 66%; /* 3:2 */}
.ratio4-3:before{ content: "";display: block;padding-top: 75%; /* 4:3 */}
.ratioInner {position: absolute;top: 0; left: 0;width: 100%;height: 100%;}

.slideInup {opacity: 0; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-transform: translateY(60px); -ms-transform: translateY(60px); transform: translateY(60px);}
.slideInup.appear {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0);}
.fadeIn {opacity: 0; transition: all 1s;}
.fadeIn.appear {opacity: 1;}
.delay01 {transition-delay: .2s;}
.delay02 {transition-delay: .4s;}
.delay03 {transition-delay: .6s;}
.delay04 {transition-delay: .8s;}
.delay05 {transition-delay: 1s;}

@keyframes DownAnime{
  from {opacity: 0; transform: translateY(-100px);}
  to {opacity: 1; transform: translateY(0);}
}

header {z-index: 8; position: absolute; width: 100%; background: #FFF; padding:35px 40px 40px 40px; display: flex; flex-wrap: nowrap;}
#under header {box-shadow: 0 3px 6px rgb(0 0 0 / 30%); position: absolute; z-index: 1;}

#header h1 {max-width: 300px;}
#header.fixed {position: fixed; top: 0; z-index: 10; padding: 15px 40px; background: rgba(255,255,255,.8); animation: DownAnime 0.5s forwards; box-shadow: 0 3px 6px rgb(0 0 0 / 30%);}
#header.fixed h1 {width: 262px;}
.logoImg { /*max-width: 240px;*/}
.navArea{ /*width: calc(100% - 324px - 40px);*/ }
.navR{width: calc(100% - 300px); display: flex; flex-wrap: nowrap;}
.navR .gap{ gap:30px;}
.global_menu {/*visibility: hidden;*/ height: 100%; position: fixed; top: 0; left:0; color: #222; /*overflow-y: scroll;*/ text-align: center;}
.global_menu a {display: block; width: 100%; padding: 0 10px; color: #222222; box-shadow: inset 0 0 0 0 #2AAB9F; transition: color .3s ease-in-out, box-shadow .3s ease-in-out;}
.global_menu a:hover { color: #fff; box-shadow: inset 200px 0 0 0 #2AAB9F;}
.global_menu a.externalLink::after {content:""; display: inline-block;width:14px;height:14px;background: url("../img/cmn/link.svg");margin-left: 5px;}
.global_menu a.externalLink:hover::after {background: url("../img/cmn/link_wh.svg");}
#header .cmnBtn {background:white; box-shadow: none; margin: 0 0 0 12px; border: solid 3px #2AAB9F;}
#header .cmnBtn:hover { background:#E6F8F6; color:#2AAB9F;}
#header .cmnBtn2 {display: block; padding: 20px 0; text-align: center; background:#FDA500; transition: all 0.3s ease 0s; margin: 0 0 0 15px; border-radius: 30px;box-shadow: 2px 2px 3px rgb(0 0 0 / 40%);}
#header .cmnBtn2:hover {	color:white;background:#FD6729; }
#header .loginBtn {display: block; padding:0; text-align: center; transition: all 0.3s ease 0s; margin: 0 0 0 15px; color:#FDA500;}
#header .loginBtn svg {margin-bottom: 5px;}
#header .loginBtn .path {transition: fill 0.3s;}
#header .loginBtn:hover{color: #FD6729;}
#header .loginBtn:hover .path {fill: #FD6729;}
#header .pcOnly{margin-top: 1%;}

/*.menu_wrap{ gap: 30px;} */
.menu {font-size: 18px; font-weight: 700; white-space: nowrap;transition:all 1s; margin: 0 5px;}
#hanburger {display: none;}
#hanburger:checked ~ .menu_button {top: 0; right: 0; background: transparent;}
#hanburger:checked ~ .span2 {display: none;}
#hanburger:checked ~ .span1 {width: 32px; transform: rotate(45deg); top: 26px; right: 10px;}
#hanburger:checked ~ .span3 {width: 32px; transform: rotate(-45deg); top: 26px; right: 10px;}
#hanburger:checked ~ .global_menu {visibility: visible;}
#hanburger,.spOnly {display: none;}
.navR .w250 {margin-left: 15px;}
.menu_button {width: 50px; height: 50px; position: fixed; top: 0; right: 0; background: #2AAB9F; z-index: 15;}
.mailBtn{  width: 50px; height: 50px; line-height:50px; position: fixed; top: 0; right: 50px; z-index: 2; }
.mailBtn img{  width: 18px; height: 18px;     vertical-align: middle;}
@media screen and (max-width: 1080px) {
	header { padding: 30px 15px; }
	.logoImg { max-width: 200px;}
	.navR {  width: calc(100% - 200px);}
	.menu_wrap { gap: 10px;}
}
@media screen and (min-width: 897px) {
  .global_menu {position: inherit; padding: 0; color: #0B4DA0; visibility: visible; overflow-y: visible; height: auto;}
  .menu:hover .child_menu {visibility: visible; top: 81px; opacity: 1;}
  .child_menu {width: 100%; position: absolute; top: 0; left: 0; padding: 10px; color: #FFF; background: #1B2B78; visibility: hidden; opacity: 0; transition: .5s top, .5s opacity; z-index: 10;}
  .child_menu > li {display: inline-block; margin: 0 10px; background: #FFF;}
  .child_menu > li a {padding: 10px 20px; border: 1px solid #FFF; transition: .5s all;}
  .child_menu > li a:hover {background: #1B2B78; color: #FFF;}
  .child_menu > li > ul > li a {padding: 10px; position: relative;}
  .menu_button {display: none;}
}
@media screen and (max-width: 896px) {
  .pcOnly {display: none;}
  #header .spOnly,.spOnly {display: block;}
  header { padding: 10px 15px; height: 50px;}  
  header h1 {padding: 0;}
  span.span1,span.span2,span.span3 {width: 30px; height: 1px; background-color: #FFF; right: 10px; transition: .3s; z-index: 100; position: fixed;}
  .span1 {top: 17px;}
  .span2 {top: 25px;}
  .span3 {top: 33px;}
  #hanburger:checked .global_menu {visibility: visible;}
  .global_menu {z-index: 10;}
  #header .global_menu .cmnBtn{border:0; background: #FDA500; text-align: center; width: 90%; margin-left: 5%!important;}
  .menu {display: block; font-size: 16px;}
  .menu > label:hover {cursor: pointer; cursor: hand;}
  .menu input[type="checkbox"]:checked ~ .child_menu {max-height: inherit!important; overflow-y: visible; visibility: visible!important;}
  .menu > a {padding: 10px 20px; text-align: left; border-bottom: 1px solid #FFFFFF; font-weight: 400; }
  .menu:last-of-type > a {padding: 15px 20px; border-bottom: 0px; text-align: center; font-weight: 700; margin: 3% auto 0; width: 80%; background: #FDA500; border-radius: 50px;}
  .menu:last-of-type > a:hover {box-shadow: none;}
  .menu > a span {margin-right: 10px; width: 30px!important;}
  .menu > a span img {width: 100%;}
  .menu .pd {display: inline-block; width: 100%; position: absolute; top: 0; left: 0; height: 100%;}
  .menu .child_menu {border-top: 1px solid #DDD; position: relative; opacity: 1; top: 0; margin-left: auto; left: auto; width: auto;}
  .child_menu li {display: block;}
  .child_menu > li > a,.child_menu > li > ul > li a {padding: 10px 15px; color: #222; text-align: left; border-bottom: 1px dotted #999;}
  .child_menu > li > ul > li a {padding: 15px 20px 15px 35px; position: relative;}
  .child_menu > li > ul > li:last-child a {border-bottom: 1px solid #CCC;}
  .child_menu > li > ul > li a::before {border-top: solid 1px #222; content: ''; left: 20px; position: absolute; top: 50%; width: 10px;}
  .child_menu li {display: block;}
  .menu_wrap {display: none;}
  #hanburger:checked ~ * .menu_wrap {width: 100%; display: block; opacity: 1; min-height: 100vh; background:#2AAB9F; position: fixed; top: 0; z-index: 5;}
  #hanburger:checked ~ * .menu {max-height: inherit; overflow-y: visible; padding: 0; margin-left: 0; position: relative;}
	#hanburger:checked ~ * .menu:first-child img{ max-width:158px;} 	
  #hanburger:checked ~ * .menu a { color: white;}
  #hanburger:checked ~ * .child_menu {max-height: 0; overflow-y: hidden; visibility: hidden; text-align: left;}
}

#ft_cvArea{background: url(../img/cmn/ft_cv_bg.png) no-repeat center; background-size: cover; padding: 80px 0;}
#ft_cvArea .fv_cvInner{border-radius: 10px; box-shadow: 2px 2px 3px rgb(0 0 0 / 40%); overflow: visible; padding: 30px; display: flex; justify-content: center;}
#ft_cvArea .fv_cvInner img{width: 372px; height: auto; margin-top: -70px;}
#ft_cvArea .fv_cvInner .cmnBtn{width: 410px; border-radius: 50px; margin-left: 0;}
#ft_cvArea .fv_cvInner .cmnBtn:hover{background: #FD6729;}

#ft_cvArea_3box{background: url(../img/cmn/ft_cv_bg.png) no-repeat center; background-size: cover; padding: 80px 0;}
#ft_cvArea_3box .cv_3box{
	border-radius: 10px;
	padding: 40px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	width: calc(32% - 10px);
	justify-content: center;
}
#ft_cvArea_3box .cv_3box h3{
	flex-grow: 1;
	align-items: center;
	display: flex;
	justify-content: center;
}

#ft_cvArea_3box .cv_3box .cmnBtn{
	display: block;
	max-width: 100%;
	width: 400px;
	margin: 30px auto 0;
	border-radius: 50px;
}
#ft_cvArea_3box .cv_3box:last-of-type .cmnBtn{
	background: #fff;
	border: 3px solid #2AAB9F;
}
#ft_cvArea_3box .cv_3box .cmnBtn:hover{
	background: #FD6729;
}
#ft_cvArea_3box .cv_3box:last-of-type .cmnBtn:hover{
	background: #E6F8F6;
	color:#2AAB9F;
}

@media screen and (max-width: 1080px) {
	#ft_cvArea .fv_cvInner .txt24{font-size: 1.8vw;}
	#ft_cvArea .fv_cvInner .cmnBtn{font-size: 3vw; width: 100%;}
}
@media screen and (max-width: 896px) {
	#ft_cvArea .fv_cvInner .txt24{font-size: 20px;}
	#ft_cvArea .fv_cvInner .cmnBtn{font-size: 24px;}
	#ft_cvArea .fv_cvInner{padding: 30px; flex-direction: column;}
	#ft_cvArea .fv_cvInner img{width: 60%; height: auto; margin: -70px auto 0;}
	.fv_cvInner_3box .cv_3box {width: calc(100% - 40px)!important; margin: 0 auto 37px;}
	.fv_cvInner_3box .cv_3box:last-of-type {margin-bottom: 0;}

}

footer {background: url(../img/cmn/footerbg.jpg) no-repeat center center; background-size: cover;}
.footerArea {padding: 50px 0 40px 0;}
.footerArea nav {border-bottom: solid 1px white;}
.footerArea nav li {padding: 0 20px; border-right: 1px solid white;}
.footerArea nav li:first-child{padding-left: 0;}
.footerArea nav li:last-child{border-right: 0; padding-right: 0;}
.footerLogo {padding: 45px 0 40px 0;}
.footerLogo {width: 357px; margin: 0 auto;}
.footCopy {text-align: center;}
.footCopy small {font-size: 14px; line-height: 1.2;}
@media screen and (max-width: 568px) {
	footer { background: url(../img/cmn/footerbg_sp.jpg) no-repeat center center; background-size: cover;}
	.footerArea {padding: 40px 0;}
	.footerLogo {border-top: 1px solid #FFF; margin: 0; padding: 30px 0 20px; width: 100%;}
	.footerLogo a {width: 357px; margin: 0 auto;}
	.footerArea nav {font-size: 14px; padding-bottom: 25px; max-width: 315px; margin: 0 auto; border-bottom: none;}
	.footerArea nav li {margin: 0 0 15px 0;}
	.footerArea nav li:first-child {padding-left: 20px; border-left: 1px solid #FFF;}
	.footerArea nav li:nth-child(3),.footerArea nav li:nth-child(4),.footerArea nav li:nth-child(6),.footerArea nav li:nth-child(8) {border-left: 1px solid #FFF;}
	.footerArea nav li:last-child {border-right: 1px solid #FFF; padding-right: 20px;}
	.footerLogo img { max-width: 203px;}
	.footCopy small {font-size: 10px;}
}

/* 202503_追加 */
.footerTop{display: flex; justify-content: space-between; padding: 40px 0;}
.footerTop .footerNav_r{display: flex; gap: 30px; width: 50%;}
.footerTop .footerNav_r ul{width: 100%; line-height: 1.4em;}
.footerTop .footerNav_r ul ol{border-bottom: 1px solid #707070; padding-bottom:12px; margin-bottom: 12px;}
.footerTop .footerNav_r ul li{    
	width: 46%;
    line-height: 1.4em;
    padding: 8px 0 8px 20px;
    background: url(../img/cmn/footer_li.svg) no-repeat left 0 top 50%;
    display: inline-block;
    box-sizing: border-box;
}
.footerLogoarea{display: flex; flex-direction: column; gap: 20px; align-items: flex-end; width: 50%;}
.footerLogoarea > div{display: flex; justify-content: flex-end; gap: 10px; width: 100%;}
.footerLogoarea .footerBtn{width: calc( 45% - 10px );}
.footerLogoarea .cmnBtn {
    background: white;
    box-shadow: none;
    margin: 0 0 0 12px;
    border: solid 3px #2AAB9F;
	transition: .3s;
}
.footerLogoarea .cmnBtn:hover {
    background: #E6F8F6;
    color: #2AAB9F;
}
.footerLogoarea .cmnBtn2 {
    display: block;
    padding: 20px 0;
    text-align: center;
    background: #FDA500;
    transition: all 0.3sease 0s;
    margin: 0 0 0 15px;
    border-radius: 30px;
	transition: .3s;
}
.footerLogoarea .cmnBtn2:hover {color: white; background: #FD6729;}
.footer_line{border-top: 1px solid #707070; width: 100vw;}
.footerBottom{display: flex; justify-content: space-between; padding: 40px 0; gap: 40px; align-items: center;}
.footerBottom ul{display: flex; gap: 15px;}
.footerBottom ul li{ border-right: 1px solid #707070; padding-right: 15px;}
.footerBottom ul li:last-of-type{ border-right: 0;}

@media screen and (max-width: 896px) {
	.footerTop{flex-direction: column-reverse; gap: 40px; justify-content: center;}
	.footerBottom{flex-direction: column; width: 90%; margin: 0 auto;}
	.footerTop .footerNav_r{width: 90%; margin: 0 auto;}
	.footerLogoarea{width: 90%; margin: 0 auto; align-items: center;}
	.footerLogoarea > div{justify-content: center;}
	.footerBottom ul{flex-wrap: wrap;}
}

@media screen and (max-width: 568px) {
	.footerLogoarea > div {flex-direction: column; gap: 20px; align-items: center;}
	.footerLogoarea .footerBtn{width: 80%; max-width: 100%; margin: 0 auto;}
	.footerTop .footerNav_r {flex-direction: column;}
}

.w1300 {width: 100%; max-width: 1332px; padding-left: 0; padding-right: 0;}
.w1500 {width: 100%; max-width: 1520px; padding-left: 0; padding-right: 0;}
.container {width: calc(100% - 40px); max-width: 1212px; padding-left: 0; padding-right: 0;}
.containers {width: calc(100% - 40px); max-width: 808px; padding-left: 0; padding-right: 0;}
.mlr,.container,.containers {margin-left: auto!important; margin-right: auto!important;}
.mlr5 {margin-left: 5px; margin-right: 5px;}
.mlr20,.col1,.col2,.col3,.col4,.col5,.col6 {margin-left: 20px; margin-right: 20px;}
.col1 {width: calc(100%/6 - 40px);}
.col2 {width: calc(100%/3 - 40px);}
.col3 {width: calc(50% - 40px);}
.col4 {width: calc(100%/1.5 - 40px);}
.col5 {width: calc(100%/1.2 - 40px);}
.col6 {width: calc(100% - 40px);}
.box4 {width: calc(25% - 30px); margin-left: 15px; margin-right: 15px;}
.w300 {max-width: 300px; width: 100%;}
.w500 {max-width: 500px; width: 100%;}
.w25 {width: 25%;}
.w50 {width: 50%;}
.w75 {width: 75%;}

@media screen and (max-width: 896px) {
  .container,.containers {width: calc(100% - 20px);}
  .mlr20,.col1,.col2,.col3,.col4,.col5,.col6,.box3 {margin-left: 10px; margin-right: 10px;}
  .mlr5 {margin-left: 0; margin-right: 0;}
  .col1 {width: calc(100%/6 - 20px);}
  .col2 {width: calc(100%/3 - 20px);}
  .col3 {width: calc(50% - 20px);}
  .col4 {width: calc(100%/1.5 - 20px);}
  .col5 {width: calc(100%/1.2 - 20px);}
  .col6 {width: calc(100% - 20px);}
  .box4 {width: calc(25% - 20px); margin-left: 10px; margin-right: 10px;}
}
@media screen and (max-width: 568px) {
  .col1 {width: calc(100%/3 - 20px);}
  .col2,.col3,.col4,.col5,.col6 {width: calc(100% - 20px);}
  .box4 {width: calc(50% - 20px);}
}

ul.dot {list-style: disc; margin-left: 1.5em;}
ul.num {list-style: decimal; margin-left: 1.5em;}
.btnCmn {display: block; width: 100%; padding: 12px 32px; text-align: center; border: 1px solid #222; border-radius: 40px; color: #222; background: #FFF url("../img/cmn/arrow.svg") no-repeat right 20px center; transition: .3s;}
.btnCmn:hover {background: #222 url("../img/cmn/arrow_wh.svg") no-repeat right 10px center; color: #FFF;}

/*------------------------------------------------------

共通

------------------------------------------------------*/
/*-- 三角背景 --*/
#top01::before,#top03::before,#top04_btm::before {content: ''; position: absolute; z-index: 0; bottom: 0;left: 0; border-bottom: 150px solid #2AAB9F;  border-right: 100vw solid transparent; }
#top02::before,#top04::before {content: ''; position: absolute; z-index: 0; bottom: -75px; right: 0; border-top: 150px solid #2AAB9F;  border-left: 100vw solid transparent; }

/*-- ボタンホバー --*/
.cmnBtn {display: block; padding: 20px 0; text-align: center; background:#FDA500; transition: all 0.3s ease 0s; margin: 0 auto; border-radius: 30px; box-shadow: 2px 2px 3px rgb(0 0 0 / 40%);}
.cmnBtn:hover {	color:white;background:#0B8379; }

/*-- 拡大ホバー --*/
.picCard .scaleImg {  overflow:hidden;}
.picCard .scaleImg img { transition:transform 0.3s;}
.picCard .scaleImg:hover img { transform:scale(1.2);}

/*-- カードホップ --*/
.cardHop { transition:box-shadow 0.3s, transform 0.3s;}
.cardHop::before { content:""; position:absolute; top:0; left:0; display:block; transition:box-shadow 0.3s; }
.cardHop:hover { box-shadow:0 2px 5px rgba(0, 0, 0, 0.3); transform:scale(1.03);}


/*-- 見出し --*/
.bothLine{ display: flex; align-items: center;  justify-content: center; }
.bothLine:before, .bothLine:after { border-top: 3px solid white; content: ""; width: 7vw;}
.bothLine:before {margin-right: 0.6vw;}
.bothLine:after {margin-left: 0.6vw;}
.diagonalLine::before,.diagonalLine::after{content:"/";}
.diagonalLine::before{ margin-right:10px;}
.diagonalLine::after{ margin-left:10px;}

.doubleDiagonalLine::before{ content:"";display:inline-block;width:33.28px;height:38.81px; background:url(../img/top/02-02.svg) no-repeat center center; background-size: cover; margin-right: 15px;}
.doubleDiagonalLine::after{ content:"";display:inline-block;width:33.28px;height:38.81px; background:url(../img/top/02-03.svg) no-repeat center center; background-size: cover; margin-left: 15px;}

.speechBubble { display: table; margin:0 auto 10px auto; padding: 5px 30px; background: #222222; color:white; border-radius: 5px;}
.speechBubble:before { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -15px; border: 15px solid transparent; border-top: 12px solid #222222; display: table-cell; vertical-align: middle;}
@media screen and (max-width: 986px) {
	.spFlexCol{flex-direction: column;	gap: 40px 0;}
	.spFlexColrev{flex-direction: column-reverse; gap: 40px 0; }
}
@media screen and (max-width: 568px) {
	.cmnBtn {padding: 17px 0;}
}


/* ------------------------- top01 ------------------------- */
#top01{background: url(../img/top/01-01.jpg) no-repeat center center; background-size: cover;}
.w1800 {max-width: 1800px; width: 100%; margin: 0 auto; overflow: hidden;}
#top01 .beta{ white-space: nowrap}
/* #top01 .beta::after{ content: "β版リリース"; display: inline-block; position: absolute; top: -30px; right: 0; font-size: 14px; font-weight: 400; background: #222222; border-radius: 5px; padding: 5px 10px;} */
.txtShadow{ text-shadow: 2px 2px 2px rgb(0 0 0 / 80%); }
#top01 .fvmainArea{display: flex; max-width: 1680px; margin: 0 auto; padding-top: 50px; justify-content: center; flex-wrap: nowrap;}
#top01 .fvmainL {width: calc(100% - 700px);}
#top01 .fvmainL .inner p.txt30{white-space: nowrap;}
#top01 .fvmainL .w500 {/*margin-left: auto;*/ margin-bottom: 30px;}
#top01 .fvmainL .w500 a{border-radius: 50px;}
#top01 .fvmainL .w500 a:hover {background: #FD6729;}
#top01 .fvmainL h2 {line-height: 1.3;}
#top01 .fvmainR {width: 700px; padding-bottom: 87px; position: relative; min-height: 600px;}
/* #top01 .fvmainR img {width: calc( 100% - 25px );} */
#top01 .fvmainR .videoWrap{padding-top: 56.25%; width: 100%; position: absolute; z-index: 1;}
#top01 .fvmainR .videoWrap video{width: 100%; height: 100%; position: absolute; top: 0px; left: 0px;}
.threePerson {position: absolute; bottom: 0; left:50px; z-index: 0; width: 500px; }
/* ------------------------- top02 ------------------------- */
#top02 {margin-top: -75px;}
.bgPolygon {transform: skew(0, -5deg); overflow: hidden; position: relative; padding: 100px 0 70px;}
.bgPolygon .bgInner {transform: skew(0, 5deg); position: relative; z-index: 2;}
.bgBox {background: url("../img/top/02-01.jpg") repeat top center; background-size: 100% auto; height: calc(100% + 300px); width: 100%; transform:skew(0, 5deg); position:absolute; top: 150px; left:0; right:0; bottom:0; margin: auto; z-index: 1; }
.cardArea{max-width:1600px; margin:0 auto 40px; padding: 0 20px; box-sizing: border-box;}
.cardItem{width:calc(100% / 3 - 26px); box-shadow: 0 3px 6px rgb(0 0 0 / 16%); padding: 30px;}
.cardItem::before{content: "01"; font-family: 'Rubik', sans-serif; color: white; font-size: 40px; position: absolute; z-index: 3;top: 0; left: 0; width: 120px; height: 120px; padding-top: 20px; padding-left: 10px; background: #2AAB9F; clip-path: polygon(0% 0, 100% 0, 100% 0, 0 100%);}
.cardItem::after{content:""; position: absolute; z-index: 0; bottom: 0; right: 0; width: 120px; height: 120px; background: #2AAB9F; clip-path: polygon(0% 100%, 100% 0, 100% 100%, 0 100%);}
.cardItem:nth-child(2)::before{content: "02";}
.cardItem:nth-child(3)::before{content: "03";}
.cardItem:nth-child(1) img{max-width:205px;margin:0 auto 20px auto;} 
.cardItem:nth-child(2) img{max-width:314px;margin:0 auto 20px auto;}
.cardItem:nth-child(3) img{max-width:260px;margin:0 auto 20px auto;}
.cardArea2{position: relative; max-width:1172px; width: 100%; margin:0 auto 40px; box-sizing: border-box; box-shadow: 0 0 8px rgb(0 0 0 / 30%); }
.cardArea2::before{content: "04"; font-family: 'Rubik', sans-serif; color: white; font-size: 40px; position: absolute; z-index: 3;top: 0; left: 0; width: 120px; height: 120px; padding-top: 20px; padding-left: 10px; background: #FDA500; clip-path: polygon(0% 0, 100% 0, 100% 0, 0 100%);}
.cardArea2::after{content:""; position: absolute; z-index: 0; bottom: 0; right: 0; width: 120px; height: 120px; background: #FDA500; clip-path: polygon(0% 100%, 100% 0, 100% 100%, 0 100%);}
.cardItem2{width:100%; padding: 40px;}
.cardItem2:nth-of-type(2){width:100%; padding-top: 0;}
.cardItem2 .premium{
	display: inline-block; 
	background: #222 url(../img/top/crown-solid.svg) no-repeat top 50% left 20px;
	background-size: 26px 20px;
	color: #fff; 
	padding: 10px 20px 10px 55px; 
	border-radius: 5px;
	margin-bottom: 15px;
}
.cardItem2 .card2-img{width: 530px; flex-shrink: 0; }
.cardItem2 .card2-img img{border:1px solid #a5a5a5; }
.cardInner{position: relative; z-index: 2;border-radius: 10px; box-shadow: 0 0 8px rgb(0 0 0 / 30%); padding: 30px 40px;height: 100%; background: white;} 
.cardInner2{position: relative; z-index: 2;border-radius: 10px; box-shadow: 0 0 8px rgb(0 0 0 / 30%); padding: 40px;height: 100%; background: white;  display: flex; justify-content: space-between; align-items: flex-start; } 
.cardInner2 .cmnBtn{background: #2AAB9F; width: 300px; display: inline-block; margin-top:30px;}
.cardInner2 .cmnBtn a{color:#fff;}
.cardInner2 .cmnBtn:hover{background: #0B8379;}
.ls1 {letter-spacing: .1em}
.marker{background:linear-gradient(transparent 70%, rgb(42 171 159 / 30%) 70%);}
.marker .txtGRE{font-weight: 700;}
#top02 .w300{ margin: 0 auto 80px auto; }  
.entitleArea{ box-shadow: 0 0 8px rgb(0 0 0 / 30%);}
.entitleArea::before{content: ""; position: absolute; top: -1px;left: -1px; display: inline-block; width: 80px; height: 80px; border-top: solid 2px #2AAB9F; border-left: solid 2px #2AAB9F;}
.entitleArea::after{content: ""; position: absolute; bottom: -1px;right: -1px; display: inline-block; width: 80px; height: 80px; border-bottom: solid 2px #2AAB9F; border-right: solid 2px #2AAB9F;}
.entitleArea .txt	{padding:40px 60px; }
#top02 .bgWH .bgInner{padding: 80px 0 40px; margin-bottom: 80px; background: #fff;}
.top02_h2_movie{display: flex; justify-content: center; align-items: center; padding: 0 3%; box-sizing: border-box; text-align: center;}
.top02_h2_movie::before{background: url(../img/top/top02_h2bg.svg) no-repeat bottom 0 left 0; background-size: contain; content: '　'; width: 40px; height: auto; margin-right: 30px;}
.top02_h2_movie::after{background: url(../img/top/top02_h2bg.svg) no-repeat; transform: scale(-1, 1); background-size: contain; content: '　'; width: 40px; height: auto; margin-left: 20px; }
@media screen and (max-width: 1212px) {
	.cardArea2{max-width: calc(100% - 40px); }
}
@media screen and (max-width: 896px) {
	.cardInner2{padding: 20px; flex-direction: column; }
	.cardItem2 .premium{
		display: inline-block; 
		background: #222 url(../img/top/crown-solid.svg) no-repeat top 50% left 20px;
		background-size: 26px 20px;
		color: #fff; 
		padding: 10px 20px 10px 55px; 
		border-radius: 5px;
		margin-bottom: 15px;
	}
	.cardItem2 .card2-img{width: 100%; text-align: center; }
	
}
@media screen and (max-width: 568px) {
	.top02_h2_movie.txt40{font-size: 5vw!important;}
	.top02_h2_movie::before{margin-right: 1%;}
	.top02_h2_movie::after{margin-left: 1%;}
	.cardInner2 .cmnBtn{width: 100%; display: block; margin:30px auto 0;}

}

/* ------------------------- top03 ------------------------- */
#top03 {padding: 120px 0 200px 0; }
.circleArea{ width:110px; height:110px; border-radius: 65px; display: table;}
.circleInner{ display: table-cell; vertical-align: middle;}
.circleInner .rubik{ line-height: 1;}
.stepArea .stepItem { width: 100%; }
.stepArea .stepItem:nth-of-type(2) {/*align-items: center;*/ padding-bottom: 20px;}
.stepTitleArea h3{ margin-left:20px; width: calc(100% - 130px);}
.stepTxtArea{ width: calc(100% - 130px); margin:0 0 0 auto;}
.stepTxtArea .bgGRY{ width: 100%; padding: 30px 40px; }
.stepArea .stepL{ width: calc(65% - 40px); }
.stepArea .stepR{ width: 35%;}
.stepArea .stepR img{border:1px solid #a5a5a5;}
.stepArea .stepTxtArea::before{content: ""; position: absolute; top: 10px; left: -77px; width: 4px; height: 100%; background: #2AAB9F; border-radius: 4px;}
.stepArea .stepItem:nth-of-type(3) .stepTxtArea::before{display: none;}
#top03 span.bgGRE{ padding: 0 10px; }   
#top03 .w300{ margin: 0 auto; } 
#top03 .bgGRE.ls1 {padding: 0 20px; display: inline-block;}
#top03 .spBlock{ display:none;}
.freeplan{border-radius: 3px; background: #A7A7A7; color: #fff; display: block; margin: 0 auto 50px; padding: 6px 15px; text-align: center; width: 160px;}

/* ------------------------- top04 ------------------------- */
#top04 {margin-top: -75px;}
#top04 .bgPolygon {padding: 100px 0;}
#top04 .flowArea {max-width:1172px; width: 100%; margin: 0 auto 50px; justify-content: center;}
#top04 .flowItem{width:calc(33% - 40px); margin: 0 20px;}
#top04 .flowItem span{margin-right:5px; }
.flowTtl {width:100px; margin: 0 auto; position: absolute; top: 0; left: 0; right: 0;}
.flowTtl h3 {line-height: 45px;}
.flowItem .iconArea {width:100px; height:100px; background: #2AAB9F; border-radius: 50px; padding: 20px;}
#top04 .flowItem .iconTxt {border-radius: 10px; box-shadow: 0 0 8px rgb(0 0 0 / 30%); padding:80px 30px 30px 30px; height: calc(100% - 95px); margin-top: 95px;}
.flowItem.rlt::after{content: ""; display: inline-block; position: absolute; margin: auto; right: -27px; bottom: 40%; width:13px; height: 24px; background: #2AAB9F; clip-path: polygon(100% 50%, 0 0, 0 100%);}
.flowItem.rlt:last-of-type::after {display: none;}
.w768{max-width:768px; /*padding-bottom:50px;*/}
.w768 .cmnBtn{background:#FDA500; margin: 0 auto;}
.w768 .cmnBtn:hover { background: #2AAB9F;}
#top04 .flowbtn{max-width:1172px; padding: 0 20px; width: 100%; margin: 0 auto; display: block;}
#top04 .cmnBtn{background:#2AAB9F; margin: 0 0 0 auto; width: 300px;}
#top04 .cmnBtn:hover { background: #0B8379;}
#top04 .w300{ margin:0 auto;}
.attentionArea{ border: solid 1px #EE0000; border-radius: 20px; padding: 40px 50px; }
/* ------------------------- top04_btm ------------------------- */
#top04_btm {padding: 120px 0 200px 0;}

/* ------------------------- top05 ------------------------- */
#top05 {margin-top: -75px; margin-bottom: -120px}
#top05 .bgPolygon {transform: skew(0, -5deg); overflow: hidden; position: relative; padding: 0 0 70px;}
#top05 .bgBox{background: url(../img/top/02-01.jpg) repeat top center; background-size: 100% auto; height: calc(100% + 300px); transform: skew(0, 0deg); width: 100%; position: absolute; left: 0; right: 0; bottom: 0; margin: auto; z-index: 1;}
#top05 .z2{position: relative; z-index: 2;}
/* 
#top05 .questionArea::after{ content: ""; display: block; position: absolute; z-index: 0; top: -177.37px; right: 50px; width: 221.92px; height: 177.37px; background: url(../img/top/05-01.svg) no-repeat center center; background-size: cover; clip-path: none;}
#top05 .questionArea{ padding:40px; }
*/
#top05 .questionArea .questionItem{ width: 100%; background:white; box-shadow: 0 0 10px rgb(0 0 0 / 20%); border-radius: 10px; z-index: 3;  }
#top05 .questionTop{ border-bottom: solid 1px #CCCCCC; }
#top05 .questionTop,#top05 .answerBottom{ padding: 20px 0; }
#top05 .questionTop .bgGRE,#top05 .answerBottom .bgYE{ width:80px; height:60px;line-height: 60px; border-radius: 0 5px 5px 0; text-align: center;}
#top05 .questionTop .txt16,#top05 .answerBottom .txt16{ width:calc(100% - 80px); padding-left:20px;padding-right: 30px;}
#top05 .txtCent span.txtGRE{ text-decoration: underline;}
#top05 .w300{ margin:0 auto;}
@media screen and (max-width: 896px) {
	#top05 .questionArea::after{top: -158.37px;
		right: 20px;
		width: 172.92px;
		height: 176.37px;
		background-size: 170px auto;
	}

}
/* ------------------------- top06 ------------------------- */
#top06 {padding: 60px 0 170px 0; background: url("../img/top/02-01.jpg") repeat top center;} 
#top06::after{ content: ""; display: block; position: absolute; z-index: 999; margin: auto; bottom: 0; right: 0; left: 0; max-width: 767px; max-height: 190px; aspect-ratio: 767/190; background: url(../img/top/06-02.svg) no-repeat center bottom; background-size: cover; } 
#top06 .inner{  width: calc(100% - 40px);max-width: 1300px; box-shadow: 0 0 8px rgb(0 0 0 / 20%); margin: 0 auto;} 
#top06 .inner .container{ padding:50px 0;} 
#top06 .adviceArea .adviceL { width:calc(61% - 50px);}
#top06 .adviceArea .adviceL h2 .txtORE {margin: 0 10px;}
#top06 .adviceArea .adviceR {width: 39.5%;} 
#top06 .adviceArea .adviceR .adviceList{border: solid 1px #222222; border-radius: 5px;} 
#top06 .adviceArea .adviceR .adviceList .rubik{ width:40px; text-align: center; line-height: 40px; border-radius: 5px 0 0 5px; border-right: solid 1px #222222;} 
#top06 .adviceArea .adviceR .adviceList .txt14 { width:calc(100% - 40px); padding: 10px 20px;}
#top06 .adviceArea .adviceR .adviceList:nth-child(2) .rubik{ position: absolute; top: 0; left: 0; border-bottom: solid 1px #222222;border-radius:5px 0 5px 0; } 
#top06 .adviceArea .adviceR .adviceList:nth-child(2) .txt14{ margin: 0 0 0 auto; } 
#top06 .adviceArea .adviceR .adviceList img{ padding:10px 20px;}
#top06 .w852 {max-width:852px; width: 100%; margin:0 auto; }
#top06 .cmnBtn {background: #222222;}
#top06 .cmnBtn:hover { background: #2AAB9F;}
@media screen and (max-width: 1680px) {
	#top01 .fvmainR {width: 42%;}
	#top01 .fvmainR img {width: calc( 100% - 3.2% );}
	#top01 .fvmainR .videoWrap{padding-top: 56.25%; width: 90.7%; position: absolute; z-index: 1; top: 4px; left: 3.2%;}
	#top01 .fvmainL {width: 58%;}
	#top01 .w300 {position: relative; z-index: 1;}
	.threePerson {width: 34.5%; left: 3%;}
}
@media screen and (max-width: 1260px) {
	#top01 .fvmainL {padding: 0 20px;}
	/* #top01 .beta {font-size: 4.5vw; margin-bottom: 20px;} */
	#top01 .fvmainL .txt30 {padding-top: 20px;}
	.cardItem.rlt.bgWH {padding: 20px;}
	.cardInner {padding: 20px;}
	.cardInner2 {padding: 30px;}
	.cardItem::after,.cardItem::before,.cardArea2::after,.cardArea2::before {width: 100px; height: 100px;}
	.cardItem::before,.cardArea2::before {padding-top: 9px; padding-left: 8px; padding-top: 10px; padding-left: 5px;}
}
@media screen and (max-width: 1180px) {
	#top01 .fvmainL .txt30 {font-size: 2.8vw;}
	#top01 .fvmainL .txt70 {font-size: 5vw;}
	#top01 .fvmainL .txt50 {font-size: 4vw;}
	#top01 .beta::after {padding: 5px;}
	.threePerson {width: calc(60% - 270px);}
}
@media screen and (max-width: 896px) {
	#top01 h3.txtShadow{font-size: 14px;text-align: left;}
	#top01 .bothLine {text-align: center; margin-bottom: 60px;}
	#top01 .bothLine::before { display: none;}
	#top01 .bothLine::after { position: absolute; bottom: -20px; margin: 0; width: 120px;}
	#top01 .fvmainArea { flex-direction: column; transform: unset;}
	#top01 .fvmainL {width: 100%; margin: 0 auto 30px;}
	#top01 .fvmainL .txt30 {font-size: 4vw;}
	#top01 .fvmainL .txt70 {font-size: 8vw;}
	#top01 .fvmainL .txt50 {font-size: 6vw;}
	#top01 h3.txtShadow {line-height: 1.7;}
	#top01 h3.txtShadow .txt20 {font-size: 18px;}
	#top01 .fvmainL .w300{margin: 0 auto;}
	.threePerson img { left: 10px;}
	#top01 .beta { margin-bottom: 50px;}
	#top01 .beta::after { top: unset; bottom: -38px; right: 0; font-size: 12px; }
	.doubleDiagonalLine .txt54{ font-size:40px;}
	.threePerson {width: 66%; left: 10px;}
	#top01 .fvArea {padding: 0 0 50px;}
	#top01 .fvmainR { display:flex; width: 100%; margin-right: auto; margin-left: auto; padding-bottom: 0;justify-content: center; min-height: 75vw;}
	#top01 .fvmainR img {width: 100%;}
	#top01 .fvmainR .videoWrap{padding-top: 56.25%; width: 94%; top: initial; left: initial; z-index: 0;}
	.cardArea {padding: 0 20px;}
	.cardItem.rlt.bgWH {width: 100%; padding: 20px; margin-bottom: 30px;}
	.cardItem:last-of-type.rlt.bgWH {margin-bottom: 0;}
	.cardItem::after,.cardItem::before,.cardArea2::after,.cardArea2::before {width: 80px; height: 80px;}
	.cardItem2{padding: 20px;}
	.cardItem2:nth-of-type(2){margin-top: -10px;}
	.cardItem::before,.cardArea2::before {padding-top: 9px; padding-left: 8px; font-size: 26px;}
	.cardInner .txt20 {margin-bottom: 5px;}
	.cardInner .txt30 {font-size: 24px; margin-bottom: 20px;}
	#top03 .stepItem .innerflex{ flex-direction: column;}
	#top03 .w300 { margin: 0 auto 60px auto;}
	#top03 .stepArea .stepL{width: 100%;}
	.circleArea {width: 50px; height: 50px; border-radius: 50%;}
	.circleInner .txt18 {font-size: 10px;}
	.circleInner .txt36 {font-size: 22px;}
	.stepTitleArea h3 {width: calc(100% - 60px); margin-left: 10px; font-size: 18px;}
	.stepTxtArea {width: calc(100% - 60px); margin: 10px 0 0 auto;}
	.stepTxtArea .bgGRY {padding: 20px;}
	#top03 .stepArea .stepR{width: calc(100% - 60px); margin: 0 0 0 auto;}
	#top03 .stepArea .stepR img {padding-top: 20px;}
	.stepArea .stepItem:nth-of-type(2) {padding-bottom: 0px;}
	#top03 .stepItem {margin-bottom: 10px;}
	#top03 .stepItem.rlt::before {content: ""; position: absolute; top: 60px; left: 25px; width: 4px; height: calc(100% - 60px); background: #2AAB9F; border-radius: 4px;}
	#top03 .stepItem.rlt:last-of-type::before { display: none; }
	.stepArea .stepTxtArea::before { display: none; }
	.stepArea.mb60 {margin-bottom: 30px;}
	#top03 .bgGRE.ls1 {display: block; padding: 0 10px;}
	#top03 .imgArea{max-width: 480px; height: auto; margin: 0 auto;}
	#top04 .flowArea {margin-bottom: 30px;}
	#top04 .flowItem {width: calc(100% - 40px); margin: 0 auto 37px;}
	#top04 .flowItem:last-of-type {margin-bottom: 0;}
	#top04 .cmnBtn{margin: 0 auto;}
	.flowTtl {width: 70px;}
	.flowTtl h3 {line-height: 28px; font-size: 24px;}
	.flowTtl h3 span {font-size: 12px;}
	.flowItem .iconArea {width: 60px; height: 60px; margin: 0 auto; padding: 12px;}
	.flowItem.rlt::after {right: 0; bottom: -27px; left: 0; width: 30px; height: 17px; background: #2AAB9F; clip-path: polygon(0 0, 50% 100%, 100% 0);}
	#top04 .flowItem .iconTxt {height: auto; margin-top: 60px; padding: 40px 15px 15px 15px;}
	#top06 .inner .container {padding: 25px 10px;}
	#top06 .adviceArea .adviceL h2 .txtORE {margin: 0 0 0 5px;}
	.adviceL .txt18 {font-size: 14px;}
	#top06 .adviceArea .adviceR .adviceList .rubik {width: 30px; line-height: 30px; height: 30px; border-bottom: solid 1px #222222; border-radius: 5px 0 5px 0;}
	#top06 .adviceArea .adviceR .adviceList .txt14 {width: calc(100% - 30px); padding: 10px 15px;}
	.adviceList {align-items: flex-start;  -webkit-box-align: start;	-ms-flex-align: start;}
	#top06 .adviceArea .adviceR .adviceList img {padding: 0 10px 10px;}
	#top06 .adviceArea {gap: 30px; flex-direction: column; margin-bottom: 20px;}
	#top06 .adviceArea .adviceL,#top06 .adviceArea .adviceR {width: 100%;}
}
@media screen and (max-width: 568px){
	#top01 .fvArea {padding: 0 0 50px;}
	#top01::before,#top03::before {bottom: 0; border-bottom: 35px solid #2AAB9F;}
	#top02::before,#top04::before {bottom: -17.5px; border-top: 35px solid #2AAB9F;}
	.txt14 {font-size: 12px;}
	.doubleDiagonalLine::before,.doubleDiagonalLine::after {width: 30px; height: 35px;}
	.diagonalLine.rubik.txt24,.speechBubble {font-size: 18px;}
	.speechBubble {padding: 5px 20px;}
	.triangleGRE_L::before {bottom: 0; border-bottom: 35px solid #2AAB9F;}
	#top01 .fvmainL .inner p.txt30 {font-size: 20px;margin-bottom: 0; white-space: normal;}
	#top01 .beta {font-size: 28px; white-space: normal;}
	#top02 {margin-top: -17.5px;}
	.bgPolygon,#top04 .bgPolygon {padding: 50px 0;}
	.bgBox {height: calc(100% + 100px); top: 50px;}
	.cardItem:nth-child(1) img {width: 160px;}
	.cardItem:nth-child(2) img {width: 247px;}
	.cardItem:nth-child(3) img {width: 214px;}
	#top02 .featureArea { padding: 30px 0;}
	.marker .txtGRE {font-size: 34px;}
	.entitleArea .txt {padding: 30px;}
	#top02 .container.mb40 {margin-bottom: 0;}
	#top03 {padding: 40px 0 95px 0;}
	#top03 .txt40.txt500.txtCent.mb30 {margin-bottom: 20px;}
	#top03 .txt20.txtCent.txt500.mb60 {font-size: 14px; text-align: left; margin-bottom: 30px;}
	#top03 .w300 {margin: 0 auto;}
	#top04 {padding: 60px 0 0;}
	#top04 .w768 {width: calc(100% - 40px); line-height: 1.6;}
	#top04 .cmnBtn {padding: 17px 0; border-radius: 50px; }
	.attentionArea {padding: 20px 25px;}
	#top05 {padding: 50px 0 40px;}
	#top05 .cardItem {width: 100%; margin: 0 auto 40px; padding: 0; }
	#top05 .questionArea::after {background-size: contain; width: 85px; height: 68px; top: -68px; right: 0;}
	#top05 .questionTop, #top05 .answerBottom {padding: 15px 0;}
	#top05 .answerBottom {align-items: flex-start;  -webkit-box-align: start;	-ms-flex-align: start;}
	#top05 .questionTop .bgGRE, #top05 .answerBottom .bgYE {width: 40px; height: 40px; line-height: 40px; }
	#top05 .questionTop .txt16, #top05 .answerBottom .txt16 {width: calc(100% - 40px);}
	#top05 .questionArea {padding: 20px;}
	#top06 {padding: 40px 0 50px 0;}
	#top06 .cmnBtn {line-height: 1.6; padding: 10px 0; border-radius: 10px;}
	#top06::after {max-width: 260px; right: -20px;}
}
/* ------------------------- top07 ------------------------- */

/*--------------------------------------------

下層共通

--------------------------------------------*/
#kv { padding:100px 0 60px 0 ; } 
#kv .guideArea{ box-shadow: 0 0 8px rgb(0 0 0 / 30%); padding: 40px 50px; } 
#kv .w516 {width: calc(50% - 20px);} 
#kv .cmnBtn {width: 100%; background: #2AAB9F; border: solid 2px #2AAB9F; border-radius: 10px; box-shadow: none; padding: 23px 0; line-height: 1.4;} 
#kv .cmnBtn:hover{ background:white;color:#2AAB9F;} 
@media screen and (max-width: 1230px){
	#kv .guideArea {  width: calc(100% - 4vw); margin: 0 auto;}
}
@media screen and (max-width: 896px){
	#kv {padding: 100px 0 10px 0;}
	#kv .guideArea{ box-shadow: 0 0 8px rgb(0 0 0 / 30%); padding: 20px 30px; } 
}
@media screen and (max-width: 568px){
	#kv .w516 {width: 100%;}
	#kv .w516 .txt22 {font-size: 16px; padding: 15px 0;}
	#kv .guideBtnArea.gap {gap: 20px;}
	#kv .guideArea {margin-bottom: 20px;}
}

/*--------------------------------------------

機能紹介

--------------------------------------------*/
#function_kv {padding: 100px 0 0; } 
#function_kv .guideArea_f{display: block; box-shadow: 0 0 8px rgb(0 0 0 / 30%); padding: 0; } 
#function_kv .func_anc_link{align-items: stretch;}
#function_kv .anc_free{display: block; width: calc(50% - 1px);}
#function_kv .anc_premium{display: block;width: 50%;}
#function_kv .anc_free a, 
#function_kv .anc_premium a{
	position: relative;
	display: flex;
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
	background:#fff;
	transition: .3s;
}
#function_kv .anc_free a:hover, 
#function_kv .anc_premium a:hover{
	background: #E6F6F4;
}
#function_kv .anc_free a.menulink span, 
#function_kv .anc_premium a.menulink span{
	padding-left: 50px;
	background: url(../img/function/chevron-down-solid.svg) no-repeat left center;
	background-size: auto 18px;
}
#function_kv .anc_premium a.menulink span img{
	width: 30px;
	display: inline-block;
	margin-right: 5px;
}

#function_kv .guideArea_f span.border{
	border-left: 1px solid #a5a5a5;
	min-height: 80px;
	margin: 17px auto;
	display: inline-block;
	font-size: 0;
}

.cardArea_f,.cardArea_p{
	position: relative; 
	max-width:1172px; 
	width: 100%; 
	margin:0 auto 40px; 
	box-sizing: border-box; 
	box-shadow: 0 0 8px rgb(0 0 0 / 30%); 
}
.p_border{border: 2px solid #2AAB9F;}

.cardArea_f::before{
	content: ""; 
	position: absolute; 
	z-index: 3;
	top: 0; 
	left: 0; 
	width: 120px; 
	height: 120px; 
	background: url(../img/function/func_free_bg.svg) no-repeat left top;
	background-size: cover;
}

.cardArea_p::before{
	content: ""; 
	position: absolute; 
	z-index: 3;
	top: 0; 
	left: 0; 
	width: 120px; 
	height: 120px; 
	background: url(../img/function/func_premium_bg.svg) no-repeat left top;
	background-size: cover;
}

.cardItem_f,.cardItem_p{width:100%; padding: 40px;}
.cardItem_f:nth-of-type(2),.cardItem_f:nth-of-type(3){ width:100%; padding-top: 0;}
.cardItem_f .card-f-img{ width: 440px; flex-shrink: 0; }
.cardItem_f .card-f-img img{ border:1px solid #a5a5a5; }
.cardInner_f{position: relative; z-index: 2;border-radius: 10px; box-shadow: 0 0 8px rgb(0 0 0 / 30%); padding: 40px;height: 100%; background: white;  display: flex; justify-content: space-between; align-items: flex-start; } 
.fldc_rrv{flex-direction: row-reverse;}
.cardItem_f h3{padding-left: 45px;}
.icon_f1{background: url(../img/function/func_free_icon01.svg) no-repeat left top 7px; background-size: auto 24px;}
.icon_f2{background: url(../img/function/func_free_icon02.svg) no-repeat left top 10px; background-size: auto 24px;}
.icon_f3{background: url(../img/function/func_free_icon03.svg) no-repeat left top 7px; background-size: auto 28px;}
.icon_p1{background: url(../img/function/func_premium_icon01.svg) no-repeat left top 6px; background-size: auto 30px;}
.icon_p2{background: url(../img/function/func_premium_icon02.svg) no-repeat left top 10px; background-size: auto 24px;}
.icon_p3{background: url(../img/function/func_premium_icon03.svg) no-repeat left top 6px; background-size: auto 27px;}

#free { padding:80px 0;} 
#premium { padding:100px 0;} 
.bgBox_f {background: url("../img/top/02-01.jpg") repeat top center; background-size: 100% auto; width: 100%; margin: auto;}
.func_cv_btn{
	width: calc( 100% - 80px);
	display: block;
	margin: 0 auto 40px;}
.func_cv_btn a{border-radius: 50px; padding: 20px; box-sizing: border-box;}
.func_cv_btn a:hover{background: #FD6729;}

#func_flow{margin: 100px auto 0; padding-top: 100px;}
#func_flow .flowArea {max-width:1172px; width: 100%; margin: 0 auto 50px; justify-content: center;}
#func_flow .flowItem{width:calc(33% - 40px); margin: 0 20px;}
#func_flow .flowItem span{margin-right:5px; }
#func_flow .flowTtl {width:100px; margin: 0 auto; position: absolute; top: 0; left: 0; right: 0;}
#func_flow .flowTtl h3 {line-height: 45px;}
#func_flow .flowItem .iconArea {display: flex; justify-content: center; align-items: center; width:100px; height:100px; background: #2AAB9F; border-radius: 50px; padding: 20px;}
#func_flow .flowItem .iconTxt {display: flex; flex-direction: column; border-radius: 10px; box-shadow: 0 0 8px rgb(0 0 0 / 30%); padding:80px 30px 30px 30px; height: calc(100% - 95px); margin-top: 95px;}
#func_flow .flowItem.rlt::after{content: ""; display: inline-block; position: absolute; margin: auto; right: -27px; bottom: 40%; width:13px; height: 24px; background: #2AAB9F; clip-path: polygon(100% 50%, 0 0, 0 100%);}
#func_flow .flowItem p.txt24 {line-height: 1.2em; flex-grow: 1; align-items: center; display: flex; justify-content: center;}
#func_flow .flowItem.rlt:last-of-type::after {display: none;}
#func_flow .premium{border-radius: 5px; background: #222 url(../img/top/crown-solid.svg) no-repeat top 50% left 20px; background-size: 26px 20px; color: #fff; display: block; margin: 0 auto 50px; padding: 10px 20px 10px 55px; text-align: center; width: 240px;}
.flow_mk{background: linear-gradient(transparent 65%, rgb(42 171 159 / 0.3) 50%);}

@media screen and (max-width: 1260px) {
	.cardInner_f,.cardInner_p {padding: 30px;}
	.cardArea_f::before,.cardArea_p::before {width: 100px; height: 100px; padding-top: 9px; padding-left: 8px; padding-top: 10px; padding-left: 5px;}
}
@media screen and (max-width: 1212px) {
	.cardArea_f,.cardArea_p{max-width: calc(100% - 40px); }
}
@media screen and (max-width: 896px) {
	#function_kv .anc_free{display: block; width: 100%; min-height: 80px;}
	#function_kv .anc_premium{display: block;width: 100%; min-height: 80px;}
	#function_kv .guideArea_f span.border {
		border-left: none;
		border-bottom: 1px solid #a5a5a5;
		min-height: 1px;
		margin: auto 17px;
		display: inline-block;
		font-size: 0;
		width: 100%;
	}
	#function_kv .anc_free a, #function_kv .anc_premium a {justify-content: flex-start; padding: 0 40px;}
	.cardArea_f,.cardArea_p {max-width: calc(100% - 20px);}
	.cardArea_f::before,.cardArea_p::before {padding-top: 9px; padding-left: 8px; font-size: 26px;}
	.cardInner_f{padding: 20px; flex-direction: column; }
	.cardItem_f,.cardItem_p{width:100%; padding: 30px 20px;}
	.cardItem_f .card-f-img{width: 100%; text-align: center; }
	.cardItem_f h3 {padding-left: 35px;}
	.icon_f1{background-position:left 3px top 7px; background-size: auto 18px;}
	.icon_f2{background-position:left top 7px; background-size: auto 20px;}
	.icon_f3{background-position:left top 5px; background-size: auto 24px;}
	.icon_p1{background-position:left 3px top 4px; background-size: auto 27px;}
	.icon_p2{background-position:left top 7px; background-size: auto 18px;}
	.icon_p3{background-position:left top 4px; background-size: auto 22px;}
	#func_flow .flowArea {margin-bottom: 30px;}
	#func_flow .flowItem {width: calc(100% - 40px); margin: 0 auto 37px;}
	#func_flow .flowItem:last-of-type {margin-bottom: 0;}
	#func_flow .flowTtl {width: 70px;}
	#func_flow .flowTtl h3 {line-height: 28px; font-size: 24px;}
	#func_flow .flowTtl h3 span {font-size: 12px;}
	#func_flow .flowItem .iconArea {width: 60px; height: 60px; margin: 0 auto; padding: 12px;}
	#func_flow .flowItem.rlt::after {right: 0; bottom: -27px; left: 0; width: 30px; height: 17px; background: #2AAB9F; clip-path: polygon(0 0, 50% 100%, 100% 0);}
	#func_flow .flowItem .iconTxt {height: auto; margin-top: 60px; padding: 50px 15px 15px 15px;}
	#func_flow .flowItem .iconTxt span {display: none;}

}


/*--------------------------------------------

料金プラン

--------------------------------------------*/
#price_kv{display: block; padding: 100px 0 50px;}

#price_fv{margin: 0 auto 50px;}
#price_fv .price_fvArea {max-width:1080px; width: 100%; margin: 0 auto 50px; justify-content: center;}
#price_fv .price_fvItem{position: relative; padding: 0; width:calc(33% - 40px); margin: 0 20px; border-radius: 10px;}
#price_fv .price_fvItem h3 { display: flex; justify-content: center; align-items: center; width: 100%; background: #2AAB9F; border-radius: 10px 10px 0 0; height: 73px; padding: 0 20px;}
#price_fv .price_fvItem:nth-of-type(2) h3 {flex-direction: column;}
#price_fv .price_fvItem:last-of-type h3 {background: #D7EFED;}
#price_fv .price_fvItem:nth-of-type(2){position: relative; z-index: 2;}
#price_fv .price_fvItem:first-of-type,
#price_fv .price_fvItem:last-of-type{position: relative; z-index: 0;}
#price_fv .price_fvItem .iconArea {display: flex; justify-content: center; align-items: center; width:100px; height:100px; background: #2AAB9F; border-radius: 50px; padding: 20px;}
#price_fv .price_fvItem .iconTxt {display: flex; flex-direction: column; justify-content: flex-start; border-radius: 10px; box-shadow: 0 0 8px rgb(0 0 0 / 30%); margin-top: 50px;}
#price_fv .price_fvItem .iconTxt img{height: 70%; width: auto;}
#price_fv .price_fvItem.rlt::after,
#price_fv .price_fvItem.rlt::before{
	content: url(../img/price/circle-plus-solid.svg); 
	display: inline-block; 
	position: absolute; 
	margin: auto; 
	width: 70px; 
	height: 70px;
	z-index: 3;
}
#price_fv .price_fvItem.rlt::before{left: -55px; bottom: 30%;}
#price_fv .price_fvItem.rlt::after{right: -55px; bottom: 30%;}

#price_fv .price_fvItem .iconTxt .price_inner{
	flex-direction: column;
	padding: 40px 20px;
	min-height: 220px;
}
#price_fv .price_fvItem .iconTxt .price_inner .txt16{line-height: 1.4em;}

#price_list{
	display: block;
	width: 100%;
}
.price_box{
	width: 1212px;
	margin: 0 auto 40px;
}

.price_cell{
	display: flex; 
	flex-direction: column; 
	width: 20%;
	padding: 0;
}
.price_cell h2{min-height: 72px;}
.price_cell:nth-of-type(1) h2{background: #f5f5f5; border-radius: 10px 0 0 0; border-right: 1px solid #fff; position: relative; z-index:1;}
.price_cell:nth-of-type(2) h2{background: #64C2B9; border-radius: 0 10px 0 0; width: 400%; position: relative; z-index:0;}
.price_cell:nth-of-type(3) h2{background: #2AAB9F; border-right: 1px solid #fff; visibility: hidden; position: relative; z-index:0;}
.price_cell:nth-of-type(4) h2{background: #2C7F77; border-right: 1px solid #fff; visibility: hidden; position: relative; z-index:0;}
.price_cell:nth-of-type(5) h2{background: #295753; border-radius: 0 10px 0 0; visibility: hidden; position: relative; z-index:0;}

.price_cell_inner{
	width: 100%;
	padding: 0 5%;
	box-sizing: border-box;
	display: block;
}

.price_cell:nth-of-type(1) .price_cell_inner{border-left: 1px solid #DDDDDD; border-right: 1px solid #DDDDDD;}
/*.price_cell:nth-of-type(2) .price_cell_inner{ border-right: 1px solid #DDDDDD;}*/
.price_cell:nth-of-type(3) .price_cell_inner{ border-left: 1px solid #DDDDDD; border-right: 1px solid #DDDDDD;}
.price_cell:nth-of-type(4) .price_cell_inner{ border-right: 1px solid #DDDDDD;}
.price_cell:nth-of-type(5) .price_cell_inner{ border-right: 1px solid #DDDDDD;}

.price_cell_item{
	min-height: 100px;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 20px 0;
	flex-shrink: 1;
	border-bottom: 1px dashed #DDDDDD;
}
.price_cell_item .space{margin: 3px auto;}
.price_cell .price_cell_inner .price_cell_item:nth-of-type(2){min-height: 133px;}
.price_cell .price_cell_inner .price_cell_item:nth-of-type(5){border-bottom: none;}
.price_cell_btn{
	padding-top: 20px;
	position: relative;
	overflow: visible;
	min-height: 100px;
	width: 100%;
}
.price_cell_btn .cmnBtn{width: 100%; line-height: 1.2em;}
.price_cell_btn .cmnBtn:hover{
	background: #FD6729;
}
.price_cell_item:nth-of-type(4) span.notes{
	font-size: 11px;
	vertical-align: top;
}
.price_cell_item:nth-of-type(5) span.notes{
	font-size: 11px;
	vertical-align: 10px;
}
.price_cell:nth-of-type(2) .cmnBtn{
	width: 433%;
	height: auto;
}

.price_func li{
	text-align: left!important;
	font-size: 16px;
	font-weight: bold;
	list-style: disc;
	color: #FDA500;
}
.price_func li.li_none{visibility: hidden;}
.price_func li span{
	font-size: 16px;
	font-weight: bold;
	color: #222;
}
.price_func li span.txtGRE{color:#2AAB9F;}
.price_notes{margin-bottom: 150px;}

#price_planfunc {margin-top: -75px; padding-bottom: 80px; margin-bottom: -250px;}
#price_planfunc .bgPolygon {padding: 100px 0;}
#price_list::before {content: ''; position: absolute; z-index: 0; bottom: 0;left: 0; border-bottom: 150px solid #2AAB9F;  border-right: 100vw solid transparent; }
/* #price_planfunc::before {content: ''; position: absolute; z-index: 0; bottom: -75px; right: 0; border-top: 150px solid #2AAB9F;  border-left: 100vw solid transparent; } */
#price_planfunc .container{width: 1080px; max-width: calc(100% - 40px); margin: 0 auto;}
#price_planfunc .price_planbox{margin: 0 auto 200px;}
#price_planfunc .price_planbox .price_plan{
	width: calc(50% - 20px);
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	box-shadow: 0 0 8px rgb(0 0 0 / 30%);
	padding: 40px;
	box-sizing: border-box;
}
#price_planfunc .price_planbox .price_plan h3{font-weight: normal;}
#price_planfunc .price_planbox .price_plan:last-of-type h3{color:#FD6729;}
#price_planfunc .price_planbox .price_plan img{
	height: 182px;
	width: auto;
}

#price_planfunc .price_planbox .price_plan li{
	background: url(../img/price/price_plan_li.svg) no-repeat left top 10px;
	background-size: 18px auto;
	padding-left: 30px;
}

#price_planfunc .price_planbox .price_plan .cmnBtn{
	width: 300px;
	max-width: 100%;
	background: #2AAB9F;
	border-radius: 50px;
}
#price_planfunc .price_planbox .price_plan .cmnBtn:hover{
	background: #0B8379;
}

/*
@media screen and (max-width: 1024px) {
	.price_box {margin: 0 auto 40px; width: calc(100% - 40px);}
	.price_cell{
		width: 50%;
		margin: 0 auto 40px;
	}
	.price_cell:last-of-type{width: 100%;}
	.price_cell:nth-of-type(3) .price_cell_inner,
	.price_cell:nth-of-type(5) .price_cell_inner{ border-left: 1px solid #DDDDDD;}

	.price_cell:nth-of-type(1) h2{border-radius: 10px 0 0 0;}
	.price_cell:nth-of-type(2) h2{border-radius: 0 10px 0 0; border-right: none;}
	.price_cell:nth-of-type(3) h2{border-radius: 10px 0 0 0;}
	.price_cell:nth-of-type(4) h2{border-radius: 0 10px 0 0; border-right: none;}
	.price_cell:nth-of-type(5) h2{border-radius: 10px 10px 0 0;}
	.price_cell_btn.spOnly{display: block;}
	.price_cell_btn { display: flex; align-items: center;}
	.price_cell:nth-of-type(1) .price_cell_btn {margin-top: 10px; margin-bottom: 10px;}
	.price_cell .cmnBtn{
		border-radius: 50px; width: 100%;
		min-height: 85px;
        display: flex;
        align-items: center;
        justify-content: center;
	}
	.price_cell:last-of-type .cmnBtn{
		position: relative;
		right: initial;
		width: 100%;
		height: auto;
	}
	.price_func{ margin-left: 20px;}
}*/

@media screen and (max-width: 896px) {

	#price_fv .price_fvItem{width: 100%;}
	#price_fv .price_fvItem.rlt::before {left: calc(50% - 35px); bottom: initial; top: -10px;}
	#price_fv .price_fvItem.rlt::after {right: calc(50% - 35px); bottom: -60px;}
	#price_planfunc .price_planbox .price_plan{
		width: calc(100% - 20px);
		max-width: 100%;
		margin: 0 auto;
	}
	/*.price_cell .cmnBtn {font-size: 2.1vw;} */
}
@media screen and (max-width: 568px){
	#price_list::before {bottom: 0; border-bottom: 50px solid #2AAB9F;}
	#price_planfunc {margin-top: -25px;}
	#price_planfunc::before {bottom: -17.5px; border-top: 35px solid #2AAB9F;}
	#price_planfunc .bgPolygon {padding: 50px 0;}
	.price_notes {margin-bottom: 100px;}
	/*.price_func li span {font-size: 2.7vw;}
	.price_cell .cmnBtn{font-size: 3vw;}
	.price_cell{width: 100%; margin: 0 auto 30px;}
	.price_cell:nth-of-type(2) .price_cell_inner,
	.price_cell:nth-of-type(4) .price_cell_inner{ border-left: 1px solid #DDDDDD;}
	.price_func li.li_none{display: none;}
	.price_cell:nth-of-type(1) h2,
	.price_cell:nth-of-type(2) h2,
	.price_cell:nth-of-type(3) h2,
	.price_cell:nth-of-type(4) h2,
	.price_cell:nth-of-type(5) h2{border-radius: 10px 10px 0 0; border-right:none;}
	.price_cell:nth-of-type(1) .price_cell_btn {margin: 0 auto;} */

}

/*--------------------------------------------

導入事例

--------------------------------------------*/
#case_kv {padding: 100px 0 0; } 
#case_wrap{display: block; width: 100%; padding: 0 0 100px;}
#case_wrap a{transition: .3s; opacity: 1;}
#case_wrap a:hover{opacity: 0.8;}
.caseItem {
	width:100%; 
	box-shadow: 0 0 10px rgb(0 0 0 / 20%);
	padding: 40px;
	position: relative;
	display: flex;
	justify-content: space-between;
	gap: 40px;
	margin-bottom: 40px;
}	
.caseItem::after{
	content:""; 
	position: absolute; 
	z-index: 0; 
	bottom: 0; 
	right: 0; 
	width: 120px; 
	height: 120px; 
	background: #2AAB9F; 
	clip-path: polygon(0% 100%, 100% 0, 100% 100%, 0 100%);
}
.case_logoarea{
	display: flex;
	width: auto;
	gap:20px;
	align-items: center;
	margin-bottom: 35px;
}

.case_logoarea img{
	width: 200px;
	max-width: 35%;
	height: auto;
}

.case_icon{
	background: #222222;
	padding: 2px 5px;
	display: inline-block;
	border-radius: 5px;
	margin-bottom: 15px;
}
.case_text{
	flex:1;
	position: relative;
	z-index: 1;
}

.case_text h3{
	display: -webkit-box;
	overflow: hidden;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
.case_img{
	position: relative;
	z-index: 1;
	width: 45%;
}

.case_img img{border: 1px solid #A5A5A5;}

@media screen and (max-width: 568px){
	.caseItem{
		flex-direction: column-reverse;
		padding: 20px;
		gap: 20px;
	}
	.case_img{
		width: 100%;
		z-index: initial;
	}
}

/*--------------------------------------------

導入事例-下層

--------------------------------------------*/
#case_postwrap{
	display: block; width: 100%; padding: 0 0 100px;
}

#case_postwrap .container{width: 850px;}
.case_post_company{
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 40px;
	width: 90%;
	margin: 0 auto;
	padding: 0 0 40px;
}
.case_post_company img{
	width: 200px;
	height: auto;
}
.case_post_company div:last-of-type{
	flex: 1;
}

.case_post_profile{
	display: block;
	border-top: 1px solid #707070;
	padding: 40px 0;
}

.case_post_profile div{
	display: flex;
	gap: 30px;
	margin-bottom: 15px;
	align-items: flex-start;
}
.case_post_profile div:last-of-type{margin-bottom: 0;}
.case_post_profile_icon{
	background: #222222;
	padding: 5px 5px 7px;
	display: inline-flex;
	border-radius: 5px;
	width: 110px;
	box-sizing: border-box;
	align-items: center;
	justify-content: center;	
}

.case_post_profile_cont{
	flex:1;
}

.case_post_profile_cont ul{
	padding-left: 20px;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	list-style: disc;
}
.case_post_profile_cont ul li{
	width: 300px;
}

.case_post_intro {
	width:100%; 
	box-shadow: 0 0 10px rgb(0 0 0 / 20%);
	padding: 30px;
	position: relative;
	display: block;
	margin: 0 auto 40px;
}
.case_post_intro h3{
	border-bottom: 1px solid #2AAB9F;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

.case_post_intro ul{
	padding-left: 20px;
}
.case_post_intro ul li{
	list-style: disc;
}



#case_postwrap .cmnBtn{
	border-radius: 80px;
}
#case_postwrap .cmnBtn:hover{
	background-color: #FD6729;
}

.case_post_mainbox{
	display: block;
	width: 100%;
}

.case_post_mainbox h3{
	border-left: 6px solid #2AAB9F;
	padding-left: 10px;
	margin-bottom: 20px;
}

.case_post_mainbox p{
	margin-bottom: 20px;
	line-height: 1.75em;
}

.case_post_outro{
	width:100%; 
	box-shadow: 0 0 10px rgb(0 0 0 / 20%);
	padding: 50px;
	position: relative;
	/* display: flex; */
	display: none;
	justify-content: center;
	gap: 50px;
	margin: 40px auto 0;
	align-items: center;
}

.case_post_outro img{
	max-width: 250px;
	height: auto;
}

.case_post_outro a{
	color: #2AAB9F;
	text-decoration: underline;
}

.case_post_outro a:hover{
	text-decoration: none;
}

@media screen and (max-width: 896px) {
	#case_postwrap .container{width: calc(100% - 20px);}
}

@media screen and (max-width: 568px){
	.case_post_company{
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
	}
	.case_post_profile div{
		flex-direction: column;
		gap: 10px;
	}
	.case_post_outro{
		flex-direction: column;
		gap: 40px;
	}

}

/*--------------------------------------------

お問い合わせ

--------------------------------------------*/
#contact01,#confirm01 {padding-bottom: 100px;}
#contact01 h2 {padding: 0 0 20px; margin-bottom: 20px; border-bottom: 1px solid #CCCCCC;}
#mailform {padding:0 0 100px 0; }
#mailform dd .bordRED { border:solid 1px #EE0000; border-radius: 10px; padding: 20px 30px; margin: 0 0 15px;}
.form-radio span.txtBLU {margin-left: 0;}
#contact01 .policyTxt .txtGRE{text-decoration: underline;}
#contact01 .policyTxt .txtGRE.rlt::after{content:"";    display: inline-block;background: url(../img/contact/01-01.svg) no-repeat center bottom; background-size: cover; width: 14px; height: 14px; margin-left: 5px;}
#contact01 .cmnBtn,#confirm01 .cmnBtn {padding: 15px 0; width: 100%; cursor: pointer;}
.error_message {font-size: 14px; color: #CC0000; font-weight: 700; padding-top: 5px;}
#confirm01 #back.cmnBtn {background: #999999;}
#confirm01 .w300 {margin: 0 20px;}
@media screen and (max-width: 896px){
	#contact01 .pb40.flex.jcCent.alCent {flex-direction: column;}
	#contact01 .form-checkbox {margin-bottom: 20px;}
}
@media screen and (max-width: 568px){
	#confirm01 .w300 {margin: 0 20px 10px;}
}

#mktoForm_4035 {
	width: 100% !important;
	max-width: 100%;
  }

  #mktoForm_4035 .mktoFormRow:nth-of-type(7){
	text-align: center!important;
	display: flex;
	justify-content: center;
  }
  #mktoForm_4035 .mktoFormRow:nth-of-type(7) .mktoFieldWrap{
	float: none!important;
	}
  #mktoForm_4035 .mktoFormRow:nth-of-type(7) .mktoFieldWrap div{
	text-align: center!important;
	}

  #mktoForm_4035 .mktoFormRow:nth-of-type(8) .mktoFieldWrap.mktoRequiredField,
	#mktoForm_4035 .mktoFormRow:nth-of-type(9) .mktoFieldWrap.mktoRequiredField{
	text-align: center!important;
	display: flex!important;
	justify-content: center!important;
  }

  #mktoForm_4035 .mktoButtonRow{
	width: 100%;
	text-align: center;
	display: flex;
	justify-content: center;
  }

.mktoForm .mktoOffset {
	height: 0 !important;
  }

  .mktoForm .mktoFieldWrap{
	margin-bottom: 20px;
	width: 100%!important;
	display: block;
  }
  .mktoForm .mktoFieldWrap label#LblEmail{width: auto!important;}
  .mktoForm .mktoFieldWrap label#LblEmail br{display: none;}

  .mktoForm .mktoFormCol{
	width: 100%;
  }

  .mktoForm .mktoLabel {
    font-size: 18px!important;
    font-weight: bold;
    margin-bottom: 15px;
}

  .mktoForm .mktoRequiredField label.mktoLabel{
	margin-bottom: 15px;
	position: relative;
	display: inline-block;
	width: auto!important;
  }
  .mktoForm .mktoRequiredField label.mktoLabel span,
  .mktoForm .mktoRequiredField label#Lblpmcf_q3.mktoLabel span{
	font-size: 18px!important;
  }

  .mktoForm .mktoRequiredField label.mktoLabel span strong{
	font-size: 18px!important;
	font-weight: bold!important;
	line-height: 1.72em!important;
	color: #222!important;
  }

  .mktoForm .mktoFormRow .mktoField {
	width: 100% !important;
	max-width: 100%;
	font-size: 16px;
	border: 1px solid #999;
    background-color: #FFF;
	margin: 0 auto;
	box-sizing: border-box;
	border-radius: 5px;
	padding: 15px 20px;
  }

.mktoForm input[type=text],.mktoForm input[type=email], 
.mktoForm input[type=tel]{
    font-size: 16px;
  }

  .mktoForm.mktoLayoutAbove .mktoRadioList{
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	width: 100%!important;
  }
  .mktoForm.mktoLayoutAbove .mktoRadioList input[type=radio]{
	display: inline;
    font-size: 18px;
    cursor: pointer;
    padding: 9px 10px 8px 28px;
    top: -3px;
	width: 25px!important;
  }

  .mktoForm .mktoRadioList > label{
	margin-left: 0!important;
  }
  .mktoForm.mktoLayoutAbove .mktoRadioList label{
	font-size: 16px!important;
	line-height: 1.72em!important;
	color: #222!important;
	width: calc(100% - 45px);
  }

.mktoHtmlText {
	width: auto !important;
	line-height: 1.4em;
  }
.mktoHtmlText a {
	text-decoration: underline;
  }
.mktoHtmlText a:hover {
	text-decoration: none;
  }
#contact01 .mktoForm.mktoLayoutAbove .mktoRequiredField .mktoAsterix {
	width: 0;
	font-size: 0;
	color: #fff !important;
	margin: -3px 0 0 10px;
    float: right !important;
	padding-left: 0!important;
  }

  #contact01 .mktoForm .mktoFormRow:first-of-type .mktoRequiredField .mktoAsterix {
	margin-top :1px;
  } 

  #contact01 .mktoForm.mktoLayoutAbove .mktoRequiredField .mktoAsterix::before {
	background: #C00;
	color: #fff;
	content: "必須";
	font-weight: bold;
	font-size: 12px;
	text-align: center;
	padding: 4px 6px;
	border-radius: 3px;
	display: inline-block;
	position: absolute;
	width: 40px;
  }

  .mktoForm.mktoLayoutAbove .mktoLogicalField{
	border: 1px solid #ccc;
    border-radius: 5px;
    display: inline-block;
    width: 30px !important;
	height: 30px;
	box-sizing: border-box;
    margin-top: 2px;
    margin-left: 60px;
  }

  .mktoForm.mktoLayoutAbove .mktoLogicalField.mktoValid{
	background: url(../img/cmn/check.svg) no-repeat center center;
	background-size: 20px auto;
  }

.mktoForm .mktoFormRow:nth-of-type(9) .mktoFieldDescriptor .mktoFieldWrap {
	display: flex;
  }
#Lblpmcf_q5 {
	font-weight: bold;
  }
#Lblpmcf_q5 .mktoAsterix {
	width: 0;
	margin-right: 0;
  }
#Lblpmcf_q5 .mktoAsterix::after {
	display: none;
  }
#Lblprivacy_agreetment {
	width: 300px !important;
	max-width: 100%;
	display: inline-block;
    cursor: pointer;
	margin-bottom: 0;
  }

#Lblpolicy{
	cursor: pointer;
}

#privacy_agreetment {
	width: 18px !important;
	height: 18px !important;
	margin-top: 2px;
  }

  .mktoForm .mktoCheckboxList > label{
	margin-left: 0!important;
	margin-top: 0.3em;
    margin-bottom: 0.3em;
    line-height: 1.2em;
    display: block;
    min-height: 12px;
  }

.mktoForm .mktoButtonWrap.mktoMinimal .mktoButton {
	background: #FDA500!important;
	border-radius: 50px!important;
	color: #fff !important;
	width: 220px !important;
	max-width: 100% !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
	height: 60px !important;
	font-weight: bold !important;
	transition: ease 0.3s opacity !important;
	position: relative !important;
	font-size: 1.8rem !important;
	border: none !important;
	box-shadow: none!important;
	transition: 0.3s!important;
	text-shadow: none!important;
  }

  .mktoForm .mktoButtonWrap.mktoMinimal .mktoButton:hover {
	background: #FD6729!important;
  }



/*--------------------------------------------

お問い合わせ(送信完了)

--------------------------------------------*/
#completion01{ padding:100px 0;}
#completion01 .completionArea{ margin:0 auto;}
#completion01 .w300{ margin:0 auto;}
@media screen and (max-width: 896px) {
	#completion01{  padding: 50px 0;}
}


/*--------------------------------------------

資料ダウンロード

--------------------------------------------*/
#download_wrap{padding:100px 0 0;}
.wrapper_dl {
	max-width: 100%;
	width: 100%;
	margin: 40px auto 0;
	display: flex;
	justify-content: space-between;
  }

  .wrapper_dl .main_dl {
	width: 55%;
	max-width: 100%;
	margin: 0 auto 50px;
  }
  .wrapper_dl .main_dl .dl_container {
	padding: 0 0 0 40px;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	margin: 0 auto;
  }

  .dl_mainimg{
	display: block;
	width: 95.5%;
  	margin: 0 auto 30px;
	box-sizing: border-box;
  }
	.dl_mainimg img{
	border: 1px solid #a5a5a5;
  }

  .wrapper_dl .main_dl .dl_container .container{
	width: 100%;
  }

  .dl_list_title{
	padding-left: 30px;
	background: url(../img/download/dl_list_title.svg)no-repeat left top 50%;
	background-size: 18px auto;
  }

  ul.dl_list li{
	padding-left: 20px;
	font-size: 18px;
	background: url(../img/download/dl_list_li.svg) no-repeat left top 10px;
	background-size: 13px auto;
  }

  ul.dl_list li span{
	font-size: 14px;
	display: inline-block;
	margin-left: 10px;
  }

  .cardArea_dl{
	position: relative;
	max-width:95.5%;
	width: 95.5%;
	margin:0 auto 40px;
	box-sizing: border-box;
	box-shadow: 0 0 8px rgb(0 0 0 / 30%);
}
  .cardArea_dl::before{
	content: ""; 
	position: absolute; 
	z-index: 3;
	top: 0; 
	left: 0; 
	width: 120px; 
	height: 120px; 
	background: url(../img/download/dl_sample_bg.svg) no-repeat left top;
	background-size: cover;
}
  .cardArea_dl::after{
	content:""; 
	position: absolute; 
	z-index: 0; 
	bottom: 0; 
	right: 0; 
	width: 120px; 
	height: 120px; 
}

	.cardItem_dl{
		text-align: center;
		padding: 30px 40px;
		width: 100%;
		box-sizing: border-box;
	}

	.cardItem_dl p{
		display: block;
		margin: 0 auto 20px;
	}

  .wrapper_dl .sidebar_dl {
	width: 45%;
	padding-right: 40px;
	box-sizing: border-box;
	word-break: break-all;
  }
  .wrapper_dl .sidebar_dl .widget {
	min-height: calc(100vh - 100px);
	margin-bottom: 68px;
	max-width: 100%;
	width: 100%;
	padding: 4% 5%;
	box-sizing: border-box;
  }
  .wrapper_dl .sidebar_dl .widget #mktoForm_4029 {
	width: auto !important;
  }

  .wrapper_dl .sidebar_dl .widget #mktoForm_4029 .mktoButtonRow{
	width: 100%!important;
	margin: 10px auto 0;
  }

  .sidebar_dl .mktoForm .mktoRequiredField label.mktoLabel{
	margin-bottom: 10px;
    position: relative;
	width: 100%!important;
  }

  .sidebar_dl .mktoForm .mktoFieldWrap{
	margin-bottom: 5px;
	width: 100%!important;
	display: block;
  }

.wrapper_dl .sidebar_dl .widget .mktoForm .mktoOffset {
	height: 0 !important;
  }
  .wrapper_dl .sidebar_dl .widget .mktoHtmlText {
	width: auto !important;
	line-height: 1.4em;
  }
  .wrapper_dl .sidebar_dl .widget .mktoHtmlText a {
	text-decoration: underline;
  }
  .wrapper_dl .sidebar_dl .widget .mktoHtmlText a:hover {
	text-decoration: none;
  }
  .wrapper_dl .sidebar_dl .widget .mktoForm .mktoAsterix{
	width:0;
	font-size: 0;
	margin-right: 42px;
  }
  .wrapper_dl .sidebar_dl .widget .mktoForm .mktoAsterix::before {
	display: inline-block;
	background: #2AAB9F;
	color: #fff;
	content: "必須";
	font-weight: bold;
	font-size: 12px;
	text-align: center;
	padding: 4px 6px;
	border-radius: 3px;
	width: 40px;
    position: absolute;
	left: 0;
	top:1px;
  }
  .wrapper_dl .sidebar_dl .widget .mktoForm .mktoFormRow:nth-of-type(9) .mktoFieldDescriptor .mktoFieldWrap {
	display: flex;
  }
  .wrapper_dl .sidebar_dl .widget #Lblpmcf_q5 {
	font-weight: bold;
  }
  .wrapper_dl .sidebar_dl .widget #Lblpmcf_q5 .mktoAsterix {
	width: 0;
	margin-right: 0;
  }
  .wrapper_dl .sidebar_dl .widget #Lblpmcf_q5 .mktoAsterix::after {
	display: none;
  }
  .wrapper_dl .sidebar_dl .widget #Lblprivacy_agreetment {
	width: 250px !important;
	max-width: 100%;
	display: inline-block;
	cursor: pointer;
  }
  .wrapper_dl .sidebar_dl .widget #Lblprivacy_agreetment:hover{
	text-decoration: none;
  }

  .wrapper_dl .sidebar_dl .widget .mktoForm.mktoLayoutAbove .mktoLogicalField{
	border: 1px solid #ccc;
    border-radius: 5px;
    display: inline-block;
    width: 30px !important;
	margin-top: 0;
	margin-left: 0;
  }

  .wrapper_dl .sidebar_dl .widget #privacy_agreetment {
	width: 18px !important;
	height: 18px !important;
	margin-top: 2px;
  }
  .wrapper_dl .sidebar_dl .widget .mktoForm .mktoButtonWrap.mktoMinimal .mktoButton {
	background: #FDA500;
	color: #fff !important;
	width: 300px !important;
	max-width: 100% !important;
	display: flex !important;
	margin: 0 auto!important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
	height: 60px !important;
	font-weight: bold !important;
	transition: ease 0.3s opacity !important;
	position: relative !important;
	font-size: 1.8rem !important;
	border: none !important;
	border-radius: 50px!important;
	box-shadow: none!important;
	transition: .3s!important;
	text-shadow: none!important;
  }
  .wrapper_dl .sidebar_dl .widget .mktoForm .mktoButtonWrap.mktoMinimal .mktoButton:hover {
	background: #FD6729;
  }

  .wrapper_dl .sidebar_dl .mktoForm .mktoFormRow .mktoField {
	width: 100% !important;
	max-width: 100%;
	margin: 0 auto;
	box-sizing: border-box;
	padding: 10px 15px;
  }

  .wrapper_dl .widget--sticky_dl {
	position: sticky;
	top: 120px;
  }

  @media (max-width: 896px) {
	.wrapper_dl {
	  flex-direction: column;
	  margin: 20px auto 0;
	}
	.wrapper_dl .main_dl {
	padding: 0;
	width: 850px;
	max-width: 100%;
	}
	.wrapper_dl .main_dl .dl_container {
	padding: 0 30px;
	}
	.wrapper_dl .sidebar_dl {
	width: auto;
	max-width: 100%;
	padding-right: 0;
	}
	.wrapper_dl .sidebar_dl .mktoForm .mktoFormRow .mktoField {
	width: 100% !important;
	}  
  }

/*--------------------------------------------

利用規約

--------------------------------------------*/
#terms01 { padding: 100px 0;}
#terms01 .termsArea{ margin:0 auto;}
.doubleBord{border-bottom: solid 1px #222222; padding-bottom: 10px; }
.doubleBord::before{ content: ""; display: inline-block; position: absolute; left: 0; bottom: -1px; width: 20%; border-bottom: solid 1px #2AAB9F;}
.termsList li{list-style-position: inside;list-style-type: decimal;padding-left:1em;text-indent:-1em;}
.termsList2 {margin-left: 2em;}
.termsList2 li {list-style-type: none; counter-increment: cnt; padding-left: 0; text-indent: 0;}
.termsList2 li::before {content: "(" counter(cnt) ") "; margin-left: -2em;}
/*====================================================================
slick
====================================================================*/

.prev_icon,.next_icon{ position: absolute; top: 50%; transform: translate(0,-50%); width: 30px; height:60px; z-index: 1;}
.prev_icon{ left: 0;}
	.next_icon{ right: 0; }

/*--------------------------------------------

ご利用ガイド

--------------------------------------------*/
#guide{padding-top: 50px;}
#guide .cardItem{width: 1011px; max-width: 96%; margin: 0 auto 100px; box-sizing: border-box; padding: 3%; display: block; text-align: center;}
#guide .cardItem::before{content: ''; font-size: 40px; position: absolute;  z-index: 0; top: 0;  left: 0;  width: 120px; height: 120px;  padding-top: 20px;  padding-left: 10px;  background: #2AAB9F;  clip-path: polygon(0% 0, 100% 0, 100% 0, 0 100%);}
#guide .cardItem::after{position: absolute;  z-index: -1;  bottom: 0;  right: 0;  width: 120px;  height: 120px; background: #2AAB9F;  clip-path: polygon(0% 100%, 100% 0, 100% 100%, 0 100%);}
#guide .cardItem.bgno{padding: 2% 0; border-radius: 10px; text-align: left;}
#guide .cardItem.bgno::before{background: none;}
#guide .cardItem.bgno::after{background: none;}
#guide .w700{width: 700px; margin:0 auto; max-width: 90%;}
#guide .guideArea{display: flex; flex-wrap: nowrap; justify-content: center;}
#guide .guideItem{background: #fff; border-radius: 10px; box-shadow: 0px 0px 10px rgba(0,0,0,0.3); width:48%; padding: 3%; box-sizing: border-box; text-align: center;}
#guide .guideItem h3 span{display: block; clear: both;}
#guide .cardItem .guideItem img{margin: 6% auto; width: 80%; max-width: initial; height: auto;}
#guide a.cmnBtn{background-color:#2AAB9F; background-image: url(../img/guide/icon_pdf.svg); background-repeat: no-repeat; background-position: left 30px center; background-size: 30px auto; font-size: 30px; padding: 5% 5% 5% 8%; border-radius: 55px; text-align: center;}
#guide a.cmnBtn:hover{background-color: #0B8379;}
#guide .movieArea .movieHead{ width: 100%; background:white;  box-shadow: 0 0 10px rgb(0 0 0 / 20%);  border-radius: 10px;  z-index: 3;}
#guide .movieArea{display: block;}
#guide .movieArea h2{border-bottom: 1px solid #999999; padding: 0 5px 10px; margin-bottom: 30px;}
#guide .movieArea .movieItem h3{font-weight: 700; display: block; padding: 0; margin-bottom: 15px; color: #000;}
#guide .movieArea .movieItem h3 span{width:80px;  height:60px; line-height: 60px;  border-radius: 0 5px 5px 0;  text-align: center; background: #2AAB9F; color: #fff; padding: 10px 20px; margin-right: 15px;}
#guide .movieArea .movieItem ul{display: block; margin: 10px 5.7% 2%;}
#guide .movieArea .movieItem ul ol{margin-bottom: 15px; padding-left: 10px; border-left: 3px solid #2AAB9F;}
#guide .movieArea .movieItem ul li{margin-bottom: 10px;}
#guide .movieArea .movieItem ul li a{margin: 0 10px 0 10px; text-decoration: underline; color: #17756c;}
#guide .movieArea .movieItem ul li a:hover{text-decoration: none;}
div.vid_contents {
width: 100%;/*背景色を横幅いっぱいに広げる*/
text-align: center;
margin: auto;
padding: 4% 4% 4% 4%;/*ここで動画の周りの余白を調整*/
background: #ffffff;/*余白の背景色*/
}
video.vid_main {
width: 100%;
max-width: 896px;/*PC版での最大幅*/
}
#guide .premium {
    border-radius: 5px;
    background: #222 url(../img/top/crown-solid.svg) no-repeat top 50% left 20px;
    background-size: 26px 20px;
    color: #fff;
    display: block;
    margin: 0 auto 50px;
    padding: 10px 20px 10px 55px;
    text-align: center;
    width: 240px;
}

@media screen and (max-width: 1024px) {
	#guide a.cmnBtn{
		background-position: left 7% center;
		background-size: 30px auto;
		font-size: 20px;
	}
}

@media screen and (max-width: 896px) {
	#guide a.cmnBtn{
		background-position: left 5% center;
		background-size: 20px auto;
		font-size: 2.8vw;
		padding: 4%;
		border-radius: 50px;
	}
	#guide .movieArea h3{
		font-size:20px;
		padding: 1% 2%;
	}
}
@media screen and (max-width: 568px){
	#guide .cardItem.bgno{margin-bottom: 50px;}
	#guide .guideArea{
		flex-wrap: wrap;
		flex-direction: column;
		padding: 3%;
	}
		
	#guide .guideItem{
		width: 100%;
		max-width: 100%;
		margin: 0 0 3%;
		padding: 5%;
		}
	#guide .guideItem:last-of-type{
		margin-bottom: 0;
	}
	#guide a.cmnBtn{
		background-size: 20px auto;
		font-size: 4vw;
	}
}

/* ------------------------- 有料版 ご利用ガイド ------------------------- */
#guide_faq {padding: 130px 0 100px;}
#guide_faq .cardItem{width: 100%; box-shadow: 0 0 10px rgb(0 0 0 / 20%); padding: 0;}
#guide_faq .cardItem::before{content:"";}
#guide_faq .questionArea::after{ content: ""; display: block; position: absolute; z-index: 0; top: -177.37px; right: 50px; width: 221.92px; height: 177.37px; background: url(../img/top/05-01.svg) no-repeat center center; background-size: cover; clip-path: none;}

#guide_faq .questionArea{ padding:40px; }
#guide_faq .questionArea .questionItem{ width: 100%; background:white; box-shadow: 0 0 10px rgb(0 0 0 / 20%); border-radius: 10px; z-index: 3;  }
#guide_faq .questionTop{ border-bottom: solid 1px #CCCCCC; }
#guide_faq .questionTop,#guide_faq .answerBottom{ padding: 20px 0; }
#guide_faq .questionTop .bgGRE,#guide_faq .answerBottom .bgYE{ width:80px; height:60px;line-height: 60px; border-radius: 0 5px 5px 0; text-align: center;}
#guide_faq .questionTop .txt16,#guide_faq .answerBottom .txt16{ width:calc(100% - 80px); padding-left:20px;padding-right: 30px;}
#guide_faq .txtCent span.txtGRE{ text-decoration: underline;}
#guide_faq .w300{ margin:0 auto;}

@media screen and (max-width: 568px){
	#guide_faq {padding: 50px 0 40px;}
	#guide_faq .cardItem {width: 100%; margin: 0 auto 40px; padding: 0; }
	#guide_faq .questionArea::after {width: 85px; height: 68px; top: -68px; right: 0;}
	#guide_faq .questionTop, #guide_faq .answerBottom {padding: 15px 0;}
	#guide_faq .answerBottom {align-items: flex-start;  -webkit-box-align: start;	-ms-flex-align: start;}
	#guide_faq .questionTop .bgGRE, #guide_faq .answerBottom .bgYE {width: 40px; height: 40px; line-height: 40px; }
	#guide_faq .questionTop .txt16, #guide_faq .answerBottom .txt16 {width: calc(100% - 40px);}
	#guide_faq .questionArea {padding: 20px;}
}


/*--------------------------------------------

特定商取引法に基づく表記

--------------------------------------------*/
#law01 { padding: 100px 0;}
.low_table {display: block; width: 100%;}
.low_table th{width: 25%; box-sizing: border-box; padding: 25px 0; border-bottom: 1px solid #17756c; text-align: left; line-height: 1.5em;}
.low_table td{width: 75%; box-sizing: border-box; padding: 25px 0 25px 20px; border-bottom: 1px solid #999; line-height: 1.5em; }

@media screen and (max-width: 568px){
	.low_table th{width: 100%; display: block; box-sizing: border-box; padding: 20px 0 0; border-bottom: 0;}
	.low_table td{width: 100%; display: block; box-sizing: border-box; padding: 10px 0 20px; border-bottom: 1px solid #999; }
	
}