@charset "UTF-8";
/* CSS Document */
/* ===============================================
common
=============================================== */
body {
 color: #000;
 font-family: "Noto Sans JP", sans-serif;
 font-optical-sizing: auto;
 font-feature-settings: "palt";
 letter-spacing: 1px;
 margin: 0;
 padding: 0;
 font-size: 16px;
 font-weight: 400;
 line-height: 180%;
}
h1, h2, h3, h4, h5, b, strong {
 font-weight: 600;
}
ul, ol, p, figure {
 list-style: none;
 padding: 0;
 margin: 0;
}
a {
 text-decoration: none;
 color: #000;
}
img {
 max-width: 100%;
 width: 100%;
 height: auto;
}
.pc {
 display: none !important;
}
/* ボタン */
.btn {
 padding: 0;
}
.btn a {
 padding: 10px;
 border-radius: 100px;
 text-align: center;
 box-sizing: border-box;
 display: block;
 font-size: 12px;
 font-weight: 500;
}
.btn.btn-g a {
 border: 2px solid #009d3d;
 color: #fff;
 background: #009d3d;
}
.btn.btn-wg a {
 border: 2px solid #009d3d;
 color: #009d3d;
 background: #fff;
}
.btn.btn-wo a {
 border: 2px solid #f98329;
 color: #f98329;
 background: #fff;
}
.btn.btn-or a {
 border: 2px solid #f98329;
 color: #fff;
 background: #f98329;
}
/* btn-line */
.btn-line {
 margin-top: 20px;
 display: flex;
 justify-content: flex-end;
}
.btn-line a {
 font-size: 18px;
 padding: 0 30px 3px 2px;
 background: url("../img/common/arrow-bk.svg") 100% 50% no-repeat;
 background-size: 20px;
 border-bottom: 1px solid;
 color: #000;
 font-weight: 500;
}
/* 見出し */
h2 {
 font-size: 36px;
 margin: 0 0 20px;
 line-height: 120%;
}
h2 small {
 font-size: 30px;
}
h3 {
 font-size: 28px;
 margin: 0 0 20px;
}
/* ページ */
.inner {
 margin: 50px auto;
 width: 100%;
 text-align: center;
 padding: 0 5%;
 box-sizing: border-box;
}
.ttl-txt {
 font-size: 18px;
 font-weight: bold;
}
/* パンくず */
.breadcrumbList {
 list-style: none;
 display: flex;
 margin: 5px 0 10px;
 padding: 0 10px;
 font-size: 12px;
 font-weight: normal;
flex-wrap: wrap;
}
.breadcrumbList li {
 margin: 0 5px;
}
.breadcrumbList li a {
 border-bottom: 1px solid;
}
/* ===============================================
ヘッダー
=============================================== */
.header {
 height: 60px;
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 background: #fff;
 z-index: 999;
box-shadow: 0 0 5px #ccc;
}
.header__container {
 max-width: 100%;
 display: flex;
 justify-content: space-between;
 align-items: center;
 height: inherit;
 padding: 0 15px;
 margin-right: auto;
 margin-left: auto;
}
.header__box .btn-wg {
 margin-right: 10px;
}
.header__box .btn-wg a {
 padding: 5px 10px;
}
.header__logo {
 width: 130px;
}
.header__box {
 display: flex;
 align-items: center;
}
/* header-ul */
.header_ul {
 display: none;
}
/* ハンバーガーボタン */
.hamburger {
 width: 35px;
 height: 35px;
 position: relative;
 appearance: none;
 border: 0;
 padding: 0;
 margin: 0;
 cursor: pointer;
 background: none;
}
.hamburger span, .hamburger span::after, .hamburger span::before {
 position: absolute;
 display: block;
 content: "";
 width: 35px;
 height: 3px;
 background: #009d3d;
 transition: all 0.5s;
}
.hamburger span::before {
 top: -12px;
}
.hamburger span::after {
 bottom: -12px;
}
.hamburger.open span {
 background-color: transparent;
}
.hamburger.open span::before {
 top: 0;
 transform: rotate(45deg);
}
.hamburger.open span::after {
 bottom: 0;
 transform: rotate(-45deg);
}
/* メニュー */
.nav {
 position: fixed;
 top: 60px;
 right: -100%;
 background: #009d3d;
 padding: 5% 8%;
 transition: all 0.5s;
 height: 100vh;
}
.nav__item a {
 display: block;
 font-size: 14px;
 color: #fff;
}
.nav__list {
 margin-bottom: 30px;
}
.nav__list li {
 margin-bottom: 10px;
 list-style: disc;
 margin-left: 1em;
 color: #fff;
}
.nav__list li:first-child {
 margin-bottom: 10px;
 margin-left: 0;
 list-style: none;
}
.nav__list li:first-child a {
 font-weight: 500;
 border-bottom: 1px solid #fff;
 padding-bottom: 10px;
}
.nav.open {
 right: 0;
}
/* ===============================================
main
=============================================== */
main {
 margin-top: 60px;
 overflow: hidden;
}
/* ===============================================
mv
=============================================== */
.mv {
 width: 100%;
 padding: 40px 0;
 background: #f6f6f6;
 align-items: center;
 display: flex;
}
.contents_page {}
.mv_inner {
 padding: 0 5%;
 margin: 0 auto;
}
.mv_inner .txt {
 text-align: center;
}
.mv_inner .txt .copy {
 font-size: 18px;
 font-weight: 600;
 margin: 0 0 10px 0;
}
.mv_inner .txt h2 {
 font-size: 36px;
 letter-spacing: normal;
 margin: 0 0 15px 0;
 line-height: 120%;
}
.toppage .mv_inner .txt h2 {
 font-size: 40px;
}
.toppage .mv_inner .txt h2 rt {
font-size:12px;
}
.mv_inner .txt h2 span {
 color: #f98329;
}
.mv_inner .txt p {
 font-size: 16px;
 font-weight: 500;
 margin: 0;
}
.mv_inner .txt p b {
 color: #f98329;
 font-size: 34px;
}
.mv_inner .img {
 margin: 20px auto 0;
 width: 80%;
}
.toppage .mv_inner .img {
 margin: 20px auto;
}
.mv_inner .btn {
 margin-top: 20px;
}
.mv_inner .btn a {
 padding: 18px 15px;
 background: #009d3d url("../img/common/arrow-w.svg") 95% 50% no-repeat;
 background-size: 20px;
 font-size: 18px;
 font-weight: 500;
}
/* ===============================================
intro
=============================================== */
#intro {}
#intro h2 {
 color: #009d3d;
}
#intro h2 small {
 color: #000;
}
#intro p {
 line-height: 180%;
 text-align: left;
}
/* ttl-area */
.toppage #intro .ttl-area, .toppage #intro .features {
 padding-bottom: 50px;
 margin-bottom: 50px;
 border-bottom: 1px solid #ccc;
}
/* features */
#intro .features ul {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
}
#intro .features ul li {
 width: 48%;
 margin: 5px 0;
}
/* ttl-area */
#intro .merit ul {
 margin: 0;
}
#intro .merit ul li, #merit ul li {
 border-radius: 50px;
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 padding: 10px 20px;
 margin-bottom: 15px;
}
#intro .merit ul li {
 justify-content: space-between;
}
#merit ul li {
 justify-content: flex-start;
}
#intro .merit ul li {
 border: 3px dotted #009d3d;
}
#merit ul li {
 border: 3px dotted #f98329;
 background: #fff;
}
#intro .merit ul li .icon {
 width: 40px;
 height: 40px;
}
#intro .merit ul li p, #merit ul li p {
 margin: 5px 0;
 font-size: 18px;
 font-weight: 600;
}
#intro .merit ul li .num-txt, #merit ul li .num-txt {
 font-size: 24px;
}
#intro .merit ul li .num-txt {
 color: #009d3d;
}
#merit ul li .num-txt {
 color: #f98329;
 margin-right: 30px;
}
/* ===============================================
reason
=============================================== */
#reason {}
#reason h2 {
 color: #000;
 margin: 0 0 30px 0;
}
#reason h2 b, #merit h2 b {
 color: #f98329;
}
#reason h3 {
 line-height: 130%;
 margin: 0 0 10px 0;
}
#reason .reason-box li {
 text-align: left;
 padding-bottom: 50px;
 margin-bottom: 50px;
 border-bottom: 1px solid #ccc;
}
#reason .reason-box li:last-child {
 padding-bottom: 0;
 border-bottom: none;
}
#reason .reason-box li:nth-child(2n) {
 flex-flow: row-reverse;
}
#reason .reason-box .txt-box {}
#reason .reason-box figure {
 margin: 0 0 30px 0;
}
#reason .reason-box li span, #reason .reason-minbox li span, #service_page .merit_point li span {
 font-size: 16px;
 color: #fff;
 border-radius: 5px;
 padding: 3px 3px 5px;
 width: 150px;
 box-sizing: border-box;
 line-height: 100%;
 display: block;
 text-align: center;
 margin: 0 0 10px 0;
}
#reason .reason-box li span, #reason .reason-minbox li span {
 background: #aaa;
}
#reason .txt-list {
 list-style: disc;
 margin-left: 1.5em;
}
#reason .txt-list li {
 display: list-item;
 padding-bottom: 0;
 margin-bottom: 0;
 border-bottom: none;
}
#reason .reason-box .full-txt-box {
background: #f6f6f6;
padding: 10%;
margin: 30px 0 0;
}
#reason .reason-box .full-txt-box h4 {
font-size: 20px;
margin: 0 0 10px 0;
}
#reason .reason-box .full-txt-box dl {
}
#reason .reason-box .full-txt-box dt {
margin: 0;
padding: 10px 0;
border-top: 1px solid #ccc;
}
#reason .reason-box .full-txt-box dd {
margin: 0;
padding: 0 0 10px 0;
border-bottom: 1px solid #ccc;
}

