@charset "utf-8";

:root {
	--color-black: #131921;
	--color-darkgray: #232f3e;;
	--color-background: #E3E6E6;
	--color-white: #ffffff;
	--color-gray: #485769;;
	--color-green: #007185;
	--color-active: #fe853b;
	--color-light-active: #ffc365;
	--color-border: #f5f5f5;
	--color-category: #888888;
	--color-text: #0f1111;
	--color-price: #B12704;
	--color-yellow: #F0B800;
	--color-orange: #FFA41C;
	--color-navy: #0044a3;
	--color-selected-background: #EDFDFF;

	--color-button-blue: #fe853b;

	--color-order-border: #D5D9D9;
	--color-order-background: #F0F2F2;
	
	--color-table-background: #fafafa;
	--color-high-light: #faf0B8;
}

html {
	text-rendering: optimizeLegibility;
	font-size: 10px;
	height: 100%;
}

/* ドキュメント全体 */
body {
	word-break: break-word;
	margin: 0px;
	/* font-family: "ヒラギノ", "ＭＳ Ｐゴシック", Helvetica, Arial, Verdana, sans-serif; */
	/* font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif; */
	/* font-family: "AXIS Font Japanese W55", 游ゴシック, メイリオ, ヒラギノ角ゴ, MS Pゴシック, sans-serif; */
	/* font-family: 'Helvetica Neue', Helvetica, Arial, 'Hiragino Sans', "ヒラギノ角ゴシック", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ
	Pro W3',Roboto, 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif; */
	font-family: -apple-system,Segoe UI,Helvetica Neue,Hiragino Kaku Gothic ProN,"メイリオ",meiryo,sans-serif;

	/*
	font-size: 1.8rem;
	line-height: 2.8rem;
	*/
	/*
	font-size: 1.2rem;
	line-height: 2.0rem;
	*/
	font-size: 1.4em;
	line-height: 1.8em;

	background-color: var(--color-background);
	height: 100%;
}

a {
	color: var(--color-green);
	text-decoration: none;
	cursor: pointer;
}

a:hover {
	color: var(--color-green);
}

.nolink {
	color: #000000;
	text-decoration: none;
}

/*	ヘッダー部分 	*/

header {
/* border-top: solid 5px var(--color-button-blue); */
/* border-bottom: solid 1px #eeeeee; */
background: var(--color-black);
background-color: oklab(45.983000000000004% 0.06555 0.05582 / 0.565);
/* background-image: url( "../img/header_bg.png" ); */
}

header .inner {
	margin: 0 auto 0 auto;
	height: 60px;
	overflow: hidden;
	font-size: 10px;
	color: #ffffff;
}

header .inner a {
	/*border: solid 1px var(--color-black);*/
	border-radius: 2px;
}

header .inner a:hover {
/*	border: solid 1px var(--color-white);
	border-radius: 2px;
	*/
}

header .inner .home {
	display: block;
	float: left;
	width: 25%;
	height: 50px;
	margin: 3px 15px 0 15px;
}

header .inner .home a {
	display: inline-block;
	width: 100%;
	height: 50px;
	background-image: url( "../img/systrooom_logo5.png" );
	background-position: left center;
	background-repeat: no-repeat;
	background-size: contain;
	hover outline: none;
}


header .inner .user_information {
	float: right;
	margin: 15px 0 0 0;
	width: 200px;
	height: auto;
	overflow: hidden;
	text-align: center;
	color: #ffffff;
}

header .inner .user_information .user_icon {
	display: inline-block;
	width: 30px;
	height: 30px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 5px;
}
header .inner .user_information .user_name {
	display: inline-block;
	text-align: left;
	width: 100px;
	overflow: hidden;
	vertical-align: middle;
	padding: 20px 0 0 0;
	margin: -28px 0 0px 5px;
	height: 30px;
	line-height: 30px;
}

header .inner .user_information .user_name span {
	display: inline-block;
	height: auto;
	font-size: 10px;
	line-height: 12px;
	vertical-align: middel;
}

header .inner .search {
	display: block;
	float: left;
	margin: 5px 0 0 0;
	width: 63%;
}

header .inner .search form {
	float: left;
	margin: 10px 0 0 0px;
	background: none;
	border: none;
	box-shadow: none;
	width: 50%;
	height: 32px;
	overflow: hidden;
}

header .inner .search select {
	width: 150px;
	border: none;
	margin: 0px;
	border-radius: 2px 0 0 2px;
	background: linear-gradient(#eeeeee, #dddddd);
	color: #666666;
	text-align: left;
}

header .inner .search input[type="text"] {
	width: calc( 100% - 218px );
	border: none;
	margin: 0px;
}

header .inner .search input[type="submit"] {
	background-color: var(--color-light-active);
	background-image: url( "../img/loop.png" );
	background-repeat: no-repeat;
	background-position: center;
	border: none;
	box-shadow: none;
	margin: 0px;
	padding: 0px;
	width: 50px;
	height: 32px;
	border-radius: 0 2px 2px 0;
}

header .inner .search .login_button {
	float: right;
	width: 10%;
	height: 50px;
}

header .inner .search .regist_button {
	float: right;
	width: 10%;
	height: 50px;
}

header .inner .search .ask_button {
	float: right;
	width: 15%;
	height: 50px;
}

header .inner .search .login_button a {
	display: block;
	/*background: linear-gradient( #d2944e 0, #d1a26d 60%, #d2b695 100%);*/
	height: 30px;
	/*border: solid 1px #b88638;*/
	border-radius: 2px;
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	padding: 8px 0 0 0;
	text-decoration: none;
	color: #ffffff;
	margin: 10px 20px 0 0;
}

header .inner .search .regist_button a {
	display: block;
	/*background: linear-gradient( #e1c736 0, #decc62 60%, #dbce84 100%);*/
	height: 30px;
	/*border: none;	*/
	border-radius: 2px;
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	padding: 8px 0 0 0;
	text-decoration: none;
	color: #ffffff;
	margin: 10px 0px 0 0;
}

header .inner .search .ask_button a {
	display: block;
	background: linear-gradient(var(--color-navy), var(--color-darkgray));
	height: 30px;
	border: solid 1px var(--color-black);
	border-radius: 2px;
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	padding: 8px 0 0 0;
	text-decoration: none;
	color: #ffffff;
	margin: 10px 20px 0 0;
}

@media screen and (max-width:930px) {
	header .inner .search form {
		display: none;
	}
	
	header .inner .search .login_button {
		width: 32%;
	}
	
	header .inner .search .regist_button {
		width: 32%;
	}
	
	header .inner .search .ask_button {
		width: 32%;
	}
	
	header .inner .search .login_button a {
		width: 90%;
	}
	
	header .inner .search .regist_button a {
		width: 90%;
	}
	
	header .inner .search .ask_button a {
		width: 90%;
	}
}


header .inner .header_cart {
	float: right;
	max-width: 123px;
	height: 50px;
}

header .inner .header_cart .user_information {
	display: none;
}

header .inner .header_cart a {
	display: block;
	float: right;
	margin: 5px 15px 0 0;
	max-width: 98px;
	height: 50px;
	border: none;
	border-radius: 2px;
	background-image: url( "../img/cart_free.png" );
	background-repeat: no-repeat;
	background-position: left;
	/*background-color: black;*/
	color: var(--color-light-active);
	
	font-size: 18px;
	font-weight: bold;
	text-decoration: none;
	box-sizing: border-box;
	padding: 0 0 0 22px;
}

header .header_cart a span {
	display: block;
	color: var(--color-white);
	font-size: 12px;
	margin: -12px 0 0 25px;
	line-height: 12px;
}

@media screen and (max-width:1320px){
	header .header_cart a {
		width: 45px;
	}
	header .header_cart a span {
		color: var(--color-black);
		display: none;
	}
}

header .header_cart a:hover {
	border: solid 1px var(--color-white);
	border-radius: 2px;
}

@media screen and (max-width:1500px) {
	header .login_button a {
		width: 100px;
	}
	header .regist_button a {
		width: 100px;
	}
	header .ask_button a {
		width: 100px;
	}
}

@media screen and (max-width:1350px) {
	header .login_button a {
		margin: 10px 5px 0 0;
	}
	header .regist_button a {
		margin: 10px 5px 0 0;
	}
	header .ask_button a {
		margin: 10px 5px 0 0;
	}
}

.menubar {
	width: 100%;
	height: 39px;
	/*background-color: var(--color-darkgray);*/
	background-color: oklab(45.983000000000004% 0.06555 0.05582 / 0.565);
	overflow: hidden;
}

.menubar ul {
	float: left;
	padding-left: 0px;
	margin: 0 auto 0 auto;
	list-style-type: none;
	height: 39px;
}

.menubar ul li {
float: left;
height: 39px;
padding: 0px;
}

.menubar ul li a {
	display: inline-block;
	margin: 6px 8px 6px 8px;
	padding: 4px 7px 4px 11px;
	color: var(--color-white);
	font-size: 14px;
	line-height: 18px;
	text-align: center;
	text-decoration: none;
	/*border: solid 1px var(--color-darkgray);*/
	border-radius: 2px;
}

.menubar ul li a:hover {
	border: solid 1px var(--color-white);
	border-radius: 2px;
}

.menubar ul li ul {
	display: none;
	position: absolute;
	overflow: hidden;
	width: 150px;
	height: auto;
}

.menubar ul li:hover ul {
	display: block;
	z-index: 10000;
}

.menubar ul li ul li {
	clear: both;
	float: none;
	height: auto;
	overflow: hidden;
}

.menubar ul li ul li a {
	font-size: 14px;
}

.menubar a.menubar_regist_button {
	display: block;
	float: right;
	width: 218px;
	height: 39px;
	background-image: url("../img/regist_button.png");
}

.modal-menu{

}
#menu-txt {
	display: inline-block;
	margin: 6px 8px 6px 0px;
	padding: 4px 7px 4px 0px;
	color: var(--color-white);
	font-size: 14px;
	line-height: 18px;
	text-align: center;
	text-decoration: none;
	border: none;
	border-radius: 2px;
}

#menu-btn {
    float: left;
    height: 39px;
    padding: 0px;
    display: flex;
    width: 50px;
    justify-content: center;
    align-items: center;
    z-index: 90;
	cursor:pointer;
}
#menu-btn span,
#menu-btn span:before,
#menu-btn span:after {
    content: '';
    display: block;
    height: 2.5px;
    width: 25px;
    border-radius: 3px;
    background-color: #ffffff;
    position: absolute;
	transition: all 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
}
#menu-btn span:before {
    bottom: 8px;
}
#menu-btn span:after {
	content: '';
    top: 8px;
}

#menu-btn-check:checked ~ #menu-btn span {
    background-color: transparent; /*メニューオープン時は真ん中の線を透明にする*/
	left:20px;
	z-index: 100;
	position:fixed;
}
#menu-btn-check:checked ~ #menu-btn span::before {
    bottom: 0;
    transform: rotate(45deg);
}
#menu-btn-check:checked ~ #menu-btn span::after {
    top: 0;
    transform: rotate(-45deg);
}
#menu-btn-check:checked ~ #menu-content {
    left: 0;/*メニューを画面内へ*/
}
#menu-btn-check:checked ~ #drawer_back {
	display: block;
}
#menu-btn-check {
    display: none;
}

#menu-content {
    width: 15%;
    height: 100%;
    position: fixed;
    top: 0;
    left: -100vw;/*leftの値を変更してメニューを画面外へ*/
    z-index: 80;
    background-color: var(--color-darkgray);
	transition: all 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
}
#drawer_back {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 70;
}
#menu-content ul {
    padding: 100px 0 0;
}
#menu-content ul li {
    list-style: none;
}
#menu-content ul li a {
    display: block;
    width: 80%;
    color:#ffffff;
    text-decoration: none;
    padding: 10px;
    margin: 5px;
	font-size: 13px;
	text-align: left;
}
#menu_content ul li a:hover {
	border: solid 1px var(--color-white);
	border-radius: 1px;
}
#header_modal {
	width: 100%;
	/*background-color: #4f4f59;*/
	color:#ffffff;
	background-color: var(--color-darkgray);
	margin: 5px;
	font-size: 20px;
}

@media(max-width:750px){
    .modal-menu{
        display: none;
    }
}

.clearfix {
	clear: both;
}

.container {
	margin: 0px auto 0 auto;
	padding: 5px 0 0px 10;
	overflow: hidden;
	height: auto;
	max-width: 1500px;
	background-color: #f6e1e1;
}

.container.top {
	margin: 0 auto 0 auto;
}

.container .main_contents {
	float: left;
	width: 100%;
	height: auto;
	overflow: hidden;
	color: #333333;
	box-sizing: border-box;
	padding: 5px 5px 20px 5px;
}


.container .main_contents ul {
list-style-type: none;
}

.container .main_contents ul li {
margin-bottom: 5px;
}

.container .main_contents ul li a {
	display: block;
	/* border: solid 3px var(--color-button-blue); */
	/* border-radius: 5px; */
	background-color: var(--color-light-active);
	color: #ffffff;
	font-weight: bold;
	text-decoration: none;
	padding: 10px;
	max-width: 300px;
	box-shadow: 2px 2px 4px gray;
}

.main_contents ul li a.red {
	background-color: #f3c2c2;
}

.main_contents ul li a.blue {
	background-color: #7fadf8;
}

footer .footer_link {
position: fixed;
right: 10px;
bottom: 10px;
margin: 0 auto 0 auto;
width: 40px;
text-align: right;
overflow: hidden;
height: 50px;
}

.footer_link a {
position: fixed;
right: 10px;
bottom: 10px;
display: block;
width: 40px;
height: 40px;
padding: 10px 10px 10px 10px;
margin: 10px;
font-weight: bold;
color: #ffffff;
background-color: var(--color-green);
border-radius: 5px;
text-align: center;
float: right;
text-decoration: none;
box-sizing: border-box;
border: solid 1px #ffffff;
box-shadow: 2px 2px 4px lightgray;
}

footer {
	bottom: 0px;
	margin: 0px auto 0 auto;
	width: auto;
	min-height: 100px;
	height: auto;
	overflow: hidden;
	padding: 0px 0px 50px 10px;

	border-top: solid 10px var(--color-order-background);
	background-color: var(--color-category);

	/* box-shadow: 2px -2px 4px gray; */

	position: relative;
}

footer .copyright {
	clear: both;
	height: auto;
	overflow: hidden;
	margin: 0 auto 0 auto;
	color: #ffffff;
	text-align: center;
}

footer .inner {
	color: #ffffff;
	width: 1500px;
	height: auto;
	overflow: hidden;
	margin: 0 auto 20px auto;
	padding: 0px 0px 0px 0px;
}

footer .inner .footer_link_box {
	float: left;

	background-position: 0px 10px;
	background-repeat: no-repeat;
	background-size: none;

	margin: 60px 0 0 0;
	width: 300px;
	min-height: 300px;
}

footer .inner .footer_link_box .address {
	height: auto;
	overflow: hidden;
}

footer .inner .footer_link_box .catchcopy {
	font-size: 12px;
	margin: 0 0 10px 0;
}

footer .inner .footer_link_box.logo {
	padding: 60px 0 0 0;
	margin: 0px 0 0 0;
}

footer .inner .footer_link_box a {
	display: block;
	color: var(--color-white);
}

footer .inner .footer_link_box a:hover {
	text-decoration: underline;
}

div.view_author {
width: 100%;
text-align: center;
margin: 0 0 0 0px;
padding: 0px;
}

.view_author img {
border-radius: 50px;
width: 48px;
height: 48px;
margin: 0px;
padding: 0px;
}

.author_image {
border-radius: 50px;
}


.nickname {
	font-size: 14px;
	font-weight: normal;
	color: #000000;
}

.post_date {
	font-size: 10px;
	font-weight: normal;
	text-align: center;
}

.view_author .profile {
padding: 5px;
text-align: left;
font-size: 12px;
width: 100%;
/*height: 75px;*/
overflow: hidden;
}

.alert {
	color: var(--color-price);
}





.date {
border-top: none;
}

.category {
float: left;
padding : 0px 3px 0px 3px;
border-radius: 5px;
font-size: 12px;
font-weight: bold;
margin: 5px 0px 0px 0px;
}


.main_list {
	float: right;
	width: 100%;
	max-width: 1200px;
	height: auto; 
	overflow: hidden;
	margin: 0 0 0 280px;
}

.category_list {
	position: absolute;
	left: 0px;
	float: left;
	font-size: 12px;
	margin: 5px 0px 0 0px;
	display: block;
	min-width: 260px;
	width: 260px;
	height: auto;
	overflow: hidden;
	padding: 0 0px 0 0px;
}

.category_list a {
	color: var(--color-black);
}
.category_list a:hover {
	text-decoration: underline;
	text-shadow: 0px 0px 2px var(--color-active);
}

.category_list_header {
	margin: 0 0 20px 0;
}

.category_list_header_text {
	font-weight: bold;
}

.category_list_cell {
	padding: 0 0 0 20px;
}

.category_list_cell_sub {
	display: none;
	font-size: 12px;
	line-height: 18px;
	padding: 0 0 0 40px;
}

.category_list_cell_sub.open {
	display: block;
}

.comment_count {
float: left;
font-weight: bold;
margin: 5px 0 0 0px;
background-image: url( "../img/icon_comment.png" );
background-repeat: no-repeat;
background-size: 15px 15px;
background-position: left;
display: block;
min-width: 40px;
height: 20px;
padding: 0 0 0 16px;
}

.share_count {
float: left;
font-weight: bold;
margin: 5px 0 0 0px;
background-image: url( "../img/icon_share.png" );
background-repeat: no-repeat;
background-size: 15px 15px;
background-position: left;
display: block;
min-width: 40px;
height: 20px;
padding: 0 0 0 16px;
}

.like_count {
float: left;
font-weight: bold;
margin: 5px 0 0 0px;
background-image: url( "../img/icon_like.png" );
background-repeat: no-repeat;
background-size: 15px 15px;
background-position: left;
display: block;
min-width: 40px;
height: 20px;
padding: 0 0 0 16px;
}

.new_mark {
	float: left;
	margin: 0 5px 0 0;
	padding: 0px;
	height: 20px;
	width: 30px;
	background-repeat: no-repeat;
	background-position: center;
	background-color: var(--color-price);
	color:var(--color-border);
	text-align: center;
	font-size: 10px;
	font-weight: bold;
	border-radius: 5px;
	border: solid 1px #ff0000;
	box-sizing: border-box;
}
			
.new_icon {
	background-color: #ff0000;
	color: #ffffff;
	font-size: 10px;
	font-weight: bold;
	padding: 5px;
	margin: 5px;
	float: left;
}

.container .main_contents .document_contain .content_box {
	width: 100%;
	color: #000000;
	overflow: hidden;
	height: auto;
	padding: 0px;
	margin: 0 auto 30px auto;
	background-color: #ffffff;

	border: solid 1px var(--color-order-border);
	border-radius: 8px;

	box-sizing: border-box;
}

.container .main_contents .document_contain .content_box .title {
	background-color: var(--color-order-background);
	font-size: 14px;
	line-height: 18px;
	padding: 10px 10px 10px 10px;
}

.container .main_contents .document_contain .content_box .content_left {
	clear: both;
	float: left;
	width: 100px;
	height: 200px;
	margin: 0 10px 0 0;
	text-align: center;
}

.container .main_contents .document_contain .content_box .content_left.reverse {
	float: right;
	margin: 0 0 0 10px;
}

.container .main_contents .document_contain .content_box .content_left .date {
	text-align: center;
	font-size: 10px;
}

.container .main_contents .document_contain .content_box .content_right {
	float: left;
	width: 800px;
	overflow: hidden;
	padding: 10px;
	margin: 0px;
	font-size: 12px;
	line-height: 18px;
}

.container .main_contents .document_contain .content_box #information {
	float: left;
	width: 95%;
	overflow: hidden;
	padding: 10px;
	margin: 0px;
	font-size: 12px;
	line-height: 18px;
}

.container .main_contents .document_contain .content_box .content_right .category_list {
	position: static;
}

