@charset "UTF-8";

/*------------------------
font
------------------------*/

::-moz-selection {
  color: #ffffff;
  background: #000000;
}

::selection {
  color: #ffffff;
  background: #000000;
} 

body {
	font-family:"trajan-pro-3","tk-a-otf-ud-reimin-pr6n",serif;
	background: url(/images/bg.gif) repeat;
	background-attachment: fixed;
	/*padding: 30px;*/
	font-size: 16px;
	line-height: 1.9;
	color: #000000;
}

.Trajan{
	font-family: "trajan-pro-3",serif;
	font-style: normal;
}

.Reimin{
	font-family: "tk-a-otf-ud-reimin-pr6n",serif;
	font-style: normal;
	transform: rotate(0.001deg);
}

.san-serif{
	font-family:'Hiragino Kaku Gothic ProN', meiryo, sans-serif;
}

.anti-aliasing{
	transform: rotate(0.001deg);
}

/*------------------------
common
------------------------*/

ul,li,nav,footer,header,section{
	box-sizing: border-box;
}

li{
	list-style: none;
}

a {
	text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: 400;
	box-sizing:border-box;
}
mark{
	background: none;
	font-size:120%;
	font-weight:bold;
	border:1px solid #231815;
	border-width:0 0 2px;
	padding:0 0 0.25em;
}

div{
	box-sizing:border-box;
}

img {
	width: 100%;
	vertical-align: bottom;
}
h1{

}


h2 {
	text-align: center;
	font-size:188%;
	line-height:1.0;
	font-weight: 400;
}

h3 {
	font-size: 138%;
	line-height: 1.5;
	font-weight: 600;
}

h4 {
	font-size:120%;
	line-height:1.5;
}

h5 {
	font-size:110%;
	line-height:1.5;
}

h5.speaker {
	font-size:100%;
	font-weight:bold;
}



hr.transparent{
	background: none;
	border: 0;
	margin: 0;
	height: 2em;
}

hr{
	height: 1px;
	background:#898989;
	border: 0;
	margin: 0;
}

hr.short{
	display:block;
	height: 2px;
	width:1.5em;
	background:#000000;
	border: 0;
	margin: 1em 0;
}

.animate-box {
	opacity: 0;
}

.InlineBlock{
	display:inline-block;
}

.mgB06{margin-bottom:6px !important;}
.mgB12{margin-bottom:12px !important;}
.mgB18{margin-bottom:18px !important;}
.mgB24{margin-bottom:24px !important;}
.mgB30{margin-bottom:30px !important;}
.mgB36{margin-bottom:36px !important;}
.mgB50{margin-bottom:50px !important;}
.mgB60{margin-bottom:60px !important;}
.mgB100{margin-bottom:100px !important;}
.mgB1em{margin-bottom:1em;}

.mgB0_5e{margin-bottom:0.5em !important;}
.mgB1e	{margin-bottom:1em !important;}
.mgB1_5e{margin-bottom:1.5em !important;}
.mgB2e	{margin-bottom:2em !important;}
.mgB2_5e{margin-bottom:2.5em !important;}
.mgB3e	{margin-bottom:3em !important;}
.mgB4e	{margin-bottom:4em !important;}
.mgB5e	{margin-bottom:5em !important;}
.mgB6e	{margin-bottom:6em !important;}

.z10{
	z-index:10;
}

.preloadImage{
	position: absolute;
	top: -100vh;
	left: -100vw;
	width: 0px;
	height: 0px;
}

.emphasis{
	font-weight:bold;
}

.weak{
	font-size:90%;
}

.txCenter{
	text-align:center;
}

.txRight{
	text-align:right;
}

.midCenter{
	vertical-align:middle;
	text-align:center;
}

.smaller1{font-size:0.95rem !important;}
.smaller2{font-size:0.88rem !important;}
.smaller3{font-size:0.77rem !important;}

.PConly{display:block;}
.SPonly{display:none;}

