@charset "utf-8";

/* -------------------------------------------------------------------------------------- base smartphone tablet */

body { background:#efefef; }
#wapper {
	background:#fff;
	font-size:1.2rem;
}
#wapper, #header, #visual, #container, #footer { width:100%; }

.tabletype01 {
	padding: 20px 0px 30px 0px;
}

.tabletype01 table{
	table-layout: fixed;
    border: none;
	padding: 0px 0px 0px 0px;
    width: 100%;
    border-spacing:0;
    border-collapse:separate;
    *border-collapse:collapse; /* ie6,7 */
}

.tabletype01 th {
    padding: 8px 4px 8px 0px;
    white-space: nowrap;
    width: 15%;
	text-align: left;
vertical-align: top;
font-weight: normal;
line-height:1.6;
}


.tabletype01 td {
    padding: 8px 4px 8px 14px;
    width: 80%;
vertical-align: top;
line-height:1.6;
}

.align-r {
	text-align: right;
}


#scenarioinfo {
    border: 4px double #45bfe0;
    margin: 2em 0;
    padding: 2em;
	background-image: url(images/infobk.png),url(images/stripe.jpg);
	background-repeat: no-repeat,repeat;
	background-position: left center, left;
	padding-left: 70px;
}


#scenarioinfo a:link {
	font-size: 16px!important;
	color: #313131!important;
	text-decoration: underline!important;
}

#scenarioinfo a:visited {
	font-size: 16px!important;
	color: #313131!important;
	text-decoration: underline!important;
}

#scenarioinfo a:hover {
	font-size: 16px!important;
	color: #313131!important;
	text-decoration: underline!important;
}

#scenarioinfo a:active {
	font-size: 16px!important;
	color: #313131!important;
	text-decoration: underline!important;
}

@media screen and (min-width: 320px) and (max-width: 440px){
	.inner { margin:0 12px; }
	.innerhd { margin:0 0px; }
.flobox01l {
	width: 100%;
	float: none;
	padding-bottom: 10px;
	text-align: center;
}

.flobox01r {
	width: 100%;
	float: none;
}
.flobox01r h3 {
	margin-bottom: 14px;
}

.flobox02l {
	width: 100%;
	float: none;
	padding-bottom: 10px;
	text-align: center;
}

.flobox02r {
	width: 100%;
	float: none;
}


}
@media screen and (min-width: 441px) and (max-width: 800px){
	.inner { margin:0 2em }
		.innerhd { margin:0 0 }
}

#sidebar {  }

#contents .section, #footer .section { margin:0 0 18px; }
#contents .section:last-child { margin:0; }

#mobilebar {
	height:40px;
	background:#758eb7;
}
#mobilebar #menu a {
	display:block;
	width:40px;
	height:40px;
	background:url(images/menu-icon.png) no-repeat center center;
	border:#516b94 1px solid;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-o-border-radius: 4px;
	border-radius: 4px;
}
#mobilebar a span { display:none; }

/* -------------------------------------------------------------------------------------- header */

#header {
	background:#fff;
	border-bottom:1px #ccc solid;
	/* add mobile-bar height */
	padding:54px 0 0;
	margin:0 0 4px;
	-moz-box-shadow: 0px 0px 4px 0px rgba(000, 000, 000, 0.3);
	-webkit-box-shadow: 0px 0px 4px 0px rgba(000, 000, 000, 0.3);
	box-shadow: 0px 0px 4px 0px rgba(000, 000, 000, 0.3);
}
#header h1 {
	font-size:1.6rem;
	font-family:'Marcellus SC', sans-serif;
	text-align:center;
	padding:0px 0px 20px 0px;
}
h1 img {
	width:180px;
	height:auto;
}
#headline #headlinks { display:none; }

#hdbox {
	clear: both;
}
#hdl {
	width: auto;
	float: none;
	padding: 0px 0px 0px 0px;
}

#hdr {
	width: auto;
	float: none;
	padding: 0px 0px 0px 0px;
	text-align: center;
}

