@charset "UTF-8";

/* @import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css); */


/* General */

* {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	padding: 0;
	line-height: 1.8;
	font-size: 16px;
	font-family: -apple-system/*, 'Noto Sans Japanese', */, sans-serif;
	letter-spacing: -.02em;
	color: #333;
	background: #eee;
	word-wrap: break-word; /* Old name, for compatibility */
	overflow-wrap: break-word;
}

a {
	color: #0070c9;
	font-weight: bold;
	text-decoration: none;
}

a:active {
	color: #005396;
}

a:visited {
	color: #659cc9;
}

a:visited:active {
	color: #4b7596;
}

img {
	max-width: 100%;
}

div {
	margin: 0;
	padding: 0;
}

h1 {
	font-family: system-ui/*, 'Noto Sans Japanese', */, -apple-system, sans-serif;
	font-size: 30px;
	line-height: 1.4;
	letter-spacing: -.03em;
}

h2 {
	font-family: system-ui/*, 'Noto Sans Japanese', */, -apple-system, sans-serif;
	font-size: 24px;
	line-height: 1.5;
	letter-spacing: -.03em;
}

h3 {
	font-size: 20px;
	line-height: 1.5;
	letter-spacing: -.03em;
}

hr {
	display: block;
	width: 100%;
	height: 1px;
	background: #ccc;
	border: none;
	margin-top: 3em;
	margin-bottom: 3em;	
}

pre {
	overflow-x: auto;
	line-height: 1.4 !important;
}

pre code {
	word-wrap:normal;
	overflow-wrap: normal; /* Old name, for compatibility */
}

.invoker {
	display: inline-block;
	padding: 6px 40px;
	border: 1px solid #cc0000;
	font-size: 18px;
	font-weight: normal;
	border-radius: 3px;
	color: #cc0000;
	line-height: 1.3;
}

.invoker:active {
	color: #cc0000 !important;
	background: #eee;
}

.invoker:visited {
	color: #cc0000 !important;
}

.linkarrowed, /* linkarrowed is just for backward compatibility. User arrowed.  */
.arrowed {
	color: #0070c9;
	padding-right: 20px;
	background-image: url(/assets/images/icon-chevron-blue-east.svg);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: 12px;
	font-weight: normal;
}

.arrowed:visited {
	color: #0070c9;
}

.arrowed-white {
	color: white;
	background-image: url(/assets/images/icon-chevron-white-east.svg);
}

.arrowed-white:active, .arrowed-white:visited {
	color: white;
}

.arrowed-black {
	color: black;
	background-image: url(/assets/images/icon-chevron-black-east.svg);
}

.arrowed-black:active, .arrowed-black:visited {
	color: black;
}

.arrowedrev {
	color: #0070c9;
	padding-left: 20px;
	background-image: url(/assets/images/icon-chevron-blue-west.svg);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 12px;
	font-weight: normal;
}

.arrowedrev:visited {
	color: #0070c9;
}

.arrowedrev-black {
	color: black;
	background-image: url(/assets/images/icon-chevron-black-west.svg);
}

.arrowedrev-black:active, .arrowedrev-black:visited {
	color: black;
}

.messagingtitle { /* 404 and /contact/thanks/ page */
	font-size: 30px;
	line-height: 1.3;
	letter-spacing: -.03em;
	text-align: center;
	font-weight: normal !important;
	margin-top: 60px !important;
	color: #000 !important;
}


/* Contact Form */

.contactform {
	background: #f6f6f6;
	margin-top: 30px;
	margin-bottom: 20px;
	padding-top: 20px;
	padding-bottom: 30px;
	max-width: 100% !important;
}

.contactformlabel {
	font-size: 15px;
	font-weight: bold;
	color: #777;	
}

.contactform input,
.contactform textarea {
	padding: 6px 10px;
	background-color: #fff;
	border: 1px solid #bbb;
	border-radius: 3px;
}

.contactform input {
	font-size: 17px;
	width: 100%;
	max-width: 400px;
	margin-bottom: 14px;
}

.contactform .inputlong {
	max-width: 100%;
}

.contactform textarea {
	font-size: 15px;
	width: 100%;
	height: 300px;
	line-height: 1.7;
	margin-bottom: 10px;
}

.contactform select {
	font-size: 15px;
	height: 26px;
	border: 1px solid #aaa;
	margin-bottom: 14px;
}

.invokerbound {
	margin-top: 10px;
	text-align: center;
}

.contactform button {
	padding: 8px 50px;
	background: #999;
	font-size: 16px;
	line-height: 1;
	border-radius: 24px;
	color: #fff;
	border: none;
}

.contactform button:enabled:active {
	background: #666;
}

.contactform button:disabled {
	opacity: 0.4;
}

@media screen and (max-width:480px) { 

	.contactformbound {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

}


/* Base */

#base {
	position: relative;
}


/* Content */

.content {
	background-color: #fff;
	padding-top: 44px;
}


/* Layout Guide */

.layoutguide {
}

.layoutguide > * {
	width: 100%;
	max-width: 980px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 20px;
	padding-right: 20px;
	padding-left: calc(20px + env(safe-area-inset-left));
	padding-right: calc(20px + env(safe-area-inset-right));
}