/*------------------------
element
------------------------*/


.PageNumber{
	font-size:10px;
	color:#aaaaaa;
	text-align:center;
	padding:0.125em 0 0;
}



.pict_full{
	position:relative;
}

#hero div.pict_full{
	position:relative;
	width:100%;
	overflow:hidden;
}

#hero div.pict_full:before{
    content:"";
    display: block;
    padding-top: 50%;
}

.pict_full video,
.pict_split video{
	width: 100%;
}

#hero div.pict_full img,
#hero div.pict_full video{
	position: absolute;
	top: 50%;
	left: 0;
	transform:translateY(-50%);
}

.pict_full h2{
	position:absolute;
	display:block;
	top:50%;
	width:100%;
	padding:0;
	/*transform:translateY(-50%);*/
	text-align:center;
	color:#ffffff;
}

.pict_1000{
	max-width:1000px;
}

.pict_1000 img{
	max-height: 600px;
}

.vertical {
	padding: 0px 20%;
}

.pict_800{
	max-width:800px;
	max-height: 700px;
	margin:0 auto;
}

.pict_800 img{
	max-height: 700px;
}

.pict_600{
	max-width:600px;
	max-height: 600px;
	margin:0 auto;
}

.pict_split{
	position:relative;
	display:table;
	table-layout: fixed;
	margin:0 auto;
}

.pict_split img{
	width: 100%;
}


.pict_split .cel_70{
	position:relative;
	display:table-cell;
	width:70%;
	overflow:hidden;
}

/*.pict_split .cel_70:before {
    content:"";
    display: block;
    padding-top: 55%;
}*/

.pict_split .cel_66{
	display:table-cell;
	width:66.6%;
}

.pict_split .cel_60{
	display:table-cell;
	width:60%;
}

.pict_split .cel_50{
	display:table-cell;
	width:50%;
}

.pict_split .cel_40{
	display:table-cell;
	width:40%;
}

.pict_split .cel_33{
	display:table-cell;
	width:33.3%;
}

.pict_split .cel_30{
	display:table-cell;
	width:30%;
	padding: 0 1em;
}

.pict_split .cel_625{
	display:table-cell;
	width:62.5%;
}

.pict_split .cel_375{
	display:table-cell;
	width:37.5%;
	padding: 0 0 0 1em;
	vertical-align:top;
}

.pict_split .cel_535{
	display:table-cell;
	width:53.5%;
}

.pict_split .cel_465{
	display:table-cell;
	width:46.5%;
	padding: 0 0.5em 0 0;
	vertical-align:top;
}

.pict_split .cel_465SP{
	display:none;
}

.text_comment{
	position:relative;
	padding-left:6em;
}

.text_comment h5{
	position:absolute;
	left:0;
	top:0;
	padding-right:1em;
}

.pict_flex{
	display:block;
}

.pict_flex li{
	display:inline-block;
	width:50%;
	vertical-align:top;
	padding:0 0 0 3em;
}

.pict_flex li.translatePos{
	transform: translateY(-7em);
	margin-bottom: -7em;
}

.pict_flex li div.img{
	/*display:block;*/
	width:63.333%;
}

a.gray_box{
	display:block;
	padding:1.5em;
	background:#fafafa;
	text-align:center;
	transition:1s;
}

a.gray_box:hover{
	background:#888888;
	color:#ffffff;
}

.img_discript{
	font-size:0.77rem;
	line-height:1.5;
}

.topTx{
	font-size: 170%;
	letter-spacing:1.5px;
	line-height:1.8;
	transform: translateX(-0.1em) translateY(0em);
}

a.Top{
	transition:1s;
}

a.Top img{
	transition:4s;
}

a.Top div{
	overflow:hidden;
}

a.Top:hover{
	opacity:0.7;
}

a.Top:hover img{
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-ms-transform: scale(1.05);
	-o-transform: scale(1.05);
	transform: scale(1.05);
}

