@charset "utf-8";

/* ------------------------------------------------------------------------------------------------
	スタイルシート初期化
--------------------------------------------------------------------------------------------------- */
* { margin:0; padding:0; box-sizing:border-box; }
article,aside,canvas,details,figcaption,figure,header,footer,main,menu,nav,section,summary { display:block; }
body,input,textarea,select,button,.gf,h1,h2,h3,h4,h5,h6 { font-family:'Lato','Noto Sans JP',-apple-system,BlinkMacSystemFont,'Noto Sans JP','メイリオ',Meiryo,sans-serif; }
body,input,textarea,select { font-display:block; font-style:normal; font-weight:400; }
body,input,textarea,select,a { color:#474544; }
body { position:relative; font-size:17px; line-height:1.8em; letter-spacing:0.1em; background:#fff; -webkit-text-size-adjust:none; }

table { border-collapse:collapse; border-spacing:0; } ol,ul { list-style:none; }
address,caption,cite,code,dfn,em,th,var,.normal { font-style:normal; font-weight:400; }
h1,h2,h3,h4,h5,h6 { font-size:100%; } h1,h2,h3,h4,h5,h6,th,strong,.strong { font-weight:700; }
q:before,q:after { content:''; } abbr,acronym { border:0; } caption,th { text-align:left; }
input,textarea,select,button { font-size:100%; -webkit-appearance:none; appearance:none; }
input:focus, a:hover, a:active { outline:0; }
@keyframes onAutoFillStart { from {} to {} }
input:-webkit-autofill { animation-name:onAutoFillStart; transition: background-color 50000s ease-in-out 0s; }
input::placeholder, textarea::placeholder { color:#bbb; }
textarea { resize:vertical; }

img { max-width:100%; border:0; vertical-align:bottom; image-rendering:-webkit-optimize-contrast; image-rendering:crisp-edges; -ms-interpolation-mode:bicubic; image-rendering:optimizeQuality; }
a { outline:0; text-decoration:none; vertical-align:baseline; background:transparent; }
a, a img, a:before, a:after, input[type="submit"], .anime { -webkit-transition:all .4s ease; transition:all .4s ease; }
a:hover img { opacity:0.7; -webkit-opacity:0.7; }

.cfix:after { content:"."; display:block; height:0; font-size:0; clear:both; visibility:hidden; }
.cfix { display:inline-block; } * html .cfix { height:1%; } .cfix { display:block; }
.mf { font-family:'メイリオ',Meiryo,sans-serif; font-display:block; font-weight:400; font-size:15px; line-height:1.8em; }
.eng { font-family:'Lato',cursive; font-weight:700; }
/* kinto-sans */

/* ------------------------------------------------------------------------------------------------
	レイアウト
--------------------------------------------------------------------------------------------------- */
main, .inner { position:relative; }
main { overflow:hidden; }
.zbox { position:relative; }
.inblock { display:inline-block; }
.inner, .inbox, .inwrap { max-width:100%; }
.inner, .inbox { margin:0 auto; }
.inner { width:1100px; padding:0 50px; }
.box1600 { width:1600px; } .box1500 { width:1500px; } .box1400 { width:1400px; } .box1300 { width:1300px; } .box1200 { width:1200px; }
.box1100 { width:1100px; } .box1000 { width:1000px; } .box900 { width:900px; } .box850 { width:850px; } .box800 { width:800px; } .box750 { width:750px; } .box700 { width:700px; }
.box600 { width:600px; } .box550 { width:550px; } .box500 { width:500px; } .box400 { width:400px; } .box350 { width:350px; } .box300 { width:300px; }
.box250 { width:250px; } .box200 { width:200px; } .box150 { width:150px; } .box100 { width:100px; } .box0 { width:auto; }

/* ------------------------------------------------------------------------------------------------
	共通要素
--------------------------------------------------------------------------------------------------- */

/* タイポグラフィ
------------------------------------------------------------*/

.headline2, .headline3, .headline4, .headline5, .headline6 { line-height:1.4em; margin-bottom:25px; letter-spacing:1px; }
.headline2 { font-size:1.6em; text-align:center; letter-spacing:2px; margin-bottom:30px; }
.headline3 { font-size:1.25em; position:relative; padding-left:20px; color:#474544; }
.headline3:before { display:block; content:""; position:absolute; top:0; bottom:0; left:0; width:3px; -webkit-border-radius:5px; border-radius:5px; background:#474544; }
.headline4, .headline5 { font-size:1.15em; letter-spacing:2px; }
.headline4 { background:#f5f5f5; padding:17px 22px; }
.headline5 { border-bottom:solid 1px #ccc; padding-bottom:10px; }
.headline6 { font-size:1.1em; margin-bottom:10px; }
.headline6:before { font-family:"Font Awesome 5 Free"; margin-right:10px; content:"\f35a"; font-weight:700; }

.h2 { font-size:1.765em; line-height:1.5em; text-align:center; margin-bottom:1.5em; }
.h2::after { content:""; display:block; width:140px; max-width:100%; height:5px; -webkit-border-radius:10px; border-radius:10px; background:#f39802; margin:0.5em auto 0; }
.white .h2::after { background:#fff; }
.h2l { text-align:left; font-size:1.5em; line-height:1.5em; margin-bottom:1em; }
.h2l::after { margin-left:0; }
.h3 { position:relative; padding-left:1em; }
.h3::before { content:""; display:block; position:absolute; top:2px; bottom:2px; left:0; -webkit-border-radius:5px; border-radius:5px; background:#f39802; width:4px; }
.h4 { font-size:1.1em; margin-bottom:0.5em; }
.h4::before { content:"■"; margin-right:0.5em; color:#f39802; }

.inner { counter-reset:numline; }
.numline { font-size:1.1em; margin-bottom:0.4em; }
.numline::before { counter-increment:numline; content:counter(numline)'. '; }

.telbox { position:relative; padding-left:1.5em; display:inline-block; }
.telbox::before { display:block; font-family:"Font Awesome 5 Free"; font-weight:900; content:"\f879"; position:absolute; top:0.5em; left:0; }
.telbox .num { font-size:2em; font-weight:700; line-height:1em; display:block; letter-spacing:0.02em; }

.slash { display:inline-block; position:relative; padding:0 1.5em; }
.slash::before, .slash::after { position:absolute; bottom:0; }
.slash::before { content:"＼"; left:0; }
.slash::after { content:"／"; right:0; }

.postline { border-left:solid 3px #000; color:#000; padding:0 0 0 20px; }
.postline .title { font-size:1.25em; line-height:1.6em; }

/* ブロック
------------------------------------------------------------*/
.container { padding:70px 0; }
.container50 { padding:50px 0; }
.container40 { padding:40px 0; }

.toparrow { position:relative; }
.toparrow::before { content:""; display:block; position:absolute; top:0; left:50%; margin-left:-50px; border:solid 0 transparent; border-width:50px 50px 0; border-top-color:#fff; }

.leftbox  { float:left; margin-right:40px; }
.rightbox { float:right; margin-left:40px; }
.floatbox { overflow:hidden; }
.max500 { max-width:500px; } .max400 { max-width:400px; }
.max300 { max-width:300px; } .max200 { max-width:200px; }

.white, .anchor-white a { color:#fff; }
.gray, .anchor-gray a { color:#666; }
.red, .anchor-red a { color:#da372a; }
.orange, .anchor-orange a { color:#f39802; }
.orange2 { color:#fc6907; }
a.anchors, .anchors a { color:#f39802; text-decoration:underline; }
.anchor-opc a:hover, a.anchor-opc:hover, a.anchors:hover, .anchors a:hover { opacity:0.7; -webkit-opacity:0.7; }
.anchor-opc a:hover img, a.anchor-opc:hover img { opacity:1; -webkit-opacity:1; }

.maker { box-shadow:0 -0.5em 0 rgba(243,152,2,0.15) inset; }

.bgimg { display:block; background:no-repeat center center; background-size:cover; }
.bgimg-contain { background-size:contain; }
.bgimg40 { padding-top:40%; }
.bgimg50 { padding-top:50%; }
.bgimg60 { padding-top:60%; }
.bgimg70 { padding-top:70%; }
.bgimg100 { padding-top:100%; }
.circlebox { -webkit-border-radius:1000px; border-radius:1000px; overflow:hidden; }

.laterbg, .laterimg { position:relative; }
.laterbg::after { display:block; content:""; position:absolute; top:0; bottom:0; left:0; right:0; background:#f5f5f5; animation:laterbg 0.7s infinite alternate; -webkit-transition:all 1s ease; transition:all 1s ease; z-index:5; }
.laterbg.show::after { animation:none; -webkit-opacity:0; opacity:0; }
.laterimg .img { display:-webkit-flex; display:flex; -webkit-align-items:center; align-items:center; -webkit-justify-content:center; justify-content:center; position:absolute; top:0; bottom:0; left:0; right:0; overflow:hidden; -webkit-opacity:0; opacity:0; }
.laterimg.show .img { -webkit-opacity:1; opacity:1; animation:laterimg 0.5s; }
.laterimg .img img { max-width:none; }
.laterimg .img[data-type="yoko"] img { height:100%; }
.laterimg .img[data-type="tate"] img { width:100%; }
@keyframes laterbg { 0% { background:#f5f5f5; } 100% { background:#eee; } }
@keyframes laterimg { 0% { opacity:0; } 100% { opacity:1; } }

.bg-dark { background:#000; color:#fff; }
.bg-gray { background:#eee; }
.bg-light { background:#fcf6ee; }
.bg-yellow { background:#fdf7dc; }
.bg-lred { background:#fdf4f4; }
.bg-orange { background:#fda502;
/*
	background:-webkit-linear-gradient(-45deg, #f39802 0%,#fda502 100%);
	background:linear-gradient(135deg, #f39802 0%,#fda502 100%);
*/
}
.toporange { box-shadow:0px 70px 0px #fda502 inset; }
.bg-white { background:#fff; }

hr { display:block; clear:both; border:none; margin-bottom:1em; }
.inside0  { padding: 0px; }	.next0  { margin-bottom: 0px; }
.inside5  { padding: 5px; }	.next5  { margin-bottom: 5px; }
.inside10 { padding:10px; }	.next10 { margin-bottom:10px; }
.inside15 { padding:15px; }	.next15 { margin-bottom:15px; }
.inside20 { padding:20px; }	.next20 { margin-bottom:20px; }
.inside25 { padding:25px; }	.next25 { margin-bottom:25px; }
.inside30 { padding:30px; }	.next30 { margin-bottom:30px; }
.inside40 { padding:40px; }	.next40 { margin-bottom:40px; }
.inside50 { padding:50px; }	.next50 { margin-bottom:50px; }
.inside60 { padding:60px; }	.next60 { margin-bottom:60px; }
.inside70 { padding:70px; }	.next70 { margin-bottom:70px; }
.inside-x { padding-top:0 ! important; padding-bottom:0 ! important; }
.inside-y { padding-left:0 ! important; padding-right:0 ! important; }
.margR { margin-right:0.4em; } .margL { margin-left:0.4em; }
.left { text-align:left; } .center { text-align:center; } .right { text-align:right; }

.opc2 { opacity:0.2; -webkit-opacity:0.2; }
.opc5 { opacity:0.5; -webkit-opacity:0.5; }
.opc7 { opacity:0.7; -webkit-opacity:0.7; }

.big0 { font-size:1.125em; }
.big1 { font-size:1.25em; }
.big15 { font-size:1.35em; }
.big2 { font-size:1.5em; }
.big3 { font-size:1.75em; }
.big0, .big1, .big2, .big3 { line-height:1.4em; }

.small { font-size:0.9em; line-height:1.7em; }
.mini { font-size:14px; line-height:1.7em; }
.nano { font-size:12px ! important; line-height:1.7em; }

/* リスト
------------------------------------------------------------*/
.floatlist > li { float:left; margin:0 2% 2% 0; }
.float2 > li { width:49%; } .float3 > li { width:32%; } .float4 > li { width:23.5%; } .float5 > li { width:18.4%; }
.float2 > li:nth-child(2n), .float3 > li:nth-child(3n),
.float4 > li:nth-child(4n), .float5 > li:nth-child(5n) { margin-right:0; }
.float2 > li:nth-child(2n+1), .float3 > li:nth-child(3n+1),
.float4 > li:nth-child(4n+1), .float5 > li:nth-child(5n+1) { clear:both; }
.float2 > li:nth-last-child(-n+2), .float3 > li:nth-last-child(-n+3),
.float4 > li:nth-last-child(-n+4), .float5 > li:nth-last-child(-n+5) { margin-bottom:0; }

.marg0 > li { margin:0; } .marg3 > li { margin:0 3% 3% 0; } .marg4 > li { margin:0 4% 4% 0; }
.marg0.float2 > li { width:50%; } .marg0.float3 > li { width:33.333%; }
.marg0.float4 > li { width:25%; } .marg0.float5 > li { width:20%; }
.marg3.float2 > li { width:48.5%; } .marg3.float3 > li { width:31.333%; }
.marg3.float4 > li { width:22.75%; } .marg3.float5 > li { width:17.6%; }
.marg4.float2 > li { width:48%; } .marg4.float3 > li { width:30.666%; }
.marg4.float4 > li { width:22%; } .marg4.float5 > li { width:16.8%; }

.list li { line-height:1.3em; margin-bottom:5px; padding-left:1.6em; position:relative; }
.list li:last-child { margin-bottom:0; }
.list li:before { position:absolute; top:0; left:0; }
.checklist li:before { font-family:"Font Awesome 5 Free"; content:"\f00c"; font-weight:700; font-size:0.9em; color:#f39802; }
.circlelist li { padding-left:1.25em; }
.circlelist li:before { font-family:"Font Awesome 5 Free"; content:"\f111"; font-weight:400; font-size:10px; }
.disclist li:before { font-weight:900; color:#f39802; }
.komelist li { position:relative; padding-left:1.5em; }
.komelist li::before { content:"※"; }

.border { border:solid 1px #ddd; }
.borderlist li { border-bottom:dotted 1px #bbb; padding-bottom:30px; margin-bottom:30px; }
.borderlist li:last-child { border-bottom-width:0; padding-bottom:0; margin-bottom:0; }

.lastno > *:last-child { margin-bottom:0 ! important; }

/* テーブル
------------------------------------------------------------*/
.tbl { width:100%; }
.tbl-border th, .tbl-border td { border:solid 0 rgba(71,69,68,0.1); border-bottom-width:2px; padding:15px 0; vertical-align:top; }
.tbl-border th { border-color:#f39802; font-weight:700; }
.tbl-border td { padding-left:15px; }

.tbl-color th, .tbl-color td { border:solid 1px #ccc; padding:12px; }
.tbl-color th { background:#eee; }
.tbl-company th { width:6em; }

/* ボタン
------------------------------------------------------------*/
.button, .button:hover { text-decoration:none; }
.button { display:block; position:relative; font-weight:700; width:250px; max-width:100%; margin:0 auto; text-align:center; height:60px; line-height:60px; cursor:pointer; background:#000; color:#fff; }
.button-border { border:solid 1px #000; color:#000; background:transparent; line-height:58px; }
.button:hover { opacity:0.7; -webkit-opacity:0.7; -webkit-transform:translateY(5px); transform:translateY(5px); }
.button-left { margin-left:0; }
.button-right { margin-right:0; }

/* ページトップへ
--------------------------------------------------------------------------------*/
.pagetop { cursor:pointer; display:block; position:fixed; bottom:50px; right:50px; width:40px; height:40px; line-height:40px; text-align:center; z-index:200; background:rgba(20,20,20,0.3); color:#fff; font-size:15px; -webkit-border-radius:50px; border-radius:50px; }
.pagetop:before { font-family:"Font Awesome 5 Free"; content:"\f077"; font-weight:700; }
.pagetop:hover { opacity:0.7; -webkit-opacity:0.7; }
.pagetop.hide { -webkit-transform:translateY(40px); transform:translateY(40px); -webkit-opacity:0; opacity:0; }

.labelline { position:relative; height:0; line-height:0; }
.labelline a { position:absolute; top:-60px; }

/* ------------------------------------------------------------------------------------------------
	コンテンツ
--------------------------------------------------------------------------------------------------- */

/* 共通 */
.flex { display:-webkit-box; display:-webkit-flex; display:flex; -webkit-box-pack:center; -webkit-justify-content:center; justify-content:center; -webkit-box-align:center; -webkit-align-items:center; align-items:center; }

/* トップ */
body { padding-top:100px; }
.header { position:fixed; top:0; left:0; right:0; z-index:999; }
.header .box-l { float:left; margin-right:30px; }
.header .box-r { float:right; }
.header .box { height:100px; -webkit-transition:all 0.5s ease; transition:all 0.5s ease; }
.header .menu { float:left; }
.header .menu li { float:left; margin-right:1.5em; }
.header .menu a, .header .btn { display:block; line-height:40px; height:40px; }
.header .menu a:hover { -webkit-opacity:0.7; opacity:0.7; }
.header .btn { float:right; width:200px; max-width:100%; background:#f39802; color:#fff; -webkit-border-radius:50px; border-radius:50px; text-align:center; }
.header.fixed .box { height:80px; }

/* FV */
.fv { position:relative; }

.fv .ls0 { letter-spacing:-0.1em; }
.fv .s { font-size:0.9em; }

.slicks_fv { height:520px; overflow:hidden; }
.slicks_fv.slick-dotted { overflow:visible; }
.slicks_fv { font-size:30px; line-height:1.5em; color:#fff; }
.slidebox { width:100%; }
.slide { padding-top:520px; position:relative; background:no-repeat center center; background-size:cover; }
.slide::before, .slide .wrap { position:absolute; top:0; bottom:0; left:0; right:0; }
.slide::before { display:block; content:""; background:rgba(243,152,2,0.75);
	background:-webkit-linear-gradient(left,rgba(243,152,2,0.75) 0%,rgba(243,152,2,0.25) 100%);
	background:linear-gradient(to right,rgba(243,152,2,0.75) 0%,rgba(243,152,2,0.25) 100%);
}
.slide .wrap { z-index:5; padding:60px 0 150px; }
.slide .copy { margin-bottom:15px; }
.slide .copy span { background:#fff; color:#f39802; display:inline-block; padding:5px 10px 7px; line-height:1em; font-weight:700; }
.slide .title { font-size:2em; font-weight:700; line-height:1.15em; margin-bottom:10px; }

.system { position:absolute; bottom:60px; left:0; right:0; z-index:50; }
.system li {}
.system a { display:block; background:#fff; -webkit-border-radius:7px; border-radius:7px; padding:20px; padding-left:45px; position:relative; font-weight:700; box-shadow:5px 10px 0px rgba(0,0,0,0.1); }
.system .image { position:absolute; top:50%; margin-top:-40px; left:-25px; width:66px; }
.system .copy { font-size:0.9em; line-height:1em; margin-bottom:0.4em; }
.system .name { font-size:1.15em; line-height:1.2em; letter-spacing:0.05em; }
.system a:hover { -webkit-opacity:0.7; opacity:0.7; }
.system a:hover img { -webkit-opacity:1; opacity:1; }

.slick-slide:focus { outline:none; }
.slicks .slick-arrow, .slicks .slick-arrow::before { height:30px; line-height:30px; }
.slicks .slick-arrow { top:50%; width:30px; text-align:center; margin-top:-10px; z-index:50; }
.slicks .slick-arrow::before { color:#fff; font-family:"Font Awesome 5 Free"; font-weight:900; font-size:30px; }
.slicks .slick-prev::before { content:"\f053"; }
.slicks .slick-next::before { content:"\f054"; }
.slicks_fv .slick-prev { left:25px; }
.slicks_fv .slick-next { right:25px; }

.slick-dotted.slick-slider { margin-bottom:0; }
.slick-dots { bottom:-40px; }

.slick-dots li button:before { display:none; }
.slick-dots li button { width:10px; height:10px; -webkit-border-radius:10px; border-radius:10px; padding:0; background:#777; -webkit-opacity:0.4; opacity:0.4; }
.slick-dots li.slick-active button { -webkit-opacity:1; opacity:1; }
.slick-dots li { width:auto; height:auto; margin-left:10px; }

/* 給食業界が抱える課題 */
.nayamis .title { background:#fcf6ee; text-align:center; padding:10px; font-size:1.1em; font-weight:700; position:relative; border:solid 1px #f1d5ae; }
.nayamis .text li { margin-bottom:0; padding-top:12px; padding-bottom:12px; border-bottom:dotted 1px rgba(243,152,2,0.75); }
.nayamis .text li::before { top:12px }
.nayamis .text li strong { color:#f39802; }

/* 選ばれる理由 */
.points {}
.points .box { position:relative; }
.points .image { position:absolute; top:0; width:250px; height:250px; background:#ddd no-repeat center center; background-size:cover; -webkit-border-radius:500px; border-radius:500px; }
.points .group:nth-child(odd) .box { padding-left:290px; padding-right:20px; }
.points .group:nth-child(even) .box { padding-right:290px; padding-left:20px; }
.points .group:nth-child(odd) .image { left:0; }
.points .group:nth-child(even) .image { right:0; }
.points .frame { position:relative; min-height:250px; -webkit-border-radius:7px; border-radius:7px; }
.points .frame::before { content:""; display:block; border:solid 0 transparent; border-width:20px 0; position:absolute; top:50%; margin-top:-20px; }
.points .group:nth-child(odd) .frame::before { left:-20px; border-right:solid 20px #fff; }
.points .group:nth-child(even) .frame::before { right:-20px; border-left:solid 20px #fff; }

.points .title {}
.points .text { font-size:1.1em; }

.flow12 { display:-webkit-box; display:-webkit-flexbox; display:-webkit-flex; display:flex; -webkit-box-lines:multiple; -webkit-flex-wrap:wrap; flex-wrap:wrap; }
.flow12 > li { border-bottom:dotted 1px rgba(243,152,2,0.75); }
.flow12 .list > li { border-bottom:dotted 1px rgba(243,152,2,0.75); padding-bottom:15px; margin-bottom:15px; }
.flow12 .list > li:last-child { border-bottom:none; margin-bottom:0; }

/* 機能紹介 */
.dummy { background:#eee; height:400px; text-align:center; display:-webkit-box; display:-webkit-flex; display:flex; -webkit-box-pack:center; -webkit-justify-content:center; justify-content:center; -webkit-box-align:center; -webkit-align-items:center; align-items:center; }
.options { display:-webkit-box; display:-webkit-flexbox; display:-webkit-flex; display:flex; -webkit-box-lines:multiple; -webkit-flex-wrap:wrap; flex-wrap:wrap; }

/* （お問い合わせ） */
.connect { position:relative; }
.connect::before { content:""; display:block; position:absolute; top:0; bottom:0; left:0; right:0; background:url(../img/_bg.jpg) no-repeat center center; background-size:cover; -webkit-opacity:0.1; opacity:0.1; }
.connect .inner { z-index:10; }
.connect .image { position:absolute; bottom:0; left:0; }
.connect .text { overflow:hidden; position:relative; z-index:5; }
.connect .box { padding-left:300px; }
.connect .frame { -webkit-border-radius:10px; border-radius:10px; background:rgba(221,128,2,0.7); }
.connect .btn { display:block; max-width:100%; line-height:70px; height:70px; background:#fff; -webkit-border-radius:5px; border-radius:5px; text-align:center; font-size:1.35em; font-weight:700; }
.connect .btn::before { font-family:"Font Awesome 5 Free"; font-weight:400; content:"\f0e0"; margin-right:0.5em; color:#f39802; }
.connect .btn:hover { -webkit-opacity:0.7; opacity:0.7; }

/* 導入の流れ */
.flow { counter-reset:flow; line-height:1.5em; }
.flow .box {}
.flow .li { position:relative; padding-left:90px; margin-bottom:50px; }
.flow .icon { position:absolute; top:0; left:0; font-size:50px; width:70px; text-align:center; line-height:1em; }
.flow .icon::after { font-family:"Font Awesome 5 Free"; font-weight:900; content:"\f0d7"; position:absolute; bottom:-35px; left:0; right:0; text-align:center; -webkit-opacity:0.3; opacity:0.3; font-size:0.5em; line-height:1em; }
.flow .li:last-child .icon::after { display:none; }
.flow .step::after { counter-increment:flow; content:counter(flow); }

/* よくあるご質問 */
.faq dt { background:#fff; cursor:pointer; -webkit-transition:all 0.5s ease; transition:all 0.5s ease; padding:25px 60px; position:relative; font-weight:700; }
.faq dt::before, .faq dt::after { color:#f39802; position:absolute; top:25px; font-size:1.2em; }
.faq dt::before { content:"Q"; left:20px; }
.faq dt::after { font-family:"Font Awesome 5 Free"; font-weight:900; content:"\f067"; right:20px; animation:faqafter 0.5s; }
.faq dd { height:0; overflow:hidden; -webkit-opacity:0; opacity:0; -webkit-transition:all .2s ease-out; transition:all .2s ease-out; background:rgba(255,255,255,0.6); box-shadow:0px 1px 0px rgba(243,152,2,0.25) inset; padding:0 60px; }
.faq .open dt::after { content:"\f068"; }
.faq .open dd { display:block; padding:25px 60px; height:auto; -webkit-opacity:1; opacity:1; }
.faq.lock dl:nth-child(n+6) { display:none; }
.faqmore { display:block; width:200px; height:50px; line-height:50px; margin:30px auto 0; -webkit-border-radius:5px; border-radius:5px; background:#474544; color:#fff; text-align:center; cursor:pointer; }
.faqmore:hover { -webkit-opacity:0.7; opacity:0.7; }

/* フォーム
------------------------------------------------------------*/
.forms input, .forms select, .forms textarea { border:none; outline:none; }
.tbl-caption { background:#eee; font-size:1.1em; line-height:1.4em; font-weight:700; padding:15px 20px; }
.forms, .forms table, .forms tbody, .forms caption, .forms tr, .forms th, .forms td { display:block; width:100%; }
.forms th { position:relative; padding-left:50px; line-height:1em; }
.forms th:before { content:"任意"; border:solid 1px transparent; position:absolute; width:40px; height:20px; line-height:18px; font-size:12px; text-align:center; display:block; left:0px; top:0; }
.forms .req th:before { content:"必須"; }
.forms td { border-bottom:solid 1px #ccc; padding:20px 0; margin-bottom:20px; }
.forms td[data-notice]:after { display:block; content:attr(data-notice); font-size:0.8em; color:#999; line-height:1.5em; margin-top:0.5em; }
.forms .cbox { display:block; width:100%; position:relative; }
.forms input[type="text"], .forms textarea, .forms select { display:block; padding:10px 15px; width:100%; background:transparent; }
.forms input[type="text"] { line-height:1em; }
.forms textarea { min-height:6em; line-height:1.5em; overflow:hidden hidden; }
.forms select { cursor:pointer; position:relative; z-index:5; }
.forms .cbox-select:after { font-family:"Font Awesome 5 Free"; content:"\f0d7"; font-weight:700; position:absolute; right:15px; top:8px; font-size:1.25em; color:#aaa; }

.forms .li { display:block; width:100%; position:relative; padding:10px; margin-bottom:10px; }
.forms .li:last-child { margin-bottom:0; }
.forms label { position:relative; display:block; padding-left:23px; }
.forms label:before, .forms label:after { display:block; width:14px; height:14px; position:absolute; left:0; top:50%; margin-top:-7px; text-align:center; }
.forms label:before { content:""; border:solid 1px #aaa; background:#fff; }
.forms .cbox-radio label:before, .forms .cbox-radio label:after { border-radius:50px; }
.forms .cbox-checkbox label:before { border-radius:4px; }
.forms .cbox-radio label:after { content:""; transform:scale(0.6); }
.forms .cbox-checkbox label:after { font-family:"Font Awesome 5 Free"; content:"\f00c"; font-weight:700; margin-top:-12px; left:1px; }
.forms .cbox-ul label:after { opacity:0; -webkit-opacity:0; }
.forms .cbox-ul input:checked + label:after { opacity:1; -webkit-opacity:1; }

.forms .li input { display:block; position:absolute; left:0; top:0; bottom:0; cursor:pointer; width:100%; z-index:5; }
.forms .cbox-radio input, .forms .cbox-checkbox input { opacity:0; -webkit-opacity:0; }

.forms .cbox-date .group:before, .forms .cbox-date .group:after {}
.forms .cbox-date .group[data-before]:before { content:attr(data-before); margin-right:5px; }
.forms .cbox-date .group[data-after]:after { content:attr(data-after); margin-left:5px; }
.forms .cbox-date .group { position:relative; display:inline-block; margin-right:10px; }
.forms .cbox-date .group:last-child { margin-bottom:0; }
.forms .cbox-date input { border:solid 1px #aaa; display:inline-block; width:2.5em; padding:4px 5px; text-align:center; }
.forms .cbox-date input.year { width:3.5em; }

.formBtn { display:block; width:250px; max-width:100%; height:65px; line-height:65px; background:#8fc322; color:#fff; font-weight:700; text-align:center; font-size:1.1em; margin:0 auto; cursor:pointer; }
.formBtn:hover { opacity:0.7; -webkit-opacity:0.7; }
.confBtn::after { content:"確認する"; }
.confBtn[data-state="lock"], .backBtn, .closeBtn { background:#ddd; color:#777; }
.confBtn[data-state="lock"] { pointer-events:none; }
.confBtn[data-state="lock"]::after { content:"入力項目 残り"attr(data-count);  }

.sendGroup { width:500px; max-width:100%; margin:0 auto; display:none; }
.sendGroup li { float:left; margin-right:4%; width:48%; }
.sendGroup li:last-child { margin-right:0; }

.policybox { font-size:0.9em; max-height:300px; padding-right:10px ! important; }

/* 必須・任意ラベル */
.forms th:before { background:#777; color:#fff; }
.forms .req th:before { background:#f39802; }
/* 通常インプット */
.forms .cbox-border, .forms .li,
.forms .cbox-border, .forms .cbox-date input { background:#f5f5f5; border:solid 1px #f5f5f5;  }
/* 必須インプット */
.forms .req .cbox-border, .forms .req .cbox-date input { background:#fcf6ee; border:solid 1px #fcf6ee; }
/* 入力OK */
.forms [data-state="ok"] th:before { background:#8fc322; }
.forms [data-state="ok"] .cbox-border, .forms [data-state="ok"] .cbox-date input,
.forms .cbox-current { background:#f8fcf1; border:solid 1px #8fc322;  }
/* チェック・ラジオボタン */
.forms .cbox-radio label:after { background:#8fc322; border:solid 1px #8fc322; }
.forms .cbox-ul label:after { color:#8fc322; }
.forms .cbox-current label:before, .forms .req .cbox-ul input:checked + label:before { border-color:#8fc322; }
/* プライバシーポリシー */
.policybox {border:solid 1px #ccc; }

/* FORM -> CONF */
.forms[data-state="conf"] input::placeholder, .forms[data-state="conf"] textarea::placeholder { color:transparent; }
.forms[data-state="conf"] .cbox-border, .forms[data-state="conf"] .cbox-date input,
.forms[data-state="conf"] .cbox-ul input:checked + label:before,
.forms[data-state="conf"] .li { border-color:transparent ! important; background:transparent ! important; }
.forms[data-state="conf"] .li { padding:0; margin:0; }
.forms[data-state="conf"] .cbox-ul input:checked + label { padding:0; }
.forms[data-state="conf"] .cbox-ul input:checked + label:after { opacity:0; -webkit-opacity:0; }
.forms[data-state="conf"] .cbox:before { opacity:0; -webkit-opacity:0; }
.forms[data-state="conf"] input, .forms[data-state="conf"] textarea, .forms[data-state="conf"] select { pointer-events:none; }
.forms[data-state="conf"] input[type="text"], .forms[data-state="conf"] textarea, .forms[data-state="conf"] select {  padding:0; }
.forms[data-state="conf"] textarea { resize:none; overflow:visible; }
.forms[data-state="conf"] #policyLine, .forms[data-state="conf"] .confBtn { display:none; }
.forms[data-state="conf"] .sendGroup { display:block; }
.forms[data-state="conf"] .cbox-date input { border:none; padding:0; }
.forms[data-state="conf"] .cbox-date .group[data-before]:before,
.forms[data-state="conf"] .cbox-date .group[data-after]:after { margin:0; }
.forms[data-state="conf"] .cbox-select:after { display:none; }
.forms[data-state="conf"] .cbox-ul input + label { display:none; }
.forms[data-state="conf"] .cbox-ul input:checked + label { display:block; }
.forms[data-state="conf"] td[data-notice]:after { display:none; }
.forms[data-state="conf"] .policybox { display:none; }
#cf7 { display:none; }

.addGraph { position:relative; padding-left:70px; }
.addGraph::before { position:absolute; bottom:0; left:0; font-family:"Font Awesome 5 Free"; font-weight:900; content:"\f200"; font-size:80px; line-height:1em; color:rgba(218,55,42,0.1); }
.addArrow::before { content:"\f30c"; -webkit-transform:rotate(30deg); transform:rotate(30deg); }

.jump { color:#f39802; font-weight:700; box-shadow:0 1px 0 #f39802; }

/* 図1: 流れ  */
.flow0 { font-weight:700; }
.flow0 { text-align:center; }
.flow0 li { display:inline-block; border:solid 2px #f39802; color:#f39802; line-height:1.3em; padding:5px 12px; margin-bottom:20px; margin-right:10px; -webkit-border-radius:4px; border-radius:4px; position:relative; }
.flow0 li::before, .flow0 li::after { content:""; display:block; border:solid 0 transparent; border-width:10px 0; border-left:solid 10px #f39802; position:absolute; top:50%; margin-top:-10px; right:-10px; }
.flow0 li::before {  }
.flow0 li::after { border-left-color:#fff; right:-7px; }
.flow0 li:last-child { margin-right:0; }
.flow0 li:last-child::after, .flow0 li:last-child::before { display:none; }
.draw1 .name { background:#fcf6ee; text-align:center; font-weight:700; padding:7px; margin-bottom:20px; }
.draw1 .text { line-height:1.5em; padding:5px 0; }

/* 図2: 比較テーブル */
.draw2 table { width:100%; }
.draw2 th, .draw2 td { border:solid 2px #efd6b4; font-size:15px; line-height:1.5em; font-weight:700; }
.draw2 th { padding:10px 5px; background:#fcf6ee; }
.draw2 th.name { padding-left:15px; }
.draw2 td { padding:10px 15px; }
.draw2 i { font-size:25px; line-height:1em; }
.draw2 .true { color:#f39802; }
.draw2 .false { color:#ddd; }
.draw2 .name {  }
.draw2 td.name { font-size:1.05em; }
.draw2 .td1, .draw2 .td2 { width:120px; text-align:center; }
.draw2 .td1 {}
.draw2 .td2 {}
.draw2 strong { color:#f39802; }

/* 図3: 業務の比較  */
.draw3 { display:-webkit-box; display:-webkit-flexbox; display:-webkit-flex; display:flex; -webkit-box-lines:multiple; -webkit-flex-wrap:wrap; flex-wrap:wrap; }
.draw3 .group { float:left; font-weight:700; position:relative; }
.draw3 .label { color:#fff; line-height:46px; height:46px; text-align:center; }
.draw3 .group0 { background:#eaf1fc; width:35%; }
.draw3 .group1 { background:#fcf6ee;width:65%; }
.draw3 .group0 .label { background:#154799; }
.draw3 .group1 .label { background:#f39802; }
.draw3 .group0 li:before, .draw3 .group0 .color { color:#154799; }
.draw3 .group1 .color { color:#fc6907; }
.draw3 .group0::before { content:""; display:block; position:absolute; top:0; right:-23px; border:solid 0 transparent; border-width:23px 0; border-left:solid 23px #154799; z-index:5; }

/* 図5: 組み合わせ */
.draw5 { position:relative; }
.draw5::before, .draw5::after { content:""; display:block; position:absolute; bottom:-20px; left:50%; margin-left:-20px; border:solid 0 transparent; border-width:0 20px; border-top:solid 20px #efd6b4; }
.draw5::after { border-top-color:#fff; bottom:-17px; }
.draw5b::before, .draw5b::after { display:none; }

.draw5c .box { float:left; margin-right:30px; }
.draw5c .box:last-child { margin-right:0; }

.master5 { width:100%; table-layout:fixed; position:relative; }
.master5 tr { position:relative; }
.master5 td { border:solid 2px #efd6b4; text-align:center; padding:5px 0; }
.master5a .tr1 td { padding:10px; }
.master5b .tr0 td { padding:5px; }
.master5b td { padding:7px; }

.master5 td[data-label]::before, .master5 td[data-label]::after { position:absolute; top:50%; display:block; }
.master5 td[data-label]::before { content:attr(data-label); left:-45px; background:#f39802; color:#fff; width:50px; text-align:center; height:24px; line-height:24px; margin-top:-12px; font-size:14px; -webkit-border-radius:3px 0 0 3px; border-radius:3px 0 0 3px; }
.master5 td[data-label]::after { content:""; left:5px; border:solid 0 transparent; border-width:12px 0; border-left:solid 12px #f39802; margin-top:-12px; }
.master5 .tr2 td[data-label]::before { background:#8dc21f; } .master5 .tr2 td[data-label]::after { border-left-color:#8dc21f; }
.master5 .tr3 td[data-label]::before { background:#5eafa0; } .master5 .tr3 td[data-label]::after { border-left-color:#5eafa0; }

.master5 .tr0 td, .master .th { background:#fcf6ee; font-weight:700; }
.master5a, .master5b { font-size:0.95em; }
.master5c .tr1 td { padding:0; }

.andmore { display:block; transform:rotate(90deg) translate(-5px,-3px); }

.master5a .hit { margin-bottom:5px; }
.hit { display:inline-block; background:#f5f5f5; width:100px; max-width:100%; text-align:center; -webkit-border-radius:4px; border-radius:4px; font-weight:700; }
.hit1 { background:rgba(243,152,2,0.1); }
.hit2 { background:rgba(141,194,31,0.1); }
.hit3 { background:rgba(94,175,160,0.1); }

/* 図7: 導入前&導入後 */
.grapth { display:-webkit-box; display:-webkit-flexbox; display:-webkit-flex; display:flex; -webkit-box-lines:multiple; -webkit-flex-wrap:wrap; flex-wrap:wrap; }
.grapth .wrap { float:left; border:solid 2px #fff; color:#fff; padding:20px 22px 15px; line-height:1em; position:relative; }
.grapth .wrap0 { background:#5eafa0; border-color:#5eafa0; border-right-color:#fff; }
.grapth .wrap1 { background:#8dc21f; border-color:#8dc21f; border-right-color:#fff; }
.grapth .wrap2 { background:#f39802; border-color:#f39802; }
.grapth .wrap3 { background:#fdf7dc; color:#da372a; border-left-width:0; border-style:dashed; border-color:#f39802; text-align:center; }
.grapth .label { margin-bottom:0.25em; }
.grapth .h { margin-right:-0.5em; }
.grapth .p::before { content:"（"; }
.grapth .p::after { content:"）"; }
.grapth .ip { display:block; position:absolute; background:#da372a; color:#fff; margin-top:-15px; top:-30px; height:30px; line-height:30px; left:0; right:0; padding:0 10px; font-size:16px; text-align:center; }
.grapth .ip::after { content:""; display:block; position:absolute; bottom:-10px; left:50%; margin-left:-10px; border:solid 0 transparent; border-width:0 10px; border-top:solid 10px #da372a; }
[data-req=""] { display:none ! important; }

.grapthAfter { display:-webkit-box; display:-webkit-flexbox; display:-webkit-flex; display:flex; -webkit-box-lines:multiple; -webkit-flex-wrap:wrap; flex-wrap:wrap; }
.grapthAfter li { display:-webkit-box; display:-webkit-flex; display:flex; -webkit-box-pack:center; -webkit-justify-content:center; justify-content:center; -webkit-box-align:center; -webkit-align-items:center; align-items:center; }
.grapthAfter li:nth-child(1) .addGraph::before { left:-20px; }
.grapthAfter li:nth-child(2) .addGraph::before { left:0; }
.grapthAfter .addGraph { padding-left:50px; }

/* 5eafa0 8dc21f f39802 */

/* 図9: フィードバック */
.draw9 { }
.draw9 {}
.draw9 .box { float:left; width:35%; position:relative; background:#f39802; color:#fff; text-align:center; height:80px; line-height:1.5em; display:-webkit-box; display:-webkit-flex; display:flex; -webkit-box-pack:center; -webkit-justify-content:center; justify-content:center; -webkit-box-align:center; -webkit-align-items:center; align-items:center; }
.draw9 .box:nth-child(1) { width:30%; }
.draw9 .box:nth-child(n+2) .text { padding-left:10%; }
.draw9 .text { position:relative; width:100%; }
.draw9 .text::before { content:""; display:block; position:absolute; top:50%; right:-20px; margin-top:-40px; border:solid 0 transparent; border-width:40px 0; border-left:solid 20px #f39802; z-index:1; }
.draw9 .box:nth-child(1) { background:#f2b002; } .draw9 .box:nth-child(1) .text::before { border-left-color:#f2b002; }
.draw9 .box:nth-child(2) { background:#ee9300; } .draw9 .box:nth-child(2) .text::before { border-left-color:#ee9300; }
.draw9 .box:nth-child(3) { background:#ee7800; } .draw9 .box:nth-child(3) .text::before { border-left-color:#ee7800; }
.draw9 .text span { position:relative; display:inline-block; z-index:5; }

/* お客様の声（インタビュー） */
.interview .info { border-bottom:solid 1px #ddd; }
.interview dt { color:#ee7800; font-size:1.2em; font-weight:700; margin-bottom:5px; }
.interview dt::before { font-family:"Font Awesome 5 Free"; font-weight:900; content:"\f068"; margin-right:0.5em; }
.interview dd { margin-bottom:20px; }
.interview dl:last-child dd { margin-bottom:0; }
.interview .voice { height:0; overflow:hidden; -webkit-opacity:0; opacity:0; -webkit-transition:all .2s ease-out; transition:all .2s ease-out; }
.interview.show .voice { height:auto; -webkit-opacity:1; opacity:1; }
.interview .switch { display:block; padding:10px; text-align:center; cursor:pointer; }
.interview .switch:hover { background:#f8ead7; }
.interview .switch::before { font-family:"Font Awesome 5 Free"; font-weight:900; content:"\f078"; margin-right:5px; color:#ee7800; }
.interview .switch::after { content:"開く"; }
.interview.show .switch { display:none; }

/* ------------------------------------------------------------------------------------------------
	アニメーション
--------------------------------------------------------------------------------------------------- */

.scroll, .child, .send { -webkit-transition:all 0.9s ease; transition:all 0.9s ease; opacity:0; transform:translateY(40px); }
.scroll-left, .child-left, .scroll.leftbox { transform:translateX(-40px); }
.scroll-right, .child-right, .scroll.rightbox { transform:translateX(40px); }
.scroll-top, .child-top { transform:translateY(-40px); }
.scroll-bottom, .child-bottom { transform:translateY(40px); }
.scroll-fade { transform:translateX(0); }
.sleft { transform:translateX(40px); }
.sright { transform:translateX(-40px); }
.send { opacity:1; transform:translate(0); }
.send2 { -webkit-transition:all 0.7s ease; transition:all 0.7s ease; }
.block { display:block; }
.kome::before { content:"※"; position:absolute; top:0; left:0; }
.kome { position:relative; padding-left:1.5em; }

.ib { display:inline-block; margin-right:0.5em; }
.sp, .mb { display:none; }
.last { margin-bottom:0 ! important; }
