@charset "UTF-8";

/** メインコンテンツ表示領域 */
section.content {
	margin: 50px 15px 0 315px;
	padding-left: 300px;
}

/** メインコンテンツ - カード */
div.card {
	padding: 12px;
}

/** 画面タイトル */
div.h4 {
	font-weight: bold;
	color: #00BCD4;
}

/** モーダル画面タイトル */
div.h4.modal-title {
	font-weight: bold;
	color: #00BCD4;
	text-align: left;
}

/** 画面内コンテンツタイトル */
div.h5 {
	font-weight: bold;
	border-bottom: solid #2aaac7;
}

/** メインコンテンツ内のボタン */
.btn.main-contents-button
, .btn.main-contents-button:hover
, .btn.main-contents-button:focus {
	background-color: #00BCD4;
	color: white;
	margin: 5px 0px;
}

/** padding top 10px */
.padding-t-10{
	padding-top: 10px;
}

/** メッセージエリア */
.message-area {
    margin-bottom: 20px;
    padding: 15px 30px;
    width: 100%;
    color: #ffffff;
}

/** エラーメッセージ */
.message-error {
	background-color: rgb(251, 72, 58);
}

/** ワーニングメッセージ */
.message-warning {
	background-color: rgb(255, 150, 0);
}

/** インフォメッセージ */
.message-ifo {
	background-color: rgb(0, 176, 228);
}

/** 各入力テキストボックス */
input.form-control[type="text"]
, input.form-control[type="tel"] {
	padding: 5px;
}

/** テキストボックス項目 */
.item-text-field {
	display: flex;
	flex-direction: row;
	align-items: center;
}

/** 項目間の余白サイズ */
.item-margin {
	margin-bottom: 15px;
}
.item-group-margin {
	margin-bottom: 5px;
}

/** ラジオボタン(横並び)項目 */
.item-radio-row {
	display: flex;
	flex-direction: row;
	align-items: center;
}

/** 必須項目 */
.item-required {
	color: red;
}
.item-required-caution {
	color: red;
	font-weight: bold;
}

/** メインコンテンツ内のボタン */
.btn.main-contents-button
, .btn.main-contents-button:hover
, .btn.main-contents-button:focus {
	background-color: #00BCD4;
	color: white;
}
.btn.main-contents-button {
	margin: 5px 0px;
}

/** 画面内コンテンツタイトル（div.h5よりも強調して表示）*/
.h5-other{
    background-color: #00BCD4;
    color: white;
    height: 30px;
    padding: 6px 0px 5px 6px;
    font-weight: bold;
    font-size: 18px;
    line-height: 1.1;
    clear: left
}

/** セカンダリカラー */
.btn-secondary-color {
    background-color: #B6EBF2 !important;
    color: #333 !important;
}

/** 他のクラスのボーダーカラーをオーバーライドする */
.btn-secondary-border-color {
    border: 1px solid #B6EBF2 !important;
}

/** ファイル style.css から呼び出された色を上書きする */
.card .btn-secondary-color {
    color: #333 !important;
}

/** プライマリカラー */
.btn-primary-color
, .btn-primary-color:hover
, .btn-primary-color:active
, .btn-primary-color:focus {
    background-color: #00BCD4 !important;
    color: #FFF !important;
}

/** ボタン同士の間隔を広げる */
.btn-common-space {
    margin-left: 5px !important;
}

/** 重要操作カラーとする */
.btn-important-operation {
    background-color: #E91E63 !important;
    border: 1px solid #E91E63 !important;
    color: #FFF !important;
}

/** マウスオーバー時 */
.btn-important-operation:hover {
    border: 1px solid #E91E63 !important;
    color: #000 !important;
}

/** 両ボタン幅を統一する */
.btn-common-width {
    width: 115px !important;
}

/** 基本的な */
.btn-basic-with {
    width: 100px !important;
}

/** 「報告書データの更新」ボタンで更新される項目に引く色付き下線 */
.updateitem-underline {
	background: linear-gradient(transparent 80%, #AAFF99 0%);
}

/** エラーメッセージ*/
.message-error-zipcd {
    color: red;
}
.margin-zipcd-msg {
    margin-bottom : 0px !important;
}

/* チェックされた状態のラジオボタンの共通CSSクラス */
[type="radio"].radio-col-common:disabled:checked + label:before {
    border: 2px solid rgba(0, 0, 0, 0.26)!important;
    background-color: transparent !important;
}
 
[type="radio"].radio-col-common:disabled:checked + label:after {
    border: none !important;
    background-color: rgba(0, 0, 0, 0.26) !important;
}
 
[type="radio"].radio-col-common:checked + label:before{
    border: 2px solid #00BCD4 !important;
}
 
[type="radio"].radio-col-common:checked + label:after {
    background-color: #00BCD4 !important;
    border: 2px solid #00BCD4 !important;
    transform: scale(0.5) !important;
}

/** ヘッダーテキスト - ツールチップ表示 */
.common-tooltip + .tooltip .tooltip-inner {
    border-radius: 5px;
    background-color : #00BCD4;
    border-color : #00BCD4;
    color: #fff;
    text-align : center;
    min-width : 210px;
    word-break: break-all;
}

/** ツールチップ（矢印） */
.common-tooltip + .tooltip .tooltip-arrow  {
    display: none !important;
}