/*------------------------
link
------------------------*/

a:link,a:visited{
	color:#231815;
}
a:hover{}

a.anibar{
  position: relative;
  display: inline-block;
}

a.anibar:link,
a.anibar:visited{
	color:#231815;
}

a.anibar:hover{
	text-decoration:none;
}

a.anibar:before,
a.anibar:after{
  position: absolute;
  top: 1.0em;
  content: "";
  display: inline-block;
  width: 0;
  height: 2px; 
  background: #231815;
  transition: 0.25s;
}
a.anibar:before{
  top: 1.5em;
}

a.anibar:before{
  left: 0;
}

a.anibar:hover:before{
  width: 100%;
}

/*------------------------
Loading
------------------------*/

#Loading{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100vh;
	background:#ffffff;
	z-index: 10;
	overflow:hidden;
}

#Loading #Loader{
	position:absolute;
	top:50%;
	left:50%;
	display:none;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width:80px;
	max-width:50%;
	/*animation: opLogo 1s 1 forwards;*/
}

/*@keyframes opLogo {to {	opacity:1;}}*/

#LoadImg{
	position:absolute;
	width:100%;
	overflow:hidden;
	height: 100%;
	top:0;
	animation: LoadImg 1s 1 0.5s forwards;
}
@keyframes LoadImg {to {top: -100%;}}

/*#LoadImg img{
	position: relative;
	top:0;
	animation: LoadImgContent 1s 1  forwards;
}
@keyframes LoadImgContent {to {top: 100%;}}*/


#Loading.Complete{
	animation: loadComp 1s 1 forwards;
}
@keyframes loadComp {to {top:-100vh;}}

#Loading.Complete #Loader{
	animation: loadCompImg 1s 1 forwards;
}
@keyframes loadCompImg {to {top:150%;}}


/*------------------------
map
------------------------*/

#map-canvas {
	width: 100%;
	height: 420px;
	margin: 0 auto;
}
.map-info {
	margin: 0 auto;
	max-width: 425px;
}
.map-info p.address {
	font-size: 110%;
	font-weight:bold;
}
.map-info dl.access-info {
	font-size: 90%;
}

.map-info dl.access-info dt{
	display:inline-block;
	width:20%;
	vertical-align:top;
}

.map-info dl.access-info dd{
	display:inline-block;
	width:80%;
	vertical-align:top;
}

/*-------------------------------
banner
---------------------------------*/

section.banner_area{
	padding: 5em 0;
}

ul.banner{
	display:block;
	max-width:580px;
	line-height: 0;
	margin: 0 auto;
}
ul.banner li {
	margin-bottom: 2em;
	transition:0.5s;
}

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

}
ul.banner li:hover{
	opacity: .8;
}

/*-------------------------------
nav
---------------------------------*/

nav {
	position:fixed;
	bottom:0;
	display:block;
	z-index:1;
	width:100%;
	height:70px;
	background:rgba(255,255,255,0.95);
	text-align:center;
}

nav ul{
	display:inline-block;
	margin:0 auto;
}

nav ul li{
	position:relative;
	display:inline-block;
	padding:0 1.5em;
	font-size:95%;
	line-height:70px;
	letter-spacing:1.5px;
}

nav ul li a{
	transition:1s;
}

nav ul li a:link,
nav ul li a:visited{
	color:#888888;
}

nav ul li a:hover{
	color:#000000;
}

nav ul li.isCurrent a:link,
nav ul li.isCurrent a:visited{
	color:#000000;
}

nav ul li.isCurrent a:before{
	content:'';
	position:absolute;
	top:13px;
	left:50%;
	width:7px;
	height:7px;
	background:#000000;
	border-radius:10em;
	transform:translateX(-50%);
}

.false{display:none;}

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

header{
	position:relative;
	display:block;
	background: #ffffff;
	width:100%;
	padding:32px 0 0;
	max-width: 1400px;
	margin: auto;
}

