
.btn-primary {
  color: #fff;
  background-color: #EFB73E;
  border-color: #EFB73E;
}

.btn-primary:hover {
  color: #fff;
  background-color: #ecaa1b;
  border-color: #e7a413;
}

.btn-primary:focus, .btn-primary.focus {
  -webkit-box-shadow: 0 0 0 0.2rem rgba(239, 183, 62, 0.5);
          box-shadow: 0 0 0 0.2rem rgba(239, 183, 62, 0.5);
}

.btn-primary.disabled, .btn-primary:disabled {
  color: #fff;
  background-color: #EFB73E;
  border-color: #EFB73E;
}

.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: #e7a413;
  border-color: #db9c12;
}

.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus {
  -webkit-box-shadow: 0 0 0 0.2rem rgba(239, 183, 62, 0.5);
          box-shadow: 0 0 0 0.2rem rgba(239, 183, 62, 0.5);
}


/* --- フォーム --- */
form .disable {
	color: #888;
}

input.small {
	width:200px;
}
input.medium {
	width:400px;
}
input.large {
	width:600px;
}
input.length4 {
	width:60px;
}
input.length10 {
	width:100px;
}
input.date {
	width:100px;
}
input.time {
	width:70px;
}

textarea.small {
	width:500px;
	height:100px;
	resize: vertical;
}
textarea.medium {
	width:500px;
	height:200px;
	resize: vertical;
}


/* --- App Header --- */
div#appHeader {
	margin-top: 0px;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	height: 81px;
/* 	background-image: url(../img/header/header_L2.png), */
/* 		url(../img/header/header_R2.png), */
/* 		url(../img/header/header_m.png); */
/* 	background-repeat: no-repeat, no-repeat, repeat-x; */
/* 	background-position: top left, top right, top right; */
}

div#appHeader div#logo {
	float: left;
}
div#appHeader .logo {
	margin-top: 5px;
	margin-left: 10px;
}

div#appHeader div#login {
	float: right;
	text-align: right;
	margin-top: 5px;
	margin-right: 10px;
}

div#appHeader div#node {
	clear: left;
	font-size: 167%;
	margin-top: 5px;
	margin-left : 20px;
}
div#appHeader div#node a {
	text-decoration: none;
	font-weight: bold;
	vertical-align: top;
}

div#breadCrumbNodeList {
	margin-top:10px;
}

div#breadCrumbNodeList a:hover {
	color: #3c8dbc;
}

/* --- サポートコンテンツ --- */
div.support div.main0 div.item,div.support div.main1 div.item  {
	border-left: 1px #9E9882 solid;
	border-top: 1px #9E9882 solid;
	border-right: 1px #9E9882 solid;
	border-bottom: 1px #9E9882 solid;
	margin-bottom: 10px;
}

div.support div.main0 div.groupItem, div.support div.main1 div.groupItem  {
	background: #FFFFFF;
	border-left: 1px #ffbb88 solid;
	border-top: 1px #ffbb88 solid;
	border-right: 1px #ffbb88 solid;
	border-bottom: 1px #ffbb88 solid;
	margin-bottom: 10px;
}
	
div.support div.main0 div.groupItem div.groupCaption {
	padding: 10px;
	color: #000000;
	border-top: 3px #ff5500 solid;
	font-size: 120%;
}

div.support div.main0 div.groupItem div.link {
	padding: 5px 10px 5px 20px;
	font-size: 93%;
}

div.support div.main0 div.item div.caption,div.support div.main1 div.item div.caption {
	padding: 10px;
	background: #FFFFFF;
	border-top: 3px #9E9882 solid;
	font-size: 121%;
}

div.support div.main0 div.item div.contents,div.support div.main1 div.item div.contents {
	padding-left:   20px;
	padding-right:  20px;
	padding-top:    10px;
	padding-bottom: 10px;
	background: #FFFFFF;
	font-size: 100%;
}

