﻿@charset "utf-8";

/*@font-face {
	font-family: 'SawarabiGothic';
    font-family:'SawarabiGothic-Regular';
    src:url('fonts/SawarabiGothic-Regular.ttf') format('truetype');
}*/

/*
=======================================
	Reset CSS
=======================================
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, main, menu, nav, section, summary,
time, mark, audio, video{
	margin:0;
	padding:0;
}
h1, h2, h3, h4, h5, h6 {
	font-size:14px;
	font-weight:500;
}

article,aside,details,figcaption,figure,
footer,header,main,menu,nav,section{
	display:block;
}

html{
	-webkit-text-size-adjust: 100%;
	font-size: 14px;
}

body{
	padding:0;
	color: #000;
	font-family: "游ゴシック","游ゴシック体",YuGothic,Yu Gothic,"ヒラギノ角ゴ ProN",Hiragino Kaku Gothic ProN,"Helvetica Neue",Helvetica,Arial,sans-serif;
	font-weight:500;
}

div, p, button, a {
	box-sizing:border-box;
}
input, select {
	margin-top:0;
	box-sizing:unset;
	vertical-align:middle;
}

inpu:focus, input[type='password']:focus, input[type='text']:focus, input[type='email']:focus,input[type='submit']:focus
input[type='search']:focus,input[type='number']:focus ,input[type='checkbox']:focus,input[type='radio']:focus,input[type='button']:focus
textarea:focus, button {
	outline:0;
	box-shadow:none;
}

img{
	border: 0;
	max-width: 100%;
	height: auto;
}

ul,ol{
	list-style-type: none;
}

button{
	transition:opacity .2s;
	border:none;
	background:none;
}

a{
    text-decoration:none;
    outline:0;
}

table {
	border-collapse: collapse; 
	border-spacing: 0;
}

.h_font {
    font-weight:800;
}

.h2_font {
    font-weight:800;
}

.h3_font {
    font-weight:500;
}

input[type='button'] {
    background:none;
    border-style:none;
    border-radius:0px;
    cursor:pointer;
}

section.my-editor-container {
    margin-bottom:100px;
}

/* [start] mai */

.sprite {
	position:absolute;
	box-sizing:border-box;
	left:0;
	top:0;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;

	transition:box-shadow 0.2s ease;
}

/* stage */

.sp_stage_component {
	position:relative;
	background-color:#fff;
	-webkit-transform:scale(1.0);
	transform:scale(1.0);
	left:0px; top:0px; 
}

.sp_stage_event_catcher {
	display:none;
	position:absolute;
	left:0px; top:0px;
	z-index:9999;
	width:100%; height:100%;
	background-color:transparent;
}

/*.area_sprite {
	position:relative;
}*/

.area_input_screen {
	display:none;
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
	z-index:1000;
	opacity:0.2; /*TEST*/
	background-color:#ff0000; /*TEST*/
}

.sp_moveable_container {
	box-sizing:border-box;
	width:100%;
	height:100%;
	/*border:solid 1.5px #222;*/
    box-shadow: 0 0 0px 1px #888;
}

/* piece sprite */
.sp_piece_component {
	box-shadow: 0 0 0px 1px #aaa;
	transition:box-shadow 0.2s ease;
    cursor:pointer;
}

.sp_border_off {
	box-shadow:0 0 0 0px;
}

.sp_current {
	box-shadow: 0 0 0px 2px dodgerBlue; /* 2px or 4px */
	/*transition:box-shadow 0.2s ease;*/
}


.sp_piece_component .char_screen {
	visibility:visible;
}

.sp_piece_component textarea {
	resize:none;
	overflow:hidden;
	position:absolute;
	left:0; top:0;
	width:100%; height:100%;
	padding:0;
	border:none;
	background:none;
	display:none;
}

/* character Sprite */
.sp_piece_component .char_screen, 
.sp_piece_component textarea {
	box-sizing:border-box;
	padding:0;
	border:none;
	white-space: pre;/*半角スペース、改行を反映する。自動改行なし*/
	font-family:inherit;/*仮置き*/
	color:#000;
}

.sp_line_component {
	background-color:#000;
}

.sp_line_picker {
    display: flex;
	justify-content:center;
	align-items:center;
	position:absolute;
	left:96%;
	top:-22px;
	width:20px;height:20px;
	background: #f8f8ff;
    border-radius:50%;
	color:#888;
	font-size: 12px;
	box-shadow:2px 2px 2px rgb(0,0,0,0.2);
	transition:color ease 0.2s;
	z-index:100;
	cursor:pointer;
}
.sp_line_picker:hover {
	color:#43c4fb;
}

/* LinearCharComponent sprite */

.sp_linear_char_frame{
	box-sizing:border-box;
	position:relative;
	width:100%; height:100%;
	padding:0;
	border:none;
	border-radius:0;
}

.sp_linear_char_screen {
	box-sizing:border-box;
    position:absolute;
	left:0; top:0;
	display:flex;
	justify-content:space-between;
	align-items:center;
	width:100%; height:100%;
}

.sp_linear_char_screen > span {
	display:inline-block;
	box-sizing:border-box;
	white-space:pre;
}

.sp_linear_char_placeholder {
	position:absolute;
	white-space:pre;
	top:0; left:4px;
	display:none;
	align-items:center;
	width:100%; height:100%;
	color:#bbb;
	opacity:0.7;
	font-weight:800;
	font-size:15px;
}

.sp_linear_char_editor {
	box-sizing:border-box;
	display:none;
	position:absolute;
	left:0; top:0;
	width:auto;
	margin:0; padding:0; border:none;
    padding-left:2px;
	line-height:normal;
	background-color:#fff;
	font-size:14px;
	font-family:inherit;
	width:100%; height:100%;
}

.sp_linear_char_gauge {
    box-sizing:border-box;
    visibility:hidden;
    pointer-events:none;
	position:absolute;
	left:0; top:0;
    white-space:nowrap;
}

.sp_char_edit_label {
    display: flex;
    position: absolute;
    top: 0;
    right: 0;
    /*pointer-events: none;*/
    align-items: center;
    width: 20px;
    height: 100%;
    visibility: hidden;
}
.sp_char_edit_label .icon {
    color:dodgerblue;
    font-size:16px;
}