/* ===============================================
case
=============================================== */
#case {
 background: #f6f6f6;
 padding: 50px 0;
}
#case .inner {
 margin: 0 auto;
}
#case .case-container {
 margin: 30px auto 0;
}
#case .case-container .slick-track {}
#case .case-container .slick-slide {
 margin: 0 10px;
}
#case .case-container .case-box {
 border-radius: 20px;
 background: #fff;
 box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
 margin-bottom: 20px;
}
#case .case-container .case-box:last-child {
margin-bottom: 0;
}
#case .case-container .case-box a {
 max-width: 100%;
 width: max-content;
}
#case .case-container .case-box .txt-box {
 padding: 10px 10%;
 text-align: left;
}
#case .case-container .case-box h4 {
 font-size: 18px;
 margin: 0 0 10px 0;
}
#case .case-container .case-box p {
 font-weight: normal;
 line-height: 160%;
}
#case .case-container .case-box .btn-line {
 padding: 0 30px 30px;
 margin-top: auto;
}
#case .case-container .case-box figure {
 margin: 0;
 padding: 0;
}
#case .case-container .case-box img {
 border-radius: 20px 20px 0 0;
}

/* ===============================================
cost
=============================================== */
#cost-plan h2, #cost-cycle h2, #cost-doukon h2 {
 margin: 0 0 10px;
}
#cost .ttl-txt {
 color: #009d3d;
}
/* 表 */
table.cost-list {
 border: 0;
 width: 100%;
 border-spacing: 0;
 margin-top: 20px;
}
table.cost-list th {
 background: #eee;
 padding: 10px;
 border: 1px solid #666;
 width: 35%;
 font-weight: 500;
line-height: 120%;
}
table.cost-list thead {
 clip: rect(0 0 0 0);
 position: absolute;
}
table.cost-list tr {}
table.cost-list td {
 display: block;
 position: relative;
 text-align: right;
 padding: 20px 10px;
 border: 1px solid #666;
 font-size: 20px;
 line-height: 100%;
}
table.cost-list td small {
 font-size: 12px;
}
table.cost-list td::before {
 content: attr(data-label);
 position: absolute;
 left: 10px;
 font-size: 14px;
 color: #666;
}
table.cost-list td.cost::before {
position: absolute;
left: 10px;
top: 15px;
font-size: 14px;
color: #666;
content: "システム\A月額利用料";
white-space: pre;
display: block;
text-align: left;
line-height: 120%;
}
table.cost-list .risk-free th {
 color: #2a83dd;
}
table.cost-list .standard th {
 color: #009d3d;
}
table.cost-list .expert th {
 color: #f13636;
}
table.cost-list .special th {
 color: #9d8100;
}
table.cost-list span {
 color: #f13636;
}
table.cost-list .txt,
table.cost-list .cost {
 background: #fff;
}
table.cost-list tbody th small {
 font-size: 14px;
 color: #000;
 font-weight: normal;
 display: block;
 line-height: 120%;
 margin-top: 5px;
}
table.cost-list .txt, table.cost-list .cost {
 font-size: 24px;
 font-weight: 500;
}
table.cost-list .txt small, table.cost-list .cost small {
 font-size: 18px;
 font-weight: 500;
}
table.cost-list span.min-txt {
color: #000;
font-size: 12px;
font-weight: normal;
display: block;
}

/*commission*/
#cost .sp.cost-list {}
#cost .cost-list.sp, #cost-plan .cost-list.sp {
 margin: 0 auto 10px;
}
#cost .commission, #cost-plan .commission {
 background: #fff7d4;
 letter-spacing: -0.02em;
}
#cost .commission td, #cost-plan .commission td {
 text-align: center;
}
#cost .commission ul li, #cost-plan .commission ul li {
 background: #fff;
 margin-bottom: 10px;
 padding: 10px 5px;
 border-radius: 10px;
 font-size: 14px;
}
#cost .commission b, #cost-plan .commission b {
 font-size: 20px;
 font-weight: normal;
 color: #000;
}
#cost .commission p, #cost-plan .commission p {
 font-size: 14px;
 margin: 10px 0 0 0;
}
/* ===============================================
case_page
=============================================== */
#case_page #case {
background: #fff;
padding: 0;
}
#case_page .case_inner {
background: #f6f6f6;
padding: 50px 0;
}
#case_page #case .inner {
 margin:  30px auto 50px;
}

/*カテゴリ一覧*/
#case_page #case ul.blog_list {
display: flex;
flex-wrap: wrap;
}
#case_page #case ul.blog_list li {
background: #fff;
border-radius: 20px;
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
margin-bottom:30px;
text-align: left;
}
#case_page #case ul.blog_list h3 {
font-size: 18px;
}
#case_page #case ul.blog_list .icatch {
}
#case_page #case ul.blog_list .icatch img {
border-radius: 20px 20px 0 0;
}
#case_page #case ul.blog_list .cat {
color: #aaa;
}
#case_page #case ul.blog_list .txt-box {
margin: 10px 30px;
}
#case_page #case ul.blog_list h3,
#case_page #case ul.blog_list .cat,
#case_page #case ul.blog_list .excerpt {
line-height: 140%;
margin: 0 0 5px;
}
#case_page #case ul.blog_list .excerpt {
margin-top: 10px;
}
#case_page #case ul.blog_list .term-names {
display: inline-block;
}
#case_page #case ul.blog_list .btn-line {
padding: 0;
background: none;
width: auto;
border-radius: 0;
display: flex;
margin: auto 30px 30px;
justify-content: flex-end;
}

