@charset "UTF-8";

	
/* example
----------------------------------------------- */
	

.anim{
	-moz-transition: -moz-all 300ms cubic-bezier(.50,.0,.50,1);
    -webkit-transition: -webkit-all 300ms cubic-bezier(.50,.0,.50,1);
    -o-transition: -o-all 300ms cubic-bezier(.50,.0,.50,1);
    -ms-transition: -ms-all 300ms cubic-bezier(.50,.0,.50,1);
    transition: all 300ms cubic-bezier(.50,.0,.50,1);
}

p:nth-of-type(2){}


p:last-child{}





/* class
----------------------------------------------- */
a.btn{ display:block;  text-indent: 200%; white-space: nowrap;overflow: hidden;height:inherit;}


ul.sns{}
ul.sns li{ display:inline-block; margin-right:10px;}

ul.sns li.facebook { width:20px; height:20px;}
ul.sns li.twitter { width:23px; height:20px;}


ul.arrowLink{}
ul.arrowLink li{ position:relative; margin-bottom:10px;}
ul.arrowLink li a{ display:block; padding-left:1.5em; line-height:1.5;}
ul.arrowLink li a:before{
		content:"→";
		display:block;
		position:absolute;
		left:0px;
		top:2px;
}


ul.arrowLink li:last-child{ margin-bottom:0;}

.big{ font-weight:900; font-size:1.5em;}


.entryBody .video{
  position:relative;
  width:100%;
  padding-top:56.25%;
	margin-bottom: 1em;
}
.entryBody .video iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}

.entryBody .ricoh-theta-spherical-image{}


.entryBody .ricoh-theta-spherical-image{
  position:relative;
  width:100% !important;
	height: 0 !important;
  padding-top:56.25% !important;
	margin-bottom: 1em;
}
.entryBody .ricoh-theta-spherical-image iframe{
  position:absolute;
  top:0;
  right:0;
  width:100% !important;
  height:100% !important;
}