.content_top {
	/* background-image: url( "../img/content_top.png" ); */
	border-top: solid 1px #aaaaaa;
	border-left: solid 1px #aaaaaa;
	border-right: solid 1px #aaaaaa;
	background-position: top;
	min-height: 150px;
	padding: 20px 20px 0px 30px;
	overflow: hidden;
	height: auto;
}

.container .main_contents .document_contain .content_box .content_right a.title {
	color: #000000;
	text-decoration: none;
	line-height: 1.3;
	font-size: 24px;
	font-weight: 700;
	width: 90%;
	display: relative;
	margin: 0 0 0 0;
}

.container .main_contents .document_contain .content_box .date {
	background-color: var(--color-darkgray);
	padding: 5px;
	color: #FFFFFF;
	font-weight: bold;
	text-align: right;
	margin-bottom: 10px;
}

.container .main_contents .document_contain .content_box .content_right .date {
	float: right;
	width: 150px;
	margin: 0 0px 5px 0;
	font-size: 100%;
	font-weight: bold;
	text-align: right;

	/* border-top: solid 1px var(--color-button-blue); */
	color: var(--color-button-blue);
	padding: 3px 10px 3px 10px;
	background-color: #ffffff;
}

.container .main_contents .document_contain .content_box .content_left {
float: right;
width: 200px;
height: auto;
overflow: hidden;
padding: 0px;
margin: 0px;
text-align: center;
}

.container .main_contents .document_contain .content_box .content_left .author_image {
	border: solid 3px #ffffff;
	border-radius: 32px;
	width: 48px;
	height: 48px;
	margin: 5px auto 5px auto;
}

.container .main_contents .document_contain .content_box .content_left .nickname {
	color: #000000;
	background-color: #ffffff;
	border-radius: 10px;
	display: inline;
	padding: 0 10px 0 10px;
	min-height: 20px;
	min-width: 50px;
	font-weight: normal;
	font-size: 12px;
}


.content_right .title {
font-weight: 700;
font-size: 24px;
line-height: 26px;
padding: 0 0 5px 0;
}

.content_right .description {
min-height: 60px;
margin-bottom: 10px;
overflow: hidden;
font-size: 12px;
line-height: 20px;
padding: 0px;
margin: 0px 5px 0px 5px;
text-align: left;
}

.content_right .description .image {
margin: auto 10px;
width: 600px;
height: 400px;
overflow: hidden;
font-size: 12px;
text-align: left;
border: none;
margin: 0px;
padding: 0px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
background-color: #fefefe;
}

.content_bottom {
width: 790px;
height: 13px;
border-bottom: solid 1px #aaaaaa;
border-left: solid 1px #aaaaaa;
border-right: solid 1px #aaaaaa;
/* background-image: url( "../img/content_bottom.png" ); */
background-position: top;
margin: 0 0 20px 0;
}

.content_bottom.reverse {
background-image: url( "../img/content_bottom_reverse.png" );
}

.content_tile {
overflow: hidden;
height: auto;
border: solid 1px var(--color-order-border);
border-radius: 5px;
background-color: #ffffff;

float: left;
max-width: 300px;
width: 100%;
padding: 0px 0px 0px 0px;
overflow: hidden;
margin: 0 10px 15px 0px;
box-sizing: border-box;
}

.content_tile .content_right {
overflow: hidden;
padding: 0px 0px 5px 0px;
text-align: center;
}

.content_tile .content_overwrap {
display: block;
width: 320px;
height: 200px;
}

.content_tile .content_overwrap:hover {
background-color: #ffffff;
opacity: 0.5;
}

.content_tile .content_right .date {
height: 20px;
overflow: hidden;
}

.content_tile .content_right .img {
margin: 0 -5px 0 -5px;
height: 140px;
overflow: hidden;
text-align: center;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}

.content_tile .title {
clear: both;
text-align: center;
width: 100%;
height: 25px;
padding: 5px 0 5px 0;
overflow: hidden;
background: var(--color-button-blue);
}

.content_tile .title a {
color: #ffffff;
font-weight: bold;
font-size: 18px;
text-decoration: none;
}

.content_tile .thumbnail {
height: 200px;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}

.content_tile .description {
height: auto;
overflow: hidden;
font-size: 14px;
line-height: 20px;
}

.content_tile .date {
width: 280px;
}

.content_tile .controller {
padding: 0px 5px 0px 5px;
width: 300px;
height: 25px;
overflow: hidden;
}

.content_tile .point_inner {
margin: 0px;
overflow: hidden;
}

.twitter_box {
float: left;
width: 300px;
background-color: #ffffff;
overflow: hidden;
height: auto;
padding: 10px;
margin: 0 5px 10px 0px;
border: solid 1px #cdcdcd;
}

.content_tile .point_inner .view_auther .nickname {
	font-weight: normal;
}

.point_title {
font-weight: normal;
font-size: 14px;
text-align: left;
margin: 0 0 5px 0;
padding: 5px;
color: var(--color-black);
background-color: var(--color-background);
}

.point_number {
color: var(--color-button-blue);
font-size: 24px;
font-weight: 700;
float: left;
padding: 5px 0 0 0;
margin: 0 0 5px 0;
}

.point_comment {
font-size: 12px;
float: right;
padding: 10px 0 0 0;
margin: 0 0 5px 0;
}

.point_description {
font-size: 12px;
margin: 10px 0 10px 0;
max-height: 270px;
}

div#map.point_map {
height: 150px;
border: solid 1px #aaaaaa;
}

div#map.stamp_map {
height: 250px;
border: solid 1px #aaaaaa;
}

div#map.view_map {
width: 270px;
height: 220px;
border: none;
margin: 0 auto;
border: solid 1px #aaaaaa;
}

.point_address {
margin: 5px 0 0 0px;
background-image: url( "../img/icon_map.png" );
background-repeat: no-repeat;
background-size: 15px 15px;
background-position: left;
display: block;
height: 20px;
padding: 0 0 0 20px;
}

.point_tel {
margin: 5px 0 0 0px;
background-image: url( "../img/icon_tel.png" );
background-repeat: no-repeat;
background-size: 15px 15px;
background-position: left;
display: block;
height: 20px;
padding: 0 0 0 20px;
}

.point_mail {
margin: 5px 0 0 0px;
background-image: url( "../img/icon_mail.png" );
background-repeat: no-repeat;
background-size: 15px 15px;
background-position: left;
display: block;
height: 20px;
padding: 0 0 0 20px;
}

.point_url {
margin: 5px 0 0 0px;
background-image: url( "../img/icon_url.png" );
background-repeat: no-repeat;
background-size: 15px 15px;
background-position: left;
display: block;
height: 20px;
padding: 0 0 0 20px;
}

.point_modify {
text-align: right;
margin: 5px 0 0 0px;
display: block;
height: 20px;
}

/*
トップページスポット一覧
*/
.spot_box {
display: block;
float: left;
width: 320px;
height: 200px;
margin: 0 10px 10px 0;
overflow: hidden;
border: solid 1px #aaaaaa;
text-decoration: none;
}

.spot_box .image {
display: block;
border: none;
margin: 0px;
width: 320px;
height: 200px;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
}

.spot_box .title {
position: relative;
display: block;
text-decoration: none;
border: none;
margin: -40px 0 0 0;
padding: 10px;
width: 300px;
height: 30px;
color: #ffffff;
font-weight: bold;
background-color: rgba(0,0,0,0.5);;
font-size: 24px;
line-height: 120%;
border-bottom: none;
}

#spot_list .spot_list_box {
float: left;
width: 120px;
height: 120px;
overflow: hidden;
margin: 0 5px 5px 0;
border: solid 1px #aaaaaa;
text-align: center;
padding: 5px;
}

#spot_list .spot_list_box img {
width: 100px;
height: 80px;
}


.index_left {
float: left;
clear: both;
width: 80px;
margin: 0 0 5px 0;
}

.index_center {
float: left;
display: block;
width: 150px;
height: 20px;
background-color: #cdcdcd;
margin: 0 5px 5px 0;
}

.index_center .index_bar {
background-color: var(--color-button-blue);
height: 20px;
}

.index_right {
float: left;
margin: 0 0 5px 0;
}

.comment_left {
float: left;
clear: both;
width: 56px;
height: 152px;
padding: 2px;
border-bottom: dotted 1px #aaaaaa;
}

.comment_left img {
width: 48px;
height: 48px;
border-radius: 24px;
}

.comment_right {
float: left;
width: 231px;
height: 150px;
border-bottom: dotted 1px #aaaaaa;
overflow: hidden;
padding: 3px;
line-height: 120%;
}

.comment_all {
height: 24px;
width: 100%;
overflow: hidden;
border-bottom: dotted 1px #aaaaaa;
}


.content_tile_small {
float: left;
width: 100px;
height: 200px;
padding: 5px 5px 10px 0px;
overflow: hidden;
}

.content_tile_small .date {
font-size: 8px;
padding: 2px;
}

.content_tile_small .title {
clear: both;
text-align: left;
height: 80px;
overflow: hidden;
}

.content_tile_small .title a {
color: #000000;
font-weight: bold;
font-size: 10px;
text-decoration: none;
}

.content_tile_small .thumbnail {
height: 80px;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
}

.content_tile_small .thumbnail_frame {
background-color: #ffffff;
margin: 5px;
padding: 5px;
width: 80px;
height: 90px;
border: solid 1px #cdcdcd;
box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.1);
}


h1.spot_name {
font-size: 32px;
font-weight: 700px;
text-align: left;
margin: 20px 0 0 0;
padding: 10px 0 10px 0;
}

.spot_tile .img {
display: block;
float: left;
width: 299px;
height: 199px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}

.spot_tile .img:first-child {
width: 699px;
height: 597px;
}

.spot_tile {
width: 998px;
height: 597px;
border: solid 1px #aaaaaa;
overflow: hidden;
}

.sidebar {
float: right;
width: 320px;
height: auto;
overflow: hidden;
}

.sidebar .element_header {
font-size: 12px;
color: #000000;
border-left: solid 3px var(--color-button-blue);
border-right: solid 1px #eeeeee;
border-top: solid 1px #eeeeee;
background-image: -webkit-gradient(
linear
, left top
, left bottom
, from(#ffffff)
, to(#eeeeee));
margin: 0 0 5px 10px;
padding: 4px 4px 4px 7px;
width: 288px;
}
.sidebar .element_contents {
width: 300px;
overflow: hidden;
min-height: 100px;
border: solid 1px #eeeeee;
background-color: #ffffff;
margin: 0 0 10px 10px;
box-shadow: 2px 2px 4px lightgray;
}

.sidebar_content {
padding: 5px;
}

.sidebar_line {
height: auto;
overflow: hidden;
border-bottom: dotted 1px #dddddd;
}

.sidebar_date {
float: left;
width: 120px;
}
.sidebar_title {
float: left;
width: 170px;
}

.sidebar_weather {
padding: 5px;
text-align: center;
}

.sidebar_calendar_frame {
width: 217px;
border-top: solid 1px #eeeeee;
border-left: solid 1px #eeeeee;
margin: 20px auto 20px auto;
}

.sidebar_calendar_day {
float: left;
padding: 3px 0 0 0;
width: 30px;
height: 20px;
border-right: solid 1px #eeeeee;
border-bottom: solid 1px #eeeeee;
text-align: center;
overflow: hidden;
}

.sidebar_calendar_date {
background-color: var(--color-button-blue);
color: #ffffff;
padding: 4px;
text-align: center;
font-weight: bold;
}


.sidebar_loading {
text-align: center;
padding: 30px;
}


.paginator {
clear: both;
}

.paginator ul.pagination {
list-style-type: none;
padding-left: 0px;
}

.paginator ul.pagination li a, .paginator div.paginator p, .paginator p {
display: block;
float: left;
margin: 0 0 10px 2px;
padding: 5px 20px 5px 20px;
border: solid 1px #aaaaaa;
border-radius: 0px;
text-decoration: none;
color: #666666;
background-color: #ffffff;
width: auto;
text-align: center;
}

.paginator ul.pagination li.active a {
color: #ffffff;
font-weight: bold;
border: solid 1px var(--color-button-blue);
background-color: var(--color-button-blue);
}

.slideshow_frame {
	width: 1500px;
	margin: 0 auto 0 auto;
}

ul.slideshow {
width: 100%;
max-width: 1300px;
height: 465px;
overflow: hidden;
list-style: none;
padding: 0px;
margin: 0 auto 1px auto;
}

ul.slideshow li {
float: left;
width: 100%;
max-width: 1300px;
height: 465px;
overflow: hidden;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
margin: 0 auto 0 auto;
}

ul.bxslider li {
text-align: center;
background-size: cover;
background-position: top center;
background-repeat: no-repeat;
min-height: 300px;
}

ul.slideshow a li {
cursor: pointer;
}

ul.slideshow li .black_background {
margin: 300px 0 0 0;
background-color: rgba( 0, 0, 0, 0.5 );
overflow: hidden;
height: 165px;
}

ul.slideshow li .title {
height: 36px;
line-height: 36px;
overflow: hidden;
font-size: 36px;
font-weight: bold;
text-align: right;
margin: 20px 20px 20px 20px;
color: #ffffff;
}

ul.slideshow li .description {
font-size: 12px;
font-weight: normal;
text-align: right;
margin: 20px 20px 20px 20px;
color: #ffffff;
}


.character_element {
float: left;
width: 260px;
height: 450px;
text-align: center;
padding: 20px;
overflow: hidden;
}

.character_element img {
width: 260px;
}

.character_element p {
font-size: 14px;
text-align: left;
}

h1 {
color: #333333;
line-height: 1.3;
font-family: Roboto, "Hiragino Sans";
font-size: 180%;
font-weight: 1000;
/* border-bottom: 1px solid #dddddd; */
/* border-top: 1px solid #EBEBEB; */
/*
margin: 36px 0 46px 0;
padding: 66px 0 66px 0;
*/
margin: 5px 0 5px 0;
padding: 3px 0 3px 15px;
text-align: left;
border-left: solid 20px var(--color-black);
}

h2 {
font-size: 150%;
font-weight: bold;
color: #000000;
padding: 10px 0 10px 0;
margin: 0px 0 0px 0;
}

h2.half {
width: 420px;
margin-right: 10px;
}

.speak_ballon {
clear: both;
width: 1000px;
height: 40px;
margin: 0 0 10px 0;
background-image: url( '../img/view_bottom.png' );
}

.description {
clear: both;
line-height: 1.8;
font-size: 14px;
min-height: 100px;
margin: 10px auto 10px auto;
}

p, .description p {
-webkit-margin-before: 0px;
-webkit-margin-after: 0px;
}

.description img, .thumbnail_frame {
margin: 10px auto 20px 50px;
padding: 10px;
border: solid 1px #cdcdcd;
/* box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.1); */
border-radius: 10px;
clear: both;
float: none;
height: auto;
border-radius: 0px;
box-sizing: border-box;
}

.description p.article {
margin: 0px 0 0px 0;
font-size: 14px;
line-height: 24px;
}

.description img {
max-width: 550px;
height: auto;
}

.view_image {
text-align: center;
padding: 0 0 50px 0;
overflow: hidden;
}

.view_image img {
max-width: 600px;
padding: 10px;
border: solid 1px #cdcdcd;
box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.1);
}

.link {
background-image: url( '../img/ic_link.png' );
background-position: left center;
background-repeat: no-repeat;
padding: 0 0 0 20px;
margin: 0 auto 20px auto;
max-width: 600px;
}

.download {
background-image: url( '../img/ic_download.png' );
background-position: left center;
background-repeat: no-repeat;
padding: 0 0 0 20px;
margin: 0 0 20px 50px;
}

.twitter-share-button {
float: right;
margin-right: 10px;
}

.fb-like {
float: right;
margin-right: 10px;
line-height: 0px;
}

#map {
height: 500px;
overflow: hidden;
}

#map_border {
border: solid 1px #aaaaaa;
margin-bottom: 20px;
padding-left: 1px;
}

.weather {
overflow: hidden;
height: auto;
width: auto;
clear: both;
border-left: solid 1px #aaaaaa;
border-top: solid 1px #aaaaaa;
margin: 0 auto 10px auto;
border: solid 5px #aaaaaa;
border-radius: 0px;
box-sizing: border-box;
background-color: #ffffff;
}

.weather_header {
float: left;
overflow: hidden;
}

.weather_body {
float: left;
overflow: hidden;
}

.weather_data {
height: 60px;
}

.weather_header div {
width: 102px;
border-right: solid 1px #aaaaaa;
border-bottom: solid 1px #aaaaaa;
padding: 5px;
color: #333333;
font-weight: bold;
font-size: 14px;
line-height: 16px;
min-height: 35px;
}

.weather_body div {
width: 98px;
border-right: solid 1px #aaaaaa;
border-bottom: solid 1px #aaaaaa;
padding: 5px;
color: #000000;
text-align: center;
font-size: 12px;
line-height: 16px;
min-height: 35px;
}

.templatuer {
clear: both;
width: 100%;
display: block;
}

.calender, .filelist {
overflow: hidden;
height: auto;
width: 987px;
clear: both;
border-left: solid 1px #aaaaaa;
border-top: solid 1px #aaaaaa;
border-right: solid 1px #aaaaaa;
margin: 0 auto 20px auto;
border-radius: 0px;
background-color: #ffffff;
box-shadow: 2px 2px 4px gray;
}

.calender_title_cell {
float: left;
width: 140px;
padding: 5px 0 5px 0;
text-align: center;
font-size: 12px;
font-weight: bold;

border-bottom: solid 1px #dddddd;
border-right: solid 1px #eeeeee;

background-color: var(--color-button-blue);
color: #ffffff;
}

.calender_cell {
float: left;
width: 140px;
height: 150px;
line-height: 14px;
overflow: hidden;
/*
border-right: solid 1px #aaaaaa;
border-bottom: solid 1px #aaaaaa;
*/
border-bottom: solid 1px #dddddd;
border-right: solid 1px #eeeeee;
}

.calender_cell_header {
width: 100%;
border-bottom: solid 1px #eeeeee;
overflow: hidden;
height: auto;
background-color: #ffffff;
}


.mini_calendar {
overflow: hidden;
height: auto;
float: left;
width: 145px;
margin: 0 5px 0 0;
}

.mini_calendar_title {
background-color: var(--color-button-blue);
color: #ffffff;
font-weight: bold;
text-align: center;
margin: 0 0 10px 0;
}

.mini_calendar_cell {
float: left;
width: 20px;
height: 20px;
text-align: center;
border-radius: 10px;
}

.schedule {
border-right: solid 1px #eeeeee;
border-bottom: solid 1px #eeeeee;
height: auto;
overflow: hidden;
}
.schedule_cell {
float: left;
width: 20px;
height: 20px;
text-align: center;
border-left: solid 1px #dddddd;
border-top: solid 1px #dddddd;
box-sizing: border-box;
padding: 2px;
font-size: 10px;
}

.schedule_title {
float: left;
width: 150px;
height: 20px;
text-align: left;
border-left: solid 1px #dddddd;
border-top: solid 1px #dddddd;
box-sizing: border-box;
overflow: hidden;
padding: 2px;
font-size: 10px;
}

.schedule_background {
float: left;
background-image: url('../img/matrix.png');
height: 20px;
overflow: hidden;
}

.schedule_header {
clear: both;
float: left;
background: #ffffff;
}

.schedule_body {
float: left;
/* border: solid 1px #aaaaaa; */
overflow-x: scroll;
width: 490px;
}

table.gant_chart {
width: 100%;
border-collapse: collapse;
}

table.gant_chart td:nth-child(1) {
padding: 0px;
width: 8px;
height: 10px;
background-image:url( "../img/start.png" );
}
table.gant_chart td:nth-child(2) {
padding: 0px;
height: 10px;
background-image:url( "../img/middle.png" );
}
table.gant_chart td:nth-child(3) {
padding: 0px;
width: 5px;
height: 10px;
background-image:url( "../img/end.png" );
}

.gant_date {
font-size: 8px;
margin: -9px 0 0 0;
text-align: center;
overflow: hidden;
height: 20px;
}

.schedule {
position: absolute;
overflow: hidden;
width: 1000px;
}

#schedule_header.schedule_header {
position: absolute;
margin: 80px 0 0 0;
z-index: 2;
}

#scroll1.schedule_body {
height: 80px;
}