/*スライド*/
#case_page h2 {
 text-align: center;
 margin: 0 0 30px 0;
}
#case_page .case-container-big .slick-slide {
 margin: 0 30px;
}
#case_page .case-container-big .case-box {
 background: #fff;
 border-radius: 20px;
 box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
}
#case_page .case-container-big .case-box a {
 padding-top: 30px;
}
#case_page .case-container-big .case-box figure img {
border-radius: 20px 20px 0 0;
}
#case_page .case-container-big .case-box .txt-box {
 padding: 30px;
}
#case_page .case-container-big .case-box .txt-box h4 {
 font-size: 24px;
 line-height: 140%;
 font-weight: 500;
 margin: 0 0 10px 0;
}
#case_page .case-container-big p.company-name {
font-weight: 500;
}
#case_page .case-container-big .case-box .txt-box p.industry {
 color: #aaa;
}
#case_page .btn-line {
 display: inline-block;
 width: 100%;
 color: #fff;
 padding: 10px 0;
 font-size: 18px;
 background: #009d3d url("../img/common/arrow-w.svg") 95% 50% no-repeat;
 background-size: 20px;
 border-radius: 0 0 20px 20px;
 text-align: center;
 font-weight: 500;
}
/* 次へボタン */
#case_page .slick-prev:before, #case_page .slick-next:before {
 opacity: 1 !important;
 color: #000 !important;
 content: "" !important;
 width: 100% !important;
 height: 100% !important;
}
#case_page .slick-prev:before {
 background: url(../img/common/arrow-bk.svg) !important;
 background-size: 100% !important;
 display: inline-block;
 width: 30px !important;
 height: 30px !important;
 transform: scale(-1, 1);
}
#case_page .slick-next:before {
 background: url(../img/common/arrow-bk.svg) !important;
 background-size: 100% !important;
 display: inline-block;
 width: 30px !important;
 height: 30px !important;
}
#case_page .slick-next, #case_page .slick-prev {
 width: 30px;
 height: 30px;
 z-index: 1;
}
#case_page .slick-next {
 right: 5%;
}
#case_page .slick-prev {
 left: 5%;
}

/*・・・*/
.slick-dots li {
width: 15px!important;
height: 15px!important;
}
.slick-dots li button:before {
font-size:8px!important;
top: 10px!important;
}

/*case_page_detail*/
#case_page.case_page_detail .mv {
 height: auto;
 padding: 0;
}
#case_page.case_page_detail .mv_inner {
 display: contents;
}
#case_page.case_page_detail .mv_inner .txt {
 width: 100%;
}
#case_page.case_page_detail .inner {
 margin: 30px auto 50px;
 text-align: left;
}
#case_page.case_page_detail h2 {
 margin: 0;
 padding: 30px 0;
}
#case_page.case_page_detail #intro {
 margin-bottom: 50px;
}
#case_page.case_page_detail h2.ttl-copy {
 text-align: left;
 line-height: 120%;
 padding: 0;
 margin: 5px 0 20px;
 font-size: 28px;
}
#case_page.case_page_detail h2.ttl-copy small {
 line-height: 140%;
 margin: 15px 0 20px;
 font-size: 16px;
display: block;
}
#case_page.case_page_detail p.company-name {
 font-weight: 500;
 font-size: 20px;
 border-left: solid 5px #009d3d;
 padding: 0 0 0 10px;
}
#case_page.case_page_detail #intro picture {
 display: flex;
 margin-bottom: 30px;
}
#case_page.case_page_detail .company-data {
 padding: 5%;
 color: #009d3d;
 background: #f5fbe8;
}
#case_page.case_page_detail .information {
 border-bottom: 1px solid;
 padding-bottom: 30px;
}
#case_page.case_page_detail .information p {
 margin-bottom: 5px;
}
#case_page.case_page_detail .information b {
 font-size: 18px;
}
#case_page.case_page_detail .activities {
 padding-top: 5%;
}
#case_page.case_page_detail .activities span {
 border-radius: 5px;
 padding: 3px 3px 5px;
 background: #009d3d;
 color: #fff;
 display: inline-block;
 line-height: 100%;
}
#case_page.case_page_detail .company-data a,
#case_page.case_page_detail .interview-txt a {
 color: #009d3d;
 border-bottom: 1px solid;
}
#case_page.case_page_detail .interview-box {
 border: 5px solid #f6f6f6;
 margin-bottom: 30px;
}
#case_page.case_page_detail .interview-box-float .interview-txt {
margin: 0;
}
#case_page.case_page_detail .interview-ttl {
 background: #f6f6f6;
 padding: 5%;
}
#case_page.case_page_detail .interview-ttl h3 {
 font-size: 18px;
 margin: 0;
}
#case_page.case_page_detail .interview-ttl h3 span {
 color: #009d3d;
 font-size: 24px;
}
#case_page.case_page_detail .interview-flex {
 margin: 30px 5% 0;
}
#case_page.case_page_detail .interview-flex.h-none {
margin: 30px 5% 0;
}
#case_page.case_page_detail .interview-txt {
 margin: 0 5%;
}
#case_page.case_page_detail .interview-txt {
 margin: 0 5%;
}
#case_page.case_page_detail .interview-flex .interview-txt {
 margin: 0;
}
#case_page.case_page_detail .interview-flex .interview-txt h4 {
 margin: 0 0 10px 0;
}
#case_page.case_page_detail .interview-flex p {}
#case_page.case_page_detail .interview-flex figure {
 display: flex;
 margin: 0 0 30px 0;
 flex-direction: column;
}
#case_page.case_page_detail .interview-txt h4 {
 font-size: 18px;
 margin: 30px 0 10px 0;
}
#case_page.case_page_detail .interview-txt p {
 margin: 0 0 30px 0;
}
#case_page.case_page_detail .interview-txt p strong {
 color: #009d3d;
}
#case_page.case_page_detail .interview-txt p.h-none {
 margin: 30px 0;
}
#case_page.case_page_detail .interview-txt span.txt-accent {
font-size: 24px;
font-weight: bold;
color: #f98301;
background: linear-gradient(transparent 60%, #ff6 60%);
}
/*float*/
#case_page.case_page_detail .interview-float {
padding: 30px 30px 0;
}
#case_page.case_page_detail .interview-float p {
margin: 0 0 30px 0;
}
#case_page.case_page_detail .interview-float figure {
margin: 0 0 15px 0;
}


