/*---------------------------------------------
 * 基本要素
 *--------------------------------------------*/
body {
	font-family: 'Questrial', Meiryo, メイリオ, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', sans-serif;
    font-size: 14px;
    line-height: 1.42857143;
    color: #444;
}

a, 
a.none:hover {
    color: #444;
    text-decoration: none;
}

.row a {
    color: #337ab7;
}

a:hover,
a:focus {
    text-decoration: underline;
}

h1, .h1 {
    margin-top: 20px;
    margin-bottom: 10px;
    font-size: 36px;
    font-weight: normal;
    line-height: 1.1;
}

h2, .h2 {
    margin-top: 20px;
    margin-bottom: 10px;
    font-size: 30px;
    font-weight: normal;
    line-height: 1.1;
}

h3, .h3 {
    margin-top: 20px;
    margin-bottom: 10px;
    font-size: 24px;
    font-weight: normal;
    line-height: 1.1;
}

h4, .h4 {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 18px;
    font-weight: normal;
    line-height: 1.1;
}

h5, .h5 {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.1;
}

h6, .h6 {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 12px;
    font-weight: normal;
    line-height: 1.1;
}

.h1 small, .h1 .small,
.h2 small, .h2 .small,
.h3 small, .h3 .small {
    padding-top: 5px;
    font-size: 65%;
    line-height: 1;
}

.h4 small, .h4 .small,
.h5 small, .h4 .small,
.h6 small, .h4 .small {
    padding-top: 5px;
    font-size: 75%;
    line-height: 1;
}

p {
    margin-bottom: 10px;
}

blockquote {
    padding: 10px 20px;
    border-left: 5px solid #eee;
}

blockquote small {
    display: block;
    margin-top: 10px;
    padding-top: 0 !important;
}

blockquote p {
    margin-bottom: 0 !important;
}

ol, ul {
    padding-left: 40px;
}

code {
    padding: 2px 4px;
    font-size: 90%;
    background-color: #f9f2f4;
    border-radius: 4px;
}

label {
    font-weight: 700;
}

/*---------------------------------------------
 * コンテナ
 *--------------------------------------------*/
.container, 
.container-fluid {
    padding-right: 15px;
    padding-left: 15px;
}

/* 767以下 */
@media (max-width: 767px) {
    .container {
        max-width: 100%;
    }
}

/* 768以上 */
@media (min-width: 768px) {
    .container {
        max-width: 750px;
    }
}

/* 992以上 */
@media (min-width: 992px) {
    .container {
        max-width: 970px;
    }
}

/* 1200以上 */
@media (min-width: 1200px) {
    .container {
        max-width: 1170px;
    }
}

/*---------------------------------------------
 * グリッドシステム
 *--------------------------------------------*/
.row {
    margin-right: -15px;
    margin-left: -15px;
}

.col-lg-3,
.col-lg-9,
.col-sm-4,
.col-sm-12 {
    padding-right: 15px;
    padding-left: 15px;
}

/* 320以上 */
@media (min-width: 320px) {
    .col-sm-6 {
        flex: 0 0 auto;
        width: 50%;
    }
}

/*---------------------------------------------
 * ナビゲーションバー
 *--------------------------------------------*/
.navbar {
	padding-top: 25px;
	padding-bottom: 25px;
}

.navbar > .container-fluid {
    padding: 0;
}

.navbar-brand {
    margin-right: 0;
    margin-left: -15px;
    padding: 10px;
}

.navbar-toggler {
    margin-right: 5px;
    padding: 2.5px 6px;
	border: none;
}

.navbar-collapse {
    padding-right: 15px;
}

/* 991以下 */
@media (max-width: 991px) {
    .navbar-collapse {
		border-top: 1px solid #e7e7e7;
		box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
	}
}

/* 767以下 */
@media (max-width: 767px) {
    .navbar {
        padding: 0;
    }
    
    .navbar-toggler {
        margin-right: -10px;
    }
    
    .navbar-collapse {
        overflow: hidden; /* 横スクロール対策 */
        margin-right: -15px;
        margin-left: -15px;
    }
}

.navbar-nav {
    margin-right: -15px;
}

.navbar-nav > .nav-item {
    display: block;
}

.navbar-nav > .nav-item > .nav-link {
    padding: 15px;
    text-decoration: none;
}