.schedule_bar {
float: left;
height: auto;
text-align: left;
border-left: solid 1px #dddddd;
border-top: solid 1px #dddddd;
box-sizing: border-box;
padding: 2px;
font-size: 10px;
overflow: hidden;
background: #ffffff;
}

.commit_button {
display: none;
border: solid 1px #aaaaaa;
background: #eeeeee;
font-size: 8px;
width: 50px;
height: 20px;
overflow: hidden;
text-align: center;
box-sizing: border-box;
}

.commit_button a {
background: #ffffff;
border: solid 1px #dddddd;
display: inline-block;
color: #000000;
text-decoration: none;
width: 20px;
height: 20px;
line-height: 20px;
}


#schedule2 {
user-select: none;
overflow: hidden;
}

.today {
background-color: #ffffaa;
}

.holiday {
background-color: #ffdddd;
}

.saturday {
background-color: #ddffff;
}

.sunday {
background-color: #ffddee;
}

.event {
background-color: #ffddaa;
}
.weekday {
background-color: #eeeeee;
}
.out_of_month {
color: #aaaaaa;
background-color: #ffffff;
}



.calender_cell .day_sp {
display: none;
}

.calender_cell .day {
float: left;
font-size: 14px;
font-weight: bold;
color: #000000;
width: 25px;
height: 20px;
padding: 10px 5px 5px 5px;
text-align: center;
border-right: solid 1px #dddddd;
background-color: #ffffff;
}

.calender_cell .calender_weather {
float: left;
font-size: 12px;
font-weight: normal;
color: #000000;
width: 94px;
height: 25px;
padding: 5px;
text-align: center;
background-color: #ffffff;
}

.calender_cell .calender_weather img {
width: 20px;
}

.calender_controller {
display: block;
border: solid 1px #aaaaaa;
background-color: #eeeeee;
border-radius: 0px;
overflow: hidden;
margin: 0 0 20px 0;
box-shadow: 2px 2px 4px gray;
}

.calender_controller a, .calender_controller .month, .calender_controller .menu {
display: block;
padding: 13px 20px 15px 20px;
font-size: 12px;
font-weight: normal;
color: #000000;
text-decoration: none;
float: left;
/* height: 100%; */
overflow: hidden;
/*
border-right: solid 1px #aaaaaa;
border-top: solid 1px #dddddd;
*/
}

.calender_controller .menu.input {
padding: 2px 10px 0px 10px;
min-height: 46px;
height: auto;
overflow: hidden;
}

.calender_controller a.right {
float: right;
border-right: none;
border-left: solid 1px #aaaaaa;
min-width: 98px;
text-align: center;
}

.calender_controller a:hover {
color: #ffffff;
background-color: var(--color-button-blue);

filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}

.calender_controller a.active {
color: #ffffff;
background-color: var(--color-button-blue);
}


.calender_controller .month {
background-color: #ffffff;
}

.calender_item {
font-size: 12px;
padding: 2px;
height: 12px;
overflow: hidden;
}

.holiday .calender_item {
color: #ff00aa;
}

.calender_item a {
color: #ff6600;
text-decoration: none;
}

a.event_green {
color: #8fc31f;
}

a.event_blue {
color: #00a0e9;
}

a.event_red {
color: #ea68a2;
}

a.event_purple {
color: #8957a1;
}


.nomore_comment {
padding: 30px 0 30px 0;
text-align: center;
}

.space10 {
height: 10px;
clear: both;
}

.space20 {
height: 20px;
clear: both;
}

.border {
border-top: solid 1px #aaaaaa;
}

.right {
text-align: right;
}

.center {
text-align: center;
}

.clear {
clear: both;
}

.bold {
font-weight: bold;
}

.normal {
font-weight: none;
}

.small {
font-size: 9px;
}
.large {
font-size: 14px;
}

.huge {
font-size: 18px;
}

.sns_button {
margin: 0 0 20px 0;
text-align: right;
height: auto;
overflow: hidden;
}

.tab_area {
min-width: 700px;
}

.tab_border {
float: left;
width: 50px;
height: 49px;
border-bottom: solid 1px #aaaaaa;
}

.tab a {
display: block;
float: left;
width: 80px;
height: 50px;
border-left: solid 1px #aaaaaa;
border-top: solid 1px #aaaaaa;
border-bottom: solid 1px #aaaaaa;
text-align: center;
padding: 10px 2px 0px 2px;
background-color: #eeeeee;
margin-bottom: 10px;
color: #000000;
text-decoration: none;
box-sizing: border-box;
}

.tab.active a {
background-color: #ffffff;
border-bottom: none;
box-sizing: border-box;
}

.tab_border_last {
right: 0px;
float: left;
width: 50px;
height: 49px;
border-left: solid 1px #aaaaaa;
border-bottom: solid 1px #aaaaaa;
}

#delete_background {
position: absolute;
background-color: #000000;
border: dashed 5px #aaaaaa;
opacity: 0.5;
width: 100%;
height: 100%;
left: 0px;
top: 0px;
right: 0px;
bottom: 0px;
}

#image_upload_section {
/* border: solid 5px #ec6941; */
position: static;
background-color: #efefef;
border: dotted 1px #666666;
/* opacity: 0.5; */
width: 747px;
left: 0px;
top: 0px;
right: 0px;
bottom: 0px;
height: auto;
overflow: hidden;
padding: 10px;

/*
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
*/

vertical-align: middle;
}

#image_upload_section #area {
margin: 80px auto 80px auto;
color: #000000;
font-size: 12px;
text-align: center;
vertical-align: middle;
clear: both;
}

#image_upload_section.active {
border: dotted 5px var(--color-button-blue);
}


#progress_screen {
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
}

.progress_dialog {
margin: 200px auto;
}

#progress_name {
font-size: 12px;
font-weight: bold;
}

.progressbar {
height: 30px;
border: solid 1px #aaaaaa;
background: linear-gradient(#dddddd, #ffffff );
}

#progress_bar {
width: 50%;
height: 30px;
border: solid 1px #aaaaaa;
background: linear-gradient(#00a0e9, #0068b7 );
}

#progress_status {
text-align: right;
font-size: 12px;
}

#system_result {
position: absolute;
margin-top: -50px;
border: solid 2px #ff0000;
background-color: #e45679;
color: #ffffff;
padding: 5px;
text-align: center;
}

.align_right {
text-align: right;
}

.menu_category {
float: left;
display: block;
text-align: center;
border: solid 1px #dddddd;
margin: 0 20px 20px 0;
padding: 10px;
box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.1);
width: 10px;
height: 150px;
overflow: hidden;
}

.menu_icon, .project_icon, .project_user_icon, .project_card {
float: left;
display: block;
text-align: center;
border: solid 1px var(--color-order-border);
border-radius: 8px;
margin: 0 10px 10px 0;
padding: 10px;
width: 110px;
height: 150px;
overflow: hidden;
background-color: #ffffff;
/*--box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.1);*/
font-size: 12px;
}

.menu_icon.new, .project_icon.new, member_icon.new, .project_text.new {
background-image: url( "../img/menu_icon_new.png" );
background-repeat: no-repeat;
background-position: 0px 0px;
}

.project_text {
padding: 10px 0 0 0;
}

.project_user_icon {
border-top: solid 3px ;
}

.project_icon {
/* border-top: solid 3px var(--color-button-blue); */
margin: 0 13px 20px 0;
padding: 0px;
width: 300px;
height: 250px;
/* box-shadow: none;*/
}

a.project_icon {
color: #000000;
text-decoration: none;
}

.project_main_img {
margin: 0px 0px 0px 0px;
width: 100%;
height: 150px;
background-size: cover;
background-position: center;
background-color: var(--color-order-background);
border-bottom: solid 1px var(--color-order-border);
}

.project_icon_img {
margin: -130px 0px 20px 10px;
width: 120px;
height: 120px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}

.project_icon_img_mini {
margin: -100px 0px 20px 20px;
width: 80px;
height: 80px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}

.project_title {
font-weight: bold;
font-size: 12px;
text-decoration: none;
color: #000000;
height: 20px;
overflow: hidden;
padding: 0px 5px 0px 5px;
box-sizing: border-box;
}

.project_description {
text-decoration: none;
color: #000000;
height: 70px;
overflow: hidden;
padding: 10px;
box-sizing: border-box;
text-align: left;
}
a.project_card {
width: 200px;
height: 150px;
color: #000000;
text-decoration: none;
}

.project_card .project_icon_img_mini {
margin: -50px 0px 5px 10px;
width: 40px;
height: 40px;
}

.project_card .project_main_img {
height: 80px;
}

.project_card .project_title {
font-size: 12px;
height: 18px;
}

.project_card .project_description {
font-size: 10px;
width: 200px;
height: 50px;
padding: 0px 5px 0 0;
box-sizing: border-box;
word-break : break-all;
overflow-wrap: normal;
}


.menu_icon img {
width: 64px;
margin: 23px 10px 23px 10px;;
}

.menu_icon_img, member_icon_img {
	float: left;
width: 40px;
height: 40px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
margin: 0 auto 0 auto;
border-radius: 5px;
border: solid 1px #aaaaaa;
margin: 5px 5px 5px 0;
}

.member_status {
width: 110px;
height: 15px;
text-align: center;
margin: 5px auto 5px auto;
overflow: hidden;
height: auto;
}

.member_icon {
float: left;
display: block;
text-align: center;
margin: 0 20px 20px 0;
padding: 0 10px 10px 10px;
width: 110px;
height: 150px;
overflow: hidden;
background-color: #ffffff;
font-size: 10px;
color: #000000;
text-decoration: none;
}

.member_icon_img {
width: 100px;
height: 100px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
margin: 0 auto 0 auto;
}

.project_user {
clear: both;
float: left;
width: 140px;
height: auto;
overflow: hidden;
text-align: center;
}

.project_inner {
	padding: 0 5px 25px 0;
	height: auto;
	overflow: hidden;
}

.project_message_list {
	box-shadow: 2px 2px 4px gray;
	height: auto;
	overflow: hidden;
	padding: auto;
	margin:auto;
}

.project_desc {
	float: right;
	float: none;
	padding: 5px 0px 0px 0px;
	border: solid 1px #dddddd;
	border-top: solid 1px var(--color-darkgray);
	height: 166px;
	overflow: hidden;
	margin: 0px 0px 0px 150px;
}
  
.project_content {
	width: 100%;
	float: none;
	padding: 5px;
	border: solid 1px #dddddd;
	border-top: solid 1px var(--color-darkgray);
	height: auto;
	overflow: hidden;
	margin: 0px 0 0px 0;
}

.project_content .message {
	font-size: 12px;
	line-height: 18px;
	margin: 0 0 0 45px;
}

.project_content .control {
	float: right;
	text-align: right;
}
.project_content .control a {
	margin: 0 0 3px 3px;
}

.project_attached {
float: left;
padding: 5px;
border: solid 1px #dddddd;
width: 838px;
margin: 0 0 10px 0;
}

#work_record_time {
margin: 30px;
height: 120px;
line-height: 50px;
font-size: 24px;
font-weight: bold;
}

.work_status {
line-height: 50px;
font-size: 24px;
font-weight: bold;
height: 50px;
}

.work_status.active {
color: var(--color-button-blue);
}

.work_status.inactive {
color: #cc0000;
}

#working_time {
text-align: center;
color: var(--color-button-blue);
height: 20px;
}

.work_report_title {
line-height: 24px;
font-size: 18px;
font-weight: bold;
border-bottom: solid 1px #666666;
margin: 10px 0 10px 0;
}

.profile_box {
float: left;
width: 450px;
height: 200px;
text-align: center;
}

.profile_box img {
width: 100px;
height: 100px;
border-radius: 50px;
}

.profile_box .nickname {
line-height: 32px;
font-size: 18px;
font-weight: normal;
text-align: center;
}

.profile_box .profile_title {
clear: both;
line-height: 32px;
font-size: 18px;
font-weight: bold;
text-align: left;
width: 200px;
float: left;
margin-top: 20px;
}

.profile_box .profile_value {
line-height: 32px;
font-size: 18px;
font-weight: bold;
text-align: right;
width: 200px;
float: left;
margin-top: 20px;
}

.profile_box.center {
float: none;
margin: 0 auto 0 auto;
}

.gacha {
width: 250px;
}

.item_image {
width: 50px;
}

.item_capsule {
width: 125px;
}

.item_icon {
padding-top: 25px;
height: 100px;
overflow: hidden;
}

.menu_icon .item_icon img {
width: 50px;
}

.file_icon {
float: left;
width: 100px;
height: 140px;
text-align: center;
}

.file_name {
display: block;
width: 100px;
max-height: 18px;
overflow: hidden;
text-align: center;
margin: 0px 0px 0px 0px;
}

.ad_area {
text-align: center;
overflow: hidden;
height: auto;
margin: 0 0 20px 0;
}

ul.train li {
margin-bottom: 0px;
}

ul.train li a {
background-color: transparent;
color: var(--color-button-blue);
font-weight: normal;
padding: 0;
max-width: 100%;
}

.half_area {
float: left;
width: 460px;
padding-right: 10px;
box-sizing: border-box;
margin: 0 0 20px 0;
}

.box {
	/*__border: solid 1px #dddddd;*/
	padding: 0px 0px 5px 0px;
	height: auto;
	overflow: hidden;
}
.dashboard_box {
	padding: 0px;
	height: auto;
	overflow: hidden;
}


.dashboard_box .ask_button a {
	display: block;
	background: linear-gradient(var(--color-navy), var(--color-darkgray));
	width: 140px;
	height: 30px;
	border: solid 1px var(--color-black);
	border-radius: 2px;
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	padding: 8px 0 0 0;
	text-decoration: none;
	color: #ffffff;
	margin: 10px 20px 0 0;
}


.box_flow {
	border: solid 1px #dddddd;
	padding: 10px;
	height: auto;
	overflow: hidden;
}

	
.red_border {
border: solid 2px #cc0000;
}

.entry_box {
display: block;
float: left;
width: 120px;
height: 400px;
border: solid 1px #eeeeee;
padding: 5px;
margin: 0px 5px 5px 0px;
color: #000000;
text-decoration: none;
}

.entry_box form {
box-shadow: none;
padding: 0px;
border-width: 0px;
border-left: none;
}

.entry_box .entry_image {
width: 100px;
height: 100px;
margin: 0 auto 0 auto;
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
border: solid 1px #aaaaaa;
}

.entry_box .section {
height: 40px;
overflow: hidden;
}

.entry_box .area {
height: 40px;
overflow: hidden;
font-weight: bold;
}

.entry_box .date {
font-size: 8px;
font-weight: normal;
}

.screen_box {
float: left;
width: 100px;
height: 50px;
padding: 30px 0 0 0;
text-align: center;
font-size: 10px;
border: solid 1px #666666;
background-color: #eeeeee;
}

.screen_box.active {
background-color: var(--color-button-blue);
color: #ffffff;
font-weight: bold;
}

.screen_arrow {
float: left;
width: 50px;
height: 50px;
margin: 20px 0 0 0;
background-color: var(--color-button-blue);
background-image: url( "../img/screen_arrow.png" );
background-position: center;
background-size: cover;
}

.image_element .image_icon {
background-position: center;
background-size: contain;
background-repeat: no-repeat;
width: 80px;
height: 80px;
margin: 0 auto 0 auto;
}

.image_list {
	overflow: hidden;
	height: auto;
	margin: 5px;
	text-align: center;
}

.image_element {
text-align: center;
overflow: hidden;
height: auto;
margin: 10px;
float: left;
}

.control_button {
clear: both;
overflow: hidden;
height: auto;
}



.left {
float: left;
}

.short {
width: 50px;
}

.category_area {
overflow: hidden;
height: auto;
}

.category_element {
float: left;
width: 310px;
height: 100px;
margin: 0px 20px 20px 0px;
border: solid 1px #666666;
overflow: hidden;
background-position: center;
background-size: cover;
}

.category_image {
float: left;
width: 120px;
height: 120px;
overflow: hidden;
margin: 10px;
background-position: center;
background-size: cover;
}

.category_title {
margin: 10px 0 5px 0;
width: 100%;
padding: 5px;
font-weight: bold;
color: #515152;
line-height: 24px;
font-size: 18px;
font-weight: 700;
}

.category_description {
width: 100%;
height: 10px;
padding: 5px;
background-color: rgba(0,0,0,0.3);
color: #ffffff;
font-size: 8px;
line-height: 10px;
}

.category_header {
height: 300px;
background-position: center center;
background-size: cover;
overflow: hidden;
}

.category_header h1 {
margin: 100px 0 0 0;
background-color: rgba(0,0,0,0.3);
border: none;
color: #ffffff;
}

.category_header .category_description {
background-color: rgba(0,0,0,0.3);
color: #ffffff;
font-size: 12px;
line-height: 20px;
height: 100px;
padding: 20px;
}

.category_view {
overflow: hidden;
height: auto;
margin-bottom: 30px;
}

.category_view h1 {
height: 170px;
padding: 50px 0 0 0;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}

.category_view h1 .title {
background-color: #ffffff;
padding: 20px;
padding: 0px 200px 0 200px;
}

.category_view .description {
min-height: 0px;
padding: 0px 200px 0 200px;
}
.category_view .title {
	padding: 0px 200px 0 200px;
}

.category_view .date {
	padding: 0px 200px 0 200px;
}
	
pre {
display: block;
padding: 20px;
margin: 0;
font-size: 12px;
font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace;
color: #fff;
background-color: #1d2020;
border-radius: 0;
line-height: 1.8;
height: auto;
overflow: hidden;
}

.currency_card {
float: left;
width: 100px;
height: 90px;
padding: 5px;
border: solid 1px #eeeeee;
border-left: solid 2px var(--color-button-blue);
margin: 5px 5px 5px 5px;
box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
overflow: hidden;
}

.currency_card .product_code {
font-sie: 12px;
font-weight: bold;
margin-right: 5px;
}

.currency_card .price {
text-align: right;
font-size: 18px;
font-weight: bold;
}

.currency_card .graph {
text-align: center;
margin: 0 auto 0 auto;
}

.blue {
color: #0077aa;
}

.red {
color: #ff4400;
}

.black {
color: #000000;
}

.clock {
text-align: center;
float: left;
margin-right: 30px;
}

.clock.active {
color: #ff0000;
font-weight: bold;
}
.clock img {
width: 50px;
height: 50px;
}

.clock.world img {
width: 150px;
height: auto;
}

.japan_map {
width: 1000px;
height: 1000px;
background-image: url('../img/map.jpg');
background-size: contain;
background-repeat: no-repeat;
}

.map_character {
position: absolute;
width: 32px;
height: 32px;
background-size: contain;
background-repeat: no-repeat;
}

.map_character img {
width: 32px;
height: 32px;
}

.map_information {
position: relative;
left: 0px;
top: 0px;
height: 400px;
}

.map_char {
width: 300px;
height: 200px;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
text-align: center;
}

.map_char img {
position: relative;
margin: 50px auto 0 auto;
width: 128px;
height: 128px;
}

.map_char_name {
margin: 10px 0 10px 0;
font-size: 24px;
font-weight: bold;
text-align: center;
}

.map_area {
position: absolute;
width: 50px;
height: 20px;
background-color: #ffffff;
border-radius: 10px;
border: solid 1px #ff0000;
text-align: center;
clear: both;
}

.data_table td.map_information_cell {
font-size: 18px;
padding: 10px 0 10px 0;
}

.splash {
font-size: 36px;
text-align: center;
margin-top: 20px;
line-height: 40px;
}

.chat_form {
float: left;
width: 590px;
}

.chat_comment {
/*
border-radius: 5px 5px 5px 5px;
box-shadow: 2px 2px 4px gray;
*/
border-bottom: solid 1px #dddddd;
margin: 10px;
padding: 10px;

height: auto;
overflow: hidden;
}

.chat_image_icon {
width: 40px;
height: 40px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
margin: 0 auto 0 auto;
}

.chat_left {
float: left;
width: 80px;
height: 100px;
text-align: center;
font-size: 10px;
margin: 0 10px 0 0;
}

.chat_right {
float: left;
width: 800px;
min-height: 100px;
}

.chat_date {
font-size: 8px;
}

.chat_new {
color: #ff0066;
font-weight: bold;
}

.chat_modify {
clear: both;
}

