@charset "UTF-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }
/* clearfix --*/
.clearFix:after{ content:"."; clear:both; display:block; height:0; visibility: hidden; overflow: hidden; }
/* alt --*/
.alttext  { display:block; text-indent:-9999px; overflow:hidden; }
a { text-decoration:none; }
hr { display: none; }
iframe[name="google_conversion_frame"] { position:absolute; top:0; left:0;}
html,body{
	width:100%;
	height:100%;
}

body {
	color: #808080;
	font-family:"Hiragino Kaku Gothic ProN","メイリオ",meiryo,sans-serif;
	font-family:Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-feature-settings: "palt";
	text-align: justify;
	min-width:1180px;
	min-height:700px;
	font-weight: 500;
}
body.sp{
	min-width:800px;
}

body,html{
	width:100%;
	height:100%;
	background:#000;
}
#nav li a.outer:after {
	background:url(../img/common2/icon-pop.png) right center no-repeat;
	content:'';
	display:inline-block;
	width:20px;
	height:10px;
	vertical-align:baseline;
}

#wrapper{
	position: relative;
	width:100%;
	height:100%;
	overflow: hidden;
}
h1{
	display: block;
}
h1 img{
	width:60%;
	max-width:240px;
}
h2{
	font-family: 'BioRhyme', serif;
	font-size:30px;
	letter-spacing: 0.1em;
	padding-bottom:1em;
	font-weight: 500;
}
#side{
	position: relative;
	height:100%;
	width:23.125%;
	float: left;
	background:#fff;
	/*border-right:1px solid #eee;*/
	box-sizing:border-box;
}
#side .main{
	position:absolute;
	top:50%;
	left:50%;
	width:100%;
	margin-top:-90px;
	-webkit-transform: translate(-50%,-50%);
	   -moz-transform: translate(-50%,-50%);
	    -ms-transform: translate(-50%,-50%);
	     -o-transform: translate(-50%,-50%);
	        transform: translate(-50%,-50%);
}
#side .menu{
	padding-top:30px;
}
#side .menu li{
	/*padding-bottom:5px;*/
}
#side .menu a{
	display: block;
	padding:8px 0;
	font-family: 'BioRhyme', serif;
	text-align: center;
	color:#000;
	font-size:11px;
	letter-spacing: 0.1em;
	-webkit-transition: all .8s ease-in-out;
	   -moz-transition: all .8s ease-in-out;
	    -ms-transition: all .8s ease-in-out;
	     -o-transition: all .8s ease-in-out;
	        transition: all .8s ease-in-out;
}
#side .menu a:hover{
	background:#000;
	color:#fff;
	-webkit-transition: all .2s ease;
	   -moz-transition: all .2s ease;
	    -ms-transition: all .2s ease;
	     -o-transition: all .2s ease;
	        transition: all .2s ease;
}
#side img{
	display: block;
	margin:0 auto;
}

#side .btn-atm{
	background:#bb9464;
	color:#fff;
	display: block;
	font-family: 'BioRhyme', serif;
	font-size:11px;
	letter-spacing: 0.1em;
	line-height:70px;
	margin:10px auto;
	text-align: center;
	width:250px;
}
#side .btn-atm:hover {
	opacity: .7;
}
#side .btn-backstage{
	background:#000;
	box-sizing:border-box;
	color:#bb9464;
	display: block;
	font-size:15px;
	height:70px;
	margin:0 auto;
	padding-top:20px;
	text-align: center;
	width:250px;
}
#side .btn-backstage span{
	display: block;
	font-family: 'BioRhyme', serif;
	font-size:11px;
	letter-spacing: 0.1em;
	line-height:20px;
}
#side .btn-backstage:hover {
	opacity: .7;
}


#content{
	width:76.875%;
	height:100%;
	overflow: hidden;
	position: relative;
}
#content>.inner{
	width:78%;
	height:100%;
	position: relative;
}
#copy-wrap{
	background:#fff;
	position:absolute;
	right:0;
	top:0;
	width:22%;
	height:100%;
	padding:10px 10px 140px 0;
	box-sizing:border-box;
}
.cont{
	position: relative;
	width: 100%;
	height: 100%;
}
span.line{
	letter-spacing: -0.1em;
}

.footer{
	background: #fff;
}
.footer small{
	padding:10px 0;
}
.footer img{
	display: block;
	margin:0px auto;
}
/****************************************************/


