@charset "utf-8";
/*
Theme Name: LE66 PLATABLE
Theme URI: http://le66-platable.com/
Author: toshinoriCawai (office MONARCH)
Version: 2014
*/



/* LE66 PLATABLE ORIGINAL
-------------------------------------------------------------------------------*/

.translate{
position: absolute;
top: 50%;
left: 50%;
}



/*
-------------------
standard
-------------------
*/

.panel{
width:100%;
height:80px;
background:#eee;
position:fixed;
z-index:1000;
}

.top-logo{
position: absolute;
top:0;
left:5%;
z-index:101;
}

nav{
height:30px;
position: relative;
top:25px;
overflow: hidden;
z-index:100;
}

nav ul{
position: relative;
left: 50%;
float: left;
}

nav ul li{
position: relative;
left: -50%;
margin-right: 40px;
float: left;
}

nav ul li:last-child {
margin-right: 0;
}

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

nav ul li a:hover{
color:#000;
border-bottom:solid 1px #000;
}

nav.sns{
width:165px;
height:30px;
position: absolute;
top:25px;
right:5%;
z-index:1000;
}

.tel{
position: fixed;
bottom: 20px;
letter-spacing: .1em;
z-index: 1000;
width: 100%;
text-align: center;
}

.footpanel{
width:100%;
height:140px;
background:#222;
position:absolute;
bottom:0px;
padding:30px 0;
color:#fff;
text-align:center;
z-index:99;
}

.pagetop{
width:70px;
height:70px;
background:url(/img/arrow_top.png) no-repeat center center;
text-indent:-9999px;
position:absolute;
bottom: 100px;
right: 30px;
}



/*
-------------------
parallax
-------------------
*/

section{
width: 100%;
margin: 0 auto; 
position: relative;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover!important;
}

article{
width: 100%;
height: 100%;
padding:0;
background: url(/img/screen.png) repeat center center;
}

.flexslider ul.slides li article{
width: 100%;
height: 100%;
padding:0;
background:none;
text-shadow: 1px 1px 3px #000;
}



/* content
-------------------------------------------------------------------------------*/



/*
-------------------
top page
-------------------
*/

.welcome{
width:400px;
height:100px;
position:absolute;
left:50%;
top:20%;
margin:-50px 0 0 -200px;
background:url(/img/welcome.png) no-repeat center center;
z-index:99;
text-indent:-9999px;
}

.symbol{
width:250px;
height:250px;
position:absolute;
left:50%;
top:50%;
margin:-125px 0 0 -125px;
background:url(/img/symbol.png) no-repeat center center;
z-index:99;
text-indent:-9999px;
}

.scroll{
width: 75px;
height: 60px;
position: absolute;
top: 75%;
left: 50%;
margin: 0 0 0 -37px;
z-index: 100;
}



/*
-------------------
one ~ four
-------------------
*/

p.title{
width: 480px;
margin:-80px 0 0 -250px;
padding: 30px 0;
color: #fff;
font-size: 40px;
letter-spacing: 11px;
text-align: center;
border: solid 10px #fff;
}



/*
-------------------
news / snslist
-------------------
*/

.news{
width: 800px;
height: auto;
text-align: center;
}

.news h2,
.snslist h2{
margin-bottom:10px;
text-shadow: 1px 1px 3px #000;
}

.news ul{
width:600px;
margin:0 auto;
margin-bottom:30px;
text-align:left;
text-shadow: 1px 1px 3px #000;
display: inline-block;
}

.snslist ul{
width:600px;
margin:0 auto;
text-align:left;
}

.news ul li{
color:#fff;
line-height:250%;
}

.snslist ul li{
color:#fff;
line-height:300%;
}

.news ul li a,
.news ul li a:link,
.news ul li a:active,
.news ul li a:visited,
.snslist ul li a,
.snslist ul li a:link,
.snslist ul li a:active,
.snslist ul li a:visited{
color:#fff;
}

.news ul li a:hover,
.snslist ul li a:hover{
color:#000;
background:#fff;
text-decoration:none;
text-shadow:none;
}

ul.social li{
width:85px;
margin:0 32px;
float:left;
}

.news ul.social li a:hover,
.snslist ul li a:hover{
color:#000;
background:none;
text-decoration:none;
}

li.facebook{
background:url(/img/sns-fb.png) no-repeat left center;
padding-left:180px;
}

li.twitter{
background:url(/img/sns-tw.png) no-repeat left center;
padding-left:180px;
}