.layoutguide > ul,
.layoutguide > ol {
	padding-left: 50px;
	padding-left: calc(50px + env(safe-area-inset-left));
}

.layoutguide > table {
	/* Needed because table expands ignoring parent's paddings */
	max-width: 900px;
}

.layoutguide-readable > * {
	max-width: 700px;
}

.layoutguide-readable > p {
	line-height: 2;
	margin-top: 2em;
	margin-bottom: 2em;
}

.layoutguide-readable > table {
	/* Needed because table expands ignoring parent's paddings */
	max-width: 660px;
}


/* Header */

.header {
	position: fixed;
	display: block;
	width: 100%;
	height: 44px;
	padding-left: 0;
	padding-right: 0;
	background-color: rgba(153,0,0,0.8);
    z-index: 10;
    -webkit-backdrop-filter: saturate(180%) blur(10px);
    backdrop-filter: saturate(180%) blur(10px);
}

.headerbound {
	position: relative;
	height: 100%;
	padding-left: 0;
	padding-right: 0;
	padding-left: calc(0px + env(safe-area-inset-left));
	padding-right: calc(0px + env(safe-area-inset-right));
}

.headeritem {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	padding: 0 20px;
	position: absolute;
}

.headeritem-left {
	left: 0;
	left: calc(0px + env(safe-area-inset-left));
}

.headeritem-center {
	left: 50%;
	margin-left: -36px;
}

.headeritem-right {
	right: 0;
	right: calc(0px + env(safe-area-inset-right));
}

a.headeritem:active {
	background: rgba(0,0,0,0.25);
}

a.headeritem:active > * {
	opacity: 0.75;
}


/* Share Box */

.sharebox {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin-top: 8px;
	margin-left: 70px;
}

.single-category162 .sharebox { /* Share box on blog pages */
	margin-left: initial;
}

.shareboxcell {
	margin-right: 10px;
	line-height: 0; /* Corrects the slant and removes unwanted bottom space */
}

@media screen and (max-width:480px) { 

	.sharebox {
		margin-left: initial;
		margin-bottom: 10px;
	}

}


/* Category */

.categoryheader {
}

.category h1 {
	display: inline-block;
	font-weight: 900;
	color: #000;
	margin-right: 40px;
	margin-top: 40px;
	margin-bottom: 0;
}

.categorynav {
	display: inline-block;
	list-style-type: none;
	margin-bottom: 0;
	padding: 0;
}

.categorynavitem {
	display: inline-block;
	margin: 0 40px 0 0;
	font-weight: bold;
}

.categorynavitem:first-child {
	margin-left: 0;
}

.categorynavitem-current {
	/* border-bottom: 3px solid #ddd; */
}

.categorynavitem a:active,
.categorynavitem a:visited {
	color: #0070c9;
}

.categorynavitem a:active,
.categorynavitem a:visited:active {
	color: #005396;
}

@media screen and (max-width:480px) { 

	.categorynavitem {
		margin: 5px 30px 5px 0;
	}

}

.master {
	margin-top: 30px;
	padding-bottom: 20px;
}

.masterlist {
	margin-top: 20px;
	margin-bottom: 0;
	list-style-type: none;
	padding-left: 0 !important; /* Important to override .layoutguide > ul. */
	padding-right: 0 !important;
	padding-left: calc(0px + env(safe-area-inset-left)) !important;
	padding-right: calc(0px + env(safe-area-inset-right)) !important;
}

.related .masterlist {
	max-width: 700px; /* Make it as layoutguide-readable > * */
}

.masteritem {
	border-bottom: 1px solid #eee;
	line-height: 1.6;
}

.related .masteritem {
	border-bottom: 1px solid #ddd;
}

.masteritem:last-child {
	border-bottom: none;
}

.masteritem a {
	display: block;
	position: relative;
	color: black;
	font-weight: normal;
	padding: 16px 20px 16px 60px;
}

.category .masteritem a {
	padding: 16px 140px 16px 60px;
}

.masteritem a:active {
	color: black;
	background: rgba(0,0,0,0.1);
}

.masteritem a:visited,
.masteritem a:active:visited {
	color: black;
}

.masteritemicon {
	display: inline-block;
	position: absolute;
	left: 20px;
	top: 12px;
	width: 32px;
	height: auto;
}

.masteritemicon-person {
	width: 32px;
	height: 32px;
	border-radius: 28px;
	/* border: 2px solid #0070c9; */
	border: 1px solid rgba(0,0,0,0.2);
}

.masteritemtitle {
	display: block;
}

.masteritemcategoryname {
	display: inline;
	font-size: 13px;
	font-weight: bold;
	color: #999;
	vertical-align: 1.5px;
	margin-right: 4px;
}


.masteritemauthor {
	display: block;
	font-size: 13px;
	color: #ccc;
}

.masteritemdate {
	display: inline-block;
	position: absolute;
	right: 20px;
	top: 16px;
	color: #999;
	font-size: 13px;
	max-width: 110px;
}