#nav{
	position: fixed;
	top:-50px;
	left:0;
	opacity: 0;
	border-bottom:1px solid rgba(0,0,0,0.14);
	width:100%;
	height:60px;
	background:#fff;
	/*background:rgba(255,255,255,0.5);*/
	z-index: 10;
	-webkit-transition: all .25s ease;
	   -moz-transition: all .25s ease;
	    -ms-transition: all .25s ease;
	     -o-transition: all .25s ease;
	        transition: all .25s ease;
	-webkit-transform: translateZ(0);
	   -moz-transform: translateZ(0);
	    -ms-transform: translateZ(0);
	     -o-transform: translateZ(0);
	        transform: translateZ(0);
}
body.atm #nav{
	top:0;
	opacity: 1;
}
#nav .inner{
	padding:13px 15px;
}
#nav li{
	display: inline-block;
}
#nav li a{
	display: block;
	font-family: 'BioRhyme', serif;
	text-align: center;
	color:#000;
	font-size:10px;
	letter-spacing: 0.01em;
	padding:12px 5px;
	-webkit-transition: all .25s ease;
	   -moz-transition: all .25s ease;
	    -ms-transition: all .25s ease;
	     -o-transition: all .25s ease;
	        transition: all .25s ease;
}
#nav a.title{
	float: left;
}
#nav span.roadshow{
	float: right;
}
#nav .main{
	float: left;
	padding-left:15px;
	padding-top:2px;
}
#nav .sub{
	float: right;
	padding-right:15px;
	padding-left:10px;
	padding-top:2px;
	border-left:1px solid #ccc;
}

#nav li a:hover{
	color:#b0844c;
}


#btn-top{
	position: fixed;
	width:60px;
	height:0px;
	bottom:0;
	right:25px;
	z-index: 12;
	opacity: 0;
	-webkit-transition: all .25s ease;
	   -moz-transition: all .25s ease;
	    -ms-transition: all .25s ease;
	     -o-transition: all .25s ease;
	        transition: all .25s ease;
}
#btn-top a{
	display: block;
	width:100%;
	height:100%;
	background:url(../img/common2/btn-top.png) no-repeat center center rgba(0,0,0,0.8);
}
body.atm #btn-top{
	opacity:1;
	height:60px;
}

#nav .btn {
	background:#000;
	color: #bb9464;
	display:block;
    float: right;
	font-size:13px;
	letter-spacing:.05em;
	line-height:25px;
	margin:6px 15px 5px 0;
	text-align:center;
	width:110px;
    -webkit-transition: all .25s ease;
    -moz-transition: all .25s ease;
    -ms-transition: all .25s ease;
    -o-transition: all .25s ease;
    transition: all .25s ease;
}
#nav .btn:hover {
	opacity:.7;
}


/****************************************************/

#cover{
	position: fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:#000;
	z-index: 111111111;
	-webkit-transform: translateZ(0);
	   -moz-transform: translateZ(0);
	    -ms-transform: translateZ(0);
	     -o-transform: translateZ(0);
	        transform: translateZ(0);
}

#cover .mark{
	width:46px;
	height:46px;
	position: absolute;
	top:50%;
	left:50%;
	margin:-23px 0 0 -23px;
	-webkit-transition: all .1s ease-in;
	   -moz-transition: all .1s ease-in;
	    -ms-transition: all .1s ease-in;
	     -o-transition: all .1s ease-in;
	        transition: all .1s ease-in;
}
#cover.hide .mark{
	opacity: 0;
	-webkit-transform: scale3D(0.8,0.8,1);
	   -moz-transform: scale3D(0.8,0.8,1);
	    -ms-transform: scale3D(0.8,0.8,1);
	     -o-transform: scale3D(0.8,0.8,1);
	        transform: scale3D(0.8,0.8,1);
}
#cover .mark>div{
	position: relative;
	width:100%;
	height:100%;
}
#cover .mark .base{
	opacity: 0.5;
}
#cover .mark .loader{
	opacity: 1;
	stroke-dasharray: 130;
	stroke-dashoffset: 100;
			animation: load 1s linear 0s infinite;
	     -o-animation: load 1s linear 0s infinite;
	    -ms-animation: load 1s linear 0s infinite;
	   -moz-animation: load 1s linear 0s infinite;
	-webkit-animation: load 1s linear 0s infinite;
	-webkit-animation-fill-mode:both;
	animation-fill-mode:both;
}
#cover .mark svg{
	position: absolute;
	top:0;
	left:0;
}
#cover .mark svg circle{
	fill:none;
	stroke:#fff;
	stroke-miterlimit:10;
	stroke-width:1px;
	-webkit-transition: all .2s ease;
	   -moz-transition: all .2s ease;
	    -ms-transition: all .2s ease;
	     -o-transition: all .2s ease;
	        transition: all .2s ease;
}
#cover.hide .base svg circle{
	stroke-width:50px;
}
#cover.hide .loader svg circle{
	stroke-width:0px;
}
@-webkit-keyframes load {
	0%{ -webkit-transform: rotate(0deg); }
	100%{ -webkit-transform: rotate(360deg); }
}
@-moz-keyframes load {
	0%{ -moz-transform: rotate(0deg); }
	100%{ -moz-transform: rotate(360deg); }
}
@-ms-keyframes load {
	0%{ -ms-transform: rotate(0deg); }
	100%{ -ms-transform: rotate(360deg); }
}
@-o-keyframes load {
	0%{ -o-transform: rotate(0deg); }
	100%{ -o-transform: rotate(360deg); }
}
@keyframes load {
	0%{ transform: rotate(0deg); }
	100%{ transform: rotate(360deg); }
}
/****************************************************/


