@charset "utf-8";

/* ----- nakamura settings */
/* ===== dom */
h1,h2,h3,h4 {line-height: 1.6;}
h1 {
	padding: .42rem 0 .42rem 3rem;
	/* height: 48px; */
	font-size: 140%;
	border-bottom: 3px solid #222;
	background: url("../images/bg-h1.jpg") 0 0 no-repeat;}
h1.toplevel {margin: 0 0 20px 0;}
h2 {
	margin:1rem 0;
	padding: 0 0 0 70px;
	color: #222;
	font-size: 130%;
	background: url("../images/bg-h2.jpg") 0 0 no-repeat;}
h3 {
	padding: 6px 0 6px 12px;
	font-size: 110%;
	border-left: 2px solid #222;}
h4 {margin: 1rem 0;}
.infobox h2,.infobox h3 {margin: 0 0 10px 0;}
a {
	color: #222;
	text-decoration: none;}
a:hover {color: #0080b9;}
a img:hover {
	opacity: 0.70;
	filter: alpha(opacity =70);}
.contents a {color: #0080b9;}
.contents a:hover {color: #222;}
ul,ol {
	margin: 0 0 0 24px;
	padding: 0;}
header {margin-bottom: 20px;}
.mreset {margin: 0!important;}
.navblock {
	width: 150px;
	margin: 0 10px 6px 0;
	padding: 5px 10px;
	color: #fff!important;
	font-size: 95%;
	text-align: center;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	display: inline-block;}

.txt-w {color: #fff;}
.emp {color: #ff6817;}

.w20per {width: 20%;}
.w30per {width: 30%;}
.w40per {width: 40%;}
.w60per {width: 60%;}
.w70per {width: 70%;}
.w80per {width: 80%;}

/* ===== header */
.headarea {position: relative;}
.glnav {background: #f2f2f2;}
.glnavarea {width: 1152px;margin: 0 auto;background: url("../images/bg-glnav.png") 0 0 no-repeat;}
.glnavset {
	width: 136px;
	height: 100px;
	margin: 0 8px 0 0;
	vertical-align: bottom;
	display: inline-block;
	text-indent: -9999px;
	white-space: nowrap;
	overflow: hidden;}
.glnavset:last-child {margin-right: 0;}
.glnavset.home {background:  url("../images/glnav-home.png") top left no-repeat;}
.glnavset.about {background:  url("../images/glnav-about.png") top left no-repeat;}
.glnavset.member {background:  url("../images/glnav-member.png") top left no-repeat;}
.glnavset.publish {background:  url("../images/glnav-publish.png") top left no-repeat;}
.glnavset.award {background:  url("../images/glnav-award.png") top left no-repeat;}
.glnavset.album {background:  url("../images/glnav-album.png") top left no-repeat;}
.glnavset.access {background:  url("../images/glnav-access.png") top left no-repeat;}
.glnavset.joinus {background:  url("../images/glnav-joinus.png") top left no-repeat;}
.glnavset:hover,.about-page .glnavset.about.active,
.member-page .glnavset.member.active,
.publish-page .glnavset.publish.active,
.award-page .glnavset.award.active,
.album-page .glnavset.album.active,
.access-page .glnavset.access.active,
.joinus-page .glnavset.joinus.active
{background-position: bottom left;}
.pagenav a {
	margin: 5px 3px 0 0;
	padding: 6px 20px 6px 6px;
	font-size: 80%;
	border: 2px solid #ddd;
	background: url("../images/icon-pagenav.png") right no-repeat;
	display: inline-block;}

/* ===== main */
.homeinfo {background: #ddd;}
.homeinfoarea {background: url("../images/bg-information.jpg") 0 0 no-repeat;}
.homeinfotext {width: 1000px;margin: 0 auto;padding: 4.5em 0 2em 0;}
.date {
	margin: 0 10px 0 0;
	padding: 2px 4px 0 4px;
	color: #222;
	font-size: 80%;
	text-align:right;
/* 	background: #fff; */}
.crumb {margin: 10px 0;}
.crumb a {
	margin: 0 10px 0 0;
	padding: 0 0 0 20px;
	font-size: 90%;
	background: url("../images/icon-crumb.png") 0 8px no-repeat;
	display: inline-block;}
.infobox {
	padding: 6px;
	font-size: 90%;
	border: 2px solid #ddd;}
.photosarea {width: 100%;}
.photosarea img.thumb {
	width: 92%;
	padding: 2px;
	border: 1px solid #ddd;}
.members ul li {width:31%;margin: .5rem;padding: .5rem;display: inline-block;}
.home-page .listview {display: none;}
/* =============== csvtable */
table.csv2table-table {border-collapse:collapse;}
th.csv2table-table-th {display: none;}
td.csv2table-table-td {text-align: center!important;}

/* ===== side */


/* ===== main */
.papers ol {display: none;}
/* ---------- this year settings */
.papers ol.now {display: block;}
.buttonset {
	margin: 0;
	padding: 6px 8px;
	color: #fff;
	font-size: 70%;
	border: 0;
	background: #222;}


/* ===== footer */
.footset {
	font-size: 90%;
	border-top: 5px solid #222;}
.ptbox {margin: 50px 0 0 0;}

/* ===== add 2023 */
iframe {width: 100%;height: 300px;}
.logoset {text-align: center;z-index: 9999;}
.logosub {right: 0;bottom: 0;font-size: 70%;font-weight: bold;text-align: right;line-height: 1.6;position: absolute;}
.infolist {margin: 6px 0 0 0;display: flex;align-items:flex-start;}
.infolist p {width: 10%;}
.infolist a {width: 90%;display: block;}
.navsmalltxt {font-size:80%;letter-spacing: .5rem;}
.btnnav {margin:.3em;padding: 1rem 1.3rem;color: #fff!important;font-size: 80%;font-weight: bold;line-height: 1.1;background: #000;display: inline-block;}
.btnnav:hover {color: #fff;}
.information-page .btnnav {display: none;}
.spaces {margin:2rem 0;}


/* ===== option */
.colcontents {display: flex;}


@media screen and (max-width:668px) {
	.logoset {top: 0;left: 0;width:20vw;position: fixed;}
	.logoset img {width: 100%;padding: .5rem;background: #fff;display: block;}
	.logoset img:hover {opacity: 1;}
	.logosub {right: 0;top: 5em;}
	.glnavarea {width: 100%;margin: 0 auto;background: url("../images/bg-glnav.png") 0 0 no-repeat;}
	.homeinfotext {width: 96%;padding: 4.5em 0 2em 0;}
	.infolist p {width: 23%;}
	.infolist p.plusdate {width:28%;}
	.infolist a {width: 77%;}
	.infolist a.plusdate {width: 72%;}
	.colcontents {display: block;}
/*
	.infolist {width:100%;display: block;}
	.infolist p {width: auto;display: inline-block;}
	.infolist p.plusdate {width:21%;}
*/
	.date {float: none;}
	.members ul li {width:41%;margin: .2rem;padding: .2rem;}
	.areamain img.spimg {width: 60%;margin: 1rem auto;display: block;}
	.footnav {width: 90%;margin: 1rem auto;text-align: left;}
	.footnav a {width: 100%;padding: .8rem;border-bottom: 1px solid #ccc;display: block;position: relative;}
	.footnav a:after {
		content: "";
		top:38%;
		right: 10px;
		width: 8px;
		height: 8px;
		border-top: 1px solid #333;
		border-right: 1px solid #333;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		position: absolute;}

	#spnavbtn {
        top:10px;
        right: 10px;
        width: 48px;
        height: 48px;
        cursor: pointer;
        position:fixed;
        z-index: 1000;
        background:#fff;
        border-radius: 6px;
    }
    #spnavbtn span{
        left: 27%;
        width: 50%;
        height: 3px;
        border-radius: 3px;
        background-color: #666;
        display: inline-block;
        transition: all .4s ease-out;
        position: absolute;
    }
    #spnavbtn span:nth-of-type(1) {top:15px; }
    #spnavbtn span:nth-of-type(2) {top:23px;}
    #spnavbtn span:nth-of-type(3) {top:31px;}
    #spnavbtn.activenav span:nth-of-type(1) {
        top: 16px;
        left: 12px;
        width: 55%;
        transform: translateY(6px) rotate(-45deg);
    }
    #spnavbtn.activenav span:nth-of-type(2) {
        opacity: 0;
    }
    #spnavbtn.activenav span:nth-of-type(3){
        top: 28px;
        left: 12px;
        width: 55%;
        transform: translateY(-6px) rotate(45deg);
    }
    #overray {transition:all .5s  ease-out;}
    .overray {top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);opacity:1;position:fixed;pointer-events:none;}
	#glnavlist {top: 0;left: 200%;width: 100%;height: 100%;padding:8rem .8rem .8rem;background:#fff;box-sizing: border-box; z-index:999;transition:all 0.3s ease-out;overflow:auto;position:fixed;}
    #glnavlist.panelactive {left: 0;}
	#glnavlist a {margin: .3rem;padding: .5rem .8rem;border-bottom: 1px solid #ccc;display: block;position: relative;}
    #glnavlist a:after {
	content: "";
	top:38%;
	right: 10px;
	width: 8px;
	height: 8px;
	border-top: 1px solid #333;
	border-right: 1px solid #333;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	position: absolute;}
}