li.instagram{
background:url(/img/sns-insta.png) no-repeat left center;
padding-left:180px;
}

li.tumblr{
background:url(/img/sns-tumblr.png) no-repeat left center;
padding-left:180px;
}



/*
instafeed
*/

#instafeed{
display: inline-block;
margin-bottom: 30px;
}

#instafeed div.instalist{
width: 150px;
height: 150px;
margin:0 10px 10px 0;
overflow: hidden;
float: left;
}

#instafeed div.instalist:last-child {
margin-right: 0;
}


/*
insta overlay
*/

figure {
position: relative;
overflow: hidden;
text-align:center;
color:white;
}

figure a,
figure a:link,
figure a:active,
figure a:visited{color: white; text-decoration:none;}
figure a:hover {color: #ccc; text-decoration:underline;}

figcaption {
position: absolute;
top: 0;
left: 0;
z-index: 2;
width: 84%;
height: 84%;
padding: 8%;
overflow: hidden;
background: rgba(0,0,0,.6);
-webkit-transition: .3s;
transition: .3s;
opacity: 0;
}

figure:hover figcaption {
opacity: 1;
}

figcaption em {
font-size: 0.7rem;
font-weight:normal;
}



/*
-------------------
message
-------------------
*/

.message{
width: 770px;
height:auto;
margin:-298px 0 0 -385px;
text-align: center;
}

.concept{
margin:0 auto;
}

.conceptlogo{
width:280px;
height:160px;
position:absolute;
top:50%;
left:-15%;
margin-top:-70px;
}

.platable{
width:200px;
border:solid 8px #fff;
margin:30px auto;
padding:10px 80px;
font-size:20px;
}

.message p{
line-height:250%;
font-size: 18px;
text-shadow: 1px 1px 3px #000;
}



/*
-------------------
menu
-------------------
*/

.flexslider{
width: 100%;
height: 100%;
margin: 0!important;
}

.flex-viewport{
height: 100%;
}

.flexslider .slides {
zoom: 1;
height: 100%;
}

.flexslider .slides > li {
width: 100%;
height: 100%;
}

.flexslider .slides > li > div {
width: 890px;
height: 490px;
position: relative;
top: 50%;
left: 50%;
margin: -300px 0 0 -500px;
}

.flex-control-nav {
width: 100%;
position: absolute;
bottom: 8%;
text-align: center;
}

.flexslider:hover .flex-prev {
opacity: 1!important;
left: 5%!important;
}

.flexslider:hover .flex-next {
opacity: 1!important;
right: 5%!important;
}

.menu{
padding:50px;
}



/*
-------------------
menu list
-------------------
*/

#menulist table{
width: 890px;
height: 450px;
z-index:9;
}

#menulist caption{
margin-bottom: 10px;
padding: 7px 0;
color: #fff;
font-size: 1.2rem;
letter-spacing: 0.5rem;
text-align: center;
border-top: solid 3px #fff;
border-bottom: solid 1px #fff;
}

#menulist h2{
padding:3px 0;
color:#fff;
font-size:1rem;
text-align:center;
border: solid 1px #fff;
}

#menulist td{
vertical-align: middle!important;
padding: 0;
color:#fff;
font-size:0.9rem;
letter-spacing:0.1rem;
}

td.row{
width:35px;
}

td.menu{
width:375px;
line-height: 1.5rem;
}

td.price{
width:55px;
text-align:right;
}



/*
-------------------
information
-------------------
*/

.area{
padding:50px;
border:solid 10px #fff;
text-align: center;
text-shadow: 1px 1px 3px #000;
}

.area p {
    font-size: 16px;
}

img.floormap{
position: absolute;
left: 50%;
margin-left: -400px;
}



/*
-------------------
other
-------------------
*/

.award1 a{
width:81px;
height:59px;
background:url(http://le66-platable.com/wp-content/uploads/2014/08/nominee-white-right.png) no-repeat center center;
position:fixed;
top:110px;
right:0;
text-indent:100%;
white-space:nowrap;
overflow:hidden;
z-index:100;
}

.award2 a{
width:140px;
height:46px;
background:url(http://le66-platable.com/wp-content/uploads/2014/08/nominee-cssreel.png) no-repeat center center;
position:fixed;
bottom: 110px;
left: 0;
text-indent:100%;
white-space:nowrap;
overflow:hidden;
z-index:100;
}