@charset "utf-8";

/* page */

body {
	font-family:Segoe, Segoe UI, DejaVu Sans, Trebuchet MS, Verdana, sans-serif;
	letter-spacing:0.5px; 
	font-size:14px;	
	margin: 0;
	padding:0;
    width: 100%; 
}

input {text-transform: none;}
input::-webkit-input-placeholder {text-transform: none;}
input::-moz-placeholder {text-transform: none;}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus
input:-webkit-autofill, 
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  border: 0;
  -webkit-box-shadow: 0 0 0px 1000px transparent inset;
  transition: background-color 5000s ease-in-out 0s;
  background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(0,174,255,0.04) 50%,rgba(255,255,255,0) 51%,rgba(0,174,255,0.03) 100%);  
}

links, lp {
	cursor:pointer;
	transition: 0.2s;
}
links:hover, lp:hover {
	text-decoration:underline;
}

a {
	display: contents;
}
a:link,
a:visited,
a:hover {
	text-decoration: none;
}
a:active {
}

.theme_Light {
	color: #000;
	background: #eef0f5;
}

.theme_Dark {
	color: #e6e9f0d9;
	background: #152836;
}


/* chat */

#chat {
	min-width: 275px; 
	width: 400px; 
	padding:0 25px;
}

#chat_body {
	border-radius:15px; 
	position: sticky; 
	top: 80px; 
	padding-bottom: 77px;
}

.chat_top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 100%;
	padding: 0px 12px 0 24px;
	font-weight:500;
	margin-bottom: 20px;
}

#chat_messages {
    padding: 0 21px 0 25px;
    z-index: 2;
    flex-direction: column-reverse;
    display: flex;
    gap: 20px;
	margin-bottom: 3px;
	
}

.chat_post_body {
	position: relative;
    width: 245px;
    height: 38px;
}

.chat_post_body_2 {
	position: absolute;
    bottom: 10px;
    padding-top: 20px;
    left: 0;
    right: 0;
    background: inherit;
}

.chat_post_line {
	height: 1px; 
	margin: 0 0 10px;
}

#post_chat {
    width: -webkit-fill-available;
    font-size: 12px;
    resize: none;
    padding: 8px 5px;
    overflow: hidden;
    overflow-wrap: break-word;
    height: 16px;
    margin: 0 20px;
}

.chat_record {
	font-size:12px;
	word-break:break-word;
}

uc, ucb, ucf, ucg, ucr {
    font-weight:500;
	cursor:pointer;
}

uc:hover, ucb:hover, ucf:hover, ucg:hover, ucr:hover {
	text-decoration:underline
}






.theme_Light * {
	#chat_body {
		background:#FFF; 
	}
	#post_chat {
		color: #000;
	}
	.chat_top {
		border-bottom: 1px #eef0f5 solid; 
	}
	.chat_post_line {
		background: #e6eaef; 
	}
	#chat_messages::-webkit-scrollbar-thumb {
		background-color: #e6eaef;
	}
}

.theme_Dark * {
	#chat_body {
		background:#1f3749; 
	}
	#post_chat {
		color: #fff;
	}
	.chat_top {
		border-bottom: 1px #465d73 solid; 
	}
	.chat_post_line {
		background: #465d73; 
	}
	#chat_messages::-webkit-scrollbar-thumb {
		background-color: #395269;
	}
}






/* switch */

.switch_pages {
	padding-left: 20px; 
	display:flex; 
	position: relative;
	font-size: 19px; 
	font-weight: 600;
	cursor:pointer;
	width: max-content;
}
.switch_page, .switch_page_active { 
	transition:0.1s;
	padding: 54px 25px 20px 0;
}

.theme_Light * {
	.switch_page_active, .switch_page:hover, .switch_pages:hover .switch_page_active:hover {
		color: #94a1ad;
	}
	.switch_page, .switch_pages:hover .switch_page_active {
		color: #ccc;
	}
}

.theme_Dark * {
	.switch_page_active, .switch_page:hover, .switch_pages:hover .switch_page_active:hover {
		color: #c9ceddd9;
	}
	.switch_page, .switch_pages:hover .switch_page_active {
		color: #becee366;
	}
}





.chat_off * {
	@media (max-width: 575px) {
		.SP_assets, .SP_assets_min { font-size:15px }
	}
	@media (min-width: 475px) {
		.SP_assets_min { display: none }
	}
	@media (max-width: 475px) {
		.SP_assets_min { display: block }
		.SP_assets { display: none }
	}
}
.chat_on * {
	@media (max-width: calc(575px + 335px)) {
		.SP_assets, .SP_assets_min { font-size:15px }
	}
	@media (min-width: calc(475px + 335px)) {
		.SP_assets_min { display: none }
	}
	@media (max-width: calc(475px + 335px)) {
		.SP_assets_min { display: block }
		.SP_assets { display: none }
	}
}

.chat_on * {
	@media (max-width: 685px) {
		
		#chat {
			min-width:unset;
		}
		#chat_body {
			position: fixed;
			z-index: 6;
			left: 0;
			right: 0;
			top:0;
			border-radius: 0;
		 }
		 
		 #chat_messages {
			height: calc(100vh - 135px);
		 }
		 
		 .block-page {
			display: none;
		 }
	}
}


/* fonts */

.theme_Light * {
	/*
	.green, ucg {
		color: #1fba8b;
	}
	.red, ucr, .ucr {
		color: #df0000;
	}
	*/
	.green, ucg {
		color: #37c99e;
	}
	.red, ucr, .ucr {
		color: #ff758a;
	}
	
	
	.grey, info {
		color: #ccc;
	}
	.blue, links, ucb, .navigation_page, .navigation_page_mini {
		color: #005cb0;
	}
	.violet, ucf {
		color: #7800ad;
	}
	.orange, lp, .navigation_page_, .navigation_page_mini_, .close:hover {
		color:#E88100;
	}
	.contrast, uc {
		color:#000;
	}
	.current {
		color:#000;
	}
}


.theme_Dark * {
	/*
	.green, ucg {
		color: #3dd7a9;
	}
	.red, ucr, .ucr {
		color: #ff7d7d;
	}
	*/
	.green, ucg {
		color: #37c99e;
	}
	.red, ucr, .ucr {
		color: #ff758a;
	}
	
	
	.grey, info {
		color: #a3abc3d9;
	}
	.blue, links, ucb, .navigation_page, .navigation_page_mini {
		color:#5acef3;
	}
	.violet, ucf {
		color: #d0a1ff;
	}
	.orange, lp, .navigation_page_, .navigation_page_mini_, .close:hover {
		color:#e7a34e;
	}
	.contrast, uc {
		color:#fff;
	}
	.current {
		color:#ffffffb3;
	}
}