/* 992以下 */
@media (max-width: 992px) {
    .navbar-nav {
        margin: 7.5px -15px;
    }
    
    .navbar-nav > .nav-item > .nav-link {
        padding-top: 10px;
        padding-bottom: 10px;
    }
}

.navbar-nav > .nav-item > .nav-link:focus-visible {
    box-shadow: none;
}

.navbar-nav > .nav-item > .nav-link.show {
    background-color: #e7e7e7;
}

.navbar-nav > .nav-item > .nav-link:after {
    content: none;
}

.navbar-nav > .nav-item > .nav-link > .bi-caret-down-fill:before {
    content: none;
}

.navbar-nav > .nav-item > .nav-link > .bi-caret-down-fill {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-top: 4px solid\9;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
    background-color: #fff;
}

.navbar-nav > .nav-item > .dropdown-menu {
    min-width: 200px;
    margin-top: 0 !important; /* _dripdown.scssからの上書き抑止 */
    padding-top: 5px;
    padding-bottom: 5px;
    border: none;
    border-radius: 0;
    font-size: 14px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
            box-shadow: 0 6px 12px rgba(0,0,0,.175);
}

.navbar-nav > .nav-item:last-child > .dropdown-menu {
    min-width: 275px;
    right: 0;
    left: auto;
}

.navbar-nav > .nav-item > .dropdown-menu > li > a {
	padding: 10px 20px;
    text-decoration: none;
}

/* 991以下 */
@media (max-width: 991px) {
    .navbar-nav > .nav-item > .dropdown-menu {
        -webkit-box-shadow: none;
		        box-shadow: none;
    }
    
    .navbar-nav > .nav-item > .dropdown-menu > li > a {
        padding: 5px 15px 5px 25px;
    }
}

.navbar-nav > .nav-item > .dropdown-menu > li:not(:first-child) > a:before {
	padding-left: 5px;
	content: '-\00a0';
}

.navbar-nav > .nav-item > .dropdown-menu > li > .navbar-form {
    width: 100%;
    margin-top: 8px;
    margin-right: -15px;
    margin-bottom: 8px;
    padding: 0 15px;
}

.navbar-nav > .nav-item > .dropdown-menu > li > .navbar-form > .form-group > .form-control {
    line-height: 20px;
    font-size: 14px;
}

.navbar-nav > .nav-item > .dropdown-menu > li > .navbar-form > .btn {
    font-size: 14px;
    border: 1px solid #ccc;
}

/* 992以上 */
@media (min-width: 992px) {
    .navbar-nav > .nav-item > .dropdown-menu > li > .navbar-form > .form-group {
        display: inline-block;
    }
}

/* 991以下 */
@media (max-width: 991px) {
    .navbar-nav > .nav-item > .dropdown-menu > li > .navbar-form > .form-group > .form-control {
        margin-bottom: 5px;
    }
}

/*---------------------------------------------
 * ページヘッダー
 *--------------------------------------------*/
.page-header {
    margin-top: 40px;
    margin-bottom: 40px;
    padding-bottom: 1px;
}

.page-header > h1 > small,
.page-header > h2 > small{
    font-size: 50%;
}

@media (max-width: 767px) {
    .page-header > h1 > small {
        display: block;
        margin-top: 10px;
    }
}

/*---------------------------------------------
 * パンくずリスト
 *--------------------------------------------*/
.container-breadcrumb {
	background-color: #f5f5f5;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
	        box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
}

.container-breadcrumb > nav {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
}

/* 767以下 */
@media (max-width: 767px) {
    .container-breadcrumb > nav {
        max-width: 100%;
    }
}

/* 768以上 */
@media (min-width: 768px) {
    .container-breadcrumb > nav {
        max-width: 750px;
    }
}

/* 992以上 */
@media (min-width: 992px) {
    .container-breadcrumb > nav {
        max-width: 970px;
    }
}

/* 1200以上 */
@media (min-width: 1200px) {
    .container-breadcrumb > nav {
        max-width: 1170px;
    }
}

.breadcrumb {
    margin-bottom: 0;
    padding: 8px 0;
}

.breadcrumb > .breadcrumb-item + .breadcrumb-item:before {
    content: "\03e";
    font-size: 14px;
    color: #ccc;
}

.breadcrumb > .breadcrumb-item > a {
    color: #337ab7;
}

.breadcrumb > .breadcrumb-item > a:focus,
.breadcrumb > .breadcrumb-item > a:hover {
    color: #23527c;
}