.sp_char_edit_ok {
    position: absolute;
    right: 0px;
    top: 102%;
    border-radius: 8px;
    border-style: none;
    background: dodgerblue;
    color: #fff;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
    font-size: 15px;
    font-weight: 800;
    cursor: pointer;
    transition: background-color linear 0.2s;
    padding: 3px 15px;
}
.sp_char_edit_ok:hover {
    background-color:#60C3FF;
}


.img_frame {
	position:relative;
	width:100%; height:100%;
}

.sp_piece_component .img_screen {
	position:absolute;
	width:100%; height:100%;
}

.sp_piece_component .img_org {
	position:absolute;
	display:none;
	width:100%; height:100%;
}
/* new */

.sp_guide_container,
.sp_background_container {
	position:relative;
	width:100%; height:100%;
	pointer-events:none;
}

.sp_area_container {

}

.sp_moveable_container {

}

.sp_img_area {
	box-sizing:border-box;
	position:absolute;
	display:flex;
    flex-direction:column;
	align-items:center;
	justify-content:center;
	left:0; top:0;
	width:0; height:0;
	text-align:center;
	margin:auto;
	/*border:solid 1px #aaa;*/
	background-color:#eee;
    cursor:pointer;
}

.sp_image_area_label {
    font-size:11px;
    color:dodgerblue;
    font-weight:800;
    line-height: 11px;
    margin-top: 2px;
}
.sp_image_area_label.loaded {
    color:#888;
}

.sp_img_load_btn {
	box-sizing:border-box;
	border:none;
	/*background-color:dodgerblue;*/
	border-radius:3px;
	width:50%; height:50%;
	max-width:30px; max-height:30px;
	min-width:20px; min-height:20px;
	color:#fff;
	padding:0;
    cursor:pointer;
}

.sp_img_load_btn .image_icon {
    color:dodgerblue;
}
.sp_img_load_btn .image_icon:hover {
    color:#43c4fb;
}
.sp_img_load_btn .image_icon.loaded {
    color:#898989;
}
.sp_img_load_btn .image_icon.loaded:hover {
    color:#898989;
}

.sp_img_load_btn .image_icon svg {
    fill:currentColor;
	width:100%; height:100%;
}


.sp_input_image_file {
	height:0px;
	width:0px;
	visibility:hidden;
}

.sp_boundingbox_component {
	pointer-events:none;
	box-sizing:content-box;
    box-shadow:0 0 0 2px dodgerBlue;
	/*border-width:3px;
	border-style:double;*/
	/*border-color:#aaa;*/
}
/*TEST OUT*/
.sp_boundingbox_balloon {
}

.sp_boundingbox_basepoint {
	pointer-events:none;
	position:absolute;
	left:0; top:0;
	width:8px; height:8px;
	background-color:crimson;
}

.sp_boundingbox_resize_pick {
	pointer-events:all;
	box-sizing:content-box;
	position:absolute;
	width:10px; height:10px;
	text-align:center;
	background-color:dodgerBlue;
	border-radius:50%;
	transition:background-color ease 0.4s;
	cursor:pointer;
}
.sp_boundingbox_resize_pick:hover {
	background-color:#43c4fb;
}

.sp_boundingbox_move_pick {
	pointer-events:all;
	box-sizing:content-box;
	position:absolute;
	display:flex;
	justify-content:center;
	align-items:center;
	width:24px; height:24px;
	border-radius:50%;
	background-color:#f8f8ff;/*仮*/
	font-size:13px;
	color:#888;
	box-shadow:3px 3px 3px rgb(0,0,0,0.2);
	transition:color ease 0.4s;
    cursor:pointer;
}
.sp_boundingbox_move_pick:hover {
	color:#43c4fb;
}

.sp_bb_icon {
	display:block;
	font-size:8px;
	margin:0;
	color:#333;
}
.sp_bb_icon_l {
	transform:rotate(-90deg);
}
.sp_bb_icon_r {
	transform:rotate(90deg);
}
.sp_bb_icon_b {
	transform:rotate(180deg);
}

.sp_bb_icon svg {
	fill:currentColor;
	width:16px; height:16px;
}

.sp_tooltip_component {
	/*display:none;*/
	box-sizing:content-box;
	pointer-events:none;
	border-radius:5px;
	background:#303030;
	height:34px;
	transform:translateY(-2px);
	opacity:0;
	transition:opacity ease 0.4s, transform ease 0.4s;
}

.sp_tooltip_component_hide {
	top:0;
	left:0;
	height:0;
	visibility:hidden;
}

.sp_tooltip_component:after {
	content:" ";
	width:0px;
	border-top:18px solid #303030;
	border-left:8px solid transparent;
	border-right:8px solid transparent;
	position:absolute;
	left:20%;
	top:34px;
	margin-left:-8px;
}

.sp_toast_component {
	box-sizing:content-box;
	pointer-events:none;
	top:100%;
	left:50%;
	border-radius:5px;
	background:#303030;
	padding:8px;
	transform:translateY(0px);
	opacity:0;
	transition:opacity ease 0.4s, transform ease 0.4s;
}

.sp_toast_component_rise {
	transform:translateY(-50px);
	opacity:1.0;
}
.sp_toast_component:after {
	content:" ";
	width:0px;
	border-top:18px solid #303030;
	border-left:8px solid transparent;
	border-right:8px solid transparent;
	position:absolute;
	left:50%;
	top:100%;
	margin-left:-8px;
}

.sp_toast_screen {
	color:#fff;
	font-size:15px;
	white-space:pre;
}

.sp_measure_component {
	/*background-color:rgb(255,255,255,0.6);*/
}
.sp_width_measure {
	top:-18px;
	left:0;
	height:8px;
	border-left:1px solid #428bca;
	border-right:1px solid #428bca;
}
.sp_height_measure {
	left:-18px;
	top:0;
	width:8px;
	border-top:1px solid #428bca;
	border-bottom:1px solid #428bca;
}

.sp_measure_inner {
	position:relative;
	display:flex;
	justify-content:center;
	align-items:center;
}
.sp_width_measure .sp_measure_inner {
	width:100%;
	top:3.5px;
	height:auto;
	border-top:1px solid #428bca;
}
.sp_height_measure .sp_measure_inner {
	justify-content:end;
	height:100%;
	left:3.5px;
	width:auto;
	border-left:1px solid #428bca;
}