/* ===============================================
option
=============================================== */
#option {
 background: #f6f6f6;
 padding: 70px 0;
}
#option .inner {
 margin: 0 auto;
}
#option .ttl-txt {
 color: #009d3d;
}
#option ul {
 margin: 30px auto 20px;
}
#option ul li {
 display: flex;
 flex-wrap: wrap;
 width: 100%;
 align-items: stretch;
 box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
 margin-bottom: 15px;
 background: #fff;
}
#option ul li h3, #option ul li p {
 box-sizing: border-box;
 padding: 15px;
 margin: 0;
 font-size: 16px;
}
#option ul li h3 {
 background: #009d3d;
 color: #fff;
 margin: 0;
 width: 35%;
 line-height: 120%;
 display: flex;
 justify-content: center;
 align-items: center;
}
#option ul li p {
 text-align: left;
 width: 65%;
}
/* ===============================================
steps
=============================================== */
#steps .ttl-txt {
 color: #009d3d;
}
#steps ul {
 display: flex;
 flex-direction: column;
 width: 100%;
 margin-top: 50px;
 font-weight: 500;
}
#steps ul li {
 display: flex;
 border-radius: 20px;
 align-items: center;
 line-height: 120%;
 justify-content: center;
 box-sizing: border-box;
 position: relative;
 font-size: 16px;
 margin-bottom: 20px;
 padding: 20px;
}
#steps ul li:nth-child(2) {
 margin-top: 30px;
}
#steps ul li:last-child {
 margin-bottom: 0px;
}
#steps ul li.or-list {
 border: 2px solid #f98329;
}
#steps ul li.gr-list {
 border: 2px solid #009d3d;
 flex-direction: column;
}
#steps ul li figure {
 margin: 0 0 0 5px;
 width: 120px;
}
#steps ul li p {
 margin: 0;
}
/*fukidashi*/
#steps ul li .fukidashi {
 font-size: 16px;
 position: absolute;
 top: -30px;
 left: 15%;
 width: 70%;
 display: inline-block;
 text-align: center;
 color: #FFF;
 border-radius: 50px;
 box-sizing: border-box;
 letter-spacing: -0.02em;
 padding: 10px 30px;
}
#steps ul li .fukidashi:before {
 content: "";
 position: absolute;
 bottom: -13px;
 left: 50%;
 margin-left: -7px;
 border: 7px solid transparent;
 z-index: 0;
}
#steps ul li.or-list .fukidashi {
 background: #f98329;
}
#steps ul li.or-list .fukidashi:before {
 border-top: 7px solid #f98329;
}
#steps ul li.gr-list .fukidashi {
 background: #009d3d;
}
#steps ul li.gr-list .fukidashi:before {
 border-top: 7px solid #009d3d;
}
/*矢印*/
#steps ul li::after {
 content: "";
 position: absolute;
 bottom: -15px;
 left: 50%;
 margin-left: -12.5px;
 z-index: 0;
 background: url(../img/common/arrow-yg.svg) 50% 50% no-repeat;
 background-size: 25px;
 width: 25px;
 height: 25px;
 transform: rotate(90deg);
}
#steps ul li:last-child::after {
 content: none;
}

/* ===============================================
related-services
=============================================== */
#related-services {
background: #f6f6f6;
padding: 50px 0 35px;
}
#related-services .inner {
margin: 0 auto;
}
#related-services ul {
display: flex;
flex-wrap: wrap;
margin: 30px 0 0 0;
}
#related-services ul li {
width: 47%;
margin-right: 3%;
background: #fff;
border-radius: 20px;
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
border: 1px solid #ccc;
margin-bottom: 15px;
}
#related-services ul li a {
display: block;
padding: 10%;
}
#related-services ul li:nth-child(2n) {
margin-right: 0;
}
#related-services h3 {
font-size: 20px;
color: #03792f;
margin: 0 0 10px 0;
}
#related-services p {
text-align: left;
}

/* ===============================================
service_page
=============================================== */
/* intro */
#service_page #intro picture {
 margin: 30px auto 0;
 display: block;
 width: 80%;
}
#service_page .ttl-area b {
 font-size: 20px;
}
/* merit */
#service_page #merit {
 background: #feeddf;
 padding: 50px 0;
}
#service_page #merit .inner {
 margin: 0 auto;
}
#service_page .merit_point {
 margin: 50px auto 0;
 flex-direction: column;
}
#service_page .merit_point li {
 background: #fff;
 border-radius: 20px;
 box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
 width: 100%;
 border: none;
 display: flex;
 flex-direction: column;
 height: auto;
 text-align: left;
 align-items: center;
 padding: 10%;
 margin: 0 0 20px 0;
 box-sizing: border-box;
}
#service_page .merit_point li:last-child {
 margin: 0;
}
#service_page .merit_point .txt-box {
 margin: 0 0 30px 0;
}
#service_page .merit_point li span {
 background: #000;
}
#service_page .merit_point h3 {
 font-size: 28px;
 line-height: 120%;
 margin: 0 0 15px 0
}
#service_page .merit_point p {
 font-size: 16px;
 font-weight: normal;
 margin: 0;
}
#service_page .merit_point .ttl-txt {
 font-size: 18px;
 color: #f98329;
 font-weight: 600;
 margin: 0 0 15px 0;
}
/* ===============================================
service_page reason
=============================================== */
/* mv */
#service_page .mv_inner h2 b {
 font-size: 48px;
 line-height: 100%;
}
#service_page #reason .inner {
 margin: 50px auto 30px;
}
#service_page #reason h3 {
 font-size: 28px;
}
#service_page #reason .reason-box li:last-child {
 padding-bottom: 50px;
 margin-bottom: 50px;
 border-bottom: 1px solid #ccc;
}
#service_page #reason .reason-box .txt-list li {
 padding-bottom: 0;
 margin-bottom: 0;
 border-bottom: none;
}
/* minbox*/
#service_page #reason .reason-minbox {
 display: flex;
 justify-content: center;
 flex-wrap: wrap;
 text-align: left;
}
#service_page #reason .reason-minbox li {
 width: 100%;
 margin-bottom: 20px;
 padding: 8%;
 background: #fff;
 border-radius: 20px;
 box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
 flex-direction: column;
}
#service_page #reason .reason-minbox h3 {
 font-size: 20px;
}
#service_page #reason .reason-minbox li figure {
 margin: 10px auto;
 width: 70%;
}
#service_page #reason .reason-minbox li:nth-child(3) figure {
 width: 100%;
}
#service_page #reason .reason-minbox .txt-list li {
 width: 100%;
 padding: 0;
 background: none;
 border-radius: 0;
 box-shadow: none;
 margin: 0;
 line-height: 140%;
}
#service_page #reason .reason-minbox .txt-list li a {
 border-bottom: 1px solid;
 color: #009d3d;
}
/* youtube*/
#service_page #reason .youtube {
 width: 100%;
 aspect-ratio: 16 / 9;
 margin: 20px auto 10px;
}
#service_page #reason .youtube iframe {
 width: 100%;
 height: 100%;
}
/* price_page*/
#service_page.price_page .cost-box {
 margin: 0;
}
#service_page.price_page .cost-box li {
 border-radius: 50px;
 padding: 15px 20px;
 position: relative;
 border: 3px dotted #009d3d;
 margin: 5px 0;
 font-size: 18px;
 font-weight: 600;
 margin-bottom: 20px;
}
#service_page.price_page .cost-box li:after {
 position: absolute;
 display: inline-block;
 content: "";
 background: url("../img/common/plus-g.svg");
 background-size: 100%;
 height: 40px;
 width: 40px;
 right: calc(50% - 20px);
 bottom: calc(0% - 35px);
}
#service_page.price_page .cost-box li:last-child:after {
 content: none;
}
#service_page.price_page .ttl-txt {
 color: #009d3d;
}
/* cost-plan */
#service_page.price_page #cost-plan {
 background: #f6f6f6;
 padding: 50px 0;
}
#service_page.price_page #cost-plan .inner {
 margin: 0 auto;
}
#service_page.price_page #cost-plan h2 b {
 color: #009d3d;
}
#service_page.price_page #cost-plan h3 {
 display: flex;
 align-items: center;
 justify-content: center;
 color: #009d3d;
 font-size: 24px;
}
#service_page.price_page #cost-plan h3 b {
 font-size: 50px;
 padding-bottom: 15px;
}
#service_page.price_page #cost-plan h3 .icon {
 width: 36px;
 margin-right: 5px;
}
/* cost-cut */
#service_page.price_page .cost-cut {
 margin-top: 50px;
}
#service_page.price_page .cost-cut-box {
 background: #fff;
 border-radius: 20px;
 box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
 display: flex;
 flex-direction: column;
 justify-content: space-between;
 align-items: center;
 padding: 30px;
}
#service_page.price_page .cost-cut-box .txt-box {
 text-align: left;
 line-height: 140%;
}
#service_page.price_page .cost-cut-box .ttl-txt {
 color: #000;
}
#service_page.price_page .cost-cut-box h4 {
 font-size: 28px;
 color: #009d3d;
 margin: 5px 0 20px;
 line-height: 130%;
}
#service_page.price_page .cost-cut-box p {
 font-size: 18px;
}
#service_page.price_page .cost-cut-box ul {
 list-style: disc;
 margin: 5px auto 20px 1.5em;
}
/* cost-cycle */
#service_page #cost-cycle h2 {
 margin: 0 0 10px;
}
#service_page #cost-cycle ul {
 width: 100%;
 margin: 20px auto 0;
}
#service_page #cost-cycle ul li {
 background: #fff;
 border-radius: 20px;
 box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
 margin-bottom: 30px
}
#service_page #cost-cycle .ttl-cycle {
 border-radius: 20px 20px 0 0;
 color: #fff;
 font-weight: 500;
 font-size: 18px;
 padding: 20px;
 line-height: 140%;
}
#service_page #cost-cycle .ttl-cycle span {
 background: #fff;
 border-radius: 5px;
 padding: 5px 10px;
 margin: 0 10px 5px 0;
 display: inline-block;
 font-size: 16px;
 line-height: 100%;
}
#service_page #cost-cycle picture {
 padding: 20px;
 display: inline-block;
}
/* cycle-a */
#service_page #cost-cycle .cycle-a .ttl-cycle {
 background: #009d3d;
}
#service_page #cost-cycle .cycle-a .ttl-cycle span {
 color: #009d3d;
}
/* cycle-B */
#service_page #cost-cycle .cycle-b .ttl-cycle {
 background: #f98329;
}
#service_page #cost-cycle .cycle-b .ttl-cycle span {
 color: #f98329;
}
/* cost-doukon */
#service_page #cost-doukon {
 background: #f6f6f6;
}
#service_page #cost-doukon .inner {
 padding: 50px 5%;
 margin: 0 auto;
}
#service_page #cost-doukon table.cost-list {
 margin: 20px auto 20px
}
#service_page #cost-doukon table td {
 font-size: 24px;
 font-weight: 500;
 background: #fff;
}
#service_page #cost-doukon table td small {
 font-size: 18px;
 font-weight: 500;
}
#service_page #cost-doukon table td p,
#option_page .doukon-cost table td p {
 font-size: 14px;
 font-weight: normal;
}
#service_page #cost-doukon .td-multiple,
#option_page .doukon-cost .th-large {
line-height: 120%;
}
#service_page #cost-doukon table td span,
#option_page .doukon-cost table td span {
font-size: 16px;
color: #fff;
padding: 2px 5px;
background: #000;
line-height: 100%;
border-radius: 3px;
margin-right: 5px;
}
#service_page #cost-doukon table td span.min-txt,
#option_page .doukon-cost table td span.min-txt {
font-size: 16px;
color: #000;
padding: 0;
background: none;
line-height: 100%;
border-radius: 0;
margin: 5px 0;
font-weight: normal;
display: block;
}