#footer{
	position: absolute;
	bottom:0px;
	left:0;
	width:100%;
}
#footer img{
	display: block;
	margin:0 auto;
}
#footer #roadshow{
	display: block;
	padding:20px 0 10px;
}
#footer .share{
	text-align: center;
}
#checkin_iframe{
	width:98px!important;
}
#footer .share li{
	display: inline-block;
	padding:0 3px 2px;
}
.fb_iframe_widget > span,
#checkin_iframe>span {
	vertical-align: baseline !important;
}
small{
	display: block;
	padding-top:3px;
	padding-bottom:10px;
}
#footer .sns{
	display: block;
	width:100%;
	line-height: 0;
}
#footer .sns li{
	display: inline-block;
	width: 50%;
	line-height: 0;
}
#footer .sns li a{
	display: block;
	width:100%;
	height:35px;
}
#footer .sns li.tw a{
	background: url(../img/common2/menu-tw.png) no-repeat center center #55acee;
}
#footer .sns li.fb a{
	background: url(../img/common2/menu-fb.png) no-repeat center center #3b579d;
}
/*#footer ul{
	display: block;
	background:url(../img/common/biling.png) no-repeat center center;
	width:428px;
	height:43px;
	margin-bottom:10px;
	overflow: hidden;
}
#footer ul li{
	display: block;
	text-indent: -9999px;
	overflow: hidden;
}
#footer a{
	display: block;
	width:200px;
	border:1px solid #8e7c45;
	padding:8px 0;
	margin:0px auto 10px;
	-webkit-transition: all .2s ease;
	   -moz-transition: all .2s ease;
	    -ms-transition: all .2s ease;
	     -o-transition: all .2s ease;
	        transition: all .2s ease;
}
#footer a:hover{
	background:#352e18;
}
*/


/**************************************************/

.video-wrapper{
	/*display:none;*/
	position: fixed;
	width:100%;
	height:100%;
	top:0;
	left:0;
	z-index: 11111;
	background:#000;
}
.video-content{
	position: absolute;
	top:50%;
	left:50%;
	width:960px;
	height:540px;
	/*border:1px solid #333;*/
	margin:-300px 0 0 -480px;
}
.video-player{
	width:100%;
	height:100%;
	background:#000;
}
.video-nav{
	width:100%;
	text-align: center;
	line-height: 1;
	padding-top: 20px;
}
.op .video-nav{
	display: none;
}
.video-nav li{
	display: inline-block;
	padding:0 5px;
}
.video-nav li a{
	cursor: pointer;
	display: block;
	width:200px;
	padding:10px 20px;
	color:#000;
	background:#ccc;
    border: solid 1px #ccc;
	letter-spacing: 0.1em;
	line-height: 18px;
	font-size:13px;
	-webkit-transition: all .2s ease;
	   -moz-transition: all .2s ease;
	    -ms-transition: all .2s ease;
	     -o-transition: all .2s ease;
	        transition: all .2s ease;
}
.video-nav li:nth-child(1) a{
	/*font-size:11px;*/
}
.video-nav li.cur a,
.video-nav li a:hover{
	background:#000;
	color:#ccc;
	border: solid 1px #ccc;
	text-decoration: none;
}
.video-nav li.cur a{
	cursor: default;
}
.video-close{
	position: absolute;
	top:20px;
	right:20px;
	/*margin: -302px 0 0 485px;*/
}

/**************************************************/