@charset "UTF-8";
.--btn{margin: 30px auto; text-align: center;}
.--btn a{width:380px; height:62px;}
.--link{padding: 1px 0 30px 0;}
.--link-btm{padding: 30px 0 0 0;}
.--link-btm .--btn{margin-bottom: 0;}
.--link-btm .button{background: #f77c04; /*background:#d66f03;*/ color:#fff; border: solid 3px #fff;}

main.lp section{scroll-margin-top: 72px; color: #4b5764; position: relative;}
main.lp section img{width: 100%;}

main.lp section#kv{padding-top: 72px; text-align: center; line-height: 1.5; max-width: 900px; margin: 0 auto;}
main.lp section#kv .title{padding-top:60px; font-size: 30px; font-weight: 700; color:#f77c04;}
main.lp section#kv h2{font-size: 30px; padding-top:30px; margin-bottom: 30px; font-weight: 700;}
main.lp section#kv h2 span{background: linear-gradient(transparent 70%, #ffe641 70%);}
main.lp section#kv h2 + p{font-size:24px; line-height: 1.6; padding-bottom: 60px;}

main.lp section#merit{background: #fef8c0;/*#fffaf0*/ padding-bottom: 70px; /*clip-path: polygon(0 0, 100% 0, 100% calc(100% - 100px), 50% 100%, 0 calc(100% - 100px));*/}
main.lp section#merit::before,
main.lp section#merit::after{content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 100px; background: rgba(244, 243, 238, 0.95);/*rgba(244, 243, 238, 0.95);*/}
main.lp section#merit::before{clip-path: polygon(0 0, 0 100px, 50% 100px);}
main.lp section#merit::after{clip-path: polygon(50% 100px, 100% 0, 100% 100px);}
main.lp section#merit h2{padding-top:60px;}
/*main.lp section#merit h2{font-size: 30px; color: #f77c04; padding:60px 0 30px 0; margin-bottom: 30px; font-weight: 700; text-align: center;}
main.lp section#merit h2 span{display: inline-block; position: relative;}
main.lp section#merit h2 span::before, main.lp section#merit h2 span::after{content: ""; position: absolute; top: 50%; width: 8px; height: 160%; border-top: solid 2px #4b5764; border-bottom: solid 2px #4b5764;transform: translate(0, -50%);}
main.lp section#merit h2 span::before{left:-50px; border-left: solid 2px #4b5764;}
main.lp section#merit h2 span::after{right:-50px; border-right: solid 2px #4b5764;}*/
main.lp section#merit p{line-height: 1.6;}
main.lp section#merit p.pic{max-width: 700px; margin: 0 auto 60px auto;}
main.lp section#merit p.pic img{border-radius: 20px;}
main.lp section#merit ul{display: grid; grid-template-columns: 1fr 1fr; gap: 30px; max-width: 900px; margin: 0 auto 50px auto; counter-reset: count;}
main.lp section#merit ul li{border-radius: 20px; background: #fff; padding: 20px;}
main.lp section#merit ul li:last-child{ grid-column: 1 / -1; justify-self: center; width: calc(50% - 15px);}
main.lp section#merit ul li h3{font-size:24px; line-height: 1.6; font-weight: 700; margin-bottom: 20px; position: relative; padding-left: 2em; display: block; border-bottom: #4b5764 1px solid; padding-bottom: 20px;}
main.lp section#merit ul li h3::before{counter-increment: count; content: counter(count); background-color: #f77c04; color: #fff; width: 1.8em; height: 1.8em; line-height: 1.8em; border-radius: 50%; text-align: center; font-size: 0.9em; font-weight: bold; position: absolute; left: 0; top: 0;}
main.lp section#merit ul li strong{color: #f77c04;}

main.lp section#job{background:rgba(244, 243, 238, 0.95); padding-bottom: 60px;}
main.lp section#job h2{padding-top:60px; /*font-size: 30px;margin-bottom: 30px; font-weight: 700; text-align: center;*/}
/*main.lp section#job h2 span{background: linear-gradient(transparent 70%, #ffe641 70%);}*/
main.lp section#job h2 + p{font-size:24px; line-height: 1.6; padding-bottom: 60px; text-align: center;}
/*main.lp section#service{background:rgba(244, 243, 238, 0.95);}*/
main.lp section#job .note{margin: 30px auto 0 auto; max-width: 1000px; color:#6b7784; font-weight: normal; font-size: 16px; line-height: 1.4;}

main.lp section#fit{padding-bottom: 60px;}
main.lp section#fit h2{font-size: 30px; padding:60px 0 30px 0; margin-bottom: 30px; font-weight: 700; text-align: center;}
main.lp section#fit ul{display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 900px; margin: 0 auto 50px auto; text-align: center;  line-height: 1.4;}
main.lp section#fit ul img{margin-bottom: 10px;}
main.lp section#fit .--btn{margin: 0;}

main.lp section#workstyle{background: #e5f5ec; padding-bottom: 40px;}
/*main.lp section#workstyle h2{font-size: 30px; padding:60px 0 30px 0; margin-bottom: 30px; font-weight: 700; text-align: center;}*/
main.lp section#workstyle h2{padding-top: 60px;}
main.lp section#workstyle .section-title__en,
main.lp section#workstyle h3{color:#09908f/*color:#3f9061;*/}
main.lp section#workstyle .box{display: flex; max-width: 700px; flex-direction: row; background: #fff; border-radius: 10px; padding: 20px; margin:0 auto 30px auto;  line-height: 1.5;}
main.lp section#workstyle .box h3{min-width: 96px; width: 96px;}
main.lp section#workstyle .--btn{margin: 50px 0 30px 0;}
main.lp section#workstyle strong{color: #f77c04;}

main.lp section#flow{padding: 60px 0;}
main.lp section#flow .--btn{margin:50px 0 0 0;}
/*main.lp section#flow{background: #fef8c0; padding: 60px 0;}
main.lp section#flow .container{display: grid; grid-template-columns: repeat(2, 1fr); gap:60px; text-align: center; max-width: 1000px;}
main.lp section#flow h2{font-size: 30px; color:#09908f; / *color: #f77c04;* / padding:60px 0 0 0; margin-bottom: 40px; font-weight: 700; text-align: center;}
main.lp section#flow h2 span{background: linear-gradient(transparent 70%, #ffe641 70%);}
@media (max-width: 960px) {
    main.lp section#flow .container{gap:30px;}
    main.lp section#flow h2{font-size: 24px;}
}
main.lp section#flow .flow {border: 3px solid #f77c04; border-radius: 20px; margin-bottom: 20px;}
main.lp section#flow .flow > li {padding: 30px; text-align: center;}
main.lp section#flow .flow.--flow-l > li{padding: 37.5px 30px;}
main.lp section#flow .flow > li:not(:last-child) {border-bottom: 3px solid #f77c04;position: relative;}
main.lp section#flow .flow > li:not(:last-child)::before,
main.lp section#flow .flow > li:not(:last-child)::after{content: "";border: solid transparent;position: absolute;top: 100%;left: 50%;transform: translateX(-50%);}
main.lp section#flow .flow > li:not(:last-child)::before{border-width: 22px;border-top-color: #f77c04;}
main.lp section#flow .flow > li:not(:last-child)::after{border-width: 18px;border-top-color: #fff;}
main.lp section#flow .flow > li:nth-last-child(1){background: #fffb9f; border-radius: 0px 0px 16px 16px;}

main.lp section#flow .flow em{font-size: 14px; color: #fff; background: #f77c04; padding: 5px 10px; display: block; border-radius: 20px; max-width: 50%; margin: 0 auto 10px auto; text-align: center; font-style: normal;}
main.lp section#flow .--btn{margin-bottom:0;}*/

main.lp section.message .section-title{font-size:30px; color: #1a1a1a;}
/*main.lp section.message .section-title .section-title__en{margin: 0;}*/

@media (max-width: 767px) {
.--link .--btn{margin: 20px auto;}
.--btn a{width:90%; height:52px;}
.--link-btm{padding: 20px 0 0 0;}

main.lp section{scroll-margin-top: 36px;}

main.lp section#kv .container{padding: 0; max-width: auto;}
main.lp section#kv .title{font-size: 20px;}
main.lp section#kv h2{font-size: 20px;}
main.lp section#kv h2 + p{font-size:18px; text-align: left; padding: 0 32px 60px 32px;}
main.lp section#kv h2 + p br{display: none;}

main.lp section#merit{padding-bottom: 30px;}
main.lp section#merit::before,
main.lp section#merit::after{height: 50px;}
main.lp section#merit::before{clip-path: polygon(0 0, 0 50px, 50% 50px);}
main.lp section#merit::after{clip-path: polygon(50% 50px, 100% 0, 100% 50px);}
/*main.lp section#merit h2{font-size: 24px; padding-bottom: 0;}
main.lp section#merit h2 span::before{left:-30px;}
main.lp section#merit h2 span::after{right:-30px;}*/
main.lp section#merit p.pic{margin-bottom: 30px;}
main.lp section#merit p.pic img {border-radius: 10px;}
main.lp section#merit ul{grid-template-columns: 1fr; gap: 20px; margin: 0 auto 40px auto;}
main.lp section#merit ul li{border-radius: 10px;}
main.lp section#merit ul li h3{font-size:20px;}
main.lp section#merit ul li:last-child{width: 100%;}

/*main.lp section#job h2{font-size: 20px;}*/
main.lp section#job h2 + p{font-size:18px; text-align: left; padding: 0 20px 60px 20px;}
main.lp section#job h2 + p br{display: none;}
main.lp section#job .note{font-size: 14px;}

main.lp section#fit h2{font-size: 20px; padding-bottom: 0;}
main.lp section#fit ul{grid-template-columns: repeat(1, 1fr); gap: 20px;}
main.lp section#fit ul img{margin-bottom: 10px; padding: 15px 25% 0 25%;}
main.lp section#fit ul li{border-radius: 10px; border: #4b5764 1px solid; padding-bottom: 15px;}
main.lp section#fit ul li br{display: none;}
main.lp section#fit .--btn{margin-top: 40px;}

main.lp section#workstyle h2{font-size: 20px; padding-bottom: 0;}
main.lp section#workstyle .box{flex-direction: column}

main.lp section#flow .--btn{margin:0;}
/*main.lp section#flow h2{font-size: 20px; padding-bottom: 0;}
main.lp section#flow .container{display: grid; grid-template-columns: repeat(1, 1fr); gap:0;}
main.lp section#flow .flow > li,
main.lp section#flow .flow.--flow-l > li{padding: 30px 20px 20px 20px;}
main.lp section#flow .flow {border-radius: 10px;}
main.lp section#flow .flow > li:nth-last-child(1){border-radius: 0px 0px 6px 6px;}*/

main.lp section.message{padding: 48px 0;}
main.lp section.message .section-title{font-size:24px;}

}