/* ===============================================
#faq
=============================================== */
#faq h2 {
 margin: 50px auto;
 text-align: center;
}
/*アコーディオン*/
#faq .toggle {
 display: none;
}
#faq .Label { /*タイトル*/
 padding: 30px 0;
 display: block;
 background: #f6f6f6;
 border-radius: 30px;
 font-size: 16px;
 font-weight: 500;
}
#faq-service-detail .Label { /*タイトル*/
 background: #fff;
}
#faq .Label p {
 padding: 20px 20px 20px 0;
 text-indent: -2em;
 margin-left: 2em;
}
#faq .Label p::before {
 content: 'Q.';
 color: #009d3d;
 font-size: 20px;
 font-weight: 500;
 margin-right: 5px;
}
#faq .Label::before { /*タイトル横の矢印*/
 content: "";
 width: 10px;
 height: 10px;
 border-top: 2px solid #009d3d;
 border-right: 2px solid #009d3d;
 -webkit-transform: rotate(45deg);
 position: absolute;
 top: calc(50% - 5px);
 right: 5%;
 transform: rotate(135deg);
}
#faq .Label, #faq .content {
 -webkit-backface-visibility: hidden;
 backface-visibility: hidden;
 transform: translateZ(0);
 transition: all 0.3s;
 border-radius: 30px;
 text-align: left;
 padding: 0 5%;
}
#faq .content { /*本文*/
 height: 0;
 margin-bottom: 15px;
 overflow: hidden;
}
#faq .content p {
 padding: 20px 0;
 margin-left: 2em;
}
#faq .toggle:checked + .Label { /*開閉時*/
 border-radius: 30px 30px 0 0;
 transition: all .3s;
}
#faq .toggle:checked + .Label p { /*開閉時*/
 border-bottom: 1px solid #cccccc;
}
#faq .toggle:checked + .Label + .content { /*開閉時*/
 height: auto;
 padding: 0 5%;
 transition: all .3s;
 background: #f6f6f6;
 border-radius: 0 0 30px 30px;
 position: relative;
}
#faq-service-detail .toggle:checked + .Label + .content { /*開閉時*/
 background: #fff;
}
#faq .toggle:checked + .Label + .content::before {
 content: 'A.';
 color: #f98329;
 font-size: 20px;
 font-weight: 500;
 margin-right: 5px;
 top: 20px;
 position: absolute;
}
#faq .toggle:checked + .Label::before {
 transform: rotate(-45deg) !important;
}
#faq-service-detail {
 background: #f6f6f6;
 padding: 50px 0;
}
#faq-service-detail .inner {
 margin: 0 auto;
}
#faq p a {
 color: #009d3d;
 border-bottom: 1px solid;
}
/* ===============================================
introduce
=============================================== */
#service_page .application-box span {
 color: #f98329;
}
#service_page .application-box li {
 background: #fff;
 border-radius: 20px;
 box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
 padding: 30px;
 margin-bottom: 15px;
 position: relative;
}
#service_page .application-box li::before {
 position: absolute;
 display: inline-block;
 content: '';
 background: url("../img/common/arrow-bk.svg") 50% 50% no-repeat;
 background-size: 100%;
 width: 35px;
 height: 35px;
 top: calc(0% - 25px);
 left: calc(50% - 17.5px);
 transform: rotate(90deg);
}
#service_page .application-box li:first-child::before {
 content: none;
}
#service_page .application-box li:last-child {
 margin-bottom: 0;
}
#service_page .application-box li h3 {
 margin: 0 0 20px 0;
}
#service_page .application-box li:last-child h3 {
 margin: 0;
}
#service_page .application-box .btn.btn-or {
 margin: 20px auto 0;
}
#service_page .application-box .btn.btn-or a {
 padding: 18px 15px;
 background: #f98329 url("../img/common/arrow-w.svg") 95% 50% no-repeat;
 background-size: 20px;
 font-size: 18px;
}
#service_page .application-box .btn.btn-or a:hover {
 background: #fff url("../img/common/arrow-or.svg") 95% 50% no-repeat;
 background-size: 20px;
}
#service_page .document-box {
 margin: 20px auto 0;
}
#service_page .document-box ul {
 list-style: disc;
}
#service_page .document-box ul li {
 box-shadow: none;
 padding: 0;
 margin-bottom: 0;
 margin-left: 1em;
}
#service_page .document-box ul li::before {
 content: none;
}
#service_page .document-box-g, #service_page .document-box-or {
 border-radius: 20px;
 text-align: left;
 padding: 30px;
 box-sizing: border-box;
}
#service_page .document-box-g {
 border: 2px solid #009d3d;
 margin-bottom: 15px;
}
#service_page .document-box-or {
 border: 2px solid #f98329;
}
#service_page .document-box-or p {
 margin-bottom: 5px;
}
#service_page .document-box-g h4, #service_page .document-box-or h4 {
 font-size: 16px;
 margin: 0 0 5px 0;
}
#service_page .document-box-g h4 {
 color: #009d3d;
}
#service_page .document-box-or h4 {
 color: #f98329;
}
#service_page #faq ol {
 padding: 20px 0;
}
#service_page #faq ol li {
 text-indent: -2em;
 margin-left: 2em;
 margin-bottom: 15px;
}
#service_page #faq .bg-gray {
 background: #e6e6e6;
 padding: 20px;
}
#service_page #faq .bg-gray.bg-gray-m {
 margin: 20px 0;
}
#service_page #faq .bg-gray p {
 padding: 0;
}
#service_page #faq .Label p::before {
 content: none;
}
#service_page #faq .toggle:checked + .Label + .content::before {
 content: none;
}
#service_page #faq .Label p {
 text-indent: 0;
 margin-left: 0;
}
#service_page #faq .content p {
 margin-left: 0;
}
#service_page #faq table {
 width: 100%;
 border-collapse: collapse;
 border-spacing: 0;
 margin: 20px auto 0;
}
#service_page #faq table tr {
 width: 100%;
 border: 1px solid;
}
#service_page #faq table th {
 width: 50%;
 background: #eeeeee;
 border-right: 1px solid;
 border-collapse: collapse;
 border-spacing: 0;
 padding: 15px 20px;
 font-weight: normal;
}
#service_page #faq table td {
 width: 50%;
 background: #fff;
 padding: 10px 20px;
}
#service_page #faq table figure img {
 width: auto;
}
/* ===============================================
option_page
=============================================== */
#option_page img {
 width: auto;
}
#option_page #intro .inner {
 border: none !important;
 padding: 0;
}
#option_page #intro h2 {
 color: #000;
}
#option_page #doukon, #option_page #sms, #option_page #extension, #option_page #advertising {
padding: 0 5%;
}
#option_page #doukon h2, #option_page #sms h2, #option_page #extension h2, #option_page #advertising h2 {
 color: #009d3d;
 display: flex;
 align-items: center;
 justify-content: center;
 flex-direction: column;
 font-size: 32px;
}
#option_page #doukon h2 span, #option_page #sms h2 span, #option_page #extension h2 span, #option_page #advertising h2 span {
 line-height: 100%;
 font-size: 16px;
 padding: 10px;
 border: 3px solid;
 border-radius: 8px;
 margin-bottom: 5px;
}
#option_page .inner {
 border: 10px solid #f6f6f6;
 padding: 5%;
 box-sizing: border-box;
}
#doukon .doukon-box, #sms .sms-box, #advertising .advertising-box {
 margin-top: 50px;
 padding-bottom: 50px;
 border-bottom: 1px solid #ccc;
}
#doukon .doukon-invoice {
 border-bottom: none;
 padding-bottom: 0;
}
#sms .sms-cost {
 border-bottom: none;
 padding-bottom: 0;
}
#doukon .doukon-invoice ul.flex li h4 {
margin-bottom: 10px;
}
#doukon .doukon-invoice ul.flex li p {
text-align: left;
}
#doukon .doukon-invoice figure {
 margin-bottom: 10px;
}
#option_page #merit ul {
 margin: 0;
}
#option_page #merit ul li {
 justify-content: space-between;

}
#option_page #merit ul li:last-child {
margin-bottom: 15px;
}
#option_page #merit ul li .icon {
 width: 40px;
}
#option_page #merit ul li .num-txt {
margin-right:0;
}
#option_page .tool-box {
 text-align: left;
}
.contents_page .tool-box li {
 margin-bottom: 15px;
 padding: 5%;
 background: #fff;
 border-radius: 20px;
 box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
}
.contents_page .tool-box li a {
 display: flex;
}
.contents_page .tool-box li figure {
 display: flex;
 align-items: center;
 justify-content: center;
 margin-right: 20px;
 width:35%;
}
.contents_page .tool-box li p {
 line-height: 140%;
 text-align: left;
}
#option_page .doukon-flow li {
 margin-bottom: 20px;
}
#option_page .doukon-flow li:last-child {
 margin-bottom: 0;
}
#option_page .doukon-cost .ttl-txt {
 color: #009d3d;
}
#option_page table.cost-list {
 width: 100%;
}
#option_page .sms-box .cost-list {
}
#option_page table.cost-list {
 margin: 30px auto 20px
}
#option_page table th {
 font-size: 15px;
 line-height: 140%;
}
#option_page table td {
 font-size: 30px;
 font-weight: 500;
 background: #fff;
}
#option_page table td small {
 font-size: 18px;
 font-weight: 500;
}
#option_page table td p {
 font-size: 14px;
 font-weight: normal;
}
#option_page #extension figure, #option_page #advertising figure {
 margin-top: 20px;
}
#option_page .advertising-box.merit {
 padding-bottom: 0;
 border: none;
}
#option_page .advertising-box.merit #merit ul {
 margin: 0 auto;
}
#option_page .advertising-box.merit #merit ul li:first-child p#option_page .sms-box.merit #merit ul li:last-child p {
 margin: 40px 0 25px;
}
#option_page .sms-box.merit #merit ul li:first-child p.num-txt {
 margin: 20px 0 15px;
}
#option_page .sms-box.steps .steps-list {
}
#option_page .sms-box.steps .steps-list li {
 padding: 8%;
 background: #f6f6f6;
 border-radius: 20px;
 line-height: 120%;
 display: grid;
 grid-template-rows: subgrid;
 grid-row: span 3;
 gap: 10px;
 position: relative;
 margin-bottom: 20px;
}
#option_page .sms-box.steps .steps-list li:last-child {
 margin-bottom: 0px;
}
#option_page .sms-box.steps .steps-list li::after {
 content: "";
 position: absolute;
 bottom: -15px;
 left: 50%;
 margin-left: -12.5px;
 z-index: 0;
 background: url(../img/common/arrow-yg.svg) 50% 50% no-repeat;
 background-size: 25px;
 width: 25px;
 height: 25px;
 transform: rotate(90deg);
}
#option_page .sms-box.steps .steps-list li:last-child::after {
content: none;
}

