@charset "utf-8";
/* CSS Document */

/* --- CSSリセット ここから --- */
button{
	background:transparent;	
	border:0;
	font-size:1.6rem;
	margin:0;
	outline:0;
	vertical-align:baseline;
}
/* --- CSSリセット ここまで --- */

/* --- 全ページ共通 ここから --- */
html{
	overflow-y:scroll;
	font-size:62.5%;
}

html,body{
	height:100%;
}

body{
	-webkit-text-size-adjust:100%;
	background:#F8F8F8;
	color:black;
	font-family:"游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
	font-size:1.4rem;
	margin:0;
	padding:0;
	text-decoration:none;
}

h1,h2,h3{
	margin:0.5rem 0;
}

* a{
	text-decoration:none;
}

header a,footer a{
	color:white;
}

footer{
	background:#222;
	color:#ccc;
	font-size:1.2rem;
	padding:5px 0;
	text-align:center;
}

form{
	margin:0;
	padding:0;
}

input[type="text"],input[type="password"]{
	height:32px;
	border:#CCC 1px solid;
	border-radius:3px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	font-size:1.6rem;
	padding:4px 4px;
}

textarea{
	border:#CCC 1px solid;
	border-radius:3px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	height:5rem;
	padding:4px 4px;
	width:90%;
}

.clearDiv{
	float:none;
	clear:both;
}

.width100{
	width:100%;
}

.paddingContents{
	padding:10px;
}

.alignCenter{
	text-align:center;
}

.alignLeft{
	text-align:left;
}

.btnColor-LightBlue{
	background:#55acee;
	color:white;
}

.btnBlock{
	display:block;
}

.btnColor-LightGray{
	background:#666;
	color:white;
}

.btnColor-Transparent{
	background-color:rgba(0,0,0,0.3);
	border:white 1px solid;
	color:white;
}

.btnColor-Red{
	background:#903;
	color:white;
}

.btnBig{
	border-radius:3px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	font-size:2.0rem;
	padding:11px 15px;
}

.btnLogin{
	float:right;
}

.btnLogout{
	float:right;
}

.btnSearch,.btnLanguage{
	float:right;
	margin-right:3px;
}

.colorRed{
	color:red;
}

.colorBlack{
	color:black;
}

.fontSmall{
	font-size:1.2rem;
	line-height:1.2rem;
}

.wordBreak{
	word-break:break-all;
}

.fontBold{
	font-weight:bold;
}

.boxCatch{
	background-size:cover;
	background-position:center;
	color:white;
	display:block;
	text-align:center;
}

.imgTwitterProfileIcon{
	float:left;
	margin-right:3px;
	vertical-align:middle;
}

.spaceRow{
	display:block;	
	height:2rem;
}

.spaceHalfRow{
	display:block;	
	height:1rem;
}
/* --- 全ページ共通 ここまで --- */

/* ---トップページ用 ここから--- */
.boxCatchTop{
    background-image:url('/resources/images/catch_top.jpg');
	padding-top:10px;
	padding-bottom:3rem;
}

.btnCatchTop{
	padding:10px 15px;
}

.cellResource{
	color:white;
	background:#666;
	padding:5px;
	vertical-align:top;
}

.strResourceValue{
	font-family:"Teko", sans-serif;
	font-size:2.8rem;
	line-height:2.8rem;
}

.boxResourceIcon{
	background-color:rgba(255,255,255,0.2);
	border-radius:50px;
	-moz-border-radius:50px;
	-webkit-border-radius:50px;
	font-size:50px;
	height:100px;
	line-height:100px;
	margin:10px auto;
	width:100px;
}
/* ---トップページ用 ここまで--- */

/* ---ボックス表示・編集用 ここから--- */
.boxCatchBoxShow{
	background-color:rgba(0,0,0,0.7);
	display:block;
	padding:10px;
}

.boxCatchBoxShow{
}

.boxCatchBoxShow ul{
	list-style:none;
	-webkit-padding-start:0;
}

.boxCatchBoxShow ul li{
	display:inline-block; 
	padding:5px;
	vertical-align:top;
}

.boxCatchBoxShow a{
	color:white;
	display:inline-block;
}
.gridBoxMenu{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-around;
}
.gridBoxMenuItem{
}
#imgQRCode{
	background-image: url("/resources/images/box.gif");
	background-size:100px 100px;
}
/* ---ボックス表示・編集用 ここまで--- */

/* --- ボックス編集用 ここから--- */
.boxAccessRestriction{
	text-align:left;
	padding:4px 4px;
	display:block;
	width:90%;
	margin:0 auto;
	border:#CCC 1px solid;
	border-radius:3px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	margin-bottom:3px;
}
/* --- ボックス編集用 ここまで--- */

/* --- ボックス編集・検索用 ここから--- */
#suggest {
	text-align:left;
	position:absolute;
	background-color:#FFFFFF;
	border:1px solid #CCCCFF;
	font-size:1.2rem;
	width:200px;
}
#suggest div {
	display:block;
	width:200px;
	overflow:hidden;
	white-space:nowrap;
	font-size:1.0rem;
	padding:3px 0;
}
#suggest div.select{ /* keydown, keyup */
	color:#FFFFFF;
	background-color:#3366FF;
}
#suggest div.over{ /* mouse over */
	background-color:#99CCFF;
}
/* --- ボックス編集・検索用 ここまで--- */

/* --- ボックス検索用 ここから --- */
.boxSearch{
	background:white;
	margin-bottom:10px;
}

.boxUserProfile{
	background:white;
	border:1px solid #ccc;
	border-radius:3px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	box-shadow:0 2px 1px #eee;
	font-size:1.4rem;
	margin:0 0 10px 0;
	padding:10px;
	text-align:left;
}
/* --- ボックス検索用 ここまで --- */

/* --- ボックス一覧用 ここから --- */
.gridBox{
	display:flex;
	flex-wrap:wrap;
}
.gridBoxItem{
	width:calc(20% - 5px);
	margin:0 5px 5px 0;
	border-radius:3px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	border:1px solid #ccc;
	background:white;
	box-shadow:0 2px 1px #eee;
	text-align:left;
	padding:10px;
	font-size:1.4rem;
}
.gridBoxItemThumbnail{
	width:100%;
}
/* --- ボックス一覧用 ここまで --- */

/* --- ダウンロード用 ここから --- */
.boxDownloadSize,.boxShareTo{
	color:black;
	text-align:left;
	padding:4px 4px;
	display:block;
	width:90%;
	margin:0 auto;
	border:#CCC 1px solid;
	border-radius:3px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	margin-bottom:3px;
}

.white-popup {
	position:relative;
	background:#FFF;
	padding:10px;
	width:auto;
	max-width:500px;
	text-align:center;
	margin:auto auto;
	z-index:2000;
}
.pswp__caption__center{
	max-width:600px;
}
/* --- ダウンロード用 ここまで --- */

/* --- 写真表示用 ここから --- */
.pswp__caption__center ul{
	list-style:none;
	-webkit-padding-start:0;
	margin:0;
}

.pswp__caption__center ul li{
	display:inline-block; 
	padding:5px;
	vertical-align:top;
}

.pswp__caption__center a{
	color:white;
	text-decoration:none;
}

figure{
	padding:0;
	margin:0;
}
/* --- 写真表示用 ここまで --- */