#hdr h2 {
	font-size: 16px;
	font-weight: normal;
	margin-bottom: 8px;
}
#hdr_news {
	padding-top: 20px;
}
#hdr_news a:link {
	display: block;
	width: 140px;
	border: solid 1px #8f8f8f;
	color:#3f3f3f;
	text-align: center;
	text-decoration: none;
	font-size: 16px;
	line-height: 30px;
	height: 30px;
	float: right;
	margin-top: 20px;
	background-color: #ECECEC;
}
#hdr_news a:visited {
	width: 140px;
	border: solid 1px #8f8f8f;
	color:#3f3f3f;
	text-align: center;
	text-decoration: none;
	font-size: 16px;
	line-height: 30px;
	height: 30px;
	background-color: #ECECEC;
}
#hdr_news a:hover {
	width: 140px;
	border: solid 1px #8f8f8f;
	color:#3f3f3f;
	text-align: center;
	text-decoration: none;
	font-size: 16px;
	line-height: 30px;
	height: 30px;
	background-color: #FFFFFF;
}
#hdr_news a:active {
	width: 140px;
	border: solid 1px #8f8f8f;
	color:#3f3f3f;
	text-align: center;
	text-decoration: none;
	font-size: 16px;
	line-height: 30px;
	height: 30px;
	background-color: #FFFFFF;
}
/* -------------------------------------------------------------------------------------- global navi, visual */


#visual { display:none; }
#visualnav { display:none; }

/* -------------------------------------------------------------------------------------- container */

#container { background:#fff; padding:24px 0; }

/* -------------------------------------------------------------------------------------- container contents */

#contents { padding:0 0 20px; }
#contents h1 {
	font-family: 'Lato-Light', sans-serif;
	font-size:2.4rem;
	margin: 0 0 20px;
	text-align:center;
}
#contents .section h2 {
	border-top:2px #3f3f3f solid;
	border-bottom:1px #efefef solid;
	font-family:'Marcellus SC', sans-serif;
	font-size:1.4rem;
	line-height:1.5;
	color:#3f3f3f;
	text-align:center;
	padding:0.5em 0;
	margin: 0 0 16px;
}
#contents .section { margin: 0 0 32px; }
#contents .works.section { margin: 0 0 20px; }
#contents .section:last-child { margin:0; }
#contents .section p {
	line-height:2;
}

#contents .inner-section { margin: 0 0 20px; }

/* News top page */
#contents #news h2 {
	border:none;
	font-size: 1.8rem;
	font-family: 'Lato-Regular', sans-serif;
	margin: 0 0 10px;
}

/* English and Japanese */
#contents h2.jestyle {
	display: table;
	width: 100%;
}
#contents h2.jestyle span,
#contents h2.jestyle strong {
	display: table-cell;
	text-align:left;
	vertical-align:middle;
}
#contents h2.jestyle strong {
	text-align:right;
	font-size: 1.1rem;
}

/* accordion　*/
#contents h3 {
	font-size: 1.4rem;
	font-family: 'Lato-Regular', sans-serif;
}

/* quotations */
#contents h2.quotations {
  border: none;
  font-size: 1.6rem;
  line-height: 1.6;
  padding: 20px 36px;
  position: relative;
}
#contents h2.quotations:before {
  content: "“";
  font-size: 300%;
  line-height: 1;
  font-family: 'Marcellus SC', sans-serif;
  color: #999;
  position: absolute;
  left: 0;
  top: 0;
}
#contents h2.quotations:after {
  content: "”";
  font-size: 300%;
  line-height: 0;
  font-family: 'Marcellus SC', sans-serif;
  color: #999;
  position: absolute;
  right: 0;
  bottom: 0;
}

/* -------------------------------------------------------------------------------------- sidebar */

#sidebar .inner { margin:0 }
#sidebar h2 {
	border:4px #efefef solid;
	padding:16px 20px;
	-webkit-box-shadow: 0px 1px 4px 0px #aaa;
	-moz-box-shadow: 0px 1px 4px 0px #aaa;
	box-shadow: 0px 1px 4px 0px #aaa;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
}
#sidebar h2 span { margin:0 4px 0 0; }
ul.archives {
	margin:5px 0;
	border-top:1px #c0c0c0 solid;
	border-bottom:1px #efefef solid;
}
ul.archives li {
	background: url(images/allow-bt-gray-w.png) no-repeat right center;
	background-size: 12px auto;
}
ul.archives a {
	display:block;
	font-size:1.2rem;
	border-top:1px #efefef solid;
	border-bottom:1px #c0c0c0 solid;
	padding:12px 1em;
}
.archives-toggles { display:none; }

/* -------------------------------------------------------------------------------------- footer */