.sp_measure_label {
	position:absolute;
	display:block;
	padding:2px;
    background-color:#eff0f8;
	color:#428bca;
	font-size:12px;
}

.sp_height_measure .sp_measure_label {
    left:-30px;
    margin-top:-24px;
}

.sp_grid_component {
    box-sizing:border-box;
    pointer-events:none;
}
.sp_grid_inner {
    box-sizing:border-box;
    position:relative;
    width:100%; height:100%;
   /* border:solid 1px #BCC5D3*/
}

/*.sp_grid_vertical_inner,
.sp_grid_horizonal_inner {
    position:relative;
    width:100%; height:100%;
}*/

.sp_grid_vertical_line {
    position:absolute;
    height:100%;
    width:auto;
    border-left:solid 1px #eee;
}

.sp_grid_horizonal_line {
    position:absolute;
    width:100%;
    height:auto;
    border-top:solid 1px #eee;
}

.sp_guide_image_component {
    pointer-events: none;
}

.sp_guide_frame_component {
    pointer-events: none;
    box-shadow: 0 0 0px 1px #aaa;
    cursor:pointer;
}

.sp_tonbo_component {
    pointer-events: none;
}


.stage_holder {
    background-color:#fff;
}

/* [end] mai */


/* [start] mai_ui */
.ui_sp_slider_rail, ui_sp_curtain_rail {
	border-radius: 4px;
	background: #BCC5D3;
	width: 200px;
	height: 6px;
	margin: 5px;
	box-shadow: 1.8px 1.8px 3px #ccc;
}
.ui_sp_curtain_rail {
	position:relative;
} 

.short_slider .ui_sp_slider_rail {
    width:160px;
}

.ui_sp_slider_thumb {
	width: 15px;
	height: 15px;
	border-radius: 50%;
	position: relative;
	left: 10px;
	top: -3px;
	background-color:#F2F6F8;
	cursor: pointer;
	box-shadow: 1.8px 1.8px 3px #ccc;
	border:1px solid #BCC5D3;
	transition:background-color linear 0.3s;
}
.ui_sp_slider_thumb:hover {
	background-color:dodgerblue;
}
.ui_sp_curtain_rail .ui_sp_slider_thumb {
	position:absolute;
}
.ui_sp_curtain_rail .ui_sp_slider_thumb:hover {
	background-color:transparent;
}
.ui_sp_curtain_rail .ui_sp_slider_thumb.selected {
	background-color:dodgerblue;
}

.ui_sp_input_box {
	position:relative;
	display:flex;
	justify-content:space-between;
	align-items:center;
	padding:2px;
	background-color:#fff;
	border:solid 1px #ccc;
	border-radius:4px;
}
.ui_sp_numeric_box {
	width:100px; height:35px;
}

.ui_sp_numeric_input {
	box-sizing:border-box;
	flex-grow:1;
	width:100%;
	height:100%;
	line-height:100%;
	padding:2px;
	border:none;
	background-color:#fff;
	letter-spacing:1px;
	font-size:15px;
	text-align:right;
	font-weight:500;
	color:dodgerblue;
}

.ui_sp_input_sub_btn_box {
	display:flex;
	/*flex-wrap:wrap;*/
	/*align-content:center;*/
	align-items:center;
	height:100%;
	margin-left:5px;
}

.ui_sp_input_sub_btn_cell:first-child {
	/*margin-bottom:4px;*/
	margin-right:4px;
}

.ui_sp_input_sub_btn {
	display:block;
	cursor:pointer;
	color:#777;
	font-size:13px;
	transition:color linear 0.3s;
}
.ui_sp_input_sub_btn:hover {
	color:dodgerblue;
}
.ui_numeric_arrow_btn {
	font-size:12px;
}

/* Float UI */

.ui_fw_inner {
	display:flex;
	width:80%;
	height:90%;
	margin:auto;
}

.ui_fw_inner a {
	display:block;
	padding:10px;
	color:#fff;
	background-color:#6fa1fb;
	overflow:hidden;
	transition:background-color 0.5s cubic-bezier(0.35, 0, 0.25, 1);
}
.ui_fw_inner a:hover {
	color:#6fa1fb;
	background-color:#fff;
	font-weight:800;
}
.ui_fw_inner a.ui_reverse {
	color:#6fa1fb;
	background-color:#fff;
	overflow:hidden;
	transition:background-color 0.5s cubic-bezier(0.35, 0, 0.25, 1);
}
.ui_fw_inner a.ui_reverse:hover {
	color:#fff;
	background-color:#6fa1fb;
	font-weight:800;
}

.ui_fw_inner_list {
	display:flex;
	flex-direction:column;
	align-content:center;
	width:100%;
	max-width:600px;
	margin:auto;
}

.ui_fw_inner_list li:not(:last-child) {
	margin-bottom:5px;
}


.ui_fw_inner_list li a {
	width:100%;
}

/*.ui_short_fw_base .ui_fw_inner_grid {
    width:100%; height:90%;
    margin:20px 0 0 0px;
}*/

.ui_fw_color_frame .ui_fw_inner_grid {
    width:440px;
    padding:4px 0;
    margin-top:24px;
}

.ui_fw_grid_label {
	padding:8px 4px;
	font-size:1rem;
	color:#000;
}

.ui_fw_inner_grid li {
	margin-right:5px;
	margin-bottom:5px;
}

.ui_fw_inner_grid li a {
/*	width:128px;
	height:auto;*/
}




.ui_fw_btn_icon {
	color:#6fa1fb;
	cursor:pointer;
    transition:color 0.5s cubic-bezier(0.35, 0, 0.25, 1);
}
.ui_fw_btn_icon:hover {
	color:#43c4fb;
	cursor:pointer;
}
.ui_fw_btn_icon svg {
    fill:currentColor;
    width:34px; height:34px;
}


.ui_fw_btn_box button {
	position:relative;
}
/*.ui_fw_close_btn_box {
	position:absolute;right:0;top:3%
}
*/
.ui_fw_previous_btn_box {
	position:absolute;left:0;top:45%
}


.ui_fw_next_btn_box {
	position:absolute;right:0;top:45%
}


.ui_fw_section_selector {
	width:max-content;
	height:10%;
	margin:auto;
}

.ui_fw_section_selector li {
	float:left;
	margin-right:16px;
}