div.support h3 {
	font-size: 108%;
	margin: 0.5em 0px 0.5em 0px;
	padding: 10px;
	background: #FFFFFF;
	border-top: 2px #9E9882 solid;
	border-left: 1px #9E9882 solid;
	border-right: 1px #9E9882 solid;
	border-bottom: 1px #9E9882 solid;
}

div.support div.group {
	width : 600px;
	margin-bottom : 50px;
}

div.support div.qa {
	width : 600px;
}

div.support div.qa div.qaitem {
	border-left: 1px #9E9882 solid;
	border-top: 1px #9E9882 solid;
	border-right: 1px #9E9882 solid;
	border-bottom: 1px #9E9882 solid;
	margin-bottom: 30px;
	line-height:2em;
}


div.support div.qa div.qaitem div.qacontents {
	padding-left:   30px;
	padding-right:  30px;
	padding-top:    20px;
	padding-bottom: 20px;
	background: #FFFFFF;
	font-size: 93%;
}

div.support div.qa div.qaitem div.qacaption {
	padding: 10px;
	background: #FFFFFF;
	border-top: 3px #9E9882 solid;
	font-size: 121%;
}

div.support div.qa div.qaitem div.qaback {
	background: #FFFFFF;
	text-align : right;
	padding-right : 10px;
}

.support p {
	margin-bottom: 1em;
}

.support ul {
	list-style-type: disc;
}

.support li {
	margin-bottom: 2px;
}


div.support a {
	text-decoration: none;
	font-weight: bold;
	color : #0000FF;
}

div.support a:hover {
	text-decoration: underline;
	font-weight: bold;
	color : #0000FF;
	background : #cccccc;
}

/* 画面縮小対応 */

/* 全体の調整 */
body {
	overflow-x: auto;
	min-width: 1200px;
}

/* bootstrapの調整 */

/* navbarを常にfloatに  */
.navbar-nav {
  float: left;
  margin: 0;
}
.navbar-nav > li {
  float: left;
}
@media (min-width: 0px) {
	/* メインヘッダーの調整  */
	.navbar-static-top>.navbar-nav>li>a {
	    padding-top: 15px !important;
	    padding-bottom: 15px !important;
	}
}

/* 独自要素の調整  */
@media (min-width: 0px) {
	/* アカウントのドロップダウンメニューの調整(縮小時透明にされるため) */
	#login>.navbar-custom-menu>.navbar-nav .open .dropdown-menu {
	  background-color: #fff !important;
	}
	/* 管理者ボタンの調整(ノードのパンくずと衝突しないようにする) */
	#login>.navbar-custom-menu>.navbar-nav>li>a {
	    padding-top: 10px !important;
	    padding-bottom: 10px !important;
	}
}

/* Bootstrapのグリットスタイルで高さを揃える */
.row-eq-height {
	display: flex;
	flex-wrap: wrap;
}

/* icheck focus */
.icheck_focus {
	border-color: rgba(106, 161, 192, 1.0);
	box-shadow: 0 0 0 5px rgba(14, 118, 168, 0.2);
	border-radius: 1px;
}

/* label disabled */
.label.disabled {
	opacity: 0.5;
	cursor: pointer; /* aタグ付けない場合のためポインタにしておく */
}

/* アンケート用 */
#survey-setting {
	/* レイアウト微調整（次へボタンと距離を空ける） */
	padding-bottom: 20px;
}

.sq-form-row {
	padding-left: 24px;
}

/* フォーム横並び (bootstrap3使いにくいので) */
.flex-row {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
/*	justify-content: space-between;*/
	margin-bottom: 10px;
}

.flex-row.center {
	justify-content: center;
}

.flex-row.space-evenly {
	justify-content: space-evenly;
}

.flex-row.align-normal {
	align-items: normal;
}

.flex-row.align-baseline {
	align-items: baseline;
}

/* bottom margin無しにしたい場合はno-marginを付与 */
.flex-row.no-margin {
	margin-bottom: 0px;
}

.flex-row .flex-row-item {
	margin-right: 15px;
	max-width: 80%;
}