#footer {
	background:#fff;
	border-top:1px #ccc solid;
	text-align:center;
	padding:24px 0 38px;
	-moz-box-shadow: 0px 0px 4px 0px rgba(000, 000, 000, 0.3);
	-webkit-box-shadow: 0px 0px 4px 0px rgba(000, 000, 000, 0.3);
	box-shadow: 0px 0px 4px 0px rgba(000, 000, 000, 0.3);
}
#footerline dl { margin:0 12px 16px; }
#footerline dl dt {
	font-family:'Marcellus SC', sans-serif;
	font-size:1.4rem;
	margin:0 0 12px;
}
#footerline dl dt img {
	width:160px;
	height:auto;
}
#footerline dl dd { margin:0 0 5px; }

#footerlink { display:none; }

.aside {
	font-size:1.0rem;
}
.footb {
	font-size: 16px!important;
	font-weight: nomal!important;
}

/* -------------------------------------------------------------------------------------- selecter in contents */

/* ------------------------------------------------ news-list-addimg */

ul.news-list-addimg {
	border-top:1px solid #ccc;
}
ul.news-list-addimg li {	
	border-bottom:1px solid #ccc;
}
ul.news-list-addimg a {
	display: block;
	color:#333;
	text-align:center;
	padding: 20px 0;
}
ul.news-list-addimg dl {
	width:100%;
}
ul.news-list-addimg dt,
ul.news-list-addimg dd {
	
}
ul.news-list-addimg .date {
	float:right;
	width: 10em;
}
ul.news-list-addimg .iconimg  {
	float:left;
	width: 80px;
}
ul.news-list-addimg .iconimg img {
	width:100%;
	height:auto;
}
ul.news-list-addimg .coments {
	clear:both;
	background: url(images/arrow.png) no-repeat right center;
	text-align:left;
	padding: 24px 32px 0 0;
}
ul.news-list-addimg .coments h3 {
	font-size:1.5rem;
	line-height:1.4;
	margin:0 0 10px;
}
#contents ul.news-list-addimg .coments p {
	font-size:1.2rem;
	line-height:1.6;
}

/* -------------------------------------------------------------------------------------- card style */

.card-style,
.inner-card-style {
	border:4px #efefef solid;
	padding:16px 20px;
	-webkit-box-shadow: 0px 1px 4px 0px #aaa;
	-moz-box-shadow: 0px 1px 4px 0px #aaa;
	box-shadow: 0px 1px 4px 0px #aaa;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
}
.inner-card-style {
	padding:16px;
	margin: 0 0 20px;
}
.inner-card-style h3 {
	font-size:1.3rem;
	line-height:1.5;
	border-bottom:2px #3f3f3f solid;
	padding: 0 0 8px;
	margin: 0 0 12px;
}

/* newspage */
#newspage .card-style { padding:16px 20px; }
#newspage .date { text-align:right; }

/* ------------------------------------------------ wapper-article */

.wapper-article p { 
	margin:0 0 20px;
}
.wapper-article p:last-child { 
	margin:0;
}

/* ------------------------------------------------ tablelist */

.tablelist dl {
	width:100%;
	font-size:1.1rem;
	line-height:1.5;
}
.tablelist dl dt {
	font-size:1.3rem;
	line-height:1.5;
}

/* ------------------------------------------------ zumash */

.cl {
	clear: both;
}
.zumashcon {
	width: 100%;
	clear: both;
	padding: 20px 0px 20px 0px;
}
.zumashbox {
	width: 290px;
	float: left;
	margin: 0px 10px 20px 0px;
}

.zumashbox img{
	width: 280px;
	margin-bottom: 14px;

}
.roop-table {
	padding: 20px 0px 30px 0px;
}

.roop-table table{
    border: none;
	padding: 0px 0px 0px 0px;
    width: 100%;
    border-spacing:0;
    border-collapse:separate;
    *border-collapse:collapse; /* ie6,7 */
}

.roop-table th {
    padding: 8px 4px 8px 0px;
    white-space: nowrap;
    width: 10%;
	text-align: left;
vertical-align: top;
font-weight: normal;
line-height:1.6;
}


.roop-table td {
    padding: 8px 4px 8px 14px;
    width: 85%;
vertical-align: top;
line-height:1.6;
}