@media screen and (max-width:480px) { 

	.category .masteritem a {
		padding: 16px 20px 16px 60px;
	}
	
	.masteritemicon {
		top: 16px;
	}
	
	.masteritemcategoryname {
		display: block;
	}
	
	.masteritemdate {
		display: block;
		position: relative;
		top: initial;
		right: initial;
		margin-top: 4px;
		max-width: initial;
	}

}


/* Tiled Index (Blog) */

.category-162 .content {
	background: #eee;
}

.category-162 .master {
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 20px;
}
	
.category-162 .masterlist {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	max-width: 1240px;
	margin-top: 10px;
}

.category-162 .masteritem {
	flex-grow: 1;
	width: 400px;
	min-width: 200px;
	padding: 10px;
	border-bottom: none;
}

.category-162 .masteritem-blank {
	padding: 0;
}

.category-162 .masteritem a {
	height: 100%;
	margin: 0;
	padding: 0;
	background: #fff;
	border: 1px solid #e3e3e3;
	border-radius: 8px;
}

.category-162 .masteritem a:active {
	background: #ddd;
}

.category-162 .masteritemogimage {
	display: block;
	position: relative;
	height: 300px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	border-bottom: 1px solid #eee;
	border-radius: 8px 8px 0px 0px;
}

.category-162 .masteritem a:active .masteritemogimage {
	border-bottom: 1px solid #ccc;
}

.category-162 .masteritem a:active .masteritemogimage:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #000;
	opacity: 0.2;
}

.category-162 .masteritemtitle {
	display: block;
	margin-top: 24px;
	margin-left: 30px;
	margin-right: 30px;
	font-size: 20px;
	font-weight: bold;
	line-height: 1.4;
}

.category-162 .masteritemauthor {
	display: flex;
	align-items: center;
	margin-top: 8px;
	margin-left: 30px;
	margin-right: 30px;
}

.category-162 .masteritemicon-person {
	display: initial;
	position: initial;
	left: initial;
	top: initial;
	border: 1px solid rgba(0,0,0,0.2);
}

.category-162 .masteritem a:active .masteritemicon-person {
	opacity: 0.5;
}

.category-162 .masteritemauthorname {
	display: block;
	margin-left: 10px;
	font-size: 16px;
	color: #333;
}

.category-162 .masteritemexcerpt {
	display: block;
	margin-top: 14px;
	margin-left: 30px;
	margin-right: 30px;
	font-size: 15px;
	color: #666;
}

.category-162 .masteritemexcerpt > p {
	margin: 0;
	font-size: 14px;
}

.category-162 .masteritemdate {
	display: block;
	position: static;
	margin-top: 14px;
	margin-left: 30px;
	margin-right: 30px;
	margin-bottom: 16px;
	font-size: 13px;
	color: #999;
}


/* Tiled Index (SHIG) */

.category-236 .content {
	background: #eee;
}

.category-236 .master {
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 20px;
}
	
.category-236 .masterlist {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	max-width: 1240px;
	margin-top: 10px;
}

.category-236 .masteritem {
	flex-grow: 1;
	width: 400px;
	min-width: 200px;
	padding: 10px;
	border-bottom: none;
}

.category-236 .masteritem-blank {
	padding: 0;
}

.category-236 .masteritem a {
	height: 100%;
	margin: 0;
	padding: 0;
	background: #fff;
	border: 1px solid #e3e3e3;
	border-radius: 8px;
}

.category-236 .masteritem a:active {
	background: #ddd;
}

.category-236 .masteritemogimage {
	display: block;
	position: relative;
	height: 300px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	border-bottom: 1px solid #eee;
	border-radius: 8px 8px 0px 0px;
}

.category-236 .masteritem a:active .masteritemogimage {
	border-bottom: 1px solid #ccc;
}

.category-236 .masteritem a:active .masteritemogimage:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #000;
	opacity: 0.2;
}

.category-236 .masteritemtitle {
	display: block;
	margin-top: 24px;
	margin-left: 30px;
	margin-right: 30px;
	font-size: 20px;
	font-weight: bold;
	line-height: 1.4;
}

.category-236 .masteritemexcerpt {
	display: block;
	margin-top: 14px;
	margin-left: 30px;
	margin-right: 30px;
	margin-bottom: 28px;
	font-size: 15px;
	color: #666;
}

.category-236 .masteritemexcerpt > p {
	margin: 0;
	font-size: 14px;
}

.category-236 .masteritemdate {
	display: block;
	position: static;
	margin-top: 14px;
	margin-left: 30px;
	margin-right: 30px;
	margin-bottom: 16px;
	font-size: 13px;
	color: #999;
}


/* Work Index */

.category-96 .master {
}

.category-96 .masterlist {
}

.category-96 .masteritem {
	border: 1px solid #ccc;
	margin-left: 20px;
	margin-right: 20px;
	line-height: 1.8;
	border-radius: 6px;
	margin-bottom: 20px;
}

.category-96 .masteritem a {
	padding: 26px 40px 30px;
}

.category-96 .masteritemicon {
	left: 36px;
	top: 21px;
	width: 44px;
}