/* 右端の1要素だけ端に寄せる */
.flex-row .flex-row-item.pull-right {
	margin-left: auto;
	margin-right: 0;
}

/* 左端の1要素だけ端に寄せる */
.flex-row .flex-row-item.pull-left {
	margin-right: auto;
	margin-left: 0;
}

/* タブ表示関連 */
.nav-tabs-custom>.nav-tabs>li.active {
	/* 色表示を合わせる */
	border-top-color: #EFB73E;
}

.nav-tabs-custom {
	/* background白をreset */
	background: initial;
}

.nav-tabs-custom .tab-content {
	padding-top: 25px; /* やや狭いので項目間の幅に合わせる調整 */
}

.nav-tabs-custom .box-footer.clear-bottom-padding {
	/* nab-tabs-customでbox-footerを使うとpaddingが多くなるので調整 */
	padding-bottom: 0px;
}

li.sq-item-view {
	list-style-type: none;
}

li.sq-item-view.with-border {
	border-top: 1px solid #ddd;
}

ul.sq-view {
	padding-inline-start: 0;
}

/* sortablejs handles */
 .sq-sortable {
	 cursor: move;
	 cursor: -webkit-grabbing;
	 display: inline-flex;
	 align-items: center;
	 justify-content: center;
}

 .sq-sortable-ghost {
	 opacity: 0.0;
 }

.sq-sortable-drag {
	opacity: 0.1;
	cursor: move;
}

.sq-sortable .grip-icon {
	width: 20px;
	height: auto;
	transform: scale(1.0, 0.8);
}

.flex-row .flex-row-item.center-grow-1 {
	flex-grow: 1;
	align-self: flex-start;
}

.flex-col {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.flex-col-item {
	margin-bottom: 15px;
}

.sq-form-separator {
	margin: 20px;
	border-top: 1px solid #ccc;
}

.sq-number {
	font-weight: bold;
	font-size: 24px;
}

.sq-item-view .sq-req {
	font-size: 14px;
}

.sq-item-view .sq-type {
	font-size: 13px;
}

.sq-item textarea {
	resize: none;
}

.sq-item-view textarea {
	resize: none;
}

.sq-tool {
	padding-top: 32px;
	padding-bottom: 32px;
	margin-bottom: 20px;
/*	border-radius: 10px;*/
	border: 2px dashed rgba(0, 0, 0, 0.3);
}

.sq-type {
    font-family: 'FontAwesome','Source Sans Pro','Helvetica Neue',Helvetica,Arial,sans-serif;
}

textarea.sq-desc {
	max-width: 80%;
}

input.sq-op-val {
	width: 75%;
}

.flex-row-item.sq-op-extra {
	margin-left: 20px;
	margin-right: 0;
}

.padding-h-0 {
	padding-left: 0;
	padding-right: 0;
}

span.sq-op-val.align-with-label {
	margin-bottom: 5px;
}

.sq-op-label {
	color: #a3a3a3;
	font-size: 18px;
}

.sq-scale-titles {
	display: flex;
	justify-content: space-between;
	color: #868686;
}

.sq-scale-ops {
	display: flex;
	justify-content: space-between;
	margin-right: 15px;
	margin-left: 15px;
}

.sq-scale-op {
	margin-right: 10px;
}

.sq-scale-op-val {
	font-weight: bold;
}

.sq-scale-titles > span {
	max-width: 10%;
}

/* 質問項目フォーム */
/* 質問項目フォームエラー(survey用) */
#sq-form textare.has-error {
	border-color: #ff6806;
}

#sq-form .sq-op-val-error {
	margin-left: 30px; /* アイコン分ずらす */
}

/* アンケート設定切り替えタブ */
.survey-settings {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
}

.survey-settings .survey-settings-content {
/*	max-width: 77%;*/
	flex: 1;
}

.survey-settings .survey-nav {
	width: 230px;
	will-change: min-height;
	padding-right: 20px;
}