.chat_modify a {
margin: 0 5px 0 5px;
}

.document_filelist,
#image_filelist {
height: auto;
overflow: hidden;
}

.filelist .file_message,
#image_filelist .file_message {
text-align: center;
}

dl {
width: 350px;
}

dl dt {
clear: both;
float: left;
width: 150px;
font-weight: bold;
margin: 0 0px 0 0px;
}

dl dd {
float: left;
width: 200px;
margin: 0 0px 0 0px;
}

.minichart {
width: 100px;
height: 100px;
}

.indicator {
position: absolute;
display: none;
border-radius: 20px;
background-color: #ff6384;
color: #ffffff;
font-size: 8px;
font-weight: bold;
text-align: center;
padding: 3px 5px 3px 5px;
margin: -20px 0 0 -20px;
min-width: 20px;
}

.mark {
display: inline;
background-color: #ff6384;
color: #ffffff;
font-size: 10px;
text-align: center;
padding: 3px 5px 3px 5px;
margin: 0 2px 0 0;
}

.task_card {
float: left;
display: block;
text-align: left;
border: solid 1px #dddddd;
border-top: solid 2px var(--color-button-blue);
margin: 5px;
padding: 2px;
width: 159px;
height: 100px;
overflow: hidden;
background-color: #ffffff;
box-shadow: 2px 2px 4px gray;
color: #000000;
}
.task_card .title {
height: 42px;
overflow: hidden;
}

.holizontal_scroll {
width: 100%;
height: auto;
overflow-x: scroll;
}

.float_cell {
float: left;
width: 100px;
}

.loading {
padding: 20px 0 20px 0;
text-align: center;
}

.photo_box {
overflow: hidden;
height: auto;
padding: 10px;
margin-bottom: 10px;
border: solid 1px #cdcdcd;
background-color: #ffffff;
box-shadow: 0 0 20px #dddddd;
/* background: linear-gradient(to bottom,#FFFFFF,#FFFFFF 90%,#efefef ); */

float: left;
width: 220px;
height: 310px;
overflow: hidden;
margin: 0 10px 15px 0px;
box-sizing: border-box;

cursor: pointer;
}

.photo_box .photo {
width: 200px;
height: 200px;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
}

.photo_box .title {
font-size: 12px;
line-height: 14px;
font-weight: normal;
height: 28px;
overflow: hidden;
margin: 5px 0 5px 0;
}

.photo_box .left {
float: left;
width: 50px;
margin: 0px 0px 0px 0px;
}

.photo_box .right {
float: left;
width: 148px;
margin: 0px 0px 0px 0px;
}

.photo_box .icon {
width: 40px;
height: 40px;
border-radius: 20px;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
}

.photo_box .nickname {
font-weight: normal;
font-size: 10px;
}

.photo_box .price a {
display: block;
float: right;
font-size: 18px;
font-weight: bold;
padding: 0 0 0 25px;
margin: 0 0 10px 0;
background-image: url( "../img/icon/shopping-cart-7.png" );
background-position: left;
background-repeat: no-repeat;
background-size: 20px 20px;
color: #000000;
text-decoration: none;
}

.photo_box .comment {
float: right;
width: 30px;
height: 30px;
font-size: 12px;
font-weight: bold;
padding: 0 0 0 15px;
background-image: url( "../img/icon/message-7.png" );
background-position: top center;
background-repeat: no-repeat;
background-size: 20px 20px;
}

.photo_box .like {
float: right;
width: 30px;
height: 30px;
font-size: 12px;
font-weight: bold;
padding: 0 0 0 15px;
background-image: url( "../img/icon/heart-7.png" );
background-position: top center;
background-repeat: no-repeat;
background-size: 20px 20px;
}

.photo_box .view {
float: right;
width: 30px;
height: 30px;
font-size: 12px;
font-weight: bold;
padding: 0 0 0 15px;
background-image: url( "../img/icon/viewer-7.png" );
background-position: top center;
background-repeat: no-repeat;
background-size: 20px 20px;
}

#search {
display: none;
}

.record_count {
text-align: right;
margin: 10px 0 0 0;
}

.menubar_button {
display: none;
}


.screen_background {
display: none;
position: fixed;
background-color: #000000;
opacity: 0.5;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
z-index: 10000;
}
.progress_box {
display: none;
position: fixed;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
z-index: 10001;
}
.screen_dialog {
position: relative;
/* border: solid 3px #009fe8; */
padding: 20px;
margin: 100px auto 100px auto;
background-color: #ffffff;
max-width: 300px;
z-index: 10001;
font-size: 12px;
text-align: center;
box-shadow: 2px 2px 4px gray;
}
.progress_background {
width: 300px;
height: 20px;
/* border: solid 1px #009fe8; */
background: linear-gradient( #dddddd, #eeeeee );
margin: 30px 0 30px 0;
}
.progress_bar {
width: 100px;
height: 20px;
background: linear-gradient( var(--color-button-blue), var(--color-button-blue) );
}


.price_box {
float: left;
width: 240px;
box-shadow: 0 0 5px #dddddd;
margin: 0 5px 10px 0;
}

.price_box .title {
background-color: var(--color-button-blue);
font-size: 18px;
font-weight: bold;
text-align: center;
color: #ffffff;
padding: 10px;
}

.price_box .price {
background-color: var(--color-button-blue);
font-size: 24px;
font-weight: bold;
text-align: center;
color: #ffffff;
padding: 20px;
}

.price_box .description {
padding: 5px;
font-size: 14px;
text-align: center;
}

.price_box .note {
padding: 10px;
font-size: 12px;
text-align: left;
background-color: #eeeeee;
height: 120px;
}

.price_box .regist_button {
padding: 5px;
font-size: 18px;
font-weight: bold;
text-align: center;
color: #ffffff;
text-decoration: none;
background-color: #cc0000;
border-radius: 10px;
margin: 20px auto 20px auto;
width: 200px;
display: block;
}

.thumbnail_image {
max-width: 750px;
padding: 10px;
margin: 10px auto 30px auto;
box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.1);
border: solid 1px #eeeeee;
}
.thumbnail_image img {
max-width: 750px;
}

.upgrade {
color: #cc0000;
font-size: 18px;
font-weight: bold;
text-align: center;
margin: 40px 0 20px 0;
}

.upgrade_space {
float: left;
width: 160px;
height: 200px;
}

.upgrade_arrow {
float: left;
margin: 70px 50px 0 50px;
}

.upgrade_button_area {
width: 300px;
margin: 40px auto 100px auto;
text-align: center;
}

.upgrade_button {
display: block;
padding: 20px;
border: solid 5px #ffffff;
box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.1);
background-color: #cc0000;
color: #ffffff;
text-align: center;
font-size: 24px;
font-weight: bold;
text-decoration: none;
border-radius: 20px;
}

.downgrade_button {
display: block;
padding: 20px;
border: solid 5px #ffffff;
box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.1);
background-color: var(--color-button-blue);
color: #ffffff;
text-align: center;
font-size: 24px;
font-weight: bold;
text-decoration: none;
border-radius: 20px;
}

.display_none {
display: none;
}

a.server_icon {
text-decoration: none;
float: left;
display: block;
text-align: center;
border: solid 1px #dddddd;
margin: 0 13px 20px 0;
padding: 0px;
width: 300px;
height: 250px;
overflow: hidden;
background-color: #ffffff;
box-shadow: 2px 2px 4px lightgray;
}

.server_graph {
width: 300px;
height: 200px;
}

.server_title {
font-weight: 700;
font-size: 16px;
text-decoration: none;
color: #000000;
height: 20px;
overflow: hidden;
padding: 0px 5px 0px 5px;
box-sizing: border-box;
text-align: left;
}

.server_description {
text-decoration: none;
color: #000000;
height: 70px;
overflow: hidden;
padding: 0px 10px 5px 10px;
box-sizing: border-box;
text-align: left;
font-size: 10px;
line-height: 10px;
}

.contents_left {
float: left;
max-width: 500px;
margin: 0 20px 0 0;
}

.contents_right {
float: left;
max-width: 490px;
}

.horizontal_scroll {
width: 100%;
height: 100%;
overflow-x: scroll;
overflow-y: scroll;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
}

.keyword {
max-width: 600px;
margin: 10px auto 10px auto;
}
.web_image_icon {
float: left;
width: 100px;
height: 150px;
text-align: center;
/*border: solid 1px #dddddd;*/
font-size: 10px;
word-break: break-all;
line-height: 120%;
background-size: contain;
background-position: center;
background-repeat: no-repeat;
margin: 0px 20px 20px 0px;
}

.web_image_icon .image_link {
border: solid 1px #dddddd;
}


.zeneki_line {
display: block;
height: 27px;
margin: 0 0 0 32px;
padding: 5px 0 0 32px;
background-image: url( "../img/icons8-subway-32.png" );
background-position: left;
background-repeat: no-repeat;
font-weight: bold;
}

.zeneki_station {
display: block;
height: 27px;
margin: 0 0 0 32px;
padding: 5px 0 0 32px;
background-image: url( "../img/zeneki_station.png" );
background-position: left;
background-repeat: no-repeat;
}

.zeneki_date {
font-size: 18px;
font-weight: bold;
float: left;
margin: 0 20px 20px 0;
}

.price_list {
width: 100%;
height: 60px;
overflow: hidden;
margin: 0 0 0px 0;
}

.price_inner {
position: relative;
width: 9720px;
height: 60px;
}

.price_box {
float: left;
width: 130px;
height: 50px;
overflow: hidden;
padding: 5px;
border: solid 1px #cdcdcd;
background-color: #ffffff;
background-position: 3px 3px;
background-size: 120px;
background-repeat: no-repeat;
box-shadow: 0 0 5px #dddddd;
box-sizing: border-box;
box-shadow: 2px 2px 4px gray;
font-weight: bold;
font-size: 18px;
}

.price_background {
width: 130px;
height: 50px;
margin: 0px 0 0 0px;
background-color: rgba( 255, 255, 255, 0.8 );
}

.price_image {
margin: 4px 0px 4px 0px;
float: left;
width: 32px;
height: 32px;
background-repeat: no-repeat;
background-size: 128px;
background-image: url( "../img/bitcoin.png" );
}

.price_name {
float: left;
font-size: 10px;
width: 80px;
height: 20px;
text-align: right;
margin: 0px 0 0 0;
overflow: hidden;
}

.price_text {
float: left;
font-size: 14px;
font-weight: bold;
width: 80px;
height: 20px;
text-align: right;
margin: 0px 0 0 0;
overflow: hidden;
}

.price_image.BTC {  background-position: 0px 0px;   }
.price_image.ETH { background-position: -32px 0px; }
.price_image.XRP { background-position: -64px 0px; }
.price_image.BCH { background-position: -96px 0px; }
.price_image.LTC { background-position: 0px -32px; }
.price_image.XEM { background-position: -32px -32px; }
.price_image.ETC { background-position: -64px -32px; }
.price_image.MONA { background-position: -96px -32px; }
.price_image.XLM { background-position: 0px -64px; }
.price_image.BAT { background-position: -32px -64px; }
.price_image.QTUM { background-position: -64px -64px; }
.price_image.XTZ { background-position: -96px -64px; }
.price_image.LSK { background-position: 0px -96px; }
.price_image.FCT { background-position: -32px -96px; }
.price_image.IOST { background-position: -64px -96px; }
.price_image.ENJ { background-position: -96px -96px; }
.price_image.OMG { background-position: -64px -256px; }
.price_image.TRX { background-position: -64px -160px; }
.price_image.BNB { background-position: 0px -128px; }
.price_image.ADA { background-position: -32px -128px; }
.price_image.DOT { background-position: -64px -128px; }
.price_image.LINK { background-position: -96px -128px; }
.price_image.BSV { background-position: 0px -160px; }
.price_image.EOS { background-position: -32px -160px; }
.price_image.XMR { background-position: -96px -160px; }
.price_image.THETA { background-position: 0px -192px; }
.price_image.ATOM { background-position: -32px -192px; }
.price_image.CHZ { background-position: -96px -256px; }
.price_image.DASH { background-position: -64px -192px; }
.price_image.ZEC { background-position: -96px -192px; }
.price_image.BTG { background-position: 0px -224px; }
.price_image.BTS { background-position: -32px -224px; }
.price_image.ADK { background-position: -64px -224px; }
.price_image.DOGE { background-position: -96px -224px; }
.price_image.USDT { background-position: -32px -256px; }
.price_image.WBTC { background-position: 0px -256px; }


.price_image.AUDCHF { background-image: url(../img/AUDCHF.png); background-size: 32px 32px; }
.price_image.AUDJPY { background-image: url(../img/AUDJPY.png); background-size: 32px 32px; }
.price_image.AUDNZD { background-image: url(../img/AUDNZD.png); background-size: 32px 32px; }
.price_image.AUDUSD { background-image: url(../img/AUDUSD.png); background-size: 32px 32px; }
.price_image.CADJPY { background-image: url(../img/CADJPY.png); background-size: 32px 32px; }
.price_image.CHFJPY { background-image: url(../img/CHFJPY.png); background-size: 32px 32px; }
.price_image.EURAUD { background-image: url(../img/EURAUD.png); background-size: 32px 32px; }
.price_image.EURCAD { background-image: url(../img/EURCAD.png); background-size: 32px 32px; }
.price_image.EURCHF { background-image: url(../img/EURCHF.png); background-size: 32px 32px; }
.price_image.EURGBP { background-image: url(../img/EURGBP.png); background-size: 32px 32px; }
.price_image.EURJPY { background-image: url(../img/EURJPY.png); background-size: 32px 32px; }
.price_image.EURNZD { background-image: url(../img/EURNZD.png); background-size: 32px 32px; }
.price_image.EURUSD { background-image: url(../img/EURUSD.png); background-size: 32px 32px; }
.price_image.GBPAUD { background-image: url(../img/GBPAUD.png); background-size: 32px 32px; }
.price_image.GBPCHF { background-image: url(../img/GBPCHF.png); background-size: 32px 32px; }
.price_image.GBPJPY { background-image: url(../img/GBPJPY.png); background-size: 32px 32px; }
.price_image.GBPNZD { background-image: url(../img/GBPNZD.png); background-size: 32px 32px; }
.price_image.GBPUSD { background-image: url(../img/GBPUSD.png); background-size: 32px 32px; }
.price_image.NZDJPY { background-image: url(../img/NZDJPY.png); background-size: 32px 32px; }
.price_image.NZDUSD { background-image: url(../img/NZDUSD.png); background-size: 32px 32px; }
.price_image.USDCAD { background-image: url(../img/USDCAD.png); background-size: 32px 32px; }
.price_image.USDCHF { background-image: url(../img/USDCHF.png); background-size: 32px 32px; }
.price_image.USDJPY { background-image: url(../img/USDJPY.png); background-size: 32px 32px; }
.price_image.ZARJPY { background-image: url(../img/ZARJPY.png); background-size: 32px 32px; }

.screen_base {
background: #ffffff;
border: solid 1px #aaaaaa;
height: auto;
overflow: hidden;
padding: 10px 30px 10px 30px;
min-height: 1080px;
}

.screen_speak_base {
background: #ffffff;
border: solid 1px #aaaaaa;
height: auto;
overflow: hidden;
padding: 0px;
min-height: 1080px;
}


.screen_icon {
width: 60px;
height: 60px;
}

.screen_title {
float: left;
font-size: 72px;
font-weight: bold;
line-height: 72px;
min-height: 80px;
max-height: 144px;
overflow: hidden;
}

.screen_speak_title {
position: absolute;
left: 0px;
top: 0px;
width: 100%;
background: rgba( 0, 0, 0, 0.7 );
color: #ffffff;
font-size: 72px;
font-weight: bold;
line-height: 72px;
min-height: 80px;
max-height: 144px;
overflow: hidden;
padding: 10px;
}

.screen_price {
float: right;
font-size: 72px;
font-weight: bold;
line-height: 72px;
height: 80px;
overflow: hidden;
}

.screen_image {
margin: 5px auto 10px auto;
max-width: 980px;
height: auto;
border: solid 10px #ffffff;
}

.screen_news_image {
float: left;
width: 650px;
height: 400px;
margin: 20px 0 0 0;
}

.screen_speak_image {
position: absolute;
left: 0px;
top: 0px;
width: 1920px;
max-height: 1080px;
overflow: hidden;
margin: 0px 0 0 0;
}

.screen_speak_image img {

width: 1920px;
margin: 0 auto 0 auto;
}

.screen_date {
float: left;
width: 840px;
text-align: right;
font-size: 24px;
font-weight: bold;
margin: 10px 0 0 10px;
}
.screen_description {
float: left;
font-size: 24px;
line-height: 30px;
width: 840px;
height: 700px;
margin: 10px 0 0 10px;
}

.screen_over {
width: 1920px;
height: 1080px;
position: absolute;
top: 0px;
left: 0px;
background: #000000;
}

#screen_char1 {
position: absolute;
left: 50px;
top: 590px;
width: 488px;
height: 430px;
background-image: url( "../img/m2.png" );
}

#screen_char2 {
position: absolute;
left: 1428px;
top: 640px;
width: 442px;
height: 376px;
background-image: url( "../img/d2.png" );
}

#screen_speak {
display: none;
}

.screen_base .main_image {
position: absolute;
left: 100px;
top: 0px;
width: 1000px;
height: 1000px;
background-repeat: no-repat;
background-position: center;
background-size: cover;
}
.screen_base .maker {
position: absolute;
left: 0px;
top: 0px;
width: 1870px;
height: 72px;
padding: 20px 50px 0 0;
overflow: hidden;
text-align: right;
font-size: 72px;
font-weight: bold;
border: solid 1px #000000;
color: #000000;
}
.screen_base .product {
position: absolute;
left: 0px;
top: 100px;
width: 1870px;
height: 200px;
padding: 50px 100px 0 0;
overflow: hidden;
text-align: right;
font-size: 144px;
font-weight: 900;
border: solid 1px #000000;
color: #000000;
vertical-align: baseline;
}
.screen_base .fullname {
position: absolute;
left: 0px;
top: 250px;
width: 1870px;
height: 72px;
padding: 20px 50px 0 0;
overflow: hidden;
text-align: right;
font-size: 72px;
font-weight: bold;
border: solid 1px #000000;
color: #000000;
}
.screen_base .hashlate {
position: absolute;
left: 0px;
top: 350px;
width: 1870px;
height: 72px;
padding: 20px 50px 0 0;
overflow: hidden;
text-align: right;
font-size: 72px;
font-weight: bold;
border: solid 1px #000000;
color: #000000;
}
.screen_base .power {
position: absolute;
left: 0px;
top: 450px;
width: 1870px;
height: 72px;
padding: 20px 50px 0 0;
overflow: hidden;
text-align: right;
font-size: 72px;
font-weight: bold;
border: solid 1px #000000;
color: #000000;
}

.normal_text {
font-size: 18px;
line-height: 32px;
margin-bottom: 40px;
}

