@charset "UTF-8";

/* ============================================================
   ダイアログ（#js_mase_dlg）をドラッグ移動可能にするための上書き
   ------------------------------------------------------------
   jQuery UI Dialog はタイトルバーを掴んでドラッグする仕組みだが、
   mase.css でタイトルバーが height:0 に潰されているため掴めない。
   見た目（タイトルバー非表示）は変えず、ダイアログ上部に透明な
   ドラッグ用の掴み帯を確保する。
   ※ custom.css は jquery-ui-1.12.1.css より前に読み込まれるため、
     jquery-ui 側の position:relative / padding に勝てるよう !important を付与する。
   ============================================================ */
.ui-dialog .ui-dialog-titlebar {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 2.5rem !important;
    padding: 0 !important;
    background-color: transparent !important;
    border: none !important;
    cursor: move !important;
    /* 本文（.ui-dialog-content）より前面に出し、掴み帯でドラッグ開始を拾えるようにする */
    z-index: 2 !important;
}
/* 閉じる[×]ボタンは掴み帯より前面に保ち、クリックを優先させる */
.ui-dialog .ui-dialog-titlebar-close {
    z-index: 3 !important;
}

/* ============================================================
   モーダルの背景オーバーレイ（黒／灰の透過幕）を消す
   ------------------------------------------------------------
   ダイアログを「単に上から表示」させたいので、背面を覆う色を消す。
   要素自体は残すため、背面クリックをブロックするモーダル挙動は維持される。
   ※ mase.css(rgba(0,0,0,.5)) / jquery-ui.css(#aaaaaa .3) の双方を確実に
     打ち消すため !important を付与する。
   ============================================================ */
.ui-widget-overlay {
    background: transparent !important;
    background-color: transparent !important;
    opacity: 0 !important;
}

/* ============================================================
   背景の幕が無くなる分、ダイアログが「枠」として背景から浮いて
   見えるよう、周囲に影と細い境界線を付けて差を出す。
   ============================================================ */
.ui-dialog {
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3) !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
}