header h1#Logo{
	display:block;
	width:190px;
	margin:0 auto;
}

header #Logo h1 img{
	width:100%;
}

header h2#Name{
	position:absolute;
	left:100px;
	top:31px;
	display:inline-block;
	padding:0;
	font-size:61%;
	text-align:left;
	line-height:1.5;
}

header ul#SNS{
	position:absolute;
	right:100px;
	top:31px;
	display:inline-block;
}

header ul#SNS li{
	display:inline-block;
	padding:0 0 0 26px;
	font-size:0;
}

header ul#SNS li img{
	width:22px;
	height:22px;
}

/*-------------------------------
main
---------------------------------*/

main {
	width: 100%;
	/*max-width:1200px;*/
	position: relative;
	/*background:#cccccc;*/
	margin:0 auto;
}

/*-------------------------------
section Article
---------------------------------*/

section{
    padding: 2em 0;
}

section#Pager{
    padding: 3.5em 0 2em;
}

section.topPg{
	max-width:1200px;
	margin:0 auto;
    padding: 3em 0 0;
}

article{
	text-align:left;
	max-width:1000px;
	margin:0 auto;
}

article.max800{
	max-width:800px;
}

article img{
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 100%;
	margin: 0 auto;
	display: block;
}

.BgGray{
	background:#e5e5e5;
}

article dfn,
article cite,
article em,
i {
	font-style: italic;
}

article .alignleft {
	display: inline;
	float: left;
}

article img.alignleft {
	padding:0 1em 0 0;
}

article .alignright {
	display: inline;
	float: right;
}

article img.alignright {
	padding:0 0 0 1em;
}

article .aligncenter {
	display: block;
	margin-right: auto;
	margin-left: auto;
}

.galleryArea{
	max-width:1000px;
	margin:0 auto;
}

.galleryArea ul{
	display:block;
	margin:0 -12px;
}

.galleryArea ul li{
	display:inline-block;
	width:50%;
	padding:0 12px 24px;
	vertical-align: top;
}

/*-------------------------------
insta
---------------------------------*/

section#insta{
	text-align:center;
	padding:50px 100px 150px;
	background:#fafafa;
}

.instaThumb a{
	display:block;
	width:122px;
	padding:22px;
	border-radius:100em;
	background:#ffffff;
	margin: 0 auto;
	box-sizing:border-box;
}

h6.instaName {
	position:relative;
	display:inline-block;
	font-size:0.95rem;
	line-height:22px;
	padding:0 0 0 2em;
	font-family:'Hiragino Kaku Gothic ProN', meiryo, sans-serif;
}

h6.instaName img{
	position:absolute;
	left:0;
	top:0;
	width:22px;
	line-height:22px;
}

/*-------------------------------
footer
---------------------------------*/
footer {
	position:relative;
	background: #000000;
	padding: 32px 2em 100px;
	color:#ffffff;
	text-align:center;
}

footer ul{
	display:block;
}

footer ul li{
	display:inline-block;
	padding: 0 0.75em;
}

footer ul li{
	display:inline-block;
}

footer a:link,
footer a:visited{
	color:#ffffff;
}

footer p{
	font-size:11px;
}

footer p.copyright {
	font-size:12px;
}

footer #back2top {
	position:absolute;
	top:-37px;
	right:100px;
	width:40px;
	height:40px;
	text-align:center;
	color:#000000;
	font-size:77%;
	line-height:1.0;
}

footer #back2top a,
footer #back2top a:link,
footer #back2top a:visited{
	display:block;
	width:100%;
	height:100%;
	color:#000000;
}

footer #back2top a img{
	display:block;
	width:3px;
	margin: 4px auto 0;
	transition:1s;
}

footer #back2top a:hover img{
	margin: 10px auto 0;
}