/* ===============================================
tool_page
=============================================== */
#tool_page.contents_page .tool-box li {
border: 1px solid #ccc;
}
#tool_page #intro .inner {
margin: 50px auto 0;
}
#tool_page #intro h2 {
color: #000;
}
#tool_page #tool-cart {
margin: 0 auto 50px;
}
/*tool-kinds*/
.contents_page .tool-kinds {
margin-top: 10px;
}
.contents_page .tool-kinds .kinds-on,
.contents_page .tool-kinds .kinds-off {
padding: 5px 3px;
color: #fff;
border-radius: 3px;
line-height: 100%;
display: inline-block;
font-size: 12px;
}
.contents_page .tool-kinds .kinds-01.kinds-on {
    background: #f8b551;
}
.contents_page .tool-kinds .kinds-02.kinds-on {
    background: #13b5b1;
}
.contents_page .tool-kinds .kinds-03.kinds-on {
    background: #ea68a2;
}
.contents_page .tool-kinds .kinds-04.kinds-on {
    background: #00a0e9;
}
.contents_page .tool-kinds .kinds-off {
    background: #ccc;
    color: #fff;
}
.contents_page .tool-box li:last-child,
.contents_page #tool-logo .tool-box li:last-child {
margin-bottom: 0;
}
.contents_page #tool-cart .inner {
margin:  30px auto 50px;
}
.contents_page #tool-cart .tool-box {
padding-bottom: 0;
border-bottom: none;
}
#tool_page .tool-box {
border-bottom: 1px solid #ccc;
padding-bottom: 50px;
}
.contents_page #tool-logo .tool-box {
display: flex;
justify-content: left;
flex-wrap: wrap;
padding-bottom: 0;
border-bottom: none;
align-items: center;
}
.contents_page #tool-logo .tool-box li {
    width: 30.333%;
    margin-right: 3%;
    margin-bottom: 10px;
    padding: 0;
    background: #fff;
    border-radius: 20px;
    box-shadow: none;
    border: none;
}
.contents_page #tool-logo .tool-box li:nth-child(3n) {
    margin-right: 0;
}
.contents_page #tool-logo .tool-box li figure {
    display: block;
    margin-right: 0;
    width: 100%;
}
.contents_page #tool-cooperation {
background: #f6f6f6;
padding: 50px 0;
}
.contents_page #tool-cooperation .inner {
margin: 0 auto;
}
.contents_page #tool-cooperation .cooperation-box li {
margin-bottom: 20px;
background: #fff;
border-radius: 20px;
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
}
.contents_page #tool-cooperation .cooperation-box li:last-child {
margin-bottom: 0;
}
.contents_page #tool-cooperation h3 {
color: #fff;
display: block;
font-size: 22px;
border-radius: 20px 20px 0 0;
margin: 0;
padding: 10px 0;
}
.contents_page #tool-cooperation .csv-box h3 {
background: #f8b551;
}
.contents_page #tool-cooperation .api-box h3 {
background: #13b5b1;
}
.contents_page #tool-cooperation li p {
    padding: 5% 8%;
    text-align: left;
}
.contents_page #tool-cooperation .api-flex {
    display: flex;
    justify-content: center;
}
.contents_page #tool-cooperation .api-flex p {
    color: #13b5b1;
    font-weight: 500;
    padding: 5px;
    border: 3px solid;
    border-radius: 5px;
    margin: 0 5px 8%;
}