.category-96 .masteritemtitle {
	font-size: 20px;
	font-weight: bold;
	line-height: 1.4;
	margin-left: 50px;
	margin-bottom: 20px;
	color: #333;
	padding-right: 160px;
}

.category-96 .masteritemworkperiod {
	position: absolute;
	top: 34px; /* Washlet */
	right: 40px;
	color: #999;
	font-size: 18px;
	line-height: 1;
}

.category-96 .masteritemexcerpt p {
	color: #666;
	margin-top: 0;
	margin-left: 50px;
	margin-right: 50px;
	margin-bottom: 0;
}

@media screen and (max-width:480px) { 

	.category-96 .masteritem a {
		padding: 20px 20px 24px;
	}

	.category-96 .masteritemicon {
		left: 16px;
		top: 14px;
	}

	.category-96 .masteritemtitle {
		margin-left: 44px;
		margin-bottom: 16px;
		padding-right: initial;
	}
	
	.category-96 .masteritemworkperiod {
		display: block;
		position: relative;
		top: initial;
		right: initial;
		margin-bottom: 10px;
	}

	.category-96 .masteritemexcerpt p {
		margin-left: 0;
		margin-right: 0;
		font-size: 15px;
	}

}


/* Books Index */

.category-50 .masteritem a {
	display: flex;
	padding: 16px 0 16px 0;
}

.category-50  .masteritemtitle {
	font-size: 18px;
	font-weight: bold;
}

.category-50 .masteriteminfobound {
	flex-grow: 1;
	padding: 0 30px 0 60px;
}

.category-50 .masteritemthumbnailbound {
	flex-basis: 140px;
	flex-grow: 0;
	text-align: right;
	min-width: 140px;
}

.category-50 .masteritemthumbnail {
	width: 100px;
	margin-right: 20px;
	border: 1px solid #ddd;
}

@media screen and (max-width:480px) { 

	.category-50 .masteritem a {
		display: block;
	}

	.category-50 .masteriteminfobound {
		padding: 0 20px 0 60px;
	}
	
	.category-50 .masteritemthumbnailbound {
		padding: 0 20px 0 60px;
		text-align: left;
		min-width: initial;
	}

}


/* About Index */

.category-83 .masterbound {
	display: flex;
	flex-direction: row-reverse;
	max-width: 100%;
	padding-left: 0;
	padding-right: 0;
	padding-top: 50px;
	padding-bottom: 60px
}

.category-83 .masterbound:before {
	content: "";
	display: block;
	flex-grow: 1;
	flex-basis: 50%;
	background-color: #eee;
	background-image: url(/assets/images/bookshelf.jpg);
	background-position: center center;
	background-size: cover;
}

.category-83 .master {
	flex-grow: 1;
	flex-basis: 50%;
	margin-top: 0;
	padding-top: 20px;
	padding-bottom: 30px;
}

.category-83 .masterlist {
	max-width: 490px;
	padding-right: 30px !important;
	padding-left: 20px !important;
	padding-left: calc(20px + env(safe-area-inset-left)) !important;
	margin-left: auto !important;
	margin-right: 0 !important;
	margin-top: 0;
}

.category-83 .masteritem {
	border-bottom: none;
	font-size: 18px;
}

.category-83 .masteritem a {
	padding: 20px 0px 20px 80px;
}

.category-83 .masteritemicon {
	left: 40px;
	top: 17px;
}

@media screen and (max-width:480px) { 

	.category-83 .masterbound {
		display: block;
		padding-top: 30px;
	}

	.category-83 .masterbound:before {
		height: 120px;
	}

	.category-83 .masterlist {
		max-width: 700;
		padding-left: 0px !important;
		padding-left: calc(0px + env(safe-area-inset-left)) !important;
		padding-right: 0px !important;
		padding-right: calc(0px + env(safe-area-inset-right)) !important;
	}

	.category-83 .masteritem {
		border-bottom: 1px solid #eee;	
	}
	
	.category-83 .masteritem a {
		padding: 16px 20px 16px 60px;
	}

	.category-83 .masteritemicon {
		top: 12px;
		left: 20px;
	}

}


/* Paging ( used by wp-page-numbers plugin ) */

.paging {
	padding-bottom: 30px;
}
.pagingnav-large ul {
	display: flex;
	justify-content: center;
	padding: 0;
	margin: 0;
	list-style: none;
}

.pagingnav-large li {
	padding: 0;
	margin: 0 0.2em;
	font-size: 18px;
	line-height: 2em;
}

.pagingnav-large a {
	display: inline-block;
	color: #000;
	border: none;
	margin: 0;
	padding: 0 0.7em;
	border-radius: 48%;
	min-width: 36px;
}

.pagingnav-large li.active_page a {
	background: #ddd;
}

.pagingnav-large li a:active {
	color: #000;
	background: #bbb;
}

.pagingnav-small {
	display: none;
	justify-content: center;
	align-items: center;
}

.pagingnav-small .pagingarrow {
	width: 40px;
	height: 40px;
}

.pagingnav-small .pagingarrow a {
	display: block;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 20px 20px;
	line-height: 1;
	text-indent: -999999px;
}