.trade_graph {
background: linear-gradient(90deg, #ffdd00, #ffaa00 );
}

.trade_coin {
font-weight: bold;
font-size: 14px;
padding: 5px;
text-align: center;
}

.banner_slide {
height: 165px;
overflow: hidden;
margin: 0px 0 10px 0;
}

.banner {
	float: left;
	margin: 10px 5px 5px 5px;
}
.banner img {
	max-width: 1200px;
	width: 100%;
	height: auto;
	box-shadow: 2px 2px 2px var(--color-category);
}
.banner img:hover {
	opacity: 0.5 ;
}

.banner-2_pc {
	background-color:#cccccc;
	text-align:center;
	width: 1200px;
	margin: auto;
}
.banner-2_pc img {
	width: 80%;
	margin: 30px 30px 30px 30px;
}
.banner-2_pc img:hover {
	opacity: 0.5 ;
}

.banner-2_sp {
	float: left;
	margin: 10px 5px 5px 5px;
}
.banner-2_sp img {
	max-width: 1200px;
	width: 100%;
	height: auto;
	box-shadow: 2px 2px 2px var(--color-category);
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.banner-2_pc { display: block !important; }
.banner-2_sp { display: none !important; }
 
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
    .banner-2_pc { display: none !important; }
    .banner-2_sp { display: block !important; }
}

.chat_room {
width: 100%;
height: 700px;
border: solid 1px #000000;
background: #666666;
}

.chat_room .message {
background: rgba(255, 255, 255, 0.5);
border: solid 1px #ffffff;
border-radius: 10px;
box-shadow: 2px 2px 4px white;
width: 300px;
height: 600px;
float: right;
margin: 10px 10px 10px 10px;
}

.profile_header {
width: 100%;
height: 400px;
overflow: hidden;
background-size: cover;
background-position: center center;
background-repeat: no-repat;
background-color: var(--color-darkgray);
padding: 0 0 20px 0;
}

.profile_header .profile_information {
    margin: 250px 0 0 0;
	padding: 0 200px 0 200px;
    height: auto;
    overflow: hidden;
    background-color: rgba( 0, 0, 0, 0.5);
}


.profile_header .icon_frame {
float: left;
width: 200px;
margin: 20px 0 0 20px;
text-align: center;
}

.profile_header .icon_frame .icon {
width: 100px;
height: 100px;
border: solid 3px #ffffff;
box-shadow: 2px 2px 4px gray;
margin: 0 auto 0 auto;
background-size: cover;
background-position: center center;
background-repeat: no-repat;
background-color: #dddddd;
}

.profile_header .icon_frame .nickname {
width: 200px;
height: 100px;
text-align: center;
font-size: 12px;
font-weight: bold;
color: #ffffff;
}

.profile_header .information {
float: left;
height: 400px;
width: 750px;
}

.profile_header .information .subtitle {
    margin: 10px 0 0 0;
    font-size: 12px;
    line-height: 20px;
color: #ffffff;
}

.profile_header .information .title {
    font-size: 32px;
    font-weight: 700;
    line-height: 48px;
    color: #ffffff;
    text-shadow: 2px 2px 4px #ffffff;
}

.profile_header .information .catch_copy {
    font-size: 14px;
    line-height: 20px;
    color: #ffffff;	
    height: 60px;
overflow: hidden;
}

.profile_message {
    margin: 10px 20px 40px 20px;
    font-size: 14px;
    line-height: 24px;
}

.skill_list {
    height: 300px;
    width: 300px;
    overflow-x: hidden;
    overflow-y: scroll;
}

.skill_element {
display: inline-block;
    border: solid 1px var(--color-black);
background: var(--color-black);
border-radius: 2px;
color: #ffffff;
font-size: 10px;
padding: 2px 5px 2px 5px;
margin: 0 5px 5px 0;
font-weight: bold;
}

#potensail-chart {
    float: left;
    width: 220px;
}
#active-chart {
    float: left;
    width: 220px;
}

form {
	display:table;
	margin: 0px auto 20px auto;
	height: auto;
	overflow: hidden;
	clear: both;
	max-width: 1195px;
	width: 100%;
	background-color: #ffffff;
	box-sizing: border-box;

	border: solid 1px var(--color-order-border);
	border-radius: 8px;
}

form.noshadow {
box-shadow: none;
border-left: none;
}

form table {
border-left: none;
border-top: none;
min-width: 970px;
width: 100%;
border-collapse: collapse;
box-sizing: border-box;
}

form table tr {
border-top: solid 1px #eeeeee;
}

.calender_controller form {
padding: 0px 5px 0px 0px;
border-left: none;
background-color: none;
box-sizing: border-box;
box-shadow: none;
background-color: #eeeeee;
}

.input_field table {
min-width: 500px;
}

/* 一覧表示のタイトル */
.list_title {
}

/* 一覧表示の内容 */f
.list_data {
position: relative;
}

.border_all {
border: solid 1px #eeeeee;
}

.border_right {
border-right: solid 1px #eeeeee;
}

/* 入力フォームのテーブル */
.input_form {
table-layout: auto;
border-collapse: collapse;
border-spacing: 0px;
margin-left: 0px;
margin-top: 10px;
margin-bottom: 20px;
vertical-align: top;
min-width: 1000px;
}

/* 入力フォームのタイトル */
.input_item {
clear: both;
float: left;

display: table-cell;
font-size: 14px;

text-align: left;
vertical-align: top;

color: #000000;
/* background-color: var(--color-button-blue); */

/*width: 150px;*/
width: 20%;

height: auto;
overflow: hidden;

padding: 5px;
box-sizing: border-box;
}

.input_item table, .input_item table td {
border: none;
}

.input_item, .input_field {
	display: inline-block;
	border: none;
	min-height: 31px;
}

.item_name {
	display: inline;

	font-size: 12px;
	font-weight: bold;

	vertical-align: center;
	text-align: left;
	color: #000000;
	width: 25%;
}

.input_field {
	float: left;
	font-size: 12px;
	font-weight: none;

	display: table-cell;
	vertical-align: center;

	color: #333333;
	max-width: 950px;
	min-width: 75%;
	width: 80%;

	padding: 5px;

	height: auto;
	overflow: hidden;
	box-sizing: border-box;

}

.input_field_wide {
width: 100%;
}

.require_mark {
display: inline;

font-size: 10px;
color: #cc0000;
color: #cc0000;
font-weight: bold;

width: 20px;
margin-left: 5px;
}

/*
.form_title {
font-size: 12px;
font-weight: bold;
line-height: 125%;
text-align: left;
vertical-align: bottom;

padding-top: 8px;

margin-bottom: 2px;

color: #0055aa;

width: 508px;
height: 22px;

border: none;
border-width: 1px;
}
*/

.form_description {
	font-size: 14px;
	line-height: 20px;
	margin: 10px 250px 10px 0px;
}

.form_return_link {
	text-align: right;
	font-size: 10px;
	width: 100%;
	height: auto;
	clear: both;
	overflow: none;
	padding-right: 0px;
	box-sizing: border-box;
	margin: -40px 0 58px 0;
}

.field_description {
	font-size: 12px;
}

/* ラジオボタン・チェックボックスの選択肢 */
.select_branch {
font-size: 12px;
}

.form_title_field {
	clear: both;
	border: none;

	background-color: var(--color-order-background);
	border-bottom: solid 1px var(--color-order-border);

	color: var(--color-black);

	text-align: left;
	font-size: 12px;
	font-weight: bold;
	padding: 10px;
	box-sizing: border-box;
	width: 100%;
}

.form_section_field {
clear: both;
border: none;


text-align: left;
font-size: 12px;
font-weight: bold;
padding: 10px;

width: 100%;

color: var(--color-black);

box-sizing: border-box;
border: solid 1px var(--color-order-border);
border-radius: 0px 0px 0px 0px;
background-color: var(--color-order-background);

}


.form_submit_field {
clear: both;

height: auto;
overflow: hidden;

color:  var(--color-white);
background-color: #bbb9b9;
text-align: right;
padding: 5px 10px 5px 10px;

border: none;

/*
border-top: solid 1px #aaaaaa;
border-bottom: solid 1px #aaaaaa;
border-left: solid 1px #aaaaaa;
border-right: solid 1px #aaaaaa;
*/
}

.main_contents .blog_right .form_submit_field {
	text-align: center;
}

.main_contents .blog_right .form_submit_field input[type=button] {
	display: inline-block;
	float: none;
}

.form_complete_field {
text-align: center;
vertical-align: center;
padding: 5px;
padding-top: 20px;
line-height: 20px;

border-bottom: solid 1px #aaaaaa;

width: 480px;
height: 200px;

font-size: 12px;
}

.input_form_link {
padding-left: 30px;
font-size: 12px;
}

.icon {
border: 0px;
}

.icon_link {
font-size: 12px;
}

.error_form {
border-collapse: collapse;

margin-left: 100px;
margin-top: 20px;
margin-bottom: 20px;

width: 462px;

border: solid 1px #cc0000;
}

.error_title {
background-color: #ff0000;
color: #ffffff;
font-size: 12px;
font-weight: bold;
padding: 5px;
text-align: left;

width: 427px;
padding-top: 8px;
padding-left: 30px;

background-image: url( "./image/error.gif" );
background-repeat: no-repeat;
background-position: left;
}

.error_contents {
background-color: #ffffff;
color: #ff0000;

font-size: 12px;
padding: 5px;
padding-top: 25px;
padding-bottom: 40px;

text-align: center;

width: 450px;
}

.error_message {
color: #ff0000;
font-size: 12px;
font-weight: normal;

}

.delete_flag {
font-size: 10px;
color: #FF0000;
font-weight: normal;
}

.errorMessage {
margin-top: 0px;
margin-bottom: 0px;
color: #ff0000;
font-weight: bold;
font-size: 12px;
}

.error {
margin-top: 0px;
margin-left: 0px;
margin-bottom: 0px;
color: #cc0000;
color: #cc0000;
font-weight: bold;
font-size: 12px;
}

div#mceu_18.mce-tinymce.mce-container.mce-panel {
border: solid 3px #aaaaaa;
width: 99%;
}

.code {
border: solid;
border-color: #666666;
border-width: 1px;
background-color: #ffffee;
color: #333333;
padding: 5px;
margin: 5px;
margin-left: 20px;
width: 750px;
overflow: auto;
font-size: 10px;
line-height: 16px;
}

.command {
border: solid;
border-color: #666666;
border-width: 1px;
background-color: #0066aa;
color: #eeeeee;
padding: 5px;
margin: 5px;
margin-left: 20px;
width: 750px;
overflow: auto;
font-size: 10px;
line-height: 16px;
}

.file {
border: solid 1px #000000;
background-color: #eeeeee;

color: #333333;
padding: 5px;
margin: 5px;
margin-left: 20px;

width: 750px;
overflow: auto;
font-size: 10px;
line-height: 16px;
}

/* 検索該当キーワード */
strong {
font-weight: bold;
}

textarea {
font-size: 12px;
}

input {
font-size: 12px;
}

a.link_command,
a.short_link_command,
.form_return_link a,
a.mini_link_command,
input[type=submit],
input[type=button],
input[type=reset],
.input_button {
	display: block;
	float: right;
	width: 240px;
	margin: 3px 0px 3px 0px;
	padding: 8px 0 8px 0;
	background-color: #5b4523;
	color: var(--color-white);
	border-radius: 15px;
	box-shadow: 0px 0px 3px var(--color-background);
	text-align: center;
	font-size: 12px;
	cursor: pointer;
	border: none;
}

a.mini_link_command {
float: left;
width: 30px;
padding: 2px;
font-size: 10px;
margin: 3px 2px 5px 2px;
}

.calender_controller a.link_command,
.calender_controller a.short_link_command,
.calender_controller .form_return_link a,
.calender_controller input[type=submit],
.calender_controller input[type=button],
.calender_controller .input_button {
box-shadow: none;
margin: 0px;
}

a.link_command:hover,
a.short_link_command:hover,
.form_return_link a:hover,
input[type=submit]:hover,
.input_button:hover {
/*
background-color: var(--color-button-blue);
color: #ffffff;
*/
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
}

a.short_link_command {
width: 40px;
font-size: 10px;
padding: 5px;
}

a.delete, input.delete_button {
background-color: #cc0000;
color: #ffffff;
font-weight: bold;
}

a:hover.delete, input.delete_button:hover {
background-color: #e21522;
}

input.gray_button {
background-color: #dddddd;
color: #333333;
}

input.gray_button:hover {
background-color: #666666;
color: #ffde00;
}

.entry_button {
width: 155px;
height: 34px;
background-image: url( "../img/entry.gif" );
background-repeat: no-repeat;
background-position: left top;
}

/*
.login_button {
width: 155px;
height: 34px;
background-image: url( "../img/login.gif" );
background-repeat: no-repeat;
background-position: left top;
}
*/

.border_table {
min-width: 100%;
border-collapse: collapse;
border-spacing: 0px;
border-top: solid 1px #dddddd;
border-left: solid 1px #dddddd;
}

.border_table td {
font-size: 12px;
font-weight: normal;

padding: 0px;

empty-cells: show;

border-right: solid 1px #dddddd;
border-bottom: solid 1px #dddddd;
padding: 3px;
}

.data_table {
	clear: both;
	border: solid 1px var(--color-order-border);
	border-bottom: none;
	border-radius: 8px;
	margin: 0px 0px 0px 0px;
	border-spacing: 0px;
	width: 100%;
}

.data_table tr {
border-top: solid 1px #eeeeee;
}

.data_table tr.first {
border-top: solid 1px #dddddd;
}

.data_table td {
	font-size: 12px;
	font-weight: normal;

	padding: 0px;

	empty-cells: show;

	__border-right: solid 1px #eeeeee;

	vertical-align: middle;
	border-bottom: solid 1px var(--color-order-border);
}

.second_line {
	background-color: var(--color-table-background);
}

.data_table th {
	font-weight: normal;
	background-color: var(--color-order-background);
	border-bottom: solid 1px var(--color-order-border);
	padding: 20px 20px 20px 20px;
}

.data_table th[colspan] {
	border-bottom: none;
}

.data_table td[colspan] {
	border-bottom: none;
}


.data_value {

	color: #333333;
	overflow: hidden;
	height: auto;
	display: block;
	padding: 10px;
	margin-right:10px ;
}

.data_table td:has(.data_value.highlight)  {
	background-color: var(--color-high-light);
	height: 100%;
}

.data_link {
background-color: #ffffff;
color: #333333;
margin-right:10px ;
}

.bg_orange {
background-color: #ffaa00;
}

.bg_green {
background-color: #80c269;
}

.bg_red {
background-color: #aa0000;
}



.border_red {
border: solid 1px #ff0000;
}

.data_link a, .data_link .block {
display: block;
padding: 10px;
text-decoration: none;
color: var(--color-green);
}

.data_link a:hover {
background-color: #eeeeee;
}

.data_command a {
/* 親の領域一杯に表示する */
/*
position: absolute;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
*/

display: block;
padding: 10px;
margin: 0 auto 0 auto;
color: var(--color-button-blue);
background-color: #ffffff;
text-align: center;
font-weight: normal;
font-size: 12px;
text-decoration: underline;
}

.data_command a:hover {

}

.data_command .no_link {
/* 親の領域一杯に表示する */
/*
position: absolute;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
*/

display: block;
padding: 10px;
margin: 0 auto 0 auto;
text-decoration: none;
background-color: #dedede;
color: #000000;
text-align: center;
}


.data_command {
/* padding: 5px;
border: solid 1px #ffffff;

*/
color: #ffffff;
font-size: 10px;
font-weight: bold;
overflow: hidden;
}
.data_command.green {
background-color: #00bb00;
}
.data_command.orange {
background-color: #e46a07;
}
.data_command.pink {
background-color: #e60051;
}
.data_command.gray {
background-color: #666666;
}




.data_command a.delete {
display: block;
overflow: hidden;
height: auto;
color: #cc0000;
background-color: #ffffff;
text-align: center;
}

.data_command a:hover.delete {
}

.data_display {
/*
position: absolute;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
*/

display: inline;
text-align: center;
padding: 10px;
font-size: 10px;
background-color: #5bd999;
color: #ffffff;
border-radius: 20px;
}

.data_hidden {
/*
text-align: center;
padding: 10px;
background-color: #dddddd;
color: #666666;
*/
display: inline;
text-align: center;
padding: 10px;
font-size: 10px;
background-color: #dddddd;
color: #666666;
border-radius: 20px;
}

input[type="text"],
input[type="password"],
input[type="file"],
textarea,
select
{
-webkit-appearance: none;
font-size: 12px;
padding: 0.65em 0.75em;
/* border-radius: 0.5em; */
border-radius: 0px;
line-height: 1.35em;
border: solid 2px rgba(185,186,187,0.5);
margin: 2px 2px 2px 2px;
}

select {
background: linear-gradient(#ffffff, #eeeeee);
}

/*
input[type="radio"] {
-webkit-appearance: none;
border-radius: 10px;
border: solid 2px rgba(185,186,187,0.5);
width: 15px;
height: 15px;
background-color: #ffffff;
vertical-align: middle;
}
*/

/* 
input[type="checkbox"] {
border-radius: 0.5em;
-webkit-appearance: none;
border: solid 2px rgba(185,186,187,0.5);
width: 15px;
height: 15px;
background-color: #ffffff;
vertical-align: middle;
width: 30px;
height 15px;
background-image: url( "../img/checkbox_off.png" );
}
*/

/*
input[type="checkbox"]:checked {
width: 30px;
height 15px;
background-image: url( "../img/checkbox_on.png" );
}
*/

input[type="checkbox"]:checked,
input[type="radio"]:checked {
	__background-color: var(--color-button-blue);
}

.entry_title {
font-weight: bold;
font-size: 24px;
line-height: 32px;
margin: 10px 0 10px 0;
}

input[type="text"].entry_title {
width: 600px;
font-weight: bold;
font-size: 18px;
}

.entry_editor {
width: 100%;
padding: 5px 0px 5px 0px;
}

.entry_map_digree {
float: left;
}

.text_view {
font-size: 12px;
line-height: 160%;
padding: 12px;
min-height: 320px;
box-sizing: border-box;
}

.text_view img {
max-width: 600px;
height: auto;
}

.dialog_title {
margin: 50px auto 0px auto;
padding: 8px 10px 8px 10px;

width: auto;
max-width: 380px;


border-radius: 8px 8px 0px 0px;

border: solid 1px var(--color-order-border);

background-color: var(--color-order-background);

color: var(--color-black);

font-size: 12px;
font-weight: bold;
text-align: left;

}

.main_contents .document_contain_formcomplete {
	background-color: var(--color-white);
	margin: 0 0 0px 0;
	/*padding: 0 200px 20px 200px;*/
}

.main_contents .document_contain_formcomplete .dialog_title {
	margin: 50px auto 0px auto;
	padding: 8px 20px 8px 10px;
	
	width: auto;
	max-width: 380px;
	
	
	border-radius: 8px 8px 0px 0px;
	
	border: solid 1px var(--color-order-border);
	
	background-color: var(--color-order-background);
	
	color: var(--color-black);
	
	font-size: 12px;
	font-weight: bold;
	text-align: left;
	
	}

.document_contain_formcomplete .dialog_body, .system_dialog {
	margin: 0px auto 50px auto;
	padding: 20px 10px 50px 20px;
	
	width: auto;
	max-width: 380px;
	
	background-color: #ffffff;
	color: #333333;
	
	border: solid 1px var(--color-order-border);
	border-top: none;
	
	font-size: 12px;
	text-align: left;
	
	border-radius: 0px 0px 8px 8px;
	
	}

.dialog_body, .system_dialog {
margin: 0px auto 50px auto;
padding: 20px 10px 50px 10px;

width: auto;
max-width: 380px;

background-color: #ffffff;
color: #333333;

border: solid 1px var(--color-order-border);
border-top: none;

font-size: 12px;
text-align: center;

border-radius: 0px 0px 8px 8px;

}

.pagenator {
clear: both;
list-style-type: none;
padding-left: 0px;
margin: 5px 5px 5px 0px;
}

.pagenator .page {
display: block;
float: left;
margin: 0 5px 0 0;
padding: 5px;
text-decoration: none;
width: 30px;
text-align: center;
color: var(--color-black);
font-size: 12px;
overflow: hidden;
border: solid 1px var(--color-order-border);
border-radius: 8px;
}

.pagenator .current_page {
display: block;
float: left;

width: 30px;

margin: 0 5px 0 0;
padding: 5px;

border: solid 1px var(--color-order-border);
border-radius: 8px;

color: var(--color-green);
background-color: var(--color-selected-background);

text-decoration: none;
text-align: center;
font-weight: bold;
font-size: 12px;
}

.pagenator a {
display: block;
float: left;
margin: -5px;
padding: 5px;
text-decoration: none;
width: 30px;
text-align: center;
color: #eeeeee;
font-size: 12px;
}

.pagenator a:hover {
background-color: #eeeeee;
}


.no_entry {
padding: 50px 20px 50px 20px;
text-align: center;
}

.image_icon {
display: block;
width: 80px;
height: 80px;
text-align: center;
/*border: solid 1px #dddddd;*/
font-size: 10px;
word-break: break-all;
line-height: 120%;
background-size: contain;
background-position: center;
background-repeat: no-repeat;
margin: 0px auto 0px auto;
}

.image_link {
display: block;
width: 100px;
height: 100px;
margin: 5px auto;
background-size: cover;
background-position: center;
}

input.short {
display: inline;
width: 100px;
}

#date_select {
float: left;
padding: 0 10px 0 0;
}