.ui_fw_section_selector li a {
    box-sizing:border-box;
	display:block;
	width:16px;
	height:16px;
	border-radius:50%;
	background-color:#6fa1fb;
}
.ui_fw_section_selector li a.cur_section {
	background-color:#fff;
    border:solid 1px #6fa1fb;
}
.ui_fw_section_selector li a:hover {
	cursor:pointer;
	background-color:#43c4fb;
}
.ui_fw_section_selector li a.cur_section:hover {
	cursor:default;
	background-color:#fff;
}


.ui_fw_inner_grid li a.ui_fw_font_grid_menu {
    position:relative;
    display:block;
    box-sizing:border-box;
    /*width:135px; height:75px;*/
    width:130px; height:75px;
    padding:0;
    background-color:#fff;
    text-align:center;
    border:solid 1px #BCC5D3;
    border-radius:5px;
    color:#000;
    cursor:pointer;
    transition:background-color 0.4s cubic-bezier(0.35, 0, 0.25, 1);
}
.ui_fw_inner_grid li a.ui_fw_font_grid_menu:hover {
    font-weight:normal;
    /*background-color:#6fa1fb;*/
    background-color:#95B2FF;
    color:#fff;
}

/**ToDo...*/
.ui_fw_inner_grid li a.ui_fw_color_grid_menu {
    position:relative;
    display:block;
    box-sizing:border-box;
    width:45px; height:45px;
    padding:0;
    background-color:#fff;
    text-align:center;
   /* border-radius:5px;*/
    color:#000;
    cursor:pointer;
    transition:transform 0.2s cubic-bezier(0.35, 0, 0.25, 1);
}

.ui_fw_inner_grid li a.ui_fw_color_grid_menu:hover {

    transform:scale(1.15);
}

.ui_fw_inner_grid li a.ui_fw_color_grid_menu:hover::before {
    background: #333;
    border-radius: 3px;
    color: #fff;
    content: attr(tooltip);
    display: block;
    font-size: 11px;
    font-weight: 500;
    padding: 2px 4px;
    white-space: nowrap;
	width:min-content;
	position:absolute;
	left:0px;
	top:-20px;
}

.ui_fw_font_example_jp {
    display:block;
    font-size:22px;
    line-height:22px;
    margin-top:8px;
}

.ui_fw_font_example_en {
    font-size:16px;
    line-height:16px;
    margin-top:4px;
}

.ui_fw_font_name {
    font-size:12px;
    line-height:12px;
    position: absolute;
    bottom: 8px;
    left: 0;
    right: 0;
}



.fw_slide_screen {
	position:relative;
	overflow:hidden;
}

.fw_slide_scenes {
	position:absolute;
	left:0;
	top:0;
	transition:left 0.5s cubic-bezier(0.35, 0, 0.25, 1);
}

.fw_slide_frame {
	float:left;
	overflow:hidden;
	display:flex;
	justify-content:center;
	align-items:center;
}

.fw_hidden {
	visibility:hidden;
	width:0;
	height:0;
}


/* [end] mai_ui */


/* [start] editor page */
.inner {
	max-width:1000px;
	margin:0 auto;
	padding:0 10px;
}

/* header */
.headerbar {
	display:flex;
    justify-content:center;
    align-items:center;
	height:36px;
	background-color: #2B2F3B;
	color:#fff;
}
.headerbar a, .headerbar .icon {
	color:#ccc;
}

.headerbar h1 {
    font-size:15px;
    font-weight:500;
}

/* slide */

.slide_nav_box {
	position:relative;
	display:flex;
	flex-direction: row;
	justify-content: flex-start;
	width:max-content;
    height:37px;
	margin:auto;
	margin-top:4px;
}

.slide_nav_tab {
	width:120px;/*160px*/
	padding-bottom:8px;
	text-align:center;
	color:#000;
	font-size:14px;
	border-bottom:1px solid #808080
}
a.slide_nav_tab {
	opacity:0.6;
	cursor:pointer;
	transition:color linear 0.5s, opacity linear 0.5s;
}
a.slide_nav_tab:hover {
	color:#60C3FF;
	opacity:1.0
}
a.current_tab {
	cursor:default;
	opacity:1.0;
	color:#5887F9;
}

.slide_nav_bar {
	position: absolute;
	bottom: 0;
	height: 4px;
	transition:left 0.5s cubic-bezier(0.35, 0, 0.25, 1);
	width:120px;/*160px*/
	left:0;
}

.edit_slide_box {
	width:100%;
	margin-top:10px;
	background-color:#eff0f8;
}

.edit_slide_inner {
	position:relative;
	width:1000px; height:480px;
	margin:auto;
}

.edit_slide_screen {
	position:relative;
	width:1000px;
    height:100%;
	overflow:hidden;
}

.edit_slide_scenes {
	position:absolute;
	left:0;
	top:0;
	height:100%;
	transition:left 0.5s cubic-bezier(0.35, 0, 0.25, 1);
}

.edit_slide_frame {
	float:left;
	overflow:hidden;
	display:flex;
	justify-content:center;
	align-items:center;
	width:1000px;
	/*height:420px;*/
    height:100%;
}

.stage_mount {
	position:relative;
    top:-20px;
	display:flex;
	justify-content:center;
	align-items:center;
	width:auto; height:auto;
}

.edit_zoom_slider_box {
	display:flex;
    position:absolute;
    bottom:10px; right:46px;
	width:max-content;
}

.edit_extra_menu_box {
    display:flex;
    position:absolute;
    /*bottom:5px; left:30px;*/
    bottom:10px; right:30px;
	width:max-content;

}

.edit_toolbar {
    display:flex;
    justify-content: space-around;
    margin:auto;
	margin-top:4px;
    /*width:max-content;*/
    width:100%;
    max-width:900px;
}

.edit_menu_partition {
    margin-left:24px;
    margin-top:8px;
}
.edit_menu_partition:first-child {
    margin-left:0px;
}

.edit_menu_partition_title {
    width:100%;
    color: #5887F9;
    font-size: 13px;
    line-height:13px;
    height:15px;
    font-weight:800;
}
    
.edit_menu_box {
	/*position:absolute;*/
	display:flex;
	justify-content: flex-start;
	align-items:center;
	/*overflow:hidden;*/
	height:70px;
	/*padding:4px 12px;*/
	/*background-color:#fcfcfc;
	box-shadow:2px 2px 4px rgb(0,0,0,0.25);*/
	/*border-radius:10px;*/
	z-index:1000;
	width: max-content;
    margin-top:4px;
}