.pagingnav-small .pagingarrow-previous a {
	background-image: url("/assets/images/icon-chevron-black-west.svg");
}

.pagingnav-small .pagingarrow-next a {
	background-image: url("/assets/images/icon-chevron-black-east.svg");
}

.pagingnav-small .pagingnumber {
	font-size: 18px;
	color: #999;
	margin-left: 20px;
	margin-right: 20px;
}

@media screen and (max-width:480px) { 

	.category-162 .masteritemexcerpt > p {
		font-size: 15px;
	}
	
	.pagingnav-large {
		display: none;
	}
	
	.pagingnav-small {
		display: flex;
	}

}


/* Single */

.single h1 {
	position: relative;
	font-weight: normal;
	color: #777;
	margin-top: 40px;
	margin-bottom: 35px;
	padding-left: 70px;
}

.single h2 {
	font-weight: bold;
	color: #000;
	margin-top: 3em;
	line-height: 1.4 !important; /* Override "layoutguide > *" */
}

.single h2:after {
	content: "";
	display: block;
	height: 1px;
	background: #ccc;
	margin-top: 0.2em;
}

.single h3 {
	font-weight: bold;
	color: #666;
	margin-top: 2em;
}

.single .posticon {
	position: absolute;
	left: 0;
	top: -10px;
	width: 56px;
	height: 56px;
	margin-right: 14px;
}

.single .authorname {
	margin-top: -8px;
	margin-left: 70px;
	line-height: 1.2;
}

.single .date {
	text-align: right;
	line-height: 1.2;
}

@media screen and (max-width:480px) { 

	.single h1 {
		margin-top: 30px;
		padding-left: initial;
	}

	.single .posticon {
		display: none;
	}

	.single h2:first-child {
		margin-top: 2em;
	}

}

.entry {
	margin-top: 2em;
	padding-bottom: 4em;
}


/* Blog Single */

.single-category162 h1 { /* h1 on blog pages */
	padding-left: initial;
}

.single .author { /* Author band on blog pages */
	display: flex;
	align-items: center;
}

.single .author .posticon { /* Post icon on blog pages */
	display: block; /* Declare to override ".single .posticon" on media query "screen and (max-width:480px)" */
	position: initial;
	left: initial;
	top: initial;
	margin-right: 10px;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	border: 1px solid rgba(0,0,0,0.1);
}

.single .author .authorname { /* Author name on blog pages */
	margin-top: initial;
	margin-left: initial;
}


/* Work Single */

.single-category96 h1 {
	padding-left: initial;
}

.single-category96 .entry {
	margin-top: 1em;
}

.subcategory {
}

.subcategorytitlesbound {
	display: flex;	
}

.subcategorytitles { /* UL for .subcategorytitle title */
	flex-grow: 1;
	list-style-type: none;
	margin-top: 20px;
	margin-bottom: 20px;
	padding: 0;
}

.subcategorytitle {
	display: inline-flex;
	align-items: center;
	color: #333;
	font-size: 20px;
	margin-right: 30px;
}

.subcategoryicon {
	width: 46px;
	height: 46px;
	margin-right: 10px;	
}

.workperiod {
	flex-basis: 200px;
	flex-grow: 0;
	min-width: 200px;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	height: 46px; /* Same as the height of .subcategoryicon */
	color: #999;
	font-size: 18px;
	margin-top: 20px;
	margin-bottom: 20px;
}

.workperiod img {
	width: 30px;
	height: auto;
	margin-right: 10px;
}

.workcolumns {
	display: flex;
}

.workdesc {
	flex-basis: 60%;
	padding-right: 40px;
}

.workoptions {
	flex-basis: 40%;
	/* min-width: 400px; */
	/* border: 1px solid #ccc; */
	padding: 22px 30px;
	border-radius: 6px;
	background-color: #f6f6f6;
}

.worklead {
	font-size: 18px;
	line-height: 1.9;
	color: #666;
	margin-top: 0;
}

.workdesc h2 {
	font-size: 16px;
	font-weight: bold;
	margin-top: 40px;
}

.workdesc p {
	line-height: 2;
}

.workoptions h2 {
	margin-top: 0;
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 24px;
}

.workoptions h2:after {
	display: none; /* Remove bottom line */
}