.option_selector {
min-height: 36px;
padding: 6px;
border: solid 2px #dddddd;
}

.option_selector.active {
border: solid 2px #7fadf8;
}

.option_selector .item {
display: inline-block;
padding: 4px;
border: solid 1px #dddddd;
background: #eeeeee;
color: #333333;
border-radius: 8px;
margin: 0 4px 0 0;
}

.option_selector .item a {
display: inline-block;
text-align: center;
vertical-align: middle;
padding: 0px 6px 0px 6px;
background: #666666;
color: #ffffff;
text-decoration: none;
border-radius: 12px;
margin: 0 0 0 4px;
}

.select_list_window {
display: none;
position: fixed;
right: 50px;
top: 50px;
width: 300px;
height: 400px;
overflow: hidden;
border: solid 1px #dddddd;
box-shadow: 2px 2px 4px gray;
background: #ffffff;
}

.select_list_window .select_list_title {
background: var(--color-button-blue);
color: #ffffff;
padding: 2px;
font-size: 12px;
height: 24px;
}
.select_list_window .select_list_title .close_button {
background: #cc0000;
color: #ffffff;
text-decoration: none;
float: right;
width: 20px;
height: 20px;
text-align :center;
border-radius: 2px;
font-weight: bold;
}

.select_list {
width: 300px;
height: 330px;
overflow-x: hidden;
overflow-y: scroll;
padding: 5px;
box-sizing: border-box;
}

.select_list .item {
display: inline-block;
padding: 4px;
border: solid 1px #dddddd;
background: #eeeeee;
color: #333333;
border-radius: 8px;
margin: 0 4px 4px 0;
cursor: pointer;
}

.keyvisual {
	width: 100%;
	height: 450px;
	padding: 0px;
	margin: 0px auto 0px auto;
}

.keyvisual ul {
	padding: 0px 0px 0px 0px;
	max-width: 1500px;
	height: 100%;
	list-style: none;
	margin: 0px auto 0px auto;
	list-style-type: none;
	overflow: hidden;
	
}

.keyvisual ul li {
	position: relative;
	z-index: -1;
	top: 0px;
	width: 1500px;
	height: 100%;
	background-position: 0px -150px ;
	background-repeat: no-repeat;
	background-size: cover;
	float: left;
}

.keyvisual ul li:after {
	content: '';
	position: absolute;
	top: 250px;
	left: 0;
	width: 100%;
	height: 350px;
	margin: 0 auto 0 auto;
	background-image: linear-gradient(180deg, transparent 0, var(--color-background) 100%);
}

.keyvisual .title {
	font-size: 48px;
	font-weight: bold;
	color: var(--color-white);
	text-shadow: 5px 5px 10px var(--color-gray);
	margin: 50px 0 0 50px;
	border-radius: 20px;
}

.keyvisual .subtitle {
	font-size: 18px;
	color: var(--color-white);
	text-shadow: 5px 5px 10px var(--color-gray);
	line-height: 32px;
	margin: 30px 0 0 50px;
	border-radius: 20px;
	width: 500px;
}

.card_for-pc { display:block; }
.card_for-sp { display:none; }

@media only screen and (max-width : 600px){
  .card_for-pc { display:none; }
  .card_for-sp { display:block; }
}

.keyvisual .card_for-pc {
	background-color: rgba(187, 192, 195, 0.6);
	padding: 20px 20px 20px 20px;
	border-radius: 10px;
	width: 750px;
	overflow: hidden;
}

.keyvisual #slide0 .card_for-pc {
	float: right;
	margin: 0 20px 0 800px;
	width: 600px;
	transform: scale;
}

.keyvisual #slide0 .title {
	margin: 10px 0 10px 50px;
	font-size:25pt;
}

.keyvisual #slide0 .subtitle {
	margin: 0 0 0 50px;
	line-height: 20px;
	font-size:12pt;
}

.keyvisual #slide1 .card_for-pc {
	margin: 0 20px 0 80px;
}

.keyvisual #slide1 .title {
	margin: 40px 0 5px 50px;
	line-height: 5px;
	width: 700px;
	font-size:25pt;	
}

.keyvisual #slide1 .subtitle {
	margin: 40px 0 0 50px;
	width: 700px;
	line-height: 20px;
}

.keyvisual #slide2 .card_for-pc {
	margin: 0 0 0 80px;
}

.keyvisual #slide2 .title {
	margin: 15px 0 15px 50px;
	font-size:25pt;	
}

.keyvisual #slide2 .subtitle {
	margin: 25px 0 0 50px;
	width: 700px;
	line-height: 20px;
}

.slide_button_area {
	position: absolute;
	width: 100%;
	height:450px;
	top: 99px;
}

.slide_button_inner {
	width: 1500px;
	height: 100%;
	margin: 0 auto 0 auto;	
}

a.slide_left_button {
	display: block;
	float: left;
	width: 80px;
	height: 100%;
	font-size: 32px;
	text-align: center;
	padding: 225px 0 0 0;
	color: var(--color-black);
	text-decoration: none;
	box-sizing: border-box;
	border-radius: 2px;
	text-shadow: 1px 1px 2px var(--color-white);
}

a.slide_left_button:hover {
	color: var(--color-white);
	background:rgba( 0, 0, 0, 0.5 )
}

a.slide_right_button {
	display: block;
	float: right;
	width: 80px;
	height: 100%;
	font-size: 32px;
	text-align: center;
	padding: 225px 0 0 0;
	color: var(--color-black);
	text-decoration: none;
	box-sizing: border-box;
	border-radius: 2px;
	text-shadow: 1px 1px 2px var(--color-white);
}

a.slide_right_button:hover {
	color: var(--color-white);
	background:rgba( 0, 0, 0, 0.5 )
}

.slide_link {
	position: absolute;
	text-align: center;
	width: 100%;
	top: 100%;
	font-size: 18px;
}

.slide_link a {
	color: #A6ABBD;
	text-shadow: 1px 1px 2px var(--color-black);
	text-decoration: none;
}

.top_list {
	z-index: 100;
	width: 100%;
	height: auto;
	overflow: hidden;
	margin: 0px auto 0px auto;
	padding: 0px 0px 0px 0px;
}

.top_list_inner {
	position: relative;
	min-height: 1200px;
	height: auto;
	overflow: hidden;
	max-width: 1480px;
	margin: 0px auto 20px auto;
	background-color: #f6e1e1;
	border-radius: 2px 2px 0 0;
	padding: 0 0 0 280px;
}


.main_contents .product_list {
	overflow: hidden;
	width: 100%;
                margin: 0 auto;
}

.main_contents .product_list_scroll {
	width: auto;
	height: 270px;
	overflow: hidden;
}

.main_contents .product_list .product_card {
	float: left;
	border: solid 1px var(--color-border);
	border-radius: 2px;
	width: 152px;
	height: 260px;
	margin: 0 4px 4px 4px;
	overflow: hidden;
	background-color: #ffffff;
	line-height: 110%;
	padding: 3px 3px 3px 3px;
}

.main_contents .product_list .product_card:hover {
	border: solid 1px var(--color-active);
}

.main_contents .product_list .product_card .product_title {
	color: #000000;
	font-size: 12px;
	height:32px;
	overflow: hidden;
}

.main_contents .product_list .product_card .product_category {
	color: #ffffff;
	font-size: 11px;
	background: var(--color-darkgray);
	display: inline-block;
	border-radius: 2px;
	padding: 2px;
}

.main_contents .product_list .product_card .product_image_area {
	border-bottom: solid 1px var(--color-border);
	background-color: var(--color-border);
	margin: 0 0 3px 0;
}

.main_contents .product_list .product_card .product_image {
	width: 140px;
	height: 140px;
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
	margin: 5px 5px 5px 5px;
}

.main_contents .product_list .product_card .product_price {
	color: var(--color-price);
	font-size: 12px;
	text-align: right;
}

.main_contents .product_list .product_card .product_price span {
	font-size: 16px;
}

.main_contents .product_list .product_card .product_price .management_fee {
	font-size: 10px;
}


.main_contents .product_list .product_card .product_description {
	font-size: 12px;
	padding: 5px 5px 5px 5px;

}

.main_contents .product_list .product_card .product_description .product_name {
	font-size: 12px;
	height: 12px;
}

.main_contents .product_list .product_card .product_description span {
	color: var(--color-gray);
}

.main_contents .product_more a {
	display: block;
	width: 486px;
	height: 52px;
	margin: 18px auto 10px auto;
	color: var(--color-background);
	background: #ffffff;
	border-radius: 5px;
	border: solid 2px var(--color-background);
	text-align: center;
	padding: 13px 0 0 0;
	font-size: 18px;
	font-weight: bold;
	text-decoration: none;
}

.main_contents .solution_desc {
	position: relative;
	padding: 10px 320px 20px 5px;
	margin: 0 0 -20px 0;
	background: var(--color-white);
	min-height: 700px;
}

.main_contents .solution_desc .main_image_box {
	position: relative;
	float: left;
	width: 55%;
}

.main_contents .solution_desc .main_left {
	position: relative;
	float: left;
	width: 100%;
	max-width: 1170px;
}

.main_contents .solution_desc .image_list {
	position: relative;
	float: left;
	width: 44px;
}

.main_contents .solution_desc .image_list img {
	display: block;
	width: 40px;
	height: 40px;
	border: solid 1px var(--color-category);
	background-color: var(--color-background);
	margin: 0 0 5px 0;
	cursor: pointer;
}

.main_contents .solution_desc .image_list img:hover {
	border: solid 1px var(--color-active);
	box-shadow: 0px 0px 5px var(--color-active);
}

.main_contents .solution_desc .main_image_box .main_image {
	position: relative;
	float: right;
	width: 80%;
	max-width: 560px;
	min-height: 100px;
	margin: 0 0 20px 0;
}

.main_contents .solution_desc .main_image_box .main_image img {
	width: 100%;
	height: auto;
}

.main_contents .solution_desc .main_information {
	position: relative;
	float: right;
	width: 40%;
	max-width: 530px;
	padding: 0px 10px 0 10px;

}

.main_contents .solution_desc .main_information h1 {
	text-align: left;
	font-size: 24px;
	line-height: 32px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	border-left: none;
}

.main_contents .solution_desc .main_information .price {
	padding: 20px 0 5px 0px;
	font-size: 24px;
}

.main_contents .solution_desc .main_information .price span {
	font-size: 14px;
}

.main_contents .solution_desc .main_information .main_information {
	padding: 5px 0 10px 0px;
	font-size: 12px;
}

.main_contents .solution_desc .main_information .partner {
}

.main_contents .solution_desc .main_information .star {
	color: var(--color-active);
	font-size: 16px;
	font-weight: bold;
}

.main_contents .solution_desc .main_information .information_title {
	border-top: solid 1px var(--color-background);
	padding: 20px 0 0px 0px;
	font-weight: bold;
	font-size: 16px;
}

.main_contents .solution_desc .main_information .information {
	font-size: 14px;
	line-height: 24px;
}

.main_contents .solution_desc .main_description {
	float: left;
	width: 90%;
	max-width: 100%;
	padding: 0px 0px 0 50px;
}

.main_contents .solution_desc .main_description .description {
	float: left;
	font-size: 14px;
	line-height: 24px;
	width: 100%;
	max-width: 100%;
	padding: 0 20px 0 0;
}

.main_contents .solution_desc .main_description .description_title {
	padding: 20px 0 0px 0px;
	font-weight: bold;
	font-size: 16px;
}


.main_contents .solution_desc .main_description img {
	padding: 0px;
	border: none;
	max-width: 550px;
	width: auto;
	height: auto;
	margin: 0px auto 0px auto;
}


.preview {
	min-height: 400px;
	clear: both;
	line-height: 1.8;
	font-size: 14px;
	padding: 10px;
}

.preview img {
	width: auto;
	max-width: 550px;
	height: auto;
	margin: 10px;
	padding: 0px;
	border: none;
}
	
.preview h1 ,
.main_contents .solution_desc .main_description h1 {
    color: #333333;
    line-height: 1.3;
    font-family: Roboto, "Hiragino Sans";
    font-size: 180%;
    font-weight: 700;
	border-left: none;
    border-bottom: none;
    /* border-top: 1px solid #EBEBEB; */
    margin: 0px 0 20px 0;
    padding: 30px 0 40px 0;
    text-align: center;
}

.preview h2 ,
.main_contents .solution_desc .main_description h2 {
    border-right: solid 1px #eeeeee;
    border-top: solid 1px #eeeeee;
    border-left: solid 10px #000000;
    font-size: 150%;
    font-weight: bold;
    color: #000000;
    padding: 10px;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#eeeeee));
    margin: 20px 0 10px 0;
}

.preview h3 ,
.main_contents .solution_desc .main_description h3 {
    display: block;
    font-size: 1.17em;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
    unicode-bidi: isolate;
}

.main_contents .right_sidebar {
	position: absolute;
	float: right;
	width: 300px;
	right: 10px;
}

.main_contents .right_sidebar .more_info {
	width: 260px;
	padding: 20px 20px 20px 20px;
	border: solid 1px var(--color-background);
	border-radius: 5px;
	font-size: 12px;
	line-height: 18px;
}

.main_contents .more_info .price {
	font-size: 28px;
	margin: 0px 0 5px 0;
}

.main_contents .more_info .management_fee {
	font-size: 12px;
	margin: 0px 0 20px 0;
}

.main_contents .more_info .price span {
	font-size: 14px;
}

.main_contents .more_info .cart_button {
	display: block;
	width: 240px;
	margin: 20px auto 10px auto;
	padding: 8px 0 8px 0;
	background-color: #5b4523;
	color: var(--color-white);
	border-radius: 15px;
	box-shadow: 0px 0px 3px var(--color-background);
	text-align: center;
	font-size: 12px;
	cursor: pointer;
}

.main_contents .more_info a:hover {
	box-shadow: 0px 0px 5px var(--color-price);
}

.main_contents .more_info .ask_button {
	display: block;
	width: 240px;
	margin: 20px auto 10px auto;
	padding: 8px 0 8px 0;
	background-color: var(--color-orange);
	color: var(--color-black);
	border-radius: 15px;
	box-shadow: 0px 0px 3px var(--color-background);
	text-align: center;
	font-size: 12px;
	cursor: pointer;
}

.main_contents .more_info .favorite_button {
	display: block;
	width: 240px;
	margin: 20px auto 10px auto;
	padding: 8px 0 8px 0;
	background-color: var(--color-navy);
	color: var(--color-black);
	border-radius: 15px;
	box-shadow: 0px 0px 3px var(--color-background);
	text-align: center;
	font-size: 12px;
	color: var(--color-white);
	cursor: pointer;
}

.main_contents .more_info .border {
	margin: 20px 0 20px 0;
}

.main_contents .more_info .resource_limit {
	font-size: 18px;
	line-height: 24px;
	color: var(--color-price);
}

.main_contents .more_info .border {
	margin: 20px 0 20px 0;
}

.main_contents .more_info .total {
	font-size: 16px;
	margin: 0 0 10px 0;
}

.main_contents .solution_desc h2 {
	font-size: 18px;
	font-weight: 700;
	background: none;
	border: none;
}

.main_contents .content {
	width: 1000px;
	font-size: 18px;
	line-height: 32px;
	padding: 30px 20px 100px 20px;
}

.content .first {
	width: 1100px;
	height: 400px;
	background-repeat: no-repeat;
	padding: 300px 0 0 50px;
	text-shadow: var(--color-gray) 1px 0 10px;
	border: solid 1px var(--color-gold);
}

.content .first .subtitle {
	font-size: 48px;
	font-weight: 800;
	color: var(--color-black);
	margin: 0 0 60px 0;
}

.content .first .title {
	font-size: 96px;
	font-weight: 800;
	color: var(--color-black);
}

.support_footer {
	width: 900px;
	text-align: center;
}

.content p {
	width: 900px;
}

.main_contents .document_contain {
	background-color: var(--color-white);
	margin: 0 0 0px 0;
	padding: 0 200px 0px 200px;
}

.main_contents .document_contain h2 {
	margin: 40px 0 20px 0;
}

.main_contents .document_contain img {
	width: 50%;
	height: auto;
	margin: 20px auto 20px auto;
	padding: 5px;
	__border: solid 1px var(--color-category);
	__box-shadow: 5px 5px 10px var(--color-background);
}

.main_contents .shopping_cart_contain {
	position: relative;
	padding: 0 320px 0 0;
}

.main_contents .shopping_cart_contain .main_left {
	float: left;
	max-width: 1170px;
	width: 100%;
	height: auto;
	margin: 0 0 -20px 0px;
	padding: 0 5px 20px 5px;
	overflow: hidden;
}

.main_contents .shopping_cart {
	float: left;
	max-width: 1130px;
	width: 100%;
	margin: 0 20px 0 20px;
}

.main_contents .shopping_cart h2 {
}

.main_contents .shopping_cart .cart_information {
	padding: 0 20px 0 0px;
}

.main_contents .shopping_cart .list_header {
	margin: 20px 20px 0 0;
	text-align: right;
	border-bottom: solid 1px var(--color-background);
}

.main_contents .shopping_cart .cart_list {
	clear: both;
	border-bottom: solid 1px var(--color-background);
	margin: 0px 20px 0 0;
	padding: 10px 0px 10px 0;
	height: 150px;
	width: auto;
	overflow: hidden;
}

.main_contents .shopping_cart .cart_list .image {
	clear: both;
	float: left;
	max-width: 339px;
	width: 30%;
	height: 150px;
	text-align: center;
}

.main_contents .shopping_cart .cart_list .image img {
	width: 140px;
	height: auto;
}

.main_contents .shopping_cart .cart_list .solution {
	float: left;
	max-width: 472px;
	width: 40%;
	height: 150px;
}

.main_contents .shopping_cart .cart_list .solution .title {
	display: block;
	color: var(--color-black);
	font-size: 18px;
	margin: 0 0 10px 0;
}

.main_contents .shopping_cart .cart_list .solution .cart_no_item {
	font-size: 18px;
	font-weight: bold;
}

.main_contents .shopping_cart .cart_list .price {
	float: left;
	text-align: right;
	font-size: 16px;
	font-weight: bold;
	max-width: 339px;
	width: 30%;
	height: 24px;
	box-sizing: border-box;
}

.main_contents .shopping_cart .cart_list .management_fee {
	float: left;
	text-align: right;
	font-size: 12px;
	font-weight: normal;
	max-width: 339px;
	width: 30%;
	height: 24px;
	box-sizing: border-box;
}

.main_contents .shopping_cart .total {
	clear: both;
	font-size: 16px;
	text-align: right;
	margin: 0px 20px 0 0;
}

.main_contents .shopping_cart .total .price {
	font-size: 18px;
	font-weight: bold;
}
.main_contents .shopping_cart .shopping_total {
	clear: both;
	font-size: 16px;
	text-align: right;
	margin: 0px 20px 0 0;
}

.main_contents .shopping_cart .shopping_total .price {
	font-size: 18px;
	font-weight: bold;
}

.main_contents .solution_form {
	width: 1000px;
	margin: 0 auto 0 auto;
}