.edit_menu_inner {
	display:flex;
	justify-content: flex-start;
	/*overflow:hidden;*/
	height:100%;
	margin-left:12px;
    opacity:1.0;
    transition:opacity linear 0.2s;
}
.edit_menu_inner:first-child {
	margin-left:0;
}
.following_menu_inner {
    margin-left:24px;
}

.edit_menu_label ,
.edit_menu_label_left 
 {
	display:block;
	font-size:12px;
    margin-bottom:-2px;
	color:#4C5264;
	font-weight:bold;
	text-align:center;
}
.edit_menu_label_left {
	text-align:left;
}

.edit_menu_shelf {
	margin-left:12px;
}
.edit_menu_shelf:first-child {
	margin-left:0;
}

.edit_menu_joint_shelf {
    margin-left:2px;
}
.edit_menu_joint_shelf:first-child {
    margin-left:0;
}

.edit_menu_cell {
    position:relative;
	display:flex;
	/*flex-direction:column;*/
	justify-content:center;
	align-items:center;
	height:45px;
}

.edit_menu_cell_item {
	margin-left:4px;
}
.edit_menu_cell_item:first-child {
	margin-left:0;
}

.edit_menu_cell_label {
	font-size:11px;
	line-height:11px;
}

.edit_menu_btn {
    box-sizing:border-box;
	width: 40px;
    height: 40px;
    border-radius: 4px;
    border-style: none;
    font-size: 18px;
    background-color:#E9EAEB;
    color:#778;
    transition:color linear 0.2s;
    margin-left:2px;
    padding:5px;

}
.edit_menu_btn:hover {
    color:dodgerblue;
    cursor:pointer;
}
.edit_menu_btn:first-child {
    margin-left:0;
}

.forbidden_menu .edit_menu_btn:hover {
    color:#777;/*cancel*/
    cursor:default;
}

.edit_menu_btn span.icon {
    display:block;
}

.edit_menu_btn svg {
    fill:currentColor;
    width:20px; height:20px;
}

.edit_extra_ck_box {
    position:relative;
	display:flex;
	justify-content:center;
	align-items:center;
	height:30px;
}

.edit_extra_menu_shelf {
    margin-left:10px;
    transition:opacity linear 0.2s;
}

.edit_extra_menu_cell {
    display:flex;
	justify-content:center;
	align-items:center;
}

.edit_extra_menu_btn {
    width: 30px;
    height: 30px;
    border-radius: 0px;
    border-style: none;
    font-size: 16px;
    color:#777;
    background-color:transparent;
    transition:color linear 0.2s;
    cursor:pointer;
}
.edit_extra_menu_btn:hover {
    color:dodgerblue;
}

.edit_extra_menu_label {
    display:block;
	font-size:12px;
    margin-top:4px;
    line-height:12px;
	color:#4C5264;
	font-weight:500;
	text-align:center;
}

.edit_menu_numeric_input input
 {
}
.edit_menu_numeric_font_size {
    width:90px;
}

.edit_numeric_link_icon {
    position: absolute;
    top: 10%;
    left: 46%;
    font-size: 16px;
    color: #777;
}
.edit_numeric_link_icon span.icon {
    display:block;
    -webkit-transform:rotate(45deg);
    transform:rotate(45deg);
}


.edit_side_icon {
	font-size:16px;
	color:#BCC5D3;
	margin-left:5px;
}

.edit_align_btn {
    font-size:11px;
    font-weight:bold;
}

