* { font-family:"Hiragino Kaku Gothic Pro",HiraKakuPro-W3,"ヒラギノ角ゴ Pro W3","メイリオ", Meiryo,"MS P ゴシック",verdana,sans-serif; }
html, body { width:100%; min-width:1000px; font-size:16px; }
h1, h2, h3, h4, h5, h6 { font-weight:normal; }
a { text-decoration:none; color:#000; }
li { list-style:none; }
img { display:block; }

.mt0 { margin-top:0 !important; }
.mt60 { margin-top:60px !important; }

/*******************************************************************/
/*                          common header                          */
/*******************************************************************/

header{ width:100%; }
#crumArea { width:100%; position:fixed; background-color:#111; z-index:2000; }
#crum { width:1000px; color:#fff; margin:0 auto; display:flex; align-items:center; padding:10px 0; }
#crumName { font-size:0.7rem; font-weight:normal; padding-right:50px; letter-spacing:0.1em; text-shadow:0 2px 2px #333; }
.crumLink { display:flex; align-items:center; font-size:0.7rem; color:#fff; }
.crumLink > li:not(:last-child) { margin-right:10px; }
.crumLink > li:not(:last-child)::after { content:'\f101'; font-family:fontawesome; padding-left:10px; }
.crumLink a { color:#fff; }
#headArea { width:1000px; margin:0 auto; padding:85px 0 30px; display:flex; justify-content:space-between; align-items:center; border-bottom:5px solid #333; }
#link25 { margin:15px 0 0 30px; transition:0.2s; opacity:0.8; }
#link25:hover { transition:0.2s; opacity:1; }
.mode { position:relative; }
.mode .on { opacity:0; position:absolute; top:0; transition:0.5s; z-index:100 }
.mode:hover .on { opacity:1; transition:0.5s; }

#headLinks { width:1000px; display:flex; justify-content:space-between; align-items:center; margin:50px auto 0; padding-bottom:30px; border-bottom:1px dotted #333;}

#subNaviArea { display:flex; justify-content:space-between; align-items: center; }
/*******************************************************************/
/*                          common header                          */
/*******************************************************************/


/*******************************************************************/
/*                           common main                           */
/*******************************************************************/
main { width:1000px; margin:50px auto 100px; }
/*******************************************************************/
/*                           common main                           */
/*******************************************************************/


/*******************************************************************/
/*                          common footer                          */
/*******************************************************************/
footer { width:100%; border-top:5px solid #9c1212; background-color:#232329;}
#footCont { width:1000px; height:auto; margin:0 auto; }
#footTopBack { position:relative; width:1000px; left:50%; transform:translate(-50%, -100%); display:flex; justify-content:flex-end; padding-bottom:5px; }
#footTopBack a { font-family: "Arial", sans-serif; color:#fff; text-shadow:0 1px 1px #000; font-size:0.7rem; padding:0.3rem 2rem; background-color:#252525; }
#footTopBack::after { content:''; display:block; clear:both; }
#footLogo { display:flex; justify-content:center; margin-top:10px; padding-bottom:10px; }
#footLogo img { height:60px; }
#footBtmArea { padding-top:30px; }
#footBtmArea > div { display:flex; align-items:center; width:100%;border-bottom:1px dotted #fff; }
#footBtmArea > div:not(:first-child) { margin-top:10px; }
#footBtmArea li:last-child { margin-left:auto; width:20px; height:2px; margin-right:4px; }
#footBtmArea #footLinkCompany li:last-child { border:2px solid #FC0DFF; }
#footBtmArea #footLinkBusiness li:last-child { border:2px solid #9dff51; }
#footBtmArea #footLinkRecruit li:last-child { border:2px solid #2e85ff; }
#footBtmArea #footLinkContact li:last-child { border:2px solid #ffa202; }
#footBtmArea a { font-size:0.9rem; color:#fff;line-height:1.5rem; text-shadow:0 1px 1px #333; padding-left:1.5rem; transition:0.2s; letter-spacing:1px; }
#footBtmArea a::before { content:'\f101'; font-family:fontawesome; padding-right:0.5rem; }
#footBtmArea #footLinkCompany a:hover { color:#FC0DFF; transition:0.2s; }
#footBtmArea #footLinkBusiness a:hover { color:#9dff51; transition:0.2s; }
#footBtmArea #footLinkRecruit a:hover { color:#2e85ff; transition:0.2s; }
#footBtmArea #footLinkContact a:hover { color:#ffa202; transition:0.2s; }
#footLinkArea { margin-top:40px; display:flex; justify-content:space-between; }
.footLink { background-color:#fff; width:calc(1000px / 3 - 15px); font-size:0.9rem; text-align:center; }
.footLinkAnchor { padding:10px 0; display:block; position:relative; height:38px; }
.footLinkAnchor > span:first-child { position:absolute; left:50px; display:inline-block; }
.footLinkAnchor > span:last-child { background-color:#000; font-size:0.75rem; color:#fff; width:65px; position:absolute; right:20px; display:inline-block; }
#footCrArea { margin-top:30px; letter-spacing:0.1em; color:#fff; font-size:0.7rem; text-shadow:0 1px 1px #000; text-align:center; padding:15px 0; background-color:#212123; }
/*******************************************************************/
/*                          common footer                          */
/*******************************************************************/


/*******************************************************************/
/*                           inspi index                           */
/*******************************************************************/
#indexRowi { display:flex; justify-content:space-between; flex-wrap:wrap; }
.indexBlock { display:flex; justify-content:space-between; flex-direction:column; }
.indexBlock:nth-child(n+5) { margin-top:20px; }
.linkBox { display:flex; justify-content:space-between; }
.rowerBox { display:flex; flex-direction:column; justify-content:space-between; }
.rowerBox a:first-child { margin-top:20px; display:block; }
.rowerBox a > span { font-size:0.7rem; color:#999; }
.rowerBox a:hover > span { color:#003f8e; }
.rowerBox div:first-child { font-size:0.75rem; color:#333; width:194px; line-height:1.5; margin-bottom:1.5rem; transition:0.5s; }
.indexBlock:hover .indexPurple { color:#9a0d7c; transition:0.5s; }
.indexBlock:hover .indexGreen { color:#6E8C02; transition:0.5s; }
.indexBlock:hover .indexOrange { color:#E85D00; transition:0.5s; }
.indexBlock:hover .indexBlue { color:#003f8e; transition:0.5s; }
/*******************************************************************/
/*                           inspi index                           */
/*******************************************************************/


/*******************************************************************/
/*                          inspi common                           */
/*******************************************************************/
.ts03 { transition:0.3s; }
.ts05 { transition:0.5s; }

#cateLink { margin-top:50px; }
#cateLink::after { content:''; clear:both; display:block; }
#cateLink > a { display:block; position:relative; float:left; }
#cateLink > a * { color:#fff; }
#cateLink > a:nth-child(n+2) { margin-left:5px; }
#cateLink > a:nth-child(n+5) { margin-top:5px; }
#cateLink > a > div { position:absolute; top:5px; left:10px; display:flex; flex-direction:column; }
#cateLink > a > div > div { display:flex; font-size:2rem; }
#cateLink > a > div > div > span { font-size:1rem; padding-top:0.5rem; letter-spacing:0.05rem; }
#cateLink > a > div > span:first-of-type { line-height:1; }
#cateLink > a > div > span:last-of-type { font-size:0.5rem; padding-top:0.5rem; padding-right:5px; }

#contents { display:flex; justify-content:space-between; width:1000px; margin:0 auto; margin-top:50px; }
#leftCont { width:700px;  }
.titleBar { width:100%; background-color:#333; margin-bottom:40px; padding:7px 0 5px; color:#fff; display:flex; justify-content:space-between; align-items:center; }
.titleBar > span:first-child { font-size:1.1rem; padding-left:15px; }
.titleBar > span:last-child { font-size:0.65rem; padding-right:15px; font-family:"arial", serif; font-weight:lighter; }
#rightCont { width:275px;  }
.outline { margin-top:20px; display:flex; align-items:flex-start; padding-bottom:3px; border-bottom:1px dotted #333; color:#333; font-size:0.75rem; }
.outline > span:first-child { width:130px; margin-left:10px; }
.outline > span:last-child { }
.outline a { display:inline-block; margin-left:-0.3rem; padding:1px 0.3rem; color:#333; transition:0.5s; }
.outline a:hover { color:#fff; background-color:#9a0d7c; transition:0.5s; }

#sideTitleBar { width:100%; background-color:#333; height:38px; display:flex; justify-content:flex-end; align-items:center; }
#sideTitleBar > span { color:#fff; font-size:0.7rem; margin-right:1rem; }
#sideArc { margin-top:40px; }
#sideArc * { font-size:0.7rem; color:#333; }
#sideArc h1, #sideArc p:not(:last-child) { text-align:right; padding-right:1rem; letter-spacing:0.1em; }
#sideArc img { margin-top:20px; box-shadow:0 3px 2px -1px #999; max-width:100%; }
#sideArc p:last-child { margin:20px 5px 0; letter-spacing:0.1em; }

.leadText, .leadTxt { margin:40px 0.5rem 0; font-size:0.75rem; padding-bottom:40px; line-height:1.6; color:#333; }

.arrowTitle { color:#333; font-size:0.75rem; margin-top:40px; margin-left:5px; display:flex; align-items:center; }
.arrowTitle::before { content:'\f0da'; font-family:fontawesome; background-color:#333; color:#fff; padding:1px 4px 2px 6px; font-size:0.5rem; margin-right:0.5rem; }
.arrowTxt { margin:15px 5px 0; color:#333; line-height:1.6; letter-spacing:0.1rem; font-size:0.75rem; }
.arrowSubTitle { color:#333; font-size:0.75rem; margin-top:20px; margin-left:25px; display:flex; align-items:center; }
.arrowSubTitle::before { content:'\f0da'; font-family:fontawesome; background-color:#333; color:#fff; padding:1px 4px 2px 6px; font-size:0.5rem; margin-right:0.5rem; }
.arrowSubTxt { margin:15px 5px 0 25px; color:#333; line-height:1.6; letter-spacing:0.1rem; font-size:0.75rem; }

.lb-data .lb-caption{ font-weight:normal !important; }
/*******************************************************************/
/*                          inspi common                           */
/*******************************************************************/


/*******************************************************************/
/*                          inspi company                          */
/*******************************************************************/
.comLinkBtn { margin:60px auto 0; display:table; font-size:1rem; padding:0.5rem 1.5rem; transition:0.3s; border:1px solid #333; }
.comLinkBtn:hover { background-color:#333; color:#fff; }

#greetingBox { margin:0 0.5rem 3rem; display:flex; justify-content:space-between; align-items:flex-start; }
#greetingBox * { font-size:0.75rem; color:#333; }
#greetingBox > article { margin-left:1rem; }
#greetingBox span { display:block; padding-top:1.5rem; }
#philosophyTxt { padding-left:8.6rem; text-indent:-8rem; color:#333; margin:2.5rem 0 3rem; line-height:2.5rem; font-size:1rem; font-weight:bold; }
#behavior { padding-left:8.6rem; text-indent:-8rem; color:#333; margin:2.5rem 0; line-height:1.5rem; font-size:1rem; font-weight:bold; }
.behavior { margin-bottom:30px; }
.behavior:last-of-type { margin-bottom:0; }
.behavior h1 { font-size:0.9rem; font-weight:bolder; color:#333; padding-left:5px; }
.behavior span { font-size:0.75rem; color:#333; padding-left:5px; }

#chart { margin-bottom:60px; }

.mediaArea { width:688px; height:auto; padding-left:5px; padding-top:40px; border-bottom:1px dotted #333; display:block; }
.mediaTitleArea { display:flex; justify-content:space-between; align-items:center; }
.mediaTitleArea * { font-size:0.75rem; }
.mediaTitle::before { content:'\f0da'; font-family:fontawesome; background-color:#333; color:#fff; padding:1px 4px 1px 6px; border-radius:3px; }
.mediaTxt { font-size:0.75rem; color:#333; margin-top:20px; padding-bottom:30px; line-height:1.8; }

.infoArea { width:688px; height:auto; padding-left:5px; margin-bottom:40px; border-bottom:1px dotted #333; }
.infoArea:last-of-type { border-bottom:none; margin-bottom:0; }
.infoArea:last-of-type .infoTxt { padding-bottom:0; }
.infoArea * { font-size:0.75rem; color:#333; }
.infoTitle::before { content:'\f0da'; font-family:fontawesome; background-color:#333; color:#fff; padding:1px 4px 1px 6px; border-radius:3px; }
.infoTxt { margin-top:20px; padding-bottom:20px; line-height:1.8; }

.accessMapArea { color:#333; font-size:0.75rem; margin:40px 15px 20px 0; padding-left:5px; display:flex; align-items:center; }
.accessMapArea h3 { color:#E85D00; font-weight:900; font-size:0.75rem; margin-right:15px; }
.accessMapArea span { margin-right:15px; }
.accessMapArea a { padding-left:10px; padding-right:10px; padding-right::9px; transition:0.5s }
.accessMapArea a:hover { color:#fff; background-color:#E85D00; transition:0.5s; }
.accessMapArea + div { width:100%; overflow:hidden; border:1px solid #333; }

.marginTxtLead { color:#333; font-size:0.75rem; }
.marginTxtLead > div:last-child { text-align:right; }
.marginTxt { display:flex; justify-content:space-between; border-bottom:1px dotted #333; padding:20px 0 0.3rem; color:#333; font-size:0.75rem; }
.marginTxt span:first-child { text-indent:-1.5rem; padding-left:1.5rem; max-width:60%; }
.marginTxt span:last-child { text-align:right; padding-right:0.75rem; }
.marginTxt:nth-child(6) { display:block; border:none; }
.marginRowSub { padding-top:1rem; }
.marginRowCareer { padding-top:6px; }
.marginRowTable { display:flex; justify-content:flex-end; }
.marginRowTable table { width:calc(100% - 1.5rem); border-collapse:collapse; }
.marginRowTable table td { text-align:center; vertical-align:middle; border:1px solid #333; font-size:0.75rem; }
.graphLead { font-size:0.75rem; margin-top:3rem; }
.graphLead::before { content:'■'; padding-right:5px; }
.graph, .graphNotes { margin-top:20px; display:flex; justify-content:flex-start; align-items:center; width:100%; }
.graph .innerGraph { height:30px; display:flex; align-items:center; justify-content:center; color:#fff; font-size:0.75rem; word-break:normal; }
.graph .pay { width:70.1%; background-color:#f1a1a1; }
.graph .insu { width:11%; background-color:#6a98ff; }
.graph .holi { width:4%; background-color:#59bd40; }
.graph .train { width:2%; background-color:#ff973e; }
.graph .other { width:10.9%; background-color:#bc81fd; }
.graph .profit { width:2%; background-color:#769a72; }
.graphNotes .innerGraph {display:flex; font-size:0.75rem; margin-right:10px; }
.graphNotes .pay::before { content:'■'; color:#f1a1a1;  padding-right:5px; }
.graphNotes .insu::before { content:'■'; color:#6a98ff;  padding-right:5px; }
.graphNotes .holi::before { content:'■'; color:#59bd40;  padding-right:5px; }
.graphNotes .train::before { content:'■'; color:#ff973e;  padding-right:5px; }
.graphNotes .other::before { content:'■'; color:#bc81fd;  padding-right:5px; }
.graphNotes .profit::before { content:'■'; color:#769a72;  padding-right:5px; }

#salesBox { line-height:1.2rem; }
.sales { display:inline-block; width:110px; text-align:right; }
/*******************************************************************/
/*                          inspi company                          */
/*******************************************************************/


/*******************************************************************/
/*                         inspi business                          */
/*******************************************************************/
.archivesImgArea { display:flex; justify-content:space-between; align-items:center; margin:15px 5px 0 5px; }
.hybridArea { display:flex; justify-content:space-between; align-items:flex-start; margin-top:20px; }
.hybridArea > img { width:250px; }
.hybridArea > span { width:390px; font-size:0.75rem; line-height:1.6; letter-spacing:0.1em; color:#333; }

/************** handeld occupation 20210928 add start **************/
#handle { margin:20px 0.5rem 0; color:#333; font-size:0.75rem; letter-spacing:0.1em; line-height:1.6; }
#handleHeader > p:not(:last-child) { text-align:right; }
#handleHeader > p:last-child { text-align:justify; margin:1rem 0 1.5rem; }
.handleTitle { text-align:center; margin-top:3rem; }
.handleTitle > p:last-child { text-decoration:underline; margin:0.5rem 0 2rem; }
.handleContTitle { font-weight:bold; font-size:0.8rem; color:#999; margin-bottom:0.75rem; }
.handleContText { margin-bottom:1.5rem; text-align:justify; }
.handleContText > span { padding-bottom:0.25rem; display:block; }
.handleSubContTitle { font-size:0.75rem; font-weight:bold; text-indent:-0.4rem; color:#777; margin:15px 0; }
.handleSubContHeader::before { content:'\f192'; font-family:fontawesome; padding-right:0.2rem; }
.handleSubContText { padding-left:0.8rem; margin:0.25rem 0 0.75rem; text-align:justify; }
.handleSubContText > span { display:block; }
.handleSubContText > span:nth-child(odd) { font-weight:bold; padding-left:0.8rem; padding-bottom:0.25rem; }
.handleSubContText > span:nth-child(even) { padding-left:1.6rem; padding-bottom:0.75rem; }
.handleSubContText > span:last-child { padding-bottom:0.75rem; }
/************** handeld occupation 20210928 add end   **************/

/*******************************************************************/
/*                         inspi business                          */
/*******************************************************************/


/*******************************************************************/
/*                          inspi recruit                          */
/*******************************************************************/
.recruitArea { margin-top:20px; }
.recruitArea > div { display:flex; align-items:center; font-size:0.75rem; color:#333; margin-top:10px; padding:0 0 3px 3px; line-height:1.6; border-bottom:1px dotted #333; }
.recruitArea > div > div { width:95px; }
.recruitLine a { display:inline-block; margin-left:-0.3rem; padding:1px 0.3rem; color:#333; transition:0.5s; }
.recruitLine a:hover { color:#fff; background-color:#9a0d7c; transition:0.5s; }

.lowerForm { margin:30px 5px 0; padding-top:40px; border-top:1px dotted #333; font-size:0.75rem; color:#333; }
.lowerForm div { line-height:1.6; letter-spacing:0.1em; }
.lowerForm a { margin:1rem 0 0 -0.7rem; padding:0.2rem 0.5rem; transition:0.5s; display:inline-block; color:#333; }
.lowerForm a:hover { background-color:#E85D00; color:#fff; }
/*******************************************************************/
/*                          inspi recruit                          */
/*******************************************************************/


/*******************************************************************/
/*                          inspi contact                          */
/*******************************************************************/
.sitemapArea { display:flex; align-items:center; flex-wrap:wrap; margin-top:20px; padding-bottom:1rem; border-bottom:1px dotted #333; line-height:1.6; letter-spacing:0.1em; color:#333; font-size:0.75em; }
.sitemapArea:last-child { display:block; border-bottom:none; }
.sitemapArea:last-child > a { display:block; margin-bottom:0.3rem; }
.sitemapArea > a { margin-left:30px; }
.sitemapArea > a::before { content:'\f0da'; font-family:fontawesome; background-color:#333; color:#fff; padding:1px 4px 2px 6px; font-size:0.5rem; margin-right:0.5rem; }
.sitemapArea > a:hover { color:#F39; }
.sitemapArea > a.company:hover { color:#9a0d7c; }
.sitemapArea > a.business:hover { color:#6E8C02; }
.sitemapArea > a.recruit:hover { color:#003f8e; }
.sitemapArea > a.contact:hover { color:#E85D00; }
/*******************************************************************/
/*                          inspi contact                          */
/*******************************************************************/


/*******************************************************************/
/*                           inspi form                            */
/*******************************************************************/
#form { width:100%; margin-top:30px; outline:none; }
#form * { outline:none; }
#form .formRow { display:flex; justify-content:flex-start; align-items:center; position:relative; }
#form .formRow:nth-child(n+2) { margin-top:1rem; }
#form .formRow:nth-child(5) { align-items:flex-start; }
#form .formRow > label { width:140px; color:#333; line-height:1.6; letter-spacing:0.1em; font-size:0.75rem; }
#form .formRow > select { opacity:0; position:absolute; top:0; width:195px; height:100%; left:140px; }
#form .formRow > #selectLabel { color:#333; font-size:0.75rem; width:195px; display:flex; justify-content:space-between; align-items:center; border:1px solid #333; border-radius:5px; padding:0.5rem; background-color:#f5f5f5; }
#form .formRow > #selectLabel::after { content:'\f078'; font-family:fontawesome; }
#form .formRow > input { border:2px solid #666; color:#333; padding:0.5rem; width:180px; font-size:0.75rem; background-color:#f5f5f5; }
#form .formRow > textarea { border:1px solid #666; color:#333; padding:0.5rem; width:180px; font-size:0.75rem; background-color:#f5f5f5;width:50%; }
#form #formBtnRow { display:flex; justify-content:center; margin:30px auto; }
#form #formBtnRow button { padding:0.3rem 1rem; font-size:0.75rem; border:1px solid #333; }
#form #formBtnRow button:first-child { margin-right:2rem; color:#e01638; }
#form #formBtnRow button:last-child { color:#200bbf; }
#form .formRow .confirm { font-size:0.75rem; color:#333; }
#confirm { font-size:0.75rem; color:#333; }

.confirm_err { margin:30px 5px 0; }
.err_box { margin-top:1rem; }
.err_box > * { color:#e01638; font-size:0.75rem; padding-bottom:0.5rem; }
.errBack { margin:40px auto 0; display: block; padding: 0.3rem 0.7rem; font-size: 0.75rem; border: 1px solid #333; color: #333; }

#homeBack { display:flex; justify-content:space-between; align-items:center; width:13vw; margin:40px auto 0; padding:0.3rem 0.7rem; font-size:0.75rem; color:#333; border:1px solid #333; transition:0.5s; }
#homeBack::before { content:'\f100'; font-family:fontawesome; }
#homeBack::after { content:'\f100'; font-family:fontawesome; visibility:hidden;}
#homeBack:hover { color:#fff; background-color:#333; transition:0.5s; }

#emailAlert, #nameAlert { font-size:0.75rem; color:#f00; margin-left:3rem; }
/*******************************************************************/
/*                           inspi form                            */
/*******************************************************************/


/*******************************************************************/
/*                           pagination                            */
/*******************************************************************/
.pagination { display:flex; justify-content:flex-end; align-items:center; margin:40px 0; }
.pagination > li:last-child > a { margin-right:0; }
.pagination > li > * { display:block; font-size:0.7rem; text-align:center; width:40px; margin:0 0.3rem; padding:0.2rem 0; }
.pagination > li > span { color:#fff; background-color:#333; border:1s #333; }
.pagination > li > a { color:#333; border:1px solid #333; }
.pagination > li > a:hover { color:#fff; background-color:#333; }
.pagination > li > a.pageNext, .pagination > li > a.pageLast, .pagination > li > a.pagePrev, .pagination > li > a.pageFirst { padding:0.2rem 0.4rem; display:flex; justify-content:space-between; align-items:center; width:53px; }
.pagination > li > a.pageNext::after { content:'\f105'; font-family:fontawesome; }
.pagination > li > a.pageLast::after { content:'\f101'; font-family:fontawesome; }
.pagination > li > a.pagePrev::before { content:'\f104'; font-family:fontawesome; }
.pagination > li > a.pageFirst::before { content:'\f100'; font-family:fontawesome; }
/*******************************************************************/
/*                           pagination                            */
/*******************************************************************/