.main_contents .solution_form_top {
	/*height: 200px;
	background-image: url( "../img/PK4131310PAR58128_TP_V4.jpg");*/
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.technology_select_box {
    border: solid 1px #dddddd;
    height: 300px;
    overflow-y: scroll;
    background: #fdfdfd;
    padding: 3px;
}

.main_contents .user_list {
	overflow: hidden;
	height: auto;
}

.main_contents .user_list .user_card {
	float: left;
	border: solid 1px var(--color-background);
	border-radius: 2px;
	width: 288px;
	height: 50px;
	margin: 0 4px 4px 4px;
	overflow: hidden;
	background-color: #ffffff;
	line-height: 110%;
	padding: 3px 3px 3px 3px;
}

.main_contents .user_list .user_card .user_image {
	float: left;
	width: 46px;
	height: 46px;
	background-size: contain;
	background-position: center;
	border: solid 1px var(--color-border);
	border-radius: 2px;
}

.main_contents .user_list .user_card .user_name {
	float: left;
	font-size: 12px;
	color: var(--color-darkgray);
	margin: 0 0 0 5px;
	width: 230px;
}

.main_contents .blog_main {
	float: left;
	max-width: 1150px;
	width: 75%;
	margin: 0 10px 0 0;
}

@media screen and (max-width:1560px) {
	.main_contents .blog_main {
		width: 73%;
	}
}

.main_contents .blog_right {
	float: left;
	max-width: 320px;
	width: 25%;
}

.main_contents .blog_right .input_item {
	border-top: none;
	background-color: var(--color-background);
	color: var(--color-black);
	width: 100%;
}

.main_contents .blog_right .input_item .item_name {
	color: #ffffff;
}

.main_contents .blog_right .input_field {
	border-top: none;
	width: 100%;
}

.popup {
	position: fixed;
	padding: 200px 0 0 0;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 2000px;
	background: rgba( 0, 0, 0, 0.5 );
	z-index: 3;
}

.pc {
	display: block;
}

.sp {
	display: none;
}

.search_result {
	color: var(--color-price);
	font-weight: bold;
	text-align: center;
	margin: 40px 0 0 0;
}

.main_contents .order_table {
	clear: both;
	border: solid 1px var(--color-order-border);
	border-radius: 8px;
	margin: 50px 150px 50px 150px;
}

.main_contents .order_table .order_header {
	background-color: var(--color-order-background);
	border-bottom: solid 1px var(--color-order-border);
	padding: 20px 20px 20px 20px;
}

.main_contents .order_table .order_header .cell {
	float: left;
	color: var(--color-black);
}

.main_contents .order_table .order_header .cell.no { width: 50px; height: 50px; }
.main_contents .order_table .order_header .cell.title { width: 1000px; }
.main_contents .order_table .order_header .cell.price { width: 100px; }
.main_contents .order_table .order_header .cell.start { width: 200px; }
.main_contents .order_table .order_header .cell.status { width: 100px; }
.main_contents .order_table .order_header .cell.order_category { width: 100px; }
.main_contents .order_table .order_header .cell.entry { width: 200px; }
.main_contents .order_table .order_header .cell.span { width: 300px; }

.main_contents .order_table .order_body {
	padding: 20px 20px 20px 20px;
	border-bottom: solid 1px var(--color-order-border);
}

.main_contents .order_table .order_body:last-child {
	border-bottom: none;
}

.main_contents .order_table .order_body .cell {
	float: left;
	color: var(--color-black);
}

.main_contents .order_table .order_body .cell.no { width: 50px; height: 20px; padding: 10px 0 0 0; }
.main_contents .order_table .order_body .cell.title { width: 1000px; }
.main_contents .order_table .order_body .cell.price { width: 100px; }
.main_contents .order_table .order_body .cell.start { width: 200px; }
.main_contents .order_table .order_body .cell.status { width: 100px; }
.main_contents .order_table .order_body .cell.order_category { width: 100px; }
.main_contents .order_table .order_body .cell.entry { width: 200px; }
.main_contents .order_table .order_body .cell.span { width: 300px; }
.main_contents .order_table .order_body .cell.detail { width: 50px; }

.main_contents .entry_now {
	display: inline-block;
	border-radius: 4px;
	background-color: var(--color-price);
	color: var(--color-white);
	font-size: 10px;
	font-weight: bold;
	padding: 4px;
	line-height: 10px;
	margin: 5px;
}

ul.left_global_menu {
	position: absolute;
	padding: 0px 0px 0px 0px;
	list-style-type: none;
	top: 85px;
	left: 0px;
	width: 200px;
	background: var( --color-white );
	border-right: solid 1px var( --color-background );
}

ul.left_global_menu li a {
	display: block;
	border-bottom: solid 1px var( --color-background );
	padding: 5px 5px 5px 5px;
	box-sizing: border-box;
}

@media screen and (max-width:1902px) {
	ul.left_global_menu {
		display: none;
	}
}

.koneta_window {
	position: fixed;
	right: 10px;
	bottom: 10px;
	width: 280px;
	height: 280px;
	border: solid 1px var(--color-background);
	border-radius: 5px;
	box-shadow: 2px 2px 4px gray;
	background-color: var(--color-white);
}

.koneta_window .close_button {
	float: right;
	display: block;
	/*
	border: solid 3px var(--color-black);
	border-radius: 3px;
	*/
	padding: 4px 0px 0px 0px;

	color: var(--color-white);
	text-align: center;
	line-height: 10px;
	font-size: 10px;

	width: 15px;
	height: 15px;
	margin: 5px;
}

.koneta_window h2 {
	margin: 0px;
	padding: 2px 5px 2px 5px;
	font-size: 14px;
	background-color: var(--color-green);
	color: var(--color-border);
	border-radius: 5px 5px 0px 0px;
}

.koneta_window form {
	border: none;
}

.koneta_window input[type=text],
.koneta_window input[type=password]
 {
	width: 90%;
	resize: none;
	font-size: 12px;
	color: var(--color-black);
	text-align: left;
}

.koneta_window textarea {
	width: 90%;
	height: 100px;
	resize: none;
	font-size: 12px;
	color: var(--color-black);
	text-align: left;
}

.koneta_window textarea.red {
	background-color: var(--color-price);
	color: var(--color-white);
}

.koneta_window textarea.blue {
	background-color: var(--color-navy);
	color: var(--color-white);
}

.koneta_window textarea.yellow {
	background-color: var(--color-light-active);
	color: var(--color-black);
}


.koneta_window input[type=file] {
	width: 90%;
	border: none;
}

.koneta_window input[type=radio] {
	display: none;
}

.koneta_window input[type=radio]:checked+label {
	border: solid 2px var(--color-active);
}

.koneta_window label {
	display: block;
	margin: 0 0 0 5px;
	border: solid 2px var(--color-black);
	border-radius: 15px;
	height: 10px;
}

.koneta_window label.color {
	display: inline-block;
	width: 15px;
	height: 15px;
	border: solid 2px var(--color-black);
	border-radius: 10px;
}

.koneta_window .color.white {
	background-color: #ffffff;
}

.koneta_window .color.blue {
	background-color: var(--color-navy);
}

.koneta_window .color.yellow {
	background-color: var(--color-light-active);
}

.koneta_window .color.red {
	background-color: var(--color-price);
}

.koneta_window #koneta_form {
	display: block;
}

.koneta_window #koneta_wait {
	display: none;
	width: 280px;
	height: 280px;
	text-align: center;
	padding: 100px 0 0 0;
}

.koneta_window #koneta_wait img {
	width: 50px;
	height: 50px;
}

.koneta_window #koneta_complete {
	display: none;
	width: 280px;
	height: 280px;
	text-align: center;
	padding: 90px 0 0 0;
}

#koneta_list {
	position: relative;
}

.koneta_box {
	border: solid 1px var(--color-border);
	border-radius: 5px;
	margin: 5px;
	padding: 5px 5px 20px 5px;
	width: 320px;
	__min-height: 200px;
	box-shadow: 2px 2px 4px var(--color-order-border);
	overflow: hidden;
	background-color: var(--color-white);
}

.koneta_box .koneta_user {
	float: left;
	width: 40px;
}

.koneta_box .koneta_right {
	float: left;
	width: 280px;
	margin: 0 0 0 5px;
}


.koneta_box .koneta_user img {
	width: 40px;
	height: 40px;
	margin: 0px auto 0px auto;
}

.koneta_box .nickname {
	float: left;
	font-size: 12px;
	font-weight: bold;
	letter-spacing: -1px;
	width: 150px;
	color: var(--color-navy);
}

.koneta_box .datetime {
	float: left;
	font-size: 12px;
	width: 120px;
	color: var(--color-orange);
}

.koneta_box .koneta_message {
	float: left;
	font-size: 12px;
	width: 95%;
	border-radius: 5px;
	color: var(--color-darkgray);
	background-color: var(--color-white);
	box-sizing: border-box;
}

.koneta_box .koneta_message.blue {
	background-color: var(--color-navy);
	color: var(--color-white);
	font-weight: bold;
	padding: 10px;
}

.koneta_box .koneta_message.yellow {
	background-color: var(--color-light-active);
	font-weight: bold;
	padding: 10px;
}

.koneta_box .koneta_message.red {
	background-color: var(--color-price);
	color: var(--color-white);
	font-weight: bold;
	padding: 10px;
}

.koneta_box .koneta_image {
	float: left;
	width: 280px;
	height: 160px;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	border-radius: 5px;
	margin: 5px 0 0 0px;
}

.container .main_contents ul.project_menu {
	clear: both;
	/*max-width: 670px;*/
	width: 1030px;
    border: solid 1px var(--color-green);
	border-radius: 0px 0px 0px 0px;
	padding: 0px;
	margin: 12px 5px 12px 12px;
	overflow: hidden;
}

.container .main_contents ul.project_menu li {
	float: left;
	width: 20%;
	border-right: solid 1px var(--color-green);
	margin: 0px;
	margin-bottom: 0px;
	box-sizing: border-box;
	text-align: center;
}

.container .main_contents ul.project_menu li:last-child {
	border-right: none;
}

.container .main_contents ul.project_menu li a {
	background-color: transparent;
	color: var(--color-black);
	font-size: 12px;
	font-weight: normal;
	box-shadow: none;
}

.container .main_contents ul.project_menu li a.active {
	color: var(--color-white);
	background-color: var(--color-green);
	font-weight: bold;
}

/*管理者以外のプロジェクトメニュー*/
.container .main_contents ul.project_menu_not_administrator {
	clear: both;
	/*max-width: 670px;*/
	width: 600px;
    border: solid 1px var(--color-green);
	border-radius: 0px 0px 0px 0px;
	padding: 0px;
	margin: 12px auto 12px 12px;
	overflow: hidden;
}

.container .main_contents ul.project_menu_not_administrator li {
	float: left;
	width: 200px;
	border-right: solid 1px var(--color-green);
	margin: 0px;
	margin-bottom: 0px;
	box-sizing: border-box;
	text-align: center;
}

.container .main_contents ul.project_menu_not_administrator li:last-child {
	border-right: none;
}

.container .main_contents ul.project_menu_not_administrator li a {
	background-color: transparent;
	color: var(--color-black);
	font-size: 12px;
	font-weight: normal;
	box-shadow: none;
}

.container .main_contents ul.project_menu_not_administrator li a.active {
	color: var(--color-white);
	background-color: var(--color-green);
	font-weight: bold;
}

@media screen and (min-width: 639px){
	.container .main_contents ul.project_menu_mini {
        display: none;
    }
    .container .main_contents ul.project_menu_not_administrator_mini {
        display: none;
    }
}

.project_main {
	clear: both;
	width: 98%;
	margin: 0 0 0 0.8%;
}

.project_main .half_area {
	width: 33.2%;
	margin: 0 0.001% 0 0;
	box-sizing: border-box;
}

.project_main .half_area:last-child {
	margin: 0 0 0 0;
}

.project_main form {
	max-width: none;
}

.project_main .input_item {
	width: 25%;
}

.project_main .input_field {
	width: 75%;
}

.project_center {
	float: left;
	width: 70%;
	margin: 0 0 0 0.8%;
}

.project_center form {
	margin: 0 0 5px 0;
}

.todo_title {

	padding: 20px 0 5px 5px;
	color: #333333;
	overflow: hidden;
	height: auto;
	
	display: block;
	/*background-color: var(--color-order-background);*/
	width: 60%;
	min-width: 350px;
	font-weight: bold;
	position: relative;
	padding-left: 50px;
}
.todo_value {

	padding: 0 0 15px 5px;
	color: #333333;
	overflow: hidden;
	height: auto;
	
	display: block;
	width: 60%;
	min-width: 350px;
	border-bottom: solid;
	border-bottom-width: thin;
	border-bottom-color: rgb(193, 191, 191);
	
}
  .todo_title::before {
	content: url(../img/checkmark.png);
	transform: scale(0.1);
	position: absolute;
	top: -100px;
	left: -100px;
  }

  .news_table_value {

	padding: 0 0 15px 5px;
	color: #333333;
	overflow: hidden;
	height: auto;
	
	display: block;
	width: 600px;
	min-width: 350px;
	border-bottom: solid;
	border-bottom-width: thin;
	border-bottom-color: rgb(193, 191, 191);
	
}
.news_table_footer {

	padding: 0 0 15px 5px;
	color: #333333;
	overflow: hidden;
	height: auto;
	display: block;
	width: 650px;
	min-width: 350px;
	text-align: right;
}

@media screen and (max-width: 640px) {
	.news_table_value {
		font-size: 12px;
		width: 80%;
	}
	.news_table_footer {

		padding: 0 0 15px 5px;
		color: #333333;
		overflow: hidden;
		height: auto;
		display: block;
		width: 60%;
		min-width: 350px;
		text-align: right;
	}
}

/*ダッシュボードのステータス*/
.dashboard_status {
	padding: 10px auto 10px 5px;
	border-collapse:  collapse;     /* セルの線を重ねる */

}

.dashboard_status th {
	background: var(--color-order-background);
	border: solid 1px #ccc;
	border-width: thin;
	color: #333333;
	padding: 10px;
	width: 200px;
}
.dashboard_status td {
	border: solid 1px #ccc;
	padding: 10px;
	text-align: center;
}

.dashboard_left {
	text-align: left;
}
/*ダッシュボードの問い合わせ一覧*/
.dashboard_inquiry {
	border-collapse: collapse;     /* セルの線を重ねる */	
	border-spacing: 0px;
	border: solid 1px #ccc;
	border-top: 0px;
	border-left: 0px;
	border-bottom: 0px;
}
.dashboard_inquiry tr {
	display: block;
	float: left;
	
  }
.dashboard_inquiry th {
	background: var(--color-order-background);
	border: solid 1px #ccc;
	color: #333333;
	width: 300px;
	border-right: none;
}
.dashboard_inquiry td {
	border: solid 1px #ccc;
	text-align: center;
	display: block;
	height: 40px;
	width: 300px;
	border-top: 0px;
	border-right: 0px;
}

.dashboard_inquiry_detail {
	padding: 10px auto 10px 5px;
	border-collapse: collapse;     /* セルの線を重ねる */	
	border-spacing: 0px;
	border: solid 1px #ccc;
	border-top: 0px;
	border-left: 0px;
	border-bottom: 0px;
}
.dashboard_inquiry_detail tr {
	display: block;
	float: left;
	
  }

/*ダッシュボードのプロジェクト一覧*/
.dashboard_project {
	border-collapse: collapse;     /* セルの線を重ねる */	
	border-spacing: 0px;
	border: solid 1px #ccc;
	border-top: 0px;
	border-left: 0px;
	border-bottom: 0px;
}
.dashboard_project tr {
	display: block;
	float: left;
	
  }
.dashboard_project th {
	background: var(--color-order-background);
	border: solid 1px #ccc;
	color: #333333;
	width: 200px;
	border-right: none;
}
.dashboard_project td {
	border: solid 1px #ccc;
	text-align: center;
	display: block;
	height: 40px;
	width: 200px;
	border-top: 0px;
	border-right: 0px;
}

.dashboard_project_detail {
	padding: 10px auto 10px 5px;
	border-collapse: collapse;     /* セルの線を重ねる */	
	border-spacing: 0px;
	border: solid 1px #ccc;
	border-top: 0px;
	border-left: 0px;
	border-bottom: 0px;
}
.dashboard_project_detail tr {
	display: block;
	float: left;
	
}

.th_l {
	background: var(--color-order-background);
	border: solid 1px #ccc;
	color: #333333;
	padding: 10px;
	width: 300px;
	border-right: none;
}
.th_m {
	background: var(--color-order-background);
	border: solid 1px #ccc;
	color: #333333;
	padding: 10px;
	width: 200px;
	border-right: none;
}
.th_s {
	background: var(--color-order-background);
	border: solid 1px #ccc;
	color: #333333;
	padding: 10px;
	width: 50px;
	border-right: none;
}
.tb_l {
	border: solid 1px #ccc;
	padding: 10px;
	text-align: center;
	display: block;
	height: 30px;
	width: 300px;
	border-top: 0px;
	border-right: 0px;
}
.tb_m {
	border: solid 1px #ccc;
	padding: 10px;
	text-align: center;
	display: block;
	height: 30px;
	width: 200px;
	border-top: 0px;
	border-right: 0px;
}
.tb_s {
	border: solid 1px #ccc;
	padding: 10px;
	text-align: center;
	display: block;
	height: 30px;
	width: 50px;
	border-top: 0px;
	border-right: 0px;
}
.dashboard_box .dashboard_inquiry_detail .td_l {
	border: solid 1px #ccc;
	padding: 10px;
	text-align: center;
	display: block;
	height: 30px;
	width: 300px;
	border-top: 0px;
	border-right: 0px;
}
.dashboard_box .dashboard_inquiry_detail .td_m {
	border: solid 1px #ccc;
	padding: 10px;
	text-align: center;
	display: block;
	height: 30px;
	width: 200px;
	border-top: 0px;
	border-right: 0px;
}

.itemlist_table {
	padding: 10px auto 10px 5px;
	border-collapse: collapse;     /* セルの線を重ねる */	
	border-spacing: 0px;
	border: solid 1px #ccc;
	border-top: 0px;
	border-left: 0px;
	border-bottom: 0px;
	overflow-x: scroll;
	width: 100%;
	border-radius: 8px;
}
.itemlist_table td {
	border: solid 1px #ccc;
	padding: 10px;
	text-align: center;
	/*display: block;*/
	height: 30px;
	border-top: 0px;
	border-right: 0px;
}
.itemlist_table .table_header {
	background: var(--color-order-background);
	border: solid 1px #ccc;
	color: #333333;
	padding: 10px;
	/*width: 180px;*/
	border-right: none;
}

.bloglist_table {
	padding: 10px auto 10px 5px;
	border-collapse: collapse;     /* セルの線を重ねる */	
	border-spacing: 0px;
	border: solid 1px #ccc;
	border-top: 0px;
	border-left: 0px;
	border-bottom: 0px;
	overflow-x: scroll;
	width: 100%;
	border-radius: 8px;
}
.bloglist_table td {
	border: solid 1px #ccc;
	padding: 10px;
	text-align: center;
	/*display: block;*/
	height: 30px;
	border-top: 0px;
	border-right: 0px;
}
.bloglist_table .table_header {
	background: var(--color-order-background);
	border: solid 1px #ccc;
	color: #333333;
	padding: 10px;
	/*width: 180px;*/
	border-right: none;
}

.blogcategorylist_table {
	padding: 10px auto 10px 5px;
	border-collapse: collapse;     /* セルの線を重ねる */	
	border-spacing: 0px;
	border: solid 1px #ccc;
	border-top: 0px;
	border-left: 0px;
	border-bottom: 0px;
	overflow-x: scroll;
	width: 100%;
	border-radius: 8px;
}
.blogcategorylist_table td {
	border: solid 1px #ccc;
	padding: 10px;
	text-align: center;
	/*display: block;*/
	height: 30px;
	border-top: 0px;
	border-right: 0px;
}
.blogcategorylist_table .table_header {
	background: var(--color-order-background);
	border: solid 1px #ccc;
	color: #333333;
	padding: 10px;
	/*width: 180px;*/
	border-right: none;
}

.projectlist_table {
	padding: 10px auto 10px 5px;
	border-collapse: collapse;     /* セルの線を重ねる */	
	border-spacing: 0px;
	border: solid 1px #ccc;
	border-top: 0px;
	border-left: 0px;
	border-bottom: 0px;
	overflow-x: scroll;
	width: 100%;
	border-radius: 8px;
}
.projectlist_table td {
	border: solid 1px #ccc;
	padding: 10px;
	text-align: center;
	/*display: block;*/
	height: 30px;
	border-top: 0px;
	border-right: 0px;
}
.projectlist_table .table_header {
	background: var(--color-order-background);
	border: solid 1px #ccc;
	color: #333333;
	padding: 10px;
	/*width: 180px;*/
	border-right: none;
}