/* header footer
----------------------------------------------- */
header.global{ position:fixed; top:-120px; left:0; z-index:1000; background-color:transparent; width:100%; height:60px; display:block; background-color:#fff;box-shadow:0px 0px 11px -2px #ccc;}

header.global.active{ top:0; transition: all 800ms ease-in-out; }


header.global h1{ display:inline-block; font-weight:300; text-align:left; margin:auto; line-height:60px; font-size:1.4rem; opacity:0; transition: all 800ms ease-in-out;transition-delay:0.5s;}
	
	body:not(.home) header.global h1{ opacity:1 !important;}
	header.global h1.active{ opacity:1;}
	header.global h1 span{ color:#0080b1;}


header.global #spBtn{ position:absolute; width:70px; height:60px; top:0px; left:0px; z-index:2000; cursor:pointer; display:none;}
	
	header.global #spBtn.active{ display:block;}
	header.global #spBtn.active div{ background-color:#ccc; }
	
		
	header.global #spBtn div{ background-color:transparent; width:30px; height:3px;position:absolute; left:20px;transition: all 300ms; }
	
		.touchDevice header.global #spBtn div{ top:19px; width:70px; height:6px;left:20px;}
		
		/*body:not(.home) header.global #spBtn{ display:block;}
		body:not(.home) header.global #spBtn div{background-color:#ccc;}*/
		
		body header.global #spBtn{ display:none;}
		body header.global #spBtn div{background-color:#ccc;}
	
	header.global #spBtn div:nth-of-type(1){ top:16px;}
	header.global #spBtn div:nth-of-type(2){ top:22px;}
	header.global #spBtn div:nth-of-type(3){ top:28px;}
	header.global #spBtn div:nth-of-type(4){ top:34px;}
	header.global #spBtn div:nth-of-type(5){ top:40px;}
	header.global #spBtn:hover div{ background-color:#c00 !important;}
	
	
		.touchDevice header.global #spBtn div:nth-of-type(1){ top:19px;}
		.touchDevice header.global #spBtn div:nth-of-type(2){ top:33px;}
		.touchDevice header.global #spBtn div:nth-of-type(3){ top:47px;}
		.touchDevice header.global #spBtn div:nth-of-type(4){ top:61px;}
		.touchDevice header.global #spBtn div:nth-of-type(5){ top:75px;}
		.touchDevice header.global #spBtn:hover div{ background-color:#c00 !important;}

	
	header.global #spBtn.close{ }
	header.global #spBtn.close div:nth-of-type(1){ top:27px; left:14px; width:40px;transform: rotate(-45deg)}
	header.global #spBtn.close div:nth-of-type(2),
	header.global #spBtn.close div:nth-of-type(3),
	header.global #spBtn.close div:nth-of-type(4){ opacity:0;}
	header.global #spBtn.close div:nth-of-type(5){ top:27px;left:14px; width:40px;transform: rotate(45deg)}
	
	
	
header.global ul.menu{ position:fixed; width:70px; height:60px; top:0px; left:0px; z-index:1001;}

	header.global ul.menu.done{ display:none;}
	body:not(.home) header.global ul.menu{}

header.global ul.menu li{ width:10rem; height:1em; line-height:1; margin:0 0 20px 0; display:block; text-align:left; font-size:1.5rem; white-space:nowrap; position:absolute;}

	header.global ul.menu li:nth-of-type(1){ position:absolute; top:6rem; left:20px;}
	header.global ul.menu li:nth-of-type(2){ position:absolute; top:9rem; left:20px;}
	header.global ul.menu li:nth-of-type(3){ position:absolute; top:12rem; left:20px;}
	header.global ul.menu li:nth-of-type(4){ position:absolute; top:15rem; left:20px;}
	header.global ul.menu li:nth-of-type(5){ position:absolute; top:18rem; left:20px;}
	
	header.global ul.menu li:after{ 
		content:''; 
		display:block; 
		background-color:#fff; 
		position:absolute; 
		top:0;
		right:0;
		width:100%;
		z-index:5;
		
		height:100%;
	}
	
	


header.global ul.menu li a{ cursor:pointer !important;color:#999;}
header.global ul.menu li a:hover{color:#c00;}
header.global ul.menu li span{ font-size:0.8em;color:#09C;}
header.global ul.menu li span:before{ content:'...'; display:inline-block; color:#999;}



header.global ul.link{ position:absolute; top:15px; right:30px; z-index:150;}
header.global ul.link li{ width:30px; height:30px; margin:0 10px; display:inline-block;}
header.global ul.link li img{ width:100%; height:auto;}







footer.global{ position:relative;}
footer.global:before{ content:''; display:block; width:100%; height:160px;background:url(img/bg_fixed_navi.png) top right no-repeat; position:absolute; top:-158px;}

footer.global:after{ content:''; display:block; width:200px; height:28px;background:url(img/logo_cp.svg) center left no-repeat; background-size:contain; position:absolute; top:-55px; left:30px;}

footer.global .inner{ width:100%; background-color:#000; min-height:300px; color:#fff;}

footer.global .inner .copyright{ padding-top:50px;}




#coverMenu{ position:fixed; top:60px; left:0; z-index:1000; width:100%; height:0; overflow:hidden; background-color:#fefefe;transition: all 500ms cubic-bezier(.50,.0,.50,1);}
#coverMenu.open{ height:100%;}
#coverMenu .inner{}
 
#coverMenu ul{ text-align:center; border-top:solid 1px #ccc;}
#coverMenu ul li{ font-size:2.5rem; line-height:1; border-bottom:dotted 1px #ccc;}
#coverMenu ul li a{ display:block; padding:40px; color:#666;}   


/* common
----------------------------------------------- */
section{ width:100%; box-sizing:border-box; padding:80px; position:relative;}

section.navigation{ padding-bottom:200px;}
	
section.entryList:nth-child(odd) { background-color:#F1F1F1;}

body.archive section.entryList:nth-child(odd){ background-color:#fff;}

section > .contents{ width:100%; max-width:1200px; margin:auto; overflow:hidden; position:relative; border:solid 0px #f30;}


section > .contents h2{ font-size:2rem; margin-bottom:40px;}

body.archive .entryList{ background-color:#f1f1f1;}

.boxList{}

.entryList article:nth-of-type(3){}



.entryList article.entry{
	width:calc(33.333% - 40px);
	float:left;
	margin:0 20px 40px 20px;
	background-color:#fff;
	border: 1px solid #E7E7E7;
	overflow:hidden;
}

.entryList article.entry a{ display:block;}
.entryList article.entry .thumb{ background-color:#fafafa; font-size:0; line-height:0; padding-top:56.3%; position:relative; overflow:hidden;}
.entryList article.entry .thumb .thumbImage{ width:calc(100% + 2px);; position:absolute; top:0; left:-1px;height:100%; }

.entryList article.entry .thumb .thumbImage:before{ content:''; display:block;width:100%; height:100%; opacity:0;position:absolute; top:0; z-index:195;}
.entryList article.entry .thumb.subtitle .thumbImage:before{background:url(./img/parts/black_40.png);}
.entryList article.entry .thumb .thumbImage:after{ font-size:1rem; line-height:1.5; content:attr(data-sub)''; color:#fff; display:block;  opacity:0;position:absolute; top:50%; left:50%; transform:translate3d(-50%,-50%,0); z-index:200;}

.entryList article.entry .thumb .thumbImage img{ width:100%; height:auto; position:absolute;top:50%; left:50%; z-index:190;transform: translate3d(-50%,-50%,0);}

.entryList article.entry .thumb .thumbImage img,
.entryList article.entry .thumb .thumbImage:before,
.entryList article.entry .thumb .thumbImage:after{transition: all 300ms cubic-bezier(.50,.0,.50,1); }


.entryList article.entry .inner{ padding:20px 20px 20px 20px; text-align:left;}
.entryList article.entry .meta{ font-size:0.7rem; line-height:1; margin-bottom:5px;}
.entryList article.entry .meta li{ display:inline-block;color:#39C; padding-right:5px; margin-right:5px; border-right:solid 0px #ccc;}
.entryList article.entry .meta li:nth-of-type(1){ }
.entryList article.entry .meta li:nth-of-type(2){ }
.entryList article.entry h3{ line-height:1.6;margin-bottom:5px;}
.entryList article.entry .excerpt{ font-size:0.8rem; display:none;}

.entryList article.entry:hover{}
.entryList article.entry a:hover .thumb .thumbImage img{
 -webkit-transform:translate3d(-50%,-50%,0)  scale(1.1);  
    -moz-transform:translate3d(-50%,-50%,0)  scale(1.1);  
	transform:translate3d(-50%,-50%,0) scale(1.1);  
	}
.entryList article.entry a:hover .thumb .thumbImage:before,
.entryList article.entry a:hover .thumb .thumbImage:after{  opacity:1;}






.boxList article.entry{ 
	border:solid 0px #E7E7E7;
	background-color:#fff;
	box-shadow:none;
}
.boxList article.entry .thumb{ }
.boxList article.entry .thumb .thumbImage:before{}
.boxList article.entry .inner{ padding:20px 0px 0px 0px;}
.boxList article.bentryox .meta{}
.boxList article.entry .meta li{}
.boxList article.entry h3{}
.boxList article.entry .excerpt{ }







.thumbList article.entry{ 
	border:solid 1px #E7E7E7;
	background-color:#F1F1F1;
	box-shadow:none;
	min-height:100px;
	position:relative;
	
}
.thumbList article.entry a{ display:block; height:100px;transition: all 300ms cubic-bezier(.50,.0,.50,1);}
.thumbList article.entry a:hover{background-color:#E7E7E7;}

.thumbList article.entry .thumb{     background-color: #fafafa;
    font-size: 0;
    line-height: 0;
	width:100px;
	height:100px;
    padding-top:0 !important;
    position:absolute;
	top:0;
	left:0;
    overflow: hidden;
	}
.thumbList article.entry .thumb .thumbImage:before{ display:none;}
.thumbList article.entry .thumb .thumbImage:after{ display:none;}
.thumbList article.entry .thumb .thumbImage img{ width:auto; height:100%;}
.thumbList article.entry .inner{ padding:14px 20px 10px 120px;}
.thumbList article.bentryox .meta{}
.thumbList article.entry .meta li{}
.thumbList article.entry h3{}
.thumbList article.entry .excerpt{ }





.textList article.entry{ 
	border:solid 1px #E7E7E7;
	background-color:#F1F1F1;
	box-shadow:none;
	
}
.textList article.entry a{ display:block;transition: all 300ms cubic-bezier(.50,.0,.50,1);}
.textList article.entry a:hover{background-color:#E7E7E7;}

.textList article.entry .thumb{ display:none;}
.textList article.entry .inner{ padding:14px 20px 10px 20px;}
.textList article.bentryox .meta{}
.textList article.entry .meta li{}
.textList article.entry h3{}
.textList article.entry .excerpt{ }



.entryList.col4  article.entry{
	width:calc(25% - 30px);
	margin:0 15px 30px 15px;
}

.entryList.col4  article.entry .thumb{ padding-top:56.3%; }
.entryList.col4  article.entry .thumb .thumbImage:before{ padding-top:56.3%;}

.entryList.col3  article.entry{
	width:calc(33.333% - 40px);
	margin:0 20px 40px 20px;
}

.entryList.col3  article.entry .thumb{ padding-top:56.3%; }
.entryList.col3  article.entry .thumb .thumbImage:before{ padding-top:56.3%;}

.entryList.col2 article.entry{
	width:calc(50% - 30px) !important;
	margin:0 15px 30px 15px !important;
}

.entryList.col2 article.entry .thumb{  padding-top:56.3%; }
.entryList.col2 article.entry .thumb .thumbImage:before{  padding-top:56.3%; }
    


/* top
----------------------------------------------- */
section#siteEntrance{ height:100vh; min-height:500px; background-color:#fff; padding:0 !important; overflow:hidden;}

	section#siteEntrance.close{ transition: all 1200ms cubic-bezier(.2,.95,.35,1) ; height:0 !important;min-height:inherit;}

section#siteEntrance .area{ background:url(img/logo_block.png) center center no-repeat; background-size:contain; border:solid 0px #f30; width:10%; position:absolute; top:50%; left:50%;
}

section#siteEntrance .area.close{ transition: all 500ms ease-in; transform-origin:center center;transform: scale(0,0); opacity:0;}

section#siteEntrance .area:before{ content:''; display:block; width:100%; padding-top:100%;}







section#siteTopMain{  box-sizing:border-box; padding:0px 0px 0 0px; min-height:inherit;}

section#siteTopMain div.slideBox{ width:100%; padding-top:56.3%; }



section#siteTopMain .siteIndex{ color:#fff; position:absolute; top:50%; left:50%;transform:translate3d(-50%,-50%,0); z-index:200;}
section#siteTopMain .siteIndex h2{ font-size:5rem; margin-bottom:20px; line-height:1;}
section#siteTopMain .siteIndex ul.menu{ font-size:1.0rem; letter-spacing:0.2em; white-space:nowrap;}
section#siteTopMain .siteIndex ul.menu li{ display:inline-block; padding:0 20px; border-right:solid 1px #fff; line-height:1.2;}
section#siteTopMain .siteIndex ul.menu li:last-child{ border-right:0;}
section#siteTopMain .siteIndex ul.menu li .subInner{}
section#siteTopMain .siteIndex ul.menu li .subInner a{ color:#fff; display:inline-block; padding:3px 6px; transition: all 250ms ease-in; font-weight:700;}
section#siteTopMain .siteIndex ul.menu li .subInner a:hover{ background-color:#fff; color:#333;}


/* new
----------------------------------------------- */
section#new{}



/* active
----------------------------------------------- */
section#active{ background-color:#fff;}




/* entry
----------------------------------------------- */
body.single{}

body.single #siteTopMain{ height:auto;}

body.single #siteTopMain .category{ padding-top:100px;}
body.single #siteTopMain .category ul.cat{}
body.single #siteTopMain .category ul.cat li{ display:inline-block; margin:0px; font-size:0.8em;}
body.single #siteTopMain .category ul.cat li:after{ content:' , '; display:inline-block;}
body.single #siteTopMain .category ul.cat li a{ color:#39C; padding:0 3px 0 5px;}
body.single #siteTopMain .category ul.cat li:last-child:after{ display:none;}

body.single #siteTopMain h2{ padding:20px 30px 10px 30px; margin-bottom:10px; font-size:2.8rem; line-height:1.4; max-width:800px;}

body.single #siteTopMain .excerpt{ margin-bottom:20px;}

body.single #siteTopMain .contents{ }
body.single #siteTopMain .contents img{ width:100%; height:auto;}

section.entryDetail{ padding-bottom:200px;}
section.entryDetail article.entry{ width:100%; margin:auto; max-width:800px; float:none; text-align:left;}


       
section.entryDetail article.entry .detailMeta{ position:relative; margin-bottom:60px; padding:23px 150px 25px 0; border-top:solid 1px #ccc;border-bottom:solid 1px #ccc; min-height:60px;}

section.entryDetail article.entry .detailMeta h3{ font-size:1.5rem; margin-bottom:30px;font-weight:700;}
section.entryDetail article.entry .detailMeta .tags{}
section.entryDetail article.entry .detailMeta .tags li{ display:inline-block;}
section.entryDetail article.entry .detailMeta .tags li a{ display:inline-block; padding:5px 10px; line-height:1; font-size:0.8em; background-color:#ccc; border:solid 0px #666; border-radius:3px; color:#fff; margin:0 5px 0 0;font-weight:100;}

section.entryDetail article.entry .detailMeta .share{ position:absolute; right:0; top:50%; margin-top:-10px; overflow:hidden;}
section.entryDetail article.entry .detailMeta .share li{ display:inline-block; width:20px; height:20px; margin-left:5px; float:right;}
section.entryDetail article.entry .detailMeta .share li a svg{ width:100%; height:auto;fill: #999; }

section.entryDetail article.entry .tools{ text-align:right;}
section.entryDetail article.entry .tools a{ font-size:10px; color:#ccc;}

section.entryDetail article.entry .entryBody{ font-size:1.2rem; margin-bottom:50px;border-top:solid 1px #ccc; padding-top:50px;}
section.entryDetail article.entry .entryBody a{text-decoration:underline; color: #39C;}

section.entryDetail article.entry .entryBody .color{ color: #39C;}

section.entryDetail article.entry .entryBody h3{ font-size:1.5rem; padding-top: 30px; margin-bottom:1.5em;font-weight:500;}

section.entryDetail article.entry .entryBody h4{ font-size:2.2rem; padding-top: 30px; margin-bottom:1em;font-weight:500;}
section.entryDetail article.entry .entryBody h4:first-child{ padding-top: 0px;}
section.entryDetail article.entry .entryBody h5{ font-size:1.1rem; padding-top: 30px; margin-bottom:1em;font-weight:500;}



section.entryDetail article.entry .entryBody p{ margin-bottom:1em;}
section.entryDetail article.entry .entryBody img{width:100%; height:auto;}

section.entryDetail article.entry .entryBody div.set1{ overflow:hidden; margin-bottom:1em;}
section.entryDetail article.entry .entryBody div.set1 img{ width:100%; height:auto;float:none; display:inline-block; margin-bottom:2px;}

section.entryDetail article.entry .entryBody div.set2{ overflow:hidden; margin-bottom:1em;}
section.entryDetail article.entry .entryBody div.set2 img{ width:calc(50% - 1px); height:auto;float:left; display:inline-block; margin-bottom:2px;}
section.entryDetail article.entry .entryBody div.set2 img:nth-child(odd) { margin-right:1px}
section.entryDetail article.entry .entryBody div.set2 img:nth-child(even) { margin-left:1px}

section.entryDetail article.entry .entryBody div.set2 img.full{ width:100% !important; margin:0 0 2px 0 !important;}

section.entryDetail article.entry .entryBody div.set3{ overflow:hidden; margin-bottom:1em;}
section.entryDetail article.entry .entryBody div.set3 img{ width:calc(33.333% - 1.5px); height:auto;float:left; display:inline-block;margin:0 2px 2px 0;}
section.entryDetail article.entry .entryBody div.set3 img:nth-of-type(3n){ margin-right:0;}

section.entryDetail article.entry .entryBody div.set3 img.full{ width:100% !important; margin:0 0 2px 0 !important;}



section.entryDetail article.entry .entryBody div.set2 br,
section.entryDetail article.entry .entryBody div.set3 br,
section.entryDetail article.entry .entryBody div.set4 br{ display:none;}

section.entryDetail article.entry .entryBody div.set2 p,
section.entryDetail article.entry .entryBody div.set3 p,
section.entryDetail article.entry .entryBody div.set4 p{ font-size:0; padding:0; margin:0; display:inline; line-height:0;}

section.entryDetail article.entry .entryBody div.subSet{ background: #f2f2f2; padding: 20px 30px 30px 30px; text-align: center; border: dashed 2px #39C;}
section.entryDetail article.entry .entryBody div.subSet:before {
  content: attr(data-caption)"";
	display: block;
}