.approaches {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

.approach {
	display: flex;
	align-items: center;
	padding-left: 48px;
	font-size: 17px;
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 40px 40px;
	min-height: 40px;
	margin-top: 20px;
	margin-bottom: 20px;
	color: #666;
	line-height: 1.4;
}

.approach:first-child {
	margin-top: 0;
}

.approach:last-child {
	margin-bottom: 0;
}

@media screen and (max-width:480px) { 

	.subcategorytitlesbound {
		display: block;	
	}
	
	.workperiod {
		justify-content: flex-start;
	}
	
	.workcolumns {
		display: block;
		margin-top: 30px;
	}
	
	.workdesc {
		padding-right: initial;
	}
	
	.workoptions {
		margin-top: 30px;
	}
	
	.single h2:first-child {
		margin-top: 0; /* Override standard */
	}

}

.approach-industryanalysis {
	background-image: url(/assets/images/icon-approach-industryanalysis.svg);
}
.approach-industryanalysis:after {
	content: "業界分析";
}

.approach-crosschannel {
	background-image: url(/assets/images/icon-approach-crosschannel.svg);
}
.approach-crosschannel:after {
	content: "クロスチャネルモデリング";
}

.approach-organization {
	background-image: url(/assets/images/icon-approach-organization.svg);
}
.approach-organization:after {
	content: "デザイン組織化";
}

.approach-observation {
	background-image: url(/assets/images/icon-approach-observation.svg);
}
.approach-observation:after {
	content: "ユーザー観察・インタビュー";
}

.approach-expertreview {
	background-image: url(/assets/images/icon-approach-expertreview.svg);
}
.approach-expertreview:after {
	content: "エクスパートレビュー";
}

.approach-usabilitytest {
	background-image: url(/assets/images/icon-approach-usabilitytest.svg);
}
.approach-usabilitytest:after {
	content: "ユーザビリティテスト";
}

.approach-conceptmaking {
	background-image: url(/assets/images/icon-approach-conceptmaking.svg);
}
.approach-conceptmaking:after {
	content: "コンセプトメイキング";
}

.approach-ideation {
	background-image: url(/assets/images/icon-approach-ideation.svg);
}
.approach-ideation:after {
	content: "アイディエーション";
}

.approach-usermodeling {
	background-image: url(/assets/images/icon-approach-usermodeling.svg);
}
.approach-usermodeling:after {
	content: "ユーザーモデリング";
}

.approach-domainanalysis {
	background-image: url(/assets/images/icon-approach-domainanalysis.svg);
}
.approach-domainanalysis:after {
	content: "ドメイン分析";
}

.approach-objectmodeling {
	background-image: url(/assets/images/icon-approach-objectmodeling.svg);
}
.approach-objectmodeling:after {
	content: "オブジェクトモデリング";
}

.approach-interfacedesign {
	background-image: url(/assets/images/icon-approach-interfacedesign.svg);
}
.approach-interfacedesign:after {
	content: "インターフェースデザイン";
}

.approach-prototyping {
	background-image: url(/assets/images/icon-approach-prototyping.svg);
}
.approach-prototyping:after {
	content: "プロトタイピング";
}

.approach-guidelines {
	background-image: url(/assets/images/icon-approach-guidelines.svg);
}
.approach-guidelines:after {
	content: "デザインガイドライン";
}

.approach-designtraining {
	background-image: url(/assets/images/icon-approach-designtraining.svg);
}
.approach-designtraining:after {
	content: "デザイントレーニング";
}


/* Table */

.entry table {
	border: none;
	border-collapse: collapse;
}

.entry table th,
.entry table td {
	border: none;
	border-bottom: 1px solid #ddd;
	vertical-align: top;
}

.entry table th {
	padding: 8px 12px 8px 20px;
	text-align: right;
	font-size: 13px;
	color: #777;
}

.entry table td {
	padding: 8px 20px 8px 12px;
	text-align: left;
}

.entry .layouttable {
}

.entry .layouttable th,
.entry .layouttable td {
	border: none;
	padding: 0;
}


@media screen and (max-width:480px) { 

	.entry table {
		display: block;
	}
	
	.entry tbody {
		display: block;
	}
	
	.entry table tr {
		display: block;
	}
	
	.entry table th,
	.entry table td {
		display: block;
	}
	
	.entry table th {
		padding: 8px 0;
		text-align: left;
	}

	.entry table td {
		padding: 8px 0;
	}
	
	.entry .layouttable {
		display: table;
	}

	.entry .layouttable tr {
		display: table-row;
	}
	
	.entry .layouttable th,
	.entry .layouttable td {
		display: table-cell;
	}

}


/* Figure */

.figure {
	margin-top: 3em;
	margin-bottom: 3em;
	text-align: center;
	font-size: 80%;
	color: #666666;
	line-height: 1.4 !important;
	max-width: 980px;
}

.figure img {
	margin-top: 10px;
	margin-bottom: 10px;
	max-width: 100%;
}

.figure-bordered img {
	border: 1px solid rgba(51,51,51,0.5);
}

.figure a img {
	border: 2px solid #0070c9;
}


/* Disclosure */

.disclosure {
	visibility: hidden;
	position: absolute;
}

.disclosure-disclosed {
	visibility: visible;
	position: relative;
}




/* Decoration */

.pullquote,
.proletarianquote {
	margin: 2em auto;
	font-size: 120%;
	line-height: 1.6;
	color: #888;
	position: relative;
	padding-left: 50px;
	padding-right: 50px;
}

.pullquote:before,
.proletarianquote:before {
	content: "“";
	position: absolute;
	display: inline-block;
	font-size: 400%;
	color: rgba(0,0,0,0.1);
	left: 0.2em;
	top: -0.5em;
	font-family: serif;
}

.pullquote:after,
.proletarianquote:after {
	content: "”";
	position: absolute;
	display: inline-block;
	font-size: 400%;
	color: rgba(0,0,0,0.1);
	right: 0.3em;
	bottom: -1em;
	font-family: serif;
}

.proletarianquoteof {
	margin: 0 auto 4em;
	text-align: right;
	color: #666;
	font-size: 80%;
	line-height: 1.4;
}

.annotation {
	font-size: 13px;
	color: rgba(51,51,51,0.7);
	margin: 3em;
}

.dichotomy {
	width: 100%;
	max-width: 600px;
	margin-top: 2em;
	margin-bottom: 2em;
	margin-left: auto;
	margin-right: auto;
	border: none !important;
}

.dichotomy th {
	background-color: transparent !important;
	text-align: center !important;
}

.dichotomy th,
.dichotomy td {
	width: 50%;
	font-size: 90%;
	border: none !important;
	border-bottom: 1px solid #ccc !important;
	padding: 0.5em 1em !important;
}

.dichotomy td:first-child {
	text-align: right;
}

.dichotomy td:last-child {
	text-align: left;
}

.interviewQ {
	font-weight: bold;
	font-size: 120%;
	padding-left: 42px;
}

.interviewQ:before {
	content: "Q";
	display: inline-block;
	background-color: #39bb62;
	padding:4px 0;
	text-align: center;
	margin-right: 8px;
	margin-left: -42px;
	color: white;
	border-radius: 4px;
	font-size: 18px;
	width: 34px;
}

.section-divider {
	display: block;
	width: 100px;
	height: 1px;
	background: #ccc;
	border: none;
	margin-top: 3em;
	margin-bottom: 3em;
}

.columns {
}

.columns-clients { /* UL on /1820 */
	column-width:22em;
}

.youtubebound {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
	background: gray;
	text-align: center;
	font-size: 80%;
	color: #666666;
	line-height: 1.4 !important;
	margin-top: 3em;
	margin-bottom: 3em;
}

.youtube {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}


/* Exception for Individual Single */

/* Displays as .layoutguide-readable */
.post529 .entry > *,
.post533 .entry > *,
.post536 .entry > *,
.post1422 .entry > *,
.post8541 .entry > * { 
	max-width: 700px;
	line-height: 2;
}

/* Map page */

.mainvisual-map {
	max-width: 100%;
	height: 400px;
	background-image: url(/assets/images/modelia.jpg);
	background-size: cover;
	background-position: center top;
}

.mapaddress {
	display: flex;
	justify-content: center;
	font-size: 18px;
	margin-top: 3em;
}

.mapaddress > * {
	margin-left: 30px;
	margin-right: 30px;
}

.subwayexits {
	display: flex;
	justify-content: center;
	font-size: 18px;
	margin-top: 1em;
}

@media screen and (max-width:480px) { 

	.mainvisual-map {
		height: 250px;
	}
	
	.mapaddress {
		display: block;
	}
	
	.mapaddress > * {
		margin-left: auto;
		margin-right: auto;
	}
	
	.subwayexits {
		display: block;
	}

	.subwayexits ul {
		padding-left: 20px;
	}

}

/* Board page */

.boardcard {
	max-width: 100% !important;
	margin-top: 50px;
	margin-bottom: 30px;
	padding-left: 0;
	padding-right: 0;
	border-top: 1px solid #f3f3f3;
	background: linear-gradient(#f6f6f6, #fff);
}

.boardcard:first-child {
	margin-top: 20px;
}

.boardcardcontent {
	display: flex;
}

.boardinfo {
	flex-grow: 1;
}

.boardname {
	margin-top: 20px;
	font-size: 32px;
	font-weight: bold;
}

.boardsubname {
	margin-top: -0.5em;
	color: #999;
}

.boardtitle {
	font-size: 24px;
	margin-top: 0.3em;
}

.boardimage {
	flex-basis: 200px;
	flex-grow: 0;
	min-width: 200px;
	line-height: 1;
}

.boardpicture {
	width: 200px;
	height: auto;
}

@media screen and (max-width:480px) { 
	
	.boardcardcontent {
		display: block;
		padding-top: 20px;
		padding-bottom: 20px;
	}
	
	.boardname {
		margin-top: 0;
		text-align: center;
	}
	
	.boardsubname {
		margin-top: -0.5em;
		color: #999;
		text-align: center;
	}
	
	.boardtitle {
		font-size: 24px;
		margin-top: 0.3em;
		text-align: center;
	}
	
	.boardimage {
		text-align: center;
	}
	
	.boardpicture {
		width: 200px;
		height: auto;
	}

}

/* Career Page */

.mainvisual-8541 {
	height: 300px;
	background-size: cover;
	background-position: center center;
}

.post8541 h1 {
	text-align: center;
	padding-left: 20px !important;
	padding-right: 20px !important;
	padding-left: calc(20px + env(safe-area-inset-left)) !important;
	padding-right: calc(20px + env(safe-area-inset-right)) !important;
}

.post8541 h1 img {
	margin-top: 20px;
	width: 800px;
	height: auto;
}

@media screen and (max-width:480px) { 

	.mainvisual-8541 {
		height: 150px;
	}

	.post8541 h1 {
		margin-top: 20px;
		margin-bottom: 0;
	}

}

.careerlead {
	max-width: 980px !important;
	display: flex;
	align-items: flex-start;
	line-height: 2;
	color: #555;
}

.careerleadcolumn {
	flex-grow: 1;
	flex-basis: 50%;
}

.careerleadcolumn-first {
	padding-right: 20px;
}

.careerleadcolumn-second {
	padding-left: 20px;
}

@media screen and (max-width:760px) { /* 760 breaking */

	.careerlead {
		display: block;
	}

	.careerleadcolumn-first {
		padding-right: initial;
	}
	
	.careerleadcolumn-second {
		padding-left: initial;
	}

}

.careerimage {
	max-width: 100% !important;
	height: 400px;
	background-image: url(/assets/images/officescenes-2.jpg);
	background-size: cover;
	background-position: center center;
	margin-top: 40px;
}

.post8541 h2 {
	text-align: center;
	font-size: 30px;
	color: #aaa;
	margin-top: 40px;
	font-weight: normal;
}

.post8541 h2:after {
	content: none; /* Remove bottom line */
}

.post8541 h3 {
	background-image: url(/assets/images/wantedperson.svg);
	background-repeat: no-repeat;
	background-position: 20px top;
	background-size: 36px;
	padding-left: 64px;
	margin-top: 3em;
	font-size: 24px;
	color: #000;
	line-height: 1.4 !important;
	padding-top: 2px;
	padding-bottom: 2px;
}

.post8541 th {
	white-space: nowrap;
}

.post8541 table {
	margin-top: 40px;
}

.post8541 table tr:last-of-type th,
.post8541 table tr:last-of-type td {
	border-bottom: none;
}


.invokerbound-opportunities { /* "/opportunities/ form */
	margin-top: 20px !important;
}

@media screen and (max-width:480px) {
	
	.careerimage {
		height: 200px;
	}

	.post8541 h2 {
		font-size: 26px;
	}

	.post8541 table tr:last-of-type th {
		border-bottom: 1px solid #ddd;
	}

}


/* Related */

.related {
	border-top: 1px solid #eee;
	background: #f9f9f9;
}

.relatedheading {
	margin-top: 1.5em !important;
	font-size: 18px !important;
	
}

.related .relatedheading {
	max-width: 700px; /* Make it as layoutguide-readable > * */
}

.relatedheading:after {
	content: none !important;
}


/* Contact Guide (include-trailing-contactguide) */

.contactguide {
	border-top: 1px solid #ddd;
	padding-top: 3em;
	padding-bottom: 4em;
}

.contactguide h2 {
	text-align: center;
	margin-top: 0;
}

.contactguide h2:after {
	display: none; /* Remove bottom line */
}

.contactguide .invokerbound a {
	display: inline-block;
	margin-top: 1em;
	padding: 6px 40px;
	border: 1px solid #0070c9;
	font-size: 18px;
	font-weight: normal;
	border-radius: 3px;
	color: #0070c9;
	line-height: 1.2;
}

.contactguide .invokerbound  a:active {
	color: #0070c9;
	background: #eee;
}


/* Footer */

.footer {
	padding-top: 10px;
	padding-bottom: 20px;
	padding-bottom: calc(30px + env(safe-area-inset-bottom));
}

.directory {
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	padding-left: 0;
	padding-right: 0;
	padding-left: calc(0px + env(safe-area-inset-left));
	padding-right: calc(0px + env(safe-area-inset-right));
}

.directorygroup {
	flex-grow: 1;
	padding: 0 20px;
	list-style-type: none;
	font-size: 14px;
	line-height: 2;
}

.directorygroup a,
.directorygroup a:visited {
	font-weight: normal;
	color: #0070c9;
}

.directorygroup a:active,
.directorygroup a:visited:active {
	color: #005396;
}

@media screen and (max-width:480px) { 

	.directory {
		display: block;
	}

	.directorygroup {
		font-size: 15px;
		line-height: 2;
	}
	
	/*
	.directorygroup a {
		padding-right: 20px;
		background-image: url(/assets/images/icon-chevron-blue-east.svg);
		background-repeat: no-repeat;
		background-position: right center;
		background-size: 12px;
	}
	*/

}

.copyright {
	text-align: center;
	color: #999;
	font-size: 11px;
	margin-top: 20px;
	margin-bottom: 0;
}





/* DEPRECATED DECLARATIONS, JUST FOR BACKWARD COMPATIBILITY */

/* Sideboard */

div.sideboard {
}

div.sideboard ul, div.sideboard ol {
margin-left: 10px;
padding-left: 10px;
}

div.sideboard ul ul, div.sideboard ol ul  {
margin-left: 20px;
padding-left: 20px;
}

#sideboard-w {
width: 400px;
}

div.sideboard-w {
width: 400px;
padding-left: 20px;
}


/* Stickie */

div.stickie {
background-color: #eeeeee;
margin-top: 0;
margin-bottom: 2em;
padding-top: 1em;
padding-bottom: 0.2em;
padding-left: 1em;
padding-right: 1em;
}

div.stickie h2 {
margin-top: 0;
}