/*---------------------------------------------
 * フッター
 *--------------------------------------------*/
.footer {
	padding-top: 25px;
	padding-bottom: 25px;
	background-color: #3f498e;
	color: #fff;
}

.footer a,
.footer a:hover,
.footer a:focus {
    color: #fff;
}

.footer .list-unstyled {
    margin-bottom: 10px;
}

.footer .list-unstyled > li,
.footer .list-unstyled > li > ul > li {
   padding-bottom: 5px;
}

.footer .list-unstyled > li > ul {
    margin-bottom: 0;
	padding-left: 15px;
	padding-top: 5px;
	list-style: none;    
}

.footer .list-unstyled > li > ul > li:before {
	content: '-\00a0';
}

.footer .list-inline {
    margin-left: -5px;
    margin-bottom: 10px;
}

.footer .list-inline > li {
    display: inline-block;
    padding-right: 5px;
    padding-left: 5px;
    padding-bottom: 5px;
}

.footer .list-inline > li:not(:last-child):after {
	margin-left: 10px;
	content: '\00a0|';
}

@media (max-width: 767px) {
	.footer .list-inline > li {
		display: block;
	}
    
	.footer .list-inline > li:not(:last-child):after {
		margin-left: 0;
		content: none;
	}
}

#top-link-block {
	position: fixed;
	bottom: 30px;
	right: 5%;
}

#top-link-block > .btn-circle:hover,
#top-link-block > .btn-circle:focus {
	color: #fff;
	background-color: #010c4c;
}

.btn-circle {
	width: 50px;
	height: 50px;
	text-align: center;
	padding: 14px 16px;
	font-size: 18px;
	line-height: 1.33;
	border: none;
	border-radius: 25px;
	background-color: #010c4c;
	color: #fff;
	opacity: .5;
}

/*---------------------------------------------
 * カルーセル
 *--------------------------------------------*/
.carousel-item > img {
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
}

.carousel-caption {
    top: 100px;
}

.carousel-caption > h5,
.carousel-caption > p {
    font-size: 24px;
}

.carousel-caption > p {
    margin-top: 120px;
}

.carousel-indicators > button {
    width: 10px !important;
    height: 10px !important;
    border-radius: 50%;
}

