/* Color  -----------------------------------------  */
body, h1, h2, h3, h4, h5, h6, .card-title,
.table thead tr th{
	    color: #000;
}
.login-wrapper {
    background-color: #007be8;
    background: linear-gradient(-135deg, rgba(5,251,255, 0.9), rgba(0,123,232, 0.8));
	background-size: cover;
}
/* Font  -----------------------------------------  */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,select,textarea,p,blockquote,th,td { 
	font-family:Meiryo,メイリオ, 游ゴシック体, 'Yu Gothic', YuGothic, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
.card .card-header .card-title {
    font-size: 18px;
}
.breadcrumb+h3{
	font-size: 20px;
	margin:0 0 5px 0;
}
.label{
	font-weight: normal;
}

/* Header   -----------------------------------------  */
.profile-dropdown > a {
    opacity: 1;
}
.dropdown-menu > li, .dropdown-menu > .dropdown-item{
	color: #000;
}
.show>.dropdown-menu{
	box-shadow: 1px 1px 5px rgba(0,0,0,0.5);
}

.thumbnail-wrapper.d32 {
    width: 26px;
    height: 26px;
}

.brand{

}
@media only screen and (min-width: 980px){
	body.menu-pin .header .brand {
	    width: auto;
	}
}
.header img.brand {
	width: auto;
}

.sidebar-header img.brand, 
.header img.brand {
	height: 25px;
	width: auto;
	-webkit-filter: brightness(0) invert(1);
	-moz-filter: brightness(0) invert(1);
	filter: brightness(0) invert(1);
}


/* Layout  -----------------------------------------  */
.header{
	height: 40px;
}
.page-sidebar .sidebar-header{
	height: 40px;
	line-height: 40px;
}
.page-container .page-content-wrapper .content {
    padding-top: 40px;
}

@media (max-width: 480px) {
	body .header{
		height: 40px;
		border: none;
	}
	
	.card-block .row > [class^="col-"]{
		padding-left: 0;
		padding-right: 0;
	}

}



.page-sidebar{
	left: -230px;
	border:none;
}
.page-container{
	padding-left: 50px;
}
.breadcrumb{
	padding:10px 0;
}
.container-fluid {
	padding-left: 10px;
	padding-right: 10px;
}

@media (max-width: 991px) {
	.page-container{
		padding-left: 0;
	}
	.table-responsive-block td.text-right{
		text-align: left !important
	}

	.header .dropdown span.circular+span{
		display: none !important;
	}
}
@media only screen and (min-width: 980px){
	body.menu-pin .page-container .page-content-wrapper .content {
		padding-left: 230px;
	}
	body.menu-pin .page-container .page-content-wrapper .footer {
	    left: 230px;
	}
}

@media (min-width: 992px) {
	.page-sidebar-closed .page-sidebar .page-sidebar-menu.page-sidebar-menu-compact.page-sidebar-menu-closed > li > a {
		min-height: auto;
	}

	.sp {
		display: none !important;
	}
}

	@media (max-width: 768px) {
		.sp {
			display: block !important;
		}
	}


	.row {
		margin-right: -5px;
		margin-left: -5px;
	}

	.row > [class^="col-"] {
		padding-right: 5px;
		padding-left: 5px;
	}

	.form-group.row > .static {
		padding-top: 7px;
	}

	img.thumbnail {
		max-width: 100%;
		height: auto;
	}

	/* Card   -----------------------------------------  */
	.card {
		margin-bottom: 10px;
	}

	.card .card-title > .badge {
		vertical-align: middle;
		margin: 0 0.25em
	}

	.card .card-title > small {
		font-size: 14px;
	}

	.card .card-header::after {
		content: "";
		display: table;
		clear: both;
	}

	@media (max-width: 480px) {
		.card .card-header .card-controls {
			margin-top: 0;
		}

		.card-controls a > .fa {
			display: none;
		}

		.card-controls a {
			padding: 3px 10px;
		}


		.card .card-header,
		.card .card-block {
			padding-left: 10px;
			padding-right: 10px;
		}
	}


	/* Table -----------------------------------------  */
	.table tbody tr td {
		padding: 10px;
	}

	.table thead tr th {
		padding: 0;
		white-space: nowrap;
	}

	.table thead tr th:first-child {
		padding-left: 10px !important;
	}

	.table thead tr th {
		padding: 10px;
		font-size: 12px;
		font-weight: bold;
	}

	.table thead tr th > a {
		display: block;
	}

	.table thead tr th > a > span {
		margin-left: 1em;
	}


	.table-responsive-block td > b {
		font-size: 11px;
		color: #0064bc;
		display: none;
	}

	@media (max-width: 991px) {
		.table-responsive-block.table tbody tr td {
			padding: 5px 10px;
		}

		.table-responsive-block td > b {
			display: block;
			margin-bottom: 5px;
		}

		.table-responsive-block .btn-xs {
			font-size: 14px;
			padding: 6px 17px;
			display: block;
			border: none;
		}

		.table-responsive-block.table tbody tr td:last-child > .btn {
			border-radius: 0 0 3px 3px / 0 0 3px 3px;
			-webkit-border-radius: 0 0 3px 3px / 0 0 3px 3px;
			-moz-border-radius: 0 0 3px 3px / 0 0 3px 3px;
		}
	}

	@media (max-width: 767px) {
		.table-responsive {
			border: none;
		}
	}



	/* Div Table -----------------------------------------  */
	div.table {
		border-top: 1px dotted #CCC;
	}

	div.table > .row {
		padding: .5rem 0;
		margin: 0;
		border-bottom: 1px dotted #CCC;
	}

	div.table > .row > label {
		margin-bottom: 0;
		font-size: 11px;
		font-weight: bold;
	}

	div.table > .row > div {
		font-size: 13.5px;
	}

	/*
    @media (max-width: 768px) {
        div.table > .row > label+div{
            padding-left: 24px;
        }
    }
    */

	.page-container .page-content-wrapper .content{
		padding-bottom: 106px;
	}

	/* SideMenu -----------------------------------------  */
	.page-sidebar li {
		line-height: 1em;
	}

	.page-sidebar .sidebar-menu .menu-items > li > a.detailed > .title {
		line-height: 40px;
	}

	.page-sidebar .icon-thumbnail {
		margin-right: 5px;
		background: none !important;
	}

	.page-sidebar .sidebar-menu .menu-items {
		border-top: 1px solid #EEE;
	}

	.page-sidebar .sidebar-menu .menu-items > li {
		border-bottom: 1px solid #EEE;
	}

	.page-sidebar .sidebar-menu .menu-items li > a {
		width: 70%;
	}

	.page-sidebar .sidebar-menu .menu-items > li > a > .arrow {
		padding-right: 5px;
	}

	.page-sidebar .sidebar-menu .menu-items > li > a > .title {
		width: 85%;
	}


	.page-sidebar .sidebar-menu .menu-items > li ul.sub-menu {
		margin: 0;
		padding: 0;
	}

	.page-sidebar .sidebar-menu .menu-items > li ul.sub-menu > li {
		border-top: 1px solid #DDD;
		padding: 0px 10px 0 40px;
		margin-top: 0;
	}


	.page-sidebar .sidebar-menu .menu-items > li ul.sub-menu > li > a {
		line-height: 25px;
	}

	.page-sidebar .sidebar-menu .menu-items > li ul.sub-menu > li .icon-thumbnail {
		padding: 5px 0px;
	}


	/* Form -----------------------------------------  */
	.form-actions {
		margin-top: 10px;
	}

	textarea.form-control {
		min-height: 10em;
	}

	.form-control,
	.select2-container .select2-selection,
	.cs-select .cs-placeholder {
		border-color: #CCC;
	}

	.form-control.error {
		border-color: #ea2c54;
	}

	.form-control:focus {
		background-color: #F9F9F9;
		border-color: #999;
	}

	.form-group-default .form-control {
		border: none !important;
	}

	.form-group label:not(.error) {
		font-size: 12px;
	}


	.form-horizontal .form-group .control-label {
		text-align: right;
	}

	.form-control + .input-group-addon {
		border: none;
	}

	.input-group.transparent .input-group-addon {
		color: #000;
		background-color: #FFF;
		border: none;
	}

	.transparent .form-control + .input-group-addon:not(:first-child) {

	}


	.form-horizontal .form-group {
		padding-top: 5px;
		padding-bottom: 5px;
		border-bottom: 1px dotted #EEE;
	}

	.form-horizontal .form-group .control-label {
		opacity: 1;
	}

	.required {
		color: #ea2c54;
	}

	ul.alert {
		list-style: none;
	}


	.form-horizontal .checkbox,
	.form-horizontal .radio {
		margin-bottom: 0;
		margin-top: 0;
		padding-top: 3px;
	}

	.form-horizontal .hint-text {
		font-size: 80%;
		margin-top: 0.5em;
	}


	.form-actions::after {
		content: "";
		display: table;
		clear: both;
	}

	@media (max-width: 768px) {
		.form-actions > .btn-success {
			float: right;
		}

		.form-group > .control-label,
		.form-group > div {
			padding: 0;
		}

		.form-group > .control-label {
			padding: 5px 0;
		}

		.form-horizontal .form-group .control-label {
			text-align: left;
		}
	}

	/* Pagination -----------------------------------------  */
	.pagination {
		display: block;
		text-align: center;
	}

	.pagination li {
		display: inline-block;
		line-height: 1em;
	}

	.pagination li > a {
		display: inline-block;
		padding: 5px 8px;
		color: #999;
	}

	.pagination li.active > a {
		color: #FFF;
		background-color: #007be8;
		border-radius: 3px;
	}

	.pagination li.disabled > a {
		color: #EEE;
	}


	/* QuickView -----------------------------------------  */
	#quickview .card-header {
		border-bottom: 1px solid #CCC;
	}

	#quickview .card-header a {
		font-size: 20px;
		padding: 20px;
	}

	#quickview .form-actions {
		text-align: center;
		margin-top: 1em;
	}

	#quickview .form-group > label,
	#quickview .form-group > div {
		display: block;
		max-width: 100%;
		width: 100%;
		flex: none;
		padding: 0;
		margin: 0;
	}

	/* Wizard -----------------------------------------  */
	.root_wizard {
		list-style-type: none;
		margin: 0;
		padding: 0;
		border-bottom: 1px solid #CCC;
	}

	.root_wizard > li {
		position: relative;
		display: inline-block;
	}

	.root_wizard > li > span,
	.root_wizard > li > a {
		color: #999;
		display: inline-block;
		padding: 13px 20px;
	}

	.root_wizard > li > span.active,
	.root_wizard > li > a.active {
		font-weight: bold;
		color: #369;
	}

	.root_wizard > li > span.active:after,
	.root_wizard > li > a.active:after {
		border-color: #f6f9fa transparent transparent transparent;
		border-style: solid;
		border-width: 9px;
		content: "";
		left: 50%;
		margin-left: -9px;
		position: absolute;
		top: 100%;
		margin-top: 0px;
		z-index: 100;
	}

	.root_wizard > li > span.active:before,
	.root_wizard > li > a.active:before {
		border-color: #CCC transparent transparent transparent;
		border-style: solid;
		border-width: 10px;
		content: "";
		left: 50%;
		margin-left: -10px;
		position: absolute;
		top: 100%;
		margin-top: 0px;
		z-index: 99;
	}

	.root_wizard_wrapper {
		overflow: hidden;
		position: relative;
		height: 70px;
	}

	.root_wizard_wrapper > .root_wizard {
		position: absolute;
		top: 0;
		left: 0;
		min-width: 1000px;
	}

	.root_wizard_wrapper + .bg-menu {
		margin-top: -20px;
		border-top: 1px solid #CCC;
	}

	@media (max-width: 1100px) {
		.root_wizard > li > span,
		.root_wizard > li > a {
			padding: 13px 10px;
		}
	}

	/* Pages -----------------------------------------  */
	.privacy h5,
	.kiyaku h5 {
		margin: 1em 0 0.5em 0;
		font-weight: bold;
		padding-top: 1em;
		border-top: 1px dotted #CCC;
	}

	.privacy h6,
	.kiyaku h6 {
		font-size: 14px;
		font-weight: bold;
	}

	.privacy ul,
	.kiyaku ol {
		padding-left: 2em;
	}

	.privacy ol ol,
	.privacy ol ul,
	.privacy ul ol,
	.privacy ul ul,
	.kiyaku ol ol,
	.kiyaku ol ul,
	.kiyaku ul ol,
	.kiyaku ul ul {
		margin-top: 0.5em;
		padding-left: 2em;
	}

	.privacy li,
	.kiyaku li {
		line-height: 1.5em;
		margin-bottom: 0.5em;
	}

	.privacy table,
	.kiyaku table {
		/*width:100%;*/
		margin-bottom: 1em;
	}

	.privacy th,
	.privacy td,
	.kiyaku th,
	.kiyaku td {
		padding: 0.5em 1em;
		border: 1px solid #CCC;
	}

	.privacy th,
	.kiyaku th {
		text-align: center;
		background-color: #F9F9F9;
	}

	.price table {
		width: 100%;
		margin-bottom: 1em;
	}

	.price th,
	.price td {
		text-align: center;
		padding: 0.5em 1em;
		border: 1px solid #CCC;
	}

	.price th {
		background-color: #F9F9F9;
	}

	.price tbody th {
		width: 10em;
	}

	.price thead th {
		background-color: #EEE;
	}


	#member_barcode {
		max-height: 120px;
		max-width: 100%;
	}

	.profile-userpic {
		float: none;
		width: 90px;
		height: 90px;
		margin-bottom: 1em;
	}

	@media (max-width: 991px) {
		.profile-userpic {
			width: 128px;
			height: 128px;
		}
	}

	@media (max-width: 768px) {
		ul {
			padding-left: 2em;
		}


		.copyright {
			padding: 0 0 20px 0;
			border: none;
		}

		.copyright > p a {
			display: block;
			padding: 1em;
			margin: 0;
			background-color: #FFF;
			border: 1px solid #EEE;
			border-radius: 1px;
			margin-bottom: 1px;
		}

		.copyright > p .muted {
			display: none;
		}
	}


	/* Modals -----------------------------------------  */
	@media (max-width: 768px) {
		.modal .modal-header {
			padding: 10px 10px 0 10px;
		}

		.modal .modal-body {
			padding: 0 10px 10px 10px;
		}
	}

	/*triangle select active*/
	.nav-tabs-linetriangle > li > a.active:after {
		border-top-color: #f6f9fa;
	}


	/* loading -----------------------------------------  */
	.loading {
		position: fixed;
		top: 0;
		left: 0;
		color: #FFF;
		z-index: 9999;
		text-align: center;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.5);
	}

	.loading > .fa {
		position: absolute;
		top: 50%;
		left: 50%;

	}


	/* ----------------------------------------------------
     Rotating
     ---------------------------------------------------- */
	.rotating {
		-webkit-animation: rotating-function 1s ease-in-out infinite;
		-moz-animation: rotating-function 1s ease-in-out infinite;
		-ms-animation: rotating-function 1s ease-in-out infinite;
		-o-animation: rotating-function 1s ease-in-out infinite;
		animation: rotating-function 1s ease-in-out infinite;
	}

	@-webkit-keyframes rotating-function {
		from {
			-webkit-transform: rotate(0deg);
		}
		to {
			-webkit-transform: rotate(360deg);
		}
	}

	@-moz-keyframes rotating-function {
		from {
			-moz-transform: rotate(0deg);
		}
		to {
			-moz-transform: rotate(360deg);
		}
	}

	@-ms-keyframes rotating-function {
		from {
			-ms-transform: rotate(0deg);
		}
		to {
			-ms-transform: rotate(360deg);
		}
	}

	@-o-keyframes rotating-function {
		from {
			-o-transform: rotate(0deg);
		}
		to {
			-o-transform: rotate(360deg);
		}
	}

	@keyframes rotating-function {
		from {
			transform: rotate(0deg);
		}
		to {
			transform: rotate(360deg);
		}
	}




	/* Alert -----------------------------------------  */
	.alert i {
		font-size: 150%;
		vertical-align: middle;
		margin-right: 0.5em;
	}

	@media (max-width: 768px) {
		.alert i {
			font-size: 16px;
			margin-right: 0.5em;
		}

		.alert > p, .alert > ul {
			padding-left: 0;
		}
	}

	/* IE hack */
	_:-ms-lang(x)::-ms-backdrop, .menu-items > li > .icon-thumbnail {
		height: 20px;
		width: 20px;
		line-height: 50px;
	}

	@media all and (-ms-high-contrast: none) {
		.menu-items > li > .icon-thumbnail {
			height: 20px;
			width: 20px;
			line-height: 50px;
		}
	}


	.photo_gallery {
		margin: 0.5em 0;
	}

	.photo_gallery > .pic {
		width: 100%;
		height: auto;
	}

	.photo_gallery > ul {
		margin: 5px 0 0 0;
		padding: 0;
		list-style: none;
	}

	.photo_gallery > ul > li {
		display: inline-block;
		position: relative;
		width: 40px;
		height: 40px;
		overflow: hidden;
		margin-right: 2px;
		border: 3px solid #FFF;
	}

	.photo_gallery > ul > li:hover {
		cursor: pointer;
	}

	.photo_gallery > ul > li:first-child {
		border-color: #FC0;
	}

	.photo_gallery > ul > li > img {
		height: 40px;
		width: auto;
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
	}