/* ===============================================
news
=============================================== */
/* archive */
#news.archive .cat_list,
#case_page .cat_list {
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
    flex-wrap: wrap;
    margin-top: -100px;
    padding-top: 100px;
}
#news.archive .cat_list li,
#case_page .cat_list li {
width: 48%;
text-align: center;
padding: 0;
margin: 0 0 10px 0;
}
#news.archive .cat_list li a,
#case_page .cat_list li a {
    display: block;
    background: #f6f6f6;
    color: #009d3d;
    border-radius: 5px;
    text-decoration: none;
    font-size: 14px;
    line-height: 160%;
    padding: 10px;
    font-weight: bold;
}
#news.archive .container_contents_post li {
    border-bottom: 1px solid #F0F1E6;
    padding: 20px;
    font-size: 15px;
    line-height: 160%;
    display: flex;
    flex-wrap: wrap;
}
#news.archive .container_contents_post li .info {
    margin-bottom: 10px;
    font-weight: 600;
    display: flex;
    align-items: center;
    width: 100%;
}
#news.archive .container_contents_post li .info .cat,
#top #news .contents_box .cat {
    font-feature-settings: "palt";
    font-size: 12px;
    line-height: 130%;
    display: flex;
    flex-wrap: nowrap;
}
#news.archive .container_contents_post li .info .cat a,
#top #news .contents_box .cat a {
    background: #F0F1E6;
    width: 120px;
    text-align: center;
    display: inline-block;
    border-radius: 3px;
    letter-spacing: 0;
    margin-left: 10px;
    padding: 5px;
}
#news.archive .container_contents_post li .ttl {
text-align: left;
}
#news.post .container_contents_side_latest .cat {
    display: flex;
    width: 100%;
    font-feature-settings: "palt";
    margin-bottom: 5px;
}
#news.post .container_contents_side_latest .cat span {
    background: #F0F1E6;
    width: auto;
    text-align: center;
    display: inline-block;
    border-radius: 50px;
    letter-spacing: 0;
    padding: 2px 10px;
    font-size: 11px !important;
    line-height: 130% !important;
}
#news.post .container_contents_side_latest .cat a:not(last-child) {
    margin-right: 5px;
}
#news.archive .container_contents_post li .info .cat .notice,
#news.post .container_contents_side_latest .cat .notice,
#top #news .contents_box .cat .notice {
    background: #3aaaaa;
    color: #FFF;
}
#news.archive .container_contents_post li .info .cat .event,
#news.post .container_contents_side_latest .cat .event,
#top #news .contents_box .cat .event {
    background: #A892C9;
    color: #FFF;
}
#news.archive .container_contents_post li .info .cat .press,
#news.post .container_contents_side_latest .cat .press,
#top #news .contents_box .cat .press {
    background: #00913A;
    color: #FFF;
}
#news.archive .container_contents_post li .info .cat .publication,
#news.post .container_contents_side_latest .cat .publication,
#top #news .contents_box .cat .publication {
    background: #3A79AA;
    color: #FFF;
}
#news.archive .container_contents_post li .info .cat .product-service,
#news.post .container_contents_side_latest .cat .product-service,
#top #news .contents_box .cat .product-service {
    background: #E2942D;
    color: #FFF;
}
#news.archive .container_contents_post li .info .date {
    line-height: 130%;
    font-weight: normal;
}
#news.archive .container_contents_post li a {
    text-decoration: none;
}
#news.archive .box-post-paging {
    margin-top: 50px;
    display: flex;
    justify-content: center;
}
#news.archive .box-post-paging span a,
#news.archive .box-post-paging span.is-active {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    border-radius: 5px;
    margin: 0 5px;
}
#news.archive .box-post-paging span a {
    background: #F0F1E6;
    text-decoration: none;
}
#news.archive .box-post-paging span a:hover,
#news.archive .box-post-paging span.is-active {
    background: #00A3A7;
    color: #FFF;
}

/*ページャ*/
#news .nav-links {
    margin: 30px auto 50px;
    display: flex;
    justify-content: center;
}
#case .nav-links {
    margin: 0 auto 50px;
    display: flex;
    justify-content: center;
}
span.page-numbers, 
a.page-numbers {
    padding: 5px 15px;
    border: 1px solid #009D3D;
    display: inline-block;
    border-radius: 5px;
    margin: 0 3px;
}
span.page-numbers.current {
    background: #009D3D;
    color: #fff;
}
span.page-numbers.dots {
    background: #fff;
}