@media screen and (min-width: 320px) and (max-width: 600px){
	.tablelist dl:first-child { border-top:1px #ccc solid; }
	.tablelist dl dt, .tablelist dl dd {
		border-bottom:1px #ccc solid;
		border-right:1px #ccc solid;
		border-left:1px #ccc solid;
		vertical-align:middle;
		line-height:1.6;
		padding:0.5em 1em;
	}
	.tablelist dl dt{ background:#efefef; }
.tabletype01 {
	padding: 20px 0px 30px 0px;
}

.tabletype01 table{
	table-layout: fixed;
    border: none;
	padding: 0px 0px 0px 0px;
    width: 100%;
    border-spacing:0;
    border-collapse:separate;
    *border-collapse:collapse; /* ie6,7 */
}

.tabletype01 th {
	display: block;
    padding: 8px 0px 8px 0px;
    white-space: nowrap;
    width: 100%;
	text-align: left;
vertical-align: top;
font-weight: normal;
line-height:1.6;
}


.tabletype01 td {
	display: block;
    padding: 8px 0px 8px 0px;
    width: 100%;
vertical-align: top;
line-height:1.6;
}


#scenarioinfo {
    border: 4px double #45bfe0;
    margin: 2em 0;
    padding: 1em;
	background-image: url(images/infobk.png),url(images/stripe.jpg);
	background-repeat: no-repeat,repeat;
	background-position: left center, left;
	padding-left: 70px;
}



}
@media screen and (min-width: 601px) and (max-width: 800px){
	.tablelist dl { display:table; }
	.tablelist dl:first-child { border-top:1px #ccc solid; }
	.tablelist dl dt, .tablelist dl dd {
		display:table-cell;
		border-bottom:1px #ccc solid;
		border-right:1px #ccc solid;
		vertical-align:middle;
		line-height:1.6;
		padding:1em;
	}
	.tablelist dl dt{
		border-left:1px #ccc solid;
		width:30%;
		background:#efefef;
	}
}

.menbers .tablelist dl {
	margin:0 0 16px;
}
.menbers .tablelist dl.lastitem {
	margin:0;
}
.menbers .tablelist dl dt{
	background:none;
	border-left:none;
	border-right:none;
	border-bottom:none;
	text-align:center;
	padding:12px 0 0;
}
.menbers .tablelist dl dt > img{
	width:90px;
	height:auto;
}
.menbers .tablelist dl dd{
	border:none;
	font-size:1.3rem;
	line-height:1.8;
	padding:12px 0 0;
}
.menbers .tablelist dl dd h4 {
	font-size:1.3rem;
	margin:0 0 4px;
}
#contents .menbers .tablelist dl dd p{
	font-size:1.1rem;
	line-height:1.8;
}
.menbers .toggles { margin: 16px 0 0; }

.menbers .tgmen { margin: 16px 0 0; }


/* ------------------------------------------------ pinch-dashed */

ul.pinch-dashed {
	border-top:1px dotted #7d99ca;
	font-size:1.0rem;
	margin:16px 0 0;
}
ul.pinch-dashed li {	
	border-bottom:1px dotted #7d99ca;
}
ul.pinch-dashed li a {
	display:block;
	background:url( images/allow-bt-gray.png ) no-repeat right center;
	background-size:contain;
	padding:12px 1.5em 12px 0;
}
ul.pinch-dashed li a:hover{
	background:#fffee4;
}
ul.pinch-dashed li dl{
	overflow:hidden;
	width:100%;
}
ul.pinch-dashed li dl dt{
	margin:0 0 8px;
}
ul.pinch-dashed li dl dd{
	line-height:1.8;
	margin:0 10px 0 0;
	text-align:justify;
	text-justify:inter-ideograph;
}

/* ------------------------------------------------ pinch-dashed-block */

ul.pinch-dashed-block { border-top:1px dotted #7d99ca; margin:16px 0 0; }
ul.pinch-dashed-block li{
	border-bottom:1px dotted #7d99ca;
	vertical-align:top;
}
ul.pinch-dashed-block li a{
	display:table;
	width:100%;
	padding:12px 2em 12px 0;
	background:#fff url( images/allow-bt-gray.png ) no-repeat right center;
}
ul.pinch-dashed-block li a:hover{ background:#fffee4 url( images/allow-bt-gray.png ) no-repeat right center; }
ul.pinch-dashed-block li a div, ul.pinch-dashed-block li a dl { display:table-cell; }
ul.pinch-dashed-block li a div {
	/* image width */
	width:110px;
	line-height:0;
	vertical-align:middle;
	padding:0 20px 0 10px;
}
ul.pinch-dashed-block li a dl {  }
ul.pinch-dashed-block li a dl dt {
	height:1.5em;
	line-height:1;
	border-bottom:1px #ccc dotted;
	margin:0 0 8px;
	overflow:hidden;
}
ul.pinch-dashed-block li a dl dd { font-size:1.0rem; line-height:1.6; }

/* ------------------------------------------------ box in excerpt (two float in home) */

ul.excerpt-box { letter-spacing:-.40em; margin:16px 0 -10px; }
ul.excerpt-box li{
	display:inline-block;
	*display: inline; 
	*zoom: 1;
	width:100%;
	letter-spacing:normal;
	vertical-align:top;
	margin:0 0 10px;
}
ul.excerpt-box li:last-child { margin:0; }
ul.excerpt-box li a{
	display:table;
	width:100%;
	padding:16px 16px 12px 0;
	border:1px solid #7d99ca;
	background-color: #fff;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	-o-border-radius: 8px;
	border-radius: 8px;
	background:url( images/allow-bt-gray-w.png ) no-repeat right center;
}
ul.excerpt-box li a:hover{ background:#fffee4 url( images/allow-bt-gray-w.png ) no-repeat right center; }
ul.excerpt-box li a div, ul.excerpt-box li a dl { display:table-cell; }
ul.excerpt-box li a div {
	/* image width 80px */
	width:110px !important;
	line-height:0;
	vertical-align:middle;
	background:none;
	padding:0 0 0 16px;
}
ul.excerpt-box li a dl {

	padding:0 16px 0 0;
}
ul.excerpt-box li a dl dt {
	font-size:1.3rem;
	height:1.5em;
	line-height:1;
	border-bottom:1px #ccc dotted;
	margin:0 0 8px;
	overflow:hidden;
}
ul.excerpt-box li a dl dd { font-size:1.0rem; line-height:1.8; }


/* ------------------------------------------------ flatlist */

#contents .flatlist li a {
	display:table;
	width:100%;
	margin:0;
}
#contents .flatlist h3, #contents .flatlist p {
	display:table-cell;
	vertical-align:middle;
}
#contents .flatlist h3{
	width:40%;
	padding:5px 0;
}
#contents .flatlist p {
	padding:5px 0 5px 20px;
}