/*　sns-area
================================*/
.sns-area {
	max-width: 425px;
	font-size:12px;
	margin: 0 auto;
	display: table;
}
.sns-area div {
	display: table-cell;
	width: 50%;
	line-height: 0;
}

.btn-fb {
	padding: 0 1.5em 0 0;
}
.btn-insta {
	padding: 0 0 0 1.5em;
}
.sns-area a:hover {
	opacity: 0.5;
	transition:0.6s;
}

/*-------------------------------
responsive
---------------------------------*/


@media screen and (max-width: 1400px) {
	header h2#Name {left: 7%;}
	header ul#SNS {right: 7%;}
	section#insta {padding: 50px 7% 125px;}
	footer #back2top {right: 7%;}
}

@media screen and (max-width: 1200px) {
	.pict_split .cel_465 {padding: 0 0.5em 0 1em;}
	.pict_split .cel_375 {padding: 0 1em 0 1em;}
		.topTx{font-size:2.6vw;}
	.pict_flex li.responsePad{padding-right:1em;}
}

@media screen and (max-width: 1024px) {
	article{padding:0 2em;}
	section#insta {padding: 50px 2em 100px;}
	footer #back2top {right: 2em;}
}


@media screen and (max-width: 768px) {
	body {font-size: 14px;}
	header h2#Name {left: 2em;}
	header ul#SNS {right: 2em;}

	.pict_split .cel_625{
		display:block;
		width:100%;
		padding:0 8% 0 0;
	}

	.pict_split .cel_625.responsePad{padding:0;}
	.pict_flex li.responsePad{padding:4em 8% 0;}

	.pict_split .cel_375{
		display:block;
		width:100%;
		padding:1em 5% 0 8%;
	}
	
	.pict_split .cel_535{
		display:block;
		width:100%;
		padding:0 0 0 8%;
	}
	
	.pict_split .cel_465{
		display:none
	}
	
	.pict_split .cel_465SP{
		display:block;
		width:100%;
		padding:1em 5% 0 8%;
	}
	
	.pict_flex li{
		width:100%;
	}
	
	.pict_flex li.translatePos{
		transform:none;
		margin:0;
	}
	
	.pict_flex li.responsePad div {
		margin: 0 0 0 auto;
	}
	
	.pict_flex li.responsePad .SPonly{
		width: 66%;
		margin: 0 0 0 auto;
		transform: translateX(4%);
	}
	
	
	.topTx {
		font-size: 24px;
		font-size:3.4vw;
		transform: none;
	}

	div.PConly{display:none;}
	div.SPonly{display:block;}


}

@media screen and (max-width: 640px) {
	.text_comment {padding-left: 4em;}
	footer #back2top {right: 50%; transform:translateX(50%);}
	section#insta {padding: 3em 2em 7em;}
	nav ul li{padding:0 0.75em;}

	header h1#Logo {width: 30%; min-width:150px;}

	.pict_split .cel_70{width:60%; height:200px;}
	.pict_split .cel_30{width:40%;}

	.pict_split .cel_70 img{
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: 25% 0px;
	}

	.pict_split .cel_70 img.posRight{
		object-position: 90% 0px;
	}
	
	.galleryArea ul {margin: 0 -9px;}
	.galleryArea ul li{padding:0 9px 18px;}

}

@media screen and (max-width: 480px) {
	body {font-size: 13px;}
	article{padding:0 1em;}
	section#insta {padding: 3em 1em 7em;}
	header {padding: 1em 0 0;}
	header h2#Name {left: 1.25em; top:1.5em;}
	header ul#SNS {right: 1em; top:1.5em;}
	header h2#Name span{display:block;}
	header ul#SNS li {padding: 0 0 0 12px;}
}

@media screen and (max-width: 400px) {
	.text_comment {padding-left: 3em;}
	nav ul li{font-size:95%;}
}

@media screen and (max-width: 360px) {
	.text_comment {padding-left: 3em;}
	nav ul li{padding: 0 0.5em;}
}