.align_left_btn {
    text-align:left;
}
.align_center_btn {
    text-align:center;
}
.align_right_btn {
    text-align:right;
}
.align_fit_btn {
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.edit_font_family {
    display:flex;
    justify-content:space-between;
    align-items:center;
    width:180px;
}

.edit_font_family_label {
    display:inline-block;
    width:120px;
    font-size:12px;
}

.edit_cast_reserved {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 35px;
    width: 100px;
    font-size: 13px;
    background: none;
    border-radius: 0;
    border-bottom: solid 2px #547cf3;
    /*height: 30px;*/
}
.edit_cast_reserved .icon {
    font-size:16px;
}

/* [end] editor page */

/* design page */


.name_design_container {
}

.design_nav_tabs {
    display:flex;
    font-weight: 800;
    margin-left:32px;
/*    margin-bottom:5px;*/
}
.design_nav_tabs li {
    border: 1px solid #5887F9;
    padding: 3px;
    background-color: #fff;
    color: #778;
    /*width: 140px;*//* 動的*/
    min-width:100px;
    box-sizing: border-box;
    text-align: center;
    cursor:pointer;
}
.design_nav_tabs li:first-child {
    border-top-left-radius:8px;
}
.design_nav_tabs li:last-child {
    border-top-right-radius:8px;
}

.design_nav_tabs li.selected {
    background-color: #5887F9;
    color: #fff;
}

.design_menu_contents {
    padding-bottom:2px;
    opacity: 0;
    display:none;
    transition: opacity 0.2s linear;
}
.design_menu_contents.selected {
    opacity: 1;
}

.design_haku_menu {
    /*overflow:auto;*/
    /*max-height:540px;*/
    margin-top:20px;
    padding-right:20px;
    padding-bottom:2px;
    opacity: 0;
    display:none;
    transition: opacity 0.2s linear;
}
.design_haku_menu.selected {
    opacity: 1;
}


.design_radio_box {
    width:max-content;
    margin-top:25px;
}
.design_radio_box:first-child {
    margin-top:5px;
}
/*.design_radio_box.tall {
    margin-top:5px;
}*/

.design_radio_box input {
    display:none;
}

.design_haku_menu .design_radio_box {
    margin-top:15px;
}
.design_haku_menu .design_radio_box:first-child {
    margin-top:5px;
}

.design_radio_box input[type="radio"] + label::before {
    content: "";
    background: #f4f4f4;
    border-radius: 100%;
    border: 1px solid #b4b4b4;
    display: inline-block;
    width: 20px;
    height: 20px;
    /*top: -0.2em;*/
    margin-right: 10px;
    vertical-align: top;
    cursor: pointer;
    text-align: center;
    transition: all 250ms ease;
}

.design_radio_box input[type="radio"]:checked + label::before {
    background-color: #3197EE;
    box-shadow: inset 0 0 0 4px #f4f4f4;
}

.design_radio_box label {
    display: flex;
    align-items: center;
    cursor:pointer;
}

.design_haku_menu .design_radio_box label {

}


.design_radio_box img {
    /*max-width:320px;*/
    height:auto;
    background-color: #fff;
    border: solid 1px #888;
    box-sizing: border-box;
    transition:box-shadow 0.3s ease-in, border-color 0.3s ease-in;
}
.design_radio_box img:hover {
	box-shadow: 0 0 0px 2px dodgerBlue;
    border-color:dodgerBlue;
}
.design_radio_box input[type="radio"]:checked + label img {
    box-shadow: 0 0 0px 2px dodgerBlue;
    border-color:dodgerBlue;
}

.design_haku_menu .design_radio_box img {
    /*max-width:300px;*/
    max-width:230px;
}


/*.design_radio_box.tall img {
    max-height:78px;
    width:auto;
}*/

.design_haku_menu .design_radio_box img {
    border:none;
    padding:4px;
}

.design_haku_color_tag {
    display:block;
    width:120px;
    font-size:13px;
    color:#333;
}

.design_toolbar {
    display:flex;
    justify-content: center;
    margin:auto;
	margin-top:4px;
    /*width:max-content;*/
    width:100%;
}

.design_slide_nav_btn {
    box-sizing: border-box;
    width: 300px;
    font-size: 15px;
    text-align: center;
    border: solid 3px #5887F9;
    border-radius: 20px;
    height: 38px;
    cursor: pointer;
    color: #fff;
    background-color:#5887F9;
    transition: background-color linear 0.4s, opacity linear 0.4s;
    padding: 4px;
    font-weight: 800;
    display:none;
    opacity:0;
}
.design_slide_nav_btn.selected {
    display:block;
    opacity:1;
}
.design_slide_nav_btn.disabled {
    display:block;
    opacity:0.3;
    cursor:default;
}
.design_slide_nav_btn.selected:hover {
    background-color:#fff;
    border: solid 3px #5887F9;
    color:#5887F9;
}

.design_slide_nav_btn .icon {
    margin-left:8px;
    margin-right:8px;
    /*color:dodgerblue*/
    color:#fff;
}
.design_slide_nav_btn.selected:hover .icon {
    color:#5887F9;
}

/**/
.editor_page_menu_btn {
    box-sizing:border-box;
    width: 180px;
    font-size: 15px;
    text-align: center;
    border: solid 2px #fff;
    border-radius: 20px;
    background-color:#5887F9;
    height: 38px;
    cursor:pointer;
    color: #fff;
    transition:background-color linear 0.4s;
}
.editor_page_menu_btn:hover {
    background-color:#fff;
    color:#5887F9;
}
/**/


.design_preview_title {
    font-size: 16px;
    padding: 5px;
    font-weight: 800;
}


/* end.. design page */


.back_color_blue { background-color:#5887F9; }

.btn_color_blue {
	background-color:#5887F9;
	transition:color linear 0.5s, background-color linear 0.4s;
	cursor:pointer;
}
.btn_color_blue:hover {
	background-color:#60C3FF;
}

.hidden {
	visibility:hidden;
	width:0;
	height:0;
}


/* LAST 追加 */

.editor_page_menu_bar {
    position:fixed;
    left:0px; right:0px; bottom:0px;
    z-index:1000;
    background-color:#2F6AF9;
}

.editor_page_menu_inner {
    display:flex;
    justify-content:space-around;
    align-items:center;
    max-width:960px;
    height:60px;
	margin:0 auto;
	padding:5px 0;
}

.editor_page_menu_btn {
    box-sizing:border-box;
    width: 180px;
    font-size: 15px;
    text-align: center;
    border: solid 2px #fff;
    border-radius: 20px;
    background-color:#5887F9;
    height: 38px;
    cursor:pointer;
    color: #fff;
    transition:background-color linear 0.4s;
}
.editor_page_menu_btn:hover {
    background-color:#fff;
    color:#5887F9;
}
.editor_page_menu_btn.disabled {
    opacity:0.3;
    cursor:default;
}
.editor_page_menu_btn.disabled:hover {
    background-color:#5887F9;
    color: #fff;
}

.editor_page_menu_btn > a {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    height: 100%;
    font-size: 15px;
    font-weight: 800;
}
.editor_page_confirm_btn {
    background-color:#fff;
    color:#6fa1fb;
    transition:color linear 0.4s;
}
.editor_page_confirm_btn:hover {
    background-color:#fff;
    color:#60C3FF;
}

.editor_page_menu_btn.wide_btn {
    width: 240px;
}

.editor_page_menu_btn > a span {
    margin-left:8px;
}
.editor_page_menu_btn > a span:first-child {
    margin-left:0px;
}



label.ui_sp_check_label {
    box-sizing: border-box;
    position: relative;
    width: 50px;
    height: 25px;
    border-radius: 14px;
    box-sizing: border-box;
    cursor: pointer;
    background-color:#BCC5D3;
    transition:background-color 0.2s ease;
}
input[type=checkbox]:checked + label.ui_sp_check_label {
    background-color:dodgerBlue;
}
label.ui_sp_check_label::before {
    content: '';
    box-sizing: border-box;
    width: 23px;
    height: 23px;
    position: absolute;
    background: white;
    left: 1px;
    top: 1px;
    color: black;
    border-radius:50%;
    transition:left .3s ease;
}
input[type=checkbox]:checked + label.ui_sp_check_label::before {
    left:50%;
}


/* 7/24 Float UI 追加 */

/*変更*/
.ui_fw_viewer_title {
	margin-bottom:8px;
	font-size:16px;
	font-weight:800;
	color:#000;
}

/*変更*/
.ui_float_select_frame {
	position:fixed;
	margin:auto;
    width:100%;
	height:100%;
	top:0;
    z-index:9999;
}

/*変更*/
.ui_fw_base {
    /*position:relative;*/ /*不要なtop marginができる*/
    top:0;
    width:100%;
    height:100%;
    margin: 0 auto;
	opacity:0;
	transition:opacity 0.16s ease-in
}

/*変更*/
.ui_fw_screen {
    position:fixed;
    top:0;
    bottom:0;
    width:100%;
	background-color:#fafafa;
	opacity:0;
	transition:opacity 0.16s ease-in
}

.ui_fw_inner_grid {
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content:center;
	align-content:center;
	/*margin:48px 0 0 20px;*/
}

.ui_fw_slider_base {

}

.ui_fw_slider_slide {
    position:relative;
    overflow:hidden;
    display:block;
    margin:0 auto;
}

.ui_fw_slider_sections {
    position:absolute;
    left:0;
    top:0;
    transition:left 0.4s cubic-bezier(0.35, 0, 0.25, 1);
}

.ui_fw_slider_section {
    float:left;
    display:flex;
    justify-content:center;
    align-items:center;
}

.ui_fw_slider_page_selector {
    position:absolute;
    left:0;
    right:0;
    margin:auto;
    width:max-content;
	/*height:auto;*/
    /*margin-top:30px;*/
}

.ui_fw_slider_page_selector li {
    float:left;
	margin-right:16px;
}

.ui_fw_slider_page_selector li a {
    box-sizing:border-box;
	display:block;
	width:16px;
	height:16px;
	border-radius:50%;
	background-color:#6fa1fb;
}
.ui_fw_slider_page_selector li a.cur_section {
	background-color:#fff;
    border:solid 1px #6fa1fb;
}
.ui_fw_slider_page_selector li a:hover {
	cursor:pointer;
	background-color:#43c4fb;
}
.ui_fw_slider_page_selector li a.cur_section:hover {
	cursor:default;
	background-color:#fff;
}

.ui_fw_slider_navi {
    /*position:relative;*/
    position:absolute;
    display:flex;
    justify-content:space-between;
    left:0;
    right:0;
    margin:auto;
}

.ui_fw_slider_previous_btn,
.ui_fw_slider_next_btn
 {
    /*position:absolute;*/
    width:34px; height:34px;
    /*top:40%;*/
    margin-left:-60px;
    margin-right:-40px;
 }


.ui_fw_close_btn {
    position: absolute;
    top: 0%;
    right: 8%;
    font-size: 14px;
    border: solid 2px #6fa1fb;
    border-radius: 8px;
    background-color:#fff;
    z-index:999;
}

.ui_fw_close_btn .icon {
    font-size:12px;
}

.ui_fw_color_frame .ui_fw_close_btn {
    right: 20%;
    top:8px;
}
.ui_fw_message_box .ui_fw_close_btn {
    top:3px;
    right:3px;
}

.ui_fw_dialog_btn_box {
    display:flex;
    justify-content:center;
    margin-top:20px;    
}

.ui_fw_dialog_btn_box .ui_fw_dialog_btn {
    min-width:88px;
    padding:5px 10px;
    font-size: 14px;
    border-radius: 4px;
    color:#fff;
    cursor:pointer;
    transition:opacity 0.2s linear;
}
.ui_fw_dialog_btn_box .ui_fw_dialog_btn:hover {
    opacity:0.8;
}
.ui_fw_dialog_btn_box .ui_fw_dialog_btn.ok_btn {
    background-color:#6fa1fb;
    margin-left:40px;
}
.ui_fw_dialog_btn_box .ui_fw_dialog_btn.cancel_btn {
    background-color:#aab;
}

.ui_fw_dialog_omit_box {
    display:flex;
    justify-content:center;
    margin-top:20px;  
}
.ui_fw_dialog_omit_box li.ui_fw_check_item {
    font-weight:normal;
    font-size:13px;
}


.ui_fw_preview_frame {
    position:relative;
    max-width: 960px;
    margin: auto;
    margin-top: 15px;
}

.ui_fw_preview_frame.confirm {
    margin-top: 15px;
}

.ui_fw_generic_frame {
    position:relative;
    max-width: 960px;
    margin: auto;
    margin-top: 60px;
}

.ui_fw_generic_frame .ui_fw_close_btn {
    margin-top:-4%;
}

.ui_fw_confirm_btn_box {
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:center;
    /*width:max-content;*/
    left:0; right:0; bottom:0;
    margin:auto;
    margin-top:70px;
    padding-top:20px;
    padding-bottom:70px;
    background-color:#fff;
    border-radius:10px;
    z-index:999;

}

.ui_fw_confirm_btn {
    margin: auto;
    margin-top: 30px;
    /*background-color: #fff;
    border: solid 4px #5887F9;*/
    background-color:#ed1e79;
    border:solid 3px #ed1e79;
    color:#fff;
    width: 300px;
    /*color:#5887F9;*/
    transition:background-color linear 0.4s;
}
.ui_fw_confirm_btn:hover {
    background-color:#fff;
    /*color:#60C3FF;
    border-color:#60C3FF;*/
    border:solid 3px #ed1e79;
    color:#ed1e79;
}

.ui_fw_confirm_additional_txt {
    margin-top:20px;
    color:#ff006e;
    font-weight:bold;
    font-size:13px;
}

.ui_fw_check_list {
    display:block;
    /*width:max-content;*/
    margin:auto;
}

.ui_fw_check_item {
    font-size:15px;
    width:max-content;
    margin-top:4px;
    font-weight:800;
}

.ui_fw_check_item label {
    display:flex;
    align-items:center;
    cursor:pointer;
}
.ui_fw_check_item label icon {
    font-size:18px;
}
.ui_fw_check_item label span {
    margin-left:5px;
}

.ui_fw_preview_slide_box {
    width:100%;
}

/* fw check */

.ui_fw_check_item label.icon_checkbox:hover {
	color:deepskyblue;
}

.ui_fw_check_item label.icon_checkbox input[type="checkbox"] {
	display:none;
}

.ui_fw_check_item label input[type="checkbox"] ~ i.ck_label_false {
	display:inline;
	color:#999;
	transition:opacity 0.4s;
	cursor:pointer;
}
.ui_fw_check_item label input[type="checkbox"] ~ i.ck_label_false:hover {
	color:deepskyblue;
}
.ui_fw_check_item label input[type="checkbox"]:checked ~ i.ck_label_false {
	display:none;
}

.ui_fw_check_item label input[type="checkbox"] ~ i.ck_label_true {
	display:none;
}
.ui_fw_check_item label input[type="checkbox"]:checked ~ i.ck_label_true {
	display:inline;
	color:deepskyblue;
	cursor:pointer;
}

.editor_fw_frame {
    overflow:auto;
    position:fixed;
    top:0;
    width:100%; height:100%;
    z-index:9999;
}

.ui_fw_font_frame {
    position:relative;
    max-width: 960px;
    margin: auto;
    padding-top: 32px;
}

.ui_fw_color_frame {
    position:relative;
    max-width: 960px;
    margin: auto;
    padding-top: 5px;
}


.ui_fw_close_label {
    margin-left:3px;
    font-weight:bold;
}

.editor_font_fw_frame {
    /*position:fixed;
    top:60%;*/
    position:absolute;
    top:720px;
    width:100%;
    height:400px;
    z-index:9999;
}


.forbidden_menu {
    pointer-events:none;
    opacity:0.3;
}

.forbidden_icon span.icon {
    display:none;
}

.idle_menu {
    visibility:hidden;
    opacity:0;
}

.void_menu {
    display:none;
}

/* pullUp */

.pull_up_select_box {
    position:relative;
}

.pull_up_select_box > ul {
    position: absolute;
    font-size: 14px;
    z-index: 1;
    top:0;/* -height*/
    left: 0;
    right: 0;
    visibility: hidden;
    opacity: 0;
    padding:4px;
    border-radius: 8px;
    width: 130px;
    background: #fff;
    text-align: center;
    box-shadow:0 0 10px #aab;
    transition:top .3s ease, opacity .3s ease;
}
.pull_up_select_box.open > ul {
    transform: translate(0, 12px) scale(1);
    opacity: 1;
    /*visibility: visible;*/
}

.pull_up_select_box > ul li {
    padding:8px;
    color:#000;
    border-color:#000;
    background-color:#fff;
    transition:background-color 0.2s ease;
    cursor:pointer;
}
.pull_up_select_box > ul li:hover {
    color:#fff;
    border-color:#fff;
    background-color:#5887F9;/* todo */
}

.pull_up_select_box > ul li span {
    display:inline-block;
}

.pull_up_select_box > ul li span.boxframe_lebel {
    padding: 0 20px;
}
/*.pull_up_select_box > ul li span.boxframe_lebel:hover {
    border-color:#fff;
}*/
.pull_up_select_box > ul li span.boxframe_rect {
    border-style:solid;
    border-width:1px;
    border:solid 1px inherit;
}
.pull_up_select_box > ul li span.boxframe_roundrect20 {
    border-style:solid;
    border-width:1px;
    border-radius:6px;
}
.pull_up_select_box > ul li span.boxframe_roundrect50 {
    border-style:solid;
    border-width:1px;
    border:solid 1px inherit;
    border-radius:12px;
}

/* GraphicColorPullUpMenu */
.ui_fw_color_picker_list {
    position: absolute;
    font-size: 14px;
    opacity: 0;
    padding:4px;
    border-radius: 8px;
    width: 160px;
    background: #fff;
    box-shadow:0 0 10px #aab;
    transition:top .3s ease, opacity .3s ease;
}
.ui_fw_color_picker_list.open {
    transform: translate(0, 12px) scale(1);
    opacity: 1;
    /*visibility: visible;*/
}
.ui_fw_color_picker_list li {
    color:#5887F9;/* todo */
    background-color:#fff;
    transition:background-color 0.2s ease;
}
.ui_fw_color_picker_list li:hover {
    color:#fff;
    background-color:#5887F9;/* todo */
}

.ui_fw_color_picker_list li label {
    width:100%;
    height:100%;
    padding:8px;
    cursor:pointer;
}

.ui_fw_color_picker_list li input[type='color'] {
    width:60px;
    height:36px;
    padding:0;
    border:none;
    background-color:#fff;
    color:#5887F9;/* todo */
    cursor:pointer;
}
@-moz-document url-prefix() {
    .ui_fw_color_picker_list li input[type='color'] {
        width:36px;
    }
}
.ui_fw_color_picker_list li:hover input[type='color'] {
    background-color:#5887F9;/* todo */
    color:#fff;
}

.ui_fw_color_picker_list li span {
    display:inline-block;
    padding:10px;
}



/* FW messaeg*/
.ui_fw_message_box {
    box-sizing: border-box;
    /*position: relative;*/
	position:fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: max-content;
    min-width: 400px;
    max-width: 80%;
    height:auto;
    /*min-height: 90px;*/
	height:fit-content;
    max-height: 80%;
    padding: 30px 15px;
    overflow: auto;
    background-color: #fefefe;
    border-radius: 10px;
    z-index: 999;
    border: solid 3px #6fa1fb;
}

.ui_fw_message_inner {
}

.ui_fw_message_list {
    text-align:center;
    font-size:15px;
    line-height:24px;
    letter-spacing:1px;
    width:-moz-fit-content;
    width:-webkit-fit-content;
    margin:auto;
    text-align:left;
    font-weight:800;
}

.ui_global_fw_screen {
    position:fixed;
    left:0;
    top:0;
    height:100%;
    width:100%;
    background-color:#fafafa;
	opacity:0;
	transition:opacity 0.16s ease-in;
    z-index:9990;
}

/* Loading ... */

.ui_page_loading_frame {
	/*position: absolute;
	top: 240px;*/
	position:fixed;
	top:300px;
	left: 0;
	right: 0;
	z-index: 1;
	pointer-events:none;
}

.ui_loader,
.ui_loader:after {
	border-radius: 50%;
	width: 48px;
	height: 48px;
}

.ui_mini_loader, .ui_mini_loader:after {
	border-radius: 50%;
	width: 24px;
	height: 24px;
}

.ui_loader ,.ui_mini_loader {
	position: relative;
	margin:auto;
	border-top: 7px solid rgba(0,173,169, 0.2);
	border-right: 7px solid rgba(0,173,169, 0.2);
	border-bottom: 7px solid rgba(0,173,169, 0.2);
	border-left: 7px solid #6fa1fb;
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-animation: load8 1.1s infinite linear;
	animation: load8 1.1s infinite linear;
}
.ui_mini_loader {
    border-width:5px;
}

@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.ui_loading_caption,
.ui_loading_message
 {
	margin:auto;
	margin-top:6px;
	text-align:center;
	color:#6fa1fb;
    font-size:14px;
}
.ui_loading_caption {
    font-size:14px;
}


/* ... Loading */