/* ===============================================
news_page
=============================================== */
#news_page .inner {
text-align: left;
}
#news_page .inner h2 {
font-size: 24px;
line-height: 120%;
}
#news_page .inner h3 {
font-size: 20px;
margin: 0 0 10px;
}
#news_page #side h3 {
font-size: 16px;
margin: 0 0 10px;
background: #f6f6f6;
padding: 5px;
color: #009d3d;
}
#news_page #side h4 {
font-size: 14px;
margin: 0;
padding: 0;
color: #009d3d;
}
#news_page .inner .post a {
color: #009d3d;
text-decoration: underline;
}
#news_page #side form.form-serch {
display: flex;
margin-bottom: 15px;
}
#news_page #side button.mouseover.form-serch_btn {
    background: #009d3d;
    border: none;
    border-radius: 0;
}
#news_page #side i.fa.fa-search.coWhite {
margin-bottom: 0!important;
}
#news_page #side i.fa.fa-search.coWhite::before {
content: "\f002";
display: inline-block;
font: normal normal normal 14px / 1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
padding: 5px;
color: #fff;
} 
#news_page #side input#s {
border: 1px solid #ccc;
border-radius: 0;
padding: 5px 10px;
}
#news_page #side li.list_item {
font-size: 14px;
line-height: 140%;
margin-bottom: 5px;
}
#news_page #side li.list_item:last-child {
margin-bottom: 15px;
}
#news_page #side li.list_item span {
color: #fff;
width: auto;
text-align: center;
display: inline-block;
border-radius: 50px;
letter-spacing: 0;
padding: 2px 10px;
font-size: 11px !important;
line-height: 130% !important;
margin-bottom: 5px;
}
#news_page #side li.list_item span.notice {
background: #3aaaaa;
}
#news_page #side li.list_item span.campaign {
background: #ff7e00;
}
#news_page #side li.list_item span.press {
background: #00913A;
}
#news_page #side li.list_item span.publication {
background: #3A79AA;
}
#news_page #side li.list_item span.event {
background: #A892C9;
}

/* event_page */
#news_page.event_page h2 {    
margin: 15px 0;
font-size: 24px;
line-height: 140%;
text-align: center;
padding: 30px 5%;
background: #f6f6f6;
}
#news_page.event_page .inner {
justify-content:center;
margin: 15px auto 50px;
}
#news_page.event_page .main_area {
}
#news_page.event_page .mainImg {
text-align: center;
margin: 20px auto;
}
#news_page.event_page p {
margin-bottom: 20px;
}
#news_page.event_page .mod-btn {
    text-align: center;
    margin: 30px auto;
}
#news_page.event_page .mod-btn a {
text-decoration: none !important;
display: block;
width: 100%;
margin: 0 auto;
padding: 20px 15px;
font-size: 16px;
font-weight: 500;
background: #f98329 url(../img/common/arrow-w.svg) 95% 50% no-repeat;
background-size: 20px;
border: 2px solid #f98329;
color: #fff;
border-radius: 100px;
text-align: center;
box-sizing: border-box;
}
#news_page.event_page i.fa.fa-angle-right.ml10 {
margin-left:10px;
}

/*dl*/
#news_page.event_page .table dl {
margin: 0;
}
#news_page.event_page .table dt,
#news_page.event_page .table dd {
padding: 10px 0;
margin: 0;
box-sizing: border-box;
}
#news_page.event_page .table dt:last-of-type,
#news_page.event_page .table dd:last-of-type {
}
#news_page.event_page .table dt {
background: #eee;
text-align: center;
}
#news_page.event_page .table dd {
padding: 20px 0;
margin-bottom: 10px;
}
#news_page.event_page .table dd table {
width: 100%!important;
border-collapse: collapse;
}
#news_page.event_page .table dd table tr {
border-right: none;
border-left: none;
border-top: 1px solid #666;
border-bottom: 1px solid #666;
}
#news_page.event_page .table dd table td {
border: none;
padding: 10px;
}
#news_page.event_page dl.instructor {
background: #f6f6f6;
padding: 30px;
color: #666;
}
#news_page.event_page dl.instructor dt {
}
#news_page.event_page dl.instructor dd {
margin: 0;
}


/* ===============================================
cta_area
=============================================== */
.cta_area {
 width: 100%;
 background: #f98329;
}
.cta_area .cta_inner {
 margin: 0 auto;
 padding: 30px 5% 20px;
}
.cta_area .cta_inner .btn {
 margin-bottom: 10px;
}
.cta_area .cta_inner .btn.btn-wo a {
 padding: 20px 15px;
 font-size: 16px;
 font-weight: 500;
 background: #fff url("../img/common/arrow-or.svg") 95% 50% no-repeat;
 background-size: 20px;
}
/* ===============================================
footer
=============================================== */
footer {
 background: #03792f;
}
.footer__container {
 padding: 50px 5%;
 margin: 0 auto;
}
.footer__box {}
.footer__logo {
 width: 150px;
 margin-bottom: 20px;
 text-align: center;
}
.footer_ul {
 display: flex;
 flex-wrap: wrap;
 justify-content: flex-start;
 align-items: center;
}
.footer_ul li {
 margin: 0 0 10px 0;
 width: 50%;
}
.footer_ul a {
 color: #fff;
 font-size: 16px;
 background: url("../img/common/arrow-w.svg") 0 50% no-repeat;
 background-size: 15px;
 padding-left: 20px;
 font-weight: 500;
}
.footer_ul a:hover {
 opacity: 0.7;
 transition: all 0.5s;
}
footer .mark-img {
 display: flex;
 justify-content: flex-end;
 padding: 10px 10px;
 background: #fff;
 border-radius: 10px;
 place-self: flex-end;
}
footer .mark-img li {
 margin: 0 5px;
display: flex;
}
footer .mark-img li.privacy-img {
 width: 60px;
}
footer .mark-img li.pci-img {
 width: 100px;
}
.copylight {
 text-align: center;
 font-size: 12px;
 background: #fff;
 padding: 5px;
}

/* ===============================================
cookie
=============================================== */
#cookie-notice {
position: fixed;
height: fit-content !important;
z-index: 100000;
letter-spacing: 0;
line-height: 20px;
left: 0% !important;
width: 0% !important;
bottom: 0% !important;
min-width: 100% !important;
right: 0px !important;
background: rgba(255, 255, 255, 0.8) !important;
}
#cookie-notice p {
marmgin: 0;
color: #666 !important;
}
#cookie-notice p.link_privacy {
color: #666 !important;
margin: 5px 10px;
}
#cookie-notice p.link_privacy a {
text-decoration: underline;
color: #666 !important;
}
#cookie-notice span {
margin: 0;
}
#cookie-notice .cookie-notice-container {
padding: 5px 25px 5px 0;
color: #666 !important;
border: none;
}
#cookie-notice .btn_cookie {
background: #00913A;
padding: 3px 15px;
border-radius: 30px;
text-decoration: none;
color: #fff;
margin: 3px 0 0 0 !important;
}
span#cn-close-notice {
top: 3px;
right: 5px;
}
#cookie-notice .cn-close-icon {
opacity: 1!important;
}
.cn-close-icon:after, .cn-close-icon:before {
background-color: #666 !important;
height: 20px!important;
}
/* ===============================================
not-found
=============================================== */
#not-found {
margin: 70px 5%;
padding: 5%;
box-sizing: border-box;
background: #f6f6f6;
}
#not-found h1 {
font-size: 24px;
line-height: 140%;
}
#not-found p {
font-size: 16px;
line-height: 140%;
margin-bottom: 20px;
}
#not-found p strong {
font-size: 20px;
color: #009d3d;
}
#not-found a {
border-bottom: 1px solid;
}