/* アンケート設定step */
.survey-nav .sidebar__inner {
	left: auto !important;
	/*display: inline-block;*/

	transform: translate(0, 0); /* For browsers don't support translate3d. */
	transform: translate3d(0, 0, 0);
	will-change: position, transform;
	/*	margin-left: 10px;*/
}

.survey-nav ol, .survey-nav ul {
	padding-left: 10px;
}

.survey-nav li {
	list-style-type: decimal;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
/*	padding-top: 5px;
	padding-bottom: 10px;*/
}

.survey-nav .setting-items {
	/* 項目後の下線の幅を調整する */
	width: 80%;
}

.survey-nav .setting-items li::after {
	display: inline-block;
	content: "";
	width: 100%;
	height: 1px;
	background-color: #c9c9c9;
	margin-top: 5px;
}

.survey-nav .survey-nav-items > li {
	list-style-type: decimal;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;

	padding-top: 10px;
	padding-left: 10px;
	padding-bottom: 8px;
	margin-bottom: 10px;
/*	background-color: #f8f6f6;*/
	background-color: #fff;
	border-radius: 5px;
}

.survey-nav li.survey-nav-view-items {
	margin-bottom: 30px;
}

.survey-nav li.item {
	margin-bottom: 15px;
	margin-top: 10px;
}

.survey-nav .setting-item-number {
	color: #a3a3a3;
	margin-bottom: 5px;
}

.survey-nav .item-container {
	display: flex;  /* for icon	*/
	align-items: center;
}

.survey-nav .item-caption {
	color: #000000;
/*	margin-bottom: 15px;*/
	font-size: 16px;
	margin-right: 10px;
	cursor: pointer;
}

.survey-nav .item.active .item-caption {
	font-weight: bold;
}

.survey-nav .item-caption .setting-status {
	margin-left: 5px;
}

.survey-nav .nav-group-caption {
	color: #a3a3a3;
}

.survey-nav .nav-group-caption.active {
	font-weight: bold;
	color: #000000;
}

.survey-nav .survey-nav-operations .nav-group-caption {
	margin-bottom: 10px;
}

.survey-nav-setting-items .setting-item .setting-status.setting-status--warn {
	color: #f39c12;
}

.survey-nav-setting-items {
	border-top: 3px solid #f39c12;
}


/* アンケート設定step用微調整 */
.survey-settings .form-group {
	margin-left: 10px;
}

/* label改行抑制 */
.form-group .label {
/*	white-space: nowrap;*/
	word-break: keep-all;
}

/* ラジオボタンがdisabledのとき、ラベルを半透明に */
label.form-control-static.disabled {
	opacity: .5;
}

/* 以下はfirefoxが対応してない */
/*
.form-control-static:has(input[type="radio"][disabled]) {
	opacity: .5;
}*/

/* bootstrap4~のoutlineボタンスタイルを持ってきたもの */
.btn-outline {
	background-color: transparent;
	color: inherit;
	transition: all .5s;
}

.btn-primary.btn-outline {
	color: #EFB73E;
}

.btn-success.btn-outline {
	color: #5cb85c;
}

.btn-info.btn-outline {
	color: #5bc0de;
}

.btn-warning.btn-outline {
	color: #f39c12;
	border-color: #f39c12;
}

.btn-danger.btn-outline {
	color: #d9534f;
}

.btn-primary.btn-outline:hover,
.btn-success.btn-outline:hover,
.btn-info.btn-outline:hover,
.btn-warning.btn-outline:hover,
.btn-danger.btn-outline:hover {
	color: #fff;
}

/* pagination用 */
.pagination-nav-flex {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.pagination-nav-flex .pagination {
	/* margin調整(boxと同じに) */
	margin: 0 0;
	padding-bottom: 10px;
}

/* bootstrapのdropdownのalignmentがずれるので微調整 */
.btn-group .btn {
	display: flex;
	align-items: center;
}

/* datatablesで2行分表示する場合のmiddle alignment */
.table>tbody>tr>td.cell-middle {
	vertical-align: middle;
}