.tgmenu{
    display: none;
}
.tgmenu li{
    width: 100%;
}

  #tgbox{
    display: block;
    position: relative;
    width: 100%;
    background: #222;
  }
  #tgbox a{
    display: block;
    position: relative;
    padding: 12px 0 10px;
    border-bottom: 1px solid #444;
    color: #fff;
    text-align: center;
    text-decoration: none;
  }
  #tgbox:before{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    background: #fff;
  }
  #tgbox a:before, #tgbox a:after{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 4px;
    background: #222;
  }
  #tgbox a:before{
    margin-top: -6px;
  }
  #tgbox a:after{
    margin-top: 2px;

  }
.tgmenu li{
	padding: 14px 0px;
	width: 100%;
	text-indent: 10px;
	font-size: 14px;
	background-color: #666;
	color: #FFF;
}

.tgmenu a:link{
	color: #FFF!important;
}
.tgmenu a:visited{
	color: #FFF!important;
}
.tgmenu a:hover{
	color: #FFF!important;
	text-decoration: underline!important;
}
.tgmenu a:active{
	color: #FFF!important;
}

.bgbox {
	clear: both;
	margin-bottom: 20px;
}

.bgclear{
	clear: both;
}
.bgbox p{
	line-height: 1.6;
}

.bgbox-left {
	float: none;
	width: 100%;
	text-align: center;
}
.bgbox-left img{
	margin-bottom: 10px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.bgbox-right {
	float: none;
	width: 100%;
}
.bgbox2 {
	clear: both;
	margin-bottom: 20px;
}
.bgbox2 p{
	line-height: 1.6;
}
.bgbox2-left {
	float: none;
	width: 100%;
}
.bgbox2-right {
	float: none;
	width: 100%;
	text-align: center;
}
.bgbox2-right img{
	margin-bottom: 10px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
#snsbox {
	width: 100%;
}
#snsboxleft {
	width: 100%;
	float: none;
	margin-bottom: 20px;
}
#snsboxright {
	width: 100%;
	float: none;
}