.carousel-control-prev {
    background-image: linear-gradient(to right,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
    background-repeat: repeat-x
}

.carousel-control-next {
    background-image: linear-gradient(to right,rgba(0,0,0,.0001) 0,rgba(0,0,0,.5) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
    background-repeat: repeat-x
}

/* 767以下 */
@media (max-width: 767px) {
    .carousel-item > img {
        min-height: 410px;
    }
    
    .carousel-caption > p {
        font-size: 18px;
    }
}

/* 768以上 */
@media (min-width: 768px) {
    .carousel-item > img {
        min-height: 500px;
    }
}

/*---------------------------------------------
 * メディアオブジェクト(V5で廃止されている)
 *--------------------------------------------*/
.container-media {
	padding-top: 25px;
    padding-right: 0;
    padding-left: 0;
}

/* 767以下 */
@media (max-width: 767px) {
    .container-media {
        max-width: 100%;
        padding-right: 15px;
        padding-left: 15px;
    }
}

/* 768以上 */
@media (min-width: 768px) {
    .container-media {
        max-width: 750px;
    }
}
/* 992以上 */
@media (min-width: 992px) {
    .container-media {
        max-width: 970px;
    }
}

/* 1200以上 */
@media (min-width: 1200px) {
    .container-media {
        max-width: 1170px;
    }
}

.container-media > .row {
    margin-right: 0;
    margin-left: 0;
}

.media {
	margin-top: 0;
	margin-bottom: 25px;
    color: #444;
}

.media:hover,
.media:focus {
    color: #337ab7;
    opacity: .8;
}

.media > .media-middle {
    vertical-align: middle;
}

.media > .media-middle.thumbnail {
    padding: 4px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.media > .media-middle > .media-object {
    width: 100%;
}

.media > .media-body {
    padding-top: 15px;
    background-color: #fff;
}

.media > .media-body > .media-heading {
    margin-top: 0;
    margin-bottom: 5px;
    line-height: 19.8px;
}

.media > .media-body > p {
    min-height: 60px;
    margin-bottom: 10px;
}

.media > .media-middle.thumbnail + .media-body > p {
    min-height: inherit;
}

@media (max-width: 767px) {
    .container-media > .row > .col-sm-12 {
        padding-top: 20px;
        padding-right: 0;
        padding-left: 0;
        border-top: 1px solid #ddd;
    }
    
    .container-media > .row > .col-sm-12:first-child {
        border: none;
    }
    
    .media {
        display: flex;
    }

    .media > .media-middle {
        width: 30%;
        order: 2;
    }
    
    .media > .media-body {
        width: 70%;
        padding-top: 0;
        order: 1;
    }
    
    .media > .media-body > .h1 {
        display: none;
    }
}

@media (max-width: 320px) {
    .media {
        overflow: hidden;
    }
    
    .media > .media-middle > .media-object {
		width: 130px;
		height: auto;
    }
}

.media:has(.media-right),
.media:has(.media-left) {
    display: flex;
}

.media > .media-left {
    padding-right: 10px;
}

.media > .media-body:has(+ .media-right),
.media > .media-left + .media-body {
    padding-top: 0;
}

/*---------------------------------------------
 * テーブル
 *--------------------------------------------*/
.table {
    margin-bottom: 20px;
    --bs-table-hover-bg: none;
}

.table > thead > tr > th {
    border-bottom: 2px solid #ddd;
}

.table-responsive > .table > tbody > tr > th,
.table-responsive > .table > tbody > tr > td {
    white-space: nowrap;
}

.table-hover > tbody > tr:hover {
    background-color: #f5f5f5;
    --bs-table-bg: none;
}

.table-info {
    --bs-table-bg: none;
    --bs-table-border-color: #ddd;
}

.table-info > tbody > tr:first-child {
    border-top: 1px solid #ddd;
}

/* トップページNEWS */
.underline + .table-info > tbody > tr:first-child {
    border-top: none;
}

.table-info > tbody > tr > th {
    width: 140px;
    font-weight: normal;
}

.table-info > tbody > tr > th.active {
    background-color: #f5f5f5;
}

.table-hover > tbody > tr:hover > th.active {
    background-color: #e8e8e8;
}

.table-info > tbody > tr > th > .label {
    display: block;
	padding-top: 5px;
	padding-bottom: 5px;
    font-size: 75%;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
}

.table-info > tbody > tr > td > .label-date {
    margin-right: 10px;
}

.table-info > tbody > tr > td > .label-text > a {
    color: #337ab7;
} 

.table-info > tbody > tr > th > .label-default {
    background-color: #777;
}

.table-info > tbody > tr > th > .label-primary {
    background-color: #337ab7;
}

.table-info > tbody > tr > th > .label-success {
    background-color: #5cb85c;
}

.table-info > tbody > tr > th > .label-info {
    background-color: #5bc0de;
}

.table-info > tbody > tr > th > .label-warning {
    background-color: #f0ad4e;
}

.table-info > tbody > tr > th > .label-danger {
    background-color: #d9534f;
}

@media (max-width: 767px) {
    .table-info {
        --bs-table-border-color: #fff;
    }
    
    .table-info > tbody > tr > th,
    .table-info > tbody > tr > td {
        display: list-item;
        list-style: none;
        border: none;
    }
    
    .table-info > tbody > tr {
        position: relative;
        display: block;
    }
    
    .table-info > tbody > tr:first-child {
        border-top: none;
    }

    .table-info > tbody > tr > td > .label-date {
        position: absolute;
        top: 9px;
        left: 150px;
    }    
}

/* テーブル内のグリッド 開発事例紹介 */
.table-info > tbody > tr > td:has(div[class*="col-"]) {
    display: flex;
    max-width: 100%;
    margin: 0;
}

.table-info > tbody > tr > td > div[class*="col-"] {
    padding: 0;
}

/*---------------------------------------------
 * タブとピル
 *--------------------------------------------*/
.nav-pills > .nav-item > .nav-link {
    margin-bottom: 5px;
    padding: 10px 15px;
}

.nav-pills > .nav-item > .nav-link.active {
    background-color: #337ab7;
}

@media (max-width: 767px) {
    .nav-justified.flex-column.flex-sm-row {
        flex-direction: column !important;
    }
}

/*---------------------------------------------
 * カードとウェル
 *--------------------------------------------*/
.card {
    margin-bottom: 20px;
}

.card > .card-header {
    padding: 10px 15px;
}

.card > .card-body {
    padding: 15px;
}

.card.card-simple > .card-header {
    padding-top: 13px;
    padding-right: 13px;
    padding-left: 13px;
    padding-bottom: 5px;
    background-color: inherit;
    border-bottom: none;
}

.card.card-simple > .card-body {
    margin-bottom: 10px;
    padding-top: 5px;
    padding-right: 13px;
    padding-left: 13px;
    padding-bottom: 13px;
}

.card.card-blue {
	border-color: #1e306f;
}

.card.card-blue > .card-header {
	color: #fff;
	background-color: #3c4e8d;
	border-color: #1e306f;
}

.card.card-purple {
	border-color: #72206c;
}

.card.card-purple > .card-header {
	color: #fff;
	background-color: #903e8a;
	border-color: #72206c;
}

.card.card-green {
	border-color: #23682f;
}

.card.card-green > .card-header {
	color: #fff;
	background-color: #41864d;
	border-color: #23682f;
}

.card > .card-header > .bi {
    margin-right: 5px;
}

.card > .card-body > ul {
    margin-left: 0;
    padding-left: 15px;
}

.bg-orange {
	color: #fff;
	background-color: #e98e00;
    border: 1px solid #cb7000;
    border-radius: 4px;
}

.bg-yellow {
	color: #fff;
	background-color: #c5d100;
    border: 1px solid #a4c200;
    border-radius: 4px;
}

.bg-green {
	color: #fff;
	background-color: #41864d;
    border: 1px solid #23682f;
    border-radius: 4px;
}

.bg-blue {
	color: #fff;
	background-color: #3c4e8d;
    border: 1px solid #1e306f;
    border-radius: 4px;
}

.bg-purple {
	color: #fff;
	background-color: #903e8a;
    border: 1px solid #72206c;
    border-radius: 4px;
}

.stripe {
	background-image: -webkit-linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
	background-image:      -o-linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
	background-image:         linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
	-webkit-background-size: 10px 10px;
	        background-size: 10px 10px;
	-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
	        box-shadow: 0 1px 1px rgba(0,0,0,.05);
}

.well {
    min-height: 20px;
    padding: 19px;
}

.well-sm {
    padding: 9px;   
}

/*---------------------------------------------
 * アイコン
 *--------------------------------------------*/
a + .bi {
    padding-left: 5px;
}

/*---------------------------------------------
 * フォームとボタン
 *--------------------------------------------*/
.form-group {
    margin-bottom: 15px;
}

.btn-default {
    border-color: #ccc;
    font-size: 14px;
}

.btn-default:hover {
    background-color: #e6e6e6;
    border-color: #ababab;
}

.input-group-text {
    font-size: 14px;
    background-color: #eee;
}

/*---------------------------------------------
 * ドロップダウンボタン
 *--------------------------------------------*/
.dropup > .btn-default.show {
    background-color: #d4d4d4;
    border-color: #8c8c8c;
}

.dropup > .dropdown-menu {
    padding: 5px 0;
    margin: 2px 0 0;
}

.dropup > .dropdown-menu > li > .dropdown-item {
    padding: 3px 20px;
    color: #333;
    font-size: 14px;
}

.dropup > .dropdown-menu > li > .dropdown-item:hover {
    text-decoration: none;
}

/*---------------------------------------------
 * ユーティリティ
 *--------------------------------------------*/
.margin-xs {
	margin-bottom: 1px;
}

.margin-sm {
	margin-bottom: 20px;
}

.margin-lg {
	margin-bottom: 60px;
}

.text-right {
    text-align: right;
}

.underline {
    border-bottom: 1px solid #010c4c;
}

.underline-lg {
    border-bottom: 4px solid #010c4c;
}

.pull-right {
    float: right;
}

.img-responsive {
    display: block;
    max-width: 100%;
    height: auto;
}

.bi-center-block {
	display: flex;
    justify-content: center;
	font-size: 60px;
	opacity: .5;
    margin-top: -25px;
}

/*---------------------------------------------
 * 固有スタイル
 *--------------------------------------------*/
/* サービス */
#chart {
    width: 100%;
    height: 400px;
}

/* 会社情報 */
#map-canvas {
	width: 100%;
	height: 400px;
	-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
	        box-shadow: 0 1px 1px rgba(0,0,0,.05);
}