@charset "UTF-8";


.header{
	margin:0 auto 20px;
	background-color:#fafafa;
	box-shadow:0 0 10px #333;
	padding:8px 0;
	height:48px;
}
@media (max-width:480px){
	.header{
		height:32px;
	}
}

.header .header-wrap{
	margin:0 auto;
	padding:0 10px;
	max-width:940px;
	position:relative;
}
.header .header-wrap .hw_left{
	float:left;
}
.header .header-wrap .hw_left .btn-tool{
	float:left;
}
.header .header-wrap .hw_left .btn-tool .acdn_h_ex1{
	width:48px;
	height:48px;
}
@media (max-width:480px){
	.header .header-wrap .hw_left .btn-tool .acdn_h_ex1{
		width:32px;
		height:32px;
	}
}

.header .header-wrap .hw_left .btn-tool .acdn_h_ex1 img{
}
.header .header-wrap .hw_left .head-ttl{
	float:left;
}
.header .header-wrap .hw_left .head-ttl .inner{
	font-size:24px;
	height:48px;
	line-height:48px;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
@media (max-width:480px){
	.header .header-wrap .hw_left .head-ttl .inner{
		font-size:16px;
		height:32px;
		line-height:32px;
	}
}


.header .header-wrap .hw_right{
	float:right;
	width:48px;
	height:48px;
}

@media (max-width:480px){
	.header .header-wrap .hw_right{
		width:32px;
		height:32px;
	}
}

.header .header-wrap .tool-menu{
position:absolute;
bottom:0;
top:64px;
z-index:2;
}
.header .header-wrap .tool-menu ul{
	width:300px;
	background-color:#333;
	border:solid 1px #ccc;
	border-radius:5px;
}
.header .header-wrap .tool-menu ul li{
	border-bottom:solid 1px #ccc;
}
.header .header-wrap .tool-menu ul li.last{
	border-bottom:none;
}
.header .header-wrap .tool-menu ul li a{
	text-align:center;
	display:block;
	color:#fff;
	padding:4px;
}

.btn_newkarte{
	margin:20px auto;
	width:280px;
	
}

.btn_newkarte a{
	display:block;
	text-align:center;
	background-color:#6E963E;
	border-radius:5px;
	color:#fff;
	font-size:24px;
	border:solid 2px #6E963E;
	box-shadow:0 18px 18px #90C54F inset;
}



.karte-box{
	max-width:746px;
	margin:0 auto 30px;
	border:solid 1px #3442bd;
	background-color:#fff;
	border-radius:5px;
	box-shadow:0 0 5px #ccc;
	padding:10px;
}
@media (max-width:480px){
	.content{
		width:100%;
		padding:0;
	}
	.karte-box{
		margin:0 auto 30px;
		border-top:solid 1px #3442bd;
		border-bottom:solid 1px #3442bd;
		border-left:none;
		border-right:none;
		background-color:#fff;
		border-radius:0;
		box-shadow:0 0 5px #ccc;
		padding:10px;
	}
}

.karte-box .karte-head{
	position:relative;
	padding-right:80px;
}
@media (max-width:480px){
	.karte-box .karte-head{
		position:relative;
		padding-right:32px;
	}
}

.karte-box .karte-head .face-icon{
	width:80px;
	height:80px;
	float:left;
}
.karte-box .karte-head .face-icon img{
}

@media (max-width:480px){
		.karte-box .karte-head .face-icon{
		width:48px;
		height:48px;
	}
}

.karte-box .karte-head .auth-info{
	padding:0 10px;
	margin-left: 80px;
}
@media (max-width:480px){
	.karte-box .karte-head .auth-info{
		margin-left:48px;
	}

}

.karte-box .karte-head .auth-info span.author-name,
.karte-box .karte-head .auth-info span.auth-date,
.karte-box .karte-head .auth-info span.zone-number{
	display:block;
	line-height:1.2;
}
.karte-box .karte-head .auth-info span.author-name{
	font-size:18px;
	font-weight:bold;
}
@media (max-width:480px){
	.karte-box .karte-head .auth-info span.author-name{
		font-size:14px;
	}
}


.karte-box .karte-head .auth-info span.auth-date{
	color:#493;
	font-weight:bold;
}
.karte-box .karte-head .auth-info span.auth-date span,
.karte-box .karte-head .auth-info span.zone-number span{
	display: inline-block;
}
.karte-box .karte-head .auth-info span.zone-number{
}
@media (max-width:480px){
	.karte-box .karte-head .auth-info span.auth-date,
	.karte-box .karte-head .auth-info span.zone-number{
		font-size:14px;
	}
	.karte-box .karte-head .auth-info span.auth-date span,
	.karte-box .karte-head .auth-info span.zone-number span{
		display:block;
	}

}

.karte-box .karte-head .incident{
	padding:3px 10px;
	margin-left: 80px;
}
@media (max-width:480px){
	.karte-box .karte-head .incident{
		font-size:14px;
		padding:3px 10px;
		margin-left:48px;
	}

}

.karte-box .karte-head .comment_counter{
	margin-left: 80px;
	font-size:14px;
	padding:0 10px;
}

@media (max-width:480px){
	.karte-box .karte-head .comment_counter{
		font-size:12px;
		margin-left:48px;
	}

}

.karte-box .karte-head .mov_photo{
	position:absolute;
	top:0;
	right:0;
}
.karte-box .karte-head .mov_photo a{
	width:78px;
	height:78px;
	border:solid 1px #ccc;
	overflow:hidden;
	text-align:center;
	display:block;
	position:relative;
}


.karte-box .karte-head .mov_photo a img{
	height:80px;
	width:auto;
	max-width:none;
	display:block;
	top: -100%;
	left: -100%;
	right: -100%;
	bottom: -100%;
	margin: auto;
	position:absolute;
}
.karte-box .karte-head .mov_photo a img.btn_movplay{
	height:80px;
	width:auto;
	max-width:none;
	display:block;
	top:0;
	left:0;
	right:0;
	bottom:0;
	position:absolute;
}
@media (max-width:480px){
	.karte-box .karte-head .mov_photo a{
		width:30px;
		height:30px;
	}
	.karte-box .karte-head .mov_photo a img{
		height:32px;
	}
	.karte-box .karte-head .mov_photo a img.btn_movplay{
		height:32px;
	}
}


.karte-box .karte-head .mov_photo a.photo img.btn_movplay{
	display:none !important;
}


.karte-box .karte-body{
	position:relative;
	padding-bottom:30px;
	margin-top:10px;
}
.karte-box .karte-body .btn{
	width:200px;
	font-size:18px;
	text-align:center;
	background-color:#08c;
	position:absolute;
	bottom:0;
	right:0;
	color:#fff;
	border-radius:5px;
}
@media (max-width:480px){
	.karte-box .karte-body .btn{
		font-size:16px;
	}
}

.karte-box .karte-body .btn span.btn_open{
	display:block;
}
.karte-box .karte-body .btn span.btn_close{
	display:none;
}
.selected span.btn_open{
	display:none !important;
}
.selected span.btn_close{
	display:block !important;
}



.karte-box .karte-body .ko_wrap{
	
}
.karte-box .karte-body .ko_wrap .karte-outline{
	font-size:24px;
}
@media (max-width:480px){
	.karte-box .karte-body .ko_wrap .karte-outline{
		font-size:16px;
	}
}


.karte-box .karte-body .ko_wrap .karte-outline dt{
	width:6em;
	float:left;
	clear:left;
}
.karte-box .karte-body .ko_wrap .karte-outline dd{
	font-weight:bold;
	margin-left:6em;
}
.karte-box .karte-body .ko_wrap .karte-outline dd *{
	font-weight:bold;
}

.incident span{
	padding:2px 3px;
}

.incident .lv_0{
	background-color:#fff;
	color:#000;
}
.incident .lv_1{
	background-color:#4c9ed9;
	color:#fff;
}
.incident .lv_2{
	background-color:#39c229;
	color:#fff;
}
.incident .lv_3{
	background-color:#ff3;
	color:#000;
}
.incident .lv_4{
	background-color:#f00;
	color:#fff;
}








.comment-box .comment-wrap{
	max-width:700px;
	margin:0 auto;
	border-radius:5px;
	padding:10px;
}
.comment-box .comment-wrap .comment-head{
	position:relative;
	padding-right:48px;
	margin-bottom:10px;
}
@media (max-width:480px){
	.comment-box .comment-wrap{
		padding:10px 0;
	}

	.comment-box .comment-wrap .comment-head{
		padding-right:32px;
	}
}

.comment-box .comment-wrap .comment-head .face-icon{
	width:48px;
	height:48px;
	float:left;
}
@media (max-width:480px){
	.comment-box .comment-wrap .comment-head .face-icon{
		width:32px;
		height:32px;
	}
}

.comment-box .comment-wrap .comment-head .face-icon img{
}

.comment-box .comment-wrap .comment-head .auth-info{
	padding:0 10px;
	margin-left: 48px;
}
@media (max-width:480px){
	.comment-box .comment-wrap .comment-head .auth-info{
		margin-left:32px;
	}
}

.comment-box .comment-wrap .comment-head .auth-info span.author-name,
.comment-box .comment-wrap .comment-head .auth-info span.auth-date,
.comment-box .comment-wrap .comment-head .auth-info span.zone-number{
	display:block;
}
.comment-box .comment-wrap .comment-head .auth-info span.author-name{
	font-size:16px;
	font-weight:bold;
}
.comment-box .comment-wrap .comment-head .auth-info span.auth-date{
	font-size:14px;
	color:#493;
	font-weight:bold;
}
@media (max-width:480px){
	.comment-box .comment-wrap .comment-head .auth-info span.author-name{
		font-size:14px;
	}
	.comment-box .comment-wrap .comment-head .auth-info span.auth-date{
		font-size:12px;
	}
}

.comment-box .comment-wrap .comment-head .incident{
	padding:3px 10px;
	margin-left: 48px;
}


.comment-box .comment-wrap .comment-head .mov_photo{
	position:absolute;
	top:0;
	right:0;
}
.comment-box .comment-wrap .comment-head .mov_photo a{
	width:46px;
	height:46px;
	border:solid 1px #ccc;
	overflow:hidden;
	text-align:center;
	display:block;
	position:relative;
}
.comment-box .comment-wrap .comment-head .mov_photo a img{
	height:48px;
	width:auto;
	max-width:none;
	display:block;
	top: -100%;
	left: -100%;
	right: -100%;
	bottom: -100%;
	margin: auto;
	position:absolute;
}
.comment-box .comment-wrap .comment-head .mov_photo a img.btn_movplay{
	height:48px;
	width:auto;
	max-width:none;
	display:block;
	top:0;
	left:0;
	right:0;
	bottom:0;
	position:absolute;
}
@media (max-width:480px){
	.comment-box .comment-wrap .comment-head .mov_photo a{
		width:30px;
		height:30px;
	}
	.comment-box .comment-wrap .comment-head .mov_photo a img{
		height:32px;
	}
	.comment-box .comment-wrap .comment-head .mov_photo a img.btn_movplay{
		height:32px;
	}
}
.comment-box .comment-wrap .comment-head .mov_photo a.photo img.btn_movplay{
	display:none !important;
}


.comment-box .comment-wrap .comment-body{
	background-color:#d6f1ff;
	border-radius:5px;
	padding:5px;
}
@media (max-width:480px){
	.comment-box .comment-wrap .comment-body{
		font-size:14px;
	}
}
.comment-box .comment-wrap .comment-body .coll-ellipsis,
.comment-box .comment-wrap .comment-body .coll-ellipsis + a{
	color:#999;
}

.comment-box .btn_comment{
	margin:20px auto;
	width:240px;
}
.comment-box .btn_comment a{
	display:block;
	text-align:center;
	background-color:#4f5bc5;
	border-radius:5px;
	color:#fff;
	font-size:20px;
	border:solid 2px #3442bd;
	box-shadow:0 18px 18px #5765da inset;
}
.comment-box .btn_printout{
	margin:20px auto;
	width:240px;
}
.comment-box .btn_printout a{
	display:block;
	text-align:center;
	background-color:#ccc;
	border-radius:5px;
	color:#333;
	font-size:20px;
	border:solid 2px #aaa;
	box-shadow:0 18px 18px #eee inset;
}


.staff001 .staff001 .comment-body,
.staff002 .staff002 .comment-body,
.staff003 .staff003 .comment-body,
.staff004 .staff004 .comment-body,
.staff005 .staff005 .comment-body,
.staff006 .staff006 .comment-body,
.staff007 .staff007 .comment-body,
.staff008 .staff008 .comment-body,
.staff009 .staff009 .comment-body,
.staff010 .staff010 .comment-body,
.staff011 .staff011 .comment-body,
.staff012 .staff012 .comment-body,
.staff013 .staff013 .comment-body,
.staff014 .staff014 .comment-body,
.staff015 .staff015 .comment-body,
.staff016 .staff016 .comment-body,
.staff017 .staff017 .comment-body,
.staff018 .staff018 .comment-body,
.staff019 .staff019 .comment-body,
.staff020 .staff020 .comment-body,
.staff021 .staff021 .comment-body,
.staff022 .staff022 .comment-body,
.staff023 .staff023 .comment-body,
.staff024 .staff024 .comment-body,
.staff025 .staff025 .comment-body,
.staff026 .staff026 .comment-body,
.staff027 .staff027 .comment-body,
.staff028 .staff028 .comment-body,
.staff029 .staff029 .comment-body,
.staff030 .staff030 .comment-body{
	background-color:#b2ec03;
}



/*

.comment-write{
	position:fixed;
	bottom:0;
	left:0;
	width:100%;
	max-height:180px;
	min-width:320px;
	padding:6px 0;
	background-color:#eee;
	box-shadow:0 0 8px #333;
}
*/
.comment-write{
	width:100%;
	max-height:180px;
	padding:6px 0;
	background-color:#dbf;
	border-radius:5px;
}

.comment-write .cw_wrap{
	max-width:690px;
	margin:0 auto;
	padding:0 10px;
}

.comment-write .cw_wrap .comment_text{
}
.comment-write .cw_wrap .comment_text .text-input{
	width:100%;
	height: 7.5em;
	max-width:690px;
	resize:none;
	box-sizing:border-box;
}

@media (max-width:480px){
	.comment-write .cw_wrap .comment_text .text-input{
		resize:none;
		height: 5em;
		font-size:14px;
	}
}

.comment-write .cw_wrap .comment_btns{
}

.comment-write .cw_wrap .comment_btns .file_uploader{
	margin:5px auto;
	width:280px;
	float:left;
}
.comment-write .cw_wrap .comment_btns .file_uploader label{
	padding:4px 0 4px 40px;
	width:240px;
	display:block;
	height:22px;
	background-color:#fff;
	border:solid 1px #333;
	background-image:url(/img/icon_camera.png);
	background-repeat:no-repeat;
	background-position:left;
	font-size:12px;
}
.comment-write .cw_wrap .comment_btns .file_uploader input{
	width:240px;
	height:22px;
	font-size:12px;
	cursor:pointer;
}

.comment-write .cw_wrap .comment_btns .submiter{
	margin:5px auto;
	width:160px;
	float:right;
}
.comment-write .cw_wrap .comment_btns .submiter input{
	display:block;
	width:156px;
	text-align:center;
	background-color:#4f5bc5;
	border-radius:5px;
	color:#fff;
	height:32px;
	line-height:50%;
	font-size:20px;
	border:solid 2px #3442bd;
	box-shadow:0 18px 18px #5765da inset;
	padding:0;
	margin:0;
	cursor:pointer;
}


.comment-page{
	padding-bottom:192px;
}


.list-page .karte-head > a{
	color:#333;
}




.printout-page{
	background-color:#fff;
}
.printout-page .content{
	margin:0 auto;
}

.printout-page .printout-head{
	font-size:32px;
	text-align:center;
	font-weight:bold;
	margin-bottom:20px;
}
.printout-page .head-note{
	max-width:766px;
	margin:0 auto;
	text-align:right;
}
.printout-page .head-note .number{
	float:right;
}
.printout-page .head-note .incident{
	float:left;
}

.printout-page .karte-box .karte-head .auth-info,
.printout-page .karte-box .karte-head .incident{
	padding: 0 10px;
	margin-left:0;
}

.printout-page .auth-info .auth-date{
	color:#444 !important;
}

.printout-page .karte-box{
	border:none;
	margin:0 auto;
	padding:0;
	box-shadow:none;
}

.printout-page .karte-head,
.printout-page .ko_wrap{
	border:solid 2px #000;
	margin-bottom:20px;
}
.printout-page .karte-head th,
.printout-page .ko_wrap th{
	font-size:16px;
	font-weight:bold;
	border:solid 1px #000;
	padding:3px 5px;
	width:8em;
	
}
.printout-page .karte-head td,
.printout-page .ko_wrap td{
	font-size:18px;
	border:solid 1px #000;
	padding:3px 5px;
}
.printout-page .incident *{
	color:#444;
	background-color:#fff;
}
.printout-page .ko_wrap{
	margin-bottom:30px;
}

.printout-page .mov_photo{
	max-height:240px;
	text-align:center;
}
.printout-page .mov_photo img{
	max-height:240px;
}

.printout-page .stanpbox{
	margin-top:20px;
float:right;
width:210px;
}
.printout-page .stanpbox th,
.printout-page .stanpbox td{
	font-size:16px;
	font-weight:bold;
	border:solid 1px #000;
	
}

.printout-page .stanpbox th{
	width:30px;
	text-align:center;
	vertical-align:middle;
}
.printout-page .stanpbox td{
	width:60px;
	height:60px;
}