.projectlist_table_wiki {
	padding: 10px auto 10px 5px;
	border-collapse: collapse;     /* セルの線を重ねる */	
	border-spacing: 0px;
	border: solid 1px #ccc;
	border-top: 0px;
	border-left: 0px;
	border-bottom: 0px;
	overflow-x: scroll;
	width: 100%;
	border-radius: 8px;
}
.projectlist_table_wiki td {
	border: solid 1px #ccc;
	padding: 10px;
	text-align: center;
	height: 30px;
	border-top: 0px;
	border-right: 0px;
}
.projectlist_table_wiki .table_header {
	background: var(--color-order-background);
	border: solid 1px #ccc;
	color: #333333;
	padding: 10px;
	border-right: none;
}

.projectlist_table_mini {
	display: none;
}

.main_contents .project_task {
	float: left;
	max-width: 1150px;
	width: 30%;
	margin: 30px 10px 0 0;
	min-width: 350px;
	cursor: pointer;
	position: relative;
	font-size: 18px;
	font-weight: bold;
}

.container .main_contents .content_box {
	width: 100%;
	color: #000000;
	overflow: hidden;
	height: auto;
	padding: 0px;
	margin: 0 auto 30px auto;
	background-color: #ffffff;

	border: solid 1px var(--color-order-border);
	border-radius: 8px;

	box-sizing: border-box;
}
.container .main_contents .content_box .title {
	background-color: var(--color-order-background);
	font-size: 14px;
	line-height: 18px;
	padding: 10px 10px 10px 10px;
}
.container .main_contents .content_box .content_right {
	font-size: 12px;
	line-height: 18px;
	padding: 10px;
}

.container .main_contents .content_box .content_right .date {
	float: right;
	width: 150px;
	margin: 0 5px 5px 0;
	font-size: 100%;
	font-weight: bold;
	text-align: right;

	/* border-top: solid 1px var(--color-button-blue); */
	color: var(--color-button-blue);
	padding: 3px 10px 3px 10px;
	background-color: #ffffff;
}
.container .main_contents .content_box .content_right .description {
	min-height: 60px;
	margin-bottom: 10px;
	overflow: hidden;
	font-size: 12px;
	line-height: 20px;
	padding: 0px;
	margin: 0px 5px 0px 5px;
	text-align: left;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4; /* 任意の行数を指定 */
	}
.container .main_contents .content_box .content_right .description p.article {
	margin: 0px 0 0px 0;
	font-size: 14px;
	line-height: 24px;
	}
.container .main_contents .content_box .content_right .right {
	display:flex;
}


.main_contents .project {
	clear: both;
	float: left;
	width: 70%;
	margin: 0 0.1% 0 0;
	min-width: 350px;
	padding: 0px;
}

.main_contents .project_right {
	float: right;
	max-width: 420px;
	width: 29%;
	padding: 0px;
}

.main_contents .project_right .point_inner {
	width: 100%;
	color: #000000;
	overflow: hidden;
	height: auto;
	padding: 0px;
	margin: 0 auto 30px auto;
	background-color: #ffffff;

	border: solid 1px var(--color-order-border);
	border-radius: 8px;

	box-sizing: border-box;
}
.main_contents  .project_right .point_title {
	float: left;
	max-width: 1150px;
	width: 30%;
	margin: 0 10px 0 0;
	min-width: 350px;
	cursor: pointer;
	position: relative;
	font-size: 18px;
	font-weight: bold;
	background-color: #ffffff;
}
.hidden-view{
    display: none;
	padding: 10px 10px 10px 10px;
}
.button::before{
    content: "もっと見る";
	font-size: 12px;
	padding: 10px 10px 10px 10px;
	color: #919090;
}	

input[type="checkbox"]#trigger{
    display: none;
}
input[type="checkbox"]#trigger:checked ~ .hidden-view{
    display: block;
}
input[type="checkbox"]#trigger:checked ~ .button::before{
    content: "閉じる";
	font-size: 12px;
	padding: 10px 10px 10px 10px;
	color: #919090;
}

.main_contents .project_right .point_inner .content_right {
	float: left;
	overflow: hidden;
	padding: 10px 10px 10px 10px;
	margin: 0px;
	font-size: 12px;
	line-height: 18px;
	width: 100%;
}
.main_contents .project_right .point_inner .content_right_member {
	float: left;
	overflow: hidden;
	padding: 10px 10px 10px 10px;
	margin: 0px;
	font-size: 12px;
	line-height: 18px;
}
.main_contents .project_right .point_inner .content_right .post_date {
	font-size: 12px;
	font-weight: normal;
	text-align: left;
}
.main_contents .project_right .point_inner .right {
	font-size: 12px;
	width:100%;
	padding: 10px;
}
.main_contents .project_right .point_inner .right .top {
}
.main_contents .project_right .point_inner .right .bottom {
}

.form_status_confirm_button{
    float: right;
    width: 240px;
    margin: 3px 0px 3px 0px;
    padding: 8px 0 8px 0;
    background-color: var(--color-yellow);
    color: var(--color-black);
    border-radius: 15px;
    box-shadow: 0px 0px 3px var(--color-background);
    text-align: center;
    font-size: 12px;
    cursor: pointer;
    border: none;
	display: inline-block;
	transition: all .5s ease;
}

.project_right_confirm{
	float: right;
	max-width: 420px;
	width: 29%;
	padding: 0px;
}
.project_right_input{
	display: none;
	float: right;
	max-width: 420px;
	width: 29%;
	padding: 0px;
}
.Hidden{
    display: none;
}
.Display{
    display: inline-block;
}
.main_contents .taskstatus_NotStarted:before{
    content:"●";
	font-size: 12px;
	color:rgb(116, 138, 236);
}
.main_contents .taskstatus_Started:before{
    content:"●";
	font-size: 12px;
	color:rgb(243, 200, 12);
}
.main_contents .taskstatus_WaitingForReview:before{
    content:"●";
	font-size: 12px;
	color:rgb(243, 12, 170);
}
.main_contents .taskstatus_CorrectingTheProblem:before{
    content:"●";
	font-size: 12px;
	color:rgb(243, 12, 12);
}
.main_contents .taskstatus_Confirming:before{
    content:"●";
	font-size: 12px;
	color:rgb(12, 243, 89);
}
.main_contents .taskstatus_Completion:before{
    content:"●";
	font-size: 12px;
	color:hsl(139, 89%, 4%);
}

.main_contents .taskstatus_NotStarted {
	float: left;
	text-align: left;
	min-width: 80px;
}
.main_contents .taskstatus_Started {
	float: left;
	text-align: left;
	min-width: 80px;
}
.main_contents .taskstatus_WaitingForReview {
	float: left;
	text-align: left;
	min-width: 120px;
}
.main_contents .taskstatus_CorrectingTheProblem {
	float: left;
	text-align: left;
	min-width: 100px;
}
.main_contents .taskstatus_Confirming {
	float: left;
	text-align: left;
	min-width: 120px;
}
.main_contents .taskstatus_Completion {
	float: left;
	text-align: left;
	min-width: 80px;
}


/*アコーディオン全体*/
.accordion-area{

}

.accordion-area li{

}

.accordion-area section {

}

/*アコーディオンタイトル*/
.accordion-area .title {
    position: relative;/*+マークの位置基準とするためrelative指定*/
    cursor: pointer;
    font-size: 12px;
    font-weight: normal;
    padding: 0 3% 0 50px;
    transition: all .5s ease;
}

/*アイコンの＋と×*/
.accordion-area .title::before,
.accordion-area .title::after{
    position: absolute;
    content:'';
    width: 15px;
    height: 2px;
    background-color: #333;
    
}
.accordion-area .title::before{
    top:48%;
    left: 15px;
    transform: rotate(0deg);
    
}
.accordion-area .title::after{    
    top:48%;
    left: 15px;
    transform: rotate(90deg);

}

/*　closeというクラスがついたら形状変化　*/

.accordion-area .title.close::before{
  transform: rotate(45deg);
}

.accordion-area .title.close::after{
  transform: rotate(-45deg);
}

/*アコーディオンで現れるエリア*/
.accordion-area .box {
    display: none;/*はじめは非表示*/
    padding: 2%;
	box-sizing: content-box;
    border: solid 1px var(--color-order-border);
    border-radius: 8px;
}
.accordion-area .box .filter {
    display: table;
    margin: 0px;
    height: auto;
    overflow: hidden;
    clear: both;
    max-width: 1195px;
    width: 100%;
    background-color: #ffffff;
	border: none;
}

/*========= レイアウトのためのCSS ===============*/

.accordion-area h2{
    text-align: center;
    margin: 30px 0;
    font-size:1rem;
}

.calendar table {
	position: absolute;

	overflow: hidden;
	height: auto;
	background-color: #ffffff;
	border: solid 1px #eeeeee;
}

.input_element {
	border: solid 1px #000000;
}

.success_message {
	margin: 0px auto 5px 15px;
    padding: 10px;
    color: #48b400;
    border-radius: 10px;
    border: 2px solid #4dc100;
	width: 400px;
	/*display: none;*/
}

/*
  アコーディオンそのものの横幅と余白を指定。
  開閉動作に影響なし。
*/
.accordion__list {
	width: 95%;
	padding: 5px;
	float: left;
	margin: 0;
  }
  
  /*
	アコーディオンの2つ目以降、上5白を取る。
	開閉動作に影響なし。
  */
  .accordion__item:nth-child(n+2) {
	margin-top: 10px;
  }
  
  .accordion__item {
	margin: 0px;
  }

  /*
	アコーディオンの開閉ボタンの装飾。
	position: relative;が無いと、
	「+」「-」の位置がずれるので注意。
  */
  .accordion__head {
	position: relative;
	width: 80%;
	padding: 10px;
	cursor: pointer;
  }
  
  /*
	アコーディオンの開閉ボタンの右側に「-」を表示。
  */
  .accordion__head::after {
	content: "-";
	font-size: 15px;
	position: absolute;
	top: 8px;
	right: 10px;
  }
  
  /*
	アコーディオンが閉じた際に、
	開閉ボタンの右側に「-」を「+」に変更する。
  */
  .accordion__item.active .accordion__head::after {
	content: "+";
	right: 13px;
  }
  
  /*
	アコーディオンの開いている部分の装飾。
	通常時に表示する。
  */
  .accordion__body {
	width: 100%;
	height: auto;
	padding: 10px;

  }
  
  /*
	アコーディオンが閉じた際に、
	height: 0; overflow: hidden;にすることで、
	表示されないようにする。
  */
  .accordion__item.active .accordion__body {
	overflow: hidden;
	width: 100%;
	height: 0;
	padding: 0 10px;
	transition: all .25s ease;
  }

  
#globalitemcategorylist {
	padding: 0;
}

.radiobutton__list {
	width: 95%;
	padding: 5px;
	float: left;
	margin: 0;
  }
  
  .radiobutton__item {
	margin: 0px;
  }

  .radiobutton__head {
	width: 80%;
	padding: 10px;
  }

.radiobutton__list form {
	display: table;
	margin: 0px;
	height: auto;
	width: 100%;
	background-color: #ffffff;
	box-sizing: border-box;
	border: solid 1px var(--color-order-border);
	border-radius: 8px;
}

.category_list .search{
	width: 95%;
	padding: 5px;
	float: left;
	margin: 0;
  }

.category_list .search input {
	display: table;
	margin: 0px;
	height: auto;
	width: 100%;
	background-color: #ffffff;
	box-sizing: border-box;
	border: solid 1px rgba(185,186,187,0.5);
	border-radius: 8px;
}

.search_button {
	width: 95%;
	padding: 5px;
	float: left;
	margin: 0;
}

.search_title {
	margin: 10px 0 5px 0;
	width: 100%;
	padding: 5px;
	font-weight: bold;
	color:var(--color-black);
	line-height: 24px;
	font-size: 120%;
	font-weight: 700;
}

.search_conditions {
	margin: 10px 0 5px 0;
	width: 100%;
	padding: 5px;
	font-weight: normal;
	color:blue;
	line-height: 24px;
	font-size: 13px;
}


/*
  アコーディオンそのものの横幅と余白を指定。
  開閉動作に影響なし。
*/
.accordion__list2 {
	float: left;
    font-size: 12px;
    font-weight: none;
    display: table-cell;
    vertical-align: center;
    color: #333333;
    max-width: 950px;
    min-width: 75%;
    width: 80%;
    padding: 5px;
    height: auto;
    overflow: hidden;
    box-sizing: border-box;
	margin: 0;
  }
  
  .accordion__item2 {

  }

  /*
	アコーディオンの2つ目以降、上に余白を取る。
	開閉動作に影響なし。
  */
  .accordion__item2:nth-child(n+2) {
	margin-top: 5px;
  }
  
  /*
	アコーディオンの開閉ボタンの装飾。
	position: relative;が無いと、
	「+」「-」の位置がずれるので注意。
  */
  .accordion__head2 {
	position: relative;
	width: 100%;
	/*padding: 10px;*/
	color: #fff;
	background: #019ac6;
	cursor: pointer;
  }
  
  /*
	アコーディオンの開閉ボタンの右側に「+」を表示。
  */
  .accordion__head2::after {
	content: "▼";
	position: absolute;
	top: 2px;
	right: 10px;
  }
  
  /*
	アコーディオンが開いた際に、
	開閉ボタンの右側に「+」を「-」に変更する。
  */
  .accordion__item2.active .accordion__head2::after {
	content: "▲";
	position: absolute;
	top: 2px;
	right: 10px;
  }
  
  /*
	アコーディオンの閉じている部分の装飾。
	height: 0; overflow: hidden;にすることで、
	通常時は表示されないようにする。
  */
  .accordion__body2 {
	overflow: hidden;
	width: 100%;
	height: 0;
	padding: 0 10px;
	/*background: #e8e8e8;*/
	transition: all .25s ease;
	
  }
  
  /*
	アコーディオンが開いた際に、
	heightを0からautoに、paddingの上下を0から10に。
  */
  .accordion__item2.active .accordion__body2 {
	height: auto;
	padding: 10px;
  }

  .accordion__head2 p {
	margin-left: 10px;
  }

  .profession_checkbox {
	float: left;
    font-size: 12px;
    font-weight: none;
    display: table-cell;
    vertical-align: center;
    color: #333333;
    max-width: 950px;
    min-width: 75%;
    width: 80%;
    padding-right: 350px;
	padding-left: 10px;
    height: auto;
    box-sizing: border-box;
  }

  .radiobutton__list2 {
	float: left;
    font-size: 12px;
    font-weight: none;
    display: table-cell;
    vertical-align: center;
    color: #333333;
    max-width: 950px;
    min-width: 75%;
    width: 80%;
    height: auto;
    box-sizing: border-box;
	padding: 0;
  }
  
  .radiobutton__item2 {
	width: 100%;
  }

  .radiobutton__head2 {
	width: 80%;
	padding: 10px;

  }

.radiobutton__list2 form {
	display: table;
	margin: 0px;
	height: auto;
	width: 100%;
	background-color: #ffffff;
	box-sizing: border-box;
	border: solid 1px var(--color-order-border);
	border-radius: 8px;
}

.categorytype {
	white-space: nowrap;
}

.message {
	clear: both;
	width: 98%;
	margin: 0 0 0 0.8%;
	font-weight: bold;
}

.container .main_contents .content_box_memo {
	width: 70%;
	float: left;
	color: #000000;
	overflow: hidden;
	height: auto;
	padding: 0px;
	margin: 0 auto 10px auto;
	background-color: #ffffff;

	border: solid 1px var(--color-order-border);
	border-radius: 8px;

	box-sizing: border-box;
}

.container .main_contents .content_box .title_memo {
	background-color: var(--color-order-background);
	font-size: 14px;
	line-height: 18px;
	/*padding: 10px 10px 10px 10px;*/
}

.message_list {
	width: 70%;
	clear: both;
	font-weight: bold;
	font-size: 18px;
}
.message_list .message_title_more {
	float: right;
	font-size: 13px;
}

.comment{
	background-color: var(--color-order-background);
	font-size: 14px;
	line-height: 18px;
	padding: 10px 10px 10px 10px;
}

.container .main_contents .comment_box_memo {
	width: 95%;
	/*display:flex;*/
	color: #000000;
	overflow: hidden;
	height: auto;
	padding: 0px;
	margin: 0 0 10px 0;
	background-color: #ffffff;

	border: solid 1px var(--color-order-border);
	border-radius: 8px;

	box-sizing: border-box;
}

.container .main_contents .comment_button {
	float: right;
	
}

.button_delete{
    display: block;
    float: right;
    width: 30px;
    margin: 3px 0px 3px 0px;
    padding: 8px 0 8px 0;
    background-color: #FFFFFF;
    color: var(--color-black);
    border-radius: 15px;
    text-align: center;
    font-size: 12px;
    cursor: pointer;
    border: none;
}
.button_edit{
    display: block;
    float: right;
    width: 30px;
    margin: 3px 0px 3px 0px;
    padding: 8px 0 8px 0;
    background-color: #FFFFFF;
    color: var(--color-black);
    border-radius: 15px;
    text-align: center;
    font-size: 12px;
    cursor: pointer;
    border: none;
}
.button_save{
    display: none;
    float: right;
    width: 30px;
    margin: 3px 0px 3px 0px;
    padding: 8px 0 8px 0;
    background-color: #FFFFFF;
    color: var(--color-black);
    border-radius: 15px;
    text-align: center;
    font-size: 12px;
    cursor: pointer;
    border: none;
}

.btn-detail {
    display: inline-block;
    padding: 10px 30px;
    background-color: #ea68a2; 
    color: #fff;
    text-decoration: none;
    border-radius: 9999px;
    font-size: 14px;
}
.btn-detail:hover {
    background-color: #f3c2c2;
}

.comment_action{
	display:flex;
}
.comment_action .form_submit_field {
	background-color: #FFFFFF;
	padding: 5px
}

.task_comment form{
	border: none;
	display: flex;
}

.list_mode {
	width: 100%;
    color: #000000;
    overflow: hidden;
    height: auto;
    padding: 0px;
    margin: 0 0 10px 0;
    background-color: #ffffff;
	display:flex;
}
.edit_mode{
	display:none;
}

.comment_edit {
	width: 95%;
	height:30px;
}

.dropdown__lists {
    display: none;/*デフォルトでは非表示の状態にしておく*/
    width: 100%;
    position: absolute;
    top: 60px;
    left: 0;
}
.gnavi__list:hover .dropdown__lists {
    display: block;/*Gナビメニューにホバーしたら表示*/
}
.dropdown__list {
    background-color: #004d80;
    height: 60px;
    transition: all .3s;
    position: relative;
}
.dropdown__list:not(:first-child)::before{
    content: "";
    width: 100%;
    height: 1px;
    background-color: #3492d1;
    position: absolute;
    top: 0;
    left: 0;
}
.dropdown__list:hover {
    background-color: #003558;
}
.dropdown__list a {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    text-decoration: none;
    position: relative;
}
.dropdown__list a::before {
    content: '';
    display: block;
    width: 6px;
    height: 6px;
    border-top: 2px solid #fff;
    border-left: 2px solid #fff;
    transform: rotate(135deg);
    position: absolute;
    right: 15px;
    top: calc(50% - 5px);
}

.reservation {
	display:table;
	margin: 0px auto 20px auto;
	height: auto;
	overflow: hidden;
	clear: both;
	max-width: 1195px;
	width: 100%;
	background-color: #ffffff;
	/*box-sizing: border-box;*/

	/*border: solid 1px var(--color-order-border);*/
	border-radius: 8px;
}

.responsive-table {
  width: 100%;
  border-collapse: collapse;
}
.responsive-table th,
.responsive-table td {
  border: 1px solid #ccc; /* セルごとの枠 */
  padding: 10px;
  /*text-align: left;*/
}
.responsive-table th {
  background: #f5f5f5;
  font-weight: bold;
}
/** カレンダーピッカー */
/* トリガーの背景画像を別の画像に変更する */
.ui-datepicker-trigger {
	background-image: url('path/to/your/custom-icon.png'); /* カスタムアイコンのパスを指定 */
	background-size: 16px 16px; /* アイコンのサイズに合わせて調整 */
	background-repeat: no-repeat;
	background-position: center;
	border: none; /* 必要に応じてボーダーを削除 */
	cursor: pointer; /* カーソルをポインターに */
}

/* 既存のスタイルを無効化する場合 */
.ui-datepicker-trigger {
	width: 20px; /* 任意の値 */
	height: 20px; /* 任意の値 */
	/* 他にもmargin, paddingなど調整 */
}